<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 tworow">
          <div class="search-info-box" style="">
            <div class="search-row" style="padding-top:0;margin-bottom:10px;">
              <div class="search-row-label">所属类别</div>
              <div class="search-row-condition">
                <el-checkbox class="search-condition-checkall" :indeterminate="areaCheckObj.isIndeterminate" v-model="areaCheckObj.checkAll" @change="(value) => handleAreaCheckAllChange(value)">全选</el-checkbox>
                <el-checkbox-group v-model="areaCheckObj.checkedList" @change="(value) => handleCheckedChange(value)">
                  <el-checkbox v-for="item in areaCheckObj.checkList" :label="item.name" :key="item.value">{{item.name}}</el-checkbox>
                </el-checkbox-group>
                <el-button class="operate-btn" type="primary" @click="typeDialogVisible = true" v-if="false">自定义</el-button>
              </div>
            </div>
            <div class="search-item" v-if="false">
              <div class="search-item-label">时间</div>
              <el-date-picker
                v-model="timeFilter"
                type="daterange"
                unlink-panels
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" style="width:260px">
              </el-date-picker>
            </div>
            <div class="search-item">
              <div class="search-item-label">时间</div>
              <el-date-picker
                type="date"
                v-model="filter.startDate"
                placeholder="开始日期"
                value-format="yyyy-MM-dd"
                style="width:150px;float: left;">
              </el-date-picker>
            </div>
            <div class="search-item" style="margin-left: 10px;">
              <div class="search-item-label">至</div>
              <el-date-picker
                type="date"
                v-model="filter.endDate"
                placeholder="结束日期"
                value-format="yyyy-MM-dd"
                style="width:150px;float: left;">
              </el-date-picker>
            </div>
            <el-button class="search-btn" type="primary" @click="searchResult">查询</el-button>
            <el-button class="search-btn" type="primary" @click="reset">重置</el-button>
            <el-button class="operate-btn" type="primary" @click="addData">新增</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="category" align="center" label="类别"  show-overflow-tooltip></el-table-column>
              <el-table-column prop="fileName" align="center" label="文件名" show-overflow-tooltip></el-table-column>
              <el-table-column prop="content" align="center" label="内容" show-overflow-tooltip></el-table-column>
              <el-table-column prop="applyUser" align="center" label="申请人" show-overflow-tooltip ></el-table-column>
              <el-table-column prop="uploadUser" align="center" label="上传人" show-overflow-tooltip ></el-table-column>
              <el-table-column prop="uploadTime" align="center" label="上传时间" width="150"></el-table-column>
              <el-table-column prop="contact" align="center" label="联系人" show-overflow-tooltip ></el-table-column>
              <el-table-column prop="" align="center" label="附件">
                <template slot-scope="scope">
                  <div style="" class="list-file"  @click="downLoadFile(item)" v-for="(item,index) in scope.row.attachment" :key="index"><i class="el-icon-document"></i>{{item.name}}</div>
                </template>
              </el-table-column>
            </el-table>
            <el-pagination @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>
      </div>
    </div>
    <!---->
    <el-dialog title="新增企业申报" :visible.sync="dialogVisible" width="450px" :close-on-click-modal=false top="60px">
      <el-form :model="importParam" :rules="addRules" ref="importForm" label-width='120px'>
        <el-form-item label="所属类别" prop="category">
          <el-select v-model="importParam.category" clearable placeholder="请选择">
            <el-option  v-for="item in  areaCheckObj.checkList" :key="item.name" :label="item.name" :value="item.name"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="文件名" prop="fileName">
          <el-input v-model="importParam.fileName" placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item label="内容" prop="content">
          <el-input type="textarea" :rows="2" v-model="importParam.content"  placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item label="申请人" prop="applyUser">
          <el-input v-model="importParam.applyUser" placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item label="联系人" prop="contact">
          <el-input v-model="importParam.contact" placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item label="上传" prop="">
          <el-upload :action='GLOBAL.BASE_HTTP_URL+"/dx-economy-api/file"' name="files"  :limit=12 :before-remove="beforeAttachmentRemove" :on-exceed="handleAttachmentExceed" :file-list="fileList" :on-success="handleAttachmentSuccess">
            <el-button size="small" type="primary">点击上传</el-button>
          </el-upload>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="importReport()">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog title="所属类别" :visible.sync="typeDialogVisible" width="450px" :close-on-click-modal=false>
      <div class="search-row" style="padding-top:0;margin-bottom:10px;">
        <div class="search-row-label">所属类别</div>
        <div class="search-row-condition">
          <el-input v-model="typeNames" placeholder="请输入内容"></el-input>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="typeDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="addTypes(orgnId)">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  let month = new Date().getMonth()==0?0:new Date().getMonth();
  let year = month<10?new Date().getFullYear()+"-0"+month :new Date().getFullYear()+"-"+month;
  export default {
    name: 'yjManage',
    data () {
      return {
        timeFilter:[new Date().format("yyyy-")+"01-01",new Date().format("yyyy-MM-dd")],
        filter:{
          startDate: new Date().format("yyyy-")+"01-01",
          endDate:new Date().format("yyyy-MM-dd")
        },
        areaCheckObj:{
          isIndeterminate: false,
          checkList: [{id:1,name:'公租房申报管理'},{id:2,name:'财源信贷通申报管理'},{id:3,name:'项目申报管理'},{id:4,name:'其他'},],
          checkedList: [],
          checkAll: false
        },
        typeDialogVisible:false,
        typeNames:'',
        dialogVisible:false,
        fileList:[],
        addRules:{
          fileName: [ { required: true, message: '请输入文件名', trigger: 'blur' }],
          category: [ { required: true, message: '请选择所属类别', trigger: 'change' } ],
          content: [ { required: true, message: '填写输入内容', trigger: 'blur' } ],
          applyUser: [ { required: true, message: '填输入申请人', trigger: 'blur' } ],
          contact: [ { required: true, message: '填输入联系人', trigger: 'blur' } ],
          attachment: [ { required: true, message: '请选择上传数据文件' }]
        },
        importParam:{category :'',contact: "",applyUser:'',fileName :'',content:'',attachment:""},

        zbTypeList:[{id:1,name:'全部'},{id:2,name:'产值增幅同比'},{id:3,name:'进出口增幅同比'}],
        tableData:{
          list: [],
          pageNum: 1,
          pageSize: 10,
          pages: 0,
          total: 0,
        },
      }
    },
    mounted (){},
    created(){
      this.GLOBAL.app.getDictList(resp => {
        this.areaCheckObj.checkList = resp["企业申报管理类别"];
      })
      this.getDataList();
    },
    watch:{

    },
    methods:{
      searchResult(){
        this.getDataList(1)
      },
      getDataList(pageNum){
        let vm = this;
        vm.filter.category = vm.areaCheckObj.checkedList.join(",");
        vm.$http.get('/dx-economy-api/declaration/page',{params:$.extend({pageNum:vm.tableData.pageNum,pageSize:vm.tableData.pageSize},vm.filter)}).then(function (resp) {
          let _data = resp.data;
          if (_data.code === 200 && !vm.$Util.isEmpty(_data.data)) {
            vm.tableData.list = _data.data.list;
            if(!vm.$Util.isEmpty(vm.tableData.list)){
              vm.tableData.list.forEach(function (item) {
                let list = [];
                if( !vm.$Util.isEmpty(item.attachment)) {
                  item.attachment.split(",").find((v) => {
                    list.push({  name: v.split(":")[1], url: vm.GLOBAL.BASE_HTTP_URL + "/dx-economy-api/file/" + v.split(":")[0],id:v.split(":")[0], response: {data: v}})
                  })
                }
                item.attachment = list;
              });
            }
            vm.tableData.pageNum = resp.data.data.pageNum;
            vm.tableData.total = resp.data.data.total;
          }
        })
      },
      downLoadFile(item) {
        let vm = this;
        vm.$confirm('确定下载该文件吗?', '提示', {
          type: 'warning'
        }).then(() => {
          vm.$http.get('/dx-economy-api/file/'+item.id).then(() => {
           /* vm.$notify({
              title: '提示',
              message: '导出'+item.name+'项目成功！',
              type: 'success'
            });*/
          });
        }).catch(() => {})
      },
      /*search*/
      handleAreaCheckAllChange(value){
        let _this = this,obj = _this.areaCheckObj,_list = [];
        if(value){
          obj.checkList.forEach(item => {
            _list.push(item.name);
          });
        }
        obj.checkedList = _list;
        obj.isIndeterminate = false;
      },
      handleCheckedChange(value) {
        let _this = this,obj = _this.areaCheckObj;
        obj.checkAll = value.length === obj.checkList.length;
        obj.isIndeterminate = value.length > 0 && value.length < obj.checkList.length;
      },
      reset(){
        this.filter = {
          startDate: new Date().format("yyyy-")+"01-01",
          endDate:new Date().format("yyyy-MM-dd")
        }
        this.areaCheckObj.isIndeterminate = false;this.areaCheckObj.checkedList = [];this.areaCheckObj.checkAll = false;
      },
      addTypes(){
        let vm = this
        vm.areaCheckObj.checkList.push({
          name:vm.typeNames
        })
        vm.typeDialogVisible = false
      },

      addData(){
        let vm = this
        vm.resetForm("importForm")
        vm.dialogVisible = true
      },
      resetForm(formName) {
        var _this = this;
        if(!_this.$Util.isEmpty(_this.$refs[formName])){
          _this.$refs[formName].resetFields();
          _this.fileList=[];
          _this.importParam={category :'',contact: "",applyUser:'',fileName :'',content:'',attachment:""};
        }
      },
      /*新增档案*/
      handleAttachmentExceed() {
        this.$message.warning("当前限制选择1个文件");
      },
      beforeAttachmentRemove(file) {
        var vm = this,num = null
        vm.fileList.findIndex((v,i)=>{
          if(v.name == file.name)
            num = i
        })
        vm.$http.delete('/dx-economy-api/file/'+file.response.data.split(":")[0]).then(function (resp) {
          let _data = resp.data;
          if (_data.code === 200) {
            vm.fileList.splice(num,1)
          }
        })
      },
      handleAttachmentSuccess(res,file,fileList){
        let vm =this
        vm.fileList = fileList
      },
      importReport () {
        let _this = this;
        _this.$refs['importForm'].validate((valid) => {
          if (valid) {
            _this.fileList.find((v)=>{
              _this.importParam.attachment = _this.importParam.attachment == "" ? v.response.data : _this.importParam.attachment + "," + v.response.data
            })
            _this.$http.post('/dx-economy-api/declaration', _this.importParam).then(function (resp) {
              let _data = resp.data;
              if (_data.code === 200) {
                _this.$message.success("新增成功");
                _this.resetForm("importForm");
                _this.getDataList(_this.tableData.pageNum)
              } else {
                _this.$message.error(_data.message);
              }
            });
            _this.dialogVisible = false;
          } else {
            return false;
          }
        });
      },
      /*end*/
      handlePageChange(currentPage){
        this.tableData.pageNum = currentPage;
        this.getDataList()
      },
    }
  }
</script>
<style></style>
<style scoped>
  .aaa{}
  .aaa{}
  .aaa{}
  .aaa{}
  .aaa{}
</style>