Merge branch 'qinqiao' of git.xiaojukeji.com:jacklijiajia/thoth-frontend into qinqiao

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/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/httprule.vue

@@ -2,13 +2,11 @@
   <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.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="状态">
-          <el-option v-for="item in ruleStatus" :key="item.key" :label="item.display_name" :value="item.key" />
+        <el-input v-model="listQuery.ruleDesc" placeholder="名称" style="width:130px;margin:0 -1.5px;" class="filter-item" @keyup.enter.native="handleFilter" />&nbsp;&nbsp;
+        <el-input v-model="listQuery.execSort" placeholder="优先级" style="width:130px;margin:0 -1.5px;" class="filter-item" @keyup.enter.native="handleFilter" />&nbsp;&nbsp;
+        <el-select v-model="listQuery.status" class="filter-item" filterable clearable placeholder="状态" style="width:130px;margin:0 -1.5px;">
+          <el-option v-for="item1 in ruleStatus" :key="item1.key" :label="item1.display_name" :value="item1.key" />
         </el-select>
-        <!-- <el-input v-model="listQuery.interfaceName" placeholder="接口类" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" /> -->
         <el-button v-waves class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">
           搜索
         </el-button>
@@ -57,9 +55,9 @@
       //<!-- <el-tag>{{ row.type | typeFilter }}</el-tag> -->
       <!-- </template>
       </el-table-column> -->
-      <el-table-column label="优先级" min-width="110px" align="center">
+      <el-table-column label="规则描述" min-width="110px" align="center">
         <template slot-scope="scope">
-          <span>{{ scope.row.execSort }}</span>
+          <span>{{ scope.row.ruleDesc }}</span>
         </template>
       </el-table-column>
       <el-table-column label="http请求URL" min-width="110px" align="center">
@@ -91,13 +89,13 @@
       </el-table-column>
       <el-table-column label="操作" align="center" min-width="370" class-name="small-padding fixed-width" fixed="right">
         <template slot-scope="{row}">
-          <el-button type="primary" size="mini" @click="handleCheck(row)">
+          <el-button type="primary" size="mini" @click="handleUpdate(row,'check')">
             查看
           </el-button>
-          <el-button type="primary" size="mini" @click="handleUpdate(row)">
+          <el-button type="primary" size="mini" @click="handleUpdate(row,'update')">
             编辑
           </el-button>
-          <el-button type="primary" size="mini" @click="handleCopy(row)">
+          <el-button type="primary" size="mini" @click="handleUpdate(row,'copy')">
             复制
           </el-button>
           <el-button type="primary" size="mini">
@@ -115,15 +113,22 @@
     <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="85%" @open="returnMessageData">
 
-      <el-form ref="ruleForm" :rules="rulesCheck" :model="ruleForm" label-width="150px" style="width: 830px;">
-        <!-- <div style="margin-right:-15%;">
-              <el-button type="primary" style="float: right;" @click="queryCel()">计算优先级</el-button>
-              <br><br><br><br><br></div>             -->
+      <el-form ref="ruleForm" :rules="rule" :model="ruleForm" label-width="150px" style="width: 830px;">
         <table>
           <tr>
             <el-form-item label="规则描述" prop="ruleDesc" style="margin-left:0.5%;">
               <el-input v-model="rules.ruleDesc" clearable placeholder="输入规则描述" style="width:130px;margin:0 -3.5px;" filterable size="medium" />
             </el-form-item>
+            <el-form-item
+              v-if="isAnyRequest === true"
+              label="规则"
+              prop="whenScript"
+              :rules="{required: false, message: '请选择规则表达式', trigger: 'blur'}"
+>
+              <el-select v-model="rules.whenScript" clearable placeholder="请选择规则表达式" style="width:130px;margin: 0 1% -2.5 5.5px;" fiterable @change="chooseTest">
+                <el-option v-for="item in getExpressOpt(0)" :key="item.desc" :label="item.descChn" :value="item.desc" />
+              </el-select>
+            </el-form-item>
             <div style="margin-left:14%;">
               <el-form-item v-for="(item, index) in ruleForm.metaRuleList" ref="key" :key="index" label-width="0">
                 <template>
