Files
shangfutong-ui/jeepay-ui-uapp-agent/pages/statistics/components/AgentList.vue
2024-05-23 14:39:33 +08:00

122 lines
3.2 KiB
Vue

<template>
<JPopup ref="popup" @onClose="onClose">
<view class="list-wrapper">
<view class="list-header">
<view class="list-title">
<image src="/static/iconImg/left-black.svg" mode="scaleToFill" @tap="popup.close()" />
单个子代理商
</view>
<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" @HandleTouch="confirm">确认</JButton>
</view>
</view>
</JPopup>
</template>
<script setup>
import { onMounted, reactive, ref } from "vue"
import { $getAgentList } from "@/http/apiManager.js"
import JPopup from "@/components/newComponents/JPopup/JPopup"
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 emits = defineEmits(["confirm"])
const searchInfo = ref({
pageNumber: 1,
pageSize: 10,
})
let flag = true
const list = ref([])
const agentNo = ref({})
const popup = ref()
const open = (val) => {
if (val) agentNo.value.text = val.agentNo
uni.hideTabBar()
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)
}
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: 500rpx;
background-color: #fff;
}
.list-footer {
padding: 30rpx 0 50rpx 0;
background-color: #fff;
}
}
</style>