<template>
  <div class="descriptions-edit">
    <el-form ref="form" v-loading="loading" :model="form" :rules="rules" :show-message="false" v-enterboard>
      <el-descriptions :column="2" border>
        <el-descriptions-item>
          <template slot="label">单据号<rq /></template>
          <MyFormItem prop="billNo" :value="form.billNo" :readonly="orderReadonly">
            <BillNumberInput v-model="form.billNo" type="JZ"></BillNumberInput>
          </MyFormItem>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">收/支</template>
          <el-tag :type="form.rpFlag == 1 ? 'success' : ''" size="small">{{ form.rpFlag == 0 ? '收' : '支'
            }}</el-tag>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">{{ `${form.rpFlag == 0 ? '付': '收'}款单位` }}</template>
            <MyFormItem prop="custName" :value="form.custName" :readonly="true">
            </MyFormItem>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">{{ `实${form.rpFlag == 0 ? '收': '付'}金额` }}<rq /></template>
            <MyFormItem prop="paidMoney" :value="form.paidMoney" :readonly="readonly">
              <el-input v-model="form.paidMoney" placeholder="请输入金额" />
            </MyFormItem>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">已核销</template>
            <MyFormItem prop="hxAmount" :value="form.hxAmount || 0" :readonly="true">
            </MyFormItem>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">未核销</template>
            <MyFormItem prop="whxAmount" :value="form.whxAmount || 0" :readonly="true">
            </MyFormItem>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">币种<rq /></template>
            <MyFormItem prop="currencyCode" :value="form.currencyCode" :readonly="readonly" filterable>
              <template slot="readonly">
                <dict-tag :options="dict.type.sys_curr_type" :value="form.currencyCode" />
              </template>
              <el-select v-model="form.currencyCode" placeholder="请选择币种" clearable >
                <el-option v-for="dict in dict.type.sys_curr_type" :key="dict.value" :label="dict.label" :value="dict.value" />
              </el-select>
            </MyFormItem>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">日期</template>
            <MyFormItem prop="paidTime" :value="form.paidTime" :readonly="readonly">
              <el-date-picker class="el-date-picker" v-model="form.paidTime" value-format="yyyy-MM-dd" type="date" placeholder="请选择日期">
              </el-date-picker>
            </MyFormItem>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">备注</template>
            <MyFormItem prop="remark" :value="form.remark" :readonly="readonly">
              <el-input v-model="form.remark" placeholder="请输入备注" />
            </MyFormItem>
        </el-descriptions-item>
      </el-descriptions>
    </el-form>
  </div>
</template>

<script>
import { getCash, addCash, updateCash } from "@/api/finance/cash";
import CustInput from "@/views/tm/components/CustInput";
import { formatDateToDataStr } from '@/utils';

export default {
  name: 'CashEdit',
  dicts: ['sys_curr_type'],
  components: { CustInput },
  props: {
    bid: [String, Number, Array],
    readonly: Boolean,
    cust: {
      type: Object,
      default: () => ({})
    },
    // 0应收 1应付
    rpFlag: [String],
  },
  computed: {
    orderReadonly() {
      return this.readonly || this.$validate.hasValue(this.form.id);
    },
  },
  data() {
    return {
      loading: false,
      form: {},
      rules: {
        billNo: [
          { required: true, message: "单据号不能为空", trigger: "input" }
        ],
        custId: [
          { required: true, message: "收/付款单位不能为空", trigger: "change" }
        ],
        paidMoney: [
          { required: true, message: "实收/付金额不能为空", trigger: "blur" }
        ],
        currencyCode: [
          { required: true, message: "币种不能为空", trigger: "change" }
        ],
      },
    }
  },
  watch: {
    bid: {
      immediate: true,
      handler(val) {
        this.getDetail();
      }
    },
  },
  methods: {
    // 修改客户
    handleCustChange(custs) {
      const cust = custs.length > 0 ? custs[0] : {};
      this.form.custId = cust.id;
      this.form.custCode = cust.custCode;
      this.form.custName = cust.custName;
    },
    // 获取详情
    getDetail() {
      this.form = this.defaultForm();
      this.resetForm("form");
      if (!this.bid) {
        return;
      }
      this.loading = true;
      getCash(this.bid).then((res) => {
        this.loading = false;
        this.form = this.defaultForm(res.data);
      }).catch((err) => {
        this.loading = false;
      });
    },
    // 默认表单
    defaultForm(data) {
      return {
        billNo: null,
        rpFlag: this.rpFlag,
        custId: this.cust.id,
        custName: this.cust.custName,
        custCode: this.cust.custCode,
        remark: null,
        paidMoney: null,
        paidTime: data && data.id ? '' : formatDateToDataStr(),
        currencyCode: '142', //142 人民币
        ...data,
      };
    },
    // 提交表单
    submitForm() {
      if (this.readonly) {
        return;
      }
      this.$refs.form.validate((valid, rules) => {
        if (!valid) {
          this.$modal.formWarning(rules);
          return;
        }
        if (this.$validate.hasValue(this.form.id)) {
          updateCash(this.form).then(response => {
            this.$modal.msgSuccess("修改成功");
            this.$emit('saved', false);
          });
        } else {
          addCash(this.form).then(response => {
            this.$modal.msgSuccess("新增成功");
            this.$emit('saved', true);
          });
        }
      });
    }
  }
}
</script>

<style>

</style>