<template>
  <div class="full-box zhglcss" style="overflow: hidden">
    <div class="" style="width: 100%;height:100%;">
      <div class="top-tip-box t-title">当前位置：后台系统管理 > 数据采集统计</div>
      <div class="table-info-box">
        <div class="table-search-box onerow">
          <div class="search-info-box" style="">
            <div class="search-item">
              <div class="search-item-label">时间 </div>
              <el-date-picker
                v-model="filter.year"
                align="right"
                type="year"
                value-format="yyyy"
                placeholder="选择年">
              </el-date-picker>
            </div>
            <el-button class="search-btn" type="primary" @click="searchResult">查询</el-button>
          </div>
          <div class="search-border-box">
            <div class="sbb-line"></div>
            <div class="sbb-role"></div>
          </div>
        </div>
        <div class="table-result-boxx" >
          <div class="table-container-style">
            <el-table :data="tableData.list" height="200">
              <el-table-column type="index" align="center" label="编号" width="80"></el-table-column>
              <el-table-column prop="name" align="center" label="任务类型"></el-table-column>
              <el-table-column prop="status" align="center" label="采集状态" ></el-table-column>
              <el-table-column prop="dataTime" align="center" label="最新采集时间"></el-table-column>
              <el-table-column align="center" label="操作">
                <template slot-scope="scope">
                  <div class="table-edit-btn" @click="detailTable(scope.row)">详情</div>
                </template>
              </el-table-column>
            </el-table>
            <el-pagination v-if="false" @current-change="handlePageChange" background layout="total, prev, pager, next" :total="tableData.total" :current-page="tableData.pageNum" :page-size="tableData.pageSize" :page-count="tableData.pages" style="text-align: right;"></el-pagination>
          </div>
        </div>

        <!-- pop start 企业信息 - 企业的基本信息以及四个经济指标（工业总产值、主营业务收入、利税总额、利润总额  -->
            <el-dialog :title="detailTableName" :visible.sync="detailTableShow" width="682px" :close-on-click-modal=false >
              <div class="btn-uls-box">
                <div class="btn-uls">
                  <div class="btn-li" v-for="(item,e) in detailTableData.list" :key="e">
                    <div class="bl-btn " :class="$Util.isEmpty(item.fileId) ? 'failBtn' :'successBtn'">{{item.dataMonth}}月</div>
                    <div class="bl-down" v-if="!$Util.isEmpty(item.fileId)" @click="downloadFile(item)">下载</div>
                    <div class="bl-down disabled" v-else>下载</div>
                  </div>
                </div>
              </div>
              <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="detailTableShow = false">关闭</el-button>
              </div>
        </el-dialog>
        <!-- pop end-->
      </div>
    </div>
  </div>
</template>

