jje_uniapp/pages/index/index.vue

<template>
	<view class="content">
		<view class="head-wrap ">
			<view class="content-info ">

				<view class="h-bg">
					<!-- 轮播图 -->
					<u-swiper
							:list="bannerList"
							:height="340"
					></u-swiper>
				</view>
				<view class="content">

					<!--  通知栏 -->
					<view v-if="noticeList.length > 0" class="h-notice-bar">
						<scroll-notice  :dataList="noticeList" :type="2" :interval="3000" :height="46" :fontSize="12" color="#666666" @click="handleNoticeClick"></scroll-notice>
					</view>

					<!-- 个人信息、钱包、商店 -->
					<view class="h-content-wrap">
						<!-- 欢迎语 -->
						<view class="welcome-wrap">
							<view class="logo">
								<image v-if="userInfo.selfPhotoUrl" :src="userInfo.selfPhotoUrl" mode=""></image>
								<image v-else src="../../static/logo.png" mode=""></image>
							</view>
							<view class="text">
								<view class="phone">{{userInfo.cellPhone}}</view>
								<view class="welcome">尊敬的用户，下午好~</view>
							</view>
							<view @click="gotoReceiveCoupons()" class="arrow-right">
								<!-- <image v-if="userInfo.wxQrCode" class="qrcode" :src="userInfo.qrcode" mode=""></image> -->
								<!-- <image class="qrcode" src="../../static/index/qrcode.png" mode=""></image>
								<view class="h-text">会员码</view> -->
								<view class="coupon-wrap">
									<u-icon name="coupon-fill" color="#ffb83d" size="22"></u-icon>
									<text>领券中心</text>
								</view>
							</view>
						</view>

						<!-- 余额信息 -->
						<view class="balance-info">
							<view @click="gotoRechargeService()" class="balance-amount">
								<text class="number" v-if="userInfo.balance" >￥{{userInfo.balance}}</text>
								<text class="number" v-else>￥0.00</text>
								<view class="">余额 </view>
							</view>
							<view @click="gotoIntgral()" class="score-info">
								<text class="number"  v-if="userInfo.integral" >{{userInfo.integral}}</text>
								<text class="number"  v-else>0</text>
								<view class="">积分 </view>
							</view>
							<view @click="gotoCoupon()" class="coupon-info">
								<text class="number" v-if="userInfo.coupon">{{userInfo.coupon}}</text>
								<text class="number" v-else>0</text>
								<view class="">优惠券 </view>

							</view>
							<view class="e-currency-info">
								<text class="number" v-if="userInfo.electronicCurrency">{{userInfo.electronicCurrency}}</text>
								<text class="number" v-else>0</text>
								<view class="">电子币</view>
							</view>
						</view>

						<view class="custom-line"></view>

						<view class="store-wrap">
							<view class="store-info">
								<view class="logo">
									<image src="../../static/index/u55.png" mode=""></image>
								</view>
								<view @click="gotoStoreChoose()" class="store-content">
									<view class="h-row">
										<view class="store-desc">
											<view class="store-name">
												<view class="">{{storeInfo.storeName}}</view>
											</view>
										</view>
										<view class="arrow-right">
											<view  class="change-store">更换门店</view>
											<u-icon name="arrow-right" color="#333" size="16"></u-icon>
										</view>
									</view>
									<view class="h-row">
										<text class="address">地址：{{storeInfo.address}}</text>
										<!-- <text class="address">距你1.8km</text> -->
									</view>
								</view>
							</view>

						</view>
					</view>

					<!-- 上次订单 -->
					<view class="nav-wrap ">

						<view class="upper-order-wrap">
							<!-- 左边内容 -->
							<view @click="gotoServiceOrder()" class="left-content">
								<view class="title">
									服务点单
								</view>
								<view class="desc">
									多种服务模式任您选择
								</view>
								<view class="bg-img">
									<image src="../../static/index/u65.png" mode=""></image>
								</view>
							</view>
							<view class="dashed-line"></view>
							<!-- 右边内容 -->
							<view class="right-content">
								<view class="title">
									产品点单
								</view>
								<view class="desc">
									拼命研发中敬请期待...
								</view>
								<view class="bg-img">
									<image src="../../static/index/u67.png" mode=""></image>
								</view>
							</view>
						</view>

						<!-- 导航菜单 -->
						<view class="horizontal-dashed-line"></view>
						<view class="menu-tab">
							<view class="button-wrap">
								<view @click="gotoComeOrder()" class="btn">
									<view class="icon">
										<u-icon name="/static/index/u213.png" color="red" size="30"></u-icon>
									</view>
									<view class="name">
										再来一单
									</view>
								</view>
							</view>
							<view class="button-wrap">
								<view @click="gotoRechargeService()" class="btn">
									<view class="icon">
										<u-icon name="/static/index/u215.png" color="red" size="30"></u-icon>
									</view>
									<view class="name">
										储值服务
									</view>
								</view>
							</view>
							<view class="button-wrap">
								<view @click="gotoOrder()" class="btn">
									<view class="icon">
										<u-icon name="/static/index/u217.png" color="red" size="30"></u-icon>
									</view>
									<view class="name">
										当前订单
									</view>
								</view>
							</view>
							<view class="button-wrap">
								<view @click="gotoReceiveCoupons()" class="btn">
									<view class="icon">
										<u-icon name="/static/index/u247.png" color="red" size="30"></u-icon>
									</view>
									<view class="name">
										领优惠券
									</view>
								</view>
							</view>
						</view>
					</view>

					<!-- 为你推荐 -->
					<view class="recommend-wrap">
						<view class="recommend-nav">
							<view class="icon">
								<image src="/static/index/u87.png" mode=""></image>
							</view>
							<view class="title">
								为你推荐
							</view>
						</view>
						<!-- 分割线 -->
						<view class="custom-line"></view>
						<!-- 门店列表 -->
						<view class="store-wrap ">
							<view class="store-list" v-for="item in 1">
								<view class="store-content">
									<view class="store-img">
										<image src="../../static/logo.png" mode=""></image>
									</view>
									<view class="h-store-content">
										<view class="title">
											<text>{{storeInfo.storeName}}</text>
										</view>
										<view class="adress">
											地址：{{storeInfo.address}}
										</view>
										<!-- <view class="price">
											标准价格：<span class="red">￥200</span>
										</view> -->
										<view class="desc">
											<view class="price">
												<!-- 人均消费￥35起 -->
											</view>
											<view @click="gotoGoods()" class="order-btn">
												<view class="btn">去下单</view>
											</view>
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
					<view class="footer ">
						<view class="">---到底了---</view>
					</view>
				</view>
			</view>
		</view>

		<view class="tabBarLineHeight"></view>
		<view class="tabBarView">
			<tab-bar :tabIndex="tabIndex"></tab-bar>
		</view>
	</view>
</template>

<script>
	import tabBar from "../../components/tabBar/tabBar";
	export default {
		components:{
			tabBar
		},
		data() {
			return {
				title: 'Hello',
				tabIndex:0
			}
		},
		onLoad() {
			uni.hideTabBar({
				animation:false
			})

		},
		methods: {

		}
	}
</script>

<style>
	@import '/common/css/common.css';
	@import './index.rpx.css';
</style>