首页 发现 帮助
注册 登录
genlitex
/
prototype_design
1
0
派生 0
文件 工单管理 0 合并请求 0 Wiki
浏览代码

hunk-2025-02-18 00:38:20

genlitex 2 月之前
父节点
62324cbe91
当前提交
165a4d1631
共有 9 个文件被更改，包括 330 次插入 和 12 次删除
合并视图 显示文件统计
  1. 4 0
      dist/assets/index-BeBWLpau.js
  2. 0 4
      dist/assets/index-CLQU_RzH.js
  3. 0 0
      dist/assets/index-CQJ2CCRj.css
  4. 2 2
      dist/index.html
  5. 11 2
      src/assets/common.css
  6. 12 0
      src/router/index.js
  7. 122 0
      src/views/ChatInterface.vue
  8. 5 4
      src/views/HomeView.vue
  9. 174 0
      src/views/Login.vue

文件差异内容过多而无法显示
+ 4 - 0
dist/assets/index-BeBWLpau.js


文件差异内容过多而无法显示
+ 0 - 4
dist/assets/index-CLQU_RzH.js


文件差异内容过多而无法显示
+ 0 - 0
dist/assets/index-CQJ2CCRj.css


+ 2 - 2
dist/index.html
查看文件 

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

+ 11 - 2
src/assets/common.css
查看文件 

