| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <div class="picking-container" v-loading="globalLoading" element-loading-text="å¤çä¸..." |
| | | element-loading-background="rgba(255, 255, 255, 0.8)" element-loading-spinner="el-icon-loading" |
| | | element-loading-custom-class="custom-loading"> |
| | | <!-- é¡¶é¨è®¢åä¿¡æ¯ --> |
| | | <el-card class="order-info-card" shadow="never"> |
| | | <div class="order-header"> |
| | | <div class="order-title"> |
| | | <i class="el-icon-document"></i> |
| | | <span class="order-label">订åå·ï¼</span> |
| | | <span class="order-value">{{ orderNo }}</span> |
| | | </div> |
| | | <div class="order-status"> |
| | | <el-tag v-if="orderInfo" :type="getStatusType(orderInfo.orderStatus)" size="medium" |
| | | style="margin-left: 10px;"> |
| | | {{ orderInfo.statusName || 'è¿è¡ä¸' }} |
| | | </el-tag> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | | |
| | | <!-- æ«ç æä½åºå --> |
| | | <el-card class="scan-section-card" shadow="never"> |
| | | <div class="scan-section"> |
| | | <el-alert title="请å
æ«ææçç ï¼åæ«æç©ææ¡ç è¿è¡æ£é" type="info" :closable="false" show-icon class="scan-alert"> |
| | | <template #default> |
| | | <div> |
| | | <div>1. æ«ææçç â 2. æ«æç©ææ¡ç èªå¨æ£é</div> |
| | | <div style="margin-top: 8px; font-size: 13px; color: #666;"> |
| | | <i class="el-icon-info" style="color: #409EFF;"></i> |
| | | æ«ææ¡ç åä¼èªå¨è¯·æ±æ£éæ¥å£ï¼æ éæå¨ç¹å»ç¡®è®¤ |
| | | </div> |
| | | </div> |
| | | </template> |
| | | </el-alert> |
| | | |
| | | <el-form :model="scanForm" :rules="scanRules" ref="scanFormRef" class="scan-form"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="æçç " prop="palletCode"> |
| | | <el-input ref="palletInput" v-model="scanForm.palletCode" placeholder="è¯·æ«ææçç " size="large" |
| | | clearable @keyup.enter="handlePalletScan"> |
| | | <template #prefix> |
| | | <i class="el-icon-box"></i> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="ç©ææ¡ç " prop="materialBarcode"> |
| | | <el-input ref="materialInput" v-model="scanForm.materialBarcode" placeholder="è¯·æ«æç©ææ¡ç " |
| | | size="large" clearable :disabled="!scanForm.palletCode" |
| | | @keyup.enter="handleMaterialScan"> |
| | | <template #prefix> |
| | | <i class="el-icon-s-grid"></i> |
| | | </template> |
| | | <template #append> |
| | | <el-button type="primary" @click="handleMaterialScan" :loading="pickLoading"> |
| | | æ«ææ£é |
| | | </el-button> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <!-- æä½æé® --> |
| | | <el-row :gutter="20" style="margin-top: 10px;"> |
| | | <el-col :span="24"> |
| | | <div class="action-buttons"> |
| | | <el-button type="success" size="large" @click="handleReturnToWarehouse" |
| | | :disabled="!scanForm.palletCode" :loading="returnLoading"> |
| | | <i class="el-icon-refresh-left"></i> |
| | | ååº |
| | | </el-button> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | </div> |
| | | </el-card> |
| | | |
| | | <!-- æ«æéªè¯çæ¡ç å表 --> |
| | | <div class="tables-section"> |
| | | <el-card class="table-card" shadow="never"> |
| | | <template #header> |
| | | <div class="card-header"> |
| | | <span class="card-title"> |
| | | <i class="el-icon-s-grid"></i> |
| | | æ«æéè¿éªè¯çæ¡ç å表 |
| | | </span> |
| | | <div> |
| | | <el-badge :value="scannedList.length" class="badge-item" type="primary"> |
| | | <el-button size="small" @click="clearScannedList" icon="el-icon-delete"> |
| | | æ¸
空å表 |
| | | </el-button> |
| | | </el-badge> |
| | | <el-button size="small" @click="refreshScannedList" icon="el-icon-refresh" style="margin-left: 10px;"> |
| | | å·æ° |
| | | </el-button> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <el-table :data="scannedList" height="500" stripe> |
| | | <el-table-column type="index" label="åºå·" width="60" align="center" /> |
| | | <el-table-column prop="barcode" label="æ¡ç " width="200"> |
| | | <template #default="scope"> |
| | | <el-tag type="success">{{ scope.row.barcode }}</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="scanTime" label="æ«ææ¶é´" width="160"> |
| | | <template #default="scope"> |
| | | <el-text type="info">{{ scope.row.scanTime }}</el-text> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="status" label="ç¶æ" width="80" align="center"> |
| | | <template #default="scope"> |
| | | <el-tag :type="scope.row.status === 'success' ? 'success' : 'danger'" size="small"> |
| | | {{ scope.row.status === 'success' ? 'æå' : '失败' }} |
| | | </el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="message" label="æ¶æ¯" show-overflow-tooltip /> |
| | | <el-table-column label="æä½" width="80" align="center"> |
| | | <template #default="scope"> |
| | | <el-button type="text" size="small" @click="removeScannedItem(scope.row.barcode)" :disabled="scope.row.status === 'pending'"> |
| | | å é¤ |
| | | </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | |
| | | <div class="table-footer"> |
| | | <el-descriptions :column="4" size="small"> |
| | | <el-descriptions-item label="æ»æ¡ç æ°"> |
| | | <el-text type="info">{{ scannedList.length }}</el-text> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item label="æåæ°"> |
| | | <el-text type="success">{{ successCount }}</el-text> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item label="失败æ°"> |
| | | <el-text type="danger">{{ failedCount }}</el-text> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item label="é夿°"> |
| | | <el-text type="warning">{{ duplicateCount }}</el-text> |
| | | </el-descriptions-item> |
| | | </el-descriptions> |
| | | </div> |
| | | </el-card> |
| | | </div> |
| | | |
| | | <!-- ç¡®è®¤å¯¹è¯æ¡ --> |
| | | <el-dialog v-model="confirmDialogVisible" title="æä½ç¡®è®¤" width="400px" :before-close="handleDialogClose"> |
| | | <div class="confirm-content"> |
| | | <p>{{ confirmMessage }}</p> |
| | | </div> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="confirmDialogVisible = false">åæ¶</el-button> |
| | | <el-button type="primary" @click="executeConfirm" :loading="executeLoading"> |
| | | ç¡®å® |
| | | </el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { stationManager } from "@/../src/uitils/stationManager"; |
| | | import { ElLoading } from 'element-plus' |
| | | |
| | | export default { |
| | | name: 'OutPicking', |
| | | data() { |
| | | return { |
| | | orderNo: '', |
| | | orderInfo: null, |
| | | scanForm: { |
| | | palletCode: '', |
| | | materialBarcode: '' |
| | | }, |
| | | scanRules: { |
| | | palletCode: [ |
| | | { required: true, message: 'è¯·æ«ææçç ', trigger: 'blur' } |
| | | ] |
| | | }, |
| | | // æ«æéè¿çæ¡ç å表 |
| | | scannedList: [], |
| | | confirmDialogVisible: false, |
| | | confirmMessage: '', |
| | | currentAction: null, |
| | | executeLoading: false, |
| | | globalLoading: false, |
| | | loadingInstance: null, |
| | | pickLoading: false, |
| | | returnLoading: false |
| | | } |
| | | }, |
| | | computed: { |
| | | // è®¡ç®æåæ°é |
| | | successCount() { |
| | | return this.scannedList.filter(item => item.status === 'success').length; |
| | | }, |
| | | // 计ç®å¤±è´¥æ°é |
| | | failedCount() { |
| | | return this.scannedList.filter(item => item.status === 'failed').length; |
| | | }, |
| | | // 计ç®é夿«ææ¬¡æ°ï¼ä¸å
æ¬å½åå表ä¸å·²ç»åå¨çï¼ |
| | | duplicateCount() { |
| | | const barcodes = this.scannedList.map(item => item.barcode); |
| | | const uniqueBarcodes = [...new Set(barcodes)]; |
| | | return barcodes.length - uniqueBarcodes.length; |
| | | } |
| | | }, |
| | | mounted() { |
| | | this.initPage() |
| | | }, |
| | | methods: { |
| | | initPage() { |
| | | // ä»è·¯ç±åæ°è·å订åå· |
| | | this.orderNo = this.$route.query.orderNo || '' |
| | | if (!this.orderNo) { |
| | | this.$message.error('订åå·ä¸è½ä¸ºç©º') |
| | | this.$router.back() |
| | | return |
| | | } |
| | | |
| | | // å 载订åä¿¡æ¯ |
| | | this.loadOrderInfo() |
| | | |
| | | // èªå¨èç¦å°æçç è¾å
¥æ¡ |
| | | this.$nextTick(() => { |
| | | if (this.$refs.palletInput) { |
| | | this.$refs.palletInput.focus() |
| | | } |
| | | }) |
| | | }, |
| | | async loadOrderInfo() { |
| | | try { |
| | | this.showFullScreenLoading() |
| | | const response = await this.http.get(`/api/Outbound/GetOrderInfo?orderNo=${this.orderNo}`) |
| | | if (response.status) { |
| | | this.orderInfo = response.data |
| | | } else { |
| | | this.$message.error(response.message || 'å 载订åä¿¡æ¯å¤±è´¥') |
| | | } |
| | | } |
| | | catch (error) { |
| | | this.$message.error('å 载订åä¿¡æ¯å¤±è´¥') |
| | | } finally { |
| | | this.hideFullScreenLoading() |
| | | } |
| | | }, |
| | | |
| | | async handlePalletScan() { |
| | | if (this.scanForm.palletCode) { |
| | | this.scanForm.materialBarcode = '' |
| | | } else { |
| | | this.$message.warning('请è¾å
¥æçç ') |
| | | } |
| | | }, |
| | | |
| | | async handleMaterialScan() { |
| | | if (!this.scanForm.palletCode) { |
| | | this.$message.warning('请å
æ«ææçç ') |
| | | this.$refs.palletInput.focus() |
| | | return |
| | | } |
| | | |
| | | if (!this.scanForm.materialBarcode) { |
| | | this.$message.warning('è¯·æ«æç©ææ¡ç ') |
| | | return |
| | | } |
| | | |
| | | // 1. æ£æ¥æ¯å¦é夿«æ |
| | | const isDuplicate = this.scannedList.some(item => item.barcode === this.scanForm.materialBarcode); |
| | | if (isDuplicate) { |
| | | this.$message.warning(`æ¡ç ${this.scanForm.materialBarcode} å·²æ«æè¿ï¼ä¸è½é夿«æ`) |
| | | this.scanForm.materialBarcode = '' |
| | | this.$nextTick(() => { |
| | | if (this.$refs.materialInput) { |
| | | this.$refs.materialInput.focus() |
| | | } |
| | | }) |
| | | return |
| | | } |
| | | |
| | | this.pickLoading = true |
| | | |
| | | // 2. å
æ·»å å°å表ï¼ç¶æä¸ºpendingï¼å¤çä¸ï¼ |
| | | const pendingItem = { |
| | | barcode: this.scanForm.materialBarcode, |
| | | materielCode: '', |
| | | materielName: '', |
| | | batchNo: '', |
| | | quantity: 1, |
| | | unit: '', |
| | | scanTime: this.formatTime(new Date()), |
| | | status: 'pending', |
| | | message: 'å¤çä¸...' |
| | | }; |
| | | this.scannedList.unshift(pendingItem); // æ·»å å°åè¡¨é¡¶é¨ |
| | | |
| | | try { |
| | | const response = await this.http.post('/api/Outbound/RecheckPicking', { |
| | | orderNo: this.orderNo, |
| | | barCode: this.scanForm.materialBarcode |
| | | }) |
| | | |
| | | // 3. æ´æ°å表ä¸çç¶æ |
| | | const index = this.scannedList.findIndex(item => item.barcode === this.scanForm.materialBarcode); |
| | | if (index !== -1) { |
| | | if (response.status) { |
| | | // æå |
| | | this.scannedList[index] = { |
| | | ...this.scannedList[index], |
| | | ...response.data, // å设å端è¿åäºç©æä¿¡æ¯ |
| | | status: 'success', |
| | | message: 'æ£éæå' |
| | | }; |
| | | this.$message.success('æ£éæå') |
| | | } else { |
| | | // 失败 |
| | | this.scannedList[index] = { |
| | | ...this.scannedList[index], |
| | | status: 'failed', |
| | | message: response.message || 'æ£é失败' |
| | | }; |
| | | this.$message.error(response.message || 'æ£é失败') |
| | | } |
| | | } |
| | | |
| | | } catch (error) { |
| | | // æ´æ°å¤±è´¥ç¶æ |
| | | const index = this.scannedList.findIndex(item => item.barcode === this.scanForm.materialBarcode); |
| | | if (index !== -1) { |
| | | this.scannedList[index] = { |
| | | ...this.scannedList[index], |
| | | status: 'failed', |
| | | message: '请æ±å¤±è´¥' |
| | | }; |
| | | } |
| | | this.$message.error('æ£é失败') |
| | | } finally { |
| | | // æ¸
空æ¡ç æ¡ |
| | | this.scanForm.materialBarcode = '' |
| | | this.pickLoading = false |
| | | |
| | | // éæ°èç¦å°ç©ææ¡ç è¾å
¥æ¡ï¼æ¹ä¾¿ç»§ç»æ«æ |
| | | this.$nextTick(() => { |
| | | if (this.$refs.materialInput) { |
| | | this.$refs.materialInput.focus() |
| | | } |
| | | }) |
| | | } |
| | | }, |
| | | |
| | | handleReturnToWarehouse() { |
| | | if (!this.scanForm.palletCode) { |
| | | this.$message.warning('请å
æ«ææçç ') |
| | | return |
| | | } |
| | | |
| | | this.confirmMessage = `ç¡®å®è¦å°æç ${this.scanForm.palletCode} ååºåï¼` |
| | | this.currentAction = 'returnToWarehouse' |
| | | this.confirmDialogVisible = true |
| | | }, |
| | | |
| | | async executeConfirm() { |
| | | if (this.currentAction === 'returnToWarehouse') { |
| | | await this.executeReturnToWarehouse() |
| | | } |
| | | }, |
| | | |
| | | async executeReturnToWarehouse() { |
| | | this.executeLoading = true |
| | | this.returnLoading = true |
| | | |
| | | try { |
| | | const response = await this.http.post('/api/Outbound/ReturnToWarehouse', { |
| | | orderNo: this.orderNo, |
| | | palletCode: this.scanForm.palletCode, |
| | | station: stationManager.getStation() |
| | | }) |
| | | |
| | | if (response.status) { |
| | | this.$message.success('ååºæå') |
| | | this.confirmDialogVisible = false |
| | | this.resetForm() |
| | | } else { |
| | | this.$message.error(response.message || 'ååºå¤±è´¥') |
| | | } |
| | | } catch (error) { |
| | | this.$message.error('ååºå¤±è´¥') |
| | | } finally { |
| | | this.executeLoading = false |
| | | this.returnLoading = false |
| | | } |
| | | }, |
| | | |
| | | handleDialogClose() { |
| | | if (!this.executeLoading) { |
| | | this.confirmDialogVisible = false |
| | | } |
| | | }, |
| | | |
| | | // å·æ°æ«æå表ï¼ä¸»è¦æ¯ä¸ºäºéæ°è·ååç«¯ç¶æï¼ |
| | | refreshScannedList() { |
| | | // å¯ä»¥å¨è¿ééæ°éªè¯åè¡¨ä¸æ¡ç çç¶æ |
| | | this.$message.info('åè¡¨å·²å·æ°') |
| | | }, |
| | | |
| | | // æ¸
ç©ºæ«æå表 |
| | | clearScannedList() { |
| | | this.$confirm('ç¡®å®è¦æ¸
ç©ºæ«æå表åï¼', 'æç¤º', { |
| | | type: 'warning' |
| | | }).then(() => { |
| | | this.scannedList = [] |
| | | this.$message.success('å表已æ¸
空') |
| | | }).catch(() => { |
| | | // ç¨æ·åæ¶ |
| | | }) |
| | | }, |
| | | |
| | | // å é¤åä¸ªæ«æè®°å½ |
| | | removeScannedItem(barcode) { |
| | | this.scannedList = this.scannedList.filter(item => item.barcode !== barcode) |
| | | this.$message.success('å·²å é¤') |
| | | }, |
| | | |
| | | resetForm() { |
| | | this.scanForm.palletCode = '' |
| | | this.scanForm.materialBarcode = '' |
| | | this.$nextTick(() => { |
| | | if (this.$refs.palletInput) { |
| | | this.$refs.palletInput.focus() |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | // æ ¼å¼åæ¶é´ |
| | | formatTime(date) { |
| | | const year = date.getFullYear() |
| | | const month = String(date.getMonth() + 1).padStart(2, '0') |
| | | const day = String(date.getDate()).padStart(2, '0') |
| | | const hours = String(date.getHours()).padStart(2, '0') |
| | | const minutes = String(date.getMinutes()).padStart(2, '0') |
| | | const seconds = String(date.getSeconds()).padStart(2, '0') |
| | | return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}` |
| | | }, |
| | | |
| | | getStatusType(status) { |
| | | const statusMap = { |
| | | 0: 'info', // å¾
å¤ç |
| | | 1: 'warning', // è¿è¡ä¸ |
| | | 20: 'primary', // æ£éä¸ |
| | | 30: 'success', // 已宿 |
| | | 40: 'danger' // å¼å¸¸ |
| | | } |
| | | return statusMap[status] || 'info' |
| | | }, |
| | | |
| | | // æ¾ç¤ºå
¨å±é®ç½©å± |
| | | showFullScreenLoading() { |
| | | if (this.loadingInstance) { |
| | | this.loadingInstance.close() |
| | | } |
| | | this.loadingInstance = ElLoading.service({ |
| | | lock: true, |
| | | text: 'å¤çä¸...', |
| | | background: 'rgba(0, 0, 0, 0.7)', |
| | | customClass: 'custom-full-loading' |
| | | }) |
| | | }, |
| | | |
| | | // éèå
¨å±é®ç½©å± |
| | | hideFullScreenLoading() { |
| | | if (this.loadingInstance) { |
| | | this.loadingInstance.close() |
| | | this.loadingInstance = null |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .picking-container { |
| | | padding: 20px; |
| | | background-color: #f5f5f5; |
| | | min-height: 100vh; |
| | | position: relative; |
| | | overflow: hidden; |
| | | } |
| | | |
| | | /* 订åä¿¡æ¯å¡ç */ |
| | | .order-info-card { |
| | | margin-bottom: 20px; |
| | | background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); |
| | | color: white; |
| | | } |
| | | |
| | | .order-header { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | } |
| | | |
| | | .order-title { |
| | | display: flex; |
| | | align-items: center; |
| | | font-size: 18px; |
| | | font-weight: bold; |
| | | } |
| | | |
| | | .order-title i { |
| | | margin-right: 10px; |
| | | font-size: 24px; |
| | | } |
| | | |
| | | .order-label { |
| | | margin-left: 10px; |
| | | opacity: 0.9; |
| | | } |
| | | |
| | | .order-value { |
| | | font-size: 20px; |
| | | font-weight: bold; |
| | | letter-spacing: 1px; |
| | | } |
| | | |
| | | /* æ«ç åºå */ |
| | | .scan-section-card { |
| | | margin-bottom: 20px; |
| | | } |
| | | |
| | | .scan-section { |
| | | padding: 10px 0; |
| | | } |
| | | |
| | | .scan-alert { |
| | | margin-bottom: 20px; |
| | | } |
| | | |
| | | .scan-form { |
| | | margin-top: 20px; |
| | | } |
| | | |
| | | .action-buttons { |
| | | display: flex; |
| | | gap: 8px; |
| | | justify-content: center; |
| | | } |
| | | |
| | | .action-buttons .el-button { |
| | | flex: 0 0 auto; |
| | | width: 150px; |
| | | height: 40px; |
| | | font-weight: bold; |
| | | border-radius: 6px; |
| | | } |
| | | |
| | | /* è¡¨æ ¼åºå */ |
| | | .tables-section { |
| | | margin-top: 20px; |
| | | } |
| | | |
| | | .table-card { |
| | | height: 600px; |
| | | display: flex; |
| | | flex-direction: column; |
| | | } |
| | | |
| | | .card-header { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | } |
| | | |
| | | .card-title { |
| | | display: flex; |
| | | align-items: center; |
| | | font-weight: bold; |
| | | font-size: 16px; |
| | | } |
| | | |
| | | .card-title i { |
| | | margin-right: 8px; |
| | | color: #409EFF; |
| | | } |
| | | |
| | | .badge-item { |
| | | margin-left: 10px; |
| | | } |
| | | |
| | | .table-footer { |
| | | margin-top: 10px; |
| | | padding-top: 10px; |
| | | border-top: 1px solid #ebeef5; |
| | | } |
| | | |
| | | /* è¡¨æ ¼è¡æ ·å¼ */ |
| | | .el-table tbody tr:hover>td { |
| | | background-color: #f0f9ff !important; |
| | | } |
| | | |
| | | .el-table tbody tr.current-row>td { |
| | | background-color: #e1f3ff !important; |
| | | } |
| | | |
| | | /* å¯¹è¯æ¡æ ·å¼ */ |
| | | .confirm-content { |
| | | padding: 20px 0; |
| | | text-align: center; |
| | | } |
| | | |
| | | .confirm-content p { |
| | | font-size: 16px; |
| | | color: #606266; |
| | | } |
| | | |
| | | .dialog-footer { |
| | | text-align: center; |
| | | } |
| | | |
| | | /* æè¿°åè¡¨æ ·å¼ */ |
| | | ::v-deep .el-descriptions__label { |
| | | font-weight: bold; |
| | | color: #909399; |
| | | } |
| | | |
| | | ::v-deep .el-descriptions__content { |
| | | color: #606266; |
| | | } |
| | | |
| | | /* Element Plus Loading é®ç½©å±æ ·å¼ä¿®å¤ */ |
| | | ::v-deep .custom-loading { |
| | | background-color: rgba(0, 0, 0, 0.7) !important; |
| | | z-index: 9999 !important; |
| | | } |
| | | |
| | | ::v-deep .custom-loading .el-loading-mask { |
| | | background-color: rgba(0, 0, 0, 0.7) !important; |
| | | } |
| | | |
| | | ::v-deep .custom-loading .el-loading-spinner { |
| | | z-index: 10000 !important; |
| | | } |
| | | |
| | | ::v-deep .custom-loading .el-loading-text { |
| | | color: #ffffff !important; |
| | | font-weight: bold !important; |
| | | font-size: 16px !important; |
| | | } |
| | | |
| | | /* å
¨å±Loadingèªå®ä¹æ ·å¼ */ |
| | | ::v-deep .custom-full-loading { |
| | | z-index: 999999 !important; |
| | | } |
| | | |
| | | ::v-deep .custom-full-loading .el-loading-mask { |
| | | z-index: 999999 !important; |
| | | } |
| | | |
| | | ::v-deep .custom-full-loading .el-loading-spinner { |
| | | z-index: 1000000 !important; |
| | | } |
| | | |
| | | ::v-deep .custom-full-loading .el-loading-text { |
| | | color: #ffffff !important; |
| | | font-weight: bold !important; |
| | | font-size: 18px !important; |
| | | } |
| | | |
| | | /* ç¡®ä¿å¯¹è¯æ¡ä¸ä¼é®çloading */ |
| | | ::v-deep .el-dialog { |
| | | z-index: 2000 !important; |
| | | } |
| | | |
| | | ::v-deep .el-dialog__wrapper { |
| | | z-index: 2000 !important; |
| | | } |
| | | |
| | | /* ç¡®ä¿å®¹å¨ç¸å¯¹å®ä½ */ |
| | | .picking-container { |
| | | position: relative !important; |
| | | min-height: 100vh; |
| | | } |
| | | |
| | | /* è¾å
¥æ¡éå æé®æ ·å¼ */ |
| | | ::v-deep .el-input-group__append { |
| | | background-color: #409EFF !important; |
| | | border-color: #409EFF !important; |
| | | } |
| | | |
| | | ::v-deep .el-input-group__append .el-button { |
| | | color: white !important; |
| | | background-color: transparent !important; |
| | | border: none !important; |
| | | } |
| | | |
| | | /* è¡¨æ ¼æ ·å¼è°æ´ */ |
| | | ::v-deep .el-table th { |
| | | background-color: #fafafa; |
| | | font-weight: 600; |
| | | color: #303133; |
| | | } |
| | | |
| | | ::v-deep .el-table .el-text { |
| | | font-weight: 500; |
| | | } |
| | | |
| | | /* æ ç¾æ ·å¼å¢å¼º */ |
| | | ::v-deep .el-tag--small { |
| | | font-weight: 500; |
| | | } |
| | | |
| | | /* æç¤ºä¿¡æ¯æ ·å¼å¢å¼º */ |
| | | .scan-alert ::v-deep .el-alert__content { |
| | | width: 100%; |
| | | } |
| | | |
| | | .scan-alert ::v-deep .el-alert__description { |
| | | margin-top: 8px; |
| | | } |
| | | |
| | | /* Element UI ç»ä»¶æ ·å¼è¦ç */ |
| | | ::v-deep .el-card__header { |
| | | padding: 18px 20px; |
| | | border-bottom: 1px solid #ebeef5; |
| | | } |
| | | |
| | | ::v-deep .el-input__inner { |
| | | border-radius: 6px; |
| | | } |
| | | |
| | | ::v-deep .el-button--primary { |
| | | background: linear-gradient(135deg, #409EFF 0%, #3a8ee6 100%); |
| | | border: none; |
| | | } |
| | | |
| | | ::v-deep .el-button--success { |
| | | background: linear-gradient(135deg, #67C23A 0%, #5daf34 100%); |
| | | border: none; |
| | | } |
| | | |
| | | /* 徿 æ ·å¼ */ |
| | | .el-icon-document, |
| | | .el-icon-box, |
| | | .el-icon-s-grid, |
| | | .el-icon-refresh-left, |
| | | .el-icon-time, |
| | | .el-icon-circle-check { |
| | | font-size: 18px; |
| | | } |
| | | </style> |