kly_uniapp/pages/activity/index.vue

<!-- 活动列表 -->

<template>
	<!-- 现场经理或未登录显示 -->
	<navigator style="margin-top: 100upx;" v-if="isTrader2 == 1" url="../login/index"
		class="main_btn_m get_phone to_login">
		去登陆商户</navigator>
	<view v-else>
		<view class="loading_text" v-if="loading">加载中...</view>
		<view v-else>
			<!-- 非商户 -->
			<view class="main_width" v-if="sys_role==0">
				<navigator class="nav" :url="'./detail?id='+item.id" v-for="item in data" :key="item.id">
					<image style="width: 100%;height: 300rpx;" :src="item.list_photos[0]['url']"></image>
					<view class="title">
						<view style="color: white;" class="text_in_width nowrap">{{item.title}}
						</view>
					</view>
				</navigator>
			</view>
			<view v-else>
				<!-- 非现场经理商家显示 -->
				<view>
					<navigator :style="'background-color:'+(style_arr[index%4]['bgc'])" :url="'./detail?id='+item.id"
						v-for="(item, index) in data" :key="item.id" class="mer_each">
						<view style="height: 50upx;"></view>
						<view class="big_title" :style="'color:'+(style_arr[index%4]['color'])">
							{{item.title}}
						</view>
						<view class="small_title" :style="'margin-top: 20upx;color:'+(style_arr[index%4]['color'])">
							{{item.title2}}
						</view>
					</navigator>
				</view>
			</view>
		</view>
		<view class="loading_text" v-if="data.length==0&&!loading">暂无数据</view>
	</view>
</template>

<script>
	import commonData from '../../commonData.js'
	import commonFun from '../../commonFun.js'

	export default {
		data() {
			return {
				loading: true,
				isTrader2: 2,
				FOREND_TOKEN: 'a',
				sys_role: commonData.sys_role,
				style_arr: [{
						color: '#00C7B2',
						bgc: '#f5fefb',
					},
					{
						color: '#fd653c',
						bgc: '#fff8f6',
					},
					{
						color: '#ffb90b',
						bgc: '#fffdf1',
					},
					{
						color: '#00a5ad',
						bgc: '#efffff',
					},
				],
				data: [],
			}
		},
		methods: {
			get_data() {
				if (this.isTrader2 == 1 || this.FOREND_TOKEN == '') {
					uni.stopPullDownRefresh()
					return
				}

				this.loading = true
				uni.showLoading({
					title: '加载中...',
					mask: true
				})
				let params = {
					bizCatalog: this.sys_role == 0 ? 'MActivityEntity' : 'TraServiceEntity',
					handleMode: 'fetchall',
					pageIndex: 1,
					pageSize: 1000,
					orderby: 0,
					nowLngLat: "117.68898010253906,39.0351862510659",
					query: {
						status: 5
					}
				}
				console.log('营销活动列表请求参数')
				console.log(params)
				commonFun.requestUrl('&WsAjaxBiz=' + (this.sys_role == 1 ? 'Trader' : 'Public') +
					'&WsAjaxAction=fetchPageData', params, res => {
						if (res.status) {
							this.data = res.data.Result.pageData
							console.log('营销活动获取数据')
							console.log(this.data)
						}
						this.loading = false
						uni.hideLoading()
						uni.stopPullDownRefresh()
					})
			},
		},
		onLoad() {
			if (this.sys_role == 1) {
				uni.setNavigationBarTitle({
					title: '服务'
				})
			}
		},
		onShow() {
			let isTrader2 = uni.getStorageSync('isTrader2') || 2 //设置isTrader2为是否是现场经理
			this.isTrader2 = isTrader2
			if (isTrader2 != 1) {
				this.get_data()
			}
		},
		onPullDownRefresh() {
			if (this.isTrader2 != 1) {
				this.get_data()
			}
		},
	}
</script>

<style>
	.big_title {
		font-size: 34upx !important;
	}

	.small_title {
		font-size: 28upx !important;
		margin-top: 15upx;
	}

	.mer_each view {
		padding:0 24upx;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.mer_each {
		width: 336upx;
		height: 221upx;
		background-color: #f7fdfb;
		border-radius: 12upx;
		float: left;
		margin-left: 26upx;
		margin-top: 26upx;
		overflow: hidden;
	}

	.nav {
		position: relative;
		border-radius: 15upx;
		overflow: hidden;
		margin-top: 30upx;
	}

	.title {
		color: white;
		background-color: rgba(0, 0, 0, 0.4);
		text-align: left;
		width: 100%;
		line-height: 70upx;
		position: absolute;
		bottom: 10upx;
		left: 0;
	}
</style>