<template>
|
<view class="page">
|
<!-- 顶部显示当前系统采集生产数，打码报工数和不良数 -->
|
<view class="status-section">
|
<button @click="fetchData(true)">刷新</button>
|
<view class="status-box">
|
<text>当前机采数：</text>
|
<input v-model="productionCount" class="highlight" disabled />
|
</view>
|
<view class="status-box">
|
<text>当前已报工数：</text>
|
<input v-model="printedCount" class="highlight" disabled />
|
</view>
|
<view class="status-box">
|
<text>不良数：</text>
|
<input v-model="defectiveCount" class="highlight" disabled />
|
</view>
|
<view class="status-box">
|
<text>已打印条码数：</text>
|
<input v-model="sQuantity" class="highlight" disabled />
|
</view>
|
<view class="status-box">
|
<text>未打印条码数：</text>
|
<input v-model="bqty" class="highlight" disabled />
|
</view>
|
|
</view>
|
|
<view>
|
<view style="display: flex;
|
flex-direction: column;
|
flex-wrap: nowrap;
|
align-content: flex-start;">
|
<view class="form-row">
|
<view class="form-item">
|
<label>产品编码:</label>
|
<input class="inp" type="text" v-model="order.daa002" disabled="true" />
|
</view>
|
<view class="form-item">
|
<label>产品名称:</label>
|
<!-- <input class="inp" type="text" v-model="order.daa003" disabled="true" /> -->
|
<superwei-combox :candidates="DAA003List" v-model="order.daa003" @select="onDaa003Change"
|
class="inp"></superwei-combox>
|
</view>
|
<view class="form-item">
|
<label>产品规格:</label>
|
<input class="inp" type="text" v-model="order.daa004" disabled="true" />
|
</view>
|
</view>
|
<view class="form-row">
|
<view class="form-item">
|
<label>图 号:</label>
|
<input class="inp" type="text" v-model="order.engineeringNo" disabled="true" />
|
</view>
|
<view class="form-item">
|
<label>材 质:</label>
|
<input class="inp" type="text" v-model="order.material" disabled="true" />
|
</view>
|
<view class="form-item">
|
<label>颜 色:</label>
|
<input class="inp" type="text" v-model="order.colorName" disabled="true" />
|
</view>
|
</view>
|
</view>
|
</view>
|
|
<!-- 条码打印部分 - 中部元素在一条线上 -->
|
<view class="print-section">
|
<view class="barcode-info">
|
<view class="user-select" style="display: inline-block;float: left;margin-left: -11px;">
|
<text>打印条码张数：</text>
|
<input v-model="icount" class="inp1" />
|
</view>
|
|
<text>每张条码数量：</text>
|
<input class="inp" style="width: 15%;" v-model="barcodeAmount" placeholder="条码数量（装箱数）" />
|
|
<view class="user-select">
|
<button class="print-btn" @click="showPrint">打印条码</button>
|
|
</view>
|
|
</view>
|
</view>
|
|
<!-- 不良原因选择 -->
|
<view>
|
<view class="reason-section">
|
<text>点选不良备注（绑定到工单）：</text>
|
<view class="reason-buttons">
|
<button v-for="(reason, index) in badReasons" :key="index"
|
:class="{'reason-btn': true, 'selected': selectedReasons.includes(reason)}"
|
@click="toggleReason(reason)" v-text="reason"></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="barcode-info">
|
|
<view class="user-select">
|
<text>已打印条码数：</text>
|
<input v-model="sQuantity" class="highlight" disabled />
|
</view>
|
<view class="user-select">
|
<text>未打印条码数：</text>
|
<input v-model="bqty" class="highlight" disabled />
|
</view>
|
|
<view class="user-select">
|
<text>打印条码张数：</text>
|
<input v-model="icount" class="inp" disabled="true" />
|
</view>
|
|
<text>每张条码数量：</text>
|
<input class="inp" disabled="true" style="width: 15%;" v-model="barcodeAmount"
|
placeholder="条码数量（装箱数）" />
|
|
<view class="form-row">
|
<!-- <kk-printer defaultText="打印条码" class="print-btn" ref="kkprinter" :user="staffNo"-->
|
<!-- :bufferData="bufferData" @onPrint="onPrint" @onPrintSuccess="onPrintSuccess"-->
|
<!-- @onPrintFail="onPrintFail">-->
|
<!-- </kk-printer>-->
|
<button class="print-btn" @click="printTest">打印条码</button>
|
</view>
|
|
</view>
|
<view class="bottom-section1">
|
<button class="clean-btn" type="primary" @click="cleanUser">关闭</button>
|
<button class="clean-btn" type="warn" @click="deleteBarcode">取消打印</button>
|
</view>
|
<!-- <view class="reason-section">-->
|
<!-- <text>报工人：</text>-->
|
<!-- <view class="reason-buttons">-->
|
<!-- <button v-for="(reason, index) in users" :key="index"-->
|
<!-- :class="{'reason-btn': true, 'selected': user === reason}" @click="toggleUser(reason)"-->
|
<!-- v-text="reason"></button>-->
|
<!-- </view>-->
|
<!-- </view>-->
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import {
|
printTemplate3
|
} from "../utils/printTemplate";
|
|
export default {
|
data() {
|
return {
|
currentUser: '', // 默认当前用户
|
barcodeAmount: 1, // 输入的条码数量
|
users: [], // 用户列表
|
userForm: [],
|
staff: [],
|
user: {},
|
badReasons: [], // 不良原因
|
itemsNgname: [],
|
selectedReasons: [], // 存储选中的不良原因
|
productionCount: "", // 当前系统采集生产数
|
printedCount: 0, // 当前已打码报工数
|
defectiveCount: 0, // 不良数
|
order: {},
|
icount: 1,
|
bqty: 10,
|
sQuantity: 0,
|
qqty: 0,
|
ngStaid: 0,
|
bufferData: '',
|
dataToPrint: [],
|
isLoading: false, // 新的加载状态
|
but: false,
|
DAA003List: [],
|
lineList: [],
|
isShow: false, // 控制打印条码按钮的显示
|
staffNo: '',
|
printStr: '',
|
|
printMac: 'DC:0D:30:91:06:52',
|
bluetoothSocket: {}, // 蓝牙连接
|
device: '',
|
uuid: '',
|
printNum: 1
|
};
|
},
|
components: {},
|
mounted() {
|
// this.fetchData(false); // Initial fetch
|
// this.timer = setInterval(this.fetchData, 180000); // Call fetchData every 5 minutes
|
this.init();
|
console.log("打印测试页初始话蓝牙");
|
},
|
created() {
|
|
},
|
methods: {
|
|
printTest() {
|
|
try {
|
this.onPrint();
|
|
console.log("打印参数" + this.bufferData);
|
this.printNum = 1;
|
setTimeout(() => {
|
this.doPrint2();
|
|
console.log("调用打印");
|
}, 2000)
|
} catch (e) {
|
this.onPrintFail();
|
console.log(e);
|
}
|
|
},
|
|
doPrint2() {
|
var mac_address = uni.getStorageSync('printMac');
|
console.log("打印机地址" + mac_address);
|
console.log('打印开始')
|
var device = null,
|
BAdapter = null,
|
BluetoothAdapter = null,
|
uuid = null,
|
main = null,
|
bluetoothSocket = null;
|
|
if (!mac_address) {
|
this.$showMessage('请选择蓝牙打印机');
|
return false;
|
}
|
main = plus.android.runtimeMainActivity();
|
BluetoothAdapter = plus.android.importClass("android.bluetooth.BluetoothAdapter");
|
let UUID = plus.android.importClass("java.util.UUID");
|
uuid = UUID.fromString("00001101-0000-1000-8000-00805F9B34FB");
|
BAdapter = BluetoothAdapter.getDefaultAdapter();
|
device = BAdapter.getRemoteDevice(mac_address);
|
plus.android.importClass(device);
|
bluetoothSocket = device.createInsecureRfcommSocketToServiceRecord(uuid);
|
plus.android.importClass(bluetoothSocket);
|
if (!bluetoothSocket.isConnected()) {
|
console.log('检测到设备未连接，尝试连接....');
|
bluetoothSocket.connect();
|
}
|
|
console.log('设备已连接');
|
if (bluetoothSocket.isConnected()) {
|
var outputStream = bluetoothSocket.getOutputStream();
|
plus.android.importClass(outputStream);
|
var bytes = plus.android.invoke(this.bufferData, 'getBytes', 'gbk');
|
outputStream.write(bytes);
|
outputStream.flush();
|
device = null //这里关键
|
bluetoothSocket.close(); //必须关闭蓝牙连接否则意外断开的话打印错误
|
//this.$showMessage('OK');
|
console.log("打印机连接状态：111");
|
return true;
|
} else {
|
//this.$showMessage('NG');
|
console.log("打印机连接状态：222");
|
return false;
|
}
|
},
|
init() {
|
console.log("设置蓝牙");
|
try {
|
var main = plus.android.runtimeMainActivity();
|
var BluetoothAdapter = plus.android.importClass("android.bluetooth.BluetoothAdapter");
|
var UUID = plus.android.importClass("java.util.UUID");
|
|
this.uuid = UUID.fromString("00001101-0000-1000-8000-00805F9B34FB");
|
var BAdapter = BluetoothAdapter.getDefaultAdapter();
|
BAdapter.cancelDiscovery(); //停止扫描
|
|
let printMac1 = uni.getStorageSync('printMac');
|
this.printMac = printMac1;
|
console.log("打印机地址" + this.printMac);
|
|
var address_mac = this.printMac ? this.printMac : "DC:1D:30:91:06:52";
|
// var address_mac = "DC:1D:30:91:06:52";
|
console.log("status:"+address_mac);
|
this.device = BAdapter.getRemoteDevice(address_mac);
|
plus.android.importClass(this.device);
|
|
this.bluetoothSocket = this.device.createInsecureRfcommSocketToServiceRecord(this.uuid);
|
plus.android.importClass(this.bluetoothSocket);
|
//plus.ui.toast("蓝牙连接成功");
|
} catch (err) {
|
// //console.log(err);
|
//mui.alert(err)
|
console.log("蓝牙连接异常！");
|
}
|
},
|
|
onDaa003Change(event) {
|
|
let orde = this.lineList[this.DAA003List.indexOf(event)];
|
|
this.orderId = orde.id;
|
this.orderNo = orde.daa001;
|
|
//切换为新的id
|
uni.setStorageSync('machine', this.machineNo);
|
uni.setStorageSync('orderId', this.orderId);
|
uni.setStorageSync('orderNo', this.orderNo);
|
uni.setStorageSync('engineeringNo', this.order.engineeringNo);
|
|
this.fetchData(false);
|
},
|
fetchData(flag) {
|
let machine = uni.getStorageSync('machine');
|
let orderId = uni.getStorageSync('orderId');
|
let orderNo = uni.getStorageSync('orderNo');
|
|
if (orderId) {
|
this.orderId = orderId;
|
} else {
|
if (!this.orderId) {
|
this.orderId = uni.getStorageSync('id');
|
}
|
|
}
|
|
if (orderNo) {
|
this.orderNo = orderNo;
|
} else {
|
if (!this.orderNo) {
|
this.orderNo = uni.getStorageSync('daa001');
|
}
|
}
|
|
if (machine) {
|
this.machineNo = machine;
|
} else {
|
if (!this.machineNo) {
|
this.machineNo = uni.getStorageSync('machineNo');
|
}
|
}
|
|
if (!this.orderId && !this.orderNo) {
|
return;
|
}
|
|
this.getOrderById();
|
this.getMesItemsNgname();
|
|
this.getWomdaaPrintById();
|
this.findByOrderId();
|
|
let editDate = this.formatDate(new Date());
|
|
if (flag) {
|
this.$post({
|
url: "/Womdaa/GetWomdaasByMachine",
|
data: {
|
machineNo: this.machineNo,
|
editDate: editDate
|
}
|
}).then(res => {
|
this.lineList = res.data.tbBillList;
|
this.DAA003List = res.data.tbBillList.map(item => item.daa003);
|
})
|
}
|
},
|
formatDate(date) {
|
let year = date.getFullYear(); // 获取年份
|
let month = String(date.getMonth() + 1).padStart(2, '0'); // 获取月份并补零
|
let day = String(date.getDate()).padStart(2, '0'); // 获取日期并补零
|
return `${year}-${month}-${day}`; // 返回格式化后的字符串
|
},
|
// 切换选中的不良原因
|
toggleReason(reason) {
|
if (this.selectedReasons.includes(reason)) {
|
this.selectedReasons = this.selectedReasons.filter(r => r !== reason);
|
} else {
|
this.selectedReasons.push(reason);
|
}
|
},
|
toggleUser(user) {
|
this.user = this.user === user ? null : user;
|
this.staffNo = user;
|
},
|
showPrint() {
|
this.isShow = true;
|
|
// this.printBarcode();
|
|
this.user = "";
|
},
|
// 打印条码报工
|
printBarcode() {
|
if (!this.barcodeAmount) {
|
this.isShow = false;
|
this.$showMessage('请输入条码数量');
|
return;
|
}
|
|
if (this.bqty == 0) {
|
this.isShow = false;
|
this.$showMessage('可打印数量为0');
|
return;
|
}
|
|
if (this.bqty < this.barcodeAmount) {
|
this.isShow = false;
|
this.$showMessage('打印数量不能大于可打印数量');
|
return;
|
}
|
|
if (this.icount * this.barcodeAmount > this.bqty) {
|
this.isShow = false;
|
this.$showMessage('打印总数超过可打印总数');
|
return;
|
}
|
|
this.$post({
|
url: "/MesInvItemBarcodes/AddItemToBarcodes",
|
data: {
|
printQty: this.barcodeAmount,
|
orderNo: this.orderNo,
|
orderId: this.orderId,
|
// user: this.user,
|
count: this.icount
|
}
|
}).then(res => {
|
this.dataToPrint = res.data.tbBillList;
|
|
this.getXS0101();
|
});
|
},
|
onPrint() {
|
let printCmd = "! 0 400 420 480 1\r\n" +
|
"PREFEED 0\n\r" +
|
"POSTFEED 0\n\r" +
|
"PAGE - WIDTH 640\r\n" +
|
"GAP-SENSE\r\n" +
|
"BOX 5 10 620 450 2\r\n" +
|
"LINE 5 60 620 60 1\r\n" + // 横线1
|
"LINE 5 110 620 110 1\r\n" + // 横线2
|
"LINE 5 160 620 160 1\r\n" + // 横线3
|
"LINE 5 210 620 210 1\r\n" + // 横线4
|
"LINE 5 260 620 260 1\r\n" + // 横线5
|
"LINE 5 310 620 310 1\r\n" + // 新增的横线
|
"LINE 120 10 120 310 1\r\n" + // 字段名称右侧竖线延伸
|
"LINE 240 310 240 450 1\r\n" + // 规格型号左侧竖线
|
"LINE 285 210 285 450 1\r\n" + // 规格型号右侧竖线
|
"LINE 410 210 410 310 1\r\n" + // 到货日期右侧竖线延伸
|
"TEXT 24 0 15 25 条码编号 " + "\r\n" +
|
"TEXT 24 0 15 75 产品料号 " + "\r\n" +
|
"TEXT 24 0 15 125 产品名称 " + "\r\n" +
|
"TEXT 24 0 15 175 工单号 " + "\r\n" +
|
"TEXT 24 0 15 225 生产部门 " + "\r\n" +
|
"TEXT 24 0 300 225 日期 " + "\r\n" +
|
"TEXT 24 0 15 275 条码数量 " + "\r\n" + // New field 1
|
"TEXT 24 0 300 275 报工人 " + "\r\n" + // New field 2
|
"TEXT 24 0 290 339 " + "\r\n" + // Shifted content
|
"TEXT 24 0 290 367 " + "\r\n" + // Shifted content
|
"TEXT 24 0 290 395 " + "\r\n" + // Shifted content
|
"TEXT 24 0 290 423 " + "\r\n" + // Shifted content
|
"TEXT 24 0 250 330 规\r\n" + // Shifted
|
"TEXT 24 0 250 363 格\r\n" + // Shifted
|
"TEXT 24 0 250 396 型\r\n" + // Shifted
|
"TEXT 24 0 250 429 号\r\n" + // Shifted
|
"B QR 35 325 M 2 U 5\r\n" + // 下方二维码 shifted to make room for new row
|
"MA,111" + "\r\n" +
|
"ENDQR\r\n" +
|
"FORM\r\n" +
|
"PRINT\r\n";
|
this.bufferData = printCmd;
|
},
|
|
onPrintSuccess() {
|
// this.getOrderById();
|
// this.getWomdaaPrintById();
|
// this.findByOrderId();
|
this.bufferData = '';
|
this.dataToPrint = [];
|
// this.updateBarcodeAmount();
|
},
|
onPrintFail() {
|
console.log("重连失败");
|
},
|
|
updateBarcodeAmount() {
|
if (this.dataToPrint.length == 0) {
|
return;
|
}
|
|
let barcodes = this.dataToPrint.map(s => s.out12);
|
|
this.$post({
|
url: "/MesInvItemBarcodes/UpdateBarcodeAmount",
|
data: {
|
barcodes: barcodes,
|
user: this.staffNo
|
}
|
}).then(res => {
|
console.log("更新条码数量成功");
|
})
|
},
|
|
deleteBarcode() {
|
|
this.isShow = false;
|
|
if (this.dataToPrint.length == 0) {
|
return;
|
}
|
|
let barcodes = this.dataToPrint.map(s => s.out12);
|
this.$post({
|
url: "/MesInvItemBarcodes/DeleteBarcode",
|
data: {
|
barcodes: barcodes,
|
}
|
}).then(res => {
|
console.log("删除条码成功");
|
})
|
},
|
cleanUser() {
|
this.isShow = false;
|
},
|
// 保存操作
|
save() {
|
console.log('保存成功');
|
let ids = [];
|
|
this.selectedReasons.forEach(s => {
|
let id = this.itemsNgname[this.badReasons.indexOf(s)].id;
|
ids.push(id);
|
});
|
|
if (ids.length <= 0) {
|
return
|
}
|
|
let ngids = ids.join(",");
|
|
//MesOrderSta
|
this.$post({
|
url: "/MesOrderSta/UpdateNg",
|
data: {
|
ngId: ngids,
|
staId: this.ngStaid
|
}
|
}).then(res => {
|
if (res.data.tbBillList) {
|
uni.showToast({
|
title: '保存成功',
|
icon: 'success',
|
});
|
this.getOrderById();
|
this.getWomdaaPrintById();
|
this.findByOrderId();
|
}
|
});
|
|
},
|
// 取消操作
|
cancel() {
|
console.log('取消操作');
|
uni.showToast({
|
title: '取消操作',
|
icon: 'none',
|
});
|
},
|
getOrderById() {
|
this.$post({
|
url: "/Womdaa/GetWomdaaById",
|
data: {
|
orderId: this.orderId,
|
orderNo: this.orderNo
|
}
|
}).then(res => {
|
this.order = res.data.tbBillList;
|
this.printedCount = res.data.tbBillList.bgqty;
|
this.defectiveCount = res.data.tbBillList.blQty;
|
this.productionCount = this.order.todayOutput;
|
|
if (!this.order.todayOutput) {
|
this.productionCount = 0;
|
}
|
|
if (!this.printedCount) {
|
this.printedCount = 0;
|
}
|
})
|
},
|
getMesItemsNgname() {
|
this.$post({
|
url: "/MesItemsNgname/GetMesItemsNgname",
|
}).then(res => {
|
this.itemsNgname = res.data.tbBillList;
|
this.badReasons = this.itemsNgname.map(s => s.ngName);
|
});
|
},
|
getXS0101() {
|
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
|
}
|
}).then(res => {
|
this.bqty = res.data.tbBillList.bqty;
|
// this.icount = res.data.tbBillList.icount;
|
this.icount = 1;
|
this.sQuantity = res.data.tbBillList.sQuantity;
|
this.barcodeAmount = res.data.tbBillList.qqty;
|
})
|
},
|
findByOrderId() {
|
this.$post({
|
url: "/MesOrderSta/FindByOrderNo",
|
data: {
|
orderId: this.orderId,
|
orderNo: this.orderNo
|
}
|
}).then(res => {
|
|
// 从接口获取的已选择原因
|
let str = res.data.tbBillList.ngId;
|
|
this.ngStaid = res.data.tbBillList.id;
|
|
if (!str) {
|
return;
|
}
|
|
let ids = str.split(",");
|
|
// 使用 map 和 filter 提取对应的 ngName
|
let preSelectedReasons = ids.map(id => {
|
// 查找对应的对象
|
let matchedItem = this.itemsNgname.find(item => item.id == id);
|
return matchedItem ? matchedItem.ngName : null; // 如果找到，返回 ngName；否则返回 null
|
}).filter(ngName => ngName !== null); // 过滤掉 null 值
|
|
// 设置已选中的不良原因
|
this.selectedReasons = this.badReasons.filter(reason => preSelectedReasons.includes(reason));
|
});
|
}
|
}
|
};
|
</script>
|
|
<style scoped>
|
/* 页面样式 */
|
.page {
|
padding: 2vh;
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
box-sizing: border-box;
|
}
|
|
|
.form-row {
|
display: flex;
|
justify-content: space-between;
|
margin-bottom: 3vh;
|
flex-wrap: nowrap;
|
}
|
|
.form-item {
|
width: 30%;
|
|
}
|
|
.status-section {
|
display: flex;
|
justify-content: space-around;
|
margin-bottom: 3vh;
|
}
|
|
.status-box {
|
display: flex;
|
align-items: center;
|
}
|
|
input.highlight {
|
width: 10vw;
|
font-weight: 700;
|
border: none;
|
background-color: #FFD700;
|
text-align: center;
|
font-size: 1.5vw;
|
}
|
|
.print-section {
|
padding: 2vh;
|
border-radius: 1vw;
|
margin-bottom: 2vh;
|
display: flex;
|
flex-wrap: nowrap;
|
justify-content: flex-start;
|
align-items: center;
|
}
|
|
.barcode-info {
|
display: flex;
|
align-items: center;
|
gap: 1vw;
|
}
|
|
.inp {
|
width: 65%;
|
padding: 1vh;
|
margin-top: -13px;
|
font-size: 1.3vw;
|
border: 1px solid #808080;
|
border-radius: 0.5vw;
|
box-sizing: border-box;
|
}
|
|
.barcode-info text {
|
font-size: 1.5vw;
|
}
|
|
input {
|
padding: 1vh;
|
font-size: 1.5vw;
|
width: 10vw;
|
border-radius: 0.5vw;
|
height: 2.4em;
|
}
|
|
.print-btn {
|
padding: 1.5vh;
|
background-color: #00A2E9;
|
color: white;
|
font-size: 1.5vw;
|
border: none;
|
cursor: pointer;
|
border-radius: 0.5vw;
|
}
|
|
/* 不良原因选择 */
|
.reason-section {
|
margin-bottom: 3vh;
|
}
|
|
.reason-buttons {
|
display: grid;
|
grid-template-columns: repeat(5, 1fr);
|
gap: 1vw;
|
}
|
|
.reason-btn {
|
padding: 1vh;
|
background-color: #808080;
|
color: white;
|
font-size: 1.5vw;
|
border: none;
|
border-radius: 0.5vw;
|
cursor: pointer;
|
}
|
|
.reason-btn.selected {
|
background-color: #FFD700;
|
color: black;
|
}
|
|
/* 底部保存和取消按钮 */
|
.bottom-section {
|
display: flex;
|
justify-content: space-between;
|
margin-top: 2vh;
|
}
|
|
.bottom-section1 {
|
display: flex;
|
justify-content: space-around;
|
margin-bottom: 2vh;
|
padding: 2vh 1vw;
|
}
|
|
.save-btn,
|
.cancel-btn {
|
width: 48%;
|
padding: 1.5vh;
|
background-color: #00A2E9;
|
color: white;
|
font-size: 1.5vw;
|
border: none;
|
text-align: center;
|
cursor: pointer;
|
border-radius: 0.5vw;
|
}
|
|
.clean-btn {
|
width: 48%;
|
padding: 1.5vh;
|
color: white;
|
font-size: 1.5vw;
|
border: none;
|
text-align: center;
|
cursor: pointer;
|
border-radius: 0.5vw;
|
}
|
|
.user-select {
|
margin-right: 2vw;
|
font-size: 1.5vw;
|
}
|
|
.form-item label {
|
float: left;
|
margin-top: -5px;
|
font-size: 1.5vw;
|
/* Larger font for labels */
|
display: inline-block;
|
margin-bottom: 0.5vh;
|
color: #333;
|
}
|
|
.overlay {
|
position: fixed;
|
top: 0;
|
left: 0;
|
width: 100%;
|
height: 100%;
|
background-color: rgba(0, 0, 0, 0.5);
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
}
|
|
.popup {
|
background-color: #fff;
|
padding: 2vh;
|
border: 1px solid #ccc;
|
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
width: 70vw;
|
height: 70vh;
|
font-size: 1.6vw;
|
/* 设置弹框的最大高度 */
|
max-height: 80vh;
|
/* 启用纵向滚动条 */
|
overflow-y: auto;
|
/* 设置弹框的外观 */
|
border-radius: 8px;
|
/* Increased font size within popups */
|
}
|
input.inp1 {
|
width: 18%;
|
height: 70px;
|
border: 3px solid rgb(128, 128, 128);
|
font-size: 40px;
|
text-align: center;
|
margin-top: 0px;
|
}
|
|
|
</style>
|
