feat:更新

This commit is contained in:
LinZhongyan 2025-11-12 02:21:59 +08:00
parent 0466be39ff
commit 1e924669b2
5 changed files with 117 additions and 244 deletions

View File

@ -6,6 +6,7 @@ export {}
declare global { declare global {
const EffectScope: typeof import('vue')['EffectScope'] const EffectScope: typeof import('vue')['EffectScope']
const ElMessage: typeof import('element-plus/es')['ElMessage'] const ElMessage: typeof import('element-plus/es')['ElMessage']
const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
const acceptHMRUpdate: typeof import('pinia')['acceptHMRUpdate'] const acceptHMRUpdate: typeof import('pinia')['acceptHMRUpdate']
const axios: typeof import('axios')['default'] const axios: typeof import('axios')['default']
const computed: typeof import('vue')['computed'] const computed: typeof import('vue')['computed']

View File

@ -44,9 +44,13 @@ const useFormDataStore = defineStore("formDataStore", {
firstLevelTempId: 1, //一级评论id firstLevelTempId: 1, //一级评论id
secondLevelTempId: 1, //二级评论id secondLevelTempId: 1, //二级评论id
headerType: 1, //1是显示地区 2是显示大家都在搜 headerType: 1, //1是显示地区 2是显示大家都在搜
commentLabel: '条评论', //评论条数单位
everyoneSearch: { everyoneSearch: {
label:'大家都在搜',
title: "邓紫棋神仙现场", title: "邓紫棋神仙现场",
}, },
AuthorTitle:'作者',
replyTitle: '回复',
regionalInfo: { regionalInfo: {
currentArea: "测试地区", currentArea: "测试地区",
viewCount: 300, //多少人看过 viewCount: 300, //多少人看过

View File

@ -35,7 +35,7 @@
v-else v-else
class="mb-3 flex text-[15px] text-[#595b5f] dark:text-[#c8c8c8]" class="mb-3 flex text-[15px] text-[#595b5f] dark:text-[#c8c8c8]"
> >
<div>大家都在搜</div> <div>{{ everyoneSearch.label }}</div>
<div <div
class="dark:text-[#e2c26d] flex-1 flex justify-between text-[#124b94]" class="dark:text-[#e2c26d] flex-1 flex justify-between text-[#124b94]"
@ -52,7 +52,7 @@
</div> </div>
<!-- 评论条数 --> <!-- 评论条数 -->
<div class="total text-center text-[14px] pb-[10px]"> <div class="total text-center text-[14px] pb-[10px]">
{{ total }}条评论 {{ total }}{{ commentLabel }}
</div> </div>
<!-- 评论列表 --> <!-- 评论列表 -->
<div class="comment_list overflow-scroll h-[540px]"> <div class="comment_list overflow-scroll h-[540px]">
@ -78,7 +78,7 @@
v-if="item.isAuthor" v-if="item.isAuthor"
class="bg-[#f62d5a] text-white py-[1px] scale-90 rounded px-[6px] text-[12px]" class="bg-[#f62d5a] text-white py-[1px] scale-90 rounded px-[6px] text-[12px]"
> >
作者 {{ AuthorTitle }}
</div> </div>
</div> </div>
@ -100,7 +100,7 @@
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<div class="flex"> <div class="flex">
<div>{{ item.recoveryTime }}·{{ item.area }}</div> <div>{{ item.recoveryTime }}·{{ item.area }}</div>
<div class="ml-3">回复</div> <div class="ml-3">{{ replyTitle }}</div>
</div> </div>
<div class="flex items-center"> <div class="flex items-center">
<div <div
@ -178,7 +178,7 @@
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<div class="flex"> <div class="flex">
<div>{{ ctem.recoveryTime }}·{{ ctem.area }}</div> <div>{{ ctem.recoveryTime }}·{{ ctem.area }}</div>
<div class="ml-3">回复</div> <div class="ml-3">{{ replyTitle }}</div>
</div> </div>
<div class="flex items-center"> <div class="flex items-center">
<div <div
@ -274,7 +274,7 @@ import temp from "@/assets/svg/temp.svg";
import temp2 from "@/assets/svg/temp2.svg"; import temp2 from "@/assets/svg/temp2.svg";
const { useThemeStore, useFormDataStore } = useStore(); const { useThemeStore, useFormDataStore } = useStore();
const { currentTheme } = storeToRefs(useThemeStore); const { currentTheme } = storeToRefs(useThemeStore);
const { data, total, regionalInfo, everyoneSearch, headerType } = const { data, total, regionalInfo, everyoneSearch,replyTitle,AuthorTitle, headerType , commentLabel } =
storeToRefs(useFormDataStore); storeToRefs(useFormDataStore);
</script> </script>

View File

@ -1,40 +1,25 @@
<template> <template>
<div> <div>
<div> <div>
<div <div v-loading="uploadLoading" element-loading-text="Loading..." element-loading-svg-view-box="-10, -10, 50, 50"
v-loading="uploadLoading"
element-loading-text="Loading..."
element-loading-svg-view-box="-10, -10, 50, 50"
element-loading-background="rgba(122, 122, 122, 0.8)" element-loading-background="rgba(122, 122, 122, 0.8)"
class="w-[500px] operate relative right-show p-2 border-x rounded-md border-solid border-slate-50 shadow-2xl" class="w-[500px] operate relative right-show p-2 border-x rounded-md border-solid border-slate-50 shadow-2xl">
> <div class="w-[480px] relative h-full mx-auto bg-white dark:bg-[#161616] dark:text-white">
<div
class="w-[480px] relative h-full mx-auto bg-white dark:bg-[#161616] dark:text-white"
>
<!-- 顶部占位元素 --> <!-- 顶部占位元素 -->
<div class="h-[160px] bg-black"></div> <div class="h-[160px] bg-black"></div>
<!-- 评论区 --> <!-- 评论区 -->
<div class="comment_area px-5 pt-5"> <div class="comment_area px-5 pt-5">
<div> <div>
<el-radio-group <el-radio-group v-model="headerType" @change="useFormDataStore.changeHeaderType">
v-model="headerType"
@change="useFormDataStore.changeHeaderType"
>
<el-radio :label="1" size="large">地区</el-radio> <el-radio :label="1" size="large">地区</el-radio>
<el-radio :label="2" size="large">大家都在搜</el-radio> <el-radio :label="2" size="large">大家都在搜</el-radio>
</el-radio-group> </el-radio-group>
</div> </div>
<!-- 地址区域 --> <!-- 地址区域 -->
<div <div class="area_box flex items-center mb-5" v-if="headerType === 1">
class="area_box flex items-center mb-5"
v-if="headerType === 1"
>
<div class="flex-1"> <div class="flex-1">
<div class="flex justify-between mb-[10px]"> <div class="flex justify-between mb-[10px]">
<el-input <el-input v-model="regionalInfo.currentArea" placeholder="请输入地区">
v-model="regionalInfo.currentArea"
placeholder="请输入地区"
>
<template #prepend>地区</template> <template #prepend>地区</template>
</el-input> </el-input>
</div> </div>
@ -42,11 +27,7 @@
<div class="text-[#999] text-[12px]"> <div class="text-[#999] text-[12px]">
<el-input v-model="regionalInfo.viewCount"> <el-input v-model="regionalInfo.viewCount">
<template #prepend> <template #prepend>
<el-select <el-select class="w-[80px]" v-model="regionalInfo.viewUnit" placeholder="单位">
class="w-[80px]"
v-model="regionalInfo.viewUnit"
placeholder="单位"
>
<el-option label="无" value="" /> <el-option label="无" value="" />
<el-option label="万" value="万" /> <el-option label="万" value="万" />
<el-option label="亿" value="亿" /> <el-option label="亿" value="亿" />
@ -59,65 +40,58 @@
</div> </div>
<!-- 大家都在搜 --> <!-- 大家都在搜 -->
<div v-else class="mb-2"> <div v-else class="mb-2">
<el-input v-model="everyoneSearch.title"> <el-row>
<template #prepend>大家都在搜</template> <el-col :span="12">
</el-input> <el-input v-model="everyoneSearch.label">
</el-input>
</el-col>
<el-col :span="12">
<el-input v-model="everyoneSearch.title">
</el-input>
</el-col>
</el-row>
</div> </div>
<!-- 评论条数 --> <!-- 评论条数 -->
<div <div class="total text-center mb-2 font-semibold text-[14px] pb-[10px]">
class="total text-center mb-2 font-semibold text-[14px] pb-[10px]" <el-row>
> <el-col :span="12">
<el-input v-model="total" size="small"> <el-input v-model="total" size="small">
<template #append>条评论</template> </el-input>
</el-input> </el-col>
<el-col :span="12">
<el-input v-model="commentLabel" size="small">
</el-input>
</el-col>
</el-row>
</div> </div>
<!-- 评论列表 --> <!-- 评论列表 -->
<div class="comment_list overflow-scroll h-[500px]"> <div class="comment_list overflow-scroll h-[500px]">
<div <div v-for="item in data" :key="item.id" class="comment_list_item flex">
v-for="item in data"
:key="item.id"
class="comment_list_item flex"
>
<div> <div>
<el-upload <el-upload v-model:file-list="item.avatarList" class="avatar-uploader" action accept="image/*"
v-model:file-list="item.avatarList" :http-request="handleUpload" :show-file-list="false" :on-success="handleAvatarSuccess"
class="avatar-uploader" :before-upload="beforeAvatarUpload">
action <el-avatar @click="handleUploadAvatarFlag(item)" :size="40" :src="item.avatar" />
accept="image/*"
:http-request="handleUpload"
:show-file-list="false"
:on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload"
>
<el-avatar
@click="handleUploadAvatarFlag(item)"
:size="40"
:src="item.avatar"
/>
</el-upload> </el-upload>
</div> </div>
<div class="flex-1 ml-3"> <div class="flex-1 ml-3">
<div <div class="text-[14px] flex dark:text-[#626262] text-[#adadad]">
class="text-[14px] flex dark:text-[#626262] text-[#adadad]"
>
<div class="w-[120px] mr-2"> <div class="w-[120px] mr-2">
<el-input type="text" v-model="item.nickname"></el-input> <el-input type="text" v-model="item.nickname"></el-input>
</div> </div>
<el-switch <el-switch v-model="item.isAuthor" style="
v-model="item.isAuthor"
style="
--el-switch-on-color: #13ce66; --el-switch-on-color: #13ce66;
--el-switch-off-color: #ff4949; --el-switch-off-color: #ff4949;
" " inline-prompt active-text="作者" inactive-text="" />
inline-prompt <el-input v-if="item.isAuthor" v-model="AuthorTitle" size="small"></el-input>
active-text="作者"
inactive-text="否"
/>
</div>
<div </div>
class="item_content py-2 text-[15px] break-all tracking-[0.1px]"
> <div class="item_content py-2 text-[15px] break-all tracking-[0.1px]">
<el-input v-model="item.content" autosize type="textarea" /> <el-input v-model="item.content" autosize type="textarea" />
</div> </div>
<div class="dark:text-[#626262] text-[#adadad] text-[14px]"> <div class="dark:text-[#626262] text-[#adadad] text-[14px]">
@ -134,33 +108,22 @@
</el-input> </el-input>
</div> </div>
</div> </div>
<div class="ml-3">回复</div> <div class="ml-3">
<el-input type="text" class="w-[100px]" v-model="replyTitle" size="small"></el-input>
</div>
</div> </div>
<div class="flex items-center"> <div class="flex items-center">
<div <div class="flex items-center mr-5" :class="[item.isLike ? 'text-[#f62d5a]' : '']">
class="flex items-center mr-5" <svg-icon :name="item.isLike ? 'isLike' : 'ding'" :size="item.isLike ? '14px' : '20px'"
:class="[item.isLike ? 'text-[#f62d5a]' : '']"
>
<svg-icon
:name="item.isLike ? 'isLike' : 'ding'"
:size="item.isLike ? '14px' : '20px'"
:class="item.isLike ? 'mr-[5px]' : ''" :class="item.isLike ? 'mr-[5px]' : ''"
@click="useFormDataStore.changeFirstLevelLike(item)" @click="useFormDataStore.changeFirstLevelLike(item)" />
/>
<div class="w-[50px]"> <div class="w-[50px]">
<el-input <el-input size="small" type="text" v-model="item.likeCount">
size="small"
type="text"
v-model="item.likeCount"
>
</el-input> </el-input>
</div> </div>
</div> </div>
<div <div class="flex items-center" :class="[item.isDisLike ? 'text-[#f62d5a]' : '']">
class="flex items-center"
:class="[item.isDisLike ? 'text-[#f62d5a]' : '']"
>
<svg-icon :name="'cai'" size="20px" /> <svg-icon :name="'cai'" size="20px" />
<span> <span>
{{ item.disLikeCount }} {{ item.disLikeCount }}
@ -170,87 +133,39 @@
</div> </div>
</div> </div>
<div class="mt-1"> <div class="mt-1">
<el-button <el-button size="small" @click="useFormDataStore.addSecondLevel(item)">
size="small"
@click="useFormDataStore.addSecondLevel(item)"
>
添加二级模板 添加二级模板
</el-button> </el-button>
</div> </div>
<div class="mt-1 flex"> <div class="mt-1 flex">
<el-upload <el-upload v-model:file-list="item.urlList" class="avatar-uploader" action accept="image/*"
v-model:file-list="item.urlList" :http-request="handleUploadImg" :show-file-list="false" :on-success="handleImgSuccess"
class="avatar-uploader" :before-upload="beforeAvatarUpload">
action <el-button size="small" @click="handleUploadFirstImg(item)">
accept="image/*"
:http-request="handleUploadImg"
:show-file-list="false"
:on-success="handleImgSuccess"
:before-upload="beforeAvatarUpload"
>
<el-button
size="small"
@click="handleUploadFirstImg(item)"
>
添加图片 添加图片
</el-button> </el-button>
</el-upload> </el-upload>
<el-button <el-button v-if="item.firstImgUrl" class="ml-2" @click="item.firstImgUrl = ''" size="small" plain
v-if="item.firstImgUrl" type="danger">移除一级图片</el-button>
class="ml-2"
@click="item.firstImgUrl = ''"
size="small"
plain
type="danger"
>移除一级图片</el-button
>
</div> </div>
<div v-if="item.recoveryList" class="my-2"> <div v-if="item.recoveryList" class="my-2">
<div <div v-for="ctem in item.recoveryList" :key="ctem.id" class="flex my-2">
v-for="ctem in item.recoveryList"
:key="ctem.id"
class="flex my-2"
>
<div> <div>
<el-upload <el-upload v-model:file-list="ctem.avatarList" class="avatar-uploader" action accept="image/*"
v-model:file-list="ctem.avatarList" :http-request="handleUpload" :show-file-list="false" :on-success="handleAvatarSuccess"
class="avatar-uploader" :before-upload="beforeAvatarUpload">
action <el-avatar @click="handleUploadSecondAvatarFlag(item, ctem)" :size="20" :src="ctem.avatar" />
accept="image/*"
:http-request="handleUpload"
:show-file-list="false"
:on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload"
>
<el-avatar
@click="handleUploadSecondAvatarFlag(item, ctem)"
:size="20"
:src="ctem.avatar"
/>
</el-upload> </el-upload>
</div> </div>
<div class="flex-1 ml-3"> <div class="flex-1 ml-3">
<div <div class="flex items-center text-[14px] dark:text-[#626262] text-[#adadad]">
class="flex items-center text-[14px] dark:text-[#626262] text-[#adadad]"
>
<div class="w-[80px]"> <div class="w-[80px]">
<el-input <el-input size="small" type="text" v-model="ctem.respondent"></el-input>
size="small"
type="text"
v-model="ctem.respondent"
></el-input>
</div> </div>
<el-switch <el-switch v-model="ctem.isRespondentAuthor" inline-prompt
v-model="ctem.isRespondentAuthor" @change="changeSecondRespondentAuthor(ctem)" active-text="作者" inactive-text="否" />
inline-prompt <span v-if="ctem.isAuthor"
@change="changeSecondRespondentAuthor(ctem)" class="bg-[#f62d5a] text-white py-[1px] scale-90 rounded px-[6px] ml-[5px] text-[12px]">
active-text="作者"
inactive-text="否"
/>
<span
v-if="ctem.isAuthor"
class="bg-[#f62d5a] text-white py-[1px] scale-90 rounded px-[6px] ml-[5px] text-[12px]"
>
作者 作者
</span> </span>
@ -258,34 +173,19 @@
<CaretRight /> <CaretRight />
</el-icon> </el-icon>
<div class="w-[80px]"> <div class="w-[80px]">
<el-input <el-input size="small" type="text" v-model="ctem.recipient"></el-input>
size="small"
type="text"
v-model="ctem.recipient"
></el-input>
</div> </div>
</div> </div>
<div <div class="item_content py-2 text-[15px] break-all tracking-[0.1px]">
class="item_content py-2 text-[15px] break-all tracking-[0.1px]" <el-input v-model="ctem.content" autosize type="textarea" />
>
<el-input
v-model="ctem.content"
autosize
type="textarea"
/>
</div> </div>
<div <div class="dark:text-[#626262] text-[#adadad] text-[14px]">
class="dark:text-[#626262] text-[#adadad] text-[14px]"
>
<div class="flex justify-between items-center"> <div class="flex justify-between items-center">
<div class="flex items-center"> <div class="flex items-center">
<div class="flex items-center"> <div class="flex items-center">
<div class="w-[80px]"> <div class="w-[80px]">
<el-input <el-input type="text" v-model="ctem.recoveryTime">
type="text"
v-model="ctem.recoveryTime"
>
</el-input> </el-input>
</div> </div>
· ·
@ -294,77 +194,46 @@
</el-input> </el-input>
</div> </div>
</div> </div>
<div class="ml-3">回复</div> <div class="ml-3">
<el-input type="text" v-model="replyTitle">
</el-input>
</div>
</div> </div>
<div class="flex items-center"> <div class="flex items-center">
<div <div class="flex items-center mr-5" :class="[ctem.isLike ? 'text-[#f62d5a]' : '']">
class="flex items-center mr-5" <svg-icon :name="ctem.isLike ? 'isLike' : 'ding'" :size="ctem.isLike ? '14px' : '20px'"
:class="[ctem.isLike ? 'text-[#f62d5a]' : '']" :class="ctem.isLike ? 'mr-[5px]' : ''" @click="
>
<svg-icon
:name="ctem.isLike ? 'isLike' : 'ding'"
:size="ctem.isLike ? '14px' : '20px'"
:class="ctem.isLike ? 'mr-[5px]' : ''"
@click="
useFormDataStore.changeSecondLevelLike(ctem) useFormDataStore.changeSecondLevelLike(ctem)
" " />
/>
<div class="w-[50px]"> <div class="w-[50px]">
<el-input <el-input size="small" type="text" v-model="ctem.likeCount">
size="small"
type="text"
v-model="ctem.likeCount"
>
</el-input> </el-input>
</div> </div>
</div> </div>
<div <div class="flex items-center" :class="[
class="flex items-center" ctem.isDisLike ? 'text-[#f62d5a]' : '',
:class="[ ]">
ctem.isDisLike ? 'text-[#f62d5a]' : '',
]"
>
<svg-icon :name="'cai'" size="20px" /> <svg-icon :name="'cai'" size="20px" />
</div> </div>
</div> </div>
</div> </div>
<div class="mt-1 flex"> <div class="mt-1 flex">
<el-upload <el-upload v-model:file-list="ctem.urlList" class="avatar-uploader" action="/api/upload"
v-model:file-list="ctem.urlList" accept="image/*" :http-request="handleUploadImg" :show-file-list="false"
class="avatar-uploader" :on-success="handleImgSuccess" :before-upload="beforeAvatarUpload">
action="/api/upload" <el-button size="small" @click="handleUploadSecondImg(item, ctem)">
accept="image/*"
:http-request="handleUploadImg"
:show-file-list="false"
:on-success="handleImgSuccess"
:before-upload="beforeAvatarUpload"
>
<el-button
size="small"
@click="handleUploadSecondImg(item, ctem)"
>
添加二级图片 添加二级图片
</el-button> </el-button>
</el-upload> </el-upload>
<el-button <el-button v-if="ctem.secondImgUrl" class="ml-1" plain size="small" type="danger"
v-if="ctem.secondImgUrl" @click="ctem.secondImgUrl = ''">移除二级图片</el-button>
class="ml-1"
plain
size="small"
type="danger"
@click="ctem.secondImgUrl = ''"
>移除二级图片</el-button
>
</div> </div>
</div> </div>
</div> </div>
<div> <div>
<el-icon <el-icon color="red" @click="
color="red" useFormDataStore.removeSecondLevel(item, ctem)
@click=" ">
useFormDataStore.removeSecondLevel(item, ctem)
"
>
<Remove /> <Remove />
</el-icon> </el-icon>
</div> </div>
@ -378,9 +247,7 @@
</div> </div>
</div> </div>
<div class="text-center py-3"> <div class="text-center py-3">
<el-button @click="useFormDataStore.addFirstLevelTemp" <el-button @click="useFormDataStore.addFirstLevelTemp">添加一级评论模板</el-button>
>添加一级评论模板</el-button
>
</div> </div>
</div> </div>
</div> </div>
@ -398,7 +265,7 @@ import router from "@/router";
const { useThemeStore, useFormDataStore, useUserStore } = useStore(); const { useThemeStore, useFormDataStore, useUserStore } = useStore();
const { currentTheme } = storeToRefs(useThemeStore); const { currentTheme } = storeToRefs(useThemeStore);
const { data, total, regionalInfo, everyoneSearch, headerType } = const { data, total, regionalInfo, everyoneSearch, headerType, replyTitle, commentLabel, AuthorTitle } =
storeToRefs(useFormDataStore); storeToRefs(useFormDataStore);
let imageUrl = ref(""); let imageUrl = ref("");
@ -429,7 +296,7 @@ function handleAvatarSuccess(response, uploadFile) {
ElMessage({ message: "登录失效,请重新登录", type: "warning" }); ElMessage({ message: "登录失效,请重新登录", type: "warning" });
try { try {
useUserStore.$patch({ token: "", isLogin: false }); useUserStore.$patch({ token: "", isLogin: false });
} catch (e) {} } catch (e) { }
router.push("/login"); router.push("/login");
return; return;
} }
@ -586,9 +453,9 @@ async function beforeAvatarUpload(file) {
} }
</style> </style>
function handleUploadAuthInvalid() { function handleUploadAuthInvalid() {
ElMessage({ message: "登录失效,请重新登录", type: "warning" }); ElMessage({ message: "登录失效,请重新登录", type: "warning" });
try { try {
useUserStore.$patch({ token: "", isLogin: false }); useUserStore.$patch({ token: "", isLogin: false });
} catch (e) {} } catch (e) {}
router.push("/login"); router.push("/login");
} }

View File

@ -121,7 +121,8 @@ export default defineConfig({
proxy: { proxy: {
"/api": { "/api": {
// target: 'http://192.168.1.3:8090', // target: 'http://192.168.1.3:8090',
target: "http://192.168.1.168:18080", // target: "http://192.168.1.168:18080",
target: 'http://47.95.203.241:8082',
// target: "http://47.95.203.241:18080/", // target: "http://47.95.203.241:18080/",
changeOrigin: true, changeOrigin: true,
// 确保服务端设置的 Cookie 域名被重写为当前开发域localhost避免浏览器丢弃 Cookie // 确保服务端设置的 Cookie 域名被重写为当前开发域localhost避免浏览器丢弃 Cookie