chenc 2 years ago
parent
commit
3a506653be

+ 266 - 0
packages/KBatch/batch2.vue

@@ -0,0 +1,266 @@
+<!--
+ * @Description: 动态表格 用于批量填入数据
+ * @Author: kcz
+ * @Date: 2020-03-27 18:36:56
+ * @LastEditors: kcz
+ * @LastEditTime: 2021-05-14 14:04:14
+ -->
+<template>
+  <a-form-model
+    ref="dynamicValidateForm"
+    layout="inline"
+    :model="dynamicValidateForm"
+  >
+  <a-card v-for="(d,index) in dynamicValidateForm.domains" :key="d.key">
+    <a-row :gutter="24">
+    <a-col :md="12" :sm="12">
+      <div v-for="c in columns" :key="c.title">{{c.title}}</div>
+    </a-col>
+    <a-col :md="12" :sm="12">
+      <!-- <div v-for="(d,index) in dynamicValidateForm.domains" :key="d.key"> -->
+        <div v-for="item in d.recordList" :key="item.key">
+          <KFormModelItem
+            :key="item.key + '1'"
+            :record="item"
+            :config="config"
+            :parentDisabled="disabled"
+            :index="index"
+            :domains="dynamicValidateForm.domains"
+            :dynamicData="dynamicData"
+            v-model="d[item.model]"
+            @input="handleInput"
+          />
+        </div>
+      <!-- </div> -->
+      
+    </a-col>
+    </a-row>
+  </a-card>
+
+    <a-table
+      class="batch-table"
+      :pagination="false"
+      :rowKey="record => record.key"
+      :columns="columns"
+      :dataSource="dynamicValidateForm.domains"
+      bordered
+      :scroll="{
+        x: listLength * 190 + 80 + (!record.options.hideSequence ? 60 : 0),
+        y: record.options.scrollY
+      }"
+    >
+      <template
+        v-for="item in record.list"
+        :slot="item.key"
+        slot-scope="text, record, index"
+      >
+        <KFormModelItem
+          :key="item.key + '1'"
+          :record="item"
+          :config="config"
+          :parentDisabled="disabled"
+          :index="index"
+          :domains="dynamicValidateForm.domains"
+          :dynamicData="dynamicData"
+          v-model="record[item.model]"
+          @input="handleInput"
+        />
+      </template>
+      <template slot="dynamic-opr-button" slot-scope="text, record">
+        <a-icon
+          title="删除改行"
+          v-if="!disabled"
+          class="dynamic-opr-button"
+          type="minus-circle-o"
+          @click="removeDomain(record)"
+        />
+        <a-icon
+          title="复制添加"
+          v-if="!disabled"
+          type="copy-o"
+          class="dynamic-opr-button"
+          @click="copyDomain(record)"
+        />
+      </template>
+    </a-table>
+    <a-button type="dashed" :disabled="disabled" @click="addDomain">
+      <a-icon type="plus" />增加
+    </a-button>
+  </a-form-model>
+</template>
+
+<script>
+import KFormModelItem from "./module/KFormModelItem";
+export default {
+  name: "KBatch",
+  props: ["record", "value", "dynamicData", "config", "parentDisabled"],
+
+  components: {
+    KFormModelItem
+  },
+  watch: {
+    value: {
+      // value 需要深度监听及默认先执行handler函数
+      handler(val) {
+        this.dynamicValidateForm.domains = val || [];
+      },
+      immediate: true,
+      deep: true
+    }
+  },
+  data() {
+    return {
+      dynamicValidateForm: {
+        domains: []
+      }
+    };
+  },
+  created(){
+  },
+  computed: {
+    listLength() {
+      return this.record.list.filter(item => !item.options.hidden).length;
+    },
+    columns() {
+      const columns = [];
+      if (!this.record.options.hideSequence) {
+        columns.push({
+          title: "序号",
+          dataIndex: "sequence_index_number",
+          width: "60px",
+          align: "center",
+          customRender: (text, record, index) => {
+            return index + 1;
+          }
+        });
+      }
+
+      columns.push(
+        ...this.record.list
+          .filter(item => !item.options.hidden)
+          .map((item, index) => {
+            return {
+              title: item.label,
+              dataIndex: item.key,
+              width: index === this.record.list.length - 1 ? "" : "190px",
+              scopedSlots: { customRender: item.key }
+            };
+          })
+      );
+
+      columns.push({
+        title: "操作",
+        dataIndex: "dynamic-opr-button",
+        fixed: "right",
+        width: "80px",
+        align: "center",
+        scopedSlots: { customRender: "dynamic-opr-button" }
+      });
+
+      return columns;
+    },
+    disabled() {
+      return this.record.options.disabled || this.parentDisabled;
+    }
+  },
+  methods: {
+    validationSubform() {
+      let verification;
+      this.$refs.dynamicValidateForm.validate(valid => {
+        verification = valid;
+      });
+      return verification;
+    },
+    resetForm() {
+      this.$refs.dynamicValidateForm.resetFields();
+    },
+    removeDomain(item) {
+      const index = this.dynamicValidateForm.domains.indexOf(item);
+      if (index !== -1) {
+        this.dynamicValidateForm.domains.splice(index, 1);
+      }
+    },
+    copyDomain(record) {
+      const data = {};
+      this.record.list.forEach(item => {
+        data[item.model] = record[item.model];
+      });
+      this.dynamicValidateForm.domains.push({
+        ...data,
+        key: Date.now()
+      });
+      this.handleInput();
+    },
+    addDomain() {
+      const data = {};
+      this.record.list.forEach(item => {
+        data[item.model] = item.options.defaultValue;
+      });
+
+      this.dynamicValidateForm.domains.push({
+        ...data,
+        key: Date.now()
+      });
+      //循环字段数据复制字段形成唯一
+      this.dynamicValidateForm.domains.forEach((element,index) => {
+        //组件数组
+        const recordList=[]
+        //循环原始组件获取字段生成流水字段
+        this.record.list.forEach(item => {
+          data[item.model] = item.options.defaultValue;
+          let m=item.model;
+          m=m+index;
+          if(!element[m]){
+            element[m]=""
+          }
+          
+          //根据流水字段形成对应组件
+          const r=JSON.parse(JSON.stringify(item));
+          r.model=m;
+          recordList.push(r)
+        });
+        if(!element.recordList){
+          element.recordList=recordList;
+        }
+      });
+
+      this.handleInput();
+    },
+    handleInput() {
+      this.dynamicValidateForm.domains.forEach((element,index) => {
+        console.log("element",element)
+        this.record.list.forEach(item => {
+          let m=item.model;
+          m=m+index;
+          element[item.model]=element[m];
+        });
+        
+        console.log("element",element)
+      });
+  
+      this.$emit("change", this.dynamicValidateForm.domains);
+    }
+  }
+};
+</script>
+<style scoped>
+.dynamic-opr-button:last {
+  margin-left: 0px;
+}
+.dynamic-opr-button {
+  cursor: pointer;
+  position: relative;
+  top: 4px;
+  font-size: 16px;
+  color: #999;
+  transition: all 0.3s;
+  margin-left: 6px;
+}
+.dynamic-opr-button:hover {
+  color: #e89;
+}
+.dynamic-opr-button[disabled] {
+  cursor: not-allowed;
+  opacity: 0.5;
+}
+</style>

