加入点击发布 点赞 评论等打开弹窗

This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-06-23 16:36:53 +08:00
parent 5b96c49b44
commit 67d4082297
85 changed files with 705 additions and 573 deletions

View File

@@ -1,5 +1,5 @@
<template>
<div class="floor-area flexacenter" :class="{ 'show': isLoaded }" @click="closeDiscussInputFields()">
<div class="floor-area flexacenter" :class="{ show: isLoaded }" @click="closeDiscussInputFields()">
<div class="floor-content flexacenter">
<div class="floor-right flexacenter" @mouseenter="handleFloorRight(true)" @mouseleave="handleFloorRight(false)">
手机查看该投票
@@ -14,7 +14,7 @@
</el-popover>
</div>
<div class="floor-left flexacenter">
<div class="item flexacenter" style="cursor: auto;">
<div class="item flexacenter" style="cursor: auto">
<img class="icon" src="@/assets/img/eye-icon-black.svg" />
{{ info["views"] }}
</div>
@@ -27,7 +27,7 @@
<img class="icon" v-else src="@/assets/img/like-icon.png" />
{{ info["likes"] || "" }}
</div>
<div class="item flexacenter" style="cursor: auto;">
<div class="item flexacenter" style="cursor: auto">
<img class="icon" src="@/assets/img/discuss-icon.png" />
{{ commentComments }}
</div>
@@ -87,163 +87,170 @@
</template>
<script setup>
import { ElMessage } from "element-plus"
import { ElMessage } from "element-plus";
let props = defineProps({
ripostecount: Object,
commentComments: Number,
})
});
const respondShowState = ref(false)
const respondShowState = ref(false);
let isNeedLogin = inject("isNeedLogin")
const goLogin = inject("goLogin")
const userInfoWin = inject("userInfoWin")
let openAttest = inject("openAttest");
const realname = inject("realname");
let info = inject("info")
let islike = inject("islike")
let iscollection = inject("iscollection")
let qrcode = inject("qrcode")
let token = inject("token")
const topHeadRef = inject("topHeadRef")
const isLoaded = inject("isLoaded")
let isNeedLogin = inject("isNeedLogin");
const goLogin = inject("goLogin");
const userInfoWin = inject("userInfoWin");
const floormiddle = ref(null)
let info = inject("info");
let islike = inject("islike");
let iscollection = inject("iscollection");
let qrcode = inject("qrcode");
let token = inject("token");
const topHeadRef = inject("topHeadRef");
const isLoaded = inject("isLoaded");
const floormiddle = ref(null);
// 获取完整 url
const getFullUrl = () => {
if (typeof window === "undefined") return
return window.location.href
}
if (typeof window === "undefined") return;
return window.location.href;
};
// 复制
let copyText = text => {
let copyText = (text) => {
if (navigator.clipboard) {
copyText = () => {
navigator.clipboard.writeText(text)
ElMessage.success("复制成功")
}
navigator.clipboard.writeText(text);
ElMessage.success("复制成功");
};
} else {
copyText = () => {
var tempInput = document.createElement("input")
tempInput.value = text
document.body.appendChild(tempInput)
tempInput.select()
document.execCommand("copy")
document.body.removeChild(tempInput)
ElMessage.success("复制成功")
}
var tempInput = document.createElement("input");
tempInput.value = text;
document.body.appendChild(tempInput);
tempInput.select();
document.execCommand("copy");
document.body.removeChild(tempInput);
ElMessage.success("复制成功");
};
}
copyText()
}
copyText();
};
let floorRightState = ref(false) // 右下角 的二维码显示状态
let floorRightState = ref(false); // 右下角 的二维码显示状态
// 处理右下角 鼠标经过箭头 展示二维码
const handleFloorRight = value => {
floorRightState.value = value
}
const handleFloorRight = (value) => {
floorRightState.value = value;
};
// 点击 收藏
const handleCollect = () => {
if (isNeedLogin.value) {
goLogin()
return
goLogin();
return;
}
topHeadRef.value.count = {}
topHeadRef.value.count = {};
operateCollectHttp({ token: token.value }).then(res => {
operateCollectHttp({ token: token.value }).then((res) => {
if (res.code != 200) {
ElMessage.error(res["message"])
return
ElMessage.error(res["message"]);
return;
}
let data = res.data
let data = res.data;
info.value["favs"] = data["count"]
iscollection.value = data["status"]
info.value["favs"] = data["count"];
iscollection.value = data["status"];
ElMessage.success(res["message"])
})
}
ElMessage.success(res["message"]);
});
};
const isBrowser = computed(() => {
return process.client // 使用 process.client 判断是否在浏览器环境下
})
return process.client; // 使用 process.client 判断是否在浏览器环境下
});
// 点赞
const handleLike = () => {
if (realname.value == 0 && userInfoWin.value.uin > 0) {
openAttest();
return;
}
if (isNeedLogin.value) {
goLogin()
return
goLogin();
return;
}
if (islike.value) {
ElMessage.error("不可取消点赞")
return
ElMessage.error("不可取消点赞");
return;
}
operateLikeHttp({ token: token.value }).then(res => {
operateLikeHttp({ token: token.value }).then((res) => {
if (res.code != 200) {
ElMessage.error(res.message)
return
ElMessage.error(res.message);
return;
}
let data = res.data
info.value["likes"] = data["count"]
islike.value = data["status"]
let data = res.data;
info.value["likes"] = data["count"];
islike.value = data["status"];
ElMessage.success(res.message)
})
}
ElMessage.success(res.message);
});
};
// 底部转发弹窗显示 状态
let transmitBoxState = ref(false)
let transmitBoxState = ref(false);
const floorCommentInput = inject("floorCommentInput")
const floorCommentBtn = inject("floorCommentBtn")
const floorCommentInput = inject("floorCommentInput");
const floorCommentBtn = inject("floorCommentBtn");
const emit = defineEmits(["closeDiscussInputFields"])
const emit = defineEmits(["closeDiscussInputFields"]);
// // 点击底部调用关闭讨论输入框
const closeDiscussInputFields = () => emit("closeDiscussInputFields")
const closeDiscussInputFields = () => emit("closeDiscussInputFields");
onMounted(() => {})
onMounted(() => {});
watch(isLoaded, (newValue, oldValue) => {
if (newValue === true) {
openAutoCarousel()
openAutoCarousel();
}
})
});
let floormiddleIndex = 0 // 0起
let floormiddleTimer = null
let floormiddleIndex = 0; // 0起
let floormiddleTimer = null;
// 开启自动轮播
const openAutoCarousel = () => {
return
return;
floormiddleTimer = setInterval(() => {
floormiddleIndex = +!floormiddleIndex
floormiddleIndex = +!floormiddleIndex;
floormiddle.value.scrollTo({
top: floormiddleIndex * 40,
behavior: "smooth",
})
}, 2000)
}
});
}, 2000);
};
// 鼠标移入 关闭 自动滚动
const closeMouseOver = () => {
clearInterval(floormiddleTimer)
}
clearInterval(floormiddleTimer);
};
onBeforeUnmount(() => {
clearInterval(floormiddleTimer)
})
const randomBottomEmojis = inject("randomBottomEmojis")
const selectEomji = inject("selectEomji")
const jointriposte = inject("jointriposte")
clearInterval(floormiddleTimer);
});
const randomBottomEmojis = inject("randomBottomEmojis");
const selectEomji = inject("selectEomji");
const jointriposte = inject("jointriposte");
</script>
<style scoped lang="less">
@@ -281,7 +288,6 @@ const jointriposte = inject("jointriposte")
flex: 1;
justify-content: space-between;
.item {
cursor: pointer;
color: #aaaaaa;