InftrnpsDetail.vue

<template>
<div class="eContainer">
  <c-page title="">
    <!-- <div class="eContainer"> -->
    <c-content :height="120">
      <div class="eibs-tab">
        <el-form
          :model="model"
          ref="modelForm"
          tokenKey="modelForm"
          :validate-on-rule-change="false"
          label-width="150px"
          size="small"
        >
          <c-content>
            <!-- <c-col :span="24" style="margin:0 0 5px 0"> -->
            <c-col :span="12" style="height: 24px">
              <el-form-item label="基本信息" class="messageLabel">
              </el-form-item>
            </c-col>
            <c-col :span="11" style="text-align: right">
              <c-button
                size="small"
                type="primary"
                style="margin-left: 0"
                @click="display(model.trn.inr)"
                >交易快照</c-button
              >
              <c-button size="small" type="primary" style="margin-left: 0"
                >智能提示</c-button
              >
              <c-button
                size="small"
                @click="exit"
                type="primary"
                style="margin-left: 0"
                >返回</c-button
              >
            </c-col>
            <!-- </c-col> -->
            <c-col :span="24" style="height: 10px; margin-bottom: 10px">
              <el-divider></el-divider>
            </c-col>

            <!-- -------------------基础信息------------------- -->

                        <!-- ========================= Left ========================= -->
                        <c-col :span="11"> 
                            <c-col :span="24">
                                <c-col :span="22">
                                    <el-form-item label="业务编号">
                                        <c-input  v-model="model.trn.ownref" maxlength="16" disabled  placeholder="请输入业务编号"></c-input>
                                    </el-form-item>
                                </c-col>             
                                <c-col :span="2" style="text-align: right">
                                    <c-button
                                        style="margin:0;padding: 0 14px;"
                                        size="small"
                                        type="primary"
                                    >
                                    <i class="el-icon-info" style="font-size:15px"></i>
                                    </c-button>
                                </c-col>
                            </c-col>

                            <c-col :span="24">
                                <c-col :span="22">
                                    <el-form-item label="交易代码">
                                        <c-input  v-model="model.recpan.atp.cod" maxlength="6" disabled placeholder="请输入交易代码"></c-input>
                                    </el-form-item>
                                </c-col> 
                                <c-col :span="2" style="text-align: right">
                                    <c-button
                                        style="margin:0;padding: 0 14px;"
                                        size="small"
                                        type="primary"
                                    >
                                    <i class="el-icon-info" style="font-size:15px"></i>
                                    </c-button>
                                </c-col>
                            </c-col>

              <c-col :span="24">
                <c-col :span="13">
                  <el-form-item label="相关金额">
                    <c-input
                      v-model="model.trn.reloricur"
                      maxlength="3"
                      disabled
                      placeholder="请输入"
                    ></c-input>
                  </el-form-item>
                </c-col>
                <c-col :span="11">
                  <el-form-item label="" label-width="8px">
                    <c-input
                      v-model="model.trn.reloriamt"
                      disabled
                      placeholder="请输入"
                    ></c-input>
                  </el-form-item>
                </c-col>
              </c-col>

              <c-col :span="24">
                <c-col :span="13">
                  <el-form-item label="经办柜员">
                    <c-input
                      v-model="model.trn.usr"
                      maxlength="8"
                      disabled
                      placeholder="请输入经办柜员"
                    ></c-input>
                  </el-form-item>
                </c-col>

                <c-col :span="11">
                  <el-form-item label-width="40%" label="责任小组">
                    <!-- <c-input  v-model="model.trn.usg" maxlength="6" disabled  placeholder="请输入责任小组"></c-input> -->
                    <el-select
                      v-model="model.trn.usg"
                      style="width: 100%"
                      disabled
                    >
                      <el-option
                        v-for="item in codes.usgtxt"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      />
                    </el-select>
                  </el-form-item>
                </c-col>
              </c-col>

              <c-col :span="24">
                <c-col :span="24">
                  <el-form-item label="根据识别号">
                    <c-input
                      v-model="model.trn.cortrninr"
                      maxlength="8"
                      disabled
                      placeholder="请输入根据识别号"
                    ></c-input>
                  </el-form-item>
                </c-col>

                <c-col :span="24">
                  <el-form-item label="执行日期">
                    <c-date-picker
                      type="date"
                      v-model="model.trn.exedat"
                      style="width: 100%"
                      disabled
                      placeholder="请选择执行日期"
                    ></c-date-picker>
                  </el-form-item>
                </c-col>
              </c-col>

              <c-col :span="24">
                <c-col :span="22">
                  <el-form-item label="信息文本">
                    <c-input
                      type="textarea"
                      v-model="model.trn.inftxt"
                      maxlength="65"
                      :rows="3"
                      show-word-limit
                      placeholder="请输入信息文本"
                    ></c-input>
                  </el-form-item>
                </c-col>
                <c-col :span="2" style="text-align: right">
                  <c-button
                    style="margin: 0; padding: 0 12px"
                    size="small"
                    icon="el-icon-search"
                    type="primary"
                  ></c-button>
                </c-col>
              </c-col>
            </c-col>

                        <!-- ========================= Right ========================= -->
                        <c-col :span="11" :offset="1">
                            <c-col :span="24">
                                    <c-col :span="22">
                                <el-form-item label="TRN主键">
                                        <c-input  v-model="model.trn.inr" disabled placeholder="请输入TRN主键"></c-input>
                                </el-form-item>
                                    </c-col>
                                    <c-col :span="2" style="text-align: right">
                                        <c-button
                                            style="margin:0;padding: 0 14px;"
                                            size="small"
                                            type="primary"
                                        >
                                        <i class="el-icon-info" style="font-size:15px"></i>
                                        </c-button>
                                    </c-col>
                            </c-col>

              <c-col :span="24">
                <el-form-item label="交易代码">
                  <c-input
                    v-model="this.atptxt"
                    maxlength="6"
                    disabled
                    placeholder="请输入交易代码"
                  ></c-input>
                </el-form-item>
              </c-col>

              <c-col :span="24">
                <el-form-item label="摘要信息">
                  <c-input
                    v-model="model.trn.objnam"
                    maxlength="40"
                    disabled
                    placeholder="请输入"
                  ></c-input>
                </el-form-item>
              </c-col>

              <c-col :span="24">
                <el-form-item label="发布状态">
                  <el-select
                    v-model="model.trn.relflg"
                    style="width: 100%"
                    disabled
                  >
                    <el-option
                      v-for="item in codes.relstaEN"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    />
                  </el-select>
                </el-form-item>
              </c-col>

              <c-col :span="24">
                <c-col :span="24">
                  <el-form-item label="经办柜员">
                    <c-input
                      v-model="model.recpan.cretrs.usr"
                      maxlength="8"
                      disabled
                      placeholder="请输入经办人"
                    ></c-input>
                  </el-form-item>
                </c-col>

                <c-col :span="24">
                  <el-form-item label="时间戳">
                    <c-input
                      v-model="model.recpan.cretrs.dattim"
                      disabled
                      placeholder="请输入时间戳"
                    ></c-input>
                  </el-form-item>
                </c-col>
              </c-col>

              <c-col :span="24">
                <el-form-item label="信息标志">
                  <el-select v-model="model.trn.infdsp" style="width: 100%">
                    <el-option
                      v-for="item in codes.infdsp"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    />
                  </el-select>
                </el-form-item>
              </c-col>

              <c-col :span="24">
                <el-form-item label="发送退回至">
                  <c-input
                    v-model="model.recpan.usr.extkey"
                    disabled
                    style="width: 100%"
                    placeholder=""
                  >
                  </c-input>
                </el-form-item>
              </c-col>
            </c-col>

            <!-- -------------------document------------------- -->
            <c-col :span="24" style="height: 24px">
              <el-form-item label="面函/报文" class="messageLabel">
              </el-form-item>
            </c-col>
            <c-col :span="24" style="height: 0px; margin-top: -5px">
              <el-divider></el-divider>
            </c-col>
            <c-col :span="24">
              <c-istream-table
                :list="documentsData.data"
                :columns="documentsData.columns"
              >
                <el-table-column label="介质" width="110px">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="'trnmod.trndoc.doceot.' + scope.$index + '.cortyp'"
                    >
                      <c-select
                        v-model="scope.row.cortyp"
                        style="width: 100%"
                        disabled
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="item in codes.doceotCortyp"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        >
                        </el-option>
                      </c-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="报文格式" width="150px">
                  <template slot-scope="scope">
                    <c-select
                      v-model="scope.row.docsnf"
                      style="width: 100%"
                      placeholder="请选择"
                      @change="executeDefault('trnmod.trndoc.doccur.docsnf')"
                    >
                      <el-option
                        v-for="item in codes.docsnf"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </c-select>
                  </template>
                </el-table-column>
                <el-table-column label="语言" width="150px">
                  <template slot-scope="scope">
                    <c-select
                      v-model="scope.row.docuil"
                      style="width: 100%"
                      placeholder="请选择"
                    >
                      <el-option
                        v-for="item in codes.uiltxt"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </c-select>
                  </template>
                </el-table-column>
                <el-table-column label="传送方式" width="110px">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="'trnmod.trndoc.doceot.' + scope.$index + '.apf'"
                    >
                      <c-select
                        v-model="scope.row.apf"
                        disabled
                        style="width: 100%"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="item in codes.apftxt"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        >
                        </el-option>
                      </c-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="发送份数" width="70">
                  <template slot-scope="scope">
                    <c-input
                      v-model="scope.row.apfcpy1"
                      :readonly="true"
                      style="width: 100%"
                      placeholder="请选择"
                    >
                    </c-input>
                  </template>
                </el-table-column>
                <el-table-column label="抄送份数" width="70">
                  <template slot-scope="scope">
                    <c-input
                      v-model="scope.row.apfcpy2"
                      style="width: 100%"
                      placeholder="请选择"
                    >
                    </c-input>
                  </template>
                </el-table-column>
                <el-table-column label="" width="110px">
                  <template slot-scope="scope">
                    <el-form-item
                      label-width="0"
                      :prop="'trnmod.trndoc.doceot.' + scope.$index + '.staflg'"
                    >
                      <c-select
                        v-model="scope.row.staflg"
                        style="width: 100%"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="item in codes.swttlx"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        >
                        </el-option>
                      </c-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="操作" width="200px" fixed="right">
                  <template slot-scope="scope">
                    <c-button
                      type="primary"
                      size="small"
                      :disabled="
                        (scope.row.pandsc == 'MT799' &&
                          model.didgrp &&
                          model.didgrp.rec &&
                          model.didgrp.rec.elcflg == 'Y') ||
                        suppress
                      "
                      @click="show(scope.$index, scope.row)"
                      style="margin-right: 10px"
                      >预览</c-button
                    >
                    <c-button
                      size="small"
                      type="primary"
                      style="margin-left: 0"
                      @click="handleDetail(scope.row.index, scope.row)"
                      >详情</c-button
                    >
                  </template>
                </el-table-column>
              </c-istream-table>
            </c-col>

            <c-col :span="24" style="height: 24px; margin-top: 20px">
              <el-form-item label="经办/复核" class="messageLabel">
              </el-form-item>
            </c-col>
            <c-col :span="24" style="height: 0px; margin-top: -5px">
              <el-divider></el-divider>
            </c-col>
            <c-col :span="24">
              <!-- <c-input  v-model="model.recpan.trsstm"  placeholder="请输入Signatures"></c-input> -->
              <c-col :span="24" :offset="0">
                <c-istream-table
                  :list="SignaturesData.data"
                  :columns="SignaturesData.columns"
                  :paginationShow="false"
                  style="width: 100%"
                >
                  <el-table-column label="行为" width="auto">
                    <template slot-scope="scope">
                      <span>{{ flg[scope.row.IDX] }}</span>
                    </template>
                  </el-table-column>
                </c-istream-table>
              </c-col>
            </c-col>

            <!-- -------------------workflow------------------- -->
            <c-col :span="24" style="height: 24px; margin-top: 20px">
              <el-form-item label="工作流服务" class="messageLabel">
              </el-form-item>
            </c-col>
            <c-col :span="24" style="height: 0px; margin-top: -5px">
              <el-divider></el-divider>
            </c-col>
            <c-col :span="24">
              <c-col :span="24" :offset="0">
                <c-istream-table
                  :list="stmData.data"
                  :columns="stmData.columns"
                  :paginationShow="false"
                  style="width: 100%"
                >
                </c-istream-table>
              </c-col>
            </c-col>
          </c-content>
        </el-form>
      </div>
      <!-- </div> -->
    </c-content>
  </c-page>
  </div>
