| | |
| | | { |
| | | label: "检测日期", |
| | | prop: "checkTime", |
| | | width: 120, |
| | | width: 150, |
| | | className: "date-cell", |
| | | }, |
| | | { |
| | | label: "供应商", |
| | |
| | | { |
| | | label: "检验员", |
| | | prop: "checkName", |
| | | width: 120, |
| | | className: "inspector-cell", |
| | | }, |
| | | { |
| | | label: "产品名称", |
| | |
| | | { |
| | | label: "试样编号", |
| | | prop: "sampleCode", |
| | | width: 120, |
| | | |
| | | className: "volume-cell", |
| | | }, |
| | | { |
| | | label: "试样状态", |
| | | prop: "sampleState", |
| | | dataType: "tag", |
| | | formatType: params => { |
| | | if (params === "颗粒" || params === "固体" || params === "膏体") { |
| | | return "success"; |
| | | } else { |
| | | return "info"; |
| | | } |
| | | }, |
| | | }, |
| | | { |
| | | label: "检测性质", |
| | | prop: "inspectNature", |
| | | dataType: "tag", |
| | | formatType: params => { |
| | | if (params === "日常检验") { |
| | | return "success"; |
| | | } else if (params === "入场验收") { |
| | | return "warning"; |
| | | } else { |
| | | return null; |
| | | } |
| | | }, |
| | | }, |
| | | { |
| | | label: "取样日期", |
| | | prop: "sampleTime", |
| | | width: 150, |
| | | className: "date-cell", |
| | | }, |
| | | { |
| | | label: "检测单位", |
| | |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped> |
| | | <style scoped lang="scss"> |
| | | .app-container { |
| | | padding: 20px; |
| | | background-color: #f5f7fa; |
| | |
| | | |
| | | :deep(.el-table .el-table__row) { |
| | | transition: background-color 0.3s ease; |
| | | } |
| | | |
| | | /* 表格列样式 */ |
| | | :deep(.date-cell) { |
| | | font-family: "Courier New", monospace; |
| | | color: #606266; |
| | | } |
| | | |
| | | :deep(.supplier-cell) { |
| | | font-weight: 500; |
| | | color: #303133; |
| | | } |
| | | |
| | | :deep(.inspector-cell) { |
| | | color: #409eff; |
| | | } |
| | | |
| | | :deep(.product-cell) { |
| | | font-weight: 500; |
| | | } |
| | | |
| | | :deep(.model-cell) { |
| | | color: #606266; |
| | | } |
| | | |
| | | :deep(.unit-cell) { |
| | | font-size: 12px; |
| | | color: #909399; |
| | | } |
| | | |
| | | :deep(.quantity-cell) { |
| | | font-family: "Courier New", monospace; |
| | | font-weight: 500; |
| | | color: #303133; |
| | | } |
| | | |
| | | :deep(.volume-cell) { |
| | | font-family: "Courier New", monospace; |
| | | color: #67c23a; |
| | | font-weight: 500; |
| | | } |
| | | |
| | | :deep(.state-cell) { |
| | | font-weight: 500; |
| | | } |
| | | |
| | | :deep(.nature-cell) { |
| | | color: #606266; |
| | | } |
| | | |
| | | :deep(.company-cell) { |
| | | color: #606266; |
| | | } |
| | | |
| | | :deep(.result-cell) { |
| | | font-weight: 600; |
| | | } |
| | | |
| | | :deep(.status-cell) { |
| | | font-weight: 500; |
| | | } |
| | | |
| | | /* 按钮样式优化 */ |
| | |
| | | font-size: 12px; |
| | | } |
| | | } |
| | | :deep(.el-table) { |
| | | .el-table__body-wrapper { |
| | | .quantity-cell, |
| | | .volume-cell, |
| | | .dimension-cell { |
| | | font-weight: 600; |
| | | color: #409eff; |
| | | font-family: "Courier New", monospace; |
| | | text-shadow: 0 1px 2px rgba(64, 158, 255, 0.2); |
| | | } |
| | | .spec-cell { |
| | | color: #67c23a; |
| | | font-weight: 500; |
| | | |
| | | padding: 4px 8px; |
| | | border-radius: 4px; |
| | | } |
| | | |
| | | .code-cell { |
| | | color: #e6a23c; |
| | | font-family: "Courier New", monospace; |
| | | font-weight: 500; |
| | | padding: 4px 8px; |
| | | border-radius: 4px; |
| | | } |
| | | } |
| | | } |
| | | </style> |