样式微调

src/styles/detail-pages.scss

@@ -79,16 +79,16 @@
     }
   }
   .top-control {
-    width: 20%;
+    width: 235px;
     display: flex;
     justify-content: space-between;
     align-items: center;
     /deep/.icon-add {
-      font-size: 30px;
+      font-size: 20px;
       color: #409EFF;
     }
     /deep/.icon-delete {
-      font-size: 22px;
+      font-size: 20px;
       color: #6F7C93
     }
     .line {

src/views/projectManage/projectList/components/needsList.vue

@@ -6,7 +6,8 @@
       style="width: 100%;"
       size="mini"
       row-key="id"
-      :header-cell-style="{ color: 'rgb(74, 74, 74)', fontSize: '14px', fontWeight: '500', textAlign: 'center' }"
+      :header-cell-style="{ color: 'rgb(74, 74, 74)', fontSize: '14px', fontWeight: '500'}"
+      :row-style="{ fontSize: '14px' }"
       show-overflow-tooltip="true"
       :header-row-style="{height: '50px'}"
     >
@@ -20,8 +21,8 @@
       <el-table-column label="需求名称" width="250" align="center" show-overflow-tooltip>
         <template slot-scope="scope">
           <div class="table-project-name" @click="needs_link(scope.row.id)">
-            <b>{{ scope.row.requirementDisplayId }}</b>
-            <span>{{ scope.row.name }}</span>
+            <span class="id">{{ scope.row.requirementDisplayId }}</span>
+            <span class="name">{{ scope.row.name }}</span>
           </div>
         </template>
       </el-table-column>
@@ -172,12 +173,13 @@ export default {
   display: flex;
   justify-content: center;
   flex-direction: column;
-  b {
+  .id {
     color: #A7AEBC;
     font-size: 10px;
   }
-  span {
+  .name {
     font-size: 14px;
+    color: #666666;
   }
 }
 </style>

src/views/projectManage/projectList/components/taskList.vue

@@ -19,7 +19,8 @@
       size="mini"
       row-key="id"
       :expand-row-keys="expandArr"
-      :header-cell-style="{ color: 'rgb(74, 74, 74)', fontSize: '14px', fontWeight: '500', textAlign: 'center' }"
+      :header-cell-style="{ color: 'rgb(74, 74, 74)', fontSize: '14px', fontWeight: '500'}"
+      :row-style="{ fontSize: '14px' }"
       show-overflow-tooltip="true"
       :show-header="showHeader"
       :header-row-style="{height: '50px'}"
@@ -42,8 +43,13 @@
           </span>
         </template>
       </el-table-column>
-      <el-table-column label="任务名称" width="200" align="center" show-overflow-tooltip>
-        <template slot-scope="scope"><span class="task-title" @click="link_task(scope.row.id)">{{ scope.row.name }}</span></template>
+      <el-table-column label="任务名称" width="200" align="left" show-overflow-tooltip>
+        <template slot-scope="scope">
+          <div class="task-main">
+            <span class="task-id">TASK-{{ scope.row.id }}</span>
+            <span class="task-title" @click="link_task(scope.row.id)">{{ scope.row.name }}</span>
+          </div>
+        </template>
       </el-table-column>
       <el-table-column label="所属模块" width="150" align="center" show-overflow-tooltip>
         <template slot-scope="scope">{{ scope.row.moduleInfoName }}</template>
@@ -302,8 +308,18 @@ export default {
 >>>.el-row .el-col {
   margin: 10px 0;
 }
-.task-title {
-  cursor: pointer;
+.task-main {
+  display: flex;
+  flex-direction: column;
+  .task-title {
+    cursor: pointer;
+    color: #666666;
+    font-size: 14px;
+  }
+  .task-id {
+    color: #A7AEBC;
+    font-size: 10px;
+  }
 }
 .P0 {
   background-color: #F56C6C;

src/views/projectManage/projectList/projectViewDetails.vue

@@ -43,7 +43,7 @@
             </el-dropdown-menu>
           </el-dropdown>
           <div class="line" />
-          <span style="vertical-align: bottom; cursor: pointer; color: #6F7C93;" @click.stop="setChild(), display = true"><img style="width: 24px; display: inline-block;" :src="image_url">&nbsp; {{ num }} &nbsp;</span>
+          <span style="vertical-align: bottom; cursor: pointer; color: #6F7C93;" @click.stop="setChild(), display = true"><img style="width: 20px; display: inline-block;" :src="image_url">&nbsp; {{ num }} &nbsp;</span>
           <div class="line" />
           <i class="el-icon-setting icon-delete" @click="modify_project = true" />
           <div class="line" />

src/views/projectManage/requirement/components/taskList.vue

@@ -19,7 +19,8 @@
       size="mini"
       row-key="id"
       :expand-row-keys="expandArr"
-      :header-cell-style="{ color: 'rgb(74, 74, 74)', fontSize: '14px', fontWeight: '500', textAlign: 'center' }"
+      :header-cell-style="{ color: 'rgb(74, 74, 74)', fontSize: '14px', fontWeight: '500'}"
+      :row-style="{ fontSize: '14px' }"
       show-overflow-tooltip="true"
       :show-header="showHeader"
       :header-row-style="{height: '50px'}"
@@ -42,8 +43,13 @@
           </span>
         </template>
       </el-table-column>
-      <el-table-column label="任务名称" width="200" align="center" show-overflow-tooltip>
-        <template slot-scope="scope"><span class="task-title" @click="link_task(scope.row.id)">{{ scope.row.name }}</span></template>
+      <el-table-column label="任务名称" width="200" align="left" show-overflow-tooltip>
+        <template slot-scope="scope">
+          <div class="task-main">
+            <span class="task-id">TASK-{{ scope.row.id }}</span>
+            <span class="task-title" @click="link_task(scope.row.id)">{{ scope.row.name }}</span>
+          </div>
+        </template>
       </el-table-column>
       <el-table-column label="所属模块" width="150" align="center" show-overflow-tooltip>
         <template slot-scope="scope">{{ scope.row.moduleInfoName }}</template>
@@ -300,8 +306,18 @@ export default {
 >>>.el-row .el-col {
   margin: 10px 0;
 }
-.task-title {
-  cursor: pointer;
+.task-main {
+  display: flex;
+  flex-direction: column;
+  .task-title {
+    cursor: pointer;
+    color: #666666;
+    font-size: 14px;
+  }
+  .task-id {
+    color: #A7AEBC;
+    font-size: 10px;
+  }
 }
 .P0 {
   background-color: #F56C6C;

src/views/projectManage/requirement/requirementDetail.vue

@@ -41,7 +41,7 @@
             </el-dropdown-menu>
           </el-dropdown>
           <div class="line" />
-          <span style="vertical-align: bottom; cursor: pointer; color: #6F7C93;" @click.stop="setChild(), display = true"><img style="width: 24px; display: inline-block;" :src="image_url">&nbsp; {{ num }} &nbsp;</span>
+          <span style="vertical-align: bottom; cursor: pointer; color: #6F7C93;" @click.stop="setChild(), display = true"><img style="width: 20px; display: inline-block;" :src="image_url">&nbsp; {{ num }} &nbsp;</span>
           <div class="line" />
           <i class="el-icon-setting icon-delete" @click="updateVisible = true" />
           <div class="line" />

src/views/projectManage/taskList/taskViewDetail.vue

@@ -55,7 +55,7 @@
             </el-dropdown-menu>
           </el-dropdown>
           <div class="line" />
-          <span style="vertical-align: bottom; cursor: pointer; color: #6F7C93;" @click.stop="setChild(), display = true"><img style="width: 24px; display: inline-block;" :src="image_url">&nbsp; {{ num }} &nbsp;</span>
+          <span style="vertical-align: bottom; cursor: pointer; color: #6F7C93;" @click.stop="setChild(), display = true"><img style="width: 20px; display: inline-block;" :src="image_url">&nbsp; {{ num }} &nbsp;</span>
           <div class="line" />
           <i class="el-icon-setting icon-delete" @click="open_created" />
           <div class="line" />