优化

src/api/assessment.js

@@ -146,15 +146,15 @@ export function apiChangeTaskList (query) {
 export function apiAddTaskComment (query) {
   return request({
     url: '/lz_management/user/lzstaffrole/task/comment',
-    method: 'post',
+    method: 'get',
-    data: query
+    params: query
   })
 }
 //  评论列表
 export function apiTaskCommentList (query) {
   return request({
     url: '/lz_management/user/lzstaffrole/comment/list',
-    method: 'post',
+    method: 'get',
-    data: query
+    params: query
   })
 }

src/utils/elementConfig.js

@@ -38,14 +38,15 @@ import {
   Transfer,
   Avatar,
   Progress,
-  Drawer
+  Drawer,
+  Slider
 } from 'element-ui'
 
 Vue.prototype.$loading = Loading
 Vue.prototype.$message = Message
 Vue.prototype.$confirm = MessageBox.confirm
 Vue.prototype.$alert = MessageBox.alert
-
+Vue.use(Slider)
 Vue.use(Drawer)
 Vue.use(Progress)
 Vue.use(Transfer)

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

@@ -6,15 +6,15 @@
          :key="i.id"
          v-for="i in pinglunList">
       <div class="pinglunTem-left">
-        <img :src="i.avatar"
+        <img :onerror="defaultImg"
+              :src='i.avatar || defaultImg'
              alt="">
       </div>
       <div class="pinglunTem-right">
         <div class="pinglunTem-right-title">
           <div><span>{{i.staffName}}</span><span class="beizhu">#
-              <span v-if="i.type===1">修改名称</span>
+              <span v-if="i.type===1">更新名称</span>
-              <span v-if="i.type===2">修改进度</span>
+              {{i.typeDesc}}
-              <span v-if="i.type===3">名称和进度都修改</span>
               #</span></div>
           <div style="font-size:12px;">{{i.gmtCreate}}</div>
         </div>
@@ -38,7 +38,7 @@ export default {
   // 1，修改名称，2修改进度 ，3名称和进度都修改
   data () {
     return {
-
+      defaultImg: 'this.src="' + require('@/assets/img/default.jpg') + '"'
     }
   },
   computed: {
@@ -58,11 +58,11 @@ export default {
     margin: 20px 0;
   }
   &-left {
-    width: 40px;
+    width: 30px;
     margin: 0 10px 0 0;
     img {
-      width: 40px;
+      width: 30px;
-      height: 40px;
+      height: 30px;
       border-radius: 50%;
     }
   }

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

@@ -72,7 +72,7 @@
                                 effect="dark"
                                 content="评论"
                                 placement="top-start">
-                      <i class="el-icon-chat-square"></i>
+                      <i @click="handleAddPinglun(i)" class="el-icon-chat-square"></i>
                     </el-tooltip>
                   </div>
                   <div>
@@ -93,7 +93,7 @@
                 </div>
               </div>
             </div>
-            <div v-if="!i.updateProcess && i.label"
+            <div v-if="!i.updateProcess && i.typeDesc"
                  class="drawer-content-left-content-center"
                  :class="{bg:i.showTask}">
               <div class="content commonFont">
@@ -105,7 +105,7 @@
                   <span v-if="!i.showTask">{{i.staffName}}:</span>
                   <span class="label"
                         style="word-wrap:break-word;"
-                        v-if="!i.showTask">{{i.label}}</span>
+                        v-if="!i.showTask">{{i.typeDesc}}</span>
                 </div>
                 <div style="user-select:none;">
                   <i :class="{rate:!i.showTask}"
@@ -124,17 +124,23 @@
                        label-width="80px">
                 <el-form-item label="当前进度:"
                               prop="weight">
-                  <el-input size="small"
+                              <el-slider
+                                v-model="form.processRate"
+                                :step="10">
+                              </el-slider>
+
+                  <!-- <el-input size="small"
                             @blur="$handleBlur('form.processRate')"
                             @input.native="$handleInputInt('form.processRate')"
                             v-model="form.processRate">
                     <template slot="append">%</template>
-                  </el-input>
+                  </el-input> -->
                 </el-form-item>
                 <el-form-item label="进度说明:"
                               prop="remake">
                   <el-input type="textarea"
                             size="small"
+                            placeholder="请输入进度说明"
                             v-model="form.remake">
                   </el-input>
                 </el-form-item>
@@ -164,18 +170,26 @@
           </div>
           <div v-if="activeName==='1'"
                class="drawer-content-right-item pinglun">
-            <div class="pinglun-top">
+            <div class="pinglun-top" ref="pingList">
-              <pinglun :pinglunList='pinglunList' />
+              <pinglun :pinglunList='nowPingLunList' />
 
             </div>
             <div class="pinglun-bottom">
+              <div v-if="pinglunForm.id" class="pinglun-bottom-content top">
+                <div>评论KR：「{{pinglunForm.name}}」</div>
+                <i @click="pinglunForm={}" class="el-icon-circle-close"> </i>
+                </div>
+              <div class="pinglun-bottom-content">
                 <el-input type="textarea"
+                          clearable
                         placeholder="请输入评论内容"
-                        v-model="form.desc"></el-input>
+                        v-model="form.content"></el-input>
               <el-button size="small"
+                         @click="handleSendPingLun"
                          type="primary">发送</el-button>
                          </div>
             </div>
+          </div>
           <div v-if="activeName==='2'"
                class="drawer-content-right-item jilu">
             <pinglun :pinglunList='pinglunList' />
@@ -251,7 +265,9 @@ export default {
         name: '',
         processRate: '0'
       },
+      pinglunForm: {},
       pinglunList: [],
+      nowPingLunList: [],
       dialogFormVisible: false,
       title: '添加任务',
       defaultImg: 'this.src="' + require('@/assets/img/default.jpg') + '"'
@@ -263,9 +279,44 @@ export default {
   mounted () {
     this.taskInfo = Object.assign({}, this.taskObj)
     this.handleGetChangeTaskList()
+    this.handleGetPingLunList()
     console.log(this.taskInfo)
   },
   methods: {
+    async handleGetPingLunList () {
+      const params = {
+        currPage: 1,
+        detailId: this.taskInfo.detailId,
+        pageSize: 2300
+      }
+      let res = await apiTaskCommentList(params)
+      if (res.code !== 200) {
+        this.$message.error(res.msg)
+      }
+      this.nowPingLunList = res.data.list
+      const pingList = this.$refs.pingList
+      pingList.scrollTop = pingList.scrollHeight
+    },
+    // 发送评论
+    async handleSendPingLun () {
+      let params = {}
+      // debugger
+      if (!this.form.content) return
+      params.content = this.form.content
+      params[this.pinglunForm.id ? 'taskId' : 'detailId'] = this.pinglunForm.id ? this.pinglunForm.id : this.taskInfo.detailId
+      let res = await apiAddTaskComment(params)
+      if (res.code !== 200) {
+        this.$message.error(res.msg)
+      }
+      this.handleGetPingLunList()
+      this.form.content = ''
+    },
+    // 对任务添加评论
+    handleAddPinglun (item) {
+      this.pinglunForm = Object.assign({}, item)
+      const pingList = this.$refs.pingList
+      pingList.scrollTop = pingList.scrollHeight
+    },
     // 获取当前任务的评论
     async handleShowAll (i) {
       if (i.showTask) {
@@ -489,17 +540,18 @@ export default {
             width: 400px;
           }
           .content {
+            flex:1;
             display: flex;
-            align-content: center;
+            align-items: center;
             justify-content: space-between;
-            > div {
+            // > div {
-              flex-shrink: 0;
+            //   flex-shrink: 0;
-            }
+            // }
           }
           &-left {
-            flex: 1 0 auto;
+            flex: 1 ;
             display: flex;
-            align-content: center;
+            align-items: center;
             img {
               width: 28px;
               height: 28px;
@@ -507,9 +559,6 @@ export default {
               overflow: hidden;
               margin-right: 10px;
             }
-            span {
-              .center();
-            }
           }
         }
         &-bottom {
@@ -539,18 +588,27 @@ export default {
         }
         &-bottom {
           width: 100%;
-          height: 60px;
           border-top: 1px solid @borderColor;
+          .top{
+             border-bottom: 1px solid @borderColor;
+          }
+          &-content{
+            padding: 6px 8px;
             display: flex;
             background: #fff;
-          align-content: center;
+            align-items: center;
             justify-content: space-between;
-          padding: 6px 4px;
+            i{
+              cursor: pointer;
+            }
+          }
           textarea {
             resize: none;
             height: 46px;
             font-size: 12px;
             background: #f6f6f6;
+            border:none;
+
           }
           .el-button--small {
             height: 46px;