hookehuyr

feat: 新增地图导览页面并集成到首页

添加新的地图导览页面,使用 WebView 承载外部地图应用。在首页增加地图导览入口卡片并更新描述,同时将测试中心按钮样式调整为轮廓样式以区分主要操作。
export default {
pages: [
'pages/index/index',
'pages/map-guide/index',
'pages/message/index',
'pages/mine/index',
'pages/pay-test/index',
......
......@@ -22,7 +22,7 @@
<view class="overview-grid">
<view class="overview-card">
<text class="card-title">首页</text>
<text class="card-desc">展示当前项目概览与测试入口。</text>
<text class="card-desc">展示当前项目概览、地图导览与测试入口。</text>
</view>
<view class="overview-card">
<text class="card-title">消息</text>
......@@ -34,12 +34,20 @@
</view>
</view>
<view class="map-entry-card">
<text class="section-label">地图导览</text>
<text class="map-entry-desc">
当前通过小程序 WebView 承载地图项目,方便从首页直接进入步行导览页面。
</text>
<button class="primary-btn" @tap="goToMapGuide">打开地图导览</button>
</view>
<view class="test-entry-card">
<text class="section-label">测试入口</text>
<text class="test-entry-desc">
支付测试与 WebView 预览已移入测试中心,首页只保留统一入口。
</text>
<button class="primary-btn" @tap="goToTestCenter">进入测试中心</button>
<button class="outline-btn" @tap="goToTestCenter">进入测试中心</button>
</view>
</view>
......@@ -59,6 +67,12 @@ const refreshAuthStatus = () => {
isAuthed.value = hasAuth()
}
const goToMapGuide = () => {
Taro.navigateTo({
url: '/pages/map-guide/index',
})
}
const goToTestCenter = () => {
Taro.navigateTo({
url: '/pages/pay-test/index',
......@@ -85,6 +99,7 @@ useDidShow(() => {
.hero-card,
.status-card,
.overview-card,
.map-entry-card,
.test-entry-card {
background: rgba(255, 255, 255, 0.94);
border: 2rpx solid rgba(166, 121, 57, 0.08);
......@@ -138,6 +153,7 @@ useDidShow(() => {
.status-text,
.card-desc,
.map-entry-desc,
.test-entry-desc {
display: block;
margin-top: 12rpx;
......@@ -183,18 +199,29 @@ useDidShow(() => {
color: #111827;
}
.map-entry-card,
.test-entry-card {
margin-top: 24rpx;
padding: 32rpx;
}
.primary-btn {
.primary-btn,
.outline-btn {
margin-top: 24rpx;
border-radius: 999rpx;
font-size: 30rpx;
line-height: 88rpx;
}
.primary-btn {
color: #fff;
background: linear-gradient(135deg, #a67939, #8f5e20);
}
.outline-btn {
color: #0f172a;
background: #fff;
border: 2rpx solid #d1d5db;
}
}
</style>
......
export default {
navigationBarTitleText: '地图导览',
}
<!--
* @Date: 2026-04-22 13:14:52
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2026-04-22 13:20:49
* @FilePath: /jls_weapp/src/pages/map-guide/index.vue
* @Description: 文件描述
-->
<template>
<web-view :src="map_guide_url" />
</template>
<script setup>
const map_guide_url = 'https://oa-dev.onwall.cn/f/map/#/checkin/?id=835368&current_lng=121.52609&current_lat=31.25956&openid=oAHBN14FGjUihI-ayF22_rCe0APM&discount_title=便民服务&activityId=835370&_t=1776834254361'
</script>