fix: 服务区信息联调

src/api/home.ts

@@ -195,3 +195,11 @@ export const getBannerApi = () => {
     url: '/operate/banner/web'
   })
 }
+
+// 服务区信息
+export function getParkInfo(id: string) {
+  return http({
+    url: '/space/park/' + id,
+    method: 'GET'
+  })
+}

src/manifest.json

@@ -54,7 +54,7 @@
     "quickapp" : {},
     "h5" : {
         "router" : {
-            "base" : "/h5/",
+            "base" : "/",
             "mode" : "history"
         },
         "sdkConfigs" : {

src/pages.json

@@ -30,6 +30,13 @@
         "enablePullDownRefresh": false,
         "navigationStyle": "custom"
       }
+    },
+    {
+      "path": "pages/parkInfo",
+      "style": {
+        "navigationBarTitleText": "服务区信息",
+        "enablePullDownRefresh": false
+      }
     }
   ],
   "subPackages": [

src/pages/parkInfo.vue

@@ -0,0 +1,171 @@
+<template>
+  <view>
+    <u-swiper :list="parkInfo.images" :height="400" border-radius="0"></u-swiper>
+    <view class="park-info-container">
+      <view class="park-info-wrapper">
+        <view class="info-title">基本信息</view>
+        <view class="info-item">
+          <view class="info-item-left">服务区类型</view>
+          <view class="info-item-value">{{ parkInfo.cate ? ['', '服务区', '停车区'][parkInfo.cate] : '' }}</view>
+        </view>
+        <view class="info-item">
+          <view class="info-item-left">地区</view>
+          <view class="info-item-value"> {{ parkInfo.provinceName }} {{ parkInfo.cityName }} {{ parkInfo.districtName || '' }} </view>
+        </view>
+        <view class="info-item">
+          <view class="info-item-left">负责人</view>
+          <view class="info-item-value">{{ parkInfo.leader }}</view>
+        </view>
+        <view class="info-item">
+          <view class="info-item-left">联系方式</view>
+          <view class="info-item-value">{{ parkInfo.mobile }}</view>
+        </view>
+        <view class="info-item">
+          <view class="info-item-left">服务区级别</view>
+          <view class="info-item-value">{{ parkInfo.level ? handleMate(parkInfo.level, levelList) : '' }}</view>
+        </view>
+        <view class="info-item">
+          <view class="info-item-left">排序</view>
+          <view class="info-item-value">{{ parkInfo.sort }}</view>
+        </view>
+        <view class="info-item">
+          <view class="info-item-left">占地面积</view>
+          <view class="info-item-value">{{ parkInfo.area }}</view>
+        </view>
+        <view class="info-item">
+          <view class="info-item-left">地址</view>
+          <view class="info-item-value">{{ parkInfo.address }}</view>
+        </view>
+        <!-- <view class="info-item">
+          <view class="info-item-left">服务区图片</view>
+          <view class="info-item-value">
+            <view v-for="(item, index) in parkInfo.images" :key="index">
+              <image :src="item" mode="aspectFill" style="width: 200rpx; height: 80rpx" @click="previewImage(parkInfo.images, index)" />
+            </view>
+          </view>
+        </view> -->
+        <view class="info-item" style="align-items: flex-start">
+          <view class="info-item-left">服务区介绍</view>
+          <view class="info-item-value">{{ parkInfo.points }}</view>
+        </view>
+        <view class="info-item">
+          <view class="info-item-left"></view>
+          <view class="info-item-value"></view>
+        </view>
+      </view>
+      <view class="park-info-wrapper">
+        <view class="info-title">详情信息</view>
+        <u-parse :html="parkInfo.introduce"></u-parse>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue'
+import { onLoad } from '@dcloudio/uni-app'
+import { getParkInfo } from '@/api/home'
+import { getDictTypeApi } from '@/api/system'
+
+const id = ref('')
+onLoad((options) => {
+  id.value = options?.id || '2001933922038382593'
+  getParkInfoFn()
+  getLevelListFn()
+})
+
+const parkInfo = ref<any>({})
+const getParkInfoFn = async () => {
+  const res = await getParkInfo(id.value)
+  if (res.code === 200) {
+    if (res.data) {
+      parkInfo.value = res.data
+      // 图片处理
+      parkInfo.value.images = parkInfo.value.images.map((item: { filePath: string }) => item.filePath)
+      // 标题处理
+      uni.setNavigationBarTitle({
+        title: parkInfo.value.name || ''
+      })
+    }
+  }
+}
+
+// 获取服务区级别
+const levelList = ref<any>([])
+const getLevelListFn = async () => {
+  const res = await getDictTypeApi('space_park_level')
+  if (res.code === 200) {
+    if (res.data) {
+      levelList.value = res.data
+    }
+  }
+}
+
+// 数组数据匹配
+const handleMate = (data: any, list: any[]) => {
+  const value = list.filter((item: { id: any; value: any; dictValue: string }) => {
+    return item.id === data || item.value === data || item.dictValue === String(data)
+  })
+  if (value && value.length) {
+    return value[0].name || value[0].label || value[0].dictLabel
+  }
+}
+
+// 图片预览功能
+const previewImage = (pics: string[], currentIndex: number) => {
+  // 将图片路径转换为完整路径
+  const fullImageList = pics.map((pic) => pic)
+
+  // 调用uni的图片预览API
+  uni.previewImage({
+    current: fullImageList[currentIndex], // 当前显示图片的http链接
+    urls: fullImageList, // 需要预览的图片http链接列表
+    loop: true // 是否可循环预览
+  })
+}
+</script>
+
+<style scoped lang="scss">
+.park-info-container {
+  box-sizing: border-box;
+  padding: 24rpx;
+  .park-info-wrapper {
+    background-color: #fff;
+    padding: 30rpx;
+    border-radius: 14rpx;
+    margin-bottom: 24rpx;
+    .info-title {
+      font-size: 32rpx;
+      color: #1d2129;
+      font-weight: bold;
+      margin-bottom: 24rpx;
+    }
+    .info-item {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      border-bottom: 1rpx solid #e5e8ed;
+      padding: 24rpx 0;
+      &:first-child {
+        padding-top: 0;
+      }
+      &:last-child {
+        border-bottom: none;
+        padding-bottom: 0;
+      }
+      .info-item-left {
+        font-size: 28rpx;
+        color: #1d2129;
+        width: 200rpx;
+      }
+      .info-item-value {
+        flex: 1;
+        font-size: 28rpx;
+        color: #737880;
+        display: flex;
+        justify-content: flex-end;
+      }
+    }
+  }
+}
+</style>

vite.config.ts

@@ -8,7 +8,7 @@ export default defineConfig(({ command, mode }) => {
   if (mode === 'development' || mode === 'sandbox') {
     // 测试环境配置
     return {
-      base: '/h5/',
+      // base: '/h5/',
       plugins: [uni()],
       // envDir: resolve(__dirname, 'env'),
       define: {