<template>
    <c-page title="">
        <!-- <div class="eContainer"> -->
            <c-content :height="120">
            <div class="eibs-tab">
                <!-- <c-col :span="24">
                    <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="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="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="13">
                                    <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="11">
                                    <el-form-item  label="" label-width="8px">
                                        <c-input  v-model="model.trn.reloriamt" disabled placeholder="请输入Relevant Amount for Release in Original Currency"></c-input>
                                    </el-form-item>
                                </c-col> 
                            </c-col>      

                            <c-col :span="24">
                                <c-col :span="13">
                                    <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="11">
                                    <el-form-item label-width="40%" 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="24">
                                    <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="24">
                                    <el-form-item 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="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="this.atptxt" maxlength="6" disabled 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">
                                <c-col :span="24">
                                    <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="24">
                                    <el-form-item 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">
                                <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="24">
                            <div style="border-bottom: 10px solid rgb(232, 232, 232);">
                            </div>
                        </c-col> -->
                        <!-- <c-col :span="24" style="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="24" style="height: 0px;margin-top:-5px">
                            <el-divider></el-divider>
                        </c-col>
                        <c-col :span="24">
                            <!-- <c-input  v-model="model.recpan.smhstm"  placeholder="请输入Documents"></c-input> -->
                            <c-istream-table :list="documentsData.data" :columns="documentsData.columns" :paginationShow="false" style="width:100%">
                                <el-table-column
                                    fixed="right"
                                    prop="display"
                                    label="操作"
                                    width="170px"
                                >
                                <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="show(scope.$index,scope.row)"
                                        >
                                            显示
                                        </c-button>
                                        <c-button
                                            style="margin-left: 0"
                                            size="small"
                                            type="primary"
                                        >
                                            打印
                                        </c-button>
                                    </template>
                                </el-table-column>
                            </c-istream-table>
                        </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: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="Action" width="auto">
                                        <template slot-scope="scope">
                                            <span>{{flg[scope.row.IDX]}}</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>
                                </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>
</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 \"Type\" 300 1 0:0 1 CORTYP",
                    "2 2 \"External Key\" 300",
                    "3 3 \"Document\" auto",
                    ],
                data: [],
            },
            SignaturesData: {
                columns: [
                    '1 2:1 "User" 300',
                    // '2 3:1 "Date / Time" 300',
                    {index:2,position:3,width:300,pattern:'time',label:'Date / Time'},
                    // '3 5:1 "Action" 400',
                    '4 1:1 "Type" 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 "ID" 100',
                    '2 2 "Service" 100',
                    // '3 3 "Status" 100',
                    {index:3,position:3,width:100,pattern:'code',label:'Status',code: CodeTable.wfetrssta},
                    '4 4 "Last Update" 100',
                    '5 5 "Retries" 100',
                    '6 6 "Text" 200',
                    '7 7 "Contrary Text" 200',
                    // '8 8 "Target Time" auto'
                    {index:8,position:8,width:'auto',pattern:'dateFormat',label:'Target Time'},
                    ],
                data: [],
            },
            flg:[],
            atptxt:'',
            relstaEN:'',
            usgtxt:'',
        }
    },
    mounted() {
        this.loadData()
    },
    methods: {
        ...Event,
        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.Type == '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: 12px;
}
</style>