TrnfndsDetail.vue

<template>
    <c-page title="">
        <!-- <div class="eContainer"> -->
            <c-content :height="120">
            <div class="eibs-tab">
                <!-- <c-col :span="23">
                    <div style="float:right;margin-bottom:10px">
                        <el-button size="small">交易快照</el-button>
                        <el-button size="small">智能提示</el-button>
                        <el-button size="small" @click="exit">返回</el-button>
                    </div>
                </c-col> -->
                                       
                <!-- <c-col :span="12">
                    <el-form-item label="Drag  Drop Sender">
                        <c-input  v-model="model.recpan.recget.sdamod.dadsnd"  placeholder="请输入Drag  Drop Sender"></c-input>
                    </el-form-item>
                </c-col>              -->
                
                <el-form
                    :model="model"
                    ref="modelForm"
                    tokenKey="modelForm"
                    :validate-on-rule-change="false"
                    label-width="150px"
                    size="small"
                    >
                    <c-content>

                        <c-col :span="13" style="height:24px">
                            <el-form-item label="基本信息" class="messageLabel">
                            </el-form-item>
                        </c-col>
                        <c-col :span="10" style="text-align:right">
                            <c-button size="small" type="primary" style="margin-left:0" @click="display">交易快照</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 :span="23" 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="Reference">
                                        <c-input  v-model="model.trn.ownref" maxlength="16" disabled  placeholder="请输入Reference"></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"
                                    >
                                    <span style="font-size:15px;font-family:'宋体';font-weight:bold">i</span>
                                    </c-button>
                                </c-col>
                            </c-col>

                            <c-col :span="24">
                                <c-col :span="22">
                                    <el-form-item label="Transaction  ID">
                                        <c-input  v-model="model.recpan.atp.cod" maxlength="6" disabled placeholder="请输入Transaction  ID"></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"
                                    >
                                    <span style="font-size:15px;font-family:'宋体';font-weight:bold">i</span>
                                    </c-button>
                                </c-col>
                            </c-col>

                            <c-col :span="24">
                                <c-col :span="12">
                                    <el-form-item label="Relevant Amount">
                                        <c-input  v-model="model.trn.reloricur" maxlength="3" disabled  placeholder="请输入Relevant Amount"></c-input>
                                    </el-form-item>
                                </c-col>
                                <c-col :span="1">
                                    &nbsp;
                                </c-col>
                                <c-col :span="11">
                                        <c-input  v-model="model.trn.reloriamt" disabled placeholder="请输入Relevant Amount for Release in Original Currency"></c-input>
                                </c-col> 
                            </c-col>      

                            <c-col :span="24">
                                <c-col :span="12">
                                    <el-form-item label="Responsible">
                                        <c-input  v-model="model.trn.usr" maxlength="8" disabled  placeholder="请输入Responsible"></c-input>
                                    </el-form-item>
                                </c-col>             
                                                            
                                <c-col :span="12">
                                    <el-form-item label-width="35%" label="Group">
                                        <!-- <c-input  v-model="model.trn.usg" maxlength="6" disabled  placeholder="请输入Responsible Group"></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="12">
                                    <el-form-item label="Based on Ident No.">
                                        <c-input  v-model="model.trn.cortrninr" maxlength="8" disabled placeholder="请输入Based on Ident No."></c-input>
                                    </el-form-item>
                                </c-col>             
                                                            
                                <c-col :span="12">
                                    <el-form-item label-width="35%" label="Execution Date">
                                        <c-date-picker type="date"  v-model="model.trn.exedat" style="width:100%" disabled placeholder="请选择Execution Date"></c-date-picker>
                                    </el-form-item>
                                </c-col>
                            </c-col>

                            <c-col :span="24">
                                <c-col :span="12">
                                    <el-form-item label="Entered by">
                                        <c-input  v-model="model.recpan.cretrs.usr" maxlength="8" disabled placeholder="请输入Entered by"></c-input>
                                    </el-form-item>
                                </c-col>             
                                                            
                                <c-col :span="12">
                                    <el-form-item label-width="35%" label="Timestamp">
                                        <c-input  v-model="model.recpan.cretrs.dattim" disabled placeholder="请输入Timestamp"></c-input>
                                    </el-form-item>
                                </c-col>  
                            </c-col>

                            <c-col :span="24">
                                <c-col :span="22">
                                    <el-form-item label="Infotext">
                                        <c-input type="textarea" v-model="model.trn.inftxt" maxlength="65" :rows="3" show-word-limit placeholder="请输入Infotext" ></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="Ident No.">
                                        <c-input  v-model="model.trn.inr" disabled placeholder="请输入Ident No."></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"
                                        >
                                        <span style="font-size:15px;font-family:'宋体';font-weight:bold">i</span>
                                        </c-button>
                                    </c-col>
                            </c-col>

                            <c-col :span="24">
                                <el-form-item  label="Transaction  ID">
                                    <el-select v-model="model.recpan.atp.cod" style="width: 100%" disabled>
                                        <el-option
                                            v-for="item in codes.atptxt"
                                            :key="item.value"
                                            :label="item.label"
                                            :value="item.value"
                                        />
                                    </el-select>
                                    <!-- <c-input  v-model="model.recpan.atp.cod" maxlength="6"  placeholder="请输入Transaction  ID"></c-input> -->
                                </el-form-item>
                            </c-col>

                            <c-col :span="24">
                                <el-form-item  label="Drop Receiver">
                                    <c-input  v-model="model.trn.objnam" maxlength="40" disabled placeholder="请输入External Readable Object Identification"></c-input>
                                </el-form-item>
                            </c-col>

                            <c-col :span="24">
                                <el-form-item  label="Release Status">
                                    <!-- <c-input v-model="model.trn.relflg" style="width:100%" disabled placeholder="请选择Release Status of Transaction">
                                    </c-input> -->
                                    <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">
                                <el-form-item  label="Signatures Required/Obtained">
                                <c-row>
                                    <c-col :span="11">
                                        <c-input  v-model="model.trn.relreq" maxlength="3" disabled placeholder="请输入Signatures Required/Obtained"></c-input>
                                    </c-col>
                                    <c-col :span="2">
                                        <span style="margin-left:40%">/</span>
                                    </c-col>
                                    <c-col :span="11">
                                        <c-input  v-model="model.trn.relres" maxlength="3" disabled placeholder="请输入Applied Signatures"></c-input>
                                    </c-col>
                                </c-row>
                                </el-form-item>
                            </c-col>

                            <c-col :span="24">
                                <el-form-item  label="Completion text">
                                    <c-input style="font-weight:bold"  v-model="model.recpan.cpltxt" disabled  placeholder="请输入Based on Ident No."></c-input>
                                </el-form-item>
                            </c-col> -->

                            <c-col :span="24">
                                <el-form-item  label="Infoflag">
                                    <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="Send for Repair to">
                                    <c-input v-model="model.recpan.usr.extkey" disabled style="width:100%" placeholder="请选择extkey">
                                    </c-input>
                                </el-form-item>
                            </c-col>

                        </c-col>
                        
                        <!-- -------------------分割线------------------- -->
                        <!-- <c-col :span="23">
                            <div style="border-bottom: 10px solid rgb(232, 232, 232);">
                            </div>
                        </c-col> -->
                        <!-- <c-col :span="23" style="margin-left:9px;height:25px">
                            <el-divider></el-divider>
                        </c-col> -->

                        <!-- -------------------document------------------- -->
                        <c-col :span="24" style="height:24px">
                            <el-form-item label="面函/报文" class="messageLabel">
                            </el-form-item>
                        </c-col>
                        <c-col :span="23" style="height: 0px">
                            <el-divider></el-divider>
                        </c-col>
                        <c-col :span="23">
                                <!-- <c-input  v-model="model.recpan.smhstm"  placeholder="请输入Documents"></c-input> -->
                            <c-col :span="24">
                                <c-istream-table :list="documentsData.data" :columns="documentsData.columns" :paginationShow="false" style="width:100%">
                                    <el-table-column
                                        fixed="right"
                                        prop="display"
                                        label="操作"
                                        width="200px"
                                    >
                                    <template slot="header">
                                        <c-col :span="11" style="text-align:left"><span>操作</span></c-col>
                                        <c-col :span="12" style="text-align:right"><c-button icon="el-icon-s-tools"></c-button></c-col>
                                        </template>
                                        <template>
                                            <c-button
                                                style="margin-left: 0"
                                                size="small"
                                            >
                                                Show
                                            </c-button>
                                            <c-button
                                                style="margin-left: 0"
                                                size="small"
                                            >
                                                生成PDF
                                            </c-button>
                                        </template>
                                    </el-table-column>
                                </c-istream-table>
                            </c-col>
                        </c-col> 

                        
                        <!-- <c-col :span="12">
                            <el-form-item label="User ID">
                                <c-input  v-model="model.recpan.usr.extkey" maxlength="8"  placeholder="请输入User ID"></c-input>
                            </el-form-item>
                        </c-col>             
                                    
                        <c-col :span="12">
                            <el-form-item label="">
                                <c-input  v-model="model.recpan.usrget.sdamod.seainf"  placeholder="请输入"></c-input>
                            </el-form-item>
                        </c-col>             
                                                        -->
                        <c-col :span="24" style="height:24px;margin-top:30px">
                            <el-form-item label="经办/复核" class="messageLabel">
                            </el-form-item>
                        </c-col>
                        <c-col :span="23" style="height:0px;">
                            <el-divider></el-divider>
                        </c-col>
                        <c-col :span="23">
                            <!-- <c-input  v-model="model.recpan.trsstm"  placeholder="请输入Signatures"></c-input> -->
                            <c-col :span="24">
                                <c-istream-table :list="SignaturesData.data" :columns="SignaturesData.columns" :paginationShow="false" style="width:100%">
                                    <el-table-column label="Action" width="400px">
                                        <template slot-scope="scope">
                                            <!-- <span>{{JSON.stringify(scope.row)}}</span> -->
                                            <el-select v-model="action[scope.row.IDX]" style="100%" disabled>
                                                <el-option
                                                    v-for="item in codes.flg"
                                                    :key="item.value"
                                                    :label="item.label"
                                                    :value="item.value"
                                                />
                                            </el-select>
                                        </template>
                                    </el-table-column>
                                    <el-table-column
                                        fixed="right"
                                        prop="display"
                                        label="操作"
                                        width="200px"
                                    >
                                    <template slot="header">
                                        <c-col :span="11" style="text-align:left"><span>操作</span></c-col>
                                        <c-col :span="12" style="text-align:right"><c-button icon="el-icon-s-tools"></c-button></c-col>
                                        </template>
                                    </el-table-column>
                                </c-istream-table>
                            </c-col> 
                        </c-col>  

                        <!-- -------------------workflow------------------- -->
                        <c-col :span="24" style="height:24px;margin-top:30px">
                            <el-form-item label="工作流服务" class="messageLabel">
                            </el-form-item>
                        </c-col>
                        <c-col :span="23" style="height:0px;">
                            <el-divider></el-divider>
                        </c-col>
                        <c-col :span="23">
                            <c-col :span="24">
                                <!-- <c-input  v-model="model.recpan.wfestm"  placeholder="请输入WFEs for transaction for display"></c-input> -->
                                    <c-istream-table :list="stmData.data" :columns="stmData.columns" :paginationShow="false" style="width:100%">
                                        <!-- <el-table-column
                                            fixed="right"
                                            prop="display"
                                            label="操作"
                                            width="150px"
                                        >
                                        <template slot="header">
                                            <c-col :span="11" style="text-align:left"><span>操作</span></c-col>
                                            <c-col :span="12" style="text-align:right"><c-button icon="el-icon-s-tools"></c-button></c-col>
                                            </template>
                                            <template slot-scope="scope">
                                            <c-button
                                                style="margin-left: 0"
                                                size="small"
                                                type="primary"
                                                @click="onDetail(scope.$index,scope.row)"
                                            >
                                                详情
                                            </c-button>
                                            <c-button
                                                style="margin-left: 0"
                                                size="small"
                                                type="primary"
                                                @click="onHandle(scope.$index,scope.row)"
                                            >
                                                处理
                                            </c-button>
                                            </template>
                                        </el-table-column> -->
                                    </c-istream-table>
                            </c-col>
                        </c-col>                       

                    </c-content>                  
                </el-form>      
            </div>
        <!-- </div> -->
            </c-content>
    </c-page>
