feat(Details): 新增投票详情页管理功能和评论优化

- 添加投票详情页的管理功能，包括隐藏、推荐、精华和删除操作
- 优化评论组件，支持多图上传和显示
- 新增投币功能组件
- 更新API接口调用方式，适配新后端接口
- 完善用户权限管理逻辑
- 修复样式问题和交互体验

components/DetailsArea.vue

@@ -14,33 +14,31 @@
                 </el-popover>
             </div>
             <div class="floor-left flexacenter">
-                <div class="item flexacenter" style="cursor: auto">
-                    <img class="icon" src="@/assets/img/eye-icon-black.svg" />
-                    <div>{{ info["views"] }}</div>
-                </div>
                 <div class="item flexacenter" @click="handleLike">
                     <img class="icon pitch" v-if="islike == 1" src="@/assets/img/like-red-pitch.png" />
                     <img class="icon" v-else src="@/assets/img/like-icon.png" />
-                    <div>{{ info["likes"] || "" }}</div>
+                    <div>{{ topicInfo["likes"] || "赞" }}</div>
                 </div>
-              
+
                 <div class="item flexacenter" @click="handleCollect()">
                     <img class="icon" v-if="iscollection == 1" src="@/assets/img/collect-icon-colours.svg" />
                     <img class="icon" v-else src="@/assets/img/collect-icon.png" />
-                    <div>{{ info["favs"] || "收藏" }}</div>
+                    <div>{{ topicInfo["collections"] || "收藏" }}</div>
                 </div>
                 <div class="item flexacenter" style="cursor: auto">
                     <img class="icon" src="@/assets/img/discuss-icon.png" />
-                    <div>{{ commentComments }}</div>
+                    <div>{{ commentTotalCount || "讨论" }}</div>
                 </div>
-                  <div class="item flexacenter" style="cursor: auto">
-                    <img class="icon" src="@/assets/img/discuss-icon.png" />
-                    <div>{{ commentComments }}</div>
+                <div class="item flexacenter" style="cursor: auto" @click="openBi()">
+                    <img class="icon" src="@/assets/img/bi-black-icon.png" />
+                    <div>{{ topicInfo.coins || "投币" }}</div>
                 </div>
                 <ClientOnly>
                     <el-popover placement="bottom" width="628px" trigger="click" popper-style="padding: 0;border-radius: 10px;" v-model:visible="transmitBoxState">
                         <template #reference>
-                            <div class="item flexacenter" @click="handleShare"><img class="icon" src="@/assets/img/transmit-icon.png" />转发</div>
+                            <div class="item flexacenter" @click="handleShare">
+                                <img class="icon" src="@/assets/img/transmit-icon.png" />转发
+                            </div>
                         </template>
 
                         <div class="transmit-box flexflex">
@@ -51,7 +49,9 @@
                                     <div class="transmit-headline">{{ info["title"] }}</div>
                                     <div class="transmit-url">{{ getFullUrl() }}</div>
                                 </div>
-                                <div class="transmit-web-btn flexcenter" @click="copyText(`${info['title']} + ${getFullUrl()}`)">复制链接</div>
+                                <div class="transmit-web-btn flexcenter" @click="copyText(`${info['title']} + ${getFullUrl()}`)">
+                                    复制链接
+                                </div>
                             </div>
                             <div class="transmit-right transmit-mini">
                                 <div class="transmit-title">转发小程序版</div>
@@ -86,6 +86,8 @@
         </div>
     </div>
     <Like v-if="isLikeGif"></Like>
+
+    <bi-card :coins="topicInfo.coins" :token="topicToken"></bi-card>
 </template>
 
 <script setup>
@@ -94,8 +96,11 @@ import { ElMessage } from "element-plus";
 let props = defineProps({
     ripostecount: Object,
     commentComments: Number,
+
 });
 
+let topicInfo = inject("topicInfo");
+
 const respondShowState = ref(false);
 
 let openAttest = inject("openAttest");
@@ -110,6 +115,7 @@ let islike = inject("islike");
 let iscollection = inject("iscollection");
 let qrcode = inject("qrcode");
 let token = inject("token");
+let topicToken = inject("topicToken");
 const topHeadRef = inject("topHeadRef");
 const isLoaded = inject("isLoaded");
 
