<template>
    <div>
        <el-form :model="deptInfo" ref="deptInfoForm" label-width="150px" label-position="right" label-suffix=":" size="small" :rules="rules">
            <c-row>
                <c-col :span="11" >
                    <c-form-item label="机构编码" prop="branch">
                        <c-input event-render="loadText" v-model="deptInfo.branch"
                            type="text"  maxlength="4" :disabled="true">
                        </c-input>
                    </c-form-item>
                </c-col>
                <c-col :span="11" >
                    <c-form-item label="机构级别" prop="lev">
                        <c-select v-model="deptInfo.lev" style="width: 100%" dbCode="BCHLEV" @change="changeLev" :disabled="filedDisabled">
                        </c-select>
                    </c-form-item>
                </c-col>
            </c-row>
            <c-row>
                <c-col :span="11" >
                    <c-form-item label="机构类型" prop="bchtyp" v-if="this.deptInfo.lev == '2'" style="width: 100%">
                        <c-select v-model="deptInfo.bchtyp" style="width: 100%" dbCode="BCHTXT" :filterKey="['1','2','6','7']" :disabled="filedDisabled" @change="changeTyp()">
                        </c-select>
                    </c-form-item>
                    <c-form-item label="机构类型" prop="bchtyp" v-if="this.deptInfo.lev != '2'" style="width: 100%">
                        <c-select v-model="deptInfo.bchtyp" style="width: 100%" dbCode="BCHTXT" :expKey="['7']" :disabled="filedDisabled" @change="changeTyp()">
                        </c-select>
                    </c-form-item>
                </c-col>
                <c-col :span="11" >
                    <c-form-item label="BIC编码" prop="swfcod">
                        <c-input event-render="loadText" v-model="deptInfo.swfcod" 
                            type="text"  maxlength="12" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
            </c-row>
            <c-row>
                <c-col :span="11" >
                    <c-form-item label="机构中文名称" prop="bchname">
                        <c-input event-render="loadText" v-model="deptInfo.bchname"
                            type="text"  maxlength="62" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
                <c-col :span="11" >
                    <c-form-item label="机构英文名称" prop="namen">
                        <c-input event-render="loadText" v-model="deptInfo.namen" 
                            type="text"  maxlength="62" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
            </c-row>
            <c-row>
                <c-col :span="11" >
                    <c-form-item label="机构标识" prop="bchflg">
                        <c-input event-render="loadText" v-model="deptInfo.bchflg"
                            type="text"  maxlength="2" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
                <c-col :span="11" >
                    <c-form-item label="金融机构编码" prop="decnum">
                        <c-input event-render="loadText" v-model="deptInfo.decnum"
                            type="text"  maxlength="40" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
            </c-row>
            <c-row>
                <c-col :span="11" >
                    <c-form-item label="电话" prop="tel">
                        <c-input event-render="loadText" v-model="deptInfo.tel" 
                            type="text"  maxlength="30" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
                <c-col :span="11" >
                    <c-form-item label="传真" prop="fax">
                        <c-input event-render="loadText" v-model="deptInfo.fax"
                            type="text"  maxlength="16" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
            </c-row>
            <c-row>
                <c-col :span="11" >
                    <c-form-item label="中文地址" prop="adr">
                        <c-input event-render="loadText" v-model="deptInfo.adr" 
                            type="text"  maxlength="40" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
                <c-col :span="11" >
                    <c-form-item label="中文地址2" prop="adr2">
                        <c-input event-render="loadText" v-model="deptInfo.adr2"
                            type="text"  maxlength="60" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
            </c-row>
            <c-row>
                <c-col :span="11" >
                    <c-form-item label="英文地址" prop="adren">
                        <c-input event-render="loadText" v-model="deptInfo.adren"
                            type="text"  maxlength="40" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
                <c-col :span="11" >
                    <c-form-item label="英文地址2" prop="adren2">
                        <c-input event-render="loadText" v-model="deptInfo.adren2"
                            type="text"  maxlength="40" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
            </c-row>
            <c-row>
                <c-col :span="11" >
                    <c-form-item label="联行行号" prop="lhanum">
                        <c-input event-render="loadText" v-model="deptInfo.lhanum" 
                            type="text"  maxlength="12" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
                <c-col :span="11" >
                    <c-form-item label="联行名称" prop="lhanam">
                        <c-input event-render="loadText" v-model="deptInfo.lhanam"
                            type="text"  maxlength="60" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
            </c-row>
            <c-row>
                <c-col :span="11" >
                    <c-form-item label="电证联行行号" prop="dzlhhh">
                        <c-input event-render="loadText" v-model="deptInfo.dzlhhh" 
                            type="text"  maxlength="12" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
                <c-col :span="11" >
                    <c-form-item label="电证联行名称" prop="dzlhmc">
                        <c-input event-render="loadText" v-model="deptInfo.dzlhmc"
                            type="text"  maxlength="60" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
            </c-row>
            <c-row>
                <c-col :span="11" >
                    <c-form-item label="核心虚拟柜员" prop="bchusr" :rules="(deptInfo.bchtyp == '1' || deptInfo.bchtyp == '6') ? rules.bchusr : [{required: false}]">
                        <c-input event-render="loadText" v-model="deptInfo.bchusr" 
                            type="text"  maxlength="8" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
                <c-col :span="11" >
                    <c-form-item label="核心柜员2" prop="bchusr2" :rules="[{required: false}]">
                        <c-input event-render="loadText" v-model="deptInfo.bchusr2" 
                            type="text"  maxlength="8" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
            </c-row>
            <c-row>
                <c-col :span="11" >
                    <c-form-item label="自贸区标志" prop="zmqflg">
                        <el-radio-group v-model="deptInfo.zmqflg" :disabled="filedDisabled" @change="changeDiscod()">
                            <el-radio label="X">是</el-radio>
                            <el-radio label=" ">否</el-radio>
                        </el-radio-group>
                    </c-form-item>
                </c-col>
                <c-col :span="11" >
                    <c-form-item label="国内地区码" prop="discod" :rules="(deptInfo.zmqflg == 'x' || deptInfo.zmqflg == 'X') ? rules.discod : [{required: false}]">
                        <c-input event-render="loadText" v-model="deptInfo.discod" 
                            type="text"  maxlength="6" :disabled="filedDisabled || (deptInfo.zmqflg != 'x' && deptInfo.zmqflg != 'X')">
                        </c-input>
                    </c-form-item>
                </c-col>
            </c-row>
            <c-row>
                <c-col :span="11" >
                    <c-form-item label="机构负责人" prop="bchfzr">
                        <c-input event-render="loadText" v-model="deptInfo.bchfzr"
                            type="text"  maxlength="100" :disabled="filedDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
                <c-col :span="11" >
                    <c-form-item label="外汇管理局印单代码" prop="ydjcod">
                        <c-input event-render="loadText" v-model="deptInfo.ydjcod" 
                            type="text"  maxlength="6" :disabled="ydjcodDisabled">
                        </c-input>
                    </c-form-item>
                </c-col>
            </c-row>
            <div class="text-center">
                <c-button type="primary" icon="el-icon-search" :loading="loadingStatus"
                    style="margin-right:50px;margin-bottom:25px" @click="submitForm()" v-show="visiableSubmitBtn">
                提交
                </c-button>
                <el-tooltip effect="light" content="新增国结机构信息的同时会新增该机构的机构权限信息" placement="left">
                    <c-button type="primary" icon="el-icon-search" :loading="false"
                        style="margin-right:50px;margin-bottom:25px" @click="showSubmitBtn()" v-show="visiableAddBtn">
                    新增
                    </c-button>
                </el-tooltip>
                <c-button type="primary" icon="el-icon-search" :loading="false"
                    style="margin-right:50px;margin-bottom:25px" @click="showSubmitBtn()" v-show="visiableEditBtn">
                修改
                </c-button>
                <c-button type="primary" icon="el-icon-refresh" :loading="false"
                 @click="resetForm()">
                重置
                </c-button>
            </div>
        </el-form>
    </div>
