<template>
    <div class="eibs-tab">
        <c-list-search  @form-reset="handleReset" @form-search="handleSearch">
            <template v-slot="searchSlot">
                <el-form
                    class="m-table-search-form"
                    ref="paramsForm"
                    :inline="true"
                    label-position="left"
                    label-width="110px"
                    size="small"
                >
                    <el-row>
                        <c-col :span="2" style="text-align:center;margin-bottom: 16px;">
                            <el-form-item label="" prop="chkinc">
                                    <c-checkbox v-model="chkinc">Incoming</c-checkbox>
                            </el-form-item>
                        </c-col>
                        <c-col :span="2" style="text-align:center;margin-bottom: 16px;">
                            <el-form-item label="" prop="chkdzt">
                                <c-checkbox v-model="chkdzt">E-Trade</c-checkbox>
                            </el-form-item>
                        </c-col>
                        <c-col :span="2" style="text-align:center;margin-bottom: 16px;">
                            <el-form-item label="" prop="chkpen">
                                <c-checkbox v-model="chkpen">Break</c-checkbox>
                            </el-form-item>
                        </c-col>

                        <c-col :span="2" style="text-align:center;margin-bottom: 16px;">
                            <el-form-item label="" prop="chkcor">
                                <c-checkbox v-model="chkcor">Correction</c-checkbox>
                            </el-form-item>
                        </c-col>
                    
                        <c-col :span="2" style="text-align:center;margin-bottom: 16px;">
                            <el-form-item label="" prop="chkaut">
                                <c-checkbox v-model="chkaut">Automatic</c-checkbox>
                            </el-form-item>
                        </c-col>

                        <c-col :span="2" style="text-align:center;margin-bottom: 16px;">
                            <el-form-item label="" prop="chkdel">
                                <c-checkbox v-model="chkdel">Reject</c-checkbox>
                            </el-form-item>
                        </c-col>
                        
                        <c-col :span="2" style="text-align:center;margin-bottom: 16px;">
                            <el-form-item label="" prop="chktco">
                                <c-checkbox v-model="chktco">网银</c-checkbox>
                            </el-form-item>
                        </c-col>

                        <c-col :span="2" style="text-align:center;margin-bottom: 16px;">
                            <el-form-item label="" prop="chkcan">
                                <c-checkbox v-model="chkcan">归档</c-checkbox>
                            </el-form-item>
                        </c-col>
                    </el-row>
                
                    <el-row v-show="searchSlot.searchToggle">
                        <c-col :span="12" >
                            <el-form-item label="Reference" prop="selobj">
                                <c-input v-model="model.selobj" maxlength="32" placeholder="请输入Reference"></c-input>
                            </el-form-item>
                        </c-col>

                        <c-col :span="12" >
                            <el-form-item label="Name" prop="seltxt">
                                <c-input v-model="model.seltxt" maxlength="32" placeholder="请输入Selection Name"></c-input>
                            </el-form-item>
                        </c-col>

                        <c-col :span="12" >
                            <el-form-item label="Selection of Users" prop="usfmod.flt">
                                <c-select v-model="model.usfmod.flt" style="width:60%" placeholder="请选择User">
                                    <el-option v-for="item in codes.flt" :key="item.value" :label="item.label"
                                        :value="item.value">
                                    </el-option>
                                </c-select>
                                <c-button size="small" type="primary" style="width:30%" @click="onUsfmodShwflt">
                                    Show Set
                                </c-button>
                            </el-form-item>

                        </c-col>

                        <c-col :span="12" >
                            <el-form-item label="Between">
                                <el-date-picker type="date" v-model="model.inidatfro" style="width:45%" placeholder="请选择Date of entry of Transaction"></el-date-picker>
                                -
                                <el-date-picker type="date" v-model="model.inidattil" style="width:45%" placeholder="请选择Date of entry of Transaction until"></el-date-picker>
                            </el-form-item>
                        </c-col>

                        <c-col :span="12">
                            <el-form-item label="国内国际证标志" prop="dflg">
                                <c-select v-model="model.dflg" style="width:100%" placeholder="请选择国内国际标志">
                                    <el-option label="All" value="1"></el-option>
                                    <el-option label="国内业务" value="2"></el-option>
                                    <el-option label="国际业务" value="3"></el-option>
                                </c-select>
                            </el-form-item>
                        </c-col>

                        <c-col :span="12" style="text-align:center" >
                            <c-checkbox v-model="model.chkypt">云平台</c-checkbox>
                        </c-col>

                        <c-col :span="24">
                            <c-col :span="12">
                                <el-form-item label="退回原因" prop="yptinf">
                                    <c-input v-model="model.yptinf" maxlength="60" placeholder="请输入退回原因" :readonly=true></c-input>
                                </el-form-item>
                            </c-col>

                            
                        </c-col>
                    </el-row>
                </el-form>
            </template>
        </c-list-search>

        <div style="margin-top:20px;">
            <c-button size="small" type="primary" disabled="disabled" @click="onButypt">
                退回云平台
            </c-button>
            <c-button size="small" type="primary" disabled="disabled" @click="onDlmft">
                MFT下载
            </c-button>
            <c-button size="small" type="primary" disabled="disabled" @click="onDlaxq">
                AXQ下载
            </c-button>
            <c-button size="small" type="primary" disabled="disabled" @click="onButimg">
                上传影像
            </c-button>
        </div>
        <el-row>
            <c-istream-table :list="stmData.data" :columns="stmData.columns">
            <el-table-column
                prop="op"
                label="OP"
                width="100">
                <template slot-scope="scope">
                <a href="javascript:void(0)" @click="continueEdit(scope.row)">继续编辑</a>
                </template>
            </el-table-column>
            </c-istream-table>
        </el-row>
        <el-row style="margin-top:2rem;">
            <el-card class="box-card">
                <div slot="header" class="clearfix">
                    <span>交易状态信息 —— {{transactionStatus.busiNo}}</span>
                </div>
                <div class="text item">
                    <form class="el-form--label-left el-form--inline">
                        <div class="el-form-item">
                            <label class="el-form-item__label">修改次数:</label>
                            <div class="el-form-item__content">
                            <span>{{transactionStatus.modTimes}}</span>
                            </div>
                        </div>
                        <div class="el-form-item">
                            <label class="el-form-item__label transstatus">交单次数:</label>
                            <div class="el-form-item__content">
                            <span>{{transactionStatus.postCount}}</span>
                            </div>
                        </div>
                        <div class="el-form-item">
                            <label class="el-form-item__label transstatus">付款次数:</label>
                            <div class="el-form-item__content">
                            <span>{{transactionStatus.earnCount}}</span>
                            </div>
                        </div>
                        <div class="el-form-item">
                            <label class="el-form-item__label transstatus">付款金额:</label>
                            <div class="el-form-item__content">
                            <span>{{transactionStatus.earnAmt}} CNY</span>
                            </div>
                        </div>
                        </form>
                    </div>
                </el-card>
            </el-row>
            <el-dialog :visible.sync="initdialog" :title="'交易列表'" append-to-body>
                <div class="m-list-btns">
                </div>
            </el-dialog>
    </div>
