no message
This commit is contained in:
A1300399510
parent
809d1d317a
commit
89020a40b7
21
app.vue
21
app.vue
@ -15,12 +15,28 @@ const isProduction = process.env.NODE_ENV === "production"
|
|||||||
// console.log(process.env.NODE_ENV, "NODE_ENV")
|
// console.log(process.env.NODE_ENV, "NODE_ENV")
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// isNeedLogin.value = false
|
// isNeedLogin.value = false
|
||||||
if (!isProduction) isNeedLogin.value = false
|
// if (!isProduction) isNeedLogin.value = false
|
||||||
else determineIsLogin()
|
// else determineIsLogin()
|
||||||
|
|
||||||
|
window["userInfoWin"] = {
|
||||||
|
"username": "",
|
||||||
|
"uid": 256624,
|
||||||
|
"uin": 4171117,
|
||||||
|
"avatar": "https://oss.gter.net/avatar/97KwEWQHYuMQGDnFqkimXF9SHKuGwVV5zW-tYWFjYQ~~?istype=1&random=HHfurzyTXnzb",
|
||||||
|
"messagenum": 0,
|
||||||
|
"newprompt": 0,
|
||||||
|
"todaysigned": 0,
|
||||||
|
}
|
||||||
|
|
||||||
|
determineIsLogin()
|
||||||
})
|
})
|
||||||
|
|
||||||
let isNeedLogin = ref(true) // 是否需要登录状态
|
let isNeedLogin = ref(true) // 是否需要登录状态
|
||||||
|
|
||||||
|
let userInfoWin = ref({})
|
||||||
|
|
||||||
|
provide("userInfoWin", userInfoWin)
|
||||||
|
|
||||||
// 判断是否登录状态
|
// 判断是否登录状态
|
||||||
const determineIsLogin = () => {
|
const determineIsLogin = () => {
|
||||||
let count = 0
|
let count = 0
|
||||||
@ -28,6 +44,7 @@ const determineIsLogin = () => {
|
|||||||
if (Object.keys(window["userInfoWin"]).length !== 0) {
|
if (Object.keys(window["userInfoWin"]).length !== 0) {
|
||||||
clearInterval(timer)
|
clearInterval(timer)
|
||||||
if (window["userInfoWin"]["uid"]) isNeedLogin.value = false
|
if (window["userInfoWin"]["uid"]) isNeedLogin.value = false
|
||||||
|
userInfoWin.value = window["userInfoWin"]
|
||||||
}
|
}
|
||||||
count++
|
count++
|
||||||
if (count >= 10) clearInterval(timer)
|
if (count >= 10) clearInterval(timer)
|
||||||
|
|||||||
6
assets/img/arrow-white.svg
Normal file
6
assets/img/arrow-white.svg
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="14px" height="15px" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g transform="matrix(1 0 0 1 -1534 -28 )">
|
||||||
|
<path d="M 13.648097826087 6.63350449293967 C 13.8826992753623 6.8581514762516 14 7.14698331193838 14 7.5 C 14 7.84659820282413 13.8826992753623 8.13863928112965 13.648097826087 8.37612323491656 L 7.45652173913044 14.6437740693196 C 7.20923913043478 14.8812580231065 6.92074275362319 15 6.59103260869565 15 C 6.26766304347826 15 5.98233695652174 14.8812580231065 5.73505434782609 14.6437740693196 L 5.02173913043478 13.9216944801027 C 4.78079710144928 13.6777920410783 4.66032608695652 13.3857509627728 4.66032608695652 13.0455712451861 C 4.66032608695652 12.7053915275995 4.78079710144928 12.413350449294 5.02173913043478 12.1694480102696 L 7.80842391304348 9.34852374839538 L 1.11277173913043 9.34852374839538 C 0.783061594202899 9.34852374839538 0.515172101449275 9.22817715019255 0.309103260869565 8.98748395378691 C 0.103034420289855 8.74679075738126 0 8.45635430038511 0 8.11617458279846 L 0 6.88382541720154 C 0 6.54364569961489 0.103034420289855 6.25320924261874 0.309103260869565 6.01251604621309 C 0.515172101449275 5.77182284980745 0.783061594202899 5.65147625160462 1.11277173913043 5.65147625160462 L 7.80842391304348 5.65147625160462 L 5.02173913043478 2.8209242618742 C 4.78079710144928 2.58985879332478 4.66032608695652 2.301026957638 4.66032608695652 1.95442875481386 C 4.66032608695652 1.60783055198973 4.78079710144928 1.31899871630295 5.02173913043478 1.08793324775353 L 5.73505434782609 0.365853658536586 C 5.97599637681159 0.121951219512194 6.26132246376812 0 6.59103260869565 0 C 6.92708333333333 0 7.21557971014493 0.121951219512194 7.45652173913044 0.365853658536586 L 13.648097826087 6.63350449293967 Z " fill-rule="nonzero" fill="#ffffff" stroke="none" transform="matrix(1 0 0 1 1534 28 )" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
@ -1,7 +1,18 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="floor-area flexacenter" :class="{ 'show': isLoaded }">
|
<div class="floor-area flexacenter" :class="{ 'show': isLoaded }">
|
||||||
<div class="floor-content flexacenter">
|
<div class="floor-content flexacenter">
|
||||||
<!-- {{ isLoaded }} -->
|
<div class="floor-right flexacenter" @mouseenter="handleFloorRight(true)" @mouseleave="handleFloorRight(false)">
|
||||||
|
手机查看该投票
|
||||||
|
<img class="arrows-icon" src="@/assets/img/arrows-icon.png" />
|
||||||
|
<el-popover placement="bottom" width="160px" trigger="hover" v-model:visible="floorRightState" popper-style="padding: 24px;border-radius: 18px;">
|
||||||
|
<template #reference>
|
||||||
|
<div class="QR-code-ball flexcenter">
|
||||||
|
<img class="" src="@/assets/img/QR-code-icon.svg" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<img class="examine-code" :src="qrcode" />
|
||||||
|
</el-popover>
|
||||||
|
</div>
|
||||||
<div class="floor-left flexacenter">
|
<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.svg" />
|
<img class="icon" src="@/assets/img/eye-icon.svg" />
|
||||||
@ -47,30 +58,13 @@
|
|||||||
</el-popover>
|
</el-popover>
|
||||||
</ClientOnly>
|
</ClientOnly>
|
||||||
</div>
|
</div>
|
||||||
<div class="floor-middle flexacenter coin-box" v-if="false">
|
<div class="floor-middle flexacenter comment-box">
|
||||||
<div class="coin-content flexacenter flex1" @click="openCoinRankList">
|
<img class="avatar" :src="userInfoWin?.avatar" />
|
||||||
<img class="coin-icon" src="@/assets/img/coin-icon.png" />
|
<input class="comment-input flex1" type="text" v-model="floorCommentInput" @keydown.enter="floorCommentBtn('input')" placeholder="说说你的想法或疑问…" />
|
||||||
<div class="coin-text flex1 flexacenter">
|
<div class="comment-btn flexcenter" @click="floorCommentBtn('input')">
|
||||||
已获
|
<img class="comment-btn-icon" src="@/assets/img/arrow-white.svg" />
|
||||||
<div class="coin-value">{{ info.coins }}</div>
|
|
||||||
个寄托币
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="coin-btn flexcenter" @click="openCoinOperation()">给TA投币</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="floor-right flexacenter" @mouseenter="handleFloorRight(true)" @mouseleave="handleFloorRight(false)">
|
|
||||||
手机查看该投票
|
|
||||||
<img class="arrows-icon" src="@/assets/img/arrows-icon.png" />
|
|
||||||
<el-popover placement="bottom" width="160px" trigger="hover" v-model:visible="floorRightState" popper-style="padding: 24px;border-radius: 18px;">
|
|
||||||
<template #reference>
|
|
||||||
<div class="QR-code-ball flexcenter">
|
|
||||||
<img class="" src="@/assets/img/QR-code-icon.svg" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<img class="examine-code" :src="qrcode" />
|
|
||||||
</el-popover>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -80,6 +74,7 @@ import { ElMessage } from "element-plus"
|
|||||||
|
|
||||||
let isNeedLogin = inject("isNeedLogin")
|
let isNeedLogin = inject("isNeedLogin")
|
||||||
const goLogin = inject("goLogin")
|
const goLogin = inject("goLogin")
|
||||||
|
const userInfoWin = inject("userInfoWin")
|
||||||
|
|
||||||
let info = inject("info")
|
let info = inject("info")
|
||||||
let islike = inject("islike")
|
let islike = inject("islike")
|
||||||
@ -178,6 +173,9 @@ const handleLike = () => {
|
|||||||
|
|
||||||
// 底部转发弹窗显示 状态
|
// 底部转发弹窗显示 状态
|
||||||
let transmitBoxState = ref(false)
|
let transmitBoxState = ref(false)
|
||||||
|
|
||||||
|
const floorCommentInput = inject("floorCommentInput")
|
||||||
|
const floorCommentBtn = inject("floorCommentBtn")
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
@ -190,7 +188,9 @@ let transmitBoxState = ref(false)
|
|||||||
min-width: 1200px;
|
min-width: 1200px;
|
||||||
height: 70px;
|
height: 70px;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
background-color: rgba(255, 255, 255, 1);
|
background: -webkit-linear-gradient(270deg, rgba(255, 255, 255, 1) 0%, rgba(242, 242, 242, 1) 100%);
|
||||||
|
background: -moz-linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(242, 242, 242, 1) 100%);
|
||||||
|
background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(242, 242, 242, 1) 100%);
|
||||||
-moz-box-shadow: 0px -1px 2px rgba(0, 0, 0, 0.192156862745098);
|
-moz-box-shadow: 0px -1px 2px rgba(0, 0, 0, 0.192156862745098);
|
||||||
-webkit-box-shadow: 0px -1px 2px rgba(0, 0, 0, 0.192156862745098);
|
-webkit-box-shadow: 0px -1px 2px rgba(0, 0, 0, 0.192156862745098);
|
||||||
box-shadow: 0px -1px 2px rgba(0, 0, 0, 0.192156862745098);
|
box-shadow: 0px -1px 2px rgba(0, 0, 0, 0.192156862745098);
|
||||||
@ -209,6 +209,7 @@ let transmitBoxState = ref(false)
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
.floor-left {
|
.floor-left {
|
||||||
|
margin-left: 30px;
|
||||||
.item {
|
.item {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
color: #aaaaaa;
|
color: #aaaaaa;
|
||||||
@ -235,45 +236,6 @@ let transmitBoxState = ref(false)
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.floor-middle {
|
|
||||||
min-width: 300px;
|
|
||||||
height: 40px;
|
|
||||||
background-color: rgba(246, 246, 246, 1);
|
|
||||||
border-radius: 150px;
|
|
||||||
.coin-content {
|
|
||||||
padding: 0 13px;
|
|
||||||
height: 100%;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
.coin-icon {
|
|
||||||
width: 20px;
|
|
||||||
height: 24px;
|
|
||||||
margin-right: 5px;
|
|
||||||
margin-top: -2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.coin-text {
|
|
||||||
font-size: 13px;
|
|
||||||
color: #333333;
|
|
||||||
.coin-value {
|
|
||||||
font-family: "Arial-Black", "Arial Black", sans-serif;
|
|
||||||
font-weight: 900;
|
|
||||||
margin: 0 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.coin-btn {
|
|
||||||
width: 97px;
|
|
||||||
height: 40px;
|
|
||||||
background-color: rgba(114, 219, 134, 1);
|
|
||||||
border-radius: 150px;
|
|
||||||
color: #ffffff;
|
|
||||||
font-size: 13px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.floor-right {
|
.floor-right {
|
||||||
color: #7f7f7f;
|
color: #7f7f7f;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
@ -293,6 +255,40 @@ let transmitBoxState = ref(false)
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.floor-middle {
|
||||||
|
width: 471px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 152px;
|
||||||
|
background-color: #fff;
|
||||||
|
border: 1px solid rgba(215, 215, 215, 1);
|
||||||
|
.avatar {
|
||||||
|
width: 28px;
|
||||||
|
height: 28px;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin-left: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.comment-input {
|
||||||
|
height: 100%;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
padding: 0 12px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.comment-btn {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
background-color: rgba(172, 183, 46, 1);
|
||||||
|
border-radius: 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
.comment-btn-icon {
|
||||||
|
width: 14px;
|
||||||
|
height: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -385,24 +381,8 @@ let transmitBoxState = ref(false)
|
|||||||
height: 113px;
|
height: 113px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes anima {
|
|
||||||
0% {
|
|
||||||
width: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
40% {
|
|
||||||
width: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
width: 16px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes animafloor {
|
@keyframes animafloor {
|
||||||
0% {
|
0% {
|
||||||
// left: -100%;
|
|
||||||
// opacity: 0;
|
|
||||||
transform: translate3d(-100%, 0, 0);
|
transform: translate3d(-100%, 0, 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -411,8 +391,6 @@ let transmitBoxState = ref(false)
|
|||||||
}
|
}
|
||||||
|
|
||||||
100% {
|
100% {
|
||||||
// left: 0;
|
|
||||||
// opacity: 1;
|
|
||||||
transform: translateZ(0);
|
transform: translateZ(0);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,11 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="comment-title flexacenter">
|
<div class="comment-title flexacenter">
|
||||||
讨论 {{ postCommentFocusState }}
|
讨论
|
||||||
<span class="comment-amount">{{ commentComments || "" }}</span>
|
<span class="comment-amount">{{ commentComments || "" }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="post-comment flexacenter" :class="{ 'post-comment-focus': postCommentFocusState }" @click="loginJudgment()">
|
<div class="post-comment flexacenter" ref="postInputRef" :class="{ 'post-comment-focus': postCommentFocusState }" @click="loginJudgment()">
|
||||||
<textarea class="post-input flex1" placeholder="说说你的想法或疑问…" v-model="commentInputTop" @focus="postCommentFocusState = true"></textarea>
|
<el-input class="post-input flex1" type="textarea" :autosize="postCommentFocusState" placeholder="说说你的想法或疑问…" v-model="commentInputTop" @blur="postCommentFocusBlur" @focus="postCommentFocusState = true"></el-input>
|
||||||
<div class="post-ok flexcenter" @click="submitAnswerComments()">发送</div>
|
<div class="post-ok flexcenter" @click="submitAnswerComments(commentInputTop)">发送</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="empty-box" v-if="isEmptyState">
|
<div class="empty-box" v-if="isEmptyState">
|
||||||
@ -56,7 +56,7 @@
|
|||||||
<div class="comments-input-box flexacenter" v-if="item['childState']">
|
<div class="comments-input-box flexacenter" v-if="item['childState']">
|
||||||
<div class="comments-input flexflex">
|
<div class="comments-input flexflex">
|
||||||
<textarea class="flex1" placeholder="回复" v-model="commentInput"></textarea>
|
<textarea class="flex1" placeholder="回复" v-model="commentInput"></textarea>
|
||||||
<div class="comments-btn flexcenter" @click="submitAnswerComments(index)">发送</div>
|
<div class="comments-btn flexcenter" @click="submitAnswerComments(commentInput, index)">发送</div>
|
||||||
</div>
|
</div>
|
||||||
<img class="forkfork" @click="closeAnswerCommentsChild(index)" src="@/assets/img/cross-icon.png" />
|
<img class="forkfork" @click="closeAnswerCommentsChild(index)" src="@/assets/img/cross-icon.png" />
|
||||||
</div>
|
</div>
|
||||||
@ -109,7 +109,7 @@
|
|||||||
<div class="comments-input-box flexacenter" v-if="ite['childState']">
|
<div class="comments-input-box flexacenter" v-if="ite['childState']">
|
||||||
<div class="comments-input flexflex">
|
<div class="comments-input flexflex">
|
||||||
<textarea class="flex1" placeholder="回复" v-model="commentInput"></textarea>
|
<textarea class="flex1" placeholder="回复" v-model="commentInput"></textarea>
|
||||||
<div class="comments-btn flexcenter" @click="submitAnswerComments(index, i)">发送</div>
|
<div class="comments-btn flexcenter" @click="submitAnswerComments(commentInput, index, i)">发送</div>
|
||||||
</div>
|
</div>
|
||||||
<img class="forkfork" @click="closeAnswerCommentsChild(index, i)" src="@/assets/img/cross-icon.png" />
|
<img class="forkfork" @click="closeAnswerCommentsChild(index, i)" src="@/assets/img/cross-icon.png" />
|
||||||
</div>
|
</div>
|
||||||
@ -128,12 +128,26 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<Report v-if="reportAlertShow" :reportToken="reportToken"></Report>
|
<Report v-if="reportAlertShow" :reportToken="reportToken"></Report>
|
||||||
|
|
||||||
|
<!-- 投票后自动评论 -->
|
||||||
|
<el-dialog class="default-popup automatic-reviews-popup" v-model="reviewsPopoverState" width="720px" align-center autosize>
|
||||||
|
<div class="automatic-header">
|
||||||
|
<div class="automatic-title">说说您的投票理由</div>
|
||||||
|
<div class="automatic-have">已投：{{ haveVotedValue }}</div>
|
||||||
|
</div>
|
||||||
|
<el-input class="automatic-input" placeholder="请输入…" v-model="reviewsPopoverInput" type="textarea"></el-input>
|
||||||
|
<div class="automatic-bottom flexflex">
|
||||||
|
<div class="automatic-send flexcenter" @click="submitAnswerComments(reviewsPopoverInput)">发送</div>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ElMessage } from "element-plus"
|
import { ElMessage } from "element-plus"
|
||||||
import { isEmpty } from "element-plus/es/utils"
|
import { isEmpty } from "element-plus/es/utils"
|
||||||
|
|
||||||
|
let haveVotedValue = inject("haveVotedValue")
|
||||||
|
|
||||||
let isNeedLogin = inject("isNeedLogin")
|
let isNeedLogin = inject("isNeedLogin")
|
||||||
const goLogin = inject("goLogin")
|
const goLogin = inject("goLogin")
|
||||||
|
|
||||||
@ -161,7 +175,7 @@ let isEmptyState = ref(false) // 评论是否为空
|
|||||||
|
|
||||||
// 获取详情评论数据
|
// 获取详情评论数据
|
||||||
const getCommentList = () => {
|
const getCommentList = () => {
|
||||||
if (commentPage.value == 0 || commentLoading) return
|
if (commentPage.value == 0 || commentLoading || !props.token) return
|
||||||
commentLoading = true
|
commentLoading = true
|
||||||
|
|
||||||
commentListHttp({
|
commentListHttp({
|
||||||
@ -243,18 +257,18 @@ let commentInputTop = ref("")
|
|||||||
let commentInput = ref("")
|
let commentInput = ref("")
|
||||||
|
|
||||||
// 提交回答-评论
|
// 提交回答-评论
|
||||||
const submitAnswerComments = (index, i) => {
|
const submitAnswerComments = (content, index, i) => {
|
||||||
if (isNeedLogin.value) {
|
if (isNeedLogin.value) {
|
||||||
goLogin()
|
goLogin()
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
const targetCommentList = [...commentList.value]
|
const targetCommentList = [...commentList.value]
|
||||||
let content = ""
|
// let content = ""
|
||||||
let parentid = null
|
let parentid = null
|
||||||
|
|
||||||
if (index == null) content = commentInputTop.value
|
// if (index == null) content = commentInputTop.value
|
||||||
else content = commentInput.value
|
// else content = commentInput.value
|
||||||
|
|
||||||
if (i != null) parentid = targetCommentList[index]["child"][i]["id"]
|
if (i != null) parentid = targetCommentList[index]["child"][i]["id"]
|
||||||
else if (index != null) parentid = targetCommentList[index]["id"]
|
else if (index != null) parentid = targetCommentList[index]["id"]
|
||||||
@ -273,6 +287,7 @@ const submitAnswerComments = (index, i) => {
|
|||||||
ElMessage.error(res.message)
|
ElMessage.error(res.message)
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
let data = res.data
|
let data = res.data
|
||||||
|
|
||||||
if (i != null) {
|
if (i != null) {
|
||||||
@ -285,6 +300,7 @@ const submitAnswerComments = (index, i) => {
|
|||||||
reply: {
|
reply: {
|
||||||
nickname: targetCommentList[index]["child"][i]["nickname"],
|
nickname: targetCommentList[index]["child"][i]["nickname"],
|
||||||
},
|
},
|
||||||
|
voteoption: haveVotedValue.value || null,
|
||||||
...data,
|
...data,
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -299,6 +315,7 @@ const submitAnswerComments = (index, i) => {
|
|||||||
likenum: 0,
|
likenum: 0,
|
||||||
...data,
|
...data,
|
||||||
child: [],
|
child: [],
|
||||||
|
voteoption: haveVotedValue.value || null,
|
||||||
}
|
}
|
||||||
if (index != null) {
|
if (index != null) {
|
||||||
targetCommentList[index]["child"].unshift(targetData)
|
targetCommentList[index]["child"].unshift(targetData)
|
||||||
@ -315,10 +332,17 @@ const submitAnswerComments = (index, i) => {
|
|||||||
// 请求 输入框的数据
|
// 请求 输入框的数据
|
||||||
commentInputTop.value = ""
|
commentInputTop.value = ""
|
||||||
commentInput.value = ""
|
commentInput.value = ""
|
||||||
|
reviewsPopoverInput.value = ""
|
||||||
|
reviewsPopoverState.value = false
|
||||||
isEmptyState.value = false // 取消有可能的 没有评论
|
isEmptyState.value = false // 取消有可能的 没有评论
|
||||||
|
|
||||||
closeAnswerCommentsChild()
|
closeAnswerCommentsChild()
|
||||||
|
|
||||||
|
if (bottomNavigationState) {
|
||||||
|
bottomNavigationState = false
|
||||||
|
floorCommentBtn("back")
|
||||||
|
}
|
||||||
|
|
||||||
ElMessage.success(res.message)
|
ElMessage.success(res.message)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
@ -426,7 +450,35 @@ const wipeCommentVoteoption = () => {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
defineExpose({ changeCommentVoteoption, wipeCommentVoteoption })
|
let reviewsPopoverState = ref(false) // 自动投票弹窗状态
|
||||||
|
let reviewsPopoverInput = ref("") // 自动投票理由
|
||||||
|
|
||||||
|
// 调用自动评论
|
||||||
|
const reviewsComment = value => {
|
||||||
|
reviewsPopoverState.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
let bottomNavigationState = false
|
||||||
|
|
||||||
|
// 底部导航栏的 评论
|
||||||
|
const bottomNavigationBar = value => {
|
||||||
|
bottomNavigationState = true
|
||||||
|
submitAnswerComments(value)
|
||||||
|
}
|
||||||
|
const floorCommentBtn = inject("floorCommentBtn")
|
||||||
|
|
||||||
|
const postInputRef = ref(null)
|
||||||
|
const postCommentFocusBlur = () => {
|
||||||
|
postCommentFocusState.value = false
|
||||||
|
|
||||||
|
const refref = postInputRef.value
|
||||||
|
nextTick(() => {
|
||||||
|
let targetDom = refref.querySelector(".el-textarea__inner")
|
||||||
|
targetDom.style.height = ""
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({ changeCommentVoteoption, wipeCommentVoteoption, reviewsComment, bottomNavigationBar })
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
@ -443,21 +495,25 @@ defineExpose({ changeCommentVoteoption, wipeCommentVoteoption })
|
|||||||
}
|
}
|
||||||
|
|
||||||
.post-comment {
|
.post-comment {
|
||||||
min-height: 60px;
|
|
||||||
background-color: rgba(255, 255, 255, 1);
|
background-color: rgba(255, 255, 255, 1);
|
||||||
border: 1px solid rgba(215, 215, 215, 1);
|
border: 1px solid rgba(215, 215, 215, 1);
|
||||||
border-right-width: 0;
|
// border-right-width: 0;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
margin-bottom: 30px;
|
margin-bottom: 30px;
|
||||||
margin-right: 30px;
|
margin-right: 30px;
|
||||||
transition: all 0.5s;
|
transition: all 5s;
|
||||||
|
justify-content: space-between;
|
||||||
|
overflow: hidden;
|
||||||
&.post-comment-focus {
|
&.post-comment-focus {
|
||||||
border-right-width: 1px;
|
// border-right-width: 1px;
|
||||||
min-height: 200px;
|
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
.post-input {
|
.post-input {
|
||||||
width: 100%;
|
/deep/ .el-textarea__inner {
|
||||||
|
width: 468px;
|
||||||
|
min-height: 148px !important;
|
||||||
|
max-height: 80vh;
|
||||||
|
// height: 100% !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.post-ok {
|
.post-ok {
|
||||||
align-self: flex-end;
|
align-self: flex-end;
|
||||||
@ -468,11 +524,7 @@ defineExpose({ changeCommentVoteoption, wipeCommentVoteoption })
|
|||||||
}
|
}
|
||||||
|
|
||||||
.post-input {
|
.post-input {
|
||||||
height: 100%;
|
|
||||||
border: none;
|
|
||||||
outline: none;
|
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
padding: 10px;
|
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
resize: none;
|
resize: none;
|
||||||
transition: all 0.5s;
|
transition: all 0.5s;
|
||||||
@ -486,11 +538,22 @@ defineExpose({ changeCommentVoteoption, wipeCommentVoteoption })
|
|||||||
|
|
||||||
scrollbar-width: none;
|
scrollbar-width: none;
|
||||||
-ms-overflow-style: none;
|
-ms-overflow-style: none;
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
/deep/ .el-textarea__inner {
|
||||||
|
border: none;
|
||||||
|
box-shadow: none;
|
||||||
|
resize: none;
|
||||||
|
min-height: 60px !important;
|
||||||
|
// height: 60px !important;
|
||||||
|
padding: 10px;
|
||||||
|
transition: all 0.5s;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-ok {
|
.post-ok {
|
||||||
width: 60px;
|
width: 60px;
|
||||||
height: 60px;
|
height: 62px;
|
||||||
background-color: var(--main-color);
|
background-color: var(--main-color);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
@ -526,7 +589,6 @@ defineExpose({ changeCommentVoteoption, wipeCommentVoteoption })
|
|||||||
.comment-header {
|
.comment-header {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
// padding-right: 30px;
|
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
|
|
||||||
.comment-header-left {
|
.comment-header-left {
|
||||||
@ -547,7 +609,6 @@ defineExpose({ changeCommentVoteoption, wipeCommentVoteoption })
|
|||||||
|
|
||||||
.comments-time {
|
.comments-time {
|
||||||
color: #aaaaaa;
|
color: #aaaaaa;
|
||||||
// margin-right: 8px;
|
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -754,3 +815,46 @@ defineExpose({ changeCommentVoteoption, wipeCommentVoteoption })
|
|||||||
padding: 80px 0 110px;
|
padding: 80px 0 110px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
<style>
|
||||||
|
.automatic-reviews-popup {
|
||||||
|
border-radius: 10px;
|
||||||
|
.automatic-header {
|
||||||
|
padding: 20px;
|
||||||
|
border-bottom: 1px dotted #ebebeb;
|
||||||
|
.automatic-title {
|
||||||
|
font-weight: 650;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #000000;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
.automatic-have {
|
||||||
|
background-color: rgba(246, 246, 246, 1);
|
||||||
|
font-size: 12px;
|
||||||
|
color: #aaa;
|
||||||
|
width: fit-content;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.automatic-input {
|
||||||
|
.el-textarea__inner {
|
||||||
|
min-height: 256px !important;
|
||||||
|
box-shadow: none;
|
||||||
|
padding: 20px;
|
||||||
|
resize: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.automatic-bottom {
|
||||||
|
justify-content: flex-end;
|
||||||
|
padding: 0 10px 10px;
|
||||||
|
.automatic-send {
|
||||||
|
background-color: var(--main-color);
|
||||||
|
color: #fff;
|
||||||
|
font-size: 16px;
|
||||||
|
width: 100px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 6px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@ -101,7 +101,6 @@ const getCollect = () => {
|
|||||||
showList.value = collectList
|
showList.value = collectList
|
||||||
// showList.value = showList.value.concat(data.data)
|
// showList.value = showList.value.concat(data.data)
|
||||||
|
|
||||||
console.log(collectList.length, data["count"])
|
|
||||||
if (collectList.length < data["count"]) collectPage++
|
if (collectList.length < data["count"]) collectPage++
|
||||||
else collectPage = 0
|
else collectPage = 0
|
||||||
|
|
||||||
|
|||||||
@ -52,7 +52,7 @@
|
|||||||
<div class="message">{{ info.message }}</div>
|
<div class="message">{{ info.message }}</div>
|
||||||
|
|
||||||
<div class="hint">{{ info.status == 1 && isvote == 0 ? `已有 ${info.votes || 0} 人参与，` : `共有 ${info.votes || 0} 人参与` }} {{ `${isvote == 1 ? "你已投票" : info.status == 1 ? "参与投票即可查看实时结果" : ""}` }}</div>
|
<div class="hint">{{ info.status == 1 && isvote == 0 ? `已有 ${info.votes || 0} 人参与，` : `共有 ${info.votes || 0} 人参与` }} {{ `${isvote == 1 ? "你已投票" : info.status == 1 ? "参与投票即可查看实时结果" : ""}` }}</div>
|
||||||
|
<ClientOnly>
|
||||||
<div class="option-list flexflex" v-if="info['status'] == 1 && isvote == 0">
|
<div class="option-list flexflex" v-if="info['status'] == 1 && isvote == 0">
|
||||||
<div class="option-item flexflex" v-for="(item, index) in option" :key="item.id" @click="handleVote(item.id, index)">
|
<div class="option-item flexflex" v-for="(item, index) in option" :key="item.id" @click="handleVote(item.id, index)">
|
||||||
<div class="serial flexcenter">{{ index + 1 }}</div>
|
<div class="serial flexcenter">{{ index + 1 }}</div>
|
||||||
@ -72,23 +72,10 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</ClientOnly>
|
||||||
</div>
|
</div>
|
||||||
<div class="right"><DetailsComments ref="commentsRef" :token="token"></DetailsComments></div>
|
<div class="right"><DetailsComments ref="commentsRef" :token="token"></DetailsComments></div>
|
||||||
<DetailsArea></DetailsArea>
|
<DetailsArea></DetailsArea>
|
||||||
|
|
||||||
<!-- 投票后自动评论 -->
|
|
||||||
<template v-if="false">
|
|
||||||
<el-dialog class="default-popup automatic-reviews-popup" v-model="reviewsPopoverState" width="720px" align-center autosize>
|
|
||||||
<div class="automatic-header">
|
|
||||||
<div class="automatic-title">说说您的投票理由</div>
|
|
||||||
<div class="automatic-have">已投：还是申点其他的保底吧</div>
|
|
||||||
</div>
|
|
||||||
<el-input class="automatic-input" placeholder="请输入…" v-model="aaaaa" type="textarea"></el-input>
|
|
||||||
<div class="automatic-bottom flexflex">
|
|
||||||
<div class="automatic-send flexcenter">发送</div>
|
|
||||||
</div>
|
|
||||||
</el-dialog>
|
|
||||||
</template>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<el-dialog class="default-popup options-popup" v-model="cancelPopoverState" width="488px" align-center>
|
<el-dialog class="default-popup options-popup" v-model="cancelPopoverState" width="488px" align-center>
|
||||||
@ -116,10 +103,6 @@ let id = route.params.id
|
|||||||
const uniqidEnd = id.charAt(id.length - 1)
|
const uniqidEnd = id.charAt(id.length - 1)
|
||||||
const uniqidIndex = base62ToDecimal(uniqidEnd) % 6
|
const uniqidIndex = base62ToDecimal(uniqidEnd) % 6
|
||||||
|
|
||||||
let aaaaa = ref("")
|
|
||||||
|
|
||||||
let reviewsPopoverState = ref(true)
|
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
getDetails()
|
getDetails()
|
||||||
clearBottom()
|
clearBottom()
|
||||||
@ -136,6 +119,7 @@ let option = ref([])
|
|||||||
let token = ref("")
|
let token = ref("")
|
||||||
let cancelPopoverState = ref(false) // 取消投票弹窗
|
let cancelPopoverState = ref(false) // 取消投票弹窗
|
||||||
let isLoaded = ref(false) // 是否加载了
|
let isLoaded = ref(false) // 是否加载了
|
||||||
|
let haveVotedValue = ref("") // 已投的值
|
||||||
|
|
||||||
provide("info", info)
|
provide("info", info)
|
||||||
provide("islike", islike)
|
provide("islike", islike)
|
||||||
@ -143,6 +127,7 @@ provide("iscollection", iscollection)
|
|||||||
provide("token", token)
|
provide("token", token)
|
||||||
provide("qrcode", qrcode)
|
provide("qrcode", qrcode)
|
||||||
provide("isLoaded", isLoaded)
|
provide("isLoaded", isLoaded)
|
||||||
|
provide("haveVotedValue", haveVotedValue)
|
||||||
|
|
||||||
const getDetails = () => {
|
const getDetails = () => {
|
||||||
detailsHttp({ uniqid: id }).then(res => {
|
detailsHttp({ uniqid: id }).then(res => {
|
||||||
@ -153,6 +138,7 @@ const getDetails = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
let data = res.data
|
let data = res.data
|
||||||
|
|
||||||
info.value = data["info"]
|
info.value = data["info"]
|
||||||
isvote.value = data["isvote"]
|
isvote.value = data["isvote"]
|
||||||
iscollection.value = data["iscollection"]
|
iscollection.value = data["iscollection"]
|
||||||
@ -162,7 +148,13 @@ const getDetails = () => {
|
|||||||
qrcode.value = data.share?.qrcode
|
qrcode.value = data.share?.qrcode
|
||||||
token.value = data["token"]
|
token.value = data["token"]
|
||||||
seo.value = data.seo
|
seo.value = data.seo
|
||||||
|
|
||||||
isLoaded.value = true
|
isLoaded.value = true
|
||||||
|
|
||||||
|
data["option"].forEach(element => {
|
||||||
|
if (element.selected) haveVotedValue.value = element.value
|
||||||
|
})
|
||||||
|
// haveVotedValue
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -192,6 +184,13 @@ provide("TAHomePage", TAHomePage)
|
|||||||
const commentsRef = ref(null)
|
const commentsRef = ref(null)
|
||||||
let voteLoading = false
|
let voteLoading = false
|
||||||
|
|
||||||
|
// 处理点击投票的中转
|
||||||
|
const handleVotesTransfer = index => {
|
||||||
|
const target = option.value[index]
|
||||||
|
if (info.value.status == 1 && isvote.value == 0) handleVote(target.id, index)
|
||||||
|
else handleUnvoteVote(index)
|
||||||
|
}
|
||||||
|
|
||||||
// 处理点击投票
|
// 处理点击投票
|
||||||
const handleVote = (token, index) => {
|
const handleVote = (token, index) => {
|
||||||
if (isNeedLogin.value) {
|
if (isNeedLogin.value) {
|
||||||
@ -211,15 +210,21 @@ const handleVote = (token, index) => {
|
|||||||
}
|
}
|
||||||
let data = res.data
|
let data = res.data
|
||||||
let optionList = data["optionList"] || []
|
let optionList = data["optionList"] || []
|
||||||
|
optionList.forEach(element => {
|
||||||
|
element["selected"] = 0
|
||||||
|
})
|
||||||
optionList[index]["selected"] = 1
|
optionList[index]["selected"] = 1
|
||||||
option.value = optionList
|
option.value = optionList
|
||||||
isvote.value = 1
|
isvote.value = 1
|
||||||
info.value.votes = data["votes"]
|
info.value.votes = data["votes"]
|
||||||
|
|
||||||
const value = optionList[index]["value"]
|
const value = optionList[index]["value"]
|
||||||
|
haveVotedValue.value = value
|
||||||
commentsRef.value.changeCommentVoteoption(value)
|
commentsRef.value.changeCommentVoteoption(value)
|
||||||
|
|
||||||
ElMessage.success(res.message)
|
ElMessage.success(res.message)
|
||||||
|
|
||||||
|
if (index != optionList.length - 1) commentsRef.value.reviewsComment(optionList[index]["value"])
|
||||||
})
|
})
|
||||||
.finally(() => (voteLoading = false))
|
.finally(() => (voteLoading = false))
|
||||||
}
|
}
|
||||||
@ -256,7 +261,10 @@ const unvoteVote = () => {
|
|||||||
}
|
}
|
||||||
let data = res.data
|
let data = res.data
|
||||||
let optionList = data["optionList"] || []
|
let optionList = data["optionList"] || []
|
||||||
optionList[unvoteVoteIndex]["selected"] = 0
|
// optionList[unvoteVoteIndex]["selected"] = 0
|
||||||
|
optionList.forEach(element => {
|
||||||
|
element["selected"] = 0
|
||||||
|
})
|
||||||
option.value = optionList
|
option.value = optionList
|
||||||
isvote.value = 0
|
isvote.value = 0
|
||||||
info.value.votes = data["votes"]
|
info.value.votes = data["votes"]
|
||||||
@ -312,6 +320,18 @@ const clearBottom = () => {
|
|||||||
let topHeadRef = ref(null)
|
let topHeadRef = ref(null)
|
||||||
provide("topHeadRef", topHeadRef)
|
provide("topHeadRef", topHeadRef)
|
||||||
|
|
||||||
|
// 底部导航栏 的 点击评论输入值
|
||||||
|
let floorCommentInput = ref("")
|
||||||
|
|
||||||
|
// 底部导航栏 的 点击发送评论 type input back
|
||||||
|
const floorCommentBtn = type => {
|
||||||
|
if (type == "input") commentsRef.value.bottomNavigationBar(floorCommentInput.value)
|
||||||
|
else floorCommentInput.value = ""
|
||||||
|
}
|
||||||
|
|
||||||
|
provide("floorCommentInput", floorCommentInput)
|
||||||
|
provide("floorCommentBtn", floorCommentBtn)
|
||||||
|
|
||||||
try {
|
try {
|
||||||
if (process.server) {
|
if (process.server) {
|
||||||
await detailsHttp({ uniqid: id }).then(res => {
|
await detailsHttp({ uniqid: id }).then(res => {
|
||||||
@ -500,6 +520,12 @@ try {
|
|||||||
margin-top: 3px;
|
margin-top: 3px;
|
||||||
margin-right: 6px;
|
margin-right: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.option-progress,
|
||||||
|
.option-number,
|
||||||
|
.tick-icon {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.option-area {
|
.option-area {
|
||||||
@ -533,6 +559,10 @@ try {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.serial {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
.option-number {
|
.option-number {
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
@ -625,6 +655,7 @@ try {
|
|||||||
background-color: rgba(249, 93, 93, 1);
|
background-color: rgba(249, 93, 93, 1);
|
||||||
border-color: rgba(249, 93, 93, 1);
|
border-color: rgba(249, 93, 93, 1);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
|
margin-left: 20px;
|
||||||
}
|
}
|
||||||
&.options-no {
|
&.options-no {
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
@ -634,46 +665,4 @@ try {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.automatic-reviews-popup {
|
|
||||||
border-radius: 10px;
|
|
||||||
.automatic-header {
|
|
||||||
padding: 20px;
|
|
||||||
border-bottom: 1px dotted #ebebeb;
|
|
||||||
.automatic-title {
|
|
||||||
font-weight: 650;
|
|
||||||
font-size: 18px;
|
|
||||||
color: #000000;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
}
|
|
||||||
.automatic-have {
|
|
||||||
background-color: rgba(246, 246, 246, 1);
|
|
||||||
font-size: 12px;
|
|
||||||
color: #aaa;
|
|
||||||
width: fit-content;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.automatic-input {
|
|
||||||
.el-textarea__inner {
|
|
||||||
min-height: 256px !important;
|
|
||||||
box-shadow: none;
|
|
||||||
padding: 20px;
|
|
||||||
resize: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.automatic-bottom {
|
|
||||||
justify-content: flex-end;
|
|
||||||
padding: 10px;
|
|
||||||
.automatic-send {
|
|
||||||
background-color: var(--main-color);
|
|
||||||
color: #fff;
|
|
||||||
font-size: 16px;
|
|
||||||
width: 100px;
|
|
||||||
height: 40px;
|
|
||||||
border-radius: 6px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -10,7 +10,7 @@ axios.defaults.withCredentials = true
|
|||||||
axios.interceptors.request.use( //响应拦截
|
axios.interceptors.request.use( //响应拦截
|
||||||
async config => {
|
async config => {
|
||||||
// 开发时登录用的，可以直接替换小程序的 authorization
|
// 开发时登录用的，可以直接替换小程序的 authorization
|
||||||
config['headers']['authorization'] = process.env.NODE_ENV !== "production" && "be0e96a37a79c3ab16851b9a4318b03a"
|
config['headers']['authorization'] = process.env.NODE_ENV !== "production" && "8982b87c1dd25cbfde7ea187235351c8"
|
||||||
// config['headers']['authorization'] = "bee67e306e40b7d273d894657043eeb0"
|
// config['headers']['authorization'] = "bee67e306e40b7d273d894657043eeb0"
|
||||||
return config;
|
return config;
|
||||||
},
|
},
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user