diff --git a/src/components/SearchBox-冲突-肖荣豪_Win10.vue b/src/components/SearchBox-冲突-肖荣豪_Win10.vue
new file mode 100755
index 0000000..8c121fb
--- /dev/null
+++ b/src/components/SearchBox-冲突-肖荣豪_Win10.vue
@@ -0,0 +1,199 @@
+<template>
+ <div>
+ <div class="head-search flexcenter" v-if="issearch" @click="searchClick()">
+ <img class="head-search-icon" src="@/assets/img/headerNav/search.png" />
+ <span>搜索</span>
+ </div>
+
+ <!-- 搜索弹窗 -->
+ <div class="search-window" :class="{ 'searchShow': searchWinShow == true }">
+ <!-- 搜索框 -->
+ <div class="search-input flexacenter">
+ <div class="form flexacenter">
+ <img class="search-icon" src="@/assets/img/headerNav/search.png">
+ <input class="flex1" ref="searchInput" v-model="searchText" type="text" placeholder="请输入搜索关键词" />
+ <img v-if="searchText" @click.stop="clearText()" class="clear-text" src="@/assets/img/icon/clear.png">
+ </div>
+
+ <div class="search-close" @click="searchClose()">取消</div>
+ </div>
+ <!-- 历史搜索 -->
+ <div class="search-content flexcolumn">
+ <div class="search-text">历史搜索</div>
+ <div class="search-label">
+ <span>香港大学</span>
+ <span>香港大学</span>
+ <span>香港大学</span>
+ </div>
+ </div>
+ <!-- 热门搜索 -->
+ <div class="search-content">
+ <div class="search-text">热门搜索</div>
+ <div class="search-label">
+ <span v-for="(item, index) in hotSearchkeywords" :key="index" @click="toSearchResult(item)">{{ item }}</span>
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+export default {
+ name: "SearchBox",
+ data() {
+ return {
+ searchWinShow: false,//显示搜索弹窗
+ searchText: '',
+ showClear: false, //显示清除按钮
+ }
+ },
+ props: ["issearch", "hotSearchkeywords"],
+
+ methods: {
+ collapseClick() {
+ if (this.collapseShow == true) this.collapseShow = false;
+ else this.collapseShow = true;
+ },
+ // 点击显示搜索弹窗
+ searchClick() {
+ this.searchWinShow = true
+ this.$nextTick(() => {
+ this.$refs.searchInput.focus();
+ })
+ },
+ // 点击隐藏搜索弹窗
+ searchClose() {
+ this.searchWinShow = false
+ },
+ // 搜索键盘、搜索
+ search(categoryId) {
+ this.$refs.searchInput.blur();
+ },
+ // 清空文本框
+ clearText() {
+ this.searchText = ""
+ },
+
+ // 跳转搜索结果
+ toSearchResult(kw){
+ this.$router.push(`/searchResult?kw=${kw}`)
+ },
+ },
+ mounted() {
+ if (this.searchText.length > 0) this.showClear = true
+ else this.showClear = false
+
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+.head-search {
+ width: 2.4rem;
+ height: .8rem;
+ border-radius: 2.56rem;
+ background-color: rgba(235, 235, 235, 1);
+ color: #AAAAAA;
+ font-size: .3467rem;
+
+ .head-search-icon {
+ width: .4rem;
+ height: .4rem;
+ margin-right: .14rem;
+ }
+
+ margin-right: .4rem;
+}
+
+
+
+// 搜索弹窗
+.search-window {
+ display: none;
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ min-height: 100vh;
+ background-color: #f6f6f6;
+ z-index: 9;
+
+ &.searchShow {
+ display: block;
+ }
+
+ .search-input {
+ padding: 0.27rem 0.32rem 0.27rem;
+ justify-content: space-between;
+
+ .search-icon {
+ width: .4rem;
+ height: .4rem;
+ }
+
+ .form {
+ width: 90%;
+ background-color: #ebebeb;
+ height: 1.12rem;
+ line-height: 1.12rem;
+ border-radius: 0.56rem;
+ padding-left: .4rem;
+
+ }
+
+ input {
+ font-size: 0.36rem;
+ border: none;
+ outline: 0;
+ color: #000;
+ padding-left: .34rem;
+ height: 1.12rem;
+ background: transparent;
+
+ }
+
+ .clear-text {
+ width: 0.4rem;
+ height: 0.4rem;
+ padding: .48rem;
+ }
+
+ .search-close {
+ width: 10%;
+ font-size: 0.36rem;
+ text-align: right;
+ }
+ }
+
+ .search-content {
+ padding: 0.27rem 0.32rem 0.27rem;
+ margin-top: 0.2rem;
+
+ .search-text {
+ color: #7F7F7F;
+ font-size: 0.32rem;
+ margin-bottom: .32rem;
+ }
+
+ .search-label {
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+
+ span {
+ padding: 0 0.2rem;
+ height: 0.96rem;
+ line-height: 0.96rem;
+ background-color: #fff;
+ border-radius: 0.16rem;
+ color: #333;
+ text-align: center;
+ font-size: 0.36rem;
+ margin-right: .2rem;
+ margin-bottom: .24rem;
+ }
+ }
+ }
+
+}
+</style>
\ No newline at end of file
diff --git a/src/components/SearchBox.vue b/src/components/SearchBox.vue
index 8c121fb..29de112 100755
--- a/src/components/SearchBox.vue
+++ b/src/components/SearchBox.vue
@@ -30,7 +30,9 @@
<div class="search-content">
<div class="search-text">热门搜索</div>
<div class="search-label">
- <span v-for="(item, index) in hotSearchkeywords" :key="index" @click="toSearchResult(item)">{{ item }}</span>
+ <span>Bocconi</span>
+ <span>Bocconi</span>
+ <span>Bocconi</span>
</div>
</div>
</div>
@@ -47,7 +49,7 @@ export default {
showClear: false, //显示清除按钮
}
},
- props: ["issearch", "hotSearchkeywords"],
+ props: ["issearch"],
methods: {
collapseClick() {
@@ -72,12 +74,7 @@ export default {
// 清空文本框
clearText() {
this.searchText = ""
- },
-
- // 跳转搜索结果
- toSearchResult(kw){
- this.$router.push(`/searchResult?kw=${kw}`)
- },
+ }
},
mounted() {
if (this.searchText.length > 0) this.showClear = true
diff --git a/src/main-冲突-肖荣豪_Win10.js b/src/main-冲突-肖荣豪_Win10.js
new file mode 100755
index 0000000..93b56bc
--- /dev/null
+++ b/src/main-冲突-肖荣豪_Win10.js
@@ -0,0 +1,44 @@
+import Vue from 'vue'
+import App from './App.vue'
+import router from './router'
+import store from './store'
+import ElementUI, { Message, Pagination } from 'element-ui';
+import 'element-ui/lib/theme-chalk/index.css';
+import { skipUrl, pageStop, pageMove, goTologin, copy, startupUnderLoading, closeUnderLoading, formattedDate } from "@/utils/common.js"
+import http from "@/utils/request"
+import hintBox from '@/components/Hintbox'
+
+Vue.config.productionTip = false
+
+Vue.prototype.$baseURL = "https://forum.gter.net/api" // 请求接口的共 url
+Vue.prototype.$loginUrl = "https://passport.gter.net/" // 跳转登录的url
+
+Vue.prototype.$http = http // 跳转登录页面的方法
+Vue.prototype.$skipUrl = skipUrl // 跳转页面的公共方法
+Vue.prototype.$goTologin = goTologin // 跳转登录页面的方法
+// 上面的顺序不要修改
+
+Vue.prototype.$pageStop = pageStop // 页面禁止滑动
+Vue.prototype.$pageMove = pageMove // 页面可以滑动
+Vue.prototype.$Message = Message // 消息提示框
+Vue.prototype.$copy = copy // 复制
+Vue.prototype.$startupUnderLoading = startupUnderLoading // 开启加载提示 element的
+Vue.prototype.$closeUnderLoading = closeUnderLoading // 关闭加载提示 element的
+Vue.prototype.$formattedDate = formattedDate // 时间戳转格式
+
+//svg文件引入
+import './icons'
+//动态设置fontsize
+import './utils/fontSize.js'
+
+//ElementUI
+Vue.use(ElementUI);
+Vue.use(Pagination);
+
+
+
+new Vue({
+ router,
+ store,
+ render: h => h(App)
+}).$mount('#app')
diff --git a/src/main.js b/src/main.js
index 93b56bc..1aa5434 100755
--- a/src/main.js
+++ b/src/main.js
@@ -4,9 +4,8 @@ import router from './router'
import store from './store'
import ElementUI, { Message, Pagination } from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
-import { skipUrl, pageStop, pageMove, goTologin, copy, startupUnderLoading, closeUnderLoading, formattedDate } from "@/utils/common.js"
+import { skipUrl, pageStop, pageMove, goTologin, copy } from "@/utils/common.js"
import http from "@/utils/request"
-import hintBox from '@/components/Hintbox'
Vue.config.productionTip = false
@@ -22,9 +21,6 @@ Vue.prototype.$pageStop = pageStop // 页面禁止滑动
Vue.prototype.$pageMove = pageMove // 页面可以滑动
Vue.prototype.$Message = Message // 消息提示框
Vue.prototype.$copy = copy // 复制
-Vue.prototype.$startupUnderLoading = startupUnderLoading // 开启加载提示 element的
-Vue.prototype.$closeUnderLoading = closeUnderLoading // 关闭加载提示 element的
-Vue.prototype.$formattedDate = formattedDate // 时间戳转格式
//svg文件引入
import './icons'
diff --git a/src/utils/common-冲突-肖荣豪_Win10.js b/src/utils/common-冲突-肖荣豪_Win10.js
new file mode 100755
index 0000000..7ec7c9d
--- /dev/null
+++ b/src/utils/common-冲突-肖荣豪_Win10.js
@@ -0,0 +1,75 @@
+// a标签 跳转 isblank 代表跳转新标签
+function skipUrl(url, isblank = true) {
+ console.log();
+ let aTab = document.createElement("a");
+ document.body.appendChild(aTab);
+ aTab.setAttribute("href", url);
+ if (isblank) aTab.setAttribute("target", "_blank");
+ aTab.click();
+}
+
+
+// 禁止页面滑动
+function pageStop() {
+ document.body.style.overflow = "hidden";
+}
+
+// 开启页面滑动
+function pageMove() {
+ document.body.style.overflow = "";
+}
+
+// 跳转登录
+function goTologin() {
+ let url = encodeURIComponent(location.href);
+ console.log(skipUrl);
+ skipUrl(`https://passport.gter.net/?referer=${url}`, false);
+}
+
+// 点击复制
+function copy(value, message) {
+ // 创建一个新的输入元素
+ let copyInput = document.createElement('input');
+ // 将输入元素添加到文档的主体中
+ document.body.appendChild(copyInput);
+ // 将输入元素的值设置为需要复制的URL
+ copyInput.setAttribute('value', value);
+ // 选择输入元素
+ copyInput.select();
+ // 使用clipboard API将所选文本复制到剪贴板
+ navigator.clipboard.writeText(copyInput.value);
+ // 向用户显示成功消息
+ // 从文档中删除动态创建的输入元素
+ copyInput.remove();
+ if (message) this.$message.success(message);
+
+}
+
+
+// 启动加载中
+function startupUnderLoading(that) {
+ that.loading = that.$loading({
+ lock: true,
+ text: '加载中...',
+ background: 'rgba(0, 0, 0, 0.7)'
+ });
+}
+
+// 关闭加载中
+function closeUnderLoading(that) {
+ that.loading.close();
+}
+
+// 时间戳
+function formattedDate(timestamp) {
+ const date = new Date(timestamp * 1000);
+ const year = date.getFullYear();
+ const month = String(date.getMonth() + 1).padStart(2, '0');
+ const day = String(date.getDate()).padStart(2, '0');
+ const hours = String(date.getHours()).padStart(2, '0')
+ const minutes = String(date.getMinutes()).padStart(2, '0');
+ const formattedDate = `${year}-${month}-${day} ${hours}:${minutes}`;
+ return formattedDate
+}
+
+export { skipUrl, pageStop, pageMove, goTologin, copy, startupUnderLoading, closeUnderLoading, formattedDate }
\ No newline at end of file
diff --git a/src/utils/common.js b/src/utils/common.js
index 7ec7c9d..d41c461 100755
--- a/src/utils/common.js
+++ b/src/utils/common.js
@@ -41,35 +41,10 @@ function copy(value, message) {
// 向用户显示成功消息
// 从文档中删除动态创建的输入元素
copyInput.remove();
+
if (message) this.$message.success(message);
-
+
+
}
-
-// 启动加载中
-function startupUnderLoading(that) {
- that.loading = that.$loading({
- lock: true,
- text: '加载中...',
- background: 'rgba(0, 0, 0, 0.7)'
- });
-}
-
-// 关闭加载中
-function closeUnderLoading(that) {
- that.loading.close();
-}
-
-// 时间戳
-function formattedDate(timestamp) {
- const date = new Date(timestamp * 1000);
- const year = date.getFullYear();
- const month = String(date.getMonth() + 1).padStart(2, '0');
- const day = String(date.getDate()).padStart(2, '0');
- const hours = String(date.getHours()).padStart(2, '0')
- const minutes = String(date.getMinutes()).padStart(2, '0');
- const formattedDate = `${year}-${month}-${day} ${hours}:${minutes}`;
- return formattedDate
-}
-
-export { skipUrl, pageStop, pageMove, goTologin, copy, startupUnderLoading, closeUnderLoading, formattedDate }
\ No newline at end of file
+export { skipUrl, pageStop, pageMove, goTologin, copy }
\ No newline at end of file
diff --git a/src/views/detail/detailIndex-冲突-肖荣豪_Win10.vue b/src/views/detail/detailIndex-冲突-肖荣豪_Win10.vue
new file mode 100755
index 0000000..4d8390e
--- /dev/null
+++ b/src/views/detail/detailIndex-冲突-肖荣豪_Win10.vue
@@ -0,0 +1,1240 @@
+<template>
+ <div class="container">
+ <div class="detail-head flexacenter">
+ <div class="detail-section">版块：<span class="section-name">香港澳门台湾留学申请</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 }}
+ </div>
+ <div class="detail-data-item flexacenter">
+ <img class="detail-data-comment" src="@/assets/img/detail/comment.png">{{ info.replies }}
+ </div>
+ </div>
+ </div>
+
+ <div class="detail-title-box">
+ <div class="detail-title-item detail-title-jinghua flexcenter" v-if="info.digest > 0">精华</div>
+ <div class="detail-title-item detail-title-label flexcenter" v-if="info.typename">{{ info.typename }}</div>
+ {{ info.subject }}
+ </div>
+
+ <!-- -->
+ <div class="card flexcenter">
+ <!-- 总结开始 -->
+ <div class="card-item shadow" v-if="type == 5">
+ <div class="card-head flexacenter">
+ <img class="card-head-icon"
+ src="https://axure-file.lanhuapp.com/md516b251fb-9cfa-46fc-a9b6-2a41a7b4dc37__3ad73406ff4bc8b138dafc6dcbf1a635.svg" />
+ <div class="card-head-content flex1 flexflex">
+ <div class="card-head-name flexflex">闫旭Mike</div>
+ <div class="card-head-time">2022-7-6 14:56</div>
+ </div>
+ <div class="card-head-fool">楼主</div>
+ </div>
+ <div class="summary-content">
+ <div class="summary-content-item">
+ <div class="summary-offer-head flexacenter">
+ <span class="summary-offer-head-title">Offer 1</span>
+ <span class="flexacenter">详情<svg-icon icon-class="arrowsBlackLeft"
+ class-name="summary-offer-head-icon"></svg-icon></span>
+ </div>
+ <div class="summary-offer-box">
+ <div class="summary-offer-item flexacenter">
+ <div class="summary-offer-key flexacenter">
+ 申请学校
+ </div>
+ <div class="summary-offer-value flexacenter">
+ 韦仕敦大学
+ </div>
+ </div>
+ <div class="summary-offer-item flexacenter">
+ <div class="summary-offer-key flexacenter">
+ 学位
+ </div>
+ <div class="summary-offer-value flexacenter">
+ MA
+ </div>
+ </div>
+ <div class="summary-offer-item flexacenter">
+ <div class="summary-offer-key flexacenter">
+ 专业
+ </div>
+ <div class="summary-offer-value flexacenter">
+ Curriculum study
+ </div>
+ </div>
+ </div>
+
+ </div>
+ <div class="summary-content-item">
+ <div class="summary-offer-head flexacenter">
+ <span class="summary-offer-head-title">总结</span>
+ <span class="flexacenter">详情<svg-icon icon-class="arrowsBlackLeft"
+ class-name="summary-offer-head-icon"></svg-icon></span>
+ </div>
+ <div class="summary-wenzi">
+ guelph教授很好一直在帮忙催offer，现在uvic也出了口头offer，可能要纠结一下...
+
+ mcgill拒了算是意料之中吧
+
+ ottawa没搞懂申请的thesis下来了course...
+
+ calgary突然就来了offer，又陷入纠结了..
+ </div>
+
+ </div>
+
+
+ <div class="examine-btn flexcenter">
+ 查看当前总结详情
+ <div class="examine-btn-outside flexcenter">
+ <svg-icon icon-class="arrowsRoundBlackLeft" class-name="examine-btn-icon"></svg-icon>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!-- 总结结束 -->
+
+ <!-- offer -->
+ <div class="card-item shadow" v-if="type == 6">
+ <div class="card-head flexacenter">
+ <img class="card-head-icon" :src="info.avatar" />
+ <div class="card-head-content flex1 flexflex">
+ <div class="card-head-name flexflex">{{ info.author }}</div>
+ <div class="card-head-time">{{ $formattedDate(info.dateline) }}</div>
+ </div>
+ <div class="card-head-fool">楼主</div>
+ </div>
+ <div class="offer-content">
+ <div class="offer-content-box">
+ <template v-for="(item, index) in offerinfoKey">
+ <div class="offer-content-item flexacenter" :key="index" v-if="offerinfo[item.key]">
+ <div class="offer-content-key" v-if="offerinfo[item.key]">{{ item.name }}</div>
+ <div class="offer-content-value">{{ offerinfo[item.key] }}</div>
+ </div>
+ </template>
+
+ <!-- <div class="offer-content-item flexacenter" v-for="item in 7" :key="item">
+ <div class="offer-content-key">申请专业</div>
+ <div class="offer-content-value">韦仕敦大学</div>
+ </div> -->
+ </div>
+
+ <a class="examine-btn flexcenter" :href="shareurl">
+ 查看当前捷报详情
+ <div class="examine-btn-outside flexcenter">
+ <svg-icon icon-class="arrowsRoundBlackLeft" class-name="examine-btn-icon"></svg-icon>
+ </div>
+ </a>
+ </div>
+ </div>
+ <!-- offer结束 -->
+
+ <div class="card-item shadow" v-for="(item, index) in 7" :key="index">
+ <div class="card-head flexacenter">
+ <img class="card-head-icon"
+ src="https://axure-file.lanhuapp.com/md516b251fb-9cfa-46fc-a9b6-2a41a7b4dc37__3ad73406ff4bc8b138dafc6dcbf1a635.svg" />
+ <div class="card-head-content flex1 flexflex">
+ <div class="card-head-name flexflex">闫旭Mike <div class="landlord flexcenter" v-if="index == 0">楼主
+ </div>
+ </div>
+ <div class="card-head-time">2022-7-6 14:56</div>
+ </div>
+ <div class="card-head-fool">{{ index == 0 ? '楼主' : `${index}楼` }}</div>
+ </div>
+
+ <div class="card-content flex1">
+ <!-- 回复引用 -->
+ <div class="quotation flexflex" v-if="index == 1">
+ <svg-icon icon-class="quotation-left" class-name="quotation-icon"></svg-icon>
+ <div class="quotation-right flex1 flexflex">
+ <div class="quotation-wenzi flex1 three-lines">
+ 这个离开香港是否超过180天，应该是居籍的判断，而非物理空间变化的判断。简单来说，只要你在香港纳税，你在香港有工作，有现金流，有房子…这个离开香港是否超过180天，应该是居籍的判断，而非物理空间变化的判断。简单来说，只要你在香港纳税，你在香港有工作，有现金流，有房子…这个离开香港是否超过180天，应该是居籍的判断，而非物理空间变化的判断。简单来说，只要你在香港纳税，你在香港有工作，有现金流，有房子…
+ </div>
+
+ <div class="quotation-bottom flexacenter">zhangsd 发表于 2022-7-6 14:56
+ <svg-icon icon-class="quotation-right" class-name="quotation-icon"></svg-icon>
+ </div>
+ </div>
+ </div>
+ 之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
+ <!-- 未解锁区域 -->
+ <div class="flexcenter content-unlock content-unlock-no" v-if="index == 3 || index == 4">
+ <img class="unlock-icom" src="@/assets/img/detail/unlock.png">
+ {{ index == 3 ? '作者设置了回复可见' : '' }}
+ {{ index == 4 ? '作者设置了投币可见' : '' }}
+ </div>
+ <!-- 已经解锁区域 -->
+ <div class="content-unlock content-already" v-if="index == 5 || index == 6">
+ <div class="content-already-header flexflex">
+ - 本内容投币可见 -
+ </div>
+
+ <div class="content-unlock-wenzi">
+
+ 香港身份证件和IANG Visa label；
+
+ 香港购买的保险和MPF的缴费账单；
+
+ 电话账单和当时香港上台的合约文件；
+
+ </div>
+
+ </div>
+
+ 之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
+ 之前申请永久居民，参考了不少寄托的帖子和经验，现在回馈给大家，积攒RP。
+ </div>
+ </div>
+
+
+ </div>
+
+ <!-- 分页 -->
+ <div class="paging flexcenter">
+ <el-pagination small background layout="prev, pager, next" :total="1000">
+ </el-pagination>
+ </div>
+
+ <!-- 底部 -->
+ <div class="discuss-bottom flexflex flexacenter">
+ <!-- 底部的轮播 -->
+ <div class="swiper">
+ <div class="bottom-item flexacenter">
+ <div class="bottom-comment flexacenter" @click="setValue('popState', 'discussionSingle')">
+ <svg-icon icon-class="pen" class-name="bottom-comment-icom"></svg-icon>
+ 想问啥，大胆问
+ <div class="loginBtn" v-if="!islogin" @click.stop="setValue('isloginBtnState', true, 'boolean')">
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="bottom-item flex1 flexacenter">
+ <div class="bottom-operation-box flex1 flexacenter">
+ <div class="bottom-operation-item flex1 flexcolumn flexcenter" @click="tapLike">
+ <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="loginBtn" v-if="!islogin" @click.stop="setValue('isloginBtnState', true, 'boolean')">
+ </div>
+ <img class="bottom-operation-icom" :class="{ 'prepareLiskeAnimateState': prepareLiskeAnimateState }"
+ src="@/assets/img/detail/like.png" />
+ <div class="bottom-operation-text">{{ stat.like == 0 ? '' : stat.like }}赞</div>
+ </div>
+ <div class="bottom-operation-item flex1 flexcolumn flexcenter" @click="postcollect()">
+ <div class="loginBtn" v-if="!islogin" @click.stop="setValue('isloginBtnState', true, 'boolean')">
+ </div>
+ <img v-if="iscollect == 0" class="bottom-operation-icom" src="@/assets/img/detail/collect.png">
+ <img v-else class="bottom-operation-icom" src="@/assets/img/detail/collect-c.png">
+ <div class="bottom-operation-text">收藏</div>
+ </div>
+ <div class="bottom-operation-item flex1 flexcolumn flexcenter" @click="transmit()">
+ <img class="bottom-operation-icom bottom-transmit-icom" src="@/assets/img/detail/share.png" />
+ <div class="bottom-operation-text">转发</div>
+ <button class="bottom-operation-button flexcolumn flexcenter" open-type="share"></button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <detail-reply :two-comment-data="twoCommentData" :pop-state="popState"></detail-reply>
+ <coins :coin-config="coinConfig" :pop-state="popState"></coins>
+ </div>
+</template>
+
+<script>
+import DetailReply from '@/components/DetailReply'
+import Coins from '@/components/unlock/Coins'
+export default {
+ name: 'detailIndex',
+ data() {
+ return {
+ twoCommentData: {
+ avatar: "https://oss.gter.net/avatar/97KwEWANd_4DHWiY6VbnSUFSCKroYWFjYQ~~/middle",
+ content: "评论回复",
+ },
+ popState: "",
+ coinConfig: {
+ strategy: {
+ button: "攒币指南",
+ tips: "你的寄托币不够，快去发帖挣币吧",
+ url: "https://bbs.gter.net/thread-2543548-1-1.html",
+ }
+ },
+
+ islogin: true,
+ prepareLiskeState: false,
+ prepareLiskeAnimateState: false,
+ stat: {
+ like: 0
+ },
+ iscollect: 0,
+
+ ispostOfferLike: null, // 点击点赞提交状态
+ offerLikesumTimer: 0, // offer点赞累加定时器
+ offerLikesumAnimateTimer: 0, // offer点赞动画定时器
+ listlist: [],
+
+ tid: 0, // 帖子id
+ info: {},
+ type: 0, // 定位帖 1 面经 2 租房帖 3 总结 5 捷报 6
+ token: "",
+ offerinfo: {}, // offer捷报详情
+ offerinfoKey: [{
+ key: "schoolname",
+ name: "申请学校"
+ }, {
+ key: "degree",
+ name: "学位"
+ }, {
+ key: "professional",
+ name: "专业"
+ }, {
+ key: "project",
+ name: "项目"
+ }, {
+ key: "apply_results",
+ name: "申请结果"
+ }, {
+ key: "semester",
+ name: "入学学期"
+ }, {
+ key: "noticedate",
+ name: "通知时间"
+ }, {
+ key: "useperformanceStr",
+ name: "使用成绩"
+ }],
+ shareurl: "", // 分享链接
+ collegelist: [],// 总结里的 offer 列表数据
+
+
+ };
+ },
+
+ mounted() {
+ this.tid = this.$route.query['tid']
+ this.getDetail()
+
+ },
+
+ methods: {
+
+ // 获取详细信息
+ getDetail() {
+ this.$http.post("/api/thread", {
+ tid: this.tid
+ }).then(res => {
+ if (res.code != 200) return
+
+ let data = res.data
+ console.log("data", data);
+ this.info = data.info
+ this.type = data.type
+ this.token = data.token
+
+ if (this.type == 6) this.getOfferDetail()
+ else if (this.type == 5) this.getsummaryDetails()
+
+ })
+ },
+
+ // 获取offer详情
+ getOfferDetail() {
+ this.$http.post("/api/details", {
+ token: this.token
+ }, 'offer').then(res => {
+ let data = res.data
+ let offerinfo = data.offerinfo
+ let useperformanceStr = ""
+ offerinfo.useperformance && offerinfo.useperformance.forEach((el, index) => {
+ useperformanceStr += el + (offerinfo.useperformance.length - 1 == index ? '' : '、')
+ })
+
+ offerinfo['useperformanceStr'] = useperformanceStr
+ offerinfo['schoolname'] = offerinfo.school.name
+
+ this.offerinfo = offerinfo
+ this.shareurl = data.shareurl
+ })
+ },
+
+ // 获取总结详情
+ getsummaryDetails() {
+ this.$http.get(`/api/forum/details`, {
+ id: this.token
+ }, 'offer').then(res => {
+ let data = res.data
+ // console.log("data", data);
+ let collegelist = data.collegelist
+ console.log(collegelist);
+
+ // console.log("offercollege", offercollege);
+
+ collegelist.forEach((el, index) => {
+ let useperformanceStr = ""
+ el.useperformance && el.useperformance.forEach((el, index) => {
+ console.log(el);
+ // useperformanceStr += el + (el.useperformance.length - 1 == index ? '' : '、')
+ })
+ el['useperformanceStr'] = useperformanceStr
+
+ })
+
+ // let useperformanceStr = ""
+ // offerinfo.useperformance && offerinfo.useperformance.forEach((el, index) => {
+ // useperformanceStr += el + (offerinfo.useperformance.length - 1 == index ? '' : '、')
+ // })
+
+ // offerinfo['useperformanceStr'] = useperformanceStr
+ console.log(collegelist);
+
+ this.collegelist = collegelist
+ this.shareurl = data.shareurl
+ })
+ },
+
+
+ // 点击点赞
+ tapLike() {
+ this.isState = true
+ this.prepareLiskeState = true
+ this.prepareLiskeAnimateState = true
+
+ clearTimeout(this.offerLikesumTimer)
+ clearTimeout(this.offerLikesumAnimateTimer)
+
+ let praiseBubble = document.getElementById("praise_bubble");
+ console.log("praiseBubble", praiseBubble);
+ let last = 0;
+ let b = Math.floor(Math.random() * 8) + 1; // 1 到 7的 图片
+ // b = 1; // 测试写固定的
+ const bl = Math.floor(Math.random() * 11) + 1; // bl1~bl11
+ let d = document.createElement("div");
+ d.style.backgroundImage = `url('./img/bg${b}.png')`
+ d.style.backgroundSize = 'contain'
+ d.className = `bubble`;
+ // d.style.animation = `bubble_${bl} 1.5s linear 1 forwards, bubble_big_${Math.floor(Math.random() * 3) + 1} 0.8s linear 1 forwards, bubble_y 1.5s linear 1 forwards`
+
+ d.dataset.t = String(Date.now());
+ praiseBubble.appendChild(d);
+
+ // this.$forceUpdate()
+
+ this.stat.like++
+ this.prepareLiskeNum++
+ this.offerLikesumAnimateTimer = setTimeout(() => {
+ this.prepareLiskeAnimateState = false
+ }, 500)
+ this.offerLikesumTimer = setTimeout(() => {
+ this.ispostOfferLike = false
+ this.postOfferLike()
+ }, 2000)
+ },
+
+ postOfferLike() {
+ if (this.ispostOfferLike) return
+ this.ispostOfferLike = true
+
+ this.offerLikesum = 0
+
+ this.prepareLiskeState = false
+ let key = new Date().getTime() + ''
+ // let num = util.base64_encode(key + util.base64_encode(this.data.prepareLiskeNum + ''))
+
+
+
+ // util.wxpost("/miniprogramApi/offer/behaviour/like", {
+ // token: this.data.token,
+ // num,
+ // key
+ // }).then(res => {
+ // if (res.code != 200) return
+ // let data = res.data
+ // this.offerLikesum = 0
+ // }).finally(() => {
+ // this.setData({
+ // prepareLiskeState: false
+ // })
+ // })
+
+ },
+
+
+ // 点击转发
+ transmit() {
+ let value = location.href
+ this.$copy(value, "已经复制链接，欢迎分享！")
+ },
+
+ setValue(key, value) {
+ this[key] = value
+ },
+
+ // 收藏
+ postcollect() {
+ console.log("点击收藏");
+ }
+
+ },
+
+ components: {
+ DetailReply, Coins
+
+ }
+};
+</script>
+
+<style lang="scss" scoped>
+.container {
+ margin-top: 1.3rem;
+ padding-bottom: 2.8rem;
+
+ .aaa {
+ color: red;
+ }
+
+ .detail-head {
+ color: #7F7F7F;
+ padding: .191rem 0.2933rem 0;
+ justify-content: space-between;
+
+ .detail-section {
+ justify-content: space-between;
+ font-size: .32rem;
+
+ .section-name {
+ color: #333;
+ }
+ }
+
+ .detail-data {
+ color: rgb(127, 127, 127);
+
+ .detail-data-item {
+ color: rgb(127, 127, 127);
+ font-size: .28rem;
+
+ img {
+ margin-right: .12rem;
+ }
+
+ .detail-data-eye {
+ width: .36rem;
+ height: .36rem;
+ }
+
+ .detail-data-comment {
+ width: .32rem;
+ height: .32rem;
+ }
+
+ &:last-of-type {
+ margin-left: .32rem;
+ }
+ }
+ }
+ }
+
+ .detail-title-box {
+ padding: .72rem 0.2933rem 0;
+ color: #000;
+ font-size: .56rem;
+ font-weight: 650;
+
+ .detail-title-item {
+ font-size: .32rem;
+ color: #fff;
+ height: .64rem;
+ display: inline-flex;
+ margin-right: .16rem;
+ font-weight: 400;
+
+ &.detail-title-jinghua {
+ width: 1rem;
+ border-radius: .5rem .5rem 0;
+ background: linear-gradient(-57.3808deg, rgb(178, 152, 232) 0%, rgb(88, 70, 195) 100%);
+ }
+
+ &.detail-title-label {
+ background: rgb(51, 51, 51);
+ padding: 0 .16rem;
+ display: inline-flex;
+ border-radius: .16rem;
+
+
+ }
+
+ }
+
+ }
+
+ .card {
+ margin-top: .48rem;
+ flex-direction: column;
+
+ .card-item {
+ width: 9.4rem;
+ border-radius: .4rem;
+ background: #fff;
+ margin-bottom: .4rem;
+
+ .card-head {
+ padding: .48rem .32rem;
+ border-bottom: .0133rem solid #ebebeb;
+
+ .card-head-icon {
+ width: .96rem;
+ height: .96rem;
+ border-radius: 50%;
+ margin-right: .28rem;
+ }
+
+ .card-head-content {
+ flex-direction: column;
+
+ .card-head-name {
+ color: #333;
+ font-size: .32rem;
+ margin-bottom: .08rem;
+
+ .landlord {
+ color: rgb(127, 127, 127);
+ font-size: .26rem;
+ width: .64rem;
+ height: .44rem;
+ border: rgb(215, 215, 215) .0133rem solid;
+ background: rgb(240, 242, 245);
+ border-radius: .1rem;
+ margin-left: .16rem;
+ }
+ }
+
+ .card-head-time {
+ color: rgb(127, 127, 127);
+ font-size: .28rem;
+ }
+ }
+
+ .card-head-fool {
+ color: rgb(127, 127, 127);
+ font-size: .32rem;
+ }
+ }
+
+ .card-content {
+ color: #333;
+ font-size: .36rem;
+ line-height: .6rem;
+ padding: .5rem .32rem;
+
+ .quotation {
+ width: 100%;
+ color: #333;
+ font-size: .32rem;
+ border-radius: .16rem;
+ background: rgb(246, 246, 246);
+ padding: .36rem .24rem;
+ box-sizing: border-box;
+ margin-bottom: .48rem;
+
+ .quotation-wenzi {
+ line-height: .52rem;
+ }
+
+ .quotation-icon {
+ width: .32rem;
+ height: .26rem;
+ }
+
+ .quotation-right {
+ flex-direction: column;
+ margin-left: .28rem;
+
+ .quotation-bottom {
+ color: #7F7F7F;
+ font-size: .28rem;
+ margin-top: .258rem;
+
+ .quotation-icon {
+ margin-left: .2rem;
+ }
+ }
+ }
+ }
+
+ .content-unlock {
+ &.content-unlock-no {
+ height: 3.2rem;
+
+ .unlock-icom {
+ width: .64rem;
+ height: .64rem;
+ margin-right: 0.2rem;
+ }
+ }
+
+ 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;
+ }
+ }
+
+ }
+
+
+
+ }
+
+ .offer-content {
+ padding: .56rem .32rem;
+
+ .offer-content-box {
+
+
+ .offer-content-item {
+ line-height: .6rem;
+
+ &:not(:last-of-type) {
+ margin-bottom: .52rem;
+ }
+
+ .offer-content-key {
+ font-size: .32rem;
+ color: #7f7f7f;
+ width: 2.04rem;
+
+ }
+
+ .offer-content-value {
+ font-size: .36rem;
+ color: #333;
+ }
+
+
+
+ }
+ }
+
+ }
+
+ .examine-btn {
+ color: #333;
+ font-size: .3rem;
+ background: rgba(242, 242, 242, 1);
+ height: .96rem;
+ border-radius: 4.1rem;
+ margin-top: .52rem;
+
+ .examine-btn-outside {
+ width: .4rem;
+ height: .4rem;
+ margin-left: .24rem;
+ background: #fddf6d;
+ border-radius: 50%;
+
+ .examine-btn-icon {
+ width: .22rem;
+ height: .24rem;
+ }
+ }
+ }
+
+ .summary-content {
+ padding: .56rem .32rem;
+
+ .summary-content-item {
+ border-radius: .16rem;
+ border: .0133rem solid rgba(235, 235, 235, 1);
+ margin-bottom: .32rem;
+
+ .summary-offer-head {
+ justify-content: space-between;
+ height: .8rem;
+ background: rgba(246, 246, 246, 1);
+ color: #333;
+ padding: 0 .24rem;
+
+ span {
+ font-size: .32rem;
+ color: #333;
+ }
+
+ .summary-offer-head-title {
+ color: #000;
+ font-size: .4rem;
+ font-weight: 650;
+ }
+
+ .summary-offer-head-icon {
+ width: .14rem;
+ height: .36rem;
+ margin-left: .16rem;
+ }
+
+ }
+
+ .summary-offer-box {
+ padding-top: .28rem;
+ flex-direction: column;
+ justify-items: center;
+
+ .summary-offer-item {
+ line-height: .6rem;
+ padding: 0 .24rem;
+ box-sizing: border-box;
+ margin-bottom: .2rem;
+
+ .summary-offer-key {
+ width: 1.3rem;
+ color: #7f7f7f;
+ font-size: .32rem;
+ margin-right: .74rem;
+ }
+
+ .summary-offer-value {
+ font-size: .36rem;
+ color: #333;
+ }
+ }
+ }
+
+ .summary-wenzi {
+ color: #333;
+ font-size: .32rem;
+ line-height: .6rem;
+ padding: .28rem .24rem;
+ }
+
+ }
+ }
+
+
+
+ }
+ }
+
+ .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;
+ }
+ }
+ }
+
+ .discuss-bottom {
+ position: fixed;
+ bottom: 0;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 100vw;
+ background-color: #fff;
+ padding: 0 0.4rem;
+ box-sizing: border-box;
+ z-index: 99;
+ border-top: 0.0133rem solid #dbdcdd;
+ padding-right: 0;
+ height: 2rem;
+ width: 10rem;
+ justify-content: space-between;
+
+
+ .swiper {
+ height: 2rem;
+ }
+
+
+ .bottom-item {
+ justify-content: space-between;
+ height: 100%;
+
+ .bottom-comment {
+ width: 4.6rem;
+ height: 0.8rem;
+ border-radius: 1rem;
+ padding: 0 0.28rem;
+ font-size: 0.32rem;
+ color: #aaaaaa;
+ background-color: #f2f2f2;
+ border: 0.0133rem solid #ebebeb;
+ box-sizing: border-box;
+ position: relative;
+
+ .bottom-comment-icom {
+ width: 0.4rem;
+ height: 0.4rem;
+ margin-right: 0.16rem;
+ }
+
+ }
+
+ .bottom-operation-box {
+ width: 3.8667rem;
+ justify-content: space-between;
+ }
+
+ .bottom-operation-icom {
+ width: 0.48rem;
+ height: 0.48rem;
+ margin-bottom: 0.1333rem;
+ }
+
+ .bottom-operation-item {
+ position: relative;
+ padding: 0 0.4rem;
+ }
+
+ .bottom-operation-button {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-color: transparent;
+ padding: 0;
+ margin: 0;
+ border: none;
+ outline: none;
+
+ &::after {
+ border: none;
+ }
+ }
+
+ .bottom-transmit-icom {
+ width: 0.4rem;
+ height: 0.4rem;
+ }
+
+ .bottom-operation-text {
+ font-size: 0.32rem;
+ color: #555555;
+ }
+
+ .bottom-information {
+ position: relative;
+ min-width: 4.6667rem;
+ max-width: 53.3333rem;
+ height: 0.8rem;
+ border-radius: 1rem;
+ background: linear-gradient(to right, #fff, #50e3c2, #50e3c2, #50e3c2);
+ }
+
+ .bottom-information-avatar {
+ width: 0.8rem;
+ height: 0.8rem;
+ border-radius: 50%;
+ }
+
+ .bottom-information-content {
+ color: #fff;
+ font-size: 0.2933rem;
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ padding: 0 0.1333rem;
+
+ .vertical {
+ height: 0.2933rem;
+ background-color: #fff;
+ width: 0.0133rem;
+ }
+ }
+
+
+
+ .bottom-information-item:not(:last-of-type) {
+ justify-content: center;
+ }
+
+ }
+
+ .praise_bubble {
+ width: 50px;
+ height: 200px;
+ position: absolute;
+ bottom: 1.2rem;
+ background-color: transparent;
+
+ .bubble {
+ position: absolute;
+ width: 40px;
+ height: 40px;
+ left: 0;
+ bottom: 0px;
+ background-repeat: no-repeat;
+ background-size: 100%;
+ transform-origin: bottom;
+ }
+
+
+ }
+
+ }
+
+}
+
+@keyframes bubble_11 {
+ 25% {
+ margin-left: -10px;
+ }
+
+ 50% {
+ margin-left: -10px;
+ }
+
+ 100% {
+ margin-left: -18px;
+ }
+}
+
+@keyframes bubble_10 {
+ 25% {
+ margin-left: -20px;
+ }
+
+ 50% {
+ margin-left: -20px;
+ }
+
+ 100% {
+ margin-left: -20px;
+ }
+}
+
+@keyframes bubble_9 {
+ 25% {
+ margin-left: 10px;
+ }
+
+ 50% {
+ margin-left: 10px;
+ }
+
+ 100% {
+ margin-left: 10px;
+ }
+}
+
+@keyframes bubble_8 {
+ 25% {
+ margin-left: 20px;
+ }
+
+ 50% {
+ margin-left: 20px;
+ }
+
+ 100% {
+ margin-left: 20px;
+ }
+}
+
+@keyframes bubble_7 {
+ 25% {
+ margin-left: 3px;
+ }
+
+ 50% {
+ margin-left: 1px;
+ }
+
+ 75% {
+ margin-left: 2px;
+ }
+
+ 100% {
+ margin-left: 3px;
+ }
+}
+
+@keyframes bubble_6 {
+ 25% {
+ margin-left: -3px;
+ }
+
+ 50% {
+ margin-left: -1px;
+ }
+
+ 75% {
+ margin-left: -2px;
+ }
+
+ 100% {
+ margin-left: -3px;
+ }
+}
+
+@keyframes bubble_5 {
+ 25% {
+ margin-left: 5px;
+ }
+
+ 50% {
+ margin-left: -5px;
+ }
+
+ 75% {
+ margin-left: -10px;
+ }
+
+ 100% {
+ margin-left: -20px;
+ }
+}
+
+@keyframes bubble_4 {
+ 25% {
+ margin-left: -5px;
+ }
+
+ 50% {
+ margin-left: -5px;
+ }
+
+ 75% {
+ margin-left: 20px;
+ }
+
+ 100% {
+ margin-left: 10px;
+ }
+}
+
+@keyframes bubble_3 {
+ 25% {
+ margin-left: -20px;
+ }
+
+ 50% {
+ margin-left: 10px;
+ }
+
+ 75% {
+ margin-left: 20px;
+ }
+
+ 100% {
+ margin-left: -10px;
+ }
+}
+
+@keyframes bubble_2 {
+ 25% {
+ margin-left: 20px;
+ }
+
+ 50% {
+ margin-left: 25px;
+ }
+
+ 75% {
+ margin-left: 10px;
+ }
+
+ 100% {
+ margin-left: 5px;
+ }
+}
+
+@keyframes bubble_1 {
+ 25% {
+ margin-left: -8px;
+ }
+
+ 50% {
+ margin-left: 8px;
+ }
+
+ 75% {
+ margin-left: -15px;
+ }
+
+ 100% {
+ margin-left: 15px;
+ }
+}
+
+@keyframes bubble_big_1 {
+ 0% {
+ transform: scale(0.3);
+ }
+
+ 100% {
+ transform: scale(1.2);
+ }
+}
+
+@keyframes bubble_big_2 {
+ 0% {
+ transform: scale(0.3);
+ }
+
+ 100% {
+ transform: scale(0.9);
+ }
+}
+
+@keyframes bubble_big_3 {
+ 0% {
+ transform: scale(0.3);
+ }
+
+ 100% {
+ transform: scale(0.6);
+ }
+}
+
+@keyframes bubble_y {
+ 0% {
+ margin-bottom: 0;
+ }
+
+ 10% {
+ margin-bottom: 0;
+ }
+
+ 75% {
+ opacity: 1;
+ }
+
+ 100% {
+ margin-bottom: 200px;
+ opacity: 0;
+ }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/detail/detailIndex.vue b/src/views/detail/detailIndex.vue
index 4d8390e..23de242 100755
--- a/src/views/detail/detailIndex.vue
+++ b/src/views/detail/detailIndex.vue
@@ -4,24 +4,24 @@
<div class="detail-section">版块：<span class="section-name">香港澳门台湾留学申请</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 }}
+ <img class="detail-data-eye" src="@/assets/img/detail/eye.png">10378
</div>
<div class="detail-data-item flexacenter">
- <img class="detail-data-comment" src="@/assets/img/detail/comment.png">{{ info.replies }}
+ <img class="detail-data-comment" src="@/assets/img/detail/comment.png">16
</div>
</div>
</div>
<div class="detail-title-box">
- <div class="detail-title-item detail-title-jinghua flexcenter" v-if="info.digest > 0">精华</div>
- <div class="detail-title-item detail-title-label flexcenter" v-if="info.typename">{{ info.typename }}</div>
- {{ info.subject }}
+ <div class="detail-title-item detail-title-jinghua flexcenter">精华</div>
+ <div class="detail-title-item detail-title-label flexcenter">生活贴士</div>
+ 香港永久居民的申请步骤和过程
</div>
<!-- -->
<div class="card flexcenter">
- <!-- 总结开始 -->
- <div class="card-item shadow" v-if="type == 5">
+ <!-- 总结 -->
+ <div class="card-item shadow">
<div class="card-head flexacenter">
<img class="card-head-icon"
src="https://axure-file.lanhuapp.com/md516b251fb-9cfa-46fc-a9b6-2a41a7b4dc37__3ad73406ff4bc8b138dafc6dcbf1a635.svg" />
@@ -34,101 +34,52 @@
<div class="summary-content">
<div class="summary-content-item">
<div class="summary-offer-head flexacenter">
- <span class="summary-offer-head-title">Offer 1</span>
+ <span class="summary-offer-head-title">Offer1</span>
<span class="flexacenter">详情<svg-icon icon-class="arrowsBlackLeft"
class-name="summary-offer-head-icon"></svg-icon></span>
</div>
- <div class="summary-offer-box">
- <div class="summary-offer-item flexacenter">
- <div class="summary-offer-key flexacenter">
- 申请学校
- </div>
- <div class="summary-offer-value flexacenter">
- 韦仕敦大学
- </div>
- </div>
- <div class="summary-offer-item flexacenter">
- <div class="summary-offer-key flexacenter">
- 学位
- </div>
- <div class="summary-offer-value flexacenter">
- MA
- </div>
- </div>
- <div class="summary-offer-item flexacenter">
- <div class="summary-offer-key flexacenter">
- 专业
- </div>
- <div class="summary-offer-value flexacenter">
- Curriculum study
- </div>
- </div>
- </div>
-
- </div>
- <div class="summary-content-item">
- <div class="summary-offer-head flexacenter">
- <span class="summary-offer-head-title">总结</span>
- <span class="flexacenter">详情<svg-icon icon-class="arrowsBlackLeft"
- class-name="summary-offer-head-icon"></svg-icon></span>
- </div>
- <div class="summary-wenzi">
- guelph教授很好一直在帮忙催offer，现在uvic也出了口头offer，可能要纠结一下...
-
- mcgill拒了算是意料之中吧
-
- ottawa没搞懂申请的thesis下来了course...
-
- calgary突然就来了offer，又陷入纠结了..
- </div>
-
</div>
<div class="examine-btn flexcenter">
- 查看当前总结详情
+ 查看当前捷报详情
<div class="examine-btn-outside flexcenter">
<svg-icon icon-class="arrowsRoundBlackLeft" class-name="examine-btn-icon"></svg-icon>
</div>
</div>
</div>
</div>
- <!-- 总结结束 -->
+
<!-- offer -->
- <div class="card-item shadow" v-if="type == 6">
+ <div class="card-item shadow">
<div class="card-head flexacenter">
- <img class="card-head-icon" :src="info.avatar" />
+ <img class="card-head-icon"
+ src="https://axure-file.lanhuapp.com/md516b251fb-9cfa-46fc-a9b6-2a41a7b4dc37__3ad73406ff4bc8b138dafc6dcbf1a635.svg" />
<div class="card-head-content flex1 flexflex">
- <div class="card-head-name flexflex">{{ info.author }}</div>
- <div class="card-head-time">{{ $formattedDate(info.dateline) }}</div>
+ <div class="card-head-name flexflex">闫旭Mike</div>
+ <div class="card-head-time">2022-7-6 14:56</div>
</div>
<div class="card-head-fool">楼主</div>
</div>
<div class="offer-content">
<div class="offer-content-box">
- <template v-for="(item, index) in offerinfoKey">
- <div class="offer-content-item flexacenter" :key="index" v-if="offerinfo[item.key]">
- <div class="offer-content-key" v-if="offerinfo[item.key]">{{ item.name }}</div>
- <div class="offer-content-value">{{ offerinfo[item.key] }}</div>
- </div>
- </template>
- <!-- <div class="offer-content-item flexacenter" v-for="item in 7" :key="item">
+ <div class="offer-content-item flexacenter" v-for="item in 7" :key="item">
<div class="offer-content-key">申请专业</div>
<div class="offer-content-value">韦仕敦大学</div>
- </div> -->
+ </div>
</div>
- <a class="examine-btn flexcenter" :href="shareurl">
+ <div class="examine-btn flexcenter">
查看当前捷报详情
<div class="examine-btn-outside flexcenter">
<svg-icon icon-class="arrowsRoundBlackLeft" class-name="examine-btn-icon"></svg-icon>
</div>
- </a>
+ </div>
</div>
</div>
- <!-- offer结束 -->
+
<div class="card-item shadow" v-for="(item, index) in 7" :key="index">
<div class="card-head flexacenter">
@@ -240,6 +191,7 @@
</div>
</div>
+
<detail-reply :two-comment-data="twoCommentData" :pop-state="popState"></detail-reply>
<coins :coin-config="coinConfig" :pop-state="popState"></coins>
</div>
@@ -265,6 +217,11 @@ export default {
}
},
+ info: {
+ avatar: "https://oss.gter.net/avatar/97KwEWANd_4DHWiY6VbnSUFSCKroYWFjYQ~~/middle",
+ likenum: 1
+ },
+
islogin: true,
prepareLiskeState: false,
prepareLiskeAnimateState: false,
@@ -276,127 +233,15 @@ export default {
ispostOfferLike: null, // 点击点赞提交状态
offerLikesumTimer: 0, // offer点赞累加定时器
offerLikesumAnimateTimer: 0, // offer点赞动画定时器
- listlist: [],
-
- tid: 0, // 帖子id
- info: {},
- type: 0, // 定位帖 1 面经 2 租房帖 3 总结 5 捷报 6
- token: "",
- offerinfo: {}, // offer捷报详情
- offerinfoKey: [{
- key: "schoolname",
- name: "申请学校"
- }, {
- key: "degree",
- name: "学位"
- }, {
- key: "professional",
- name: "专业"
- }, {
- key: "project",
- name: "项目"
- }, {
- key: "apply_results",
- name: "申请结果"
- }, {
- key: "semester",
- name: "入学学期"
- }, {
- key: "noticedate",
- name: "通知时间"
- }, {
- key: "useperformanceStr",
- name: "使用成绩"
- }],
- shareurl: "", // 分享链接
- collegelist: [],// 总结里的 offer 列表数据
-
-
+ listlist: []
};
},
mounted() {
- this.tid = this.$route.query['tid']
- this.getDetail()
-
},
methods: {
-
- // 获取详细信息
- getDetail() {
- this.$http.post("/api/thread", {
- tid: this.tid
- }).then(res => {
- if (res.code != 200) return
-
- let data = res.data
- console.log("data", data);
- this.info = data.info
- this.type = data.type
- this.token = data.token
-
- if (this.type == 6) this.getOfferDetail()
- else if (this.type == 5) this.getsummaryDetails()
-
- })
- },
-
- // 获取offer详情
- getOfferDetail() {
- this.$http.post("/api/details", {
- token: this.token
- }, 'offer').then(res => {
- let data = res.data
- let offerinfo = data.offerinfo
- let useperformanceStr = ""
- offerinfo.useperformance && offerinfo.useperformance.forEach((el, index) => {
- useperformanceStr += el + (offerinfo.useperformance.length - 1 == index ? '' : '、')
- })
-
- offerinfo['useperformanceStr'] = useperformanceStr
- offerinfo['schoolname'] = offerinfo.school.name
-
- this.offerinfo = offerinfo
- this.shareurl = data.shareurl
- })
- },
-
- // 获取总结详情
- getsummaryDetails() {
- this.$http.get(`/api/forum/details`, {
- id: this.token
- }, 'offer').then(res => {
- let data = res.data
- // console.log("data", data);
- let collegelist = data.collegelist
- console.log(collegelist);
-
- // console.log("offercollege", offercollege);
-
- collegelist.forEach((el, index) => {
- let useperformanceStr = ""
- el.useperformance && el.useperformance.forEach((el, index) => {
- console.log(el);
- // useperformanceStr += el + (el.useperformance.length - 1 == index ? '' : '、')
- })
- el['useperformanceStr'] = useperformanceStr
-
- })
-
- // let useperformanceStr = ""
- // offerinfo.useperformance && offerinfo.useperformance.forEach((el, index) => {
- // useperformanceStr += el + (offerinfo.useperformance.length - 1 == index ? '' : '、')
- // })
-
- // offerinfo['useperformanceStr'] = useperformanceStr
- console.log(collegelist);
-
- this.collegelist = collegelist
- this.shareurl = data.shareurl
- })
- },
-
+ // 点击点赞
// 点击点赞
tapLike() {
@@ -771,7 +616,6 @@ export default {
.summary-content-item {
border-radius: .16rem;
border: .0133rem solid rgba(235, 235, 235, 1);
- margin-bottom: .32rem;
.summary-offer-head {
justify-content: space-between;
@@ -799,38 +643,6 @@ export default {
}
- .summary-offer-box {
- padding-top: .28rem;
- flex-direction: column;
- justify-items: center;
-
- .summary-offer-item {
- line-height: .6rem;
- padding: 0 .24rem;
- box-sizing: border-box;
- margin-bottom: .2rem;
-
- .summary-offer-key {
- width: 1.3rem;
- color: #7f7f7f;
- font-size: .32rem;
- margin-right: .74rem;
- }
-
- .summary-offer-value {
- font-size: .36rem;
- color: #333;
- }
- }
- }
-
- .summary-wenzi {
- color: #333;
- font-size: .32rem;
- line-height: .6rem;
- padding: .28rem .24rem;
- }
-
}
}
diff --git a/src/views/search/searchResult/SearchResult-冲突-肖荣豪_Win10.vue b/src/views/search/searchResult/SearchResult-冲突-肖荣豪_Win10.vue
new file mode 100755
index 0000000..7733e26
--- /dev/null
+++ b/src/views/search/searchResult/SearchResult-冲突-肖荣豪_Win10.vue
@@ -0,0 +1,332 @@
+<template>
+ <div class="container">
+ <!-- 搜索框 -->
+ <div class="search-input-box flexacenter">
+ <div class="search-input flexacenter">
+ <img class="search-input-icon" src="@/assets/img/headerNav/search.png">
+ <input class="search-input-input flex1" @keyup.enter="getSearchResult()" placeholder="请输入搜索关键词"
+ v-model="kw" />
+ <img class="search-input-cross" @click.stop="emptyKw()" src="@/assets/img/icon/clear.png">
+ </div>
+
+ <div class="search-input-cancel" @click.stop="handCancel">取消</div>
+ </div>
+
+ <!-- 结果数量 -->
+ <div class="numberResults flexacenter">大约找到 <div class="number">{{ count }}</div> 条结果</div>
+
+ <div class="result-box flexacenter" v-if="list.length != 0 || loading">
+ <div class="result-item flexflex" v-for="(item, index) in list" :key="index">
+ <div class="result-header one-line">
+ <div class="result-label">{{ item.forum }}</div>
+ <!-- <div class="result-title">{{ item.subject }}</div> -->
+ <div class="result-title" v-html="item.subject"></div>
+ </div>
+
+ <div class="result-content two-lines" v-html="item.message"></div>
+
+ <div class="result-info flexacenter flex1">
+ <div class="user-info flexacenter">
+ <img class="icon-head" :src="item.avatar">
+ <div class="user-name">{{ item.author }}</div>
+ </div>
+ <div class="item-data flexacenter">
+ <div class="item-data-item flexacenter">
+ <svg-icon icon-class="look" class-name="icon-look"></svg-icon>
+ <div>{{ item.views }}</div>
+ </div>
+ <div class="item-data-item flexacenter">
+ <svg-icon icon-class="msg" class-name="icon-msg"></svg-icon>
+ <div>{{ item.replies }}</div>
+ </div>
+ </div>
+ </div>
+
+
+ <!-- 精华 -->
+ <div class="rightTop" v-if="item.digest > 0">
+ <img class="rightTop-img" src="@/assets/img/icon/topRight .png">
+ <span>精华</span>
+ </div>
+
+ </div>
+ </div>
+
+ <div class="result-empty-box flexcenter shadow" v-else>
+ <img class="result-empty-icon" src="@/assets/img/icon/empty.png">
+ </div>
+
+ <div v-if="list.length != 0" 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>
+
+ </div>
+</template>
+
+<script>
+export default {
+ name: "SearchResult",
+ data() {
+ return {
+ kw: "",
+ count: 0,
+ limit: 4,
+ nextpage: true,
+ page: 1,
+ list: [],
+ searchResultState: false,
+ loading: null
+ }
+ },
+ components: {
+
+ },
+
+ mounted() {
+ this.kw = this.$route.query.kw
+ this.getSearchResult()
+ },
+
+ watch: {
+ searchResultState(val, oldval) {
+ if (val) this.$startupUnderLoading(this)
+ else this.$closeUnderLoading(this)
+ }
+ },
+
+
+ methods: {
+ // 处理点击取消的返回上一页
+ handCancel() {
+ console.log(this);
+ if (this.$route.params.page > 1) this.$router.go(-1)
+ else this.$router.push('/recommend')
+ },
+
+ // 获取搜索结果数据
+ getSearchResult() {
+ if (this.searchResultState) return
+ this.searchResultState = true
+ this.$http.post("/api/search", {
+ keyword: this.kw,
+ page: this.page,
+ limit: this.limit
+ }).then(res => {
+ console.log(res, "res");
+ let data = res.data
+ this.list = data.data
+ this.count = data.count
+
+ document.documentElement.scrollTop = 0;
+ document.body.scrollTop = 0;
+ this.searchResultState = false
+ })
+ },
+
+ // 点击改变页数
+ currentChange() {
+ this.getSearchResult()
+ },
+
+
+
+ // 点击清空 input 的值
+ emptyKw() {
+ this.kw = ""
+ },
+
+ },
+}
+</script>
+
+<style lang="scss" scoped>
+.container {
+ padding-top: 1.3rem;
+ padding-bottom: 1.3rem;
+
+ .search-input-box {
+ margin-left: .32rem;
+
+ .search-input {
+ width: 8.2rem;
+ height: .96rem;
+ border-radius: 2.56rem;
+ background: rgba(235, 235, 235, 1);
+
+ .search-input-icon,
+ .search-input-cross {
+ width: .4rem;
+ height: .4rem;
+ }
+
+ .search-input-icon {
+ padding: 0 .4rem;
+ }
+
+ .search-input-cross {
+ padding-right: .4rem;
+ }
+
+ .search-input-input {
+ height: 100%;
+ }
+
+ }
+
+ .search-input-cancel {
+ color: #000;
+ font-size: .36rem;
+ padding-left: .46rem;
+ width: .74rem;
+ }
+ }
+
+ .numberResults {
+ font-size: .32rem;
+ color: #555;
+ // margin-top: .64rem;
+ margin: .64rem .32rem .48rem;
+
+ .number {
+ color: #000;
+ font-weight: 650;
+ margin: 0 .1667rem;
+ }
+ }
+
+ .result-box {
+ justify-content: center;
+ flex-direction: column;
+
+ .result-item {
+ margin-bottom: .32rem;
+ width: 9.36rem;
+ height: 3.96rem;
+ background-color: rgba(255, 255, 255, 1);
+ border: none;
+ border-radius: .32rem;
+ -moz-box-shadow: 0 0 .16rem rgba(0, 0, 0, 0.0784313725490196);
+ -webkit-box-shadow: 0 0 .16rem rgba(0, 0, 0, 0.08);
+ box-shadow: 0 0 .16rem rgba(0, 0, 0, .08);
+ padding: 0.4rem;
+ box-sizing: border-box;
+ flex-direction: column;
+ position: relative;
+
+ .result-header {
+ margin-bottom: .32rem;
+
+ .result-label {
+ font-size: .28rem;
+ height: .52rem;
+ line-height: .52rem;
+ background: rgb(51, 51, 51);
+ color: #fff;
+ display: inline-block;
+ border-radius: .16rem;
+ padding: 0 .12rem;
+ margin-right: .12rem;
+ }
+
+ .result-title {
+ color: #000;
+ font-size: 0.37333rem;
+ line-height: 0.65rem;
+ display: inline;
+ }
+
+ }
+
+ .result-content {
+ line-height: .52rem;
+ font-size: .3rem;
+ color: #7f7f7f;
+ height: 1.04rem;
+ }
+
+ .reply-visible {
+ font-size: .32rem;
+ height: 1.04rem;
+ background: rgba(242, 242, 242, 0.7);
+ }
+
+ .result-info {
+ align-items: self-end;
+
+ justify-content: space-between;
+
+ .user-info {
+ .icon-head {
+ width: .64rem;
+ height: .64rem;
+ border-radius: 50%;
+ }
+
+ .user-name {
+ font-size: .32rem;
+ color: #333;
+ margin-left: .2rem;
+ }
+ }
+
+ .item-data {
+
+ font-size: .28rem;
+
+ .item-data-item {
+
+ &:last-of-type {
+ margin-left: .4rem;
+ }
+
+ .icon-look {
+ width: .4267rem;
+ height: .18rem;
+ margin-right: .16rem;
+ }
+
+ .icon-msg {
+ width: .32rem;
+ height: .28rem;
+ margin-right: .16rem;
+ }
+ }
+ }
+ }
+
+ }
+ }
+
+ .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;
+ }
+ }
+ }
+
+ .result-empty-box {
+ height: 70vh;
+ width: 9.36rem;
+ background: #fff;
+ margin: 0 auto;
+ border-radius: 0.32rem;
+
+ .result-empty-icon {
+ width: 2.04rem;
+ height: 2.4rem;
+ }
+ }
+
+}
+</style>
diff --git a/src/views/search/searchResult/SearchResult.vue b/src/views/search/searchResult/SearchResult.vue
index 7733e26..695b1af 100755
--- a/src/views/search/searchResult/SearchResult.vue
+++ b/src/views/search/searchResult/SearchResult.vue
@@ -4,61 +4,64 @@
<div class="search-input-box flexacenter">
<div class="search-input flexacenter">
<img class="search-input-icon" src="@/assets/img/headerNav/search.png">
- <input class="search-input-input flex1" @keyup.enter="getSearchResult()" placeholder="请输入搜索关键词"
- v-model="kw" />
- <img class="search-input-cross" @click.stop="emptyKw()" src="@/assets/img/icon/clear.png">
+ <input class="search-input-input flex1" placeholder="请输入搜索关键词" />
+ <img class="search-input-cross" src="@/assets/img/icon/clear.png">
</div>
<div class="search-input-cancel" @click.stop="handCancel">取消</div>
</div>
<!-- 结果数量 -->
- <div class="numberResults flexacenter">大约找到 <div class="number">{{ count }}</div> 条结果</div>
+ <div class="numberResults flexacenter">大约找到 <div class="number">{{ 800 }}</div> 条结果</div>
- <div class="result-box flexacenter" v-if="list.length != 0 || loading">
- <div class="result-item flexflex" v-for="(item, index) in list" :key="index">
+ <div class="result-box flexacenter">
+ <div class="result-item flexflex" v-for="item in 3" :key="item">
<div class="result-header one-line">
- <div class="result-label">{{ item.forum }}</div>
- <!-- <div class="result-title">{{ item.subject }}</div> -->
- <div class="result-title" v-html="item.subject"></div>
+ <div class="result-label">租房租房租房</div>
+ <div class="result-title">诚招室友一起合租香港大学附近房子 女生</div>
</div>
- <div class="result-content two-lines" v-html="item.message"></div>
+ <div class="result-content two-lines flex1">
+ <template v-if="item == 1">
+ 香港理工大学附近求租房，红磡何文田或黄埔附近最好
+ </template>
- <div class="result-info flexacenter flex1">
+ <div v-else class="reply-visible flexcenter">
+ 回复可见
+ </div>
+ </div>
+
+
+ <div class="result-info flexacenter">
<div class="user-info flexacenter">
- <img class="icon-head" :src="item.avatar">
- <div class="user-name">{{ item.author }}</div>
+ <svg-icon icon-class="test-head" class-name="icon-head"></svg-icon>
+ <div class="user-name">匿名用户</div>
</div>
<div class="item-data flexacenter">
<div class="item-data-item flexacenter">
<svg-icon icon-class="look" class-name="icon-look"></svg-icon>
- <div>{{ item.views }}</div>
+ <div>1552</div>
</div>
<div class="item-data-item flexacenter">
<svg-icon icon-class="msg" class-name="icon-msg"></svg-icon>
- <div>{{ item.replies }}</div>
+ <div>12</div>
</div>
</div>
</div>
<!-- 精华 -->
- <div class="rightTop" v-if="item.digest > 0">
+ <div class="rightTop">
<img class="rightTop-img" src="@/assets/img/icon/topRight .png">
<span>精华</span>
</div>
</div>
+
</div>
- <div class="result-empty-box flexcenter shadow" v-else>
- <img class="result-empty-icon" src="@/assets/img/icon/empty.png">
- </div>
-
- <div v-if="list.length != 0" class="paging flexcenter">
- <el-pagination small background layout="prev, pager, next" @current-change="currentChange"
- :current-page.sync="page" :page-size="limit" :total="count">
+ <div class="paging flexcenter">
+ <el-pagination small background layout="prev, pager, next" :total="1000">
</el-pagination>
</div>
@@ -70,33 +73,13 @@ export default {
name: "SearchResult",
data() {
return {
- kw: "",
- count: 0,
- limit: 4,
- nextpage: true,
- page: 1,
- list: [],
- searchResultState: false,
- loading: null
+
}
},
components: {
},
- mounted() {
- this.kw = this.$route.query.kw
- this.getSearchResult()
- },
-
- watch: {
- searchResultState(val, oldval) {
- if (val) this.$startupUnderLoading(this)
- else this.$closeUnderLoading(this)
- }
- },
-
-
methods: {
// 处理点击取消的返回上一页
handCancel() {
@@ -104,39 +87,6 @@ export default {
if (this.$route.params.page > 1) this.$router.go(-1)
else this.$router.push('/recommend')
},
-
- // 获取搜索结果数据
- getSearchResult() {
- if (this.searchResultState) return
- this.searchResultState = true
- this.$http.post("/api/search", {
- keyword: this.kw,
- page: this.page,
- limit: this.limit
- }).then(res => {
- console.log(res, "res");
- let data = res.data
- this.list = data.data
- this.count = data.count
-
- document.documentElement.scrollTop = 0;
- document.body.scrollTop = 0;
- this.searchResultState = false
- })
- },
-
- // 点击改变页数
- currentChange() {
- this.getSearchResult()
- },
-
-
-
- // 点击清空 input 的值
- emptyKw() {
- this.kw = ""
- },
-
},
}
</script>
@@ -144,7 +94,6 @@ export default {
<style lang="scss" scoped>
.container {
padding-top: 1.3rem;
- padding-bottom: 1.3rem;
.search-input-box {
margin-left: .32rem;
@@ -243,7 +192,6 @@ export default {
line-height: .52rem;
font-size: .3rem;
color: #7f7f7f;
- height: 1.04rem;
}
.reply-visible {
@@ -253,7 +201,6 @@ export default {
}
.result-info {
- align-items: self-end;
justify-content: space-between;
@@ -261,7 +208,6 @@ export default {
.icon-head {
width: .64rem;
height: .64rem;
- border-radius: 50%;
}
.user-name {
@@ -284,13 +230,11 @@ export default {
.icon-look {
width: .4267rem;
height: .18rem;
- margin-right: .16rem;
}
.icon-msg {
width: .32rem;
height: .28rem;
- margin-right: .16rem;
}
}
}
@@ -315,18 +259,5 @@ export default {
}
}
- .result-empty-box {
- height: 70vh;
- width: 9.36rem;
- background: #fff;
- margin: 0 auto;
- border-radius: 0.32rem;
-
- .result-empty-icon {
- width: 2.04rem;
- height: 2.4rem;
- }
- }
-
}
</style>
diff --git a/src/views/search/searchResult/SearchResult_DESKTOP-6MA514B_3月-31-231138-2023_Conflict.vue b/src/views/search/searchResult/SearchResult_DESKTOP-6MA514B_3月-31-231138-2023_Conflict.vue
new file mode 100755
index 0000000..03656f4
--- /dev/null
+++ b/src/views/search/searchResult/SearchResult_DESKTOP-6MA514B_3月-31-231138-2023_Conflict.vue
@@ -0,0 +1,267 @@
+<template>
+ <div class="container">
+ <!-- 搜索框 -->
+ <div class="search-input-box flexacenter">
+ <div class="search-input flexacenter">
+ <img class="search-input-icon" src="@/assets/img/headerNav/search.png">
+ <input class="search-input-input flex1" placeholder="请输入搜索关键词" />
+ <img class="search-input-cross" src="@/assets/img/icon/clear.png">
+ </div>
+
+ <div class="search-input-cancel" @click.stop="handCancel">取消</div>
+ </div>
+
+ <!-- 结果数量 -->
+ <div class="numberResults flexacenter">大约找到 <div class="number">{{ 800 }}</div> 条结果</div>
+
+ <div class="result-box flexacenter">
+ <div class="result-item flexflex" v-for="item in 3" :key="item">
+ <div class="result-header one-line">
+ <div class="result-label">租房租房租房</div>
+ <div class="result-title">诚招室友一起合租香港大学附近房子 女生</div>
+ </div>
+
+ <div class="result-content two-lines flex1">
+ <template v-if="item == 1">
+ 香港理工大学附近求租房，红磡何文田或黄埔附近最好
+ </template>
+
+ <div v-else class="reply-visible flexcenter">
+ 回复可见
+ </div>
+ </div>
+
+
+ <div class="result-info flexacenter">
+ <div class="user-info flexacenter">
+ <svg-icon icon-class="test-head" class-name="icon-head"></svg-icon>
+ <div class="user-name">匿名用户</div>
+ </div>
+ <div class="item-data flexacenter">
+ <div class="item-data-item flexacenter">
+ <svg-icon icon-class="look" class-name="icon-look"></svg-icon>
+ <div>1552</div>
+ </div>
+ <div class="item-data-item flexacenter">
+ <svg-icon icon-class="msg" class-name="icon-msg"></svg-icon>
+ <div>12</div>
+ </div>
+ </div>
+ </div>
+
+
+ <!-- 精华 -->
+ <div class="rightTop">
+ <img class="rightTop-img" src="@/assets/img/icon/topRight .png">
+ <span>精华</span>
+ </div>
+
+ </div>
+
+ </div>
+
+ <div class="paging flexcenter">
+ <el-pagination small background layout="prev, pager, next" :total="1000">
+ </el-pagination>
+ </div>
+
+ </div>
+</template>
+
+<script>
+export default {
+ name: "SearchResult",
+ data() {
+ return {
+
+ }
+ },
+ components: {
+
+ },
+
+ methods: {
+ // 处理点击取消的返回上一页
+ handCancel() {
+ if (this.$route.fullPath != "/") this.$router.go(-1)
+ else this.$router.push('/recommend')
+ },
+ },
+}
+</script>
+
+<style lang="scss" scoped>
+.container {
+ padding-top: 1.3rem;
+
+ .search-input-box {
+ margin-left: .32rem;
+
+ .search-input {
+ width: 8.2rem;
+ height: .96rem;
+ border-radius: 2.56rem;
+ background: rgba(235, 235, 235, 1);
+
+ .search-input-icon,
+ .search-input-cross {
+ width: .4rem;
+ height: .4rem;
+ }
+
+ .search-input-icon {
+ padding: 0 .4rem;
+ }
+
+ .search-input-cross {
+ padding-right: .4rem;
+ }
+
+ .search-input-input {
+ height: 100%;
+ background: transparent;
+ border: none;
+ outline: none;
+ }
+
+ }
+
+ .search-input-cancel {
+ color: #000;
+ font-size: .36rem;
+ padding-left: .46rem;
+ width: .74rem;
+ }
+ }
+
+ .numberResults {
+ font-size: .32rem;
+ color: #555;
+ // margin-top: .64rem;
+ margin: .64rem .32rem .48rem;
+
+ .number {
+ color: #000;
+ font-weight: 650;
+ margin: 0 .1667rem;
+ }
+ }
+
+ .result-box {
+ justify-content: center;
+ flex-direction: column;
+
+ .result-item {
+ margin-bottom: .32rem;
+ width: 9.36rem;
+ height: 3.96rem;
+ background-color: rgba(255, 255, 255, 1);
+ border: none;
+ border-radius: .32rem;
+ -moz-box-shadow: 0 0 .16rem rgba(0, 0, 0, 0.0784313725490196);
+ -webkit-box-shadow: 0 0 .16rem rgba(0, 0, 0, 0.08);
+ box-shadow: 0 0 .16rem rgba(0, 0, 0, .08);
+ padding: 0.4rem;
+ box-sizing: border-box;
+ flex-direction: column;
+ position: relative;
+
+ .result-header {
+ margin-bottom: .32rem;
+
+ .result-label {
+ font-size: .28rem;
+ height: .52rem;
+ line-height: .52rem;
+ background: rgb(51, 51, 51);
+ color: #fff;
+ display: inline-block;
+ border-radius: .16rem;
+ padding: 0 .12rem;
+ margin-right: .12rem;
+ }
+
+ .result-title {
+ color: #000;
+ font-size: 0.37333rem;
+ line-height: 0.65rem;
+ display: inline;
+ }
+
+ }
+
+ .result-content {
+ line-height: .52rem;
+ font-size: .3rem;
+ color: #7f7f7f;
+ }
+
+ .reply-visible {
+ font-size: .32rem;
+ height: 1.04rem;
+ background: rgba(242, 242, 242, 0.7);
+ }
+
+ .result-info {
+
+ justify-content: space-between;
+
+ .user-info {
+ .icon-head {
+ width: .64rem;
+ height: .64rem;
+ }
+
+ .user-name {
+ font-size: .32rem;
+ color: #333;
+ margin-left: .2rem;
+ }
+ }
+
+ .item-data {
+
+ font-size: .28rem;
+
+ .item-data-item {
+
+ &:last-of-type {
+ margin-left: .4rem;
+ }
+
+ .icon-look {
+ width: .4267rem;
+ height: .18rem;
+ }
+
+ .icon-msg {
+ width: .32rem;
+ height: .28rem;
+ }
+ }
+ }
+ }
+
+ }
+ }
+
+ .paging {
+ // width: 6.44rem;
+ 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;
+ }
+ }
+ }
+
+
+}
+</style>
diff --git a/src/views/user/UserIndex-冲突-肖荣豪_Win10.vue b/src/views/user/UserIndex-冲突-肖荣豪_Win10.vue
new file mode 100755
index 0000000..a8153eb
--- /dev/null
+++ b/src/views/user/UserIndex-冲突-肖荣豪_Win10.vue
@@ -0,0 +1,309 @@
+<template>
+ <div class="container">
+ <div class="header flexcenter flexcolumn">
+ <div class="portrait flexcenter shadow">
+ <img class="portrait-icom" :src="user.avatar" />
+ </div>
+ <div class="header-username flexacenter">{{ user.nickname }}</div>
+ </div>
+
+ <!-- 数据展示板 -->
+ <div class="operation-box shadow data-presentation flexflex">
+ <div class="data-presentation-item flex1 flexcenter">
+ <div class="data-presentation-number">{{ count.prestige }}</div>
+ <div class="data-presentation-name">声望</div>
+ </div>
+ <div class="data-presentation-item flex1 flexcenter">
+ <div class="data-presentation-number">{{ count.gtercurrency }}</div>
+ <div class="data-presentation-name">寄托币</div>
+ </div>
+ <div class="data-presentation-item flex1 flexcenter">
+ <div class="data-presentation-number">{{ count.digest }}</div>
+ <div class="data-presentation-name">精华</div>
+ </div>
+ </div>
+
+ <div class="operation-box shadow">
+ <div class="operation-item flexacenter">
+ <div class="operation-left flexacenter">
+ <img class="operation-icom" mode="widthFix" src="@/assets/img/user/information.png">消息
+ </div>
+ <div class="operation-right flexacenter">
+ <div v-if="user.messagenum == 0" class="operation-data flexcenter">{{ count.message }}</div>
+ <div v-else class="unread-info flexcenter">{{ user.messagenum }}</div>
+ <svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
+ </div>
+ </div>
+
+ <div class="operation-item flexacenter">
+ <div class="operation-left flexacenter">
+ <img class="operation-icom" mode="widthFix" src="@/assets/img/user/collect.png">收藏
+ </div>
+ <div class="operation-right flexacenter">
+ <div class="operation-data flexcenter">{{ count.fav }}</div>
+ <svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
+ </div>
+ </div>
+ <div class="operation-item flexacenter">
+ <div class="operation-left flexacenter">
+ <img class="operation-icom" src="@/assets/img/user/postmessage.png" />发帖
+ </div>
+ <div class="operation-right flexacenter">
+ <div class="operation-data flexcenter">{{ count.post }}</div>
+ <svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
+ </div>
+ </div>
+ <div class="operation-item flexacenter">
+ <div class="operation-left flexacenter">
+ <img class="operation-icom" mode="widthFix" src="@/assets/img/user/replymessage.png" />回帖
+ </div>
+ <div class="operation-right flexacenter">
+ <div class="operation-data flexcenter">{{ count.reply }}</div>
+ <svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
+ </div>
+ </div>
+ </div>
+
+ <div class="operation-box shadow">
+ <div class="operation-item flexacenter">
+ <div class="operation-left flexacenter">
+ <img class="operation-icom" mode="widthFix" src="@/assets/img/user/personaldata.png">个人资料
+ </div>
+ <div class="operation-right flexacenter">
+ <svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
+ </div>
+ </div>
+ <div class="operation-item flexacenter">
+ <div class="operation-left flexacenter">
+ <img class="operation-icom" src="@/assets/img/user/avatarsetting.png" />设置头像
+ </div>
+ <div class="operation-right flexacenter">
+ <svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
+ </div>
+ </div>
+ <div class="operation-item flexacenter">
+ <div class="operation-left flexacenter">
+ <img class="operation-icom" mode="widthFix" src="@/assets/img/user/mystatus.png" />我的状态
+ </div>
+ <div class="operation-right flexacenter">
+ <svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
+ </div>
+ </div>
+ <div class="operation-item flexacenter">
+ <div class="operation-left flexacenter">
+ <img class="operation-icom" mode="widthFix" src="@/assets/img/user/changepassword.png" />修改密码
+ </div>
+ <div class="operation-right flexacenter">
+ <svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
+ </div>
+ </div>
+ <div class="operation-item flexacenter">
+ <div class="operation-left flexacenter">
+ <img class="operation-icom" mode="widthFix" src="@/assets/img/user/bindemail.png" />绑定邮箱
+ </div>
+ <div class="operation-right flexacenter">
+ <svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
+ </div>
+ </div>
+ <div class="operation-item flexacenter">
+ <div class="operation-left flexacenter">
+ <img class="operation-icom" mode="widthFix" src="@/assets/img/user/bindmobile.png" />绑定手机
+ </div>
+ <div class="operation-right flexacenter">
+ <svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
+ </div>
+ </div>
+ <div class="operation-item flexacenter">
+ <div class="operation-left flexacenter">
+ <img class="operation-icom" mode="widthFix" src="@/assets/img/user/bindingthird-party .png" />绑定第三方账号
+ </div>
+ <div class="operation-right flexacenter">
+ <svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
+ </div>
+ </div>
+ <div class="operation-item flexacenter">
+ <div class="operation-left flexacenter">
+ <img class="operation-icom" mode="widthFix" src="@/assets/img/user/visithomepage.png" />浏览个人主页
+ </div>
+ <div class="operation-right flexacenter">
+ <svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
+ </div>
+ </div>
+
+
+ </div>
+
+ <div class="log-out" @click="logOut()">退出登录</div>
+
+ </div>
+</template>
+
+<script>
+export default {
+ name: 'userIndex',
+
+ data() {
+ return {
+ user: {
+ avatar: "",
+ nickname: "",
+ messagenum: 0
+ },
+ count: {},
+
+ };
+ },
+
+ mounted() {
+ this.init()
+ },
+
+ methods: {
+ init() {
+ this.$http.post("/api/user", "").then(res => {
+ console.log(res, "res");
+ let data = res.data
+ this.count = data.count
+ this.user = data.user
+
+ console.log(this.count);
+ })
+ },
+
+ // 点击退出登录
+ logOut() {
+ console.log("点击退出登录");
+ },
+ },
+};
+</script>
+
+<style lang="scss" scoped>
+.container {
+ padding-top: 1.3rem;
+
+ .header {
+ padding: 1rem 0 .8rem;
+
+ .portrait {
+ width: 2rem;
+ height: 2rem;
+ border-radius: 50%;
+ background-color: #fff;
+ position: relative;
+ }
+
+ .portrait-icom {
+ width: 1.8rem;
+ height: 1.8rem;
+ border-radius: 50%;
+ }
+
+ .header-username {
+ color: #000;
+ font-size: .48rem;
+ line-height: normal;
+ margin-top: .24rem;
+ font-weight: 650;
+ }
+
+
+ }
+
+ .operation-box {
+ background-color: #fff;
+ margin: 0 .2933rem .4rem;
+ border-radius: .4rem;
+
+ .operation-item {
+ height: 1.8rem;
+ justify-content: space-between;
+ padding: 0 .4rem;
+
+ &:not(:first-of-type) {
+ border-top: .0133rem dotted #d7d7d7;
+ }
+
+ .operation-left {
+ color: #333333;
+ font-size: .36rem;
+ line-height: .6rem;
+ }
+
+ .operation-icom {
+ width: .48rem;
+ margin-right: .32rem;
+ }
+
+ .operation-data {
+ background-color: rgba(246, 246, 246, 1);
+ border-radius: .64rem;
+ font-size: .28rem;
+ color: #555555;
+ min-width: .9rem;
+ text-align: center;
+ padding: 0 .2rem;
+ box-sizing: border-box;
+ }
+
+ .unread-info {
+ background: rgba(253, 63, 93, 1);
+ // width: .42rem;
+ height: .42rem;
+ border-radius: .64rem;
+ color: #fff;
+ font-size: .28rem;
+ text-align: center;
+
+ padding: 0 0.1rem;
+ box-sizing: border-box;
+ }
+
+ .operation-right-icom {
+ width: .12rem;
+ height: .22rem;
+ margin-left: .2rem;
+ }
+
+ }
+
+ &.data-presentation {
+ padding-top: .4rem;
+ padding-bottom: .4rem;
+
+ .data-presentation-item {
+
+ flex-direction: column;
+
+ &:not(:last-of-type) {
+ border-right: .0133rem solid #ebebeb;
+ }
+
+ .data-presentation-number {
+ color: #000;
+ line-height: .6rem;
+ font-size: .4rem;
+ font-weight: 900;
+ }
+
+ .data-presentation-name {
+ color: #333333;
+ line-height: .6rem;
+ font-size: .32rem;
+ }
+ }
+ }
+
+ }
+
+ .log-out {
+ font-size: .36rem;
+ line-height: .6rem;
+ color: #555555;
+ border-bottom: .0133rem solid #797979;
+ width: 1.46rem;
+ margin: .6rem auto 1rem;
+ }
+
+}
+</style>
\ No newline at end of file
diff --git a/src/views/user/UserIndex.vue b/src/views/user/UserIndex.vue
index a8153eb..8684d87 100755
--- a/src/views/user/UserIndex.vue
+++ b/src/views/user/UserIndex.vue
@@ -2,24 +2,24 @@
<div class="container">
<div class="header flexcenter flexcolumn">
<div class="portrait flexcenter shadow">
- <img class="portrait-icom" :src="user.avatar" />
+ <img class="portrait-icom" :src="info.avatar" />
</div>
- <div class="header-username flexacenter">{{ user.nickname }}</div>
+ <div class="header-username flexacenter">{{ info.nickname }}</div>
</div>
<!-- 数据展示板 -->
<div class="operation-box shadow data-presentation flexflex">
<div class="data-presentation-item flex1 flexcenter">
- <div class="data-presentation-number">{{ count.prestige }}</div>
+ <div class="data-presentation-number">279</div>
<div class="data-presentation-name">声望</div>
</div>
<div class="data-presentation-item flex1 flexcenter">
- <div class="data-presentation-number">{{ count.gtercurrency }}</div>
- <div class="data-presentation-name">寄托币</div>
+ <div class="data-presentation-number">279</div>
+ <div class="data-presentation-name">声望</div>
</div>
<div class="data-presentation-item flex1 flexcenter">
- <div class="data-presentation-number">{{ count.digest }}</div>
- <div class="data-presentation-name">精华</div>
+ <div class="data-presentation-number">279</div>
+ <div class="data-presentation-name">声望</div>
</div>
</div>
@@ -29,8 +29,8 @@
<img class="operation-icom" mode="widthFix" src="@/assets/img/user/information.png">消息
</div>
<div class="operation-right flexacenter">
- <div v-if="user.messagenum == 0" class="operation-data flexcenter">{{ count.message }}</div>
- <div v-else class="unread-info flexcenter">{{ user.messagenum }}</div>
+ <div v-if="false" class="operation-data flexcenter">{{ count.collect }}</div>
+ <div v-else class="unread-info flexcenter">{{ 1 }}</div>
<svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
</div>
</div>
@@ -40,7 +40,7 @@
<img class="operation-icom" mode="widthFix" src="@/assets/img/user/collect.png">收藏
</div>
<div class="operation-right flexacenter">
- <div class="operation-data flexcenter">{{ count.fav }}</div>
+ <div class="operation-data flexcenter">{{ count.creation }}</div>
<svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
</div>
</div>
@@ -49,7 +49,7 @@
<img class="operation-icom" src="@/assets/img/user/postmessage.png" />发帖
</div>
<div class="operation-right flexacenter">
- <div class="operation-data flexcenter">{{ count.post }}</div>
+ <div class="operation-data flexcenter">{{ count.likearticle }}</div>
<svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
</div>
</div>
@@ -58,7 +58,7 @@
<img class="operation-icom" mode="widthFix" src="@/assets/img/user/replymessage.png" />回帖
</div>
<div class="operation-right flexacenter">
- <div class="operation-data flexcenter">{{ count.reply }}</div>
+ <div class="operation-data flexcenter">{{ count.comment }}</div>
<svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
</div>
</div>
@@ -70,6 +70,7 @@
<img class="operation-icom" mode="widthFix" src="@/assets/img/user/personaldata.png">个人资料
</div>
<div class="operation-right flexacenter">
+ <div class="operation-data flexcenter">{{ count.creation }}</div>
<svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
</div>
</div>
@@ -78,6 +79,7 @@
<img class="operation-icom" src="@/assets/img/user/avatarsetting.png" />设置头像
</div>
<div class="operation-right flexacenter">
+ <div class="operation-data flexcenter">{{ count.likearticle }}</div>
<svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
</div>
</div>
@@ -86,6 +88,7 @@
<img class="operation-icom" mode="widthFix" src="@/assets/img/user/mystatus.png" />我的状态
</div>
<div class="operation-right flexacenter">
+ <div class="operation-data flexcenter">{{ count.comment }}</div>
<svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
</div>
</div>
@@ -94,6 +97,7 @@
<img class="operation-icom" mode="widthFix" src="@/assets/img/user/changepassword.png" />修改密码
</div>
<div class="operation-right flexacenter">
+ <div class="operation-data flexcenter">{{ count.comment }}</div>
<svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
</div>
</div>
@@ -102,6 +106,7 @@
<img class="operation-icom" mode="widthFix" src="@/assets/img/user/bindemail.png" />绑定邮箱
</div>
<div class="operation-right flexacenter">
+ <div class="operation-data flexcenter">{{ count.comment }}</div>
<svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
</div>
</div>
@@ -110,6 +115,7 @@
<img class="operation-icom" mode="widthFix" src="@/assets/img/user/bindmobile.png" />绑定手机
</div>
<div class="operation-right flexacenter">
+ <div class="operation-data flexcenter">{{ count.comment }}</div>
<svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
</div>
</div>
@@ -118,6 +124,7 @@
<img class="operation-icom" mode="widthFix" src="@/assets/img/user/bindingthird-party .png" />绑定第三方账号
</div>
<div class="operation-right flexacenter">
+ <div class="operation-data flexcenter">{{ count.comment }}</div>
<svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
</div>
</div>
@@ -126,6 +133,7 @@
<img class="operation-icom" mode="widthFix" src="@/assets/img/user/visithomepage.png" />浏览个人主页
</div>
<div class="operation-right flexacenter">
+ <div class="operation-data flexcenter">{{ count.comment }}</div>
<svg-icon icon-class="arrowsLeft" class-name="operation-right-icom"></svg-icon>
</div>
</div>
@@ -133,7 +141,7 @@
</div>
- <div class="log-out" @click="logOut()">退出登录</div>
+ <div class="log-out">退出登录</div>
</div>
</template>
@@ -144,36 +152,26 @@ export default {
data() {
return {
- user: {
- avatar: "",
- nickname: "",
- messagenum: 0
+ info: {
+ avatar: "https://oss.gter.net/avatar/97KwEWANd_4DHWiY6VbnSUFSCKroYWFjYQ~~/middle",
+ nickname: "Ada.Wu"
+ },
+ count: {
+ collect: 10,
+ creation: 10,
+ likearticle: 10,
+ comment: 10,
},
- count: {},
};
},
mounted() {
- this.init()
+
},
methods: {
- init() {
- this.$http.post("/api/user", "").then(res => {
- console.log(res, "res");
- let data = res.data
- this.count = data.count
- this.user = data.user
- console.log(this.count);
- })
- },
-
- // 点击退出登录
- logOut() {
- console.log("点击退出登录");
- },
},
};
</script>