Files
PC-Light-Forum/section-index.html
DESKTOP-RQ919RC\Pc 6bb48ff86d refactor(component): 重构组件模板与样式结构
将公共样式提取至public.css,优化组件模板结构
添加图片资源与组件模板同步脚本
调整组件样式与布局,统一风格
2025-10-22 18:31:16 +08:00

211 lines
12 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<link rel="stylesheet" href="./css/public.css" />
<link rel="stylesheet" href="./css/sectionIndex.css" />
<script src="./js/vue.global.js"></script>
</head>
<body>
<div class="container" id="sectionIndex">
<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="head-navigation flexacenter">
<img class="icon" src="./img/index-icon.png" />
<div class="text">首页</div>
<img class="arrows" src="./img/arrows-gray.svg" />
<div class="text">首页</div>
</div>
<div class="matter flexflex">
<div class="sidebar">
<div class="title">论坛版块</div>
<div class="list">
<div v-for="item in 8" :key="item" class="item flexacenter" :class="{'pitch' : item == 1}">
<span class="text">香港</span>
</div>
</div>
<div class="list">
<div v-for="item in 5" :key="item" class="item flexacenter" :class="{'pitch' : item == 1}">
<span class="text">香港</span>
</div>
</div>
<div class="list">
<div v-for="item in 5" :key="item" class="item flexacenter" :class="{'pitch' : item == 1}">
<span class="text">香港</span>
</div>
</div>
<div class="list">
<div v-for="item in 3" :key="item" class="item flexacenter" :class="{'pitch' : item == 1}">
<span class="text">香港</span>
</div>
</div>
</div>
<div class="matter-content flex1">
<div class="info flexflex">
<img class="img"
src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG_Y2l-U_pood3-H1NFX9ddrB_WbUGy8P79gQxdBFebGtpgV7NkzNDQyOQ~~" />
<div class="right flex1">
<div class="title">香港留学</div>
<div class="link flexacenter">
<div class="item flexacenter" v-for="item in 4" :key="item">
<div class="text">申港超强资料包</div>
<img class="icon" src="./img/arrows-circle-red.svg" />
</div>
</div>
<div class="bottom flexacenter">
<div class="data flexacenter">
<div class="sum">124,098</div>
个帖子
</div>
<div class="btn flexcenter">
<img class="icon" src="./img/pen-icon.png" />
<div class="text">发帖</div>
</div>
</div>
</div>
</div>
<div class="details-box flexflex">
<div class="content-box flex1">
<div class="selectives-box">
<div class="head-top flexcenter">
<img class="icon" src="https://app.gter.net/image/miniApp/offer/handpick-icon.png" />
<div class="text">精选</div>
</div>
<div class="list flexflex">
<div class="item flexacenter" v-for="(item, index) in 16" :key="index">
<div class="dot"></div>
<div class="text one-line-display">美国各院校申请时间汇总(一)美国各院校申请时间汇总(一)美国各院校申请时间汇总(一)</div>
</div>
</div>
</div>
<div class="red-tag">
<div class="title">热门标签
<img class="icon" src="./img/triangle-red.svg" />
</div>
<div class="list">
<div class="item flexacenter" v-for="(item, index) in 10" :key="index">热门标签</div>
</div>
</div>
<div class="list-box">
<div class="item-box item-forum" v-for="(item, index) in 10" :key="index">
<div class="item-head flexacenter">
<img class="avatar"
src="https://nas.gter.net:9008/avatar/97K4EWIMLrsbGTWXslC1UltTF6WOikN42jDKLNjtax7Hc44zLpaKSdU9oWFhY2E~/small" />
<div class="name">小P学姐</div>
<img class="group"
src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c_ZMtdXfqqsgFptxhcq_cQnrlcPJ0DVESBq_D-81qNDQyOQ~~" />
<div class="time">2025-8-11 01:30</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">3016</div>
</div>
<div class="btn flexcenter" @click="cutShow">
<img class="icon"
src="https://app.gter.net/image/miniApp/offer/dot-dot-dot-gray.png" />
</div>
<!-- <template v-if="show">
<div class="mask" catch:tap="cutShow" catch:touchmove="touchmove"></div>
<div class="operate" catch:tap="true">
<div class="item" bind:tap="report">举报</div>
<template v-if="ismanager">
<div class="item" bind:tap="hide">{{ item.hidden == 0 ? '隐藏' : '显示' }}</div>
<div class="item" bind:tap="recommend">{{ item.recommend == 1 ? '取消' : '' }}推荐</div>
<div class="item" bind:tap="essence">{{ item.best == 1 ? '取消' : '' }}精华</div>
</template>
</div>
</template> -->
</div>
<div class="label flexflex">
<img class="item icon" src="./img/recommend-icon.png" />
<img class="item icon" src="./img/essence-icon.png" />
<div class="item blue">香港</div>
<div class="item">香港</div>
</div>
<div class="title">【干货】香港留学费用准备</div>
<div class="message">
在即将赴港的时候很多同学好奇香港一年制硕士下来的整体费用大概是多少其实主要包括学费租房费和生活费三部分。学费的话根据不同香港来定大概在10-30万港币之间比较固定…
</div>
<div class="comment flexacenter">
<img class="icon"
src="https://nas.gter.net:9008/avatar/97K4EWIMLrsbGTWXslC1UltTF6WOikN42jDKLNjtax7Hc44zLpaKSdU9oWFhY2E~/small" />
<div class="text one-line-display">
在即将赴港的时候很多同学好奇香港一年制硕士下来的整体费用大概是多少其实主要包括学费租房费和生活费三部分。学费的话根据不同香港来定大概在10-30万港币之间比较固定…
</div>
</div>
<div class="bottom flexacenter">
<div class="bottom-item like flexacenter">
<img class="icon" src="./img/like-icon.png" />
<div class="text">3016</div>
</div>
<div class="bottom-item like flexacenter">
<img class="icon" src="./img/collect-golden.svg" />
<div class="text">3016</div>
</div>
<div class="bottom-item like flexacenter">
<img class="icon" src="./img/discuss-icon.png" />
<div class="text">3016</div>
</div>
<div class="bottom-item like flexacenter">
<img class="icon" src="./img/share-gray.png" />
<div class="text">3016</div>
</div>
</div>
</div>
</div>
</div>
<div class="side-box"></div>
</div>
</div>
</div>
</div>
<script type="module" src="./js/sectionIndex.js"></script>
</body>
</html>