<template>
<div class="eibs-tab">
<c-row>
<c-col :span="24">
<c-col :span="12" style="padding-right: 20px">
<!--========================== 不为swift格式左边 =========================================-->
<c-col :span="24">
<c-col :span="24">
<c-ptap :model="model" chooseLanguage="CN" :isAdrblk="false" :haveAdrLabel="true" :disabled="model.nidgrp.rec.hndtyp != 'OT'" @handleChange="changeApl" :argadr="{
title: $t('ptap.申请人'), grp: 'nidgrp', rol: 'apl'}" :ptytyp="model.nidgrp.rec.hndtyp=='OT'?'B,C,F':'C'" @clear="clearDeleteData(true)">
</c-ptap>
</c-col>
<!-- 增加判断nidgrp.rec.fenlishi有值时被保证人亮，为空时灰 -->
<c-col :span="24">
<c-ptap :model="model" chooseLanguage="CN" :isAdrblk="false" :haveAdrLabel="true" @handleChange="changeBdb"
:disabled="true" :disabledExtkey="true" :disabledRef="true" :argadr="{
title: $t('ptap.被担保人'), grp: 'nidgrp', rol: 'bdb'}" ptytyp="C">
</c-ptap>
</c-col>
<c-col :span="24" v-if="model.nidgrp.rec.hndtyp == 'OT'">
<c-ptap :model="model" chooseLanguage="CN" :isAdrblk="true" :haveAdrLabel="true" :disabled="true"
:requiredExtkey="model.nidgrp.rec.hndtyp == 'OT'" :argadr="{title: $t('ptap.反担保行'), grp: 'nidgrp', rol: 'iss'}"
ptytyp="B" @clear="clearDeleteData(true)">
</c-ptap>
</c-col>
<!-- <c-col :span="24" v-if="model.nidgrp.rec.hndtyp != 'OT'">
<c-ptap :model="model" chooseLanguage="CN" :isAdrblk="true" :haveAdrLabel="true" :disabled="true" :disabledExtkey="model.nidgrp.rec.hndtyp != 'OT'"
:disabledRef="model.nidgrp.rec.hndtyp != 'OT'" :argadr="{title: $t('ptap.反担保行'), grp: 'nidgrp', rol: 'ctr'}"
ptytyp="B" @clear="clearDeleteData(true)">
</c-ptap>
</c-col> -->
</c-col>
</c-col>
<c-col :span="12" style="padding-left: 20px">
<!-- ==========================不为swift格式右边=================================== -->
<c-col :span="24">
<c-col :span="24">
<c-ptap :model="model" chooseLanguage="CN" :isAdrblk="false" :haveAdrLabel="true"
:required-extkey="true"
:disabled="true" :argadr="{title: $t('ptap.备案海关'), grp: 'nidgrp', rol: 'ben'}" ptytyp="H">
</c-ptap>
</c-col>
<c-col :span="24">
<el-form-item :label="$t('hitame.其他海关已选')" prop="nidgrp.rec.ptyhgq">
<c-fullbox>
<c-input type="textarea" autosize :rows="4" v-model.trim="ptyhgqName" placeholder="" @keyup.enter.native="showHGDialog()" disabled :customModifykey="'nidgrp.rec.ptyhgq'"></c-input>
<template slot="footer">
<c-button type="primary" :disabled="model.nidgrp.ghdflg == ''" size="small" icon="el-icon-search" style="margin:0 10px 0 10px;padding: 0 12px;" @click="showHGDialog()">
</c-button>
</template>
</c-fullbox>
</el-form-item>
</c-col>
<!-- <c-col :span="24" v-if="model.nidgrp.rec.hndtyp == 'OL'">
<c-ptap :model="model" chooseLanguage="CN" :isAdrblk="true" :disabled="comper=='X'" :disabledRef="comper=='X'" :disabledExtkey="comper=='X'" :haveAdrLabel="true" :argadr="{
title: $t('ptap.通知行'), grp: 'nidgrp', rol: 'adv'}" ptytyp="B">
</c-ptap>
</c-col> -->
</c-col>
</c-col>
</c-col>
</c-row>
<!-- 弹窗 -->
<el-dialog v-dialogDrag v-if="visible" :visible="visible" title="其他海关" width="50%" :before-close="handleClose">
<div style="text-align: center">
<el-transfer
style="text-align: left; display: inline-block;"
:data="codes.transferData"
v-model="model.checkedList"
filterable
:titles="['未添加', '已添加']"
:button-texts="['移除', '添加']"
:props="{
key: 'extkey',
label: 'nam'
}"
:format="{
noChecked: '${total}',
hasChecked: '${checked}/${total}',
}">
<span slot-scope="{ option }">{{ option.extkey }} - {{ option.nam }}</span>
</el-transfer>
</div>
<span slot="footer" class="dialog-footer">
<c-button @click="cancel">取消</c-button>
<c-button type="primary" @click="save()">保存</c-button>
</span>
</el-dialog>
</div>
</template>
<script>
import event from "../event";
import Default from "../model/default";
import Api from '~/service/Api';
import commonFunctions from '~/mixin/commonFunctions.js';
import commonDepend from '~/mixin/commonDepend.js';
export default {
mixins: [commonFunctions],
inject: ["root"],
props: ["model", "codes"],
mixins: [event, Default,commonDepend],
data() {
return {
keyword: '',
visible: false,
transferData: [],
//checkedList: [],
};
},
methods: {
showHGDialog() {
this.visible = true;
this.formatNameToChecked(this.model.nidgrp.rec.ptyhgq);
this.getHaiGuanData();
// 通过nam值遍历出checkList
// let list = [];
// if(this.model.nidgrp.rec.ptyhgq){
// list = this.model.nidgrp.rec.ptyhgq.split('、');
// }
// this.codes.markList.forEach(item => {
// if(list.includes(item.nam)) {
// this.checkedList.push(item.inr);
// }else{
// return
// }
// })
},
handleClose(done) {
this.visible = false;
done();
},
cancel() {
this.visible = false;
},
async save() {
const rightData = [];
this.codes.transferData.forEach(item => {
if (this.model.checkedList.includes(item.extkey)) {
rightData.push({
extkey: item.extkey,
nam: item.nam,
inr: item.inr
});
}
});
let str = this.model.checkedList.length ? this.model.checkedList.join("@") + "@" : "";
this.model.nidgrp.rec.ptyhgq = str;
console.log(this.model.nidgrp.rec.ptyhgq,"this.model.nidgrp.rec.ptyhgq")
this.model.ptyList = rightData;
this.visible = false;
//this.model.nidgrp.bencnt = this.model.checkedList.length ? this.model.checkedList.length + 1 : 1;
this.customAddModify(this.model.nidgrp.rec, 'ptyhgq')
},
},
mounted() {
// this.getHaiGuanData();
},
watch: {
'model.ptyList'(newValue) {
if(newValue && newValue.length > 0) {
newValue.forEach(item => {
this.model.checkedList.push(item.extkey);
});
}
}
},
computed: {
comper() {
if (
this.model.transName == "nitpop" &&
this.$store.state.UserContext.currentOrg.departmentNumber == 1000
) {
return "X";
} else {
return "";
}
},
ptyhgqName: {
get() {
let nameStr = ''
let nameArr = []
//页面初始化，从数据库里带出数据
let oldptyhgq =[];
oldptyhgq = this.model.nidgrp.rec.ptyhgq.split("@");
if(this.model.checkedList.length==0&&oldptyhgq.length!=0){
if (this.codes.markList && this.codes.markList.length > 0) {
this.codes.markList.map((item) => {
if (oldptyhgq.includes(item.extkey)) {
nameArr.push(item.nam)
}
})
nameStr = nameArr.join('、')
}
}
//从弹出框里重新选择
if (this.codes.markList && this.codes.markList.length > 0) {
this.codes.markList.map((item) => {
if (this.model.checkedList.includes(item.extkey)) {
nameArr.push(item.nam)
}
})
nameStr = nameArr.join('、')
}
return nameStr
},
set(val) {
this.$emit('input', val)
}
}
}
};
</script>
<style scoped lang="less">
.eibs-tab{
/deep/ .el-transfer-panel {
width: 216px;
height: 400px;
}
/deep/ .el-checkbox-group.el-transfer-panel__list {
height: 296px;
}
/deep/ .el-checkbox {
float: left;
text-align: left;
}
/deep/ .el-transfer-panel__header .el-checkbox {
float: left;
text-align: left;
position: absolute;
}
/deep/ .el-transfer-panel__header .el-checkbox .el-checkbox__label span {
position: relative;
left: 100px;
float: right;
}
}
</style>