feat(processSubmitDialog): 表单配置，协同办公添加客户信息选择功能

src/BIZComponents/processSubmitDialog/api.js

@@ -75,3 +75,14 @@ export async function listSimpleUserGroups() {
   }
   return Promise.reject(new Error(res.data.message));
 }
+
+/**
+ * 获取客户信息列表
+ */
+export async function contactPageUsages(params) {
+  const res = await request.get(`/eom/contact/page2Usages`, { params });
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}

src/BIZComponents/processSubmitDialog/components/contactSearch.vue

@@ -0,0 +1,104 @@
+<!-- 搜索表单 -->
+<template>
+  <seekPage :seekList="seekList" :formLength="3" @search="search"></seekPage>
+</template>
+<script>
+  import { reviewStatusSelect } from '@/enum/dict';
+  export default {
+    data() {
+      return {};
+    },
+    computed: {
+      // 表格列配置
+      seekList() {
+        return [
+        {
+            label: '关键字：',
+            value: 'searchName',
+            type: 'input',
+            placeholder: '编码/代号/客户名称/联系人电话'
+          },
+          {
+            label: '编码/代号：',
+            value: 'codeOrSerialNo',
+            type: 'input',
+            placeholder: '请输入'
+          },
+          {
+            label: '客户名称：',
+            value: 'name',
+            type: 'input',
+            placeholder: '请输入',
+          },
+          // {
+          //   label: '电话：',
+          //   value: 'phone',
+          //   width: 380,
+          //   type: 'input',
+          //   placeholder: '请输入'
+          // },
+          // {
+          //   label: '注册地址：',
+          //   value: 'addressName',
+          //   width: 380,
+          //   type: 'input',
+          //   placeholder: '请输入'
+          // },
+          // {
+          //   label: '联系地址：',
+          //   value: 'otherAddressName',
+          //   width: 380,
+          //   type: 'input',
+          //   placeholder: '请输入'
+          // },
+          // {
+          //   label: '联系人：',
+          //   value: 'linkName',
+          //   width: 380,
+          //   type: 'input',
+          //   placeholder: '请输入'
+          // },
+          // {
+          //   label: '状态',
+          //   value: 'targetTime',
+          //   width: 380,
+          //   type: 'select',
+          //   placeholder: '请选择状态',
+          //   planList:reviewStatusSelect
+          // },
+          // {
+          //   label: '部门：',
+          //   value: 'assessmentObject',
+          //   width: 380,
+          //   type: 'input',
+          //   placeholder: '请输入',
+          // },
+          // {
+          //   label: '创建人：',
+          //   value: 'createUsername',
+          //   width: 380,
+          //   type: 'input',
+          //   placeholder: '请输入姓名'
+          // },
+          {
+            label: '创建时间：',
+            value: 'createTime',
+            type: 'date',
+            dateType: 'datetimerange',
+            placeholder: '',
+            width: 380,
+            valueAr: ['createTimeStart', 'createTimeEnd']
+          },
+        ];
+      }
+    },
+    methods: {
+      /* 搜索 */
+      search(e) {
+        this.$emit('search', {
+          ...e
+        });
+      }
+    }
+  };
+</script>

src/BIZComponents/processSubmitDialog/components/parentList.vue

