|
|
@@ -34,7 +34,21 @@
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</template>
|
|
|
-
|
|
|
+ <template v-if="tool.type==='size'">
|
|
|
+ <el-popover
|
|
|
+ popper-class="select-font-size"
|
|
|
+ placement="bottom"
|
|
|
+ v-model="visible"
|
|
|
+ width="70"
|
|
|
+ trigger="click">
|
|
|
+ <div class="font-size-list">
|
|
|
+ <div @click.stop="chooseSize(item)" :class="{'choose-size':option.fontSize==item}" :id="'size'+item" class="font-size-item" v-for="(item,index) in fontSizeList" :key="index" >{{ item }}px</div>
|
|
|
+ </div>
|
|
|
+ <el-tooltip slot="reference" effect="dark" :content="tool.title" placement="top">
|
|
|
+ <span v-html="tool.icon"></span>
|
|
|
+ </el-tooltip>
|
|
|
+ </el-popover>
|
|
|
+ </template>
|
|
|
<template v-if="tool.type==='color'">
|
|
|
<el-tooltip effect="dark" :content="tool.title" placement="top">
|
|
|
<div class="color-picker-box">
|
|
|
@@ -78,7 +92,7 @@ export default {
|
|
|
*/
|
|
|
tools:{
|
|
|
type:'String',
|
|
|
- default:'cell-point-type,cell-merge,font-color,condition-format,cell-decimal,cell-align',
|
|
|
+ default:'cell-point-type,cell-merge,font-color,condition-format,cell-decimal,cell-align,font-size',
|
|
|
},
|
|
|
// 回显参数
|
|
|
echoParameter:{
|
|
|
@@ -89,6 +103,17 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
+ visible:{
|
|
|
+ handler(nval) {
|
|
|
+ console.log(nval)
|
|
|
+ if(nval){
|
|
|
+ if(this.option.fontSize){
|
|
|
+ this.scrollTo('size'+this.option.fontSize)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deep:true
|
|
|
+ },
|
|
|
cell:{
|
|
|
handler(nval) {
|
|
|
if(nval) {
|
|
|
@@ -99,6 +124,7 @@ export default {
|
|
|
}:{
|
|
|
nt: "",//numberType
|
|
|
pn: 0,//ponitNum
|
|
|
+ fontSize:''
|
|
|
}
|
|
|
this.option.decimal=!isNaN(parseFloat(this.option.decimal)) && isFinite(this.option.decimal)?this.option.decimal:undefined
|
|
|
}else{
|
|
|
@@ -106,6 +132,7 @@ export default {
|
|
|
this.option ={
|
|
|
nt: "",//numberType
|
|
|
pn: 0,//ponitNum
|
|
|
+ fontSize:''
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
@@ -114,6 +141,7 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ visible:false,
|
|
|
option: {
|
|
|
nt: "",//numberType number percent
|
|
|
pn: 0,//ponitNum
|
|
|
@@ -124,6 +152,7 @@ export default {
|
|
|
fontColor:'',
|
|
|
backColor:'',
|
|
|
},
|
|
|
+ fontSizeList:["6","8","10","12", "13","14","15", "16", "18", "20", "22", "24", "28", "32", "36", "40"],
|
|
|
predefineColors: [
|
|
|
'#ff4500',
|
|
|
'#ff8c00',
|
|
|
@@ -205,7 +234,15 @@ export default {
|
|
|
title:this.echoParameter.hasMergedCell?this.$t('ETable.Btn.unmerge'):this.$t('ETable.Btn.merge_cell'),
|
|
|
tool:'cell-merge'
|
|
|
},
|
|
|
-
|
|
|
+ {
|
|
|
+ icon: `<svg t="1733796725915" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2327" width="20" height="20">
|
|
|
+ <path d="M1021.7 855.6L867 430.5c-3.1-11.6-11.6-21.5-23.7-26-10-3.7-21.1-3-30.7 2s-16.4 13.6-19.2 24L638.6 855.6c-7.2 19.8 3.1 41.5 22.8 48.7 19.8 7.2 41.5-3.1 48.7-22.8l40.1-110.2h160l40.1 110.2c7.2 19.8 29.1 29.9 48.7 22.8 19.7-7.2 29.9-29.1 22.7-48.7z m-244-160.3L830 551.4l52.4 143.9H777.7zM149.7 693.8l-46 128.7c-3.7 10.4-7.5 20.5-11.3 30.2-3.7 9.8-8 18.7-12.9 26.8-4.8 8.2-10.4 14.7-16.8 19.5-6.3 4.8-13.6 7.3-21.9 7.3-15 0-26.5-4.6-34.7-14-8.2-9.4-8.2-26.6 0-52.1l235.3-683.9c3.7-11.9 10.3-21.4 19.5-28.6 9.4-7 21.4-10.6 36.4-10.6 15.6 0 28.3 3.6 38.1 10.6s16.4 16.7 20.2 28.6l236.2 686.3c6.1 17.9 6.3 33 1.1 45.4-5.2 12.2-17.6 18.5-37 18.5-12.7 0.7-22.9-2.7-30.8-10.6-7.9-7.9-13.6-18.1-17.3-30.8L446.2 694l-296.5-0.2z m276.6-78.2L298.6 231.5 171.1 615.6h255.2z" p-id="2328" fill="#333333"></path>
|
|
|
+ </svg>`,
|
|
|
+ key: 'fontSize',
|
|
|
+ type:'size',
|
|
|
+ title: this.$t("MixSheet.font_size"),
|
|
|
+ tool:'font-size'
|
|
|
+ },
|
|
|
{
|
|
|
icon: `<svg width="23" height="23" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
|
|
<path d="M8.875 1.25H11.125L16.25 13.75H14.125L12.875 10.5H7.125L5.875 13.75H3.75L8.875 1.25ZM7.75 9H12.25L10 3.375H9.875L7.75 9Z" fill="#333333"/>
|
|
|
@@ -309,6 +346,14 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
methods: {
|
|
|
+ // 滚动到指定位置
|
|
|
+ scrollTo(id) {
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ document.getElementById(id).scrollIntoView({
|
|
|
+ behavior: 'smooth' // 平滑滚动
|
|
|
+ });
|
|
|
+ })
|
|
|
+ },
|
|
|
// 当新增状态不可添加条件格式
|
|
|
handlerClickTj(){
|
|
|
this.$message({
|
|
|
@@ -351,6 +396,21 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
+ // 选择字号
|
|
|
+ chooseSize(val){
|
|
|
+ this.visible=false
|
|
|
+ this.cellArray.map(item =>{
|
|
|
+ if(!item.merData || item.merData.type=='merge'){
|
|
|
+ this.chooseCellSize(val,item)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /* 处理单个单元格字号 */
|
|
|
+ chooseCellSize(size,cell) {
|
|
|
+ let sizeObj={'fontSize':`${size}`}
|
|
|
+ let cellValueStyle = cell.ShowStyle?JSON.parse(cell.ShowStyle):{}
|
|
|
+ cell.ShowStyle = JSON.stringify({...cellValueStyle,...sizeObj})
|
|
|
+ },
|
|
|
/* 处理单个单元格 */
|
|
|
chooseCellColor(type,color,cell) {
|
|
|
let colorObj=type==='font'?{'color':`${color}`}:{'background-color':`${color}`}
|
|
|
@@ -579,4 +639,26 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+.select-font-size{
|
|
|
+ width: 65px;
|
|
|
+ min-width: 65px;
|
|
|
+ height:275px;
|
|
|
+ overflow-y: auto;
|
|
|
+ padding:12px 0;
|
|
|
+ .font-size-list{
|
|
|
+ .font-size-item{
|
|
|
+ cursor: pointer;
|
|
|
+ padding: 5px 0;
|
|
|
+ text-align: center;
|
|
|
+ &:hover{
|
|
|
+ background: #DEE0E2;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .choose-size{
|
|
|
+ background: #409EFF;
|
|
|
+ color: white;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
