121 lines
3.1 KiB
Vue
121 lines
3.1 KiB
Vue
<template>
|
|
<JPopup ref="popup">
|
|
<JMainCard pd="0" wrapPd="0 30rpx">
|
|
<view class="title">请选择渠道</view>
|
|
<view class="list-wrapper">
|
|
<block v-for="(v, i) in channelList" :key="i">
|
|
<view class="list" @tap="selected(v)">
|
|
<view class="list-left">
|
|
<view class="imag-wrapper" :style="{ backgroundColor: v.bgColor }">
|
|
<image :src="v.icon" mode="" />
|
|
</view>
|
|
<view>
|
|
<view class="l-f-top"> {{ v.isvName }} </view>
|
|
<view class="l-f-bottom">{{ v.isvNo }}</view>
|
|
</view>
|
|
</view>
|
|
<view class="list-selected" v-if="codeInfo.ifCode === v.ifCode">
|
|
<image src="/static/equipmentImg/check.svg" mode="scaleToFill" />
|
|
</view>
|
|
</view>
|
|
</block>
|
|
</view>
|
|
</JMainCard>
|
|
<JButton pd="30rpx 30rpx 50rpx 30rpx" bgColor="#f2f2f2" color="#000" pdTop="0" @HandleTouch="popup.close()">取消
|
|
</JButton>
|
|
</JPopup>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from "vue"
|
|
import { $rateConfig, $getAcountInfo,$getIsvInfoList } from "@/http/apiManager.js"
|
|
import JPopup from "@/components/newComponents/JPopup/JPopup"
|
|
import JMainCard from "@/components/newComponents/JMainCard/JMainCard"
|
|
import JButton from "@/components/newComponents/JButton/JButton"
|
|
const emits = defineEmits(["selected"])
|
|
const popup = ref(null)
|
|
const channelList = ref([])
|
|
const codeInfo = ref("")
|
|
// 定义父组件的传值
|
|
const props = defineProps({
|
|
channelRange: { type: String, default:0 }, // 当前配置的所属infoId
|
|
channelIfCode: { type: String ,default: '' }, // 默认选中的支付接口
|
|
infoId: { type: String ,default: '' }, // 默认选中的支付接口
|
|
})
|
|
console.log(props,'propsprops');
|
|
const open = () => {
|
|
getList()
|
|
popup.value.open()
|
|
}
|
|
const getList = () => {
|
|
console.log(props,'propsprops')
|
|
$getIsvInfoList({pageNumber:-1,ifCode:props.channelIfCode,range:props.channelRange,infoId:props.infoId}).then(({ bizData }) => {
|
|
channelList.value=bizData.records
|
|
console.log(bizData);
|
|
})
|
|
}
|
|
const selected = (val) => {
|
|
emits("selected", val)
|
|
popup.value.close()
|
|
}
|
|
defineExpose({ open })
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.title {
|
|
padding: 30rpx;
|
|
text-align: center;
|
|
border-bottom: 1rpx solid #999;
|
|
}
|
|
|
|
.list-wrapper {
|
|
height: calc(100vh - 500rpx);
|
|
padding-bottom: 40rpx;
|
|
overflow-y: scroll;
|
|
|
|
.list {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 30rpx;
|
|
|
|
.list-left {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
|
|
.imag-wrapper {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 52rpx;
|
|
height: 52rpx;
|
|
border-radius: 50%;
|
|
margin-right: 20rpx;
|
|
|
|
image {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
border-radius: 50%;
|
|
}
|
|
}
|
|
|
|
.l-f-top {
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.l-f-bottom {
|
|
margin-top: 15rpx;
|
|
font-size: 22rpx;
|
|
color: #666f80;
|
|
}
|
|
}
|
|
|
|
.list-selected {
|
|
image {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
}
|
|
}
|
|
}
|
|
}</style>
|