wt_project_web_bak/src/views/project/index.vue

<template>
  <div>
    <tips-custom>
      <template #title>
        <span class="font-24 bold">{{ detail.name }}</span>
        <el-tag class="ml-20">{{ detail.tagsName }}</el-tag>
        <el-tag class="ml-10">{{ detail.report_type_name }}</el-tag>
      </template>
      <template #default>
        <top
          :project-id="projectId"
          @change="changeStage"
          @filter="filterStage"
        />
      </template>
    </tips-custom>
    <!--    content-->
    {{ currentStage }}
    <div style="margin-bottom: 65px">
      <div v-if="[1, 2].includes(currentStage)">
        <!--        基础信息-->
        <info1 :info="detail" @industry="changeIndustry" />
      </div>
      <!--      前期要件-->
      <info2
        v-if="[2, 3].includes(currentStage)"
        :project-id="projectId"
        :stage-id="stageId"
        :industry="industry"
      />
      <!--      相关合同-->
      <info3 :project-id="projectId" :stage-id="stageId" />
      <!--      投资基本情况-->
      <info4 v-if="[4].includes(currentStage)" :project-id="projectId" />
      <!--      建成投产后效益测算-->
      <info5 v-if="currentStage === 2" :info="detail" />
      <!--      年度投资情况-->
      <info6 v-if="currentStage === 4" :project-id="projectId" />
      <!--      其他信息-->
      <info7 v-if="[2, 4, 5].includes(currentStage)" :info="detail" />
      <!--      任务列表-->
      <info8 v-if="user.info.type === 4" :project-id="projectId" />
    </div>
    <!--    buttom-->
    <div class="bottom flex flex-center flex-justify-end">
      <div class="padding">
        <el-button type="primary" plain @click="projectCancel">退 库</el-button>
        <el-button
          type="primary"
          v-if="detail.is_report === 0"
          @click="projectReport"
          plain
          >上报审核</el-button
        >
        <el-button type="primary" plain v-if="detail.report_type === 3"
          >上报到固定资产</el-button
        >
        <el-button type="primary" @click="nextStage">下一阶段</el-button>
      </div>
    </div>
  </div>
</template>

<route>
{
path: '/project',
name: '项目详情',
meta: { layout: 'empty','show': false}
}
</route>

<script>
import tipsCustom from '@/components/tips-custom/index.vue'
import top from '@/views/project/componens/top.vue'
import confing from '@/config/website.js'
import Info1 from '@/views/project/componens/info1.vue'
import Info2 from '@/views/project/componens/info2.vue'
import info3 from '@/views/project/componens/info3.vue'
import Info4 from '@/views/project/componens/info4.vue'
import Info5 from '@/views/project/componens/info5.vue'
import Info6 from '@/views/project/componens/info6.vue'
import Info7 from '@/views/project/componens/info7.vue'
import Info8 from '@/views/project/componens/info8.vue'
import { useStore } from '@/store/user.js'

export default {
  components: {
    Info2,
    Info1,
    Info4,
    Info5,
    Info6,
    Info7,
    tipsCustom,
    top,
    info3,
    Info8
  },
  setup() {
    const user = useStore()
    return { user }
  },
  data() {
    return {
      projectId: '',
      stageId: '',
      currentStage: 1,
      industry: null,
      detail: {}
    }
  },
  mounted() {
    this.projectId = this.$route.query.id
    this.getInfo()
  },
  methods: {
    getInfo() {
      this.$api.project.projectMapInfo(this.projectId).then(res => {
        if (res.code === 200) {
          this.detail = res.data
          delete this.detail._id
          this.stageId = res.data.stageId
          this.currentStage = res.data.current_stage
          this.detail.tagsName =
            this.detail.tags === 1 ? '政府投资项目' : '企业投资项目'
          const status = confing.reportTypes.find(
            ele => ele.value === this.detail.report_type
          )
          this.industry = this.detail.dict_key[0]
          if (status) {
            this.detail.report_type_name = status.label
          }
        }
      })
    },
    changeStage(res) {
      this.stageId = res
    },
    changeIndustry(industry) {
      this.industry = industry
    },
    filterStage(res) {
      this.currentStage = res
    },
    nextStage() {
      this.$confirm(
        '请检查当前阶段信息是否完善，点击确定后项目将进行下一个阶段',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }
      ).then(res => {
        if (res === 'confirm') {
          this.currentStage = this.currentStage + 1
          this.detail.current_stage = this.currentStage
          this.update()
        }
      })
    },
    update() {
      this.$api.project.proUpdate(this.detail).then(res => {
        if (res.code === 200) {
          this.$message.success(res.msg)
        } else {
          this.$message.error(res.msg)
        }
      })
    },
    /**
     * 股室上报项目到管理员
     */
    projectReport() {
      this.$confirm('确认上报至管理员进行审核？').then(ele => {
        if (ele === 'confirm') {
          this.$api.project.upReportType({ id: this.projectId }).then(res => {
            if (res.code === 200) {
              this.$message.success(res.msg)
            } else {
              this.$message.error(res.msg)
            }
          })
        }
      })
    },
    /**
     * 管理员已经审核通过的项目，上报到固定资产
     */
    projectReportFormal() {
      this.$confirm('确定上报到固定资产？').then(res => {
        if (res === 'confirm') {
          this.$api.project
            .reportToAssets({ ids: this.projectId })
            .then(res => {
              if (res.code === 200) {
                this.$message.success(res.msg)
              } else {
                this.$message.error(res.msg)
              }
            })
        }
      })
    },
    /**
     * 项目退库
     */
    projectCancel() {
      console.log('rrrr')
      this.$prompt('请输入退库原因', '提示', {}).then(({ value }) => {
        if (value === null || value.length === 0) {
          this.$message.error('请输入退库原因')
          return
        }
        this.$api.project
          .projectCancel({ id: this.projectId, exitMsg: value })
          .then(res => {
            if (res.code === 200) {
              this.$message.success(res.msg)
              this.refreshChange()
            } else {
              this.$message.error(res.msg)
            }
          })
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.bottom {
  position: fixed;
  bottom: 0;
  z-index: 3;
  height: 68px;
  width: 1300px;
  background-color: white;
  box-shadow: 0px -5px 10px rgba(52, 52, 52, 0.1);
}
</style>