自定义表单60%

dsk-operate-ui/package.json

@@ -26,6 +26,7 @@
   },
   "dependencies": {
     "@cell-x/el-table-sticky": "^1.0.2",
+    "@form-create/element-ui": "^2.5.33",
     "@riophae/vue-treeselect": "0.4.0",
     "@vue/composition-api": "^1.7.2",
     "axios": "0.24.0",

dsk-operate-ui/src/assets/styles/index.scss

@@ -97,29 +97,29 @@ div:focus {
   }
 }
 
-aside {
-  background: #eef1f6;
-  padding: 8px 24px;
-  margin-bottom: 20px;
-  border-radius: 2px;
-  display: block;
-  line-height: 32px;
-  font-size: 16px;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
-    Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
-  color: #2c3e50;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-
-  a {
-    color: #337ab7;
-    cursor: pointer;
-
-    &:hover {
-      color: rgb(32, 160, 255);
-    }
-  }
-}
+// aside {
+//   background: #eef1f6;
+//   padding: 8px 24px;
+//   margin-bottom: 20px;
+//   border-radius: 2px;
+//   display: block;
+//   line-height: 32px;
+//   font-size: 16px;
+//   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
+//     Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+//   color: #2c3e50;
+//   -webkit-font-smoothing: antialiased;
+//   -moz-osx-font-smoothing: grayscale;
+
+//   a {
+//     color: #337ab7;
+//     cursor: pointer;
+
+//     &:hover {
+//       color: rgb(32, 160, 255);
+//     }
+//   }
+// }
 
 .components-container {
   margin: 30px 50px;

dsk-operate-ui/src/main.js

 import Vue from 'vue';
-import VCA from '@vue/composition-api' //composition APi
+import VCA from '@vue/composition-api'; //composition APi
 
 import Cookies from 'js-cookie';
 
 import Element from 'element-ui';
+import formCreate from '@form-create/element-ui';
 import './assets/styles/element-variables.scss';
 
 import "@/assets/styles/common.css";
@@ -25,6 +26,11 @@ import { getDicts } from "@/api/system/dict/data";
 import { getConfigKey } from "@/api/system/config";
 import { parseTime, resetForm, addDateRange, selectDictLabel, selectDictLabels, handleTree } from "@/utils/ruoyi";
 
+// 分栏组件
+import SubfieldModule from "@/views/consultingOrgManagement/components/CustomForm/components/SubfieldModule";
+// 分栏子组件
+import SubfieldItem from "@/views/consultingOrgManagement/components/CustomForm/components/SubfieldItem";
+
 // 分页组件
 import Pagination from "@/components/Pagination";
 // 自定义表格工具组件
@@ -63,6 +69,8 @@ Vue.component('Editor', Editor);
 Vue.component('FileUpload', FileUpload);
 Vue.component('ImageUpload', ImageUpload);
 Vue.component('ImagePreview', ImagePreview);
+Vue.component("subfield-module", SubfieldModule);
+Vue.component("subfield-item", SubfieldItem);
 
 Vue.use(VCA);
 Vue.use(horizontalScroll);
@@ -84,6 +92,7 @@ DictData.install();
 Vue.use(Element, {
   size: Cookies.get('size') || 'medium' // set element-ui default size
 });
+Vue.use(formCreate);
 
 Vue.config.productionTip = false;
 

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

+// 默认自定义表单组件
+
+/**
+ * 模块模板
+ */
+export const subfieldModuleTemplate = {
+  defaultSubfieldModuleName: "分栏名称",
+  subfieldModuleName: "",
+  subfieldModuleNameRules: {
+    message: "请输入分栏名称",
+    trigger: ["blur", "change"]
+  },
+  subfieldModulePlaceholder: "请输入分栏标题",
+  edit: false,
+  children: []
+};
+
+export const defaultComOptions = [
+  {
+    comLabel: "单行文本",
+    // 组件类型
+    comType: "el-input",
+    // 组件展示图标
+    comShowIcon: require("@/assets/images/consultingAgencyManagement/customForm/icon_single_line_text@2x.png"),
+
+  }
+];
\ No newline at end of file

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

+<template>
+  <div class="subfield-item-container">
+
+  </div>
+</template>
+<script>
+export default {
+  name: "subfieldItem",
+  data() {
+    return {
+
+    };
+  },
+  //可访问data属性
+  created() {
+
+  },
+  //计算集
+  computed: {
+
+  },
+  //方法集
+  methods: {
+
+  },
+}
+</script>
+<style lang="scss" scoped>
+.subfield-item-container {
+  
+}
+</style>

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

+<template>
+  <div class="subfield-module-item-container">
+    <div class="subfield-module-header">
+      <div class="subfield-module-title">
+        <img src="@/assets/images/consultingAgencyManagement/customForm/icon_drag@2x.png" alt="" class="subfield-module-dragg-target-icon">
+        <el-form-item v-if="comModuleInfo.edit" class="subfield-module-form-item" :rules="comModuleInfo.subfieldModuleNameRules">
+          <el-input v-model="comModuleInfo.subfieldModuleName" :placeholder="comModuleInfo.subfieldModulePlaceholder" clearable></el-input>
+        </el-form-item>
+        <span v-else>{{comModuleInfo.defaultSubfieldModuleName}}</span>
+      </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="editOK">
+        <img src="@/assets/images/consultingAgencyManagement/customForm/icon_cancle@2x.png" alt="" class="title-tool-edit-cancel"
+          @click.stop="editCancel">
+      </div>
+      <div class="subfield-module-title-tool" v-else>
+        <img src="@/assets/images/consultingAgencyManagement/customForm/icon_edit@2x.png" alt="" class="title-tool-edit" @click="editModule">
+        <img src="@/assets/images/consultingAgencyManagement/customForm/icon_delete@2x.png" alt="" class="title-tool-delete" @click="removeModule">
+      </div>
+    </div>
+    <div class="subfield-module-item-list">
+      <slot></slot>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: "subfieldModule",
+  props: {
+    moduleInfo: Object
+  },
+  watch: {
+    moduleInfo: {
+      handler(newValue, oldValue) {
+        this.comModuleInfo = newValue;
+      },
+      deep: true
+    },
+  },
+  data() {
+    return {
+      oldComModuleName: this.moduleInfo.subfieldModuleName,
+      comModuleInfo: this.moduleInfo
+    };
+  },
+  //可访问data属性
+  created() {
+
+  },
+  //计算集
+  computed: {
+
+  },
+  //方法集
+  methods: {
+    removeModule() {
+      this.$emit("removeModule", this.comModuleInfo);
+    },
+    editModule() {
+      this.comModuleInfo.edit = true;
+    },
+    editCancel() {
+      this.comModuleInfo.edit = false;
+      this.comModuleInfo.subfieldModuleName = this.oldComModuleName;
+    },
+    editOK() {
+      this.comModuleInfo.edit = false;
+      this.comModuleInfo.defaultSubfieldModuleName = this.comModuleInfo.subfieldModuleName;
+      this.oldComModuleName = this.comModuleInfo.subfieldModuleName;
+      this.$emit("editOk", this.comModuleInfo);
+    }
+  },
+}
+</script>
+<style lang="scss" scoped>
+.subfield-module-item-container {
+  margin-bottom: 12px;
+  width: 100%;
+  border: 1px solid #dcdfe6;
+  box-sizing: border-box;
+  border-radius: 4px;
+
+  .subfield-module-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: 56px;
+    background: #f0f3fa;
+    padding: 0px 16px;
+    box-sizing: border-box;
+
+    .subfield-module-title {
+      display: flex;
+      align-items: center;
+      flex: 1;
+
+      & > img {
+        width: 14px;
+        height: 14px;
+        cursor: pointer;
+      }
+      & > span {
+        font-size: 14px;
+        font-weight: 400;
+        margin-left: 12px;
+        color: rgba(35, 35, 35, 0.8);
+      }
+    }
+
+    .subfield-module-title-tool {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      margin-left: 12px;
+      & > img {
+        width: 16px;
+        height: 16px;
+        cursor: pointer;
+      }
+
+      .title-tool-delete,
+      .title-tool-edit-cancel {
+        margin-left: 16px;
+      }
+    }
+  }
+
+  ::v-deep .subfield-module-form-item {
+    margin-bottom: 0px;
+    margin-left: 12px;
+    flex: 1;
+    .el-form-item__content {
+      line-height: 32px;
+    }
+
+    .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>
+      </div>
+      <!-- 表单设计组件部分 -->
+      <div class="custom-form-design-container">
+        <div class="custom-form-design-outer">
+          <custom-form-design></custom-form-design>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import CustomFormDesign from "@/views/consultingOrgManagement/components/CustomForm/components/CustomFormDesign";
+export default {
+  name: "customForm",
+  components: {
+    CustomFormDesign
+  },
+  data() {
+    return {
+
+    };
+  },
+  //可访问data属性
+  created() {
+
+  },
+  //计算集
+  computed: {
+
+  },
+  //方法集
+  methods: {
+
+  },
+}
+</script>
+<style lang="scss" scoped>
+.custom-form-container {
+  width: 100%;
+  height: 100%;
+  padding: 16px 24px 24px 24px;
+  overflow: hidden;
+
+  .custom-form-inner {
+    width: 100%;
+    height: 100%;
+    background: #fff;
+    border-radius: 4px;
+
+    .custom-form-header {
+      width: 100%;
+      height: 108px;
+      padding: 16px;
+      box-sizing: border-box;
+      border-bottom: 1px solid #eeeeee;
+      display: flex;
+      flex-direction: column;
+
+      .custom-form-title {
+        color: #232323;
+        font-size: 20px;
+        font-weight: bold;
+        line-height: 24px;
+      }
+
+      .custom-form-tip {
+        background: #ffedc7;
+        display: flex;
+        align-items: center;
+        height: 40px;
+        padding: 0px 16px;
+        border-radius: 2px;
+        margin-top: 12px;
+        border: 1px solid #ffedc7;
+        box-sizing: border-box;
+
+        & > img {
+          width: 16px;
+          height: 16px;
+        }
+
+        & > span {
+          color: rgba(35, 35, 35, 0.8);
+          font-size: 14px;
+          font-weight: 400;
+          line-height: 22px;
+          margin-left: 8px;
+        }
+      }
+    }
+
+    .custom-form-design-container {
+      height: calc(100% - 108px);
+      width: 100%;
+      box-sizing: border-box;
+
+      .custom-form-design-outer {
+        width: 100%;
+        height: calc(100% - 32px);
+        padding: 16px;
+        box-sizing: border-box;
+      }
+    }
+  }
+}
+</style>

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

@@ -143,6 +143,7 @@ export default {
     },
     // 跳转到企业详情
     viewEnterprise(row) {
+      if (!row.advisoryBodyCid) return this.$message.warning("缺少咨询机构id");
       this.$tab.openPage(row.advisoryBodyName ? row.advisoryBodyName : "咨询机构详情", `/enterprise/${encodeStr(row.advisoryBodyCid)}`);
     },
     // 创建最终查询条件

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

@@ -271,7 +271,6 @@ export default {
         } else {
           this.$message.error(result.msg);
         }
-        console.log(result);
       } catch (error) {
 
       } finally {
@@ -320,10 +319,12 @@ export default {
     },
     // 查看项目详情
     viewProjectDetail(row) {
+      if (!row?.advisoryBody?.advisoryBodyCid) return this.$message.warning("缺少咨询机构id");
       this.$tab.openPage(row.projectName, `/consultingOrgManagement/projectDetail/${row.advisoryBody?.advisoryBodyCid}?projectKey=${row.projectKey}`);
     },
     // 跳转到企业详情
     viewEnterprise(row) {
+      if (!row?.advisoryBody?.advisoryBodyCid) return this.$message.warning("缺少咨询机构id");
       this.$tab.openPage(row.advisoryBody.advisoryBodyName ? row.advisoryBody.advisoryBodyName : "咨询机构详情", `/enterprise/${encodeStr(row.advisoryBody.advisoryBodyCid)}`);
     }
   },