</template>

<script>
import Trnrel from "~/model/Trnrel";
import Api from "~/service/Api";
import commonProcess from "~/mixin/commonProcess";
import CodeTable from "~/config/CodeTable";
import Event from "~/model/Trnrel/Event";
import DocUtils from "~/utils/DocUtils";

export default {
  name: "InftrnpsDetail",
  mixins: [commonProcess],
  data() {
    return {
      model: new Trnrel().data,
      documentsData: {
        columns: [
          // "1 1 \"类型\" 300 1 0:0 1 CORTYP",
          // "2 2 \"外部密钥\" 300",
          // "3 3 \"文档\" auto",
          '1 4 "收报人" 90',
          '2 5 "描述" 200',
        ],
        data: [],
      },
      SignaturesData: {
        columns: [
          '1 2:1 "用户" 300',
          // '2 3:1 "Date / Time" 300',
          {
            index: 2,
            position: 3,
            width: 300,
            pattern: "time",
            label: "日期/时间",
          },
          // '3 5:1 "Action" 400',
          '4 1:1 "类型" 300',
        ],
        data: [],
      },
      codes: {
        infdsp: CodeTable.infdsp,
        flg: CodeTable.flg,
        atptxt: CodeTable.atptxt,
        relstaEN: CodeTable.relstaEN,
        usgtxt: CodeTable.usgtxt,
        wfetrssta: CodeTable.wfetrssta,
      },
      stmData: {
        columns: [
          '1 1 "编号" 100',
          '2 2 "服务" 100',
          // '3 3 "交易状态" 100',
          {
            index: 3,
            position: 3,
            width: 100,
            pattern: "code",
            label: "交易状态",
            code: CodeTable.wfetrssta,
          },
          '4 4 "最新更新" 120',
          '5 5 "重试" 100',
          '6 6 "文本" 200',
          '7 7 "相反文本" 200',
          // '8 8 "Target Time" auto'
          {
            index: 8,
            position: 8,
            width: "auto",
            pattern: "dateFormat",
            label: "目标时间",
          },
        ],
        data: [],
      },
      flg: [],
      atptxt: "",
      relstaEN: "",
      usgtxt: "",
    };
  },
  mounted() {
    this.loadData();
  },
  methods: {
    ...Event,
    async handleDetail(index, row) {
      const params = {
        index: row.idx,
      };
      let rtnmsg = await Api.post(
        `${this.requestPrefix}/executeDocpanDetail`,
        this.wrapper(params)
      );
      if (rtnmsg.respCode == SUCCESS) {
        this.title = row.pandsc;
        (this.centerDialogVisible = true), this.updateModel(rtnmsg.data);
        this.dialog = this.model.trnmod.trndoc.doceot[row.idx];
        this.index = row.idx;
      }
    },
    loadData() {
      // const { data } = this.$route.query
      this.model = JSON.parse(sessionStorage.getItem("InftrnpsDetail"));
      this.documentsData.data = this.model.recpan.smhstm.rows;
      this.SignaturesData.data = this.model.recpan.trsstm.rows;
      this.stmData.data = this.model.recpan.wfestm.rows;
      this.flg = this.ArrCalCode(this.SignaturesData.data, this.codes.flg, 3);
      this.atptxt = this.strCalCode(
        this.model.recpan.atp.cod,
        this.codes.atptxt
      );
      this.relstaEN = this.strCalCode(
        this.model.trn.relflg,
        this.codes.relstaEN
      );
      this.usgtxt = this.strCalCode(this.model.trn.usg, this.codes.usgtxt);
    },
    strCalCode(str, code) {
      var result = "";
      for (let i = 0; i < code.length; i++) {
        if (code[i].value === code) {
          result = code[i].label;
          continue;
        }
      }
      if (result === "") {
        return str;
      } else {
        return result;
      }
    },
    ArrCalCode(table, code, index) {
      var result = [];
      for (let i = 0; i < table.length; i++) {
        const d = table[i];
        const items = d.split("\t");
        result[i] = items[index];
        for (let j = 0; j < code.length; j++) {
          if (code[j].value === result[i]) {
            result[i] = code[j].label;
            continue;
          }
        }
      }
      return result;
    },
    exit() {
      this.$store.dispatch("TagsView/delView", this.$route);
      this.$router.history.push("/taskList");
    },
    async show(idx, row) {
      var params = {
        selDst: "recpan.smhstm",
        selIds: [idx + 1],
        selBtnId: "A",
      };
      let rtnmsg = await Api.post(
        `/business/trnrel/executeRule/recpan.smhstm`,
        this.wrapper(params)
      );
      if (rtnmsg.respCode == SUCCESS) {
        this.title = "面函";
        let viewurl = "/#/docpan/show";
        let XMLdata;
        if (row.类型 == "LET") {
          window.sessionStorage.docTXT = "";
          window.sessionStorage.docXML = rtnmsg.data.docimm_xmldocblk;
        } else if (row.pandsc == "MT799") {
          window.sessionStorage.docTXT = "";
          XMLdata = rtnmsg.data.litbenl1blk;
        }
        window.open(
          viewurl,
          "newwindow",
          "height=1200,width=800,top=100,left=100,toolbar=no,resizable=no,menubar=no,location=no, status=no"
        );
      } else {
        const h = this.$createElement;
        const msg = rtnmsg.respMsg || "请求执行失败!";
        this.$notify.error({
          title: "错误",
          message: h("p", { style: "word-break:break-all;" }, msg),
        });
      }
    },
  },
};
</script>
<style scoped>
.el-col >>> .el-divider--horizontal {
  margin-top: 10px;
}
.formItemLabel >>> .el-form-item__label {
  text-align: left;
  font-weight: bold;
}
.el-col >>> .el-divider--horizontal {
  margin-top: 5px;
}
.messageLabel >>> .el-form-item__label {
  text-align: left;
  font-weight: bold;
  font-size: 15px;
  color:#1561E0;
  width: auto!important;
}
</style>