http_mock

src/api/qualityCenter.js

@@ -0,0 +1,38 @@
+import request from '@/utils/request'
+import { qualityUrl } from '@/apiConfig/api'
+
+// 业务线树获取
+export function getBusiness(data) {
+  return request({
+    url: qualityUrl + '/api/business-line/all',
+    method: 'get',
+    data
+  })
+}
+
+// 部门数据树获取
+export function getDepartment(data) {
+  return request({
+    url: qualityUrl + '/api/department/all',
+    method: 'get',
+    data
+  })
+}
+
+// 上线数据
+export function getOnlineInfo(data) {
+  return request({
+    url: qualityUrl + '/api/online-process/data-info',
+    method: 'get',
+    data
+  })
+}
+
+// 大盘数据
+export function getOnlineAllCount(data) {
+  return request({
+    url: qualityUrl + '/api/online-process/data-all-count',
+    method: 'get',
+    data
+  })
+}

src/apiConfig/api.js

@@ -3,3 +3,5 @@
 export const mockUrl = 'http://10.179.24.123:8980' // 线上
 
 // export const mockUrl = 'http://172.23.162.48:8980' // 美双姐本地
+
+export const qualityUrl = 'http://10.179.209.19:8898' // 质量度量

src/apiConfig/mock.js

@@ -1,3 +1,4 @@
 /*eslint-disable*/   //规避eslint的检查，如没有eslint可不写
-// export const mockUrl = 'http://10.179.88.110:8089' // 线下
-export const mockUrl = 'http://mock.Intra.xiaojukeji.com' // 线上
+// export const mockUrl = 'http://10.179.88.110:8089' // stable
+// export const mockUrl = 'http://mock.Intra.xiaojukeji.com' // 线上
+export const mockUrl = 'http://10.179.101.226:8089' // test

src/layout/components/Navbar.vue

@@ -3,6 +3,10 @@
     <hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
 
     <breadcrumb class="breadcrumb-container" />
+    <span v-show="configShowMain" style="display: inline-block;" class="config">
+      <a href="http://wiki.intra.xiaojukeji.com/pages/viewpage.action?pageId=213729138#id-11%E6%93%8D%E4%BD%9C%E6%89%8B%E5%86%8C-11%E6%93%8D%E4%BD%9C%E6%89%8B%E5%86%8C-%E4%B8%80%E3%80%81%E6%8E%A5%E5%85%A5httpmock" target="_blank">配置指南
+      </a>
+    </span>
 
     <div class="right-menu">
       <el-dropdown class="avatar-container" @command="handleCommand">
