From 7aca0c112e8029855240213bd6aa266781a8001b Mon Sep 17 00:00:00 2001
From: Qing <landaiqing@126.com>
Date: Sun, 2 Jul 2023 11:12:50 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E6=A0=87=E7=AD=BE=E6=9F=A5?=
 =?UTF-8?q?=E8=AF=A2=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Home/Home.vue           | 223 +++++++++++++------------
 src/components/Home/ManageCategory.vue |  12 +-
 2 files changed, 130 insertions(+), 105 deletions(-)

diff --git a/src/components/Home/Home.vue b/src/components/Home/Home.vue
index 5706c9b..5c0fa9d 100644
--- a/src/components/Home/Home.vue
+++ b/src/components/Home/Home.vue
@@ -11,8 +11,8 @@
                     <div class="bottom clearfix">
                         <el-scrollbar style="height:50vh">
                         <el-tabs v-model="currentTabName" tab-position="left" @tab-click="typeChange" lazy>
-                            <el-tab-pane  v-for="(tag,index) in tags" :key="index" :index="tag.index" :name="tag.name" >
-                                <span slot="label" style="border-radius: 10px;align-items: center;display: flex;flex-direction: row;justify-content: flex-start" v-html="tag.icon"></span>
+                            <el-tab-pane  v-for="(tag,index) in tags" :key="index" :index="tag.categoryId" :name="tag.categoryName" >
+                                <span slot="label" style="border-radius: 10px;align-items: center;display: flex;flex-direction: row;justify-content: flex-start" v-html="tag.category"></span>
                             </el-tab-pane>
                         </el-tabs>
                         </el-scrollbar>
@@ -263,6 +263,7 @@ export default {
                 password: [{required: true, message: "请输入密码", trigger: "blur"}],
                 code: [{required: true, message: "请输入验证码", trigger: "blur"}],
             },
+            tags:null,
             // tags:['<i class="el-icon-discover"></i> 综 合',
             //     '<i class="el-ico-alicyuyan"></i> C++',
             //     '<i class="el-ico-aliPython"></i> python',
