<template>
  <j-modal
    title="收据模板"
    width="70%"
    :visible="visible"
    switchFullscreen
    @ok="handleOk"
    :okButtonProps="{ class:{'jee-hidden': false} }"
    @cancel="handleCancel"
  >
    <template slot="footer">
      <a-button key="back" @click="handleCancel">关闭</a-button>
    </template>
    <div>
      <a-table
        ref="table"
        size="middle"
        :scroll="{x:true}"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        class="j-table-force-nowrap"
      >
        <span slot="receiptStatus" slot-scope="text, record">
          <span :style="{'color': record.receiptStatus === '1' ? 'green' : 'red'}">{{record.receiptStatus === '1' ? '是' : '否'}}</span>
        </span>
        <span slot="action" slot-scope="text, record">
          <!-- <a @click="handleEdit(record)">编辑</a> -->
          <a @click="handleDetail(record)">预览</a>
          <a @click="onIssueReceipt(record)" style="margin-left: 10px;">下载</a>
        </span>
      </a-table>
    </div>
  </j-modal>
</template>

<script>
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'

  const columns = [
    {
      title: '收据编号',
      dataIndex: 'templateCode',
      key: 'templateCode',
      align: 'center'
    },
    {
      title: '收据名称',
      dataIndex: 'templateName',
      key: 'templateName',
      align: 'center'
    },
    {
      title: '收据类型',
      dataIndex: 'typeName',
      key: 'typeName',
      align: 'center'
    },
    {
      title: '上传人',
      dataIndex: 'createBy',
      key: 'createBy',
      align: 'center'
    },
    {
      title: '上传时间',
      dataIndex: 'createTime',
      key: 'createTime',
      align: 'center'
    },
    {
      title: '操作',
      dataIndex: 'action',
      scopedSlots: { customRender: 'action' },
      align: 'center',
      width: 150,
      fixed: 'right'
    }
  ]

  export default {
    name: 'PropertySettledModal',
    mixins: [JeecgListMixin],
    data () {
      return {
        columns: columns,
        url: {
          list: "/property-company/system/receiptTemplate/list"
        },
        visible: false,
      }
    },
    methods: {
      onLoadTemplate() {
        this.visible=true
        this.loadData()
      },
      edit (record) {
        this.visible=true
        this.$nextTick(()=>{
          this.$refs.realForm.edit(record);
        })
      },
      close () {
        this.$emit('close');
        this.visible = false;
      },
      handleOk () {
        this.$refs.realForm.submitForm();
      },
      submitCallback(){
        this.$emit('ok');
        this.visible = false;
      },
      handleCancel () {
        this.close()
      }
    }
  }
</script>