新增邮箱联想组件

dsk-operate-ui/package.json

@@ -29,6 +29,7 @@
     "@form-create/element-ui": "^2.5.33",
     "@riophae/vue-treeselect": "0.4.0",
     "@vue/composition-api": "^1.7.2",
+    "async-validator": "^4.2.5",
     "axios": "0.24.0",
     "clipboard": "2.0.8",
     "core-js": "^3.32.2",

dsk-operate-ui/src/components/DskEmailInput/index.vue

+<template>
+  <div class="dsk-email-input-container">
+
+  </div>
+</template>
+<script>
+export default {
+  name: "dskEmailInput",
+  props: {
+    emailValue: {
+      required: true,
+      type: String,
+      default: ""
+    }
+  },
+  model: {
+    prop: "emailValue",
+    event: "update:emailValue"
+  },
+  data() {
+    return {
+
+    };
+  },
+  //可访问data属性
+  created() {
+    
+  },
+  //计算集
+  computed: {
+
+  },
+  //方法集
+  methods: {
+
+  },
+}
+</script>
+<style lang="scss" scoped>
+.dsk-email-input-container {
+  height: 32px;
+  width: 100%;
+  position: relative;
+}
+</style>

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

@@ -8,7 +8,7 @@ export const subfieldModuleTemplate = {
   defaultSubfieldModuleName: "",
   subfieldModuleName: "",
   subfieldModuleNameRules: {
-    trigger: ["blur", "change"],
+    trigger: ["blur"],
     validator: (rule, value, callback) => {
       if (!value && !value?.toString()?.trim()) {
         return callback(new Error("请输入分栏名称"));
@@ -41,7 +41,8 @@ export const defaultComOptions = [
       // 展示label
       label: "单行文本",
       // 组件宽度
-      width: 100
+      width: 100,
+      isError: false
     },
     // 组件属性
     componentAttribute: {
@@ -70,7 +71,8 @@ export const defaultComOptions = [
       // 展示label
       label: "多行文本",
       // 组件宽度
-      width: 100
+      width: 100,
+      isError: false
     },
     // 组件属性
     componentAttribute: {
@@ -106,7 +108,8 @@ export const defaultComOptions = [
       width: 100,
       selectOptions: [],
       // 是否多选
-      isMultiple: false
+      isMultiple: false,
+      isError: false
     },
     // 组件属性
     componentAttribute: {
@@ -135,7 +138,8 @@ export const defaultComOptions = [
       // 展示label
       label: "日期/时间",
       // 组件宽度
-      width: 100
+      width: 100,
+      isError: false
     },
     // 组件属性
     componentAttribute: {
@@ -157,7 +161,7 @@ export const defaultComOptions = [
     formAttribute: {
       // 验证规则
       rules: {
-        trigger: ["blur", "change"],
+        trigger: ["blur"],
         validator: (rule, value, callback) => {
           const phoneReg = /^1[3-9]\d{9}$/;
           if (value && !phoneReg.test(value)) {
@@ -167,7 +171,7 @@ export const defaultComOptions = [
         }
       },
       requiredRules: {
-        trigger: ["blur", "change"],
+        trigger: ["blur"],
         validator: (rule, value, callback) => {
           const phoneReg = /^1[3-9]\d{9}$/;
           if (!value && !value?.toString()?.trim()) {
@@ -186,7 +190,8 @@ export const defaultComOptions = [
       // 展示label
       label: "电话",
       // 组件宽度
-      width: 100
+      width: 100,
+      isError: false
     },
     // 组件属性
     componentAttribute: {
@@ -208,8 +213,9 @@ export const defaultComOptions = [
     formAttribute: {
       // 验证规则
       rules: {
-        trigger: ["blur", "change"],
+        trigger: ["blur"],
         validator: (rule, value, callback) => {
+          console.log("value", value);
           if (value && !validEmail(value)) {
             return callback(new Error(`请输入正确的电子邮箱`));
           }
@@ -217,7 +223,7 @@ export const defaultComOptions = [
         }
       },
       requiredRules: {
-        trigger: ["blur", "change"],
+        trigger: ["blur"],
         validator: (rule, value, callback) => {
           if (!value && !value?.toString()?.trim()) {
             return callback(new Error(`请输入电子邮箱`));
@@ -235,7 +241,8 @@ export const defaultComOptions = [
       // 展示label
       label: "电子邮箱",
       // 组件宽度
-      width: 100
+      width: 100,
+      isError: false
     },
     // 组件属性
     componentAttribute: {
@@ -266,7 +273,8 @@ export const defaultComOptions = [
       width: 100,
       limit: -1,
       astrict: false,
-      fileList: []
+      fileList: [],
+      isError: false
     },
     // 组件属性
     componentAttribute: {
@@ -297,7 +305,8 @@ export const defaultComOptions = [
       width: 100,
       limit: -1,
       astrict: false,
-      fileList: []
+      fileList: [],
+      isError: false
     },
     // 组件属性
     componentAttribute: {

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

@@ -132,6 +132,9 @@ export default {
   //可访问data属性
   created() {
     this.initModule();
+  },
+  beforeDestroy() {
+
   },
   //计算集
   computed: {

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

@@ -2,7 +2,7 @@
   <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}"
-      :label="comChildModuleInfo.formAttribute.label" :rules="comChildModuleInfo.formAttribute.rules" :prop="propValue">
+      :label="comChildModuleInfo.formAttribute.label" :prop="propValue">
       <!-- 单行文本类型 -->
       <el-input v-model="comChildModuleInfo.componentAttribute.value" :placeholder="comChildModuleInfo.componentAttribute.placeholder" clearable
         v-if="comChildModuleInfo.comType == 'text'" :disabled="isDisabled"></el-input>
@@ -24,8 +24,8 @@
       <el-input v-model="comChildModuleInfo.componentAttribute.value" :placeholder="comChildModuleInfo.componentAttribute.placeholder" clearable
         v-if="comChildModuleInfo.comType == 'phone'" :disabled="isDisabled"></el-input>
       <!-- 电子邮箱类型 -->
-      <el-input v-model="comChildModuleInfo.componentAttribute.value" :placeholder="comChildModuleInfo.componentAttribute.placeholder" clearable
-        v-if="comChildModuleInfo.comType == 'email'" :disabled="isDisabled"></el-input>
+      <dsk-email-input v-model="comChildModuleInfo.componentAttribute.value" :placeholder="comChildModuleInfo.componentAttribute.placeholder"
+        clearable :disabled="isDisabled" v-if="comChildModuleInfo.comType == 'email'"></dsk-email-input>
       <!-- 图片类型 -->
 
     </el-form-item>
@@ -36,8 +36,13 @@
 </template>
 <script>
 import { cloneDeep } from "lodash-es";
+import Schema from "async-validator";
+import DskEmailInput from "@/components/DskEmailInput";
 export default {
   name: "subfieldItem",
+  components: {
+    DskEmailInput
+  },
   props: {
     childModuleInfo: Object,
     parentUid: String,
@@ -205,6 +210,10 @@ export default {
       .el-form-item__label {
         line-height: 22px;
       }
+      .el-form-item__content {
+        line-height: 32px;
+        height: unset;
+      }
       .el-textarea {
         .el-textarea__inner {
           resize: unset;

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

@@ -150,6 +150,15 @@ export default {
     flex: 1;
     .el-form-item__content {
       line-height: 32px;
+      height: 32px;
+      .el-input {
+        line-height: 32px;
+        height: 32px;
+        .el-input__suffix {
+          display: flex;
+          align-items: center;
+        }
+      }
     }
 
     .el-input {