jp-youdian-Inspection/pages/myTab/feedbackList.vue

<template>
	<view>
		<u-navbar title="反馈记录" title-color="#101010"></u-navbar>
		<view class="record" v-if="0">
			<view class="title">
				<view class="classify">
					功能异常
				</view>
				<view class="date">
					2024-02-04 20:00:00
				</view>
			</view>
			<view class="content">
				在使用用电监控APP时，发现数据刷新偶有延迟，实时性不足；电量消耗统计与实际存在偏差，准确性有待提升。影响用户体验，建议优化性能并校准数据准确性。
			</view>
			
			<view class="picture">
				<!-- <image class="img" src="../../assets/img/feedbackPic.png"  mode=""></image> -->
			</view>
		</view>
		<u-divider :isnone="list.length==0" nonetext="没有找到相关内容" border-color="#CFD2D5">已经到底了</u-divider>
		
		<!-- 底部 -->
		<view class="bottom" v-if='0'>
			<button class="fill-in">填写反馈</button>
		</view>
	</view>
</template>

<script>
	
	export default {
	
		data() {
			return {
				title: "场站列表",
				list: [],
				listForm: {
					pageIndex: 1,
					pageSize: 20,
					recordsTotal: 1,
				},
				
			};
		},
		onLoad(op) {
	
			this.getList()
		},
		onReachBottom() {
			if (this.list.length < this.listForm.recordsTotal) {
				this.myLoadmore();
			}
		},
		methods: {
	
			myLoadmore() {
				this.listForm.pageIndex += 1;
				this.getList()
			},
			getList() {
				return
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
	
				API.floorlockList(this.listForm).then((res) => {
					var list = []
	
					if (this.listForm.pageIndex == 1) {
						list = res.data.data;
					} else {
						list = [
							...list,
							...res.data.data
						];
					}
					this.list = res.data.data
					uni.hideLoading();
	
				}).catch(error => {
	
					uni.hideLoading();
					uni.showToast({
						title: error,
						icon: "none"
					})
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.record{
		margin-top: 24rpx;
		background-color: #fff;
		padding: 32rpx;
		.title{
			display: flex;
			align-items: center;
			justify-content: space-between;
			.classify{
				color: rgba(22,119,255,1);
				font-size: 32rpx;
			}
			.date{
				color: rgba(119,119,119,1);
			}
		}
		.content{
			color: rgba(51,51,51,1);
			line-height: 44rpx;
			margin-top: 16rpx;
		}
		.picture{
			margin-top:24rpx;
			display: flex;
			justify-content: space-between;
			.img{
				width: 144rpx;
				height: 144rpx;
				border-radius: 8rpx;
			}
		}
	}
	// 底部
	.bottom{
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: #fff;
		padding: 20rpx 32rpx;
		.fill-in{
			
			line-height: 80rpx;
			border-radius: 8rpx;
			background-color: rgba(22,119,255,1);
			color: rgba(255,255,255,1);
			font-size: 32rpx;
		}
	}

</style>