feat: 新增编辑页面和分享功能,优化链接跳转和样式

- 添加edit.html编辑页面及相关CSS样式
- 实现内容编辑区的富文本功能
- 为item-bottom组件添加分享功能,包括复制链接和微信转发
- 更新多个组件的链接跳转地址
- 优化CSS样式,包括圆角、阴影和hover效果
- 修复部分样式问题和布局错位
- 移除不再使用的section-index.html文件
This commit is contained in:
A1300399510
2025-11-03 00:42:30 +08:00
parent 38028167c0
commit 7bdeff17f6
51 changed files with 2414 additions and 481 deletions

View File

@@ -1,291 +1,273 @@
<!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/index.css" />
<script src="./js/vue.global.js"></script>
<style>
[v-cloak] {
display: none;
}
</style>
</head>
<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/index.css" />
<script src="./js/vue.global.js"></script>
<style>
[v-cloak] {
display: none;
}
</style>
</head>
<body>
<div class="container" id="appIndex" v-cloak>
<head-top></head-top>
<body>
<div class="container" id="appIndex" v-cloak>
<head-top></head-top>
<div class="header-content-box flexflex">
<div class="header-content-left ">
<div class="adv-list flexacenter">
<a class="adv-item" target="_blank">
<img class="adv-img" src="https://o.x-php.com/bbs/common/cf/144405a5pqst6fakct81t8.gif" />
</a>
<a class="adv-item" target="_blank">
<img class="adv-img" src="https://o.x-php.com/bbs/common/cf/144405a5pqst6fakct81t8.gif" />
</a>
</div>
<!-- 话题和精选 -->
<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" />
<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 class="header-content-box flexflex">
<div class="header-content-left">
<div class="adv-list flexacenter">
<a class="adv-item" target="_blank">
<img class="adv-img" src="https://o.x-php.com/bbs/common/cf/144405a5pqst6fakct81t8.gif" />
</a>
<a class="adv-item" target="_blank">
<img class="adv-img" src="https://o.x-php.com/bbs/common/cf/144405a5pqst6fakct81t8.gif" />
</a>
</div>
<!-- 话题和精选 -->
<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" />
<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">
<a class="item flexacenter" v-for="(item, index) in pastList" :key="index" :href="'http://14.22.79.19:9551/?tpl=forum/details&uniqid=' + item.uniqid" target="_blank">
<img class="img" src="https://app.gter.net/image/miniApp/offer/well-yellow.svg" />
<div class="text one-line-display flex1">{{ item.title }}</div>
</a>
</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 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">
<a class="item flexacenter" v-for="(item, index) in topicHandpickedList" :key="index" :href="'http://14.22.79.19:9551/?tpl=forum/details&uniqid=' + item.uniqid" target="_blank">
<div class="dot"></div>
<div class="text one-line-display">{{ item.title }}</div>
</a>
</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 class="header-left-bottom-box flexflex">
<a class="adv flexacenter" data-x-event="bbsindexslide" href="https://bbs.gter.net/thread-1663824-1-1.html" title="26Fall祈福求offer得offer" target="_blank">
<img class="adv-icon" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG_Y2l-U_potcXiB1NFX9ddrB-ebU2ybYKMuA2kGH_7R-9lU990IXj3X-Q7x4Cg0NDI5" alt="26Fall祈福求offer得offer" />
</a>
<div class="list">
<div class="item flexacenter" v-for="(item, index) in 4" :key="index">
<div class="icon dot-gray"></div>
<a class="one-line-display text flex1" href="https://offer.gter.net/details/XynvPnSnX1KL" target="_blank">26Fall-香港理工大学 MSc Offer</a>
</div>
</div>
<div class="list flexflex">
<div class="item flexacenter" v-for="(item, index) in topicHandpickedList" :key="index">
<div class="dot"></div>
<div class="text one-line-display">{{ item.title }}</div>
<div class="list list2">
<div class="item flexacenter" v-for="(item, index) in 4" :key="index">
<div class="icon dot-gray"></div>
<a class="one-line-display text flex1" href="https://offer.gter.net/details/y9KbiuzHXbmr" target="_blank">26Fall-香港科技大学 MSc Offer</a>
</div>
</div>
</div>
</div>
<div class="header-left-bottom-box flexflex">
<a class="adv flexacenter" data-x-event="bbsindexslide" href="https://bbs.gter.net/thread-1663824-1-1.html" title="26Fall祈福求offer得offer" target="_blank">
<img class="adv-icon" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG_Y2l-U_potcXiB1NFX9ddrB-ebU2ybYKMuA2kGH_7R-9lU990IXj3X-Q7x4Cg0NDI5" alt="26Fall祈福求offer得offer">
<div class="header-content-right">
<div class="post-entrance">
<div class="entrance-top flexacenter"><img class="icon" src="./img/forum.png" />我要发帖</div>
<div class="entrance-bottom flexacenter">
<a class="item flexcenter" href="https://offer.gter.net/post" target="_blank" style="position: relative">
<img class="icon" src="./img/offer.svg" style="width: 16px" />
<span class="text">报Offer</span>
</a>
<a class="item flexcenter" href="https://offer.gter.net/post/summary" target="_blank" style="position: relative">
<img class="icon" src="./img/summarize.png" style="width: 16px" />
<span class="text">写总结</span>
</a>
<a class="item flexcenter" href="https://interviewexperience.gter.net/publish" target="_blank" style="position: relative">
<img class="icon" src="./img/mj.png" style="width: 16px" />
<span class="text">写面经</span>
</a>
<a class="item flexcenter" href="https://vote.gter.net/publish" target="_blank" style="position: relative">
<img class="icon" src="./img/vote.svg" style="width: 16px" />
<span class="text">发起投票</span>
</a>
</div>
</div>
<a class="adv-broadside" ref="custom_2AdvRef">
<img class="adv-broadside-img" src="https://o.x-php.com/bbs/common/cf/152158dpf5eh7pqpaealiq.gif" />
</a>
<div class="list">
<div class="item flexacenter" v-for="(item, index) in 4" :key="index">
<div class="icon dot-gray"></div><a class="one-line-display text flex1" href="https://offer.gter.net/details/XynvPnSnX1KL" target="_blank">26Fall-香港理工大学 MSc Offer</a>
</div>
</div>
<div class="list list2">
<div class="item flexacenter" v-for="(item, index) in 4" :key="index">
<div class="icon dot-gray"></div><a class="one-line-display text flex1" href="https://offer.gter.net/details/y9KbiuzHXbmr" target="_blank">26Fall-香港科技大学 MSc Offer</a>
</div>
</div>
</div>
</div>
<div class="header-content-right">
<div class="post-entrance">
<div class="entrance-top flexacenter">
<img class="icon" src="./img/forum.png">我要发帖
</div>
<div class="entrance-bottom flexacenter">
<div v-for="(item, index) in 4" :key="index" class="item flexcenter" target="_blank" style="position: relative;">
<img class="icon" src="./img/forum.png" style="width: 16px;">
<span class="text">发帖</span>
</div>
</div>
</div>
<a class="adv-broadside" ref="custom_2AdvRef">
<img class="adv-broadside-img" src="https://o.x-php.com/bbs/common/cf/152158dpf5eh7pqpaealiq.gif" />
</a>
<div class="group-box">
<div class="group flexflex">
<div class="group-item flexcenter" v-for="(item, index) in popList" :key="index">
<div class="title">{{ item.title }}</div>
<div class="subtitle">{{ item.subtitle }}</div>
</div>
</div>
</div>
<div class="offer-box" :class="{'small': 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-cloak v-for="(item, index) in offerlist" :key="index">
<div class="avatar" :style="{backgroundImage: `url(${item['avatar']})`}"></div>
<div class="">
<div class="condition one-line-display">{{ item["date"] }} {{ item['type'] }}</div>
<div class="titletitle one-line-display">{{ item["content"] }}</div>
</div>
</a>
</div>
</div>
</div>
</div>
<div class="matter flexflex">
<div class="matter-content flex1">
<!-- 论坛板块列表 -->
<div class="forum-sections-list">
<img class="img" src="./img/sections-left.svg" />
<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-index.html?section=${item.uniqid}`">{{ item.name }}</a>
</div>
</template>
</div>
</div>
<item-forum :itemdata="item" v-for="(item, index) in list" :key="index"></item-forum>
</div>
<div class="sidebar">
<a class="adv" href="" target="_blank">
<img class="adv-icon" src="https://o.x-php.com/bbs/common/cf/1709075xdbbbvjd8cbxvdd.jpg" alt="26Fall祈福求offer得offer">
</a>
<a class="adv" href="" target="_blank">
<img class="adv-icon" src="https://o.x-php.com/bbs/common/cf/1709075xdbbbvjd8cbxvdd.jpg" alt="26Fall祈福求offer得offer">
</a>
<!-- 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="{~}forum/assets/forum/offer-icon.png" />
<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="./img/right-arrow-black.svg" />
</a>
</div>
<div class="box">
<a class="item flexflex" v-cloak v-for="item in offer" :key="item" :href="item['url']" target="_blank">
<img class="school-img" :src="item.data['schoollogo']" />
<div class="school-detail flex1 flexflex">
<div 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 class="group-box">
<div class="group flexflex">
<div class="group-item flexcenter" v-for="(item, index) in popList" :key="index">
<div class="title">{{ item.title }}</div>
<div class="subtitle">{{ item.subtitle }}</div>
<div class="QRcode-box flexcenter">
<img class="QRcode" :src="item.img" />
<div class="text">微信扫码</div>
</div>
</div>
</a>
<a class="add-btn flexcenter" style="position: relative;" href="https://offer.gter.net/post" target="_blank" v-cloak>
<img class="add-icon" src="./img/add-btn-black.svg" />
<div>报Offer</div>
<div v-if="realname == 0 && userInfo.uin > 0" class="open-attest-btn" @click.prevent="openAttest"></div>
</a>
</div>
</div>
<div class="offer-box" :class="{'small': 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-cloak v-for="(item, index) in offerlist" :key="index">
<div class="avatar" :style="{backgroundImage: `url(${item['avatar']})`}"></div>
<div class="">
<div class="condition one-line-display">{{ item["date"] }} {{ item['type'] }}</div>
<div class="titletitle one-line-display">{{ item["content"] }}</div>
</div>
</a>
</div>
</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="{~}forum/assets/forum/vote-icon.png" />
<div class="title">投票</div>
</div>
<div class="matter flexflex">
<div class="matter-content flex1">
<!-- 论坛板块列表 -->
<div class="forum-sections-list">
<img class="img" src="./img/sections-left.svg" />
<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-index.html?section=${item.uniqid}`">{{ item.name }}</a>
</div>
</template>
</div>
<a class="more flexacenter" target="_blank" href="https://vote.gter.net">
<span>more</span>
<img class="more-icon" src="./img/right-arrow-black.svg" />
</a>
</div>
<div class="box">
<a class="item flexflex" v-cloak v-for="item in vote" :key="item" target="_blank" :href="item['url']">
<div class="name one-line-display">{{item['title']}}</div>
<div class="brief">{{ item['message'] }}</div>
</a>
<a class="add-btn flexcenter" style="position: relative;" v-cloak target="_blank" href="https://vote.gter.net/publish">
<img class="add-icon" src="./img/add-btn-black.svg" />
<div>发起投票</div>
<div v-if="realname == 0 && userInfo.uin > 0" class="open-attest-btn" @click.prevent="openAttest"></div>
</a>
</div>
<item-forum :itemdata="item" v-for="(item, index) in list" :key="index"></item-forum>
</div>
<div class="sidebar">
<a class="adv" href="" target="_blank">
<img class="adv-icon" src="https://o.x-php.com/bbs/common/cf/1709075xdbbbvjd8cbxvdd.jpg" alt="26Fall祈福求offer得offer" />
</a>
<a class="adv" href="" target="_blank">
<img class="adv-icon" src="https://o.x-php.com/bbs/common/cf/1709075xdbbbvjd8cbxvdd.jpg" alt="26Fall祈福求offer得offer" />
</a>
<!-- 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="{~}forum/assets/forum/mj-icon.png" />
<div class="title">面经</div>
</div>
<a class="more flexacenter" href="https://interviewexperience.gter.net/" target="_blank">
<span>more</span>
<img class="more-icon" src="./img/right-arrow-black.svg" />
</a>
</div>
<div class="box">
<a class="item flexflex" v-cloak v-for="(item,index) in interviewexperience" :key="item" :href="item['url']" target="_blank">
<div class="school one-line-display">{{ item.data['schoolname'] }}</div>
<div class="major one-line-display" v-if="item.data['profession']">{{ item.data['profession'] }}</div>
<div class="info">
<img class="icon" :src="item.user['avatar']" />
<span class="text">{{ item['content'] }}</span>
<!-- 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="./img/offer-index-icon.png" />
<div class="title">Offer</div>
</div>
</a>
<a class="add-btn flexcenter" style="position: relative;" href="https://interviewexperience.gter.net/publish" target="_blank" v-cloak>
<img class="add-icon" src="./img/add-btn-black.svg" />
<div>写面经</div>
<div v-if="realname == 0 && userInfo.uin > 0" class="open-attest-btn" @click.prevent="openAttest"></div>
</a>
<a class="more flexacenter" href="https://offer.gter.net" target="_blank">
<span>more</span>
<img class="more-icon" src="./img/right-arrow-black.svg" />
</a>
</div>
<div class="box">
<a class="item flexflex" v-cloak v-for="item in offer" :key="item" :href="'https://offer.gter.net/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">{{ 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" style="position: relative" href="https://offer.gter.net/post" target="_blank" v-cloak>
<img class="add-icon" src="./img/add-btn-black.svg" />
<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="./img/vote-index-icon.png" />
<div class="title">投票</div>
</div>
<a class="more flexacenter" target="_blank" href="https://vote.gter.net">
<span>more</span>
<img class="more-icon" src="./img/right-arrow-black.svg" />
</a>
</div>
<div class="box">
<a class="item flexflex" v-cloak v-for="item in vote" :key="item" target="_blank" :href="'https://vote.gter.net/details/' + item['uniqid']">
<div class="name one-line-display">{{item['title']}}</div>
<div class="brief">{{ item['message'] }}</div>
</a>
<a class="add-btn flexcenter" style="position: relative" v-cloak target="_blank" href="https://vote.gter.net/publish">
<img class="add-icon" src="./img/add-btn-black.svg" />
<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="./img/mj-index-icon.png" />
<div class="title">面经</div>
</div>
<a class="more flexacenter" href="https://interviewexperience.gter.net/" target="_blank">
<span>more</span>
<img class="more-icon" src="./img/right-arrow-black.svg" />
</a>
</div>
<div class="box">
<a class="item flexflex" v-cloak v-for="(item,index) in interviewexperience" :key="item" :href="'https://interviewexperience.gter.net/details/' + item['uniqid']" target="_blank">
<div class="school one-line-display">{{ item.data['schoolname'] }}</div>
<div class="major one-line-display" v-if="item.data['profession']">{{ item.data['profession'] }}</div>
<div class="info">
<img class="icon" :src="item.user['avatar']" />
<span class="text">{{ item['content'] }}</span>
</div>
</a>
<a class="add-btn flexcenter" style="position: relative" href="https://interviewexperience.gter.net/publish" target="_blank" v-cloak>
<img class="add-icon" src="./img/add-btn-black.svg" />
<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>
<!-- newest 最新 -->
<!-- <div class="newest-side-box side-box" v-if="Object.keys(newPost).length !== 0">
<img class="bounding" src="{~}forum/assets/forum/bounding-circle-green.svg" alt="" />
<div class="side-header flexacenter">
<div class="left flexacenter">
<img class="header-icon" src="{~}forum/assets/forum/newest-icon.png" />
<div class="title">最新</div>
</div>
</div>
<div class="box">
<a class="item flexacenter" v-cloak v-for="item in newPost.data.slice(0,16)" :key="item" :href="item['url']" target="_blank">
<div class="dot dot-green"></div>
<div class="text one-line-display">{{ item['subject'] }}</div>
</a>
</div>
</div> -->
<!-- essence 精选 -->
<!-- <div class="essence-side-box side-box" v-if="Object.keys(essencePost).length !== 0">
<img class="bounding" src="{~}forum/assets/forum/bounding-circle-blue.svg" alt="" />
<div class="side-header flexacenter">
<div class="left flexacenter">
<img class="header-icon" src="{~}forum/assets/forum/essence.png" />
<div class="title">精华阅读</div>
</div>
</div>
<div class="box">
<a class="item flexacenter" v-cloak v-for="item in essencePost.data" :key="item" :href="item['url']" target="_blank ">
<div class="dot"></div>
<div class="text one-line-display">{{ item['subject'] }}</div>
</a>
</div>
</div> -->
</div>
</div>
</div>
<script src="./js/axios.min.js"></script>
<script src="./js/public.js"></script>
<script src="./js/scrolltext.js"></script>
<script type="module" src="./js/index.js"></script>
</body>
</html>
<script src="./js/axios.min.js"></script>
<script src="./js/public.js"></script>
<script src="./js/scrolltext.js"></script>
<script type="module" src="./js/index.js"></script>
</body>
</html>