pay-video-applet-uniapp-24-8-22/pages_mine/mine/incomeRecord.vue

<template>
	<view class="incomeRecord">
		<!--顶部导航栏-->
		<navbar leftClick @leftClick="$utils.navigateBack" title="收益记录" />


		<!--内容区域-->
		<view class="content">
			<view class="title">收益记录</view>

			<view class="list">
				<view class="item" v-for="(item,index) in list" :key="index">
					<view class="left">
						<image src="../static/incomeRecord/1.png" style="width: 70%;height: 70%;"></image>
					</view>
					<view class="center">
						<view>{{ item.userId }}</view>
						<view>{{ item.createTime }}</view>
					</view>
					<view class="right">
						<view>收益金额</view>
						<view>￥{{item.price}}</view>
					</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import mixinsList from '@/mixins/list.js'
	export default {
		mixins: [mixinsList],
		data() {
			return {
				mixinsListApi : 'infoGetIncomePage',
			};
		},
		mounted() {
			this.getData()
		},

		methods: {
		}
	}
</script>

<style lang="scss" scoped>
	.incomeRecord {
		.content {
			padding: 0 40rpx;

			.title {
				font-weight: bold;
				margin-top: 5%;
			}

			.list {
				padding-top: 50rpx;

				.item {
					display: flex;
					gap: 20rpx;
					//height: 80rpx;
					margin-bottom: 40rpx;


					.left {
						display: flex;
						justify-content: center;
						align-items: flex-start;
						width: 15%;

					}

					.center {
						width: 60%;
					}

					.right {
						width: 30%;
						text-align: center;
					}
				}
			}
		}
	}
</style>