feat(property-marketing): 新增月数据复制功能，优化组件样式布局

2025-07-10 19:05:38 +08:00
parent 78b21b1bf7
commit a5c92999b1
3 changed files with 336 additions and 0 deletions
--- a/src/views/Agent/Chat/index.vue
+++ b/src/views/Agent/Chat/index.vue
@ -0,0 +1,76 @@
+<template>
+  <div class="app-container">
+    <h1>我的应用</h1>
+
+    <!-- 聊天组件 -->
+    <CozeChat :bot-id="cozeConfig.botId" :title="cozeConfig.title" :token="authToken" />
+
+    <!-- Token刷新按钮（示例） -->
+    <button @click="refreshToken" class="refresh-btn">刷新Token</button>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue';
+import CozeChat from './components/CozeChat.vue';
+
+export default {
+  components: { CozeChat },
+  setup() {
+    const cozeConfig = ref({
+      botId: '7522056630889381923',
+      title: 'AI客服',
+    });
+
+    // 存储认证令牌
+    const authToken = ref('');
+
+    // 模拟从API获取token
+    const fetchToken = async () => {
+      return 'pat_tuIM7jubM1hLXaIWzbWg1U15lBe66AlYwu9BkXMQXInh8VdPszRFTwlTPmdziHwg';
+      // 实际项目中应调用后端API
+      // return new Promise((resolve) => {
+      //   setTimeout(() => {
+      //     // 生成模拟token
+      //     const mockToken = 'pat_' + Math.random().toString(36).substring(2, 15);
+      //     resolve(mockToken);
+      //   }, 500);
+      // });
+    };
+
+    // 刷新token
+    const refreshToken = async () => {
+      authToken.value = await fetchToken();
+    };
+
+    // 初始化时获取token
+    onMounted(async () => {
+      authToken.value = await fetchToken();
+    });
+  },
+};
+</script>
+
+<style>
+.app-container {
+  max-width: 800px;
+  margin: 0 auto;
+  padding: 20px;
+  font-family: Arial, sans-serif;
+}
+
+.refresh-btn {
+  margin-top: 20px;
+  padding: 10px 20px;
+  background: #2ecc71;
+  color: white;
+  border: none;
+  border-radius: 4px;
+  cursor: pointer;
+  transition: background 0.3s;
+}
+
+.refresh-btn:hover {
+  background: #27ae60;
+}
+</style>