@@ -271,104 +272,105 @@ export default {
             //     `<i class="el-ico-alioutline-java-script"></i> javaScript`,
             //     `<i class="el-ico-alicaishichang-"></i> 教 程`,
             //     ],
-            tags:[
-                {
-                    index:0,
-                    icon: `<i class="el-icon-discover" style="margin-right: 10px"></i> 综合`,
-                    name:"综合"
-                },
-                {
-                    index:1,
-                    icon: `<i class="el-ico-alicyuyan" style="margin-right: 10px"></i> C`,
-                    name:"C"
-                },
-                {
-                    index:2,
-                    icon: `<i class="el-ico-aliCyuyan" style="margin-right: 10px"></i> C#`,
-                    name:"C#"
-                },
-                {
-                    index:3,
-                    icon: `<i class="el-ico-alicyuyan" style="margin-right: 10px"></i> C++`,
-                    name:"C++"
-                },
-                {
-                    index:4,
-                    icon: `<i class="el-ico-alicss3" style="margin-right: 10px"></i> CSS`,
-                    name:"CSS"
-                },
-                {
-                    index:5,
-                    icon: `<i class="el-ico-aliGoyuyan" style="margin-right: 10px"></i> Go`,
-                    name:"Go"
-                },
-                {
-                    index:6,
-                    icon: `<i class="el-ico-alijava" style="margin-right: 10px"></i> Java`,
-                    name:"Java"
-                },
-                {
-                    index:7,
-                    icon: `<i class="el-ico-alioutline-java-script" style="margin-right: 10px"></i> JavaScript`,
-                    name:"JavaScript"
-                },
-                {
-                    index:8,
-                    icon: `<i class="el-ico-alikotlin" style="margin-right: 10px"></i> Kotlin`,
-                    name:"Kotlin"
-                },
-                {
-                    index:9,
-                    icon: `<i class="el-ico-alicyuyan" style="margin-right: 10px"></i> ObjectiveC`,
-                    name:"Objective-C"
-                },
-                {
-                    index:10,
-                    icon: `<i class="el-ico-aliphp" style="margin-right: 10px"></i> PHP`,
-                    name:"PHP"
-                },
-                {
-                    index:11,
-                    icon: `<i class="el-ico-aliPython" style="margin-right: 10px"></i> python`,
-                    name:"python"
-                },
-                {
-                    index:12,
-                    icon: `<i class="el-ico-aliRubyyuyan" style="margin-right: 10px"></i> Ruby`,
-                    name:"Ruby"
-                },
-                {
-                    index:13,
-                    icon: `<i class="el-ico-alirust" style="margin-right: 10px"></i> Rust`,
-                    name:"Rust"
-                },
-                {
-                    index:14,
-                    icon: `<i class="el-ico-aliswift" style="margin-right: 10px"></i> Swift`,
-                    name:"Swift"
-                },
-                {
-                    index:15,
-                    icon: `<i class="el-icon-s-help" style="margin-right: 10px"></i> Other`,
-                    name:"Other"
-                },
-                {
-                    index:16,
-                    icon: `<i class="el-ico-alitushu" style="margin-right: 10px"></i> 开源书籍`,
-                    name:"开源书籍"
-                },
-                {
-                    index:17,
-                    icon: `<i class="el-ico-alijiqixuexi___" style="margin-right: 10px"></i> 机器学习`,
-                    name:"机器学习"
-                },
-            ],
+            // tags:[
+            //     {
+            //         index:0,
+            //         icon: `<i class="el-icon-discover" style="margin-right: 10px"></i> 综合`,
+            //         name:"综合"
+            //     },
+            //     {
+            //         index:1,
+            //         icon: `<i class="el-ico-alicyuyan" style="margin-right: 10px"></i> C`,
+            //         name:"C"
+            //     },
+            //     {
+            //         index:2,
+            //         icon: `<i class="el-ico-aliCyuyan" style="margin-right: 10px"></i> C#`,
+            //         name:"C#"
+            //     },
+            //     {
+            //         index:3,
+            //         icon: `<i class="el-ico-alicyuyan" style="margin-right: 10px"></i> C++`,
+            //         name:"C++"
+            //     },
+            //     {
+            //         index:4,
+            //         icon: `<i class="el-ico-alicss3" style="margin-right: 10px"></i> CSS`,
+            //         name:"CSS"
+            //     },
+            //     {
+            //         index:5,
+            //         icon: `<i class="el-ico-aliGoyuyan" style="margin-right: 10px"></i> Go`,
+            //         name:"Go"
+            //     },
+            //     {
+            //         index:6,
+            //         icon: `<i class="el-ico-alijava" style="margin-right: 10px"></i> Java`,
+            //         name:"Java"
+            //     },
+            //     {
+            //         index:7,
+            //         icon: `<i class="el-ico-alioutline-java-script" style="margin-right: 10px"></i> JavaScript`,
+            //         name:"JavaScript"
+            //     },
+            //     {
+            //         index:8,
+            //         icon: `<i class="el-ico-alikotlin" style="margin-right: 10px"></i> Kotlin`,
+            //         name:"Kotlin"
+            //     },
+            //     {
+            //         index:9,
+            //         icon: `<i class="el-ico-alicyuyan" style="margin-right: 10px"></i> ObjectiveC`,
+            //         name:"Objective-C"
+            //     },
+            //     {
+            //         index:10,
+            //         icon: `<i class="el-ico-aliphp" style="margin-right: 10px"></i> PHP`,
+            //         name:"PHP"
+            //     },
+            //     {
+            //         index:11,
+            //         icon: `<i class="el-ico-aliPython" style="margin-right: 10px"></i> python`,
+            //         name:"python"
+            //     },
+            //     {
+            //         index:12,
+            //         icon: `<i class="el-ico-aliRubyyuyan" style="margin-right: 10px"></i> Ruby`,
+            //         name:"Ruby"
+            //     },
+            //     {
+            //         index:13,
+            //         icon: `<i class="el-ico-alirust" style="margin-right: 10px"></i> Rust`,
+            //         name:"Rust"
+            //     },
+            //     {
+            //         index:14,
+            //         icon: `<i class="el-ico-aliswift" style="margin-right: 10px"></i> Swift`,
+            //         name:"Swift"
+            //     },
+            //     {
+            //         index:15,
+            //         icon: `<i class="el-icon-s-help" style="margin-right: 10px"></i> Other`,
+            //         name:"Other"
+            //     },
+            //     {
+            //         index:16,
+            //         icon: `<i class="el-ico-alitushu" style="margin-right: 10px"></i> 开源书籍`,
+            //         name:"开源书籍"
+            //     },
+            //     {
+            //         index:17,
+            //         icon: `<i class="el-ico-alijiqixuexi___" style="margin-right: 10px"></i> 机器学习`,
+            //         name:"机器学习"
+            //     },
+            // ],
 
         };
     },
     mounted() {
         this.account(); //获取cookie的方法
         this.ProjectLists();
+        this.categoryList();
     },
     created() {
     //     if (sessionStorage.getItem('current_name') == null){
@@ -607,7 +609,7 @@ export default {
                 that.projectLists=res.data;
             });
         },
