<template>
  <div>
    <Form
      ref="payWayInfoForm"
      :model="modelForm"
      class="ivu-form-no-margin-bottom"
      :label-width="120"
    >
      <Row
        :gutter="20"
        class="code-row-bg"
      >
        <Col
          span="12"
          style="border:none;"
        >
        <Form-item
          prop="todo1"
          label="收款方账号"
        >
          <SelectVendorBankInfo
            size="small"
            :value="modelForm.bankAccount"
            :buCode="buCode"
            @handleSelect="handleSelect"
          ></SelectVendorBankInfo>
        </Form-item>
        </Col>
        <Col
          span="12"
          style="border:none;"
        >
        <Form-item
          prop="todo2 "
          label="收款方户名"
        >
          <Input
            v-model="modelForm.accountName"
            placeholder=""
            size="small"
            maxlength="50"
            readonly
          ></Input>
        </Form-item>
        </Col>
      </Row>
      <Row
        :gutter="20"
        class="code-row-bg"
      >
        <Col
          span="12"
          style="border:none;"
        >
        <Form-item
          prop="todo3"
          label="供应商编码"
        >
          <Input
            v-model="modelForm.vendorCode"
            placeholder=""
            size="small"
            maxlength="50"
            readonly
          ></Input>
        </Form-item>
        </Col>
        <Col
          span="12"
          style="border:none;"
        >
        <Form-item
          prop="todo4 "
          label="供应商名称"
        >
          <Input
            v-model="modelForm.vendorName"
            placeholder=""
            size="small"
            maxlength="50"
            readonly
          ></Input>
        </Form-item>
        </Col>
      </Row>
      <Row
        v-if="isDisplay"
        :gutter="20"
        class="code-row-bg"
      >
        <Col
          span="12"
          style="border:none;"
        >
        <Form-item
          prop="todo5 "
          label="银行编码"
        >
          <Input
            v-model="modelForm.bankId"
            placeholder=""
            size="small"
            maxlength="50"
            readonly
          ></Input>
        </Form-item>
        </Col>
        <Col
          span="12"
          style="border:none;"
        >
        <Form-item
          prop="todo6 "
          label="收款方地点"
        >
          <Input
            v-model="modelForm.vendorSite"
            placeholder=""
            size="small"
            maxlength="50"
            readonly
          ></Input>
        </Form-item>
        </Col>
      </Row>
      <Row
        v-if="isDisplay"
        :gutter="20"
        class="code-row-bg"
      >
        <Col
          span="12"
          style="border:none;"
        >
        <Form-item
          prop="todo7 "
          label="收款方区域"
        >
          <Input
            v-model="modelForm.areaCode"
            placeholder=""
            size="small"
            maxlength="50"
            readonly
          ></Input>
        </Form-item>
        </Col>
        <Col
          span="12"
          style="border:none;"
        >
        <Form-item
          prop="todo8"
          label="是否启用委托付款"
        >
          <Select
            v-model="modelForm.isEntrustentPayment"
            size="small"
            disabled
            readonly
          >
            <Option value="true">
              是
            </Option>
            <Option value="false">
              否
            </Option>
          </Select>
        </Form-item>
        </Col>
      </Row>
      <Row
        v-if="isDisplay"
        :gutter="20"
        class="code-row-bg"
      >
        <Col
          span="12"
          style="border:none;"
        >
        <Form-item
          prop="todo9 "
          label="人行行号"
        >
          <Input
            v-model="modelForm.cbankCode "
            placeholder=""
            size="small"
            maxlength="50"
            readonly
          ></Input>
        </Form-item>
        </Col>
      </Row>
    </Form>
  </div>
</template>
<script>
import Server from './server';
import { SelectVendorBankInfo } from '@paymentPlatformComps/index.js';
const server = new Server();
export default {
  name: 'VendorInfoForm',
  components: {
    SelectVendorBankInfo
  },
  directives: {},
  props: {
    buCode: {
      type: [String, Number],
      default: ''
    },
    paymentState: {
      type: [String, Number],
      default: ''
    },
    invoiceNo: {
      type: [String, Number],
      default: ''
    },
    claimNo: {
      type: [String, Number],
      default: ''
    },
    vendorCode: {
      type: [String, Number],
      default: ''
    },
    payLineId: {
      type: [String, Number],
      default: ''
    }
  },
  data() {
    return {
      server: server,
      isDisplay: true,
      modelForm: {
        invoiceNo: '',
        claimNo: '',
        bankAccount: '',
        accountName: '',
        vendorCode: '',
        vendorName: '',
        bankId: '',
        vendorSite: '',
        areaCode: '',
        isEntrustentPayment: '',
        cbankCode: '',
        payLineId: ''
      }
    };
  },
  computed: {
  },
  watch: {},
  created: function() {
    // 查询供应商明细
    this.server
      .queryVendorInfo({ invoiceNo: this.invoiceNo, claimNo: this.claimNo })
      .then(response => {
        // this.modelForm = response.dataResult;
        this.modelForm = {
          invoiceNo: this.invoiceNo,
          claimNo: this.claimNo,
          bankAccount: response.bankAccount,
          accountName: response.accountName,
          vendorCode: response.vendorCode,
          vendorName: response.vendorName,
          bankId: response.bankId,
          vendorSite: response.vendorSite,
          areaCode: response.areaCode,
          isEntrustentPayment: response.isEntrustentPayment,
          cbankCode: response.cbankCode
        };
      });
    this.$emit('SetTitle', '供应商信息');
    this.$emit('SetPageSize', 750);
    const buttons = [];
    if (this.paymentState == '1') {
      buttons.push({
        text: '保存',
        theme: 'primary',
        handle: () => {
          this.save();
        }
      });
    }
    buttons.push({
      text: '关闭',
      theme: 'primary',
      handle: () => {
        this.$emit('Close');
      }
    });
    this.$emit('SetPageActions', buttons);
  },
  beforeMount: function() {},
  mounted: function() {
    this.init();
  },
  beforeDestroy: function() {},
  destroyed: function() {},
  methods: {
    init() {},
    // 保存供应商明细
    save() {
      this.modelForm.payLineId = this.payLineId;
      this.server
        .saveVendorInfo({ params: this.modelForm })
        .then(response => {
          if (response.statusCode == '-1') {
            this.$Message.error('保存失败!');
            this.$emit('Close', this.modelForm);
          } else {
            this.$Message.success('保存成功');
            this.$emit('Close', this.modelForm);
          }
        });
    },
    handleSelect(data) {
      this.modelForm = {
        invoiceNo: this.invoiceNo,
        claimNo: this.claimNo,
        bankAccount: data.vendorAccountNo, // 收款方账号
        accountName: data.vendorAccountName, // 收款方户名
        vendorCode: data.vendorCode,
        vendorName: data.vendorName,
        bankId: data.bkInfCode,
        vendorSite: data.vendorSiteName, // 收款方地点
        areaCode: data.areaCode,
        isEntrustentPayment: this.modelForm.isEntrustentPayment, // 是否启用委托付款
        cbankCode: data.cbankCode
      };
    }
  }
};
</script>
