看板优化

FTT.Board.VueUI/package-lock.json

@@ -3540,7 +3540,8 @@
         "code-point-at": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "concat-map": {
           "version": "0.0.1",
@@ -3550,7 +3551,8 @@
         "console-control-strings": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -3667,7 +3669,8 @@
         "inherits": {
           "version": "2.0.3",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "ini": {
           "version": "1.3.5",
@@ -3679,6 +3682,7 @@
           "version": "1.0.0",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -3804,7 +3808,8 @@
         "number-is-nan": {
           "version": "1.0.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -3937,6 +3942,7 @@
           "version": "1.0.2",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",

FTT.Board.VueUI/src/App.vue

@@ -52,4 +52,17 @@ html {
 #app > div {
   height: 100%;
 }
+html {
+  /*隐藏滚动条，当IE下溢出，仍然可以滚动*/
+  -ms-overflow-style: none;
+  /*火狐下隐藏滚动条*/
+  overflow: -moz-scrollbars-none;
+}
+/*Chrome下隐藏滚动条，溢出可以透明滚动*/
+html::-webkit-scrollbar {
+  width: 0px;
+}
+#app div{
+  overflow: hidden;
+}
 </style>

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

@@ -111,7 +111,7 @@
                 </el-form-item>
               </el-row>
               <el-row>
-                <el-form-item label="字号1颜色">
+                <el-form-item label="字号1颜色" v-if="ruleForm.ChartType!=5">
                   <el-input v-model="ruleForm.FontColor1">
                     <template slot="append">
                       <el-color-picker size="mini" v-model="ruleForm.FontColor1"></el-color-picker>
@@ -123,7 +123,7 @@
                 </el-form-item>
               </el-row>
               <el-row>
-                <el-form-item label="字号2颜色">
+                <el-form-item label="字号2颜色" v-if="ruleForm.ChartType!=5">
                   <el-input v-model="ruleForm.FontColor2">
                     <template slot="append">
                       <el-color-picker size="mini" v-model="ruleForm.FontColor2"></el-color-picker>
@@ -187,9 +187,9 @@ export default {
     return {
       comboxstore: comBox,
       columns: [
-        { value: "ID", label: "ID", width: 50 },
-        { value: "BoardCode", label: "看板编码" },
-        { value: "BoardName", label: "看板名称" },
+        // { value: "ID", label: "ID", width: 50 },
+        // { value: "BoardCode", label: "看板编码" },
+        // { value: "BoardName", label: "看板名称" },
         {
           value: "LayoutID",
           label: "布局",

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

@@ -48,6 +48,7 @@
                           :boardstore="ruleForm"
                           :chart="GetChartStore(column)"
                           :Api="Api.charapi"
+                          v-if="GetChartStore(column).IsShow"
                         ></component>
                       </div>
                     </template>

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

@@ -5,7 +5,7 @@
   >
     <table style="width:100%;height:100%">
       <tr>
-        <td style="width:50%">
+        <td style="width:50%;height:100%">
           <div style="height:100%">
             <table style="height: 100%; width: 100%;text-align: center;">
               <tr style="height:30%">
@@ -15,7 +15,7 @@
                 >{{row!=null&&row.Name!=null?row.Name:''}}</td>
               </tr>
               <tr style="height:70%">
-                <td class="value" valign="top">
+                <td class="value" valign="top" style="display:table-cell; vertical-align:middle">
                   <font
                     :color="chart.FontColor"
                     :style="{color:chart.FontColor1!=null?chart.FontColor1:'red',fontSize:chart.FontSize1!=0?chart.FontSize1+'px':'150px'}"
@@ -25,7 +25,7 @@
             </table>
           </div>
         </td>
-        <td style="width:50%">
+        <td style="width:50%;height:100%">
           <div :style="{fontSize:30+'px',height:100+'%'}">
             <table style="height: 100%; width: 100%;text-align: center;">
               <template v-if="row!=null&&row.Detail">

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

@@ -2,7 +2,7 @@
   <div style="font-size:30px" :style="{color:chart.FontColor,background:chart.BackgroundColor}">
     <div style="width:100%">
       <table style="width:100%;height:100%">
-        <tr style="height:8%">
+        <tr style="height:8%" :style="{fontSize:chart.FontSize1!=0?chart.FontSize1+'px':'30px'}">
           <td
             v-for="(item,index) in titlestore"
             class="tableclass"
@@ -10,16 +10,31 @@
             :style="{color:item.Color,width:item.Width+'%'}"
           >{{item.Key}}</td>
         </tr>
-        <tr v-for="(item,index) in itemdata" :key="index" :style="{color:getfontcolor(item)}">
-          <template v-for="(obj,index1) in item">
-            <td
-              :key="index1"
-              class="tableclass"
-              :style="{width:getwidth(obj)+'%'}"
-              v-if="obj.Key.indexOf('_')>0"
-            >{{obj.Value}}</td>
-          </template>
-        </tr>
+        <template v-for="(item,index) in itemdata">
+          <tr
+            :key="index"
+            :style="{fontSize:chart.FontSize2!=0?chart.FontSize2+'px':'30px',color:getfontcolor(item)}"
+          >
+            <template v-for="(obj,index1) in item">
+              <td
+                :key="index1"
+                class="tableclass"
+                :style="{width:getwidth(obj)+'%'}"
+                v-if="obj.Key.indexOf('_')>0"
+              >{{obj.Value}}</td>
+            </template>
+          </tr>
+        </template>
+        <template v-if="itemdata.length<chart.PageSize">
+          <tr v-for="(tt,index) in (chart.PageSize-itemdata.length)" :key="'tt'+index"   :style="{fontSize:chart.FontSize2!=0?chart.FontSize2+'px':'30px'}">
+            <td>&nbsp;</td>
+            <td>&nbsp;</td>
+            <td>&nbsp;</td>
+            <td>&nbsp;</td>
+            <td>&nbsp;</td>
+            <td></td>
+          </tr>
+        </template>
       </table>
     </div>
   </div>
@@ -32,6 +47,7 @@ var _this;
 export default {
   name: "charttable1",
   inject: ["reload"],
+  props: ["boardstore", "chart", "Api"],
   data() {
     return {
       store: null,
@@ -60,21 +76,11 @@ export default {
               ? 1000
               : (this.chart.PageSize * this.chart.RefreshTime - 5) * 1000;
         }
-        // console.log("laodDataTime" + this.laodDataTime);
       }
     },
     laodDataTime: function(val, oldval) {
       console.log("加载时间变化,new:" + val + "  old:" + oldval);
       if (val != oldval) {
-        if (this.timer) {
-          this.timer = null;
-          console.log("第2次加载");
-          clearInterval(this.timer);
-          this._loadDataInterval();
-        } else {
-          console.log("第3次加载");
-          this._loadDataInterval();
-        }
       }
     },
     "chart.RefreshTime": function(val, oldval) {
@@ -94,48 +100,70 @@ export default {
       if (val != oldval) {
         _this._refreshPage();
       }
+    },
+    bodystore: val => {
+      console.log("bodystore.Length" + val.length);
     }
   },
-  props: ["boardstore", "chart", "Api"],
+
   computed: {},
   mounted() {
-    //换行时间
-    //
+    //换页时间 获取数据
+    var _this = this;
+    if (this.chart.RefreshType == 1) {
+      var time =
+        this.chart.RefreshTime != 0
+          ? this.chart.RefreshTime
+          : this.boardstore.RefreshTime;
+      console.log(this.chart.PositionIndex + "获取数据时间" + time);
+      this.timer = setInterval(function() {
+        _this.loadData();
+      }, time * 1000);
+    }
+    //换行 获取数据
+    if (this.chart.RefreshType == 2) {
+      var changeRowTime =
+        this.chart.RefreshTime != 0
+          ? this.chart.RefreshTime
+          : this.boardstore.RefreshTime;
+      //换行时间*每页条数 -3  就是获取数据时间
+      var time = changeRowTime * this.chart.PageSize - 3;
+      console.log(this.chart.PositionIndex + "获取数据时间" + time);
+      this.timer = setInterval(function() {
+        _this.loadData();
+      }, time * 1000);
+
+      //3秒后开始执行换行定时器
+      setTimeout(() => {
+        var timerow =
+          (this.chart.RefreshTime != 0
+            ? this.chart.RefreshTime
+            : this.boardstore.RefreshTime) * 1000;
+        this.timer1 = setInterval(() => {
+          _this._changeItemData();
+        }, timerow);
+      }, 3000);
+    }
   },
   methods: {
     //数据换行/换页时间
-    _itemRefreshTime() {
-      var time =
-        (this.chart.RefreshTime != 0
-          ? this.chart.RefreshTime
-          : this.boardstore.RefreshTime) * 1000;
-      // console.log("换数据时间：" + time);
-      this.timer1 = setInterval(() => {
-        _this._changeItemData();
-      }, time);
-    },
+    _itemRefreshTime() {},
     //刷新页面
     _refreshPage() {
-      this.reload();
-    },
-    //获取数据定时器
-    _loadDataInterval() {
-      var me = this;
-      clearInterval(this.timer);
-      if (this.timer == null) {
-        this.timer = setInterval(function() {
-          console.log("获取数据时间：" + me.laodDataTime);
-          // console.log(new Date());
-          _this.loadData();
-        }, me.laodDataTime);
+      if (this.timer) {
+        clearInterval(this.timer); //在vue实例销毁钱，清除我们的定时器
+      }
+      if (this.timer1) {
+        clearInterval(this.timer1); //在vue实例销毁钱，清除我们的定时器
       }
+      this.reload();
     },
     loadData() {
       var me = this;
       if (!this.chart.IsShow) {
         return;
       }
-      console.log("加载数据");
+
       var url = me.Api.url;
       var data = {
         ProcName: me.boardstore.ProcName,
@@ -163,6 +191,7 @@ export default {
           } else {
             me.pageindex++;
           }
+          console.log("位置：" + this.chart.PositionIndex + "加载数据");
           if (this.chart.RefreshType == 2) {
             if (this.itemdata.length == 0) {
               this.loadData();
@@ -201,16 +230,13 @@ export default {
     },
     _getData(rows) {
       var me = this;
-
       var data = me._changeDataType(rows);
       if (this.chart.RefreshType == 2) {
         for (let index = 0; index < data.length; index++) {
           let element = data[index];
           me.bodystore.push(element);
         }
-        //  _this.bodystore= _this.bodystore.uniquetwo();
       } else if (this.chart.RefreshType == 1) {
-        debugger;
         this.bodystore = data;
       }
     },
@@ -230,6 +256,19 @@ export default {
       });
       return arr;
     },
+
+    //换行
+    _changeItemData() {
+      if (this.chart.RefreshType == 2) {
+        console.log(this.chart.PositionIndex + "换行");
+        if (this.itemdata.length == 0) return;
+        var rowdata = this.bodystore.shift();
+        this.itemdata.push(rowdata);
+        this.itemdata.shift(); //移除第一条
+      } else if (this.chart.RefreshType == 1) {
+        this.itemdata = this.bodystore;
+      }
+    },
     getfontcolor(data) {
       var color = "red";
       if (data == null) return;
@@ -247,17 +286,6 @@ export default {
           return element.Width;
         }
       }
-    },
-    _changeItemData() {
-      if (this.chart.RefreshType == 2) {
-        if (this.itemdata.length == 0) return;
-        var rowdata = this.bodystore.shift();
-        this.itemdata.push(rowdata);
-        this.itemdata.shift(); //移除第一条
-      } else if (this.chart.RefreshType == 1) {
-        debugger;
-        this.itemdata = this.bodystore;
-      }
     }
   },
 
@@ -270,6 +298,7 @@ export default {
     }
   },
   created() {
+    console.log("位置" + this.chart.PositionIndex);
     _this = this;
     this.loadData();
     this.laodDataTime =
@@ -278,7 +307,7 @@ export default {
         : this.boardstore.RefreshTime) * 1000;
     setTimeout(() => {
       console.log("第一次加载");
-      _this._loadDataInterval();
+      // _this._loadDataInterval();
     }, 1000);
     if (this.chart.RefreshType == 2) {
       //执行换行/换页程序
@@ -296,6 +325,7 @@ export default {
 }
 li {
   width: 100%;
+  list-style-type: none;
 }
 .seamspan {
   text-align: center;
@@ -351,7 +381,7 @@ table {
   display: none;
 }
 .item li {
-  list-style-type: disc;
+  list-style-type: none;
   height: auto;
 }
 /* .seamless-warp {

FTT.Board/FTT.Board.Api/Controllers/ChartController.cs

@@ -51,10 +51,20 @@ namespace FTT.Board.Controllers
             using (var db = string.IsNullOrEmpty(dto.ConnStr) ? MsSqlDbContextWraper.NewContext() : MsSqlDbContextWraper.NewContext(dto.ConnStr))
             {
 
-                return db.Sql(string.Format("Exec {0} @PageSize,@PageIndex,@Flag,@WorkTeamID", dto.ProcName))
+                var list = db.Sql(string.Format("Exec {0} @PageSize,@PageIndex,@Flag,@WorkTeamID", dto.ProcName))
                  .Parameter("PageSize", dto.PageSize).Parameter("PageIndex", dto.PageIndex).Parameter("Flag", dto.Flag).Parameter("WorkTeamID", dto.WorkTeamID)
                  .QueryMany<dynamic>();
+                //foreach (var item in list)
+                //{
+                //    var obj = (Object)item;
+                //    //遍历匿名对象
+                //    foreach (System.Reflection.PropertyInfo p in obj.GetType().GetProperties())
+                //    {
+                //        Console.WriteLine("name:{0},value:{1}", p.Name, p.GetValue(item));
+                //    }
+                //}
 
+                return list;
 
             }
         }