From a3298d4e03b929a1fb9e00f3211baa577338b9c8 Mon Sep 17 00:00:00 2001
From: 快乐的昕的电脑 <快乐的昕的电脑@DESKTOP-C2BQPQU>
Date: 星期三, 15 十月 2025 10:38:23 +0800
Subject: [PATCH] 界面修改
---
components/WorkOrderPrint.vue | 173 ++++++++++++++++++++++++++++++++++++---------------------
1 files changed, 109 insertions(+), 64 deletions(-)
diff --git a/components/WorkOrderPrint.vue b/components/WorkOrderPrint.vue
index b43c90f..04daa51 100644
--- a/components/WorkOrderPrint.vue
+++ b/components/WorkOrderPrint.vue
@@ -1,5 +1,6 @@
<template>
- <view class="page">
+ <!-- 鏍瑰厓绱犲鍔犲姩鎬佺被锛屽脊绐楀嚭鐜版椂闄勫姞 has-overlay锛岀敤浜庢帶鍒跺簳灞備氦浜掍笌灞傜骇 -->
+ <view class="page" :class="{'has-overlay': (isShowUserSelect || isShow || barcodeIsShow)}">
<view class="status-section">
<!-- 鎶ュ伐璁板綍琛� -->
<view class="report-table-wrapper">
@@ -23,7 +24,7 @@
<tbody>
<tr>
<td>{{ nowTime }}</td>
- <td>{{ staffNo || '-' }}</td>
+ <td>{{ staffName || '-' }}</td>
<td>{{ orderNo || '-' }}</td>
<td>{{ order.daa003 || '-' }}</td>
<td>{{ planQtyDisplay }}</td>
@@ -68,7 +69,6 @@
</view>
</view>
- <!-- 宸茬Щ闄�: 浜у搧缂栫爜 / 浜у搧鍚嶇О / 浜у搧瑙勬牸 杈撳叆鍖哄煙 -->
<!-- 涓嶈壇鏁伴噺 -->
<view class="print-section" style="margin-top:10px;">
<view class="barcode-info">
@@ -84,25 +84,28 @@
</view>
<!-- 鎶ュ伐浜洪�夋嫨 -->
- <!-- 鏇挎崲鍘熸湁鎶ュ伐浜洪�夋嫨鍖哄煙 -->
<view class="current-user-section">
<text>褰撳墠鎶ュ伐浜猴細</text>
- <text class="current-user-name">{{ staffNo ? staffNo.split(':')[1] : '鏈�夋嫨' }}</text>
+ <text class="current-user-name">{{ staffName || '鏈�夋嫨' }}</text>
<button class="select-user-btn" @click="isShowUserSelect = true">閫変汉</button>
</view>
<!-- 閫変汉寮圭獥 -->
<view v-if="isShowUserSelect" class="overlay">
<view class="popup user-select-popup">
- <view class="user-list">
- <button v-for="(u, index) in users" :key="index"
- class="user-list-btn"
- @click="selectUser(u)">
- {{ u.split(':')[1] }}
- </button>
+ <view class="user-list-scroll">
+ <view class="user-list-grid">
+ <button v-for="(u, index) in users"
+ :key="index"
+ class="user-list-btn"
+ :class="{'selected': u === staffNo}"
+ @click="selectUser(u)">
+ {{ u.split(':')[1] }}
+ </button>
+ </view>
</view>
- <view style="text-align:right;margin-top:10px;">
- <button class="clean-btn" @click="isShowUserSelect = false">鍏抽棴</button>
+ <view class="user-popup-footer">
+ <button class="clean-btn" style="width: 60%;" @click="isShowUserSelect = false">鍏抽棴</button>
</view>
</view>
</view>
@@ -160,7 +163,7 @@
props: { orderNo: String, orderId: Number, machineNo: String },
data() {
return {
- isShowUserSelect: false,
+ isShowUserSelect: false,
currentUser: '',
barcodeAmount: '',
users: [], userForm: [], staff: [], user: {},
@@ -178,7 +181,13 @@
calculatedCurrentCount() { return (this.productionCount || 0) - (this.initialValue || 0); },
calculatedTotalProduction() { return (this.kgQty || 0) + this.calculatedCurrentCount; },
calculatedDefectiveCount() { return this.calculatedTotalProduction - (this.sQuantity || 0); },
- planQtyDisplay() { return this.order.planQty || this.order.planQuantity || this.order.daa007 || this.order.daa010 || 0; }
+ planQtyDisplay() { return this.order.planQty || this.order.planQuantity || this.order.daa007 || this.order.daa010 || 0; },
+ // 鏂板锛氳В鏋愬鍚�
+ staffName() {
+ if (!this.staffNo) return '';
+ const parts = this.staffNo.split(':');
+ return parts.length > 1 ? parts[1] : this.staffNo;
+ }
},
created() {
this.initializeData();
@@ -190,11 +199,11 @@
},
beforeDestroy() { if (this.nowTimeTimer) clearInterval(this.nowTimeTimer); },
methods: {
- //閫夋嫨浜哄憳
- selectUser(u) {
- this.staffNo = u;
- this.isShowUserSelect = false;
- },
+ // 閫夋嫨浜哄憳
+ selectUser(u) {
+ this.staffNo = u;
+ this.isShowUserSelect = false;
+ },
updateNowTime() {
const d = new Date(), p = n => n.toString().padStart(2, '0');
this.nowTime = `${d.getFullYear()}-${p(d.getMonth() + 1)}-${p(d.getDate())} ${p(d.getHours())}:${p(d.getMinutes())}`;
@@ -357,6 +366,14 @@
flex-direction: column;
box-sizing: border-box;
}
+
+ .page.has-overlay .status-section > :not(.overlay) {
+ pointer-events: none;
+ }
+
+ .page.has-overlay .status-section > .overlay {
+ pointer-events: auto;
+ }
.report-table-wrapper {
margin-bottom: 8px;
@@ -527,6 +544,8 @@
display: flex;
justify-content: space-between;
margin-top: 12px;
+ position: relative;
+ z-index: 10;
}
.save-btn, .cancel-btn {
@@ -549,6 +568,7 @@
display: flex;
justify-content: center;
align-items: center;
+ z-index: 1000;
}
.popup {
@@ -562,6 +582,7 @@
max-height: 80vh;
overflow-y: auto;
border-radius: 8px;
+ z-index: 1001;
}
.clean-btn {
@@ -581,55 +602,79 @@
border-spacing: 3px;
}
- .current-user-section {
- display: flex;
- align-items: center;
- margin: 16px 0;
- font-size: 18px;
- border: 1.5px solid #f00;
- border-radius: 8px;
- padding: 12px 18px;
- background: #fff;
- width: fit-content;
- gap: 10px;
- }
+ .current-user-section {
+ display: flex;
+ align-items: center;
+ margin: 16px 0;
+ font-size: 18px;
+ border: 1.5px solid #f00;
+ border-radius: 8px;
+ padding: 12px 18px;
+ background: #fff;
+ width: fit-content;
+ gap: 10px;
+ }
- .current-user-name {
- font-weight: bold;
- font-size: 20px;
- margin: 0 10px;
- }
+ .current-user-name {
+ font-weight: bold;
+ font-size: 20px;
+ margin: 0 10px;
+ }
- .select-user-btn {
- padding: 4px 18px;
- background: #eee;
- border: 1px solid #aaa;
- border-radius: 6px;
- font-size: 16px;
- margin-left: 8px;
- }
+ .select-user-btn {
+ padding: 4px 18px;
+ background: #eee;
+ border: 1px solid #aaa;
+ border-radius: 6px;
+ font-size: 16px;
+ margin-left: 8px;
+ }
- .user-select-popup {
- width: 350px;
- max-width: 90vw;
- padding: 24px 18px;
- }
+ .user-select-popup {
+ width: 480px;
+ max-width: 96vw;
+ max-height: 80vh;
+ padding: 0;
+ display: flex;
+ flex-direction: column;
+ justify-content: flex-start;
+ }
- .user-list {
- display: flex;
- flex-direction: column;
- gap: 12px;
- }
+ .user-list-scroll {
+ flex: 1 1 auto;
+ overflow-y: auto;
+ padding: 32px 24px 0 24px;
+ }
- .user-list-btn {
- padding: 10px 0;
- font-size: 18px;
- background: #00a2e9;
- color: #fff;
- border: none;
- border-radius: 6px;
- cursor: pointer;
- }
+ .user-list-grid {
+ display: grid;
+ grid-template-columns: repeat(3, 1fr);
+ gap: 18px 18px;
+ margin-bottom: 0;
+ }
+
+ .user-popup-footer {
+ flex-shrink: 0;
+ padding: 18px 24px 24px 24px;
+ background: #fff;
+ text-align: center;
+ }
+
+ .user-list-btn {
+ padding: 18px 0;
+ font-size: 20px;
+ background: #00a2e9;
+ color: #fff;
+ border: none;
+ border-radius: 8px;
+ cursor: pointer;
+ width: 100%;
+ box-sizing: border-box;
+ }
+
+ .user-list-btn.selected {
+ background: #ff9500;
+ }
@media (max-width:1400px) {
input.highlight {
--
Gitblit v1.9.3