From 77670ad094fc352fb112d56fc1fff6a95c564eb8 Mon Sep 17 00:00:00 2001
From: leave <>
Date: Wed, 28 Oct 2020 20:40:42 +0800
Subject: [PATCH] no message

---
 .../kpi/assessment/performance/index.vue      | 261 +++++++++++-------
 1 file changed, 154 insertions(+), 107 deletions(-)

diff --git a/src/views/kpi/assessment/performance/index.vue b/src/views/kpi/assessment/performance/index.vue
index 72e9a6c..2dace9d 100644
--- a/src/views/kpi/assessment/performance/index.vue
+++ b/src/views/kpi/assessment/performance/index.vue
@@ -1,9 +1,9 @@
 <!--  -->
 <template>
-    <div class="performance">
-        <SmallNav />
-        <div class="performance-content boderAndRadius">
-          <!-- <div class="performance-content-top">
+  <div class="performance">
+    <SmallNav />
+    <div class="performance-content boderAndRadius">
+      <!-- <div class="performance-content-top">
             <div class="performance-content-top-left">
                <el-select size="small" v-model="form.value" placeholder="请选择">
                   <el-option
@@ -19,82 +19,129 @@
                <el-button size="small" plain>管理</el-button>
             </div>
           </div> -->
-           <div class="performance-content-title">
-             <InfoHeader
-              :obj="{
+      <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="{
+                }" />
+        <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="{
                   active:i.isActive,
                   right:true,
                   left:index !==0
                 }"
-                v-for="(i,index) in formList.flowRecordList"
-                :key="index"
-                >
-                 <el-tooltip v-if="i.flowName !== '执行中'" class="item" effect="dark" :content="(index >= (formList.flowRecordList.length-1))?i.flowName:i.flowName +' : '+i.staffName" placement="top">
-                  <div >
-                    {{index+1}}.{{i.flowName}} <span v-if="index !== (formList.flowRecordList.length-1)">:{{i.staffName}} <i v-if="i.status ===1 && !i.isActive" style="color:#3ba1ff;margin:0 0 0 4px;font-weight:800;" class="el-icon-check"></i></span>
-                    <i style="cursor: pointer;" @click="handleRight(i)" class="el-icon-video-pause"></i>
-                  </div>
-                </el-tooltip>
-                <el-tooltip v-if="i.flowName === '执行中'" class="item" effect="dark" placement="top">
-                  <div slot="content">执行中”是员工在目标确认后，努力达成目标的一个过程，直到管理员发起评分。<br/>管理员如何发起评分：返回上级页面<考核详情>，点击"开始评分"按钮发起。</div>
-                  <div>
-                    {{index+1}}.{{i.flowName}}<i class="el-icon-warning-outline" />:{{i.staffName}} <i v-if="i.status ===1 && !i.isActive" style="color:#3ba1ff;margin:0 0 0 4px;font-weight:800;" class="el-icon-check"></i>
-                     <i style="cursor: pointer;" @click="handleRight(i)" class="el-icon-video-pause"></i>
-                  </div>
-                </el-tooltip>
-
-              </div>
-          </div>
-          <div class="performance-content-bottom">
-            <tables v-if="obj.length !==0" :obj='obj' />
-          </div>
-          <div class="performance-content-jilu">
-            <div class="performance-content-jilu-title commonFont">
-              记录
+          v-for="(i,index) in formList.flowRecordList"
+          :key="index"
+        >
+          <el-tooltip
+            v-if="i.flowName !== '执行中'"
+            class="item"
+            effect="dark"
+            :content="(index >= (formList.flowRecordList.length-1))?i.flowName:i.flowName +' : '+i.staffName"
+            placement="top"
+          >
+            <div>
+              {{index+1}}.{{i.flowName}} <span v-if="index !== (formList.flowRecordList.length-1)">:{{i.staffName}} <i
+                  v-if="i.status ===1 && !i.isActive"
+                  style="color:#3ba1ff;margin:0 0 0 4px;font-weight:800;"
+                  class="el-icon-check"
+                ></i></span>
+              <i
+                style="cursor: pointer;"
+                @click="handleRight(i)"
+                class="el-icon-video-pause"
+              ></i>
             </div>