dsk-operate-ui/src/views/detail/party-a/index.vue

@@ -196,6 +196,8 @@ export default {
       isSkeleton: true,
       companyInfo: {},
       customerInfo: {},
+      // 企业名称
+      companyName: "",
       companyId: '',  //企业Id（测试默认3068）
       customerId: '',  //企业Id（测试默认'a00d582a6041f32c16aac804e4924736'）
       isCompany: false,  //判断是否有建设库数据
@@ -274,7 +276,9 @@ export default {
       try {
         if (this.$route.params.id) { // 获取companyId
           let companyId = this.$route.params.id;
-          await this.getCompanyId(companyId);
+          // 有企业名的情况下带上企业名称
+          let companyName = this.$route.query.companyName;
+          await this.getCompanyId(companyId, companyName);
         }
       } catch (error) {
         console.log(error);
@@ -284,20 +288,25 @@ export default {
       this.currentPath = e;
     },
     // 解密
-    async getCompanyId(companyId) {
+    async getCompanyId(companyId, companyName = "") {
+      if (companyName) this.companyName = companyName;
       let { data } = await idRemark({ mark: companyId });
       if (data) {
         this.companyId = data;
         await this.$nextTick();
         this.listenSider();
-        await this.getStatistic();
+        await this.getStatistic(this.companyName);
         await this.handleQuery();
         await this.association(this.$route.query.customerId);
         this.$refs.sidebar.getFinancial(data);
       }
     },
-    async getStatistic() {
-      let res = await statistic({ companyId: this.companyId });
+    async getStatistic(companyName) {
+      let params = {
+        companyId: this.companyId
+      };
+      companyName ? params["companyName"] = companyName : null;
+      let res = await statistic(params);
       if (res.code == 200) {
         this.statisticObj = { ...this.statisticObj, ...res.data };
       }

dsk-operate-ui/src/views/detail/party-a/overview/component/infoheader.vue

@@ -61,10 +61,10 @@
         </div>
       </div>
       <div class="company-menu">
-        <el-button v-if="companyInfo.claimStatus==0" @click="cancelClaimClick()" class="hasClaim"><i class="el-ico-claim" alt="已认领" title="已认领"></i>
+        <!-- <el-button v-if="companyInfo.claimStatus==0" @click="cancelClaimClick()" class="hasClaim"><i class="el-ico-claim" alt="已认领" title="已认领"></i>
           已认领</el-button>
         <el-button @click="handleClaim" v-else class="claim" v-loading="claimLoading"><i class="el-ico-claim" alt="认领客户" title="认领客户"></i>
-          认领客户</el-button>
+          认领客户</el-button> -->
       </div>
 
       <div class="company-info">