Compare commits
10 Commits
9e678d108c
...
d82c425491
Author | SHA1 | Date | |
---|---|---|---|
|
d82c425491 | ||
|
5a6d83cc06 | ||
|
e5df02f241 | ||
|
3000ff590b | ||
|
6466a55896 | ||
|
03d27d5c41 | ||
|
3cfb24ba8c | ||
|
cbdda8699f | ||
|
838988d55e | ||
|
1d244c56e5 |
@ -14,6 +14,7 @@
|
||||
"svg-sprite-loader": "^6.0.11",
|
||||
"vue": "^2.6.14",
|
||||
"vue-router": "^3.5.1",
|
||||
"vue-sanitize": "^0.2.3",
|
||||
"vuex": "^3.6.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
Before Width: | Height: | Size: 17 KiB |
Before Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 17 KiB |
Before Width: | Height: | Size: 20 KiB |
Before Width: | Height: | Size: 52 KiB |
Before Width: | Height: | Size: 22 KiB |
BIN
public/img/unlock.png
Normal file
After Width: | Height: | Size: 21 KiB |
11
src/App.vue
@ -15,9 +15,14 @@ export default {
|
||||
loading: null,
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.$store.dispatch('fetchHistoricalSearch')
|
||||
this.$store.dispatch('getAllForum', this)
|
||||
this.$store.dispatch('fetchHistoricalSearch') // 获取历史搜索记录
|
||||
this.$store.dispatch('getAllForum', this) // 获取全部板块
|
||||
// this.$store.dispatch('getUserInfo', this) /// 获取用户信息
|
||||
},
|
||||
|
||||
}
|
||||
@ -35,7 +40,7 @@ export default {
|
||||
flex-direction: column;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
// overflow: hidden;
|
||||
}
|
||||
|
||||
a {
|
||||
|
@ -231,6 +231,29 @@ section {
|
||||
|
||||
}
|
||||
|
||||
.paging {
|
||||
margin-top: .48rem;
|
||||
|
||||
::v-deep {
|
||||
.el-pagination.is-background .el-pager li:not(.disabled).active {
|
||||
background: rgba(98, 177, 255, 1);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.el-pagination .btn-next .el-icon,
|
||||
.el-pagination .btn-prev .el-icon {
|
||||
font-size: .4rem;
|
||||
}
|
||||
|
||||
.el-pagination.is-background.el-pagination--small .btn-next,
|
||||
.el-pagination.is-background.el-pagination--small .btn-prev,
|
||||
.el-pagination.is-background.el-pagination--small .el-pager li {
|
||||
border-radius: 50%;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.result-empty-box {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
|
BIN
src/assets/img/detail/edit.png
Normal file
After Width: | Height: | Size: 1.2 KiB |
@ -12,11 +12,12 @@
|
||||
<div class="discussion-single-box flexflex flex1">
|
||||
<div class="discussion-single-content flexacenter flex1">
|
||||
<input class="discussion-single-input flex1" cursor-spacing="5" type="text"
|
||||
:placeholder="twoCommentData ? '写回复…' : '想问啥,大胆问…'" v-model="commentContent" />
|
||||
:placeholder="twoCommentData ? '写回复…' : '想问啥,大胆问…'" :value="commentContent"
|
||||
@input="inputCommentContent($event)" />
|
||||
<img class="discussion-single-input-icom" @click.stop="setValue()"
|
||||
src="@/assets/img/detail/unfold.png" />
|
||||
</div>
|
||||
<div class="discussion-single-btn flexcenter" @click.stop="postComment(commentContent)">
|
||||
<div class="discussion-single-btn flexcenter" @click.stop="postComment()">
|
||||
发布
|
||||
</div>
|
||||
</div>
|
||||
@ -32,14 +33,14 @@
|
||||
<div class="discussion-text one-line">{{ twoCommentData.content }}</div>
|
||||
</div>
|
||||
<div class="discussion-multi-content flexflex flex1">
|
||||
<textarea class="discussion-multi-textarea flex1" type="text" maxlength="500" v-model="commentContent"
|
||||
:placeholder="twoCommentData ? '写回复…' : '想问啥,大胆问…'"></textarea>
|
||||
<textarea class="discussion-multi-textarea flex1" type="text" maxlength="500" :value="commentContent"
|
||||
:placeholder="twoCommentData ? '写回复…' : '想问啥,大胆问…'" @input="inputCommentContent($event)"></textarea>
|
||||
<img class="discussion-multi-icom" @click.stop="openDiscussionSingle()"
|
||||
src="@/assets/img/detail/pack.png" />
|
||||
<div class="discussion-multi-sum">{{ 500 - commentContent.length }}</div>
|
||||
</div>
|
||||
<div class="discussion-multi-bottom flexflex flexacenter">
|
||||
<div class="discussion-multi-btn flexcenter" @click.stop="postComment(commentContent)">
|
||||
<div class="discussion-multi-btn flexcenter" @click.stop="postComment()">
|
||||
发布
|
||||
</div>
|
||||
</div>
|
||||
@ -53,30 +54,26 @@ export default {
|
||||
name: 'DetailReply',
|
||||
data() {
|
||||
return {
|
||||
commentContent: "",
|
||||
openDiscussionSingleState: true, // 弹出键盘动画
|
||||
};
|
||||
},
|
||||
props: ["twoCommentData", "popState"],
|
||||
props: ["twoCommentData", "popState", "commentContent"],
|
||||
|
||||
mounted() {
|
||||
|
||||
console.log("子组件");
|
||||
// console.log("子组件");
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
// 提交回复
|
||||
postComment(commentContent) {
|
||||
this.$parent.postComment(commentContent)
|
||||
postComment() {
|
||||
this.$parent.postComment()
|
||||
},
|
||||
|
||||
// 关闭弹窗
|
||||
handlePopCancel() {
|
||||
console.log(this.$parent.popState, "this.$parent.popState");
|
||||
this.$parent.twoCommentData = null
|
||||
this.$parent.popState = ""
|
||||
|
||||
},
|
||||
|
||||
// 清空
|
||||
@ -98,6 +95,11 @@ export default {
|
||||
}, 500);
|
||||
},
|
||||
|
||||
inputCommentContent(event) {
|
||||
let value = event.currentTarget.value
|
||||
this.$parent.commentContent = value
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
};
|
||||
|
@ -76,36 +76,48 @@ export default {
|
||||
tab: "Offer榜",
|
||||
headMorePopState: false, // 弹窗的状态
|
||||
islogin: false,
|
||||
userInfo: {},
|
||||
userInfo: {}, // 注意 userInfo 写I 是否是大写 ,, 因为 user 已经改为全局,后面要删除传值的 user
|
||||
menu: [],
|
||||
hotSearchkeywords: [], // 热门搜索
|
||||
};
|
||||
},
|
||||
props: ["issearch", "needgetuser", "userinfo"],
|
||||
watch: {
|
||||
needgetuser: {
|
||||
handler(newValue, oldValue) {
|
||||
if (newValue) this.getUserInfoData();
|
||||
},
|
||||
immediate: true,
|
||||
},
|
||||
// needgetuser: {
|
||||
// handler(newValue, oldValue) {
|
||||
// // if (newValue) this.getUserInfoData();
|
||||
// },
|
||||
// immediate: true,
|
||||
// },
|
||||
|
||||
// userinfo(newValue, oldValue) {
|
||||
// this.userInfo = newValue;
|
||||
// this.islogin = newValue.uid > 0 ? true : false;
|
||||
// },
|
||||
|
||||
userinfo(newValue, oldValue) {
|
||||
this.userInfo = newValue;
|
||||
this.islogin = newValue.uid > 0 ? true : false;
|
||||
},
|
||||
headMorePopState(newValue, oldValue) {
|
||||
if (newValue) this.$pageStop();
|
||||
else this.$pageMove();
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.getMenu()
|
||||
let user = this.$store.state.user
|
||||
if (JSON.stringify(user) === "{}") this.$store.dispatch('getUserInfo', this)
|
||||
else {
|
||||
this.userInfo = user
|
||||
this.islogin = user.uid > 0 ? true : false;
|
||||
this.hotSearchkeywords = this.$store.state.hotSearchkeywords
|
||||
}
|
||||
|
||||
// this.getMenu()
|
||||
|
||||
|
||||
},
|
||||
|
||||
components: {
|
||||
SearchBox,
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 处理登录
|
||||
handleRegister() {
|
||||
@ -115,17 +127,17 @@ export default {
|
||||
|
||||
// 获取用户信息
|
||||
getUserInfoData() {
|
||||
return
|
||||
// this.$http.post("/widget/getUser").then((res) => {
|
||||
this.$http.post("/api/index",).then((res) => {
|
||||
if (res.code != 200) return;
|
||||
// this.prototype.userInfo = res.data.user
|
||||
this.userInfo = res.data.user;
|
||||
this.islogin = res.data.user.uid > 0 ? true : false;
|
||||
this.hotSearchkeywords = res.data.hotSearchkeywords
|
||||
|
||||
}).catch(err => {
|
||||
this.$message.error(err.message)
|
||||
});
|
||||
this.$message.error(err.message)
|
||||
});
|
||||
},
|
||||
|
||||
getMenu() {
|
||||
|
@ -53,7 +53,6 @@ export default {
|
||||
mounted() {
|
||||
if (this.searchText.length > 0) this.showClear = true
|
||||
else this.showClear = false
|
||||
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
@ -6,6 +6,8 @@ import ElementUI, { Message, Pagination, loading } from 'element-ui';
|
||||
import 'element-ui/lib/theme-chalk/index.css';
|
||||
import { skipUrl, pageStop, pageMove, goTologin, copy, startupUnderLoading, closeUnderLoading, formattedDate, updateURLSearchParams } from "@/utils/common.js"
|
||||
import http from "@/utils/request"
|
||||
import VueSanitize from 'vue-sanitize'
|
||||
|
||||
import hintBox from '@/components/Hintbox'
|
||||
|
||||
Vue.config.productionTip = false
|
||||
@ -45,6 +47,7 @@ if (!Array.isArray) {
|
||||
Vue.use(ElementUI);
|
||||
Vue.use(Pagination);
|
||||
|
||||
Vue.use(VueSanitize);
|
||||
|
||||
|
||||
new Vue({
|
||||
|
@ -6,8 +6,14 @@ Vue.use(Vuex)
|
||||
export default new Vuex.Store({
|
||||
state: {
|
||||
historicalSearch: [],
|
||||
allForumList: [{}], // 全部板块数据
|
||||
|
||||
allForumList: [], // 全部板块数据
|
||||
homeRequestState: false, // 首页推荐和收藏接口的数据请求状态 这个是是否需要发送请求,因为用户点击收藏后需要重新获取
|
||||
getUserInfoState: false, // 这个是是否在请求状态
|
||||
favoriteList: [],
|
||||
recommendList: [],
|
||||
user: {}, // 用户信息
|
||||
hotSearchkeywords: [], // 热门搜索
|
||||
loading: null,
|
||||
},
|
||||
getters: {
|
||||
},
|
||||
@ -26,6 +32,30 @@ export default new Vuex.Store({
|
||||
state.allForumList = payload
|
||||
},
|
||||
|
||||
setHomeRequestState(state, payload) {
|
||||
state.homeRequestState = payload
|
||||
},
|
||||
|
||||
setFavoriteList(state, payload) {
|
||||
state.favoriteList = payload
|
||||
},
|
||||
|
||||
setRecommendList(state, payload) {
|
||||
state.recommendList = payload
|
||||
},
|
||||
|
||||
setUser(state, payload) {
|
||||
state.user = payload
|
||||
},
|
||||
|
||||
setHotSearchkeywords(state, payload) {
|
||||
state.hotSearchkeywords = payload
|
||||
},
|
||||
|
||||
setgetUserInfoState(state, payload) {
|
||||
state.getUserInfoState = payload
|
||||
},
|
||||
|
||||
},
|
||||
|
||||
actions: {
|
||||
@ -37,6 +67,7 @@ export default new Vuex.Store({
|
||||
|
||||
// 获取全部板块的数据
|
||||
getAllForum({ commit }, that) {
|
||||
// getAllForum(commit, that) {
|
||||
that.$startupUnderLoading(that)
|
||||
that.$http.get("/api/home/allForum").then(res => {
|
||||
if (res.code != 200) return;
|
||||
@ -48,9 +79,38 @@ export default new Vuex.Store({
|
||||
}).finally(() => {
|
||||
that.$closeUnderLoading(that)
|
||||
})
|
||||
// allForumList
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
// 获取用户信息 获取收藏信息那些数据
|
||||
getUserInfo({ state, commit }, that) {
|
||||
if (state.getUserInfoState) return
|
||||
commit('setgetUserInfoState', true)
|
||||
// that.$startupUnderLoading(that)
|
||||
that.$http.post("/api/home").then(res => {
|
||||
if (res.code != 200) return;
|
||||
let data = res.data
|
||||
let { config, favorite, hotSearchkeywords, recommend, user } = data
|
||||
|
||||
commit('setHomeRequestState', true)
|
||||
commit('setUser', user)
|
||||
commit('setFavoriteList', favorite)
|
||||
commit('setRecommendList', recommend)
|
||||
commit('setHotSearchkeywords', hotSearchkeywords)
|
||||
|
||||
if (that.userInfo) { // 这个是顶部用户数据的 这样不用监听是否请求成功
|
||||
that.userInfo = user
|
||||
that.islogin = user.uid > 0 ? true : false;
|
||||
that.hotSearchkeywords = hotSearchkeywords
|
||||
}
|
||||
|
||||
}).catch(err => {
|
||||
that.$message.error(err.message)
|
||||
}).finally(() => {
|
||||
// that.$closeUnderLoading(that)
|
||||
commit('setgetUserInfoState', false)
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
},
|
||||
|
@ -48,6 +48,8 @@ function copy(value, message) {
|
||||
|
||||
// 启动加载中
|
||||
function startupUnderLoading(that) {
|
||||
|
||||
// this.
|
||||
that.loading = that.$loading({
|
||||
lock: true,
|
||||
text: '加载中...',
|
||||
@ -57,7 +59,7 @@ function startupUnderLoading(that) {
|
||||
|
||||
// 关闭加载中
|
||||
function closeUnderLoading(that) {
|
||||
that.loading.close();
|
||||
that.loading && that.loading.close();
|
||||
that.loading = null
|
||||
}
|
||||
|
||||
|
@ -19,7 +19,7 @@ baseURL = {
|
||||
|
||||
const service = axios.create({
|
||||
baseURL: baseURL.forum,
|
||||
timeout: 5000
|
||||
timeout: 15000
|
||||
})
|
||||
|
||||
// 2.请求拦截器
|
||||
|
@ -3,7 +3,7 @@
|
||||
<header-nav :issearch="true" :needgetuser="true">
|
||||
<template slot="header-title">帖子详情</template>
|
||||
</header-nav>
|
||||
<router-view></router-view>
|
||||
<router-view :key="key" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -15,15 +15,20 @@ export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
|
||||
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
key() {
|
||||
return this.$route.path + Math.random()
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
|
||||
},
|
||||
components: {
|
||||
HeaderNav,
|
||||
|
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<div class="detail-head flexacenter">
|
||||
<div class="detail-section">版块:<span class="section-name">香港澳门台湾留学申请</span></div>
|
||||
<div class="detail-section" @click="toAllSection()">版块:<span class="section-name">{{ info.forum }}</span></div>
|
||||
<div class="detail-data flexacenter">
|
||||
<div class="detail-data-item flexacenter">
|
||||
<img class="detail-data-eye" src="@/assets/img/detail/eye.png">{{ info.views }}
|
||||
@ -18,6 +18,7 @@
|
||||
{{ info.subject }}
|
||||
</div>
|
||||
|
||||
|
||||
<!-- -->
|
||||
<div class="card flexcenter">
|
||||
<div class="card-item shadow" v-if="postList.page == 1">
|
||||
@ -99,7 +100,7 @@
|
||||
|
||||
<template v-else-if="type == 3">
|
||||
<div class="offer-content">
|
||||
<div class="offer-content-box" v-if="tenementInfoState">
|
||||
<div class="offer-content-box">
|
||||
<template v-for="(item, index) in tenementKey">
|
||||
<div class="offer-content-item flexacenter" :key="index" v-if="info[item.key]">
|
||||
<div class="offer-content-key" v-if="info[item.key]">{{ item.name }}</div>
|
||||
@ -112,15 +113,20 @@
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div v-html="info.message" class="vHtmlMessage" style="">
|
||||
<div v-html="info.message" class="vHtmlMessage" style="margin: .52rem 0;">
|
||||
</div>
|
||||
|
||||
<img class="tenement-img" v-for="(item, index) in info.images" :key="index" :src="item">
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<div class="offer-content">
|
||||
<div v-html="info.message" style="line-height: normal;" class="vHtmlMessage">
|
||||
</div>
|
||||
<!-- <div v-html="info.message" style="line-height: normal;" class="vHtmlMessage"></div> -->
|
||||
<!-- <div style="line-height: normal;" ref="vHtmlMessage" class="vHtmlMessage">{{ info.message }}</div> -->
|
||||
<div style="line-height: normal;" ref="vHtmlMessage" class="vHtmlMessage"></div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
@ -131,9 +137,7 @@
|
||||
<img class="card-head-icon" :src="item.avatar" />
|
||||
<div class="card-head-content flex1 flexflex">
|
||||
<div class="card-head-name flexflex">{{ item.author }}
|
||||
<!-- <div class="landlord flexcenter" v-if="index == 0">
|
||||
楼主
|
||||
</div> -->
|
||||
<div class="landlord flexcenter" v-if="item.isauthor == 1">楼主</div>
|
||||
</div>
|
||||
<div class="card-head-time">{{ $formattedDate(item.dateline) }}</div>
|
||||
</div>
|
||||
@ -142,10 +146,13 @@
|
||||
index + 2}楼` }}</div>
|
||||
<div class="card-head-fool" v-else>{{ `${(postList.page - 1) * postList.limit + index + 1}楼` }}
|
||||
</div>
|
||||
<div class="edit-box flexcenter" v-if="item.ismyself == 1" @click.stop="handleIsmyself(item)">
|
||||
<img class="edit-icom" src="@/assets/img/detail/edit.png" />
|
||||
</div>
|
||||
<!-- <div class="card-head-fool">{{ index == 0 ? '楼主' : `${index}楼` }}</div> -->
|
||||
</div>
|
||||
|
||||
<div class="card-content flex1" v-html="item.message"></div>
|
||||
<div class="card-content flex1" @click.stop="handleReplyPop(item)" v-html="item.message"></div>
|
||||
|
||||
|
||||
<template v-if="false">
|
||||
@ -282,12 +289,7 @@
|
||||
|
||||
<div class="bottom-item flex1 flexacenter">
|
||||
<div class="bottom-operation-box flex1 flexacenter">
|
||||
<div class="bottom-operation-item flex1 flexcolumn flexcenter" @click="tapOperate('like')">
|
||||
<!-- <div class="praise_bubble" id="praise_bubble" @click.stop=""
|
||||
:style="{ height: prepareLiskeState ? '' : '.5333rem' }">
|
||||
<div class="bubble" v-for="(item, index) in listlist" :key="index"></div>
|
||||
</div> -->
|
||||
|
||||
<div class="bottom-operation-item flex1 flexcolumn flexcenter" @click="info.islike == 0 ? tapOperate('like') : ''">
|
||||
<div class="loginBtn" v-if="!islogin" @click.stop="setValue('isloginBtnState', true, 'boolean')">
|
||||
</div>
|
||||
<img v-if="info.islike == 0" class="bottom-operation-icom"
|
||||
@ -296,7 +298,7 @@
|
||||
<img v-else class="bottom-operation-icom"
|
||||
:class="{ 'prepareLiskeAnimateState': prepareLiskeAnimateState }"
|
||||
src="@/assets/img/icon/like-o.png" />
|
||||
<div class="bottom-operation-text">{{ stat.like == 0 ? '' : stat.like }}赞</div>
|
||||
<div class="bottom-operation-text">{{ info.recommend_add == 0 ? '' : info.recommend_add }}赞</div>
|
||||
</div>
|
||||
<div class="bottom-operation-item flex1 flexcolumn flexcenter"
|
||||
@click="tapOperate(info.isfav == 0 ? 'collect' : 'uncollect')">
|
||||
@ -315,7 +317,8 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<detail-reply :two-comment-data="twoCommentData" :pop-state="popState"></detail-reply>
|
||||
<detail-reply :two-comment-data="twoCommentData" :comment-content="commentContent"
|
||||
:pop-state="popState"></detail-reply>
|
||||
|
||||
<coins :coin-config="coinConfig" :pop-state="popState"></coins>
|
||||
</div>
|
||||
@ -324,6 +327,7 @@
|
||||
<script>
|
||||
import DetailReply from '@/components/DetailReply'
|
||||
import Coins from '@/components/unlock/Coins'
|
||||
|
||||
export default {
|
||||
name: 'detailIndex',
|
||||
data() {
|
||||
@ -332,7 +336,7 @@ export default {
|
||||
// avatar: "https://oss.gter.net/avatar/97KwEWANd_4DHWiY6VbnSUFSCKroYWFjYQ~~/middle",
|
||||
// content: "评论回复",
|
||||
// },
|
||||
popState: "",
|
||||
popState: "", // discussionSingle discussionMulti
|
||||
coinConfig: {
|
||||
strategy: {
|
||||
button: "攒币指南",
|
||||
@ -456,12 +460,18 @@ export default {
|
||||
|
||||
loading: null, // 加载中
|
||||
|
||||
commentContent: "", // 评论的文本
|
||||
operateState: false, // 操作请求的状态
|
||||
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.tid = this.$route.query['tid']
|
||||
this.postList.page = this.$route.query['page'] || 1
|
||||
|
||||
this.getDetail()
|
||||
|
||||
window.scrollTo(0, 0);
|
||||
},
|
||||
|
||||
methods: {
|
||||
@ -474,14 +484,42 @@ export default {
|
||||
if (res.code != 200) return
|
||||
|
||||
let data = res.data
|
||||
|
||||
let info = data.info
|
||||
|
||||
const reg = new RegExp("\r\n", "g")
|
||||
info['message'] = info['message'].replaceAll(reg, '<br/>')
|
||||
info['message'] = info['message'].replace(/<img[^>]*>/g, (match) => {
|
||||
return match.replace(/width="[^"]*"/g, '').replace(/height="[^"]*"/g, '');
|
||||
});
|
||||
})
|
||||
|
||||
info["messageList"] = []
|
||||
|
||||
info['message'] = info['message'].replaceAll("[hide]作者设置了回复可见[/hide]", `<div class="flexcenter content-unlock content-unlock-no replyVisible" @click="aa()"><img class="unlock-icom" src="./img/unlock.png"/>作者设置了回复可见</div>`)
|
||||
|
||||
// if (info.message.indexOf("[hide]作者设置了回复可见[/hide]")) {
|
||||
// `<div class="flexcenter content-unlock content-unlock-no"><img class="unlock-icom" src="@/assets/img/detail/unlock.png">作者设置了回复可见</div>`
|
||||
// }
|
||||
|
||||
// console.log(info['message']);
|
||||
|
||||
// info['message'] = this.$sanitize(info['message'])
|
||||
// console.log(info['message']);
|
||||
|
||||
data.type == 0 ? this.$refs['vHtmlMessage'] ? this.$refs.vHtmlMessage.innerHTML = info['message'] : "" : ""
|
||||
|
||||
let replyVisibleList = document.getElementsByClassName("replyVisible")
|
||||
if (!Array.isArray(replyVisibleList)) {
|
||||
for (let i = 0; i < replyVisibleList.length; i++) {
|
||||
replyVisibleList[i].addEventListener('click', () => {
|
||||
this.$emit("replyVisibleClick")
|
||||
})
|
||||
}
|
||||
this.$on('replyVisibleClick', () => {
|
||||
this.popState = "discussionSingle"
|
||||
})
|
||||
}
|
||||
|
||||
// console.log(info, "offerinfo", data.type);
|
||||
|
||||
this.info = info
|
||||
this.type = data.type
|
||||
@ -491,7 +529,8 @@ export default {
|
||||
else if (this.type == 5) this.getsummaryDetails()
|
||||
else if (this.type == 3) this.getTenementDetails()
|
||||
else if (this.type == 2) this.getInterviewDetails()
|
||||
this.getPostList()
|
||||
|
||||
info['ispost'] != 0 ? this.getPostList() : ''
|
||||
|
||||
}).finally(() => {
|
||||
this.$closeUnderLoading(this)
|
||||
@ -506,7 +545,6 @@ export default {
|
||||
let data = res.data
|
||||
// let offerinfo = data.offerinfo
|
||||
let offerinfo = data.collegelist[0]
|
||||
console.log("offerinfo", offerinfo);
|
||||
let useperformanceStr = ""
|
||||
offerinfo.useperformance && offerinfo.useperformance.forEach((el, index) => {
|
||||
useperformanceStr += el + (offerinfo.useperformance.length - 1 == index ? '' : '、')
|
||||
@ -516,7 +554,6 @@ export default {
|
||||
// offerinfo['schoolname'] = offerinfo.school.name
|
||||
|
||||
this.offerinfo = offerinfo
|
||||
// this.shareurl = data.shareurl
|
||||
})
|
||||
},
|
||||
|
||||
@ -538,17 +575,15 @@ export default {
|
||||
|
||||
|
||||
this.info = { ...this.info, ...data.info }
|
||||
console.log(this.info);
|
||||
this.collegelist = collegelist
|
||||
this.shareurl = data.shareurl
|
||||
})
|
||||
},
|
||||
|
||||
// 获取租房详情 https://app.gter.net/tenement/forum/show
|
||||
|
||||
// 租房
|
||||
getTenementDetails() {
|
||||
console.log("ggjlgjkgj");
|
||||
this.$http.post("/tenement/forum/show", {
|
||||
// tid: 2540476
|
||||
token: this.token
|
||||
}, "tenement").then(res => {
|
||||
|
||||
@ -576,7 +611,6 @@ export default {
|
||||
const reg = new RegExp("\r\n", "g")
|
||||
info['message'] = info['message'].replaceAll(reg, '<br/>')
|
||||
info['message'] = info['message'].replace(/<img[^>]*>/g, (match) => {
|
||||
console.log("match", match);
|
||||
return match.replace(/width="[^"]*"/g, '').replace(/height="[^"]*"/g, '');
|
||||
});
|
||||
|
||||
@ -587,16 +621,16 @@ export default {
|
||||
|
||||
// 获取面经详情
|
||||
getInterviewDetails() {
|
||||
// https://app.gter.net/InterviewExperience/thread
|
||||
|
||||
this.$http.post("/InterviewExperience/thread", {
|
||||
// token: this.token,
|
||||
// tid: this.tid
|
||||
tid: 2322145,
|
||||
uniqid: "--G1tS2SCTOQyoOMiedlLKxTnFvHWjBwQezsJjvVJFwgqOtOFeYr4_LAAG5RV37ETvMl2Zd4tSCc-_dqeKpERxXsx-tPfXrUs0kUysTGLzgxYzU~",
|
||||
token: "5e3c42209eebfbab66e6f0d6c70a53c7",
|
||||
// tid: 2322145,
|
||||
// uniqid: "--G1tS2SCTOQyoOMiedlLKxTnFvHWjBwQezsJjvVJFwgqOtOFeYr4_LAAG5RV37ETvMl2Zd4tSCc-_dqeKpERxXsx-tPfXrUs0kUysTGLzgxYzU~",
|
||||
// token: "5e3c42209eebfbab66e6f0d6c70a53c7",
|
||||
token: this.token
|
||||
}, "tenement").then(res => {
|
||||
console.log(res);
|
||||
// console.log(res);
|
||||
if (res.code != 200) return
|
||||
let data = res.data
|
||||
this.info = { ...this.info, ...data }
|
||||
@ -623,24 +657,60 @@ export default {
|
||||
|
||||
},
|
||||
|
||||
// 处理回复点击弹出弹窗
|
||||
handleReplyPop(item) {
|
||||
// console.log(item);
|
||||
this.popState = "discussionSingle"
|
||||
},
|
||||
|
||||
// 集中处理回复帖子
|
||||
postComment(message) {
|
||||
this.$http.post("/api/operation/reply", {
|
||||
token: this.token,
|
||||
message
|
||||
message: this.commentContent
|
||||
}).then(res => {
|
||||
console.log(res);
|
||||
if (res.code != 200) return
|
||||
// let data = res.data
|
||||
// console.log(data);
|
||||
this.popState = ""
|
||||
let { count, limit } = this.postList
|
||||
|
||||
|
||||
let page = Math.ceil((count + 1) / limit)
|
||||
console.log(page, this.postList.page);
|
||||
if (page == this.postList.page) {
|
||||
this.$router.go(0)
|
||||
return
|
||||
}
|
||||
|
||||
let query = {
|
||||
page,
|
||||
tid: this.tid
|
||||
}
|
||||
|
||||
this.$router.push({ path: `/detailIndex`, query })
|
||||
|
||||
})
|
||||
},
|
||||
|
||||
// 点击改变页数
|
||||
currentChange() {
|
||||
this.getPostList()
|
||||
|
||||
// this.getPostList()
|
||||
|
||||
let query = {
|
||||
page: this.postList.page,
|
||||
tid: this.tid
|
||||
}
|
||||
|
||||
this.$router.push({ path: `/detailIndex`, query })
|
||||
},
|
||||
|
||||
// 点击点赞和收藏操作
|
||||
tapOperate(key) {
|
||||
// like collect uncollect
|
||||
if (this.operateState) return
|
||||
this.operateState = true
|
||||
|
||||
let url = ""
|
||||
if (key == "like") url = "/api/operation/threadLike"
|
||||
@ -650,11 +720,13 @@ export default {
|
||||
this.$http.post(url, { tid: this.tid }).then(res => {
|
||||
console.log(res);
|
||||
if (res.code != 200) return
|
||||
if (key == "like") this.info.like = 1
|
||||
if (key == "like") this.info.islike = 1
|
||||
if (key == "collect") this.info.isfav = 1
|
||||
if (key == "uncollect") this.info.isfav = 0
|
||||
this.$message.success(res.message)
|
||||
|
||||
}).finally(() => {
|
||||
this.operateState = false
|
||||
})
|
||||
|
||||
},
|
||||
@ -672,7 +744,19 @@ export default {
|
||||
// 收藏
|
||||
postcollect() {
|
||||
console.log("点击收藏");
|
||||
}
|
||||
},
|
||||
|
||||
// 跳转全部板块的列表
|
||||
toAllSection() {
|
||||
this.$router.push({ path: `/allSections`, query: { twofid: this.info.fid } })
|
||||
},
|
||||
|
||||
// 处理点击编辑自己的回复
|
||||
handleIsmyself(item) {
|
||||
console.log(item, "item");
|
||||
this.twoCommentData = item.message
|
||||
this.popState = "discussionMulti"
|
||||
},
|
||||
|
||||
},
|
||||
|
||||
@ -818,8 +902,22 @@ export default {
|
||||
color: rgb(127, 127, 127);
|
||||
font-size: .32rem;
|
||||
}
|
||||
|
||||
.edit-box {
|
||||
width: .64rem;
|
||||
height: .64rem;
|
||||
border-radius: 50%;
|
||||
background: #f6f6f6;
|
||||
margin-left: .32rem;
|
||||
|
||||
.edit-icom {
|
||||
width: .4rem;
|
||||
// height: .4rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.card-content {
|
||||
color: #333;
|
||||
font-size: .36rem;
|
||||
@ -827,6 +925,13 @@ export default {
|
||||
padding: .5rem .32rem;
|
||||
word-break: break-word;
|
||||
|
||||
/deep/ {
|
||||
img {
|
||||
width: 100% !important;
|
||||
height: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
.quotation {
|
||||
width: 100%;
|
||||
color: #333;
|
||||
@ -862,49 +967,51 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
.content-unlock {
|
||||
&.content-unlock-no {
|
||||
height: 3.2rem;
|
||||
/deep/ {
|
||||
.content-unlock {
|
||||
&.content-unlock-no {
|
||||
height: 3.2rem;
|
||||
|
||||
.unlock-icom {
|
||||
width: .64rem;
|
||||
height: .64rem;
|
||||
margin-right: 0.2rem;
|
||||
.unlock-icom {
|
||||
width: .64rem;
|
||||
height: .64rem;
|
||||
margin-right: 0.2rem;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
background: rgba(242, 242, 242, 0.7);
|
||||
margin: .48rem 0;
|
||||
color: #555555;
|
||||
font-size: .32rem;
|
||||
border-radius: .16rem;
|
||||
|
||||
&.content-already {
|
||||
background: rgba(242, 242, 242, 0.7);
|
||||
margin: .48rem 0;
|
||||
padding: .32rem;
|
||||
color: #555555;
|
||||
font-size: .32rem;
|
||||
border-radius: .16rem;
|
||||
|
||||
.content-already-header {
|
||||
color: #7f7f7f;
|
||||
font-size: .28rem;
|
||||
justify-content: center;
|
||||
&.content-already {
|
||||
background: rgba(242, 242, 242, 0.7);
|
||||
margin: .48rem 0;
|
||||
padding: .32rem;
|
||||
color: #555555;
|
||||
font-size: .32rem;
|
||||
border-radius: .16rem;
|
||||
|
||||
.content-already-header {
|
||||
color: #7f7f7f;
|
||||
font-size: .28rem;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.content-unlock-wenzi {
|
||||
color: #333;
|
||||
font-size: .36rem;
|
||||
line-height: .6rem;
|
||||
margin-top: .3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.content-unlock-wenzi {
|
||||
color: #333;
|
||||
font-size: .36rem;
|
||||
line-height: .6rem;
|
||||
margin-top: .3rem;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.offer-content {
|
||||
@ -915,13 +1022,65 @@ export default {
|
||||
line-height: .6rem;
|
||||
word-break: break-word;
|
||||
|
||||
/deep/ strong {
|
||||
font-weight: bold;
|
||||
/deep/ {
|
||||
strong {
|
||||
font-weight: bold;
|
||||
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
|
||||
.content-unlock {
|
||||
&.content-unlock-no {
|
||||
height: 3.2rem;
|
||||
|
||||
.unlock-icom {
|
||||
width: .64rem;
|
||||
height: .64rem;
|
||||
margin-right: 0.2rem;
|
||||
vertical-align: middle;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
background: rgba(242, 242, 242, 0.7);
|
||||
margin: .48rem 0;
|
||||
color: #555555;
|
||||
font-size: .32rem;
|
||||
border-radius: .16rem;
|
||||
|
||||
&.content-already {
|
||||
background: rgba(242, 242, 242, 0.7);
|
||||
margin: .48rem 0;
|
||||
padding: .32rem;
|
||||
color: #555555;
|
||||
font-size: .32rem;
|
||||
border-radius: .16rem;
|
||||
|
||||
.content-already-header {
|
||||
color: #7f7f7f;
|
||||
font-size: .28rem;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.content-unlock-wenzi {
|
||||
color: #333;
|
||||
font-size: .36rem;
|
||||
line-height: .6rem;
|
||||
margin-top: .3rem;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
/deep/ img {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.tenement-img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.offer-content-box {
|
||||
|
@ -7,7 +7,7 @@
|
||||
</div>
|
||||
<div class="allSections-right">
|
||||
<div class="allSections-right-item" @click="pitchPlate(i.fid, i.name)"
|
||||
v-for="(i, k) in list[allActive].data" :key="k">
|
||||
v-for="(i, k) in (list[allActive] && list[allActive]['data'])" :key="k">
|
||||
<div class="item-content">
|
||||
<div class="item-title">{{ i.name }}</div>
|
||||
<div v-if="i.description" class="item-text" v-html="i.description.replace(/<[^>]+>/g, '')"></div>
|
||||
@ -37,8 +37,9 @@
|
||||
|
||||
</div>
|
||||
|
||||
<!-- .paging-box { -->
|
||||
|
||||
<div v-if="invitationList.length != 0" class="paging flexcenter">
|
||||
<div v-if="invitationList.length != 0" class="paging-bo paging flexcenter">
|
||||
<el-pagination small background layout="prev, pager, next" @current-change="currentChange"
|
||||
:current-page.sync="invitationPage" :page-size="invitationLimit" :total="invitationCount">
|
||||
</el-pagination>
|
||||
@ -74,6 +75,17 @@ export default {
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
"$store.state.allForumList": {
|
||||
handler(newV, oldV) {
|
||||
if (!Array.isArray(newV)) return
|
||||
this.list = newV
|
||||
},
|
||||
immediate: true
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.$store.subscribe((mutation, state) => {
|
||||
if (mutation.type == "setAllForumList") this.list = this.$store.state.allForumList
|
||||
@ -84,26 +96,22 @@ export default {
|
||||
if (twofid) this.twofid = twofid
|
||||
if (invitationPage) this.invitationPage = Number(invitationPage)
|
||||
|
||||
if (Number(onefid) > 0) this.a()
|
||||
|
||||
if (Number(onefid) > 0 || Number(twofid) > 0) this.handQuery()
|
||||
|
||||
if (Number(twofid) > 0) this.getInvitationList()
|
||||
|
||||
},
|
||||
|
||||
methods: {
|
||||
a() {
|
||||
// 处理 query 的参数
|
||||
handQuery() {
|
||||
if (this.list.length >= 2) {
|
||||
|
||||
let list = this.list
|
||||
console.log("list", list);
|
||||
list.forEach((el, index) => {
|
||||
// console.log(this.twofid);
|
||||
|
||||
if (el.fid == this.onefid) this.allActive = index
|
||||
|
||||
if (this.twofid) {
|
||||
el.data.forEach((element, i) => {
|
||||
console.log(element, i);
|
||||
if (element.fid == this.twofid) {
|
||||
this.plate = {
|
||||
stairname: el.name,
|
||||
@ -116,11 +124,9 @@ export default {
|
||||
|
||||
})
|
||||
|
||||
console.log(this.onefid, "onefidonefid");
|
||||
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
this.a()
|
||||
this.handQuery()
|
||||
}, 500)
|
||||
}
|
||||
|
||||
@ -132,10 +138,7 @@ export default {
|
||||
|
||||
allClick(index, fid) {
|
||||
this.allActive = index
|
||||
const params = new URLSearchParams(window.location.search);
|
||||
params.set('onefid', fid);
|
||||
const newUrl = window.location.pathname + '?' + params.toString();
|
||||
window.history.pushState({}, '', newUrl);
|
||||
this.$updateURLSearchParams({ onefid: fid })
|
||||
},
|
||||
|
||||
// 点击收藏
|
||||
@ -159,6 +162,8 @@ export default {
|
||||
this.$forceUpdate()
|
||||
}).finally(() => {
|
||||
this.postCollectionState = false
|
||||
this.$store.commit('setHomeRequestState', false)
|
||||
this.$store.dispatch('getUserInfo', this)
|
||||
})
|
||||
},
|
||||
|
||||
@ -175,7 +180,7 @@ export default {
|
||||
// 获取帖子列表
|
||||
getInvitationList() {
|
||||
this.$startupUnderLoading(this)
|
||||
this.$http.post("/api/home/threadList", {
|
||||
this.$http.get("/api/home/threadList", {
|
||||
page: this.invitationPage,
|
||||
limit: this.invitationLimit,
|
||||
fid: this.twofid
|
||||
@ -236,6 +241,15 @@ export default {
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
|
||||
-ms-overflow-style: none;
|
||||
overflow: -moz-scrollbars-none;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
span {
|
||||
height: 1.28rem;
|
||||
line-height: 1.28rem;
|
||||
|
@ -2,45 +2,44 @@
|
||||
<!-- 收藏版块 -->
|
||||
<div class="collect">
|
||||
<!-- 未收藏 -->
|
||||
<div v-if="collect.length == 0" class="notCollect">
|
||||
<div v-if="favoriteHeadList.length == 0" class="notCollect">
|
||||
<img class="notCollect-img" src="~assets/img/collect/notCollect.png" alt="未收藏" />
|
||||
<div class="collect-text">收藏你感兴趣的版块,迅速浏览相应的帖子</div>
|
||||
<!-- <div class="collect-btn"> -->
|
||||
<router-link to="/allSections" class="flexcenter collect-btn">
|
||||
|
||||
<div class="collect-btn-text">马上收藏</div>
|
||||
<svg-icon icon-class="collect-btn" class-name="icon-collect"></svg-icon>
|
||||
</router-link>
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
<!-- 已收藏 -->
|
||||
<div v-else>
|
||||
<!-- 热门版块 -->
|
||||
<div class="hot-box">
|
||||
<div class="hot-label" :class="{ active: hotActive == index }" v-for="(item, index) in list" :key="index"
|
||||
@click="hotLabelClick(index)">
|
||||
{{ item.label }}
|
||||
<div class="hot-box" v-if="favoriteHeadList.length > 1">
|
||||
<div class="hot-label" :class="{ active: fid == item.fid }" v-for="(item, index) in favoriteHeadList" :key="index"
|
||||
@click="hotLabelClick(item.fid)">
|
||||
{{ item.name }}
|
||||
</div>
|
||||
<!-- 设置按钮 -->
|
||||
<div class="setting flexcenter" @click="settingClick">
|
||||
<img src="~assets/img/icon/setting.png" alt="设置" />
|
||||
设置
|
||||
</div>
|
||||
|
||||
<!-- 设置 收藏版块弹窗 -->
|
||||
<div class="setting-window" :class="{ 'setting-show': settingShow == true }" @click="settingClose">
|
||||
<div class="setting-container" @click.stop>
|
||||
<div class="setting-title">设置收藏版块</div>
|
||||
<div class="setting-total">
|
||||
<div class="setting-num">共收藏<b> {{ list.length - 1 }} </b>个版块</div>
|
||||
<div class="setting-num">共收藏<b> {{ favoriteHeadList.length - 1 }} </b>个版块</div>
|
||||
<router-link to="/allSections" class="flexcenter setting-add">
|
||||
<svg-icon icon-class="settingAdd" class-name="setting-add-img"></svg-icon>添加
|
||||
</router-link>
|
||||
</div>
|
||||
<!-- 弹窗收藏版块内容 -->
|
||||
<div class="setting-sections">
|
||||
<div v-for="(item, index) in list" :key="index">
|
||||
<div v-if="index != 0" class="setting-item" @click.stop="cancelFavoritesSection(index)">
|
||||
<div class="setting-item-title">{{ item.label }}</div>
|
||||
<div v-for="(item, index) in favoriteHeadList" :key="index">
|
||||
<div v-if="index != 0" class="setting-item" @click.stop="cancelFavoritesSection(item.fid, index)">
|
||||
<div class="setting-item-title">{{ item.name }}</div>
|
||||
<div class="setting-star"></div>
|
||||
</div>
|
||||
</div>
|
||||
@ -50,12 +49,24 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 路径 -->
|
||||
<plate-navigation stairname="寄托学术类备" subsectionsname="SAT、AP考试、海外本科申…"></plate-navigation>
|
||||
<template v-if="fid != 0">
|
||||
<plate-navigation :stairname="plate.stairname" :subsectionsname="plate.subsectionsname"></plate-navigation>
|
||||
</template>
|
||||
|
||||
<!-- 内容区域 -->
|
||||
<section>
|
||||
<!-- <index-list :list=""></index-list> -->
|
||||
<index-list></index-list>
|
||||
<template v-if="favorite.list.length != 0 || loading">
|
||||
<index-list :list="favorite.list"></index-list>
|
||||
<div class="paging flexcenter">
|
||||
<el-pagination small background layout="prev, pager, next" @current-change="currentChange"
|
||||
:current-page.sync="favorite.page" :page-size="favorite.limit" :total="favorite.count">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
@ -69,37 +80,146 @@ export default {
|
||||
name: "Collect",
|
||||
data() {
|
||||
return {
|
||||
hotActive: 0, //热门版块活跃点击
|
||||
allForumList: [], // 所有板块得数据
|
||||
favoriteHeadList: [],
|
||||
// {
|
||||
// name: "全部",
|
||||
// fid: 0
|
||||
// }],
|
||||
favoriteHeadIdList: [],
|
||||
// favoriteHeadIdList: this.$store.state.favoriteList,
|
||||
fid: 0, // 选中的收藏板块
|
||||
collect: [1],
|
||||
settingShow: false, //弹窗显示
|
||||
settingStar: false,
|
||||
list: [
|
||||
//版块
|
||||
{
|
||||
label: "全部",
|
||||
},
|
||||
{
|
||||
label: "香港留学",
|
||||
},
|
||||
{
|
||||
label: "香港留学",
|
||||
},
|
||||
{
|
||||
label: "香港留学",
|
||||
},
|
||||
],
|
||||
plate: {
|
||||
stairname: "",// 一级版块名称
|
||||
subsectionsname: "",// 子版块名称
|
||||
},
|
||||
favorite: { // 收藏板块
|
||||
list: [],
|
||||
limit: 20,
|
||||
page: 1,
|
||||
count: 0
|
||||
},
|
||||
loading: null,
|
||||
|
||||
|
||||
};
|
||||
},
|
||||
|
||||
watch: {
|
||||
"$store.state.allForumList": {
|
||||
handler(newV, oldV) {
|
||||
if (!Array.isArray(newV)) return
|
||||
this.allForumList = newV
|
||||
if (this.favoriteHeadList.length != 0) this.handleFavoriteHeadList()
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
|
||||
favoriteHeadIdList: {
|
||||
handler(newV, oldV) {
|
||||
if (!Array.isArray(newV)) return
|
||||
this.favoriteHeadList = newV
|
||||
if (this.allForumList.length != 0) this.handleFavoriteHeadList()
|
||||
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
components: {
|
||||
plateNavigation,
|
||||
indexList
|
||||
let { page, fid } = this.$route.query
|
||||
if (page) this.favorite.page = Number(page)
|
||||
if (fid) this.fid = fid
|
||||
|
||||
this.init()
|
||||
},
|
||||
|
||||
methods: {
|
||||
hotLabelClick(index) {
|
||||
this.hotActive = index;
|
||||
init() {
|
||||
let { homeRequestState, favoriteList } = this.$store.state
|
||||
if (!homeRequestState) {
|
||||
setTimeout(() => {
|
||||
this.init()
|
||||
}, 300);
|
||||
} else {
|
||||
this.favoriteHeadIdList = favoriteList
|
||||
this.getCollectList()
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
// 获取收藏列表数据
|
||||
getCollectList() {
|
||||
|
||||
if (this.favoriteHeadIdList.length == 0) return
|
||||
this.$startupUnderLoading(this)
|
||||
this.$http.get("/api/home/threadList", {
|
||||
limit: this.favorite.limit,
|
||||
page: this.favorite.page,
|
||||
fid: this.fid,
|
||||
type: "fav"
|
||||
}).then(res => {
|
||||
if (res.code != 200) return
|
||||
let data = res.data
|
||||
|
||||
this.favorite.list = data.data
|
||||
this.favorite.page = data.page
|
||||
this.favorite.limit = data.limit
|
||||
this.favorite.count = data.count
|
||||
|
||||
}).finally(() => {
|
||||
this.$closeUnderLoading(this)
|
||||
})
|
||||
},
|
||||
|
||||
// 处理获取收藏板块的值
|
||||
handleFavoriteHeadList() {
|
||||
let allForumList = this.allForumList
|
||||
let favoriteHeadIdList = this.favoriteHeadIdList
|
||||
let favoriteHeadList = [{
|
||||
name: "全部",
|
||||
fid: 0
|
||||
}]
|
||||
|
||||
|
||||
allForumList.forEach((el, index) => {
|
||||
if (!Array.isArray(el.data)) return
|
||||
el.data.forEach(elememt => {
|
||||
if (elememt.fid == this.fid) {
|
||||
this.plate.stairname = el.name
|
||||
this.plate.subsectionsname = elememt.name
|
||||
}
|
||||
|
||||
if (favoriteHeadIdList.includes(elememt.fid)) {
|
||||
favoriteHeadList.push({
|
||||
fid: elememt.fid,
|
||||
name: elememt.name,
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
this.favoriteHeadList = favoriteHeadList
|
||||
},
|
||||
|
||||
currentChange() {
|
||||
let query = {
|
||||
page: this.favorite.page,
|
||||
}
|
||||
if (this.fid) query['fid'] = this.fid
|
||||
|
||||
this.$router.push({ path: `/collect`, query })
|
||||
},
|
||||
|
||||
hotLabelClick(fid) {
|
||||
let query = {
|
||||
page: 1,
|
||||
fid
|
||||
}
|
||||
this.$router.push({ path: `/collect`, query })
|
||||
},
|
||||
// 点击显示弹窗
|
||||
settingClick() {
|
||||
@ -110,11 +230,33 @@ export default {
|
||||
this.settingShow = false;
|
||||
},
|
||||
// 处理取消收藏板块
|
||||
cancelFavoritesSection(index) {
|
||||
this.list.splice(index, 1)
|
||||
cancelFavoritesSection(fid, index) {
|
||||
let url = "/api/operation/unforumFav"
|
||||
|
||||
this.$http.post(url, {
|
||||
fid
|
||||
}).then(res => {
|
||||
if (res.code != 200) return
|
||||
|
||||
let list = this.$store.state.allForumList
|
||||
this.$store.commit('setAllForumList', list)
|
||||
|
||||
this.favoriteHeadList.splice(index, 1)
|
||||
|
||||
this.$Message.success(res.message)
|
||||
}).finally(() => {
|
||||
this.$store.commit('setHomeRequestState', false)
|
||||
this.$parent.init()
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
components: {
|
||||
plateNavigation,
|
||||
indexList
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -314,6 +456,7 @@ export default {
|
||||
|
||||
.paging {
|
||||
margin-top: .48rem;
|
||||
padding-bottom: 1rem;
|
||||
|
||||
::v-deep {
|
||||
.el-pagination.is-background .el-pager li:not(.disabled).active {
|
||||
|
@ -34,20 +34,25 @@ export default {
|
||||
return this.$route.path + Math.random()
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
"$store.state.homeRequestState": {
|
||||
handler(newV, oldV) {
|
||||
let { favoriteList, recommendList } = this.$store.state
|
||||
this.favorite = favoriteList
|
||||
this.recommend = recommendList
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
|
||||
},
|
||||
components: {
|
||||
HeaderNav,
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.$http.post("/api/home").then(res => {
|
||||
let data = res.data
|
||||
this.favorite = data.favorite
|
||||
this.recommend = data.recommend
|
||||
})
|
||||
},
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
@ -2,14 +2,21 @@
|
||||
<div class="recommend">
|
||||
<!-- 热门版块 -->
|
||||
<div class="hot-box">
|
||||
<div class="hot-label" :class="{ 'active': hotActive == index }" v-for="(item, index) in list" :key="index"
|
||||
@click="hotLabelClick(index)">{{ item.label }}</div>
|
||||
<div class="hot-label" :class="{ 'active': item.fid == fid }" v-for="(item, index) in hotList" :key="index"
|
||||
@click="hotLabelClick(item.fid)">{{ item.name }}</div>
|
||||
</div>
|
||||
<!-- 路径 -->
|
||||
<plate-navigation stairname="香港澳门台湾" subsectionsname="SAT、AP考试、海外本科申…"></plate-navigation>
|
||||
<plate-navigation v-if="fid != 0" :stairname="plate.stairname"
|
||||
:subsectionsname="plate.subsectionsname"></plate-navigation>
|
||||
<section>
|
||||
<template v-if="list.length == 0">
|
||||
<index-list></index-list>
|
||||
<template v-if="list.length != 0 || loading">
|
||||
<index-list :list="list"></index-list>
|
||||
|
||||
<div class="paging flexcenter">
|
||||
<el-pagination small background layout="prev, pager, next" @current-change="currentChange"
|
||||
:current-page.sync="page" :page-size="limit" :total="count">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
<div class="result-empty-box flexcenter shadow" v-else>
|
||||
<img class="result-empty-icon" src="@/assets/img/icon/empty.png">
|
||||
@ -25,30 +32,102 @@ export default {
|
||||
name: "Recommend",//推荐阅读
|
||||
data() {
|
||||
return {
|
||||
hotActive: -1,//热门版块活跃点击
|
||||
list: [
|
||||
{
|
||||
label: "香港留学"
|
||||
},
|
||||
{
|
||||
label: "香港留学"
|
||||
},
|
||||
{
|
||||
label: "香港留学"
|
||||
},
|
||||
{
|
||||
label: "香港留学"
|
||||
}
|
||||
]
|
||||
hotList: [],
|
||||
list: [],
|
||||
count: 0, // 总数
|
||||
limit: 20, // 列表
|
||||
page: 1, // 页数
|
||||
fid: 0, // 板块id
|
||||
plate: {
|
||||
stairname: "",// 一级版块名称
|
||||
subsectionsname: "",// 子版块名称
|
||||
},
|
||||
|
||||
loading: null,
|
||||
allForumList: this.$store.state.allForumList || [],
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
"$parent.recommend": {
|
||||
handler(newV, oldV) {
|
||||
this.hotList = newV
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
|
||||
"$store.state.allForumList": {
|
||||
handler(newV, oldV) {
|
||||
this.allForumList = newV
|
||||
this.handleForumFid()
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.$parent);
|
||||
let { page, fid } = this.$route.query
|
||||
if (page) this.page = Number(page)
|
||||
if (fid) {
|
||||
this.fid = fid
|
||||
this.handleForumFid()
|
||||
}
|
||||
|
||||
this.init()
|
||||
},
|
||||
|
||||
methods: {
|
||||
hotLabelClick(index) {
|
||||
this.hotActive = index
|
||||
init() {
|
||||
this.$startupUnderLoading(this)
|
||||
this.$http.get("/api/home/threadList", {
|
||||
limit: this.limit,
|
||||
type: "recommend",
|
||||
page: this.page,
|
||||
fid: this.fid,
|
||||
}).then(res => {
|
||||
|
||||
if (res.code != 200) return
|
||||
let data = res.data
|
||||
this.list = data.data
|
||||
this.limit = data.limit
|
||||
this.page = data.page
|
||||
this.count = data.count
|
||||
}).finally(() => {
|
||||
this.$closeUnderLoading(this)
|
||||
|
||||
})
|
||||
},
|
||||
|
||||
// 初始化板块的头部
|
||||
handleForumFid() {
|
||||
let allForumList = this.allForumList
|
||||
if (!Array.isArray(allForumList) || allForumList.length <= 1) return
|
||||
allForumList.forEach((el, index) => {
|
||||
if (!Array.isArray(el['data'])) return
|
||||
el.data.forEach(element => {
|
||||
if (element['fid'] == this.fid) {
|
||||
this.plate.subsectionsname = element.name
|
||||
this.plate.stairname = el.name
|
||||
}
|
||||
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
currentChange() {
|
||||
let query = {
|
||||
page: this.page,
|
||||
}
|
||||
if (this.fid) query['fid'] = this.fid
|
||||
|
||||
this.$router.push({ path: `/recommend`, query })
|
||||
},
|
||||
|
||||
hotLabelClick(fid) {
|
||||
let query = {
|
||||
page: 1,
|
||||
fid
|
||||
}
|
||||
this.$router.push({ path: `/recommend`, query })
|
||||
}
|
||||
},
|
||||
components: {
|
||||
@ -59,8 +138,13 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.path-box {
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
|
||||
.paging {
|
||||
margin-top: .48rem;
|
||||
padding-bottom: 1rem;
|
||||
|
||||
::v-deep {
|
||||
.el-pagination.is-background .el-pager li:not(.disabled).active {
|
||||
@ -72,10 +156,25 @@ export default {
|
||||
.el-pagination .btn-prev .el-icon {
|
||||
font-size: .4rem;
|
||||
}
|
||||
|
||||
.is-background.el-pagination--small .el-pager li {
|
||||
border-radius: 50% !important;
|
||||
}
|
||||
|
||||
.el-pagination.is-background.el-pagination--small .btn-next,
|
||||
.el-pagination.is-background.el-pagination--small .btn-prev,
|
||||
.el-pagination.is-background.el-pagination--small .el-pager li {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
section {
|
||||
padding-top: 0;
|
||||
height: 10.3333rem;
|
||||
}
|
||||
</style>
|
@ -108,9 +108,11 @@ export default {
|
||||
let kw = this.kw
|
||||
if (!kw) return
|
||||
this.page = 1
|
||||
this.getSearchResult()
|
||||
|
||||
this.$updateURLSearchParams({ kw: this.kw, page: this.page })
|
||||
this.$router.push({ path: `/searchResult`, query: { kw: this.kw, page: this.page } })
|
||||
|
||||
// this.getSearchResult()
|
||||
// this.$updateURLSearchParams({ kw: this.kw, page: this.page })
|
||||
},
|
||||
|
||||
// 获取搜索结果数据
|
||||
|