Files
min-offer-forum-issue/index.html
DESKTOP-RQ919RC\Pc e7e68aa42b feat: 添加底部按钮动画效果并优化代码
- 为底部按钮添加显示/隐藏的过渡动画效果
- 移除vconsole调试工具相关代码
- 优化图片上传相关代码结构
- 修复底部按钮状态控制逻辑
2025-10-13 18:55:49 +08:00

84 lines
4.4 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>发布帖子</title>
<link rel="stylesheet" href="./css/index.css" />
<script src="./js/vue.global.js"></script>
<!-- <script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script> -->
</head>
<body>
<div class="container" id="appIndex">
<div class="title-box">
<textarea class="input" id="title" placeholder="输入标题(非必填)" :maxlength="titleLength" v-model="title" ref="titleTextarea" @input="adjustTextareaHeight"></textarea>
</div>
<div class="editor-box">
<div class="editor" :class="{ 'empty': isEmpty }" ref="editorRef" id="editor" placeholder="输入正文" contenteditable="true" @input="onEditorInput" @focus="onEditorFocus" @blur="onEditorBlur" v-html="info.content"></div>
<div class="operate-box" :class="{'fixed': fixedState}" ref="operateRef" contenteditable="false" @click="fixedState = false">
<div class="label flexflex" scroll-x>
<div class="item" v-for="index in 8" :key="index" @click.stop="insertLabel(`推荐标签${index}`)">#推荐标签{{ index }}</div>
</div>
<div class="btn-list flexacenter">
<div class="item flexacenter" :class="{ 'pitch': isPTitle }" @click="paragraphTitle">
<img class="icon" src="https://app.gter.net/image/miniApp/offer/T-icon.png" />
<div class="text">段落标题</div>
</div>
<div class="item flexacenter">
<img class="icon" src="https://app.gter.net/image/miniApp/offer/img-icon.png" />
<div class="text">图片</div>
<input class="file" type="file" @change="insertImage" accept=".png, .jpg, .jpeg" />
</div>
<div class="item flexacenter" @click="openEmoji">
<img class="icon" src="https://app.gter.net/image/miniApp/offer/smiling-face-round-black.png" />
<div class="text">表情</div>
</div>
<div class="flex1"></div>
<!-- <div class="unfold flexcenter">
https://app.gter.net/image/miniApp/offer/fold-icon.png
<img class="icon" src="https://app.gter.net/image/miniApp/offer/unfold-icon.png" />
</div> -->
</div>
</div>
</div>
<div class="anonymity flexacenter" @click.stop="cutAnonymity">
<img v-if="info.anonymity == 1" class="icon-pitch" src="https://app.gter.net/image/miniApp/offer/tick-box.svg" />
<div v-else class="icon"></div>
<div class="text">匿名发布</div>
</div>
<div class="new-footer-btn" :class="{'show': isBottomState}">
<div view class="flexacenter save-draft-btn" bindtap="handleLastPublish" data-state="0">
<div class="flexcenter save-draft-icon-box">
<img class="save-draft-icon" src="https://app.gter.net/image/miniApp/offer/draft-icon.png"></img>
</div>
<div>存草稿</div>
</div>
<div class="new-footer-submit flex1 flexcenter" bindtap="authenticationSubmit">发布</div>
</div>
<div class="pop flexflex" v-if="emojiState" @click="closeEmoji">
<div class="emoji-system-list" scroll-y="true" show-scrollbar="false" enhanced="true">
<div class="item" v-for="item in optionEmoji" :key="item" @click.stop="selectEmoji(item)">{{ item }}</div>
<div class="fill"></div>
</div>
</div>
</div>
<script>
// var vConsole = new window.VConsole();
// console.log("Hello world");
// vConsole.destroy();
</script>
<script src="./js/fontSize.js"></script>
<script src="./js/index.js"></script>
</body>
</html>