鸿宇研学生前端代码
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

139 lines
2.7 KiB

<template>
<view class="page__view">
<navbar title="切换档案" leftClick @leftClick="$utils.navigateBack" color="#191919" bgColor="#FFFFFF" />
<view class="list">
<uv-radio-group
v-model="selectedId"
placement="column"
shape="circle"
size="36rpx"
iconSize="36rpx"
activeColor="#00A9FF"
@change="onRadioChange"
>
<view class="list-item" v-for="item in list" :key="item.id">
<memberCard
:data="item"
:showRadio="true"
></memberCard>
</view>
</uv-radio-group>
</view>
</view>
</template>
<script>
import { mapState } from 'vuex'
import mixinsList from '@/mixins/list.js'
import memberCard from './memberCard.vue'
export default {
mixins: [mixinsList],
components: {
memberCard,
},
data() {
return {
// todo: check key
mixinsListApi: '',
queryParams: {
pageNo: 1,
pageSize: 10,
},
selectedId: null,
}
},
computed: {
...mapState(['memberInfo']),
},
onLoad(arg) {
if (this.memberInfo?.id) {
this.memberInfo = this.memberInfo.id
}
this.getData()
},
onUnload() {
if (!this.selectedId) {
this.$store.commit('setMemberInfo', null)
return
}
const target = this.list.find(item => item.id === this.selectedId)
this.$store.commit('setMemberInfo', target)
},
methods: {
// todo: delete
getData() {
this.list = [
{
id: '001',
name: '周小艺',
userId: '15558661691',
type: 0,
},
{
id: '002',
name: '周小艺',
userId: '15558661691',
type: 0,
},
{
id: '003',
name: '周小艺',
userId: '15558661691',
type: 1,
},
{
id: '004',
name: '周小艺',
userId: '15558661691',
type: 0,
},
{
id: '005',
name: '周小艺',
userId: '15558661691',
type: 0,
},
]
},
onSelect(id) {
console.log('onSelect', id)
this.selectedId = id
},
onRadioChange(e) {
console.log('onRadioChange', e)
},
},
}
</script>
<style scoped lang="scss">
.page__view {
width: 100vw;
min-height: 100vh;
background: $uni-bg-color;
position: relative;
}
.list {
padding: 32rpx 40rpx;
&-item {
& + & {
margin-top: 24rpx;
}
}
}
</style>