+ 1 - 0
packages/KFormDesign/index.vue

@@ -630,6 +630,7 @@ export default {
             this.formData.businessTable = this.$route.query.tableName; //数据库表明
             this.formData.businessTable = this.$route.query.tableName; //数据库表明
             this.formData.text = res.data.result.text; //表单标题
             this.formData.text = res.data.result.text; //表单标题
             this.formData.stepMemo=res.data.result.stepMemo;//表单备注
             this.formData.stepMemo=res.data.result.stepMemo;//表单备注
+            this.formData.type=res.data.result.type;//表单类型
             // this.$message.success("查询成功");
             // this.$message.success("查询成功");
           }
           }
         } else {
         } else {

+ 1 - 1
packages/KFormDesign/module/formItemProperties.vue

@@ -24,7 +24,7 @@
           <a-input v-if="selectItem.type=='batch'" v-model="selectItem.model" placeholder="请输入" />
           <a-input v-if="selectItem.type=='batch'" v-model="selectItem.model" placeholder="请输入" />
           <!-- 类型不为动态表格的情况 -->
           <!-- 类型不为动态表格的情况 -->
           <a-select v-if="selectItem.type!=='batch'" v-model="selectItem.model" style="width: 100%" placeholder="请选择数据库表名" allowClear show-search >
           <a-select v-if="selectItem.type!=='batch'" v-model="selectItem.model" style="width: 100%" placeholder="请选择数据库表名" allowClear show-search >
-            <a-select-option v-for="(item) in tableColumnList"  :key="item.columnName" :value="item.columnName">{{item.columnName}}{{item.columnComment}}</a-select-option>
+            <a-select-option v-for="(item) in tableColumnList"  :key="item.columnName" :value="item.columnName">{{item.columnName}}({{item.columnComment}})</a-select-option>
           </a-select>
           </a-select>
         </a-form-item>
         </a-form-item>
         <!-- input type start -->
         <!-- input type start -->

+ 14 - 7
packages/KFormDesign/module/operatingArea.vue

@@ -20,14 +20,16 @@
       <a-tooltip title="预览">
       <a-tooltip title="预览">
         <a v-if="toolbars.includes('preview')" @click="$emit('handlePreview')">
         <a v-if="toolbars.includes('preview')" @click="$emit('handlePreview')">
           <a-icon type="chrome" />
           <a-icon type="chrome" />
-          <span v-if="showToolbarsText">预览</span>
+          <!-- <span v-if="showToolbarsText">预览</span> -->
+          <span>预览</span>
         </a>
         </a>
       </a-tooltip>
       </a-tooltip>
 
 
       <a-tooltip title="查询">
       <a-tooltip title="查询">
         <a v-if="toolbars.includes('preview')" @click="$emit('handleQuery')">
         <a v-if="toolbars.includes('preview')" @click="$emit('handleQuery')">
           <a-icon type="search" />
           <a-icon type="search" />
-          <span v-if="showToolbarsText">查询</span>
+          <!-- <span v-if="showToolbarsText">查询</span> -->
+          <span>查询</span>
         </a>
         </a>
       </a-tooltip>
       </a-tooltip>
 
 
@@ -37,7 +39,8 @@
           @click="$emit('handleOpenImportJsonModal')"
           @click="$emit('handleOpenImportJsonModal')"
         >
         >
           <a-icon type="upload" />
           <a-icon type="upload" />
-          <span v-if="showToolbarsText">导入</span>
+          <!-- <span v-if="showToolbarsText">导入</span> -->
+          <span>导入</span>
         </a>
         </a>
       </a-tooltip>
       </a-tooltip>
 
 
@@ -47,7 +50,8 @@
           @click="$emit('handleOpenJsonModal')"
           @click="$emit('handleOpenJsonModal')"
         >
         >
           <a-icon type="credit-card" />
           <a-icon type="credit-card" />
-          <span v-if="showToolbarsText">生成JSON</span>
+          <!-- <span v-if="showToolbarsText">生成JSON</span> -->
+          <span>生成JSON</span>
         </a>
         </a>
       </a-tooltip>
       </a-tooltip>
 
 
@@ -64,7 +68,8 @@
       <a-tooltip title="清空">
       <a-tooltip title="清空">
         <a v-if="toolbars.includes('reset')" @click="$emit('handleReset')">
         <a v-if="toolbars.includes('reset')" @click="$emit('handleReset')">
           <a-icon type="delete" />
           <a-icon type="delete" />
-          <span v-if="showToolbarsText">清空</span>
+          <!-- <span v-if="showToolbarsText">清空</span> -->
+          <span>清空</span>
         </a>
         </a>
       </a-tooltip>
       </a-tooltip>
       <a-divider type="vertical" />
       <a-divider type="vertical" />
@@ -75,7 +80,8 @@
           @click="$emit('handleUndo')"
           @click="$emit('handleUndo')"
         >
         >
           <a-icon type="undo" />
           <a-icon type="undo" />
-          <span v-if="showToolbarsText">撤销</span>
+          <!-- <span v-if="showToolbarsText">撤销</span> -->
+          <span>撤销</span>
         </a>
         </a>
       </a-tooltip>
       </a-tooltip>
       <a-tooltip title="重做">
       <a-tooltip title="重做">
@@ -85,7 +91,8 @@
           @click="$emit('handleRedo')"
           @click="$emit('handleRedo')"
         >
         >
           <a-icon type="redo" />
           <a-icon type="redo" />
-          <span v-if="showToolbarsText">重做</span>
+          <!-- <span v-if="showToolbarsText">重做</span> -->
+          <span>重做</span>
         </a>
         </a>
       </a-tooltip>
       </a-tooltip>
       <!-- 按钮左侧插槽 start -->
       <!-- 按钮左侧插槽 start -->

+ 10 - 0
packages/KFormDesign/module/selectTbTableInfoModal.vue

@@ -11,6 +11,11 @@
   >
   >
   <a-alert message="目前该数据库表关联的表单存在多个,请选择其中一个!" type="info" banner/><br>
   <a-alert message="目前该数据库表关联的表单存在多个,请选择其中一个!" type="info" banner/><br>
     <a-table bordered :data-source="dataSource" :columns="columns" :rowKey='record=>record.id' :pagination="false">
     <a-table bordered :data-source="dataSource" :columns="columns" :rowKey='record=>record.id' :pagination="false">
+      
+          <span slot="type" slot-scope="text, record">
+            <a-tag color="cyan" v-if="record.type=='1'">PC端</a-tag>
+            <a-tag color="blue" v-if="record.type=='2'">钉钉端</a-tag>
+          </span>
         <template slot="operation" slot-scope="text, record">
         <template slot="operation" slot-scope="text, record">
           <a href="javascript:;" @click="textClick(record)">确定</a>
           <a href="javascript:;" @click="textClick(record)">确定</a>
         </template>
         </template>
@@ -42,6 +47,11 @@ export default {
           title: '表单描述',
           title: '表单描述',
           dataIndex: 'stepMemo',
           dataIndex: 'stepMemo',
         },
         },
