待办任务任务描述换成项目阶段，解决两行显示的问题

fhKeeper/formulahousekeeper/timesheet/config/index.js

@@ -5,7 +5,7 @@ var path = require('path')
 
  
 // var ip = '47.100.37.243'
-var ip = '192.168.2.14'
+var ip = '192.168.2.21'
 
 // var os = require('os'), ip = '', ifaces = os.networkInterfaces() // 获取本机ip
 // for (var i in ifaces) {

fhKeeper/formulahousekeeper/timesheet/src/views/task/list.vue

@@ -30,7 +30,7 @@
                     <p :class="idx == 2 ? 'on' : ''" @click="switchs(2)">我创建的</p>
                 </div>
             </div>
-            <div style="width: 94%">
+            <div style="max-width: 94%;min-width: 90%">
                 <!--列表-->
                 <el-table :data="list" highlight-current-row v-loading="listLoading" :height="tableHeight" style="width: 100%;">
                     <el-table-column type="index" width="60">
@@ -38,25 +38,31 @@
                                 {{scope.$index+1+(page-1)*size}} 
                             </template>
                     </el-table-column>
-                    <el-table-column prop="name" label="任务名称" sortable width="350"></el-table-column>
+                    <el-table-column prop="name" label="任务名称" sortable width="350">
+                        <template slot-scope="scope">
+                            <el-popover trigger="hover" placement="top" width="350" v-if="scope.row.name">
+                            <p id="caseContent">{{scope.row.name}}</p>
+                            <div slot="reference" class="name-wrapper">
+                                <div class="cal">{{scope.row.name}}</div>
+                            </div>
+                            </el-popover>
+                        </template>
+                    </el-table-column>
                     <el-table-column prop="projectName" label="项目名称" sortable width="350"></el-table-column>
                     <el-table-column prop="executorName" label="负责人" sortable width="250">
                         <template slot-scope="scope">
                             <el-link type="primary" @click="showUser(scope.row.executorId)">{{scope.row.executorName}}</el-link>
                         </template>
                     </el-table-column>
-                    <el-table-column prop="taskDesc" label="任务描述" sortable width="350">
+                    <el-table-column prop="stagesName" label="项目阶段" sortable width="350" @mouseover="mouseOver">
                         <!-- <template slot-scope="scope">
-                            <div class="acl"><span v-html='scope.row.taskDesc'></span></div>
-                        </template> -->
-                        <template slot-scope="scope">
-                            <el-popover trigger="hover" placement="top" width="450" v-if="scope.row.taskDesc">
+                            <el-popover trigger="click" placement="top" width="450" v-if="scope.row.taskDesc">
                             <p v-html='scope.row.taskDesc'></p>
                             <div slot="reference" class="name-wrapper">
                                 <div class="acl" v-html='scope.row.taskDesc'></div>
                             </div>
                             </el-popover>
-                        </template>
+                        </template> -->
                     </el-table-column>
                     <el-table-column prop="createDate" label="创建时间" sortable width="250"></el-table-column>
                     <el-table-column label="截止时间" width="290" fixed="right">
@@ -172,6 +178,49 @@
 .line span:nth-child(even){
     float:right;
 }
+.classification {
+    width: 120px;
+    border-right: 1px solid #f2f2f2;
+    display: flex;
+    flex-wrap: wrap;
+    padding-top: 20px;
+}
+.classification p{
+    width: 120px;
+    text-align: center;
+    line-height: 50px;
+    margin: 0;
+    cursor: pointer;
+}
+.classification p:hover {
+    background: #dddddd;
+}
+.on {
+    color: #409EFF;
+}
+.acl{
+    display: inline-block;
+    width: 300px;
+    height: 22px;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    display: flex;
+    align-items: center;
+    margin: 0;
+    padding: 0;
+    line-height: 0;
+}
+.cal {
+    width: 300px;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    cursor: pointer;
+}
+/* p {
+    margin: 0 !important;
+} */
 </style>
 <script>
 import { error } from 'dingtalk-jsapi';
@@ -541,12 +590,14 @@ import { error } from 'dingtalk-jsapi';
             // 切换当前选项的索引
             switchs(e) {
                 this.idx = e
+                this.page = 1
                 console.log(this.searchField)
                 this.getList()
             },
             // 下拉框选择
             hiddens() {
                 console.log(this.searchField)
+                this.page = 1
                 this.getList()
             },
             // 完成
@@ -577,7 +628,7 @@ import { error } from 'dingtalk-jsapi';
                     });
                 }
                 )
-            }
+            },
         },
         created() {
             let height = window.innerHeight;
@@ -590,43 +641,52 @@ import { error } from 'dingtalk-jsapi';
         mounted() {
             this.getList();
             this.getUsers();
-        }
+        },
     };
 </script>
 
 <style lang="scss" scoped>
-.classification {
-    width: 120px;
-    // height: 100%;
-    border-right: 1px solid #f2f2f2;
-    display: flex;
-    flex-wrap: wrap;
-    // align-items: center;
-    // justify-content: center;
-    padding-top: 20px;
-}
-.classification p{
-    width: 120px;
-    text-align: center;
-    line-height: 50px;
-    margin: 0;
-    cursor: pointer;
-}
-.classification p:hover {
-    background: #dddddd;
-}
-.on {
-    // background: #dddddd;
-    color: #409EFF;
-}
-.acl{
-    display: inline-block;
-    width: 300px;
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    margin: 0;
-    padding: 0;
-    line-height: 0;
-}
+// .classification {
+//     width: 120px;
+//     // height: 100%;
+//     border-right: 1px solid #f2f2f2;
+//     display: flex;
+//     flex-wrap: wrap;
+//     // align-items: center;
+//     // justify-content: center;
+//     padding-top: 20px;
+// }
+// .classification p{
+//     width: 120px;
+//     text-align: center;
+//     line-height: 50px;
+//     margin: 0;
+//     cursor: pointer;
+// }
+// .classification p:hover {
+//     background: #dddddd;
+// }
+// .on {
+//     // background: #dddddd;
+//     color: #409EFF;
+// }
+// .acl{
+//     display: inline-block;
+//     width: 300px;
+//     height: 22px;
+//     // line-height: 22px;
+//     overflow: hidden;
+//     white-space: nowrap;
+//     text-overflow: ellipsis;
+//     margin: 0;
+//     padding: 0;
+//     line-height: 0;
+// }
+// .cal {
+//     width: 300px;
+//     overflow: hidden;
+//     white-space: nowrap;
+//     text-overflow: ellipsis;
+//     cursor: pointer;
+// }
 </style>