admin/guoju0808
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: 重塑政务风格 + 操作列统一 el-link + 表格紧凑化

Browse Source 
业务背景
- ry-vue3 为政务/卫健委风合规管理系统 (医疗机构合规系统), 不要可爱配色、不要插画
- 品牌色: 主色 #15803D (低调深绿) + 次色 #0E7490 (青蓝), 不要蓝色系主色

变更概要
1. 全局地基
   - theme.scss: Element Plus 主色改为 #15803D, slate 9 档, 联动组件库
   - main.scss: 字体/页面骨架/筛选栏/表格/控件/滚动条 全套样式
   - AdminLayout.vue: 政务顶栏 + 浅色侧栏
   - Workbench.vue: 替换原绿底大字卡为 KPI 白底色条 + 快捷入口 + 进度条

2. 表格操作列改造
   - el-button link 全面替换为 el-link (:underline="false" + type="primary/danger")
   - 36 文件 132 处替换, 操作列外加 .table-actions 容器 (内含分隔线)
   - 修复 el-link 不支持的属性 (size="small"/text/loading)

3. 筛选栏
   - 弹性布局 + gap 14px 16px + align-items: flex-start + min-height 32px
   - 删除所有 scoped .filter-form 覆盖 (28 处) 让全局样式生效
   - 控件宽度 180px 统一, 标签 32px 居中, 折行不紧贴

4. 表格紧凑化
   - cell-padding 10px → 6px, 表头高度 36px
   - 行高 ~46px → ~36px, 字号 13px

5. 每页默认 20 条
   - 21 文件 pageSize: 10 → 20

6. meetings 操作列折叠
   - 11 操作 → 外置 3 个主操作 + 1 个"更多" el-dropdown (8 个次操作)
   - width 500px → 260px
   - 配 .op-dropdown / .op-caret 样式 (hover 旋转)
   - 新增 onMoreAction dispatch 函数 (复用原 handler)

7. 操作列文字防拆行
   - .table-actions flex-wrap: nowrap + white-space: nowrap
   - el-link padding 0 8px → 0 6px, flex-shrink: 0

8. 环境配置
   - .env.development: 直连远端 https://risingdoctor.com/hg-api (绕过 vite proxy 卡顿)
   - vite.config.js: proxy fallback 保留
