讨论加特殊图标
This commit is contained in:
DESKTOP-RQ919RC\Pc
@@ -17,7 +17,7 @@
|
||||
|
||||
<div class="bottom flexacenter">
|
||||
<div class="operate flexacenter">
|
||||
<div class="item" :class="{ 'pitch': editEmojiState }">
|
||||
<div class="item" :class="{ pitch: editEmojiState }">
|
||||
<img class="icon" src="@/img/smiling-face.png" @click="openEditEmoji()" alt="" />
|
||||
<div class="emoji-box">
|
||||
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEditEmoji(item)">{{ item }}</div>
|
||||
@@ -25,7 +25,7 @@
|
||||
</div>
|
||||
<div class="item flexacenter" @click="judgeLogin()">
|
||||
<input class="file" type="file" @change="handleFileUpload($event)" accept=".png, .jpg, .jpeg" />
|
||||
<img class="icon" style="border-radius: 0;" src="@/img/picture-icon.png" alt="" />
|
||||
<img class="icon" style="border-radius: 0" src="@/img/picture-icon.png" alt="" />
|
||||
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -55,7 +55,7 @@
|
||||
|
||||
<div class="bottom flexacenter">
|
||||
<div class="operate flexacenter">
|
||||
<div class="item" :class="{ 'pitch': emojiState }">
|
||||
<div class="item" :class="{ pitch: emojiState }">
|
||||
<img class="icon" src="/img/smiling-face.png" @click="openEmoji()" alt="" />
|
||||
<div class="emoji-box">
|
||||
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEmoji(item)">{{ item }}</div>
|
||||
@@ -63,7 +63,7 @@
|
||||
</div>
|
||||
<div class="item flexacenter" @click="judgeLogin()">
|
||||
<input class="file" type="file" @change="handleFileUpload($event)" accept=".png, .jpg, .jpeg" />
|
||||
<img class="icon" style="border-radius: 0;" src="/img/picture-icon.png" alt="" />
|
||||
<img class="icon" style="border-radius: 0" src="/img/picture-icon.png" alt="" />
|
||||
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -79,6 +79,8 @@
|
||||
<div class="comments-username" @click="openUserInfo(index)">{{ item["nickname"] || "匿名用户" }}</div>
|
||||
<div class="comments-time">{{ handleDate(item["timestamp"]) }}</div>
|
||||
<div class="comments-identity" v-if="item['isauthor'] == 1">提问者</div>
|
||||
<img class="comments-title" v-if="item['groupimage']" :src="item.groupimage" :alt="item.grouptitle" style="height: 17px" />
|
||||
|
||||
<div class="avatar-box flexflex" v-if="item['avatarState']">
|
||||
<a class="avatar-item flexcenter" target="_blank" @click.prevent="sendMessage(item['uin'])">
|
||||
<img class="avatar-icon" src="@/img/send-messages-icon.png" />
|
||||
@@ -124,7 +126,7 @@
|
||||
</div>
|
||||
<div class="bottom flexacenter">
|
||||
<div class="operate flexacenter">
|
||||
<div class="item" :class="{ 'pitch': item.emojiState }">
|
||||
<div class="item" :class="{ pitch: item.emojiState }">
|
||||
<img class="icon" src="/img/smiling-face.png" @click="openEmoji(index)" alt="" />
|
||||
<div class="emoji-box">
|
||||
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEmoji(item, index)">{{ item }}</div>
|
||||
@@ -132,7 +134,7 @@
|
||||
</div>
|
||||
<div class="item flexacenter" @click="judgeLogin()">
|
||||
<input class="file" type="file" @change="handleFileUpload($event, index)" accept=".png, .jpg, .jpeg" />
|
||||
<img class="icon" style="border-radius: 0;" src="/img/picture-icon.png" alt="" />
|
||||
<img class="icon" style="border-radius: 0" src="/img/picture-icon.png" alt="" />
|
||||
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -150,6 +152,7 @@
|
||||
<!-- <div class="comments-identity" v-if="ite['questioner'] == 1">提问者</div> -->
|
||||
<!-- <div class="comments-identity" v-else-if="ite['isauthor'] == 1">回答者</div> -->
|
||||
<div class="comments-identity" v-if="ite['isauthor'] == 1">提问者</div>
|
||||
<img class="comments-title" v-if="ite['groupimage']" :src="ite.groupimage" :alt="ite.grouptitle" style="height: 17px" />
|
||||
<div class="avatar-box flexflex" v-if="ite['avatarState']">
|
||||
<a class="avatar-item flexcenter" target="_blank" @click.prevent="sendMessage(ite['uin'])">
|
||||
<img class="avatar-icon" src="@/img/send-messages-icon.png" />
|
||||
@@ -199,7 +202,7 @@
|
||||
</div>
|
||||
<div class="bottom flexacenter">
|
||||
<div class="operate flexacenter">
|
||||
<div class="item" :class="{ 'pitch': ite.emojiState }">
|
||||
<div class="item" :class="{ pitch: ite.emojiState }">
|
||||
<img class="icon" src="/img/smiling-face.png" @click="openEmoji(index, i)" alt="" />
|
||||
<div class="emoji-box">
|
||||
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEmoji(item, index, i)">{{ item }}</div>
|
||||
@@ -207,7 +210,7 @@
|
||||
</div>
|
||||
<div class="item flexacenter" @click="judgeLogin()">
|
||||
<input class="file" type="file" @change="handleFileUpload($event, index, i)" accept=".png, .jpg, .jpeg" />
|
||||
<img class="icon" style="border-radius: 0;" src="/img/picture-icon.png" alt="" />
|
||||
<img class="icon" style="border-radius: 0" src="/img/picture-icon.png" alt="" />
|
||||
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -229,103 +232,103 @@
|
||||
<script setup>
|
||||
const props = defineProps({
|
||||
token: String,
|
||||
})
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
// getComment()
|
||||
})
|
||||
let permissions = ref([])
|
||||
});
|
||||
let permissions = ref([]);
|
||||
|
||||
onMounted(() => {
|
||||
// setTimeout(() => {
|
||||
// permissions.value = window["permissions"] || []
|
||||
// // permissions.value = ["comment.edit", "comment.delete"]
|
||||
// }, 1000)
|
||||
})
|
||||
});
|
||||
|
||||
const emit = defineEmits()
|
||||
const emit = defineEmits();
|
||||
|
||||
const $ajax = inject("$ajax")
|
||||
const $ajaxGET = inject("$ajaxGET")
|
||||
const detailsToken = inject("detailsToken")
|
||||
const handleDate = inject("handleDate")
|
||||
const isNeedLogin = inject("isNeedLogin")
|
||||
const handleMsg = inject("handleMsg")
|
||||
const uploadImg = inject("uploadImg")
|
||||
const handleAnswerText = inject("handleAnswerText")
|
||||
const emojiMaskState = inject("emojiMaskState")
|
||||
const user = inject("user")
|
||||
const goLogin = inject("goLogin")
|
||||
const $ajax = inject("$ajax");
|
||||
const $ajaxGET = inject("$ajaxGET");
|
||||
const detailsToken = inject("detailsToken");
|
||||
const handleDate = inject("handleDate");
|
||||
const isNeedLogin = inject("isNeedLogin");
|
||||
const handleMsg = inject("handleMsg");
|
||||
const uploadImg = inject("uploadImg");
|
||||
const handleAnswerText = inject("handleAnswerText");
|
||||
const emojiMaskState = inject("emojiMaskState");
|
||||
const user = inject("user");
|
||||
const goLogin = inject("goLogin");
|
||||
|
||||
const detailLoading = inject("detailLoading")
|
||||
const detailLoading = inject("detailLoading");
|
||||
|
||||
// 点击ta的主页
|
||||
const TAHomePage = uin => {
|
||||
redirectToExternalWebsite(`https://bbs.gter.net/home.php?mod=space&uid=${uin}`)
|
||||
}
|
||||
const TAHomePage = (uin) => {
|
||||
redirectToExternalWebsite(`https://bbs.gter.net/home.php?mod=space&uid=${uin}`);
|
||||
};
|
||||
|
||||
// 点击发送信息
|
||||
const sendMessage = uin => {
|
||||
const sendMessage = (uin) => {
|
||||
if (uin && typeof messagePrivateItem == "function") {
|
||||
messagePrivateItem({ uin: uin })
|
||||
return
|
||||
} else redirectToExternalWebsite(`https://bbs.gter.net/home.php?mod=space&showmsg=1&uid=${uin}`)
|
||||
}
|
||||
messagePrivateItem({ uin: uin });
|
||||
return;
|
||||
} else redirectToExternalWebsite(`https://bbs.gter.net/home.php?mod=space&showmsg=1&uid=${uin}`);
|
||||
};
|
||||
|
||||
// 跳转 url
|
||||
const redirectToExternalWebsite = url => {
|
||||
const link = document.createElement("a")
|
||||
link.href = url
|
||||
link.target = "_blank"
|
||||
link.click()
|
||||
}
|
||||
const redirectToExternalWebsite = (url) => {
|
||||
const link = document.createElement("a");
|
||||
link.href = url;
|
||||
link.target = "_blank";
|
||||
link.click();
|
||||
};
|
||||
|
||||
const commentList = ref([])
|
||||
let commentCount = ref(0)
|
||||
let commentTotalCount = ref(0)
|
||||
let commentPage = ref(1)
|
||||
let isgetCommentSate = false // 请求评论状态
|
||||
let alreadyCommentIdList = []
|
||||
const commentList = ref([]);
|
||||
let commentCount = ref(0);
|
||||
let commentTotalCount = ref(0);
|
||||
let commentPage = ref(1);
|
||||
let isgetCommentSate = false; // 请求评论状态
|
||||
let alreadyCommentIdList = [];
|
||||
|
||||
const getComment = () => {
|
||||
if (commentPage.value == 0 || isgetCommentSate) return
|
||||
isgetCommentSate = true
|
||||
if (commentPage.value == 0 || isgetCommentSate) return;
|
||||
isgetCommentSate = true;
|
||||
$ajax("/api/comment/lists", {
|
||||
token: detailsToken.value,
|
||||
page: commentPage.value,
|
||||
limit: 1500,
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code != 200) return
|
||||
let data = res.data
|
||||
.then((res) => {
|
||||
if (res.code != 200) return;
|
||||
let data = res.data;
|
||||
|
||||
data.data.forEach((element, index) => {
|
||||
element["isReplyBoxShow"] = 0
|
||||
element["isReplyBoxShow"] = 0;
|
||||
// element.timestamp = util.timeformat(element.timestamp, 2)
|
||||
if (element.child.length > 0) {
|
||||
element.child.forEach(el => {
|
||||
element.child.forEach((el) => {
|
||||
// el.timestamp = util.timeformat(el.timestamp, 2)
|
||||
el["isReplyBoxShow"] = 0
|
||||
})
|
||||
el["isReplyBoxShow"] = 0;
|
||||
});
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
if (commentPage.value > 1) {
|
||||
let alreadyCommentIdList = alreadyCommentIdList
|
||||
let alreadyCommentIdList = alreadyCommentIdList;
|
||||
for (let index = 0; index < data.data.length; index++) {
|
||||
if (alreadyCommentIdList.includes(data.data[index].id)) {
|
||||
data.data.splice(index, 1)
|
||||
index--
|
||||
data.data.splice(index, 1);
|
||||
index--;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
commentList.value = commentList.value.concat(data.data)
|
||||
commentList.value = commentList.value.concat(data.data);
|
||||
// console.log("commentList", commentList.value)
|
||||
|
||||
commentCount.value = data.count
|
||||
commentTotalCount.value = data.comments
|
||||
commentPage.value = data.count > commentList.length ? commentPage.value + 1 : 0
|
||||
commentCount.value = data.count;
|
||||
commentTotalCount.value = data.comments;
|
||||
commentPage.value = data.count > commentList.length ? commentPage.value + 1 : 0;
|
||||
|
||||
// console.log("commentList", commentList)
|
||||
// this.setData({
|
||||
@@ -336,206 +339,206 @@ const getComment = () => {
|
||||
// })
|
||||
})
|
||||
.finally(() => {
|
||||
isgetCommentSate = false
|
||||
})
|
||||
}
|
||||
isgetCommentSate = false;
|
||||
});
|
||||
};
|
||||
|
||||
let picture = ref({})
|
||||
let picture = ref({});
|
||||
|
||||
// 监听 detailsToken 的变化
|
||||
watch(
|
||||
detailsToken,
|
||||
(newValue, oldValue) => {
|
||||
if (newValue !== oldValue) {
|
||||
commentPage.value = 1
|
||||
commentList.value = []
|
||||
picture.value = {}
|
||||
commentTotalCount.value = 0
|
||||
commentCount.value = 0
|
||||
alreadyCommentIdList = []
|
||||
getComment()
|
||||
commentPage.value = 1;
|
||||
commentList.value = [];
|
||||
picture.value = {};
|
||||
commentTotalCount.value = 0;
|
||||
commentCount.value = 0;
|
||||
alreadyCommentIdList = [];
|
||||
getComment();
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
);
|
||||
|
||||
const maxSize = 20 * 1024 * 1024 // 20MB
|
||||
const maxSize = 20 * 1024 * 1024; // 20MB
|
||||
|
||||
const handleFileUpload = (event, index, i) => {
|
||||
if (isNeedLogin.value) {
|
||||
goLogin()
|
||||
return
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
closeEmoji()
|
||||
const file = event.target.files[0] // 获取选择的文件
|
||||
closeEmoji();
|
||||
const file = event.target.files[0]; // 获取选择的文件
|
||||
|
||||
if (!file) return
|
||||
if (!file) return;
|
||||
|
||||
if (file.size > maxSize) {
|
||||
handleMsg("error", "文件大小不能超过 20MB")
|
||||
return
|
||||
handleMsg("error", "文件大小不能超过 20MB");
|
||||
return;
|
||||
}
|
||||
|
||||
const reader = new FileReader()
|
||||
reader.onload = e => {
|
||||
const base64 = e.target.result
|
||||
uploadImg(base64).then(res => {
|
||||
const reader = new FileReader();
|
||||
reader.onload = (e) => {
|
||||
const base64 = e.target.result;
|
||||
uploadImg(base64).then((res) => {
|
||||
const obj = {
|
||||
base64,
|
||||
...res,
|
||||
}
|
||||
};
|
||||
|
||||
if (editCommentState.value) editPicture.value = obj
|
||||
if (editCommentState.value) editPicture.value = obj;
|
||||
else {
|
||||
if (i != undefined) commentList.value[index].child[i]["picture"] = obj
|
||||
else if (index != undefined) commentList.value[index]["picture"] = obj
|
||||
else picture.value = obj
|
||||
if (i != undefined) commentList.value[index].child[i]["picture"] = obj;
|
||||
else if (index != undefined) commentList.value[index]["picture"] = obj;
|
||||
else picture.value = obj;
|
||||
}
|
||||
handleMsg("success", "上传成功")
|
||||
})
|
||||
}
|
||||
reader.readAsDataURL(file)
|
||||
}
|
||||
handleMsg("success", "上传成功");
|
||||
});
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
};
|
||||
|
||||
// 删除上传的图片
|
||||
const closeFileUpload = (index, i) => {
|
||||
if (i != undefined) commentList.value[index].child[i]["picture"] = {}
|
||||
else if (index != undefined) commentList.value[index]["picture"] = {}
|
||||
else picture.value = {}
|
||||
}
|
||||
if (i != undefined) commentList.value[index].child[i]["picture"] = {};
|
||||
else if (index != undefined) commentList.value[index]["picture"] = {};
|
||||
else picture.value = {};
|
||||
};
|
||||
|
||||
//
|
||||
let emojiState = ref(false)
|
||||
let emojiState = ref(false);
|
||||
|
||||
const emojiData = ["😀", "😁", "😆", "😅", "😂", "😉", "😍", "🥰", "😋", "😜", "🤪", "😎", "🤩", "🥳", "😔", "🙁", "😭", "😡", "😳", "🤗", "🤔", "🤭", "🤫", "😯", "😵", "🙄", "🥴", "🤢", "🤑", "🤠", "👌", "✌️", "🤟", "🤘", "🤙", "👍", "👎", "✊", "👏", "🤝", "🙏", "💪", "❤️", "💔", "🌹", "🥀", "🎉", "🎁", "🧧", "🌙", "⭐", "🌍", "💌", "📬", "🚗", "🚕", "🚲", "🛵", "🚀", "🚁", "⛵", "🚢", "🍎", "🍐", "🍊", "🍉", "🍓", "🍑", "🍔", "🍟", "🍕", "🥪", "🍜", "🍡", "🍨", "🍦", "🎂", "🍰", "🍭", "🍿", "🍩", "🧃", "🍹"]
|
||||
const emojiData = ["😀", "😁", "😆", "😅", "😂", "😉", "😍", "🥰", "😋", "😜", "🤪", "😎", "🤩", "🥳", "😔", "🙁", "😭", "😡", "😳", "🤗", "🤔", "🤭", "🤫", "😯", "😵", "🙄", "🥴", "🤢", "🤑", "🤠", "👌", "✌️", "🤟", "🤘", "🤙", "👍", "👎", "✊", "👏", "🤝", "🙏", "💪", "❤️", "💔", "🌹", "🥀", "🎉", "🎁", "🧧", "🌙", "⭐", "🌍", "💌", "📬", "🚗", "🚕", "🚲", "🛵", "🚀", "🚁", "⛵", "🚢", "🍎", "🍐", "🍊", "🍉", "🍓", "🍑", "🍔", "🍟", "🍕", "🥪", "🍜", "🍡", "🍨", "🍦", "🎂", "🍰", "🍭", "🍿", "🍩", "🧃", "🍹"];
|
||||
|
||||
// 打开 Emoji
|
||||
const openEmoji = (index, i) => {
|
||||
if (isNeedLogin.value) {
|
||||
goLogin()
|
||||
return
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
if (i != undefined) commentList.value[index].child[i]["emojiState"] = true
|
||||
else if (index != undefined) commentList.value[index]["emojiState"] = true
|
||||
if (i != undefined) commentList.value[index].child[i]["emojiState"] = true;
|
||||
else if (index != undefined) commentList.value[index]["emojiState"] = true;
|
||||
else {
|
||||
closeEmoji()
|
||||
closeAnswerCommentsChild()
|
||||
emojiState.value = true
|
||||
closeEmoji();
|
||||
closeAnswerCommentsChild();
|
||||
emojiState.value = true;
|
||||
}
|
||||
|
||||
emojiMaskState.value = true
|
||||
}
|
||||
emojiMaskState.value = true;
|
||||
};
|
||||
|
||||
// 关闭 Emoji
|
||||
const closeEmoji = (index, i) => {
|
||||
commentList.value.forEach(ele => {
|
||||
ele["emojiState"] = false
|
||||
commentList.value.forEach((ele) => {
|
||||
ele["emojiState"] = false;
|
||||
if (ele["child"] && ele["child"].length != 0) {
|
||||
ele["child"].forEach(el => {
|
||||
el["emojiState"] = false
|
||||
})
|
||||
ele["child"].forEach((el) => {
|
||||
el["emojiState"] = false;
|
||||
});
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
emojiState.value = false
|
||||
emojiMaskState.value = false
|
||||
editEmojiState.value = false
|
||||
}
|
||||
emojiState.value = false;
|
||||
emojiMaskState.value = false;
|
||||
editEmojiState.value = false;
|
||||
};
|
||||
|
||||
defineExpose({
|
||||
closeEmoji,
|
||||
})
|
||||
});
|
||||
|
||||
// 选择 Emoji
|
||||
const selectEmoji = (key, index, i) => {
|
||||
closeEmoji()
|
||||
closeEmoji();
|
||||
if (i != undefined) {
|
||||
if (!commentList.value[index]["child"][i]["commentInput"]) commentList.value[index]["child"][i]["commentInput"] = ""
|
||||
commentList.value[index]["child"][i]["commentInput"] += key
|
||||
if (!commentList.value[index]["child"][i]["commentInput"]) commentList.value[index]["child"][i]["commentInput"] = "";
|
||||
commentList.value[index]["child"][i]["commentInput"] += key;
|
||||
} else if (index != undefined) {
|
||||
if (!commentList.value[index]["commentInput"]) commentList.value[index]["commentInput"] = ""
|
||||
commentList.value[index]["commentInput"] += key
|
||||
if (!commentList.value[index]["commentInput"]) commentList.value[index]["commentInput"] = "";
|
||||
commentList.value[index]["commentInput"] += key;
|
||||
} else {
|
||||
inputTextarea.value += key
|
||||
inputTextarea.value += key;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 自动输入框增高
|
||||
const autoResize = e => {
|
||||
e.target.style.height = "auto" // 重置高度
|
||||
e.target.style.height = `${e.target.scrollHeight}px` // 设置为内容高度
|
||||
}
|
||||
const autoResize = (e) => {
|
||||
e.target.style.height = "auto"; // 重置高度
|
||||
e.target.style.height = `${e.target.scrollHeight}px`; // 设置为内容高度
|
||||
};
|
||||
|
||||
const handleInputPaste = (event, index, ii) => {
|
||||
if (isNeedLogin.value) {
|
||||
goLogin()
|
||||
return
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
|
||||
const items = event.clipboardData.items // 获取粘贴的内容
|
||||
const items = event.clipboardData.items; // 获取粘贴的内容
|
||||
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
const item = items[i]
|
||||
const item = items[i];
|
||||
if (item.type.startsWith("image/")) {
|
||||
event.preventDefault()
|
||||
const file = item.getAsFile() // 获取文件
|
||||
event.preventDefault();
|
||||
const file = item.getAsFile(); // 获取文件
|
||||
|
||||
if (file.size > maxSize) {
|
||||
handleMsg("error", "文件大小不能超过 20MB")
|
||||
return
|
||||
handleMsg("error", "文件大小不能超过 20MB");
|
||||
return;
|
||||
}
|
||||
|
||||
const reader = new FileReader()
|
||||
reader.onload = e => {
|
||||
const base64 = e.target.result
|
||||
const reader = new FileReader();
|
||||
reader.onload = (e) => {
|
||||
const base64 = e.target.result;
|
||||
|
||||
uploadImg(base64).then(res => {
|
||||
uploadImg(base64).then((res) => {
|
||||
const obj = {
|
||||
base64,
|
||||
...res,
|
||||
}
|
||||
if (editCommentState.value) editPicture.value = obj
|
||||
};
|
||||
if (editCommentState.value) editPicture.value = obj;
|
||||
else {
|
||||
if (ii != undefined) commentList.value[index].child[ii]["picture"] = obj
|
||||
else if (index != undefined) commentList.value[index]["picture"] = obj
|
||||
else picture.value = obj
|
||||
if (ii != undefined) commentList.value[index].child[ii]["picture"] = obj;
|
||||
else if (index != undefined) commentList.value[index]["picture"] = obj;
|
||||
else picture.value = obj;
|
||||
}
|
||||
handleMsg("success", "上传成功")
|
||||
})
|
||||
}
|
||||
reader.readAsDataURL(file)
|
||||
handleMsg("success", "上传成功");
|
||||
});
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
let inputTextarea = ref("")
|
||||
let inputTextarea = ref("");
|
||||
|
||||
// 提交回答-评论
|
||||
const submitAnswerComments = (index, i) => {
|
||||
if (isNeedLogin.value) {
|
||||
goLogin()
|
||||
return
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
|
||||
let content = ""
|
||||
let parentid = null
|
||||
let token = detailsToken.value
|
||||
let image = {}
|
||||
let content = "";
|
||||
let parentid = null;
|
||||
let token = detailsToken.value;
|
||||
let image = {};
|
||||
|
||||
if (i != null) {
|
||||
content = commentList.value[index]["child"][i]["commentInput"]
|
||||
parentid = commentList.value[index]["child"][i]["id"]
|
||||
image = commentList.value[index]["child"][i]["picture"]
|
||||
content = commentList.value[index]["child"][i]["commentInput"];
|
||||
parentid = commentList.value[index]["child"][i]["id"];
|
||||
image = commentList.value[index]["child"][i]["picture"];
|
||||
} else if (index != null) {
|
||||
content = commentList.value[index]["commentInput"]
|
||||
parentid = commentList.value[index]["id"]
|
||||
image = commentList.value[index]["picture"]
|
||||
content = commentList.value[index]["commentInput"];
|
||||
parentid = commentList.value[index]["id"];
|
||||
image = commentList.value[index]["picture"];
|
||||
} else {
|
||||
content = inputTextarea.value
|
||||
image = picture.value
|
||||
content = inputTextarea.value;
|
||||
image = picture.value;
|
||||
}
|
||||
|
||||
detailLoading.value = true
|
||||
detailLoading.value = true;
|
||||
|
||||
$ajax("/api/comment/submit", {
|
||||
content,
|
||||
@@ -543,12 +546,12 @@ const submitAnswerComments = (index, i) => {
|
||||
parentid,
|
||||
image: image ? { aid: image.aid, url: image.url } : null,
|
||||
})
|
||||
.then(res => {
|
||||
.then((res) => {
|
||||
if (res.code != 200) {
|
||||
handleMsg("error", res["message"])
|
||||
return
|
||||
handleMsg("error", res["message"]);
|
||||
return;
|
||||
}
|
||||
let data = res.data
|
||||
let data = res.data;
|
||||
|
||||
if (i != null) {
|
||||
let targetData = {
|
||||
@@ -562,10 +565,10 @@ const submitAnswerComments = (index, i) => {
|
||||
},
|
||||
...data,
|
||||
image,
|
||||
}
|
||||
};
|
||||
|
||||
commentList.value[index]["child"].push(targetData)
|
||||
commentList.value[index]["childnum"]++
|
||||
commentList.value[index]["child"].push(targetData);
|
||||
commentList.value[index]["childnum"]++;
|
||||
} else if (index != null) {
|
||||
let targetData = {
|
||||
id: data["commentid"],
|
||||
@@ -576,9 +579,9 @@ const submitAnswerComments = (index, i) => {
|
||||
reply: [],
|
||||
...data,
|
||||
image,
|
||||
}
|
||||
commentList.value[index]["child"].unshift(targetData)
|
||||
commentList.value[index]["childnum"]++
|
||||
};
|
||||
commentList.value[index]["child"].unshift(targetData);
|
||||
commentList.value[index]["childnum"]++;
|
||||
} else {
|
||||
let targetData = {
|
||||
id: data["commentid"],
|
||||
@@ -589,87 +592,87 @@ const submitAnswerComments = (index, i) => {
|
||||
...data,
|
||||
child: [],
|
||||
image,
|
||||
}
|
||||
commentList.value.unshift(targetData)
|
||||
};
|
||||
commentList.value.unshift(targetData);
|
||||
// commentCount.value++
|
||||
inputTextarea.value = ""
|
||||
picture.value = {}
|
||||
inputTextarea.value = "";
|
||||
picture.value = {};
|
||||
}
|
||||
|
||||
commentTotalCount.value = data.count || 0
|
||||
commentTotalCount.value = data.count || 0;
|
||||
|
||||
emit("updateAnswers", data.count)
|
||||
emit("updateAnswers", data.count);
|
||||
|
||||
// targetAnswerList[index]["commentnum"] = data["count"]
|
||||
|
||||
closeAnswerCommentsChild()
|
||||
closeAnswerCommentsChild();
|
||||
|
||||
handleMsg("success", res["message"] || "操作成功")
|
||||
handleMsg("success", res["message"] || "操作成功");
|
||||
})
|
||||
.finally(() => {
|
||||
detailLoading.value = false
|
||||
})
|
||||
}
|
||||
detailLoading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
// 回答-评论 点赞
|
||||
const operateAnswerCommentsLike = (token, index, i) => {
|
||||
if (isNeedLogin.value) {
|
||||
goLogin()
|
||||
return
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
|
||||
$ajax("/api/comment/like", {
|
||||
token,
|
||||
}).then(res => {
|
||||
if (res.code != 200) return
|
||||
let data = res.data
|
||||
}).then((res) => {
|
||||
if (res.code != 200) return;
|
||||
let data = res.data;
|
||||
|
||||
if (i != undefined) {
|
||||
commentList.value[index].child[i]["islike"] = data["status"]
|
||||
commentList.value[index].child[i]["likenum"] = data["likenum"]
|
||||
commentList.value[index].child[i]["islike"] = data["status"];
|
||||
commentList.value[index].child[i]["likenum"] = data["likenum"];
|
||||
} else {
|
||||
commentList.value[index]["islike"] = data["status"]
|
||||
commentList.value[index]["likenum"] = data["likenum"]
|
||||
commentList.value[index]["islike"] = data["status"];
|
||||
commentList.value[index]["likenum"] = data["likenum"];
|
||||
}
|
||||
|
||||
handleMsg("success", res["message"] || "操作成功")
|
||||
})
|
||||
}
|
||||
handleMsg("success", res["message"] || "操作成功");
|
||||
});
|
||||
};
|
||||
|
||||
// 打开 回答-评论 的子评论
|
||||
const openAnswerCommentsChild = (index, i) => {
|
||||
// console.log("isNeedLogin", isNeedLogin)
|
||||
|
||||
if (isNeedLogin.value) {
|
||||
goLogin()
|
||||
return
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
|
||||
closeAnswerCommentsChild()
|
||||
closeAnswerCommentsChild();
|
||||
|
||||
if (i == null) commentList.value[index]["childState"] = true
|
||||
else commentList.value[index]["child"][i]["childState"] = true
|
||||
}
|
||||
if (i == null) commentList.value[index]["childState"] = true;
|
||||
else commentList.value[index]["child"][i]["childState"] = true;
|
||||
};
|
||||
|
||||
// 关闭 回答-评论 的子评论
|
||||
const closeAnswerCommentsChild = () => {
|
||||
commentList.value.forEach(ele => {
|
||||
ele["childState"] = false
|
||||
ele["commentInput"] = "" // 删除原本输入值
|
||||
commentList.value.forEach((ele) => {
|
||||
ele["childState"] = false;
|
||||
ele["commentInput"] = ""; // 删除原本输入值
|
||||
if (ele["child"] && ele["child"].length != 0) {
|
||||
ele["child"].forEach(el => {
|
||||
el["childState"] = false
|
||||
el["commentInput"] = ""
|
||||
})
|
||||
ele["child"].forEach((el) => {
|
||||
el["childState"] = false;
|
||||
el["commentInput"] = "";
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 获取剩下的子评论
|
||||
const alsoCommentsData = (index, i) => {
|
||||
// const targetAnswerList = [...answerList.value]
|
||||
const parentid = commentList.value[index]["id"]
|
||||
const token = detailsToken.value
|
||||
const parentid = commentList.value[index]["id"];
|
||||
const token = detailsToken.value;
|
||||
|
||||
$ajax("/api/comment/childrenList", {
|
||||
token,
|
||||
@@ -677,154 +680,154 @@ const alsoCommentsData = (index, i) => {
|
||||
limit: 2000,
|
||||
page: 1,
|
||||
childlimit: 3,
|
||||
}).then(res => {
|
||||
if (res.code != 200) return
|
||||
let data = res.data
|
||||
}).then((res) => {
|
||||
if (res.code != 200) return;
|
||||
let data = res.data;
|
||||
|
||||
let merged = [...commentList.value[index]["child"], ...data.data.filter(item2 => !commentList.value[index]["child"].find(item1 => item1.id == item2.id))]
|
||||
let merged = [...commentList.value[index]["child"], ...data.data.filter((item2) => !commentList.value[index]["child"].find((item1) => item1.id == item2.id))];
|
||||
|
||||
commentList.value[index]["child"] = merged
|
||||
commentList.value[index]["child"] = merged;
|
||||
// answerList.value = targetAnswerList
|
||||
})
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleMenuState = inject("handleMenuState")
|
||||
const handleMenuState = inject("handleMenuState");
|
||||
|
||||
const openMenuState = (index, i) => {
|
||||
if (isNeedLogin.value) {
|
||||
goLogin()
|
||||
return
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
let reportToken = ""
|
||||
if (i === undefined) reportToken = commentList.value[index]["token"]
|
||||
else reportToken = commentList.value[index]["child"][i]["token"]
|
||||
handleMenuState(reportToken)
|
||||
}
|
||||
let reportToken = "";
|
||||
if (i === undefined) reportToken = commentList.value[index]["token"];
|
||||
else reportToken = commentList.value[index]["child"][i]["token"];
|
||||
handleMenuState(reportToken);
|
||||
};
|
||||
|
||||
const openUserInfo = (index, i) => {
|
||||
if (i != undefined && commentList.value[index].child[i]["uin"] > 0) commentList.value[index].child[i]["avatarState"] = true
|
||||
else if (i == undefined && index != undefined && commentList.value[index]["uin"] > 0) commentList.value[index]["avatarState"] = true
|
||||
}
|
||||
if (i != undefined && commentList.value[index].child[i]["uin"] > 0) commentList.value[index].child[i]["avatarState"] = true;
|
||||
else if (i == undefined && index != undefined && commentList.value[index]["uin"] > 0) commentList.value[index]["avatarState"] = true;
|
||||
};
|
||||
|
||||
const closeUserInfo = (index, i) => {
|
||||
if (i != undefined) commentList.value[index].child[i]["avatarState"] = false
|
||||
else if (index != undefined) commentList.value[index]["avatarState"] = false
|
||||
}
|
||||
if (i != undefined) commentList.value[index].child[i]["avatarState"] = false;
|
||||
else if (index != undefined) commentList.value[index]["avatarState"] = false;
|
||||
};
|
||||
|
||||
// 点击删除
|
||||
const commentDelete = (token, index, i) => {
|
||||
$ajax("/api/comment/commentDelete", {
|
||||
token,
|
||||
}).then(res => {
|
||||
}).then((res) => {
|
||||
if (res.code != 200) {
|
||||
ElMessage.error(res.message)
|
||||
return
|
||||
ElMessage.error(res.message);
|
||||
return;
|
||||
}
|
||||
|
||||
if (i >= 0) {
|
||||
commentList.value[index].child.splice(i, 1)
|
||||
commentList.value[index].childnum -= 1
|
||||
commentList.value[index].child.splice(i, 1);
|
||||
commentList.value[index].childnum -= 1;
|
||||
} else {
|
||||
commentTotalCount.value -= commentList.value[index].childnum
|
||||
commentList.value.splice(index, 1)
|
||||
commentTotalCount.value -= commentList.value[index].childnum;
|
||||
commentList.value.splice(index, 1);
|
||||
}
|
||||
|
||||
commentTotalCount.value -= 1
|
||||
})
|
||||
}
|
||||
commentTotalCount.value -= 1;
|
||||
});
|
||||
};
|
||||
|
||||
const judgeLogin = () => {
|
||||
if (isNeedLogin.value) {
|
||||
goLogin()
|
||||
return
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
let editCommentState = ref(false)
|
||||
let editToken = ""
|
||||
let editPicture = ref({})
|
||||
let editInput = ref("")
|
||||
let editEmojiState = ref(false)
|
||||
const editInputRef = ref(null)
|
||||
let editCommentState = ref(false);
|
||||
let editToken = "";
|
||||
let editPicture = ref({});
|
||||
let editInput = ref("");
|
||||
let editEmojiState = ref(false);
|
||||
const editInputRef = ref(null);
|
||||
|
||||
const openEdit = (token, index, i) => {
|
||||
const list = JSON.parse(JSON.stringify(commentList.value))
|
||||
let target = {}
|
||||
if (i != null) target = list[index]["child"][i]
|
||||
else target = list[index]
|
||||
console.log(token, index, i, target)
|
||||
editToken = target.token || ""
|
||||
editInput.value = target.content || ""
|
||||
editPicture.value = target.image || {}
|
||||
const list = JSON.parse(JSON.stringify(commentList.value));
|
||||
let target = {};
|
||||
if (i != null) target = list[index]["child"][i];
|
||||
else target = list[index];
|
||||
console.log(token, index, i, target);
|
||||
editToken = target.token || "";
|
||||
editInput.value = target.content || "";
|
||||
editPicture.value = target.image || {};
|
||||
|
||||
editCommentState.value = true
|
||||
editCommentState.value = true;
|
||||
|
||||
nextTick(() => {
|
||||
console.log("editInput.value", editInputRef.value)
|
||||
editInputRef.value.style.height = `${editInputRef.value.scrollHeight}px`
|
||||
})
|
||||
}
|
||||
console.log("editInput.value", editInputRef.value);
|
||||
editInputRef.value.style.height = `${editInputRef.value.scrollHeight}px`;
|
||||
});
|
||||
};
|
||||
|
||||
const closeEdit = () => {
|
||||
editPicture.value = {}
|
||||
editToken = ""
|
||||
editInput.value = ""
|
||||
editCommentState.value = false
|
||||
}
|
||||
editPicture.value = {};
|
||||
editToken = "";
|
||||
editInput.value = "";
|
||||
editCommentState.value = false;
|
||||
};
|
||||
|
||||
// 打开 Emoji
|
||||
const openEditEmoji = (index, i) => {
|
||||
if (isNeedLogin.value) {
|
||||
goLogin()
|
||||
return
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
editEmojiState.value = true
|
||||
}
|
||||
editEmojiState.value = true;
|
||||
};
|
||||
|
||||
const selectEditEmoji = key => {
|
||||
closeEmoji()
|
||||
editInput.value += key
|
||||
}
|
||||
const selectEditEmoji = (key) => {
|
||||
closeEmoji();
|
||||
editInput.value += key;
|
||||
};
|
||||
|
||||
const postEditComment = () => {
|
||||
if (isNeedLogin.value) {
|
||||
goLogin()
|
||||
return
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
|
||||
const image = editPicture.value
|
||||
const image = editPicture.value;
|
||||
$ajax("/api/comment/commentsEditSubmit", {
|
||||
content: editInput.value,
|
||||
token: editToken,
|
||||
image: image ? { aid: image.aid, url: image.url } : null,
|
||||
}).then(res => {
|
||||
}).then((res) => {
|
||||
if (res.code != 200) {
|
||||
ElMessage.error(res.message)
|
||||
return
|
||||
ElMessage.error(res.message);
|
||||
return;
|
||||
}
|
||||
|
||||
commentList.value.forEach(element => {
|
||||
commentList.value.forEach((element) => {
|
||||
if (element.token == editToken) {
|
||||
element["content"] = editInput.value
|
||||
element["image"] = image
|
||||
element["content"] = editInput.value;
|
||||
element["image"] = image;
|
||||
}
|
||||
element.child &&
|
||||
element.child.forEach(ele => {
|
||||
element.child.forEach((ele) => {
|
||||
if (ele.token == editToken) {
|
||||
ele["content"] = editInput.value
|
||||
ele["image"] = image
|
||||
ele["content"] = editInput.value;
|
||||
ele["image"] = image;
|
||||
}
|
||||
})
|
||||
})
|
||||
});
|
||||
});
|
||||
|
||||
editPicture.value = {}
|
||||
editToken = ""
|
||||
editCommentState.value = false
|
||||
editEmojiState.value = false
|
||||
ElMessage.success(res.message)
|
||||
})
|
||||
}
|
||||
editPicture.value = {};
|
||||
editToken = "";
|
||||
editCommentState.value = false;
|
||||
editEmojiState.value = false;
|
||||
ElMessage.success(res.message);
|
||||
});
|
||||
};
|
||||
|
||||
const closeEditFileUpload = () => (editPicture.value = {})
|
||||
const closeEditFileUpload = () => (editPicture.value = {});
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
||||
Reference in New Issue
Block a user