<template>
    <div class="eibs-tab">
        <c-row :gutter="80">
            <c-col :span="12">
                <c-row>
                    <el-form-item label="申报号码" prop="recgrp.vrf.rptno">
                        <c-input disabled placeholder="请输入编号" v-model="model.recgrp.vrf.rptno"></c-input>
                    </el-form-item>
                </c-row>
                <c-row>
                    <el-form-item label="操作类型" prop="recgrp.vrf.actiontype">
                        <c-select dbCode="action" disabled placeholder="请选择操作类型"
                                  v-model="model.recgrp.vrf.actiontype"></c-select>
                    </el-form-item>
                </c-row>
            </c-col>
            <c-col :span="12">
                <el-form-item label="删除原因" prop="recgrp.vrf.actiondesc">
                    <c-input :disabled="disabledActiondesc" :rows="3" placeholder="请输入删除原因" show-word-limit
                             type="textarea" v-model="model.recgrp.vrf.actiondesc"></c-input>
                </el-form-item>
            </c-col>
        </c-row>

        <c-row :gutter="80">
            <c-col :span="12">
                <el-form-item label="交易编码" prop="recgrp.vrf.txcode">
                    <c-select :filter-method="searchBopCod1" disabled placeholder="请输入交易编码" style="width: 100%"
                              v-model="model.recgrp.vrf.txcode">
                        <el-option :key="item.cod" :label="item.cod+'-'+item.txt" :value="item.cod"
                                   v-for="item in options1"></el-option>
                    </c-select>
                </el-form-item>
            </c-col>
            <c-col :span="12">
                <el-form-item label="外汇局批件号/备案表号/业务编号" prop="recgrp.vrf.regno">
                    <c-input disabled maxlength="20" placeholder="请输入外汇局批件号/备案表号/业务编号"
                             v-model="model.recgrp.vrf.regno"></c-input>
                </el-form-item>
            </c-col>
        </c-row>

        <c-row :gutter="80">
            <c-col :span="12">
                <el-form-item label="填报人" prop="recgrp.vrf.crtuser">
                    <c-input disabled maxlength="20" placeholder="请输入填报人" v-model="model.recgrp.vrf.crtuser"></c-input>
                </el-form-item>
            </c-col>
            <c-col :span="12">
                <el-form-item label="填报人电话" prop="recgrp.vrf.inptelc">
                    <c-input disabled maxlength="20" placeholder="请输入填报人电话"
                             v-model="model.recgrp.vrf.inptelc"></c-input>
                </el-form-item>
            </c-col>
        </c-row>

        <c-row :gutter="80">
            <c-col :span="12">
                <el-form-item label="申报日期" prop="recgrp.vrf.rptdate">
                    <c-date-picker disabled placeholder="请选择申报日期" style="width:100%" type="date"
                                   v-model="model.recgrp.vrf.rptdate"></c-date-picker>
                </el-form-item>
            </c-col>
        </c-row>

    </div>
</template>
<script>
    import event from "../event";

    export default {
        inject: ["root"],
        props: ["model", "codes"],
        mixins: [event],
        computed: {
            disabledActiondesc() {
                // return this.model.recgrp.vrf.actiontype !== "D" || this.model.mtabut.vrfflg !== "X";
                return false;
            }
        },
        data() {
            return {
                options1: [],
                bopcodList: []
            };
        },
        mounted() {
            this.getBopcodItems();
        },
        methods: {
            searchBopCod1(query) {
                if (query !== "") {
                    this.options1 = this.bopcodList.filter(item =>
                        item.cod.startsWith(query)
                    );
                } else {
                    this.options1 = this.bopcodList;
                }
            }
        },
        created: function () {
        }
    };
</script>
<style>
    .el-form-item__label {
        padding: 0 0 0 20px;
        line-height: 20px !important;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }
</style>