优化

src/api/assessment.js

@@ -44,3 +44,12 @@ export function apiResultRecordDetail (query) {
     params: query
   })
 }
+
+// 获取考核详情表格数据
+export function apiResultGetDetail (query) {
+  return request({
+    url: '/lz_management/user/lzresultrecord/getDetail',
+    method: 'get',
+    params: query
+  })
+}

src/components/InfoHeader/index.vue

@@ -5,14 +5,15 @@
               <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2346299354,1694591848&fm=26&gp=0.jpg" alt="">
             </div>
             <div class="header-title-right commonFont">
-              <span style="font-size:14px;">熊成强</span>
+              <span style="font-size:14px;">{{obj.name || "熊成强"}}</span>
-              <span style="font-size:12px;">技术部门</span>
+              <span style="font-size:12px;">{{obj.departmentName || "技术部门"}}</span>
             </div>
           </div>
 </template>
 
 <script>
 export default {
+  props: ['obj'],
   data () {
     return {
 

src/components/kpi-layout/index.vue

@@ -1,6 +1,6 @@
 <!--  -->
 <template>
-    <div class="main noSelect">
+    <div class="main">
         <nav-bar />
         <app-main />
     </div>

src/views/kpi/assessment/goals/index.vue

@@ -3,36 +3,203 @@
     <div class="goals">
         <SmallNav />
         <div class="goals-content boderAndRadius">
-          <InfoHeader />
+          <InfoHeader :obj="{
+            name:obj.currentApprovalStaffName,
+            departmentName:obj.departmentName
+          }"/>
           <div class="goals-content-tabbar">
-            <el-tabs v-model="activeName" @tab-click="handleClick">
+            <el-tabs
-              <el-tab-pane label="用户管理" name="first">用户管理</el-tab-pane>
+              :value="activeId"
-              <el-tab-pane label="配置管理" name="second">配置管理</el-tab-pane>
+              @tab-click="handleClick">
-              <el-tab-pane label="角色管理" name="third">角色管理</el-tab-pane>
+              <el-tab-pane
-              <el-tab-pane label="定时任务补偿" name="fourth">定时任务补偿</el-tab-pane>
+              v-for="(i,index) in obj.recortModelDtos"
+              :key="i.id"
+              :label="i.name"
+              :name="String(i.id)">
+                   <div  class="goals-content-tabbar-table">
+                  <div class="goals-content-tabbar-table-header commonFont">
+                    <span style="width:30%">指标名称</span>
+                    <span style="width:30%">考核标准</span>
+                    <span style="width:30%">权重</span>
+                    <span style="width:10%">操作</span>
+                  </div>
+                  <div
+                    style="justify-content:center;"
+                    v-if="handleFilter(i.detailDtos).length===0"
+                   class="goals-content-tabbar-table-content commonFont items">
+                    暂无指标
+                  </div>
+                  <draggable
+                    v-model="i.tagetLibItems"
+                    :options='options1'
+                    >
+                  <div
+                    class="goals-content-tabbar-table-content commonFont items"
+                    v-for="(j,indexJ) in handleFilter(i.detailDtos)"
+                    :key="indexJ"
+                    >
+                      <div style="width:30%">{{j.target}}</div>
+                      <div style="width:30%">{{j.keyResult}}</div>
+                      <div style="width:30%">{{j.checkWeight * 100}}%</div>
+                      <div style="width:10%">
+                            <el-button
+                          @click="hanidleEdit(j,indexJ,index)"
+                          type="text"
+                          size="small">
+                          编辑
+                        </el-button>
+                        <el-button
+                          @click="handleDelateWeidu(j,indexJ,index)"
+                          type="text"
+                          size="small">
+                          删除
+                        </el-button>
+                      </div>
+                  </div>
+                  </draggable>
+                  <div style=" padding: 10px;">
+                    <!-- <el-button size="mini"  plain>选择指标项</el-button> -->
+                    <el-button  @click="handleAddIndicators(i)" size="mini" plain>增加指标项</el-button>
+                  </div>
+                </div>
+              </el-tab-pane>
             </el-tabs>
           </div>
         </div>
+        <popup-right v-if="showIndicators" @cancel='handleCancelZhibiao' @submit="handleSubmitZhibiao" :title="zhibiaoTitle">
+            <div slot="content" class="weiduManage">
+              <el-form label-position="left" ref="formIndicators" :model="formIndicators" :rules="ruleIndicators" label-width="180px">
+                   <el-form-item label="指标类型">
+                     <el-select v-model="formIndicators.type"  disabled placeholder="请选择维度类型">
+                      <el-option
+                        v-for="i in dimensionsList"
+                        :key="i.id"
+                        :label="i.name"
+                        :value="i.id"></el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-form-item prop="target" label='指标名称'>
+                    <el-input clearable size="small" v-model="formIndicators.target"></el-input>
+                  </el-form-item>
+                   <el-form-item label="考核标准" prop="keyResult">
+                    <el-input size="small" clearable  type="textarea"  v-model="formIndicators.keyResult"></el-input>
+                  </el-form-item>
+                   <el-form-item label="权重" prop="weight">
+                     <el-input size="small" clearable  v-model="formIndicators.weight">
+                       <template slot="append">%</template>
+                     </el-input>
+                  </el-form-item>
+              </el-form>
+            </div>
+          </popup-right>
     </div>
 </template>
 
 <script>
 import SmallNav from '@/components/kpi-layout/SmallNav'
 import InfoHeader from '@/components/InfoHeader'
+import PopupRight from '@/components/PopupRight'
+import draggable from 'vuedraggable'
+import {getDimensions} from '@/api/data'
+import { apiResultGetDetail } from '@/api/assessment'
 export default {
   data () {
     return {
-      activeName: 'second'
+      zhibiaoTitle: '添加指标',
+      showIndicators: false,
+      dimensionsList: [],
+      formIndicators: {},
+      ruleIndicators: {
+        target: [{ required: true,
+          message: '请输入指标名称',
+          trigger: 'blur' }
+        ],
+        keyResult: [{ required: true,
+          message: '请输入考核标准',
+          trigger: 'blur' }
+        ],
+        weight: [{ required: true,
+          message: '请输入权重大小',
+          trigger: 'blur' }
+        ]
+      },
+      activeId: null,
+      obj: {
+        recortModelDto: []
+      },
+      options1: {
+        group: 'names',
+        draggable: '.items',
+        scroll: true,
+        sort: true, // 内部排序列表
+        delay: 0, // 以毫秒为单位定义排序何时开始。
+        touchStartThreshold: 0, // px,在取消延迟拖动事件之前，点应该移动多少像素?
+        disabled: false, // 如果设置为真，则禁用sortable。
+        store: null, // @see Store
+        animation: 150 // ms, 动画速度运动项目排序时，' 0 ' -没有动画。
+      }
     }
   },
   components: {
     SmallNav,
-    InfoHeader
+    InfoHeader,
+    draggable,
+    PopupRight
   },
   computed: {},
   beforeMount () {},
-  mounted () {},
+  mounted () {
+    this.handleGetDimensions()
+    this.handleGetTbale()
+  },
   methods: {
+    // 获取维度类型
+    async handleGetDimensions () {
+      try {
+        let res = await getDimensions()
+        if (res.code !== 200) {
+          this.dimensionsList = []
+          return
+        }
+        res = res.data
+        this.dimensionsList = res
+        console.log('res: ', res)
+      } catch (error) {
+        this.$message.error(error.msg)
+      }
+    },
+    handleCancelZhibiao () {
+
+    },
+    handleSubmitZhibiao () {
+
+    },
+    handleAddIndicators (item) {
+      console.log(item)
+      this.showIndicators = true
+      this.formIndicators = Object.assign({}, item)
+    },
+    // 编辑
+    hanidleEdit (item, index, type) {
+      console.log('type: ', type)
+      console.log('index: ', index)
+      console.log('item: ', item)
+    },
+    handleDelateWeidu (item, index, type) {
+      console.log('type: ', type)
+      console.log('index: ', index)
+      console.log('item: ', item)
+    },
+    handleFilter (item) {
+      return item ? item.filter(i => !i.isDelete) : []
+    },
+    async handleGetTbale (id = 226) {
+      let res = await apiResultGetDetail({id})
+      if (res.code !== 200) return
+      this.obj = res.data
+      this.activeId = String(res.data.recortModelDtos[0].id)
+      console.log('res: ', res)
+    },
     handleClick (tab, event) {
       console.log(tab, event)
     }
@@ -68,7 +235,29 @@ export default {
       }
     }
     &-tabbar{
-
+      &-table{
+        &-header{
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          height: 60px;
+          background: rgb(231, 231, 231);
+          border-bottom: 1px solid @borderColor;
+          span{
+            padding:0 0 0 20px;
+          }
+        }
+        &-content{
+           display: flex;
+            align-items: center;
+          height: 60px;
+          border-bottom: 1px solid @borderColor;
+          justify-content: space-between;
+          div{
+            padding:0 0 0 20px;
+          }
+        }
+      }
     }
   }
 }

src/views/kpi/assessment/performance/components/table.vue

@@ -0,0 +1,85 @@
+<template>
+    <table
+        cellspacing="0"
+        border="1">
+        <!-- 顶部title -->
+        <tr>
+            <th>维度</th>
+            <th>名称</th>
+            <th>考核标准</th>
+            <th>权重({{obj.weight*100}}%)</th>
+        </tr>
+        <!-- 暂无数据时显示 -->
+        <tr v-if="obj.recortModelDtos.length === 0">
+                <td :colspan="6">
+                    暂无数据
+                </td>
+        </tr>
+        <!-- template不会被渲染 -->
+        <template v-for="(item,index) in obj.recortModelDtos" >
+            <!-- 左侧跨行区域 -->
+            <tr :key="index+1000">
+                <td :rowspan="item.detailDtos.length+1">{{item.name}}</td>
+                <td v-if="item.detailDtos.length===0">
+
+                </td>
+                <td v-if="item.detailDtos.length===0">
+
+                </td>
+                <td v-if="item.detailDtos.length===0">
+
+                </td>
+            </tr>
+            <!-- 右侧数据 -->
+            <tr v-for="(child,index1) in item.detailDtos" :key="index1">
+                <td>
+                    {{child.target}}
+                </td>
+                <td>
+                    {{child.keyResult}}
+                </td>
+                <td>
+                    {{child.checkWeight*100}}%
+                </td>
+            </tr>
+        </template>
+    </table>
+</template>
+<script>
+export default {
+  name: 'columnsTbale',
+  props: {
+    obj: {
+      type: Object,
+      default: () => {
+        return {
+          recortModelDtos: []
+        }
+      }
+    }
+  },
+  mounted () {
+    console.log('list', this.obj)
+  },
+  methods: {
+  }
+}
+</script>
+<style scoped>
+    table{
+        margin-top: 15px;
+        width: 100%;
+        border:1px solid #e9eaec;
+        border-collapse:collapse
+    }
+    th{
+        background-color: #f8f8f9;
+    }
+    th,td{
+        padding: 5px;
+        border: 1px solid #e9eaec;
+        text-align: center;
+        vertical-align: top;
+        line-height: 30px;
+    }
+</style>

src/views/kpi/assessment/performance/index.vue

@@ -19,7 +19,17 @@
                <el-button size="small" plain>管理</el-button>
             </div>
           </div> -->
-           <InfoHeader />
+           <div class="performance-content-title">
+             <InfoHeader
+              :obj="{
+                name:obj.currentApprovalStaffName,
+                departmentName:obj.departmentName
+                }"
+              />
+             <div class="performance-content-title-right">
+               <el-button size="mini" @click="handleZhiding" type="primary">制定目标</el-button>
+             </div>
+           </div>
           <div class="performance-content-center">
               <div class="performance-content-center-item"
                 :class="{
