<template>
  <div>
    <div v-if="!onlyread" class="container normal-panel normal-margin">
      <add v-if="tool.checkAuth($route.name,'insert')" class="inline-16" :data="mainInfo" @onSuccess="onSuccess"></add>
      <importFile class="inline-16" accept=".xlsx" :folderid="folderid" :bindData="{ownertable:'sa_salestargetbill',ownerid:'',usetype:'default'}" @onImportSuccess="onImportSuccess">
        <a class="error-link" v-if="errorurl" :href="errorurl" slot="errorFile">下载错误数据</a>
      </importFile>
    </div>
    <div class="container normal-panel normal-margin">
      <el-descriptions title="基本信息" :column="4">
        <el-descriptions-item label="年度">{{mainInfo.year}}</el-descriptions-item>
        <el-descriptions-item label="编制方式">{{mainInfo.targettype}}</el-descriptions-item>
        <el-descriptions-item label="人员数">{{mainInfo.peoplecount}}</el-descriptions-item>
        <el-descriptions-item label="状态">
          <span :style="{color:mainInfo.status === '已下达'?'#52C41A':''}">{{mainInfo.status}}</span>
        </el-descriptions-item>
      </el-descriptions>
    </div>
    <div class="container normal-panel normal-margin">
      <el-descriptions title="系统信息">
        <el-descriptions-item label="创建人">{{mainInfo.createby}}</el-descriptions-item>
        <el-descriptions-item label="最近调整人">{{mainInfo.changeby}}</el-descriptions-item>
        <el-descriptions-item label="下达人">{{mainInfo.checkby}}</el-descriptions-item>
        <el-descriptions-item label="创建时间">{{mainInfo.createdate}}</el-descriptions-item>
        <el-descriptions-item label="最近调整时间">{{mainInfo.changedate}}</el-descriptions-item>
        <el-descriptions-item label="下达时间">{{mainInfo.checkdate}}</el-descriptions-item>
      </el-descriptions>
    </div>
    <div class="container normal-panel normal-margin">
      <el-descriptions title="项目统计">
        <el-descriptions-item label="项目总数">{{mainInfo.projectnum}}</el-descriptions-item>
        <el-descriptions-item label="项目基本目标(万元)">{{mainInfo.target_l}}</el-descriptions-item>
        <el-descriptions-item label="项目挑战目标(万元)">{{mainInfo.target_h}}</el-descriptions-item>
        <!-- <el-descriptions-item label="预计签约金额(万元)">{{mainInfo.createdate}}</el-descriptions-item> -->
      </el-descriptions>
    </div>
    <targetTable ref="table" class="container normal-panel">
      <!-- <template v-if="!onlyread" v-slot:editTarget="scope">
        <editTarget style="display:inline" :year="mainInfo.year" :data="scope.data" @onSuccess="onSuccess"></editTarget>
      </template> -->
      <template v-if="!onlyread" v-slot:del="scope">
        <ondel v-if="tool.checkAuth($route.name,'delete')" :data="scope.data" @onSuccess="onSuccess"></ondel>
      </template>
    </targetTable>
  </div>
</template>

<script>
import add from './components/add.vue'
import ondel from './components/del.vue'
import editTarget from './components/editTarget.vue'
import importFile from './components/importFile.vue'

import targetTable from './components/table.vue'
export default {
  components:{
    targetTable,
    add,
    ondel,
    editTarget,
    importFile
  },
  data () {
    return {
      mainInfo:{},
      errorurl:null,
      folderid:JSON.parse(sessionStorage.getItem('folderid')).appfolderid,
    }
  },
  methods:{
    async mainData() {
      const res = await this.$api.requested({
        "id": 20220909155202,
        "content": {
          "sa_salestargetbillid": this.$route.query.id
        }
      })
      this.mainInfo = res.data
      this.$refs['table'].queryData(this.mainInfo.year)
    },
    onSuccess () {
      this.$refs['table'].queryData(this.mainInfo.year)
    },
    async onImportSuccess (res) {
      let attachmentid = res.data.attachmentids[0]
      const res1 = await this.$api.requested({
        "id": 20220914163602,
        "content": {
          "attachmentid":attachmentid,
          "sa_salestargetbillid":this.$route.query.id,
          "year":this.mainInfo.year
        },
      })
      if (res1.msg !== '成功') { 
        this.errorurl = res1.msg
      } else {
        this.errorurl = null
      }
      this.tool.showMessage(res1,()=>{
        this.mainData()
      })
    }
  },
  mounted () {
    this.mainData()
  },
  created () {
    this.onlyread = this.$route.query.type === 'onlyread'?true:false
    // this.tool.checkAuth(this.$route.name,'update')?'':this.$router.go(-1)
  }
}

</script>
<style>
</style>