重构

src/view/portal/LayoutOptarea.vue

@@ -86,6 +86,9 @@ export default {
   },
   mounted() {
     this.bindTdEvent();
+    this.$nextTick(()=>{
+      $(window).resize(()=>this.resizeChart());
+    });
   },
   computed: {},
   methods: {
@@ -390,6 +393,21 @@ export default {
 
       });
     },
+    resizeChart(){
+      let comps = utils.findAllComps(this.pageInfo);
+      comps.forEach(m=>{
+        if(m.type === 'chart'){
+          let dom = document.getElementById("ct_"+m.id);
+          if(dom){
+            var chart = echarts.getInstanceByDom(dom);
+            if(chart){
+              chart.resize($(dom).width(), $(dom).height());
+            }
+          }
+          
+        }
+      });
+    },
     //绑定组件拖拽事件
     bindCompEvent(obj){
       let ts = this;

src/view/portal/LayoutRight.vue

@@ -11,6 +11,7 @@
             <pbox v-if="showBox" ref="boxForm" :comp="comp"></pbox>
             <ptext v-if="showText" ref="textForm" :comp="comp"></ptext>
             <pchart v-if="showChart" ref="chartForm" :comp="comp"></pchart>
+            <pgrid v-if="showGrid" ref="gridForm" :comp="comp"></pgrid>
           </div>
         </div>
       </div>
@@ -23,10 +24,12 @@ import * as utils from './Utils'
 import pbox from './prop/Box'
 import ptext from './prop/Text'
 import pchart from './prop/Chart'
+import pgrid from './prop/Grid'
+
 
 export default {
   components:{
-    pbox,ptext,pchart
+    pbox,ptext,pchart,pgrid
   },
   props:{
       pageInfo:{
@@ -74,16 +77,21 @@ export default {
         this.$nextTick(()=>this.$refs['chartForm'].init());
       }else if(comp.type ==='grid'){
         this.showGrid = true;
+        this.$nextTick(()=>this.$refs['gridForm'].init());
       }else if(comp.type === 'table'){
         this.showTable = true;
       }else if(comp.type === 'text'){
         this.showText = true;
         this.$nextTick(()=>this.$refs['textForm'].init());
       }
+      //激发resize 事件
+      $(window).trigger("resize");
     },
    closeproperty(){
       $(".layout-center").css("margin-right","");
       this.show = false;
+      //激发resize 事件
+      $(window).trigger("resize");
    }
   },
   watch: {

src/view/portal/data/Grid.vue

@@ -49,6 +49,7 @@ export default {
   methods: {
      setUpdate(){
       this.$parent.$parent.isupdate = true;
+      this.$forceUpdate();
     },
     gridView(){
       this.$parent.$parent.$refs['optarea'].$refs['mv_'+this.comp.id].gridView();

src/view/portal/prop/Grid.vue

@@ -0,0 +1,94 @@
+<template>
+  <el-form :model="prop" ref="propForm" label-position="left" size="mini">
+    <el-collapse v-model="activeName" accordion>
+      <el-collapse-item title="表格属性" name="1">
+            <el-form-item label="表格标题" label-width="70px">
+              <el-input v-model="prop.title" @blur="changevalue('title')"></el-input>
+            </el-form-item>
+            <el-form-item label="是否显示标题" label-width="170px">
+              <el-switch v-model="prop.showtitle" @change="changevalue('showtitle')"></el-switch>
+            </el-form-item>
+            <el-form-item label="禁用分页" label-width="170px">
+              <el-switch v-model="prop.isnotfy" @change="changevalue('isnotfy')"></el-switch>
+            </el-form-item>
+            <template v-if="!(prop.isnotfy === true)">
+            <el-form-item label="每页显示条数" label-width="80px">
+               <el-input-number v-model="prop.pageSize" @change="changevalue('pageSize')"></el-input-number>
+            </el-form-item>
+            </template>
+      </el-collapse-item>
+      
+    </el-collapse>
+  </el-form>
+</template>
+
+<script>
+import {baseUrl} from '@/common/biConfig'
+import $ from 'jquery'
+import * as utils from '@/view/portal/Utils'
+
+export default {
+  components:{
+    
+  },
+  props:{
+      comp:{
+        type:Object,
+        required:true
+      }
+  },
+  data(){
+    return {
+      activeName:"1",
+      prop:{
+        title:null,
+        showtitle:true,
+        isnotfy:null,
+        pageSize:10
+      }
+    }
+  },
+  mounted(){
+    
+  },
+  computed: {
+  },
+  methods: {
+    init(){
+      let p = this.prop;
+      let c = this.comp;
+      p.title = c.name;
+      p.showtitle = c.showtitle;
+      if(c.pageSize){
+        p.pageSize = c.pageSize;
+      }
+      p.isnotfy = c.isnotfy;
+    },
+    gridView(){
+      this.$parent.$parent.$refs['optarea'].$refs['mv_'+this.comp.id].gridView();
+    },
+    compRender(){
+      this.$parent.$parent.$refs['optarea'].$forceUpdate();
+    },
+    changevalue(prop){
+      let c = this.comp;
+      let v = this.prop[prop];
+      if(prop === 'title'){
+        c.name = v;
+      }else if(prop === 'showtitle'){
+        c.showtitle = v;
+      }else if(prop === 'pageSize' || prop === 'isnotfy'){
+        c[prop] = v;
+        this.gridView();
+      }
+    }
+  },
+  watch: {
+    
+  }
+}
+</script>
+
+<style lang="less" scoped>
+  
+</style>

src/view/portal/prop/Text.vue

@@ -3,7 +3,7 @@
     <el-collapse v-model="activeName" accordion>
       <el-collapse-item title="文本属性" name="1">
             <el-form-item label="是否显示标题" label-width="170px">
-              <el-switch v-model="prop.showTitle"></el-switch>
+              <el-switch v-model="prop.showtitle" @change="changevalue('showtitle')"></el-switch>
             </el-form-item>
             <el-form-item label="标题" label-width="70px">
               <el-input v-model="prop.title" @blur="changevalue('title')"></el-input>
@@ -59,7 +59,7 @@ export default {
     return {
       activeName:"1",
       prop:{
-        showTitle:false,
+        showtitle:true,
         title:null,
         talign:"left",
         tfontsize:12,
@@ -91,6 +91,8 @@ export default {
       }
       if(prop === 'title'){
         c.name = v;
+      }else if(prop === 'showtitle'){
+        c.showtitle = v;
       }else if(prop === 'talign' || prop === 'tfontsize' || prop ==='tfontcolor' || prop === 'tunderscore' 
         || prop ==='titalic' || prop ==='tfontweight'){
         c.style[prop] = v;

src/view/portal/view/Grid.vue

@@ -53,7 +53,6 @@ export default {
         }
       let first = data.curPage <= 0;
       let end = data.curPage >= allpage - 1;
-      console.log(allpage);
       let pg = [
         h('button', {class:"btn btn-link btn-xs",attrs:{disabled:first},on:{click:()=>{
           if(!first){
@@ -82,7 +81,10 @@ export default {
       ];
 
       let pageinfo = h('div', {class:"pagesizeinfo"}, [h('div', {class:"pagesizeLeft"}, pg), h('div', {class:"pagesizeRight"}, '第'+(data.curPage + 1)+'页，共'+data.total+'条记录')]);
-      let cld = [h('div', {class:"lock-dg-header"}, [table1]), h('div', {class:"lock-dg-body"}, [table2]), pageinfo];
+      let cld = [h('div', {class:"lock-dg-header"}, [table1]), h('div', {class:"lock-dg-body"}, [table2])];
+      if(!(this.comp.isnotfy === true)){
+        cld.push(pageinfo);
+      }
       return h('div', {class:"lock-dg"}, cld);
       
     }