<template>
  <basic-container>

    <basic-card title="LOGO设置" v-loading="tenantLoading">
      <avue-form :option="logoOption" v-model="logoForm" style="width: 100%; margin: 0;" @submit="handleSubmitLogo"></avue-form>
    </basic-card>

    <div style="padding-left: 16px;">
      <!-- <el-date-picker
        v-model="yearAndMonth"
        type="year"
        placeholder="选择年"
        value-format="yyyy"
        :clearable="false"
        style="margin-bottom: 6px;"
      >
      </el-date-picker> -->
      <year-month-select v-model="yearAndMonth" :showMonth="false" />
    </div>

    <basic-card title="企业基础信息表">
      <comp-info-table :yearAndMonth="yearAndMonth"></comp-info-table>
    </basic-card>

    <basic-card title="所属二级单位/部门">
      <div style="width: 680px;">
        <comp-dept-list :yearAndMonth="yearAndMonth"></comp-dept-list>
      </div>
      
    </basic-card>

    <basic-card title="高企证书上传" v-loading="compBasicLoading">
      <el-button type="primary" plain size="small" @click="handleLastYearData(2)" style="margin-bottom: 12px;">读取上年度数据</el-button>
      <avue-form :option="picOption" v-model="picForm" style="width: 100%; margin: 0;" @submit="handleHighTecChange"></avue-form>
    </basic-card>

    <basic-card title="出勤时间设置" v-loading="compBasicLoading">
      <el-button type="primary" plain size="small" @click="handleLastYearData(1)" style="margin-bottom: 12px;">读取上年度数据</el-button>
      <avue-form :option="attendOption" v-model="attendForm" @submit="handleSubmitAtten" style="width: 600px; margin: 0;"></avue-form>
    </basic-card>
  </basic-container>
</template>

<script>
import {mapGetters} from "vuex";
import { getDetail as getTenantDetail, update as updateTenant } from '@/api/system/tenant';
import { getAttenDetail, settingAttenInfo, getLastYearAttenInfo } from "@/api/basicResource/compInfoSetting";
import YearMonthSelect from "@/components/year-month-select";
import basicCard from "@/components/basic-card";
import compInfoTable from "./components/comp-info-table.vue";
import compDeptList from "./components/comp-dept-list.vue";
import moment from "moment";

export default {
  components: {
    YearMonthSelect,
    basicCard,
    compDeptList,
    compInfoTable
  },
  data() {
    return {
      yearAndMonth: '',

      logoForm: {},
      logoOption: {
        submitText: '保存',
        emptyBtn: false,
        menuSpan: 4,
        column: [
          {
            label: "企业LOGO",
            prop: "logoUrl",
            type: "upload",
            listType: "picture-img",
            span: 24,
            fileType: "img", //img/video/audio
            accept: "image/png, image/jpeg",
            propsHttp: {
              res: 'data',
              url: 'link',
            },
            canvasOption: {
              text: ' ',
              ratio: 0.1
            },
            action: '/api/kd-resource/oss/endpoint/put-file',
            tip: "注：上传LOGO图片，尺寸推荐：20*20，显示在系统左上角。",
          },
        ],
      },

      picForm: {
        highTechUrl: [],
      },
      picOption: {
        submitText: '保存',
        emptyBtn: false,
        menuSpan: 4,
        column: [
          {
            label: "高企证书",
            prop: "highTechUrl",
            type: "upload",
            listType: "picture-card",
            span: 24,
            fileType: "img", //img/video/audio
            accept: "image/png, image/jpeg",
            limit: 5,
            propsHttp: {
              res: "data",
              url: 'link',
            },
            tip: "请上传当前年度的高企证书",
            action: '/api/kd-resource/oss/endpoint/put-file',
          },
        ],
      },

      attendForm: {},
      attendOption: {
        submitText: '保存',
        emptyBtn: false,
        menuSpan: 4,
        column: [
         {
            label: '作息时间',
            prop: 'workHours',
            type: 'number',
            span: 9,
            min: 0,
            precision: 1,
         }
        ]
      },

      tenantLoading: false,
      compBasicLoading: false,
    }
  },
  computed: {
    ...mapGetters(["userInfo", 'pageYear']),
  },
  watch: {
    yearAndMonth(newVal) {
      this.getAttenDetailFunc(newVal)
    }
  },
  mounted() {
    this.getTenantDetailFunc(this.userInfo.tenant_id);
  },
  activated() {
    if (this.yearAndMonth != this.pageYear) {
      this.yearAndMonth = this.pageYear;
    }
  },
  methods: {
    /**
     * 读取上年度高企证书或出勤信息
     * @param type 1、出勤时长；2、高企证书
     */
    handleLastYearData(type) {
      this.$confirm('请注意！读取上年度数据将覆盖当前所有数据，确认要读取吗?', '提示').then(() => {
        this.loading = true;
        getLastYearAttenInfo({ yearAndMonth: this.yearAndMonth, type }).then(({ data }) => {
          this.loading = false;
          if (data.code == 200) {
            this.$message.success('读取成功!');
            this.getAttenDetailFunc(this.yearAndMonth);
          }
        }).catch(() => {
          this.loading = false;
        });
      });
    },
    getTenantDetailFunc(tenantId) {
      this.tenantLoading = true;
      getTenantDetail(tenantId).then(({ data }) => {
        this.tenantLoading = false;
        if (data.code == 200) {
          this.logoForm = data.data;
        }
      }).catch(() => {
        this.tenantLoading = false;
      });
    },
    handleSubmitLogo(form, done) {
      const params = { ...this.logoForm, tenantId: this.userInfo.tenant_id };
      updateTenant(params).then(({ data }) => {
        done();
        if (data.code == 200) {
          this.$message.success('保存成功!');
        }
      }).catch(() => {
        done();
      })
    },
    getAttenDetailFunc(yearAndMonth) {
      this.compBasicLoading = true;
      getAttenDetail(yearAndMonth).then(({ data }) => {
        this.compBasicLoading = false;
        if (data.code == 200) {
          if (Object.keys(data.data).length) {
            const _data = data.data;
            this.picForm = { id: _data.id, yearAndMonth: _data.yearAndMonth, highTechUrl: _data.highTechUrl ? _data.highTechUrl.split(',') : [] };
            this.attendForm = { id: _data.id, yearAndMonth: _data.yearAndMonth, workHours: _data.workHours };
          } else {
            this.picForm = { id: undefined, highTechUrl: [] };
            this.attendForm = { id: undefined, workHours: undefined };
          }
        }
      }).catch(() => {
        this.compBasicLoading = false;
      })
    },
    handleHighTecChange(form, done) {
      const params = { ...this.picForm, yearAndMonth: this.yearAndMonth, highTechUrl: this.picForm.highTechUrl.join(',') };
      settingAttenInfo(params).then(({ data }) => {
       done();
        if (data.code == 200) {
          this.$message.success('保存成功!');
        }
      }).catch(() => {
        done();
      })
    },
    handleSubmitAtten(form, done) {
      const params = { ...this.attendForm, yearAndMonth: this.yearAndMonth };
      params.workHours = params.workHours ? params.workHours : 0;
      settingAttenInfo(params).then(({ data }) => {
       done();
        if (data.code == 200) {
          this.$message.success('保存成功!');
        }
      }).catch(() => {
        done();
      })
    },
    
  }
}
</script>