@@ -133,6 +138,7 @@
                         <el-button ref="and" :style="styleBtn" circle plain size="mini" @click="changeAnd(index)">{{ and }}</el-button>
                         <el-button ref="or" circle plain size="mini" @click="changeOr(index)">{{ or }}</el-button>
                       </el-button-group>
+
                     <!-- <div :class="{red: !isshow,blue: isshow}" @click="isshow=!isshow">并且</div>
                     <div :class="{red: !isshow,blue: isshow}" @click="isshow=!isshow">或者</div> -->
                     <!-- <div style="border:1px solid #000; border-radius:50% 0  0 50%;text-align:center;line-height:26px;">并且</div> -->
@@ -143,46 +149,48 @@
                 <el-row ref="priorBackgroup" :gutter="2" style="width: 140%;white-space:nowrap;">
                   <el-col :span="3">
                     <el-form-item>
-                      <el-tooltip visible-arrow="false" effect="light" content="连续勾选可以优先计算" placement="left-start">
-                        <el-checkbox v-show="isNotAnyRequest" ref="priorCheck" v-model="itemData.prior" :disabled="priorDistabledStatus(index)" style="margin-right: 0 8% 10% 0%;" size="mini" @change="priorChanged(index)">规则{{ index+1 }}</el-checkbox>
+                      <el-tooltip class="item" visible-arrow="false" effect="light" content="连续勾选可以优先计算" placement="left-start">
+                        <el-checkbox v-if="isNotAnyRequest === true" ref="priorCheck" v-model="item.prior" :disabled="priorDistabledStatus(index)" style="margin-right: 0 8% 10% 0%;" size="mini" @change="priorChanged(index)">规则{{ index+1 }}</el-checkbox>
                       </el-tooltip>
-                      <!-- <el-checkbox  ref="priorCheck" :disabled="checkDisabled(index)" style="margin-right: 0 8% 10% 0%;" size="mini" v-model="itemData.prior" v-show="isNotAnyRequest" >规则{{index+1}}</el-checkbox>  -->
+                      <!-- <el-checkbox  ref="priorCheck" :disabled="checkDisabled(index)" style="margin-right: 0 8% 10% 0%;" size="mini" v-model="item.prior" v-if="isNotAnyRequest === true" >规则{{index+1}}</el-checkbox>  -->
                     </el-form-item>
                   </el-col>
                   <!-- <div v-show="isAnyShow==true">规则</div> -->
