style: 更新全局样式和 UnoCSS 配置

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/style/index.scss

@@ -11,11 +11,7 @@
 
 :root,
 page {
-  // 修改按主题色
-  // --wot-color-theme: #37c2bc;
-
-  // 修改按钮背景色
-  // --wot-button-primary-bg-color: green;
+  --wot-color-theme: #f97316;
 }
 
 /*
@@ -37,10 +33,112 @@ border-t-1
 
 // ==================== 全局公共样式 ====================
 
-// 页面容器：灰色背景 + 最小全屏高度
+// 页面容器：暖白背景 + 最小全屏高度
 .yd-page-container {
   @apply min-h-screen;
-  background-color: #f5f5f5;
+  background-color: #fffdf5;
+}
+
+// ==================== AIOT 设计系统 ====================
+
+// 通用卡片样式
+.ai-card {
+  background: #fff;
+  border-radius: 48rpx;
+  border: 2rpx solid #fff7ed;
+  box-shadow: 0 2rpx 12rpx rgba(249, 115, 22, 0.06);
+}
+
+// 渐变头部
+.ai-gradient-header {
+  background: linear-gradient(135deg, #fbbf24 0%, #f97316 100%);
+  border-radius: 0 0 80rpx 80rpx;
+  padding-top: env(safe-area-inset-top);
+  position: relative;
+  overflow: hidden;
+}
+
+// 头部装饰层（点阵 + 圆圈）
+.ai-header-pattern {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  border-radius: 0 0 80rpx 80rpx;
+  overflow: hidden;
+  pointer-events: none;
+
+  &::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-image: radial-gradient(circle, #fff 1px, transparent 1px);
+    background-size: 48rpx 48rpx;
+    opacity: 0.1;
+  }
+
+  // 右上圆圈
+  &::after {
+    content: '';
+    position: absolute;
+    top: -40rpx;
+    right: -40rpx;
+    width: 320rpx;
+    height: 320rpx;
+    border-radius: 50%;
+    background: #fff;
+    opacity: 0.08;
+  }
+}
+
+// 头部装饰层 - 左下圆圈（需要额外元素）
+.ai-header-circle-bl {
+  position: absolute;
+  top: 160rpx;
+  left: -40rpx;
+  width: 256rpx;
+  height: 256rpx;
+  border-radius: 50%;
+  background: #fff;
+  opacity: 0.08;
+  pointer-events: none;
+}
+
+// 主要按钮样式
+.ai-btn-primary {
+  background: linear-gradient(to right, #fbbf24, #f97316);
+  color: #fff;
+  border-radius: 24rpx;
+  font-weight: bold;
+  text-align: center;
+  box-shadow: 0 8rpx 24rpx rgba(249, 115, 22, 0.25);
+  padding: 28rpx 0;
+}
+
+// 徽章/标签
+.ai-badge {
+  font-size: 22rpx;
+  font-weight: bold;
+  padding: 4rpx 16rpx;
+  border-radius: 999px;
+  display: inline-block;
+
+  &--orange {
+    background: #fff7ed;
+    color: #f97316;
+  }
+  &--red {
+    background: #fef2f2;
+    color: #ef4444;
+  }
+  &--green {
+    background: #f0fdf4;
+    color: #22c55e;
+  }
 }
 
 // ==================== 详情页底部操作按钮 ====================
@@ -110,4 +208,4 @@ border-t-1
       @apply mt-16rpx flex justify-end gap-16rpx;
     }
   }
-}
+}

src/uni.scss

@@ -16,7 +16,7 @@
 /* 颜色变量 */
 
 /* 行为相关颜色 */
-$uni-color-primary: #007aff;
+$uni-color-primary: #f97316;
 $uni-color-success: #4cd964;
 $uni-color-warning: #f0ad4e;
 $uni-color-error: #dd524d;

uno.config.ts

@@ -71,7 +71,36 @@ export default defineConfig({
     },
   ],
   // 动态图标需要在这里配置，或者写在vue页面中注释掉
-  safelist: ['i-carbon-code', 'i-carbon-home', 'i-carbon-user', 'i-carbon-document', 'i-carbon-chat', 'i-carbon-user-avatar'],
+  safelist: [
+    'i-carbon-code',
+    'i-carbon-home',
+    'i-carbon-user',
+    'i-carbon-document',
+    'i-carbon-chat',
+    'i-carbon-user-avatar',
+    'i-carbon-scan',
+    'i-carbon-task',
+    'i-carbon-group',
+    'i-carbon-dashboard',
+    'i-carbon-time',
+    'i-carbon-tool-kit',
+    'i-carbon-notification',
+    'i-carbon-chevron-down',
+    'i-carbon-shield-check',
+    'i-carbon-view',
+    'i-carbon-checkmark',
+    'i-carbon-checkmark-outline',
+    'i-carbon-camera',
+    'i-carbon-close',
+    'i-carbon-text-input',
+    'i-carbon-add',
+    'i-carbon-task-complete',
+    'i-carbon-events',
+    'i-carbon-qr-code',
+    'i-carbon-analytics',
+    'i-carbon-location-person',
+    'i-carbon-settings-adjust',
+  ],
   rules: [
     [
       'p-safe',
@@ -86,7 +115,7 @@ export default defineConfig({
   theme: {
     colors: {
       /** 主题色，用法如: text-primary */
-      primary: 'var(--wot-color-theme,#0957DE)',
+      primary: 'var(--wot-color-theme,#f97316)',
     },
     fontSize: {
       /** 提供更小号的字体，用法如：text-2xs */