<template>
    <div class="eibs-tab">

        <!-- ========================= Left ========================= -->
        <c-col :span="11">
            <c-col :span="24">
                <el-form-item label="信用证兑付方式" prop="didgrp.rec.avbby">
                    <c-select v-model="model.didgrp.rec.avbby" style="width:100%" @change="avbbykeyEvent"
                        placeholder="请选择">
                        <el-option v-for="item in codes.avbby0" :key="item.value" :label="item.label"
                            :value="item.value">
                        </el-option>
                    </c-select>
                </el-form-item>
            </c-col>

            <c-col :span="24">
                <el-form-item label="付款期限" prop="didgrp.rec.tenmaxday">
                    <c-input :disabled="model.didgrp.rec.avbby == 'P'" v-model.number="model.didgrp.rec.tenmaxday"
                        placeholder="请输入" style="width:100%" maxlength="3"
                        @keyup.enter.native="defaultFunction('didgrp.rec.tenmaxday', model.didgrp.rec.tenmaxday)">
                    </c-input>
                </el-form-item>
            </c-col>

            <c-col>
                <el-form-item label="远期付款指示" prop="didgrp.blk.defdet">
                    <!-- <c-col :span="21"> -->
                    <c-fullbox>
                        <c-input type="textarea" :disabled="model.didgrp.rec.avbby == 'P'"
                            v-model="model.didgrp.blk.defdet" style="width:98%" maxlength="60" show-word-limit
                            placeholder="请输入" :autosize="{ minRows: 3, maxRows: 5 }"></c-input>
                        <!-- </c-col> -->
                        <!-- <c-col :span="3" style="text-align: right"> -->
                        <template slot="footer">
                            <c-button size="small" style="margin:0 0;" type="primary" icon="el-icon-search"
                                @click="onDefdetButtxmsel">
                            </c-button>
                        </template>
                    </c-fullbox>
                    <!-- </c-col> -->
                </el-form-item>
            </c-col>
            <c-col>
                <el-form-item label="交单期限" prop="didgrp.blk.preper">
                    <!-- <c-col :span="21"> -->
                    <c-fullbox>
                        <c-input type="textarea" v-model="model.didgrp.blk.preper" :disabled="this.flag"
                            style="width:98%" maxlength="105" show-word-limit placeholder="请输入"></c-input>
                        <!-- </c-col> -->
                        <!-- <c-col :span="3" style="text-align: right"> -->
                        <template slot="footer">
                            <c-button size="small" type="primary" style="margin:0 0;" icon="el-icon-search"
                                @click="onPreperButtxmsel">
                            </c-button>
                        </template>
                    </c-fullbox>
                    <!-- </c-col> -->
                </el-form-item>
            </c-col>
            <c-col>
                <el-form-item label="" prop="didgrp.blk.preperflg">
                    <c-checkbox v-model="model.didgrp.blk.preperflg" :click="preperflgExtkeyEvent()">修改交单期限文本
                    </c-checkbox>
                </el-form-item>
            </c-col>
            <c-col :span="24">
                <c-col :span="24">
                    <el-form-item label="货物运输/交货/服务方式" prop="didgrp.rec.tratyp">
                        <c-select v-model="model.didgrp.rec.tratyp" style="width:100%" placeholder="请选择"
                            @change="recTratypChange" :disabled="model.didgrp.rec.mytype == 'F'">
                            <el-option v-for="item in codes.tratyp" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </c-select>
                    </el-form-item>
                </c-col>
            </c-col>
            <c-col :span="24">
                <el-form-item v-if="model.didgrp.rec.mytype == 'H'||model.didgrp.rec.mytype == ''" label="手输运输方式" prop="didgrp.rec.sdsrfs">
                    <c-input type="textarea" v-model="model.didgrp.rec.sdsrfs" :disabled="model.didgrp.rec.mytype != 'F'&& model.didgrp.rec.tratyp != '08'"
                        maxlength="20" show-word-limit placeholder="请输入"></c-input>
                </el-form-item>
            </c-col>
            <c-col :span="24">
                <el-form-item v-if="model.didgrp.rec.mytype == 'F'" label="服务提供方式" prop="didgrp.rec.sdsrfs">
                    <c-input type="textarea" v-model="model.didgrp.rec.sdsrfs" maxlength="20" show-word-limit
                        placeholder="请输入" :disabled="model.didgrp.rec.mytype != 'F'&& model.didgrp.rec.tratyp != '08'"></c-input>
                </el-form-item>
            </c-col>
            <c-col :span="24">
                <el-form-item v-if="model.didgrp.rec.mytype == '3'" label="手输运输方式/服务提供方式" prop="didgrp.rec.sdsrfs">
                    <c-input type="textarea" v-model="model.didgrp.rec.sdsrfs" :disabled="model.didgrp.rec.mytype != 'F'&& model.didgrp.rec.tratyp != '08'"
                        maxlength="20" show-word-limit placeholder="请输入" ></c-input>
                </el-form-item>
            </c-col>

            <c-col :span="24">
                <el-form-item label="合同编号" prop="didgrp.rec.conno">
                    <c-input v-model="model.didgrp.rec.conno" maxlength="35" placeholder="请输入"></c-input>
                </el-form-item>
            </c-col>

            <c-col :span="11">
                <el-form-item label="合同金额" prop="didgrp.rec.conamt">
                    <c-select v-model="model.didgrp.rec.concur" style="width:100%" placeholder="请选择">
                        <el-option label="CNY" value="CNY">
                            <span style="float: left">{{ "CNY 人民币" }}</span>
                        </el-option>
                    </c-select>
                </el-form-item>
            </c-col>
            <c-col :span="13">
                <el-form-item label-width="5px" prop="didgrp.rec.conamt">
                    <c-input v-model="model.didgrp.rec.conamt" placeholder="请输入"></c-input>
                </el-form-item>
            </c-col>
        </c-col>

        <!-- ========================= Right ========================= -->
        <c-col :span="11" :offset="1">
            <c-col :span="24">
                <el-form-item label="分批装运货物" prop="didgrp.rec.shppar">
                    <c-select v-model="model.didgrp.rec.shppar" style="width:100%" placeholder="请选择"
                        @change="changeFqzytgfw">
                        <el-option v-for="item in codes.shppar" :key="item.value" :label="item.label"
                            :value="item.value">
                        </el-option>
                    </c-select>
                </el-form-item>
            </c-col>
            <c-col :span="24">
                <el-form-item label="分期装运/提供服务" prop="didgrp.rec.fqzytgfw">
                    <c-select v-model="model.didgrp.rec.fqzytgfw" placeholder="请选择"
                        :disabled="model.didgrp.rec.shppar != 'Y'" style="width:100%">
                        <el-option v-for="item in codes.shppar" :key="item.value" :label="item.label"
                            :value="item.value">
                        </el-option>
                    </c-select>
                </el-form-item>
            </c-col>
            <c-col :span="24">
                <el-form-item label="分期装运/提供服务约定" prop="didgrp.rec.fqtime">
                    <c-input type="textarea" :rows="3" v-model="model.didgrp.rec.fqtime" maxlength="140" show-word-limit
                        placeholder="请输入" style="width:100%"></c-input>
                </el-form-item>
            </c-col>
            <c-col :span="24">
                <el-form-item label="转运" prop="didgrp.rec.shptrs">
                    <c-select v-model="model.didgrp.rec.shptrs" style="width:100%" placeholder="请选择"
                        :disabled="model.didgrp.rec.mytype == 'F'">
                        <el-option label="禁止" value="禁止"></el-option>
                        <el-option label="允许" value="允许"></el-option>
                    </c-select>
                </el-form-item>
            </c-col>
            <c-col :span="24">
                <el-form-item label="货物转运地(港)" prop="didgrp.rec.shpfro">
                    <c-input type="textarea" style="width:100%" :rows="3" v-model="model.didgrp.rec.shpfro"
                        :disabled="model.didgrp.rec.mytype == 'F'" maxlength="35" show-word-limit placeholder="请输入">
                    </c-input>
                </el-form-item>
            </c-col>
            <c-col :span="24">
                <el-form-item label="货物目的地/交货地(港)" prop="didgrp.rec.shpto">
                    <c-input type="textarea" style="width:100%" :rows="3" v-model="model.didgrp.rec.shpto"
                        :disabled="model.didgrp.rec.mytype == 'F'" maxlength="35" show-word-limit placeholder="请输入">
                    </c-input>
                </el-form-item>
            </c-col>
            <c-col :span="24">
                <el-form-item label="服务提供地点" prop="didgrp.rec.shppro">
                    <c-input type="textarea" style="width:100%" :rows="3" v-model="model.didgrp.rec.shppro"
                        :disabled="model.didgrp.rec.mytype == 'H'" maxlength="35" show-word-limit placeholder="请输入">
                    </c-input>
                </el-form-item>
            </c-col>
        </c-col>
    </div>
