feat: 添加移动端适配和优化组件样式

refactor: 重构CSS和LESS文件结构
style: 调整搜索页和公共样式
fix: 修复组件图片路径问题
docs: 更新组件文档和注释
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-12-23 19:13:01 +08:00
parent 2fd55c3e61
commit 826700970d
26 changed files with 2130 additions and 343 deletions

View File

@@ -0,0 +1,35 @@
// my-component.js
// 引入全局 Vue 对象(因在 HTML 中通过 script 引入Vue 已挂载到 window
const { defineComponent, ref, inject, defineAsyncComponent, onMounted } = Vue;
// 定义组件(直接使用模板)
export const QRCodePop = defineComponent({
name: "QR-code-pop",
props: {},
setup(props) {
let isMobile = ref(false);
let state = ref(false);
let valueUrl = ref("");
onMounted(() => {
isMobile.value = window.isMobile;
const valueA = document.querySelector(".valueA");
valueUrl.value = valueA.innerText;
});
const open = () => (state.value = true);
const closeGroup = () => (state.value = false);
const holdback = () => {};
return { valueUrl, state, isMobile, holdback, closeGroup, open };
},
components: {},
template: `<div class="QR-code-pop flexflex" v-if="state" @click="closeGroup" @touchmove.stop> <div class="pop-box flexacenter" @click.stop="holdback"> <img class="pop-title" :src="valueUrl + '/img/welcome-icon.png'"> <div class="pop-wechat-name flexcenter"> <img class="pop-wechat-icon" :src="valueUrl + '/img/wechat-name-icon.png'"> 寄托方同学 </div> <div class="pop-code-box flexcenter"> <div class="pop-code flexcenter"> <img class="pop-code-img" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-d_JkpcHnqqsgFptxhcq_cQnrlcaF2WQQQBq_D-81qNDQyOQ~~"> </div> <div class="pop-text">保存识别二维码</div> </div> <img class="pop-bottom1" :src="valueUrl + '/img/bottom2.svg'"> <img class="pop-bottom2" :src="valueUrl + '/img/bottom1.svg'"> </div></div>`,
});

View File

@@ -0,0 +1,17 @@
<div class="QR-code-pop flexflex" v-if="state" @click="closeGroup" @touchmove.stop>
<div class="pop-box flexacenter" @click.stop="holdback">
<img class="pop-title" :src="valueUrl + '/img/welcome-icon.png'">
<div class="pop-wechat-name flexcenter">
<img class="pop-wechat-icon" :src="valueUrl + '/img/wechat-name-icon.png'">
寄托方同学
</div>
<div class="pop-code-box flexcenter">
<div class="pop-code flexcenter">
<img class="pop-code-img" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-d_JkpcHnqqsgFptxhcq_cQnrlcaF2WQQQBq_D-81qNDQyOQ~~">
</div>
<div class="pop-text">保存识别二维码</div>
</div>
<img class="pop-bottom1" :src="valueUrl + '/img/bottom2.svg'">
<img class="pop-bottom2" :src="valueUrl + '/img/bottom1.svg'">
</div>
</div>

View File

@@ -0,0 +1,35 @@
// my-component.js
// 引入全局 Vue 对象(因在 HTML 中通过 script 引入Vue 已挂载到 window
const { defineComponent, ref, inject, defineAsyncComponent, onMounted } = Vue;
// 定义组件(直接使用模板)
export const groupPop = defineComponent({
name: "group-pop",
props: {},
setup(props) {
let isMobile = ref(false);
let state = ref(false);
let valueUrl = ref("");
onMounted(() => {
isMobile.value = window.isMobile;
const valueA = document.querySelector(".valueA");
valueUrl.value = valueA.innerText;
});
const open = () => (state.value = true);
const closeGroup = () => (state.value = false);
const holdback = () => {};
return { valueUrl, state, isMobile, holdback, closeGroup, open };
},
components: {},
template: `<div class="group-pop" v-if="state" @click="closeGroup"> <img class="bj" @click.stop="holdback" :src="valueUrl + '/img/huddle-bj.jpg'"> <img class="QRCode" @click.stop="holdback" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5kpcnzqqsgFptxhcq_cQnrlJKN1WgxCBq_D-81qNDQyOQ~~"></div>`,
});

View File

@@ -0,0 +1,4 @@
<div class="group-pop" v-if="state" @click="closeGroup">
<img class="bj" @click.stop="holdback" :src="valueUrl + '/img/huddle-bj.jpg'">
<img class="QRCode" @click.stop="holdback" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5kpcnzqqsgFptxhcq_cQnrlJKN1WgxCBq_D-81qNDQyOQ~~">
</div>

View File

