优化

src/components/StatusComponent/StatusComponent.vue

@@ -1,47 +1,187 @@
 <template>
-  <el-select
-    v-model="status"
-    :class="{
-      'item-color': status === 0,
-      'item': status === 3,
-      'item1': status === 2,
-      'item2': status === 4,
-      'item3': status === 5
-    }"
-    class="public_botton"
-    size="mini"
-    @change="blurEvent(status)"
-  >
-    <el-option v-for="item in statusArr" :key="item.code" :label="item.name" :value="item.code" />
-  </el-select>
+  <div>
+    <el-select
+      v-model="status"
+      :class="{
+        'status_color': status === 0,
+        'status_color2': status === 3,
+        'status_color5': status === 2,
+        'status_color1': status === 4,
+        'status_color3': status === 5
+      }"
+      class="public_botton"
+      size="mini"
+      @change="blurEvent(status)"
+    >
+      <el-option v-for="item in bugStatusList(status)" :key="item.code" :label="item.name" :value="item.code" />
+    </el-select>
+    <el-dialog
+      v-if="statusDialogVisible"
+      :visible.sync="statusDialogVisible"
+      width="30%"
+      :title="statusDialogTitle"
+      class="public_task"
+      :append-to-body="true"
+      :close-on-click-modal="false"
+      @close="modalClose"
+    >
+      <div class="blueStripe" />
+      <el-form ref="statusDialogForm" label-width="110px" label-position="left" :model="statusDialogForm" :rules="rules">
+        <el-form-item v-if="statusDialogTitle === '待测试'" label="修复结果" prop="repairResult" class="bug_manage_dialog">
+          <el-select v-model="statusDialogForm.repairResult" style="width: 100%">
+            <el-option v-for="item in repairResultEnumList" :key="item.code" :label="item.name" :value="item.code" />
+          </el-select>
+        </el-form-item>
+        <el-form-item v-if="statusDialogTitle === '待测试' || statusDialogTitle === '已完成'" label="缺陷原因" prop="bugReason" class="bug_manage_dialog">
+          <el-select v-model="statusDialogForm.bugReason" style="width: 100%">
+            <el-option v-for="item in bugReasonEnumList" :key="item.code" :label="item.name" :value="item.code" />
+          </el-select>
+        </el-form-item>
+        <el-form-item v-if="statusDialogTitle === '待测试'" label="修复方式" class="bug_manage_dialog bug_manage_dialog_fixMethod">
+          <el-input v-model="statusDialogForm.reasonOrDesc" type="textarea" placeholder="请输入具体原因，得出结论的过程，具体修复过程或方式" maxlength="300" show-word-limit rows="4" />
+        </el-form-item>
+        <el-form-item v-if="statusDialogTitle === '已完成'" label="修复结果" prop="repairResult" class="bug_manage_dialog">
+          <el-select v-model="statusDialogForm.repairResult" style="width: 100%">
+            <el-option v-for="item in repairResultEnumList" :key="item.code" :label="item.name" :value="item.code" />
+          </el-select>
+        </el-form-item>
+        <el-form-item v-if="statusDialogTitle === 'Reopen'" label="Reopen原因" prop="reasonOrDesc" class="bug_manage_dialog">
+          <el-input v-model="statusDialogForm.reasonOrDesc" type="textarea" placeholder="请输入Reopen" maxlength="300" show-word-limit rows="4" />
+        </el-form-item>
+        <el-form-item v-if="statusDialogTitle === 'Hold'" label="Hold原因" prop="reasonOrDesc" class="bug_manage_dialog">
+          <el-input v-model="statusDialogForm.reasonOrDesc" type="textarea" maxlength="300" show-word-limit rows="4" />
+        </el-form-item>
+      </el-form>
+      <template v-slot:footer>
+        <el-button size="small" @click="modalClose()">取 消</el-button>
+        <el-button size="small" type="primary" @click="statusDialogConfirm">确 定</el-button>
+      </template>
+    </el-dialog>
+  </div>
 </template>
 
 <script>
+import { bugUpdate, bugGetEnum } from '@/api/defectManage'
 import '@/styles/PublicStyle/index.scss'
