|
|
@ -23,15 +23,7 @@ |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- <view class="dynamics" v-html="$utils.stringFormatHtml(detail.title)"> |
|
|
|
</view> --> |
|
|
|
|
|
|
|
<view class="Artworkimages"> |
|
|
|
<view class="wrokimg" @click.stop="previewImage(detail.detailsImage, i)" :key="i" |
|
|
|
v-for="(img, i) in detail.detailsImage"> |
|
|
|
<image :src="img" mode="aspectFill"></image> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<addressSpot |
|
|
|
:address="detail.address" |
|
|
@ -46,12 +38,69 @@ |
|
|
|
<view class="browse"> |
|
|
|
{{ detail.isComment }}条评论 |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 分类 --> |
|
|
|
<view class="LabelOptions"> |
|
|
|
<uv-tabs :list="category" |
|
|
|
:activeStyle="{color : '#000', fontWeight : 900}" |
|
|
|
lineColor="#5baaff" |
|
|
|
lineHeight="8rpx" |
|
|
|
lineWidth="50rpx" |
|
|
|
:scrollable="false" |
|
|
|
@click="tabsClick"></uv-tabs> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 商城美食 --> |
|
|
|
<view class="goodList" |
|
|
|
v-if="tagIndex == 0"> |
|
|
|
<goodList :productList="list"/> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 店铺介绍 --> |
|
|
|
<view class="goodInfo" |
|
|
|
v-if="tagIndex == 1"> |
|
|
|
|
|
|
|
<view class="box" :style="{'--sexcolor' : sex[detail.sex].color}"> |
|
|
|
<view class="headPortraitimg" |
|
|
|
v-if="detail.shopImage"> |
|
|
|
<image :src="detail.shopImage" |
|
|
|
@click.stop="previewImage([item.shopImage])" |
|
|
|
mode="aspectFill"></image> |
|
|
|
</view> |
|
|
|
<view class="YaoduUniversalWall"> |
|
|
|
<view class="heide" |
|
|
|
v-if="detail.shopName"> |
|
|
|
<view class="username text-ellipsis"> |
|
|
|
{{ detail.shopName }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<callPhone |
|
|
|
:phone="detail.shopPhone" |
|
|
|
type="3" |
|
|
|
:phoneTitle="detail.title" |
|
|
|
:pid="detail.id" |
|
|
|
title="联系店家" /> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="dynamics" |
|
|
|
v-html="$utils.stringFormatHtml(detail.title)"> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="Artworkimages"> |
|
|
|
<view class="wrokimg" @click.stop="previewImage(detail.detailsImage, i)" :key="i" |
|
|
|
v-for="(img, i) in detail.detailsImage"> |
|
|
|
<image :src="img" mode="aspectFill"></image> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 评论组件 --> |
|
|
|
<commentList |
|
|
|
v-if="tagIndex == 2" |
|
|
|
@getData="getData" |
|
|
|
:list="list" |
|
|
|
:params="params" |
|
|
@ -65,31 +114,51 @@ |
|
|
|
import mixinsSex from '@/mixins/sex.js' |
|
|
|
import mixinsList from '@/mixins/list.js' |
|
|
|
import commentList from '../components/list/comment/commentList.vue' |
|
|
|
import goodList from '../components/list/gourmet/goodList.vue' |
|
|
|
export default { |
|
|
|
mixins: [mixinsSex, mixinsList], |
|
|
|
components: { |
|
|
|
commentList |
|
|
|
commentList, |
|
|
|
goodList, |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
category : [ |
|
|
|
{ |
|
|
|
name : '美食商城', |
|
|
|
value : 0, |
|
|
|
}, |
|
|
|
{ |
|
|
|
name : '店铺介绍', |
|
|
|
value : 1, |
|
|
|
}, |
|
|
|
{ |
|
|
|
name : '店铺评论', |
|
|
|
value : 2, |
|
|
|
}, |
|
|
|
], |
|
|
|
detail: {}, |
|
|
|
mixinsListApi : 'getCommentPage', |
|
|
|
// mixinsListApi : 'getCommentPage',//评论 |
|
|
|
mixinsListApi : 'getGoodsList',//美食 |
|
|
|
params : { |
|
|
|
type : '4', |
|
|
|
orderId : '', |
|
|
|
name : '', |
|
|
|
}, |
|
|
|
id : 0, |
|
|
|
tagIndex : 0, |
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad(options) { |
|
|
|
// this.$route.query的参数 |
|
|
|
console.log(options) |
|
|
|
this.id = options.id |
|
|
|
|
|
|
|
this.queryParams.type = this.params.type |
|
|
|
this.queryParams.orderId = options.id |
|
|
|
|
|
|
|
this.params.orderId = options.id |
|
|
|
|
|
|
|
this.queryParams.shopId = options.id |
|
|
|
}, |
|
|
|
onShareAppMessage(res) { |
|
|
|
return { |
|
|
@ -111,6 +180,19 @@ |
|
|
|
// } |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
tabsClick(item) { |
|
|
|
this.tagIndex = item.value |
|
|
|
|
|
|
|
if(this.tagIndex == 0){ |
|
|
|
this.list = [] |
|
|
|
this.mixinsListApi = 'getGoodsList' |
|
|
|
}else if(this.tagIndex == 2){ |
|
|
|
this.list = [] |
|
|
|
this.mixinsListApi = 'getCommentPage' |
|
|
|
} |
|
|
|
|
|
|
|
this.getData() |
|
|
|
}, |
|
|
|
getDetail() { |
|
|
|
this.$api('getStoreDetail', { |
|
|
|
id: this.id |
|
|
@ -145,43 +227,42 @@ |
|
|
|
<style lang="scss" scoped> |
|
|
|
.postDetail { |
|
|
|
padding-bottom: env(safe-area-inset-bottom); |
|
|
|
.works { |
|
|
|
background-color: #fff; |
|
|
|
padding: 40rpx; |
|
|
|
border-radius: 20rpx; |
|
|
|
|
|
|
|
.box { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
|
|
|
|
.headPortraitimg { |
|
|
|
width: 100rpx; |
|
|
|
height: 100rpx; |
|
|
|
border-radius: 15rpx; |
|
|
|
overflow: hidden; |
|
|
|
|
|
|
|
image { |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
} |
|
|
|
.box { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
|
|
|
|
.headPortraitimg { |
|
|
|
width: 100rpx; |
|
|
|
height: 100rpx; |
|
|
|
border-radius: 15rpx; |
|
|
|
overflow: hidden; |
|
|
|
|
|
|
|
image { |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
} |
|
|
|
|
|
|
|
.YaoduUniversalWall { |
|
|
|
padding: 0rpx 10rpx; |
|
|
|
|
|
|
|
.Times { |
|
|
|
display: flex; |
|
|
|
padding: 5rpx 0rpx; |
|
|
|
font-size: 20rpx; |
|
|
|
margin-top: 10rpx; |
|
|
|
|
|
|
|
.Month { |
|
|
|
margin: 0rpx 15rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.YaoduUniversalWall { |
|
|
|
padding: 0rpx 10rpx; |
|
|
|
|
|
|
|
.Times { |
|
|
|
display: flex; |
|
|
|
padding: 5rpx 0rpx; |
|
|
|
font-size: 20rpx; |
|
|
|
margin-top: 10rpx; |
|
|
|
|
|
|
|
.Month { |
|
|
|
margin: 0rpx 15rpx; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
.works { |
|
|
|
background-color: #fff; |
|
|
|
padding: 40rpx; |
|
|
|
border-radius: 20rpx; |
|
|
|
|
|
|
|
.personalInformation { |
|
|
|
display: flex; |
|
|
@ -196,29 +277,8 @@ |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.dynamics { |
|
|
|
margin-top: 20rpx; |
|
|
|
font-size: 28rpx; |
|
|
|
// font-weight: bold; |
|
|
|
// line-height: 35rpx; |
|
|
|
letter-spacing: 3rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.Artworkimages { |
|
|
|
display: flex; |
|
|
|
flex-wrap: wrap; |
|
|
|
|
|
|
|
.wrokimg { |
|
|
|
margin: 10rpx; |
|
|
|
|
|
|
|
image { |
|
|
|
height: 190rpx; |
|
|
|
width: 190rpx; |
|
|
|
border-radius: 20rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.bottom { |
|
|
|
display: flex; |
|
|
|
margin-top: 20rpx; |
|
|
@ -237,5 +297,34 @@ |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.goodList{ |
|
|
|
padding: 0 20rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.goodInfo{ |
|
|
|
margin: 20rpx; |
|
|
|
padding: 20rpx; |
|
|
|
background-color: #fff; |
|
|
|
border-radius: 30rpx; |
|
|
|
.dynamics { |
|
|
|
margin-top: 20rpx; |
|
|
|
font-size: 28rpx; |
|
|
|
letter-spacing: 3rpx; |
|
|
|
} |
|
|
|
.Artworkimages { |
|
|
|
display: flex; |
|
|
|
flex-wrap: wrap; |
|
|
|
|
|
|
|
.wrokimg { |
|
|
|
margin: 10rpx; |
|
|
|
|
|
|
|
image { |
|
|
|
height: 190rpx; |
|
|
|
width: 190rpx; |
|
|
|
border-radius: 20rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |