fix bug

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

@@ -37,7 +37,12 @@
       <!-- 详情模式下 -->
       <template v-if="!isModify && detailTypes.includes(comCustomItem.comType)">
         <div class="dsk-cutom-form-render-detail-item">
-          {{detailRender(comCustomItem)}}
+          <div class="render-detail-item-inner">
+            <dsk-text-over-flow-tip>
+              <span>{{detailRender(comCustomItem)}}</span>
+              <template slot="overflow">{{detailRender(comCustomItem)}}</template>
+            </dsk-text-over-flow-tip>
+          </div>
         </div>
       </template>
     </el-form-item>
@@ -48,12 +53,14 @@
 import DskEmailInput from "@/components/DskEmailInput";
 import DskPhotoInput from "@/components/DskPhotoInput";
 import DskFileInput from "@/components/DskFileInput";
+import DskTextOverFlowTip from "@/components/DskTextOverFlowTip";
 export default {
   name: "dskCustomItemRender",
   components: {
     DskEmailInput,
     DskPhotoInput,
-    DskFileInput
+    DskFileInput,
+    DskTextOverFlowTip
   },
   props: {
     customItem: Object,
@@ -168,9 +175,6 @@ export default {
     }
   }
 
-  ::v-deep &.custom-render-item-textarea {
-  }
-
   ::v-deep .dsk-custom-form-render-item {
     .dsk-cutom-form-render-detail-item {
       width: 100%;
@@ -180,6 +184,20 @@ export default {
       line-height: 40px;
       padding: 9px 12px;
       box-sizing: border-box;
+
+      .render-detail-item-inner {
+        width: 100%;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+      }
+    }
+  }
+
+  ::v-deep &.custom-render-item-textarea {
+    .dsk-custom-form-render-item {
+      .dsk-cutom-form-render-detail-item {
+      }
     }
   }
 }

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

@@ -6,8 +6,10 @@
         <slot :optionData="item">
           <div class="email-type-option">
             <div class="email-type-inner">
-              <div class="email-icon-box"></div>
-              <div class="email-content-box">{{item.value}}</div>
+              <!-- <div class="email-icon-box"></div> -->
+              <div class="email-content-box">
+                <div class="email-content-box-inner">{{item.value}}</div>
+              </div>
             </div>
             <div class="email-vfx-box"></div>
           </div>
@@ -159,6 +161,7 @@ export default {
 </style>
 <style lang="scss">
 .dsk-email-options-popper {
+  min-width: 240px;
   .el-autocomplete-suggestion__wrap {
     .el-autocomplete-suggestion__list {
       & > [id*="el-autocomplete"] {
@@ -208,13 +211,21 @@ export default {
         }
 
         .email-content-box {
-          width: calc(100% - 40px);
+          /* width: calc(100% - 40px); */
+          width: 100%;
           height: 100%;
           display: flex;
           align-items: center;
           box-sizing: border-box;
           margin-left: 16px;
           color: rgba(35, 35, 35, 0.8);
+
+          .email-content-box-inner {
+            width: 100%;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+          }
         }
       }
     }

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

+<template>
+  <div class="dsk-text-over-flow-tip">
+    <el-tooltip class="item" placement="top" effect="dark" ref="elToolTip" :disabled="tipDisable">
+      <div class="text-over-flow-tip-inner" :class="[$attrs['custom-class'] ? $attrs['custom-class'] : '' ]" @mouseover.stop.self="textHover">
+        <slot></slot>
+      </div>
+      <template slot="content">
+        <slot name="overflow"></slot>
+      </template>
+    </el-tooltip>
+  </div>
+</template>
+<script>
+// 只能传入一个根元素 不能多级
+export default {
+  name: "dskTextOverFlowTip",
+  data() {
+    return {
+      tipDisable: true
+    };
+  },
+  //可访问data属性
+  created() {
+
+  },
+  //计算集
+  computed: {
+
+  },
+  //方法集
+  methods: {
+    textHover(e) {
+      /** 
+       * @type {{
+       * target : HTMLDivElement
+       * }}
+      */
+      const { target } = e;
+      const clientWidth = target.clientWidth;
+      const scrollWidth = target.scrollWidth;
+      if (scrollWidth > clientWidth) {
+        this.tipDisable = false;
+      } else {
+        this.tipDisable = true;
+      }
+    },
+  },
+}
+</script>
+<style lang="scss" scoped>
+.dsk-text-over-flow-tip {
+  width: 100%;
+
+  .text-over-flow-tip-inner {
+    width: 100%;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+  }
+}
+</style>

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

@@ -111,7 +111,7 @@ export const defaultComOptions = [
       // 展示label
       label: "下拉选项",
       // 组件宽度
-      width: 100,
+      width: 50,
       selectOptions: [],
       // 是否多选
       isMultiple: false,
@@ -145,7 +145,7 @@ export const defaultComOptions = [
       // 展示label
       label: "日期/时间",
       // 组件宽度
-      width: 100,
+      width: 50,
       isError: false,
       allowDefaultValue: false
     },
@@ -198,7 +198,7 @@ export const defaultComOptions = [
       // 展示label
       label: "电话",
       // 组件宽度
-      width: 100,
+      width: 50,
       isError: false,
       allowDefaultValue: false
     },
@@ -252,7 +252,7 @@ export const defaultComOptions = [
       // 展示label
       label: "电子邮箱",
       // 组件宽度
-      width: 100,
+      width: 50,
       isError: false,
       allowDefaultValue: false
     },

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

@@ -51,8 +51,8 @@
       <div class="custom-form-design-field-options">
         <div class="design-header field-options-header">字段设置</div>
         <div class="design-main field-options-main">
-          <set-field-option v-if="showSetOption" :activeFieldData="activeItemData" :activeUid="activeUid" :parentUid="activeModuleId"
-            ref="setFieldOptionRef" @cancelSetOptions="cancelSetOptions" @setOptionsFinish="setOptionsFinish"
+          <set-field-option v-if="showSetOption" :activeFieldData="activeItemData" :activeFieldOrigin="activeItemDataOrigin" :activeUid="activeUid"
+            :parentUid="activeModuleId" ref="setFieldOptionRef" @cancelSetOptions="cancelSetOptions" @setOptionsFinish="setOptionsFinish"
             @backfileData="backfileData"></set-field-option>
         </div>
       </div>
@@ -69,7 +69,7 @@
       :custom-class="'subfield-module-dialog-inner'" @close="removeDialogClose">
       <div class="subfield-module-dialog-content">
         <img src="@/assets/images/consultingAgencyManagement/customForm/icon_tips@2x.png" alt="">
-        <span>{{`确认删除“${removeSubfieldModule.subfieldModuleName ? removeSubfieldModule.subfieldModuleName : removeSubfieldModule.defaultSubfieldModuleName ? removeSubfieldModule.defaultSubfieldModuleName : ""}”吗？`}}</span>
+        <span>{{`确认删除分栏“${removeSubfieldModule.subfieldModuleName ? removeSubfieldModule.subfieldModuleName : removeSubfieldModule.defaultSubfieldModuleName ? removeSubfieldModule.defaultSubfieldModuleName : ""}”吗？`}}</span>
       </div>
       <div class="subfield-module-dialog-footer">
         <el-button size="default" @click="removeSubFiledModuleDialog = false">取消</el-button>
@@ -232,6 +232,8 @@ export default {
         const result = await addCustomFormDataApi(params);
         if (result.code == 200) {
           this.$message.success(`${this.formTemplate?.templateId ? "更新" : "创建"}模板成功`);
+          // 更新成功重置源数据
+          this.olduSbfieldModuleList = cloneDeep(this.subfieldModuleForm.subfieldModuleList);
         }
       } catch (error) {
         console.log(error);
@@ -353,7 +355,7 @@ export default {
     },
     // 取消当前焦点设置
     cancelSetOptions() {
-      this.activeItemData = cloneDeep(this.activeItemDataOrigin);
+      this.resetCurrent();
     },
     // 设置表单完成
     setOptionsFinish(current, parentUid) {
@@ -495,7 +497,7 @@ export default {
     width: 100%;
     height: calc(100% - 48px);
     display: flex;
-    min-width: 1140px;
+    /* min-width: 1140px; */
 
     .subfield-origin-dragClass,
     .subfield-item-dragClass {

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

@@ -132,6 +132,7 @@ export default {
         componentOptions: {}
       })
     },
+    activeFieldOrigin: Object,
     parentUid: String,
     activeUid: String
   },
@@ -154,6 +155,12 @@ export default {
         this.$mitt.emit("fieldOptionChange", newValue);
       },
       deep: true
+    },
+    activeFieldOrigin: {
+      handler(newValue) {
+        this.comActiveFieldOrigin = cloneDeep(newValue);
+      },
+      deep: true
     }
   },
   data() {
@@ -179,6 +186,8 @@ export default {
     return {
       // 通过保存更新源数据按钮
       comActiveFieldData: cloneDeep(this.activeFieldData),
+      // 源数据
+      comActiveFieldOrigin: cloneDeep(this.activeFieldOrigin),
       setFieldOptionRules: {
         fieldName: [{ required: true, trigger: ["blur", "change"], validator: fieldNameValidor }],
         limit: [{ required: true, type: "number", trigger: ["blur", "change"], validator: limitValidor }],
@@ -216,6 +225,7 @@ export default {
       this.comActiveFieldData = value;
     },
     cancelSet() {
+      this.$mitt.emit("fieldOptionChange", cloneDeep(this.comActiveFieldOrigin));
       this.$emit("cancelSetOptions");
     },
     async formCheck() {

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

@@ -8,7 +8,12 @@
           <el-input v-model="comModuleInfo.subfieldModuleName" :placeholder="comModuleInfo.subfieldModulePlaceholder" clearable
             @keyup.enter.native.stop="editOk"></el-input>
         </el-form-item>
-        <span v-else>{{comModuleInfo.defaultSubfieldModuleName}}</span>
+        <div v-else class="no-edit-module-name">
+          <dsk-text-over-flow-tip>
+            <span>{{comModuleInfo.defaultSubfieldModuleName}}</span>
+            <template slot="overflow">{{comModuleInfo.defaultSubfieldModuleName}}</template>
+          </dsk-text-over-flow-tip>
+        </div>
       </div>
       <div class="subfield-module-title-tool" v-if="comModuleInfo.edit">
         <img src="@/assets/images/consultingAgencyManagement/customForm/icon_verify@2x.png" alt="" class="title-tool-edit-ok" @click.stop="editOk">
@@ -25,8 +30,12 @@
 </template>
 <script>
 import { cloneDeep } from "lodash-es";
+import DskTextOverFlowTip from "@/components/DskTextOverFlowTip";
 export default {
   name: "subfieldModule",
+  components: {
+    DskTextOverFlowTip
+  },
   props: {
     moduleInfo: Object,
     moduleIndex: Number
@@ -111,19 +120,26 @@ export default {
     .subfield-module-title {
       display: flex;
       align-items: center;
-      flex: 1;
+      width: calc(100% - 60px);
 
       & > img {
         width: 14px;
         height: 14px;
         cursor: move;
       }
-      & > span {
+      .no-edit-module-name {
         font-size: 14px;
         font-weight: 400;
         margin-left: 12px;
         color: rgba(35, 35, 35, 0.8);
       }
+
+      .no-edit-module-name {
+        width: 100%;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
     }
 
     .subfield-module-title-tool {
@@ -143,5 +159,46 @@ export default {
       }
     }
   }
+
+  ::v-deep .subfield-module-form-item {
+    display: flex;
+    margin-bottom: 0px;
+    margin-left: 12px;
+    width: 100%;
+
+    .el-form-item__content {
+      flex: 1;
+      line-height: 32px;
+      height: 32px;
+      .el-input {
+        line-height: 32px;
+        height: 32px;
+        .el-input__suffix {
+          display: flex;
+          align-items: center;
+        }
+      }
+    }
+
+    .el-input {
+      width: 100%;
+      .el-input__inner {
+        width: 100%;
+        height: 32px;
+        line-height: 32px;
+        padding-left: 12px;
+
+        &::placeholder {
+          color: #c0c4cc !important;
+          font-size: 14px !important;
+        }
+      }
+      .el-input__suffix {
+        .el-input__icon {
+          line-height: 32px;
+        }
+      }
+    }
+  }
 }
 </style>

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

 <template>
   <div class="custom-form-container">
-    <div class="custom-form-inner">
-      <div class="custom-form-header">
-        <div class="custom-form-title">咨询机构结算信息表单配置</div>
-        <!-- 提示 -->
-        <div class="custom-form-tip">
-          <img src="@/assets/images/consultingAgencyManagement/custom-form-tip-icon.png" alt="">
-          <span>自定义表格模板保存方案后将同步更新至项目详情 “咨询机构结算信息” 表格。</span>
+    <div class="custom-form-outer-inner">
+      <div class="custom-form-inner">
+        <div class="custom-form-header">
+          <div class="custom-form-title">咨询机构结算信息表单配置</div>
+          <!-- 提示 -->
+          <div class="custom-form-tip">
+            <img src="@/assets/images/consultingAgencyManagement/custom-form-tip-icon.png" alt="">
+            <span>自定义表格模板保存方案后将同步更新至项目详情 “咨询机构结算信息” 表格。</span>
+          </div>
         </div>
-      </div>
-      <!-- 表单设计组件部分 -->
-      <div class="custom-form-design-container">
-        <div class="custom-form-design-outer">
-          <custom-form-design></custom-form-design>
+        <!-- 表单设计组件部分 -->
+        <div class="custom-form-design-container">
+          <div class="custom-form-design-outer">
+            <custom-form-design></custom-form-design>
+          </div>
         </div>
       </div>
     </div>
@@ -49,13 +51,21 @@ export default {
   width: 100%;
   height: 100%;
   padding: 16px 24px 24px 24px;
+  box-sizing: border-box;
   overflow: hidden;
 
+  .custom-form-outer-inner {
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+  }
+
   .custom-form-inner {
     width: 100%;
     height: 100%;
     background: #fff;
     border-radius: 4px;
+    min-width: 1600px;
 
     .custom-form-header {
       width: 100%;

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

@@ -142,7 +142,12 @@
             <!-- 生成行 -->
             <div class="custom-module-row" v-for="(row,rowIndex) of item.childrentGroup" :key="rowIndex">
               <div class="custom-module-item" v-for="(column,columnIndex) of row" :key="column.uid" :style="itemStyles(column,rowIndex,columnIndex)">
-                <div class="custom-item-key" :class="{'is-required-key' : column.formAttribute.required}">{{column.formAttribute.label}}</div>
+                <div class="custom-item-key">
+                  <dsk-text-over-flow-tip :custom-class="column.formAttribute.required ? 'is-required-key' : ''">
+                    <span>{{column.formAttribute.label}}</span>
+                    <template slot="overflow">{{column.formAttribute.label}}</template>
+                  </dsk-text-over-flow-tip>
+                </div>
                 <!-- 组件容器 -->
                 <div class="custom-item-com-box">
                   <dsk-custom-item-render :custom-item="column" :custom-module-index="index" :custom-row-index="rowIndex"
@@ -161,11 +166,13 @@
 import { searchConsultingApi, getCustomFormDetailApi, getCustomFormDataByProjectKeyApi } from "@/api/consultingOrgManagement";
 import { elementMessageSingleton, jsonStrToObject, groupArray } from "@/utils";
 import { cloneDeep } from "lodash-es";
+import DskTextOverFlowTip from "@/components/DskTextOverFlowTip";
 import DskCustomItemRender from "@/components/DskCustomItemRender";
 export default {
   name: "consultingAgency",
   components: {
-    DskCustomItemRender
+    DskCustomItemRender,
+    DskTextOverFlowTip
   },
   props: {
     projectDetailInfo: Object,
@@ -341,6 +348,8 @@ export default {
           const _childrentGroup = groupArray(iterator?.children, 100, "formAttribute.width");
           // 分组过后的值
           iterator["childrentGroup"] = cloneDeep(_childrentGroup);
+        } else {
+          iterator["childrentGroup"] = [];
         }
       }
       return tableList;
@@ -766,7 +775,7 @@ export default {
               display: flex;
               align-items: center;
 
-              &.is-required-key {
+              .is-required-key {
                 &::before {
                   content: "*";
                   color: #f56c6c;

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

@@ -157,10 +157,12 @@ export default {
   padding: 16px 24px 24px 24px;
   box-sizing: border-box;
   overflow: hidden;
+  /* min-width: 1300px; */
 
   .project-detail-inner {
     width: 100%;
     height: 100%;
+    min-width: 1300px;
 
     .project-header-container {
       width: 100%;