ss

src/api/dataBig.js

@@ -1,29 +0,0 @@
-import request from '@/utils/request'
-
-console.log(3, request, request.baseURL)
-const commonUrl = 'http://10.179.162.122:10086/api'
-
-export function getGlobalInterface(data) {
-  return request({
-    url: 'http://10.179.162.122:10086/render/menu',
-    method: 'get',
-    data
-  })
-}
-
-export function postForm(path, data) {
-  return request({
-    url: commonUrl + path,
-    method: 'post',
-    data
-  })
-}
-
-export function testPost() {
-  return request({
-    url:
-      'http://127.0.0.1:4523/mock/368525/dataMarket/quality/getOnlineProcessData',
-    method: 'post',
-    data: {}
-  })
-}

src/api/dataMarket.js

@@ -0,0 +1,101 @@
+import request from '@/utils/request'
+// import { TeamManagement } from '@/apiConfig/api'
+
+const TeamManagement = 'http://127.0.0.1:4523/mock/368525'
+// 质量
+
+// 线上问题列表
+export function getOnlineProblemList(data) {
+  return request({
+    url: TeamManagement + '/dataMarket/quality/getOnlineProblemData',
+    method: 'post',
+    data
+  })
+}
+// 线上问题图表
+export function getOnlineProblemChartData(data) {
+  return request({
+    url: TeamManagement + '/dataMarket/quality/getOnlineProblemDistributionData',
+    method: 'post',
+    data
+  })
+}
+// 线下问题列表
+export function getOfflineProblemList(data) {
+  return request({
+    url: TeamManagement + '/dataMarket/quality/getOfflineProblemData',
+    method: 'post',
+    data
+  })
+}
+// 线下问题图表
+export function getOfflineProblemChartData(data) {
+  return request({
+    url: TeamManagement + '/dataMarket/quality/getOfflineProblemDistributionData',
+    method: 'post',
+    data
+  })
+}
+// 上线过程列表
+export function getOnlineProcessData(data) {
+  return request({
+    url: TeamManagement + '/dataMarket/quality/getOnlineProcessData',
+    method: 'post',
+    data
+  })
+}
+// 移动端发布质量
+export function getMobilePublishQualityData(data) {
+  return request({
+    url: TeamManagement + '/dataMarket/quality/getMobilePublishQualityData',
+    method: 'post',
+    data
+  })
+}
+
+// 吞吐量
+
+// 需求任务项目列表
+export function getThroughputData(data) {
+  return request({
+    url: TeamManagement + '/dataMarket/throughput/getThroughputData',
+    method: 'post',
+    data
+  })
+}
+
+// 需求方向分布图
+export function getRequirementDirectionDistributionChartData(data) {
+  return request({
+    url: TeamManagement + '/dataMarket/throughput/getRequirementDirectionDistributionData',
+    method: 'post',
+    data
+  })
+}
+
+// 需求积压率图
+export function getRequirementBacklogRateChartData(data) {
+  return request({
+    url: TeamManagement + '/dataMarket/throughput/getRequirementBacklogRateData',
+    method: 'post',
+    data
+  })
+}
+
+// 版本需求图
+export function getVersionRequirementChartData(data) {
+  return request({
+    url: TeamManagement + '/dataMarket/throughput/getVersionRequirementData',
+    method: 'post',
+    data
+  })
+}
+
+// 效率
+export function getEfficiencyData(data) {
+  return request({
+    url: TeamManagement + '/dataMarket/efficiency/getEfficiencyData',
+    method: 'post',
+    data
+  })
+}

src/components/actionDynamic/index.vue

@@ -67,6 +67,7 @@
   </div>
 </template>
 <script>
