hs_hzl_uniapp_ml/pages/user/notification.vue

<template>
	<view>
		<u-list @scrolltolower="scrolltolower" class="view">
			<view class="hand">
				<u-row>
					<u-col span="8">
						<view class="orgTop">
							<uni-row>
								<uni-col :span="12">
									<u--text text="所属机构" size="22" bold color="#619f8a"></u--text>
								</uni-col>
								<uni-col :span="12">
									<u--text :text="data.organizationName" size="22" bold color="#757575">
									</u--text>
								</uni-col>
							</uni-row>
						</view>
					</u-col>
					<!--<u-col span="4">
								<view>
									<u-button class="sxButton" size="normal" loadingMode="circle" color="#65c1aa">统计查看
									</u-button>
								</view>
							</u-col> -->
				</u-row>
			</view>
			<u-list-item v-for="(item, index) in indexList" :key="index">
				<view class="listItemStyle">
					<view class="nitTitleLocation">
						<u--text :text="item.nitTitle" size="24" bold></u--text>
					</view>
					<view class="nitCententLocation">
						<u--text :text="item.nitCentent" size="18"></u--text>
					</view>
					<view class="nitDateLocation">
						<u--text :text="item.nitDate" size="12" color="#a1a1a1"></u--text>
					</view>
					<view>
						<u-gap height="1" bgColor="#b6b6b6"></u-gap>

					</view>
					<view>
						<u-cell-group :border="false">
							<u-cell title="查看详情" :isLink="true" arrow-direction="left" :border="false"></u-cell>
						</u-cell-group>
					</view>
				</view>
			</u-list-item>
			<br>
			<br>
		</u-list>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dateShow: false,
				data: {
					organizationName: "暂无机构",
				},
				from: {},
				indexList: []
			}
		},
		onLoad() {
			//this.getRechargeHistoryList()
		},
		methods: {
			async getRechargeHistoryList() {

				this.from.userName = uni.getStorageSync('userInfo').userName
				const orgInfo = uni.getStorageSync('orgInfo');
				this.from.organizationCode = orgInfo.organizationCode
				this.data.organizationName = orgInfo.organizationName
				// 发送请求
				const {
					data: res
				} = await this.$httpRequest({
					url: '/app',
					method: 'post',
					data: this.from
				});
				if (res.code === 200) {
					uni.showToast({
						duration: 1500,
						icon: 'checkmark'
					});
					this.loadmore(res.data)
				}
			},
			submitDate(e) {
				this.dateShow = false
				//使用change事件中的日期数据 防止用户快速滑动同时点击确定后数据丢失
				this.from.date = this.changeDate
				//获取消费信息
				this.indexList = this.getRechargeHistoryList()
			},
			change(e) {
				this.changeDate = this.result(e.value, e.mode)
			},
			scrolltolower() {
				//this.getRechargeHistoryList()
			},
			loadmore(data) {
				for (var i = 0; i < data.length; i++) {
					this.indexList.push(data[i])
				}
			},

			result(time, mode) {
				const timeFormat = uni.$u.timeFormat
				switch (mode) {
					case 'datetime':
						return timeFormat(time, 'yyyy-mm-dd hh:MM')
					case 'date':
						return timeFormat(time, 'yyyy-mm-dd')
					case 'year-month':
						return timeFormat(time, 'yyyy-mm')
					case 'time':
						return time
					default:
						return ''
				}
			}
		}
	}
</script>

<style>
	.view {
		background-color: #ebebeb;
	}

	.hand {
		padding: 5%;
		margin: 0 10px;
		border-radius: 15px;
		background: linear-gradient(to bottom right, #97dad8, #f1fef9);
	}

	.orgTop {
		margin-bottom: 5px;
	}

	.sxButton {
		width: 100px;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.listTermDate {
		padding: 10px 0;
	}

	.listItemStyle {
		margin: 10px 12px;
		padding: 5px;
		border-radius: 15px;
		background-color: #fafafa;
	}

	.nitTitleLocation {
		margin: 10px 0 0 10px;
	}

	.nitCententLocation {
		margin: 10px 0 0 10px;

	}

	.nitDateLocation {
		margin: 10px 0 10px 10px;
	}
</style>