From 2b0e70bb88ced210dbc693a4d2ded2d658b1da02 Mon Sep 17 00:00:00 2001 From: 啊鑫 <t2856754968@163.com> Date: 星期一, 21 七月 2025 15:30:03 +0800 Subject: [PATCH] 111 --- pages/QC/OQC/Add.vue | 576 ++++---- pages/QC/OQC/ImageItem.vue | 27 pages/QC/OQC/ScanCode.vue | 1605 ++++++++++++---------- pages/QC/OQC/detail.vue | 1623 ++++++++++++---------- pages/QC/Laboratory/ImageItem.vue | 238 +++ pages/QC/Laboratory/Laboratory.vue | 117 + 6 files changed, 2,384 insertions(+), 1,802 deletions(-) diff --git a/pages/QC/Laboratory/ImageItem.vue b/pages/QC/Laboratory/ImageItem.vue new file mode 100644 index 0000000..d31fef9 --- /dev/null +++ b/pages/QC/Laboratory/ImageItem.vue @@ -0,0 +1,238 @@ +<template> + <!-- #ifdef APP --> + <scroll-view class="page-scroll-view"> + <!-- #endif --> + <view> + <view class="uni-common-mt"> + <view class="uni-list list-pd" style="padding: 15px;"> + <view class="uni-flex" style="margin-bottom: 10px;"> + <view class="uni-list-cell-left">鐐瑰嚮鍙瑙堥�夊ソ鐨勫浘鐗�</view> + <view style="margin-left: auto;"> + <view class="click-t">鍏辨湁{{ qsImage.length }}寮犲浘鐗�</view> + </view> + </view> + <view class="uni-flex" style="flex-wrap: wrap;"> + <view v-for="(image,index) in qsImage" :key="index" class="uni-uploader__input-box" + style="position: relative; border: 0;"> + <image :data-src="image.img" :src="image.img" + @tap="previewImage(index)"></image> + <image class="image-remove" src="/static/plus.png" @click="removeImage(index,image.id)"></image> + </view> + <image class="uni-uploader__input-box" src="/static/plus.png" @tap="chooseImage"></image> + </view> + </view> + </view> + <view class="plus-button"> + <button class="upImg" type="primary" @click="save">涓婁紶鍥剧墖</button> + </view> + </view> + <!-- #ifdef APP --> + </scroll-view> + <!-- #endif --> +</template> + +<script> + +import {pathToBase64} from '../../../js_sdk/mmmm-image-tools/index' + +var sourceTypeArray = [ + ['camera'], + ['album'], + ['camera', 'album'] +] +var sizeTypeArray = [ + ['compressed'], + ['original'], + ['compressed', 'original'] +] +export default { + data() { + return { + title: 'choose/previewImage', + sourceTypeIndex: 2, + sourceType: ['鎷嶇収', '鐩稿唽', '鎷嶇収鎴栫浉鍐�'], + sizeTypeIndex: 2, + sizeType: ['鍘嬬缉', '鍘熷浘', '鍘嬬缉鎴栧師鍥�'], + countIndex: 8, + count: [1, 2, 3, 4, 5, 6, 7, 8, 9], + isCrop: false, + cropPercent: 80, + cropWidth: 100, + cropHeight: 100, + cropResize: false, + qsImage: [], + fid: 0, + qsType: 5, + orderNo: "", + } + }, + onLoad(options) { + //options涓寘鍚簡url闄勫甫鐨勫弬鏁� + + let params = options; + + if (params["id"]) { + this.fid = params["id"]; + this.orderNo = params["orderNo"]; + //getQaItemXj02 + this.init(); + } + }, + onUnload() { + this.qsImage = []; + this.sourceTypeIndex = 2 + this.sourceType = ['鎷嶇収', '鐩稿唽', '鎷嶇収鎴栫浉鍐�'] + this.sizeTypeIndex = 2 + this.sizeType = ['鍘嬬缉', '鍘熷浘', '鍘嬬缉鎴栧師鍥�'] + this.countIndex = 8 + }, + methods: { + removeImage(index, id) { + this.qsImage.splice(index, 1); + if (id) { + this.$post({ + url: "/Base/removeImage", + data: { + id: id + } + }).then(res => { + }); + } + }, + chooseImage() { + if (this.qsImage.length >= 9) { + uni.showToast({ + position: "bottom", + title: "宸茬粡鏈�9寮犲浘鐗囦簡锛岃鍒犻櫎閮ㄥ垎鍥剧墖涔嬪悗閲嶆柊閫夋嫨" + }); + return; + } + + uni.chooseImage({ + sourceType: sourceTypeArray[this.sourceTypeIndex], + sizeType: sizeTypeArray[this.sizeTypeIndex], + crop: this.isCrop ? { + "quality": this.cropPercent, + "width": this.cropWidth, + "height": this.cropHeight, + "resize": this.cropResize + } : null, + count: this.qsImage.length + this.count[this.countIndex] > 9 ? 9 - this.qsImage.length : this.count[this.countIndex], + success: (res) => { + let url = res.tempFilePaths[0]; + pathToBase64(url) + .then(base64 => { + // 鎵惧埌鏈�鍚庝竴涓枩鏉犵殑浣嶇疆 + let lastSlashIndex = url.lastIndexOf("/"); + // 鎻愬彇鏂囦欢鍚� + let fileName = url.substring(lastSlashIndex + 1); + let entity = {}; + entity.img = base64; + entity.Picturename = fileName; + entity.fid = this.fid; + entity.qsType = this.qsType; + entity.orderNo = this.orderNo; + entity.base64Date = base64.split(',')[1]; + + this.qsImage.push(entity); + }) + .catch(error => { + console.error(error) + }) + }, + fail: (err) => { + console.log("err: ", JSON.stringify(err)); + } + }); + }, + previewImage(index) { + // uni.previewImage({ + // current: index, // 璁剧疆褰撳墠鏄剧ず鍥剧墖鐨勯摼鎺� + // urls: this.qsImage.map(s=>s.img), // 闇�瑕侀瑙堢殑鍥剧墖閾炬帴鍒楄〃 + // loop: false, // 鏄惁寮�鍚浘鐗囪疆鎾紝榛樿涓� false + // indicator: 'default',// 鍥剧墖鎸囩ず鍣ㄧ被鍨嬶紝鍙�夊�间负 "default"銆�"number"銆�"pointer"锛岄粯璁や负 "default" + // }); + }, + init() { + this.$post({ + url: "/Base/getByFid", + data: { + id: this.fid, + qsType: this.qsType + } + }).then(res => { + let tableData = res.data.tbBillList; + this.qsImage = tableData; + this.qsImage.forEach(s => { + s.img = 'data:image/png;base64,' + s.base64Date; + }); + }); + }, + save() { + this.$post({ + url: "/Base/saveImage", + data: { + entity: this.qsImage + } + }).then(res => { + this.init(); + this.$showMessage("淇濆瓨鎴愬姛"); + }); + } + } +} +</script> + +<style> +.click-t { + color: darkgray; +} + +.list-pd { + margin-top: 25px; +} + +.uni-uploader__input-box { + margin: 5px; + border: 1px solid #D9D9D9; +} + +.image-remove { + transform: rotate(45deg); + width: 25px; + height: 25px; + position: absolute; + top: 0; + right: 0; + border-radius: 13px; + background-color: #FF0000; +} + +.uni-common-mt { + background-color: #ffffff; + /* 绾㈣壊鑳屾櫙 */ +} + +.plus-button { + position: fixed; + left: 0; + bottom: 0; + width: 100%; + background-color: #ffffff; /* 鑳屾櫙棰滆壊 */ + /* padding: 10px; */ + box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.1); /* 娣诲姞搴曢儴闃村奖鏁堟灉 */ + z-index: 999; /* 纭繚鎸夐挳浣嶄簬椤跺眰 */ +} + +.uni-flex { + max-height: calc(100vh - 240px); /* 灞忓箷楂樺害鍑忓幓涓婁紶鎸夐挳楂樺害 */ + overflow-y: auto; /* 褰撳唴瀹硅秴鍑洪珮搴︽椂鍑虹幇鍨傜洿婊氬姩鏉� */ +} + +.upImg { + + background-color: #3498db; + color: white; + +} +</style> \ No newline at end of file diff --git a/pages/QC/Laboratory/Laboratory.vue b/pages/QC/Laboratory/Laboratory.vue index aa6c976..67f2a34 100644 --- a/pages/QC/Laboratory/Laboratory.vue +++ b/pages/QC/Laboratory/Laboratory.vue @@ -4,12 +4,12 @@ <view class="page-header"> <view class="header-title">瀹為獙瀹ゆ娴嬭鎯�</view> </view> - + <!-- 鍔犺浇鐘舵�� --> <view v-if="loading" class="loading-container"> - <uni-load-more status="loading" /> + <uni-load-more status="loading"/> </view> - + <!-- 鏁版嵁灞曠ず --> <view v-else-if="data" class="content"> <view class="card"> @@ -21,7 +21,7 @@ </view> </view> </view> - + <view class="card-body"> <view class="info-group"> <view class="info-row"> @@ -34,7 +34,7 @@ <text class="info-value">{{ data.createUser }}</text> </view> </view> - + <view class="info-row"> <view class="info-item"> <label class="info-label">鐢熶骇绾跨紪鐮�:</label> @@ -45,21 +45,21 @@ <text class="info-value">{{ data.itemNo }}</text> </view> </view> - + <view class="info-row full-width"> <view class="info-item"> <label class="info-label">鐗╂枡鍚嶇О:</label> <text class="info-value">{{ data.itemName }}</text> </view> </view> - + <view class="info-row full-width"> <view class="info-item"> <label class="info-label">鐗╂枡瑙勬牸:</label> <text class="info-value">{{ data.itemModel }}</text> </view> </view> - + <view class="info-row"> <view class="info-item"> <label class="info-label">鐢熶骇杞﹂棿缂栫爜:</label> @@ -70,14 +70,14 @@ <text class="info-value">{{ data.departmentId }}</text> </view> </view> - + <view class="info-row full-width"> <view class="info-item"> <label class="info-label">閿�鍞鍗曞彿:</label> <text class="info-value">{{ data.saleOrderNoc }}</text> </view> </view> - + <view class="info-row"> <view class="info-item"> <label class="info-label">妫�楠屾椂闂�:</label> @@ -88,36 +88,43 @@ <text class="info-value">{{ data.inspectionUser }}</text> </view> </view> - + <view class="info-row"> <view class="info-item status-item"> <label class="info-label">妫�楠岀粨鏋�:</label> <view class="result-container"> <!-- 鏄剧ず褰撳墠妫�楠岀粨鏋� --> - <text v-if="data.inspectionResult" class="status-badge" :class="data.inspectionResult === '鍚堟牸' ? 'success' : 'danger'"> + <text v-if="data.inspectionResult" :class="data.inspectionResult === '鍚堟牸' ? 'success' : 'danger'" + class="status-badge"> {{ data.inspectionResult }} </text> <text v-else class="status-badge pending"> 寰呮楠� </text> - + <!-- 褰曞叆/閲嶆柊褰曞叆鎸夐挳 --> <button v-if="!showResultInput" class="input-btn" @click="showResultInput = true"> {{ data.inspectionResult ? '閲嶆柊褰曞叆' : '褰曞叆缁撴灉' }} </button> - + <!-- 妫�楠岀粨鏋滈�夋嫨鎸夐挳 --> <view v-if="showResultInput" class="result-input-container"> - <button class="result-btn qualified" @click="updateInspectionResult('鍚堟牸')" :disabled="updating"> + <button :disabled="updating" class="result-btn qualified" @click="updateInspectionResult('鍚堟牸')"> 鍚堟牸 </button> - <button class="result-btn unqualified" @click="updateInspectionResult('涓嶅悎鏍�')" :disabled="updating"> + <button :disabled="updating" class="result-btn unqualified" + @click="updateInspectionResult('涓嶅悎鏍�')"> 涓嶅悎鏍� </button> - <button class="result-btn cancel" @click="showResultInput = false" :disabled="updating"> + <button :disabled="updating" class="result-btn cancel" @click="showResultInput = false"> 鍙栨秷 </button> </view> + + <!-- 鍥剧墖涓婁紶鎸夐挳 --> + <button class="upload-btn" @click="uploadImage"> + 馃摲 涓婁紶鍥剧墖 + </button> </view> </view> </view> @@ -125,7 +132,7 @@ </view> </view> </view> - + <!-- 绌虹姸鎬� --> <view v-else class="empty-state"> <view class="empty-icon">馃搵</view> @@ -145,24 +152,24 @@ updating: false } }, - + onLoad(options) { this.itemId = options.id; if (this.itemId) { this.loadData(); } }, - + methods: { loadData() { this.loading = true; - + const requestData = { pageIndex: 1, limit: 1, id: this.itemId }; - + this.$post({ url: "/MesLaboratory/GetPage", data: requestData @@ -180,16 +187,16 @@ this.loading = false; }); }, - + updateInspectionResult(result) { this.updating = true; - + const requestData = { id: this.itemId, inspectionResult: result, inspectionBy: this.$loginInfo.account }; - + this.$post({ url: "/MesLaboratory/UpdateInspectionResult", data: requestData @@ -207,6 +214,16 @@ this.$showMessage('褰曞叆澶辫触锛岃閲嶈瘯'); }).finally(() => { this.updating = false; + }); + }, + + uploadImage() { + // 澶勭悊billNo锛屽幓鎺�"-"鍚庨潰鐨勯儴鍒� + const orderNo = this.data.billNo.split('-')[0]; + + // 璺宠浆鍒板浘鐗囦笂浼犻〉闈� + uni.navigateTo({ + url: `ImageItem?id=${this.itemId}&orderNo=${orderNo}` }); } } @@ -273,7 +290,7 @@ .info-row { display: flex; gap: 20px; - + &.full-width { flex-direction: column; } @@ -284,7 +301,7 @@ align-items: center; flex: 1; min-width: 0; - + &.status-item { align-items: center; gap: 10px; @@ -312,19 +329,19 @@ font-size: 14px; border-radius: 20px; font-weight: 500; - + &.success { background-color: #e6f7ed; color: #36b37e; border: 1px solid #d1fae5; } - + &.danger { background-color: #ffefef; color: #ff4d4f; border: 1px solid #fee2e2; } - + &.pending { background-color: #f5f5f5; color: #999; @@ -348,12 +365,12 @@ color: #409EFF; cursor: pointer; transition: all 0.2s; - + &:hover { background-color: #409EFF; color: #fff; } - + &:active { transform: scale(0.95); } @@ -372,50 +389,70 @@ border: 1px solid; cursor: pointer; transition: all 0.2s; - + &:disabled { opacity: 0.6; cursor: not-allowed; } - + &.qualified { background-color: #e6f7ed; color: #36b37e; border-color: #36b37e; - + &:hover:not(:disabled) { background-color: #36b37e; color: #fff; } } - + &.unqualified { background-color: #ffefef; color: #ff4d4f; border-color: #ff4d4f; - + &:hover:not(:disabled) { background-color: #ff4d4f; color: #fff; } } - + &.cancel { background-color: #f5f5f5; color: #666; border-color: #ccc; - + &:hover:not(:disabled) { background-color: #ccc; color: #fff; } } - + &:active:not(:disabled) { transform: scale(0.95); } } +.upload-btn { + padding: 8px 16px; + font-size: 14px; + border-radius: 6px; + border: 1px solid #67C23A; + background-color: #fff; + color: #67C23A; + cursor: pointer; + transition: all 0.2s; + + &:hover { + background-color: #67C23A; + color: #fff; + } + + &:active { + transform: scale(0.95); + } +} + .empty-state { display: flex; flex-direction: column; diff --git a/pages/QC/OQC/Add.vue b/pages/QC/OQC/Add.vue index 08bdf0b..9ce65df 100644 --- a/pages/QC/OQC/Add.vue +++ b/pages/QC/OQC/Add.vue @@ -1,284 +1,287 @@ <template> - <view class="page-container"> - <!-- 琛ㄥ崟瀹瑰櫒 --> - <view class="form-card"> - <form :modelValue="formData"> - <view class="form-group"> - <label class="form-label">妫�楠屽崟鍙�:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.releaseNo" /> - </view> - <view class="form-group"> - <label class="form-label">鐗╂枡缂栫爜:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.itemNo" /> - </view> - <view class="form-group"> - <label class="form-label">鐗╂枡鍚嶇О:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.itemName" /> - </view> - <view class="form-group"> - <label class="form-label">鐗╂枡瑙勬牸:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.itemModel" /> - </view> - <view class="form-group"> - <label class="form-label">璁㈠崟缂栧彿:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.saleOrderNo" /> - </view> - <view class="form-group"> - <label class="form-label">閫佹鏁伴噺:</label> - <input class="form-input" disabled="true" type="number" v-model="formData.planQty" /> - </view> - <view class="form-group"> - <label class="form-label">鍒涘缓鏃堕棿:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.createDate" /> - </view> - <view class="form-group"> - <label class="form-label">鍒涘缓浜�:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.createUser" /> - </view> - <view class="form-group"> - <label class="form-label">涓嶈壇鎻忚堪:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.remeke" /> - </view> - </form> - </view> + <view class="page-container"> + <!-- 琛ㄥ崟瀹瑰櫒 --> + <view class="form-card"> + <form :modelValue="formData"> + <view class="form-group"> + <label class="form-label">妫�楠屽崟鍙�:</label> + <input v-model="formData.releaseNo" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">鐗╂枡缂栫爜:</label> + <input v-model="formData.itemNo" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">鐗╂枡鍚嶇О:</label> + <input v-model="formData.itemName" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">鐗╂枡瑙勬牸:</label> + <input v-model="formData.itemModel" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">璁㈠崟缂栧彿:</label> + <input v-model="formData.saleOrderNo" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">閫佹鏁伴噺:</label> + <input v-model="formData.planQty" class="form-input" disabled="true" type="number"/> + </view> + <view class="form-group"> + <label class="form-label">鍒涘缓鏃堕棿:</label> + <input v-model="formData.createDate" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">鍒涘缓浜�:</label> + <input v-model="formData.createUser" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">涓嶈壇鎻忚堪:</label> + <input v-model="formData.remeke" class="form-input" disabled="true" type="text"/> + </view> + </form> + </view> - <!-- 妫�楠岄」鐩崱鐗� --> - <view class="inspection-card"> - <view class="card-header"> - <view class="header-icon">馃攳</view> - <text class="header-title">妫�楠岄」鐩�</text> - <view class="header-badge">{{ tableData.length }}</view> - </view> - - <view class="inspection-list" v-if="tableData.length > 0"> - <view v-for="(item, index) in tableData" :key="index" class="inspection-item" - :class="{ 'item-completed': item.fcheckResu === '鍚堟牸', 'item-failed': item.fcheckResu === '涓嶅悎鏍�' }"> - - <!-- 宸︿晶鐘舵�佹寚绀哄櫒 --> - <view class="status-indicator" - :class="{ 'status-pass': item.fcheckResu === '鍚堟牸', 'status-fail': item.fcheckResu === '涓嶅悎鏍�', 'status-pending': item.fcheckResu === '鏈楠�' }"> - </view> - - <!-- 涓昏鍐呭鍖哄煙 --> - <view class="item-content"> - <view class="item-header"> - <view class="item-title">{{ item.fcheckItem }}</view> - <view class="status-badge" - :class="{ 'badge-pass': item.fcheckResu === '鍚堟牸', 'badge-fail': item.fcheckResu === '涓嶅悎鏍�', 'badge-pending': item.fcheckResu === '鏈楠�' }"> - <text class="status-icon">{{ item.fcheckResu === '鍚堟牸' ? '鉁�' : item.fcheckResu === '涓嶅悎鏍�' ? '鉁�' : '鈼�' }}</text> - <text class="status-text">{{ item.fcheckResu }}</text> - </view> - </view> - - <view class="item-description" v-if="item.fcheckItemDesc"> - <text class="description-text">{{ item.fcheckItemDesc }}</text> - </view> - - <view class="item-footer"> - <view class="progress-info"> - <text class="progress-label">妫�楠岃繘搴�:</text> - <view class="progress-bar"> - <view class="progress-fill" - :style="{ width: (item.fenterQty / item.checkQyt * 100) + '%' }" - :class="{ 'progress-complete': item.fenterQty >= item.checkQyt, 'progress-incomplete': item.fenterQty < item.checkQyt }"> - </view> - </view> - <text class="progress-text">{{ item.fenterQty }}/{{ item.checkQyt }}</text> - </view> - - <view class="action-button" @click="toDetail(item)" - :class="{ 'btn-complete': item.fenterQty >= item.checkQyt, 'btn-incomplete': item.fenterQty < item.checkQyt }"> - <text class="btn-text">{{ item.fenterQty >= item.checkQyt ? '鏌ョ湅璇︽儏' : '寮�濮嬫楠�' }}</text> - <text class="btn-icon">鈫�</text> - </view> - </view> - </view> - </view> - </view> - - <!-- 绌虹姸鎬� --> - <view v-else class="empty-state"> - <view class="empty-icon">馃搵</view> - <text class="empty-text">鏆傛棤妫�楠岄」鐩�</text> - <text class="empty-desc">璇峰厛鐢熸垚妫�楠岄」鐩�</text> - </view> - </view> + <!-- 妫�楠岄」鐩崱鐗� --> + <view class="inspection-card"> + <view class="card-header"> + <view class="header-icon">馃攳</view> + <text class="header-title">妫�楠岄」鐩�</text> + <view class="header-badge">{{ tableData.length }}</view> + </view> - <!-- 鎿嶄綔鎸夐挳鍖哄煙 --> - <view class="action-buttons"> - <button class="btn btn-primary" @click="submitInspection">鎻愪氦</button> - <button class="secondary-btn" @click="uploadImages">涓婁紶/鏌ョ湅鍥剧墖</button> - <button class="btn btn-secondary" @click="addDefectDescription">娣诲姞涓嶅悎鏍兼弿杩�</button> - </view> - - - <!-- 涓嶅悎鏍兼弿杩板脊鍑哄眰 --> - <view v-if="remarksPopup" class="overlay active"> - <view class="popup" :class="{ 'popup-scale': isPopupAnimated }" @animationend="isPopupAnimated = false"> - <view class="popup-header"> - <h3 class="popup-title">淇敼涓嶅悎鏍兼弿杩�</h3> - <view class="close-btn" @click="remarksPopup = !remarksPopup">脳</view> - </view> - <form> - <view class="form-group"> - <label class="form-label">涓嶅悎鏍兼弿杩�:</label> - <input class="form-input" type="text" v-model="remarks" /> - </view> - <view class="button-group popup-buttons"> - <button :class="['action-btn', 'btn-danger']" @click="editRemarks"> - 淇敼 - </button> - <button :class="['action-btn', 'btn-light']" @click="remarksPopup = !remarksPopup"> - 鍙栨秷 - </button> - </view> - </form> - </view> - </view> - </view> + <view v-if="tableData.length > 0" class="inspection-list"> + <view v-for="(item, index) in tableData" :key="index" :class="{ 'item-completed': item.fcheckResu === '鍚堟牸', 'item-failed': item.fcheckResu === '涓嶅悎鏍�' }" + class="inspection-item"> + + <!-- 宸︿晶鐘舵�佹寚绀哄櫒 --> + <view :class="{ 'status-pass': item.fcheckResu === '鍚堟牸', 'status-fail': item.fcheckResu === '涓嶅悎鏍�', 'status-pending': item.fcheckResu === '鏈楠�' }" + class="status-indicator"> + </view> + + <!-- 涓昏鍐呭鍖哄煙 --> + <view class="item-content"> + <view class="item-header"> + <view class="item-title">{{ item.fcheckItem }}</view> + <view :class="{ 'badge-pass': item.fcheckResu === '鍚堟牸', 'badge-fail': item.fcheckResu === '涓嶅悎鏍�', 'badge-pending': item.fcheckResu === '鏈楠�' }" + class="status-badge"> + <text class="status-icon">{{ + item.fcheckResu === '鍚堟牸' ? '鉁�' : item.fcheckResu === '涓嶅悎鏍�' ? '鉁�' : '鈼�' + }} + </text> + <text class="status-text">{{ item.fcheckResu }}</text> + </view> + </view> + + <view v-if="item.fcheckItemDesc" class="item-description"> + <text class="description-text">{{ item.fcheckItemDesc }}</text> + </view> + + <view class="item-footer"> + <view class="progress-info"> + <text class="progress-label">妫�楠岃繘搴�:</text> + <view class="progress-bar"> + <view :class="{ 'progress-complete': item.fenterQty >= item.checkQyt, 'progress-incomplete': item.fenterQty < item.checkQyt }" + :style="{ width: (item.fenterQty / item.checkQyt * 100) + '%' }" + class="progress-fill"> + </view> + </view> + <text class="progress-text">{{ item.fenterQty }}/{{ item.checkQyt }}</text> + </view> + + <view :class="{ 'btn-complete': item.fenterQty >= item.checkQyt, 'btn-incomplete': item.fenterQty < item.checkQyt }" class="action-button" + @click="toDetail(item)"> + <text class="btn-text">{{ item.fenterQty >= item.checkQyt ? '鏌ョ湅璇︽儏' : '寮�濮嬫楠�' }}</text> + <text class="btn-icon">鈫�</text> + </view> + </view> + </view> + </view> + </view> + + <!-- 绌虹姸鎬� --> + <view v-else class="empty-state"> + <view class="empty-icon">馃搵</view> + <text class="empty-text">鏆傛棤妫�楠岄」鐩�</text> + <text class="empty-desc">璇峰厛鐢熸垚妫�楠岄」鐩�</text> + </view> + </view> + + <!-- 鎿嶄綔鎸夐挳鍖哄煙 --> + <view class="action-buttons"> + <button class="btn btn-primary" @click="submitInspection">鎻愪氦</button> + <button class="secondary-btn" @click="uploadImages">涓婁紶/鏌ョ湅鍥剧墖</button> + <button class="btn btn-secondary" @click="addDefectDescription">娣诲姞涓嶅悎鏍兼弿杩�</button> + </view> + + + <!-- 涓嶅悎鏍兼弿杩板脊鍑哄眰 --> + <view v-if="remarksPopup" class="overlay active"> + <view :class="{ 'popup-scale': isPopupAnimated }" class="popup" @animationend="isPopupAnimated = false"> + <view class="popup-header"> + <h3 class="popup-title">淇敼涓嶅悎鏍兼弿杩�</h3> + <view class="close-btn" @click="remarksPopup = !remarksPopup">脳</view> + </view> + <form> + <view class="form-group"> + <label class="form-label">涓嶅悎鏍兼弿杩�:</label> + <input v-model="remarks" class="form-input" type="text"/> + </view> + <view class="button-group popup-buttons"> + <button :class="['action-btn', 'btn-danger']" @click="editRemarks"> + 淇敼 + </button> + <button :class="['action-btn', 'btn-light']" @click="remarksPopup = !remarksPopup"> + 鍙栨秷 + </button> + </view> + </form> + </view> + </view> + </view> </template> <script> - export default { - data() { - return { - formData: {}, - tableData: [], - remarks: "", - remarksPopup: false, - isPopupAnimated: false, - } - }, - onLoad(options) { - //options涓寘鍚簡url闄勫甫鐨勫弬鏁� - let params = options; +export default { + data() { + return { + formData: {}, + tableData: [], + remarks: "", + remarksPopup: false, + isPopupAnimated: false, + } + }, + onLoad(options) { + //options涓寘鍚簡url闄勫甫鐨勫弬鏁� + let params = options; - if (params["id"]) { - this.formData.id = params["id"]; - this.init(); - } - }, - methods: { - init() { - let userName = this.$loginInfo.account; - this.$post({ - url: "/MesOqcItemsDetect02/getPage", - data: { - id: this.formData.id, - createUser: userName, - pageIndex: 1, - limit: 1, - } - }).then(res => { - let data = res.data[0]; - if (data) { - this.formData = data; - this.getDetail5(); - } - }); - }, + if (params["id"]) { + this.formData.id = params["id"]; + this.init(); + } + }, + methods: { + init() { + let userName = this.$loginInfo.account; + this.$post({ + url: "/MesOqcItemsDetect02/getPage", + data: { + id: this.formData.id, + createUser: userName, + pageIndex: 1, + limit: 1, + } + }).then(res => { + let data = res.data[0]; + if (data) { + this.formData = data; + this.getDetail5(); + } + }); + }, - getDetail5() { - let userName = this.$loginInfo.account; - this.$post({ - url: "/MesOqcItemsDetect02/GetDetail5", - data: { - id: this.formData.id, - createUser: userName, - releaseNo: this.formData.releaseNo, - } - }).then(res => { - let data = res.data; - this.tableData = data; - }); - }, - uploadImages() { - // 涓婁紶/鏌ョ湅鍥剧墖鐨勯�昏緫 - uni.navigateTo({ - url: 'ImageItem?id=' + this.formData.releaseNo - }); - }, - addDefectDescription() { - // 纭繚琛ㄥ崟鏁版嵁瀛樺湪 - if (!this.formData) return; + getDetail5() { + let userName = this.$loginInfo.account; + this.$post({ + url: "/MesOqcItemsDetect02/GetDetail5", + data: { + id: this.formData.id, + createUser: userName, + releaseNo: this.formData.releaseNo, + } + }).then(res => { + let data = res.data; + this.tableData = data; + }); + }, + uploadImages() { + // 涓婁紶/鏌ョ湅鍥剧墖鐨勯�昏緫 + uni.navigateTo({ + url: 'ImageItem?id=' + this.formData.id + }); + }, + addDefectDescription() { + // 纭繚琛ㄥ崟鏁版嵁瀛樺湪 + if (!this.formData) return; - this.remarksPopup = !this.remarksPopup; - this.remarks = this.formData.remeke || ''; - this.isPopupAnimated = true; - }, - toDetail(item) { + this.remarksPopup = !this.remarksPopup; + this.remarks = this.formData.remeke || ''; + this.isPopupAnimated = true; + }, + toDetail(item) { - uni.navigateTo({ - url: 'detail?mainId=' + item.id + '&releaseNo=' + this.formData - .releaseNo - }); + uni.navigateTo({ + url: 'detail?mainId=' + item.id + '&releaseNo=' + this.formData + .releaseNo + }); - }, - submitInspection() { - // 妫�楠屾彁浜ょ殑閫昏緫 - this.$post({ - url: "/MesOqcItemsDetect02/IqcQaSubmit", - data: { - userNo: this.$loginInfo.account, - releaseNo: this.formData.releaseNo - } - }).then(res => { - if (res.status == 0) { + }, + submitInspection() { + // 妫�楠屾彁浜ょ殑閫昏緫 + this.$post({ + url: "/MesOqcItemsDetect02/IqcQaSubmit", + data: { + userNo: this.$loginInfo.account, + releaseNo: this.formData.releaseNo + } + }).then(res => { + if (res.status == 0) { - uni.showToast({ - title: res.message.toString(), - icon: 'success', - duration: 2000 - }) - // 濡傛灉鏈夐〉闈㈣烦杞紝闇�瑕佺敤瀹氭椂鍣ㄥ欢杩� - setTimeout(() => { - uni.navigateTo({ - url: 'List' - }); - }, 2000); // 淇濇寔涓� duration 鐩稿悓鐨勬椂闀� + uni.showToast({ + title: res.message.toString(), + icon: 'success', + duration: 2000 + }) + // 濡傛灉鏈夐〉闈㈣烦杞紝闇�瑕佺敤瀹氭椂鍣ㄥ欢杩� + setTimeout(() => { + uni.navigateTo({ + url: 'List' + }); + }, 2000); // 淇濇寔涓� duration 鐩稿悓鐨勬椂闀� - } else { - uni.showModal({ - title: "鎻愮ず", - content: res.message.toString(), - confirmText: "纭畾", - showCancel: false, - success: (res) => { + } else { + uni.showModal({ + title: "鎻愮ず", + content: res.message.toString(), + confirmText: "纭畾", + showCancel: false, + success: (res) => { - } - }) - } - }) - }, - editRemarks() { - if (this.remarks && this.formData.id) { - this.$post({ - url: "/MesOqcItemsDetect02/saveRemarksGid", - data: { - gid: this.formData.id, - remarks: this.remarks, - releaseNo: this.formData.releaseNo, - } - }).then(res => { - if (res.data.tbBillList > 0) { - this.formData.remarks = this.remarks; - this.remarksPopup = false; - this.$showMessage("淇濆瓨鎴愬姛"); - this.init(); - } else { - this.$showMessage("淇濆瓨澶辫触"); - } - }).catch(() => { - this.$showMessage("淇濆瓨澶辫触锛岃閲嶈瘯"); - }); - } else if (!this.formData.id) { - this.$showMessage("璇峰厛鐢熸垚妫�楠屽崟"); - } else { - this.$showMessage("璇疯緭鍏ヤ笉鍚堟牸鎻忚堪"); - } - }, - } - } + } + }) + } + }) + }, + editRemarks() { + if (this.remarks && this.formData.id) { + this.$post({ + url: "/MesOqcItemsDetect02/saveRemarksGid", + data: { + gid: this.formData.id, + remarks: this.remarks, + releaseNo: this.formData.releaseNo, + } + }).then(res => { + if (res.data.tbBillList > 0) { + this.formData.remarks = this.remarks; + this.remarksPopup = false; + this.$showMessage("淇濆瓨鎴愬姛"); + this.init(); + } else { + this.$showMessage("淇濆瓨澶辫触"); + } + }).catch(() => { + this.$showMessage("淇濆瓨澶辫触锛岃閲嶈瘯"); + }); + } else if (!this.formData.id) { + this.$showMessage("璇峰厛鐢熸垚妫�楠屽崟"); + } else { + this.$showMessage("璇疯緭鍏ヤ笉鍚堟牸鎻忚堪"); + } + }, + } +} </script> <style scoped> @@ -342,13 +345,13 @@ /* 鎿嶄綔鎸夐挳鍖哄煙 */ .action-buttons { display: flex; - justify-content: space-between; - gap: 15px; + flex-direction: column; + gap: 12px; padding: 15px 0; } -.btn { - flex: 1; +.btn, .secondary-btn { + width: 100%; height: 45px; border-radius: 8px; border: none; @@ -386,6 +389,19 @@ background-color: #6D6D70; } +/* 澶у睆骞曟椂淇濇寔妯悜鎺掑垪 */ +@media (min-width: 768px) { + .action-buttons { + flex-direction: row; + gap: 15px; + } + + .btn, .secondary-btn { + flex: 1; + width: auto; + } +} + /* 妫�楠岄」鐩崱鐗� */ .inspection-card { background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%); @@ -414,7 +430,7 @@ left: 0; right: 0; bottom: 0; - background: linear-gradient(45deg, rgba(255,255,255,0.1) 0%, transparent 100%); + background: linear-gradient(45deg, rgba(255, 255, 255, 0.1) 0%, transparent 100%); pointer-events: none; } @@ -699,41 +715,41 @@ margin: 0 -8px 24px -8px; border-radius: 12px; } - + .card-header { padding: 16px 20px; } - + .header-title { font-size: 16px; } - + .inspection-list { padding: 16px 20px; } - + .item-content { padding: 16px 20px; } - + .item-header { flex-direction: column; align-items: flex-start; gap: 8px; } - + .item-footer { flex-direction: column; align-items: stretch; gap: 12px; } - + .progress-info { flex-direction: column; align-items: stretch; gap: 8px; } - + .action-button { justify-content: center; } diff --git a/pages/QC/OQC/ImageItem.vue b/pages/QC/OQC/ImageItem.vue index 293fd14..401cc0d 100644 --- a/pages/QC/OQC/ImageItem.vue +++ b/pages/QC/OQC/ImageItem.vue @@ -14,16 +14,16 @@ <view class="uni-flex" style="flex-wrap: wrap;"> <view v-for="(image,index) in qsImage" :key="index" class="uni-uploader__input-box" style="position: relative; border: 0;"> - <image :src="image.img" :data-src="image.img" + <image :data-src="image.img" :src="image.img" @tap="previewImage(index)"></image> - <image src="/static/plus.png" class="image-remove" @click="removeImage(index,image.id)"></image> + <image class="image-remove" src="/static/plus.png" @click="removeImage(index,image.id)"></image> </view> - <image class="uni-uploader__input-box" @tap="chooseImage" src="/static/plus.png"></image> + <image class="uni-uploader__input-box" src="/static/plus.png" @tap="chooseImage"></image> </view> </view> </view> <view class="plus-button"> - <button type="primary" class="upImg" @click="save">涓婁紶鍥剧墖</button> + <button class="upImg" type="primary" @click="save">涓婁紶鍥剧墖</button> </view> </view> <!-- #ifdef APP --> @@ -33,7 +33,7 @@ <script> -import {pathToBase64, base64ToPath} from '../../../js_sdk/mmmm-image-tools/index' +import {pathToBase64} from '../../../js_sdk/mmmm-image-tools/index' var sourceTypeArray = [ ['camera'], @@ -62,7 +62,7 @@ cropResize: false, qsImage: [], fid: 0, - qsType : 5, + qsType: 5, } }, onLoad(options) { @@ -152,9 +152,9 @@ }, init() { this.$post({ - url: "/Base/getLljAllImgByFid", + url: "/Base/getByOqcFid", data: { - id: this.fid, + fid: this.fid, qsType: this.qsType } }).then(res => { @@ -225,10 +225,11 @@ max-height: calc(100vh - 240px); /* 灞忓箷楂樺害鍑忓幓涓婁紶鎸夐挳楂樺害 */ overflow-y: auto; /* 褰撳唴瀹硅秴鍑洪珮搴︽椂鍑虹幇鍨傜洿婊氬姩鏉� */ } -.upImg{ - - background-color: #3498db; - color: white; - + +.upImg { + + background-color: #3498db; + color: white; + } </style> \ No newline at end of file diff --git a/pages/QC/OQC/ScanCode.vue b/pages/QC/OQC/ScanCode.vue index aec1edf..f7c77cf 100644 --- a/pages/QC/OQC/ScanCode.vue +++ b/pages/QC/OQC/ScanCode.vue @@ -1,745 +1,928 @@ <template> - <view class="container"> - <!-- 琛ㄥ崟鍖哄煙 --> - <view class="form-container card"> - <form :modelValue="formData"> - <view class="form-grid"> - <view class="form-group col-2"> - <label class="form-label">鐗╂枡鏉$爜:</label> - <view class="input-with-scan"> - <input class="form-input scan-input" type="text" v-model="formData.ItemBarcode" - @confirm="addItemBarCode" - placeholder="杈撳叆鍚庣寮�鎴栨寜鍥炶溅" /> - <view class="scan-button" @tap="startScan"> - <uni-icons type="scan" size="24" color="#007bff"></uni-icons> - <text class="scan-text">鎵爜</text> - </view> - </view> - </view> - <view class="form-group col-2"> - <label class="form-label">浜у搧鍚嶇О:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.itemName" /> - </view> - <view class="form-group col-2"> - <label class="form-label">浜у搧缂栫爜:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.itemNo" /> - </view> - <view class="form-group col-2"> - <label class="form-label">璁㈠崟缂栧彿:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.taskNo" /> - </view> - <view class="form-group col-2"> - <label class="form-label">宸叉壂鏁伴噺:</label> - <input class="form-input" disabled="true" type="text" v-model="quantity" /> - </view> - </view> - </form> - </view> + <view class="container"> + <!-- 琛ㄥ崟鍖哄煙 --> + <view class="form-container card"> + <form :modelValue="formData"> + <view class="form-grid"> + <view class="form-group col-2"> + <label class="form-label">鐗╂枡鏉$爜:</label> + <view class="input-with-scan"> + <input v-model="formData.ItemBarcode" class="form-input scan-input" placeholder="杈撳叆鍚庣寮�鎴栨寜鍥炶溅" + type="text" + @confirm="addItemBarCode"/> + <view class="scan-button" @tap="startScan"> + <uni-icons color="#007bff" size="24" type="scan"></uni-icons> + <text class="scan-text">鎵爜</text> + </view> + </view> + </view> + <view class="form-group col-2"> + <label class="form-label">浜у搧鍚嶇О:</label> + <input v-model="formData.itemName" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group col-2"> + <label class="form-label">浜у搧缂栫爜:</label> + <input v-model="formData.itemNo" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group col-2"> + <label class="form-label">璁㈠崟缂栧彿:</label> + <input v-model="formData.taskNo" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group col-2"> + <label class="form-label">宸叉壂鏁伴噺:</label> + <input v-model="quantity" class="form-input" disabled="true" type="text"/> + </view> + </view> + </form> + </view> - <!-- 寰呮鏉$爜琛ㄦ牸鍖哄煙 --> - <view class="table-container card"> - <view class="table-header"> - <text class="section-title">寰呮鏉$爜鍒楄〃</text> - <view class="table-tip"> - <text class="tip-text">馃憟 宸﹀彸婊戝姩鏌ョ湅鏇村淇℃伅</text> - </view> - </view> - <view class="table-wrapper"> - <scroll-view class="table-scroll" scroll-x="true" show-scrollbar="true"> - <uni-table ref="table" border emptyText="鏆傛棤鏇村鏁版嵁" class="custom-table"> - <uni-tr class="table-header-row"> - <uni-th align="center" class="th" width="80">搴忓彿</uni-th> - <uni-th align="center" class="th" width="160">鐗╂枡鏉$爜</uni-th> - <uni-th align="center" class="th" width="140">璁㈠崟缂栧彿</uni-th> - <uni-th align="center" class="th" width="140">浜у搧缂栫爜</uni-th> - <uni-th align="center" class="th" width="160">浜у搧鍚嶇О</uni-th> - <uni-th align="center" class="th" width="100">鏉$爜鏁伴噺</uni-th> - <uni-th align="center" class="th" width="80">銆�</uni-th> - </uni-tr> - <uni-tr v-for="(item, index) in tableData" :key="index" class="table-row"> - <uni-td align="center" width="80"> - <view class="description-text">{{ index + 1 }}</view> - </uni-td> - <uni-td align="center" width="160"> - <view class="cell-content">{{ item.itemBarcode }}</view> - </uni-td> - <uni-td align="center" width="140"> - <view class="cell-content">{{ item.taskNo || '-' }}</view> - </uni-td> - <uni-td align="center" width="140"> - <view class="cell-content">{{ item.itemNo }}</view> - </uni-td> - <uni-td align="center" width="160"> - <view class="cell-content" :title="item.itemName">{{ item.itemName }}</view> - </uni-td> - <uni-td align="center" width="100"> - <view class="cell-content quantity">{{ item.quantity }}</view> - </uni-td> - <uni-td align="center" width="80"> - <view class="cell-content">銆�</view> - </uni-td> - </uni-tr> - </uni-table> - </scroll-view> - - <!-- 鍙冲浐瀹氭偓娴垹闄ゆ寜閽垪 --> - <view class="fixed-delete-column"> - <view class="fixed-header"> - <text class="fixed-header-text">鎿嶄綔</text> - </view> - <view class="fixed-content"> - <view v-for="(item, index) in tableData" :key="index" class="fixed-delete-item" - :class="{ 'even': index % 2 === 1 }"> - <view @click="deleteItem(index)" class="delete-icon"> - <uni-icons type="trash" size="24"></uni-icons> - </view> - </view> - </view> - </view> - </view> - </view> + <!-- 寰呮鏉$爜琛ㄦ牸鍖哄煙 --> + <view class="table-container card"> + <view class="table-header"> + <text class="section-title">寰呮鏉$爜鍒楄〃</text> + <view class="table-tip"> + <text class="tip-text">馃憟 宸﹀彸婊戝姩鏌ョ湅鏇村淇℃伅</text> + </view> + </view> + <view class="table-wrapper"> + <scroll-view class="table-scroll" scroll-x="true" show-scrollbar="true"> + <uni-table ref="table" border class="custom-table" emptyText="鏆傛棤鏇村鏁版嵁"> + <uni-tr class="table-header-row"> + <uni-th align="center" class="th" width="80">搴忓彿</uni-th> + <uni-th align="center" class="th" width="160">鐗╂枡鏉$爜</uni-th> + <uni-th align="center" class="th" width="140">璁㈠崟缂栧彿</uni-th> + <uni-th align="center" class="th" width="140">浜у搧缂栫爜</uni-th> + <uni-th align="center" class="th" width="160">浜у搧鍚嶇О</uni-th> + <uni-th align="center" class="th" width="100">鏉$爜鏁伴噺</uni-th> + <uni-th align="center" class="th" width="80">鍒犻櫎</uni-th> + </uni-tr> + <uni-tr v-for="(item, index) in tableData" :key="index" class="table-row"> + <uni-td align="center" width="80"> + <view class="description-text">{{ index + 1 }}</view> + </uni-td> + <uni-td align="center" width="160"> + <view class="cell-content">{{ item.itemBarcode }}</view> + </uni-td> + <uni-td align="center" width="140"> + <view class="cell-content">{{ item.taskNo || '-' }}</view> + </uni-td> + <uni-td align="center" width="140"> + <view class="cell-content">{{ item.itemNo }}</view> + </uni-td> + <uni-td align="center" width="160"> + <view :title="item.itemName" class="cell-content">{{ item.itemName }}</view> + </uni-td> + <uni-td align="center" width="100"> + <view class="cell-content quantity">{{ item.quantity }}</view> + </uni-td> + <uni-td align="center" width="80"> + <view class="delete-icon" @click="deleteItem(index)"> + <uni-icons size="24" type="trash"></uni-icons> + </view> + </uni-td> + </uni-tr> + </uni-table> + </scroll-view> + </view> + </view> - <!-- 鎿嶄綔鎸夐挳鍖哄煙 --> - <view class="action-buttons-container button-group"> - <view class="plus-button" :class="{ 'submitting': isSubmitting }" @tap="handleSubmit"> - <text>{{ isSubmitting ? '鎻愪氦涓�...' : '鐢熸垚OQC妫�楠屽崟' }}</text> - </view> - </view> - </view> + <!-- 鎿嶄綔鎸夐挳鍖哄煙 --> + <view class="action-buttons-container button-group"> + <view :class="{ 'submitting': isSubmitting }" class="plus-button" @tap="handleSubmit"> + <text>{{ isSubmitting ? '鎻愪氦涓�...' : '鐢熸垚OQC妫�楠屽崟' }}</text> + </view> + </view> + </view> </template> <script> - export default { - data() { - return { - formData: {}, - tableData: [], - quantity: 0, - isSubmitting: false, // 闃叉閲嶅鎻愪氦 - isProcessing: false, // 闃叉閲嶅澶勭悊鏉$爜 - } - }, - methods: { - // 鍚姩鎵爜鍔熻兘 - startScan() { - // 妫�鏌ユ槸鍚︽鍦ㄥ鐞嗘潯鐮侊紝闃叉閲嶅鎵爜 - if (this.isProcessing) { - this.$showMessage("姝e湪澶勭悊鏉$爜锛岃绋嶅��"); - return; - } +export default { + data() { + return { + formData: {}, + tableData: [], + quantity: 0, + isSubmitting: false, // 闃叉閲嶅鎻愪氦 + isProcessing: false, // 闃叉閲嶅澶勭悊鏉$爜 + } + }, + methods: { + // 鍚姩鎵爜鍔熻兘 + startScan() { + // 妫�鏌ユ槸鍚︽鍦ㄥ鐞嗘潯鐮侊紝闃叉閲嶅鎵爜 + if (this.isProcessing) { + this.$showMessage("姝e湪澶勭悊鏉$爜锛岃绋嶅��"); + return; + } - uni.scanCode({ - scanType: ['barCode', 'qrCode'], // 鏀寔鏉$爜鍜屼簩缁寸爜 - success: (res) => { - console.log('鎵爜鎴愬姛:', res); - // 灏嗘壂鐮佺粨鏋滆缃埌杈撳叆妗� - this.formData.ItemBarcode = res.result; - // 鑷姩澶勭悊鎵爜缁撴灉 - this.addItemBarCode(); - }, - fail: (err) => { - console.log('鎵爜澶辫触:', err); - if (err.errMsg && err.errMsg.indexOf('cancel') === -1) { - this.$showMessage("鎵爜澶辫触锛岃閲嶈瘯"); - } - } - }); - }, + uni.scanCode({ + scanType: ['barCode', 'qrCode'], // 鏀寔鏉$爜鍜屼簩缁寸爜 + success: (res) => { + console.log('鎵爜鎴愬姛:', res); + // 灏嗘壂鐮佺粨鏋滆缃埌杈撳叆妗� + this.formData.ItemBarcode = res.result; + // 鑷姩澶勭悊鎵爜缁撴灉 + this.addItemBarCode(); + }, + fail: (err) => { + console.log('鎵爜澶辫触:', err); + if (err.errMsg && err.errMsg.indexOf('cancel') === -1) { + this.$showMessage("鎵爜澶辫触锛岃閲嶈瘯"); + } + } + }); + }, - addItemBarCode() { - // 闃叉閲嶅澶勭悊 - if (this.isProcessing) { - return; - } + addItemBarCode() { + // 闃叉閲嶅澶勭悊 + if (this.isProcessing) { + return; + } - // 鏍¢獙鐗╂枡鏉$爜鏄惁涓虹┖ - if (!this.formData.ItemBarcode || this.formData.ItemBarcode.trim() === '') { - this.$showMessage("璇疯緭鍏ョ墿鏂欐潯鐮�"); - return; - } + // 鏍¢獙鐗╂枡鏉$爜鏄惁涓虹┖ + if (!this.formData.ItemBarcode || this.formData.ItemBarcode.trim() === '') { + this.$showMessage("璇疯緭鍏ョ墿鏂欐潯鐮�"); + return; + } - // 妫�鏌ョ墿鏂欐潯鐮佹槸鍚﹀凡瀛樺湪浜� tableData 涓� - const isDuplicate = this.tableData.some(item => item.itemBarcode === this.formData.ItemBarcode); - if (isDuplicate) { - this.$showMessage("璇ョ墿鏂欐潯鐮佸凡瀛樺湪锛岃妫�鏌ワ紒"); - return; - } + // 妫�鏌ョ墿鏂欐潯鐮佹槸鍚﹀凡瀛樺湪浜� tableData 涓� + const isDuplicate = this.tableData.some(item => item.itemBarcode === this.formData.ItemBarcode); + if (isDuplicate) { + this.$showMessage("璇ョ墿鏂欐潯鐮佸凡瀛樺湪锛岃妫�鏌ワ紒"); + return; + } - // 璁剧疆澶勭悊鐘舵�� - this.isProcessing = true; + // 璁剧疆澶勭悊鐘舵�� + this.isProcessing = true; - // 濡傛灉閫氳繃浜嗕笂杩版牎楠岋紝鍙戦�佽姹傚苟鏇存柊鏁版嵁 - this.$post({ - url: "/MesOqcItemsDetect02/GetItemBarCode", - data: { - ItemCode: this.formData.ItemBarcode - } - }).then(res => { - let fr = res.data.tbBillList; + // 濡傛灉閫氳繃浜嗕笂杩版牎楠岋紝鍙戦�佽姹傚苟鏇存柊鏁版嵁 + this.$post({ + url: "/MesOqcItemsDetect02/GetItemBarCode", + data: { + ItemCode: this.formData.ItemBarcode + } + }).then(res => { + let fr = res.data.tbBillList; - // 鏁版嵁瀹屾暣鎬ф牎楠� - if (!fr) { - this.$showMessage("鑾峰彇鏉$爜淇℃伅澶辫触锛岃閲嶈瘯"); - return; - } + // 鏁版嵁瀹屾暣鎬ф牎楠� + if (!fr) { + this.$showMessage("鑾峰彇鏉$爜淇℃伅澶辫触锛岃閲嶈瘯"); + return; + } - if (!fr.itemId || !fr.itemName || !fr.itemNo) { - this.$showMessage("鏉$爜淇℃伅涓嶅畬鏁达紝璇锋鏌ユ潯鐮�"); - return; - } + if (!fr.itemId || !fr.itemName || !fr.itemNo) { + this.$showMessage("鏉$爜淇℃伅涓嶅畬鏁达紝璇锋鏌ユ潯鐮�"); + return; + } - if (fr.quantity <= 0) { - this.$showMessage("鏉$爜鏁伴噺涓�0锛岃纭"); - return; - } + if (fr.quantity <= 0) { + this.$showMessage("鏉$爜鏁伴噺涓�0锛岃纭"); + return; + } - //闇�瑕侀獙璇� - //鎵殑鐮佺殑itemId蹇呴』鏄拰tableData涓殑itemId鐩稿悓 蹇呴』鐨勬潯浠� - //鎵殑鐮佺殑TaskNo涔熷繀椤绘槸鍜宼ableData涓殑TaskNo鐩稿悓 - //TaskNo涓虹┖鐨勫彧鑳藉拰TaskNo涓虹┖鐨勪竴璧锋壂 - - // 濡傛灉tableData涓凡鏈夋暟鎹紝闇�瑕侀獙璇乮temId鍜孴askNo鐨勪竴鑷存�� - if (this.tableData.length > 0) { - const firstItem = this.tableData[0]; - - // 楠岃瘉itemId鏄惁鐩稿悓锛堝繀椤绘潯浠讹級 - if (fr.itemId !== firstItem.itemId) { - this.$showMessage("鐗╂枡缂栫爜涓嶄竴鑷达紝璇锋壂鎻忕浉鍚岀墿鏂欑殑鏉$爜"); - return; - } - - // 楠岃瘉TaskNo鏄惁鐩稿悓 - if (fr.taskNo !== firstItem.taskNo) { - this.$showMessage("璁㈠崟缂栧彿涓嶄竴鑷达紝璇锋壂鎻忕浉鍚岃鍗曠殑鏉$爜"); - return; - } - - // 楠岃瘉绌篢askNo鐨勬儏鍐碉細TaskNo涓虹┖鐨勫彧鑳藉拰TaskNo涓虹┖鐨勪竴璧锋壂 - if ((fr.taskNo === '' || fr.taskNo === null || fr.taskNo === undefined) && - (firstItem.taskNo !== '' && firstItem.taskNo !== null && firstItem.taskNo !== undefined)) { - this.$showMessage("璁㈠崟缂栧彿涓嶅尮閰嶏紝绌鸿鍗曠紪鍙峰彧鑳戒笌绌鸿鍗曠紪鍙蜂竴璧锋壂鎻�"); - return; - } - - if ((fr.taskNo !== '' && fr.taskNo !== null && fr.taskNo !== undefined) && - (firstItem.taskNo === '' || firstItem.taskNo === null || firstItem.taskNo === undefined)) { - this.$showMessage("璁㈠崟缂栧彿涓嶅尮閰嶏紝鏈夎鍗曠紪鍙风殑鏉$爜鍙兘涓庢湁璁㈠崟缂栧彿鐨勬潯鐮佷竴璧锋壂鎻�"); - return; - } - } + //闇�瑕侀獙璇� + //鎵殑鐮佺殑itemId蹇呴』鏄拰tableData涓殑itemId鐩稿悓 蹇呴』鐨勬潯浠� + //鎵殑鐮佺殑TaskNo涔熷繀椤绘槸鍜宼ableData涓殑TaskNo鐩稿悓 + //TaskNo涓虹┖鐨勫彧鑳藉拰TaskNo涓虹┖鐨勪竴璧锋壂 - this.formData = fr; - this.tableData.push(fr); // 灏嗘柊鏁版嵁娣诲姞鍒拌〃鏍� - this.quantity = this.tableData.reduce(function(accumulator, current) { - return accumulator + current["quantity"]; - }, 0); - - // 娓呯┖杈撳叆妗� - this.formData.ItemBarcode = ''; - }).catch(error => { - this.$showMessage("鑾峰彇鏉$爜淇℃伅澶辫触锛岃閲嶈瘯"); - }).finally(() => { - // 閲嶇疆澶勭悊鐘舵�� - this.isProcessing = false; - }); - }, + // 濡傛灉tableData涓凡鏈夋暟鎹紝闇�瑕侀獙璇乮temId鍜孴askNo鐨勪竴鑷存�� + if (this.tableData.length > 0) { + const firstItem = this.tableData[0]; - // 鍒犻櫎鎿嶄綔锛氬垹闄� tableData 涓寚瀹氱储寮曠殑鏁版嵁 - deleteItem(index) { - this.tableData.splice(index, 1); // 鍒犻櫎璇ヨ鏁版嵁 - this.quantity = this.tableData.reduce(function(accumulator, current) { - return accumulator + current["quantity"]; - }, 0); // 鏇存柊鏉$爜鏁伴噺 + // 楠岃瘉itemId鏄惁鐩稿悓锛堝繀椤绘潯浠讹級 + if (fr.itemId !== firstItem.itemId) { + this.$showMessage("鐗╂枡缂栫爜涓嶄竴鑷达紝璇锋壂鎻忕浉鍚岀墿鏂欑殑鏉$爜"); + return; + } - if (this.tableData.length <= 0) { - this.formData = {}; - } - }, + // 楠岃瘉TaskNo鏄惁鐩稿悓 + if (fr.taskNo !== firstItem.taskNo) { + this.$showMessage("璁㈠崟缂栧彿涓嶄竴鑷达紝璇锋壂鎻忕浉鍚岃鍗曠殑鏉$爜"); + return; + } - handleSubmit() { - console.log("handleSubmit鏂规硶琚皟鐢紝isSubmitting:", this.isSubmitting); - console.log("tableData闀垮害:", this.tableData.length); - console.log("quantity:", this.quantity); - this.submit(); - }, + // 楠岃瘉绌篢askNo鐨勬儏鍐碉細TaskNo涓虹┖鐨勫彧鑳藉拰TaskNo涓虹┖鐨勪竴璧锋壂 + if ((fr.taskNo === '' || fr.taskNo === null || fr.taskNo === undefined) && + (firstItem.taskNo !== '' && firstItem.taskNo !== null && firstItem.taskNo !== undefined)) { + this.$showMessage("璁㈠崟缂栧彿涓嶅尮閰嶏紝绌鸿鍗曠紪鍙峰彧鑳戒笌绌鸿鍗曠紪鍙蜂竴璧锋壂鎻�"); + return; + } - submit() { - console.log("submit鏂规硶琚皟鐢�"); - - // 闃叉閲嶅鎻愪氦 - if (this.isSubmitting) { - this.$showMessage("姝e湪鎻愪氦涓紝璇峰嬁閲嶅鎿嶄綔"); - return; - } + if ((fr.taskNo !== '' && fr.taskNo !== null && fr.taskNo !== undefined) && + (firstItem.taskNo === '' || firstItem.taskNo === null || firstItem.taskNo === undefined)) { + this.$showMessage("璁㈠崟缂栧彿涓嶅尮閰嶏紝鏈夎鍗曠紪鍙风殑鏉$爜鍙兘涓庢湁璁㈠崟缂栧彿鐨勬潯鐮佷竴璧锋壂鎻�"); + return; + } + } - // 鏍¢獙鐢ㄦ埛鐧诲綍鐘舵�� - if (!this.$loginInfo.account) { - this.$showMessage("鐢ㄦ埛鏈櫥褰曪紝璇烽噸鏂扮櫥褰�"); - return; - } + this.formData = fr; + this.tableData.push(fr); // 灏嗘柊鏁版嵁娣诲姞鍒拌〃鏍� + this.quantity = this.tableData.reduce(function (accumulator, current) { + return accumulator + current["quantity"]; + }, 0); - // 鏍¢獙鏉$爜鏁伴噺鏄惁鏈夋晥 - if (this.quantity <= 0) { - this.$showMessage("鏉$爜鏁伴噺蹇呴』澶т簬0"); - return; - } + // 娓呯┖杈撳叆妗� + this.formData.ItemBarcode = ''; + }).catch(error => { + this.$showMessage("鑾峰彇鏉$爜淇℃伅澶辫触锛岃閲嶈瘯"); + }).finally(() => { + // 閲嶇疆澶勭悊鐘舵�� + this.isProcessing = false; + }); + }, - // 鏍¢獙鏄惁鏈夋暟鎹� - if (this.tableData.length === 0) { - this.$showMessage("璇锋壂鎻忔潯鐮�"); - return; - } + // 鍒犻櫎鎿嶄綔锛氬垹闄� tableData 涓寚瀹氱储寮曠殑鏁版嵁 + deleteItem(index) { + this.tableData.splice(index, 1); // 鍒犻櫎璇ヨ鏁版嵁 + this.quantity = this.tableData.reduce(function (accumulator, current) { + return accumulator + current["quantity"]; + }, 0); // 鏇存柊鏉$爜鏁伴噺 - let userName = this.$loginInfo.account; - this.isSubmitting = true; // 璁剧疆鎻愪氦鐘舵�� + if (this.tableData.length <= 0) { + this.formData = {}; + } + }, - // 鍙戦�佽姹� - this.$post({ - url: "/MesOqcItemsDetect02/ItemBarCodeSubmit", - data: { - itemBarCodeData: this.tableData, - CreateUser: userName - } - }).then(response => { - if(response.status == 0){ - // 璇锋眰鎴愬姛鍚庢樉绀洪�夋嫨妗� - uni.showModal({ - title: "鎿嶄綔鎴愬姛", - content: "宸茬粡鎴愬姛鐢熸垚妫�楠屽崟", - showCancel: true, - cancelText: "缁х画鎵爜", - confirmText: "璺宠浆鍒版楠屽崟", - success: (res) => { - if (res.confirm) { - // 鐢ㄦ埛鐐瑰嚮浜�"璺宠浆鍒版楠屽崟" - uni.navigateTo({ - url: '/pages/QC/OQC/Add?id=' + response.data - }); - } else if (res.cancel) { - // 鐢ㄦ埛鐐瑰嚮浜�"缁х画鎵爜" - this.clearData(); - } - } - }); - }else{ - this.$showMessage(response.message); - } - - }).catch(error => { - // 璇锋眰澶辫触鏃剁殑澶勭悊 - this.$showMessage("璇锋眰澶辫触锛岃绋嶅悗閲嶈瘯"); - }).finally(() => { - // 鏃犺鎴愬姛杩樻槸澶辫触閮介噸缃彁浜ょ姸鎬� - this.isSubmitting = false; - }); - }, + handleSubmit() { + console.log("handleSubmit鏂规硶琚皟鐢紝isSubmitting:", this.isSubmitting); + console.log("tableData闀垮害:", this.tableData.length); + console.log("quantity:", this.quantity); + this.submit(); + }, - // 娓呯┖琛ㄦ牸鍜岃〃鍗曟暟鎹� - clearData() { - this.tableData = []; - this.formData = {}; - this.quantity = 0; - this.isSubmitting = false; - this.isProcessing = false; - } + submit() { + console.log("submit鏂规硶琚皟鐢�"); - } - } + // 闃叉閲嶅鎻愪氦 + if (this.isSubmitting) { + this.$showMessage("姝e湪鎻愪氦涓紝璇峰嬁閲嶅鎿嶄綔"); + return; + } + + // 鏍¢獙鐢ㄦ埛鐧诲綍鐘舵�� + if (!this.$loginInfo.account) { + this.$showMessage("鐢ㄦ埛鏈櫥褰曪紝璇烽噸鏂扮櫥褰�"); + return; + } + + // 鏍¢獙鏉$爜鏁伴噺鏄惁鏈夋晥 + if (this.quantity <= 0) { + this.$showMessage("鏉$爜鏁伴噺蹇呴』澶т簬0"); + return; + } + + // 鏍¢獙鏄惁鏈夋暟鎹� + if (this.tableData.length === 0) { + this.$showMessage("璇锋壂鎻忔潯鐮�"); + return; + } + + let userName = this.$loginInfo.account; + this.isSubmitting = true; // 璁剧疆鎻愪氦鐘舵�� + + // 鍙戦�佽姹� + this.$post({ + url: "/MesOqcItemsDetect02/ItemBarCodeSubmit", + data: { + itemBarCodeData: this.tableData, + CreateUser: userName + } + }).then(response => { + if (response.status == 0) { + // 璇锋眰鎴愬姛鍚庢樉绀洪�夋嫨妗� + uni.showModal({ + title: "鎿嶄綔鎴愬姛", + content: "宸茬粡鎴愬姛鐢熸垚妫�楠屽崟", + showCancel: true, + cancelText: "缁х画鎵爜", + confirmText: "璺宠浆鍒版楠屽崟", + success: (res) => { + if (res.confirm) { + // 鐢ㄦ埛鐐瑰嚮浜�"璺宠浆鍒版楠屽崟" + uni.navigateTo({ + url: '/pages/QC/OQC/Add?id=' + response.data + }); + } else if (res.cancel) { + // 鐢ㄦ埛鐐瑰嚮浜�"缁х画鎵爜" + this.clearData(); + } + } + }); + } else { + this.$showMessage(response.message); + } + + }).catch(error => { + // 璇锋眰澶辫触鏃剁殑澶勭悊 + this.$showMessage("璇锋眰澶辫触锛岃绋嶅悗閲嶈瘯"); + }).finally(() => { + // 鏃犺鎴愬姛杩樻槸澶辫触閮介噸缃彁浜ょ姸鎬� + this.isSubmitting = false; + }); + }, + + // 娓呯┖琛ㄦ牸鍜岃〃鍗曟暟鎹� + clearData() { + this.tableData = []; + this.formData = {}; + this.quantity = 0; + this.isSubmitting = false; + this.isProcessing = false; + } + + } +} </script> <style> - .container { - padding: 24rpx; - background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%); - min-height: 100vh; - display: flex; - flex-direction: column; - } - - /* 鍗$墖閫氱敤鏍峰紡 */ - .card { - background: #ffffff; - border-radius: 12rpx; - box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08); - margin-bottom: 24rpx; - padding: 32rpx; - border: 1rpx solid #e9ecef; - } - - /* 琛ㄥ崟鍖哄煙 */ - .form-container { - .form-grid { - display: grid; - grid-template-columns: repeat(2, 1fr); - gap: 24rpx 16rpx; - } - - .form-group { - display: flex; - flex-direction: column; - gap: 16rpx; - - .form-label { - font-size: 28rpx; - color: #495057; - font-weight: 600; - padding-left: 4rpx; - position: relative; - - &::after { - content: ""; - position: absolute; - left: 0; - bottom: -4rpx; - width: 24rpx; - height: 3rpx; - background: #007bff; - border-radius: 2rpx; - } - } - - .form-input { - height: 92rpx; - padding: 0 24rpx; - border: 2rpx solid #dee2e6; - border-radius: 8rpx; - font-size: 28rpx; - color: #212529; - background: #ffffff; - transition: all 0.3s ease; - - &[disabled] { - background: #f8f9fa; - color: #6c757d; - border-color: #e9ecef; - } - - &:focus { - border-color: #007bff; - box-shadow: 0 0 0 4rpx rgba(0, 123, 255, 0.1); - outline: none; - } - - &::placeholder { - color: #adb5bd; - } - } - } - } - - /* 琛ㄦ牸浼樺寲 */ - .table-container { - .table-header { - margin-bottom: 24rpx; - padding-bottom: 16rpx; - border-bottom: 2rpx solid #e9ecef; - display: flex; - justify-content: space-between; - align-items: center; - - .section-title { - font-size: 32rpx; - color: #212529; - font-weight: 700; - position: relative; - padding-left: 24rpx; - - &::before { - content: ""; - position: absolute; - left: 0; - top: 50%; - transform: translateY(-50%); - width: 4rpx; - height: 28rpx; - background: linear-gradient(135deg, #007bff, #0056b3); - border-radius: 2rpx; - } - } - - .table-tip { - .tip-text { - font-size: 22rpx; - color: #6c757d; - background: #f8f9fa; - padding: 8rpx 16rpx; - border-radius: 16rpx; - border: 1rpx solid #e9ecef; - } - } - } - - .table-wrapper { - position: relative; - border-radius: 8rpx; - overflow: hidden; - border: 1rpx solid #dee2e6; - } - - .table-scroll { - width: calc(100% - 80rpx); /* 鍑忓幓鍥哄畾鍒楀搴� */ - white-space: nowrap; - } - - .custom-table { - border: none; - min-width: 780rpx; - - .table-header-row { - background: linear-gradient(135deg, #f8f9fa, #e9ecef); - - .th { - font-size: 26rpx; - color: #495057; - font-weight: 600; - padding: 20rpx 12rpx; - background: transparent !important; - border-right: 1rpx solid #dee2e6; - white-space: nowrap; - min-width: 80rpx; - - &:last-child { - border-right: none; - } - } - } - - .table-row { - transition: background-color 0.2s ease; - - &:nth-child(even) { - background: #f8f9fa; - } - - &:hover { - background: #e3f2fd; - } - - .uni-td { - padding: 16rpx 12rpx; - border-color: #dee2e6 !important; - border-right: 1rpx solid #dee2e6; - white-space: nowrap; - min-width: 80rpx; - - &:last-child { - border-right: none; - } - - .cell-content { - font-size: 24rpx; - color: #495057; - line-height: 1.4; - max-width: 100%; - overflow: hidden; - text-overflow: ellipsis; - - &.quantity { - font-weight: 600; - color: #007bff; - background: linear-gradient(135deg, #e3f2fd, #bbdefb); - padding: 8rpx 16rpx; - border-radius: 12rpx; - display: inline-block; - min-width: 60rpx; - text-align: center; - } - } - - .description-text { - font-size: 24rpx; - color: #6c757d; - font-weight: 500; - } - } - } - } - - /* 鍙冲浐瀹氭偓娴垹闄ゅ垪 */ - .fixed-delete-column { - position: absolute; - top: 0; - right: 0; - width: 80rpx; - background: #ffffff; - border-left: 1rpx solid #dee2e6; - box-shadow: -4rpx 0 8rpx rgba(0, 0, 0, 0.05); - z-index: 10; - - .fixed-header { - height: 60rpx; - background: linear-gradient(135deg, #f8f9fa, #e9ecef); - display: flex; - align-items: center; - justify-content: center; - border-bottom: 1rpx solid #dee2e6; - - .fixed-header-text { - font-size: 26rpx; - color: #495057; - font-weight: 600; - } - } - - .fixed-content { - .fixed-delete-item { - height: 48rpx; - display: flex; - align-items: center; - justify-content: center; - border-bottom: 1rpx solid #dee2e6; - transition: background-color 0.2s ease; - - &.even { - background: #f8f9fa; - } - - &:hover { - background: #e3f2fd; - } - - &:last-child { - border-bottom: none; - } - } - } - } - } - - /* 鍒犻櫎鍥炬爣浼樺寲 */ - .delete-icon { - cursor: pointer; - color: #dc3545; - transition: all 0.3s ease; - padding: 12rpx; - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - min-width: 48rpx; - min-height: 48rpx; - - &:hover { - color: #c82333; - background: rgba(220, 53, 69, 0.1); - transform: scale(1.1); - } - - &:active { - transform: scale(0.95); - background: rgba(220, 53, 69, 0.2); - } - } - - /* 鎸夐挳浼樺寲 */ - .action-buttons-container { - display: flex; - justify-content: center; - margin-top: 48rpx; - padding: 0 24rpx; - - .plus-button { - width: 100%; - max-width: 600rpx; - height: 96rpx; - background: linear-gradient(135deg, #007bff, #0056b3); - border-radius: 48rpx; - display: flex; - justify-content: center; - align-items: center; - color: #ffffff; - font-size: 32rpx; - font-weight: 600; - box-shadow: 0 8rpx 24rpx rgba(0, 123, 255, 0.3); - transition: all 0.3s ease; - border: none; - position: relative; - overflow: hidden; - - &::before { - content: ""; - position: absolute; - top: 0; - left: -100%; - width: 100%; - height: 100%; - background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent); - transition: left 0.5s ease; - } - - &:active { - transform: scale(0.98); - box-shadow: 0 4rpx 12rpx rgba(0, 123, 255, 0.4); - - &::before { - left: 100%; - } - } - - &.submitting { - background: linear-gradient(135deg, #6c757d, #5a6268); - cursor: not-allowed; - - &::before { - display: none; - } - } - } - } - - /* 鏁伴噺鏄剧ず浼樺寲 */ - .form-group { - &:nth-child(5) .form-input { - font-weight: 600; - color: #007bff; - background: linear-gradient(135deg, #e3f2fd, #bbdefb); - border: 2rpx solid #007bff; - text-align: center; - } - } +.container { + padding: 24rpx; + background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%); + min-height: 100vh; + display: flex; + flex-direction: column; +} - /* 鎵爜杈撳叆妗嗘牱寮� */ - .input-with-scan { - display: flex; - align-items: center; - gap: 16rpx; - - .scan-input { - flex: 1; - } - - .scan-button { - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - padding: 16rpx 20rpx; - background: linear-gradient(135deg, #e3f2fd, #bbdefb); - border: 2rpx solid #007bff; - border-radius: 8rpx; - min-width: 120rpx; - height: 92rpx; - cursor: pointer; - transition: all 0.3s ease; - - &:hover { - background: linear-gradient(135deg, #bbdefb, #90caf9); - transform: translateY(-2rpx); - box-shadow: 0 4rpx 12rpx rgba(0, 123, 255, 0.2); - } - - &:active { - transform: translateY(0); - box-shadow: 0 2rpx 6rpx rgba(0, 123, 255, 0.3); - } - - .scan-text { - font-size: 22rpx; - color: #007bff; - font-weight: 600; - margin-top: 4rpx; - } - } - } +/* 鍗$墖閫氱敤鏍峰紡 */ +.card { + background: #ffffff; + border-radius: 12rpx; + box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08); + margin-bottom: 24rpx; + padding: 32rpx; + border: 1rpx solid #e9ecef; +} + +/* 琛ㄥ崟鍖哄煙 */ +.form-container { + .form-grid { + display: grid; + grid-template-columns: 1fr; + gap: 24rpx; + } + + .form-group { + display: flex; + flex-direction: column; + gap: 16rpx; + + .form-label { + font-size: 28rpx; + color: #495057; + font-weight: 600; + padding-left: 4rpx; + position: relative; + + &::after { + content: ""; + position: absolute; + left: 0; + bottom: -4rpx; + width: 24rpx; + height: 3rpx; + background: #007bff; + border-radius: 2rpx; + } + } + + .form-input { + height: 92rpx; + padding: 0 24rpx; + border: 2rpx solid #dee2e6; + border-radius: 8rpx; + font-size: 28rpx; + color: #212529; + background: #ffffff; + transition: all 0.3s ease; + + &[disabled] { + background: #f8f9fa; + color: #6c757d; + border-color: #e9ecef; + } + + &:focus { + border-color: #007bff; + box-shadow: 0 0 0 4rpx rgba(0, 123, 255, 0.1); + outline: none; + } + + &::placeholder { + color: #adb5bd; + } + } + } +} + +/* 琛ㄦ牸浼樺寲 */ +.table-container { + .table-header { + margin-bottom: 24rpx; + padding-bottom: 16rpx; + border-bottom: 2rpx solid #e9ecef; + display: flex; + justify-content: space-between; + align-items: center; + + .section-title { + font-size: 32rpx; + color: #212529; + font-weight: 700; + position: relative; + padding-left: 24rpx; + + &::before { + content: ""; + position: absolute; + left: 0; + top: 50%; + transform: translateY(-50%); + width: 4rpx; + height: 28rpx; + background: linear-gradient(135deg, #007bff, #0056b3); + border-radius: 2rpx; + } + } + + .table-tip { + .tip-text { + font-size: 22rpx; + color: #6c757d; + background: #f8f9fa; + padding: 8rpx 16rpx; + border-radius: 16rpx; + border: 1rpx solid #e9ecef; + } + } + } + + .table-wrapper { + position: relative; + border-radius: 8rpx; + overflow: hidden; + border: 1rpx solid #dee2e6; + display: flex; + } + + .table-scroll { + flex: 1; + overflow-x: auto; + white-space: nowrap; + } + + .custom-table { + border: none; + min-width: 780rpx; + + .table-header-row { + background: linear-gradient(135deg, #f8f9fa, #e9ecef); + + .th { + font-size: 26rpx; + color: #495057; + font-weight: 600; + padding: 0 8rpx; + height: 68rpx; + line-height: 68rpx; + background: transparent !important; + border-right: 1rpx solid #dee2e6; + white-space: nowrap; + min-width: 80rpx; + + &:last-child { + border-right: none; + } + } + } + + .table-row { + transition: background-color 0.2s ease; + + &:nth-child(even) { + background: #f8f9fa; + } + + &:hover { + background: #e3f2fd; + } + + .uni-td { + padding: 0 8rpx; + height: 68rpx; + border-color: #dee2e6 !important; + border-right: 1rpx solid #dee2e6; + white-space: nowrap; + min-width: 80rpx; + vertical-align: middle; + + &:last-child { + border-right: none; + } + + .cell-content { + font-size: 24rpx; + color: #495057; + line-height: 68rpx; + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; + display: flex; + align-items: center; + height: 68rpx; + + &.quantity { + font-weight: 600; + color: #007bff; + background: linear-gradient(135deg, #e3f2fd, #bbdefb); + padding: 8rpx 16rpx; + border-radius: 12rpx; + display: inline-block; + min-width: 60rpx; + text-align: center; + } + } + + .description-text { + font-size: 24rpx; + color: #6c757d; + font-weight: 500; + line-height: 68rpx; + display: flex; + align-items: center; + height: 68rpx; + } + } + } + } + + /* 鍙冲浐瀹氭偓娴垹闄ゅ垪 */ + + .fixed-delete-column { + flex-shrink: 0; + width: 100rpx; + background: #ffffff; + border-left: 1rpx solid #dee2e6; + box-shadow: -4rpx 0 8rpx rgba(0, 0, 0, 0.05); + + .fixed-header { + height: 68rpx; + background: linear-gradient(135deg, #f8f9fa, #e9ecef); + display: flex; + align-items: center; + justify-content: center; + border-bottom: 1rpx solid #dee2e6; + + .fixed-header-text { + font-size: 26rpx; + color: #495057; + font-weight: 600; + } + } + + .fixed-content { + .fixed-delete-item { + height: 68rpx; + display: flex; + align-items: center; + justify-content: center; + border-bottom: 1rpx solid #dee2e6; + transition: background-color 0.2s ease; + + &.even { + background: #f8f9fa; + } + + &:hover { + background: #e3f2fd; + } + + &:last-child { + border-bottom: none; + } + } + } + } +} + +/* 鍒犻櫎鍥炬爣浼樺寲 */ +.delete-icon { + cursor: pointer; + color: #dc3545; + transition: all 0.3s ease; + padding: 12rpx; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + min-width: 48rpx; + min-height: 48rpx; + + &:hover { + color: #c82333; + background: rgba(220, 53, 69, 0.1); + transform: scale(1.1); + } + + &:active { + transform: scale(0.95); + background: rgba(220, 53, 69, 0.2); + } +} + +/* 鎸夐挳浼樺寲 */ +.action-buttons-container { + display: flex; + justify-content: center; + margin-top: 48rpx; + padding: 0 24rpx; + + .plus-button { + width: 100%; + max-width: 600rpx; + height: 96rpx; + background: linear-gradient(135deg, #007bff, #0056b3); + border-radius: 12rpx; + border: 2rpx solid #007bff; + cursor: pointer; + display: flex; + justify-content: center; + align-items: center; + color: #ffffff; + font-size: 32rpx; + font-weight: 600; + box-shadow: 0 8rpx 24rpx rgba(0, 123, 255, 0.3); + transition: all 0.3s ease; + position: relative; + overflow: hidden; + text-align: center; + + /* 纭繚鎸夐挳鍙偣鍑� */ + -webkit-tap-highlight-color: transparent; + -webkit-user-select: none; + user-select: none; + + text { + color: #ffffff; + font-size: 32rpx; + font-weight: 600; + line-height: 1; + } + + &::before { + content: ""; + position: absolute; + top: 0; + left: -100%; + width: 100%; + height: 100%; + background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent); + transition: left 0.5s ease; + } + + &:active { + transform: scale(0.98); + box-shadow: 0 4rpx 12rpx rgba(0, 123, 255, 0.4); + + &::before { + left: 100%; + } + } + + &.submitting { + background: linear-gradient(135deg, #6c757d, #5a6268); + cursor: not-allowed; + + &::before { + display: none; + } + } + + /* 鎮仠鏁堟灉 */ + + &:hover:not(.submitting) { + background: linear-gradient(135deg, #0056b3, #004085); + border-color: #0056b3; + box-shadow: 0 12rpx 32rpx rgba(0, 123, 255, 0.4); + transform: translateY(-2rpx); + } + } +} + +/* 鏁伴噺鏄剧ず浼樺寲 */ +.form-group { + &:nth-child(5) .form-input { + font-weight: 600; + color: #007bff; + background: linear-gradient(135deg, #e3f2fd, #bbdefb); + border: 2rpx solid #007bff; + text-align: center; + } +} + +/* 鎵爜杈撳叆妗嗘牱寮� */ +.input-with-scan { + display: flex; + align-items: center; + gap: 16rpx; + + .scan-input { + flex: 1; + } + + .scan-button { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 16rpx 20rpx; + background: linear-gradient(135deg, #e3f2fd, #bbdefb); + border: 2rpx solid #007bff; + border-radius: 8rpx; + min-width: 120rpx; + height: 92rpx; + cursor: pointer; + transition: all 0.3s ease; + + &:hover { + background: linear-gradient(135deg, #bbdefb, #90caf9); + transform: translateY(-2rpx); + box-shadow: 0 4rpx 12rpx rgba(0, 123, 255, 0.2); + } + + &:active { + transform: translateY(0); + box-shadow: 0 2rpx 6rpx rgba(0, 123, 255, 0.3); + } + + .scan-text { + font-size: 22rpx; + color: #007bff; + font-weight: 600; + margin-top: 4rpx; + } + } +} + +/* 鎵嬫満绔搷搴斿紡浼樺寲 */ +@media (max-width: 768px) { + .container { + padding: 16rpx; + } + + .card { + padding: 24rpx; + margin-bottom: 16rpx; + } + + .form-container .form-grid { + grid-template-columns: 1fr; + gap: 20rpx; + } + + .form-group .form-label { + font-size: 26rpx; + } + + .form-group .form-input { + height: 84rpx; + font-size: 26rpx; + padding: 0 20rpx; + } + + .scan-button { + min-width: 100rpx !important; + height: 84rpx !important; + padding: 12rpx 16rpx !important; + + .scan-text { + font-size: 20rpx !important; + } + } + + .table-scroll { + flex: 1; + } + + .fixed-delete-column { + width: 80rpx; + flex-shrink: 0; + + .fixed-header { + height: 60rpx; + + .fixed-header-text { + font-size: 22rpx; + } + } + + .fixed-content .fixed-delete-item { + height: 60rpx; + } + } + + .custom-table { + .th { + font-size: 22rpx; + padding: 0 6rpx; + height: 60rpx; + line-height: 60rpx; + } + + .uni-td { + padding: 0 6rpx; + height: 60rpx; + + .cell-content { + font-size: 22rpx; + line-height: 60rpx; + height: 60rpx; + } + + .description-text { + line-height: 60rpx; + height: 60rpx; + } + } + } + + .delete-icon { + padding: 8rpx; + min-width: 40rpx; + min-height: 40rpx; + } + + .plus-button { + height: 88rpx; + font-size: 30rpx; + border-radius: 8rpx; + + text { + font-size: 30rpx; + color: #ffffff; + } + + &.submitting text { + color: #ffffff; + } + } +} + +/* 寮哄埗鎸夐挳鏍峰紡 - 瑙e喅鎵嬫満绔樉绀洪棶棰� */ +.plus-button { + background: #007bff !important; + background: linear-gradient(135deg, #007bff, #0056b3) !important; + border: 2rpx solid #007bff !important; + border-radius: 12rpx !important; + color: #ffffff !important; + font-size: 32rpx !important; + font-weight: 600 !important; + box-shadow: 0 8rpx 24rpx rgba(0, 123, 255, 0.3) !important; + width: 100% !important; + max-width: 600rpx !important; + height: 96rpx !important; + display: flex !important; + justify-content: center !important; + align-items: center !important; + text-align: center !important; +} + +.plus-button text { + color: #ffffff !important; + font-size: 32rpx !important; + font-weight: 600 !important; +} + +.plus-button.submitting { + background: #6c757d !important; + background: linear-gradient(135deg, #6c757d, #5a6268) !important; + border-color: #6c757d !important; +} + +.plus-button.submitting text { + color: #ffffff !important; +} + +/* 鎵嬫満绔寜閽己鍒舵牱寮� */ +@media (max-width: 768px) { + .plus-button { + background: #007bff !important; + background: linear-gradient(135deg, #007bff, #0056b3) !important; + border: 2rpx solid #007bff !important; + border-radius: 8rpx !important; + height: 88rpx !important; + font-size: 30rpx !important; + } + + .plus-button text { + color: #ffffff !important; + font-size: 30rpx !important; + font-weight: 600 !important; + } + + .plus-button.submitting text { + color: #ffffff !important; + font-size: 30rpx !important; + } +} </style> \ No newline at end of file diff --git a/pages/QC/OQC/detail.vue b/pages/QC/OQC/detail.vue index d1af774..c4582b3 100644 --- a/pages/QC/OQC/detail.vue +++ b/pages/QC/OQC/detail.vue @@ -1,828 +1,935 @@ <template> - <view class="page-container"> - <!-- 妫�楠岄」鐩〃鍗曞崱鐗� --> - <view class="form-card"> - <view class="form-title"> - <view class="title-icon">馃搵</view> - <span>妫�楠岄」鐩鎯�</span> - </view> - <view class="form-container"> - <!-- 鍩烘湰淇℃伅妯″潡 --> - <view class="form-section"> - <view class="section-title">鍩烘湰淇℃伅</view> - <view class="form-grid"> - <view class="form-group"> - <label class="form-label">椤圭洰鍚嶇О:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.fcheckItem" /> - </view> - <view class="form-group"> - <label class="form-label">瑙勬牸瑕佹眰:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.fspecRequ" /> - </view> - <view class="form-group"> - <label class="form-label">妫�楠屾柟娉�:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.inspectionMethod" /> - </view> - <view class="form-group"> - <label class="form-label">妫�楠屽伐鍏�:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.fcheckTool" /> - </view> - </view> - </view> + <view class="page-container"> + <!-- 妫�楠岄」鐩〃鍗曞崱鐗� --> + <view class="form-card"> + <view class="form-title"> + <view class="title-icon">馃搵</view> + <span>妫�楠岄」鐩鎯�</span> + </view> + <view class="form-container"> + <!-- 鍩烘湰淇℃伅妯″潡 --> + <view class="form-section"> + <view class="section-title">鍩烘湰淇℃伅</view> + <view class="form-grid"> + <view class="form-group"> + <label class="form-label">椤圭洰鍚嶇О:</label> + <input v-model="formData.fcheckItem" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">瑙勬牸瑕佹眰:</label> + <input v-model="formData.fspecRequ" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">妫�楠屾柟娉�:</label> + <input v-model="formData.inspectionMethod" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">妫�楠屽伐鍏�:</label> + <input v-model="formData.fcheckTool" class="form-input" disabled="true" type="text"/> + </view> + </view> + </view> - <!-- 涓変釜妯″潡骞跺垪瀹瑰櫒 --> - <view class="three-modules-container"> - <!-- 妫�楠屽弬鏁版ā鍧� --> - <view class="module-item"> - <view class="module-header"> - <text class="module-title">妫�楠屽弬鏁�</text> - </view> - <view class="module-content"> - <view class="form-grid"> - <view class="form-group"> - <label class="form-label">妫�楠屾暟:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.checkQyt" /> - </view> - <view class="form-group"> - <label class="form-label">妫�楠屾爣鍑嗙紪鐮�:</label> - <input class="form-input" disabled="true" type="text" - v-model="formData.sampleSizeNo" /> - </view> - <view class="form-group"> - <label class="form-label">妫�楠屾按骞�:</label> - <input class="form-input" disabled="true" type="text" - v-model="formData.fcheckLevel" /> - </view> - <view class="form-group"> - <label class="form-label">鎺ユ敹姘村钩:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.facLevel" /> - </view> - </view> - </view> - </view> + <!-- 涓変釜妯″潡骞跺垪瀹瑰櫒 --> + <view class="three-modules-container"> + <!-- 妫�楠屽弬鏁版ā鍧� --> + <view class="module-item"> + <view class="module-header"> + <text class="module-title">妫�楠屽弬鏁�</text> + </view> + <view class="module-content"> + <view class="form-grid"> + <view class="form-group"> + <label class="form-label">妫�楠屾暟:</label> + <input v-model="formData.checkQyt" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">妫�楠屾爣鍑嗙紪鐮�:</label> + <input v-model="formData.sampleSizeNo" class="form-input" disabled="true" + type="text"/> + </view> + <view class="form-group"> + <label class="form-label">妫�楠屾按骞�:</label> + <input v-model="formData.fcheckLevel" class="form-input" disabled="true" + type="text"/> + </view> + <view class="form-group"> + <label class="form-label">鎺ユ敹姘村钩:</label> + <input v-model="formData.facLevel" class="form-input" disabled="true" type="text"/> + </view> + </view> + </view> + </view> - <!-- 鏁板�兼爣鍑嗘ā鍧� --> - <view class="module-item"> - <view class="module-header"> - <text class="module-title">鏁板�兼爣鍑�</text> - </view> - <view class="module-content"> - <view class="form-grid"> - <view class="form-group"> - <label class="form-label">涓嬮檺:</label> - <input class="form-input" disabled="true" type="text" - v-model="formData.fdownAllow" /> - </view> - <view class="form-group"> - <label class="form-label">鏍囧噯鍊�:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.fstand" /> - </view> - <view class="form-group"> - <label class="form-label">涓婇檺:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.fupAllow" /> - </view> - </view> - </view> - </view> + <!-- 鏁板�兼爣鍑嗘ā鍧� --> + <view class="module-item"> + <view class="module-header"> + <text class="module-title">鏁板�兼爣鍑�</text> + </view> + <view class="module-content"> + <view class="form-grid"> + <view class="form-group"> + <label class="form-label">涓嬮檺:</label> + <input v-model="formData.fdownAllow" class="form-input" disabled="true" + type="text"/> + </view> + <view class="form-group"> + <label class="form-label">鏍囧噯鍊�:</label> + <input v-model="formData.fstand" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">涓婇檺:</label> + <input v-model="formData.fupAllow" class="form-input" disabled="true" type="text"/> + </view> + </view> + </view> + </view> - <!-- 鍒ゅ畾鏍囧噯妯″潡 --> - <view class="module-item"> - <view class="module-header"> - <text class="module-title">鍒ゅ畾鏍囧噯</text> - </view> - <view class="module-content"> - <view class="form-grid"> - <view class="form-group"> - <label class="form-label">AC鏁�:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.facQty" /> - </view> - <view class="form-group"> - <label class="form-label">RE鏁�:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.freQty" /> - </view> - <view class="form-group"> - <label class="form-label">涓嶅悎鏍兼暟:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.fngQty" /> - </view> - <view class="form-group"> - <label class="form-label">棰勮缁撴灉:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.fcheckResu" /> - </view> - </view> - </view> - </view> - </view> + <!-- 鍒ゅ畾鏍囧噯妯″潡 --> + <view class="module-item"> + <view class="module-header"> + <text class="module-title">鍒ゅ畾鏍囧噯</text> + </view> + <view class="module-content"> + <view class="form-grid"> + <view class="form-group"> + <label class="form-label">AC鏁�:</label> + <input v-model="formData.facQty" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">RE鏁�:</label> + <input v-model="formData.freQty" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">涓嶅悎鏍兼暟:</label> + <input v-model="formData.fngQty" class="form-input" disabled="true" type="text"/> + </view> + <view class="form-group"> + <label class="form-label">棰勮缁撴灉:</label> + <input v-model="formData.fcheckResu" class="form-input" disabled="true" type="text"/> + </view> + </view> + </view> + </view> + </view> - <!-- 澶囨敞淇℃伅妯″潡 --> - <!-- <view class="form-section"> - <view class="section-title">澶囨敞淇℃伅</view> - <view class="form-grid"> - <view class="form-group"> - <label class="form-label">涓嶅悎鏍兼弿杩�:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.remarks" /> - </view> - </view> - </view> --> + <!-- 澶囨敞淇℃伅妯″潡 --> + <!-- <view class="form-section"> + <view class="section-title">澶囨敞淇℃伅</view> + <view class="form-grid"> + <view class="form-group"> + <label class="form-label">涓嶅悎鏍兼弿杩�:</label> + <input class="form-input" disabled="true" type="text" v-model="formData.remarks" /> + </view> + </view> + </view> --> - <!-- 妫�娴嬬粨鏋滃尯鍩� --> - <view class="form-section"> - <view class="section-title">妫�娴嬬粨鏋�</view> - <view class="form-grid"> - <view class="form-group"> - <label class="form-label">妫�娴嬬粨鏋�:</label> - <input class="form-input" type="number" v-model="fcheckResuK" /> - </view> + <!-- 妫�娴嬬粨鏋滃尯鍩� --> + <view class="form-section"> + <view class="section-title">妫�娴嬬粨鏋�</view> + <view class="form-grid"> + <view class="form-group"> + <label class="form-label">妫�娴嬬粨鏋�:</label> + <input v-model="fcheckResuK" class="form-input" type="number"/> + </view> - <!-- 鎻愮ず璇嶄綔涓烘娴嬬粨鏋滅殑鎻愮ず --> - <view class="form-group tip-group"> - <view class="tip-box"> - <view class="tip-icon">鈿狅笍</view> - <view class="tip-text">娌℃湁鏈�澶у�煎拰鏈�灏忓�兼椂濉啓<span class="highlight">0锛堟湭閫氳繃妫�楠岋級</span>鎴�<span - class="highlight">1锛堥�氳繃妫�楠岋級</span></view> - </view> - </view> - </view> - </view> + <!-- 鎻愮ず璇嶄綔涓烘娴嬬粨鏋滅殑鎻愮ず --> + <view class="form-group tip-group"> + <view class="tip-box"> + <view class="tip-icon">鈿狅笍</view> + <view class="tip-text">娌℃湁鏈�澶у�煎拰鏈�灏忓�兼椂濉啓<span class="highlight">0锛堟湭閫氳繃妫�楠岋級</span>鎴�<span + class="highlight">1锛堥�氳繃妫�楠岋級</span></view> + </view> + </view> + </view> + </view> - <button :class="['action-btn', 'btn-primary', { 'btn-loading': isLoading }]" - v-if="tableData.length < formData.checkQyt" @click="submit" :disabled="isLoading"> - {{ isLoading ? '淇濆瓨涓�...' : '淇濆瓨' }} - </button> - </view> - </view> + <button v-if="tableData.length < formData.checkQyt" + :class="['action-btn', 'btn-primary', { 'btn-loading': isLoading }]" :disabled="isLoading" @click="submit"> + {{ isLoading ? '淇濆瓨涓�...' : '淇濆瓨' }} + </button> + </view> + </view> - <!-- 妫�楠岀粨鏋滆〃鏍煎崱鐗� --> - <view class="table-card"> - <view class="table-title"> - <view class="title-icon">馃搳</view> - <span>妫�楠岀粨鏋滃垪琛�</span> - </view> - <view class="list-container"> - <uni-table ref="table" border emptyText="鏆傛棤鏇村鏁版嵁"> - <uni-tr> - <uni-th width="80" align="center" class="th">缂栧彿</uni-th> - <uni-th width="120" align="center" class="th">鍒ゅ畾鏍囪瘑</uni-th> - <uni-th width="100" align="center" class="th">妫�楠岀粨鏋�</uni-th> - <uni-th width="120" align="center" class="th">鎿嶄綔</uni-th> - </uni-tr> - <uni-tr v-for="(item, index) in tableData" :key="index" class="table-row" - :class="{ 'hover-effect': isHoveringRow === index }" @mouseenter="isHoveringRow = index" - @mouseleave="isHoveringRow = -1"> - <uni-td align="center"> - {{ index + 1 }} - </uni-td> - <uni-td align="center"> - <input class="form-input" disabled="true" type="text" v-model="item.fstand" /> - </uni-td> - <uni-td align="center"> - <span class="result-badge" - :class="{ 'pass': item.fcheckResu === 'OK', 'fail': item.fcheckResu === 'NG' }"> + <!-- 妫�楠岀粨鏋滆〃鏍煎崱鐗� --> + <view class="table-card"> + <view class="table-title"> + <view class="title-icon">馃搳</view> + <span>妫�楠岀粨鏋滃垪琛�</span> + </view> + <view class="list-container"> + <uni-table ref="table" border emptyText="鏆傛棤鏇村鏁版嵁"> + <uni-tr> + <uni-th align="center" class="th" width="80">缂栧彿</uni-th> + <uni-th align="center" class="th" width="120">鍒ゅ畾鏍囪瘑</uni-th> + <uni-th align="center" class="th" width="100">妫�楠岀粨鏋�</uni-th> + <uni-th align="center" class="th" width="120">鎿嶄綔</uni-th> + </uni-tr> + <uni-tr v-for="(item, index) in tableData" :key="index" :class="{ 'hover-effect': isHoveringRow === index }" + class="table-row" @mouseenter="isHoveringRow = index" + @mouseleave="isHoveringRow = -1"> + <uni-td align="center"> + {{ index + 1 }} + </uni-td> + <uni-td align="center"> + <input v-model="item.fstand" class="form-input" disabled="true" type="text"/> + </uni-td> + <uni-td align="center"> + <span :class="{ 'pass': item.fcheckResu === 'OK', 'fail': item.fcheckResu === 'NG' }" + class="result-badge"> {{ item.fcheckResu || '鏈楠�' }} </span> - </uni-td> - <uni-td align="center"> - <view class="action-group"> - <button :class="['action-btn', 'btn-sm', 'btn-warn', { 'btn-disabled': isLoading }]" - v-if="isNumber" @click="toDetail(item)" :disabled="isLoading"> - {{ isLoading ? '澶勭悊涓�...' : '淇敼' }} - </button> - <button :class="['action-btn', 'btn-sm', 'btn-warn', { 'btn-disabled': isLoading }]" - v-if="!isNumber" @click="numberEdit(item)" :disabled="isLoading"> - {{ isLoading ? '澶勭悊涓�...' : editResult(item.fcheckResu) }} - </button> - </view> - </uni-td> - </uni-tr> - </uni-table> - </view> - </view> + </uni-td> + <uni-td align="center"> + <view class="action-group"> + <button v-if="isNumber" + :class="['action-btn', 'btn-sm', 'btn-warn', { 'btn-disabled': isLoading }]" :disabled="isLoading" @click="toDetail(item)"> + {{ isLoading ? '澶勭悊涓�...' : '淇敼' }} + </button> + <button v-if="!isNumber" + :class="['action-btn', 'btn-sm', 'btn-warn', { 'btn-disabled': isLoading }]" :disabled="isLoading" @click="numberEdit(item)"> + {{ isLoading ? '澶勭悊涓�...' : editResult(item.fcheckResu) }} + </button> + </view> + </uni-td> + </uni-tr> + </uni-table> + </view> + </view> - <!-- 鎿嶄綔鎸夐挳 --> - <view class="action-buttons"> - <view class="button-group"> - <button :class="['action-btn', 'btn-warn', { 'btn-disabled': isLoading }]" @click="saveRemarks" - :disabled="isLoading"> - {{ isLoading ? '澶勭悊涓�...' : '娣诲姞涓嶅悎鏍兼弿杩�' }} - </button> - </view> - </view> + <!-- 鎿嶄綔鎸夐挳 --> + <view class="action-buttons"> + <view class="button-group"> + <button :class="['action-btn', 'btn-warn', { 'btn-disabled': isLoading }]" :disabled="isLoading" + @click="saveRemarks"> + {{ isLoading ? '澶勭悊涓�...' : '娣诲姞涓嶅悎鏍兼弿杩�' }} + </button> + </view> + </view> - <!-- 淇敼妫�楠岀粨鏋滃脊鍑哄眰 --> - <view v-if="showPopup" class="overlay active"> - <view class="popup" :class="{ 'popup-scale': isPopupAnimated }" @animationend="isPopupAnimated = false"> - <view class="popup-header"> - <h3 class="popup-title">淇敼妫�楠岀粨鏋�</h3> - <view class="close-btn" @click="showPopup = !showPopup">脳</view> - </view> - <form :modelValue="editData"> - <view class="form-group"> - <label class="form-label">妫�楠岀粨鏋�:</label> - <input class="form-input" type="text" v-model="editData.fcheckResu" /> - </view> - <view class="button-group"> - <button :class="['action-btn', 'btn-warn', { 'btn-loading': isEditLoading }]" @click="eidt" - :disabled="isEditLoading"> - {{ isEditLoading ? '淇敼涓�...' : '淇敼' }} - </button> - <button @click="showPopup = !showPopup"> - 鍙栨秷 - </button> - </view> - </form> - </view> - </view> + <!-- 淇敼妫�楠岀粨鏋滃脊鍑哄眰 --> + <view v-if="showPopup" class="overlay active"> + <view :class="{ 'popup-scale': isPopupAnimated }" class="popup" @animationend="isPopupAnimated = false"> + <view class="popup-header"> + <h3 class="popup-title">淇敼妫�楠岀粨鏋�</h3> + <view class="close-btn" @click="showPopup = !showPopup">脳</view> + </view> + <form :modelValue="editData"> + <view class="form-group"> + <label class="form-label">妫�楠岀粨鏋�:</label> + <input v-model="editData.fcheckResu" class="form-input" type="text"/> + </view> + <view class="button-group"> + <button :class="['action-btn', 'btn-warn', { 'btn-loading': isEditLoading }]" :disabled="isEditLoading" + @click="eidt"> + {{ isEditLoading ? '淇敼涓�...' : '淇敼' }} + </button> + <button @click="showPopup = !showPopup"> + 鍙栨秷 + </button> + </view> + </form> + </view> + </view> - <!-- 淇敼涓嶅悎鏍兼弿杩板脊鍑哄眰 --> - <view v-if="remarksPopup" class="overlay active"> - <view class="popup" :class="{ 'popup-scale': isPopupAnimated }" @animationend="isPopupAnimated = false"> - <view class="popup-header"> - <h3 class="popup-title">淇敼涓嶅悎鏍兼弿杩�</h3> - <view class="close-btn" @click="remarksPopup = !remarksPopup">脳</view> - </view> - <form> - <view class="form-group"> - <label class="form-label">涓嶅悎鏍兼弿杩�:</label> - <input class="form-input" type="text" v-model="remarks" /> - </view> - <view class="button-group"> - <button :class="['action-btn', 'btn-warn', { 'btn-loading': isRemarksLoading }]" - @click="editRemarks" :disabled="isRemarksLoading"> - {{ isRemarksLoading ? '淇濆瓨涓�...' : '淇敼' }} - </button> - <button @click="remarksPopup = !remarksPopup"> - 鍙栨秷 - </button> - </view> - </form> - </view> - </view> - </view> + <!-- 淇敼涓嶅悎鏍兼弿杩板脊鍑哄眰 --> + <view v-if="remarksPopup" class="overlay active"> + <view :class="{ 'popup-scale': isPopupAnimated }" class="popup" @animationend="isPopupAnimated = false"> + <view class="popup-header"> + <h3 class="popup-title">淇敼涓嶅悎鏍兼弿杩�</h3> + <view class="close-btn" @click="remarksPopup = !remarksPopup">脳</view> + </view> + <form> + <view class="form-group"> + <label class="form-label">涓嶅悎鏍兼弿杩�:</label> + <input v-model="remarks" class="form-input" type="text"/> + </view> + <view class="button-group"> + <button :class="['action-btn', 'btn-warn', { 'btn-loading': isRemarksLoading }]" + :disabled="isRemarksLoading" @click="editRemarks"> + {{ isRemarksLoading ? '淇濆瓨涓�...' : '淇敼' }} + </button> + <button @click="remarksPopup = !remarksPopup"> + 鍙栨秷 + </button> + </view> + </form> + </view> + </view> + </view> </template> <script> - export default { - data() { - return { - formData: {}, - releaseNo: "", - isNumber: false, - checkItem: "", - id: 0, - gid: 0, - billNo: "", - showPopup: false, - editData: {}, - tableData: [], - remarks: "", - remarksPopup: false, - fcheckResuK: "", - isLoading: false, - isEditLoading: false, - isRemarksLoading: false, - isHoveringRow: -1, - isPopupAnimated: false - }; - }, - methods: { - editResult(fcheckResu) { - if (fcheckResu == "OK") { - return "鏀逛负涓嶅悎鏍�"; - } else { - return "鏀逛负鍚堟牸"; - } - }, - submit() { - this.isLoading = true; - let count = this.formData.checkQyt; - let fstand = "鈭�"; - if (Number(this.formData.fupAllow) && Number(this.formData.fdownAllow)) { - if (!this.fcheckResuK) { - this.$showMessage("璇疯緭鍏ユ楠屽��"); - this.isLoading = false; - return; - } - if ( - Number(this.fcheckResuK) >= Number(this.formData.fdownAllow) && - Number(this.fcheckResuK) <= Number(this.formData.fupAllow) - ) { - fstand = "鈭�"; - } else { - fstand = "脳"; - } - count = 1; - } else { - if (!this.fcheckResuK) { - this.formData.fcheckResu = 1; - } - if (this.fcheckResuK == 0 || this.fcheckResuK == 1) { - this.formData.isPass = this.fcheckResuK; - } else { - this.$showMessage("鏃犳爣鍑嗗�兼椂锛屾楠岀粨鏋滃彧鑳戒负0鎴�1!"); - this.isLoading = false; - return; - } - count = count - this.tableData.length; - } - this.formData.updater = this.$loginInfo.account; - this.$post({ - url: "/LLJ/SetQSItemDetail", - data: { - mainId: this.formData.id, - releaseNo: this.formData.releaseNo, - fstand: fstand, - fcheckResu: this.fcheckResuK, - LastupdateBy: this.$loginInfo.account, - count: count - } - }).then((res) => { - this.formData.fcheckResu = null; - this.$showMessage("淇濆瓨鎴愬姛"); - this.refreshResult(); - this.isLoading = false; - }).catch(() => { - this.$showMessage("淇濆瓨澶辫触锛岃閲嶈瘯"); - this.isLoading = false; - }); - }, - refreshResult() { - this.isLoading = true; - this.$post({ - url: "/MesOqcItemsDetect02/getXjDetail02ById", - data: { - id: this.id - } - }).then((res) => { - this.formData = res.data.tbBillList.itemXj01; - this.tableData = res.data.tbBillList.itemXj02s; - - if (this.formData.fupAllow && this.formData.fdownAllow && this.formData.fstand) { - this.isNumber = true; - } else { - this.isNumber = false; - } - this.isLoading = false; - }).catch(() => { - this.$showMessage("鑾峰彇鏁版嵁澶辫触"); - this.isLoading = false; - }); - }, - toDetail(item) { - this.showPopup = true; - this.editData = { - ...item - }; - }, - eidt() { - this.isEditLoading = true; - if (!this.editData.fcheckResu) { - this.$showMessage("璇疯緭鍏ユ楠岀粨鏋�"); - this.isEditLoading = false; - return; - } - if (this.formData.fcheckResu == this.editData.fcheckResu) { - this.$showMessage("淇敼鎴愬姛"); - this.showPopup = false; - this.isEditLoading = false; - return; - } - let fstand = "鈭�"; - if (this.formData.fupAllow && this.formData.fdownAllow) { - if (!this.editData.fcheckResu) { - this.$showMessage("璇疯緭鍏ユ楠屽��"); - this.isEditLoading = false; - return; - } - if ( - Number(this.editData.fcheckResu) >= Number(this.formData.fdownAllow) && - Number(this.editData.fcheckResu) <= Number(this.formData.fupAllow) - ) { - this.editData.isPass = 1; - fstand = "鈭�"; - } else { - this.editData.isPass = 0; - fstand = "脳"; - } - } else { - if (!this.editData.fcheckResu) { - this.editData.fcheckResu = 1; - } - if (this.editData.fcheckResu == 0 || this.editData.fcheckResu == 1) { - if (this.editData.fcheckResu == 0) { - fstand = "脳"; - } - } else { - this.$showMessage("鏃犳爣鍑嗗�兼椂锛屾楠岀粨鏋滃彧鑳戒负0鎴�1!"); - this.isEditLoading = false; - return; - } - } - this.editData.updater = this.$loginInfo.account; - this.$post({ - url: "/MesOqcItemsDetect02/UpdateQSItemDetail", - data: { - id: this.editData.id, - mainId: this.formData.id, - releaseNo: this.formData.releaseNo, - fstand: fstand, - fcheckResu: this.editData.fcheckResu, - lastupdateBy: this.$loginInfo.account - } - }).then((res) => { - this.showPopup = false; - this.$showMessage("淇敼鎴愬姛"); - this.refreshResult(); - this.isEditLoading = false; - }).catch(() => { - this.$showMessage("淇敼澶辫触锛岃閲嶈瘯"); - this.isEditLoading = false; - }); - }, - numberEdit(item) { - this.isLoading = true; - let fstand = "鈭�"; - let fcheckResu = "OK"; - if (item.fcheckResu == "OK") { - fstand = "脳"; - fcheckResu = "NG"; - } - this.$post({ - url: "/MesOqcItemsDetect02/UpdateQSItemDetail", - data: { - id: item.id, - mainId: this.formData.id, - releaseNo: this.formData.releaseNo, - fstand: fstand, - fcheckResu: fcheckResu, - lastupdateBy: this.$loginInfo.account - } - }).then((res) => { - this.$showMessage("淇敼鎴愬姛"); - this.refreshResult(); - this.isLoading = false; - }).catch(() => { - this.$showMessage("淇敼澶辫触锛岃閲嶈瘯"); - this.isLoading = false; - }); - }, - saveRemarks() { - this.remarksPopup = true; - this.remarks = this.formData.remarks || ""; - }, - editRemarks() { - this.isRemarksLoading = true; - if (this.remarks) { - this.$post({ - url: "/MesOqcItemsDetect02/saveRemarksPid", - data: { - pid: this.formData.id, - remarks: this.remarks - } - }).then((res) => { - if (res.data.tbBillList > 0) { - this.formData.remarks = this.remarks; - this.remarksPopup = false; - this.$showMessage("淇濆瓨鎴愬姛"); - } else { - this.$showMessage("淇濆瓨澶辫触"); - } - this.isRemarksLoading = false; - }).catch(() => { - this.$showMessage("淇濆瓨澶辫触锛岃閲嶈瘯"); - this.isRemarksLoading = false; - }); - } else { - this.$showMessage("璇疯緭鍏ヤ笉鍚堟牸鎻忚堪"); - this.isRemarksLoading = false; - } - } - }, - onLoad(options) { - let params = options; - this.id = params["mainId"]; - this.releaseNo = params["releaseNo"]; - this.refreshResult(); - } - }; +export default { + data() { + return { + formData: {}, + releaseNo: "", + isNumber: false, + checkItem: "", + id: 0, + gid: 0, + billNo: "", + showPopup: false, + editData: {}, + tableData: [], + remarks: "", + remarksPopup: false, + fcheckResuK: "", + isLoading: false, + isEditLoading: false, + isRemarksLoading: false, + isHoveringRow: -1, + isPopupAnimated: false + }; + }, + methods: { + editResult(fcheckResu) { + if (fcheckResu == "OK") { + return "鏀逛负涓嶅悎鏍�"; + } else { + return "鏀逛负鍚堟牸"; + } + }, + submit() { + this.isLoading = true; + let count = this.formData.checkQyt; + let fstand = "鈭�"; + if (Number(this.formData.fupAllow) && Number(this.formData.fdownAllow)) { + if (!this.fcheckResuK) { + this.$showMessage("璇疯緭鍏ユ楠屽��"); + this.isLoading = false; + return; + } + if ( + Number(this.fcheckResuK) >= Number(this.formData.fdownAllow) && + Number(this.fcheckResuK) <= Number(this.formData.fupAllow) + ) { + fstand = "鈭�"; + } else { + fstand = "脳"; + } + count = 1; + } else { + if (!this.fcheckResuK) { + this.formData.fcheckResu = 1; + } + if (this.fcheckResuK == 0 || this.fcheckResuK == 1) { + this.formData.isPass = this.fcheckResuK; + } else { + this.$showMessage("鏃犳爣鍑嗗�兼椂锛屾楠岀粨鏋滃彧鑳戒负0鎴�1!"); + this.isLoading = false; + return; + } + count = count - this.tableData.length; + } + this.formData.updater = this.$loginInfo.account; + this.$post({ + url: "/LLJ/SetQSItemDetail", + data: { + mainId: this.formData.id, + releaseNo: this.formData.releaseNo, + fstand: fstand, + fcheckResu: this.fcheckResuK, + LastupdateBy: this.$loginInfo.account, + count: count + } + }).then((res) => { + this.formData.fcheckResu = null; + this.$showMessage("淇濆瓨鎴愬姛"); + this.refreshResult(); + this.isLoading = false; + }).catch(() => { + this.$showMessage("淇濆瓨澶辫触锛岃閲嶈瘯"); + this.isLoading = false; + }); + }, + refreshResult() { + this.isLoading = true; + this.$post({ + url: "/MesOqcItemsDetect02/getXjDetail02ById", + data: { + id: this.id + } + }).then((res) => { + this.formData = res.data.tbBillList.itemXj01; + this.tableData = res.data.tbBillList.itemXj02s; + + if (this.formData.fupAllow && this.formData.fdownAllow && this.formData.fstand) { + this.isNumber = true; + } else { + this.isNumber = false; + } + this.isLoading = false; + }).catch(() => { + this.$showMessage("鑾峰彇鏁版嵁澶辫触"); + this.isLoading = false; + }); + }, + toDetail(item) { + this.showPopup = true; + this.editData = { + ...item + }; + }, + eidt() { + this.isEditLoading = true; + if (!this.editData.fcheckResu) { + this.$showMessage("璇疯緭鍏ユ楠岀粨鏋�"); + this.isEditLoading = false; + return; + } + if (this.formData.fcheckResu == this.editData.fcheckResu) { + this.$showMessage("淇敼鎴愬姛"); + this.showPopup = false; + this.isEditLoading = false; + return; + } + let fstand = "鈭�"; + if (this.formData.fupAllow && this.formData.fdownAllow) { + if (!this.editData.fcheckResu) { + this.$showMessage("璇疯緭鍏ユ楠屽��"); + this.isEditLoading = false; + return; + } + if ( + Number(this.editData.fcheckResu) >= Number(this.formData.fdownAllow) && + Number(this.editData.fcheckResu) <= Number(this.formData.fupAllow) + ) { + this.editData.isPass = 1; + fstand = "鈭�"; + } else { + this.editData.isPass = 0; + fstand = "脳"; + } + } else { + if (!this.editData.fcheckResu) { + this.editData.fcheckResu = 1; + } + if (this.editData.fcheckResu == 0 || this.editData.fcheckResu == 1) { + if (this.editData.fcheckResu == 0) { + fstand = "脳"; + } + } else { + this.$showMessage("鏃犳爣鍑嗗�兼椂锛屾楠岀粨鏋滃彧鑳戒负0鎴�1!"); + this.isEditLoading = false; + return; + } + } + this.editData.updater = this.$loginInfo.account; + this.$post({ + url: "/MesOqcItemsDetect02/UpdateQSItemDetail", + data: { + id: this.editData.id, + mainId: this.formData.id, + releaseNo: this.formData.releaseNo, + fstand: fstand, + fcheckResu: this.editData.fcheckResu, + lastupdateBy: this.$loginInfo.account + } + }).then((res) => { + this.showPopup = false; + this.$showMessage("淇敼鎴愬姛"); + this.refreshResult(); + this.isEditLoading = false; + }).catch(() => { + this.$showMessage("淇敼澶辫触锛岃閲嶈瘯"); + this.isEditLoading = false; + }); + }, + numberEdit(item) { + this.isLoading = true; + let fstand = "鈭�"; + let fcheckResu = "OK"; + if (item.fcheckResu == "OK") { + fstand = "脳"; + fcheckResu = "NG"; + } + this.$post({ + url: "/MesOqcItemsDetect02/UpdateQSItemDetail", + data: { + id: item.id, + mainId: this.formData.id, + releaseNo: this.formData.releaseNo, + fstand: fstand, + fcheckResu: fcheckResu, + lastupdateBy: this.$loginInfo.account + } + }).then((res) => { + this.$showMessage("淇敼鎴愬姛"); + this.refreshResult(); + this.isLoading = false; + }).catch(() => { + this.$showMessage("淇敼澶辫触锛岃閲嶈瘯"); + this.isLoading = false; + }); + }, + saveRemarks() { + this.remarksPopup = true; + this.remarks = this.formData.remarks || ""; + }, + editRemarks() { + this.isRemarksLoading = true; + if (this.remarks) { + this.$post({ + url: "/MesOqcItemsDetect02/saveRemarksPid", + data: { + pid: this.formData.id, + remarks: this.remarks + } + }).then((res) => { + if (res.data.tbBillList > 0) { + this.formData.remarks = this.remarks; + this.remarksPopup = false; + this.$showMessage("淇濆瓨鎴愬姛"); + } else { + this.$showMessage("淇濆瓨澶辫触"); + } + this.isRemarksLoading = false; + }).catch(() => { + this.$showMessage("淇濆瓨澶辫触锛岃閲嶈瘯"); + this.isRemarksLoading = false; + }); + } else { + this.$showMessage("璇疯緭鍏ヤ笉鍚堟牸鎻忚堪"); + this.isRemarksLoading = false; + } + } + }, + onLoad(options) { + let params = options; + this.id = params["mainId"]; + this.releaseNo = params["releaseNo"]; + this.refreshResult(); + } +}; </script> <style> - /* 椤甸潰瀹瑰櫒 */ - .page-container { - padding: 20px; - background-color: #f5f5f5; - min-height: 100vh; - } +/* 椤甸潰瀹瑰櫒 */ +.page-container { + padding: 20px; + background-color: #f5f5f5; + min-height: 100vh; +} - /* 琛ㄥ崟鍗$墖 */ - .form-card { - background-color: #fff; - border-radius: 12px; - padding: 20px; - margin-bottom: 20px; - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); - } +/* 琛ㄥ崟鍗$墖 */ +.form-card { + background-color: #fff; + border-radius: 12px; + padding: 20px; + margin-bottom: 20px; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); +} - /* 琛ㄥ崟鏍囬 */ - .form-title { - display: flex; - align-items: center; - font-size: 18px; - color: #333; - margin-bottom: 15px; - } +/* 琛ㄥ崟鏍囬 */ +.form-title { + display: flex; + align-items: center; + font-size: 18px; + color: #333; + margin-bottom: 15px; +} - .title-icon { - font-size: 22px; - margin-right: 10px; - } +.title-icon { + font-size: 22px; + margin-right: 10px; +} - /* 琛ㄥ崟瀹瑰櫒 */ - .form-container { - padding-top: 10px; - } +/* 琛ㄥ崟瀹瑰櫒 */ +.form-container { + padding-top: 10px; +} - /* 琛ㄥ崟妯″潡鏍囬 */ - .form-section { - margin-bottom: 20px; - } +/* 琛ㄥ崟妯″潡鏍囬 */ +.form-section { + margin-bottom: 20px; +} - .section-title { - font-size: 16px; - font-weight: 600; - color: #333; - margin-bottom: 10px; - } +.section-title { + font-size: 16px; + font-weight: 600; + color: #333; + margin-bottom: 10px; +} - /* 琛ㄦ牸甯冨眬 */ - .form-grid { - display: grid; - grid-template-columns: 1fr 1fr; - gap: 15px; - } +/* 琛ㄦ牸甯冨眬 */ +.form-grid { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 15px; +} - /* 琛ㄥ崟椤� */ - .form-group { - display: flex; - align-items: center; - } +/* 琛ㄥ崟椤� */ +.form-group { + display: flex; + align-items: center; +} - .form-label { - width: 130px; - color: #333; - font-size: 14px; - font-weight: 500; - } +.form-label { + width: 130px; + color: #333; + font-size: 14px; + font-weight: 500; +} - .form-input { - flex: 1; - height: 40px; - padding: 0 10px; - border: 1px solid #e0e0e0; - border-radius: 8px; - background-color: #f8f8f8; - color: #666; - font-size: 14px; - } +.form-input { + flex: 1; + height: 40px; + padding: 0 10px; + border: 1px solid #e0e0e0; + border-radius: 8px; + background-color: #f8f8f8; + color: #666; + font-size: 14px; +} - .form-input:disabled { - background-color: #e9e9e9; - } +.form-input:disabled { + background-color: #e9e9e9; +} - .form-input:focus { - border-color: #007AFF; - outline: none; - } +.form-input:focus { + border-color: #007AFF; + outline: none; +} - /* 妫�楠岀粨鏋滃尯鍩� */ - .tip-group { - margin-top: 15px; - } +/* 妫�楠岀粨鏋滃尯鍩� */ +.tip-group { + margin-top: 15px; +} - .tip-box { - display: flex; - align-items: center; - background-color: #fff5d1; - padding: 10px; - border-radius: 8px; - border: 1px solid #f0e0a7; - } +.tip-box { + display: flex; + align-items: center; + background-color: #fff5d1; + padding: 10px; + border-radius: 8px; + border: 1px solid #f0e0a7; +} - .tip-icon { - font-size: 20px; - color: #f39c12; - margin-right: 10px; - } +.tip-icon { + font-size: 20px; + color: #f39c12; + margin-right: 10px; +} - .tip-text { - font-size: 14px; - color: #333; - } +.tip-text { + font-size: 14px; + color: #333; +} - .highlight { - color: #007AFF; - font-weight: 600; - } +.highlight { + color: #007AFF; + font-weight: 600; +} - /* 鎸夐挳鏍峰紡 */ - .action-btn { - width: 100%; - padding: 12px; - border-radius: 8px; - border: none; - color: #fff; - font-size: 16px; - font-weight: 500; - display: flex; - align-items: center; - justify-content: center; - cursor: pointer; - transition: background-color 0.3s ease; - } +/* 鎸夐挳鏍峰紡 */ +.action-btn { + width: 100%; + padding: 12px; + border-radius: 8px; + border: none; + color: #fff; + font-size: 16px; + font-weight: 500; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + transition: background-color 0.3s ease; +} - .btn-primary { - background-color: #007AFF; - } +.btn-primary { + background-color: #007AFF; +} - .btn-primary:hover { - background-color: #0056CC; - } +.btn-primary:hover { + background-color: #0056CC; +} - .btn-warn { - background-color: #f1b344; - } +.btn-warn { + background-color: #f1b344; +} - .btn-warn:hover { - background-color: #e6a135; - } +.btn-warn:hover { + background-color: #e6a135; +} - .btn-disabled { - background-color: #c0c0c0; - cursor: not-allowed; - } +.btn-disabled { + background-color: #c0c0c0; + cursor: not-allowed; +} - /* 寮瑰嚭灞傛牱寮� */ - .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; - z-index: 1000; - opacity: 0; - transition: opacity 0.3s ease; - } +/* 寮瑰嚭灞傛牱寮� */ +.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; + z-index: 1000; + opacity: 0; + transition: opacity 0.3s ease; +} - .overlay.active { - opacity: 1; - } +.overlay.active { + opacity: 1; +} - .popup { - background-color: #fff; - border-radius: 12px; - width: 90%; - max-width: 500px; - padding: 20px; - transform: scale(0.8); - transition: transform 0.3s ease; - } +.popup { + background-color: #fff; + border-radius: 12px; + width: 90%; + max-width: 500px; + padding: 20px; + transform: scale(0.8); + transition: transform 0.3s ease; +} - .popup-scale { - transform: scale(1); - } +.popup-scale { + transform: scale(1); +} - .popup-header { - display: flex; - justify-content: space-between; - align-items: center; - } +.popup-header { + display: flex; + justify-content: space-between; + align-items: center; +} - .popup-title { - font-size: 16px; - font-weight: 600; - color: #333; - } +.popup-title { + font-size: 16px; + font-weight: 600; + color: #333; +} - .close-btn { - font-size: 20px; - color: #333; - cursor: pointer; - } +.close-btn { + font-size: 20px; + color: #333; + cursor: pointer; +} - /* 鎿嶄綔鎸夐挳缁� */ - .button-group { - display: flex; - justify-content: space-between; - margin-top: 20px; - } +/* 鎿嶄綔鎸夐挳缁� */ +.button-group { + display: flex; + justify-content: space-between; + margin-top: 20px; +} - .button-group button { - width: 48%; - padding: 10px; - border-radius: 8px; - border: none; - font-size: 14px; - font-weight: 500; - cursor: pointer; - } +.button-group button { + width: 48%; + padding: 10px; + border-radius: 8px; + border: none; + font-size: 14px; + font-weight: 500; + cursor: pointer; +} - /* 妫�楠岀粨鏋滆〃鏍煎崱鐗� */ - .table-card { - background-color: #fff; - border-radius: 12px; - padding: 20px; - margin-bottom: 20px; - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); - } +/* 妫�楠岀粨鏋滆〃鏍煎崱鐗� */ +.table-card { + background-color: #fff; + border-radius: 12px; + padding: 20px; + margin-bottom: 20px; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); +} - /* 琛ㄦ牸鏍囬 */ - .table-title { - display: flex; - align-items: center; - font-size: 16px; - color: #333; - font-weight: 600; - margin-bottom: 15px; - } +/* 琛ㄦ牸鏍囬 */ +.table-title { + display: flex; + align-items: center; + font-size: 16px; + color: #333; + font-weight: 600; + margin-bottom: 15px; +} - .title-icon { - font-size: 22px; - margin-right: 10px; - } +.title-icon { + font-size: 22px; + margin-right: 10px; +} - /* 琛ㄦ牸鏍峰紡 */ - .uni-table { - width: 100%; - border-collapse: collapse; - } +/* 琛ㄦ牸鏍峰紡 */ +.uni-table { + width: 100%; + border-collapse: collapse; +} - .uni-th, - .uni-td { - padding: 12px; - text-align: center; - } +.uni-th, +.uni-td { + padding: 12px; + text-align: center; +} - .uni-th { - background-color: #f5f5f5; - font-size: 14px; - color: #666; - font-weight: 500; - } +.uni-th { + background-color: #f5f5f5; + font-size: 14px; + color: #666; + font-weight: 500; +} - .table-row { - background-color: #fff; - border-bottom: 1px solid #e0e0e0; - } +.table-row { + background-color: #fff; + border-bottom: 1px solid #e0e0e0; +} - .table-row:hover { - background-color: #f9f9f9; - } +.table-row:hover { + background-color: #f9f9f9; +} - .result-badge { - padding: 5px 12px; - font-size: 12px; - border-radius: 10px; - color: #fff; - display: inline-block; - } +.result-badge { + padding: 5px 12px; + font-size: 12px; + border-radius: 10px; + color: #fff; + display: inline-block; +} - .pass { - background-color: #28a745; - } +.pass { + background-color: #28a745; +} - .fail { - background-color: #dc3545; - } +.fail { + background-color: #dc3545; +} - .pending { - background-color: #f1b344; - } +.pending { + background-color: #f1b344; +} - .action-group { - display: flex; - gap: 10px; - } +.action-group { + display: flex; + gap: 10px; +} - .action-btn.btn-sm { - width: auto; - padding: 6px 12px; - font-size: 12px; - } +.action-btn.btn-sm { + width: auto; + padding: 6px 12px; + font-size: 12px; +} - /* 鎻愮ず淇℃伅 */ - .hover-effect:hover { - background-color: #f9f9f9; - } +/* 鎻愮ず淇℃伅 */ +.hover-effect:hover { + background-color: #f9f9f9; +} - .btn-sm { - font-size: 14px; - } +.btn-sm { + font-size: 14px; +} - .btn-loading { - background-color: #c0c0c0; - cursor: not-allowed; - } +.btn-loading { + background-color: #c0c0c0; + cursor: not-allowed; +} + +/* 涓変釜妯″潡骞跺垪瀹瑰櫒鏍峰紡 */ +.three-modules-container { + display: flex; + flex-direction: column; + gap: 15px; + margin-bottom: 20px; +} + +/* 妯″潡椤规牱寮� */ +.module-item { + background-color: #f8f9fa; + border-radius: 8px; + padding: 15px; + border: 1px solid #e0e0e0; +} + +.module-header { + border-bottom: 1px solid #d0d0d0; + padding-bottom: 8px; + margin-bottom: 12px; +} + +.module-title { + font-size: 15px; + font-weight: 600; + color: #333; +} + +/* 鎵嬫満灞忓箷浼樺寲 */ +@media (max-width: 768px) { + .page-container { + padding: 10px; + } + + .form-card, .table-card { + padding: 15px; + border-radius: 8px; + } + + .form-grid { + grid-template-columns: 1fr; + gap: 12px; + } + + .form-group { + flex-direction: column; + align-items: flex-start; + } + + .form-label { + width: auto; + margin-bottom: 5px; + font-size: 13px; + } + + .form-input { + width: 100%; + height: 36px; + font-size: 13px; + } + + .three-modules-container { + gap: 12px; + } + + .module-item { + padding: 12px; + } + + .module-title { + font-size: 14px; + } + + .tip-box { + padding: 8px; + } + + .tip-text { + font-size: 13px; + } +} + +/* 瓒呭皬灞忓箷浼樺寲 */ +@media (max-width: 480px) { + .page-container { + padding: 8px; + } + + .form-card, .table-card { + padding: 12px; + } + + .form-input { + height: 34px; + font-size: 12px; + } + + .form-label { + font-size: 12px; + } + + .action-btn { + padding: 10px; + font-size: 14px; + } +} </style> \ No newline at end of file -- Gitblit v1.9.3