From 5156e51fc6231f276808782a3248913253726c71 Mon Sep 17 00:00:00 2001
From: hawk86104 <hawk86104@163.com>
Date: Thu, 9 Nov 2023 09:32:41 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=85=B3=E4=BA=8E=E6=88=91?=
 =?UTF-8?q?=E4=BB=AC=E7=9A=84=E4=BB=8B=E7=BB=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/aboutUs.vue | 72 ++++++++++++++++++++++++++++++++++++++
 src/pages/index.vue        | 17 +++++++--
 2 files changed, 87 insertions(+), 2 deletions(-)
 create mode 100644 src/components/aboutUs.vue

diff --git a/src/components/aboutUs.vue b/src/components/aboutUs.vue
new file mode 100644
index 00000000..f48593fc
--- /dev/null
+++ b/src/components/aboutUs.vue
@@ -0,0 +1,72 @@
+<!--
+ * @Description: 
+ * @Version: 1.668
+ * @Autor: 地虎降天龙
+ * @Date: 2023-11-09 09:05:30
+ * @LastEditors: 地虎降天龙
+ * @LastEditTime: 2023-11-09 09:30:36
+-->
+<template>
+	<FDivider titlePlacement="left">关于我们 - ICEGL</FDivider>
+	<div class="article-text">
+		<p>
+			<img style="width:200px;"
+				src="https://icegl-1314935952.cos.ap-beijing.myqcloud.com/uploads/20221122/9ed6756107c4e0c031ae26d54cb46c0d.png">
+		</p>
+		<p>
+			欢迎来到 <strong><span style="color:#337FE5;">ICE</span></strong> 「<em>Image、Community、Education</em>」图形学社区，围绕 webgl
+			的交流学习社区，这里是国内最全的 Web 图形学知识库，同时也是一个致力于打造全新图形学生态体系的社区。
+		</p>
+		<p>
+			我们的使命是通过开源协作和知识分享，促进图形学技术的不断进步。我们相信图形学是一个无限创新的领域，可以应用于游戏开发、虚拟现实、增强现实、计算机辅助设计等多个领域。
+		</p>
+		<h3 class="text-center" style="color:#337FE5;"><strong>🤔 问题反馈</strong></h3>
+		<p>
+			在使用中有任何问题，请使用以下联系方式联系我们
+			<a href="https://www.icegl.cn/ask">图形学社区icegl.cn</a>
+		</p>
+		<p>
+			<img src="https://icegl-1314935952.cos.ap-beijing.myqcloud.com/uploads/20230421/QQ20230421-121209.png" width="680">
+		</p>
+		<h3 class="text-center" style="color:#337FE5;"><strong>🧑‍💻 联系我们</strong></h3>
+		<p>
+			欢迎大家也加入微信群，已有几个群已满，一起学习讨论webgl。加微信我拉进群
+		</p>
+		<p>
+			<img
+				src="https://icegl-1314935952.cos.ap-beijing.myqcloud.com/uploads/20230731/17d59bab46815cce1f4f1e09dcbb6ccc.png"
+				width="300">
+		</p>
+	</div>
+</template>
+<script setup lang="ts">
+import { FDivider } from '@fesjs/fes-design';
+
+</script>
+
+<style lang="less" scoped>
+.article-text {
+	line-height: 30px;
+	margin-bottom: 15px;
+	padding: 0px 20px;
+
+	p {
+		text-indent: 2em;
+		/* 首行缩进2个字母的距离 */
+	}
+
+	img {
+		margin: 10px auto;
+		display: block;
+		max-width: 100%;
+		height: auto;
+		cursor: zoom-in;
+		-webkit-border-radius: 2px;
+		-webkit-background-clip: padding-box;
+		-moz-border-radius: 2px;
+		-moz-background-clip: padding;
+		border-radius: 2px;
+		background-clip: padding-box;
+	}
+}
+</style>
\ No newline at end of file
diff --git a/src/pages/index.vue b/src/pages/index.vue
index 05c8a9df..0b43eb29 100644
--- a/src/pages/index.vue
+++ b/src/pages/index.vue
@@ -4,7 +4,7 @@
  * @Autor: 地虎降天龙
  * @Date: 2023-10-16 10:53:09
  * @LastEditors: 地虎降天龙
- * @LastEditTime: 2023-11-05 10:15:59
+ * @LastEditTime: 2023-11-09 09:21:34
 -->
 <template>
     <div class="flex h-full">
@@ -32,6 +32,15 @@
                         </f-menu-item>
                     </template>
                 </f-sub-menu>
+                <f-sub-menu value="8">
+                    <template #icon>
+                        <ClusterOutlined />
+                    </template>
+                    <template #label>aboutUs</template>
+                    <f-menu-item value="abus">
+                        <template #label>关于我们</template>
+                    </f-menu-item>
+                </f-sub-menu>
             </f-menu>
         </div>
         <div class="flex-1 overflow-scroll" style="height: calc(100vh - 54px);">
@@ -46,6 +55,9 @@
                     </div>
                 </template>
             </template>
+            <div style="background-color: rgb(255 255 255);" :ref="el => tabListRef.abus = el">
+                <aboutUs />
+            </div>
         </div>
     </div>
 </template>
@@ -53,9 +65,10 @@
 <script setup lang="ts">
 import { ref } from 'vue';
 import { defineRouteMeta } from '@fesjs/fes'; //fesJS的路由被他自己封装了
-import { AppstoreOutlined, PictureOutlined } from '@fesjs/fes-design/icon';
+import { AppstoreOutlined, PictureOutlined, ClusterOutlined } from '@fesjs/fes-design/icon';
 import { getPluginsConfig } from '../common/utils';
 import cardList from '../components/cardList.vue'
+import aboutUs from '../components/aboutUs.vue'
 
 defineRouteMeta({
     name: 'index',