jiuyiUniapp/jiuyi2/pages/shop/settle.vue

<script setup>
	// 平台入驻
	import {
		ref,
		reactive,
		computed,
		getCurrentInstance,
	} from 'vue';
	import {
		onLoad,
		onReady,
	} from '@dcloudio/uni-app';
	// vuex
	import {
		useStore
	} from 'vuex'
	// 
	import api from '@/api/index.js';
	// 工具库
	import util from '@/common/js/util.js'

	// 
	const store = useStore()
	const {
		proxy
	} = getCurrentInstance()
	// 身份选择列表
	const identityList = reactive([{
			icon: '/static/store1.png',
			name: '商家入驻',
			url: '/pages/shop/store/settled',
		},
		{
			icon: '/static/store2.png',
			name: '线下店铺入驻',
			url: '/pages/shop/offline/settled',
		}
	])
	// 身份选择下标
	const identityIndex = ref(0)

	// 用户信息
	const userinfo = computed(() => store.state.userinfo)

	onLoad(() => {
		// 
	})

	/**
	 * 选择身份
	 * @param {Object} index
	 */
	function handleIdentityIndex(index) {
		if (identityIndex.value === index) return
		identityIndex.value = index
	}

	// 下一步
	function handleNext() {
		uni.navigateTo({
			url: identityList[identityIndex.value].url
		})
	}
</script>

<template>
	<view class="app">
		<view class="list">
			<view class="item fmid mtb30 mlr30 ptb20 br20 bfff" v-for="(item,index) in identityList" :key="index"
				:class="{'active': index === identityIndex}" @click="handleIdentityIndex(index)">
				<image class="wh50" :src="item.icon" mode="aspectFit" />

				<view class="name wsn mlr20 c333">{{item.name}}</view>

				<template v-if="index === identityIndex">
					<uni-icons type="circle-filled" color="#3d3d3d" />
				</template>
				<template v-else>
					<uni-icons type="circle" color="#D8D8D8" />
				</template>
			</view>
		</view>

		<view class="fill" style="height: 150rpx;"></view>

		<view class="footer plr30 bfff">
			<view class="btn lg black" @click="handleNext">下一步</view>
		</view>
	</view>
</template>

<style lang="scss">
	.img {
		width: 100%;
		height: 100%;
	}

	.list {
		.item {
			.name {
				width: 220rpx;
				font-size: 34rpx;
			}
		}
	}
</style>