@@ -12,8 +12,13 @@ export const helperPop = defineComponent({
let state = ref(false);
let valueUrl = ref("");
onMounted(() => {
isMobile.value = window.isMobile;
const valueA = document.querySelector(".valueA");
valueUrl.value = valueA.innerText;
});
const open = () => (state.value = true);
@@ -21,10 +26,10 @@ export const helperPop = defineComponent({
const holdback = () => {};
return { state, isMobile, holdback, closeGroup, open };
return { valueUrl, state, isMobile, holdback, closeGroup, open };
},
components: {},
template: `<div class="helper-pop flexflex" v-if="state" @click="closeGroup" @touchmove.prevent> <div class="helper-box flexacenter" @click.stop="holdback"> <img class="cross-grey" @click.stop="closeGroup" src="../../img/cross-grey.png" alt=""> <img class="helper-text helper-text1" src="../../img/apply-for-name.png" alt=""> <div class="helper-box-box flexflex"> <div class="helper-QRcode-box flexcenter"> <img class="left-top helper-QRcode-box-icon" src="../../img/yellow-border.svg" alt=""> <img class="left-bottom helper-QRcode-box-icon" src="../../img/yellow-border.svg" alt=""> <img class="right-top helper-QRcode-box-icon" src="../../img/yellow-border.svg" alt=""> <img class="right-bottom helper-QRcode-box-icon" src="../../img/yellow-border.svg" alt=""> <img class="helper-QRcode-img" src="https://u.gter.net/assistantwxqrcode.png" alt=""> </div> <span class="helper-box-text">长按识别二维码</span> </div> <img class="helper-bottom" src="../../img/helper-bottom-yellow.svg" alt=""> <img class="helper-bottom" src="../../img/helper-bottom-blue.svg" alt=""> </div></div>`,
template: `<div class="helper-pop flexflex" v-if="state" @click="closeGroup" @touchmove.prevent> <div class="helper-box flexacenter" @click.stop="holdback"> <img class="cross-grey" @click.stop="closeGroup" :src="valueUrl + '/img/cross-grey.png'" alt=""> <img class="helper-text helper-text1" :src="valueUrl + '/img/apply-for-name.png'" alt=""> <div class="helper-box-box flexflex"> <div class="helper-QRcode-box flexcenter"> <img class="left-top helper-QRcode-box-icon" :src="valueUrl + '/img/yellow-border.svg'" alt=""> <img class="left-bottom helper-QRcode-box-icon" :src="valueUrl + '/img/yellow-border.svg'" alt=""> <img class="right-top helper-QRcode-box-icon" :src="valueUrl + '/img/yellow-border.svg'" alt=""> <img class="right-bottom helper-QRcode-box-icon" :src="valueUrl + '/img/yellow-border.svg'" alt=""> <img class="helper-QRcode-img" src="https://u.gter.net/assistantwxqrcode.png" alt=""> </div> <span class="helper-box-text">保存识别二维码</span> </div> <img class="helper-bottom" :src="valueUrl + '/img/helper-bottom-yellow.svg'" alt=""> <img class="helper-bottom" :src="valueUrl + '/img/helper-bottom-blue.svg'" alt=""> </div></div>`,
});

View File

@@ -1,18 +1,18 @@
<div class="helper-pop flexflex" v-if="state" @click="closeGroup" @touchmove.prevent>
<div class="helper-box flexacenter" @click.stop="holdback">
<img class="cross-grey" @click.stop="closeGroup" src="../../img/cross-grey.png" alt="">
<img class="helper-text helper-text1" src="../../img/apply-for-name.png" alt="">
<img class="cross-grey" @click.stop="closeGroup" :src="valueUrl + '/img/cross-grey.png'" alt="">
<img class="helper-text helper-text1" :src="valueUrl + '/img/apply-for-name.png'" alt="">
<div class="helper-box-box flexflex">
<div class="helper-QRcode-box flexcenter">
<img class="left-top helper-QRcode-box-icon" src="../../img/yellow-border.svg" alt="">
<img class="left-bottom helper-QRcode-box-icon" src="../../img/yellow-border.svg" alt="">
<img class="right-top helper-QRcode-box-icon" src="../../img/yellow-border.svg" alt="">
<img class="right-bottom helper-QRcode-box-icon" src="../../img/yellow-border.svg" alt="">
<img class="left-top helper-QRcode-box-icon" :src="valueUrl + '/img/yellow-border.svg'" alt="">
<img class="left-bottom helper-QRcode-box-icon" :src="valueUrl + '/img/yellow-border.svg'" alt="">
<img class="right-top helper-QRcode-box-icon" :src="valueUrl + '/img/yellow-border.svg'" alt="">
<img class="right-bottom helper-QRcode-box-icon" :src="valueUrl + '/img/yellow-border.svg'" alt="">
<img class="helper-QRcode-img" src="https://u.gter.net/assistantwxqrcode.png" alt="">
</div>
<span class="helper-box-text">长按识别二维码</span>
<span class="helper-box-text">保存识别二维码</span>
</div>
<img class="helper-bottom" src="../../img/helper-bottom-yellow.svg" alt="">
<img class="helper-bottom" src="../../img/helper-bottom-blue.svg" alt="">
<img class="helper-bottom" :src="valueUrl + '/img/helper-bottom-yellow.svg'" alt="">
<img class="helper-bottom" :src="valueUrl + '/img/helper-bottom-blue.svg'" alt="">
</div>
</div>

View File

@@ -12,8 +12,13 @@ export const huddleBox = defineComponent({
let state = ref(false);
let valueUrl = ref("");
onMounted(() => {
isMobile.value = window.isMobile;
const valueA = document.querySelector(".valueA");
valueUrl.value = valueA.innerText;
});
const open = () => (state.value = true);
@@ -21,10 +26,10 @@ export const huddleBox = defineComponent({
const holdback = () => {};
return { state, isMobile, holdback, closeGroup, open };
return { valueUrl, state, isMobile, holdback, closeGroup, open };
},
components: {},
template: `<div class="huddle-box" @click="closeGroup" v-if="state"> <div class="box flexflex" @click.stop="holdback"> <img class="bj" src="../../img/group-bj.svg" alt=""> <img class="bj-bottom" src="../../img/group-bottom.png" alt=""> <img class="top" src="../../img/group-top.png" alt=""> <img class="title" src="../../img/group-title.png" alt=""> <div class="text">抱团 / 信息共享 / 互助申学</div> <div class="case flexflex"> <div class="QRcode flexcenter"> <img class="img" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5kpcnzqqsgFptxhcq_cQnrlJKN1WgxCBq_D-81qNDQyOQ~~" alt=""> </div> <div class="hint flexcenter"> <img class="img img-left" src="../../img/group-arrows.png" alt=""> <span class="hint-text">添加寄托葱哥进群</span> <img class="img" src="../../img/group-arrows.png" alt=""> </div> </div> </div> </div>`,
template: `<div class="huddle-box" @click="closeGroup" v-if="state"> <div class="box flexflex" @click.stop="holdback"> <img class="bj" :src="valueUrl + '/img/group-bj.svg'" alt=""> <img class="bj-bottom" :src="valueUrl + '/img/group-bottom.png'" alt=""> <img class="top" :src="valueUrl + '/img/group-top.png'" alt=""> <img class="title" :src="valueUrl + '/img/group-title.png'" alt=""> <div class="text">抱团 / 信息共享 / 互助申学</div> <div class="case flexflex"> <div class="QRcode flexcenter"> <img class="img" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5kpcnzqqsgFptxhcq_cQnrlJKN1WgxCBq_D-81qNDQyOQ~~" alt=""> </div> <div class="hint flexcenter"> <img class="img img-left" :src="valueUrl + '/img/group-arrows.png'" alt=""> <span class="hint-text">添加寄托葱哥进群</span> <img class="img" :src="valueUrl + '/img/group-arrows.png'" alt=""> </div> </div> </div> </div>`,
});

View File

@@ -1,18 +1,18 @@
<div class="huddle-box" @click="closeGroup" v-if="state">
<div class="box flexflex" @click.stop="holdback">
<img class="bj" src="../../img/group-bj.svg" alt="">
<img class="bj-bottom" src="../../img/group-bottom.png" alt="">
<img class="top" src="../../img/group-top.png" alt="">
<img class="title" src="../../img/group-title.png" alt="">
<img class="bj" :src="valueUrl + '/img/group-bj.svg'" alt="">
<img class="bj-bottom" :src="valueUrl + '/img/group-bottom.png'" alt="">
<img class="top" :src="valueUrl + '/img/group-top.png'" alt="">
<img class="title" :src="valueUrl + '/img/group-title.png'" alt="">
<div class="text">抱团 / 信息共享 / 互助申学</div>
<div class="case flexflex">
<div class="QRcode flexcenter">
<img class="img" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5kpcnzqqsgFptxhcq_cQnrlJKN1WgxCBq_D-81qNDQyOQ~~" alt="">
</div>
<div class="hint flexcenter">
<img class="img img-left" src="../../img/group-arrows.png" alt="">
<img class="img img-left" :src="valueUrl + '/img/group-arrows.png'" alt="">
<span class="hint-text">添加寄托葱哥进群</span>
<img class="img" src="../../img/group-arrows.png" alt="">
<img class="img" :src="valueUrl + '/img/group-arrows.png'" alt="">
</div>
</div>
</div>

View File

@@ -31,5 +31,5 @@ export const itemOffer = defineComponent({
itemHead,
},
template: `<div class="item-box item-offer"> <item-head :itemdata="item" :page="page"></item-head> <a class="school flexacenter" :href="item.url" target="_blank"> <img class="icon" v-if="item.data.schoollogo" :src="item.data.schoollogo" /> <div class="text flex1 one-line-display">{{ item.data.schoolname }}</div> </a> <a class="major flexacenter" v-if="item.data.professional" :href="item.url" target="_blank"> <div class="key">{{ item.data.project ? '专业' : '项目/专业' }}</div> <div class="value flex1 one-line-display">{{ item.data.professional }}</div> </a> <a class="major flexacenter" v-if="item.data.project" :href="item.url" target="_blank"> <div class="key">项目</div> <div class="value flex1 one-line-display">{{ item.data.project }}</div> </a> <a class="info flexacenter" :href="item.url" target="_blank"> {{ 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> </a> <a class="message" v-if="item.content" :href="item.url" target="_blank">{{ item.content }}</a> <item-bottom :itemdata="item" :page="page"></item-bottom></div>`,
template: `<div class="item-box item-offer"> <item-head :itemdata="item" :page="page"></item-head> <a class="school flexacenter" :href="item.url" target="_blank"> <img class="icon" v-if="item.data.schoollogo" :src="item.data.schoollogo" /> <div class="text flex1 one-line-display-v2">{{ item.data.schoolname }}</div> </a> <a class="major flexacenter" v-if="item.data.professional" :href="item.url" target="_blank"> <div class="key">{{ item.data.project ? '专业' : '项目/专业' }}</div> <div class="value flex1 one-line-display-v2">{{ item.data.professional }}</div> </a> <a class="major flexacenter" v-if="item.data.project" :href="item.url" target="_blank"> <div class="key">项目</div> <div class="value flex1 one-line-display-v2">{{ item.data.project }}</div> </a> <a class="info flexacenter" :href="item.url" target="_blank"> {{ 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> </a> <a class="message" v-if="item.content" :href="item.url" target="_blank">{{ item.content }}</a> <item-bottom :itemdata="item" :page="page"></item-bottom></div>`,
});

View File

@@ -2,17 +2,17 @@
<item-head :itemdata="item" :page="page"></item-head>
<a class="school flexacenter" :href="item.url" target="_blank">
<img class="icon" v-if="item.data.schoollogo" :src="item.data.schoollogo" />
<div class="text flex1 one-line-display">{{ item.data.schoolname }}</div>
<div class="text flex1 one-line-display-v2">{{ item.data.schoolname }}</div>
</a>
<a class="major flexacenter" v-if="item.data.professional" :href="item.url" target="_blank">
<div class="key">{{ item.data.project ? '专业' : '项目/专业' }}</div>
<div class="value flex1 one-line-display">{{ item.data.professional }}</div>
<div class="value flex1 one-line-display-v2">{{ item.data.professional }}</div>
</a>
<a class="major flexacenter" v-if="item.data.project" :href="item.url" target="_blank">
<div class="key">项目</div>
<div class="value flex1 one-line-display">{{ item.data.project }}</div>
<div class="value flex1 one-line-display-v2">{{ item.data.project }}</div>
</a>
<a class="info flexacenter" :href="item.url" target="_blank">

View File

@@ -1,5 +1,5 @@
#appIndex {
width: 1200px;
max-width: 1200px;
margin: 0 auto;
}
#appIndex a {
@@ -9,9 +9,15 @@
justify-content: space-between;
margin-bottom: 28px;
}
#appIndex .header-content-box .header-content-left {
width: calc(100% - 252px);
}
#appIndex .header-content-box .header-content-left .adv-list {
margin-bottom: 18px;
}
#appIndex .header-content-box .header-content-left .adv-list .adv-item {
width: calc((100% - 12px) / 2);
}
#appIndex .header-content-box .header-content-left .adv-list .adv-item:not(:last-child) {
margin-right: 12px;
}
@@ -19,10 +25,11 @@
display: block;
}
#appIndex .header-content-box .header-content-left .adv-list .adv-item img {
width: 468px;
height: 60px;
width: 100%;
height: auto;
border-radius: 10px;
display: block;
object-fit: cover;
}
#appIndex .header-content-box .header-content-left .topic-and-selectives .head-top {
width: 64px;
@@ -44,7 +51,7 @@
font-size: 14px;
}
#appIndex .header-content-box .header-content-left .topic-and-selectives .topic-box {
width: 308px;
width: calc((100% - 12px) * 0.325);
height: 320px;
background-color: #ffffff;
border: 1px solid #e9eef2;
@@ -141,7 +148,7 @@
color: #000000;
}
#appIndex .header-content-box .header-content-left .topic-and-selectives .selectives-box {
width: 628px;
width: calc((100% - 12px) * 0.662);
height: 320px;
background-color: #ffffff;
border: 1px solid #e9eef2;
@@ -158,6 +165,7 @@
justify-content: space-between;
}
#appIndex .header-content-box .header-content-left .topic-and-selectives .selectives-box .list .item {
width: 48%;
font-size: 14px;
color: #555555;
line-height: 20px;
@@ -176,41 +184,46 @@
margin-right: 10px;
}
#appIndex .header-content-box .header-content-left .topic-and-selectives .selectives-box .list .item .text {
width: 265px;
width: auto;
flex: 1;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box {
width: 948px;
height: 140px;
width: 100%;
height: auto;
background-color: #ffffff;
border: 1px solid #e9eef2;
border-radius: 10px;
padding-left: 12px;
padding: 12px;
margin-top: 12px;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box .adv {
margin-right: 26px;
width: 31%;
flex-shrink: 0;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box .adv .adv-icon {
width: 295px;
height: 118px;
width: 100%;
height: auto;
border-radius: 5px;
cursor: pointer;
object-fit: cover;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box .list {
font-size: 14px;
color: #555555;
padding-top: 12px;
width: 281px;
flex: 1;
margin-right: 39px;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box .list.list2 {
margin-right: 0;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box .list.list2 .item .text {
width: 255px;
width: auto;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box .list .item {
height: 20px;
display: flex;
align-items: center;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box .list .item:not(:last-of-type) {
margin-bottom: 12px;
@@ -221,10 +234,12 @@
margin-right: 10px;
background: #30b0d5;
border-radius: 50%;
flex-shrink: 0;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box .list .item .text {
cursor: pointer;
width: 266px;
flex: 1;
min-width: 0;
text-decoration: none;
color: #555;
}
@@ -464,12 +479,22 @@
flex-wrap: wrap;
}
#appIndex .admission .admission-list .admission-item {
width: 291px;
height: 103px;
width: calc((100% - 36px) / 4);
aspect-ratio: 291 / 103;
border-radius: 9px;
cursor: pointer;
overflow: hidden;
}
#appIndex .admission .admission-list .admission-item .admission-img {
display: block;
width: 100%;
height: 100%;
}
#appIndex .admission .admission-list .admission-item img {
width: 100%;
height: 100%;
object-fit: cover;
}
#appIndex .admission .admission-list .admission-item:not(:nth-child(4n)) {
margin-right: 12px;
}
@@ -486,13 +511,13 @@
}
#appIndex .matter .matter-content .forum-sections-list {
position: relative;
width: 897px;
height: 240px;
background-color: #ffffff;
border: 1px solid #e9eef2;
border-radius: 10px;
padding-left: 70px;
padding-top: 20px;
padding-right: 2px;
padding-bottom: 14px;
margin-bottom: 20px;
}
#appIndex .matter .matter-content .forum-sections-list .img {
@@ -500,7 +525,7 @@
top: -1px;
left: -1px;
width: 60px;
height: 240px;
height: 100%;
}
#appIndex .matter .matter-content .forum-sections-list .title {
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
@@ -510,8 +535,8 @@
color: #000000;
margin-bottom: 16px;
}
#appIndex .matter .matter-content .forum-sections-list .list .line:not(:last-child) {
margin-bottom: 10px;
#appIndex .matter .matter-content .forum-sections-list .list .line {
flex-wrap: wrap;
}
#appIndex .matter .matter-content .forum-sections-list .list .line .item {
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
@@ -525,6 +550,7 @@
border: 1px solid #f2f2f2;
border-radius: 16px;
cursor: pointer;
margin-bottom: 10px;
}
#appIndex .matter .matter-content .forum-sections-list .list .line .item:not(:last-child) {
margin-right: 10px;
@@ -562,3 +588,181 @@
#appIndex .matter .sidebar .side-box.interviewexperience-side-box {
background: linear-gradient(158.64328877deg, #d3e1fb 1%, #dee6f9 100%);
}
@media screen and (max-width: 768px) {
.head-top {
width: 100% !important;
padding: 0 10px;
margin: 10px auto !important;
flex-wrap: wrap;
}
.head-top .input-box {
display: none !important;
}
.head-top .post-list {
display: none !important;
}
.head-top .sign-in {
display: none !important;
}
#appIndex {
width: 100%;
padding: 0 10px;
}
#appIndex .header-content-box {
flex-direction: column;
}
#appIndex .header-content-box .header-content-left {
width: 100%;
}
#appIndex .header-content-box .header-content-left .adv-list {
display: none;
}
#appIndex .header-content-box .header-content-left .topic-and-selectives {
flex-direction: column;
}
#appIndex .header-content-box .header-content-left .topic-and-selectives .topic-box {
width: 100%;
margin-right: 0;
margin-bottom: 10px;
height: auto;
}
#appIndex .header-content-box .header-content-left .topic-and-selectives .selectives-box {
width: 100%;
height: auto;
}
#appIndex .header-content-box .header-content-left .topic-and-selectives .selectives-box .list .item {
width: 100%;
}
#appIndex .header-content-box .header-content-left .topic-and-selectives .selectives-box .list .item .text {
width: auto;
}
#appIndex .header-content-box .header-content-left .topic-and-selectives .head-top {
width: max-content !important;
margin-left: 0 !important;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box {
width: 100%;
height: auto;
flex-direction: column;
padding: 10px;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box .adv {
margin-right: 0;
margin-bottom: 10px;
width: 100%;
height: auto;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box .adv .adv-icon {
width: 100%;
height: auto;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box .list {
width: 100%;
margin-right: 0;
margin-bottom: 0;
}
#appIndex .header-content-box .header-content-left .header-left-bottom-box .list .item .text {
width: auto;
}
#appIndex .header-content-box .header-content-right {
display: none;
}
#appIndex .admission .admission-list {
flex-wrap: nowrap;
overflow-x: auto;
}
#appIndex .admission .admission-list .admission-item {
flex-shrink: 0;
width: auto;
height: 80px;
margin-right: 12px;
}
#appIndex .admission .admission-list .admission-item:not(:nth-last-child(-n + 4)) {
margin-bottom: 5px;
}
#appIndex .admission .admission-list .admission-item img {
width: 100%;
height: auto;
}
#appIndex .pop-list {
display: block;
}
#appIndex .matter {
flex-direction: column;
}
#appIndex .matter .matter-content {
width: 100%;
margin-right: 0;
}
#appIndex .matter .matter-content .forum-sections-list {
width: 100%;
height: auto;
padding: 10px;
}
#appIndex .matter .matter-content .forum-sections-list .img {
display: none;
}
#appIndex .matter .matter-content .forum-sections-list .list .line {
flex-wrap: wrap;
margin-bottom: 0 !important;
height: auto;
}
#appIndex .matter .matter-content .forum-sections-list .list .line .item {
margin-bottom: 10px;
}
#appIndex .matter .sidebar {
display: none;
}
}
.pop-list {
width: 100%;
background-color: #ffffff;
border: 1px solid #f2f2f2;
border-radius: 20px;
padding: 6px;
margin: 0 auto 20px;
display: none;
}
.pop-list .list {
background-color: #f6f6f6;
border-radius: 15px;
width: 100%;
display: flex;
align-items: center;
}
.pop-list .list .item {
display: flex;
flex-direction: column;
justify-content: center;
height: 70px;
}
.pop-list .list .item:nth-of-type(1) {
flex: 95;
}
.pop-list .list .item:nth-of-type(2) {
flex: 114;
}
.pop-list .list .item:nth-of-type(3) {
flex: 109;
}
.pop-list .list .item:nth-of-type(4) {
flex: 140;
}
.pop-list .list .item:not(:last-of-type) {
border-right: 1px dotted #d7d7d7;
}
.pop-list .list .item .top {
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
font-weight: 650;
color: #000000;
font-size: 16px;
line-height: 26px;
text-align: center;
}
.pop-list .list .item .bottom {
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
color: #555555;
font-size: 14px;
text-align: center;
}

