<template>
  <a-row>
    <a-col span="24">
      <a-card :body-style="{ 'padding-top': '10px' }">
        <div class="block" style="display: flex; align-items: center;">
          <span>月份：</span>
          <a-month-picker v-model="selectDate" placeholder="选择月" @change="changeDate" :disabled-date="disabledDate" :allow-clear="false"/>
          <span>基础数据：</span>
          <a-select v-model:value="flag" style="width: 150px;" allow-clear>
            <a-select-option value="2">当月1号0点</a-select-option>
            <a-select-option value="1">当月29号0点</a-select-option>
          </a-select>
          <a-button type="primary"  style="margin:0 5px" @click="searchExecl">查询</a-button>
          <a-button type="primary" icon="download" style="margin:0 5px" @click="exportWord">导出原稿</a-button>
          <a-button v-if="readOnlyRole == 'display'" type="primary" icon="upload" style="margin:0 5px" @click="uploadWord">上传修订版</a-button>
          <a-button type="primary" icon="download" style="margin:0 5px" @click="exportWordUpdate">下载修订版</a-button>
        </div>
        <a-upload
          ref="upload"
          :action="'/modular-source/6ace62b8e2bb467d98286d260aebcef2/pdcApi/dc/brief/report/uploadZgMWord'"
          :multiple="false"
          :headers="header"
          :data="params"
          accept=".doc,.docx"
          :show-upload-list="false"
          @change="handleChange">
          <a-button size="small" type="primary" v-show="false" ref="uploadBtn">点击上传</a-button>
        </a-upload>
      </a-card>
      <a-card :body-style="{ 'height': dxdcMainHeight + 'px', 'padding': '0' }">
        <form ref="formMain1" id="formMain1" target="frameMain1" :action="reportSrc" method="post">
          <input type="hidden" name="ids" v-model="ids">
          <input type="hidden" name="type" v-model="type">
        </form>
        <div style="width: 100%;height: 100%;display:flex;flex-direction:row;justify-content:center;align-items:center;">
          <iframe
            ref="frameMain1"
            id="frameMain1"
            name="frameMain1"
            src=""
            frameborder="0"
            width="100%"
            height="100%"
            style="overflow: auto"></iframe>
        </div>
      </a-card>
    </a-col>
  </a-row>
</template>

<script>
import moment from 'moment';
export default {
  data() {
    return {
      moment,
      params: {
        year: '',
        month: '',
      },
      header: {
        persId: localStorage.getItem('persId'),
        accessToken: localStorage.getItem('accessToken'),
        orgId: localStorage.getItem('currentOrgId'),
      },
      selectDate: '',
      month: '',
      ids: '',
      type: 'jxzgyb',
      dxdcMainHeight: window.innerHeight - 150,
      dxdcAsideHeight: window.innerHeight - 100,
      windowHeight: window.innerHeight - 200,
      windowWidth: window.innerWidth - 350,
      reportSrc:
        '/modular-source/6ace62b8e2bb467d98286d260aebcef2/pageofficePath/dc/pageoffice/report/show',
      loading: false,
      rightCol: 24,
      excelName: '水利监督发现问题整改月报',
      flag: undefined,
      now: '',
      readOnlyRole: localStorage.getItem('readOnlyRole'),
    };
  },
  mounted() {
    var date = new Date().setMonth(new Date().getMonth() - 1);
    this.selectDate = moment(new Date(date), 'YYYY-MM');
    this.now = moment(new Date(date), 'YYYY-MM');
    this.month = moment(this.selectDate).format('YYYY-MM');
    this.searchExecl();
  },
  methods: {
    changeDate(date, val) {
      if (val) {
        this.month = val;
      } else {
        this.month = '';
      }
    },
    uploadWord() {
      if (!this.month) {
        this.$message.warning('请选择月');
        return false;
      }
      this.params.year = this.month.split('-')[0];
      this.params.month = this.month.split('-')[1];
      this.$refs.uploadBtn.$el.click();
    },
    exportWord() {
      if (!this.month) {
        this.$message.warning('请选择月');
        return false;
      }
      var a = document.createElement('a');
      a.href = `/modular-source/6ace62b8e2bb467d98286d260aebcef2/pdcApi/dc/brief/report/exportWord/zgMWord?year=${this.month.split('-')[0]}&month=${this.month.split('-')[1]}&flag=${this.flag}`;
      // 设置文件名称
      a.download = '水利监督发现问题整改月报.doc';
      a.click();
    },
    exportWordUpdate() {
      if (!this.month) {
        this.$message.warning('请选择月');
        return false;
      }
      var a = document.createElement('a');
      a.href = `/modular-source/6ace62b8e2bb467d98286d260aebcef2/pdcApi/dc/brief/report/downloadZgMWord?year=${this.month.split('-')[0]}&month=${this.month.split('-')[1]}&flag=${this.flag}`;
      // 设置文件名称
      a.download = '水利监督发现问题整改月报修订版.doc';
      a.click();
    },
    searchExecl() {
      // if(_this.month){
      //     _this.ids = this.month.split("-")[0]+","+parseInt(this.month.split("-")[1])
      // }
      this.loading = true;
      // 使用form表单post提交，彻底解决参数值过长的问题
      this.$refs.formMain1.submit();
      // 使用_this
      this.$refs.frameMain1.onload = () => {
        this.loading = false;
      };
    },
    handleChange(info) {
      if (info.file.status == 'done') {
        if (info.file.response.success) {
          this.$message.success('上传成功');
        } else {
          this.$message.error(info.file.response.message);
        }
      } else if (info.file.status === 'error') {
        this.$message.error('上传失败!');
      }
    },
    disabledDate(current) {
      if (moment(current).format('DD') >= 29) {
        return current && current > moment().endOf('day');
      } else {
        return current && current > moment(this.now).endOf('day');
      }
      // return current && current > moment(this.now).endOf('day')
    },
  },
  watch: {
    month(n, o) {
      if (n) {
        this.ids =
          this.month.split('-')[0] + ',' + parseInt(this.month.split('-')[1]);
      } else {
        this.ids = '';
      }
    },
  },
};
</script>

<style lang='less' scoped>

</style>