-                  <el-col :span="5">
-                    <el-form-item
-                      style="color:red; white-space:nowrap;"
-                      :prop="'metaRuleList.' + index + '.expression1'"
-                      :rules-check="{required: true, message: '请选择规则表达式', trigger: 'blur'}"
-                    >
-                      <el-select v-if="index == 0 ? true : isNotAnyRequest" v-model="itemData.expression1" clearable placeholder="请选择表达式" style="width:130px;margin: 0 1% 1% -15.8%;" fiterable size="medium" @change="chooseTest1">
-                        <el-option v-for="item1 in getExpressOpt(index)" :key="item1.desc" :label="item1.descChn" :value="item1.desc" />
-                      </el-select>
-                    </el-form-item>
-                  </el-col>
-                  <el-col :span="5">
-                    <el-form-item :prop="'metaRuleList.' + index + '.expression2'" :rules-check="{required: true, message: '请输入参数', trigger: 'blur'}">
-                      <el-input v-show="isNotAnyRequest" v-model="itemData.expression2" clearable placeholder="请输入参数" style="width:130px;margin:0 -15.5px;" filterable size="medium" @change="chooseTest2" />
-                    </el-form-item>
-                  </el-col>
-                  <el-col :span="5">
-                    <el-form-item :prop="'metaRuleList.' + index + '.judgeType'" :rules-check="{required: true, message: '请选择运算方式', trigger: 'blur'}">
-                      <el-select v-show="isNotAnyRequest" v-model="itemData.judgeType" clearable placeholder="请选择运算方式" style="width:130px;margin:0 -5.5px;" filterable size="medium" @change="chooseTest3">
-                        <el-option v-for="item1 in operatorOptions" :key="item1.character" :label="item1.desc" :value="item1.character" />
-                      </el-select>
-                    </el-form-item>
-                  </el-col>
-                  <el-col :span="5">
-                    <el-form-item
-                      :prop="'metaRuleList.' + index + '.judgeValue'"
-                      :rules-check="{required: true, message: '请输入值', trigger: 'blur'}"
-                    >
-                      <el-input v-show="isNotAnyRequest" v-model="itemData.judgeValue" clearable placeholder="请输入值" style="width:130px;margin:0 5.5px;" filterable size="medium" @change="chooseTest4" />
-                      <el-button v-if="index == 0 && isNotAnyRequest==true" icon="el-icon-plus" type="success" size="mini" circle @click="addList()" />
-                      <el-button v-show="index == 0 ? false : isNotAnyRequest" icon="el-icon-minus" type="danger" size="mini" circle @click="delList(index)" />
-                    </el-form-item>
-                  </el-col>
+                  <div v-if="isNotAnyRequest === true" style="margin:0 22px;">
+                    <el-col :span="5">
+                      <el-form-item
+                        style="color:red; white-space:nowrap;"
+                        :prop="'metaRuleList.' + index + '.expression1'"
+                        :rules="{required: true, message: '请选择规则表达式', trigger: 'blur'}"
+                      >
+                        <el-select v-if="isNotAnyRequest" v-model="item.expression1" clearable placeholder="请选择表达式" style="width:130px;margin: 0 1% 1% -15.8%;" fiterable size="medium" @change="chooseTest1">
+                          <el-option v-for="item in getExpressOpt(index)" :key="item.desc" :label="item.descChn" :value="item.desc" />
+                        </el-select>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :span="5">
+                      <el-form-item :prop="'metaRuleList.' + index + '.expression2'" :rules="{required: true, message: '请输入参数', trigger: 'blur'}">
+                        <el-input v-model="item.expression2" clearable placeholder="请输入参数" style="width:130px;margin:0 -10.5px;" filterable size="medium" @change="chooseTest2" />
+                      </el-form-item>
+                    </el-col>
+                    <el-col :span="5">
+                      <el-form-item :prop="'metaRuleList.' + index + '.judgeType'" :rules="{required: true, message: '请选择运算方式', trigger: 'blur'}">
+                        <el-select v-model="item.judgeType" clearable placeholder="请选择运算方式" style="width:130px;margin:0 -1.5px;" filterable size="medium" @change="chooseTest3">
+                          <el-option v-for="item in operatorOptions" :key="item.character" :label="item.desc" :value="item.character" />
+                        </el-select>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :span="5">
+                      <el-form-item
+                        :prop="'metaRuleList.' + index + '.judgeValue'"
+                        :rules="{required: true, message: '请输入值', trigger: 'blur'}"
+                      >
+                        <el-input v-model="item.judgeValue" clearable placeholder="请输入值" style="width:130px;margin:0 6.5px;" filterable size="medium" @change="chooseTest4" />
+                        <el-button v-if="index == 0 && isNotAnyRequest==true" icon="el-icon-plus" type="success" size="mini" circle @click="addList()" />
+                        <el-button v-show="index == 0 ? false : isNotAnyRequest" icon="el-icon-minus" type="danger" size="mini" circle @click="delList(index)" />
+                      </el-form-item>
+                    </el-col>
+                  </div>
 
                 </el-row>
               </el-form-item>