-        projectListsByCount(index){
+        projectListsByCount(index,name){
             var that=this;
             axios({
                 method: 'post',
@@ -616,6 +618,7 @@ export default {
                 // URL 中的查询参数
                 params: {
                     num: index,
+                    name:name
                 }
             }).then((res)=>{
                 // console.log(res.data);
@@ -625,23 +628,21 @@ export default {
         tabChange(tab) {
             if(tab.name=="first"){
                 if(this.currentTabIndex!=null){
-                    this. typeChangeFun(this.currentTabIndex);
+                    this.typeChangeFun(this.currentTabIndex,this.currentTabName);
                 }else {
                     this.ProjectLists();
                 }
-
-
             }
             if (tab.name == "second") {
                 if(this.currentTabIndex!=null){
-                    this.projectListsByCount(this.currentTabIndex);
+                    this.projectListsByCount(this.currentTabIndex,this.currentTabName);
                 }else {
                     this.projectListsByCount(this.tabindex);
                 }
             }
         },
 
-        typeChangeFun(index){
+        typeChangeFun(index,name){
             var that=this;
             axios({
                 method: 'post',
@@ -650,6 +651,7 @@ export default {
                 // URL 中的查询参数
                 params: {
                     num: index,
+                    name:name
                 }
             }).then((res)=>{
                 console.log(res.data);
@@ -660,12 +662,27 @@ export default {
         typeChange(tab){
             this.currentTabIndex=tab.index;
             if(this.activeName==="first"){
-                this.typeChangeFun(tab.index);
+                this.typeChangeFun(tab.index,this.currentTabName);
             }
             if(this.activeName==="second"){
-                this.projectListsByCount(tab.index);
+                this.projectListsByCount(tab.index,this.currentTabName);
             }
-        }
+        },
+        // 标签列表
+        categoryList(){
+            var that=this;
+            axios({
+                method: 'post',
+                // 请求的地址
+                url: 'http://localhost:8082/helloGithub_war_exploded/retLabel',
+                // URL 中的查询参数
+                params: {
+                }
+            }).then((res)=>{
+                console.log(res);
+                that.tags=res.data;
+            });
+        },
 
     }
 }
diff --git a/src/components/Home/ManageCategory.vue b/src/components/Home/ManageCategory.vue
index a8e6139..6f9202a 100644
--- a/src/components/Home/ManageCategory.vue
+++ b/src/components/Home/ManageCategory.vue
@@ -1,12 +1,20 @@
 <template>
     <el-card class="box-card">
-
+        <el-checkbox-group v-model="checkboxGroup" size="medium">
+            <el-checkbox label="备选项1" border></el-checkbox>
+            <el-checkbox label="备选项2" border></el-checkbox>
+        </el-checkbox-group>
     </el-card>
 </template>
 
 <script>
 export default {
-    name: "ManageCategory"
+    name: "ManageCategory",
+    data(){
+        return{
+            checkboxGroup:[],
+        }
+    }
 }
 </script>