<template>
  <div class="app-content layoutEmbedded" style="height: 76vh;overflow: auto;">
    <a-spin :spinning="loading" style="width: 100%;height: 100%;">
      <div class="page-content">
        <a-tabs type="card" hideAdd size="small" @change="callback">
          <a-tab-pane :key="item.key" :tab="item.title" v-for="(item) in tabsData">
          </a-tab-pane>
        </a-tabs>
      </div>
      <div class="page-footer">
        <!-- 申报项目详情 -->
        <a-button type="primary" @click="onExport">导出</a-button>
        <task-info v-model="formData" :tabsData.sync="tabsData" />
      </div>
    </a-spin>
  </div>
</template>
<script>
const projectKPI = {
  reportYear: "",
  projName: "",
  appUnitName: "",
  managerDept: "",
  projAttribute: "",
  projDeadline: "",
  startDate: "",
  endData: "",
  yearTarget: "",
  year1Goal: "",
  year2Goal: "",
  year3Goal: "",
  totalBudget: 0.00,
  applyFunds: 0.00,
  selfFunds: 0.00,
  yearTotal: 0.00,
  yearApply: 0.00,
  yearSelf: 0.00,
  totalRowSpan: 0, //总合并行数
  outTarget: 0, //一级指标(产出指标)
  benefitTarget: 0, //一级指标(效益指标)
  satisfactionDegree: 0, //一级指标(满意度指标)
  quantityTarget: 0, //二级指标(数量指标)
  qualityTarget: 0, //二级指标(质量指标)
  validityTarget: 0, //二级指标(时效指标)
  costTarget: 0, //二级指标(成本指标)
  economicTarget: 0, //二级指标(经济效益指标)
  socialTarget: 0, //二级指标(社会效益指标)
  ecologicalTarget: 0, //二级指标(生态效益指标)
  sustainableTarget: 0, //二级指标(可持续影响指标)
  serviceTarget: 0, //二级指标(服务对象满意度指标)
  threeLevel: [],
  kpiList: [],
};

import axios from 'axios'
import { getToken, removeToken, getType } from '@/views/utils/auth'
import { budgetList } from '@/views/report/project/config'
import taskInfo from "@/views/report/task/components/taskInfo"
export default {
  name: "projectView",
  components: {
    taskInfo
  },
  data () {
    return {
      tabsData: [
        { title: '全部', key: '0', isShow: true },
        { title: '项目基本信息', key: '1', isShow: true },
        { title: '项目人员情况', key: '2', isShow: true },
        { title: '项目主要实施内容和目标', key: '3', isShow: true },
        { title: '申请书正文', key: '4', isShow: true },
        { title: '经费预算及设备明细', key: '5', isShow: true },
        { title: '项目实施阶段及任务', key: '6', isShow: true },
        { title: '项目课题设置', key: '7', isShow: true },
        { title: '绩效目标表', key: '8', isShow: true },
        { title: '附件信息', key: '9', isShow: true },
        { title: '审核记录', key: '10', isShow: true },
      ],
      formData: {
        id: null,
        appPersonName: null,
        sex: null,
        birthday: null,
        nationName: null,
        degreeName: null,
        titleName: null,
        mobile: null,
        email: null,
        jobTime: null,
        address: null,
        appUnitName: null,
        mainResearchAreas: null,
        unitLinkName: null,
        unitLinkMobile: null,
        unitLinkEmail: null,
        unitLinkFax: null,
        projName: null,
        knowledgeId: null,
        subjectScope: null,
        projClass: null,
        remark: null,
        startDate: null,
        endDate: null,
        totalFunding: null,
        govFunding: null,
        projAbstract: null,
        projKeywords: null,
        yearTarget: null,
        year1Goal: null,
        year2Goal: null,
        year3Goal: null,
        projectKPI: projectKPI,
        cooperativeUnits: [],
        members: [],
        budget: [],
        fundPlan: [],
        fileList: [],
        auditList: [],
        managerDept: "",
      },
      loading: false,
      projType: getType()
    };
  },
  props: {
    value: {
      type: String,
      default: () => {
        return null
      }
    },
  },
  created () {
    this.getTaskByProjId()
  },
  methods: {
    getTaskByProjId () {
      if (this.value != null) {
        this.loading = true
        this.$api.task.getTaskByProjId({ id: this.value }).then(({ data = {} }) => {
          if (data) {
            this.formData = data
            this.loading = false
          } else
            this.$emit('close', 'error')
        }).catch(() => { this.$emit('close', 'error') })
      }
    },
    onExport () {
      axios({
        url: "/v1/science-admin/com-project-task/export/" + this.value,
        method: 'GET',
        responseType: "blob",
        headers: {
          Authorization: 'Bearer ' + getToken(),
          'Content-Type': 'application/pdf;charset=utf-8'
        }
      }).then(response => {
        console.log(response)
        const blob = new Blob([response.data], { type: 'application/pdf' });
        const url = window.URL.createObjectURL(blob);
        const link = document.createElement('a');
        link.href = url;
        const filename = response.headers['content-disposition'] ? decodeURIComponent(response.headers['content-disposition'].split('filename=')[1]) : '项目报告.pdf';
        link.setAttribute("download", filename);
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
        window.URL.revokeObjectURL(url);
      }).catch(error => {
        console.error('下载文件出错:', error);
        this.$message.error('下载文件失败');
      });
    },
    callback (key) {
      var index = parseInt(key)
      this.tabsData.forEach(e => {
        if (key == '0')
          e.isShow = true
        else
          e.isShow = false
      })
      this.tabsData[0].isShow = true;
      this.tabsData[index].isShow = true;
    },
  },
}
</script>
<style scoped lang="less">
::v-deep .ant-spin-container {
  width: 100%;
  height: 100%;
}
::-webkit-scrollbar {
  width: 8px;
  height: 6px;
}
.page-content {
  width: 100%;
  height: 50px;
}
.page-footer {
  width: 100%;
  height: calc(100% - 50px);
  overflow: auto;
}
</style>