op

src/api/onlineproblem.js

@@ -0,0 +1,11 @@
+import request from '@/utils/request'
+import { TeamManagement } from '@/apiConfig/api'
+
+// 获取团队信息
+export function teamQueryTeamInfo(data) {
+  return request({
+    url: TeamManagement + `/team/queryTeamInfo`,
+    method: 'post',
+    data
+  })
+}

src/components/formInput/index.vue

@@ -0,0 +1,133 @@
+<template>
+  <div class="formInput Layout">
+    <span class="title">
+      <span>*</span>
+      {{ title }}
+    </span>
+    <!-- 输入框 -->
+    <el-input
+      v-if="type === 'input'"
+      v-model="val"
+      :size="size"
+      clearable
+      :placeholder="`placeholderinput`"
+      @change="(e) => $emit('onChange', e)"
+    />
+    <!-- number -->
+    <!-- <el-input
+      v-else-if="type === 'number'"
+      v-model="val"
+      :size="size"
+      type="number"
+      :placeholder="`placeholdernumber`"
+      @change="(e) => $emit('onChange', e)"
+    /> -->
+    <el-input-number
+      v-else-if="type === 'number'"
+      v-model="val"
+      :size="size"
+      style="width:194px"
+      :placeholder="`placeholdernumber`"
+      @change="(e) => $emit('onChange', e)"
+    />
+    <!-- textarea -->
+    <el-input
+      v-else-if="type === 'textarea'"
+      v-model="val"
+      :size="size"
+      type="textarea"
+      :placeholder="`placeholdertextarea`"
+      @change="(e) => $emit('onChange', e)"
+    />
+    <!-- 静态下啦选择 -->
+    <el-select
+      v-else-if="type === 'select'"
+      v-model="val"
+      :size="size"
+      :multiple="multiple"
+      clearable
+      filterable
+      :placeholder="`placeholderselect`"
+      @change="(e) => $emit('onChange', e)"
+    >
+      <el-option v-for="o in option" :key="o.value" :label="o.label" :value="o.value" />
+    </el-select>
+    <!-- 远程搜索 -->
+    <el-select
+      v-else-if="type === 'remoteSelect'"
+      v-model="val"
+      filterable
+      remote
+      clearable
+      :placeholder="`placeholderremoteSelect`"
+      :remote-method="(q) => $emit('remoteMethod', q)"
+      :loading="loading"
+      :size="size"
+      @change="(e) => $emit('onChange', e)"
+    >
+      <el-option v-for="o in option" :key="o.value" :label="o.label" :value="o.value" />
+    </el-select>
+    <!-- 日期 -->
+    <el-date-picker
+      v-else-if="type === 'date'"
+      v-model="val"
+      :size="size"
+      value-format="yyyy-MM-dd hh:mm:ss"
+      type="datetime"
+      placeholder="选择日期时间"
+      style="width:194px"
+      @change="(e) => $emit('onChange', e)"
+    />
+  </div>
+</template>
+<script>
+import '@/views/projectManage/publicCss/index.css'
+export default {
+  props: {
+    value: defaultStatus,
+    title: {
+      type: String,
+      required: true
+    },
+    type: {
+      type: String,
+      default: 'input',
+      required: false
+    },
+    multiple: {
+      type: Boolean,
+      default: false,
+      required: false
+    },
+    loading: {
+      type: Boolean,
+      default: false,
+      required: false
+    },
+    option: {
+      type: Array,
+      default: () => [],
+      required: false
+    }
+    // data: {
+    //   type: Object,
+    //   default: () => {},
+    //   required: true
+    // }
+  },
+  data() {
+    return {
+      val: this.value,
+      size: 'small'
+    }
+  }
+}
+</script>
+<style scoped lang="scss">
+.formInput {
+  .title {
+    // display: inline-block;
+    min-width: 153px;
+  }
+}
+</style>

src/components/headTitle/index.vue

@@ -1,9 +1,9 @@
 <template>
-  <div class="main-title">
+  <div class="header-title">
     <div class="title-left-icon" />
     <div class="title-left-name">{{ title }}</div>
-    <div v-if="openEdit" class="editBtn">
-      <i class="el-icon-edit" @click="$emit('editHandle')" />
+    <div v-if="openBtn" class="editBtn">
+      <i :class="icon" @click="$emit('handle')" />
     </div>
   </div>
 </template>
@@ -14,17 +14,21 @@ export default {
       type: String,
       required: true
     },
-    openEdit: {
+    openBtn: {
       type: Boolean,
       required: false
+    },
+    icon: {
+      type: String,
+      default: '',
+      required: false
     }
   }
 }
 </script>
 <style scoped lang="scss">
