Skip to content

M
mallapp
Commit 1a5bb0a5 authored by Mac's avatar Mac
Browse files
Options

1

parent fe2664e7
Hide whitespace changes
Inline Side-by-side
Showing with 158 additions and 74 deletions
components/store/store.vue
View file @ 1a5bb0a5
...@@ -9,36 +9,67 @@ ...@@ -9,36 +9,67 @@
}" }"
@click="goUrl" > @click="goUrl" >
<view class="box" :style="{'border-radius':goods.SearchFilletPX+'px'}"> <view class="box" :style="{'border-radius':goods.SearchFilletPX+'px'}" v-if="goods.IsShowStoreImg==true">
<image mode="aspectFill" class="img" :style="{'border-radius':goods.SearchFilletPX+'px'}" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1597637119000_394.png" ></image> <image mode="aspectFill" class="img" :style="{'border-radius':goods.SearchFilletPX+'px'}" :src="storeInfo.storeCoverImg" ></image>
<view class="switchstore" @click.stop="goStorelist()"> <view class="switchstore" @click.stop="goStorelist()">
<image style="width: 8px;height: 7px;" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/switchstore.png"/> <image style="width: 8px;height: 7px;" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/switchstore.png"/>
<text style="font-size: 10px;color: #111111;">切换门店</text> <text style="font-size: 10px;color: #111111;">切换门店</text>
</view> </view>
<view class="content" :style="{'border-bottom-left-radius':goods.SearchFilletPX+'px','border-bottom-right-radius':goods.SearchFilletPX+'px'}"> <view class="content" >
<view class="c-t"> <view class="c-t">
<view class="c-t-l"> <view class="c-t-l">
月星环球港门店 {{storeInfo.storeName?storeInfo.storeName:'暂无数据'}}
</view> </view>
<view class="c-t-r"> <view class="c-t-r">
距离：20m 距离：{{storeInfo.distance?(storeInfo.distance>=1000?(storeInfo.distance/1000).toFixed(2)+'km':storeInfo.distance+'m'):"0"}}
</view> </view>
</view> </view>
<view class="address"> <view class="address">
成都市锦江区阳光新业中心2号楼2302 {{storeInfo.storeAddress?storeInfo.storeAddress:''}}
</view> </view>
<view class="c-t" style="justify-content: space-between;"> <view class="c-t" style="justify-content: space-between;">
<view> <view>
<image mode="aspectFill" style="width: 11px;height: 11px;" src='https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/osTel.png'/> <image mode="aspectFill" style="width: 11px;height: 11px;" src='https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/osTel.png'/>
<text class="tel">028-12345678</text> <text class="tel">{{storeInfo.storeTel?storeInfo.storeTel:''}} </text>
</view> </view>
<view style="font-size: 11px;color: #FFC86D;"> <view style="font-size: 11px;color: #FFC86D;">
上次消费的店铺 {{storeInfo.consumptionObj?storeInfo.consumptionObj.consumptionStoreName:''}}
</view>
</view>
</view>
</view>
<view v-else>
<view class="content2" >
<view class="c-t">
<view class="c-t-l">
{{storeInfo.storeName?storeInfo.storeName:'暂无数据'}}
</view>
<view class="c-t-r" style="width: 80px;display: flex;flex-direction: row;align-items: center;justify-content: flex-end;">
<view class="switchstore2" @click.stop="goStorelist()" >
<image style="width: 8px;height: 7px;" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/switchstore.png"/>
<text style="font-size: 10px;color: #111111;">切换门店</text>
</view>
</view>
</view>
<view class="address">
<view class="c-t-l" style="font-size: 11px;color: #727272;">
{{storeInfo.storeAddress?storeInfo.storeAddress:''}}
</view>
<view class="c-t-r">
距离：{{storeInfo.distance?(storeInfo.distance>=1000?(storeInfo.distance/1000).toFixed(2)+'km':storeInfo.distance+'m'):"0"}} </view>
</view>
<view class="c-t" style="justify-content: space-between;">
<view>
<image mode="aspectFill" style="width: 11px;height: 11px;" src='https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/osTel.png'/>
<text class="tel">{{storeInfo.storeTel?storeInfo.storeTel:''}} </text>
</view>
<view style="font-size: 11px;color: #FFC86D;">
{{storeInfo.consumptionObj?storeInfo.consumptionObj.consumptionStoreName:''}}
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</template> </template>
...@@ -49,13 +80,20 @@ ...@@ -49,13 +80,20 @@
return { return {
windowWidth: 0, windowWidth: 0,
posiTop: 0, posiTop: 0,
laststudy: {}, storeInfo: {},
position:'',
} }
}, },
created() { created() {
console.log(this.goods)
this.getCurrentStore() this.getCurrentStore()
let that = this
uni.getLocation({
type: 'wgs84',
success: function (res) {
that.position= res.latitude+','+res.longitude;
}
});
}, },
methods:{ methods:{
goUrl(){ goUrl(){
...@@ -65,17 +103,18 @@ ...@@ -65,17 +103,18 @@
this.request2( this.request2(
{ {
url: "/api/AppletStores/GetCurrentStore", url: "/api/AppletStores/GetCurrentStore",
data: {storeId:0,position:'30.642926,104.090009'}, data: {storeId:0,position:this.position},
}, },
(res) => { (res) => {
console.log(1) if(res.data && res.data.storeInfo){
this.storeInfo = res.data.storeInfo
}
} }
); );
}, },
goStorelist(){//门店选择 goStorelist(){//门店选择
uni.navigateTo({ uni.navigateTo({
url:"/pages/reserve/storeList" url:"/pages/reserve/storeList?position="+this.position
}) })
} }
} }
...@@ -86,13 +125,13 @@ ...@@ -86,13 +125,13 @@
.store { .store {
width: 100%; width: 100%;
height: 184px; /* height: 184px; */
} }
.store .box{ .store .box{
width: 100%; width: 100%;
height: 100%; height: 184px;
box-shadow:0 6px 10px 1px #F2F2F2; box-shadow:0 6px 10px 1px #F2F2F2;
font-family: aa; font-family: aa;
position: relative; position: relative;
...@@ -104,7 +143,7 @@ ...@@ -104,7 +143,7 @@
} }
.store .content{ .store .content{
width: 100%; width: 100%;
height: 80px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
...@@ -114,6 +153,16 @@ ...@@ -114,6 +153,16 @@
left: 0; left: 0;
bottom: 0; bottom: 0;
} }
.store .content2{
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
padding: 10px 15px;
background: #FFF;
box-shadow:0 6px 10px 1px #F2F2F2;
}
.store .c-t{ .store .c-t{
width: 100%; width: 100%;
display: flex; display: flex;
...@@ -147,6 +196,11 @@ ...@@ -147,6 +196,11 @@
display: -webkit-box; display: -webkit-box;
-webkit-line-clamp: 1; -webkit-line-clamp: 1;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
padding: 5px 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
} }
.store .switchstore{ .store .switchstore{
position: absolute; position: absolute;
...@@ -162,4 +216,16 @@ ...@@ -162,4 +216,16 @@
border-radius: 8px; border-radius: 8px;
padding: 0 2px; padding: 0 2px;
} }
.store .switchstore2{
margin-left: 5px;
width: 60px;
height: 15px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
background: #FFF;
border-radius: 8px;
padding: 0 2px;
}
</style> </style>
pages/index/index.vue
View file @ 1a5bb0a5
...@@ -64,7 +64,7 @@ ...@@ -64,7 +64,7 @@
<rstudy v-if="d.id == 'education'" :goods="d.data" ref='study'></rstudy> <rstudy v-if="d.id == 'education'" :goods="d.data" ref='study'></rstudy>
<store v-if="d.id == 'reservestore'" :goods="d.data" ></store> <store v-if="d.id == 'reservestore'" :goods="d.data" ></store>
<!-- 线下服务商品 --> <!-- 线下服务商品 -->
<sindex v-if="d.id == 'goods'" :goods="d.data" :key="di" ></sindex> <sindex v-if="d.id == 'storeGoods'" :goods="d.data" :key="di" ></sindex>
</template> </template>
</view> </view>
......
pages/reserve/storeDetails.vue
View file @ 1a5bb0a5
...@@ -24,6 +24,7 @@ ...@@ -24,6 +24,7 @@
justify-content: space-between; justify-content: space-between;
} }
.storeDetails .arrow { .storeDetails .arrow {
height: 24px; height: 24px;
margin: 5px 10px; margin: 5px 10px;
...@@ -202,9 +203,10 @@ ...@@ -202,9 +203,10 @@
:scroll-y="true" :scroll-y="true"
@scroll="scrollHandler" @scroll="scrollHandler"
@scrolltoupper="scrollTopHandler" @scrolltoupper="scrollTopHandler"
:scroll-top="intoscrollTop"
> >
<view class="details-box u-skeleton" > <view class="details-box u-skeleton" >
<view <view
class="headStatus" class="headStatus"
v-if="scrollTop > 50 " v-if="scrollTop > 50 "
...@@ -225,8 +227,22 @@ ...@@ -225,8 +227,22 @@
</view> </view>
<view style="width: 100%;height: 210px;position: relative;" class="u-skeleton-rect"> <view style="width: 100%;height: 210px;position: relative;" class="u-skeleton-rect">
<image style="width: 100%;height: 210px;position: relative;" mode="aspectFill" src="https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3071197752,333614396&fm=26&gp=0.jpg"/> <image style="width: 100%;height: 210px;position: relative;" mode="aspectFill" src="https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3071197752,333614396&fm=26&gp=0.jpg"/>
<view class="arrow2" @click="goback"> <!-- <view class="arrow2" @click="goback">
<u-icon name="arrow-left" size="48" color="#FFF"></u-icon> <u-icon name="arrow-left" size="48" color="#FFF"></u-icon>
</view> -->
<view
class="headStatus"
:style="[
headStyle,
]"
>
<view class="arrow" @click="goback">
<u-icon name="arrow-left" size="48" color="#FFF"></u-icon>
</view>
<view class="title" style="color: #000000;" ></view>
<view class="arrow"></view>
</view> </view>
</view> </view>
...@@ -272,7 +288,7 @@ ...@@ -272,7 +288,7 @@
距离你当前位置20m 距离你当前位置20m
</view> </view>
</view> </view>
<view class="right u-skeleton-rect" style="height: 34px;display: flex;flex-direction: column;align-items: center;justify-content: space-between;"> <view class="right u-skeleton-rect" @click="gophone" style="height: 34px;display: flex;flex-direction: column;align-items: center;justify-content: space-between;">
<image mode="aspectFill" style="width: 11px;height: 11px;" src='https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/osTel.png'/> <image mode="aspectFill" style="width: 11px;height: 11px;" src='https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/osTel.png'/>
<text>电话</text> <text>电话</text>
</view> </view>
...@@ -385,13 +401,14 @@ ...@@ -385,13 +401,14 @@
{name: '评价'}, {name: '评价'},
], ],
current: 0, current: 0,
headH:0, headH:68,
stickyH:0, stickyH:0,
setmealH:0,//套餐卡的高度 setmealH:0,//套餐卡的高度
designerH:0,//设计师的高度 designerH:0,//设计师的高度
richtextH:0,//富文本的高度 richtextH:0,//富文本的高度
commentH:0,//评论的高度 commentH:0,//评论的高度
showSticky:false,//是否吸顶 showSticky:false,//是否吸顶
intoscrollTop:0,
} }
}, },
onLoad(option){ onLoad(option){
...@@ -406,6 +423,11 @@ ...@@ -406,6 +423,11 @@
setTimeout(() => { setTimeout(() => {
this.loading = false; this.loading = false;
}, 100) }, 100)
uni.createSelectorQuery().select(".headStatus").boundingClientRect(data=>{//目标节点
if(data && data.height){
this.headH = data.height
}
}).exec();
uni.createSelectorQuery().select(".store-tabs").boundingClientRect(data=>{ uni.createSelectorQuery().select(".store-tabs").boundingClientRect(data=>{
if(data && data.top){ if(data && data.top){
this.stickyH = data.top this.stickyH = data.top
...@@ -429,19 +451,14 @@ ...@@ -429,19 +451,14 @@
uni.createSelectorQuery().select(".comment").boundingClientRect(data=>{ uni.createSelectorQuery().select(".comment").boundingClientRect(data=>{
if(data && data.top){ if(data && data.top){
this.commentH = data.top this.commentH = data.top
} }
}).exec(); }).exec();
}, },
methods:{ methods:{
scrollHandler(e) { scrollHandler(e) {
console.log(e.detail.scrollTop)
this.scrollTop = e.detail.scrollTop; this.scrollTop = e.detail.scrollTop;
if(this.scrollTop >0 && this.headH==0 ){
uni.createSelectorQuery().select(".headStatus").boundingClientRect(data=>{//目标节点
if(data && data.height){
this.headH = data.height
}
}).exec();
}
if(this.scrollTop>=this.stickyH-this.headH){ if(this.scrollTop>=this.stickyH-this.headH){
this.showSticky=true this.showSticky=true
} }
...@@ -468,14 +485,19 @@ ...@@ -468,14 +485,19 @@
}else if(e==3){ }else if(e==3){
scrollTop=this.commentH scrollTop=this.commentH
} }
uni.pageScrollTo({ this.$nextTick(function() {
　　　　　　duration:0,//过渡时间必须为0，uniapp bug，否则运行到手机会报错 this.showSticky=true
// 　　　　　　scrollTop:scrollTop,//滚动到实际距离是元素距离顶部的距离减去最外层盒子的滚动距离 setTimeout(()=>{
selector:'.comment', this.intoscrollTop = scrollTop - this.headH -40-30;
complete:function(e){ },100)
console.log(e)
}
　　　　}) });
},
gophone(){
uni.makePhoneCall({
phoneNumber: '18781360614' //仅为示例
});
} }
} }
} }
......
pages/reserve/storeList.vue
View file @ 1a5bb0a5
<template> <template>
<view class="storeList"> <view class="storeList">
<view style="width: 100%;height: 50px;background: #FFF;padding: 9px 15px;" > <view style="width: 100%;height: 50px;background: #FFF;padding: 9px 15px;" >
<u-search placeholder="请输入商户名" v-model="val" radius="40" action-text="搜索" shape="round" @search='gosearch' @custom='gosearch' ></u-search> <u-search placeholder="请输入商户名" v-model="msg.Name" radius="40" action-text="搜索" shape="round" @search='gosearch' @custom='gosearch' ></u-search>
</view> </view>
<u-tabs :list="list" :is-scroll="false" :current="current" @change="change" :active-color="mainColor"></u-tabs> <u-tabs :list="list" :is-scroll="false" :current="current" @change="change" :active-color="mainColor"></u-tabs>
<view v-if="g.length > 0" style=" <view v-if="g.length > 0" style="
...@@ -14,23 +14,23 @@ ...@@ -14,23 +14,23 @@
style="height: 100%; padding-bottom: 0px;"> style="height: 100%; padding-bottom: 0px;">
<view class='store' style="padding: 7.5px 15px;" v-for="(c, i) in g" :key="i" @click="gostoreDetails()"> <view class='store' style="padding: 7.5px 15px;" v-for="(c, i) in g" :key="i" @click="gostoreDetails()">
<view class="box" > <view class="box" >
<image mode="aspectFill" class="img" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1597637119000_394.png" ></image> <image mode="aspectFill" class="img" :src="c.CoverImg" ></image>
<view class="content" > <view class="content" >
<view class="c-t"> <view class="c-t">
<view class="c-t-l"> <view class="c-t-l">
月星环球港门店 {{c.Name}}
</view> </view>
<view class="c-t-r"> <view class="c-t-r">
距离：20m 距离：{{c.KM>=1000?(c.KM/1000).toFixed(2)+'km':c.KM+'m'}}
</view> </view>
</view> </view>
<view class="address"> <view class="address">
成都市锦江区阳光新业中心2号楼2302 {{c.Address}}
</view> </view>
<view class="c-t" style="justify-content: space-between;"> <view class="c-t" style="justify-content: space-between;">
<view> <view>
<image mode="aspectFill" style="width: 11px;height: 11px;" src='https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/osTel.png'/> <image mode="aspectFill" style="width: 11px;height: 11px;" src='https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/osTel.png'/>
<text class="tel">028-12345678</text> <text class="tel">{{c.Tel}} </text>
</view> </view>
<view style="font-size: 11px;color: #FFC86D;"> <view style="font-size: 11px;color: #FFC86D;">
上次消费的店铺 上次消费的店铺
...@@ -89,30 +89,17 @@ ...@@ -89,30 +89,17 @@
pageIndex: 1, pageIndex: 1,
pageSize: 10, pageSize: 10,
Name: '', Name: '',
GoodsType: 0, CurrentPosition: '',
CategoryIds: '', OrderByType: 3,
OrderBy: 1,
GoodsPageType:0
}, },
val:'',
}; };
}, },
onLoad(option) { onLoad(option) {
this.mainColor = this.$uiConfig.mainColor; this.mainColor = this.$uiConfig.mainColor;
this.catId = option.cat_id; if (option.position) {
if (option && option.coupon_id && option.UseType) {//课程卡带过来的参数 this.msg.CurrentPosition = option.position;
console.log(option.coupon_id)
if(option.UseType==1){
this.msg.CategoryIds = option.coupon_id
}else if(option.UseType==2){
this.msg.GoodsIds = option.coupon_id
}
}
if (option.CategoryIds) {
this.msg.CategoryIds = option.CategoryIds;
} }
}, },
mounted() { mounted() {
...@@ -126,26 +113,35 @@ ...@@ -126,26 +113,35 @@
change(e) { change(e) {
this.current = e; this.current = e;
// this.g = []; if(e==0){
// this.msg.pageIndex = 1 this.msg.OrderByType = 3
// this.init(); }else if(e==1){
this.msg.OrderByType = 5
}
this.g = [];
this.msg.pageIndex = 1
this.init();
}, },
gosearch(){//确认搜索 gosearch(){//确认搜索
console.log(this.val) this.g = [];
this.msg.pageIndex = 1
this.init();
}, },
init() { init() {
this.loading = true; this.loading = true;
this.msg.GoodsPageType = uni.getStorageSync("mall_UserInfo")?uni.getStorageSync("mall_UserInfo").UserPageType:0; uni.showLoading({
title: '加载中'
});
this.request2({ this.request2({
url: '/api/AppletSchool/GetAppletCoursePageList', url: '/api/AppletStores/GetStorePage',
data: this.msg data: this.msg
}, },
res => { res => {
this.loading = false; this.loading = false;
this.isloading = false;
if (res.resultCode == 1) { if (res.resultCode == 1) {
this.g = this.g.concat(res.data.pageData); this.g = this.g.concat(res.data.pageData);
this.page_count = res.data.pageCount; this.page_count = res.data.pageCount;
if (this.page_count == 1) { if (this.page_count == 1) {
...@@ -155,8 +151,8 @@ ...@@ -155,8 +151,8 @@
this.status = "loadmore"; this.status = "loadmore";
} }
} }
uni.hideLoading();
uni.hideNavigationBarLoading();
} }
); );
...@@ -234,7 +230,7 @@ ...@@ -234,7 +230,7 @@
color: #000000; color: #000000;
} }
.storeList .c-t-r{ .storeList .c-t-r{
width: 80px; width: 90px;
text-align: right; text-align: right;
font-size: 12px; font-size: 12px;
color: #111111; color: #111111;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment