绩效

develop/@gms/gms-plugin-billexpand/src/control/vxe-achievements/achievements.vue

 <template>
   <div class="bill-achievements">
-    <vxe-table border ref="xTable" :data="tableData" :show-header="false">
+    <vxe-table
+      border
+      ref="xTable"
+      :data="tableData"
+      :show-header="false"
+      :cell-style="cellStyle"
+    >
       <vxe-table-column
         field="name"
         title="name"
@@ -11,6 +17,7 @@
         <template slot-scope="scope">
           <component
             :is="scope.row.type"
+            :disabled="state == 'readOnly'"
             :attr="{ field: 'value', row: scope.row, attr: scope.row.attr }"
             :detailData="
               scope.row.attr && scope.row.attr.tableData
@@ -31,8 +38,9 @@ import vxeTableControl from "./components/vxe-table.vue";
 import radioGroupControl from "./components/radioGroupControl.vue";
 import inputControl from "./components/inputControl.vue";
 import textAreaControl from "./components/textAreaControl.vue";
+import input from "../util/bc_input.js";
 export default {
-  mixins: [vxeAchievements],
+  mixins: [vxeAchievements, input],
   components: {
     vxeTableControl,
     dateControl,
@@ -128,12 +136,12 @@ export default {
         {
           name: "单位(部门)职能概述",
           type: "textAreaControl",
-          value: "xx",
+          value: "",
         },
         {
           name: "项目概况",
           type: "textAreaControl",
-          value: "33",
+          value: "",
         },
         {
           name: "项目立项情况",
@@ -656,7 +664,7 @@ export default {
           name: "填报人：",
           type: "vxeTableControl",
           attr: {
-            border:'none',
+            border: "none",
             showHeader: false,
             addObj: {
               name: "",
@@ -666,18 +674,18 @@ export default {
               {
                 person: "单位（部门）负责人：",
                 time: "填报时间:",
-              }
+              },
             ],
             columns: [
               {
                 field: "person",
                 title: "部门负责人",
-                type: "inputControl"
+                type: "inputControl",
               },
               {
                 field: "time",
                 title: "填报时间",
-                type: "inputControl"
+                type: "inputControl",
               },
             ],
           },
@@ -686,34 +694,46 @@ export default {
     };
   },
   props: {
-    define: {
-      type: Object,
-      default: () => {},
-    },
-    context: {
-      type: Object,
-      default: () => {},
-    },
+    // define: {
+    //   type: Object,
+    //   default: () => {},
+    // },
+    // context: {
+    //   type: Object,
+    //   default: () => {},
+    // },
   },
   watch: {
     tableData: {
       handler(nv, ov) {
         console.log(nv, ov);
         if (this.define.config.field) {
-          this.context.dataObject.setValue(this.define.config.field, nv);
+          this.context.dataObject.setValue(
+            this.define.config.field.split(".")[1],
+            JSON.stringify(nv)
+          );
         }
       },
       deep: true,
     },
+    value: {
+      handler(nv, ov) {
+        console.log("value", nv, ov);
+        this.tableData = JSON.parse(nv);
+      },
+      deep: true,
+    },
   },
   computed: {},
   methods: {
-    Primary() {
-      console.log(this.tableData);
-    },
     updataTableData(nv, rowIndex) {
       this.tableData[rowIndex].attr.tableData = nv;
     },
+    cellStyle({ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex }) {
+      return {
+        backgroundColor:this.state == 'readOnly'? "#F3F3F3":''
+      }
+    },
   },
   mounted() {},
   created() {},
@@ -736,10 +756,9 @@ export default {
 .rbcInputControl textarea.ivu-input {
   max-width: inherit;
   font-size: 14px;
-  vertical-align:revert;
+  vertical-align: revert;
 }
 .bill-achievements {
-
   .vxe-table--render-default .vxe-body--column:not(.col--ellipsis) {
     padding: 0;
     line-height: 44px;

develop/@gms/gms-plugin-billexpand/src/control/vxe-achievements/components/dateControl.vue

@@ -9,6 +9,10 @@
       "
       :placement="attr.column && attr.column.placement"
       v-model="attr.row[attr.field]"
+      :disabled="disabled"
+      transfer
+      transfer-class-name="transferred-cell-element"
+      :readonly="true"
     ></DatePicker>
   </div>
 </template>
@@ -22,6 +26,9 @@ export default {
       type: Object,
       default: () => {},
     },
+    disabled: {
+      require: false
+    }
   },
   watch: {},
   computed: {},

develop/@gms/gms-plugin-billexpand/src/control/vxe-achievements/components/inputControl.vue

 <template>
   <div class="rbcInputControl">
-    <Input v-model="attr.row[attr.field]"/>
+    <Input v-model="attr.row[attr.field]" :disabled="disabled"/>
   </div>
 </template>
 <script>
@@ -14,6 +14,9 @@ export default {
     attr:{
       type:Object,
       default:()=>{}
+    },
+    disabled: {
+      require: false
     }
   },
   watch: {},

develop/@gms/gms-plugin-billexpand/src/control/vxe-achievements/components/radioGroupControl.vue

 <template>
   <div class="">
-    <RadioGroup v-model="attr.row[attr.field]">
-      <Radio label="新增项目"></Radio>&nbsp;&nbsp;&nbsp;
-      <Radio label="延续项目"></Radio>
+    <RadioGroup v-model="attr.row[attr.field]" >
+      <Radio label="新增项目" :disabled="disabled"></Radio>&nbsp;&nbsp;&nbsp;
+      <Radio label="延续项目" :disabled="disabled"></Radio>
     </RadioGroup>
   </div>
 </template>
@@ -15,6 +15,9 @@ export default {
     attr:{
       type:Object,
       default:()=>{}
+    },
+    disabled: {
+      require: false
     }
   },
   watch: {},

develop/@gms/gms-plugin-billexpand/src/control/vxe-achievements/components/textAreaControl.vue

 <template>
   <div class="rbcInputControl">
-    <Input v-model="attr.row[attr.field]" type="textarea"/>
+    <Input v-model="attr.row[attr.field]" type="textarea" :disabled="disabled"/>
   </div>
 </template>
 <script>
@@ -14,6 +14,9 @@ export default {
     attr:{
       type:Object,
       default:()=>{}
+    },
+    disabled: {
+      require: false
     }
   },
   watch: {},

develop/@gms/gms-plugin-billexpand/src/control/vxe-achievements/components/vxe-table.vue

@@ -9,6 +9,7 @@
       :span-method="spanMethods"
       :menu-config="tableMenu"
       @menu-click="contextMenuClickEvent"
+      :cell-style="cellStyle"
     >
       <template v-for="(column, index) in attr.attr.columns">
         <vxe-table-column
@@ -21,6 +22,7 @@
         >
           <template slot-scope="scope">
             <component
+              :disabled="disabled"
               :is="column.type"
               :attr="{ field: column.field, row: scope.row, column: column }"
             ></component>
@@ -44,11 +46,11 @@ export default {
     dateControl,
     radioGroupControl,
     inputControl,
-    textAreaControl
+    textAreaControl,
   },
   data() {
     return {
-       tableMenu: {
+      tableMenu: {
         body: {
           options: [
             [
@@ -57,6 +59,7 @@ export default {
             ],
           ],
         },
+        visibleMethod: this.visibleMethod,
       },
     };
   },
@@ -69,10 +72,18 @@ export default {
       type: Array,
       default: () => {},
     },
+    disabled: {
+      require: false,
+    },
   },
   watch: {},
   computed: {},
   methods: {
+    cellStyle({ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex }) {
+      return {
+        backgroundColor:this.disabled? "#F3F3F3":''
+      }
+    },
     headerCellClassName({ column, columnIndex }) {
       if (column.property === "content") {
         return "col-white";
@@ -97,18 +108,30 @@ export default {
         }
       }
     },
-    contextMenuClickEvent({ menu, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, $event }) {
-      console.log(menu,  row, rowIndex, column, columnIndex);
+    visibleMethod({ options, column }) {
+      return this.disabled?false:true;
+    },
+    contextMenuClickEvent({
+      menu,
+      row,
+      rowIndex,
+      $rowIndex,
+      column,
+      columnIndex,
+      $columnIndex,
+      $event,
+    }) {
+      console.log(menu, row, rowIndex, column, columnIndex);
       let detailXTable = this.$refs.detailXTable;
       switch (menu.code) {
         case "addRow":
-          detailXTable.insertAt(this.attr.attr.addObj,row);
-          this.$emit('dataChange',detailXTable.tableFullData);
+          detailXTable.insertAt(this.attr.attr.addObj, row);
+          this.$emit("dataChange", detailXTable.tableFullData);
           break;
         case "removeRow":
-          if(detailXTable.tableFullData.length>1){
+          if (detailXTable.tableFullData.length > 1) {
             detailXTable.remove(row);
-            this.$emit('dataChange',detailXTable.tableFullData);
+            this.$emit("dataChange", detailXTable.tableFullData);
           }
           break;
         default:
@@ -122,9 +145,9 @@ export default {
 </script>
 <style lang="less" scoped>
 .detail-table {
-   margin-left:-11px;
-   margin-top:-1px;
-   width: calc(100% + 23px);
+  margin-left: -11px;
+  margin-top: -1px;
+  width: calc(100% + 23px);
   .vxe-header--column .col-white {
     background-color: #fff !important;
   }