feat(documents): 文档归属改为卡片式复选框网格并优化通用项样式

clinical-web/src/views/management/documents/components/DocumentPropsDialog.vue

@@ -177,16 +177,19 @@ function submit() {
             <div class="form-field span-2">
               <span>文档归属 <i>*</i></span>
               <div class="ownership">
-                <button
+                <label
                   v-for="option in ownershipOptions"
                   :key="option"
-                  type="button"
+                  class="ownership-option"
-                  class="ownership-chip"
+                  :class="{ 'is-general': option === GENERAL_OWNERSHIP }"
-                  :class="{ 'is-on': form.ownership.includes(option) }"
-                  @click="toggleOwnership(option)"
                 >
-                  {{ option }}
+                  <input
-                </button>
+                    type="checkbox"
+                    :checked="form.ownership.includes(option)"
+                    @change="toggleOwnership(option)"
+                  />
+                  <span>{{ option }}</span>
+                </label>
               </div>
               <p class="field-tip">
                 勾选科室设置可见范围，支持多科室与通用（全院）。勾选「通用（全院）」后各科室均可见。
@@ -382,31 +385,63 @@ function submit() {
   box-sizing: border-box;
 }
 
+/*
+ * 文档归属：原型 V10.2 的 .cg-dept —— 卡片式复选框网格。
+ * 容器是浅底带框的 3 列网格，每项一张白卡（原生 checkbox + 科室名），
+ * 「通用（全院）」独占一行并用浅蓝底区分（原型 grid-column:1/-1）。
+ * 科室名过长时截断：原型同一处就是 nowrap + ellipsis。
+ */
 .ownership {
-  display: flex;
+  display: grid;
-  flex-wrap: wrap;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
-  gap: 6px;
+  gap: 8px;
-}
+  padding: 12px 14px;
-
+  background: #f7fafb;
-.ownership-chip {
-  padding: 4px 11px;
-  color: var(--mut);
-  font-size: 12px;
-  background: #f4f8fa;
   border: 1px solid var(--line);
-  border-radius: 14px;
+  border-radius: 10px;
 }
 
-.ownership-chip:hover {
+.ownership-option {
-  color: var(--brand);
+  display: flex;
-  border-color: var(--brand);
+  gap: 5px;
+  align-items: center;
+  min-width: 0;
+  padding: 8px 12px;
+  color: var(--ink);
+  font-size: 12.5px;
+  background: #fff;
+  border: 1px solid var(--line);
+  border-radius: 8px;
+  cursor: pointer;
+  transition:
+    border-color 0.15s,
+    box-shadow 0.15s;
 }
 
-.ownership-chip.is-on {
+.ownership-option:hover {
-  color: var(--brand-d);
-  font-weight: 700;
-  background: var(--brand-l);
   border-color: var(--brand);
+  box-shadow: 0 2px 8px rgb(15 60 80 / 8%);
+}
+
+.ownership-option.is-general {
+  grid-column: 1 / -1;
+  background: #eef6f9;
+  border-color: #bcd9e4;
+}
+
+/* 必须盖掉 .form-field input 的整宽与内边距，否则复选框会被拉成一个方块 */
+.ownership-option input[type='checkbox'] {
+  flex: none;
+  width: auto;
+  padding: 0;
+  margin: 0;
+  accent-color: var(--brand);
+}
+
+.ownership-option > span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .field-tip {