From 265d03ef2304f9461ba4926d729cda520c1e959c Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期一, 16 三月 2026 13:28:46 +0800
Subject: [PATCH] 一些修改
---
src/views/qualityManagement/rawMaterialInspection/components/formDia.vue | 233 ++++++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 193 insertions(+), 40 deletions(-)
diff --git a/src/views/qualityManagement/rawMaterialInspection/components/formDia.vue b/src/views/qualityManagement/rawMaterialInspection/components/formDia.vue
index 145d3af..e00040b 100644
--- a/src/views/qualityManagement/rawMaterialInspection/components/formDia.vue
+++ b/src/views/qualityManagement/rawMaterialInspection/components/formDia.vue
@@ -5,35 +5,30 @@
width="70%"
@close="closeDia">
<el-form :model="form"
- label-width="140px"
- label-position="top"
+ label-width="100px"
+ label-position="left"
:rules="rules"
- ref="formRef">
- <el-row :gutter="30">
- <el-col :span="12">
- <el-form-item label="渚涘簲鍟嗭細" prop="supplier">
- <el-input v-model="form.supplier" placeholder="璇疯緭鍏�" clearable/>
+ ref="formRef"
+ class="inspection-form">
+ <el-row :gutter="20">
+ <el-col :span="8">
+ <el-form-item label="渚涘簲鍟嗭細"
+ prop="supplier">
+ <el-input v-model="form.supplier"
+ placeholder="璇疯緭鍏�"
+ clearable />
</el-form-item>
</el-col>
- <el-col :span="12">
+ <el-col :span="8">
<el-form-item label="浜у搧锛�"
prop="productId">
<el-button type="primary"
@click="openProductSelectDialog"
- :disabled="operationType === 'edit'">閫夋嫨浜у搧</el-button>
- <div class="selected-product mt-2"
- v-if="form.productName">
- <el-tag closable
- @close="clearProductSelection"
- class="mr-2">
- {{ form.productName }} - {{ form.model }}
- </el-tag>
- </div>
- <div v-else
- class="text-gray-400">璇烽�夋嫨浜у搧</div>
+ :disabled="operationType === 'edit'"
+ class="product-select-btn">{{form.productName || "閫夋嫨浜у搧"}}{{form.model?(" - "+form.model):""}}</el-button>
</el-form-item>
</el-col>
- <el-col :span="12">
+ <el-col :span="8">
<el-form-item label="璇曟牱缂栧彿锛�"
prop="sampleCode">
<el-input v-model="form.sampleCode"
@@ -41,7 +36,7 @@
clearable />
</el-form-item>
</el-col>
- <el-col :span="12">
+ <el-col :span="8">
<el-form-item label="杞︾墝鍙凤細"
prop="licensePlateNumber">
<el-input v-model="form.licensePlateNumber"
@@ -49,10 +44,11 @@
clearable />
</el-form-item>
</el-col>
- <el-col :span="12">
+ <el-col :span="8">
<el-form-item label="妫�娴嬫�ц川锛�"
prop="inspectNature">
- <el-select v-model="form.inspectNature">
+ <el-select v-model="form.inspectNature"
+ style="width: 100%">
<el-option label="鏃ュ父妫�娴�"
value="鏃ュ父妫�娴�" />
<el-option label="鍏ュ満楠屾敹"
@@ -60,10 +56,11 @@
</el-select>
</el-form-item>
</el-col>
- <el-col :span="12">
+ <el-col :span="8">
<el-form-item label="璇曟牱鐘舵�侊細"
prop="sampleState">
- <el-select v-model="form.sampleState">
+ <el-select v-model="form.sampleState"
+ style="width: 100%">
<el-option label="鍥轰綋"
value="鍥轰綋" />
<el-option label="棰楃矑"
@@ -79,16 +76,14 @@
</el-select>
</el-form-item>
</el-col>
- </el-row>
- <el-row :gutter="30">
- <el-col :span="12">
+ <el-col :span="8">
<el-form-item label="鍗曚綅锛�"
prop="unit">
<el-input v-model="form.unit"
disabled />
</el-form-item>
</el-col>
- <el-col :span="12">
+ <el-col :span="8">
<el-form-item label="鎸囨爣閫夋嫨锛�"
prop="testStandardId">
<el-select v-model="form.testStandardId"
@@ -103,9 +98,7 @@
</el-select>
</el-form-item>
</el-col>
- </el-row>
- <el-row :gutter="30">
- <el-col :span="12">
+ <el-col :span="8">
<el-form-item label="妫�娴嬪崟浣嶏細"
prop="checkCompany">
<el-input v-model="form.checkCompany"
@@ -113,10 +106,11 @@
clearable />
</el-form-item>
</el-col>
- <el-col :span="12">
+ <el-col :span="8">
<el-form-item label="妫�娴嬬粨鏋滐細"
prop="checkResult">
- <el-select v-model="form.checkResult">
+ <el-select v-model="form.checkResult"
+ style="width: 100%">
<el-option label="鍚堟牸"
value="鍚堟牸" />
<el-option label="涓嶅悎鏍�"
@@ -124,9 +118,7 @@
</el-select>
</el-form-item>
</el-col>
- </el-row>
- <el-row :gutter="30">
- <el-col :span="12">
+ <el-col :span="8">
<el-form-item label="妫�楠屽憳锛�"
prop="checkName">
<el-select v-model="form.checkName"
@@ -140,7 +132,7 @@
</el-select>
</el-form-item>
</el-col>
- <el-col :span="12">
+ <el-col :span="8">
<el-form-item label="妫�娴嬫棩鏈燂細"
prop="checkTime">
<el-date-picker v-model="form.checkTime"
@@ -152,7 +144,7 @@
style="width: 100%" />
</el-form-item>
</el-col>
- <el-col :span="12">
+ <el-col :span="8">
<el-form-item label="鍙栨牱鏃ユ湡锛�"
prop="sampleTime">
<el-date-picker v-model="form.sampleTime"
@@ -269,7 +261,9 @@
{ required: false, message: "璇烽�夋嫨璇曟牱鐘舵��", trigger: "change" },
],
sampleCode: [{ required: false, message: "璇疯緭鍏�", trigger: "blur" }],
- licensePlateNumber: [{ required: false, message: "璇疯緭鍏�", trigger: "blur" }],
+ licensePlateNumber: [
+ { required: false, message: "璇疯緭鍏�", trigger: "blur" },
+ ],
sampleTime: [{ required: false, message: "璇疯緭鍏�", trigger: "blur" }],
},
});
@@ -595,4 +589,163 @@
</script>
<style scoped>
+ .inspection-form {
+ background-color: #f9f9f9;
+ border-radius: 8px;
+ padding: 20px;
+ margin-bottom: 20px;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+ }
+
+ .product-select-btn {
+ width: 100%;
+ text-align: left;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ transition: all 0.3s ease;
+ }
+
+ .product-select-btn:hover {
+ box-shadow: 0 2px 8px rgba(0, 122, 255, 0.3);
+ }
+
+ /* 澧炲姞琛ㄥ崟椤归棿璺� */
+ .el-form-item {
+ margin-bottom: 15px;
+ }
+
+ /* 杈撳叆妗嗗拰閫夋嫨鍣ㄧ殑鎮仠鏁堟灉 */
+ :deep(.el-input__wrapper) {
+ transition: all 0.3s ease;
+ }
+
+ :deep(.el-input__wrapper:hover) {
+ box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.2) !important;
+ }
+
+ :deep(.el-select) {
+ transition: all 0.3s ease;
+ }
+
+ :deep(.el-select:hover .el-input__wrapper) {
+ box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.2) !important;
+ }
+
+ /* 鏃ユ湡閫夋嫨鍣ㄧ殑鎮仠鏁堟灉 */
+ :deep(.el-date-picker) {
+ transition: all 0.3s ease;
+ }
+
+ :deep(.el-date-picker:hover .el-input__wrapper) {
+ box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.2) !important;
+ }
+
+ /* 浼樺寲琛ㄦ牸鏍峰紡 */
+ :deep(.el-table) {
+ border-radius: 8px;
+ overflow: hidden;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+ transition: all 0.3s ease;
+ }
+
+ :deep(.el-table:hover) {
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+ }
+
+ :deep(.el-table th) {
+ background-color: #f5f7fa;
+ font-weight: 600;
+ }
+
+ :deep(.el-table tr:hover) {
+ background-color: #f0f9ff;
+ }
+
+ /* 琛ㄦ牸杈撳叆妗嗘牱寮� */
+ :deep(.el-table .el-input__wrapper) {
+ box-shadow: none !important;
+ }
+
+ :deep(.el-table .el-input__wrapper:hover) {
+ box-shadow: 0 0 0 2px rgba(0, 122, 255, 0.2) !important;
+ }
+
+ /* 浼樺寲瀵硅瘽妗嗗簳閮ㄦ寜閽� */
+ .dialog-footer {
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
+ margin-top: 20px;
+ }
+
+ .dialog-footer .el-button {
+ transition: all 0.3s ease;
+ padding: 8px 20px;
+ border-radius: 4px;
+ }
+
+ .dialog-footer .el-button:hover {
+ transform: translateY(-1px);
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+ }
+
+ .dialog-footer .el-button--primary:hover {
+ box-shadow: 0 2px 8px rgba(0, 122, 255, 0.4);
+ }
+
+ /* 琛ㄥ崟楠岃瘉鐘舵�佹牱寮� */
+ :deep(.el-form-item__error) {
+ font-size: 12px;
+ color: #f56c6c;
+ margin-top: 4px;
+ }
+
+ :deep(.el-form-item.is-error .el-input__wrapper) {
+ box-shadow: 0 0 0 2px rgba(245, 108, 108, 0.2) !important;
+ }
+
+ :deep(.el-form-item.is-success .el-input__wrapper) {
+ box-shadow: 0 0 0 2px rgba(103, 194, 58, 0.2) !important;
+ }
+
+ /* 鍝嶅簲寮忚璁� */
+ @media screen and (max-width: 1200px) {
+ .el-col {
+ :deep(.el-col) {
+ &[class*="el-col-8"] {
+ flex: 0 0 50%;
+ max-width: 50%;
+ }
+ }
+ }
+ }
+
+ @media screen and (max-width: 768px) {
+ .el-col {
+ :deep(.el-col) {
+ &[class*="el-col-8"] {
+ flex: 0 0 100%;
+ max-width: 100%;
+ }
+ }
+ }
+
+ .inspection-form {
+ padding: 15px;
+ }
+
+ .el-form {
+ label-width: 80px !important;
+ }
+
+ .dialog-footer {
+ flex-direction: column;
+ align-items: stretch;
+ }
+
+ .dialog-footer .el-button {
+ width: 100%;
+ }
+ }
</style>
--
Gitblit v1.9.3