<template>
<div class="eContainer">
  <c-page title="">
    <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-col :span="21" style="height:24px">
          <el-form-item label="基本信息" class="messageLabel">
          </el-form-item>
        </c-col>
        <c-col :span="2" style="text-align:right">
         <c-button type="primary" size="small" @click="exit">返回</c-button>
       </c-col>
        <c-col :span="24" style="height: 10px">
          <el-divider></el-divider>
        </c-col>
        <c-col :span="11">
          <el-form-item label="类型" prop="spt.sta" style="width: 100%">
            <c-select
              v-model="model.spt.sta"
              style="width: 100%"
              placeholder="请选择类型"
              disabled
            >
            </c-select>
          </el-form-item>
        </c-col>
        <c-col :span="11" :offset="1">
          <el-form-item label="交易状态" prop="spt.hldflg" style="width: 100%">
            <c-select
              v-model="model.spt.hldflg"
              style="width: 100%"
              placeholder="请选择交易状态"
              :code="codes.hldflg"
              disabled
            >
            </c-select>
          </el-form-item>
        </c-col>
        <c-col :span="11">
          <el-form-item label="业务编号" prop="spt.objnam" style="width: 100%">
            <c-input
              v-model="model.spt.objnam"
              maxlength="40"
              style="width: 100%"
              placeholder="请输入业务编号"
              disabled
            ></c-input>
          </el-form-item>
        </c-col>
        <c-col :span="11" :offset="1">
          <el-form-item label="SPT主键" prop="spt.inr" style="width: 100%">
            <c-input
              v-model="model.spt.inr"
              maxlength="8"
              style="width: 100%"
              placeholder=""
              disabled
            ></c-input>
          </el-form-item>
        </c-col>
          <c-col :span="11">
            <el-form-item label="交易关键字名称" prop="spt.txt" style="width: 100%">
              <c-input
                v-model="model.spt.txt"
                maxlength="40"
                style="width: 100%"
                placeholder="请输入交易关键字名称"
                disabled
              ></c-input>
            </el-form-item>
          </c-col>
          <c-col :span="11" :offset="1">
            <c-col :span="13">
              <el-form-item label="交易" prop="spt.frm">
                <c-input
                  v-model="model.spt.frm"
                  maxlength="6"
                  style="width: 95%"
                  placeholder="请输入交易"
                  disabled
                ></c-input>
              </el-form-item>
            </c-col>
            <c-col :span="11">
              <el-form-item label="" prop="spt.frm" label-width="0">
                <c-select
                  v-model="model.spt.frm"
                  maxlength="16"
                  placeholder="请输入交易"
                  :code="codes.frm"
                  style="width:100%"
                  disabled
                ></c-select>
              </el-form-item>
            </c-col>
          </c-col>
        <c-col :span="11">
          <el-form-item label="客户经理代码" prop="spt.ownusr">
            <c-input
              v-model="model.spt.ownusr"
              maxlength="8"
              placeholder="请输入客户经理代码 "
              disabled
            ></c-input>
          </el-form-item>
        </c-col>
        <c-col :span="11" :offset="1">
          <el-form-item label="责任小组" prop="spt.ownusg">
            <c-select
              v-model="model.spt.ownusg"
              style="width: 100%"
              placeholder="请选择责任小组"
              disabled
            >
            </c-select>
          </el-form-item>
        </c-col>

        <c-col :span="11">
          <c-col :span="19">
            <el-form-item label="信息文本" prop="spt.inftxt">
              <c-input
                type="textarea"
                v-model="model.spt.inftxt"
                maxlength="65"
                style="width: 100%"
                show-word-limit
                placeholder="请输入信息文本"
                disabled
              ></c-input>
            </el-form-item>
          </c-col>
          <c-col :span="5">
            <el-form-item label="" prop="spt.infdsp" label-width="5px">
              <c-select
                v-model="model.spt.infdsp"
                style="width: 100%; padding-left: 0px"
                placeholder="请选择信息文本"
                :code="codes.infdsp"
                disabled
              >
              </c-select>
            </el-form-item>
          </c-col>
        </c-col>
        <c-col :span="11" :offset="1">
          <c-col :span="10">
            <el-form-item label="经办柜员" prop="spt.usr">
              <c-input
                v-model="model.spt.usr"
                maxlength="8"
                placeholder="请输入经办人"
                disabled
              ></c-input>
            </el-form-item>
          </c-col>
          <c-col :span="7">
            <el-form-item label="在" prop="spt.dattim" label-width="50px">
              <c-input
                v-model="model.spt.dattim"
                placeholder="请输入创建时间"
                disabled
              ></c-input>
            </el-form-item>
          </c-col>
          <c-col :span="7">
            <el-form-item label="创建交易" prop="spt.cretrn" label-width="70px">
              <c-input
                v-model="model.spt.cretrn"
                maxlength="6"
                placeholder="请输入创建交易码"
                disabled
              ></c-input>
            </el-form-item>
          </c-col>
        </c-col>
        <c-col :span="24">
          <c-col :span="11">
            <el-form-item label="完成目标" prop="spt.tardattim">
              <c-input
                v-model="model.spt.tardattim"
                placeholder="请输入完成目标"
                disabled
              ></c-input>
            </el-form-item>
          </c-col>
        </c-col>
         <c-col :span="24" style="height:24px;margin-top:8px">
          <el-form-item label="报文信息" class="messageLabel">
          </el-form-item>
        </c-col>
        <c-col :span="24" style="height: 0px">
          <el-divider></el-divider>
        </c-col>
        <c-col :span="24" style="">
          <!-- <el-form-item label-width="500px"> -->
          <el-table :paginationShow="false" :border="true" :data="msgInfoTableData">
            <el-table-column
              label="编号"
              prop="groseq"
              width="auto"
            ></el-table-column>
            <el-table-column
              label="消息类型"
              prop="cortyp"
              width="auto"
            ></el-table-column>
            <el-table-column
              label="消息引用"
              prop="nam"
              width="150px"
            ></el-table-column>
            <el-table-column
              label="用户"
              prop="creusr"
              width="auto"
            ></el-table-column>
            <el-table-column
              label="长度"
              prop="msglen"
              width="auto"
            ></el-table-column>
            <el-table-column
              label="文件名"
              prop="docfil"
              width="auto"
            ></el-table-column>
            <el-table-column
              label="文件扩展名"
              prop="docfxt"
              width="100"
            ></el-table-column>
            <el-table-column
              label="DB-INR"
              prop="inr"
              width="auto"
            ></el-table-column>
            <el-table-column
              label="创建交易"
              prop="crefrm"
              width="auto"
            ></el-table-column>
            <el-table-column
              label="创建时间"
              prop="credattim"
              width="120px"
            ></el-table-column>
            <el-table-column
              label="PARTFLG"
              prop=""
              width="partflg"
            ></el-table-column>
            <el-table-column
              label="报文类型"
              prop="msgtyp"
              width="auto"
            ></el-table-column>
            <el-table-column
              label="复核币种"
              prop="relcur"
              width="auto"
            ></el-table-column>
            <el-table-column
              label="复核金额"
              prop="relamt"
              width="auto"
            ></el-table-column>
            <el-table-column
              label="SYSNO"
              prop="sysno"
              width="auto"
            ></el-table-column>
            <el-table-column
              label="状态"
              width="auto"
            >
            </el-table-column>
            <el-table-column
              label="F20"
              prop="f20"
              width="auto"
            ></el-table-column>
            <el-table-column
              label="STP"
              prop="spt"
              width="auto"
            ></el-table-column>
          </el-table>
          <!-- </el-form-item> -->
        </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">
          <el-divider></el-divider>
        </c-col>
        <c-col :span="24" style="">
          <el-table
            :data="stmData.data"
            :columns="stmData.columns"
            :showButtonFlg="true"
          >
            <el-table-column
              v-for="(item, key) in stmData.columns"
              :key="key"
              :label="item.label"
              :prop="item.prop"
            >
              <template slot-scope="scope">
                <div v-if="item.prop === 'typ'">
                  <div v-if="scope.row[item.prop]"> {{ transactionCode(scope.row) }}</div>
                </div>
                <div v-else>{{ scope.row[item.prop] }}</div>
              </template>
            </el-table-column>
          </el-table>
        </c-col>
      </el-form>
    </div>
    </c-content>
  </c-page>
  </div>
