看板添加进度条

FTT.Board.VueUI/src/config/comboxstore.js

@@ -46,11 +46,12 @@ export default {
         { ID: 3, Text: "Panle1" ,name:"panle1",src:require("@/assets/image/panle1.jpg")},
         { ID: 4, Text: "Panle2" ,name:"panle2",src:require("@/assets/image/panle2.jpg")},
         { ID: 5, Text: "Table1" ,name:"table1",src:require("@/assets/image/table1.jpg")},
-		{ ID: 6, Text: "pie" ,name:"pie",src:require("@/assets/image/table1.jpg")},
-		{ ID: 7, Text: "radar" ,name:"雷达图",src:require("@/assets/image/table1.jpg")},
-		{ ID: 8, Text: "bar" ,name:"柱状图",src:require("@/assets/image/table1.jpg")},
-		{ ID: 9, Text: "scatter" ,name:"散点图",src:require("@/assets/image/table1.jpg")},
-		{ ID: 10, Text: "chartLine" ,name:"折线图",src:require("@/assets/image/table1.jpg")},
+        // { ID: 6, Text: "Table2" ,name:"table2",src:require("@/assets/image/table1.jpg")},
+		// { ID: 6, Text: "pie" ,name:"pie",src:require("@/assets/image/table1.jpg")},
+		// { ID: 7, Text: "radar" ,name:"雷达图",src:require("@/assets/image/table1.jpg")},
+		// { ID: 8, Text: "bar" ,name:"柱状图",src:require("@/assets/image/table1.jpg")},
+		// { ID: 9, Text: "scatter" ,name:"散点图",src:require("@/assets/image/table1.jpg")},
+		// { ID: 10, Text: "chartLine" ,name:"折线图",src:require("@/assets/image/table1.jpg")},
         
     ],
     RefreshTypeCombox: [

FTT.Board.VueUI/src/views/board/boardlist/detail.vue

@@ -99,7 +99,7 @@
                   <el-input-number v-model="ruleForm.RefreshTime" :min="0"></el-input-number>
                 </el-form-item>
 
-                <el-form-item label="刷新类别" v-if="ruleForm.ChartType==5">
+                <el-form-item label="刷新类别" v-if="ruleForm.ChartType==5 || ruleForm.ChartType==6">
                   <el-select v-model="ruleForm.RefreshType" placeholder="请选择容器刷新类别">
                     <el-option
                       v-for="item in comboxstore.RefreshTypeCombox"
@@ -241,7 +241,7 @@ export default {
         },
         { value: "BackgroundColor", label: "背景色" },
         { value: "FontColor1", label: "1号字体颜色" },
-        { value: "FontSize1", label: "1号字体大小", width: 50 },
+        { value: "FontSize1", label: "1号字体大小", width: 50 }, 
         { value: "FontColor2", label: "2号字体颜色" },
         { value: "FontSize2", label: "2号字体大小", width: 50 },
 

FTT.Board.VueUI/src/views/board/index.1.vue

@@ -80,6 +80,7 @@ import comFoot from "@/views/chart/foot";
 import Panle1 from "@/views/chart/Panle1";
 import Panle2 from "@/views/chart/Panle2";
 import Table1 from "@/views/chart/Table1";
+import Table2 from "@/views/chart/Table1";
 import pie from "@/views/chart/echarts/pie/index";
 export default {
   name: "board",
@@ -89,6 +90,7 @@ export default {
     Panle1,
     Panle2,
     Table1,
+    Table2,
 		pie
   },
   data() {

FTT.Board.VueUI/src/views/board/index.vue

@@ -83,6 +83,7 @@ import comFoot from "@/views/chart/foot";
 import Panle1 from "@/views/chart/Panle1";
 import Panle2 from "@/views/chart/Panle2";
 import Table1 from "@/views/chart/Table1";
+import Table2 from "@/views/chart/Table2";
 import pie from "@/views/chart/echarts/pie/index";
 import radar from "@/views/chart/echarts/radar/index";
 import bar from "@/views/chart/echarts/bar/index";
@@ -96,6 +97,7 @@ export default {
     Panle1,
     Panle2,
     Table1,
+    Table2,
 		pie,
 		radar,
 		bar,
@@ -154,14 +156,16 @@ export default {
   },
   methods: {
     Load(id) {
-			console.log("请求数据。。。")
+      console.log("请求数据。。。")
+      // console.log('sdfsdff'+this.GetLayout().TagData);
+      
       var me = this;
       Axios({
         method: "get",
         url: me.Api.get.url,
         params: { MID: id }
       }).then(res => {
-				
+				console.log('rows'+JSON.stringify(res))
         if (res.success) {
           me.ruleForm = res.rows[0];
 					console.log(JSON.stringify( me.ruleForm))

FTT.Board.VueUI/src/views/chart/Table1.vue

 <template>
   <div style="font-size:30px" :style="{color:chart.FontColor,background:chart.BackgroundColor}">
     <div style="width:100%">
-      <table style="width:100%;height:100%">
+      <table style="width:100%;height:100%;border-collapse:collapse">
         <tr style="height:8%" :style="{fontSize:chart.FontSize1!=0?chart.FontSize1+'px':'30px'}">
           <td
             v-for="(item,index) in titlestore"
             class="tableclass"
             :key="index"
-            :style="{color:item.Color,width:item.Width+'%'}"
+            :style="{color:item.Color,width:item.Width+'%',border:'1px'+' solid '+item.Color,borderColor:boardstore.BorderColor==null?'red':boardstore.BorderColor}"
           >{{item.Key}}</td>
         </tr>
+         <!-- <el-progress :text-inside="true" :stroke-width="20" color="#000" :percentage="90" status="exception"></el-progress> -->
         <template v-for="(item,index) in itemdata">
           <tr
             :key="index"
@@ -19,9 +20,17 @@
               <td
                 :key="index1"
                 class="tableclass"
-                :style="{width:getwidth(obj)+'%'}"
-                v-if="obj.Key.indexOf('_')>0"
+                :style="{width:getwidth(obj)+'%',border:'1px'+' solid '+getfontcolor(item),borderColor:boardstore.BorderColor==null?'red':boardstore.BorderColor}"
+                v-if="obj.Key.indexOf('_')>0 && obj.Key.indexOf('_percent')<0"
               >{{obj.Value}}</td>
+              <td
+                :key="index1"
+                class="tableclass"
+                :style="{width:getwidth(obj)+'%',border:'1px'+' solid '+getfontcolor(item),borderColor:boardstore.BorderColor==null?'red':boardstore.BorderColor}"
+                v-if="obj.Key.indexOf('_percent')>0"
+              >
+                 <el-progress :text-inside="true" :stroke-width="20" :color="obj.Key.indexOf('#') ? '#'+obj.Value.split('#')[1] : '#409EFF'" :percentage="obj.Key.indexOf('#') ? parseInt(obj.Value.split('#')[0]) : parseInt(obj.Value)" status="exception"></el-progress>
+              </td>
             </template>
           </tr>
         </template>
@@ -206,6 +215,7 @@ export default {
           if (this.chart.RefreshType == 1) {
             this.itemdata = me._changeDataType(res.rows);
           }
+          console.log('itemdata'+JSON.stringify(me.itemdata))
         } else {
           console.log(res.message);
         }
@@ -319,6 +329,10 @@ export default {
 };
 </script>
 <style >
+.el-progress-bar{
+  display: flex;
+align-items: center;
+}
 .seamless-warp {
   height: 95%;
   overflow: hidden;
@@ -346,6 +360,8 @@ table {
 }
 .tableclass {
   text-align: center;
+  box-sizing: border-box;
+  padding:0 10px;
   /* border:1px solid blue; */
   /* display: inline-block; */
   /* 不换行 */