| | |
| | | <template> |
| | | <view class="page wide-layout" :class="{'has-overlay': (isShowUserSelect || isShow || barcodeIsShow)}"> |
| | | <view class="status-section"> |
| | | <!-- 报工记录表部分,在标题行添加刷新按钮 --> |
| | | <!-- 报工记录表部分 --> |
| | | <view class="report-table-wrapper"> |
| | | <view class="report-header"> |
| | | <view class="report-title">报工记录表</view> |
| | | <view class="header-buttons"> |
| | | <button class="refresh-btn-header" @click="refresh">刷新</button> |
| | | <button v-if="isGeneratingBarcode" class="reset-btn-header" @click="resetGenerateState">重置</button> |
| | | </view> |
| | | </view> |
| | | <!-- 移除了原来的刷新按钮 --> |
| | | |
| | | <!-- 数采总产量 --> |
| | | <view class="section-title-container"> |
| | | <view class="section-title">当前数采产量报工记录</view> |
| | | <button class="refresh-btn-inline" @click="refresh">刷新</button> |
| | | </view> |
| | | <div class="table-scroll"> |
| | | <table class="report-table"> |
| | | <thead> |
| | |
| | | .section-title { |
| | | font-size: 20px; |
| | | font-weight: normal; /* 已取消加粗 */ |
| | | margin: 18px 0 8px 0; |
| | | margin: 0; |
| | | color: #fff; |
| | | background: #007aff; |
| | | padding: 8px 18px; |
| | |
| | | } |
| | | |
| | | .report-header { |
| | | display: none; /* 隐藏原来的报告头部 */ |
| | | } |
| | | |
| | | .section-title-container { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | margin-bottom: 8px; |
| | | margin: 18px 0 8px 0; |
| | | } |
| | | |
| | | .refresh-btn-inline { |
| | | background: #00A2E9; |
| | | color: #fff; |
| | | border: none; |
| | | font-size: 22px; |
| | | border-radius: 8px; |
| | | padding: 8px 20px; |
| | | transition: background 0.15s; |
| | | margin-left: auto; /* 确保按钮靠右 */ |
| | | } |
| | | |
| | | .refresh-btn-inline:hover { |
| | | background: #0086c0; |
| | | } |
| | | |
| | | .header-buttons { |
| | |
| | | background: #00A2E9; |
| | | color: #fff; |
| | | border: none; |
| | | font-size: 16px; |
| | | font-size: 22px; |
| | | border-radius: 8px; |
| | | padding: 8px 20px; |
| | | transition: background 0.15s; |
| | |
| | | background: #ff6b6b; |
| | | color: #fff; |
| | | border: none; |
| | | font-size: 14px; |
| | | font-size: 22px; |
| | | border-radius: 8px; |
| | | padding: 8px 16px; |
| | | transition: background 0.15s; |
| | |
| | | } |
| | | |
| | | .page { |
| | | padding: 1.2vh 2vw; |
| | | padding: 0.5vh 2vw; /* 减少顶部内边距实现页面上移 */ |
| | | display: flex; |
| | | flex-direction: column; |
| | | box-sizing: border-box; |
| | |
| | | } |
| | | |
| | | .report-title { |
| | | font-size: 32px; |
| | | font-size: 22px; |
| | | font-weight: 600; |
| | | text-align: center; |
| | | margin: 0; |
| | |
| | | .current-user-section, |
| | | .defective-section, |
| | | .submit-section { |
| | | font-size: 30px; |
| | | font-size: 22px; |
| | | } |
| | | |
| | | /* 5. 输入框字体 */ |
| | | .inp, .bad-input { |
| | | font-size: 28px; |
| | | font-size: 22px; |
| | | } |
| | | |
| | | /* 6. 按钮字体 */ |
| | |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | /* 确保报试产数按钮内的文字正确居中 */ |
| | | .details-btn br { |
| | | display: none; |
| | | } |
| | | |
| | | .details-btn span { |
| | | font-size: 24px; |
| | | margin-top: 0px; /* 去掉多余间距 */ |
| | |
| | | .current-user-section { |
| | | display: flex; |
| | | align-items: center; |
| | | font-size: 32px; |
| | | font-size: 22px; |
| | | border: 1.5px solid #f00; |
| | | border-radius: 10px; |
| | | padding: 14px 22px; |
| | |
| | | |
| | | .current-user-name { |
| | | font-weight: bold; |
| | | font-size: 32px; |
| | | font-size: 22px; |
| | | } |
| | | |
| | | /* 选人按钮 - 蓝色主题 */ |
| | |
| | | border: none; /* 移除边框 */ |
| | | padding: 12px 22px; /* 调整内边距与提交按钮协调 */ |
| | | border-radius: 12px; /* 与提交按钮相同的圆角 */ |
| | | font-size: 32px; /* 保持字体大小 */ |
| | | font-size: 22px; /* 保持字体大小 */ |
| | | cursor: pointer; |
| | | transition: background 0.15s; /* 添加过渡效果 */ |
| | | height: 66px; /* 固定高度,与确认提交按钮一样 */ |
| | | box-sizing: border-box; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | } |
| | | |
| | | .select-user-btn:hover { |