<template>
  <div class="eibs-tab">
     <el-form
      class="m-table-search-form"
      ref="paramsForm"
      :inline="true"
      label-position="right"
      label-width="110px"
      size="small"
    >
        <c-row>
            <c-col :span="24">
                <c-fullbox>
                    <el-form-item label="Type of items" prop="" style="width:100%">
                        <c-checkbox v-model="model.chkinc">Incomming</c-checkbox>
                        <c-checkbox v-model="model.chkdzt">E-Trade</c-checkbox>
                        <c-checkbox v-model="model.chkpen">Break</c-checkbox>
                        <c-checkbox v-model="model.chkcor">Correction</c-checkbox>
                        <c-checkbox v-model="model.chkaut">Automatic</c-checkbox>
                        <c-checkbox v-model="model.chkcan">归档</c-checkbox>
                        <c-checkbox v-model="model.chkbat">批量</c-checkbox>
                        <c-checkbox v-model="model.chkeco">三方付汇</c-checkbox>
                        <c-checkbox v-model="model.incpay">应收款</c-checkbox>
                        <c-checkbox v-model="model.outpay">应付款</c-checkbox>
                        <c-checkbox v-model="model.ecpay">三方收汇</c-checkbox>
                    </el-form-item>
                </c-fullbox>
            </c-col>
        </c-row>
            
        <c-col :span="24">
            <c-col :span="11">
            <el-form-item label="汇款编号" prop="selobj" style="width:100%">
                <c-input v-model="model.selobj" style="width:100%"></c-input>
            </el-form-item>
            </c-col>

            <c-col :span="11" :offset="1">
            <el-form-item label="简略信息" prop="seltxt" style="width:100%">
                <c-input v-model="model.seltxt" style="width:100%"></c-input>
            </el-form-item>
            </c-col>
        </c-col>

        <c-col :span="24">
            <c-col :span= "11">
            <el-form-item label="用户选择" prop="usfmod.flt" style="width:100%">
                <c-fullbox>
                    <c-select v-model="model.usfmod.flt"  placeholder="请输入Selection of User" style="width:100%">
                        <el-option 
                            v-for="item in flt"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                        ></el-option>
                    </c-select>
                    <template slot="footer">
                        <c-button size="small" type="primary">Show_Set</c-button>
                    </template>
                </c-fullbox>
            </el-form-item>
            </c-col>

            <c-col :span="11" :offset="1">
            <el-form-item label="Between" prop="inidatfro" style="width:100%">
                <c-date-picker
                    type="date"
                    v-model="model.inidatfro"
                    value-format="yyyy-MM-dd"
                    style="width:48%"
                    palceholder="请选择开立日期"
                ></c-date-picker>

                <span> - </span>

                <c-date-picker 
                    type="date"
                    v-model="model.inidattil"
                    value-format="yyyy-MM-dd"
                    style="width :48%"
                    placeholder="请选择Open Date to"
                ></c-date-picker>
            </el-form-item>
            </c-col>
        </c-col>

        <c-col
        :span="24"
        style="text-align: right; height: 36.8px"
        v-if="true"
      >
        <el-button size="small" @click="handleReset">重置</el-button>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="small"
          @click="handleSearch"
          >查询</el-button
        >
        <!-- <el-button type="text" @click="searchToggle = true">
          收起
          <i class="el-icon-arrow-up"></i>
        </el-button> -->
      </c-col>
    </el-form> 

    <c-col :span="24">
        <c-istream-table :list="stmData.data" :columns="stmData.columns" >
            <el-table-column fixed="right" prop="op" label="操作" width="140px">
            <template slot="header">
              <c-col :span="11" style="text-align: left"><span>操作</span></c-col>
            </template>
            <template slot-scope="scope">
              <el-popover
                placement="top-start"
                title="历史信息"
                width="800"
                trigger="click"
                :ref="'popover_' + scope.row.IDX"
              >
              <div style="text-align: right; margin-top: -30px; margin-right: 5px; font-size: 16px;">
               <span class="el-icon-close" @click="closeTrn('popover_' + scope.row.IDX)"/>
              </div>
                <c-istream-table
                  :list="trnData.data"
                  :columns="trnData.columns"
                >
                  <el-table-column prop="op" label="操作" width="0">
                    <template slot-scope="scope">
                      <c-button
                        style="margin-left: 0"
                        size="small"
                        @click="display(scope.row['INR'])"
                      >
                        详情
                      </c-button>
                    </template>
                  </el-table-column>
                </c-istream-table>
                <c-button
                  style="margin-left: 0"
                  size="small"
                  @click="getTrnInfo(scope.$index, scope.row)"
                  slot="reference"
                >
                  详情
                </c-button>
              </el-popover>
              <c-button
                style="margin-left: 0"
                size="small"
                type="primary"
                @click="getButtons(scope.row['汇款编号'])"
              >
                处理
              </c-button>
            </template>
          </el-table-column>
        </c-istream-table>
    </c-col>
  </div>
</template>
<script>
import Api from "~/service/Api"
import commonProcess from "~/mixin/commonProcess";
import CodeTable from "~/config/CodeTable"
import Event from "~/model/Sptcpt/Event"

export default {
    inject: ['root'],
    props:["model","codes"],
    mixins: [commonProcess],
    data(){
        return {
            flt: [
                { label: "All Users", value: "<ALL>" },
                { label: "Selected User", value: "<SELU>" },
            ],
            stmData:{
                columns:[
                    "4 1 \"交易代码\" 150 ",
                    "5 2 \"汇款编号\" 160",
                    "6 3 \"简略信息\" 120",
                    "7 5 \"Creation\" 101 20 30 1",
                    "1 6 \"状态\" 160 1 0:0 1 SPT:STA",
                    "8 7 \"By User\" 166",
                    "15 8 \"Work User\" 176",
                    "17 9 \"Work Branch\" 176",
                    "16 10 \"Last User\" 176",
                    "3 11 \"Info\" 150 1 20:0 1 FormatINFDSP",
                    "10 12 \"Infotext\" 200"
                ],
                data:[],
            }
        }
    },
    methods:{
        ...Event,
        async getButtons(ownref) {
            this.ownref = ownref;
            this.$refs.childs.initdialog = true;
            console.log("ownref:" + ownref);
        },

        async onChoose(code) {
            //跳转交易
            this.$router.history.push("/business/" + code);
            this.$refs.childs.initdialog = false;
        },

        async getTrnInfo(idx, row) {
            this.model.objinr = row["INR"];
            this.model.inr = row["INR"];
            this.model.infcon.chksubcon = "X";

            this.dialogTableVisible = true;
            let rtnmsg = await this.executeDefault("infcon.chksubcon");

            if ((rtnmsg.respCode = SUCCESS)) {
                this.trnData.data = rtnmsg.data.infcon_trnstm.rows;
            }
        },
        closeTrn(refId) {
            this.$refs[refId].doClose();
        },
    },
    created:function(){

    }
}
</script>
<style>

</style>