-            <div
-              v-for="(i,index) in formList.resultCommentList"
-              :key="index"
-              class="performance-content-jilu-item commonFont">
-                <div class="performance-content-jilu-item-time">
-                  {{i.gmtCreate}}
-                </div>
-                <div class="performance-content-jilu-item-content">
-                  <div class="performance-content-jilu-item-content-img">
-                    <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2346299354,1694591848&fm=26&gp=0.jpg" alt="">
-                  </div>
-                  <div>
-                      <span>{{i.staffName}}</span><span class="mubiao">#{{i.optDesc}}#</span>
-                  </div>
-                </div>
+          </el-tooltip>
+          <el-tooltip
+            v-if="i.flowName === '执行中'"
+            class="item"
+            effect="dark"
+            placement="top"
+          >
+            <div slot="content">执行中”是员工在目标确认后，努力达成目标的一个过程，直到管理员发起评分。<br />管理员如何发起评分：返回上级页面&lt;考核详情&gt;，点击"开始评分"按钮发起。</div>
+            <div>
+              {{index+1}}.{{i.flowName}}<i class="el-icon-warning-outline" />:{{i.staffName}} <i
+                v-if="i.status ===1 && !i.isActive"
+                style="color:#3ba1ff;margin:0 0 0 4px;font-weight:800;"
+                class="el-icon-check"
+              ></i>
+              <i
+                style="cursor: pointer;"
+                @click="handleRight(i)"
+                class="el-icon-video-pause"
+              ></i>
+            </div>
+          </el-tooltip>
+
+        </div>
+      </div>
+      <div class="performance-content-bottom">
+        <tables
+          v-if="obj.length !==0"
+          :obj='obj'
+        />
+      </div>
+      <div class="performance-content-jilu">
+        <div class="performance-content-jilu-title commonFont">
+          记录
+        </div>
+        <div
+          v-for="(i,index) in formList.resultCommentList"
+          :key="index"
+          class="performance-content-jilu-item commonFont"
+        >
+          <div class="performance-content-jilu-item-time">
+            {{i.gmtCreate}}
+          </div>
+          <div class="performance-content-jilu-item-content">
+            <div class="performance-content-jilu-item-content-img">
+              <img
+                src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2346299354,1694591848&fm=26&gp=0.jpg"
+                alt=""
+              >
+            </div>
+            <div>
+              <span>{{i.staffName}}</span><span class="mubiao">#{{i.optDesc}}#</span>
             </div>
           </div>
         </div>
-        <popup-right v-if="right.showRight" @cancel='handleCancel' @submit="handleSubmit" :footer='true' :title="form.item.flowName">
-            <div slot="content" class="chooseManage">
-              <div
-                class='chooseManage-item'
-                :key="index"
-                v-for="(i,index) in form.item.flowDetailRespList">
-                {{i}}
-              </div>
-              <!-- <div v-for="i in rightList" :key="i.id" class="chooseManage-item" >
+      </div>
+    </div>
+    <popup-right
+      v-if="right.showRight"
+      @cancel='handleCancel'
+      @submit="handleSubmit"
+      :footer='true'
+      :title="form.item.flowName"
+    >
+      <div
+        slot="content"
+        class="chooseManage"
+      >
+        <div
+          class='chooseManage-item'
+          :key="index"
+          v-for="(i,index) in form.item.flowDetailRespList"
+        >
+          {{i}}
+        </div>
+        <!-- <div v-for="i in rightList" :key="i.id" class="chooseManage-item" >
                   <el-checkbox :true-label='1' :false-label='0' :disabled='i.isDisable===1' :checked='i.isDisable===1' v-model='i.isSelect'></el-checkbox><span class='commonFont' style="margin:0 0 0 10px;">{{i.staffName}} </span>
               </div> -->
-            </div>
-          </popup-right>
-    </div>
+      </div>
+    </popup-right>
+  </div>
 </template>
 
 <script>
