feat(签署文书): 通用文本项按出现位置独立成项并插入文本框占位符

This commit is contained in:
yelan
2026-09-18 13:30:06 +08:00
parent d2cd3f2489
commit 11fe83d807
5 changed files with 184 additions and 47 deletions
@@ -5,8 +5,10 @@ import { ElMessage } from 'element-plus'
import type { CampusRecord, DepartmentRecord } from '@/api/management/types'
import {
buildFieldToken,
buildGenericTextToken,
collectFieldDefs,
findDuplicateFields,
GENERIC_TEXT_FIELD_LABEL,
SIGNING_FIELD_KIND_LABELS,
SIGNING_FIELD_PRESETS,
} from '@/utils/signing-fields'
@@ -43,9 +45,12 @@ const importing = ref(false)
const importMessage = ref('')
const paneRef = ref<EditorPaneHandle | null>(null)
// 占位符在签署时按字段键取 HIS 与患者就诊信息自动填充,其中签名是独立控件类型:
// 签字后签名图作为该字段取值落回文书原本的签名位,不需要再替换文字。
// 目录见 utils/signing-fields 的 SIGNING_FIELD_PRESETS,与签署端渲染共用同一份。
// 占位符分两类:
// ① 目录里的字段(utils/signing-fields 的 SIGNING_FIELD_PRESETS):取值有固定来源,
// 签署时按字段键取 HIS / 患者就诊快照自动填充,其中签名是独立控件类型——
// 签字后签名图作为该字段取值落回文书原本的签名位,不需要再替换文字;
// ② 通用文本项(现场手填的输入框,如与患者关系、受托人姓名):没有系统取值来源,
// 默认写 {文本框},签署时渲染成一个空文本框,名称在正文里改即可,见 insertGenericTextField。
const form = reactive<TemplateEditorForm>({
templateCode: '',
@@ -113,6 +118,17 @@ function insertField(field: (typeof SIGNING_FIELD_PRESETS)[number]) {
insertContent(buildFieldToken(field))
}
/**
* 插入通用文本项:现场手填的输入框,默认 {文本框}。
*
* 每插一个就是一个独立填写项(字段键按出现位置编号,见 signing-fields 的 resolveFieldByLabel),
* 所以两处文本框天然是两份取值,不需要为了区分而改名字。
* 名称只决定文书里显示的文字:改成「与患者关系」是为了读起来像文书,不影响取值归属。
*/
function insertGenericTextField() {
insertContent(buildGenericTextToken())
}
/** 已插入的填写项:让科室在保存前确认签名位、日期位有没有漏 */
const detectedFields = computed(() => collectFieldDefs(valueHtml.value))
@@ -284,6 +300,14 @@ function save() {
>
{{ field.label }}{{ field.required ? ' *' : '' }}
</button>
<button
type="button"
class="placeholder-chip is-generic"
:title="`插入一个文本输入框(占位符 ${GENERIC_TEXT_FIELD_LABEL}),签署时由患者/家属现场填写。插几个就是几个独立填写项,各填各的;名称只决定显示的文字,可在正文里直接改(如改成「与患者关系」)`"
@click="insertGenericTextField()"
>
{{ GENERIC_TEXT_FIELD_LABEL }}
</button>
</div>
</div>
<div class="meta-field">
@@ -344,7 +368,8 @@ function save() {
<span v-if="importMessage" class="docx-message">{{ importMessage }}</span>
<span v-else class="docx-hint">
建议从 Word/WPS
中全选复制文书后直接粘贴到下方编辑区;需要患者勾选的内容可点上方「插入勾选框」按钮插入(光标停在表格单元格里就插到该单元格),或用表头含「勾选」列的表格承载。
中全选复制文书后直接粘贴到下方编辑区;需要患者勾选的内容可点上方「插入勾选框」按钮插入(光标停在表格单元格里就插到该单元格),或用表头含「勾选」列的表格承载;
需要患者现场填写的内容(与患者关系、受托人姓名等)点「文本框」插入输入框占位符,插几个就是几处独立填写、各填各的;把名称改成实际叫法只是为了读起来像文书。
占位符与勾选框在编辑区会显示成带类型标签的胶囊,便于和正文区分。
</span>
</div>
@@ -514,6 +539,12 @@ function save() {
background: #fff4e2;
}
/* 通用文本项:虚线圈住,和左边一排系统预填字段区分开——
它不是某个固定字段,插到哪就是一个现场手填的输入框,名称可以在正文里随便改 */
.placeholder-chip.is-generic {
border: 1px dashed var(--brand);
}
.placeholder-check {
padding: 10px 18px 0;
}