918 lines
26 KiB
Vue
918 lines
26 KiB
Vue
<template>
|
|
<div class="main">
|
|
<div class="top" :style="{
|
|
height: `${menu.height + 8}px`,
|
|
paddingTop: menu.top + 'px',
|
|
}">
|
|
<div class="topContent">
|
|
<image class="backIcon" src="https://eshangtech.com/wanmeiyizhanImg/home/backArrow.svg" @click="handleBack" />
|
|
|
|
<div class="first" @click="goSelectServer">
|
|
<image class="addressIcon" src="https://eshangtech.com/wanmeiyizhanImg/home/blackFixed.png" />
|
|
<div class="text">{{ serverPart.SERVERPART_NAME || "" }}</div>
|
|
<image class="moreIcon" src="https://eshangtech.com/wanmeiyizhanImg/home/rightArrow.png" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="newTabList">
|
|
<div :class="selectTypeTab === index ? 'newTabItem selectTabItem' : 'newTabItem'
|
|
" v-for="(item, index) in selectTypeList" :key="index" @click="handleChangeType(index)">
|
|
{{ item.label }}
|
|
</div>
|
|
</div>
|
|
|
|
<scroll-view scroll-y class="shopListBox" :style="{
|
|
height: `calc(100vh - ${menu.top}px - ${menu.height + 8}px - 50px )`,
|
|
}">
|
|
<div v-if="onShowTypeList && onShowTypeList.length > 0">
|
|
<div class="shopItemBox" v-for="(item, index) in onShowTypeList" :key="index" @click.stop="goBuy(item)" :style="{
|
|
marginBottom: index + 1 === onShowTypeList.length ? '0' : '',
|
|
borderWidth: index + 1 === onShowTypeList.length ? '0' : '',
|
|
}">
|
|
<div class="shopItemTop">
|
|
<div class="shopImg">
|
|
<image class="shopIcon" :src="item.MERCHANTS_LOGO ||
|
|
'https://eshangtech.com/ShopICO/no-picture.png'
|
|
" mode="aspectFit" />
|
|
</div>
|
|
<div class="shopDetail">
|
|
|
|
<div class="shopDetailLeft">
|
|
<div class="detailLeftTop">
|
|
<span class="topShopName">{{ item.MERCHANTS_NAME }}</span>
|
|
</div>
|
|
|
|
<div class="detailLeftBottom">
|
|
<view class="scoreBox">
|
|
<uni-rate :value="item.MERCHANTS_SCORE" size="16" readonly allowHalf color="#D9D9D9"
|
|
activeColor="#FFC300" style="margin-right: 8rpx" />
|
|
{{ item.MERCHANTS_SCORE || '' }}
|
|
</view>
|
|
<view class="newOtherDetail">
|
|
<span class="label">月售</span>
|
|
<span class="value">{{ item.MONTHLYSALES || "-" }}</span>
|
|
<span class="label" style="margin-left: 20rpx;">人均</span>
|
|
<span class="value">￥{{ item.PERCAPITA || "-" }}</span>
|
|
</view>
|
|
</div>
|
|
</div>
|
|
<div class="shopDetailRight">
|
|
<view class="goFood" v-if="item.SCANCODE_ORDER === 1" @click.stop="goBuy(item)">点餐</view>
|
|
<view class="search" v-else-if="item.GOODSLIST && item.GOODSLIST.length > 0" @click.stop="goBuy(item)">
|
|
查看</view>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="shopList" v-if="
|
|
item.GOODSLIST &&
|
|
item.GOODSLIST.length > 0 &&
|
|
item.SCANCODE_ORDER === 1
|
|
">
|
|
<div class="shopItem" v-for="(subItem, subIndex) in item.GOODSLIST" :key="subIndex">
|
|
<div class="shopImgBox">
|
|
<image class="shopImg" lazy-load :src="subItem.IMAGE_URL" />
|
|
</div>
|
|
<div class="shopName">{{ subItem.COMMODITY_NAME || "" }}</div>
|
|
<div class="itemPrice">
|
|
<span class="itemUnit">¥</span>
|
|
<span class="itemPrice">{{
|
|
subItem.COMMODITY_RETAILPRICE || ""
|
|
}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<div v-else class="noDataBox">
|
|
<no-data text="暂无可点餐门店" :isShow="!(shopList && shopList.length > 0)" />
|
|
</div>
|
|
</scroll-view>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import noData from "../../components/noData.vue";
|
|
import currentService from "../../components/currentService.vue";
|
|
import { mapGetters } from "vuex";
|
|
export default {
|
|
data() {
|
|
return {
|
|
serverPart: {},
|
|
shopList: [],
|
|
allTypeList: [], // 所有业态的
|
|
onShowTypeList: [], // 显示的列表
|
|
selectTypeList: [], // 选择业态的列表
|
|
selectTypeTab: 0, // 选中的业态类型
|
|
thisServerpartId: "",
|
|
seatInfo: {},
|
|
menu: {},
|
|
isFirst: true,// 判断是不是第一次进入到页面
|
|
};
|
|
},
|
|
async onLoad(query) {
|
|
console.log('queryqueryquery', query);
|
|
|
|
// 拿到用户手机信息
|
|
this.menu = uni.getMenuButtonBoundingClientRect();
|
|
// 判断有没有传入 id 有的话 用传入的 没有的 就用缓存的当前的
|
|
if (query.id) {
|
|
// 拿到id
|
|
this.thisServerpartId = query.id;
|
|
// 获取这个服务区的门店列表 且自己筛选 只留下 可以点餐的门店
|
|
await this.handleGetServerpartDetail(this.thisServerpartId);
|
|
} else {
|
|
// 没有传入id的话 就默认用当前选择的服务区
|
|
let currentService = uni.getStorageSync("currentService");
|
|
this.serverPart = currentService;
|
|
}
|
|
// 获得该服务区下面的门店列表
|
|
await this.handleGetShopList();
|
|
this.$utils.addUserBehaviorNew();
|
|
},
|
|
onShow() {
|
|
if (!this.isFirst) {
|
|
// 判断有没有去选择服务区页面修改了服务区
|
|
let haveChange = uni.getStorageSync("serviceChange");
|
|
console.log('haveChange', haveChange);
|
|
|
|
if (haveChange) {
|
|
uni.setStorageSync("serviceChange", false);
|
|
let currentService = uni.getStorageSync("currentService");
|
|
if (
|
|
currentService.SERVERPART_ID !== this.serverPart.SERVERPART_ID
|
|
) {
|
|
this.serverPart = currentService;
|
|
this.thisServerpartId = currentService.SERVERPART_ID;
|
|
// 获取这个服务区的门店列表 且自己筛选 只留下 可以点餐的门店
|
|
this.handleGetShopList();
|
|
}
|
|
}
|
|
} else {
|
|
this.isFirst = false
|
|
}
|
|
|
|
},
|
|
computed: {
|
|
...mapGetters({
|
|
user: "user",
|
|
}),
|
|
},
|
|
components: {
|
|
noData,
|
|
currentService,
|
|
},
|
|
methods: {
|
|
handleBack() {
|
|
uni.navigateBack({
|
|
delta: 1,
|
|
});
|
|
},
|
|
// 跳转到地图选择服务区
|
|
goSelectServer() {
|
|
uni.navigateTo({ url: "/pages/newMap/index/index" });
|
|
},
|
|
async handleGetServerpartDetail(id) {
|
|
let seatInfo = uni.getStorageSync("seatInfo");
|
|
if (seatInfo) {
|
|
seatInfo = JSON.parse(seatInfo);
|
|
}
|
|
let req = {
|
|
ServerpartId: id,
|
|
latitude: seatInfo.latitude,
|
|
longitude: seatInfo.longitude,
|
|
};
|
|
uni.showLoading({
|
|
title: "加载中...",
|
|
});
|
|
const data = await this.$api.$get(
|
|
"/CommercialApi/BaseInfo/GetServerpartInfo",
|
|
req
|
|
);
|
|
this.serverPart = data.Result_Data;
|
|
console.log("this.serverPart", this.serverPart);
|
|
},
|
|
// 拿到门店列表
|
|
async handleGetShopList() {
|
|
this.shopList = [];
|
|
this.allTypeList = [];
|
|
this.onShowTypeList = [];
|
|
this.selectTypeList = [];
|
|
this.selectTypeTab = 0;
|
|
|
|
uni.showLoading({
|
|
title: "加载中...",
|
|
});
|
|
let _this = this;
|
|
// this.$api
|
|
// .getCoop({
|
|
// action_type: "GetSellerList",
|
|
// showSales: 1,
|
|
// showCoupon: 1,
|
|
// showComment: 1,
|
|
// serverpartId: this.thisServerpartId || this.serverPart.SERVERPART_ID,
|
|
// provinceCode: "530000",
|
|
// showGoods: 1,
|
|
// pageSize: 9999,
|
|
// pageIndex: 1,
|
|
// })
|
|
// .then(function (data) {
|
|
const data = await this.$api.$javaGet("/third-party/getMerchantsList", {
|
|
serverpartId: this.thisServerpartId || this.serverPart.SERVERPART_ID,
|
|
});
|
|
|
|
// let list = data.Data.List;
|
|
let list = data.Result_Data.List
|
|
console.log("list", list);
|
|
let shopList = [];
|
|
if (list && list.length > 0) {
|
|
list.forEach((item) => {
|
|
if (item.SCANCODE_ORDER === 1) {
|
|
shopList.push(item);
|
|
}
|
|
});
|
|
}
|
|
_this.handleSortShopList(shopList);
|
|
console.log("shopList", shopList);
|
|
_this.shopList = shopList;
|
|
uni.hideLoading();
|
|
// });
|
|
},
|
|
// 按照查出来的门店的业态进行分类
|
|
handleSortShopList(list) {
|
|
let allList = [];
|
|
let tabList = [];
|
|
// 优惠券列表
|
|
let couponList = [];
|
|
|
|
// 先遍历出 全部门店的业态
|
|
if (list && list.length > 0) {
|
|
let idList = [];
|
|
list.forEach((item) => {
|
|
if (idList.indexOf(item.SHOPTRADE) === -1) {
|
|
idList.push(item.SHOPTRADE);
|
|
tabList.push({ label: item.SHOPTRADE_TEXT, value: item.SHOPTRADE });
|
|
}
|
|
if (item.CouponList && item.CouponList.length > 0) {
|
|
item.CouponList.forEach((subItem) => {
|
|
let obj = JSON.parse(JSON.stringify(subItem));
|
|
obj.MERCHANTS_LOGO = item.MERCHANTS_LOGO;
|
|
obj.MERCHANTS_NAME = item.MERCHANTS_NAME;
|
|
obj.parent = item;
|
|
couponList.push(obj);
|
|
});
|
|
}
|
|
});
|
|
// 根据遍历出的业态种类 变成一个二维数据
|
|
if (idList && idList.length > 0) {
|
|
idList.forEach((item) => {
|
|
allList.push([]);
|
|
});
|
|
idList.forEach((item, index) => {
|
|
list.forEach((subItem) => {
|
|
if (item === subItem.SHOPTRADE) {
|
|
let oldList = allList[index];
|
|
oldList.push(subItem);
|
|
}
|
|
});
|
|
});
|
|
}
|
|
|
|
console.log("allList", allList);
|
|
}
|
|
allList.unshift(list)
|
|
|
|
if (allList && allList.length > 0) {
|
|
// 各种业态类型的二维数组
|
|
this.allTypeList = allList;
|
|
this.onShowTypeList = allList[this.selectTypeTab];
|
|
tabList.unshift({
|
|
label: "全部",
|
|
value: "0"
|
|
})
|
|
this.selectTypeList = tabList;
|
|
console.log("this.allTypeList", this.allTypeList);
|
|
console.log("this.allTypeLonShowTypeListist", this.onShowTypeList);
|
|
console.log("this.selectTypeTab", this.selectTypeTab);
|
|
console.log("this.selectTypeList", this.selectTypeList);
|
|
}
|
|
},
|
|
// 修改业态tab
|
|
handleChangeType(value) {
|
|
console.log('value', value);
|
|
|
|
this.selectTypeTab = value;
|
|
this.onShowTypeList = this.allTypeList[this.selectTypeTab];
|
|
},
|
|
goBuy(item) {
|
|
console.log("goBuy", item);
|
|
if (this.user.MEMBERSHIP_MOBILEPHONE) {
|
|
let id = item.SERVERPARTSHOP_IDS.split(",")[0];
|
|
uni.navigateTo({
|
|
url: `/pages/shopPages/shop/index?id=${id}&mid=${item.MERCHANTS_ID}&province=${item.PROVINCE_CODE}&buyType=${item.SCANCODE_ORDER}`,
|
|
});
|
|
} else {
|
|
let id = item.SERVERPARTSHOP_IDS.split(",")[0];
|
|
uni.navigateTo({
|
|
url: `/pages/shopPages/shop/index?id=${id}&mid=${item.MERCHANTS_ID}&province=${item.PROVINCE_CODE}&buyType=${item.SCANCODE_ORDER}`,
|
|
});
|
|
this.isLogin = true;
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style scoped lang="less">
|
|
.main {
|
|
width: 100%;
|
|
height: 100vh;
|
|
background: #fff;
|
|
box-sizing: border-box;
|
|
padding-bottom: constant(safe-area-inset-bottom);
|
|
padding-bottom: env(safe-area-inset-bottom);
|
|
|
|
.top {
|
|
width: 100%;
|
|
// box-sizing: border-box;
|
|
background: #fff;
|
|
|
|
.topContent {
|
|
display: flex;
|
|
align-items: center;
|
|
box-sizing: border-box;
|
|
padding: 0 16px;
|
|
|
|
.backIcon {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
margin-right: 8px;
|
|
}
|
|
|
|
.first {
|
|
display: flex;
|
|
align-items: center;
|
|
box-sizing: border-box;
|
|
border: 1rpx solid #e7e7e6;
|
|
border-radius: 48rpx;
|
|
padding: 8rpx 24rpx;
|
|
|
|
.addressIcon {
|
|
width: 24rpx;
|
|
height: 24rpx;
|
|
margin-right: 8rpx;
|
|
}
|
|
|
|
.text {
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #090c1a;
|
|
line-height: 40rpx;
|
|
text-align: justify;
|
|
font-style: normal;
|
|
}
|
|
|
|
.moreIcon {
|
|
margin-left: 8rpx;
|
|
width: 24rpx;
|
|
height: 24rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.newTabList {
|
|
width: 100%;
|
|
overflow-x: auto;
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
// border-bottom: 1px solid #dddcdc;
|
|
margin-top: 16rpx;
|
|
height: 30px;
|
|
|
|
|
|
.newTabItem {
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #C6C6C6;
|
|
line-height: 40rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
white-space: nowrap;
|
|
padding: 0 40rpx;
|
|
}
|
|
|
|
.selectTabItem {
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: bold;
|
|
font-size: 28rpx;
|
|
color: #130f05;
|
|
line-height: 40rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
position: relative;
|
|
}
|
|
|
|
.selectTabItem:after {
|
|
content: "";
|
|
position: absolute;
|
|
width: 2rem;
|
|
height: 4rpx;
|
|
background: #009DFF;
|
|
bottom: 0;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
}
|
|
}
|
|
|
|
.shopListBox {
|
|
margin-top: 24rpx;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding: 0 24rpx;
|
|
|
|
.shopItemBox {
|
|
width: 100%;
|
|
margin-bottom: 32rpx;
|
|
border-bottom: 1px solid #ededed;
|
|
padding-bottom: 32rpx;
|
|
|
|
.shopItemTop {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
|
|
.shopImg {
|
|
width: 130rpx;
|
|
height: 130rpx;
|
|
overflow: hidden;
|
|
border-radius: 16rpx;
|
|
margin-right: 28rpx;
|
|
|
|
.shopIcon {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.shopDetail {
|
|
width: calc(100% - 158rpx);
|
|
height: 130rpx;
|
|
// height: 96rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
// flex-direction: column;
|
|
// justify-content: space-between;
|
|
// position: relative;
|
|
|
|
.shopDetailLeft {
|
|
width: calc(100% - 150rpx);
|
|
height: 130rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
|
|
.detailLeftTop {
|
|
.topShopName {
|
|
font-family: "Microsoft YaHei";
|
|
font-weight: 400;
|
|
font-size: 29rpx;
|
|
color: #000000;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
}
|
|
|
|
.detailLeftBottom {
|
|
.scoreBox {
|
|
display: flex;
|
|
align-items: center;
|
|
font-family: "Microsoft YaHei";
|
|
font-weight: 400;
|
|
font-size: 22rpx;
|
|
color: #FF6200;
|
|
text-align: left;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
.newOtherDetail {
|
|
width: 100%;
|
|
display: flex;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
margin-top: 12rpx;
|
|
|
|
.label {
|
|
font-family: "Microsoft YaHei";
|
|
font-weight: 400;
|
|
font-size: 22rpx;
|
|
color: rgba(0, 0, 0, 0.5);
|
|
text-align: left;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
display: inline-block;
|
|
width: 50rpx;
|
|
}
|
|
|
|
.value {
|
|
font-family: "Microsoft YaHei";
|
|
font-weight: 400;
|
|
font-size: 22rpx;
|
|
color: #009DFF;
|
|
text-align: left;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
display: inline-block;
|
|
width: 70rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.shopDetailRight {
|
|
width: 150rpx;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
|
|
.goFood {
|
|
font-family: "Microsoft YaHei";
|
|
font-weight: 400;
|
|
font-size: 26rpx;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
padding: 8rpx 28rpx;
|
|
background-color: #FF6200;
|
|
border-radius: 32rpx;
|
|
display: inline-block;
|
|
}
|
|
|
|
.search {
|
|
font-family: "Microsoft YaHei";
|
|
font-weight: 400;
|
|
font-size: 26rpx;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
padding: 8rpx 28rpx;
|
|
background-color: #009DFF;
|
|
border-radius: 32rpx;
|
|
display: inline-block;
|
|
|
|
}
|
|
}
|
|
|
|
.shopName {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.shopTitle {
|
|
display: inline-block;
|
|
max-width: calc(100% - 133rpx);
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
font-family: PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 32rpx;
|
|
color: #130f05;
|
|
line-height: 44rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
|
|
.titleIcon {
|
|
display: inline-block;
|
|
background: url("https://eshangtech.com/ShopICO/icos/to-eat.png") no-repeat center; // eshangtech.com/ShopICO/icos/to-eat.png) no-repeat center;
|
|
background-size: contain;
|
|
width: 133rpx;
|
|
height: 48rpx;
|
|
}
|
|
}
|
|
|
|
.otherDetail {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
|
|
.leftDetail {
|
|
.mark {
|
|
font-family: "DINAlternate";
|
|
font-weight: bold;
|
|
font-size: 32rpx;
|
|
color: #ba922f;
|
|
line-height: 36rpx;
|
|
text-align: justify;
|
|
font-style: normal;
|
|
|
|
.unit {
|
|
font-family: "PingFangSC";
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #ba922f;
|
|
line-height: 32rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
}
|
|
|
|
.monthSales {
|
|
margin-left: 16rpx;
|
|
font-family: "PingFangSC";
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #716f69;
|
|
line-height: 36rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
|
|
.perCapita {
|
|
margin-left: 16rpx;
|
|
font-family: "PingFangSC";
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #716f69;
|
|
line-height: 36rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
}
|
|
|
|
.rightDetail {
|
|
.perCapita {
|
|
font-size: 24rpx;
|
|
color: #666;
|
|
}
|
|
|
|
.icon-coupon {
|
|
background: url("https://eshangtech.com/ShopICO/icos/y-yhq.png") no-repeat left center; // eshangtech.com/ShopICO/icos/y-yhq.png) no-repeat left center
|
|
background-size: contain;
|
|
// width 75rpx
|
|
// height 22rpx
|
|
padding-left: 40rpx;
|
|
height: 27rpx;
|
|
line-height: 27rpx;
|
|
// padding-left 25rpx
|
|
font-size: 24rpx;
|
|
color: #ec5930;
|
|
margin-left: 8px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.couponList {
|
|
display: inline-block;
|
|
margin-top: 12rpx;
|
|
|
|
.couponBox {
|
|
background: #fef0e5;
|
|
border-radius: 2rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.couponIconBox {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
background: linear-gradient(180deg, #ffddc0 0%, #ffeada 100%);
|
|
border-radius: 4rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
.couponIcon {
|
|
width: 24rpx;
|
|
height: 24rpx;
|
|
}
|
|
}
|
|
|
|
.couponText {
|
|
margin: 0 10rpx;
|
|
font-family: "PingFangSC";
|
|
font-weight: 400;
|
|
font-size: 22rpx;
|
|
color: #fa5825;
|
|
line-height: 32rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
}
|
|
}
|
|
|
|
.goOrder {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
padding: 10rpx 12rpx;
|
|
border-radius: 4rpx;
|
|
border: 2rpx solid #ae8d3e;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.orderIcon {
|
|
width: 32rpx;
|
|
height: 32rpx;
|
|
margin-right: 8rpx;
|
|
}
|
|
|
|
.goOrderText {
|
|
font-family: "PingFangSC";
|
|
font-weight: 400;
|
|
font-size: 22rpx;
|
|
color: #ba922f;
|
|
line-height: 32rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
}
|
|
|
|
// .couponBox {
|
|
// padding: 4rpx 6rpx;
|
|
// background: rgba(247, 80, 49, 0.08);
|
|
// border-radius: 2rpx;
|
|
// display: flex;
|
|
// align-items: center;
|
|
// position: absolute;
|
|
// right: 160rpx;
|
|
// top: 0;
|
|
// .couponIcon {
|
|
// width: 24rpx;
|
|
// height: 24rpx;
|
|
// margin-right: 4rpx;
|
|
// }
|
|
// .couponText {
|
|
// font-family: PingFangSC, PingFang SC;
|
|
// font-weight: 400;
|
|
// font-size: 22rpx;
|
|
// color: #f75031;
|
|
// line-height: 32rpx;
|
|
// text-align: left;
|
|
// font-style: normal;
|
|
// white-space: nowrap;
|
|
// }
|
|
// }
|
|
}
|
|
}
|
|
|
|
.shopList {
|
|
width: calc(100% - 160rpx);
|
|
box-sizing: border-box;
|
|
margin-left: 160rpx;
|
|
overflow-x: auto;
|
|
display: flex;
|
|
margin-top: 24rpx;
|
|
|
|
.shopItem {
|
|
width: 168rpx;
|
|
margin-right: 16rpx;
|
|
|
|
.shopImgBox {
|
|
width: 146rpx;
|
|
// height: 96rpx;
|
|
height: 146rpx;
|
|
overflow: hidden;
|
|
border-radius: 10rpx;
|
|
margin-bottom: 12rpx;
|
|
|
|
.shopImg {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.shopName {
|
|
width: 100%;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
|
|
font-family: "Microsoft YaHei";
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #000000;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
|
|
.itemPrice {
|
|
.itemUnit {
|
|
font-family: "DINAlternate";
|
|
font-weight: bold;
|
|
font-size: 20rpx;
|
|
color: #FF6200;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
|
|
.itemPrice {
|
|
font-family: "DINAlternate";
|
|
font-weight: bold;
|
|
font-size: 32rpx;
|
|
color: #FF6200;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.shopList::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
.activitieBox {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding-top: 24rpx;
|
|
|
|
.activeTitle {
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #716f69;
|
|
line-height: 40rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
margin-bottom: 16rpx;
|
|
}
|
|
|
|
.couponList {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.couponItem {
|
|
width: calc((100% - 24rpx) / 2);
|
|
margin-right: 24rpx;
|
|
|
|
.itemImgBox {
|
|
width: 100%;
|
|
height: 192rpx;
|
|
border-radius: 12rpx;
|
|
overflow: hidden;
|
|
margin-bottom: 16rpx;
|
|
|
|
.itemImg {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.couponText {
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #130f05;
|
|
line-height: 40rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.couponTime {
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #716f69;
|
|
line-height: 36rpx;
|
|
text-align: justify;
|
|
font-style: normal;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
}
|
|
|
|
.couponItem:nth-child(2n) {
|
|
margin-right: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.noDataBox {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
}
|
|
|
|
.shopListBox ::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
}
|
|
</style> |