+        {
+          title: "表单类型",
+          dataIndex: "type",
+          scopedSlots: { customRender: "type" }
+        },
         {
         {
           title: '操作',
           title: '操作',
           dataIndex: 'operation',
           dataIndex: 'operation',

+ 1 - 0
packages/PreviewCode/index.vue

@@ -196,6 +196,7 @@ export default {
       //保存接口
       //保存接口
       formAdd(formData).then(res => {
       formAdd(formData).then(res => {
         if (res.data.success) {
         if (res.data.success) {
+          this.$message.config({top: '600px'})
           this.$message.success("保存成功");
           this.$message.success("保存成功");
         } else {
         } else {
           this.$message.error("保存失败");
           this.$message.error("保存失败");

+ 2 - 1
packages/api/api.js

@@ -1,6 +1,7 @@
 import axios from "axios";
 import axios from "axios";
-const url = "http://127.0.0.1:8090/jeecg-boot";//本地
+// const url = "http://127.0.0.1:8090/jeecg-boot";//本地
 // const url = "http://106.15.206.14:8087/jeecg-boot"; //测试环境
 // const url = "http://106.15.206.14:8087/jeecg-boot"; //测试环境
+const url = "http://192.168.1.158:8087/jeecg-boot"; //森宇环境
 export function getIdcsList() {
 export function getIdcsList() {
   return axios.get(url + "/tbTableInfo/list");
   return axios.get(url + "/tbTableInfo/list");
 }
 }