Canp.vue

<template>
  <div class="eibs-tab">
    <!-- ====================左边======================= -->
    <c-col :span="11">
      <c-col :span="22">
        <el-form-item label="光票托收编号" prop="ccdgrp.rec.ownref">
          <c-input
            v-model="model.ccdgrp.rec.ownref"
            maxlength="8"
            placeholder="请输入Our Reference"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="2">
        <c-button
          style="margin: 0 12px 0 14px; padding: 0 12px"
          size="small"
          type="primary"
          disabled
        >
          <span style="font-family: '宋体'; font-weight: bold">i</span>
        </c-button>
      </c-col>

      <c-col :span="12">
        <el-form-item label="光票托收币种金额" prop="ccdgrp.cbs.max.cur">
          <c-select
            v-model="model.ccdgrp.cbs.max.cur"
            style="width: 100%"
            placeholder="请选择光票托收币种"
            disabled
          >
            <el-option
              v-for="item in codes.curtxt1"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item
          style="text-align: left"
          label-width="20px"
          prop="ccdgrp.cbs.max.amt"
        >
          <c-input-currency
            v-model="model.ccdgrp.cbs.max.amt"
            style="text-align: left; width: 100%"
            placeholder="请输入光票托收金额"
            @keyup.enter.native="
              defaultFunction('ccdgrp.cbs.max.amt', model.ccdgrp.cbs.max.amt)
            "
            disabled
          ></c-input-currency>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="光票托收币种余额" prop="ccdgrp.cbs.opn1.cur">
          <c-select
            disabled
            v-model="model.ccdgrp.cbs.opn1.cur"
            style="width: 100%"
            placeholder="请选择光票托收币种"
          >
            <el-option
              v-for="item in codes.curtxt1"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item
          style="text-align: left"
          label-width="20px"
          prop="ccdgrp.cbs.opn1.amt"
        >
          <c-input-currency
            v-model="model.ccdgrp.cbs.opn1.amt"
            style="text-align: left; width: 100%"
            placeholder="请输入光票托收余额"
            @keyup.enter.native="
              defaultFunction('ccdgrp.cbs.opn1.amt', model.ccdgrp.cbs.opn1.amt)
            "
            disabled
          ></c-input-currency>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="出票日期" prop="ccdgrp.rec.chkdat">
          <c-date-picker
            type="date"
            v-model="model.ccdgrp.rec.chkdat"
            style="width: 100%"
            placeholder="请选择出票日期"
            disabled
          ></c-date-picker>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="光票托收形式" prop="ccdgrp.rec.ccform">
          <c-select
            v-model="model.ccdgrp.rec.ccform"
            style="width: 100%"
            placeholder="请选择光票托收形式"
            :code="codes.ccform"
            disabled
          >
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="付款方式 " prop="ccdgrp.rec.purflg">
          <c-select
            v-model="model.ccdgrp.rec.purflg"
            style="width: 100%"
            placeholder="请选择付款方式 "
            :code="codes.purflg"
            disabled
          >
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="退单原因" prop="rejtypsel">
          <c-select
            v-model="model.rejtypsel"
            style="width: 100%"
            placeholder="请选择退单原因"
            :code="codes.rejtypsel"
            @change="change"
          >
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item
          label=""
          style="margin-left: 0px"
          prop="mtabut.clsflg"
        >
          <c-checkbox v-model="clsflg" disabled
            >或有帐冲销</c-checkbox
          >
        </el-form-item>
      </c-col>
    </c-col>

    <!-- ====================右边======================= -->
    <c-col :span="11" :offset="1">
      <c-col :span="24">
        <el-form-item label="业务名称" prop="ccdgrp.rec.nam">
          <c-input
            v-model="model.ccdgrp.rec.nam"
            maxlength="40"
            placeholder="请输入业务名称"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="汇票提交人" prop="ccdgrp.pre.pts.ref">
          <c-input
            v-model="model.ccdgrp.pre.pts.ref"
            maxlength="40"
            placeholder="请输入汇票提交人"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="" prop="ccdgrp.pre.pts.nam">
          <c-input
            v-model="model.ccdgrp.pre.pts.nam"
            maxlength="40"
            placeholder="请输入"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="承兑汇票银行" prop="ccdgrp.dro.pts.ref">
          <c-input
            v-model="model.ccdgrp.dro.pts.ref"
            maxlength="40"
            placeholder="请输入承兑汇票银行"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="" prop="ccdgrp.dro.pts.nam">
          <c-input
            v-model="model.ccdgrp.dro.pts.nam"
            maxlength="40"
            placeholder="请输入"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="代收行参考号" prop="ccdgrp.col.pts.ref">
          <c-input
            v-model="model.ccdgrp.col.pts.ref"
            maxlength="40"
            placeholder="请输入代收行参考号"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="" prop="ccdgrp.col.pts.nam">
          <c-input
            v-model="model.ccdgrp.col.pts.nam"
            maxlength="40"
            placeholder="请输入"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <c-form-item
          label="退票原因"
          prop="ccdgrp.blk.retson"
        >
          <c-input
            type="textarea"
            :rows="6"
            v-model="model.ccdgrp.blk.retson"
            maxlength="600"
            show-word-limit
            placeholder="请输入退票原因"
          ></c-input>
        </c-form-item>
      </c-col>
    </c-col>
  </div>
</template>
<script>
import Api from "~/service/Api";
import commonProcess from "~/mixin/commonProcess";
import CodeTable from "~/config/CodeTable";
import Event from "~/model/Cctdcr/Event";

export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [commonProcess],
  data() {
    return {};
  },
  computed: {
    clsflg: {
      get() {
        return this.model.mtabut.clsflg != "O";
      },
      set(val) {
        this.model.mtabut.clsflg = val ? "C" : "O";
      },
    },
  },
  methods: {
    ...Event,
    async change() {
      if (this.model.rejtypsel === "R") {
        this.model.mtabut.clsflg = "C";
      } else {
        this.model.mtabut.clsflg = "O";
      }
    },
  },
  created: function () {},
};
</script>
<style>
</style>