From dd29c9a2fa83f37881bd7edf4f4fb7f7936451af Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=A9=99=E5=AD=90?= <454313500@qq.com>
Date: Sat, 2 Nov 2024 19:50:01 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20bbs=E6=96=B0=E5=A2=9E=E5=95=86=E5=9F=8E?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E5=88=9D=E7=89=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../activity/components/ActivityNav.vue       |  6 ++
 Yi.Bbs.Vue3/src/router/index.js               | 10 ++-
 Yi.Bbs.Vue3/src/views/shop/Index.vue          | 74 +++++++++++++++++++
 .../src/views/shop/components/ShopCard.vue    | 29 ++++++++
 4 files changed, 118 insertions(+), 1 deletion(-)
 create mode 100644 Yi.Bbs.Vue3/src/views/shop/Index.vue
 create mode 100644 Yi.Bbs.Vue3/src/views/shop/components/ShopCard.vue

diff --git a/Yi.Bbs.Vue3/src/layout/activity/components/ActivityNav.vue b/Yi.Bbs.Vue3/src/layout/activity/components/ActivityNav.vue
index 6f701609..d7491165 100644
--- a/Yi.Bbs.Vue3/src/layout/activity/components/ActivityNav.vue
+++ b/Yi.Bbs.Vue3/src/layout/activity/components/ActivityNav.vue
@@ -35,6 +35,12 @@
       </el-icon>
       <span>排行榜</span>
     </el-menu-item>
+    <el-menu-item index="7" :route="{ path: '/money' }">
+      <el-icon>
+        <ShoppingCart />
+      </el-icon>
+      <span>商城（即将上线）</span>
+    </el-menu-item>
   </el-menu>
 
 </template>
diff --git a/Yi.Bbs.Vue3/src/router/index.js b/Yi.Bbs.Vue3/src/router/index.js
index 48abff7e..c2669e12 100644
--- a/Yi.Bbs.Vue3/src/router/index.js
+++ b/Yi.Bbs.Vue3/src/router/index.js
@@ -117,7 +117,15 @@ const router = createRouter({
           path:"/money",
           component: () => import("../views/money/Index.vue"),
           meta: {
-            title: "钱钱",
+            title: "钱钱排行榜",
+          },
+        },
+        {
+          name:"shop",
+          path:"/shop",
+          component: () => import("../views/shop/Index.vue"),
+          meta: {
+            title: "商城",
           },
         },
       ],
diff --git a/Yi.Bbs.Vue3/src/views/shop/Index.vue b/Yi.Bbs.Vue3/src/views/shop/Index.vue
new file mode 100644
index 00000000..8f7d28cc
--- /dev/null
+++ b/Yi.Bbs.Vue3/src/views/shop/Index.vue
@@ -0,0 +1,74 @@
+<template>
+  <div class="content-body">
+
+    <div class="title">
+      意社区-商城
+    </div>
+    <div class="header">
+      <span >你的钱钱
+       <el-tooltip effect="dark" content="社区通用货币，（来源：通过社区活动获取）" placement="top-start">
+             <el-icon><InfoFilled/></el-icon>
+        </el-tooltip>
+        ：50</span>
+      
+      
+      <span>你的价值
+         <el-tooltip effect="dark" content="数字藏品账号价值，（来源：通过社区小程序数字藏品获取）" placement="top-start">
+             <el-icon><InfoFilled/></el-icon>
+        </el-tooltip>
+        ：70</span>
+      
+      <span> 你的积分
+         <el-tooltip effect="dark" content="邀请码积分，（来源：通过社区小程序个人中心邀请获取）" placement="top-start">
+             <el-icon><InfoFilled/></el-icon>
+        </el-tooltip>
+        ：40</span>
+    </div>
+    
+    <div class="shop">
+      <el-row :gutter="30">
+        <el-col :span="6" v-for="i in 10">
+          <ShopCard/>
+        </el-col>
+      </el-row>
+    </div>
+  </div>
+
+</template>
+<style scoped>
+.header span {
+  margin-left: 50px;
+}
+
+.el-col {
+  margin: 10px 0;
+}
+
+.content-body {
+  margin-bottom: 40px;
+  margin-top: 20px;
+  padding: 20px;
+  background-color: #ffffff;
+  width: 60%;
+
+  .title {
+    display: flex;
+    justify-content: center;
+    font-size: 40px;
+    margin-bottom: 20px;
+  }
+
+  .header {
+    display: flex;
+    justify-content: center;
+    margin-bottom: 40px;
+  }
+
+  .shop {
+    display: flex;
+  }
+}
+</style>
+<script setup lang="ts">
+import ShopCard from "./components/ShopCard.vue";
+</script>
\ No newline at end of file
diff --git a/Yi.Bbs.Vue3/src/views/shop/components/ShopCard.vue b/Yi.Bbs.Vue3/src/views/shop/components/ShopCard.vue
new file mode 100644
index 00000000..cd11cf1a
--- /dev/null
+++ b/Yi.Bbs.Vue3/src/views/shop/components/ShopCard.vue
@@ -0,0 +1,29 @@
+<template>
+  <el-card  shadow="hover">
+    <template #header>商品-物品A</template>
+    <img
+        src="https://ccnetcore.com/prod-api/wwwroot/logo.png"
+        style="width: 100%"
+     alt=""/>
+    <ul>
+      <li>所需钱钱（扣除）：666</li>
+      <li>所需价值（拥有）：777</li>
+      <li>所需积分（拥有）：888</li>
+      <li>限制数量：1</li>
+    </ul>
+    <el-divider />
+    <div class="bottom"> 
+      <el-button type="success">申请购买</el-button>
+    </div>
+  </el-card>
+</template>
+<script setup lang="ts">
+</script>
+<style scoped lang="scss">
+.bottom
+{
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 20px;
+}
+</style>
\ No newline at end of file