-.main-title {
+.header-title {
   align-items: center;
-  padding: 20px 30px;
   .title-left-icon {
     width: 4px;
     height: 17px;

src/components/searchHeader/index.vue

@@ -0,0 +1,90 @@
+<template>
+  <div class="searchHeader">
+    <div class="defaultBox Layout">
+      <div class="content">
+        <searchBox :list="data.default" />
+      </div>
+      <div class="btn" @click="showMore">{{ goodName }}</div>
+    </div>
+    <div v-show="!DetailedScreening" class="advBox">
+      <div class="content">
+        <searchBox :list="data.adv" />
+      </div>
+      <div class="btnWrap">
+        <el-button type="primary" size="mini" @click="search(form_all)">筛 选</el-button>
+        <el-button size="mini" @click="moreReset">重 置</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import searchBox from './searchBox'
+import '@/views/projectManage/publicCss/index.css'
+export default {
+  components: {
+    searchBox
+  },
+  props: {
+    data: {
+      type: Object,
+      required: false,
+      default: () => {}
+    }
+  },
+  data() {
+    return {
+      form_all: {},
+      options: [],
+      goodName: '更多筛选',
+      loading: false,
+      DetailedScreening: false,
+      renderList: this.list || {}
+    }
+  },
+  mounted() {
+    console.log(this.data)
+  },
+  methods: {
+    create() {
+      console.log('新建')
+    },
+    showMore() {
+      console.log('showMore')
+    },
+    moreReset() {
+      console.log('moreReset')
+    }
+  }
+}
+</script>
+<style scoped lang="scss">
+.searchHeader {
+  .defaultBox {
+    align-items: flex-end;
+    position: relative;
+    .btn {
+      position: absolute;
+      bottom: 16px;
+      right: 0;
+      font-size: 14px;
+      color: #00A0FF;
+      cursor: pointer;
+      width: 80px;
+      text-align: center;
+    }
+  }
+  .advBox {
+    background: #fcfcfc;
+    border-radius: 4px;
+    padding: 15px 0;
+    min-height: 100px;
+    margin-top: 6px;
+    border: 1px solid #eee;
+    width: 100%;
+    .btnWrap {
+      text-align: right;
+      padding-right: 16px;
+    }
+  }
+}
+</style>

src/components/searchHeader/searchBox.vue

@@ -0,0 +1,83 @@
+<template>
+  <div class="searchBox">
+    <div v-for="(item, index) in list" :key="index" class="row">
+      <div v-for="l in item" :key="l.name" class="Layout" style="display: inline-flex;padding-left: 15px; width:270px;">
+        <div class="name">{{ l.name }}</div>
+        <el-select
+          v-if="l.type === 'select'"
+          v-model="l.default"
+          size="small"
+          :multiple="l.multiple"
+          clearable
+          filterable
+          :placeholder="l.placeholder"
+          @change="change(l.key)"
+        >
+          <el-option v-for="o in l.option" :key="o.value" :label="o.label" :value="o.value" />
+        </el-select>
+        <el-select
+          v-else-if="l.type === 'remoteSelect'"
+          v-model="l.default"
+          filterable
+          remote
+          clearable
+          :placeholder="l.placeholder"
+          :remote-method="(q) => remoteMethod(l.key, q)"
+          :loading="loading"
+          size="small"
+          @change="change(l.key)"
+        >
+          <el-option v-for="o in l.option" :key="o.value" :label="o.label" :value="o.value" />
+        </el-select>
+        <el-input
+          v-else
+          v-model="l.default"
+          style="width: 72% !important"
+          size="small"
+          clearable
+          :placeholder="l.placeholder"
+          @change="change(l.key)"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  props: {
+    list: {
+      type: Array,
+      required: false,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      loading: false
+    }
+  },
+  mounted() {
+    console.log(this.list)
+  },
+  methods: {
+    change(key) {
+      console.log(key)
+    },
+    remoteMethod(key, q) {
+      console.log('remoteMethod', q, key)
+    }
+  }
+}
+</script>
+<style scoped lang="scss">
+.searchBox {
+  .row {
+    width: 810px;
+    // justify-content: flex-start;
+    padding-bottom: 16px;
+  }
+  .name {
+    width: 80px;
+  }
+}
+</style>

src/icons/svg/link.svg

@@ -1 +1 @@
-<svg width="128" height="128" xmlns="http://www.w3.org/2000/svg"><path d="M115.625 127.937H.063V12.375h57.781v12.374H12.438v90.813h90.813V70.156h12.374z"/><path d="M116.426 2.821l8.753 8.753-56.734 56.734-8.753-8.745z"/><path d="M127.893 37.982h-12.375V12.375H88.706V0h39.187z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="16.016" height="16.013"><defs><style>.cls-1{fill:#444}</style></defs><g id="链接" transform="translate(-130.797 -128.095)"><path id="路径_13067" data-name="路径 13067" class="cls-1" d="M438.511 138.76a2.351 2.351 0 01-1.673-.69l-.56-.56a.445.445 0 11.629-.629l.56.56a1.485 1.485 0 002.088 0l4.923-4.923a1.479 1.479 0 000-2.088l-1.018-1.018a1.485 1.485 0 00-2.088 0l-3.057 3.057a.445.445 0 01-.629-.629l3.055-3.055a2.372 2.372 0 013.345 0l1.018 1.018a2.37 2.37 0 010 3.345l-4.923 4.923a2.349 2.349 0 01-1.67.689z" transform="translate(-298.983)"/><path id="路径_13068" data-name="路径 13068" class="cls-1" d="M134.179 395.141a2.351 2.351 0 01-1.673-.69l-1.018-1.018a2.37 2.37 0 010-3.345l4.923-4.923a2.372 2.372 0 013.345 0l.459.459a.445.445 0 11-.629.629l-.459-.459a1.485 1.485 0 00-2.088 0l-4.923 4.923a1.479 1.479 0 000 2.088l1.018 1.018a1.485 1.485 0 002.088 0l3.055-3.055a.445.445 0 11.629.629l-3.055 3.055a2.347 2.347 0 01-1.672.689z" transform="translate(0 -251.033)"/></g></svg>

src/router/newRouter.js

@@ -192,6 +192,7 @@ const layout = [
         component: () => import('@/views/projectManage/taskList/versionsCalendar'),
         meta: { title: '版本日历' }
       },
+      // 文博 项目列表
       {
         path: 'onlineProblem',
         name: '线上问题 ',
@@ -200,6 +201,14 @@ const layout = [
         component: () => import('@/views/projectManage/onlineproblem'),
         meta: { title: '线上问题 ' }
       },
+      {
+        path: '/onlineProblem/create',
+        name: '质惠新建线上问题',
+        hidden: true,
+        component: () => import('@/views/projectManage/onlineproblem/create'),
+        meta: { title: '质惠新建线上问题' }
+      },
+      // ---end---
       {
         path: 'useCasePage',
         name: '测试用例',

src/views/projectManage/onlineproblem/component/header.vue

@@ -1,282 +0,0 @@
-<template>
-  <div class="Parent1" style="background-color:#F2F3F6;min-height:calc(100vh - 80px);padding: 0 10px 10px 10px">
-    <div class="stylus-head">
-      <div class="stylus-title">
-        <div>
-          <span style="font-size: 22px;letter-spacing: 1px;font-weight: 600;color: #333B4A;padding-left: 15px">线上问题</span>
-        </div>
-        <div>
-          <el-button type="primary" size="mini" @click="create">新建问题</el-button>
-        </div>
-      </div>
-      <el-divider style="color: #EEF0F5;" />
-      <span v-for="item in renderList.adv" :key="item.name">
-        {{ item.name }}
-      </span>
-      <div class="Layout" style="padding-top: 5px;">
-        <div>
-          <el-form :model="form_all" class="Layout">
-            <div class="Layout" style="padding-left: 15px">
-              <div class="queryName">问题名称</div>
-              <el-input v-model="form_all.name" size="small" clearable style="width:72% !important;" placeholder="请输入问题名称或ID搜索" @change="search(form_all)" />
-            </div>
-          </el-form>
-        </div>
-        <div class="screen" @click="showSelect">{{ goodName }}</div>
-      </div>
-      <div v-show="DetailedScreening" class="stylus-more">
-        <div>
-          <!-- <el-form :model="form_all" class="flex_start">
-            <div class="Layout">
-              <div class="queryName">等级</div>
-              <el-select v-model="form_all.bizType" size="small" clearable filterable placeholder="请选择">
-                <el-option v-for="item in arr_prjectType" :key="item.value" :label="item.name" :value="item.value" />
-              </el-select>
-            </div>
-            <div class="Layout" label="创建人">
-              <div class="queryName marginLeft">责任团队</div>
-              <el-select
-                v-model="form_all.creater"
-                filterable
-                remote
-                clearable
-                placeholder="请输入姓名或邮箱前缀"
-                :remote-method="remoteMethod"
-                :loading="loading"
-                size="small"
-                @focus="optionsClear"
-              >
-                <el-option
-                  v-for="item in options"
-                  :key="item.idap"
-                  :label="item.name"
-                  :value="test2(item, 0)"
-                >
-                  <div class="flex_start">
-                    <div class="deptName">{{ item.deptName }}</div>
-                    <div style="min-width:80px">{{ item.name }}</div>
-                    <div class="deptName">{{ item.idap }}</div>
-                  </div>
-                </el-option>
-              </el-select>
-            </div>
-          </el-form> -->
-        </div>
-        <div align="right" style="padding-top: 1%;">
-          <el-button type="primary" size="mini" @click="search(form_all)">筛 选</el-button>
-          <el-button size="mini" @click="query_Reset">重 置</el-button>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-<script>
-import {
-  memberQueryMemberInfoByIDAPorName
-} from '@/api/projectIndex'
-import searchData from './searchData'
-import '@/views/projectManage/publicCss/index.css'
-export default {
-  data() {
-    return {
-      form_all: {},
-      options: [],
-      goodName: '更多筛选',
-      loading: false,
-      DetailedScreening: false,
-      renderList: searchData
-    }
-  },
-  methods: {
-    create() {
-      console.log('新建')
-    },
-    test2(item, e) {
-      // 获取团队人员信息
-      if (typeof this.test[item.idap] === 'undefined') {
-        item.role = e
-        this.test[item.idap] = item
-      }
-      return item.idap
-    },
-    home_created_project() {
-      this.form = {}
-      this.dialogFormVisible = true
-      this.$nextTick(() => {
-        this.$refs['form'].clearValidate()
-      })
-      this.$set(this.form, 'bizId', this.bizId)
-    },
-    remoteMethod(query) {
-      // 人员查询
-      if (query !== '') {
-        this.loading = true
-        setTimeout(() => {
-          this.loading = false
-          memberQueryMemberInfoByIDAPorName({ memberIDAP: query }).then(res => {
-            this.options = res.data
-          })
-        }, 200)
-      } else {
-        this.options = []
-      }
-    },
-    optionsClear() {
-      this.options = []
-    },
-    showSelect() {
-      this.DetailedScreening = !this.DetailedScreening
-      this.goodName === '更多筛选' ? this.goodName = '收起筛选' : this.goodName = '更多筛选'
-    },
-    query_Reset() {
-      // 重置
-      this.$set(this.form_all, 'priority', this.query_object.priority)
-      this.$set(this.form_all, 'name', this.query_object.name)
-      this.$set(this.form_all, 'projectOwner', this.query_object.projectOwner)
-      this.$set(this.form_all, 'bizType', '')
-      this.$set(this.form_all, 'creater', '')
-      this.$message({
-        message: '已重置',
-        type: 'success',
-        duration: 1000,
-        offset: 150
-      })
-      this.search(this.form_all)
-    },
-    search() {
-      console.log(111)
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.stylus-head {
-  position: relative;
-}
-.new-tab-open {
-  // position: absolute;
-  display: inline-block;
-  margin-left: 10px;
-  height: 30px;
-  vertical-align: middle;
-}
-.task {
-  /deep/ .el-dialog__title {
-    line-height: 24px;
-    font-size: 18px;
-    color: #303133;
-    padding-left: 10px;
-}
-
-.blueStripe {
-  width:4px;
-  height:17px;
-  background:#409EFF;
-  border-radius:1px;
-  position: absolute;
-  top: 23px;
-  left: 20px;
-}
-}
-</style>
-
-<style scoped>
-.el-loading-mask {
-  z-index: 8;
-}
-.footer {
-  text-align: right;
-  margin: 1%;
-  background-color: #ffffff;
-  border-radius: 4px;
-}
-
-.requirement-x .el-table .cell {
-  padding: 5px 0;
-  font-size: 14px;
-  font-family: MicrosoftYaHei;
-}
-.requirement-x  .el-table .el-table__body tr:hover td { color: #409EFF; background: #EDF6FF; } /*hover时字体, 背景颜色*/
-
-.requirement_el-dropdown-menu {
-  max-height: 300px !important;
-  max-width: 200px;
-  overflow-y: auto !important;
-}
-
-.el-dropdown-menu__item:not(.is-disabled):hover {
-  background-color: #f6f7fa;
-  color: #606266;
-}
-
-.el-table .warning-row {
-  background: oldlace;
-}
-
-.drop_down {
-  font-size: 14px;
-  color: #333333;
-}
-.el-dialog__header {
-    padding: 0px 0px 0px;
-}
-.div_priority {
-  color: #ffffff;
-  width:fit-content;
-  padding: 0 12px;
-  border-radius: 4px;
-  margin-left: 4px;
-}
- .Parent1 .el-table .cell {
-    box-sizing: border-box;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    word-break: break-all;
-    line-height: 23px;
-    padding-right: 10px;
-    margin: -6px 0 -2px 0 !important;
-}
-</style>
-
-<style lang="stylus" scoped>
-  .stylus-head >>> .el-form-item__label
-    color #333333
-    font-weight 400
-  .stylus-content >>> .el-table .el-table__body tr:hover td
-    // color #409EFF !important
-    background #EDF6FF
-  .stylus-head >>> .el-divider--horizontal
-    margin 10px 0
-  .stylus-head >>> .el-form-item
-    margin-bottom 0
-  .stylus-head
-    width 100%
-    padding 15px
-    margin-bottom: 10px
-    background-color white
-    border-radius 4px
-    .stylus-title
-      display flex
-      justify-content space-between
-      align-items center
-    .stylus-more
-      background rgba(252,252,252,1)
-      border-radius 4px
-      padding 15px
-      min-height 100px
-      margin-top 22px
-      border 1px solid rgba(238,238,238,1)
-      width 100%
-  .stylus-content
-    width 100%
-    padding 0.3% 1% 1% 1%
-    margin:0 auto
-    background-color white
-    border-radius 4px
-    min-height: calc(100vh - 142px);
-    .stylus-hover:hover
-      color #409EFF !important
-      cursor pointer
-</style>
-

src/views/projectManage/onlineproblem/component/header/index.vue

@@ -0,0 +1,42 @@
+<template>
+  <div class="header">
+    <div class="stylus-head">
+      <mainTitle title="线上问题" btn-text="新建问题" @btn-handle="create" />
+      <searchHeader :data="renderList" />
+    </div>
+  </div>
+</template>
+<script>
+import searchHeader from '@/components/searchHeader'
+import searchData from './searchData'
+import mainTitle from '../mainTitle'
+export default {
+  components: {
+    searchHeader,
+    mainTitle
+  },
+  data() {
+    return {
+      renderList: searchData
+    }
+  },
+  methods: {
+    create() {
+      console.log('新建')
+      this.$router.push({ name: '质惠新建线上问题', query: { id: 111 }})
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.header {
+  background-color: #f2f3f6;
+}
+.stylus-head {
+  width: 100%;
+  padding: 15px;
+  margin-bottom: 10px;
+  background-color: white;
+  border-radius: 4px;
+}
+</style>

src/views/projectManage/onlineproblem/component/searchData.js → src/views/projectManage/onlineproblem/component/header/searchData.js

@@ -1,14 +1,19 @@
 const data = {
   default: [
-    {
-      name: '问题名称',
-      type: 'input',
-      placeholder: '请输入问题名称或ID'
-    }
+    [
+      {
+        name: '问题名称',
+        default: '',
+        key: 'title',
+        type: 'input',
+        placeholder: '请输入问题名称或ID'
+      }
+    ]
   ],
   adv: [
-    {
+    [{
       name: '等级',
+      key: 'priority',
       type: 'select',
       multiple: false,
       placeholder: '',
@@ -26,6 +31,7 @@ const data = {
     },
     {
       name: '责任团队',
+      key: 'teamId',
       type: 'remoteSelect',
       multiple: false,
       placeholder: '请选择责任团队',
@@ -34,6 +40,7 @@ const data = {
     },
     {
       name: '是否定级',
+      key: 'isGrading',
       type: 'select',
       multiple: false,
       placeholder: '',
@@ -42,9 +49,10 @@ const data = {
         { value: false, label: '否' },
         { value: true, label: '是' }
       ]
-    },
-    {
+    }],
+    [{
       name: '影响面',
+      key: 'influenceSurface',
       type: 'select',
       multiple: true,
       placeholder: '',
@@ -59,12 +67,13 @@ const data = {
     },
     {
       name: '创建人',
+      key: 'creator',
       type: 'remoteSelect',
       multiple: false,
       placeholder: '请选择创建人',
       default: '',
       option: []
-    }
+    }]
   ]
 }
 export default data

src/views/projectManage/onlineproblem/component/list.vue

@@ -0,0 +1,100 @@
+<template>
+  <div class="list">
+    <div class="time">2020.12</div>
+    <el-table
+      v-loading="table_loading"
+      :data="dataList"
+      style="width: 100%;"
+      highlight-current-row
+      :header-cell-style="{ 'background':'#F7F7F7', 'color':'#4a4a4a','font-size':'14px','font-weight':'500' }"
+      :cell-style="{ 'font-size':'14px','color':'rgba(102,102,102,1)' }"
+      size="small"
+      show-overflow-tooltip="true"
+    >
+      <el-table-column label="优先级" min-width="100" prop="priority" sortable align="left" fixed>
+        <template slot-scope="scope">
+          <div class="div_priority" :style="{background: priorityColors[scope.row.priority]}">{{ scope.row.priorityString }}</div>
+        </template>
+      </el-table-column>
+      <el-table-column label="标题" min-width="250" show-overflow-tooltip align="left">
+        <template slot-scope="scope">
+          <span style="font-size: 12px;color: rgba(167,174,188,1);">
+            {{ scope.row.taskIdSting }}
+            <span
+              v-if="scope.row.tagNotification !== null && scope.row.status !== -2"
+              :class="{
+                'tagNotification': scope.row.tagType === 0,
+                'tagNotification1': scope.row.tagType === 1
+              }"
+            >
+              {{ scope.row.tagNotification }}
+            </span>
+            <span v-if="scope.row.status === -2" class="tagNotification1"> {{ 'hold' }} </span>
+          </span><br>
+          <span class="stylus-hover" @click="link_task(scope.row.id)">{{ scope.row.name }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="责任团队" min-width="150" align="center" show-overflow-tooltip>
+        <template slot-scope="scope">{{ scope.row.statusString }}</template>
+      </el-table-column>
+      <el-table-column label="复盘链接" width="150" align="center" show-overflow-tooltip>
+        <template slot-scope="scope">{{ scope.row.stageString }}</template>
+      </el-table-column>
+      <el-table-column min-width="130" align="center">
+        <template slot="header">
+          改进项已完成
+          <el-tooltip effect="dark" content="已完成改进项条数/总改进项条数" placement="top-start">
+            <i class="el-icon-info" />
+          </el-tooltip>
+        </template>
+        <template
+          slot-scope="scope"
+        >{{ scope.row.rdObject !== null? scope.row.rdObject.name: '' }}</template>
+      </el-table-column>
+      <el-table-column label="是否星辰花定级" min-width="150" align="center">
+        <template
+          slot-scope="scope"
+        >{{ scope.row.qaObject !== null?scope.row.qaObject.name: '' }}</template>
+      </el-table-column>
+      <el-table-column label="形象面" width="150" align="center" show-overflow-tooltip>
+        <template slot-scope="scope">{{ scope.row.moduleInfoName }}</template>
+      </el-table-column>
+      <el-table-column label="发生时间" min-width="120" align="center">
+        <template slot-scope="scope">{{ scope.row.noTestString }}</template>
+      </el-table-column>
+      <el-table-column label="创建人" width="120" align="center" show-overflow-tooltip>
+        <template slot-scope="scope">{{ scope.row.bugCount }}</template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+<script>
+export default {
+  components: {
+    // searchHeader
+  },
+  data() {
+    return {
+      table_loading: false,
+      dataList: [],
+      priorityColors: ['#F56C6C', '#FF8952', '#F5E300', '#7ED321', '#61D3B8', '#69B3FF', '#BDBDBD']
+    }
+  },
+  methods: {
+    create() {
+      console.log('新建')
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.list {
+  .time{
+    color: #333;
+    font-size: 16px;
+    padding: 16px 10px;
+    background: #fff;
+  }
+}
+</style>
+

src/views/projectManage/onlineproblem/component/mainTitle.vue

@@ -0,0 +1,42 @@
+<template>
+  <div class="mainTitle">
+    <div class="stylus-title">
+      <div>
+        <span style="font-size: 22px;letter-spacing: 1px;font-weight: 600;color: #333b4a;padding-left: 15px;">{{ title }}</span>
+      </div>
+      <div v-if="btnText">
+        <el-button type="primary" size="mini" @click="$emit('btn-handle')">{{ btnText }}</el-button>
+      </div>
+    </div>
+    <el-divider class="dividerLine" />
+  </div>
+</template>
+<script>
+export default {
+  props: {
+    btnText: {
+      type: String,
+      default: '',
+      required: false
+    },
+    title: {
+      type: String,
+      default: '',
+      required: true
+    }
+  }
+}
+</script>
+<style scoped lang="scss">
+.mainTitle {
+  .dividerLine {
+    margin: 10px 0;
+    color: #eef0f5;
+  }
+  .stylus-title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+}
+</style>

src/views/projectManage/onlineproblem/create/component/base.vue

@@ -0,0 +1,82 @@
+<template>
+  <div class="base">
+    <div v-for="(item, index) in renderBaseData" :key="index" class="formLine" :class="item.length > 1 && 'Layout'">
+      <formInput
+        v-for="d in item"
+        :key="d.key"
+        :title="d.name"
+        :type="d.type"
+        :option="d.option"
+        :value="data[d.key]"
+        @onChange="(e) => onChange(d.key, e)"
+        @remoteMethod="(e) => remoteMethod(d.key, e)"
+      />
+    </div>
+    <!-- <div class="formLine Layout">
+      <formInput title="等级" :value="data.priority" @onChange="(e) => onChange('priority', e)" />
+      <formInput title="是否星辰花定级" :value="data.isGrading" @onChange="(e) => onChange('isGrading', e)" />
+    </div>
+    <div class="formLine Layout">
+      <formInput title="发生日期" type="date" :value="data.happenDate" @onChange="(e) => onChange('happenDate', e)" />
+      <formInput title="责任团队" :value="data.teamId" @onChange="(e) => onChange('teamId', e)" />
+    </div>
+    <div class="formLine Layout">
+      <formInput title="影响面" :value="data.influenceSurface" @onChange="(e) => onChange('influenceSurface', e)" />
+      <formInput title="影响描述" :value="data.influenceDesc" @onChange="(e) => onChange('influenceDesc', e)" />
+    </div>
+    <div class="formLine Layout">
+      <formInput title="闭环时长（分）" :value="data.closedLoopTime" @onChange="(e) => onChange('closedLoopTime', e)" />
+      <formInput title="SLA不可用时长（分）" :value="data.slaNotAvailableTime" @onChange="(e) => onChange('slaNotAvailableTime', e)" />
+    </div>
+    <div class="formLine">
+      <formInput title="描述" :value="data.desc" @onChange="(e) => onChange('desc', e)" />
+    </div> -->
+  </div>
+</template>
+<script>
+import { teamQueryTeamInfo } from '@/api/onlineproblem'
+import renderBase from './renderBase'
+import formInput from '@/components/formInput'
+import '@/views/projectManage/publicCss/index.css'
+export default {
+  components: {
+    formInput
+  },
+  props: {
+    data: {
+      type: Object,
+      default: () => {},
+      required: true
+    }
+  },
+  data() {
+    return {
+      renderBaseData: renderBase
+    }
+  },
+  methods: {
+    onChange(key, value) {
+      console.log('onChange:', key, value)
+      this.$emit('onChange', { [key]: value })
+    },
+    async remoteMethod(key, q) {
+      console.log(key, q)
+      const res = await teamQueryTeamInfo({ teamName: q })
+      console.log(res)
+      this.renderBaseData.map(t => t.map(g => {
+        if (g.key === key) {
+          g.option = res.data
+        }
+      }))
+      console.log(this.renderBaseData)
+    }
+  }
+}
+</script>
+<style scoped lang="scss">
+.base{
+  .formLine {
+    margin: 24px 0px;
+  }
+}
+</style>

src/views/projectManage/onlineproblem/create/component/makeBetterList.vue

@@ -0,0 +1,3 @@
+<template>
+  <span>11111</span>
+</template>

src/views/projectManage/onlineproblem/create/component/renderBase.js

@@ -0,0 +1,52 @@
+
+import d from '../../component/header/searchData'
+const data = [
+  [{
+    name: '名称',
+    key: 'title',
+    type: 'input'
+  }],
+  [{
+    ...d.adv[0][0]
+  }, {
+    name: '是否星辰花定级',
+    key: 'isGrading',
+    type: 'select',
+    multiple: false,
+    placeholder: '',
+    default: false,
+    option: [
+      { value: false, label: '否' },
+      { value: true, label: '是' }
+    ]
+  }],
+  [{
+    name: '发生日期',
+    key: 'happenDate',
+    type: 'date'
+  }, {
+    ...d.adv[0][1]
+  }],
+  [{
+    ...d.adv[1][0]
+  }, {
+    name: '影响描述',
+    key: 'influenceDesc',
+    type: 'input'
+  }],
+  [{
+    name: '闭环时长（分）',
+    key: 'closedLoopTime',
+    type: 'number'
+  }, {
+    name: 'SLA不可用时长（分）',
+    key: 'slaNotAvailableTime',
+    type: 'number'
+  }],
+  [{
+    name: '描述',
+    key: 'desc',
+    type: 'textarea'
+  }]
+]
+export default data

src/views/projectManage/onlineproblem/create/index.vue

@@ -0,0 +1,104 @@
+<template>
+  <div class="create main-section">
+    <mainTitle title="新建线上问题" />
+    <div class="content">
+      <header class="header">
+        <headTitle title="基础信息" />
+      </header>
+      <div class="content">
+        <baseBox :data="baseData" @onChange="(d) => change('baseData', d)" />
+      </div>
+      <header class="header">
+        <headTitle title="复盘" icon="el-icon-link" :open-btn="true" @handle="linkHandle" />
+      </header>
+      <div class="content">
+        <!-- 复盘 -->
+        <div>
+          <normal-area
+            id="replay"
+            :value.sync="replayDesc"
+            :empty-text="'点击'"
+            :input-button="'修改模板'"
+            :styles="{ padding: '15px 0px 0px 0px', maxHeight: '200px' }"
+          />
+        </div>
+      </div>
+      <header class="header">
+        <headTitle title="改进项" />
+      </header>
+      <div class="content">
+        <makeBetterList />
+      </div>
+    </div>
+    <div class="control">
+      <el-button size="small" @click="back">取消</el-button>
+      <el-button type="primary" size="small" @click="create()">
+        创建
+      </el-button>
+    </div>
+    <!-- 111111111create0
+    <span @click="back">{{ $route.query.id }}</span> -->
+  </div>
+</template>
+<script>
+import mainTitle from '../component/mainTitle'
+import headTitle from '@/components/headTitle'
+import baseBox from './component/base'
+import makeBetterList from './component/makeBetterList'
+import normalArea from '@/components/input/normalArea' // 富文本
+import 'tinymce/plugins/table'// 插入表格插件
+export default {
+  components: {
+    mainTitle,
+    headTitle,
+    baseBox,
+    makeBetterList,
+    normalArea
+  },
+  data() {
+    return {
+      baseData: {},
+      replayDesc: '',
+      improvements: [1, 2, 3]
+    }
+  },
+  methods: {
+    back() {
+      console.log('back')
+      this.$router.push({ name: '线上问题 ', query: { id: 111 }})
+    },
+    create() {
+      console.log('create:', { ...this.baseData, replayDesc: this.replayDesc, improvements: this.improvements })
+    },
+    linkHandle() {
+      console.log('link')
+    },
+    change(type, data) {
+      this[type] = { ...this[type], ...data }
+      console.log(this[type])
+    }
+  }
+}
+</script>
+<style scoped lang="scss">
+@import '@/styles/detail-pages.scss';
+.create{
+  padding: 16px 20px;
+  &.main-section {
+    @include main-section;
+  }
+  .header {
+    margin-top: 5px;
+  }
+  .content {
+    width: 80%;
+    margin-bottom: 46px;
+  }
+  .control {
+    width: 100%;
+    text-align: right;
+    padding: 0px 20px 20px 0px;
+  }
+}
+
+</style>

src/views/projectManage/onlineproblem/index.vue

@@ -1,11 +1,26 @@
 <template>
-  <Header />
+  <div class="onlineproblem">
+    <Header />
+    <div class="content">
+      <list />
+    </div>
+  </div>
 </template>
 <script>
 import Header from './component/header'
+import list from './component/list'
 export default {
   components: {
-    Header
+    Header,
+    list
   }
 }
 </script>
+<style scoped lang="scss">
+.onlineproblem {
+  padding: 0 10px 10px 10px;
+  .content {
+    // margin: 0 10px 10px 10px;
+  }
+}
+</style>

src/views/projectManage/publishTask/components/checkboxList.vue

@@ -6,13 +6,12 @@
   </div>
 </template>
 <script>
-// const cityOptions = ['上海', '北京', '广州', '深圳', 'ss', 'qq', 'www', 'eeee', 'ssss', 'vvvv', 'ggg', 'jjj']
 export default {
   props: {
     selectedList: {
       type: Array,
       required: false,
-      default: () => []
+      default: () => [{ adv: {}}]
     },
     data: {
       type: Array,
@@ -23,8 +22,6 @@ export default {
   data() {
     return {
       checkAll: false,
-      // checkedCities: ['上海', '北京'],
-      // cities: cityOptions,
       isIndeterminate: true,
       List: this.selectedList
     }

src/views/projectManage/publishTask/index.vue

@@ -2,7 +2,7 @@
   <div class="editPublishTask">
     <section class="main-section pubconfig">
       <div v-if="showEmpty">
-        <header>
+        <header class="header">
           <headTitle title="checklist" />
         </header>
         <div class="empty">
@@ -10,8 +10,8 @@
         </div>
       </div>
       <div v-else>
-        <header>
-          <headTitle title="checklist" :open-edit="openEdit" @editHandle="editHandle" />
+        <header class="header">
+          <headTitle title="checklist" icon="el-icon-edit" :open-btn="openEdit" @handle="editHandle" />
         </header>
         <div class="wrap">
           <redTipword title="关联任务" :isedit="edit" />
@@ -72,7 +72,7 @@
     </section>
     <div v-if="!edit">
       <section class="main-section">
-        <div>
+        <div class="header">
           <headTitle title="动态" />
         </div>
         <actionDynamic :comments="commentlist" :change-record="changeRecordList" @addComment="createCommentHandle" />
@@ -497,6 +497,9 @@ export default {
   min-height: 400px;
   overflow-y: auto;
   padding-bottom: 20px;
+  .header {
+    padding: 20px 30px;
+  }
   .step {
     position: fixed;
     top: 200px;

src/views/projectManage/taskList/taskIndex.vue

@@ -382,6 +382,7 @@ export default {
       }
       taskList(this.form_task).then(res => {
         this.task_table = res.data
+        console.log(JSON.stringify(res.data))
         this.total = res.total
         this.table_loading = false
       })