@@ -1,3 +1,12 @@
 
 body {
 
 body {
 
-    
-}
 
+  background: linear-gradient(to bottom, #6a11cb 0%, #2575fc 100%);
 
+}
 
+
 
+.chat-container {
 
+  background-color: rgba(255, 255, 255, 0.9);
 
+  border-radius: 10px;
 
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
 
+  max-width: 600px;
 
+  margin: auto;
 
+  padding: 20px;
 
+}

+ 12 - 0
src/router/index.js
查看文件 

@@ -1,11 +1,23 @@
 
 import { createRouter, createWebHashHistory } from 'vue-router'
 
 import { createRouter, createWebHashHistory } from 'vue-router'
 
 import HomeView from '../views/HomeView.vue'
 
 import HomeView from '../views/HomeView.vue'
 
+import ChatInterface from '../views/ChatInterface.vue'
 
+import LoginView from '../views/Login.vue'
 
 
 
 const routes = [
 
 const routes = [
 
   {
 
   {
 
     path: '/',
 
     path: '/',
 
     name: 'home',
 
     name: 'home',
 
     component: HomeView
 
     component: HomeView
 
+  },
 
+  {
 
+    path: '/login',
 
+    name: 'login',
 
+    component: LoginView
 
+  },
 
+  {
 
+    path: '/chat',
 
+      name: 'ChatInterface',
 
+      component: ChatInterface
 
   }
 
   }
 
 ]
 
 ]

+ 122 - 0
src/views/ChatInterface.vue
查看文件 

@@ -0,0 +1,122 @@
 
+<template>
 
+  <div class="chat-container">
 
+    <h1>Chat Interface</h1>
 
+    <div class="dialog-box">
 
+      <div v-for="(message, index) in messages" :key="index" :class="{ 'message-left': message.startsWith('You:'), 'message-right': !message.startsWith('You:') }">
 
+        {{ message }}
 
+      </div>
 
+    </div>
 
+    <input v-model="message" placeholder="Type a message...">
 
+    <button @click="sendMessage">Send</button>
 
+    <div class="upload-list">
 
+      <ul>
 
+        <li v-for="(file, index) in uploadedFiles" :key="index">{{ file.name }}</li>
 
+      </ul>
 
+    </div>
 
+    <input type="file" @change="handleFileUpload">
 
+  </div>
 
+</template>
 
+
 
+<script>
 
+export default {
 
+  data() {
 
+    return {
 
+      message: '',
 
+      messages: [
 
+        'Hello!',
 
+        'How are you doing today?',
 
+        'Let me know if you need anything.',
 
+      ],
 
+      uploadedFiles: [
 
+        { name: 'file1.txt' },
 
+        { name: 'image1.jpg' },
 
+        { name: 'document1.pdf' },
 
+      ]
 
+    };
 
+  },
 
+  methods: {
 
+    sendMessage() {
 
+      this.messages.push(this.message);
 
+      this.message = '';
 
+    },
 
+    handleFileUpload(event) {
 
+      const file = event.target.files[0];
 
+      if (file) {
 
+        this.uploadedFiles.push(file);
 
+      }
 
+    }
 
+  }
 
+};
 
+</script>
 
+
 
+<style scoped>
 
+.chat-container {
 
+  width: 80%;
 
+  max-width: 800px;
 
+  height: 95%;
 
+  display: flex;
 
+  flex-direction: column;
 
+  margin: auto;
 
+  background-color: rgba(255, 255, 255, 0.9);
 
+  border-radius: 10px;
 
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
 
+  position: relative;
 
+}
 
+.button-container {
 
+  display: flex;
 
+  justify-content: center;
 
+  align-items: center;
 
+}
 
+.button-container button {
 
+  background-color: blue !important;
 
+  color: white;
 
+  border: none;
 
+  padding: 10px 20px;
 
+  font-size: 16px;
 
+  cursor: pointer;
 
+  border-radius: 5px;
 
+  margin-top: 10px;
 
+}
 
+.button-container button:hover {
 
+  background-color: #2575fc;
 
+}
 
+
 
+.dialog-box {
 
+  flex-grow: 1;
 
+  overflow-y: auto;
 
+  border: 1px solid #ccc;
 
+  padding: 10px;
 
+  margin-bottom: 10px;
 
+}
 
+
 
+.message-left {
 
+  margin-bottom: 10px;
 
+  text-align: left;
 
+}
 
+
 
+.message-right {
 
+  margin-bottom: 10px;
 
+  text-align: right;
 
+}
 
+
 
+.upload-list ul {
 
+  list-style-type: none;
 
+  padding: 0;
 
+}
 
+
 
+.upload-list li {
 
+  margin-bottom: 5px;
 
+}
 
+
 
+input {
 
+  width: 100%;
 
+  padding: 10px;
 
+  font-size: 16px;
 
+}
 
+
 
+button {
 
+  padding: 10px;
 
+  font-size: 16px;
 
+  cursor: pointer;
 
+}
 
+</style>

+ 5 - 4
src/views/HomeView.vue
查看文件 

@@ -1,13 +1,14 @@
 
 <template>
 
 <template>
 
-  <div class="home">
 
-    <h2>欢迎使用Prototype Design, 请您根据您的需要设计您的Prototype</h2>
 
-  </div>
 
+    <div class="home">
 
+      <h2 style="color: white;">欢迎使用Prototype Design, 请您根据您的需要设计您的Prototype</h2>
 
+      <router-link to="/login" style="color: lightgray;">Login</router-link>
 
+    </div>
 
 </template>
 
 </template>
 
 
 
 <script>
 
 <script>
 
-
 
 export default {}
 
 export default {}
 
 </script>
 
 </script>
 
+
 
 <style>
 
 <style>
 
 .home {
 
 .home {
 
   height: 100vh;
 
   height: 100vh;

+ 174 - 0
src/views/Login.vue
查看文件 

@@ -0,0 +1,174 @@
 
+<template>
 
+  <div class="login-container">
 
+    <h2 style="color: black;" v-text="translatedTitle"></h2>
 
+    <p style="color: purple;">{{ translatedMessages.welcomeMessage }}</p>
 
+    <div>
 
+      <label for="languageSelect">Language:</label>
 
+      <select id="languageSelect" v-model="selectedLanguage">
 
+        <option value="en">English</option>
 
+        <option value="zh">中文</option>
 
+      </select>
 
+    </div>
 
+    <form @submit.prevent="handleSubmit">
 
+      <div>
 
+        <label for="username">{{ translatedLabels.username }}</label>
 
+        <input id="username" v-model="username" type="text" required />
 
+      </div>
 
+      <div>
 
+        <label for="password">{{ translatedLabels.password }}</label>
 
+        <input id="password" v-model="password" type="password" required />
 
+      </div>
 
+      <div>
 
+        <label for="rememberMe"><input id="rememberMe" type="checkbox" v-model="rememberMe"> {{ translatedLabels.rememberMe }}</label>
 
+      </div>
 
+      <button type="submit">{{ translatedButtons.login }}</button>
 
+      <div class="process-flow">
 
+        <span>Requirement Management</span>
 
+        <span>&rarr;</span>
 
+        <span>Design</span>
 
+        <span>&rarr;</span>
 
+        <span>Build</span>
 
+        <span>&rarr;</span>
 
+        <span>Test</span>
 
+        <span>&rarr;</span>
 
+        <span>Deploy & Release</span>
 
+        <span>&rarr;</span>
 
+        <span>Operation</span>
 
+      </div>
 
+    </form>
 
+  </div>
 
+</template>
 
+
 
+<script>
 
+export default {
 
+  data() {
 
+    return {
 
+      username: '',
 
+      password: '',
 
+      rememberMe: false,
 
+      selectedLanguage: 'en',
 
+      translations: {
 
+        en: {
 
+          title: 'Welcome to Chatbot of TDLC',
 
+          labels: {
 
+            username: 'Username:',
 
+            password: 'Password:',
 
+            rememberMe: 'Remember Me'
 
+          },
 
+          buttons: {
 
+            login: 'Login'
 
+          },
 
+          messages: {
 
+            welcomeMessage: 'This is a Prototype Design generated by GenLiteX, the current generation is for demonstration purposes only.'
 
+          }
 
+        },
 
+        zh: {
 
+          title: '欢迎使用TDLC聊天机器人',
 
+          labels: {
 
+            username: '用户名：',
 
+            password: '密码：',
 
+            rememberMe: '记住我'
 
+          },
 
+          buttons: {
 
+            login: '登录'
 
+          },
 
+          messages: {
 
+            welcomeMessage: '这是一个由“GenLiteX生成的Prototype Design的界面，当前生成仅用于示例'
 
+          }
 
+        }
 
+      }
 
+    };
 
+  },
 
+  computed: {
 
+    translatedTitle() {
 
+      return this.translations[this.selectedLanguage].title;
 
+    },
 
+    translatedLabels() {
 
+      return this.translations[this.selectedLanguage].labels;
 
+    },
 
+    translatedButtons() {
 
+      return this.translations[this.selectedLanguage].buttons;
 
+    },
 
+    translatedMessages() {
 
+      return this.translations[this.selectedLanguage].messages;
 
+    }
 
+  },
 
+  methods: {
 
+    handleSubmit() {
 
+      if (this.username === 'admin' && this.password === 'admin') {
 
+        this.$router.push({ name: 'ChatInterface' }).then(() => {
 
+          console.log('Redirected to ChatInterface');
 
+        }).catch(err => {
 
+          console.error('Navigation failed:', err);
 
+        });
 
+      } else {
 
+        alert('无效的用户名或密码。');
 
+      }
 
+      this.rememberMeCredentials();
 
+    },
 
+    rememberMeCredentials() {
 
+      if (this.rememberMe) {
 
+        localStorage.setItem('username', this.username);
 
+        localStorage.setItem('password', this.password);
 
+      }
 
+    },
 
+    retrieveRememberedCredentials() {
 
+      this.username = localStorage.getItem('username') || '';
 
+      this.password = localStorage.getItem('password') || '';
 
+    }
 
+  },
 
+  mounted() {
 
+    this.retrieveRememberedCredentials();
 
+  }
 
+};
 
+</script>
 
+
 
+<style scoped>
 
+  .login-container {
 
+    width: 80%;
 
+    max-width: 800px;
 
+    margin: auto;
 
+    padding: 20px;
 
+    background-color: rgba(255, 255, 255, 0.9);
 
+    border-radius: 10px;
 
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
 
+    display: flex;
 
+    flex-direction: column;
 
+    align-items: center;
 
+  }
 
+
 
+  .login-container label {
 
+    margin-bottom: 5px;
 
+  }
 
+
 
+  .login-container select {
 
+    margin-bottom: 10px;
 
+  }
 
+
 
+  .login-container input {
 
+    margin-bottom: 10px;
 
+    width: 100%;
 
+    padding: 10px;
 
+  }
 
+
 
+    .login-container button {
 
+      width: 100%;
 
+      padding: 10px;
 
+    }
 
+    .process-flow {
 
+      display: flex;
 
+      flex-wrap: nowrap;
 
+      align-items: center;
 
+      margin-top: 10px;
 
+    }
 
+    .process-flow span {
 
+      font-style: italic;
 
+      font-size: 14px; /* Adjusted font size */
 
+      margin-right: 5px; /* Adjusted margin */
 
+    }
 
+    .process-flow span {
 
+      font-style: italic;
 
+      font-size: 12px; /* Reduced font size */
 
+      margin-right: 10px; /* Adjusted margin */
 
+    }
 
+</style>

部分文件因为文件数量过多而无法显示