+
 export default {
   props: {
     title: { type: String, default: null }, // 标题
-    statusData: { type: String, default: null }, // 选择的当前状态
-    statusList: { type: Array, default: null }, // option数据
-    statusRow: { type: Object, default: null }
+    statusData: { type: Number, default: null }, // 选择的当前状态
+    statusRow: { type: Object, default: null } // 当前行数据
   },
   data() {
     return {
-      statusArr: this.statusList,
-      status: this.statusData
+      userData: { id: '', ename: localStorage.getItem('username'), name: localStorage.getItem('realname') },
+      status: this.statusData, // 状态的code
+      statusDialogVisible: false, // dialog
+      bugEnumList: [], // 状态option
+      bugReasonEnumList: [], // 缺陷原因
+      repairResultEnumList: [], // 修复结果
+      statusDialogTitle: '', // 状态Name
+      statusDialogForm: {}, // 表单
+      staData: {},
+      statusCode: '',
+      rules: {
+        bugReason: [{ required: true, message: '请选择缺陷原因', trigger: ['blur', 'change'] }],
+        repairResult: [{ required: true, message: '请选择修复结果', trigger: ['blur', 'change'] }],
+        reasonOrDesc: [{ required: true, message: '请输入Reopen原因', trigger: ['blur', 'change'] }]
+      }
     }
   },
-  mounted() {
-    console.log(this.statusRow, 'title')
+  created() {
+    this.bugListSelect()
   },
   methods: {
-    blurEvent(status) {
-      console.log(status, 't')
+    blurEvent(status) { // 修改状态为0
+      this.statusCode = status
+      if (status === 0) {
+        this.statusRow.status = status
+        bugUpdate({ bugBaseInfo: this.statusRow, user: this.userData }).then(res => {
+          this.statusRow.isSelected = !this.statusRow.isSelected
+          if (res.code === 200) {
+            this.$emit('getBugList')
+          }
+          this.$message({ message: res.msg, type: res.msg })
+        })
+        return
+      }
+      let data = ''
+      this.bugEnumList.map(item => {
+        item.code === status ? data = item.name : ''
+      })
+      this.statusDialogTitle = data
+      this.statusDialogVisible = true
+    },
+    modalClose() { // 关闭dialog
+      this.statusDialogVisible = false
+      this.status = this.statusData
+    },
+    statusDialogConfirm() { // 点击确定 验证 修改
+      this.$refs.statusDialogForm.validate((valid) => {
+        if (valid) {
+          this.staData = this.statusRow
+          this.staData.status = this.statusCode
+          this.staData.reasonOrDesc = this.statusDialogForm.reasonOrDesc
+          this.staData.repairResult = this.statusDialogForm.repairResult
+          this.staData.bugReason = this.statusDialogForm.bugReason
+          const objData = { bugBaseInfo: this.staData, user: this.userData }
+          alert()
+          bugUpdate(objData).then(res => {
+            if (res.code === 200) {
+              this.statusDialogVisible = false
+              this.statusDialogForm = {}
+            } else if (res.code !== 200) {
+              this.$emit('getBugList')
+            }
+            this.$message({ message: res.msg, type: res.msg })
+          })
+        }
+      })
+    },
+    bugStatusList(status) { // 不同状态返回不同的option
+      if (status === 0) {
+        return this.bugEnumList.filter(item => {
+          return item.code === 0 || item.code === 2 || item.code === 5
+        })
+      }
+      if (status === 2) {
+        return this.bugEnumList.filter(item => {
+          return item.code === 2 || item.code === 3 || item.code === 4
+        })
+      }
+      if (status === 3) {
+        return this.bugEnumList.filter(item => {
+          return item.code === 3
+        })
+      }
+      if (status === 4) {
+        return this.bugEnumList.filter(item => {
+          return item.code === 2 || item.code === 5 || item.code === 4
+        })
+      }
+      if (status === 5) {
+        return this.bugEnumList.filter(item => {
+          return item.code === 5 || item.code === 2
+        })
+      }
+    },
+    bugListSelect() { // 获取下拉数据
+      bugGetEnum().then(res => {
+        this.bugEnumList = res.data.bugEnumList // status
+        this.repairResultEnumList = res.data.repairResultEnumList // 修复结果
+        this.bugReasonEnumList = res.data.bugReasonEnumList
+      })
     }
   }
 }
 </script>
 
 <style lang="scss">
+.btns .el-input--suffix .el-input__inner {
+  padding-right: 10px;
+  padding-left: 10px;
+  width: 73px;
+}
 
 </style>

src/styles/PublicStyle/index.scss

@@ -37,6 +37,7 @@
     padding-right: 10px;
     padding-left: 10px;
     width: 73px;
+    border: 1px solid;
   }
 }
 
@@ -125,6 +126,28 @@
     }
   }
 
+  .status_color5 { // 迭代状态样式修改（颜色）
+    /deep/ input {
+      color: rgb(255, 204, 102);
+       border: 1px solid rgb(255, 204, 102);
+       border-color: rgb(255, 204, 102) !important;
+           font-weight: 900;
+    }
+    /deep/ .el-input__suffix {
+      color: rgb(255, 204, 102) !important;
+      right: 1px;
+    }
+    /deep/ .el-select__caret {
+      color: rgb(255, 204, 102) !important;
+    }
+  }
+
+  .public_themeName { // 迭代，项目，任务，需求 主题
+    font-size: 22px;
+    font-weight: 450;
+    padding-left: 15px;
+  }
+
   .scroll { // 添加滚动条（记得设置height）
     overflow: scroll;
     overflow-x: hidden;
@@ -197,7 +220,7 @@
   }
 }
 
