feat: 预览的组件

src/pages/ChatModule/LongTextGuideCardPreview/index.vue

@@ -25,11 +25,12 @@
 </template>
 
 <script setup>
-import { defineProps,computed } from "vue";
+import { defineProps, computed } from "vue";
+import { getLongTextGuideDetailRoute } from "./detailRoutes.mjs";
 const props = defineProps({
   componentName: {
     type: String,
-    default: 'longTextCard',
+    default: 'longTextCardSnap',
   },
 });
 
@@ -45,7 +46,7 @@ const longTextCard = {
 const longTextCardSnap = {
   type: 'longTextCardSnap',
   badge: "景点故事",
-  badgeTone: "blue",
+  badgeTone: "green",
   title: "小七孔古桥 · 走了三百年的石拱",
   summary: "小七孔古桥是一座三百岁的七孔石桥，小七孔的名字就从这儿来…",
   footer: "点击查看完整介绍",
@@ -54,7 +55,7 @@ const longTextCardSnap = {
 const longTextCardRoute = {
   type: 'longTextCardRoute',
   badge: "路线指引",
-  badgeTone: "green",
+  badgeTone: "violet",
   title: "漂完卧龙潭，顺道去鸳鸯湖",
   summary: "卧龙潭到鸳鸯湖坐观光车约二十分钟。要紧的是鸳鸯湖分上下湖…",
   footer: "点击查看完整路线",
@@ -63,7 +64,7 @@ const longTextCardRoute = {
 const longTextCardScenicSpot = {
   type: 'longTextCardScenicSpot',
   badge: "拍照攻略",
-  badgeTone: "indigo",
+  badgeTone: "blue",
   title: "鸳鸯湖玻璃船，这样拍才不亏",
   summary: "玻璃船拍照，关键是拍水下那抹通透的绿，顺光时段最出片…",
   footer: "点击查看完整攻略",
@@ -80,12 +81,21 @@ const item = computed(() => {
     case 'longTextCardScenicSpot':
       return longTextCardScenicSpot;
     default:
-      return longTextCard;
+      return longTextCardSnap;
   }
 });
 
 const openDetail = (item) => {
-  /// 这里可以根据 item.type 来区分打开不同的详情页，目前先统一处理
+  const url = getLongTextGuideDetailRoute(item.type);
+  if (!url) {
+    uni.showToast({
+      title: "暂未配置详情页",
+      icon: "none",
+    });
+    return;
+  }
+
+  uni.navigateTo({ url });
 };
 
 </script>