</template>
<script>
import Sptsel from "../model/sptpopup.js";
import event from '../event';
import CodeTable from "~/config/CodeTable";
import Api from '~/service/Api';
export default {
  mixins: [event],
  data() {
    return {
      model: new Sptsel().data,
      codes:{ hldflg: CodeTable.hldflg ,...CodeTable},
      trnName:"sptsel",
      msgInfoTableData: [],
      stmData:{
        columns: [
        {
            label: '开始时间',
            prop: 'begdattim'
          },
          {
            label: '类型',
            prop: 'typ'
          },
          {
            label: '用户',
            prop: 'USR'
          },
          {
            label: '交易代码',
            prop: 'FRM'
          },
          {
            label: '结束时间',
            prop: 'ENDDATTIM'
          },
          {
            label: '文本',
            prop: 'ROUTXT'
          },
        ],
        data:[],
      },
    };
  },
  mounted() {
    this.loadData();
  },
  methods: {
    transactionCode(row){
      const TYP = row.typ;
      let typ = '';
      switch(TYP) {
        case 'CRE':
          typ = '订单等待'
          break;
        case 'TRN':
          typ = '等待'
          break;
        case 'COR':
          typ = '修改'
        break;  
        case 'DEL':
          typ = '删除'
        break;  
        case 'FIN':
          typ = '确认'
        break;  
        case 'CAN':
          typ = '订单取消'
        break;  
        case 'REL':
          typ = '确认'
        break; 
        case 'DES':
          typ = '订单删除'
        break;  
        case 'BRK':
          typ = '暂停'
        break;  
        case 'INC':
          typ = '报文接受'
        break;  
        case 'SPT':
          typ = '订单确认'
        break;  
        case 'SIG':
          typ = '复核'
        break;
        case 'CMB':
          typ = '订单暂停'
        break;   
        case 'CTR':
          typ = '总行退回'
        break;   
        case 'CMR':
          typ = '订单修改'
        break;           
        case 'ROU':
          typ = '重新路由'
        break;      
        default:
          return;
      }
      return typ;
    },
    async loadData() {
      let routeQuery = this.$route.query
      const params = {
        //根据inr 查询详情表的数据
        selsptinr: routeQuery.inr
        // selsptinr: '00006885'
      }
      const res = await Api.post('/service/sptsel/detail', params);
      if (res.respCode === SUCCESS) {
        this.$set(this.model, 'spt', res.data.spt)
        this.msgInfoTableData = [res.data.smh]
        this.stmData.data = res.data.oreList
      }
    },
    exit() {
      this.$store.dispatch("TagsView/delView", this.$route);
      this.$router.history.push("/taskList");
    },
  },
  created: function () {},
};
</script>
<style scoped>
.el-col >>> .el-divider--horizontal {
  margin-top: 5px;
}
.messageLabel >>> .el-form-item__label{
    text-align: left;
    font-weight:bold;
  font-size: 15px;
  color:#B31C2A;
  width: auto!important;
}
</style>