对接隐患清单，更换loading动画

src/components/Loading/index.js

@@ -0,0 +1,11 @@
+import Loading from './loading'
+import service from './loading/serve';
+
+export default {
+  install(Vue) {
+    Vue.directive('Loading', Loading);
+    Vue.prototype.$loading = service;
+  },
+  Loading,
+  service
+}

src/components/Loading/loading/index.js

@@ -0,0 +1,54 @@
+import Vue from 'vue'
+import Loading from './loading.vue'
+/**
+ * Vue.extend 接受参数并返回一个构造器，new 该构造器可以返回一个组件实例
+ * new Mask() 的时候，把该组件实例挂载到一个 div 上
+ **/
+const Mask = Vue.extend(Loading)
+
+// 更新是否显示
+const toggleLoading = (el, binding) => {
+  if (binding.value) {
+    Vue.nextTick(() => {
+      // 控制loading组件显示
+      el.instance.visible = true
+      el.style.position = 'relative'
+      // 插入到目标元素
+      insertDom(el, el)
+    })
+  } else {
+    el.instance.visible = false
+    el.style.position = 'static'
+    el.mask && el.mask.parentNode && el.mask.parentNode.removeChild(el.mask)
+  }
+}
+
+// 插入到目标元素
+const insertDom = (parent, el) => {
+  parent.appendChild(el.mask)
+}
+
+export default {
+  // 第一次绑定到元素时调用
+  bind: function(el, binding, vnode) {
+    const mask = new Mask({
+      el: document.createElement('div'),
+      data() {}
+    })
+    // 用一个变量接住mask实例
+    el.instance = mask
+    el.mask = mask.$el
+    el.maskStyle = {}
+    binding.value && toggleLoading(el, binding)
+  },
+  // 所在组件的 VNode 更新时调用--比较更新前后的值
+  update: function(el, binding) {
+    if (binding.oldValue !== binding.value) {
+      toggleLoading(el, binding)
+    }
+  },
+  // 指令与元素解绑时调用
+  unbind: function(el, binding) {
+    el.instance && el.instance.$destroy()
+  }
+}

src/components/Loading/loading/loading.css

