You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
349 lines
11 KiB
349 lines
11 KiB
<template>
|
|
<div class="edit-address">
|
|
<div class="edit-address-box" v-if="transferAccountsType == 1">
|
|
<div class="edit-address-title-hd">{{ itemList.msgText }}</div>
|
|
<div class="edit-address-edit-box" v-if="networkPickShow">
|
|
<van-field readonly clickable label-class="edit-box-cell" name="picker" v-model="selectedNetwork" label="业务类型"
|
|
placeholder="请选择业务类型" right-icon="arrow" :disabled="disabled"
|
|
@click.stop="!disabled && (selectedNetworkShow = true)">
|
|
</van-field>
|
|
<div v-if="networkPickShowtishi" style="text-align: right; color: red; font-size: 0.32rem">
|
|
请选择业务类型
|
|
</div>
|
|
</div>
|
|
|
|
<div class="edit-address-edit-box" v-if="areaListPickShow">
|
|
<van-field readonly clickable label-class="edit-box-cell" name="picker" v-model="selectedCompany" label="所在地区"
|
|
placeholder="点击此处选择分公司/支公司" right-icon="arrow" :disabled="disabled" @click.stop="areaListPickClick">
|
|
</van-field>
|
|
<div v-if="areaListPickShowtishi" style="text-align: right; color: red; font-size: 0.32rem">
|
|
请选择所在分、支公司
|
|
</div>
|
|
</div>
|
|
|
|
<div class="van-address-edit-btn">
|
|
<van-button round block color="#5A9CFF" :disabled="submitDisabled || disabled" :loading="submitLoad" type="info"
|
|
loading-text="变更中..." @click.stop="submitInfo">确 认</van-button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="networkInfo" v-else>
|
|
<template v-if="networkInfo && networkInfo.infos && networkInfo.infos.length > 0">
|
|
<div>
|
|
<div class="networkInfo-title displayleft" style="margin: 10px 0; font-size: 16px; align-items: center">
|
|
<img src="../assets/images/company.png" style="width: 19px; height: 17px; margin-right: 8px" alt="" />
|
|
<div>{{ networkInfo.orgName }}</div>
|
|
</div>
|
|
|
|
<div v-for="(items, indexs) in networkInfo.infos" :key="indexs"
|
|
:style="{ 'border-top': indexs > 0 ? '1px dashed #666' : '' }">
|
|
<div class="displayleft" style="margin: 10px 0">
|
|
<div style="width: 80px; color: #f58019">账户类型：</div>
|
|
<div style="color: #f58019; flex: 1; font-size: 12px">
|
|
{{ items.accountType }}
|
|
</div>
|
|
</div>
|
|
<div class="displayleft" style="margin: 10px 0">
|
|
<div style="width: 80px">转账银行：</div>
|
|
<div style="color: #666; flex: 1; font-size: 12px">
|
|
{{ items.transBank }}
|
|
</div>
|
|
</div>
|
|
<div class="displayleft" style="margin: 10px 0">
|
|
<div style="width: 80px">转账时效：</div>
|
|
<div style="color: #666; flex: 1; font-size: 12px">
|
|
{{ items.transTime }}
|
|
</div>
|
|
</div>
|
|
<div class="displayleft" style="margin: 10px 0" v-if="items.remark">
|
|
<div style="width: 80px">
|
|
备<span style="opacity: 0">备注</span>注：
|
|
</div>
|
|
<div style="color: #666; flex: 1; font-size: 12px">
|
|
{{ items.remark }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<template v-else>
|
|
<div style="text-align: left; font-size: 14px; color: #666">
|
|
暂无数据
|
|
</div>
|
|
</template>
|
|
</div>
|
|
|
|
<van-popup class="edit-address-popup-box" v-model:show="isEditShow" get-container="body" position="bottom"
|
|
:duration="0.2">
|
|
<van-picker show-toolbar value-key="name" :columns="columns" :item-height="40" @cancel="onCompanyCancel"
|
|
@confirm="onCompanyConfirm" @change="companyChange" />
|
|
</van-popup>
|
|
|
|
<van-popup class="edit-address-popup-box" v-model:show="selectedNetworkShow" get-container="body" position="bottom"
|
|
:duration="0.2">
|
|
<van-picker show-toolbar value-key="title" :columns="selectedNetworkColums" :item-height="40"
|
|
@cancel="selectedNetworkShow = false" @confirm="onNetworkConfirm" />
|
|
</van-popup>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, inject, onMounted, nextTick } from 'vue'
|
|
import { showToast, Field, Button, Popup, Picker } from 'vant'
|
|
import { pcaList } from '@/mock/network-code'
|
|
|
|
const props = defineProps({
|
|
disabled: { type: Boolean, default: false },
|
|
itemList: { type: Object, default: () => ({}) }
|
|
})
|
|
|
|
const store = inject('appStore', null)
|
|
const userId = inject('userId', ref(''))
|
|
const sessionId = inject('sessionId', ref(''))
|
|
const source = inject('source', ref(''))
|
|
const mescrollContent = inject('mescrollContent', ref(null))
|
|
|
|
const Networkinf = { yhzzsx: 0, fhzzsx: 2, scjzzsx: 3, wnzhzzsx: 4, tbzzsx: 6, dkzzsx: 1, lpzzsx: 5 }
|
|
|
|
const areaList = pcaList
|
|
const isEditShow = ref(false)
|
|
const columns = ref([])
|
|
const changeCompany_fen = ref('')
|
|
const company_fen = ref('')
|
|
const company_zhi = ref('')
|
|
const selectedCompany = ref('')
|
|
const submitLoad = ref(false)
|
|
const submitDisabled = ref(false)
|
|
const networkInfo = ref([])
|
|
const selectedNetwork = ref('')
|
|
const businessType = ref('')
|
|
const selectedNetworkShow = ref(false)
|
|
const selectedNetworkColums = ref([])
|
|
const networkPickShow = ref(false)
|
|
const areaListPickShow = ref(true)
|
|
const transferAccountsType = ref(1)
|
|
const networkPickShowtishi = ref(false)
|
|
const areaListPickShowtishi = ref(false)
|
|
|
|
onMounted(async () => {
|
|
submitDisabled.value = props.disabled
|
|
nextTick(() => { scrollTopBody() })
|
|
|
|
if (props.itemList.cmd == 'yhzzsx') {
|
|
networkPickShow.value = true
|
|
let param = { queryType: 1, businessType: 0 }
|
|
initPages(param)
|
|
} else if (props.itemList.cmd == '$zzsx-da') {
|
|
transferAccountsType.value = 0
|
|
await store?.dispatch?.('post', {
|
|
url: 'transTimeQuery/queryInfo',
|
|
data: Object.assign({}, props.itemList.msgText, { qaId: props.itemList.qaId })
|
|
}).then(res => {
|
|
networkInfo.value = res.data
|
|
scrollTopBody()
|
|
}).catch(error => { console.log(error) })
|
|
} else {
|
|
networkPickShow.value = false
|
|
businessType.value = Networkinf[props.itemList.cmd]
|
|
let param = { queryType: 1, businessType: businessType.value }
|
|
initPages(param)
|
|
}
|
|
})
|
|
|
|
function initPages(param) {
|
|
if (props.disabled) return
|
|
store?.dispatch?.('post', {
|
|
url: 'transTimeQuery/queryOrg',
|
|
data: param
|
|
}).then(async res => {
|
|
selectedNetworkColums.value = res.data.business
|
|
let info = []
|
|
res.data.infos.forEach(element => {
|
|
info.push({ name: element })
|
|
})
|
|
await getfenCompany(info)
|
|
}).catch(error => { console.log(error) })
|
|
}
|
|
|
|
function scrollTopBody() {
|
|
setTimeout(() => {
|
|
try {
|
|
if (mescrollContent.value) {
|
|
mescrollContent.value.scrollTop = mescrollContent.value.scrollHeight || 0
|
|
}
|
|
} catch (error) { console.log(error.message) }
|
|
}, 300)
|
|
}
|
|
|
|
function verification() {
|
|
if (networkPickShow.value && !selectedNetwork.value) {
|
|
networkPickShowtishi.value = true
|
|
return false
|
|
}
|
|
if (areaListPickShow.value && !selectedCompany.value) {
|
|
areaListPickShowtishi.value = true
|
|
return false
|
|
}
|
|
return true
|
|
}
|
|
|
|
function onNetworkConfirm(value) {
|
|
selectedNetwork.value = value.title
|
|
businessType.value = value.id
|
|
selectedNetworkShow.value = false
|
|
networkPickShowtishi.value = false
|
|
let param = { queryType: 1, businessType: businessType.value }
|
|
initPages(param)
|
|
}
|
|
|
|
function onCompanyConfirm(value, itemIndex) {
|
|
var fenIndex = itemIndex[0]
|
|
var zhiIndex = itemIndex[1]
|
|
var fen = columns.value[fenIndex]
|
|
var zhi = columns.value[fenIndex].children[zhiIndex]
|
|
company_fen.value = fen.name
|
|
company_zhi.value = zhi.name
|
|
selectedCompany.value = `${fen.name + zhi.name}`
|
|
isEditShow.value = false
|
|
areaListPickShowtishi.value = false
|
|
}
|
|
|
|
function onCompanyCancel() {
|
|
isEditShow.value = false
|
|
}
|
|
|
|
function companyChange(picker, values) {
|
|
if (values[0] !== changeCompany_fen.value) {
|
|
changeCompany_fen.value = values[0]
|
|
let param = { queryType: 2, businessType: 1, branchName: values[0] }
|
|
store?.dispatch?.('post', {
|
|
url: 'transTimeQuery/queryOrg',
|
|
data: param
|
|
}).then(res => {
|
|
let info = []
|
|
res.data.infos.forEach(element => {
|
|
info.push({ name: element, children: [{ name: '' }] })
|
|
})
|
|
columns.value[picker.getColumnIndex(0)].children = info
|
|
picker.setColumnValues(1, info)
|
|
}).catch(error => { console.log(error) })
|
|
}
|
|
}
|
|
|
|
function submitInfo() {
|
|
if (!verification()) return
|
|
let info = {
|
|
cmd: '$zzsx-da',
|
|
customerServiceName: null,
|
|
evaluation: null,
|
|
fromFlag: 2,
|
|
imgUrl: null,
|
|
intentId: '',
|
|
intents: [],
|
|
msgSource: 1,
|
|
msgText: {
|
|
businessType: businessType.value,
|
|
orgName: company_zhi.value,
|
|
userInfoId: userId.value
|
|
},
|
|
msgType: '01',
|
|
qaId: props.itemList.qaId,
|
|
reason: null,
|
|
reasonDesc: null,
|
|
reqAndResType: '05',
|
|
seatNum: '洋洋机器人',
|
|
sessionId: sessionId.value,
|
|
source: source.value,
|
|
timestamp: new Date().getTime(),
|
|
userId: 408,
|
|
userName: null,
|
|
voiceData: null,
|
|
voiceUrl: null
|
|
}
|
|
store?.commit?.('set_chatList', info)
|
|
scrollTopBody()
|
|
}
|
|
|
|
async function areaListPickClick() {
|
|
if (props.disabled) return
|
|
if (props.itemList.cmd == 'yhzzsx' && selectedNetwork.value == '') {
|
|
networkPickShowtishi.value = true
|
|
return
|
|
}
|
|
isEditShow.value = true
|
|
}
|
|
|
|
function getfenCompany(infoArray) {
|
|
company_fen.value = infoArray[0].name
|
|
changeCompany_fen.value = infoArray[0].name
|
|
let param = { queryType: 2, businessType: 1, branchName: infoArray[0].name }
|
|
store?.dispatch?.('post', {
|
|
url: 'transTimeQuery/queryOrg',
|
|
data: param
|
|
}).then(res => {
|
|
let info = []
|
|
res.data.infos.forEach(element => {
|
|
info.push({ name: element })
|
|
})
|
|
infoArray[0].children = info
|
|
columns.value = infoArray
|
|
}).catch(error => { console.log(error) })
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.displayleft {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.edit-address-title-hd {
|
|
font-family: NotoSansHans-Regular;
|
|
font-size: 14px;
|
|
line-height: 21px;
|
|
font-weight: 700;
|
|
color: #333333;
|
|
word-wrap: break-word;
|
|
word-break: break-all;
|
|
overflow: hidden;
|
|
-webkit-user-select: text;
|
|
user-select: text;
|
|
padding-bottom: 15px;
|
|
}
|
|
|
|
.edit-address-edit-box .van-cell {
|
|
padding: 10px 0;
|
|
}
|
|
|
|
.edit-address-edit-box .van-cell:not(:last-child)::after {
|
|
left: 0;
|
|
}
|
|
|
|
.edit-address-edit-box :deep(.van-field__label.edit-box-cell) {
|
|
width: 75px;
|
|
}
|
|
|
|
.code-btn.code-btn-disabled {
|
|
color: #fff !important;
|
|
opacity: 1;
|
|
border: 0;
|
|
background-color: rgba(1, 193, 96, 0.5);
|
|
}
|
|
|
|
.edit-box-checkbox-item {
|
|
padding: 20px 0 0 0;
|
|
display: inline-block;
|
|
}
|
|
|
|
.edit-box-checkbox-item :deep(.van-checkbox__label) {
|
|
margin-top: 2px;
|
|
}
|
|
|
|
.edit-address-popup-box {
|
|
width: 100%;
|
|
}
|
|
|
|
.edit-address-box .van-address-edit-btn {
|
|
padding: 30px 0 10px 0;
|
|
}
|
|
</style> |