From 816ab1967ee766e3e3f3631c08371f2e7704408e Mon Sep 17 00:00:00 2001
From: xwt <2740516069@qq.com>
Date: 星期三, 24 九月 2025 16:48:39 +0800
Subject: [PATCH] IQC穴数，RKJ,SJ,XJ
---
pages/QC/SJ/Add.vue | 517 +++++++++++++++++++++++++++++++++-----------------------
1 files changed, 304 insertions(+), 213 deletions(-)
diff --git a/pages/QC/SJ/Add.vue b/pages/QC/SJ/Add.vue
index 4659047..558fd68 100644
--- a/pages/QC/SJ/Add.vue
+++ b/pages/QC/SJ/Add.vue
@@ -74,8 +74,8 @@
</view>
<!-- 妫�楠岄」鐩〃鏍� -->
- <view class="inspection-table" v-if="tableData.length > 0">
- <table>
+ <view class="inspection-table">
+ <table v-if="tableData.length > 0">
<thead>
<tr>
<th width="20%" style="text-align: center;">妫�楠岄」鐩�</th>
@@ -106,6 +106,12 @@
</tr>
</tbody>
</table>
+ <!-- 绌虹姸鎬佹樉绀� -->
+ <view v-else class="empty-state">
+ <view class="empty-icon">馃搵</view>
+ <view class="empty-text">鏆傛棤妫�楠岄」鐩�</view>
+ <view class="empty-desc">璇ユ楠屽崟杩樻病鏈夋楠岄」鐩�</view>
+ </view>
</view>
<!-- 琛ㄥ崟涓婃柟鎿嶄綔鎸夐挳鍖� -->
<view class="top-action-buttons">
@@ -386,7 +392,10 @@
});
if (this.tableData.length <= 0) {
- this.isShowTable = true;
+ this.isShowTable = true; // 娌℃湁妫�楠岄」鐩椂鏄剧ず鐢熸垚鎸夐挳
+ } else {
+ this.isShowTable = false; // 鏈夋楠岄」鐩椂鐩存帴杩涘叆濉啓闃舵
+ this.isUpdate = false; // 璁剧疆涓洪潪鏇存柊鐘舵�侊紝鍙互鐩存帴濉啓
}
})
}
@@ -476,10 +485,14 @@
if (res.data.tbBillList.length > 0) {
this.tableData = res.data.tbBillList; // 鍦ㄧ澶村嚱鏁颁腑锛宼his 鎸囧悜澶栧眰浣滅敤鍩熺殑 this
this.isSubmit = false;
+ // 娉ㄦ剰锛氳繖閲屼笉鑷姩淇濆瓨锛屽洜涓鸿繕娌℃湁鍒涘缓妫�楠屽崟锛岄渶瑕佸厛璋冪敤save()鍒涘缓妫�楠屽崟
+ this.isShowTable = false; // 鐩存帴杩涘叆濉啓闃舵
+ this.isUpdate = false; // 璁剧疆涓洪潪鏇存柊鐘舵�侊紝鍙互鐩存帴濉啓
} else {
this.$showMessage("姝ょ墿鏂欐病鏈夊惎鐢ㄧ殑妫�楠岄」鐩紝璇风淮鎶�!");
this.isSubmit = true;
this.tableData = [];
+ this.isShowTable = true; // 娌℃湁妫�楠岄」鐩椂鏄剧ず鐢熸垚鎸夐挳
}
});
@@ -509,8 +522,8 @@
}).then(res => {
if (res.data.tbBillList.length > 0) {
this.tableData = res.data.tbBillList; // 鍦ㄧ澶村嚱鏁颁腑锛宼his 鎸囧悜澶栧眰浣滅敤鍩熺殑 this
- this.isShowTable = true;
- this.isUpdate = true;
+ // 鑷姩淇濆瓨妫�楠岄」鐩埌鏁版嵁搴�
+ this.saveTable();
} else {
this.$showMessage("姝ょ墿鏂欐病鏈夊惎鐢ㄧ殑妫�楠岄」鐩紝璇风淮鎶�!");
this.isShowTable = true;
@@ -969,6 +982,9 @@
if (genRes.data.result === 0) {
this.$showMessage("鑾峰彇妫�楠岄」鐩垚鍔�");
this.init();
+ // 鑾峰彇鎴愬姛鍚庣洿鎺ヨ繘鍏ュ～鍐欓樁娈�
+ this.isShowTable = false;
+ this.isUpdate = false;
} else {
this.$showMessage(genRes.data.message || "鑾峰彇澶辫触");
}
@@ -988,6 +1004,9 @@
if (genRes.data.result === 0) {
this.$showMessage("鑾峰彇妫�楠岄」鐩垚鍔�");
this.init();
+ // 鑾峰彇鎴愬姛鍚庣洿鎺ヨ繘鍏ュ～鍐欓樁娈�
+ this.isShowTable = false;
+ this.isUpdate = false;
} else {
this.$showMessage(genRes.data.message || "鑾峰彇澶辫触");
}
@@ -1006,343 +1025,415 @@
<style scoped>
/* 鍩虹鏍峰紡 */
.inspection-sheet {
- font-family: 'Microsoft YaHei', 'Segoe UI', sans-serif;
- max-width: 1000px;
- margin: 0 auto;
- padding: 20px 20px 100px 20px; /* 搴曢儴澧炲姞鍐呰竟璺濅负鍥哄畾鎸夐挳鐣欑┖闂� */
- background-color: #fff;
- box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
- min-height: 100vh;
- position: relative;
- transition: all 0.3s ease;
+ padding: 10px;
+ background-color: #f5f7fa;
+ min-height: 100vh;
+ padding-bottom: 120px; /* 涓哄簳閮ㄥ浐瀹氭寜閽暀鍑虹┖闂� */
}
/* 澶撮儴鏍峰紡 */
.sheet-header {
- text-align: center;
- margin-bottom: 20px;
- padding-bottom: 15px;
- border-bottom: 2px solid #e0e0e0;
+ background-color: white;
+ padding: 20px;
+ border-radius: 8px;
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
+ margin-bottom: 20px;
}
.sheet-header h1 {
- color: #2c3e50;
- font-size: 24px;
- margin-bottom: 5px;
+ font-size: 24px;
+ font-weight: 600;
+ color: #2c3e50;
+ margin-bottom: 10px;
}
.inspection-number {
- font-size: 16px;
- font-weight: bold;
- color: #3498db;
+ font-size: 16px;
+ color: #3498db;
+ font-weight: 500;
}
-/* 鍩烘湰淇℃伅鍖烘牱寮� */
-.basic-info,
-.material-info {
- margin-bottom: 20px;
+/* 鍩烘湰淇℃伅鍖� */
+.basic-info {
+ background-color: white;
+ padding: 20px;
+ border-radius: 8px;
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
+ margin-bottom: 20px;
}
.info-row {
- display: flex;
- margin-bottom: 10px;
- flex-wrap: wrap;
+ display: flex;
+ align-items: center;
+ margin-bottom: 15px;
}
.info-label {
- font-weight: bold;
- color: #34495e;
- min-width: 80px;
- margin-right: 5px;
+ font-size: 14px;
+ color: #7f8c8d;
+ margin-right: 10px;
+ min-width: 80px;
}
.info-value {
- color: #2c3e50;
- margin-right: 20px;
+ font-size: 14px;
+ color: #2c3e50;
+ margin-right: 20px;
}
.info-picker {
- padding: 8px 12px;
- border: 1px solid #ddd;
- border-radius: 4px;
- background-color: white;
- font-size: 14px;
- margin-right: 20px;
+ padding: 8px 12px;
+ border: 1px solid #ddd;
+ border-radius: 4px;
+ background-color: white;
+ font-size: 14px;
+ margin-right: 20px;
}
-/* 鐗╂枡淇℃伅鍖烘牱寮� */
+/* 鐗╂枡淇℃伅鍖� */
.material-info {
- border: 1px solid #eee;
- padding: 15px;
- border-radius: 5px;
+ background-color: white;
+ padding: 20px;
+ border-radius: 8px;
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
+ margin-bottom: 20px;
}
.info-block {
- display: flex;
- align-items: center;
- margin-bottom: 10px;
- flex-wrap: wrap;
+ display: flex;
+ align-items: center;
+ margin-bottom: 15px;
}
.info-block .info-label {
- min-width: 100px;
- font-size: 14px;
- color: #7f8c8d;
+ min-width: 100px;
+ font-size: 14px;
+ color: #7f8c8d;
}
.info-block .info-value {
- font-size: 14px;
- color: #2c3e50;
- flex: 1;
+ font-size: 14px;
+ color: #2c3e50;
+ flex: 1;
}
.info-picker-input {
- flex: 1;
- padding: 8px 12px;
- border: 1px solid #ddd;
- border-radius: 4px;
- background-color: white;
- font-size: 14px;
+ flex: 1;
+ padding: 8px 12px;
+ border: 1px solid #ddd;
+ border-radius: 4px;
+ background-color: white;
+ font-size: 14px;
}
.info-input {
- flex: 1;
- padding: 8px 12px;
- border: 1px solid #ddd;
- border-radius: 4px;
- background-color: white;
- font-size: 14px;
+ flex: 1;
+ padding: 8px 12px;
+ border: 1px solid #ddd;
+ border-radius: 4px;
+ background-color: white;
+ font-size: 14px;
}
.highlight {
- font-weight: bold;
- color: #e74c3c;
+ font-weight: 600;
+ color: #e74c3c;
+ font-size: 16px;
}
-/* 琛ㄦ牸鏍峰紡 */
+/* 妫�楠岄」鐩〃鏍� */
.inspection-table {
- margin: 25px 0;
+ margin: 25px 0;
+ border-radius: 8px;
+ overflow: hidden;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+ background: #fff;
}
.inspection-table table {
- width: 100%;
- border-collapse: collapse;
+ width: 100%;
+ border-collapse: collapse;
}
-.inspection-table th,
-.inspection-table td {
- padding: 12px 15px;
- border: 1px solid #ddd;
- text-align: left;
+.inspection-table th, .inspection-table td {
+ padding: 16px 20px;
+ border: none;
+ text-align: left;
+ border-bottom: 1px solid #eee;
}
.inspection-table th {
- background-color: #f8f9fa;
- font-weight: bold;
- color: #34495e;
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+ font-weight: 600;
+ color: #fff;
+ font-size: 14px;
+ letter-spacing: 0.5px;
+ position: relative;
}
-.inspection-table tr:nth-child(even) {
- background-color: #f9f9f9;
+.inspection-table tbody tr {
+ transition: all 0.3s ease;
+ border-left: 4px solid transparent;
}
-.inspection-table tr:hover {
- background-color: #f1f5f9;
+.inspection-table tbody tr:nth-child(even) {
+ background-color: #f8fafc;
+}
+
+.inspection-table tbody tr:hover {
+ background-color: #e8f4fd;
+ border-left-color: #3498db;
+ transform: translateY(-1px);
+ box-shadow: 0 4px 12px rgba(52, 152, 219, 0.15);
+}
+
+/* 妫�楠屾弿杩板垪鐗规畩鏍峰紡 */
+.inspection-table td:nth-child(2) {
+ position: relative;
+ min-height: 80px;
+ vertical-align: top;
+ padding: 16px 20px;
}
/* 姘村嵃鏍峰紡 */
.watermark {
- position: absolute;
- font-size: 40px;
- font-weight: bold;
- opacity: 1;
- z-index: 1;
- pointer-events: none;
- transform: rotate(-15deg);
- width: 100%;
- text-align: center;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%) rotate(-15deg);
+ position: absolute;
+ font-size: 32px;
+ font-weight: bold;
+ opacity: 0.4;
+ z-index: 3;
+ pointer-events: none;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%) rotate(-15deg);
+ text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.8);
+ min-width: 60px;
+ text-align: center;
}
.watermark.approved {
- color: #2ecc71;
- /* 缁胯壊 */
+ color: #27ae60; /* 鏇存贰鐨勭豢鑹� */
}
.watermark.rejected {
- color: #e74c3c;
- /* 绾㈣壊 */
+ color: #e67e22; /* 鏇存贰鐨勭孩鑹� */
}
.watermark.pending {
- color: #f39c12;
- /* 姗欒壊 */
+ color: #f39c12; /* 姗欒壊 */
}
-/* 鎻忚堪鏂囨湰瀹瑰櫒 */
+/* 鎻忚堪鏂囨湰鏍峰紡 */
.description-text {
- position: relative;
- z-index: 2;
- padding: 25px;
- background-color: rgba(255, 255, 255, 0.7);
+ position: relative;
+ z-index: 2;
+ padding: 12px 16px;
+ background: transparent;
+ line-height: 1.6;
+ font-size: 14px;
+ color: #555;
+ margin: 0;
+ word-wrap: break-word;
+ word-break: break-word;
+ max-width: 100%;
+ /* 纭繚鏂囧瓧涓嶄細澶暱閬尅姘村嵃 */
+ padding-right: 80px;
+ min-height: 20px;
+ display: block;
}
-/* 璋冩暣琛ㄦ牸鍗曞厓鏍� */
-.inspection-table td:nth-child(2) {
- position: relative;
- overflow: hidden;
- padding: 0;
+.record-btn {
+ padding: 8px 16px;
+ background: linear-gradient(135deg, #3498db, #2980b9);
+ color: #fff;
+ border: none;
+ border-radius: 6px;
+ cursor: pointer;
+ transition: all 0.3s ease;
+ font-weight: 500;
+ font-size: 13px;
+ box-shadow: 0 2px 4px rgba(52, 152, 219, 0.3);
+}
+
+.record-btn:hover {
+ background: linear-gradient(135deg, #2980b9, #1f618d);
+ transform: translateY(-1px);
+ box-shadow: 0 4px 8px rgba(52, 152, 219, 0.4);
+}
+
+.record-btn:active {
+ transform: translateY(0);
}
/* 琛ㄥ崟涓婃柟鎿嶄綔鎸夐挳鍖烘牱寮� */
.top-action-buttons {
- display: flex;
- justify-content: flex-end;
- gap: 10px;
- margin: 20px 0;
- padding: 15px;
- background-color: #f8f9fa;
- border-radius: 8px;
- border: 1px solid #e9ecef;
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
+ margin: 20px 0;
+ padding: 15px;
+ background-color: #f8f9fa;
+ border-radius: 8px;
+ border: 1px solid #e9ecef;
}
/* 琛ㄥ崟涓嬫柟鎿嶄綔鎸夐挳鍖烘牱寮� */
.bottom-action-buttons {
- display: flex;
- justify-content: center;
- gap: 8px;
- padding: 12px;
- flex-wrap: wrap;
- align-items: center;
- position: fixed; /* 鍥哄畾鍦ㄥ睆骞曞簳閮� */
- bottom: 0; /* 璺濈搴曢儴0px */
- left: 0; /* 璺濈宸﹁竟0px */
- right: 0; /* 璺濈鍙宠竟0px */
- background-color: #fff; /* 鑳屾櫙鑹� */
- border-top: 1px solid #e9ecef; /* 椤堕儴杈规 */
- z-index: 1000; /* 纭繚鍦ㄦ渶涓婂眰 */
- box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); /* 椤堕儴闃村奖 */
+ display: flex;
+ justify-content: center;
+ gap: 8px;
+ padding: 12px;
+ flex-wrap: wrap;
+ align-items: center;
+ position: fixed; /* 鍥哄畾鍦ㄥ睆骞曞簳閮� */
+ bottom: 0; /* 璺濈搴曢儴0px */
+ left: 0; /* 璺濈宸﹁竟0px */
+ right: 0; /* 璺濈鍙宠竟0px */
+ background-color: #fff; /* 鑳屾櫙鑹� */
+ border-top: 1px solid #e9ecef; /* 椤堕儴杈规 */
+ z-index: 1000; /* 纭繚鍦ㄦ渶涓婂眰 */
+ box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); /* 椤堕儴闃村奖 */
}
.action-btn {
- background-color: #ecf0f1;
- color: #34495e;
- padding: 12px 15px;
- border: none;
- border-radius: 6px;
- cursor: pointer;
- font-size: 14px;
- font-weight: 500;
- transition: all 0.3s ease;
- text-align: center;
- min-height: 44px;
- display: flex;
- align-items: center;
- justify-content: center;
+ background-color: #ecf0f1;
+ color: #34495e;
+ padding: 12px 15px;
+ border: none;
+ border-radius: 6px;
+ cursor: pointer;
+ font-size: 14px;
+ font-weight: 500;
+ transition: all 0.3s ease;
+ text-align: center;
+ min-height: 44px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
}
.action-btn:hover {
- background-color: #d5dbdb;
- transform: translateY(-1px);
+ background-color: #d5dbdb;
+ transform: translateY(-1px);
}
.action-btn.primary {
- background-color: #3498db;
- color: #fff;
+ background-color: #3498db;
+ color: #fff;
}
.action-btn.primary:hover {
- background-color: #2980b9;
+ background-color: #2980b9;
}
/* 灏忓昂瀵告寜閽牱寮� */
.action-btn.small {
- padding: 10px 12px;
- font-size: 14px;
- min-height: 44px;
- white-space: nowrap;
- flex-shrink: 0;
- min-width: 80px;
- max-width: 120px;
- flex: 1;
+ padding: 10px 12px;
+ font-size: 14px;
+ min-height: 44px;
+ white-space: nowrap;
+ flex-shrink: 0;
+ min-width: 80px;
+ max-width: 120px;
+ flex: 1;
}
/* 鍘熸湁鎸夐挳鏍峰紡淇濇寔鍏煎 */
.action-buttons {
- display: flex;
- gap: 10px;
- margin: 15px 0;
- justify-content: flex-end;
-}
-
-.record-btn {
- padding: 6px 12px;
- background-color: #f8f9fa;
- border: 1px solid #ddd;
- /* border-radius: 3px; */
- cursor: pointer;
- transition: all 0.2s;
-}
-
-.record-btn:hover {
- background-color: #e9ecef;
+ display: flex;
+ gap: 10px;
+ margin: 15px 0;
+ justify-content: flex-end;
}
.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; /* 鎻愰珮灞傜骇锛岀‘淇濆湪鍥哄畾鎸夐挳涓婃柟 */
+ 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; /* 鎻愰珮灞傜骇锛岀‘淇濆湪鍥哄畾鎸夐挳涓婃柟 */
}
/* 寮圭獥鏁翠綋缇庡寲 */
.popup {
- background: #fff;
- border-radius: 16px;
- box-shadow: 0 8px 32px rgba(60,60,60,0.18);
- padding: 28px 28px 18px 28px;
- border: none;
- position: relative;
- min-width: 260px;
- z-index: 1001; /* 纭繚寮圭獥鍐呭鍦ㄦ渶涓婂眰 */
- max-height: 80vh; /* 闄愬埗鏈�澶ч珮搴︼紝閬垮厤琚簳閮ㄦ寜閽伄鎸� */
- overflow-y: auto; /* 鍐呭杩囧鏃跺彲婊氬姩 */
+ background: #fff;
+ border-radius: 16px;
+ box-shadow: 0 8px 32px rgba(60,60,60,0.18);
+ padding: 28px 28px 18px 28px;
+ border: none;
+ position: relative;
+ min-width: 260px;
+ z-index: 1001; /* 纭繚寮圭獥鍐呭鍦ㄦ渶涓婂眰 */
+ max-height: 80vh; /* 闄愬埗鏈�澶ч珮搴︼紝閬垮厤琚簳閮ㄦ寜閽伄鎸� */
+ overflow-y: auto; /* 鍐呭杩囧鏃跺彲婊氬姩 */
}
.popup-header {
- padding: 20px;
- border-bottom: 1px solid #eee;
+ padding: 20px;
+ border-bottom: 1px solid #eee;
}
.popup-header h3 {
- font-size: 18px;
- font-weight: 600;
- color: #2c3e50;
- margin: 0;
+ font-size: 18px;
+ font-weight: 600;
+ color: #2c3e50;
+ margin: 0;
}
.popup-content {
- padding: 20px;
+ padding: 20px;
}
.popup-actions {
- padding: 20px;
- border-top: 1px solid #eee;
- display: flex;
- gap: 10px;
- justify-content: flex-end;
+ padding: 20px;
+ border-top: 1px solid #eee;
+ display: flex;
+ gap: 10px;
+ justify-content: flex-end;
+}
+
+/* 绌虹姸鎬佹牱寮� */
+.empty-state {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ padding: 60px 20px;
+ text-align: center;
+ background-color: #fafafa;
+ border-radius: 8px;
+ margin: 20px 0;
+}
+
+.empty-icon {
+ font-size: 48px;
+ margin-bottom: 16px;
+ opacity: 0.6;
+}
+
+.empty-text {
+ font-size: 18px;
+ font-weight: 600;
+ color: #666;
+ margin-bottom: 8px;
+}
+
+.empty-desc {
+ font-size: 14px;
+ color: #999;
+ line-height: 1.5;
}
/* 鍝嶅簲寮忚璁� */
@media (max-width: 500px) {
+ .inspection-sheet {
+ padding-bottom: 100px; /* 灏忓睆骞曡澶囦笂鍑忓皯搴曢儴鍐呰竟璺� */
+ }
.info-row,
.info-block {
--
Gitblit v1.9.3