diff --git a/ry-vue3/src/views/admin/Department.vue b/ry-vue3/src/views/admin/Department.vue index 7282ac5..ed14c56 100644 --- a/ry-vue3/src/views/admin/Department.vue +++ b/ry-vue3/src/views/admin/Department.vue @@ -166,4 +166,86 @@ onMounted(load) .admin-department { padding: 16px; } .breadcrumb { font-size: 13px; color: #8c8c8c; margin-bottom: 12px; } .pager { display: flex; justify-content: flex-end; margin-top: 12px; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } \ No newline at end of file diff --git a/ry-vue3/src/views/admin/LaborProtocol.vue b/ry-vue3/src/views/admin/LaborProtocol.vue index 8def1a8..a6ec1f0 100644 --- a/ry-vue3/src/views/admin/LaborProtocol.vue +++ b/ry-vue3/src/views/admin/LaborProtocol.vue @@ -139,4 +139,86 @@ onMounted(load) /* 表格空状态 (默认标记 = N) */ .dash-cell { color: #c0c4cc; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } \ No newline at end of file diff --git a/ry-vue3/src/views/admin/ProjectCategory.vue b/ry-vue3/src/views/admin/ProjectCategory.vue index 66d2275..3b47410 100644 --- a/ry-vue3/src/views/admin/ProjectCategory.vue +++ b/ry-vue3/src/views/admin/ProjectCategory.vue @@ -183,4 +183,86 @@ onMounted(load) .admin-project-category { padding: 16px; } .breadcrumb { font-size: 13px; color: #8c8c8c; margin-bottom: 12px; } .pager { display: flex; justify-content: flex-end; margin-top: 12px; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } \ No newline at end of file diff --git a/ry-vue3/src/views/admin/Title.vue b/ry-vue3/src/views/admin/Title.vue index 300c8db..8bb33c1 100644 --- a/ry-vue3/src/views/admin/Title.vue +++ b/ry-vue3/src/views/admin/Title.vue @@ -166,4 +166,86 @@ onMounted(load) .admin-title { padding: 16px; } .breadcrumb { font-size: 13px; color: #8c8c8c; margin-bottom: 12px; } .pager { display: flex; justify-content: flex-end; margin-top: 12px; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } \ No newline at end of file diff --git a/ry-vue3/src/views/admin/Users.vue b/ry-vue3/src/views/admin/Users.vue index c0205da..37903d1 100644 --- a/ry-vue3/src/views/admin/Users.vue +++ b/ry-vue3/src/views/admin/Users.vue @@ -30,7 +30,9 @@ - + @@ -56,7 +58,7 @@ 删除 - +
import { ref, reactive, computed, onMounted } from 'vue' import { listUser } from '@/api/system' +import GrTable from '@/components/GrTable.vue' import request from '@/utils/request' import { ElMessage, ElMessageBox } from 'element-plus' import { useUserStore } from '@/store/user' @@ -363,4 +366,86 @@ onMounted(load) .breadcrumb { font-size: 13px; color: #8c8c8c; margin-bottom: 12px; } .toolbar { margin-bottom: 12px; } .pager { display: flex; justify-content: flex-end; margin-top: 12px; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } \ No newline at end of file diff --git a/ry-vue3/src/views/doctor/Projects.vue b/ry-vue3/src/views/doctor/Projects.vue index 86ee4ba..6ba24cd 100644 --- a/ry-vue3/src/views/doctor/Projects.vue +++ b/ry-vue3/src/views/doctor/Projects.vue @@ -143,4 +143,86 @@ load() :deep(.el-table .el-button.is-link) { color: var(--brand-primary); background: transparent; border: none; } :deep(.el-table .el-button.is-link:hover) { color: var(--brand-primary-deep); background: transparent; } :deep(.el-table .el-button.is-link.is-disabled) { color: #c0c4cc; background: transparent; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } \ No newline at end of file diff --git a/ry-vue3/src/views/doctor/Submissions.vue b/ry-vue3/src/views/doctor/Submissions.vue index 8f17938..064dcad 100644 --- a/ry-vue3/src/views/doctor/Submissions.vue +++ b/ry-vue3/src/views/doctor/Submissions.vue @@ -218,4 +218,86 @@ onMounted(() => { :deep(.el-table .el-button.is-link:hover) { color: var(--brand-primary-deep); background: transparent; } :deep(.el-table .el-button.is-link.is-disabled) { color: #c0c4cc; background: transparent; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } \ No newline at end of file diff --git a/ry-vue3/src/views/executor-orgs/ExecutorOrgs.vue b/ry-vue3/src/views/executor-orgs/ExecutorOrgs.vue index a58c5d3..03600a3 100644 --- a/ry-vue3/src/views/executor-orgs/ExecutorOrgs.vue +++ b/ry-vue3/src/views/executor-orgs/ExecutorOrgs.vue @@ -263,4 +263,86 @@ onMounted(load) .breadcrumb { font-size: 13px; color: #8c8c8c; margin-bottom: 12px; } .batch-bar { display: flex; gap: 8px; margin-bottom: 12px; align-items: center; } .pager { display: flex; justify-content: flex-end; margin-top: 12px; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } diff --git a/ry-vue3/src/views/executor-people/ExecutorPeople.vue b/ry-vue3/src/views/executor-people/ExecutorPeople.vue index 43a95d2..3251ace 100644 --- a/ry-vue3/src/views/executor-people/ExecutorPeople.vue +++ b/ry-vue3/src/views/executor-people/ExecutorPeople.vue @@ -312,4 +312,86 @@ watch(() => route.fullPath, () => { .breadcrumb { font-size: 13px; color: #8c8c8c; margin-bottom: 12px; } .batch-bar { display: flex; gap: 8px; margin-bottom: 12px; align-items: center; } .pager { display: flex; justify-content: flex-end; margin-top: 12px; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } diff --git a/ry-vue3/src/views/executor/Labor.vue b/ry-vue3/src/views/executor/Labor.vue index 567bf6f..5302e4d 100644 --- a/ry-vue3/src/views/executor/Labor.vue +++ b/ry-vue3/src/views/executor/Labor.vue @@ -215,4 +215,86 @@ onMounted(load) } .hint-list p { margin-bottom: 4px; } .hint-list p:last-child { margin-bottom: 0; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } \ No newline at end of file diff --git a/ry-vue3/src/views/executor/Meetings.vue b/ry-vue3/src/views/executor/Meetings.vue index 24afe82..f0efaf9 100644 --- a/ry-vue3/src/views/executor/Meetings.vue +++ b/ry-vue3/src/views/executor/Meetings.vue @@ -34,7 +34,9 @@ - + @@ -62,7 +64,7 @@ 修改
- +
import { ref, reactive, onMounted } from 'vue' +import GrTable from '@/components/GrTable.vue' import { useRoute, useRouter } from 'vue-router' import { bizList } from '@/api/public' import { stageLabel, STAGE_OPTIONS, stageClass } from '@/utils/meetingStage' @@ -157,4 +160,86 @@ onMounted(() => { readQueryFromRoute(); load() }) .stage-waiting { color: #ff4d4f; border-color: #fbc4c4; background: #fef0f0; } .stage-frozen { color: #909399; border-color: #dcdfe6; background: #f5f7fa; opacity: 0.6; } .stage-default { color: #606266; border-color: #dcdfe6; background: #fafafa; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } diff --git a/ry-vue3/src/views/executor/People.vue b/ry-vue3/src/views/executor/People.vue index 0fb4183..3cdfae2 100644 --- a/ry-vue3/src/views/executor/People.vue +++ b/ry-vue3/src/views/executor/People.vue @@ -22,7 +22,9 @@
- + @@ -54,7 +56,7 @@ - +
\ No newline at end of file diff --git a/ry-vue3/src/views/executor/Projects.vue b/ry-vue3/src/views/executor/Projects.vue index a294bcc..7ac98b1 100644 --- a/ry-vue3/src/views/executor/Projects.vue +++ b/ry-vue3/src/views/executor/Projects.vue @@ -34,7 +34,14 @@
- + @@ -83,7 +90,7 @@ 分配 - +
{ readQueryFromRoute(); loadList() }) .assign-project-info { background: #f5f7fa; padding: 12px 16px; border-radius: 4px; margin-bottom: 12px; } .assign-project-info > div { display: flex; line-height: 22px; } .assign-project-info .lbl { color: #909399; width: 90px; flex-shrink: 0; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } \ No newline at end of file diff --git a/ry-vue3/src/views/expert/Experts.vue b/ry-vue3/src/views/expert/Experts.vue index 6395f32..d74270f 100644 --- a/ry-vue3/src/views/expert/Experts.vue +++ b/ry-vue3/src/views/expert/Experts.vue @@ -52,7 +52,9 @@
- + @@ -108,7 +110,7 @@ 已拒绝 - +
import { ref, reactive, computed, onMounted, watch } from 'vue' +import GrTable from '@/components/GrTable.vue' import { useRouter, useRoute } from 'vue-router' import { useUserStore } from '@/store/user' import { bizList, bizUpdate } from '@/api/public' @@ -469,4 +472,86 @@ watch(() => route.fullPath, () => { .cert-preview { display: flex; justify-content: center; align-items: center; min-height: 200px; background: #f5f7fa; border-radius: 4px; padding: 8px; } .cert-preview-error { color: #909399; padding: 40px 0; } + + /* ======================================== + 移动端适配 (≤768px) + - 卡片 padding 收窄 + - 工具栏横向滚动 (6 个按钮铺不下, 用 overflow-x) + - filter-form: 保持 label 左 + input 右横向布局 + - 表格字号收紧 + ======================================== */ + @media (max-width: 768px) { + /* 卡片 padding */ + .page-card { padding: 12px !important; border-radius: 4px !important; } + .breadcrumb { font-size: 12px !important; margin-bottom: 8px !important; } + + /* 工具栏: 横向滚动 (按钮多时不换行) */ + .toolbar { + flex-wrap: nowrap !important; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + padding-bottom: 6px; + margin-bottom: 8px !important; + scrollbar-width: thin; + } + .toolbar::-webkit-scrollbar { height: 4px; } + .toolbar::-webkit-scrollbar-thumb { background: var(--brand-slate-200); border-radius: 2px; } + .toolbar :deep(.action-btn), + .toolbar :deep(.el-button) { + flex-shrink: 0; + font-size: 12px !important; + padding: 0 10px !important; + height: 30px !important; + } + + /* filter-form: label 与输入框横向 (label 左, input 右) */ + .filter-form { + display: flex !important; + flex-direction: column !important; + align-items: stretch !important; + gap: 10px !important; + } + .filter-form :deep(.el-form-item) { + display: flex !important; + align-items: center !important; + margin-right: 0 !important; + margin-bottom: 0 !important; + } + .filter-form :deep(.el-form-item__label) { + float: none !important; + width: auto !important; + min-width: 80px !important; + text-align: right !important; + padding: 0 8px 0 0 !important; + font-size: 13px !important; + color: var(--el-text-color-regular) !important; + line-height: 32px !important; + height: 32px !important; + } + .filter-form :deep(.el-form-item__content) { + margin-left: 0 !important; + line-height: 32px !important; + flex: 1 !important; + min-width: 0 !important; + } + + /* 强制所有控件全宽, 覆盖 inline 260px / 140px / 120px */ + .filter-form :deep(.el-select), + .filter-form :deep(.el-input), + .filter-form :deep(.el-date-editor), + .filter-form :deep(.el-button), + .filter-form :deep(.el-cascader) { + width: 100% !important; + min-width: 0 !important; + margin-left: 0 !important; + margin-right: 0 !important; + display: block !important; + } + .filter-form :deep(.el-button + .el-button) { + margin-top: 8px !important; + } + + /* 表格字号收紧 */ + :deep(.el-table) { font-size: 12px !important; } + } diff --git a/ry-vue3/src/views/manager/ExecIntent.vue b/ry-vue3/src/views/manager/ExecIntent.vue index f855fe4..cf25f6e 100644 --- a/ry-vue3/src/views/manager/ExecIntent.vue +++ b/ry-vue3/src/views/manager/ExecIntent.vue @@ -24,7 +24,9 @@ - + @@ -52,7 +54,7 @@ 删除 - +
@@ -61,6 +63,7 @@