@@ -47,34 +57,7 @@
               </div>
           </div>
           <div class="performance-content-bottom">
-              <el-table
+            <tables v-if="obj.length !==0" :obj='obj' />
-                :data="tableData"
-                :header-cell-style="{background:'#F5F7FA'}"
-                border
-                style="width: 100%">
-                <el-table-column
-                  prop="date"
-                  label="日期"
-                  align="center"
-                  width="180">
-                  <template slot-scope="scope">
-                    <div>
-                      <div v-for="(i,index) in scope.row.date" :key="index">{{i}}</div>
-                    </div>
-                  </template>
-                </el-table-column>
-                <el-table-column
-                  prop="name"
-                  label="姓名"
-                  align="center"
-                  width="180">
-                </el-table-column>
-                <el-table-column
-                  prop="address"
-                  align="center"
-                  label="地址">
-                </el-table-column>
-              </el-table>
           </div>
           <div class="performance-content-jilu">
             <div class="performance-content-jilu-title commonFont">
@@ -118,7 +101,8 @@
 import SmallNav from '@/components/kpi-layout/SmallNav'
 import InfoHeader from '@/components/InfoHeader'
 import PopupRight from '@/components/PopupRight'
-import { apiResultRecordDetail } from '@/api/assessment'
+import { apiResultRecordDetail, apiResultGetDetail } from '@/api/assessment'
+import tables from './components/table'
 
 export default {
   data () {
@@ -131,6 +115,9 @@ export default {
         flowRecordList: [],
         resultCommentList: []
       },
+      obj: {
+        recortModelDtos: []
+      },
       options: [{
         value: '选项1',
         label: '黄金糕'
@@ -146,37 +133,36 @@ export default {
       }, {
         value: '选项5',
         label: '北京烤鸭'
-      }],
-      tableData: [{
-        date: '2016-05-02',
-        name: '王小虎',
-        address: '上海市普陀区金沙江路 1518 弄'
-      }, {
-        date: '2016-05-04',
-        name: '王小虎',
-        address: '上海市普陀区金沙江路 1517 弄'
-      }, {
-        date: '2016-05-01',
-        name: '王小虎',
-        address: '上海市普陀区金沙江路 1519 弄'
-      }, {
-        date: '2016-05-03',
-        name: '王小虎',
-        address: '上海市普陀区金沙江路 1516 弄'
       }]
     }
   },
   components: {
     SmallNav,
     InfoHeader,
-    PopupRight
+    PopupRight,
+    tables
   },
   computed: {},
   beforeMount () {},
   mounted () {
     this.handleList()
+    this.handleGetTbale()
   },
   methods: {
+    // 制定目标
+    handleZhiding () {
+      this.$router.push({
+        name: 'assessment-goals',
+        query: {
+          id: this.$route.query.id
+        }
+      })
+    },
+    async handleGetTbale (id = 226) {
+      let res = await apiResultGetDetail({id})
+      this.obj = res.data
+      console.log('res: ', res)
+    },
     handleRight (item) {
       console.log('item: ', item)
       this.form.item = item
@@ -189,6 +175,7 @@ export default {
       this.right.showRight = false
     },
     async handleList () {
+      // resultRecordId = == this.$route.query.id
       let res = await apiResultRecordDetail({resultRecordId: 215})
       if (res.code !== 200) return
       for (let i in res.data.flowRecordList) {
@@ -232,10 +219,16 @@ export default {
       justify-content: space-between;
       align-items: center;
     }
+    &-title{
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+    }
     &-center{
       display: flex;
       flex-wrap: wrap;
       margin: 20px 0;
+
       &-item{
         text-align: center;
         padding: 10px 60px;

src/views/kpi/assessment/stepList/index.vue

@@ -188,7 +188,6 @@ export default {
       }
       this.rightList = res.data.list
       this.kaopingFrom.showRight = true
-      console.log('ressss: ', res)
     },
     handleLook (id) {
       // this.handleKaoping()

src/views/kpi/workbench/assessmentGroup/edit/components/templateSet.vue

@@ -236,7 +236,7 @@ export default {
       formIndicators: {}, // 指标表单
       ruleIndicators: {
         name: [{ required: true,
-          message: '请输入维度名称',
+          message: '请输入指标名称',
           trigger: 'blur' }
         ],
         keyResult: [{ required: true,
@@ -316,7 +316,12 @@ export default {
     // 获取维度类型
     async handleGetDimensions () {
       try {
-        const res = await getDimensions()
+        let res = await getDimensions()
+        if (res.code !== 200) {
+          this.dimensionsList = []
+          return
+        }
+        res = res.data
         this.dimensionsList = res
         console.log('res: ', res)
       } catch (error) {
@@ -368,7 +373,7 @@ export default {
       } else {
         this.zhibiaoTitle = '编辑指标'
         this.formIndicators = Object.assign({}, item, {index, index2: type, isEdit: true})
-        this.formIndicators.weight = this.formIndicators.weight
+        this.formIndicators.weight = this.formIndicators.weight * 100
         this.showIndicators = true
       }
     },
@@ -409,7 +414,7 @@ export default {
           }
           if (!this.zanshi.tagetLibItems) this.zanshi.tagetLibItems = []
           this.zanshi.tagetLibItems.push(Object.assign({}, this.formIndicators, {isDelete: 0}))
-          // this.showIndicators = false
+          this.showIndicators = false
         }
       })
     }

src/views/kpi/workbench/assessmentGroup/edit/index.vue

@@ -54,6 +54,10 @@ export default {
   },
   computed: {},
   beforeMount () {},
+  created () {
+    const id = this.$route.query.id
+    this.$route.meta.title = !id ? '新增考评组' : '编辑考评组'
+  },
   mounted () {
 
   },
@@ -135,6 +139,7 @@ export default {
     overflow: auto;
   }
   &-header{
+    cursor: pointer;
     position: absolute;
     z-index: 50;
     width: 420px;