@@ -190,10 +198,6 @@
 
           </tr>
         </table>
-
-        <br>
-        <br>
-        <br>
         <el-form-item label="优先级" prop="execSort">
           <el-input-number v-model="rules.execSort" label="优先级" :min="1" :max="100" title="值越大，优先级越高" />
         </el-form-item>
@@ -209,7 +213,7 @@
         <el-button @click="dialogFormVisible = false">
           取消
         </el-button>
-        <el-button v-if="showSubmit" type="primary" @click="dialogStatus==='create'?createData():updateData()">
+        <el-button v-if="showSubmit" type="primary" @click="dialogStatus==='update'?updateData() : createData()">
           确定
         </el-button>
 
@@ -258,7 +262,7 @@ export default {
     return {
       Id: '',
       num: 0,
-      itemData: {},
+      item: {},
       activeColor: '#000',
       back: '#FFFFFF',
       backColor: '#FFFFFF',
@@ -267,13 +271,14 @@ export default {
       // orButton:"",
       firstIndex: 1,
       isshow: true,
-      isAnyshow: false,
+      // isAnyshow: false,
       isNotAnyRequest: true,
       btnRequest: true,
       expression: '',
       expression1: '',
       expression2: '',
       btnReception: {},
+      isAnyRequest: false,
       chooseIndex: 'reset',
       userNames: localStorage.getItem('realname'),
       styleObj: {
@@ -284,22 +289,21 @@ export default {
         'background': '#409EFF'
       },
       ruleForm: {
-      // metaRuleList:[{ operator:'', expression:'',  judgeType:'',  judgeValue:''},{},{}]
         maxPrior: -1,
         minPrior: 100,
         execSort: '',
         ruleDesc: '',
-        metaRuleList: [{ operator: '', expression1: '', expression2: '', judgeType: '', judgeValue: '', and: '', or: '', prior: '', bracket: '' }]
+        metaRuleList: [{ operator: '', expression: '', judgeType: '', judgeValue: '', and: '', or: '', prior: '', bracket: '' }]
       },
+      metaRuleListCache: [],
       rules: {
         execSort: '',
-        ruleDesc: '',
-        // metaRuleList:[{ operator:'', expression:'',  judgeType:'',  judgeValue:''},{},{}]
-        metaRuleList: [{ operator: '', expression: '', judgeType: '', judgeValue: '' }]
+        ruleDesc: ''
+        // metaRuleList: [{ operator: '', expression: '', judgeType: '', judgeValue: '' }]
       },
 
       evaluators: [],
-      rulesCheck: {
+      rule: {
         expression1: [
           { required: true, message: '请输入方法', trigger: 'blur' }
         ],
@@ -337,11 +341,10 @@ export default {
       // operatorOption: [{ name: '等于', value: "=" }, { name: '大于', value: ">" }, { name: '小于', value: "<" }, { name: '不等于', value: "!=" }],
       operatorOptions: [],
       expressOptions: [],
-      expressOptionWithutAny: [],
+      expressOptionWithoutAny: [],
       // paramOptions:[{ name: 'any', value: 0 }, { name: 'param', value: 1 },{ name: 'param2', value: 2 }],
       statusOptions: ['published', 'draft', 'deleted'],
       showReviewer: false,
-      metaRule: [],
       showRules: false,
       ruleData: {
         // methodId: 0,
@@ -359,7 +362,9 @@ export default {
       dialogStatus: '',
       textMap: {
         update: '编辑',
-        create: '新增规则'
+        create: '新增规则',
+        check: '查看',
+        copy: '复制'
       },
       dialogPvVisible: false,
       pvData: [],
@@ -393,7 +398,7 @@ export default {
       if (index === 0) {
         return this.expressOptions
       } else {
-        return this.expressOptionWithutAny
+        return this.expressOptionWithoutAny
       }
     },
     // 优先计算
@@ -431,7 +436,19 @@ export default {
       this.$refs.and[index].$el.style.background = '#FFFFFF'
       this.ruleForm.metaRuleList[index].operator = '||'
     },
-
+    updateStyle() {
+      // i从1开始，因为第一个不显示
+      for (let i = 1, len = this.ruleForm.metaRuleList.length; i < len; i++) {
+        // 操作符颜色
+        if (this.ruleForm.metaRuleList[i].operator === '||') {
+          this.changeOr(i)
+        } else {
+          this.changeAnd(i)
+        }
+        // 优先级背景
+        this.priorChanged(i)
+      }
+    },
     addList(index) {
       // this.num===index
       if (this.ruleForm.metaRuleList.length >= 10) {
@@ -446,14 +463,29 @@ export default {
       console.log(this.num)
       console.log(index)
     },
+    chooseTest(val) {
+      console.log('chooseTest:' + val)
+      this.isNotAnyRequest = true
+      this.isAnyRequest = false
+      this.ruleForm.metaRuleList = this.metaRuleListCache
+      this.ruleForm.metaRuleList[0].expression1 = val
+      // this.ruleForm.metaRuleList.push({'expression1': val })
+      delete this.rules.whenScript
+      // this.paramOptions.push(0,0,{ name: 'any', value: 0 })
+    },
     chooseTest1(val) {
       this.expression1 = val
       console.log(val)
-      if (this.ruleForm.metaRuleList[0].expression1 === 'any request') {
+      if (this.ruleForm.metaRuleList[0].expression1 === 'any') {
+        this.rules.whenScript = 'any'
+        this.isAnyRequest = true
         this.isNotAnyRequest = false
-        this.isAnyshow = true
+        this.metaRuleListCache = this.ruleForm.metaRuleList
+        this.ruleForm.metaRuleList = []
+        // this.isAnyshow = true
       } else {
         this.isNotAnyRequest = true
+        this.isAnyRequest = false
 
         // this.paramOptions.push(0,0,{ name: 'any', value: 0 })
       }
@@ -480,10 +512,10 @@ export default {
       getExpress().then(response => {
         this.expressOptions = response.data
         this.expressOptions.forEach((opt, index) => {
-          if (opt.desc === 'any request') {
+          if (opt.desc === 'any') {
             return true
           }
-          this.expressOptionWithutAny.push(opt)
+          this.expressOptionWithoutAny.push(opt)
         })
       })
     },
@@ -526,28 +558,6 @@ export default {
       }
       return maxMin
     },
-    addBracket(index) {
-      //   var min1 = -1
-      //     var max1 = -1
-      //     for(let j = 0, len = this.ruleForm.metaRuleList.length; j < len; j++) {
-      //        if (this.ruleForm.metaRuleList[j].prior == true){
-      //           max1 = j
-      //           if (min1 == -1){
-      //             min1 = j
-      //           }
-      //        }
-      //     }
-
-      //     if (index == min1){
-      //       this.ruleForm.metaRuleList[j].bracket == "("
-      //     }
-      //     if(index == max1){
-      //       this.ruleForm.metaRuleList[j+1].bracket == ")"
-      //     }
-      //  console.log("max1 " + this.ruleForm.maxPrior + " min1 " + this.ruleForm.minPrior)
-
-    },
-
     prev() {
       this.$router.go(-1)
     },
@@ -648,6 +658,14 @@ export default {
         curIndex: 1,
         pageSize: 20
       }
+      this.ruleForm = {
+        maxPrior: -1,
+        minPrior: 100,
+        execSort: '',
+        ruleDesc: '',
+        metaRuleList: [{ operator: '', expression: '', judgeType: '', judgeValue: '', and: '', or: '', prior: '', bracket: '' }]
+      }
+      this.metaRuleListCache = []
     },
     handleCreate() {
       this.resetServiceData()
@@ -658,100 +676,118 @@ export default {
         this.$refs['ruleForm'].clearValidate()
       })
     },
-    createData(vel) {
-      const shouldJson = this.rules.returnMessage
-      console.log('dasdsadsad' + typeof (shouldJson))
+    copyAndDecorateMetaRuleFromRuleForm() {
       var maxMin = this.findMaxMinOfMetaList()
-      console.log('maxMin ' + JSON.stringify(maxMin))
+      var copiedMetaRuleList = []
+      for (let i = 0, len = this.ruleForm.metaRuleList.length; i < len; i++) {
+        var r = this.ruleForm.metaRuleList[i]
+        var copiedRule = { 'judgeType': r.judgeType, 'judgeValue': r.judgeValue, 'operator': r.operator }
+        copiedRule.expression = r.expression1 + '.' + r.expression2
+        if (i === maxMin.min) {
+          copiedRule.operator = r.operator + '('
+        }
+        if (i === (maxMin.max + 1)) {
+          copiedRule.operator = ')' + r.operator
+        }
+        copiedMetaRuleList.push(copiedRule)
+      }
+      if (maxMin.max === (this.ruleForm.metaRuleList.length - 1)) {
+        copiedMetaRuleList.push({ 'operator': ')' })
+      }
+      return copiedMetaRuleList
+    },
+    createOrUpdate(createFlag, remoteFunc) {
+      const shouldJson = this.rules.returnMessage
       if (typeof shouldJson === 'string') {
         this.$refs['ruleForm'].validate((valid) => {
           if (valid) {
             // delete this.rules.id
-            console.log('xxx ' + JSON.stringify(this.ruleForm.metaRuleList))
-            if (this.ruleForm.metaRuleList[0].expression1 === 'any request') {
-              this.rules.whenScript = 'any request'
+            // 任意请求
+            if (this.rules.whenScript === 'any') {
               delete this.rules.metaRuleList
             } else {
-              this.rules.metaRuleList = []
-              for (let i = 0, len = this.ruleForm.metaRuleList.length; i < len; i++) {
-                var r = this.ruleForm.metaRuleList[i]
-                var copiedRule = { 'judgeType': r.judgeType, 'judgeValue': r.judgeValue, 'operator': r.operator }
-                copiedRule.expression = r.expression1 + '.' + r.expression2
-                if (i === maxMin.min) {
-                  copiedRule.operator = r.operator + '('
-                }
-                if (i === (maxMin.max + 1)) {
-                  copiedRule.operator = ')' + r.operator
-                }
-                this.rules.metaRuleList.push(copiedRule)
-              }
-              if (maxMin.max === (this.ruleForm.metaRuleList.length - 1)) {
-                this.rules.metaRuleList.push({ 'operator': ')' })
-              }
-              this.rules.methodProtocol = 'http'
-              this.rules.updator = this.userNames
-              this.rules.methodId = parseInt(this.$route.path.split('/')[3])
-              console.log('ruleForm.metaRuleList:' + JSON.stringify(this.ruleForm.metaRuleList))
-              console.log('rules.metaRuleList:' + JSON.stringify(this.rules.metaRuleList))
-              console.log('rules request:' + JSON.stringify(this.rules))
-              createRule(this.rules).then(response => {
-                if (response.code === 200) {
-                  this.dialogFormVisible = false
-                  this.getList()
-                  this.$notify({
-                    title: 'Success',
-                    message: 'Created Successfully',
-                    type: 'success',
-                    duration: 2000
-                  })
-                } else {
-                  this.$notify({
-                    title: 'Failed',
-                    message: 'Created Failed',
-                    type: 'error',
-                    duration: 2000
-                  })
-                }
-              })
+              // 正常请求
+              this.rules.metaRuleList = this.copyAndDecorateMetaRuleFromRuleForm()
             }
+            this.rules.methodId = parseInt(this.$route.path.split('/')[3])
+            this.rules.methodProtocol = 'http'
+            this.rules.updator = this.userNames
+            remoteFunc(this.rules)
           }
-        })
+        }
+        )
       }
     },
-    handleUpdate(row) {
-      var queryData = { id: row.id }
-      fetchRuleById(queryData).then(response => {
-        // debugger
-        var row_data = response.data.mockRuleList
-        this.metaRule = row_data[0].metaRuleList
-        var i = 0
-        for (var a of this.metaRule) {
-          var sty = a.expression.split('.')
-          this.ruleForm.metaRuleList[i] = { 'operator': a.operator, 'expression1': sty[0], 'expression2': sty[1], 'judgeType': a.judgeType, 'judgeValue': a.judgeValue }
-          // if (a.operator === '||') {
-          //   this.$refs.or[i].$el.style.color = '#FFFFFF'
-          //   this.$refs.or[i].$el.style.background = '#409EFF'
-          //   this.$refs.and[i].$el.style.color = '#606266'
-          //   this.$refs.and[i].$el.style.background = '#FFFFFF'
-          // }
-          // if (a.operator === '&&') {
-          //   this.$refs.and[i].$el.style.color = '#FFFFFF'
-          //   this.$refs.and[i].$el.style.background = '#409EFF'
-          //   this.$refs.or[i].$el.style.color = '#606266'
-          //   this.$refs.or[i].$el.style.background = '#FFFFFF'
-          // }
-          i++
-          console.log(a.operator)
+    createData(vel) {
+      this.createOrUpdate('create', (data) => {
+        createRule(this.rules).then(response => {
+          if (response.code === 200) {
+            this.dialogFormVisible = false
+            this.getList()
+            this.$notify({
+              title: 'Success',
+              message: 'Created Successfully',
+              type: 'success',
+              duration: 2000
+            })
+          } else {
+            this.$notify({
+              title: 'Failed',
+              message: 'Created Failed',
+              type: 'error',
+              duration: 2000
+            })
+          }
+        })
+      })
+    },
+    handleUpdate(row, status) {
+      fetchRuleById({ id: row.id }).then(response => {
+        if (response.code !== 200) {
+          this.$message({
+            message: row.id.toString() + ' 操作失败！',
+            type: 'danger'
+          })
+          return
         }
-        this.ruleForm.ruleDesc = Object.assign({}, row_data[0].ruleDesc)
-        this.ruleForm.execSort = Object.assign({}, row_data[0].execSort)
-        this.returnMessage = Object.assign({}, row_data[0].returnMessage)
-        this.whenScript = Object.assign({}, row_data[0].whenScript)
-        this.dialogStatus = 'update'
+        this.resetServiceData()
+        this.dialogStatus = status
+        this.showSubmit = status !== 'check'
         this.dialogFormVisible = true
-        this.showSubmit = true
+        var row_data = response.data.mockRuleList
+        var m = row_data[0].metaRuleList
+        this.ruleForm.metaRuleList = []
+        for (let i = 0, len = m.length; i < len; i++) {
+          // 括号在最后时特殊处理
+          var metaRule = m[i]
+          if (metaRule.operator === ')') {
+            this.ruleForm.metaRuleList[i - 1].prior = true
+            continue
+          }
+          // 优先级处理
+          var prior = false
+          if (metaRule.operator.indexOf('(') !== -1) {
+            prior = true
+          }
+          if (metaRule.operator.indexOf(')') !== -1) {
+            this.ruleForm.metaRuleList[i - 1].prior = true
+          }
+          metaRule.operator = metaRule.operator.replace(/\(|\)/, '')
+          // 分割表达式
+          var exp = metaRule.expression.split('.')
+          this.ruleForm.metaRuleList.push({ 'prior': prior, 'operator': metaRule.operator, 'expression1': exp[0], 'expression2': exp[1], 'judgeType': metaRule.judgeType, 'judgeValue': metaRule.judgeValue })
+          console.log(this.ruleForm.metaRuleList[i])
+        }
+        this.rules = Object.assign({}, row_data[0])
+        if (status === 'copy') {
+          delete this.rules.id
+        }
+
+        // 校验个样式更新清理
         this.$nextTick(() => {
           this.$refs['ruleForm'].clearValidate()
+          // 更新优先级和操作符的样式
+          this.updateStyle()
         })
       })
     },
@@ -775,64 +811,18 @@ export default {
         }
       })
     },
-    handleCopy(row) {
-      // this.rules = {
-      //   // id: row.id,
-      //   customName: row.customName,
-      //   httpUrl: row.httpUrl,
-      //   execSort: row.execSort,
-      //   ruleDesc:row.ruleDesc,
-      //   metaRuleList:row.metaRuleList,
-      //   whenScript: row.whenScript,
-      //   methodProtocol: row.methodProtocol,
-      //   status: row.status,
-      //   returnMessage: row.returnMessage
-      // }
-      // this.rules = Object.assign({}, row) // copy obj
-      console.log('rules:' + JSON.stringify(this.rules))
-      var row_data = row
-      this.metaRule = row_data[0].metaRuleList
-      var i = 0
-      for (var a of this.metaRule) {
-        var sty = a.expression.split('.')
-        this.ruleForm.metaRuleList[i] = { 'operator': a.operator, 'expression1': sty[0], 'expression2': sty[1], 'judgeType': a.judgeType, 'judgeValue': a.judgeValue }
-        i++
-        console.log(a.operator)
-      }
-      // this.rules.timestamp = new Date(this.rules.timestamp)
-      this.dialogStatus = 'create'
-      this.dialogFormVisible = true
-      this.showSubmit = true
-      this.$nextTick(() => {
-        this.$refs['ruleForm'].clearValidate()
-      })
-    },
     updateData() {
-      this.$refs['ruleForm'].validate((valid) => {
-        if (valid) {
-        //   const tempData = Object.assign({}, this.ruleData)
-          const tempData = {
-            id: this.rules.id,
-            methodId: parseInt(this.$route.path.split('/')[3]),
-            updator: '',
-            execSort: this.rules.execSort,
-            whenScript: this.rules.whenScript,
-            returnMessage: this.rules.returnMessage,
-            mehtodName: this.$route.query.methodName,
-            methodProtocol: this.$route.query.methodProtocol,
-            metaRuleList: []
-          }
-          updateRule(tempData).then(() => {
-            this.getList()
-            this.dialogFormVisible = false
-            this.$notify({
-              title: 'Success',
-              message: 'Update Successfully',
-              type: 'success',
-              duration: 2000
-            })
+      this.createOrUpdate('update', (data) => {
+        updateRule(data).then(() => {
+          this.getList()
+          this.dialogFormVisible = false
+          this.$notify({
+            title: 'Success',
+            message: 'Update Successfully',
+            type: 'success',
+            duration: 2000
           })
-        }
+        })
       })
     },
     formatJson(filterVal, jsonData) {
@@ -843,20 +833,6 @@ export default {
           return v[j]
         }
       }))
-    },
-    handleCheck(row) {
-      var queryData = { id: row.id }
-      fetchRuleById(queryData).then(response => {
-        console.log('aaaaaaaaa' + response)
-        var row_data = response.data.mockRuleList
-        this.rules = Object.assign({}, row_data[0])
-        this.dialogStatus = 'update'
-        this.dialogFormVisible = true
-        this.showSubmit = false
-        this.$nextTick(() => {
-          this.$refs['ruleForm'].clearValidate()
-        })
-      })
     }
   }
 }
@@ -898,4 +874,3 @@ display:initial;/*当鼠标hover时展示*/
 } */
 
 </style>
-

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, getOnlineInfo, 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>