增加扫码页/增加环境配置

.gitignore

@@ -30,3 +30,4 @@ logs/
 # package-lock.json
 # yarn.lock
 # pnpm-lock.yaml
+/CLAUDE.md

App.vue

@@ -1,8 +1,23 @@
 <script>
 	export default {
-		onLaunch: function() {
+		onLaunch: function(options) {
-			console.warn('当前组件仅支持 uni_modules 目录结构 ，请升级 HBuilderX 到 3.1.0 版本以上！')
 			console.log('App Launch')
+
+			// #ifdef H5
+			// 解析 URL 路径中的设备编号（如 /A1036）
+			const path = window.location.pathname;
+			const segments = path.split('/').filter(Boolean);
+			if (segments.length > 0) {
+				const last = segments[segments.length - 1];
+				// 匹配设备编号格式：大写字母开头 + 大写字母/数字
+				if (/^[A-Z][A-Z0-9]+$/.test(last)) {
+					uni.redirectTo({
+						url: '/pages/index/index?device_id=' + last
+					});
+					return;
+				}
+			}
+			// #endif
 		},
 		onShow: function() {
 			console.log('App Show')

config/dev.js

@@ -0,0 +1,14 @@
+/**
+ * 开发环境配置
+ */
+const dev = {
+  apiBaseUrl: 'http://192.168.0.23:4000',
+
+  // 开发阶段硬编码 Token（生产环境应从登录流程获取）
+  bearerToken: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6ImRlZXB2ZW5kaW5nIiwic3ViIjoiMTY0MDI0MTEyNiIsImZyb20iOiJwb3MiLCJyb2xlIjoicG9zIiwibWFpbmJvYXJkX2lkIjoiVDEwMDIiLCJwb3Nfc24iOiIxNjQwMjQxMTI2IiwiaWF0IjoxNzc4NDkxOTA3LCJleHAiOjE3NzkwOTY3MDd9.DjscZtrTCr30XOngToUifxoel4q2EGES_uqGQernkvg',
+
+  // 是否开启请求日志
+  enableRequestLog: true,
+};
+
+export default dev;

config/env.js

@@ -0,0 +1,20 @@
+/**
+ * 环境配置入口
+ * 根据编译模式自动选择 dev / prod 配置
+ */
+import common from './index.js';
+import dev from './dev.js';
+import prod from './prod.js';
+
+// uni-app 编译时通过 define 注译 __UNI_PLATFORM__
+// H5 开发模式下 process.env.NODE_ENV === 'development'
+const isProd = process.env.NODE_ENV === 'production';
+
+const envConfig = isProd ? prod : dev;
+
+const config = {
+  ...common,
+  ...envConfig,
+};
+
+export default config;

config/index.js

@@ -0,0 +1,19 @@
+/**
+ * 公共配置（开发/生产环境共享）
+ */
+const common = {
+  // 应用信息
+  appName: '智能货柜',
+  appVersion: '1.0.0',
+
+  // 默认设备ID（开发调试用）
+  defaultDeviceId: 'A1036',
+
+  // 客服电话
+  servicePhone: '13264706088',
+
+  // 请求超时时间（ms）
+  requestTimeout: 10000,
+};
+
+export default common;

config/prod.js

@@ -0,0 +1,13 @@
+/**
+ * 生产环境配置
+ */
+const prod = {
+  apiBaseUrl: 'https://api.arklink.com',
+
+  // 生产环境 Token 从登录流程获取，此处为空
+  bearerToken: '',
+
+  enableRequestLog: false,
+};
+
+export default prod;

manifest.json

@@ -56,5 +56,10 @@
         },
         "usingComponents" : true
     },
+    "h5" : {
+        "router" : {
+            "mode" : "history"
+        }
+    },
     "vueVersion" : "3"
 }

pages.json

