update:暂存金币相关

2026-08-19 10:14:17 +08:00
parent d60c32506f
commit 63f3cada0f
36 changed files with 1303 additions and 2 deletions
@@ -0,0 +1,81 @@
+<script setup>
+import { ref } from "vue";
+import { onLoad } from "@dcloudio/uni-app";
+import Container from "@/components/Container.vue";
+import CoinHeader from "./components/CoinHeader.vue";
+import LocationPermissionState from "./components/LocationPermissionState.vue";
+import StoreCard from "./components/StoreCard.vue";
+import { nearbyStore } from "./data";
+
+const showPermissionState = ref(false);
+
+onLoad((options = {}) => {
+  // 预留未授权态，接口接入后替换为微信定位授权结果。
+  showPermissionState.value = options.state === "empty";
+});
+
+const authorizeLocation = () => {
+  showPermissionState.value = false;
+};
+</script>
+
+<template>
+  <Container :bgType="6" :isHome="true">
+    <template #header>
+      <CoinHeader title="附近门店" />
+    </template>
+    <view class="stores-page">
+      <LocationPermissionState
+        v-if="showPermissionState"
+        @authorize="authorizeLocation"
+      />
+      <template v-else>
+        <StoreCard :store="nearbyStore" />
+        <view class="store-placeholder">
+          <image
+            class="store-placeholder__background"
+            src="/static/coin/store-placeholder-bg.png"
+            mode="scaleToFill"
+          />
+        </view>
+        <text class="stores-page__more">更多门店敬请期待~</text>
+      </template>
+    </view>
+  </Container>
+</template>
+
+<style scoped>
+.stores-page {
+  width: 100%;
+  min-height: 100%;
+  padding-bottom: 54rpx;
+  box-sizing: border-box;
+}
+
+.store-placeholder {
+  position: relative;
+  width: 650rpx;
+  height: 324rpx;
+  margin: 44rpx auto 0;
+  overflow: hidden;
+  border-radius: 12rpx;
+}
+
+.store-placeholder__background {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.stores-page__more {
+  display: block;
+  width: 650rpx;
+  margin: 26rpx auto 0;
+  color: rgba(255, 255, 255, 0.72);
+  font-size: 26rpx;
+  line-height: 36rpx;
+  text-align: left;
+}
+</style>