View File

@@ -1,5 +1,5 @@
#appIndex {
width: 1200px;
max-width: 1200px;
margin: 0 auto;
a {
@@ -11,10 +11,14 @@
margin-bottom: 28px;
.header-content-left {
width: calc(100% - 252px);
.adv-list {
margin-bottom: 18px;
.adv-item {
width: calc((100% - 12px) / 2);
&:not(:last-child) {
margin-right: 12px;
}
@@ -24,10 +28,11 @@
}
img {
width: 468px;
height: 60px;
width: 100%;
height: auto;
border-radius: 10px;
display: block;
object-fit: cover;
}
}
}
@@ -56,7 +61,7 @@
}
.topic-box {
width: 308px;
width: calc((100% - 12px) * 0.325);
height: 320px;
background-color: rgba(255, 255, 255, 1);
border: 1px solid rgba(233, 238, 242, 1);
@@ -178,7 +183,7 @@
}
.selectives-box {
width: 628px;
width: calc((100% - 12px) * 0.662);
height: 320px;
background-color: #ffffff;
border: 1px solid #e9eef2;
@@ -196,6 +201,7 @@
justify-content: space-between;
.item {
width: 48%;
font-size: 14px;
color: #555555;
line-height: 20px;
@@ -216,7 +222,8 @@
}
.text {
width: 265px;
width: auto;
flex: 1;
}
}
}
@@ -224,42 +231,46 @@
}
.header-left-bottom-box {
width: 948px;
height: 140px;
width: 100%;
height: auto;
background-color: rgba(255, 255, 255, 1);
border: 1px solid rgba(233, 238, 242, 1);
border-radius: 10px;
padding-left: 12px;
padding: 12px;
margin-top: 12px;
.adv {
margin-right: 26px;
width: 31%;
flex-shrink: 0;
.adv-icon {
width: 295px;
height: 118px;
width: 100%;
height: auto;
border-radius: 5px;
cursor: pointer;
object-fit: cover;
}
}
.list {
font-size: 14px;
color: #555555;
padding-top: 12px;
width: 281px;
flex: 1;
margin-right: 39px;
&.list2 {
margin-right: 0;
.item .text {
width: 255px;
width: auto;
}
}
.item {
height: 20px;
display: flex;
align-items: center;
&:not(:last-of-type) {
margin-bottom: 12px;
@@ -271,11 +282,13 @@
margin-right: 10px;
background: #30b0d5;
border-radius: 50%;
flex-shrink: 0;
}
.text {
cursor: pointer;
width: 266px;
flex: 1;
min-width: 0;
text-decoration: none;
color: #555;
@@ -573,12 +586,24 @@
flex-wrap: wrap;
.admission-item {
width: 291px;
height: 103px;
width: calc((100% - 36px) / 4);
aspect-ratio: 291 / 103;
border-radius: 9px;
cursor: pointer;
overflow: hidden;
.admission-img {
display: block;
width: 100%;
height: 100%;
}
img {
width: 100%;
height: 100%;
object-fit: cover;
}
&:not(:nth-child(4n)) {
margin-right: 12px;
}
@@ -600,13 +625,15 @@
.forum-sections-list {
position: relative;
width: 897px;
height: 240px;
// flex: 1;
// height: 240px;
background-color: rgba(255, 255, 255, 1);
border: 1px solid rgba(233, 238, 242, 1);
border-radius: 10px;
padding-left: 70px;
padding-top: 20px;
padding-right: 2px;
padding-bottom: 14px;
margin-bottom: 20px;
.img {
@@ -614,7 +641,7 @@
top: -1px;
left: -1px;
width: 60px;
height: 240px;
height: 100%;
}
.title {
@@ -628,10 +655,7 @@
.list {
.line {
&:not(:last-child) {
margin-bottom: 10px;
}
flex-wrap: wrap;
.item {
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
@@ -644,6 +668,7 @@
border: 1px solid rgba(242, 242, 242, 1);
border-radius: 16px;
cursor: pointer;
margin-bottom: 10px;
&:not(:last-child) {
margin-right: 10px;
@@ -702,3 +727,233 @@
}
}
}
@media screen and (max-width: 768px) {
.head-top {
width: 100% !important;
padding: 0 10px;
margin: 10px auto !important;
flex-wrap: wrap;
.input-box {
display: none !important;
}
.post-list {
display: none !important;
}
.sign-in {
display: none !important;
}
}
#appIndex {
width: 100%;
padding: 0 10px;
.header-content-box {
flex-direction: column;
.header-content-left {
width: 100%;
.adv-list {
display: none;
}
.topic-and-selectives {
flex-direction: column;
.topic-box {
width: 100%;
margin-right: 0;
margin-bottom: 10px;
height: auto;
}
.selectives-box {
width: 100%;
height: auto;
.list .item {
width: 100%;
.text {
width: auto;
}
}
}
.head-top {
width: max-content !important;
margin-left: 0 !important;
}
}
.header-left-bottom-box {
width: 100%;
height: auto;
flex-direction: column;
padding: 10px;
.adv {
margin-right: 0;
margin-bottom: 10px;
width: 100%;
height: auto;
.adv-icon {
width: 100%;
height: auto;
}
}
.list {
width: 100%;
margin-right: 0;
margin-bottom: 0;
.item {
// margin-bottom: 12px;
.text {
width: auto;
}
}
}
}
}
.header-content-right {
display: none;
}
}
.admission {
.admission-list {
flex-wrap: nowrap;
overflow-x: auto;
.admission-item {
flex-shrink: 0;
width: auto;
height: 80px;
margin-right: 12px;
&:not(:nth-last-child(-n + 4)) {
margin-bottom: 5px;
}
img {
width: 100%;
height: auto;
}
}
}
}
.pop-list {
display: block;
}
.matter {
flex-direction: column;
.matter-content {
width: 100%;
margin-right: 0;
.forum-sections-list {
width: 100%;
height: auto;
padding: 10px;
.img {
display: none;
}
.list {
.line {
flex-wrap: wrap;
margin-bottom: 0 !important;
height: auto;
.item {
margin-bottom: 10px;
}
}
}
}
}
.sidebar {
display: none;
}
}
}
}
.pop-list {
width: 100%;
// max-width: 470px;
// min-height: 90px;
background-color: rgba(255, 255, 255, 1);
border: 1px solid rgba(242, 242, 242, 1);
border-radius: 20px;
padding: 6px;
margin: 0 auto 20px;
display: none;
.list {
background-color: rgba(246, 246, 246, 1);
border-radius: 15px;
width: 100%;
// height: 100%;
display: flex;
align-items: center;
.item {
display: flex;
flex-direction: column;
justify-content: center;
height: 70px;
&:nth-of-type(1) {
flex: 95;
}
&:nth-of-type(2) {
flex: 114;
}
&:nth-of-type(3) {
flex: 109;
}
&:nth-of-type(4) {
flex: 140;
}
&:not(:last-of-type) {
border-right: 1px dotted #d7d7d7;
}
.top {
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
font-weight: 650;
color: #000000;
font-size: 16px;
line-height: 26px;
text-align: center;
}
.bottom {
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
color: #555555;
font-size: 14px;
text-align: center;
}
}
}
}

View File

@@ -2502,3 +2502,186 @@ td {
top: 0;
}
}
.group-pop {
width: 100vw;
height: 100vh;
position: fixed;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.71764706);
z-index: 111;
animation: slidebj 0.5s forwards;
}
.group-pop .bj {
width: 500px;
height: 823px;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
border-radius: 20px 20px 0 0;
animation: slidebj 0.5s forwards;
}
.group-pop .QRCode {
width: 180px;
height: 180px;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 165px;
}
@media screen and (max-width: 600px) {
.group-pop .bj {
width: calc(min(164.6vw, 80vh) * 500 / 823);
height: min(164.6vw, 80vh);
max-height: 80vh;
object-fit: cover;
border-radius: calc(min(164.6vw, 80vh) * 20 / 823) calc(min(164.6vw, 80vh) * 20 / 823) 0 0;
left: 50%;
transform: translateX(-50%);
}
.group-pop .QRCode {
width: calc(min(164.6vw, 80vh) * 180 / 823);
height: calc(min(164.6vw, 80vh) * 180 / 823);
bottom: calc(min(164.6vw, 80vh) * 165 / 823);
}
}
.QR-code-pop {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, 0.71764706);
z-index: 1004;
flex-direction: column;
justify-content: flex-end;
}
.QR-code-pop .pop-box {
align-items: center;
flex-direction: column;
padding-top: 60px;
background: linear-gradient(180deg, #f4f4f4 -1%, #f7faff 100%);
border-radius: 20px 20px 0 19px;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.10196078);
}
.QR-code-pop .pop-box .pop-title {
width: 221px;
height: 48px;
margin-bottom: 18px;
}
.QR-code-pop .pop-box .pop-wechat-name {
color: #333;
font-size: 18px;
font-weight: 400;
margin-bottom: 36px;
}
.QR-code-pop .pop-box .pop-wechat-icon {
width: 22px;
height: 22px;
margin-right: 4px;
}
.QR-code-pop .pop-box .pop-wechat-icon1 {
width: 18px;
height: 18px;
margin-right: 4px;
}
.QR-code-pop .pop-box .pop-code-box {
flex-direction: column;
padding: 20px;
background: -webkit-linear-gradient(90deg, #2c196d -1%, #fddf6d 99%);
background: -moz-linear-gradient(0deg, #2c196d -1%, #fddf6d 99%);
background: linear-gradient(0deg, #2c196d -1%, #fddf6d 99%);
border-radius: 20px;
-moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.17647059);
-webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.17647059);
box-shadow: 0 0 15px rgba(0, 0, 0, 0.17647059);
position: relative;
z-index: 1;
margin-bottom: 81px;
}
.QR-code-pop .pop-box .pop-code-box.pop-code-box1 {
background: -webkit-linear-gradient(90deg, #29186c -1%, #9278d4 101%);
background: -moz-linear-gradient(-15.42108547e, #29186c -1%, #9278d4 101%);
background: linear-gradient(-15.42108547e, #29186c -1%, #9278d4 101%);
}
.QR-code-pop .pop-box .pop-code {
width: 240px;
height: 240px;
background-color: #fff;
border-radius: 6px;
margin-bottom: 20px;
}
.QR-code-pop .pop-box .pop-code .pop-code-img {
width: 220px;
height: 220px;
}
.QR-code-pop .pop-box .pop-text {
color: #fff;
letter-spacing: 0.6px;
font-size: 16px;
line-height: 28px;
}
.QR-code-pop .pop-box .pop-bottom1,
.QR-code-pop .pop-box .pop-bottom2 {
width: 100vw;
position: fixed;
left: 50%;
transform: translateX(-50%);
bottom: 0;
}
.QR-code-pop .pop-box .pop-bottom1 {
height: 155px;
}
.QR-code-pop .pop-box .pop-bottom2 {
height: 151px;
}
@media screen and (max-width: 600px) {
.QR-code-pop .pop-box {
padding-top: calc(60 / 600 * 100vw);
border-radius: calc(20 / 600 * 100vw) calc(20 / 600 * 100vw) 0 calc(19 / 600 * 100vw);
box-shadow: 0 0 calc(15 / 600 * 100vw) rgba(0, 0, 0, 0.10196078);
}
.QR-code-pop .pop-box .pop-title {
width: calc(221 / 600 * 100vw);
height: calc(48 / 600 * 100vw);
margin-bottom: calc(18 / 600 * 100vw);
}
.QR-code-pop .pop-box .pop-wechat-name {
font-size: calc(18 / 600 * 100vw);
margin-bottom: calc(36 / 600 * 100vw);
}
.QR-code-pop .pop-box .pop-wechat-icon {
width: calc(22 / 600 * 100vw);
height: calc(22 / 600 * 100vw);
margin-right: calc(4 / 600 * 100vw);
}
.QR-code-pop .pop-box .pop-wechat-icon1 {
width: calc(18 / 600 * 100vw);
height: calc(18 / 600 * 100vw);
margin-right: calc(4 / 600 * 100vw);
}
.QR-code-pop .pop-box .pop-code-box {
padding: calc(20 / 600 * 100vw);
border-radius: calc(20 / 600 * 100vw);
-moz-box-shadow: 0 0 calc(15 / 600 * 100vw) rgba(0, 0, 0, 0.17647059);
-webkit-box-shadow: 0 0 calc(15 / 600 * 100vw) rgba(0, 0, 0, 0.17647059);
box-shadow: 0 0 calc(15 / 600 * 100vw) rgba(0, 0, 0, 0.17647059);
margin-bottom: calc(81 / 600 * 100vw);
}
.QR-code-pop .pop-box .pop-code {
width: calc(240 / 600 * 100vw);
height: calc(240 / 600 * 100vw);
border-radius: calc(6 / 600 * 100vw);
margin-bottom: calc(20 / 600 * 100vw);
}
.QR-code-pop .pop-box .pop-code .pop-code-img {
width: calc(220 / 600 * 100vw);
height: calc(220 / 600 * 100vw);
}
.QR-code-pop .pop-box .pop-text {
letter-spacing: calc(0.6 / 600 * 100vw);
font-size: calc(16 / 600 * 100vw);
line-height: calc(28 / 600 * 100vw);
}
}

View File

@@ -2995,3 +2995,225 @@ td {
top: 0;
}
}
.group-pop {
width: 100vw;
height: 100vh;
position: fixed;
top: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.717647058823529);
z-index: 111;
animation: slidebj 0.5s forwards;
.bj {
width: 500px;
height: 823px;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
border-radius: 20px 20px 0 0;
animation: slidebj 0.5s forwards;
}
.QRCode {
width: 180px;
height: 180px;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 165px;
}
@media screen and (max-width: 600px) {
.bj {
width: calc(~"min(164.6vw, 80vh)" * 500 / 823);
height: ~"min(164.6vw, 80vh)";
max-height: 80vh;
object-fit: cover;
border-radius: calc(~"min(164.6vw, 80vh)" * 20 / 823) calc(~"min(164.6vw, 80vh)" * 20 / 823) 0 0;
left: 50%;
transform: translateX(-50%);
}
.QRCode {
width: calc(~"min(164.6vw, 80vh)" * 180 / 823);
height: calc(~"min(164.6vw, 80vh)" * 180 / 823);
bottom: calc(~"min(164.6vw, 80vh)" * 165 / 823);
}
}
}
.QR-code-pop {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, 0.717647058823529);
z-index: 1004;
flex-direction: column;
justify-content: flex-end;
.pop-box {
align-items: center;
flex-direction: column;
padding-top: 60px;
background: linear-gradient(180deg, rgba(244, 244, 244, 1) -1%, rgba(247, 250, 255, 1) 100%);
border-radius: 20px 20px 0 19px;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.101960784313725);
.pop-title {
width: 221px;
height: 48px;
margin-bottom: 18px;
}
.pop-wechat-name {
color: #333;
font-size: 18px;
font-weight: 400;
margin-bottom: 36px;
}
.pop-wechat-icon {
width: 22px;
height: 22px;
margin-right: 4px;
}
.pop-wechat-icon1 {
width: 18px;
height: 18px;
margin-right: 4px;
}
.pop-code-box {
flex-direction: column;
padding: 20px;
background: -webkit-linear-gradient(90deg, rgba(44, 25, 109, 1) -1%, rgba(253, 223, 109, 1) 99%);
background: -moz-linear-gradient(0deg, rgba(44, 25, 109, 1) -1%, rgba(253, 223, 109, 1) 99%);
background: linear-gradient(0deg, rgba(44, 25, 109, 1) -1%, rgba(253, 223, 109, 1) 99%);
border-radius: 20px;
-moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.176470588235294);
-webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.176470588235294);
box-shadow: 0 0 15px rgba(0, 0, 0, 0.176470588235294);
position: relative;
z-index: 1;
margin-bottom: 81px;
&.pop-code-box1 {
background: -webkit-linear-gradient(90deg, rgba(41, 24, 108, 1) -1%, rgba(146, 120, 212, 1) 101%);
background: -moz-linear-gradient(-1.4210854715202e-14deg, rgba(41, 24, 108, 1) -1%, rgba(146, 120, 212, 1) 101%);
background: linear-gradient(-1.4210854715202e-14deg, rgba(41, 24, 108, 1) -1%, rgba(146, 120, 212, 1) 101%);
}
}
.pop-code {
width: 240px;
height: 240px;
background-color: #fff;
border-radius: 6px;
margin-bottom: 20px;
.pop-code-img {
width: 220px;
height: 220px;
}
}
.pop-text {
color: #fff;
letter-spacing: 0.6px;
font-size: 16px;
line-height: 28px;
}
.pop-bottom1,
.pop-bottom2 {
width: 100vw;
position: fixed;
left: 50%;
transform: translateX(-50%);
bottom: 0;
}
.pop-bottom1 {
height: 155px;
}
.pop-bottom2 {
height: 151px;
}
}
@media screen and (max-width: 600px) {
.pop-box {
padding-top: calc(60 / 600 * 100vw);
border-radius: calc(20 / 600 * 100vw) calc(20 / 600 * 100vw) 0 calc(19 / 600 * 100vw);
box-shadow: 0 0 calc(15 / 600 * 100vw) rgba(0, 0, 0, 0.101960784313725);
.pop-title {
width: calc(221 / 600 * 100vw);
height: calc(48 / 600 * 100vw);
margin-bottom: calc(18 / 600 * 100vw);
}
.pop-wechat-name {
font-size: calc(18 / 600 * 100vw);
margin-bottom: calc(36 / 600 * 100vw);
}
.pop-wechat-icon {
width: calc(22 / 600 * 100vw);
height: calc(22 / 600 * 100vw);
margin-right: calc(4 / 600 * 100vw);
}
.pop-wechat-icon1 {
width: calc(18 / 600 * 100vw);
height: calc(18 / 600 * 100vw);
margin-right: calc(4 / 600 * 100vw);
}
.pop-code-box {
padding: calc(20 / 600 * 100vw);
border-radius: calc(20 / 600 * 100vw);
-moz-box-shadow: 0 0 calc(15 / 600 * 100vw) rgba(0, 0, 0, 0.176470588235294);
-webkit-box-shadow: 0 0 calc(15 / 600 * 100vw) rgba(0, 0, 0, 0.176470588235294);
box-shadow: 0 0 calc(15 / 600 * 100vw) rgba(0, 0, 0, 0.176470588235294);
margin-bottom: calc(81 / 600 * 100vw);
}
.pop-code {
width: calc(240 / 600 * 100vw);
height: calc(240 / 600 * 100vw);
border-radius: calc(6 / 600 * 100vw);
margin-bottom: calc(20 / 600 * 100vw);
.pop-code-img {
width: calc(220 / 600 * 100vw);
height: calc(220 / 600 * 100vw);
}
}
.pop-text {
letter-spacing: calc(0.6 / 600 * 100vw);
font-size: calc(16 / 600 * 100vw);
line-height: calc(28 / 600 * 100vw);
}
// .pop-bottom1,
// .pop-bottom2 {
// width: calc(500 / 600 * 100vw);
// }
// .pop-bottom1 {
// height: calc(155 / 600 * 100vw);
// }
// .pop-bottom2 {
// height: calc(151 / 600 * 100vw);
// }
}
}
}

View File

@@ -227,10 +227,6 @@
margin: 0 10px 20px;
height: 40px !important;
}
#search-tag .classify {
margin-left: 10px;
margin-right: 10px;
}
#search-tag .matter .matter-content {
margin: 0;
}

