<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :md="6" :sm="8">
            <a-form-item label="月份">
              <a-month-picker v-model="queryParam.applyMonth" style="width:100%" placeholder="请选择月份" ></a-month-picker>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="8">
            <a-form-item label="服务商">
              <a-input placeholder="请输入服务商" v-model="queryParam.subcontractorName"></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="8">
            <a-form-item label="完税状态">
              <j-dict-select-tag v-model="queryParam.dutyStatus" placeholder="请选择"
                                 dictCode="duty_status"></j-dict-select-tag>
            </a-form-item>
          </a-col>

          <a-col :md="6" :sm="8" >
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->
    
    <!-- 操作按钮区域 -->
    <div class="table-operator">

    </div>

    <!-- table区域-begin -->
    <div>

      <a-table
        ref="table"
        size="middle"
        bordered
        rowKey="id"
        :scroll="{x:true}"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        class="j-table-force-nowrap"
        @change="handleTableChange">

        <span slot="action" slot-scope="text, record">
          <a @click="handleEdit(record)">人员明细</a>
          <a-divider type="vertical" />
          <a @click="handleView(record)">完税证明</a>
        </span>

      </a-table>
    </div>

    <HlwDutyApplyNewModal ref="modalForm" @ok="modalFormOk"></HlwDutyApplyNewModal>
    <HlwPictureModal ref="modalSelectRequireForm"></HlwPictureModal>
  </a-card>
</template>

<script>

  import '@/assets/less/TableExpand.less'
  import { mixinDevice } from '@/utils/mixin'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import HlwDutyApplyNewModal from './modules/HlwDutyApplyNewModal'
  import { httpAction,getAction } from '@/api/manage'
  import HlwPictureModal from './modules/HlwPictureModal'

  export default {
    name: "HlwDutyApplyList",
    mixins:[JeecgListMixin, mixinDevice],
    components: {
      HlwDutyApplyNewModal,
      HlwPictureModal
    },
    data () {
      return {
        description: 'hlw_duty_apply管理页面',
        // 表头
        columns: [
          {
            title:'月份',
            align:"left",
            dataIndex: 'applyMonth'
          },
          {
            title:'企业名称',
            align:"left",
            dataIndex: 'companyName'
          },
          {
            title:'服务商',
            align:"left",
            dataIndex: 'subcontractorName'
          },
          {
            title:'完税金额',
            align:"left",
            dataIndex: 'sumAmount'
          },
          {
            title:'完税状态',
            align:"left",
            dataIndex: 'dutyStatus',
            customRender:function (text,record) {
              return record.dutyPaidId ? '已完税':'未完税'
            }
          },
          {
            title:'完税时间',
            align:"left",
            dataIndex: 'uploadTime',
            customRender:function (text,record) {
              return text ? text:'--'
            }
          },
          {
            title: '操作',
            dataIndex: 'action',
            align:"left",
            fixed:"right",
            width:180,
            scopedSlots: { customRender: 'action' }
          }
        ],
        url: {
          list: "/wisdom/hlwDutyApply/applyList",
          delete: "/wisdom/hlwDutyApply/delete",
          deleteBatch: "/wisdom/hlwDutyApply/deleteBatch",
          exportXlsUrl: "/wisdom/hlwDutyApply/exportXls",
          importExcelUrl: "wisdom/hlwDutyApply/importExcel",
          checkList: "/wisdom/hlwDutyApply/checkApplyList",
          imgerver: window._CONFIG['imgDomainOssURL']
        },
        dictOptions:{},
      }
    },
    computed: {
      importExcelUrl: function(){
        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
      },
    },
    methods: {
      initDictConfig(){
      },
      loadData(arg) {
        if(!this.url.list){
          this.$message.error("请设置url.list属性!")
          return
        }
        //加载数据 若传入参数1则加载第一页的内容
        if (arg === 1) {
          this.ipagination.current = 1;
        }
        var params = this.getQueryParams();//查询条件
        //时间格式化
        params.applyMonth = !this.queryParam.applyMonth ? null : this.queryParam.applyMonth.format('YYYY-MM')+'-01'
        this.loading = true;
        getAction(this.url.list, params).then((res) => {
          if (res.success) {
            this.dataSource = res.result.records;
            this.ipagination.total = res.result.total;
          }
          if(res.code===510){
            this.$message.warning(res.message)
          }
          this.loading = false;
        })
      },
      //完税
      handleDuty(){
        const that = this;
        if (this.selectedRowKeys.length <= 0) {
          this.$message.warning('请选择至少一条记录！');
          return false;
        }
        const modal = that.$confirm({
          title: '完税证明',
          closable: true,
          keyboard: false,
          maskClosable: true,
          content: '本次完税证明选中'+ that.selectedRowKeys.length +'条',
          okText: '继续',
          cancelText: '取消',
          onOk: function() {
            that.confirmLoading = true;
            var ids = that.selectedRowKeys.join(",");
            console.log("ddf",that.selectedRowKeys,ids)
            //提交后台，查看选中的是否为同一企业、同一服务商的数据
            getAction(that.url.checkList,{ids:ids}).then((res)=>{
              if(res.success){
                that.$refs.taxModal.add(res.result, ids)
                that.$refs.taxModal.title = '完税证明'
                that.$refs.taxModal.disableSubmit = false
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
            })
          },
          onCancel(e) {
            modal.destroy()
          }
        })
      },
      //人员明细
      handleEdit(record){
        this.$refs.modalForm.edit(record)
        this.$refs.modalForm.title = '人员明细'
        this.$refs.modalForm.disableSubmit = false
      },
      //完税证明
      handleView(record){
        var idcard = [];
        if(record.taxPaymentReceipt){
          var invoiceArr=record.taxPaymentReceipt.split(",")
          for (let i = 0; i <invoiceArr.length ; i++) {
            if( invoiceArr[i].indexOf("http")!=-1){
              idcard.push(invoiceArr[i])
            }else{
              idcard.push(this.url.imgerver  +invoiceArr[i])
            }
          }
          this.$refs.modalSelectRequireForm.edit(idcard);
          this.$refs.modalSelectRequireForm.title = '完税证明'
          this.$refs.modalSelectRequireForm.disableSubmit = false
        }else{
          this.$message.warning('未上传')
        }
      },
      getCheckboxProps(record) {
        return {
          props: {
            disabled: record.dutyPaidId != null
          }
        }
      },
      modalFormOk(){
        this.loadData(1);
        this.onClearSelected();
      },
    }
  }
</script>
<style scoped>
  @import '~@assets/less/common.less';
</style>