<script>
  let month = new Date().getMonth()==0?1:new Date().getMonth()+1;
  let year = month<10?new Date().getFullYear()+"-0"+month :new Date().getFullYear()+"-"+month;
  export default {
    name: 'yjManage',
    data () {
      return {
        timeFilter:'',
        filter:{year:new Date().format("yyyy")},
        monthCurrent:12,
        yearCurrent:new Date().format("yyyy"),
        dialogVisible:false,
        taskTypeList:[],
        formLabelWidth: 120,
        disabled:false,
        tableData:{
          list: [ ],
          pageNum: 1,
          pageSize: 10,
          pages: 0,
          total: 0,
        },
        timer:null,

        mounthList:0,
        detailTableShow:false,
        detailTableName:'',
        detailTableData: {list:[],pageNum: 1,pageSize: 10,pages: 0,total: 0},
        detailTableRowData:{},detailtitle:''
      }
    },
    created(){
      let vm = this;
      console.log(vm.monthCurrent);
      this.getDataList();
    },
    mounted(){
    },
    beforeDestroy() {
      if(this.timer) { //如果定时器还在运行 或者直接关闭，不用判断
        clearInterval(this.timer); //关闭
      }
    },
    watch:{
      /*"addForm.type":function () {
        if(this.addForm.type != "") {
          this.disabled = false;
        }else{
          this.disabled = true;
        }
      },*/
    },
    methods:{
      /*列表*/
      searchResult(){
        this.getDataList();
      },
      getDataList: function (pager) {
        let _this = this;
        if(_this.filter.year < _this.yearCurrent){
          _this.monthCurrent = 12;
        }
        _this.tableData.pageNum = _this.$Util.isEmpty(pager) ? _this.tableData.pageNum : pager;
        let year= _this.filter.year
        _this.$http.get('/dx-economy-api/dataUpdateRecord', {params: $.extend({pageNum: _this.tableData.pageNum,pageSize: _this.tableData.pageSize},_this.filter)}).then(function (resp) {
          var _data = resp.data;
          if (_data.code === 200 && !_this.$Util.isEmpty(_data.data)) {
            _this.tableData.list = _data.data;
            /*_this.tableData.pageNum = _data.data.pageNum;
            _this.tableData.pageSize = _data.data.pageSize;
            _this.tableData.pages = _data.data.pages;
            _this.tableData.total = _data.data.total;*/
          } else {
            _this.$message.error(_data.message);
          }
        });
      },
      handlePageChange: function (page) {
        this.getDataList(page);
      },

      downloadFile(data){
        let vm = this
        vm.$http.get('/dx-economy-api/file/'+data.fileId).then(() => {
          /*vm.$notify({
            title: '提示',
            message: '导出当前数据成功！',
            type: 'success'
          });*/
        });
      },
      downloadFile1(){
        let _this = this,_path="" ,_name = "";
        _this.$http.get('/zhyw/excel/type').then(function (resp) {
          let _data = resp.data;
          _data.data.forEach(function (item) {
            if(item.id === _this.addForm.type){
              _path = item.path;
              _name = item.name;
            }
          });
          if (_data.code == 200) {
            // 下载文件
            _this.$http.get('/zhyw/file',{
              params:{
                fileName: _name,
                filePath: _path
              }
            }).then(() => {
            });
          } else {
            _this.$message.error(_data.message);
          }
        });

      },
      deleteModule: function (rowData) {
        var _this = this;
        _this.$confirm('确认删除？','提示', {type: 'warning'}).then(() => {
          if(!_this.$Util.isEmpty(rowData) && !_this.$Util.isEmpty(rowData.id)){
            _this.$http.delete('/dx-economy-api/importRecord/'+rowData.id).then(function (resp) {
              var _data = resp.data;
              if (_data.code === 200) {
                _this.$message.success("删除成功");
                _this.getDataList();
              } else {
                _this.$message.error(_data.message);
              }
            });
          }
        }).catch(() => {});
      },
      /*优化内容 -数据moredetail*/
      detailTable(rowData){
        let vm = this
        vm.detailTableShow = true;
        vm.detailTableName = rowData.name+'  - 导入统计';
        vm.detailTableRowData = rowData;
        /*vm.tableHead = JSON.parse(rowData.title);
        vm.detailTableData = JSON.parse(rowData.content);*/
        this.getDetailList();
      },
      detailhandlePageChange(pager){
        this.getDetailList(pager);
      },
      getDetailList(pager){
        let vm = this;
        vm.detailTableData.list=[];
        vm.detailTableData.pageNum = vm.$Util.isEmpty(pager) ? vm.detailTableData.pageNum : pager;
        let params = {
          code : vm.detailTableRowData.code,
          year: vm.filter.year
        }
        let newData=[];
        vm.$http.get('/dx-economy-api/dataUpdateRecord/detail', {params:params}).then(function (resp) {
          let _data = resp.data.data;
          let resultDataObj = {};
          for (let j = 0;j < _data.length;j++) {
            let item = _data[j];
            resultDataObj[item.dataMonth] = j;
          }
          for(let i = 0;i < vm.monthCurrent;i++){
            if(_data.length == 0){
              newData.push({
                dataMonth:i+1,
                fileId:''
              })
            }else{
              let index = resultDataObj[i+1];
              if(!vm.$Util.isEmpty(index)){
                newData.push(_data[index])
              }else{
                newData.push({ dataMonth:i+1, fileId:'' })
              }
            }
          }
          vm.detailTableData.list = newData;
        })
      },
    }
  }
</script>
<style></style>
<style scoped>
  .table-result-boxx{height:calc(100% - 95px);}
  .el-form-item{margin-bottom:15px;}
  .el-form-item label{width: 90px;}
  .back-btn{height:28px;float:right;margin-top:5px;line-height: 28px;padding: 0 20px;border-radius: 0;border: 1px solid #fff;background: rgba(7,182,255,0.1);margin-left:20px;}
  .btn-uls-box{width:calc(100% - 40px);padding: 20px;}
  .popd-title{color: #fff;align-items: center;width: 100%;height: 40px;display: flex;justify-content:space-between;margin-bottom: 20px}
  .pd-name{}
  .btn-uls{}
  .btn-li{float: left;height: 100px;text-align: center;flex-direction: column;margin-right:20px;}
  .bl-btn{width: 100px;height:50px;background:#63cb49;color: #ffffff;border-radius:10px;align-items: center;justify-content: center;display: flex;}
  .bl-down{line-height:50px;color:#5bc9fa;text-decoration: underline;display:inline-block;vertical-align:middle;margin: 0 5px;cursor: pointer}
  .bl-down.disabled{color: #9e9e9e;cursor: default}
  .failBtn{background: #f72c2c;}
  .successBtn{background:#63cb49;}

</style>