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 @@
}"
@click="goUrl" >
<view class="box" :style="{'border-radius':goods.SearchFilletPX+'px'}">
<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>
<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="storeInfo.storeCoverImg" ></image>
<view class="switchstore" @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 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-l">
月星环球港门店
{{storeInfo.storeName?storeInfo.storeName:'暂无数据'}}
</view>
<view class="c-t-r">
距离：20m
距离：{{storeInfo.distance?(storeInfo.distance>=1000?(storeInfo.distance/1000).toFixed(2)+'km':storeInfo.distance+'m'):"0"}}
</view>
</view>
<view class="address">
成都市锦江区阳光新业中心2号楼2302
{{storeInfo.storeAddress?storeInfo.storeAddress:''}}
</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">028-12345678</text>
<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 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>
</template>
......@@ -49,13 +80,20 @@
return {
windowWidth: 0,
posiTop: 0,
laststudy: {},
storeInfo: {},
position:'',
}
},
created() {
console.log(this.goods)
this.getCurrentStore()
let that = this
uni.getLocation({
type: 'wgs84',
success: function (res) {
that.position= res.latitude+','+res.longitude;
}
});
},
methods:{
goUrl(){
......@@ -65,17 +103,18 @@
this.request2(
{
url: "/api/AppletStores/GetCurrentStore",
data: {storeId:0,position:'30.642926,104.090009'},
data: {storeId:0,position:this.position},
},
(res) => {
console.log(1)
if(res.data && res.data.storeInfo){
this.storeInfo = res.data.storeInfo
}
}
);
},
goStorelist(){//门店选择
uni.navigateTo({
url:"/pages/reserve/storeList"
url:"/pages/reserve/storeList?position="+this.position
})
}
}
......@@ -86,13 +125,13 @@
.store {
width: 100%;
height: 184px;
/* height: 184px; */
}
.store .box{
width: 100%;
height: 100%;
height: 184px;
box-shadow:0 6px 10px 1px #F2F2F2;
font-family: aa;
position: relative;
......@@ -104,7 +143,7 @@
}
.store .content{
width: 100%;
height: 80px;
display: flex;
flex-direction: column;
justify-content: space-between;
......@@ -114,6 +153,16 @@
left: 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{
width: 100%;
display: flex;
......@@ -147,6 +196,11 @@
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
padding: 5px 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.store .switchstore{
position: absolute;
......@@ -162,4 +216,16 @@
border-radius: 8px;
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>
pages/index/index.vue
View file @ 1a5bb0a5
......@@ -64,7 +64,7 @@
<rstudy v-if="d.id == 'education'" :goods="d.data" ref='study'></rstudy>
<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>
</view>
......
pages/reserve/storeDetails.vue
View file @ 1a5bb0a5
......@@ -24,6 +24,7 @@
justify-content: space-between;
}
.storeDetails .arrow {
height: 24px;
margin: 5px 10px;
......@@ -202,9 +203,10 @@
:scroll-y="true"
@scroll="scrollHandler"
@scrolltoupper="scrollTopHandler"
:scroll-top="intoscrollTop"
>
<view class="details-box u-skeleton" >
<view
class="headStatus"
v-if="scrollTop > 50 "
......@@ -225,8 +227,22 @@
</view>
<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"/>
<view class="arrow2" @click="goback">
<!-- <view class="arrow2" @click="goback">
<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>
......@@ -272,7 +288,7 @@
距离你当前位置20m
</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'/>
<text>电话</text>
</view>
......@@ -385,13 +401,14 @@
{name: '评价'},
],
current: 0,
headH:0,
headH:68,
stickyH:0,
setmealH:0,//套餐卡的高度
designerH:0,//设计师的高度
richtextH:0,//富文本的高度
commentH:0,//评论的高度
showSticky:false,//是否吸顶
intoscrollTop:0,
}
},
onLoad(option){
......@@ -406,6 +423,11 @@
setTimeout(() => {
this.loading = false;
}, 100)
uni.createSelectorQuery().select(".headStatus").boundingClientRect(data=>{//目标节点
if(data && data.height){
this.headH = data.height
}
}).exec();
uni.createSelectorQuery().select(".store-tabs").boundingClientRect(data=>{
if(data && data.top){
this.stickyH = data.top
......@@ -429,19 +451,14 @@
uni.createSelectorQuery().select(".comment").boundingClientRect(data=>{
if(data && data.top){
this.commentH = data.top
}
}).exec();
},
methods:{
scrollHandler(e) {
console.log(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){
this.showSticky=true
}
......@@ -468,14 +485,19 @@
}else if(e==3){
scrollTop=this.commentH
}
uni.pageScrollTo({
　　　　　　duration:0,//过渡时间必须为0，uniapp bug，否则运行到手机会报错
// 　　　　　　scrollTop:scrollTop,//滚动到实际距离是元素距离顶部的距离减去最外层盒子的滚动距离
selector:'.comment',
complete:function(e){
console.log(e)
}
　　　　})
this.$nextTick(function() {
this.showSticky=true
setTimeout(()=>{
this.intoscrollTop = scrollTop - this.headH -40-30;
},100)
});
},
gophone(){
uni.makePhoneCall({
phoneNumber: '18781360614' //仅为示例
});
}
}
}
......
pages/reserve/storeList.vue
View file @ 1a5bb0a5
<template>
<view class="storeList">
<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>
<u-tabs :list="list" :is-scroll="false" :current="current" @change="change" :active-color="mainColor"></u-tabs>
<view v-if="g.length > 0" style="
......@@ -14,23 +14,23 @@
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="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="c-t">
<view class="c-t-l">
月星环球港门店
{{c.Name}}
</view>
<view class="c-t-r">
距离：20m
距离：{{c.KM>=1000?(c.KM/1000).toFixed(2)+'km':c.KM+'m'}}
</view>
</view>
<view class="address">
成都市锦江区阳光新业中心2号楼2302
{{c.Address}}
</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">028-12345678</text>
<text class="tel">{{c.Tel}} </text>
</view>
<view style="font-size: 11px;color: #FFC86D;">
上次消费的店铺
......@@ -89,30 +89,17 @@
pageIndex: 1,
pageSize: 10,
Name: '',
GoodsType: 0,
CategoryIds: '',
OrderBy: 1,
GoodsPageType:0
CurrentPosition: '',
OrderByType: 3,
},
val:'',
};
},
onLoad(option) {
this.mainColor = this.$uiConfig.mainColor;
this.catId = option.cat_id;
if (option && option.coupon_id && option.UseType) {//课程卡带过来的参数
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;
if (option.position) {
this.msg.CurrentPosition = option.position;
}
},
mounted() {
......@@ -126,26 +113,35 @@
change(e) {
this.current = e;
// this.g = [];
// this.msg.pageIndex = 1
// this.init();
if(e==0){
this.msg.OrderByType = 3
}else if(e==1){
this.msg.OrderByType = 5
}
this.g = [];
this.msg.pageIndex = 1
this.init();
},
gosearch(){//确认搜索
console.log(this.val)
this.g = [];
this.msg.pageIndex = 1
this.init();
},
init() {
this.loading = true;
this.msg.GoodsPageType = uni.getStorageSync("mall_UserInfo")?uni.getStorageSync("mall_UserInfo").UserPageType:0;
uni.showLoading({
title: '加载中'
});
this.request2({
url: '/api/AppletSchool/GetAppletCoursePageList',
url: '/api/AppletStores/GetStorePage',
data: this.msg
},
res => {
this.loading = false;
this.isloading = false;
if (res.resultCode == 1) {
this.g = this.g.concat(res.data.pageData);
this.page_count = res.data.pageCount;
if (this.page_count == 1) {
......@@ -155,8 +151,8 @@
this.status = "loadmore";
}
}
uni.hideNavigationBarLoading();
uni.hideLoading();
}
);
......@@ -234,7 +230,7 @@
color: #000000;
}
.storeList .c-t-r{
width: 80px;
width: 90px;
text-align: right;
font-size: 12px;
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