mosr-web/src/views/project-management/implementation/detail.vue

<template>
  <steps :active="route.query.id==='-1'?currentStep-1:currentStep" @setDetail="setDetail" @stepChange="stepChange" @getBasicData="getBasicData"
         :reportType="route.query.id==='-1'?'direct':''" :taskId="detailData.taskId" :editShow="editShow" :mode="mode">
    <template #content v-if="detailShow">
      <collection-detail :formData="detailData.formData"
                         :data="detailData"
                         :processViewer="commonProvessViewer"
                         v-if="showActive == '00'"
                         :fileListShow="fileListShow"
                         v-model:value="auditOpinion"
      />
      <summary-detail v-if="showActive == '10'"
                      :formData="detailData.formData"
                      :data="detailData"
                      :processViewer="commonProvessViewer"
                      :fileListShow="fileListShow" @ccSend="ccSendRefresh"
                      v-model:value="auditOpinion"/>
      <ApprovalDetail type="approval" @ccSend="ccSendRefresh"
                      v-if="showActive == '20'&&!editShow"
                      :formData="detailData.formData"
                      :data="detailData"
                      :processViewer="commonProvessViewer"
                      :fileListShow="fileListShow"
                      :preProcessShow="preProcessShow"
                      :basicData="basicData"
                      v-model:value="auditOpinion"/>
      <div v-if="showActive == '30'&&!editShow">
        <project-attachment/>
      </div>
      <ApprovalDetail type="execute" @ccSend="ccSendRefresh"
                      v-if="showActive == '40'&&!editShow"
                      :formData="detailData.formData"
                      :data="detailData"
                      :processViewer="commonProvessViewer"
                      :fileListShow="fileListShow"
                      :preProcessShow="preProcessShow"
                      :basicData="basicData"
                      v-model:value="auditOpinion"/>
      <ApprovalDetail type="archivist" @ccSend="ccSendRefresh"
                      v-if="showActive == '50'&&!editShow"
                      :formData="detailData.formData"
                      :data="detailData"
                      :processViewer="commonProvessViewer"
                      :fileListShow="fileListShow"
                      :preProcessShow="preProcessShow"
                      :basicData="basicData"
                      v-model:value="auditOpinion"/>
      <project-apply :title="applyTitle"
                     v-if="editShow"
                     :mode="mode"
                     :step="showActive"
                     :data="detailData"
                     :basicData="basicData"
                     :preProcessShow="preProcessShow"
                     :formData="detailData.formData"/>
    </template>
  </steps>
  <div style="width: 100%;height: 30px"></div>
  <opinion v-if="detailData.taskId" :formData="detailData.formData" :taskId="detailData.taskId"
           :taskUserOptionList="detailData.taskUserOptionList"
           v-model:value="auditOpinion"/>
</template>

<script setup lang="jsx">
import {useProcessStore} from '@/stores/processStore.js';
import CollectionDetail from "@/components/DetailComponent/CollectionDetail.vue";
import SummaryDetail from "@/components/DetailComponent/SummaryDetail.vue";
import ApprovalDetail from "@/components/DetailComponent/ApprovalDetail.vue";
import {getMapProjectStateInfo} from '@/components/steps/api';
import {ElLoading, ElNotification} from "element-plus";
import Opinion from "@/components/DetailComponent/Opinion.vue";

const route = useRoute()
const editShow = ref(false)
const applyTitle = ref('filing')
const basicData = ref([])
const loading = ref(false)
const processStore = useProcessStore()
const fileListShow = ref('READ')
const preProcessShow = ref('READ')
const mode = ref('')
const currentStep = ref()
const auditOpinion = ref('')
// const step = ref(route.query.step)
route.query.step == '10' && (currentStep.value = 1)
route.query.step == '20' && (currentStep.value = 2)
route.query.step == '30' && (currentStep.value = 3)
route.query.step == '40' && (currentStep.value = 4)
route.query.step == '50' && (currentStep.value = 5)
const showActive = ref()
const detailShow = ref(false)
const detailData = ref({})
const commonProvessViewer = ref(true)
localStorage.removeItem('singleFile')
localStorage.removeItem('otherFileList')
localStorage.removeItem('preProcess')
localStorage.removeItem('projectChargePersonUserList')
localStorage.removeItem('projectPersonUserList')
localStorage.removeItem('optionalChargeLeadershipList')
localStorage.removeItem('originallySelectedList')

const ccSendRefresh=()=>{
  getAllInfo(route.query.step)
}
const getAllInfo = async (state) => {
  const loading = ElLoading.service({fullscreen: true})
  detailData.value = {
    state: "0"
  }
  try {
    detailShow.value = false
    fileListShow.value = 'READ'
    preProcessShow.value = 'READ'
    commonProvessViewer.value = false
    const {data, code, msg} = await getMapProjectStateInfo(route.query.projectId, state)
    if (code === 1000) {
      data.formData.preProcess = data.formData.preProcess ? JSON.parse(data.formData.preProcess) : undefined
      detailData.value = data
      localStorage.setItem('detailProcess', JSON.stringify(data.formData.preProcess))
      mode.value = data.formData.mode
      processStore.setDesign(data)
      processStore.runningList.value = data.runningList;
      processStore.endList.value = data.endList;
      processStore.noTakeList.value = data.noTakeList;
      processStore.refuseList.value = data.refuseList;
      processStore.passList.value = data.passList;
      nextTick(() => {
        commonProvessViewer.value = true
        detailShow.value = true
        detailData.value = data
        if (data.formPermMap && data.formPermMap["fileList"]) {
          fileListShow.value = data.formPermMap["fileList"].perm
        }
        if (data.formPermMap && data.formPermMap["preProcess"]) {
          preProcessShow.value = data.formPermMap["preProcess"].perm
        }
      })
      changeModel(state, mode.value)
      loading.close()
    } else {
      ElNotification({
        title: '提示',
        message: msg,
        type: 'error'
      })
      if (msg === '查询结果为空') {
        detailData.value = []
        detailData.value.formData = {}
      }
      loading.close()
    }
  } catch {
    loading.close()
  }
}
const changeModel = (active, mode) => {
  // console.log('active, mode',active, mode)
  editShow.value = false
  nextTick(() => {
    editShow.value = mode === 'submit' || mode === 'resubmit';
    // route.query.step === '20' &&
    if (active === '20') {
      applyTitle.value = 'apply'
    } else if (active === '40') {
      applyTitle.value = 'check'
    } else if (active === '50') {
      applyTitle.value = 'filing'
    }
  })
}
const setDetail = (active) => {
  showActive.value = active
  if (active == '30') {
    changeModel(30, 'view')
    detailShow.value = true
    return;
  }
  getAllInfo(active)
}

const stepChange = (data) => {
  showActive.value = data.active
  if (data.active == '30') {
    changeModel(30, 'view')
    detailShow.value = true
    return;
  }
  getAllInfo(data.active)
}
const getBasicData=(data)=>{
  basicData.value=data
}
</script>

<style scoped lang="scss">

:deep(.el-tabs__nav-scroll) {
  width: 100%;
  display: flex;

  .el-tabs__nav {
    display: flex;
    flex: 1;

    .el-tabs__item {
      flex: 1;
      font-size: 16px;
    }
  }
}
</style>