ShenhaiH5/src/base/shop/detailsShop.vue

<template>
  <view class="common-details-container">
    <view class="common-header-wrapper">
      <image :src="pathPre + content.image" mode="aspectFill" />
    </view>
    <view class="common-content-wrapper">
      <view class="common-card">
        <view class="common-card-title">{{ details.title }}</view>
        <view class="common-card-rate">
          <uni-rate allow-half :value="content.rate || 0" disabled disabledColor="#ff5702" color="#ddd" activeColor="#ff5702" />
          <text>{{ (Number(content.rate) || 0).toFixed(1) }}</text>
        </view>
        <view class="common-sub-title">营业时间: {{ details.businessAt }}</view>
      </view>
      <view class="common-card">
        <view class="common-card-title">店铺简介</view>
        <view class="common-card-content" v-if="content?.intro">
          <u-parse :html="content?.intro" />
        </view>
        <view class="common-card-content" v-else>
          <u-empty text="暂无简介" />
        </view>
        <view class="common-card-title u-margin-top-30">精品推荐</view>
        <view class="common-card-list" v-if="content.facilities?.length > 0">
          <view class="card-list-item" v-for="(item, index) in content.facilities" :key="index">
            <view class="item-img-wrap">
              <image :src="pathPre + item.img" mode="aspectFill" />
            </view>
            <view class="list-text">{{ item.name }}</view>
          </view>
        </view>
        <view class="common-empty" v-else>
          <u-empty text="暂无推荐" />
        </view>
      </view>
    </view>
  </view>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { getParkServiceShopDetail } from '@/api/home'
import { useGlobal } from '@/composables/index'

const { pathPre } = useGlobal()

const id = ref<string>('')
const details = ref<any>({})
const content = ref<any>({})
onLoad(async (options) => {
  id.value = options?.id || ''
  const parkId = uni.getStorageSync('parkId')
  const res = await getParkServiceShopDetail(id.value, parkId)
  if (res.code === 200) {
    if (res.data) {
      details.value = res.data
      content.value = JSON.parse(details.value?.content || '{}')
    }
  }
})
</script>

<style lang="scss" scoepd>
@import '../base.scss';
:deep(.list-paddingleft-2) {
  width: 100% !important;
}
</style>