</template>
<script>
import DeptModel, { Pattern } from "./DeptModel.js";
import { saveDeptInfo, getDeptInfo } from "~/service/manage/dept.js";
import Utils from "~/utils";
export default {
    data(){
        return {
            rules:Pattern,
            deptInfo: new DeptModel().data.deptInfo,
            oldDeptInfo: new DeptModel().data.deptInfo,
            visiableSubmitBtn: true,// 【提交】按钮
            visiableAddBtn: false,  // 【新增】按钮
            visiableEditBtn: false, // 【修改】按钮
            filedDisabled: true,    // 通用字段
            ydjcodDisabled: true,   // 外汇管理局印单代码字段 禁用
            currentlySelectedBranch: '', // 当前选择的机构编码
            loadingStatus:false,
            oldDiscod:'',
        }
    },
    methods:{
        //【重置】按钮
        resetForm(){
            this.getDeptDetailInfo(this.currentlySelectedBranch);
        },

        // 显示【修改】按钮
        showEditBtn(){
            this.visiableEditBtn = true;
            this.visiableSubmitBtn = false;
            this.visiableAddBtn = false;
            this.filedDisabled = true;
            this.ydjcodDisabled = true;
        },

        // 显示【提交】按钮
        showSubmitBtn(){
            this.visiableSubmitBtn = true;
            this.visiableAddBtn = false;
            this.visiableEditBtn = false;
            this.filedDisabled = false;
            this.ydjcodDisabled = true;
        },

        //【提交】按钮
        submitForm(){
            this.$refs.deptInfoForm.validate((validated) => {
				if(validated){
                    this.loadingStatus = true;
                    saveDeptInfo(this.deptInfo)
                        .then((res)=>{
                            this.showEditBtn();
                            this.loadingStatus = false;
                            this.$notify.success("保存成功!");
                        })
                        .catch((err)=>{
                            this.loadingStatus = false;
                            this.$notify.error("保存失败!");
                        });
				} else {
 					Utils.formValidateTips(this.$refs.deptInfoForm.fields)
				}
			})
        },

        changeTyp(){
            if(this.deptInfo.bchtyp == '1' || this.deptInfo.bchtyp == '6'){
                this.ydjcodDisabled = false;
            } else {
                this.deptInfo.ydjcod = '';
                this.ydjcodDisabled = true;
            }
        },

        // 获取国结机构详情信息
        getDeptDetailInfo(branchVal){
            this.currentlySelectedBranch = branchVal;
            getDeptInfo(branchVal)
                .then((res)=>{
                    this.deptInfo = res;
                    this.oldDiscod = this.deptInfo.discod;
                    // 初始化时页面字段灰显
                    this.filedDisabled = true;
                    this.ydjcodDisabled = true;
                    // 存在bch记录
                    if(res.bchinr != null && res.bchinr != ''){
                        // 加载bch记录
                        this.loadDeptInfo(res);
                    } else {
                        // 初始化
                        this.initDeptInfo(res);
                    }
                    if(this.deptInfo.branch == null || this.deptInfo.branch == 'undefined' || this.deptInfo.branch == ''){
                        this.deptInfo.branch = branchVal;
                    }
                })
                .catch((err)=>{
                    this.$notify.error("查询失败!");
                });
        },

        // 不存在bch记录,初始化
        initDeptInfo(res){
            // 显示【新增】按钮
            this.visiableAddBtn = true;
            // 隐藏【提交】【修改】按钮
            this.visiableSubmitBtn = false;
            this.visiableEditBtn = false;
            this.deptInfo.bchname = res.ecMechanismd.jigomc;
            this.deptInfo.swfcod = res.ecMechanismd.ynhbic;
            this.deptInfo.namen = res.ecMechanismd.jgywmc;
            this.deptInfo.decnum = res.ecMechanismd.waigdm;
            this.deptInfo.tel = res.ecMechanismd.dianhh;
            var adrTmp = res.ecMechanismd.dizhii;
            if(adrTmp != '' && adrTmp != null && adrTmp != 'undefined'){
                this.deptInfo.adr = adrTmp.substring(0,40);
                this.deptInfo.adr2 = adrTmp.substring(41);
            }
            this.deptInfo.lhanum = res.ecMechanismd.lianhh;
            this.deptInfo.bchfzr = res.ecMechanismd.lnxirm;
            // branch 机构级别
            if(res.levels == '0'){
                this.deptInfo.lev = '0';
            } else if(res.levels == '1'){
                this.deptInfo.lev = 'A';
            } else if(res.levels == '2'){
                this.deptInfo.lev = 'B';
            } else {
                if(res.name.indexOf('分行') != -1){
                   this.deptInfo.lev = '1'; 
                } else if(res.name.indexOf('支行') != -1){
                    this.deptInfo.lev = '2';
                }
            }
            
        },
        // 存在bch记录,进行页面字段赋值
        loadDeptInfo(res){
            // 显示【修改】按钮
            this.visiableEditBtn = true;
            // 隐藏【提交】【新增】按钮
            this.visiableSubmitBtn = false;
            this.visiableAddBtn = false;
            if(res.zmqflg == '' || res.zmqflg == ' ' || res.zmqflg == 'Empty'){
                this.deptInfo.zmqflg = ' ';
            } else {
                this.deptInfo.zmqflg = res.zmqflg;
            }
        },

        changeDiscod(){
            if(this.deptInfo.zmqflg != 'x'){
                this.deptInfo.discod = '';
            } else {
                this.deptInfo.discod = this.oldDiscod;
            }
        },

        changeLev(){
          this.deptInfo.bchtyp = ''
        }
    }
}
</script>