From ab826d12b52265bc4f25044d43a042df2104f972 Mon Sep 17 00:00:00 2001 From: kyy <3283105747@qq.com> Date: 星期一, 14 七月 2025 21:34:10 +0800 Subject: [PATCH] 最新代码 --- pages/QC/LLJ/detail.vue | 1060 ++++++++++++++++++++++++++++++++++++++++++---------------- 1 files changed, 768 insertions(+), 292 deletions(-) diff --git a/pages/QC/LLJ/detail.vue b/pages/QC/LLJ/detail.vue index 6987513..ea1fff8 100644 --- a/pages/QC/LLJ/detail.vue +++ b/pages/QC/LLJ/detail.vue @@ -1,143 +1,245 @@ <template> - <view> - <view class="form-container"> - <form :modelValue="formData"> - <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 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 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 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.result"/> - </view> - <view class="form-group"> - <label class="form-label">涓嶅悎鏍兼弿杩�:</label> - <input class="form-input" disabled="true" type="text" v-model="formData.remarks"/> - </view> - <view class="form-group edit"> - <input class="form-input" style="color: red" disabled="true" type="text" - value="娌℃湁鏈�澶у�煎拰鏈�灏忓�兼椂濉啓0锛堟湭閫氳繃妫�楠岋級鎴�1锛堥�氳繃妫�楠岋級"/> - </view> - <view class="form-group edit"> - <label class="form-label">妫�娴嬬粨鏋�:</label> - <!-- <input class="form-input" type="number" v-model="formData.fcheckResu"/>--> - <input class="form-input" type="number" v-model="fcheckResuK" /> - </view> - <button type="primary" v-if="tableData.length < formData.checkQyt" @click="submit">淇濆瓨</button> - </form> - </view> - <view> - <img v-if="isShowImg" :src="base64Image" style="width:100%" @click="previewImage"/> - </view> - <view class="list-container"> - <uni-table ref="table" border emptyText="鏆傛棤鏇村鏁版嵁"> - <uni-tr> - <uni-th align="center" style="color: #FFFFFF;background-color: lightskyblue;">缂栧彿</uni-th> - <uni-th align="center" style="color: #FFFFFF;background-color: lightskyblue;">鍒ゅ畾鏍囪瘑</uni-th> - <uni-th align="center" style="color: #FFFFFF;background-color: lightskyblue;">妫�楠岀粨鏋�</uni-th> - <uni-th width="150" align="center"style="color: #FFFFFF;background-color: lightskyblue;">淇敼 </uni-th> - </uni-tr> - <uni-tr v-for="(item, index) in tableData" :key="index"> - <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"> - <input class="form-input" disabled="true" type="text" v-model="item.fcheckResu"/> - </uni-td> - <uni-td> - <view class="uni-group"> - <button type="warn" v-if="isNumber" @click="toDetail(item)">淇敼</button> - <button type="warn" v-if="!isNumber" @click="numberEdit(item)">{{ editResult(item.fcheckResu) }}</button> + <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> - </uni-td> - </uni-tr> - </uni-table> + <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="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="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">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.result" /> + </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" type="number" v-model="fcheckResuK" /> + </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> - <view class="plus-button"> - <button type="warn" @click="saveRemarks">娣诲姞涓嶅悎鏍兼弿杩�</button> + <!-- 妫�楠岀粨鏋滆〃鏍煎崱鐗� --> + <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' }"> + {{ 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> - <view v-if="showPopup" class="overlay"> - <view class="popup"> - <h3>淇敼妫�楠岀粨鏋�</h3> + <!-- 鎿嶄綔鎸夐挳 --> + <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 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"/> + <input class="form-input" type="text" v-model="editData.fcheckResu" /> </view> - <button type="warn" @click="eidt">淇敼</button> - <button @click="showPopup = !showPopup">鍙栨秷</button> + <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="remarksPopup" class="overlay"> - <view class="popup"> - <h3>淇敼涓嶅悎鏍兼弿杩�</h3> + <!-- 淇敼涓嶅悎鏍兼弿杩板脊鍑哄眰 --> + <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"/> + <input class="form-input" type="text" v-model="remarks" /> </view> - <button type="warn" @click="editRemarks">淇敼</button> - <button @click="remarksPopup = !remarksPopup">鍙栨秷</button> + <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> @@ -145,7 +247,6 @@ </template> <script> - export default { data() { return { @@ -158,306 +259,583 @@ showPopup: false, editData: {}, tableData: [], - isShowImg: false, - base64Image:"", remarks: "", remarksPopup: false, - fcheckResuK:'', - - } + fcheckResuK: "", + isLoading: false, + isEditLoading: false, + isRemarksLoading: false, + isHoveringRow: -1, + isPopupAnimated: false + }; }, methods: { - - previewImage() { - uni.previewImage({ - urls: [this.base64Image], - }); - }, - editResult(fcheckResu) { - if (fcheckResu == 'OK') { + if (fcheckResu == "OK") { return "鏀逛负涓嶅悎鏍�"; } else { return "鏀逛负鍚堟牸"; } }, submit() { - + this.isLoading = true; let count = this.formData.checkQyt; let fstand = "鈭�"; - // alert(this.fcheckResuK); - //鏈夋渶澶у�煎拰鏈�灏忓�煎氨鏍规嵁鏄惁绗﹀悎鏍囧噯鍊兼洿鏂板垽瀹氱粨鏋滐紝娌℃湁鏈�澶у�煎拰鏈�灏忓�煎氨鏍规嵁鏄惁閫氳繃妫�楠屽垽瀹氱粨鏋� - if (Number(this.formData.fupAllow )&& Number(this.formData.fdownAllow)) { - - /*if (!this.formData.fcheckResu) { + if (Number(this.formData.fupAllow) && Number(this.formData.fdownAllow)) { + if (!this.fcheckResuK) { this.$showMessage("璇疯緭鍏ユ楠屽��"); - return; - }*/ - if (!this.fcheckResuK) { - this.$showMessage("璇疯緭鍏ユ楠屽��"); + this.isLoading = false; return; } -//console.log(Number(this.fcheckResuK) >= Number(this.formData.fdownAllow) && Number(this.fcheckResuK) <= Number(this.formData.fupAllow)); - if (Number(this.fcheckResuK) >= Number(this.formData.fdownAllow) && Number(this.fcheckResuK) <= Number(this.formData.fupAllow)){ - fstand = "鈭�" + if ( + Number(this.fcheckResuK) >= Number(this.formData.fdownAllow) && + Number(this.fcheckResuK) <= Number(this.formData.fupAllow) + ) { + fstand = "鈭�"; } else { fstand = "脳"; } count = 1; - //alert(fstand); } else { - - /* if (!this.formData.fcheckResu) { - this.formData.fcheckResu = 1 + if (!this.fcheckResuK) { + this.formData.fcheckResu = 1; } - - if (this.formData.fcheckResu == 0 || this.formData.fcheckResu == 1) { - this.formData.isPass = this.formData.fcheckResu + if (this.fcheckResuK == 0 || this.fcheckResuK == 1) { + this.formData.isPass = this.fcheckResuK; } else { this.$showMessage("鏃犳爣鍑嗗�兼椂锛屾楠岀粨鏋滃彧鑳戒负0鎴�1!"); + this.isLoading = false; return; - }*/ - - if (!this.fcheckResuK) { - this.formData.fcheckResu = 1 - } - - if (this.fcheckResuK == 0 || this.fcheckResuK == 1) { - this.formData.isPass = this.fcheckResuK - } else { - this.$showMessage("鏃犳爣鍑嗗�兼椂锛屾楠岀粨鏋滃彧鑳戒负0鎴�1!"); - 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,//this.formData.fcheckResu, - LastupdateBy:this.$loginInfo.account, + fcheckResu: this.fcheckResuK, + LastupdateBy: this.$loginInfo.account, count: count } - }).then(res => { + }).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: "/LLJ/getXjDetail02ById", data: { id: this.id } - }).then(res => { + }).then((res) => { this.formData = res.data.tbBillList.itemXj01; - this.tableData = res.data.tbBillList.itemXj02s; - - if (this.formData.imageData) { - this.isShowImg = true; - this.base64Image = 'data:image/jpeg;base64,' + this.formData.imageData; - } - - //fupAllow fdownAllow standardValue 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 = !this.showPopup; - this.editData = item; + this.showPopup = true; + this.editData = { ...item }; }, eidt() { - + this.isEditLoading = true; if (!this.editData.fcheckResu) { this.$showMessage("璇疯緭鍏ユ楠岀粨鏋�"); - } - - if (this.formData.fcheckResu == 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; } -console.log(Number(this.editData.fcheckResu) >= Number(this.formData.fdownAllow) && Number(this.editData.fcheckResu) <= Number(this.formData.fupAllow)) - if (Number(this.editData.fcheckResu) >= Number(this.formData.fdownAllow) && Number(this.editData.fcheckResu) <= Number(this.formData.fupAllow)) { - this.editData.isPass = 1 - fstand = "鈭�"; - + 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 + this.editData.isPass = 0; fstand = "脳"; } - - //alert(fstand + this.formData.fdownAllow + this.formData.fupAllow + this.editData.fcheckResu ); } else { - if (!this.editData.fcheckResu) { - this.editData.fcheckResu = 1 + 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: "/LLJ/UpdateQSItemDetail", data: { - // mainId: this.editData.id, - //releaseNo: this.editData.releaseNo, - // fstand: fstand, - // fcheckResu: this.editData.fcheckResu, - - id: this.editData.id, - mainId: this.formData.id, - releaseNo: this.formData.releaseNo, - fstand: fstand, - fcheckResu: this.editData.fcheckResu, - lastupdateBy: this.$loginInfo.account, + 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 = !this.showPopup; + }).then((res) => { + this.showPopup = false; this.$showMessage("淇敼鎴愬姛"); - this.refreshResult(); //鍒锋柊椤甸潰 - }) + 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') { + if (item.fcheckResu == "OK") { fstand = "脳"; fcheckResu = "NG"; } - this.$post({ url: "/LLJ/UpdateQSItemDetail", data: { - // mainId: item.id, - //releaseNo: this.editData.releaseNo, - // fstand: fstand, - // fcheckResu: fcheckResu, - // updateBy: this.$loginInfo.account, - id: item.id, - mainId: this.formData.id, - releaseNo: this.formData.releaseNo, - fstand: fstand, - fcheckResu: fcheckResu, - lastupdateBy: this.$loginInfo.account, + id: item.id, + mainId: this.formData.id, + releaseNo: this.formData.releaseNo, + fstand: fstand, + fcheckResu: fcheckResu, + lastupdateBy: this.$loginInfo.account } - }).then(res => { + }).then((res) => { this.$showMessage("淇敼鎴愬姛"); - this.refreshResult(); //鍒锋柊椤甸潰 - }) + this.refreshResult(); + this.isLoading = false; + }).catch(() => { + this.$showMessage("淇敼澶辫触锛岃閲嶈瘯"); + this.isLoading = false; + }); }, saveRemarks() { - this.remarksPopup = !this.remarksPopup; - this.remarks = this.formData.remarks; + this.remarksPopup = true; + this.remarks = this.formData.remarks || ""; }, editRemarks() { + this.isRemarksLoading = true; if (this.remarks) { - //saveRemarksGid this.$post({ url: "/LLJ/saveRemarksPid", data: { pid: this.formData.id, remarks: this.remarks } - }).then(res => { - if(res.data.tbBillList > 0){ + }).then((res) => { + if (res.data.tbBillList > 0) { this.formData.remarks = this.remarks; - this.remarksPopup = !this.remarksPopup; + 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) { - //options涓寘鍚簡url闄勫甫鐨勫弬鏁� let params = options; - this.id = params["mainId"]; - - this.refreshResult(); } -} +}; </script> <style> -.form-group { +/* 鍩虹閰嶈壊鏂规 */ +:root { + --primary-color: #3b82f6; + --primary-dark: #2563eb; + --primary-light: #bfdbfe; + --success-color: #10b981; + --warning-color: #f59e0b; + --danger-color: #ef4444; + --text-primary: #1e293b; + --text-secondary: #64748b; + --text-tertiary: #94a3b8; + --bg-primary: #f8fafc; + --bg-secondary: #e2e8f0; + --card-bg: #ffffff; + --border-color: #e2e8f0; + --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05); + --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); + --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); +} + +/* 椤甸潰鏁翠綋鏍峰紡 */ +.page-container { + padding: 4px; /* 椤甸潰鍐呰竟璺濊繘涓�姝ョ缉灏� */ + background-color: var(--bg-primary); + min-height: 100vh; + display: flex; + flex-direction: column; +} + +/* 鍗$墖鏍峰紡 */ +.form-card, .table-card { + background-color: var(--card-bg); + border-radius: 8px; /* 鍦嗚杩涗竴姝ョ缉灏� */ + box-shadow: var(--shadow-md); + margin-bottom: 4px; /* 鍗$墖闂磋窛杩涗竴姝ョ缉灏� */ + overflow: hidden; + transition: transform 0.3s, box-shadow 0.3s; +} + +.form-card:hover, .table-card:hover { + transform: translateY(-1px); /* 鎮仠鏁堟灉鍑忓急 */ + box-shadow: var(--shadow-lg); +} + +.form-title, .table-title { + background: linear-gradient(90deg, var(--primary-color), var(--primary-dark)); + padding: 4px 8px; /* 鏍囬鍐呰竟璺濊繘涓�姝ョ缉灏� */ + font-size: 14px; /* 鏍囬瀛椾綋杩涗竴姝ョ缉灏� */ + font-weight: 600; + color: white; display: flex; align-items: center; - border: 1px solid #c9c9c9; - background-color: #d4d4d4; +} + +.title-icon { + margin-right: 4px; /* 鍥炬爣闂磋窛杩涗竴姝ョ缉灏� */ + font-size: 16px; /* 鍥炬爣澶у皬杩涗竴姝ョ缉灏� */ +} + +/* 琛ㄥ崟鏍峰紡 */ +.form-container { + padding: 4px 8px; /* 瀹瑰櫒鍐呰竟璺濊繘涓�姝ョ缉灏� */ +} + +/* 涓夋ā鍧楀苟鍒楀鍣� */ +.three-modules-container { + display: flex; /* 浣跨敤Flex甯冨眬瀹炵幇骞跺垪 */ + gap: 4px; /* 妯″潡闂撮棿璺� */ + margin-bottom: 6px; + flex-wrap: wrap; /* 鍏佽鎹㈣ */ +} + +.module-item { + flex: 1; /* 骞冲潎鍒嗛厤瀹藉害 */ + min-width: 0; + border-radius: 6px; + background-color: #f8fafc; + border: 1px solid var(--border-color); + overflow: hidden; +} + +.module-header { + background-color: var(--primary-light); + padding: 6px 10px; + display: flex; + align-items: center; +} + +.module-title { + font-size: 13px; /* 妯″潡鏍囬瀛椾綋杩涗竴姝ョ缉灏� */ + font-weight: 600; + color: var(--text-primary); +} + +.module-content { + padding: 6px 8px; /* 妯″潡鍐呭鍐呰竟璺� */ +} + +/* 琛ㄥ崟妯″潡鏍峰紡 */ +.form-section { + margin-bottom: 6px; + padding: 8px; + border-radius: 6px; + background-color: #f8fafc; + border: 1px solid var(--border-color); + transition: all 0.3s; + position: relative; +} + +.form-section::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 2px; + background-color: var(--primary-color); +} + +.form-section:hover { + box-shadow: 0 1px 4px rgba(59, 130, 246, 0.1); /* 鎮仠闃村奖杩涗竴姝ョ缉灏� */ + transform: translateY(-1px); + border-color: rgba(59, 130, 246, 0.15); +} + +.section-title { + font-size: 14px; /* 妯″潡鏍囬瀛椾綋杩涗竴姝ョ缉灏� */ + font-weight: 700; + color: var(--text-primary); + margin-bottom: 4px; + padding-left: 8px; + border-left: 2px solid var(--primary-color); /* 宸︿晶鏉″搴︾缉灏� */ + display: flex; + align-items: center; + letter-spacing: 0.2px; /* 瀛楅棿璺濊繘涓�姝ョ缉灏� */ +} + +.section-title::after { + content: ''; + flex: 1; + height: 1px; + background-color: var(--border-color); + margin-left: 8px; +} + +.form-grid { + display: grid; + grid-template-columns: 1fr; + gap: 2px; /* 琛ㄥ崟椤归棿璺濊繘涓�姝ョ缉灏� */ +} + +.form-group { + display: flex; + align-items: flex-start; + border-bottom: 1px solid var(--border-color); + padding: 3px 0; /* 琛ㄥ崟椤瑰唴杈硅窛杩涗竴姝ョ缉灏� */ +} + +.form-group:last-child { + border-bottom: none; } .form-label { - margin-bottom: 0; - padding: 5px; + width: 80px; /* 鏍囩瀹藉害杩涗竴姝ョ缉灏� */ + color: var(--text-secondary); + font-size: 12px; /* 鏍囩瀛椾綋杩涗竴姝ョ缉灏� */ + font-weight: 500; + margin-top: 1px; + white-space: nowrap; } .form-input { flex: 1; - margin-bottom: 0; - padding: 5px; + font-size: 12px; /* 杈撳叆妗嗗瓧浣撹繘涓�姝ョ缉灏� */ + color: var(--text-primary); + border: none; + outline: none; + background-color: transparent; + padding: 2px 0; /* 杈撳叆妗嗗唴杈硅窛杩涗竴姝ョ缉灏� */ } -/* 榛樿鏍峰紡 */ +.form-input:focus { + color: var(--primary-color); +} + +/* 鎻愮ず璇嶆牱寮� */ +.tip-group { + border: none; + padding: 1px 0 2px; /* 鎻愮ず璇嶅尯鍩熷唴杈硅窛杩涗竴姝ョ缉灏� */ + margin-top: -2px; /* 椤堕儴杈硅窛杩涗竴姝ョ缉灏� */ +} + +.tip-box { + display: flex; + align-items: flex-start; + background-color: rgba(239, 68, 68, 0.08); + border-radius: 3px; /* 鍦嗚杩涗竴姝ョ缉灏� */ + padding: 4px 6px; /* 鎻愮ず璇嶆鍐呰竟璺濊繘涓�姝ョ缉灏� */ + border-left: 3px solid var(--danger-color); /* 宸︿晶鏉″搴﹁繘涓�姝ョ缉灏� */ + box-shadow: 0 1px 2px rgba(239, 68, 68, 0.03); /* 闃村奖杩涗竴姝ョ缉灏� */ +} + +.tip-icon { + font-size: 12px; /* 鍥炬爣澶у皬杩涗竴姝ョ缉灏� */ + color: #ef4444; + margin-right: 4px; /* 鍥炬爣涓庢枃鏈棿璺濊繘涓�姝ョ缉灏� */ + margin-top: 1px; +} + +.tip-text { + color: #4b5563; + font-size: 12px; /* 鎻愮ず鏂囧瓧浣撹繘涓�姝ョ缉灏� */ + line-height: 1.3; /* 琛岄珮杩涗竴姝ョ缉灏� */ +} + +.highlight { + color: #ef4444; + font-weight: 600; + text-decoration: underline; +} + +/* 琛ㄦ牸鏍峰紡 */ .list-container { - height: calc(100vh - 750px); - /* 璁剧疆鍒楄〃瀹瑰櫒鐨勯珮搴︿负鍓╀綑绌洪棿锛屽苟鍑忓幓琛ㄥ崟瀹瑰櫒鐨勯珮搴� */ - overflow-y: auto; - /* 鍏佽鍒楄〃瀹瑰櫒鍨傜洿婊氬姩 */ - padding: 10px; - /* 鍙�夛細娣诲姞涓�浜涘唴杈硅窛锛屼娇鍒楄〃鍐呭鏇寸編瑙� */ + padding: 4px 8px; /* 琛ㄦ牸瀹瑰櫒鍐呰竟璺濊繘涓�姝ョ缉灏� */ } -/* 鍦ㄥ皬灞忓箷璁惧涓婏紝閲嶇疆楂樺害涓洪�傚簲灞忓箷 */ -@media (max-width: 768px) { - .list-container { - height: calc(100vh - 485px); - /* 閫傚綋璋冩暣楂樺害 */ - } +.th { + background-color: var(--primary-color); + color: white; + font-weight: 600; + font-size: 12px; /* 琛ㄥご瀛椾綋杩涗竴姝ョ缉灏� */ + padding: 4px 6px; /* 琛ㄥご鍐呰竟璺濊繘涓�姝ョ缉灏� */ + text-transform: uppercase; + letter-spacing: 0.2px; } -.form-container { - /* 璁剧疆琛ㄥ崟瀹瑰櫒鐨勯珮搴︼紝浣垮叾鍙互婊氬姩 */ - overflow-y: auto; - /* 鍏佽琛ㄥ崟瀹瑰櫒鍨傜洿婊氬姩 */ - padding: 10px; - /* 鍙�夛細娣诲姞涓�浜涘唴杈硅窛锛屼娇琛ㄥ崟鍐呭鏇寸編瑙� */ +.table-row { + transition: background-color 0.2s, transform 0.2s; } +.hover-effect { + background-color: var(--primary-light) !important; + transform: translateY(-0.5px); +} + +.result-badge { + padding: 1px 4px; /* 缁撴灉鏍囩鍐呰竟璺濊繘涓�姝ョ缉灏� */ + border-radius: 3px; /* 鍦嗚杩涗竴姝ョ缉灏� */ + font-size: 11px; /* 缁撴灉鏍囩瀛椾綋杩涗竴姝ョ缉灏� */ + font-weight: 500; + display: inline-block; + min-width: 30px; /* 鏈�灏忓搴﹁繘涓�姝ョ缉灏� */ + text-align: center; +} + +.pass { + background-color: rgba(16, 185, 129, 0.1); + color: var(--success-color); + border: 1px solid rgba(16, 185, 129, 0.2); +} + +.fail { + background-color: rgba(239, 68, 68, 0.1); + color: var(--danger-color); + border: 1px solid rgba(239, 68, 68, 0.2); +} + +/* 鎸夐挳鏍峰紡 */ +.action-buttons { + display: flex; + flex-direction: column; + gap: 2px; /* 鎸夐挳缁勯棿璺濊繘涓�姝ョ缉灏� */ + padding: 0 0 4px; /* 搴曢儴杈硅窛杩涗竴姝ョ缉灏� */ +} + +.button-group { + width: 100%; +} + +.action-btn { + width: 100%; + height: 28px; /* 鎸夐挳楂樺害杩涗竴姝ョ缉灏� */ + line-height: 28px; + border-radius: 5px; /* 鍦嗚杩涗竴姝ョ缉灏� */ + font-size: 12px; /* 鎸夐挳瀛椾綋杩涗竴姝ョ缉灏� */ + font-weight: 500; + transition: all 0.2s; + display: flex; + align-items: center; + justify-content: center; + border: none; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03); /* 闃村奖杩涗竴姝ョ缉灏� */ +} + +/* 鎸夐挳鑳屾櫙娓愬彉 */ +.btn-primary { + background: linear-gradient(135deg, var(--primary-color), var(--primary-dark)); + color: white; +} + +.btn-primary:hover { + background: linear-gradient(135deg, var(--primary-dark), var(--primary-color)); + transform: translateY(-0.5px); /* 鎮仠浣嶇Щ杩涗竴姝ョ缉灏� */ + box-shadow: 0 2px 4px rgba(59, 130, 246, 0.08); +} + +.btn-primary:active { + transform: translateY(0); + box-shadow: 0 1px 2px rgba(59, 130, 246, 0.1); +} + +.btn-warn { + background: linear-gradient(135deg, var(--warning-color), #d97706); + color: white; +} + +.btn-warn:hover { + background: linear-gradient(135deg, #d97706, var(--warning-color)); + transform: translateY(-0.5px); + box-shadow: 0 2px 4px rgba(245, 158, 11, 0.08); +} + +.btn-warn:active { + transform: translateY(0); + box-shadow: 0 1px 2px rgba(245, 158, 11, 0.1); +} + +.btn-loading { + opacity: 0.8; + cursor: progress; +} + +.btn-disabled { + background-color: #e2e8f0 !important; + color: #94a3b8 !important; + cursor: not-allowed !important; + box-shadow: none !important; +} + +.btn-sm { + padding: 1px 4px; /* 灏忔寜閽唴杈硅窛杩涗竴姝ョ缉灏� */ + font-size: 10px; /* 灏忔寜閽瓧浣撹繘涓�姝ョ缉灏� */ + height: 20px; /* 灏忔寜閽珮搴﹁繘涓�姝ョ缉灏� */ + line-height: 20px; + border-radius: 3px; /* 鍦嗚杩涗竴姝ョ缉灏� */ +} + +/* 寮瑰嚭灞傛牱寮� */ .overlay { position: fixed; top: 0; @@ -468,20 +846,118 @@ display: flex; justify-content: center; align-items: center; + z-index: 1000; + opacity: 0; + visibility: hidden; + transition: opacity 0.3s, visibility 0.3s; +} + +.overlay.active { + opacity: 1; + visibility: visible; } .popup { - background-color: #fff; - padding: 20px; - border: 1px solid #ccc; - box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); - width: 68vw; - /* 璁剧疆瀹藉害涓鸿鍙e搴︾殑80% */ - height: 25vh; - /* 璁剧疆楂樺害涓鸿鍙i珮搴︾殑80% */ + background-color: var(--card-bg); + border-radius: 8px; + padding: 10px; /* 寮瑰嚭灞傚唴杈硅窛杩涗竴姝ョ缉灏� */ + box-shadow: var(--shadow-lg); + width: 90%; + max-width: 380px; /* 鏈�澶у搴﹁繘涓�姝ョ缉灏� */ + transform: scale(0.95); + transition: transform 0.3s, opacity 0.3s; + opacity: 0; + position: relative; + overflow: hidden; } -.edit { - background-color: white; +.overlay.active .popup { + transform: scale(1); + opacity: 1; +} + +.popup-header { + display: flex; + justify-content: space-between; + align-items: center; + margin-bottom: 8px; /* 鏍囬涓庡唴瀹归棿璺濊繘涓�姝ョ缉灏� */ + position: relative; +} + +.popup-title { + font-size: 16px; /* 寮瑰嚭灞傛爣棰樺瓧浣撹繘涓�姝ョ缉灏� */ + font-weight: 700; + color: var(--text-primary); + padding-bottom: 4px; /* 搴曢儴鍐呰竟璺濊繘涓�姝ョ缉灏� */ + border-bottom: 1px solid var(--border-color); + width: 100%; + text-align: center; + letter-spacing: 0.2px; +} + +.close-btn { + font-size: 18px; /* 鍏抽棴鎸夐挳澶у皬杩涗竴姝ョ缉灏� */ + color: var(--text-tertiary); + cursor: pointer; + position: absolute; + top: -1px; + right: 0; +} + +/* 鍝嶅簲寮忚璁� - 灏忓睆骞曚笅妯″潡鍫嗗彔 */ +@media (max-width: 640px) { + .three-modules-container { + flex-direction: column; /* 灏忓睆骞曚笅鏀逛负鍨傜洿鎺掑垪 */ + } + + .module-item { + margin-bottom: 4px; + } +} + +@media (max-width: 480px) { + .form-label { + width: 70px; + font-size: 11px; /* 瓒呭皬灞忓箷瀛椾綋杩涗竴姝ョ缉灏� */ + } + + .form-input { + font-size: 11px; + } + + .action-btn { + height: 26px; + line-height: 26px; + font-size: 11px; + } + + .form-container, .list-container { + padding: 3px 6px; + } + + .form-title, .table-title { + padding: 3px 6px; + font-size: 13px; + } + + .section-title { + font-size: 13px; + } + + .th { + font-size: 11px; + padding: 3px 4px; + } + + .result-badge { + padding: 1px 3px; + font-size: 10px; /* 瓒呭皬灞忓箷缁撴灉鏍囩瀛椾綋杩涗竴姝ョ缉灏� */ + } + + .btn-sm { + height: 18px; + line-height: 18px; + font-size: 9px; + } } </style> \ No newline at end of file -- Gitblit v1.9.3