From 07d88bfb8181fd97f72c24b48929ad651d602907 Mon Sep 17 00:00:00 2001
From: haoxuan <haoxuan>
Date: 星期四, 02 十一月 2023 13:57:21 +0800
Subject: [PATCH] 知识库的组件开发

---
 src/views/dashboard/components/KnowledgeInfo.vue |  107 +++++++++++++----------------------------------------
 1 files changed, 26 insertions(+), 81 deletions(-)

diff --git a/src/views/dashboard/components/KnowledgeInfo.vue b/src/views/dashboard/components/KnowledgeInfo.vue
index 1768889..89f387f 100644
--- a/src/views/dashboard/components/KnowledgeInfo.vue
+++ b/src/views/dashboard/components/KnowledgeInfo.vue
@@ -1,94 +1,39 @@
 <template>
   <div class="knowledge-info">
-    <svg width="100%" height="100%">
-      <text
-        class="text-item"
-        x="60"
-        y="80"
-        style="
-          fill: rgb(211 211 211);
-          font-weight: bold;
-          padding: 5px;
-          font-size: 14px;
-          display: inline-block;
-          border-radius: 8px;
-          cursor: pointer;
-          postion: absolute;
-          left: 200;
-          top: 40;
-        "
-      >
-        璇姤璀�
-      </text>
-      <text
-        class="text-item"
-        x="50"
-        y="170"
-        text-anchor="middle"
-        style="padding: 5px; font-size: 14px; display: inline-block; border-radius: 8px; fill: rgb(211 211 211)"
-      >
-        绠¤矾鏁村姩
-      </text>
-      <text
-        class="text-item"
-        x="245"
-        y="250"
-        text-anchor="middle"
-        font-size="20px"
-        style="padding: 5px; font-size: 14px; display: inline-block; border-radius: 8px; fill: rgb(211 211 211)"
-      >
-        鍐峰嵈娌瑰害楂�
-      </text>
-      <text
-        x="50"
-        y="270"
-        class="text-item"
-        style="padding: 5px; font-size: 14px; display: inline-block; border-radius: 8px; fill: rgb(211 211 211)"
-        text-anchor="middle"
-      >
-        娓呮磥搴﹁秴宸�
-      </text>
-      <text
-        x="220"
-        class="text-item"
-        y="60"
-        text-anchor="middle"
-        font-size="20px"
-        style="padding: 5px; font-size: 14px; display: inline-block; border-radius: 8px; fill: rgb(211 211 211)"
-      >
-        娓呮磥搴﹁秴宸�
-      </text>
-      <text
-        x="280"
-        class="text-item"
-        y="110"
-        text-anchor="middle"
-        font-size="20px"
-        style="padding: 5px; font-size: 14px; display: inline-block; border-radius: 8px"
-      >
-        淇濇姢鍣ㄦ姤璀�
-      </text>
-      <image xlink:href="~@/assets/images/voice.png" x="105" y="100" width="110" height="110" />
-    </svg>
+    <div class="text-item" style="left: 20px; top: 80px">璇姤璀�</div>
+    <div class="text-item" style="left: 0px; top: 190px">绠¤矾鏁村姩</div>
+    <div class="text-item" style="left: 215px; top: 250px">鍐峰嵈娌瑰害楂�</div>
+    <div class="text-item" style="left: 160px; top: 20px">娓呮磥搴﹁秴宸�</div>
+    <div class="text-item" style="left: 30px; top: 280px">娓呮磥搴﹁秴宸�</div>
+    <div class="text-item" style="right: 0px; top: 120px">淇濇姢鍣ㄦ姤璀�</div>
+    <img src="~@/assets/images/voice.png" />
   </div>
 </template>
 
-<script setup lang="ts">
-import { toRefs } from 'vue'
-</script>
+<script setup lang="ts"></script>
 <style scoped lang="scss">
+$status-ready: #024fdce8;
 .knowledge-info {
-  height: calc(100% - 90px - 32px);
-  margin-top: 10px;
+  height: calc(100% - 100px - 32px);
+  margin-top: 30px;
+  position: relative;
+  img {
+    width: 130px;
+    height: 130px;
+    position: absolute;
+    top: 100px;
+    left: 120px;
+  }
   .text-item {
-    width: 100px;
-    padding: 5px;
+    color: #e9e7e7;
+    cursor: pointer;
+    font-weight: bold;
+    padding: 6px 15px;
     font-size: 14px;
     display: inline-block;
-    border-radius: 8px;
-    fill: #fff;
-    color: #fff;
-    cursor: pointer;
+    border-radius: 10px;
+    position: absolute;
+    background: $status-ready;
   }
 }
 </style>

--
Gitblit v1.8.0