merge

dsk-operate-ui/src/api/consultingOrgManagement/index.js

@@ -90,17 +90,27 @@ export const addCustomFormDataApi = (data) => request({
 });
 
 /**
- * 更新自定义表单
+ * 获取自定义表单数据
+ * @param {*} projectKey 
+ * @returns 
+ */
+export const getCustomFormDataByProjectKeyApi = (projectKey) => request({
+  url: `/advisory/body/getCustomFormDataByProjectKey/${projectKey}`,
+  method: "get",
+  params: {}
+});
+
+/**
+ * 新增 更新 自定义表单数据
  * @param {*} data 
  * @returns 
  */
-export const updateCustomFormDataApi = (data) => request({
-  url: "/advisory/body/updateAdvisoryBodyCustomForm",
+export const updateCustomFormData = (data) => request({
+  url: "/advisory/body/editCustomFormData",
   method: "post",
   data
 });
 
-
 /**
  *  oss文件上传地址
  * @param {*} data 

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

@@ -96,9 +96,13 @@ export const defaultComOptions = [
     formAttribute: {
       // 验证规则
       rules: {
-        required: true,
-        message: "请输入选项值",
-        trigger: ["change", "blur"]
+        validator: (rules, value, callback) => {
+          const type = Object.prototype.toString.call(value);
+          if (type == "[object String]" || type == "[object Array]") {
+            callback();
+          }
+          callback(new Error("类型错误"));
+        }
       },
       // 是否必填
       required: false,

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

@@ -954,3 +954,13 @@ export const deserializeFn = (fnStr) => {
     return null;
   }
 };
+
+/**
+ * json字符串转换为json 
+ * @param {*} jsonStr 
+ * @returns 
+ */
+export const jsonStrToObject = (jsonStr) => {
+  if (typeof jsonStr !== "string") return null;
+  return eval(`(${jsonStr})`);
+};

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

@@ -83,7 +83,7 @@
 import { defaultComOptions, subfieldModuleTemplate } from "@/utils/generator/custom-design-options";
 import SubfieldItem from "@/views/consultingOrgManagement/components/CustomForm/components/SubfieldItem";
 import SetFieldOption from "@/views/consultingOrgManagement/components/CustomForm/components/SetFieldOption";
-import { elementMessageSingleton } from "@/utils";
+import { elementMessageSingleton, jsonStrToObject } from "@/utils";
 import vuedraggable from "vuedraggable";
 import { v4 } from 'uuid';
 import { getCustomFormDetailApi, addCustomFormDataApi } from "@/api/consultingOrgManagement";
@@ -174,7 +174,6 @@ export default {
                 subfieldModuleName: { type: "string", required: true, message: "分栏名称不能为空" },
                 children: {
                   type: "array",
-                  required: true,
                   defaultField: {
                     type: "object",
                     fields: {
@@ -204,6 +203,10 @@ export default {
               const child = children[j];
               if (map.has(child.uid)) return this.$message.error(`第${index + 1}个分栏下的，第${j + 1}个表单元素字段名称重复`);
               map.set(child.uid, child);
+              // 不允许默认值
+              if (!child.formAttribute.allowDefaultValue) {
+                child.componentAttribute.value instanceof Array ? child.componentAttribute.value = [] : child.componentAttribute.value = "";
+              }
             }
           }
         }
@@ -226,6 +229,9 @@ export default {
         };
         if (this.formTemplate?.templateId) params["templateId"] = this.formTemplate.templateId;
         const result = await addCustomFormDataApi(params);
+        if (result.code == 200) {
+          this.$message.success(`${this.formTemplate?.templateId ? "更新" : "创建"}模板成功`);
+        }
       } catch (error) {
         console.log(error);
       }
@@ -268,7 +274,7 @@ export default {
     },
     parseTemplate(templateJson) {
       try {
-        const data = eval(`(${templateJson})`);
+        const data = jsonStrToObject(templateJson);
         if (data) {
           this.$set(this.subfieldModuleForm, "subfieldModuleList", data.subfieldModuleList);
         }
@@ -283,6 +289,7 @@ export default {
           // 有模板数据 进行回显
           this.formTemplate = result;
           this.parseTemplate(result.jsonData);
+          this.olduSbfieldModuleList = cloneDeep(this.subfieldModuleForm.subfieldModuleList);
           return;
         }
         // 模块初始化
@@ -373,9 +380,10 @@ export default {
     currentActiveByItemId(current) {
       const _temp = cloneDeep(current);
       _temp.checkedAllow = false;
-      this.activeUid = current.uid;
+      // 顺序不能变
       this.activeItemData = _temp;
       this.activeItemDataOrigin = _temp;
+      this.activeUid = current.uid;
       this.activeModuleId = this.subfieldModuleForm.subfieldModuleList.find(item => item?.children?.findIndex(child => child.uid == current.uid) > -1).uid;
       console.log(this.activeModuleId, "模块uid");
       console.log(this.activeUid, "表单元素uid");
@@ -426,10 +434,10 @@ export default {
       if (!flag) return;
       const _temp = cloneDeep(itemModule);
       _temp.checkedAllow = false;
-      this.activeUid = _temp.uid;
-      this.activeModuleId = parentUid;
       this.activeItemData = _temp;
       this.activeItemDataOrigin = _temp;
+      this.activeUid = _temp.uid;
+      this.activeModuleId = parentUid;
     },
     // 删除模块表单输入框
     removeModuleItem(itemModule, parentUid) {

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

@@ -45,7 +45,7 @@
       <template v-if="comActiveFieldData.comType == 'select'">
         <el-form-item label="类型" class="set-field-option-item set-field-option-radio" prop="formAttribute.isMultiple"
           v-if="comActiveFieldData.formAttribute">
-          <el-radio-group v-model="comActiveFieldData.formAttribute.isMultiple">
+          <el-radio-group v-model="comActiveFieldData.formAttribute.isMultiple" @input="modeChange">
             <el-radio :label="false">单选</el-radio>
             <el-radio :label="true">多选</el-radio>
           </el-radio-group>
@@ -63,7 +63,7 @@
               <transition-group name="fade" tag="div" class="select-option-list">
                 <div class="select-option-list-item" v-for="(item,index) of comActiveFieldData.formAttribute.selectOptions" :key="item.id">
                   <img src="@/assets/images/consultingAgencyManagement/customForm/icon_drag@2x.png" alt="" class="select-option-list-item-drag-icon">
-                  <el-form-item label="" :prop="`formAttribute.selectOptions.${index}.value`" :rules="comActiveFieldData.formAttribute.rules"
+                  <el-form-item label="" :prop="`formAttribute.selectOptions.${index}.value`" :rules="setFieldOptionRules.selectOptionsRules"
                     :show-message="false">
                     <el-input v-model="comActiveFieldData.formAttribute.selectOptions[index].value" placeholder="请输入" clearable></el-input>
                   </el-form-item>
@@ -180,7 +180,12 @@ export default {
       comActiveFieldData: cloneDeep(this.activeFieldData),
       setFieldOptionRules: {
         fieldName: [{ required: true, trigger: ["blur", "change"], validator: fieldNameValidor }],
-        limit: [{ required: true, type: "number", trigger: ["blur", "change"], validator: limitValidor }]
+        limit: [{ required: true, type: "number", trigger: ["blur", "change"], validator: limitValidor }],
+        selectOptionsRules: {
+          required: true,
+          message: "请输入选项值",
+          trigger: ["change", "blur"]
+        },
       },
       placeholderContain: ["text", "textarea", "select", "date", "phone", "email"],
       limitContain: ["photo", "file"]
@@ -237,6 +242,13 @@ export default {
       }
       this.$refs["customDesignFormRef"].clearValidate("formAttribute.limit");
       this.$set(this.comActiveFieldData.formAttribute, "limit", -1);
+    },
+    modeChange(value) {
+      if (value) {
+        this.$set(this.comActiveFieldData.componentAttribute, "value", []);
+        return;
+      }
+      this.$set(this.comActiveFieldData.componentAttribute, "value", "");
     }
   },
 }
@@ -494,6 +506,19 @@ export default {
           .el-form-item {
             margin-bottom: 0px;
             margin-left: 8px;
+
+            &.is-error {
+              .el-form-item__content {
+                .el-input {
+                  .el-input__inner {
+                    &:focus {
+                      border-color: #ff4949;
+                    }
+                  }
+                }
+              }
+            }
+
             .el-form-item__content {
               line-height: 32px;
 

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

@@ -69,7 +69,7 @@ export default {
     },
     comChildModuleInfo: {
       handler(newValue) {
-        console.log(this.comActiveUid !== this.comChildModuleInfo?.uid, "是否不是更改的当前元素");
+        // console.log(this.comActiveUid !== this.comChildModuleInfo?.uid, "是否不是更改的当前元素");
         if (this.comActiveUid !== this.comChildModuleInfo?.uid) return;
         this.checkValidator(newValue);
         this.$mitt.emit("subfieldItemChange", newValue);
@@ -79,9 +79,9 @@ export default {
     activeUid: {
       handler(newValue, oldValue) {
         // 当前命中高亮的元素id  不跟当前元素uid相同 移除事件订阅 否者 添加订阅
-        this.addSubscription(newValue);
         this.comActiveUid = newValue;
         this.comOldActiveUid = oldValue;
+        this.addSubscription(newValue);
       },
       // 保证首次触发 判断是否订阅
       immediate: true
@@ -111,7 +111,7 @@ export default {
   },
   //可访问data属性
   created() {
-
+    this.$mitt.on("fieldOptionChange", this.setFieldOption);
   },
   beforeDestroy() {
     this.$mitt.off("fieldOptionChange");
@@ -144,13 +144,18 @@ export default {
           this.$set(this.comChildModuleInfo.formAttribute, "isError", false);
         }
       } catch (error) {
+        const { errors, fields } = error;
+        console.log(errors, fields);
         this.$set(this.comChildModuleInfo.formAttribute, "isError", true);
       }
     },
     // 根据命中的id 来添加发布订阅
     addSubscription(newValue) {
-      if (newValue === this.comChildModuleInfo.uid) return this.$mitt.on("fieldOptionChange", this.setFieldOption);
-      this.$mitt.off("fieldOptionChange");
+      // if (newValue === this.comChildModuleInfo.uid) {
+      //   this.$mitt.on("fieldOptionChange", this.setFieldOption);
+      //   return;
+      // };
+      // this.$mitt.off("fieldOptionChange");
     },
     classCreate(comType) {
       const classParams = {
@@ -160,10 +165,10 @@ export default {
       return classParams;
     },
     setFieldOption(value) {
+      console.log("触发：fieldOptionChange");
       // value.uid 等同于 comActiveUid （原因 ： 能修改的元素一定是当前comActiveUid命中的元素，取value.uid 为了修改数据的严谨）
       // 要修改的uid元素不是当前元素的id 不进行修改
       // console.log(`${this.comChildModuleInfo?.uid} 当前组件元素uid`, `${value.uid} 当前需要触发修改数据的uid`);
-
       if (value.uid !== this.comChildModuleInfo?.uid) return;
       this.comChildModuleInfo = value;
     },