refactor: 架构升级

.agents/bak-skills/uniappx-project/LICENSE.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 partme-ai
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

.agents/bak-skills/uniappx-project/SKILL.md

@@ -0,0 +1,101 @@
+---
+name: uniappx-project
+description: Provides comprehensive uni-app-x component and API integration guidance. Use when the user needs official uni-app-x components or APIs, wants per-component or per-API examples, or needs cross-platform compatibility details for uni-app-x.
+license: Complete terms in LICENSE.txt
+---
+
+## When to use this skill
+
+Use this skill whenever the user wants to:
+- Use any uni-app-x built-in component
+- Use any uni-app-x API (network, storage, device, UI, navigation, media, etc.)
+- Access per-component or per-API examples with official doc links
+- Check platform compatibility for components and APIs in uni-app-x
+- Build uni-app-x applications with Vue 3 + TypeScript + Vite
+
+## How to use this skill
+
+This skill is organized to match the official uni-app-x components and API documentation:
+
+1. **Choose component or API category**:
+   - Components → `examples/components/built-in/`
+   - APIs → `examples/api/` (categorized by domain)
+
+2. **Open the matching example file**:
+   - Each component or API has its own example file
+   - Each example includes the official documentation URL
+   - Examples mirror the official documentation examples
+
+3. **Use references when you need full specs**:
+   - `references/components/built-in/` for built-in components
+   - `references/api/` for API parameter/return/compatibility details
+
+## Examples and References
+
+### Components (Built-in)
+- Examples: `examples/components/built-in/*.md`
+- References: `references/components/built-in/*.md`
+- Official docs: https://doc.dcloud.net.cn/uni-app-x/component/
+
+### APIs
+- Examples: `examples/api/{category}/*.md`
+- References: `references/api/*.md`
+- Official docs: https://doc.dcloud.net.cn/uni-app-x/api/
+
+## Best Practices
+
+1. **One file per component/API**: Each component and API has an independent example file with official doc link.
+2. **Follow platform compatibility**: Check the compatibility section in each example/reference.
+3. **Use conditional compilation**: Use `#ifdef`/`#endif` for platform-specific logic.
+4. **Keep examples aligned**: Use the official documentation examples as the source of truth.
+5. **Prefer references for specs**: Use `references/` for full parameter tables and compatibility.
+
+## Resources
+
+- **Components**: https://doc.dcloud.net.cn/uni-app-x/component/
+- **APIs**: https://doc.dcloud.net.cn/uni-app-x/api/
+- **uni-app-x**: https://doc.dcloud.net.cn/uni-app-x/
+
+## Keywords
+
+uniappx, uni-app-x, components, api, built-in components, examples, references, Vue 3, TypeScript, Vite, H5, App, mini program, 跨平台, 组件, API, 官方文档
+
+## 能力边界
+
+### ✅ 适用场景
+- 当你需要使用此技能对应的技术栈时
+- 当项目需要遵循最佳实践时
+- 当需要快速上手或深入理解核心概念时
+
+### ⚠️ 需要注意
+- 复杂业务逻辑需要结合具体场景调整
+- 性能优化需要根据实际数据量评估
+
+### ❌ 不适用场景
+- 不相关的技术栈或框架
+- 需要完全自定义的特殊场景
+
+## 常见陷阱 (Gotchas)
+
+1. **版本兼容性**：注意框架版本与依赖库的兼容性，不同版本 API 可能有差异
+2. **配置文件格式**：配置文件格式错误是最常见的问题，建议使用编辑器的语法检查
+3. **环境变量**：确保所有必要的环境变量已正确设置，敏感信息不要硬编码
+4. **依赖冲突**：多版本共存时注意依赖冲突，使用 lock 文件锁定版本
+5. **性能陷阱**：大数据量场景下注意性能优化，避免 N+1 查询等常见问题
+
+## 使用流程
+
+### Step 1: 环境准备
+确保开发环境已安装必要的依赖和工具。
+
+### Step 2: 配置初始化
+根据项目需求进行基础配置。
+
+### Step 3: 核心功能使用
+按照示例代码实现核心功能。
+
+### Step 4: 测试验证
+运行测试确保功能正常。
+
+### Step 5: 部署上线
+完成开发后进行部署和监控。

.agents/bak-skills/uniappx-project/examples/api/device/get-battery-info.md

@@ -0,0 +1,178 @@
+# uni.getBatteryInfo - 获取电池信息示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/system/battery.html#getbatteryinfo
+
+## 概述
+
+`uni.getBatteryInfo` 用于获取设备电池信息。
+
+## 基础用法
+
+```javascript
+uni.getBatteryInfo({
+  success: (res) => {
+    console.log('电池信息', res)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 获取电池信息
+
+```javascript
+uni.getBatteryInfo({
+  success: (res) => {
+    console.log('电池电量', res.level, '%')
+    console.log('是否正在充电', res.isCharging)
+  },
+  fail: (err) => {
+    console.error('获取失败', err)
+  }
+})
+```
+
+### 示例 2: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="getBatteryInfo">获取电池信息</button>
+    <view v-if="batteryInfo" class="battery-info">
+      <text>电量：{{ batteryInfo.level }}%</text>
+      <text>充电状态：{{ batteryInfo.isCharging ? '充电中' : '未充电' }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      batteryInfo: null
+    }
+  },
+  methods: {
+    getBatteryInfo() {
+      uni.getBatteryInfo({
+        success: (res) => {
+          this.batteryInfo = res
+        },
+        fail: (err) => {
+          uni.showToast({
+            title: '获取失败',
+            icon: 'none'
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 低电量提醒
+
+```javascript
+function checkBatteryLevel() {
+  uni.getBatteryInfo({
+    success: (res) => {
+      if (res.level < 20 && !res.isCharging) {
+        uni.showModal({
+          title: '低电量提醒',
+          content: `当前电量仅剩${res.level}%，建议连接充电器`,
+          showCancel: false
+        })
+      }
+    }
+  })
+}
+
+// 定时检查
+setInterval(checkBatteryLevel, 60000) // 每分钟检查一次
+```
+
+### 示例 4: 同步版本
+
+```javascript
+try {
+  const batteryInfo = uni.getBatteryInfoSync()
+  console.log('电池电量', batteryInfo.level, '%')
+  console.log('是否正在充电', batteryInfo.isCharging)
+} catch (err) {
+  console.error('获取失败', err)
+}
+```
+
+### 示例 5: 根据电量调整策略
+
+```javascript
+function getBatteryInfo() {
+  return new Promise((resolve, reject) => {
+    uni.getBatteryInfo({
+      success: (res) => {
+        resolve(res)
+      },
+      fail: (err) => {
+        reject(err)
+      }
+    })
+  })
+}
+
+// 根据电量决定是否执行耗电操作
+async function performHeavyTask() {
+  const batteryInfo = await getBatteryInfo()
+  
+  if (batteryInfo.level < 20 && !batteryInfo.isCharging) {
+    uni.showModal({
+      title: '提示',
+      content: '电量较低，建议连接充电器后再执行',
+      success: (res) => {
+        if (res.confirm) {
+          // 执行任务
+          console.log('执行任务')
+        }
+      }
+    })
+  } else {
+    // 直接执行
+    console.log('执行任务')
+  }
+}
+```
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| level | Number | 设备电量，范围 1 - 100 |
+| isCharging | Boolean | 是否正在充电 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ❌ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. H5 平台不支持此 API
+2. `level` 范围是 1-100，表示电量百分比
+3. `isCharging` 表示设备是否正在充电
+4. 同步版本 `getBatteryInfoSync` 性能更好
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/system/battery.html#getbatteryinfo
+- **同步版本**: https://doc.dcloud.net.cn/uni-app-x/api/system/battery.html#getbatteryinfosync

.agents/bak-skills/uniappx-project/examples/api/device/get-network-type.md

@@ -0,0 +1,195 @@
+# uni.getNetworkType - 获取网络类型示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/system/network.html#getnetworktype
+
+## 概述
+
+`uni.getNetworkType` 用于获取设备当前网络类型。
+
+## 基础用法
+
+```javascript
+uni.getNetworkType({
+  success: (res) => {
+    console.log('网络类型', res.networkType)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 获取网络类型
+
+```javascript
+uni.getNetworkType({
+  success: (res) => {
+    console.log('网络类型', res.networkType)
+    // 可能的值：wifi、2g、3g、4g、5g、unknown、none
+  },
+  fail: (err) => {
+    console.error('获取失败', err)
+  }
+})
+```
+
+### 示例 2: 检查网络状态
+
+```javascript
+function checkNetwork() {
+  uni.getNetworkType({
+    success: (res) => {
+      if (res.networkType === 'none') {
+        uni.showToast({
+          title: '网络不可用',
+          icon: 'none'
+        })
+      } else if (res.networkType === '2g' || res.networkType === '3g') {
+        uni.showModal({
+          title: '提示',
+          content: '当前网络较慢，建议使用WiFi',
+          showCancel: false
+        })
+      } else {
+        console.log('网络正常', res.networkType)
+      }
+    }
+  })
+}
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="checkNetwork">检查网络</button>
+    <view v-if="networkType" class="network-info">
+      <text>当前网络类型：{{ networkType }}</text>
+      <text>网络状态：{{ networkStatus }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      networkType: '',
+      networkStatus: ''
+    }
+  },
+  onLoad() {
+    this.checkNetwork()
+  },
+  methods: {
+    checkNetwork() {
+      uni.getNetworkType({
+        success: (res) => {
+          this.networkType = res.networkType
+          if (res.networkType === 'none') {
+            this.networkStatus = '无网络'
+          } else if (res.networkType === 'wifi') {
+            this.networkStatus = 'WiFi网络'
+          } else {
+            this.networkStatus = '移动网络'
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 监听网络状态变化
+
+```javascript
+// 监听网络状态变化
+uni.onNetworkStatusChange((res) => {
+  console.log('网络类型', res.networkType)
+  console.log('是否联网', res.isConnected)
+  
+  if (!res.isConnected) {
+    uni.showToast({
+      title: '网络已断开',
+      icon: 'none'
+    })
+  } else {
+    uni.showToast({
+      title: '网络已连接',
+      icon: 'success'
+    })
+  }
+})
+
+// 获取当前网络状态
+uni.getNetworkType({
+  success: (res) => {
+    console.log('当前网络类型', res.networkType)
+  }
+})
+```
+
+### 示例 5: 根据网络类型调整策略
+
+```javascript
+function getNetworkType() {
+  return new Promise((resolve, reject) => {
+    uni.getNetworkType({
+      success: (res) => {
+        resolve(res.networkType)
+      },
+      fail: (err) => {
+        reject(err)
+      }
+    })
+  })
+}
+
+// 根据网络类型决定是否加载高清图片
+async function loadImage() {
+  const networkType = await getNetworkType()
+  
+  if (networkType === 'wifi' || networkType === '4g' || networkType === '5g') {
+    // 加载高清图片
+    return 'https://example.com/hd-image.jpg'
+  } else {
+    // 加载压缩图片
+    return 'https://example.com/compressed-image.jpg'
+  }
+}
+```
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| networkType | String | 网络类型，可能的值：wifi、2g、3g、4g、5g、unknown、none |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `networkType` 可能的值：wifi、2g、3g、4g、5g、unknown、none
+2. `none` 表示无网络连接
+3. 建议配合 `onNetworkStatusChange` 监听网络变化
+4. 可以根据网络类型调整加载策略
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/system/network.html#getnetworktype
+- **监听网络变化**: https://doc.dcloud.net.cn/uni-app-x/api/system/network.html#onnetworkstatuschange

.agents/bak-skills/uniappx-project/examples/api/device/get-screen-brightness.md

@@ -0,0 +1,192 @@
+# uni.getScreenBrightness - 获取屏幕亮度示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/device/screen.html#getscreenbrightness
+
+## 概述
+
+`uni.getScreenBrightness` 用于获取屏幕亮度。
+
+## 基础用法
+
+```javascript
+uni.getScreenBrightness({
+  success: (res) => {
+    console.log('屏幕亮度', res.value)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 获取屏幕亮度
+
+```javascript
+uni.getScreenBrightness({
+  success: (res) => {
+    console.log('屏幕亮度', res.value) // 范围 0 - 1
+    console.log('亮度百分比', (res.value * 100).toFixed(0) + '%')
+  },
+  fail: (err) => {
+    console.error('获取失败', err)
+  }
+})
+```
+
+### 示例 2: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="getBrightness">获取屏幕亮度</button>
+    <view v-if="brightness !== null" class="brightness-info">
+      <text>当前亮度：{{ (brightness * 100).toFixed(0) }}%</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      brightness: null
+    }
+  },
+  methods: {
+    getBrightness() {
+      uni.getScreenBrightness({
+        success: (res) => {
+          this.brightness = res.value
+        },
+        fail: (err) => {
+          uni.showToast({
+            title: '获取失败',
+            icon: 'none'
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 保存和恢复亮度
+
+```vue
+<template>
+  <view class="container">
+    <slider 
+      :value="brightness * 100"
+      min="0"
+      max="100"
+      @change="handleBrightnessChange"
+    />
+    <button @click="saveBrightness">保存亮度</button>
+    <button @click="restoreBrightness">恢复亮度</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      brightness: 0.5,
+      savedBrightness: 0.5
+    }
+  },
+  onLoad() {
+    this.getBrightness()
+    // 加载保存的亮度
+    const saved = uni.getStorageSync('screenBrightness')
+    if (saved) {
+      this.savedBrightness = saved
+    }
+  },
+  methods: {
+    getBrightness() {
+      uni.getScreenBrightness({
+        success: (res) => {
+          this.brightness = res.value
+        }
+      })
+    },
+    handleBrightnessChange(e) {
+      this.brightness = e.detail.value / 100
+      uni.setScreenBrightness({
+        value: this.brightness
+      })
+    },
+    saveBrightness() {
+      this.savedBrightness = this.brightness
+      uni.setStorageSync('screenBrightness', this.brightness)
+      uni.showToast({
+        title: '已保存',
+        icon: 'success'
+      })
+    },
+    restoreBrightness() {
+      this.brightness = this.savedBrightness
+      uni.setScreenBrightness({
+        value: this.brightness
+      })
+      uni.showToast({
+        title: '已恢复',
+        icon: 'success'
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 检查亮度设置
+
+```javascript
+function checkBrightness() {
+  uni.getScreenBrightness({
+    success: (res) => {
+      if (res.value < 0.3) {
+        console.log('屏幕较暗')
+      } else if (res.value > 0.8) {
+        console.log('屏幕较亮')
+      } else {
+        console.log('屏幕亮度适中')
+      }
+    }
+  })
+}
+```
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| value | Number | 屏幕亮度值，范围 0 - 1 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ❌ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. H5 平台不支持此 API
+2. `value` 范围是 0-1，0 表示最暗，1 表示最亮
+3. 可以配合 `setScreenBrightness` 使用
+4. 建议在设置亮度前先获取当前亮度
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/device/screen.html#getscreenbrightness
+- **设置亮度**: https://doc.dcloud.net.cn/uni-app-x/api/device/screen.html#setscreenbrightness

.agents/bak-skills/uniappx-project/examples/api/device/get-system-info.md

@@ -0,0 +1,209 @@
+# uni.getSystemInfo - 获取系统信息示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/system/info.html#getsysteminfo
+
+## 概述
+
+`uni.getSystemInfo` 用于获取系统信息，包括设备信息、屏幕信息等。
+
+## 基础用法
+
+```javascript
+uni.getSystemInfo({
+  success: (res) => {
+    console.log('系统信息', res)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 获取系统信息
+
+```javascript
+uni.getSystemInfo({
+  success: (res) => {
+    console.log('手机品牌', res.brand)
+    console.log('手机型号', res.model)
+    console.log('系统版本', res.system)
+    console.log('平台', res.platform)
+    console.log('屏幕宽度', res.windowWidth)
+    console.log('屏幕高度', res.windowHeight)
+  }
+})
+```
+
+### 示例 2: 同步获取系统信息
+
+```javascript
+try {
+  const systemInfo = uni.getSystemInfoSync()
+  console.log('系统信息', systemInfo)
+} catch (err) {
+  console.error('获取失败', err)
+}
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="getSystemInfo">获取系统信息</button>
+    <view v-if="systemInfo" class="info-list">
+      <view class="info-item">
+        <text class="label">手机品牌：</text>
+        <text>{{ systemInfo.brand }}</text>
+      </view>
+      <view class="info-item">
+        <text class="label">手机型号：</text>
+        <text>{{ systemInfo.model }}</text>
+      </view>
+      <view class="info-item">
+        <text class="label">系统版本：</text>
+        <text>{{ systemInfo.system }}</text>
+      </view>
+      <view class="info-item">
+        <text class="label">平台：</text>
+        <text>{{ systemInfo.platform }}</text>
+      </view>
+      <view class="info-item">
+        <text class="label">屏幕宽度：</text>
+        <text>{{ systemInfo.windowWidth }}px</text>
+      </view>
+      <view class="info-item">
+        <text class="label">屏幕高度：</text>
+        <text>{{ systemInfo.windowHeight }}px</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      systemInfo: null
+    }
+  },
+  onLoad() {
+    this.getSystemInfo()
+  },
+  methods: {
+    getSystemInfo() {
+      uni.getSystemInfo({
+        success: (res) => {
+          this.systemInfo = res
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.info-list {
+  margin-top: 20px;
+  padding: 20px;
+  background-color: #f5f5f5;
+  border-radius: 8px;
+}
+.info-item {
+  padding: 10px 0;
+  border-bottom: 1px solid #eee;
+}
+.label {
+  font-weight: bold;
+  color: #333;
+}
+</style>
+```
+
+### 示例 4: 适配不同屏幕
+
+```vue
+<template>
+  <view class="container" :style="containerStyle">
+    <text>自适应内容</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      containerStyle: {}
+    }
+  },
+  onLoad() {
+    const systemInfo = uni.getSystemInfoSync()
+    this.containerStyle = {
+      width: systemInfo.windowWidth + 'px',
+      height: systemInfo.windowHeight + 'px'
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 判断平台
+
+```javascript
+const systemInfo = uni.getSystemInfoSync()
+
+// 判断平台
+if (systemInfo.platform === 'ios') {
+  console.log('iOS 平台')
+} else if (systemInfo.platform === 'android') {
+  console.log('Android 平台')
+}
+
+// 判断是否为 App
+if (systemInfo.platform !== 'devtools') {
+  console.log('非开发工具环境')
+}
+```
+
+## 返回值说明
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| brand | String | 手机品牌 |
+| model | String | 手机型号 |
+| system | String | 操作系统版本 |
+| platform | String | 客户端平台 |
+| windowWidth | Number | 窗口宽度 |
+| windowHeight | Number | 窗口高度 |
+| pixelRatio | Number | 设备像素比 |
+| screenWidth | Number | 屏幕宽度 |
+| screenHeight | Number | 屏幕高度 |
+| statusBarHeight | Number | 状态栏高度 |
+| safeArea | Object | 安全区域 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 建议在 `onLoad` 中获取系统信息
+2. 同步版本 `getSystemInfoSync` 性能更好
+3. 不同平台返回的信息可能不同
+4. 使用 `windowWidth` 和 `windowHeight` 进行屏幕适配
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/system/info.html#getsysteminfo
+- **同步版本**: https://doc.dcloud.net.cn/uni-app-x/api/system/info.html#getsysteminfosync

.agents/bak-skills/uniappx-project/examples/api/device/set-screen-brightness.md

@@ -0,0 +1,195 @@
+# uni.setScreenBrightness - 设置屏幕亮度示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/device/screen.html#setscreenbrightness
+
+## 概述
+
+`uni.setScreenBrightness` 用于设置屏幕亮度。
+
+## 基础用法
+
+```javascript
+uni.setScreenBrightness({
+  value: 0.5
+})
+```
+
+## 完整示例
+
+### 示例 1: 设置屏幕亮度
+
+```javascript
+uni.setScreenBrightness({
+  value: 0.5, // 亮度值，范围 0 - 1
+  success: () => {
+    console.log('设置成功')
+  },
+  fail: (err) => {
+    console.error('设置失败', err)
+  }
+})
+```
+
+### 示例 2: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <slider 
+      :value="brightness * 100"
+      min="0"
+      max="100"
+      @change="handleBrightnessChange"
+    />
+    <text>亮度：{{ (brightness * 100).toFixed(0) }}%</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      brightness: 0.5
+    }
+  },
+  onLoad() {
+    this.getBrightness()
+  },
+  methods: {
+    getBrightness() {
+      uni.getScreenBrightness({
+        success: (res) => {
+          this.brightness = res.value
+        }
+      })
+    },
+    handleBrightnessChange(e) {
+      this.brightness = e.detail.value / 100
+      uni.setScreenBrightness({
+        value: this.brightness,
+        success: () => {
+          console.log('亮度已设置')
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 自动调节亮度
+
+```javascript
+function autoAdjustBrightness() {
+  // 获取当前时间
+  const hour = new Date().getHours()
+  
+  // 晚上（18:00-6:00）降低亮度
+  if (hour >= 18 || hour < 6) {
+    uni.setScreenBrightness({
+      value: 0.3 // 较暗
+    })
+  } else {
+    uni.setScreenBrightness({
+      value: 0.8 // 较亮
+    })
+  }
+}
+```
+
+### 示例 4: 护眼模式
+
+```vue
+<template>
+  <view class="container">
+    <switch :checked="eyeProtectionMode" @change="toggleEyeProtection" />
+    <text>护眼模式</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      eyeProtectionMode: false,
+      originalBrightness: 0.5
+    }
+  },
+  methods: {
+    toggleEyeProtection(e) {
+      this.eyeProtectionMode = e.detail.value
+      
+      if (this.eyeProtectionMode) {
+        // 保存当前亮度
+        uni.getScreenBrightness({
+          success: (res) => {
+            this.originalBrightness = res.value
+          }
+        })
+        // 降低亮度
+        uni.setScreenBrightness({
+          value: 0.3
+        })
+      } else {
+        // 恢复原亮度
+        uni.setScreenBrightness({
+          value: this.originalBrightness
+        })
+      }
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 根据环境光调节
+
+```javascript
+// 注意：此功能需要配合其他API实现
+function adjustBrightnessByAmbient() {
+  // 获取环境光强度（需要其他API支持）
+  // 这里只是示例逻辑
+  const ambientLight = 0.5 // 假设获取到的环境光强度
+  
+  // 根据环境光设置屏幕亮度
+  const screenBrightness = Math.max(0.2, Math.min(1.0, ambientLight))
+  
+  uni.setScreenBrightness({
+    value: screenBrightness
+  })
+}
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| value | Number | 是 | 屏幕亮度值，范围 0 - 1，0 最暗，1 最亮 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ❌ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. H5 平台不支持此 API
+2. `value` 范围是 0-1，0 表示最暗，1 表示最亮
+3. 设置后立即生效
+4. 建议在用户退出应用时恢复系统默认亮度
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/device/screen.html#setscreenbrightness
+- **获取亮度**: https://doc.dcloud.net.cn/uni-app-x/api/device/screen.html#getscreenbrightness

.agents/bak-skills/uniappx-project/examples/api/file/get-file-info.md

@@ -0,0 +1,232 @@
+# uni.getFileInfo - 获取文件信息示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#getfileinfo
+
+## 概述
+
+`uni.getFileInfo` 用于获取文件信息。
+
+## 基础用法
+
+```javascript
+uni.getFileInfo({
+  filePath: 'file_path',
+  success: (res) => {
+    console.log('文件大小', res.size)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 获取文件信息
+
+```javascript
+uni.getFileInfo({
+  filePath: 'file_path',
+  success: (res) => {
+    console.log('文件大小', res.size, '字节')
+    console.log('文件大小（KB）', (res.size / 1024).toFixed(2), 'KB')
+    console.log('文件大小（MB）', (res.size / 1024 / 1024).toFixed(2), 'MB')
+  },
+  fail: (err) => {
+    console.error('获取失败', err)
+  }
+})
+```
+
+### 示例 2: 检查文件大小
+
+```javascript
+function checkFileSize(filePath) {
+  return new Promise((resolve, reject) => {
+    uni.getFileInfo({
+      filePath: filePath,
+      success: (res) => {
+        const sizeInMB = res.size / 1024 / 1024
+        if (sizeInMB > 10) {
+          uni.showModal({
+            title: '提示',
+            content: `文件大小 ${sizeInMB.toFixed(2)}MB，超过10MB，建议压缩后上传`,
+            showCancel: false
+          })
+        }
+        resolve(res)
+      },
+      fail: (err) => {
+        reject(err)
+      }
+    })
+  })
+}
+
+// 使用
+checkFileSize('file_path').then(res => {
+  console.log('文件信息', res)
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="chooseAndCheckFile">选择文件并检查</button>
+    <view v-if="fileInfo" class="file-info">
+      <text>文件大小：{{ formatFileSize(fileInfo.size) }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      fileInfo: null
+    }
+  },
+  methods: {
+    chooseAndCheckFile() {
+      uni.chooseFile({
+        count: 1,
+        success: (res) => {
+          const filePath = res.tempFiles[0].path
+          this.getFileInfo(filePath)
+        }
+      })
+    },
+    getFileInfo(filePath) {
+      uni.getFileInfo({
+        filePath: filePath,
+        success: (res) => {
+          this.fileInfo = res
+        },
+        fail: (err) => {
+          uni.showToast({
+            title: '获取失败',
+            icon: 'none'
+          })
+        }
+      })
+    },
+    formatFileSize(size) {
+      if (size < 1024) {
+        return size + ' B'
+      } else if (size < 1024 * 1024) {
+        return (size / 1024).toFixed(2) + ' KB'
+      } else {
+        return (size / 1024 / 1024).toFixed(2) + ' MB'
+      }
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 上传前检查文件大小
+
+```javascript
+function uploadFileWithSizeCheck(filePath) {
+  uni.getFileInfo({
+    filePath: filePath,
+    success: (res) => {
+      const maxSize = 10 * 1024 * 1024 // 10MB
+      
+      if (res.size > maxSize) {
+        uni.showModal({
+          title: '提示',
+          content: `文件大小 ${(res.size / 1024 / 1024).toFixed(2)}MB，超过限制`,
+          showCancel: false
+        })
+        return
+      }
+      
+      // 上传文件
+      uni.uploadFile({
+        url: 'https://api.example.com/upload',
+        filePath: filePath,
+        name: 'file',
+        success: (uploadRes) => {
+          console.log('上传成功', uploadRes)
+        }
+      })
+    }
+  })
+}
+```
+
+### 示例 5: 获取多个文件信息
+
+```javascript
+function getMultipleFileInfo(filePaths) {
+  const fileInfoList = []
+  let completedCount = 0
+  
+  filePaths.forEach((filePath, index) => {
+    uni.getFileInfo({
+      filePath: filePath,
+      success: (res) => {
+        fileInfoList[index] = {
+          path: filePath,
+          size: res.size
+        }
+        completedCount++
+        
+        if (completedCount === filePaths.length) {
+          console.log('所有文件信息', fileInfoList)
+          const totalSize = fileInfoList.reduce((sum, info) => sum + info.size, 0)
+          console.log('总大小', (totalSize / 1024 / 1024).toFixed(2), 'MB')
+        }
+      }
+    })
+  })
+}
+
+// 使用
+uni.chooseFile({
+  count: 5,
+  success: (res) => {
+    const filePaths = res.tempFiles.map(file => file.path)
+    getMultipleFileInfo(filePaths)
+  }
+})
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| filePath | String | 是 | 文件路径 |
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| size | Number | 文件大小，单位：字节 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ❌ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. H5 平台不支持此 API
+2. `size` 单位是字节（bytes）
+3. 可以通过 `size` 判断文件大小，进行上传限制
+4. 建议在上传前检查文件大小
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#getfileinfo

.agents/bak-skills/uniappx-project/examples/api/file/get-saved-file-list.md

@@ -0,0 +1,347 @@
+# uni.getSavedFileList - 获取已保存的文件列表示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#getsavedfilelist
+
+## 概述
+
+`uni.getSavedFileList` 用于获取本地已保存的文件列表。
+
+## 基础用法
+
+```javascript
+uni.getSavedFileList({
+  success: (res) => {
+    console.log('文件列表', res.fileList)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 获取文件列表
+
+```javascript
+uni.getSavedFileList({
+  success: (res) => {
+    console.log('文件数量', res.fileList.length)
+    res.fileList.forEach((file, index) => {
+      console.log(`文件${index + 1}:`, file.filePath)
+      console.log(`大小:`, file.size, '字节')
+      console.log(`创建时间:`, new Date(file.createTime))
+    })
+  },
+  fail: (err) => {
+    console.error('获取失败', err)
+  }
+})
+```
+
+### 示例 2: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="getFileList">获取文件列表</button>
+    <view v-if="fileList.length > 0" class="file-list">
+      <view 
+        v-for="(file, index) in fileList" 
+        :key="index"
+        class="file-item"
+      >
+        <text class="file-path">{{ file.filePath }}</text>
+        <text class="file-size">大小：{{ formatFileSize(file.size) }}</text>
+        <text class="file-time">创建时间：{{ formatTime(file.createTime) }}</text>
+        <button @click="removeFile(file.filePath)">删除</button>
+      </view>
+    </view>
+    <view v-else class="empty">
+      <text>暂无保存的文件</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      fileList: []
+    }
+  },
+  onLoad() {
+    this.getFileList()
+  },
+  methods: {
+    getFileList() {
+      uni.getSavedFileList({
+        success: (res) => {
+          this.fileList = res.fileList
+        },
+        fail: (err) => {
+          uni.showToast({
+            title: '获取失败',
+            icon: 'none'
+          })
+        }
+      })
+    },
+    removeFile(filePath) {
+      uni.removeSavedFile({
+        filePath: filePath,
+        success: () => {
+          uni.showToast({
+            title: '删除成功',
+            icon: 'success'
+          })
+          this.getFileList()
+        }
+      })
+    },
+    formatFileSize(size) {
+      if (size < 1024) {
+        return size + ' B'
+      } else if (size < 1024 * 1024) {
+        return (size / 1024).toFixed(2) + ' KB'
+      } else {
+        return (size / 1024 / 1024).toFixed(2) + ' MB'
+      }
+    },
+    formatTime(timestamp) {
+      const date = new Date(timestamp)
+      return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} ${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`
+    }
+  }
+}
+</script>
+
+<style>
+.file-list {
+  margin-top: 20px;
+}
+.file-item {
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+.file-path {
+  display: block;
+  font-size: 28rpx;
+  color: #333;
+  margin-bottom: 10px;
+}
+.file-size, .file-time {
+  display: block;
+  font-size: 24rpx;
+  color: #666;
+  margin-bottom: 5px;
+}
+</style>
+```
+
+### 示例 3: 计算总文件大小
+
+```javascript
+function getTotalFileSize() {
+  return new Promise((resolve, reject) => {
+    uni.getSavedFileList({
+      success: (res) => {
+        const totalSize = res.fileList.reduce((sum, file) => sum + file.size, 0)
+        const totalSizeMB = (totalSize / 1024 / 1024).toFixed(2)
+        console.log('总文件大小', totalSizeMB, 'MB')
+        resolve({
+          fileList: res.fileList,
+          totalSize: totalSize,
+          totalSizeMB: totalSizeMB
+        })
+      },
+      fail: (err) => {
+        reject(err)
+      }
+    })
+  })
+}
+
+// 使用
+getTotalFileSize().then(result => {
+  console.log('文件统计', result)
+})
+```
+
+### 示例 4: 清理旧文件
+
+```javascript
+function cleanOldFiles(maxAge = 7 * 24 * 60 * 60 * 1000) {
+  // maxAge: 最大保留时间（毫秒），默认7天
+  uni.getSavedFileList({
+    success: (res) => {
+      const now = Date.now()
+      let deletedCount = 0
+      
+      res.fileList.forEach(file => {
+        if (now - file.createTime > maxAge) {
+          uni.removeSavedFile({
+            filePath: file.filePath,
+            success: () => {
+              deletedCount++
+              console.log('已删除旧文件', file.filePath)
+            }
+          })
+        }
+      })
+      
+      setTimeout(() => {
+        uni.showToast({
+          title: `已清理${deletedCount}个文件`,
+          icon: 'success'
+        })
+      }, 1000)
+    }
+  })
+}
+
+// 使用：清理7天前的文件
+cleanOldFiles()
+```
+
+### 示例 5: 文件管理
+
+```vue
+<template>
+  <view class="container">
+    <view class="header">
+      <text>文件管理</text>
+      <text class="total-size">总大小：{{ totalSizeMB }}MB</text>
+    </view>
+    <view class="file-list">
+      <view 
+        v-for="(file, index) in fileList" 
+        :key="index"
+        class="file-item"
+      >
+        <view class="file-info">
+          <text class="file-name">{{ getFileName(file.filePath) }}</text>
+          <text class="file-detail">{{ formatFileSize(file.size) }} · {{ formatTime(file.createTime) }}</text>
+        </view>
+        <view class="file-actions">
+          <button size="mini" @click="previewFile(file)">预览</button>
+          <button size="mini" @click="removeFile(file.filePath)">删除</button>
+        </view>
+      </view>
+    </view>
+    <button @click="clearAllFiles" class="clear-btn">清空所有文件</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      fileList: [],
+      totalSizeMB: '0.00'
+    }
+  },
+  onLoad() {
+    this.getFileList()
+  },
+  methods: {
+    getFileList() {
+      uni.getSavedFileList({
+        success: (res) => {
+          this.fileList = res.fileList
+          const totalSize = res.fileList.reduce((sum, file) => sum + file.size, 0)
+          this.totalSizeMB = (totalSize / 1024 / 1024).toFixed(2)
+        }
+      })
+    },
+    getFileName(filePath) {
+      return filePath.split('/').pop()
+    },
+    removeFile(filePath) {
+      uni.removeSavedFile({
+        filePath: filePath,
+        success: () => {
+          this.getFileList()
+        }
+      })
+    },
+    clearAllFiles() {
+      uni.showModal({
+        title: '确认',
+        content: '确定要清空所有文件吗？',
+        success: (res) => {
+          if (res.confirm) {
+            this.fileList.forEach(file => {
+              uni.removeSavedFile({
+                filePath: file.filePath
+              })
+            })
+            setTimeout(() => {
+              this.getFileList()
+            }, 500)
+          }
+        }
+      })
+    },
+    previewFile(file) {
+      // 根据文件类型预览
+      if (file.filePath.endsWith('.jpg') || file.filePath.endsWith('.png')) {
+        uni.previewImage({
+          urls: [file.filePath]
+        })
+      } else {
+        uni.showToast({
+          title: '暂不支持预览此类型文件',
+          icon: 'none'
+        })
+      }
+    },
+    formatFileSize(size) {
+      if (size < 1024) {
+        return size + ' B'
+      } else if (size < 1024 * 1024) {
+        return (size / 1024).toFixed(2) + ' KB'
+      } else {
+        return (size / 1024 / 1024).toFixed(2) + ' MB'
+      }
+    },
+    formatTime(timestamp) {
+      const date = new Date(timestamp)
+      return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`
+    }
+  }
+}
+</script>
+```
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| fileList | Array | 文件列表，每个文件包含 filePath、size、createTime |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ❌ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. H5 平台不支持此 API
+2. 返回的文件列表包含通过 `uni.saveFile` 保存的文件
+3. 可以通过 `createTime` 判断文件创建时间
+4. 建议定期清理不需要的文件
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#getsavedfilelist
+- **保存文件**: https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#savefile
+- **删除文件**: https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#removesavedfile

.agents/bak-skills/uniappx-project/examples/api/file/save-file.md

@@ -0,0 +1,223 @@
+# uni.saveFile - 保存文件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#savefile
+
+## 概述
+
+`uni.saveFile` 用于保存文件到本地。
+
+## 基础用法
+
+```javascript
+uni.saveFile({
+  tempFilePath: 'temp_file_path',
+  success: (res) => {
+    console.log('保存成功', res.savedFilePath)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 保存临时文件
+
+```javascript
+uni.saveFile({
+  tempFilePath: 'temp_file_path',
+  success: (res) => {
+    console.log('保存成功', res.savedFilePath)
+    uni.showToast({
+      title: '保存成功',
+      icon: 'success'
+    })
+  },
+  fail: (err) => {
+    console.error('保存失败', err)
+  }
+})
+```
+
+### 示例 2: 保存下载的文件
+
+```javascript
+uni.downloadFile({
+  url: 'https://example.com/file.pdf',
+  success: (res) => {
+    if (res.statusCode === 200) {
+      // 保存下载的文件
+      uni.saveFile({
+        tempFilePath: res.tempFilePath,
+        success: (saveRes) => {
+          console.log('文件已保存', saveRes.savedFilePath)
+        }
+      })
+    }
+  }
+})
+```
+
+### 示例 3: 保存图片到本地
+
+```javascript
+uni.chooseImage({
+  count: 1,
+  success: (res) => {
+    const tempFilePath = res.tempFilePaths[0]
+    
+    // 保存图片
+    uni.saveFile({
+      tempFilePath: tempFilePath,
+      success: (saveRes) => {
+        console.log('图片已保存', saveRes.savedFilePath)
+        uni.showToast({
+          title: '保存成功',
+          icon: 'success'
+        })
+      }
+    })
+  }
+})
+```
+
+### 示例 4: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="downloadAndSave">下载并保存文件</button>
+    <view v-if="savedFilePath" class="file-info">
+      <text>文件已保存：{{ savedFilePath }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      savedFilePath: ''
+    }
+  },
+  methods: {
+    downloadAndSave() {
+      uni.showLoading({
+        title: '下载中...'
+      })
+      
+      uni.downloadFile({
+        url: 'https://example.com/file.pdf',
+        success: (res) => {
+          if (res.statusCode === 200) {
+            uni.saveFile({
+              tempFilePath: res.tempFilePath,
+              success: (saveRes) => {
+                this.savedFilePath = saveRes.savedFilePath
+                uni.hideLoading()
+                uni.showToast({
+                  title: '保存成功',
+                  icon: 'success'
+                })
+              },
+              fail: (err) => {
+                uni.hideLoading()
+                uni.showToast({
+                  title: '保存失败',
+                  icon: 'none'
+                })
+              }
+            })
+          }
+        },
+        fail: (err) => {
+          uni.hideLoading()
+          uni.showToast({
+            title: '下载失败',
+            icon: 'none'
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 保存多个文件
+
+```javascript
+function saveMultipleFiles(tempFilePaths) {
+  const savedFilePaths = []
+  let completedCount = 0
+  
+  tempFilePaths.forEach((tempFilePath, index) => {
+    uni.saveFile({
+      tempFilePath: tempFilePath,
+      success: (res) => {
+        savedFilePaths[index] = res.savedFilePath
+        completedCount++
+        
+        if (completedCount === tempFilePaths.length) {
+          console.log('所有文件已保存', savedFilePaths)
+          uni.showToast({
+            title: '全部保存成功',
+            icon: 'success'
+          })
+        }
+      },
+      fail: (err) => {
+        console.error(`文件${index + 1}保存失败`, err)
+        completedCount++
+      }
+    })
+  })
+}
+
+// 使用
+uni.chooseImage({
+  count: 3,
+  success: (res) => {
+    saveMultipleFiles(res.tempFilePaths)
+  }
+})
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| tempFilePath | String | 是 | 需要保存的文件的临时路径 |
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| savedFilePath | String | 文件的保存路径 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ❌ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. H5 平台不支持此 API
+2. 保存的文件可以通过 `uni.getSavedFileList` 获取列表
+3. 保存的文件可以通过 `uni.removeSavedFile` 删除
+4. 建议在保存前检查文件大小
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#savefile
+- **获取文件列表**: https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#getsavedfilelist
+- **删除文件**: https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#removesavedfile

.agents/bak-skills/uniappx-project/examples/api/location/choose-location.md

@@ -0,0 +1,299 @@
+# uni.chooseLocation - 选择位置示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/location/choose-location.html#chooselocation
+
+## 概述
+
+`uni.chooseLocation` 用于打开地图选择位置。
+
+## 基础用法
+
+```javascript
+uni.chooseLocation({
+  success: (res) => {
+    console.log('选择的位置', res.name, res.address)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 基本选择位置
+
+```javascript
+uni.chooseLocation({
+  success: (res) => {
+    console.log('位置名称', res.name)
+    console.log('详细地址', res.address)
+    console.log('纬度', res.latitude)
+    console.log('经度', res.longitude)
+  },
+  fail: (err) => {
+    console.error('选择失败', err)
+  }
+})
+```
+
+### 示例 2: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="chooseLocation">选择位置</button>
+    <view v-if="location" class="location-info">
+      <text>位置：{{ location.name }}</text>
+      <text>地址：{{ location.address }}</text>
+      <text>坐标：{{ location.latitude }}, {{ location.longitude }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      location: null
+    }
+  },
+  methods: {
+    chooseLocation() {
+      uni.chooseLocation({
+        success: (res) => {
+          this.location = res
+          uni.showToast({
+            title: '选择成功',
+            icon: 'success'
+          })
+        },
+        fail: (err) => {
+          if (err.errMsg.includes('auth deny')) {
+            uni.showModal({
+              title: '提示',
+              content: '需要位置权限才能选择位置',
+              success: (modalRes) => {
+                if (modalRes.confirm) {
+                  uni.openSetting()
+                }
+              }
+            })
+          } else {
+            uni.showToast({
+              title: '选择失败',
+              icon: 'none'
+            })
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 选择收货地址
+
+```vue
+<template>
+  <view class="container">
+    <view class="address-item" @click="chooseAddress">
+      <view v-if="address">
+        <text class="address-name">{{ address.name }}</text>
+        <text class="address-detail">{{ address.address }}</text>
+      </view>
+      <view v-else>
+        <text>请选择收货地址</text>
+      </view>
+      <text class="arrow">></text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      address: null
+    }
+  },
+  methods: {
+    chooseAddress() {
+      uni.chooseLocation({
+        success: (res) => {
+          this.address = {
+            name: res.name,
+            address: res.address,
+            latitude: res.latitude,
+            longitude: res.longitude
+          }
+          // 保存地址
+          uni.setStorageSync('deliveryAddress', this.address)
+        }
+      })
+    }
+  },
+  onLoad() {
+    // 加载保存的地址
+    const savedAddress = uni.getStorageSync('deliveryAddress')
+    if (savedAddress) {
+      this.address = savedAddress
+    }
+  }
+}
+</script>
+
+<style>
+.address-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+.address-name {
+  display: block;
+  font-size: 32rpx;
+  font-weight: bold;
+  margin-bottom: 10rpx;
+}
+.address-detail {
+  display: block;
+  font-size: 28rpx;
+  color: #999;
+}
+.arrow {
+  color: #999;
+}
+</style>
+```
+
+### 示例 4: 检查权限
+
+```javascript
+function chooseLocationWithPermission() {
+  // 先检查权限
+  uni.getSetting({
+    success: (res) => {
+      if (res.authSetting['scope.userLocation']) {
+        // 已授权，直接选择
+        chooseLocation()
+      } else {
+        // 请求授权
+        uni.authorize({
+          scope: 'scope.userLocation',
+          success: () => {
+            chooseLocation()
+          },
+          fail: () => {
+            uni.showModal({
+              title: '提示',
+              content: '需要位置权限才能选择位置',
+              success: (modalRes) => {
+                if (modalRes.confirm) {
+                  uni.openSetting()
+                }
+              }
+            })
+          }
+        })
+      }
+    }
+  })
+}
+
+function chooseLocation() {
+  uni.chooseLocation({
+    success: (res) => {
+      console.log('选择的位置', res)
+    }
+  })
+}
+```
+
+### 示例 5: 在地图上显示选择的位置
+
+```vue
+<template>
+  <view class="container">
+    <button @click="chooseLocation">选择位置</button>
+    <map 
+      v-if="location"
+      :latitude="location.latitude"
+      :longitude="location.longitude"
+      :markers="markers"
+      class="map"
+    ></map>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      location: null,
+      markers: []
+    }
+  },
+  methods: {
+    chooseLocation() {
+      uni.chooseLocation({
+        success: (res) => {
+          this.location = res
+          this.markers = [{
+            id: 1,
+            latitude: res.latitude,
+            longitude: res.longitude,
+            title: res.name
+          }]
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.map {
+  width: 100%;
+  height: 500px;
+  margin-top: 20px;
+}
+</style>
+```
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| name | String | 位置名称 |
+| address | String | 详细地址 |
+| latitude | Number | 纬度 |
+| longitude | Number | 经度 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ❌ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 需要用户授权位置权限
+2. H5 平台不支持此 API
+3. 选择的位置包含名称、地址和坐标信息
+4. 建议在需要时再请求权限
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/location/choose-location.html#chooselocation
+- **获取位置**: https://doc.dcloud.net.cn/uni-app-x/api/location/location.html#getlocation
+- **打开地图**: https://doc.dcloud.net.cn/uni-app-x/api/location/open-location.html#openlocation

.agents/bak-skills/uniappx-project/examples/api/location/get-location.md

@@ -0,0 +1,243 @@
+# uni.getLocation - 获取位置示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/location/location.html#getlocation
+
+## 概述
+
+`uni.getLocation` 用于获取当前地理位置。
+
+## 基础用法
+
+```javascript
+uni.getLocation({
+  type: 'wgs84',
+  success: (res) => {
+    console.log('当前位置', res.latitude, res.longitude)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 获取当前位置
+
+```javascript
+uni.getLocation({
+  type: 'wgs84',
+  success: (res) => {
+    console.log('纬度', res.latitude)
+    console.log('经度', res.longitude)
+    console.log('速度', res.speed)
+    console.log('精度', res.accuracy)
+  },
+  fail: (err) => {
+    console.error('获取位置失败', err)
+  }
+})
+```
+
+### 示例 2: 高精度定位
+
+```javascript
+uni.getLocation({
+  type: 'gcj02',
+  altitude: true,
+  geocode: true,
+  success: (res) => {
+    console.log('位置信息', res)
+    // res.address 包含地址信息（需要 geocode: true）
+  }
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="getCurrentLocation">获取当前位置</button>
+    <view v-if="location" class="location-info">
+      <text>纬度：{{ location.latitude }}</text>
+      <text>经度：{{ location.longitude }}</text>
+      <text>地址：{{ location.address || '未获取' }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      location: null
+    }
+  },
+  methods: {
+    getCurrentLocation() {
+      uni.showLoading({
+        title: '定位中...'
+      })
+      
+      uni.getLocation({
+        type: 'gcj02',
+        geocode: true,
+        success: (res) => {
+          this.location = res
+          uni.hideLoading()
+          uni.showToast({
+            title: '定位成功',
+            icon: 'success'
+          })
+        },
+        fail: (err) => {
+          uni.hideLoading()
+          uni.showToast({
+            title: '定位失败',
+            icon: 'none'
+          })
+          console.error('定位失败', err)
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 检查定位权限
+
+```javascript
+// 先检查定位权限
+uni.getSetting({
+  success: (res) => {
+    if (res.authSetting['scope.userLocation']) {
+      // 已授权，直接获取位置
+      uni.getLocation({
+        type: 'gcj02',
+        success: (res) => {
+          console.log('位置', res)
+        }
+      })
+    } else {
+      // 未授权，请求授权
+      uni.authorize({
+        scope: 'scope.userLocation',
+        success: () => {
+          uni.getLocation({
+            type: 'gcj02',
+            success: (res) => {
+              console.log('位置', res)
+            }
+          })
+        },
+        fail: () => {
+          uni.showModal({
+            title: '提示',
+            content: '需要定位权限才能使用此功能',
+            showCancel: false
+          })
+        }
+      })
+    }
+  }
+})
+```
+
+### 示例 5: 在地图上显示位置
+
+```vue
+<template>
+  <view class="container">
+    <button @click="getLocationAndShow">获取位置并显示</button>
+    <map 
+      v-if="location"
+      :latitude="location.latitude"
+      :longitude="location.longitude"
+      :markers="markers"
+      class="map"
+    ></map>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      location: null,
+      markers: []
+    }
+  },
+  methods: {
+    getLocationAndShow() {
+      uni.getLocation({
+        type: 'gcj02',
+        success: (res) => {
+          this.location = res
+          this.markers = [{
+            id: 1,
+            latitude: res.latitude,
+            longitude: res.longitude,
+            title: '我的位置'
+          }]
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.map {
+  width: 100%;
+  height: 500px;
+  margin-top: 20px;
+}
+</style>
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| type | String | 否 | 坐标类型，可选值：wgs84、gcj02 |
+| altitude | Boolean | 否 | 是否返回高度信息 |
+| geocode | Boolean | 否 | 是否解析地址信息 |
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| latitude | Number | 纬度 |
+| longitude | Number | 经度 |
+| speed | Number | 速度 |
+| accuracy | Number | 位置的精确度 |
+| altitude | Number | 高度（需要 altitude: true） |
+| address | Object | 地址信息（需要 geocode: true） |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅（需要 HTTPS） |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 需要用户授权定位权限
+2. H5 平台需要 HTTPS 协议
+3. `type` 为 `gcj02` 时返回的坐标可用于地图显示
+4. `geocode` 为 true 时才能获取地址信息
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/location/location.html#getlocation
+- **打开地图**: https://doc.dcloud.net.cn/uni-app-x/api/location/location.html#openlocation
+- **选择位置**: https://doc.dcloud.net.cn/uni-app-x/api/location/location.html#chooselocation

.agents/bak-skills/uniappx-project/examples/api/location/open-location.md

@@ -0,0 +1,188 @@
+# uni.openLocation - 打开地图查看位置示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/location/open-location.html#openlocation
+
+## 概述
+
+`uni.openLocation` 用于使用地图查看位置，可以打开系统地图应用显示指定位置。
+
+## 基础用法
+
+```javascript
+uni.openLocation({
+  latitude: 39.908823,
+  longitude: 116.397470,
+  name: '天安门',
+  address: '北京市东城区'
+})
+```
+
+## 完整示例
+
+### 示例 1: 打开地图查看位置
+
+```javascript
+uni.openLocation({
+  latitude: 39.908823,
+  longitude: 116.397470,
+  name: '天安门',
+  address: '北京市东城区天安门广场',
+  scale: 18,
+  success: () => {
+    console.log('打开地图成功')
+  },
+  fail: (err) => {
+    console.error('打开地图失败', err)
+  }
+})
+```
+
+### 示例 2: 先获取位置再打开地图
+
+```javascript
+// 先获取当前位置
+uni.getLocation({
+  type: 'gcj02',
+  success: (locationRes) => {
+    // 打开地图显示当前位置
+    uni.openLocation({
+      latitude: locationRes.latitude,
+      longitude: locationRes.longitude,
+      name: '我的位置',
+      address: locationRes.address || '当前位置'
+    })
+  }
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="openCurrentLocation">查看当前位置</button>
+    <button @click="openTargetLocation">查看目标位置</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      targetLocation: {
+        latitude: 39.908823,
+        longitude: 116.397470,
+        name: '天安门',
+        address: '北京市东城区天安门广场'
+      }
+    }
+  },
+  methods: {
+    openCurrentLocation() {
+      uni.getLocation({
+        type: 'gcj02',
+        success: (res) => {
+          uni.openLocation({
+            latitude: res.latitude,
+            longitude: res.longitude,
+            name: '我的位置',
+            address: res.address || '当前位置'
+          })
+        },
+        fail: () => {
+          uni.showToast({
+            title: '获取位置失败',
+            icon: 'none'
+          })
+        }
+      })
+    },
+    openTargetLocation() {
+      uni.openLocation({
+        latitude: this.targetLocation.latitude,
+        longitude: this.targetLocation.longitude,
+        name: this.targetLocation.name,
+        address: this.targetLocation.address
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 查看商家位置
+
+```javascript
+function openStoreLocation(store) {
+  uni.openLocation({
+    latitude: store.latitude,
+    longitude: store.longitude,
+    name: store.name,
+    address: store.address,
+    scale: 18,
+    success: () => {
+      console.log('打开商家位置成功')
+    }
+  })
+}
+
+// 使用
+const store = {
+  name: '星巴克咖啡',
+  address: '北京市朝阳区xxx路xxx号',
+  latitude: 39.908823,
+  longitude: 116.397470
+}
+openStoreLocation(store)
+```
+
+### 示例 5: 导航到位置
+
+```javascript
+// 在某些平台上，openLocation 可以用于导航
+uni.openLocation({
+  latitude: 39.908823,
+  longitude: 116.397470,
+  name: '目的地',
+  address: '北京市东城区',
+  scale: 18
+})
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| latitude | Number | 是 | 纬度，范围为 -90~90，负数表示南纬 |
+| longitude | Number | 是 | 经度，范围为 -180~180，负数表示西经 |
+| scale | Number | 否 | 缩放比例，范围 5~18，默认为 18 |
+| name | String | 否 | 位置名称 |
+| address | String | 否 | 地址的详细说明 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 需要使用 `gcj02` 类型的坐标（通过 `uni.getLocation` 获取）
+2. `scale` 值越大，地图显示越详细
+3. `name` 和 `address` 用于在地图上显示位置信息
+4. 不同平台打开的地图应用可能不同
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/location/open-location.html#openlocation
+- **获取位置**: https://doc.dcloud.net.cn/uni-app-x/api/location/location.html#getlocation

.agents/bak-skills/uniappx-project/examples/api/media/choose-image.md

@@ -0,0 +1,222 @@
+# uni.chooseImage - 选择图片示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#chooseimage
+
+## 概述
+
+`uni.chooseImage` 用于从本地相册选择图片或使用相机拍照。
+
+## 基础用法
+
+```javascript
+uni.chooseImage({
+  count: 1,
+  success: (res) => {
+    console.log('选择的图片', res.tempFilePaths)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 选择单张图片
+
+```javascript
+uni.chooseImage({
+  count: 1,
+  sizeType: ['original', 'compressed'],
+  sourceType: ['album', 'camera'],
+  success: (res) => {
+    console.log('选择的图片路径', res.tempFilePaths)
+    console.log('图片文件信息', res.tempFiles)
+  }
+})
+```
+
+### 示例 2: 选择多张图片
+
+```javascript
+uni.chooseImage({
+  count: 9, // 最多选择9张
+  sizeType: ['compressed'], // 只选择压缩图
+  sourceType: ['album'], // 只从相册选择
+  success: (res) => {
+    console.log('选择了', res.tempFilePaths.length, '张图片')
+    res.tempFilePaths.forEach((path, index) => {
+      console.log(`图片${index + 1}:`, path)
+    })
+  }
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="chooseImage">选择图片</button>
+    <view class="image-list">
+      <image 
+        v-for="(item, index) in imageList" 
+        :key="index"
+        :src="item"
+        mode="aspectFill"
+        class="image-item"
+        @click="previewImage(index)"
+      ></image>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      imageList: []
+    }
+  },
+  methods: {
+    chooseImage() {
+      uni.chooseImage({
+        count: 9,
+        sizeType: ['original', 'compressed'],
+        sourceType: ['album', 'camera'],
+        success: (res) => {
+          this.imageList = res.tempFilePaths
+          uni.showToast({
+            title: `选择了${res.tempFilePaths.length}张图片`,
+            icon: 'success'
+          })
+        },
+        fail: (err) => {
+          uni.showToast({
+            title: '选择图片失败',
+            icon: 'none'
+          })
+        }
+      })
+    },
+    previewImage(index) {
+      uni.previewImage({
+        current: index,
+        urls: this.imageList
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.image-list {
+  display: flex;
+  flex-wrap: wrap;
+  margin-top: 20px;
+}
+.image-item {
+  width: 200rpx;
+  height: 200rpx;
+  margin: 10rpx;
+  border-radius: 8rpx;
+}
+</style>
+```
+
+### 示例 4: 上传图片
+
+```javascript
+uni.chooseImage({
+  count: 1,
+  sizeType: ['compressed'],
+  sourceType: ['album', 'camera'],
+  success: (res) => {
+    const tempFilePath = res.tempFilePaths[0]
+    
+    // 上传图片
+    uni.uploadFile({
+      url: 'https://api.example.com/upload',
+      filePath: tempFilePath,
+      name: 'file',
+      success: (uploadRes) => {
+        const data = JSON.parse(uploadRes.data)
+        console.log('上传成功', data.url)
+        uni.showToast({
+          title: '上传成功',
+          icon: 'success'
+        })
+      },
+      fail: (err) => {
+        console.error('上传失败', err)
+        uni.showToast({
+          title: '上传失败',
+          icon: 'none'
+        })
+      }
+    })
+  }
+})
+```
+
+### 示例 5: 获取图片信息
+
+```javascript
+uni.chooseImage({
+  count: 1,
+  success: (res) => {
+    const tempFilePath = res.tempFilePaths[0]
+    
+    // 获取图片信息
+    uni.getImageInfo({
+      src: tempFilePath,
+      success: (imageInfo) => {
+        console.log('图片宽度', imageInfo.width)
+        console.log('图片高度', imageInfo.height)
+        console.log('图片路径', imageInfo.path)
+      }
+    })
+  }
+})
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| count | Number | 否 | 最多可以选择的图片张数，默认 9 |
+| sizeType | Array | 否 | 所选的图片的尺寸，可选值：original（原图）、compressed（压缩图） |
+| sourceType | Array | 否 | 选择图片的来源，可选值：album（相册）、camera（相机） |
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| tempFilePaths | Array | 图片的本地文件路径列表 |
+| tempFiles | Array | 图片的本地文件列表，每个文件包含 path 和 size |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 选择的图片是临时文件，需要上传到服务器才能永久保存
+2. 临时文件路径在不同平台格式可能不同
+3. 选择图片需要用户授权，首次使用会弹出授权提示
+4. 建议使用压缩图以节省存储空间
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#chooseimage
+- **预览图片**: https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#previewimage
+- **上传文件**: https://doc.dcloud.net.cn/uni-app-x/api/request/network-file.html#uploadfile

.agents/bak-skills/uniappx-project/examples/api/media/choose-media.md

@@ -0,0 +1,232 @@
+# uni.chooseMedia - 选择媒体文件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/media/video.html#choosemedia
+
+## 概述
+
+`uni.chooseMedia` 用于从本地相册选择图片或视频，或者使用相机拍摄图片或视频。
+
+## 基础用法
+
+```javascript
+uni.chooseMedia({
+  count: 9,
+  success: (res) => {
+    console.log('选择的文件', res.tempFiles)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 选择图片和视频
+
+```javascript
+uni.chooseMedia({
+  count: 9,
+  mediaType: ['image', 'video'],
+  sourceType: ['album', 'camera'],
+  success: (res) => {
+    console.log('选择的文件', res.tempFiles)
+    res.tempFiles.forEach((file, index) => {
+      console.log(`文件${index + 1}:`, file.tempFilePath)
+      if (file.fileType === 'image') {
+        console.log('图片大小', file.size)
+      } else if (file.fileType === 'video') {
+        console.log('视频时长', file.duration)
+      }
+    })
+  }
+})
+```
+
+### 示例 2: 只选择图片
+
+```javascript
+uni.chooseMedia({
+  count: 9,
+  mediaType: ['image'],
+  sourceType: ['album', 'camera'],
+  sizeType: ['original', 'compressed'],
+  success: (res) => {
+    console.log('选择的图片', res.tempFiles)
+  }
+})
+```
+
+### 示例 3: 只选择视频
+
+```javascript
+uni.chooseMedia({
+  count: 1,
+  mediaType: ['video'],
+  sourceType: ['album', 'camera'],
+  maxDuration: 60,
+  camera: 'back',
+  success: (res) => {
+    console.log('选择的视频', res.tempFiles)
+  }
+})
+```
+
+### 示例 4: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="chooseMedia">选择媒体文件</button>
+    <view class="media-list">
+      <view 
+        v-for="(item, index) in mediaList" 
+        :key="index"
+        class="media-item"
+      >
+        <image 
+          v-if="item.fileType === 'image'"
+          :src="item.tempFilePath"
+          mode="aspectFill"
+          class="media-preview"
+        ></image>
+        <video 
+          v-else-if="item.fileType === 'video'"
+          :src="item.tempFilePath"
+          controls
+          class="media-preview"
+        ></video>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      mediaList: []
+    }
+  },
+  methods: {
+    chooseMedia() {
+      uni.chooseMedia({
+        count: 9,
+        mediaType: ['image', 'video'],
+        sourceType: ['album', 'camera'],
+        success: (res) => {
+          this.mediaList = res.tempFiles
+          uni.showToast({
+            title: `选择了${res.tempFiles.length}个文件`,
+            icon: 'success'
+          })
+        },
+        fail: (err) => {
+          console.error('选择失败', err)
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.media-list {
+  display: flex;
+  flex-wrap: wrap;
+  margin-top: 20px;
+}
+.media-item {
+  width: 200rpx;
+  height: 200rpx;
+  margin: 10rpx;
+  border-radius: 8rpx;
+  overflow: hidden;
+}
+.media-preview {
+  width: 100%;
+  height: 100%;
+}
+</style>
+```
+
+### 示例 5: 上传媒体文件
+
+```javascript
+uni.chooseMedia({
+  count: 9,
+  mediaType: ['image', 'video'],
+  success: (res) => {
+    const files = res.tempFiles
+    let uploadCount = 0
+    
+    files.forEach((file, index) => {
+      uni.uploadFile({
+        url: 'https://api.example.com/upload',
+        filePath: file.tempFilePath,
+        name: 'file',
+        formData: {
+          fileType: file.fileType,
+          size: file.size
+        },
+        success: (uploadRes) => {
+          uploadCount++
+          console.log(`文件${index + 1}上传成功`)
+          
+          if (uploadCount === files.length) {
+            uni.showToast({
+              title: '全部上传成功',
+              icon: 'success'
+            })
+          }
+        },
+        fail: (err) => {
+          console.error(`文件${index + 1}上传失败`, err)
+        }
+      })
+    })
+  }
+})
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| count | Number | 否 | 最多可以选择的文件个数，默认 9 |
+| mediaType | Array | 否 | 文件类型，可选值：image、video |
+| sourceType | Array | 否 | 选择文件来源，可选值：album、camera |
+| maxDuration | Number | 否 | 拍摄视频最长拍摄时间，单位秒 |
+| camera | String | 否 | 使用前置或后置摄像头，可选值：back、front |
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| tempFiles | Array | 选中的文件列表，每个文件包含 tempFilePath、size、fileType 等 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `mediaType` 可以同时选择图片和视频
+2. `count` 表示最多可以选择的文件个数
+3. 返回的文件包含 `fileType` 字段，用于区分图片和视频
+4. 建议根据实际需求设置 `maxDuration` 限制视频时长
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/media/video.html#choosemedia
+- **选择图片**: https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#chooseimage
+- **选择视频**: https://doc.dcloud.net.cn/uni-app-x/api/media/video.html#choosevideo

.agents/bak-skills/uniappx-project/examples/api/media/choose-video.md

@@ -0,0 +1,233 @@
+# uni.chooseVideo - 选择视频示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/media/video.html#choosevideo
+
+## 概述
+
+`uni.chooseVideo` 用于从本地相册选择视频或使用相机拍摄视频。
+
+## 基础用法
+
+```javascript
+uni.chooseVideo({
+  success: (res) => {
+    console.log('选择的视频', res.tempFilePath)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 选择视频
+
+```javascript
+uni.chooseVideo({
+  sourceType: ['album', 'camera'],
+  maxDuration: 60,
+  camera: 'back',
+  success: (res) => {
+    console.log('视频路径', res.tempFilePath)
+    console.log('视频时长', res.duration, '秒')
+    console.log('视频大小', res.size, '字节')
+    console.log('视频高度', res.height)
+    console.log('视频宽度', res.width)
+  }
+})
+```
+
+### 示例 2: 拍摄视频
+
+```javascript
+uni.chooseVideo({
+  sourceType: ['camera'],
+  maxDuration: 30,
+  camera: 'back',
+  success: (res) => {
+    console.log('拍摄的视频', res.tempFilePath)
+    // 可以预览或上传视频
+  }
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="chooseVideo">选择视频</button>
+    <button @click="recordVideo">拍摄视频</button>
+    <video 
+      v-if="videoSrc" 
+      :src="videoSrc" 
+      controls
+      class="video-player"
+    ></video>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      videoSrc: ''
+    }
+  },
+  methods: {
+    chooseVideo() {
+      uni.chooseVideo({
+        sourceType: ['album'],
+        maxDuration: 60,
+        success: (res) => {
+          this.videoSrc = res.tempFilePath
+          uni.showToast({
+            title: '选择成功',
+            icon: 'success'
+          })
+        },
+        fail: (err) => {
+          uni.showToast({
+            title: '选择失败',
+            icon: 'none'
+          })
+        }
+      })
+    },
+    recordVideo() {
+      uni.chooseVideo({
+        sourceType: ['camera'],
+        maxDuration: 30,
+        camera: 'back',
+        success: (res) => {
+          this.videoSrc = res.tempFilePath
+          uni.showToast({
+            title: '拍摄成功',
+            icon: 'success'
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.video-player {
+  width: 100%;
+  height: 400px;
+  margin-top: 20px;
+}
+</style>
+```
+
+### 示例 4: 上传视频
+
+```javascript
+uni.chooseVideo({
+  sourceType: ['album', 'camera'],
+  maxDuration: 60,
+  success: (res) => {
+    const tempFilePath = res.tempFilePath
+    
+    // 上传视频
+    uni.uploadFile({
+      url: 'https://api.example.com/upload-video',
+      filePath: tempFilePath,
+      name: 'video',
+      formData: {
+        duration: res.duration,
+        size: res.size
+      },
+      success: (uploadRes) => {
+        const data = JSON.parse(uploadRes.data)
+        console.log('上传成功', data.url)
+        uni.showToast({
+          title: '上传成功',
+          icon: 'success'
+        })
+      },
+      fail: (err) => {
+        console.error('上传失败', err)
+      }
+    })
+  }
+})
+```
+
+### 示例 5: 限制视频时长和大小
+
+```javascript
+uni.chooseVideo({
+  sourceType: ['album', 'camera'],
+  maxDuration: 30, // 最长30秒
+  success: (res) => {
+    // 检查视频大小（例如限制为50MB）
+    const maxSize = 50 * 1024 * 1024 // 50MB
+    if (res.size > maxSize) {
+      uni.showModal({
+        title: '提示',
+        content: '视频文件过大，请选择小于50MB的视频',
+        showCancel: false
+      })
+      return
+    }
+    
+    // 检查视频时长
+    if (res.duration > 30) {
+      uni.showModal({
+        title: '提示',
+        content: '视频时长不能超过30秒',
+        showCancel: false
+      })
+      return
+    }
+    
+    console.log('视频符合要求', res)
+  }
+})
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| sourceType | Array | 否 | 选择视频的来源，可选值：album（相册）、camera（相机） |
+| maxDuration | Number | 否 | 拍摄视频最长拍摄时间，单位秒 |
+| camera | String | 否 | 使用前置或后置摄像头，可选值：back、front |
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| tempFilePath | String | 选定视频的临时文件路径 |
+| duration | Number | 选定视频的时间长度，单位秒 |
+| size | Number | 选定视频的数据量大小，单位字节 |
+| width | Number | 选定视频的宽度，单位 px |
+| height | Number | 选定视频的高度，单位 px |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 选择的视频是临时文件，需要上传到服务器才能永久保存
+2. `maxDuration` 用于限制拍摄时长
+3. 可以通过 `size` 检查视频文件大小
+4. 建议在拍摄前提示用户视频时长限制
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/media/video.html#choosevideo
+- **上传文件**: https://doc.dcloud.net.cn/uni-app-x/api/request/network-file.html#uploadfile

.agents/bak-skills/uniappx-project/examples/api/media/get-image-info.md

@@ -0,0 +1,209 @@
+# uni.getImageInfo - 获取图片信息示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#getimageinfo
+
+## 概述
+
+`uni.getImageInfo` 用于获取图片信息，包括宽度、高度、路径等。
+
+## 基础用法
+
+```javascript
+uni.getImageInfo({
+  src: 'https://example.com/image.jpg',
+  success: (res) => {
+    console.log('图片宽度', res.width)
+    console.log('图片高度', res.height)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 获取网络图片信息
+
+```javascript
+uni.getImageInfo({
+  src: 'https://example.com/image.jpg',
+  success: (res) => {
+    console.log('图片宽度', res.width)
+    console.log('图片高度', res.height)
+    console.log('图片路径', res.path)
+  },
+  fail: (err) => {
+    console.error('获取失败', err)
+  }
+})
+```
+
+### 示例 2: 获取本地图片信息
+
+```javascript
+// 先选择图片
+uni.chooseImage({
+  count: 1,
+  success: (res) => {
+    const tempFilePath = res.tempFilePaths[0]
+    
+    // 获取图片信息
+    uni.getImageInfo({
+      src: tempFilePath,
+      success: (imageInfo) => {
+        console.log('图片信息', imageInfo)
+        // { width: 800, height: 600, path: '...' }
+      }
+    })
+  }
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="selectAndGetInfo">选择图片并获取信息</button>
+    <view v-if="imageInfo" class="info">
+      <text>宽度：{{ imageInfo.width }}px</text>
+      <text>高度：{{ imageInfo.height }}px</text>
+      <image :src="imageInfo.path" mode="aspectFit" class="preview"></image>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      imageInfo: null
+    }
+  },
+  methods: {
+    selectAndGetInfo() {
+      uni.chooseImage({
+        count: 1,
+        success: (res) => {
+          const tempFilePath = res.tempFilePaths[0]
+          uni.getImageInfo({
+            src: tempFilePath,
+            success: (imageInfo) => {
+              this.imageInfo = imageInfo
+            },
+            fail: (err) => {
+              uni.showToast({
+                title: '获取图片信息失败',
+                icon: 'none'
+              })
+            }
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.info {
+  margin-top: 20px;
+  padding: 20px;
+}
+.preview {
+  width: 100%;
+  max-height: 400px;
+  margin-top: 20px;
+}
+</style>
+```
+
+### 示例 4: 计算图片宽高比
+
+```javascript
+uni.getImageInfo({
+  src: 'https://example.com/image.jpg',
+  success: (res) => {
+    const aspectRatio = res.width / res.height
+    console.log('宽高比', aspectRatio)
+    
+    // 根据宽高比调整显示
+    if (aspectRatio > 1) {
+      console.log('横向图片')
+    } else {
+      console.log('纵向图片')
+    }
+  }
+})
+```
+
+### 示例 5: 验证图片尺寸
+
+```javascript
+function validateImageSize(imagePath, minWidth, minHeight) {
+  return new Promise((resolve, reject) => {
+    uni.getImageInfo({
+      src: imagePath,
+      success: (res) => {
+        if (res.width >= minWidth && res.height >= minHeight) {
+          resolve(res)
+        } else {
+          reject(new Error(`图片尺寸不符合要求，需要至少 ${minWidth}x${minHeight}`))
+        }
+      },
+      fail: (err) => {
+        reject(err)
+      }
+    })
+  })
+}
+
+// 使用
+validateImageSize('https://example.com/image.jpg', 800, 600)
+  .then(info => {
+    console.log('图片符合要求', info)
+  })
+  .catch(err => {
+    console.error('验证失败', err)
+  })
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| src | String | 是 | 图片的路径，可以是相对路径、临时文件路径或网络图片路径 |
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| width | Number | 图片宽度，单位 px |
+| height | Number | 图片高度，单位 px |
+| path | String | 返回图片的本地路径 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 网络图片需要配置合法域名
+2. 本地图片路径需要使用 `/static/` 开头或临时文件路径
+3. 获取图片信息是异步操作
+4. 可以用于验证图片尺寸、计算宽高比等
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#getimageinfo
+- **选择图片**: https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#chooseimage

.agents/bak-skills/uniappx-project/examples/api/media/preview-image.md

@@ -0,0 +1,234 @@
+# uni.previewImage - 预览图片示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#previewimage
+
+## 概述
+
+`uni.previewImage` 用于预览图片，支持缩放、滑动查看多张图片。
+
+## 基础用法
+
+```javascript
+uni.previewImage({
+  urls: ['https://example.com/image1.jpg'],
+  current: 0
+})
+```
+
+## 完整示例
+
+### 示例 1: 预览单张图片
+
+```javascript
+uni.previewImage({
+  urls: ['https://example.com/image1.jpg'],
+  current: 'https://example.com/image1.jpg'
+})
+```
+
+### 示例 2: 预览多张图片
+
+```javascript
+const imageList = [
+  'https://example.com/image1.jpg',
+  'https://example.com/image2.jpg',
+  'https://example.com/image3.jpg'
+]
+
+uni.previewImage({
+  urls: imageList,
+  current: 0 // 从第一张开始
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <view class="image-list">
+      <image 
+        v-for="(item, index) in imageList" 
+        :key="index"
+        :src="item"
+        mode="aspectFill"
+        class="image-item"
+        @click="previewImage(index)"
+      ></image>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      imageList: [
+        'https://example.com/image1.jpg',
+        'https://example.com/image2.jpg',
+        'https://example.com/image3.jpg'
+      ]
+    }
+  },
+  methods: {
+    previewImage(index) {
+      uni.previewImage({
+        urls: this.imageList,
+        current: index
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.image-list {
+  display: flex;
+  flex-wrap: wrap;
+}
+.image-item {
+  width: 200rpx;
+  height: 200rpx;
+  margin: 10rpx;
+  border-radius: 8rpx;
+}
+</style>
+```
+
+### 示例 4: 从选择图片到预览
+
+```vue
+<template>
+  <view class="container">
+    <button @click="chooseAndPreview">选择并预览图片</button>
+    <view class="image-list">
+      <image 
+        v-for="(item, index) in selectedImages" 
+        :key="index"
+        :src="item"
+        mode="aspectFill"
+        class="image-item"
+        @click="previewSelected(index)"
+      ></image>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      selectedImages: []
+    }
+  },
+  methods: {
+    chooseAndPreview() {
+      uni.chooseImage({
+        count: 9,
+        success: (res) => {
+          this.selectedImages = res.tempFilePaths
+          // 预览第一张
+          if (res.tempFilePaths.length > 0) {
+            uni.previewImage({
+              urls: res.tempFilePaths,
+              current: 0
+            })
+          }
+        }
+      })
+    },
+    previewSelected(index) {
+      uni.previewImage({
+        urls: this.selectedImages,
+        current: index
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 长按保存图片
+
+```vue
+<template>
+  <view class="container">
+    <image 
+      :src="imageUrl"
+      mode="aspectFit"
+      @longpress="saveImage"
+      class="preview-image"
+    ></image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      imageUrl: 'https://example.com/image.jpg'
+    }
+  },
+  methods: {
+    saveImage() {
+      uni.showActionSheet({
+        itemList: ['保存图片'],
+        success: (res) => {
+          if (res.tapIndex === 0) {
+            uni.downloadFile({
+              url: this.imageUrl,
+              success: (downloadRes) => {
+                uni.saveImageToPhotosAlbum({
+                  filePath: downloadRes.tempFilePath,
+                  success: () => {
+                    uni.showToast({
+                      title: '保存成功',
+                      icon: 'success'
+                    })
+                  }
+                })
+              }
+            })
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| urls | Array | 是 | 需要预览的图片 http 链接列表 |
+| current | String/Number | 否 | 当前显示图片的索引或链接 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `urls` 必须是网络图片或已下载的本地路径
+2. `current` 可以是索引（Number）或图片链接（String）
+3. 预览时支持手势缩放和滑动切换
+4. 建议使用网络图片时确保图片可访问
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#previewimage
+- **选择图片**: https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#chooseimage

.agents/bak-skills/uniappx-project/examples/api/media/save-image-to-photos-album.md

@@ -0,0 +1,274 @@
+# uni.saveImageToPhotosAlbum - 保存图片到相册示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#saveimagetophotosalbum
+
+## 概述
+
+`uni.saveImageToPhotosAlbum` 用于保存图片到系统相册。
+
+## 基础用法
+
+```javascript
+uni.saveImageToPhotosAlbum({
+  filePath: '/tmp/image.jpg',
+  success: () => {
+    console.log('保存成功')
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 保存网络图片
+
+```javascript
+// 先下载图片
+uni.downloadFile({
+  url: 'https://example.com/image.jpg',
+  success: (res) => {
+    if (res.statusCode === 200) {
+      // 保存到相册
+      uni.saveImageToPhotosAlbum({
+        filePath: res.tempFilePath,
+        success: () => {
+          uni.showToast({
+            title: '保存成功',
+            icon: 'success'
+          })
+        },
+        fail: (err) => {
+          console.error('保存失败', err)
+          if (err.errMsg.includes('auth deny')) {
+            uni.showModal({
+              title: '提示',
+              content: '需要相册权限才能保存图片',
+              showCancel: false
+            })
+          }
+        }
+      })
+    }
+  }
+})
+```
+
+### 示例 2: 保存选择的图片
+
+```javascript
+uni.chooseImage({
+  count: 1,
+  success: (res) => {
+    const tempFilePath = res.tempFilePaths[0]
+    
+    uni.saveImageToPhotosAlbum({
+      filePath: tempFilePath,
+      success: () => {
+        uni.showToast({
+          title: '保存成功',
+          icon: 'success'
+        })
+      },
+      fail: (err) => {
+        console.error('保存失败', err)
+      }
+    })
+  }
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <image :src="imageUrl" mode="aspectFit" class="preview-image"></image>
+    <button @click="saveImage">保存图片</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      imageUrl: 'https://example.com/image.jpg'
+    }
+  },
+  methods: {
+    saveImage() {
+      // 先下载图片
+      uni.downloadFile({
+        url: this.imageUrl,
+        success: (res) => {
+          if (res.statusCode === 200) {
+            uni.saveImageToPhotosAlbum({
+              filePath: res.tempFilePath,
+              success: () => {
+                uni.showToast({
+                  title: '保存成功',
+                  icon: 'success'
+                })
+              },
+              fail: (err) => {
+                if (err.errMsg.includes('auth deny')) {
+                  uni.showModal({
+                    title: '提示',
+                    content: '需要相册权限，请在设置中开启',
+                    success: (modalRes) => {
+                      if (modalRes.confirm) {
+                        uni.openSetting()
+                      }
+                    }
+                  })
+                } else {
+                  uni.showToast({
+                    title: '保存失败',
+                    icon: 'none'
+                  })
+                }
+              }
+            })
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 检查权限
+
+```javascript
+function saveImageWithPermission(filePath) {
+  // 先检查权限
+  uni.getSetting({
+    success: (res) => {
+      if (res.authSetting['scope.writePhotosAlbum']) {
+        // 已授权，直接保存
+        saveImage(filePath)
+      } else {
+        // 请求授权
+        uni.authorize({
+          scope: 'scope.writePhotosAlbum',
+          success: () => {
+            saveImage(filePath)
+          },
+          fail: () => {
+            uni.showModal({
+              title: '提示',
+              content: '需要相册权限才能保存图片',
+              success: (modalRes) => {
+                if (modalRes.confirm) {
+                  uni.openSetting()
+                }
+              }
+            })
+          }
+        })
+      }
+    }
+  })
+}
+
+function saveImage(filePath) {
+  uni.saveImageToPhotosAlbum({
+    filePath: filePath,
+    success: () => {
+      uni.showToast({
+        title: '保存成功',
+        icon: 'success'
+      })
+    }
+  })
+}
+```
+
+### 示例 5: 长按保存图片
+
+```vue
+<template>
+  <view class="container">
+    <image 
+      :src="imageUrl" 
+      mode="aspectFit"
+      @longpress="handleLongPress"
+      class="preview-image"
+    ></image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      imageUrl: 'https://example.com/image.jpg'
+    }
+  },
+  methods: {
+    handleLongPress() {
+      uni.showActionSheet({
+        itemList: ['保存图片'],
+        success: (res) => {
+          if (res.tapIndex === 0) {
+            this.saveImage()
+          }
+        }
+      })
+    },
+    saveImage() {
+      uni.downloadFile({
+        url: this.imageUrl,
+        success: (res) => {
+          if (res.statusCode === 200) {
+            uni.saveImageToPhotosAlbum({
+              filePath: res.tempFilePath,
+              success: () => {
+                uni.showToast({
+                  title: '保存成功',
+                  icon: 'success'
+                })
+              }
+            })
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| filePath | String | 是 | 图片文件路径，可以是临时文件路径或永久文件路径 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 需要用户授权相册权限
+2. 网络图片需要先下载到本地
+3. 如果权限被拒绝，可以引导用户到设置中开启
+4. 建议在保存前检查权限状态
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#saveimagetophotosalbum
+- **下载文件**: https://doc.dcloud.net.cn/uni-app-x/api/request/network-file.html#downloadfile
+- **授权**: https://doc.dcloud.net.cn/uni-app-x/api/other/authorize.html#authorize

.agents/bak-skills/uniappx-project/examples/api/navigation/navigate-back.md

@@ -0,0 +1,177 @@
+# uni.navigateBack - 返回上一页示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/router.html#navigateback
+
+## 概述
+
+`uni.navigateBack` 用于关闭当前页面，返回上一页面或多级页面。
+
+## 基础用法
+
+```javascript
+uni.navigateBack()
+```
+
+## 完整示例
+
+### 示例 1: 基本返回
+
+```javascript
+uni.navigateBack({
+  success: () => {
+    console.log('返回成功')
+  },
+  fail: (err) => {
+    console.error('返回失败', err)
+  }
+})
+```
+
+### 示例 2: 返回多级页面
+
+```javascript
+// 返回上一页
+uni.navigateBack({
+  delta: 1
+})
+
+// 返回上两页
+uni.navigateBack({
+  delta: 2
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="goBack">返回</button>
+    <button @click="goBackTwoPages">返回上两页</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    goBack() {
+      uni.navigateBack()
+    },
+    goBackTwoPages() {
+      uni.navigateBack({
+        delta: 2
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 带数据返回
+
+```vue
+<!-- 当前页面 -->
+<template>
+  <view class="container">
+    <button @click="saveAndBack">保存并返回</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      formData: {
+        name: 'test',
+        value: '123'
+      }
+    }
+  },
+  methods: {
+    saveAndBack() {
+      // 保存数据到上一页
+      const pages = getCurrentPages()
+      const prevPage = pages[pages.length - 2]
+      if (prevPage) {
+        prevPage.setData({
+          savedData: this.formData
+        })
+      }
+      
+      uni.navigateBack()
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 返回前确认
+
+```vue
+<template>
+  <view class="container">
+    <button @click="handleBack">返回</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      hasChanges: false
+    }
+  },
+  methods: {
+    handleBack() {
+      if (this.hasChanges) {
+        uni.showModal({
+          title: '提示',
+          content: '有未保存的更改，确定要返回吗？',
+          success: (res) => {
+            if (res.confirm) {
+              uni.navigateBack()
+            }
+          }
+        })
+      } else {
+        uni.navigateBack()
+      }
+    }
+  }
+}
+</script>
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| delta | Number | 否 | 返回的页面数，如果 delta 大于现有页面数，则返回到首页 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `delta` 默认为 1，表示返回上一页
+2. 如果 `delta` 大于现有页面数，会返回到首页
+3. 可以通过 `getCurrentPages()` 获取页面栈信息
+4. 返回时可以传递数据给上一页
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/router.html#navigateback
+- **页面跳转**: https://doc.dcloud.net.cn/uni-app-x/api/router.html#navigateto

.agents/bak-skills/uniappx-project/examples/api/navigation/navigate-to.md

@@ -0,0 +1,151 @@
+# uni.navigateTo - 页面跳转示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/router.html#navigateto
+
+## 概述
+
+`uni.navigateTo` 用于保留当前页面，跳转到应用内的某个页面。
+
+## 基础用法
+
+```javascript
+uni.navigateTo({
+  url: '/pages/detail/detail'
+})
+```
+
+## 完整示例
+
+### 示例 1: 基本跳转
+
+```javascript
+uni.navigateTo({
+  url: '/pages/detail/detail',
+  success: () => {
+    console.log('跳转成功')
+  },
+  fail: (err) => {
+    console.error('跳转失败', err)
+  }
+})
+```
+
+### 示例 2: 带参数跳转
+
+```javascript
+// 跳转并传递参数
+uni.navigateTo({
+  url: '/pages/detail/detail?id=123&name=test'
+})
+
+// 在目标页面接收参数
+// pages/detail/detail.vue
+export default {
+  onLoad(options) {
+    console.log('接收到的参数', options)
+    // { id: '123', name: 'test' }
+  }
+}
+```
+
+### 示例 3: 传递对象参数
+
+```javascript
+// 传递对象
+const params = {
+  id: 123,
+  name: 'test',
+  data: { key: 'value' }
+}
+
+// 需要序列化
+uni.navigateTo({
+  url: `/pages/detail/detail?data=${encodeURIComponent(JSON.stringify(params))}`
+})
+
+// 在目标页面解析
+export default {
+  onLoad(options) {
+    const data = JSON.parse(decodeURIComponent(options.data))
+    console.log('解析后的数据', data)
+  }
+}
+```
+
+### 示例 4: 在组件中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="goToDetail">查看详情</button>
+    <button @click="goToDetailWithParams">带参数跳转</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    goToDetail() {
+      uni.navigateTo({
+        url: '/pages/detail/detail'
+      })
+    },
+    goToDetailWithParams() {
+      uni.navigateTo({
+        url: '/pages/detail/detail?id=123&name=test'
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 封装跳转函数
+
+```javascript
+// utils/navigation.js
+const navigation = {
+  // 跳转到详情页
+  toDetail(id) {
+    uni.navigateTo({
+      url: `/pages/detail/detail?id=${id}`
+    })
+  },
+  
+  // 跳转到用户页
+  toUser(userId) {
+    uni.navigateTo({
+      url: `/pages/user/user?id=${userId}`
+    })
+  },
+  
+  // 通用跳转
+  navigate(url, params = {}) {
+    const query = Object.keys(params)
+      .map(key => `${key}=${encodeURIComponent(params[key])}`)
+      .join('&')
+    const fullUrl = query ? `${url}?${query}` : url
+    uni.navigateTo({
+      url: fullUrl
+    })
+  }
+}
+
+// 使用
+navigation.toDetail(123)
+navigation.navigate('/pages/detail/detail', { id: 123, name: 'test' })
+```
+
+## 注意事项
+
+1. 不能跳转到 tabBar 页面，需要使用 `uni.switchTab`
+2. 路径前需要加 `/`，表示从根目录开始
+3. 参数会拼接在 URL 后面，长度有限制
+4. 复杂对象需要序列化后传递
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/router.html#navigateto
+- **其他路由 API**: https://doc.dcloud.net.cn/uni-app-x/api/router.html

.agents/bak-skills/uniappx-project/examples/api/navigation/re-launch.md

@@ -0,0 +1,152 @@
+# uni.reLaunch - 重新启动应用示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/router.html#relaunch
+
+## 概述
+
+`uni.reLaunch` 用于关闭所有页面，打开到应用内的某个页面。
+
+## 基础用法
+
+```javascript
+uni.reLaunch({
+  url: '/pages/index/index'
+})
+```
+
+## 完整示例
+
+### 示例 1: 基本重新启动
+
+```javascript
+uni.reLaunch({
+  url: '/pages/index/index',
+  success: () => {
+    console.log('重新启动成功')
+  },
+  fail: (err) => {
+    console.error('重新启动失败', err)
+  }
+})
+```
+
+### 示例 2: 退出登录后重新启动
+
+```javascript
+function logout() {
+  // 清除所有数据
+  uni.clearStorageSync()
+  
+  // 重新启动到登录页
+  uni.reLaunch({
+    url: '/pages/login/login'
+  })
+}
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="restartApp">重新启动应用</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    restartApp() {
+      uni.showModal({
+        title: '提示',
+        content: '确定要重新启动应用吗？',
+        success: (res) => {
+          if (res.confirm) {
+            uni.reLaunch({
+              url: '/pages/index/index'
+            })
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 与 navigateTo 和 redirectTo 的区别
+
+```javascript
+// navigateTo: 保留当前页面，可以返回
+uni.navigateTo({
+  url: '/pages/detail/detail'
+})
+// 页面栈: [首页, 详情页]
+
+// redirectTo: 关闭当前页面，不能返回
+uni.redirectTo({
+  url: '/pages/detail/detail'
+})
+// 页面栈: [详情页] (首页被关闭)
+
+// reLaunch: 关闭所有页面，重新启动
+uni.reLaunch({
+  url: '/pages/detail/detail'
+})
+// 页面栈: [详情页] (所有页面都被关闭)
+```
+
+### 示例 5: 登录后重新启动
+
+```javascript
+function login() {
+  uni.request({
+    url: 'https://api.example.com/login',
+    method: 'POST',
+    data: { username: 'test', password: '123456' },
+    success: (res) => {
+      if (res.data.success) {
+        uni.setStorageSync('token', res.data.token)
+        // 重新启动到首页
+        uni.reLaunch({
+          url: '/pages/index/index'
+        })
+      }
+    }
+  })
+}
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| url | String | 是 | 需要跳转的应用内非 tabBar 的页面的路径 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 不能跳转到 tabBar 页面，需要使用 `uni.switchTab`
+2. 会关闭所有页面，无法返回
+3. 路径前需要加 `/`，表示从根目录开始
+4. 适合退出登录、重新启动等场景
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/router.html#relaunch
+- **页面跳转**: https://doc.dcloud.net.cn/uni-app-x/api/router.html#navigateto

.agents/bak-skills/uniappx-project/examples/api/navigation/redirect-to.md

@@ -0,0 +1,146 @@
+# uni.redirectTo - 重定向跳转示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/router.html#redirectto
+
+## 概述
+
+`uni.redirectTo` 用于关闭当前页面，跳转到应用内的某个页面。
+
+## 基础用法
+
+```javascript
+uni.redirectTo({
+  url: '/pages/detail/detail'
+})
+```
+
+## 完整示例
+
+### 示例 1: 基本重定向
+
+```javascript
+uni.redirectTo({
+  url: '/pages/detail/detail',
+  success: () => {
+    console.log('跳转成功')
+  },
+  fail: (err) => {
+    console.error('跳转失败', err)
+  }
+})
+```
+
+### 示例 2: 带参数重定向
+
+```javascript
+uni.redirectTo({
+  url: '/pages/detail/detail?id=123&name=test'
+})
+
+// 在目标页面接收参数
+// pages/detail/detail.vue
+export default {
+  onLoad(options) {
+    console.log('接收到的参数', options)
+    // { id: '123', name: 'test' }
+  }
+}
+```
+
+### 示例 3: 登录后重定向
+
+```javascript
+function login() {
+  // 登录逻辑
+  uni.request({
+    url: 'https://api.example.com/login',
+    method: 'POST',
+    data: { username: 'test', password: '123456' },
+    success: (res) => {
+      if (res.data.success) {
+        // 保存 token
+        uni.setStorageSync('token', res.data.token)
+        // 重定向到首页（关闭登录页）
+        uni.redirectTo({
+          url: '/pages/index/index'
+        })
+      }
+    }
+  })
+}
+```
+
+### 示例 4: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="goToDetail">跳转到详情页</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    goToDetail() {
+      uni.redirectTo({
+        url: '/pages/detail/detail?id=123'
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 与 navigateTo 的区别
+
+```javascript
+// navigateTo: 保留当前页面，可以返回
+uni.navigateTo({
+  url: '/pages/detail/detail'
+})
+// 页面栈: [首页, 详情页]
+
+// redirectTo: 关闭当前页面，不能返回
+uni.redirectTo({
+  url: '/pages/detail/detail'
+})
+// 页面栈: [详情页] (首页被关闭)
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| url | String | 是 | 需要跳转的应用内非 tabBar 的页面的路径 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 不能跳转到 tabBar 页面，需要使用 `uni.switchTab`
+2. 会关闭当前页面，无法返回
+3. 路径前需要加 `/`，表示从根目录开始
+4. 适合登录后跳转等不需要返回的场景
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/router.html#redirectto
+- **保留页面跳转**: https://doc.dcloud.net.cn/uni-app-x/api/router.html#navigateto
+- **重新启动**: https://doc.dcloud.net.cn/uni-app-x/api/router.html#relaunch

.agents/bak-skills/uniappx-project/examples/api/navigation/switch-tab.md

@@ -0,0 +1,149 @@
+# uni.switchTab - 切换 TabBar 页面示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/router.html#switchtab
+
+## 概述
+
+`uni.switchTab` 用于跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面。
+
+## 基础用法
+
+```javascript
+uni.switchTab({
+  url: '/pages/index/index'
+})
+```
+
+## 完整示例
+
+### 示例 1: 基本切换
+
+```javascript
+uni.switchTab({
+  url: '/pages/index/index',
+  success: () => {
+    console.log('切换成功')
+  },
+  fail: (err) => {
+    console.error('切换失败', err)
+  }
+})
+```
+
+### 示例 2: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="goToHome">回到首页</button>
+    <button @click="goToCategory">分类</button>
+    <button @click="goToCart">购物车</button>
+    <button @click="goToProfile">我的</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    goToHome() {
+      uni.switchTab({
+        url: '/pages/index/index'
+      })
+    },
+    goToCategory() {
+      uni.switchTab({
+        url: '/pages/category/category'
+      })
+    },
+    goToCart() {
+      uni.switchTab({
+        url: '/pages/cart/cart'
+      })
+    },
+    goToProfile() {
+      uni.switchTab({
+        url: '/pages/profile/profile'
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 登录后跳转到首页
+
+```javascript
+function login() {
+  uni.request({
+    url: 'https://api.example.com/login',
+    method: 'POST',
+    data: { username: 'test', password: '123456' },
+    success: (res) => {
+      if (res.data.success) {
+        uni.setStorageSync('token', res.data.token)
+        // 跳转到 tabBar 首页
+        uni.switchTab({
+          url: '/pages/index/index'
+        })
+      }
+    }
+  })
+}
+```
+
+### 示例 4: 封装切换函数
+
+```javascript
+// utils/navigation.js
+const navigation = {
+  switchToTab(url) {
+    uni.switchTab({
+      url: url,
+      fail: (err) => {
+        console.error('切换失败', err)
+        // 如果不是 tabBar 页面，使用 navigateTo
+        uni.navigateTo({
+          url: url
+        })
+      }
+    })
+  }
+}
+
+// 使用
+navigation.switchToTab('/pages/index/index')
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| url | String | 是 | 需要跳转的 tabBar 页面的路径 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 只能跳转到 `pages.json` 中配置的 tabBar 页面
+2. 不能传递参数（URL 参数会被忽略）
+3. 会关闭所有非 tabBar 页面
+4. 如果目标页面不是 tabBar 页面，会触发 fail 回调
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/router.html#switchtab
+- **页面跳转**: https://doc.dcloud.net.cn/uni-app-x/api/router.html#navigateto

.agents/bak-skills/uniappx-project/examples/api/network/download-file.md

@@ -0,0 +1,234 @@
+# uni.downloadFile - 下载文件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/request/network-file.html#downloadfile
+
+## 概述
+
+`uni.downloadFile` 用于下载文件资源到本地。
+
+## 基础用法
+
+```javascript
+uni.downloadFile({
+  url: 'https://example.com/file.pdf',
+  success: (res) => {
+    console.log('下载成功', res.tempFilePath)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 下载图片
+
+```javascript
+uni.downloadFile({
+  url: 'https://example.com/image.jpg',
+  success: (res) => {
+    if (res.statusCode === 200) {
+      console.log('下载成功', res.tempFilePath)
+      // 可以预览或保存图片
+      uni.previewImage({
+        urls: [res.tempFilePath]
+      })
+    }
+  },
+  fail: (err) => {
+    console.error('下载失败', err)
+  }
+})
+```
+
+### 示例 2: 下载并保存到相册
+
+```javascript
+uni.downloadFile({
+  url: 'https://example.com/image.jpg',
+  success: (res) => {
+    if (res.statusCode === 200) {
+      // 保存到相册
+      uni.saveImageToPhotosAlbum({
+        filePath: res.tempFilePath,
+        success: () => {
+          uni.showToast({
+            title: '保存成功',
+            icon: 'success'
+          })
+        },
+        fail: (err) => {
+          console.error('保存失败', err)
+        }
+      })
+    }
+  }
+})
+```
+
+### 示例 3: 显示下载进度
+
+```javascript
+uni.downloadFile({
+  url: 'https://example.com/large-file.pdf',
+  success: (res) => {
+    console.log('下载完成', res.tempFilePath)
+  },
+  fail: (err) => {
+    console.error('下载失败', err)
+  }
+})
+```
+
+### 示例 4: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="downloadFile">下载文件</button>
+    <view v-if="downloading" class="download-status">
+      <text>下载中...</text>
+    </view>
+    <view v-if="filePath" class="file-info">
+      <text>文件路径：{{ filePath }}</text>
+      <button @click="openFile">打开文件</button>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      downloading: false,
+      filePath: ''
+    }
+  },
+  methods: {
+    downloadFile() {
+      this.downloading = true
+      uni.downloadFile({
+        url: 'https://example.com/file.pdf',
+        success: (res) => {
+          if (res.statusCode === 200) {
+            this.filePath = res.tempFilePath
+            this.downloading = false
+            uni.showToast({
+              title: '下载成功',
+              icon: 'success'
+            })
+          }
+        },
+        fail: (err) => {
+          this.downloading = false
+          uni.showToast({
+            title: '下载失败',
+            icon: 'none'
+          })
+        }
+      })
+    },
+    openFile() {
+      // 打开文件
+      uni.openDocument({
+        filePath: this.filePath,
+        success: () => {
+          console.log('打开成功')
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 封装下载函数
+
+```javascript
+// utils/download.js
+const download = {
+  downloadFile(url, options = {}) {
+    return new Promise((resolve, reject) => {
+      uni.downloadFile({
+        url: url,
+        header: options.header || {},
+        success: (res) => {
+          if (res.statusCode === 200) {
+            resolve(res.tempFilePath)
+          } else {
+            reject(new Error(`下载失败，状态码：${res.statusCode}`))
+          }
+        },
+        fail: (err) => {
+          reject(err)
+        }
+      })
+    })
+  },
+  
+  async downloadAndSave(url) {
+    try {
+      const filePath = await this.downloadFile(url)
+      // 根据文件类型保存
+      if (filePath.endsWith('.jpg') || filePath.endsWith('.png')) {
+        await uni.saveImageToPhotosAlbum({ filePath })
+      } else {
+        await uni.saveFile({ tempFilePath: filePath })
+      }
+      return filePath
+    } catch (err) {
+      throw err
+    }
+  }
+}
+
+// 使用
+download.downloadFile('https://example.com/file.pdf')
+  .then(filePath => {
+    console.log('下载成功', filePath)
+  })
+  .catch(err => {
+    console.error('下载失败', err)
+  })
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| url | String | 是 | 下载资源的 url |
+| header | Object | 否 | HTTP 请求 Header |
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| tempFilePath | String | 临时文件路径，下载后的文件会存储到一个临时文件 |
+| statusCode | Number | HTTP 状态码 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 下载的文件是临时文件，需要保存才能永久使用
+2. 可以通过 `statusCode` 判断下载是否成功
+3. 下载的文件路径是临时路径，应用关闭后可能失效
+4. 建议下载后立即保存或使用
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/request/network-file.html#downloadfile
+- **保存文件**: https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#savefile
+- **打开文档**: https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#opendocument

.agents/bak-skills/uniappx-project/examples/api/network/request.md

@@ -0,0 +1,287 @@
+# uni.request - 网络请求示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/request/request.html
+
+## 概述
+
+`uni.request` 用于发起网络请求，支持 GET、POST、PUT、DELETE 等方法。
+
+## 基础用法
+
+### GET 请求
+
+```javascript
+uni.request({
+  url: 'https://api.example.com/data',
+  method: 'GET',
+  success: (res) => {
+    console.log('请求成功', res.data)
+  },
+  fail: (err) => {
+    console.error('请求失败', err)
+  }
+})
+```
+
+### POST 请求
+
+```javascript
+uni.request({
+  url: 'https://api.example.com/user',
+  method: 'POST',
+  data: {
+    name: 'John',
+    age: 30
+  },
+  header: {
+    'Content-Type': 'application/json'
+  },
+  success: (res) => {
+    console.log('请求成功', res.data)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 带参数的 GET 请求
+
+```javascript
+uni.request({
+  url: 'https://api.example.com/users',
+  method: 'GET',
+  data: {
+    page: 1,
+    limit: 10
+  },
+  success: (res) => {
+    if (res.statusCode === 200) {
+      console.log('用户列表', res.data)
+    }
+  },
+  fail: (err) => {
+    uni.showToast({
+      title: '请求失败',
+      icon: 'none'
+    })
+  }
+})
+```
+
+### 示例 2: POST 请求上传数据
+
+```javascript
+uni.request({
+  url: 'https://api.example.com/users',
+  method: 'POST',
+  data: {
+    name: 'John Doe',
+    email: 'john@example.com',
+    age: 30
+  },
+  header: {
+    'Content-Type': 'application/json',
+    'Authorization': 'Bearer token123'
+  },
+  success: (res) => {
+    if (res.statusCode === 200 || res.statusCode === 201) {
+      uni.showToast({
+        title: '创建成功',
+        icon: 'success'
+      })
+    }
+  }
+})
+```
+
+### 示例 3: 使用 Promise
+
+```javascript
+// Promise 方式（部分平台支持）
+uni.request({
+  url: 'https://api.example.com/data'
+}).then(res => {
+  console.log('请求成功', res.data)
+}).catch(err => {
+  console.error('请求失败', err)
+})
+```
+
+### 示例 4: 封装请求函数
+
+```javascript
+// utils/request.js
+const request = (options) => {
+  return new Promise((resolve, reject) => {
+    uni.request({
+      url: options.url,
+      method: options.method || 'GET',
+      data: options.data || {},
+      header: {
+        'Content-Type': 'application/json',
+        ...options.header
+      },
+      success: (res) => {
+        if (res.statusCode === 200) {
+          resolve(res.data)
+        } else {
+          reject(new Error(`请求失败: ${res.statusCode}`))
+        }
+      },
+      fail: (err) => {
+        reject(err)
+      }
+    })
+  })
+}
+
+// 使用
+request({
+  url: 'https://api.example.com/data',
+  method: 'GET'
+}).then(data => {
+  console.log('数据', data)
+}).catch(err => {
+  console.error('错误', err)
+})
+```
+
+### 示例 5: 请求拦截和响应拦截
+
+```javascript
+// utils/http.js
+const baseURL = 'https://api.example.com'
+
+// 请求拦截
+const requestInterceptor = (config) => {
+  // 添加 token
+  const token = uni.getStorageSync('token')
+  if (token) {
+    config.header = {
+      ...config.header,
+      'Authorization': `Bearer ${token}`
+    }
+  }
+  return config
+}
+
+// 响应拦截
+const responseInterceptor = (res) => {
+  if (res.statusCode === 401) {
+    // token 过期，跳转登录
+    uni.navigateTo({
+      url: '/pages/login/login'
+    })
+    return Promise.reject(new Error('未授权'))
+  }
+  return res.data
+}
+
+const http = {
+  request(options) {
+    const config = requestInterceptor({
+      url: baseURL + options.url,
+      method: options.method || 'GET',
+      data: options.data || {},
+      header: options.header || {}
+    })
+    
+    return new Promise((resolve, reject) => {
+      uni.request({
+        ...config,
+        success: (res) => {
+          try {
+            const data = responseInterceptor(res)
+            resolve(data)
+          } catch (err) {
+            reject(err)
+          }
+        },
+        fail: (err) => {
+          reject(err)
+        }
+      })
+    })
+  }
+}
+
+export default http
+```
+
+### 示例 6: 超时处理
+
+```javascript
+uni.request({
+  url: 'https://api.example.com/data',
+  method: 'GET',
+  timeout: 5000, // 5秒超时
+  success: (res) => {
+    console.log('请求成功', res.data)
+  },
+  fail: (err) => {
+    if (err.errMsg && err.errMsg.includes('timeout')) {
+      uni.showToast({
+        title: '请求超时',
+        icon: 'none'
+      })
+    } else {
+      uni.showToast({
+        title: '请求失败',
+        icon: 'none'
+      })
+    }
+  }
+})
+```
+
+### 示例 7: 处理不同数据类型
+
+```javascript
+// JSON 数据
+uni.request({
+  url: 'https://api.example.com/data',
+  dataType: 'json',
+  success: (res) => {
+    console.log('JSON 数据', res.data)
+  }
+})
+
+// 文本数据
+uni.request({
+  url: 'https://api.example.com/text',
+  dataType: 'text',
+  success: (res) => {
+    console.log('文本数据', res.data)
+  }
+})
+
+// ArrayBuffer 数据
+uni.request({
+  url: 'https://api.example.com/binary',
+  responseType: 'arraybuffer',
+  success: (res) => {
+    console.log('二进制数据', res.data)
+  }
+})
+```
+
+## 平台差异
+
+- **H5**: 支持 `withCredentials` 参数，用于跨域请求携带凭证
+- **App**: 支持 `sslVerify` 参数，用于验证 SSL 证书
+- **App**: 支持 `firstIpv4` 参数，DNS 解析时优先使用 IPv4
+
+## 注意事项
+
+1. 默认超时时间为 60000ms（60秒）
+2. 默认 `dataType` 为 `json`，会自动解析 JSON 数据
+3. 请求 header 中不能设置 `Referer`
+4. 部分平台支持 Promise 方式调用
+5. 建议封装统一的请求函数，便于统一处理错误和拦截
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/request/request.html
+- **网络请求最佳实践**: https://doc.dcloud.net.cn/uni-app-x/api/request/request.html

.agents/bak-skills/uniappx-project/examples/api/network/upload-file.md

@@ -0,0 +1,262 @@
+# uni.uploadFile - 上传文件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/request/network-file.html#uploadfile
+
+## 概述
+
+`uni.uploadFile` 用于将本地资源上传到服务器。
+
+## 基础用法
+
+```javascript
+uni.uploadFile({
+  url: 'https://api.example.com/upload',
+  filePath: '/tmp/image.jpg',
+  name: 'file',
+  success: (res) => {
+    console.log('上传成功', res.data)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 上传图片
+
+```javascript
+// 先选择图片
+uni.chooseImage({
+  count: 1,
+  success: (res) => {
+    const tempFilePath = res.tempFilePaths[0]
+    
+    // 上传图片
+    uni.uploadFile({
+      url: 'https://api.example.com/upload',
+      filePath: tempFilePath,
+      name: 'file',
+      formData: {
+        'user': 'test'
+      },
+      success: (uploadRes) => {
+        const data = JSON.parse(uploadRes.data)
+        console.log('上传成功', data.url)
+        uni.showToast({
+          title: '上传成功',
+          icon: 'success'
+        })
+      },
+      fail: (err) => {
+        console.error('上传失败', err)
+        uni.showToast({
+          title: '上传失败',
+          icon: 'none'
+        })
+      }
+    })
+  }
+})
+```
+
+### 示例 2: 上传多张图片
+
+```javascript
+uni.chooseImage({
+  count: 9,
+  success: (res) => {
+    const tempFilePaths = res.tempFilePaths
+    let uploadCount = 0
+    
+    tempFilePaths.forEach((filePath, index) => {
+      uni.uploadFile({
+        url: 'https://api.example.com/upload',
+        filePath: filePath,
+        name: 'file',
+        success: () => {
+          uploadCount++
+          if (uploadCount === tempFilePaths.length) {
+            uni.showToast({
+              title: '全部上传成功',
+              icon: 'success'
+            })
+          }
+        },
+        fail: (err) => {
+          console.error(`第${index + 1}张图片上传失败`, err)
+        }
+      })
+    })
+  }
+})
+```
+
+### 示例 3: 显示上传进度
+
+```javascript
+uni.chooseImage({
+  count: 1,
+  success: (res) => {
+    const tempFilePath = res.tempFilePaths[0]
+    
+    uni.uploadFile({
+      url: 'https://api.example.com/upload',
+      filePath: tempFilePath,
+      name: 'file',
+      success: (res) => {
+        console.log('上传成功', res)
+      },
+      fail: (err) => {
+        console.error('上传失败', err)
+      }
+    })
+  }
+})
+```
+
+### 示例 4: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="uploadImage">上传图片</button>
+    <view v-if="uploading" class="upload-status">
+      <text>上传中...</text>
+    </view>
+    <image v-if="imageUrl" :src="imageUrl" mode="aspectFit" class="uploaded-image"></image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      uploading: false,
+      imageUrl: ''
+    }
+  },
+  methods: {
+    uploadImage() {
+      uni.chooseImage({
+        count: 1,
+        success: (res) => {
+          this.uploading = true
+          const tempFilePath = res.tempFilePaths[0]
+          
+          uni.uploadFile({
+            url: 'https://api.example.com/upload',
+            filePath: tempFilePath,
+            name: 'file',
+            header: {
+              'Authorization': 'Bearer ' + uni.getStorageSync('token')
+            },
+            success: (uploadRes) => {
+              const data = JSON.parse(uploadRes.data)
+              this.imageUrl = data.url
+              this.uploading = false
+              uni.showToast({
+                title: '上传成功',
+                icon: 'success'
+              })
+            },
+            fail: (err) => {
+              this.uploading = false
+              uni.showToast({
+                title: '上传失败',
+                icon: 'none'
+              })
+            }
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 封装上传函数
+
+```javascript
+// utils/upload.js
+const upload = {
+  uploadImage(filePath, options = {}) {
+    return new Promise((resolve, reject) => {
+      uni.uploadFile({
+        url: options.url || 'https://api.example.com/upload',
+        filePath: filePath,
+        name: options.name || 'file',
+        formData: options.formData || {},
+        header: options.header || {},
+        success: (res) => {
+          try {
+            const data = JSON.parse(res.data)
+            resolve(data)
+          } catch (e) {
+            resolve(res.data)
+          }
+        },
+        fail: (err) => {
+          reject(err)
+        }
+      })
+    })
+  }
+}
+
+// 使用
+const filePath = '/tmp/image.jpg'
+upload.uploadImage(filePath, {
+  url: 'https://api.example.com/upload',
+  formData: { userId: '123' }
+}).then(data => {
+  console.log('上传成功', data)
+}).catch(err => {
+  console.error('上传失败', err)
+})
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| url | String | 是 | 开发者服务器地址 |
+| filePath | String | 是 | 要上传文件资源的路径 |
+| name | String | 是 | 文件对应的 key，开发者在服务端可以通过这个 key 获取文件的二进制内容 |
+| header | Object | 否 | HTTP 请求 Header |
+| formData | Object | 否 | HTTP 请求中其他额外的 form data |
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| data | String | 服务器返回的数据 |
+| statusCode | Number | HTTP 状态码 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 上传文件前需要先选择文件（使用 `uni.chooseImage` 等）
+2. `filePath` 必须是本地路径
+3. 可以通过 `formData` 传递额外的表单数据
+4. 建议在请求头中添加认证信息
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/request/network-file.html#uploadfile
+- **选择图片**: https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#chooseimage
+- **下载文件**: https://doc.dcloud.net.cn/uni-app-x/api/request/network-file.html#downloadfile

.agents/bak-skills/uniappx-project/examples/api/storage/clear-storage.md

@@ -0,0 +1,137 @@
+# uni.clearStorage - 清除所有存储数据示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#clearstorage
+
+## 概述
+
+`uni.clearStorage` 用于清理本地数据缓存，清除所有存储的数据。
+
+## 基础用法
+
+```javascript
+uni.clearStorage({
+  success: () => {
+    console.log('清除成功')
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 清除所有数据
+
+```javascript
+uni.clearStorage({
+  success: () => {
+    console.log('所有数据已清除')
+    uni.showToast({
+      title: '清除成功',
+      icon: 'success'
+    })
+  },
+  fail: (err) => {
+    console.error('清除失败', err)
+  }
+})
+```
+
+### 示例 2: 退出登录时清除
+
+```javascript
+function logout() {
+  uni.clearStorage({
+    success: () => {
+      console.log('数据已清除')
+      // 跳转到登录页
+      uni.reLaunch({
+        url: '/pages/login/login'
+      })
+    }
+  })
+}
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="clearAllData">清除所有数据</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    clearAllData() {
+      uni.showModal({
+        title: '提示',
+        content: '确定要清除所有数据吗？此操作不可恢复',
+        success: (res) => {
+          if (res.confirm) {
+            uni.clearStorage({
+              success: () => {
+                uni.showToast({
+                  title: '清除成功',
+                  icon: 'success'
+                })
+                // 重新加载页面
+                setTimeout(() => {
+                  uni.reLaunch({
+                    url: '/pages/index/index'
+                  })
+                }, 1500)
+              }
+            })
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 同步版本
+
+```javascript
+try {
+  uni.clearStorageSync()
+  console.log('清除成功')
+} catch (err) {
+  console.error('清除失败', err)
+}
+```
+
+## 参数说明
+
+此 API 无需参数。
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 此操作会清除所有本地存储的数据，请谨慎使用
+2. 建议在清除前提示用户确认
+3. 同步版本 `clearStorageSync` 性能更好
+4. 清除后可能需要重新登录或初始化数据
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#clearstorage
+- **同步版本**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#clearstoragesync
+- **删除单个**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#removestorage

.agents/bak-skills/uniappx-project/examples/api/storage/get-storage-info.md

@@ -0,0 +1,202 @@
+# uni.getStorageInfo - 获取存储信息示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#getstorageinfo
+
+## 概述
+
+`uni.getStorageInfo` 用于异步获取当前 storage 的相关信息。
+
+## 基础用法
+
+```javascript
+uni.getStorageInfo({
+  success: (res) => {
+    console.log('存储信息', res)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 获取存储信息
+
+```javascript
+uni.getStorageInfo({
+  success: (res) => {
+    console.log('所有key', res.keys)
+    console.log('当前占用的空间大小', res.currentSize, 'KB')
+    console.log('限制的空间大小', res.limitSize, 'KB')
+  },
+  fail: (err) => {
+    console.error('获取失败', err)
+  }
+})
+```
+
+### 示例 2: 检查存储空间
+
+```javascript
+function checkStorageSpace() {
+  uni.getStorageInfo({
+    success: (res) => {
+      const usagePercent = (res.currentSize / res.limitSize * 100).toFixed(2)
+      console.log(`存储使用率：${usagePercent}%`)
+      
+      if (usagePercent > 80) {
+        uni.showModal({
+          title: '提示',
+          content: '存储空间不足，建议清理缓存',
+          showCancel: false
+        })
+      }
+    }
+  })
+}
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="getStorageInfo">查看存储信息</button>
+    <view v-if="storageInfo" class="storage-info">
+      <text>已使用：{{ storageInfo.currentSize }}KB / {{ storageInfo.limitSize }}KB</text>
+      <text>使用率：{{ usagePercent }}%</text>
+      <text>存储的key数量：{{ storageInfo.keys.length }}</text>
+      <view class="key-list">
+        <text v-for="key in storageInfo.keys" :key="key" class="key-item">
+          {{ key }}
+        </text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      storageInfo: null
+    }
+  },
+  computed: {
+    usagePercent() {
+      if (!this.storageInfo) return 0
+      return ((this.storageInfo.currentSize / this.storageInfo.limitSize) * 100).toFixed(2)
+    }
+  },
+  methods: {
+    getStorageInfo() {
+      uni.getStorageInfo({
+        success: (res) => {
+          this.storageInfo = res
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.storage-info {
+  margin-top: 20px;
+  padding: 20px;
+  background-color: #f5f5f5;
+  border-radius: 8px;
+}
+.key-list {
+  margin-top: 10px;
+}
+.key-item {
+  display: block;
+  padding: 5px;
+  font-size: 24rpx;
+  color: #666;
+}
+</style>
+```
+
+### 示例 4: 清理存储空间
+
+```javascript
+function clearStorageIfNeeded() {
+  uni.getStorageInfo({
+    success: (res) => {
+      const usagePercent = (res.currentSize / res.limitSize) * 100
+      
+      if (usagePercent > 80) {
+        uni.showModal({
+          title: '提示',
+          content: '存储空间不足，是否清理缓存？',
+          success: (modalRes) => {
+            if (modalRes.confirm) {
+              // 清理非关键数据
+              const importantKeys = ['token', 'userInfo']
+              res.keys.forEach(key => {
+                if (!importantKeys.includes(key)) {
+                  uni.removeStorageSync(key)
+                }
+              })
+              uni.showToast({
+                title: '清理完成',
+                icon: 'success'
+              })
+            }
+          }
+        })
+      }
+    }
+  })
+}
+```
+
+### 示例 5: 同步版本
+
+```javascript
+try {
+  const storageInfo = uni.getStorageInfoSync()
+  console.log('所有key', storageInfo.keys)
+  console.log('当前大小', storageInfo.currentSize, 'KB')
+  console.log('限制大小', storageInfo.limitSize, 'KB')
+} catch (err) {
+  console.error('获取失败', err)
+}
+```
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| keys | Array | 当前 storage 中所有的 key |
+| currentSize | Number | 当前占用的空间大小，单位 KB |
+| limitSize | Number | 限制的空间大小，单位 KB |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 可以通过 `keys` 获取所有存储的 key
+2. `currentSize` 和 `limitSize` 单位都是 KB
+3. 建议定期检查存储空间使用情况
+4. 同步版本 `getStorageInfoSync` 性能更好
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#getstorageinfo
+- **同步版本**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#getstorageinfosync
+- **清除存储**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#clearstorage

.agents/bak-skills/uniappx-project/examples/api/storage/get-storage-sync.md

@@ -0,0 +1,200 @@
+# uni.getStorageSync - 同步获取存储数据示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#getstoragesync
+
+## 概述
+
+`uni.getStorageSync` 用于从本地缓存中同步获取指定 key 的内容。
+
+## 基础用法
+
+```javascript
+try {
+  const value = uni.getStorageSync('key')
+  console.log('获取的数据', value)
+} catch (err) {
+  console.error('获取失败', err)
+}
+```
+
+## 完整示例
+
+### 示例 1: 获取用户信息
+
+```javascript
+try {
+  const userInfo = uni.getStorageSync('userInfo')
+  if (userInfo) {
+    console.log('用户信息', userInfo)
+  } else {
+    console.log('数据不存在')
+  }
+} catch (err) {
+  console.error('获取失败', err)
+}
+```
+
+### 示例 2: 获取 Token
+
+```javascript
+function getToken() {
+  try {
+    const token = uni.getStorageSync('token')
+    return token || null
+  } catch (err) {
+    console.error('获取Token失败', err)
+    return null
+  }
+}
+
+// 使用
+const token = getToken()
+if (token) {
+  console.log('Token存在', token)
+} else {
+  console.log('未登录')
+}
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <view v-if="userInfo" class="user-info">
+      <text>用户名：{{ userInfo.name }}</text>
+      <text>邮箱：{{ userInfo.email }}</text>
+    </view>
+    <view v-else>
+      <text>未登录</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      userInfo: null
+    }
+  },
+  onLoad() {
+    this.loadUserInfo()
+  },
+  methods: {
+    loadUserInfo() {
+      try {
+        const userInfo = uni.getStorageSync('userInfo')
+        if (userInfo) {
+          this.userInfo = userInfo
+        }
+      } catch (err) {
+        console.error('获取用户信息失败', err)
+      }
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 封装获取函数
+
+```javascript
+// utils/storage.js
+const storage = {
+  get(key, defaultValue = null) {
+    try {
+      const value = uni.getStorageSync(key)
+      return value !== '' ? value : defaultValue
+    } catch (err) {
+      console.error(`获取${key}失败`, err)
+      return defaultValue
+    }
+  },
+  
+  getString(key, defaultValue = '') {
+    return this.get(key, defaultValue)
+  },
+  
+  getNumber(key, defaultValue = 0) {
+    const value = this.get(key, defaultValue)
+    return Number(value) || defaultValue
+  },
+  
+  getBoolean(key, defaultValue = false) {
+    const value = this.get(key, defaultValue)
+    return Boolean(value)
+  },
+  
+  getObject(key, defaultValue = {}) {
+    const value = this.get(key, defaultValue)
+    return typeof value === 'object' ? value : defaultValue
+  }
+}
+
+// 使用
+const userInfo = storage.getObject('userInfo', {})
+const token = storage.getString('token', '')
+const count = storage.getNumber('count', 0)
+```
+
+### 示例 5: 检查数据是否存在
+
+```javascript
+function hasStorage(key) {
+  try {
+    const value = uni.getStorageSync(key)
+    return value !== '' && value !== null && value !== undefined
+  } catch (err) {
+    return false
+  }
+}
+
+// 使用
+if (hasStorage('userInfo')) {
+  console.log('用户信息存在')
+} else {
+  console.log('用户信息不存在')
+}
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| key | String | 是 | 本地缓存中指定的 key |
+
+## 返回值
+
+| 类型 | 说明 |
+|------|------|
+| Any | key 对应的内容 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 同步接口会阻塞后续代码执行，性能比异步接口好
+2. 如果 key 不存在，返回空字符串
+3. 建议使用 try-catch 处理错误
+4. 适合在页面初始化时获取数据
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#getstoragesync
+- **异步版本**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#getstorage
+- **设置存储**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#setstoragesync

.agents/bak-skills/uniappx-project/examples/api/storage/get-storage.md

@@ -0,0 +1,175 @@
+# uni.getStorage - 获取存储数据示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#getstorage
+
+## 概述
+
+`uni.getStorage` 用于从本地缓存中异步获取指定 key 的内容。
+
+## 基础用法
+
+```javascript
+uni.getStorage({
+  key: 'userInfo',
+  success: (res) => {
+    console.log('获取的数据', res.data)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 获取用户信息
+
+```javascript
+uni.getStorage({
+  key: 'userInfo',
+  success: (res) => {
+    const userInfo = res.data
+    console.log('用户信息', userInfo)
+    // 使用用户信息
+  },
+  fail: (err) => {
+    console.error('获取失败', err)
+    // 数据不存在或获取失败
+  }
+})
+```
+
+### 示例 2: 获取字符串
+
+```javascript
+uni.getStorage({
+  key: 'token',
+  success: (res) => {
+    const token = res.data
+    console.log('Token', token)
+    // 使用 token
+  }
+})
+```
+
+### 示例 3: 获取数组
+
+```javascript
+uni.getStorage({
+  key: 'shoppingCart',
+  success: (res) => {
+    const cart = res.data || []
+    console.log('购物车', cart)
+  }
+})
+```
+
+### 示例 4: 封装获取函数
+
+```javascript
+// utils/storage.js
+const storage = {
+  get(key) {
+    return new Promise((resolve, reject) => {
+      uni.getStorage({
+        key: key,
+        success: (res) => {
+          resolve(res.data)
+        },
+        fail: (err) => {
+          if (err.errMsg.includes('data not found')) {
+            resolve(null) // 数据不存在返回 null
+          } else {
+            reject(err)
+          }
+        }
+      })
+    })
+  }
+}
+
+// 使用
+storage.get('userInfo')
+  .then(data => {
+    if (data) {
+      console.log('用户信息', data)
+    } else {
+      console.log('数据不存在')
+    }
+  })
+  .catch(err => {
+    console.error('获取失败', err)
+  })
+```
+
+### 示例 5: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="loadUserInfo">加载用户信息</button>
+    <view v-if="userInfo" class="user-info">
+      <text>用户名：{{ userInfo.name }}</text>
+      <text>邮箱：{{ userInfo.email }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      userInfo: null
+    }
+  },
+  onLoad() {
+    this.loadUserInfo()
+  },
+  methods: {
+    loadUserInfo() {
+      uni.getStorage({
+        key: 'userInfo',
+        success: (res) => {
+          this.userInfo = res.data
+        },
+        fail: () => {
+          uni.showToast({
+            title: '未登录',
+            icon: 'none'
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+## 同步版本
+
+使用 `uni.getStorageSync` 进行同步获取：
+
+```javascript
+try {
+  const userInfo = uni.getStorageSync('userInfo')
+  if (userInfo) {
+    console.log('用户信息', userInfo)
+  } else {
+    console.log('数据不存在')
+  }
+} catch (err) {
+  console.error('获取失败', err)
+}
+```
+
+## 注意事项
+
+1. 如果 key 不存在，会触发 fail 回调
+2. 建议使用 try-catch 处理同步接口的错误
+3. 获取的数据类型与存储时一致
+4. 异步接口不会阻塞后续代码执行
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#getstorage
+- **同步版本**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#getstoragesync
+- **设置存储**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#setstorage

.agents/bak-skills/uniappx-project/examples/api/storage/remove-storage.md

@@ -0,0 +1,160 @@
+# uni.removeStorage - 删除存储数据示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#removestorage
+
+## 概述
+
+`uni.removeStorage` 用于从本地缓存中异步移除指定 key。
+
+## 基础用法
+
+```javascript
+uni.removeStorage({
+  key: 'userInfo',
+  success: () => {
+    console.log('删除成功')
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 删除单个数据
+
+```javascript
+uni.removeStorage({
+  key: 'token',
+  success: () => {
+    console.log('Token 已删除')
+  },
+  fail: (err) => {
+    console.error('删除失败', err)
+  }
+})
+```
+
+### 示例 2: 退出登录时清除数据
+
+```javascript
+function logout() {
+  // 删除用户信息
+  uni.removeStorage({
+    key: 'userInfo',
+    success: () => {
+      console.log('用户信息已清除')
+    }
+  })
+  
+  // 删除 Token
+  uni.removeStorage({
+    key: 'token',
+    success: () => {
+      console.log('Token 已清除')
+      // 跳转到登录页
+      uni.reLaunch({
+        url: '/pages/login/login'
+      })
+    }
+  })
+}
+```
+
+### 示例 3: 批量删除
+
+```javascript
+const keysToRemove = ['userInfo', 'token', 'settings']
+
+keysToRemove.forEach(key => {
+  uni.removeStorage({
+    key: key,
+    success: () => {
+      console.log(`${key} 已删除`)
+    }
+  })
+})
+```
+
+### 示例 4: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="clearUserData">清除用户数据</button>
+    <button @click="clearAllData">清除所有数据</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    clearUserData() {
+      uni.removeStorage({
+        key: 'userInfo',
+        success: () => {
+          uni.showToast({
+            title: '用户数据已清除',
+            icon: 'success'
+          })
+        }
+      })
+    },
+    clearAllData() {
+      uni.clearStorage({
+        success: () => {
+          uni.showToast({
+            title: '所有数据已清除',
+            icon: 'success'
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 同步版本
+
+```javascript
+try {
+  uni.removeStorageSync('userInfo')
+  console.log('删除成功')
+} catch (err) {
+  console.error('删除失败', err)
+}
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| key | String | 是 | 本地缓存中指定的 key |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 如果 key 不存在，不会报错
+2. 建议使用同步版本 `removeStorageSync` 性能更好
+3. 删除操作是异步的，需要等待 success 回调
+4. 退出登录时建议清除所有相关数据
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#removestorage
+- **同步版本**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#removestoragesync
+- **清除所有**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#clearstorage

.agents/bak-skills/uniappx-project/examples/api/storage/set-storage-sync.md

@@ -0,0 +1,196 @@
+# uni.setStorageSync - 同步设置存储数据示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#setstoragesync
+
+## 概述
+
+`uni.setStorageSync` 用于同步将数据存储在本地缓存中指定的 key 中。
+
+## 基础用法
+
+```javascript
+try {
+  uni.setStorageSync('key', 'value')
+  console.log('存储成功')
+} catch (err) {
+  console.error('存储失败', err)
+}
+```
+
+## 完整示例
+
+### 示例 1: 存储用户信息
+
+```javascript
+try {
+  const userInfo = {
+    name: 'John',
+    age: 30,
+    email: 'john@example.com'
+  }
+  uni.setStorageSync('userInfo', userInfo)
+  console.log('存储成功')
+} catch (err) {
+  console.error('存储失败', err)
+}
+```
+
+### 示例 2: 存储 Token
+
+```javascript
+function saveToken(token) {
+  try {
+    uni.setStorageSync('token', token)
+    return true
+  } catch (err) {
+    console.error('存储Token失败', err)
+    return false
+  }
+}
+
+// 使用
+if (saveToken('abc123')) {
+  console.log('Token已保存')
+}
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <input v-model="username" placeholder="用户名" />
+    <input v-model="email" placeholder="邮箱" />
+    <button @click="saveUserInfo">保存用户信息</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      username: '',
+      email: ''
+    }
+  },
+  methods: {
+    saveUserInfo() {
+      try {
+        const userInfo = {
+          username: this.username,
+          email: this.email
+        }
+        uni.setStorageSync('userInfo', userInfo)
+        uni.showToast({
+          title: '保存成功',
+          icon: 'success'
+        })
+      } catch (err) {
+        uni.showToast({
+          title: '保存失败',
+          icon: 'none'
+        })
+      }
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 封装存储函数
+
+```javascript
+// utils/storage.js
+const storage = {
+  set(key, value) {
+    try {
+      uni.setStorageSync(key, value)
+      return true
+    } catch (err) {
+      console.error(`存储${key}失败`, err)
+      return false
+    }
+  },
+  
+  setString(key, value) {
+    return this.set(key, String(value))
+  },
+  
+  setNumber(key, value) {
+    return this.set(key, Number(value))
+  },
+  
+  setBoolean(key, value) {
+    return this.set(key, Boolean(value))
+  },
+  
+  setObject(key, value) {
+    return this.set(key, value)
+  }
+}
+
+// 使用
+storage.setString('token', 'abc123')
+storage.setNumber('count', 10)
+storage.setBoolean('isLogin', true)
+storage.setObject('userInfo', { name: 'John' })
+```
+
+### 示例 5: 批量存储
+
+```javascript
+function saveMultipleData(data) {
+  try {
+    Object.keys(data).forEach(key => {
+      uni.setStorageSync(key, data[key])
+    })
+    return true
+  } catch (err) {
+    console.error('批量存储失败', err)
+    return false
+  }
+}
+
+// 使用
+saveMultipleData({
+  token: 'abc123',
+  userInfo: { name: 'John' },
+  settings: { theme: 'dark' }
+})
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| key | String | 是 | 本地缓存中指定的 key |
+| data | Any | 是 | 需要存储的内容 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 同步接口会阻塞后续代码执行，性能比异步接口好
+2. 存储的数据类型与设置时一致
+3. 建议使用 try-catch 处理错误
+4. 单个 key 允许存储的最大数据长度为 1MB
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#setstoragesync
+- **异步版本**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#setstorage
+- **获取存储**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#getstoragesync

.agents/bak-skills/uniappx-project/examples/api/storage/set-storage.md

@@ -0,0 +1,160 @@
+# uni.setStorage - 数据存储示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#setstorage
+
+## 概述
+
+`uni.setStorage` 用于将数据存储在本地缓存中指定的 key 中，异步接口。
+
+## 基础用法
+
+```javascript
+uni.setStorage({
+  key: 'userInfo',
+  data: {
+    name: 'John',
+    age: 30
+  },
+  success: () => {
+    console.log('存储成功')
+  },
+  fail: (err) => {
+    console.error('存储失败', err)
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 存储用户信息
+
+```javascript
+// 存储用户信息
+const userInfo = {
+  id: 1,
+  name: 'John Doe',
+  email: 'john@example.com',
+  avatar: 'https://example.com/avatar.jpg'
+}
+
+uni.setStorage({
+  key: 'userInfo',
+  data: userInfo,
+  success: () => {
+    uni.showToast({
+      title: '保存成功',
+      icon: 'success'
+    })
+  },
+  fail: (err) => {
+    uni.showToast({
+      title: '保存失败',
+      icon: 'none'
+    })
+  }
+})
+```
+
+### 示例 2: 存储字符串
+
+```javascript
+uni.setStorage({
+  key: 'token',
+  data: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...',
+  success: () => {
+    console.log('Token 已保存')
+  }
+})
+```
+
+### 示例 3: 存储数组
+
+```javascript
+const shoppingCart = [
+  { id: 1, name: '商品1', price: 99 },
+  { id: 2, name: '商品2', price: 199 }
+]
+
+uni.setStorage({
+  key: 'shoppingCart',
+  data: shoppingCart,
+  success: () => {
+    console.log('购物车已保存')
+  }
+})
+```
+
+### 示例 4: 封装存储函数
+
+```javascript
+// utils/storage.js
+const storage = {
+  set(key, data) {
+    return new Promise((resolve, reject) => {
+      uni.setStorage({
+        key: key,
+        data: data,
+        success: () => {
+          resolve()
+        },
+        fail: (err) => {
+          reject(err)
+        }
+      })
+    })
+  },
+  
+  get(key) {
+    return new Promise((resolve, reject) => {
+      uni.getStorage({
+        key: key,
+        success: (res) => {
+          resolve(res.data)
+        },
+        fail: (err) => {
+          reject(err)
+        }
+      })
+    })
+  }
+}
+
+// 使用
+storage.set('userInfo', { name: 'John' })
+  .then(() => {
+    console.log('存储成功')
+  })
+  .catch(err => {
+    console.error('存储失败', err)
+  })
+```
+
+## 同步版本
+
+使用 `uni.setStorageSync` 进行同步存储：
+
+```javascript
+try {
+  uni.setStorageSync('userInfo', {
+    name: 'John',
+    age: 30
+  })
+  console.log('存储成功')
+} catch (err) {
+  console.error('存储失败', err)
+}
+```
+
+## 注意事项
+
+1. 存储的数据会被持久化，除非手动删除或清除缓存
+2. 单个 key 允许存储的最大数据长度为 1MB
+3. 异步接口不会阻塞后续代码执行
+4. 建议使用 try-catch 处理同步接口的错误
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#setstorage
+- **同步版本**: https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#setstoragesync

.agents/bak-skills/uniappx-project/examples/api/ui/hide-loading.md

@@ -0,0 +1,189 @@
+# uni.hideLoading - 隐藏加载提示示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#hideloading
+
+## 概述
+
+`uni.hideLoading` 用于隐藏加载提示框。
+
+## 基础用法
+
+```javascript
+uni.hideLoading()
+```
+
+## 完整示例
+
+### 示例 1: 基本使用
+
+```javascript
+// 显示加载
+uni.showLoading({
+  title: '加载中...'
+})
+
+// 隐藏加载
+setTimeout(() => {
+  uni.hideLoading()
+}, 2000)
+```
+
+### 示例 2: 网络请求中使用
+
+```javascript
+// 显示加载
+uni.showLoading({
+  title: '加载中...',
+  mask: true
+})
+
+uni.request({
+  url: 'https://api.example.com/data',
+  success: (res) => {
+    console.log('数据', res.data)
+  },
+  complete: () => {
+    // 请求完成后隐藏加载
+    uni.hideLoading()
+  }
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="loadData">加载数据</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    loadData() {
+      uni.showLoading({
+        title: '加载中...',
+        mask: true
+      })
+      
+      uni.request({
+        url: 'https://api.example.com/data',
+        success: (res) => {
+          console.log('数据', res.data)
+        },
+        fail: (err) => {
+          console.error('加载失败', err)
+        },
+        complete: () => {
+          // 无论成功失败都要隐藏加载
+          uni.hideLoading()
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 封装加载函数
+
+```javascript
+// utils/loading.js
+const loading = {
+  show(title = '加载中...') {
+    uni.showLoading({
+      title: title,
+      mask: true
+    })
+  },
+  
+  hide() {
+    uni.hideLoading()
+  },
+  
+  async withLoading(fn, title = '加载中...') {
+    this.show(title)
+    try {
+      const result = await fn()
+      return result
+    } finally {
+      this.hide()
+    }
+  }
+}
+
+// 使用
+loading.withLoading(async () => {
+  const data = await fetchData()
+  return data
+}, '加载数据中...')
+```
+
+### 示例 5: 确保隐藏加载
+
+```javascript
+function loadData() {
+  let loadingShown = false
+  
+  try {
+    uni.showLoading({
+      title: '加载中...',
+      mask: true
+    })
+    loadingShown = true
+    
+    // 执行加载逻辑
+    uni.request({
+      url: 'https://api.example.com/data',
+      success: (res) => {
+        console.log('数据', res.data)
+      },
+      complete: () => {
+        if (loadingShown) {
+          uni.hideLoading()
+          loadingShown = false
+        }
+      }
+    })
+  } catch (err) {
+    // 确保异常时也隐藏加载
+    if (loadingShown) {
+      uni.hideLoading()
+      loadingShown = false
+    }
+  }
+}
+```
+
+## 参数说明
+
+此 API 无需参数。
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 必须与 `uni.showLoading` 配对使用
+2. 建议在 `complete` 回调中调用，确保无论成功失败都会隐藏
+3. 多次调用 `showLoading` 后，只需调用一次 `hideLoading` 即可隐藏
+4. 建议使用 try-finally 确保异常时也能隐藏
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#hideloading
+- **显示加载**: https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showloading

.agents/bak-skills/uniappx-project/examples/api/ui/hide-navigation-bar-loading.md

@@ -0,0 +1,140 @@
+# uni.hideNavigationBarLoading - 隐藏导航栏加载动画示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#hidenavigationbarloading
+
+## 概述
+
+`uni.hideNavigationBarLoading` 用于隐藏当前页面导航栏的加载动画。
+
+## 基础用法
+
+```javascript
+uni.hideNavigationBarLoading()
+```
+
+## 完整示例
+
+### 示例 1: 基本使用
+
+```javascript
+// 显示加载动画
+uni.showNavigationBarLoading()
+
+// 隐藏加载动画
+uni.hideNavigationBarLoading()
+```
+
+### 示例 2: 网络请求中使用
+
+```javascript
+// 显示加载动画
+uni.showNavigationBarLoading()
+
+uni.request({
+  url: 'https://api.example.com/data',
+  success: (res) => {
+    console.log('数据', res.data)
+  },
+  complete: () => {
+    // 请求完成后隐藏
+    uni.hideNavigationBarLoading()
+  }
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="loadData">加载数据</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    loadData() {
+      uni.showNavigationBarLoading()
+      
+      uni.request({
+        url: 'https://api.example.com/data',
+        success: (res) => {
+          console.log('数据', res.data)
+        },
+        fail: (err) => {
+          console.error('加载失败', err)
+        },
+        complete: () => {
+          // 无论成功失败都要隐藏
+          uni.hideNavigationBarLoading()
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 确保隐藏
+
+```javascript
+function loadData() {
+  let loadingShown = false
+  
+  try {
+    uni.showNavigationBarLoading()
+    loadingShown = true
+    
+    uni.request({
+      url: 'https://api.example.com/data',
+      success: (res) => {
+        console.log('数据', res.data)
+      },
+      complete: () => {
+        if (loadingShown) {
+          uni.hideNavigationBarLoading()
+          loadingShown = false
+        }
+      }
+    })
+  } catch (err) {
+    // 确保异常时也隐藏
+    if (loadingShown) {
+      uni.hideNavigationBarLoading()
+      loadingShown = false
+    }
+  }
+}
+```
+
+## 参数说明
+
+此 API 无需参数。
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 必须与 `uni.showNavigationBarLoading` 配对使用
+2. 建议在 `complete` 回调中调用，确保无论成功失败都会隐藏
+3. 多次调用 `showNavigationBarLoading` 后，只需调用一次 `hideNavigationBarLoading` 即可隐藏
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#hidenavigationbarloading
+- **显示加载**: https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#shownavigationbarloading

.agents/bak-skills/uniappx-project/examples/api/ui/hide-tab-bar-red-dot.md

@@ -0,0 +1,147 @@
+# uni.hideTabBarRedDot - 隐藏 TabBar 红点示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#hidetabbarreddot
+
+## 概述
+
+`uni.hideTabBarRedDot` 用于隐藏 tabBar 某一项的右上角的红点。
+
+## 基础用法
+
+```javascript
+uni.hideTabBarRedDot({
+  index: 0
+})
+```
+
+## 完整示例
+
+### 示例 1: 隐藏红点
+
+```javascript
+uni.hideTabBarRedDot({
+  index: 0, // tabBar 的哪一项，从左边算起
+  success: () => {
+    console.log('隐藏成功')
+  },
+  fail: (err) => {
+    console.error('隐藏失败', err)
+  }
+})
+```
+
+### 示例 2: 阅读消息后隐藏
+
+```javascript
+function readMessage(messageId) {
+  // 标记消息为已读
+  uni.request({
+    url: `https://api.example.com/messages/${messageId}/read`,
+    method: 'POST',
+    success: () => {
+      // 隐藏消息红点
+      uni.hideTabBarRedDot({
+        index: 1 // 消息页面的索引
+      })
+    }
+  })
+}
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="hideRedDot">隐藏红点</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    hideRedDot() {
+      uni.hideTabBarRedDot({
+        index: 0,
+        success: () => {
+          uni.showToast({
+            title: '已隐藏',
+            icon: 'success'
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 进入页面时隐藏
+
+```vue
+<template>
+  <view class="container">
+    <text>消息列表</text>
+  </view>
+</template>
+
+<script>
+export default {
+  onLoad() {
+    // 进入消息页面时隐藏红点
+    uni.hideTabBarRedDot({
+      index: 1 // 当前页面的索引
+    })
+  }
+}
+</script>
+```
+
+### 示例 5: 清除所有红点
+
+```javascript
+function clearAllRedDots(tabBarCount) {
+  for (let i = 0; i < tabBarCount; i++) {
+    uni.hideTabBarRedDot({
+      index: i
+    })
+  }
+}
+
+// 使用（假设有4个tabBar）
+clearAllRedDots(4)
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| index | Number | 是 | tabBar 的哪一项，从左边算起 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `index` 从 0 开始，对应 `pages.json` 中 tabBar 的配置顺序
+2. 如果该 tabBar 项没有红点，调用此 API 不会报错
+3. 建议在用户查看相关内容后隐藏红点
+4. 与 `showTabBarRedDot` 配合使用
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#hidetabbarreddot
+- **显示红点**: https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#showtabbarreddot

.agents/bak-skills/uniappx-project/examples/api/ui/hide-toast.md

@@ -0,0 +1,153 @@
+# uni.hideToast - 隐藏消息提示示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#hidetoast
+
+## 概述
+
+`uni.hideToast` 用于隐藏消息提示框。
+
+## 基础用法
+
+```javascript
+uni.hideToast()
+```
+
+## 完整示例
+
+### 示例 1: 基本使用
+
+```javascript
+// 显示提示
+uni.showToast({
+  title: '操作成功',
+  icon: 'success'
+})
+
+// 提前隐藏
+setTimeout(() => {
+  uni.hideToast()
+}, 1000)
+```
+
+### 示例 2: 手动控制提示显示时间
+
+```javascript
+function showCustomToast(title, duration = 2000) {
+  uni.showToast({
+    title: title,
+    icon: 'none',
+    duration: duration
+  })
+  
+  // 如果需要提前隐藏
+  setTimeout(() => {
+    uni.hideToast()
+  }, duration - 500)
+}
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="showMessage">显示消息</button>
+    <button @click="hideMessage">隐藏消息</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    showMessage() {
+      uni.showToast({
+        title: '这是一条消息',
+        icon: 'none',
+        duration: 5000
+      })
+    },
+    hideMessage() {
+      uni.hideToast()
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 替换提示内容
+
+```javascript
+function showReplacingToast(messages) {
+  let currentIndex = 0
+  
+  const showNext = () => {
+    if (currentIndex < messages.length) {
+      uni.showToast({
+        title: messages[currentIndex],
+        icon: 'none',
+        duration: 2000
+      })
+      currentIndex++
+      
+      setTimeout(() => {
+        uni.hideToast()
+        setTimeout(showNext, 100)
+      }, 2000)
+    }
+  }
+  
+  showNext()
+}
+
+// 使用
+showReplacingToast(['消息1', '消息2', '消息3'])
+```
+
+### 示例 5: 确保隐藏提示
+
+```javascript
+function showTemporaryToast(title) {
+  uni.showToast({
+    title: title,
+    icon: 'none',
+    duration: 3000
+  })
+  
+  // 3秒后自动隐藏
+  setTimeout(() => {
+    uni.hideToast()
+  }, 3000)
+}
+```
+
+## 参数说明
+
+此 API 无需参数。
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 用于提前隐藏通过 `uni.showToast` 显示的提示
+2. 如果不调用，提示会在 `duration` 时间后自动消失
+3. 建议在需要立即隐藏提示时使用
+4. 通常不需要手动调用，除非需要提前隐藏
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#hidetoast
+- **显示提示**: https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showtoast

.agents/bak-skills/uniappx-project/examples/api/ui/remove-tab-bar-badge.md

@@ -0,0 +1,171 @@
+# uni.removeTabBarBadge - 移除 TabBar 徽标示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#removetabbarbadge
+
+## 概述
+
+`uni.removeTabBarBadge` 用于移除 tabBar 某一项右上角的文本。
+
+## 基础用法
+
+```javascript
+uni.removeTabBarBadge({
+  index: 0
+})
+```
+
+## 完整示例
+
+### 示例 1: 清除徽标
+
+```javascript
+uni.removeTabBarBadge({
+  index: 0, // tabBar 的哪一项，从左边算起
+  success: () => {
+    console.log('清除成功')
+  },
+  fail: (err) => {
+    console.error('清除失败', err)
+  }
+})
+```
+
+### 示例 2: 清除未读消息徽标
+
+```javascript
+function clearUnreadBadge() {
+  uni.removeTabBarBadge({
+    index: 1, // 消息页面的索引
+    success: () => {
+      console.log('未读消息徽标已清除')
+    }
+  })
+}
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="clearBadge">清除徽标</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    clearBadge() {
+      uni.removeTabBarBadge({
+        index: 0,
+        success: () => {
+          uni.showToast({
+            title: '已清除',
+            icon: 'success'
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 阅读消息后清除
+
+```vue
+<template>
+  <view class="container">
+    <view 
+      v-for="message in messages" 
+      :key="message.id"
+      class="message-item"
+      @click="readMessage(message)"
+    >
+      <text>{{ message.content }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      messages: [
+        { id: 1, content: '消息1', read: false },
+        { id: 2, content: '消息2', read: false }
+      ]
+    }
+  },
+  methods: {
+    readMessage(message) {
+      message.read = true
+      
+      // 如果所有消息都已读，清除徽标
+      const allRead = this.messages.every(msg => msg.read)
+      if (allRead) {
+        uni.removeTabBarBadge({
+          index: 1 // 消息页面的索引
+        })
+      } else {
+        // 更新未读数
+        const unreadCount = this.messages.filter(msg => !msg.read).length
+        uni.setTabBarBadge({
+          index: 1,
+          text: String(unreadCount)
+        })
+      }
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 清除所有徽标
+
+```javascript
+function clearAllBadges(tabBarCount) {
+  for (let i = 0; i < tabBarCount; i++) {
+    uni.removeTabBarBadge({
+      index: i
+    })
+  }
+}
+
+// 使用（假设有4个tabBar）
+clearAllBadges(4)
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| index | Number | 是 | tabBar 的哪一项，从左边算起 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `index` 从 0 开始，对应 `pages.json` 中 tabBar 的配置顺序
+2. 如果该 tabBar 项没有徽标，调用此 API 不会报错
+3. 建议在消息已读或数量为 0 时清除徽标
+4. 与 `setTabBarBadge` 配合使用
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#removetabbarbadge
+- **设置徽标**: https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#settabbarbadge

.agents/bak-skills/uniappx-project/examples/api/ui/set-navigation-bar-color.md

@@ -0,0 +1,180 @@
+# uni.setNavigationBarColor - 设置导航栏颜色示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#setnavigationbarcolor
+
+## 概述
+
+`uni.setNavigationBarColor` 用于设置页面导航栏颜色。
+
+## 基础用法
+
+```javascript
+uni.setNavigationBarColor({
+  frontColor: '#ffffff',
+  backgroundColor: '#007aff'
+})
+```
+
+## 完整示例
+
+### 示例 1: 设置导航栏颜色
+
+```javascript
+uni.setNavigationBarColor({
+  frontColor: '#ffffff', // 前景颜色，包括按钮、标题、状态栏的颜色
+  backgroundColor: '#007aff', // 背景颜色
+  success: () => {
+    console.log('设置成功')
+  }
+})
+```
+
+### 示例 2: 深色主题
+
+```javascript
+uni.setNavigationBarColor({
+  frontColor: '#ffffff',
+  backgroundColor: '#000000',
+  animation: {
+    duration: 400,
+    timingFunc: 'easeIn'
+  }
+})
+```
+
+### 示例 3: 浅色主题
+
+```javascript
+uni.setNavigationBarColor({
+  frontColor: '#000000',
+  backgroundColor: '#ffffff',
+  animation: {
+    duration: 400,
+    timingFunc: 'easeIn'
+  }
+})
+```
+
+### 示例 4: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="setDarkTheme">深色主题</button>
+    <button @click="setLightTheme">浅色主题</button>
+    <button @click="setCustomColor">自定义颜色</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    setDarkTheme() {
+      uni.setNavigationBarColor({
+        frontColor: '#ffffff',
+        backgroundColor: '#000000'
+      })
+    },
+    setLightTheme() {
+      uni.setNavigationBarColor({
+        frontColor: '#000000',
+        backgroundColor: '#ffffff'
+      })
+    },
+    setCustomColor() {
+      uni.setNavigationBarColor({
+        frontColor: '#ffffff',
+        backgroundColor: '#ff3b30',
+        animation: {
+          duration: 400,
+          timingFunc: 'easeIn'
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 根据内容动态设置
+
+```vue
+<template>
+  <view class="container">
+    <view v-if="article">
+      <text>{{ article.content }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      article: null
+    }
+  },
+  onLoad(options) {
+    this.loadArticle(options.id)
+  },
+  methods: {
+    loadArticle(id) {
+      uni.request({
+        url: `https://api.example.com/article/${id}`,
+        success: (res) => {
+          this.article = res.data
+          // 根据文章主题色设置导航栏
+          if (res.data.theme === 'dark') {
+            uni.setNavigationBarColor({
+              frontColor: '#ffffff',
+              backgroundColor: '#000000'
+            })
+          } else {
+            uni.setNavigationBarColor({
+              frontColor: '#000000',
+              backgroundColor: '#ffffff'
+            })
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| frontColor | String | 是 | 前景颜色值，包括按钮、标题、状态栏的颜色，仅支持 #ffffff 和 #000000 |
+| backgroundColor | String | 是 | 背景颜色值，有效值为十六进制颜色 |
+| animation | Object | 否 | 动画效果 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `frontColor` 仅支持 `#ffffff` 和 `#000000`
+2. `backgroundColor` 支持任意十六进制颜色
+3. 可以通过 `animation` 设置颜色切换动画
+4. 建议与页面主题色保持一致
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#setnavigationbarcolor
+- **设置标题**: https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#setnavigationbartitle

.agents/bak-skills/uniappx-project/examples/api/ui/set-navigation-bar-title.md

@@ -0,0 +1,191 @@
+# uni.setNavigationBarTitle - 设置导航栏标题示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#setnavigationbartitle
+
+## 概述
+
+`uni.setNavigationBarTitle` 用于设置当前页面导航栏标题。
+
+## 基础用法
+
+```javascript
+uni.setNavigationBarTitle({
+  title: '新标题'
+})
+```
+
+## 完整示例
+
+### 示例 1: 设置标题
+
+```javascript
+uni.setNavigationBarTitle({
+  title: '我的页面',
+  success: () => {
+    console.log('设置成功')
+  },
+  fail: (err) => {
+    console.error('设置失败', err)
+  }
+})
+```
+
+### 示例 2: 动态设置标题
+
+```vue
+<template>
+  <view class="container">
+    <input v-model="pageTitle" placeholder="输入页面标题" />
+    <button @click="updateTitle">更新标题</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      pageTitle: ''
+    }
+  },
+  methods: {
+    updateTitle() {
+      if (this.pageTitle) {
+        uni.setNavigationBarTitle({
+          title: this.pageTitle
+        })
+      }
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 在页面生命周期中设置
+
+```vue
+<template>
+  <view class="container">
+    <text>页面内容</text>
+  </view>
+</template>
+
+<script>
+export default {
+  onLoad(options) {
+    // 根据参数设置标题
+    if (options.type === 'detail') {
+      uni.setNavigationBarTitle({
+        title: '详情页'
+      })
+    } else {
+      uni.setNavigationBarTitle({
+        title: '列表页'
+      })
+    }
+  },
+  onReady() {
+    // 也可以在这里设置
+    uni.setNavigationBarTitle({
+      title: '页面标题'
+    })
+  }
+}
+</script>
+```
+
+### 示例 4: 根据数据设置标题
+
+```vue
+<template>
+  <view class="container">
+    <view v-if="article">
+      <text>{{ article.title }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      article: null
+    }
+  },
+  onLoad(options) {
+    this.loadArticle(options.id)
+  },
+  methods: {
+    loadArticle(id) {
+      uni.request({
+        url: `https://api.example.com/article/${id}`,
+        success: (res) => {
+          this.article = res.data
+          // 使用文章标题作为页面标题
+          uni.setNavigationBarTitle({
+            title: res.data.title
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 封装设置标题函数
+
+```javascript
+// utils/navigation.js
+const navigation = {
+  setTitle(title) {
+    uni.setNavigationBarTitle({
+      title: title
+    })
+  },
+  
+  setTitleWithSubtitle(mainTitle, subtitle) {
+    const fullTitle = subtitle ? `${mainTitle} - ${subtitle}` : mainTitle
+    uni.setNavigationBarTitle({
+      title: fullTitle
+    })
+  }
+}
+
+// 使用
+navigation.setTitle('我的页面')
+navigation.setTitleWithSubtitle('商品', '详情')
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| title | String | 是 | 页面标题 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 标题长度建议不超过 10 个字符
+2. 可以在 `onLoad` 或 `onReady` 中设置
+3. 设置后立即生效
+4. 建议根据页面内容动态设置标题
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#setnavigationbartitle
+- **设置导航栏颜色**: https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#setnavigationbarcolor

.agents/bak-skills/uniappx-project/examples/api/ui/set-tab-bar-badge.md

@@ -0,0 +1,205 @@
+# uni.setTabBarBadge - 设置 TabBar 徽标示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#settabbarbadge
+
+## 概述
+
+`uni.setTabBarBadge` 用于为 tabBar 某一项的右上角添加文本。
+
+## 基础用法
+
+```javascript
+uni.setTabBarBadge({
+  index: 0,
+  text: '1'
+})
+```
+
+## 完整示例
+
+### 示例 1: 设置徽标
+
+```javascript
+uni.setTabBarBadge({
+  index: 0, // tabBar 的哪一项，从左边算起
+  text: '5' // 显示的文本，超过 3 个字符则显示成 "..."
+})
+```
+
+### 示例 2: 显示未读消息数
+
+```javascript
+function updateUnreadCount(count) {
+  if (count > 0) {
+    const text = count > 99 ? '99+' : String(count)
+    uni.setTabBarBadge({
+      index: 1, // 消息页面的索引
+      text: text
+    })
+  } else {
+    // 清除徽标
+    uni.removeTabBarBadge({
+      index: 1
+    })
+  }
+}
+
+// 使用
+updateUnreadCount(5) // 显示 "5"
+updateUnreadCount(100) // 显示 "99+"
+updateUnreadCount(0) // 清除徽标
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="setBadge">设置徽标</button>
+    <button @click="removeBadge">清除徽标</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    setBadge() {
+      uni.setTabBarBadge({
+        index: 0,
+        text: '5'
+      })
+      uni.showToast({
+        title: '已设置徽标',
+        icon: 'success'
+      })
+    },
+    removeBadge() {
+      uni.removeTabBarBadge({
+        index: 0
+      })
+      uni.showToast({
+        title: '已清除徽标',
+        icon: 'success'
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 实时更新未读消息
+
+```vue
+<template>
+  <view class="container">
+    <text>未读消息：{{ unreadCount }}</text>
+    <button @click="refreshUnreadCount">刷新未读数</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      unreadCount: 0
+    }
+  },
+  onLoad() {
+    this.loadUnreadCount()
+    // 定时刷新
+    setInterval(() => {
+      this.loadUnreadCount()
+    }, 30000) // 每30秒刷新一次
+  },
+  methods: {
+    loadUnreadCount() {
+      uni.request({
+        url: 'https://api.example.com/unread-count',
+        success: (res) => {
+          this.unreadCount = res.data.count
+          this.updateTabBarBadge(res.data.count)
+        }
+      })
+    },
+    updateTabBarBadge(count) {
+      if (count > 0) {
+        const text = count > 99 ? '99+' : String(count)
+        uni.setTabBarBadge({
+          index: 1, // 消息页面的索引
+          text: text
+        })
+      } else {
+        uni.removeTabBarBadge({
+          index: 1
+        })
+      }
+    },
+    refreshUnreadCount() {
+      this.loadUnreadCount()
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 多个 TabBar 徽标
+
+```javascript
+function updateAllTabBarBadges(badges) {
+  // badges: [{ index: 0, text: '5' }, { index: 1, text: '10' }]
+  badges.forEach(badge => {
+    if (badge.text && badge.text !== '0') {
+      uni.setTabBarBadge({
+        index: badge.index,
+        text: badge.text
+      })
+    } else {
+      uni.removeTabBarBadge({
+        index: badge.index
+      })
+    }
+  })
+}
+
+// 使用
+updateAllTabBarBadges([
+  { index: 0, text: '5' },
+  { index: 1, text: '10' },
+  { index: 2, text: '0' } // 清除
+])
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| index | Number | 是 | tabBar 的哪一项，从左边算起 |
+| text | String | 是 | 显示的文本，超过 3 个字符则显示成 "..." |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `index` 从 0 开始，对应 `pages.json` 中 tabBar 的配置顺序
+2. `text` 超过 3 个字符会显示成 "..."
+3. 建议数字超过 99 时显示 "99+"
+4. 使用 `removeTabBarBadge` 可以清除徽标
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#settabbarbadge
+- **清除徽标**: https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#removetabbarbadge

.agents/bak-skills/uniappx-project/examples/api/ui/set-tab-bar-style.md

@@ -0,0 +1,168 @@
+# uni.setTabBarStyle - 设置 TabBar 样式示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#settabbarstyle
+
+## 概述
+
+`uni.setTabBarStyle` 用于动态设置 tabBar 的整体样式。
+
+## 基础用法
+
+```javascript
+uni.setTabBarStyle({
+  color: '#7A7E83',
+  selectedColor: '#3cc51f',
+  backgroundColor: '#ffffff'
+})
+```
+
+## 完整示例
+
+### 示例 1: 设置 TabBar 样式
+
+```javascript
+uni.setTabBarStyle({
+  color: '#7A7E83', // 未选中时的文字颜色
+  selectedColor: '#3cc51f', // 选中时的文字颜色
+  backgroundColor: '#ffffff', // 背景颜色
+  borderStyle: 'black', // 边框颜色
+  success: () => {
+    console.log('设置成功')
+  }
+})
+```
+
+### 示例 2: 深色主题
+
+```javascript
+function setDarkTheme() {
+  uni.setTabBarStyle({
+    color: '#999999',
+    selectedColor: '#ffffff',
+    backgroundColor: '#000000',
+    borderStyle: 'white'
+  })
+}
+```
+
+### 示例 3: 浅色主题
+
+```javascript
+function setLightTheme() {
+  uni.setTabBarStyle({
+    color: '#7A7E83',
+    selectedColor: '#007aff',
+    backgroundColor: '#ffffff',
+    borderStyle: 'black'
+  })
+}
+```
+
+### 示例 4: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="setDarkTheme">深色主题</button>
+    <button @click="setLightTheme">浅色主题</button>
+    <button @click="setCustomTheme">自定义主题</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    setDarkTheme() {
+      uni.setTabBarStyle({
+        color: '#999999',
+        selectedColor: '#ffffff',
+        backgroundColor: '#000000',
+        borderStyle: 'white'
+      })
+    },
+    setLightTheme() {
+      uni.setTabBarStyle({
+        color: '#7A7E83',
+        selectedColor: '#007aff',
+        backgroundColor: '#ffffff',
+        borderStyle: 'black'
+      })
+    },
+    setCustomTheme() {
+      uni.setTabBarStyle({
+        color: '#666666',
+        selectedColor: '#ff3b30',
+        backgroundColor: '#f5f5f5',
+        borderStyle: 'black'
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 根据系统主题设置
+
+```javascript
+function setTabBarThemeBySystem() {
+  uni.getSystemInfo({
+    success: (res) => {
+      // 根据系统主题设置（需要自己判断）
+      const isDark = res.theme === 'dark' // 某些平台支持
+      
+      if (isDark) {
+        uni.setTabBarStyle({
+          color: '#999999',
+          selectedColor: '#ffffff',
+          backgroundColor: '#000000',
+          borderStyle: 'white'
+        })
+      } else {
+        uni.setTabBarStyle({
+          color: '#7A7E83',
+          selectedColor: '#007aff',
+          backgroundColor: '#ffffff',
+          borderStyle: 'black'
+        })
+      }
+    }
+  })
+}
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| color | String | 否 | tab 上的文字默认颜色 |
+| selectedColor | String | 否 | tab 上的文字选中时的颜色 |
+| backgroundColor | String | 否 | tab 的背景色 |
+| borderStyle | String | 否 | tabbar 上边框的颜色，可选值：black、white |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 设置后立即生效
+2. `color` 和 `selectedColor` 建议使用对比度高的颜色
+3. `borderStyle` 可选值为 `black` 或 `white`
+4. 建议与页面主题色保持一致
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#settabbarstyle
+- **设置 TabBar 项**: https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#settabbaritem

.agents/bak-skills/uniappx-project/examples/api/ui/show-action-sheet.md

@@ -0,0 +1,217 @@
+# uni.showActionSheet - 操作菜单示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showactionsheet
+
+## 概述
+
+`uni.showActionSheet` 用于显示操作菜单，从底部弹出选择项。
+
+## 基础用法
+
+```javascript
+uni.showActionSheet({
+  itemList: ['选项1', '选项2', '选项3'],
+  success: (res) => {
+    console.log('选择了第', res.tapIndex, '个选项')
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 基本操作菜单
+
+```javascript
+uni.showActionSheet({
+  itemList: ['拍照', '从相册选择', '取消'],
+  success: (res) => {
+    if (res.tapIndex === 0) {
+      // 拍照
+      console.log('选择拍照')
+    } else if (res.tapIndex === 1) {
+      // 从相册选择
+      console.log('从相册选择')
+    }
+  }
+})
+```
+
+### 示例 2: 图片选择
+
+```javascript
+uni.showActionSheet({
+  itemList: ['拍照', '从相册选择'],
+  success: (res) => {
+    if (res.tapIndex === 0) {
+      // 拍照
+      uni.chooseImage({
+        count: 1,
+        sourceType: ['camera'],
+        success: (imageRes) => {
+          console.log('拍照成功', imageRes.tempFilePaths)
+        }
+      })
+    } else if (res.tapIndex === 1) {
+      // 从相册选择
+      uni.chooseImage({
+        count: 1,
+        sourceType: ['album'],
+        success: (imageRes) => {
+          console.log('选择成功', imageRes.tempFilePaths)
+        }
+      })
+    }
+  }
+})
+```
+
+### 示例 3: 分享功能
+
+```javascript
+uni.showActionSheet({
+  itemList: ['分享到微信', '分享到朋友圈', '复制链接'],
+  success: (res) => {
+    switch (res.tapIndex) {
+      case 0:
+        // 分享到微信
+        uni.share({
+          provider: 'weixin',
+          scene: 'WXSceneSession'
+        })
+        break
+      case 1:
+        // 分享到朋友圈
+        uni.share({
+          provider: 'weixin',
+          scene: 'WXSceneTimeline'
+        })
+        break
+      case 2:
+        // 复制链接
+        uni.setClipboardData({
+          data: 'https://example.com',
+          success: () => {
+            uni.showToast({
+              title: '链接已复制',
+              icon: 'success'
+            })
+          }
+        })
+        break
+    }
+  }
+})
+```
+
+### 示例 4: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="showMoreOptions">更多操作</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    showMoreOptions() {
+      uni.showActionSheet({
+        itemList: ['编辑', '删除', '分享', '举报'],
+        success: (res) => {
+          switch (res.tapIndex) {
+            case 0:
+              this.handleEdit()
+              break
+            case 1:
+              this.handleDelete()
+              break
+            case 2:
+              this.handleShare()
+              break
+            case 3:
+              this.handleReport()
+              break
+          }
+        }
+      })
+    },
+    handleEdit() {
+      console.log('编辑')
+    },
+    handleDelete() {
+      uni.showModal({
+        title: '提示',
+        content: '确定要删除吗？',
+        success: (res) => {
+          if (res.confirm) {
+            console.log('删除')
+          }
+        }
+      })
+    },
+    handleShare() {
+      console.log('分享')
+    },
+    handleReport() {
+      console.log('举报')
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 带取消按钮
+
+```javascript
+uni.showActionSheet({
+  itemList: ['选项1', '选项2', '选项3'],
+  success: (res) => {
+    console.log('选择了', res.tapIndex)
+  },
+  fail: (res) => {
+    console.log('取消选择')
+  }
+})
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| itemList | Array | 是 | 按钮的文字数组 |
+| itemColor | String | 否 | 按钮的文字颜色 |
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| tapIndex | Number | 用户点击的按钮序号，从上到下的顺序，从0开始 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `itemList` 数组最多支持 6 个选项
+2. 用户点击取消或遮罩层会触发 fail 回调
+3. `tapIndex` 从 0 开始，对应 `itemList` 的索引
+4. 建议将"取消"选项放在最后
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showactionsheet
+- **模态弹窗**: https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showmodal

.agents/bak-skills/uniappx-project/examples/api/ui/show-loading.md

@@ -0,0 +1,189 @@
+# uni.showLoading - 加载提示示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showloading
+
+## 概述
+
+`uni.showLoading` 用于显示加载提示框，常用于异步操作时显示加载状态。
+
+## 基础用法
+
+```javascript
+uni.showLoading({
+  title: '加载中...'
+})
+```
+
+## 完整示例
+
+### 示例 1: 基本加载提示
+
+```javascript
+uni.showLoading({
+  title: '加载中...',
+  mask: true
+})
+
+// 操作完成后隐藏
+setTimeout(() => {
+  uni.hideLoading()
+}, 2000)
+```
+
+### 示例 2: 网络请求时显示加载
+
+```javascript
+uni.showLoading({
+  title: '加载中...',
+  mask: true
+})
+
+uni.request({
+  url: 'https://api.example.com/data',
+  success: (res) => {
+    console.log('数据', res.data)
+  },
+  complete: () => {
+    uni.hideLoading()
+  }
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="loadData">加载数据</button>
+    <view v-if="data">{{ data }}</view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      data: null
+    }
+  },
+  methods: {
+    loadData() {
+      uni.showLoading({
+        title: '加载中...',
+        mask: true
+      })
+      
+      // 模拟请求
+      setTimeout(() => {
+        this.data = '数据加载完成'
+        uni.hideLoading()
+        uni.showToast({
+          title: '加载成功',
+          icon: 'success'
+        })
+      }, 2000)
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 封装加载函数
+
+```javascript
+// utils/loading.js
+const loading = {
+  show(title = '加载中...') {
+    uni.showLoading({
+      title: title,
+      mask: true
+    })
+  },
+  
+  hide() {
+    uni.hideLoading()
+  },
+  
+  async withLoading(fn, title = '加载中...') {
+    this.show(title)
+    try {
+      const result = await fn()
+      return result
+    } finally {
+      this.hide()
+    }
+  }
+}
+
+// 使用
+loading.withLoading(async () => {
+  const data = await fetchData()
+  return data
+}, '加载数据中...')
+```
+
+### 示例 5: 配合请求使用
+
+```javascript
+// 显示加载
+uni.showLoading({
+  title: '提交中...',
+  mask: true
+})
+
+// 提交数据
+uni.request({
+  url: 'https://api.example.com/submit',
+  method: 'POST',
+  data: { name: 'test' },
+  success: (res) => {
+    uni.hideLoading()
+    uni.showToast({
+      title: '提交成功',
+      icon: 'success'
+    })
+  },
+  fail: (err) => {
+    uni.hideLoading()
+    uni.showToast({
+      title: '提交失败',
+      icon: 'none'
+    })
+  }
+})
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| title | String | 是 | 提示的内容 |
+| mask | Boolean | 否 | 是否显示透明蒙层，防止触摸穿透 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 必须调用 `uni.hideLoading()` 才能关闭加载提示
+2. `mask: true` 可以防止用户在加载时操作页面
+3. 建议在异步操作的开始显示，在完成时隐藏
+4. 不要在 `success` 回调中忘记调用 `hideLoading`
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showloading
+- **隐藏加载**: https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#hideloading

.agents/bak-skills/uniappx-project/examples/api/ui/show-modal.md

@@ -0,0 +1,226 @@
+# uni.showModal - 模态弹窗示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showmodal
+
+## 概述
+
+`uni.showModal` 用于显示模态弹窗，常用于确认操作。
+
+## 基础用法
+
+```javascript
+uni.showModal({
+  title: '提示',
+  content: '确定要删除吗？',
+  success: (res) => {
+    if (res.confirm) {
+      console.log('用户点击确定')
+    } else if (res.cancel) {
+      console.log('用户点击取消')
+    }
+  }
+})
+```
+
+## 完整示例
+
+### 示例 1: 确认删除
+
+```javascript
+uni.showModal({
+  title: '提示',
+  content: '确定要删除这条记录吗？',
+  confirmText: '删除',
+  cancelText: '取消',
+  success: (res) => {
+    if (res.confirm) {
+      // 执行删除操作
+      console.log('确认删除')
+    }
+  }
+})
+```
+
+### 示例 2: 自定义按钮文字
+
+```javascript
+uni.showModal({
+  title: '提示',
+  content: '确定要退出登录吗？',
+  confirmText: '退出',
+  cancelText: '取消',
+  confirmColor: '#ff3b30',
+  success: (res) => {
+    if (res.confirm) {
+      // 退出登录
+      uni.removeStorageSync('token')
+      uni.reLaunch({
+        url: '/pages/login/login'
+      })
+    }
+  }
+})
+```
+
+### 示例 3: 只显示确定按钮
+
+```javascript
+uni.showModal({
+  title: '提示',
+  content: '操作成功',
+  showCancel: false,
+  success: (res) => {
+    if (res.confirm) {
+      console.log('用户点击确定')
+    }
+  }
+})
+```
+
+### 示例 4: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="handleDelete">删除记录</button>
+    <button @click="handleLogout">退出登录</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    handleDelete() {
+      uni.showModal({
+        title: '确认删除',
+        content: '删除后无法恢复，确定要删除吗？',
+        confirmText: '删除',
+        cancelText: '取消',
+        confirmColor: '#ff3b30',
+        success: (res) => {
+          if (res.confirm) {
+            // 执行删除
+            this.deleteRecord()
+          }
+        }
+      })
+    },
+    handleLogout() {
+      uni.showModal({
+        title: '提示',
+        content: '确定要退出登录吗？',
+        success: (res) => {
+          if (res.confirm) {
+            uni.removeStorageSync('token')
+            uni.reLaunch({
+              url: '/pages/login/login'
+            })
+          }
+        }
+      })
+    },
+    deleteRecord() {
+      // 删除逻辑
+      uni.showToast({
+        title: '删除成功',
+        icon: 'success'
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 封装确认函数
+
+```javascript
+// utils/modal.js
+const modal = {
+  confirm(title, content) {
+    return new Promise((resolve, reject) => {
+      uni.showModal({
+        title: title,
+        content: content,
+        success: (res) => {
+          if (res.confirm) {
+            resolve(true)
+          } else {
+            resolve(false)
+          }
+        },
+        fail: (err) => {
+          reject(err)
+        }
+      })
+    })
+  },
+  
+  alert(title, content) {
+    return new Promise((resolve) => {
+      uni.showModal({
+        title: title,
+        content: content,
+        showCancel: false,
+        success: () => {
+          resolve()
+        }
+      })
+    })
+  }
+}
+
+// 使用
+const result = await modal.confirm('提示', '确定要删除吗？')
+if (result) {
+  console.log('用户确认')
+} else {
+  console.log('用户取消')
+}
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| title | String | 否 | 提示的标题 |
+| content | String | 否 | 提示的内容 |
+| showCancel | Boolean | 否 | 是否显示取消按钮，默认 true |
+| cancelText | String | 否 | 取消按钮的文字，默认"取消" |
+| cancelColor | String | 否 | 取消按钮的文字颜色 |
+| confirmText | String | 否 | 确认按钮的文字，默认"确定" |
+| confirmColor | String | 否 | 确认按钮的文字颜色 |
+
+## 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| confirm | Boolean | 为 true 时，表示用户点击了确定按钮 |
+| cancel | Boolean | 为 true 时，表示用户点击了取消按钮 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `title` 和 `content` 至少需要提供一个
+2. 确认和取消按钮的文字可以自定义
+3. 可以通过 `showCancel: false` 只显示确定按钮
+4. 建议用于重要的确认操作
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showmodal
+- **消息提示**: https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showtoast

.agents/bak-skills/uniappx-project/examples/api/ui/show-navigation-bar-loading.md

@@ -0,0 +1,194 @@
+# uni.showNavigationBarLoading - 显示导航栏加载动画示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#shownavigationbarloading
+
+## 概述
+
+`uni.showNavigationBarLoading` 用于在当前页面导航栏显示加载动画。
+
+## 基础用法
+
+```javascript
+uni.showNavigationBarLoading()
+```
+
+## 完整示例
+
+### 示例 1: 基本使用
+
+```javascript
+// 显示加载动画
+uni.showNavigationBarLoading()
+
+// 隐藏加载动画
+setTimeout(() => {
+  uni.hideNavigationBarLoading()
+}, 2000)
+```
+
+### 示例 2: 网络请求时显示
+
+```javascript
+// 显示加载动画
+uni.showNavigationBarLoading()
+
+uni.request({
+  url: 'https://api.example.com/data',
+  success: (res) => {
+    console.log('数据', res.data)
+  },
+  complete: () => {
+    // 请求完成后隐藏
+    uni.hideNavigationBarLoading()
+  }
+})
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="loadData">加载数据</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    loadData() {
+      // 显示导航栏加载动画
+      uni.showNavigationBarLoading()
+      
+      uni.request({
+        url: 'https://api.example.com/data',
+        success: (res) => {
+          console.log('数据', res.data)
+        },
+        fail: (err) => {
+          console.error('加载失败', err)
+        },
+        complete: () => {
+          // 无论成功失败都要隐藏
+          uni.hideNavigationBarLoading()
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 封装加载函数
+
+```javascript
+// utils/loading.js
+const loading = {
+  showNavBar() {
+    uni.showNavigationBarLoading()
+  },
+  
+  hideNavBar() {
+    uni.hideNavigationBarLoading()
+  },
+  
+  async withNavBarLoading(fn) {
+    this.showNavBar()
+    try {
+      const result = await fn()
+      return result
+    } finally {
+      this.hideNavBar()
+    }
+  }
+}
+
+// 使用
+loading.withNavBarLoading(async () => {
+  const data = await fetchData()
+  return data
+})
+```
+
+### 示例 5: 页面刷新时显示
+
+```vue
+<template>
+  <view class="container">
+    <button @click="refresh">刷新</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    refresh() {
+      // 显示导航栏加载动画
+      uni.showNavigationBarLoading()
+      
+      // 模拟刷新
+      setTimeout(() => {
+        uni.hideNavigationBarLoading()
+        uni.showToast({
+          title: '刷新成功',
+          icon: 'success'
+        })
+      }, 2000)
+    }
+  },
+  onPullDownRefresh() {
+    // 下拉刷新时显示
+    uni.showNavigationBarLoading()
+    
+    // 刷新数据
+    this.loadData()
+  },
+  methods: {
+    loadData() {
+      uni.request({
+        url: 'https://api.example.com/data',
+        success: (res) => {
+          console.log('数据', res.data)
+        },
+        complete: () => {
+          uni.hideNavigationBarLoading()
+          uni.stopPullDownRefresh()
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+## 参数说明
+
+此 API 无需参数。
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 必须与 `uni.hideNavigationBarLoading` 配对使用
+2. 在导航栏标题旁边显示加载动画
+3. 适合页面级别的加载状态
+4. 建议在 `complete` 回调中隐藏
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#shownavigationbarloading
+- **隐藏加载**: https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#hidenavigationbarloading

.agents/bak-skills/uniappx-project/examples/api/ui/show-tab-bar-red-dot.md

@@ -0,0 +1,199 @@
+# uni.showTabBarRedDot - 显示 TabBar 红点示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#showtabbarreddot
+
+## 概述
+
+`uni.showTabBarRedDot` 用于显示 tabBar 某一项的右上角的红点。
+
+## 基础用法
+
+```javascript
+uni.showTabBarRedDot({
+  index: 0
+})
+```
+
+## 完整示例
+
+### 示例 1: 显示红点
+
+```javascript
+uni.showTabBarRedDot({
+  index: 0, // tabBar 的哪一项，从左边算起
+  success: () => {
+    console.log('显示成功')
+  },
+  fail: (err) => {
+    console.error('显示失败', err)
+  }
+})
+```
+
+### 示例 2: 显示消息红点
+
+```javascript
+function showMessageRedDot() {
+  uni.showTabBarRedDot({
+    index: 1, // 消息页面的索引
+    success: () => {
+      console.log('消息红点已显示')
+    }
+  })
+}
+```
+
+### 示例 3: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="showRedDot">显示红点</button>
+    <button @click="hideRedDot">隐藏红点</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    showRedDot() {
+      uni.showTabBarRedDot({
+        index: 0,
+        success: () => {
+          uni.showToast({
+            title: '已显示红点',
+            icon: 'success'
+          })
+        }
+      })
+    },
+    hideRedDot() {
+      uni.hideTabBarRedDot({
+        index: 0,
+        success: () => {
+          uni.showToast({
+            title: '已隐藏红点',
+            icon: 'success'
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 根据状态显示红点
+
+```vue
+<template>
+  <view class="container">
+    <view v-if="hasNewMessage" class="message-list">
+      <view 
+        v-for="message in messages" 
+        :key="message.id"
+        class="message-item"
+        @click="readMessage(message)"
+      >
+        <text>{{ message.content }}</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      messages: [],
+      hasNewMessage: false
+    }
+  },
+  onLoad() {
+    this.loadMessages()
+  },
+  methods: {
+    loadMessages() {
+      uni.request({
+        url: 'https://api.example.com/messages',
+        success: (res) => {
+          this.messages = res.data
+          this.hasNewMessage = res.data.some(msg => !msg.read)
+          
+          // 根据是否有新消息显示红点
+          if (this.hasNewMessage) {
+            uni.showTabBarRedDot({
+              index: 1 // 消息页面的索引
+            })
+          } else {
+            uni.hideTabBarRedDot({
+              index: 1
+            })
+          }
+        }
+      })
+    },
+    readMessage(message) {
+      message.read = true
+      this.hasNewMessage = this.messages.some(msg => !msg.read)
+      
+      if (!this.hasNewMessage) {
+        uni.hideTabBarRedDot({
+          index: 1
+        })
+      }
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 多个 TabBar 红点
+
+```javascript
+function showAllRedDots(indices) {
+  indices.forEach(index => {
+    uni.showTabBarRedDot({
+      index: index
+    })
+  })
+}
+
+// 使用
+showAllRedDots([0, 1, 2]) // 显示第0、1、2项的红点
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| index | Number | 是 | tabBar 的哪一项，从左边算起 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `index` 从 0 开始，对应 `pages.json` 中 tabBar 的配置顺序
+2. 红点不显示数字，只显示一个小红点
+3. 与 `setTabBarBadge` 的区别：红点不显示文字，徽标显示文字
+4. 使用 `hideTabBarRedDot` 可以隐藏红点
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#showtabbarreddot
+- **隐藏红点**: https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#hidetabbarreddot
+- **设置徽标**: https://doc.dcloud.net.cn/uni-app-x/api/ui/tab-bar.html#settabbarbadge

.agents/bak-skills/uniappx-project/examples/api/ui/show-toast.md

@@ -0,0 +1,188 @@
+# uni.showToast - 消息提示示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showtoast
+
+## 概述
+
+`uni.showToast` 用于显示消息提示框，常用于操作反馈。
+
+## 基础用法
+
+```javascript
+uni.showToast({
+  title: '操作成功',
+  icon: 'success'
+})
+```
+
+## 完整示例
+
+### 示例 1: 成功提示
+
+```javascript
+uni.showToast({
+  title: '操作成功',
+  icon: 'success',
+  duration: 2000
+})
+```
+
+### 示例 2: 错误提示
+
+```javascript
+uni.showToast({
+  title: '操作失败',
+  icon: 'error',
+  duration: 2000
+})
+```
+
+### 示例 3: 加载提示
+
+```javascript
+uni.showToast({
+  title: '加载中...',
+  icon: 'loading',
+  duration: 2000
+})
+```
+
+### 示例 4: 无图标提示
+
+```javascript
+uni.showToast({
+  title: '这是一条消息',
+  icon: 'none',
+  duration: 2000
+})
+```
+
+### 示例 5: 自定义图片
+
+```javascript
+uni.showToast({
+  title: '自定义图标',
+  image: '/static/custom-icon.png',
+  duration: 2000
+})
+```
+
+### 示例 6: 封装提示函数
+
+```javascript
+// utils/toast.js
+const toast = {
+  success(title, duration = 2000) {
+    uni.showToast({
+      title: title,
+      icon: 'success',
+      duration: duration
+    })
+  },
+  
+  error(title, duration = 2000) {
+    uni.showToast({
+      title: title,
+      icon: 'error',
+      duration: duration
+    })
+  },
+  
+  loading(title, duration = 2000) {
+    uni.showToast({
+      title: title,
+      icon: 'loading',
+      duration: duration
+    })
+  },
+  
+  info(title, duration = 2000) {
+    uni.showToast({
+      title: title,
+      icon: 'none',
+      duration: duration
+    })
+  }
+}
+
+// 使用
+toast.success('保存成功')
+toast.error('保存失败')
+toast.info('这是一条消息')
+```
+
+### 示例 7: 在页面中使用
+
+```vue
+<template>
+  <view class="container">
+    <button @click="handleSuccess">成功提示</button>
+    <button @click="handleError">错误提示</button>
+    <button @click="handleLoading">加载提示</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    handleSuccess() {
+      uni.showToast({
+        title: '操作成功',
+        icon: 'success'
+      })
+    },
+    handleError() {
+      uni.showToast({
+        title: '操作失败',
+        icon: 'error'
+      })
+    },
+    handleLoading() {
+      uni.showToast({
+        title: '加载中...',
+        icon: 'loading',
+        duration: 3000
+      })
+    }
+  }
+}
+</script>
+```
+
+## 参数说明
+
+| 参数名 | 类型 | 必填 | 说明 |
+|--------|------|------|------|
+| title | String | 是 | 提示的内容 |
+| icon | String | 否 | 图标类型，可选值：success、error、loading、none |
+| image | String | 否 | 自定义图标的本地路径 |
+| duration | Number | 否 | 提示的延迟时间，单位 ms，默认 2000 |
+| mask | Boolean | 否 | 是否显示透明蒙层，防止触摸穿透 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `title` 长度限制：微信小程序最多 7 个汉字长度
+2. 同时只能显示一个 toast，新的 toast 会覆盖旧的
+3. 使用 `uni.hideToast()` 可以手动关闭 toast
+4. `mask` 参数在某些平台可能不支持
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showtoast
+- **隐藏提示**: https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#hidetoast

.agents/bak-skills/uniappx-project/examples/components/built-in/audio.md

@@ -0,0 +1,320 @@
+# audio 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/audio.html
+
+## 概述
+
+`audio` 是音频播放组件，用于播放音频。
+
+## 基础用法
+
+```vue
+<template>
+  <audio src="https://example.com/audio.mp3" controls></audio>
+</template>
+```
+
+## 完整示例
+
+### 示例 1: 基本音频播放
+
+```vue
+<template>
+  <view class="container">
+    <audio 
+      :src="audioSrc"
+      controls
+      class="audio-player"
+    ></audio>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      audioSrc: 'https://example.com/audio.mp3'
+    }
+  }
+}
+</script>
+
+<style>
+.audio-player {
+  width: 100%;
+}
+</style>
+```
+
+### 示例 2: 音频播放控制
+
+```vue
+<template>
+  <view class="container">
+    <audio 
+      :src="audioSrc"
+      :controls="showControls"
+      :autoplay="autoplay"
+      :loop="loop"
+      @play="handlePlay"
+      @pause="handlePause"
+      @ended="handleEnded"
+      class="audio-player"
+    ></audio>
+    <view class="controls">
+      <button @click="togglePlay">{{ isPlaying ? '暂停' : '播放' }}</button>
+      <button @click="toggleLoop">{{ loop ? '取消循环' : '循环播放' }}</button>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      audioSrc: 'https://example.com/audio.mp3',
+      showControls: true,
+      autoplay: false,
+      loop: false,
+      isPlaying: false
+    }
+  },
+  methods: {
+    handlePlay() {
+      this.isPlaying = true
+      console.log('音频开始播放')
+    },
+    handlePause() {
+      this.isPlaying = false
+      console.log('音频暂停')
+    },
+    handleEnded() {
+      this.isPlaying = false
+      console.log('音频播放结束')
+    },
+    togglePlay() {
+      // 需要通过 ref 调用音频组件的方法
+      if (this.isPlaying) {
+        this.$refs.audio.pause()
+      } else {
+        this.$refs.audio.play()
+      }
+    },
+    toggleLoop() {
+      this.loop = !this.loop
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 音频列表
+
+```vue
+<template>
+  <view class="container">
+    <view 
+      v-for="(item, index) in audioList" 
+      :key="index"
+      class="audio-item"
+    >
+      <text class="audio-title">{{ item.title }}</text>
+      <audio 
+        :src="item.src"
+        controls
+        class="audio-player"
+        @play="handleAudioPlay(index)"
+      ></audio>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      audioList: [
+        {
+          src: 'https://example.com/audio1.mp3',
+          title: '音频1'
+        },
+        {
+          src: 'https://example.com/audio2.mp3',
+          title: '音频2'
+        }
+      ]
+    }
+  },
+  methods: {
+    handleAudioPlay(index) {
+      console.log('播放音频', index)
+    }
+  }
+}
+</script>
+
+<style>
+.audio-item {
+  margin-bottom: 20px;
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+.audio-title {
+  display: block;
+  font-size: 32rpx;
+  margin-bottom: 10px;
+}
+.audio-player {
+  width: 100%;
+}
+</style>
+```
+
+### 示例 4: 播放进度显示
+
+```vue
+<template>
+  <view class="container">
+    <audio 
+      :src="audioSrc"
+      controls
+      @timeupdate="handleTimeUpdate"
+      class="audio-player"
+    ></audio>
+    <view class="progress-info">
+      <text>播放进度：{{ currentTime }}s / {{ duration }}s</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      audioSrc: 'https://example.com/audio.mp3',
+      currentTime: 0,
+      duration: 0
+    }
+  },
+  methods: {
+    handleTimeUpdate(e) {
+      this.currentTime = e.detail.currentTime
+      this.duration = e.detail.duration
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 自定义播放器
+
+```vue
+<template>
+  <view class="container">
+    <view class="custom-player">
+      <text class="audio-title">{{ currentAudio.title }}</text>
+      <view class="player-controls">
+        <button @click="playPrevious">上一首</button>
+        <button @click="togglePlay">{{ isPlaying ? '暂停' : '播放' }}</button>
+        <button @click="playNext">下一首</button>
+      </view>
+      <audio 
+        ref="audio"
+        :src="currentAudio.src"
+        :autoplay="autoplay"
+        @play="handlePlay"
+        @pause="handlePause"
+        @ended="handleEnded"
+      ></audio>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      audioList: [
+        { src: 'https://example.com/audio1.mp3', title: '音频1' },
+        { src: 'https://example.com/audio2.mp3', title: '音频2' },
+        { src: 'https://example.com/audio3.mp3', title: '音频3' }
+      ],
+      currentIndex: 0,
+      isPlaying: false,
+      autoplay: false
+    }
+  },
+  computed: {
+    currentAudio() {
+      return this.audioList[this.currentIndex]
+    }
+  },
+  methods: {
+    togglePlay() {
+      if (this.isPlaying) {
+        this.$refs.audio.pause()
+      } else {
+        this.$refs.audio.play()
+      }
+    },
+    playPrevious() {
+      this.currentIndex = (this.currentIndex - 1 + this.audioList.length) % this.audioList.length
+      this.autoplay = true
+    },
+    playNext() {
+      this.currentIndex = (this.currentIndex + 1) % this.audioList.length
+      this.autoplay = true
+    },
+    handlePlay() {
+      this.isPlaying = true
+      this.autoplay = false
+    },
+    handlePause() {
+      this.isPlaying = false
+    },
+    handleEnded() {
+      this.isPlaying = false
+      // 自动播放下一首
+      this.playNext()
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| src | String | - | 要播放音频的资源地址 |
+| controls | Boolean | false | 是否显示默认播放控件 |
+| autoplay | Boolean | false | 是否自动播放 |
+| loop | Boolean | false | 是否循环播放 |
+| muted | Boolean | false | 是否静音播放 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 音频地址需要配置合法域名
+2. `autoplay` 在某些平台可能不生效
+3. 可以通过事件监听播放状态
+4. 建议使用 `controls` 显示播放控件
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/audio.html

.agents/bak-skills/uniappx-project/examples/components/built-in/button.md

@@ -0,0 +1,233 @@
+# button 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/button.html
+
+## 概述
+
+`button` 是按钮组件，用于触发操作。
+
+## 基础用法
+
+```vue
+<template>
+  <button @click="handleClick">点击按钮</button>
+</template>
+
+<script>
+export default {
+  methods: {
+    handleClick() {
+      console.log('按钮被点击')
+    }
+  }
+}
+</script>
+```
+
+## 完整示例
+
+### 示例 1: 按钮类型
+
+```vue
+<template>
+  <view class="container">
+    <button type="default">默认按钮</button>
+    <button type="primary">主要按钮</button>
+    <button type="warn">警告按钮</button>
+  </view>
+</template>
+
+<style>
+.container {
+  padding: 20px;
+}
+button {
+  margin-bottom: 20px;
+}
+</style>
+```
+
+### 示例 2: 按钮大小
+
+```vue
+<template>
+  <view class="container">
+    <button size="mini">小按钮</button>
+    <button size="default">默认按钮</button>
+  </view>
+</template>
+```
+
+### 示例 3: 镂空按钮
+
+```vue
+<template>
+  <view class="container">
+    <button type="primary" plain>镂空按钮</button>
+    <button type="warn" plain>镂空警告按钮</button>
+  </view>
+</template>
+```
+
+### 示例 4: 禁用按钮
+
+```vue
+<template>
+  <view class="container">
+    <button disabled>禁用按钮</button>
+    <button :disabled="isDisabled" @click="handleClick">
+      {{ isDisabled ? '已禁用' : '可点击' }}
+    </button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      isDisabled: false
+    }
+  },
+  methods: {
+    handleClick() {
+      this.isDisabled = true
+      setTimeout(() => {
+        this.isDisabled = false
+      }, 2000)
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 加载状态
+
+```vue
+<template>
+  <view class="container">
+    <button :loading="isLoading" @click="handleSubmit">
+      提交
+    </button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      isLoading: false
+    }
+  },
+  methods: {
+    async handleSubmit() {
+      this.isLoading = true
+      try {
+        // 模拟请求
+        await new Promise(resolve => setTimeout(resolve, 2000))
+        uni.showToast({
+          title: '提交成功',
+          icon: 'success'
+        })
+      } finally {
+        this.isLoading = false
+      }
+    }
+  }
+}
+</script>
+```
+
+### 示例 6: 表单提交
+
+```vue
+<template>
+  <form @submit="handleSubmit">
+    <input name="username" placeholder="用户名" />
+    <input name="password" type="password" placeholder="密码" />
+    <button form-type="submit">提交</button>
+    <button form-type="reset">重置</button>
+  </form>
+</template>
+
+<script>
+export default {
+  methods: {
+    handleSubmit(e) {
+      console.log('表单数据', e.detail.value)
+    }
+  }
+}
+</script>
+```
+
+### 示例 7: 开放能力（微信小程序）
+
+```vue
+<template>
+  <view class="container">
+    <!-- 获取用户信息 -->
+    <button open-type="getUserInfo" @getuserinfo="getUserInfo">
+      获取用户信息
+    </button>
+    
+    <!-- 打开客服会话 -->
+    <button open-type="contact">联系客服</button>
+    
+    <!-- 分享 -->
+    <button open-type="share">分享</button>
+    
+    <!-- 打开设置 -->
+    <button open-type="openSetting">打开设置</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    getUserInfo(e) {
+      console.log('用户信息', e.detail.userInfo)
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| size | String | default | 按钮的大小，可选值：default、mini |
+| type | String | default | 按钮的样式类型，可选值：primary、default、warn |
+| plain | Boolean | false | 按钮是否镂空，背景色透明 |
+| disabled | Boolean | false | 是否禁用 |
+| loading | Boolean | false | 名称前是否带 loading 图标 |
+| form-type | String | - | 用于 form 组件，可选值：submit、reset |
+| open-type | String | - | 开放能力，如：getUserInfo、contact、share 等 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `open-type` 在不同平台支持的能力不同
+2. 按钮的样式可以通过 CSS 自定义
+3. `loading` 图标在不同平台显示可能不同
+4. 建议使用 `@click` 事件处理点击，而不是依赖 `open-type`
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/button.html
+- **表单组件**: https://doc.dcloud.net.cn/uni-app-x/component/form.html

.agents/bak-skills/uniappx-project/examples/components/built-in/camera.md

@@ -0,0 +1,347 @@
+# camera 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/camera.html
+
+## 概述
+
+`camera` 是相机组件，用于调用设备相机进行拍照或录像。
+
+## 基础用法
+
+```vue
+<template>
+  <camera 
+    device-position="back"
+    @error="handleError"
+  ></camera>
+</template>
+
+<script>
+export default {
+  methods: {
+    handleError(e) {
+      console.error('相机错误', e.detail)
+    }
+  }
+}
+</script>
+```
+
+## 完整示例
+
+### 示例 1: 基本相机
+
+```vue
+<template>
+  <view class="container">
+    <camera 
+      device-position="back"
+      flash="off"
+      class="camera"
+      @error="handleError"
+    ></camera>
+    <button @click="takePhoto">拍照</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    takePhoto() {
+      const ctx = uni.createCameraContext('myCamera', this)
+      ctx.takePhoto({
+        quality: 'high',
+        success: (res) => {
+          console.log('拍照成功', res.tempImagePath)
+          uni.previewImage({
+            urls: [res.tempImagePath]
+          })
+        }
+      })
+    },
+    handleError(e) {
+      console.error('相机错误', e.detail)
+    }
+  }
+}
+</script>
+
+<style>
+.camera {
+  width: 100%;
+  height: 500px;
+}
+</style>
+```
+
+### 示例 2: 拍照和录像
+
+```vue
+<template>
+  <view class="container">
+    <camera 
+      ref="camera"
+      device-position="back"
+      flash="off"
+      class="camera"
+      @error="handleError"
+    ></camera>
+    <view class="controls">
+      <button @click="takePhoto">拍照</button>
+      <button @click="startRecord">开始录像</button>
+      <button @click="stopRecord">停止录像</button>
+      <button @click="switchCamera">切换摄像头</button>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      isRecording: false
+    }
+  },
+  methods: {
+    takePhoto() {
+      const ctx = uni.createCameraContext('myCamera', this)
+      ctx.takePhoto({
+        quality: 'high',
+        success: (res) => {
+          console.log('拍照成功', res.tempImagePath)
+        }
+      })
+    },
+    startRecord() {
+      const ctx = uni.createCameraContext('myCamera', this)
+      ctx.startRecord({
+        success: () => {
+          this.isRecording = true
+          console.log('开始录像')
+        }
+      })
+    },
+    stopRecord() {
+      const ctx = uni.createCameraContext('myCamera', this)
+      ctx.stopRecord({
+        success: (res) => {
+          this.isRecording = false
+          console.log('录像成功', res.tempVideoPath)
+        }
+      })
+    },
+    switchCamera() {
+      // 需要通过 ref 切换
+      this.$refs.camera.switchCamera()
+    },
+    handleError(e) {
+      console.error('相机错误', e.detail)
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 切换摄像头和闪光灯
+
+```vue
+<template>
+  <view class="container">
+    <camera 
+      :device-position="devicePosition"
+      :flash="flash"
+      class="camera"
+    ></camera>
+    <view class="controls">
+      <button @click="switchCamera">切换摄像头</button>
+      <button @click="toggleFlash">切换闪光灯</button>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      devicePosition: 'back',
+      flash: 'off'
+    }
+  },
+  methods: {
+    switchCamera() {
+      this.devicePosition = this.devicePosition === 'back' ? 'front' : 'back'
+    },
+    toggleFlash() {
+      const flashOptions = ['off', 'on', 'auto', 'torch']
+      const currentIndex = flashOptions.indexOf(this.flash)
+      this.flash = flashOptions[(currentIndex + 1) % flashOptions.length]
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 拍照并上传
+
+```vue
+<template>
+  <view class="container">
+    <camera 
+      device-position="back"
+      class="camera"
+    ></camera>
+    <button @click="takePhotoAndUpload">拍照并上传</button>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    takePhotoAndUpload() {
+      const ctx = uni.createCameraContext('myCamera', this)
+      ctx.takePhoto({
+        quality: 'high',
+        success: (res) => {
+          // 上传图片
+          uni.uploadFile({
+            url: 'https://api.example.com/upload',
+            filePath: res.tempImagePath,
+            name: 'file',
+            success: (uploadRes) => {
+              const data = JSON.parse(uploadRes.data)
+              console.log('上传成功', data.url)
+              uni.showToast({
+                title: '上传成功',
+                icon: 'success'
+              })
+            }
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 自定义相机界面
+
+```vue
+<template>
+  <view class="container">
+    <camera 
+      device-position="back"
+      flash="off"
+      class="camera"
+    ></camera>
+    <view class="camera-overlay">
+      <view class="camera-controls">
+        <button class="control-btn" @click="switchCamera">切换</button>
+        <button class="control-btn capture-btn" @click="takePhoto">拍照</button>
+        <button class="control-btn" @click="toggleFlash">闪光</button>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      devicePosition: 'back',
+      flash: 'off'
+    }
+  },
+  methods: {
+    takePhoto() {
+      const ctx = uni.createCameraContext('myCamera', this)
+      ctx.takePhoto({
+        quality: 'high',
+        success: (res) => {
+          uni.previewImage({
+            urls: [res.tempImagePath]
+          })
+        }
+      })
+    },
+    switchCamera() {
+      this.devicePosition = this.devicePosition === 'back' ? 'front' : 'back'
+    },
+    toggleFlash() {
+      const flashOptions = ['off', 'on', 'auto']
+      const currentIndex = flashOptions.indexOf(this.flash)
+      this.flash = flashOptions[(currentIndex + 1) % flashOptions.length]
+    }
+  }
+}
+</script>
+
+<style>
+.camera {
+  width: 100%;
+  height: 100vh;
+}
+.camera-overlay {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.5);
+  padding: 20px;
+}
+.camera-controls {
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+}
+.control-btn {
+  width: 60px;
+  height: 60px;
+  border-radius: 50%;
+  background-color: rgba(255, 255, 255, 0.3);
+  color: white;
+}
+.capture-btn {
+  width: 80px;
+  height: 80px;
+  background-color: white;
+  color: #333;
+}
+</style>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| device-position | String | back | 摄像头朝向，可选值：back、front |
+| flash | String | off | 闪光灯，可选值：on、off、auto、torch |
+| frame-size | String | medium | 指定期望的相机帧数据尺寸，可选值：small、medium、large |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ❌ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. H5 平台不支持此组件
+2. 需要通过 `uni.createCameraContext` 创建相机上下文
+3. 拍照和录像需要通过上下文方法调用
+4. 建议全屏显示相机组件
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/camera.html
+- **Camera API**: https://doc.dcloud.net.cn/uni-app-x/api/media/camera.html

.agents/bak-skills/uniappx-project/examples/components/built-in/canvas.md

@@ -0,0 +1,247 @@
+# canvas 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/canvas.html
+
+## 概述
+
+`canvas` 是画布组件，用于绘制图形、文字等。
+
+## 基础用法
+
+```vue
+<template>
+  <canvas canvas-id="myCanvas" class="canvas"></canvas>
+</template>
+
+<script>
+export default {
+  onReady() {
+    this.drawCanvas()
+  },
+  methods: {
+    drawCanvas() {
+      const ctx = uni.createCanvasContext('myCanvas', this)
+      ctx.setFillStyle('#007aff')
+      ctx.fillRect(0, 0, 200, 200)
+      ctx.draw()
+    }
+  }
+}
+</script>
+
+<style>
+.canvas {
+  width: 200px;
+  height: 200px;
+}
+</style>
+```
+
+## 完整示例
+
+### 示例 1: 绘制矩形
+
+```vue
+<template>
+  <view class="container">
+    <canvas canvas-id="myCanvas" class="canvas"></canvas>
+    <button @click="drawRect">绘制矩形</button>
+  </view>
+</template>
+
+<script>
+export default {
+  onReady() {
+    this.drawRect()
+  },
+  methods: {
+    drawRect() {
+      const ctx = uni.createCanvasContext('myCanvas', this)
+      ctx.setFillStyle('#007aff')
+      ctx.fillRect(10, 10, 150, 100)
+      ctx.draw()
+    }
+  }
+}
+</script>
+
+<style>
+.canvas {
+  width: 200px;
+  height: 200px;
+  border: 1px solid #eee;
+}
+</style>
+```
+
+### 示例 2: 绘制圆形
+
+```vue
+<template>
+  <view class="container">
+    <canvas canvas-id="myCanvas" class="canvas"></canvas>
+    <button @click="drawCircle">绘制圆形</button>
+  </view>
+</template>
+
+<script>
+export default {
+  onReady() {
+    this.drawCircle()
+  },
+  methods: {
+    drawCircle() {
+      const ctx = uni.createCanvasContext('myCanvas', this)
+      ctx.beginPath()
+      ctx.arc(100, 100, 50, 0, 2 * Math.PI)
+      ctx.setFillStyle('#4cd964')
+      ctx.fill()
+      ctx.draw()
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 绘制文字
+
+```vue
+<template>
+  <view class="container">
+    <canvas canvas-id="myCanvas" class="canvas"></canvas>
+    <button @click="drawText">绘制文字</button>
+  </view>
+</template>
+
+<script>
+export default {
+  onReady() {
+    this.drawText()
+  },
+  methods: {
+    drawText() {
+      const ctx = uni.createCanvasContext('myCanvas', this)
+      ctx.setFontSize(20)
+      ctx.setFillStyle('#333')
+      ctx.fillText('Hello Canvas', 10, 50)
+      ctx.draw()
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 绘制图片
+
+```vue
+<template>
+  <view class="container">
+    <canvas canvas-id="myCanvas" class="canvas"></canvas>
+    <button @click="drawImage">绘制图片</button>
+  </view>
+</template>
+
+<script>
+export default {
+  onReady() {
+    this.drawImage()
+  },
+  methods: {
+    drawImage() {
+      const ctx = uni.createCanvasContext('myCanvas', this)
+      uni.downloadFile({
+        url: 'https://example.com/image.jpg',
+        success: (res) => {
+          ctx.drawImage(res.tempFilePath, 0, 0, 200, 200)
+          ctx.draw()
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 保存为图片
+
+```vue
+<template>
+  <view class="container">
+    <canvas canvas-id="myCanvas" class="canvas"></canvas>
+    <button @click="drawAndSave">绘制并保存</button>
+  </view>
+</template>
+
+<script>
+export default {
+  onReady() {
+    this.drawCanvas()
+  },
+  methods: {
+    drawCanvas() {
+      const ctx = uni.createCanvasContext('myCanvas', this)
+      ctx.setFillStyle('#007aff')
+      ctx.fillRect(0, 0, 200, 200)
+      ctx.setFontSize(20)
+      ctx.setFillStyle('#fff')
+      ctx.fillText('Canvas', 70, 100)
+      ctx.draw()
+    },
+    drawAndSave() {
+      this.drawCanvas()
+      setTimeout(() => {
+        uni.canvasToTempFilePath({
+          canvasId: 'myCanvas',
+          success: (res) => {
+            uni.saveImageToPhotosAlbum({
+              filePath: res.tempFilePath,
+              success: () => {
+                uni.showToast({
+                  title: '保存成功',
+                  icon: 'success'
+                })
+              }
+            })
+          }
+        }, this)
+      }, 500)
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| canvas-id | String | - | canvas 组件的唯一标识符 |
+| disable-scroll | Boolean | false | 当在 canvas 中移动时且有绑定手势事件时，禁止屏幕滚动以及下拉刷新 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 需要在 `onReady` 生命周期中绘制
+2. 调用 `ctx.draw()` 才会真正绘制到画布上
+3. 可以通过 `uni.canvasToTempFilePath` 将画布转为图片
+4. 不同平台的 API 可能略有差异
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/canvas.html
+- **Canvas API**: https://doc.dcloud.net.cn/uni-app-x/api/canvas/canvas.html

.agents/bak-skills/uniappx-project/examples/components/built-in/checkbox.md

@@ -0,0 +1,233 @@
+# checkbox 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/checkbox.html
+
+## 概述
+
+`checkbox` 是多项选择器组件，用于多选场景。
+
+## 基础用法
+
+```vue
+<template>
+  <checkbox value="option1" checked>选项1</checkbox>
+</template>
+```
+
+## 完整示例
+
+### 示例 1: 单个复选框
+
+```vue
+<template>
+  <view class="container">
+    <checkbox value="agree" :checked="isAgreed" @tap="handleChange">
+      我已阅读并同意协议
+    </checkbox>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      isAgreed: false
+    }
+  },
+  methods: {
+    handleChange(e) {
+      this.isAgreed = e.detail.value.length > 0
+      console.log('选中状态', this.isAgreed)
+    }
+  }
+}
+</script>
+```
+
+### 示例 2: 复选框组
+
+```vue
+<template>
+  <view class="container">
+    <checkbox-group @change="handleGroupChange">
+      <label v-for="item in options" :key="item.value" class="checkbox-item">
+        <checkbox :value="item.value" :checked="item.checked" />
+        <text>{{ item.label }}</text>
+      </label>
+    </checkbox-group>
+    <text>已选择：{{ selectedValues.join(', ') }}</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      options: [
+        { value: 'option1', label: '选项1', checked: false },
+        { value: 'option2', label: '选项2', checked: false },
+        { value: 'option3', label: '选项3', checked: false }
+      ],
+      selectedValues: []
+    }
+  },
+  methods: {
+    handleGroupChange(e) {
+      this.selectedValues = e.detail.value
+      console.log('选中的值', this.selectedValues)
+    }
+  }
+}
+</script>
+
+<style>
+.checkbox-item {
+  display: flex;
+  align-items: center;
+  padding: 10px;
+}
+</style>
+```
+
+### 示例 3: 全选功能
+
+```vue
+<template>
+  <view class="container">
+    <checkbox-group @change="handleGroupChange">
+      <label class="checkbox-item">
+        <checkbox 
+          value="all" 
+          :checked="isAllSelected"
+          @tap="handleSelectAll"
+        />
+        <text>全选</text>
+      </label>
+      <label 
+        v-for="item in list" 
+        :key="item.id"
+        class="checkbox-item"
+      >
+        <checkbox 
+          :value="item.id" 
+          :checked="item.checked"
+        />
+        <text>{{ item.name }}</text>
+      </label>
+    </checkbox-group>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      list: [
+        { id: '1', name: '项目1', checked: false },
+        { id: '2', name: '项目2', checked: false },
+        { id: '3', name: '项目3', checked: false }
+      ]
+    }
+  },
+  computed: {
+    isAllSelected() {
+      return this.list.every(item => item.checked)
+    }
+  },
+  methods: {
+    handleSelectAll() {
+      const allSelected = this.isAllSelected
+      this.list.forEach(item => {
+        item.checked = !allSelected
+      })
+    },
+    handleGroupChange(e) {
+      const selectedIds = e.detail.value.filter(id => id !== 'all')
+      this.list.forEach(item => {
+        item.checked = selectedIds.includes(item.id)
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 在表单中使用
+
+```vue
+<template>
+  <form @submit="handleSubmit">
+    <view class="form-item">
+      <text>兴趣爱好：</text>
+      <checkbox-group name="hobbies" @change="handleHobbiesChange">
+        <label v-for="hobby in hobbies" :key="hobby.value" class="checkbox-item">
+          <checkbox :value="hobby.value" />
+          <text>{{ hobby.label }}</text>
+        </label>
+      </checkbox-group>
+    </view>
+    <button form-type="submit">提交</button>
+  </form>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      hobbies: [
+        { value: 'reading', label: '阅读' },
+        { value: 'music', label: '音乐' },
+        { value: 'sports', label: '运动' },
+        { value: 'travel', label: '旅行' }
+      ],
+      selectedHobbies: []
+    }
+  },
+  methods: {
+    handleHobbiesChange(e) {
+      this.selectedHobbies = e.detail.value
+    },
+    handleSubmit(e) {
+      console.log('选中的兴趣爱好', this.selectedHobbies)
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| value | String | - | checkbox 标识，选中时触发 change 事件，并携带 value |
+| checked | Boolean | false | 当前是否选中 |
+| disabled | Boolean | false | 是否禁用 |
+| color | String | #007aff | checkbox 的颜色 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 需要配合 `checkbox-group` 使用才能获取选中的值
+2. `value` 用于标识不同的选项
+3. `checked` 属性控制选中状态
+4. 可以通过 `@change` 事件监听变化
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/checkbox.html
+- **表单组件**: https://doc.dcloud.net.cn/uni-app-x/component/form.html

.agents/bak-skills/uniappx-project/examples/components/built-in/form.md

@@ -0,0 +1,321 @@
+# form 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/form.html
+
+## 概述
+
+`form` 是表单组件，用于收集用户输入的数据。
+
+## 基础用法
+
+```vue
+<template>
+  <form @submit="handleSubmit">
+    <input name="username" placeholder="用户名" />
+    <button form-type="submit">提交</button>
+  </form>
+</template>
+
+<script>
+export default {
+  methods: {
+    handleSubmit(e) {
+      console.log('表单数据', e.detail.value)
+    }
+  }
+}
+</script>
+```
+
+## 完整示例
+
+### 示例 1: 基本表单
+
+```vue
+<template>
+  <form @submit="handleSubmit">
+    <view class="form-item">
+      <text>用户名：</text>
+      <input name="username" placeholder="请输入用户名" />
+    </view>
+    <view class="form-item">
+      <text>密码：</text>
+      <input name="password" type="password" placeholder="请输入密码" />
+    </view>
+    <button form-type="submit">提交</button>
+    <button form-type="reset">重置</button>
+  </form>
+</template>
+
+<script>
+export default {
+  methods: {
+    handleSubmit(e) {
+      const formData = e.detail.value
+      console.log('表单数据', formData)
+      // { username: 'xxx', password: 'xxx' }
+    }
+  }
+}
+</script>
+
+<style>
+.form-item {
+  display: flex;
+  align-items: center;
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+</style>
+```
+
+### 示例 2: 完整登录表单
+
+```vue
+<template>
+  <form @submit="handleLogin">
+    <view class="form-item">
+      <input 
+        name="username" 
+        placeholder="请输入用户名"
+        v-model="username"
+      />
+    </view>
+    <view class="form-item">
+      <input 
+        name="password" 
+        type="password"
+        placeholder="请输入密码"
+        v-model="password"
+      />
+    </view>
+    <button form-type="submit" :loading="loading">登录</button>
+  </form>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      username: '',
+      password: '',
+      loading: false
+    }
+  },
+  methods: {
+    handleLogin(e) {
+      const formData = e.detail.value
+      this.loading = true
+      
+      uni.request({
+        url: 'https://api.example.com/login',
+        method: 'POST',
+        data: formData,
+        success: (res) => {
+          if (res.data.success) {
+            uni.setStorageSync('token', res.data.token)
+            uni.showToast({
+              title: '登录成功',
+              icon: 'success'
+            })
+            setTimeout(() => {
+              uni.switchTab({
+                url: '/pages/index/index'
+              })
+            }, 1500)
+          }
+        },
+        complete: () => {
+          this.loading = false
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 表单验证
+
+```vue
+<template>
+  <form @submit="handleSubmit">
+    <view class="form-item">
+      <input 
+        name="email" 
+        type="text"
+        placeholder="请输入邮箱"
+        v-model="email"
+      />
+      <text v-if="emailError" class="error">{{ emailError }}</text>
+    </view>
+    <view class="form-item">
+      <input 
+        name="phone" 
+        type="tel"
+        placeholder="请输入手机号"
+        maxlength="11"
+        v-model="phone"
+      />
+      <text v-if="phoneError" class="error">{{ phoneError }}</text>
+    </view>
+    <button form-type="submit">提交</button>
+  </form>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      email: '',
+      phone: '',
+      emailError: '',
+      phoneError: ''
+    }
+  },
+  methods: {
+    validateEmail() {
+      const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/
+      if (!this.email) {
+        this.emailError = '邮箱不能为空'
+      } else if (!emailRegex.test(this.email)) {
+        this.emailError = '邮箱格式不正确'
+      } else {
+        this.emailError = ''
+      }
+    },
+    validatePhone() {
+      const phoneRegex = /^1[3-9]\d{9}$/
+      if (!this.phone) {
+        this.phoneError = '手机号不能为空'
+      } else if (!phoneRegex.test(this.phone)) {
+        this.phoneError = '手机号格式不正确'
+      } else {
+        this.phoneError = ''
+      }
+    },
+    handleSubmit(e) {
+      this.validateEmail()
+      this.validatePhone()
+      
+      if (!this.emailError && !this.phoneError) {
+        const formData = e.detail.value
+        console.log('表单数据', formData)
+        uni.showToast({
+          title: '提交成功',
+          icon: 'success'
+        })
+      }
+    }
+  }
+}
+</script>
+
+<style>
+.error {
+  color: #ff3b30;
+  font-size: 24rpx;
+  margin-top: 10rpx;
+}
+</style>
+```
+
+### 示例 4: 复杂表单
+
+```vue
+<template>
+  <form @submit="handleSubmit">
+    <view class="form-item">
+      <text>姓名：</text>
+      <input name="name" placeholder="请输入姓名" />
+    </view>
+    
+    <view class="form-item">
+      <text>性别：</text>
+      <radio-group name="gender">
+        <label>
+          <radio value="male" /> 男
+        </label>
+        <label>
+          <radio value="female" /> 女
+        </label>
+      </radio-group>
+    </view>
+    
+    <view class="form-item">
+      <text>兴趣爱好：</text>
+      <checkbox-group name="hobbies">
+        <label>
+          <checkbox value="reading" /> 阅读
+        </label>
+        <label>
+          <checkbox value="music" /> 音乐
+        </label>
+        <label>
+          <checkbox value="sports" /> 运动
+        </label>
+      </checkbox-group>
+    </view>
+    
+    <view class="form-item">
+      <text>城市：</text>
+      <picker mode="region" name="city">
+        <view>请选择城市</view>
+      </picker>
+    </view>
+    
+    <button form-type="submit">提交</button>
+  </form>
+</template>
+
+<script>
+export default {
+  methods: {
+    handleSubmit(e) {
+      console.log('表单数据', e.detail.value)
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| report-submit | Boolean | false | 是否返回 formId 用于发送模板消息 |
+
+## 事件说明
+
+| 事件名 | 说明 | 返回值 |
+|--------|------|--------|
+| @submit | 携带 form 中的数据触发 submit 事件 | e.detail.value 包含所有表单数据 |
+| @reset | 表单重置时会触发 reset 事件 | - |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 表单内的组件需要设置 `name` 属性才能被收集
+2. `form-type="submit"` 的按钮会触发表单提交
+3. `form-type="reset"` 的按钮会重置表单
+4. 可以通过 `e.detail.value` 获取所有表单数据
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/form.html
+- **输入框**: https://doc.dcloud.net.cn/uni-app-x/component/input.html

.agents/bak-skills/uniappx-project/examples/components/built-in/icon.md

@@ -0,0 +1,160 @@
+# icon 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/icon.html
+
+## 概述
+
+`icon` 是图标组件，用于显示各种图标。
+
+## 基础用法
+
+```vue
+<template>
+  <icon type="success" size="20" color="#4cd964"></icon>
+</template>
+```
+
+## 完整示例
+
+### 示例 1: 不同类型的图标
+
+```vue
+<template>
+  <view class="container">
+    <view class="icon-item">
+      <icon type="success" size="26" color="#4cd964"></icon>
+      <text>成功</text>
+    </view>
+    <view class="icon-item">
+      <icon type="info" size="26" color="#909399"></icon>
+      <text>信息</text>
+    </view>
+    <view class="icon-item">
+      <icon type="warn" size="26" color="#ff9500"></icon>
+      <text>警告</text>
+    </view>
+    <view class="icon-item">
+      <icon type="waiting" size="26" color="#007aff"></icon>
+      <text>等待</text>
+    </view>
+    <view class="icon-item">
+      <icon type="clear" size="26" color="#ff3b30"></icon>
+      <text>清除</text>
+    </view>
+    <view class="icon-item">
+      <icon type="search" size="26" color="#333"></icon>
+      <text>搜索</text>
+    </view>
+  </view>
+</template>
+
+<style>
+.container {
+  display: flex;
+  flex-wrap: wrap;
+  padding: 20px;
+}
+.icon-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin: 20px;
+}
+</style>
+```
+
+### 示例 2: 不同大小的图标
+
+```vue
+<template>
+  <view class="container">
+    <icon type="success" size="20" color="#4cd964"></icon>
+    <icon type="success" size="30" color="#4cd964"></icon>
+    <icon type="success" size="40" color="#4cd964"></icon>
+    <icon type="success" size="50" color="#4cd964"></icon>
+  </view>
+</template>
+
+<style>
+.container {
+  display: flex;
+  align-items: center;
+  gap: 20px;
+  padding: 20px;
+}
+</style>
+```
+
+### 示例 3: 不同颜色的图标
+
+```vue
+<template>
+  <view class="container">
+    <icon type="success" size="30" color="#4cd964"></icon>
+    <icon type="success" size="30" color="#007aff"></icon>
+    <icon type="success" size="30" color="#ff3b30"></icon>
+    <icon type="success" size="30" color="#ff9500"></icon>
+  </view>
+</template>
+```
+
+### 示例 4: 在按钮中使用
+
+```vue
+<template>
+  <view class="container">
+    <button class="icon-button">
+      <icon type="search" size="20" color="#fff"></icon>
+      <text>搜索</text>
+    </button>
+    <button class="icon-button">
+      <icon type="success" size="20" color="#fff"></icon>
+      <text>确认</text>
+    </button>
+  </view>
+</template>
+
+<style>
+.icon-button {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}
+</style>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| type | String | - | icon 的类型，可选值：success、info、warn、waiting、clear、search 等 |
+| size | Number | 23 | icon 的大小，单位 px |
+| color | String | - | icon 的颜色，同 CSS 的 color |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `type` 的值在不同平台可能不同
+2. 建议使用 uni-icons 组件库获得更多图标
+3. `size` 单位为 px，不是 rpx
+4. `color` 可以使用任何 CSS 颜色值
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/icon.html
+- **uni-icons**: https://ext.dcloud.net.cn/plugin?id=28

.agents/bak-skills/uniappx-project/examples/components/built-in/image.md

@@ -0,0 +1,373 @@
+# image 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/image.html
+
+## 概述
+
+`image` 是图片组件，用于显示图片。
+
+## 基础用法
+
+```vue
+<template>
+  <image src="/static/logo.png" mode="aspectFit"></image>
+</template>
+```
+
+## 完整示例
+
+### 示例 1: 图片显示模式
+
+```vue
+<template>
+  <view class="container">
+    <view class="image-item">
+      <text>scaleToFill（默认）</text>
+      <image 
+        src="/static/logo.png" 
+        mode="scaleToFill"
+        style="width: 200px; height: 200px;"
+      ></image>
+    </view>
+    
+    <view class="image-item">
+      <text>aspectFit</text>
+      <image 
+        src="/static/logo.png" 
+        mode="aspectFit"
+        style="width: 200px; height: 200px;"
+      ></image>
+    </view>
+    
+    <view class="image-item">
+      <text>aspectFill</text>
+      <image 
+        src="/static/logo.png" 
+        mode="aspectFill"
+        style="width: 200px; height: 200px;"
+      ></image>
+    </view>
+    
+    <view class="image-item">
+      <text>widthFix</text>
+      <image 
+        src="/static/logo.png" 
+        mode="widthFix"
+        style="width: 200px;"
+      ></image>
+    </view>
+  </view>
+</template>
+
+<style>
+.container {
+  padding: 20px;
+}
+.image-item {
+  margin-bottom: 30px;
+}
+</style>
+```
+
+### 示例 2: 图片列表
+
+```vue
+<template>
+  <view class="container">
+    <view class="image-list">
+      <image 
+        v-for="(item, index) in imageList" 
+        :key="index"
+        :src="item"
+        mode="aspectFill"
+        class="image-item"
+        @click="previewImage(index)"
+      ></image>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      imageList: [
+        'https://example.com/image1.jpg',
+        'https://example.com/image2.jpg',
+        'https://example.com/image3.jpg'
+      ]
+    }
+  },
+  methods: {
+    previewImage(index) {
+      uni.previewImage({
+        current: index,
+        urls: this.imageList
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.image-list {
+  display: flex;
+  flex-wrap: wrap;
+}
+.image-item {
+  width: 200rpx;
+  height: 200rpx;
+  margin: 10rpx;
+  border-radius: 8rpx;
+}
+</style>
+```
+
+### 示例 3: 图片懒加载
+
+```vue
+<template>
+  <scroll-view scroll-y class="scroll-view">
+    <image 
+      v-for="(item, index) in imageList" 
+      :key="index"
+      :src="item"
+      mode="aspectFill"
+      lazy-load
+      class="lazy-image"
+    ></image>
+  </scroll-view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      imageList: [
+        'https://example.com/image1.jpg',
+        'https://example.com/image2.jpg',
+        // ... 更多图片
+      ]
+    }
+  }
+}
+</script>
+
+<style>
+.scroll-view {
+  height: 100vh;
+}
+.lazy-image {
+  width: 100%;
+  height: 400rpx;
+  margin-bottom: 20rpx;
+}
+</style>
+```
+
+### 示例 4: 图片加载和错误处理
+
+```vue
+<template>
+  <view class="container">
+    <image 
+      :src="imageUrl"
+      mode="aspectFit"
+      @load="handleLoad"
+      @error="handleError"
+      :class="{ 'error-image': hasError }"
+    ></image>
+    <text v-if="hasError" class="error-text">图片加载失败</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      imageUrl: 'https://example.com/image.jpg',
+      hasError: false
+    }
+  },
+  methods: {
+    handleLoad(e) {
+      console.log('图片加载成功', e.detail)
+      this.hasError = false
+    },
+    handleError(e) {
+      console.error('图片加载失败', e.detail)
+      this.hasError = true
+    }
+  }
+}
+</script>
+
+<style>
+.error-image {
+  background-color: #f5f5f5;
+}
+.error-text {
+  color: #ff3b30;
+  font-size: 24rpx;
+  margin-top: 10rpx;
+}
+</style>
+```
+
+### 示例 5: 占位图和加载状态
+
+```vue
+<template>
+  <view class="container">
+    <view class="image-wrapper">
+      <image 
+        v-if="!imageLoaded"
+        src="/static/placeholder.png"
+        mode="aspectFit"
+        class="placeholder"
+      ></image>
+      <image 
+        :src="imageUrl"
+        mode="aspectFit"
+        @load="imageLoaded = true"
+        :class="{ 'hidden': !imageLoaded }"
+        class="main-image"
+      ></image>
+      <view v-if="loading" class="loading">加载中...</view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      imageUrl: 'https://example.com/image.jpg',
+      imageLoaded: false,
+      loading: true
+    }
+  },
+  methods: {
+    handleLoad() {
+      this.imageLoaded = true
+      this.loading = false
+    }
+  }
+}
+</script>
+
+<style>
+.image-wrapper {
+  position: relative;
+  width: 400rpx;
+  height: 400rpx;
+}
+.placeholder {
+  width: 100%;
+  height: 100%;
+}
+.main-image {
+  width: 100%;
+  height: 100%;
+}
+.hidden {
+  display: none;
+}
+.loading {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  color: #999;
+}
+</style>
+```
+
+### 示例 6: 网络图片和本地图片
+
+```vue
+<template>
+  <view class="container">
+    <!-- 本地图片 -->
+    <image src="/static/logo.png" mode="aspectFit"></image>
+    
+    <!-- 网络图片 -->
+    <image 
+      src="https://example.com/image.jpg" 
+      mode="aspectFit"
+    ></image>
+    
+    <!-- 动态图片 -->
+    <image 
+      :src="dynamicImageUrl" 
+      mode="aspectFit"
+    ></image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      dynamicImageUrl: 'https://example.com/image.jpg'
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| src | String | - | 图片资源地址 |
+| mode | String | scaleToFill | 图片裁剪、缩放的模式 |
+| lazy-load | Boolean | false | 图片懒加载 |
+| webp | Boolean | false | 是否启用 webp 格式 |
+
+## mode 可选值
+
+| 值 | 说明 |
+|----|------|
+| scaleToFill | 不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素 |
+| aspectFit | 保持纵横比缩放图片，使图片的长边能完全显示出来 |
+| aspectFill | 保持纵横比缩放图片，只保证图片的短边能完全显示出来 |
+| widthFix | 宽度不变，高度自动变化，保持原图宽高比不变 |
+| heightFix | 高度不变，宽度自动变化，保持原图宽高比不变 |
+| top | 不缩放图片，只显示图片的顶部区域 |
+| bottom | 不缩放图片，只显示图片的底部区域 |
+| center | 不缩放图片，只显示图片的中间区域 |
+| left | 不缩放图片，只显示图片的左边区域 |
+| right | 不缩放图片，只显示图片的右边区域 |
+| top left | 不缩放图片，只显示图片的左上边区域 |
+| top right | 不缩放图片，只显示图片的右上边区域 |
+| bottom left | 不缩放图片，只显示图片的左下边区域 |
+| bottom right | 不缩放图片，只显示图片的右下边区域 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 网络图片需要配置合法域名
+2. 本地图片路径需要使用 `/static/` 开头
+3. `lazy-load` 只对 page 和 scroll-view 下的 image 有效
+4. 建议使用合适的 `mode` 值以优化显示效果
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/image.html
+- **预览图片**: https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#previewimage

.agents/bak-skills/uniappx-project/examples/components/built-in/input.md

@@ -0,0 +1,331 @@
+# input 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/input.html
+
+## 概述
+
+`input` 是单行输入框组件，用于用户输入文本。
+
+## 基础用法
+
+```vue
+<template>
+  <input v-model="value" placeholder="请输入内容" />
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      value: ''
+    }
+  }
+}
+</script>
+```
+
+## 完整示例
+
+### 示例 1: 基本输入框
+
+```vue
+<template>
+  <view class="container">
+    <input 
+      v-model="inputValue" 
+      placeholder="请输入内容"
+      @input="handleInput"
+    />
+    <text>输入的内容：{{ inputValue }}</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      inputValue: ''
+    }
+  },
+  methods: {
+    handleInput(e) {
+      this.inputValue = e.detail.value
+    }
+  }
+}
+</script>
+```
+
+### 示例 2: 不同类型的输入框
+
+```vue
+<template>
+  <view class="container">
+    <input type="text" placeholder="文本输入" />
+    <input type="number" placeholder="数字输入" />
+    <input type="digit" placeholder="带小数点的数字" />
+    <input type="idcard" placeholder="身份证号" />
+    <input type="tel" placeholder="电话号码" />
+    <input type="safe-password" placeholder="安全密码" />
+    <input type="nickname" placeholder="昵称" />
+  </view>
+</template>
+```
+
+### 示例 3: 密码输入框
+
+```vue
+<template>
+  <view class="container">
+    <input 
+      type="text"
+      password
+      placeholder="请输入密码"
+      v-model="password"
+    />
+    <input 
+      type="text"
+      :password="!showPassword"
+      placeholder="显示/隐藏密码"
+      v-model="password2"
+    />
+    <button @click="showPassword = !showPassword">
+      {{ showPassword ? '隐藏' : '显示' }}密码
+    </button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      password: '',
+      password2: '',
+      showPassword: false
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 限制输入长度
+
+```vue
+<template>
+  <view class="container">
+    <input 
+      v-model="value"
+      placeholder="最多输入10个字符"
+      maxlength="10"
+      @input="handleInput"
+    />
+    <text>已输入：{{ value.length }}/10</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      value: ''
+    }
+  },
+  methods: {
+    handleInput(e) {
+      this.value = e.detail.value
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 获取焦点
+
+```vue
+<template>
+  <view class="container">
+    <input 
+      ref="input"
+      v-model="value"
+      placeholder="点击按钮获取焦点"
+      :focus="isFocused"
+    />
+    <button @click="focusInput">获取焦点</button>
+    <button @click="blurInput">失去焦点</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      value: '',
+      isFocused: false
+    }
+  },
+  methods: {
+    focusInput() {
+      this.isFocused = true
+      // 或使用组件方法
+      this.$refs.input.focus()
+    },
+    blurInput() {
+      this.isFocused = false
+      // 或使用组件方法
+      this.$refs.input.blur()
+    }
+  }
+}
+</script>
+```
+
+### 示例 6: 确认按钮
+
+```vue
+<template>
+  <view class="container">
+    <input 
+      v-model="value"
+      placeholder="输入后点击键盘确认"
+      confirm-type="search"
+      @confirm="handleConfirm"
+    />
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      value: ''
+    }
+  },
+  methods: {
+    handleConfirm(e) {
+      console.log('确认输入', e.detail.value)
+      uni.showToast({
+        title: '搜索：' + e.detail.value,
+        icon: 'none'
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 7: 表单验证
+
+```vue
+<template>
+  <view class="container">
+    <input 
+      v-model="email"
+      type="text"
+      placeholder="请输入邮箱"
+      @blur="validateEmail"
+    />
+    <text v-if="emailError" class="error">{{ emailError }}</text>
+    
+    <input 
+      v-model="phone"
+      type="tel"
+      placeholder="请输入手机号"
+      maxlength="11"
+      @blur="validatePhone"
+    />
+    <text v-if="phoneError" class="error">{{ phoneError }}</text>
+    
+    <button @click="submit">提交</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      email: '',
+      phone: '',
+      emailError: '',
+      phoneError: ''
+    }
+  },
+  methods: {
+    validateEmail() {
+      const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/
+      if (this.email && !emailRegex.test(this.email)) {
+        this.emailError = '邮箱格式不正确'
+      } else {
+        this.emailError = ''
+      }
+    },
+    validatePhone() {
+      const phoneRegex = /^1[3-9]\d{9}$/
+      if (this.phone && !phoneRegex.test(this.phone)) {
+        this.phoneError = '手机号格式不正确'
+      } else {
+        this.phoneError = ''
+      }
+    },
+    submit() {
+      this.validateEmail()
+      this.validatePhone()
+      if (!this.emailError && !this.phoneError) {
+        uni.showToast({
+          title: '提交成功',
+          icon: 'success'
+        })
+      }
+    }
+  }
+}
+</script>
+
+<style>
+.error {
+  color: #ff3b30;
+  font-size: 24rpx;
+  margin-top: 10rpx;
+}
+</style>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| value | String | - | 输入框的初始内容 |
+| type | String | text | input 的类型，可选值：text、number、digit、idcard、tel、safe-password、nickname |
+| password | Boolean | false | 是否是密码类型 |
+| placeholder | String | - | 输入框为空时占位符 |
+| disabled | Boolean | false | 是否禁用 |
+| maxlength | Number | 140 | 最大输入长度，-1 表示不限制 |
+| focus | Boolean | false | 获取焦点 |
+| confirm-type | String | done | 设置键盘右下角按钮的文字 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `v-model` 是双向绑定的推荐方式
+2. `maxlength` 设置为 -1 时不限制最大长度
+3. `focus` 属性在 H5 和 App 上需要特殊处理
+4. `confirm-type` 在不同平台支持的值可能不同
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/input.html
+- **表单组件**: https://doc.dcloud.net.cn/uni-app-x/component/form.html

.agents/bak-skills/uniappx-project/examples/components/built-in/label.md

@@ -0,0 +1,262 @@
+# label 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/label.html
+
+## 概述
+
+`label` 是标签组件，用于改进表单组件的可用性。
+
+## 基础用法
+
+```vue
+<template>
+  <label>
+    <checkbox value="option1" />
+    <text>选项1</text>
+  </label>
+</template>
+```
+
+## 完整示例
+
+### 示例 1: 配合 checkbox 使用
+
+```vue
+<template>
+  <view class="container">
+    <checkbox-group @change="handleChange">
+      <label class="checkbox-label">
+        <checkbox value="option1" />
+        <text>选项1</text>
+      </label>
+      <label class="checkbox-label">
+        <checkbox value="option2" />
+        <text>选项2</text>
+      </label>
+      <label class="checkbox-label">
+        <checkbox value="option3" />
+        <text>选项3</text>
+      </label>
+    </checkbox-group>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    handleChange(e) {
+      console.log('选中的值', e.detail.value)
+    }
+  }
+}
+</script>
+
+<style>
+.checkbox-label {
+  display: flex;
+  align-items: center;
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+</style>
+```
+
+### 示例 2: 配合 radio 使用
+
+```vue
+<template>
+  <view class="container">
+    <radio-group @change="handleChange">
+      <label class="radio-label">
+        <radio value="male" />
+        <text>男</text>
+      </label>
+      <label class="radio-label">
+        <radio value="female" />
+        <text>女</text>
+      </label>
+    </radio-group>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    handleChange(e) {
+      console.log('选中的值', e.detail.value)
+    }
+  }
+}
+</script>
+
+<style>
+.radio-label {
+  display: flex;
+  align-items: center;
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+</style>
+```
+
+### 示例 3: 配合 switch 使用
+
+```vue
+<template>
+  <view class="container">
+    <label class="switch-label">
+      <text>开启通知</text>
+      <switch :checked="notifyEnabled" @change="handleSwitchChange" />
+    </label>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      notifyEnabled: false
+    }
+  },
+  methods: {
+    handleSwitchChange(e) {
+      this.notifyEnabled = e.detail.value
+    }
+  }
+}
+</script>
+
+<style>
+.switch-label {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px;
+}
+</style>
+```
+
+### 示例 4: 配合 input 使用
+
+```vue
+<template>
+  <view class="container">
+    <label class="input-label">
+      <text>用户名：</text>
+      <input v-model="username" placeholder="请输入用户名" />
+    </label>
+    <label class="input-label">
+      <text>密码：</text>
+      <input v-model="password" type="password" placeholder="请输入密码" />
+    </label>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      username: '',
+      password: ''
+    }
+  }
+}
+</script>
+
+<style>
+.input-label {
+  display: flex;
+  align-items: center;
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+</style>
+```
+
+### 示例 5: 表单列表
+
+```vue
+<template>
+  <view class="container">
+    <view class="form-list">
+      <label class="form-item">
+        <text class="label-text">同意协议</text>
+        <checkbox value="agree" />
+      </label>
+      <label class="form-item">
+        <text class="label-text">接收通知</text>
+        <switch :checked="notifyEnabled" @change="notifyEnabled = $event.detail.value" />
+      </label>
+      <label class="form-item">
+        <text class="label-text">性别</text>
+        <radio-group>
+          <radio value="male" />男
+          <radio value="female" />女
+        </radio-group>
+      </label>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      notifyEnabled: false
+    }
+  }
+}
+</script>
+
+<style>
+.form-list {
+  padding: 20px;
+}
+.form-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px 0;
+  border-bottom: 1px solid #eee;
+}
+.label-text {
+  font-size: 32rpx;
+  color: #333;
+}
+</style>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| for | String | - | 绑定控件的 id |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `label` 用于改进表单组件的可用性
+2. 点击 `label` 内的文本可以触发关联的表单控件
+3. 可以配合 `checkbox`、`radio`、`switch`、`input` 等使用
+4. 建议使用 `label` 包裹表单控件和文本
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/label.html
+- **复选框**: https://doc.dcloud.net.cn/uni-app-x/component/checkbox.html
+- **单选框**: https://doc.dcloud.net.cn/uni-app-x/component/radio.html

.agents/bak-skills/uniappx-project/examples/components/built-in/map.md

@@ -0,0 +1,326 @@
+# map 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/map.html
+
+## 概述
+
+`map` 是地图组件，用于显示地图和标记位置。
+
+## 基础用法
+
+```vue
+<template>
+  <map 
+    :latitude="latitude"
+    :longitude="longitude"
+    :markers="markers"
+  ></map>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      latitude: 39.908823,
+      longitude: 116.397470,
+      markers: [{
+        id: 1,
+        latitude: 39.908823,
+        longitude: 116.397470,
+        title: '天安门'
+      }]
+    }
+  }
+}
+</script>
+```
+
+## 完整示例
+
+### 示例 1: 基本地图
+
+```vue
+<template>
+  <view class="container">
+    <map 
+      :latitude="latitude"
+      :longitude="longitude"
+      :scale="scale"
+      class="map"
+    ></map>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      latitude: 39.908823,
+      longitude: 116.397470,
+      scale: 16
+    }
+  }
+}
+</script>
+
+<style>
+.map {
+  width: 100%;
+  height: 500px;
+}
+</style>
+```
+
+### 示例 2: 地图标记
+
+```vue
+<template>
+  <view class="container">
+    <map 
+      :latitude="latitude"
+      :longitude="longitude"
+      :markers="markers"
+      :show-location="true"
+      class="map"
+      @markertap="handleMarkerTap"
+    ></map>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      latitude: 39.908823,
+      longitude: 116.397470,
+      markers: [
+        {
+          id: 1,
+          latitude: 39.908823,
+          longitude: 116.397470,
+          title: '天安门',
+          iconPath: '/static/marker.png',
+          width: 30,
+          height: 30
+        },
+        {
+          id: 2,
+          latitude: 39.918823,
+          longitude: 116.407470,
+          title: '故宫',
+          iconPath: '/static/marker.png',
+          width: 30,
+          height: 30
+        }
+      ]
+    }
+  },
+  methods: {
+    handleMarkerTap(e) {
+      const markerId = e.detail.markerId
+      const marker = this.markers.find(m => m.id === markerId)
+      if (marker) {
+        uni.showToast({
+          title: marker.title,
+          icon: 'none'
+        })
+      }
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 显示当前位置
+
+```vue
+<template>
+  <view class="container">
+    <map 
+      :latitude="latitude"
+      :longitude="longitude"
+      :show-location="true"
+      :enable-zoom="true"
+      class="map"
+    ></map>
+    <button @click="getCurrentLocation">获取当前位置</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      latitude: 39.908823,
+      longitude: 116.397470
+    }
+  },
+  onLoad() {
+    this.getCurrentLocation()
+  },
+  methods: {
+    getCurrentLocation() {
+      uni.getLocation({
+        type: 'gcj02',
+        success: (res) => {
+          this.latitude = res.latitude
+          this.longitude = res.longitude
+        },
+        fail: () => {
+          uni.showToast({
+            title: '获取位置失败',
+            icon: 'none'
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 地图控件
+
+```vue
+<template>
+  <view class="container">
+    <map 
+      :latitude="latitude"
+      :longitude="longitude"
+      :controls="controls"
+      :show-location="true"
+      class="map"
+      @controltap="handleControlTap"
+    ></map>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      latitude: 39.908823,
+      longitude: 116.397470,
+      controls: [
+        {
+          id: 1,
+          iconPath: '/static/location.png',
+          position: {
+            left: 10,
+            top: 10,
+            width: 30,
+            height: 30
+          },
+          clickable: true
+        }
+      ]
+    }
+  },
+  methods: {
+    handleControlTap(e) {
+      const controlId = e.detail.controlId
+      if (controlId === 1) {
+        this.getCurrentLocation()
+      }
+    },
+    getCurrentLocation() {
+      uni.getLocation({
+        type: 'gcj02',
+        success: (res) => {
+          this.latitude = res.latitude
+          this.longitude = res.longitude
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 地图事件
+
+```vue
+<template>
+  <view class="container">
+    <map 
+      :latitude="latitude"
+      :longitude="longitude"
+      :markers="markers"
+      class="map"
+      @tap="handleMapTap"
+      @regionchange="handleRegionChange"
+      @updated="handleMapUpdated"
+    ></map>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      latitude: 39.908823,
+      longitude: 116.397470,
+      markers: []
+    }
+  },
+  methods: {
+    handleMapTap(e) {
+      console.log('地图点击', e.detail)
+      // 添加标记
+      const newMarker = {
+        id: Date.now(),
+        latitude: e.detail.latitude,
+        longitude: e.detail.longitude,
+        title: '新位置'
+      }
+      this.markers.push(newMarker)
+    },
+    handleRegionChange(e) {
+      console.log('地图区域变化', e.detail)
+    },
+    handleMapUpdated() {
+      console.log('地图更新完成')
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| latitude | Number | - | 中心纬度 |
+| longitude | Number | - | 中心经度 |
+| scale | Number | 16 | 缩放级别，取值范围为 5-18 |
+| markers | Array | [] | 标记点 |
+| show-location | Boolean | false | 显示带有方向的当前定位点 |
+| controls | Array | [] | 控件 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 需要使用 `gcj02` 类型的坐标
+2. `markers` 数组中的每个标记需要唯一 `id`
+3. `show-location` 可以显示当前位置
+4. 可以通过事件监听地图交互
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/map.html
+- **获取位置**: https://doc.dcloud.net.cn/uni-app-x/api/location/location.html#getlocation

.agents/bak-skills/uniappx-project/examples/components/built-in/navigator.md

@@ -0,0 +1,204 @@
+# navigator 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/navigator.html
+
+## 概述
+
+`navigator` 是页面链接组件，用于页面跳转。
+
+## 基础用法
+
+```vue
+<template>
+  <navigator url="/pages/detail/detail">跳转到详情页</navigator>
+</template>
+```
+
+## 完整示例
+
+### 示例 1: 基本跳转
+
+```vue
+<template>
+  <view class="container">
+    <navigator url="/pages/detail/detail">跳转到详情页</navigator>
+  </view>
+</template>
+```
+
+### 示例 2: 带参数跳转
+
+```vue
+<template>
+  <view class="container">
+    <navigator url="/pages/detail/detail?id=123&name=test">
+      跳转到详情页
+    </navigator>
+  </view>
+</template>
+```
+
+### 示例 3: 不同跳转方式
+
+```vue
+<template>
+  <view class="container">
+    <!-- 保留当前页面，可以返回 -->
+    <navigator url="/pages/detail/detail" open-type="navigate">
+      保留页面跳转
+    </navigator>
+    
+    <!-- 关闭当前页面，不能返回 -->
+    <navigator url="/pages/detail/detail" open-type="redirect">
+      关闭页面跳转
+    </navigator>
+    
+    <!-- 关闭所有页面，重新启动 -->
+    <navigator url="/pages/index/index" open-type="reLaunch">
+      重新启动
+    </navigator>
+    
+    <!-- 跳转到 tabBar 页面 -->
+    <navigator url="/pages/index/index" open-type="switchTab">
+      切换到首页
+    </navigator>
+    
+    <!-- 返回上一页 -->
+    <navigator open-type="navigateBack" :delta="1">
+      返回上一页
+    </navigator>
+  </view>
+</template>
+```
+
+### 示例 4: 列表跳转
+
+```vue
+<template>
+  <view class="container">
+    <view 
+      v-for="item in list" 
+      :key="item.id"
+      class="list-item"
+    >
+      <navigator :url="`/pages/detail/detail?id=${item.id}`">
+        <text>{{ item.title }}</text>
+        <text class="arrow">></text>
+      </navigator>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      list: [
+        { id: 1, title: '项目1' },
+        { id: 2, title: '项目2' },
+        { id: 3, title: '项目3' }
+      ]
+    }
+  }
+}
+</script>
+
+<style>
+.list-item {
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+.arrow {
+  float: right;
+  color: #999;
+}
+</style>
+```
+
+### 示例 5: 条件跳转
+
+```vue
+<template>
+  <view class="container">
+    <navigator 
+      v-if="isLogin"
+      url="/pages/user/user"
+      open-type="navigate"
+    >
+      个人中心
+    </navigator>
+    <navigator 
+      v-else
+      url="/pages/login/login"
+      open-type="navigate"
+    >
+      登录
+    </navigator>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      isLogin: false
+    }
+  },
+  onLoad() {
+    this.checkLogin()
+  },
+  methods: {
+    checkLogin() {
+      const token = uni.getStorageSync('token')
+      this.isLogin = !!token
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| url | String | - | 应用内的跳转链接 |
+| open-type | String | navigate | 跳转方式，可选值：navigate、redirect、switchTab、reLaunch、navigateBack |
+| delta | Number | 1 | 当 open-type 为 navigateBack 时有效，表示返回的页面数 |
+
+## open-type 可选值
+
+| 值 | 说明 |
+|----|------|
+| navigate | 保留当前页面，跳转到应用内的某个页面 |
+| redirect | 关闭当前页面，跳转到应用内的某个页面 |
+| switchTab | 跳转到 tabBar 页面 |
+| reLaunch | 关闭所有页面，打开到应用内的某个页面 |
+| navigateBack | 关闭当前页面，返回上一页面或多级页面 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `url` 必须以 `/` 开头
+2. `open-type` 为 `switchTab` 时，只能跳转到 tabBar 页面
+3. `open-type` 为 `navigateBack` 时，不需要 `url` 参数
+4. 可以通过 `delta` 控制返回的页面数
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/navigator.html
+- **页面路由**: https://doc.dcloud.net.cn/uni-app-x/api/router.html

.agents/bak-skills/uniappx-project/examples/components/built-in/picker.md

@@ -0,0 +1,290 @@
+# picker 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/picker.html
+
+## 概述
+
+`picker` 是滚动选择器组件，支持普通选择器、多列选择器、时间选择器、日期选择器等。
+
+## 基础用法
+
+```vue
+<template>
+  <picker mode="selector" :range="options" @change="handleChange">
+    <view>请选择</view>
+  </picker>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      options: ['选项1', '选项2', '选项3']
+    }
+  },
+  methods: {
+    handleChange(e) {
+      console.log('选中的索引', e.detail.value)
+    }
+  }
+}
+</script>
+```
+
+## 完整示例
+
+### 示例 1: 普通选择器
+
+```vue
+<template>
+  <view class="container">
+    <picker 
+      mode="selector" 
+      :range="options"
+      :value="selectedIndex"
+      @change="handleChange"
+    >
+      <view class="picker-view">
+        <text>{{ selectedText || '请选择' }}</text>
+        <text class="arrow">></text>
+      </view>
+    </picker>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      options: ['选项1', '选项2', '选项3', '选项4'],
+      selectedIndex: 0,
+      selectedText: ''
+    }
+  },
+  methods: {
+    handleChange(e) {
+      this.selectedIndex = e.detail.value
+      this.selectedText = this.options[e.detail.value]
+      console.log('选中的值', this.selectedText)
+    }
+  }
+}
+</script>
+
+<style>
+.picker-view {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+.arrow {
+  color: #999;
+}
+</style>
+```
+
+### 示例 2: 多列选择器
+
+```vue
+<template>
+  <view class="container">
+    <picker 
+      mode="multiSelector" 
+      :range="multiArray"
+      :value="multiIndex"
+      @change="handleMultiChange"
+      @columnchange="handleColumnChange"
+    >
+      <view class="picker-view">
+        <text>{{ displayText || '请选择省市区' }}</text>
+        <text class="arrow">></text>
+      </view>
+    </picker>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      multiArray: [
+        ['北京', '上海', '广东'],
+        ['朝阳区', '海淀区', '丰台区'],
+        ['街道1', '街道2', '街道3']
+      ],
+      multiIndex: [0, 0, 0],
+      displayText: ''
+    }
+  },
+  methods: {
+    handleMultiChange(e) {
+      this.multiIndex = e.detail.value
+      this.updateDisplayText()
+    },
+    handleColumnChange(e) {
+      // 当某一列改变时，可以更新其他列的数据
+      const column = e.detail.column
+      const row = e.detail.value
+      this.multiIndex[column] = row
+      this.updateDisplayText()
+    },
+    updateDisplayText() {
+      this.displayText = this.multiArray.map((arr, index) => {
+        return arr[this.multiIndex[index]]
+      }).join(' ')
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 时间选择器
+
+```vue
+<template>
+  <view class="container">
+    <picker 
+      mode="time" 
+      :value="time"
+      @change="handleTimeChange"
+    >
+      <view class="picker-view">
+        <text>{{ time || '请选择时间' }}</text>
+        <text class="arrow">></text>
+      </view>
+    </picker>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      time: ''
+    }
+  },
+  methods: {
+    handleTimeChange(e) {
+      this.time = e.detail.value
+      console.log('选择的时间', this.time)
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 日期选择器
+
+```vue
+<template>
+  <view class="container">
+    <picker 
+      mode="date" 
+      :value="date"
+      :start="startDate"
+      :end="endDate"
+      @change="handleDateChange"
+    >
+      <view class="picker-view">
+        <text>{{ date || '请选择日期' }}</text>
+        <text class="arrow">></text>
+      </view>
+    </picker>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      date: '',
+      startDate: '2020-01-01',
+      endDate: '2030-12-31'
+    }
+  },
+  methods: {
+    handleDateChange(e) {
+      this.date = e.detail.value
+      console.log('选择的日期', this.date)
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 地区选择器
+
+```vue
+<template>
+  <view class="container">
+    <picker 
+      mode="region" 
+      :value="region"
+      @change="handleRegionChange"
+    >
+      <view class="picker-view">
+        <text>{{ regionText || '请选择地区' }}</text>
+        <text class="arrow">></text>
+      </view>
+    </picker>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      region: [],
+      regionText: ''
+    }
+  },
+  methods: {
+    handleRegionChange(e) {
+      this.region = e.detail.value
+      this.regionText = e.detail.value.join(' ')
+      console.log('选择的地区', this.region)
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| mode | String | selector | 选择器类型，可选值：selector、multiSelector、time、date、region |
+| range | Array | [] | mode 为 selector 或 multiSelector 时，range 有效 |
+| value | Number/Array | 0 | 表示选择了 range 中的第几个（下标从 0 开始） |
+| start | String | - | 有效值范围的开始，字符串格式为 "YYYY-MM-DD" |
+| end | String | - | 有效值范围的结束，字符串格式为 "YYYY-MM-DD" |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `mode` 不同，`range` 和 `value` 的格式也不同
+2. 时间选择器的 `value` 格式为 "HH:mm"
+3. 日期选择器的 `value` 格式为 "YYYY-MM-DD"
+4. 多列选择器需要配合 `@columnchange` 事件处理联动
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/picker.html
+- **滚动选择器**: https://doc.dcloud.net.cn/uni-app-x/component/picker-view.html

.agents/bak-skills/uniappx-project/examples/components/built-in/progress.md

@@ -0,0 +1,209 @@
+# progress 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/progress.html
+
+## 概述
+
+`progress` 是进度条组件，用于显示任务进度。
+
+## 基础用法
+
+```vue
+<template>
+  <progress :percent="50"></progress>
+</template>
+```
+
+## 完整示例
+
+### 示例 1: 基本进度条
+
+```vue
+<template>
+  <view class="container">
+    <progress :percent="progress" />
+    <text>{{ progress }}%</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      progress: 50
+    }
+  }
+}
+</script>
+```
+
+### 示例 2: 显示进度百分比
+
+```vue
+<template>
+  <view class="container">
+    <progress :percent="progress" :show-info="true" />
+    <button @click="increaseProgress">增加进度</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      progress: 0
+    }
+  },
+  methods: {
+    increaseProgress() {
+      if (this.progress < 100) {
+        this.progress += 10
+      }
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 不同颜色
+
+```vue
+<template>
+  <view class="container">
+    <progress :percent="50" color="#007aff" />
+    <progress :percent="60" color="#4cd964" />
+    <progress :percent="70" color="#ff3b30" />
+  </view>
+</template>
+```
+
+### 示例 4: 文件上传进度
+
+```vue
+<template>
+  <view class="container">
+    <progress :percent="uploadProgress" :show-info="true" />
+    <button @click="uploadFile">上传文件</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      uploadProgress: 0
+    }
+  },
+  methods: {
+    uploadFile() {
+      uni.chooseImage({
+        count: 1,
+        success: (res) => {
+          const tempFilePath = res.tempFilePaths[0]
+          this.uploadProgress = 0
+          
+          // 模拟上传进度
+          const interval = setInterval(() => {
+            this.uploadProgress += 10
+            if (this.uploadProgress >= 100) {
+              clearInterval(interval)
+              uni.showToast({
+                title: '上传完成',
+                icon: 'success'
+              })
+            }
+          }, 200)
+          
+          // 实际上传
+          uni.uploadFile({
+            url: 'https://api.example.com/upload',
+            filePath: tempFilePath,
+            name: 'file',
+            success: () => {
+              clearInterval(interval)
+              this.uploadProgress = 100
+            }
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 动画进度条
+
+```vue
+<template>
+  <view class="container">
+    <progress 
+      :percent="progress" 
+      :active="true"
+      :active-color="activeColor"
+    />
+    <button @click="startProgress">开始进度</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      progress: 0,
+      activeColor: '#007aff'
+    }
+  },
+  methods: {
+    startProgress() {
+      this.progress = 0
+      const interval = setInterval(() => {
+        this.progress += 2
+        if (this.progress >= 100) {
+          clearInterval(interval)
+          this.activeColor = '#4cd964'
+        }
+      }, 100)
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| percent | Number | 0 | 百分比 0~100 |
+| show-info | Boolean | false | 在进度条右侧显示百分比 |
+| stroke-width | Number | 6 | 进度条线的宽度，单位 px |
+| active | Boolean | false | 进度条是否显示动画 |
+| active-color | String | #007aff | 已选择的进度条的颜色 |
+| backgroundColor | String | #ebebeb | 未选择的进度条的颜色 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `percent` 值范围是 0-100
+2. `show-info` 可以在右侧显示百分比文字
+3. `active` 可以启用动画效果
+4. 可以通过 `active-color` 自定义颜色
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/progress.html

.agents/bak-skills/uniappx-project/examples/components/built-in/radio.md

@@ -0,0 +1,172 @@
+# radio 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/radio.html
+
+## 概述
+
+`radio` 是单项选择器组件，用于单选场景。
+
+## 基础用法
+
+```vue
+<template>
+  <radio value="option1" checked>选项1</radio>
+</template>
+```
+
+## 完整示例
+
+### 示例 1: 单个单选框
+
+```vue
+<template>
+  <view class="container">
+    <radio value="male" :checked="gender === 'male'" @tap="handleChange">
+      男
+    </radio>
+    <radio value="female" :checked="gender === 'female'" @tap="handleChange">
+      女
+    </radio>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      gender: 'male'
+    }
+  },
+  methods: {
+    handleChange(e) {
+      this.gender = e.detail.value
+      console.log('选择的性别', this.gender)
+    }
+  }
+}
+</script>
+```
+
+### 示例 2: 单选框组
+
+```vue
+<template>
+  <view class="container">
+    <radio-group @change="handleGroupChange">
+      <label v-for="item in options" :key="item.value" class="radio-item">
+        <radio :value="item.value" :checked="selectedValue === item.value" />
+        <text>{{ item.label }}</text>
+      </label>
+    </radio-group>
+    <text>已选择：{{ selectedValue }}</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      options: [
+        { value: 'option1', label: '选项1' },
+        { value: 'option2', label: '选项2' },
+        { value: 'option3', label: '选项3' }
+      ],
+      selectedValue: 'option1'
+    }
+  },
+  methods: {
+    handleGroupChange(e) {
+      this.selectedValue = e.detail.value
+      console.log('选中的值', this.selectedValue)
+    }
+  }
+}
+</script>
+
+<style>
+.radio-item {
+  display: flex;
+  align-items: center;
+  padding: 10px;
+}
+</style>
+```
+
+### 示例 3: 在表单中使用
+
+```vue
+<template>
+  <form @submit="handleSubmit">
+    <view class="form-item">
+      <text>支付方式：</text>
+      <radio-group name="payment" @change="handlePaymentChange">
+        <label v-for="method in paymentMethods" :key="method.value" class="radio-item">
+          <radio :value="method.value" />
+          <text>{{ method.label }}</text>
+        </label>
+      </radio-group>
+    </view>
+    <button form-type="submit">提交</button>
+  </form>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      paymentMethods: [
+        { value: 'alipay', label: '支付宝' },
+        { value: 'wechat', label: '微信支付' },
+        { value: 'bank', label: '银行卡' }
+      ],
+      selectedPayment: ''
+    }
+  },
+  methods: {
+    handlePaymentChange(e) {
+      this.selectedPayment = e.detail.value
+    },
+    handleSubmit(e) {
+      console.log('选择的支付方式', this.selectedPayment)
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| value | String | - | radio 标识，选中时触发 change 事件，并携带 value |
+| checked | Boolean | false | 当前是否选中 |
+| disabled | Boolean | false | 是否禁用 |
+| color | String | #007aff | radio 的颜色 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 需要配合 `radio-group` 使用才能获取选中的值
+2. 同一组内只能选择一个选项
+3. `value` 用于标识不同的选项
+4. `checked` 属性控制选中状态
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/radio.html
+- **表单组件**: https://doc.dcloud.net.cn/uni-app-x/component/form.html

.agents/bak-skills/uniappx-project/examples/components/built-in/rich-text.md

@@ -0,0 +1,247 @@
+# rich-text 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/rich-text.html
+
+## 概述
+
+`rich-text` 是富文本组件，用于显示富文本内容。
+
+## 基础用法
+
+```vue
+<template>
+  <rich-text :nodes="htmlContent"></rich-text>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      htmlContent: '<div>这是富文本内容</div>'
+    }
+  }
+}
+</script>
+```
+
+## 完整示例
+
+### 示例 1: 显示 HTML 内容
+
+```vue
+<template>
+  <view class="container">
+    <rich-text :nodes="htmlContent"></rich-text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      htmlContent: `
+        <div>
+          <h1>标题</h1>
+          <p>这是一段<strong>加粗</strong>的文字</p>
+          <p>这是一段<em>斜体</em>的文字</p>
+          <ul>
+            <li>列表项1</li>
+            <li>列表项2</li>
+          </ul>
+        </div>
+      `
+    }
+  }
+}
+</script>
+```
+
+### 示例 2: 显示网络 HTML
+
+```vue
+<template>
+  <view class="container">
+    <rich-text :nodes="htmlContent"></rich-text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      htmlContent: ''
+    }
+  },
+  onLoad() {
+    this.loadHtmlContent()
+  },
+  methods: {
+    loadHtmlContent() {
+      uni.request({
+        url: 'https://api.example.com/article',
+        success: (res) => {
+          this.htmlContent = res.data.content
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 使用对象数组
+
+```vue
+<template>
+  <view class="container">
+    <rich-text :nodes="nodes"></rich-text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      nodes: [
+        {
+          name: 'div',
+          attrs: {
+            class: 'wrapper',
+            style: 'color: red;'
+          },
+          children: [
+            {
+              type: 'text',
+              text: 'Hello World!'
+            }
+          ]
+        }
+      ]
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 混合使用
+
+```vue
+<template>
+  <view class="container">
+    <rich-text :nodes="mixedContent"></rich-text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      mixedContent: [
+        '<p>这是HTML字符串</p>',
+        {
+          name: 'div',
+          attrs: {
+            style: 'color: blue;'
+          },
+          children: [
+            {
+              type: 'text',
+              text: '这是对象节点'
+            }
+          ]
+        }
+      ]
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 文章详情页
+
+```vue
+<template>
+  <view class="container">
+    <view class="article-header">
+      <text class="title">{{ article.title }}</text>
+      <text class="date">{{ article.date }}</text>
+    </view>
+    <rich-text :nodes="article.content" class="article-content"></rich-text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      article: {
+        title: '文章标题',
+        date: '2024-01-01',
+        content: `
+          <div>
+            <h2>第一章</h2>
+            <p>这是文章的第一段内容...</p>
+            <img src="https://example.com/image.jpg" />
+            <h2>第二章</h2>
+            <p>这是文章的第二段内容...</p>
+          </div>
+        `
+      }
+    }
+  }
+}
+</script>
+
+<style>
+.article-header {
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+.title {
+  font-size: 36rpx;
+  font-weight: bold;
+  display: block;
+  margin-bottom: 10px;
+}
+.date {
+  font-size: 24rpx;
+  color: #999;
+}
+.article-content {
+  padding: 20px;
+}
+</style>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| nodes | String/Array | - | 节点列表/HTML String |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `nodes` 可以是 HTML 字符串或对象数组
+2. 不同平台支持的 HTML 标签可能不同
+3. 建议使用对象数组格式以获得更好的兼容性
+4. 图片需要配置合法域名
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/rich-text.html

.agents/bak-skills/uniappx-project/examples/components/built-in/scroll-view.md

@@ -0,0 +1,337 @@
+# scroll-view 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/scroll-view.html
+
+## 概述
+
+`scroll-view` 是可滚动视图容器组件，用于实现可滚动的区域。
+
+## 基础用法
+
+```vue
+<template>
+  <scroll-view scroll-y class="scroll-view">
+    <view v-for="item in list" :key="item.id">{{ item.name }}</view>
+  </scroll-view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      list: [
+        { id: 1, name: '项目1' },
+        { id: 2, name: '项目2' }
+      ]
+    }
+  }
+}
+</script>
+
+<style>
+.scroll-view {
+  height: 400px;
+}
+</style>
+```
+
+## 完整示例
+
+### 示例 1: 垂直滚动
+
+```vue
+<template>
+  <scroll-view 
+    scroll-y 
+    class="scroll-view"
+    @scroll="handleScroll"
+  >
+    <view 
+      v-for="item in list" 
+      :key="item.id"
+      class="list-item"
+    >
+      {{ item.name }}
+    </view>
+  </scroll-view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      list: Array.from({ length: 50 }, (_, i) => ({
+        id: i + 1,
+        name: `项目 ${i + 1}`
+      }))
+    }
+  },
+  methods: {
+    handleScroll(e) {
+      console.log('滚动位置', e.detail.scrollTop)
+    }
+  }
+}
+</script>
+
+<style>
+.scroll-view {
+  height: 500px;
+}
+.list-item {
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+</style>
+```
+
+### 示例 2: 水平滚动
+
+```vue
+<template>
+  <scroll-view 
+    scroll-x 
+    class="scroll-view-horizontal"
+    show-scrollbar
+  >
+    <view 
+      v-for="item in list" 
+      :key="item.id"
+      class="horizontal-item"
+    >
+      {{ item.name }}
+    </view>
+  </scroll-view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      list: Array.from({ length: 20 }, (_, i) => ({
+        id: i + 1,
+        name: `项目 ${i + 1}`
+      }))
+    }
+  }
+}
+</script>
+
+<style>
+.scroll-view-horizontal {
+  white-space: nowrap;
+  width: 100%;
+}
+.horizontal-item {
+  display: inline-block;
+  width: 200px;
+  padding: 20px;
+  margin-right: 10px;
+  background-color: #f5f5f5;
+  border-radius: 8px;
+}
+</style>
+```
+
+### 示例 3: 下拉刷新
+
+```vue
+<template>
+  <scroll-view 
+    scroll-y 
+    class="scroll-view"
+    refresher-enabled
+    :refresher-triggered="refreshing"
+    @refresherrefresh="onRefresh"
+    @refresherrestore="onRestore"
+  >
+    <view 
+      v-for="item in list" 
+      :key="item.id"
+      class="list-item"
+    >
+      {{ item.name }}
+    </view>
+  </scroll-view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      refreshing: false,
+      list: Array.from({ length: 20 }, (_, i) => ({
+        id: i + 1,
+        name: `项目 ${i + 1}`
+      }))
+    }
+  },
+  methods: {
+    onRefresh() {
+      this.refreshing = true
+      // 模拟刷新
+      setTimeout(() => {
+        this.list = Array.from({ length: 20 }, (_, i) => ({
+          id: i + 1,
+          name: `新项目 ${i + 1}`
+        }))
+        this.refreshing = false
+        uni.showToast({
+          title: '刷新成功',
+          icon: 'success'
+        })
+      }, 2000)
+    },
+    onRestore() {
+      console.log('刷新恢复')
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 上拉加载
+
+```vue
+<template>
+  <scroll-view 
+    scroll-y 
+    class="scroll-view"
+    @scrolltolower="loadMore"
+    lower-threshold="50"
+  >
+    <view 
+      v-for="item in list" 
+      :key="item.id"
+      class="list-item"
+    >
+      {{ item.name }}
+    </view>
+    <view v-if="loading" class="loading">加载中...</view>
+  </scroll-view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      loading: false,
+      page: 1,
+      list: Array.from({ length: 20 }, (_, i) => ({
+        id: i + 1,
+        name: `项目 ${i + 1}`
+      }))
+    }
+  },
+  methods: {
+    loadMore() {
+      if (this.loading) return
+      this.loading = true
+      // 模拟加载
+      setTimeout(() => {
+        const newList = Array.from({ length: 20 }, (_, i) => ({
+          id: this.list.length + i + 1,
+          name: `项目 ${this.list.length + i + 1}`
+        }))
+        this.list = [...this.list, ...newList]
+        this.page++
+        this.loading = false
+      }, 1000)
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 滚动到指定位置
+
+```vue
+<template>
+  <view class="container">
+    <button @click="scrollToTop">滚动到顶部</button>
+    <button @click="scrollToBottom">滚动到底部</button>
+    <button @click="scrollToIndex(10)">滚动到第10项</button>
+    
+    <scroll-view 
+      scroll-y 
+      class="scroll-view"
+      :scroll-top="scrollTop"
+      scroll-with-animation
+    >
+      <view 
+        v-for="(item, index) in list" 
+        :key="item.id"
+        :id="`item-${index}`"
+        class="list-item"
+      >
+        {{ item.name }}
+      </view>
+    </scroll-view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      scrollTop: 0,
+      list: Array.from({ length: 50 }, (_, i) => ({
+        id: i + 1,
+        name: `项目 ${i + 1}`
+      }))
+    }
+  },
+  methods: {
+    scrollToTop() {
+      this.scrollTop = 0
+    },
+    scrollToBottom() {
+      this.scrollTop = 9999
+    },
+    scrollToIndex(index) {
+      // 假设每项高度为 60px
+      this.scrollTop = index * 60
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| scroll-x | Boolean | false | 允许横向滚动 |
+| scroll-y | Boolean | false | 允许纵向滚动 |
+| scroll-top | Number | - | 设置竖向滚动条位置 |
+| scroll-left | Number | - | 设置横向滚动条位置 |
+| refresher-enabled | Boolean | false | 开启自定义下拉刷新 |
+| refresher-triggered | Boolean | false | 设置当前下拉刷新状态 |
+| lower-threshold | Number | 50 | 距底部/右边多远时触发 scrolltolower 事件 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 使用 `scroll-y` 时必须设置固定高度
+2. 使用 `scroll-x` 时内容需要设置 `white-space: nowrap`
+3. 下拉刷新需要设置 `refresher-enabled` 和 `refresher-triggered`
+4. 上拉加载通过 `@scrolltolower` 事件实现
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/scroll-view.html

.agents/bak-skills/uniappx-project/examples/components/built-in/slider.md

@@ -0,0 +1,262 @@
+# slider 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/slider.html
+
+## 概述
+
+`slider` 是滑动选择器组件，用于选择数值。
+
+## 基础用法
+
+```vue
+<template>
+  <slider :value="50" @change="handleChange" />
+</template>
+
+<script>
+export default {
+  methods: {
+    handleChange(e) {
+      console.log('当前值', e.detail.value)
+    }
+  }
+}
+</script>
+```
+
+## 完整示例
+
+### 示例 1: 基本滑动条
+
+```vue
+<template>
+  <view class="container">
+    <slider :value="value" @change="handleChange" />
+    <text>当前值：{{ value }}</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      value: 50
+    }
+  },
+  methods: {
+    handleChange(e) {
+      this.value = e.detail.value
+    }
+  }
+}
+</script>
+```
+
+### 示例 2: 设置范围
+
+```vue
+<template>
+  <view class="container">
+    <slider 
+      :value="value"
+      min="0"
+      max="100"
+      step="5"
+      @change="handleChange"
+    />
+    <text>当前值：{{ value }}</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      value: 50
+    }
+  },
+  methods: {
+    handleChange(e) {
+      this.value = e.detail.value
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 音量控制
+
+```vue
+<template>
+  <view class="container">
+    <view class="volume-control">
+      <text>音量：{{ volume }}%</text>
+      <slider 
+        :value="volume"
+        min="0"
+        max="100"
+        activeColor="#007aff"
+        backgroundColor="#ebebeb"
+        block-color="#007aff"
+        @change="handleVolumeChange"
+      />
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      volume: 50
+    }
+  },
+  methods: {
+    handleVolumeChange(e) {
+      this.volume = e.detail.value
+      // 可以在这里控制实际音量
+      console.log('音量设置为', this.volume)
+    }
+  }
+}
+</script>
+
+<style>
+.volume-control {
+  padding: 20px;
+}
+</style>
+```
+
+### 示例 4: 亮度控制
+
+```vue
+<template>
+  <view class="container">
+    <view class="brightness-control">
+      <text>亮度：{{ brightness }}%</text>
+      <slider 
+        :value="brightness"
+        min="0"
+        max="100"
+        @change="handleBrightnessChange"
+      />
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      brightness: 50
+    }
+  },
+  methods: {
+    handleBrightnessChange(e) {
+      this.brightness = e.detail.value
+      // 设置屏幕亮度
+      uni.setScreenBrightness({
+        value: this.brightness / 100,
+        success: () => {
+          console.log('亮度已设置')
+        }
+      })
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 价格区间选择
+
+```vue
+<template>
+  <view class="container">
+    <view class="price-range">
+      <text>价格区间：{{ minPrice }} - {{ maxPrice }}</text>
+      <slider 
+        :value="minPrice"
+        min="0"
+        max="1000"
+        step="10"
+        @change="handleMinPriceChange"
+      />
+      <text>最低价格：{{ minPrice }}</text>
+      <slider 
+        :value="maxPrice"
+        min="0"
+        max="1000"
+        step="10"
+        @change="handleMaxPriceChange"
+      />
+      <text>最高价格：{{ maxPrice }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      minPrice: 0,
+      maxPrice: 1000
+    }
+  },
+  methods: {
+    handleMinPriceChange(e) {
+      const value = e.detail.value
+      if (value <= this.maxPrice) {
+        this.minPrice = value
+      }
+    },
+    handleMaxPriceChange(e) {
+      const value = e.detail.value
+      if (value >= this.minPrice) {
+        this.maxPrice = value
+      }
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| min | Number | 0 | 最小值 |
+| max | Number | 100 | 最大值 |
+| step | Number | 1 | 步长，取值必须大于 0，并且可被(max - min)整除 |
+| value | Number | 0 | 当前值 |
+| activeColor | String | #007aff | 已选择的颜色 |
+| backgroundColor | String | #ebebeb | 背景条的颜色 |
+| block-size | Number | 28 | 滑块的大小，取值范围为 12 - 28 |
+| block-color | String | #ffffff | 滑块的颜色 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `value` 必须在 `min` 和 `max` 之间
+2. `step` 必须能被 `(max - min)` 整除
+3. 可以通过 `@change` 事件监听值的变化
+4. 适合用于音量、亮度、价格区间等场景
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/slider.html

.agents/bak-skills/uniappx-project/examples/components/built-in/swiper.md

@@ -0,0 +1,294 @@
+# swiper 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/swiper.html
+
+## 概述
+
+`swiper` 是滑块视图容器组件，常用于轮播图。
+
+## 基础用法
+
+```vue
+<template>
+  <swiper class="swiper">
+    <swiper-item>
+      <view class="swiper-item">1</view>
+    </swiper-item>
+    <swiper-item>
+      <view class="swiper-item">2</view>
+    </swiper-item>
+    <swiper-item>
+      <view class="swiper-item">3</view>
+    </swiper-item>
+  </swiper>
+</template>
+
+<style>
+.swiper {
+  height: 400px;
+}
+.swiper-item {
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+</style>
+```
+
+## 完整示例
+
+### 示例 1: 基础轮播图
+
+```vue
+<template>
+  <swiper 
+    class="swiper"
+    :indicator-dots="true"
+    :autoplay="true"
+    :interval="3000"
+    :duration="500"
+  >
+    <swiper-item v-for="(item, index) in bannerList" :key="index">
+      <image 
+        :src="item.image" 
+        mode="aspectFill"
+        class="swiper-image"
+      ></image>
+    </swiper-item>
+  </swiper>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      bannerList: [
+        { image: 'https://example.com/banner1.jpg' },
+        { image: 'https://example.com/banner2.jpg' },
+        { image: 'https://example.com/banner3.jpg' }
+      ]
+    }
+  }
+}
+</script>
+
+<style>
+.swiper {
+  height: 400px;
+}
+.swiper-image {
+  width: 100%;
+  height: 100%;
+}
+</style>
+```
+
+### 示例 2: 自定义指示点
+
+```vue
+<template>
+  <swiper 
+    class="swiper"
+    :indicator-dots="true"
+    indicator-color="rgba(0, 0, 0, 0.3)"
+    indicator-active-color="#007aff"
+  >
+    <swiper-item v-for="(item, index) in list" :key="index">
+      <view class="swiper-item">{{ item }}</view>
+    </swiper-item>
+  </swiper>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      list: ['页面1', '页面2', '页面3']
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 垂直滑动
+
+```vue
+<template>
+  <swiper 
+    class="swiper-vertical"
+    :vertical="true"
+    :indicator-dots="true"
+  >
+    <swiper-item v-for="(item, index) in list" :key="index">
+      <view class="swiper-item">{{ item }}</view>
+    </swiper-item>
+  </swiper>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      list: ['页面1', '页面2', '页面3']
+    }
+  }
+}
+</script>
+
+<style>
+.swiper-vertical {
+  height: 500px;
+}
+</style>
+```
+
+### 示例 4: 切换事件
+
+```vue
+<template>
+  <view class="container">
+    <swiper 
+      class="swiper"
+      :current="current"
+      @change="handleChange"
+    >
+      <swiper-item v-for="(item, index) in list" :key="index">
+        <view class="swiper-item">{{ item }}</view>
+      </swiper-item>
+    </swiper>
+    <text>当前页：{{ current + 1 }} / {{ list.length }}</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      current: 0,
+      list: ['页面1', '页面2', '页面3']
+    }
+  },
+  methods: {
+    handleChange(e) {
+      this.current = e.detail.current
+      console.log('切换到', this.current + 1, '页')
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 图片轮播
+
+```vue
+<template>
+  <swiper 
+    class="swiper"
+    :indicator-dots="true"
+    :autoplay="true"
+    :interval="3000"
+    :circular="true"
+    @change="handleChange"
+  >
+    <swiper-item 
+      v-for="(item, index) in imageList" 
+      :key="index"
+      @click="handleImageClick(item)"
+    >
+      <image 
+        :src="item.url" 
+        mode="aspectFill"
+        class="swiper-image"
+      ></image>
+      <view class="image-title">{{ item.title }}</view>
+    </swiper-item>
+  </swiper>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      imageList: [
+        { url: 'https://example.com/image1.jpg', title: '标题1' },
+        { url: 'https://example.com/image2.jpg', title: '标题2' },
+        { url: 'https://example.com/image3.jpg', title: '标题3' }
+      ]
+    }
+  },
+  methods: {
+    handleChange(e) {
+      console.log('切换到', e.detail.current)
+    },
+    handleImageClick(item) {
+      uni.previewImage({
+        urls: this.imageList.map(img => img.url),
+        current: item.url
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.swiper {
+  height: 400px;
+  position: relative;
+}
+.swiper-image {
+  width: 100%;
+  height: 100%;
+}
+.image-title {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: linear-gradient(transparent, rgba(0,0,0,0.5));
+  color: white;
+  padding: 20px;
+}
+</style>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| indicator-dots | Boolean | false | 是否显示面板指示点 |
+| indicator-color | String | rgba(0, 0, 0, 0.3) | 指示点颜色 |
+| indicator-active-color | String | #000000 | 当前选中的指示点颜色 |
+| autoplay | Boolean | false | 是否自动切换 |
+| interval | Number | 5000 | 自动切换时间间隔 |
+| duration | Number | 500 | 滑动动画时长 |
+| circular | Boolean | false | 是否采用衔接滑动 |
+| vertical | Boolean | false | 滑动方向是否为纵向 |
+| current | Number | 0 | 当前所在滑块的 index |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 必须设置固定高度才能正常显示
+2. `swiper-item` 内只能放置一个根元素
+3. `circular` 设置为 true 时可以实现循环轮播
+4. 图片轮播建议使用 `mode="aspectFill"` 保持比例
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/swiper.html

.agents/bak-skills/uniappx-project/examples/components/built-in/switch.md

@@ -0,0 +1,277 @@
+# switch 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/switch.html
+
+## 概述
+
+`switch` 是开关选择器组件，用于两种状态的切换。
+
+## 基础用法
+
+```vue
+<template>
+  <switch :checked="isChecked" @change="handleChange" />
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      isChecked: false
+    }
+  },
+  methods: {
+    handleChange(e) {
+      this.isChecked = e.detail.value
+    }
+  }
+}
+</script>
+```
+
+## 完整示例
+
+### 示例 1: 基本开关
+
+```vue
+<template>
+  <view class="container">
+    <view class="switch-item">
+      <text>通知开关</text>
+      <switch :checked="notifyEnabled" @change="handleNotifyChange" />
+    </view>
+    <view class="switch-item">
+      <text>声音开关</text>
+      <switch :checked="soundEnabled" @change="handleSoundChange" />
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      notifyEnabled: true,
+      soundEnabled: false
+    }
+  },
+  methods: {
+    handleNotifyChange(e) {
+      this.notifyEnabled = e.detail.value
+      console.log('通知开关', this.notifyEnabled)
+    },
+    handleSoundChange(e) {
+      this.soundEnabled = e.detail.value
+      console.log('声音开关', this.soundEnabled)
+    }
+  }
+}
+</script>
+
+<style>
+.switch-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+</style>
+```
+
+### 示例 2: 自定义颜色
+
+```vue
+<template>
+  <view class="container">
+    <view class="switch-item">
+      <text>默认颜色</text>
+      <switch :checked="checked1" @change="checked1 = $event.detail.value" />
+    </view>
+    <view class="switch-item">
+      <text>自定义颜色</text>
+      <switch 
+        :checked="checked2" 
+        color="#ff3b30"
+        @change="checked2 = $event.detail.value" 
+      />
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      checked1: false,
+      checked2: false
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 禁用状态
+
+```vue
+<template>
+  <view class="container">
+    <view class="switch-item">
+      <text>可用开关</text>
+      <switch :checked="checked" @change="handleChange" />
+    </view>
+    <view class="switch-item">
+      <text>禁用开关</text>
+      <switch :checked="checked" disabled />
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      checked: false
+    }
+  },
+  methods: {
+    handleChange(e) {
+      this.checked = e.detail.value
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 设置项列表
+
+```vue
+<template>
+  <view class="container">
+    <view 
+      v-for="item in settings" 
+      :key="item.key"
+      class="setting-item"
+    >
+      <view class="setting-info">
+        <text class="setting-title">{{ item.title }}</text>
+        <text class="setting-desc">{{ item.desc }}</text>
+      </view>
+      <switch 
+        :checked="item.value" 
+        @change="handleSettingChange(item.key, $event.detail.value)"
+      />
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      settings: [
+        {
+          key: 'notify',
+          title: '消息通知',
+          desc: '接收新消息通知',
+          value: true
+        },
+        {
+          key: 'sound',
+          title: '声音提醒',
+          desc: '收到消息时播放声音',
+          value: false
+        },
+        {
+          key: 'vibrate',
+          title: '震动提醒',
+          desc: '收到消息时震动',
+          value: true
+        }
+      ]
+    }
+  },
+  methods: {
+    handleSettingChange(key, value) {
+      const item = this.settings.find(s => s.key === key)
+      if (item) {
+        item.value = value
+        // 保存设置
+        uni.setStorageSync(`setting_${key}`, value)
+        console.log(`设置 ${key} 已更新为`, value)
+      }
+    }
+  },
+  onLoad() {
+    // 加载保存的设置
+    this.settings.forEach(item => {
+      const saved = uni.getStorageSync(`setting_${item.key}`)
+      if (saved !== '') {
+        item.value = saved
+      }
+    })
+  }
+}
+</script>
+
+<style>
+.setting-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px;
+  border-bottom: 1px solid #eee;
+}
+.setting-info {
+  flex: 1;
+  margin-right: 20px;
+}
+.setting-title {
+  display: block;
+  font-size: 32rpx;
+  color: #333;
+  margin-bottom: 10rpx;
+}
+.setting-desc {
+  display: block;
+  font-size: 24rpx;
+  color: #999;
+}
+</style>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| checked | Boolean | false | 是否选中 |
+| disabled | Boolean | false | 是否禁用 |
+| type | String | switch | 样式类型，可选值：switch、checkbox |
+| color | String | #007aff | switch 的颜色 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `checked` 属性控制开关状态
+2. `@change` 事件返回 `e.detail.value` 为布尔值
+3. 可以通过 `color` 自定义开关颜色
+4. `disabled` 为 true 时开关不可操作
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/switch.html

.agents/bak-skills/uniappx-project/examples/components/built-in/text.md

@@ -0,0 +1,151 @@
+# text 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/text.html
+
+## 概述
+
+`text` 是文本组件，用于显示文本内容。
+
+## 基础用法
+
+```vue
+<template>
+  <text>这是一段文本</text>
+</template>
+```
+
+## 完整示例
+
+### 示例 1: 基本文本
+
+```vue
+<template>
+  <view class="container">
+    <text>普通文本</text>
+    <text class="bold-text">加粗文本</text>
+    <text class="colored-text">彩色文本</text>
+  </view>
+</template>
+
+<style>
+.bold-text {
+  font-weight: bold;
+}
+.colored-text {
+  color: #007aff;
+}
+</style>
+```
+
+### 示例 2: 文本嵌套
+
+```vue
+<template>
+  <view class="container">
+    <text>
+      这是一段
+      <text class="highlight">高亮</text>
+      文本
+    </text>
+  </view>
+</template>
+
+<style>
+.highlight {
+  color: #ff3b30;
+  font-weight: bold;
+}
+</style>
+```
+
+### 示例 3: 文本选择
+
+```vue
+<template>
+  <view class="container">
+    <text selectable>这段文本可以选择</text>
+    <text :selectable="false">这段文本不可选择</text>
+  </view>
+</template>
+```
+
+### 示例 4: 文本换行
+
+```vue
+<template>
+  <view class="container">
+    <text class="text-wrap">
+      这是一段很长的文本，会自动换行显示。这是一段很长的文本，会自动换行显示。
+    </text>
+  </view>
+</template>
+
+<style>
+.text-wrap {
+  width: 300px;
+  word-wrap: break-word;
+}
+</style>
+```
+
+### 示例 5: 文本样式
+
+```vue
+<template>
+  <view class="container">
+    <text class="text-style">样式文本</text>
+    <text class="text-decoration">装饰文本</text>
+    <text class="text-shadow">阴影文本</text>
+  </view>
+</template>
+
+<style>
+.text-style {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+}
+.text-decoration {
+  text-decoration: underline;
+  color: #007aff;
+}
+.text-shadow {
+  text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
+}
+</style>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| selectable | Boolean | false | 文本是否可选 |
+| user-select | Boolean | false | 文本是否可选（H5） |
+| space | String | - | 显示连续空格 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `text` 组件内只能嵌套 `text` 组件
+2. `selectable` 属性用于控制文本是否可选择
+3. 文本样式通过 CSS 控制
+4. 建议使用 `text` 组件而不是直接在 `view` 中写文本
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/text.html

.agents/bak-skills/uniappx-project/examples/components/built-in/textarea.md

@@ -0,0 +1,261 @@
+# textarea 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/textarea.html
+
+## 概述
+
+`textarea` 是多行输入框组件，用于输入多行文本。
+
+## 基础用法
+
+```vue
+<template>
+  <textarea v-model="content" placeholder="请输入内容"></textarea>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      content: ''
+    }
+  }
+}
+</script>
+```
+
+## 完整示例
+
+### 示例 1: 基本多行输入
+
+```vue
+<template>
+  <view class="container">
+    <textarea 
+      v-model="content"
+      placeholder="请输入内容"
+      @input="handleInput"
+    ></textarea>
+    <text>已输入：{{ content.length }} 字</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      content: ''
+    }
+  },
+  methods: {
+    handleInput(e) {
+      this.content = e.detail.value
+    }
+  }
+}
+</script>
+```
+
+### 示例 2: 限制输入长度
+
+```vue
+<template>
+  <view class="container">
+    <textarea 
+      v-model="content"
+      placeholder="最多输入200字"
+      maxlength="200"
+      @input="handleInput"
+    ></textarea>
+    <text class="count">{{ content.length }}/200</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      content: ''
+    }
+  },
+  methods: {
+    handleInput(e) {
+      this.content = e.detail.value
+    }
+  }
+}
+</script>
+
+<style>
+.count {
+  color: #999;
+  font-size: 24rpx;
+  text-align: right;
+}
+</style>
+```
+
+### 示例 3: 自动调整高度
+
+```vue
+<template>
+  <view class="container">
+    <textarea 
+      v-model="content"
+      placeholder="输入内容会自动调整高度"
+      :auto-height="true"
+      :min-height="100"
+    ></textarea>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      content: ''
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 固定高度
+
+```vue
+<template>
+  <view class="container">
+    <textarea 
+      v-model="content"
+      placeholder="固定高度输入框"
+      :show-confirm-bar="true"
+      confirm-type="done"
+      @confirm="handleConfirm"
+    ></textarea>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      content: ''
+    }
+  },
+  methods: {
+    handleConfirm(e) {
+      console.log('确认输入', e.detail.value)
+    }
+  }
+}
+</script>
+
+<style>
+textarea {
+  width: 100%;
+  height: 200px;
+}
+</style>
+```
+
+### 示例 5: 表单验证
+
+```vue
+<template>
+  <view class="container">
+    <textarea 
+      v-model="content"
+      placeholder="请输入反馈内容"
+      maxlength="500"
+      @blur="validateContent"
+    ></textarea>
+    <text v-if="error" class="error">{{ error }}</text>
+    <text class="count">{{ content.length }}/500</text>
+    <button @click="submit">提交</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      content: '',
+      error: ''
+    }
+  },
+  methods: {
+    validateContent() {
+      if (this.content.length < 10) {
+        this.error = '内容至少需要10个字符'
+      } else {
+        this.error = ''
+      }
+    },
+    submit() {
+      this.validateContent()
+      if (!this.error && this.content) {
+        uni.showToast({
+          title: '提交成功',
+          icon: 'success'
+        })
+      }
+    }
+  }
+}
+</script>
+
+<style>
+.error {
+  color: #ff3b30;
+  font-size: 24rpx;
+  margin-top: 10rpx;
+}
+.count {
+  color: #999;
+  font-size: 24rpx;
+  text-align: right;
+}
+</style>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| value | String | - | 输入框的内容 |
+| placeholder | String | - | 输入框为空时占位符 |
+| placeholder-style | String | - | 指定 placeholder 的样式 |
+| disabled | Boolean | false | 是否禁用 |
+| maxlength | Number | 140 | 最大输入长度，-1 表示不限制 |
+| auto-focus | Boolean | false | 是否自动聚焦 |
+| focus | Boolean | false | 获取焦点 |
+| auto-height | Boolean | false | 是否自动增高 |
+| fixed | Boolean | false | 如果 textarea 是在一个 position:fixed 的区域，需要显示指定属性 fixed 为 true |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `v-model` 是双向绑定的推荐方式
+2. `maxlength` 设置为 -1 时不限制最大长度
+3. `auto-height` 可以让输入框随内容自动调整高度
+4. 建议使用 `@input` 事件监听输入变化
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/textarea.html
+- **单行输入**: https://doc.dcloud.net.cn/uni-app-x/component/input.html

.agents/bak-skills/uniappx-project/examples/components/built-in/video.md

@@ -0,0 +1,291 @@
+# video 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/video.html
+
+## 概述
+
+`video` 是视频播放组件，用于播放视频内容。
+
+## 基础用法
+
+```vue
+<template>
+  <video 
+    src="https://example.com/video.mp4"
+    controls
+  ></video>
+</template>
+```
+
+## 完整示例
+
+### 示例 1: 基本视频播放
+
+```vue
+<template>
+  <view class="container">
+    <video 
+      :src="videoSrc"
+      controls
+      class="video-player"
+    ></video>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      videoSrc: 'https://example.com/video.mp4'
+    }
+  }
+}
+</script>
+
+<style>
+.video-player {
+  width: 100%;
+  height: 400px;
+}
+</style>
+```
+
+### 示例 2: 视频播放控制
+
+```vue
+<template>
+  <view class="container">
+    <video 
+      :src="videoSrc"
+      :controls="showControls"
+      :autoplay="autoplay"
+      :loop="loop"
+      :muted="muted"
+      :poster="poster"
+      @play="handlePlay"
+      @pause="handlePause"
+      @ended="handleEnded"
+      class="video-player"
+    ></video>
+    <view class="controls">
+      <button @click="togglePlay">{{ isPlaying ? '暂停' : '播放' }}</button>
+      <button @click="toggleMute">{{ muted ? '取消静音' : '静音' }}</button>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      videoSrc: 'https://example.com/video.mp4',
+      showControls: true,
+      autoplay: false,
+      loop: false,
+      muted: false,
+      poster: 'https://example.com/poster.jpg',
+      isPlaying: false
+    }
+  },
+  methods: {
+    handlePlay() {
+      this.isPlaying = true
+      console.log('视频开始播放')
+    },
+    handlePause() {
+      this.isPlaying = false
+      console.log('视频暂停')
+    },
+    handleEnded() {
+      this.isPlaying = false
+      console.log('视频播放结束')
+    },
+    togglePlay() {
+      // 需要通过 ref 调用视频组件的方法
+      this.$refs.video.play()
+    },
+    toggleMute() {
+      this.muted = !this.muted
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 视频列表
+
+```vue
+<template>
+  <view class="container">
+    <view 
+      v-for="(item, index) in videoList" 
+      :key="index"
+      class="video-item"
+    >
+      <video 
+        :src="item.src"
+        :poster="item.poster"
+        controls
+        class="video-player"
+        @play="handleVideoPlay(index)"
+      ></video>
+      <text class="video-title">{{ item.title }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      videoList: [
+        {
+          src: 'https://example.com/video1.mp4',
+          poster: 'https://example.com/poster1.jpg',
+          title: '视频1'
+        },
+        {
+          src: 'https://example.com/video2.mp4',
+          poster: 'https://example.com/poster2.jpg',
+          title: '视频2'
+        }
+      ]
+    }
+  },
+  methods: {
+    handleVideoPlay(index) {
+      console.log('播放视频', index)
+    }
+  }
+}
+</script>
+
+<style>
+.video-item {
+  margin-bottom: 20px;
+}
+.video-player {
+  width: 100%;
+  height: 400px;
+}
+.video-title {
+  display: block;
+  padding: 10px;
+  font-size: 32rpx;
+}
+</style>
+```
+
+### 示例 4: 全屏播放
+
+```vue
+<template>
+  <view class="container">
+    <video 
+      :src="videoSrc"
+      controls
+      :show-fullscreen-btn="true"
+      :enable-play-gesture="true"
+      @fullscreenchange="handleFullscreenChange"
+      class="video-player"
+    ></video>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      videoSrc: 'https://example.com/video.mp4',
+      isFullscreen: false
+    }
+  },
+  methods: {
+    handleFullscreenChange(e) {
+      this.isFullscreen = e.detail.fullScreen
+      console.log('全屏状态', this.isFullscreen)
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 视频弹幕
+
+```vue
+<template>
+  <view class="container">
+    <video 
+      :src="videoSrc"
+      :danmu-list="danmuList"
+      :enable-danmu="true"
+      :danmu-btn="true"
+      controls
+      class="video-player"
+    ></video>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      videoSrc: 'https://example.com/video.mp4',
+      danmuList: [
+        {
+          text: '第一条弹幕',
+          color: '#ff0000',
+          time: 1
+        },
+        {
+          text: '第二条弹幕',
+          color: '#00ff00',
+          time: 3
+        }
+      ]
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| src | String | - | 要播放视频的资源地址 |
+| controls | Boolean | true | 是否显示默认播放控件 |
+| autoplay | Boolean | false | 是否自动播放 |
+| loop | Boolean | false | 是否循环播放 |
+| muted | Boolean | false | 是否静音播放 |
+| poster | String | - | 视频封面的图片网络资源地址 |
+| show-fullscreen-btn | Boolean | true | 是否显示全屏按钮 |
+| enable-play-gesture | Boolean | false | 是否开启播放手势 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. 视频地址需要配置合法域名
+2. `autoplay` 在某些平台可能不生效
+3. 建议设置 `poster` 作为视频封面
+4. 可以通过事件监听播放状态
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/video.html
+- **选择视频**: https://doc.dcloud.net.cn/uni-app-x/api/media/video.html#choosevideo

.agents/bak-skills/uniappx-project/examples/components/built-in/view.md

@@ -0,0 +1,407 @@
+# view 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/view.html
+
+## 概述
+
+`view` 是视图容器组件，类似于 HTML 中的 `div`，用于包裹各种元素内容。
+
+## 基础用法
+
+### 基本视图容器
+
+```vue
+<template>
+  <view class="container">
+    <text>这是内容</text>
+  </view>
+</template>
+
+<style>
+.container {
+  padding: 20px;
+  background-color: #f5f5f5;
+}
+</style>
+```
+
+## 完整示例
+
+### 示例 1: Flex 布局 - 横向布局
+
+```vue
+<template>
+  <view class="uni-padding-wrap uni-common-mt">
+    <view class="uni-title uni-common-mt">
+      flex-direction: row
+      <text>\n横向布局</text>
+    </view>
+    <view class="uni-flex uni-row">
+      <view class="flex-item uni-bg-red">A</view>
+      <view class="flex-item uni-bg-green">B</view>
+      <view class="flex-item uni-bg-blue">C</view>
+    </view>
+  </view>
+</template>
+
+<style>
+.uni-flex {
+  display: flex;
+}
+.uni-row {
+  flex-direction: row;
+}
+.flex-item {
+  flex: 1;
+  height: 100px;
+  text-align: center;
+  line-height: 100px;
+}
+.uni-bg-red {
+  background-color: #ff3b30;
+}
+.uni-bg-green {
+  background-color: #4cd964;
+}
+.uni-bg-blue {
+  background-color: #007aff;
+}
+</style>
+```
+
+### 示例 2: Flex 布局 - 纵向布局
+
+```vue
+<template>
+  <view class="uni-padding-wrap uni-common-mt">
+    <view class="uni-title uni-common-mt">
+      flex-direction: column
+      <text>\n纵向布局</text>
+    </view>
+    <view class="uni-flex uni-column">
+      <view class="flex-item flex-item-V uni-bg-red">A</view>
+      <view class="flex-item flex-item-V uni-bg-green">B</view>
+      <view class="flex-item flex-item-V uni-bg-blue">C</view>
+    </view>
+  </view>
+</template>
+
+<style>
+.uni-flex {
+  display: flex;
+}
+.uni-column {
+  flex-direction: column;
+}
+.flex-item-V {
+  width: 100%;
+  height: 100px;
+  text-align: center;
+  line-height: 100px;
+}
+</style>
+```
+
+### 示例 3: 点击态效果
+
+```vue
+<template>
+  <view class="container">
+    <view 
+      class="clickable-item"
+      hover-class="hover"
+      hover-start-time="50"
+      hover-stay-time="400"
+      @click="handleClick"
+    >
+      点击我
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    handleClick() {
+      uni.showToast({
+        title: '被点击了',
+        icon: 'success'
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.clickable-item {
+  padding: 20px;
+  background-color: #007aff;
+  color: white;
+  text-align: center;
+  border-radius: 8px;
+}
+.hover {
+  background-color: #0051d5;
+  opacity: 0.8;
+}
+</style>
+```
+
+### 示例 4: 阻止点击态冒泡
+
+```vue
+<template>
+  <view class="container" hover-class="container-hover">
+    <view 
+      class="inner-item"
+      hover-class="inner-hover"
+      hover-stop-propagation="true"
+      @click="handleInnerClick"
+    >
+      内部元素（阻止冒泡）
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    handleInnerClick() {
+      console.log('内部元素被点击')
+    }
+  }
+}
+</script>
+
+<style>
+.container {
+  padding: 40px;
+  background-color: #f5f5f5;
+}
+.container-hover {
+  background-color: #e0e0e0;
+}
+.inner-item {
+  padding: 20px;
+  background-color: #007aff;
+  color: white;
+  text-align: center;
+  border-radius: 8px;
+}
+.inner-hover {
+  background-color: #0051d5;
+}
+</style>
+```
+
+### 示例 5: 嵌套视图
+
+```vue
+<template>
+  <view class="page">
+    <view class="header">
+      <text class="title">页面标题</text>
+    </view>
+    <view class="content">
+      <view class="section">
+        <text class="section-title">第一部分</text>
+        <view class="section-content">
+          <text>这是第一部分的内容</text>
+        </view>
+      </view>
+      <view class="section">
+        <text class="section-title">第二部分</text>
+        <view class="section-content">
+          <text>这是第二部分的内容</text>
+        </view>
+      </view>
+    </view>
+    <view class="footer">
+      <text>页脚</text>
+    </view>
+  </view>
+</template>
+
+<style>
+.page {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+}
+.header {
+  padding: 20px;
+  background-color: #007aff;
+  color: white;
+}
+.title {
+  font-size: 18px;
+  font-weight: bold;
+}
+.content {
+  flex: 1;
+  padding: 20px;
+}
+.section {
+  margin-bottom: 20px;
+  padding: 15px;
+  background-color: #f5f5f5;
+  border-radius: 8px;
+}
+.section-title {
+  font-size: 16px;
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+.section-content {
+  padding: 10px;
+  background-color: white;
+  border-radius: 4px;
+}
+.footer {
+  padding: 20px;
+  background-color: #f5f5f5;
+  text-align: center;
+}
+</style>
+```
+
+### 示例 6: 条件渲染
+
+```vue
+<template>
+  <view class="container">
+    <view v-if="showContent" class="content">
+      <text>这是显示的内容</text>
+    </view>
+    <view v-else class="empty">
+      <text>暂无内容</text>
+    </view>
+    <button @click="toggleContent">切换显示</button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      showContent: true
+    }
+  },
+  methods: {
+    toggleContent() {
+      this.showContent = !this.showContent
+    }
+  }
+}
+</script>
+
+<style>
+.container {
+  padding: 20px;
+}
+.content {
+  padding: 20px;
+  background-color: #4cd964;
+  color: white;
+  border-radius: 8px;
+  margin-bottom: 20px;
+}
+.empty {
+  padding: 20px;
+  background-color: #f5f5f5;
+  color: #999;
+  border-radius: 8px;
+  margin-bottom: 20px;
+  text-align: center;
+}
+</style>
+```
+
+### 示例 7: 列表渲染
+
+```vue
+<template>
+  <view class="container">
+    <view 
+      v-for="(item, index) in list" 
+      :key="index"
+      class="list-item"
+      @click="handleItemClick(item)"
+    >
+      <text>{{ item.name }}</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      list: [
+        { id: 1, name: '项目 1' },
+        { id: 2, name: '项目 2' },
+        { id: 3, name: '项目 3' }
+      ]
+    }
+  },
+  methods: {
+    handleItemClick(item) {
+      uni.showToast({
+        title: `点击了 ${item.name}`,
+        icon: 'none'
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.container {
+  padding: 20px;
+}
+.list-item {
+  padding: 15px;
+  margin-bottom: 10px;
+  background-color: #f5f5f5;
+  border-radius: 8px;
+}
+</style>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| hover-class | String | none | 指定按下去的样式类 |
+| hover-stop-propagation | Boolean | false | 指定是否阻止本节点的祖先节点出现点击态 |
+| hover-start-time | Number | 50 | 按住后多久出现点击态，单位毫秒 |
+| hover-stay-time | Number | 400 | 手指松开后点击态保留时间，单位毫秒 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `view` 组件本身不显示任何可视化元素，主要用于包裹其他组件
+2. 可以使用 CSS 样式控制 `view` 的显示效果
+3. 支持 Flex 布局，常用于页面布局
+4. `hover-class` 属性用于设置点击态效果
+5. `hover-stop-propagation` 在某些平台可能不支持
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/view.html
+- **Flex 布局**: https://uniapp.dcloud.net.cn/tutorial/css-flex.html

.agents/bak-skills/uniappx-project/examples/components/built-in/web-view.md

@@ -0,0 +1,196 @@
+# web-view 组件示例
+
+## 官方文档
+
+参考官方文档：https://doc.dcloud.net.cn/uni-app-x/component/web-view.html
+
+## 概述
+
+`web-view` 是网页视图组件，用于在页面中嵌入网页。
+
+## 基础用法
+
+```vue
+<template>
+  <web-view src="https://example.com"></web-view>
+</template>
+```
+
+## 完整示例
+
+### 示例 1: 基本网页显示
+
+```vue
+<template>
+  <view class="container">
+    <web-view :src="webUrl"></web-view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      webUrl: 'https://example.com'
+    }
+  }
+}
+</script>
+
+<style>
+.container {
+  width: 100%;
+  height: 100vh;
+}
+</style>
+```
+
+### 示例 2: 动态加载网页
+
+```vue
+<template>
+  <view class="container">
+    <input v-model="url" placeholder="输入网址" />
+    <button @click="loadUrl">加载网页</button>
+    <web-view v-if="webUrl" :src="webUrl"></web-view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      url: '',
+      webUrl: ''
+    }
+  },
+  methods: {
+    loadUrl() {
+      if (this.url) {
+        // 确保 URL 以 http:// 或 https:// 开头
+        if (!this.url.startsWith('http://') && !this.url.startsWith('https://')) {
+          this.webUrl = 'https://' + this.url
+        } else {
+          this.webUrl = this.url
+        }
+      }
+    }
+  }
+}
+</script>
+```
+
+### 示例 3: 从参数加载网页
+
+```vue
+<template>
+  <view class="container">
+    <web-view :src="webUrl"></web-view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      webUrl: ''
+    }
+  },
+  onLoad(options) {
+    if (options.url) {
+      this.webUrl = decodeURIComponent(options.url)
+    } else {
+      this.webUrl = 'https://example.com'
+    }
+  }
+}
+</script>
+```
+
+### 示例 4: 网页与小程序通信
+
+```vue
+<template>
+  <view class="container">
+    <web-view :src="webUrl" @message="handleMessage"></web-view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      webUrl: 'https://example.com'
+    }
+  },
+  methods: {
+    handleMessage(e) {
+      console.log('收到网页消息', e.detail.data)
+      // 处理来自网页的消息
+      const data = e.detail.data[0]
+      if (data && data.type === 'close') {
+        uni.navigateBack()
+      }
+    }
+  }
+}
+</script>
+```
+
+### 示例 5: 加载本地 HTML
+
+```vue
+<template>
+  <view class="container">
+    <web-view :src="localHtmlUrl"></web-view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      localHtmlUrl: '/static/webview.html'
+    }
+  }
+}
+</script>
+```
+
+## 属性说明
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| src | String | - | webview 指向网页的链接 |
+
+## 事件说明
+
+| 事件名 | 说明 | 返回值 |
+|--------|------|--------|
+| @message | 网页向小程序 postMessage 时触发 | e.detail.data 包含网页传递的数据 |
+
+## 平台兼容性
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+## 注意事项
+
+1. `src` 必须是 HTTPS 协议（H5 除外）
+2. 需要在 `manifest.json` 中配置业务域名
+3. 网页可以通过 `wx.miniProgram.postMessage` 向小程序发送消息
+4. 建议使用全屏显示 web-view
+
+## 参考资源
+
+- **官方文档**: https://doc.dcloud.net.cn/uni-app-x/component/web-view.html
+- **配置业务域名**: https://uniapp.dcloud.net.cn/tutorial/app-webview.html

.agents/bak-skills/uniappx-project/references/api/README.md

@@ -0,0 +1,174 @@
+# UniApp API 参考文档
+
+本文档提供 uni-app 所有 API 的完整参考信息。
+
+## API 分类索引
+
+### 1. 网络请求（Network）
+
+- [uni.request](./network.md#uni-request) - 发起网络请求
+- [uni.uploadFile](./network.md#uni-uploadfile) - 上传文件
+- [uni.downloadFile](./network.md#uni-downloadfile) - 下载文件
+- [uni.connectSocket](./network.md#uni-connectsocket) - 创建 WebSocket 连接
+- [uni.onSocketOpen](./network.md#uni-onsocketopen) - 监听 WebSocket 连接打开事件
+- [uni.onSocketError](./network.md#uni-onsocketerror) - 监听 WebSocket 错误事件
+- [uni.sendSocketMessage](./network.md#uni-sendsocketmessage) - 通过 WebSocket 发送数据
+- [uni.onSocketMessage](./network.md#uni-onsocketmessage) - 监听 WebSocket 接受到服务器的消息事件
+- [uni.closeSocket](./network.md#uni-closesocket) - 关闭 WebSocket 连接
+- [uni.onSocketClose](./network.md#uni-onsocketclose) - 监听 WebSocket 连接关闭事件
+
+### 2. 数据存储（Storage）
+
+- [uni.setStorage](./storage.md#uni-setstorage) - 将数据存储在本地缓存中指定的 key 中
+- [uni.setStorageSync](./storage.md#uni-setstoragesync) - 同步将数据存储在本地缓存中指定的 key 中
+- [uni.getStorage](./storage.md#uni-getstorage) - 从本地缓存中异步获取指定 key 的内容
+- [uni.getStorageSync](./storage.md#uni-getstoragesync) - 从本地缓存中同步获取指定 key 的内容
+- [uni.getStorageInfo](./storage.md#uni-getstorageinfo) - 异步获取当前 storage 的相关信息
+- [uni.getStorageInfoSync](./storage.md#uni-getstorageinfosync) - 同步获取当前 storage 的相关信息
+- [uni.removeStorage](./storage.md#uni-removestorage) - 从本地缓存中异步移除指定 key
+- [uni.removeStorageSync](./storage.md#uni-removestoragesync) - 从本地缓存中同步移除指定 key
+- [uni.clearStorage](./storage.md#uni-clearstorage) - 清理本地数据缓存
+- [uni.clearStorageSync](./storage.md#uni-clearstoragesync) - 同步清理本地数据缓存
+
+### 3. 设备信息（Device）
+
+- [uni.getSystemInfo](./device.md#uni-getsysteminfo) - 获取系统信息
+- [uni.getSystemInfoSync](./device.md#uni-getsysteminfosync) - 同步获取系统信息
+- [uni.getNetworkType](./device.md#uni-getnetworktype) - 获取网络类型
+- [uni.onNetworkStatusChange](./device.md#uni-onnetworkstatuschange) - 监听网络状态变化
+- [uni.getBatteryInfo](./device.md#uni-getbatteryinfo) - 获取设备电量信息
+- [uni.getBatteryInfoSync](./device.md#uni-getbatteryinfosync) - 同步获取设备电量信息
+- [uni.setScreenBrightness](./device.md#uni-setscreenbrightness) - 设置屏幕亮度
+- [uni.getScreenBrightness](./device.md#uni-getscreenbrightness) - 获取屏幕亮度
+- [uni.setKeepScreenOn](./device.md#uni-setkeepscreenon) - 设置是否保持屏幕常亮
+
+### 4. 界面交互（UI）
+
+- [uni.showToast](./ui.md#uni-showtoast) - 显示消息提示框
+- [uni.showLoading](./ui.md#uni-showloading) - 显示加载提示框
+- [uni.hideToast](./ui.md#uni-hidetoast) - 隐藏消息提示框
+- [uni.hideLoading](./ui.md#uni-hideloading) - 隐藏加载提示框
+- [uni.showModal](./ui.md#uni-showmodal) - 显示模态弹窗
+- [uni.showActionSheet](./ui.md#uni-showactionsheet) - 显示操作菜单
+- [uni.setNavigationBarTitle](./ui.md#uni-setnavigationbartitle) - 设置当前页面标题
+- [uni.setNavigationBarColor](./ui.md#uni-setnavigationbarcolor) - 设置页面导航栏颜色
+- [uni.showNavigationBarLoading](./ui.md#uni-shownavigationbarloading) - 显示导航栏加载动画
+- [uni.hideNavigationBarLoading](./ui.md#uni-hidenavigationbarloading) - 隐藏导航栏加载动画
+- [uni.setTabBarBadge](./ui.md#uni-settabbarbadge) - 为 tabBar 某一项的右上角添加文本
+- [uni.removeTabBarBadge](./ui.md#uni-removetabbarbadge) - 移除 tabBar 某一项右上角的文本
+- [uni.showTabBarRedDot](./ui.md#uni-showtabbarreddot) - 显示 tabBar 某一项的右上角的红点
+- [uni.hideTabBarRedDot](./ui.md#uni-hidetabbarreddot) - 隐藏 tabBar 某一项的右上角的红点
+- [uni.setTabBarStyle](./ui.md#uni-settabbarstyle) - 动态设置 tabBar 的整体样式
+- [uni.setTabBarItem](./ui.md#uni-settabbaritem) - 动态设置 tabBar 某一项的内容
+
+### 5. 位置服务（Location）
+
+- [uni.getLocation](./location.md#uni-getlocation) - 获取当前地理位置
+- [uni.openLocation](./location.md#uni-openlocation) - 使用微信内置地图查看位置
+- [uni.chooseLocation](./location.md#uni-chooselocation) - 打开地图选择位置
+
+### 6. 媒体处理（Media）
+
+- [uni.chooseImage](./media.md#uni-chooseimage) - 从本地相册选择图片或使用相机拍照
+- [uni.previewImage](./media.md#uni-previewimage) - 预览图片
+- [uni.getImageInfo](./media.md#uni-getimageinfo) - 获取图片信息
+- [uni.saveImageToPhotosAlbum](./media.md#uni-saveimagetophotosalbum) - 保存图片到系统相册
+- [uni.chooseVideo](./media.md#uni-choosevideo) - 从本地相册选择视频或使用相机拍摄视频
+- [uni.saveVideoToPhotosAlbum](./media.md#uni-savevideotophotosalbum) - 保存视频到系统相册
+- [uni.chooseMedia](./media.md#uni-choosemedia) - 拍摄或从手机相册中选择图片或视频
+- [uni.chooseFile](./media.md#uni-choosefile) - 从本地选择文件
+
+### 7. 页面路由（Navigation）
+
+- [uni.navigateTo](./navigation.md#uni-navigateto) - 保留当前页面，跳转到应用内的某个页面
+- [uni.redirectTo](./navigation.md#uni-redirectto) - 关闭当前页面，跳转到应用内的某个页面
+- [uni.reLaunch](./navigation.md#uni-relaunch) - 关闭所有页面，打开到应用内的某个页面
+- [uni.switchTab](./navigation.md#uni-switchtab) - 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面
+- [uni.navigateBack](./navigation.md#uni-navigateback) - 关闭当前页面，返回上一页面或多级页面
+
+### 8. 文件操作（File）
+
+- [uni.saveFile](./file.md#uni-savefile) - 保存文件到本地
+- [uni.getFileInfo](./file.md#uni-getfileinfo) - 获取文件信息
+- [uni.getSavedFileList](./file.md#uni-getsavedfilelist) - 获取已保存的文件列表
+- [uni.getSavedFileInfo](./file.md#uni-getsavedfileinfo) - 获取已保存的文件信息
+- [uni.removeSavedFile](./file.md#uni-removesavedfile) - 删除已保存的文件
+
+### 9. 支付（Payment）
+
+- [uni.requestPayment](./payment.md#uni-requestpayment) - 发起支付
+
+### 10. 分享（Share）
+
+- [uni.share](./share.md#uni-share) - 分享内容
+
+### 11. 其他 API（Other）
+
+- [uni.canIUse](./other.md#uni-caniuse) - 判断应用的版本是否支持某个 API
+- [uni.getProvider](./other.md#uni-getprovider) - 获取服务供应商
+- [uni.login](./other.md#uni-login) - 登录
+- [uni.getUserInfo](./other.md#uni-getuserinfo) - 获取用户信息
+- [uni.checkSession](./other.md#uni-checksession) - 检查登录状态是否过期
+- [uni.authorize](./other.md#uni-authorize) - 提前向用户发起授权请求
+- [uni.openSetting](./other.md#uni-opensetting) - 调起客户端小程序设置页面
+- [uni.getSetting](./other.md#uni-getsetting) - 获取用户的当前设置
+
+## API 调用规范
+
+### 回调函数
+
+uni-app API 支持两种调用方式：
+
+1. **回调函数方式**：
+```javascript
+uni.request({
+  url: 'https://api.example.com/data',
+  success: (res) => {
+    console.log(res.data)
+  },
+  fail: (err) => {
+    console.error(err)
+  }
+})
+```
+
+2. **Promise 方式**（部分 API 支持）：
+```javascript
+uni.request({
+  url: 'https://api.example.com/data'
+}).then(res => {
+  console.log(res.data)
+}).catch(err => {
+  console.error(err)
+})
+```
+
+### 同步 API
+
+部分 API 提供同步版本（以 Sync 结尾），如：
+- `uni.getStorageSync()` - 同步获取存储
+- `uni.setStorageSync()` - 同步设置存储
+- `uni.getSystemInfoSync()` - 同步获取系统信息
+
+### 平台兼容性
+
+每个 API 的详细平台支持情况见对应 API 的文档。使用前请检查平台兼容性，必要时使用条件编译：
+
+```javascript
+// #ifdef MP-WEIXIN
+uni.requestPayment({
+  // 微信小程序支付
+})
+// #endif
+
+// #ifdef APP-PLUS
+uni.requestPayment({
+  // App 支付
+})
+// #endif
+```
+
+## 参考资源
+
+- [uni-app API 文档](https://doc.dcloud.net.cn/uni-app-x/api/)
+- [uni-app 条件编译](https://uniapp.dcloud.net.cn/tutorial/platform.html)

.agents/bak-skills/uniappx-project/references/api/device.md

@@ -0,0 +1,63 @@
+# 设备信息 API
+
+## 概述
+
+设备信息 API 用于获取设备系统信息、网络状态等。
+
+## API 列表
+
+### uni.getSystemInfo
+
+获取系统信息。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/system/system-info.html#getsysteminfo
+
+**返回值**：
+- `brand` - 手机品牌
+- `model` - 手机型号
+- `pixelRatio` - 设备像素比
+- `screenWidth` - 屏幕宽度
+- `screenHeight` - 屏幕高度
+- `windowWidth` - 可使用窗口宽度
+- `windowHeight` - 可使用窗口高度
+- `statusBarHeight` - 状态栏的高度
+- `language` - 应用设置的语言
+- `version` - 版本号
+- `platform` - 平台
+
+**示例**：
+```javascript
+uni.getSystemInfo({
+  success: (res) => {
+    console.log('屏幕宽度', res.screenWidth)
+    console.log('屏幕高度', res.screenHeight)
+    console.log('状态栏高度', res.statusBarHeight)
+  }
+})
+```
+
+### uni.getSystemInfoSync
+
+同步获取系统信息。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/system/system-info.html#getsysteminfosync
+
+### uni.getNetworkType
+
+获取网络类型。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/system/network.html#getnetworktype
+
+**返回值**：
+- `networkType` - 网络类型（wifi、2g、3g、4g、unknown、none）
+
+### uni.onNetworkStatusChange
+
+监听网络状态变化。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/system/network.html#onnetworkstatuschange
+
+## 参考资源
+
+- [uni-app 系统信息文档](https://doc.dcloud.net.cn/uni-app-x/api/system/system-info.html)
+- [uni-app 网络状态文档](https://doc.dcloud.net.cn/uni-app-x/api/system/network.html)

.agents/bak-skills/uniappx-project/references/api/file.md

@@ -0,0 +1,35 @@
+# 文件操作 API
+
+## 概述
+
+文件操作 API 用于保存文件、获取文件信息等。
+
+## API 列表
+
+### uni.saveFile
+
+保存文件到本地。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#savefile
+
+### uni.getFileInfo
+
+获取文件信息。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#getfileinfo
+
+### uni.getSavedFileList
+
+获取已保存的文件列表。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#getsavedfilelist
+
+### uni.removeSavedFile
+
+删除已保存的文件。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/file/file.html#removesavedfile
+
+## 参考资源
+
+- [uni-app 文件文档](https://doc.dcloud.net.cn/uni-app-x/api/file/file.html)

.agents/bak-skills/uniappx-project/references/api/location.md

@@ -0,0 +1,59 @@
+# 位置服务 API
+
+## 概述
+
+位置服务 API 用于获取地理位置、打开地图等。
+
+## API 列表
+
+### uni.getLocation
+
+获取当前地理位置。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/location/location.html#getlocation
+
+**参数**：
+- `type` (String) - 默认为 wgs84 返回 gps 坐标，gcj02 返回可用于 uni.openLocation 的坐标
+- `altitude` (Boolean) - 传入 true 会返回高度信息
+- `geocode` (Boolean) - 默认 false，传入 true 会解析地址信息
+
+**返回值**：
+- `latitude` - 纬度
+- `longitude` - 经度
+- `speed` - 速度
+- `accuracy` - 位置的精确度
+- `altitude` - 高度
+- `verticalAccuracy` - 垂直精度
+- `horizontalAccuracy` - 水平精度
+
+**示例**：
+```javascript
+uni.getLocation({
+  type: 'gcj02',
+  success: (res) => {
+    console.log('当前位置', res.latitude, res.longitude)
+  }
+})
+```
+
+### uni.openLocation
+
+使用微信内置地图查看位置。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/location/open-location.html#openlocation
+
+**参数**：
+- `latitude` (Number) - 纬度
+- `longitude` (Number) - 经度
+- `name` (String) - 位置名称
+- `address` (String) - 地址的详细说明
+
+### uni.chooseLocation
+
+打开地图选择位置。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/location/choose-location.html#chooselocation
+
+## 参考资源
+
+- [uni-app 位置服务文档](https://doc.dcloud.net.cn/uni-app-x/api/location/location.html)

.agents/bak-skills/uniappx-project/references/api/media.md

@@ -0,0 +1,67 @@
+# 媒体处理 API
+
+## 概述
+
+媒体处理 API 用于选择图片、预览图片、选择视频等。
+
+## API 列表
+
+### uni.chooseImage
+
+从本地相册选择图片或使用相机拍照。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#chooseimage
+
+**参数**：
+- `count` (Number) - 最多可以选择的图片张数，默认 9
+- `sizeType` (Array) - 所选的图片的尺寸（original、compressed）
+- `sourceType` (Array) - 选择图片的来源（album、camera）
+
+**返回值**：
+- `tempFilePaths` - 图片的本地文件路径列表
+- `tempFiles` - 图片的本地文件列表
+
+**示例**：
+```javascript
+uni.chooseImage({
+  count: 1,
+  sizeType: ['original', 'compressed'],
+  sourceType: ['album', 'camera'],
+  success: (res) => {
+    console.log('选择的图片', res.tempFilePaths)
+  }
+})
+```
+
+### uni.previewImage
+
+预览图片。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#previewimage
+
+**参数**：
+- `urls` (Array) - 需要预览的图片 http 链接列表
+- `current` (Number) - 当前显示图片的索引
+
+### uni.getImageInfo
+
+获取图片信息。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#getimageinfo
+
+### uni.saveImageToPhotosAlbum
+
+保存图片到系统相册。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/media/image.html#saveimagetophotosalbum
+
+### uni.chooseVideo
+
+从本地相册选择视频或使用相机拍摄视频。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/media/video.html#choosevideo
+
+## 参考资源
+
+- [uni-app 图片文档](https://doc.dcloud.net.cn/uni-app-x/api/media/image.html)
+- [uni-app 视频文档](https://doc.dcloud.net.cn/uni-app-x/api/media/video.html)

.agents/bak-skills/uniappx-project/references/api/navigation.md

@@ -0,0 +1,60 @@
+# 页面路由 API
+
+## 概述
+
+页面路由 API 用于页面跳转和导航。
+
+## API 列表
+
+### uni.navigateTo
+
+保留当前页面，跳转到应用内的某个页面。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/router.html#navigateto
+
+**参数**：
+- `url` (String) - 需要跳转的应用内非 tabBar 的页面的路径，路径后可以带参数
+- `success` (Function) - 接口调用成功的回调函数
+- `fail` (Function) - 接口调用失败的回调函数
+- `complete` (Function) - 接口调用结束的回调函数
+
+**示例**：
+```javascript
+uni.navigateTo({
+  url: '/pages/detail/detail?id=123&name=test',
+  success: () => {
+    console.log('跳转成功')
+  }
+})
+```
+
+### uni.redirectTo
+
+关闭当前页面，跳转到应用内的某个页面。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/router.html#redirectto
+
+### uni.reLaunch
+
+关闭所有页面，打开到应用内的某个页面。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/router.html#relaunch
+
+### uni.switchTab
+
+跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/router.html#switchtab
+
+### uni.navigateBack
+
+关闭当前页面，返回上一页面或多级页面。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/router.html#navigateback
+
+**参数**：
+- `delta` (Number) - 返回的页面数，如果 delta 大于现有页面数，则返回到首页
+
+## 参考资源
+
+- [uni-app 路由文档](https://doc.dcloud.net.cn/uni-app-x/api/router.html)

.agents/bak-skills/uniappx-project/references/api/network.md

@@ -0,0 +1,276 @@
+# 网络请求 API
+
+## uni.request
+
+发起网络请求。
+
+### 参数
+
+| 参数名 | 类型 | 必填 | 说明 | 平台差异说明 |
+|--------|------|------|------|--------------|
+| url | String | 是 | 开发者服务器接口地址 | - |
+| data | Object/String/ArrayBuffer | 否 | 请求的参数 | - |
+| header | Object | 否 | 设置请求的 header，header 中不能设置 Referer | - |
+| method | String | 否 | HTTP 请求方法，默认为 GET | - |
+| timeout | Number | 否 | 超时时间，单位为 ms，默认为 60000 | - |
+| dataType | String | 否 | 如果设为 json，会尝试对返回的数据做一次 JSON.parse | - |
+| responseType | String | 否 | 设置响应的数据类型，默认为 text | - |
+| sslVerify | Boolean | 否 | 验证 ssl 证书 | App |
+| withCredentials | Boolean | 否 | 跨域请求时是否携带凭证（cookies） | H5 |
+| firstIpv4 | Boolean | 否 | DNS 解析时优先使用 ipv4 | App |
+
+### 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| data | Object/String/ArrayBuffer | 服务器返回的数据 |
+| statusCode | Number | HTTP 状态码 |
+| header | Object | 服务器返回的 header |
+| cookies | Array | 服务器返回的 cookies |
+
+### 平台支持
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ✅ |
+
+### 示例
+
+```javascript
+// GET 请求
+uni.request({
+  url: 'https://api.example.com/data',
+  method: 'GET',
+  data: {
+    id: 123
+  },
+  success: (res) => {
+    console.log(res.data)
+  },
+  fail: (err) => {
+    console.error(err)
+  }
+})
+
+// POST 请求
+uni.request({
+  url: 'https://api.example.com/data',
+  method: 'POST',
+  data: {
+    name: 'John',
+    age: 30
+  },
+  header: {
+    'Content-Type': 'application/json'
+  },
+  success: (res) => {
+    console.log(res.data)
+  }
+})
+
+// 使用 Promise
+uni.request({
+  url: 'https://api.example.com/data'
+}).then(res => {
+  console.log(res.data)
+}).catch(err => {
+  console.error(err)
+})
+```
+
+## uni.uploadFile
+
+上传文件。
+
+### 参数
+
+| 参数名 | 类型 | 必填 | 说明 | 平台差异说明 |
+|--------|------|------|------|--------------|
+| url | String | 是 | 开发者服务器 url | - |
+| filePath | String | 是 | 要上传文件资源的路径 | - |
+| name | String | 是 | 文件对应的 key，开发者在服务端可以通过这个 key 获取文件的二进制内容 | - |
+| header | Object | 否 | HTTP 请求 Header，header 中不能设置 Referer | - |
+| formData | Object | 否 | HTTP 请求中其他额外的 form data | - |
+| timeout | Number | 否 | 超时时间，单位为 ms，默认为 60000 | - |
+
+### 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| data | String | 服务器返回的数据 |
+| statusCode | Number | HTTP 状态码 |
+
+### 平台支持
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ❌ |
+
+### 示例
+
+```javascript
+uni.chooseImage({
+  count: 1,
+  success: (res) => {
+    const tempFilePaths = res.tempFilePaths
+    uni.uploadFile({
+      url: 'https://api.example.com/upload',
+      filePath: tempFilePaths[0],
+      name: 'file',
+      formData: {
+        'user': 'test'
+      },
+      success: (uploadRes) => {
+        console.log(uploadRes.data)
+      },
+      fail: (err) => {
+        console.error(err)
+      }
+    })
+  }
+})
+```
+
+## uni.downloadFile
+
+下载文件。
+
+### 参数
+
+| 参数名 | 类型 | 必填 | 说明 | 平台差异说明 |
+|--------|------|------|------|--------------|
+| url | String | 是 | 下载资源的 url | - |
+| header | Object | 否 | HTTP 请求 Header，header 中不能设置 Referer | - |
+| timeout | Number | 否 | 超时时间，单位为 ms，默认为 60000 | - |
+
+### 返回值
+
+| 参数名 | 类型 | 说明 |
+|--------|------|------|
+| tempFilePath | String | 临时文件路径，下载后的文件会存储到一个临时文件 |
+| statusCode | Number | HTTP 状态码 |
+
+### 平台支持
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ❌ |
+
+### 示例
+
+```javascript
+uni.downloadFile({
+  url: 'https://example.com/file.pdf',
+  success: (res) => {
+    if (res.statusCode === 200) {
+      console.log('下载成功', res.tempFilePath)
+      // 可以调用 uni.openDocument 打开文件
+      uni.openDocument({
+        filePath: res.tempFilePath,
+        success: () => {
+          console.log('打开文档成功')
+        }
+      })
+    }
+  },
+  fail: (err) => {
+    console.error('下载失败', err)
+  }
+})
+```
+
+## uni.connectSocket
+
+创建 WebSocket 连接。
+
+### 参数
+
+| 参数名 | 类型 | 必填 | 说明 | 平台差异说明 |
+|--------|------|------|------|--------------|
+| url | String | 是 | 服务器接口地址，必须是 wss 协议，且域名必须是后台配置的合法域名 | - |
+| header | Object | 否 | HTTP Header，header 中不能设置 Referer | - |
+| protocols | Array | 否 | 子协议数组 | H5 |
+| method | String | 否 | 请求方法 | App |
+
+### 平台支持
+
+| 平台 | 支持情况 |
+|------|---------|
+| H5 | ✅ |
+| 微信小程序 | ✅ |
+| 支付宝小程序 | ✅ |
+| 百度小程序 | ✅ |
+| 字节跳动小程序 | ✅ |
+| QQ 小程序 | ✅ |
+| 快手小程序 | ✅ |
+| App | ✅ |
+| 快应用 | ❌ |
+
+### 示例
+
+```javascript
+// 创建 WebSocket 连接
+uni.connectSocket({
+  url: 'wss://example.com/websocket',
+  success: () => {
+    console.log('连接成功')
+  }
+})
+
+// 监听 WebSocket 连接打开事件
+uni.onSocketOpen((res) => {
+  console.log('WebSocket 连接已打开')
+})
+
+// 监听 WebSocket 错误事件
+uni.onSocketError((res) => {
+  console.error('WebSocket 错误', res)
+})
+
+// 发送数据
+uni.sendSocketMessage({
+  data: JSON.stringify({
+    type: 'message',
+    content: 'Hello'
+  })
+})
+
+// 监听接收消息
+uni.onSocketMessage((res) => {
+  console.log('收到消息', res.data)
+})
+
+// 关闭连接
+uni.closeSocket()
+```
+
+## 参考资源
+
+- [uni-app 网络请求文档](https://doc.dcloud.net.cn/uni-app-x/api/network/request.html)
+- [uni-app 文件上传文档](https://doc.dcloud.net.cn/uni-app-x/api/network/upload.html)
+- [uni-app 文件下载文档](https://doc.dcloud.net.cn/uni-app-x/api/network/download.html)
+- [uni-app WebSocket 文档](https://doc.dcloud.net.cn/uni-app-x/api/network/websocket.html)

.agents/bak-skills/uniappx-project/references/api/other.md

@@ -0,0 +1,58 @@
+# 其他 API
+
+## 概述
+
+其他 API 包括工具类 API、登录 API 等。
+
+## API 列表
+
+### uni.canIUse
+
+判断应用的版本是否支持某个 API。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/system/info.html#caniuse
+
+**示例**：
+```javascript
+if (uni.canIUse('getSystemInfo')) {
+  uni.getSystemInfo({
+    success: (res) => {
+      console.log(res)
+    }
+  })
+}
+```
+
+### uni.login
+
+登录。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/login/login.html#login
+
+### uni.getUserInfo
+
+获取用户信息。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/login/login.html#getuserinfo
+
+### uni.authorize
+
+提前向用户发起授权请求。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/authorize.html#authorize
+
+### uni.openSetting
+
+调起客户端小程序设置页面。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/setting/open-setting.html#opensetting
+
+### uni.getSetting
+
+获取用户的当前设置。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/setting/get-setting.html#getsetting
+
+## 参考资源
+
+- [uni-app API 文档](https://doc.dcloud.net.cn/uni-app-x/api/)

.agents/bak-skills/uniappx-project/references/api/payment.md

@@ -0,0 +1,43 @@
+# 支付 API
+
+## 概述
+
+支付 API 用于发起支付。
+
+## API 列表
+
+### uni.requestPayment
+
+发起支付。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/payment/payment.html#requestpayment
+
+**参数**（微信小程序）：
+- `provider` (String) - 支付服务提供商（wxpay）
+- `timeStamp` (String) - 时间戳
+- `nonceStr` (String) - 随机字符串
+- `package` (String) - 统一下单接口返回的 prepay_id 参数值
+- `signType` (String) - 签名算法
+- `paySign` (String) - 签名
+
+**示例**：
+```javascript
+uni.requestPayment({
+  provider: 'wxpay',
+  timeStamp: String(Date.now()),
+  nonceStr: 'nonceStr',
+  package: 'prepay_id=xxx',
+  signType: 'MD5',
+  paySign: 'paySign',
+  success: (res) => {
+    console.log('支付成功', res)
+  },
+  fail: (err) => {
+    console.error('支付失败', err)
+  }
+})
+```
+
+## 参考资源
+
+- [uni-app 支付文档](https://doc.dcloud.net.cn/uni-app-x/api/payment/payment.html)

.agents/bak-skills/uniappx-project/references/api/share.md

@@ -0,0 +1,25 @@
+# 分享 API
+
+## 概述
+
+分享 API 用于分享内容。
+
+## API 列表
+
+### uni.share
+
+分享内容。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/share/share.html#share
+
+**参数**：
+- `provider` (String) - 分享服务提供商（weixin、sinaweibo、qq）
+- `type` (Number) - 分享类型（0-图文、1-纯文字、2-纯图片、3-音乐、4-视频、5-小程序）
+- `href` (String) - 分享链接
+- `title` (String) - 分享标题
+- `summary` (String) - 分享摘要
+- `imageUrl` (String) - 分享图片
+
+## 参考资源
+
+- [uni-app 分享文档](https://doc.dcloud.net.cn/uni-app-x/api/share/share.html)

.agents/bak-skills/uniappx-project/references/api/storage.md

@@ -0,0 +1,65 @@
+# 数据存储 API
+
+## 概述
+
+数据存储 API 用于在本地存储和获取数据。
+
+## API 列表
+
+### uni.setStorage
+
+将数据存储在本地缓存中指定的 key 中。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#setstorage
+
+**参数**：
+- `key` (String) - 本地缓存中指定的 key
+- `data` (Any) - 需要存储的内容
+- `success` (Function) - 接口调用成功的回调函数
+- `fail` (Function) - 接口调用失败的回调函数
+- `complete` (Function) - 接口调用结束的回调函数
+
+**示例**：
+```javascript
+uni.setStorage({
+  key: 'userInfo',
+  data: { name: 'John', age: 30 },
+  success: () => {
+    console.log('存储成功')
+  }
+})
+```
+
+### uni.getStorage
+
+从本地缓存中异步获取指定 key 的内容。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#getstorage
+
+### uni.removeStorage
+
+从本地缓存中异步移除指定 key。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#removestorage
+
+### uni.clearStorage
+
+清理本地数据缓存。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#clearstorage
+
+### uni.setStorageSync
+
+同步将数据存储在本地缓存中指定的 key 中。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#setstoragesync
+
+### uni.getStorageSync
+
+从本地缓存中同步获取指定 key 的内容。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html#getstoragesync
+
+## 参考资源
+
+- [uni-app 数据存储文档](https://doc.dcloud.net.cn/uni-app-x/api/storage/storage.html)

.agents/bak-skills/uniappx-project/references/api/ui.md

@@ -0,0 +1,75 @@
+# 界面交互 API
+
+## 概述
+
+界面交互 API 用于显示提示、对话框、操作菜单等。
+
+## API 列表
+
+### uni.showToast
+
+显示消息提示框。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showtoast
+
+**参数**：
+- `title` (String) - 提示的内容
+- `icon` (String) - 图标类型（success、error、loading、none）
+- `image` (String) - 自定义图标的本地路径
+- `duration` (Number) - 提示的延迟时间，默认 2000
+- `mask` (Boolean) - 是否显示透明蒙层，防止触摸穿透
+
+**示例**：
+```javascript
+uni.showToast({
+  title: '操作成功',
+  icon: 'success',
+  duration: 2000
+})
+```
+
+### uni.showModal
+
+显示模态弹窗。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showmodal
+
+**参数**：
+- `title` (String) - 提示的标题
+- `content` (String) - 提示的内容
+- `showCancel` (Boolean) - 是否显示取消按钮
+- `cancelText` (String) - 取消按钮的文字
+- `confirmText` (String) - 确认按钮的文字
+
+**返回值**：
+- `confirm` (Boolean) - 为 true 时，表示用户点击了确定按钮
+- `cancel` (Boolean) - 为 true 时，表示用户点击了取消按钮
+
+### uni.showActionSheet
+
+显示操作菜单。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showactionsheet
+
+### uni.showLoading
+
+显示加载提示框。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#showloading
+
+### uni.hideLoading
+
+隐藏加载提示框。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html#hideloading
+
+### uni.setNavigationBarTitle
+
+设置当前页面标题。
+
+**详细文档**：https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html#setnavigationbartitle
+
+## 参考资源
+
+- [uni-app 界面交互文档](https://doc.dcloud.net.cn/uni-app-x/api/ui/prompt.html)
+- [uni-app 导航栏文档](https://doc.dcloud.net.cn/uni-app-x/api/ui/navigation-bar.html)

.agents/bak-skills/uniappx-project/references/components/README.md

@@ -0,0 +1,48 @@
+# Components Index | 组件索引
+
+## 官方文档
+
+https://doc.dcloud.net.cn/uni-app-x/component/
+
+## 内置组件列表
+
+- ad
+- ad-draw
+- audio
+- button
+- camera
+- canvas
+- checkbox
+- cover-image
+- cover-view
+- custom-tab-bar
+- editor
+- form
+- icon
+- image
+- input
+- label
+- live-player
+- live-pusher
+- map
+- match-media
+- movable-area
+- movable-view
+- navigation-bar
+- navigator
+- page-meta
+- picker
+- picker-view
+- progress
+- radio
+- rich-text
+- scroll-view
+- slider
+- swiper
+- switch
+- text
+- textarea
+- unicloud-db
+- video
+- view
+- web-view

.agents/bak-skills/uniappx-project/references/components/built-in/ad-draw.md

@@ -0,0 +1,32 @@
+# ad-draw
+
+## Instructions
+
+也称为Draw视频信息流广告
+
+沉浸视频流广告为媒体提供了竖屏视频信息流广告样式，适合在全屏的竖屏视频中使用。支持app-nvue页面使用。
+
+类抖音的竖版视频流，来电秀、直播间等全屏观看的视频。
+
+### Syntax
+
+- 使用 `<ad-draw />`（或 `<ad-draw></ad-draw>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+See official docs for full properties list: `https://doc.dcloud.net.cn/uni-app-x/component/ad-draw.html`
+
+#### Events
+
+See official docs for full events list: `https://doc.dcloud.net.cn/uni-app-x/component/ad-draw.html`
+
+#### Platform Compatibility
+
+See official docs for platform support table: `https://doc.dcloud.net.cn/uni-app-x/component/ad-draw.html`
+
+### Examples
+
+Examples are available in the official docs: `https://doc.dcloud.net.cn/uni-app-x/component/ad-draw.html`
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/ad-draw.html)

.agents/bak-skills/uniappx-project/references/components/built-in/ad.md

@@ -0,0 +1,32 @@
+# ad
+
+## Instructions
+
+应用内展示的广告组件，可用于banner或信息流。
+
+Banner或信息流广告展现场景非常灵活，常见的展现场景为：文章顶部，详情页面顶部，第一屏中部等。建议信息流广告不要放置在底部
+
+平台差异说明
+
+### Syntax
+
+- 使用 `<ad />`（或 `<ad></ad>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+See official docs for full properties list: `https://doc.dcloud.net.cn/uni-app-x/component/ad.html`
+
+#### Events
+
+See official docs for full events list: `https://doc.dcloud.net.cn/uni-app-x/component/ad.html`
+
+#### Platform Compatibility
+
+See official docs for platform support table: `https://doc.dcloud.net.cn/uni-app-x/component/ad.html`
+
+### Examples
+
+Examples are available in the official docs: `https://doc.dcloud.net.cn/uni-app-x/component/ad.html`
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/ad.html)

.agents/bak-skills/uniappx-project/references/components/built-in/audio.md

@@ -0,0 +1,112 @@
+# audio
+
+## Instructions
+
+音频。
+
+平台差异说明
+
+注意： 微信小程序平台自基础库 1.6.0 版本开始，不再维护 audio 组件，推荐使用API方式而不是组件方式来播放音频。API见 uni.createInnerAudioContext 替代。
+
+### Syntax
+
+- 使用 `<audio />`（或 `<audio></audio>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+| 属性名 | 类型 | 默认值 | 说明 |
+| --- | --- | --- | --- |
+| id | String |  | audio 组件的唯一标识符 |
+| src | String |  | 要播放音频的资源地址 |
+| loop | Boolean | false | 是否循环播放 |
+| controls | Boolean | false | 是否显示默认控件 |
+| poster | String |  | 默认控件上的音频封面的图片资源地址，如果 controls 属性值为 false 则设置 poster 无效 |
+| name | String | 未知音频 | 默认控件上的音频名字，如果 controls 属性值为 false 则设置 name 无效 |
+| author | String | 未知作者 | 默认控件上的作者名字，如果 controls 属性值为 false 则设置 author 无效 |
+
+#### Events
+
+| 事件名 | 类型 | 默认值 | 说明 |
+| --- | --- | --- | --- |
+| @error | EventHandle |  | 当发生错误时触发 error 事件，detail = {errMsg: MediaError.code} |
+| @play | EventHandle |  | 当开始/继续播放时触发play事件 |
+| @pause | EventHandle |  | 当暂停播放时触发 pause 事件 |
+| @timeupdate | EventHandle |  | 当播放进度改变时触发 timeupdate 事件，detail = {currentTime, duration} |
+| @ended | EventHandle |  | 当播放到末尾时触发 ended 事件 |
+
+#### Platform Compatibility
+
+See official docs for platform support table: `https://doc.dcloud.net.cn/uni-app-x/component/audio.html`
+
+### Examples
+
+### Example (Example 1)
+
+```vue
+<template>
+	<view>
+		<view class="page-body">
+			<view class="page-section page-section-gap" style="text-align: center;">
+				<audio style="text-align: left" :src="current.src" :poster="current.poster" :name="current.name" :author="current.author" :action="audioAction" controls></audio>
+			</view>
+		</view>
+	</view>
+</template>
+```
+
+### Example (Example 2)
+
+```html
+<template>
+	<view>
+		<view class="page-body">
+			<view class="page-section page-section-gap" style="text-align: center;">
+				<audio style="text-align: left" :src="current.src" :poster="current.poster" :name="current.name" :author="current.author" :action="audioAction" controls></audio>
+			</view>
+		</view>
+	</view>
+</template>
+```
+
+### Example (Example 3)
+
+```vue
+export default {
+	data() {
+		return {
+			current: {
+				poster: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/music-a.png',
+				name: '致爱丽丝',
+				author: '暂无',
+				src: 'https://web-ext-storage.dcloud.net.cn/doc/uniapp/ForElise.mp3',
+			},
+			audioAction: {
+				method: 'pause'
+			}
+		}
+	}
+}
+```
+
+### Example (Example 4)
+
+```javascript
+export default {
+	data() {
+		return {
+			current: {
+				poster: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/music-a.png',
+				name: '致爱丽丝',
+				author: '暂无',
+				src: 'https://web-ext-storage.dcloud.net.cn/doc/uniapp/ForElise.mp3',
+			},
+			audioAction: {
+				method: 'pause'
+			}
+		}
+	}
+}
+```
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/audio.html)

.agents/bak-skills/uniappx-project/references/components/built-in/button.md

@@ -0,0 +1,240 @@
+# button
+
+## Instructions
+
+按钮。
+
+属性说明
+
+button组件也支持style中通过css定义文字大小。 见下
+
+### Syntax
+
+- 使用 `<button />`（或 `<button></button>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+| 属性名 | 类型 | 默认值 | 说明 | 生效时机 | 平台差异说明 |
+| --- | --- | --- | --- | --- | --- |
+| size | String | default | 按钮的大小 |  |  |
+| type | String | default | 按钮的样式类型 |  |  |
+| plain | Boolean | false | 按钮是否镂空，背景色透明 |  |  |
+| disabled | Boolean | false | 是否禁用 |  |  |
+| loading | Boolean | false | 名称前是否带 loading 图标 |  | H5、App(App-nvue 平台，在 ios 上为雪花，Android上为圆圈) |
+| form-type | String |  | 用于 <form> 组件，点击分别会触发 <form> 组件的 submit/reset 事件 |  |  |
+| open-type | String |  | 开放能力 |  |  |
+| hover-class | String | button-hover | 指定按钮按下去的样式类。当 hover-class="none" 时，没有点击态效果 |  | App-nvue 平台暂不支持 |
+| hover-start-time | Number | 20 | 按住后多久出现点击态，单位毫秒 |  |  |
+| hover-stay-time | Number | 70 | 手指松开后点击态保留时间，单位毫秒 |  |  |
+| app-parameter | String |  | 打开 APP 时，向 APP 传递的参数，open-type=launchApp时有效 |  | 微信小程序、QQ小程序 |
+| hover-stop-propagation | boolean | false | 指定是否阻止本节点的祖先节点出现点击态 |  | 微信小程序 |
+| lang | string | 'en' | 指定返回用户信息的语言，zh_CN 简体中文，zh_TW 繁体中文，en 英文。 |  | 微信小程序 |
+| session-from | string |  | 会话来源，open-type="contact"时有效 |  | 微信小程序 |
+| send-message-title | string | 当前标题 | 会话内消息卡片标题，open-type="contact"时有效 |  | 微信小程序 |
+| send-message-path | string | 当前分享路径 | 会话内消息卡片点击跳转小程序路径，open-type="contact"时有效 |  | 微信小程序 |
+| send-message-img | string | 截图 | 会话内消息卡片图片，open-type="contact"时有效 |  | 微信小程序 |
+| show-message-card | boolean | false | 是否显示会话内消息卡片，设置此参数为 true，用户进入客服会话会在右下角显示"可能要发送的小程序"提示，用户点击后可以快速发送小程序消息，open-type="contact"时有效 |  | 微信小程序 |
+| group-id | String |  | 打开群资料卡时，传递的群号 | open-type="openGroupProfile" | QQ小程序 |
+| guild-id | String |  | 打开频道页面时，传递的频道号 | open-type="openGuildProfile" | QQ小程序 |
+| public-id | String |  | 打开公众号资料卡时，传递的号码 | open-type="openPublicProfile" | QQ小程序 |
+| data-im-id | String |  | 客服的抖音号 | open-type="im" | 抖音小程序2.68.0版本+ |
+| data-im-type | String |  | IM卡片类型 | open-type="im" | 抖音小程序2.80.0版本+ |
+| data-goods-id | String |  | 商品的id，仅支持泛知识课程库和生活服务商品库中的商品 | open-type="im" | 抖音小程序2.80.0版本+ |
+| data-order-id | String |  | 订单的id，仅支持交易2.0订单 | open-type="im" | 抖音小程序2.80.0版本+ |
+| data-biz-line | String |  | 商品类型，“1”代表生活服务，“2”代表泛知识。 | open-type="im" | 抖音小程序2.80.0版本+ |
+| contact-type | String |  | 客服类型，默认值 seller |  | 小红书小程序 |
+| contact-id | String |  | contact-type 对应的key。contact-type 为 seller 时非必传；goods 时第三方商品 id；order时第三方订单 id。open-type=contact时有效 |  | 小红书小程序 |
+
+#### Events
+
+| 事件名 | 类型 | 默认值 | 说明 | 生效时机 | 平台差异说明 |
+| --- | --- | --- | --- | --- | --- |
+| @getphonenumber | Handler |  | 获取用户手机号回调 | open-type="getPhoneNumber" | 微信、支付宝、百度、抖音、快手、京东小程序、小红书小程序 |
+| @getuserinfo | Handler |  | 用户点击该按钮时，会返回获取到的用户信息，从返回参数的detail中获取到的值同uni.getUserInfo | open-type="getUserInfo" | 微信、QQ、百度、快手、京东小程序、小红书小程序 |
+| @error | Handler |  | 当使用开放能力时，发生错误的回调 | open-type="launchApp" | 微信、QQ、快手、京东小程序 |
+| @opensetting | Handler |  | 在打开授权设置页并关闭后回调 | open-type="openSetting" | 微信、QQ、百度、快手、京东小程序、小红书小程序 |
+| @launchapp | Handler |  | 从小程序打开 App 成功的回调 | open-type="launchApp" | 微信、QQ、快手、京东小程序 |
+| @contact | Handler |  | 客服消息回调 | open-type="contact" | 微信、QQ、百度、快手小程序 |
+| @chooseavatar | Handler |  | 获取用户头像回调 | open-type="chooseAvatar" | 微信、支付宝小程序 |
+| @agreeprivacyauthorization | Handler |  | 用户同意隐私协议事件回调，open-type="agreePrivacyAuthorization"时有效 | open-type="agreeprivacyauthorization" | 微信小程序2.32.3 |
+| @addgroupapp | Handler |  | 添加群应用的回调 | open-type="addGroupApp" | QQ小程序 |
+| @chooseaddress | Handler |  | 调起用户编辑并选择收货地址的回调 | open-type="chooseAddress" | 百度小程序 |
+| @chooseinvoicetitle | Handler |  | 用户选择发票抬头的回调 | open-type="chooseInvoiceTitle" | 百度小程序 |
+| @subscribe | Handler |  | 订阅消息授权回调 | open-type="subscribe" | 百度小程序 |
+| @login | Handler |  | 登录回调 | open-type="login" | 百度小程序 |
+| @im | Handler |  | 监听跳转IM的成功回调 | open-type="im" | 抖音小程序2.68.0版本+ |
+
+#### Platform Compatibility
+
+| 值 | 说明 | 平台差异说明 |
+| --- | --- | --- |
+| feedback | 打开“意见反馈”页面，用户可提交反馈内容并上传日志 | App、微信小程序、QQ小程序 |
+| share | 触发用户转发 | 微信小程序、百度小程序、支付宝小程序、抖音小程序、飞书小程序、QQ小程序、快手小程序、京东小程序、360小程序、小红书小程序 |
+| getUserInfo | 获取用户信息，可以从@getuserinfo回调中获取到用户信息 | 微信小程序、百度小程序、QQ小程序、快手小程序、京东小程序、360小程序、小红书小程序 |
+| contact | 打开客服会话，如果用户在会话中点击消息卡片后返回应用，可以从 @contact 回调中获得具体信息 | 微信小程序、百度小程序、快手小程序、抖音小程序、小红书小程序 |
+| getPhoneNumber | 获取用户手机号，可以从@getphonenumber回调中获取到用户信息 | 微信小程序、百度小程序、抖音小程序、支付宝小程序、快手小程序、京东小程序、小红书小程序。App平台另见 一键登陆 |
+| launchApp | 小程序中打开APP，可以通过app-parameter属性设定向APP传的参数 | 微信小程序 、 QQ小程序 、快手小程序、京东小程序、 鸿蒙元服务 |
+| openSetting | 打开授权设置页 | 微信小程序、QQ小程序、百度小程序、快手小程序、京东小程序、360小程序、小红书小程序、鸿蒙元服务 |
+| chooseAvatar | 获取用户头像，可以从@chooseavatar回调中获取到头像信息 | 微信小程序2.21.2版本+ |
+| agreePrivacyAuthorization | 用户同意隐私协议按钮。用户点击一次此按钮后，所有隐私接口可以正常调用。可通过 @agreeprivacyauthorization 监听用户同意隐私协议事件。隐私合规开发指南详情可见 《小程序隐私协议开发指南》 | 微信小程序2.32.3版本+ |
+| uploadDouyinVideo | 发布抖音视频 | 抖音小程序2.65.0版本+ |
+| im | 跳转到抖音IM客服 | 抖音小程序2.80.0版本+ |
+| getAuthorize | 支持小程序授权 | 支付宝小程序 |
+| lifestyle | 关注生活号 | 支付宝小程序 |
+| contactShare | 分享到通讯录好友 | 支付宝小程序基础库1.11.0版本+ |
+| openGroupProfile | 呼起QQ群资料卡页面，可以通过group-id属性设定需要打开的群资料卡的群号，同时manifest.json中必须配置groupIdList | QQ小程序基础库1.4.7版本+ |
+| openGuildProfile | 呼起频道页面，可以通过guild-id属性设定需要打开的频道ID | QQ小程序基础库1.46.8版本+ |
+| openPublicProfile | 打开公众号资料卡，可以通过public-id属性设定需要打开的公众号资料卡的号码，同时manifest.json中必须配置publicIdList | QQ小程序基础库1.12.0版本+ |
+| shareMessageToFriend | 在自定义开放数据域组件中,向指定好友发起分享据 | QQ小程序基础库1.17.0版本+ |
+| addFriend | 添加好友， 对方需要通过该小程序进行授权，允许被加好友后才能调用成功用户授权 | QQ小程序 |
+| addColorSign | 添加彩签，点击后添加状态有用户提示，无回调 | QQ小程序基础库1.10.0版本+ |
+| addGroupApp | 添加群应用（只有管理员或群主有权操作），添加后给button绑定@addgroupapp事件接收回调数据 | QQ小程序基础库1.16.0版本+ |
+| addToFavorites | 收藏当前页面，点击按钮后会触发Page.onAddToFavorites方法 | QQ小程序基础库1.19.0版本+ |
+| chooseAddress | 选择用户收货地址，可以从@chooseaddress回调中获取到用户选择的地址信息 | 百度小程序3.160.3版本+ |
+| chooseInvoiceTitle | 选择用户发票抬头，可以从@chooseinvoicetitle回调中获取到用户选择发票抬头信息 | 百度小程序3.160.3版本+ |
+| login | 登录，可以从@login回调中确认是否登录成功 | 百度小程序3.230.1版本+ |
+| subscribe | 订阅类模板消息，需要用户授权才可发送 | 百度小程序 |
+| favorite | 触发用户收藏 | 快手小程序 |
+| watchLater | 触发用户稍后再看 | 快手小程序 |
+| openProfile | 触发打开用户主页 | 快手小程序 |
+
+### Examples
+
+### Example (Example 1)
+
+```vue
+<template>
+	<button size="default" type="default"
+	style="color:#ffffff;backgroundColor:#1AAD19;borderColor:#1AAD19"
+	hover-class="is-hover">按钮</button>
+</template>
+<style>
+.is-hover {
+	color: rgba(255, 255, 255, 0.6);
+	background-color: #179b16;
+	border-color: #179b16;
+  }
+</style>
+```
+
+### Example (Example 2)
+
+```html
+<template>
+	<button size="default" type="default"
+	style="color:#ffffff;backgroundColor:#1AAD19;borderColor:#1AAD19"
+	hover-class="is-hover">按钮</button>
+</template>
+<style>
+.is-hover {
+	color: rgba(255, 255, 255, 0.6);
+	background-color: #179b16;
+	border-color: #179b16;
+  }
+</style>
+```
+
+### Example (Example 3)
+
+```vue
+<template>
+	<view>
+		<navigator url="/pages/about/about"><button type="default">通过navigator组件跳转到about页面</button></navigator>
+		<button type="default" @click="goto('/pages/about/about')">通过方法跳转到about页面</button>
+		<button type="default" @click="navigateTo('/pages/about/about')">跳转到about页面</button><!-- 这种写法只有h5平台支持，不跨端，不推荐使用 -->
+	</view>
+</template>
+<script>
+	export default {
+		methods: {
+			goto(url) {
+				uni.navigateTo({
+					url:url
+				})
+			}
+		}
+	}
+</script>
+```
+
+### Example (Example 4)
+
+```html
+<template>
+	<view>
+		<navigator url="/pages/about/about"><button type="default">通过navigator组件跳转到about页面</button></navigator>
+		<button type="default" @click="goto('/pages/about/about')">通过方法跳转到about页面</button>
+		<button type="default" @click="navigateTo('/pages/about/about')">跳转到about页面</button><!-- 这种写法只有h5平台支持，不跨端，不推荐使用 -->
+	</view>
+</template>
+<script>
+	export default {
+		methods: {
+			goto(url) {
+				uni.navigateTo({
+					url:url
+				})
+			}
+		}
+	}
+</script>
+```
+
+### Example (Example 5)
+
+```vue
+<!-- 本示例未包含完整css，获取外链css请参考上文，在hello uni-app项目中查看 -->
+<template>
+	<view>
+		<view class="uni-padding-wrap uni-common-mt">
+			<button type="primary">页面主操作 Normal</button>
+			<button type="primary" loading="true">页面主操作 Loading</button>
+			<button type="primary" disabled="true">页面主操作 Disabled</button>
+			<button type="default">页面次要操作 Normal</button>
+			<button type="default" disabled="true">页面次要操作 Disabled</button>
+			<button type="warn">警告类操作 Normal</button>
+			<button type="warn" disabled="true">警告类操作 Disabled</button>
+			<view class="button-sp-area">
+				<button type="primary" plain="true">按钮</button>
+				<button type="primary" disabled="true" plain="true">不可点击的按钮</button>
+				<button type="default" plain="true">按钮</button>
+				<button type="default" disabled="true" plain="true">按钮</button>
+				<button class="mini-btn" type="primary" size="mini">按钮</button>
+				<button class="mini-btn" type="default" size="mini">按钮</button>
+				<button class="mini-btn" type="warn" size="mini">按钮</button>
+			</view>
+		</view>
+	</view>
+</template>
+```
+
+### Example (Example 6)
+
+```html
+<!-- 本示例未包含完整css，获取外链css请参考上文，在hello uni-app项目中查看 -->
+<template>
+	<view>
+		<view class="uni-padding-wrap uni-common-mt">
+			<button type="primary">页面主操作 Normal</button>
+			<button type="primary" loading="true">页面主操作 Loading</button>
+			<button type="primary" disabled="true">页面主操作 Disabled</button>
+			<button type="default">页面次要操作 Normal</button>
+			<button type="default" disabled="true">页面次要操作 Disabled</button>
+			<button type="warn">警告类操作 Normal</button>
+			<button type="warn" disabled="true">警告类操作 Disabled</button>
+			<view class="button-sp-area">
+				<button type="primary" plain="true">按钮</button>
+				<button type="primary" disabled="true" plain="true">不可点击的按钮</button>
+				<button type="default" plain="true">按钮</button>
+				<button type="default" disabled="true" plain="true">按钮</button>
+				<button class="mini-btn" type="primary" size="mini">按钮</button>
+				<button class="mini-btn" type="default" size="mini">按钮</button>
+				<button class="mini-btn" type="warn" size="mini">按钮</button>
+			</view>
+		</view>
+	</view>
+</template>
+```
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/button.html)

.agents/bak-skills/uniappx-project/references/components/built-in/camera.md

@@ -0,0 +1,121 @@
+# camera
+
+## Instructions
+
+页面内嵌的区域相机组件。注意这不是点击后全屏打开的相机。
+
+平台差异说明
+
+属性说明
+
+### Syntax
+
+- 使用 `<camera />`（或 `<camera></camera>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+| 属性名 | 类型 | 默认值 | 说明 | 平台差异说明 |
+| --- | --- | --- | --- | --- |
+| mode | String | normal | 应用模式，有效值为 normal(相机模式), scanCode(扫码模式)，不支持动态修改 |  |
+| resolution | string | medium | 分辨率，有效值为low, medium, high，不支持动态修改 | 微信小程序2.10.0、抖音小程序、飞书小程序 |
+| device-position | String | back | 前置或后置摄像头，值为front, back |  |
+| flash | String | auto | 闪光灯，值为auto, on, off, torch |  |
+| frame-size | string | medium | 指定期望的相机帧数据尺寸，值为small, medium, large | 微信小程序2.7.0、快应用、支付宝小程序、抖音小程序 |
+| output-dimension | String | 720P | 相机拍照，录制的分辨率。有效值为 360P、540P、720P、1080P、max。 | 支付宝小程序1.23.0 |
+
+#### Events
+
+| 事件名 | 类型 | 默认值 | 说明 | 平台差异说明 |
+| --- | --- | --- | --- | --- |
+| @stop | EventHandle |  | 摄像头在非正常终止时触发，如退出后台等情况 |  |
+| @error | EventHandle |  | 用户不允许使用摄像头时触发 |  |
+| @initdone | eventhandle |  | 相机初始化完成时触发，e.detail = {maxZoom} | 微信小程序2.7.0、抖音小程序1.78.0、飞书小程序、快手小程序 |
+| @ready | EventHandle |  | 相机初始化成功时触发。event.detail = {maxZoom} | 支付宝小程序1.24.3 |
+| @scancode | EventHandle |  | 在扫码识别成功时触发，仅在 mode="scanCode" 时生效 | 微信小程序、支付宝小程序、抖音小程序、飞书小程序、快手小程序 |
+
+#### Platform Compatibility
+
+See official docs for platform support table: `https://doc.dcloud.net.cn/uni-app-x/component/camera.html`
+
+### Examples
+
+### Example (Example 1)
+
+```vue
+<template>
+	<view>
+        <camera device-position="back" flash="off" @error="error" style="width: 100%; height: 300px;"></camera>
+        <button type="primary" @click="takePhoto">拍照</button>
+        <view>预览</view>
+        <image mode="widthFix" :src="src"></image>
+    </view>
+</template>
+```
+
+### Example (Example 2)
+
+```html
+<template>
+	<view>
+        <camera device-position="back" flash="off" @error="error" style="width: 100%; height: 300px;"></camera>
+        <button type="primary" @click="takePhoto">拍照</button>
+        <view>预览</view>
+        <image mode="widthFix" :src="src"></image>
+    </view>
+</template>
+```
+
+### Example (Example 3)
+
+```vue
+export default {
+    data() {
+        return {
+            src:""
+        }
+    },
+    methods: {
+         takePhoto() {
+            const ctx = uni.createCameraContext();
+            ctx.takePhoto({
+                quality: 'high',
+                success: (res) => {
+                    this.src = res.tempImagePath
+                }
+            });
+        },
+        error(e) {
+            console.log(e.detail);
+        }
+    }
+}
+```
+
+### Example (Example 4)
+
+```javascript
+export default {
+    data() {
+        return {
+            src:""
+        }
+    },
+    methods: {
+         takePhoto() {
+            const ctx = uni.createCameraContext();
+            ctx.takePhoto({
+                quality: 'high',
+                success: (res) => {
+                    this.src = res.tempImagePath
+                }
+            });
+        },
+        error(e) {
+            console.log(e.detail);
+        }
+    }
+}
+```
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/camera.html)

.agents/bak-skills/uniappx-project/references/components/built-in/canvas.md

@@ -0,0 +1,99 @@
+# canvas
+
+## Instructions
+
+画布
+
+属性说明
+
+注意事项：
+
+### Syntax
+
+- 使用 `<canvas />`（或 `<canvas></canvas>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+| 属性名 | 类型 | 默认值 | 说明 | 平台差异说明 |
+| --- | --- | --- | --- | --- |
+| type | String |  | 指定 canvas 类型，支持 2d 和 webgl | 微信小程序2.7.0+ 、抖音小程序1.78.0+、支付宝小程序2.7.0+ |
+| canvas-id | String |  | canvas 组件的唯一标识符 |  |
+| disable-scroll | Boolean | false | 当在 canvas 中移动时且有绑定手势事件时，禁止屏幕滚动以及下拉刷新 | 抖音小程序与飞书小程序不支持 |
+| hidpi | Boolean | true | 是否启用高清处理 | H5 (HBuilder X 3.4.0+)、App-vue (HBuilder X 3.4.0+) |
+
+#### Events
+
+| 事件名 | 类型 | 默认值 | 说明 | 平台差异说明 |
+| --- | --- | --- | --- | --- |
+| @touchstart | EventHandle |  | 手指触摸动作开始 | 抖音小程序1.78.0+、小红书小程序 |
+| @touchmove | EventHandle |  | 手指触摸后移动 | 抖音小程序1.78.0+、小红书小程序 |
+| @touchend | EventHandle |  | 手指触摸动作结束 | 抖音小程序1.78.0+、小红书小程序 |
+| @touchcancel | EventHandle |  | 手指触摸动作被打断，如来电提醒，弹窗 | 抖音小程序1.78.0+ |
+| @longtap | EventHandle |  | 手指长按 500ms 之后触发，触发了长按事件后进行移动不会触发屏幕的滚动 | 抖音小程序与飞书小程序不支持 |
+| @error | EventHandle |  | 当发生错误时触发 error 事件，detail = {errMsg: 'something wrong'} | 抖音小程序与飞书小程序不支持 |
+
+#### Platform Compatibility
+
+See official docs for platform support table: `https://doc.dcloud.net.cn/uni-app-x/component/canvas.html`
+
+### Examples
+
+### Example (Example 1)
+
+```vue
+<template>
+	<view>
+		<canvas style="width: 300px; height: 200px;" canvas-id="firstCanvas" id="firstCanvas"></canvas>
+		<canvas style="width: 400px; height: 500px;" canvas-id="secondCanvas" id="secondCanvas"></canvas>
+		<canvas style="width: 400px; height: 500px;" canvas-id="secondCanvas" id="secondCanvas" @error="canvasIdErrorCallback"></canvas>
+	</view>
+</template>
+```
+
+### Example (Example 2)
+
+```vue
+<template>
+	<view>
+		<canvas style="width: 300px; height: 200px;" canvas-id="firstCanvas" id="firstCanvas"></canvas>
+		<canvas style="width: 400px; height: 500px;" canvas-id="secondCanvas" id="secondCanvas"></canvas>
+		<canvas style="width: 400px; height: 500px;" canvas-id="secondCanvas" id="secondCanvas" @error="canvasIdErrorCallback"></canvas>
+	</view>
+</template>
+```
+
+### Example (Example 3)
+
+```vue
+<script>
+export default {
+	onReady: function (e) {
+		var context = uni.createCanvasContext('firstCanvas')
+		context.setStrokeStyle("#00ff00")
+		context.setLineWidth(5)
+		context.rect(0, 0, 200, 200)
+		context.stroke()
+		context.setStrokeStyle("#ff0000")
+		context.setLineWidth(2)
+		context.moveTo(160, 100)
+		context.arc(100, 100, 60, 0, 2 * Math.PI, true)
+		context.moveTo(140, 100)
+		context.arc(100, 100, 40, 0, Math.PI, false)
+		context.moveTo(85, 80)
+		context.arc(80, 80, 5, 0, 2 * Math.PI, true)
+		context.moveTo(125, 80)
+		context.arc(120, 80, 5, 0, 2 * Math.PI, true)
+		context.stroke()
+		context.draw()
+	},
+	methods: {
+		canvasIdErrorCallback: function (e) {
+			console.error(e.detail.errMsg)
+		}
+	}
+}
+</script>
+```
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/canvas.html)

.agents/bak-skills/uniappx-project/references/components/built-in/checkbox.md

@@ -0,0 +1,198 @@
+# checkbox
+
+## Instructions
+
+多选框组
+
+属性说明
+
+多选项。在1组check-group中可选择多个
+
+### Syntax
+
+- 使用 `<checkbox />`（或 `<checkbox></checkbox>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+See official docs for full properties list: `https://doc.dcloud.net.cn/uni-app-x/component/checkbox.html`
+
+#### Events
+
+| 事件名 | 类型 | 默认值 | 说明 |
+| --- | --- | --- | --- |
+| @change | EventHandle |  | <checkbox-group> 中选中项发生改变是触发 change 事件，detail = {value:[选中的checkbox的value的数组]} |
+
+#### Platform Compatibility
+
+See official docs for platform support table: `https://doc.dcloud.net.cn/uni-app-x/component/checkbox.html`
+
+### Examples
+
+### Example (Example 1)
+
+```vue
+<!-- 本示例未包含完整css，获取外链css请参考上文，在hello uni-app项目中查看 -->
+<template>
+	<view>
+		<view class="uni-padding-wrap uni-common-mt">
+			<view class="uni-title uni-common-mt">默认样式</view>
+			<view>
+				<checkbox-group>
+					<label>
+						<checkbox value="cb" :checked="true" />选中
+					</label>
+					<label>
+						<checkbox value="cb" />未选中
+					</label>
+				</checkbox-group>
+			</view>
+			<view class="uni-title uni-common-mt">不同颜色和尺寸的checkbox</view>
+			<view>
+				<checkbox-group>
+					<label>
+						<checkbox value="cb" :checked="true" color="#FFCC33" style="transform:scale(0.7)" />选中
+					</label>
+					<label>
+						<checkbox value="cb" color="#FFCC33" style="transform:scale(0.7)" />未选中
+					</label>
+				</checkbox-group>
+			</view>
+		</view>
+
+		<view class="uni-padding-wrap">
+			<view class="uni-title uni-common-mt">
+				推荐展示样式
+				<text>\n使用 uni-list 布局</text>
+			</view>
+		</view>
+		<view class="uni-list">
+			<checkbox-group @change="checkboxChange">
+				<label class="uni-list-cell uni-list-cell-pd" v-for="item in items" :key="item.value">
+					<view>
+						<checkbox :value="item.value" :checked="item.checked" />
+					</view>
+					<view>{{item.name}}</view>
+				</label>
+			</checkbox-group>
+		</view>
+	</view>
+</template>
+```
+
+### Example (Example 2)
+
+```vue
+<!-- 本示例未包含完整css，获取外链css请参考上文，在hello uni-app项目中查看 -->
+<template>
+	<view>
+		<view class="uni-padding-wrap uni-common-mt">
+			<view class="uni-title uni-common-mt">默认样式</view>
+			<view>
+				<checkbox-group>
+					<label>
+						<checkbox value="cb" :checked="true" />选中
+					</label>
+					<label>
+						<checkbox value="cb" />未选中
+					</label>
+				</checkbox-group>
+			</view>
+			<view class="uni-title uni-common-mt">不同颜色和尺寸的checkbox</view>
+			<view>
+				<checkbox-group>
+					<label>
+						<checkbox value="cb" :checked="true" color="#FFCC33" style="transform:scale(0.7)" />选中
+					</label>
+					<label>
+						<checkbox value="cb" color="#FFCC33" style="transform:scale(0.7)" />未选中
+					</label>
+				</checkbox-group>
+			</view>
+		</view>
+
+		<view class="uni-padding-wrap">
+			<view class="uni-title uni-common-mt">
+				推荐展示样式
+				<text>\n使用 uni-list 布局</text>
+			</view>
+		</view>
+		<view class="uni-list">
+			<checkbox-group @change="checkboxChange">
+				<label class="uni-list-cell uni-list-cell-pd" v-for="item in items" :key="item.value">
+					<view>
+						<checkbox :value="item.value" :checked="item.checked" />
+					</view>
+					<view>{{item.name}}</view>
+				</label>
+			</checkbox-group>
+		</view>
+	</view>
+</template>
+```
+
+### Example (Example 3)
+
+```vue
+<script>
+	export default {
+		data() {
+			return {
+				title: 'checkbox 复选框',
+				items: [{
+						value: 'USA',
+						name: '美国'
+					},
+					{
+						value: 'CHN',
+						name: '中国',
+						checked: 'true'
+					},
+					{
+						value: 'BRA',
+						name: '巴西'
+					},
+					{
+						value: 'JPN',
+						name: '日本'
+					},
+					{
+						value: 'ENG',
+						name: '英国'
+					},
+					{
+						value: 'FRA',
+						name: '法国'
+					}
+				]
+			}
+		},
+		methods: {
+			checkboxChange: function (e) {
+				var items = this.items,
+					values = e.detail.value;
+				for (var i = 0, lenI = items.length; i < lenI; ++i) {
+					const item = items[i]
+					if(values.includes(item.value)){
+						this.$set(item,'checked',true)
+					}else{
+						this.$set(item,'checked',false)
+					}
+				}
+			}
+		}
+	}
+</script>
+```
+
+### Example (Example 4)
+
+```vue
+<style>
+.uni-list-cell {
+	justify-content: flex-start
+}
+</style>
+```
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/checkbox.html)

.agents/bak-skills/uniappx-project/references/components/built-in/cover-image.md

@@ -0,0 +1,138 @@
+# cover-image
+
+## Instructions
+
+覆盖在原生组件上的图片视图。可覆盖的原生组件同 cover-view ，支持嵌套在 cover-view 里。
+
+平台差异说明
+
+属性说明
+
+### Syntax
+
+- 使用 `<cover-image />`（或 `<cover-image></cover-image>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+| 属性名 | 类型 | 默认值 | 说明 | 平台差异说明 |
+| --- | --- | --- | --- | --- |
+| src | String |  | 图标路径。支持本地路径、网络路径。不支持 base64 格式。 |  |
+
+#### Events
+
+| 事件名 | 类型 | 默认值 | 说明 | 平台差异说明 |
+| --- | --- | --- | --- | --- |
+| @load | eventhandle |  | 图片加载成功时触发 | 微信小程序 2.1.0、百度小程序、QQ小程序、快手小程序、京东小程序 |
+| @error | eventhandle |  | 图片加载失败时触发 | 微信小程序 2.1.0、百度小程序、QQ小程序、快手小程序、京东小程序 |
+
+#### Platform Compatibility
+
+See official docs for platform support table: `https://doc.dcloud.net.cn/uni-app-x/component/cover-image.html`
+
+### Examples
+
+### Example (Example 1)
+
+```vue
+<!-- 本示例未包含完整css，获取外链css请参考上文，在hello uni-app项目中查看 -->
+<template>
+	<view class="page">
+		<video class="video" id="demoVideo" :controls="false" :enable-progress-gesture="false" :show-center-play-btn="true" src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20181126-lite.m4v">
+			<cover-view class="controls-title">简单的自定义 controls</cover-view>
+			<cover-image class="controls-play img" @click="play" src="/static/play.png"></cover-image>
+			<cover-image class="controls-pause img" @click="pause" src="/static/pause.png"></cover-image>
+		</video>
+	</view>
+</template>
+```
+
+### Example (Example 2)
+
+```vue
+<!-- 本示例未包含完整css，获取外链css请参考上文，在hello uni-app项目中查看 -->
+<template>
+	<view class="page">
+		<video class="video" id="demoVideo" :controls="false" :enable-progress-gesture="false" :show-center-play-btn="true" src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20181126-lite.m4v">
+			<cover-view class="controls-title">简单的自定义 controls</cover-view>
+			<cover-image class="controls-play img" @click="play" src="/static/play.png"></cover-image>
+			<cover-image class="controls-pause img" @click="pause" src="/static/pause.png"></cover-image>
+		</video>
+	</view>
+</template>
+```
+
+### Example (Example 3)
+
+```vue
+<script>
+	export default {
+		data() {
+			return {}
+		},
+		mounted() {
+			this.videoCtx = uni.createVideoContext('demoVideo')
+		},
+		methods: {
+			play(event) {
+				this.videoCtx.play();
+				uni.showToast({
+					title: '开始播放',
+					icon: 'none'
+				});
+			},
+			pause(event) {
+				this.videoCtx.pause();
+				uni.showToast({
+					title: '暂停播放',
+					icon: 'none'
+				});
+			}
+		}
+	}
+</script>
+```
+
+### Example (Example 4)
+
+```vue
+<style>
+	.page {
+		display: flex;
+		justify-content: center;
+	}
+
+	.video {
+		position: relative;
+	}
+
+	cover-view,
+	cover-image {
+		display: inline-block;
+	}
+
+	.img {
+		position: absolute;
+		width: 100rpx;
+		height: 100rpx;
+		top: 50%;
+		margin-top: -50rpx;
+	}
+
+	.controls-play {
+		left: 50rpx;
+	}
+
+	.controls-pause {
+		right: 50rpx;
+	}
+
+	.controls-title {
+		width: 100%;
+		text-align: center;
+		color: #FFFFFF;
+	}
+</style>
+```
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/cover-image.html)

.agents/bak-skills/uniappx-project/references/components/built-in/cover-view.md

@@ -0,0 +1,34 @@
+# cover-view
+
+## Instructions
+
+覆盖在原生组件上的文本视图。
+
+app-vue和小程序框架，渲染引擎是webview的。但为了优化体验，部分组件如map、video、textarea、canvas通过原生控件实现，原生组件层级高于前端组件（类似flash层级高于div）。为了能正常覆盖原生组件，设计了cover-view。
+
+平台差异说明
+
+### Syntax
+
+- 使用 `<cover-view />`（或 `<cover-view></cover-view>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+| 属性名 | 类型 | 默认值 | 说明 | 平台差异说明 |
+| --- | --- | --- | --- | --- |
+| scroll-top | number/string |  | 设置顶部滚动偏移量，仅在设置了 overflow-y: scroll 成为滚动元素后生效 | 支付宝小程序不支持 |
+
+#### Events
+
+See official docs for full events list: `https://doc.dcloud.net.cn/uni-app-x/component/cover-view.html`
+
+#### Platform Compatibility
+
+See official docs for platform support table: `https://doc.dcloud.net.cn/uni-app-x/component/cover-view.html`
+
+### Examples
+
+Examples are available in the official docs: `https://doc.dcloud.net.cn/uni-app-x/component/cover-view.html`
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/cover-view.html)

.agents/bak-skills/uniappx-project/references/components/built-in/custom-tab-bar.md

@@ -0,0 +1,58 @@
+# custom-tab-bar
+
+## Instructions
+
+自定义tabBar组件。
+
+在小程序和App端，为提升性能，在 pages.json 里配置固定的原生tabBar。但在H5端，这一设计并不会提升性能。
+
+同时，H5端尤其是PC宽屏，对tabBar的位置和样式有更灵活的需求，tabBar作为一级导航，更多的时候是在PC网页顶部而不是底部。
+
+### Syntax
+
+- 使用 `<custom-tab-bar />`（或 `<custom-tab-bar></custom-tab-bar>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+| 属性名 | 类型 | 默认值 | 说明 |
+| --- | --- | --- | --- |
+| direction | String | horizontal | 选项的排列方向 可选值：horizontal，vertical |
+| show-icon | Boolean | false | 是否显示icon |
+| selected | Number | 0 | 选中的tabBar选项索引值 |
+
+#### Events
+
+| 事件名 | 类型 | 默认值 | 说明 |
+| --- | --- | --- | --- |
+| onTabItemTap | EventHandle |  | 点击事件，参数为Object，具体见下表 |
+
+#### Platform Compatibility
+
+See official docs for platform support table: `https://doc.dcloud.net.cn/uni-app-x/component/custom-tab-bar.html`
+
+### Examples
+
+### Example (Example 1)
+
+```vue
+<!-- 本示例未包含完整css，获取外链css请参考上文，在hello uni-app项目中的 top-window 查看 -->
+<template>
+    <view>
+        <custom-tab-bar direction="horizontal" :show-icon="false" :selected="selected" @onTabItemTap="onTabItemTap" />
+    </view>
+</template>
+```
+
+### Example (Example 2)
+
+```html
+<!-- 本示例未包含完整css，获取外链css请参考上文，在hello uni-app项目中的 top-window 查看 -->
+<template>
+    <view>
+        <custom-tab-bar direction="horizontal" :show-icon="false" :selected="selected" @onTabItemTap="onTabItemTap" />
+    </view>
+</template>
+```
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/custom-tab-bar.html)

.agents/bak-skills/uniappx-project/references/components/built-in/editor.md

@@ -0,0 +1,252 @@
+# editor
+
+## Instructions
+
+富文本编辑器，可以对图片、文字格式进行编辑和混排。
+
+在web开发时，可以使用 contenteditable 来实现内容编辑。但这是一个dom API，在非H5平台无法使用。于是微信小程序和uni-app的App-vue提供了 editor 组件来实现这个功能，并且在uni-app的H5平台也提供了兼容。从技术本质来讲，这个组件仍然运行在视图层webview中，利用的也是浏览器的 contenteditable 功能。
+
+编辑器导出内容支持带标签的 html 和纯文本的 text ，编辑器内部采用 delta 格式进行存储。
+
+### Syntax
+
+- 使用 `<editor />`（或 `<editor></editor>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+| 属性 | 类型 | 默认值 | 必填 | 说明 |
+| --- | --- | --- | --- | --- |
+| read-only | boolean | false | 否 | 设置编辑器为只读 |
+| placeholder | string |  | 否 | 提示信息 |
+| show-img-size | boolean | false | 否 | 点击图片时显示图片大小控件 |
+| show-img-toolbar | boolean | false | 否 | 点击图片时显示工具栏控件 |
+| show-img-resize | boolean | false | 否 | 点击图片时显示修改尺寸控件 |
+
+#### Events
+
+| 事件名 | 类型 | 默认值 | 必填 | 说明 |
+| --- | --- | --- | --- | --- |
+| @ready | eventhandle |  | 否 | 编辑器初始化完成时触发 |
+| @focus | eventhandle |  | 否 | 编辑器聚焦时触发，event.detail = {html, text, delta} |
+| @blur | eventhandle |  | 否 | 编辑器失去焦点时触发，detail = {html, text, delta} |
+| @input | eventhandle |  | 否 | 编辑器内容改变时触发，detail = {html, text, delta} |
+| @statuschange | eventhandle |  | 否 | 通过 Context 方法改变编辑器内样式时触发，返回选区已设置的样式 |
+
+#### Platform Compatibility
+
+See official docs for platform support table: `https://doc.dcloud.net.cn/uni-app-x/component/editor.html`
+
+### Examples
+
+### Example (Example 1)
+
+```vue
+<head>
+  <script src="/static/quill-1.3.7.min.js"></script>
+  <script src="/static/image-resize-3.0.1.min.js"></script>
+</head>
+```
+
+### Example (Example 2)
+
+```html
+<head>
+  <script src="/static/quill-1.3.7.min.js"></script>
+  <script src="/static/image-resize-3.0.1.min.js"></script>
+</head>
+```
+
+### Example (Example 3)
+
+```vue
+// #ifdef H5
+import quill from "quill";
+window.Quill = quill;
+// #endif
+```
+
+### Example (Example 4)
+
+```javascript
+// #ifdef H5
+import quill from "quill";
+window.Quill = quill;
+// #endif
+```
+
+### Example (Example 5)
+
+```vue
+<template>
+	<view class="container">
+		<view class="page-body">
+			<view class='wrapper'>
+				<view class='toolbar' @tap="format" style="height: 120px;overflow-y: auto;">
+					<view :class="formats.bold ? 'ql-active' : ''" class="iconfont icon-zitijiacu" data-name="bold">
+					</view>
+					<view :class="formats.italic ? 'ql-active' : ''" class="iconfont icon-zitixieti" data-name="italic">
+					</view>
+					<view :class="formats.underline ? 'ql-active' : ''" class="iconfont icon-zitixiahuaxian"
+						data-name="underline"></view>
+					<view :class="formats.strike ? 'ql-active' : ''" class="iconfont icon-zitishanchuxian"
+						data-name="strike"></view>
+					<!-- #ifndef MP-BAIDU -->
+					<view :class="formats.align === 'left' ? 'ql-active' : ''" class="iconfont icon-zuoduiqi"
+						data-name="align" data-value="left"></view>
+					<!-- #endif -->
+					<view :class="formats.align === 'center' ? 'ql-active' : ''" class="iconfont icon-juzhongduiqi"
+						data-name="align" data-value="center"></view>
+					<view :class="formats.align === 'right' ? 'ql-active' : ''" class="iconfont icon-youduiqi"
+						data-name="align" data-value="right"></view>
+					<view :class="formats.align === 'justify' ? 'ql-active' : ''" class="iconfont icon-zuoyouduiqi"
+						data-name="align" data-value="justify"></view>
+					<!-- #ifndef MP-BAIDU -->
+					<view :class="formats.lineHeight ? 'ql-active' : ''" class="iconfont icon-line-height"
+						data-name="lineHeight" data-value="2"></view>
+					<view :class="formats.letterSpacing ? 'ql-active' : ''" class="iconfont icon-Character-Spacing"
+						data-name="letterSpacing" data-value="2em"></view>
+					<view :class="formats.marginTop ? 'ql-active' : ''" class="iconfont icon-722bianjiqi_duanqianju"
+						data-name="marginTop" data-value="20px"></view>
+					<view :class="formats.marginBottom ? 'ql-active' : ''" class="iconfont icon-723bianjiqi_duanhouju"
+						data-name="marginBottom" data-value="20px"></view>
+					<!-- #endif -->
+
+					<view class="iconfont icon-clearedformat" @tap="removeFormat"></view>
+
+					<!-- #ifndef MP-BAIDU -->
+					<view :class="formats.fontFamily ? 'ql-active' : ''" class="iconfont icon-font"
+						data-name="fontFamily" data-value="Pacifico"></view>
+					<view :class="formats.fontSize === '24px' ? 'ql-active' : ''" class="iconfont icon-fontsize"
+						data-name="fontSize" data-value="24px"></view>
+					<!-- #endif -->
+					<view :class="formats.color === '#0000ff' ? 'ql-active' : ''" class="iconfont icon-text_color"
+						data-name="color" data-value="#0000ff"></view>
+					<view :class="formats.backgroundColor === '#00ff00' ? 'ql-active' : ''"
+						class="iconfont icon-fontbgcolor" data-name="backgroundColor" data-value="#00ff00"></view>
+					<view class="iconfont icon-date" @tap="insertDate"></view>
+					<view class="iconfont icon--checklist" data-name="list" data-value="check"></view>
+					<view :class="formats.list === 'ordered' ? 'ql-active' : ''" class="iconfont icon-youxupailie"
+						data-name="list" data-value="ordered"></view>
+					<view :class="formats.list === 'bullet' ? 'ql-active' : ''" class="iconfont icon-wuxupailie"
+						data-name="list" data-value="bullet"></view>
+
+					<view class="iconfont icon-undo" @tap="undo"></view>
+					<view class="iconfont icon-redo" @tap="redo"></view>
+
+					<view class="iconfont icon-outdent" data-name="indent" data-value="-1"></view>
+					<view class="iconfont icon-indent" data-name="indent" data-value="+1"></view>
+					<view class="iconfont icon-fengexian" @tap="insertDivider"></view>
+					<view class="iconfont icon-charutupian" @tap="insertImage"></view>
+					<view :class="formats.header === 1 ? 'ql-active' : ''" class="iconfont icon-format-header-1"
+						data-name="header" :data-value="1"></view>
+					<view :class="formats.script === 'sub' ? 'ql-active' : ''" class="iconfont icon-zitixiabiao"
+						data-name="script" data-value="sub"></view>
+					<view :class="formats.script === 'super' ? 'ql-active' : ''" class="iconfont icon-zitishangbiao"
+						data-name="script" data-value="super"></view>
+
+					<view class="iconfont icon-shanchu" @tap="clear"></view>
+
+					<view :class="formats.direction === 'rtl' ? 'ql-active' : ''" class="iconfont icon-direction-rtl"
+						data-name="direction" data-value="rtl"></view>
+				</view>
+
+				<view class="editor-wrapper">
+					<editor id="editor" class="ql-container" placeholder="开始输入..." show-img-size show-img-toolbar
+						show-img-resize @statuschange="onStatusChange" :read-only="readOnly" @ready="onEditorReady">
+					</editor>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+```
+
+### Example (Example 6)
+
+```vue
+<template>
+	<view class="container">
+		<view class="page-body">
+			<view class='wrapper'>
+				<view class='toolbar' @tap="format" style="height: 120px;overflow-y: auto;">
+					<view :class="formats.bold ? 'ql-active' : ''" class="iconfont icon-zitijiacu" data-name="bold">
+					</view>
+					<view :class="formats.italic ? 'ql-active' : ''" class="iconfont icon-zitixieti" data-name="italic">
+					</view>
+					<view :class="formats.underline ? 'ql-active' : ''" class="iconfont icon-zitixiahuaxian"
+						data-name="underline"></view>
+					<view :class="formats.strike ? 'ql-active' : ''" class="iconfont icon-zitishanchuxian"
+						data-name="strike"></view>
+					<!-- #ifndef MP-BAIDU -->
+					<view :class="formats.align === 'left' ? 'ql-active' : ''" class="iconfont icon-zuoduiqi"
+						data-name="align" data-value="left"></view>
+					<!-- #endif -->
+					<view :class="formats.align === 'center' ? 'ql-active' : ''" class="iconfont icon-juzhongduiqi"
+						data-name="align" data-value="center"></view>
+					<view :class="formats.align === 'right' ? 'ql-active' : ''" class="iconfont icon-youduiqi"
+						data-name="align" data-value="right"></view>
+					<view :class="formats.align === 'justify' ? 'ql-active' : ''" class="iconfont icon-zuoyouduiqi"
+						data-name="align" data-value="justify"></view>
+					<!-- #ifndef MP-BAIDU -->
+					<view :class="formats.lineHeight ? 'ql-active' : ''" class="iconfont icon-line-height"
+						data-name="lineHeight" data-value="2"></view>
+					<view :class="formats.letterSpacing ? 'ql-active' : ''" class="iconfont icon-Character-Spacing"
+						data-name="letterSpacing" data-value="2em"></view>
+					<view :class="formats.marginTop ? 'ql-active' : ''" class="iconfont icon-722bianjiqi_duanqianju"
+						data-name="marginTop" data-value="20px"></view>
+					<view :class="formats.marginBottom ? 'ql-active' : ''" class="iconfont icon-723bianjiqi_duanhouju"
+						data-name="marginBottom" data-value="20px"></view>
+					<!-- #endif -->
+
+					<view class="iconfont icon-clearedformat" @tap="removeFormat"></view>
+
+					<!-- #ifndef MP-BAIDU -->
+					<view :class="formats.fontFamily ? 'ql-active' : ''" class="iconfont icon-font"
+						data-name="fontFamily" data-value="Pacifico"></view>
+					<view :class="formats.fontSize === '24px' ? 'ql-active' : ''" class="iconfont icon-fontsize"
+						data-name="fontSize" data-value="24px"></view>
+					<!-- #endif -->
+					<view :class="formats.color === '#0000ff' ? 'ql-active' : ''" class="iconfont icon-text_color"
+						data-name="color" data-value="#0000ff"></view>
+					<view :class="formats.backgroundColor === '#00ff00' ? 'ql-active' : ''"
+						class="iconfont icon-fontbgcolor" data-name="backgroundColor" data-value="#00ff00"></view>
+					<view class="iconfont icon-date" @tap="insertDate"></view>
+					<view class="iconfont icon--checklist" data-name="list" data-value="check"></view>
+					<view :class="formats.list === 'ordered' ? 'ql-active' : ''" class="iconfont icon-youxupailie"
+						data-name="list" data-value="ordered"></view>
+					<view :class="formats.list === 'bullet' ? 'ql-active' : ''" class="iconfont icon-wuxupailie"
+						data-name="list" data-value="bullet"></view>
+
+					<view class="iconfont icon-undo" @tap="undo"></view>
+					<view class="iconfont icon-redo" @tap="redo"></view>
+
+					<view class="iconfont icon-outdent" data-name="indent" data-value="-1"></view>
+					<view class="iconfont icon-indent" data-name="indent" data-value="+1"></view>
+					<view class="iconfont icon-fengexian" @tap="insertDivider"></view>
+					<view class="iconfont icon-charutupian" @tap="insertImage"></view>
+					<view :class="formats.header === 1 ? 'ql-active' : ''" class="iconfont icon-format-header-1"
+						data-name="header" :data-value="1"></view>
+					<view :class="formats.script === 'sub' ? 'ql-active' : ''" class="iconfont icon-zitixiabiao"
+						data-name="script" data-value="sub"></view>
+					<view :class="formats.script === 'super' ? 'ql-active' : ''" class="iconfont icon-zitishangbiao"
+						data-name="script" data-value="super"></view>
+
+					<view class="iconfont icon-shanchu" @tap="clear"></view>
+
+					<view :class="formats.direction === 'rtl' ? 'ql-active' : ''" class="iconfont icon-direction-rtl"
+						data-name="direction" data-value="rtl"></view>
+				</view>
+
+				<view class="editor-wrapper">
+					<editor id="editor" class="ql-container" placeholder="开始输入..." show-img-size show-img-toolbar
+						show-img-resize @statuschange="onStatusChange" :read-only="readOnly" @ready="onEditorReady">
+					</editor>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+```
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/editor.html)

.agents/bak-skills/uniappx-project/references/components/built-in/form.md

@@ -0,0 +1,238 @@
+# form
+
+## Instructions
+
+表单，将组件内的用户输入的 <switch> <input> <checkbox> <slider> <radio> <picker> 提交。
+
+当点击 <form> 表单中 formType 为 submit 的 <button> 组件时，会将表单组件中的 value 值进行提交，需要在表单组件中加上 name 来作为 key。
+
+属性说明
+
+### Syntax
+
+- 使用 `<form />`（或 `<form></form>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+| 属性名 | 类型 | 说明 | 平台差异说明 |
+| --- | --- | --- | --- |
+| report-submit | Boolean | 是否返回 formId 用于发送 模板消息 | 微信小程序、支付宝小程序 |
+| report-submit-timeout | number | 等待一段时间（毫秒数）以确认 formId 是否生效。如果未指定这个参数，formId 有很小的概率是无效的（如遇到网络失败的情况）。指定这个参数将可以检测 formId 是否有效，以这个参数的时间作为这项检测的超时时间。如果失败，将返回 requestFormId:fail 开头的 formId | 微信小程序2.6.2 |
+
+#### Events
+
+| 事件名 | 类型 | 说明 | 平台差异说明 |
+| --- | --- | --- | --- |
+| @submit | EventHandle | 携带 form 中的数据触发 submit 事件，event.detail = {value : {'name': 'value'} , formId: ''}，report-submit 为 true 时才会返回 formId |  |
+| @reset | EventHandle | 表单重置时会触发 reset 事件 |  |
+
+#### Platform Compatibility
+
+See official docs for platform support table: `https://doc.dcloud.net.cn/uni-app-x/component/form.html`
+
+### Examples
+
+### Example (Example 1)
+
+```vue
+<!-- 本示例未包含完整css，获取外链css请参考上文，在hello uni-app项目中查看 -->
+<template>
+	<view>
+		<view>
+			<form @submit="formSubmit" @reset="formReset">
+				<view class="uni-form-item uni-column">
+					<view class="title">switch</view>
+					<view>
+						<switch name="switch" />
+					</view>
+				</view>
+				<view class="uni-form-item uni-column">
+					<view class="title">radio</view>
+					<radio-group name="radio">
+						<label>
+							<radio value="radio1" /><text>选项一</text>
+						</label>
+						<label>
+							<radio value="radio2" /><text>选项二</text>
+						</label>
+					</radio-group>
+				</view>
+				<view class="uni-form-item uni-column">
+					<view class="title">checkbox</view>
+					<checkbox-group name="checkbox">
+						<label>
+							<checkbox value="checkbox1" /><text>选项一</text>
+						</label>
+						<label>
+							<checkbox value="checkbox2" /><text>选项二</text>
+						</label>
+					</checkbox-group>
+				</view>
+				<view class="uni-form-item uni-column">
+					<view class="title">slider</view>
+					<slider value="50" name="slider" show-value></slider>
+				</view>
+				<view class="uni-form-item uni-column">
+					<view class="title">input</view>
+					<input class="uni-input" name="input" placeholder="这是一个输入框" />
+				</view>
+				<view class="uni-btn-v">
+					<button form-type="submit">Submit</button>
+					<button type="default" form-type="reset">Reset</button>
+				</view>
+			</form>
+		</view>
+	</view>
+</template>
+```
+
+### Example (Example 2)
+
+```vue
+<!-- 本示例未包含完整css，获取外链css请参考上文，在hello uni-app项目中查看 -->
+<template>
+	<view>
+		<view>
+			<form @submit="formSubmit" @reset="formReset">
+				<view class="uni-form-item uni-column">
+					<view class="title">switch</view>
+					<view>
+						<switch name="switch" />
+					</view>
+				</view>
+				<view class="uni-form-item uni-column">
+					<view class="title">radio</view>
+					<radio-group name="radio">
+						<label>
+							<radio value="radio1" /><text>选项一</text>
+						</label>
+						<label>
+							<radio value="radio2" /><text>选项二</text>
+						</label>
+					</radio-group>
+				</view>
+				<view class="uni-form-item uni-column">
+					<view class="title">checkbox</view>
+					<checkbox-group name="checkbox">
+						<label>
+							<checkbox value="checkbox1" /><text>选项一</text>
+						</label>
+						<label>
+							<checkbox value="checkbox2" /><text>选项二</text>
+						</label>
+					</checkbox-group>
+				</view>
+				<view class="uni-form-item uni-column">
+					<view class="title">slider</view>
+					<slider value="50" name="slider" show-value></slider>
+				</view>
+				<view class="uni-form-item uni-column">
+					<view class="title">input</view>
+					<input class="uni-input" name="input" placeholder="这是一个输入框" />
+				</view>
+				<view class="uni-btn-v">
+					<button form-type="submit">Submit</button>
+					<button type="default" form-type="reset">Reset</button>
+				</view>
+			</form>
+		</view>
+	</view>
+</template>
+```
+
+### Example (Example 3)
+
+```vue
+<script>
+	export default {
+		data() {
+			return {
+			}
+		},
+		methods: {
+			formSubmit: function(e) {
+				console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value))
+				var formdata = e.detail.value
+				uni.showModal({
+					content: '表单数据内容：' + JSON.stringify(formdata),
+					showCancel: false
+				});
+			},
+			formReset: function(e) {
+				console.log('清空数据')
+			}
+		}
+	}
+</script>
+```
+
+### Example (Example 4)
+
+```vue
+<style>
+	.uni-form-item .title {
+		padding: 20rpx 0;
+	}
+</style>
+```
+
+### Example (Example 5)
+
+```vue
+<!-- /pages/index/index.vue -->
+<template>
+    <view class="content">
+        <form @submit="onSubmit">
+            <compInput name="test" v-model="testValue"></compInput>
+            <button form-type="submit">Submit</button>
+        </form>
+    </view>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                testValue: 'Hello'
+            }
+        },
+        methods: {
+            onSubmit(e) {
+                console.log(e)
+            }
+        }
+    }
+</script>
+```
+
+### Example (Example 6)
+
+```html
+<!-- /pages/index/index.vue -->
+<template>
+    <view class="content">
+        <form @submit="onSubmit">
+            <compInput name="test" v-model="testValue"></compInput>
+            <button form-type="submit">Submit</button>
+        </form>
+    </view>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                testValue: 'Hello'
+            }
+        },
+        methods: {
+            onSubmit(e) {
+                console.log(e)
+            }
+        }
+    }
+</script>
+```
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/form.html)

.agents/bak-skills/uniappx-project/references/components/built-in/icon.md

@@ -0,0 +1,99 @@
+# icon
+
+## Instructions
+
+图标。
+
+平台差异说明
+
+属性说明
+
+### Syntax
+
+- 使用 `<icon />`（或 `<icon></icon>`，当需要包裹子节点时）。
+- 遇到平台差异时，建议使用条件编译（`#ifdef / #endif`）显式处理。
+
+#### Properties
+
+| 属性名 | 类型 | 默认值 | 说明 |
+| --- | --- | --- | --- |
+| type | String |  | icon的类型 |
+| size | Number | 23 | icon的大小，单位px |
+| color | Color |  | icon的颜色，同css的color |
+| view-box | number | 1024 | 小红书小程序 |
+
+#### Events
+
+See official docs for full events list: `https://doc.dcloud.net.cn/uni-app-x/component/icon.html`
+
+#### Platform Compatibility
+
+See official docs for platform support table: `https://doc.dcloud.net.cn/uni-app-x/component/icon.html`
+
+### Examples
+
+### Example (Example 1)
+
+```vue
+<view class="item" v-for="(value,index) in iconType" :key="index">
+    <icon :type="value" size="26"/>
+    <text>{{value}}</text>
+</view>
+```
+
+### Example (Example 2)
+
+```html
+<view class="item" v-for="(value,index) in iconType" :key="index">
+    <icon :type="value" size="26"/>
+    <text>{{value}}</text>
+</view>
+```
+
+### Example (Example 3)
+
+```vue
+export default {
+    data() {
+        return {
+            iconType: ['success']
+        }
+    },
+    onLoad() {
+        // #ifdef APP-PLUS|| MP-WEIXIN
+        this.iconType = ['success', 'success_no_circle', 'info', 'warn', 'waiting', 'cancel', 'download', 'search','clear']
+        // #endif
+        // #ifdef MP-ALIPAY
+        this.iconType = ['info', 'warn', 'waiting', 'cancel', 'download', 'search', 'clear', 'success', 'success_no_circle', 'loading']
+        // #endif
+        // #ifdef MP-BAIDU
+        this.iconType = ['success', 'info', 'warn', 'waiting', 'success_no_circle', 'clear', 'search', 'personal', 'setting', 'top', 'close', 'cancel', 'download', 'checkboxSelected', 'radioSelected', 'radioUnselect']
+        // #endif
+    }
+}
+```
+
+### Example (Example 4)
+
+```javascript
+export default {
+    data() {
+        return {
+            iconType: ['success']
+        }
+    },
+    onLoad() {
+        // #ifdef APP-PLUS|| MP-WEIXIN
+        this.iconType = ['success', 'success_no_circle', 'info', 'warn', 'waiting', 'cancel', 'download', 'search','clear']
+        // #endif
+        // #ifdef MP-ALIPAY
+        this.iconType = ['info', 'warn', 'waiting', 'cancel', 'download', 'search', 'clear', 'success', 'success_no_circle', 'loading']
+        // #endif
+        // #ifdef MP-BAIDU
+        this.iconType = ['success', 'info', 'warn', 'waiting', 'success_no_circle', 'clear', 'search', 'personal', 'setting', 'top', 'close', 'cancel', 'download', 'checkboxSelected', 'radioSelected', 'radioUnselect']
+        // #endif
+    }
+}
+```
+
+Reference: [Official Documentation](https://doc.dcloud.net.cn/uni-app-x/component/icon.html)