@@ -0,0 +1,229 @@
+<template>
+  <ele-modal
+    title="选择客户"
+    custom-class="ele-dialog-form long-dialog-form"
+    :visible.sync="visible"
+    :before-close="handleClose"
+    :close-on-click-modal="false"
+    top="5vh"
+    :close-on-press-escape="false"
+    append-to-body
+    width="70%"
+    :maxable="true"
+  >
+    <el-card shadow="never">
+      <contact-search @search="reload"></contact-search>
+
+      <ele-split-layout
+        width="244px"
+        allow-collapse
+        :right-style="{ overflow: 'hidden' }"
+      >
+        <div class="ele-border-lighter split-layout-right-content">
+          <AssetTree
+            @handleNodeClick="handleNodeClick"
+            id="17"
+            :isFirstRefreshTable="false"
+            ref="treeList"
+          />
+        </div>
+        <!-- 表格 -->
+        <template v-slot:content>
+          <ele-pro-table
+            ref="table"
+            :columns="columns"
+            :datasource="datasource"
+            row-key="id"
+            height="calc(100vh - 460px)"
+            class="dict-table"
+            @cell-click="cellClick"
+          >
+            <!-- 表头工具栏 -->
+            <template v-slot:action="{ row }">
+              <el-radio class="radio" v-model="radio" :label="row.id"
+                ><i></i
+              ></el-radio>
+            </template>
+          </ele-pro-table>
+        </template>
+      </ele-split-layout>
+    </el-card>
+
+    <div slot="footer">
+      <el-button type="primary" size="small" @click="selected">选择</el-button>
+      <el-button size="small" @click="handleClose">关闭</el-button>
+    </div>
+  </ele-modal>
+</template>
+
+<script>
+  import { contactPageUsages } from '../api.js';
+  import ContactSearch from './contactSearch.vue';
+  import AssetTree from '@/components/AssetTree';
+
+  export default {
+    components: {
+      ContactSearch,
+      AssetTree
+    },
+    props: {
+      classType: {
+        type: Number | String,
+        default: 1
+      }
+    },
+    data() {
+      return {
+        visible: false,
+
+        columns: [
+          {
+            action: 'action',
+            slot: 'action',
+            align: 'center',
+            label: '选择'
+          },
+          {
+            columnKey: 'index',
+            label: '序号',
+            type: 'index',
+            width: 55,
+            align: 'center',
+            showOverflowTooltip: true,
+            fixed: 'left'
+          },
+          {
+            prop: 'code',
+            label: '客户编码',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 140
+          },
+          {
+            prop: 'name',
+            label: '客户名称',
+            align: 'center',
+            slot: 'name',
+            showOverflowTooltip: true,
+            minWidth: 200
+          },
+          {
+            prop: 'serialNo',
+            label: '客户代号',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 140
+          },
+          {
+            prop: 'phone',
+            label: '客户电话',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 120
+          },
+          {
+            prop: 'addressName',
+            label: '单位地址',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 120,
+            formatter: (_row, _column, cellValue) => {
+              let addr =
+                '' + _row.addressName
+                  ? _row.addressName.replaceAll(',', '')
+                  : '';
+              addr += _row.address ? _row.address : '';
+              return addr;
+            }
+          },
+          {
+            prop: 'linkName',
+            label: '联系人',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 120
+          },
+          {
+            prop: 'linkPhone',
+            label: '联系人电话',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 120
+          },
+          {
+            prop: 'status',
+            label: '状态',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 100,
+            formatter: (_row, _column, cellValue) => {
+              return _row.status === 1 ? '启用' : '禁用';
+            }
+          },
+
+          {
+            prop: 'remark',
+            label: '备注',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 200
+          }
+        ],
+
+        radio: null
+      };
+    },
+
+    watch: {},
+    methods: {
+      open(item) {
+        if (item) {
+          this.radio = item.id;
+        }
+        this.visible = true;
+      },
+
+      /* 表格数据源 */
+      datasource({ page, limit, where, order }) {
+        return contactPageUsages({
+          pageNum: page,
+          size: limit,
+          type: this.classType,
+          ...where,
+          status: '1'
+        });
+      },
+
+      /* 刷新表格 */
+      reload(where) {
+        this.$refs.table.reload({ page: 1, where });
+      },
+
+      handleNodeClick(data, node) {
+        this.curNodeData = data;
+        this.reload({ categoryId: data.id });
+      },
+
+      // 单击获取id
+      cellClick(row) {
+        this.current = row;
+        this.radio = row.id;
+      },
+      handleClose() {
+        this.visible = false;
+        this.current = null;
+        this.radio = '';
+      },
+
+      selected() {
+        if (!this.current) {
+          return this.$message.warning('请选择客户');
+        }
+        this.$emit('changeParent', this.current);
+        this.handleClose();
+      }
+    }
+  };
+</script>
+
+<style lang="scss" scoped></style>

src/BIZComponents/processSubmitDialog/processSubmitDialog.vue

@@ -6,7 +6,7 @@
     :title="title"
     append-to-body
     :close-on-click-modal="false"
-    :width="isRight ? '800px' : '450px'"
+    :width="modelWidth"
     :before-close="cancel"
     :maxable="true"
     :resizable="true"
@@ -62,6 +62,17 @@
               </div>
             </div>
           </template>
