From 5d37c32081b5a090e2193742db6621da682c9fd7 Mon Sep 17 00:00:00 2001
From: oneao <hi_itao@163.com>
Date: Tue, 10 Feb 2026 22:31:44 +0800
Subject: [PATCH] u

---
 code/allapp/allapp-rn/test.html | 243 ++++++++++++++------------------
 1 file changed, 106 insertions(+), 137 deletions(-)

diff --git a/code/allapp/allapp-rn/test.html b/code/allapp/allapp-rn/test.html
index 3e583052..0d2256e0 100644
--- a/code/allapp/allapp-rn/test.html
+++ b/code/allapp/allapp-rn/test.html
@@ -1,161 +1,130 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="zh-CN">
 <head>
-  <meta charset="UTF-8">
-  <title>日期选择 Picker Demo</title>
-  <link rel="stylesheet" href="https://unpkg.com/element-plus/dist/index.css" />
+  <meta charset="UTF-8" />
+  <title>biz_key 私聊演示</title>
   <style>
     body {
-      font-family: sans-serif;
-      padding: 20px;
+      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI",
+        Helvetica, Arial, sans-serif;
+      background: #f5f7fa;
+      padding: 40px;
     }
-    .category-tabs {
+
+    h1 {
+      margin-bottom: 24px;
+    }
+
+    .container {
       display: flex;
-      gap: 10px;
-      margin-bottom: 10px;
-      flex-wrap: wrap;
+      gap: 24px;
+      align-items: flex-start;
     }
-    .category-tab {
-      padding: 6px 12px;
-      border: 1px solid #ccc;
-      border-radius: 4px;
-      cursor: pointer;
-      transition: all 0.2s;
+
+    .card {
+      background: #fff;
+      border-radius: 8px;
+      padding: 16px;
+      width: 240px;
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
     }
-    .category-tab.active {
-      background-color: #409eff;
-      color: white;
-      border-color: #409eff;
+
+    .card h2 {
+      font-size: 16px;
+      margin-bottom: 12px;
+      border-bottom: 1px solid #eee;
+      padding-bottom: 8px;
     }
-    .shortcut-options {
-      display: flex;
-      gap: 10px;
-      margin-top: 10px;
-      flex-wrap: wrap;
+
+    .user {
+      padding: 10px;
+      margin-bottom: 8px;
+      background: #f0f3f7;
+      border-radius: 6px;
     }
-    .shortcut-option {
-      padding: 6px 12px;
-      border: 1px solid #ccc;
-      border-radius: 4px;
-      cursor: pointer;
-      transition: all 0.2s;
+
+    .arrow {
+      font-size: 32px;
+      margin: 0 8px;
+      align-self: center;
     }
-    .shortcut-option.active {
-      background-color: #67c23a;
-      color: white;
-      border-color: #67c23a;
+
+    .biz {
+      background: #e8f3ff;
+      border: 1px dashed #409eff;
+      padding: 12px;
+      border-radius: 6px;
+      text-align: center;
+      font-weight: bold;
+      color: #409eff;
+    }
+
+    .db-row {
+      background: #f6ffed;
+      border: 1px solid #b7eb8f;
+      padding: 10px;
+      border-radius: 6px;
+      margin-bottom: 8px;
+      font-family: monospace;
+      font-size: 13px;
+    }
+
+    .note {
+      margin-top: 24px;
+      color: #666;
+      font-size: 14px;
     }
   </style>
 </head>
 <body>
-  <div id="app">
-    <h2>日期选择器 Demo</h2>
-    
-    <!-- 分类标签 -->
-    <div class="category-tabs">
-      <div 
-        v-for="cat in categories" 
-        :key="cat" 
-        class="category-tab" 
-        :class="{ active: selectedCategory === cat }" 
-        @click="selectCategory(cat)"
-      >
-        {{ cat }}
-      </div>
-    </div>
-    
-    <!-- 日期选择器 -->
-    <el-date-picker
-      v-model="dateValue"
-      :type="pickerType"
-      placeholder="请选择日期"
-      :value-format="valueFormat"
-      style="width: 100%;"
-    ></el-date-picker>
+  <h1>biz_key 私聊唯一性演示</h1>
 
-    <!-- 快捷选项 -->
-    <div class="shortcut-options">
-      <div 
-        v-for="item in shortcuts" 
-        :key="item.label" 
-        class="shortcut-option"
-        :class="{ active: activeShortcut === item.label }"
-        @click="applyShortcut(item)"
-      >
-        {{ item.label }}
+  <div class="container">
+    <!-- 用户 -->
+    <div class="card">
+      <h2>用户</h2>
+      <div class="user">用户 A<br />user_id = 1</div>
+      <div class="user">用户 B<br />user_id = 2</div>
+    </div>
+
+    <div class="arrow">➡️</div>
+
+    <!-- biz_key -->
+    <div class="card">
+      <h2>biz_key 生成</h2>
+      <div class="biz">
+        min(1,2) _ max(1,2)<br />
+        = <br />
+        <strong>1_2</strong>
+      </div>
+      <div class="note">
+        不管 A→B 还是 B→A<br />
+        biz_key 都是一样的
       </div>
     </div>
 
-    <div style="margin-top: 20px;">
-      <strong>选择的值:</strong> {{ dateValue }}
+    <div class="arrow">➡️</div>
+
+    <!-- 数据库 -->
+    <div class="card">
+      <h2>数据库会话表</h2>
+      <div class="db-row">
+        id: 1001<br />
+        space_id: 100<br />
+        type: 私聊<br />
+        biz_key: 1_2
+      </div>
+      <div class="note">
+        唯一索引：<br />
+        (space_id, type, biz_key)
+      </div>
     </div>
   </div>
 
-  <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
-  <script src="https://unpkg.com/element-plus/dist/index.full.js"></script>
-  <script>
-    const { createApp, ref } = Vue
-    const { ElDatePicker } = ElementPlus
-
-    createApp({
-      setup() {
-        const categories = ['日', '月', '年', '时间', '日期', '范围', '不限']
-        const selectedCategory = ref('日')
-        const dateValue = ref(null)
-        const activeShortcut = ref(null)
-
-        const shortcuts = [
-          { label: '今天', getValue: () => new Date() },
-          { label: '本月', getValue: () => {
-            const now = new Date()
-            return [new Date(now.getFullYear(), now.getMonth(), 1), new Date(now.getFullYear(), now.getMonth() + 1, 0)]
-          }},
-          { label: '本年', getValue: () => {
-            const now = new Date()
-            return [new Date(now.getFullYear(), 0, 1), new Date(now.getFullYear(), 11, 31)]
-          }},
-        ]
-
-        const pickerType = Vue.computed(() => {
-          switch(selectedCategory.value){
-            case '日': return 'date'
-            case '月': return 'month'
-            case '年': return 'year'
-            case '时间': return 'time'
-            case '日期': return 'date'
-            case '范围': return 'daterange'
-            case '不限': return 'date'
-            default: return 'date'
-          }
-        })
-
-        const valueFormat = Vue.computed(() => {
-          switch(selectedCategory.value){
-            case '日': return 'yyyy-MM-dd'
-            case '月': return 'yyyy-MM'
-            case '年': return 'yyyy'
-            case '时间': return 'HH:mm:ss'
-            case '日期': return 'yyyy-MM-dd'
-            case '范围': return 'yyyy-MM-dd'
-            case '不限': return 'yyyy-MM-dd'
-            default: return 'yyyy-MM-dd'
-          }
-        })
-
-        function selectCategory(cat) {
-          selectedCategory.value = cat
-          dateValue.value = null
-          activeShortcut.value = null
-        }
-
-        function applyShortcut(item) {
-          activeShortcut.value = item.label
-          dateValue.value = item.getValue()
-        }
-
-        return { categories, selectedCategory, dateValue, pickerType, valueFormat, shortcuts, activeShortcut, selectCategory, applyShortcut }
-      }
-    }).use(ElementPlus).mount('#app')
-  </script>
+  <div class="note">
+    👉 结论：<br />
+    <strong>biz_key = “这是谁和谁的私聊”</strong><br />
+    <strong>id = “数据库给它的编号”</strong>
+  </div>
 </body>
 </html>