<template>
  <div class="eContainer" style="display: flex;">
    <el-form
      :model="model"
      :rules="rules"
      ref="modelForm"
      label-width="200px"
      size="small"
			:validate-on-rule-change="false"
      style="width: 85%;"
    >
      <c-tabs v-model="tabVal" ref="elment" type="card" @tab-click="tabClick">
        <!--PD000002 -->
        <el-tab-pane label="Search Panel" name="infsea">
          <m-infsea :model="model" :codes="codes" />
        </el-tab-pane>
        <!-- </c-tabs> -->

        <!--PD000029 -->
        <el-tab-pane label="Address Association" name="ptap0">
          <m-ptap0 :model="model" :codes="codes" />
        </el-tab-pane>
        <!-- </c-tabs> -->

        <!--PD000685 -->
        <el-tab-pane label="Details" name="ptap1">
          <m-ptap1 :model="model" :codes="codes" />
        </el-tab-pane>
        <!-- </c-tabs> -->

        <!--PD000650 -->
        <el-tab-pane label="Authentication of Address" name="ptmpan">
          <m-ptmpan :model="model" :codes="codes" />
        </el-tab-pane>
        <!-- </c-tabs> -->

        <!--PD000700 -->
        <el-tab-pane label="Infotext" name="oitpan">
          <m-oitpan :model="model" :codes="codes" />
        </el-tab-pane>
      </c-tabs>
    </el-form>
    <div style="width: 10%;height: 400px;margin-left: 2%;display: flex;flex-direction: column;justify-content: space-around;">
      <c-col :span="12">
        <c-button size="small" type="primary" @click="onInfbutSearow">
          Search
        </c-button>
      </c-col>

      <c-col :span="12">
        <c-button v-show="tabVal === 'infsea'" size="small" type="primary" @click="onInfbutDsp" :disabled="model.infbut.selrow === 0">
          Display
        </c-button>
        <el-button-group v-show="tabVal !== 'infsea'" >
          <c-button type="primary" icon="el-icon-arrow-left" style="width: 50%;"
            @click="onInfbutDsp(--model.infbut.selrow)"
            :disabled="model.infbut.selrow <= 1">
          </c-button>
          <c-button type="primary" icon="el-icon-arrow-right" style="width: 50%;"
            @click="onInfbutDsp(++model.infbut.selrow)"
            :disabled="!model.infbut.dspstm.rows || model.infbut.dspstm.rows.length === 0 || model.infbut.selrow === model.infbut.dspstm.rows.length">
          </c-button>
        </el-button-group>
      </c-col>

      <c-col :span="12">
        <c-button size="small" type="primary" @click="onInfbutUserow" :disabled="model.infbut.selrow === 0">
          Use
        </c-button>
      </c-col>

      <c-col :span="12">
        <c-button size="small" type="primary" @click="onInfbutClr">
          Clear
        </c-button>
      </c-col>

      <c-col :span="12">
        <c-button size="small" type="primary" @click="onInfbutButprt">
          导Excel
        </c-button>
      </c-col>

      <!-- <c-col :span="12">
        <el-form-item label="display stream" prop="infbut.dspstm">
          <c-input
            v-model="model.infbut.dspstm"
            placeholder="请输入display stream"
          ></c-input>
        </el-form-item>
      </c-col> -->

      <c-col :span="12">
        <c-button size="small" type="primary" @click="onInfbutExi">
          E&xit
        </c-button>
      </c-col>
    </div>
  </div>
</template>
<script>
import Api from "~/service/Api";
import CodeTable from "~/config/CodeTable";
import Infpta from "~/model/Infpta";
import commonProcess from "~/mixin/commonProcess";
import Check from "~/model/Infpta/Check";
import Default from "~/model/Infpta/Default";
import Pattern from "~/model/Infpta/Pattern";
import Infsea from "./Infsea";
import Ptap0 from "./Ptap0";
import Ptap1 from "./Ptap1";
import Ptmpan from "./Ptmpan";
import Oitpan from "./Oitpan";
import Event from "~/model/Infpta/Event";

export default {
  name: 'Infpta',
  components: {
    "m-infsea": Infsea,
    "m-ptap0": Ptap0,
    "m-ptap1": Ptap1,
    "m-ptmpan": Ptmpan,
    "m-oitpan": Oitpan,
  },
  provide() {
    return {
      root: this,
    };
  },
  mixins: [commonProcess], // 里面包含了Default、Check等的公共处理
  data() {
    return {
      tabVal: "infsea",
			trnName:"infpta",
      model: new Infpta().data,
      checkRules:Check,
      defaultRules:Default,
			pattern: Pattern,
      rules: null,
      codes: {},
    };
  },
  methods: {
      ...Event
  },
  created: async function() {
    console.log("进入infpta交易");
    let rtnmsg = await this.init({})
    if (rtnmsg.respCode == SUCCESS) {
      //TODO 处理数据逻辑
      this.updateModel(rtnmsg.data);
    } else {
      this.$notify.error({ title: "错误", message: "服务请求失败！" });
    }
  },
};
</script>
<style></style>