@@ -51,7 +55,9 @@ export default {
       navbarLogo: {
         name: 'navbarLogo',
         src: navbarLogo
-      }
+      },
+      routeName: this.$route.name,
+      configShowMain: false
     }
   },
   computed: {
@@ -65,6 +71,7 @@ export default {
   },
   created() {
     this.getBizId()
+    this.configShow()
   },
   methods: {
     toggleSideBar() {
@@ -89,6 +96,14 @@ export default {
       this.bizShow = ele
       localStorage.setItem('key', this.bizShow)
       window.location.reload()
+    },
+    configShow() {
+      if (this.$route.meta.title === 'httpmock') {
+        console.log(this.routeName + 'la')
+        this.configShowMain = true
+      } else {
+        this.configShowMain = false
+      }
     }
   }
 }
@@ -101,7 +116,10 @@ export default {
   position: relative;
   background: #fff;
   box-shadow: 0 1px 4px rgba(0,21,41,.08);
-
+  .config {
+    margin-left: 10px;
+    margin-top: 15px;
+  }
   .hamburger-container {
     line-height: 46px;
     height: 100%;

src/router/index.js

@@ -396,17 +396,33 @@ export const constantRoutes = [
   {
     path: '/quality',
     component: Layout,
-    redirect: '/quality/qualityMeasurement.vue',
+    redirect: '/quality/qualityMarket',
     name: '质量度量',
     // hidden: true,
     meta: { title: '质量度量', icon: 'rule' },
     children: [
       {
-        path: 'qualityMeasurement',
-        name: '质量度量',
+        path: 'qualityMarket',
+        name: '质量大盘',
         // hidden: true,
-        component: () => import('@/views/quality/qualityMeasurement.vue'),
-        meta: { title: '质量度量', icon: 'rule' }
+        component: () => import('@/views/quality/qualityMarket.vue'),
+        meta: { title: '质量大盘' }
+      },
+      {
+        path: 'qualityMarket',
+        name: '质量大盘',
+        // hidden: true,
+        component: () => import('@/views/quality/qualityMarket.vue'),
+        meta: { title: '质量大盘' },
+        children: [
+          {
+            path: 'qualityProcess',
+            name: '上线过程',
+            hidden: true,
+            component: () => import('@/views/quality/qualityProcess.vue'),
+            meta: { title: '上线过程' }
+          }
+        ]
       }
     ]
   }

src/views/Platform/bugManage/bugCreate.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="set-background">
+  <div id="window-judge" class="set-background">
     <el-form ref="form" :model="form" :rules="serviceDataRules">
       <div class="block">
         <el-form-item prop="bugName" label="标题" :label-width="formLabelWidth"><el-input v-model="form.bugName" autocomplete="off" placeholder="普惠质量产品工具平台..." style="width:77.2%;" /></el-form-item>
@@ -67,7 +67,7 @@
       </div>
       <div class="block">
         <div style="display:flex;">
-          <el-form-item style="flex-grow:1" label="创建人" label-width="21%"><el-input v-model="form.creator" autocomplete="off" class="cancel-border" style="width:54.5%;" /></el-form-item>
+          <el-form-item style="flex-grow:1" label="创建人" label-width="21%"><el-input v-model="form.creator" autocomplete="off" style="width:53.5%;" /></el-form-item>
           <el-form-item style="flex-grow:1" label="bug责任人" prop="assigner" :label-width="formLabelWidth1"><el-input v-model="form.assigner" autocomplete="off" style="width:54.5%;" /></el-form-item>
         </div>
         <div style="display:flex;">
@@ -109,26 +109,24 @@
         </div>
       </div>
       <div class="block-end">
-        <div class="head">
-          <div class="font">备注</div>
-          <div>
-            <el-upload
-              class="upload-demo"
-              multiple
-              capture
-              accept="image/jpeg, image/png, image/gif, audio/mp4, video/mp4, audio/mpeg, application/vnd.ms-excel"
-              :on-change="handleChange"
-              :file-list="fileList"
-              action="http://page-daily.kuaidadi.com/upload/img.node"
-            >
-              <!-- action="http://page-daily.kuaidadi.com/upload/img.node" 线下 -->
-              <!-- action="http://star.xiaojukeji.com/upload/img.node" 线上 -->
-              <!-- action="https://jsonplaceholder.typicode.com/posts/" 原始地址-->
-              <el-button size="small" type="primary">点击上传</el-button>
-            </el-upload>
-          </div>
+        <div class="font">备注</div>
+        <el-input v-model="form.remark" type="textarea" autocomplete="off" rows="5" style="margin: 20px 0;" />
+        <div>
+          <el-upload
+            class="upload-demo"
+            multiple
+            capture
+            accept="image/jpeg, image/png, image/gif, audio/mp4, video/mp4, audio/mpeg, application/vnd.ms-excel"
+            :on-change="handleChange"
+            :file-list="fileList"
+            action="http://page-daily.kuaidadi.com/upload/img.node"
+          >
+            <!-- action="http://page-daily.kuaidadi.com/upload/img.node" 线下 -->
+            <!-- action="http://star.xiaojukeji.com/upload/img.node" 线上 -->
+            <!-- action="https://jsonplaceholder.typicode.com/posts/" 原始地址-->
+            <el-button size="small">上传附件</el-button>
+          </el-upload>
         </div>
-        <el-input v-model="form.remark" type="textarea" autocomplete="off" rows="5" />
         <el-form-item class="submit">
           <el-button size="mini" type="primary" @click="createFormData(form)">提 交</el-button>
           <el-button class="move-button" size="mini" @click="$router.go(-1)">取 消</el-button>
@@ -180,7 +178,8 @@ export default {
         bizId: '',
         taskId: '',
         platformType: '',
-        businessType: ''
+        businessType: '',
+        creator: ''
       },
       businessTypeStr: [],
       taskIdStr: '',
@@ -247,10 +246,12 @@ export default {
       })
       if (this.$route.query.id) {
         getTaskData(this.$route.query.id).then(res => {
+          console.log(res.data)
           this.taskStatus = res.data.status
           this.$set(this.form, 'taskId', res.data.name)
           this.$set(this.form, 'bizId', res.data.bizIdString)
           this.$set(this.form, 'platformType', res.data.typeString)
+          this.$set(this.form, 'creator', res.data.creater)
           if (res.data.clientType) {
             this.businessTypeShow = true
             this.$set(this.form, 'businessType', res.data.clientType)
@@ -303,6 +304,7 @@ export default {
     createFormData(form) {
       this.$refs.form.validate((valid) => {
         if (valid) {
+          console.log(form)
           if (this.$route.query.id && typeof this.form.bizId === 'string') {
             form.bizId = this.bizOptions.filter(value => value.name === form.bizId)[0].code
           }
@@ -343,8 +345,6 @@ export default {
       width 1000px
       margin-top 25px
       padding 29px 50px
-      .cancel-border >>> .el-input__inner
-        border 1px solid #fff
     .block-end
       background-color rgba(255,255,255,1)
       box-shadow 0px 0px 11px 0px rgba(238,240,245,1)
@@ -353,16 +353,12 @@ export default {
       margin-top 25px
       padding 29px 50px
       margin-bottom 22px
-      .head
-        display flex
-        justify-content space-between
-        margin-bottom 16px
-        .font
-          font-size 18px
-          font-family PingFangSC
-          font-weight 500
-          color rgba(51,59,74,1)
-          line-height 35px
+      .font
+        font-size 18px
+        font-family PingFangSC
+        font-weight 500
+        color rgba(51,59,74,1)
+        line-height 35px
       .submit
         margin-top 40px
         display flex

src/views/Platform/bugManage/bugQuery.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="set-background">
+  <div id="window-judge" class="set-background">
     <el-form :model="form">
       <div class="block">
         <el-form-item label="标题" :label-width="formLabelWidth">{{ form.bugName }}</el-form-item>
@@ -28,15 +28,27 @@
           <el-form-item label="问题原因" label-width="32%" style="margin-right: 30px;">{{ form.reason }}</el-form-item>
         </div>
       </div>
-      <div class="block-end">
+      <div class="block">
         <div class="wrap">
-          <el-form-item label="创建人 :" label-width="27%">{{ form.creator }}</el-form-item>
+          <el-form-item label="创建人 :" label-width="42%">{{ form.creator }}</el-form-item>
           <el-form-item label="bug责任人 :" label-width="36%">{{ form.assigner }}</el-form-item>
           <el-form-item label="当前处理人 :" label-width="36%">{{ currentHandler }}</el-form-item>
           <el-form-item label="开始开发时间 :" label-width="42%">{{ form.startDevTime }}</el-form-item>
           <el-form-item label="创建时间 :" label-width="32%">{{ form.gmtCreate }}</el-form-item>
           <el-form-item label="提交测试时间 :" label-width="42%">{{ form.waitTestTime }}</el-form-item>
-          <el-form-item label="reopen次数 :" label-width="41%">{{ form.reopenTimes }}</el-form-item>
+          <el-form-item label="reopen次数 :" label-width="42%">{{ form.reopenTimes }}</el-form-item>
+        </div>
+      </div>
+      <div class="block-end">
+        <div class="wrap">
+          <el-form-item label="机型 :" label-width="36%">{{ form.model }}</el-form-item>
+          <el-form-item label="地图类型 :" label-width="36%">{{ form.mapType }}</el-form-item>
+          <el-form-item label="os类型 :" label-width="36%">{{ form.osType }}</el-form-item>
+          <el-form-item label="地图版本号 :" label-width="36%">{{ form.mapVersion }}</el-form-item>
+          <el-form-item label="网络类型 :" label-width="36%">{{ form.networkType }}</el-form-item>
+          <el-form-item label="SDK版本 :" label-width="36%">{{ form.sdkVersion }}</el-form-item>
+          <el-form-item label="app版本号 :" label-width="36%">{{ form.appVersion }}</el-form-item>
+          <el-form-item label="备注 :" label-width="14%" class="remark-length">{{ form.remark }}</el-form-item>
         </div>
       </div>
     </el-form>
@@ -222,6 +234,9 @@ export default {
         flex-wrap wrap
       .wrap >>> .el-form-item__content
         width 250px
+        display block
+        word-break break-all
+        word-wrap break-word
     .block-end
       background-color rgba(255,255,255,1)
       box-shadow 0px 0px 11px 0px rgba(238,240,245,1)
@@ -235,4 +250,12 @@ export default {
         flex-wrap wrap
       .wrap >>> .el-form-item__content
         width 250px
+        display block
+        word-break break-all
+        word-wrap break-word
+      .remark-length >>> .el-form-item__content
+        width 450px
+        display block
+        word-break break-all
+        word-wrap break-word
 </style>

src/views/Platform/bugManage/bugUpdate.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="set-background">
+  <div id="window-judge" class="set-background">
     <el-form ref="form" :model="form" :rules="serviceDataRules">
       <div class="block">
         <el-form-item label="标题" prop="bugName" :label-width="formLabelWidth"><el-input v-model="form.bugName" autocomplete="off" placeholder="普惠质量产品工具平台..." style="width:77.2%;" /></el-form-item>
@@ -67,8 +67,8 @@
       </div>
       <div class="block">
         <div style="display:flex;">
-          <el-form-item style="flex-grow:1" label="创建人" label-width="21%"><el-input v-model="form.creator" autocomplete="off" class="cancel-border" style="width:54.5%;" /></el-form-item>
-          <el-form-item style="flex-grow:1" label="bug责任人" prop="assigner" :label-width="formLabelWidth1"><el-input v-model="form.assigner" autocomplete="off" style="width:54.5%;" /></el-form-item>
+          <el-form-item style="flex-grow:1" label="创建人" label-width="21%"><el-input v-model="form.creator" autocomplete="off" style="width:54.5%;" /></el-form-item>
+          <el-form-item style="flex-grow:1" label="bug责任人" prop="assigner" :label-width="formLabelWidth1"><el-input v-model="form.assigner" autocomplete="off" style="width:53.5%;" /></el-form-item>
         </div>
         <div style="display:flex;">
           <el-form-item style="flex-grow:1" label="当前处理人" prop="currentHandler" :label-width="formLabelWidth1"><el-input v-model="form.currentHandler" autocomplete="off" style="width:55%;" /></el-form-item>
@@ -109,26 +109,24 @@
         </div>
       </div>
       <div class="block-end">
-        <div class="head">
-          <div class="font">备注</div>
-          <div>
-            <el-upload
-              class="upload-demo"
-              multiple
-              capture
-              accept="image/jpeg, image/png, image/gif, audio/mp4, video/mp4, audio/mpeg, application/vnd.ms-excel"
-              :on-change="handleChange"
-              :file-list="fileList"
-              action="http://star.xiaojukeji.com/upload/img.node"
-            >
-              <!-- action="http://page-daily.kuaidadi.com/upload/img.node" 线下 -->
-              <!-- action="http://star.xiaojukeji.com/upload/img.node" 线上 -->
-              <!-- action="https://jsonplaceholder.typicode.com/posts/" 原始地址-->
-              <el-button size="small" type="primary">点击上传</el-button>
-            </el-upload>
-          </div>
+        <div class="font">备注</div>
+        <el-input v-model="form.remark" type="textarea" autocomplete="off" rows="5" style="margin: 20px 0;" />
+        <div>
+          <el-upload
+            class="upload-demo"
+            multiple
+            capture
+            accept="image/jpeg, image/png, image/gif, audio/mp4, video/mp4, audio/mpeg, application/vnd.ms-excel"
+            :on-change="handleChange"
+            :file-list="fileList"
+            action="http://star.xiaojukeji.com/upload/img.node"
+          >
+            <!-- action="http://page-daily.kuaidadi.com/upload/img.node" 线下 -->
+            <!-- action="http://star.xiaojukeji.com/upload/img.node" 线上 -->
+            <!-- action="https://jsonplaceholder.typicode.com/posts/" 原始地址-->
+            <el-button size="small">点击上传</el-button>
+          </el-upload>
         </div>
-        <el-input v-model="form.remark" type="textarea" autocomplete="off" rows="5" />
         <el-form-item class="submit">
           <el-button size="mini" type="primary" @click="createFormData(form)">提 交</el-button>
           <el-button class="move-button" size="mini" @click="$router.go(-1)">取 消</el-button>
@@ -328,8 +326,6 @@ export default {
       width 1000px
       margin-top 25px
       padding 29px 50px
-      .cancel-border >>> .el-input__inner
-        border 1px solid #fff
     .block-end
       background-color rgba(255,255,255,1)
       box-shadow 0px 0px 11px 0px rgba(238,240,245,1)
@@ -338,16 +334,12 @@ export default {
       margin-top 25px
       padding 29px 50px
       margin-bottom 22px
-      .head
-        display flex
-        justify-content space-between
-        margin-bottom 16px
-        .font
-          font-size 18px
-          font-family PingFangSC
-          font-weight 500
-          color rgba(51,59,74,1)
-          line-height 35px
+      .font
+        font-size 18px
+        font-family PingFangSC
+        font-weight 500
+        color rgba(51,59,74,1)
+        line-height 35px
       .submit
         margin-top 40px
         display flex

src/views/Platform/defectManagement.vue

@@ -1,5 +1,5 @@
 <template>
-  <div style="position:relative">
+  <div id="init-window" style="position:relative">
     <router-view />
     <!--缺陷管理-->
     <div style="position: absolute;width: 100%;">
@@ -300,8 +300,16 @@ export default {
   },
   mounted() {
     this.getQueryData()
+    this.initWindow()
   },
   methods: {
+    initWindow() {
+      if (!document.getElementById('window-judge')) {
+        document.getElementById('init-window').parentNode.style.overflow = 'auto'
+      } else {
+        document.getElementById('init-window').parentNode.style.overflow = 'hidden'
+      }
+    },
     getList() {
       this.bizJson = localStorage.getItem('key')
       this.indexPage = {

src/views/mock/httpmock.vue

@@ -5,12 +5,12 @@
         <el-input v-model="listQuery.id" placeholder="接口ID" style="width: 80px;" class="filter-item" @keyup.enter.native="handleFilter" />
         <el-input v-model="listQuery.customName" placeholder="接口名称" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
         <el-input v-model="listQuery.url" placeholder="url" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
-        <el-select v-model="listQuery.method" placeholder="method" style="width: 100px;" class="filter-item" filterable clearable @change="getMethod(listQuery.method)">
-          <el-option v-for="item in envMethod" :key="item.str" :label="item.str" :value="item.str" />
-        </el-select>
-        <el-select v-model="listQuery.returnDataTypeStr" placeholder="返回值data类型" style="width: 200px;" class="filter-item" filterable clearable @change="getDataType(listQuery.returnDataType)">
-          <el-option v-for="item in envSelectDataType" :key="item.code" :label="item.msg" :value="item.code" />
-        </el-select>
+        <!--<el-select v-model="listQuery.method" placeholder="method" style="width: 100px;" class="filter-item" filterable clearable @change="getMethod(listQuery.method)">-->
+        <!--<el-option v-for="item in envMethod" :key="item.str" :label="item.str" :value="item.str" />-->
+        <!--</el-select>-->
+        <!--<el-select v-model="listQuery.returnDataTypeStr" placeholder="返回值data类型" style="width: 200px;" class="filter-item" filterable clearable @change="getDataType(listQuery.returnDataType)">-->
+        <!--<el-option v-for="item in envSelectDataType" :key="item.code" :label="item.msg" :value="item.code" />-->
+        <!--</el-select>-->
         <el-select v-model="listQuery.status" placeholder="状态" style="width: 100px;" class="filter-item" filterable clearable>
           <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
         </el-select>
@@ -34,12 +34,12 @@
       <el-table-column label="mockURL" min-width="180px" align="center">
         <template slot-scope="scope"><span>{{ scope.row.mockUrl }}</span></template>
       </el-table-column>
-      <el-table-column label="method" min-min-width="60px">
-        <template slot-scope="{row}"><span>{{ row.method }}</span></template>
-      </el-table-column>
-      <el-table-column label="返回值data类型" min-width="110px" align="center">
-        <template slot-scope="scope"><span>{{ scope.row.returnDataTypeStr }}</span></template>
-      </el-table-column>
+      <!--<el-table-column label="method" min-min-width="60px">-->
+      <!--<template slot-scope="{row}"><span>{{ row.method }}</span></template>-->
+      <!--</el-table-column>-->
+      <!--<el-table-column label="返回值data类型" min-width="110px" align="center">-->
+      <!--<template slot-scope="scope"><span>{{ scope.row.returnDataTypeStr }}</span></template>-->
+      <!--</el-table-column>-->
       <el-table-column label="状态" class-name="status-col" min-width="100">
         <template slot-scope="{row}"><el-tag :type="row.status | statusFilter">{{ statusMaps.get(row.status) }}</el-tag></template>
       </el-table-column>
@@ -68,32 +68,44 @@
     </el-table>
     <pagination v-show="total>0" :total="total" :page.sync="listQuery.curIndex" :limit.sync="listQuery.pageSize" @pagination="getList" />
     <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" width="65%">
-      <el-form ref="serviceDataForms" :rules="serviceDataRules" :model="serviceData" label-position="left" label-width="120px" style="width: 500px; margin-left:80px;">
+      <el-form ref="serviceDataForms" :rules="checkRequest" :model="serviceData" label-position="left" label-width="120px" style="width: 500px; margin-left:80px;">
         <el-form-item label="接口名称" prop="customName">
           <el-input v-model="serviceData.customName" :disabled="shouldShow" placeholder="接口名称" />
         </el-form-item>
         <el-form-item label="url" prop="url">
-          <el-input v-model="serviceData.url" :disabled="shouldShow" placeholder="url" />
-        </el-form-item>
-        <el-form-item label="method" prop="method">
-          <el-select v-model="serviceData.method" :disabled="shouldShow" class="filter-item" filterable clearable placeholder="method">
-            <el-option v-for="item in envMethod" :key="item.str" :label="item.str" :value="item.str" />
-          </el-select>
+          <el-input v-model="serviceData.url" :disabled="shouldShow" placeholder="/getUserinfo" />
         </el-form-item>
-        <el-form-item label="返回值data类型" prop="returnDataType">
-          <el-select v-model="serviceData.returnDataTypeStr" :disabled="shouldShow" class="filter-item" filterable clearable placeholder="data类型">
-            <el-option v-for="item in envSelectDataType" :key="item.code" :label="item.msg" :value="item.code" />
-          </el-select>
+        <!--<el-form-item label="method" prop="method">-->
+        <!--<el-select v-model="serviceData.method" :disabled="shouldShow" class="filter-item" filterable clearable placeholder="method">-->
+        <!--<el-option v-for="item in envMethod" :key="item.str" :label="item.str" :value="item.str" />-->
+        <!--</el-select>-->
+        <!--</el-form-item>-->
+        <!--<el-form-item label="返回值data类型" prop="returnDataType">-->
+        <!--<el-select v-model="serviceData.returnDataTypeStr" :disabled="shouldShow" class="filter-item" filterable clearable placeholder="data类型">-->
+        <!--<el-option v-for="item in envSelectDataType" :key="item.code" :label="item.msg" :value="item.code" />-->
+        <!--</el-select>-->
+        <!--</el-form-item>-->
+        <el-form-item label="请求转发" prop="forWard">
+          <el-switch
+            v-model="serviceData.requestForWard"
+            @change="showTrueUrl"
+          />
         </el-form-item>
-        <el-form-item label="真实服务url" prop="actualUrl">
-          <el-input v-model="serviceData.actualUrl" :disabled="shouldShow" placeholder="真实服务url" />
+        <el-form-item v-show="trueUrl" label="真实服务url" prop="actualUrl">
+          <el-input v-model="serviceData.actualUrl" :disabled="shouldShow" placeholder="http://10.179.1.22:8089" />
         </el-form-item>
       </el-form>
-      <span class="showBtn" @mouseover="explain" @mouseout="explain">配置指南</span>
-      <div v-if="showexplain" class="showInfo">
-        <div class="showZm" />
-        <div class="showInfo">配置指南</div>
-      </div>
+      <span class="showBtn">
+        <a href="http://wiki.intra.xiaojukeji.com/pages/viewpage.action?pageId=213729138#id-11%E6%93%8D%E4%BD%9C%E6%89%8B%E5%86%8C-11%E6%93%8D%E4%BD%9C%E6%89%8B%E5%86%8C-%E4%B8%80%E3%80%81%E6%8E%A5%E5%85%A5httpmock" target="_blank">配置指南
+        </a>
+      </span>
+      <!--<div v-if="showexplain" class="showInfo">-->
+      <!--<div class="showZm" />-->
+      <!--<div class="showInfo">-->
+      <!--<a href="http://wiki.intra.xiaojukeji.com/pages/viewpage.action?pageId=213729138#id-11%E6%93%8D%E4%BD%9C%E6%89%8B%E5%86%8C-11%E6%93%8D%E4%BD%9C%E6%89%8B%E5%86%8C-%E4%B8%80%E3%80%81%E6%8E%A5%E5%85%A5httpmock" target="_blank">配置指南-->
+      <!--</a>-->
+      <!--</div>-->
+      <!--</div>-->
       <div slot="footer" class="dialog-footer">
         <el-button @click="dialogFormVisible = false">取消</el-button>
         <el-button v-if="showSubmitBtn" type="primary" @click="dialogStatus==='create'?createData(serviceData):updateData(serviceData)">确定</el-button>
@@ -164,7 +176,8 @@ export default {
         curIndex: 1,
         pageSize: 20,
         sort: '+id',
-        id: null
+        id: null,
+        redirect: ''
       },
       importanceOptions: [1, 2, 3],
       envSelectDataType: '',
@@ -197,7 +210,10 @@ export default {
         id: '',
         status: 1,
         actualUrl: '',
-        creator: ''
+        creator: '',
+        ruleDesc: '',
+        redirect: '',
+        requestForWard: false
       },
       serviceDataExt: {
         id: 0
@@ -215,7 +231,23 @@ export default {
         url: [{ required: true, message: 'url不能为空', trigger: 'change' }],
         method: [{ required: true, message: 'method不能为空', trigger: 'change' }]
       },
-      downloadLoading: false
+      downloadLoading: false,
+      trueUrl: false,
+      serviceRequestFoward: {
+        customName: [{ required: true, message: '接口名称不能为空', trigger: 'change' }],
+        url: [{ required: true, message: 'url不能为空', trigger: 'change' }],
+        method: [{ required: true, message: 'method不能为空', trigger: 'change' }],
+        actualUrl: [{ required: true, message: '真实服务url不能为空', trigger: 'change' }]
+      }
+    }
+  },
+  computed: {
+    checkRequest: function() {
+      if (this.serviceData.requestForWard) {
+        return this.serviceRequestFoward
+      } else {
+        return this.serviceDataRules
+      }
     }
   },
   created() {
@@ -233,13 +265,13 @@ export default {
         this.listLoading = false
       })
     },
-    explain() {
-      if (this.showexplain === false) {
-        this.showexplain = true
-      } else {
-        this.showexplain = false
-      }
-    },
+    // explain() {
+    //   if (this.showexplain === false) {
+    //     this.showexplain = true
+    //   } else {
+    //     this.showexplain = false
+    //   }
+    // },
     // 获取method方法
     mockGetMethod() {
       this.envMethod = []
@@ -314,7 +346,9 @@ export default {
         id: '',
         status: 1,
         actualUrl: '',
-        creator: ''
+        creator: '',
+        ruleDesc: '',
+        requestForWard: false
       }
     },
     // hearder新增时调用
@@ -324,6 +358,8 @@ export default {
       this.dialogStatus = 'create'
       this.dialogFormVisible = true
       this.showSubmitBtn = true
+      this.serviceData.requestForWard = false
+      this.trueUrl = false
       this.$nextTick(() => {
         this.$refs['serviceDataForms'].clearValidate()
       })
@@ -334,7 +370,8 @@ export default {
         if (valid) {
           this.serviceData = ele
           this.serviceData.id = ''
-          this.serviceData.returnDataType === '' ? this.serviceData.returnDataType = '512' : this.serviceData.returnDataType = ele.returnDataTypeStr
+          this.serviceData.returnDataType === 512
+          if (this.serviceData.requestForWard) { this.serviceData.redirect = 1 } else { this.serviceData.redirect = 0 }
           createService(this.serviceData).then(response => {
             if (response.code === 200) {
               this.dialogFormVisible = false
@@ -353,12 +390,13 @@ export default {
         id: row.id,
         url: row.url,
         customName: row.customName,
-        returnDataType: row.returnDataType,
+        returnDataType: '512',
         actualUrl: row.actualUrl,
         creator: row.creator,
         method: row.method,
         // returnDataTypeStr: row.returnDataTypeStr,
-        mockUrl: row.mockUrl
+        mockUrl: row.mockUrl,
+        redirect: row.redirect
       }
       var rowList = row
       this.shouldShow = false
@@ -374,9 +412,14 @@ export default {
           this.serviceData.method = rowList.method
           this.serviceData.returnDataTypeStr = rowList.returnDataTypeStr
           this.serviceData.mockUrl = rowList.mockUrl
+          this.serviceData.redirect = row.redirect
+          if (this.serviceData.redirect === 1) { this.serviceData.requestForWard = true } else { this.serviceData.requestForWard = false }
+          this.serviceData.actualUrl = row.actualUrl
+          this.showTrueUrl()
           this.dialogStatus = 'update'
           this.dialogFormVisible = true
           this.showSubmitBtn = true
+          this.requestForWard = false
           this.$nextTick(() => {
             this.$refs['serviceDataForms'].clearValidate()
           })
@@ -386,7 +429,7 @@ export default {
     // 查看
     handleCheck(row) {
       this.shouldShow = true
-      this.serviceData = row
+      // this.serviceData = row
       // var queryData = { id: row.id }
       // fetchServiceList(queryData).then(response => {
       // var rowData = response.data.mockMethodList
@@ -401,9 +444,16 @@ export default {
       // this.serviceData.method = row.method
       // this.serviceData.returnDataTypeStr = row.returnDataTypeStr
       // this.serviceData.mockUrl = row.mockUrl
+      this.serviceData.customName = row.customName
       this.dialogStatus = 'update'
       this.dialogFormVisible = true
       this.showSubmitBtn = false
+      // this.serviceData.redirect = 1
+      this.serviceData.redirect = row.redirect
+      if (this.serviceData.redirect === 1) { this.serviceData.requestForWard = true } else { this.serviceData.requestForWard = false }
+      this.serviceData.actualUrl = row.actualUrl
+      this.showTrueUrl()
+      // this.serviceData.requestForWard === 'true' ? this.serviceData.redirect === 1 : this.serviceData.redirect
       // this.$nextTick(() => {
       //   this.$refs['serviceDataForms'].clearValidate()
       // })
@@ -427,6 +477,10 @@ export default {
       this.dialogStatus = 'create'
       this.dialogFormVisible = true
       this.showSubmitBtn = true
+      this.serviceData.redirect = row.redirect
+      if (this.serviceData.redirect === 1) { this.serviceData.requestForWard = true } else { this.serviceData.requestForWard = false }
+      this.serviceData.actualUrl = row.actualUrl
+      this.showTrueUrl()
       // this.$nextTick(() => {
       //   this.$refs['serviceDataForms'].clearValidate()
       // })
@@ -445,8 +499,9 @@ export default {
             actualUrl: this.serviceData.actualUrl,
             status: this.serviceData.status,
             creator: this.serviceData.creator,
-            returnDataType: ele.returnDataTypeStr,
-            mockUrl: this.serviceData.mockUrl
+            returnDataType: '512',
+            mockUrl: this.serviceData.mockUrl,
+            redirect: this.serviceData.redirect
           }
           updateService(tempData).then(response => {
             if (response.code === 200) {
@@ -474,6 +529,17 @@ export default {
       this.$router.push({
         path: `/mock/httpmock/${id}`, query: { mehtodName: mehtodName, methodProtocol: methodProtocol }
       })
+    },
+    showTrueUrl() {
+      if (this.serviceData.requestForWard === true) {
+        this.trueUrl = true
+        this.serviceData.requestForWard = true
+        this.serviceData.redirect = 1
+      } else {
+        this.trueUrl = false
+        this.serviceData.requestForWard = false
+        this.serviceData.redirect = 0
+      }
     }
   }
 }

src/views/mock/httprule.vue

@@ -2,7 +2,7 @@
   <div class="app-container">
     <el-header style="height:auto;!improtant">
       <div class="filter-container" style="padding-bottom: 20px;!improtant">
-        <el-input v-model="listQuery.whenScript" disabled placeholder="any" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        <el-input v-model="listQuery.ruleDesc" placeholder="规则描述" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
         <el-input v-model="listQuery.execSort" placeholder="优先级" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
         <!-- <el-input-number v-model="listQuery.execSort" label="优先级" :min="1" :max="100" /> -->
         <el-select v-model="listQuery.status" class="filter-item" filterable clearable placeholder="状态">
@@ -38,22 +38,28 @@
           <span>{{ scope.row.id }}</span>
         </template>
       </el-table-column>
+      <el-table-column label="规则描述" prop="desc" sortable="custom" align="center" min-width="80px">
+        <template slot-scope="scope">
+          <span v-show="desc">{{ scope.row.ruleDesc|lengthFilter }}</span>
+          <!--<span v-show="listQuery.ruleDescSeen" @mouseleave="descLeave">{{ scope.row.ruleDesc}}</span>-->
+        </template>
+      </el-table-column>
       <el-table-column label="接口ID" min-width="80px" align="center">
         <!-- <template slot-scope="scope"> -->
         <span>{{ this.$route.path.split('/')[3] }}</span>
         <!-- </template> -->
       </el-table-column>
-      <el-table-column label="方法协议" min-width="150px" align="center">
-        <!-- <template slot-scope="scope"> -->
-        <span>{{ this.$route.query.methodProtocol }}</span>
-        <!-- </template> -->
-      </el-table-column>
-      <el-table-column label="规则" min-min-width="60px">
-        <template slot-scope="{row}">
-          <span>{{ row.whenScript }}</span>
-          <!-- <el-tag>{{ row.type | typeFilter }}</el-tag> -->
-        </template>
-      </el-table-column>
+      <!--<el-table-column label="方法协议" min-width="150px" align="center">-->
+      <!--&lt;!&ndash; <template slot-scope="scope"> &ndash;&gt;-->
+      <!--<span>{{ this.$route.query.methodProtocol }}</span>-->
+      <!--&lt;!&ndash; </template> &ndash;&gt;-->
+      <!--</el-table-column>-->
+      <!--<el-table-column label="规则" min-min-width="60px">-->
+      <!--<template slot-scope="{row}">-->
+      <!--<span>{{ row.whenScript }}</span>-->
+      <!--&lt;!&ndash; <el-tag>{{ row.type | typeFilter }}</el-tag> &ndash;&gt;-->
+      <!--</template>-->
+      <!--</el-table-column>-->
       <el-table-column label="优先级" min-width="110px" align="center">
         <template slot-scope="scope">
           <span>{{ scope.row.execSort }}</span>
@@ -110,6 +116,9 @@
         <el-form-item label="规则" prop="whenScript">
           <el-input v-model="ruleData.whenScript" placeholder="any" disabled />
         </el-form-item>
+        <el-form-item label="规则描述" prop="ruleDesc">
+          <el-input v-model="ruleData.ruleDesc" placeholder="请输入规则描述" />
+        </el-form-item>
         <el-form-item label="优先级" prop="execSort">
           <el-input-number v-model="ruleData.execSort" label="优先级" :min="1" :max="100" title="值越大，优先级越高" />
         </el-form-item>
@@ -164,7 +173,14 @@ export default {
         0: 'danger'
       }
       return statusMap[status]
+    },
+    lengthFilter(value) {
+      if (value.length >= 20) {
+        return value.slice(0, 20) + '...'
+      }
+      return value
     }
+
   },
   data() {
     return {
@@ -180,12 +196,14 @@ export default {
       listQuery: {
         curIndex: 1,
         pageSize: 20,
-        whenScript: 'any',
+        whenScript: '',
         methodId: 0,
         execSort: null,
         status: null,
         methodName: '',
-        methodProtocol: 'http'
+        methodProtocol: 'http',
+        ruleDesc: '',
+        ruleDescSeen: false
       },
       showSubmit: true,
       jsonTit: `{ 'code': 200, 'data': { 'crowdComposition': 'U_866', 'campaignId': 789, 'id': 4606, 'class': 'com.didi.prado.config.api.dto.CampaignCrowdDTO'}}`,
@@ -198,6 +216,7 @@ export default {
         methodName: '',
         execSort: 1,
         whenScript: '',
+        ruleDesc: '',
         returnMessage: '',
         curIndex: 1,
         pageSize: 20,
@@ -214,7 +233,8 @@ export default {
       roleDataRules: {
         whenScript: [{ required: true, message: '规则不能为空', trigger: 'change' }],
         execSort: [{ required: true, message: '优先级1-100', trigger: 'change' }],
-        returnMessage: [{ required: true, message: '不能为空', trigger: 'change' }]
+        returnMessage: [{ required: true, message: '不能为空', trigger: 'change' }],
+        ruleDesc: [{ required: true, message: '规则描述不能为空', trigger: 'change' }]
         // interfaceName: [{ required: true, message: '接口名称不能为空', trigger: 'change' }],
         // serviceVersion: [{ required: true, message: '服务版本不能为空', trigger: 'change' }],
         // protocol: [{ required: true, message: '请选择协议类型', trigger: 'change' }],
@@ -223,7 +243,8 @@ export default {
         // methodParamsTypes: [{ required: true, message: '入参类型不能为空', trigger: 'change' }],
         // returnDataStructure: [{ required: true, message: '返回值类型不能为空', trigger: 'change' }]
       },
-      downloadLoading: false
+      downloadLoading: false,
+      desc: true
     }
   },
   created() {
@@ -430,7 +451,7 @@ export default {
     updateData() {
       this.$refs['ruleDataForm'].validate((valid) => {
         if (valid) {
-        //   const tempData = Object.assign({}, this.ruleData)
+          //   const tempData = Object.assign({}, this.ruleData)
           const tempData = {
             id: this.ruleData.id,
             methodId: parseInt(this.$route.path.split('/')[3]),
@@ -476,6 +497,15 @@ export default {
           this.$refs['ruleDataForm'].clearValidate()
         })
       })
+    },
+    descEnter(index, row) {
+      console.log(index, row + 'sss')
+      this.listQuery.ruleDescSeen = true
+      this.desc = false
+    },
+    descLeave(row) {
+      this.listQuery.ruleDescSeen = false
+      this.desc = true
     }
   }
 }

src/views/quality/qualityMarket.vue

@@ -0,0 +1,496 @@
+
+<template>
+  <div id="init-window" style="position:relative">
+    <router-view />
+    <div style="position: absolute;width: 100%;">
+      <el-container class="set-background">
+        <el-header class="header">
+          <el-menu :default-active="activeIndex" class="el-menu-demo" active-text-color="#409EFF" mode="horizontal" @select="handleSelect">
+            <el-menu-item index="0">业务线数据</el-menu-item>
+            <el-menu-item index="2">部门数据</el-menu-item>
+          </el-menu>
+          <el-date-picker
+            v-model="value1"
+            type="daterange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+          />
+        </el-header>
+        <el-container>
+          <el-aside class="aside">
+            <el-tree :data="businessData" :props="defaultProps" icon-class="el-icon-watermelon" style="margin-top:20px" @node-click="handleNodeClick" />
+          </el-aside>
+          <el-main class="combine-table">
+            <el-menu :default-active="activeIndex1" class="el-menu-demo" active-text-color="#409EFF" mode="horizontal" @select="handleSelect">
+              <el-menu-item index="3">质量大盘</el-menu-item>
+            </el-menu>
+            <!-- 上线过程 -->
+            <h4>1.上线过程</h4>
+            <el-table
+              :data="tableData"
+              border
+              style="width: 100%"
+            >
+              <el-table-column
+                prop="date"
+                label="上线次数"
+                style="width:50%;"
+                align="center"
+              />
+              <el-table-column
+                prop="name"
+                label="免提测上线数"
+                style="width:50%;"
+                align="center"
+              />
+            </el-table>
+            <el-table
+              :data="tableData"
+              border
+              style="width: 100%"
+              class="move-border-top"
+            >
+              <el-table-column
+                prop="date"
+                label="回滚数据"
+                style="width:100%;"
+                align="center"
+              >
+                <el-table-column
+                  prop="date"
+                  label="回滚次数"
+                  style="width:20%;"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="免提测回滚数"
+                  style="width:20%;"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="预发回滚数"
+                  style="width:20%;"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="小流量回滚数"
+                  style="width:20%;"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="全量回滚数"
+                  style="width:20%;"
+                  align="center"
+                />
+              </el-table-column>
+            </el-table>
+            <el-table
+              :data="tableData"
+              border
+              style="width: 100%"
+              class="move-border-top"
+            >
+              <el-table-column
+                prop="date"
+                label="预发具备率"
+                align="center"
+                width="calc(10/9)%"
+              />
+              <el-table-column
+                prop="name"
+                label="有预发不走预发占比"
+                align="center"
+                width="calc(10/9)%"
+              />
+              <el-table-column
+                prop="name"
+                label="被动免提测率"
+                align="center"
+                width="calc(10/9)%"
+              />
+              <el-table-column
+                prop="name"
+                label="免提测上线占比"
+                align="center"
+                width="calc(10/9)%"
+              />
+              <el-table-column
+                prop="name"
+                label="回滚率"
+                align="center"
+                width="calc(10/9)%"
+              />
+              <el-table-column
+                prop="name"
+                label="免提测回滚占比"
+                align="center"
+                width="calc(10/9)%"
+              />
+              <el-table-column
+                prop="name"
+                label="预发回滚率"
+                align="center"
+                width="calc(10/9)%"
+              />
+              <el-table-column
+                prop="name"
+                label="小流量回滚率"
+                align="center"
+                width="calc(10/9)%"
+              />
+              <el-table-column
+                prop="name"
+                label="全量回滚数"
+                align="center"
+                width="calc(10/9)%"
+              />
+            </el-table>
+            <el-table
+              :data="tableData"
+              border
+              style="width: 100%"
+              class="move-border-top"
+            >
+              <el-table-column
+                prop="date"
+                label="预发停留<5min占比"
+                style="width:25%;"
+                align="center"
+              />
+              <el-table-column
+                prop="name"
+                label="小流量停留<5min占比"
+                style="width:25%;"
+                align="center"
+              />
+              <el-table-column
+                prop="name"
+                label="裸奔上线占比"
+                style="width:25%;"
+                align="center"
+              />
+              <el-table-column
+                prop="name"
+                label="紧急上线占比"
+                style="width:25%;"
+                align="center"
+              />
+            </el-table>
+            <!-- 线上问题 -->
+            <h4>2.线上问题</h4>
+            <el-table
+              :data="tableData"
+              border
+              style="width: 100%"
+            >
+              <el-table-column
+                prop="date"
+                label="上线次数"
+                width="170"
+                align="center"
+              />
+              <el-table-column
+                prop="name"
+                label="免提测上线数"
+                align="center"
+              >
+                <el-table-column
+                  prop="date"
+                  label="P0"
+                  width="calc(10/7)%"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="P1"
+                  width="calc(10/7)%"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="P2"
+                  width="calc(10/7)%"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="P3"
+                  width="calc(10/7)%"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="P4"
+                  width="calc(10/7)%"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="P5"
+                  width="calc(10/7)%"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="P6"
+                  width="calc(10/7)%"
+                  align="center"
+                />
+              </el-table-column>
+            </el-table>
+            <el-table
+              :data="tableData"
+              border
+              style="width: 100%"
+              class="move-border-top"
+            >
+              <el-table-column
+                prop="date"
+                label="未定责P5+问题"
+                style="width:25%;"
+                align="center"
+              />
+              <el-table-column
+                prop="date"
+                label="遗留P5+问题定责"
+                style="width:25%;"
+                align="center"
+              />
+              <el-table-column
+                prop="date"
+                label="线上问题处理完成率"
+                style="width:25%;"
+                align="center"
+              />
+              <el-table-column
+                prop="date"
+                label="线上问题平均处理时长(H)"
+                style="width:25%;"
+                align="center"
+              />
+            </el-table>
+            <!-- 线上缺陷 -->
+            <h4>3.线上缺陷</h4>
+            <el-table
+              :data="tableData"
+              border
+              style="width: 100%"
+            >
+              <el-table-column
+                prop="date"
+                label="提报bug数"
+                align="center"
+              />
+              <el-table-column
+                prop="name"
+                label="缺陷分级"
+                align="center"
+              >
+                <el-table-column
+                  prop="date"
+                  label="P0"
+                  width="40"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="P1"
+                  width="40"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="P2"
+                  width="40"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="P3"
+                  width="40"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="P4"
+                  width="40"
+                  align="center"
+                />
+              </el-table-column>
+              <el-table-column
+                prop="date"
+                label="缺陷阶段"
+                align="center"
+              >
+                <el-table-column
+                  prop="date"
+                  label="准入"
+                  width="49"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="测试"
+                  width="49"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="准出"
+                  width="49"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="预发"
+                  width="49"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="其他"
+                  width="49"
+                  align="center"
+                />
+                <el-table-column
+                  prop="date"
+                  label="众测"
+                  width="49"
+                  align="center"
+                />
+              </el-table-column>
+              <el-table-column
+                prop="date"
+                label="核心指标"
+                align="center"
+              >
+                <el-table-column
+                  prop="date"
+                  label="人均bug数"
+                  align="center"
+                />
+              </el-table-column>
+              <el-table-column
+                prop="date"
+                label="bug修复率"
+                align="center"
+              />
+            </el-table>
+          </el-main>
+        </el-container>
+      </el-container>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getBusiness, getDepartment, getOnlineAllCount } from '@/api/qualityCenter'
+
+export default {
+  data() {
+    return {
+      tableData: [{
+        date: '20',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }
+      ],
+      businessData: [],
+      defaultProps: {
+        children: 'child',
+        label: 'name'
+      },
+      activeIndex: '0',
+      activeIndex1: '3',
+      value1: ''
+    }
+  },
+  created() {
+    this._initBusinessTreeAndBeginInfo()
+  },
+  mounted() {
+    this._initWindow()
+  },
+  methods: {
+    _initWindow() {
+      if (!document.getElementById('window-judge')) {
+        document.getElementById('init-window').parentNode.style.overflow = ''
+      } else {
+        document.getElementById('init-window').parentNode.style.overflow = 'hidden'
+      }
+    },
+    async _initBusinessTreeAndBeginInfo() {
+      await getBusiness().then(res => {
+        res.code === 0 ? this.businessData = res.data : ''
+      })
+      const pretermitSearch = { id: this.businessData[0].id, type: 0 }
+      console.log(pretermitSearch)
+      getOnlineAllCount(pretermitSearch).then(res => {
+        console.log(res.data)
+      })
+    },
+    initDepartmentTree() {
+      getDepartment().then(res => {
+        res.code === 0 ? this.businessData = res.data : ''
+      })
+    },
+    handleSelect(key) {
+      if (key === '0') {
+        this._initBusinessTree()
+      } else if (key === '2') {
+        this.initDepartmentTree()
+      } else {
+        this.errorFun()
+      }
+    },
+    handleNodeClick(data) {
+      console.log(data)
+    },
+    successFun() {
+      this.$notify({ title: 'Success', message: 'initialization Successfully', type: 'success', duration: 2000 })
+    },
+    errorFun() {
+      this.$notify({ title: 'Failed', message: 'initialization Failed', type: 'error', duration: 2000 })
+    }
+  }
+}
+</script>
+
+<style lang="stylus" scoped>
+  .set-background
+    background-color #F2F3F6
+    .header
+      width 90%
+      background-color white
+      border-radius 7px
+      margin 15px auto 25px auto
+      display flex
+      justify-content space-between
+      align-items center
+    .aside
+      width 170px !important
+      margin 0 0 2% 5%
+      background-color white
+      border-radius 7px
+    .combine-table
+      background-color white
+      border-radius 7px
+      width 72.7%
+      margin 0 0 2% 1.5%
+      flex 0 1 auto !important
+    .combine-table >>> .el-menu
+      border-bottom 0px
+      margin -20px 0 15px 0
+    .combine-table >>> .is-active
+      font-weight bold
+    .combine-table >>> th
+      background-color #F0F7FF !important
+      font-size 10px
+    .combine-table >>> .move-border-top
+      border-top 0px
+</style>

src/views/quality/qualityMeasurement.vue

@@ -1,7 +1,7 @@
 
 <template>
   <!-- 质量度量 -->
-  <el-container>
+  <!-- <el-container>
     <el-aside width="14%" style="margin:1%; height:100%; box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)">
       <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" />
     </el-aside>
@@ -222,97 +222,265 @@
         </el-tab-pane>
       </el-tabs>
     </el-main>
-  </el-container>
+  </el-container> -->
+  <div>
+    <div class="combine-table">
+      <el-table
+        :data="tableData"
+        border
+        style="width: 80%"
+      >
+        <el-table-column
+          prop="date"
+          label="上线次数"
+          style="width:50%;"
+          align="center"
+        />
+        <el-table-column
+          prop="name"
+          label="免提测上线数"
+          style="width:50%;"
+          align="center"
+        />
+      </el-table>
+      <el-table
+        :data="tableData"
+        border
+        style="width: 80%"
+        class="move-border-top"
+      >
+        <el-table-column
+          prop="date"
+          label="回滚数据"
+          style="width:100%;"
+          align="center"
+        >
+          <el-table-column
+            prop="date"
+            label="回滚次数"
+            style="width:20%;"
+            align="center"
+          />
+          <el-table-column
+            prop="date"
+            label="免提测回滚数"
+            style="width:20%;"
+            align="center"
+          />
+          <el-table-column
+            prop="date"
+            label="预发回滚数"
+            style="width:20%;"
+            align="center"
+          />
+          <el-table-column
+            prop="date"
+            label="小流量回滚数"
+            style="width:20%;"
+            align="center"
+          />
+          <el-table-column
+            prop="date"
+            label="全量回滚数"
+            style="width:20%;"
+            align="center"
+          />
+        </el-table-column>
+      </el-table>
+      <el-table
+        :data="tableData"
+        border
+        style="width: 80%"
+        class="move-border-top"
+      >
+        <el-table-column
+          prop="date"
+          label="预发具备率"
+          align="center"
+        />
+        <el-table-column
+          prop="name"
+          label="有预发不走预发占比"
+          align="center"
+          width="150"
+        />
+        <el-table-column
+          prop="name"
+          label="被动免提测率"
+          align="center"
+        />
+        <el-table-column
+          prop="name"
+          label="免提测上线占比"
+          align="center"
+          width="120"
+        />
+        <el-table-column
+          prop="name"
+          label="回滚率"
+          align="center"
+        />
+        <el-table-column
+          prop="name"
+          label="免提测回滚占比"
+          align="center"
+          width="120"
+        />
+        <el-table-column
+          prop="name"
+          label="预发回滚率"
+          align="center"
+        />
+        <el-table-column
+          prop="name"
+          label="小流量回滚率"
+          align="center"
+        />
+        <el-table-column
+          prop="name"
+          label="全量回滚数"
+          align="center"
+        />
+      </el-table>
+      <el-table
+        :data="tableData"
+        border
+        style="width: 80%"
+        class="move-border-top"
+      >
+        <el-table-column
+          prop="date"
+          label="预发停留<5min占比"
+          style="width:25%;"
+          align="center"
+        />
+        <el-table-column
+          prop="name"
+          label="小流量停留<5min占比"
+          style="width:25%;"
+          align="center"
+        />
+        <el-table-column
+          prop="name"
+          label="裸奔上线占比"
+          style="width:25%;"
+          align="center"
+        />
+        <el-table-column
+          prop="name"
+          label="紧急上线占比"
+          style="width:25%;"
+          align="center"
+        />
+      </el-table>
+    </div>
+  </div>
 </template>
 
 <script>
 // import { apiBusinessLineAll } from '@/api/qualityMeasurement.js'
 // import Json from '@/api/home.json'
 export default {
-  name: 'QualityMeasurement',
   data() {
     return {
-      bizName: '业务线',
-      bizData: '海马',
-      inputLabel: '100px',
-      statusOptionss: [],
       tableData: [{
         date: '2016-05-02',
         name: '王小虎',
-        address: '上海市普陀区金沙'
-      }],
-      formInline: {
-        user: '',
-        region: ''
-      },
-      data: [{
-        label: '一级 1',
-        children: [{
-          label: '二级 1-1',
-          children: [{
-            label: '三级 1-1-1'
-          }]
-        }]
-      }, {
-        label: '一级 2',
-        children: [{
-          label: '二级 2-1',
-          children: [{
-            label: '三级 2-1-1'
-          }]
-        }, {
-          label: '二级 2-2',
-          children: [{
-            label: '三级 2-2-1'
-          }]
-        }]
-      }, {
-        label: '一级 3',
-        children: [{
-          label: '二级 3-1',
-          children: [{
-            label: '三级 3-1-1'
-          }]
-        }, {
-          label: '二级 3-2',
-          children: [{
-            label: '三级 3-2-1'
-          }]
-        }]
-      }],
-      defaultProps: {
-        children: 'children',
-        label: 'label'
+        address: '上海市普陀区金沙江路 1518 弄'
       }
+      ]
     }
-  },
-  created() {
-    this.getNav()
-  },
-  methods: {
+  }
+  // name: 'QualityMeasurement',
+  // data() {
+  //   return {
+  //     bizName: '业务线',
+  //     bizData: '海马',
+  //     inputLabel: '100px',
+  //     statusOptionss: [],
+  //     tableData: [{
+  //       date: '2016-05-02',
+  //       name: '王小虎',
+  //       address: '上海市普陀区金沙'
+  //     }],
+  //     formInline: {
+  //       user: '',
+  //       region: ''
+  //     },
+  //     data: [{
+  //       label: '一级 1',
+  //       children: [{
+  //         label: '二级 1-1',
+  //         children: [{
+  //           label: '三级 1-1-1'
+  //         }]
+  //       }]
+  //     }, {
+  //       label: '一级 2',
+  //       children: [{
+  //         label: '二级 2-1',
+  //         children: [{
+  //           label: '三级 2-1-1'
+  //         }]
+  //       }, {
+  //         label: '二级 2-2',
+  //         children: [{
+  //           label: '三级 2-2-1'
+  //         }]
+  //       }]
+  //     }, {
+  //       label: '一级 3',
+  //       children: [{
+  //         label: '二级 3-1',
+  //         children: [{
+  //           label: '三级 3-1-1'
+  //         }]
+  //       }, {
+  //         label: '二级 3-2',
+  //         children: [{
+  //           label: '三级 3-2-1'
+  //         }]
+  //       }]
+  //     }],
+  //     defaultProps: {
+  //       children: 'children',
+  //       label: 'label'
+  //     }
+  //   }
+  // },
+  // created() {
+  //   this.getNav()
+  // },
+  // methods: {
 
-    getNav() {
-      // console.log(Json)
-      // this.$http.get('../../../static/home.json').then(function(res) { console.log(res) })
-    }
+  //   getNav() {
+  //     // console.log(Json)
+  //     // this.$http.get('../../../static/home.json').then(function(res) { console.log(res) })
+  //   }
 
-  },
-  handleNodeClick(data) {
-    console.log(data)
-  },
-  handleClick(tab, event) {
-    console.log(tab, event)
-  },
-  onSubmit() {
-    console.log('submit!')
-  }
+  // },
+  // handleNodeClick(data) {
+  //   console.log(data)
+  // },
+  // handleClick(tab, event) {
+  //   console.log(tab, event)
+  // },
+  // onSubmit() {
+  //   console.log('submit!')
+  // }
 }
 </script>
 
-<style scoped>
-.selectWidth {
+<style lang="stylus" scoped>
+/* .selectWidth {
   width: 59%;
  margin-left: -8%;
-}
+} */
+  .combine-table
+    margin 20px
+  .combine-table >>> th
+    background-color #F0F7FF !important
+    font-size 10px
+  .combine-table >>> .move-border-top
+    border-top 0px
 </style>
-

src/views/quality/qualityProcess.vue

@@ -0,0 +1,164 @@
+
+<template>
+  <div id="window-judge" class="set-background">
+    <div class="block">
+      <div style="text-align:right;">
+        <el-link type="primary">指标计算指南</el-link>
+      </div>
+      <div class="title-search-output">
+        <div>上线过程</div>
+        <div class="search-output">
+          <el-input v-model="input" style="margin-right:5px" />
+          <el-button plain type="info" style="margin-right:35px">搜索</el-button>
+          <el-button type="primary">导出</el-button>
+        </div>
+      </div>
+      <el-table
+        :data="tableData"
+        border
+        style="width: 100%"
+      >
+        <el-table-column
+          prop="date"
+          label="模块"
+          align="center"
+          width="50"
+        />
+        <el-table-column
+          prop="name"
+          label="上线单号"
+          align="center"
+          width="70"
+        />
+        <el-table-column
+          prop="name"
+          label="项目名称"
+          align="center"
+          width="70"
+        />
+        <el-table-column
+          prop="name"
+          label="上线人"
+          align="center"
+          width="60"
+        />
+        <el-table-column
+          prop="name"
+          label="是否免提测"
+          align="center"
+        />
+        <el-table-column
+          prop="name"
+          label="有预发环境/走预发环境"
+          align="center"
+        />
+        <el-table-column
+          prop="name"
+          label="上线时间"
+          align="center"
+          width="70"
+        />
+        <el-table-column
+          prop="name"
+          label="上线阶段"
+          align="center"
+          width="70"
+        />
+        <el-table-column
+          prop="name"
+          label="预发停留时长"
+          align="center"
+          width="60"
+        />
+        <el-table-column
+          prop="name"
+          label="小流量停留时长"
+          align="center"
+          width="70"
+        />
+        <el-table-column
+          prop="name"
+          label="状态"
+          align="center"
+          width="50"
+        />
+        <el-table-column
+          prop="name"
+          label="状态信息"
+          align="center"
+          width="70"
+        />
+        <el-table-column
+          prop="name"
+          label="标志信息"
+          align="center"
+          width="70"
+        />
+      </el-table>
+      <el-pagination style="margin-top:30px;" align="center" :current-page="curIndex" :page-sizes="[5, 10, 20]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
+    </div>
+  </div>
+</template>
+
+<script>
+// import { apiBusinessLineAll } from '@/api/qualityMeasurement.js'
+// import Json from '@/api/home.json'
+export default {
+  data() {
+    return {
+      tableData: [{
+        date: '20',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路 1518 弄'
+      }
+      ],
+      input: '',
+      curIndex: 0,
+      pageSize: 5,
+      total: 0
+    }
+  },
+  methods: {
+    handleSizeChange(size) {
+      this.pageSize = size
+      // this.getList()
+    },
+    handleCurrentChange(curIndex) {
+      this.curIndex = curIndex
+      // this.getList()
+    }
+  }
+}
+</script>
+
+<style lang="stylus" scoped>
+  .set-background
+    background-color #F2F3F6
+    display flex
+    justify-content center
+    .block
+      background-color rgba(255,255,255,1)
+      box-shadow 0px 0px 11px 0px rgba(238,240,245,1)
+      border-radius 7px
+      width 95%
+      min-height calc(100vh - 100px)
+      margin-top 25px
+      padding 29px 50px
+      margin-bottom 22px
+      .title-search-output
+        display flex
+        align-items center
+        justify-content space-between
+        margin 15px 0
+        .search-output
+          display flex
+          justify-content space-around
+    .block >>> th
+      background-color #F0F7FF !important
+      font-size 10px
+    .block >>> .cell
+      font-size 10px
+      white-space nowrap
+      text-overflow ellipsis
+      overflow hidden
+</style>