fix

dsk-operate-ui/package.json

@@ -47,10 +47,12 @@
     "js-md5": "^0.7.3",
     "jsencrypt": "3.0.0-rc.1",
     "json-editor-vue": "^0.11.1",
+    "lodash-es": "^4.17.21",
     "mitt": "^3.0.1",
     "nprogress": "0.2.0",
     "quill": "1.3.7",
     "screenfull": "5.0.2",
+    "serialize-javascript": "^6.0.2",
     "sortablejs": "^1.15.0",
     "uuid": "^9.0.1",
     "vue": "2.6.12",

dsk-operate-ui/src/utils/generator/custom-design-options.js

@@ -9,8 +9,7 @@ export const subfieldModuleTemplate = {
   subfieldModuleNameRules: {
     trigger: ["blur", "change"],
     validator: (rule, value, callback) => {
-      alert(1);
-      if (!value) {
+      if (!value && !value?.toString()?.trim()) {
         return callback(new Error("请输入分栏名称"));
       }
       callback();
@@ -22,11 +21,12 @@ export const subfieldModuleTemplate = {
 };
 
 export const defaultComOptions = [
+  // 单行文本
   {
     // 组件类型
-    comType: "el-input",
+    comType: "text",
     // 组件展示图标
-    comShowIcon: require("@/assets/images/consultingAgencyManagement/customForm/icon_single_line_text@2x.png"),
+    comShowIcon: "icon_single_line_text@2x.png",
     // 验证通过
     checkedAllow: false,
     // 表单属性
@@ -49,5 +49,66 @@ export const defaultComOptions = [
       // 输入值为空提示
       placeholder: "请输入"
     }
-  }
+  },
+  // 多行文本
+  {
+    // 组件类型
+    comType: "textarea",
+    // 组件展示图标
+    comShowIcon: "icon_multiline_text@2x.png",
+    // 验证通过
+    checkedAllow: false,
+    // 表单属性
+    formAttribute: {
+      // 验证规则
+      rules: {},
+      // 是否必填
+      required: false,
+      // 字段名称
+      fieldName: "",
+      // 展示label
+      label: "多行文本",
+      // 组件宽度
+      width: 100
+    },
+    // 组件属性
+    componentAttribute: {
+      // 绑定的值
+      value: "",
+      // 输入值为空提示
+      placeholder: "请输入"
+    }
+  },
+  // 下拉选项
+  {
+    // 组件类型
+    comType: "select",
+    // 组件展示图标
+    comShowIcon: "icon_drop_down@2x.png",
+    // 验证通过
+    checkedAllow: false,
+    // 表单属性
+    formAttribute: {
+      // 验证规则
+      rules: {},
+      // 是否必填
+      required: false,
+      // 字段名称
+      fieldName: "",
+      // 展示label
+      label: "下拉选项",
+      // 组件宽度
+      width: 100,
+      selectOptions: [],
+      // 是否多选
+      isMultiple: false
+    },
+    // 组件属性
+    componentAttribute: {
+      // 绑定的值
+      value: "",
+      // 输入值为空提示
+      placeholder: "请选择"
+    }
+  },
 ];
\ No newline at end of file

dsk-operate-ui/src/utils/index.js

@@ -930,5 +930,27 @@ export const detailSideBar = new Map([
 
 export const tableContainerFixed = (scrollBarContainer = "",) => {
 
-}
+};
+
+/**
+ * 序列化 function
+ * @param {Function} fn 
+ * @returns 
+ */
+export const serializationFn = (fn) => {
+  const type = Object.prototype.toString.call(fn);
+  if (type != "[object AsyncFunction]" && type != "[object Function]") return;
+  return fn.toString();
+};
 
+/**
+ * 反序列化 function
+ * @param {string} fnStr 
+ */
+export const deserializeFn = (fnStr) => {
+  try {
+    return new Function('return ' + fnStr)();
+  } catch (error) {
+    return null;
+  }
+};

dsk-operate-ui/src/views/consultingOrgManagement/components/CustomForm/components/CustomFormDesign.vue

@@ -11,7 +11,7 @@
             <transition-group name="fade" tag="div" class="draggable-fields-list">
               <div class="draggable-fields-item" :class="{'has-no-subfield-module' : !subfieldModuleForm.subfieldModuleList.length}"
                 v-for="(item,index) of defaultComOptions" :key="index" @click="fieldsItemClick">
-                <img :src="item.comShowIcon" alt="">
+                <img :src="require(`@/assets/images/consultingAgencyManagement/customForm/${item.comShowIcon}`)" alt="">
                 <span>{{item.formAttribute.label}}</span>
               </div>
             </transition-group>
@@ -84,6 +84,9 @@ import SetFieldOption from "@/views/consultingOrgManagement/components/CustomFor
 import { elementMessageSingleton } from "@/utils";
 import vuedraggable from "vuedraggable";
 import { v4 } from 'uuid';
+import { getCustomFormDetailApi, addCustomFormDataApi } from "@/api/consultingOrgManagement";
+import { cloneDeep } from "lodash-es";
+import serialize from "serialize-javascript";
 export default {
   name: "customFormDesign",
   components: {
@@ -147,17 +150,37 @@ export default {
       const randomIndex = Math.floor(Math.random() * alphabet.length);
       return alphabet[randomIndex];
     },
-    initModule() {
-      // 模块初始化
-      this.addSubfieldModule();
-      const component = JSON.parse(JSON.stringify(defaultComOptions[0]));
-      component.uid = v4();
-      component.formAttribute.fieldName = this.generateRandomLowerCaseLetter() + component.uid.split("-").join("");
-      this.activeItemData = component;
-      this.activeItemDataOrigin = JSON.parse(JSON.stringify(this.activeItemData));
-      this.activeModuleId = this.subfieldModuleForm.subfieldModuleList[0].uid;
-      this.activeUid = component.uid;
-      this.subfieldModuleForm.subfieldModuleList[0].children.push(component);
+    async getCustomFormDetail() {
+      try {
+        const result = await getCustomFormDetailApi();
+        if (result.code == 200 && result.data?.length) {
+          return result.data;
+        }
+        return [];
+      } catch (error) {
+
+      }
+    },
+    async initModule() {
+      try {
+        const result = await this.getCustomFormDetail();
+        if (result.length) {
+          // 有模板数据 进行回显
+          return;
+        }
+        // 模块初始化
+        this.addSubfieldModule();
+        const component = cloneDeep(defaultComOptions[0]);
+        component.uid = v4();
+        component.formAttribute.fieldName = this.generateRandomLowerCaseLetter() + component.uid.split("-").join("");
+        this.activeItemData = component;
+        this.activeItemDataOrigin = cloneDeep(this.activeItemData);
+        this.activeModuleId = this.subfieldModuleForm.subfieldModuleList[0].uid;
+        this.activeUid = component.uid;
+        this.subfieldModuleForm.subfieldModuleList[0].children.push(component);
+      } catch (error) {
+
+      }
     },
     onMove(e, originalEvent) {
       try {
@@ -179,7 +202,7 @@ export default {
     // 克隆目标组件
     targetComClone(v) {
       console.log("clone", v);
-      const cloneTarget = JSON.parse(JSON.stringify(v));
+      const cloneTarget = cloneDeep(v);
       cloneTarget.uid = v4();
       cloneTarget.formAttribute.fieldName = this.generateRandomLowerCaseLetter() + cloneTarget.uid.split("-").join("");
       return cloneTarget;
@@ -201,11 +224,11 @@ export default {
     },
     // 取消当前焦点设置
     cancelSetOptions() {
-      this.activeItemData = JSON.parse(JSON.stringify(this.activeItemDataOrigin));
+      this.activeItemData = cloneDeep(this.activeItemDataOrigin);
     },
     // 设置表单完成
     setOptionsFinish(current, parentUid) {
-      const _temp = JSON.parse(JSON.stringify(current));
+      const _temp = cloneDeep(current);
       _temp.checkedAllow = true;
       const index = this.subfieldModuleForm.subfieldModuleList.findIndex(item => item.uid == parentUid);
       if (index > -1) {
@@ -218,7 +241,7 @@ export default {
     },
     // 命中变化的表单元素
     currentActiveByItemId(current) {
-      const _temp = JSON.parse(JSON.stringify(current));
+      const _temp = cloneDeep(current);
       _temp.checkedAllow = false;
       this.activeUid = current.uid;
       this.activeItemData = _temp;
@@ -229,7 +252,7 @@ export default {
     },
     // 添加分栏
     addSubfieldModule() {
-      const _temp = JSON.parse(JSON.stringify(subfieldModuleTemplate));
+      const _temp = cloneDeep(subfieldModuleTemplate);
       _temp.uid = v4();
       this.moduleCount += 1;
       _temp.defaultSubfieldModuleName = `分栏${this.moduleCount}`;
@@ -251,7 +274,7 @@ export default {
     },
     // 编辑模块 更新title
     editModule(module) {
-      const _temp = JSON.parse(JSON.stringify(module));
+      const _temp = cloneDeep(module);
       const flag = this.onMove();
       if (!flag) return;
       const index = this.subfieldModuleForm.subfieldModuleList.findIndex(item => item.uid == _temp.uid);
@@ -271,7 +294,7 @@ export default {
     activeSubfieldItem(itemModule, parentUid) {
       const flag = this.onMove();
       if (!flag) return;
-      const _temp = JSON.parse(JSON.stringify(itemModule));
+      const _temp = cloneDeep(itemModule);
       _temp.checkedAllow = false;
       this.activeUid = _temp.uid;
       this.activeModuleId = parentUid;

dsk-operate-ui/src/views/consultingOrgManagement/components/CustomForm/components/SetFieldOption.vue

@@ -15,9 +15,21 @@
         <el-input v-model="comActiveFieldData.componentAttribute.placeholder" placeholder="请输入提示文字" clearable></el-input>
       </el-form-item>
       <!-- 默认值 -->
-      <el-form-item label="默认值" class="set-field-option-item" prop="componentAttribute.value" v-if="comActiveFieldData.componentAttribute">
-        <el-input v-model="comActiveFieldData.componentAttribute.value" placeholder="请输入默认值" clearable></el-input>
-      </el-form-item>
+      <template v-if="defaultValueContain.includes(comActiveFieldData.comType)">
+        <el-form-item label="默认值" class="set-field-option-item" prop="componentAttribute.value" v-if="comActiveFieldData.componentAttribute">
+          <el-input v-model="comActiveFieldData.componentAttribute.value" placeholder="请输入默认值" clearable></el-input>
+        </el-form-item>
+      </template>
+      <!-- 下拉框配置 -->
+      <template v-if="comActiveFieldData.comType == 'select'">
+        <el-form-item label="类型" class="set-field-option-item set-field-option-select" prop="formAttribute.isMultiple"
+          v-if="comActiveFieldData.formAttribute">
+          <el-radio-group v-model="comActiveFieldData.formAttribute.isMultiple">
+            <el-radio :label="false">单选</el-radio>
+            <el-radio :label="true">多选</el-radio>
+          </el-radio-group>
+        </el-form-item>
+      </template>
 
       <!-- 表单样式 -->
       <div class="set-field-option-styles-item" v-if="comActiveFieldData.formAttribute">
@@ -51,6 +63,7 @@
   </div>
 </template>
 <script>
+import { cloneDeep } from "lodash-es";
 export default {
   name: "setFieldOption",
   props: {
@@ -75,7 +88,7 @@ export default {
     activeFieldData: {
       handler(newValue) {
         // 通过保存更新源数据按钮
-        this.comActiveFieldData = JSON.parse(JSON.stringify(newValue));
+        this.comActiveFieldData = cloneDeep(newValue);
       },
       deep: true
     },
@@ -104,10 +117,11 @@ export default {
     };
     return {
       // 通过保存更新源数据按钮
-      comActiveFieldData: JSON.parse(JSON.stringify(this.activeFieldData)),
+      comActiveFieldData: cloneDeep(this.activeFieldData),
       setFieldOptionRules: {
         fieldName: [{ required: true, trigger: ["blur", "change"], validator: fieldNameValidor }]
-      }
+      },
+      defaultValueContain: ["text", "textarea"]
     };
   },
   //可访问data属性
@@ -202,6 +216,46 @@ export default {
         }
       }
     }
+
+    /* 下拉框样式重置 */
+    &.set-field-option-select {
+      .el-form-item__content {
+        line-height: 22px;
+
+        .el-radio-group {
+          display: flex;
+          align-items: center;
+          .el-radio {
+            display: flex;
+            align-items: center;
+
+            .el-radio__input {
+              width: 14px;
+              height: 14px;
+
+              .el-radio__inner {
+                &::after {
+                  width: 6px;
+                  height: 6px;
+                }
+                &:hover {
+                  border-color: #0081ff;
+                }
+              }
+            }
+            .el-radio__input.is-checked .el-radio__inner {
+              background: #0081ff;
+              border-color: #0081ff;
+            }
+            .el-radio__label {
+              padding-left: 8px;
+              color: #232323;
+              padding-right: 0px;
+            }
+          }
+        }
+      }
+    }
   }
 
   ::v-deep .set-field-option-styles-item {
@@ -224,6 +278,33 @@ export default {
       .el-radio-group {
         display: flex;
         align-items: center;
+        .el-radio {
+          display: flex;
+          align-items: center;
+
+          .el-radio__input {
+            width: 14px;
+            height: 14px;
+
+            .el-radio__inner {
+              &::after {
+                width: 6px;
+                height: 6px;
+              }
+              &:hover {
+                border-color: #0081ff;
+              }
+            }
+          }
+          .el-radio__input.is-checked .el-radio__inner {
+            background: #0081ff;
+            border-color: #0081ff;
+          }
+          .el-radio__label {
+            padding-left: 8px;
+            color: #232323;
+          }
+        }
 
         .el-radio-button__orig-radio:checked + .el-radio-button__inner {
           background-color: #0081ff;
@@ -234,11 +315,6 @@ export default {
           }
         }
 
-        .el-radio__input.is-checked .el-radio__inner {
-          background: #0081ff;
-          border-color: #0081ff;
-        }
-
         .el-radio-button__inner {
           width: 70px;
           height: 38px;

dsk-operate-ui/src/views/consultingOrgManagement/components/CustomForm/components/SubfieldItem.vue

 <template>
-  <div class="subfield-item-container" :class="{'is-active-subfield-item' : activeUid == comChildModuleInfo.uid}" :style="styles"
-    @click="activeSubfieldItem">
+  <div class="subfield-item-container" :class="classCreate(comChildModuleInfo.comType)" :style="styles" @click="activeSubfieldItem">
     <img src="@/assets/images/consultingAgencyManagement/customForm/icon_drag@2x.png" alt="" class="subfield-module-item-dragg-target-icon">
-    <el-form-item class="subfield-module-form-item" :class="{'is-required' : comChildModuleInfo.formAttribute.required}"
+    <el-form-item class="subfield-module-form-item" :class="{'is-required': comChildModuleInfo.formAttribute.required}"
       :label="comChildModuleInfo.formAttribute.label">
-      <!-- 输入框类型 -->
+      <!-- 单行文本类型 -->
       <el-input v-model="comChildModuleInfo.componentAttribute.value" :placeholder="comChildModuleInfo.componentAttribute.placeholder" clearable
-        v-if="comChildModuleInfo.comType == 'el-input'"></el-input>
+        v-if="comChildModuleInfo.comType == 'text'"></el-input>
+      <!-- 多行文本类型 -->
+      <el-input type="textarea" v-model="comChildModuleInfo.componentAttribute.value" :placeholder="comChildModuleInfo.componentAttribute.placeholder"
+        :show-word-limit="false" clearable v-if="comChildModuleInfo.comType == 'textarea'"></el-input>
+      <!-- 下拉框类型 -->
+      <el-select v-model="comChildModuleInfo.componentAttribute.value" :multiple="comChildModuleInfo.formAttribute.isMultiple"
+        :collapse-tags="comChildModuleInfo.formAttribute.isMultiple" :placeholder="comChildModuleInfo.componentAttribute.placeholder"
+        v-if="comChildModuleInfo.comType == 'select'">
+        <el-option v-for="(item,index) in comChildModuleInfo.formAttribute.selectOptions" :key="item.value" :label="item.value" :value="index">
+        </el-option>
+      </el-select>
     </el-form-item>
     <img src="@/assets/images/consultingAgencyManagement/customForm/icon_delete@2x.png" alt="" class="remove-subfield-item-icon"
       @click.stop="removeModuleItem">
   </div>
 </template>
 <script>
+import { cloneDeep } from "lodash-es";
 export default {
   name: "subfieldItem",
   props: {
@@ -23,7 +33,7 @@ export default {
   watch: {
     childModuleInfo: {
       handler(newValue) {
-        this.comChildModuleInfo = JSON.parse(JSON.stringify(newValue));
+        this.comChildModuleInfo = cloneDeep(newValue);
       },
       deep: true
     },
@@ -36,7 +46,7 @@ export default {
   },
   data() {
     return {
-      comChildModuleInfo: JSON.parse(JSON.stringify(this.childModuleInfo)),
+      comChildModuleInfo: cloneDeep(this.childModuleInfo),
     };
   },
   //可访问data属性
@@ -56,6 +66,13 @@ export default {
   },
   //方法集
   methods: {
+    classCreate(comType) {
+      const classParams = {
+        'is-active-subfield-item': this.activeUid == this.comChildModuleInfo.uid,
+        [`custom-subfielditem-${comType}`]: true
+      };
+      return classParams;
+    },
     setFieldOption(value) {
       this.comChildModuleInfo = value;
     },
@@ -73,7 +90,7 @@ export default {
 .subfield-item-container {
   width: 100%;
   min-height: 56px;
-  padding: 0px 16px 0px 32px;
+  padding: 12px 16px 12px 32px;
   box-sizing: border-box;
   display: flex;
   align-items: center;
@@ -112,5 +129,40 @@ export default {
     margin-left: 12px;
     cursor: pointer;
   }
+
+  /* 多行文本样式 */
+  &.custom-subfielditem-textarea {
+    .subfield-module-item-dragg-target-icon {
+      align-self: flex-start;
+      margin-top: 4px;
+    }
+    .remove-subfield-item-icon {
+      align-self: flex-start;
+      margin-top: 4px;
+    }
+    ::v-deep .subfield-module-form-item {
+      .el-form-item__label {
+        line-height: 22px;
+      }
+      .el-textarea {
+        .el-textarea__inner {
+          resize: unset;
+          min-height: 76px !important;
+        }
+      }
+    }
+  }
+
+  /* 下拉选择框 */
+  &.custom-subfielditem-select {
+    ::v-deep .el-form-item {
+      .el-select {
+        width: 100%;
+        .el-input__inner {
+          border-radius: 2px;
+        }
+      }
+    }
+  }
 }
 </style>

dsk-operate-ui/src/views/consultingOrgManagement/components/CustomForm/components/SubfieldModule.vue

@@ -24,6 +24,7 @@
   </div>
 </template>
 <script>
+import { cloneDeep } from "lodash-es";
 export default {
   name: "subfieldModule",
   props: {
@@ -33,8 +34,9 @@ export default {
   watch: {
     moduleInfo: {
       handler(newValue, oldValue) {
+        console.log(this.comModuleInfo);
         // 深克隆 避免未保存修改源数据 通过 订阅 editFinish事件处理更改源数据
-        this.comModuleInfo = JSON.parse(JSON.stringify(newValue));
+        this.comModuleInfo = cloneDeep(newValue);
       },
       deep: true
     },
@@ -48,7 +50,7 @@ export default {
     return {
       oldComModuleName: this.moduleInfo.subfieldModuleName,
       // 深克隆 避免未保存修改源数据 通过 订阅 editFinish事件处理更改源数据
-      comModuleInfo: JSON.parse(JSON.stringify(this.moduleInfo)),
+      comModuleInfo: cloneDeep(this.moduleInfo),
       comModuleIndex: this.moduleIndex
     };
   },

dsk-operate-ui/src/views/consultingOrgManagement/components/EnterpriseList/detail/basicEngineeringInformation.vue

@@ -47,12 +47,6 @@
             <td class="table-key">项目承接类型</td>
             <td>{{"-"}}</td>
           </tr>
-          <tr>
-            <td class="table-key">投资来源</td>
-            <td>{{"-"}}</td>
-            <td class="table-key">项目承接类型</td>
-            <td>{{"-"}}</td>
-          </tr>
           <tr>
             <td class="table-key">合同签订日期</td>
             <td>{{"-"}}</td>