Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
de990a921b | ||
|
|
cfe4c82c90 | ||
|
|
c3ceb0dd0f | ||
|
|
9add23e019 | ||
|
|
2199887c07 | ||
|
|
56dbd7f115 | ||
|
|
d10f213573 | ||
|
|
a968945057 | ||
|
|
971a627288 | ||
|
|
c37d5abac4 | ||
|
|
ebc463864b | ||
|
|
ab140ab05e | ||
|
|
894f52e875 | ||
|
|
a133d5d85d | ||
|
|
2c238d6599 | ||
|
|
1ca87f8d72 | ||
|
|
5bf6ea01f6 | ||
|
|
90be4bf60b | ||
|
|
1c7b22a72f | ||
|
|
00ce6d6875 | ||
|
|
bdd8e69ec8 | ||
|
|
245c52075d | ||
|
|
c836084fd3 | ||
|
|
e20374e5d8 | ||
|
|
037e5ba450 |
@@ -190,6 +190,10 @@ export function wecomPromotionSavePool(params: Record<string, unknown>) {
|
||||
return request.post({ url: '/firstvisit.wecomPromotion/savePool', params })
|
||||
}
|
||||
|
||||
export function wecomPromotionSaveWidget(params: Record<string, unknown>) {
|
||||
return request.post({ url: '/firstvisit.wecomPromotion/saveWidget', params })
|
||||
}
|
||||
|
||||
export function wecomPromotionDeletePool(params: { id: number }) {
|
||||
return request.post({ url: '/firstvisit.wecomPromotion/deletePool', params })
|
||||
}
|
||||
|
||||
@@ -8,6 +8,7 @@ interface Options {
|
||||
params?: Record<any, any>
|
||||
fixedParams?: Record<any, any>
|
||||
firstLoading?: boolean
|
||||
latestOnly?: boolean
|
||||
}
|
||||
|
||||
export function usePaging(options: Options) {
|
||||
@@ -17,7 +18,8 @@ export function usePaging(options: Options) {
|
||||
fetchFun,
|
||||
params = {},
|
||||
fixedParams = {},
|
||||
firstLoading = false
|
||||
firstLoading = false,
|
||||
latestOnly = false
|
||||
} = options
|
||||
// 记录分页初始参数
|
||||
const paramsInit: Record<any, any> = Object.assign({}, toRaw(params))
|
||||
@@ -30,8 +32,10 @@ export function usePaging(options: Options) {
|
||||
lists: [] as any[],
|
||||
extend: {} as Record<string, any>
|
||||
})
|
||||
let latestRequestId = 0
|
||||
// 请求分页接口;silent: true 时不改 loading(用于定时静默刷新,避免表格闪 loading)
|
||||
const getLists = (opts?: { silent?: boolean }) => {
|
||||
const requestId = ++latestRequestId
|
||||
const silent = opts?.silent === true
|
||||
if (!silent) {
|
||||
pager.loading = true
|
||||
@@ -43,16 +47,26 @@ export function usePaging(options: Options) {
|
||||
...fixedParams
|
||||
})
|
||||
.then((res: any) => {
|
||||
if (latestOnly && requestId !== latestRequestId) {
|
||||
return Promise.resolve(res)
|
||||
}
|
||||
pager.count = res?.count
|
||||
pager.lists = res?.lists
|
||||
pager.extend = res?.extend
|
||||
return Promise.resolve(res)
|
||||
})
|
||||
.catch((err: any) => {
|
||||
if (latestOnly && requestId !== latestRequestId) {
|
||||
return Promise.resolve(undefined)
|
||||
}
|
||||
return Promise.reject(err)
|
||||
})
|
||||
.finally(() => {
|
||||
if (!silent) {
|
||||
if (latestOnly) {
|
||||
if (requestId === latestRequestId) {
|
||||
pager.loading = false
|
||||
}
|
||||
} else if (!silent) {
|
||||
pager.loading = false
|
||||
}
|
||||
})
|
||||
|
||||
@@ -89,7 +89,7 @@
|
||||
>
|
||||
<div class="slot-time">{{ slot.time }}</div>
|
||||
<div class="slot-status" :class="{ 'status-available': slot.available }">
|
||||
{{ slot.available ? '可约' : '已约' }}
|
||||
{{ slot.available ? '可约' : slot.hasAppointment ? '已约' : '空号' }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -115,6 +115,7 @@ dayjs.extend(isoWeek)
|
||||
interface TimeSlot {
|
||||
time: string
|
||||
available: boolean
|
||||
hasAppointment: boolean
|
||||
quota: number
|
||||
}
|
||||
|
||||
@@ -186,7 +187,7 @@ const filteredTimeSlots = computed(() => {
|
||||
const slotDateTime = dayjs(`${form.date} ${slot.time}`)
|
||||
const isPast = slotDateTime.isBefore(now) || slotDateTime.isSame(now, 'minute')
|
||||
|
||||
// 如果时间已过,标记为不可用
|
||||
// 如果时间已过,标记为不可用;保留原始挂号状态以区分“已约”和“空号”
|
||||
if (isPast) {
|
||||
return {
|
||||
...slot,
|
||||
@@ -315,6 +316,7 @@ const loadTimeSlots = async (silent = false) => {
|
||||
timeSlots.value = (response?.slots || []).map((slot: any) => ({
|
||||
time: slot.time,
|
||||
available: slot.available,
|
||||
hasAppointment: Boolean(slot.has_appointment ?? (slot.available === false)),
|
||||
quota: slot.available ? 1 : 0
|
||||
}))
|
||||
} catch (error) {
|
||||
|
||||
@@ -61,12 +61,23 @@
|
||||
class="channel-select"
|
||||
@change="loadDashboard"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in dashboard.filters.media_channels"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
<el-option-group
|
||||
v-for="group in mediaChannelGroups"
|
||||
:key="group.group_name || '_'"
|
||||
:label="`${group.group_name || '(未分组)'} · ${group.customer_count}`"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in group.channels"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
>
|
||||
<span class="channel-option">
|
||||
<span>{{ item.name }}</span>
|
||||
<span>{{ item.customer_count }} 人</span>
|
||||
</span>
|
||||
</el-option>
|
||||
</el-option-group>
|
||||
</el-select>
|
||||
</div>
|
||||
<span class="range-text">{{ dashboard.meta.start_date }} 至 {{ dashboard.meta.end_date }}</span>
|
||||
@@ -246,6 +257,13 @@ import vCharts from 'vue-echarts'
|
||||
import { firstVisitConversionOverview, type FirstVisitConversionParams } from '@/api/first_visit'
|
||||
|
||||
type MetricType = 'count' | 'money' | 'ratio'
|
||||
type MediaChannelOption = {
|
||||
code: string
|
||||
name: string
|
||||
tag_id?: string
|
||||
group_name?: string
|
||||
customer_count?: number
|
||||
}
|
||||
|
||||
const emptyDashboard = () => ({
|
||||
meta: {
|
||||
@@ -256,7 +274,7 @@ const emptyDashboard = () => ({
|
||||
filters: {
|
||||
departments: [] as any[],
|
||||
assistants: [] as Array<{ id: number; name: string }>,
|
||||
media_channels: [] as Array<{ code: string; name: string }>
|
||||
media_channels: [] as MediaChannelOption[]
|
||||
},
|
||||
summary: {} as Record<string, any>,
|
||||
rankings: { orders: [] as any[], amounts: [] as any[] },
|
||||
@@ -303,6 +321,23 @@ const scopeDescription = computed(() => {
|
||||
if (dashboard.meta.selected_media_channel_name) parts.push(`渠道:${dashboard.meta.selected_media_channel_name}`)
|
||||
return parts.join(' · ')
|
||||
})
|
||||
const mediaChannelGroups = computed(() => {
|
||||
const groups = new Map<string, {
|
||||
group_name: string
|
||||
customer_count: number
|
||||
channels: MediaChannelOption[]
|
||||
}>()
|
||||
for (const channel of dashboard.filters.media_channels) {
|
||||
const groupName = channel.group_name || ''
|
||||
if (!groups.has(groupName)) {
|
||||
groups.set(groupName, { group_name: groupName, customer_count: 0, channels: [] })
|
||||
}
|
||||
const group = groups.get(groupName)!
|
||||
group.channels.push(channel)
|
||||
group.customer_count = Math.max(group.customer_count, Number(channel.customer_count || 0))
|
||||
}
|
||||
return Array.from(groups.values())
|
||||
})
|
||||
const maxOrderValue = computed(() => Math.max(0, ...dashboard.rankings.orders.map(item => Number(item.value || 0))))
|
||||
const maxAmountValue = computed(() => Math.max(0, ...dashboard.rankings.amounts.map(item => Number(item.value || 0))))
|
||||
const targetChartOption = computed(() => ({
|
||||
@@ -318,15 +353,22 @@ const targetChartOption = computed(() => ({
|
||||
]
|
||||
}))
|
||||
|
||||
let latestDashboardRequestId = 0
|
||||
|
||||
async function loadDashboard() {
|
||||
const requestId = ++latestDashboardRequestId
|
||||
loading.value = true
|
||||
try {
|
||||
const result: any = await firstVisitConversionOverview(query)
|
||||
const result: any = await firstVisitConversionOverview({ ...query })
|
||||
if (requestId !== latestDashboardRequestId) return
|
||||
Object.assign(dashboard, emptyDashboard(), result || {})
|
||||
// 服务端会规范化失效渠道;同步真实生效值,避免筛选框与数据口径不一致。
|
||||
query.media_channel_code = dashboard.meta.selected_media_channel_code || ''
|
||||
} catch (error: any) {
|
||||
if (requestId !== latestDashboardRequestId) return
|
||||
ElMessage.error(error?.message || '综合数据加载失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
if (requestId === latestDashboardRequestId) loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
@@ -438,6 +480,18 @@ onMounted(loadDashboard)
|
||||
.employee-select { width: 190px; }
|
||||
.dept-select { width: 220px; }
|
||||
.channel-select { width: 180px; }
|
||||
.channel-option {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
width: 100%;
|
||||
|
||||
span:last-child {
|
||||
color: #98a2b3;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.metric-grid {
|
||||
display: grid;
|
||||
|
||||
@@ -120,7 +120,7 @@
|
||||
<section class="board-section queue-section">
|
||||
<div class="section-heading queue-heading">
|
||||
<div class="heading-copy">
|
||||
<h2>候诊列表</h2>
|
||||
<h2>{{ queueDateLabel }}候诊列表</h2>
|
||||
<span class="heading-badge">按医生排队</span>
|
||||
<span class="queue-count">共 {{ pager.count }} 人</span>
|
||||
</div>
|
||||
@@ -168,7 +168,7 @@
|
||||
</template>
|
||||
</el-table-column>
|
||||
<template #empty>
|
||||
<el-empty description="当前权限范围内今日暂无候诊患者" />
|
||||
<el-empty :description="`当前权限范围内${queueDateLabel}暂无候诊患者`" />
|
||||
</template>
|
||||
</el-table>
|
||||
|
||||
@@ -196,11 +196,12 @@ const formData = reactive({
|
||||
end_date: today
|
||||
})
|
||||
|
||||
const { pager, getLists } = usePaging({
|
||||
const { pager, getLists, resetPage } = usePaging({
|
||||
fetchFun: myPatientProgressLists as any,
|
||||
params: formData,
|
||||
size: 15,
|
||||
firstLoading: true
|
||||
firstLoading: true,
|
||||
latestOnly: true
|
||||
})
|
||||
|
||||
const todayOverview = computed(() => ({
|
||||
@@ -259,6 +260,10 @@ const selectedScheduleLabel = computed(() => {
|
||||
const day = selectedScheduleDay.value
|
||||
return `${day.date_text || ''} ${day.weekday || ''} `
|
||||
})
|
||||
const queueDateLabel = computed(() => {
|
||||
if (selectedScheduleDate.value === today) return '今日'
|
||||
return selectedScheduleLabel.value.trim() || selectedScheduleDate.value
|
||||
})
|
||||
|
||||
const scopeLabel = computed(() => pager.extend?.scope?.label || '按权限加载')
|
||||
const scheduleRange = computed(() => {
|
||||
@@ -274,7 +279,11 @@ function refreshPanel(options?: { silent?: boolean }) {
|
||||
}
|
||||
|
||||
function selectScheduleDay(date: string) {
|
||||
if (!date) return
|
||||
selectedScheduleDate.value = date
|
||||
formData.start_date = date
|
||||
formData.end_date = date
|
||||
resetPage()
|
||||
}
|
||||
|
||||
function doctorWindows(doctor: Record<string, any>) {
|
||||
|
||||
@@ -0,0 +1,147 @@
|
||||
export const WECOM_WIDGET_TEMPLATE_IDS = [
|
||||
'bubble',
|
||||
'pill',
|
||||
'card',
|
||||
'message',
|
||||
'edge',
|
||||
'bar'
|
||||
] as const
|
||||
|
||||
export type WecomWidgetTemplateId = (typeof WECOM_WIDGET_TEMPLATE_IDS)[number]
|
||||
export type WecomWidgetPosition = 'bottom-right' | 'bottom-left'
|
||||
|
||||
export interface WecomWidgetConfig {
|
||||
v: 1
|
||||
enabled: boolean
|
||||
template: WecomWidgetTemplateId
|
||||
position: WecomWidgetPosition
|
||||
title: string
|
||||
subtitle: string
|
||||
button_text: string
|
||||
primary_color: string
|
||||
bottom_offset: number
|
||||
show_mobile: boolean
|
||||
}
|
||||
|
||||
export interface WecomWidgetTemplateOption {
|
||||
id: WecomWidgetTemplateId
|
||||
name: string
|
||||
description: string
|
||||
scene: string
|
||||
}
|
||||
|
||||
export const DEFAULT_WECOM_WIDGET_CONFIG: Readonly<WecomWidgetConfig> = Object.freeze({
|
||||
v: 1,
|
||||
enabled: false,
|
||||
template: 'bubble',
|
||||
position: 'bottom-right',
|
||||
title: '专属顾问在线',
|
||||
subtitle: '点击添加企业微信,获取一对一服务',
|
||||
button_text: '立即咨询',
|
||||
primary_color: '#139A8C',
|
||||
bottom_offset: 28,
|
||||
show_mobile: true
|
||||
})
|
||||
|
||||
export const WECOM_WIDGET_TEMPLATES: ReadonlyArray<WecomWidgetTemplateOption> = Object.freeze([
|
||||
{
|
||||
id: 'bubble',
|
||||
name: '轻巧气泡',
|
||||
description: '圆形入口,占用空间最少',
|
||||
scene: '内容型页面'
|
||||
},
|
||||
{
|
||||
id: 'pill',
|
||||
name: '行动胶囊',
|
||||
description: '图标与按钮文案同时露出',
|
||||
scene: '营销落地页'
|
||||
},
|
||||
{
|
||||
id: 'card',
|
||||
name: '顾问名片',
|
||||
description: '完整呈现标题、说明与行动按钮',
|
||||
scene: '高意向咨询'
|
||||
},
|
||||
{
|
||||
id: 'message',
|
||||
name: '消息提醒',
|
||||
description: '模拟新消息,视觉提醒更明确',
|
||||
scene: '活动推广页'
|
||||
},
|
||||
{
|
||||
id: 'edge',
|
||||
name: '贴边咨询',
|
||||
description: '沿浏览器边缘停靠,干扰更低',
|
||||
scene: '工具与内容页'
|
||||
},
|
||||
{
|
||||
id: 'bar',
|
||||
name: '底部咨询条',
|
||||
description: '宽幅行动区,移动端更醒目',
|
||||
scene: '移动端页面'
|
||||
}
|
||||
])
|
||||
|
||||
const TEMPLATE_SET = new Set<string>(WECOM_WIDGET_TEMPLATE_IDS)
|
||||
const POSITION_SET = new Set<string>(['bottom-right', 'bottom-left'])
|
||||
const HEX_COLOR_PATTERN = /^#[0-9A-F]{6}$/i
|
||||
|
||||
function asRecord(value: unknown): Record<string, unknown> {
|
||||
if (value && typeof value === 'object' && !Array.isArray(value)) {
|
||||
return value as Record<string, unknown>
|
||||
}
|
||||
if (typeof value !== 'string' || !value.trim()) return {}
|
||||
try {
|
||||
const parsed: unknown = JSON.parse(value)
|
||||
return parsed && typeof parsed === 'object' && !Array.isArray(parsed)
|
||||
? parsed as Record<string, unknown>
|
||||
: {}
|
||||
} catch {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
|
||||
function normalizeBoolean(value: unknown, fallback: boolean): boolean {
|
||||
if (value === true || value === 1 || value === '1' || value === 'true') return true
|
||||
if (value === false || value === 0 || value === '0' || value === 'false') return false
|
||||
return fallback
|
||||
}
|
||||
|
||||
function normalizeText(value: unknown, fallback: string, maxLength: number): string {
|
||||
if (value === undefined || value === null) return fallback
|
||||
return Array.from(String(value).trim()).slice(0, maxLength).join('')
|
||||
}
|
||||
|
||||
export function normalizeWecomWidgetConfig(value: unknown): WecomWidgetConfig {
|
||||
const source = asRecord(value)
|
||||
const template = String(source.template || '')
|
||||
const position = String(source.position || '')
|
||||
const color = String(source.primary_color || '').trim().toUpperCase()
|
||||
const rawOffset = Number(source.bottom_offset)
|
||||
const bottomOffset = Number.isFinite(rawOffset)
|
||||
? Math.min(160, Math.max(16, Math.round(rawOffset)))
|
||||
: DEFAULT_WECOM_WIDGET_CONFIG.bottom_offset
|
||||
|
||||
return {
|
||||
v: 1,
|
||||
enabled: normalizeBoolean(source.enabled, DEFAULT_WECOM_WIDGET_CONFIG.enabled),
|
||||
template: TEMPLATE_SET.has(template)
|
||||
? template as WecomWidgetTemplateId
|
||||
: DEFAULT_WECOM_WIDGET_CONFIG.template,
|
||||
position: POSITION_SET.has(position)
|
||||
? position as WecomWidgetPosition
|
||||
: DEFAULT_WECOM_WIDGET_CONFIG.position,
|
||||
title: normalizeText(source.title, DEFAULT_WECOM_WIDGET_CONFIG.title, 24),
|
||||
subtitle: normalizeText(source.subtitle, DEFAULT_WECOM_WIDGET_CONFIG.subtitle, 48),
|
||||
button_text: normalizeText(source.button_text, DEFAULT_WECOM_WIDGET_CONFIG.button_text, 12),
|
||||
primary_color: HEX_COLOR_PATTERN.test(color)
|
||||
? color
|
||||
: DEFAULT_WECOM_WIDGET_CONFIG.primary_color,
|
||||
bottom_offset: bottomOffset,
|
||||
show_mobile: normalizeBoolean(source.show_mobile, DEFAULT_WECOM_WIDGET_CONFIG.show_mobile)
|
||||
}
|
||||
}
|
||||
|
||||
export function cloneDefaultWecomWidgetConfig(): WecomWidgetConfig {
|
||||
return { ...DEFAULT_WECOM_WIDGET_CONFIG }
|
||||
}
|
||||
@@ -323,39 +323,20 @@
|
||||
<div v-else class="tab-content install-tab">
|
||||
<div class="section-heading">
|
||||
<div>
|
||||
<h2>安装 JS 到推广落地页</h2>
|
||||
<p>基础脚本只负责捕获点击并请求服务端分流,不携带授权凭证,也不在浏览器中计算随机规则。</p>
|
||||
<h2>安装 JS 与浮窗客服</h2>
|
||||
<p>为每个分流方案配置独立浮窗;基础脚本仍只负责展示入口、捕获点击并请求服务端分流。</p>
|
||||
</div>
|
||||
<el-select v-model="selectedInstallPoolId" placeholder="选择分流方案" class="install-pool-select">
|
||||
<el-option v-for="pool in overview.pools" :key="pool.id" :label="pool.name" :value="Number(pool.id)" />
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<template v-if="selectedInstallPool">
|
||||
<div class="install-grid">
|
||||
<article class="code-card">
|
||||
<div class="code-heading"><span>1</span><div><strong>安装基础脚本</strong><p>放在页面 <code></head></code> 标签之前,只需安装一次。</p></div></div>
|
||||
<pre><code>{{ selectedInstallPool.install_code }}</code></pre>
|
||||
<el-button type="primary" plain :icon="DocumentCopy" @click="copyText(selectedInstallPool.install_code, '基础脚本')">复制代码</el-button>
|
||||
</article>
|
||||
<article class="code-card">
|
||||
<div class="code-heading"><span>2</span><div><strong>标记点击元素</strong><p>按钮、图片或文字链接都可以使用同一个数据属性。</p></div></div>
|
||||
<pre><code>{{ selectedInstallPool.trigger_code }}</code></pre>
|
||||
<el-button type="primary" plain :icon="DocumentCopy" @click="copyText(selectedInstallPool.trigger_code, '点击元素代码')">复制代码</el-button>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<div class="rule-panel">
|
||||
<div><el-icon><Select /></el-icon><span><strong>可用性筛选</strong>自动排除停用、超出时间段和达到每日上限的链接。</span></div>
|
||||
<div><el-icon><Opportunity /></el-icon><span><strong>权重随机</strong>权重越高,被选中的概率越大;没有可用链接时才使用兜底链接。</span></div>
|
||||
<div><el-icon><View /></el-icon><span><strong>隐私与安全</strong>前端看不到完整链接池;访问 IP 只保存带服务端密钥的不可逆哈希。</span></div>
|
||||
</div>
|
||||
|
||||
<div class="test-row">
|
||||
<div><strong>分流测试</strong><p>每次打开都会执行与线上相同的筛选和随机规则,并计入点击数据。</p></div>
|
||||
<el-button type="primary" :icon="TopRight" @click="openTestLink">打开测试链接</el-button>
|
||||
</div>
|
||||
</template>
|
||||
<WecomFloatingWidgetBuilder
|
||||
v-if="selectedInstallPool"
|
||||
:key="Number(selectedInstallPool.id)"
|
||||
:pool="selectedInstallPool"
|
||||
@saved="handleWidgetSaved"
|
||||
/>
|
||||
<el-empty v-else description="请先创建分流方案,系统会自动生成 JS 安装代码" />
|
||||
</div>
|
||||
</section>
|
||||
@@ -412,8 +393,8 @@ import { computed, onMounted, reactive, ref, watch } from 'vue'
|
||||
import { ElMessage, ElMessageBox } from 'element-plus'
|
||||
import {
|
||||
ArrowDown, ArrowRight, ChatDotRound, CircleCheck, Connection, DataAnalysis, Delete,
|
||||
DocumentCopy, Edit, Key, Link, Lock, Mouse, OfficeBuilding, Opportunity, Plus,
|
||||
Promotion, Refresh, Search, Select, SetUp, TopRight, User, View, Warning
|
||||
DocumentCopy, Edit, Key, Link, Lock, Mouse, OfficeBuilding, Plus,
|
||||
Promotion, Refresh, Search, SetUp, User, Warning
|
||||
} from '@element-plus/icons-vue'
|
||||
import {
|
||||
wecomPromotionCheckApiPermission,
|
||||
@@ -431,10 +412,12 @@ import {
|
||||
} from '@/api/first_visit'
|
||||
import type { WecomPromotionCustomerChatStatus } from '@/api/first_visit'
|
||||
|
||||
import WecomFloatingWidgetBuilder from './components/WecomFloatingWidgetBuilder.vue'
|
||||
|
||||
type TabName = 'links' | 'customer-stats' | 'configuration' | 'install'
|
||||
const emptyOverview = () => ({
|
||||
meta: { scope_label: '', generated_at: '' },
|
||||
config: { mode: 'internal', configured: false, ready: false, missing: [] as string[], corp_id_masked: '', agent_id: '', secret_configured: false, official_doc: '' },
|
||||
config: { mode: 'internal', configured: false, ready: false, missing: [] as string[], corp_id_masked: '', agent_id: '', secret_configured: false, callback_ready: false, callback_url: '', official_doc: '' },
|
||||
summary: { configured_apps: 0, pool_count: 0, online_links: 0, today_clicks: 0 },
|
||||
pools: [] as any[], links: [] as any[], member_options: [] as any[], customer_acquisition_link_example: 'https://work.weixin.qq.com/ca/xxxxxxxx'
|
||||
})
|
||||
@@ -930,8 +913,8 @@ async function copyText(value: string, label: string) {
|
||||
ElMessage.success(`${label}已复制`)
|
||||
}
|
||||
|
||||
function openTestLink() {
|
||||
if (selectedInstallPool.value?.go_url) window.open(selectedInstallPool.value.go_url, '_blank', 'noopener,noreferrer')
|
||||
async function handleWidgetSaved() {
|
||||
await loadOverview()
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
@@ -998,10 +981,8 @@ h1, h2, h3, p { margin: 0; }
|
||||
.missing-fields { margin-top: 12px; color: #9c651f; font-size: 11px; }.missing-fields code { margin-left: 6px; padding: 3px 6px; border-radius: 4px; background: rgba(224,153,63,.11); }
|
||||
.callback-list { margin: 14px 0 0; border-top: 1px solid rgba(124,150,157,.16); }.callback-list > div { display: grid; grid-template-columns: 120px 1fr 50px; align-items: center; min-height: 40px; border-bottom: 1px solid rgba(124,150,157,.12); font-size: 11px; }.callback-list dt { color: #657488; }.callback-list dd { overflow: hidden; margin: 0; color: #27374c; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; text-overflow: ellipsis; white-space: nowrap; }.callback-list button { border: 0; color: #148f83; background: transparent; cursor: pointer; }
|
||||
.configuration-actions { display: flex; align-items: center; gap: 14px; margin-top: 16px; }
|
||||
.install-pool-select { width: 220px; }.install-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }.code-card { min-width: 0; padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: #fbfcfd; }.code-heading { display: flex; align-items: center; gap: 10px; }.code-heading > span { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; border-radius: 8px; color: #fff; background: var(--teal); font-weight: 700; }.code-heading strong { font-size: 13px; }.code-heading p { margin-top: 3px; color: #7a889a; font-size: 10px; }.code-card pre { min-height: 92px; margin: 14px 0; padding: 13px; overflow: auto; border-radius: 7px; color: #cbe9e6; background: #172a36; white-space: pre-wrap; word-break: break-all; }.code-card pre code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 11px; line-height: 1.7; }
|
||||
.rule-panel { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; margin-top: 14px; }.rule-panel > div { display: flex; align-items: flex-start; gap: 9px; min-height: 68px; padding: 12px; border-radius: 9px; color: #69788b; background: #f3f7f8; font-size: 11px; line-height: 1.65; }.rule-panel .el-icon { margin-top: 2px; color: var(--teal); font-size: 17px; }.rule-panel strong { display: block; color: #26364a; }
|
||||
.test-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 14px; padding: 14px 16px; border: 1px dashed #b8d9d4; border-radius: 9px; background: #f7fcfb; }.test-row strong { font-size: 13px; }.test-row p { margin-top: 4px; color: #7c8999; font-size: 10px; }
|
||||
.install-pool-select { width: 220px; }
|
||||
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }.form-tip { display: block; margin-top: 5px; color: #8b97a6; font-size: 10px; }.link-form .el-select, .link-form .el-input-number { width: 100%; }
|
||||
@media (max-width: 1100px) { .heading-actions { flex-wrap: wrap; justify-content: flex-end; }.metric-grid, .customer-metric-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }.pool-layout { grid-template-columns: 210px minmax(0,1fr); }.pool-toolbar { align-items: flex-start; flex-direction: column; }.rule-panel { grid-template-columns: 1fr; } }
|
||||
@media (max-width: 760px) { .promotion-page { padding: 10px; }.page-header, .section-heading { align-items: flex-start; flex-direction: column; }.update-time { display: none; }.metric-grid, .customer-metric-grid, .install-grid, .form-grid { grid-template-columns: 1fr; }.tab-nav { overflow-x: auto; }.tab-nav button { min-width: 112px; }.tab-content { padding: 14px; }.pool-layout { grid-template-columns: 1fr; }.pool-sidebar { display: flex; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--line); }.pool-item { min-width: 190px; }.callback-list > div { grid-template-columns: 1fr 48px; padding: 8px 0; }.callback-list dt { grid-column: 1 / -1; }.install-pool-select { width: 100%; }.customer-heading-actions { width: 100%; justify-content: flex-end; }.customer-filter-bar :deep(.el-form-item) { width: 100%; margin-right: 0; }.customer-filter-bar :deep(.el-form-item__content), .customer-filter-bar .el-select { width: 100%; }.customer-filter-bar .filter-actions :deep(.el-form-item__content) { justify-content: flex-end; }.customer-pagination { align-items: flex-start; flex-direction: column; }.customer-pagination :deep(.el-pagination) { max-width: 100%; flex-wrap: wrap; justify-content: flex-start; } }
|
||||
@media (max-width: 1100px) { .heading-actions { flex-wrap: wrap; justify-content: flex-end; }.metric-grid, .customer-metric-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }.pool-layout { grid-template-columns: 210px minmax(0,1fr); }.pool-toolbar { align-items: flex-start; flex-direction: column; } }
|
||||
@media (max-width: 760px) { .promotion-page { padding: 10px; }.page-header, .section-heading { align-items: flex-start; flex-direction: column; }.update-time { display: none; }.metric-grid, .customer-metric-grid, .form-grid { grid-template-columns: 1fr; }.tab-nav { overflow-x: auto; }.tab-nav button { min-width: 112px; }.tab-content { padding: 14px; }.pool-layout { grid-template-columns: 1fr; }.pool-sidebar { display: flex; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--line); }.pool-item { min-width: 190px; }.callback-list > div { grid-template-columns: 1fr 48px; padding: 8px 0; }.callback-list dt { grid-column: 1 / -1; }.install-pool-select { width: 100%; }.customer-heading-actions { width: 100%; justify-content: flex-end; }.customer-filter-bar :deep(.el-form-item) { width: 100%; margin-right: 0; }.customer-filter-bar :deep(.el-form-item__content), .customer-filter-bar .el-select { width: 100%; }.customer-filter-bar .filter-actions :deep(.el-form-item__content) { justify-content: flex-end; }.customer-pagination { align-items: flex-start; flex-direction: column; }.customer-pagination :deep(.el-pagination) { max-width: 100%; flex-wrap: wrap; justify-content: flex-start; } }
|
||||
</style>
|
||||
|
||||
@@ -181,7 +181,7 @@
|
||||
<div class="ranking-main">
|
||||
<div class="ranking-copy">
|
||||
<strong>{{ item.name || '未命名成员' }}</strong>
|
||||
<span>{{ formatNumber(item.count) }} 笔挂号</span>
|
||||
<span>{{ formatNumber(item.count) }} 挂号</span>
|
||||
</div>
|
||||
<div class="ranking-meter" aria-hidden="true">
|
||||
<span :style="{ width: rankingWidth(item.count, appointmentRankingMax) }" />
|
||||
@@ -482,7 +482,7 @@ const todayMetrics = computed(() => [
|
||||
{
|
||||
key: 'lowAmountPayments',
|
||||
label: '今日挂号',
|
||||
value: `${formatNumber(dashboard.today.low_amount_payment_count)} 笔`,
|
||||
value: `${formatNumber(dashboard.today.low_amount_payment_count)} `,
|
||||
hint: '已支付且实收金额大于 0、低于 10 元的订单',
|
||||
comparisons: [dashboard.today.comparisons.low_amount_payment_count],
|
||||
},
|
||||
@@ -535,7 +535,7 @@ const currentDate = computed(() => new Intl.DateTimeFormat('zh-CN', {
|
||||
|
||||
const appointmentRankingSubtitle = computed(() => {
|
||||
const actor = dashboard.rankings.appointments.kind === 'doctor' ? '医生' : '成员'
|
||||
return `${dashboard.rankings.appointments.scope_label}内${actor}已支付且实收低于 10 元的订单笔数`
|
||||
return `${dashboard.rankings.appointments.scope_label}内${actor}已支付且实收低于 10 元的订单数`
|
||||
})
|
||||
|
||||
const appointmentRankingMax = computed(() => Math.max(
|
||||
|
||||
@@ -0,0 +1,25 @@
|
||||
# 此文件是源码开发/企业部署模板,不会被复制进发布 ZIP/.app。
|
||||
# 生产配置应由受控启动器、设备管理或进程环境注入;禁止把密码、token、
|
||||
# UserSig、TRTC SecretKey 或其他长期凭据写进本文件或发布包。
|
||||
|
||||
# 后端根地址。程序会自动追加 /adminapi;也可直接填写以 /adminapi 结尾的地址。
|
||||
DOCTOR_API_BASE_URL=https://api.example.com
|
||||
|
||||
# 首次验收可设为 true,使用内置演示数据;生产必须设为 false。
|
||||
DOCTOR_DEMO_MODE=true
|
||||
|
||||
# 当前只支持 embedded。browser 在后端提供一次性 handoff 前会被明确拒绝,且不会自动打开系统浏览器。
|
||||
DOCTOR_VIDEO_MODE=embedded
|
||||
# 可选:本地 dist 缺失时由 QtWebEngine 内嵌加载的可信 HTTPS 页面;不是 browser handoff URL,禁止携带 UserSig。
|
||||
DOCTOR_VIDEO_WEB_URL=
|
||||
|
||||
# 生产环境必须保持 true。仅内网自签证书调试时临时关闭。
|
||||
DOCTOR_VERIFY_SSL=true
|
||||
DOCTOR_REQUEST_TIMEOUT=30
|
||||
|
||||
# 日志级别:DEBUG / INFO / WARNING / ERROR。日志会自动脱敏 token 与 UserSig。
|
||||
DOCTOR_LOG_LEVEL=INFO
|
||||
|
||||
# 可选:仅供企业部署/自动化验收隔离用户数据目录。
|
||||
# DOCTOR_CONFIG_DIR=
|
||||
# DOCTOR_LOG_DIR=
|
||||
@@ -0,0 +1,23 @@
|
||||
.env
|
||||
.venv/
|
||||
.venv-build/
|
||||
.uv-cache/
|
||||
.uv-python/
|
||||
__pycache__/
|
||||
*.py[cod]
|
||||
.pytest_cache/
|
||||
.pytest-tmp-*/
|
||||
artifacts/pytest_*/
|
||||
.ruff_cache/
|
||||
.coverage
|
||||
htmlcov/
|
||||
build/
|
||||
dist/
|
||||
!video_companion/dist/
|
||||
!video_companion/dist/**
|
||||
*.spec.bak
|
||||
node_modules/
|
||||
video_companion/node_modules/
|
||||
*.log
|
||||
.DS_Store
|
||||
Thumbs.db
|
||||
@@ -0,0 +1,22 @@
|
||||
@echo off
|
||||
setlocal EnableExtensions DisableDelayedExpansion
|
||||
set "PROJECT_ROOT=%~dp0"
|
||||
set "POWERSHELL_EXE=%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe"
|
||||
|
||||
"%POWERSHELL_EXE%" -NoLogo -NoProfile -ExecutionPolicy Bypass -File "%PROJECT_ROOT%scripts\package_windows.ps1" %*
|
||||
set "RESULT=%ERRORLEVEL%"
|
||||
|
||||
if "%RESULT%"=="0" (
|
||||
echo.
|
||||
echo Package ready in: %PROJECT_ROOT%dist
|
||||
if /I not "%~1"=="-ValidateOnly" (
|
||||
start "" "%SystemRoot%\explorer.exe" "%PROJECT_ROOT%dist"
|
||||
)
|
||||
) else (
|
||||
echo.
|
||||
echo DoctorWorkstation packaging failed. Exit code: %RESULT%
|
||||
echo Press any key to close this window.
|
||||
pause >nul
|
||||
)
|
||||
|
||||
endlocal & exit /b %RESULT%
|
||||
@@ -0,0 +1,132 @@
|
||||
# 臻阳堂医生工作站
|
||||
|
||||
一个以 Python + PySide6 编写的跨平台医生桌面端,面向 Windows 10/11 与 macOS 13+。项目按现有 `admin` 源码的真实接口契约实现,覆盖登录、接诊台、我的处方库、已开处方、患者列表、问诊列表和腾讯云视频面诊。
|
||||
|
||||
> 当前版本提供完整的演示数据模式,便于在没有后端账号或腾讯云配置时验收界面与流程。切换到生产模式后,数据与权限均由现有后端返回。
|
||||
|
||||
## 一键运行与一键打包
|
||||
|
||||
Windows 直接在项目根目录双击:
|
||||
|
||||
- `一键运行_医生工作站.bat`:优先启动现有成品;没有成品时自动使用 `uv` 准备源码环境并运行。
|
||||
- `一键打包_医生工作站.bat`:自动同步锁定的 Python/Node 依赖,检查冻结 QtWebEngine/QtMultimedia 文件,执行应用与媒体离屏冒烟验证,最后生成 `dist/DoctorWorkstation-Windows-x64-<版本>.zip` 和 SHA-256 文件。
|
||||
|
||||
英文稳定别名分别是 `Run_DoctorWorkstation.bat` 和 `Build_DoctorWorkstation.bat`。分发 ZIP 解压后,可直接双击其中的 `Start_DoctorWorkstation.bat`。
|
||||
|
||||
macOS 在 Finder 中双击:
|
||||
|
||||
- `一键运行.command`:优先打开现有 `DoctorWorkstation.app`,否则自动准备源码环境并运行。
|
||||
- `一键打包.command`:构建、QtWebEngine/QtMultimedia 文件门禁、签名检查和两项冻结冒烟验证后,生成 `.app`、可分发 ZIP 及 SHA-256 文件。
|
||||
|
||||
Windows 打包机需预先安装 `uv` 与 Node.js 20+;脚本会自动处理项目虚拟环境和锁定依赖。首次打包需要联网下载依赖,之后会复用本机缓存。macOS 发布源码中的根 `.command` 与操作型 `scripts/*.sh` 必须以 Git mode `100755` 跟踪;源码压缩包在传输中丢失权限时,可在项目目录执行一次 `chmod +x *.command scripts/*.sh`。若 Gatekeeper 拦截未签名内部测试版,请使用右键“打开”。
|
||||
|
||||
## 已实现范围
|
||||
|
||||
- 账号密码登录、token 会话、记住账号(不保存密码)和退出登录。
|
||||
- 登录后读取 `/adminapi/auth.admin/mySelf`,按 `permissions` 动态控制页面和操作按钮;`*` 超级权限兼容现有后台。
|
||||
- 接诊台:今日待接诊/已过号、患者详情、医生备注、通知医助、完成接诊、发起视频面诊。
|
||||
- 我的处方库:主方/辅方与公开范围筛选,药材动态编辑,模板所有权和增删改权限。
|
||||
- 已开处方:处方号/患者/审核状态筛选、状态展示和只读详情。
|
||||
- 患者列表:复用 `/firstvisit.myPatient/lists` 的服务端数据范围,不在客户端伪造医生或部门过滤。
|
||||
- 问诊列表:按日期、状态和患者筛选,支持从有效预约发起视频。
|
||||
- 腾讯视频:沿用现有项目的 `@trtc/calls-uikit-vue` 主链;UserSig 只从后端短时获取,客户端不包含 SDKSecretKey。当前仅支持隔离的 QtWebEngine 内嵌模式。
|
||||
- PyInstaller Windows/macOS 构建脚本、macOS 摄像头/麦克风权限配置与自动化测试。
|
||||
|
||||
## 手动运行
|
||||
|
||||
先安装 [uv](https://docs.astral.sh/uv/),然后在项目根目录执行:
|
||||
|
||||
```powershell
|
||||
uv sync --extra dev --extra build
|
||||
Copy-Item .env.example .env
|
||||
uv run doctor-workstation
|
||||
```
|
||||
|
||||
macOS/Linux:
|
||||
|
||||
```bash
|
||||
uv sync --extra dev --extra build
|
||||
cp .env.example .env
|
||||
uv run doctor-workstation
|
||||
```
|
||||
|
||||
`.env.example` 默认启用演示模式。演示账号:`doctor`,密码:`doctor123`。
|
||||
|
||||
`.env.example` 仅作为源码开发/企业部署模板,不会复制进发布 ZIP 或 `.app`。生产环境请通过受控启动器、设备管理或进程环境注入配置;不要把密码、token、UserSig、TRTC SecretKey 等凭据放进 `.env` 或发布包。
|
||||
|
||||
## 连接现有后端
|
||||
|
||||
将 `.env` 调整为:
|
||||
|
||||
```dotenv
|
||||
DOCTOR_API_BASE_URL=https://your-api.example.com
|
||||
DOCTOR_DEMO_MODE=false
|
||||
DOCTOR_VERIFY_SSL=true
|
||||
```
|
||||
|
||||
程序会自动在地址末尾追加 `/adminapi`。它与现有管理端保持相同约定:
|
||||
|
||||
- 登录:`POST /login/account`,请求包含 `account`、`password`、`terminal=1`。
|
||||
- 鉴权请求头:`token: <登录 token>`,`version: 1.9.4`。
|
||||
- 响应 envelope:`code=1` 成功、`0` 业务失败、`-1` 登录失效、`10` 需绑定企业微信。
|
||||
- 权限与数据范围:完全以后端 `/auth.admin/mySelf` 返回为准。
|
||||
|
||||
环境配置不会保存密码、TRTC SecretKey 或腾讯云长期凭据。登录 token 优先存入系统凭据库;无法使用时仅回退到用户配置目录中的受限文件。
|
||||
|
||||
## 视频伴随页
|
||||
|
||||
腾讯云没有官方 Python/PySide6 客户端 SDK。本项目因此采用 Python 业务主程序 + 腾讯官方 Web TUICallKit 伴随页:
|
||||
|
||||
```powershell
|
||||
Set-Location video_companion
|
||||
npm ci
|
||||
npm run build
|
||||
```
|
||||
|
||||
构建输出位于 `video_companion/dist`,由桌面端内嵌加载。生产 UserSig 必须由现有 `/tcm.diagnosis/getCallSignature` 接口签发;不要把 SDKSecretKey 写入 `.env` 或 JavaScript。
|
||||
|
||||
当前仅支持 `embedded`。在业务后端提供服务端签发、一次性消费的 browser handoff 之前,`browser` 模式会被明确拒绝,QtWebEngine 不可用时也不会自动打开系统浏览器。这样可以避免后端已记录 `startCall`、浏览器页面却没有通话票据的“幽灵通话”。
|
||||
|
||||
```dotenv
|
||||
DOCTOR_VIDEO_MODE=embedded
|
||||
DOCTOR_VIDEO_WEB_URL=https://rtc.example.com/doctor-call
|
||||
```
|
||||
|
||||
`DOCTOR_VIDEO_WEB_URL` 仅用于本地 `dist` 缺失时,在 QtWebEngine 中内嵌加载受信任的 HTTPS 主文档;它不是 browser handoff URL,也不得在 URL 中携带 UserSig 或其他 RTC 凭据。
|
||||
|
||||
## 测试与打包
|
||||
|
||||
```powershell
|
||||
uv run pytest
|
||||
uv run ruff check src tests
|
||||
.\scripts\build_windows.ps1
|
||||
```
|
||||
|
||||
`build_windows.ps1` 只生成并验证 onedir;正式一键发布请运行 `Build_DoctorWorkstation.bat`,它在所有冻结文件/媒体门禁通过后再生成版本 ZIP 与 SHA-256。
|
||||
|
||||
macOS 必须在 macOS 机器上构建、签名和公证:
|
||||
|
||||
```bash
|
||||
./scripts/build_macos.sh
|
||||
```
|
||||
|
||||
`build_macos.sh` 只生成并验证 `.app`;正式一键发布请双击 `一键打包.command`(或 `package_macos.command`),通过相同门禁后再归档并生成 SHA-256。
|
||||
|
||||
Windows 与 macOS 的 Qt/媒体权限和签名产物不能交叉编译。首次生产发布前,应按 [research/tencent_rtc.md](research/tencent_rtc.md) 的准入清单完成摄像头、麦克风、设备插拔、休眠恢复和弱网实测。
|
||||
|
||||
## 工程结构
|
||||
|
||||
```text
|
||||
src/doctor_workstation/
|
||||
core/ 业务模型、权限、会话与异常
|
||||
services/ HTTP 客户端、远程仓库、演示仓库与安全 token 存储
|
||||
ui/ PySide6 登录、主框架、页面和对话框
|
||||
video/ 视频请求规范化、异步生命周期与隔离的内嵌窗口
|
||||
video_companion/ 腾讯 TUICallKit 页面
|
||||
packaging/ PyInstaller 与 macOS 权限配置
|
||||
scripts/ Windows/macOS 构建脚本
|
||||
tests/ 不依赖真实后端和腾讯云的自动化测试
|
||||
research/ admin 源码审计、架构和腾讯 RTC 官方资料研究
|
||||
```
|
||||
|
||||
详细的接口/字段与权限审计见 [research/admin_audit.md](research/admin_audit.md)。
|
||||
@@ -0,0 +1,16 @@
|
||||
@echo off
|
||||
setlocal EnableExtensions DisableDelayedExpansion
|
||||
set "PROJECT_ROOT=%~dp0"
|
||||
set "POWERSHELL_EXE=%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe"
|
||||
|
||||
"%POWERSHELL_EXE%" -NoLogo -NoProfile -ExecutionPolicy Bypass -File "%PROJECT_ROOT%scripts\run_windows.ps1" %*
|
||||
set "RESULT=%ERRORLEVEL%"
|
||||
|
||||
if not "%RESULT%"=="0" (
|
||||
echo.
|
||||
echo DoctorWorkstation failed to start. Exit code: %RESULT%
|
||||
echo Press any key to close this window.
|
||||
pause >nul
|
||||
)
|
||||
|
||||
endlocal & exit /b %RESULT%
|
||||
@@ -0,0 +1,14 @@
|
||||
# 安全与隐私约束
|
||||
|
||||
医生工作台会处理患者身份、病历、处方和音视频等敏感信息。生产部署必须遵守以下基线:
|
||||
|
||||
- 客户端不包含腾讯云 `SDKSecretKey`、COS Secret 或后端数据库凭据。TRTC `UserSig` 由服务端按当前医生和单次通话短时签发。
|
||||
- 不在 URL 查询参数、命令行或日志中传递 token、UserSig、患者身份证号和完整病历。项目日志过滤器会遮蔽常见凭据,但调用代码仍应避免记录完整请求/响应。
|
||||
- 密码从不落盘;“记住账号”只保存账号。登录 token 优先写入 Windows Credential Manager / macOS Keychain。
|
||||
- 生产 API 与浏览器视频页必须使用 HTTPS 并验证证书。`DOCTOR_VERIFY_SSL=false` 只允许在受控开发环境临时使用。
|
||||
- 页面可见性与按钮权限来自 `/auth.admin/mySelf`,但客户端权限仅用于界面体验;服务端仍必须对每个接口执行身份、租户、数据范围和动作权限校验。
|
||||
- 本地不缓存患者列表、病历、处方和通话票据。演示数据是完全虚构的静态数据。
|
||||
- 通话录制、截图和报告上传属于单独的合规能力;启用前必须确认患者告知/同意、留存周期、访问审计和删除流程。
|
||||
- 软件发布必须签名。Windows 建议 Authenticode;macOS 需要 Developer ID、Hardened Runtime、摄像头/麦克风用途说明与公证。
|
||||
|
||||
发现凭据泄露、越权、患者数据写入日志或视频房间被未授权加入时,应立即停用相关凭据、保留审计证据并按组织的安全响应流程处置。
|
||||
|
After Width: | Height: | Size: 70 KiB |
|
After Width: | Height: | Size: 85 KiB |
|
After Width: | Height: | Size: 69 KiB |
|
After Width: | Height: | Size: 70 KiB |
|
After Width: | Height: | Size: 77 KiB |
|
After Width: | Height: | Size: 86 KiB |
|
After Width: | Height: | Size: 38 KiB |
|
After Width: | Height: | Size: 36 KiB |
|
After Width: | Height: | Size: 96 KiB |
|
After Width: | Height: | Size: 192 KiB |
|
After Width: | Height: | Size: 138 KiB |
|
After Width: | Height: | Size: 90 KiB |
|
After Width: | Height: | Size: 52 KiB |
|
After Width: | Height: | Size: 69 KiB |
|
After Width: | Height: | Size: 37 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 146 KiB |
|
After Width: | Height: | Size: 152 KiB |
|
After Width: | Height: | Size: 71 KiB |
|
After Width: | Height: | Size: 146 KiB |
|
After Width: | Height: | Size: 133 KiB |
|
After Width: | Height: | Size: 102 KiB |
|
After Width: | Height: | Size: 130 KiB |
|
After Width: | Height: | Size: 149 KiB |
|
After Width: | Height: | Size: 130 KiB |
|
After Width: | Height: | Size: 66 KiB |
|
After Width: | Height: | Size: 106 KiB |
|
After Width: | Height: | Size: 70 KiB |
|
After Width: | Height: | Size: 83 KiB |
|
After Width: | Height: | Size: 63 KiB |
|
After Width: | Height: | Size: 50 KiB |
|
After Width: | Height: | Size: 39 KiB |
|
After Width: | Height: | Size: 47 KiB |
|
After Width: | Height: | Size: 36 KiB |
|
After Width: | Height: | Size: 57 KiB |
|
After Width: | Height: | Size: 52 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 37 KiB |
|
After Width: | Height: | Size: 71 KiB |
|
After Width: | Height: | Size: 71 KiB |
|
After Width: | Height: | Size: 34 KiB |
|
After Width: | Height: | Size: 50 KiB |
|
After Width: | Height: | Size: 58 KiB |
|
After Width: | Height: | Size: 66 KiB |
|
After Width: | Height: | Size: 58 KiB |
|
After Width: | Height: | Size: 57 KiB |
|
After Width: | Height: | Size: 49 KiB |
|
After Width: | Height: | Size: 62 KiB |
|
After Width: | Height: | Size: 53 KiB |
|
After Width: | Height: | Size: 52 KiB |
|
After Width: | Height: | Size: 53 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 38 KiB |
|
After Width: | Height: | Size: 35 KiB |
|
After Width: | Height: | Size: 40 KiB |
|
After Width: | Height: | Size: 56 KiB |
|
After Width: | Height: | Size: 74 KiB |
|
After Width: | Height: | Size: 63 KiB |
|
After Width: | Height: | Size: 110 KiB |
|
After Width: | Height: | Size: 82 KiB |
|
After Width: | Height: | Size: 94 KiB |
|
After Width: | Height: | Size: 106 KiB |
|
After Width: | Height: | Size: 73 KiB |
|
After Width: | Height: | Size: 34 KiB |
|
After Width: | Height: | Size: 96 KiB |
|
After Width: | Height: | Size: 89 KiB |
|
After Width: | Height: | Size: 78 KiB |
|
After Width: | Height: | Size: 73 KiB |
|
After Width: | Height: | Size: 81 KiB |
@@ -0,0 +1,10 @@
|
||||
"""Development entry point.
|
||||
|
||||
The installed application uses the ``doctor-workstation`` console script. Keeping
|
||||
this tiny launcher makes ``python main.py`` convenient for local development.
|
||||
"""
|
||||
|
||||
from doctor_workstation.app import main
|
||||
|
||||
if __name__ == "__main__":
|
||||
raise SystemExit(main())
|
||||
@@ -0,0 +1,5 @@
|
||||
#!/bin/bash
|
||||
set -u
|
||||
project_root="$(cd "$(dirname "$0")" && pwd -P)"
|
||||
exec /bin/bash "$project_root/scripts/package_macos.sh"
|
||||
|
||||
@@ -0,0 +1,33 @@
|
||||
# Video-enabled desktop packaging
|
||||
|
||||
The spec creates an `onedir` build and embeds `video_companion/dist` as `video_companion_dist`. Explicit QtWebEngine imports activate PyInstaller's maintained PySide6 hooks; the build scripts then fail if the resulting artifact does not contain `QtWebEngineProcess` or Chromium `.pak` resources.
|
||||
|
||||
`PySide6.QtMultimedia` and `PySide6.QtMultimediaWidgets` are also explicit hidden imports. Their maintained PyInstaller hooks collect the Python extension modules, `Qt6Multimedia`/`Qt6MultimediaWidgets` DLLs, dylibs or frameworks, `plugins/multimedia`, and the platform media backends. The build scripts assert those frozen files before accepting an artifact.
|
||||
|
||||
Both build scripts launch the frozen executable twice. `--media-smoke-test` is handled by a PyInstaller runtime hook before the normal application entry point: it imports both multimedia modules, constructs `QMediaPlayer`, `QAudioOutput`, and `QVideoWidget`, checks that a decoder backend exposes formats, runs one offscreen event-loop turn, and returns non-zero on any failure. The existing `--smoke-test` then validates the packaged application bootstrap. Each process uses a temporary user/config directory, loopback-only proxy settings, and a 30-second deadline; a non-zero exit or an unhandled exception in its logs fails the build.
|
||||
|
||||
Run the build on the target operating system. PyInstaller cannot cross-build Windows and macOS artifacts.
|
||||
|
||||
## Windows
|
||||
|
||||
```powershell
|
||||
.\scripts\build_windows.ps1
|
||||
```
|
||||
|
||||
The default interpreter is `.venv-build\Scripts\python.exe`; override it with `-Python C:\path\to\python.exe`.
|
||||
|
||||
For the one-click release ZIP and SHA-256 manifest, run `Build_DoctorWorkstation.bat`. It prepares locked dependencies, invokes the build/file/smoke gates, and archives only after all gates pass.
|
||||
|
||||
## macOS
|
||||
|
||||
```bash
|
||||
bash ./scripts/build_macos.sh
|
||||
```
|
||||
|
||||
The default interpreter is `.venv-build/bin/python`. For release signing, export `MACOS_CODESIGN_IDENTITY` before building. The generated app includes camera/microphone usage descriptions and the main-process entitlements in `macos/entitlements.plist`.
|
||||
|
||||
For the one-click release ZIP and SHA-256 file, use `package_macos.command` (or `一键打包.command`). All root `.command` files and operational `scripts/*.sh` files must be tracked with mode `100755`; `scripts/check_macos_entrypoints.sh` verifies both filesystem executability and Git index mode before packaging.
|
||||
|
||||
Before notarization, verify the nested `QtWebEngineProcess.app` signature and preserve its Qt-provided helper entitlements. Sign nested code before the outer app, then notarize and staple the final distribution artifact.
|
||||
|
||||
`.env.example` is a source/deployment template and is intentionally not included in the release archives. Production endpoints and non-secret policy values should be injected into the process environment by the managed launcher/MDM. Never place passwords, tokens, UserSig, TRTC SecretKey, or other long-lived credentials in a release archive.
|
||||
@@ -0,0 +1,127 @@
|
||||
# -*- mode: python ; coding: utf-8 -*-
|
||||
"""Cross-platform PyInstaller onedir spec for the video-enabled workstation.
|
||||
|
||||
PyInstaller's official PySide6 QtWebEngine hooks are activated by the explicit
|
||||
hidden imports below. Those hooks retain QtWebEngineProcess, Chromium .pak/
|
||||
ICU resources, locales, Qt plugins, and the macOS framework/helper layout.
|
||||
The explicit QtMultimedia imports likewise activate PyInstaller's official Qt
|
||||
dependency scan, which collects the QtMultimedia/QtMultimediaWidgets extension
|
||||
modules, Qt6Multimedia shared libraries/frameworks, multimedia plugins, and
|
||||
their platform media backends.
|
||||
"""
|
||||
|
||||
import os
|
||||
import sys
|
||||
from pathlib import Path
|
||||
|
||||
|
||||
PROJECT_ROOT = Path(SPEC).resolve().parent.parent
|
||||
SOURCE_ROOT = PROJECT_ROOT / "src"
|
||||
ENTRY_POINT = SOURCE_ROOT / "doctor_workstation" / "__main__.py"
|
||||
VIDEO_DIST = PROJECT_ROOT / "video_companion" / "dist"
|
||||
RESOURCES = PROJECT_ROOT / "resources"
|
||||
ENTITLEMENTS = PROJECT_ROOT / "packaging" / "macos" / "entitlements.plist"
|
||||
VERSION_FILE = PROJECT_ROOT / "packaging" / "windows" / "version_info.txt"
|
||||
MEDIA_SMOKE_HOOK = PROJECT_ROOT / "packaging" / "runtime_media_smoke.py"
|
||||
|
||||
if not ENTRY_POINT.is_file():
|
||||
raise SystemExit(f"Application entry point is missing: {ENTRY_POINT}")
|
||||
if not (VIDEO_DIST / "index.html").is_file():
|
||||
raise SystemExit("Build video_companion before running PyInstaller")
|
||||
if not MEDIA_SMOKE_HOOK.is_file():
|
||||
raise SystemExit(f"Frozen multimedia smoke hook is missing: {MEDIA_SMOKE_HOOK}")
|
||||
|
||||
# Some Windows developer tools add an unrelated OpenSSL installation to PATH.
|
||||
# PyInstaller's dependency scanner would then pair Python's ``_ssl.pyd`` with
|
||||
# those incompatible DLLs. Put the running interpreter's DLL directory first
|
||||
# and collect the exact same files explicitly so the build is reproducible.
|
||||
python_runtime_binaries = []
|
||||
if sys.platform == "win32":
|
||||
python_dll_dir = Path(sys.base_prefix) / "DLLs"
|
||||
for dll_name in ("libssl-3-x64.dll", "libcrypto-3-x64.dll"):
|
||||
dll_path = python_dll_dir / dll_name
|
||||
if not dll_path.is_file():
|
||||
raise SystemExit(f"Python runtime dependency is missing: {dll_path}")
|
||||
python_runtime_binaries.append((str(dll_path), "."))
|
||||
os.environ["PATH"] = os.pathsep.join((str(python_dll_dir), os.environ.get("PATH", "")))
|
||||
|
||||
qt_webengine_hiddenimports = [
|
||||
# Importing these modules lets PyInstaller's official Qt hooks collect the
|
||||
# helper executable/app, resources, locales, frameworks, and plugins.
|
||||
"PySide6.QtWebChannel",
|
||||
"PySide6.QtWebEngineCore",
|
||||
"PySide6.QtWebEngineWidgets",
|
||||
"PySide6.QtNetwork",
|
||||
"PySide6.QtPrintSupport",
|
||||
]
|
||||
|
||||
qt_multimedia_hiddenimports = [
|
||||
# These are intentionally explicit instead of relying on imports hidden by
|
||||
# the application's optional media fallback. PyInstaller's official
|
||||
# hooks collect Qt6Multimedia*.dll/.dylib/framework, plugins/multimedia,
|
||||
# and the platform FFmpeg/native backend dependencies.
|
||||
"PySide6.QtMultimedia",
|
||||
"PySide6.QtMultimediaWidgets",
|
||||
]
|
||||
|
||||
analysis = Analysis(
|
||||
[str(ENTRY_POINT)],
|
||||
pathex=[str(SOURCE_ROOT)],
|
||||
binaries=python_runtime_binaries,
|
||||
datas=[
|
||||
(str(VIDEO_DIST), "video_companion_dist"),
|
||||
(str(RESOURCES), "resources"),
|
||||
],
|
||||
hiddenimports=qt_webengine_hiddenimports + qt_multimedia_hiddenimports,
|
||||
hookspath=[],
|
||||
hooksconfig={},
|
||||
runtime_hooks=[str(MEDIA_SMOKE_HOOK)],
|
||||
excludes=[],
|
||||
noarchive=False,
|
||||
optimize=0,
|
||||
)
|
||||
|
||||
pyz = PYZ(analysis.pure)
|
||||
|
||||
is_macos = sys.platform == "darwin"
|
||||
exe = EXE(
|
||||
pyz,
|
||||
analysis.scripts,
|
||||
[],
|
||||
exclude_binaries=True,
|
||||
name="DoctorWorkstation",
|
||||
debug=False,
|
||||
bootloader_ignore_signals=False,
|
||||
strip=False,
|
||||
upx=False,
|
||||
console=False,
|
||||
disable_windowed_traceback=False,
|
||||
argv_emulation=False,
|
||||
target_arch=None,
|
||||
codesign_identity=os.environ.get("MACOS_CODESIGN_IDENTITY") if is_macos else None,
|
||||
entitlements_file=str(ENTITLEMENTS) if is_macos else None,
|
||||
version=str(VERSION_FILE) if sys.platform == "win32" else None,
|
||||
)
|
||||
|
||||
collection = COLLECT(
|
||||
exe,
|
||||
analysis.binaries,
|
||||
analysis.datas,
|
||||
strip=False,
|
||||
upx=False,
|
||||
name="DoctorWorkstation",
|
||||
)
|
||||
|
||||
if is_macos:
|
||||
app = BUNDLE(
|
||||
collection,
|
||||
name="DoctorWorkstation.app",
|
||||
icon=None,
|
||||
bundle_identifier="com.zyt.doctor-workstation",
|
||||
info_plist={
|
||||
"CFBundleDisplayName": "臻阳堂医生工作站",
|
||||
"NSCameraUsageDescription": "用于视频面诊时采集医生画面。",
|
||||
"NSMicrophoneUsageDescription": "用于视频面诊时采集医生语音。",
|
||||
"NSHighResolutionCapable": True,
|
||||
},
|
||||
)
|
||||
@@ -0,0 +1,20 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
|
||||
<plist version="1.0">
|
||||
<dict>
|
||||
<key>com.apple.security.device.camera</key>
|
||||
<true/>
|
||||
<key>com.apple.security.device.audio-input</key>
|
||||
<true/>
|
||||
<key>com.apple.security.device.microphone</key>
|
||||
<true/>
|
||||
<key>com.apple.security.network.client</key>
|
||||
<true/>
|
||||
<key>com.apple.security.cs.allow-jit</key>
|
||||
<true/>
|
||||
<key>com.apple.security.cs.allow-unsigned-executable-memory</key>
|
||||
<true/>
|
||||
<key>com.apple.security.cs.disable-library-validation</key>
|
||||
<true/>
|
||||
</dict>
|
||||
</plist>
|
||||
@@ -0,0 +1,85 @@
|
||||
"""Frozen-process gate for the Qt multimedia runtime.
|
||||
|
||||
PyInstaller executes this file as a runtime hook. Normal application starts
|
||||
are untouched; ``--media-smoke-test`` exits before the application entry point
|
||||
after proving that the frozen Qt multimedia modules and a decoder backend can
|
||||
be loaded in an offscreen Qt event loop.
|
||||
"""
|
||||
|
||||
from __future__ import annotations
|
||||
|
||||
import sys
|
||||
|
||||
MEDIA_SMOKE_ARGUMENT = "--media-smoke-test"
|
||||
|
||||
|
||||
def _emit(message: str, *, error: bool = False) -> None:
|
||||
# Windowed PyInstaller executables set stdout/stderr to None on Windows.
|
||||
# The exit status is the gate contract; diagnostics are best-effort.
|
||||
stream = sys.stderr if error else sys.stdout
|
||||
if stream is not None:
|
||||
print(message, file=stream, flush=True)
|
||||
|
||||
|
||||
def _run_media_smoke_gate() -> None:
|
||||
# Keep these imports inside the gate. Missing frozen extension modules or
|
||||
# linked Qt multimedia libraries must make this process fail, while normal
|
||||
# launches retain the application's existing fallback behaviour.
|
||||
from PySide6.QtCore import QTimer
|
||||
from PySide6.QtMultimedia import QAudioOutput, QMediaFormat, QMediaPlayer
|
||||
from PySide6.QtMultimediaWidgets import QVideoWidget
|
||||
from PySide6.QtWidgets import QApplication
|
||||
|
||||
application = QApplication.instance()
|
||||
owns_application = application is None
|
||||
if application is None:
|
||||
application = QApplication(["DoctorWorkstationMediaSmoke"])
|
||||
|
||||
player = QMediaPlayer()
|
||||
audio_output = QAudioOutput()
|
||||
video_widget = QVideoWidget()
|
||||
player.setAudioOutput(audio_output)
|
||||
player.setVideoOutput(video_widget)
|
||||
|
||||
if not player.isAvailable():
|
||||
raise RuntimeError("Qt reports that no multimedia backend is available")
|
||||
|
||||
decode_formats = QMediaFormat().supportedFileFormats(QMediaFormat.ConversionMode.Decode)
|
||||
if not decode_formats:
|
||||
raise RuntimeError("Qt multimedia loaded without a supported decoder format")
|
||||
|
||||
video_widget.resize(16, 16)
|
||||
video_widget.show()
|
||||
QTimer.singleShot(0, application.quit)
|
||||
event_status = application.exec()
|
||||
video_widget.close()
|
||||
player.setVideoOutput(None)
|
||||
player.setAudioOutput(None)
|
||||
if event_status != 0:
|
||||
raise RuntimeError(f"Qt multimedia offscreen event loop exited with {event_status}")
|
||||
|
||||
# QApplication cannot be recreated safely in-process. The runtime hook is
|
||||
# a one-shot frozen gate, but retaining this distinction makes direct test
|
||||
# imports predictable.
|
||||
if owns_application:
|
||||
application.processEvents()
|
||||
|
||||
|
||||
def _dispatch() -> int | None:
|
||||
if MEDIA_SMOKE_ARGUMENT not in sys.argv[1:]:
|
||||
return None
|
||||
try:
|
||||
_run_media_smoke_gate()
|
||||
except Exception as exc:
|
||||
_emit(
|
||||
f"Frozen Qt multimedia smoke gate failed: {type(exc).__name__}: {exc}",
|
||||
error=True,
|
||||
)
|
||||
return 70
|
||||
_emit("Frozen Qt multimedia smoke gate passed.")
|
||||
return 0
|
||||
|
||||
|
||||
_media_smoke_status = _dispatch()
|
||||
if _media_smoke_status is not None:
|
||||
raise SystemExit(_media_smoke_status)
|
||||
@@ -0,0 +1,19 @@
|
||||
@echo off
|
||||
setlocal EnableExtensions DisableDelayedExpansion
|
||||
set "APPLICATION=%~dp0DoctorWorkstation\DoctorWorkstation.exe"
|
||||
|
||||
if not exist "%APPLICATION%" (
|
||||
echo DoctorWorkstation.exe was not found.
|
||||
echo Please keep this launcher beside the DoctorWorkstation folder.
|
||||
pause
|
||||
exit /b 1
|
||||
)
|
||||
|
||||
start "" "%APPLICATION%"
|
||||
if errorlevel 1 (
|
||||
echo DoctorWorkstation failed to start.
|
||||
pause
|
||||
exit /b 1
|
||||
)
|
||||
|
||||
exit /b 0
|
||||
@@ -0,0 +1,31 @@
|
||||
# UTF-8
|
||||
# Example PyInstaller version resource. Update all four version tuples together.
|
||||
VSVersionInfo(
|
||||
ffi=FixedFileInfo(
|
||||
filevers=(0, 1, 0, 0),
|
||||
prodvers=(0, 1, 0, 0),
|
||||
mask=0x3f,
|
||||
flags=0x0,
|
||||
OS=0x40004,
|
||||
fileType=0x1,
|
||||
subtype=0x0,
|
||||
date=(0, 0)
|
||||
),
|
||||
kids=[
|
||||
StringFileInfo([
|
||||
StringTable(
|
||||
'080404B0',
|
||||
[
|
||||
StringStruct('CompanyName', 'ZYT'),
|
||||
StringStruct('FileDescription', '医生工作台'),
|
||||
StringStruct('FileVersion', '0.1.0.0'),
|
||||
StringStruct('InternalName', 'DoctorWorkstation'),
|
||||
StringStruct('OriginalFilename', 'DoctorWorkstation.exe'),
|
||||
StringStruct('ProductName', '医生工作台'),
|
||||
StringStruct('ProductVersion', '0.1.0.0')
|
||||
]
|
||||
)
|
||||
]),
|
||||
VarFileInfo([VarStruct('Translation', [2052, 1200])])
|
||||
]
|
||||
)
|
||||
@@ -0,0 +1,49 @@
|
||||
[build-system]
|
||||
requires = ["hatchling>=1.25"]
|
||||
build-backend = "hatchling.build"
|
||||
|
||||
[project]
|
||||
name = "zhenyang-doctor-workstation"
|
||||
version = "0.1.0"
|
||||
description = "Cross-platform doctor consultation workstation for Windows and macOS"
|
||||
readme = "README.md"
|
||||
requires-python = ">=3.11"
|
||||
license = { text = "Proprietary" }
|
||||
authors = [{ name = "Zhenyangtang" }]
|
||||
dependencies = [
|
||||
"httpx>=0.27.2,<1",
|
||||
"keyring>=25.5,<26",
|
||||
"platformdirs>=4.3,<5",
|
||||
"PySide6>=6.8.2,<7",
|
||||
"python-dotenv>=1.0.1,<2",
|
||||
]
|
||||
|
||||
[project.optional-dependencies]
|
||||
dev = [
|
||||
"pytest>=8.3,<9",
|
||||
"pytest-cov>=6,<7",
|
||||
"ruff>=0.9,<1",
|
||||
]
|
||||
build = [
|
||||
"pyinstaller>=6.11,<7",
|
||||
]
|
||||
|
||||
[project.scripts]
|
||||
doctor-workstation = "doctor_workstation.app:main"
|
||||
|
||||
[tool.hatch.build.targets.wheel]
|
||||
packages = ["src/doctor_workstation"]
|
||||
|
||||
[tool.pytest.ini_options]
|
||||
addopts = "-q"
|
||||
pythonpath = ["src"]
|
||||
testpaths = ["tests"]
|
||||
|
||||
[tool.ruff]
|
||||
line-length = 100
|
||||
target-version = "py311"
|
||||
|
||||
[tool.ruff.lint]
|
||||
select = ["E", "F", "I", "UP", "B", "SIM"]
|
||||
ignore = ["E501"]
|
||||
|
||||
@@ -0,0 +1,820 @@
|
||||
# admin 医生端源码审计
|
||||
|
||||
审计日期:2026-08-10
|
||||
参考项目:D:\web\zyt\admin
|
||||
审计方式:只读检查 Vue/TypeScript 源码、API 封装、路由守卫、Pinia store、业务组件和权限判断;未修改 admin 项目,也未把 README 当作结论来源。
|
||||
|
||||
## 1. 结论摘要
|
||||
|
||||
1. admin 是 Vue 3 + TypeScript + Vite + Element Plus + Pinia 项目。医生端并不是一套独立的静态路由:除登录、H5 诊单和只读诊单外,页面路径、标题、组件和菜单权限都由登录后 GET /adminapi/auth.admin/mySelf 返回的 menu 动态注入。
|
||||
2. 医生相关页面的全局状态很少。Pinia 只持有认证用户、权限、动态菜单、全局站点配置、布局与多标签;接诊台、处方、患者、问诊列表的查询条件和业务状态均保留在各页面的 ref/reactive 中,分页统一使用 usePaging。
|
||||
3. “患者列表”有两个不同实现:
|
||||
- 医生/一诊工作台的“我的患者”:src/views/first_visit/my_patients/index.vue,带患者、订单、面诊进度三个工作区,服务端按当前角色和部门数据范围收窄。
|
||||
- 平台注册用户列表:src/views/consumer/lists/index.vue,仅展示头像、昵称、账号、手机号、渠道和注册时间,不是医生业务患者工作台。
|
||||
4. “问诊列表”也有两个相关实现:
|
||||
- 挂号/问诊执行列表:src/views/tcm/appointment/list.vue,默认“今天 + 待接诊”,支持通话、视频二维码、完成、开方、取消。
|
||||
- 诊单/患者业务列表:src/views/tcm/diagnosis/index.vue,围绕诊单、挂号、确认、开方、医助指派、二维码和视频旁观。
|
||||
最终菜单叫什么、URL 是什么取决于后端 menu 配置,不应仅根据文件名硬编码。
|
||||
5. 实际视频问诊主链是 src/components/chat-dialog/index.vue:腾讯云 Chat UIKit 单聊 + TUICallKit 音视频;通话前后还串联后端通话记录、TRTC 房间绑定、云端混流录制、可选浏览器本地录制、截屏写医生备注。src/components/video-call/index.vue 是另一套旧/独立实现,目前源码中没有被任何页面引用。
|
||||
6. 处方领域要区分三类对象:
|
||||
- 处方库模板:tcm.prescriptionLibrary,供医生复用药材组合。
|
||||
- 已开处方:tcm.prescription,处方笺、患者、医师签名、主辅方、审核与作废。
|
||||
- 处方业务订单:tcm.prescriptionOrder,收货、费用、双审、支付单、药房和物流履约;它不是支付单 zyt_order。
|
||||
|
||||
## 2. 关键源码与路由
|
||||
|
||||
### 2.1 页面定位
|
||||
|
||||
| 业务 | 关键源文件(绝对路径) | 路由结论 |
|
||||
|---|---|---|
|
||||
| 登录 | D:\web\zyt\admin\src\views\account\login.vue | 静态精确路由 /login |
|
||||
| 接诊台 | D:\web\zyt\admin\src\views\patient\reception\index.vue | 动态菜单组件键应指向 patient/reception/index;实际 URL 取 menu[].paths |
|
||||
| 我的处方库 | D:\web\zyt\admin\src\views\consumer\prescription\list.vue | 动态菜单组件键应指向 consumer/prescription/list;实际 URL 取 menu[].paths |
|
||||
| 药品库(不是处方库) | D:\web\zyt\admin\src\views\doctor\medicine.vue | 动态菜单组件键应指向 doctor/medicine |
|
||||
| 已开处方/处方管理 | D:\web\zyt\admin\src\views\consumer\prescription\index.vue | 动态菜单组件键应指向 consumer/prescription/index |
|
||||
| 处方业务订单 | D:\web\zyt\admin\src\views\consumer\prescription\order_list.vue | 动态菜单组件键应指向 consumer/prescription/order_list |
|
||||
| 我的患者 | D:\web\zyt\admin\src\views\first_visit\my_patients\index.vue | 动态菜单组件键应指向 first_visit/my_patients/index |
|
||||
| 平台用户列表 | D:\web\zyt\admin\src\views\consumer\lists\index.vue | 动态菜单组件键应指向 consumer/lists/index |
|
||||
| 问诊/挂号列表 | D:\web\zyt\admin\src\views\tcm\appointment\list.vue | 动态菜单组件键应指向 tcm/appointment/list |
|
||||
| 诊单列表 | D:\web\zyt\admin\src\views\tcm\diagnosis\index.vue | 动态菜单组件键应指向 tcm/diagnosis/index;另有静态 H5 路由 /tcm/diagnosis/h5 |
|
||||
| 诊单编辑/只读抽屉 | D:\web\zyt\admin\src\views\tcm\diagnosis\edit.vue | 被多个页面异步复用,不一定是独立菜单 |
|
||||
| 患者只读详情 | D:\web\zyt\admin\src\views\tcm\diagnosis\readonly.vue | 静态精确路由 /tcm/diagnosis-readonly?id=诊单ID |
|
||||
| 预约视频问诊 | D:\web\zyt\admin\src\views\tcm\diagnosis\appointment.vue | 抽屉组件,由诊单列表/我的患者调用 |
|
||||
| 诊间开方 | D:\web\zyt\admin\src\components\tcm-prescription\index.vue | 复用组件,由问诊列表和诊单编辑调用 |
|
||||
| 聊天与视频问诊 | D:\web\zyt\admin\src\components\chat-dialog\index.vue | 浮动组件,由接诊台及问诊列表调用 |
|
||||
| 医助视频旁观 | D:\web\zyt\admin\src\views\tcm\diagnosis\components\AssistantWatchCallDialog.vue | 诊单列表内异步组件 |
|
||||
|
||||
### 2.2 动态路由机制
|
||||
|
||||
关键文件:
|
||||
|
||||
- D:\web\zyt\admin\src\router\routes.ts
|
||||
- D:\web\zyt\admin\src\router\index.ts
|
||||
- D:\web\zyt\admin\src\permission.ts
|
||||
- D:\web\zyt\admin\src\stores\modules\user.ts
|
||||
|
||||
流程:
|
||||
|
||||
1. 常量路由只注册 /login、/403、/change-password、/bind-work-wechat、/user/setting、/doctor/progress、/tcm/diagnosis/h5 和 /tcm/diagnosis-readonly 等少数页面。
|
||||
2. 登录成功后 GET /auth.admin/mySelf。
|
||||
3. user store 保存 data.user、data.permissions,并把 data.menu 交给 filterAsyncRoutes。
|
||||
4. 每个后端菜单项使用以下字段转为 Vue Router:
|
||||
- paths:路由路径;
|
||||
- component:src/views 下的组件键;
|
||||
- name:菜单标题;
|
||||
- perms:写入 route.meta.perms;
|
||||
- is_show:控制 meta.hidden;
|
||||
- is_cache:控制 keepAlive;
|
||||
- params:默认 query;
|
||||
- selected:activeMenu;
|
||||
- type:目录或菜单。
|
||||
5. permission.ts 把转换后的路由动态挂到根布局;第一个可见菜单成为 / 的重定向目标。
|
||||
|
||||
因此,本仓库源码能确定组件和静态路由,但不能单独确定接诊台、处方库、已开处方、我的患者、问诊列表的生产 URL 与菜单标题。要得到精确值,必须取得当前环境 /auth.admin/mySelf 的 menu 响应或检查服务端菜单表。
|
||||
|
||||
## 3. 登录、认证、权限和状态管理
|
||||
|
||||
### 3.1 登录链路
|
||||
|
||||
关键文件:
|
||||
|
||||
- D:\web\zyt\admin\src\views\account\login.vue
|
||||
- D:\web\zyt\admin\src\api\user.ts
|
||||
- D:\web\zyt\admin\src\stores\modules\user.ts
|
||||
- D:\web\zyt\admin\src\utils\request\index.ts
|
||||
- D:\web\zyt\admin\src\utils\auth.ts
|
||||
|
||||
账号密码:
|
||||
|
||||
- POST /login/account
|
||||
- 请求:account、password、terminal=1。
|
||||
- 响应被页面使用的字段:token、is_paw、need_bind_work_wechat。
|
||||
- token 写入本地缓存键 token,后续请求通过请求拦截器放到 HTTP 头 token。
|
||||
- “记住账号”只缓存 account,不缓存密码,缓存键为 account。
|
||||
|
||||
企业微信:
|
||||
|
||||
- GET /login/workWechatConfig,使用 enabled、corp_id、agent_id。
|
||||
- 企业微信内置浏览器走 OAuth,scope=snsapi_privateinfo、state=admin_login。
|
||||
- 普通浏览器动态加载 https://wwcdn.weixin.qq.com/node/wework/wwopen/js/wwLogin-1.2.7.js 显示扫码登录。
|
||||
- 回调 code 通过 POST /login/workWechatLogin,参数 code、terminal=1。
|
||||
- 另有 POST /auth.admin/bindWorkWechat、POST /auth.admin/unbindWorkWechat。
|
||||
|
||||
守卫:
|
||||
|
||||
- is_paw=0 强制跳转 /change-password,并通过 POST /login/changeFirstPassword 修改。
|
||||
- need_bind_work_wechat=true 强制进入 /bind-work-wechat。
|
||||
- 没有 token 的非白名单路由跳 /login?redirect=原地址。
|
||||
- /auth.admin/mySelf 没有任何有效菜单时清认证并跳 /403。
|
||||
- 响应码约定:1 成功、0 失败、-1 登录失效、10 需要绑定企微、2 打开新页面、-2 未安装。
|
||||
|
||||
### 3.2 Pinia 与页面状态
|
||||
|
||||
| Store/Hook | 文件 | 职责 |
|
||||
|---|---|---|
|
||||
| user | D:\web\zyt\admin\src\stores\modules\user.ts | token、userInfo、routes、perms、isPaw;登录、退出、企微登录、加载个人信息 |
|
||||
| app | D:\web\zyt\admin\src\stores\modules\app.ts | 网站配置、OSS 图片地址、移动端/侧栏状态、视图刷新 |
|
||||
| tabs | D:\web\zyt\admin\src\stores\modules\multipleTabs.ts | 多标签与 keep-alive 缓存 |
|
||||
| setting | D:\web\zyt\admin\src\stores\modules\setting.ts | 本地布局、主题配置 |
|
||||
| usePaging | D:\web\zyt\admin\src\hooks\usePaging.ts | 页码、page_size、loading、count、lists、extend;支持 silent 静默刷新 |
|
||||
|
||||
列表接口统一期待服务端 data 为:
|
||||
|
||||
- lists:当前页数组;
|
||||
- count:总数;
|
||||
- extend:额外统计、日期、权限范围等扩展数据。
|
||||
|
||||
页面内筛选和弹窗状态不进入 Pinia。这一约定适合桌面端复用:认证/权限做全局 store,业务工作台保持页面级 store 或 view-model。
|
||||
|
||||
### 3.3 权限判断语义
|
||||
|
||||
关键文件:
|
||||
|
||||
- D:\web\zyt\admin\src\install\directives\perms.ts
|
||||
- D:\web\zyt\admin\src\utils\perm.ts
|
||||
|
||||
需要特别注意两套语义不同:
|
||||
|
||||
- v-perms 数组是“任一权限命中即可显示”(OR)。
|
||||
- hasPermission 数组是“数组内每个权限都必须存在”(AND)。
|
||||
- permissions 含星号时视为全部权限。
|
||||
|
||||
多数业务调用只传单个权限,因此差异暂时不明显;复用时不要把多权限数组在两处互换。
|
||||
|
||||
## 4. 业务页面审计
|
||||
|
||||
### 4.1 接诊台
|
||||
|
||||
源码:
|
||||
|
||||
- D:\web\zyt\admin\src\views\patient\reception\index.vue
|
||||
- D:\web\zyt\admin\src\api\patient.ts
|
||||
- D:\web\zyt\admin\src\views\tcm\diagnosis\components\PatientInfoCard.vue
|
||||
- D:\web\zyt\admin\src\views\tcm\diagnosis\components\PatientCaseCard.vue
|
||||
- D:\web\zyt\admin\src\views\tcm\diagnosis\components\DailyMatrix.vue
|
||||
- D:\web\zyt\admin\src\views\patient\reception\components\NoteTimeline.vue
|
||||
|
||||
页面行为:
|
||||
|
||||
- 默认显示当天 status=1 待接诊;可切到 status=4 已过号。
|
||||
- 搜索字段 patient_name;分页 page_no/page_size,固定每页 15。
|
||||
- 每 5 秒静默刷新队列和已选患者详情;页面隐藏时暂停,恢复可见后立即刷新。
|
||||
- 队列使用无限滚动,并按 id 去重。
|
||||
- 队列行主要字段:id、patient_id、patient_name、patient_phone、diagnosis_id、doctor_id/name、assistant_id/name、appointment_date/time、gender、age、status/status_desc、has_prescription、remark。
|
||||
- 详情结构按源码使用为:
|
||||
- appointment:挂号;
|
||||
- diagnosis:诊单/病例;
|
||||
- doctor_notes:医生备注、舌苔和报告。
|
||||
- 日常记录不依赖 reception 响应完整下发,而由 DailyMatrix 继续按 diagnosis_id 调 trackingWindow/trackingNotes。
|
||||
|
||||
操作:
|
||||
|
||||
- 通知医助:POST /doctor.appointment/notifyAssistant,参数 id=挂号ID。
|
||||
- 发起通话:先 POST /tcm.diagnosis/getCallSignature,参数 patient_id、diagnosis_id,再打开 ChatDialog。
|
||||
- 备注:POST /doctor.appointment/addDoctorNote,参数 diagnosis_id、content,可追加 tongue_images、report_files。
|
||||
- 编辑病历:复用 tcm/diagnosis/edit.vue。
|
||||
- 完成接诊:POST /doctor.appointment/complete,参数 id=挂号ID;页面允许 status=1 或 4。
|
||||
|
||||
权限:
|
||||
|
||||
- doctor.appointment/addDoctorNote
|
||||
- tcm.diagnosis/edit
|
||||
- doctor.appointment/complete
|
||||
|
||||
源码中的“通知医助”和“发起通话”按钮没有 v-perms;只能依赖页面菜单权限和后端接口鉴权,桌面端若拆成独立入口应补显式能力判断。
|
||||
|
||||
### 4.2 我的处方库
|
||||
|
||||
源码:
|
||||
|
||||
- D:\web\zyt\admin\src\views\consumer\prescription\list.vue
|
||||
- D:\web\zyt\admin\src\api\tcm.ts
|
||||
- D:\web\zyt\admin\src\components\medicine-name-select\index.vue
|
||||
|
||||
模型与筛选:
|
||||
|
||||
- 查询:prescription_name、formula_type(主方/辅方)、is_public(0 仅自己、1 所有人)。
|
||||
- 列表:id、prescription_name、formula_type、herbs、is_public、disable_edit、creator_id/name、create_time。
|
||||
- herbs 项:medicine_id(可选)、name、dosage。
|
||||
- 编辑:id、prescription_name、formula_type、herbs、is_public、disable_edit。
|
||||
- disable_edit=1 表示导入模板后锁定整张处方的药材,不可增删改,只能再次导入覆盖。
|
||||
|
||||
接口:
|
||||
|
||||
- GET /tcm.prescriptionLibrary/lists
|
||||
- POST /tcm.prescriptionLibrary/add
|
||||
- POST /tcm.prescriptionLibrary/edit
|
||||
- POST /tcm.prescriptionLibrary/delete,参数 id
|
||||
- GET /tcm.prescriptionLibrary/detail,参数 id(API 已封装,但当前列表弹窗直接使用行数据)
|
||||
|
||||
权限:
|
||||
|
||||
- wcf.prescription/add
|
||||
- wcf.prescription/read
|
||||
- wcf.prescription/edit
|
||||
- wcf.prescription/delete
|
||||
|
||||
所有权:
|
||||
|
||||
- 普通用户只可编辑/删除 creator_id 等于当前 userInfo.id 的模板。
|
||||
- root=1 或 role_ids 包含 0、3 可管理全部模板。
|
||||
- 诊间/已开处方导入模板时会额外传 prescribing_creator_id,通常取处方 creator_id,新增时取当前登录用户 id。
|
||||
|
||||
### 4.3 药品库(容易和处方库混淆)
|
||||
|
||||
源码:D:\web\zyt\admin\src\views\doctor\medicine.vue
|
||||
|
||||
接口:
|
||||
|
||||
- GET /doctor.medicine/lists
|
||||
- POST /doctor.medicine/add
|
||||
- POST /doctor.medicine/edit
|
||||
- POST /doctor.medicine/delete
|
||||
- GET /doctor.medicine/detail
|
||||
|
||||
模型:
|
||||
|
||||
- id、name、supplier、unit、settlement_price、retail_price、stock、image、status、remark。
|
||||
- 图片上传直接 POST 到 VITE_APP_BASE_URL + /api/upload/image,并携带 token 头。
|
||||
|
||||
当前页面的增删改按钮没有 v-perms。它是药材主数据管理,不应直接当作“我的处方库”复刻。
|
||||
|
||||
### 4.4 已开处方/处方管理
|
||||
|
||||
源码:
|
||||
|
||||
- D:\web\zyt\admin\src\views\consumer\prescription\index.vue
|
||||
- D:\web\zyt\admin\src\components\tcm-prescription\index.vue
|
||||
- D:\web\zyt\admin\src\api\tcm.ts
|
||||
|
||||
列表筛选:
|
||||
|
||||
- sn:处方编号模糊查;
|
||||
- patient_name;
|
||||
- creator_ids:开方医师多选;
|
||||
- audit_filter:all、pending、passed、not_passed、rejected;
|
||||
- source_filter:all、manual、system;
|
||||
- start_time、end_time(按创建时间)。
|
||||
|
||||
列表核心字段:
|
||||
|
||||
- id、sn、prescription_type;
|
||||
- is_system_auto:0 手工、1 空白处方/系统代开;
|
||||
- patient_name、gender、age、phone;
|
||||
- audit_status、audit_remark、business_prescription_audit_rejected、business_prescription_audit_remark;
|
||||
- void_status、void_by_name、void_time;
|
||||
- doctor_name、creator_id、assistant_name、prescription_date、create_time;
|
||||
- has_prescription_order。
|
||||
|
||||
处方编辑/详情模型:
|
||||
|
||||
- 关联:id、diagnosis_id、creator_id。
|
||||
- 患者:patient_name、gender、age、visit_no、prescription_date。
|
||||
- 诊断:tongue、tongue_image、pulse、pulse_condition、clinical_diagnosis。
|
||||
- 药材:herbs,每项 medicine_id、name、dosage、formula_type(主方/辅方)、locked。
|
||||
- 剂型/用法:prescription_type、dosage_amount、dosage_unit、dosage_bag_count、need_decoction、bags_per_dose、dose_count、dose_unit、usage_days、times_per_day、usage_instruction、usage_time、usage_way、dietary_taboo、usage_notes。
|
||||
- 辅方用法 aux_usage:dosage_amount、dosage_bag_count、need_decoction、bags_per_dose、times_per_day、usage_days、prescription_name(部分页面保留模板名)。
|
||||
- 医师:doctor_name、doctor_signature(PNG data URL,保存前必填)。
|
||||
- 可见性/审核:is_shared、visible_role_ids、audit_status、audit_time、audit_by_name、audit_remark。
|
||||
|
||||
状态规则:
|
||||
|
||||
- audit_status:0 待审核、1 已通过、2 已驳回。
|
||||
- 驳回处方会同时作废。
|
||||
- “已通过且未作废”的有效处方不能普通编辑/删除。
|
||||
- 新增时前端强制 audit_status=0;编辑保存后提示重新进入待审核。
|
||||
- 诊间开方组件会保存 case_record 病历快照,并在已有 appointment_id 处方时直接进入只读查看。
|
||||
- 已存在业务订单时,诊间组件禁止作废处方。
|
||||
|
||||
主要接口:
|
||||
|
||||
- GET /tcm.prescription/lists
|
||||
- GET /tcm.prescription/detail,参数 id
|
||||
- POST /tcm.prescription/add
|
||||
- POST /tcm.prescription/edit
|
||||
- POST /tcm.prescription/delete,参数 id
|
||||
- POST /tcm.prescription/patchPatient,参数 id、patient_name、phone、gender
|
||||
- POST /tcm.prescription/audit,参数 id、action=approve|reject、remark
|
||||
- POST /tcm.prescription/void,参数 id
|
||||
- GET /tcm.prescription/listByDiagnosis,参数 diagnosis_id
|
||||
- GET /tcm.prescription/getByAppointment,参数 appointment_id
|
||||
|
||||
权限:
|
||||
|
||||
- cf.prescription/add、read、edit、audit、del
|
||||
- tcm.prescription/patchPatient
|
||||
- tcm.prescriptionLibrary/lists
|
||||
- tcm.prescriptionOrder/create、lists、setShipMode
|
||||
- finance.account_log/lists
|
||||
- tcm.prescriptionOrder/editRemarkExtra
|
||||
|
||||
角色补充:消费者处方页将 root 或 role_ids 0、3 视为可审核角色;仍应以后端和 cf.prescription/audit 为最终判定。
|
||||
|
||||
### 4.5 处方业务订单
|
||||
|
||||
源码:
|
||||
|
||||
- D:\web\zyt\admin\src\views\consumer\prescription\order_list.vue
|
||||
- D:\web\zyt\admin\src\views\consumer\prescription\components\PrescriptionOrderDetailDrawer.vue
|
||||
- D:\web\zyt\admin\src\views\consumer\prescription\components\prescription-order-utils.ts
|
||||
|
||||
此页面是已开处方的相邻履约域。核心字段:
|
||||
|
||||
- id、order_no、prescription_id、diagnosis_id;
|
||||
- recipient_name、recipient_phone、region、shipping_address;
|
||||
- fee_type、amount、internal_cost;
|
||||
- prescription_audit_status、payment_slip_audit_status;
|
||||
- fulfillment_status;
|
||||
- linked_pay_order_count、linked_pay_order_id、linked_pay_paid_total;
|
||||
- medication_days、service_channel、service_package;
|
||||
- express_company、tracking_number、ship_mode;
|
||||
- doctor_name、creator_id/name、assistant_id;
|
||||
- remark_extra、remark_assistant;
|
||||
- 药房提交号和状态。
|
||||
|
||||
审核状态统一为 0 待审核、1 已通过、2 已驳回。履约状态:
|
||||
|
||||
- 1 待双审通过
|
||||
- 2 待发货
|
||||
- 3 已完成
|
||||
- 4 已取消
|
||||
- 5 已发货
|
||||
- 6 已签收
|
||||
- 7 进行中
|
||||
- 8 暂不制药
|
||||
- 9 拒收
|
||||
- 10 退款
|
||||
- 11 保留药方
|
||||
- 12 制药缓发
|
||||
|
||||
核心接口:
|
||||
|
||||
- GET /tcm.prescriptionOrder/lists、detail、paidPayOrders、logs、logisticsTrace、export
|
||||
- POST /tcm.prescriptionOrder/create、edit、withdraw、ddcode
|
||||
- POST /tcm.prescriptionOrder/auditPrescription、auditPayment、revokeRxAudit、revokePayAudit
|
||||
- POST /tcm.prescriptionOrder/ship、complete、refund、requestCompletion
|
||||
- POST /tcm.prescriptionOrder/addPayOrder、linkPayOrder
|
||||
- POST /tcm.prescriptionOrder/patchPrescriptionPatient、patchPrescriptionUsage、updateAmount
|
||||
- POST /tcm.prescriptionOrder/setShipMode、uploadToPharmacy
|
||||
- POST /tcm.prescriptionOrder/submitGancaoRecipel、previewGancaoRecipel、confirmGancaoSubmission
|
||||
- POST /tcm.prescriptionOrder/batchAssignAssistant、addLog
|
||||
|
||||
主要权限:
|
||||
|
||||
- tcm.prescriptionOrder/detail、edit、export、ddcode、ship、addPayOrder、complete、refund、withdraw
|
||||
- tcm.prescriptionOrder/auditPrescription、auditPayment
|
||||
- tcm.prescriptionOrder/setShipMode、uploadToPharmacy、editRemarkExtra
|
||||
- finance.account_log/lists、prescription.order/finance
|
||||
|
||||
前端还存在角色级显示规则:
|
||||
|
||||
- role 2:医助;
|
||||
- role 6:下单角色;
|
||||
- role 3、8:下单筛选豁免;
|
||||
- role 0、3、6:财务字段;
|
||||
- role 0、3:可绕过双审后的创建人编辑锁、可批量改派;
|
||||
- 业务订单处方审核角色在共享工具中为 0、3、6。
|
||||
|
||||
这些数字与服务端配置耦合,不宜在新客户端再次散落硬编码。
|
||||
|
||||
### 4.6 我的患者
|
||||
|
||||
首选医生端实现:
|
||||
|
||||
- D:\web\zyt\admin\src\views\first_visit\my_patients\index.vue
|
||||
- D:\web\zyt\admin\src\api\first_visit.ts
|
||||
|
||||
页面结构:
|
||||
|
||||
- “患者列表”“订单管理”“面诊进度”三个工作区。
|
||||
- 筛选 keyword、status_filter、start_date、end_date。
|
||||
- status_filter:unbooked 未预约、pending_interview 待面诊、completed 已完成、missed 已过号。
|
||||
- 日期快捷:今天、明天、后天、近 7 天、近 30 天、自定义。
|
||||
- extend.summary 返回 today/tomorrow/day_after 计数。
|
||||
- extend.dates 返回对应日期。
|
||||
- extend.scope.label 直接展示后端判定的数据范围。
|
||||
|
||||
列表使用字段:
|
||||
|
||||
- diagnosis_id 或 id、source_patient_id;
|
||||
- patient_name、gender_desc、age、phone_masked、has_id_card;
|
||||
- assistant_id/name;
|
||||
- appointment_id、appointment_doctor_id/name、appointment_status、appointment_status_text、appointment_time_text;
|
||||
- revisit_count、confirmed、confirmation_text、diagnosis_date_text。
|
||||
|
||||
操作与接口:
|
||||
|
||||
- GET /firstvisit.myPatient/lists
|
||||
- GET /firstvisit.myPatient/assistants
|
||||
- POST /firstvisit.myPatient/assign:id、assistant_id、is_inherit=0|1
|
||||
- POST /firstvisit.myPatient/fillIdCard:id、id_card
|
||||
- POST /firstvisit.myPatient/createAppointment:预约完整参数
|
||||
- POST /firstvisit.myPatient/cancelAppointment:id=挂号ID
|
||||
- 订单工作区另使用 /firstvisit.myPatient/orders、orderDetail、orderEdit 及双审/发货/退款等受限代理接口。
|
||||
- 面诊进度使用 GET /firstvisit.myPatient/progress。
|
||||
|
||||
权限:
|
||||
|
||||
- tcm.diagnosis/edit
|
||||
- tcm.diagnosis/readonlyDetail
|
||||
- tcm.diagnosis/guahao
|
||||
- tcm.diagnosis/assign
|
||||
|
||||
服务端按当前角色与部门范围裁剪数据;前端不自行拼接 doctor_id 或 department_id 来模拟数据权限。
|
||||
|
||||
平台用户列表 D:\web\zyt\admin\src\views\consumer\lists\index.vue 使用 GET /user.user/lists,字段是 avatar、nickname、account、mobile、channel、create_time,只适合账号管理,不适合医生患者列表。
|
||||
|
||||
### 4.7 问诊/挂号列表
|
||||
|
||||
源码:
|
||||
|
||||
- D:\web\zyt\admin\src\views\tcm\appointment\list.vue
|
||||
- D:\web\zyt\admin\src\api\doctor.ts
|
||||
|
||||
默认条件:
|
||||
|
||||
- status=1 待接诊;
|
||||
- start_date=end_date=今天;
|
||||
- date_preset=today;
|
||||
- 20 秒静默轮询;
|
||||
- include_status_counts=1 时从 extend.status_count 一次返回各状态角标。
|
||||
|
||||
状态:
|
||||
|
||||
- 1 待接诊/已预约
|
||||
- 2 已取消
|
||||
- 3 已完成
|
||||
- 4 已过号
|
||||
|
||||
筛选:
|
||||
|
||||
- patient_name、doctor_name;
|
||||
- status;
|
||||
- start_date、end_date、date_preset;
|
||||
- diagnosis_confirmed;
|
||||
- assistant_dept_id(选父部门含子级)。
|
||||
|
||||
行字段:
|
||||
|
||||
- id、patient_id、diagnosis_id;
|
||||
- patient_name、patient_phone、gender、age、height、weight;
|
||||
- doctor_id/name、assistant_name;
|
||||
- appointment_date、appointment_time、period;
|
||||
- diagnosis_confirmed;
|
||||
- has_prescription、prescription_is_system_auto、prescription_audit_status、prescription_void_status;
|
||||
- status/status_desc、remark。
|
||||
|
||||
操作:
|
||||
|
||||
- 编辑患者:复用诊单编辑抽屉。
|
||||
- 视频二维码:生成小程序码。
|
||||
- 通话:获取签名并打开 ChatDialog。
|
||||
- 完成:POST /doctor.appointment/complete,可同时 POST addDoctorNote。
|
||||
- 开方/查看:复用 TcmPrescription;有效已审核处方显示“查看”。
|
||||
- 取消:POST /doctor.appointment/cancel。
|
||||
|
||||
权限:
|
||||
|
||||
- tcm.diagnosis/edit
|
||||
- tcm.diagnosis/videoQr
|
||||
- doctor.appointment/prescription
|
||||
- doctor.appointment/complete
|
||||
- tcm.diagnosis/kaifang
|
||||
- doctor.appointment/cancel
|
||||
- doctor.appointment/addDoctorNote(完成时备注能力)
|
||||
|
||||
角色判断:role_id 为 1 医生、2 医助;两者之外才显示医生姓名筛选。此处同时兼容 role_id 单值或数组,但其他页面多使用 role_ids,说明 user 模型尚未完全统一。
|
||||
|
||||
### 4.8 诊单列表
|
||||
|
||||
源码:
|
||||
|
||||
- D:\web\zyt\admin\src\views\tcm\diagnosis\index.vue
|
||||
- D:\web\zyt\admin\src\views\tcm\diagnosis\edit.vue
|
||||
- D:\web\zyt\admin\src\views\tcm\diagnosis\readonly.vue
|
||||
|
||||
列表筛选字段:
|
||||
|
||||
- keyword、diagnosis_type、syndrome_type、assistant_id;
|
||||
- diagnosis_confirmed、appointment_date、has_appointment;
|
||||
- latest_appointment_start_date/end_date/channel_source;
|
||||
- latest_assign_start_date/end_date;
|
||||
- pending_booking、completed_appointment、pending_assign;
|
||||
- pending_assign_order_month、pending_assign_keyword;
|
||||
- sort_unserved_days。
|
||||
|
||||
列表使用字段:
|
||||
|
||||
- id、patient_name、gender_desc、age;
|
||||
- assistant_id/assistant、assign_read_at;
|
||||
- appointments 或聚合的 appointment_doctor_name、appointment_time_text、appointment_status;
|
||||
- has_appointment、diagnosis_confirmed;
|
||||
- has_prescription、followup_time_text、followup_doctor_name、followup_rx_voided;
|
||||
- unserved_days、last_blood_record_at;
|
||||
- video_call_hint。
|
||||
|
||||
video_call_hint:
|
||||
|
||||
- state:none、pending_room、live 等;
|
||||
- label;
|
||||
- start_time、end_time。
|
||||
|
||||
操作权限:
|
||||
|
||||
- tcm.diagnosis/add、edit、delete、readonlyDetail
|
||||
- tcm.diagnosis/assign
|
||||
- tcm.diagnosis/kaifang
|
||||
- tcm.diagnosis/guahao、guahaoLogList
|
||||
- tcm.diagnosis/videoQr
|
||||
- tcm.diagnosis/order
|
||||
- tcm.diagnosis/watchCall
|
||||
|
||||
诊单编辑模型的核心字段:
|
||||
|
||||
- 标识:id、patient_id。
|
||||
- 患者:patient_name、id_card、phone、gender、age、marital_status、height、weight、region。
|
||||
- 诊断:diagnosis_date、diagnosis_type、syndrome_type、diabetes_type、diabetes_discovery_year、local_hospital_diagnosis、local_hospital_name。
|
||||
- 指标:systolic_pressure、diastolic_pressure、fasting_blood_sugar。
|
||||
- 现病史多选:appetite、water_intake、diet_condition、weight_change、body_feeling、sleep_condition、eye_condition、head_feeling、sweat_condition、skin_condition、urine_condition、stool_condition、kidney_condition、fatty_liver_degree。
|
||||
- 既往史:past_history、trauma_history、surgery_history、allergy_history、family_history、pregnancy_history。
|
||||
- 医疗内容:symptoms、tongue_coating、pulse、treatment_principle、prescription、doctor_advice、remark、current_medications。
|
||||
- 归属与来源:assistant_id、status、create_source、show_card、external_userid。
|
||||
|
||||
详情响应还使用 patient_basic_locked、can_edit_patient_basic、latest_prescription_order。手机号/身份证是否显示明文由 tcm.diagnosis/phonePlain 控制;已有身份证通常只有明文权限才能修改。
|
||||
|
||||
诊单详情 Tab 权限:
|
||||
|
||||
- tcm.diagnosis/chufang:处方
|
||||
- tcm.diagnosis/patientOrders:业务订单
|
||||
- tcm.diagnosis/huifang:视频回放
|
||||
- tcm.diagnosis/chat:聊天记录
|
||||
- tcm.diagnosis/assign 或 detail:指派记录
|
||||
- doctor.appointment/lists:挂号记录
|
||||
- tcm.diagnosis/dailyRecord:日常记录
|
||||
|
||||
## 5. 视频问诊完整链路
|
||||
|
||||
### 5.1 预约
|
||||
|
||||
源码:D:\web\zyt\admin\src\views\tcm\diagnosis\appointment.vue
|
||||
|
||||
目前预约类型只有 video。请求字段:
|
||||
|
||||
- patient_id
|
||||
- doctor_id
|
||||
- appointment_date
|
||||
- period=all
|
||||
- appointment_time
|
||||
- appointment_type=video
|
||||
- remark
|
||||
- channel_source
|
||||
- channel_source_detail
|
||||
|
||||
普通入口 POST /doctor.appointment/create;“我的患者”入口 POST /firstvisit.myPatient/createAppointment。可用时段来自 GET /doctor.appointment/availableSlots,字段 doctor_id、appointment_date、period=all,响应使用 slots[].time、slots[].available。页面还读取医生排班并限制不能重复预约当天 status=1/4 的号。
|
||||
|
||||
### 5.2 医生发起通话
|
||||
|
||||
生产主组件:D:\web\zyt\admin\src\components\chat-dialog\index.vue
|
||||
|
||||
1. 页面调用 open({ patientId, patientName, diagnosisId })。
|
||||
2. POST /tcm.diagnosis/getCallSignature,请求 patient_id、diagnosis_id。
|
||||
3. 响应实际使用:
|
||||
- sdkAppId
|
||||
- userId(医生 IM/TRTC user ID)
|
||||
- userSig
|
||||
- patientUserId,缺省回退 patient_加患者ID
|
||||
- assistant_id(群视频邀请)
|
||||
- isLochostVod(是否启用浏览器本地录制)
|
||||
4. Chat UIKit 登录并创建与 patientUserId 的 C2C 会话。
|
||||
5. TUICallKitServer.init 初始化通话能力;只有成功后才显示 AudioCallPicker、VideoCallPicker 和群视频按钮。
|
||||
6. beforeCalling 时 POST /tcm.diagnosis/startCall:
|
||||
- diagnosis_id
|
||||
- patient_id
|
||||
- call_type=2(视频)
|
||||
7. 呼叫状态进入 calling/connected 后从 TUIStore 或 TUICallEngine 捕获 roomID/strRoomID,再 POST /tcm.diagnosis/bindCallRoom:
|
||||
- diagnosis_id
|
||||
- room_id(字符串)
|
||||
8. bindCallRoom 的响应可带 cloud_recording.started、task_id、message;源码注释说明后端在这里触发腾讯云 CreateCloudRecording,混流模式由后端负责。
|
||||
9. 接通后,若 isLochostVod=true,前端从 TUICallKit 视频元素启动 MediaRecorder/Canvas 本地录制。
|
||||
10. 通话结束、挂断、IM 自定义挂断消息或用户关闭窗口时先 POST /tcm.diagnosis/endCall,再完成本地视频上传并 POST attachLocalCallRecording。
|
||||
|
||||
群视频调用 TUICallKitServer.calls,userIDList=[patientUserId, assistant_id],type=VIDEO_CALL。
|
||||
|
||||
### 5.3 截屏、录制与回放
|
||||
|
||||
关键文件:
|
||||
|
||||
- D:\web\zyt\admin\src\utils\call-local-recorder.ts
|
||||
- D:\web\zyt\admin\src\utils\call-video-screenshot.ts
|
||||
- D:\web\zyt\admin\src\views\tcm\diagnosis\components\CallRecordPanel.vue
|
||||
- D:\web\zyt\admin\src\views\tcm\diagnosis\components\RecordingPlaybackBlock.vue
|
||||
|
||||
视频浮窗“截屏”会:
|
||||
|
||||
1. 抓取当前 video frame;
|
||||
2. 上传图片;
|
||||
3. POST /doctor.appointment/addDoctorNote,把路径追加到 tongue_images。
|
||||
|
||||
通话记录字段:
|
||||
|
||||
- id、call_type(1 语音、其他视为视频)
|
||||
- room_id
|
||||
- status:1 进行中、2 已结束、3 未接听、4 已取消
|
||||
- recording_status_text
|
||||
- recording_urls_list
|
||||
- start_time_text、end_time_text、duration_text
|
||||
|
||||
接口:
|
||||
|
||||
- GET /tcm.diagnosis/getCallRecords,diagnosis_id
|
||||
- POST /tcm.diagnosis/attachLocalCallRecording,diagnosis_id、file_url、可选 call_record_id
|
||||
- POST /tcm.diagnosis/createManualCallRecord,diagnosis_id
|
||||
- POST /tcm.diagnosis/startCloudRecording,diagnosis_id(API 有封装,主组件当前通过 bindCallRoom 的后端联动启动)
|
||||
|
||||
### 5.4 医助旁观
|
||||
|
||||
入口在诊单列表。只有同时满足:
|
||||
|
||||
- 当前 userInfo.id 等于该诊单 assistant_id;
|
||||
- 拥有 tcm.diagnosis/watchCall;
|
||||
- video_call_hint.state=live;
|
||||
|
||||
才可真正进入。
|
||||
|
||||
GET /tcm.diagnosis/watchCall,参数 diagnosis_id,响应使用:
|
||||
|
||||
- sdkAppId
|
||||
- userId
|
||||
- userSig
|
||||
- roomId 或 strRoomId
|
||||
- patientName
|
||||
|
||||
旁观组件直接使用 trtc-sdk-v5 进入房间,只调用 startRemoteVideo,不开启本地摄像头或麦克风。pending_room 时显示入口提示但点击会阻止进入,等待房间号同步。
|
||||
|
||||
### 5.5 视频二维码
|
||||
|
||||
页面通过 POST /tcm.diagnosis/generateMiniProgramQrcode 生成 qrcode_url,常用字段:
|
||||
|
||||
- diagnosis_id
|
||||
- patient_id
|
||||
- doctor_id(部分入口)
|
||||
- share_user_id
|
||||
- mini_program_path=pages/login/login(问诊列表入口)
|
||||
|
||||
调用前先 GET 小程序配置并校验 app_id。
|
||||
|
||||
## 6. API 总表
|
||||
|
||||
所有 URL 会被请求层加上 baseUrl 和 adminapi 前缀;下表写的是 API 封装中的业务路径。
|
||||
|
||||
### 6.1 认证
|
||||
|
||||
| 方法 | 路径 | 关键请求/响应 |
|
||||
|---|---|---|
|
||||
| POST | /login/account | account、password、terminal;返回 token、is_paw、need_bind_work_wechat |
|
||||
| POST | /login/workWechatLogin | code、terminal;返回同登录结果 |
|
||||
| GET | /login/workWechatConfig | enabled、corp_id、agent_id |
|
||||
| GET | /auth.admin/mySelf | 返回 user、permissions、menu |
|
||||
| POST | /login/logout | 退出 |
|
||||
| POST | /login/changeFirstPassword | password、password_confirm |
|
||||
| POST | /auth.admin/bindWorkWechat | code |
|
||||
|
||||
### 6.2 挂号与接诊
|
||||
|
||||
| 方法 | 路径 | 关键字段 |
|
||||
|---|---|---|
|
||||
| GET | /doctor.appointment/lists | status、start_date、end_date、patient_name、doctor_name、diagnosis_confirmed、assistant_dept_id、page_no、page_size |
|
||||
| GET | /doctor.appointment/reception | id=挂号ID;返回 appointment、diagnosis、doctor_notes |
|
||||
| GET | /doctor.appointment/detail | id |
|
||||
| GET | /doctor.appointment/availableSlots | doctor_id、appointment_date、period |
|
||||
| POST | /doctor.appointment/create | patient_id、doctor_id、appointment_date/time、appointment_type、渠道等 |
|
||||
| POST | /doctor.appointment/cancel | id |
|
||||
| POST | /doctor.appointment/complete | id |
|
||||
| POST | /doctor.appointment/notifyAssistant | id |
|
||||
| POST | /doctor.appointment/addDoctorNote | diagnosis_id、content、tongue_images、report_files |
|
||||
| GET | /doctor.appointment/doctorNotes | diagnosis_id |
|
||||
| POST | /doctor.appointment/deleteDoctorNoteImage | note_id、image_type、image_path |
|
||||
|
||||
### 6.3 诊单
|
||||
|
||||
| 方法 | 路径 | 关键字段 |
|
||||
|---|---|---|
|
||||
| GET | /tcm.diagnosis/lists | 诊单列表全部筛选 + page_no/page_size;返回 lists/count/extend |
|
||||
| GET | /tcm.diagnosis/detail | id |
|
||||
| GET | /tcm.diagnosis/readonlyDetail | id;返回 appointment、diagnosis、unserved_days、last_blood_record_at、doctor_notes |
|
||||
| POST | /tcm.diagnosis/add | 完整诊单模型 |
|
||||
| POST | /tcm.diagnosis/edit | 完整诊单模型 |
|
||||
| POST | /tcm.diagnosis/delete | id |
|
||||
| POST | /tcm.diagnosis/assign | id、assistant_id、可选 is_inherit;批量场景由前端逐条调用 |
|
||||
| GET | /tcm.diagnosis/getAssistants | 医助选项 |
|
||||
| GET | /tcm.diagnosis/getDoctors | 医生选项 |
|
||||
| POST | /tcm.diagnosis/checkPhone | phone 及排除 id |
|
||||
| POST | /tcm.diagnosis/checkIdCard | id_card 及排除 id |
|
||||
| POST | /tcm.diagnosis/fillIdCard | id、id_card |
|
||||
| GET | /tcm.diagnosis/trackingWindow | id、start_date、end_date |
|
||||
| GET | /tcm.diagnosis/trackingNotes | diagnosis_id |
|
||||
| POST | /tcm.diagnosis/addTrackingNote | diagnosis_id、tracking_content |
|
||||
|
||||
### 6.4 处方与业务订单
|
||||
|
||||
处方、处方库、业务订单接口已在 4.2、4.4、4.5 分节完整列出。实现时必须保留三个资源命名空间,不要把 prescription、prescriptionLibrary、prescriptionOrder 合并成一个“处方”接口。
|
||||
|
||||
### 6.5 视频
|
||||
|
||||
| 方法 | 路径 | 关键字段 |
|
||||
|---|---|---|
|
||||
| POST | /tcm.diagnosis/getCallSignature | patient_id、diagnosis_id;返回 sdkAppId、userId、userSig、patientUserId、assistant_id、isLochostVod |
|
||||
| POST | /tcm.diagnosis/startCall | diagnosis_id、patient_id、call_type |
|
||||
| POST | /tcm.diagnosis/bindCallRoom | diagnosis_id、room_id |
|
||||
| POST | /tcm.diagnosis/startCloudRecording | diagnosis_id |
|
||||
| POST | /tcm.diagnosis/endCall | diagnosis_id |
|
||||
| GET | /tcm.diagnosis/getCallRecords | diagnosis_id |
|
||||
| POST | /tcm.diagnosis/attachLocalCallRecording | diagnosis_id、file_url、可选 call_record_id |
|
||||
| POST | /tcm.diagnosis/createManualCallRecord | diagnosis_id |
|
||||
| GET | /tcm.diagnosis/watchCall | diagnosis_id |
|
||||
| POST | /tcm.diagnosis/generateMiniProgramQrcode | diagnosis_id、patient_id、doctor_id、share_user_id 等 |
|
||||
|
||||
## 7. 可复用约定
|
||||
|
||||
1. 请求协议
|
||||
- baseURL 来自 VITE_APP_BASE_URL,统一 URL 前缀 adminapi。
|
||||
- token 放在名为 token 的请求头,不是 Bearer Authorization。
|
||||
- POST 默认把 params 转为 body;GET 使用 params。
|
||||
- 标准成功响应是 code=1,业务数据自动解包为 data。
|
||||
- GET 网络失败默认最多重试 2 次,POST 不自动重试。
|
||||
|
||||
2. 列表协议
|
||||
- 请求 page_no、page_size。
|
||||
- 响应 lists、count、extend。
|
||||
- 定时刷新使用 getLists({ silent: true }),避免表格白屏闪烁。
|
||||
|
||||
3. 标识约定
|
||||
- diagnosis_id 是诊单主键。
|
||||
- appointment.id 是挂号主键。
|
||||
- prescription.id 是处方主键。
|
||||
- prescriptionOrder.id 是处方业务订单主键。
|
||||
- patientUserId 是腾讯云 IM/TRTC 用户名,通常 patient_加患者标识。
|
||||
|
||||
4. 隐私
|
||||
- 默认手机号 3-4-4 脱敏,身份证保留前 6 后 4。
|
||||
- tcm.diagnosis/phonePlain 控制诊单编辑中的明文能力。
|
||||
- 数据范围由后端按角色、部门、归属医助裁剪,前端只做 UI 能力门控。
|
||||
|
||||
5. 复用组件
|
||||
- 患者摘要/病例:PatientInfoCard、PatientCaseCard。
|
||||
- 日常记录:DailyMatrix。
|
||||
- 医生备注:NoteTimeline。
|
||||
- 诊单编辑和只读:tcm/diagnosis/edit.vue 的 open、openViewOnly。
|
||||
- 处方开立/查看:TcmPrescription 的 open、openById。
|
||||
- 视频通讯:ChatDialog 的 open。
|
||||
- 业务订单详情:PrescriptionOrderDetailDrawer。
|
||||
|
||||
6. 状态文本
|
||||
- 不建议在新客户端重复定义状态映射。优先抽取 D:\web\zyt\admin\src\views\consumer\prescription\components\prescription-order-utils.ts 中的审核、履约、支付、供货和物流格式化逻辑为共享领域模块。
|
||||
|
||||
## 8. 未知点、歧义与风险
|
||||
|
||||
1. 动态菜单缺口:admin 前端仓库没有生产环境 /auth.admin/mySelf 的 menu 数据,因此接诊台、处方库、患者、问诊列表的精确 URL、菜单标题和页面级 route.meta.perms 仍未知。
|
||||
2. API 类型不足:tcm.ts、doctor.ts 多数参数和返回值是 any;本文列出的响应字段来自实际页面读取,不等于完整服务端 schema。后续实现应抓取真实响应或检查服务端 DTO。
|
||||
3. patient_id 语义有重载:
|
||||
- 挂号行中 patient_id 常被当作诊单/患者标识;
|
||||
- 我的患者 openAppointment 又把 diagnosis_id 或 id 同时写进 id 和 patient_id;
|
||||
- ChatDialog 则把它转换为 patient_前缀的腾讯云用户。
|
||||
新客户端必须先确认数据库实体关系,不能只按字段名推断。
|
||||
4. 接诊台发起通话使用 diagnosis_id || row.id;row.id 本身是挂号 ID。若后端要求真正诊单 ID,这个回退可能只在特定历史数据下成立。
|
||||
5. 视频二维码参数疑点:tcm/appointment/list.vue 的一个入口把 diagnosis_id 赋为 row.doctor_id,而其他入口使用真正诊单 ID;这很可能是历史兼容或缺陷,应向后端核实后再复用。
|
||||
6. 权限命名不统一:
|
||||
- 处方库用 wcf.prescription/*;
|
||||
- 已开处方用 cf.prescription/*;
|
||||
- 新增能力又混用 tcm.prescription/* 与 tcm.prescriptionOrder/*。
|
||||
不能按字符串前缀自动推导资源。
|
||||
7. 角色配置存在差异:
|
||||
- 消费者处方审核页面写死 0、3;
|
||||
- 业务订单共享工具写死 0、3、6;
|
||||
- 多处注释都声称与服务端配置一致。
|
||||
最终角色应由服务端下发 capability,避免继续硬编码。
|
||||
8. 权限 UI 不是安全边界:部分接诊、药品和通话按钮没有 v-perms;所有写接口必须继续依赖服务端鉴权。
|
||||
9. 双 SDK 并存:
|
||||
- 实际 ChatDialog 使用 @tencentcloud/call-uikit-vue;
|
||||
- 未引用的 video-call/index.vue 使用 @trtc/calls-uikit-vue;
|
||||
- 医助旁观直接使用 trtc-sdk-v5。
|
||||
新项目应明确只保留一套主叫/被叫 UI SDK,并将纯 TRTC 旁观作为独立只拉流能力。
|
||||
10. src/components/video-call/index.vue 当前没有被任何 Vue/TS 源码引用,不应误认为生产主链。
|
||||
11. PatientCaseCard 的 caseTypeLabel 无论 consultation_type 都返回“复诊”,属于明显展示逻辑疑点。
|
||||
12. 录制启动/停止部分依赖 TUICallKit 内部 store、引擎属性和方法包装,升级腾讯云 SDK 时风险较高,必须用真实双端通话、拒接、对端挂断、网络中断和房间号延迟场景回归。
|
||||
13. 处方业务订单大量前端角色规则与 server/config/project.php 注释耦合;当前审计范围只有 admin 前端,无法验证服务端配置是否已同步。
|
||||
|
||||
## 9. 面向新医生端的建议映射
|
||||
|
||||
若新项目要复刻医生工作流,建议按领域而不是按现有目录命名:
|
||||
|
||||
- /login:复用认证协议和企业微信登录。
|
||||
- /reception:复用接诊台队列、详情、5 秒静默刷新与 ChatDialog。
|
||||
- /prescription-library:复用 prescriptionLibrary 模板及所有权规则。
|
||||
- /prescriptions:复用 tcm.prescription 列表、审核、作废、打印/下载。
|
||||
- /patients:优先复用 firstvisit.myPatient,而不是 user.user/lists。
|
||||
- /consultations:复用 doctor.appointment/lists 的今天待接诊视图。
|
||||
- /diagnoses:复用 tcm.diagnosis/lists 的完整诊单工作台。
|
||||
- /video-consultation:主叫链路复用 ChatDialog/TUICallKit;医助旁观保持独立 TRTC 只拉流组件。
|
||||
|
||||
这些建议 URL 是新端的信息架构建议,不是对 admin 当前动态 URL 的断言。
|
||||
@@ -0,0 +1,461 @@
|
||||
# 医生桌面端工程架构与打包方案(Windows / macOS)
|
||||
|
||||
> 结论先行:采用 **Python 3.12 + PySide6 Qt Widgets** 构建原生业务界面,以分层的 `httpx` API client 连接现有后端;会话、权限、离线队列和本地安全存储统一放在 core 层。视频不是整套应用的实现基础,而是独立的可选集成:只有当现有腾讯 TRTC Web 方案无法由原生 SDK 替代时,才在受限的 `QWebEngineView` 中承载单一视频页面。发布使用 **PyInstaller onedir**,Windows 与 macOS 必须在各自原生 CI runner 上分别构建、签名和验收,不能交叉编译。
|
||||
|
||||
## 1. 已知上下文、边界与待确认项
|
||||
|
||||
本结论只对 `admin/package.json` 和环境配置做了最小只读核对,没有审计管理端实现。
|
||||
|
||||
- 管理端以 `VITE_APP_BASE_URL` 注入后端根地址;示例文件故意留空,开发示例注释仅以 `http://127.0.0.1:8080` 举例。现有环境文件还出现了 `https://css.zhenyangtang.com.cn/`、`https://admin.zhenyangtang.com.cn/` 和 60 秒请求超时,但这些地址可能是网关或前端站点,**不能据此认定为稳定的桌面 API 地址**。
|
||||
- 管理端依赖包含 Axios、腾讯 TRTC/Call/Chat UI、`hls.js` 和 COS JS SDK。可以据此判断视频、聊天、流媒体和对象存储是潜在集成面,但不能推断接口路径、认证协议、权限码或 RTC 凭证格式。
|
||||
- 桌面端不得读取或复用 Vite 环境变量,不得硬编码管理端 URL,也不得在客户端持有 COS Secret、TRTC SecretKey 或任何服务端签名密钥。
|
||||
|
||||
编码前必须由后端确认以下契约,并固化为 OpenAPI 或最小接口文档:
|
||||
|
||||
1. API 的正式 base URL、版本前缀、响应 envelope、错误码、分页和时间格式。
|
||||
2. 登录协议(账号密码、短信、SSO/OIDC 或 Cookie)、access/refresh 生命周期、登出和吊销语义。
|
||||
3. `/me` 等当前用户接口返回的医生身份、机构/租户、角色与细粒度权限码。
|
||||
4. 预约、患者、病历、处方等写操作的幂等键、乐观锁版本号及审计要求。
|
||||
5. 聊天的拉取/推送协议、断线续传游标;COS 上传应由后端提供短期预签名 URL 或临时凭证。
|
||||
6. TRTC 房间、`userSig` 等凭证必须由后端短时签发;确认现有 Web 页面能否作为受支持的嵌入入口。
|
||||
7. 桌面端的 CORS、代理、私有 CA、设备绑定、强制升级和最低版本策略。
|
||||
|
||||
在这些问题确认前可以完成壳层、接口抽象和模拟服务器,但不应猜测生产 endpoint。
|
||||
|
||||
## 2. 目标平台与技术选择
|
||||
|
||||
### 2.1 建议支持矩阵
|
||||
|
||||
| 项目 | 首发建议 | 说明 |
|
||||
| --- | --- | --- |
|
||||
| Python | CPython 3.12,固定 patch 版本 | 生命周期长,第三方包成熟;每个平台使用相同 minor |
|
||||
| Windows | Windows 10 22H2 / Windows 11,x86-64 | ARM64 可作为后续独立制品,不与 x64 混装 |
|
||||
| macOS | macOS 13+,先 arm64,再按客户量增加 x86-64 | 当前 PySide6 wheel 的最低系统版本必须在锁版本时再次核对 |
|
||||
| UI | PySide6 Qt Widgets | 医疗表单、表格、快捷键、打印和可访问性更稳定 |
|
||||
| 视频 | 可选 PySide6 Addons / QtWebEngineWidgets | 只隔离承载视频页,不用 WebEngine 包住整个应用 |
|
||||
| 打包 | PyInstaller onedir | 对 QtWebEngine helper、资源、签名和启动性能最稳妥 |
|
||||
|
||||
macOS 推荐分别产出 `arm64` 与 `x86_64` 制品。`universal2` 只有在 Python、PySide6 和所有二进制依赖均提供 universal2 slice,且真实验证签名/视频后再启用;两个单架构制品更易排障且体积更小。
|
||||
|
||||
### 2.2 依赖分档
|
||||
|
||||
建立一份代码、两种构建 profile:
|
||||
|
||||
- `core`:`PySide6-Essentials`、`httpx`、`pydantic`、`pydantic-settings`、`platformdirs`、`keyring`、`cryptography`。包含 QtCore/Gui/Widgets/Network/Sql/Svg/PrintSupport,不包含 WebEngine。
|
||||
- `video`:在 core 上增加与 Essentials **完全相同版本**的 `PySide6-Addons`,从而获得 QtWebEngineWidgets、WebChannel、Multimedia 等模块。
|
||||
- 开发/测试:`pytest`、`pytest-qt`、`respx`、`coverage`、`ruff`、`mypy`、`pip-audit`。
|
||||
- 构建:锁定 `PyInstaller` 及其 hooks 版本。以 2026-08-10 可验证组合为基线,可先验证 Python 3.12 + PySide6 Essentials/Addons 6.11.1 + PyInstaller 6.21.0;只有在两端打包 smoke test 通过后才更新锁。
|
||||
|
||||
不要同时安装 PyQt、PySide2 或系统级 PySide6;必须从干净虚拟环境构建。使用平台专属、带 hash 的锁文件(例如 `requirements-win-x64.lock`、`requirements-macos-arm64.lock`),而不是在发布任务中直接安装“最新版”。
|
||||
|
||||
如果所有医生都需要视频,可只发布 `video` 制品;仍保留 profile 边界,以便定位 WebEngine 问题。若视频是少数场景,可以发布 core 制品并在系统浏览器打开受支持的视频页,避免让每个安装包承担 Chromium 的体积和攻击面。
|
||||
|
||||
## 3. 分层架构
|
||||
|
||||
依赖方向固定为:`ui -> application -> domain`,`infrastructure` 在 composition root 中实现 domain/application 定义的 port。View 不允许直接调用 `httpx`、SQLite 或 keyring。
|
||||
|
||||
```text
|
||||
app/
|
||||
├─ pyproject.toml # 项目元数据、依赖分组、工具配置
|
||||
├─ requirements/ # 各 OS/架构的发布锁及 hash
|
||||
├─ src/
|
||||
│ └─ zyt_doctor/
|
||||
│ ├─ __main__.py # 极薄入口,只调用 bootstrap.main()
|
||||
│ ├─ bootstrap.py # QApplication、配置、DI、异常钩子、主窗口
|
||||
│ ├─ build_info.py # 版本、commit、channel;构建时生成
|
||||
│ ├─ config/
|
||||
│ │ ├─ models.py # 强类型配置及校验
|
||||
│ │ └─ loader.py # defaults -> 受管配置 -> 开发环境变量
|
||||
│ ├─ domain/
|
||||
│ │ ├─ identity.py # Principal、Tenant、Permission
|
||||
│ │ ├─ errors.py # 与 UI/HTTP 无关的错误类型
|
||||
│ │ └─ ports.py # Repository、Clock、SecretStore 等协议
|
||||
│ ├─ application/
|
||||
│ │ ├─ commands.py # 写用例、幂等键和确认规则
|
||||
│ │ ├─ queries.py # 读用例和缓存策略
|
||||
│ │ └─ result.py # Result / Page / OperationState
|
||||
│ ├─ core/
|
||||
│ │ ├─ api/
|
||||
│ │ │ ├─ client.py # httpx client、header、超时、重试
|
||||
│ │ │ ├─ auth.py # token/cookie adapter 与 refresh single-flight
|
||||
│ │ │ ├─ errors.py # HTTP/业务错误归一化
|
||||
│ │ │ ├─ models.py # 公共 DTO
|
||||
│ │ │ └─ generated/ # 若有 OpenAPI,生成代码仅放此处
|
||||
│ │ ├─ session/
|
||||
│ │ │ ├─ manager.py # 会话状态机、锁屏、租户切换、登出清理
|
||||
│ │ │ └─ permissions.py # 权限快照与 guard
|
||||
│ │ ├─ storage/
|
||||
│ │ │ ├─ database.py # SQLite、migration、单写线程
|
||||
│ │ │ ├─ secure_store.py # Windows Credential Manager / macOS Keychain
|
||||
│ │ │ └─ cache.py # 加密缓存、TTL、容量控制
|
||||
│ │ ├─ offline/
|
||||
│ │ │ ├─ connectivity.py # 网络状态提示,不作为唯一真相
|
||||
│ │ │ ├─ outbox.py # 离线写队列状态机
|
||||
│ │ │ └─ sync.py # 重放、冲突和人工处理
|
||||
│ │ ├─ jobs.py # QThreadPool 任务、取消、signal 适配
|
||||
│ │ ├─ events.py # 进程内 typed event bus
|
||||
│ │ ├─ logging.py # 脱敏日志和诊断包
|
||||
│ │ └─ paths.py # QStandardPaths/platformdirs;绝不写 bundle
|
||||
│ ├─ modules/
|
||||
│ │ ├─ auth/
|
||||
│ │ ├─ dashboard/
|
||||
│ │ ├─ patients/
|
||||
│ │ ├─ appointments/
|
||||
│ │ ├─ consultations/
|
||||
│ │ ├─ medical_records/
|
||||
│ │ ├─ prescriptions/
|
||||
│ │ ├─ chat/
|
||||
│ │ ├─ followups/
|
||||
│ │ └─ settings/
|
||||
│ │ # 每个模块内含 domain.py、service.py、viewmodel.py、views.py、permissions.py
|
||||
│ ├─ integrations/
|
||||
│ │ ├─ realtime/ # WebSocket/轮询 adapter,不侵入模块
|
||||
│ │ ├─ object_storage/ # 仅消费后端预签名 URL/临时凭证
|
||||
│ │ └─ video/
|
||||
│ │ ├─ port.py # join/leave/mute 等抽象
|
||||
│ │ ├─ external_browser.py
|
||||
│ │ └─ webengine.py # 唯一允许 import QtWebEngine 的文件
|
||||
│ ├─ ui/
|
||||
│ │ ├─ shell/ # 导航、标题栏、全局离线/会话提示
|
||||
│ │ ├─ widgets/ # Loading、Empty、Error、PermissionDenied
|
||||
│ │ ├─ dialogs/
|
||||
│ │ └─ theme/
|
||||
│ └─ resources/ # qrc、图标、字体许可、翻译、默认配置
|
||||
├─ tests/
|
||||
│ ├─ unit/
|
||||
│ ├─ contract/
|
||||
│ ├─ integration/
|
||||
│ ├─ ui/
|
||||
│ ├─ packaging/
|
||||
│ └─ fixtures/ # 全部为合成数据,禁止生产病患数据
|
||||
├─ packaging/
|
||||
│ ├─ windows/doctor-core.spec
|
||||
│ ├─ windows/doctor-video.spec
|
||||
│ ├─ macos/doctor-core.spec
|
||||
│ ├─ macos/doctor-video.spec
|
||||
│ ├─ macos/entitlements.plist
|
||||
│ └─ hooks/
|
||||
├─ scripts/ # build、self-check、sign、notarize
|
||||
└─ docs/ # API 映射、权限矩阵、发布 runbook
|
||||
```
|
||||
|
||||
每个业务模块只公开一个 facade 和路由描述,例如 `ModuleDescriptor(id, title, permissions, view_factory)`。主壳根据权限注册菜单,模块内再对按钮和 command 做 guard;这样既不会形成一个巨型主窗口,也不会把权限判断散落在控件代码中。
|
||||
|
||||
## 4. API client、并发和会话
|
||||
|
||||
### 4.1 API client
|
||||
|
||||
建议使用一个长生命周期 `httpx.Client`,由 composition root 创建并注入 service。所有同步请求放入 `QThreadPool/QRunnable`,结果通过 Qt signal 回到主线程;严禁 UI 线程阻塞网络。窗口关闭或查询条件变化时取消尚未开始的任务,并忽略带旧 generation id 的晚到响应。
|
||||
|
||||
Client 的固定行为:
|
||||
|
||||
- production base URL 只允许 HTTPS;HTTP 仅在 debug profile 且 host 为 localhost 时允许。
|
||||
- production 允许的 API、视频和上传 host 必须来自签名/受管配置或内置 allowlist,避免篡改本地配置后窃取 token。
|
||||
- 超时拆分为 connect/read/write/pool,不只设一个总数。可从 connect 10 秒、read 60 秒起步,上传/导出另设长超时。
|
||||
- 每次请求加入 `Authorization`(若契约采用 bearer)、`X-Request-ID`、客户端版本、平台、时区和租户信息;不得写入日志的 header 列表默认包含 Authorization、Cookie 和所有临时凭证。
|
||||
- GET/HEAD 和带服务端认可幂等键的写操作,才可对连接错误、超时、429、502、503、504 做指数退避 + jitter;遵守 `Retry-After`。验证错误、普通 4xx 和未知写请求不自动重试。
|
||||
- 所有关键 mutation 生成并持久化 `Idempotency-Key`,直到收到确定结果;请求超时后的状态为“结果未知”,先按键查询/重放,不能直接再创建一条。
|
||||
- 业务错误映射为稳定类型:`ValidationError`、`Unauthenticated`、`Forbidden`、`Conflict`、`RateLimited`、`Maintenance`、`TransportError`、`UnknownServerError`。UI 不解析后端文案。
|
||||
- 支持 ETag/版本字段做乐观锁。收到 409/412 时进入冲突页,展示服务器版本与本地草稿,不做静默覆盖。
|
||||
- 下载/上传流式处理并限制文件大小、MIME 和保存目录。COS 只使用后端签发的预签名 URL或短期临时凭证,绝不打包永久密钥。
|
||||
|
||||
若后端有 OpenAPI,生成的 models/client 放入 `core/api/generated`,外面再包一层业务 adapter;模块不得直接依赖生成器的数据结构。若无 OpenAPI,先写小而明确的 typed endpoint,不做一个接受任意 path/dict 的“万能客户端”。
|
||||
|
||||
实时聊天使用独立 adapter:WebSocket 可运行在一个后台 asyncio loop/thread 中,通过 signal 投递事件;实现心跳、指数重连、服务器 sequence/cursor 补拉、重复消息去重和应用休眠恢复。首版若后端没有可靠续传契约,应采用短轮询而不是假装 WebSocket 永不丢消息。
|
||||
|
||||
### 4.2 Session 状态机
|
||||
|
||||
`SessionManager` 是唯一会话真相,显式状态为:
|
||||
|
||||
```text
|
||||
SIGNED_OUT -> AUTHENTICATING -> AUTHENTICATED
|
||||
AUTHENTICATED -> REFRESHING -> AUTHENTICATED
|
||||
AUTHENTICATED/REFRESHING -> LOCKED | EXPIRED | SIGNED_OUT
|
||||
```
|
||||
|
||||
- access token 只保存在内存;需要“保持登录”时,refresh token 或可续期凭证保存在 OS keychain,不能放在 QSettings、SQLite 明文或日志。
|
||||
- `keyring` 启动时必须检查实际 backend。没有 Windows Credential Manager/macOS Keychain 等安全 backend 时禁用持久登录,而不是退化到明文文件。
|
||||
- 多请求同时遇到 401 时只能有一个 refresh 在飞行,其他请求等待同一个 future;refresh 失败统一切到 `EXPIRED`,避免 401 风暴。
|
||||
- 登出、切换医生或切换租户时:取消网络任务、停止实时连接、退出视频、清内存 token、清空 WebEngine profile、关闭并按用户/租户清理本地缓存密钥。
|
||||
- 支持工作站空闲自动锁定。解锁方式由后端安全策略决定;锁定界面不得继续显示患者姓名、通知正文或缩略图。
|
||||
- 用 `QLocalServer/QLocalSocket` 实现单实例,第二次启动只唤醒现有窗口,避免同一用户同时运行两个 outbox。
|
||||
|
||||
### 4.3 权限模型
|
||||
|
||||
权限码由后端返回并作为服务端授权的镜像,例如 `patient.read`、`record.write`、`prescription.sign`;具体字符串必须以真实契约为准。
|
||||
|
||||
客户端执行三层防误操作:
|
||||
|
||||
1. 路由层:无模块权限时不注册菜单/路由。
|
||||
2. ViewModel/command 层:按钮显示与执行前都检查 `PermissionGuard.require(...)`。
|
||||
3. API 层:403 统一转为 `Forbidden`,刷新权限快照并提示“权限已变更”。
|
||||
|
||||
这些仅改善体验,真正的 RBAC/ABAC、租户隔离和审计必须由后端再次校验。不能因为客户端隐藏了按钮就省略服务端授权。对开方、签名、删除等高风险操作增加 step-up authentication 或明确二次确认,并把 request id/idempotency key 传给服务端审计。
|
||||
|
||||
## 5. 本地数据、离线与错误态
|
||||
|
||||
### 5.1 数据目录与加密
|
||||
|
||||
使用 `QStandardPaths` 或 `platformdirs` 获取每用户目录:Windows 通常位于 `%LOCALAPPDATA%`,macOS 位于 `~/Library/Application Support`。安装目录和 `.app` bundle 始终只读;业务代码不要访问 `sys._MEIPASS`,资源通过 `importlib.resources`/Qt resource system 读取。
|
||||
|
||||
SQLite 使用 WAL、schema migration 和单写入 worker(或每线程独立 connection),不在线程间共享 `sqlite3.Connection`。默认只缓存必要元数据;如果确需缓存患者/病历或离线草稿:
|
||||
|
||||
- 使用 `cryptography` 的 AES-GCM 做版本化记录加密,随机 nonce,密钥由 OS keychain 保存;AAD 包含 tenant/user/table/record id,防止记录调包。
|
||||
- outbox、cache 和密钥按机构 + 用户分区;退出账号做 crypto-erasure(删除密钥)并清理索引。SSD 上不能承诺可靠覆盖删除,因此不能用“反复覆盖文件”作为安全保证。
|
||||
- 设置缓存 TTL、容量上限和最少字段;搜索索引不放诊断正文等敏感内容。
|
||||
- QSettings 只保存主题、窗口大小等无敏感偏好。
|
||||
- 日志不记录患者姓名、手机号、证件号、病历正文、处方内容、token、Cookie 或 URL query;提供用户确认后的脱敏诊断包。
|
||||
|
||||
### 5.2 离线策略
|
||||
|
||||
不要只依赖系统“在线/离线”事件;真正状态以最近请求结果和轻量 health check 综合判定。主壳常驻显示 `在线 / 网络不稳定 / 离线 / 服务维护`,且标明数据最后更新时间。
|
||||
|
||||
写操作按风险分类:
|
||||
|
||||
| 类别 | 离线行为 | 恢复后 |
|
||||
| --- | --- | --- |
|
||||
| 只读列表/详情 | 展示有时间戳的加密缓存,明显标记“可能已过期” | 后台重新验证并原子替换 |
|
||||
| 普通草稿、低风险备注 | 可进入 outbox,保存幂等键、base version 和依赖 | 自动重放;冲突转人工处理 |
|
||||
| 病历最终提交、开方/签方、医嘱、删除等高风险操作 | 只允许保存为本地草稿,禁止假显示“已提交” | 恢复网络后重新拉取服务端版本,由医生确认再提交 |
|
||||
| 视频/实时聊天 | 显示不可用或重连,不能伪造发送成功 | 按 cursor 补拉并去重 |
|
||||
|
||||
Outbox 状态至少包含 `QUEUED -> SENDING -> SUCCEEDED`,以及 `NEEDS_ATTENTION`、`DEAD_LETTER`。保存 payload schema version、创建人/租户、幂等键、重试次数、next attempt、最后错误和服务端 base version。只自动重放白名单 action;切换用户时绝不重放前一用户队列。
|
||||
|
||||
### 5.3 统一错误体验
|
||||
|
||||
所有页面复用下列状态组件,而不是把异常 traceback 或后端原文弹给用户:
|
||||
|
||||
- 首次加载 skeleton;刷新时保留旧数据并显示非阻塞进度。
|
||||
- 真空数据(业务上没有记录)与加载失败严格区分。
|
||||
- 离线且有缓存、离线且无缓存、权限不足、登录过期、字段校验、版本冲突、维护中、未知错误各有独立文案和可行动按钮。
|
||||
- 未知错误显示 request id、发生时间、“重试/复制诊断编号”,详细堆栈只进入脱敏日志。
|
||||
- 全局未捕获异常写入 rotating log 并打开安全错误页;不要自动上传包含医疗数据的 crash dump。
|
||||
|
||||
## 6. 视频与 QtWebEngine 的可执行边界
|
||||
|
||||
### 6.1 首选集成顺序
|
||||
|
||||
1. 先确认腾讯或现有供应商是否提供受支持的 Windows/macOS 原生桌面 SDK 以及 Python 可调用层。如果维护成本可接受,原生 adapter 最可控。
|
||||
2. 若现有成熟能力是 TRTC Web 页面,后端提供一个专用、窄功能、HTTPS 的 `/desktop-call` 类入口(实际路径待定),由 `QWebEngineView` 嵌入。
|
||||
3. 若 SDK/UA/DRM/屏幕共享在 Qt Chromium 中不受支持,可靠回退是系统默认浏览器,不通过修改 UA 或关闭浏览器安全策略强行兼容。
|
||||
|
||||
不要把整套 admin 嵌入桌面壳。JS SDK 的版本和构建产物留在专用 Web 页面侧,Python 只持有 `VideoPort(join, leave, mute, device_changed)` 抽象,这样管理端升级 TRTC SDK 不要求桌面二进制同步发版。
|
||||
|
||||
### 6.2 安全桥接
|
||||
|
||||
- 桌面从后端申请一次性、短有效期的 call ticket;Web 页面再用 ticket 换房间凭证。禁止把 access token、`userSig` 长期放在 URL、日志或 localStorage。
|
||||
- 使用专用 `QWebEngineProfile`。优先 off-the-record;若必须持久化设备选择,也只能保存无认证数据。通话结束时清 Cookie、HTTP cache、permissions 和页面内容。
|
||||
- 导航只允许精确的 HTTPS origin/path allowlist;拦截新窗口、任意下载、`file://`、未知 scheme、跨域跳转和证书错误。证书错误 fail closed。
|
||||
- 相机/麦克风权限只对当前 allowlisted 通话 origin、活跃通话和明确用户操作放行,结束即撤销。屏幕共享另做显式确认。
|
||||
- 若使用 Qt WebChannel,bridge 只暴露少量 typed method/signal,不暴露文件系统、shell、通用 HTTP client、token getter 或任意 Python 调用。每次调用再次校验当前 page origin 和 session/call id。
|
||||
- release 不启用 remote debugging,不设置 `QTWEBENGINE_DISABLE_SANDBOX=1`,不使用 `--no-sandbox`。应用也不以管理员/root 身份运行。
|
||||
|
||||
### 6.3 兼容性与体积现实
|
||||
|
||||
`PySide6` 顶层 wheel 会同时拉入 Essentials 和 Addons;core profile 应直接依赖 `PySide6-Essentials`。WebEngine 位于 Addons,wheel 和最终制品都会显著增大,不能把它当成“小插件”。最终体积以两端产物为准,不承诺一个固定数字。
|
||||
|
||||
QtWebEngine 使用多进程 Chromium,发布物必须保留:
|
||||
|
||||
- `QtWebEngineProcess` helper;
|
||||
- QtWebEngineCore/Widgets 库与所需平台插件;
|
||||
- `qtwebengine_resources*.pak`、`icudtl.dat`、V8 snapshot;
|
||||
- `qtwebengine_locales`(至少完整验证 `zh-CN`、`en-US` 后才可裁剪);
|
||||
- macOS framework/helper 的 bundle 结构和 entitlements。
|
||||
|
||||
H.264/AAC/MP3 等专有 codec 是否可用取决于 QtWebEngine 构建与许可,不能因为 `hls.js` 存在就假设一定能播放。首发验收必须覆盖真实 TRTC/WebRTC、摄像头、麦克风、扬声器切换、屏幕共享(若需求存在)、HLS/录播格式和弱网;若要自行构建启用 proprietary codecs,先完成专利/分发许可评审。
|
||||
|
||||
## 7. PyInstaller 构建与发布
|
||||
|
||||
### 7.1 为什么固定 onedir
|
||||
|
||||
虽然 PyInstaller 支持 onefile,但本项目默认 `onedir`:
|
||||
|
||||
- onefile 每次启动需解压大体积 Chromium,冷启动慢,易触发杀软且临时目录空间不可控;
|
||||
- WebEngine 是多进程,helper、framework、资源和 macOS 签名/沙箱都依赖正确目录结构;
|
||||
- onedir 更容易做增量诊断、签名验证和 installer 管理。
|
||||
|
||||
用户最终仍拿到一个 `.exe` 安装程序或 `.dmg/.pkg`,无需手动管理 onedir 目录。
|
||||
|
||||
### 7.2 spec 设计原则
|
||||
|
||||
维护四个薄 spec,公共配置放 `packaging/common.py`。入口始终为 `src/zyt_doctor/__main__.py`,`pathex=["src"]`;只收集应用 resources 和必要 metadata。WebEngine profile 因 `integrations/video/webengine.py` 中有显式 import,触发 PyInstaller 官方 PySide6 hook;如通过 feature registry 动态加载,再显式加入这些 hidden imports:
|
||||
|
||||
```python
|
||||
VIDEO_HIDDEN_IMPORTS = [
|
||||
"zyt_doctor.integrations.video.webengine",
|
||||
"PySide6.QtWebEngineCore",
|
||||
"PySide6.QtWebEngineWidgets",
|
||||
"PySide6.QtWebChannel",
|
||||
]
|
||||
|
||||
# core spec 中排除,且 core 构建环境根本不安装 Addons
|
||||
CORE_EXCLUDES = [
|
||||
"PySide6.QtWebEngineCore",
|
||||
"PySide6.QtWebEngineWidgets",
|
||||
"PySide6.QtWebEngineQuick",
|
||||
]
|
||||
```
|
||||
|
||||
不要手工把整个 `site-packages/PySide6` 复制进 datas,也不要用 `collect_all("PySide6")`;这会拉入无关 Qt 模块并可能破坏 hook 期望的目录。优先依赖当前锁定 PyInstaller 的 Qt hooks,仅对 self-check 证实遗漏的自有动态模块写自定义 hook。
|
||||
|
||||
macOS `BUNDLE` 至少设置稳定的 bundle id、版本、图标,并在 `Info.plist` 中写清:
|
||||
|
||||
```python
|
||||
info_plist = {
|
||||
"CFBundleIdentifier": "com.zhenyangtang.doctor",
|
||||
"NSCameraUsageDescription": "用于医生视频问诊",
|
||||
"NSMicrophoneUsageDescription": "用于医生视频问诊",
|
||||
"NSHighResolutionCapable": True,
|
||||
}
|
||||
```
|
||||
|
||||
仅当有实际功能时再加入其他 TCC 权限说明。不得加入放宽 ATS 的全局例外。Windows spec 使用有版本信息的 manifest、`.ico` 和 GUI subsystem,同时保留内部异常日志;开发 smoke build 可临时打开 console。
|
||||
|
||||
### 7.3 构建命令骨架
|
||||
|
||||
Windows x64 runner:
|
||||
|
||||
```powershell
|
||||
py -3.12 -m venv .venv-build
|
||||
.venv-build\Scripts\python -m pip install --require-hashes -r requirements\video-win-x64.lock
|
||||
.venv-build\Scripts\python -m PyInstaller --noconfirm --clean packaging\windows\doctor-video.spec
|
||||
dist\DoctorDesktop\DoctorDesktop.exe --self-check
|
||||
```
|
||||
|
||||
macOS arm64 runner:
|
||||
|
||||
```bash
|
||||
python3.12 -m venv .venv-build
|
||||
.venv-build/bin/python -m pip install --require-hashes -r requirements/video-macos-arm64.lock
|
||||
.venv-build/bin/python -m PyInstaller --noconfirm --clean packaging/macos/doctor-video.spec
|
||||
dist/DoctorDesktop.app/Contents/MacOS/DoctorDesktop --self-check
|
||||
```
|
||||
|
||||
PyInstaller 不能从 Windows 生成 macOS `.app`,反之亦然。每次构建从干净环境执行 `--clean`,记录 Python/PySide6/PyInstaller/OS SDK 版本、锁文件 hash、git commit 和产物 SHA-256,保证可追溯。
|
||||
|
||||
### 7.4 WebEngine 自检
|
||||
|
||||
应用提供 `--self-check`,不访问患者数据,检查:
|
||||
|
||||
- build info、只读 resources、可写 data/log/cache 路径;
|
||||
- keyring backend 是否安全、SQLite migration 是否可运行;
|
||||
- TLS CA、production 配置和 host allowlist;
|
||||
- video profile 中通过 `QLibraryInfo` 定位 helper/resources/locales,禁止依赖写死的 `_internal` 路径;
|
||||
- release 环境没有 `QTWEBENGINE_DISABLE_SANDBOX`/`--no-sandbox`;
|
||||
- GUI smoke 模式实际创建 `QWebEngineView`,加载本地无网络测试页,然后退出;真实视频另由端到端测试覆盖。
|
||||
|
||||
任何 helper、`.pak`、ICU、snapshot、platform plugin 或 locale 缺失都应让发布流水线失败,不在运行时静默降级。
|
||||
|
||||
### 7.5 Windows 发布
|
||||
|
||||
1. 使用固定、受控的 Windows x64 runner 构建;不要在装有多套 Qt/Anaconda 的个人机上发正式包。
|
||||
2. QtWebEngine 运行依赖合适的 MSVC runtime。由安装器包含/检查 Microsoft Visual C++ Redistributable(Qt 官方要求的版本下限需按锁定 Qt 再核对),并在干净 VM 验证。
|
||||
3. 用组织的 Authenticode 证书和 RFC 3161 时间戳签名主程序及最终 MSI/EXE 安装器;验证 `signtool verify /pa /all`。
|
||||
4. 安装到 Program Files,用户数据仍进 LocalAppData;普通用户可运行/升级。可用 WiX Toolset/MSIX 或 Inno Setup,选择后固定 UpgradeCode/AppUserModelID 和回滚策略。
|
||||
5. 在 Windows 10/11 干净 VM 上验证安装、升级、卸载后保留/清除用户数据的明确策略、SmartScreen、企业代理、中文路径和非管理员账户。
|
||||
|
||||
### 7.6 macOS 发布
|
||||
|
||||
1. 在目标架构的 macOS runner 构建。PyInstaller 修改 Mach-O 后必须重新签名;使用 Developer ID Application 身份,不用 ad-hoc 签名发布。
|
||||
2. QtWebEngine helper 是嵌套 app/process。必须保留 framework bundle 结构,并确认 helper 使用 Qt 自带的 `QtWebEngineProcess.entitlements` 所需权限签名;主 app 使用项目的 camera/microphone 权限说明和最小 entitlements。签名顺序由内向外,避免用 `codesign --deep` 掩盖错误。
|
||||
3. 执行 `codesign --verify --deep --strict --verbose=2 DoctorDesktop.app` 和 `spctl --assess --type execute`;随后用 `xcrun notarytool submit ... --wait` 公证,staple ticket,再在离线干净 Mac 验证 Gatekeeper。
|
||||
4. 用 DMG/PKG 或能保留 symlink 的方式分发。PyInstaller 6+ 的 POSIX bundle 广泛使用 symlink,普通 zip 若不保留 symlink 可能膨胀或破坏运行。
|
||||
5. 在 Intel(若支持)与 Apple Silicon 真机上分别验证 keychain 升级连续性、摄像头/麦克风 TCC、休眠唤醒、Retina、多显示器和 WebEngine helper 签名。
|
||||
|
||||
### 7.7 常见打包坑清单
|
||||
|
||||
- **Qt binding 混装**:同环境存在 PyQt/PySide2 或系统 Qt,hook 收到冲突库。解决:干净 venv、只安装一种 binding、锁版本。
|
||||
- **误用 onefile**:启动慢、helper/沙箱/签名问题更难复现。解决:正式版固定 onedir。
|
||||
- **动态 import 未分析**:业务模块或 WebEngine 在 registry 中字符串加载。解决:显式 import 或最小 hiddenimports,并用 frozen smoke test 覆盖。
|
||||
- **资源路径错误**:开发机相对路径可用,安装后 CWD 变化。解决:`importlib.resources`/qrc;用户数据用 QStandardPaths。
|
||||
- **过度裁剪 Qt**:删除 `.pak`、ICU、snapshot、locale、platform plugin 后只在某些机器崩。解决:先保留 hook 输出,按真实清单与测试有证据地裁剪。
|
||||
- **macOS 签名次序/entitlements 错**:QtWebEngineProcess 启动即退出或 TCC 不弹窗。解决:嵌套 helper 真机测试、由内到外签、notarize/staple。
|
||||
- **归档破坏 symlink**:`.app` 体积暴涨或 framework 无法加载。解决:DMG/ditto 或明确保留 symlink 的归档工具。
|
||||
- **GPU/远程桌面差异**:WebEngine 黑屏。不要默认全局 `--disable-gpu`;收集诊断后提供经验证的软件渲染或外部浏览器 fallback。
|
||||
- **codec 误判**:开发机能播 H.264,发布 wheel 不能播。解决:把真实媒体矩阵列入 artifact 验收和许可评审。
|
||||
- **杀软与信誉**:大量 DLL/helper 或未签名 nightly 被拦截。解决:正式证书、时间戳、稳定 installer identity、干净 VM/主流安全软件测试。
|
||||
- **升级破坏 keychain/数据**:bundle id、签名 identity 或 schema 不稳定。解决:这些值从首版固定,migration 支持备份与回滚。
|
||||
|
||||
## 8. 安全与隐私基线
|
||||
|
||||
- TLS 校验永远开启。企业私有 CA 应通过受管安装进入系统 trust store;不得用 `verify=False`。如需兼容企业代理,可用 `truststore` 接入 OS 证书库并做专项测试。
|
||||
- 本地配置不能提供任意 production host 重定向;敏感 token 永远不进入 URL query、clipboard、日志、analytics 或 crash report。
|
||||
- HTML 病历优先用受限 `QTextBrowser`/原生富文本展示并在服务端净化;不要因为“要展示 HTML”就引入 WebEngine。任何外链由用户确认后交给系统浏览器。
|
||||
- 限制剪贴板和通知中的患者信息;自动锁定后遮蔽窗口内容。截图阻止在跨平台上不可靠,不能作为合规控制。
|
||||
- 所有高风险业务写操作由服务端保留不可抵赖审计;客户端日志只记录事件名、耗时、状态、request id 和脱敏技术上下文。
|
||||
- 发布前完成依赖 SBOM、许可证清单和漏洞扫描。PySide6 采用 LGPLv3/GPLv3 或商业许可,QtWebEngine/Chromium/codec 还包含额外 notices;由法务确认采用的 Qt 许可与分发义务,安装包附第三方 notices。
|
||||
- 自动升级若后续实现,更新 manifest 必须签名,制品必须校验 SHA-256 与平台签名,并支持回滚;首版宁可用已签名安装器提示升级,也不要执行未签名下载内容。
|
||||
|
||||
## 9. 测试与发布门槛
|
||||
|
||||
### 9.1 自动化测试分层
|
||||
|
||||
- **unit**:权限 guard、会话状态机、单飞 refresh、重试白名单、错误映射、缓存 TTL、加解密、outbox 状态和冲突决策。用 fake clock/random/secret store,保证确定性。
|
||||
- **API contract**:以 OpenAPI schema 或后端 mock 验证字段、错误码、分页、时间和幂等语义;`respx` 模拟超时、断流、401 并发、429/Retry-After、5xx 和结果未知。
|
||||
- **integration**:临时 SQLite + fake keyring + staging API,覆盖 migration、损坏缓存、磁盘满、退出清理、租户切换和代理/私有 CA。
|
||||
- **UI**:`pytest-qt` 验证路由权限、loading/empty/error/offline、键盘导航、取消和 late response;不要用脆弱的像素级截图替代行为断言。
|
||||
- **frozen artifact**:Windows/macOS 各自安装后运行 `--self-check`,启动主窗口、登录 mock/staging、访问资源、写用户目录、升级 migration、卸载。
|
||||
- **视频真机**:摄像头/麦克风授权与拒绝、无设备、设备热插拔、回声设备、弱网/断网重连、休眠唤醒、屏幕共享、录播 codec、结束后权限与 Cookie 清理。
|
||||
|
||||
重点故障用例包括:十个请求同时 401、提交后响应丢失、服务器版本冲突、系统时钟偏差、刷新时退出、缓存被截断、keychain 被锁、两实例竞争、磁盘只读、API 维护、WebEngine helper 被杀、证书过期。测试数据必须是合成数据。
|
||||
|
||||
### 9.2 CI 矩阵与质量门槛
|
||||
|
||||
PR 阶段可并行运行 Windows x64 和 macOS arm64 的 lint/type/unit/UI headless 测试。release tag 阶段在原生 runner 生成制品并执行:
|
||||
|
||||
1. `ruff`、`mypy`、unit/contract/integration 测试全绿,覆盖率阈值重点约束 core 状态机而非 UI 行数。
|
||||
2. 依赖 lock、SBOM、license、`pip-audit` 无未批准的高危项。
|
||||
3. 两端 frozen self-check 与安装/升级 smoke 通过。
|
||||
4. 签名、公证、hash、版本资源和 update channel 验证通过。
|
||||
5. video profile 在目标硬件的人工/自动验收清单签字;core profile 证明不会意外收集 QtWebEngine。
|
||||
6. staging 完成登录、权限变更、患者查询、一个低风险写操作、一个高风险确认、登出清理和离线恢复闭环。
|
||||
|
||||
## 10. 实施顺序与验收里程碑
|
||||
|
||||
### M0:契约和风险封板(约 3–5 天)
|
||||
|
||||
- 获取 OpenAPI/认证/权限/RTC/对象存储契约;形成 endpoint 与权限矩阵。
|
||||
- 在 Windows/macOS 原型中用 QtWebEngine 打开专用测试页,验证 TRTC/WebRTC、设备权限和目标 codec。
|
||||
- 决定首发是 core、video 还是“core + 外部浏览器”。
|
||||
|
||||
**退出条件**:API base 和 auth 不再是假设;视频路线有真实 PoC,而非只证明网页能打开。
|
||||
|
||||
### M1:可发布骨架
|
||||
|
||||
- 完成 bootstrap、配置校验、日志/路径、API client、SessionManager、PermissionGuard、shell 和统一状态组件。
|
||||
- mock server 下完成登录、`/me`、权限菜单、401 single-flight refresh、登出清理。
|
||||
- 两端 onedir unsigned nightly 可安装并通过 self-check。
|
||||
|
||||
### M2:业务纵切
|
||||
|
||||
- 先选一个完整纵切(例如预约 -> 患者概要 -> 诊间记录草稿),按 module 结构贯穿 UI、service、API、权限和测试。
|
||||
- 再并行扩展患者、病历、处方、随访、聊天;高风险操作必须有后端幂等/审计。
|
||||
|
||||
### M3:离线与视频
|
||||
|
||||
- 实现加密 cache/outbox、冲突页、断网/恢复和数据清理。
|
||||
- video adapter、受限 profile、一次性 ticket、权限撤销和外部浏览器 fallback 完成。
|
||||
|
||||
### M4:生产发布
|
||||
|
||||
- 锁依赖和 runner image,完成 Windows Authenticode、macOS Developer ID/notarization、SBOM/许可证。
|
||||
- 干净 VM/真机、企业代理、非管理员、升级/回滚、视频设备矩阵全部通过。
|
||||
|
||||
## 11. 最终架构决策摘要
|
||||
|
||||
1. 业务 UI 用原生 Qt Widgets;QtWebEngine 是隔离的视频实现细节,不是应用架构。
|
||||
2. 后端契约、服务端授权和服务端审计是权威;桌面端只做强类型 adapter、体验 guard 和安全状态管理。
|
||||
3. access token 仅在内存,长期凭证进 OS keychain;敏感离线数据加密且按用户/租户隔离。
|
||||
4. 高风险医疗写操作离线时只能保存草稿,恢复后由医生确认;普通 outbox 依赖幂等键和乐观锁。
|
||||
5. 发布固定 PyInstaller onedir、平台原生构建、签名和 artifact 级测试;不交叉编译,不依赖开发机“能跑”。
|
||||
6. production URL、SDK secret、对象存储密钥和 RTC 签名密钥都不能硬编码进客户端。
|
||||
|
||||
## 参考资料
|
||||
|
||||
- [Qt for Python package details](https://doc.qt.io/qtforpython-6.10/package_details.html):Essentials/Addons 拆分和 wheel 内容。
|
||||
- [Qt for Python 与 PyInstaller](https://doc.qt.io/qtforpython-6.10/deployment/deployment-pyinstaller.html):官方 PyInstaller 基础部署说明。
|
||||
- [Qt WebEngine 部署](https://doc.qt.io/qt-6/qtwebengine-deploying.html):helper、resources、locales、macOS entitlements 等必需项。
|
||||
- [Qt WebEngine features](https://doc.qt.io/qt-6/qtwebengine-features.html):WebRTC/媒体能力及专有 codec 许可提醒。
|
||||
- [PyInstaller macOS multi-arch 与签名](https://pyinstaller.org/en/stable/feature-notes.html):架构 slice 和 codesign 行为。
|
||||
- [PyInstaller symlink/common pitfalls](https://pyinstaller.org/en/stable/common-issues-and-pitfalls.html):PyInstaller 6+ POSIX bundle 的 symlink 分发要求。
|
||||
|
||||
@@ -0,0 +1,565 @@
|
||||
# 诊单详情 / 编辑 / 预约视觉规格(后台源码基准)
|
||||
|
||||
## 1. 范围与判读原则
|
||||
|
||||
本规格只以 `D:/web/zyt/admin` 当前源码为事实源,覆盖:
|
||||
|
||||
- 三个主视图:`src/views/tcm/diagnosis/edit.vue`、`readonly.vue`、`appointment.vue`。
|
||||
- 三个主视图直接渲染的诊单组件:患者摘要、病例、日常记录、医生备注、处方/病例记录、业务订单、视频、聊天、医助指派历史、挂号历史、待办。
|
||||
- 备注视图直接引用的 `src/views/patient/reception/components/NoteTimeline.vue`。
|
||||
- 直接生效的全局样式入口、Element Plus 变量和 Tailwind 尺寸映射。
|
||||
|
||||
颜色、尺寸若由当前文件明确声明,标为“显式”;若控件仅沿用 Element Plus,则标为“继承”。项目使用 Element Plus `^2.9.4` 与 Tailwind CSS `^3.4.17`(`package.json:27,64`)。全局样式入口为 `main.ts:1-3`,依次加载 `element.scss`、`dark.css`、`var.css`、`tailwind.css`、`public.scss`(`src/styles/index.scss:1-5`)。因此不能把浏览器/Element 默认值误写成某个业务组件的局部规格。
|
||||
|
||||
> 关键结论:系统实际上有两种“只读详情”。`readonly.vue` 是独立、卡片化、纵向详情页;`edit.vue` 在 `viewOnly` 模式下则仍是右侧抽屉和 Tab 结构,只禁用编辑控件。两者不能用同一个线框替代。
|
||||
|
||||
---
|
||||
|
||||
## 2. 全局视觉基础
|
||||
|
||||
### 2.1 字体与字号
|
||||
|
||||
字体栈由 Tailwind 配置明确为 `PingFang SC, Arial, Hiragino Sans GB, Microsoft YaHei, sans-serif`(`tailwind.config.js:79-80`),并赋给 `--el-font-family`(`src/styles/var.css:1-3`)。基础字号如下(`src/styles/var.css:11-18`):
|
||||
|
||||
| 语义 | 实际字号 |
|
||||
|---|---:|
|
||||
| extra large | 18 px |
|
||||
| large | 16 px |
|
||||
| medium | 15 px |
|
||||
| base | 14 px |
|
||||
| small | 13 px |
|
||||
| extra small | 12 px |
|
||||
|
||||
业务层进一步压缩:编辑抽屉根节点和表单文字为 12 px(`edit.vue:1476-1504,1532-1556`);只读病例键值为 12.5 px(`components/PatientCaseCard.vue:307-341`);聊天气泡为 14 px(`components/ImChatRecordPanel.vue:260-286`)。
|
||||
|
||||
### 2.2 全局颜色与表面
|
||||
|
||||
以下均为项目显式变量(`src/styles/var.css:20-40`):
|
||||
|
||||
| 用途 | 色值 |
|
||||
|---|---|
|
||||
| 页面底 | `#f6f6f6` |
|
||||
| 普通/浮层底 | `#ffffff` |
|
||||
| 主文字 | `#333333` |
|
||||
| 常规文字 | `#666666` |
|
||||
| 次要文字 | `#999999` |
|
||||
| placeholder | `#a8abb2` |
|
||||
| disabled | `#c0c4cc` |
|
||||
| border / light / lighter | `#dcdfe6` / `#e4e7ed` / `#ebeef5` |
|
||||
| extra-light border | `#f2f2f2` |
|
||||
| fill / light / lighter | `#f0f2f5` / `#f8f8f8` / `#fafafa` |
|
||||
| extra-light fill | `#fafcff` |
|
||||
|
||||
Element 语义主色未在这些诊单文件中改写,局部引用 `var(--el-color-primary)` 或显式 `#409eff`。继承的 Element Plus 2.9.4 常规控件高度为 32 px(small 24 px、large 40 px);但编辑抽屉底部按钮被局部覆盖为最小 40 px,移动端最小 44 px(`edit.vue:1732-1740,1905-1913`)。
|
||||
|
||||
### 2.3 间距基线和全局行为
|
||||
|
||||
Tailwind 间距映射是 4 px 基线:`1=4`、`2=8`、`2.5=10`、`3=12`、`3.5=14`、`4=16`、`5=20`、`6=24`(`tailwind.config.js:103-125`)。业务文件里的 8/10/12/14/16/18/20/24 px 与该节奏一致。
|
||||
|
||||
直接影响这些页面的全局规则:
|
||||
|
||||
- Dialog 居中,最大宽 `calc(100vw - 30px)`,圆角 5 px(`src/styles/element.scss:11-27`)。
|
||||
- 全局 Drawer 主内边距变量为 16 px,Header 内边距 `13px 16px`、下边框 1 px lighter;预约 Drawer 没有重写这些值,编辑 Drawer 则只额外重写背景与边框(`src/styles/element.scss:46-56`)。
|
||||
- 全局表格字号 14 px、表头主文字色、表头字重 400、表头底 `#f8f8f8`(`src/styles/element.scss:58-68`; `src/styles/var.css:10`)。因此编辑根节点的 12 px 不应错误地传成所有表格单元字号。
|
||||
- Input、Select、Textarea 聚焦时出现 2 px primary-light 外环,radio/checkbox active 也有 2 px 外环;校验错误时切换 danger-light 外环(`src/styles/element.scss:140-175`)。
|
||||
- Tabs 底线全局压至 1 px(`src/styles/element.scss:131-133`)。
|
||||
- 消息与通知层级为 9999(`src/styles/element.scss:1-9`)。
|
||||
- 小于等于 768 px 时分页隐藏页码跳转与 page-size 选择器(`src/styles/element.scss:177-183`)。
|
||||
- Tailwind 会导入 base/components/utilities(`src/styles/tailwind.css:1-3`),但 Element 按钮背景、focus、hover 被重新还原为 Element 变量,避免被 Tailwind reset 覆盖(`src/styles/element.scss:186-200`)。
|
||||
- `body` 为 14 px 主文字、`overflow:hidden`、最小宽 375 px;页面/Drawer 自己承担滚动(`src/styles/public.scss:1-3`)。全局 `.form-tips` 为 12 px secondary、行高 24 px、上间距 4 px(`src/styles/public.scss:4-6`)。
|
||||
|
||||
暗色主题另有一套直接全局变量:页面/表面为 `#0a0a0a / #1d2124 / #1d1e1f`,主/常规/次要文字为 `#e5eaf3 / #cfd3dc / #a3a6ad`,边框从 `#636466` 到 `#2b2b2c`,遮罩为 `rgba(0,0,0,.8)`(`src/styles/dark.css:1-31`)。不过三个诊单主视图及卡片大量显式写入白底、浅蓝渐变和 slate 色,不能完整随暗色变量切换;本规格后续均按源码默认浅色态记录,暗色不能视为已完整适配。
|
||||
|
||||
---
|
||||
|
||||
## 3. 独立只读详情页 `readonly.vue`
|
||||
|
||||
### 3.1 页面骨架
|
||||
|
||||
源码结构是单列滚动页,不使用 Tabs(`readonly.vue:1-149`):
|
||||
|
||||
```text
|
||||
┌─────────────────────────────────────────────────────────────────────┐
|
||||
│ ← 返回 诊单只读详情 张三 男 · 42岁 [未服务 3天] │
|
||||
├─────────────────────────────────────────────────────────────────────┤
|
||||
│ [患者信息摘要 PatientInfoCard] │
|
||||
├─────────────────────────────────────────────────────────────────────┤
|
||||
│ [患者病例 PatientCaseCard] │
|
||||
├─────────────────────────────────────────────────────────────────────┤
|
||||
│ [日常记录 DailyMatrix] 按权限可见 │
|
||||
├─────────────────────────────────────────────────────────────────────┤
|
||||
│ [医生备注/舌象/报告 NoteTimeline] │
|
||||
├─────────────────────────────────────────────────────────────────────┤
|
||||
│ [业务订单 PatientOrderList] 按权限可见 │
|
||||
├─────────────────────────────────────────────────────────────────────┤
|
||||
│ [视频录制回放 CallRecordPanel] 按权限可见 │
|
||||
├─────────────────────────────────────────────────────────────────────┤
|
||||
│ [聊天 ImChatRecordPanel] 按权限可见 │
|
||||
├─────────────────────────────────────────────────────────────────────┤
|
||||
│ [指派医助记录 AssignLogPanel] 按权限可见 │
|
||||
├─────────────────────────────────────────────────────────────────────┤
|
||||
│ [挂号记录 AppointmentRecordPanel] 按权限可见 │
|
||||
└─────────────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
渲染顺序严格来自 `readonly.vue:39-146`;异常时在 hero 下方显示错误空态(`readonly.vue:31-36`)。页面根容器垂直间距 16 px、内边距 16 px(`readonly.vue:269-273`)。
|
||||
|
||||
### 3.2 顶部 Hero
|
||||
|
||||
Hero 是可换行的左右布局:`display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px`,内边距 `12px 16px`,圆角 12 px,边框 `#dde7ff`,背景为 `#f5f8ff → #eef3ff` 的浅蓝渐变(`readonly.vue:275-285`)。
|
||||
|
||||
- 页面标题:16 px / 700(`readonly.vue:286-303`)。
|
||||
- 患者姓名:18 px / 700;性别年龄 13 px(`readonly.vue:305-320`)。
|
||||
- 未服务状态胶囊:12 px / 600,内边距 `4px 10px`,999 px 全圆角(`readonly.vue:323-330`)。
|
||||
- 状态色:正常绿 `#16a34a` / 边框 `#bbf7d0`;提醒橙 `#ea580c` / `#fed7aa`;严重红 `#dc2626` / `#fecaca`(`readonly.vue:332-355`)。从未记录时使用 Element placeholder 灰。
|
||||
|
||||
### 3.3 卡片规格
|
||||
|
||||
通用详情卡为白底、1 px `#e6ebf2` 边框、14 px 圆角、18 px 内边距、14 px 内部纵向间距和轻阴影(`readonly.vue:364-373`)。卡片标题 15 px / 700,标题前为 `3 × 16 px` 蓝色标记(`readonly.vue:375-396`)。DailyMatrix 外层额外 16 px 内边距以对齐矩阵(`readonly.vue:398-405`)。错误空态卡保持 14 px 圆角并有 40 px 纵向内边距(`readonly.vue:357-362`)。
|
||||
|
||||
患者摘要内部是浅蓝 Hero 卡:圆角 12 px,内边距 `16px 18px`,行距 6 px;患者名 22 px / 700,其余信息 13 px、行高 1.7(`components/PatientInfoCard.vue:78-123`)。字段顺序是:
|
||||
|
||||
1. 姓名。
|
||||
2. 脱敏手机 · 性别 · 年龄。
|
||||
3. 身高 / 体重 · 地区。
|
||||
4. 预约日期时间 · 时段。
|
||||
5. 医生 / 医助。
|
||||
6. 预约状态 · 是否已开方。
|
||||
7. 备注(有值才显示)。
|
||||
|
||||
顺序由 `components/PatientInfoCard.vue:6-25` 确定。
|
||||
|
||||
### 3.4 病例字段顺序与网格
|
||||
|
||||
病例卡以分组标题 + 网格键值展示;组间 `gap:10px`,除首组外顶部 12 px 内边距并有 dashed 分隔线(`components/PatientCaseCard.vue:258-269`)。分组标题 13 px / 600、蓝色,前有 4 px 圆点(`components/PatientCaseCard.vue:271-287`)。网格横向间距 16 px、纵向 8 px,并提供 1/2/3/4 等分列(`components/PatientCaseCard.vue:289-305`)。键值字号 12.5 px、行高 1.55,label 最小宽 58 px;label 为 `#6b7280`,value 为 `#1f2937` / 500,空值为 `#c0c4cc`(`components/PatientCaseCard.vue:307-341`)。
|
||||
|
||||
只读病例的真实字段顺序(`components/PatientCaseCard.vue:8-124`):
|
||||
|
||||
| 分组 | 列数 | 顺序 |
|
||||
|---|---:|---|
|
||||
| 基本信息 | 4 | 诊单ID、姓名、身份证、手机、性别、年龄、婚姻、地区 |
|
||||
| 生命体征 | 4 | 身高、体重、高压、低压、诊断类型、空腹血糖、在用药物(多行) |
|
||||
| 主诉 | 4 | 当地诊断日期、糖尿病病史、当地医院、当地医院诊断结果 |
|
||||
| 现病史 | 3 | 口腔、饮水、体重变化、脂肪肝、饮食(跨2列)、肢体、睡眠、眼、头、出汗、皮肤、小便、大便、腰肾、其他补充(跨3列、多行) |
|
||||
| 既往史 | 1 | 既往史(整行) |
|
||||
| 其他病史 | 混合 | 外伤、手术、过敏、家族、妊娠 |
|
||||
| 补充与意见 | 1 | 病史补充(有值才显示)、处方意见 |
|
||||
|
||||
超标指标采用 `#dc2626`、700 字重并带上箭头(`components/PatientCaseCard.vue:343-358`)。处方意见为 13 px、`12px 14px` 内边距、8 px 圆角、左侧 3 px 蓝条(`components/PatientCaseCard.vue:360-368`)。
|
||||
|
||||
### 3.5 响应式事实
|
||||
|
||||
`readonly.vue` 自身没有 media query;Hero 仅通过 `flex-wrap` 避免左右信息互相挤压。`PatientCaseCard.vue` 也没有窄屏降列规则,所以 4 列病例网格不会自动变成 1 列。实现 PySide 时不能把“可换行 Hero”误判为整页已经完整响应式。
|
||||
|
||||
---
|
||||
|
||||
## 4. 编辑 / 抽屉只读 `edit.vue`
|
||||
|
||||
### 4.1 框架与模式
|
||||
|
||||
右侧 Drawer 宽度固定为视口的 60%,方向 RTL;只读时 z-index 4000,编辑/新增时 1500(`edit.vue:2-10`)。抽屉有三种标识:只读 `info`、新建 `success`、编辑 `warning`,标题下显示“患者名 · 诊单ID”(`edit.vue:11-54,859-863`)。
|
||||
|
||||
```text
|
||||
桌面(右侧 60% Drawer)
|
||||
┌───────────────────────────────────────────────────────────────┐
|
||||
│ 编辑诊单 [编辑] 患者名 · #123 │ Header
|
||||
├───────────────────────────────────────────────────────────────┤
|
||||
│ 病历 │ 医生备注 │ 日常记录 │ 处方 │ 业务订单 │ 视频 │ ... → │ Tabs
|
||||
├───────────────────────────────────────────────────────────────┤
|
||||
│ │
|
||||
│ [锁定提示 / 隐私提示,按条件] │
|
||||
│ 诊单ID [_____________________________] │
|
||||
│ 姓名 [____________] 身份证 [____________] │
|
||||
│ │
|
||||
│ ──────────────── 生命体征 ──────────────── │
|
||||
│ 婚姻 [____] 身高 [____] 体重 [____] │ Scroll body
|
||||
│ ... │
|
||||
│ ──────────────── 现病史 ───────────────── │
|
||||
│ [可换行 radio / checkbox 组] │
|
||||
│ │
|
||||
├───────────────────────────────────────────────────────────────┤
|
||||
│ [取消/关闭] [保存] │ Footer slot
|
||||
└───────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
`viewOnly` 模式没有切换到独立详情卡,而是给病历 `fieldset` 禁用输入,并隐藏保存;锁定患者信息时显示 warning alert(`edit.vue:57-84,766-781`)。
|
||||
|
||||
### 4.2 Header、Tabs、Footer
|
||||
|
||||
- Header 背景 `#fff → #f8fafc`,底边 1 px `#e2e8f0`(`edit.vue:1776-1785`)。标题 18 px / 600 / `#0f172a`,行高 1.3;副标题 13 px(`edit.vue:1670-1717`)。
|
||||
- Body 背景 `#f8fafc`(`edit.vue:1787-1790`)。
|
||||
- Tabs 横向滚动,滚动条 4 px;nav 使用 `max-content` 且最小宽 100%,tab 水平内边距 14 px,常态 `#64748b` / 500,激活态为 Element primary / 600,激活条 3 px(`edit.vue:1798-1858`)。
|
||||
- Footer 最终生效样式为白底、上边框 1 px `#e2e8f0`,内容右对齐、gap 12 px、内边距 `14px 20px 18px`(`edit.vue:1719-1730,1860-1864`)。按钮最小高 40 px、水平内边距 20 px、600 字重、圆角 10 px(`edit.vue:1732-1740`)。
|
||||
|
||||
这里没有 CSS `position: sticky`。底部操作之所以视觉上固定,是因为它使用 Element Drawer 的独立 footer slot,位于可滚动 body 之外(模板 `edit.vue:766-781`;结构样式 `edit.vue:1792-1796`)。PySide 应以固定底栏实现,而不是在滚动内容末尾放按钮。
|
||||
|
||||
### 4.3 Tab 顺序、权限与内容
|
||||
|
||||
Tab 的准确顺序和门槛(`edit.vue:55-759`):
|
||||
|
||||
| 序号 | Tab | 条件 | 内容组件 |
|
||||
|---:|---|---|---|
|
||||
| 1 | 病历 | 始终 | 内联表单 |
|
||||
| 2 | 医生备注 | 始终 | `NoteTimeline` |
|
||||
| — | 跟踪备注 | **已注释,不渲染** | 原拟 `TrackingNoteTimeline`(`edit.vue:644-654`) |
|
||||
| 3 | 日常记录 | `tcm.diagnosis/dailyRecord` | `DailyMatrix` |
|
||||
| 4 | 处方 | `tcm.diagnosis/chufang` | `CaseRecordList` |
|
||||
| 5 | 业务订单 | `tcm.diagnosis/patientOrders` | `PatientOrderList` |
|
||||
| 6 | 视频录制回放 | `tcm.diagnosis/huifang` | `CallRecordPanel` |
|
||||
| 7 | 聊天 | `tcm.diagnosis/chat` | `ImChatRecordPanel` |
|
||||
| 8 | 指派医助记录 | `tcm.diagnosis/assign` 或 `tcm.diagnosis/detail` | `AssignLogPanel` |
|
||||
| 9 | 挂号记录 | `doctor.appointment/lists` | `AppointmentRecordPanel` |
|
||||
|
||||
权限变化后若当前 Tab 失权,代码会主动回到 `basic`(`edit.vue:883-913`)。除病历外的大部分 Tab 为 lazy 内容,首次选中才加载。
|
||||
|
||||
### 4.4 病历表单布局、标签和控件
|
||||
|
||||
桌面表单 label width 为 160 px(`edit.vue:61-63`)。根字号、label、输入/textarea/radio/checkbox/button 均显式为 12 px;label 为 500 / `#606266`(`edit.vue:1476-1504,1532-1556`)。表单项底部间距 18 px(`edit.vue:1528-1530`)。输入、选择、日期、数字框圆角 10 px(`edit.vue:1645-1667`);普通输入高度沿用 Element 32 px。
|
||||
|
||||
分组标题的上/下外边距为 28/22 px;中间文字 14 px / 600 / `#0f172a`、`7px 16px` 内边距、999 px 胶囊圆角,两侧 1 px `#e2e8f0` 横线(`edit.vue:1506-1525`)。单选紧凑组换行、gap 12 px;复选组 gap `12px 16px`;普通 radio/checkbox 右、下间距分别 16/8 px(`edit.vue:1558-1604`)。帮助文本 12 px、`#909399`、行高 1.5、顶部 4 px(`edit.vue:1606-1611`)。
|
||||
|
||||
### 4.5 编辑表单的真实字段顺序
|
||||
|
||||
以下只列实际渲染字段,不把 `formData` 中未渲染的属性当作 UI(模板 `edit.vue:57-632`):
|
||||
|
||||
| 区段 | 栅格 | 字段顺序与控件 |
|
||||
|---|---|---|
|
||||
| 顶部 | 24 | 诊单ID(只读) |
|
||||
| 基本身份 | 12 + 12 | 姓名;身份证 |
|
||||
| 联系信息 | 12 + 12 | 手机;性别 |
|
||||
| 年龄 | 12 | 年龄 |
|
||||
| **生命体征** | 8 + 8 + 8 | 婚姻;身高;体重 |
|
||||
| | 8 + 8 + 8 | 地区;高压;低压 |
|
||||
| | 8 | 空腹血糖 |
|
||||
| | 12 | 诊断类型 |
|
||||
| | 12 + 12 | 状态;渠道 |
|
||||
| | 12 | 统计端就诊卡 |
|
||||
| | 12 | 在用药物,textarea,3 行,maxlength 2000 |
|
||||
| **主诉** | 12 + 12 | 当地诊断日期;糖尿病病史 |
|
||||
| | 24 | 当地医院诊断结果(check buttons) |
|
||||
| | 24 | 当地医院名称 |
|
||||
| **现病史** | 24 | 口腔感觉(check buttons) |
|
||||
| | 24 | 每日饮水量(radio buttons) |
|
||||
| | 24 | 近月体重变化(radio buttons) |
|
||||
| | 24 | 脂肪肝(radio buttons) |
|
||||
| | 24 | 饮食(check buttons) |
|
||||
| | 24 × 9 | 肢体、睡眠、眼睛、头部、出汗、皮肤、小便、大便、腰肾 |
|
||||
| | 24 | 其他补充,textarea,3 行 |
|
||||
| **既往史** | 24 | 既往史(check buttons) |
|
||||
| **其他病史** | 8 + 8 + 8 | 外伤;手术;过敏 |
|
||||
| | 12 + 12 | 家族;妊娠 |
|
||||
| **诊断信息** | 24 | 病史补充,textarea,2 行 |
|
||||
|
||||
具体模板行:顶部/身份 `edit.vue:86-194`;生命体征 `edit.vue:199-368`;主诉 `edit.vue:369-412`;现病史 `edit.vue:414-549`;既往史 `edit.vue:552-564`;其他病史 `edit.vue:567-613`;诊断信息 `edit.vue:616-629`。
|
||||
|
||||
当前模板没有显示 `syndrome_type`、`diabetes_type`、舌象、脉象、治则、医嘱等字段,即便脚本模型中存在,也不应擅自加入视觉复刻。
|
||||
|
||||
### 4.6 移动端
|
||||
|
||||
小于等于 768 px 时(`edit.vue:1876-2004`):
|
||||
|
||||
- Drawer 变为 100vw;header `12px 14px`,body `10px 12px`。
|
||||
- Footer 改为纵向、按钮全宽,gap 10 px,内边距 `12px 14px + safe-area`,按钮最小 44 px。
|
||||
- 标题 17 px;Tab 高/行高 44 px、字号 13 px、水平内边距 12 px。
|
||||
- label 改到控件上方:100% 宽、左对齐、下间距 6 px;表单项底部 14 px。
|
||||
- 所有 `el-col` 强制 100%,数字框 100%;radio gap `8px 16px`,checkbox `8px 10px`。
|
||||
- 分组标题外边距 18/14 px,文字 13 px、水平内边距 10 px。
|
||||
|
||||
```text
|
||||
移动端(<=768)
|
||||
┌──────────────────────┐
|
||||
│ 标题 [状态] × │
|
||||
│ 患者 · 诊单ID │
|
||||
├──────────────────────┤
|
||||
│ ← 可横向滚动 Tabs → │
|
||||
├──────────────────────┤
|
||||
│ 姓名 │
|
||||
│ [__________________] │
|
||||
│ 身份证 │
|
||||
│ [__________________] │
|
||||
│ ... 全部单列 ... │
|
||||
├──────────────────────┤
|
||||
│ [取消/关闭 全宽] │
|
||||
│ [保存 全宽,44px+] │
|
||||
└──────────────────────┘
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 5. 预约抽屉 `appointment.vue`
|
||||
|
||||
### 5.1 骨架与字段顺序
|
||||
|
||||
预约同样是 RTL 右侧 Drawer,宽 60%,z-index 2000,且点击遮罩不能关闭(`appointment.vue:2-9`)。表单 label width 为 100 px(`appointment.vue:19`)。
|
||||
|
||||
```text
|
||||
┌───────────────────────────────────────────────────────────────┐
|
||||
│ 预约面诊 × │
|
||||
├───────────────────────────────────────────────────────────────┤
|
||||
│ [今日重复预约警告 / 其他日期提示,条件显示] │
|
||||
│ 上次面诊 2026-08-01 10:30 │
|
||||
│ 预约方式 (●) 按时间预约 │
|
||||
│ 预约类型 (●) 视频面诊 │
|
||||
│ 预约患者 (●) 当前患者 │
|
||||
│ 渠道来源 [请选择 ▼] │
|
||||
│ 自媒体详情 [请选择 ▼] ← 仅自媒体渠道 │
|
||||
│ 预约医生 ( ) 医生A ( ) 医生B ... │
|
||||
│ 预约时间 [08月10日 周一] [08月11日 周二] ... │
|
||||
│ ┌───────────────────────────────────────────┐ │
|
||||
│ │ 可预约时段 [刷新] │ │
|
||||
│ │ [09:00 可约] [09:30 已满] [10:00 可约] ...│ │
|
||||
│ └───────────────────────────────────────────┘ │
|
||||
│ 备注 [_________________________________________] │
|
||||
├───────────────────────────────────────────────────────────────┤
|
||||
│ [取消] [确认预约] │
|
||||
└───────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
字段顺序严格为(`appointment.vue:21-181`):
|
||||
|
||||
1. 上次面诊(文本)。
|
||||
2. 预约方式(当前只呈现按时间预约)。
|
||||
3. 预约类型(视频)。
|
||||
4. 预约患者(当前患者)。
|
||||
5. 渠道来源(必填 select)。
|
||||
6. 自媒体详情(渠道命中自媒体白名单时必填)。
|
||||
7. 预约医生(radio 列表)。
|
||||
8. 预约时间:先日期按钮,后可预约时段矩阵。
|
||||
9. 备注(textarea,2 行)。
|
||||
10. Footer:取消、确认预约。
|
||||
|
||||
### 5.2 尺寸、颜色与交互状态
|
||||
|
||||
- 渠道控件宽 100%、最大宽 360 px(`appointment.vue:741-750`)。
|
||||
- 医生/单选组可换行,gap 12 px(`appointment.vue:752-765,911-921`)。
|
||||
- 日期按钮 flex-wrap、gap 10 px、最小宽 130 px、高 40 px、字号 14 px、圆角 8 px;hover 上移 2 px并加阴影(`appointment.vue:771-789`)。
|
||||
- 时段容器底 `#f8f9fa`、圆角 8 px、内边距 16 px;标题 15 px / 600 / `#303133`(`appointment.vue:791-808`)。
|
||||
- 时段网格 `auto-fill minmax(110px,1fr)`、gap 10 px、最大高 450 px并滚动,滚动条宽 6 px(`appointment.vue:810-830`)。
|
||||
- 时段卡白底,2 px `#e4e7ed` 边框、8 px 圆角、最小高 70 px、水平内边距 8 px;时间 15 px / 600 / `#303133`,状态 12 px / `#909399`(`appointment.vue:831-862`)。
|
||||
- 可约 hover:`#409eff` 边框、`#ecf5ff` 底、上移并加阴影(`appointment.vue:864-873`)。
|
||||
- 不可约:`#f5f7fa` 底、opacity 0.6、文字 `#c0c4cc`(`appointment.vue:875-894`)。
|
||||
- 选中:`#409eff → #66b1ff` 渐变、白字和阴影(`appointment.vue:896-909`)。
|
||||
- Footer 右对齐、gap 12 px、上下内边距 12 px(`appointment.vue:923-928`)。
|
||||
|
||||
状态逻辑是视觉的一部分:未选医生时显示“请先选择医生”,无排班显示空态;日期只来自当前及未来有效排班(`appointment.vue:299-326`);当天过去时段禁用(`appointment.vue:328-357`);当天已有预约显示 warning,其他日期重复信息为 info(`appointment.vue:359-375`)。提交按钮只有医生、日期、时间、渠道以及条件性渠道详情齐全,且不存在当天冲突时才可用(`appointment.vue:377-386`)。
|
||||
|
||||
### 5.3 响应式事实
|
||||
|
||||
`appointment.vue` 没有移动端 media query。内部医生、日期和 slot 网格会换行,但 Drawer 在窄屏仍保持 60% 视口宽。这是后台源码的真实缺口;PySide 若要求窗口缩小时可用,应保留桌面 60% 的视觉比例,同时设置合理最小内容宽并在不足时切到全宽/单列,而不声称这是 Vue 原实现已有行为。
|
||||
|
||||
---
|
||||
|
||||
## 6. 备注、日常记录、处方/订单与历史关联区
|
||||
|
||||
### 6.1 医生备注 / 舌象 / 报告
|
||||
|
||||
编辑 Drawer 和独立只读页均使用 `NoteTimeline`(`edit.vue:633-643`; `readonly.vue:56-72`)。编辑态顶部按权限显示“新增备注、选择舌象、选择报告”;只读态隐藏这些操作(`src/views/patient/reception/components/NoteTimeline.vue:1-123`)。
|
||||
|
||||
视觉规格(`NoteTimeline.vue:272-436`):
|
||||
|
||||
- 顶部动作行 gap 12 px、底部分隔线。
|
||||
- 时间轴左内边距 22 px,轴线 2 px `#ebeef5`;节点 10 px、`#409eff`,外圈 `#ecf5ff`。
|
||||
- 日期 13 px / 600 / `#303133`,等宽数字;正文 12.5 px / `#606266` / 1.6 行高。
|
||||
- 舌象缩略图 `64 × 64 px`、圆角 6 px、带边框;删除为红色动作。
|
||||
- 报告文件 chip 为 `6px 10px`、圆角 6 px、12 px primary 字,最大宽 180 px。
|
||||
- 上传格 `90 × 90 px`、1 px dashed `#dcdfe6`、圆角 6 px、12 px;hover 转 primary。
|
||||
- 新增备注 Dialog 宽 480 px,textarea 4 行、maxlength 500。
|
||||
|
||||
`TrackingNoteTimeline` 当前并未进入可见 Tab:`edit.vue:644-654` 将整段注释。不能在复刻中把它当作现存“跟踪备注”页签。
|
||||
|
||||
### 6.2 日常记录、趋势与待办
|
||||
|
||||
DailyMatrix 顶部提供最近 7 天 / 30 天 / 自定义日期和日期范围;右侧有本人记录图例、编辑动作与血糖血压/饮食/运动/备注/刷新按钮,readonly 仅保留刷新(`components/DailyMatrix.vue:1-129`)。矩阵的指标顺序为:空腹、餐后2小时、其他血糖、血压、西药、胰岛素、早餐、午餐、晚餐、运动、跟踪备注(`components/DailyMatrix.vue:410-485`)。固定指标列 120 px,日期列最小 100 px。
|
||||
|
||||
- 根内边距 16 px;toolbar 换行、gap 12 px、下间距 12 px(`DailyMatrix.vue:1090-1105`)。
|
||||
- 趋势卡上间距 16 px、内边距 `16px 18px`、圆角 10 px,图表高 280 px(`DailyMatrix.vue:1124-1158`)。
|
||||
- 超标红 `#dc2626` / 700;本人记录用紫色浅底,徽章 `#6d28d9 / #ede9fe / #ddd6fe`(`DailyMatrix.vue:1182-1225`)。
|
||||
- <=768 px 时根内边距 12 px,图表内边距 12 px、高 240 px(`DailyMatrix.vue:1240-1260`)。
|
||||
|
||||
待办区域位于 DailyMatrix 下方,标题 14 px / 600。表格字段依次为提醒时间、内容、状态、创建人、推送时间、错误信息、操作;toolbar 可筛全部/待推送/已推送/失败/已取消(`components/DiagnosisTodoList.vue:1-112`)。新增 Dialog 宽 520 px、label 100 px,字段顺序为提醒时间、内容(4 行/500 字)、提醒人;toolbar 换行、gap 8 px、下间距 12 px,分页右对齐(`DiagnosisTodoList.vue:291-319`)。
|
||||
|
||||
### 6.3 处方 / 病例历史
|
||||
|
||||
`CaseRecordList` 顶部编辑态显示小号 primary“开方”,只读时隐藏。表格字段顺序:就诊日期(120)、就诊编号(120)、诊断(min 160)、处方摘要(min 180)、医生(90)、状态(140)、操作(120 固定右侧);根内边距 20 px(`components/CaseRecordList.vue:1-39,103-106`)。
|
||||
|
||||
点击“开方”进入直接依赖的全局 `@/components/tcm-prescription/index.vue`,不是在诊单 Tab 内原地编辑:它另开 1200 px Drawer、禁止点遮罩关闭,表单 label 100 px(`src/components/tcm-prescription/index.vue:1-10`)。编辑态顺序为:
|
||||
|
||||
1. 患者信息:姓名 / 性别 / 年龄三等分,电话 / 门诊号两等分。
|
||||
2. 诊断信息:面象 / 舌象两等分,临床诊断整行 2 行 textarea;舌象详情和脉象详情在模板中被注释(`index.vue:11-76`)。
|
||||
3. 中药处方 RP:药材总数与锁定提示;添加主方、添加辅方、处方库导入、粘贴导入;处方价格;主方卡片网格;辅方卡片网格(`index.vue:78-216`)。
|
||||
4. 用法信息:处方类型、主方用法、条件性辅方用法、剂数、剂量单位、用法、服用时间、服用方式、忌口、其他说明、医师、是否共享、医师签名(`index.vue:217-531`)。
|
||||
|
||||
信息分区间距 20 px、内边距 16 px、底 `#f5f7fa`、圆角 6 px;标题 15 px / 600 / `#303133`(`index.vue:2500-2516`)。RP toolbar 可换行,gap `12px 20px`、内边距 `14px 16px`、圆角 10 px、lighter 边框;标题 16 px、说明/锁定文字 12 px。药材编辑区桌面固定 4 列、gap 12 px,卡片白底、10 px 内边距、6 px 圆角;仅在 <=960 px 时让操作按钮行占满,**没有**把 4 列药材网格降列(`index.vue:2522-2690`)。签名区最大宽 600 px、1 px `#dcdfe6`、圆角 4 px(`index.vue:2694-2711`)。
|
||||
|
||||
保存后同一 Drawer 切换为处方预览:Tab 为“药房联 / 处方联”,上方工具条与作废/审核驳回状态,主体是 A4 `210 × 297 mm` 白纸,`8mm 10mm` 内边距、13 px 字号、28 px / 700 标题(`index.vue:536-754,2714-2782`)。患者信息是 4 列表格,药材是 2 列,底部医师/类型/天数/剂量为网格(`index.vue:2807-2966,2990-3035`)。未保存编辑态才提供 Drawer footer(`index.vue:899-905`)。
|
||||
|
||||
### 6.4 业务订单
|
||||
|
||||
订单 Tab/卡片顶部先显示“全局就诊序号偏移”工具条:label、tooltip、0–20 数字框(宽 120 px)、保存按钮(`components/PatientOrderList.vue:7-42`)。工具条换行、`12px 14px` 内边距、1 px lighter 边框、8 px 圆角、light fill(`PatientOrderList.vue:252-276`)。
|
||||
|
||||
订单表为 bordered + striped,字段顺序和列宽来自 `PatientOrderList.vue:44-106`:
|
||||
|
||||
1. 订单号,min 200。
|
||||
2. 全局就诊序号,96。
|
||||
3. 数量统计,96,Tag。
|
||||
4. 金额,120,右对齐红字。
|
||||
5. 医生,110。
|
||||
6. 医助,110。
|
||||
7. 履约状态,110,Tag。
|
||||
8. 创建时间,min 170。
|
||||
9. 详情,100,固定右侧。
|
||||
|
||||
默认 page size 为 10,底部带分页,点击详情打开只读订单详情(`PatientOrderList.vue:108-148`)。
|
||||
|
||||
订单详情复用 `PrescriptionOrderDetailDrawer` 的 readonly 受限版,而不是订单页内展开(`PatientOrderList.vue:113-124`)。该共享 Drawer 宽 80%,Header `16px 24px`,标题 18 px / 600,订单号与药房单号用圆角 Tag;加载态为 12 行 skeleton,body 水平内边距 24 px并独立纵向滚动(`src/views/consumer/prescription/components/PrescriptionOrderDetailDrawer.vue:13-50,1752-1757`)。内容顺序为:
|
||||
|
||||
1. 金额概览:总金额、已付总额、退款金额、需代收、已付笔数;响应式 2 / 3 / 5 列(`PrescriptionOrderDetailDrawer.vue:154-197`)。
|
||||
2. 两栏主区:左侧处方详情,右侧未关联收款与关联收款;收款表顺序为 ID、单号、类型、金额、状态、方式(readonly 隐藏)、创建人、创建时间(`PrescriptionOrderDetailDrawer.vue:200-545`)。
|
||||
3. 履约与收货信息:3 列 descriptions,label 宽 120 px(`PrescriptionOrderDetailDrawer.vue:551-680,1782-1785`)。
|
||||
4. 物流轨迹与操作日志(有数据/开启附加加载时)(`PrescriptionOrderDetailDrawer.vue:683-824`)。
|
||||
|
||||
readonly 明确隐藏顶部告警、流程步骤、挂号关联、内部成本、药材明细、收款方式和外部物流更新等完整版内容,但金额概览、主辅方用量/服法和基础详情仍共享(`PrescriptionOrderDetailDrawer.vue:2-11`)。面板统一 8 px 圆角,Header `14px 16px`、Body 16 px(`PrescriptionOrderDetailDrawer.vue:1759-1780`)。
|
||||
|
||||
### 6.5 视频、聊天与历史表
|
||||
|
||||
**视频录制回放。** CallRecordPanel 编辑态有上传 toolbar;字段为播放(min 320)、开始时间 170、结束时间 170、通话类型 100、房间 180、时长 110、状态 90、录制 100、上传 180(仅编辑)(`components/CallRecordPanel.vue:1-74`)。空态内边距 `28px 12px`,标题 14 px、说明 12 px / 1.6(`CallRecordPanel.vue:188-214`)。内嵌视频最大高 180 px、圆角 4 px、黑底;播放覆盖层为 `rgba(0,0,0,.62)`、白色 12 px(`components/RecordingVideoPlayer.vue:322-359`)。
|
||||
|
||||
**聊天。** 顶部 info alert + 同步/刷新 toolbar,消息区最大高 `min(60vh,520px)`、gap 16 px。单条最大宽 88%;患者消息靠左、灰底,医生消息靠右、primary 浅底;meta 12 px,气泡 14 px、1.5 行高、`10px 12px` 内边距、8 px 圆角;图片最大 `240 × 200 px`(`components/ImChatRecordPanel.vue:1-70,200-293`)。
|
||||
|
||||
**医助指派历史。** 字段依次为时间 175、原医助 min 120、新医助 min 120、继承 72 Tag、快照订单创建人 min 130、快照创建时间 190、操作人 110、账号 120、IP 130(`components/AssignLogPanel.vue:1-43`)。
|
||||
|
||||
**挂号历史。** 字段依次为 ID 72、状态 100 Tag、患者 min 150(姓名+手机堆叠)、医生 110、医助 110、预约时间 min 130(日期+时段堆叠)、预约类型 100、渠道 110、确认 92、处方 80、备注 min 100、创建时间 165(`components/AppointmentRecordPanel.vue:1-75`)。堆叠单元垂直 gap 2 px、行高 1.35(`AppointmentRecordPanel.vue:172-178`)。
|
||||
|
||||
### 6.6 `components/` 全目录的可达性边界
|
||||
|
||||
三主视图的实际 import 清单见 `edit.vue:787-805` 与 `readonly.vue:151-167`。为避免把目录中保留组件误认成当前详情功能,本次也核了其余文件:
|
||||
|
||||
| 组件 | 三主视图当前可达性 | 结论 |
|
||||
|---|---|---|
|
||||
| `PatientInfoCard`、`PatientCaseCard` | readonly 直接使用 | 当前只读摘要/病例 |
|
||||
| `DailyMatrix`、`CaseRecordList`、`PatientOrderList`、`CallRecordPanel`、`ImChatRecordPanel`、`AssignLogPanel`、`AppointmentRecordPanel` | edit/readonly 直接使用(依页面和权限而异) | 当前主链 |
|
||||
| `RecordingPlaybackBlock` → `RecordingVideoPlayer` | CallRecordPanel 间接使用 | 当前视频主链(`CallRecordPanel.vue:32,78`; `RecordingPlaybackBlock.vue:5,35`) |
|
||||
| `DiagnosisTodoList` | DailyMatrix 间接使用 | 当前日常记录主链 |
|
||||
| `TrackingNoteTimeline` | edit 有 import,但模板区整段注释 | 当前不可见(`edit.vue:644-654,803`) |
|
||||
| `BloodRecordList` | 未被三主视图 import | 旧/独立颗粒列表;其能力已由 DailyMatrix 内置 600 px 血糖血压 Dialog 承接(`BloodRecordList.vue:1-170`; `DailyMatrix.vue:131-185`) |
|
||||
| `DietRecordList` | 未被三主视图 import | 旧/独立列表;当前 DailyMatrix 内置 800 px 饮食 Dialog(`DietRecordList.vue:1-112`; `DailyMatrix.vue:187-227`) |
|
||||
| `ExerciseRecordList` | 未被三主视图 import | 旧/独立列表;当前 DailyMatrix 内置 600 px 运动 Dialog(`ExerciseRecordList.vue:1-86`; `DailyMatrix.vue:229-260`) |
|
||||
| `TrackingMatrix` | 未被三主视图 import | 非当前矩阵;当前入口明确 import `DailyMatrix`(`edit.vue:796`; `readonly.vue:161`) |
|
||||
| `AssistantWatchCallDialog` | 未被三主视图 import | 旁路观看 Dialog,不属于诊单详情/编辑/预约;自身是 auto-fill、最小 280 px 的观看网格,gap 12 px(`AssistantWatchCallDialog.vue:1-19,242-282`) |
|
||||
|
||||
因此 PySide 对齐应以“当前可达主链”为实现范围,不能因为同目录存在旧颗粒列表而重复增加血糖、饮食、运动 Tab,也不能把观看 Dialog 或 TrackingMatrix 插入诊单详情。
|
||||
|
||||
---
|
||||
|
||||
## 7. 加载、空态、错误和权限状态
|
||||
|
||||
| 场景 | 后台表现 | 源码 |
|
||||
|---|---|---|
|
||||
| 独立详情加载 | 页面级 loading | `readonly.vue:1-2` |
|
||||
| 独立详情失败 | Hero 下方错误空态卡 | `readonly.vue:31-36` |
|
||||
| 无未服务记录 | Hero 灰色“从未记录”状态 | `readonly.vue:323-355` |
|
||||
| 抽屉只读 | 状态 badge + disabled fieldset + 无保存 | `edit.vue:11-54,57-84,766-781` |
|
||||
| 患者隐私锁定 | warning Alert,身份字段不可改 | `edit.vue:71-84` |
|
||||
| Tab 失权 | 隐藏 Tab;当前失权时回 basic | `edit.vue:655-759,883-913` |
|
||||
| 预约未选医生 | 时间区提示先选医生 | `appointment.vue:100-171` |
|
||||
| 无排班/无时段 | 时间区空态 | `appointment.vue:100-171` |
|
||||
| 当天已有预约 | warning 且禁止确认 | `appointment.vue:10-18,359-386` |
|
||||
| 其他日期已有预约 | info 提示,不等同当天阻断 | `appointment.vue:359-375` |
|
||||
| 表格无数据 | 各组件 Element empty/自定义空态 | `PatientOrderList.vue:1-6`; `CallRecordPanel.vue:55-74` |
|
||||
|
||||
操作权限应控制“是否渲染/是否可编辑”,而不是只把无权按钮做成 disabled;这正是 Tab 通过 `v-if` 实现的模式。
|
||||
|
||||
---
|
||||
|
||||
## 8. PySide6 组件映射
|
||||
|
||||
### 8.1 结构映射
|
||||
|
||||
| Vue / Element 结构 | PySide6 建议 | 必须保留的视觉行为 |
|
||||
|---|---|---|
|
||||
| `el-drawer` 右侧抽屉 | 模态 `QDialog` + 右侧面板,或主窗口上的遮罩 `QFrame` + 固定宽面板 | 桌面约 60% 宽;edit 在窄屏切全宽;Header/Body/Footer 三段分离 |
|
||||
| Drawer body | `QScrollArea` + body widget | 只让 body 滚动,footer 不随滚动 |
|
||||
| Drawer footer slot | 独立 `QFrame` + `QHBoxLayout` | 上边框、白底、固定在底部;不要放进 ScrollArea |
|
||||
| `el-tabs` | `QTabWidget` / 自定义 `QTabBar + QStackedWidget` | 可横向滚动、3 px active indicator、按 canonical permission 移除页签 |
|
||||
| `el-form` + `el-row/el-col` | `QFormLayout` 套 `QGridLayout` | 桌面 160 px 编辑标签 / 100 px 预约标签;窄屏改上标签单列 |
|
||||
| input/select/date/input-number | `QLineEdit`、`QComboBox`、`QDateEdit`、`QSpinBox/QDoubleSpinBox` | 常规高 32 px、圆角 10 px;footer 按钮 40/44 px |
|
||||
| radio/checkbox button groups | `QButtonGroup` + 可换行 FlowLayout | 12 px 字号,组间 12–16 px;小窗必须换行 |
|
||||
| textarea | `QTextEdit/QPlainTextEdit` | 2/3/4 行按源码用途设置 minimumHeight,而非无限增高 |
|
||||
| alert / empty | `QFrame + QLabel` / 统一 EmptyState | warning/info/error 色语义与文案位置一致 |
|
||||
| card | `QFrame` | 白底、1 px `#e6ebf2`、14 px radius、18 px padding |
|
||||
| table | `QTableView + QAbstractTableModel` | stripe、固定/最小列宽、状态 `QStyledItemDelegate` tag、右侧动作列 |
|
||||
| timeline | `QListView` 或纵向 QWidget 列表 + paintEvent 轴线 | 22 px 左缩进、2 px 轴、10 px node,图片缩略图 64 px |
|
||||
| appointment slot grid | `QScrollArea + FlowLayout` / `QGridLayout` 动态列 | cell min 110 × 70;选中/禁用/可用状态显式 |
|
||||
| loading | overlay `QFrame` + spinner/文字 | 遮住当前内容但保留布局尺寸,异步返回后解除 |
|
||||
|
||||
### 8.2 推荐常量(来自源码,不是重新设计)
|
||||
|
||||
```text
|
||||
FONT_FAMILY = "PingFang SC, Arial, Hiragino Sans GB, Microsoft YaHei"
|
||||
FONT_BASE = 14
|
||||
FONT_FORM = 12
|
||||
CONTROL_HEIGHT = 32
|
||||
FOOTER_BUTTON_HEIGHT = 40 # <=768 对应布局时 44
|
||||
CARD_RADIUS = 14
|
||||
CARD_PADDING = 18
|
||||
CONTROL_RADIUS = 10
|
||||
PANEL_GAP = 16
|
||||
BORDER = #e6ebf2
|
||||
BODY_BG = #f8fafc
|
||||
PAGE_BG = #f6f6f6
|
||||
TEXT_PRIMARY = #333333
|
||||
TEXT_REGULAR = #666666
|
||||
TEXT_MUTED = #999999
|
||||
PRIMARY = #409eff # 继承 Element 语义主色
|
||||
READONLY_ACCENT = #2563eb
|
||||
READONLY_ACCENT_STRONG = #1d4ed8
|
||||
```
|
||||
|
||||
### 8.3 PySide 字段装配顺序
|
||||
|
||||
为避免实现时按数据模型字母序排字段,应按以下 UI 顺序装配:
|
||||
|
||||
```text
|
||||
编辑病历:
|
||||
诊单ID
|
||||
→ 姓名 / 身份证
|
||||
→ 手机 / 性别
|
||||
→ 年龄
|
||||
→ [生命体征] 婚姻 / 身高 / 体重
|
||||
→ 地区 / 高压 / 低压
|
||||
→ 空腹血糖
|
||||
→ 诊断类型
|
||||
→ 状态 / 渠道
|
||||
→ 统计端就诊卡
|
||||
→ 在用药物
|
||||
→ [主诉] 当地诊断日期 / 糖尿病病史
|
||||
→ 当地医院诊断结果
|
||||
→ 当地医院名称
|
||||
→ [现病史] 口腔 → 饮水 → 体重变化 → 脂肪肝 → 饮食
|
||||
→ 肢体 → 睡眠 → 眼睛 → 头部 → 出汗 → 皮肤 → 小便 → 大便 → 腰肾
|
||||
→ 其他补充
|
||||
→ [既往史] 既往史
|
||||
→ [其他病史] 外伤 / 手术 / 过敏 → 家族 / 妊娠
|
||||
→ [诊断信息] 病史补充
|
||||
|
||||
预约:
|
||||
上次面诊 → 预约方式 → 预约类型 → 预约患者 → 渠道来源
|
||||
→ [条件] 自媒体详情 → 预约医生 → 日期 → 时段 → 备注
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 9. 验收清单
|
||||
|
||||
1. 独立 readonly 是纵向卡片流,不出现 Tabs;抽屉 viewOnly 才是 Tabs + disabled 表单。
|
||||
2. 编辑 Drawer 桌面 60%,<=768 等效状态下全宽;预约 Drawer 源码没有该响应式覆盖,需明确属于适配增强。
|
||||
3. 编辑桌面 label 160 px,预约 label 100 px;编辑移动端 label 在控件上方。
|
||||
4. 编辑的 body 独立滚动,footer 始终可见;实现中没有把按钮放到滚动区末尾。
|
||||
5. Tab 顺序与 canonical permission 一致;“跟踪备注”不渲染。
|
||||
6. 编辑病历字段严格按 §4.5;不把脚本中未渲染字段自行加入。
|
||||
7. 只读病例按 4/3 列网格及 §3.4 顺序;小窗若做降列,需视为桌面端增强而非源码既有行为。
|
||||
8. 预约状态至少覆盖:未选医生、无排班、可约、不可约、选中、当天冲突、其他日期提示、loading。
|
||||
9. 订单、备注、视频、聊天、指派历史、挂号历史的列顺序/动作显隐与 §6 一致。
|
||||
10. 所有表格提供 loading、empty、error;权限失去时移除入口并将当前页回退到可见页。
|
||||
|
||||
以上规格记录的是当前后台源码的可见事实;PySide 可为桌面小窗增加降列和全宽适配,但不得改变字段顺序、权限门槛、状态语义或主操作位置。
|
||||
@@ -0,0 +1,31 @@
|
||||
# Diagnosis 详情二次终验报告
|
||||
|
||||
日期:2026-08-10
|
||||
|
||||
## CLOSED
|
||||
|
||||
- 统计端就诊卡:使用原生自绘二态 `DiagnosisSwitch`,保存值严格为 `0/1`。
|
||||
- 日常记录:提供 `+ 血糖 / + 饮食 / + 运动 / + 备注`,以及待办新增、仅待执行且 `can_cancel` 的精确取消;Remote/Demo/Protocol 均接真实方法,包含权限、DTO 校验和 generation 失效保护。
|
||||
- 诊疗笔记:接入新增/当日追加、舌象与报告上传、单附件删除;所有动作均调用现有真实 endpoint。
|
||||
- 处方与订单:处方按钮进入完整 `PrescriptionEditorDialog` 并调用 `tcm.prescription/add`;诊次偏移写入 `setRevisitSlotStartOffset`;订单详情调用真实详情方法。
|
||||
- 视频回放:列表、视频上传、手工通话记录创建、附件绑定均接真实 endpoint;播放仅允许合法 `HTTP(S)` 外链。
|
||||
- IM:固定 `only_archived=1`,支持异步同步与重新加载,并显示文本、图片、文件消息。
|
||||
- 视觉:tab 使用 4px 横向滚动条并隐藏原生左右箭头框;footer 有向上阴影;保存按钮自绘 loading spinner、成功勾、失败叉;readonly 摘要禁止拆字;表格状态改为 pill/tag。
|
||||
- Shell owner:每次 `open_for` / `showEvent` 从 `parentWidget().window()` 重新绑定,按 Shell 宽度 60% 计算抽屉,move/resize 立即同步,关闭后全部请求 generation 失效。
|
||||
- 列表补充合同:QR、挂号日志、通用订单与 exact `doctor.appointment/cancel` 均有 Protocol/Remote/Demo 方法。
|
||||
|
||||
## OPEN(服务端合同不存在,fail-closed)
|
||||
|
||||
- 诊疗笔记“任意改写既有正文”与“删除整条笔记”没有后端 endpoint,因此桌面端没有伪造动作。现有合同只允许“当天追加”和“删除单个附件”:
|
||||
- `server/app/adminapi/controller/doctor/AppointmentController.php:168-192` 仅公开 `addDoctorNote`、`doctorNotes`、`deleteDoctorNoteImage`。
|
||||
- `server/app/adminapi/logic/doctor/DoctorNoteLogic.php:14-67` 的 `addOrAppend` 按 `diagnosis_id + 当天` 追加正文/附件,不是任意正文覆盖。
|
||||
- `server/app/adminapi/logic/doctor/DoctorNoteLogic.php:114-141` 仅实现单个附件删除。
|
||||
- `admin/src/api/patient.ts:20-40` 同样只有上述三个客户端 API。
|
||||
|
||||
## 验证
|
||||
|
||||
- 定向详情与合同:`28 passed`。
|
||||
- 相关 repository/reception/video:`57 passed`。
|
||||
- 全量:`226 passed`。
|
||||
- `ruff check .`:exit 0(仅工作区不可访问缓存目录的扫描 warning)。
|
||||
- 视觉产物:`artifacts/diagnosis_visual/` 中 6 张模式图与 14 张详情状态图,共 20 张本轮详情 PNG。
|
||||
@@ -0,0 +1,155 @@
|
||||
# Diagnosis 最终视觉发布门禁
|
||||
|
||||
审计日期:2026-08-11
|
||||
审计性质:第四次独立、只读、最终视觉发布门禁;除更新本报告外,未修改业务源码、测试或 PNG。
|
||||
基准:`D:/web/zyt/admin/src/views/tcm/diagnosis/` 及其主链直接依赖组件。
|
||||
当前截图:`D:/web/zyt/app/artifacts/diagnosis_visual/`。
|
||||
Trellis:`D:/web/zyt/app/.trellis` 不存在(`Test-Path` 为 `False`),因此无可补读的 Trellis workflow/spec。
|
||||
审计口径:只有与基准达到同型才记 PASS;Qt 与浏览器字体栅格化造成的轻微像素差不算结构问题。
|
||||
|
||||
## 最终结论
|
||||
|
||||
**PASS。**
|
||||
|
||||
- 共逐张按原始像素尺寸检查 **57 张 PNG**。
|
||||
- 逐图判定:**57 PASS / 0 PARTIAL / 0 不可读 / 0 硬裁切到窗口外**。
|
||||
- 严重度:**P0 = 0,P1 = 0,P2 = 0**。
|
||||
- 旧审计中的 Notes 真实缩略图、Chat 图片缩略图、Daily 局部工具栏、1200 px 连续处方 Drawer、订单 80% 详情 Drawer、订单 offset、Shell 与预约均已闭合或保持通过。
|
||||
- 上轮唯一 P1——视频表内播放器被压成 16 px 黑条——已关闭。`diagnosis_video_inline_player_1200x560.png` 与 `diagnosis_state_video_replay_1024x640.png` 均显示完整加载遮罩、播放按钮、进度条、时间、外部打开、独立窗口和备用地址;播放器本体运行时高度为 158 px,未超过基准 180 px 上限。
|
||||
|
||||
尺寸分布(按 PNG 实际像素而非文件名):`1024x640` 24 张、`1024x768` 1 张、`1200x560` 1 张、`1200x900` 4 张、`1280x800` 11 张、`1440x900` 13 张、`650x620` 1 张、`820x560` 1 张、`920x780` 1 张。
|
||||
|
||||
第四次增量完整性:目录仍为 57 张;相对上一门禁仅 3 张视频 PNG 更新(`diagnosis_video_inline_player_1200x560.png`、`diagnosis_state_video_replay_1024x640.png`、`diagnosis_state_video_upload_action_1024x640.png`)。本轮已对这 3 张全部按原始尺寸复核,并原尺寸抽查 Notes、Chat、Daily、处方四段连续态、订单 80% Drawer/offset、Shell、预约及 1024/1440 主列表;其余非视频 PNG 时间戳未变化,沿用上一轮全量逐图结论。
|
||||
|
||||
## 此前 OPEN 逐项复核
|
||||
|
||||
| 旧 OPEN | 终态 | 视觉与结构证据 |
|
||||
|---|---|---|
|
||||
| Notes 舌象真实缩略图 | **CLOSED** | `diagnosis_state_notes_actions_1024x640.png` 已显示实际 64x64 舌象位图,并有右上删除入口;当前 `_RemoteImageButton` 以 cover 方式加载到 `QSize(64, 64)`:`src/doctor_workstation/ui/diagnosis_drawer.py:2364-2404`。基准为真实 `el-image` 64x64 cover:`D:/web/zyt/admin/src/views/patient/reception/components/NoteTimeline.vue:52-69`。 |
|
||||
| Chat 图片消息缩略图 | **CLOSED** | `diagnosis_state_chat_archive_1024x640.png` 的患者图片消息直接显示实际图像缩略图,不再是“查看图片”文字链接;当前最大 `240x200`:`diagnosis_drawer.py:2553-2573`。基准:`ImChatRecordPanel.vue:39-50`。 |
|
||||
| Daily 待办局部工具栏 | **CLOSED** | `diagnosis_state_daily_lower_1024x640.png` 同时显示 `+ 新增待办`、全部/待执行/已发送/失败/已取消及局部“刷新”,无遮挡;当前:`diagnosis_drawer.py:1725-1761`,基准:`DiagnosisTodoList.vue:3-20`。顶部动作行也继续在 `diagnosis_state_daily_1024x640.png` 完整换行。 |
|
||||
| 处方 1200 px 连续 Drawer | **CLOSED** | `diagnosis_state_prescription_editor_1200x900.png`、`..._herbs_1200x900.png`、`..._usage_1200x900.png`、`..._signature_1200x900.png` 连续证明患者、诊断、RP 药材、用法、签名处于同一纵向滚动流,固定 footer 稳定;1024/920 窄宽度采用可用宽度而非截断。当前 `DRAWER_WIDTH = 1200` 且五段连续加入同一 `QScrollArea`:`src/doctor_workstation/ui/dialogs/prescription.py:1467,1491-1556,1902-1914`。基准:`D:/web/zyt/admin/src/components/tcm-prescription/index.vue:2-216,217-531`。旧 4-tab modal 结构已消失。 |
|
||||
| 订单 80% 详情 Drawer | **CLOSED** | `diagnosis_order_detail_drawer_1440x900.png` 的 panel 从 x=288 开始、宽 1152(80%);`diagnosis_state_order_detail_640x540.png` 与 `diagnosis_state_order_detail_drawer_1024x640.png` 的实际像素均为 1024x640,panel 从 x=205 开始、宽 819(约 80%)。金额概览、处方详情、关联收款在首屏可见;当前连续构建收款、履约与收货、物流轨迹、操作日志:`src/doctor_workstation/ui/dialogs/diagnosis.py:669-710,3623-4065`。基准共享 readonly Drawer:`PrescriptionOrderDetailDrawer.vue:13-20,154-220,433-545,550-824`。旧 `640x540` 仅是遗留文件名,不是当前截图尺寸。 |
|
||||
| 订单 offset 文案与解释层级 | **CLOSED** | `diagnosis_state_order_offset_1024x640.png` 已为“复诊统计起始偏移”+ 问号帮助 +“第 1 笔实单计为三诊”+“保存”,与基准同型;当前:`diagnosis.py:1384-1416,3001-3058`,基准:`PatientOrderList.vue:7-41`。 |
|
||||
| 视频多地址与逐条上传 | **CLOSED(能力/动作)** | `diagnosis_state_video_upload_action_1024x640.png` 的行级“追加回放”可见;当前每行绑定精确 `call_record_id`:`diagnosis.py:3304-3342`。备用地址结构存在于 `diagnosis_media.py:358-442`。 |
|
||||
| 视频表内播放器 | **CLOSED** | 两张终态图均显示完整可操作的表内播放器与备用地址;第四次运行时复核在 1200x560、1024x640 宿主中均测得 row 243 px、cell 242 px、player 158 px,controls 全部可见。详见下节。 |
|
||||
| Shell | **CLOSED / 无回归** | `diagnosis_shell_1024x640.png` 与 `diagnosis_shell_1440x900.png` 均保持 183 px sidebar、50 px topbar、40 px tabs,操作区及固定列无错位。 |
|
||||
| 预约 Drawer | **CLOSED / 无回归** | 8 张预约 PNG 的 60% Drawer、固定 footer、时段网格、empty/error/loading/refreshing/focus 状态均完整。 |
|
||||
|
||||
## P0 / P1 / P2
|
||||
|
||||
### P0
|
||||
|
||||
**0 项。** 未发现窗口级硬裁切、核心信息完全不可见、Drawer 比例失效、footer 滚走、二维码不可辨识、Shell 壳层错位或预约主流程不可操作的发布阻断。
|
||||
|
||||
### P1
|
||||
|
||||
**0 项。** 上轮唯一 P1“视频表内播放器被裁成 16 px 黑条”已关闭。
|
||||
|
||||
#### 视频表内播放器关闭证据
|
||||
|
||||
精确截图:
|
||||
|
||||
- `D:/web/zyt/app/artifacts/diagnosis_visual/diagnosis_video_inline_player_1200x560.png`
|
||||
- `D:/web/zyt/app/artifacts/diagnosis_visual/diagnosis_state_video_replay_1024x640.png`
|
||||
|
||||
两张图在原始尺寸中均呈现完整播放器:黑色视频 surface 内有“预览待加载 / 点击播放开始加载”,下方可见“播放”、进度条、`00:00 / 00:00`、“外部打开”和“独立窗口”;播放器下方继续显示“备用地址”及 `COS HLS 1`、`链接 2`,第二条无回放记录也保持独立普通行。1200 与 1024 宿主均无裁切、重叠或 controls 遗失。
|
||||
|
||||
第四次运行时几何复核(使用与最终截图相同的 `RenderRepository` 与两行 fixture,未写 PNG)在 1200x560 和 1024x640 两种宿主下得到一致结果:
|
||||
|
||||
- table row 0:243 px;可视 cell rect:242 px;`RecordingPlaybackCell`:242 px。
|
||||
- `InlineRecordingPlayer`:158 px,满足实现的 158–180 px 约束,也满足基准 `max-height: 180px`。
|
||||
- 播放按钮、slider、时间标签及整个 player 均 `visible=True`。
|
||||
- 备用地址使外层 cell 高于 180 px 是正确行为;180 px 上限只约束播放器本体,不约束播放器 + 备用地址的整行总高。
|
||||
|
||||
当前源码的闭环点:
|
||||
|
||||
- `src/doctor_workstation/ui/diagnosis_media.py:179-278` 构建 158–180 px 内嵌 player、视频 surface 与完整控制栏。
|
||||
- `diagnosis_media.py:359-457` 将 player、备用地址组成定高 cell,并由 `required_table_row_height()` 返回真实所需高度。
|
||||
- `src/doctor_workstation/ui/dialogs/diagnosis.py:3304-3367` 在 Qt 的 `resizeRowsToContents()` 后,以 cell 实际 hint 恢复 row 高度并写入 item size hint,避免另一列固定高按钮再次压扁整行。
|
||||
|
||||
基准 `D:/web/zyt/admin/src/views/tcm/diagnosis/components/RecordingPlaybackBlock.vue:1-30` 在“录制回放”单元格内直接放置 `RecordingVideoPlayer`;`RecordingVideoPlayer.vue:2-13,320-329` 显示 controls、16:9、最大高 180 px 的完整播放器。当前终态在结构、信息层级和可操作性上已同型,因此关闭 P1。
|
||||
|
||||
### P2
|
||||
|
||||
**0 项。** 上一轮两项 P2 已闭合:Daily 待办已具精确 `+ 新增待办` 与局部刷新;订单 offset 已具精确标题、帮助入口、动态解释与“保存”文案。
|
||||
|
||||
## 57 张 PNG 逐张判定
|
||||
|
||||
### 预约 Drawer(8/8 PASS)
|
||||
|
||||
| PNG | 判定 | 原始尺寸下目检结论 |
|
||||
|---|---|---|
|
||||
| `appointment_drawer_1024x640.png` | PASS | 60% Drawer、body 滚动、时段状态与固定 footer 完整。 |
|
||||
| `appointment_drawer_1440x900.png` | PASS | 医生、日期、时段网格、备注与 footer 对齐。 |
|
||||
| `appointment_drawer_empty_doctors_1440x900.png` | PASS | warning、空医生状态与禁用确认完整。 |
|
||||
| `appointment_drawer_empty_roster_1440x900.png` | PASS | 无排班 warning、医生选择与空态完整。 |
|
||||
| `appointment_drawer_error_1440x900.png` | PASS | 号源错误 banner、刷新入口、空态与禁用确认完整。 |
|
||||
| `appointment_drawer_keyboard_focus_1440x900.png` | PASS | 日期按钮 focus ring 清晰,不挤压布局。 |
|
||||
| `appointment_drawer_loading_1440x900.png` | PASS | 初始 loading overlay、spinner、文案与 footer 完整。 |
|
||||
| `appointment_drawer_refreshing_1440x900.png` | PASS | 刷新 overlay、spinner、文案与 footer 完整。 |
|
||||
|
||||
### 诊单列表、壳层与主 Drawer(23/23 PASS)
|
||||
|
||||
| PNG | 判定 | 原始尺寸下目检结论 |
|
||||
|---|---|---|
|
||||
| `diagnosis_1024x640.png` | PASS | 窄屏筛选换行、横向滚动、右 460 px 固定区与行语义完整。 |
|
||||
| `diagnosis_1440x900.png` | PASS | 宽屏列密度、复合挂号格、业务色与固定操作区成立。 |
|
||||
| `diagnosis_advanced_filters_1280x800.png` | PASS | 高级筛选全量展开,无控件裁切。 |
|
||||
| `diagnosis_double_appointment_cancel_1280x800.png` | PASS | 同诊单双挂号各有取消入口。 |
|
||||
| `diagnosis_edit_1024x640.png` | PASS | 60% Drawer、tab、独立滚动与固定 footer 成立。 |
|
||||
| `diagnosis_edit_1440x900.png` | PASS | 864 px Drawer 与宽屏字段比例稳定。 |
|
||||
| `diagnosis_empty_1280x800.png` | PASS | 表头、空态、横向滚动与 0 条分页保留。 |
|
||||
| `diagnosis_error_1280x800.png` | PASS | 错误态清晰,无旧数据穿透。 |
|
||||
| `diagnosis_focus_1280x800.png` | PASS | 搜索 focus ring 清晰且不挤压布局。 |
|
||||
| `diagnosis_full_menu_1280x800.png` | PASS | 8 项菜单、图标、danger 删除与“二维码”均完整。 |
|
||||
| `diagnosis_horizontal_scroll_1024x640.png` | PASS | 主表横移时右 460 px 固定区不动。 |
|
||||
| `diagnosis_hover_warning_1280x800.png` | PASS | warning 行 hover 与左侧强调条连续。 |
|
||||
| `diagnosis_loading_1280x800.png` | PASS | 表内 spinner 与淡化内容完整。 |
|
||||
| `diagnosis_order_detail_drawer_1440x900.png` | PASS | 80% Drawer、金额概览、处方详情、收款记录与固定 footer 成立。 |
|
||||
| `diagnosis_order_qrcode_1280x800.png` | PASS | QR 可辨、订单号、状态、只读 URL 与动作完整。 |
|
||||
| `diagnosis_pending_assign_1280x800.png` | PASS | 待分配医助、月份与搜索处于同一流式区域。 |
|
||||
| `diagnosis_permissions_cropped_1280x800.png` | PASS | 权限收口后只保留查看,无敏感动作残留。 |
|
||||
| `diagnosis_readonly_1024x640.png` | PASS | 独立只读页 hero、病例卡与窄屏字段无拆字。 |
|
||||
| `diagnosis_readonly_1440x900.png` | PASS | 4 列病例密度、异常指标与长页滚动成立。 |
|
||||
| `diagnosis_shell_1024x640.png` | PASS | 183/50/40 壳层、tabs、固定列及分页成立。 |
|
||||
| `diagnosis_shell_1440x900.png` | PASS | 宽屏壳层比例及顶栏图标/中文稳定。 |
|
||||
| `diagnosis_viewonly_1024x640.png` | PASS | 60% 只读 Drawer、警告、disabled 表单与仅关闭 footer 成立。 |
|
||||
| `diagnosis_viewonly_1440x900.png` | PASS | 宽屏只读栅格、全 tabs 与固定 footer 成立。 |
|
||||
|
||||
### 详情状态与子流程(26/26 PASS)
|
||||
|
||||
| PNG | 判定 | 原始尺寸下目检结论 |
|
||||
|---|---|---|
|
||||
| `diagnosis_state_chat_archive_1024x640.png` | PASS | info、归档同步、左右气泡与真实图片缩略图成立。 |
|
||||
| `diagnosis_state_daily_1024x640.png` | PASS | Daily 动作完整换行,无裁切。 |
|
||||
| `diagnosis_state_daily_blood_edit_650x620.png` | PASS | 血糖/血压字段、单位、必填说明与固定动作完整。 |
|
||||
| `diagnosis_state_daily_lower_1024x640.png` | PASS | `+ 新增待办`、filters、局部刷新、状态与横向滚动完整。 |
|
||||
| `diagnosis_state_empty_1024x640.png` | PASS | 处方空态与 primary“开方”成立。 |
|
||||
| `diagnosis_state_error_1024x640.png` | PASS | danger banner、重试、空表单与禁用保存完整。 |
|
||||
| `diagnosis_state_focus_1024x640.png` | PASS | 姓名 focus ring、close 与固定 footer 完整。 |
|
||||
| `diagnosis_state_loading_1024x640.png` | PASS | loading overlay、spinner 与文案完整。 |
|
||||
| `diagnosis_state_notes_actions_1024x640.png` | PASS | 新增/上传动作、实际舌象缩略图、报告 chip 与单附件删除完整。 |
|
||||
| `diagnosis_state_order_detail_640x540.png` | PASS | 实际为 1024x640 的 80% Drawer;金额与处方首屏、滚动与 footer 成立。 |
|
||||
| `diagnosis_state_order_detail_drawer_1024x640.png` | PASS | 80% Drawer 窄屏终态与上一张一致且无结构裁切。 |
|
||||
| `diagnosis_state_order_offset_1024x640.png` | PASS | 精确标题、帮助、动态解释、“保存”、列表与分页成立。 |
|
||||
| `diagnosis_state_permission_1024x640.png` | PASS | 获权 tabs、敏感字段掩码与仅关闭 footer 成立。 |
|
||||
| `diagnosis_state_prescription_editor_1024x768.png` | PASS | 窄屏连续 Drawer 首段、RP 工具栏、滚动与固定 footer 成立。 |
|
||||
| `diagnosis_state_prescription_editor_1200x900.png` | PASS | 1200 px 连续 Drawer 患者/诊断/RP 起始结构成立。 |
|
||||
| `diagnosis_state_prescription_editor_920x780.png` | PASS | 窄宿主按可用宽度适配,旧 tabbed modal 已消失。 |
|
||||
| `diagnosis_state_prescription_editor_herbs_1200x900.png` | PASS | 主方/辅方网格、剂量与删除入口处于同一滚动流。 |
|
||||
| `diagnosis_state_prescription_editor_signature_1200x900.png` | PASS | 辅方用法、医生签名板及固定 footer 成立。 |
|
||||
| `diagnosis_state_prescription_editor_usage_1200x900.png` | PASS | 主/辅方用法层级、说明字段与连续滚动成立。 |
|
||||
| `diagnosis_state_save_failure_1024x640.png` | PASS | 红色失败态与文案完整。 |
|
||||
| `diagnosis_state_save_loading_1024x640.png` | PASS | 按钮内 spinner 与“正在保存”完整。 |
|
||||
| `diagnosis_state_save_success_1024x640.png` | PASS | 绿色成功态与文案完整。 |
|
||||
| `diagnosis_state_video_player_820x560.png` | PASS | 独立播放器作为兼容兜底本身完整;不替代表内播放器要求。 |
|
||||
| `diagnosis_state_video_replay_1024x640.png` | PASS | 158 px 表内 player、加载态、完整 controls 与备用地址均可见,第二条普通行未受高行影响。 |
|
||||
| `diagnosis_state_video_upload_action_1024x640.png` | PASS | 横移后 243 px 高视频行仍保持状态、录制与“追加回放”垂直居中,第二条普通行未被错误拉高。 |
|
||||
| `diagnosis_video_inline_player_1200x560.png` | PASS | 宽屏完整显示 158 px 表内 player、controls、备用地址及相邻列,无裁切。 |
|
||||
|
||||
## 发布判定
|
||||
|
||||
- 旧审计的 Notes、Chat、Daily、处方、订单、视频、Shell、预约问题已经全部闭合或保持通过。
|
||||
- 两张重新录制的视频原始尺寸 PNG 与运行时实际控件几何相互印证,旧唯一 P1 已关闭。
|
||||
- 当前最终门禁:**PASS(57 PASS / 0 PARTIAL,共检查 57 张 PNG;P0=0,P1=0,P2=0)。**
|
||||
@@ -0,0 +1,373 @@
|
||||
# 管理端“诊单列表”视觉规格(源码基准)
|
||||
|
||||
> 审计日期:2026-08-10
|
||||
> 唯一业务页面基准:`D:/web/zyt/admin/src/views/tcm/diagnosis/index.vue`
|
||||
> 方法:只读检查 Vue 模板、同文件 scoped SCSS、直接挂载组件、全局样式、主题生成逻辑和当前锁定的 Element Plus 源码;未启动浏览器、未改业务源码。
|
||||
|
||||
## 1. 结论摘要
|
||||
|
||||
1. 该页面**没有页面内标题、说明文案或独立标题栏**。路由内容从一张无边框、无阴影的筛选卡直接开始;“新增诊单”等主操作位于第二张列表卡顶部,而不是页面标题旁。证据:`index.vue:2-154`。
|
||||
2. 页面是“浅灰页面底 + 两张白卡”的高密度后台列表。外层路由容器提供左右 `8px`、上下 `16px` 的留白;筛选卡和列表卡之间为 `12px`。证据:`D:/web/zyt/admin/src/layout/default/components/main.vue:2-10`、`index.vue:154`、`D:/web/zyt/admin/tailwind.config.js:103-113`。
|
||||
3. 顶部不是常规 tabs,而是可换行的圆角文字 chip:6 个日期入口,再接“待预约 / 已完成 / 待分配医助”,计数是文字后面的普通半透明数字,不是独立 badge。当天默认选中。证据:`index.vue:6-70,964-976,2174-2182,2222-2317`。
|
||||
4. 表格声明列的最小总宽约为 **1403px**;右侧固定“视频旁观” `120px` 与“操作” `340px`,合计 `460px`。窄于该宽度时由 Element Table 横向滚动,右侧两列保持 fixed。证据:`index.vue:191-342`。
|
||||
5. 表格使用斑马纹;普通偶数行是 `#FAFAFA`,普通悬停是 `#F8F8F8`。未确认、未挂号行还声明了左侧语义色和横向渐变,但静态渐变写在 `tr`,斑马纹及 fixed cell 的 `td` 背景可能遮住它;两类行的 hover 渐变直接写在 `td`,表现更稳定。证据:`index.vue:2723-2735`、Element Plus `table.scss:560-588,665-668`。
|
||||
6. 空态不是 `el-empty` 插画,而是表格默认的 **60px 高“暂无数据”文本区**;加载态是覆盖表格的半透明蒙层和 `42px` 主色环。证据:Element Plus `table.scss:52-70`、`loading.scss:19-73`、中文 locale `zh-cn.mjs:137`。
|
||||
|
||||
## 2. 源码证据层级
|
||||
|
||||
| 层级 | 文件 | 本规格使用内容 |
|
||||
|---|---|---|
|
||||
| 页面模板与局部样式 | `D:/web/zyt/admin/src/views/tcm/diagnosis/index.vue:1-2766` | DOM 次序、列宽、状态类、局部尺寸和颜色 |
|
||||
| 路由内容容器 | `D:/web/zyt/admin/src/layout/default/components/main.vue:1-12` | 页面底色、外层滚动、`px-2 py-4` |
|
||||
| 共享组件 | `D:/web/zyt/admin/src/components/pagination/index.vue:1-50`;`D:/web/zyt/admin/src/components/daterange-picker/index.vue:1-49` | 分页布局、页容量、日期范围控件行为 |
|
||||
| 项目全局样式 | `D:/web/zyt/admin/src/styles/index.scss:1-5`、`var.css:1-49`、`element.scss:58-68,106-115,140-151,177-201`、`public.scss:1-3` | 全局字体、颜色、表格、输入焦点、移动分页 |
|
||||
| 项目主题 | `D:/web/zyt/admin/src/config/setting.ts:1-15`、`src/utils/theme.ts:3-75`、`src/App.vue:25-34` | 默认主色、明暗主题色派生、运行时覆盖 |
|
||||
| Tailwind token | `D:/web/zyt/admin/tailwind.config.js:5-155` | 字体族、颜色映射、间距值 |
|
||||
| UI 框架 | `D:/web/zyt/admin/pnpm-lock.yaml:47-49,2412-2415`;`node_modules/element-plus/theme-chalk/src/**` | 当前锁定 Element Plus 2.13.7 的默认组件尺寸 |
|
||||
|
||||
`package.json:27` 写的是兼容范围 `^2.9.4`,当前 lock 与已安装源码均为 **2.13.7**;本规格的框架默认尺寸以锁文件和当前安装源码为准。
|
||||
|
||||
## 3. 页面骨架与 ASCII wireframe
|
||||
|
||||
### 3.1 宽屏主态
|
||||
|
||||
```text
|
||||
主内容滚动区,#F6F6F6;左右 8,上下 16
|
||||
┌────────────────────────────────────────────────────────────────────────────────────────────┐
|
||||
│ 筛选卡 #FFF / r4 / 无边框无阴影;内边距 12V × 16H │
|
||||
│ [昨天挂号 n] [前天挂号 n] [当天挂号 n] [明天挂号 n] [后天挂号 n] [全部 n] │
|
||||
│ [待预约 n] [已完成 n] [待分配医助 n] [患者姓名 / 手机号 160] [查询 32h] │
|
||||
│ ──────────────────────────────────────────────────────────────────────────────────────── │
|
||||
│ 挂号:[全部] [已挂号] [未挂号] │ 确认:[全部] [已确认] [未确认] 更多筛选⌄ │
|
||||
│ · · · 展开时:诊断类型 / 证型 / 医助 / 最近挂号日期 / 最近指派日期 / 渠道 / 重置 · · · │
|
||||
└────────────────────────────────────────────────────────────────────────────────────────────┘
|
||||
12px
|
||||
┌────────────────────────────────────────────────────────────────────────────────────────────┐
|
||||
│ [新增诊单] [批量指派医助] [批量取消指派] 已选 n 条(按需显示) │
|
||||
├────┬──────┬──────┬───────────┬──────────────┬──────┬────────┬──────┬──────┬──────────┬──────┬────────────────────┤
|
||||
│ □ │ ID │ 患者 │ 性别/年龄 │ 挂号 │ 确认 │ 复诊 │ 助理 │ 开方 │未服务天数│旁观* │ 操作* │
|
||||
├────┼──────┼──────┼───────────┼──────────────┼──────┼────────┼──────┼──────┼──────────┼──────┼────────────────────┤
|
||||
│ □ │123 NEW│张三 │ 男 · 42岁 │[待问诊] 医生 │未确认│日期/医生│医助 │已开方│ 8 │进入 │查看 诊单 开方 … 更多│
|
||||
│ │ │ │ │时间 / 渠道 │ │ │ │ │ │ │ │
|
||||
├────┴──────┴──────┴───────────┴──────────────┴──────┴────────┴──────┴──────┴──────────┴──────┴────────────────────┤
|
||||
│ 共 n 条 [15条/页] [<] 1 2 … [>] 前往 [ ] 页 │
|
||||
└────────────────────────────────────────────────────────────────────────────────────────────┘
|
||||
* 右侧固定列,共 460px
|
||||
```
|
||||
|
||||
### 3.2 结构说明
|
||||
|
||||
- 外层 `main` 是整页垂直滚动容器;诊单表没有本页固定高度或纵向虚拟滚动,15 条数据会把页面自然撑高。证据:`layout/default/components/main.vue:2-11`、`index.vue:179-190`。
|
||||
- 两张卡都使用 `shadow="never"` 与 `!border-none`;保留 Element Card 的白底、裁切和 `4px` 圆角。框架默认:Element Plus `card.scss:9-17`、`common/var.scss:1226-1235`。
|
||||
- 页面根节点只设 `min-height:100%`、页面底色和水平居中;不设自身宽度、最大宽度或 padding。证据:`index.vue:2200-2206`。
|
||||
- 顶部全局 header、面包屑和多页签属于应用壳,不在 `index.vue` 中;它们是否出现受全局 setting 控制,不能当作本页标题复刻。
|
||||
|
||||
## 4. 可复刻的基础 token
|
||||
|
||||
### 4.1 字体与基础尺寸
|
||||
|
||||
| 项 | 源码确定值 | 证据 |
|
||||
|---|---:|---|
|
||||
| 字体族 | `PingFang SC, Arial, Hiragino Sans GB, Microsoft YaHei, sans-serif` | `tailwind.config.js:79-81`、`var.css:2` |
|
||||
| body / Element base | `14px` | `public.scss:1-3`、`var.css:16` |
|
||||
| small / extra-small | `13px / 12px` | `var.css:17-18` |
|
||||
| 默认控件高度 | `32px` | Element Plus `common/var.scss:233-241` |
|
||||
| small 控件高度 | `24px` | 同上 |
|
||||
| 默认圆角 | `4px` | Element Plus `base.css:1` |
|
||||
| 卡片圆角 | `4px` | Element Plus `common/var.scss:1227-1234` |
|
||||
|
||||
字体栅格的真实像素高度仍受 Windows 缩放、浏览器 DPR 与首个可用字体影响;页面 chip 没有固定 `height`/`line-height`,只能精确复刻 padding,不能仅凭源码承诺最终外框高度。
|
||||
|
||||
### 4.2 亮色主题
|
||||
|
||||
项目在 `App.vue` mount 时用 setting 重写 Element 语义色。默认主色不是 Element 原生蓝,而是 `#4A5DFF`。主题派生算法见 `src/utils/theme.ts:3-18,29-37,55-74`。
|
||||
|
||||
| token | 默认运行值 | 使用处 |
|
||||
|---|---|---|
|
||||
| `--el-color-primary` | `#4A5DFF` | active chip、主按钮、链接、loading |
|
||||
| primary light-3 / 5 / 7 / 8 / 9 | `#808EFF / #A5AEFF / #C9CEFF / #DBDFFF / #EDEFFF` | hover、focus、轻底色 |
|
||||
| primary dark-2 | `#3B4ACC` | active 状态;页面另有硬编码近似值 `#3A4ACC` |
|
||||
| success | `#67C23A` | 已完成 chip、已确认、成功按钮 |
|
||||
| warning | `#E6A23C` | 待分配、未确认、警示行 |
|
||||
| danger | `#F56C6C` | NEW、删除/取消 |
|
||||
| info | `#909399` | 待预约、完成预约、次要态 |
|
||||
| page / card | `#F6F6F6 / #FFFFFF` | 页面底 / 卡片与普通行 |
|
||||
| primary / regular / secondary text | `#333333 / #666666 / #999999` | 标题信息 / 常规 / 辅助 |
|
||||
| placeholder / disabled | `#A8ABB2 / #C0C4CC` | 空值、禁用 |
|
||||
| border / light / lighter | `#DCDFE6 / #E4E7ED / #EBEEF5` | 控件、卡线、行分隔 |
|
||||
| fill / light / lighter | `#F0F2F5 / #F8F8F8 / #FAFAFA` | hover、表头、斑马纹 |
|
||||
| loading mask | `rgba(255,255,255,.5)` | 表格加载蒙层 |
|
||||
|
||||
证据:`src/config/setting.ts:9-14`、`src/styles/var.css:9-43`。主色的派生结果使用项目同一 `css-color-function` 算法计算;不是页面硬编码。warning/info 的页面渐变使用 `--el-color-*-rgb`,其当前框架默认分别为 `230,162,60` 和 `144,147,153`(Element Plus `base.css:1`)。
|
||||
|
||||
### 4.3 暗色与运行时主题边界
|
||||
|
||||
- `.dark` 下页面底为 `#0A0A0A`、普通背景 `#1D2124`、overlay `#1D1E1F`,主/常规/次要文字为 `#E5EAF3 / #CFD3DC / #A3A6AD`,lighter border 为 `#363637`。证据:`src/styles/dark.css:1-31`。
|
||||
- `App.vue` 根据 `useDark()` 调用主题生成器,主色仍可保持 `#4A5DFF`,但 light-* 在暗色下改用 shade 算法。证据:`src/App.vue:29-34`、`src/utils/theme.ts:12-18,55-77`。
|
||||
- setting 会从本地缓存覆盖默认颜色,因此**某个真实账号的主色/语义色可能不同**。证据:`src/stores/modules/setting.ts:12-50,65-77`。上表是无用户自定义时的确定基线。
|
||||
- 页面内硬编码的 `#4A5DFF`、`#3A4ACC` 与 `rgba(74,93,255,...)` 不会随自定义主题变化,因而自定义主题下会出现两套蓝色。证据:`index.vue:2522-2529,2556-2559,2596-2599`。
|
||||
|
||||
## 5. 顶部筛选卡
|
||||
|
||||
### 5.1 卡与第一行
|
||||
|
||||
筛选卡 body padding 为 `12px 16px`。第一行 `.filter-main` 是单行 flex:垂直居中、两端对齐、组间 `16px`、下边距 `8px`;**自身没有 `flex-wrap`**。左侧 `.date-chips` 才可换行,chip 间距 `6px`。证据:`index.vue:3-76,2208-2225`。
|
||||
|
||||
| 元素 | 几何/排版 | 默认/交互颜色 | 证据 |
|
||||
|---|---|---|---|
|
||||
| 普通日期 chip | padding `6px 12px`;14px/500;r6;transition `.2s` | 常规 `#666` + `#F8F8F8`;hover `#F0F2F5`;active 白字 + 主色 | `index.vue:2227-2250` |
|
||||
| chip 计数 | 与标题相隔 `4px`;normal style;opacity `.8` | 跟随父 chip | `index.vue:23-24,2237-2241` |
|
||||
| 待预约 | 普通 chip 外再有左 margin `8px` | info / info-light-9;active info 实色 | `index.vue:26-32,2253-2265` |
|
||||
| 已完成 | 左 margin `8px` | success / success-light-9;active success 实色 | `index.vue:33-39,2268-2280` |
|
||||
| 待分配医助 | 权限控制;外容器可换行、gap `8px`、左 margin `8px` | warning / warning-light-9;active warning 实色 | `index.vue:40-70,2283-2308` |
|
||||
| 待分配月份 | default 月选择器;宽 `128px` | Element 默认输入态 | `index.vue:51-60,2310-2312` |
|
||||
| 待分配宽搜索 | default 输入;宽 `220px`,最大 `42vw` | Element 默认输入态 | `index.vue:61-69,2314-2317` |
|
||||
| 主搜索 | default 输入宽 `160px` | placeholder“患者姓名 / 手机号” | `index.vue:72-75,2320-2326` |
|
||||
| 查询 | primary default button;高 `32px`,14px,r4 | 白字/主色底 | `index.vue:74`、Element Plus `button.scss:22-43,76-82` |
|
||||
|
||||
日期 chip 的实际顺序是:**昨天、前天、当天、明天、后天、全部**,不是按自然日期升序;随后才是 3 个业务 chip。证据:`index.vue:964-976`。页面挂载时直接选中当天并请求列表;各 chip 计数延后到 idle(不支持时延后约 `120ms`)获取,所以首帧可能只有标签、稍后才出现数字。证据:`index.vue:1046-1095,2174-2182`。
|
||||
|
||||
### 5.2 第二行快捷筛选
|
||||
|
||||
- 第二行上方有 `1px solid #EBEEF5`;自身 `padding-top:8px`、`margin-top:8px`、水平 gap `6px`、垂直居中。证据:`index.vue:78-102,2329-2335`。
|
||||
- “挂号:”“确认:”为 `13px #999`,label 后额外 `2px`。每组都是“全部 / 已… / 未…”。证据:`index.vue:79-97,2337-2341`。
|
||||
- 小 chip 最终 padding 是 `.chip-sm` 的 `4px 10px`,13px、r4、透明底;hover/active 用主色文字与 primary-light-9,active 权重 500。证据:`index.vue:2343-2366`。
|
||||
- 两组之间为 `1×14px` 的 lighter 分隔线,左右 margin `4px`。证据:`index.vue:2368-2373`。
|
||||
- “更多筛选”是 primary/link/small 按钮,左 margin `8px`;展开时 ArrowDown 旋转 `180°`,文字变“收起”。源码没有为该旋转指定独立 transition。证据:`index.vue:98-101,2375-2380`。
|
||||
|
||||
### 5.3 展开筛选区
|
||||
|
||||
展开区使用 `v-show`,所以是即时显隐而非折叠动画。它为可换行 flex,gap `10px`,上 margin/padding 各 `8px`,顶部是 `1px dashed #EBEEF5`。证据:`index.vue:104-151,2384-2391`。
|
||||
|
||||
控件从左到右:
|
||||
|
||||
1. 诊断类型 select(small,`24px` 高);
|
||||
2. 证型 select(small);
|
||||
3. 医助 select(small,可搜索);
|
||||
4. 最近挂号日期范围(共享 `DaterangePicker`,`260px` 宽、最大 100%,未传 size,故 default `32px` 高);
|
||||
5. 最近指派日期范围(同上);
|
||||
6. 最近挂号渠道(small,可搜索,宽 `170px`);
|
||||
7. 重置(small button,`24px` 高)。
|
||||
|
||||
证据:`index.vue:104-150,2393-2405`;共享日期组件只是透传一个 `el-date-picker`,见 `components/daterange-picker/index.vue:1-11,15-31`。因此展开区客观上混有 `24px` 与 `32px` 两种控件高度。前三个 select 没有本页固定宽度;Element Select 自身是 `width:100%` 的可收缩 flex item,最终每行宽度依赖可用空间与浏览器 flex 计算,源码不能给出一个稳定像素值。
|
||||
|
||||
## 6. 列表卡操作栏
|
||||
|
||||
- 列表卡距筛选卡 `12px`,body padding 清零。证据:`index.vue:154,2408-2412`、Tailwind spacing `tailwind.config.js:103-113`。
|
||||
- 操作栏为左右两端布局,padding `10px 16px`,底边 `1px #EBEEF5`;未固定高度。default button 高 `32px`,故无换行时栏高至少约 `52px`。证据:`index.vue:155-177,2414-2429`。
|
||||
- 左侧依权限显示:primary“新增诊单”、success“批量指派医助”、warning/plain“批量取消指派”。后两者按选中状态禁用。右侧仅在选中数量大于 0 时显示 `13px #999` 的“已选 n 条”。证据:`index.vue:157-176`。
|
||||
- `.list-actions` 声明 `gap:8px`,但 Element 默认还有 `.el-button + .el-button { margin-left:12px }`,此处没有清零。因此相邻按钮的实际起点间空白通常是 **20px(8+12)**,而不是设计者表面写下的 8px。证据:`index.vue:2421-2424`、Element Plus `button.scss:72-74`。
|
||||
|
||||
## 7. 表格规格
|
||||
|
||||
### 7.1 外框与表头
|
||||
|
||||
- 表格外围 padding `10px 16px 0`;表格宽度 100%,默认 fixed layout、无竖边框;行之间由 `1px #EBEEF5` 底边分隔。证据:`index.vue:178-190,2432-2434`、Element Plus `table.scss:11-20,188-195,217-235`。
|
||||
- 表头底 `#F8F8F8`、13px/600、文字 `#666`。默认 cell 水平 padding `12px`,行高 `23px`,纵向 padding `8px`,所以单行表头的理论最小高度约 **39px**(23+16,不含亚像素/边线差异)。证据:`index.vue:2710-2716`、Element Plus `table.scss:156-195`、`common/var.scss:1014-1031`。
|
||||
- 表头“未服务天数”有双态排序箭头,顺序只允许 descending → ascending;激活箭头使用主色。证据:`index.vue:297-304`、Element Plus `table.scss:548-552`。
|
||||
|
||||
### 7.2 列宽与内容
|
||||
|
||||
| 次序 | 列 | 声明宽度 | 对齐/固定 | 主要视觉内容 |
|
||||
|---:|---|---:|---|---|
|
||||
| 1 | 选择 | `48px` | center | header 全选 + 行 checkbox |
|
||||
| 2 | ID | `min 70px` | left | ID 为 14px/600;未读指派时附 small/dark/danger `NEW` |
|
||||
| 3 | 患者 | `min 60px` | left | 患者名 14px/600;头像模板已注释,不显示 |
|
||||
| 4 | 性别 / 年龄 | `100px` | left | `男 · 42岁`,继承表格 14px |
|
||||
| 5 | 挂号 | `min 175px` | left | 预约状态 badge、医生、时间、可取消链接、最近渠道;无则“未挂号” |
|
||||
| 6 | 确认 | `88px` | center | 13px 已确认/未确认文字 |
|
||||
| 7 | 复诊 | `min 120px` | left | 时间、医生、可选“处方已作废” tag;无则“无” |
|
||||
| 8 | 助理 | `100px` | left | 13px 次要文字,溢出 tooltip |
|
||||
| 9 | 开方 | `72px` | center | 13px 已开方/未开方 |
|
||||
| 10 | 未服务天数 | `110px` | center | 13px/600 tabular number,按天数绿/橙/红;可有健康打卡 tooltip |
|
||||
| 11 | 视频旁观 | `120px` | center / right fixed | small link 或 12px 次要状态 |
|
||||
| 12 | 操作 | `340px` | left / right fixed | 5 个 small/link 主动作 + click dropdown |
|
||||
|
||||
证据:`index.vue:191-406`。声明宽度/最小宽度合计约 `1403px`;`min-width` 列在更宽窗口可继续分配余量。右固定区域为 `120+340=460px`,Element 会在滚动边缘加 fixed-column 阴影;阴影值来自框架 `common/var.scss:981-1000`。
|
||||
|
||||
### 7.3 行高与密度
|
||||
|
||||
- 本页再次把 body cell 设为 `padding:8px 0`,cell 内层保留 Element 的水平 `12px` 与 `23px` line-height。纯单行内容的最小行高约 **39px**。证据:`index.vue:2720-2722`、Element Plus `table.scss:188-195`。
|
||||
- 挂号 cell 有 `min-height:36px`、内 padding `4px 8px`、r6,所以含该列的常规数据行通常至少约 **52px**(cell 36 + table 上下 16);实际由内容较高者决定。证据:`index.vue:2485-2489`。
|
||||
- 同一诊单多条预约时,每一后续预约额外带 `8px` top margin、`8px` top padding 和 `1px dashed #EBEEF5`,行高会显著增加,不是固定行高。证据:`index.vue:227-247,2490-2494`。
|
||||
- 操作区允许换行;链接数量受权限与记录状态影响,所以操作列也可能增高整行。证据:`index.vue:344-403,2683-2688`。
|
||||
|
||||
### 7.4 斑马、hover 与业务高亮
|
||||
|
||||
| 状态 | 静态 | hover | 判定优先级 |
|
||||
|---|---|---|---|
|
||||
| 普通奇数行 | 白 `#FFF` | `#F8F8F8` | 无业务类 |
|
||||
| 普通偶数行 | `#FAFAFA` | `#F8F8F8` | `stripe` |
|
||||
| 未确认 | 预期左侧 `3px #E6A23C`;从左到右 warning RGB `.06 → transparent` | warning RGB `.10 → transparent`,直接覆盖 `td` | 第一优先 |
|
||||
| 已确认但未挂号 | 预期左侧 `3px #909399`;info RGB `.04 → transparent` | info RGB `.08 → transparent`,直接覆盖 `td` | 第二优先 |
|
||||
|
||||
判定函数先检查“是否确认”,只有已确认才检查“是否挂号”,所以一行不会同时得到两个业务类。证据:`index.vue:1313-1337`。页面声明见 `index.vue:2723-2735`;斑马和 hover 框架规则见 Element Plus `table.scss:560-588,665-668`。
|
||||
|
||||
实现时必须区分“源码意图”和“浏览器可见结果”:
|
||||
|
||||
- 静态业务渐变在 `tr`,而偶数斑马行和 fixed cell 的背景落在 `td`;不透明 `td` 会遮住下面的 `tr` 渐变。
|
||||
- 业务 hover 选择器直接命中 `td` 且带 `!important`,因此 hover 更可靠。
|
||||
- `border-left` 施加在 `tr`,在 `border-collapse:separate` 的 table 中具体像素绘制还受浏览器表格格式化上下文影响。
|
||||
|
||||
PySide 复刻应按“意图”直接给每个可见 cell/row delegate 绘背景和 3px 左条,避免复现 CSS 遮挡缺陷;若目标是截图逐像素一致,则需先用指定 Chromium、固定数据测一张运行态截图。
|
||||
|
||||
### 7.5 单元格内部视觉
|
||||
|
||||
#### 患者与 ID
|
||||
|
||||
- `.patient-name` 为 14px/600、`#333`、line-height `1.3`。ID 与患者列都复用该样式。证据:`index.vue:194-212,2461-2470`。
|
||||
- 32×32、r8、主色渐变的头像 CSS 存在,但患者模板已注释,不参与实际页面。证据:`index.vue:207,2447-2459`。
|
||||
- `NEW` 是 small (`20px` 高)、danger、dark tag:白字、danger 实色底;字体 12px、r4。证据:`index.vue:198`、Element Plus `tag.scss:66-87,142-165`、`common/var.scss:1110-1138`。
|
||||
|
||||
#### 挂号块
|
||||
|
||||
- 每个预约 badge:11px/600、padding `2px 6px`、r4、下 margin `2px`;医生 14px/600 `#333`;时间 12px、上 margin `2px`。证据:`index.vue:2496-2519`。
|
||||
- 活跃预约 badge 为 `#3A4ACC` / `rgba(74,93,255,.15)`,时间硬编码 `#4A5DFF`;整块为 135° 蓝色渐变 `.12 → .06`,边 `rgba(74,93,255,.3)`。证据:`index.vue:2522-2531,2556-2559`。
|
||||
- 已完成预约用 info-dark-2 / info-light-7;爽约用 warning-dark-2 / warning-light-7。整块也分别换成 info 或 warning 透明渐变。证据:`index.vue:2533-2569`。
|
||||
- 最近渠道为上 margin `6px`、12px、line-height `1.35`、`#999`;未挂号为 13px `#A8ABB2`。证据:`index.vue:2571-2581`。
|
||||
|
||||
#### 语义文字与 tag
|
||||
|
||||
- 已确认:13px/500 success;未确认:13px/600 warning。证据:`index.vue:2584-2594`。
|
||||
- 已开方:13px/500、硬编码 `#4A5DFF`;未开方:13px `#A8ABB2`。证据:`index.vue:2596-2605`。
|
||||
- 复诊时间 13px/500 `#333`,医生 12px `#999`,纵向 gap `4px`、line-height `1.35`;“处方已作废”是 small/plain/info tag。证据:`index.vue:268-285,2651-2676`。
|
||||
- 未服务天数:最小 `28px`、13px/600、等宽数字;空值灰 `#A8ABB2`/400,`<=2` 绿 `#16A34A`,`3-6` 橙 `#EA580C`,`>=7` 红 `#DC2626`。证据:`index.vue:305-316,1319-1329,2607-2632`。
|
||||
- 视频旁观为 12px、line-height `1.4`,左右 padding `2px`;不可进入时是 `#999`。证据:`index.vue:318-341,2690-2704`。
|
||||
|
||||
## 8. 按钮、dropdown、tooltip
|
||||
|
||||
### 8.1 操作列链接
|
||||
|
||||
直接动作依次为:查看(primary)、诊单(primary)、开方/查看处方(primary)、预约(success)、补全身份证(warning),最后是 info“更多”。权限会移除部分按钮。证据:`index.vue:345-403`。
|
||||
|
||||
- 均为 `size="small"`、`link`:12px,透明边/底,padding `2px`,高度 auto;hover 使用各语义色的 light-3。证据:Element Plus `button.scss:223-248`、`element.scss:113-127`。
|
||||
- `.action-cell` 设 flex-wrap + `gap:4px`;但相邻 `.el-button + .el-button` 仍有 `12px` 左 margin,因此连续按钮间通常是 **16px(4+12)**。dropdown 外壳与前一按钮之间只有 flex gap `4px`。证据:`index.vue:2683-2688`、Element Plus `button.scss:72-74`。
|
||||
- 340px 操作列不足时允许链接换行;没有强制单行或省略号。
|
||||
|
||||
### 8.2 “更多”菜单
|
||||
|
||||
- click 触发、`bottom-end` 对齐。菜单项按权限/状态可包含:指派、取消指派、视频二维码、二维码、取消挂号、挂号日志、创建订单、删除。证据:`index.vue:379-403`。
|
||||
- Element 默认 dropdown item 为 14px、line-height `22px`、padding `5px 16px`,故普通项约 `32px` 高;菜单上下净 padding 约 `5px`,r4、overlay 白底,popper 有 light border 与 shadow。hover 为 fill-light + primary。证据:Element Plus `dropdown.scss:7-24,42-70,137-176`。
|
||||
- 删除项有 divided 顶线,文字由 `.text-danger` 强制为 danger。证据:`index.vue:400,2706-2708`。
|
||||
- tooltip 使用 Element 默认 popper:12px、line-height `20px`、padding `5px 11px`;实际位置由视口碰撞计算,不能从源码固定。
|
||||
|
||||
## 9. 分页、空态与加载态
|
||||
|
||||
### 9.1 分页
|
||||
|
||||
- 列表默认 `page=1, size=15`;共享组件页容量选项为 `[15,20,30,40]`。证据:`src/hooks/usePaging.ts:14-34`、`components/pagination/index.vue:18-28`。
|
||||
- 布局固定为 `total, sizes, prev, pager, next, jumper`,最多显示 5 个 pager,单页也不隐藏。证据:`components/pagination/index.vue:3-14,24-28`。
|
||||
- 容器右对齐,padding `10px 16px 16px`。默认分页按钮 `32×32px`(最小宽),14px,r2,项组间 gap token `16px`;active 仅主色文字 + bold,并未启用 background 模式。证据:`index.vue:408-410,2436-2440`、Element Plus `common/var.scss:1034-1057`、`pagination.scss:5-67`。
|
||||
- page-size select 框架宽 `128px`,jumper 输入 `56px`。证据:Element Plus `pagination.scss:73-75,118-150`。
|
||||
- 视口 `<=768px` 时,全局 CSS 隐藏 size selector 与 jumper,仍保留 total、prev、pager、next。证据:`src/styles/element.scss:177-184`。
|
||||
|
||||
### 9.2 空态
|
||||
|
||||
页面没有提供 table `#empty` slot,也没有在主列表使用 `el-empty`。因此空列表为:
|
||||
|
||||
- sticky empty block,min-height `60px`;
|
||||
- 居中纯文本“暂无数据”;
|
||||
- 文字 `#999`,line-height `60px`,宽 50%;
|
||||
- 表头、底线和分页仍存在。
|
||||
|
||||
证据:`index.vue:179-190`、Element Plus `table.scss:52-70`、`src/App.vue:5,25-28`、Element 中文 locale `zh-cn.mjs:137`。
|
||||
|
||||
### 9.3 加载
|
||||
|
||||
- `v-loading="pager.loading"` 直接挂表格;普通请求开始时 loading=true,完成后 false。证据:`index.vue:179-184`、`src/hooks/usePaging.ts:35-72`。
|
||||
- 蒙层绝对覆盖 table,z-index 2000,亮色为 `rgba(255,255,255,.5)`;中央环 `42px`,主色描边 `2px`,2 秒旋转、1.5 秒 dash 动画。证据:`src/styles/var.css:41-43`、Element Plus `loading.scss:19-73,85-103`、`common/var.scss:1340-1349`。
|
||||
- 页面每 20 秒静默刷新列表和计数;标签页不可见时跳过,静默刷新不打开 loading,因此不会周期性白闪。证据:`index.vue:1098-1105,2182-2195`、`src/hooks/usePaging.ts:36-42,64-71`。
|
||||
- 首次 `pager.loading` 初值是 false,但 mount 后立即调用 `getLists()`,正常网络下会很快进入蒙层;能否肉眼看到取决于响应时长。
|
||||
|
||||
## 10. 响应式与滚动行为
|
||||
|
||||
1. `index.vue` 的 scoped 样式**没有 media query**。页面级响应式主要来自 flex-wrap、宽度上限、Element Table 横向滚动及全局分页规则。
|
||||
2. body 被全局设为 `min-width:375px`、`overflow:hidden`;应用主内容通过 `el-scrollbar` 承担页面滚动。证据:`src/styles/public.scss:1-3`、`layout/default/components/main.vue:2-11`。
|
||||
3. 第一筛选行本身不换行。左侧日期 chip 可换行,但右侧 160px 搜索 + 32px 查询按钮仍与左侧同一 flex 行;在极窄内容宽度下可能压缩、增高左侧或溢出,源码没有把搜索行堆到下一行的断点。
|
||||
4. 待分配容器可换行,宽搜索最多 `42vw`;展开筛选区可换行,两个日期范围各为 `260px` 且 `max-width:100%`。证据:`index.vue:2298-2317,2384-2405`。
|
||||
5. 表格 min 总宽约 1403px。Element Table 内部提供横向 scrollbar;右侧 460px fixed 区保持可见,导致很窄时可见的左侧业务列空间进一步减少。
|
||||
6. 外层应用在窄屏会折叠侧栏,但那是壳层行为,不改变本页筛选/表格 DOM。证据:`src/App.vue:36-53`。
|
||||
7. dark mode 有完整全局变量,但页面的硬编码蓝/绿/橙/红不会自适应;其亮度对比应另做暗色运行态验收。
|
||||
|
||||
## 11. 直接挂载的覆盖层(不占主页面静态布局)
|
||||
|
||||
主列表下方常驻挂载多个异步组件或 dialog/drawer;关闭时不占主页面空间,操作后覆盖在页面之上:
|
||||
|
||||
| 入口 | 覆盖层 | 关键尺寸 | 证据 |
|
||||
|---|---|---:|---|
|
||||
| 新增/诊单 | `edit.vue` 诊单 drawer | `60%` | `index.vue:414`、`edit.vue:1-10` |
|
||||
| 详情组件 | `detail.vue` popup | `800px` | `index.vue:415`、`detail.vue:1-10` |
|
||||
| 开方/处方 | `tcm-prescription` drawer | `1200px` | `index.vue:416`、`components/tcm-prescription/index.vue:1-8` |
|
||||
| 预约 | `appointment.vue` drawer | `60%` | `index.vue:417`、`appointment.vue:1-10` |
|
||||
| 视频旁观 | AssistantWatchCall dialog | `760px`;视频 grid min `220px` | `index.vue:418-422`、`AssistantWatchCallDialog.vue:1-19,242-284` |
|
||||
| 挂号日志 | drawer | `460px` | `index.vue:424-447` |
|
||||
| 小程序二维码 | dialog | `400px`;二维码 `256×256` | `index.vue:449-481` |
|
||||
| 指派医助 | dialog | `500px` | `index.vue:483-531` |
|
||||
| 创建订单 | dialog | `600px` | `index.vue:533-587` |
|
||||
| 补全身份证 | dialog | `400px` | `index.vue:589-615` |
|
||||
| 企微记录 | drawer | `600px` | `index.vue:617-722` |
|
||||
|
||||
这些覆盖层说明“操作按钮点击后”的页面层级,但其完整内部视觉不应混入诊单 index 主页面的静态复刻范围。
|
||||
|
||||
## 12. PySide 映射建议
|
||||
|
||||
### 12.1 页面与筛选
|
||||
|
||||
| Vue/CSS 意图 | PySide 建议 | 复刻要点 |
|
||||
|---|---|---|
|
||||
| 外层 `el-scrollbar` + 两张 card | `QScrollArea` → 单一 `QWidget/QVBoxLayout`;卡用 `QFrame` | viewport `#F6F6F6`;外 margin `16V/8H`;卡 r4、白底、无 border/shadow;卡间 12 |
|
||||
| date chips | 自定义 `FlowLayout` + checkable `QToolButton` | padding 6×12、r6、gap6;计数拼接为同一 label,保持源码顺序 |
|
||||
| 业务色 chip | 同一 button class 加 dynamic property | `pending_booking/info`、`completed/success`、`pending/warning`;active 白字实底 |
|
||||
| 第一行搜索 | `QHBoxLayout` 右侧固定 `QLineEdit(160)` + `QPushButton` | 高 32、gap8;若追求源码一致,不自行添加窄屏 stack |
|
||||
| 第二行筛选 | `QHBoxLayout`/FlowLayout + `QToolButton` | top line、上下 8;13px;active primary-light-9 |
|
||||
| 更多筛选 | 可显隐 `QWidget` + FlowLayout | 无动画;top dashed border;gap10;small 控件 24,日期范围 32 |
|
||||
|
||||
Qt 没有内建通用 FlowLayout,建议采用 Qt 示例式 `FlowLayout`,并把 chip 的 `sizeHint()` 包含字体宽度、左右 12/10px padding;不要用固定总宽,否则计数从一位变三位时会截断。
|
||||
|
||||
### 12.2 表格
|
||||
|
||||
- 使用 `QTableView + QAbstractTableModel`,不要堆 15 行 QWidget。列的 initial/min widths 按本规格表设置;表头高建议从 `39px` 起,常规 row 从 `52px` 起,并由 delegate `sizeHint()` 为多预约/操作换行增高。
|
||||
- 选择列用 check-state delegate;ID/患者、确认、复诊、开方、未服务天数分别用专用 delegate 绘文字和 tag,避免嵌套控件带来的滚动性能问题。
|
||||
- 挂号列用一个复合 delegate:r6 的状态背景、11px badge、14px/600 医生、12px 时间、多预约虚线分隔。可点击“取消挂号”若必须嵌入,可在命中区域处理 mouse event,而不是每格常驻 QPushButton。
|
||||
- 两个右固定列可用**同步滚动的双 `QTableView`**:主表隐藏最后两列,右表只显示 120/340 两列,共宽 460;共享 model、selection model、vertical scrollbar 与 row height。单一 QTableView 无 Element 的 sticky fixed-column 等价物。
|
||||
- 行背景应在 delegate 对每个 cell 绘制:普通白/`#FAFAFA`,hover `#F8F8F8`;业务行覆盖渐变并在第一可见 cell 绘 3px 语义条。不要把渐变只画在 viewport 底层,否则会重现 HTML `td` 遮挡问题。
|
||||
- 操作列优先使用 delegate + 命中区域或常驻 `QWidget` 行容器;若用按钮,链接样式为 12px、2px padding、无背景/边框,并预留源码实际的较大按钮间距。
|
||||
- 横向滚动时保持右表固定;表头与 body 必须共用列宽。多预约行要同步两张表的 row height。
|
||||
|
||||
### 12.3 dropdown、分页、空态、加载
|
||||
|
||||
- “更多”使用 `QMenu`,item 高约 32、左右 padding16、14px;按权限/状态动态构建,删除项前 `addSeparator()` 且 danger 文本。
|
||||
- 分页建议自定义 `PaginationBar`:total、15/20/30/40 combo、prev、最多 5 页、next、jump;高度32,容器右对齐并保留 `10T/16H/16B`。窗口内容宽度 <=768 时隐藏 combo 与 jump。
|
||||
- 空态在 `QTableView.viewport()` 中央放一个透明 `QLabel("暂无数据")`,有效高度 60;不要用大插画。仍显示 header 和分页。
|
||||
- 加载态用覆盖 table rect 的半透明 widget:亮色 `rgba(255,255,255,.5)`,中央约 42px 主色 spinner。新请求显示;20 秒静默刷新不显示。
|
||||
- 用 generation/request id 丢弃过期异步响应,并只在当前请求结束时关闭 overlay;这不是 Vue 当前 `latestOnly:false` 的视觉保证,但能避免 PySide 快速筛选时旧响应造成闪回。
|
||||
|
||||
### 12.4 主题与字体
|
||||
|
||||
- 定义集中 token,而不是把 `#4A5DFF` 散落在 QSS;但为了忠实,挂号块与“已开方”目前应保留硬编码蓝,或在设计确认后统一为 theme primary。
|
||||
- Windows 上首选“Microsoft YaHei UI”还是源码的“Microsoft YaHei”会改变字宽;逐像素复刻应显式用 `Microsoft YaHei`,14px CSS 大致映射为 Qt pixelSize 14,而不是 pointSize 14。
|
||||
- Qt 的 devicePixelRatio 与 CSS px 不同。截图验收需固定 Windows 缩放(建议 100%)、字体、窗口内容宽度和主题。
|
||||
|
||||
## 13. 能从源码确定 / 不能从源码确定
|
||||
|
||||
### 可以确定
|
||||
|
||||
- DOM 顺序、无页面内标题、两张卡、每个筛选和操作入口;
|
||||
- 页面局部 padding/gap/宽度、列声明宽度、固定列、颜色、字体大小/字重;
|
||||
- 日期 chip 的顺序与当天默认态;
|
||||
- 表格 stripe、业务类判定优先级、语义文本与预约块状态;
|
||||
- 共享分页的页容量、布局、空态文案、loading 结构;
|
||||
- 默认亮/暗 token 及运行时主题派生方式;
|
||||
- 权限或数据条件控制哪些按钮/tag 出现。
|
||||
|
||||
### 仅运行态可最终确定
|
||||
|
||||
1. **最终换行和行高**:取决于 viewport、数据长度、按钮权限、预约条数、字体回退、DPR;chip 和多数 row 都没有固定 height。
|
||||
2. **实际主题色**:setting 存在本地缓存,账号可改主色及语义色;dark 状态也来自浏览器存储/系统偏好。
|
||||
3. **业务行静态渐变是否完整可见**:受 `tr` 背景、striped/fixed `td` 背景与 Chromium table paint 顺序影响;源码只能确定规则叠加关系。
|
||||
4. **fixed-column 阴影和 scrollbar 尺寸**:由 Chromium/Element 的滚动状态、平台 scrollbar 策略决定。
|
||||
5. **tooltip/dropdown 的最终坐标**:popper 会做视口碰撞与翻转。
|
||||
6. **加载态停留时间和计数出现时间**:由 API 延迟、idle callback 调度决定;静默轮询通常无蒙层。
|
||||
7. **应用壳标题/面包屑/多页签**:由路由菜单、setting 和权限生成,不是 `index.vue` 的页面内视觉。
|
||||
|
||||
若后续要求“像素级截图一致”,应在固定 `Element Plus 2.13.7 + Chromium 版本 + 100% Windows 缩放 + 默认亮色主题 + 固定权限/样本数据` 下补一轮运行态测量;本文件已经给出源码能够保证的全部静态约束与明确边界。
|
||||