View File

@@ -271,8 +271,8 @@
height: 40px !important;
}
.classify {
margin-left: 10px;
margin-right: 10px;
// margin-left: 10px;
// margin-right: 10px;
}
.matter {

View File

@@ -157,6 +157,9 @@
height: 24px;
margin-right: 8px;
}
#search .search-no {
padding-bottom: 30px;
}
#search .search-no .earth-icon {
width: 239px;
height: 180px;
@@ -278,13 +281,8 @@
@media screen and (max-width: 768px) {
#search .search-box {
width: auto !important;
margin: 0 10px 20px;
height: 40px !important;
}
#search .classify {
margin-left: 10px;
margin-right: 10px;
}
#search .matter .matter-content {
margin: 0;
}
@@ -361,5 +359,6 @@
@media screen and (max-width: 450px) {
#search .classify .item {
padding: 0 5px;
margin-right: 5px !important;
}
}

View File

@@ -199,6 +199,8 @@
}
.search-no {
padding-bottom: 30px;
.earth-icon {
width: 239px;
height: 180px;
@@ -343,12 +345,12 @@
#search {
.search-box {
width: auto !important;
margin: 0 10px 20px;
// margin: 0 10px 20px;
height: 40px !important;
}
.classify {
margin-left: 10px;
margin-right: 10px;
// margin-left: 10px;
// margin-right: 10px;
}
.matter {
@@ -436,5 +438,6 @@
@media screen and (max-width: 450px) {
#search .classify .item {
padding: 0 5px;
margin-right: 5px !important;
}
}

12
img/bottom1.svg Normal file
View File

@@ -0,0 +1,12 @@
<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="500px" height="151px" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient gradientUnits="userSpaceOnUse" x1="0" y1="151" x2="500" y2="0" id="LinearGradient693">
<stop id="Stop694" stop-color="#c6dd8f" offset="0" />
<stop id="Stop695" stop-color="#7991bc" offset="1" />
</linearGradient>
</defs>
<g transform="matrix(1 0 0 1 -738 -1121 )">
<path d="M 0 151 L 0 0 C 0 0 110.916965217331 54.7610464341339 252 54.578313253012 C 390.916397535917 54.3983863378389 500 0 500 0 L 500 151 L 0 151 Z " fill-rule="nonzero" fill="url(#LinearGradient693)" stroke="none" transform="matrix(1 0 0 1 738 1121 )" />
</g>
</svg>

6
img/bottom2.svg Normal file
View File

@@ -0,0 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="500px" height="155px" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(1 0 0 1 -738 -1117 )">
<path d="M 0 155 L 0 0 C 0 0 110.916965217331 43.139381024107 252 42.9518072289157 C 390.916397535917 42.7671140378439 500 0 500 0 L 500 155 L 0 155 Z " fill-rule="nonzero" fill="#fddf6d" stroke="none" transform="matrix(1 0 0 1 738 1117 )" />
</g>
</svg>

BIN
img/huddle-bj.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 192 KiB

BIN
img/wechat-name-icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 492 B

BIN
img/welcome-icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

759
index-v2.html Normal file
View File

@@ -0,0 +1,759 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>寄托天下_中立的出国留学申请和考试交流平台|留学资讯|DIY留学|留学经验|留学考试|海外生活 寄托天下出国留学网 -- 寄托天下</title>
<link rel="stylesheet" href="/css/public.css" />
<link rel="stylesheet" href="/css/index.css" />
<!-- <link rel="stylesheet" href="https://f.gter.net/css/index.css" /> -->
<meta name="description" content="提供最有用的出国留学资讯和最热心的留学交流论坛。在BBS上,你可以咨询签证, 面试, 机经, offer, 奖学金, 名校专业等, 也可以分享雅思、托福、GRE的学习心得。无论你留学在美国、加拿大、英国还是澳洲, 都能在留学论坛上找到寄托情感的归宿。">
<meta name="keywords" content="美国留学,加拿大留学,香港留学,新加坡留学,英国留学,欧洲留学, 留学经验分享,DIY留学,留学申请,留学流程,留学费用,出国留学,留学论坛, 留学网站,留学考试,GRE,TOEFL,IBT,GMAT,IELTS,SAT,VISA,文书,签证">
<meta name="author" content="">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:title" content="寄托天下_中立的出国留学申请和考试交流平台|留学资讯|DIY留学|留学经验|留学考试|海外生活 寄托天下出国留学网">
<meta property="og:description" content="提供最有用的出国留学资讯和最热心的留学交流论坛。在BBS上,你可以咨询签证, 面试, 机经, offer, 奖学金, 名校专业等, 也可以分享雅思、托福、GRE的学习心得。无论你留学在美国、加拿大、英国还是澳洲, 都能在留学论坛上找到寄托情感的归宿。">
<meta property="og:image" content="">
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:title" content="寄托天下_中立的出国留学申请和考试交流平台|留学资讯|DIY留学|留学经验|留学考试|海外生活 寄托天下出国留学网">
<meta property="twitter:description" content="提供最有用的出国留学资讯和最热心的留学交流论坛。在BBS上,你可以咨询签证, 面试, 机经, offer, 奖学金, 名校专业等, 也可以分享雅思、托福、GRE的学习心得。无论你留学在美国、加拿大、英国还是澳洲, 都能在留学论坛上找到寄托情感的归宿。">
<meta property="twitter:image" content="">
<!-- 网站图标 -->
<link rel="icon" href="https://www.gter.net/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="https://www.gter.net/favicon.ico" type="image/x-icon">
<style>
[v-cloak] {
display: none !important;
}
#pre-loader {
height: 70vh;
display: flex;
justify-content: center;
align-items: center;
}
#pre-loader .three-bounce>div {
display: inline-block;
width: 18px;
height: 18px;
border-radius: 100%;
top: 50%;
margin-top: -9px;
background: #aeadba;
animation: bouncedelay 1.4s infinite ease-in-out;
animation-fill-mode: both;
}
#pre-loader .three-bounce .one {
animation-delay: -0.32s;
}
#pre-loader .three-bounce .two {
animation-delay: -0.16s;
}
@keyframes bouncedelay {
0%,
100%,
80% {
transform: scale(0);
-webkit-transform: scale(0);
}
40% {
transform: scale(1);
-webkit-transform: scale(1);
}
}
</style>
<script type="text/javascript">
var STYLEID = '2',
STATICURL = 'static/',
IMGDIR = 'https://bbs.gter.net/template/archy_plt8/image',
VERHASH = 'Z62',
charset = 'gbk',
discuz_uid = '0',
cookiepre = '4B5x_c0ae_',
cookiedomain = 'gter.net',
cookiepath = '/',
showusercard = '1',
attackevasive = '0',
disallowfloat = '',
creditnotice = ',',
defaultstyle = '',
REPORTURL = 'aHR0cDovL2Jicy5ndGVyLm5ldC9mb3J1bS5waHA/dGlkPTI0MDYzNTYmZ290bz1sYXN0cG9zdA==',
SITEURL = 'https://app.gter.net/',
JSPATH = 'static/js/';
</script>
<script src="https://app.gter.net/bottom?tpl=header&menukey=bbs"></script>
<script src="https://framework.x-php.com/gter/bbs/static/js/common.js" charset="gbk"></script>
</head>
<body>
<script>
window.__ASSET_VERSION__ = 'Z69';
// 判断是否是移动端
window.isMobile = window.innerWidth <= 768;
</script>
<div id="ajaxwaitid"></div>
<div id="append_parent"></div>
<div class="head-top flexacenter" style="width: 1200px;margin: 20px auto 30px;">
<a href="/" class="flexacenter" target="_blank">
<img class="logo" src="https://oss.gter.net/logo" alt="" />
</a>
<div class="flex1"></div>
<div class="input-box flexacenter">
<div class="placeholder">
<div class="placeholder-box" style="transition: transform .3s ease"></div>
</div>
<input class="input flex1" type="text" maxlength="140" /> <img class="icon" onclick="searchEvent()" src="https://framework.x-php.com/gter/forum/img/search-icon.svg?v=euX4m9PrbyvP" />
<div class="search-box-history">
<div class="search-box-history-title">历史搜索</div>
<div class="search-box-history-list"></div>
</div>
</div>
<div class="post-list flexacenter"> </div>
<div class="sign-in sign-in-no flexacenter"></div>
<div class="head-more flexcenter" onclick="openHeadPop()">
<img class="more-icon" style="width: 18px;height: 15px;" src="https://framework.x-php.com/gter/forum/img/threeAcross.svg?v=euX4m9PrbyvP" />
</div>
<div class="head-pop" style="display: none;">
<div class="head-more-pop">
<div class="head-more-userinfo flex1 flexacenter">
<div class="head-more-left flexacenter"><img class="head-more-userinfo-avatar" src="" alt="">
<div class="head-more-userinfo-username"></div>
</div>
<div class="head-more-right">
<div class="loginBtn flexcenter" onclick="go_ajax_Login()">登录/注册</div>
</div>
</div>
<div class="tab-list"><a class="tab-item flexacenter" href="https://www.gter.net" target="_blank">寄托首页</a><a class="tab-item flexacenter pitch" href="https://f.gter.net" target="_blank">论坛</a><a class="tab-item flexacenter" href="https://app.gter.net/admissionOfficer" target="_blank">招生官</a><a class="tab-item flexacenter" href="https://bbs.gter.net/thread-2345065-1-1.html" target="_blank">加群</a><a class="tab-item flexacenter" href="https://offer.gter.net" target="_blank">Offer榜</a></div>
<a class="head-more-post flexcenter" href="/publish" target="" onclick="skipLoginUrl(event)">
<div class="head-more-post-icon flexcenter"><img class="head-more-post-img" src="https://framework.x-php.com/gter/forum/img/addyellow.svg?v=euX4m9PrbyvP" /></div>发布帖子
</a>
<img class="cross-icon" onclick="crossHeadPop()" src="https://framework.x-php.com/gter/forum/img/cross.svg?v=euX4m9PrbyvP">
</div>
</div>
</div>
<div class="valueA" style="display: none;">https://framework.x-php.com/gter/forum/</div>
<sign-in-box></sign-in-box>
<div class="container" id="appIndex">
<div class="header-content-box flexflex">
<div class="header-content-left">
<div class="adv-list flexacenter">
<div class="headerbanner adv-item"><a href="https://u.gter.net/Prvu9GvzXWWC" data-x-event="bbsAdv" data-x-event-id="778" target="_blank"><img src="https://o.x-php.com/bbs/common/cf/155629cw8ccbw6ipiycoio.gif" height="60" width="468" border="0"></a></div>
<div class="subnavbanner adv-item"><a href="/details/W0KqbeO5SHjG" target="_blank"><img src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c_JkvfHbqqsgFptxhXa6RWi26P-BuTQcSQLLBs9kb8LQ0NDI5" height="60" width="468" border="0"></a></div>
</div>
<!-- 话题和精选 -->
<div class="topic-and-selectives flexflex">
<div class="topic-box">
<div class="head-top flexcenter">
<img class="icon" src="https://framework.x-php.com/gter/forum/img/well-white.svg?v=euX4m9PrbyvP" />
<div class="text">话题</div>
</div>
<div class="topic-head flexflex">
<a class="title one-line-display vuehide" :href="'/details/' + ongoingbj.uniqid" target="_blank"></a>
<a class="title one-line-display" :href="'/details/' + ongoingbj.uniqid" target="_blank" v-cloak>{{ ongoingbj.title }}</a>
<a class="hint one-line-display" :href="'/details/' + ongoingbj.uniqid" target="_blank"></a>
<div class="people flexacenter">
<div class="left flexacenter">
<div class="number vuehide"></div>
<div class="number" v-cloak>{{ ongoingbj.comments }}</div>
<div class="text">人正在讨论</div>
</div>
<div class="right flexacenter">
<div class="item flexcenter" v-for="(item, index) in ongoingbj.commentUser" :key="index" :style="{zIndex: 7 - index }">
<img class="img" :src="item.avatar" />
</div>
</div>
</div>
</div>
<div class="topic-list">
<a class="item flexacenter" v-for="(item, index) in pastList" :key="index" :href="'/details/' + item.uniqid" target="_blank">
<img class="img" src="https://framework.x-php.com/gter/forum/img/well-yellow.svg?v=euX4m9PrbyvP" />
<div class="text one-line-display flex1" v-html="item.title"></div>
</a>
</div>
</div>
<div class="selectives-box">
<div class="head-top flexcenter">
<img class="icon" src="https://framework.x-php.com/gter/forum/img/handpick-icon.png?v=euX4m9PrbyvP" />
<div class="text">精选</div>
</div>
<div class="list flexflex">
<a class="item flexacenter" v-for="(item, index) in topicHandpickedList" :key="index" :href="'/details/' + item.uniqid" target="_blank">
<div class="dot"></div>
<div class="text one-line-display" v-html="item.title"></div>
</a>
</div>
</div>
</div>
<div class="header-left-bottom-box flexflex">
<a class="adv flexacenter" data-x-event="bbsindexslide" href="https://offer.gter.net/duckProphet" title="26Fall-offer鸭先知" target="_blank">
<img class="adv-icon" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c95MocHbqqsgFptxhT66SWgrlI64uMxcfWaHf9Z0F9N5dCHzZ5RLrizQ0Mjk~" alt="26Fall-offer鸭先知" />
</a>
<div class="list">
<div class="item flexacenter">
<div class="icon dot-gray"></div>
<a class="one-line-display text flex1" href="https://offer.gter.net/details/vnzyj8vjWzDK" target="_blank">香港科技大学 AI 太贵了</a>
</div>
<div class="item flexacenter">
<div class="icon dot-gray"></div>
<a class="one-line-display text flex1" href="https://offer.gter.net/details/juPvfSzvbOvv" target="_blank">鲁汶大学 有点离谱不想去</a>
</div>
<div class="item flexacenter">
<div class="icon dot-gray"></div>
<a class="one-line-display text flex1" href="https://offer.gter.net/details/5GLeOzuHjLnj" target="_blank">26Fall Offer 10 SSE Econ</a>
</div>
<div class="item flexacenter">
<div class="icon dot-gray"></div>
<a class="one-line-display text flex1" href="https://offer.gter.net/details/SzfGzTzTPWW4" target="_blank">香港理工大学 当保底了</a>
</div>
</div>
<div class="list list2">
<div class="item flexacenter">
<div class="icon dot-gray"></div>
<a class="one-line-display text flex1" href="https://offer.gter.net/details/KXCGLrGvbia4" target="_blank">26Fall-埃因霍温理工大学</a>
</div>
<div class="item flexacenter">
<div class="icon dot-gray"></div>
<a class="one-line-display text flex1" href="https://offer.gter.net/details/S18G9aHnDnPn" target="_blank">港城莞 cs MSc 没有吸引力</a>
</div>
<div class="item flexacenter">
<div class="icon dot-gray"></div>
<a class="one-line-display text flex1" href="https://interviewexperience.gter.net/details/SX4KfeGDeXCi" target="_blank">面经圣三一性别研究Mphil</a>
</div>
<div class="item flexacenter">
<div class="icon dot-gray"></div>
<a class="one-line-display text flex1" href="https://offer.gter.net/details/jey48WGfGfam" target="_blank">巴黎政治学院 传媒被拒</a>
</div>
</div>
</div>
</div>
<div class="header-content-right">
<div class="post-entrance">
<a class="entrance-top flexacenter" href="/publish" target="_blank" @click="handleCheckAttest"><img class="icon" src="./img/forum.png" />我要发帖</a>
<div class="entrance-bottom flexacenter">
<a class="item flexcenter" href="https://offer.gter.net/post" @click="handleCheckAttest" target="_blank">
<div class="icon-box">
<img class="icon" src="https://framework.x-php.com/gter/forum/img/offer-icon-V2.svg?v=euX4m9PrbyvP" />
</div>
<span class="text">报Offer</span>
</a>
<a class="item flexcenter" href="https://offer.gter.net/post/summary" @click="handleCheckAttest" target="_blank">
<div class="icon-box">
<img class="icon" src="https://framework.x-php.com/gter/forum/img/summary-icon-V2.svg?v=euX4m9PrbyvP" />
</div>
<span class="text">写总结</span>
</a>
<a class="item flexcenter" href="https://interviewexperience.gter.net/publish" @click="handleCheckAttest" target="_blank">
<div class="icon-box">
<img class="icon" src="https://framework.x-php.com/gter/forum/img/mj-icon-V2.svg?v=euX4m9PrbyvP" />
</div>
<span class="text">写面经</span>
</a>
<a class="item flexcenter" href="https://vote.gter.net/publish" @click="handleCheckAttest" target="_blank">
<div class="icon-box">
<img class="icon" src="https://framework.x-php.com/gter/forum/img/vote-icon-V2.svg?v=euX4m9PrbyvP" />
</div>
<span class="text">发起投票</span>
</a>
</div>
</div>
<div class="custom_2 adv" ref="custom_2AdvRef"><a href="https://u.gter.net/8i8KfWGvTKXu" data-x-event="bbsAdv" data-x-event-id="777" target="_blank"><img src="https://o.x-php.com/bbs/common/cf/152158dpf5eh7pqpaealiq.gif" border="0"></a></div>
<div class="group-box">
<div class="group flexflex">
<div class="group-item flexcenter">
<div class="title">26FALL</div>
<div class="subtitle">申请群</div>
<div class="QRcode-box flexcenter">
<img class="QRcode" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5kpcnzqqsgFptxhcq_cQnrlJKN1WgxCBq_D-81qNDQyOQ~~" />
<div class="text">微信扫码</div>
</div>
</div>
<div class="group-item flexcenter">
<div class="title">申请求助</div>
<div class="subtitle">寄托院校君</div>
<div class="QRcode-box flexcenter">
<img class="QRcode" src="https://u.gter.net/assistantwxqrcode.png" />
<div class="text">微信扫码</div>
</div>
</div>
<div class="group-item flexcenter">
<div class="title">香港租房</div>
<div class="subtitle">交流群</div>
<div class="QRcode-box flexcenter">
<img class="QRcode" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5kpcnzqqsgFptxhcq_cQnrlJKN1WgxCBq_D-81qNDQyOQ~~" />
<div class="text">微信扫码</div>
</div>
</div>
<div class="group-item flexcenter">
<div class="title">香港租房顾问</div>
<div class="subtitle">寄托方同学</div>
<div class="QRcode-box flexcenter">
<img class="QRcode" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-d_JkpcHnqqsgFptxhcq_cQnrlcaF2WQQQBq_D-81qNDQyOQ~~" />
<div class="text">微信扫码</div>
</div>
</div>
</div>
</div>
<div class="offer-box" :class="{'big': !custom_2AdvRef}" id="offer-box" @mouseover="offerMouseover" @mouseout="offerMouseout">
<div class="offer-list" id="offer-list" ref="offerListRef" :style="{'margin-top': -offerMargin + 'px'}">
<a class="item flexflex" :href="item['url']" target="_blank" v-for="(item, index) in offerlist" :key="index">
<div class="avatar" :style="{backgroundImage: `url(${item.user['avatar']})`}"></div>
<div class="">
<div class="condition one-line-display" v-cloak style="height: 17px;">{{ item["date"] }} {{ item['type_label'] }}</div>
<div class="titletitle one-line-display" v-cloak style="height: 20px;">{{ item["content"] }}</div>
</div>
</a>
</div>
</div>
</div>
</div>
<div class="admission">
<a class="admission-header flexflex" target="_blank" href="https://admissionofficer.gter.net">
<img class="admission-header-icon" src="/img/admission-officer-icon.png">
<div class="admission-header-name flexflex">Hello Admission Officer</div>
</a>
<div class="admission-list flexflex">
<div class="admission-item flexcenter">
<a class="admission-img" href="https://u.gter.net/ad/1054?x=gter" target="_blank">
<img src="https://o.x-php.com/Zvt57TuJSUvkyhw-xGnSskf57MJoMT_Fsq9DwMI1EuyMED63bKEtAmkLfvWH4sxjtaM9biierFaq-w1X0BACzthmrBDmRe4Za8WJtUoB4WZMfMOnffaaFYU6LcOVh-3zu1apgN799koldhb0KGuHSNK1gJ0jRkHZYxm738yXgyT4Vl89GL1RT3rg1FpDYM8rZRNGWplgpDF9NDQyOQ~~" alt="中大政务" />
</a>
</div>
<div class="admission-item flexcenter">
<a class="admission-img" href="https://u.gter.net/ad/1075?x=gter" target="_blank">
<img src="https://o.x-php.com/Zvt57TuJSUvkyhw-xGnSskf57MJoMT_Fsq9DwMI1EuyMED63bKEtAmkLfvWH4sxjtaM9biierFaq-w1X0BACzthmrBD6ROsZI8qJtUoB4WZMfMOnffaaFYU6LcOVh-3zu1apgN799koiZEDCIHCCWNK1gJ0jRkHZYxm738yXgyT4Vl89GL1RT3rg1FpDYM8kNhZMU5hgpDF9NDQyOQ~~" alt="教大个人理财" />
</a>
</div>
<div class="admission-item flexcenter">
<a class="admission-img" href="https://u.gter.net/ad/964?x=gter" target="_blank">
<img src="https://o.x-php.com/Zvt57TuJSUvkyhw-xGnSskf57MJoMT_Fsq9DwMI1EuyMED63bKEtAmkLfvWH4sxjtaM9biierFaq-w1X0BACzthmrBDmQusvPM6JtUoB4WZMfMOnffaaFYU6LcOVh-3zu1apgN799koiZlTjaFqedZu1gJ0jRkHZYxm738yXgyT4Vl89GL1RT3rg1FpDYM95MxVKUMBgpDF9NDQyOQ~~" alt="香港中文大学经济学" />
</a>
</div>
<div class="admission-item flexcenter">
<a class="admission-img" href="https://u.gter.net/ad/1070?x=gter" target="_blank">
<img src="https://o.x-php.com/Zvt57TuJSUvkyhw-xGnSskf57MJoMT_Fsq9DwMI1EuyMED63bKEtAmkLfvWH4sxjtaM9biierFaq-w1X0BACzthmrBD6Rewvf8KJtUoB4WZMfMOnffaaFYU6LcOVh-3zu1apgN799koldlTJLVmFEJe1gJ0jRkHZYxm738yXgyT4Vl89GL1RT3rg1FpDYM8sZhAbV8NgpDF9NDQyOQ~~" alt="理工会计金融" />
</a>
</div>
<div class="admission-item flexcenter">
<a class="admission-img" href="https://u.gter.net/ad/1072?x=gter" target="_blank">
<img src="https://o.x-php.com/Zvt57TuJSUvkyhw-xGnSskf57MJoMT_Fsq9DwMI1EuyMED63bKEtAmkLfvWH4sxjtaM9biierFaq-w1X0BACzthmrBDmXewvON2JtUoB4WZMfMOnffaaFYU6LcOVh-3zu1apgN799kolcBbJd3CFdr61gJ0jRkHZYxm738yXgyT4Vl89GL1RT3rg1FpDYM9-NkNKUJRgpDF9NDQyOQ~~" alt="港大工程学院" />
</a>
</div>
<div class="admission-item flexcenter">
<a class="admission-img" href="https://u.gter.net/ad/1071?x=gter" target="_blank">
<img src="https://o.x-php.com/Zvt57TuJSUvkyhw-xGnSskf57MJoMT_Fsq9DwMI1EuyMED63bKEtAmkLfvWH4sxjtaM9biierFaq-w1X0BACzthmrBD6Rewvb8mJtUoB4WZMfMOnffaaFYU6LcOVh-3zu1apgN799kolcRbCb3aCEJO1gJ0jRkHZYxm738yXgyT4Vl89GL1RT3rg1FpDYM8lZhUcApNgpDF9NDQyOQ~~" alt="港教大心理学" />
</a>
</div>
<div class="admission-item flexcenter">
<a class="admission-img" href="https://u.gter.net/ad/1009?x=gter" target="_blank">
<img src="https://o.x-php.com/Zvt57TuJSUvkyhw-xGnSskf57MJoMT_Fsq9DwMI1EuyMED63bKEtAmkLfvWH4sxjtaM9biierFaq-w1X0BACzthmrBD6ROwZPMmJtUoB4WZMfMOnffaaFYU6LcOVh-3zu1apgN799kolcUHjb3eCEL61gJ0jRkHZYxm738yXgyT4Vl89GL1RT3rg1FpDYM9-MxZLVZhgpDF9NDQyOQ~~" alt="港大教育" />
</a>
</div>
<div class="admission-item flexcenter">
<a class="admission-img" href="https://u.gter.net/ad/981?x=gter" target="_blank">
<img src="https://o.x-php.com/Zvt57TuJSUvkyhw-xGnSskf57MJoMT_Fsq9DwMI1EuyMED63bKEtAmkLfvWH4sxjtaM9biierFaq-w1X0BACzthmrBD6Rewvf92JtUoB4WZMfMOnffaaFYU6LcOVh-3zu1apgN799koiZhaUaGKRT4-1gJ0jRkHZYxm738yXgyT4Vl89GL1RT3rg1FpDYM8qNRIbBsVgpDF9NDQyOQ~~" alt="理工商业管理" />
</a>
</div>
</div>
</div>
<div class="pop-list">
<div class="list">
<div class="item" v-for="item in popList" @click="openPop(item.type)">
<div class="top">{{ item.title }}</div>
<div class="bottom">{{ item.subtitle }}</div>
</div>
</div>
</div>
<div class="matter flexflex" ref="matterRef">
<div class="matter-content flex1">
<!-- 论坛板块列表 -->
<div class="forum-sections-list">
<img class="img" src="https://framework.x-php.com/gter/forum/img/sections-left.svg?v=euX4m9PrbyvP" />
<div class="title">论坛版块</div>
<div class="list">
<template v-for="(item, index) in sectionList" :key="index">
<div class="line flexacenter">
<a class="item flexacenter" v-for="(item, index) in item" :key="index" target="_blank" :href="`/section/${item.uniqid}`">{{ item.name }}</a>
</div>
</template>
</div>
</div>
<!-- <item-forum :itemdata="item" v-for="(item, index) in list" :key="index"></item-forum> -->
<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-project v-else-if="item.type == 'programs' || tabValue == 'xg'" :itemdata="item"></item-project>
<item-forum v-else :itemdata="item"></item-forum>
</template>
<load-box :loading="loading"></load-box>
</div>
<div class="sidebar" ref="sidebarRef" :style="{'top': sidebarHeight + 'px'}">
<div class="custom_1 ad-item"><a href="https://u.gter.net/by1aWW1iKSrf" data-x-event="bbsAdv" data-x-event-id="779" target="_blank"><img src="https://o.x-php.com/bbs/common/cf/1600395jzy35vvv75fy6oo.jpg" height="220" width="291" border="0"></a></div> <!-- offer -->
<div class="offer-side-box side-box" v-if="offer.length != 0">
<div class="side-header flexacenter">
<div class="left flexacenter">
<img class="header-icon" src="https://framework.x-php.com/gter/forum/img/offer-index-icon.png?v=euX4m9PrbyvP" />
<div class="title">Offer</div>
</div>
<a class="more flexacenter" href="https://offer.gter.net" target="_blank">
<span>more</span>
<img class="more-icon" src="https://framework.x-php.com/gter/forum/img/right-arrow-black.svg?v=euX4m9PrbyvP" />
</a>
</div>
<div class="box">
<a class="item flexflex" v-cloak v-for="item in offer" :key="item" :href="'/details/' + item['uniqid']" target="_blank">
<img class="school-img" :src="item.data['schoollogo']" />
<div class="school-detail flex1 flexflex">
<div class="school-name one-line-display vuehide"></div>
<div v-cloak class="school-name one-line-display">{{ item.data['schoolname'] }}</div>
<div class="school-brief one-line-display">{{ item.data['professional'] }}</div>
<div class="school-offer flexacenter">
<span>{{ item.data['degree'] }}</span>
<span class="long-string">|</span>
<span>{{ item.data['semester'] }}</span>
<span class="long-string">|</span>
<span>{{ item.data['apply_results_text'] }}</span>
</div>
</div>
</a>
<a class="add-btn flexcenter" @click="handleCheckAttest" style="position: relative" href="https://offer.gter.net/post" target="_blank" v-cloak>
<img class="add-icon" src="https://framework.x-php.com/gter/forum/img/add-btn-black.svg?v=euX4m9PrbyvP" />
<div>报Offer</div>
<div v-if="realname == 0 && userInfo.uin > 0" class="open-attest-btn" @click.prevent="openAttest"></div>
</a>
</div>
</div>
<!-- vote -->
<div class="vote-side-box side-box" v-if="vote.length != 0">
<div class="side-header flexacenter">
<div class="left flexacenter">
<img class="header-icon" src="https://framework.x-php.com/gter/forum/img/vote-index-icon.png?v=euX4m9PrbyvP" />
<div class="title">投票</div>
</div>
<a class="more flexacenter" target="_blank" href="https://vote.gter.net">
<span>more</span>
<img class="more-icon" src="https://framework.x-php.com/gter/forum/img/right-arrow-black.svg?v=euX4m9PrbyvP" />
</a>
</div>
<div class="box">
<a class="item flexflex" v-cloak v-for="item in vote" :key="item" target="_blank" :href="'/details/' + item['uniqid']">
<div class="name one-line-display">{{item['title']}}</div>
<div class="brief">{{ item['content'] }}</div>
</a>
<a class="add-btn flexcenter" @click="handleCheckAttest" style="position: relative" v-cloak target="_blank" href="https://vote.gter.net/publish">
<img class="add-icon" src="https://framework.x-php.com/gter/forum/img/add-btn-black.svg?v=euX4m9PrbyvP" />
<div>发起投票</div>
<div v-if="realname == 0 && userInfo.uin > 0" class="open-attest-btn" @click.prevent="openAttest"></div>
</a>
</div>
</div>
<!-- mj -->
<div class="interviewexperience-side-box side-box" v-if="interviewexperience.length != 0">
<div class="side-header flexacenter">
<div class="left flexacenter">
<img class="header-icon" src="https://framework.x-php.com/gter/forum/img/mj-index-icon.png?v=euX4m9PrbyvP" />
<div class="title">面经</div>
</div>
<a class="more flexacenter" href="https://interviewexperience.gter.net/" target="_blank">
<span>more</span>
<img class="more-icon" src="https://framework.x-php.com/gter/forum/img/right-arrow-black.svg?v=euX4m9PrbyvP" />
</a>
</div>
<div class="box">
<a class="item flexflex" v-cloak v-for="(item,index) in interviewexperience" :key="item" :href="'/details/' + item['uniqid']" target="_blank">
<div class="school one-line-display">{{ item.data['schoolname'] }}</div>
<div class="major one-line-display">{{ item.data['profession'] || item.data['project'] }}</div>
<div class="info">
<img class="icon" :src="item.user['avatar']" />
<span class="text">{{ item['content'] }}</span>
</div>
</a>
<a class="add-btn flexcenter" @click="handleCheckAttest" style="position: relative" href="https://interviewexperience.gter.net/publish" target="_blank" v-cloak>
<img class="add-icon" src="https://framework.x-php.com/gter/forum/img/add-btn-black.svg?v=euX4m9PrbyvP" />
<div>写面经</div>
<div v-if="realname == 0 && userInfo.uin > 0" class="open-attest-btn" @click.prevent="openAttest"></div>
</a>
</div>
</div>
<!-- newest 最新 -->
<latest-list boxtype="newest"></latest-list>
<latest-list boxtype="essence"></latest-list>
</div>
</div>
<huddle-box ref="huddleBoxRef"></huddle-box>
<helper-pop ref="helperPopRef"></helper-pop>
<group-pop ref="groupPopRef"></group-pop>
<qr-code-pop ref="qrCodePopRef"></qr-code-pop>
</div>
<script src="https://framework.x-php.com/gter/forum/js/vue.global.js?v=euX4m9PrbyvP"></script>
<script src="https://framework.x-php.com/gter/forum/js/axios.min.js?v=euX4m9PrbyvP"></script>
<script src="https://framework.x-php.com/gter/forum/js/public.js?v=euX4m9PrbyvP"></script>
<script src="https://framework.x-php.com/gter/forum/js/scrolltext.js?v=euX4m9PrbyvP"></script>
<script type="module" src="/js/index.js"></script>
<script type="module" src="https://framework.x-php.com/gter/forum/../image/gter/commonCom/sign-in/sign-in.js?v=euX4m9PrbyvP"></script>
<script src="https://app.gter.net/bottom?tpl=footer,popupnotification"></script>
<script>
if (location.href.indexOf('details') != -1) {
const postList = document.querySelector('.head-top .post-list')
postList.innerHTML = `<a href="/publish" target="_blank" style="margin-right: 10px"> <img class="post-item" src="https://framework.x-php.com/gter/forum/img/post-thread.png?v=euX4m9PrbyvP" /> </a> <a href="https://offer.gter.net/post" target="_blank" style="margin-right: 10px"> <img class="post-item" src="https://framework.x-php.com/gter/forum/img/post-offer.png?v=euX4m9PrbyvP" /> </a> <a href="https://offer.gter.net/post/summary" target="_blank" style="margin-right: 10px"> <img class="post-item" src="https://framework.x-php.com/gter/forum/img/post-summary.png?v=euX4m9PrbyvP" /> </a> <a href="https://interviewexperience.gter.net/publish" target="_blank" style="margin-right: 10px"> <img class="post-item" src="https://framework.x-php.com/gter/forum/img/post-mj.png?v=euX4m9PrbyvP" /> </a> <a href="https://vote.gter.net/publish" target="_blank"> <img class="post-item" src="https://framework.x-php.com/gter/forum/img/post-vote.png?v=euX4m9PrbyvP" /> </a>`
postList.style.display = 'flex'
} else if (location.href.indexOf('search') != -1) {
const box = document.querySelector(".head-top")
box.querySelector(".input-box").style.display = "none"
box.querySelector(".sign-in").style.display = "none"
} else if (location.href.indexOf("publish") != -1) {
const box = document.querySelector(".head-top")
if (box) document.body.removeChild(box)
} else {
const signIn = document.querySelector('.head-top .sign-in')
console.log('signIn', signIn);
signIn.innerHTML = `<div class="sign-in-no-box" onclick="headSignIn()">
<img class="sign-in-bj" src="https://framework.x-php.com/gter/forum/img/sign-in-bj.svg?v=euX4m9PrbyvP" /><img class="coin-bj" src="https://framework.x-php.com/gter/forum/img/coin-bj.svg?v=euX4m9PrbyvP" />
<img class="coin-icon" src="https://framework.x-php.com/gter/forum/img/coin-icon.png?v=euX4m9PrbyvP" /><span class="text flex1">签到领寄托币</span>
<div class="sign-go flexcenter">
<img class="sign-go-bj" src="https://framework.x-php.com/gter/forum/img/sign-go.svg?v=euX4m9PrbyvP" /> GO
</div>
<img class="petal1" src="https://framework.x-php.com/gter/forum/img/petal1.png?v=euX4m9PrbyvP" />
<img class="petal2" src="https://framework.x-php.com/gter/forum/img/petal2.png?v=euX4m9PrbyvP" />
<img class="petal3" src="https://framework.x-php.com/gter/forum/img/petal3.png?v=euX4m9PrbyvP" />
</div>
<div class="sign-in-already-box">
<img class="sign-icon" src="https://framework.x-php.com/gter/forum/img/sign-icon.png?v=euX4m9PrbyvP" />
<span>已签到,明天再来</span>
</div>`
signIn.style.display = 'flex'
let userInfoWinTimerCount = 0;
const userInfoWinTimer = setInterval(() => {
if (location.host == "127.0.0.1:5501") return;
if (todaysignedState) {
clearInterval(userInfoWinTimer);
if (todaysigned == 1) {
signIn.classList.add('sign-in-already')
signIn.classList.remove("sign-in-no");
}
}
userInfoWinTimerCount++;
if (userInfoWinTimerCount >= 3000) clearInterval(userInfoWinTimer);
}, 50);
}
function headSignIn() {
SignInComponent.initComponent();
}
const searchInput = document.querySelector('.head-top .input')
// 绑定 blur 和 focus 事件
if (searchInput) {
searchInput.addEventListener('blur', function () {
setTimeout(() => {
const historyBox = document.querySelector('.head-top .search-box-history')
if (historyBox) historyBox.style.display = 'none'
}, 300);
const inputBox = document.querySelector('.head-top .input-box')
if (inputBox) inputBox.classList.remove('pitch')
startCarousel();
})
searchInput.addEventListener('focus', () => {
const historyBox = document.querySelector('.head-top .search-box-history')
const historyItem = historyBox.querySelectorAll(".search-box-history-item")
if (historyBox && historyItem.length > 0) historyBox.style.display = 'block'
const inputBox = document.querySelector('.head-top .input-box')
if (inputBox) inputBox.classList.add('pitch')
if (carouselTimer) clearInterval(carouselTimer);
})
// 绑定回车事件
searchInput.addEventListener('keydown', (e) => {
if (e.key == 'Enter') searchEvent()
})
searchInput.addEventListener('input', (e) => {
const value = e.target.value || ''
const placeholder = document.querySelector(".head-top .placeholder")
if (value) placeholder.style.display = 'none'
else placeholder.style.display = 'block'
})
}
let historySearchList = []
// 获取历史搜索
const getHistorySearch = () => {
const data = JSON.parse(localStorage.getItem("history-search")) || [];
historySearchList = data;
let itemAll = ``
data.forEach((item, index) => itemAll += `<div class="search-box-history-item one-line-display" onclick="searchEvent('${item}')">${item}</div>`) // 绑定事件 searchEvent 点击搜索)
const historyList = document.querySelector('.search-box-history-list')
historyList.innerHTML = itemAll
};
if (location.href.indexOf("/publish") == -1 && location.href.indexOf("/search") == -1) getHistorySearch();
const searchEvent = (value) => {
if (window.innerWidth <= 480) {
redirectToExternalWebsite("/search");
return
}
const kw = value || searchInput.value || hotSearchWords[currentIndex]?.keyword || "";;
if (!kw) return;
historySearchList.unshift(kw);
historySearchList = [...new Set(historySearchList)];
if (historySearchList.length > 10) historySearchList = historySearchList.splice(0, 10);
localStorage.setItem("history-search", JSON.stringify(historySearchList));
redirectToExternalWebsite("/search/" + kw);
searchInput.value = ""
}
let hotSearchWords = [];
const renderingPlaceholder = () => {
let itemAll = ``
hotSearchWords.forEach(item => {
itemAll += `<div class="item one-line-display" >大家都在搜:${item.keyword}</div>`
})
const sliceHotSearchWords = hotSearchWords.slice(0, 2)
sliceHotSearchWords.forEach(item => {
itemAll += `<div class="item one-line-display" >大家都在搜:${item.keyword}</div>`
})
const placeholderBox = document.querySelector('.placeholder .placeholder-box')
placeholderBox.innerHTML = itemAll
}
const getWConfigg = () => {
ajaxGet("/v2/api/config/website").then((res) => {
if (res.code == 200) {
let data = res["data"] || {};
hotSearchWords = data.hotSearchWords || [];
renderingPlaceholder()
data.time = new Date().toISOString();
localStorage.setItem("wConfig", JSON.stringify(data));
}
});
};
const checkWConfig = () => {
const wConfig = JSON.parse(localStorage.getItem("wConfig")) || {};
if (wConfig.time) {
const time = new Date(wConfig.time);
const now = new Date();
if (now - time > 24 * 60 * 60 * 1000) getWConfigg();
else {
hotSearchWords = wConfig.hotSearchWords || [];
renderingPlaceholder()
}
} else getWConfigg();
};
checkWConfig()
const renderCurrentIndex = () => {
const placeholderBox = document.querySelector('.placeholder .placeholder-box')
if (placeholderBox) placeholderBox.style.transform = `translateY(${-currentIndex * 36}px)`
}
let currentIndex = 0; // 当前显示的关键词索引
let carouselTimer = null; // 轮播定时器
// 启动轮播函数
const startCarousel = () => {
// 清除已有的定时器
if (carouselTimer) clearInterval(carouselTimer);
// 设置新的定时器,每秒滚动一次
carouselTimer = setInterval(() => {
if (hotSearchWords.length > 1) {
if (currentIndex >= hotSearchWords.length - 1) {
currentIndex++;
setTimeout(() => {
currentIndex = 0;
}, 2300);
} else currentIndex++;
}
renderCurrentIndex()
}, 2300);
};
startCarousel();
const openHeadPop = () => {
if (window["userInfoWin"]?.uin > 0 || window["userInfoWin"]?.uid > 0) {
// 登录
const headMoreLeft = document.querySelector(".head-pop .head-more-left")
headMoreLeft.innerHTML = `<img class="head-more-userinfo-avatar" src="${window["userInfoWin"]?.avatar}" alt=""><div class="head-more-userinfo-username">${window["userInfoWin"]?.nickname}</div>`
} else {
const avatar = document.querySelector(".head-pop .head-more-userinfo-avatar")
avatar.src = "/img/defaultAvatar.png"
const headMoreRight = document.querySelector(".head-pop .head-more-right")
headMoreRight.style.display = "block"
}
document.querySelector(".head-pop").classList.add("head-pop-show");
}
const skipLoginUrl = (e) => {
if (window["userInfoWin"]?.uin > 0 || window["userInfoWin"]?.uid > 0) { }
else {
e.preventDefault();
go_ajax_Login();
}
}
const crossHeadPop = () => document.querySelector(".head-pop").classList.remove("head-pop-show");
</script>
</body>
</html>

