123 lines
3.1 KiB
Vue
123 lines
3.1 KiB
Vue
<template>
|
|
<uni-popup ref="popup" type="bottom" mask-background-color="rgba(0,0,0,.5)" @change="change" :safe-area="false">
|
|
<view class="list-wrapper">
|
|
<view class="list-header">
|
|
<JSearchInput bgColor="#fff" wrapPd="0" @search="getAgentList" @resetSearch="resetSearch"></JSearchInput>
|
|
</view>
|
|
<scroll-view class="list-main" scroll-y @scrolltolower="getList">
|
|
<block v-for="v in list" :key="v.text">
|
|
<JLine v-bind="v" :isSelect="v.text === agentNo.text" @tap="selected(v)"></JLine>
|
|
</block>
|
|
<jeepayListNull :isShow="true" :list="list.length"></jeepayListNull>
|
|
</scroll-view>
|
|
<view class="list-footer">
|
|
<JButton size="max" pdTop="0" pd="30rpx" @HandleTouch="confirm">确认</JButton>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { inject, onMounted, reactive, ref } from 'vue'
|
|
import { $getAgentList } from '@/http/apiManager.js'
|
|
|
|
import JLine from '@/components/newComponents/JLine/JLine'
|
|
import JSearchInput from '@/components/newComponents/JSearchInput/JSearchInput'
|
|
import JButton from '@/components/newComponents/JButton/JButton'
|
|
import jeepayListNull from '@/components/jeepayListNull/jeepayListNull'
|
|
onMounted(() => {
|
|
getAgentList('')
|
|
})
|
|
const wrapperHidden = inject('wrapperHidden')
|
|
const emits = defineEmits(['confirm'])
|
|
const searchInfo = ref({
|
|
pageNumber: 1,
|
|
pageSize: 10,
|
|
state:1
|
|
})
|
|
let flag = true
|
|
const list = ref([])
|
|
const agentNo = ref({})
|
|
const popup = ref()
|
|
const open = () => {
|
|
agentNo.value = {}
|
|
popup.value.open()
|
|
}
|
|
const close = () => {
|
|
popup.value.close()
|
|
}
|
|
const getAgentList = (val) => {
|
|
if (val) {
|
|
list.value = []
|
|
searchInfo.value.unionAgentInfo = val
|
|
}
|
|
$getAgentList(searchInfo.value).then(({ bizData }) => {
|
|
const { records } = bizData
|
|
if (records.length <= 0) flag = false
|
|
records.forEach((v) => {
|
|
let obj = {
|
|
iconOn: '/static/navImg/nav-dailishang.svg',
|
|
iconClose: '/static/navImg/user-close.svg',
|
|
ml: '30rpx',
|
|
pd: '32rpx 32rpx 32rpx 0',
|
|
}
|
|
obj.name = v.agentName
|
|
obj.text = v.agentNo
|
|
list.value.push(obj)
|
|
})
|
|
})
|
|
}
|
|
const getList = () => {
|
|
if (!flag) return
|
|
searchInfo.value.pageNumber++
|
|
getAgentList()
|
|
}
|
|
const resetSearch = () => {
|
|
list.value = []
|
|
searchInfo.value.unionAgentInfo = ''
|
|
searchInfo.value.pageNumber = 1
|
|
searchInfo.value.pageSize = 10
|
|
getAgentList()
|
|
}
|
|
const selected = (v) => {
|
|
agentNo.value = JSON.parse(JSON.stringify(v))
|
|
}
|
|
const confirm = () => {
|
|
emits('confirm', agentNo.value)
|
|
}
|
|
const change = (e) => {
|
|
if (wrapperHidden) {
|
|
wrapperHidden(e.show)
|
|
}
|
|
}
|
|
defineExpose({ open, close })
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.list-wrapper {
|
|
padding-top: 30rpx;
|
|
background-color: #ece8f0;
|
|
border-radius: 32rpx 32rpx 0 0;
|
|
.list-header {
|
|
padding: 0 30rpx 30rpx 30rpx;
|
|
.list-title {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 30rpx;
|
|
image {
|
|
width: 50rpx;
|
|
height: 50rpx;
|
|
margin-right: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
.list-main {
|
|
height: calc(70vh - 190rpx - 110rpx);
|
|
background-color: #fff;
|
|
}
|
|
.list-footer {
|
|
background-color: #fff;
|
|
}
|
|
}
|
|
</style>
|