营销-目标管理:目标模板；营销目标；

src/api/business/spd/starget/target.js

@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+
+// 查询营销目标列表
+export function listTarget(query) {
+  return request({
+    url: '/mk/target/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询营销目标详细
+export function getTarget(id) {
+  return request({
+    url: '/mk/target/' + id,
+    method: 'get'
+  })
+}
+
+// 查询营销目标明细
+export function getTargetItem(id) {
+  return request({
+    url: '/mk/target/item/' + id,
+    method: 'get'
+  })
+}
+
+// 新增营销目标
+export function addTarget(data) {
+  return request({
+    url: '/mk/target',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改营销目标
+export function updateTarget(data) {
+  return request({
+    url: '/mk/target',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除营销目标
+export function delTarget(id) {
+  return request({
+    url: '/mk/target/' + id,
+    method: 'delete'
+  })
+}

src/api/business/spd/starget/targetTemplate.js

@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+
+// 查询目标模板列表
+export function listTargetTemplate(query) {
+  return request({
+    url: '/mk/target/targetTemplate/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询目标模板详细
+export function getTargetTemplate(id) {
+  return request({
+    url: '/mk/target/targetTemplate/' + id,
+    method: 'get'
+  })
+}
+
+// 新增目标模板
+export function addTargetTemplate(data) {
+  return request({
+    url: '/mk/target/targetTemplate',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改目标模板
+export function updateTargetTemplate(data) {
+  return request({
+    url: '/mk/target/targetTemplate',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除目标模板
+export function delTargetTemplate(id) {
+  return request({
+    url: '/mk/target/targetTemplate/' + id,
+    method: 'delete'
+  })
+}
+
+// 获取动态表头数据
+export function getHeaderData(id) {
+  return request({
+    url: '/mk/target/targetTemplate/getHeaderData/' + id,
+    method: 'get'
+  })
+}
+
+//校验目标模板是否被引用
+export function checkQuote(id) {
+  return request({
+    url: '/mk/target/targetTemplate/checkQuote/' + id,
+    method: 'get'
+  })
+}

src/components/popover-select/components/CUSTOMER_PARAM_ZT.js

@@ -0,0 +1,15 @@
+// 收货客户
+export default [
+  {
+    key: "code",
+    title: "客户编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "客户名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select/components/LINKMAN_PARAM.js

@@ -0,0 +1,9 @@
+// 收货客户
+export default [
+  {
+    key: "name",
+    title: "名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select/components/MK_SALESAREA_PARAM.js

@@ -0,0 +1,15 @@
+// 销售区域
+export default [
+  {
+    key: "code",
+    title: "区域编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "区域名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select/components/MK_TARGET_CYCLE_PARAM.js

@@ -0,0 +1,9 @@
+// 目标周期
+export default [
+  {
+    key: "name",
+    title: "周期名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select/components/MK_TARGET_INDEX_PARAM.js

@@ -0,0 +1,9 @@
+// 目标指标
+export default [
+  {
+    key: "name",
+    title: "指标名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select/components/MK_TARGET_TEMPLATE_PARAM.js

@@ -0,0 +1,9 @@
+// 目标摸吧
+export default [
+  {
+    key: "name",
+    title: "模板名称",
+    type: "Input",
+    search: true,
+  },
+];

src/views/business/spd/bo/basic/process.vue

@@ -25,7 +25,7 @@
       <!-- 商机审核 -->
       <el-tab-pane label="阶段动作" name="t00101" style="height: 200px; overflow-y: scroll" v-if="tabsName.t00101" >
         <el-descriptions >
-          <el-descriptions-item label="医院应收总额">
+          <el-descriptions-item label="医院营收总额">
             <div v-for="dict in dict.type.mk_bo_total_revenue" v-if="form.totalHosRevenue == dict.value">
               <div>{{dict.label}}</div>
             </div>
@@ -303,7 +303,7 @@
       <!-- 商机审核 -->
       <el-tab-pane label="阶段动作" name="t10101" style="height: 200px; overflow-y: scroll" v-if="tabsName.t10101">
         <el-descriptions >
-          <el-descriptions-item label="医院应收总额">
+          <el-descriptions-item label="医院营收总额">
             <div v-for="dict in dict.type.mk_bo_total_revenue" v-if="form.totalHosRevenue == dict.value">
               <div>{{dict.label}}</div>
             </div>
@@ -518,7 +518,7 @@
       <!-- 商机审核 -->
       <el-tab-pane label="阶段动作" name="t20201" style="height: 200px; overflow-y: scroll" v-if="tabsName.t20201">
         <el-descriptions >
-          <el-descriptions-item label="医院应收总额">
+          <el-descriptions-item label="医院营收总额">
             <div v-for="dict in dict.type.mk_bo_total_revenue" v-if="form.totalHosRevenue == dict.value">
               <div>{{dict.label}}</div>
             </div>
@@ -748,7 +748,7 @@
       <!-- 商机审核 -->
       <el-tab-pane label="阶段动作" name="t30201" style="height: 200px; overflow-y: scroll" v-if="tabsName.t30201">
         <el-descriptions >
-          <el-descriptions-item label="医院应收总额">
+          <el-descriptions-item label="医院营收总额">
             <div v-for="dict in dict.type.mk_bo_total_revenue" v-if="form.totalHosRevenue == dict.value">
               <div>{{dict.label}}</div>
             </div>
@@ -978,7 +978,7 @@
       <!-- 商机审核 -->
       <el-tab-pane label="阶段动作" name="t40201" style="height: 200px; overflow-y: scroll" v-if="tabsName.t40201">
         <el-descriptions >
-          <el-descriptions-item label="医院应收总额">
+          <el-descriptions-item label="医院营收总额">
             <div v-for="dict in dict.type.mk_bo_total_revenue" v-if="form.totalHosRevenue == dict.value">
               <div>{{dict.label}}</div>
             </div>

src/views/business/spd/bo/behavior/behaviorList.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-row :gutter="10" class="mb8" v-if="this.source == 'BoDetails' ? this.bo.winningState == 0 ? true : false : true">
+    <el-row :gutter="10" class="mb8" v-if="this.bo.winningState == 0">
       <el-col :span="1.5">
         <el-button
           type="primary"
@@ -11,31 +11,8 @@
           v-if="this.boAuthority.boAuthority.behaviorAdd"
         >新增</el-button>
       </el-col>
-      <!-- <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-        >修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-        >删除</el-button>
-      </el-col> -->
-      <!-- <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> -->
     </el-row>
-
-    <el-table v-loading="loading" :data="behaviorList" @selection-change="handleSelectionChange">
-      <el-table-column type="index" label="序号" width="55" align="center"/>
+    <el-table v-loading="loading" :data="behaviorList">
       <el-table-column label="负责人" align="center" prop="staffName" />
       <el-table-column label="行动日期" align="center" prop="time" />
       <el-form-item label="行动日期" prop="time">
@@ -59,46 +36,27 @@
       </el-table-column>
       <el-table-column label="协助内容" align="center" prop="assistContent" />
       <el-table-column label="洽谈内容" align="center" prop="content" />
-
-      <el-table-column label="任务编码" align="center" prop="taskCode" v-if="source == 'Behavior'"/>
-      <el-table-column label="行动类型" align="center" prop="type" v-if="source == 'Behavior'">
+      <el-table-column label="行动类型" align="center" prop="type">
         <template slot-scope="scope">
           <dict-tag :options="dict.type.mk_bo_behavior_type" :value="scope.row.type"/>
         </template>
       </el-table-column>
-      <el-table-column label="客户" align="center" prop="customerName" v-if="source == 'Behavior'"/>
-      <el-table-column label="拜访目的" align="center" prop="purpose" v-if="source == 'Behavior'">
+      <el-table-column label="拜访目的" align="center" prop="purpose">
         <template slot-scope="scope">
             <dict-tag :options="dict.type.mk_bo_behavior_goal" :value="scope.row.purpose"/>
         </template>
       </el-table-column>
-      <el-table-column label="销售组织" align="center" prop="salesOrgName" v-if="source == 'Behavior'"/>
-      <el-table-column label="部门" align="center" prop="deptName" v-if="source == 'Behavior'"/>
-
+      <el-table-column label="销售组织" align="center" prop="salesOrgName"/>
+      <el-table-column label="部门" align="center" prop="deptName"/>
       <el-table-column label="操作" fixed="right" align="center" class-name="small-padding fixed-width">
-      <!-- <el-table-column label="操作" fixed="right" align="center" class-name="small-padding fixed-width" v-if="this.source == 'BoDetails' ? this.bo.winningState == 0 ? true : false : true"> -->
         <template slot-scope="scope">
           <el-button
             size="mini"
             type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            :disabled="!boAuthority.boAuthority.behaviorEdit"
-          >修改</el-button>
-          <el-button
-            size="mini"
-            type="text"
             icon="el-icon-view"
             @click="handleBrowse(scope.row)"
             :disabled="!boAuthority.boAuthority.behaviorView"
           >查看</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-delete"
-            @click="handleDelete(scope.row)"
-            :disabled="!boAuthority.boAuthority.behaviorDel"
-          >删除</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -119,11 +77,6 @@
         </el-divider>
         <el-row>
           <el-col :span="8">
-            <el-form-item label="任务" prop="taskId" v-if="!(this.source == 'BoDetails')">
-              <el-input v-model="form.taskCode" placeholder="请输入任务" :disabled="this.source == 'TaskList'"/>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
             <el-form-item label="行动类型" prop="type">
               <el-select v-model="form.type" placeholder="请输入行动类型">
                 <el-option
@@ -149,7 +102,7 @@
         <el-row>
           <el-col :span="8">
             <el-form-item label="客户" prop="customerName">
-              <el-input v-model="form.customerName" placeholder="请输入客户" disabled="this.source == 'BoDetails' || this.source == 'TaskList'"/>
+              <el-input v-model="form.customerName" placeholder="请输入客户" disabled/>
             </el-form-item>
           </el-col>
           <el-col :span="8">
@@ -260,7 +213,7 @@
         <el-dialog :visible.sync="dialogVisible">
           <img width="100%" :src="dialogImageUrl" alt="">
         </el-dialog>
-        
+
         <div class="md-auditInfo">
           <el-divider content-position="left">
             <dev style="width: 50px; height: 40px; font-size: 18px">其它信息</dev>
@@ -319,7 +272,7 @@ import SaleaeaRef from '@/views/business/spd/bo/refer/saleaea/index.vue';
 
 export default {
   name: "BehaviorList",
-  props:["source","bo","boAuthority"],
+  props:["bo","boAuthority"],
   dicts: ['mk_bo_behavior_res','mk_bo_behavior_type','sys_yes_no','mk_bo_behavior_goal'],
   components: {ContactRef,SaleaeaRef},
   data() {
@@ -400,19 +353,10 @@ export default {
   },
   created() {
     console.log('this.boAuthority',this.boAuthority);
-    if(this.source == 'Behavior'){
-      this.queryParams = this.bo;
-    }
-    if(this.source == 'BoDetails'){
-      this.queryParams.bo = this.bo.id;
-      this.queryParams.boStage = this.bo.boStage;
-      let params = {"post":this.boAuthority.post};
-      this.queryParams.params = params;
-    }
-    if(this.source == 'TaskList'){
-      this.queryParams.taskCode = this.bo.code;
-      console.log("this.bo", this.bo);
-    }
+    this.queryParams.bo = this.bo.id;
+    this.queryParams.boStage = this.bo.boStage;
+    let params = {"post":this.boAuthority.post};
+    this.queryParams.params = params;
     this.getList();
   },
   methods: {
@@ -506,23 +450,12 @@ export default {
       this.reset();
       this.operatingState = "Insert";
       //新增行动设置默认值
-      if(this.source == 'BoDetails'){
-        this.queryParams.bo = this.bo.id;
-        this.form.bo = this.bo.id;
-        this.form.boName = this.bo.boName;
-        this.form.boStage = this.bo.boStage;
-        this.form.customer = this.bo.customer;
-        this.form.customerName = this.bo.customerName;
-      }
-      if(this.source == 'TaskList'){
-        this.form.bo = this.bo.bo;
-        this.form.boName = this.bo.boName;
-        this.form.boStage = this.bo.boStage;
-        this.form.customer = this.bo.customer;
-        this.form.customerName = this.bo.customerName;
-        this.form.task = this.bo.id;
-        this.form.taskCode = this.bo.code;
-      }
+      this.queryParams.bo = this.bo.id;
+      this.form.bo = this.bo.id;
+      this.form.boName = this.bo.boName;
+      this.form.boStage = this.bo.boStage;
+      this.form.customer = this.bo.customer;
+      this.form.customerName = this.bo.customerName;
       this.form.type = '0';
       this.form.staff = this.$store.state.user.id;
       this.form.staffName = this.$store.state.user.nickName;
@@ -534,18 +467,6 @@ export default {
       this.open = true;
       this.title = "添加行动";
     },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.reset();
-      this.operatingState = "Update";
-      const id = row.id || this.ids
-      getBehavior(id).then(response => {
-        this.form = response.data;
-        
-        this.open = true;
-        this.title = "修改行动";
-      });
-    },
     /** 查看按钮操作 */
     handleBrowse(row) {
       this.reset();
@@ -593,16 +514,6 @@ export default {
         }
       });
     },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const ids = row.id || this.ids;
-      this.$modal.confirm('是否确认删除行动编号为"' + ids + '"的数据项？').then(function() {
-        return delBehavior(ids);
-      }).then(() => {
-        this.getList();
-        this.$modal.msgSuccess("删除成功");
-      }).catch(() => {});
-    },
     // 触发联系人参照列表
     refereContact() {
       this.$refs.contactSelect.init()

src/views/business/spd/bo/behavior/index.vue

@@ -14,18 +14,255 @@
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
+    <el-table v-loading="loading" :data="behaviorList">
+      <el-table-column label="负责人" align="center" prop="staffName" />
+      <el-table-column label="行动日期" align="center" prop="time" />
+      <el-form-item label="行动日期" prop="time">
+        <el-date-picker clearable
+          v-model="form.time"
+          type="date"
+          value-format="yyyy-MM-dd"
+          placeholder="请选择行动日期">
+        </el-date-picker>
+      </el-form-item>
+      <el-table-column label="联系人" align="center" prop="linkmanName" />
+      <el-table-column label="拜访效果" align="center" prop="result" >
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.mk_bo_behavior_res" :value="scope.row.result"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="是否上级协助" align="center" prop="assist" >
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.assist"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="协助内容" align="center" prop="assistContent" />
+      <el-table-column label="洽谈内容" align="center" prop="content" />
+      <el-table-column label="任务编码" align="center" prop="taskCode"/>
+      <el-table-column label="行动类型" align="center" prop="type">
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.mk_bo_behavior_type" :value="scope.row.type"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="客户" align="center" prop="customerName"/>
+      <el-table-column label="拜访目的" align="center" prop="purpose">
+        <template slot-scope="scope">
+            <dict-tag :options="dict.type.mk_bo_behavior_goal" :value="scope.row.purpose"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="销售组织" align="center" prop="salesOrgName"/>
+      <el-table-column label="部门" align="center" prop="deptName"/>
+      <el-table-column label="操作" fixed="right" align="center" class-name="small-padding fixed-width">
+       <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-view"
+            @click="handleBrowse(scope.row)"
+          >查看</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+    <el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px" :disabled="this.operatingState == 'Browse'">
+        <el-divider content-position="left">
+          <dev style="width: 50px; height: 40px; font-size: 18px">基本信息</dev>
+        </el-divider>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="任务" prop="taskId" v-if="!(this.source == 'BoDetails')">
+              <el-input v-model="form.taskCode" placeholder="请输入任务" :disabled="this.source == 'TaskList'"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="行动类型" prop="type">
+              <el-select v-model="form.type" placeholder="请输入行动类型">
+                <el-option
+                  v-for="dict in dict.type.mk_bo_behavior_type"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="行动日期" prop="time">
+              <el-date-picker clearable
+                v-model="form.time"
+                type="date"
+                value-format="yyyy-MM-dd"
+                placeholder="请选择行动日期">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="客户" prop="customerName">
+              <el-input v-model="form.customerName" placeholder="请输入客户" disabled="this.source == 'BoDetails' || this.source == 'TaskList'"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="联系人" prop="linkmanName">
+              <el-input v-model="form.linkmanName" placeholder="请输入联系人" >
+                <el-button slot="append" icon="el-icon-more" @click="refereContact"></el-button>
+              </el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="拜访目的" prop="purpose">
+              <el-select v-model="form.purpose" placeholder="请输入拜访目的">
+                <el-option
+                  v-for="dict in dict.type.mk_bo_behavior_goal"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col  :span="8">
+            <el-form-item label="拜访效果" prop="result">
+              <el-select v-model="form.result" placeholder="请输入拜访效果">
+                <el-option
+                  v-for="dict in dict.type.mk_bo_behavior_res"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col  :span="8">
+            <el-form-item label="是否上级协助" prop="assist">
+              <el-select v-model="form.assist" placeholder="请输入是否上级协助">
+                <el-option
+                  v-for="dict in dict.type.sys_yes_no"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col  :span="8">
+            <el-form-item label="协助内容" prop="assistContent" v-show="form.assist == 'Y'" :rules="form.assist == 'Y' ? rules.assistContent : [{require: false}]">
+              <el-input v-model="form.assistContent" placeholder="请输入协助内容" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="6">
+            <el-form-item label="销售区域" prop="marketingAreaName">
+              <el-input v-model="form.marketingAreaName" placeholder="请输入销售区域">
+                <el-button slot="append" icon="el-icon-more" @click="refereSaleaea"></el-button>
+              </el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col  :span="8">
+            <el-form-item label="销售组织" prop="salesOrgName">
+              <el-input v-model="form.salesOrgName" placeholder="请输入销售组织" :disabled="true"/>
+            </el-form-item>
+          </el-col>
+          <el-col  :span="8">
+             <el-form-item label="部门" prop="deptName">
+              <el-input v-model="form.deptName" placeholder="请输入部门" :disabled="true"/>
+            </el-form-item>
+          </el-col>
+          <el-col  :span="8">
+            <el-form-item label="负责人" prop="staffName">
+              <el-input v-model="form.staffName" placeholder="请输入负责人" :disabled="true"/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-divider content-position="left">
+          <dev style="width: 50px; height: 40px; font-size: 18px">跟进内容</dev>
+        </el-divider>
+        <el-form-item label="内容" prop="content" >
+          <el-input
+            type="textarea"
+            :rows="2"
+            maxlength=900
+            placeholder="填写提示：今天拜访了谁，收集了什么述求，达成了什么结果，下一步计划。"
+            autosize
+            v-model="form.content">
+          </el-input>
+        </el-form-item>
+        <el-divider content-position="left">
+          <dev style="width: 50px; height: 40px; font-size: 18px">照片信息</dev>
+        </el-divider>
+
+        <el-upload
+          action="actionUrl"
+          list-type="picture-card"
+          :on-change="uploadPic"
+          :on-preview="handlePictureCardPreview"
+          :on-remove="handleRemove"
+          :auto-upload="false"
+          :file-list="fileList"
+          >
+          <i class="el-icon-plus"></i>
+        </el-upload>
+        <el-dialog :visible.sync="dialogVisible">
+          <img width="100%" :src="dialogImageUrl" alt="">
+        </el-dialog>
 
-    <BehaviorList :key="timer" :source = "'Behavior'" :bo="queryParams" :boAuthority="boAuthority" />
+        <div class="md-auditInfo">
+          <el-divider content-position="left">
+            <dev style="width: 50px; height: 40px; font-size: 18px">其它信息</dev>
+          </el-divider>
+          <el-form :inline="true" label-position="right" :model="form">
+            <el-row>
+              <el-col :span="6">
+                <el-form-item label="创建人">
+                  <el-input v-model="form.createByName" size="small" readonly></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="6">
+                <el-form-item label="创建时间">
+                  <el-input v-model="form.createTime" size="small" readonly></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="6">
+                <el-form-item label="修改人">
+                  <el-input v-model="form.updateByName" size="small" readonly></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="6">
+                <el-form-item label="修改时间">
+                  <el-input v-model="form.updateTime" size="small" readonly></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm" v-if="this.operatingState != 'Browse'" :disabled="submitButtonEditStatus">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { listBehavior, getBehavior, delBehavior, addBehavior, updateBehavior } from "@/api/business/spd/bo/behavior";
-import BehaviorList from '../behavior/behaviorList.vue'
+import { listBehavior, getBehavior} from "@/api/business/spd/bo/behavior";
 
 export default {
   name: "Behavior",
-  components: {BehaviorList},
+  dicts: ['mk_bo_behavior_res','mk_bo_behavior_type','sys_yes_no','mk_bo_behavior_goal'],
   data() {
     return {
       // 遮罩层
@@ -73,20 +310,6 @@ export default {
       },
       // 表单参数
       form: {},
-      // 表单校验
-      rules: {
-      },
-      //重新加载子组件参数
-      timer: '',
-      //行动权限写死
-      boAuthority:{
-        boAuthority:{
-          behaviorAdd:true,
-          behaviorEdit:true,
-          behaviorView:true,
-          behaviorDel:true,
-        }
-      },
     };
   },
   created() {
@@ -102,6 +325,18 @@ export default {
         this.loading = false;
       });
     },
+    /** 查看按钮操作 */
+    handleBrowse(row) {
+      this.reset();
+      const id = row.id || this.ids
+      getBehavior(id).then(response => {
+        this.form = response.data;
+        this.fileList = this.form.behaviorPs;
+        this.open = true;
+        this.operatingState = "Browse";
+        this.title = "基础信息";
+      });
+    },
     // 取消按钮
     cancel() {
       this.open = false;
@@ -142,72 +377,13 @@ export default {
     /** 搜索按钮操作 */
     handleQuery() {
       this.queryParams.pageNum = 1;
-      this.timer = new Date().getTime();
-      // this.getList();
+      this.getList();
     },
     /** 重置按钮操作 */
     resetQuery() {
       this.resetForm("queryForm");
       this.handleQuery();
     },
-    // 多选框选中数据
-    handleSelectionChange(selection) {
-      this.ids = selection.map(item => item.id)
-      this.single = selection.length!==1
-      this.multiple = !selection.length
-    },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset();
-      this.open = true;
-      this.title = "添加行动";
-    },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.reset();
-      const id = row.id || this.ids
-      getBehavior(id).then(response => {
-        this.form = response.data;
-        this.open = true;
-        this.title = "修改行动";
-      });
-    },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate(valid => {
-        if (valid) {
-          if (this.form.id != null) {
-            updateBehavior(this.form).then(response => {
-              this.$modal.msgSuccess("修改成功");
-              this.open = false;
-              this.getList();
-            });
-          } else {
-            addBehavior(this.form).then(response => {
-              this.$modal.msgSuccess("新增成功");
-              this.open = false;
-              this.getList();
-            });
-          }
-        }
-      });
-    },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const ids = row.id || this.ids;
-      this.$modal.confirm('是否确认删除行动编号为"' + ids + '"的数据项？').then(function() {
-        return delBehavior(ids);
-      }).then(() => {
-        this.getList();
-        this.$modal.msgSuccess("删除成功");
-      }).catch(() => {});
-    },
-    /** 导出按钮操作 */
-    handleExport() {
-      this.download('system/behavior/export', {
-        ...this.queryParams
-      }, `behavior_${new Date().getTime()}.xlsx`)
-    }
   }
 };
 </script>

src/views/business/spd/bo/contact/contactList.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-row :gutter="10" class="mb8" v-if="this.source == 'BoDetails' ? this.bo.winningState == 0 ? true : false : true">
+    <el-row :gutter="10" class="mb8" v-if="this.bo.winningState == 0">
       <el-col :span="1.5">
         <el-button
           type="primary"
@@ -13,7 +13,7 @@
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
-    <el-table v-loading="loading" :data="contactList" @selection-change="handleSelectionChange">
+    <el-table v-loading="loading" :data="contactList">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="编号" align="center" prop="code" />
       <el-table-column label="姓名" align="center" prop="name" />
@@ -42,7 +42,6 @@
           <dict-tag :options="dict.type.mk_bo_contact_state" :value="scope.row.state"/>
         </template>
       </el-table-column>
-      <!-- v-if="this.source == 'BoDetails' ? this.bo.winningState == 0 ? true : false : true" -->
       <el-table-column label="操作" fixed="right" align="center" class-name="small-padding fixed-width" >
         <template slot-scope="scope">
           <el-button
@@ -116,8 +115,8 @@
         <el-row>
           <el-col :span="8">
             <el-form-item label="所属客户" prop="customerName">
-              <el-input v-model="form.customerName" placeholder="请输入所属客户" :disabled="this.source == 'BoDetails'">
-                <el-button slot="append" icon="el-icon-more" @click="refereCustomer" :disabled="this.source == 'BoDetails'"></el-button>
+              <el-input v-model="form.customerName" placeholder="请输入所属客户" disabled>
+                <el-button slot="append" icon="el-icon-more" @click="refereCustomer" disabled></el-button>
               </el-input>
             </el-form-item>
           </el-col>
@@ -280,8 +279,8 @@
             </el-form-item>
           </el-col>
           <el-col :span="8">
-            <el-form-item label="邮件" prop="mail">
-              <el-input v-model="form.mail" placeholder="请输入邮件" />
+            <el-form-item label="微信" prop="mail">
+              <el-input v-model="form.mail" placeholder="请输入微信" />
             </el-form-item>
           </el-col>
           <el-col :span="8">
@@ -450,15 +449,9 @@ export default {
     };
   },
   created() {
-    if(this.source == 'BoDetails'){
-      this.queryParams.customer = this.bo.customer;
-      let params = {"post":this.boAuthority.post};
-      this.queryParams.params = params;
-    }
-    if(this.source == 'Contact'){
-      this.queryParams = this.bo;
-    }
-    console.log('this.boAuthority',this.boAuthority);
+    this.queryParams.customer = this.bo.customer;
+    let params = {"post":this.boAuthority.post};
+    this.queryParams.params = params;
     this.getList();
   },
   methods: {
@@ -467,14 +460,12 @@ export default {
       this.loading = true;
       listContact(this.queryParams).then(response => {
         this.contactList = response.rows;
-        if(this.source == 'BoDetails'){
-          console.log('this.contactList',this.contactList);
-          for (var i = 0; i < this.contactList.length; i++) {
-            this.contactList[i].telephone = this.contactList[i].telephone.substring(0,3) + '******' + this.contactList[i].telephone.substring(this.contactList[i].telephone.length - 4,this.contactList[i].telephone.length);
-            this.contactList[i].customerName = this.contactList[i].customerName.substring(0,2) + '******' + this.contactList[i].customerName.substring(this.contactList[i].customerName.length - 2,this.contactList[i].customerName.length);
-            const start = new Array(this.contactList[i].name.length).join('*');
-            this.contactList[i].name = start + this.contactList[i].name.slice(-1);
-          }
+        console.log('this.contactList',this.contactList);
+        for (var i = 0; i < this.contactList.length; i++) {
+          this.contactList[i].telephone = this.contactList[i].telephone.substring(0,3) + '******' + this.contactList[i].telephone.substring(this.contactList[i].telephone.length - 4,this.contactList[i].telephone.length);
+          this.contactList[i].customerName = this.contactList[i].customerName.substring(0,2) + '******' + this.contactList[i].customerName.substring(this.contactList[i].customerName.length - 2,this.contactList[i].customerName.length);
+          const start = new Array(this.contactList[i].name.length).join('*');
+          this.contactList[i].name = start + this.contactList[i].name.slice(-1);
         }
         this.total = response.total;
         this.loading = false;
@@ -526,31 +517,13 @@ export default {
       };
       this.resetForm("form");
     },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      this.queryParams.pageNum = 1;
-      this.getList();
-    },
-    /** 重置按钮操作 */
-    resetQuery() {
-      this.resetForm("queryForm");
-      this.handleQuery();
-    },
-    // 多选框选中数据
-    handleSelectionChange(selection) {
-      this.ids = selection.map(item => item.id)
-      this.single = selection.length!==1
-      this.multiple = !selection.length
-    },
     /** 新增按钮操作 */
     handleAdd() {
       this.operatingState = "Insert";
       this.reset();
-      if(this.source == 'BoDetails'){
-        this.form.boId = this.bo.id;
-        this.form.customer = this.bo.customer;
-        this.form.customerName = this.bo.customerName;
-      }
+      this.form.boId = this.bo.id;
+      this.form.customer = this.bo.customer;
+      this.form.customerName = this.bo.customerName;
       this.form.state = '1';
       this.open = true;
       this.title = "添加联系人";
@@ -613,12 +586,6 @@ export default {
         this.$modal.msgSuccess("删除成功");
       }).catch(() => {});
     },
-    /** 导出按钮操作 */
-    handleExport() {
-      this.download('system/contact/export', {
-        ...this.queryParams
-      }, `contact_${new Date().getTime()}.xlsx`)
-    },
     // 触发客户参照列表
     refereCustomer() {
       this.$refs.customerSelect.init()

src/views/business/spd/bo/contact/index.vue

@@ -1,198 +1,6 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <!-- <el-form-item label="创建日期" prop="createDate">
-        <el-date-picker clearable
-          v-model="queryParams.createDate"
-          type="date"
-          value-format="yyyy-MM-dd"
-          placeholder="请选择创建日期">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item label="部门名称" prop="departmentName">
-        <el-input
-          v-model="queryParams.departmentName"
-          placeholder="请输入部门名称"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="部门编码" prop="departmentCode">
-        <el-input
-          v-model="queryParams.departmentCode"
-          placeholder="请输入部门编码"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="销售区域" prop="area">
-        <el-input
-          v-model="queryParams.area"
-          placeholder="请输入销售区域"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="销售组织" prop="organization">
-        <el-input
-          v-model="queryParams.organization"
-          placeholder="请输入销售组织"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="最佳拜访地点" prop="visitPlace">
-        <el-input
-          v-model="queryParams.visitPlace"
-          placeholder="请输入最佳拜访地点"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="最佳拜访时间" prop="visitTime">
-        <el-date-picker clearable
-          v-model="queryParams.visitTime"
-          type="date"
-          value-format="yyyy-MM-dd"
-          placeholder="请选择最佳拜访时间">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item label="家庭地址" prop="address">
-        <el-input
-          v-model="queryParams.address"
-          placeholder="请输入家庭地址"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="邮件" prop="mail">
-        <el-input
-          v-model="queryParams.mail"
-          placeholder="请输入邮件"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="关键决策人" prop="decisionMaker">
-        <el-input
-          v-model="queryParams.decisionMaker"
-          placeholder="请输入关键决策人"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="擅长领域" prop="fieldExpertise">
-        <el-input
-          v-model="queryParams.fieldExpertise"
-          placeholder="请输入擅长领域"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="支持度" prop="support">
-        <el-input
-          v-model="queryParams.support"
-          placeholder="请输入支持度"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="决策力" prop="power">
-        <el-input
-          v-model="queryParams.power"
-          placeholder="请输入决策力"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="职称" prop="jobTitle">
-        <el-input
-          v-model="queryParams.jobTitle"
-          placeholder="请输入职称"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="职务" prop="position">
-        <el-input
-          v-model="queryParams.position"
-          placeholder="请输入职务"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="任职科室" prop="section">
-        <el-input
-          v-model="queryParams.section"
-          placeholder="请输入任职科室"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="上级联系人" prop="superiorContact">
-        <el-input
-          v-model="queryParams.superiorContact"
-          placeholder="请输入上级联系人"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="状态" prop="state">
-        <el-input
-          v-model="queryParams.state"
-          placeholder="请输入状态"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="业务爱好" prop="hobby">
-        <el-input
-          v-model="queryParams.hobby"
-          placeholder="请输入业务爱好"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="籍贯" prop="birthplace">
-        <el-input
-          v-model="queryParams.birthplace"
-          placeholder="请输入籍贯"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="生日" prop="birthday">
-        <el-date-picker clearable
-          v-model="queryParams.birthday"
-          type="date"
-          value-format="yyyy-MM-dd"
-          placeholder="请选择生日">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item label="联系人分类" prop="contactClassification">
-        <el-input
-          v-model="queryParams.contactClassification"
-          placeholder="请输入联系人分类"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="所属客户编码" prop="customerCode">
-        <el-input
-          v-model="queryParams.customerCode"
-          placeholder="请输入所属客户编码"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="性别" prop="gander">
-        <el-input
-          v-model="queryParams.gander"
-          placeholder="请输入性别"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item> -->
       <el-form-item label="姓名" prop="name">
         <el-input
           v-model="queryParams.name"
@@ -222,17 +30,348 @@
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
-    <ContactList :key="timer" :source = "'Contact'" :bo="this.queryParams" :boAuthority="boAuthority" />
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+        >新增</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+    <el-table v-loading="loading" :data="contactList">
+      <el-table-column label="编号" align="center" prop="code" />
+      <el-table-column label="姓名" align="center" prop="name" />
+      <el-table-column label="性别" align="center" prop="gander" >
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.gander"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="联系电话" align="center" prop="telephone" />
+      <el-table-column label="所属客户" align="center" prop="customerName" />
+      <el-table-column label="部门名称" align="center" prop="departmentName" />
+      <el-table-column label="职务" align="center" prop="position" >
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.mk_bo_position" :value="scope.row.position"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="决策力" align="center" prop="power" >
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.mk_bo_power" :value="scope.row.power"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="兴趣爱好" align="center" prop="hobby" />
+      <el-table-column label="家庭地址" align="center" prop="address" />
+      <el-table-column label="状态" align="center" prop="state" >
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.mk_bo_contact_state" :value="scope.row.state"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" fixed="right" align="center" class-name="small-padding fixed-width" >
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-view"
+            @click="handleBrowse(scope.row)"
+          >查看</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改联系人管理对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="1100px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px" :disabled="this.operatingState == 'Browse'">
+        <el-divider content-position="left">
+          <dev style="width: 50px; height: 40px; font-size: 18px">基本信息</dev>
+        </el-divider>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="编码" prop="code">
+              <el-input v-model="form.code" placeholder="系统自动生成编码" :disabled = "true"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="姓名" prop="name">
+              <el-input v-model="form.name" placeholder="请输入姓名" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="性别" prop="gander">
+              <el-select v-model="form.gander" placeholder="请输入性别">
+                <el-option
+                  v-for="dict in dict.type.sys_user_sex"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="所属客户" prop="customerName">
+              <dr-popover-select v-model="form.customerName" title="客户" type="CUSTOMER_PARAM_ZT" :dataMapping="{
+                  customer: 'id',
+                  customerName: 'name',
+                }" :source.sync="form">
+              </dr-popover-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="联系人分类" prop="contactClassification">
+              <el-select v-model="form.contactClassification" placeholder="请输入联系人分类">
+                <el-option
+                  v-for="dict in dict.type.mk_bo_contact_type"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="生日" prop="birthday">
+              <el-date-picker clearable
+                v-model="form.birthday"
+                type="date"
+                value-format="yyyy-MM-dd"
+                placeholder="请选择生日">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="籍贯" prop="birthplace">
+              <el-input v-model="form.birthplace" placeholder="请输入籍贯" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="兴趣爱好" prop="hobby">
+              <el-input v-model="form.hobby" placeholder="请输入业务爱好" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="状态" prop="state">
+              <el-select v-model="form.state" placeholder="请输入状态">
+                <el-option
+                  v-for="dict in dict.type.mk_bo_contact_state"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-divider content-position="left">
+          <dev style="width: 50px; height: 40px; font-size: 18px">工作信息</dev>
+        </el-divider>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="上级联系人" prop="superiorContactName">
+              <dr-popover-select v-model="form.superiorContactName" title="上级联系人" type="LINKMAN_PARAM" :dataMapping="{
+                  superiorContact: 'id',
+                  superiorContactName: 'name',
+                }" :source.sync="form">
+              </dr-popover-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="任职科室" prop="section">
+              <el-select v-model="form.section" placeholder="请输入任职科室">
+                <el-option
+                  v-for="dict in dict.type.mk_bo_section"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="职务" prop="position">
+              <el-select v-model="form.position" placeholder="请输入职务">
+                <el-option
+                  v-for="dict in dict.type.mk_bo_position"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="职称" prop="jobTitle">
+              <el-select v-model="form.jobTitle" placeholder="请输入职称">
+                <el-option
+                  v-for="dict in dict.type.mk_bo_job_title"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="决策力" prop="power">
+              <el-select v-model="form.power" placeholder="请输入决策力">
+                <el-option
+                  v-for="dict in dict.type.mk_bo_power"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="支持度" prop="support">
+              <el-select v-model="form.support" placeholder="请输入支持度">
+                <el-option
+                  v-for="dict in dict.type.mk_bo_support"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="擅长领域" prop="fieldExpertise">
+              <el-select v-model="form.fieldExpertise" placeholder="请输入擅长领域">
+                <el-option
+                  v-for="dict in dict.type.mk_bo_field_expertise"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="关键决策人" prop="decisionMaker">
+              <el-select v-model="form.decisionMaker" placeholder="请输入关键决策人">
+                <el-option
+                  v-for="dict in dict.type.sys_yes_no"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+          </el-col>
+        </el-row>
+        <el-divider content-position="left">
+          <dev style="width: 50px; height: 40px; font-size: 18px">联系信息</dev>
+        </el-divider>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="联系电话" prop="telephone">
+              <el-input v-model="form.telephone" placeholder="请输入联系电话" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="微信" prop="mail">
+              <el-input v-model="form.mail" placeholder="请输入微信" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="家庭地址" prop="address">
+              <el-input v-model="form.address" placeholder="请输入家庭地址" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item label="最佳拜访时间" prop="visitTime">
+              <el-input v-model="form.visitTime" placeholder="请选择最佳拜访时间" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="最佳拜访地点" prop="visitPlace">
+              <el-input v-model="form.visitPlace" placeholder="请输入最佳拜访地点" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+          </el-col>
+        </el-row>
+        <el-tabs v-model="activeName" v-if="this.operatingState != 'Insert'">
+          <el-tab-pane label="学历信息" name="first">
+            <EducationList  :key="timer" :supForm="this.form" />
+          </el-tab-pane>
+          <el-tab-pane label="社会关系" name="second">
+            <RelationshipList :key="timer" :supForm="this.form" />
+          </el-tab-pane>
+        </el-tabs>
+        <div class="md-auditInfo">
+          <el-divider content-position="left">
+            <dev style="width: 50px; height: 40px; font-size: 18px">其它信息</dev>
+          </el-divider>
+          <el-form :inline="true" label-position="right" :model="form">
+            <el-form-item label="创建人">
+              <el-input v-model="form.createByName" size="small" readonly></el-input>
+            </el-form-item>
+            <el-form-item label="创建时间">
+              <el-input v-model="form.createTime" size="small" readonly></el-input>
+            </el-form-item>
+            <el-form-item label="修改人">
+              <el-input v-model="form.updateByName" size="small" readonly></el-input>
+            </el-form-item>
+            <el-form-item label="修改时间">
+              <el-input v-model="form.updateTime" size="small" readonly></el-input>
+            </el-form-item>
+          </el-form>
+        </div>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm" v-if="this.operatingState != 'Browse'" :disabled="submitButtonEditStatus">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import { listContact, getContact, delContact, addContact, updateContact } from "@/api/business/spd/bo/contact";
-import ContactList from '../contact/contactList.vue'
+import EducationList from '../education/educationList.vue';
+import RelationshipList from '../relationship/relationshipList.vue';
 
 export default {
   name: "Contact",
-  components: {ContactList},
+  dicts: ['sys_user_sex','mk_bo_contact_state','mk_bo_section','mk_bo_position','mk_bo_job_title','mk_bo_power','mk_bo_support','mk_bo_field_expertise','sys_yes_no','mk_bo_contact_type'],
+  components: {EducationList,RelationshipList},
   data() {
     return {
       // 遮罩层
@@ -257,35 +396,9 @@ export default {
       queryParams: {
         pageNum: 1,
         pageSize: 10,
-        boId: null,
-        createDate: null,
-        departmentName: null,
-        departmentCode: null,
-        area: null,
-        organization: null,
-        visitPlace: null,
-        visitTime: null,
-        address: null,
-        mail: null,
+        name: null,
         telephone: null,
-        decisionMaker: null,
-        fieldExpertise: null,
-        support: null,
-        power: null,
-        jobTitle: null,
-        position: null,
-        section: null,
-        superiorContact: null,
-        state: null,
-        hobby: null,
-        birthplace: null,
-        birthday: null,
-        contactClassification: null,
         customerName: null,
-        customerCode: null,
-        gander: null,
-        name: null,
-        code: null,
       },
       // 表单参数
       form: {},
@@ -333,15 +446,11 @@ export default {
       },
       //重新加载子组件参数
       timer: '',
-      //列表权限写死
-      boAuthority:{
-        boAuthority:{
-          contactAdd:true,
-          contactEdit:true,
-          contactView:true,
-          contactDel:true,
-        }
-      },
+      //当前操作状态
+      operatingState: '',
+      activeName: 'first',
+      //确定按钮是否可点
+      submitButtonEditStatus:false,
     };
   },
   created() {
@@ -404,40 +513,49 @@ export default {
     },
     /** 搜索按钮操作 */
     handleQuery() {
-      console.log('this.queryParams',this.queryParams);
       this.queryParams.pageNum = 1;
       this.timer = new Date().getTime();
-      // this.getList();
+      this.getList();
     },
     /** 重置按钮操作 */
     resetQuery() {
       this.resetForm("queryForm");
       this.handleQuery();
     },
-    // 多选框选中数据
-    handleSelectionChange(selection) {
-      this.ids = selection.map(item => item.id)
-      this.single = selection.length!==1
-      this.multiple = !selection.length
-    },
     /** 新增按钮操作 */
     handleAdd() {
+      this.operatingState = "Insert";
       this.reset();
+      this.form.state = '1';
       this.open = true;
-      this.title = "添加联系人管理";
+      this.title = "添加联系人";
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
+      this.operatingState = "Update";
+      this.reset();
+      const id = row.id || this.ids
+      getContact(id).then(response => {
+        this.form = response.data;
+        this.open = true;
+        this.title = "修改联系人";
+        this.timer = new Date().getTime();
+      });
+    },
+    /** 查看按钮操作 */
+    handleBrowse(row) {
       this.reset();
       const id = row.id || this.ids
       getContact(id).then(response => {
         this.form = response.data;
         this.open = true;
-        this.title = "修改联系人管理";
+        this.operatingState = "Browse";
+        this.title = "基础信息";
       });
     },
     /** 提交按钮 */
     submitForm() {
+      this.submitButtonEditStatus = true;
       this.$refs["form"].validate(valid => {
         if (valid) {
           if (this.form.id != null) {
@@ -445,14 +563,18 @@ export default {
               this.$modal.msgSuccess("修改成功");
               this.open = false;
               this.getList();
+              this.submitButtonEditStatus = false;
             });
           } else {
             addContact(this.form).then(response => {
               this.$modal.msgSuccess("新增成功");
               this.open = false;
               this.getList();
+              this.submitButtonEditStatus = false;
             });
           }
+        }else{
+          this.submitButtonEditStatus = false;
         }
       });
     },
@@ -466,12 +588,6 @@ export default {
         this.$modal.msgSuccess("删除成功");
       }).catch(() => {});
     },
-    /** 导出按钮操作 */
-    handleExport() {
-      this.download('system/contact/export', {
-        ...this.queryParams
-      }, `contact_${new Date().getTime()}.xlsx`)
-    }
   }
 };
 </script>

src/views/business/spd/target/targetMk/add.vue

@@ -0,0 +1,254 @@
+<template>
+  <div>
+    <el-card>
+      <el-form :model="form" :rules="rules" ref="form" label-width="auto" :disabled="this.pageStu == 'see'">
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="单据编号" prop="code">
+              <el-input
+                v-model="form.code"
+                size="mini"
+                disabled
+                style="width: 200px"
+              />
+              <!-- <div>{{form.code}}</div> -->
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="单据日期" prop="date">
+              <el-date-picker
+                  v-model="form.date"
+                  clearable
+                  type="date"
+                  value-format="yyyy-MM-dd"
+                  size="mini"
+                  style="width: 200px"
+                >
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="目标名称" prop="name">
+              <el-input
+                v-model="form.name"
+                size="mini"
+                style="width: 200px"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="包含下级组织" >
+              <el-select v-model="form.includeOrg" size="mini" style="width: 200px">
+                <el-option
+                  v-for="dict in dict.type.sys_yes_no"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="模板" prop="template">
+              <dr-popover-select size="mini" v-model="form.templateName" title="模板" type="MK_TARGET_TEMPLATE_PARAM" :dataMapping="{
+                  template: 'id',
+                  templateName: 'name',
+                }" :source.sync="form"
+              >
+              </dr-popover-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-card shadow="never">
+          <el-descriptions title="模板信息">
+            <el-descriptions-item label="年度">{{template.year}}</el-descriptions-item>
+            <el-descriptions-item label="开始日期">{{template.startTime}}</el-descriptions-item>
+            <el-descriptions-item label="结束日期">{{template.deadlineTime}}</el-descriptions-item>
+            <el-descriptions-item label="周期">
+              <div v-for="dict in dict.type.mk_periodic_unit" v-if="template.cycle == dict.value">
+                  <el-tag size="small">{{dict.label}}</el-tag>
+                </div>
+            </el-descriptions-item>
+            <el-descriptions-item label="维度">
+              <div v-for="d in template.dimensionalitys">
+                <!-- <el-tag size="small">{{d.dimensionality}}</el-tag> -->
+                <div v-for="dict in dict.type.mk_dimensionality" v-if="d.dimensionality == dict.value">
+                  <el-tag size="small">{{dict.label}}</el-tag>
+                </div>
+              </div>
+            </el-descriptions-item>
+            <el-descriptions-item label="指标">
+              <div v-for="d in template.indexs">
+                <!-- <el-tag size="small">{{d.target}}</el-tag> -->
+                <div v-for="dict in dict.type.mk_index_type" v-if="d.target == dict.value">
+                  <el-tag size="small">{{dict.label}}</el-tag>
+                </div>
+              </div>
+            </el-descriptions-item>
+            <el-descriptions-item label="展开方式">
+              <div v-for="dict in dict.type.mk_expansion_mode" v-if="template.unfold == dict.value">
+                  <el-tag size="small">{{dict.label}}</el-tag>
+                </div>
+            </el-descriptions-item>
+          </el-descriptions>
+        </el-card>
+      </el-form>
+    </el-card>
+    <Item ref="child" v-if="isItem" :pageStu="pageStu" :template="template" :form="form" :columns="headers"></Item>
+    <el-card>
+      <div class="btn_group">
+        <el-col :span="1.5" style="margin: 0 10px;">
+          <el-button type="primary" size="mini" plain @click="useSave" v-if="pageStu == 'add' || pageStu == 'edit'">保存</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button size="mini" plain @click="useBack">返回</el-button>
+        </el-col>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import Item from './item.vue'
+import { getTargetTemplate,getHeaderData } from "@/api/business/spd/starget/targetTemplate";
+import { getTarget,addTarget,updateTarget } from "@/api/business/spd/starget/target";
+export default {
+  name: 'add',
+  dicts: ['sys_yes_no','mk_periodic_unit','mk_dimensionality','mk_index_type','mk_expansion_mode'],
+  props: ['pageStu','row', 'disable'],
+  components: {Item},
+  model: {
+    prop: 'isList',
+    event: 'jugislist'
+  },
+  data() {
+    return {
+      template:{},
+      form:{},
+      //表单校验
+      rules: {
+        date: [
+          { required: true, message: "单据日期不能为空", trigger: "blur" },
+        ],
+        name: [
+          { required: true, message: "目标名称不能为空", trigger: "blur" },
+        ],
+        template: [
+          { required: true, message: "模板不能为空", trigger: "blur" },
+        ],
+      },
+      //子表表头数据
+      headers:[],
+      //遮罩
+      loading: false,
+      //是否展示Item组件
+      isItem:false,
+    }
+  },
+  async created() {
+    if(this.pageStu == 'edit' || this.pageStu == 'see') {
+      await this.fetchTarget(this.row);
+      await this.fetchTemplate(this.row.template);
+      await this.fetchHeaderData(this.row.template);
+      this.isItem = true;
+    }
+  },
+  watch: {
+	  'form.template': {
+      async handler(newVal) {
+        this.isItem = false;
+        await this.fetchTemplate(newVal);
+        await this.fetchHeaderData(newVal);
+        this.isItem = true;
+      },
+    }
+  },
+  methods: {
+    //保存
+    async useSave(){
+      let passrule = false;
+      this.$refs["form"].validate((valid) => {
+        if (valid) {
+            passrule = true;
+          }
+      });
+      if(passrule){
+        try {
+          this.form.items = this.$refs.child.merge();
+          if(!this.form.items.length){
+            this.$modal.msgError("子表数据不能为空！");
+            return;
+          }
+          console.log('this.form',this.form);
+          this.loading = true;
+          let res = null;
+          if(this.pageStu == 'add'){
+            res = await addTarget(this.form);
+          }
+          if(this.pageStu == 'edit'){
+            res = await updateTarget(this.form);
+          }
+          if (res.code === 200) {
+            this.$modal.msgSuccess("保存成功");
+            this.useBack();
+          }
+        } catch (err) {
+          // catch
+          console.error(err);
+        } finally {
+          this.loading = false;
+        }
+      }
+    },
+    //返回
+    useBack(){
+      this.$emit('jugislist', true)
+      this.$emit('refresh')
+    },
+    //查询目标模板
+    async fetchTemplate(id) {
+      try {
+        this.loading = true;
+        const { code, data } = await getTargetTemplate(id);
+        if (code === 200) {
+          this.template = data;
+          return true;
+        } else {
+          return false;
+        }
+      } catch (err) {
+        // catch
+        console.error(err);
+      } finally {
+        // finally
+        this.loading = false;
+      }
+    },
+    //查询详情
+    async fetchTarget(row){
+      await getTarget(row.id).then(res => {
+        if (res.code === 200) {
+          this.form = res.data
+         }
+      })
+    },
+    //查询动态表头数据
+    async fetchHeaderData(id){
+      await getHeaderData(id).then(res => {
+        if (res.code === 200) {
+          this.headers = res.rows
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.btn_group {
+  width: 100%;
+  margin: 20px 0;
+  display: flex;
+  justify-content: center;
+} 
+</style>

src/views/business/spd/target/targetMk/index.vue

@@ -0,0 +1,284 @@
+<template>
+  <div id="deliveryAddressList">
+    <div v-if="isList">
+      <el-card>
+        <el-form class="search_area" label-width="120px">
+          <el-row :gutter="10">
+            <el-col :span="1.5">
+              <el-form-item label="单据编号">
+                <el-input
+                  v-model="queryParams.code"
+                  size="mini"
+                  clearable
+                  style="width: 200px"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="1.5">
+              <el-form-item label="目标名称">
+                <el-input
+                  v-model="queryParams.name"
+                  size="mini"
+                  clearable
+                  style="width: 200px"
+                />
+              </el-form-item>
+            </el-col>
+            <!-- <el-col :span="1.5">
+              <el-form-item label="模板">
+                <el-input
+                  v-model="queryParams.template"
+                  size="mini"
+                  clearable
+                  style="width: 200px"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="1.5">
+              <el-form-item label="年度">
+                <el-input
+                  v-model="queryParams.year"
+                  size="mini"
+                  clearable
+                  style="width: 200px"
+                />
+              </el-form-item>
+            </el-col> -->
+            <el-col :span="1.5">
+              <el-form-item label="" label-width="20px">
+                <el-button type="primary" size="mini" icon="el-icon-search" plain @click="useSearch">搜索</el-button>
+                <el-button size="mini" icon="el-icon-refresh" plain @click="useReset">重置</el-button>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <CollapseTransition>
+            <div v-show="expanded">
+              
+            </div>
+          </CollapseTransition>
+        </el-form>
+        <el-divider class="lines"><i style="cursor: pointer;" :class="expanded?'el-icon-arrow-up':'el-icon-arrow-down'" @click="drop"></i></el-divider>
+      
+        <div class="btn_grooup">
+          <el-button type="primary" size="mini" @click="useAdd">新增</el-button>
+        </div>
+
+        <el-table 
+          :data="tableList" 
+          fit
+          max-height="480"
+          style="font-size: 12px;"
+          @selection-change="useSelectionRow"
+          @row-dblclick="useDoubleClick"
+        >
+          <el-table-column show-overflow-tooltip type="selection" width="55" />
+          <el-table-column show-overflow-tooltip label="单据编号" align="center" width="200" prop="code"/>
+          <el-table-column show-overflow-tooltip label="单据日期" align="center" width="200" prop="date"/>
+          <el-table-column show-overflow-tooltip label="目标名称" align="center" width="200" prop="name"/>
+          <el-table-column show-overflow-tooltip label="年度" align="center" width="200" prop="templateData.year"/>
+          <el-table-column show-overflow-tooltip label="模板" align="center" width="200" prop="templateData.name"/>
+          <el-table-column show-overflow-tooltip label="开始日期" align="center" width="200" prop="templateData.startTime" />
+          <el-table-column show-overflow-tooltip label="结束日期" align="center" width="200" prop="templateData.deadlineTime" />
+          <el-table-column show-overflow-tooltip label="周期" align="center" width="200" prop="templateData.cycle">
+            <template slot-scope="scope">
+              <dict-tag
+                :options="dict.type.mk_periodic_unit"
+                :value="scope.row.templateData.cycle"
+              />
+            </template>
+          </el-table-column>
+          <el-table-column show-overflow-tooltip label="维度" align="center" min-width="200" prop="templateData.dimensionalitys">
+            <template slot-scope="scope">
+              <div style="display:flex;">
+                <span v-for="o in scope.row.templateData.dimensionalitys">
+                  <dict-tag
+                    :options="dict.type.mk_dimensionality"
+                    :value="o.dimensionality"
+                    />
+                  </span>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column show-overflow-tooltip label="指标" align="center" min-width="200" prop="templateData.indexs">
+            <template slot-scope="scope">
+              <div style="display:flex;">
+                <span v-for="o in scope.row.templateData.indexs">
+                  <dict-tag
+                    :options="dict.type.mk_index_type"
+                    :value="o.target"
+                  />
+                </span>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column show-overflow-tooltip label="创建人" align="center" width="200" prop="createByName" />
+          <el-table-column show-overflow-tooltip label="创建时间" align="center" width="200" prop="createTime" />
+          <el-table-column show-overflow-tooltip label="修改人" align="center" width="200" prop="updateByName" />
+          <el-table-column show-overflow-tooltip label="修改时间" align="center" width="200" prop="updateTime" />
+          <el-table-column fixed="right" label="操作" align="center" width="200">
+            <template slot-scope="scope">
+              <!-- <el-button type="text" size="mini" @click="useSubmit(scope.row)">提交</el-button> -->
+              <el-button type="text" size="mini" @click="useEdit(scope.row)">编辑</el-button>
+              <el-button type="text" size="mini" @click="useDel(scope.row)">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+
+        <el-pagination
+          background
+          @size-change="useChangePageSize"
+          @current-change="useCurrentChange"
+          :current-page="queryParams.pageNum"
+          :page-sizes="[10, 15, 20]"
+          :page-size="100"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total=total>
+        </el-pagination>
+      </el-card>
+    </div>
+    <Add v-model="isList" v-if="!isList" :pageStu="page" :disable="disable" :row="rowDetail" @refresh="useSearch"/>
+  </div>
+</template>
+
+<script>
+import Add from './add.vue'
+import CollapseTransition from '@/components/MyCollapse/collapse.vue'
+import { listTarget,delTarget } from "@/api/business/spd/starget/target";
+export default {
+  name: 'target',
+  dicts: [
+    "mk_periodic_unit","mk_dimensionality","mk_index_type"
+  ],
+  components: { Add,CollapseTransition},
+  data() {
+    return {
+      expanded: false,
+      // 页面配置
+      isList: true,
+      // 页面状态
+      page: '',
+      // 搜索框参数
+      queryParams: {
+        code: '',
+        name: '',
+        template:'',
+        year:'',
+        pageNum: 1,
+        pageSize: 10
+      },
+      //总条数
+      total: 0,
+      //列表数据
+      tableList:[],
+      disable: false,
+    }
+  },
+  created() {
+    this.getList(this.queryParams)
+  },
+  methods: {
+    //新增
+    useAdd(){
+      this.isList = false
+      this.page = 'add'
+      this.disable = false
+    },
+    //提交
+    useSubmit(){
+      
+    },
+    //修改
+    useEdit(row){
+      this.isList = false
+      this.page = 'edit'
+      this.rowDetail = row
+      this.disable = false
+    },
+    //删除
+    useDel(row){
+      this.$modal.confirm('确认删除选择数据').then(() => {
+        delTarget(row.id).then(res => {
+          if (res.code === 200) {
+            this.$modal.msgSuccess("删除成功");
+            this.getList(this.queryParams)
+          }
+        })
+      }).catch(() => {})
+    },
+    //查看
+    useSee(){
+
+    },
+    //选择列
+    useSelectionRow(){
+
+    },
+    //双击
+    useDoubleClick(row){
+      this.isList = false
+      this.page = 'see'
+      this.rowDetail = row
+      this.disable = false
+    },
+    //改变一页显示条数
+    useChangePageSize(val){
+      this.queryParams.pageSize = val
+      this.getList(this.queryParams)
+    },
+    //翻页
+    useCurrentChange(val){
+      this.queryParams.pageNum = val
+      this.getList(this.queryParams)
+    },
+    //搜索
+    useSearch() {
+      this.getList(this.queryParams)
+    },
+    //重置
+    useReset(){
+      this.queryParams = {
+        code: '',
+        name: '',
+        template:'',
+        year:'',
+        pageNum: 1,
+        pageSize: 10
+      }
+      this.getList(this.queryParams)
+    },
+    //查询列表
+    getList(params){
+      listTarget(params).then(res => {
+        if (res.code === 200) {
+          this.tableList = res.rows
+          this.total = res.total
+        }
+      })
+    },
+    drop() {
+      this.expanded = !this.expanded
+    },
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+#deliveryAddressList {
+  height: calc(100vh - 84px);
+  padding: 12px;
+  box-sizing: border-box;
+  overflow-y: scroll;
+}
+.btn_grooup {
+  margin-bottom: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
+.lines {
+  margin-top: 0;
+}
+.el-pagination {
+  margin-top: 10px;
+  text-align: right;
+}
+</style>

src/views/business/spd/target/targetMk/item.vue

@@ -0,0 +1,177 @@
+<template>
+  <div>
+    <el-card>
+      <el-row>
+        <div class="btn_add">
+          <el-button type="primary" size="mini" @click="useAdd" v-if="this.pageStu != 'see'">增行</el-button>
+        </div>
+      </el-row>
+      <!-- 渲染表头 -->
+      <el-table :data="items" style="width: 100%" height="500px">
+        <el-table-column label="序号" type="index" width="50" align="center" fixed>
+        </el-table-column>
+        <el-table-column v-for="head in headers" :prop="head.prop" :label="head.modelName" width="150" align="center">
+          <template slot-scope="scope">
+            <div v-if="pageStu == 'add' || pageStu == 'edit'">
+              <dr-popover-select size="mini" v-if="scope.row[head.prop].type == 'D'" v-model="scope.row[head.prop].valueName" title="参照选择" :type="scope.row[head.prop].model" :dataMapping="{
+                value: 'id',
+                valueName: 'name',
+              }" :source.sync="scope.row[head.prop]"></dr-popover-select>
+              <el-input size="mini" v-if="scope.row[head.prop].type == 'C' || scope.row[head.prop].type == 'I'" v-model="scope.row[head.prop].value"></el-input>
+            </div>
+            <div v-else-if="pageStu == 'see'">
+              <div v-if="scope.row[head.prop].type == 'D'">
+                {{scope.row[head.prop].valueName}}
+              </div>
+              <div v-else>
+                {{scope.row[head.prop].value}}
+              </div>
+            </div>
+          </template>
+          <el-table-column v-if="head.children" v-for="headChi in head.children" :prop="headChi.prop" :label="headChi.modelName" width="150" align="center">
+            <template slot-scope="scope">
+              <div v-if="pageStu == 'add' || pageStu == 'edit'">
+                <el-input size="mini" v-model="scope.row[headChi.prop].value"></el-input>
+              </div>
+              <div v-else-if="pageStu == 'see'">
+                {{scope.row[headChi.prop].value}}
+              </div>
+            </template>
+          </el-table-column>
+        </el-table-column>
+        <el-table-column fixed="right" label="操作" align="center" width="100" v-if="this.pageStu != 'see'">
+          <template slot-scope="scope">
+            <el-button type="text" size="mini" @click="useDel(scope.$index, scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { getTargetItem } from "@/api/business/spd/starget/target";
+
+export default {
+  name: 'item',
+  props: ['pageStu','template','form','columns'],  
+  dicts: ['sys_yes_no','mk_periodic_unit','mk_dimensionality','mk_index_type','mk_expansion_mode'],
+  data() {
+    return {
+      items:[],
+      delItems:[],
+      headers:[],
+      itemTemplate:{},
+    }
+  },
+  async created() {
+    this.processHeadersData(this.template.unfold,this.columns);
+    this.itemTemplate = this.formatItem(this.columns);
+    console.log('this.itemTemplate',this.itemTemplate);
+    if(this.pageStu == 'edit' || this.pageStu == 'see'){
+      await this.fetchTargetItem(this.form.id);
+      console.log('this.items',this.items);
+    }
+  },
+  methods: {
+    //增行
+    useAdd(){
+      this.items.push(this.itemTemplate);
+      console.log('this.items',this.items);
+    },
+    //删行
+    useDel(index){
+      this.items[index].delFlag = '2';
+      if(this.items[index].id){
+        let delList = this.items.filter(item => {
+          return item.delFlag == '2'
+        })
+        this.delItems.push(...delList);
+      }
+      this.items.splice(index, 1);
+    },
+    //表头数据处理
+    processHeadersData(unfold,columns){
+      const array = [];
+      if("cycle/unfold" == unfold){
+        for(let i in columns){
+          if(columns[i].type == 'D'){
+            columns[i].prop = columns[i].model
+            array.push(columns[i]);
+          }else{
+            const arr = array.filter(element => element.model == columns[i].superiors);
+            if(arr.length > 0){
+              columns[i].prop = array[array.length - 1].model + '-' + columns[i].model;
+              array[array.length - 1].children.push(columns[i]);
+            }else{
+              columns[i].prop = columns[i].superiors + '-' + columns[i].model;
+              let c = {
+                type:'C',
+                model:columns[i].superiors,
+                modelName:columns[i].superiorsName,
+                children:[columns[i]]
+              }
+              array.push(c);
+            }
+          }
+        }
+        this.headers = array;
+      }else if("cycle" == unfold){
+        for(let i in columns){
+          columns[i].prop = columns[i].model
+          array.push(columns[i]);
+        }
+        this.headers = array;
+      }else if("unfold" == unfold){
+        for(let i in columns){
+          columns[i].prop = columns[i].model
+          array.push(columns[i]);
+        }
+        this.headers = array;
+      }else if("" == unfold){
+        for(let i in columns){
+          columns[i].prop = columns[i].model
+          array.push(columns[i]);
+        }
+        this.headers = array;
+      }
+      console.log('this.headers',this.headers);
+    },
+    //获取明细数据
+    async fetchTargetItem(id){
+      await getTargetItem(id).then(res => {
+        if (res.code === 200) {
+          this.items = res.rows
+        }
+      })
+    },
+    //格式化数据
+    formatItem(item){
+      let obj = {};
+      for(let i in item){
+        obj[item[i].prop] = item[i];
+      }
+      return obj;
+    },
+    //合并已存在和删除的数据
+    merge(){
+      this.items.push(...this.delItems);
+      return this.items;
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.btn_add{
+    margin-bottom: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
+.btn_group {
+  width: 100%;
+  margin: 20px 0;
+  display: flex;
+  justify-content: center;
+} 
+</style>

src/views/business/spd/target/targetTemplate/add/columns.js

@@ -0,0 +1,131 @@
+import CONFIG from "@/config";
+
+export default function useColumns() {
+  const TableColumns = [
+    {
+      item: { key: "year", title: "年度", require: true },
+      attr: {
+        is: "el-date-picker",
+        type: "year",
+        valueFormat: "yyyy-MM-dd",
+      },
+    },
+    {
+      item: { key: "name", title: "模板名称", require: true },
+      attr: { is: "el-input" },
+    },
+    {
+      item: { key: "startTime", title: "开始日期", require: true },
+      attr: {
+        is: "el-date-picker",
+        valueFormat: "yyyy-MM-dd",
+      },
+    },
+    {
+      item: { key: "deadlineTime", title: "结束日期", require: true },
+      attr: {
+        is: "el-date-picker",
+        valueFormat: "yyyy-MM-dd",
+      },
+    },
+    {
+      item: { key: "cycle", title: "周期", require: true },
+      attr: {
+        is: "el-select",
+        dictName: "mk_periodic_unit",
+      },
+    },
+    {
+      item: { key: "unfold", title: "按列展开"},
+      attr: {
+        is: "el-select",
+        dictName: "mk_expansion_mode",
+        clearable: true,
+      },
+    },
+  ].map(({ item, attr }) => ({
+    attr,
+    item: { ...item, hidden: true, span: item.span || 6 },
+  }));
+
+  const TabColumns = [
+    {
+      item: {
+        title: "指标",
+        key: "indexs",
+      },
+      attr: {
+        value: [],
+      },
+      TableColumns: [
+        {
+          item: { key: "target", title: "指标", width: 'auto' },
+          attr: {
+            is: "el-select",
+            dictName: "mk_index_type",
+          },
+        },
+      ],
+    },
+    {
+      item: {
+        title: "维度",
+        key: "dimensionalitys"
+      },
+      attr: {
+        value: [],
+      },
+      TableColumns: [
+        {
+          item: { key: "dimensionality", title: "维度", width: 'auto' },
+          attr: {
+            is: "el-select",
+            dictName: "mk_dimensionality",
+          },
+        },
+      ],
+    },
+    {
+      item: {
+        title: "周期",
+        key: "cycles",
+      },
+      attr: {
+        value: [],
+      },
+      TableColumns: [
+        {
+          item: { key: "name", title: "周期名称", require: true },
+          attr: { is: "el-input" },
+        },
+        {
+          item: {
+            key: "startTime",
+            title: "周期开始日期",
+            require: true,
+          },
+          attr: {
+            is: "el-date-picker",
+            valueFormat: "yyyy-MM-dd",
+            // value: new Date(),
+          },
+        },
+        {
+          item: {
+            key: "deadlineTime",
+            title: "周期结束日期",
+            require: true,
+            width: 'auto'
+          },
+          attr: {
+            is: "el-date-picker",
+            valueFormat: "yyyy-MM-dd",
+            // value: new Date(),
+          },
+        },
+      ],
+    },
+  ];
+
+  return { TableColumns, TabColumns };
+}

src/views/business/spd/target/targetTemplate/add/index.vue

@@ -0,0 +1,350 @@
+<script>
+import useColumns from "./columns";
+import {
+  addTargetTemplate,
+  updateTargetTemplate,
+  getTargetTemplate,
+  checkQuote,
+} from "@/api/business/spd/starget/targetTemplate";
+export default {
+  name: "AddDrawer",
+  props: {
+    dict: {
+      type: Object,
+    },
+    selectData: {
+      type: [Array],
+      require: true,
+    },
+    addType: {
+      type: String,
+      default: "add",
+    },
+  },
+  components: {
+    ElSuperForm: () => import("@/components/super-form/index.vue"),
+    ElSuperTable: () => import("@/components/super-table/index.vue"),
+    ElPopoverSelectV2: () => import("@/components/popover-select-v2/index.vue"),
+  },
+  data() {
+    const {
+      TabColumns,
+      TableColumns,
+      TabColumns: [
+        {
+          item: { key: tabName },
+        },
+      ],
+    } = useColumns();
+    const rules = this.$init.rules([...TabColumns, ...TableColumns]);
+    const params = this.$init.params([...TabColumns, ...TableColumns]);
+    return {
+      width: "100%",
+      visible: false,
+      loading: false,
+      rules: rules,
+      params: params,
+      tabName: tabName,
+      TabColumns: TabColumns,
+      TableColumns: TableColumns,
+    };
+  },
+  computed: {
+    title: {
+      get() {
+        const { addType } = this;
+        if (addType === "add") {
+          return "新 增";
+        }
+        if (addType === "edit") {
+          return "编 辑";
+        }
+      },
+      set() {},
+    },
+    disabled: {
+      get() {
+        const {
+          addType,
+          selectData,
+          selectData: [{ status } = {}],
+        } = this.$props;
+        if (addType === "add") {
+          return false;
+        }
+        if (addType === "edit") {
+          if (selectData.length !== 1) {
+            return true;
+          }
+          if (selectData.length === 1 && status === "1") {
+            return true;
+          }
+          if (selectData.length === 1 && status === "2") {
+            return true;
+          }
+        }
+      },
+      set() {},
+    },
+  },
+  watch: {},
+  methods: {
+    changePuOrgName(prop) {
+      console.log("changePuOrgName", prop);
+    },
+    changeMaterialName(prop) {
+      console.log("changeMaterialName", prop);
+    },
+
+    //查询目标模板详情
+    async fetchTemplate(prop) {
+      try {
+        // try
+        this.loading = true;
+        const { code, data } = await getTargetTemplate(prop);
+        if (code === 200) {
+          this.params = data;
+          return true;
+        } else {
+          return false;
+        }
+      } catch (err) {
+        // catch
+        console.error(err);
+      } finally {
+        // finally
+        this.loading = false;
+      }
+    },
+    //打开组件
+    async open() {
+      const { addType, selectData } = this.$props;
+      if (addType === "add") {
+        this.visible = true;
+      }
+      if (addType === "edit") {
+        const [{ id }] = selectData;
+        //校验目标模板是否存在引用
+        const { code, data } = await checkQuote(id);
+        if(code == '200'){
+          if(data){
+            this.$modal.msgError("该目标模板存在引用，无法修改！");
+            this.visible = false;
+            return;
+          }
+        }else{
+          this.$modal.msgError("校验该目标模板是否存在引用异常，无法修改！");
+          this.visible = false;
+          return;
+        }
+        this.visible = await this.fetchTemplate(id);
+        this.params.indexs = this.params.indexs.map((item) => ({ ...item }));
+        this.params.dimensionalitys = this.params.dimensionalitys.map(
+          (item) => ({ ...item })
+        );
+        this.params.cycles = this.params.cycles.map((item) => ({ ...item }));
+      }
+    },
+    //关闭页面
+    async hide() {
+      const {
+        TabColumns,
+        TableColumns,
+        TabColumns: [
+          {
+            item: { key: tabName },
+          },
+        ],
+      } = useColumns();
+      this.visible = false;
+      this.tabName = tabName;
+      this.params = this.$init.params([...TabColumns, ...TableColumns]);
+    },
+    //增行
+    async useRowAdd(prop) {
+      const { TabColumns } = this;
+      const { TableColumns } = TabColumns.find(
+        ({ item: { key } }) => key === prop
+      );
+      console.log(prop, this.$init.params(TableColumns));
+      this.params[prop].push({
+        delFlag: "0",
+        ...this.$init.params(TableColumns),
+      });
+      console.log("this.params[prop]", this.params[prop]);
+    },
+    //删行
+    async useRowRemove(prop, scope) {
+      const { addType } = this.$props;
+      const {
+        row: { $index },
+      } = scope;
+      if (addType === "add") {
+        this.params[prop].splice($index, 1);
+      }
+      if (addType === "edit") {
+        this.params[prop] = this.params[prop].map((item, index) => ({
+          ...item,
+          delFlag: index === $index ? "2" : item.delFlag,
+        }));
+        console.log(this.params[prop]);
+      }
+    },
+    //确认
+    async useSubmit(prop) {
+      this.$refs[prop].$refs[prop].validate(async (valid) => {
+        if (valid) {
+          try {
+            this.loading = true;
+            // const {
+            //   params,
+            //   params: { paramsOrgs, paramsItems },
+            // } = this;
+            // if (this.addType === "edit") {
+            //   params.paramsOrgs = paramsOrgs.filter(
+            //     (item) => item.orgName
+            //   );
+            //   params.paramsItems = paramsItems.filter(
+            //     (item) => item.materialName
+            //   );
+            // }
+            const { addType } = this.$props;
+            let res = null;
+            if (addType === "add") {
+              res = await addTargetTemplate(this.params);
+            }
+            if (addType === "edit") {
+              res = await updateTargetTemplate(this.params);
+            }
+            if (res.code === 200) {
+              this.hide();
+              this.$emit("success");
+              this.$notify.success(res.msg);
+            }
+          } catch (err) {
+            // catch
+            console.error(err);
+          } finally {
+            // finally
+            this.loading = false;
+          }
+        } else {
+          return false;
+        }
+      });
+    },
+  },
+  created() {
+    console.log("params", this.params);
+  },
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<template>
+  <el-button
+    v-bind="$attrs"
+    v-on="$listeners"
+    :disabled="disabled"
+    @click="open"
+  >
+    {{ title }}
+    <el-drawer
+      :size="width"
+      :title="title"
+      :visible.sync="visible"
+      append-to-body
+      destroy-on-close
+      @close="hide"
+    >
+      <el-super-form
+        v-model="params"
+        :dict="dict"
+        :rules="rules"
+        :size="$attrs.size"
+        :columns="TableColumns"
+        ref="superForm"
+        label-width="auto"
+        label-position="right"
+        style="padding: 20px"
+      >
+        <!-- <template slot="puOrgName" slot-scope="scope">
+          <component
+            v-bind="scope.attr"
+            v-model="scope.row[scope.item.key]"
+            :size="$attrs.size"
+            :source.sync="scope.row"
+            @change="changePuOrgName({ ...scope, select: $event })"
+          >
+          </component
+        ></template> -->
+      </el-super-form>
+      <el-tabs v-model="tabName" style="padding: 0 20px 20px">
+        <el-tab-pane
+          v-for="({ item, TableColumns: columns }, index) in TabColumns"
+          :key="index"
+          :label="item.title"
+          :name="item.key"
+          lazy
+        >
+          <el-super-table
+            v-model="params[item.key]"
+            :dict="dict"
+            :ref="tabName"
+            :columns="columns"
+            :size="$attrs.size"
+          >
+            <!-- <template slot="materialName" slot-scope="scope">
+              <component
+                v-bind="scope.attr"
+                v-model="scope.row[scope.item.key]"
+                :size="$attrs.size"
+                :source.sync="scope.row"
+                @change="changeMaterialName(scope)"
+              >
+              </component>
+            </template> -->
+            <el-table-column fixed="right" label="操作" width="75">
+              <template slot="header" slot-scope="scope">
+                <el-button
+                  circle
+                  icon="el-icon-plus"
+                  :size="$attrs.size"
+                  @click="useRowAdd(tabName)"
+                >
+                </el-button>
+              </template>
+              <template slot-scope="scope">
+                <el-button
+                  circle
+                  icon="el-icon-minus"
+                  :size="$attrs.size"
+                  @click.native.prevent="useRowRemove(tabName, scope)"
+                >
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-super-table>
+        </el-tab-pane>
+      </el-tabs>
+      <div style="padding: 20px; text-align: right">
+        <el-button :size="$attrs.size" :loading="loading" @click="hide"
+          >取 消</el-button
+        >
+        <el-button
+          type="primary"
+          :size="$attrs.size"
+          :loading="loading"
+          @click="useSubmit('superForm')"
+          >确 认</el-button
+        >
+      </div>
+    </el-drawer>
+  </el-button>
+</template>
+
+<style scoped>
+::v-deep .el-table__row.is-hidden {
+  display: none;
+}
+</style>

src/views/business/spd/target/targetTemplate/columns.js

@@ -0,0 +1,38 @@
+import CONFIG from "@/config";
+
+export default function useColumns() {
+  const TableColumns = [
+    { item: { key: "year", title: "年度" }, attr: {} },
+    { item: { key: "name", title: "模板名称" }, attr: {} },
+    { item: { key: "startTime", title: "开始日期" }, attr: {} },
+    { item: { key: "deadlineTime", title: "结束日期" }, attr: {} },
+    {
+      item: { key: "cycle", title: "周期" },
+      attr: { is: "el-dict-tag", dictName: "mk_periodic_unit" },
+    },
+    {
+      item: { key: "unfold", title: "按列展开" },
+      attr: { is: "el-dict-tag", dictName: "mk_expansion_mode" },
+    },
+    { item: { key: "createByName", title: "创建人" }, attr: {} },
+    { item: { key: "createTime", title: "创建时间" }, attr: {} },
+    { item: { key: "updateByName", title: "修改人" }, attr: {} },
+    { item: { key: "updateTime", title: "修改时间" }, attr: {} },
+  ].map(({ item, attr }) => ({
+    attr,
+    item: { ...item, hidden: true, fixed: false },
+  }));
+  const SearchColumns = [
+    { item: { key: "year", title: "年度",},attr: {
+      is: "el-date-picker",
+      type: "year",
+      valueFormat: "yyyy-MM-dd",
+    }, },
+    { item: { key: "name", title: "模板名称"},attr: { is: "el-input" }, },
+  ].map(({ item, attr }) => ({
+    attr,
+    item: { ...item, hidden: true, span: item.span || 6 },
+  }));
+
+  return { TableColumns, SearchColumns };
+}

src/views/business/spd/target/targetTemplate/delete/index.vue

@@ -0,0 +1,94 @@
+<script>
+import { delTargetTemplate,checkQuote, } from "@/api/business/spd/starget/targetTemplate";
+
+export default {
+  name: "DeleteDialog",
+  props: {
+    selectData: {
+      type: [Array],
+      require: true,
+    },
+  },
+  data() {
+    return {
+      title: "删 除",
+    };
+  },
+  computed: {
+    disabled: {
+      get() {
+        const { selectData } = this;
+        if (selectData.length < 1) {
+          return true;
+        }
+        if (
+          selectData.length >= 1 &&
+          selectData.findIndex(({ status }) => status === "1") > -1
+        ) {
+          return true;
+        }
+        if (
+          selectData.length >= 1 &&
+          selectData.findIndex(({ status }) => status === "2") > -1
+        ) {
+          return true;
+        }
+      },
+      set() {},
+    },
+  },
+  watch: {},
+  methods: {
+    //
+    open() {
+
+      this.$confirm(`是否删除数据项?`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "info",
+        beforeClose: async (action, instance, done) => {
+          if (action === "confirm") {
+            instance.confirmButtonLoading = true;
+            instance.confirmButtonText = "执行中...";
+            try {
+              // try
+              const { selectData } = this.$props;
+              const ids = selectData.map((item) => item.id).join(",");
+              const { msg, code } = await delTargetTemplate(ids);
+              if (code === 200) {
+                done();
+                this.$emit("success");
+                this.$notify.success(msg);
+              }
+            } catch (err) {
+              // catch
+              console.error(err);
+              instance.confirmButtonText = "确认";
+            } finally {
+              // finally
+              instance.confirmButtonLoading = false;
+            }
+          } else {
+            done();
+          }
+        },
+      })
+        .then(() => {})
+        .catch(() => {});
+    },
+  },
+  created() {},
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<template>
+  <el-button
+    v-bind="$attrs"
+    v-on="$listeners"
+    :disabled="disabled"
+    @click="open"
+  >
+    {{ title }}
+  </el-button>
+</template>

src/views/business/spd/target/targetTemplate/dicts.js

@@ -0,0 +1,14 @@
+import { initDicts } from "@/utils/init.js";
+const modules = require.context("./", true, /columns.js$/);
+const columns = [];
+modules.keys().forEach((fileName) => {
+  const data = modules(fileName).default();
+  for (const key in data) {
+    if (key === "TabColumns") {
+      columns.push(...data[key].map((item) => item.TableColumns).flat());
+    } else {
+      columns.push(...data[key]);
+    }
+  }
+});
+export const dicts = initDicts(columns);

src/views/business/spd/target/targetTemplate/index.vue

@@ -0,0 +1,158 @@
+<script>
+import { dicts } from "./dicts";
+import useColumns from "./columns";
+import { listTargetTemplate } from "@/api/business/spd/starget/targetTemplate";
+
+export default {
+  name: "targettemplate",
+  dicts: dicts,
+  components: {
+    SeeButton: () => import("./see/index.vue"),
+    AddButton: () => import("./add/index.vue"),
+    DeleButton: () => import("./delete/index.vue"),
+    ElSuperTable: () => import("@/components/super-table/index.vue"),
+    ElSuperSearch: () => import("@/components/super-search/index.vue"),
+  },
+  data() {
+    const { TableColumns, SearchColumns } = useColumns();
+    const params = this.$init.params(SearchColumns);
+    return {
+      size: "mini",
+      loading: false,
+      params: params,
+      tableData: [],
+      selectData: [],
+      SearchColumns: SearchColumns,
+      TableColumns: TableColumns,
+      page: { pageNum: 1, pageSize: 10, total: 0 },
+    };
+  },
+  created() {
+    console.log('this.$refs',this.$refs);
+    this.useQuery(this.params, this.page);
+  },
+  methods: {
+    async fetchList(prop, page) {
+      try {
+        this.loading = true;
+        const { code, rows, total } = await listTargetTemplate(
+          {...prop,...page}
+        );
+        if (code === 200) {
+          this.tableData = rows;
+          this.page.total = total;
+          console.log('this.tableData',this.tableData);
+        }
+      } catch (err) {
+        // catch
+        console.error(err);
+      } finally {
+        // finally
+        this.loading = false;
+      }
+    },
+    // 查 询
+    useQuery(prop, page) {
+      this.selectData = [];
+      this.fetchList(prop, page);
+    },
+    // 重 置
+    useReset() {
+      this.page.pageNum = 1;
+      this.page.pageSize = 10;
+      this.params = this.$init.params(this.SearchColumns);
+      this.useQuery(this.params, this.page);
+    },
+    // 选 择
+    useSelect(prop) {
+      this.selectData = prop;
+    },
+    // 明 细
+    async useSee(prop) {
+      const { open } = this.$refs.SeeButton;
+      await open([prop]);
+    },
+  },
+};
+</script>
+
+<template>
+  <el-card v-loading="loading" :body-style="{ padding: 0 }">
+    <el-super-search
+      v-model="params"
+      :size="size"
+      :dict="dict"
+      :columns="SearchColumns"
+      @reset="useReset"
+      @submit="useQuery(params, page)"
+    ></el-super-search>
+    <div style="margin: 0 0 20px 0; text-align: right">
+      <el-button-group>
+        <add-button
+          :size="size"
+          :select-data="[]"
+          :dict="dict"
+          add-type="add"
+          @success="useQuery(params, page)"
+        ></add-button>
+      </el-button-group>
+      <el-button-group>
+        <see-button
+          v-show="false"
+          :size="size"
+          :dict="dict"
+          :model="params"
+          :select-data="selectData"
+          ref="SeeButton"
+          @success="useQuery(params, page)"
+        ></see-button>
+        <add-button
+          :size="size"
+          :dict="dict"
+          :select-data="selectData"
+          add-type="edit"
+          @success="useQuery(params, page)"
+        ></add-button>
+        <dele-button
+          :size="size"
+          :select-data="selectData"
+          @success="useQuery(params, page)"
+        ></dele-button>
+      </el-button-group>
+    </div>
+    <el-super-table
+      v-model="tableData"
+      :size="size"
+      :dict="dict"
+      :columns="TableColumns"
+      stroage
+      hideOperationColumns
+      @row-dblclick="useSee"
+      @selection-change="useSelect"
+    >
+      <!-- <el-table-column fixed width="55" align="center" label="#" prop="$index">
+      </el-table-column> -->
+      
+      <el-table-column fixed width="55" align="center" type="selection">
+      </el-table-column>
+    </el-super-table>
+    <pagination
+      :total="page.total"
+      :page.sync="page.pageNum"
+      :limit.sync="page.pageSize"
+      @pagination="useQuery(params, page)"
+      style="height: 32px; margin: 20px 0 0 0; padding: 0 !important"
+    />
+  </el-card>
+</template>
+<style scoped lang="scss">
+.el-card {
+  width: calc(100% - 20px);
+  height: 100%;
+  margin: 10px;
+  padding: 20px;
+}
+.el-button-group + .el-button-group {
+  margin: 0 0 0 10px;
+}
+</style>

src/views/business/spd/target/targetTemplate/see/columns.js

@@ -0,0 +1,110 @@
+import CONFIG from "@/config";
+
+export default function useColumns() {
+  const TableColumns = [
+    {
+      item: { key: "year", title: "年度" },
+      attr: {},
+    },
+    {
+      item: { key: "name", title: "模板名称" },
+      attr: {},
+    },
+    {
+      item: { key: "startTime", title: "开始日期" },
+      attr: {},
+    },
+    {
+      item: { key: "deadlineTime", title: "结束日期" },
+      attr: {},
+    },
+    {
+      item: { key: "cycle", title: "周期" },
+      attr: {
+        is: "el-dict-tag",
+        dictName: "mk_periodic_unit",
+      },
+    },
+    {
+      item: { key: "unfold", title: "按列展开" },
+      attr: {
+        is: "el-dict-tag",
+        dictName: "mk_expansion_mode",
+      },
+    },
+    
+   
+  ];
+
+  const TabColumns = [
+    {
+      item: {
+        title: "指标",
+        key: "indexs",
+      },
+      attr: {
+        value: [],
+      },
+      TableColumns: [
+        {
+          item: { key: "target", title: "指标" },
+          attr: {
+            is: "el-dict-tag",
+            dictName: "mk_index_type",
+          },
+        },
+      ],
+    },
+    {
+      item: {
+        title: "维度",
+        key: "dimensionalitys",
+      },
+      attr: {
+        value: [],
+      },
+      TableColumns: [
+        {
+          item: { key: "dimensionality", title: "维度" },
+          attr: {
+            is: "el-dict-tag",
+            dictName: "mk_dimensionality",
+          },
+        },
+      ],
+    },
+    {
+      item: {
+        title: "周期",
+        key: "cycles",
+      },
+      attr: {
+        value: [],
+      },
+      TableColumns: [
+        {
+          item: { key: "name", title: "周期名称", require: true },
+          attr: {},
+        },
+        {
+          item: {
+            key: "startTime",
+            title: "周期开始日期",
+            require: true,
+          },
+          attr: {},
+        },
+        {
+          item: {
+            key: "deadlineTime",
+            title: "周期结束日期",
+            require: true,
+          },
+          attr: {},
+        },
+      ],
+    },
+  ];
+
+  return { TableColumns, TabColumns };
+}

src/views/business/spd/target/targetTemplate/see/index.vue

@@ -0,0 +1,170 @@
+<script>
+import useColumns from "./columns";
+import { getTargetTemplate } from "@/api/business/spd/starget/targetTemplate";
+
+export default {
+  name: "SeeDrawer",
+  components: {
+    ElSuperDescriptions: () =>
+      import("@/components/super-descriptions/index.vue"),
+    ElSuperTable: () => import("@/components/super-table/index.vue"),
+  },
+  data() {
+    const {
+      TabColumns,
+      TableColumns,
+      TabColumns: [
+        {
+          item: { key: tabName },
+        },
+      ],
+    } = useColumns();
+    return {
+      width: "50%",
+      column: 2,
+      title: "明 细",
+      visible: false,
+      loading: false,
+      params: {},
+      tabName,
+      TabColumns: TabColumns,
+      TableColumns: TableColumns,
+    };
+  },
+  props: {
+    dict: {
+      type: Object,
+    },
+    model: {
+      type: Object,
+    },
+    selectData: {
+      type: [Array],
+      require: true,
+    },
+  },
+  computed: {
+    disabled: {
+      get() {
+        const { selectData } = this;
+        if (selectData.length !== 1) {
+          return true;
+        }
+      },
+      set() {},
+    },
+  },
+  watch: {},
+  methods: {
+    //
+    async fetchTemplate(id) {
+      try {
+        this.loading = true;
+        const { code, data } = await getTargetTemplate(id);
+        if (code === 200) {
+          this.params = data;
+          return true;
+        } else {
+          return false;
+        }
+      } catch (err) {
+        // catch
+        console.error(err);
+      } finally {
+        // finally
+        this.loading = false;
+      }
+    },
+    //
+    async open(prop) {
+      this.visible = await this.fetchTemplate(prop[0].id);
+    },
+    //
+    async hide() {
+      const {
+        TabColumns: [
+          {
+            item: { key: tabName },
+          },
+        ],
+      } = useColumns();
+      this.visible = false;
+      this.tabName = tabName;
+    },
+  },
+  created() {},
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<template>
+  <el-button
+    v-bind="$attrs"
+    v-on="$listeners"
+    :disabled="disabled"
+    @click="open"
+  >
+    {{ title }}
+    <el-drawer
+      :size="width"
+      :title="title"
+      :visible.sync="visible"
+      append-to-body
+      @close="hide(selectData)"
+    >
+      <div
+        style="
+          z-index: 6666;
+          position: fixed;
+          right: 20px;
+          top: 50%;
+          transform: translateY(-50%);
+          display: flex;
+          flex-direction: column;
+        "
+      >
+        <el-button
+          :size="$attrs.size"
+          :disabled="params.$index === 1"
+          circle
+          icon="el-icon-top"
+          @click="fetchItem(params.$index - 1)"
+          style="margin: 0 0 10px 0"
+        ></el-button>
+        <el-button
+          :size="$attrs.size"
+          :disabled="params.$index === params.$total"
+          circle
+          icon="el-icon-bottom"
+          @click="fetchItem(params.$index + 1)"
+          style="margin: 0"
+        ></el-button>
+      </div>
+      <el-super-descriptions
+        v-model="params"
+        :dict="dict"
+        :column="column"
+        :size="$attrs.size"
+        :columns="TableColumns"
+      >
+      </el-super-descriptions>
+      <el-tabs v-model="tabName" :size="$attrs.size" style="margin: 10px">
+        <el-tab-pane
+          v-for="({ item, TableColumns: columns }, index) in TabColumns"
+          :key="index"
+          :name="item.key"
+          :label="item.title"
+          lazy
+        >
+          <el-super-table
+            v-model="params[item.key]"
+            :size="$attrs.size"
+            :dict="dict"
+            :columns="columns"
+          >
+          </el-super-table>
+        </el-tab-pane>
+      </el-tabs>
+    </el-drawer>
+  </el-button>
+</template>