@@ -158,14 +164,14 @@ const handleCollect = () => {
 
     topHeadRef.value.count = {};
 
-    operateCollectHttp({ token: token.value }).then((res) => {
+    operateCollectHttp({ token: topicToken.value }).then((res) => {
         if (res.code != 200) {
             ElMessage.error(res["message"]);
             return;
         }
         let data = res.data;
 
-        info.value["favs"] = data["count"];
+        topicInfo.value["collections"] = data["collections"];
         iscollection.value = data["status"];
 
         ElMessage.success(res["message"]);
@@ -195,7 +201,7 @@ const handleLike = () => {
         return;
     }
 
-    operateLikeHttp({ token: token.value }).then((res) => {
+    operateLikeHttp({ token: topicToken.value }).then((res) => {
         if (res.code != 200) {
             ElMessage.error(res.message);
             return;
@@ -204,7 +210,7 @@ const handleLike = () => {
         let data = res.data;
         const status = data["status"];
 
-        info.value["likes"] = data["count"];
+        topicInfo.value["likes"] = data["likes"];
         islike.value = status;
 
         ElMessage.success(res.message);
@@ -227,7 +233,7 @@ const emit = defineEmits(["closeDiscussInputFields"]);
 // // 点击底部调用关闭讨论输入框
 const closeDiscussInputFields = () => emit("closeDiscussInputFields");
 
-onMounted(() => {});
+onMounted(() => { });
 
 watch(isLoaded, (newValue, oldValue) => {
     if (newValue === true) {
@@ -262,6 +268,15 @@ onBeforeUnmount(() => {
 const randomBottomEmojis = inject("randomBottomEmojis");
 const selectEomji = inject("selectEomji");
 const jointriposte = inject("jointriposte");
+
+const openBi = () => {
+    if (isNeedLogin.value) {
+        goLogin();
+        return;
+    }
+
+    BiComponent.initComponent();
+}
 </script>
 
 <style scoped lang="less">
@@ -281,12 +296,15 @@ const jointriposte = inject("jointriposte");
     -webkit-box-shadow: 0px -1px 2px rgba(0, 0, 0, 0.192156862745098);
     box-shadow: 0px -1px 2px rgba(0, 0, 0, 0.192156862745098);
     display: none;
+
     &.show {
         display: flex;
         animation: animafloor 1s forwards;
-        animation-timing-function: cubic-bezier(0.98, -0.2, 0.55, 0.97); /* 先快后慢的时间曲线 */
+        animation-timing-function: cubic-bezier(0.98, -0.2, 0.55, 0.97);
+        /* 先快后慢的时间曲线 */
         animation-fill-mode: both;
     }
+
     .floor-content {
         width: 1200px;
         height: 100%;
@@ -294,6 +312,7 @@ const jointriposte = inject("jointriposte");
         padding: 0 30px;
         display: flex;
         justify-content: space-between;
+
         .floor-left {
             margin-left: 30px;
             // flex: 1;
@@ -301,8 +320,8 @@ const jointriposte = inject("jointriposte");
 
             .item {
                 cursor: pointer;
-                color: #aaaaaa;
-                font-size: 13px;
+                color: #333333;
+                font-size: 14px;
                 margin-right: 50px;
 
                 .icon {
@@ -316,9 +335,11 @@ const jointriposte = inject("jointriposte");
                     0% {
                         transform: scale(1);
                     }
+
                     50% {
                         transform: scale(1.2);
                     }
+
                     100% {
                         transform: scale(1);
                     }
@@ -365,6 +386,7 @@ const jointriposte = inject("jointriposte");
             border-radius: 152px;
             background-color: #fff;
             border: 1px solid rgba(215, 215, 215, 1);
+
             .avatar {
                 width: 28px;
                 height: 28px;
@@ -378,6 +400,7 @@ const jointriposte = inject("jointriposte");
                 outline: none;
                 padding: 0 12px;
                 font-size: 14px;
+
                 /deep/ .el-input__wrapper {
                     box-shadow: none;
                     padding: 0;
@@ -390,6 +413,7 @@ const jointriposte = inject("jointriposte");
                 background-color: var(--main-color);
                 border-radius: 20px;
                 cursor: pointer;
+
                 .comment-btn-icon {
                     width: 14px;
                     height: 15px;
@@ -417,6 +441,7 @@ const jointriposte = inject("jointriposte");
             .respond-box {
                 display: flex;
                 justify-content: space-around;
+
                 .respond-item {
                     font-family: "emojifont";
                     font-size: 18px;