Brtdcrd.vue

<template>
  <div class="eibs-tab">
    <c-row>
      <c-col :span="12">
        <c-row>
          <c-col :span="24">
            <el-form-item label="不符点">
              <c-input type="textarea" :disabled="model.bddgrp.blk.docdisflg ? false : true" :rows="6"
                v-model="model.bddgrp.blk.docdis" maxlength="65" show-word-limit placeholder="请输入不符点"></c-input>
            </el-form-item>
          </c-col>
        </c-row>
        <el-form-item label="快递单号" v-if="model.bddgrp.rec.advdocflg == 'X'">
          <c-input type="textarea" :rows="2" v-model="model.expmno" maxlength="120" show-word-limit placeholder="请输入单号">
          </c-input>
        </el-form-item>
        <!-- <c-row>
          <c-form-item label="已交单据" prop="bdtp.docgrdm.docgrd">
            <c-col :span="24">
              <c-istream-table
                :list="model.bdtp.docgrdm.docgrd"
                :columns="columns"
              >
              </c-istream-table>
            </c-col>
          </c-form-item>
        </c-row> -->
        <!-- <c-col :span="24" style="height: 24px; margin-top: -10px">
          <el-form-item :label="model.bdtp.docgrdm.docdsclab" class="messageLabel">
            <c-button style="float: right" @click="addTableValue" type="primary">新增单据</c-button>
          </el-form-item>
        </c-col>
        <c-col :span="24" style="margin-bottom: 30px;">
          <c-table height="200px" style="text-align: center" :list="this.model.bdtp.docgrdm.docgrd || []"
            :paginationShow="false" :border="true">
            <el-table-column label="1st" width="auto">
              <template slot-scope="scope">
                <c-input v-model="scope.row.cmail1"></c-input>
              </template>

            </el-table-column>
            <el-table-column label="2st" width="auto">
              <template slot-scope="scope">
                <c-input v-model="scope.row.cmail2"></c-input>
              </template>
            </el-table-column>
            <el-table-column label="Document" prop="docnam" width="auto">
              <template slot-scope="scope">
                <c-select style="width: 100%" placeholder="请选择" v-model="scope.row.docnam">
                  <el-option v-for="item in codeTable" :key="item.value" :label="item.label" :value="item.value">
                  </el-option>
                </c-select>
              </template>
            </el-table-column>
            <el-table-column label="操作" width="170px" fixed="right">
              <template slot-scope="scope">
                <c-button @click="deleteTable(scope.$index)" type="primary">删除</c-button>
              </template>
            </el-table-column>
          </c-table>
        </c-col> -->
        <c-docpre
        :model="model" 
        :argadr="{
          path: 'bddgrp.blk.prsdoc',
          grp: 'bdtp',
          code: 'bdtdck',
        }"></c-docpre>


        
      </c-col>

      <c-col :span="12">
        <c-row>
          <c-col :span="24">
            <el-form-item label="" prop="bddgrp.blk.docdisflg">
                <c-checkbox v-model="docdisflg" @change="changed" disabled>录入不符点</c-checkbox>
            </el-form-item>
          </c-col>
        </c-row>
      </c-col>
    </c-row>
  </div>
</template>
<script>
import Api from "~/service/Api";
import commonProcess from "~/mixin/commonProcess";
import CodeTable from "~/config/CodeTable";
import Utils from "~/utils";
import Event from "~/model/Bdtdcr/Event";
import Docpre from "~/views/Public/Docpre";

export default {
   components: {
    "c-docpre": Docpre,
  },
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [commonProcess],
  data() {
    return {
      TableValue: [
        {
          id: 0,
          cmail1: "",
          cmail2: "",
          docnam: "",
          description: "",
          serialNum: "",
          tableName: "",
        },
      ],
      newValue: {
        id: 0,
        cmail1: "",
        cmail2: "",
        docnam: "",
        description: "",
        serialNum: "",
        tableName: "",
      },
      codeTable: [
        { label: "增值税发票", value: "1" },
        { label: "发票", value: "2" },
        { label: "装箱单", value: "3" },
        { label: "空运单", value: "4" },
        { label: "海运提单", value: "5" },
        { label: "铁路运单", value: "6" },
        { label: "货物收据", value: "7" },
        { label: "邮政收据", value: "8" },
      ],
      // columns: [
      //   '0 0 "lst1" 155',
      //   '1 1 "lst2" 155',
      //   '2 2 "document" 452'
      //   ],
    };
  },
  methods: {
    ...Event,
    addTableValue(index) {
      var newTableValue = Object.assign({}, this.newValue);
      const serial = Utils.generateUUID();
      newTableValue.serialNum = serial;
      this.model.bdtp.docgrdm.docgrd.splice(index - 1, 0, newTableValue);
      // var index = this.TableValue.length;
      // var newTableValue = this.newValue;
      // if (index > 0) {
      //   newTableValue.id = this.TableValue[index - 1].id + 1;
      // }
      // this.TableValue.push(newTableValue);
    },
    deleteTable(index) {
      this.model.bdtp.docgrdm.docgrd.splice(index, 1);
      // for (let i = 0; i < this.TableValue.length; i++) {
      //   if (this.TableValue[i].id == row.id) {
      //     this.TableValue.splice(i, 1);
      //     break;
      //   }
      // }
    },
    changed(e) {
      if (!e) {
        this.model.bddgrp.blk.docdis = "";
      }
    },
  },
  created: function () { },

  computed: {

    docdisflg: {
      get() {
        
        return this.model.advdisflg === "X" || this.model.advrefflg ==="X" ? true : false;
      },
      set(val) {
        this.model.bddgrp.blk.docdisflg = val ? "X" : "";
      },
    }

  }
};
</script>
<style>
.c-checkbox {
  text-align: center;
  margin: 10px;
  font-size: 16px;
}

.messageLabel>>>.el-form-item__label {
  text-align: left;
  font-weight: bold;
  font-size: 12px;
}
</style>