源文件
This commit is contained in:
120
jeepay-ui-uapp-agent/pageApply/components/SelectedIsv.vue
Normal file
120
jeepay-ui-uapp-agent/pageApply/components/SelectedIsv.vue
Normal file
@@ -0,0 +1,120 @@
|
||||
<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>
|
||||
Reference in New Issue
Block a user