From 6e332109c3d179a29514d929dbe9f45d69db32d6 Mon Sep 17 00:00:00 2001
From: 快乐的昕的电脑 <快乐的昕的电脑@DESKTOP-C2BQPQU>
Date: 星期三, 15 十月 2025 15:59:34 +0800
Subject: [PATCH] 下拉工单状态，新增“开工”，去除“完工”
---
components/WorkOrderPrint.vue | 693 +++++++++++++++++++++++++++++++++++++--------------------
1 files changed, 445 insertions(+), 248 deletions(-)
diff --git a/components/WorkOrderPrint.vue b/components/WorkOrderPrint.vue
index f5ce7d8..1ee9177 100644
--- a/components/WorkOrderPrint.vue
+++ b/components/WorkOrderPrint.vue
@@ -1,44 +1,44 @@
<template>
- <view class="page">
+ <view class="page wide-layout" :class="{'has-overlay': (isShowUserSelect || isShow || barcodeIsShow)}">
<view class="status-section">
- <!-- 鎶ュ伐璁板綍琛� -->
<view class="report-table-wrapper">
<view class="report-title">鎶ュ伐璁板綍琛�</view>
- <table class="report-table">
- <thead>
- <tr>
- <th>鏃堕棿</th>
- <th>鎶ュ伐浜�</th>
- <th>宸ュ崟鍙�</th>
- <th>浜у搧鍚嶇О</th>
- <th>璁″垝鐢熶骇鏁�</th>
- <th>鏈哄彴鍙�</th>
- <th>鍒濆閲囬泦鏁�</th>
- <th>鎶ュ伐鏃堕噰闆嗘暟</th>
- <th>鎶ュ伐鏁帮紙璁＄畻锛�</th>
- <th>涓嶈壇鏁�</th>
- <th>鑹搧鏁帮紙璁＄畻锛�</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>{{ nowTime }}</td>
- <td>{{ staffNo || '-' }}</td>
- <td>{{ orderNo || '-' }}</td>
- <td>{{ order.daa003 || '-' }}</td>
- <td>{{ planQtyDisplay }}</td>
- <td>{{ machineNo || '-' }}</td>
- <td>{{ initialValue }}</td>
- <td>{{ productionCount }}</td>
- <td>{{ calculatedTotalProduction }}</td>
- <td>{{ calculatedDefectiveCount }}</td>
- <td>{{ sQuantity }}</td>
- </tr>
- </tbody>
- </table>
+ <div class="table-scroll">
+ <table class="report-table">
+ <thead>
+ <tr>
+ <th>鏃堕棿</th>
+ <th>鎶ュ伐浜�</th>
+ <th>宸ュ崟鍙�</th>
+ <th>浜у搧鍚嶇О</th>
+ <th>璁″垝鐢熶骇鏁�</th>
+ <th>鏈哄彴鍙�</th>
+ <th>鍒濆閲囬泦鏁�</th>
+ <th>鎶ュ伐鏃堕噰闆嗘暟</th>
+ <th>鎶ュ伐鏁帮紙璁＄畻锛�</th>
+ <th>涓嶈壇鏁�</th>
+ <th>鑹搧鏁帮紙璁＄畻锛�</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>{{ nowTime }}</td>
+ <td>{{ staffDisplay || '-' }}</td>
+ <td>{{ orderNo || '-' }}</td>
+ <td>{{ order.daa003 || '-' }}</td>
+ <td>{{ planQtyDisplay }}</td>
+ <td>{{ machineNo || '-' }}</td>
+ <td>{{ initialValue }}</td>
+ <td>{{ productionCount }}</td>
+ <td>{{ calculatedTotalProduction }}</td>
+ <td>{{ calculatedDefectiveCount }}</td>
+ <td>{{ sQuantity }}</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
</view>
- <!-- 缁熻琛岋紙鍒锋柊鎸夐挳绉诲埌杩欓噷鍙充晶锛� -->
<view class="status-row">
<view class="status-box">
<text>鏈哄彴闈㈡澘鏁帮細</text>
@@ -68,59 +68,69 @@
</view>
</view>
- <!-- 鍩虹淇℃伅锛堝凡鍘绘帀 鍥惧彿 / 鏉愯川 / 棰滆壊锛� -->
- <view class="basic-info">
- <view class="form-row">
- <view class="form-item">
- <label>浜у搧缂栫爜:</label>
- <input class="inp" type="text" v-model="order.daa002" disabled />
+ <view class="flex-row gap-lg">
+ <view class="print-section flex-grow">
+ <view class="barcode-info">
+ <view class="user-select">
+ <text>涓嶈壇鏁伴噺锛�</text>
+ <input v-model="customAmount" class="inp bad-input" placeholder="璇疯緭鍏ユ暟閲�" />
+ </view>
+ <view class="user-select">
+ <button class="details-btn" @click="confirmCustomAmount">纭鎻愪氦</button>
+ </view>
</view>
- <view class="form-item">
- <label>浜у搧鍚嶇О:</label>
- <superwei-combox :candidates="DAA003List" v-model="order.daa003"
- @select="onDaa003Change" class="inp"></superwei-combox>
+ </view>
+
+ <view class="current-user-section fill-width">
+ <text>褰撳墠鎶ュ伐浜猴細</text>
+ <text class="current-user-name">{{ staffDisplay || '鏈�夋嫨' }}</text>
+ <button class="select-user-btn" @click="isShowUserSelect = true">閫変汉</button>
+ </view>
+ </view>
+
+ <!-- 閫変汉寮圭獥 -->
+ <view v-if="isShowUserSelect" class="overlay">
+ <view class="popup user-select-popup">
+ <!-- 鎼滅储鏍� -->
+ <view class="user-search-bar">
+ <input v-model.trim="userSearch"
+ type="text"
+ class="user-search-input"
+ placeholder="杈撳叆宸ュ彿鎴栧鍚嶆悳绱�"
+ @keydown.enter.prevent />
+ <button v-if="userSearch" class="user-search-clear" @click="userSearch=''">娓呯┖</button>
+ <view class="user-search-info">
+ 鍖归厤锛歿{ filteredUsers.length }} / {{ users.length }}
+ </view>
</view>
- <view class="form-item">
- <label>浜у搧瑙勬牸:</label>
- <input class="inp" type="text" v-model="order.daa004" disabled />
+ <view class="user-list-scroll">
+ <template v-if="filteredUsers.length">
+ <view class="user-list-grid">
+ <button v-for="(u, index) in filteredUsers"
+ :key="index"
+ :class="['user-list-btn', {'selected': u===staffNo}]"
+ @click="selectUser(u)">
+ <span class="user-code">{{ u.split(':')[0] }}</span>
+ <span class="user-name">{{ u.split(':')[1] }}</span>
+ </button>
+ </view>
+ </template>
+ <view v-else class="no-user-result">
+ 鏈壘鍒板尮閰嶄汉鍛�
+ </view>
+ </view>
+ <view class="user-popup-footer">
+ <button class="clean-btn wide-btn" @click="isShowUserSelect = false">鍏抽棴</button>
</view>
</view>
</view>
- <!-- 涓嶈壇鏁伴噺 -->
- <view class="print-section" style="margin-top:10px;">
- <view class="barcode-info">
- <view class="user-select">
- <text style="display:inline-block;float:left;">涓嶈壇鏁伴噺锛�</text>
- <input v-model="customAmount" class="inp"
- style="width:55%;height:60px;border:3px solid #808080;font-size:32px;text-align:center;margin-top:5px;"
- placeholder="璇疯緭鍏ユ暟閲�" />
- </view>
- <view class="user-select" style="margin-left:30px;">
- <button class="details-btn" @click="confirmCustomAmount">纭鎻愪氦</button>
- </view>
- </view>
- </view>
-
- <!-- 鎶ュ伐浜洪�夋嫨 -->
- <view>
- <view class="reason-section" style="margin-bottom:-10px">
- <text>鎶ュ伐浜猴細</text>
- <view class="reason-buttons" style="font-size:20px;">
- <button v-for="(u,index) in users" :key="index"
- :class="{'reason-btn':true,'selected': staffNo===u}"
- @click="toggleUser(u)" v-text="u"></button>
- </view>
- </view>
- </view>
-
- <!-- 搴曢儴鎸夐挳 -->
<view class="bottom-section">
<button class="save-btn" @click="save">淇濆瓨骞剁敓鏁�</button>
<button class="cancel-btn" @click="cancel">鍙栨秷</button>
</view>
- <!-- 淇濈暀寮圭獥 -->
+ <!-- 淇濈暀鏃у脊绐� -->
<view v-if="isShow" class="overlay">
<view class="popup">
<view class="bottom-section1">
@@ -131,7 +141,9 @@
<view class="reason-buttons">
<button v-for="(u,index) in users" :key="index"
:class="{'reason-btn':true,'selected': user===u}"
- @click="toggleUser(u)" v-text="u"></button>
+ @click="toggleUser(u)">
+ {{ formatUser(u) }}
+ </button>
</view>
</view>
</view>
@@ -153,9 +165,7 @@
<uni-td align="center"><input v-model="item.okQty" /></uni-td>
</uni-tr>
</uni-table>
- <view>
- <button class="clean-btn" type="warn" @click="barcodeIsShow=false">鍏抽棴</button>
- </view>
+ <view><button class="clean-btn" type="warn" @click="barcodeIsShow=false">鍏抽棴</button></view>
</view>
</view>
</view>
@@ -169,61 +179,37 @@
props: { orderNo: String, orderId: Number, machineNo: String },
data() {
return {
+ isShowUserSelect: false,
currentUser: '',
barcodeAmount: '',
- users: [],
- userForm: [],
- staff: [],
- user: {},
- productionCount: 0,
- printedCount: 0,
- defectiveCount: 0,
- order: {},
- icount: 1,
- bqty: 0,
- sQuantity: 0,
- kgQty: 0,
- initialValue: 0,
- qqty: 0,
- ngStaid: 0,
- bufferData: '',
- dataToPrint: [],
- isLoading: false,
- but: false,
- DAA003List: [],
- lineList: [],
- isShow: false,
- barcodeIsShow: false,
- barcodeList: [],
- staffNo: '',
- printStr: '',
- printMac: '',
- bluetoothSocket: {},
- device: '',
- uuid: '',
- printNum: 1,
- reportingList: [],
- printLoading: false,
- customAmount: '',
- isGeneratingBarcode: false,
- lastGenerateTime: 0,
- generateRequestId: null,
- nowTimeTimer: null,
- nowTime: ''
- };
+ users: [], userForm: [], staff: [], user: {},
+ productionCount: 0, printedCount: 0, defectiveCount: 0, order: {},
+ icount: 1, bqty: 0, sQuantity: 0, kgQty: 0, initialValue: 0, qqty: 0,
+ ngStaid: 0, bufferData: '', dataToPrint: [], isLoading: false, but: false,
+ DAA003List: [], lineList: [], isShow: false, barcodeIsShow: false, barcodeList: [],
+ staffNo: '', printStr: '', printMac: '', bluetoothSocket: {}, device: '', uuid: '',
+ printNum: 1, reportingList: [], printLoading: false, customAmount: '',
+ isGeneratingBarcode: false, lastGenerateTime: 0, generateRequestId: null,
+ nowTimeTimer: null, nowTime: '',
+ // 鏂板锛氭悳绱㈠叧閿瓧
+ userSearch: ''
+ }
},
computed: {
- calculatedCurrentCount() {
- return (this.productionCount || 0) - (this.initialValue || 0);
+ 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; },
+ staffDisplay() {
+ if (!this.staffNo) return '';
+ const segs = this.staffNo.split(':');
+ return segs.length > 1 ? `${segs[0]} ${segs[1]}` : this.staffNo;
},
- 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;
+ // 鏂板锛氳繃婊ゅ悗鐨勭敤鎴峰垪琛�
+ filteredUsers() {
+ if (!this.userSearch) return this.users;
+ const kw = this.userSearch.trim().toLowerCase();
+ return this.users.filter(u => u.toLowerCase().includes(kw));
}
},
created() {
@@ -234,10 +220,14 @@
this.updateNowTime();
this.nowTimeTimer = setInterval(this.updateNowTime, 60000);
},
- beforeDestroy() {
- if (this.nowTimeTimer) clearInterval(this.nowTimeTimer);
- },
+ beforeDestroy() { if (this.nowTimeTimer) clearInterval(this.nowTimeTimer); },
methods: {
+ formatUser(u) {
+ if (!u) return '';
+ const segs = u.split(':');
+ return segs.length > 1 ? `${segs[0]} ${segs[1]}` : u;
+ },
+ selectUser(u) { this.staffNo = u; this.isShowUserSelect = false; this.userSearch = ''; },
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())}`;
@@ -249,9 +239,7 @@
this.isGeneratingBarcode = false; this.lastGenerateTime = 0; this.generateRequestId = null;
},
resetGenerateState() {
- this.isGeneratingBarcode = false;
- this.generateRequestId = null;
- this.lastGenerateTime = 0;
+ this.isGeneratingBarcode = false; this.generateRequestId = null; this.lastGenerateTime = 0;
this.$showMessage("宸查噸缃潯鐮佺敓鎴愮姸鎬�");
},
refresh() {
@@ -259,9 +247,7 @@
url: "http://192.168.0.94:9095/Numerical/RefreshDev",
data: { machineNo: this.order.machineNo },
contentType: "application/json"
- }).then(r => {
- if (r.code == 200) this.fetchData(true); else this.$showMessage("鍚屾澶辫触");
- });
+ }).then(r => { r.code == 200 ? this.fetchData(true) : this.$showMessage("鍚屾澶辫触"); });
},
onDaa003Change(v) {
let o = this.lineList[this.DAA003List.indexOf(v)];
@@ -289,10 +275,8 @@
this.staffNo = this.user;
},
confirmCustomAmount() {
- if (!this.customAmount || isNaN(Number(this.customAmount))) {
- this.$showMessage('璇疯緭鍏ユ湁鏁堢殑鏁伴噺'); return;
- }
- let amount = Number(this.customAmount);
+ if (!this.customAmount || isNaN(Number(this.customAmount))) { this.$showMessage('璇疯緭鍏ユ湁鏁堢殑鏁伴噺'); return; }
+ const amount = Number(this.customAmount);
this.$post({
url: "/MesInvItemBarcodes/AddBFToBarcodes",
data: { orderNo: this.orderNo, orderId: this.orderId, bf: amount }
@@ -318,10 +302,11 @@
});
},
getXS0101() {
- this.$post({ url: "/MesStaff/GetAllXS0101" }).then(res => {
- this.staff = res.data.tbBillList;
- this.users = this.staff.map(s => s.staffNo + ":" + s.staffName);
- });
+ this.$post({ url: "/MesStaff/GetAllXS0101" })
+ .then(res => {
+ this.staff = res.data.tbBillList;
+ this.users = this.staff.map(s => s.staffNo + ":" + s.staffName);
+ });
},
getWomdaaPrintById() {
this.$post({ url: "/Womdaa/GetWomdaaPrintById", data: { orderId: this.orderId } })
@@ -343,7 +328,7 @@
init() {
try {
const v = this.getAndroidVersion();
- if (v >= 12) this.initForAndroid12Plus(); else this.initForAndroidLegacy();
+ v >= 12 ? this.initForAndroid12Plus() : this.initForAndroidLegacy();
} catch (e) { console.error(e); }
},
getAndroidVersion() {
@@ -389,47 +374,60 @@
this.isShow = false;
this.isGeneratingBarcode = false;
this.generateRequestId = null;
- this.bufferData = '';
- this.dataToPrint = [];
- this.staffNo = null;
- this.user = '';
- this.barcodeAmount = '';
- this.icount = 1;
- this.staff = null;
+ this.bufferData = ''; this.dataToPrint = [];
+ this.staffNo = null; this.user = ''; this.barcodeAmount = ''; this.icount = 1; this.staff = null;
}
}
- };
+ }
</script>
<style scoped>
.page {
- padding: 1.2vh 1.5vw;
+ padding: 1.2vh 2vw;
display: flex;
flex-direction: column;
box-sizing: border-box;
}
+ .wide-layout {
+ max-width: 1600px;
+ margin: 0 auto;
+ }
+
+ .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;
+ margin-bottom: 12px;
+ }
+
+ .table-scroll {
+ overflow-x: auto;
}
.report-title {
- font-size: 22px;
+ font-size: 24px;
font-weight: 600;
text-align: center;
- margin: 0 0 6px;
+ margin: 0 0 8px;
}
.report-table {
+ min-width: 1080px;
width: 100%;
border-collapse: collapse;
- font-size: 13px;
+ font-size: 14px;
background: #fff;
}
.report-table th, .report-table td {
border: 1px solid #555;
- padding: 4px 6px;
+ padding: 6px 8px;
text-align: center;
white-space: nowrap;
}
@@ -437,18 +435,18 @@
.status-section {
display: flex;
flex-direction: column;
+ gap: 10px;
}
.status-row {
display: flex;
flex-wrap: wrap;
align-items: center;
- gap: 4px;
+ gap: 10px;
background: #f9f9f9;
- padding: 8px 10px;
- border-radius: 6px;
- box-shadow: 0 1px 3px rgba(0,0,0,.05);
- margin-bottom: 6px;
+ padding: 10px 14px;
+ border-radius: 8px;
+ box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
.status-box {
@@ -458,39 +456,43 @@
.result-box {
background: #f0f8ff;
- padding: 2px 10px;
- border-radius: 4px;
- border-left: 4px solid #007aff;
+ padding: 4px 12px;
+ border-radius: 6px;
+ border-left: 5px solid #007aff;
}
input.highlight {
- width: 7.5vw;
- min-width: 90px;
+ width: 9vw;
+ min-width: 110px;
font-weight: 600;
border: none;
background: #fff;
text-align: center;
- font-size: 16px;
- padding: 4px 0;
- border-radius: 4px;
- box-shadow: inset 0 1px 3px rgba(0,0,0,.1);
+ font-size: 18px;
+ padding: 6px 0;
+ border-radius: 6px;
+ box-shadow: inset 0 1px 3px rgba(0,0,0,.12);
}
.operator-box {
display: flex;
justify-content: center;
align-items: center;
- font-size: 26px;
+ font-size: 28px;
font-weight: bold;
color: #007aff;
- margin: 0 4px;
+ margin: 0 6px;
}
.btn-group {
margin-left: auto;
display: flex;
align-items: center;
- gap: 10px;
+ gap: 12px;
+ }
+
+ .refresh-btn-inline, .reset-btn-inline {
+ transition: .15s;
}
.refresh-btn-inline {
@@ -498,76 +500,298 @@
color: #fff;
border: none;
font-size: 18px;
- border-radius: 8px;
- padding: 6px 26px;
+ border-radius: 10px;
+ padding: 8px 30px;
}
+
+ .refresh-btn-inline:hover {
+ background: #0086c0;
+ }
.reset-btn-inline {
background: #ff6b6b;
color: #fff;
border: none;
font-size: 16px;
- border-radius: 8px;
- padding: 6px 14px;
+ border-radius: 10px;
+ padding: 8px 18px;
}
- .basic-info .form-row {
+ .reset-btn-inline:hover {
+ background: #e94d4d;
+ }
+
+ .flex-row {
display: flex;
- justify-content: space-between;
- margin: 4px 0 10px;
+ flex-wrap: wrap;
+ gap: 20px;
+ align-items: flex-start;
}
- .form-item {
- width: 32%;
+ .flex-grow {
+ flex: 1 1 540px;
}
- .inp {
- width: 100%;
- padding: 6px;
- font-size: 14px;
- border: 1px solid #808080;
- border-radius: 6px;
- box-sizing: border-box;
+ .gap-lg {
+ gap: 30px;
}
.print-section {
- padding: 4px 0 10px;
- margin-bottom: 8px;
+ padding: 6px 0 14px;
+ margin-bottom: 0;
+ flex: 1;
}
.barcode-info {
display: flex;
+ flex-wrap: wrap;
align-items: flex-start;
- gap: 20px;
+ gap: 30px;
+ }
+
+ .inp {
+ padding: 8px;
+ font-size: 16px;
+ border: 1px solid #808080;
+ border-radius: 8px;
+ box-sizing: border-box;
+ }
+
+ .bad-input {
+ width: 320px;
+ max-width: 100%;
+ height: 66px;
+ border: 3px solid #808080;
+ font-size: 34px;
+ text-align: center;
}
.details-btn {
- padding: 10px 26px;
+ padding: 12px 34px;
background: #00a2e9;
color: #fff;
- font-size: 18px;
+ font-size: 20px;
border: none;
cursor: pointer;
- border-radius: 10px;
+ border-radius: 12px;
}
+ .details-btn:hover {
+ background: #008ac2;
+ }
+
+ .current-user-section {
+ display: flex;
+ align-items: center;
+ font-size: 18px;
+ border: 1.5px solid #f00;
+ border-radius: 10px;
+ padding: 14px 22px;
+ background: #fff;
+ gap: 14px;
+ }
+
+ .fill-width {
+ flex: 0 1 380px;
+ }
+
+ .current-user-name {
+ font-weight: bold;
+ font-size: 22px;
+ }
+
+ .select-user-btn {
+ padding: 6px 22px;
+ background: #eee;
+ border: 1px solid #aaa;
+ border-radius: 8px;
+ font-size: 16px;
+ }
+
+ .select-user-btn:hover {
+ background: #ddd;
+ }
+
+ .overlay {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: rgba(0,0,0,.45);
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ z-index: 1000;
+ }
+
+ .popup {
+ background: #fff;
+ padding: 2vh;
+ border: 1px solid #ccc;
+ box-shadow: 0 0 14px rgba(0,0,0,.12);
+ width: 72vw;
+ max-width: 1400px;
+ height: 70vh;
+ font-size: 1.4vw;
+ max-height: 80vh;
+ overflow-y: auto;
+ border-radius: 12px;
+ z-index: 1001;
+ }
+
+ .user-select-popup {
+ width: 860px;
+ max-width: 80vw;
+ height: auto;
+ min-height: 480px;
+ padding: 0;
+ display: flex;
+ flex-direction: column;
+ }
+ /* 鎼滅储鏉℃牱寮� */
+ .user-search-bar {
+ display: flex;
+ align-items: center;
+ gap: 12px;
+ padding: 18px 32px 0 32px;
+ background: #fff;
+ flex-wrap: wrap;
+ }
+
+ .user-search-input {
+ flex: 1 1 260px;
+ padding: 10px 14px;
+ font-size: 16px;
+ border: 1px solid #bbb;
+ border-radius: 8px;
+ outline: none;
+ }
+
+ .user-search-input:focus {
+ border-color: #007aff;
+ box-shadow: 0 0 0 2px rgba(0,122,255,.15);
+ }
+
+ .user-search-clear {
+ padding: 10px 18px;
+ background: #ff9f43;
+ color: #fff;
+ border: none;
+ border-radius: 8px;
+ font-size: 14px;
+ cursor: pointer;
+ }
+
+ .user-search-clear:hover {
+ background: #ff8920;
+ }
+
+ .user-search-info {
+ font-size: 14px;
+ color: #555;
+ }
+
+ .user-list-scroll {
+ flex: 1 1 auto;
+ overflow-y: auto;
+ padding: 24px 32px 0 32px;
+ }
+
+ .user-list-grid {
+ display: grid;
+ grid-template-columns: repeat(auto-fill,minmax(150px,1fr));
+ gap: 24px 24px;
+ }
+
+ .user-list-btn {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ gap: 6px;
+ padding: 16px 10px;
+ height: 120px;
+ font-size: 18px;
+ background: #00a2e9;
+ color: #fff;
+ border: none;
+ border-radius: 10px;
+ cursor: pointer;
+ box-sizing: border-box;
+ word-break: break-word;
+ }
+
+ .user-list-btn .user-code {
+ font-weight: 600;
+ font-size: 18px;
+ }
+
+ .user-list-btn .user-name {
+ font-size: 16px;
+ }
+
+ .user-list-btn.selected {
+ background: #0072c9;
+ box-shadow: 0 0 0 3px rgba(255,255,255,.6) inset;
+ }
+
+ .user-list-btn:hover {
+ background: #008ed0;
+ }
+
+ .no-user-result {
+ padding: 40px 0;
+ text-align: center;
+ font-size: 18px;
+ color: #666;
+ }
+
+ .user-popup-footer {
+ flex-shrink: 0;
+ padding: 22px 32px 32px 32px;
+ background: #fff;
+ text-align: center;
+ }
+
+ .clean-btn {
+ width: 48%;
+ padding: 1.6vh;
+ color: #fff;
+ font-size: 1.4vw;
+ border: none;
+ text-align: center;
+ cursor: pointer;
+ border-radius: .6vw;
+ background: #007aff;
+ }
+
+ .clean-btn.wide-btn {
+ width: 60%;
+ font-size: 20px;
+ }
+
+ .clean-btn:hover {
+ background: #0062c9;
+ }
+
.reason-section {
- margin: 10px 0 12px;
+ margin: 14px 0 18px;
}
.reason-buttons {
display: grid;
grid-template-columns: repeat(5,1fr);
- gap: 10px;
+ gap: 12px;
}
.reason-btn {
- padding: 8px 4px;
+ padding: 10px 6px;
background: #808080;
color: #fff;
font-size: 14px;
border: none;
- border-radius: 6px;
+ border-radius: 8px;
cursor: pointer;
}
@@ -579,55 +803,23 @@
.bottom-section {
display: flex;
justify-content: space-between;
- margin-top: 12px;
+ margin-top: 16px;
+ gap: 16px;
}
.save-btn, .cancel-btn {
- width: 48%;
- padding: 14px 0;
+ flex: 1;
+ padding: 16px 0;
background: #00A2E9;
color: #fff;
- font-size: 18px;
+ font-size: 20px;
border: none;
- border-radius: 8px;
+ border-radius: 10px;
}
- .overlay {
- position: fixed;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- background: rgba(0,0,0,.5);
- display: flex;
- justify-content: center;
- align-items: center;
- }
-
- .popup {
- background: #fff;
- padding: 2vh;
- border: 1px solid #ccc;
- box-shadow: 0 0 10px rgba(0,0,0,.1);
- width: 70vw;
- height: 70vh;
- font-size: 1.6vw;
- max-height: 80vh;
- overflow-y: auto;
- border-radius: 8px;
- }
-
- .clean-btn {
- width: 48%;
- padding: 1.5vh;
- color: #fff;
- font-size: 1.5vw;
- border: none;
- text-align: center;
- cursor: pointer;
- border-radius: .5vw;
- background: #007aff;
- }
+ .save-btn:hover, .cancel-btn:hover {
+ background: #0086c0;
+ }
.table1 {
width: 100%;
@@ -636,7 +828,12 @@
@media (max-width:1400px) {
input.highlight {
- font-size: 14px;
+ font-size: 16px;
+ }
+
+ .user-list-btn {
+ height: 110px;
+ font-size: 16px;
}
.reason-btn {
--
Gitblit v1.9.3