companyAccountTable.vue 4.13 KB
<template>
  <div>
    <a-card title="企业账户信息" :bordered="false">
      <!-- <a-button v-if="!disableSubmit" style="margin-bottom:10px;float:right;position:relative;z-index:10;" @click="handleAddModal('企业账户信息')" type="primary" icon="plus">增加账户</a-button> -->
      <a-table ref="table" size="middle" bordered :columns="companyInfoData" :rowKey="(record, index) => index" :dataSource="cusPublicBankAccounts" :pagination="false" :loading="loading" @change="handleTableChange">
        <!-- 字符串超长截取省略号显示-->
        <span slot="esContent" slot-scope="text">
          <j-ellipsis :value="text" :length="10" />
        </span>

        <span v-if="!disableSubmit" slot="action" slot-scope="text, record">
          <a-button
              type="link"
              size="small"
              @click="handleEditModal('企业账户信息',record)"
              icon="edit"
              style="font-size: 12px"
            >
              修改</a-button
            >
          <!-- <a-divider type="vertical" />
          <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record)">
            <a>删除</a>
          </a-popconfirm> -->
        </span>
      </a-table>
    </a-card>
    <company-account-modal ref="companyAccountModal" @ok="companyAccountModalOk"></company-account-modal>
  </div>
</template>

<script>
import { JeecgListMixin } from '@/mixins/CoreListMixin'
import companyAccountModal from './companyAccountModal'
import { deleteCollCusBankAccount } from '@/api/configApi'

export default {
  name: 'companyAccountTable',
  mixins: [JeecgListMixin],
  props: {
    userType: {
      type: Number,
      default: '',
    },
    cusPublicBankAccounts: {
      type: Array,
      default: () => {
        return [];
      }
    },
    applyNo: {
      type: String,
      default: ''
    },
    disableSubmit: {
      type: Boolean,
      default: false
    }
  },
  components: {
    companyAccountModal,
  },
  data () {
    return {
      companyInfoData: [
        {
          title: '序号',
          dataIndex: '',
          key: 'rowIndex',
          align: 'center',
          width: 60,
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          }
        },
        {
          title: '开户行名称',
          align: 'center',
          width: '100px',
          dataIndex: 'bankName'
        },
        {
          title: '账户名',
          align: 'center',
          dataIndex: 'bankCardName'
        },
        {
          title: '账户号',
          align: 'center',
          dataIndex: 'bankCardNoView'
        },
        {
          title: '开户省',
          align: 'center',
          dataIndex: 'provinceName'
        },
        {
          title: '开户市',
          align: 'center',
          dataIndex: 'cityName'
        },
        {
          title: '支行名称',
          align: 'center',
          dataIndex: 'branchName'
        },
        {
          title: '操作',
          dataIndex: 'action',
          scopedSlots: { customRender: 'action' },
          align: 'center',
          width: 120,
          fixed: 'right'
        }
      ],
      disableMixinCreated: true,
    }
  },
  methods: {
    handleAddModal (title) {
      console.log(this.applyNo)
      this.$refs.companyAccountModal.add(this.applyNo)
      this.$refs.companyAccountModal.title = title ? title : '新增'
      this.$refs.companyAccountModal.disableSubmit = false
    },
    handleEditModal (title, record) {
      this.$refs.companyAccountModal.edit(record)
      this.$refs.companyAccountModal.title = title ? title : '修改'
      this.$refs.companyAccountModal.disableSubmit = false
    },
    handleDelete (record) {
      console.log(record)
      let _p = { 'id': record.id }
      deleteCollCusBankAccount(_p).then(res => {
        if (res.status.statusCode == 0) {
          this.$emit('editReload');
          this.$message.success(res.status.statusReason)
        } else {
          this.$message.warning(res.status.statusReason)
        }
      })
    },
    companyAccountModalOk () {
      this.$emit('editReload');
    },
  }
}
</script>
<style>
</style>