@@ -1,5 +1,11 @@
 {
   "pages": [
+    {
+      "path": "pages/index/scan",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
     {
       "path": "pages/index/index",
       "style": {

pages/index/index.vue

@@ -69,6 +69,10 @@
       <!-- 底部导航栏 -->
       <view class="tab-bar">
         <view class="tab-item" :class="{ active: currentTab === 'home' }" @click="switchTab('home')">
+          <view class="home-icon">
+            <view class="home-roof"></view>
+            <view class="home-body"></view>
+          </view>
           <text class="tab-text">首页</text>
         </view>
 
@@ -77,6 +81,10 @@
         </view>
 
         <view class="tab-item" :class="{ active: currentTab === 'mine' }" @click="switchTab('mine')">
+          <view class="mine-icon">
+            <view class="mine-head"></view>
+            <view class="mine-body"></view>
+          </view>
           <text class="tab-text">我的</text>
         </view>
       </view>
@@ -130,15 +138,13 @@
 
 <script>
 import PageNavBar from '@/components/page-nav-bar/page-nav-bar.vue';
-
+import config from '@/config/env.js';
-const API_BASE = 'http://192.168.0.23:4000';
-const DEVICE_ID = 'A1036';
-const BEARER_TOKEN = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6ImRlZXB2ZW5kaW5nIiwic3ViIjoiMTY0MDI0MTEyNiIsImZyb20iOiJwb3MiLCJyb2xlIjoicG9zIiwibWFpbmJvYXJkX2lkIjoiVDEwMDIiLCJwb3Nfc24iOiIxNjQwMjQxMTI2IiwiaWF0IjoxNzc3NTI5MjYzLCJleHAiOjE3NzgxMzQwNjN9.I7eL2oL2rmkaJKH4R6aylUloyJh0dUS3vXLvKueX28I';
 
 export default {
   components: { PageNavBar },
   data() {
     return {
+      deviceId: '',
       currentTab: 'home',
       showQrcodePopup: false,
       loading: false,
@@ -151,7 +157,7 @@ export default {
         { title: '联系客服', action: 'call' },
         { title: '公众号信息', action: 'qrcode' }
       ],
-      servicePhone: '13264706088'
+      servicePhone: config.servicePhone
     };
   },
   computed: {
@@ -174,8 +180,19 @@ export default {
       return cat ? cat.products || [] : [];
     }
   },
-  onLoad() {
+  onLoad(options) {
+    // 支持通过 tab 参数切换到"我的"页面
+    if (options.tab === 'mine') {
+      this.currentTab = 'mine';
+    }
+
+    if (options.device_id) {
+      this.deviceId = options.device_id;
       this.fetchProducts();
+    } else if (!options.tab) {
+      // 无设备编号且非 tab 跳转，跳回扫码页
+      uni.redirectTo({ url: '/pages/index/scan' });
+    }
   },
   methods: {
     switchTab(tab) { this.currentTab = tab; },
@@ -190,15 +207,27 @@ export default {
     },
     async fetchProducts() {
       this.loading = true;
+      const url = config.apiBaseUrl + '/device-product/getProductList';
+      const params = { device_id: this.deviceId };
+
+      if (config.enableRequestLog) {
+        console.log('[API] GET', url, params);
+      }
+
       try {
         const res = await uni.request({
-          url: API_BASE + '/device-product/getProductList',
+          url,
           method: 'GET',
-          data: { device_id: DEVICE_ID },
+          data: params,
           header: {
-            Authorization: 'Bearer ' + BEARER_TOKEN
+            Authorization: 'Bearer ' + config.bearerToken
           }
         });
+
+        if (config.enableRequestLog) {
+          console.log('[API] Response:', res.data);
+        }
+
         const ret = res.data || {};
         if (ret.code === 0 && Array.isArray(ret.data)) {
           this.categoryList = ret.data;
@@ -206,6 +235,9 @@ export default {
           uni.showToast({ title: ret.message || '获取商品失败', icon: 'none' });
         }
       } catch (e) {
+        if (config.enableRequestLog) {
+          console.error('[API] Error:', e);
+        }
         uni.showToast({ title: '网络请求失败', icon: 'none' });
       } finally {
         this.loading = false;
@@ -282,6 +314,73 @@ page { height: 100%; background-color: #fff; }
 .tab-bar .tab-item { flex: 1; display: flex; align-items: center; justify-content: center; height: 100%; }
 .tab-bar .tab-text { font-size: 28rpx; color: #999; font-weight: normal; }
 .tab-bar .tab-item.active .tab-text { color: #2979ff; }
+
+/* 首页图标 */
+.tab-bar .home-icon {
+  width: 40rpx;
+  height: 36rpx;
+  position: relative;
+  margin-bottom: 6rpx;
+}
+.tab-bar .home-roof {
+  width: 0;
+  height: 0;
+  border-left: 22rpx solid transparent;
+  border-right: 22rpx solid transparent;
+  border-bottom: 18rpx solid #999;
+  position: absolute;
+  top: 0;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.tab-bar .home-body {
+  width: 30rpx;
+  height: 18rpx;
+  background-color: #999;
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  border-radius: 0 0 3rpx 3rpx;
+}
+.tab-bar .tab-item.active .home-roof {
+  border-bottom-color: #2979ff;
+}
+.tab-bar .tab-item.active .home-body {
+  background-color: #2979ff;
+}
+
+/* 我的图标（与扫一扫页共用） */
+.tab-bar .mine-icon {
+  width: 40rpx;
+  height: 36rpx;
+  position: relative;
+  margin-bottom: 6rpx;
+}
+.tab-bar .mine-head {
+  width: 16rpx;
+  height: 16rpx;
+  border-radius: 50%;
+  background-color: #999;
+  position: absolute;
+  top: 0;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.tab-bar .mine-body {
+  width: 28rpx;
+  height: 16rpx;
+  border-radius: 14rpx 14rpx 0 0;
+  background-color: #999;
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.tab-bar .tab-item.active .mine-head,
+.tab-bar .tab-item.active .mine-body {
+  background-color: #2979ff;
+}
 .door-btn-wrapper { position: relative; display: flex; align-items: center; justify-content: center; margin-top: -80rpx; }
 .door-btn { width: 160rpx; height: 160rpx; border-radius: 50%; background: linear-gradient(135deg, #2979ff, #1e60e0); color: #fff; font-size: 38rpx; font-weight: bold; display: flex; align-items: center; justify-content: center; box-shadow: 0 10rpx 36rpx rgba(41,121,255,0.55); }
 

pages/index/scan.vue

@@ -0,0 +1,310 @@
+<template>
+  <view class="scan-page">
+    <!-- 顶部品牌 -->
+    <view class="brand-area">
+      <text class="brand-name">智联方舟</text>
+    </view>
+
+    <!-- 中间扫一扫按钮 -->
+    <view class="scan-area">
+      <view class="scan-btn" @click="handleScan">
+        <!-- 二维码图标 -->
+        <view class="qr-icon">
+          <view class="qr-row">
+            <view class="qr-block"></view>
+            <view class="qr-block"></view>
+            <view class="qr-space"></view>
+            <view class="qr-block"></view>
+          </view>
+          <view class="qr-row">
+            <view class="qr-block"></view>
+            <view class="qr-space"></view>
+            <view class="qr-block"></view>
+            <view class="qr-space"></view>
+          </view>
+          <view class="qr-row">
+            <view class="qr-space"></view>
+            <view class="qr-block"></view>
+            <view class="qr-space"></view>
+            <view class="qr-block"></view>
+          </view>
+          <view class="qr-row">
+            <view class="qr-block"></view>
+            <view class="qr-block"></view>
+            <view class="qr-block"></view>
+            <view class="qr-space"></view>
+          </view>
+        </view>
+        <text class="scan-text">扫一扫</text>
+      </view>
+      <text class="scan-tip">扫描货柜上的二维码开始购物</text>
+    </view>
+
+    <!-- 我的入口 -->
+    <view class="mine-entry" @click="goMine">
+      <view class="mine-icon">
+        <view class="mine-head"></view>
+        <view class="mine-body"></view>
+      </view>
+      <text class="mine-text">我的</text>
+    </view>
+
+    <!-- 底部客服电话 -->
+    <view class="footer">
+      <text class="footer-text">客服电话：</text>
+      <text class="footer-phone" @click="callService">{{ servicePhone }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+import config from '@/config/env.js';
+
+export default {
+  data() {
+    return {
+      servicePhone: config.servicePhone,
+    };
+  },
+  onLoad(options) {
+    // 1. query 参数中携带设备编号
+    if (options.device_id) {
+      uni.redirectTo({
+        url: '/pages/index/index?device_id=' + options.device_id,
+      });
+      return;
+    }
+
+    // #ifdef H5
+    // 2. URL 路径中携带设备编号（如 http://xxx/A1036）
+    const path = window.location.pathname;
+    const segments = path.split('/').filter(Boolean);
+    if (segments.length > 0) {
+      const last = segments[segments.length - 1];
+      if (/^[A-Z][A-Z0-9]+$/.test(last)) {
+        uni.redirectTo({
+          url: '/pages/index/index?device_id=' + last,
+        });
+        return;
+      }
+    }
+    // #endif
+  },
+  methods: {
+    handleScan() {
+      // #ifdef H5
+      uni.showToast({ title: 'H5 环境暂不支持扫码', icon: 'none' });
+      // #endif
+
+      // #ifdef MP-WEIXIN
+      uni.scanCode({
+        onlyFromCamera: false,
+        success: (res) => {
+          this.parseScanResult(res.result);
+        },
+        fail: () => {
+          uni.showToast({ title: '扫码取消', icon: 'none' });
+        },
+      });
+      // #endif
+    },
+    parseScanResult(result) {
+      // 解析扫码结果，提取 device_id
+      // 预期格式：https://domain/A1036 或 device_id=A1036
+      let deviceId = '';
+
+      try {
+        const url = new URL(result);
+        // 取路径最后一段作为设备编号
+        const pathParts = url.pathname.split('/').filter(Boolean);
+        if (pathParts.length > 0) {
+          deviceId = pathParts[pathParts.length - 1];
+        }
+      } catch {
+        // 非 URL 格式，尝试直接匹配
+        if (/^[A-Z][A-Z0-9]+$/.test(result)) {
+          deviceId = result;
+        }
+      }
+
+      if (deviceId) {
+        uni.redirectTo({
+          url: '/pages/index/index?device_id=' + deviceId,
+        });
+      } else {
+        uni.showToast({ title: '无效的二维码', icon: 'none' });
+      }
+    },
+    goMine() {
+      uni.navigateTo({ url: '/pages/index/index?tab=mine' });
+    },
+    callService() {
+      // #ifdef H5
+      window.location.href = 'tel:' + this.servicePhone;
+      // #endif
+
+      // #ifndef H5
+      uni.makePhoneCall({ phoneNumber: this.servicePhone, fail: () => {} });
+      // #endif
+    },
+  },
+};
+</script>
+
+<style scoped>
+page {
+  height: 100%;
+  background-color: #fff;
+}
+
+.scan-page {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  height: 100vh;
+  background-color: #fff;
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+}
+
+/* 品牌区域 */
+.brand-area {
+  margin-top: 200rpx;
+  margin-bottom: 80rpx;
+}
+
+.brand-name {
+  font-size: 96rpx;
+  font-weight: bold;
+  color: #000;
+  letter-spacing: 12rpx;
+}
+
+/* 扫一扫按钮 */
+.scan-area {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-top: 80rpx;
+}
+
+.scan-btn {
+  width: 360rpx;
+  height: 360rpx;
+  border-radius: 50%;
+  background: linear-gradient(135deg, #2979ff, #1e60e0);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 20rpx 60rpx rgba(41, 121, 255, 0.4);
+}
+
+/* 二维码图标 */
+.qr-icon {
+  width: 120rpx;
+  height: 120rpx;
+  margin-bottom: 20rpx;
+}
+
+.qr-row {
+  display: flex;
+  margin-bottom: 6rpx;
+}
+
+.qr-row:last-child {
+  margin-bottom: 0;
+}
+
+.qr-block {
+  width: 24rpx;
+  height: 24rpx;
+  background-color: #fff;
+  margin-right: 6rpx;
+  border-radius: 4rpx;
+}
+
+.qr-space {
+  width: 24rpx;
+  height: 24rpx;
+  margin-right: 6rpx;
+}
+
+.scan-text {
+  font-size: 40rpx;
+  font-weight: bold;
+  color: #fff;
+}
+
+.scan-tip {
+  font-size: 26rpx;
+  color: #999;
+  margin-top: 40rpx;
+}
+
+/* 我的入口 */
+.mine-entry {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-top: 140rpx;
+}
+
+.mine-icon {
+  width: 60rpx;
+  height: 54rpx;
+  position: relative;
+  margin-bottom: 12rpx;
+}
+
+.mine-head {
+  width: 24rpx;
+  height: 24rpx;
+  border-radius: 50%;
+  background-color: #999;
+  position: absolute;
+  top: 0;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.mine-body {
+  width: 44rpx;
+  height: 26rpx;
+  border-radius: 22rpx 22rpx 0 0;
+  background-color: #999;
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.mine-text {
+  font-size: 28rpx;
+  color: #999;
+}
+
+/* 底部客服 */
+.footer {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 32rpx 0;
+  padding-bottom: calc(32rpx + constant(safe-area-inset-bottom));
+  padding-bottom: calc(32rpx + env(safe-area-inset-bottom));
+}
+
+.footer-text {
+  font-size: 26rpx;
+  color: #999;
+}
+
+.footer-phone {
+  font-size: 26rpx;
+  color: #2979ff;
+}
+</style>

pages/mine/mine.vue

@@ -44,6 +44,7 @@
 
 <script>
 import PageNav from '@/components/page-nav/page-nav.vue';
+import config from '@/config/env.js';
 
 export default {
   components: {
@@ -78,7 +79,7 @@ export default {
       } else if (item.action === 'contact') {
         uni.showModal({
           title: '联系客服',
-          content: '客服电话：13264706088',
+          content: '客服电话：' + config.servicePhone,
           showCancel: false
         });
       }