+import '@/styles/PublicStyle/index.less'
 export default {
   props: {
     comments: {
@@ -109,24 +110,24 @@ export default {
 }
 .sign-record {
   margin: 20px 0;
-  font-size: 14px;
-  line-height: 20px;
-  opacity: 1;
-  font-family: PingFangSC-Regular;
+  font-size:14px;
+  line-height:20px;
+  opacity:1;
+  font-family:PingFangSC-Regular;
 }
 .createTime {
-  min-width: 150px;
-  color: rgba(68,68,68,1);
+  min-width:150px;
+  color:rgba(68,68,68,1);
 }
 
 .remark {
-  min-width: 500px;
+  min-width:500px;
   text-align: left;
-  color: #444444;
+  color:#444444;
 }
 .operatorName {
   min-width: 60px;
-  color: rgba(51,59,74,1);
+  color:rgba(51,59,74,1);
   margin-right: 10px;
 }
 .content {

src/styles/index.less

@@ -117,6 +117,69 @@ div:focus {
   -webkit-background-clip: text;
 }
 
+.page-wrap {
+  background: #F7F8FC;
+  width: 100%;
+  .page-header {
+    padding: 15px 15px 5px 15px;
+    margin-bottom: 10px;
+    background: #fff;
+    border-radius: 0 0 6px 6px;
+    &.detial {
+      padding: 15px;
+    }
+  }
+  .page-content {
+    background: #fff;
+    border-radius: 6px;
+    min-width: 890px;
+    &.detial, .detial {
+      padding: 15px 30px;
+    }
+  }
+}
+.mt40 {
+  margin-top: 40px;
+}
+.mb25 {
+  margin-bottom: 25px;
+}
+.mb10 {
+  margin-bottom: 10px;
+}
+.inlineBlock {
+  display: inline-block;
+}
+.titleLevel3 {
+  color: #333;
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.flex-center-start {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+}
+.flex-center-between {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.flex-center-end {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+.ellipsis {
+  display: inline-block;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  vertical-align: middle;
+  width: 80%;
+}
+
 .iconfont {
   font-family: 'iconfont' !important;
   font-size: 16px;

src/utils/request.js

@@ -19,7 +19,7 @@ service.interceptors.request.use(
     config.headers['secret'] = Encrypt()
     // config.retry = 2// 如果请求超时，重试次数
     // config.retryInterval = 1000 // 重试间隔
-    console.log(config, 22)
+    
     return config
   },
   error => {

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

@@ -1,9 +1,24 @@
 <template>
-  <div class="dataItem flex-center-start" :style="{ background: bgColor, padding: padding }">
-    <addIcon :inner-color="innerColor" :out-color="outColor" />
+  <div class="dataItem flex-center-start" :style="{ background: data.bgColor, padding: data.padding }">
+    <addIcon :inner-color="data.innerColor" :out-color="data.outColor" />
     <div class="textWord">
-      <div class="ellipsis" v-html="title" />
-      <div class="ellipsis" v-html="subTitle" />
+      <div>
+        <span>{{ data.label }}</span>
+        <span class="title">{{ data.title }}</span>
+        <span>{{ data.titleUnit }}</span>
+      </div>
+      <!-- <div class="ellipsis" v-html="subTitle" /> -->
+      <div class="subTitleName">
+        <span v-if="data.subTitleUnit === 'rate'">
+          <span>环比：</span>
+          <span :class="Number(data.subTitle) > 0 ? 'item-up' : 'item-down'">
+            <i class="el-icon-caret-top" v-if="Number(data.subTitle) > 0" />
+            <i class="el-icon-caret-bottom" v-else />
+            {{ data.subTitle }}%
+          </span>
+        </span>
+        <span v-else v-html="data.subTitle" />
+      </div>
     </div>
   </div>
 </template>
@@ -14,35 +29,10 @@ export default {
     addIcon
   },
   props: {
-    bgColor: {
-      type: String,
+    data: {
+      type: Object,
       required: false,
-      default: ''
-    },
-    innerColor: {
-      type: String,
-      required: false,
-      default: ''
-    },
-    outColor: {
-      type: String,
-      required: false,
-      default: ''
-    },
-    title: {
-      type: String,
-      required: false,
-      default: ''
-    },
-    subTitle: {
-      type: String,
-      required: false,
-      default: ''
-    },
-    padding: {
-      type: String,
-      required: false,
-      default: ''
+      default: () => {}
     }
   }
 }
@@ -54,6 +44,21 @@ export default {
   .textWord {
     padding-left: 10px;
     width: 90%;
+    .title {
+      color: #333;
+      font-size: 18px;
+      font-weight: 600;
+    }
+    .subTitleName {
+      color: #999;
+      font-size: 12px;
+     .item-up {
+        color:#F32850
+      }
+      .item-down {
+        color:#9FFF39
+      }
+    }
   }
 }
 </style>

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

@@ -128,21 +128,27 @@
       <div class="itemBox" style="border-left-color: #62D9AA; background: #62D9AA; color: #fff">
         <!-- <div class="titleLevel3">小小的</div> -->
         <dataItem
-          inner-color="#62D9AA"
-          out-color="#fff"
-          title="延期提测"
-          sub-title="1%"
-          bg-color="transparent"
-          padding="8px 0px"
+          :data="{
+            'innerColor': '#62D9AA',
+            'outColor': '#fff',
+            'label': '延期提测',
+            'subTitle': '<span style=color:#fff;> 1% </span>',
+            'subTitleUnit': 'normal',
+            'bgColor': 'transparent',
+            'padding': '8px 0px'
+          }"
         />
         <div class="line" />
         <dataItem
-          inner-color="#62D9AA"
-          out-color="#fff"
-          title="延期提测"
-          sub-title="1%"
-          bg-color="transparent"
-          padding="8px 0px"
+          :data="{
+            'innerColor': '#62D9AA',
+            'outColor': '#fff',
+            'label': '延期提测',
+            'subTitle': '<span style=color:#fff;> 1% </span>',
+            'subTitleUnit': 'normal',
+            'bgColor': 'transparent',
+            'padding': '8px 0px'
+          }"
         />
       </div>
     </el-col>

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

@@ -4,14 +4,15 @@
       <div class="itemBox onlineProblem">
         <div class="titleLevel3 mb10">线上问题</div>
         <el-row :gutter="10">
-          <el-col v-for="(item, index) in itemList" :key="index" :span="12" class="mb10">
-            <dataItem
+          <el-col v-for="(item, index) in mainData.onlineProblemList" :key="index" :span="12" class="mb10">
+            <!-- <dataItem
               :inner-color="item.innerColor"
               :out-color="item.outColor"
               :title="item.title"
               :sub-title="item.subTitle"
               :bg-color="item.bgColor"
-            />
+            /> -->
+            <dataItem :data="item"/>
           </el-col>
         </el-row>
         <div class="chartSearchbar inlineBetween mt15">
@@ -23,7 +24,7 @@
               style="width: 115px"
               @change="$emit('search')"
             >
-              <el-option v-for="(t, index) in typeOptionList" :key="index" :label="t.label" :value="t.value" />
+              <el-option v-for="(t, index) in typeOptionList" :key="index" :label="t" :value="t" />
             </el-select>
           </div>
         </div>
@@ -37,13 +38,7 @@
         <div class="titleLevel3 mb10">线下质量</div>
         <el-row :gutter="10">
           <el-col v-for="(item, index) in itemList" :key="index" :span="12" class="mb10">
-            <dataItem
-              :inner-color="item.innerColor"
-              :out-color="item.outColor"
-              :title="item.title"
-              :sub-title="item.subTitle"
-              :bg-color="item.bgColor"
-            />
+            <dataItem :data="item" />
           </el-col>
         </el-row>
         <div class="chartSearchbar inlineBetween mt15">
@@ -55,7 +50,7 @@
               style="width: 115px"
               @change="$emit('search')"
             >
-              <el-option v-for="(t, index) in typeOptionList" :key="index" :label="t.label" :value="t.value" />
+              <el-option v-for="(t, index) in typeOptionList" :key="index" :label="t" :value="t" />
             </el-select>
           </div>
         </div>
@@ -69,13 +64,7 @@
         <div class="titleLevel3 mb10">上线过程</div>
         <el-row :gutter="10">
           <el-col v-for="(item, index) in itemList" :key="index" :span="12" class="mb10">
-            <dataItem
-              :inner-color="item.innerColor"
-              :out-color="item.outColor"
-              :title="item.title"
-              :sub-title="item.subTitle"
-              padding="8px 0px"
-            />
+            <dataItem :data="item" />
           </el-col>
         </el-row>
         <el-row :gutter="10" style="height: 100px">
@@ -102,46 +91,120 @@ export default {
     dataItem,
     normalEchart
   },
+  props: {
+    data: {
+      type: Object,
+      required: true,
+      default: () => {}
+    }
+  },
   data() {
     return {
       itemList: [
         {
           'innerColor': '#F5222D',
           'outColor': '#F5DDE2',
-          'title': '<div>新增问题15个</div>',
-          'subTitle': '线上故障率15%',
+          'title': '123',
+          'subTitle': '123',
           'bgColor': '#F5F7FC'
         },
         {
           'innerColor': '#FAAD14',
           'outColor': '#F7ECDA',
-          'title': '新增问题15个',
-          'subTitle': '线上故障率15%',
+          'title': '',
+          'subTitle': '',
           'bgColor': '#F5F7FC'
         },
         {
           'innerColor': '#C97DE9',
           'outColor': '#EFE5FA',
-          'title': '<div>新增问题15个</div>',
-          'subTitle': '线上故障率15%',
+          'title': '',
+          'subTitle': '',
           'bgColor': '#F5F7FC'
         },
         {
           'innerColor': '#7ED321',
           'outColor': '#E4F2DC',
-          'title': '新增问题15个',
-          'subTitle': '线上故障率15%'
+          'title': '',
+          'subTitle': '',
+          'bgColor': '#F5F7FC'
         }
       ],
-      typeOptionList: [],
+      typeOptionList: ['时间'],
       echartsOption1: null,
-      viewType: null
+      viewType: null,
+      baseData: {},
+      mainData: {},
+    }
+  },
+  watch: {
+    data() {
+      console.log(this.data)
+      this.baseData = this.data
+      this.resetBaseData()
     }
   },
   mounted() {
+    this.resetBaseData()
     this.echartsOption1 = getOption([1, 2, 3], [4, 5, 6], 'bar')
   },
   methods: {
+    resetBaseData() {
+      let d = null
+      console.log(this.data)
+      if (this.data.onlineProblemList) {
+        console.log(this.data.onlineProblemList)
+        const { ImprovementsOverRate, depleteUnavailableTime, newOnlineProblems, onlineBreakRate } = this.data.onlineProblemList
+        d = [
+          {
+            'innerColor': '#F5222D',
+            'outColor': '#F5DDE2',
+            'bgColor': '#F5F7FC',
+            'label': newOnlineProblems.label,
+            'title': newOnlineProblems.countStr,
+            'titleUnit': '个',
+            'subTitleUnit': 'rate',
+            'subTitle': newOnlineProblems.chainRatio,
+            'IdList': newOnlineProblems.IdList
+          },
+          {
+            'innerColor': '#FAAD14',
+            'outColor': '#F7ECDA',
+            'bgColor': '#F5F7FC',
+            'label': depleteUnavailableTime.label,
+            'title': depleteUnavailableTime.countStr,
+            'titleUnit': '分',
+            'subTitleUnit': 'rate',
+            'subTitle': depleteUnavailableTime.chainRatio,
+            'IdList': depleteUnavailableTime.IdList
+          },
+          {
+            'innerColor': '#C97DE9',
+            'outColor': '#EFE5FA',
+            'bgColor': '#F5F7FC',
+            'label': onlineBreakRate.label,
+            'title': onlineBreakRate.countStr,
+            'titleUnit': '%',
+            'subTitleUnit': 'rate',
+            'subTitle': onlineBreakRate.chainRatio,
+            'IdList': onlineBreakRate.IdList
+          },
+          {
+            'innerColor': '#7ED321',
+            'outColor': '#E4F2DC',
+            'bgColor': '#F5F7FC',
+            'label': ImprovementsOverRate.label,
+            'title': ImprovementsOverRate.countStr,
+            'titleUnit': '%',
+            'subTitleUnit': 'rate',
+            'subTitle': ImprovementsOverRate.chainRatio,
+            'IdList': ImprovementsOverRate.IdList
+          }
+        ]
+        this.mainData = { ...this.mainData, onlineProblemList: d }
+        console.log(this.mainData)
+      }
+    },
     changeList() {}
   }
 }

src/views/dataBigManage/index.vue

@@ -13,7 +13,7 @@
       <header class="header mb25">
         <headTitle title="质量" />
       </header>
-      <qualityModule />
+      <qualityModule :data="mainData.quality"/>
       <header class="header mb25 mt40">
         <headTitle title="吞吐量" />
       </header>
@@ -23,14 +23,30 @@
       </header>
       <efficiencyModule />
     </div>
-    <!-- <div @click.stop>
-      <drawer-modal v-if="openDrawer" :drawer="openDrawer" :data="requireList" :status="reqStatus" @clone="clone" />
-    </div> -->
+    <div v-show="false" @click.stop>
+      <!-- <drawer-modal v-if="openDrawer" :drawer="openDrawer" :data="requireList" :status="reqStatus" @clone="clone" /> -->
+    </div>
   </div>
 </template>
 
 <script>
 import { listSearchData } from './data'
+import {
+  // 质量
+  getOnlineProblemList, // 线上问题列表
+  getOnlineProblemChartData, // 线上问题图表
+  getOfflineProblemList, // 线下问题列表
+  getOfflineProblemChartData, // 线下问题图表
+  getOnlineProcessData, // 上线过程
+  getMobilePublishQualityData, // 移动端发布质量
+  // 吞吐量
+  getThroughputData, // 需求任务项目列表
+  getRequirementDirectionDistributionChartData, // 需求方向分布图
+  getRequirementBacklogRateChartData, // 需求积压率
+  getVersionRequirementChartData, // 版本需求图
+  // 效率
+  getEfficiencyData
+} from '@/api/dataMarket'
 import searchHeader from '@/components/searchHeader'
 import headTitle from '@/components/headTitle'
 import throughputModule from './components/throughputModule/index.vue'
@@ -53,7 +69,11 @@ export default {
       showMore: false,
       openDrawer: true,
       requireList: {},
-      reqStatus: '缺陷状态'
+      reqStatus: '缺陷状态',
+      params: {},
+      mainData: {
+        quality: {}
+      }
     }
   },
   created() {
@@ -72,6 +92,7 @@ export default {
         }))
       }
       console.log(data)
+      this.getList()
     },
     moreReset(data) {
       this.renderList.adv.map(t => t.map(g => {
@@ -80,6 +101,59 @@ export default {
     },
     changeShowMore(e) {
       this.showMore = e
+    },
+    getList() {
+      // // 质量
+      this.getOnlineProblemList() // 线上问题列表
+    },
+    // 线上问题列表
+    getOnlineProblemList() {
+      const params = this.params
+      getOnlineProblemList(params).then(res => {
+        console.log(res)
+        this.mainData = { ...this.mainData, quality: { ...this.mainData.quality, onlineProblemList: res.data }}
+        console.log(this.mainData)
+      })
+    },
+    // 线上问题图表
+    getOnlineProblemChartData() {
+
+    },
+    // 线下问题列表
+    getOfflineProblemList() {
+
+    },
+    // 线下问题图表
+    getOfflineProblemChartData() {
+
+    },
+    // 上线过程
+    getOnlineProcessData() {
+
+    },
+    // 移动端发布质量
+    getMobilePublishQualityData() {
+
+    },
+    // 需求任务项目列表
+    getThroughputData() {
+
+    },
+    // 需求方向分布图
+    getRequirementDirectionDistributionChartData() {
+
+    },
+    // 需求积压率
+    getRequirementBacklogRateChartData() {
+
+    },
+    // 版本需求图
+    getVersionRequirementChartData() {
+
+    },
+    // 效率
+    getEfficiencyData() {
+
     }
   }
 }

src/views/monthlyReport/childrenPage/editReport/components/anchor.vue

@@ -1,11 +1,12 @@
 <template>
   <div v-if="list && list.length && isLine() > -1" class="anchor-wrapper">
     <!--
-如果是TAG的话
-  循环
-    判断当前tabs焦点，符合的话，调用当前组件
-  不符合条件
-    正常渲染-->
+      如果是TAG的话
+        循环
+      判断当前tabs焦点，符合的话，调用当前组件
+        不符合条件
+      正常渲染
+    -->
     <div v-if="list[0].type === 'Tag'">
       <div v-for="item in list" :key="item.domKey" class="title-wrapper">
         <div v-if="item.children && item.children.length && isShowItem(item.isVisible)">

src/views/monthlyReport/childrenPage/editReport/components/core.vue

@@ -75,8 +75,7 @@
               <span v-if="item.title.search(/服务端|客户端/) > -1">
                 <i class="iconfont icon" :class="{colorActive: item.domKey === activeName}">{{ item.title === '服务端'?'&#xe607;' : '&#xe608;' }}</i>
               </span>
-              {{ item.title }}
-            </span>
+            {{ item.title }}</span>
             <Core :key="item.domKey" v-loading="loading" style="padding-left: 20px;" :tab-key="baseData.domKey" :dom-index="index" :base-data="item" />
           </el-tab-pane>
         </el-tabs>