Initial project commit

2026-05-09 16:40:29 +08:00
commit 02b0259a9e
267 changed files with 54891 additions and 0 deletions
@@ -0,0 +1,129 @@
+<script setup>
+import { resolveImageUrl } from "@/utils/image";
+import { formatSpotPrice } from "@/utils/spot";
+
+defineProps({
+  spot: {
+    type: Object,
+    required: true,
+  },
+});
+
+const emit = defineEmits(["click"]);
+
+const handleClick = () => {
+  emit("click");
+};
+</script>
+
+<template>
+  <view class="spot-card" @tap="handleClick">
+    <image
+      v-if="spot.cover_image_url"
+      class="cover"
+      :src="resolveImageUrl(spot.cover_image_url)"
+      mode="aspectFill"
+    />
+    <view v-else class="cover cover-placeholder">
+      <uni-icons type="camera" size="40" color="#94a3b8" class="placeholder-icon" />
+    </view>
+    <view class="info">
+      <text class="title">{{ spot.title }}</text>
+      <view class="meta">
+        <view class="city-tag">{{ spot.city || "未知城市" }}</view>
+        <view
+          class="price-tag"
+          :class="{ free: formatSpotPrice(spot).isFree, paid: !formatSpotPrice(spot).isFree }"
+        >
+          {{ formatSpotPrice(spot).label }}
+        </view>
+      </view>
+      <text class="desc" v-if="spot.description">
+        {{ spot.description }}
+      </text>
+    </view>
+  </view>
+</template>
+
+<style scoped>
+.spot-card {
+  background: #ffffff;
+  border-radius: 16rpx;
+  overflow: hidden;
+  box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
+  margin-bottom: 24rpx;
+}
+
+.cover {
+  width: 100%;
+  height: 320rpx;
+}
+
+.cover-placeholder {
+  background: #e2e8f0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.placeholder-icon {
+  font-size: 80rpx;
+}
+
+.info {
+  padding: 20rpx 24rpx 24rpx;
+}
+
+.title {
+  font-size: 32rpx;
+  font-weight: 600;
+  color: #1e293b;
+  display: block;
+  margin-bottom: 12rpx;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.meta {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 10rpx;
+  margin-bottom: 12rpx;
+}
+
+.city-tag {
+  font-size: 22rpx;
+  color: #6366f1;
+  background: rgba(99, 102, 241, 0.1);
+  padding: 4rpx 16rpx;
+  border-radius: 8rpx;
+}
+
+.price-tag {
+  font-size: 22rpx;
+  padding: 4rpx 16rpx;
+  border-radius: 8rpx;
+}
+
+.price-tag.free {
+  color: #16a34a;
+  background: rgba(34, 197, 94, 0.12);
+}
+
+.price-tag.paid {
+  color: #d97706;
+  background: rgba(245, 158, 11, 0.14);
+}
+
+.desc {
+  font-size: 26rpx;
+  color: #64748b;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  line-height: 1.5;
+}
+</style>