mosr-web/src/views/project-management/mobledetail/index.vue

<template>
  <div style="padding: 0 10px;">
    <StepsMoblie :active="route.query.id==='-1'?currentStep-1:currentStep" @setDetail="setDetail"
                 @stepChange="stepChange"
                 :reportType="route.query.id==='-1'?'direct':''">
      <template #content>
        <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"
                        v-model:value="auditOpinion"/>
        <ApprovalDetail type="approval"
                        v-if="showActive == '20'"
                        :formData="detailData.formData"
                        :data="detailData"
                        :processViewer="commonProvessViewer"
                        :fileListShow="fileListShow"
                        v-model:value="auditOpinion"/>
        <ApprovalDetail type="execute"
                        v-if="showActive == '40'"
                        :formData="detailData.formData"
                        :data="detailData"
                        :processViewer="commonProvessViewer"
                        :fileListShow="fileListShow"
                        v-model:value="auditOpinion"/>
        <ApprovalDetail type="archivist"
                        v-if="showActive == '50'"
                        :formData="detailData.formData"
                        :data="detailData"
                        :processViewer="commonProvessViewer"
                        :fileListShow="fileListShow"
                        v-model:value="auditOpinion"/>
        <!--        <project-apply-moblie :title="applyTitle"-->
        <!--                      v-if="editShow"-->
        <!--                      :mode="mode"-->
        <!--                      :step="showActive"-->
        <!--                      :data="detailData"-->
        <!--                      :formData="detailData.formData"/>-->
      </template>
    </StepsMoblie>
    <opinion-moblie v-if="detailData.taskId" :formData="detailData.formData" :taskId="detailData.taskId" :taskUserOptionList="detailData.taskUserOptionList"
                    v-model:value="auditOpinion"/>
  </div>
</template>


<script setup lang="jsx">
import {useProcessStore} from '@/stores/processStore.js';
import {ElLoading, ElNotification} from "element-plus";
import ApprovalDetail from './ApprovalDetailMoblie.vue';
import CollectionDetail from './CollectionDetailMoblie.vue';
import SummaryDetail from './SummaryDetailMoblie.vue';
import StepsMoblie from './StepsMoblie.vue';
import {getMapProjectStateInfo} from "./api";
import OpinionMoblie from '@/views/project-management/mobledetail/OpinionMoblie.vue'
// import ProjectApplyMoblie from "./ProjectApplyMoblie.vue";


const route = useRoute()
const editShow = ref(false)
const applyTitle = ref('apply')
const loading = ref(false)
const processStore = useProcessStore()
const fileListShow = ref('READ')
const mode = ref('')
const currentStep = ref()
const auditOpinion = ref('')
route.query.step == '10' && (currentStep.value = 1)
route.query.step == '20' && (currentStep.value = 2)
route.query.step == '40' && (currentStep.value = 3)
route.query.step == '50' && (currentStep.value = 4)
const showActive = ref()
const detailData = ref({})
const commonProvessViewer = ref(true)

const getAllInfo = async (state) => {
  const loading = ElLoading.service({fullscreen: true})
  detailData.value = {
    state: "0"
  }
  try {
    fileListShow.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
      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
        if (data.formPermMap && data.formPermMap["fileList"]) {
          fileListShow.value = data.formPermMap["fileList"].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) => {
  // editShow.value = false
  nextTick(() => {
    // editShow.value = mode === 'submit' || mode === 'resubmit';
    if (route.query.step === '20' && active === '20') {
      applyTitle.value = 'apply'
    } else if (route.query.step === '40' && active === '40') {
      applyTitle.value = 'check'
    } else if (route.query.step === '50' && active === '50') {
      applyTitle.value = 'filing'
    }
  })
}
const setDetail = (active) => {
  showActive.value = active
  getAllInfo(active)
}

const stepChange = (data) => {
  showActive.value = data.active
  getAllInfo(data.active)
}
</script>

<style scoped lang="scss">
.detail-block {
  padding-top: 15px;
}

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

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

    .el-tabs__item {
      flex: 1;
      font-size: 16px;
    }

    //.is-active {
    //  color: black;
    //  //background-color: #DED0B2;
    //}
  }
}
</style>