@@ -0,0 +1,202 @@
+/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
+/* stylelint-disable no-duplicate-selectors */
+/* stylelint-disable */
+/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
+.ant-spin {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  color: rgba(0, 0, 0, 0.65);
+  font-size: 14px;
+  font-variant: tabular-nums;
+  line-height: 1.5;
+  list-style: none;
+  font-feature-settings: 'tnum';
+  position: absolute;
+  display: none;
+  color: #1890ff;
+  text-align: center;
+  vertical-align: middle;
+  opacity: 0;
+  transition: transform 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
+}
+.ant-spin-spinning {
+  position: static;
+  display: inline-block;
+  opacity: 1;
+}
+.ant-spin-nested-loading {
+  position: relative;
+}
+.ant-spin-nested-loading > div > .ant-spin {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 4;
+  display: block;
+  width: 100%;
+  height: 100%;
+  max-height: 400px;
+}
+.ant-spin-nested-loading > div > .ant-spin .ant-spin-dot {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  margin: -10px;
+}
+.ant-spin-nested-loading > div > .ant-spin .ant-spin-text {
+  position: absolute;
+  top: 50%;
+  width: 100%;
+  padding-top: 5px;
+  text-shadow: 0 1px 2px #fff;
+}
+.ant-spin-nested-loading > div > .ant-spin.ant-spin-show-text .ant-spin-dot {
+  margin-top: -20px;
+}
+.ant-spin-nested-loading > div > .ant-spin-sm .ant-spin-dot {
+  margin: -7px;
+}
+.ant-spin-nested-loading > div > .ant-spin-sm .ant-spin-text {
+  padding-top: 2px;
+}
+.ant-spin-nested-loading > div > .ant-spin-sm.ant-spin-show-text .ant-spin-dot {
+  margin-top: -17px;
+}
+.ant-spin-nested-loading > div > .ant-spin-lg .ant-spin-dot {
+  margin: -16px;
+}
+.ant-spin-nested-loading > div > .ant-spin-lg .ant-spin-text {
+  padding-top: 11px;
+}
+.ant-spin-nested-loading > div > .ant-spin-lg.ant-spin-show-text .ant-spin-dot {
+  margin-top: -26px;
+}
+.ant-spin-container {
+  position: relative;
+  transition: opacity 0.3s;
+}
+.ant-spin-container::after {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 10;
+  display: none \9;
+  width: 100%;
+  height: 100%;
+  background: #fff;
+  opacity: 0;
+  transition: all 0.3s;
+  content: '';
+  pointer-events: none;
+}
+.ant-spin-blur {
+  clear: both;
+  overflow: hidden;
+  opacity: 0.5;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  pointer-events: none;
+}
+.ant-spin-blur::after {
+  opacity: 0.4;
+  pointer-events: auto;
+}
+.ant-spin-tip {
+  color: rgba(0, 0, 0, 0.45);
+}
+.ant-spin-dot {
+  position: relative;
+  display: inline-block;
+  font-size: 20px;
+  width: 50px;
+  height: 50px;
+}
+.ant-spin-dot-item {
+  position: absolute;
+  display: block;
+  width: 25px;
+  height: 25px;
+  background-color: #1890ff;
+  border-radius: 100%;
+  transform: scale(0.75);
+  transform-origin: 50% 50%;
+  opacity: 0.3;
+  -webkit-animation: antSpinMove 1s infinite linear alternate;
+          animation: antSpinMove 1s infinite linear alternate;
+}
+.ant-spin-dot-item:nth-child(1) {
+  top: 0;
+  left: 0;
+}
+.ant-spin-dot-item:nth-child(2) {
+  top: 0;
+  right: 0;
+  -webkit-animation-delay: 0.4s;
+          animation-delay: 0.4s;
+}
+.ant-spin-dot-item:nth-child(3) {
+  right: 0;
+  bottom: 0;
+  -webkit-animation-delay: 0.8s;
+          animation-delay: 0.8s;
+}
+.ant-spin-dot-item:nth-child(4) {
+  bottom: 0;
+  left: 0;
+  -webkit-animation-delay: 1.2s;
+          animation-delay: 1.2s;
+}
+.ant-spin-dot-spin {
+  transform: rotate(45deg);
+  -webkit-animation: antRotate 1.2s infinite linear;
+          animation: antRotate 1.2s infinite linear;
+}
+.ant-spin-sm .ant-spin-dot {
+  font-size: 14px;
+}
+.ant-spin-sm .ant-spin-dot i {
+  width: 6px;
+  height: 6px;
+}
+.ant-spin-lg .ant-spin-dot {
+  font-size: 32px;
+}
+.ant-spin-lg .ant-spin-dot i {
+  width: 14px;
+  height: 14px;
+}
+.ant-spin.ant-spin-show-text .ant-spin-text {
+  display: block;
+}
+@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
+  /* IE10+ */
+  .ant-spin-blur {
+    background: #fff;
+    opacity: 0.5;
+  }
+}
+@-webkit-keyframes antSpinMove {
+  to {
+    opacity: 1;
+  }
+}
+@keyframes antSpinMove {
+  to {
+    opacity: 1;
+  }
+}
+@-webkit-keyframes antRotate {
+  to {
+    transform: rotate(405deg);
+  }
+}
+@keyframes antRotate {
+  to {
+    transform: rotate(405deg);
+  }
+}

src/components/Loading/loading/loading.vue

