feat(签署文书): 统一签署态文书样式并精简演示种子为单份麻精同意书

clinical-web/src/views/management/documents/components/editors/EditorWangPane.vue

@@ -244,6 +244,9 @@ onBeforeUnmount(() => {
       :default-config="toolbarConfig"
       :mode="editorMode"
     />
+    <!-- 工具栏的第二行（原型 mdDocEd 里「插入签署占位符」那一行）。
+         放在工具栏与正文之间，让"插入什么"与"排版成什么样"在同一条视觉带里。 -->
+    <slot name="toolbar-extra" />
     <Editor
       class="pane-content"
       :model-value="props.modelValue"
@@ -316,8 +319,16 @@ onBeforeUnmount(() => {
 }
 
 /* ---- 占位符 / 勾选框胶囊 ----
-   现在有两种占位符胶囊，样式刻意保持一致（都代表"待签署内容"，不该靠外观区分重要性）：
+   配色与形状照原型 V10.2 的 .docfld（见 styles/signing-document.css 里签署态的同一套色）：
 
+   - 文本 / 日期：蓝（--brand 系）
+   - 签名：橙（#c07f00 系）——它决定签名落位，是文书里最不能漏的一项
+   - 勾选 / 选择：绿（#0f9d6c 系），且前面带一个 ☑ 提示这是可勾的
+
+   原型不给胶囊加类型角标，靠颜色区分类型；这里也照做，
+   完整信息（必填 / 选项 / 多选 / 高危值）留在 title 里。
+
+   两种载体共用同一套外观：
    ① 结构化占位符（.ms-sign-node）：Slate 元素节点，正文里存成 <span data-field>。
       标签文字走下面的 ::before，DOM 里没有可落光标的文字，一次退格整块删除。
    ② 旧式 ｛患者姓名｝（.ms-sign-brace + .ms-sign-chip）：decorate 出来的叶子，
@@ -340,25 +351,49 @@ onBeforeUnmount(() => {
   margin-left: -0.18em;
 }
 
-/* 占位符主体：带类型角标的胶囊 */
+/* 占位符主体：原型 .docfld 的编辑器版（虚线胶囊 + 品牌浅底 + 加粗） */
 .pane-content :deep(.ms-sign-chip) {
   display: inline-block;
-  padding: 0 6px;
+  padding: 1px 8px;
+  margin: 0 2px;
   color: var(--brand-d);
-  font-size: 0.92em;
-  font-weight: 700;
-  line-height: 1.65;
+  font-size: 0.95em;
+  font-weight: 600;
+  line-height: 1.7;
+  white-space: nowrap;
   background: var(--brand-l);
-  border: 1px solid #bcd9e3;
-  border-radius: 4px;
+  border: 1px dashed var(--brand);
+  border-radius: 5px;
 }
 
 /* 结构化占位符的标签文字：走 CSS 内容而不是 DOM 文本节点。
    元素是 void，DOM 里只有它自己与一个绝对定位的零宽占位叶子；
    若在这里放真实文字，浏览器原生光标会落进文字里，
-   一次退格就只删掉一个字符 —— 正好破坏"一次退格整块删除"这个设计目标 */
+   一次退格就只删掉一个字符 —— 正好破坏"一次退格整块删除"这个设计目标。
+
+   外层方括号与原型 fieldHtml 的 `【label】` 一致：正文里一眼能认出这是占位符而不是文书正文。 */
 .pane-content :deep(.ms-sign-node)::before {
-  content: attr(data-sign-label);
+  content: '【' attr(data-sign-label) '】';
+}
+
+/* 签名位：橙（原型 .docfld.k-signature） */
+.pane-content :deep(.ms-sign-node[data-sign-kind='signature']) {
+  color: #9a5f00;
+  background: #fff7e8;
+  border-color: #c07f00;
+}
+
+/* 勾选 / 选择：绿，并在标签前补一个 ☑（原型 .docfld.k-checkbox::before） */
+.pane-content :deep(.ms-sign-node[data-sign-kind='checkbox']),
+.pane-content :deep(.ms-sign-node[data-sign-kind='choice']) {
+  color: #0b7a4b;
+  background: #eafaf1;
+  border-color: #0f9d6c;
+}
+
+.pane-content :deep(.ms-sign-node[data-sign-kind='checkbox'])::before,
+.pane-content :deep(.ms-sign-node[data-sign-kind='choice'])::before {
+  content: '\2611  【' attr(data-sign-label) '】';
 }
 
 /* 选中态：点一下即整块选中，给个明确的反色，让人知道接下来的退格会删掉整块 */
@@ -368,21 +403,15 @@ onBeforeUnmount(() => {
   border-color: var(--brand);
 }
 
-.pane-content :deep(.ms-sign-node.is-selected)::after {
-  border-left-color: rgb(255 255 255 / 35%);
+.pane-content :deep(.ms-sign-node[data-sign-kind='signature'].is-selected) {
+  background: #c07f00;
+  border-color: #c07f00;
 }
 
-/* 类型角标：签名/日期/文本……让科室不点开也知道这一项要填什么。
-   所有占位符共用一个样式，靠这个角标区分类型，不再按必填/签名位分色 */
-.pane-content :deep(.ms-sign-chip)::after {
-  padding-left: 5px;
-  margin-left: 5px;
-  color: inherit;
-  font-size: 0.8em;
-  font-weight: 400;
-  content: attr(data-sign-tag);
-  border-left: 1px solid rgb(0 0 0 / 10%);
-  opacity: 0.7;
+.pane-content :deep(.ms-sign-node[data-sign-kind='checkbox'].is-selected),
+.pane-content :deep(.ms-sign-node[data-sign-kind='choice'].is-selected) {
+  background: #0f9d6c;
+  border-color: #0f9d6c;
 }
 
 /* 勾选框：签署时会转成可勾选控件，这里给它一个"框"的观感。