A1300399510/PC-mj
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

no message

Browse Source
This commit is contained in:
A1300399510
2023-12-29 18:37:38 +08:00
parent c80cee6eb0
commit d7915dd321
15 changed files with 852 additions and 180 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
components/Header.vue
View File

@@ -29,14 +29,16 @@
</template>
<script setup>
import { useRoute } from "vue-router"
const router = useRouter()
const route = useRoute()
let keyword = ref("")
onMounted(() => {
getHistoricalSearchList()
// getUser()
keyword.value = route.query["keyword"]
})
let count = ref({})
@@ -112,7 +114,6 @@ const handleClickClear = () => {
let historicalSearchState = ref(false) // 历史记录弹窗状态
let historicalSearchList = ref([]) // 历史记录数据
let MyPopupRef = ref(null)
// 点击我的获取消息
const handleUser = key => {

6
components/Item.vue
View File

@@ -26,6 +26,10 @@
</div>
</div>
<div class="data-list flexacenter">
<div class="data-item flexacenter">
<img class="data-item-icon" src="@/assets/img/eye-icon.svg" />
{{ item["views"] || 0 }}
</div>
<div class="data-item flexacenter" @click.prevent="handleLike(item['uniqid'], item['token'])">
<img class="data-item-icon" v-if="item['islike'] == 0" src="@/assets/img/like-no.svg" />
<img class="data-item-icon" v-else src="@/assets/img/like-yes.png" />
@@ -165,7 +169,7 @@ const handleLike = (uniqid, token) => {
color: #aaaaaa;
font-size: 12px;
.data-item {
margin-left: 15px;
margin-left: 26px;
.data-item-icon {
width: 13px;
margin-right: 5px;

89
components/MyPopup.vue
View File

@@ -6,7 +6,7 @@
<div class="tba-list flexcenter">
<div class="tab-item flexcenter" :class="{ pitch: MyPopupState == 'collect' }" @click="cutMy('collect')">
我的收藏
<div class="value">{{ count["collect"] }}</div>
<div class="value">{{ collectCount || count["collect"] }}</div>
</div>
<div class="tab-item flexcenter" :class="{ pitch: MyPopupState == 'mj' }" @click="cutMy('mj')">
@@ -18,35 +18,35 @@
<Empty></Empty>
</div>
<div class="content" v-else @scroll="handleListScroll">
<div class="item flexflex" v-for="(item, index) in showList" :key="index" @click="goDetails(item['uniqid'])">
<div class="item flexflex" v-for="(item, index) in showList" :key="index" @click="goDetails(item['uniqid'] || item?.data?.uniqid)">
<div class="left flexflex">
<div class="name">{{ item["school"] }}</div>
<div class="name">{{ item["school"] || item["data"]["school"] }}</div>
<div class="info-box flexflex">
<div class="info-item flexacenter" v-if="item['profession']">
<div class="info-item flexacenter" v-if="item['profession'] || item?.['data']?.['profession']">
<div class="info-item-name">专业</div>
<div class="info-item-value">{{ item["profession"] }}</div>
<div class="info-item-value">{{ item["profession"] || item["data"]["profession"] }}</div>
</div>
<div class="info-item flexacenter" v-if="item['project']">
<div class="info-item flexacenter" v-if="item['project'] || item?.data?.project">
<div class="info-item-name">项目</div>
<div class="info-item-value">{{ item["project"] }}</div>
<div class="info-item-value">{{ item["project"] || item?.data?.project }}</div>
</div>
</div>
<div class="text-box flexacenter">
<div class="text-time">1小时前发布</div>
<div class="text-message flex1 ellipsis">{{ item["message"] }}</div>
<div class="text-time" v-if="item?.releasetime">{{ handleDate(item?.releasetime) }}发布</div>
<div class="text-message flex1 ellipsis">{{ item["message"] || item["data"]["message"] }}</div>
</div>
</div>
<div class="operate-area flexacenter">
<img class="delete-icon" v-if="MyPopupState == 'collect'" src="@/assets/img/delete-icon.svg" />
<div class="anonymous-box flexacenter" v-else @click="openAnonymousState(index)">
<img class="delete-icon" v-if="MyPopupState == 'collect'" @click.stop="cancelCollection(item['token'], index)" src="@/assets/img/delete-icon.svg" />
<div class="anonymous-box flexacenter" v-else @click.stop="openAnonymousState(index)">
<div class="text">{{ item["anonymous"] == 1 ? "匿名" : "公开" }}</div>
<img class="arrow-icon" src="@/assets/img/arrow-gray.svg" />
<div class="state-popup flexflex" v-if="item['anonymousState']" @click.stop="">
<div class="state-popup-item flexacenter flex1" :class="{ 'pitch': item['anonymous'] == 0 }" @click="handleAnonymousState(item['token'], index)">
<div class="state-popup-item flexacenter flex1" :class="{ 'pitch': item['anonymous'] == 0 }" @click="handleAnonymousState(item['token'], index, 0)">
<div class>公开发表</div>
<img class="state-popup-icon" src="@/assets/img/tick-green.svg" />
</div>
<div class="state-popup-item flexacenter flex1" :class="{ 'pitch': item['anonymous'] == 1 }" @click="handleAnonymousState(item['token'], index)">
<div class="state-popup-item flexacenter flex1" :class="{ 'pitch': item['anonymous'] == 1 }" @click="handleAnonymousState(item['token'], index, 1)">
<div class>匿名发表</div>
<img class="state-popup-icon" src="@/assets/img/tick-green.svg" />
</div>
@@ -79,13 +79,26 @@ onMounted(() => {
let showList = ref([])
let collectList = []
let collectPage = 1
let collectLoading = false
let collectCount = ref(0)
const getCollect = () => {
MyUserCollectHttp({}).then(res => {
if (res.code != 200) return
let data = res.data
collectList = collectList.concat(data.data)
showList.value = collectList
})
if (collectPage == 0 || collectLoading) return
collectLoading = true
MyUserCollectHttp({ page: collectPage })
.then(res => {
if (res.code != 200) return
let data = res.data
collectList = collectList.concat(data.data)
showList.value = collectList
if (collectList.length < data["count"]) collectPage++
else collectPage = 0
collectCount.value = data["count"]
})
.finally(() => (collectLoading = false))
}
let publishList = []
@@ -130,9 +143,28 @@ const openAnonymousState = index => {
showList.value = [...publishList]
}
// 关闭全部匿名弹窗
const closeAllAnonymousState = () => {
publishList.forEach(element => {
element["anonymousState"] = false
})
showList.value = [...publishList]
}
// 修改匿名状态
const handleAnonymousState = (token, index) => {
const handleAnonymousState = (token, index, anonymous) => {
console.log("token", token, index)
changeAnonymousHttp({ token, anonymous }).then(res => {
console.log("res", res)
if (res.code != 200) return
publishList[index]["anonymous"] = anonymous
showList.value = [...publishList]
closeAllAnonymousState()
ElMessage({
message: res.message,
type: "success",
})
})
}
// 详情页滚动事件
@@ -155,6 +187,23 @@ defineExpose({
})
// const emit = defineEmits(["cutMy"]);
// 处理取消收藏
const cancelCollection = (token, index) => {
MyUserDeleteCollectHttp({ token }).then(res => {
console.log("res", res)
if (res.code != 200) {
ElMessage.error(res.message)
return
}
collectList.splice(index, 1)
collectCount.value--
console.log(collectList, "collectList")
showList.value = [...collectList]
})
}
</script>
<style lang="less" scoped>
.popup-mask {

245
components/Report.vue Normal file
View File

@@ -0,0 +1,245 @@
<template>
<!-- 举报 -->
<div class="alert-form">
<div class="comments reports">
<div class="head">
<span style="display: flex; align-items: center;"> <img style="width: 25px; margin-right: 7px;" src="//app.gter.net/image/gter/offer/img/exclamationpoint.png" />举报投诉 </span>
<div class="close icon-close iconfont" @click="alertShow = false"></div>
</div>
<div class="form">
<div class="radio-area flexacenter">
<div class="radio-area-item flexacenter" :class="{ pitch: checkList.includes(s) }" v-for="(s, i) in reasonList" :key="i" @click="selectRadio(s)">
<div class="radio-area-frame"></div>
{{ s }}
</div>
</div>
<div class="text-box">
<textarea placeholder="请输入举报原因" v-model="alertText" maxlength="200"></textarea>
<div class="text-num">{{ 200 - alertText.length }}</div>
</div>
<div class="footer">
<button type="button" @click="cancel()">取消</button>
<button type="submit" :disabled="checkList.length == 0" @click="alertSubmit">提交</button>
</div>
</div>
</div>
</div>
</template>
<script setup>
import { ElMessage } from "element-plus"
const props = defineProps(["reportToken"])
const reasonList = ["广告", "辱骂", "重复发送", "不良信息", "其他"]
let reportAlertShow = inject("reportAlertShow")
let checkList = ref([])
let alertShow = ref(false)
let alertText = ref("")
const selectRadio = value => {
const index = checkList.value.indexOf(value)
if (index === -1) checkList.value.push(value)
else checkList.value.splice(index, 1)
}
// 举报提交
const alertSubmit = () => {
checkList.value.push(alertText.value)
reportAlertShow.value = false
commentReportHttp({
message: checkList.value,
token: props.reportToken,
}).then(res => {
checkList.value = []
reportAlertShow.value = false
ElMessage({
message: res.message || "举报成功",
type: "success",
})
})
}
// 取消
const cancel = () => (reportAlertShow.value = false)
</script>
<style lang="less" scoped>
.alert-form {
display: block;
position: fixed;
z-index: 2100;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, 0.7);
.reports {
height: 440px;
.radio-area {
margin-bottom: 40px;
.radio-area-item {
color: #606266;
font-size: 14px;
margin-right: 10px;
cursor: pointer;
&.pitch {
.radio-area-frame {
background-color: #50e3c2;
border-color: #50e3c2;
&::after {
-webkit-transform: rotate(45deg) scaleY(1);
transform: rotate(45deg) scaleY(1);
}
}
}
.radio-area-frame {
border: 1px solid #dcdfe6;
border-radius: 2px;
width: 14px;
height: 14px;
-webkit-transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46), background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46), background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
position: relative;
margin-right: 10px;
&::after {
-webkit-box-sizing: content-box;
box-sizing: content-box;
content: "";
border: 1px solid #fff;
border-left: 0;
border-top: 0;
height: 7px;
left: 4px;
position: absolute;
top: 1px;
-webkit-transform: rotate(45deg) scaleY(0);
transform: rotate(45deg) scaleY(0);
width: 3px;
-webkit-transition: -webkit-transform 0.15s ease-in 0.05s;
transition: -webkit-transform 0.15s ease-in 0.05s;
transition: transform 0.15s ease-in 0.05s;
transition: transform 0.15s ease-in 0.05s, -webkit-transform 0.15s ease-in 0.05s;
-webkit-transform-origin: center;
transform-origin: center;
}
// }
}
}
}
}
.el-checkbox-group {
font-size: 0;
}
.comments {
display: block;
position: fixed;
z-index: 11;
left: 50%;
top: 50%;
width: 740px;
height: 440px;
max-width: 90vw;
max-height: 90vh;
transform: translate(-50%, -50%);
background-color: #ffffff;
border: none;
border-radius: 8px 8px 6px 6px;
.text-box {
position: relative;
}
.text-num {
position: absolute;
right: 10px;
bottom: 10px;
color: #999;
font-size: 12px;
}
.form {
display: block;
width: 100%;
padding: 34px 30px 40px;
textarea {
height: 172px;
margin-bottom: 30px;
display: block;
width: 100%;
background: #f7f7f7;
padding: 18px;
font-size: 14px;
border: 1px solid #f7f7f7;
border-radius: 5px;
outline: none;
resize: none;
line-height: 22px;
}
}
}
.head {
padding: 0 18px 0 30px;
display: flex;
height: 56px;
align-items: center;
justify-content: space-between;
background: #333333;
color: #fff;
font-size: 17px;
border-radius: 6px 6px 0 0;
.close {
color: #b3b3b3;
font-size: 14px;
cursor: pointer;
}
}
.footer {
display: flex;
justify-content: center;
align-items: center;
button[type="button"] {
margin-right: 20px;
}
button {
border: 1px #999999 solid;
border-radius: 5px;
background-color: #ffffff;
width: 128px;
height: 38px;
color: #333;
font-size: 14px;
outline: none;
cursor: pointer;
}
button[type="submit"] {
background-color: #50e3c2;
border-color: #50e3c2;
color: #fff;
}
}
}
.alert-form .el-checkbox__input.is-checked .el-checkbox__inner,
.alert-form .el-checkbox__input.is-indeterminate .el-checkbox__inner {
background-color: #50e3c2;
border-color: #50e3c2;
}
.alert-form .el-checkbox__input.is-focus .el-checkbox__inner,
.alert-form .el-checkbox__inner:hover {
border-color: #50e3c2;
}
.alert-form .el-checkbox__input.is-checked + .el-checkbox__label {
color: #50e3c2;
}
</style>