半浮层

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

@@ -29,27 +29,25 @@ export const columns = {
     {
       label: '级别',
       key: 'level',
-      minWidth: 100,
+      minWidth: 40,
       align: 'left',
       type: 'level'
     },
     {
       label: '问题名称',
       key: 'title',
-      minWidth: 360,
+      minWidth: 250,
       type: 'link',
       align: 'left'
     },
     {
       label: '不可用时长',
       key: 'undone',
-      minWidth: 100,
       align: 'center'
     },
     {
       label: '改进方案',
       key: 'type',
-      minWidth: 100,
       type: 'slot',
       align: 'center',
       slotName: 'starFlowerDoneSlot'
@@ -57,8 +55,10 @@ export const columns = {
     {
       label: '发生时间',
       key: 'gmtCreate',
+      type: 'slot',
       minWidth: 100,
-      align: 'center'
+      align: 'center',
+      slotName: 'gmtCreateSlot'
     }
   ],
   // 提测报告
@@ -158,7 +158,7 @@ export const columns = {
     },
     {
       label: '状态',
-      key: 'statusString',
+      key: 'statusName',
       minWidth: 90,
       align: 'left'
     }

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

@@ -2,11 +2,14 @@
   <el-drawer
     :modal="false"
     size="100%"
-    class="drawer-box"
+    :class="drawerBox"
     destroy-on-close
     :visible.sync="drawer"
     :before-close="handleClose"
     @click.stop
+    @open="setBoxShadow('')"
+    @opened="setBoxShadow"
+    @close="setBoxShadow('')"
   >
     <template slot="title">
       <div v-if="title" @click.stop>{{ title }}<span class="sub-title">{{ subTitle }}</span></div>
@@ -45,6 +48,12 @@
           <div v-else class="antdv3-tag antdv3-tag-orange">已完成：{{ scope.row.done }}项</div>
         </div>
       </template>
+      <!-- 质量：线上问题_改进方案 -->
+      <template #gmtCreateSlot="{scope}">
+        <div @click.stop>
+          <div>{{ rTime(scope.row.gmtCreate) }}</div>
+        </div>
+      </template>
     </dmTable>
     <!-- 下拉 -->
     <div class="qz-footer-laout" @click.stop>
@@ -134,6 +143,7 @@ export default {
       ids: [],
       label: '',
       activeLabel: '',
+      drawerBox: '',
       subTitle: '',
       sourceData: null,
       timelineData: {
@@ -217,13 +227,16 @@ export default {
         ]
       }
     },
+    // 处理日期格式：JS - 2020-01-01T00:00:00.000000Z 日期格式转换
+    rTime(date) {
+      if (!date) return ''
+      var json_date = new Date(date).toJSON()
+      return new Date(new Date(json_date) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '')
+    },
     // 设置ids
     setIds() {
       if (this.headerTitle === '质量') {
-        // console.log(this.drawerData)
-        // console.log(this.drawerData.IdList)
         this.ids = this.drawerData.IdList.map(e => e)
-        console.log(this.ids)
       }
       if (this.headerTitle === '吞吐量') {
         this.drawerData.list.forEach(elm => {
@@ -233,8 +246,6 @@ export default {
         })
       }
       if (this.headerTitle === '效率') {
-        // this.ids = [2049, 1662, 2050, 1644, 2051, 1657, 1670, 1715, 1728, 1692, 2048, 2052, 2047] // 提测报告
-        console.log(this.drawerData)
         this.ids = this.drawerData.idList.map(e => e) // 提测报告
       }
       // this.ids = this.drawerData.IdList.map(e => e)
@@ -380,10 +391,10 @@ export default {
     // 时间轴点击事件
     timeLineClick({ value, name }, index) {
       this.pagingInit()
+      this.ids = []
       if (index === 1) {
         if (this.headerTitle === '吞吐量') {
           this.timelineData.firstActive = value || 0
-          console.log(this.sourceData)
           if (this.sourceData[value || 0] && this.sourceData[value || 0].idList) {
             this.ids = this.sourceData[value || 0].idList
             this.title = name
@@ -400,13 +411,11 @@ export default {
           this.setColumn()
         }
         this.setTableList()
-        console.log(value, name, '第一条')
       }
       if (index === 2) {
         this.timelineData.secondActive = value || 0
         this.ids = this.sourceData[value || 0].IdList
         this.setTableList()
-        console.log(value, name, '第二条')
       }
     },
     // 设置列表数据
@@ -435,9 +444,9 @@ export default {
           this.loading = true
           this.ids.length && this.getTaskList()
         }
-        if (this.title.search(/项目/) > -1) {
+        if (this.title.search(/项目/) > -1 && this.ids.length) {
           this.loading = true
-          this.ids.length && this.setProjectList()
+          this.setProjectList()
         }
       }
       if (this.headerTitle === '效率') {
@@ -505,6 +514,9 @@ export default {
     },
     // getStarFlowerList, // 线上问题：半浮层 列表
     async setStarFlowerList() {
+      if (!this.ids.length) {
+        this.loading = false
+      }
       const paging = this.paging
       // {"ids":[14952,15453,15988,16182,17445,17447,17735,18062,18064,18067,18134,18137,18138,18140],"curIndex":2,"pageSize":10}
       const res = await getStarFlowerList({
@@ -517,7 +529,6 @@ export default {
         this.paging.pageTotal = res.data.total
         this.paging = { ...paging }
         this.loading = false
-        // console.log(491, this.tableList)
       }
     },
     // getProjectList // 需求任务项目列表: 半浮层
@@ -525,13 +536,13 @@ export default {
       const paging = this.paging
       // {"ids":[14952,15453,15988,16182,17445,17447,17735,18062,18064,18067,18134,18137,18138,18140],"curIndex":2,"pageSize":10}
       const res = await getProjectList({
-        idList: this.ids,
+        idList: this.ids.length ? this.ids : [],
         curIndex: this.paging.curIndex,
         pageSize: 15
       })
       if (res.code === 200) {
-        this.tableList = res.data.result
-        this.paging.pageTotal = res.data.total
+        this.tableList = res.data
+        this.paging.pageTotal = this.tableList.length
         this.paging = { ...paging }
         this.loading = false
       }
@@ -588,7 +599,6 @@ export default {
         this.paging = { ...paging }
         this.loading = false
       }
-      console.log(res)
     },
     // 任务平均交付周期
     async setTaskData() {
@@ -608,7 +618,6 @@ export default {
         this.paging = { ...paging }
         this.loading = false
       }
-      console.log(res)
     },
     // 平均需求使用人力
     async   setRequirePeopleData() {
@@ -628,11 +637,9 @@ export default {
         this.paging = { ...paging }
         this.loading = false
       }
-      console.log(res)
     },
     // 缺陷平均修复时长
     async setbugRepair2Data() {
-      console.log(624, this.sourceData)
       const paging = this.paging
       const params = {
         ...paging,
@@ -649,7 +656,6 @@ export default {
         this.paging = { ...paging }
         this.loading = false
       }
-      console.log(res)
     },
     // 缺陷24小时修复率
     async setbugRepairData() {
@@ -670,7 +676,6 @@ export default {
         this.paging = { ...paging }
         this.loading = false
       }
-      console.log(res)
     },
     // getDelayLaunchData, // 延期提测率
     async setDelayLaunchData() {
@@ -690,7 +695,6 @@ export default {
         this.paging = { ...paging }
         this.loading = false
       }
-      console.log(res)
     },
     // getDelayReleaseData, // 延期准出率
     async setDelayReleaseData() {
@@ -710,7 +714,6 @@ export default {
         this.paging = { ...paging }
         this.loading = false
       }
-      console.log(res)
     },
     // 分页
     tableListPagination() {
@@ -751,7 +754,6 @@ export default {
     // 设置表头
     // 表格跳转
     dmTableChange({ column, row }) {
-      // console.log(column, row)
       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')
@@ -779,6 +781,16 @@ export default {
         this.jumper(row, '缺陷')
       }
     },
+    // 设置表格样式
+    setBoxShadow(key = 'drawer-box') {
+      if (key) {
+        setTimeout(() => {
+          this.drawerBox = key
+        }, 300)
+      } else {
+        this.drawerBox = key
+      }
+    },
     // 设置时间轴自动滚动
     setTimeLine() {
       this.$nextTick(() => {

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

@@ -35,7 +35,7 @@
             </el-select>
           </div>
         </div>
-        <div class="chartViewHeight">
+        <div v-loading="onlineLoading" class="chartViewHeight">
           <normal-echart v-if="onlineProblemChartOption" :chart-id="'chart1'" :option="onlineProblemChartOption" @onClick="changeList" />
         </div>
       </div>
@@ -66,7 +66,7 @@
             </el-select>
           </div>
         </div>
-        <div class="chartViewHeight">
+        <div v-loading="offlineLoading" class="chartViewHeight">
           <normal-echart v-if="offlineProblemChartOption" :chart-id="'chart2'" :option="offlineProblemChartOption" @onClick="changeList" />
         </div>
       </div>
@@ -146,6 +146,16 @@ export default {
       type: Boolean,
       required: false,
       default: false
+    },
+    onlineLoading: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    offlineLoading: {
+      type: Boolean,
+      required: false,
+      default: false
     }
   },
   data() {

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

@@ -55,7 +55,7 @@
       </div>
     </el-col>
     <el-col :span="6">
-      <div class="itemBox">
+      <div v-loading="backlogLoading" class="itemBox">
         <div class="titleLevel3 mb25">需求积压率</div>
         <div class="chartSearchbar inlineBetween mt15">
           <div style="width: 200px">
@@ -123,6 +123,11 @@ export default {
       type: Boolean,
       required: false,
       default: false
+    },
+    backlogLoading: {
+      type: Boolean,
+      required: false,
+      default: false
     }
   },
   data() {

src/views/dataBigManage/index.vue

@@ -17,6 +17,8 @@
       <qualityModule
         :datas="mainData.quality"
         :loading="qualityLoading"
+        :online-loading="qualityOnlineLoading"
+        :offline-loading="qualityOfflineLoading"
         @search="qualitySearch"
         @checkDetialModal="(data) => checkDetialModal({...data, headerTitle: '质量' })"
       />
@@ -27,6 +29,7 @@
         :datas="mainData.throughput"
         :loading="throughputLoading"
         :list-loading="throughputListLoading"
+        :backlog-loading="throughputBacklogLoading"
         @search="qualitySearch"
         @checkDetialModal="(data) => checkDetialModal({...data, headerTitle: '吞吐量' })"
       />
@@ -110,8 +113,11 @@ export default {
         efficiency: {}
       },
       qualityLoading: false,
+      qualityOnlineLoading: false,
+      qualityOfflineLoading: false,
       throughputLoading: false,
       throughputListLoading: false,
+      throughputBacklogLoading: false,
       efficiencyLoading: false
     }
   },
@@ -182,13 +188,13 @@ export default {
       }
       const key = Object.keys(d)[0]
       if (key === 'onlineProblemViweType') {
-        this.getOnlineProblemChartData(this.params)
+        this.getOnlineProblemChartData(this.params, key)
       } else if (key === 'offlineProblemViweType') {
-        this.getOfflineProblemChartData(this.params)
+        this.getOfflineProblemChartData(this.params, key)
       } else if (key === 'wholeTab') {
         this.getThroughputData(this.params, key)
       } else if (key === 'requirementBacklogType') {
-        this.getRequirementBacklogRateChartData(this.params)
+        this.getRequirementBacklogRateChartData(this.params, key)
       }
     },
     // 弹窗数据
@@ -293,8 +299,13 @@ export default {
       })
     },
     // 线上问题图表
-    getOnlineProblemChartData(params) {
-      this.qualityLoading = true
+    getOnlineProblemChartData(params, key) {
+      if (key) {
+        this.qualityOnlineLoading = true
+      } else {
+        this.qualityLoading = true
+      }
+
       getOnlineProblemChartDataRequest({
         ...params,
         extensionType: params.onlineProblemViweType
@@ -304,13 +315,20 @@ export default {
           quality: { ...this.mainData.quality, onlineProblemChart: res.data }
         }
         this.qualityLoading = false
+        this.qualityOnlineLoading = false
       }).catch(() => {
         this.qualityLoading = false
+        this.qualityOnlineLoading = false
       })
     },
     // 线下问题图表
-    getOfflineProblemChartData(params) {
-      this.qualityLoading = true
+    getOfflineProblemChartData(params, key) {
+      if (key) {
+        this.qualityOfflineLoading = true
+      } else {
+        this.qualityLoading = true
+      }
+
       //  offlineProblemChart
       getOfflineProblemChartDataRequest({
         ...params,
@@ -321,8 +339,10 @@ export default {
           quality: { ...this.mainData.quality, offlineProblemChart: res.data }
         }
         this.qualityLoading = false
+        this.qualityOfflineLoading = false
       }).catch(() => {
         this.qualityLoading = false
+        this.qualityOfflineLoading = false
       })
     },
     // 需求任务项目列表
@@ -349,8 +369,13 @@ export default {
       })
     },
     // 需求积压率
-    getRequirementBacklogRateChartData(params) {
-      this.throughputLoading = true
+    getRequirementBacklogRateChartData(params, key) {
+      if (key) {
+        this.throughputBacklogLoading = true
+      } else {
+        this.throughputLoading = true
+      }
+
       getRequirementBacklogRateChartDataRequest({
         ...params,
         extensionType: params.requirementBacklogType
@@ -360,8 +385,10 @@ export default {
           throughput: { ...this.mainData.throughput, requirementBacklogRateChart: res.data }
         }
         this.throughputLoading = false
+        this.throughputBacklogLoading = false
       }).catch(() => {
         this.throughputLoading = false
+        this.throughputBacklogLoading = false
       })
     },
     // 效率