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

155 lines
8.4 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/index.css" />
<script src="./js/vue.global.js"></script>
</head>
<body>
<div class="container" id="appIndex">
<!-- 话题和精选 -->
<div v-if="true" 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" />
<div class="text">话题</div>
</div>
<div class="topic-head flexflex" bind:tap="goDetails" data-uniqid="{{ ongoingbj.uniqid }}">
<div class="title one-line-display">{{ ongoingbj.title }}</div>
<div class="hint one-line-display">{{ ongoingbj.description }}</div>
<div class="people flexacenter">
<div class="left flexacenter">
<div class="number">{{ 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">
<div class="item flexacenter" v-for="(item, index) in pastList" :key="index" bind:tap="goDetails" data-uniqid="{{ item.uniqid }}">
<img class="img" src="https://app.gter.net/image/miniApp/offer/well-yellow.svg" />
<div class="text one-line-display flex1">{{ item.title }}</div>
</div>
</div>
</div>
<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>
<!-- 论坛板块列表 -->
<div v-if="true" class="forum-sections-list">
<img class="img" src="./img/sections-left.svg" />
<div class="title">论坛版块</div>
<div class="list">
<div class="line flexacenter">
<div class="item flexacenter">香港</div>
<div class="item flexacenter">香港</div>
<div class="item flexacenter">香港</div>
</div>
<div class="line flexacenter">
<div class="item flexacenter">经济/商科</div>
<div class="item flexacenter">经济/商科</div>
<div class="item flexacenter">经济/商科</div>
</div>
<div class="line flexacenter">
<div class="item flexacenter">香港</div>
<div class="item flexacenter">香港</div>
<div class="item flexacenter">香港</div>
</div>
<div class="line flexacenter">
<div class="item flexacenter">香港</div>
<div class="item flexacenter">香港</div>
<div class="item flexacenter">香港</div>
</div>
</div>
</div>
<div class="item-box item-forum">
<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>
<script src="./js/index.js"></script>
</body>
</html>