View File

@@ -1,5 +1,6 @@
const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provide } = Vue;
const { createApp, ref, onMounted, nextTick, onUnmounted, computed, watch, provide, defineAsyncComponent } = Vue;
(async function () {
const { itemForum } = await import(withVer("../component/item-forum/item-forum.js"));
const { itemOffer } = await import(withVer("../component/item-offer/item-offer.js"));
const { itemSummary } = await import(withVer("../component/item-summary/item-summary.js"));
@@ -11,6 +12,14 @@ const { loadBox } = await import(withVer("../component/load-box/load-box.js"));
const { itemProject } = await import(withVer("../component/item-project/item-project.js"));
const { latestList } = await import(withVer("../component/latest-list/latest-list.js"));
let huddleBox, helperPop, groupPop, QRCodePop;
if (window.isMobile) {
({ huddleBox } = await import(withVer("../component/huddle-box/huddle-box.js")));
({ helperPop } = await import(withVer("../component/helper-pop/helper-pop.js")));
({ groupPop } = await import(withVer("../component/group-pop/group-pop.js")));
({ QRCodePop } = await import(withVer("../component/QR-code-pop/QR-code-pop.js")));
}
const appIndex = createApp({
setup() {
onMounted(() => {
@@ -95,6 +104,7 @@ const appIndex = createApp({
};
ongoingbj.value = getTargetItem(ongoing || []) || {};
console.log("ongoingbj", ongoingbj.value);
const past = data.past || [];
pastList.value = past.sort(() => Math.random() - 0.5).slice(0, 5);
});
@@ -267,11 +277,41 @@ const appIndex = createApp({
}
};
onMounted(() => {
SignInComponent.initComponent()
})
const popList = ref([
{
title: "26FALL",
subtitle: "申请群",
type: "cong",
},
{
title: "申请求助",
subtitle: "寄托院校君",
type: "university",
},
{
title: "香港租房",
subtitle: "交流群",
type: "renting",
},
{
title: "香港租房顾问",
subtitle: "寄托方同学",
type: "fang",
},
]);
return { handleCheckAttest, sidebarHeight, matterRef, sidebarFixed, sidebarRef, loading, interviewexperience, vote, offer, topicHandpickedList, list, sectionList, custom_2AdvRef, ongoingbj, pastList, offerMouseover, offerMouseout, offerlist, offerListRef };
let huddleBoxRef = ref(null);
let helperPopRef = ref(null);
let groupPopRef = ref(null);
let qrCodePopRef = ref(null);
const openPop = (type) => {
if (type == "cong") huddleBoxRef.value.open();
if (type == "university") helperPopRef.value.open();
if (type == "renting") groupPopRef.value.open();
if (type == "fang") qrCodePopRef.value.open();
};
return { openPop, huddleBoxRef, helperPopRef, groupPopRef, qrCodePopRef, popList, handleCheckAttest, sidebarHeight, matterRef, sidebarFixed, sidebarRef, loading, interviewexperience, vote, offer, topicHandpickedList, list, sectionList, custom_2AdvRef, ongoingbj, pastList, offerMouseover, offerMouseout, offerlist, offerListRef };
},
});
@@ -285,5 +325,10 @@ appIndex.component("itemTenement", itemTenement);
appIndex.component("itemProject", itemProject);
appIndex.component("latestList", latestList);
appIndex.component("load-box", loadBox);
if (huddleBox) appIndex.component("huddle-box", huddleBox);
if (helperPop) appIndex.component("helper-pop", helperPop);
if (groupPop) appIndex.component("group-pop", groupPop);
if (QRCodePop) appIndex.component("qr-code-pop", QRCodePop);
appIndex.mount("#appIndex");
})();

View File

@@ -44,6 +44,8 @@ const watchList = {
"../component/huddle-box/huddle-box.txt": "../component/huddle-box/huddle-box.js",
"../component/helper-pop/helper-pop.txt": "../component/helper-pop/helper-pop.js",
"../component/group-pop/group-pop.txt": "../component/group-pop/group-pop.js",
"../component/QR-code-pop/QR-code-pop.txt": "../component/QR-code-pop/QR-code-pop.js",
// 可添加更多文件(格式:'txt路径': 'js路径'
// './component/other/other.txt': './component/other/other.js',