<template>
  <basic-container>
    <avue-crud
      v-bind="bindVal"
      v-on="onEvent"
      v-model="form"
    >

      <template slot="body">
        <h3 class="page-title">{{ pageTitle }}</h3>
      </template>

      <template slot="yearTempUrl" slot-scope="{row}">
        <el-link type="primary" @click="handleDownTemp(row)">下载样表 </el-link>
      </template>

      <template slot="torchDevUrl" slot-scope="{row}">
        <el-link
          v-for="(item, index) of row.torchDevUrl"
          :key="index"
          type="primary"
          @click="handleDownFile(item)"
          :style="{marginRight: index === row.torchDevUrl.length - 1 ? 0 : '16px'}"
        >
          {{ item.label }}
        </el-link>
      </template>
      
    </avue-crud>
  </basic-container>
</template>

<script>
import { downloadFileByUrl } from "@/util/util";
import { mapGetters } from "vuex";

export default window.$crudCommon({
  data() {
    return {
    };
  },
  computed: {
    ...mapGetters(['tag']),
    pageTitle() {
      return this.tag.label;
    }
  },
  mounted() {
    this.loadData();
  },
  methods: {
    getSearchParams() {
      return { yearMin: 2025, yearMax: 2035 }
    },
    loadData() {
      this.loading = true;
      this.api.getList(this.getSearchParams()).then(({ data }) => {
        
        if (data.code == 200) {
          let list = [];
          for (let i=2025; i<2036; i++) {
            let dataItem = data.data.find(item => item.yearAndMonth == i);
            list.push({ year: i, id: dataItem ? dataItem.id : undefined, torchDevUrl: dataItem ? JSON.parse(dataItem.torchDevUrl || '[]') : [] });
          }
          this.data = list;
        }


        this.loading = false;
      })
    },
    handleBeforeOpen(done) {
      this.currIndex = this.form.$index + 1;
      done();
    },
    handleDownFile(file) {
      downloadFileByUrl(file.value, file.label);
    },
    handleDownTemp(row) {
      this.$message.warning('功能建设中...');
    },
    getFormData() {
      return { id: this.form.id, yearAndMonth: this.form.year, torchDevUrl: JSON.stringify(this.form.torchDevUrl) }
    },
  },
}, {
  // 模块路径
  name: 'externalReports/torchDevelopAnnualReport',
});
</script>