-.task {
+.public_task {
   /deep/ .el-dialog__title {
     line-height: 24px;
     font-size: 18px;

src/views/projectManage/bugList/bugindex.vue

@@ -1,23 +1,13 @@
 <template>
   <div>
     <el-container class="bgColor">
-      <el-header v-if="type === 'page'" style="height: auto; margin-top: 1%; padding: 0 1%;">
+      <el-header v-if="type === 'page'" class="public_header">
         <el-row class="headerBg">
-          <el-col :span="24" class="Layout">
-            <div class="titFont Layout">
-              <span
-                style="width: 100px;  font-size: 22px; font-family:PingFangSC-Medium,PingFang SC;padding-left: 15px"
-              >缺陷</span>
-            </div>
-            <el-button
-              type="primary"
-              size="mini"
-              @click="createdDefect"
-            >新建缺陷</el-button>
-          </el-col>
-          <el-col :span="24">
-            <el-divider style="color: #EEF0F5;" />
-          </el-col>
+          <div class="Layout_space_between">
+            <div class="public_themeName">缺陷</div>
+            <el-button size="mini" type="primary" @click="createdDefect">新建缺陷</el-button>
+          </div>
+          <el-divider style="color: #EEF0F5; margin: 10px 0 ;" />
           <el-col :span="24" class="Layout" style="padding:0 0 1% 15px">
             <el-form :model="formInline" class="flex_start" style="width: 100%;">
               <div class="Layout">
@@ -439,7 +429,7 @@
           </el-row>
         </el-row>
       </el-header>
-      <el-main :style="type === 'page'?{padding: '1%'}:{padding: '0'}">
+      <el-main :style="type === 'page'?{padding: '10px'}:{padding: '0'}">
         <el-row class="headerBg table_v" style=" padding-top: 0px;">
           <el-col :span="24" style="min-height: 47vh;">
             <div v-if="type !== 'page'" style="position: relative;top: 5px;right: 10px">
@@ -479,26 +469,7 @@
               <el-table-column prop="priorityName" label="缺陷等级" align="center" />
               <el-table-column prop="bugStatusName" label="状态" min-width="110" align="center">
                 <template slot-scope="scope">
-                  <el-select
-                    v-model="scope.row.status"
-                    :class="{
-                      'item-color': scope.row.status === 0 || scope.row.status === 1,
-                      'item': scope.row.status === 3,
-                      'item1': scope.row.status === 2,
-                      'item2': scope.row.status === 4,
-                      'item3': scope.row.status === 5
-                    }"
-                    class="btns"
-                    size="mini"
-                    @change="blurEvent(scope.row, scope.row.status)"
-                  >
-                    <el-option v-for="item in bugStatusList(scope.row.status)" :key="item.code" :label="item.name" :value="item.code" />
-                  </el-select>
-                </template>
-              </el-table-column>
-              <el-table-column prop="bugStatusName" label="状态cs" min-width="110" align="center">
-                <template slot-scope="scope">
-                  <Status-component :title="'缺陷'" :status-data="scope.row.status" :status-list="bugEnumList" :status-row="scope.row" />
+                  <Status-component :title="'缺陷'" :status-data="scope.row.status" :status-row="scope.row" />
                 </template>
               </el-table-column>
               <el-table-column prop="taskName" label="所属任务" align="center" min-width="250" show-overflow-tooltip />
@@ -541,6 +512,8 @@
         <bug-details
           :id="bugQuery.id+''"
           ref="bugDetails"
+          :status="bugQuery"
+          :bug-enum-list="bugEnumList"
           :type="'drawer'"
           :drawer-show="drawerShow"
           @close="drawerShow = false"
@@ -549,44 +522,6 @@
         />
       </div>
     </el-drawer>
-    <el-dialog
-      v-if="statusDialogVisible"
-      :visible.sync="statusDialogVisible"
-      width="33%"
-      class="bug_manage_dialog"
-      :append-to-body="true"
-      :close-on-click-modal="false"
-      @close="modalClose"
-    >
-      <template v-slot:title>
-        <div style="display:flex;align-items: center;">
-          <div style="width:4px;height:15px;background:#409EFF;border-radius:1px;" />
-          <div style="width:83px;height:18px;font-size:16px;font-family:MicrosoftYaHei;color:rgba(51,59,74,1);margin-left:6px">{{ statusDialogTitle }}</div>
-        </div>
-      </template>
-      <el-form label-width="110px" label-position="left" :model="statusDialogForm" :rules="rules">
-        <el-form-item v-if="statusDialogTitle === '待测试' || statusDialogTitle === '已完成'" label="缺陷原因" prop="bugReason">
-          <el-select v-model="statusDialogForm.bugReason" style="width: 100%">
-            <el-option v-for="item in bugReasonEnumList" :key="item.code" :label="item.name" :value="item.code" />
-          </el-select>
-        </el-form-item>
-        <el-form-item v-if="statusDialogTitle === '待测试'" label="修复方式" class="bug_manage_dialog bug_manage_dialog_fixMethod">
-          <el-input v-model="statusDialogForm.reasonOrDesc" type="textarea" placeholder="请输入具体原因和修复方式" maxlength="300" show-word-limit rows="4" />
-        </el-form-item>
-        <el-form-item v-if="statusDialogTitle === '已完成'" label="修复结果" prop="repairResult" class="bug_manage_dialog">
-          <el-select v-model="statusDialogForm.repairResult" style="width: 100%">
-            <el-option v-for="item in repairResultEnumList" :key="item.code" :label="item.name" :value="item.code" />
-          </el-select>
-        </el-form-item>
-        <el-form-item v-if="statusDialogTitle === 'Reopen'" label="Reopen原因" prop="reasonOrDesc">
-          <el-input v-model="statusDialogForm.reasonOrDesc" type="textarea" placeholder="请输入Reopen" maxlength="300" show-word-limit rows="4" />
-        </el-form-item>
-      </el-form>
-      <template v-slot:footer>
-        <el-button @click="getBugList(),statusDialogVisible = false">取 消</el-button>
-        <el-button type="primary" @click="statusDialogConfirm">确 定</el-button>
-      </template>
-    </el-dialog>
     <normal-dialog
       :show-dialog="showSaveSearch"
       :title="'保存筛选项'"
@@ -625,7 +560,6 @@ import {
   bugList,
   bugSelfList,
   bugGetEnum,
-  bugUpdate,
   settingGetBizList,
   taskListCreate,
   releaseList,
@@ -638,6 +572,7 @@ import {
 // import { getCommentList } from '@/api/requirement.js'
 import { memberQueryMemberInfoByIDAPorName } from '@/api/projectIndex'
 import '@/views/projectManage/bugList/css/index.css'
+import '@/styles/PublicStyle/index.scss'
 export default {
   components: {
     createdBug,
@@ -659,10 +594,7 @@ export default {
     }
   },
   props: {
-    type: {
-      type: String,
-      default: 'page'
-    }
+    type: { type: String, default: 'page' }
   },
   data() {
     return {
@@ -693,28 +625,9 @@ export default {
           }
         }]
       },
-      rules: {
-        bugReason: [
-          { required: true, message: '请选择缺陷原因', trigger: 'change' }
-        ],
-        repairResult: [
-          { required: true, message: '请选择修复结果', trigger: 'change' }
-        ],
-        reasonOrDesc: [
-          { required: true, message: '请输入Reopen原因', trigger: 'blur' }
-        ]
-      },
-      statusDialogForm: {},
-      radio: '1',
       bugListType: 2,
       props: { multiple: true },
       reopens: [{ code: 1, name: '是' }, { code: 0, name: '否' }],
-      priorityColors: ['#F56C6C', '#FF8952', '#7ED321'],
-      statusColors: ['#6AB4FF', '#6AB4FF', '#FFCC66', '#7ED321', '#F56C6C'],
-      userInformation: localStorage.getItem('username'),
-      userNames: localStorage.getItem('realname'),
-      statusDialogTitle: '',
-      statusDialogVisible: false,
       DetailedScreening: false, // 高级筛选
       bugEnumList: [], // bug状态
       bugDevRepairTimeList: [], // 开发修复时长
@@ -729,36 +642,21 @@ export default {
       priorityLevelEnumList: [], // 优先级
       discoveryMethEnumList: [], // 发现方式
       bugStageEnumList: [], // 发现阶段
-      bugReasonEnumList: [], // 缺陷原因
       sysTypeEnumList: [], // 端类型
       bugQuery: '', // bug详情
       business_platform_Modular: [], // 所属模块
-      bugQueryModel: '',
-      commentShow: true, // 评论为空默认显示
-      content: '', // 评论
-      comment_content: '', // 评论内容
-      fileList: [], // 储存附件
-      dis: false,
-      commentTxt: [],
       pageSize: 15,
       curIndex: 1,
       total: 0,
       goodName: '更多筛选',
       modalShow: false, // 弹窗（新建）
       drawerShow: false, // drawer展示
-      taskIdStr: [],
       formInline: {}, // list
       stratAndEnd: [], // 创建日期
       tableData: [],
-      dialogVisible: false,
-      accessory: [],
       loading: false,
       options: [],
       test: [], // 人员查询
-      dialogImageUrl: '',
-      isBugNameClick: false,
-      staData: {},
-      statusId: '',
       showSaveSearch: false, // 显示保存筛选项对话框
       showEditSearch: false, // 显示管理过滤器
       searchForm: { name: null }, // 筛选项obj
@@ -802,33 +700,6 @@ export default {
     this.$store.state.data.status = false
   },
   methods: {
-    bugStatusList(status) {
-      if (status === 0) {
-        return this.bugEnumList.filter(item => {
-          return item.code === 2 || item.code === 0 || item.code === 5
-        })
-      }
-      if (status === 2) {
-        return this.bugEnumList.filter(item => {
-          return item.code === 2 || item.code === 3 || item.code === 4
-        })
-      }
-      if (status === 3) {
-        return this.bugEnumList.filter(item => {
-          return item.code === 3
-        })
-      }
-      if (status === 4) {
-        return this.bugEnumList.filter(item => {
-          return item.code === 2 || item.code === 5 || item.code === 4
-        })
-      }
-      if (status === 5) {
-        return this.bugEnumList.filter(item => {
-          return item.code === 2 || item.code === 5
-        })
-      }
-    },
     changeSelect() {
       this.$forceUpdate()
     },
@@ -887,102 +758,15 @@ export default {
         }
       })
     },
-    modalClose() {
-      this.getBugList()
-    },
     selectStatus(row) {
       row.isSelected = !row.isSelected
     },
-    blurEvent(row, status) { // 修改状态
-      this.staData = row
-      this.statusId = status
-      if (status === 0 || status === 1 || status === 5) {
-        const userData = { id: '', ename: this.userInformation, name: this.userNames }
-        row.status = status
-        const objData = { bugBaseInfo: row, user: userData }
-        bugUpdate(objData).then(res => {
-          row.isSelected = !row.isSelected
-          if (res.code === 200) {
-            this.$message({
-              showClose: true,
-              message: res.msg,
-              type: 'success'
-            })
-          } else {
-            this.getBugList()
-            this.$message({
-              showClose: true,
-              message: res.msg,
-              type: 'error'
-            })
-          }
-        })
-        return
-      }
-      let data = ''
-      this.bugEnumList.map(item => {
-        item.code === status ? data = item.name : ''
-      })
-      this.statusDialogTitle = data
-      this.statusDialogVisible = true
-    },
     bugStatusChange(row) {
       row.isSelected = !row.isSelected
       this.$nextTick(() => {
         this.$refs.inputVal.focus()
       })
     },
-    statusDialogConfirm() {
-      if (this.statusDialogTitle === '待测试') {
-        if (typeof this.statusDialogForm.bugReason === 'undefined' || this.statusDialogForm.bugReason === null) {
-          this.$message.warning('请选择缺陷原因')
-        }
-        this.postDialogForm()
-      } else if (this.statusDialogTitle === '已完成') {
-        if (typeof this.statusDialogForm.bugReason === 'undefined' || this.statusDialogForm.bugReason === null) {
-          this.$message.warning('请选择缺陷原因')
-          return
-        }
-        if (typeof this.statusDialogForm.repairResult === 'undefined' || this.statusDialogForm.repairResult === null) {
-          this.$message.warning('请选择修复结果')
-          return
-        }
-        this.postDialogForm()
-      } else if (this.statusDialogTitle === 'Reopen') {
-        if (!this.statusDialogForm.reasonOrDesc) {
-          this.$message.warning('请输入Reopen原因')
-          return
-        }
-        this.postDialogForm()
-        this.statusDialogVisible = false
-      }
-    },
-    postDialogForm() {
-      const userData = { id: '', ename: this.userInformation, name: this.userNames }
-      this.staData.status = this.statusId
-      this.staData.reasonOrDesc = this.statusDialogForm.reasonOrDesc
-      this.staData.repairResult = this.statusDialogForm.repairResult
-      this.staData.bugReason = this.statusDialogForm.bugReason
-      const objData = { bugBaseInfo: this.staData, user: userData }
-      bugUpdate(objData).then(res => {
-        if (res.code === 200) {
-          this.statusDialogVisible = false
-          this.statusDialogForm = {}
-          this.$message({
-            showClose: true,
-            message: res.msg,
-            type: 'success'
-          })
-        } else if (res.code !== 200) {
-          this.$message({
-            showClose: true,
-            message: res.msg,
-            type: 'error'
-          })
-          this.getBugList()
-        }
-      })
-    },
     resetQuery() {
       this.$router.push({ path: this.$route.path })
       this.stratAndEnd = []
@@ -1031,30 +815,6 @@ export default {
         this.options = []
       }
     },
-    handlePictureCardPreview(file) {
-      this.dialogImageUrl = file.url
-      this.dialogVisible = true
-    },
-
-    // 文件上传时的钩子
-    progress(event, file, fileList) {
-      this.dis = true
-    },
-
-    // 上传成功回调
-    handleChange(response, file, fileList) {
-      this.fileDbList.push({
-        name: file.name,
-        url: 'http:' + file.response.url
-      })
-      this.accessory = JSON.stringify(this.fileDbList)
-      this.dis = false
-      this.$message({
-        showClose: true,
-        message: '文件上传成功',
-        type: 'success'
-      })
-    },
     click_bugName(e) {
       this.bugQuery = JSON.parse(
         JSON.stringify(this.tableData.filter(value => value.id === e)[0])
@@ -1111,7 +871,6 @@ export default {
         this.repairResultEnumList = res.data.repairResultEnumList // 修复结果
         this.clientTypeEnumList = res.data.clientTypeEnumList // 版本
         this.sysTypeEnumList = res.data.sysTypeEnumList // 客户端
-        this.bugReasonEnumList = res.data.bugReasonEnumList
         this.bugDevRepairTimeList = res.data.bugDevRepairTimeList // 开发修复时长
       })
       releaseList().then(res => {
@@ -1255,88 +1014,4 @@ export default {
     }
   }
 }
-
-</style>
-<style lang="scss">
-.btns .el-input--suffix .el-input__inner {
-  padding-right: 10px;
-  padding-left: 10px;
-  width: 73px;
-}
-
-.item{
-  /deep/ input {
-    color: rgb(126, 211, 33);
-    border: 1px solid rgb(126, 211, 33);
-     border-color: rgb(126, 211, 33) !important;
-         font-weight: 900;
-  }
-  /deep/ .el-input__suffix {
-    color: rgb(126, 211, 33) !important;
-    right: 1px;
-  }
-  /deep/ .el-select__caret {
-    color: rgb(126, 211, 33) !important;
-  }
-}
-.item1 {
-  /deep/ input {
-    color: rgb(255, 204, 102);
-     border: 1px solid rgb(255, 204, 102);
-     border-color: rgb(255, 204, 102) !important;
-         font-weight: 900;
-  }
-  /deep/ .el-input__suffix {
-    color: rgb(255, 204, 102) !important;
-    right: 1px;
-  }
-  /deep/ .el-select__caret {
-    color: rgb(255, 204, 102) !important;
-  }
-}
-.item2 {
-  /deep/ input {
-    color: rgb(245, 108, 108);
-    border: 1px solid rgb(245, 108, 108);
-    border-color: rgb(245, 108, 108) !important;
-        font-weight: 900;
-  }
-   /deep/ .el-input__suffix {
-    color: rgb(245, 108, 108) !important;
-    right: 1px;
-  }
-  /deep/ .el-select__caret {
-   color: rgb(245, 108, 108) !important;
-  }
-}
-.item3 {
-  /deep/ input {
-    color: #D675F0;
-    border: 1px solid #D675F0;
-    border-color: #D675F0 !important;
-        font-weight: 900;
-  }
-    /deep/ .el-input__suffix {
-    color: #D675F0 !important;
-    right: 1px;
-  }
-   /deep/ .el-select__caret {
-   color: #D675F0 !important;
-  }
-}
-.item-color {
-  /deep/ input {
-    color: rgb(106, 180, 255);
-    border: 1px solid rgb(106, 180, 255);
-    border-color: rgb(106, 180, 255) !important;
-        font-weight: 900;
-  }
-    /deep/ .el-input__suffix {
-    color: rgb(106, 180, 255) !important;
-    right: 1px;
-  }
-   /deep/ .el-select__caret {
-   color: rgb(106, 180, 255) !important;
-  }
-}
 </style>

src/views/projectManage/bugList/details/dropdown.vue

@@ -1,56 +0,0 @@
-<template>
-  <el-dropdown
-    placement="bottom"
-    @command="clickCommand"
-  >
-    <el-button
-      class="el-dropdown-link drop_down"
-      style="cursor: pointer;"
-      :size="size"
-    >
-      <span class="el-dropdown-link">{{ value }}</span>
-      <i class="el-icon-arrow-down el-icon--right" />
-    </el-button>
-    <el-dropdown-menu slot="dropdown">
-      <el-dropdown-item
-        v-for="(item,index) in options"
-        :key="index"
-        :command="item"
-      >{{ item.name }}</el-dropdown-item>
-    </el-dropdown-menu>
-  </el-dropdown>
-</template>
-
-<script>
-export default {
-  name: 'BugDropDown',
-  props: {
-    value: {
-      type: String,
-      default: null
-    },
-    options: {
-      type: Array,
-      default() {
-        return []
-      }
-    },
-    size: {
-      type: String,
-      default: 'medium'
-    }
-  },
-  methods: {
-    getName() {
-
-    },
-    clickCommand(item) {
-      this.$emit('command', item)
-    }
-  }
-}
-</script>
-
-<style>
-
-</style>

src/views/projectManage/bugList/details/index.vue

@@ -1,24 +1,10 @@
 <template>
   <div v-loading="loading.drawer" class="bug-detail">
-    <div v-if="type!=='page'" style="padding: 15px 5px 5px 30px" class="bug_manage_container  bug_manage bug_manage_title">
-      <span style="font-size:18px;font-weight:500;color:#333b4a">{{ 'BUG-'+ id }}</span>
-      <el-button type="text" />
-      <dropdown
-        v-if="map.bugEnumList && typeof bug.status !== 'undefined'"
-        v-model="map.bugEnumList[bug.status]"
-        :options="enums.bugEnumList"
-        :size="'small'"
-        :class="{
-          'item-color' : map.bugEnumList[bug.status] === '待修复' || '修复中',
-          'item' : map.bugEnumList[bug.status] === '已完成',
-          'item1' : map.bugEnumList[bug.status] === '待测试',
-          'item2' : map.bugEnumList[bug.status] === 'Reopen',
-          'item3' : map.bugEnumList[bug.status] === 'Hold'
-        }"
-        style="margin-left: 20px"
-        class="button_status"
-        @command="openStatsDialog"
-      />
+    <div v-if="type!=='page'" style="padding: 15px 5px 5px 30px" class="bug_manage_container Layout_space_between bug_manage_title">
+      <span class="Layout_flex_start ">
+        <span style="font-size:18px;font-weight:500;color:#333b4a; margin-right: 15px;">{{ 'BUG-'+ id }}</span>
+        <Status-component :title="'缺陷'" :status-data="queryData.status" :status-row="queryData" />
+      </span>
       <div style="display: inline-block;float:right">
         <span class="newBtn" @click="getToDetails()"><i class="el-icon-document" /> 查看详情</span>
         <span class="newBtn" style="padding: 0 10px" @click="openQueryDialog()"><i class="el-icon-document-copy" /> 复制</span>
@@ -64,14 +50,7 @@
                   />
                 </el-form-item>
                 <el-form-item id="itemLength1" style="margin:0">
-                  <dropdown
-                    v-if="map.bugEnumList && typeof bug.status !== 'undefined'"
-                    v-model="map.bugEnumList[bug.status]"
-                    size="small"
-                    :options="enums.bugEnumList"
-                    class="button_status"
-                    @command="openStatsDialog"
-                  />
+                  <Status-component :title="'缺陷'" :status-data="2" :status-row="bug" />
                 </el-form-item>
                 <el-form-item id="itemLength2" style="margin:0;float:right">
                   <el-button size="small" class="button_delete2" @click="openDeleteDialog()">删除</el-button>
@@ -568,91 +547,21 @@
       </el-container>
       <!-- 弹窗 -->
       <el-dialog
-        v-if="statusDialogVisible"
         :visible.sync="statusDialogVisible"
-        width="33%"
-        class="bug_manage_dialog"
+        width="30%"
+        title="删除确认"
+        class="public_task"
         :append-to-body="true"
         :close-on-click-modal="false"
       >
-        <template v-slot:title>
-          <div style="display:flex;align-items: center;">
-            <div style="width:4px;height:15px;background:#409EFF;border-radius:1px;" />
-            <div
-              style="width:83px;height:18px;font-size:16px;font-family:MicrosoftYaHei;color:rgba(51,59,74,1);margin-left:6px"
-            >{{ statusDialogTitle }}</div>
-          </div>
-        </template>
-        <el-form
-          v-if="statusDialogTitle !== '删除确认'"
-          label-width="110px"
-          label-position="left"
-          :model="statusDialogForm"
-          :rules="rules"
-        >
-          <el-form-item
-            v-if="statusDialogTitle === '待测试' || statusDialogTitle === '已完成'"
-            label="缺陷原因"
-            prop="bugReason"
-          >
-            <el-select v-model="statusDialogForm.bugReason" style="width: 100%">
-              <el-option
-                v-for="item in enums.bugReasonEnumList"
-                :key="item.code"
-                :label="item.name"
-                :value="item.code"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item
-            v-if="statusDialogTitle === '待测试'"
-            label="修复方式"
-            class="bug_manage_dialog bug_manage_dialog_fixMethod"
-          >
-            <el-input
-              v-model="statusDialogForm.reasonOrDesc"
-              type="textarea"
-              placeholder="请输入具体原因和修复方式"
-              maxlength="300"
-              show-word-limit
-              rows="4"
-            />
-          </el-form-item>
-          <el-form-item
-            v-if="statusDialogTitle === '已完成'"
-            label="修复结果"
-            prop="repairResult"
-            class="bug_manage_dialog"
-          >
-            <el-select
-              v-model="statusDialogForm.repairResult"
-              style="width: 100%"
-            >
-              <el-option
-                v-for="item in enums.repairResultEnumList"
-                :key="item.code"
-                :label="item.name"
-                :value="item.code"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item v-if="statusDialogTitle === 'Reopen'" label="Reopen原因" prop="reasonOrDesc">
-            <el-input
-              v-model="statusDialogForm.reasonOrDesc"
-              type="textarea"
-              placeholder="请输入Reopen"
-              maxlength="300"
-              show-word-limit
-              rows="4"
-            />
-          </el-form-item>
-        </el-form>
-        <div v-else style="text-align:center;line-height: 150px">是否要删除当前缺陷？</div>
+        <div class="blueStripe" />
+        <div style="text-align:center;line-height: 150px">是否要删除当前缺陷？</div>
         <template v-slot:footer>
-          <el-button @click="statusDialogCancel">取 消</el-button>
+          <el-button @click="statusDialogVisible = false">取 消</el-button>
           <el-button type="primary" @click="statusDialogConfirm">确 定</el-button>
         </template>
       </el-dialog>
+
       <createdBug v-if="modalShow" ref="createdBug" @father="father" />
       <normal-dialog
         :show-dialog="showCopyFile"
@@ -687,8 +596,7 @@
 <script>
 import fackClickOutSide from './fackClickOutSide.js'
 import E from 'wangeditor'
-// import Utils from '../../../../util.js'
-// import { settingGetTypeMap } from '@/api/taskIndex'
+import StatusComponent from '@/components/StatusComponent/StatusComponent.vue'
 import { getCommentList, addComment, getMemberInfo } from '@/api/requirement.js'
 import {
   bugDetails,
@@ -699,11 +607,11 @@ import {
   releaseList,
   settingQueryBizModuleList
 } from '@/api/defectManage.js'
-import Dropdown from './dropdown.vue'
 import normalDialog from '@/components/dialog/normalDialog'
 import createdBug from '@/views/projectManage/bugList/file/createdBug'
 import axios from 'axios'
 import { deepClone } from '@/utils/global'
+import '@/styles/PublicStyle/index.scss'
 
 document.body.onpaste = function(event) {
   const data = (event.clipboardData || window.clipboardData)
@@ -723,9 +631,9 @@ document.body.onpaste = function(event) {
 export default {
   name: 'BugDetails',
   components: {
-    Dropdown,
     createdBug,
-    normalDialog
+    normalDialog,
+    StatusComponent
   },
   mixins: [fackClickOutSide],
   props: {
@@ -733,6 +641,14 @@ export default {
       type: String,
       default: '0'
     },
+    bugEnumList: {
+      type: Array,
+      default: null
+    },
+    status: {
+      type: Object,
+      default: null
+    },
     type: {
       type: String,
       default: 'page'
@@ -744,6 +660,7 @@ export default {
   },
   data() {
     return {
+      queryData: this.status,
       modalShow: false,
       iconName: 'float_反馈_icon_close',
       bugNameIsFocus: false,
@@ -753,8 +670,10 @@ export default {
       bugDescribe: '',
       bugNameForm: { bugName: '' },
       fileList: [],
+      bugEnumLists: this.bugEnumList, // 状态option
       notImageList: [], // 文件非图片数组
       ImageList: [], // 文件图片数组
+      statusDialogVisible: false,
       accessory: null,
       dialogVisible: false,
       dialogImageUrl: [],
@@ -781,9 +700,6 @@ export default {
       formHeight: '',
       formHeight1: '',
       userLoading: false,
-      statusDialogVisible: false,
-      statusDialogTitle: '',
-      statusDialogForm: {},
       options: [
         { name: '测试', code: 1 },
         { name: '测试2', code: 2 }
@@ -817,15 +733,6 @@ export default {
         ],
         bugName: [
           { required: true, message: '标题不可为空', trigger: 'blur' }
-        ],
-        bugReason: [
-          { required: true, message: '请选择缺陷原因', trigger: 'change' }
-        ],
-        repairResult: [
-          { required: true, message: '请选择修复结果', trigger: 'change' }
-        ],
-        reasonOrDesc: [
-          { required: true, message: '请输入Reopen原因', trigger: 'blur' }
         ]
       },
       showCopyFile: false, // 复制文件对话框
@@ -841,11 +748,6 @@ export default {
     }
   },
   watch: {
-    statusDialogVisible(newVal, oldVal) {
-      if (!newVal) {
-        this.statusDialogForm = null
-      }
-    },
     id(newVal, oldVal) {
       this.bug = {}
       this.bugModel = {}
@@ -871,21 +773,10 @@ export default {
     }
   },
   mounted() {
+    console.log(this.status, 'sss')
     this.bugGetEnum()
     this.$nextTick(() => {
       this.bugGet(this.id, false).then(res => {
-        // this.assignerOptions = []
-        // for (const i in this.bug.assignerList.length) {
-        //   this.searchUser(this.bug.assigner[i]).then(res => {
-        //     this.assignerOptions = res.data
-        //   })
-        // }
-        // this.currentHandlerOptions = []
-        // for (const i in this.bug.currentHandlerList.length) {
-        //   this.searchUser(this.bug.currentHandler[i]).then(res => {
-        //     this.currentHandlerOptions = res.data
-        //   })
-        // }
         this.PersonnelData()
         this.changeWidthOnBlur()
         releaseList().then(res => {
@@ -1176,6 +1067,7 @@ export default {
           //   }
           // }
           this.bug = res.data
+          console.log(this.bug, 'xiangqing')
           this.bug.currentHandler = res.data.currentHandler.split(',')
           this.bug.assigner = res.data.assigner.split(',')
           this.bug.currentHandler.map(item => {
@@ -1348,19 +1240,9 @@ export default {
     openStatsDialog(item) {
       this.statusDialogForm = JSON.parse(JSON.stringify(this.bug))
       this.statusDialogForm.status = item.code
-      if (item.name === '待修复' || item.name === '修复中' || item.name === 'Hold') {
-        this.bugUpdate(this.statusDialogForm, 'title')
-          .then(res => {
-            this.bugGet(this.bug.id, false)
-          })
-        return
-      }
       this.statusDialogTitle = item.name
       this.statusDialogVisible = true
     },
-    statusDialogCancel() {
-      this.statusDialogVisible = false
-    },
     statusDialogConfirm() {
       if (this.statusDialogTitle === '删除确认') {
         this.bugDelete().then(res => {
@@ -1373,55 +1255,9 @@ export default {
             }
           }
         })
-      } else if (this.statusDialogTitle === '待测试') {
-        if (
-          typeof this.statusDialogForm.bugReason === 'undefined' ||
-          this.statusDialogForm.bugReason === null
-        ) {
-          this.$message.warning('请选择缺陷原因')
-        }
-        this.postDialogForm()
-          .then(res => {
-            this.getCommentList()
-          })
-      } else if (this.statusDialogTitle === '已完成') {
-        if (
-          typeof this.statusDialogForm.bugReason === 'undefined' ||
-          this.statusDialogForm.bugReason === null
-        ) {
-          this.$message.warning('请选择缺陷原因')
-          return
-        }
-        if (
-          typeof this.statusDialogForm.repairResult === 'undefined' ||
-          this.statusDialogForm.repairResult === null
-        ) {
-          this.$message.warning('请选择修复结果')
-          return
-        }
-        this.postDialogForm()
-      } else if (this.statusDialogTitle === 'Reopen') {
-        if (!this.statusDialogForm.reasonOrDesc) {
-          this.$message.warning('请输入Reopen原因')
-          return
-        }
-        this.postDialogForm()
-          .then(res => {
-            this.getCommentList()
-          })
-        // this.addComment()
-        this.statusDialogVisible = false
       }
     },
-    postDialogForm() {
-      this.statusDialogForm.id = this.id
-      return this.bugUpdate(this.statusDialogForm).then(res => {
-        this.statusDialogVisible = false
-        this.statusDialogForm = {}
-        this.bugGet(this.bug.id)
-        return res
-      })
-    },
+
     generateMixed(len) {
       const chars = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z']
       let res = ''
@@ -1517,36 +1353,18 @@ export default {
   line-height: 14px;
   padding: 7px 10px;
 }
-.bug_manage_title .button_delete2,.button_status .el-button {
+/* .bug_manage_title .button_delete2,.button_status .el-button {
   padding: 7px 10px;
   font-size: 14px;
   font-weight: normal;
-}
-.bug_manage_dialog .el-dialog {
-  border-radius:4px;
-}
-.bug_manage_dialog .el-dialog__header {
-  padding: 20px 45px;
-}
-.bug_manage_dialog .el-dialog__body {
-  padding: 0px 45px;
-}
-.bug_manage_dialog .el-dialog__footer {
-  padding: 20px 45px 40px 0;
-}
+} */
+
 .layout_header,
 .layout_aside,
 .layout_main {
-  /* border-radius: 4px; */
   background-color: #ffffff;
 }
-.bug_manage_dialog_fixMethod .el-form-item__label {
-  padding-left: 10px;
-}
-.bug_manage_dialog .el-form-item__label {
-  color: #666666;
-  font-weight: 400;
-}
+
 .bug_manage_title .el-form-item__label {
   color: #333b4a;
   font-size: 18px;
@@ -1809,45 +1627,3 @@ border-color: #DCDFE6;
   white-space: nowrap;
 }
 </style>
-<style lang="scss">
-.item-color {
-  /deep/ .el-button {
-    color: rgb(106, 180, 255);
-    border: 1px solid rgb(106, 180, 255);
-    border-color: rgb(106, 180, 255) !important;
-    background: #FFF;
-  }
-}
-.item{
-  /deep/ .el-button {
-    color: rgb(126, 211, 33);
-    border: 1px solid rgb(126, 211, 33);
-     border-color: rgb(126, 211, 33) !important;
-    background: #FFF;
-  }
-}
-.item1 {
-  /deep/ .el-button {
-    color: rgb(255, 204, 102);
-     border: 1px solid rgb(255, 204, 102);
-     border-color: rgb(255, 204, 102) !important;
-    background: #FFF;
-  }
-}
-.item2 {
-  /deep/ .el-button {
-    color: rgb(245, 108, 108);
-    border: 1px solid rgb(245, 108, 108);
-    border-color: rgb(245, 108, 108) !important;
-    background: #FFF;
-  }
-}
-.item3 {
-  /deep/ .el-button {
-    color: #D675F0;
-    border: 1px solid #D675F0;
-    border-color: #D675F0 !important;
-    background: #FFF;
-  }
-}
-</style>

src/views/projectManage/iteration/components/create.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-dialog :visible.sync="showIteration" :show="show" class="task" :title="titName" width="40%" :close-on-click-modal="false" :destroy-on-close="true" @close="OnClose()">
+  <el-dialog :visible.sync="showIteration" :show="show" class="public_task" :title="titName" width="40%" :close-on-click-modal="false" :destroy-on-close="true" @close="OnClose()">
     <div class="blueStripe" />
     <el-form ref="ruleForm" :model="iteration" :rules="rules" label-width="120px">
       <el-form-item label="迭代名称" prop="name">

src/views/projectManage/iteration/components/delete.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-dialog :visible.sync="visible" :show="show" class="deleteClassName task" title="移除确认" width="60%" :close-on-click-modal="false" :destroy-on-close="true" @close="OnClose()">
+  <el-dialog :visible.sync="visible" :show="show" class="deleteClassName public_task" title="移除确认" width="60%" :close-on-click-modal="false" :destroy-on-close="true" @close="OnClose()">
     <div class="blueStripe" />
     <div align="center">
       <img style="display: inline-block; width: 40px;" :src="exclamationMark">

src/views/projectManage/iteration/components/deleteIteration.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-dialog :visible.sync="visible" :show="show" class="deleteClassName task" title="删除迭代" width="30%" :close-on-click-modal="false" :destroy-on-close="true" @close="OnClose()">
+  <el-dialog :visible.sync="visible" :show="show" class="deleteClassName public_task" title="删除迭代" width="30%" :close-on-click-modal="false" :destroy-on-close="true" @close="OnClose()">
     <div class="blueStripe" />
     <div align="center">
       <img style="display: inline-block; width: 40px;" :src="exclamationMark">

src/views/projectManage/iteration/index.vue

@@ -2,7 +2,7 @@
   <el-container class="BackgroundCloth">
     <el-header class="public_header">
       <div class="Layout_space_between">
-        <div class="themeName">迭代</div>
+        <div class="public_themeName">迭代</div>
         <el-button size="mini" type="primary" @click="showIteration = true">新建迭代</el-button>
       </div>
       <el-divider style="color: #EEF0F5; margin: 10px 0 ;" />
@@ -193,12 +193,6 @@ export default {
 <style scoped lang="scss">
 .BackgroundCloth {
 
-.themeName {
-  font-size: 22px;
-  font-weight: 450;
-  padding-left: 15px;
-}
-
 .el-divider--horizontal {
   margin: 10px 0;
 }