@@ -0,0 +1,34 @@
+<template>
+  <div class="loading-container">
+    <span class="ant-spin-dot ant-spin-dot-spin">
+      <i class="ant-spin-dot-item"></i>
+      <i class="ant-spin-dot-item"></i>
+      <i class="ant-spin-dot-item"></i>
+      <i class="ant-spin-dot-item"></i>
+    </span>
+  </div>
+</template>
+
+<script>
+import './loading.css'
+export default {
+  name: "loading",
+};
+</script>
+
+<style lang ="scss"  scoped>
+.loading-container {
+  height: 100%;
+  width: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+  font-size: 12px;
+  z-index: 1000;
+  min-height: 60px;
+  background-color: rgba(255, 255, 255, 0.2);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+</style>

src/components/Loading/loading/serve.js

@@ -0,0 +1,60 @@
+import Vue from 'vue';
+import loadingVue from './loading.vue';
+
+const LoadingConstructor = Vue.extend(loadingVue);
+
+const defaults = {
+  text: null,
+  fullscreen: true,
+  body: false,
+  lock: false,
+  customClass: ''
+};
+
+let fullscreenLoading;
+
+LoadingConstructor.prototype.originalPosition = '';
+LoadingConstructor.prototype.originalOverflow = '';
+
+LoadingConstructor.prototype.close = function() {
+  if (this.fullscreen) {
+    fullscreenLoading = undefined;
+  }
+  console.log(this.$el,'666')
+  this.$el.parentNode.removeChild(this.$el);
+  this.$destroy();
+  this.visible = false;
+};
+
+const Loading = (options = {}) => {
+  console.log(Vue.prototype.$isServer,'options')
+  if (Vue.prototype.$isServer) return;
+  if (typeof options.target === 'string') {
+    options.target = document.querySelector(options.target);
+  }
+  options.target = options.target || document.body;
+  if (options.target !== document.body) {
+    options.fullscreen = false;
+  } else {
+    options.body = true;
+  }
+  if (options.fullscreen && fullscreenLoading) {
+    return fullscreenLoading;
+  }
+
+  let parent = options.body ? document.body : options.target;
+  console.log(parent,'parent')
+  let instance = new LoadingConstructor({
+    el: document.createElement('div'),
+    data: options
+  });
+  parent.appendChild(instance.$el);
+  Vue.nextTick(() => {
+    instance.visible = true;
+  });
+  if (options.fullscreen) {
+    fullscreenLoading = instance;
+  }
+  return instance;
+};
+export default Loading;

src/components/TabBar.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <van-tabbar fixed route v-model="active" @change="handleChange">
+    <van-tabbar route v-model="active" @change="handleChange">
       <van-tabbar-item v-for="(item, index) in data" :to="item.to" :icon="item.icon" :key="index">
         {{ item.title }}
       </van-tabbar-item>

src/components/selectCell/index.vue

@@ -81,10 +81,10 @@ export default {
       this.showPicker = false;
     },
     pickerConfirm(val){
-      this.selected = val;
       this.label = val[this.prop.label];
       this.showPicker = false;
-      this.$emit('change',this.selected[this.prop.value])
+      console.log(this.selected,'234')
+      this.$emit('change',val[this.prop.value])
     },
     clickItem(){
       this.showPicker = true;

src/components/upload/uploader.vue

@@ -47,11 +47,12 @@ export default {
       value:{
         handler(val){
           console.log(val,'ttttt')
+          if(!val || val.length === 0) return;
           this.fileList = val.map(v=>{
             v.url = imgUrl(v.imgPath);
             return v
           })
-          this.imageList = JSON.parse(JSON.stringify(this.fileList))
+          this.imageList = JSON.parse(JSON.stringify(this.fileList));
         },
         immediate:true
       }
@@ -96,6 +97,7 @@ export default {
         }).catch((err) => {
           /*上传失败*/
           this.$toast.fail('上传失败')
+          this.fileList.splice(this.fileList.length-1,1);
         });
       },
       //删除

src/router/router.config.js

@@ -192,7 +192,7 @@ export let routers = [
         path: '/problemItem',
         name: 'problemItem',
         component: () => import('@/views/menu/problemItem/index'),
-        meta: { title: '隐患问题清单', keepAlive: false }
+        meta: { title: '隐患问题清单', keepAlive: true }
       },
       {
         path: '/problemDetail',

src/utils/globalMixins.js

@@ -35,6 +35,17 @@ export default {
       })
       return item?.value
     },