</template>
<script>
import Api from "~/service/Api"
import commonProcess from "~/mixin/commonProcess";
import CodeTable from "~/config/CodeTable"
import Event from "~/model/Ditopn/Event"
import Utils from "~/utils";

export default {
    inject: ['root'],
    mixins: [commonProcess],
    props: ["model", "codes"],
    data() {
        return {
            flag: false,
        }
    },
    methods: {
        ...Event,
        changeFqzytgfw() {
            this.executeDefault("didgrp.rec.fqzytgfw").then(
                (res) => {
                    if (res.respCode == SUCCESS) {
                        Utils.copyValueFromVO(this.model, res.data);
                    }
                }
            )
        },
        preperflgExtkeyEvent() {
            this.flag = !this.model.didgrp.blk.preperflg
            if (this.flag === true) {
                this.model.didgrp.blk.preper = "货物装运日后15天";
            }
        },
        avbbykeyEvent() {
            if (this.model.didgrp.rec.avbby == 'P') {
                this.model.didgrp.rec.tenmaxday = 0;
                this.model.didgrp.blk.defdet = "";
            }
            this.executeCheck("didgrp.rec.avbby").then(
                (res) => {
                    if (res.respCode == SUCCESS) {
                        Utils.copyValueFromVO(this.model, res.data);
                    }
                }
            );
            this.executeDefault("didgrp.blk.defdet").then(
                (res) => {
                    if (res.respCode == SUCCESS) {
                        Utils.copyValueFromVO(this.model, res.data);
                    }
                }
            )
        },
        recTenmaxdayEvent() {
            this.executeDefault("didgrp.rec.tenmaxday").then(
                (res) => {
                    if (res.respCode == SUCCESS) {
                        Utils.copyValueFromVO(this.model, res.data);
                    }
                }
            );
        },
        recTratypChange() {
            if (this.model.didgrp.rec.tratyp == "08") {
                this.model.didgrp.rec.sdsrfs = "";
                this.mytypeFlag = false;
            } else {
                this.model.didgrp.rec.sdsrfs = "";
                this.mytypeFlag = true;
            }
        }
    },

    created: function () {

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