feat:完成点赞功能

Yi.BBS.Vue3/src/apis/agreeApi.js

@@ -0,0 +1,11 @@
+import myaxios from '@/utils/request'
+export function operate(discussId){
+    if(discussId==undefined)
+    {
+        return;
+    }
+    return myaxios({
+        url: `/agree/operate/${discussId}`,
+        method: 'post'
+    })
+};

Yi.BBS.Vue3/src/components/DisscussCard.vue

@@ -19,8 +19,8 @@
                 </div>
 
 
-                <el-button icon="Pointer" text>
-                    点赞</el-button>
+                <el-button icon="Pointer" text @click="agree">
+                    点赞:{{ agreeNum??0 }}</el-button>
                 <el-button icon="Star" text>
                     收藏</el-button>
                
@@ -34,17 +34,38 @@
 </el-badge>
 </template>
 <script setup>
-import { h, ref } from 'vue'
+import { h, ref ,toRef,onMounted} from 'vue'
 import { useRouter } from 'vue-router'
 import AvatarInfo from './AvatarInfo.vue';
+import {operate} from '@/apis/agreeApi'
 
-const props = defineProps(['title','introduction','creationTime','id','user','badge',"color","seeNum"])
+const props = defineProps(['title','introduction','creationTime','id','user','badge',"color","seeNum","agreeNum"])
 
 const router = useRouter()
 const spacer = h(ElDivider, { direction: 'vertical' })
 const enterDiscuss = (id) => {
     router.push(`/article/${id}`)
 }
+const agreeNum=ref(0)
+//点赞操作
+const agree=async ()=>{
+  const response=  await operate(props.id)
+  const res=response.data;
+  //提示框，颜色区分
+  if(res.isArgee)
+  {
+    agreeNum.value+=1;
+    alert(res.message)
+  }
+  else
+  {
+    agreeNum.value-=1;
+    alert(res.message)
+  }
+}
+onMounted(()=>{
+    agreeNum.value=props.agreeNum;
+    })
 </script>
 <style scoped>
 .el-card{

Yi.BBS.Vue3/src/views/Discuss.vue

@@ -58,14 +58,14 @@
           </div>
         </template>
 <div class="div-item" v-for="i in topDiscussList" >
-  <DisscussCard :title="i.title" :introduction="i.introduction" :creationTime="i.creationTime" :id="i.id" :user="i.user" :color="i.color"  :seeNum="i.seeNum" badge="置顶"/>
+  <DisscussCard :title="i.title" :introduction="i.introduction" :creationTime="i.creationTime" :agreeNum="i.agreeNum" :id="i.id" :user="i.user" :color="i.color"  :seeNum="i.seeNum" badge="置顶"/>
 </div>
 </el-collapse-item>
 </el-collapse>
 <el-divider v-show="topDiscussList.length>0" />
   
 <div class="div-item" v-for="i in discussList" >
-  <DisscussCard :title="i.title" :introduction="i.introduction" :creationTime="i.creationTime" :id="i.id" :color="i.color"  :seeNum="i.seeNum" :user="i.user"/>
+  <DisscussCard :title="i.title" :introduction="i.introduction" :creationTime="i.creationTime" :agreeNum="i.agreeNum" :id="i.id" :color="i.color"  :seeNum="i.seeNum" :user="i.user"/>
 </div>
 <div>
     <el-pagination

Yi.BBS.Vue3/src/views/Index.vue

@@ -14,7 +14,7 @@
           </el-col>
 
         <el-col :span="24" v-for="i in discussList">
-<DisscussCard :title="i.title" :introduction="i.introduction" :creationTime="i.creationTime" :id="i.id" :user="i.user" :seeNum="i.seeNum"/>
+<DisscussCard :title="i.title" :introduction="i.introduction" :creationTime="i.creationTime" :agreeNum="i.agreeNum" :id="i.id" :user="i.user" :seeNum="i.seeNum"/>
           
         </el-col>
       </el-row>