style: 优化报告厅预约界面暂无图片占位符样式
1. 使暂无图片占位符宽度与预约用途输入框保持一致(450px) 2. 增加响应式布局支持,在小屏幕上自动适应容器宽度 3. 更新变更记录文档
This commit is contained in:
1 parent
a4247ea901
commit
38166f105c
2 files changed
+30
-3
No files matched your search
@@ -0,0 +1,26 @@
|
|||||||
|
# 代码调整记录 2025-07-01
|
||||||
|
|
||||||
|
## 报告厅预约界面样式优化
|
||||||
|
|
||||||
|
### 调整内容
|
||||||
|
- 优化了报告厅预约界面中暂无图片占位符的样式
|
||||||
|
- 使暂无图片占位符宽度与预约用途输入框保持一致(450px)
|
||||||
|
- 增加了响应式布局支持,在小屏幕上自动适应容器宽度
|
||||||
|
|
||||||
|
### 具体修改
|
||||||
|
- 文件: `web/src/views/hq/hallReservation/index.vue`
|
||||||
|
- 修改了 `no-images-placeholder` 样式类:
|
||||||
|
- 将固定宽度改为响应式宽度 `width: 100%`
|
||||||
|
- 添加最大宽度限制 `max-width: 450px`
|
||||||
|
- 保持与预约用途输入框视觉统一
|
||||||
|
|
||||||
|
### 优化效果
|
||||||
|
- 提升了界面视觉统一性
|
||||||
|
- 改善了响应式布局表现
|
||||||
|
- 优化了用户体验
|
||||||
|
|
||||||
|
### 相关文件
|
||||||
|
- [x] web/src/views/hq/hallReservation/index.vue
|
||||||
|
|
||||||
|
提交人: wuzilong
|
||||||
|
完成时间: 2025-07-01 10:30:00
|
||||||
@@ -4,9 +4,9 @@
|
|||||||
<div ref="searchRef" v-show="showSearch" class="mb-[10px]">
|
<div ref="searchRef" v-show="showSearch" class="mb-[10px]">
|
||||||
<el-card shadow="hover">
|
<el-card shadow="hover">
|
||||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="100px">
|
<el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="100px">
|
||||||
<el-form-item label="报告厅ID" prop="hallId">
|
<!-- <el-form-item label="报告厅ID" prop="hallId">
|
||||||
<el-input v-model="queryParams.hallId" placeholder="请输入报告厅ID" clearable @keyup.enter="handleQuery" />
|
<el-input v-model="queryParams.hallId" placeholder="请输入报告厅ID" clearable @keyup.enter="handleQuery" />
|
||||||
</el-form-item>
|
</el-form-item> -->
|
||||||
<el-form-item label="报告厅名称" prop="hallName">
|
<el-form-item label="报告厅名称" prop="hallName">
|
||||||
<el-input v-model="queryParams.hallName" placeholder="请输入报告厅名称" clearable @keyup.enter="handleQuery" />
|
<el-input v-model="queryParams.hallName" placeholder="请输入报告厅名称" clearable @keyup.enter="handleQuery" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
@@ -1063,7 +1063,8 @@ onMounted(() => {
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
width: 450px; /* 与预约用途保持一致 */
|
width: 100%;
|
||||||
|
max-width: 450px; /* 与预约用途保持一致 */
|
||||||
height: 120px;
|
height: 120px;
|
||||||
background-color: #f5f7fa;
|
background-color: #f5f7fa;
|
||||||
border: 2px dashed #dcdfe6;
|
border: 2px dashed #dcdfe6;
|
||||||
|
|||||||
Reference in new issue
Block a user