H5-ThreeDoorder/pages/restaurant/index/index_kdj.vue

<template>
	<!-- 肯德基首页 -->
	<view class="content">
		<view class="stote-Logo">
			<image class="img" src="https://img.agrimedia.cn/chwl/v2/KDJLOGO.png" mode="widthFix"></image>
		</view>
		<view class="stote-operate">
			<view class="Stote-Infor">
				<view class="Stote-Infor-order">
					<navigator url="/pages/restaurant/home/home" hover-class="none">
						<view class="Stote-Infor-order-Status">
							<view class="Stote-Infor-order-Status-Title">
								自助点餐
							</view>
							<view class="Stote-Infor-order-Status-text">
								提前点餐，到店自取.
							</view>
							<view class="img-box">
								<image class="img" src="https://img.agrimedia.cn/chwl/v2/KDJ1.png"></image>
							</view>
						</view>
					</navigator>
					<view class="Stote-Infor-order-OrderS" @tap="oreder">
						<view class="Stote-Infor-order-Status-Title">
							我的订单
						</view>
						<view class="Stote-Infor-order-Status-text">
							查看订单进度
						</view>
						<view class="img-box">
							<image class="img" src="https://img.agrimedia.cn/chwl/v2/KDJ2.png"></image>
						</view>
					</view>
				</view>
				<view class="service" @tap="location">
					<view class="service-img">
						<image class="img" src="https://img.agrimedia.cn/chwl/v2/service.png" mode=""></image>
					</view>
					<view class="text">
						在线客服
					</view>
					<view class="icon iconfont icon-youjiantou"></view>
				</view>
			</view>
		</view>

	</view>
</template>
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<script>
	import {
		mapMutations
	} from 'vuex'
	// 客服链接
	import {
		KFCSERVICE
	} from '@/static/js/serviceurl.js';
	// 共用混入
	import mixin from '@/static/js/mixin/mixin.js';
	// 点餐混入
	import restaurantmixins from '@/static/js/mixin/restaurantmixins.js';

	import Vue from 'vue'
	import {
		KFCrestaurant
	} from '@/static/js/share.js';
	export default {
		mixins: [mixin, restaurantmixins],
		data() {
			return {

			}
		},
		onShow() {
			this.SETNAVINDEX(0);
		},
		onLoad() {
			// new Payment();
			// console.log(Pa/yment,'Payment');
			// new Payment({
			// 	pay_price:1,
			// 	order_sn:1,
			// 	type:1
			// });
			this.SETBRANDINFOR({
				brand_id: 1,
				brand_name: '肯德基'
			});
			// 设置微信分享标识
			this.$wx.miniProgram.postMessage({
				data:{
					title: '这里有一份超值肯德基补贴券，分享给你哦！生活好滋味，尽在肯德基。',
					imageUrl:'https://img.agrimedia.cn/chwl/v2/KFC_share.jpg',
					ISH5:true,
					CallbackUrl:'https://jc.agrimedia.cn/privilege/pages/restaurant/index/index_kdj',
				}
			});
		},
		methods: {
			
			oreder() {
				// console.log(wx,123);
				// wx.miniProgram.navigateTo({
				// 	url: '/pages/shop/shop?store_id=14'
				// });
				// return
				this.SETNAVINDEX(1);
				uni.navigateTo({
					url: '/pages/restaurant/home/home'
				})
			},
			/**
			 * @跳转客服
			 * */
			service() {
				// console.log(wx, '发送消息');
				// let index = 0;
				// let value = uni.getStorageSync('iiii');
				// if (typeof value != 'undefined') {
				// 	index = value + 1;
				// }
				// uni.setStorageSync('iiii', index);
				// wx.miniProgram.navigateBack({
				// 	delta: 1
				// });
				// wx.miniProgram.postMessage({ data: `接收数据-${index}`});

				// window.location.href = KFCSERVICE;
			},
		},
		onShareAppMessage() {
			return KFCrestaurant();
		}
	}
</script>

<style lang="scss">
	page {
		max-height: 100%;
		min-height: 100%;
		height: 100%;
		background-color: #F9E0B9;
	}

	.stote-Logo {
		.img {
			width: 100%;
			height: auto;
			vertical-align: bottom;
		}
	}

	.stote-operate {
		width: 100%;
		min-height: 300rpx;
		height: auto;
		padding: 18rpx;
		box-sizing: border-box;
	}

	.Stote-Infor {
		width: 100%;
		height: auto;
		background-color: #EFD0A0;
		border-radius: 20rpx;
		padding: 32rpx;
		box-sizing: border-box;
		box-shadow: 1px 3px 0px 0px rgba(195, 163, 115, 0.5600), -1px -3px 3px 0px rgba(255, 242, 223, 0.7500);

		&-order {
			display: flex;
			justify-content: space-between;
			margin-bottom: 24rpx;

			&-Status,
			&-OrderS {
				width: 310rpx;
				height: 368rpx;
				background-color: #ffffff;
				border-radius: 15rpx;
				padding: 32rpx;
				box-sizing: border-box;
				position: relative;

				.img-box {
					width: 200rpx;
					height: 200rpx;
					position: absolute;
					right: 0;
					bottom: 0;

					.img {
						width: 100%;
						height: 100%;
					}
				}

				&-Title {
					font-size: $FONTSIZE36;
					color: #000000;
					line-height: 80rpx;
					font-weight: 700;
				}

				&-text {
					font-size: $FONTSIZE25;
					color: $THEMECOLOR4;
				}
			}
		}

		.service {
			width: 100%;
			height: 144rpx;
			background-color: #ffffff;
			border-radius: 15rpx;
			display: flex;
			align-items: center;
			padding: 16rpx 20rpx;
			box-sizing: border-box;

			&-img {
				width: 118rpx;
				height: 113rpx;

				.img {
					width: 100%;
					height: 100%;
				}

			}

			.text {
				font-size: $FONTSIZE36;
				font-weight: 700;
				flex: 1;
				box-sizing: border-box;
				padding-left: 33rpx;
			}

		}
	}
</style>