refactor(components): 重构多个组件并优化公共样式
重构了item-head、item-bottom、item-offer、item-summary和item-tenement组件，优化了props传递和数据处理逻辑 将公共头部和导航样式提取到public.css中，避免重复代码 修复了item-tenement组件中图片显示和数据处理的问题 更新了item-bottom组件的点赞和收藏逻辑，增加错误提示 优化了item-head组件的用户信息显示逻辑 调整了多个组件的样式细节，包括间距、图标大小等
This commit is contained in:
DESKTOP-RQ919RC\Pc
23
component/head-top/head-top.js
Normal file
23
component/head-top/head-top.js
Normal file
@@ -0,0 +1,23 @@
|
||||
// my-component.js
|
||||
// 引入全局 Vue 对象（因在 HTML 中通过 script 引入，Vue 已挂载到 window）
|
||||
const { defineComponent, ref, onMounted, nextTick } = Vue;
|
||||
|
||||
// 定义组件（直接使用模板）
|
||||
export const headTop = defineComponent({
|
||||
name: "headTop",
|
||||
props: {
|
||||
itemdata: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
},
|
||||
|
||||
setup(props) {
|
||||
onMounted(() => {});
|
||||
|
||||
let signInAlreadyState = ref(false);
|
||||
return { signInAlreadyState };
|
||||
},
|
||||
|
||||
template: `<div class="head-top flexacenter"> <img class="logo" src="https://oss.gter.net/logo" alt="" /> <div class="flex1"></div> <div class="input-box flexacenter"> <input class="input flex1" type="text" placeholder="大家都在搜：屯特" /> <img class="icon" /> </div> <div class="sign-in sign-in-already flexcenter" v-if="signInAlreadyState" v-cloak onclick="showWindow('dsu_paulsign', 'https://bbs.gter.net/plugin.php?id=dsu_paulsign:sign&show=sign')"> <img class="sign-icon" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/sign-icon.png" /> <span>已签到，明天再来</span> </div> <div class="sign-in sign-in-no flexacenter" v-else onclick="showWindow('dsu_paulsign', 'https://bbs.gter.net/plugin.php?id=dsu_paulsign:sign&show=sign')" v-cloak> <img class="sign-in-bj" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/sign-in-bj.svg" /> <img class="coin-bj" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/coin-bj.svg" /> <img class="coin-icon" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/coin-icon.png" /> <span class="text flex1">签到领寄托币</span> <div class="sign-go flexcenter"> <img class="sign-go-bj" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/sign-go.svg" /> GO </div> <img class="petal1" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/petal1.png" /> <img class="petal2" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/petal2.png" /> <img class="petal3" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/petal3.png" /> </div></div>`,
|
||||
});
|
||||
26
component/head-top/head-top.txt
Normal file
26
component/head-top/head-top.txt
Normal file
@@ -0,0 +1,26 @@
|
||||
<div class="head-top flexacenter">
|
||||
<img class="logo" src="https://oss.gter.net/logo" alt="" />
|
||||
<div class="flex1"></div>
|
||||
<div class="input-box flexacenter">
|
||||
<input class="input flex1" type="text" placeholder="大家都在搜：屯特" />
|
||||
<img class="icon" />
|
||||
</div>
|
||||
|
||||
<div class="sign-in sign-in-already flexcenter" v-if="signInAlreadyState" v-cloak onclick="showWindow('dsu_paulsign', 'https://bbs.gter.net/plugin.php?id=dsu_paulsign:sign&show=sign')">
|
||||
<img class="sign-icon" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/sign-icon.png" />
|
||||
<span>已签到，明天再来</span>
|
||||
</div>
|
||||
<div class="sign-in sign-in-no flexacenter" v-else onclick="showWindow('dsu_paulsign', 'https://bbs.gter.net/plugin.php?id=dsu_paulsign:sign&show=sign')" v-cloak>
|
||||
<img class="sign-in-bj" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/sign-in-bj.svg" />
|
||||
<img class="coin-bj" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/coin-bj.svg" />
|
||||
<img class="coin-icon" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/coin-icon.png" />
|
||||
<span class="text flex1">签到领寄托币</span>
|
||||
<div class="sign-go flexcenter">
|
||||
<img class="sign-go-bj" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/sign-go.svg" />
|
||||
GO
|
||||
</div>
|
||||
<img class="petal1" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/petal1.png" />
|
||||
<img class="petal2" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/petal2.png" />
|
||||
<img class="petal3" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/petal3.png" />
|
||||
</div>
|
||||
</div>
|
||||
@@ -23,6 +23,8 @@ export const itemBottom = defineComponent({
|
||||
|
||||
let isLikeGif = ref(false);
|
||||
|
||||
let cancelOperate = inject("cancelOperate");
|
||||
|
||||
const likeClick = () => {
|
||||
if (realname.value == 0 && userInfoWin.value?.uin > 0) {
|
||||
openAttest();
|
||||
@@ -36,11 +38,19 @@ export const itemBottom = defineComponent({
|
||||
|
||||
const token = item.value.token || "";
|
||||
|
||||
if (["offer", "offer_summary", "interviewexperience"].includes(item.value["type"]) && item.value["is_like"]) {
|
||||
creationAlertBox("error", "不可取消点赞");
|
||||
return;
|
||||
}
|
||||
|
||||
ajax(`/v2/api/forum/postTopicLike`, {
|
||||
token,
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code != 200) return;
|
||||
if (res.code != 200) {
|
||||
creationAlertBox("error", res.message);
|
||||
return;
|
||||
}
|
||||
let data = res.data;
|
||||
|
||||
item.value["is_like"] = data.status;
|
||||
@@ -71,12 +81,17 @@ export const itemBottom = defineComponent({
|
||||
token,
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code != 200) return;
|
||||
if (res.code != 200) {
|
||||
creationAlertBox("error", res.message);
|
||||
return;
|
||||
}
|
||||
const data = res.data || {};
|
||||
|
||||
item.value["is_collect"] = data.status;
|
||||
item.value["collections"] = data.collections;
|
||||
creationAlertBox("success", res.message);
|
||||
// 调用父组件的方法
|
||||
cancelOperate(token);
|
||||
// this.triggerEvent("uncollect", item.token);
|
||||
})
|
||||
.catch((err) => {
|
||||
@@ -91,5 +106,5 @@ export const itemBottom = defineComponent({
|
||||
like,
|
||||
},
|
||||
|
||||
template: `<div class="comment flexacenter" v-if="!Array.isArray(item?.commentreviews)"> <img class="icon" :src="item?.commentreviews?.avatar" /> <div class="text one-line-display">{{ item?.commentreviews?.content }}</div></div><div class="bottom flexacenter"> <div class="bottom-item like flexacenter" @click="likeClick()"> <img v-if="item.is_like" class="icon" src="./img/like-red-icon.png" /> <img v-else class="icon" src="./img/like-icon.png" /> <div class="text">{{ item.likes || "赞" }}</div> </div> <div class="bottom-item flexacenter" @click="collectClick()"> <img v-if="item.is_collect" class="icon" src="./img/collect-golden.svg" /> <img v-else class="icon" src="./img/collect-gray.png" /> <div class="text">{{ item.collections || "收藏" }}</div> </div> <div class="bottom-item flexacenter"> <img class="icon" src="./img/discuss-icon.png" /> <div class="text">{{ item.comments || "讨论" }}</div> </div> <div class="bottom-item flexacenter"> <img class="icon" src="./img/bi-copper-icon.png" /> <div class="text">{{ item.coins || "投币" }}</div> </div> <div class="bottom-item flexacenter"> <img class="icon" src="./img/share-gray.png" /> <div class="text">转发</div> </div></div><like v-if="isLikeGif"></like>`,
|
||||
template: `<div class="comment flexacenter" v-if="item?.commentreviews && !Array.isArray(item?.commentreviews)"> <img class="icon" :src="item?.commentreviews?.avatar" /> <div class="text one-line-display">{{ item?.commentreviews?.content }}</div></div><div class="bottom flexacenter"> <div class="bottom-item like flexacenter" @click="likeClick()" v-if="item?.type != 'tenement'"> <img v-if="item.is_like" class="icon" src="./img/like-red-icon.png" /> <img v-else class="icon" src="./img/like-icon.png" /> <div class="text">{{ item.likes || "赞" }}</div> </div> <div class="bottom-item flexacenter" @click="collectClick()"> <img v-if="item.is_collect" class="icon" src="./img/collect-golden.svg" /> <img v-else class="icon" src="./img/collect-gray.png" /> <div class="text">{{ item.collections || "收藏" }}</div> </div> <div class="bottom-item flexacenter" v-if="item?.type != 'tenement'"> <img class="icon" src="./img/discuss-icon.png" /> <div class="text">{{ item.comments || "讨论" }}</div> </div> <div class="bottom-item flexacenter" v-if="item?.type != 'tenement'"> <img class="icon" src="./img/bi-copper-icon.png" /> <div class="text">{{ item.coins || "投币" }}</div> </div> <div class="bottom-item flexacenter"> <img class="icon" src="./img/share-gray.png" /> <div class="text">转发</div> </div></div><like v-if="isLikeGif"></like>`,
|
||||
});
|
||||
|
||||
@@ -1,24 +1,26 @@
|
||||
<div class="comment flexacenter" v-if="!Array.isArray(item?.commentreviews)">
|
||||
<div class="comment flexacenter" v-if="item?.commentreviews && !Array.isArray(item?.commentreviews)">
|
||||
<img class="icon" :src="item?.commentreviews?.avatar" />
|
||||
<div class="text one-line-display">{{ item?.commentreviews?.content }}</div>
|
||||
</div>
|
||||
<div class="bottom flexacenter">
|
||||
<div class="bottom-item like flexacenter" @click="likeClick()">
|
||||
<div class="bottom-item like flexacenter" @click="likeClick()" v-if="item?.type != 'tenement'">
|
||||
<img v-if="item.is_like" class="icon" src="./img/like-red-icon.png" />
|
||||
<img v-else class="icon" src="./img/like-icon.png" />
|
||||
<div class="text">{{ item.likes || "赞" }}</div>
|
||||
</div>
|
||||
|
||||
<div class="bottom-item flexacenter" @click="collectClick()">
|
||||
<img v-if="item.is_collect" class="icon" src="./img/collect-golden.svg" />
|
||||
<img v-else class="icon" src="./img/collect-gray.png" />
|
||||
<div class="text">{{ item.collections || "收藏" }}</div>
|
||||
</div>
|
||||
<div class="bottom-item flexacenter">
|
||||
|
||||
<div class="bottom-item flexacenter" v-if="item?.type != 'tenement'">
|
||||
<img class="icon" src="./img/discuss-icon.png" />
|
||||
<div class="text">{{ item.comments || "讨论" }}</div>
|
||||
</div>
|
||||
|
||||
<div class="bottom-item flexacenter">
|
||||
<div class="bottom-item flexacenter" v-if="item?.type != 'tenement'">
|
||||
<img class="icon" src="./img/bi-copper-icon.png" />
|
||||
<div class="text">{{ item.coins || "投币" }}</div>
|
||||
</div>
|
||||
|
||||
@@ -15,7 +15,8 @@ export const itemForum = defineComponent({
|
||||
},
|
||||
|
||||
setup(props) {
|
||||
let res = props.itemdata;
|
||||
let res = props.itemdata || {};
|
||||
console.log("res", res);
|
||||
res.content = res?.content?.replace(/\[.*?\]/g, "");
|
||||
res.content = res?.content?.replace(/\<.*?\>/g, "");
|
||||
res.content = res?.content?.replace(/\[.*?\../g, "");
|
||||
|
||||
@@ -28,7 +28,7 @@ export const itemHead = defineComponent({
|
||||
sectionn.value = item.value.sectionn || [];
|
||||
|
||||
const sectionSet = new Set(sectionn.value);
|
||||
tags.value = item.value.tags.filter((tag) => !sectionSet.has(tag));
|
||||
tags.value = item.value.tags?.filter((tag) => !sectionSet.has(tag));
|
||||
|
||||
let show = ref(false);
|
||||
|
||||
@@ -96,5 +96,5 @@ export const itemHead = defineComponent({
|
||||
report,
|
||||
},
|
||||
|
||||
template: `<div class="item-head flexacenter"> <img class="avatar" :src="item.user.avatar || item.avatar" /> <div class="name">{{ item.user.nickname || item.nickname || "匿名用户" }}</div> <!-- <img class="group" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c_ZMtdXfqqsgFptxhcq_cQnrlcPJ0DVESBq_D-81qNDQyOQ~~" /> --> <div class="time">{{ timestamp }}</div> <div class="flex1"></div> <div class="view flexacenter"> <img class="icon" src="https://app.gter.net/image/miniApp/offer/eye-icon.svg" /> <div class="text">{{ item.views }}</div> </div> <div class="btn flexcenter" @click.stop="cutShow"> <img class="icon" src="https://app.gter.net/image/miniApp/offer/dot-dot-dot-gray.png" /> </div> <div v-if="show"> <div class="mask" @click.stop="cutShow"></div> <div class="operate"> <div class="item" @click.stop="report">举报</div> <template v-if="ismanager"> <div class="item" @click.stop="hide">{{ item.hidden == 0 ? "隐藏" : "显示" }}</div> <div class="item" @click.stop="recommend">{{ item.recommend == 1 ? "取消" : "" }}推荐</div> <div class="item" @click.stop="essence">{{ item.best == 1 ? "取消" : "" }}精华</div> </template> </div> </div></div><div class="label flexflex" v-if="sectionn.length || tags.length || item.recommend == 1 || item.best == 1"> <img class="item icon" v-if="item.recommend == 1 && item.best != 1" src="./img/recommend-icon.png" /> <img class="item icon" v-if="item.best == 1" src="./img/essence-icon.png" /> <div class="item blue" v-for="(item, index) in sectionn" :key="item">{{ item }}</div> <div class="item" v-for="(item, index) in tags" :key="item">{{ item }}</div></div><report v-if="reportState" :itemdata="item"></report>`,
|
||||
template: `<div class="item-head flexacenter"> <img class="avatar" :src="item?.user?.avatar || item.avatar" /> <div class="name">{{ item?.user?.nickname || item.nickname || "匿名用户" }}</div> <!-- <img class="group" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c_ZMtdXfqqsgFptxhcq_cQnrlcPJ0DVESBq_D-81qNDQyOQ~~" /> --> <div class="time">{{ timestamp }}</div> <div class="flex1"></div> <div class="view flexacenter"> <img class="icon" src="https://app.gter.net/image/miniApp/offer/eye-icon.svg" /> <div class="text">{{ item.views }}</div> </div> <div class="btn flexcenter" @click.stop="cutShow"> <img class="icon" src="https://app.gter.net/image/miniApp/offer/dot-dot-dot-gray.png" /> </div> <div v-if="show"> <div class="mask" @click.stop="cutShow"></div> <div class="operate"> <div class="item" @click.stop="report">举报</div> <template v-if="ismanager"> <div class="item" @click.stop="hide">{{ item.hidden == 0 ? "隐藏" : "显示" }}</div> <div class="item" @click.stop="recommend">{{ item.recommend == 1 ? "取消" : "" }}推荐</div> <div class="item" @click.stop="essence">{{ item.best == 1 ? "取消" : "" }}精华</div> </template> </div> </div></div><div class="label flexflex" v-if="sectionn?.length || tags?.length || item.recommend == 1 || item.best == 1"> <img class="item icon" v-if="item.recommend == 1 && item.best != 1" src="./img/recommend-icon.png" /> <img class="item icon" v-if="item.best == 1" src="./img/essence-icon.png" /> <div class="item blue" v-for="(item, index) in sectionn" :key="item">{{ item }}</div> <div class="item" v-for="(item, index) in tags" :key="item">{{ item }}</div></div><report v-if="reportState" :itemdata="item"></report>`,
|
||||
});
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<div class="item-head flexacenter">
|
||||
<img class="avatar" :src="item.user.avatar || item.avatar" />
|
||||
<div class="name">{{ item.user.nickname || item.nickname || "匿名用户" }}</div>
|
||||
<img class="avatar" :src="item?.user?.avatar || item.avatar" />
|
||||
<div class="name">{{ item?.user?.nickname || item.nickname || "匿名用户" }}</div>
|
||||
<!-- <img class="group" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c_ZMtdXfqqsgFptxhcq_cQnrlcPJ0DVESBq_D-81qNDQyOQ~~" /> -->
|
||||
<div class="time">{{ timestamp }}</div>
|
||||
<div class="flex1"></div>
|
||||
@@ -27,7 +27,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="label flexflex" v-if="sectionn.length || tags.length || item.recommend == 1 || item.best == 1">
|
||||
<div class="label flexflex" v-if="sectionn?.length || tags?.length || item.recommend == 1 || item.best == 1">
|
||||
<img class="item icon" v-if="item.recommend == 1 && item.best != 1" src="./img/recommend-icon.png" />
|
||||
<img class="item icon" v-if="item.best == 1" src="./img/essence-icon.png" />
|
||||
<div class="item blue" v-for="(item, index) in sectionn" :key="item">{{ item }}</div>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
// my-component.js
|
||||
// 引入全局 Vue 对象（因在 HTML 中通过 script 引入，Vue 已挂载到 window）
|
||||
const { defineComponent } = Vue;
|
||||
const { defineComponent, ref, provide } = Vue;
|
||||
import { itemBottom } from "../item-bottom/item-bottom.js";
|
||||
import { itemHead } from "../item-head/item-head.js";
|
||||
|
||||
@@ -8,16 +8,74 @@ import { itemHead } from "../item-head/item-head.js";
|
||||
export const itemOffer = defineComponent({
|
||||
name: "item-offer",
|
||||
props: {
|
||||
item: {
|
||||
itemdata: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
},
|
||||
|
||||
setup(props) {
|
||||
let item = ref({ ...props.itemdata });
|
||||
|
||||
let isLogin = ref(true);
|
||||
let realname = ref(1); // 是否已经实名
|
||||
let userInfoWin = ref({
|
||||
authority: ["comment.edit", "comment.delete", "offercollege.hide", "offersummary.hide", "mj.hide", "topic:manager", "topic:hide"],
|
||||
avatar: "https://nas.gter.net:9008/avatar/97K4EWIMLrsbGTWXslC2WFVSEKWOikN42jDKLNjtax7HL4xtfMOJSdU9oWFhY2E~/middle?random=1761733169",
|
||||
groupid: 3,
|
||||
nickname: "肖荣豪",
|
||||
realname: 1,
|
||||
token: "01346a38444d71aaadb3adad52b52c39",
|
||||
uid: 500144,
|
||||
uin: 4238049,
|
||||
});
|
||||
|
||||
let permissions = ref([]);
|
||||
|
||||
const getUserInfoWin = () => {
|
||||
const checkUser = () => {
|
||||
const user = window.userInfoWin;
|
||||
if (!user) return;
|
||||
document.removeEventListener("getUser", checkUser);
|
||||
realname.value = user.realname;
|
||||
userInfoWin.value = user;
|
||||
if (user?.uin > 0 || user?.uid > 0) isLogin.value = true;
|
||||
};
|
||||
document.addEventListener("getUser", checkUser);
|
||||
};
|
||||
|
||||
const openAttest = () => {
|
||||
const handleAttestClose = () => {
|
||||
document.removeEventListener("closeAttest", handleAttestClose);
|
||||
realname.value = window.userInfoWin?.realname || 0;
|
||||
};
|
||||
// 启动认证流程时添加监听
|
||||
document.addEventListener("closeAttest", handleAttestClose);
|
||||
loadAttest(2);
|
||||
};
|
||||
|
||||
// 跳转登录
|
||||
const goLogin = () => {
|
||||
if (typeof window === "undefined") return;
|
||||
if (window["userInfoWin"] && Object.keys(window["userInfoWin"]).length !== 0) {
|
||||
if (window["userInfoWin"]["uid"]) isNeedLogin.value = false;
|
||||
else ajax_login();
|
||||
} else ajax_login();
|
||||
};
|
||||
|
||||
provide("isLogin", isLogin);
|
||||
provide("userInfoWin", userInfoWin);
|
||||
provide("realname", realname);
|
||||
provide("openAttest", openAttest);
|
||||
provide("goLogin", goLogin);
|
||||
|
||||
return { item };
|
||||
},
|
||||
|
||||
components: {
|
||||
itemBottom,
|
||||
itemHead,
|
||||
},
|
||||
|
||||
template: `<div class="item-box item-offer"> <item-head></item-head> <div class="school flexacenter"> <img class="icon" :src="item.data.schoollogo" mode="heightFix"></image> <div class="text flex1 one-line-display">{{ item.data.schoolname }}</div> </div> <div class="major flexacenter" v-if="item.data.professional"> <div class="key">{{ item.data.project ? '专业' : '项目/专业' }}</div> <div class="value flex1 one-line-display">{{ item.data.professional }}</div> </div> <div class="major flexacenter" v-if="item.data.project"> <div class="key">项目</div> <div class="value flex1 one-line-display">{{ item.data.project }}</div> </div> <div class="info flexacenter"> {{ item.data.semester }} <div class="line"></div> {{ item.data.degree }} <div class="line"></div> <div class="results" :class="['r' + item.data.apply_results]">{{ item.data.apply_results_text }}</div> </div> <div class="message" v-if="item.content">{{ item.content }}</div> <item-bottom></item-bottom></div>`,
|
||||
template: `<div class="item-box item-offer"> <item-head :itemdata="item"></item-head> <div class="school flexacenter"> <img class="icon" :src="item.data.schoollogo" mode="heightFix"></image> <div class="text flex1 one-line-display">{{ item.data.schoolname }}</div> </div> <div class="major flexacenter" v-if="item.data.professional"> <div class="key">{{ item.data.project ? '专业' : '项目/专业' }}</div> <div class="value flex1 one-line-display">{{ item.data.professional }}</div> </div> <div class="major flexacenter" v-if="item.data.project"> <div class="key">项目</div> <div class="value flex1 one-line-display">{{ item.data.project }}</div> </div> <div class="info flexacenter"> {{ item.data.semester }} <div class="line"></div> {{ item.data.degree }} <div class="line"></div> <div class="results" :class="['r' + item.data.apply_results]">{{ item.data.apply_results_text }}</div> </div> <div class="message" v-if="item.content">{{ item.content }}</div> <item-bottom :itemdata="item"></item-bottom></div>`,
|
||||
});
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<div class="item-box item-offer">
|
||||
<item-head></item-head>
|
||||
<item-head :itemdata="item"></item-head>
|
||||
<div class="school flexacenter">
|
||||
<img class="icon" :src="item.data.schoollogo" mode="heightFix"></image>
|
||||
<div class="text flex1 one-line-display">{{ item.data.schoolname }}</div>
|
||||
@@ -24,5 +24,5 @@
|
||||
</div>
|
||||
|
||||
<div class="message" v-if="item.content">{{ item.content }}</div>
|
||||
<item-bottom></item-bottom>
|
||||
<item-bottom :itemdata="item"></item-bottom>
|
||||
</div>
|
||||
@@ -1,6 +1,6 @@
|
||||
// my-component.js
|
||||
// 引入全局 Vue 对象（因在 HTML 中通过 script 引入，Vue 已挂载到 window）
|
||||
const { defineComponent } = Vue;
|
||||
const { defineComponent, ref } = Vue;
|
||||
import { itemBottom } from "../item-bottom/item-bottom.js";
|
||||
import { itemHead } from "../item-head/item-head.js";
|
||||
|
||||
@@ -8,16 +8,22 @@ import { itemHead } from "../item-head/item-head.js";
|
||||
export const itemSummary = defineComponent({
|
||||
name: "item-summary",
|
||||
props: {
|
||||
item: {
|
||||
itemdata: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
},
|
||||
|
||||
setup(props) {
|
||||
let item = ref({ ...props.itemdata });
|
||||
|
||||
return { item };
|
||||
},
|
||||
|
||||
components: {
|
||||
itemBottom,
|
||||
itemHead,
|
||||
},
|
||||
|
||||
template: `<div class="item-box item-summary"> <item-head></item-head> <div class="title" v-if="item.title">{{ item.title }}</div> <div class="message one-line-display" v-if="item.content">{{ item.content }}</div> <div class="total flexacenter"> <div>共</div> <div class="num">{{ item.data.offercount }}</div> <div>个Offer</div> </div> <div class="list flexacenter" scroll-x> <div class="item flexflex" v-for="(it,i) in item.data.offerlist" :key="i"> <div class="item-content flexflex"> <div class="school flexacenter"> <img class="icon" :src="it.schoollogo" mode="heightFix"></image> <div class="name one-line-display flex1">{{ it.schoolname }}</div> </div> <div class="major one-line-display" v-if="it.professional">{{ it.professional }}</div> <div class="info flexacenter"> {{ it.semester || '25Fall' }} <div class="line"></div> {{ it.degree || 'MSc' }} <div class="line"></div> <div class="results" :class="['r' + it.apply_results]">{{ it.apply_results_text || 'Offer' }}</div> </div> </div> </div> <div v-if="item.data.offercount > 3" class="item more flexcenter"> <div class="item-content flexcenter"> <div class="">查看更多</div> <img class="icon" src="/img/arrows-circle-dark-blue.svg" mode="heightFix"></image> </div> </div> </div> <item-bottom></item-bottom></div>`,
|
||||
template: `<div class="item-box item-summary"> <item-head :itemdata="item"></item-head> <div class="title" v-if="item.title">{{ item.title }}</div> <div class="message one-line-display" v-if="item.content">{{ item.content }}</div> <div class="total flexacenter"> <div>共</div> <div class="num">{{ item.data.offercount }}</div> <div>个Offer</div> </div> <div class="list flexacenter" scroll-x> <div class="item flexflex" v-for="(it,i) in item.data.offerlist" :key="i"> <div class="item-content flexflex"> <div class="school flexacenter"> <img class="icon" :src="it.schoollogo" mode="heightFix"></image> <div class="name one-line-display flex1">{{ it.schoolname }}</div> </div> <div class="major one-line-display" v-if="it.professional">{{ it.professional }}</div> <div class="info flexacenter"> {{ it.semester || '25Fall' }} <div class="line"></div> {{ it.degree || 'MSc' }} <div class="line"></div> <div class="results" :class="['r' + it.apply_results]">{{ it.apply_results_text || 'Offer' }}</div> </div> </div> </div> <div v-if="item.data.offercount > 3" class="item more flexcenter"> <div class="item-content flexcenter"> <div class="">查看更多</div> <img class="icon" src="/img/arrows-circle-dark-blue.svg" mode="heightFix"></image> </div> </div> </div> <item-bottom :itemdata="item"></item-bottom></div>`,
|
||||
});
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<div class="item-box item-summary">
|
||||
<item-head></item-head>
|
||||
<item-head :itemdata="item"></item-head>
|
||||
<div class="title" v-if="item.title">{{ item.title }}</div>
|
||||
<div class="message one-line-display" v-if="item.content">{{ item.content }}</div>
|
||||
<div class="total flexacenter">
|
||||
@@ -32,5 +32,5 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<item-bottom></item-bottom>
|
||||
<item-bottom :itemdata="item"></item-bottom>
|
||||
</div>
|
||||
@@ -6,7 +6,7 @@ import { itemHead } from "../item-head/item-head.js";
|
||||
|
||||
// 定义组件（直接使用模板）
|
||||
export const itemTenement = defineComponent({
|
||||
name: "item-tenement",
|
||||
name: "item-tenement",
|
||||
props: {
|
||||
itemdata: {
|
||||
type: Object,
|
||||
@@ -15,17 +15,55 @@ export const itemTenement = defineComponent({
|
||||
},
|
||||
|
||||
setup(props) {
|
||||
const handleHousing = (ele) => {
|
||||
const langs = lang;
|
||||
console.log("langs", langs);
|
||||
|
||||
if (ele["distance"]) ele["distance"] = Math.round(ele["distance"] * 10) / 10;
|
||||
// 这个是将 详情键 替换语言包里的值
|
||||
let list = ["tenementtype", "rentalduration", "intermediary", "property", "elevator", "sunshinearea", "gender"];
|
||||
// let list = ["rentalduration", "intermediary", "property", "elevator", "sunshinearea", "gender"];
|
||||
if (Array.isArray(ele["floor"])) list.push("floor"); // 判断 楼层是否需要 替换值, 因为在求房源里是多个值
|
||||
let differentNames = {
|
||||
// 需要替换的 键名
|
||||
intermediary: "intermediary_text",
|
||||
};
|
||||
|
||||
list.forEach((element) => {
|
||||
if (ele[element] == -1) {
|
||||
} else if (ele[element] == 0) ele[differentNames[element] ? differentNames[element] : element] = "不限";
|
||||
// 当 值为 [0] 时为不限
|
||||
else ele[differentNames[element] ? differentNames[element] : element] = langs[element][ele[element]];
|
||||
});
|
||||
|
||||
let tabArr = ["gptype", "tenementtype", "elevator", "sunshinearea", "gender"];
|
||||
let tabList = [];
|
||||
tabArr.forEach((el) => {
|
||||
if (ele[el] && ele[el] != -1) tabList.push(ele[el]);
|
||||
});
|
||||
ele["tabList"] = tabList;
|
||||
let location = langs.location; // 遍历替换区域的值 所有房源
|
||||
if (ele.intermediary == 6) {
|
||||
if (Array.isArray(ele.rent)) ele.rent = `${ele.rent[0]} ~ ${ele.rent[1]}`;
|
||||
if (Array.isArray(ele["location"])) {
|
||||
let arr = [];
|
||||
ele["location"].forEach((element) => {
|
||||
arr.push(`${location[Math.trunc(element)]} > ${location[element]}`);
|
||||
});
|
||||
ele["location"] = arr;
|
||||
}
|
||||
} else {
|
||||
let pendingData = ele["location"];
|
||||
ele["location"] = `${location[Math.trunc(pendingData)]} > ${location[pendingData]}`;
|
||||
}
|
||||
return ele;
|
||||
};
|
||||
let item = ref({ ...props.itemdata });
|
||||
// item.value.title = "【投41票】" + item.value.title;
|
||||
// res["timestamp"] = util.strtimeago(res.release_at, 4);
|
||||
// const data = res.data;
|
||||
// const option = data.option || [];
|
||||
// res["isvote"] = option.some((item) => item.selected == 1);
|
||||
// const time = util.handleDeadline(data.deadline);
|
||||
// res["time"] = time;
|
||||
// this.setData({
|
||||
// item: res,
|
||||
// });
|
||||
// console.log("item", item.value);
|
||||
item.value = handleHousing(item.value);
|
||||
|
||||
console.log("item.value", item.value);
|
||||
|
||||
return { item };
|
||||
},
|
||||
|
||||
@@ -34,5 +72,5 @@ export const itemTenement = defineComponent({
|
||||
itemHead,
|
||||
},
|
||||
|
||||
template: `<div class="item-box item-tenement"> <item-head :itemdata="item"></item-head> <div class="title">三房找一位室友合租，家具设备齐全</div> <div class="site-box flexacenter"> <template v-if="item.intermediary == 6"> <div class="site-item flexacenter" v-for="(item, index) in item.location" :key="index"> <img class="site-icon" src="https://app.gter.net/image/miniApp/offer/room.png"> {{ item }} </div> </template> <div v-else class="site-item flexacenter"> <img class="site-icon" src="https://app.gter.net/image/miniApp/offer/orientation.png"> {{ item.location || '九龙 > 尖沙咀/佐敦' }} </div> </div> <div class="price-section flexacenter"> <div class="unit">HK$</div> <div class="price">{{ item.rent }}</div> <span class="text">/月</span> <div class="rentalduration">[ 租期{{ item.rentalduration }} ]</div> </div> <div class="picture flexacenter"> <img class="picture-item" v-for="(item, index) in 15" :key="index" src="https://axure-file.lanhuapp.com/md5__34fc6e5f5fef1d31bbd4604d33be77cc.svg" alt=""> </div> <item-bottom :itemdata="item"></item-bottom></div>`,
|
||||
template: `<div class="item-box item-tenement"> <item-head :itemdata="item"></item-head> <div class="title">三房找一位室友合租，家具设备齐全</div> <div class="site-box flexacenter"> <template v-if="item.intermediary == 6"> <div class="site-item flexacenter" v-for="(item, index) in item.location" :key="index"> <img class="site-icon" src="https://app.gter.net/image/miniApp/offer/room.png"> {{ item }} </div> </template> <div v-else class="site-item flexacenter"> <img class="site-icon" src="https://app.gter.net/image/miniApp/offer/orientation.png"> {{ item.location || '九龙 > 尖沙咀/佐敦' }} </div> </div> <div class="price-section flexacenter"> <div class="unit">HK$</div> <div class="price">{{ item.rent }}</div> <span class="text">/月</span> <div class="rentalduration">[ 租期{{ item.rentalduration }} ]</div> </div> <div class="picture flexacenter" v-if="item.images?.length != 0"> <img class="picture-item" v-for="(item, index) in item.images" :key="index" :src="item" alt=""> </div> <item-bottom :itemdata="item"></item-bottom></div>`,
|
||||
});
|
||||
|
||||
@@ -22,8 +22,8 @@
|
||||
<div class="rentalduration">[ 租期{{ item.rentalduration }} ]</div>
|
||||
</div>
|
||||
|
||||
<div class="picture flexacenter">
|
||||
<img class="picture-item" v-for="(item, index) in 15" :key="index" src="https://axure-file.lanhuapp.com/md5__34fc6e5f5fef1d31bbd4604d33be77cc.svg" alt="">
|
||||
<div class="picture flexacenter" v-if="item.images?.length != 0">
|
||||
<img class="picture-item" v-for="(item, index) in item.images" :key="index" :src="item" alt="">
|
||||
</div>
|
||||
|
||||
<item-bottom :itemdata="item"></item-bottom>
|
||||
|
||||
@@ -2,64 +2,6 @@
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
#details .head-top {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
#details .head-top .logo {
|
||||
height: 52px;
|
||||
}
|
||||
#details .head-top .input-box {
|
||||
width: 370px;
|
||||
height: 40px;
|
||||
background-color: #ebebeb;
|
||||
border: 2px solid #d7d7d7;
|
||||
border-radius: 11px;
|
||||
padding: 0 15px;
|
||||
justify-content: space-between;
|
||||
margin-right: 20px;
|
||||
}
|
||||
#details .head-top .input-box .input {
|
||||
border: none;
|
||||
outline: none;
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
}
|
||||
#details .head-top .input-box .icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-left: 15rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
#details .head-top .post-list .post-item {
|
||||
width: 84px;
|
||||
height: 34px;
|
||||
cursor: pointer;
|
||||
}
|
||||
#details .head-top .post-list .post-item:not(:last-child) {
|
||||
margin-right: 10px;
|
||||
}
|
||||
#details .head-navigation {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
#details .head-navigation .icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
#details .head-navigation .arrows {
|
||||
width: 7px;
|
||||
height: 12px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
#details .head-navigation .text {
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
text-decoration: none;
|
||||
max-width: 300px;
|
||||
}
|
||||
#details .head-navigation .text.textA:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
#details .matter {
|
||||
align-items: flex-start;
|
||||
margin-bottom: 50px;
|
||||
@@ -588,10 +530,13 @@
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px dotted rgba(215, 215, 215, 0.501961);
|
||||
padding-left: 14px;
|
||||
padding-top: 12px;
|
||||
overflow: auto;
|
||||
}
|
||||
.answer-discuss .input-box .picture-box .picture {
|
||||
position: relative;
|
||||
width: fit-content;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.answer-discuss .input-box .picture-box .picture .img {
|
||||
height: 60px;
|
||||
@@ -639,14 +584,15 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
.answer-discuss .input-box .bottom .operate .item .emoji-box {
|
||||
width: 581px;
|
||||
width: 582px;
|
||||
border-radius: 8px;
|
||||
background-color: #fff;
|
||||
filter: drop-shadow(0 0 11px rgba(0, 0, 0, 0.1));
|
||||
top: 45px;
|
||||
top: 36px;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
left: -14px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
border: 1px solid #ebebeb;
|
||||
display: none;
|
||||
flex-wrap: wrap;
|
||||
@@ -662,7 +608,8 @@
|
||||
border-bottom: 8px solid #ffffff;
|
||||
position: absolute;
|
||||
top: -8px;
|
||||
left: 15px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
.answer-discuss .input-box .bottom .operate .item .emoji-box .emoji-icon {
|
||||
margin: 5px;
|
||||
|
||||
@@ -1,76 +1,6 @@
|
||||
#details {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
.head-top {
|
||||
margin-bottom: 30px;
|
||||
|
||||
.logo {
|
||||
height: 52px;
|
||||
}
|
||||
|
||||
.input-box {
|
||||
width: 370px;
|
||||
height: 40px;
|
||||
background-color: rgba(235, 235, 235, 1);
|
||||
border: 2px solid rgba(215, 215, 215, 1);
|
||||
border-radius: 11px;
|
||||
padding: 0 15px;
|
||||
justify-content: space-between;
|
||||
margin-right: 20px;
|
||||
|
||||
.input {
|
||||
border: none;
|
||||
outline: none;
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-left: 15rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.post-list {
|
||||
.post-item {
|
||||
width: 84px;
|
||||
height: 34px;
|
||||
cursor: pointer;
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.head-navigation {
|
||||
margin-bottom: 20px;
|
||||
.icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.arrows {
|
||||
width: 7px;
|
||||
height: 12px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.text {
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
text-decoration: none;
|
||||
max-width: 300px;
|
||||
|
||||
&.textA:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.matter {
|
||||
align-items: flex-start;
|
||||
@@ -691,11 +621,14 @@
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px dotted rgba(215, 215, 215, 0.501961);
|
||||
padding-left: 14px;
|
||||
padding-top: 12px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.answer-discuss .input-box .picture-box .picture {
|
||||
position: relative;
|
||||
width: fit-content;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.answer-discuss .input-box .picture-box .picture .img {
|
||||
@@ -751,14 +684,17 @@
|
||||
}
|
||||
|
||||
.answer-discuss .input-box .bottom .operate .item .emoji-box {
|
||||
width: 581px;
|
||||
width: 582px;
|
||||
border-radius: 8px;
|
||||
background-color: #fff;
|
||||
filter: drop-shadow(0 0 11px rgba(0, 0, 0, 0.1));
|
||||
top: 45px;
|
||||
// top: 45px;
|
||||
top: 36px;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
left: -14px;
|
||||
// left: -14px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
border: 1px solid #ebebeb;
|
||||
display: none;
|
||||
flex-wrap: wrap;
|
||||
@@ -775,7 +711,9 @@
|
||||
border-bottom: 8px solid #ffffff;
|
||||
position: absolute;
|
||||
top: -8px;
|
||||
left: 15px;
|
||||
// left: 15px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.answer-discuss .input-box .bottom .operate .item .emoji-box .emoji-icon {
|
||||
|
||||
@@ -2,144 +2,6 @@
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
#homepage-me .head-top {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
#homepage-me .head-top .logo {
|
||||
height: 52px;
|
||||
}
|
||||
#homepage-me .head-top .input-box {
|
||||
width: 370px;
|
||||
height: 40px;
|
||||
background-color: #ebebeb;
|
||||
border: 2px solid #d7d7d7;
|
||||
border-radius: 11px;
|
||||
padding: 0 15px;
|
||||
justify-content: space-between;
|
||||
margin-right: 20px;
|
||||
}
|
||||
#homepage-me .head-top .input-box .input {
|
||||
border: none;
|
||||
outline: none;
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
}
|
||||
#homepage-me .head-top .input-box .icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-left: 15rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
#homepage-me .head-top .sign-in {
|
||||
width: 192px;
|
||||
height: 40px;
|
||||
border-radius: 83px;
|
||||
cursor: pointer;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-already {
|
||||
background-color: #ffffff;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-already .sign-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-no {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding-right: 8px;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-no .sign-in-bj {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
width: 190px;
|
||||
height: 40px;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-no .coin-bj {
|
||||
position: absolute;
|
||||
width: 157px;
|
||||
height: 33px;
|
||||
top: 4px;
|
||||
left: 29px;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-no .coin-icon {
|
||||
width: 43px;
|
||||
height: 51px;
|
||||
align-self: flex-end;
|
||||
z-index: 1;
|
||||
margin-left: -2px;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-no .text {
|
||||
text-align: center;
|
||||
text-shadow: 1px 1px 2px #a63603;
|
||||
-webkit-text-shadow: 1px 1px 2px #a63603;
|
||||
-moz-text-shadow: 1px 1px 2px #a63603;
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-no .sign-go {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-family: "Arial-BoldMT", "Arial Bold", "Arial", sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
color: #710600;
|
||||
position: relative;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-no .sign-go .sign-go-bj {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-no .petal1,
|
||||
#homepage-me .head-top .sign-in.sign-in-no .petal2,
|
||||
#homepage-me .head-top .sign-in.sign-in-no .petal3 {
|
||||
position: absolute;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-no .petal1 {
|
||||
width: 24px;
|
||||
height: 10px;
|
||||
top: 3px;
|
||||
left: 55px;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-no .petal2 {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
top: 25px;
|
||||
left: 92px;
|
||||
}
|
||||
#homepage-me .head-top .sign-in.sign-in-no .petal3 {
|
||||
width: 17px;
|
||||
height: 12px;
|
||||
top: 25px;
|
||||
left: 136px;
|
||||
}
|
||||
#homepage-me .head-navigation {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
#homepage-me .head-navigation .icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
#homepage-me .head-navigation .arrows {
|
||||
width: 7px;
|
||||
height: 12px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
#homepage-me .head-navigation .text {
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
cursor: pointer;
|
||||
}
|
||||
#homepage-me .head-navigation .text:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
#homepage-me .matter {
|
||||
align-items: flex-start;
|
||||
}
|
||||
@@ -230,6 +92,7 @@
|
||||
line-height: 26px;
|
||||
font-size: 13px;
|
||||
color: #ab7713;
|
||||
text-decoration: none;
|
||||
}
|
||||
#homepage-me .matter .card-user .bi-box .bi-btn .bi-question {
|
||||
width: 14px;
|
||||
@@ -283,7 +146,8 @@
|
||||
color: #333333;
|
||||
}
|
||||
#homepage-me .matter .matter-content .message-box .header .icon {
|
||||
height: 40px;
|
||||
height: 20px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
#homepage-me .matter .matter-content .message-box .info-list {
|
||||
flex-flow: wrap;
|
||||
|
||||
@@ -1,162 +1,6 @@
|
||||
#homepage-me {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
.head-top {
|
||||
margin-bottom: 30px;
|
||||
|
||||
.logo {
|
||||
height: 52px;
|
||||
}
|
||||
|
||||
.input-box {
|
||||
width: 370px;
|
||||
height: 40px;
|
||||
background-color: rgba(235, 235, 235, 1);
|
||||
border: 2px solid rgba(215, 215, 215, 1);
|
||||
border-radius: 11px;
|
||||
padding: 0 15px;
|
||||
justify-content: space-between;
|
||||
margin-right: 20px;
|
||||
|
||||
.input {
|
||||
border: none;
|
||||
outline: none;
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-left: 15rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.sign-in {
|
||||
width: 192px;
|
||||
height: 40px;
|
||||
border-radius: 83px;
|
||||
cursor: pointer;
|
||||
|
||||
&.sign-in-already {
|
||||
background-color: #ffffff;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
.sign-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
&.sign-in-no {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding-right: 8px;
|
||||
.sign-in-bj {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
width: 190px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.coin-bj {
|
||||
position: absolute;
|
||||
width: 157px;
|
||||
height: 33px;
|
||||
top: 4px;
|
||||
left: 29px;
|
||||
}
|
||||
|
||||
.coin-icon {
|
||||
width: 43px;
|
||||
height: 51px;
|
||||
align-self: flex-end;
|
||||
z-index: 1;
|
||||
margin-left: -2px;
|
||||
}
|
||||
|
||||
.text {
|
||||
text-align: center;
|
||||
text-shadow: 1px 1px 2px #a63603;
|
||||
-webkit-text-shadow: 1px 1px 2px #a63603;
|
||||
-moz-text-shadow: 1px 1px 2px #a63603;
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sign-go {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-family: "Arial-BoldMT", "Arial Bold", "Arial", sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
color: #710600;
|
||||
position: relative;
|
||||
|
||||
.sign-go-bj {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
.petal1,
|
||||
.petal2,
|
||||
.petal3 {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.petal1 {
|
||||
width: 24px;
|
||||
height: 10px;
|
||||
top: 3px;
|
||||
left: 55px;
|
||||
}
|
||||
|
||||
.petal2 {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
top: 25px;
|
||||
left: 92px;
|
||||
}
|
||||
.petal3 {
|
||||
width: 17px;
|
||||
height: 12px;
|
||||
top: 25px;
|
||||
left: 136px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.head-navigation {
|
||||
margin-bottom: 20px;
|
||||
.icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.arrows {
|
||||
width: 7px;
|
||||
height: 12px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.text {
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.matter {
|
||||
align-items: flex-start;
|
||||
@@ -259,6 +103,7 @@
|
||||
|
||||
font-size: 13px;
|
||||
color: rgb(171, 119, 19);
|
||||
text-decoration: none;
|
||||
.bi-question {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
@@ -322,7 +167,8 @@
|
||||
}
|
||||
|
||||
.icon {
|
||||
height: 40px;
|
||||
height: 20px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -2,123 +2,6 @@
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
#homepage-other .head-top {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
#homepage-other .head-top .logo {
|
||||
height: 52px;
|
||||
}
|
||||
#homepage-other .head-top .input-box {
|
||||
width: 370px;
|
||||
height: 40px;
|
||||
background-color: #ebebeb;
|
||||
border: 2px solid #d7d7d7;
|
||||
border-radius: 11px;
|
||||
padding: 0 15px;
|
||||
justify-content: space-between;
|
||||
margin-right: 20px;
|
||||
}
|
||||
#homepage-other .head-top .input-box .input {
|
||||
border: none;
|
||||
outline: none;
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
}
|
||||
#homepage-other .head-top .input-box .icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-left: 15rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
#homepage-other .head-top .sign-in {
|
||||
width: 192px;
|
||||
height: 40px;
|
||||
border-radius: 83px;
|
||||
cursor: pointer;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-already {
|
||||
background-color: #ffffff;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-already .sign-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-no {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding-right: 8px;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-no .sign-in-bj {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
width: 190px;
|
||||
height: 40px;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-no .coin-bj {
|
||||
position: absolute;
|
||||
width: 157px;
|
||||
height: 33px;
|
||||
top: 4px;
|
||||
left: 29px;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-no .coin-icon {
|
||||
width: 43px;
|
||||
height: 51px;
|
||||
align-self: flex-end;
|
||||
z-index: 1;
|
||||
margin-left: -2px;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-no .text {
|
||||
text-align: center;
|
||||
text-shadow: 1px 1px 2px #a63603;
|
||||
-webkit-text-shadow: 1px 1px 2px #a63603;
|
||||
-moz-text-shadow: 1px 1px 2px #a63603;
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-no .sign-go {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-family: "Arial-BoldMT", "Arial Bold", "Arial", sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
color: #710600;
|
||||
position: relative;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-no .sign-go .sign-go-bj {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-no .petal1,
|
||||
#homepage-other .head-top .sign-in.sign-in-no .petal2,
|
||||
#homepage-other .head-top .sign-in.sign-in-no .petal3 {
|
||||
position: absolute;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-no .petal1 {
|
||||
width: 24px;
|
||||
height: 10px;
|
||||
top: 3px;
|
||||
left: 55px;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-no .petal2 {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
top: 25px;
|
||||
left: 92px;
|
||||
}
|
||||
#homepage-other .head-top .sign-in.sign-in-no .petal3 {
|
||||
width: 17px;
|
||||
height: 12px;
|
||||
top: 25px;
|
||||
left: 136px;
|
||||
}
|
||||
#homepage-other .head-navigation {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
@@ -181,7 +64,7 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
#homepage-other .matter .card-user .medal-area {
|
||||
margin: 0 30px 36px;
|
||||
margin: 0 22px 36px 30px;
|
||||
align-self: self-start;
|
||||
}
|
||||
#homepage-other .matter .card-user .medal-area .title {
|
||||
@@ -190,7 +73,7 @@
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
#homepage-other .matter .card-user .medal-area .list {
|
||||
flex-direction: row;
|
||||
flex-flow: wrap;
|
||||
}
|
||||
#homepage-other .matter .card-user .medal-area .list .item {
|
||||
height: 30px;
|
||||
@@ -206,6 +89,7 @@
|
||||
border-radius: 8px;
|
||||
font-size: 15px;
|
||||
color: #555555;
|
||||
cursor: pointer;
|
||||
}
|
||||
#homepage-other .matter .card-user .btn-area .item:not(:last-of-type) {
|
||||
margin-bottom: 15px;
|
||||
@@ -243,7 +127,8 @@
|
||||
color: #333333;
|
||||
}
|
||||
#homepage-other .matter .matter-content .message-box .header .icon {
|
||||
height: 40px;
|
||||
height: 20px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
#homepage-other .matter .matter-content .message-box .info-list {
|
||||
flex-flow: wrap;
|
||||
@@ -289,7 +174,7 @@
|
||||
#homepage-other .matter .matter-content .message-box .stats .item .num {
|
||||
font-family: "Arial-BoldMT", "Arial Bold", "Arial", sans-serif;
|
||||
font-weight: 700;
|
||||
color: #04b0d5;
|
||||
color: #50e3c2;
|
||||
}
|
||||
#homepage-other .matter .matter-content .message-box .stats .line {
|
||||
color: #d7d7d7;
|
||||
@@ -308,6 +193,7 @@
|
||||
border-radius: 5px;
|
||||
margin-right: 20px;
|
||||
margin-bottom: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
#homepage-other .matter .matter-content .message-box .tags .item .icon {
|
||||
height: 13px;
|
||||
@@ -365,6 +251,7 @@
|
||||
border: 1px solid #e9eef2;
|
||||
border-radius: 10px;
|
||||
flex-direction: column;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
#homepage-other .matter .matter-content .list-area .empty .empty-icon {
|
||||
width: 80px;
|
||||
|
||||
@@ -1,138 +1,6 @@
|
||||
#homepage-other {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
.head-top {
|
||||
margin-bottom: 30px;
|
||||
|
||||
.logo {
|
||||
height: 52px;
|
||||
}
|
||||
|
||||
.input-box {
|
||||
width: 370px;
|
||||
height: 40px;
|
||||
background-color: rgba(235, 235, 235, 1);
|
||||
border: 2px solid rgba(215, 215, 215, 1);
|
||||
border-radius: 11px;
|
||||
padding: 0 15px;
|
||||
justify-content: space-between;
|
||||
margin-right: 20px;
|
||||
|
||||
.input {
|
||||
border: none;
|
||||
outline: none;
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-left: 15rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.sign-in {
|
||||
width: 192px;
|
||||
height: 40px;
|
||||
border-radius: 83px;
|
||||
cursor: pointer;
|
||||
|
||||
&.sign-in-already {
|
||||
background-color: #ffffff;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
.sign-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
&.sign-in-no {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding-right: 8px;
|
||||
.sign-in-bj {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
width: 190px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.coin-bj {
|
||||
position: absolute;
|
||||
width: 157px;
|
||||
height: 33px;
|
||||
top: 4px;
|
||||
left: 29px;
|
||||
}
|
||||
|
||||
.coin-icon {
|
||||
width: 43px;
|
||||
height: 51px;
|
||||
align-self: flex-end;
|
||||
z-index: 1;
|
||||
margin-left: -2px;
|
||||
}
|
||||
|
||||
.text {
|
||||
text-align: center;
|
||||
text-shadow: 1px 1px 2px #a63603;
|
||||
-webkit-text-shadow: 1px 1px 2px #a63603;
|
||||
-moz-text-shadow: 1px 1px 2px #a63603;
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sign-go {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-family: "Arial-BoldMT", "Arial Bold", "Arial", sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
color: #710600;
|
||||
position: relative;
|
||||
|
||||
.sign-go-bj {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
.petal1,
|
||||
.petal2,
|
||||
.petal3 {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.petal1 {
|
||||
width: 24px;
|
||||
height: 10px;
|
||||
top: 3px;
|
||||
left: 55px;
|
||||
}
|
||||
|
||||
.petal2 {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
top: 25px;
|
||||
left: 92px;
|
||||
}
|
||||
.petal3 {
|
||||
width: 17px;
|
||||
height: 12px;
|
||||
top: 25px;
|
||||
left: 136px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.head-navigation {
|
||||
margin-bottom: 20px;
|
||||
@@ -201,7 +69,7 @@
|
||||
}
|
||||
|
||||
.medal-area {
|
||||
margin: 0 30px 36px;
|
||||
margin: 0 22px 36px 30px;
|
||||
align-self: self-start;
|
||||
|
||||
.title {
|
||||
@@ -211,7 +79,8 @@
|
||||
}
|
||||
|
||||
.list {
|
||||
flex-direction: row;
|
||||
flex-flow: wrap;
|
||||
|
||||
.item {
|
||||
height: 30px;
|
||||
max-width: 30px;
|
||||
@@ -230,6 +99,7 @@
|
||||
border-radius: 8px;
|
||||
font-size: 15px;
|
||||
color: #555555;
|
||||
cursor: pointer;
|
||||
|
||||
&:not(:last-of-type) {
|
||||
margin-bottom: 15px;
|
||||
@@ -275,7 +145,8 @@
|
||||
}
|
||||
|
||||
.icon {
|
||||
height: 40px;
|
||||
height: 20px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -329,7 +200,7 @@
|
||||
.num {
|
||||
font-family: "Arial-BoldMT", "Arial Bold", "Arial", sans-serif;
|
||||
font-weight: 700;
|
||||
color: #04b0d5;
|
||||
color: #50e3c2;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -351,6 +222,7 @@
|
||||
border-radius: 5px;
|
||||
margin-right: 20px;
|
||||
margin-bottom: 10px;
|
||||
cursor: pointer;
|
||||
|
||||
.icon {
|
||||
height: 13px;
|
||||
@@ -420,6 +292,8 @@
|
||||
border: 1px solid rgba(233, 238, 242, 1);
|
||||
border-radius: 10px;
|
||||
flex-direction: column;
|
||||
margin-bottom: 50px;
|
||||
|
||||
.empty-icon {
|
||||
width: 80px;
|
||||
height: 94px;
|
||||
|
||||
150
css/public.css
150
css/public.css
@@ -283,6 +283,7 @@ body {
|
||||
}
|
||||
.item-box.item-summary .list .item .school .icon {
|
||||
height: 24px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.item-box.item-summary .list .item .school .name {
|
||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||
@@ -356,7 +357,7 @@ body {
|
||||
color: #000000;
|
||||
}
|
||||
.item-box.item-vote .list {
|
||||
margin: 4px 20px 0;
|
||||
margin: 4px 20px 20px;
|
||||
overflow: hidden;
|
||||
max-height: 138px;
|
||||
}
|
||||
@@ -1246,3 +1247,150 @@ body {
|
||||
.offer-side-box.side-box .box {
|
||||
width: 271px;
|
||||
}
|
||||
.head-navigation {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.head-navigation .icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
.head-navigation .arrows {
|
||||
width: 7px;
|
||||
height: 12px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
.head-navigation .text {
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
text-decoration: none;
|
||||
max-width: 300px;
|
||||
}
|
||||
.head-navigation .text.textA:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.head-top {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.head-top .logo {
|
||||
height: 52px;
|
||||
}
|
||||
.head-top .input-box {
|
||||
width: 370px;
|
||||
height: 40px;
|
||||
background-color: #ebebeb;
|
||||
border: 2px solid #d7d7d7;
|
||||
border-radius: 11px;
|
||||
padding: 0 15px;
|
||||
justify-content: space-between;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.head-top .input-box .input {
|
||||
border: none;
|
||||
outline: none;
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
}
|
||||
.head-top .input-box .icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-left: 15rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head-top .sign-in {
|
||||
width: 192px;
|
||||
height: 40px;
|
||||
border-radius: 83px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head-top .sign-in.sign-in-already {
|
||||
background-color: #ffffff;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
}
|
||||
.head-top .sign-in.sign-in-already .sign-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.head-top .sign-in.sign-in-no {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding-right: 8px;
|
||||
}
|
||||
.head-top .sign-in.sign-in-no .sign-in-bj {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
width: 190px;
|
||||
height: 40px;
|
||||
}
|
||||
.head-top .sign-in.sign-in-no .coin-bj {
|
||||
position: absolute;
|
||||
width: 157px;
|
||||
height: 33px;
|
||||
top: 4px;
|
||||
left: 29px;
|
||||
}
|
||||
.head-top .sign-in.sign-in-no .coin-icon {
|
||||
width: 43px;
|
||||
height: 51px;
|
||||
align-self: flex-end;
|
||||
z-index: 1;
|
||||
margin-left: -2px;
|
||||
}
|
||||
.head-top .sign-in.sign-in-no .text {
|
||||
text-align: center;
|
||||
text-shadow: 1px 1px 2px #a63603;
|
||||
-webkit-text-shadow: 1px 1px 2px #a63603;
|
||||
-moz-text-shadow: 1px 1px 2px #a63603;
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
.head-top .sign-in.sign-in-no .sign-go {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-family: "Arial-BoldMT", "Arial Bold", "Arial", sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
color: #710600;
|
||||
position: relative;
|
||||
}
|
||||
.head-top .sign-in.sign-in-no .sign-go .sign-go-bj {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
.head-top .sign-in.sign-in-no .petal1,
|
||||
.head-top .sign-in.sign-in-no .petal2,
|
||||
.head-top .sign-in.sign-in-no .petal3 {
|
||||
position: absolute;
|
||||
}
|
||||
.head-top .sign-in.sign-in-no .petal1 {
|
||||
width: 24px;
|
||||
height: 10px;
|
||||
top: 3px;
|
||||
left: 55px;
|
||||
}
|
||||
.head-top .sign-in.sign-in-no .petal2 {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
top: 25px;
|
||||
left: 92px;
|
||||
}
|
||||
.head-top .sign-in.sign-in-no .petal3 {
|
||||
width: 17px;
|
||||
height: 12px;
|
||||
top: 25px;
|
||||
left: 136px;
|
||||
}
|
||||
.head-top .post-list .post-item {
|
||||
width: 84px;
|
||||
height: 34px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head-top .post-list .post-item:not(:last-child) {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
174
css/public.less
174
css/public.less
@@ -331,6 +331,7 @@ body {
|
||||
.school {
|
||||
.icon {
|
||||
height: 24px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.name {
|
||||
@@ -425,7 +426,7 @@ body {
|
||||
}
|
||||
|
||||
.list {
|
||||
margin: 4px 20px 0;
|
||||
margin: 4px 20px 20px;
|
||||
overflow: hidden;
|
||||
max-height: 138px;
|
||||
|
||||
@@ -1482,3 +1483,174 @@ body {
|
||||
.offer-side-box.side-box .box {
|
||||
width: 271px;
|
||||
}
|
||||
|
||||
.head-navigation {
|
||||
margin-bottom: 20px;
|
||||
.icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.arrows {
|
||||
width: 7px;
|
||||
height: 12px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.text {
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
text-decoration: none;
|
||||
max-width: 300px;
|
||||
|
||||
&.textA:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.head-top {
|
||||
margin-bottom: 30px;
|
||||
|
||||
.logo {
|
||||
height: 52px;
|
||||
}
|
||||
|
||||
.input-box {
|
||||
width: 370px;
|
||||
height: 40px;
|
||||
background-color: rgba(235, 235, 235, 1);
|
||||
border: 2px solid rgba(215, 215, 215, 1);
|
||||
border-radius: 11px;
|
||||
padding: 0 15px;
|
||||
justify-content: space-between;
|
||||
margin-right: 20px;
|
||||
|
||||
.input {
|
||||
border: none;
|
||||
outline: none;
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-left: 15rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.sign-in {
|
||||
width: 192px;
|
||||
height: 40px;
|
||||
border-radius: 83px;
|
||||
cursor: pointer;
|
||||
|
||||
&.sign-in-already {
|
||||
background-color: #ffffff;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
.sign-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
&.sign-in-no {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding-right: 8px;
|
||||
.sign-in-bj {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
width: 190px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.coin-bj {
|
||||
position: absolute;
|
||||
width: 157px;
|
||||
height: 33px;
|
||||
top: 4px;
|
||||
left: 29px;
|
||||
}
|
||||
|
||||
.coin-icon {
|
||||
width: 43px;
|
||||
height: 51px;
|
||||
align-self: flex-end;
|
||||
z-index: 1;
|
||||
margin-left: -2px;
|
||||
}
|
||||
|
||||
.text {
|
||||
text-align: center;
|
||||
text-shadow: 1px 1px 2px #a63603;
|
||||
-webkit-text-shadow: 1px 1px 2px #a63603;
|
||||
-moz-text-shadow: 1px 1px 2px #a63603;
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sign-go {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-family: "Arial-BoldMT", "Arial Bold", "Arial", sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
color: #710600;
|
||||
position: relative;
|
||||
|
||||
.sign-go-bj {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
.petal1,
|
||||
.petal2,
|
||||
.petal3 {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.petal1 {
|
||||
width: 24px;
|
||||
height: 10px;
|
||||
top: 3px;
|
||||
left: 55px;
|
||||
}
|
||||
|
||||
.petal2 {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
top: 25px;
|
||||
left: 92px;
|
||||
}
|
||||
.petal3 {
|
||||
width: 17px;
|
||||
height: 12px;
|
||||
top: 25px;
|
||||
left: 136px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.post-list {
|
||||
.post-item {
|
||||
width: 84px;
|
||||
height: 34px;
|
||||
cursor: pointer;
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
4
css/search.css
Normal file
4
css/search.css
Normal file
@@ -0,0 +1,4 @@
|
||||
#search {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
4
css/search.less
Normal file
4
css/search.less
Normal file
@@ -0,0 +1,4 @@
|
||||
#search {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
@@ -2,144 +2,6 @@
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
#sectionIndex .head-top {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
#sectionIndex .head-top .logo {
|
||||
height: 52px;
|
||||
}
|
||||
#sectionIndex .head-top .input-box {
|
||||
width: 370px;
|
||||
height: 40px;
|
||||
background-color: #ebebeb;
|
||||
border: 2px solid #d7d7d7;
|
||||
border-radius: 11px;
|
||||
padding: 0 15px;
|
||||
justify-content: space-between;
|
||||
margin-right: 20px;
|
||||
}
|
||||
#sectionIndex .head-top .input-box .input {
|
||||
border: none;
|
||||
outline: none;
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
}
|
||||
#sectionIndex .head-top .input-box .icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-left: 15rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in {
|
||||
width: 192px;
|
||||
height: 40px;
|
||||
border-radius: 83px;
|
||||
cursor: pointer;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-already {
|
||||
background-color: #ffffff;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-already .sign-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-no {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding-right: 8px;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-no .sign-in-bj {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
width: 190px;
|
||||
height: 40px;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-no .coin-bj {
|
||||
position: absolute;
|
||||
width: 157px;
|
||||
height: 33px;
|
||||
top: 4px;
|
||||
left: 29px;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-no .coin-icon {
|
||||
width: 43px;
|
||||
height: 51px;
|
||||
align-self: flex-end;
|
||||
z-index: 1;
|
||||
margin-left: -2px;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-no .text {
|
||||
text-align: center;
|
||||
text-shadow: 1px 1px 2px #a63603;
|
||||
-webkit-text-shadow: 1px 1px 2px #a63603;
|
||||
-moz-text-shadow: 1px 1px 2px #a63603;
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-no .sign-go {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-family: "Arial-BoldMT", "Arial Bold", "Arial", sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
color: #710600;
|
||||
position: relative;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-no .sign-go .sign-go-bj {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-no .petal1,
|
||||
#sectionIndex .head-top .sign-in.sign-in-no .petal2,
|
||||
#sectionIndex .head-top .sign-in.sign-in-no .petal3 {
|
||||
position: absolute;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-no .petal1 {
|
||||
width: 24px;
|
||||
height: 10px;
|
||||
top: 3px;
|
||||
left: 55px;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-no .petal2 {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
top: 25px;
|
||||
left: 92px;
|
||||
}
|
||||
#sectionIndex .head-top .sign-in.sign-in-no .petal3 {
|
||||
width: 17px;
|
||||
height: 12px;
|
||||
top: 25px;
|
||||
left: 136px;
|
||||
}
|
||||
#sectionIndex .head-navigation {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
#sectionIndex .head-navigation .icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
#sectionIndex .head-navigation .arrows {
|
||||
width: 7px;
|
||||
height: 12px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
#sectionIndex .head-navigation .text {
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
text-decoration: none;
|
||||
}
|
||||
#sectionIndex .head-navigation .text.textA:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
#sectionIndex .matter {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
@@ -1,163 +1,6 @@
|
||||
#sectionIndex {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
.head-top {
|
||||
margin-bottom: 30px;
|
||||
|
||||
.logo {
|
||||
height: 52px;
|
||||
}
|
||||
|
||||
.input-box {
|
||||
width: 370px;
|
||||
height: 40px;
|
||||
background-color: rgba(235, 235, 235, 1);
|
||||
border: 2px solid rgba(215, 215, 215, 1);
|
||||
border-radius: 11px;
|
||||
padding: 0 15px;
|
||||
justify-content: space-between;
|
||||
margin-right: 20px;
|
||||
|
||||
.input {
|
||||
border: none;
|
||||
outline: none;
|
||||
height: 100%;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-left: 15rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.sign-in {
|
||||
width: 192px;
|
||||
height: 40px;
|
||||
border-radius: 83px;
|
||||
cursor: pointer;
|
||||
|
||||
&.sign-in-already {
|
||||
background-color: #ffffff;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
.sign-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
&.sign-in-no {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding-right: 8px;
|
||||
.sign-in-bj {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
width: 190px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.coin-bj {
|
||||
position: absolute;
|
||||
width: 157px;
|
||||
height: 33px;
|
||||
top: 4px;
|
||||
left: 29px;
|
||||
}
|
||||
|
||||
.coin-icon {
|
||||
width: 43px;
|
||||
height: 51px;
|
||||
align-self: flex-end;
|
||||
z-index: 1;
|
||||
margin-left: -2px;
|
||||
}
|
||||
|
||||
.text {
|
||||
text-align: center;
|
||||
text-shadow: 1px 1px 2px #a63603;
|
||||
-webkit-text-shadow: 1px 1px 2px #a63603;
|
||||
-moz-text-shadow: 1px 1px 2px #a63603;
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sign-go {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-family: "Arial-BoldMT", "Arial Bold", "Arial", sans-serif;
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
color: #710600;
|
||||
position: relative;
|
||||
|
||||
.sign-go-bj {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
.petal1,
|
||||
.petal2,
|
||||
.petal3 {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.petal1 {
|
||||
width: 24px;
|
||||
height: 10px;
|
||||
top: 3px;
|
||||
left: 55px;
|
||||
}
|
||||
|
||||
.petal2 {
|
||||
width: 16px;
|
||||
height: 14px;
|
||||
top: 25px;
|
||||
left: 92px;
|
||||
}
|
||||
.petal3 {
|
||||
width: 17px;
|
||||
height: 12px;
|
||||
top: 25px;
|
||||
left: 136px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.head-navigation {
|
||||
margin-bottom: 20px;
|
||||
.icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.arrows {
|
||||
width: 7px;
|
||||
height: 12px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.text {
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
text-decoration: none;
|
||||
|
||||
&.textA:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.matter {
|
||||
align-items: flex-start;
|
||||
|
||||
854
details.html
854
details.html
@@ -1,492 +1,490 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>版块首页</title>
|
||||
<link rel="stylesheet" href="./css/public.css" />
|
||||
<link rel="stylesheet" href="./css/details.css" />
|
||||
<script src="./js/vue.global.js"></script>
|
||||
<style>
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container" id="details" v-cloak>
|
||||
<div class="head-top flexacenter">
|
||||
<img class="logo" src="https://oss.gter.net/logo" alt="" />
|
||||
<div class="flex1"></div>
|
||||
<div class="input-box flexacenter">
|
||||
<input class="input flex1" type="text" placeholder="大家都在搜：屯特" />
|
||||
<img class="icon" />
|
||||
</div>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>版块首页</title>
|
||||
<link rel="stylesheet" href="./css/public.css" />
|
||||
<link rel="stylesheet" href="./css/details.css" />
|
||||
<script src="./js/vue.global.js"></script>
|
||||
<style>
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<div class="post-list flexacenter">
|
||||
<img class="post-item" src="./img/post-thread.png" />
|
||||
<img class="post-item" src="./img/post-offer.png" />
|
||||
<img class="post-item" src="./img/post-summary.png" />
|
||||
<img class="post-item" src="./img/post-mj.png" />
|
||||
<img class="post-item" src="./img/post-vote.png" />
|
||||
</div>
|
||||
<body>
|
||||
<div class="container" id="details" v-cloak>
|
||||
<div class="head-top flexacenter">
|
||||
<img class="logo" src="https://oss.gter.net/logo" alt="" />
|
||||
<div class="flex1"></div>
|
||||
<div class="input-box flexacenter">
|
||||
<input class="input flex1" type="text" placeholder="大家都在搜：屯特" />
|
||||
<img class="icon" />
|
||||
</div>
|
||||
|
||||
<div class="head-navigation flexacenter">
|
||||
<img class="icon" src="./img/index-icon.png" />
|
||||
<a class="text textA" target="_blank" href="./">首页</a>
|
||||
<img class="arrows" src="./img/arrows-gray.svg" />
|
||||
<!-- <a class="text textA" target="_blank" href="./">首页</a>
|
||||
<div class="post-list flexacenter">
|
||||
<img class="post-item" src="./img/post-thread.png" />
|
||||
<img class="post-item" src="./img/post-offer.png" />
|
||||
<img class="post-item" src="./img/post-summary.png" />
|
||||
<img class="post-item" src="./img/post-mj.png" />
|
||||
<img class="post-item" src="./img/post-vote.png" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="head-navigation flexacenter">
|
||||
<img class="icon" src="./img/index-icon.png" />
|
||||
<a class="text textA" target="_blank" href="./">首页</a>
|
||||
<img class="arrows" src="./img/arrows-gray.svg" />
|
||||
<!-- <a class="text textA" target="_blank" href="./">首页</a>
|
||||
<img class="arrows" src="./img/arrows-gray.svg" /> -->
|
||||
<div class="text one-line-display">{{ info.title || info.content }}</div>
|
||||
</div>
|
||||
<div class="text one-line-display">{{ info.title || info.content }}</div>
|
||||
</div>
|
||||
|
||||
<div class="matter flexflex">
|
||||
<div class="matter-left">
|
||||
<div class="block">
|
||||
<div class="matter-head flexacenter">
|
||||
<img class="avatar" :src="authorInfo?.avatar" alt="" />
|
||||
<div class="content flex1 flexflex">
|
||||
<div class="name flexacenter" bind:tap="goPersonalHomepage">
|
||||
<div>{{ authorInfo.nickname || '匿名用户' }}</div>
|
||||
{{ authorInfo.group?.image }}
|
||||
<img v-if="authorInfo.group?.image" class="icon" :src="authorInfo.group?.image" />
|
||||
</div>
|
||||
<div class="time">{{ timestamp }}</div>
|
||||
</div>
|
||||
<div class="operate flexacenter">
|
||||
<div class="view flexacenter">
|
||||
<img class="icon" src="./img/eye-icon.svg" />
|
||||
<div class="text">{{ info.views || 0 }}</div>
|
||||
</div>
|
||||
|
||||
<div class="btn flexcenter" bind:tap="cutShow">
|
||||
<img class="icon" src="./img/dot-dot-dot-gray.png" />
|
||||
</div>
|
||||
<div class="matter flexflex">
|
||||
<div class="matter-left">
|
||||
<div class="block">
|
||||
<div class="matter-head flexacenter">
|
||||
<img class="avatar" :src="authorInfo?.avatar" alt="" />
|
||||
<div class="content flex1 flexflex">
|
||||
<div class="name flexacenter" bind:tap="goPersonalHomepage">
|
||||
<div>{{ authorInfo.nickname || '匿名用户' }}</div>
|
||||
{{ authorInfo.group?.image }}
|
||||
<img v-if="authorInfo.group?.image" class="icon" :src="authorInfo.group?.image" />
|
||||
</div>
|
||||
<div class="time">{{ timestamp }}</div>
|
||||
</div>
|
||||
|
||||
<div class="label flexflex" v-if="sectionn.length || tags.length || info.recommend == 1 || info.best == 1">
|
||||
<img class="item icon" v-if="info.recommend == 1 && info.best != 1" src="./img/recommend-icon.png" />
|
||||
<img class="item icon" v-if="info.best == 1" src="./img/essence-icon.png" />
|
||||
<div class="item blue" v-for="(item, index) in sectionn" :key="item">{{ item }}</div>
|
||||
<div class="item" v-for="(item, index) in tags" :key="item">{{ item }}</div>
|
||||
</div>
|
||||
|
||||
<div class="title" v-if="info.title">{{ info.title }}</div>
|
||||
|
||||
<div class="html" v-html="info.content"></div>
|
||||
|
||||
<div class="last-time">最后编辑：{{ updatedTime || timestamp }}</div>
|
||||
<div class="action-bar flexacenter">
|
||||
<div class="action-bar-item flexacenter" @click="likeClick()">
|
||||
<img v-if="islike" class="icon" src="./img/like-red-icon.png" />
|
||||
<img v-else class="icon" src="./img/like-black-icon.png" />
|
||||
<div class="text">{{ info.likes || "赞" }}</div>
|
||||
<div class="operate flexacenter">
|
||||
<div class="view flexacenter">
|
||||
<img class="icon" src="./img/eye-icon.svg" />
|
||||
<div class="text">{{ info.views || 0 }}</div>
|
||||
</div>
|
||||
<div class="action-bar-item flexacenter" @click="collectClick()">
|
||||
<img v-if="iscollect" class="icon" src="./img/collect-golden.svg" />
|
||||
<img v-else class="icon" src="./img/collect-black-icon.png" />
|
||||
<div class="text">{{ info.collections || "收藏" }}</div>
|
||||
</div>
|
||||
<div class="action-bar-item flexacenter">
|
||||
<img class="icon" src="./img/discuss-black-icon.png" />
|
||||
<div class="text">{{ info.comments || "讨论" }}</div>
|
||||
</div>
|
||||
<div class="action-bar-item flexacenter" @click="openCoinBox">
|
||||
<img class="icon" src="./img/bi-black-icon.png" />
|
||||
<div class="text">{{ info.coins || "投币" }}</div>
|
||||
</div>
|
||||
<div class="action-bar-item flexacenter">
|
||||
<img class="icon" src="./img/share-black-icon.png" />
|
||||
<div class="text">转发</div>
|
||||
|
||||
<div class="btn flexcenter" bind:tap="cutShow">
|
||||
<img class="icon" src="./img/dot-dot-dot-gray.png" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="block related" v-if="relatedList.length > 0">
|
||||
<div class="related-head flexacenter">
|
||||
<div class="text">相关帖子</div>
|
||||
<div class="time">Updated by {{ relatedTime }}</div>
|
||||
</div>
|
||||
<div class="list flexflex">
|
||||
<div class="item flexacenter" v-for="item in relatedList" :key="item.id">
|
||||
<div class="dot"></div>
|
||||
<div class="text one-line-display">{{ item.title || '无标题' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="label flexflex" v-if="sectionn.length || tags.length || info.recommend == 1 || info.best == 1">
|
||||
<img class="item icon" v-if="info.recommend == 1 && info.best != 1" src="./img/recommend-icon.png" />
|
||||
<img class="item icon" v-if="info.best == 1" src="./img/essence-icon.png" />
|
||||
<div class="item blue" v-for="(item, index) in sectionn" :key="item">{{ item }}</div>
|
||||
<div class="item" v-for="(item, index) in tags" :key="item">{{ item }}</div>
|
||||
</div>
|
||||
|
||||
<div class="answer-discuss">
|
||||
<!-- <el-dialog title="提示" :visible.sync="dialogVisible" width="30%">
|
||||
<div class="title" v-if="info.title">{{ info.title }}</div>
|
||||
|
||||
<div class="html" v-html="info.content"></div>
|
||||
|
||||
<div class="last-time">最后编辑：{{ updatedTime || timestamp }}</div>
|
||||
<div class="action-bar flexacenter">
|
||||
<div class="action-bar-item flexacenter" @click="likeClick()">
|
||||
<img v-if="islike" class="icon" src="./img/like-red-icon.png" />
|
||||
<img v-else class="icon" src="./img/like-black-icon.png" />
|
||||
<div class="text">{{ info.likes || "赞" }}</div>
|
||||
</div>
|
||||
<div class="action-bar-item flexacenter" @click="collectClick()">
|
||||
<img v-if="iscollect" class="icon" src="./img/collect-golden.svg" />
|
||||
<img v-else class="icon" src="./img/collect-black-icon.png" />
|
||||
<div class="text">{{ info.collections || "收藏" }}</div>
|
||||
</div>
|
||||
<div class="action-bar-item flexacenter" @click="openDiscuss">
|
||||
<img class="icon" src="./img/discuss-black-icon.png" />
|
||||
<div class="text">{{ info.comments || "讨论" }}</div>
|
||||
</div>
|
||||
<div class="action-bar-item flexacenter" @click="openCoinBox">
|
||||
<img class="icon" src="./img/bi-black-icon.png" />
|
||||
<div class="text">{{ info.coins || "投币" }}</div>
|
||||
</div>
|
||||
<div class="action-bar-item flexacenter">
|
||||
<img class="icon" src="./img/share-black-icon.png" />
|
||||
<div class="text">转发</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="block related" v-if="relatedList.length > 0">
|
||||
<div class="related-head flexacenter">
|
||||
<div class="text">相关帖子</div>
|
||||
<div class="time">Updated by {{ relatedTime }}</div>
|
||||
</div>
|
||||
<div class="list flexflex">
|
||||
<div class="item flexacenter" v-for="item in relatedList" :key="item.id">
|
||||
<div class="dot"></div>
|
||||
<div class="text one-line-display">{{ item.title || '无标题' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="answer-discuss">
|
||||
<!-- <el-dialog title="提示" :visible.sync="dialogVisible" width="30%">
|
||||
<span>确定删除该讨论吗？</span>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="confirmCommentDelete">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog> -->
|
||||
<div v-if="emojiMaskState" class="emoji-box-mask" @click="closeEmoji()"></div>
|
||||
<div v-if="emojiMaskState" class="emoji-box-mask" @click="closeEmoji()"></div>
|
||||
|
||||
<!-- 大图 -->
|
||||
<div class="detail-image-mask flexcenter" v-if="dialogSrc" @click="dialogSrc = ''">
|
||||
<div class="detail-image flexcenter">
|
||||
<img class="detail-img" :src="dialogSrc" />
|
||||
<!-- 大图 -->
|
||||
<div class="detail-image-mask flexcenter" v-if="dialogSrc" @click="dialogSrc = ''">
|
||||
<div class="detail-image flexcenter">
|
||||
<img class="detail-img" :src="dialogSrc" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 编辑评论 -->
|
||||
<div v-if="editCommentState" class="edit-comment flexcenter">
|
||||
<div class="box">
|
||||
<div class="text">编辑评论</div>
|
||||
<div class="input-box">
|
||||
<div class="top flexflex">
|
||||
<textarea ref="editInputRef" class="input-textarea flex1" maxlength="500" v-model="editInput" @focus="judgeLogin" @input="autoResize" @paste="handleInputPaste" placeholder="说说你的想法或疑问…"></textarea>
|
||||
</div>
|
||||
<div class="picture-box flexacenter" v-if="editPicture.length != 0">
|
||||
<div class="picture" v-for="(item, index) in editPicture" :key="item.url">
|
||||
<img class="close" @click="closeEditFileUpload(item.aid)" src="./img/close-icon.png" />
|
||||
<img class="img" @click="handleAnswerText" :src="item.url" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bottom flexacenter">
|
||||
<div class="operate flexacenter">
|
||||
<div class="item" :class="{ 'pitch': editEmojiState }" style="z-index: 2">
|
||||
<img class="icon" src="./img/smiling-face.png" @click="openEditEmoji()" alt="" />
|
||||
<div v-if="editEmojiState" class="emoji-edit-box-mask" @click="closeEditEmoji()"></div>
|
||||
<div class="emoji-box">
|
||||
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEditEmoji(item)">{{ item }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item flexacenter" @click="handleEditFile()">
|
||||
<input class="file" type="file" @change="handleFileUpload($event)" accept=".png, .jpg, .jpeg" />
|
||||
<img class="icon" style="border-radius: 0" src="./img/picture-icon.png" alt="" />
|
||||
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-list flexacenter">
|
||||
<div class="btn" @click="closeEdit()">取消</div>
|
||||
<div class="btn send" @click="postEditComment()">发送</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header flexacenter">
|
||||
讨论
|
||||
<span class="num">{{ commentTotalCount || "" }}</span>
|
||||
</div>
|
||||
<div class="input-box">
|
||||
<div class="top flexflex">
|
||||
<img class="avatar" v-if="userInfoWin.avatar" :src="userInfoWin.avatar" />
|
||||
<textarea ref="input-textarea" class="input-textarea flex1" maxlength="500" @focus="judgeLogin" v-model="inputTextarea" @input="autoResize" @paste="handleInputPaste" placeholder="说说你的看法…"></textarea>
|
||||
</div>
|
||||
<div class="picture-box flexacenter" v-if="picture.length != 0">
|
||||
<div class="picture" v-for="(item, index) in picture" :key="index">
|
||||
<img class="close" @click="closePictureUpload(index)" src="./img/close-icon.png" />
|
||||
<img class="img" @click="handleAnswerText" :src="item.url" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 编辑评论 -->
|
||||
<div v-if="editCommentState" class="edit-comment flexcenter">
|
||||
<div class="box">
|
||||
<div class="text">编辑评论</div>
|
||||
<div class="input-box">
|
||||
<div class="top flexflex">
|
||||
<textarea ref="editInputRef" class="input-textarea flex1" maxlength="500" v-model="editInput" @focus="judgeLogin" @input="autoResize" @paste="handleInputPaste" placeholder="说说你的想法或疑问…"></textarea>
|
||||
<div class="bottom flexacenter">
|
||||
<div class="operate flexacenter">
|
||||
<div class="item" :class="{ 'pitch': emojiState }" style="z-index: 2">
|
||||
<img class="icon" src="./img/smiling-face.png" @click="openEmoji()" alt="" />
|
||||
<div class="emoji-box">
|
||||
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEmoji(item)">{{ item }}</div>
|
||||
</div>
|
||||
<div class="picture-box" v-if="editPicture.url">
|
||||
<div class="picture">
|
||||
<img class="close" @click="closeEditFileUpload()" src="./img/close-icon.png" />
|
||||
<img class="img" @click="handleAnswerText" :src="editPicture.base64 || editPicture.url" />
|
||||
</div>
|
||||
<div class="item flexacenter" @click="judgeLogin()">
|
||||
<input class="file" type="file" @change="handleFileUpload($event)" accept=".png, .jpg, .jpeg" />
|
||||
<img class="icon" style="border-radius: 0" src="./img/picture-icon.png" />
|
||||
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn" @click="submitAnswerComments()">发送</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comments-box" v-if="commentTotalCount != 0">
|
||||
<div class="comments-item" v-for="(item, index) in commentList" :key="index">
|
||||
<div class="comments-header flexacenter">
|
||||
<div class="comments-header-left flexacenter">
|
||||
<img class="comments-avatar" @click="openUserInfo(index)" :src="item.avatar || item.user['avatar']" />
|
||||
<div class="comments-username" @click="openUserInfo(index)">{{ item.nickname || item.user["nickname"] || "匿名用户" }}</div>
|
||||
<div class="comments-time">{{ item["timestamp"] }}</div>
|
||||
<div class="comments-identity" v-if="item['isauthor'] == 1">作者</div>
|
||||
<img class="comments-title" v-if="item.groupimage || item?.user?.groupimage" :src="item.groupimage || item?.user?.groupimage" :alt="item?.user?.grouptitle" style="height: 18px" />
|
||||
|
||||
<div class="avatar-box flexflex" v-if="item['avatarState']">
|
||||
<a class="avatar-item flexcenter" target="_blank" @click.prevent="sendMessage(item.uin || item.user['uin'])">
|
||||
<img class="avatar-icon" src="./img/send-messages-icon.png" />
|
||||
发送信息
|
||||
</a>
|
||||
<a class="avatar-item flexcenter" target="_blank" @click.prevent="TAHomePage(item.uin || item.user['uin'])">
|
||||
<img class="avatar-icon" src="./img/homepage-icon.png" />
|
||||
TA的主页
|
||||
</a>
|
||||
<div class="avatar-mask" @click="closeUserInfo(index)"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comments-header-right flexacenter">
|
||||
<div class="menu-box flexacenter">
|
||||
<img class="menu-icon" src="./img/menu-icon-gray.svg" />
|
||||
<!-- <div class="report-box flexcenter">举报</div> -->
|
||||
<div class="operate-box">
|
||||
<div class="item flexcenter" @click="commentReport(item['token'])">举报</div>
|
||||
<div class="item flexcenter" v-if="permissions.includes('comment.edit')" @click="openEdit(item['token'], index)">编辑</div>
|
||||
<div class="item flexcenter" v-if="permissions.includes('comment.delete')" @click="commentDelete(item['token'], index)">删除</div>
|
||||
</div>
|
||||
</div>
|
||||
<img class="comment-icon" @click="openAnswerCommentsChild(index)" src="./img/comment-icon-gray.svg" />
|
||||
<div class="flexacenter like-box" @click="operateAnswerCommentsLike(item.token, index)">
|
||||
<img class="like-icon" v-if="item['islike'] == 0" src="./img/like-icon-gray.png" />
|
||||
<img class="like-icon" v-else src="./img/like-red-pitch.png" />
|
||||
<div class="like-quantity">{{ item["likenum"] || "" }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comments-content">
|
||||
<div class="comments-text" v-if="item['content']" v-html="item['content']"></div>
|
||||
<div class="comments-img-box">
|
||||
<img class="comments-img" v-for="(item, index) in item.attachments.images" @click="handleAnswerText" :src="item.thumb || item.url" />
|
||||
</div>
|
||||
<div class="input-box" v-if="item['childState']">
|
||||
<img class="cross" @click="closeAnswerCommentsChild(index)" src="./img/cross-icon.png" />
|
||||
<div class="top flexflex">
|
||||
<textarea class="input-textarea flex1" maxlength="500" placeholder="说说你的看法…" @focus="judgeLogin" v-model="item['commentInput']" @input="autoResize" @paste="handleInputPaste($event, index)"></textarea>
|
||||
</div>
|
||||
<div class="picture-box flexacenter" v-if="item?.picture?.length != 0">
|
||||
<div class="picture" v-for="it in item.picture" :key="it.url">
|
||||
<img class="close" @click="closeFileUpload(it.aid, index)" src="./img/close-icon.png" />
|
||||
<img class="img" @click="handleAnswerText" :src="it.url" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bottom flexacenter">
|
||||
<div class="operate flexacenter">
|
||||
<div class="item" :class="{ 'pitch': editEmojiState }" style="z-index: 2">
|
||||
<img class="icon" src="./img/smiling-face.png" @click="openEditEmoji()" alt="" />
|
||||
<div v-if="editEmojiState" class="emoji-edit-box-mask" @click="closeEditEmoji()"></div>
|
||||
<div class="item" :class="{ 'pitch': item.emojiState }" style="z-index: 2">
|
||||
<img class="icon" src="./img/smiling-face.png" @click="openEmoji(index)" alt="" />
|
||||
<div class="emoji-box">
|
||||
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEditEmoji(item)">{{ item }}</div>
|
||||
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEmoji(item, index)">{{ item }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item flexacenter" @click="handleEditFile()">
|
||||
<input class="file" type="file" @change="handleFileUpload($event)" accept=".png, .jpg, .jpeg" />
|
||||
<img class="icon" style="border-radius: 0" src="./img/picture-icon.png" alt="" />
|
||||
<div class="item flexacenter" @click="judgeLogin()">
|
||||
<input class="file" type="file" @change="handleFileUpload($event, index)" accept=".png, .jpg, .jpeg" />
|
||||
<img class="icon" style="border-radius: 0" src="./img/picture-icon.png" />
|
||||
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn" @click="submitAnswerComments(index)">发送</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-list flexacenter">
|
||||
<div class="btn" @click="closeEdit()">取消</div>
|
||||
<div class="btn send" @click="postEditComment()">发送</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header flexacenter">
|
||||
讨论
|
||||
<span class="num">{{ commentTotalCount || "" }}</span>
|
||||
</div>
|
||||
<div class="input-box">
|
||||
<div class="top flexflex">
|
||||
<img class="avatar" v-if="userInfoWin.avatar" :src="userInfoWin.avatar" />
|
||||
<textarea ref="input-textarea" class="input-textarea flex1" maxlength="500" @focus="judgeLogin" v-model="inputTextarea" @input="autoResize" @paste="handleInputPaste" placeholder="说说你的看法…"></textarea>
|
||||
</div>
|
||||
<div class="picture-box" v-if="picture.url">
|
||||
<div class="picture">
|
||||
<img class="close" @click="closeFileUpload()" src="./img/close-icon.png" />
|
||||
<img class="img" @click="handleAnswerText" :src="picture.base64 || picture.url" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bottom flexacenter">
|
||||
<div class="operate flexacenter">
|
||||
<div class="item" :class="{ 'pitch': emojiState }" style="z-index: 2">
|
||||
<img class="icon" src="./img/smiling-face.png" @click="openEmoji()" alt="" />
|
||||
<div class="emoji-box">
|
||||
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEmoji(item)">{{ item }}</div>
|
||||
<div class="child-comments" v-if="item['child'].length != 0">
|
||||
<div class="comments-item" v-for="(ite, i) in item['child']" :key="ite.id">
|
||||
<div class="comments-header flexacenter">
|
||||
<div class="comments-header-left flexacenter">
|
||||
<img class="comments-avatar" @click="openUserInfo(index, i)" :src="ite.avatar || ite.user['avatar']" />
|
||||
<div class="comments-username" @click="openUserInfo(index, i)">{{ ite.nickname || ite.user["nickname"] || "匿名用户" }}</div>
|
||||
<div class="comments-time">{{ ite["timestamp"] }}</div>
|
||||
<div class="comments-identity" v-if="ite['isauthor'] == 1">作者</div>
|
||||
<img class="comments-title" v-if="ite.groupimage || ite.user?.groupimage" :src="ite.groupimage || ite.user?.groupimage" :alt="ite?.user?.grouptitle" style="height: 18px" />
|
||||
<div class="avatar-box flexflex" v-if="ite['avatarState']">
|
||||
<a class="avatar-item flexcenter" target="_blank" @click.prevent="sendMessage(ite.uin || ite.user['uin'])">
|
||||
<img class="avatar-icon" src="./img/send-messages-icon.png" />
|
||||
发送信息
|
||||
</a>
|
||||
<a class="avatar-item flexcenter" target="_blank" @click.prevent="TAHomePage(ite.uin || ite.user['uin'])">
|
||||
<img class="avatar-icon" src="./img/homepage-icon.png" />
|
||||
TA的主页
|
||||
</a>
|
||||
<div class="avatar-mask" @click="closeUserInfo(index, i)"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comments-header-right flexacenter">
|
||||
<div class="menu-box flexacenter">
|
||||
<img class="menu-icon" src="./img/menu-icon-gray.svg" />
|
||||
<div class="operate-box">
|
||||
<div class="item flexcenter" @click="commentReport(ite['token'])">举报</div>
|
||||
<div class="item flexcenter" v-if="permissions.includes('comment.edit')" @click="openEdit(ite['token'], index, i)">编辑</div>
|
||||
<div class="item flexcenter" v-if="permissions.includes('comment.delete')" @click="commentDelete(ite['token'], index, i)">删除</div>
|
||||
</div>
|
||||
</div>
|
||||
<img class="comment-icon" @click="openAnswerCommentsChild(index, i)" src="./img/comment-icon-gray.svg" />
|
||||
<div class="flexacenter like-box" @click="operateAnswerCommentsLike(ite.token, index, i)">
|
||||
<img class="like-icon" v-if="ite['islike'] == 0" src="./img/like-icon-gray.png" />
|
||||
<img class="like-icon" v-else src="./img/like-red-pitch.png" />
|
||||
<div class="like-quantity">{{ ite["likenum"] || "" }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item flexacenter" @click="judgeLogin()">
|
||||
<input class="file" type="file" @change="handleFileUpload($event)" accept=".png, .jpg, .jpeg" />
|
||||
<img class="icon" style="border-radius: 0" src="./img/picture-icon.png" />
|
||||
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn" @click="submitAnswerComments()">发送</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comments-box" v-if="commentTotalCount != 0">
|
||||
<div class="comments-item" v-for="(item, index) in commentList" :key="index">
|
||||
<div class="comments-header flexacenter">
|
||||
<div class="comments-header-left flexacenter">
|
||||
<img class="comments-avatar" @click="openUserInfo(index)" :src="item.user['avatar']" />
|
||||
<div class="comments-username" @click="openUserInfo(index)">{{ item.user["nickname"] || "匿名用户" }}</div>
|
||||
<div class="comments-time">{{ item["timestamp"] }}</div>
|
||||
<div class="comments-identity" v-if="item['isauthor'] == 1">作者</div>
|
||||
<img class="comments-title" v-if="item.user['groupimage']" :src="item.user['groupimage']" :alt="item.user['grouptitle']" style="height: 18px" />
|
||||
|
||||
<div class="avatar-box flexflex" v-if="item['avatarState']">
|
||||
<a class="avatar-item flexcenter" target="_blank" @click.prevent="sendMessage(item.user['uin'])">
|
||||
<img class="avatar-icon" src="./img/send-messages-icon.png" />
|
||||
发送信息
|
||||
</a>
|
||||
<a class="avatar-item flexcenter" target="_blank" @click.prevent="TAHomePage(item.user['uin'])">
|
||||
<img class="avatar-icon" src="./img/homepage-icon.png" />
|
||||
TA的主页
|
||||
</a>
|
||||
<div class="avatar-mask" @click="closeUserInfo(index)"></div>
|
||||
<div class="comments-content">
|
||||
<div class="comments-text" v-if="ite['content']">
|
||||
<div class="comments-reply" v-if="ite?.reply?.nickname">@{{ ite["reply"]["nickname"] || "匿名用户" }}</div>
|
||||
<span v-html="ite['content']"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comments-header-right flexacenter">
|
||||
<div class="menu-box flexacenter">
|
||||
<img class="menu-icon" src="./img/menu-icon-gray.svg" />
|
||||
<!-- <div class="report-box flexcenter">举报</div> -->
|
||||
<div class="operate-box">
|
||||
<div class="item flexcenter" @click="commentReport(item['token'])">举报</div>
|
||||
<div class="item flexcenter" v-if="permissions.includes('comment.edit')" @click="openEdit(item['token'], index)">编辑</div>
|
||||
<div class="item flexcenter" v-if="permissions.includes('comment.delete')" @click="commentDelete(item['token'], index)">删除</div>
|
||||
<div class="comments-img-box">
|
||||
<img class="comments-img" v-for="(item, index) in ite.attachments.images" @click="handleAnswerText" :src="item.thumb || item.url" />
|
||||
</div>
|
||||
<div class="input-box" v-if="ite['childState']">
|
||||
<img class="cross" @click="closeAnswerCommentsChild(index)" src="./img/cross-icon.png" />
|
||||
<div class="top flexflex">
|
||||
<textarea class="input-textarea flex1" maxlength="500" v-model="ite['commentInput']" @focus="judgeLogin" :placeholder="'回复“' + (ite.nickname || ite.user['nickname'] || '匿名用户') + '”：'" @input="autoResize" @paste="handleInputPaste($event, index, i)"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<img class="comment-icon" @click="openAnswerCommentsChild(index)" src="./img/comment-icon-gray.svg" />
|
||||
<div class="flexacenter like-box" @click="operateAnswerCommentsLike(item.token, index)">
|
||||
<img class="like-icon" v-if="item['islike'] == 0" src="./img/like-icon-gray.png" />
|
||||
<img class="like-icon" v-else src="./img/like-red-pitch.png" />
|
||||
<div class="like-quantity">{{ item["likenum"] || "" }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comments-content">
|
||||
<div class="comments-text" v-if="item['content']" v-html="item['content']"></div>
|
||||
<div class="comments-img-box">
|
||||
<img class="comments-img" v-for="(item, index) in item.attachments.images" @click="handleAnswerText" :src="item.thumb || item.url" />
|
||||
<img class="comments-img" v-for="(item, index) in item.attachments.images" @click="handleAnswerText" :src="item.thumb || item.url" />
|
||||
<img class="comments-img" v-for="(item, index) in item.attachments.images" @click="handleAnswerText" :src="item.thumb || item.url" />
|
||||
<img class="comments-img" v-for="(item, index) in item.attachments.images" @click="handleAnswerText" :src="item.thumb || item.url" />
|
||||
</div>
|
||||
<div class="input-box" v-if="item['childState']">
|
||||
<img class="cross" @click="closeAnswerCommentsChild(index)" src="./img/cross-icon.png" />
|
||||
<div class="top flexflex">
|
||||
<textarea class="input-textarea flex1" maxlength="500" placeholder="说说你的看法…" @focus="judgeLogin" v-model="item['commentInput']" @input="autoResize" @paste="handleInputPaste($event, index)"></textarea>
|
||||
</div>
|
||||
<div class="picture-box" v-if="item.picture?.url">
|
||||
<div class="picture">
|
||||
<img class="close" @click="closeFileUpload(index)" src="./img/close-icon.png" />
|
||||
<img class="img" @click="handleAnswerText" :src="item.picture.base64 || item.picture.url" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom flexacenter">
|
||||
<div class="operate flexacenter">
|
||||
<div class="item" :class="{ 'pitch': item.emojiState }" style="z-index: 2">
|
||||
<img class="icon" src="./img/smiling-face.png" @click="openEmoji(index)" alt="" />
|
||||
<div class="emoji-box">
|
||||
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEmoji(item, index)">{{ item }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item flexacenter" @click="judgeLogin()">
|
||||
<input class="file" type="file" @change="handleFileUpload($event, index)" accept=".png, .jpg, .jpeg" />
|
||||
<img class="icon" style="border-radius: 0" src="./img/picture-icon.png" />
|
||||
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
|
||||
<div class="picture-box flexacenter" v-if="ite.picture?.length != 0">
|
||||
<div class="picture" v-for="it in ite.picture" :key="it.url">
|
||||
<img class="close" @click="closeFileUpload(it.aid, index, i)" src="./img/close-icon.png" />
|
||||
<img class="img" @click="handleAnswerText" :src="it.url" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn" @click="submitAnswerComments(index)">发送</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="child-comments" v-if="item['child'].length != 0">
|
||||
<div class="comments-item" v-for="(ite, i) in item['child']" :key="ite.id">
|
||||
<div class="comments-header flexacenter">
|
||||
<div class="comments-header-left flexacenter">
|
||||
<img class="comments-avatar" @click="openUserInfo(index, i)" :src="ite.user['avatar']" />
|
||||
<div class="comments-username" @click="openUserInfo(index, i)">{{ ite.user["nickname"] || "匿名用户" }}</div>
|
||||
<div class="comments-time">{{ ite["timestamp"] }}</div>
|
||||
<div class="comments-identity" v-if="ite['isauthor'] == 1">作者</div>
|
||||
<img class="comments-title" v-if="ite.user['groupimage']" :src="ite.user['groupimage']" :alt="ite.user['grouptitle']" style="height: 18px" />
|
||||
<div class="avatar-box flexflex" v-if="ite['avatarState']">
|
||||
<a class="avatar-item flexcenter" target="_blank" @click.prevent="sendMessage(ite.user['uin'])">
|
||||
<img class="avatar-icon" src="./img/send-messages-icon.png" />
|
||||
发送信息
|
||||
</a>
|
||||
<a class="avatar-item flexcenter" target="_blank" @click.prevent="TAHomePage(ite.user['uin'])">
|
||||
<img class="avatar-icon" src="./img/homepage-icon.png" />
|
||||
TA的主页
|
||||
</a>
|
||||
<div class="avatar-mask" @click="closeUserInfo(index, i)"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comments-header-right flexacenter">
|
||||
<div class="menu-box flexacenter">
|
||||
<img class="menu-icon" src="./img/menu-icon-gray.svg" />
|
||||
<div class="operate-box">
|
||||
<div class="item flexcenter" @click="commentReport(ite['token'])">举报</div>
|
||||
<div class="item flexcenter" v-if="permissions.includes('comment.edit')" @click="openEdit(ite['token'], index, i)">编辑</div>
|
||||
<div class="item flexcenter" v-if="permissions.includes('comment.delete')" @click="commentDelete(ite['token'], index, i)">删除</div>
|
||||
</div>
|
||||
</div>
|
||||
<img class="comment-icon" @click="openAnswerCommentsChild(index, i)" src="./img/comment-icon-gray.svg" />
|
||||
<div class="flexacenter like-box" @click="operateAnswerCommentsLike(ite.token, index, i)">
|
||||
<img class="like-icon" v-if="ite['islike'] == 0" src="./img/like-icon-gray.png" />
|
||||
<img class="like-icon" v-else src="./img/like-red-pitch.png" />
|
||||
<div class="like-quantity">{{ ite["likenum"] || "" }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comments-content">
|
||||
<div class="comments-text" v-if="ite['content']">
|
||||
<div class="comments-reply" v-if="ite?.reply?.nickname">@{{ ite["reply"]["nickname"] || "匿名用户" }}</div>
|
||||
<span v-html="ite['content']"></span>
|
||||
</div>
|
||||
<div class="comments-img-box">
|
||||
<img class="comments-img" v-for="(item, index) in ite.attachments.images" @click="handleAnswerText" :src="item.thumb || item.url" />
|
||||
</div>
|
||||
<img class="comments-img" @click="handleAnswerText" :src="ite.image?.base64 || ite.image?.url" v-if="ite.image?.url" />
|
||||
<div class="input-box" v-if="ite['childState']">
|
||||
<img class="cross" @click="closeAnswerCommentsChild(index)" src="./img/cross-icon.png" />
|
||||
<div class="top flexflex">
|
||||
<textarea class="input-textarea flex1" maxlength="500" v-model="ite['commentInput']" @focus="judgeLogin" :placeholder="'回复“' + (ite.user['nickname'] || '匿名用户') + '”：'" @input="autoResize" @paste="handleInputPaste($event, index, i)"></textarea>
|
||||
</div>
|
||||
<div class="picture-box" v-if="ite.picture?.url">
|
||||
<div class="picture">
|
||||
<img class="close" @click="closeFileUpload(index, i)" src="./img/close-icon.png" />
|
||||
<img class="img" @click="handleAnswerText" :src="ite.picture.base64 || ite.picture.url" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom flexacenter">
|
||||
<div class="operate flexacenter">
|
||||
<div class="item" :class="{ 'pitch': ite.emojiState }" style="z-index: 2">
|
||||
<img class="icon" src="./img/smiling-face.png" @click="openEmoji(index, i)" alt="" />
|
||||
<div class="emoji-box">
|
||||
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEmoji(item, index, i)">{{ item }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item flexacenter" @click="judgeLogin()">
|
||||
<input class="file" type="file" @change="handleFileUpload($event, index, i)" accept=".png, .jpg, .jpeg" />
|
||||
<img class="icon" style="border-radius: 0" src="./img/picture-icon.png" />
|
||||
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
|
||||
<div class="bottom flexacenter">
|
||||
<div class="operate flexacenter">
|
||||
<div class="item" :class="{ 'pitch': ite.emojiState }" style="z-index: 2">
|
||||
<img class="icon" src="./img/smiling-face.png" @click="openEmoji(index, i)" alt="" />
|
||||
<div class="emoji-box">
|
||||
<div class="emoji-icon" v-for="item in emojiData" :key="item" @click="selectEmoji(item, index, i)">{{ item }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn" @click="submitAnswerComments(index, i)">发送</div>
|
||||
<div class="item flexacenter" @click="judgeLogin()">
|
||||
<input class="file" type="file" @change="handleFileUpload($event, index, i)" accept=".png, .jpg, .jpeg" />
|
||||
<img class="icon" style="border-radius: 0" src="./img/picture-icon.png" />
|
||||
<span class="file-hint">最多可上传1张图片，支持在输入框中直接粘贴图片。</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn" @click="submitAnswerComments(index, i)">发送</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="comments-also flexacenter" v-if="item['childnum'] > item['child'].length" @click="alsoCommentsData(index, i)">
|
||||
<div class>还有{{ item["childnum"] - item.child.length }}条回复</div>
|
||||
<img class="also-icon" src="./img/arrow-circular-gray.png" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="no-discussion-box flexcenter" v-else>
|
||||
<img src="./img/no-discussion.png" class="no-discussion-icon" />
|
||||
<div class="no-discussion-text">缺少你的留言，我的世界是黑白的</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-box">
|
||||
<a class="adv">
|
||||
<img class="adv-img" src="https://o.x-php.com/bbs/common/cf/1709075xdbbbvjd8cbxvdd.jpg" />
|
||||
</a>
|
||||
|
||||
<div class="sidebar-item">
|
||||
<div class="sidebar-header">手机查看该帖子</div>
|
||||
<div class="sidebar-content flexcenter">
|
||||
<img src="https://o.x-php.com/qrcode/eunKLTiKLX4O" class="sidebar-QRCode" />
|
||||
<div class="hint flexacenter">
|
||||
<img class="saoma-icon" src="./img/u161.png" />
|
||||
微信扫一扫
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-item">
|
||||
<div class="sidebar-header">关于作者</div>
|
||||
<div class="sidebar-content flexcenter">
|
||||
<div class="author-box flexacenter">
|
||||
<img class="avatar" :src="authorInfo?.avatar" alt="" />
|
||||
<div class="author-content">
|
||||
<div class="author-name flexacenter">
|
||||
{{ authorInfo.nickname || '匿名用户' }}
|
||||
<img v-if="authorInfo.group?.image" class="group" :src="authorInfo.group?.image" />
|
||||
</div>
|
||||
<div class="author-info flexacenter">
|
||||
共
|
||||
<div class="amount">{{ count }}</div>
|
||||
个创作，获得
|
||||
<div class="amount">100</div>
|
||||
个赞
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="medal" v-if="medal.length > 0">
|
||||
<div class="medal-title">勋章 {{ medal.length }}</div>
|
||||
<div class="medal-list flexflex">
|
||||
<img class="medal-item" v-for="item in medal" :key="item" :src="item.image" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="recently" v-if="recentlyList.length > 0">
|
||||
<div class="recently-title">最近发布</div>
|
||||
<div class="recently-list flexflex">
|
||||
<div v-for="item in recentlyList" :key="item" class="recently-item one-line-display flexacenter">
|
||||
<div class="dot"></div>
|
||||
<div class="text one-line-display flex1">{{ item.title || '无标题' }}</div>
|
||||
</div>
|
||||
<div class="comments-also flexacenter" v-if="item['childnum'] > item['child'].length" @click="alsoCommentsData(index, i)">
|
||||
<div class>还有{{ item["childnum"] - item.child.length }}条回复</div>
|
||||
<img class="also-icon" src="./img/arrow-circular-gray.png" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<latest-list></latest-list>
|
||||
|
||||
<slideshow-box></slideshow-box>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="coins-area flexcenter" v-if="coinsState">
|
||||
<div class="coins-box flexcenter">
|
||||
<img class="fork" @click="closeCoinBox" src="./img/fork-icon.png" />
|
||||
<div class="coins-head flexacenter">
|
||||
<img class="icon" src="./img/bi-icon.png" />
|
||||
<div class="text flexacenter">
|
||||
该帖子已获得
|
||||
<div class="sum">{{ info.coins }}</div>
|
||||
个寄托币
|
||||
</div>
|
||||
</div>
|
||||
<div class="coins-input flexacenter">
|
||||
<input class="input flex1" type="number" placeholder="输入投币数" v-model="coinAmount" />
|
||||
<div class="btn" @click="coinSubmit">投币</div>
|
||||
</div>
|
||||
|
||||
<div class="coins-info flexacenter">
|
||||
<img class="icon" src="./img/bi-black-icon.png" />
|
||||
你当前共有
|
||||
<div class="sum">{{ mybalance }}</div>
|
||||
寄托币
|
||||
<a class="strategy" target="_blank" :href="strategy">[挣币攻略]</a>
|
||||
</div>
|
||||
|
||||
<div class="coins-list-area flexflex">
|
||||
<div class="coins-total flexacenter">
|
||||
共
|
||||
<div class="sum">{{ coinNubmer }}</div>
|
||||
人参与投币：
|
||||
</div>
|
||||
<div class="list flex1">
|
||||
<div class="item flexacenter" v-for="(item,index) in coinList" :key="index">
|
||||
<div class="serial">{{ item.rank }}</div>
|
||||
<div class="user flex1 flexacenter">
|
||||
<img class="avatar" :src="item.user.avatar" alt="" />
|
||||
<div class="username one-line-display flex1">{{ item.user.nickname || '匿名用户' }}</div>
|
||||
</div>
|
||||
<div class="amount flexacenter">
|
||||
{{ item.coins }}
|
||||
<div class="text">币</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="no-discussion-box flexcenter" v-else>
|
||||
<img src="./img/no-discussion.png" class="no-discussion-icon" />
|
||||
<div class="no-discussion-text">缺少你的留言，我的世界是黑白的</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<like v-if="isLikeGif"></like>
|
||||
<div class="sidebar-box">
|
||||
<a class="adv">
|
||||
<img class="adv-img" src="https://o.x-php.com/bbs/common/cf/1709075xdbbbvjd8cbxvdd.jpg" />
|
||||
</a>
|
||||
|
||||
<div class="sidebar-item">
|
||||
<div class="sidebar-header">手机查看该帖子</div>
|
||||
<div class="sidebar-content flexcenter">
|
||||
<img src="https://o.x-php.com/qrcode/eunKLTiKLX4O" class="sidebar-QRCode" />
|
||||
<div class="hint flexacenter">
|
||||
<img class="saoma-icon" src="./img/u161.png" />
|
||||
微信扫一扫
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-item">
|
||||
<div class="sidebar-header">关于作者</div>
|
||||
<div class="sidebar-content flexcenter">
|
||||
<div class="author-box flexacenter">
|
||||
<img class="avatar" :src="authorInfo?.avatar" alt="" />
|
||||
<div class="author-content">
|
||||
<div class="author-name flexacenter">
|
||||
{{ authorInfo.nickname || '匿名用户' }}
|
||||
<img v-if="authorInfo.group?.image" class="group" :src="authorInfo.group?.image" />
|
||||
</div>
|
||||
<div class="author-info flexacenter">
|
||||
共
|
||||
<div class="amount">{{ count }}</div>
|
||||
个创作，获得
|
||||
<div class="amount">100</div>
|
||||
个赞
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="medal" v-if="medal.length > 0">
|
||||
<div class="medal-title">勋章 {{ medal.length }}</div>
|
||||
<div class="medal-list flexflex">
|
||||
<img class="medal-item" v-for="item in medal" :key="item" :src="item.image" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="recently" v-if="recentlyList.length > 0">
|
||||
<div class="recently-title">最近发布</div>
|
||||
<div class="recently-list flexflex">
|
||||
<div v-for="item in recentlyList" :key="item" class="recently-item one-line-display flexacenter">
|
||||
<div class="dot"></div>
|
||||
<div class="text one-line-display flex1">{{ item.title || '无标题' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<latest-list></latest-list>
|
||||
|
||||
<slideshow-box></slideshow-box>
|
||||
</div>
|
||||
</div>
|
||||
<script src="./js/axios.min.js"></script>
|
||||
<script src="./js/public.js"></script>
|
||||
<script type="module" src="./js/details.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<div class="coins-area flexcenter" v-if="coinsState">
|
||||
<div class="coins-box flexcenter">
|
||||
<img class="fork" @click="closeCoinBox" src="./img/fork-icon.png" />
|
||||
<div class="coins-head flexacenter">
|
||||
<img class="icon" src="./img/bi-icon.png" />
|
||||
<div class="text flexacenter">
|
||||
该帖子已获得
|
||||
<div class="sum">{{ info.coins }}</div>
|
||||
个寄托币
|
||||
</div>
|
||||
</div>
|
||||
<div class="coins-input flexacenter">
|
||||
<input class="input flex1" type="number" placeholder="输入投币数" v-model="coinAmount" />
|
||||
<div class="btn" @click="coinSubmit">投币</div>
|
||||
</div>
|
||||
|
||||
<div class="coins-info flexacenter">
|
||||
<img class="icon" src="./img/bi-black-icon.png" />
|
||||
你当前共有
|
||||
<div class="sum">{{ mybalance }}</div>
|
||||
寄托币
|
||||
<a class="strategy" target="_blank" :href="strategy">[挣币攻略]</a>
|
||||
</div>
|
||||
|
||||
<div class="coins-list-area flexflex" v-if="coinList.length != 0">
|
||||
<div class="coins-total flexacenter">
|
||||
共
|
||||
<div class="sum">{{ coinNubmer }}</div>
|
||||
人参与投币：
|
||||
</div>
|
||||
<div class="list flex1">
|
||||
<div class="item flexacenter" v-for="(item,index) in coinList" :key="index">
|
||||
<div class="serial">{{ item.rank }}</div>
|
||||
<div class="user flex1 flexacenter">
|
||||
<img class="avatar" :src="item.user.avatar" alt="" />
|
||||
<div class="username one-line-display flex1">{{ item.user.nickname || '匿名用户' }}</div>
|
||||
</div>
|
||||
<div class="amount flexacenter">
|
||||
{{ item.coins }}
|
||||
<div class="text">币</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<like v-if="isLikeGif"></like>
|
||||
</div>
|
||||
<script src="./js/axios.min.js"></script>
|
||||
<script src="./js/public.js"></script>
|
||||
<script type="module" src="./js/details.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
109
homepage-me.html
109
homepage-me.html
@@ -8,53 +8,33 @@
|
||||
<link rel="stylesheet" href="./css/public.css" />
|
||||
<link rel="stylesheet" href="./css/homepage-me.css" />
|
||||
<script src="./js/vue.global.js"></script>
|
||||
<style>
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container" id="homepage-me">
|
||||
<div class="head-top flexacenter">
|
||||
<img class="logo" src="https://oss.gter.net/logo" alt="" />
|
||||
<div class="flex1"></div>
|
||||
<div class="input-box flexacenter">
|
||||
<input class="input flex1" type="text" placeholder="大家都在搜：屯特" />
|
||||
<img class="icon" />
|
||||
</div>
|
||||
|
||||
<div class="sign-in sign-in-already flexcenter" v-if="signInAlreadyState" v-cloak onclick="showWindow('dsu_paulsign', 'https://bbs.gter.net/plugin.php?id=dsu_paulsign:sign&show=sign')">
|
||||
<img class="sign-icon" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/sign-icon.png" />
|
||||
<span>已签到，明天再来</span>
|
||||
</div>
|
||||
<div class="sign-in sign-in-no flexacenter" v-else onclick="showWindow('dsu_paulsign', 'https://bbs.gter.net/plugin.php?id=dsu_paulsign:sign&show=sign')" v-cloak>
|
||||
<img class="sign-in-bj" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/sign-in-bj.svg" />
|
||||
<img class="coin-bj" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/coin-bj.svg" />
|
||||
<img class="coin-icon" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/coin-icon.png" />
|
||||
<span class="text flex1">签到领寄托币</span>
|
||||
<div class="sign-go flexcenter">
|
||||
<img class="sign-go-bj" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/sign-go.svg" />
|
||||
GO
|
||||
</div>
|
||||
<img class="petal1" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/petal1.png" />
|
||||
<img class="petal2" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/petal2.png" />
|
||||
<img class="petal3" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/petal3.png" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="container" id="homepage-me" v-cloak>
|
||||
<head-top></head-top>
|
||||
|
||||
<div class="head-navigation flexacenter">
|
||||
<img class="icon" src="./img/index-icon.png" />
|
||||
<div class="text">首页</div>
|
||||
<a class="text" href="./" target="_blank">首页</a>
|
||||
<img class="arrows" src="./img/arrows-gray.svg" />
|
||||
<div class="text">GTSuperstar 的个人主页</div>
|
||||
<div class="text">我的主页</div>
|
||||
</div>
|
||||
|
||||
<div class="matter flexflex">
|
||||
<div class="card-user flexcenter">
|
||||
<div class="name-area">
|
||||
<img class="avatar" src="https://nas.gter.net:9008/avatar/97K4EWIMLrsbGTWXslC2WV5VHK6OikN42jDKLNjtax7HL4g2eMCJSdU9oWFhY2E~/middle" alt="用户头像" />
|
||||
<img class="avatar" :src="info.avatar" alt="用户头像" />
|
||||
|
||||
<h3 class="username flexcenter">GTSuperstar</h3>
|
||||
<h3 class="username flexcenter">{{ info.nickname }}</h3>
|
||||
<p class="uid flexcenter">
|
||||
UID: 3276161
|
||||
<img class="icon" src="./img/copy-icon.png" />
|
||||
UID: {{ info.uin }}
|
||||
<img class="icon" @click="copy(info.uin)" src="./img/copy-icon.png" />
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -62,19 +42,19 @@
|
||||
<img class="bi-masking" src="./img/bi-masking.svg" alt="">
|
||||
<img class="bi-icon" src="./img/bi-icon.svg" alt="">
|
||||
<div class="bi-content flex1">
|
||||
<div class="bi-sum">1906</div>
|
||||
<div class="bi-sum">{{ gtercoin }}</div>
|
||||
<div class="bi-text">寄托币</div>
|
||||
</div>
|
||||
<div class="bi-btn flexcenter">
|
||||
<a class="bi-btn flexcenter" target="_blank" :href="introduction">
|
||||
关于寄托币
|
||||
<img class="bi-question" src="./img/question-mark.svg" alt="">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="medal-area">
|
||||
<p class="title">勋章 6</p>
|
||||
<div class="medal-area" v-if="medallist.length != 0">
|
||||
<p class="title">勋章 {{ medallist.length }}</p>
|
||||
<div class="list flexflex">
|
||||
<img v-for="item in 10" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG3WvCGHpt5oNTyM1Nwws484T7rGFDO1bKwnG2kLV_eSo5JUnMYHVj-SsGLytRp94iZe_tpcnj-4Ce4gYuGWnGU_hCATZ7u7I_X1F8YjCfX63o6lsSPQ7Y2N90MUNDQyOQ~~" alt="勋章1" class="item" />
|
||||
<img v-for="item in medallist" :src="item.image" :alt="item.name" class="item" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -82,9 +62,9 @@
|
||||
<div class="message-box" v-if="true">
|
||||
<!-- 头部区域 -->
|
||||
<div class="header">
|
||||
<img src="https://nas.gter.net:9008/avatar/97K4EWIMLrsbGTWXslC2WV5VHK6OikN42jDKLNjtax7HL4g2eMCJSdU9oWFhY2E~/middle" alt="用户头像" class="avatar" />
|
||||
<span class="username">GTSuperstar</span>
|
||||
<!-- <img class="icon"> -->
|
||||
<img :src="info.avatar" alt="用户头像" class="avatar" />
|
||||
<span class="username">{{ info.nickname }}</span>
|
||||
<img v-if="info?.group?.image" class="icon" :src="info?.group?.image">
|
||||
</div>
|
||||
|
||||
<!-- 信息列表区域 -->
|
||||
@@ -125,59 +105,58 @@
|
||||
</div>
|
||||
<div class="item flexacenter">
|
||||
<span class="label">寄托币</span>
|
||||
<span class="value">13813</span>
|
||||
<span class="value">{{ gtercoin }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 统计标签区域 -->
|
||||
<div class="stats flexacenter">
|
||||
<template v-for="item in 5" :key="item">
|
||||
<div class="stats flexacenter" v-if="creationType.length != 0">
|
||||
<template v-for="(item, index) in creationType" :key="index">
|
||||
<span class="item flexacenter">
|
||||
<div class="text">Offer ×</div>
|
||||
<div class="num">6</div>
|
||||
<div class="text">{{ item.text }} ×</div>
|
||||
<div class="num">{{ item.number }}</div>
|
||||
</span>
|
||||
<div class="line">|</div>
|
||||
<div class="line" v-if="index != creationType.length - 1">|</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<!-- Offer标签区域 -->
|
||||
<div class="tags flexflex">
|
||||
<div class="item flexacenter" v-for="item in 15" :key="item">
|
||||
<!-- <img class="icon" src="./img/mj-icon.png" mode="heightFix" /> -->
|
||||
<img class="icon" src="./img/offer-icon.png" mode="heightFix" />
|
||||
阿尔托大学
|
||||
<div class="tags flexflex" v-if="schoolTags.length != 0">
|
||||
<div class="item flexacenter" v-for="item in schoolTags" :key="item">
|
||||
<img v-if="item.type == 'offer'" class="icon" src="./img/offer-icon.png" mode="heightFix" />
|
||||
<img v-else class="icon" src="./img/mj-icon.png" mode="heightFix" />
|
||||
{{ item.school }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="list-area">
|
||||
<div class="operation-box flexacenter">
|
||||
<div class="operation-item" :class="{'pitch': item === 1}" v-for="item in 5" :key="item">收藏</div>
|
||||
<div class="operation-item" :class="{ 'pitch': item.type == typeValue }" v-for="item in typeList" :key="item.type">{{ item.text }}</div>
|
||||
</div>
|
||||
|
||||
<div class="classify flexacenter">
|
||||
<div class="item " :class="{'pitch': item === 1}" v-for="item in 5" :key="item">全部</div>
|
||||
<div class="item " :class="{'pitch': item.type == classify}" v-for="item in classifyList" :key="item.type">{{ item.text }}</div>
|
||||
</div>
|
||||
|
||||
<div class="issue-data flexacenter">
|
||||
共 <div class="num">57</div> 个创作
|
||||
共 <div class="num">{{ total }}</div> 个创作
|
||||
</div>
|
||||
|
||||
<!-- 系统会为你保留最近7天的浏览记录： -->
|
||||
|
||||
|
||||
|
||||
<div class="list-box" v-if="false">
|
||||
<template v-for="(item,index) in list" :key="index"> {{ item.type }}
|
||||
<item-offer v-if=" item.type == 'offer'" :item="item"></item-offer>
|
||||
<item-summary v-else-if="item.type == 'offer_summary'" :item="item"></item-summary>
|
||||
<div class="list-box" v-if="list.length != 0">
|
||||
<template v-for="(item,index) in list" :key="index">
|
||||
<item-offer v-if=" item.type == 'offer'" :itemdata="item"></item-offer>
|
||||
<item-summary v-else-if="item.type == 'offer_summary'" :itemdata="item"></item-summary>
|
||||
<item-vote v-else-if="item.type == 'vote'" :itemdata="item"></item-vote>
|
||||
<item-mj v-else-if="item.type == 'interviewexperience'" :itemdata="item"></item-mj>
|
||||
<item-tenement v-else-if="item.type == 'tenement'" :itemdata="item"></item-tenement>
|
||||
<item-forum v-else :item="item"></item-forum>
|
||||
<item-forum v-else :itemdata="item"></item-forum>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div class="empty flexcenter">
|
||||
<div v-if="list.length == 0" class="empty flexcenter">
|
||||
<img class="empty-icon" src="./img/empty-icon.png" />
|
||||
<div class="empty-text">- 暂无内容 -</div>
|
||||
</div>
|
||||
@@ -187,6 +166,8 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="./js/axios.min.js"></script>
|
||||
<script src="./js/public.js"></script>
|
||||
<script type="module" src="./js/homepage-me.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
@@ -4,80 +4,61 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Document</title>
|
||||
<title>个人主页</title>
|
||||
<link rel="stylesheet" href="./css/public.css" />
|
||||
<link rel="stylesheet" href="./css/homepage-other.css" />
|
||||
<script src="./js/vue.global.js"></script>
|
||||
<style>
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container" id="homepage-other">
|
||||
<div class="head-top flexacenter">
|
||||
<img class="logo" src="https://oss.gter.net/logo" alt="" />
|
||||
<div class="flex1"></div>
|
||||
<div class="input-box flexacenter">
|
||||
<input class="input flex1" type="text" placeholder="大家都在搜：屯特" />
|
||||
<img class="icon" />
|
||||
</div>
|
||||
<div class="container" id="homepage-other" v-cloak>
|
||||
|
||||
<div class="sign-in sign-in-already flexcenter" v-if="signInAlreadyState" v-cloak onclick="showWindow('dsu_paulsign', 'https://bbs.gter.net/plugin.php?id=dsu_paulsign:sign&show=sign')">
|
||||
<img class="sign-icon" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/sign-icon.png" />
|
||||
<span>已签到，明天再来</span>
|
||||
</div>
|
||||
<div class="sign-in sign-in-no flexacenter" v-else onclick="showWindow('dsu_paulsign', 'https://bbs.gter.net/plugin.php?id=dsu_paulsign:sign&show=sign')" v-cloak>
|
||||
<img class="sign-in-bj" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/sign-in-bj.svg" />
|
||||
<img class="coin-bj" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/coin-bj.svg" />
|
||||
<img class="coin-icon" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/coin-icon.png" />
|
||||
<span class="text flex1">签到领寄托币</span>
|
||||
<div class="sign-go flexcenter">
|
||||
<img class="sign-go-bj" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/sign-go.svg" />
|
||||
GO
|
||||
</div>
|
||||
<img class="petal1" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/petal1.png" />
|
||||
<img class="petal2" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/petal2.png" />
|
||||
<img class="petal3" src="//framework.x-php.com/gter/image/gter/forum/assets/forum/petal3.png" />
|
||||
</div>
|
||||
</div>
|
||||
<head-top></head-top>
|
||||
|
||||
<div class="head-navigation flexacenter">
|
||||
<img class="icon" src="./img/index-icon.png" />
|
||||
<div class="text">首页</div>
|
||||
<a class="text" href="./" target="_blank">首页</a>
|
||||
<img class="arrows" src="./img/arrows-gray.svg" />
|
||||
<div class="text">GTSuperstar 的个人主页</div>
|
||||
<div class="text">{{ info.nickname }} 的个人主页</div>
|
||||
</div>
|
||||
|
||||
<div class="matter flexflex">
|
||||
<div class="card-user flexcenter">
|
||||
<div class="name-area">
|
||||
<img class="avatar" src="https://nas.gter.net:9008/avatar/97K4EWIMLrsbGTWXslC2WV5VHK6OikN42jDKLNjtax7HL4g2eMCJSdU9oWFhY2E~/middle" alt="用户头像" />
|
||||
<img class="avatar" :src="info.avatar" alt="用户头像" />
|
||||
|
||||
<h3 class="username flexcenter">GTSuperstar</h3>
|
||||
<h3 class="username flexcenter">{{ info.nickname }}</h3>
|
||||
<p class="uid flexcenter">
|
||||
UID: 3276161
|
||||
UID: {{ info.uin }}
|
||||
<img class="icon" src="./img/copy-icon.png" />
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="medal-area">
|
||||
<p class="title">勋章 6</p>
|
||||
<div class="medal-area" v-if="medallist.length != 0">
|
||||
<p class="title">勋章 {{ medallist.length }}</p>
|
||||
<div class="list flexflex">
|
||||
<img v-for="item in 5" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG3WvCGHpt5oNTyM1Nwws484T7rGFDO1bKwnG2kLV_eSo5JUnMYHVj-SsGLytRp94iZe_tpcnj-4Ce4gYuGWnGU_hCATZ7u7I_X1F8YjCfX63o6lsSPQ7Y2N90MUNDQyOQ~~" alt="勋章1" class="item" />
|
||||
<img v-for="item in medallist" :key="item.medalid" :src="item.image" :alt="item.description" class="item" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btn-area">
|
||||
<div class="item msg flexcenter">发私信</div>
|
||||
<div class="item msg flexcenter" @click="sendMessage(info.uin)">发私信</div>
|
||||
<div class="item flexcenter">用户管理</div>
|
||||
<div class="item flexcenter">内容管理</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="matter-content flex1">
|
||||
<div class="message-box" v-if="false">
|
||||
<div class="message-box">
|
||||
<!-- 头部区域 -->
|
||||
<div class="header">
|
||||
<img src="https://nas.gter.net:9008/avatar/97K4EWIMLrsbGTWXslC2WV5VHK6OikN42jDKLNjtax7HL4g2eMCJSdU9oWFhY2E~/middle" alt="用户头像" class="avatar" />
|
||||
<span class="username">GTSuperstar</span>
|
||||
<!-- <img class="icon"> -->
|
||||
<div class="header flexacenter">
|
||||
<img :src="info.avatar" alt="用户头像" class="avatar" />
|
||||
<span class="username">{{ info.nickname }}</span>
|
||||
<img v-if="info?.group?.image" class="icon" :src="info?.group?.image">
|
||||
</div>
|
||||
|
||||
<!-- 信息列表区域 -->
|
||||
@@ -123,55 +104,57 @@
|
||||
</div>
|
||||
|
||||
<!-- 统计标签区域 -->
|
||||
<div class="stats flexacenter">
|
||||
<template v-for="item in 5" :key="item">
|
||||
<div class="stats flexacenter" v-if="creationType.length != 0">
|
||||
<template v-for="(item, index) in creationType" :key="index">
|
||||
<span class="item flexacenter">
|
||||
<div class="text">Offer ×</div>
|
||||
<div class="num">6</div>
|
||||
<div class="text">{{ item.text }} ×</div>
|
||||
<div class="num">{{ item.number }}</div>
|
||||
</span>
|
||||
<div class="line">|</div>
|
||||
<div class="line" v-if="index != creationType.length - 1">|</div>
|
||||
</template>
|
||||
</div>
|
||||
<!-- Offer标签区域 -->
|
||||
<div class="tags flexflex">
|
||||
<div class="item flexacenter" v-for="item in 15" :key="item">
|
||||
<!-- <img class="icon" src="./img/mj-icon.png" mode="heightFix" /> -->
|
||||
<img class="icon" src="./img/offer-icon.png" mode="heightFix" />
|
||||
阿尔托大学
|
||||
<div class="tags flexflex" v-if="schoolTags.length != 0">
|
||||
<div class="item flexacenter" v-for="item in schoolTags" :key="item">
|
||||
<img v-if="item.type == 'offer'" class="icon" src="./img/offer-icon.png" mode="heightFix" />
|
||||
<img v-else class="icon" src="./img/mj-icon.png" mode="heightFix" />
|
||||
{{ item.school }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="list-area">
|
||||
<div class="classify flexacenter">
|
||||
<div class="item " :class="{'pitch': item === 1}" v-for="item in 5" :key="item">全部</div>
|
||||
<div class="item " :class="{'pitch': item.type === classify}" v-for="item in classifyList" :key="item.type" @click="classifyChange(item.type)">{{ item.text }}</div>
|
||||
</div>
|
||||
|
||||
<div class="issue-data flexacenter">
|
||||
共 <div class="num">57</div> 个创作，获得 <div class="num">1093</div> 个赞
|
||||
共 <div class="num">{{ count }}</div> 个创作，获得 <div class="num">1093</div> 个赞
|
||||
</div>
|
||||
|
||||
<div class="list-box" v-if="true">
|
||||
<div class="list-box" v-if="list.length != 0">
|
||||
<template v-for="(item,index) in list" :key="index">
|
||||
<item-offer v-if=" item.type == 'offer'" :item="item"></item-offer>
|
||||
<item-summary v-else-if="item.type == 'offer_summary'" :item="item"></item-summary>
|
||||
<item-offer v-if=" item.type == 'offer'" :itemdata="item"></item-offer>
|
||||
<item-summary v-else-if="item.type == 'offer_summary'" :itemdata="item"></item-summary>
|
||||
<item-vote v-else-if="item.type == 'vote'" :itemdata="item"></item-vote>
|
||||
<item-mj v-else-if="item.type == 'interviewexperience'" :itemdata="item"></item-mj>
|
||||
<item-tenement v-else-if="item.type == 'tenement'" :itemdata="item"></item-tenement>
|
||||
<item-forum v-else :item="item"></item-forum>
|
||||
<item-forum v-else :itemdata="item"></item-forum>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div class="empty flexcenter">
|
||||
<div v-if="list.length == 0" class="empty flexcenter">
|
||||
<img class="empty-icon" src="./img/empty-icon.png" />
|
||||
<div class="empty-text">- 暂无内容 -</div>
|
||||
</div>
|
||||
|
||||
<div class="load-more flexcenter">加载更多…</div>
|
||||
<div v-if="page != 0" class="load-more flexcenter">加载更多…</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="./js/axios.min.js"></script>
|
||||
<script src="./js/public.js"></script>
|
||||
<script type="module" src="./js/homepage-other.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
BIN
img/mj-icon.png
Normal file
BIN
img/mj-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.9 KiB |
@@ -13,7 +13,7 @@
|
||||
<body>
|
||||
<div class="container" id="appIndex">
|
||||
<!-- 话题和精选 -->
|
||||
<div v-if="true" class="topic-and-selectives flexflex">
|
||||
<div class="topic-and-selectives flexflex">
|
||||
<div class="topic-box">
|
||||
<div class="head-top flexcenter">
|
||||
<img class="icon" src="https://app.gter.net/image/miniApp/offer/well-white.svg" />
|
||||
|
||||
503
js/details.js
503
js/details.js
@@ -11,14 +11,11 @@ import { like } from "../component/like/like.js";
|
||||
|
||||
const appSectionIndex = createApp({
|
||||
setup() {
|
||||
let signInAlreadyState = ref(false);
|
||||
|
||||
let permissions = ref([]);
|
||||
|
||||
onMounted(() => {
|
||||
getUserInfoWin();
|
||||
|
||||
setTimeout(() => (permissions.value = window["permissions"] || []), 1000);
|
||||
setTimeout(() => (permissions.value = window["permissions"] || ["comment.edit", "comment.delete", "offercollege.hide", "offersummary.hide", "mj.hide", "topic:manager", "topic:hide"]), 1000);
|
||||
});
|
||||
|
||||
let isLogin = ref(true);
|
||||
@@ -34,6 +31,8 @@ const appSectionIndex = createApp({
|
||||
uin: 4238049,
|
||||
});
|
||||
|
||||
let permissions = ref([]);
|
||||
|
||||
const getUserInfoWin = () => {
|
||||
const checkUser = () => {
|
||||
const user = window.userInfoWin;
|
||||
@@ -42,6 +41,7 @@ const appSectionIndex = createApp({
|
||||
realname.value = user.realname;
|
||||
userInfoWin.value = user;
|
||||
if (user?.uin > 0 || user?.uid > 0) isLogin.value = true;
|
||||
permissions.value = user?.authority || [];
|
||||
};
|
||||
document.addEventListener("getUser", checkUser);
|
||||
};
|
||||
@@ -307,10 +307,11 @@ const appSectionIndex = createApp({
|
||||
|
||||
data.data.forEach((element, index) => {
|
||||
element.timestamp = strtimeago(element.created_at, 4);
|
||||
|
||||
element["picture"] = [];
|
||||
element["isReplyBoxShow"] = 0;
|
||||
if (element.child.length > 0) {
|
||||
element.child.forEach((el) => {
|
||||
el["picture"] = [];
|
||||
el.timestamp = strtimeago(element.created_at, 4);
|
||||
el["isReplyBoxShow"] = 0;
|
||||
});
|
||||
@@ -328,9 +329,6 @@ const appSectionIndex = createApp({
|
||||
|
||||
commentList.value = commentList.value.concat(data.data);
|
||||
commentTotalCount.value = data.count;
|
||||
|
||||
console.log("commentTotalCount.value", commentTotalCount.value);
|
||||
|
||||
commentPage.value = data.count > commentList.value.length ? commentPage.value + 1 : 0;
|
||||
})
|
||||
.finally(() => {
|
||||
@@ -338,7 +336,7 @@ const appSectionIndex = createApp({
|
||||
});
|
||||
};
|
||||
|
||||
let picture = ref({});
|
||||
let picture = ref([]);
|
||||
|
||||
const openUserInfo = (index, i) => {
|
||||
if (i != undefined && commentList.value[index].child[i].user["uin"] > 0) commentList.value[index].child[i]["avatarState"] = true;
|
||||
@@ -428,14 +426,497 @@ const appSectionIndex = createApp({
|
||||
|
||||
creationAlertBox("success", res.message || "操作成功");
|
||||
|
||||
// if (status) this.$parent.openLikeGif();
|
||||
if (data["status"]) {
|
||||
isLikeGif.value = true;
|
||||
setTimeout(() => (isLikeGif.value = false), 2000);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
let emojiState = ref(false);
|
||||
let emojiMaskState = ref(false);
|
||||
let inputTextarea = ref("");
|
||||
|
||||
// 打开 Emoji
|
||||
const openEmoji = (index, i) => {
|
||||
if (!isLogin.value) {
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
|
||||
if (i != undefined) commentList.value[index].child[i]["emojiState"] = true;
|
||||
else if (index != undefined) commentList.value[index]["emojiState"] = true;
|
||||
else {
|
||||
closeEmoji();
|
||||
closeAnswerCommentsChild();
|
||||
emojiState.value = true;
|
||||
}
|
||||
|
||||
emojiMaskState.value = true;
|
||||
};
|
||||
|
||||
// 关闭 Emoji
|
||||
const closeEmoji = (index, i) => {
|
||||
commentList.value.forEach((ele) => {
|
||||
ele["emojiState"] = false;
|
||||
if (ele["child"] && ele["child"].length != 0) {
|
||||
ele["child"].forEach((el) => {
|
||||
el["emojiState"] = false;
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
emojiState.value = false;
|
||||
emojiMaskState.value = false;
|
||||
editEmojiState.value = false;
|
||||
};
|
||||
|
||||
const TAHomePage = (uin) => goHomePage(uin);
|
||||
const sendMessage = (uin) => goSendMessage(uin);
|
||||
|
||||
return { closeAnswerCommentsChild, openAnswerCommentsChild, dialogSrc, handleAnswerText, sendMessage, TAHomePage, operateAnswerCommentsLike, closeUserInfo, openUserInfo, permissions, commentList, commentPage, commentTotalCount, picture, userInfoWin, relatedList, relatedTime, coinNubmer, coinList, coinAmount, coinSubmit, strategy, mybalance, coinsState, openCoinBox, closeCoinBox, isLikeGif, likeClick, collectClick, islike, iscollect, recentlyList, medal, count, sectionn, tags, signInAlreadyState, authorInfo, info, timestamp, updatedTime };
|
||||
let emojiData = ref(["😀", "😁", "😆", "😅", "😂", "😉", "😍", "🥰", "😘", "🤥", "😪", "😵💫", "🤓", "🥺", "😋", "😜", "🤪", "😎", "🤩", "🥳", "😔", "🙁", "😭", "😡", "😳", "🤗", "🤔", "🤭", "🤫", "😯", "😵", "🙄", "🥴", "🤢", "🤑", "🤠", "👌", "✌️", "🤟", "🤘", "🤙", "👍", "👎", "✊", "👏", "🤝", "🙏", "💪", "❎️", "✳️", "✴️", "❇️", "#️⃣", "*️⃣", "1️⃣", "2️⃣", "3️⃣", "4️⃣", "5️⃣", "6️⃣", "7️⃣", "8️⃣", "9️⃣", "🔟", "🆗", "🈶", "🉐", "🉑", "🌹", "🥀", "🌸", "🌺", "🌷", "🌲", "☘️", "🍀", "🍁", "🌙", "⭐", "🌍", "☀️", "⭐️", "🌟", "☁️", "🌈", "☂️", "❄️", "☃️", "☄️", "🔥", "💧", "🍎", "🍐", "🍊", "🍉", "🍓", "🍑", "🍔", "🍟", "🍕", "🥪", "🍜", "🍡", "🍨", "🍦", "🎂", "🍰", "🍭", "🍿", "🍩", "🧃", "🍹", "🍒", "🥝", "🥒", "🥦", "🥨", "🌭", "🥘", "🍱", "🍢", "🥮", "🍩", "🍪", "🧁", "🍵", "🍶", "🍻", "🥂", "🧋", "🎉", "🎁", "🧧", "🎃", "🎄", "🧨", "✨️", "🎈", "🎊", "🎋", "🎍", "🎀", "🎖️", "🏆️", "🏅", "💌", "📬", "🚗", "🚕", "🚲", "🛵", "🚀", "🚁", "⛵", "🚢", "🔮", "🧸", "🀄️"]);
|
||||
|
||||
const handleEditFile = () => {
|
||||
editEmojiState.value = false;
|
||||
judgeLogin();
|
||||
};
|
||||
|
||||
// 选择 Emoji
|
||||
const selectEmoji = (key, index, i) => {
|
||||
closeEmoji();
|
||||
if (i != undefined) {
|
||||
if (!commentList.value[index]["child"][i]["commentInput"]) commentList.value[index]["child"][i]["commentInput"] = "";
|
||||
commentList.value[index]["child"][i]["commentInput"] += key;
|
||||
} else if (index != undefined) {
|
||||
if (!commentList.value[index]["commentInput"]) commentList.value[index]["commentInput"] = "";
|
||||
commentList.value[index]["commentInput"] += key;
|
||||
} else inputTextarea.value += key;
|
||||
};
|
||||
|
||||
const judgeLogin = () => {
|
||||
if (!isLogin.value) goLogin();
|
||||
};
|
||||
|
||||
const maxPicture = 10;
|
||||
|
||||
const handleFileUpload = (event, index, i) => {
|
||||
closeEmoji();
|
||||
const file = event.target.files[0]; // 获取选择的文件
|
||||
|
||||
if (!file) return;
|
||||
|
||||
if (file.size > maxSize) {
|
||||
creationAlertBox("error", "文件大小不能超过 20MB");
|
||||
return;
|
||||
}
|
||||
|
||||
let target = [];
|
||||
if (editCommentState.value) target = editPicture.value;
|
||||
else {
|
||||
if (i != undefined) target = commentList.value[index].child[i]["picture"];
|
||||
else if (index != undefined) target = commentList.value[index]["picture"];
|
||||
else target = picture.value;
|
||||
}
|
||||
|
||||
if (target.length >= maxPicture) {
|
||||
creationAlertBox("error", `最多只能上传 ${maxPicture} 张图片`);
|
||||
return;
|
||||
}
|
||||
|
||||
console.log("现有图片", target);
|
||||
|
||||
const reader = new FileReader();
|
||||
reader.onload = (e) => {
|
||||
const base64 = e.target.result;
|
||||
uploadImg(file).then((res) => {
|
||||
const obj = {
|
||||
aid: res.aid || "",
|
||||
url: res.url || "",
|
||||
};
|
||||
|
||||
target.push(obj);
|
||||
|
||||
if (editCommentState.value) editPicture.value = target;
|
||||
else {
|
||||
if (i != undefined) commentList.value[index].child[i]["picture"] = target;
|
||||
else if (index != undefined) commentList.value[index]["picture"] = target;
|
||||
else picture.value = target;
|
||||
}
|
||||
creationAlertBox("success", "上传成功");
|
||||
});
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
};
|
||||
|
||||
let uploadConfig = null;
|
||||
const maxSize = 20 * 1024 * 1024; // 20MB
|
||||
|
||||
// 上传图片 获取图片url
|
||||
const uploadImg = (file) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
const upload = () => {
|
||||
let config = uploadConfig;
|
||||
|
||||
const formData = new FormData();
|
||||
formData.append(config.requestName, file); // 文件数据
|
||||
formData.append("name", file.name); // 文件名
|
||||
formData.append("type", "image"); // 文件名
|
||||
formData.append("data", config.params.data); // 文件名
|
||||
|
||||
ajax(config.url, formData).then((res) => {
|
||||
if (res.code != 200) {
|
||||
creationAlertBox("error", "上传失败");
|
||||
return;
|
||||
}
|
||||
let data = res.data;
|
||||
resolve(data);
|
||||
});
|
||||
};
|
||||
|
||||
if (uploadConfig) upload();
|
||||
else getUploadConfig().then(() => upload());
|
||||
});
|
||||
};
|
||||
|
||||
const getUploadConfig = () => {
|
||||
return new Promise((resolve, reject) => {
|
||||
ajax("https://api.gter.net/v1/config/upload?type=comment").then((res) => {
|
||||
let data = res.data;
|
||||
uploadConfig = data;
|
||||
resolve();
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
// 删除上传的图片
|
||||
const closeFileUpload = (aid, index, i) => {
|
||||
let target = [];
|
||||
|
||||
if (i != undefined) target = [...commentList.value[index].child[i]["picture"]];
|
||||
else if (index != undefined) target = [...commentList.value[index]["picture"]];
|
||||
else target = [...picture.value];
|
||||
|
||||
let sub = target.findIndex((item) => item.aid == aid);
|
||||
if (sub != -1) target.splice(sub, 1);
|
||||
if (i != undefined) commentList.value[index].child[i]["picture"] = target;
|
||||
else if (index != undefined) commentList.value[index]["picture"] = target;
|
||||
else picture.value = target;
|
||||
};
|
||||
|
||||
const closePictureUpload = (index) => picture.value.splice(index, 1);
|
||||
|
||||
// 提交回答-评论
|
||||
const submitAnswerComments = (index, i) => {
|
||||
if (realname.value == 0 && userInfoWin.value?.uin > 0) {
|
||||
openAttest();
|
||||
return;
|
||||
}
|
||||
|
||||
if (!isLogin.value) {
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
|
||||
let content = "";
|
||||
let parentid = null;
|
||||
// let token = this.token;
|
||||
let image = [];
|
||||
|
||||
if (i != null) {
|
||||
content = commentList.value[index]["child"][i]["commentInput"];
|
||||
parentid = commentList.value[index]["child"][i]["id"];
|
||||
image = [...commentList.value[index]["child"][i]["picture"]];
|
||||
} else if (index != null) {
|
||||
content = commentList.value[index]["commentInput"];
|
||||
parentid = commentList.value[index]["id"];
|
||||
image = [...commentList.value[index]["picture"]];
|
||||
} else {
|
||||
content = inputTextarea.value;
|
||||
image = [...picture.value];
|
||||
}
|
||||
|
||||
// this.detailLoading = true;
|
||||
|
||||
const attachments = {
|
||||
images: image,
|
||||
};
|
||||
|
||||
ajax("/v2/api/forum/postComment", {
|
||||
content,
|
||||
token,
|
||||
attachments,
|
||||
replyid: parentid,
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code != 200) {
|
||||
creationAlertBox("error", res.message || "操作成功");
|
||||
return;
|
||||
}
|
||||
let data = res.data;
|
||||
|
||||
const timestamp = strtimeago(new Date());
|
||||
|
||||
if (i != null) {
|
||||
let targetData = {
|
||||
id: data["commentid"],
|
||||
content,
|
||||
isauthor: 1,
|
||||
islike: 0,
|
||||
likenum: 0,
|
||||
reply: {
|
||||
nickname: commentList.value[index]["child"][i]["nickname"],
|
||||
},
|
||||
...data,
|
||||
attachments,
|
||||
picture: [],
|
||||
timestamp,
|
||||
};
|
||||
|
||||
commentList.value[index]["child"].push(targetData);
|
||||
commentList.value[index]["childnum"]++;
|
||||
} else if (index != null) {
|
||||
let targetData = {
|
||||
id: data["commentid"],
|
||||
content,
|
||||
isauthor: 1,
|
||||
islike: 0,
|
||||
likenum: 0,
|
||||
reply: [],
|
||||
...data,
|
||||
attachments,
|
||||
picture: [],
|
||||
timestamp,
|
||||
};
|
||||
commentList.value[index]["child"].unshift(targetData);
|
||||
commentList.value[index]["childnum"]++;
|
||||
} else {
|
||||
let targetData = {
|
||||
id: data["commentid"],
|
||||
content,
|
||||
isauthor: 1,
|
||||
islike: 0,
|
||||
likenum: 0,
|
||||
...data,
|
||||
child: [],
|
||||
attachments,
|
||||
picture: [],
|
||||
timestamp,
|
||||
};
|
||||
commentList.value.unshift(targetData);
|
||||
inputTextarea.value = "";
|
||||
picture.value = [];
|
||||
}
|
||||
|
||||
commentTotalCount.value = data.count || 0;
|
||||
|
||||
// if (!inputTextarea.value) {
|
||||
// const textarea = this.$refs["input-textarea"]
|
||||
// textarea.style.height = "80px"
|
||||
// }
|
||||
|
||||
closeAnswerCommentsChild();
|
||||
creationAlertBox("success", res.message || "操作成功");
|
||||
})
|
||||
.finally(() => {
|
||||
// this.detailLoading = false;
|
||||
});
|
||||
};
|
||||
|
||||
let editCommentState = ref(false);
|
||||
let editToken = ref("");
|
||||
let editPicture = ref([]);
|
||||
let editInput = ref("");
|
||||
let editEmojiState = ref(false);
|
||||
|
||||
const openEdit = (token, index, i) => {
|
||||
const list = JSON.parse(JSON.stringify(commentList.value));
|
||||
let target = {};
|
||||
if (i != null) target = list[index]["child"][i];
|
||||
else target = list[index];
|
||||
console.log("target", target);
|
||||
|
||||
editToken.value = target.token || "";
|
||||
editInput.value = target.content || "";
|
||||
editPicture.value = target.attachments?.images || [];
|
||||
console.log("editCommentState", editPicture.value);
|
||||
|
||||
editCommentState.value = true;
|
||||
};
|
||||
|
||||
const closeEdit = () => {
|
||||
editPicture.value = {};
|
||||
editToken.value = "";
|
||||
editInput.value = "";
|
||||
editCommentState.value = false;
|
||||
};
|
||||
|
||||
// 打开 Emoji
|
||||
const openEditEmoji = (index, i) => {
|
||||
if (!isLogin.value) {
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
editEmojiState.value = true;
|
||||
};
|
||||
|
||||
const closeEditEmoji = () => {
|
||||
editEmojiState.value = false;
|
||||
};
|
||||
|
||||
const selectEditEmoji = (key) => {
|
||||
closeEmoji();
|
||||
editInput.value += key;
|
||||
};
|
||||
|
||||
const postEditComment = () => {
|
||||
if (!isLogin.value) {
|
||||
goLogin();
|
||||
return;
|
||||
}
|
||||
|
||||
const image = editPicture.value;
|
||||
const attachments = {
|
||||
images: image,
|
||||
};
|
||||
ajax("/v2/api/forum/postCommentEdit", {
|
||||
content: editInput.value,
|
||||
token: editToken.value,
|
||||
attachments,
|
||||
}).then((res) => {
|
||||
if (res.code != 200) {
|
||||
creationAlertBox("error", res.message || "操作失败");
|
||||
return;
|
||||
}
|
||||
|
||||
commentList.value.forEach((element) => {
|
||||
if (element.token == editToken.value) {
|
||||
element["content"] = editInput.value;
|
||||
element["attachments"] = attachments;
|
||||
}
|
||||
element.child &&
|
||||
element.child.forEach((ele) => {
|
||||
if (ele.token == editToken.value) {
|
||||
ele["content"] = editInput.value;
|
||||
ele["attachments"] = attachments;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
editPicture.value = [];
|
||||
editToken.value = "";
|
||||
editCommentState.value = false;
|
||||
editEmojiState.value = false;
|
||||
creationAlertBox("success", res.message || "操作成功");
|
||||
});
|
||||
};
|
||||
|
||||
const closeEditFileUpload = (aid) => {
|
||||
let target = [...editPicture.value];
|
||||
let sub = target.findIndex((item) => item.aid == aid);
|
||||
if (sub != -1) target.splice(sub, 1);
|
||||
editPicture.value = target;
|
||||
};
|
||||
|
||||
const handleInputPaste = (event, index, ii) => {
|
||||
const items = event.clipboardData.items; // 获取粘贴的内容
|
||||
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
const item = items[i];
|
||||
if (item.type.startsWith("image/")) {
|
||||
event.preventDefault();
|
||||
const file = item.getAsFile(); // 获取文件
|
||||
|
||||
if (file.size > maxSize) {
|
||||
creationAlertBox("error", "文件大小不能超过 20MB");
|
||||
return;
|
||||
}
|
||||
|
||||
let target = [];
|
||||
if (editCommentState.value) target = editPicture.value;
|
||||
else {
|
||||
if (ii != undefined) target = commentList.value[index].child[ii]["picture"];
|
||||
else if (index != undefined) target = commentList.value[index]["picture"];
|
||||
else target = picture.value;
|
||||
}
|
||||
|
||||
if (target.length >= maxPicture) {
|
||||
creationAlertBox("error", `最多只能上传 ${maxPicture} 张图片`);
|
||||
return;
|
||||
}
|
||||
|
||||
const reader = new FileReader();
|
||||
reader.onload = (e) => {
|
||||
const base64 = e.target.result;
|
||||
|
||||
uploadImg(file).then((res) => {
|
||||
const obj = {
|
||||
aid: res.aid || "",
|
||||
url: res.url || "",
|
||||
};
|
||||
|
||||
target.push(obj);
|
||||
|
||||
if (editCommentState.value) editPicture.value = target;
|
||||
else {
|
||||
if (ii != undefined) commentList.value[index].child[ii]["picture"] = target;
|
||||
else if (index != undefined) commentList.value[index]["picture"] = target;
|
||||
else picture.value = target;
|
||||
}
|
||||
creationAlertBox("success", "上传成功");
|
||||
});
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 自动输入框增高
|
||||
const autoResize = (e) => {
|
||||
e.target.style.height = "auto"; // 重置高度
|
||||
e.target.style.height = `${e.target.scrollHeight}px`; // 设置为内容高度
|
||||
};
|
||||
|
||||
let commemtDelete = {};
|
||||
// 点击删除
|
||||
const commentDelete = (token, index, i) => {
|
||||
const post = () => {
|
||||
ajax("/v2/api/forum/deleteComment", {
|
||||
token,
|
||||
}).then((res) => {
|
||||
if (res.code != 200) {
|
||||
creationAlertBox("error", res.message);
|
||||
return;
|
||||
}
|
||||
|
||||
if (i >= 0) {
|
||||
commentList.value[index].child.splice(i, 1);
|
||||
commentList.value[index].childnum -= 1;
|
||||
} else {
|
||||
commentList.value.splice(index, 1);
|
||||
}
|
||||
|
||||
commentTotalCount.value -= 1;
|
||||
|
||||
creationAlertBox("success", res.message || "操作成功");
|
||||
});
|
||||
};
|
||||
|
||||
const isConfirmed = confirm(`确定要删除讨论吗？`);
|
||||
if (isConfirmed) post();
|
||||
};
|
||||
|
||||
const openDiscuss = () => {
|
||||
let dom = document.querySelector(".answer-discuss");
|
||||
if (!dom) return;
|
||||
const rect = dom.getBoundingClientRect();
|
||||
const scrollPosition = window.pageYOffset + rect.top - 50;
|
||||
window.scrollTo({
|
||||
top: scrollPosition,
|
||||
behavior: "smooth",
|
||||
});
|
||||
};
|
||||
|
||||
return { openDiscuss, commentDelete, handleInputPaste, autoResize, editCommentState, selectEditEmoji, closeEditEmoji, openEditEmoji, closeEdit, openEdit, closeEditFileUpload, postEditComment, submitAnswerComments, closePictureUpload, closeFileUpload, picture, editToken, editPicture, editInput, editEmojiState, handleFileUpload, inputTextarea, judgeLogin, handleEditFile, selectEmoji, emojiData, emojiMaskState, emojiState, closeEmoji, openEmoji, closeAnswerCommentsChild, openAnswerCommentsChild, dialogSrc, handleAnswerText, sendMessage, TAHomePage, operateAnswerCommentsLike, closeUserInfo, openUserInfo, permissions, commentList, commentPage, commentTotalCount, picture, userInfoWin, relatedList, relatedTime, coinNubmer, coinList, coinAmount, coinSubmit, strategy, mybalance, coinsState, openCoinBox, closeCoinBox, isLikeGif, likeClick, collectClick, islike, iscollect, recentlyList, medal, count, sectionn, tags, authorInfo, info, timestamp, updatedTime };
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
1646
js/homepage-me.js
1646
js/homepage-me.js
File diff suppressed because it is too large
Load Diff
1655
js/homepage-other.js
1655
js/homepage-other.js
File diff suppressed because it is too large
Load Diff
48
js/public.js
48
js/public.js
@@ -25,7 +25,8 @@ const ajax = (url, data) => {
|
||||
resolve(data);
|
||||
})
|
||||
.catch((err) => {
|
||||
if (err.response.status == 401)
|
||||
reject();
|
||||
if (err.response?.status == 401)
|
||||
showWindow("login", "https://passport.gter.net/login/ajax", "get", -1, {
|
||||
cover: true,
|
||||
});
|
||||
@@ -336,3 +337,48 @@ const goSendMessage = (uin) => {
|
||||
}
|
||||
redirectToExternalWebsite(`https://bbs.gter.net/home.php?mod=space&showmsg=1&uid=${uin}`);
|
||||
};
|
||||
|
||||
const lang = {
|
||||
money: { 1: "3000以下", 2: "3000-4000", 3: "4000-5000", 4: "5000-6500", 5: "6500-8000", 6: "8000-10000", 7: "10000-20000", 8: "20000-30000", 9: "30000-40000", 10: "40000-50000", 11: "50000以上" },
|
||||
leaseterm: { 1: "长租", 2: "短租" },
|
||||
intermediary: { 1: "中介", 2: "非中介", 3: "房东", 4: "有房招室友", 5: "其他", 6: "求房源" },
|
||||
property: { 1: "唐楼", 2: "洋楼", 3: "酒店式公寓", 4: "村屋", 5: "其他", 6: "学生公寓", 7: "house", 8: "屋苑", 9: "酒店" },
|
||||
elevator: { 1: "有电梯", 2: "无电梯", "-1": "不限" },
|
||||
sunshinearea: { 1: "阳台", 2: "天台", "-1": "无" },
|
||||
floor: { 1: "低层", 2: "中层", 3: "高层", 4: "地下", 5: "不要一楼", 6: "不要顶层" },
|
||||
tenementtype: { 1: "合租", 2: "整租", 1.5: "独卫套房", 1.1: "房间", 1.2: "床位", 1.3: "客厅", 1.4: "其他", 2.1: "studio", 2.2: "一房", 2.3: "两房", 2.4: "三房", 2.5: "四房以上" },
|
||||
gender: { 1: "女性", 2: "男性", 3: "男女皆可" },
|
||||
location: { 1: "港岛", 2: "九龙", 3: "新界", 1.1: "上环/中环/金钟", 1.2: "湾仔/铜锣湾", 1.3: "天后/炮台山", 1.4: "北角/则鱼涌", 1.5: "太古/西湾河", 1.6: "筲箕湾/柴湾", 1.7: "西营盘/坚尼地城/石塘咀", 1.8: "薄扶林", 1.9: "赤柱/香港仔", 1.11: "半山/山顶", 1.12: "南区", 2.1: "九龙站/奥运/南昌", 2.2: "尖沙咀/佐敦", 2.3: "长沙湾/深水埗/荔枝角", 2.4: "美孚/荔景", 2.5: "红磡/黄埔", 2.6: "土瓜湾/何文田", 2.7: "九龙城/启德", 2.8: "石夹尾/九龙塘", 2.9: "乐富/黄大仙", 2.11: "钻石山/彩虹", 2.12: "牛头角/九龙湾/观塘", 2.13: "蓝田/油塘", 2.14: "调景岭", 2.15: "油麻地/旺角/太子", 3.1: "葵芳/葵兴", 3.2: "荃湾", 3.3: "将军澳/坑口/宝琳", 3.4: "大埔仔/西贡", 3.5: "康城", 3.6: "大围/沙田", 3.7: "马鞍山", 3.8: "大埔/火炭/太和", 3.9: "粉岭/上水", 3.11: "赤泥坪/大埔尾/樟树滩", 3.12: "元朗/天水围/屯门", 3.13: "青衣", 3.14: "东涌/马湾/愉景湾", 3.15: "长洲" },
|
||||
apartmentschool: [
|
||||
{ id: 1, name: "港大", sid: 309 },
|
||||
{ id: 2, name: "城大", sid: 311 },
|
||||
{ id: 3, name: "理工", sid: 312 },
|
||||
{ id: 4, name: "浸会", sid: 313 },
|
||||
{ id: 5, name: "中大", sid: 308 },
|
||||
{ id: 6, name: "教大", sid: 453 },
|
||||
{ id: 7, name: "科大", sid: 310 },
|
||||
{ id: 8, name: "岭大", sid: 314 },
|
||||
{ id: 9, name: "都大", sid: 315 },
|
||||
],
|
||||
rentalduration: { 1: "1个月", 2: "2个月", 3: "3个月", 4: "4个月", 5: "5个月", 6: "6个月", 7: "7个月", 8: "8个月", 9: "9个月", 10: "10个月", 11: "11个月", 12: "1年", 13: "1年1个月", 14: "1年2个月", 15: "1年3个月", 16: "1年4个月", 17: "1年5个月", 18: "1年6个月", 24: "2年", 36: "3年" },
|
||||
};
|
||||
|
||||
let copyUid = (text) => {
|
||||
if (navigator.clipboard)
|
||||
copyUid = () => {
|
||||
navigator.clipboard.writeText(text);
|
||||
creationAlertBox("success", "复制成功");
|
||||
};
|
||||
else {
|
||||
copyUid = () => {
|
||||
var tempInput = document.createElement("input");
|
||||
tempInput.value = text;
|
||||
document.body.appendChild(tempInput);
|
||||
tempInput.select();
|
||||
document.execCommand("copy");
|
||||
document.body.removeChild(tempInput);
|
||||
creationAlertBox("success", "复制成功");
|
||||
};
|
||||
}
|
||||
copyUid();
|
||||
};
|
||||
|
||||
@@ -23,6 +23,8 @@ const watchList = {
|
||||
"../component/latest-list/latest-list.txt": "../component/latest-list/latest-list.js",
|
||||
// 监听 slideshow-box.txt，同步到 slideshow-box.js
|
||||
"../component/slideshow-box/slideshow-box.txt": "../component/slideshow-box/slideshow-box.js",
|
||||
// 监听 head-top.txt，同步到 head-top.js
|
||||
"../component/head-top/head-top.txt": "../component/head-top/head-top.js",
|
||||
|
||||
// 可添加更多文件（格式：'txt路径': 'js路径'）
|
||||
// './component/other/other.txt': './component/other/other.js',
|
||||
|
||||
23
js/search.js
Normal file
23
js/search.js
Normal file
@@ -0,0 +1,23 @@
|
||||
const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provide } = Vue;
|
||||
import { itemForum } from "../component/item-forum/item-forum.js";
|
||||
|
||||
const appSearch = createApp({
|
||||
setup() {
|
||||
onMounted(() => {
|
||||
const params = getUrlParams();
|
||||
const id = params.section || "";
|
||||
if (id) {
|
||||
section.value = id;
|
||||
init();
|
||||
}
|
||||
|
||||
section.value = id;
|
||||
|
||||
// init();
|
||||
});
|
||||
|
||||
return {};
|
||||
},
|
||||
});
|
||||
appSearch.component("item-forum", itemForum);
|
||||
appSearch.mount("#sectionIndex");
|
||||
@@ -3,7 +3,6 @@ import { itemForum } from "../component/item-forum/item-forum.js";
|
||||
|
||||
const appSectionIndex = createApp({
|
||||
setup() {
|
||||
let signInAlreadyState = ref(false);
|
||||
onMounted(() => {
|
||||
const params = getUrlParams();
|
||||
const id = params.section || "";
|
||||
@@ -199,7 +198,7 @@ const appSectionIndex = createApp({
|
||||
updateUrlParams({ section: uniqid });
|
||||
};
|
||||
|
||||
return { changeSection, signInAlreadyState, sectionList, section, info, handpickList, tagsList, list, count };
|
||||
return { changeSection, sectionList, section, info, handpickList, tagsList, list, count };
|
||||
},
|
||||
});
|
||||
appSectionIndex.component("item-forum", itemForum);
|
||||
|
||||
27
search.html
Normal file
27
search.html
Normal file
@@ -0,0 +1,27 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>搜索</title>
|
||||
<link rel="stylesheet" href="./css/public.css" />
|
||||
<link rel="stylesheet" href="./css/search.css" />
|
||||
<script src="./js/vue.global.js"></script>
|
||||
<style scoped>
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container" id="search" v-cloak>
|
||||
|
||||
</div>
|
||||
<script src="./js/axios.min.js"></script>
|
||||
<script src="./js/public.js"></script>
|
||||
<script type="module" src="./js/search.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user