centaline-data-driven 1.1.55 → 1.1.59

package/src/centaline/dynamicForm/src/dynamicFormList.vue

@@ -1,209 +1,209 @@
-<template>
-  <div class="ct-form-list" :class="model.attrs.size?'ct-form-list-'+model.attrs.size:''">
-    <div style="padding-bottom:5px;text-align:right" class=" max-btn-add">
-      <el-button type="success" size="mini" class="max-btn-add" icon="el-icon-circle-plus-outline" @click="addRow">新增</el-button>
-    </div>
-    <div style="position:relative">
-      <div style="width:100%;overflow:auto;">
-        <table border="0" cellpadding="0" cellspacing="0">
-          <thead>
-            <tr>
-              <th v-for="i in model.rows[0].field" v-if="i.show !== false" :style="{'min-width':i.width+'px'}">
-                {{i.label}}
-              </th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr v-for="(r,index) in model.rows" v-if="index > 0 && !r.deleted">
-              <td v-for="(i, findex) in r.field" v-if="i.show !== false" :style="{'min-width':i.width+'px'}">
-                <span v-if="r.isSet && model.rowEdit">
-                  <component ref="Fields" :is="i.is" :vmodel="model.currentRow.field[findex]" :api="model.OptApi"></component>
-                </span>
-                <span v-else>{{i.labelValue}}</span>
-                <!--<span v-else><component ref="Fields" :is="i.is" :vmodel="i" :api="model.OptApi"></component></span>-->
-              </td>
-              <td v-if="r.edit || r.delete" style="visibility:hidden;width:85px;">
-                <!--<el-button v-if="r.edit" type="primary" size="mini" icon="el-icon-edit"></el-button>
-                <el-button v-if="r.delete" type="danger" size="mini" icon="el-icon-delete" @click=""></el-button>-->
-                <span class="el-tag el-tag--info el-tag--mini" style="cursor: pointer;">
-                  修改
-                </span>
-                <span class="el-tag el-tag--danger el-tag--mini" style="cursor: pointer;">
-                  删除
-                </span>
-              </td>
-            </tr>
-          </tbody>
-        </table>
-      </div>
-      <table class="ct-form-fixed" border="0" cellpadding="0" cellspacing="0" style="" v-if="model.rows.findIndex((v1)=>{return v1.edit || v1.delete}) >= 0">
-        <thead>
-          <tr>
-            <th style="width:85px;">
-              操作
-            </th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr v-for="(r,index) in model.rows" v-if="index > 0 && !r.deleted" :key="index">
-            <td v-if="r.edit || r.delete">
-              <!--<el-button v-if="r.edit" type="primary" size="mini" icon="el-icon-edit" @click="editRow(index)"></el-button>
-  <el-button v-if="r.delete" type="danger" size="mini" icon="el-icon-delete" @click="deleteRow(index)"></el-button>-->
-              <span v-if="r.edit && r.isSet" class="el-tag el-tag--info el-tag--mini" style="cursor: pointer;" @click="pwdChange(r, index, 1)">
-                保存
-              </span>
-              <span v-else-if="r.edit" class="el-tag el-tag--info el-tag--mini" style="cursor: pointer;" @click="pwdChange(r, index, 2)">
-                修改
-              </span>
-              <span v-if="r.delete && !r.isSet" class="el-tag el-tag--danger el-tag--mini" style="cursor: pointer;" @click="deleteRow(index)">
-                删除
-              </span>
-              <span v-else-if="r.delete" class="el-tag  el-tag--mini" style="cursor: pointer;" @click="pwdChange(r, index, 3)">
-                取消
-              </span>
-            </td>
-            <td v-else>
-              &nbsp;
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    </div>
-</template>
-<script>
-  //Form内表格，已弃用
-  export default {
-    name: 'ct-form-list',
-    props: {
-      vmodel: Object,
-      api: String
-    },
-    data() {
-      return {
-        model:null
-      }
-    },
-    created() {
-      this.model = this.vmodel;
-      this.model.OptApi = this.api;
-    },
-    methods: {
-      deleteRow(index) {
-        var self = this;
-        this.model.deleteRow(index, () => {
-          self.$forceUpdate();
-        });
-      },
-      editRow(index) {
-        var self = this;
-        this.model.editRow(index, () => {
-          self.$forceUpdate();
-        });
-      },
-      addRow() {
-        var self = this;
-        if (self.model.dialogEdit) {
-          this.model.addRow(() => {
-            self.$forceUpdate();
-          });
-        }
-        else {
-          for (let i of self.model.rows) {
-            if (i.isSet) return self.$message.warning("请先保存当前编辑项");
-          }
-          let newRow = self.model.getCloneRowData(0);
-          newRow.isSet = true;
-          self.model.rows.push(newRow);
-          self.model.currentRow = self.model.getCloneRowData(0);
-          self.model.currentRow.isNew = true;
-          self.model.currentRow.index = self.model.rows.length - 1;
-        }
-      },
-      //修改
-      pwdChange(row, index, cg) {
-        let app = this;
-        if (app.model.dialogEdit) {
-          editRow(index);
-          return;
-        }
-
-        //点击修改 判断是否已经保存所有操作
-        for (let i of self.model.rows) {
-          if (i.isSet && app.model.currentRow.index !== index) {
-            app.$message.warning("请先保存当前编辑项");
-            return false;
-          }
-        }
-        //是否是取消操作
-        if (cg === 3) {
-          if (app.model.currentRow.isNew) app.model.rows.splice(index, 1);
-          return row.isSet = !row.isSet;
-        }
-        //提交数据
-        if (row.isSet) {//保存
-          if (!app.model.isDuplicated(app.model.currentRow.data, app.model.currentRow.isNew ? -1 : index)) {
-            let data = app.model.currentRow.field;
-            for (let k in data) {
-              row[k].value = data[k].value;
-              row[k].value1 = data[k].value1;
-            };
-            if (app.model.currentRow.isNew) {
-              app.model.addSourceRow(row);
-            }
-
-            row.isSet = false;
-          }
-        }
-        else {//修改
-          app.model.currentRow = app.model.getCloneRowData(index);
-          app.model.currentRow.isNew = false;
-          app.model.currentRow.index = index;
-          row.isSet = true;
-        }
-      },
-    }
-  }
-</script>
-<style>
-  .ct-form-list {
-    position:relative;
-  }
-  
-  .ct-form-list table {
-    border-top: 1px solid #ebeef5;
-    border-left: 1px solid #ebeef5;
-    min-width: 100%;
-    background-color:#ffffff;
-  }
-    .ct-form-list table th, .ct-form-list table td {
-      word-wrap: break-word;
-      white-space: nowrap;
-      min-width: 50px;
-      padding: 5px 10px;
-      border-bottom: 1px solid #ebeef5;
-      border-right: 1px solid #ebeef5;
-      position:relative;
-    }
-  .ct-form-list.ct-form-list-mini, .ct-form-list.ct-form-list-mini td {
-    min-height: 28px;
-    line-height: 26px;
-    font-size: 12px;
-  }
-  .ct-form-list.ct-form-list-small, .ct-form-list.ct-form-list-small td {
-    height: 32px;
-    line-height: 32px;
-    font-size: 13px;
-  }
-  .ct-form-list.ct-form-list-medium, .ct-form-list.ct-form-list-medium td {
-    height: 36px;
-    line-height: 36px;
-    font-size: 14px;
-  }
-  .ct-form-fixed {
-    position: absolute;
-    top: 0px;
-    right: 0px;
-    min-width: unset !important;
-  }
-</style>
+<template>
+  <div class="ct-form-list" :class="model.attrs.size?'ct-form-list-'+model.attrs.size:''">
+    <div style="padding-bottom:5px;text-align:right" class=" max-btn-add">
+      <el-button type="success" size="mini" class="max-btn-add" icon="el-icon-circle-plus-outline" @click="addRow">新增</el-button>
+    </div>
+    <div style="position:relative">
+      <div style="width:100%;overflow:auto;">
+        <table border="0" cellpadding="0" cellspacing="0">
+          <thead>
+            <tr>
+              <th v-for="i in model.rows[0].field" v-if="i.show !== false" :style="{'min-width':i.width+'px'}">
+                {{i.label}}
+              </th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr v-for="(r,index) in model.rows" v-if="index > 0 && !r.deleted">
+              <td v-for="(i, findex) in r.field" v-if="i.show !== false" :style="{'min-width':i.width+'px'}">
+                <span v-if="r.isSet && model.rowEdit">
+                  <component ref="Fields" :is="i.is" :vmodel="model.currentRow.field[findex]" :api="model.OptApi"></component>
+                </span>
+                <span v-else>{{i.labelValue}}</span>
+                <!--<span v-else><component ref="Fields" :is="i.is" :vmodel="i" :api="model.OptApi"></component></span>-->
+              </td>
+              <td v-if="r.edit || r.delete" style="visibility:hidden;width:85px;">
+                <!--<el-button v-if="r.edit" type="primary" size="mini" icon="el-icon-edit"></el-button>
+                <el-button v-if="r.delete" type="danger" size="mini" icon="el-icon-delete" @click=""></el-button>-->
+                <span class="el-tag el-tag--info el-tag--mini" style="cursor: pointer;">
+                  修改
+                </span>
+                <span class="el-tag el-tag--danger el-tag--mini" style="cursor: pointer;">
+                  删除
+                </span>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+      <table class="ct-form-fixed" border="0" cellpadding="0" cellspacing="0" style="" v-if="model.rows.findIndex((v1)=>{return v1.edit || v1.delete}) >= 0">
+        <thead>
+          <tr>
+            <th style="width:85px;">
+              操作
+            </th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr v-for="(r,index) in model.rows" v-if="index > 0 && !r.deleted" :key="index">
+            <td v-if="r.edit || r.delete">
+              <!--<el-button v-if="r.edit" type="primary" size="mini" icon="el-icon-edit" @click="editRow(index)"></el-button>
+  <el-button v-if="r.delete" type="danger" size="mini" icon="el-icon-delete" @click="deleteRow(index)"></el-button>-->
+              <span v-if="r.edit && r.isSet" class="el-tag el-tag--info el-tag--mini" style="cursor: pointer;" @click="pwdChange(r, index, 1)">
+                保存
+              </span>
+              <span v-else-if="r.edit" class="el-tag el-tag--info el-tag--mini" style="cursor: pointer;" @click="pwdChange(r, index, 2)">
+                修改
+              </span>
+              <span v-if="r.delete && !r.isSet" class="el-tag el-tag--danger el-tag--mini" style="cursor: pointer;" @click="deleteRow(index)">
+                删除
+              </span>
+              <span v-else-if="r.delete" class="el-tag  el-tag--mini" style="cursor: pointer;" @click="pwdChange(r, index, 3)">
+                取消
+              </span>
+            </td>
+            <td v-else>
+              &nbsp;
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    </div>
+</template>
+<script>
+  //Form内表格，已弃用
+  export default {
+    name: 'ct-form-list',
+    props: {
+      vmodel: Object,
+      api: String
+    },
+    data() {
+      return {
+        model:null
+      }
+    },
+    created() {
+      this.model = this.vmodel;
+      this.model.OptApi = this.api;
+    },
+    methods: {
+      deleteRow(index) {
+        var self = this;
+        this.model.deleteRow(index, () => {
+          self.$forceUpdate();
+        });
+      },
+      editRow(index) {
+        var self = this;
+        this.model.editRow(index, () => {
+          self.$forceUpdate();
+        });
+      },
+      addRow() {
+        var self = this;
+        if (self.model.dialogEdit) {
+          this.model.addRow(() => {
+            self.$forceUpdate();
+          });
+        }
+        else {
+          for (let i of self.model.rows) {
+            if (i.isSet) return self.$message.warning("请先保存当前编辑项");
+          }
+          let newRow = self.model.getCloneRowData(0);
+          newRow.isSet = true;
+          self.model.rows.push(newRow);
+          self.model.currentRow = self.model.getCloneRowData(0);
+          self.model.currentRow.isNew = true;
+          self.model.currentRow.index = self.model.rows.length - 1;
+        }
+      },
+      //修改
+      pwdChange(row, index, cg) {
+        let app = this;
+        if (app.model.dialogEdit) {
+          editRow(index);
+          return;
+        }
+
+        //点击修改 判断是否已经保存所有操作
+        for (let i of self.model.rows) {
+          if (i.isSet && app.model.currentRow.index !== index) {
+            app.$message.warning("请先保存当前编辑项");
+            return false;
+          }
+        }
+        //是否是取消操作
+        if (cg === 3) {
+          if (app.model.currentRow.isNew) app.model.rows.splice(index, 1);
+          return row.isSet = !row.isSet;
+        }
+        //提交数据
+        if (row.isSet) {//保存
+          if (!app.model.isDuplicated(app.model.currentRow.data, app.model.currentRow.isNew ? -1 : index)) {
+            let data = app.model.currentRow.field;
+            for (let k in data) {
+              row[k].value = data[k].value;
+              row[k].value1 = data[k].value1;
+            };
+            if (app.model.currentRow.isNew) {
+              app.model.addSourceRow(row);
+            }
+
+            row.isSet = false;
+          }
+        }
+        else {//修改
+          app.model.currentRow = app.model.getCloneRowData(index);
+          app.model.currentRow.isNew = false;
+          app.model.currentRow.index = index;
+          row.isSet = true;
+        }
+      },
+    }
+  }
+</script>
+<style>
+  .ct-form-list {
+    position:relative;
+  }
+  
+  .ct-form-list table {
+    border-top: 1px solid #ebeef5;
+    border-left: 1px solid #ebeef5;
+    min-width: 100%;
+    background-color:#ffffff;
+  }
+    .ct-form-list table th, .ct-form-list table td {
+      word-wrap: break-word;
+      white-space: nowrap;
+      min-width: 50px;
+      padding: 5px 10px;
+      border-bottom: 1px solid #ebeef5;
+      border-right: 1px solid #ebeef5;
+      position:relative;
+    }
+  .ct-form-list.ct-form-list-mini, .ct-form-list.ct-form-list-mini td {
+    min-height: 28px;
+    line-height: 26px;
+    font-size: 12px;
+  }
+  .ct-form-list.ct-form-list-small, .ct-form-list.ct-form-list-small td {
+    height: 32px;
+    line-height: 32px;
+    font-size: 13px;
+  }
+  .ct-form-list.ct-form-list-medium, .ct-form-list.ct-form-list-medium td {
+    height: 36px;
+    line-height: 36px;
+    font-size: 14px;
+  }
+  .ct-form-fixed {
+    position: absolute;
+    top: 0px;
+    right: 0px;
+    min-width: unset !important;
+  }
+</style>