</template>
<script>
import Api from "~/service/Api"
import CommonProcess from "~/mixin/CommonProcess";
import CodeTable from "~/config/CodeTable"
import Event from "~/model/Sptsel/Event"

export default {
    inject: ['root'],
    props:["model","codes"],
    mixins: [CommonProcess],
    data(){
        return {
            initdialog:false,
            transactionStatus: {
                busiNo: "",
                modTimes: 0,
                postCount: 0,
                accCount: 0,
                earnCount: 0,
                earnAmt: 0
            },
            stmData: {
                columns: [
                    "4 1 \"TRN\" 50 ",
                    "5 2 \"Reference\" 150",
                    "6 3 \"Name\" 110",
                    // "18 5 \"MT\" 100",
                    "7 6 \"Creation\" 101 20 DateTime 1",
                    "20 7 \"Cur\" 30",
                    "21 8 \"Amt\" 69 2 8 1 16",
                    "1 9 \"Status\" 60 1 tdViewTypeEdit:0 1 SPT:STA",
                    "20 7 \"Cur\" 30",
                    "21 8 \"Amt\" 69 2 8 1 16",
                    "1 9 \"Status\" 60 1 tdViewTypeEdit:0 1 SPT:STA",
                    "8 10 \"By User\" 66",
                    "15 11 \"Work User\" 76",
                    "17 12 \"Work Branch\" 126",
                    "16 13 \"Last User\" 76",
                    "3 14 \"Info\" 50 1 20:0 1 FormatINFDSP",
                    "19 15 \"Key\" 90",
                    "10 16 \"Infotext\" 500"
                ],
                data: [
                ]
            }
        }
    },
    computed: {
        chkinc: {
            get() {
                return this.model.chkinc === 't';
            },
            set(val) {
                this.model.chkinc = val ? 't' : ''
            }
        },
         chkdzt: {
            get() {
                return this.model.chkdzt === 't';
            },
            set(val) {
                this.model.chkdzt = val ? 't' : ''
            }
        },
         chkpen: {
            get() {
                return this.model.chkpen === 't';
            },
            set(val) {
                this.model.chkpen = val ? 't' : ''
            }
        },
         chkcor: {
            get() {
                return this.model.chkcor === 't';
            },
            set(val) {
                this.model.chkcor = val ? 't' : ''
            }
        },
         chkaut: {
            get() {
                return this.model.chkaut === 't';
            },
            set(val) {
                this.model.chkaut = val ? 't' : ''
            }
        },
         chkdel: {
            get() {
                return this.model.chkdel === 't';
            },
            set(val) {
                this.model.chkdel = val ? 't' : ''
            }
        },
         chktco: {
            get() {
                return this.model.chktco === 't';
            },
            set(val) {
                this.model.chktco = val ? 't' : ''
            }
        },
         chkcan: {
            get() {
                return this.model.chkcan === 't';
            },
            set(val) {
                this.model.chkcan = val ? 't' : ''
            }
        }
    },
    methods:{...Event},
    created:function(){

    }
}
</script>
<style>
</style>
