1、添加表格自动换行

2添加表格列字体对其方式特殊属性 3添加折线图滑块默认100%

1、添加表格自动换行
2添加表格列字体对其方式特殊属性 3添加折线图滑块默认100%
qianbao
1 parent 1ea22c3f
Showing 9 changed files with 86 additions and 21 deletions
config/dev.env.js
src/mixins/queryform.js
src/views/bigscreenDesigner/designer/components/dynamicAddTable.vue
src/views/bigscreenDesigner/designer/tools/configure/lineCharts/widget-linechart.js
src/views/bigscreenDesigner/designer/tools/configure/table/widget-table.js
src/views/bigscreenDesigner/designer/widget/div/widgetDtImage.vue
src/views/bigscreenDesigner/designer/widget/div/widgetHtmlSlider.vue
src/views/bigscreenDesigner/designer/widget/table/widgetTable.vue
src/views/screenDesigner/components/dynamicAddTable.vue
@@ -5,7 +5,7 @@ const prodEnv = require(&#39;./prod.env&#39;)
 const isDev = false;
 //开发API地址
 // const devAdrress='"http://weberp.xlyprint.cn/xlyReport"';
-const devAdrress='"http://127.0.0.1:8080/xlyReport"';
+const devAdrress='"http://172.16.114.9:8085/xlyReport"';
 //正式打包API地址
 const ipAdrress='"http://"+location.host+"/xlyReport"';
@@ -178,8 +178,6 @@ export default {
         const value = chartProperties[key];
         obj["type"] = value;
         obj["name"] = key;
-        console.log("3333333",value,key);
-        console.log("22222222",chartProperties,data);
         for (let i = 0; i < data.length; i++) {
           if (value.startsWith("xAxis")) {
             // 代表为x轴
@@ -216,7 +214,7 @@ export default {
         const value = chartProperties[key];
         obj["type"] = value;
         obj["name"] = key;
-        console.log("value",value);
+        // console.log("value",value);
         if(value=='xAxis' || value=='bar'|| value=='line'){
           for (let i = 0; i < data.length; i++) {
             if (value.startsWith("xAxis")) {
@@ -12,6 +12,7 @@
       <el-table-column prop="name" label="名称" width="60" />
       <el-table-column prop="key" label="key值" width="70" />
       <el-table-column prop="width" label="宽度" width="50" />
+      <el-table-column prop="textAlignCol" label="对齐" width="50" />
       <el-table-column label="操作" width="100">
         <template slot-scope="scope">
           <div class="button-group">
@@ -63,6 +64,19 @@
           >
           </el-input>
         </el-form-item>
+        <el-form-item label="对齐:">
+          <el-select
+            v-model.trim="rowFormData['textAlignCol']"
+            placeholder="请选择"
+            size="mini"
+          >
+            <el-option label="无" value="none"></el-option>
+            <el-option label="居中" value="center"></el-option>
+            <el-option label="左对齐" value="left"></el-option>
+            <el-option label="右对齐" value="right"></el-option>
+            <el-option label="两端对齐" value="justify"></el-option>
+          </el-select>
+        </el-form-item>
       </el-form>
       <span slot="footer" class="dialog-footer">
         <el-button size="mini" @click="dialogVisible = false">取 消</el-button>
@@ -89,7 +103,8 @@ export default {
       rowFormData: {
         name: "",
         key: "",
-        width: ""
+        width: "",
+        textAlignCol: ""
       },
       flag: true, // true 新增， false 编辑
       indexEditor: -1, // 编辑第几个数据
@@ -596,7 +596,7 @@ export const widgetLinechart = {
               name: 'startZoom',
               required: false,
               placeholder: '',
-              value: 80,
+              value: 0,
             },
             {
               type: 'el-slider',
@@ -63,6 +63,14 @@ export const widgetTable = {
           value: true
         },
         {
+          type: 'el-switch',
+          label: '是否自动换行',
+          name: 'bAutoHeight',
+          required: false,
+          placeholder: '',
+          value: true
+        },
+        {
           type: 'el-select',
           label: '动画效果',
           name: 'effect',
@@ -108,10 +108,15 @@ export default {
       }
     },
     getEchartData() {
-      this.imageAdress=this.getShowPic();
+      const imageAdressOld =this.imageAdress;
+      const imageAdressNew =this.getShowPic();
+      //this.imageAdress = this.getShowPic();
       this.imageAdressShow = this.isNotBlank(this.imageAdress);
-      // console.log("this.imageAdress",this.imageAdress, this.imageAdressShow)
-      this.reload();
+      // console.log("this.imageAdress",imageAdressOld, imageAdressNew,(imageAdressOld!==imageAdressNew) )
+      if(imageAdressOld!==imageAdressNew){
+        this.imageAdress = imageAdressNew;
+        this.reload();
+      }
     },
     getShowPic() {
       const {textPic, slectedDataType} = this.transStyle;
@@ -100,7 +100,7 @@ export default {
           urlData[i] = url;
         }
       }
-      console.log("12",urlData);
+      // console.log("12",urlData);
       this.urlData = urlData;
       this.urlData={...this.urlData};
     },
@@ -20,11 +20,12 @@
             :key="index"
             :style="tableRowHeight()"
           >
+            <!--              class="contentStyle"-->
             <div
-              class="content"
               v-for="(itemChild, idx) in header"
               :key="idx"
               :style="[
+                contentStyle(),
                 bodyTableStyle,
                 bodyTable(index),
                 tableFiledWidth(idx),
@@ -59,13 +60,15 @@ export default {
         autoPage: true,
         //effect: "top",
         autoPlay: true,
+        bAutoHeight: true,
         vis: 5,
-        rowHeight: "50px"
+        rowHeight: "50px",
       },
       header: [],
       list: [],
       optionsSetUp: {},
       optionsPosition: {},
+      // contentStyle:{},
       optionsData: {}
     };
   },
@@ -146,6 +149,19 @@ export default {
       this.options = options;
       this.hackResetFun();
     },
+    contentStyle(){
+      let styleJson={};
+      const rollSet = this.optionsSetUp;
+      if(!rollSet.bAutoHeight){
+        styleJson["white-space"]="nowrap";
+        styleJson["overflow"]="nowrap";
+        styleJson["text-overflow"]="ellipsis";
+        styleJson["overflow-wrap"]="";
+      }else{
+        styleJson["overflow-wrap"]="break-word";
+      }
+      return styleJson;
+    },
     handlerHead() {
       const head = this.optionsSetUp.dynamicAddTable;
       this.header = head;
@@ -196,12 +212,18 @@ export default {
     },
     tableRowHeight() {
       let styleJson = {};
-      if (this.optionsSetUp.rowHeight) {
-        styleJson["height"] = this.optionsSetUp.rowHeight + "px";
-        styleJson["line-height"] = this.optionsSetUp.rowHeight + "px";
-      } else {
-        styleJson["height"] = this.options.rowHeight;
-        styleJson["line-height"] = this.optionsSetUp.rowHeight + "px";
+      const bAutoHeight = this.optionsSetUp.bAutoHeight;
+      if(!bAutoHeight){
+        if (this.optionsSetUp.rowHeight) {
+          styleJson["height"] = this.optionsSetUp.rowHeight + "px";
+          styleJson["line-height"] = this.optionsSetUp.rowHeight + "px";
+        } else {
+          styleJson["height"] = this.options.rowHeight;
+          styleJson["line-height"] = this.optionsSetUp.rowHeight + "px";
+        }
+      }else{
+        styleJson["height"] = "auto";
+        styleJson["line-height"]=this.optionsSetUp.rowHeight+ "px";
       }
       return styleJson;
     },
@@ -210,6 +232,9 @@ export default {
       if (this.optionsSetUp.dynamicAddTable[index].width) {
         styleJson["width"] = this.optionsSetUp.dynamicAddTable[index].width;
       }
+      if (this.optionsSetUp.dynamicAddTable[index].textAlignCol) {
+        styleJson["text-align"] = this.optionsSetUp.dynamicAddTable[index].textAlignCol;
+      }
       return styleJson;
     }
   }
@@ -239,8 +264,8 @@ export default {
 }
 .txtScroll-top .infoList li {
-  height: 50px;
-  line-height: 50px;
+  //height: 50px;
+  //line-height: 50px;
   display: flex;
   flex-direction: row;
 }
@@ -12,6 +12,7 @@
       <el-table-column prop="name" label="名称" width="60" />
       <el-table-column prop="key" label="key值" width="70" />
       <el-table-column prop="width" label="宽度" width="50" />
+      <el-table-column prop="textAlignCol" label="对齐" width="50" />
       <el-table-column label="操作" width="100">
         <template slot-scope="scope">
           <div class="button-group">
@@ -63,6 +64,18 @@
           >
           </el-input>
         </el-form-item>
+        <el-form-item label="对齐方式:">
+          <el-select
+            v-model.trim="rowFormData['textAlignCol']"
+            placeholder="请选择"
+          >
+            <el-option label="无" value="none"></el-option>
+            <el-option label="居中" value="center"></el-option>
+            <el-option label="左对齐" value="left"></el-option>
+            <el-option label="右对齐" value="right"></el-option>
+            <el-option label="两端对齐" value="justify"></el-option>
+          </el-select>
+        </el-form-item>
       </el-form>
       <span slot="footer" class="dialog-footer">
         <el-button size="mini" @click="dialogVisible = false">取 消</el-button>
@@ -88,7 +101,8 @@ export default {
       rowFormData: {
         name: "",
         key: "",
-        width: ""
+        width: "",
+        textAlignCol: ""
       },
       flag: true, // true 新增， false 编辑
       indexEditor: -1, // 编辑第几个数据