fangliaoxiaochengxv/subPages/authenticationList/index.vue

<template>
	<view class="app-page">
		<view class="card-box" v-for="(item,index) in mList" :key="index" @click="toDetails(item)">
			<text class="left-title">{{item.platform}}</text>
			<view class="h-view">
				<text>{{item.status == '2' ? '已认证' : item.status == '1' ? '审核中' : '未认证'}}</text>
				<u-icon name="arrow-right" color="#AEAEAE" size="15rpx" customStyle="padding: 12rpx;margin-right:8rpx">
				</u-icon>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getAuthenticationList
	} from "@/common/api/user.js";
	export default {
		data() {
			return {
				mList: []
			}
		},
		onLoad(options) {},
		onShow() {
			this.getAuthenticationList();
		},
		onPullDownRefresh() {
			this.getAuthenticationList();
			uni.stopPullDownRefresh()
		},
		methods: {
			toDetails(item){
				uni.setStorageSync('selectAuthentication',JSON.stringify(item));
				uni.navigateTo({
					url:'/subPages/authenticationDetails/index'
				})
			},
			getAuthenticationList() {
				uni.showLoading({

				})
				const data = {}
				getAuthenticationList(data)
					.then(res => {
						uni.hideLoading();
						if (res.data) {
							this.mList = res.data
						}
					})
					.catch(() => {
						uni.hideLoading();
					});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.app-page {
		width: 100%;
		display: flex;
		padding-top: 20rpx;
		align-items: center;
		flex-direction: column;
	}


	.card-box {
		width: 710rpx;
		background: #FFFFFF;
		border-radius: 15rpx 15rpx 15rpx 15rpx;
		margin: 0 auto 20rpx auto;
		display: flex;
		padding: 20rpx 0;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.h-view {
		flex: 1;
		display: flex;
		flex-direction: row;
		justify-content: flex-end;
		align-items: center;
	}

	.left-title {
		margin-left: 20rpx;
		font-size: 28rpx;
	}


	button::after {
		border: none;
	}

	.avatar-wrapper button::before {
		padding: 0;
		margin: 0;
		border-radius: 20rpx;
		background: transparent;
		border: none;
		line-height: 1;
	}

	.avatar-wrapper button::after {
		padding: 0;
		margin: 0;
		border-radius: 20rpx;
		background: transparent;
		border: none;
		line-height: 1;
	}

	.bottom-view {
		margin-bottom: var(--window-bottom);
		padding-bottom: calc(150rpx);
	}




	.bottom-menu-box {
		height: calc(150rpx);
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: flex-start;
		position: fixed;
		z-index: 9;
		background: white;
		bottom: var(--window-bottom);
		left: 0;
		right: 0;
		width: 100vw;



		.primary-btn {
			width: 713rpx;
			margin-top: 14rpx;
			height: 78rpx;
			line-height: 78rpx;
			background: #815BFF;
			border-radius: 40rpx;
			font-size: 32rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
		}

		button::after {
			height: 78rpx;
			line-height: 78rpx;
		}

		.primary-btn:active {
			opacity: 0.7;
		}
	}
</style>