Procházet zdrojové kódy

zbytest003-2025-02-18 08:32:55

genlitex před 2 měsíci
rodič
revize
eb10b0a35e

+ 1 - 0
dist/assets/ChatView-Bk7SukK-.css

@@ -0,0 +1 @@
+.chat-container[data-v-0b489c62]{display:flex;height:100vh}.sidebar[data-v-0b489c62]{width:15%;background-color:purple;color:#fff;padding:1rem}.demand-list ul[data-v-0b489c62]{list-style-type:none;padding:0}.demand-list li[data-v-0b489c62]{cursor:pointer}.chat-main[data-v-0b489c62]{flex-grow:1;display:flex;flex-direction:column}.chat-header[data-v-0b489c62]{background:linear-gradient(to right,#6a11cb,#2575fc);color:#fff;padding:1rem}.chat-messages[data-v-0b489c62]{flex-grow:1;overflow-y:auto;padding:1rem}.message[data-v-0b489c62]{margin:.5rem 0;border-radius:5px;box-shadow:0 1px 3px #0000001f;padding:.5rem 1rem}.user-message[data-v-0b489c62]{background-color:green;align-self:flex-end}.bot-message[data-v-0b489c62]{background-color:#d3d3d3;align-self:flex-start}footer[data-v-0b489c62]{display:flex;align-items:center;padding:1rem;border-top:1px solid #ddd}footer input[type=text][data-v-0b489c62]{flex-grow:1;border:1px solid #ccc;border-radius:3px;padding:.5rem;margin-right:.5rem}.send-button[data-v-0b489c62]{background-color:#00f;color:#fff;border:none;border-radius:3px;padding:.5rem 1rem;cursor:pointer}

+ 1 - 0
dist/assets/ChatView-CG3VMgO4.js

@@ -0,0 +1 @@
+import{_ as i,c as d,a as e,w as o,v as r,b as u,o as m}from"./index-xQKz-Fz-.js";const g={data(){return{messageText:"",fileList:[]}},methods:{sendMessage(){this.messageText.trim()&&(this.$emit("user-message",this.messageText),this.messageText="")},handleFileUpload(a){this.fileList.push(a.target.files[0])}}},p={class:"chat-container"},f={class:"chat-main"};function x(a,s,h,v,n,t){return m(),d("div",p,[s[7]||(s[7]=e("aside",{class:"sidebar"},[e("section",{class:"demand-list"},[e("h2",null,"需求"),e("ul",null,[e("li",null,"需求1"),e("li",null,"需求2")])])],-1)),e("main",f,[s[5]||(s[5]=e("header",null,[e("div",{class:"chat-header"},"聊天界面")],-1)),s[6]||(s[6]=e("section",{class:"chat-messages"},[e("div",{class:"message user-message"},[e("p",null,"用户输入的问题")]),e("div",{class:"message bot-message"},[e("p",null,"正在建设中...")])],-1)),e("footer",null,[o(e("input",{type:"text",placeholder:"输入消息...","onUpdate:modelValue":s[0]||(s[0]=l=>n.messageText=l),onKeyup:s[1]||(s[1]=u((...l)=>t.sendMessage&&t.sendMessage(...l),["enter"]))},null,544),[[r,n.messageText]]),e("button",{onClick:s[2]||(s[2]=(...l)=>t.sendMessage&&t.sendMessage(...l)),class:"send-button"},"发送"),s[4]||(s[4]=e("label",null,"上传文件",-1)),e("input",{type:"file",onChange:s[3]||(s[3]=(...l)=>t.handleFileUpload&&t.handleFileUpload(...l))},null,32)])])])}const T=i(g,[["render",x],["__scopeId","data-v-0b489c62"]]);export{T as default};

Rozdílová data souboru nebyla zobrazena, protože soubor je příliš velký
+ 0 - 0
dist/assets/index-BtM_Gz6j.css


Rozdílová data souboru nebyla zobrazena, protože soubor je příliš velký
+ 0 - 4
dist/assets/index-malWbV8K.js


Rozdílová data souboru nebyla zobrazena, protože soubor je příliš velký
+ 5 - 0
dist/assets/index-xQKz-Fz-.js


+ 2 - 2
dist/index.html

@@ -4,8 +4,8 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Prototype Design</title>
-    <script type="module" crossorigin src="/prototype/3000/assets/index-malWbV8K.js"></script>
-    <link rel="stylesheet" crossorigin href="/prototype/3000/assets/index-Btspm7_H.css">
+    <script type="module" crossorigin src="/ide/proxy/6001/assets/index-xQKz-Fz-.js"></script>
+    <link rel="stylesheet" crossorigin href="/ide/proxy/6001/assets/index-BtM_Gz6j.css">
   </head>
   <body>
     <div id="app"></div>

+ 92 - 0
src/assets/chat-style.css

@@ -0,0 +1,92 @@
+.chat-container {
+  display: flex;
+  height: 100vh;
+}
+
+.sidebar {
+  width: 15%;
+  background-color: purple;
+  color: white;
+  padding: 1rem;
+}
+
+.demand-list ul {
+  list-style-type: none;
+  padding: 0;
+}
+
+.demand-list li {
+  cursor: pointer;
+}
+
+.chat-main {
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+}
+
+.chat-header {
+  background: linear-gradient(to right, #6a11cb 0%, #2575fc 100%);
+  color: white;
+  padding: 1rem;
+}
+
+.chat-messages {
+  flex-grow: 1;
+  overflow-y: auto;
+  padding: 1rem;
+}
+
+.message {
+  margin: 0.5rem 0;
+  border-radius: 5px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
+  padding: 0.5rem 1rem;
+}
+
+.user-message {
+  background-color: green;
+  align-self: flex-end;
+}
+
+.bot-message {
+  background-color: lightgray;
+  align-self: flex-start;
+}
+
+footer {
+  display: flex;
+  align-items: center;
+  padding: 1rem;
+  border-top: 1px solid #ddd;
+}
+
+footer input[type="text"] {
+  flex-grow: 1;
+  border: 1px solid #ccc;
+  border-radius: 3px;
+  padding: 0.5rem;
+  margin-right: 0.5rem;
+}
+
+.send-button {
+  background-color: blue;
+  color: white;
+  border: none;
+  border-radius: 3px;
+  padding: 0.5rem 1rem;
+  cursor: pointer;
+}
+
+.upload-file {
+  background-color: #f0f0f0;
+  border: 1px solid #ccc;
+  border-radius: 3px;
+  padding: 0.5rem;
+  cursor: pointer;
+  transition: background-color 0.3s ease;
+}
+
+.upload-file:hover {
+  background-color: #e0e0e0;
+}

binární
src/assets/img/a.png


+ 5 - 0
src/router/index.js

@@ -6,6 +6,11 @@ const routes = [
     path: '/',
     name: 'home',
     component: HomeView
+  },
+  {
+    path: '/chat',
+    name: 'Chat',
+    component: () => import('../views/ChatView.vue')
   }
 ]
 

+ 138 - 0
src/views/ChatView.vue

@@ -0,0 +1,138 @@
+<template>
+  <div class="chat-container">
+    <aside class="sidebar">
+      <section class="demand-list">
+        <h2>需求</h2>
+        <ul>
+          <li>需求1</li>
+          <li>需求2</li>
+          <!-- Add more items as needed -->
+        </ul>
+      </section>
+    </aside>
+    <main class="chat-main">
+      <header>
+        <div class="chat-header">聊天界面</div>
+      </header>
+      <section class="chat-messages">
+        <div class="message user-message">
+          <p>用户输入的问题</p>
+        </div>
+        <div class="message bot-message">
+          <p>正在建设中...</p>
+        </div>
+        <!-- Add more messages as needed -->
+      </section>
+      <footer>
+        <input type="text" placeholder="输入消息..." v-model="messageText" @keyup.enter="sendMessage" />
+        <button @click="sendMessage" class="send-button">发送</button>
+        <label>上传文件</label>
+        <input type="file" @change="handleFileUpload" />
+      </footer>
+    </main>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      messageText: '',
+      fileList: []
+    };
+  },
+  methods: {
+    sendMessage() {
+      if (this.messageText.trim()) {
+        this.$emit('user-message', this.messageText);
+        this.messageText = '';
+      }
+    },
+    handleFileUpload(event) {
+      this.fileList.push(event.target.files[0]);
+    }
+  }
+};
+</script>
+
+<style scoped>
+.chat-container {
+  display: flex;
+  height: 100vh;
+}
+
+.sidebar {
+  width: 15%;
+  background-color: purple;
+  color: white;
+  padding: 1rem;
+}
+
+.demand-list ul {
+  list-style-type: none;
+  padding: 0;
+}
+
+.demand-list li {
+  cursor: pointer;
+}
+
+.chat-main {
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+}
+
+.chat-header {
+  background: linear-gradient(to right, #6a11cb 0%, #2575fc 100%);
+  color: white;
+  padding: 1rem;
+}
+
+.chat-messages {
+  flex-grow: 1;
+  overflow-y: auto;
+  padding: 1rem;
+}
+
+.message {
+  margin: 0.5rem 0;
+  border-radius: 5px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
+  padding: 0.5rem 1rem;
+}
+
+.user-message {
+  background-color: green;
+  align-self: flex-end;
+}
+
+.bot-message {
+  background-color: lightgray;
+  align-self: flex-start;
+}
+
+footer {
+  display: flex;
+  align-items: center;
+  padding: 1rem;
+  border-top: 1px solid #ddd;
+}
+
+footer input[type="text"] {
+  flex-grow: 1;
+  border: 1px solid #ccc;
+  border-radius: 3px;
+  padding: 0.5rem;
+  margin-right: 0.5rem;
+}
+
+.send-button {
+  background-color: blue;
+  color: white;
+  border: none;
+  border-radius: 3px;
+  padding: 0.5rem 1rem;
+  cursor: pointer;
+}
+</style>

Některé soubory nejsou zobrazeny, neboť je v těchto rozdílových datech změněno mnoho souborů