数据大盘：半浮层

src/views/dataBigManage/components/drawerModal/components/table.vue

@@ -4,7 +4,9 @@
       :data="tableList"
       class="bug_tableHeader"
       :header-cell-style="{ color: '#4A4A4A', fontSize: '14px', fontWeight: '500' }"
+      :cell-style="{ 'font-size':'14px','color':'rgba(102,102,102,1)' }"
       row-key="id"
+      size="mini"
       style="width: auto;"
       :height="tableHeight"
     >
@@ -46,6 +48,10 @@
             <div class="drawer-id">{{ `${columnItem.topName} - ${scope.row[columnItem.topKey]}` }}</div>
             <div class="drawer-name" @click.stop="columnItemChange(columnItem, scope.row)">{{ scope.row[columnItem.key] }}</div>
           </div>
+          <!-- 链接点击跳转 -->
+          <div v-else-if="columnItem.type === 'link'">
+            <div class="drawer-name" @click.stop="columnItemChange(columnItem, scope.row)">{{ scope.row[columnItem.key] }}</div>
+          </div>
           <!-- 插槽 -->
           <div v-else-if="columnItem.type === 'slot'">
             <slot :name="columnItem.slotName" :scope="scope" />

src/views/dataBigManage/components/drawerModal/drawerModalData.js

@@ -36,8 +36,9 @@ export const columns = {
     {
       label: '问题名称',
       key: 'title',
-      minWidth: 100,
-      align: 'center'
+      minWidth: 360,
+      type: 'link',
+      align: 'left'
     },
     {
       label: '不可用时长',
@@ -49,7 +50,9 @@ export const columns = {
       label: '改进方案',
       key: 'type',
       minWidth: 100,
-      align: 'center'
+      type: 'slot',
+      align: 'center',
+      slotName: 'starFlowerDoneSlot'
     },
     {
       label: '发生时间',
@@ -155,7 +158,7 @@ export const columns = {
     },
     {
       label: '状态',
-      key: 'status',
+      key: 'statusString',
       minWidth: 90,
       align: 'left'
     }

src/views/dataBigManage/components/drawerModal/index.vue

@@ -37,6 +37,14 @@
       <template #creatorObjectSlot="{scope}">
         <div v-if="scope && scope.row && scope.row.creatorObject" @click.stop>{{ scope.row.creatorObject.name }}</div>
       </template>
+      <!-- 质量：线上问题_改进方案 -->
+      <template #starFlowerDoneSlot="{scope}">
+        <div @click.stop>
+          <div>{{ scope.row.done + scope.row.undone }}项任务</div>
+          <div v-if="scope.row.done === scope.row.done + scope.row.undone" class="antdv3-tag antdv3-tag-green">已完成：{{ scope.row.done }}项</div>
+          <div v-else class="antdv3-tag antdv3-tag-orange">已完成：{{ scope.row.done }}项</div>
+        </div>
+      </template>
     </dmTable>
     <!-- 下拉 -->
     <div class="qz-footer-laout" @click.stop>
@@ -725,20 +733,16 @@ export default {
         this.tableHeight = 'calc(100vh - 363px)'
       } else if (this.title.search(/需求周期|新增项目|新增任务|需求人力|任务周期|缺陷修复时长|延期准出率|延期提测率/) > -1) {
         this.tableHeight = 'calc(100vh - 288px)'
-      } else if (this.title.search(/需求方向分布图数据|模块分布图数据/) > -1) {
-        this.tableHeight = 'calc(100vh - 200px)'
-      } else if (this.title.search(/累计新增|PRD评审通过|技术准入|累计上线|累计hold|累计修复|累计reopen/) > -1) {
-        this.tableHeight = 'calc(100vh - 134px)'
       } else if (this.title.search(/需求|任务|项目/) > -1) {
         // 吞吐量： 需求
         this.tableHeight = 'calc(100vh - 188px)'
       } else if (this.title === '缺陷24小时修复率') {
         this.tableHeight = 'calc(100vh - 328px)'
-      } else if (this.title.search(/新增缺陷|提测打回率|reopen|准出不通过/) > -1) {
-        this.tableHeight = 'calc(100vh - 136px)'
       } else {
         this.tableHeight = 'calc(100vh - 136px)'
-        // this.tableHeight = 'calc(100vh - 10px)'
+      }
+      if (this.headerTitle === '质量') {
+        this.tableHeight = 'calc(100vh - 136px)'
       }
       if (this.headerTitle === '吞吐量') {
         this.tableHeight = 'calc(100vh - 288px)'
@@ -748,7 +752,10 @@ export default {
     // 表格跳转
     dmTableChange({ column, row }) {
       // console.log(column, row)
-      if (this.headerTitle === '吞吐量') {
+      if (this.headerTitle === '质量' && this.drawerData.label === '新增问题') {
+        const url = `http://odin.xiaojukeji.com/#/risk/starflower/casedetail?id=${row.id}&name=${row.title}`
+        window.open(url, '_blank')
+      } else if (this.headerTitle === '吞吐量') {
         if (this.title.search(/需求/) > -1) {
           this.jumper(row, '需求')
         }
@@ -880,6 +887,38 @@ export default {
   color: #444444;
 }
 /* E 时间轴 */
+/* S 质量：线上问题_改进方案 */
+.antdv3-tag{
+  box-sizing: border-box;
+  color: rgba(0,0,0,.65);
+  font-variant: tabular-nums;
+  list-style: none;
+  font-feature-settings: "tnum";
+  display: inline-block;
+  height: auto;
+  margin: 0 8px 0 0;
+  padding: 0 7px;
+  font-size: 12px;
+  line-height: 20px;
+  white-space: nowrap;
+  background: #fafafa;
+  border: 1px solid #d9d9d9;
+  border-radius: 2px;
+  cursor: default;
+  opacity: 1;
+  transition: all .3s cubic-bezier(.78,.14,.15,.86);
+}
+.antdv3-tag-orange {
+  color: #fa8c16;
+  background: #fff7e6;
+  border-color: #ffd591;
+}
+.antdv3-tag-green {
+  color: #52c41a;
+  background: #f6ffed;
+  border-color: #b7eb8f;
+}
+/* E 质量：线上问题_改进方案 */
 .qz-footer-laout {
   display: flex;
   justify-content: space-between;