Merge branch 'master-500-dev-lushangqing' into 'master-500-dev'

分页表格更多功能，水球样式调整



See merge request !60

@@ -358,7 +358,7 @@ export const monitorCustomLiquidFillChart = {
         required: false,
         placeholder: '',
         relactiveDom: 'dataType',
-        chartType: 'widget-piechart',
+        chartType: 'widget-table',
         dictKey: 'TEXT_PROPERTIES',
         relactiveDomValue: 'dynamicData',
         value: '',

@@ -142,7 +142,7 @@ export default {
           if(this.optionsData.dataType=="dynamicData"){
             //改变参数值-月季度年，重新加载动态数据--待测
             this.optionsData.dynamicData.contextData.time=val;
-            this.editorOptions();
+            // this.editorOptions();
           }
         }
 

@@ -98,7 +98,7 @@ export default {
           if(this.optionsData.dataType=="dynamicData"){
             //改变参数值-月季度年，重新加载动态数据--待测
             this.optionsData.dynamicData.contextData.dataScope=val;
-            this.editorOptions();
+            // this.editorOptions();
           }
         }
 

@@ -37,9 +37,9 @@ export default {
     return {
       // topStyle:'',//水波纹的大小
       fillData:[],//数据
-      topNum:0,//水波纹的大小
-      nums:0,
-      options: {
+      // topNum:0,//水波纹的大小
+      // nums:0,
+     /* options: {
         title: {
           text: '{nums|' + per + '}{percent|%}',
           x: 'center',
@@ -113,7 +113,7 @@ export default {
             }
           }
         ],
-      },
+      },*/
       optionsStyle: {}, // 样式
       optionsData: {}, // 数据
       optionsCollapse: {}, // 图标属性
@@ -254,13 +254,13 @@ export default {
         );
     },
     staticDataFn(val) {
-      const title = this.options.title;
-      const num = val[0]['num'];
+      // const title = this.options.title;
+      // const num = val[0]['num'];
       if(val && val.length>0) {
         this.fillData=val;
       }
-      this.nums =  num ;
-      this.topNum=100-num;
+      // this.nums =  num ;
+      // this.topNum=100-num;
 
     },
     topStyle(val){
@@ -283,12 +283,20 @@ export default {
     getEchartData(val) {
       const data = this.queryEchartsData(val);
       data.then(res => {
+        if(res && res.object) {
+          if(typeof res.object=='object'){
+            let arr=[];
+            for(let key in res.object){
+              arr.push({num:res.object})
+            }
+            this.fillData=arr;
+
+          }else{
+            this.fillData=[res.object];
 
-        this.nums =   res[0].value ;
-        if(res && res.length>0){
-          this.fillData=res;
+          }
         }
-        this.topNum=100-this.nums;
+
       });
     },
   }

@@ -75,7 +75,7 @@
             </div>
           </div>
           <!--数据-->
-          <div class="bd"    v-loading="loadingAll">
+          <div class="bd1"    v-loading="loadingAll">
             <ul class="infoList">
               <li v-for="(item, index) in listAll" :key="index" :style="tableRowHeight()" >
                 <div
@@ -102,14 +102,14 @@
         <!-- 分页 -->
         <div class="pageClass" v-if="optionsSetUp.isPage && !optionsSetUp.isRoll" style='text-align: left;background-color: white'>
           <el-pagination
-            v-if="currentPage"
-            @size-change="handleSizeChange"
-            @prev-click="prePage"
-            @next-click="nextPage"
-            @current-change="handleCurrentChange"
-            :current-page="currentPage"
+            v-if="currentPageAll"
+            @size-change="handleSizeChangeMore"
+            @prev-click="prePageMore"
+            @next-click="nextPageMore"
+            @current-change="handleCurrentChangeMore"
+            :current-page="currentPageAll"
             :page-sizes="pageSizes"
-            :page-size="pageSize"
+            :page-size="pageSizeAll"
             :total="totalAll">
           </el-pagination>
         </div>
@@ -144,6 +144,8 @@ export default {
       currentPage:1,
       pageSize:10,
       pageSizes:[10,50,100, 200, 300, 400],
+      currentPageAll:1,
+      pageSizeAll:10,
       total:0,
       totalAll:0,
       hackReset: true,
@@ -269,8 +271,12 @@ export default {
     },
     visConfig() {
       this.options.vis = this.optionsSetUp.vis;
-      this.pageSize = this.options.vis;
-      this.handleTableData();
+      if(this.optionsData.dynamicData && this.optionsData.dynamicData.contextData.isMore==true){
+        this.pageSizeAll=30;
+      }else{
+        this.pageSize = this.options.vis;
+        this.handleTableData();
+      }
 
     },
     handlerRollFn() {
@@ -298,6 +304,7 @@ export default {
       this.list = data;
       this.listAll=data;
       this.loading = false;
+      this.loadingAll = false;
     },
     handlerDynamicData(data, refreshTime) {
       if (!data) return;
@@ -313,22 +320,23 @@ export default {
     getEchartData(val) {
       const data = this.queryEchartsData(val);
       data.then(res => {
-        // if(this.optionsData.dynamicData.contextData.isMore){
-        //   console.log("all")
-        //   this.listAll=res;
-        //   this.loadingAll = false;
-        //   this.loading = false;
-        //   if (this.listAll && this.listAll.length > 0) {
-        //     this.totalAll = this.listAll[0].lineCount;
-        //   }
-        // }else{
+        console.log("&&&&&&&",this.optionsData.dynamicData.contextData.isMore)
+        if(this.optionsData.dynamicData.contextData.isMore==true){
+          console.log("all")
+          this.listAll=res;
+          this.loadingAll = false;
+          this.loading = false;
+          if (this.listAll && this.listAll.length > 0) {
+            this.totalAll = this.listAll[0].lineCount;
+          }
+        }else{
           this.list = res;
           this.loading = false;
           this.loadingAll = false;
           if (this.list && this.list.length > 0) {
             this.total = this.list[0].lineCount;
           }
-        // }
+        }
 
 
         this.hackResetFun();
@@ -459,27 +467,59 @@ export default {
         window.parent.postMessage(param, '*')
       }
     },
+    // 每页展示多少条
+    handleSizeChangeMore(val) {
+      // 切换页码重置初始页
+      this.currentPageAll = 1
+      //props.pageSize = val;
+      this.pageSizeAll = val;
+      this.handlerDetailDataMore();
+    },
+
+    // 切换页码
+    handleCurrentChangeMore(val) {
+      this.currentPageAll = val;
+      this.handlerDetailDataMore();
+    },
+    // 切换页码
+    prePageMore(val) {
+      this.currentPageAll = val;
+      this.handlerDetailDataMore();
+    },
+
+    // 切换页码
+    nextPageMore(val) {
+      this.currentPageAll = val;
+      this.handlerDetailDataMore();
+    },
     //更多
     handlerDetailDataNoPage(){
       this.widthStyle='';
       this.tableVisible=true;
       let optionsData = this.optionsData;
       if (this.optionsData.dataType == "dynamicData" ) {
-        this.loadingAll= true;
-        let limit = 30;
-        let page = parseInt(this.currentPage - 1) * limit;
-        //改变参数值-月季度年，重新加载动态数据--待测
-        this.optionsData.dynamicData.contextData.page = page;
-        this.optionsData.dynamicData.contextData.limit = 30;
-        this.optionsData.dynamicData.contextData.isMore = true;
-        // this.handlerData();
+        this.currentPageAll=1;
+        this.handlerDetailDataMore();
       }
     },
+    handlerDetailDataMore(){
+      this.loadingAll= true;
+      let limit = 30;
+      let page = parseInt(this.currentPageAll - 1) * limit;
+      //改变参数值-月季度年，重新加载动态数据--待测
+      this.optionsData.dynamicData.contextData.page = page;
+      this.optionsData.dynamicData.contextData.limit = 30;
+      this.optionsData.dynamicData.contextData.isMore = true;
+    },
     //更多弹框关闭确定
     hideDialogTable(){
       this.tableVisible=false;
-      this.loading=false;
+      // this.loading=false;
       this.loadingAll=false;
+      this.currentPageAll=1;
+    /*  if (this.optionsData.dataType == "dynamicData" ) {
+        this.optionsData.dynamicData.contextData.isMore = false;
+      }*/
     },
     okFuncTable(){
       this.tableVisible=false;

-<template>
-  <div :style="styleObj" class="treeContainer">
-    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick" v-if="optionsSetup.isType">
-      <el-tab-pane label="业务" name="first"></el-tab-pane>
-      <el-tab-pane label="资源" name="second"></el-tab-pane>
-    </el-tabs>
-    <el-tree :style="textStyle" class="tree-div" ref="roleTree" :data="treeData" :props="defaultProps" @node-click="handleNodeClick"
-             node-key="id"  :default-checked-keys="checkedKeys"
-    />
-  </div>
-</template>
-
-<script>
-var per = 60;
-export default {
-  name: "progressInformation",
-  components: {},
-  props: {
-    value: Object,
-    ispreview: Boolean
-  },
-  data() {
-    return {
-      activeName:'first',
-      defaultProps : {
-        children: 'children',
-        label: 'label',
-      },
-      treeData: [], // 所有的树结点
-      checkedKeys: [], // 当前选中的keys
-
-      optionsStyle: {}, // 样式
-      optionsData: {}, // 数据
-      optionsCollapse: {}, // 图标属性
-      optionsSetup: {}
-    };
-  },
-  computed: {
-    styleObj() {
-      return {
-        position: this.ispreview ? "absolute" : "static",
-        width: this.optionsStyle.width + "px",
-        height: this.optionsStyle.height + "px",
-        left: this.optionsStyle.left + "px",
-        top: this.optionsStyle.top + "px",
-        background: this.optionsSetup.background,
-        'border':this.optionsSetup.isBorder?'0.5px solid '+this.optionsSetup.borderColor:'none',
-        'box-shadow':this.optionsSetup.isShadow?'0px 3px 12px '+this.optionsSetup.borderColor:'none'
-      };
-    },
-    //文字样式设置
-    textStyle(){
-      return{
-        'text-align':this.optionsSetup.textAlign,
-        'font-size':this.optionsSetup.titleFontSize+'px',
-        color: this.optionsSetup.titleColor,
-        'font-weight': this.optionsSetup.titleFontWeight
-      }
-    }
-  },
-  watch: {
-    value: {
-      handler(val) {
-        this.optionsStyle = val.position;
-        this.optionsData = val.data;
-        this.optionsCollapse = val.collapse;
-        this.optionsSetup = val.setup;
-        this.editorOptions();
-      },
-      deep: true
-    }
-  },
-  created() {
-    this.optionsStyle = this.value.position;
-    this.optionsData = this.value.data;
-    this.optionsCollapse = this.value.collapse;
-    this.optionsSetup = this.value.setup;
-    this.editorOptions();
-  },
-  mounted() {
-
-  },
-  methods: {
-    handleClick(tab,event){
-      this.handleTableData();
-    },
-    handleNodeClick(data){
-      console.log(data);
-      this.$store.commit('CHANGE_TREE',data)
-    },
-    editorOptions() {
-      this.setOptionsData();
-    },
-    //切换类型获取树结构数据
-    handleTableData() {
-      if (this.optionsData.dataType == "dynamicData" && this.optionsSetUp.isType) {
-        //改变参数值-类型
-        this.optionsData.dynamicData.contextData.type = this.activeName;
-      }
-    },
-    // 数据解析
-    setOptionsData() {
-      const optionsData = this.optionsData; // 数据类型 静态 or 动态
-      optionsData.dataType == "staticData"
-        ? this.staticDataFn(optionsData.staticData)
-        : this.dynamicDataFn(
-        optionsData.dynamicData,
-        optionsData.refreshTime
-        );
-    },
-    staticDataFn(val) {
-      if(val && val.length>0) {
-        this.treeData=val;
-      }
-
-    },
-    dynamicDataFn(val, refreshTime) {
-      if (!val) return;
-      if (this.ispreview) {
-        this.getEchartData(val);
-        this.flagInter = setInterval(() => {
-          this.getEchartData(val);
-        }, refreshTime);
-      } else {
-        this.getEchartData(val);
-      }
-    },
-    getEchartData(val) {
-      const data = this.queryEchartsData(val);
-      data.then(res => {
-        if(res && res.length>0){
-          this.treeData=res;
-        }
-      });
-    },
-  }
-};
-</script>
-
-<style scoped lang="scss">
-.treeContainer{
-  padding:10px;
-}
-.tree-div{
-  height:100%;
-  width:100%;
-}
-</style>