+          
+          <!-- 客户名称 -->
+          <template v-slot:eom_contact="scope">
+            <div class="eom_contact">
+              <el-input
+                  v-model="scope.model.eom_contact.name"
+                  style="width: 100%"
+                  @click.native="addContact('eom_contact')"
+                ></el-input>
+            </div>
+          </template>
         </fm-generate-form>
       </div>
       <div
@@ -269,6 +280,10 @@
         @confirm="getTreeList"
       ></staffSelection>
     </div>
+    <parentList
+      ref="parentRef"
+      @changeParent="handleConcatConfirm"
+    ></parentList>
   </ele-modal>
 </template>
 <script>
@@ -295,11 +310,12 @@
   import staffSelection from '@/components/staffSelection/staffSelection.vue';
   import { topLevel1, topLevel2, topLevel3 } from '@/enum/dict';
   import dayjs from 'dayjs';
+  import parentList from './components/parentList.vue';
   import { number } from 'echarts';
   import { del } from 'vue';
   export default {
     name: 'processSubmitDialog',
-    components: { visibilityRangeDialog, staffSelection },
+    components: { visibilityRangeDialog, staffSelection, parentList },
     mixins: [dictMixins],
     props: {
       processSubmitDialogFlag: {
@@ -357,7 +373,15 @@
       };
     },
     computed: {
-      ...mapGetters(['user'])
+      ...mapGetters(['user']),
+      modelWidth() {
+        let width = this.jsonData.config?.platform && this.jsonData.config.platform === 'pc' ? 1100 : 450;
+        if(this.isRight) {
+          return width + 350 + 'px'
+        } else {
+          return width + 'px'
+        }
+      }
     },
     async created() {
       let typeObj = await getProduceTreeByCode(
@@ -433,6 +457,37 @@ this.postOptions.push(...response.data);
           input_jd9ouzyh: num
         });
       },
+
+      async addContact(type) {
+        console.log(type);
+        let data = await this.$refs.generateForm.getData(false);
+        console.log('data', data);
+        data[type] = {
+          id: '',
+          name: ''
+        };
+        this.$refs.generateForm.setData({
+          type: data[type]
+        });
+        let item = {
+          id: data[type].id
+        };
+        this.$refs.parentRef.open(item);
+      },
+
+      async handleConcatConfirm(item) {
+        console.log('选择的客户', item);
+
+        let data = await this.$refs.generateForm.getData(false);
+        data['eom_contact'] = {
+          id: item.id,
+          name: item.name
+        }
+        this.$refs.generateForm.setData({
+          'eom_contact': data['eom_contact']
+        });
+        console.log('data~~~~', data);
+      },
       async init(row = {}) {
         this.title = row.name; //'新建' + row.name + '单';
         this.form = _.cloneDeep(row);
@@ -444,7 +499,7 @@ this.postOptions.push(...response.data);
         this.$set(this.form, 'key', '');
         this.$set(this.form, 'valueJson', {});
         this.jsonData = JSON.parse(this.form.formJson.makingJson);
-        console.log(this.jsonData);
+        console.log('jsonData', this.jsonData);
 
         this.jsonData.config.dataSource &&
           this.jsonData.config.dataSource.forEach((item) => {

src/views/bpm/collaborative/detail.vue

@@ -1,7 +1,7 @@
 <template>
   <ele-modal
     :visible="formDetailDialogFlag"
-    :width="outgoingData?.id ? '80%' : '400px'"
+    :width="modelWidth"
     :centered="true"
     :close-on-click-modal="false"
     append-to-body
@@ -53,6 +53,15 @@
             </div>
           </div>
         </template>
+        <!-- 客户名称 -->
+          <template v-slot:eom_contact="scope">
+            <div class="eom_contact">
+              <el-input
+                  v-model="scope.model.eom_contact.name"
+                  style="width: 100%"
+                ></el-input>
+            </div>
+          </template>
       </fm-generate-form>
     </div>
     <outgoingDetails
@@ -88,6 +97,11 @@
         outgoingData:{}
       };
     },
+    computed: {
+      modelWidth() {
+        return (this.outgoingData?.id || this.jsonData.config?.platform && this.jsonData.config.platform === 'pc') ? '80%' : '400px';
+      }
+    },
     methods: {
        open(row) {
         this.form = _.cloneDeep(row);