问题缺陷详情

src/api/excel.js

@@ -98,3 +98,13 @@ export function errorDataExport(data) {
     data
   })
 }
+
+// 缺陷问题详情导出
+export function errorDetailsListExport(data) {
+  return request_blob({
+    url: `/home_quality/errorDetailsListExport`,
+    method: 'post',
+    responseType: 'blob',
+    data
+  })
+}

src/router/index.js

@@ -135,6 +135,13 @@ export const constantRoutes = [
         hidden: true, //不在导航栏展示
         meta: { title: '缺陷问题' },
       },
+      {
+        path: '/defectRuleProblem',
+        name: 'DefectRuleProblem',
+        component: () => import('@/views/data/frontHome/defectRuleProblem'),
+        hidden: true, //不在导航栏展示
+        meta: { title: '缺陷问题详情' },
+      },
       {
         path: '/codeList',
         name: 'codeList',

src/views/data/frontHome/components/SearchBox2.vue

@@ -0,0 +1,154 @@
+<template>
+  <div class="app-container">
+    <el-form :inline="true" :model="data" class="demo-form-inline">
+      <el-form-item label="住院编号">
+        <el-input v-model="data.AAA28" placeholder="请输入"></el-input>
+      </el-form-item>
+      <el-form-item label="缺陷描述">
+        <el-input v-model="data.desc" placeholder="请输入"></el-input>
+      </el-form-item>
+      <el-form-item label="缺陷归类">
+        <el-select v-model="data.type" filterable clearable placeholder="请选择">
+          <el-option v-for="item of selectData.type" :key="item" :label="item" :value="item" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="缺陷分级">
+        <el-select v-model="data.level" filterable clearable placeholder="请选择">
+          <el-option v-for="item of selectData.level" :key="item" :label="item" :value="item" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="出院科室">
+        <el-select v-model="data.dep_id" filterable clearable placeholder="请选择">
+          <el-option v-for="item of selectData.level" :key="item" :label="item" :value="item" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="出院时间">
+        <el-date-picker
+          v-model="data.start_time"
+          type="date"
+          :picker-options="pickerOptions1"
+          placeholder="开始时间"
+        />
+      </el-form-item>
+      <el-form-item label="">
+        <el-date-picker
+          v-model="data.end_time"
+          type="date"
+          :picker-options="pickerOptions2"
+          placeholder="结束时间"
+        />
+      </el-form-item>
+      <el-form-item label="住院医师">
+        <el-select v-model="data.AEE04" filterable clearable placeholder="请选择">
+          <el-option v-for="item of selectData.doctor" :key="item.id" :label="item.name" :value="item.name" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="编码员">
+        <el-select v-model="data.AEE08" filterable clearable placeholder="请选择">
+          <el-option v-for="item of selectData.doctor" :key="item.id" :label="item.name" :value="item.id" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="" class="more-btn">
+        <el-button type="text" @click="showMore = !showMore">{{ showMore ? '收回' : '更多'}}</el-button>
+      </el-form-item>
+      <el-collapse-transition>
+        <div v-show="showMore">
+          <el-form-item label="主要诊断名称">
+            <el-input v-model="data.ICD10_NAME" placeholder="请输入"></el-input>
+          </el-form-item>
+          <el-form-item label="主要诊断编码">
+            <el-input v-model="data.ICD10_ID1" placeholder="请输入"></el-input>
+          </el-form-item>
+          <el-form-item label="主要手术名称">
+            <el-input v-model="data.ICD9_NAME" placeholder="请输入"></el-input>
+          </el-form-item>
+          <el-form-item label="主要手术编码">
+            <el-input v-model="data.ICD9_ID1" placeholder="请输入"></el-input>
+          </el-form-item>
+        </div>
+      </el-collapse-transition>
+      <el-form-item style="display: block; text-align: center;">
+        <el-button type="primary" @click="onSubmit" class="search-btn">查询</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    data: {
+      type: Object,
+      default() {
+        return {
+          error_rule: '',
+          AAA28: '',
+          dep_id: '',
+          start_time: '',
+          end_time: '',
+          type: '',
+          level: '',
+          desc: '',
+          AEE04: '',
+          AEE08: '',
+          ICD10_NAME: '',
+          ICD10_ID1: '',
+          ICD9_NAME: '',
+          ICD9_ID1: ''
+        }
+      }
+    }
+  },
+  data() {
+    return {
+      showMore: false,
+      pickerOptions1: {
+        disabledDate: (time) => {
+          if (this.data.end_time) {
+            return time.getTime() > new Date(this.data.end_time).getTime()
+          } else {
+            return time.getTime() > Date.now()
+          }
+        }
+      },
+      pickerOptions2: {
+        disabledDate: (time) => {
+          if (this.data.start_time) {
+            return time.getTime() < new Date(this.data.start_time).getTime()
+          } else {
+            return time.getTime() > Date.now()
+          }
+        }
+      },
+      selectData:  {},
+    }
+  },
+  created() {
+    this.getSelectData()
+  },
+  methods: {
+    getSelectData() {
+      this.$axios.post('/home_quality/getErrorSerachWhere').then(res => {
+        this.selectData = res.data
+      });
+    },
+    onSubmit() {
+      this.$emit('search')
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.demo-form-inline {
+  text-align: center;
+  position: relative;
+  .more-btn {
+    position: absolute;
+    right: 100px;
+  }
+}
+.search-btn {
+  width: 240px;
+}
+</style>

src/views/data/frontHome/components/TableBox.vue

@@ -28,7 +28,7 @@
         label="缺陷数量"
         width="200">
         <template slot-scope="scope">
-          <span class="link">{{ scope.row.count }}</span>
+          <span class="link" @click="toPage(scope.row)">{{ scope.row.count }}</span>
         </template>
       </el-table-column>
       <el-table-column
@@ -66,6 +66,10 @@ export default {
     // 模板导出
     onExport() {
       this.$emit('export')
+    },
+    toPage(row) {
+      const { error_rule } = row
+      this.$router.push({ path: '/defectRuleProblem', query: { error_rule }})
     }
   }
 }

src/views/data/frontHome/components/TableBox2.vue

@@ -0,0 +1,83 @@
+<template>
+  <div class="app-container">
+    <div class="btn-box">
+      <el-button type="primary" plain icon="el-icon-download" @click="onExport">导出数据</el-button>
+    </div>
+    <el-table
+      v-loading="loading"
+      border
+      :data="data"
+      style="width: 100%">
+      <el-table-column
+        type="index"
+        label="序号"
+        align="center"
+        width="120">
+      </el-table-column>
+      <el-table-column
+        prop="field"
+        label="缺陷字段"
+        width="200">
+      </el-table-column>
+      <el-table-column
+        prop="desc"
+        label="缺陷描述">
+      </el-table-column>
+      <el-table-column
+        prop=""
+        label="缺陷数量"
+        width="200">
+        <template slot-scope="scope">
+          <span class="link">{{ scope.row.count }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="level"
+        label="缺陷分级"
+        width="200">
+      </el-table-column>
+      <el-table-column
+        prop="type"
+        label="缺陷归类"
+        width="200">
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+
+export default {
+  props: {
+    data: {
+      type: Array,
+      default() {
+        return []
+      }
+    },
+    loading: {
+      type: Boolean,
+      default() {
+        return false
+      }
+    }
+  },
+  methods: {
+    // 模板导出
+    onExport() {
+      this.$emit('export')
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.btn-box {
+  text-align: right;
+  margin-bottom: 15px;
+}
+.link {
+  cursor: pointer;
+  color: #409EFF;
+}
+</style>

src/views/data/frontHome/defectRuleProblem.vue

@@ -1,15 +1,135 @@
 <template>
-  <div>
-    123123
+  <div class="box">
+    <div class="box_wrapper">
+      <SearchBoxVue :data="searchData" @search="handleSearch" />
+      <TableBoxVue :loading="loading" :data="tableData" @export="handelExport" style="margin-top: -40px;" />
+      <div style="overflow: hidden;">
+        <el-pagination
+          v-if="tableData && tableData.length !== 0"
+          :total="paginationData.total"
+          background
+          class="table-pagination"
+          :page-size="paginationData.limit"
+          :current-page.sync="paginationData.page"
+          layout="total, sizes, prev, pager, next, jumper"
+          @size-change="SizeChangeEvent"
+          @current-change="pageHasChanged"
+        />
+      </div>
+    </div>
   </div>
 </template>
 
 <script>
+import SearchBoxVue from './components/SearchBox2.vue'
+import TableBoxVue from './components/TableBox2.vue'
+import { errorDetailsListExport } from '@/api/excel'
+
 export default {
-  
+  components: {
+    SearchBoxVue,
+    TableBoxVue
+  },
+  data() {
+    return {
+      loading: false,
+      searchData: {
+        error_rule: '',
+        AAA28: '',
+        dep_id: '',
+        start_time: '',
+        end_time: '',
+        type: '',
+        level: '',
+        desc: '',
+        AEE04: '',
+        AEE08: '',
+        ICD10_NAME: '',
+        ICD10_ID1: '',
+        ICD9_NAME: '',
+        ICD9_ID1: ''
+      },
+      tableData: [],
+      paginationData: {
+        total: 0,
+        page: 1,
+        limit: 10
+      },
+      error_rule: ''
+    }
+  },
+  created() {
+    this.error_rule = this.$route.query.error_rule
+    this.getList()
+  },
+  methods: {
+    getList() {
+      const {
+        page,
+        limit
+      } = this.paginationData
+      const params = {
+        ...this.searchData,
+        error_rule: this.error_rule,
+        page,
+        page_size: limit
+      }
+      this.$axios.post('/home_quality/errorDetailsList', params).then(res => {
+        this.tableData = res.data.list
+        this.paginationData.total = res.data.count
+      });
+    },
+    SizeChangeEvent(val) {
+      this.paginationData.limit = val
+      this.getList()
+    },
+    pageHasChanged(val) {
+      this.paginationData.page = val
+      this.getList()
+      
+    },
+    handleSearch() {
+      this.paginationData.page = 1
+      this.getList()
+    },
+    handelExport() {
+      errorDetailsListExport(...this.searchData).then(res => {
+        const content = res.data; // 后台返回二进制数据
+        const blob = new Blob([content]);
+        const fileName = `缺陷问题详情.csv`;
+        if ('download' in document.createElement('a')) {
+          // 非IE下载
+          const elink = document.createElement('a');
+          elink.download = fileName;
+          elink.style.display = 'none';
+          elink.href = URL.createObjectURL(blob);
+          document.body.appendChild(elink);
+          elink.click();
+          URL.revokeObjectURL(elink.href); // 释放URL 对象
+          document.body.removeChild(elink);
+        } else {
+          // IE10+下载
+          navigator.msSaveBlob(blob, fileName);
+        }
+      });
+    }
+  }
 }
 </script>
 
 <style lang="scss" scoped>
-
+.box {
+  user-select: none;
+  padding: 16px;
+  .box_wrapper {
+    padding: 16px;
+    padding: 16px;
+    background: #fff;
+    border-radius: 5px;
+    position: relative;
+  }
+  .table-pagination {
+    float: right;
+  }
+}
 </style>