</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"

export default {
    name: "InftrnpsDetail",
    mixins: [CommonProcess],
    data(){
        return {
            model: new Trnrel().data,
            documentsData: {
                columns: [
                    "1 1 \"Type\" 100 1 0:0 1 CORTYP",
                    "2 2 \"External Key\" 300",
                    "3 3 \"Document\" 300",
                    "4 4 \"Show\" 150 5 6:1 0 A",
                    "5 5 \"GenPDF\" 150 5 6:1 0 B"
                    ],
                data: [],
            },
            SignaturesData: {
                columns: [
                    '1 2:1 "User" 200',
                    '2 3:1 "Date / Time" 300',
                    // '3 5:1 "Action" 400',
                    '4 1:1 "Type" 200'
                    ],
                data: [],
            },
            stmData: {
                columns: [
                    '1 1 "ID" 100',
                    '2 2 "Service" 125',
                    '3 3 "Status" 100',
                    '4 4 "Last Update" 125',
                    '5 5 "Retries" 100',
                    '6 6 "Text" 300',
                    '7 7 "Contrary Text" 300',
                    '8 8 "Target Time" 200'
                    ],
                data: [],
            },
            codes: { infdsp: CodeTable.infdsp,
                     flg : CodeTable.flg,
                     atptxt : CodeTable.atptxt,
                     relstaEN : CodeTable.relstaEN,
                     usgtxt : CodeTable.usgtxt },
            action:[],
        }
    },
    mounted() {
        this.loadData()
    },
    methods: {
        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;
            console.log(this.SignaturesData.data)
            for (let i = 0; i < this.SignaturesData.data.length; i++) {
                const d = this.SignaturesData.data[i];
                const items = d.split("\t");
                this.action[i] = items[items.length - 2];
            }
            console.log(this.action)
        },
        exit(){
            this.$store.dispatch("TagsView/delView", this.$route)
            this.$router.history.push("/taskList");
        },
        display() {
            debugger
            const inr = this.model.trn.inr;
            Api.post("getTrnNameByInr", { inr: inr}).then((res) => {
                if (res.respCode == SUCCESS) {
                const trnName = res.data.toLowerCase();
                let viewurl = "/#/display/" + trnName + "?trn=" + inr
                window.open(viewurl, 'newwindow', 'height=1500,width=1200,top=100,left=100,toolbar=no,resizable=no,menubar=no,location=no, status=no');
                }
            });
        },
        ...Event
    }
}
</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: 12px;
}
</style>