This commit is contained in:
guoju0808
2026-08-26 11:04:15 +00:00
parent b0256ccac3
commit d2fe5a4035
46 changed files with 975 additions and 451 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ry-vue3/src/views/doctor/Account.vue
+2 -2
View File
@@ -24,9 +24,9 @@
<el-form-item label="联系电话">
<div class="phone-row">
<span class="phone-value">{{ form.phone || '未设置' }}</span>
<el-button link type="primary" @click="openPhoneDialog">
<el-link :underline="false" type="primary" @click="openPhoneDialog">
<el-icon><EditPen /></el-icon> 修改
</el-button>
</el-link>
</div>
</el-form-item>
<el-form-item label="科室" :required="true">
ry-vue3/src/views/doctor/Meetings.vue
+9 -14
View File
@@ -23,26 +23,22 @@
</el-table-column>
<el-table-column label="日程" width="130" align="center">
<template #default="{ row }">
<el-button link type="primary" :disabled="!row.scheduleUrl" @click="onPreview(row.scheduleUrl, '日程海报')">查看</el-button>
<el-button link :disabled="!row.scheduleUrl" @click="onDownload(row.scheduleUrl, `${row.meetingName || '会议'}_日程海报`)">下载</el-button>
</template>
</el-table-column>
<el-link :underline="false" type="primary" :disabled="!row.scheduleUrl" @click="onPreview(row.scheduleUrl, '日程海报')">查看</el-link>
<el-link :underline="false" :disabled="!row.scheduleUrl" @click="onDownload(row.scheduleUrl, `${row.meetingName || '会议'}_日程海报`)">下载</el-link></template></el-table-column>
<el-table-column label="邀请函" width="130" align="center">
<template #default="{ row }">
<el-button link type="primary" :disabled="!row.projectInvitationUrl" @click="onPreview(row.projectInvitationUrl, '邀请函')">查看</el-button>
<el-button link :disabled="!row.projectInvitationUrl" @click="onDownload(row.projectInvitationUrl, `${row.meetingName || '会议'}_邀请函`)">下载</el-button>
</template>
</el-table-column>
<el-link :underline="false" type="primary" :disabled="!row.projectInvitationUrl" @click="onPreview(row.projectInvitationUrl, '邀请函')">查看</el-link>
<el-link :underline="false" :disabled="!row.projectInvitationUrl" @click="onDownload(row.projectInvitationUrl, `${row.meetingName || '会议'}_邀请函`)">下载</el-link></template></el-table-column>
<el-table-column label="签署状态" width="100" align="center">
<template #default="{ row }">
<el-tag :type="row.attendeeLaborProtocol ? 'success' : 'info'" size="small">{{ row.attendeeLaborProtocol ? '已签署' : '未签署' }}</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="120" fixed="right">
<template #default="{ row }">
<el-button v-if="!row.attendeeLaborProtocol" link type="primary" @click="onSign(row)">签署劳务</el-button>
<el-button v-else link type="primary" @click="onViewLabor(row)">查看劳务</el-button>
</template>
<template #default="{ row }"><div class="table-actions">
<el-link :underline="false" v-if="!row.attendeeLaborProtocol" type="primary" @click="onSign(row)">签署劳务</el-link>
<el-link :underline="false" v-else type="primary" @click="onViewLabor(row)">查看劳务</el-link>
</div></template>
</el-table-column>
</el-table>
@@ -109,7 +105,7 @@ import { bizList } from '@/api/public'
import { stageLabel, stageTag, STAGE_OPTIONS } from '@/utils/meetingStage'
const q = reactive({ projectNo: '', meetingName: '', currentStage: '' })
const page = reactive({ pageNum: 1, pageSize: 10, total: 0 })
const page = reactive({ pageNum: 1, pageSize: 20, total: 0 })
const rows = ref([])
const loading = ref(false)
const detail = ref({})
@@ -253,7 +249,6 @@ load()
<style scoped>
.page-card { background: #fff; padding: 16px 20px; border-radius: 6px; border: 1px solid #f0f0f0; }
.breadcrumb { font-size: 13px; color: #8c8c8c; margin-bottom: 12px; }
.filter-form { display: flex; flex-wrap: wrap; gap: 0 16px; padding-bottom: 12px; border-bottom: 1px solid #f0f0f0; margin-bottom: 12px; }
.pdf-preview { margin-top: 12px; }
.file-preview { display: flex; justify-content: center; align-items: flex-start; min-height: 480px; }
.file-preview-iframe { width: 100%; height: 70vh; border: 1px solid #ebeef5; border-radius: 4px; }
ry-vue3/src/views/doctor/Projects.vue
+6 -7
View File
@@ -19,11 +19,11 @@
</template>
</el-table-column>
<el-table-column label="操作" width="220" fixed="right">
<template #default="{ row }">
<el-button link type="primary" @click="onView(row)">查看</el-button>
<el-button link type="primary" @click="onPublicity(row)">查看公示</el-button>
<el-button link type="primary" :disabled="!hasFile(row)" @click="onDownload(row)">下载</el-button>
</template>
<template #default="{ row }"><div class="table-actions">
<el-link :underline="false" type="primary" @click="onView(row)">查看</el-link>
<el-link :underline="false" type="primary" @click="onPublicity(row)">查看公示</el-link>
<el-link :underline="false" type="primary" :disabled="!hasFile(row)" @click="onDownload(row)">下载</el-link>
</div></template>
</el-table-column>
</el-table>
@@ -67,7 +67,7 @@ import { useUserStore } from '@/store/user'
const router = useRouter()
const userStore = useUserStore()
const q = reactive({ projectNo: '', projectName: '', meetingName: '' })
const page = reactive({ pageNum: 1, pageSize: 10, total: 0 })
const page = reactive({ pageNum: 1, pageSize: 20, total: 0 })
const rows = ref([])
const loading = ref(false)
const detail = ref({})
@@ -136,7 +136,6 @@ load()
<style scoped>
.page-card { background: #fff; padding: 16px 20px; border-radius: 6px; border: 1px solid #f0f0f0; }
.breadcrumb { font-size: 13px; color: #8c8c8c; margin-bottom: 12px; }
.filter-form { display: flex; flex-wrap: wrap; gap: 0 16px; padding-bottom: 12px; border-bottom: 1px solid #f0f0f0; margin-bottom: 12px; }
.status { font-size: 13px; color: #595959; }
:deep(.el-button--primary) { background: var(--brand-primary); border-color: var(--brand-primary); border-radius: 4px; }
:deep(.el-button--primary:hover) { background: var(--brand-primary-deep); border-color: var(--brand-primary-deep); }
ry-vue3/src/views/doctor/SignFill.vue
+1 -1
View File
@@ -28,7 +28,7 @@
<el-option v-for="t in titleOptions" :key="t" :value="t" :label="t" />
<template #footer>
<el-input v-if="showTitleOther" v-model="titleOther" placeholder="其他职称" maxlength="50" @blur="form.title = titleOther" />
<el-button v-else link type="primary" @click="showTitleOther = true">+ 其他</el-button>
<el-link :underline="false" v-else type="primary" @click="showTitleOther = true">+ 其他</el-link>
</template>
</el-select>
</el-form-item>
ry-vue3/src/views/doctor/Submissions.vue
+7 -8
View File
@@ -48,7 +48,7 @@
<el-table-column label="设计文件" width="140">
<template #default="{ row }">
<template v-if="row.designFileUrl">
<el-button link type="primary" @click="openPreview(row.designFileUrl, '设计文件')">查看</el-button>
<el-link :underline="false" type="primary" @click="openPreview(row.designFileUrl, '设计文件')">查看</el-link>
<el-link type="primary" :href="row.designFileUrl" target="_blank">下载</el-link>
</template>
<span v-else>-</span>
@@ -61,11 +61,11 @@
</el-table-column>
<el-table-column prop="remark" label="备注" min-width="180" show-overflow-tooltip />
<el-table-column label="操作" width="180" fixed="right">
<template #default="{ row }">
<el-button link type="primary" @click="onView(row)">查看</el-button>
<el-button v-if="canModify(row)" link type="primary" @click="onEdit(row)">修改</el-button>
<el-button v-if="canSubmit(row)" link type="primary" @click="onSubmit(row)">提交</el-button>
</template>
<template #default="{ row }"><div class="table-actions">
<el-link :underline="false" type="primary" @click="onView(row)">查看</el-link>
<el-link :underline="false" v-if="canModify(row)" type="primary" @click="onEdit(row)">修改</el-link>
<el-link :underline="false" v-if="canSubmit(row)" type="primary" @click="onSubmit(row)">提交</el-link>
</div></template>
</el-table-column>
</el-table>
@@ -107,7 +107,7 @@ const q = reactive({
status: '',
remark: ''
})
const page = reactive({ pageNum: 1, pageSize: 10, total: 0 })
const page = reactive({ pageNum: 1, pageSize: 20, total: 0 })
const rows = ref([])
const loading = ref(false)
const selected = ref([])
@@ -209,7 +209,6 @@ onMounted(() => {
<style scoped>
.page-card { background: #fff; padding: 16px 20px; border-radius: 6px; border: 1px solid #f0f0f0; }
.breadcrumb { font-size: 13px; color: #8c8c8c; margin-bottom: 12px; }
.filter-form { display: flex; flex-wrap: wrap; gap: 0 16px; padding-bottom: 12px; border-bottom: 1px solid #f0f0f0; margin-bottom: 12px; }
.toolbar { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.status { font-size: 13px; color: #595959; }
:deep(.el-button--primary) { background: var(--brand-primary); border-color: var(--brand-primary); border-radius: 4px; }