@@ -143,7 +190,7 @@ export default {
     tables
   },
   computed: {},
-  beforeMount () {},
+  beforeMount () { },
   mounted () {
     this.handleList()
     this.handleGetTbale()
@@ -159,7 +206,7 @@ export default {
       })
     },
     async handleGetTbale (id = 226) {
-      let res = await apiResultGetDetail({id})
+      let res = await apiResultGetDetail({ id })
       this.obj = res.data
       console.log('res: ', res)
     },
@@ -176,7 +223,7 @@ export default {
     },
     async handleList () {
       // resultRecordId = == this.$route.query.id
-      let res = await apiResultRecordDetail({resultRecordId: 215})
+      let res = await apiResultRecordDetail({ resultRecordId: 215 })
       if (res.code !== 200) return
       for (let i in res.data.flowRecordList) {
         if (res.data.flowRecordList[i].status !== 1) {
@@ -199,19 +246,19 @@ export default {
 </script>
 
 <style lang='less' scoped>
-.performance{
+.performance {
   overflow: auto;
-  .chooseManage-item{
+  .chooseManage-item {
     padding: 24px 0;
     border-bottom: 1px solid @borderColor;
   }
-  &-content{
+  &-content {
     padding: 28px;
     margin: 10px 0;
     // height: 700px;
     // overflow: auto;
 
-    &-top{
+    &-top {
       border-bottom: 1px solid @borderColor;
       padding-bottom: 20px;
       margin-bottom: 20px;
@@ -219,17 +266,17 @@ export default {
       justify-content: space-between;
       align-items: center;
     }
-    &-title{
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
+    &-title {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
     }
-    &-center{
+    &-center {
       display: flex;
       flex-wrap: wrap;
       margin: 20px 0;
 
-      &-item{
+      &-item {
         text-align: center;
         padding: 10px 60px;
         margin: 4px 0;
@@ -238,11 +285,11 @@ export default {
         background: #f5f5f5;
         position: relative;
       }
-      .active{
+      .active {
         background: @fontBlue;
         color: #fff;
       }
-      .left::before{
+      .left::before {
         content: "";
         width: 20px;
         height: 100%;
@@ -252,7 +299,7 @@ export default {
         background: url(./img/left.png) no-repeat;
         background-size: 100% 100%;
       }
-      .right::after{
+      .right::after {
         content: "";
         width: 20px;
         height: 100%;
@@ -263,49 +310,49 @@ export default {
         background-size: 100% 100%;
       }
     }
-    &-jilu{
-      &-title{
+    &-jilu {
+      &-title {
         padding: 20px 0 10px 0;
       }
-      &-item{
+      &-item {
         padding: 0 0 0 10px;
-        &-time{
+        &-time {
           margin: 4px 0;
           font-size: 14px;
           position: relative;
         }
-         &-time::before{
-           position: absolute;
-           left: -16px;
-           top: 0;
-           content: "";
-           bottom: 0;
-           margin: auto;
-           width: 10px;
-           height: 10px;
-           background: @fontBlue;
-           overflow: hidden;
-           border-radius: 50%;
-         }
-        &-content{
-          padding:0 0 0 10px;
+        &-time::before {
+          position: absolute;
+          left: -16px;
+          top: 0;
+          content: "";
+          bottom: 0;
+          margin: auto;
+          width: 10px;
+          height: 10px;
+          background: @fontBlue;
+          overflow: hidden;
+          border-radius: 50%;
+        }
+        &-content {
+          padding: 0 0 0 10px;
           display: flex;
           min-height: 60px;
           align-items: center;
-          span{
+          span {
             font-size: 14px;
           }
-          .mubiao{
+          .mubiao {
             color: @fontBlue;
             margin: 0 4px;
           }
-          &-img{
+          &-img {
             width: 30px;
             height: 30px;
             border-radius: 50%;
             overflow: hidden;
             margin-right: 10px;
-            img{
+            img {
               width: 100%;
               height: 100%;
             }