SwiftDialog.vue

<template>
	<el-dialog v-dialogDrag :close="close" :title="title" :visible.sync="centerDialogVisible" center destroy-on-close :model-append-to-body="true" width="60%" v-if="centerDialogVisible">
		<el-form :disabled="suppress" :model="dialog" :rules="formRules" label-width="120px" ref="form">
			<el-row>
        <c-col :span="12">
          <c-col :span="24">
            <c-ptap :argadr="{ title: 'Send Message to', grp: 'xxxgrp', rol: 'rcv' }"
              :isFieldLabelVisible="true"
              :isAdrblk="true" :disabled="true"
              :model="dialog" ptytyp="B" 
              :requiredExtkey="true"
              @clear="handleChangeRcv"
              @handleChange="handleChangeRcv">
            </c-ptap>
          </c-col>
        </c-col>
        <c-col :span="12" style="padding-left: 20px">
            <c-col :span="24">
              <el-form-item label="Addressing" prop="adrbic">
                <c-input v-model="dialog.adrbic" disabled />
              </el-form-item>
            </c-col>
            <c-col :span="24">
              <el-form-item label="Authentication" prop="adrbicaut">
                <c-select v-model="dialog.adrbicaut" dbCode="autflg" disabled>
							  </c-select>
              </el-form-item>
            </c-col>
        </c-col>  
			</el-row>
      <el-row>
        <c-col>
          <el-form-item :label="'Sender to Rec. Information'" prop="addtxt">
            <c-mul-row-input v-if="title === 'MT799'" :autosize="{minRows: 4,	maxRows: 6}" disabled :rows="6" :cols="35" v-model="dialog.addtxt" :charmod="3"/>
            <c-mul-row-input v-else :disabled="dialog.docnam === 'SETSUM1' || dialog.docnam === 'SETSUM3'" :autosize="{minRows: 4,	maxRows: 6}" :rows="6" :cols="35" v-model="dialog.addtxt" :charmod="3"/>
          </el-form-item>

          <el-form-item label="79Z" prop="tag79z" v-if="dialog.usetag79z && dialog.usetag79z.rows.length">
            <c-mul-row-input :rows="35" :cols="50" :autosize="{minRows: 6,	maxRows: 10}" v-model="dialog.tag79z" :charmod="3"/>
          </el-form-item>
				</c-col>
			</el-row>
		</el-form>
		<template #footer>
			<span class="dialog-footer">
				<c-button @click="saveDialog" type="primary" v-if="!isDispaly">确 定</c-button>
				<el-button @click="close">取 消</el-button>
			</span>
		</template>
	</el-dialog>
</template>

<script>
import commonDepend from "~/mixin/commonDepend.js";
import { cloneDeep } from "lodash";
import Api from '~/service/Api';
import commonFunctions from '~/mixin/commonFunctions.js';

export default {
  inject: ["root"],
  mixins: [commonDepend, commonFunctions],
  props: {
    docpanDialog: {
      type: Object,
      default: {}
    }
  },
  computed: {
    isDispaly() {
      return this.$store.state.Status.mode === "display";
    }
  },
  data() {
    return {
      dialog: {
        rcv: {
          pts: {},
          ptyinftxt: {}
        }
      },
      title: "详情",
      dialogRcvPtyinftxtRows: [],
      suppress: false,
      centerDialogVisible: false,
      formRules: {
        addtxt: [
          { validator: this.validateSpecialChars, trigger: "blur" },
          { validator: this.validateChineseChars, trigger: "blur" }
        ],
        adrbicaut:[
          { validator: this.validateAdrbicaut, trigger: ["blur", "change"] }
        ],
        adrbic: [{ required: true, message: "必填" }],
      }
    };
  },
  methods: {
    //初始化传值
    init() {
      this.dialog = this.docpanDialog;
      this.dialog.xxxgrp = {
        rcv : this.docpanDialog.rcv
      }
    },
    //确定
    saveDialog() {
      this.$refs.form.validate(valid => {
        if (valid) {
          if (this.dialog.adrbicaut === 'C') {
            let txt = "收报行"+this.dialog.adrbic+"与我行未建立密押关系，将生成MT999报文，是否确定此操作？";
            this.$confirm(txt, '提示', {
              confirmButtonText: '是',
              cancelButtonText: '否',
              type: 'warning',
              showClose: false
            }).then(() => { //yes的执行在这里写
              this.close();
              this.dialog.addstr = this.dialog.addtxt;
              this.$emit("docpanQueryFunc", this.dialog);
            }).catch(() => { //No的功能在这里写
              
            });
          } else {
            this.close();
            this.dialog.addstr = this.dialog.addtxt;
            this.$emit("docpanQueryFunc", this.dialog);
          }
        } else {
          // 表单验证未通过，阻止提交操作并显示错误提示
        }
      });
    },
    //取消
    close() {
      this.centerDialogVisible = false;
    },
    async handleChangeRcv(){
      this.dialog.rcv = cloneDeep(this.dialog.xxxgrp.rcv);
      let ptainr = this.dialog.xxxgrp.rcv.pts.ptainr;
      if (ptainr !== '') {
        this.dialog.ptainr = ptainr;
        const loading = this.loading('正在获取发报行的密押关系')
        let rtnmsg = await Api.post(`/${this.moduleRouter()}/codetable/getSwtinfo`, ptainr);
        if (rtnmsg.respCode == SUCCESS) {
           this.dialog.adrbic = rtnmsg.data['adrbic'];
           this.dialog.adrbicaut = rtnmsg.data['adrbicaut'];
        }
        loading.close();
      } else {
        this.dialog.adrbic = '';
        this.dialog.adrbicaut = '';
      }
    },
    validateAdrbicaut(rule, value, cb) {
      if (value !== 'C' && value !== 'A') {
        cb(new Error("无效的密押标识，请重新选择收报行"));
      }
      cb()
    }
  }
};
</script>
<style lang="less" scoped>
.dialog-wrap {
  height: 400px;
  overflow: auto;
}

.el-dialog__header {
  height: 36px;

  .el-dialog__headerbtn {
    top: 10px;
  }
}

.dialog-footer {
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 10px 0;
  display: flex;
  justify-content: center;
}
</style>