zh_order_food_xcx/pages/index/index.vue

<template>
	<view class="flex-common-css">
		<Nav :leftShow='false' :customNav='true' title="" bgckgroundBox='#EF1F0C'></Nav>
		<view class="flex-1 flex-direction iPhone-bottom box-border-box">
			<image class="qd-bg" src="@/static/img/order-food/qd-bg.png" mode=""></image>
			<view class="order-food-box p-0-32 box-border-box">
				<view class="order-food p-32 box-border-box bgc-f b-rad-24" @click="goToUrl(1)">
					<view class="b-FFD7CC bc-FFEDE9-FFF1EE b-rad-24 p-20-32 box-border-box align-items-center flex-justify-space">
						<view class="flex-direction">
							<view class="align-items-center mb-8">
								<view class="fs-36 fc-3 fw-600">
									堂食扫码点餐
								</view>
								<image class="right-h" src="@/static/img/order-food/right-h.png" mode=""></image>
							</view>
							<view class="fs-28 fc-9">
								自助下单方便快捷
							</view>
						</view>
						<image class="zh-img" src="@/static/img/order-food/zh-img.png" mode=""></image>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {appletLogin} from "@/api/member";
  import tools from "@/service/tools";

  export default {
		components: {},
		data() {
			return {}
		},
		onLoad(data) {
      this.login()
    },
		mounted() {},
		methods: {
      login(){

        uni.login({
          provider: "weixin",
          success: (loginRes) => {
            this.appletLogin(loginRes.code);
          },
          fail: (loginRes) => {
            this.isAjax = false;
            tools.error("获取授权信息失败");
          },
        });
      },
      appletLogin(code){
        appletLogin({'code':code}).then(res=>{

        })
      },
			goToUrl(shop_id) {
				uni.reLaunch({
					url: '/pages-takeout/shop?shop_id=' + shop_id
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
.qd-bg{
	width: 100%;
	height: 696rpx;
}
.order-food-box{
	position: relative;
}
.order-food{
	width: calc(100% - 64rpx);
	position: absolute;
	left: 32rpx;
	top: -90rpx;
}
.bc-FFEDE9-FFF1EE{
	background: linear-gradient( 90deg, #FFEDE9 0%, #FFF1EE 100%);
}
.zh-img {
	width: 148rpx;
	height: 148rpx;
}
.right-h{
	width: 40rpx;
	height: 40rpx;
}
</style>