productivity-platform-web/src/views/assets/folder/child.vue

<template>
  <div class="contrl">
    <div style="width: 95%;">
      <div class="title-div">
        <p>{{ projectStore.projectInfo.projectName }}</p>
      </div>
      <div class="createNew-div">
        <img src="../../../assets/icons/word.png" style="width: 32px; height: 32px; float: left;margin-top: 22px;" />
        <span style="margin-left: 10px;">新的报告</span>
        <img src="../../../assets/icons/plus.png" style="width: 32px; height: 32px;float: right;margin-top: 22px;" />
      </div>
      <div class="createNew-div" @click="getCalculateProgress()">
        <img src="../../../assets/icons/excel.png" style="width: 32px; height: 32px; float: left;margin-top: 22px;" />
        <span style="margin-left: 10px;">新的测算表</span>
        <img src="../../../assets/icons/plus.png" style="width: 32px; height: 32px;float: right;margin-top: 22px;" />
      </div>
    </div>
    <div class="example-list report-div">
      <el-card class="report-item no-border" shadow="never" v-for="item in calculateList" @click="doCalculateBench(item)">
        <div class="report-icon">
          <img src="../../../assets/icons/excel.png" style="width: 52px; height: 52px;" />
        </div>
        <div class="report-text">
          <span class="report-text-type">{{ item.projectTypeName }}</span>
          <span> 一 </span>
          <span class="report-text-name">{{ item.calculateName }}
          </span>
          <div style="margin-top: 5px;">
            <span>
              <el-icon>
                <Avatar />
              </el-icon>
              {{ item.principal }}</span>
            <!-- <span>
              <el-tag style="margin-left: 5px;">
                {{ item.projectTypeName }}
              </el-tag>
            </span> -->
            <span style="float: right; color:darkgrey">
              {{ item.createTime }}
            </span>
          </div>
        </div>
        <div class="report-button" @click.stop="downloadFile(item.docUrl, item.docName)">
          <el-icon>
            <Download />
          </el-icon>
        </div>
      </el-card>
    </div>
  </div>
</template>

<script>
import { mapStores } from 'pinia'
import { assetsProjectInfo } from '@/stores/assetsProjectStore';
import { getUnFinishedCalculateProgress, listAllByProjectId } from '@/api/assetsCalculate';
import fileUtil from '@/utils/file'

export default {
  name: 'assetsChild',
  data() {
    return {
      msg: 0,
      projectInfo: {},
      folderName: null,
      calculateList: []
    }
  },
  computed: {
    ...mapStores(assetsProjectInfo),
  },
  created() {
    this.projectInfo = this.$route.query;
    this.getCalculateList();
  },
  methods: {
    createNewCalculate() {
      this.$router.push({ path: '/home/assets/workbench/calculate/baseInfo', query: { 'projectId': this.projectInfo.projectId } })
    },
    nextFolder() {

    },
    // 获取未完成测算表的进度信息并保存到缓存
    getCalculateProgress() {
      getUnFinishedCalculateProgress(this.projectStore.projectInfo.id).then(res => {
        if (res.data) {
          // 根据不同进度跳转到不同步骤页面
          if (res.data.progress === 'IMPORT' || res.data.progress === 'GENERATE' || res.data.progress === 'FINISHED') {
            this.$router.push('/home/assets/workbench/calculate/importInfo')
          } else if (res.data.progress === 'BASE') {
            this.$router.push('/home/assets/workbench/calculate/eqptBaseInfo')
          }
          this.projectStore.setCalculateProgress(res.data);
        } else {
          // 为空说明没有未完成的测算,从头开始新建
          this.createNewCalculate();
          this.projectStore.removeCalculateProgress();
        }
      })
    },
    // 前往测算表详情
    doCalculateBench(item) {
      this.projectStore.setCalculateProgress(item);
      // 根据不同进度跳转到不同步骤页面
      if (item.progress === 'IMPORT' || item.progress === 'GENERATE' || item.progress === 'FINISHED') {
        this.$router.push('/home/assets/workbench/calculate/importInfo')
      } else if (item.progress === 'BASE') {
        this.$router.push('/home/assets/workbench/calculate/eqptBaseInfo')
      }
    },
    // 获取测算表list
    getCalculateList() {
      listAllByProjectId(this.projectStore.projectInfo.id).then(res => {
        if (res.data) {
          this.calculateList = res.data;
        }
      })
    },
    // 下载文件
    downloadFile(docUrl, docName) {
      if (docUrl && docName) {
        let downloadUrl = '/file/download?fileDiskPath=' + docUrl + '&fileName=' + docName
        fileUtil.download(downloadUrl);
      } else {
        ElMessage({
          showClose: true,
          message: '文档还未生成,请完成生成步骤!',
          type: 'warning'
        })
      }
    }
  },
}

</script>

<style scoped>
.base {
  min-height: calc(100vh - 80px);
  width: 100%;
}

.content {
  margin-left: 160px;
  margin-right: 160px;
  padding: 50px 20px 20px 20px;

}

.contrl {
  width: 70.9%;
  border-right: 1.5px #dae1eb solid;
  padding: 0px 20px 20px 0px;
  float: left;

}

.report-div {
  margin-top: 100px;
  min-height: 600px;
}

:deep(.el-tabs__active-bar) {
  background-color: #ff6154;
}

:deep(.el-tabs__item.is-active) {
  color: #ff6154;
}

:deep(.el-tabs__item:hover) {
  color: #ff6154;
}

.title-div {
  width: 500px;
  float: left;
  overflow-y: hidden;
  height: 80px;
}

.createNew-div {
  height: 80px;
  line-height: 80px;
  border: #dae1eb 1.5px solid;
  border-radius: 0.6em;
  width: 200px;
  float: right;
  padding-left: 10px;
  padding-right: 10px;
  margin-left: 20px;

}

.createNew-div:hover {
  cursor: pointer;
  background-color: #dae1eb;
  border: #dae1eb 1.5px solid;
  transition: 0.5s;
}

:deep(.el-tabs__nav-wrap:after) {
  background-color: white;
}

.null-div {
  width: 100%;
  height: 100%;
  text-align: center;
  margin-top: 20%;
  color: var(--vt-c-text-light-2);
}

.no-border {
  border: none;
}

.no-border:hover {
  cursor: pointer;
}
</style>