+    getDictLabel(key,dictType){
+      let item = this.dictionary?.find((v)=>{
+        return  v.key === dictType
+      })
+      let dictLabel = item?.value?.find(v=>{
+        if( v.dictValue == key){
+          return v.dictLabel
+        }
+      })
+      return dictLabel?.dictLabel
+    },
     //时间范围模板：2020-01-01~2020-01-02
     rangDate(start,end,a){
       if(!start || !end) return '暂无';

src/utils/loading.js

@@ -0,0 +1,24 @@
+import Loading from '@/components/Loading'
+let count = 0;
+let loading;
+
+function create(){
+    loading = Loading.service({
+        lock: true,
+        text: '加载中……',
+        background: 'rgba(0, 0, 0, 0.5)'
+    })
+}
+
+function close(){
+    loading.close();
+}
+export function showLoading(){
+    if(count === 0) create();
+    count++;
+}
+export function hideLoading(){
+    if(count <= 0) return;
+    count--;
+    if(count === 0) close();
+}

src/utils/request.js

@@ -1,6 +1,7 @@
 import axios from 'axios'
 import router from '@/router'
 import { Toast } from 'vant'
+import {showLoading,hideLoading} from './loading'
 // 根据环境不同引入不同api地址
 import { baseApi } from '@/config'
 // create an axios instance
@@ -18,9 +19,16 @@ service.interceptors.request.use(
     // 不传递默认开启loading
     if (!config.hideLoading) {
       // loading
-       loading = Toast.loading({
-        forbidClick: true
-      })
+      //  loading = Toast.loading({
+      //   duration: 0, // 持续展示 toast
+      //   forbidClick: true
+      // })
+
+      showLoading()
+      // loading = Loading.service({
+      //   lock: true,
+      //   background: 'rgba(0, 0, 0, 0.5)'
+      // })
     }
     const token = sessionStorage.getItem('access_token');
     if (token) {
@@ -37,7 +45,8 @@ service.interceptors.request.use(
 
 
 let success = response => {
-  if (loading) Toast.clear();
+  //loading.close();
+  hideLoading()
   // 二进制数据则直接返回
   if (response.request.responseType ===  'blob' || response.request.responseType ===  'arraybuffer') {
     return response.data
@@ -62,7 +71,8 @@ let success = response => {
 }
 
 let error = error => {
-  if (loading) Toast.clear();
+  hideLoading()
+  //loading.close();
   console.log('err' + error)
   Toast.fail('请求异常，请稍后重试');
   return Promise.reject(error)

src/views/menu/problemItem/api.js

@@ -7,11 +7,20 @@ export function dataList(data) {
     params: data,
   });
 }
-//获取计划列表
-export function planList(orgId){
+
+//获取详情
+export function taskDetails(orgId){
   return request({
-    url: "/core/plan/planList/"+orgId,
+    url: "/core/question/info/"+orgId,
     method: "get",
   });
 }
 
+// 整改
+export function reform(data) {
+  return request({
+    url: "/core/question/reform/" + data.id,
+    method: "put",
+    data,
+  });
+}

src/views/menu/problemItem/detail.vue

@@ -1,15 +1,344 @@
 <template>
-<div>
-  这是详情
-</div>
+  <div class="question-edit">
+    <nav-bar></nav-bar>
+    <div class="page-container">
+      <!--   基本信息   -->
+      <div class="card" v-if="taskInfo">
+        <van-panel :title="taskInfo.srcTaskName">
+          <div class="panel-box">
+<!--            <div class="panel-box-item">-->
+<!--              <van-row>-->
+<!--                <van-col span="8">-->
+<!--                  <span class="item-label">隐患所在机构：</span>-->
+<!--                </van-col>-->
+<!--                <van-col span="14">-->
+<!--                  <span class="item-value">{{taskInfo.orgName}}</span>-->
+<!--                </van-col>-->
+<!--              </van-row>-->
+<!--            </div>-->
+            <van-cell title="隐患所在机构" :label="taskInfo.orgName" />
+            <van-cell title="检查项" :label="taskInfo.checkItem" />
+            <van-cell title="检查内容" :label="taskInfo.checkContent" />
+            <van-cell title="隐患描述" :label="taskInfo.questionDesc" />
+            <van-cell title="发现日期" :label="taskInfo.submitTime" />
+            <van-cell title="提出人" :label="taskInfo.submitorName" />
+            <van-cell title="整改期限" :label="formatDate(taskInfo.reformDeadline,'YYYY-MM-DD')" />
+            <van-cell title="隐患图片" :border="false" >
+              <div v-if="v.img" class="nfc-img" v-for="(v,i) in taskInfo.images" :key="v.img" @click="preViewNFC(i)">
+                <img :src="imgUrl(v.img)" alt="" >
+                <span>{{v.checkName}}</span>
+              </div>
+            </van-cell>
+          </div>
+        </van-panel>
+      </div>
+
+
+      <div class="card" v-if="taskInfo.confirm" >
+        <van-panel title="处理">
+          <div class="panel-box">
+            <van-cell title="确认结果" :label="taskInfo.confirm.executeStatus === 0 ? '确认' : '提出异议'"></van-cell>
+            <van-cell title="确认人" :label="taskInfo.confirm.executorName"></van-cell>
+            <van-cell v-show="taskInfo.confirm.executeStatus===1" title="审核结果" :label="taskInfo.confirm.description"></van-cell>
+          </div>
+        </van-panel>
+      </div>
+
+      <div class="card" v-if="taskInfo.confirmDissent" >
+        <van-panel title="审核">
+          <div class="panel-box">
+            <van-cell title="审核结果" :label="taskInfo.confirmDissent.executeStatus === 0 ? '同意' : '不同意'"></van-cell>
+            <van-cell title="审核人" :label="taskInfo.confirmDissent.executorName"></van-cell>
+            <van-cell v-show="taskInfo.confirmDissent.executeStatus===1" title="原因" :label="taskInfo.confirmDissent.description"></van-cell>
+          </div>
+        </van-panel>
+      </div>
+
+      <div class="card" v-if="taskInfo.reform" >
+        <van-panel title="整改">
+          <div class="panel-box">
+            <van-cell title="整改期限" :label="formatDate(taskInfo.reform.executeTime,'YYYY-MM-DD')"></van-cell>
+            <van-cell title="审核结果" :label="taskInfo.reform.executeStatus === 0 ? '已整改' : '未整改'"></van-cell>
+            <van-cell title="审核结果" :label="taskInfo.reform.description"></van-cell>
+            <div class="upload-box" v-if="taskInfo.reform.images?.length > 0">
+              <van-cell>
+                <div class="nfc-img van-hairline--surround" v-for="(v,i) in taskInfo.reform.images" :key="v.url" @click="clickImage(taskInfo.reform.images,i)">
+                  <img :src="imgUrl(v.url)" alt="" >
+                </div>
+              </van-cell>
+            </div>
+          </div>
+        </van-panel>
+      </div>
+
+
+
+      <div class="card" v-if="type === 'confirm'">
+        <van-panel title="处理">
+          <div class="panel-box">
+            <van-radio-group  v-model="confirmData.status" required>
+              <van-cell-group>
+                <van-cell title="确认情况" clickable>
+                  <template #right-icon>
+                    <van-radio :name="1" />
+                  </template>
+                </van-cell>
+                <van-cell title="提出异议" clickable>
+                  <template #right-icon>
+                    <van-radio :name="0" />
+                  </template>
+                </van-cell>
+              </van-cell-group>
+            </van-radio-group>
+
+            <van-field
+              v-show="!confirmData.status"
+              v-model="confirmData.description"
+              rows="1"
+              autosize
+              label="异议内容"
+              type="textarea"
+              placeholder="请输入"/>
+            <div class="big-btn-box"  v-if="taskInfo.orgId == orgId && taskInfo.confirmStatus==0">
+              <van-button  type="info" size="large"  @click="onsubmit">提交</van-button>
+            </div>
+          </div>
+        </van-panel>
+      </div>
+
+      <div class="card" v-if="type === 'confirmDissent'">
+        <van-panel title="审批">
+          <div class="panel-box">
+            <van-radio-group v-model="confirmDissentData.status" required>
+              <van-cell-group>
+                <van-cell title="同意" clickable>
+                  <template #right-icon>
+                    <van-radio :name="1" />
+                  </template>
+                </van-cell>
+                <van-cell title="不同意" clickable>
+                  <template #right-icon>
+                    <van-radio :name="0" />
+                  </template>
+                </van-cell>
+              </van-cell-group>
+            </van-radio-group>
+
+            <van-field
+              v-show="!confirmDissentData.status"
+              v-model="confirmDissentData.description"
+              rows="1"
+              autosize
+              label="原因"
+              type="textarea"
+              placeholder="请输入"/>
+            <div class="big-btn-box" v-if="taskInfo.submitorId == id && taskInfo.confirmStatus==1">
+              <van-button  type="info" size="large"  @click="onsubmit">提交</van-button>
+            </div>
+          </div>
+        </van-panel>
+      </div>
+
+      <div class="card" v-if="type === 'reform'">
+        <van-panel title="整改">
+          <div class="panel-box">
+            <select-cell required  title="整改期限" v-model="reformData.reformDate"  :data-list="getDictItem('rectification_deadline')" />
+            <van-field
+              required
+              v-model="reformData.description"
+              rows="1"
+              autosize
+              label="整改描述："
+              type="textarea"
+              placeholder="请输入"/>
+            <div class="upload-box" >
+              <uploader :maxCount="5" v-model="reformData.images"/>
+            </div>
+            <div class="big-btn-box" v-if="taskInfo.orgId==orgId && taskInfo.confirmStatus==2 && taskInfo.reformStatus==10">
+              <van-button  type="info" size="large"  @click="reformSubmit">提交</van-button>
+            </div>
+          </div>
+        </van-panel>
+      </div>
+
+      </div>
+  </div>
 </template>
 
 <script>
+import NavBar from '@/components/NavBar';
+import SelectCell from '@/components/selectCell';
+import DateCell from '@/components/dateCell';
+import Uploader from '@/components/upload/uploader';
+import {taskDetails,reform} from "./api";
+import {formatDate} from "@/filters/filter";
+import { ImagePreview } from 'vant';
+import {mapGetters} from "vuex";
+import {imgUrl} from "@/utils";
 export default {
-  name: "detail"
+  components:{NavBar,SelectCell,DateCell,Uploader},
+  data(){
+    return {
+      //基本信息
+      taskInfo:[],
+      formData:{},
+      //确认
+      confirmData: {
+        status: 0,
+        description: null,
+      },
+      //审核
+      confirmDissentData: {
+        status: 0,
+        description: null,
+      },
+      //整改
+      reformData: {
+        reformDate: null,
+        description: null,
+        images: null,
+      },
+      type:null,
+      preViewImages:{},
+      dicts:['resumption_status','rectification_deadline'],
+    }
+  },
+  mounted() {
+    this.getData();
+  },
+  computed:{
+    ...mapGetters(['orgId','id','dictionary'])
+  },
+  methods:{
+    formatDate,
+    clickImage(arr,i){
+      this.preViewImages.images = arr.map(v=>imgUrl(v.imgPath));
+      this.preViewImages.startPosition = i;
+      ImagePreview(this.preViewImages);
+    },
+    onsubmit(){
+
+    },
+    reformSubmit(){
+      if(!this.reformData.reformDate || !this.reformData.description) return this.$toast("请填写完整信息");
+      let data = { ...this.reformData, id: this.taskInfo.id };
+      reform(data).then((r) => {
+        if (r.data) {
+          this.$toast("整改成功");
+          this.$emit("success");
+          this.$router.go(-1);
+        }
+      });
+    },
+    //初始化数据
+    getData() {
+      let id = this.$route.query.id;
+      this.type = this.$route.query.type;
+      taskDetails(id).then(res=>{
+        this.taskInfo = res.data;
+        this.taskInfo.confirm = res.data.flows.find((d) => d.executeStep === 1);
+        this.taskInfo.confirmDissent = res.data.flows.find((d) => d.executeStep === 2);
+        this.taskInfo.reform = res.data.flows.find((d) => d.executeStep === 11);
+        if(this.taskInfo.reform && this.taskInfo.reform.images)     {
+          this.taskInfo.reform.images=this.taskInfo.reform.images.split(",")
+        }
+      })
+    },
+
+    //返回
+    goBack(){
+      this.$router.go(-1);
+      this.clearData();
+    },
+
+    //清空数据
+    clearData(){
+      this.areaList = [];
+      this.taskInfo= [];
+      this.selectArea = [];
+      this.NFCList = [];
+      this.checkList = [];
+      this.checkItemList = [];
+      this.NFCNum = 0;
+      this.enable = false;
+    },
+  }
 }
 </script>
+<style lang="scss" scoped>
 
-<style scoped>
-
+.question-edit{
+  height: 100%;
+  overflow: hidden;
+}
+.page-container{
+  height: calc(100vh - 100px);
+  overflow: auto;
+  padding: 20px;
+}
+.flex-box{
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  >span{
+    margin: 0 20px;
+  }
+}
+.card{
+  margin-bottom: 20px;
+  box-shadow: 0 10px 10px #eaeaea;
+}
+.panel-box{
+  padding:0 20px;
+}
+.panel-box-item{
+  height: 36px;
+  line-height: 36px;
+}
+.item-label{
+  width: 100%;
+  display: flex;
+  justify-content: right;
+  align-items: center;
+}
+.item-value{
+  width: 100%;
+  display: flex;
+  justify-content: left;
+  align-items: center;
+}
+.upload-box{
+  margin: 30px;
+}
+.nfc-img{
+  display: inline-block;
+  width: 140px;
+  height: 140px;
+  margin: 0 10px;
+  position: relative;
+  >img{
+    width: 100%;
+    height: 100%;
+    border: none;
+  }
+  >span{
+    position: absolute;
+    padding: 0 10px;
+    bottom: 0;
+    left: 0;
+    display: block;
+    width: 100%;
+    background-color: rgba(0,0,0,.2 );
+    color: #eaeaea;
+    font-size: 20px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    line-height: 30px;
+    height: 30px;
+  }
+}
+.big-btn-box{
+  padding-bottom: 20px;
+}
 </style>

src/views/menu/problemItem/index.vue

@@ -6,23 +6,55 @@
       <org-tree v-model="query.orgId"  @change="getDataList"></org-tree>
       <div class="search-flex">
         <select-cell class="van-hairline--right" title="确认状态" v-model="query.confirmStatus" :data-list="getDictItem('question_confirm_status')" @change="getDataList"/>
-        <date-cell title="发现日期"  v-model="query.submitTime" date-type="year-month" @change="getDataList"/>
+        <date-cell title="发现日期"  v-model="query.submitTime" date-type="date" @change="getDataList"/>
       </div>
       <div class="card-list">
         <van-empty description="暂无数据" v-if="!dataList || dataList.length === 0" />
           <template v-else>
             <van-cell-group  v-for="(v,i) in dataList">
-              <van-cell :title="v.orgName" >
+              <van-cell :title="v.orgName">
                 <template #extra>
-                  <div class="card-num" v-if="v.finishRate ===''">
-                    {{v.finishRate}}
-                  </div>
-                  <van-button v-else hairline size="mini" type="info" @click="clickItem">信息状态</van-button>
+                  <van-button
+                    style="width: 60px;"
+                    v-if="v.orgId==orgId && v.confirmStatus==0"
+                    hairline
+                    size="mini"
+                    type="info"
+                    @click.stop="clickItem(v.id,'confirm')">
+                    隐患确认
+                  </van-button>
+                  <van-button
+                    style="width: 60px;"
+                    v-if="v.submitorId== id && v.confirmStatus==1"
+                    hairline
+                    size="mini"
+                    type="info"
+                    @click.stop="clickItem(v.id,'confirmDissent')">
+                    异议审批
+                  </van-button>
+                  <van-button
+                    style="width: 60px;"
+                    v-if="v.orgId==orgId && v.confirmStatus==2 && v.reformStatus==10"
+                    hairline
+                    size="mini"
+                    type="info"
+                    @click.stop="clickItem(v.id,'reform')">
+                    整改
+                  </van-button>
+                  <van-button
+                    style="width: 60px;"
+                    v-if="v.confirmStatus ===3"
+                    hairline
+                    size="mini"
+                    type="info"
+                    @click.stop="clickItem(v.id,'detail')">
+                    详情
+                  </van-button>
                 </template>
                 <template #label>
                   <div class="info-box">
-                    <div class="info-item">隐患描述：{{v.shouldFinish}}</div>
-                    <div class="info-item">发现日期：{{v.finish}}</div>
+                    <div class="info-desc">隐患描述：<span>{{v.questionDesc}}</span></div>
+                    <div class="info-item">发现日期：<span>{{v.submitTime}}</span></div>
                   </div>
                 </template>
               </van-cell>
@@ -50,7 +82,6 @@ export default {
   data() {
     return {
       query:{
-        searchKey: null,
         submitTime:null,
         orgId:null,
         confirmStatus:'0',
@@ -83,14 +114,13 @@ export default {
     this.initData();
   },
   computed:{
-    ...mapGetters(['orgId','dictionary']),
-
+    ...mapGetters(['orgId','id','dictionary']),
   },
   methods: {
     //初始化数据
     initData(){
       this.query.orgId = this.orgId;
-      this.query.submitTime = formatDate(new Date(),'YYYY-MM');
+      this.query.submitTime = formatDate(new Date(),'YYYY-MM-DD');
       this.getDataList();
     },
     //获取数据列表
@@ -98,14 +128,18 @@ export default {
       let data = {
         ...this.query
       }
-      data.submitTime = this.query.submitTime && `${this.query.submitTime}-01`;
       if(!this.query.orgId) return this.$toast('请选择机构');
       dataList(data).then(res=>{
-        this.dataList = res.data;
+        this.dataList = res.rows;
       })
     },
-    clickItem(){
-      this.$router.push('/problemDetail');
+    clickItem(id,type){
+      this.$router.push({
+        path:'/problemDetail',
+        query:{
+          id,type
+        }
+      });
     }
   }
 }
@@ -150,8 +184,28 @@ export default {
     width: 50%;
   }
 }
+.info-box{
+  color:#555;
+}
+.info-desc{
+  padding-top: 10px;
+  min-height: 50px;
+  line-height: 36px;
+  max-height: 250px;
+  display: -webkit-box;
+  -webkit-line-clamp: 3; /* 限制显示为3行 */
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  >span{
+    color:#999;
+  }
+}
 .info-item{
   height: 50px;
   line-height: 50px;
+  >span{
+    color:#999;
+  }
 }
 </style>