Docs.vue

<template>
  <div class="eibs-tab">
    <c-col :span="12" style="padding-right: 20px">
      <c-col :span="24">
        <el-form-item label="Documents Required" prop="lidgrp.blk.lcrdoc">
          <c-fullbox>
            <c-input
              type="textarea"
              maxlength="52000"
              v-model="model.lidgrp.blk.lcrdoc"
              :rows="20"
              show-word-limit
              placeholder="请输入单据要求"
              disabled></c-input>
          </c-fullbox>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <c-ptap-commons
          :cols="65"
          :rows="800"
          :minRows="12"
          :maxRows="12"
          :model="model"
          :disabledButton="true"
          :extCodes="['litamep', 'lcrdocamep']"
          lastModel="lcrdoc"
          title="Adding/Deleting Text in Current Amendment">
        </c-ptap-commons>
      </c-col>
    </c-col>
    <!-- 右边 -->
    <c-col :span="12" style="padding-left: 20px">
      <c-col :span="24">
        <el-form-item label="Historic Overview" prop="lidgrp.blk.lcrdocame">
          <c-fullbox>
            <c-input
              disabled
              type="textarea"
              maxlength="52000"
              v-model="model.lidgrp.blk.lcrdocame"
              :rows="20"
              show-word-limit
              placeholder="历史修改信息"></c-input>
          </c-fullbox>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <c-col :span="24" class="">
          <el-form-item label=" " prop="litamep.lcrdocamep.modflg" label-width="180px" style="float: left">
            <c-checkbox
              v-model="model.litamep.lcrdocamep.modflg"
              class="checkbox-left"
              true-label="X"
              false-label=""
              disabled
              @change="onModflgChange"
              >Modify Text to Replace</c-checkbox
            >
          </el-form-item>
        </c-col>
        <c-col :span="24" class="">
          <el-form-item label=" " prop="litamep.lcrdocamep.modmanflg" label-width="180px" style="float: left">
            <c-checkbox
              v-model="model.litamep.lcrdocamep.modmanflg"
              class="checkbox-left"
              true-label="X"
              false-label=""
              disabled
              @change="onModmanflgChange"
              >Modify Text Internally</c-checkbox
            >
          </el-form-item>
        </c-col>
      </c-col>
      <c-col :span="24">
        <el-form-item label-width="180px" style="float: left">
          <c-button type="primary" disabled> Show Diff </c-button>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label-width="180px" style="float: left">
          <c-button type="primary" @click="onAddClick" disabled> Add </c-button>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label-width="180px" style="float: left">
          <c-button type="primary" @click="onDeleteClick" disabled> Delete </c-button>
        </el-form-item>
      </c-col>
    </c-col>
  </div>
</template>
<script>
import event from "../event";
export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [event],
  data() {
    return {
      isLcrdocDisabled: true,
      isUsrblkDisabled: false,
      originalLcrdoc: "",
    };
  },
  methods: {
    onAddClick() {
      if (this.model.litamep.lcrdocamep.usrblk != null && this.model.litamep.lcrdocamep.usrblk != "") {
        this.model.lidgrp.blk.lcrdoc =
          this.model.lidgrp.blk.lcrdoc + "\n" + this.model.litamep.lcrdocamep.usrblk + "\n";
        this.model.litamep.lcrdocamep.usrblk = "";
      }
    },
    onDeleteClick() {
      if (this.model.lidgrp.blk.lcrdoc != null && this.model.lidgrp.blk.lcrdoc != "") {
        let lcrdoc = this.model.lidgrp.blk.lcrdoc;
        let usrblk = this.model.litamep.lcrdocamep.usrblk + "\n";
        this.model.lidgrp.blk.lcrdoc = lcrdoc.replaceAll(usrblk, "");
        this.model.litamep.lcrdocamep.usrblk = "";
      }
    },
    onModflgChange() {
      if (this.model.litamep.lcrdocamep.modflg == "X") {
        this.isLcrdocDisabled = false;
        this.isUsrblkDisabled = true;
        this.model.litamep.lcrdocamep.usrblk = "";
        this.model.lidgrp.blk.lcrdoc = this.originalLcrdoc;
      } else {
        this.isLcrdocDisabled = true;
        this.isUsrblkDisabled = false;
      }
    },
    onModmanflgChange() {
      if (this.model.litamep.lcrdocamep.modmanflg == "X") {
        this.isLcrdocDisabled = false;
        this.isUsrblkDisabled = true;
        this.model.litamep.lcrdocamep.usrblk = "";
      } else {
        this.isLcrdocDisabled = true;
        this.isUsrblkDisabled = false;
      }
    },
  },
};
</script>
<style></style>