feat(manuscript): 文稿工作台加「Mock 文稿」按钮,不必等 dify 就能试编辑

点一下直接填进一份带标题层级/加粗/列表/引用/表格的样例结果,状态等同
「生成完成」:AI 原文快照一并写入,编辑正文、还原、草稿恢复都能立刻试。

- 样例用数组 join 拼,不用模板字符串:续行缩进在 markdown 里等于代码块,
  渲染出来是字面量星号和管道符(这次踩到了,已验证修复后 strong/table 正常)
- 按钮放在顶部操作条,虚线边框和真模板按钮区分开
- 只写本地状态与草稿,不落库、不调接口
This commit is contained in:
2026-11-02 15:03:23 +08:00
parent e3dcf8093a
commit b7aa57b62d
+57
View File
@@ -10,6 +10,7 @@
<view class="hero-action" @tap="fillDemo('wechat')">公众号推文</view>
<view class="hero-action" @tap="fillDemo('notice')">通知公告</view>
<view class="hero-action" @tap="fillDemo('free')">自由创作示例</view>
<view class="hero-action hero-action--mock" @tap="fillMockResult">Mock 文稿</view>
<view class="hero-action" @tap="goHistoryPage">历史记录</view>
<view class="hero-action hero-action--primary" @tap="goChatPage">进入问答助手</view>
</view>
@@ -253,6 +254,41 @@
const DOC_TYPE_VALUES = DOC_TYPE_ITEMS.map((item) => item.value)
const EVENT_TYPE_OPTIONS = ['校园活动', '志愿服务', '会议论坛', '社会实践', '文体活动', '品牌项目']
/**
* Mock 文稿:本地造一份结果,用来试「编辑正文 / 还原 / 草稿」这些交互,
* 不必等 dify 跑几分钟。样例故意带标题层级、加粗、列表、引用和表格,
* 是为了让编辑前后的渲染差异看得见。不落库,清空结果即清。
*/
const MOCK_TITLE = '广西医科大学青年志愿者开展“清洁校园”志愿服务活动'
// 用数组 join 而不是模板字符串:模板字符串的续行会被缩进成 markdown 的代码块,
// 渲染出来是一堆字面量星号和管道符,反而不像真实排版。
const MOCK_MARKDOWN = [
'## 一、活动概况',
'',
'2026年4月8日下午,校团委组织**120余名青年志愿者**在校园主干道及公共区域开展“清洁校园”志愿服务活动。',
'',
'### 1. 服务内容',
'',
'- 主干道两侧绿化带清理',
'- 教学楼公共区域消杀',
'- 共享单车规范摆放',
'',
'### 2. 参与人员',
'',
'| 单位 | 人数 | 负责区域 |',
'| --- | --- | --- |',
'| 校团委 | 12 | 统筹协调 |',
'| 青年志愿者协会 | 68 | 主干道 |',
'| 各学院团支部 | 40 | 教学楼 |',
'',
'> 志愿者们用实际行动践行劳动教育,把“奉献、友爱、互助、进步”的志愿精神写进校园。',
'',
'## 二、下一步计划',
'',
'1. 每月组织一次集中服务。',
'2. 把“清洁校园”纳入团支部考核。'
].join('\n')
/**
* 文稿草稿的本地存储 key:存当前这份稿子的正文(编辑过的就存编辑版本)
* 和 AI 原文快照。只存一份 —— 工作台一次只做一份稿子,存多份反而让
@@ -775,6 +811,20 @@
this.form.highlights = '说明报名条件、赛程安排、材料提交截止时间和联系方式,语气正式、条目清晰。'
this.form.number = '600'
},
/** 填入 Mock 文稿:等同「生成完成」,把样例记成 AI 原文,编辑功能随即可用 */
fillMockResult() {
if (this.loading) {
this.showToast('正在生成中,请稍后')
return
}
this.clearGenerated()
this.generatedTitle = MOCK_TITLE
this.generatedContent = MOCK_MARKDOWN
this.aiTitle = MOCK_TITLE
this.aiMarkdown = MOCK_MARKDOWN
this.persistDraft()
this.showToast('已填入 Mock 文稿,可直接编辑正文')
},
async chooseFiles() {
if (this.uploading) {
return
@@ -1018,6 +1068,13 @@
font-weight: 700;
}
/* Mock 是测试入口,用虚线区分,别和真模板按钮混在一起 */
.hero-action--mock {
background: transparent;
border: 1rpx dashed rgba(255, 255, 255, 0.55);
color: rgba(255, 255, 255, 0.86);
}
.panel-card {
margin-top: 24rpx;
padding: 26rpx;