2 changed files with 626 additions and 356 deletions
@ -1,132 +1,495 @@ |
|||||
<template> |
<template> |
||||
<div> |
<div> |
||||
<div class="pda-container"> |
|
||||
<div class="status-bar"> |
|
||||
<div class="goBack" @click="$router.back()"><i class="el-icon-arrow-left"></i>上一页</div> |
|
||||
<div class="goBack">检验合格入库</div> |
|
||||
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div> |
|
||||
</div> |
|
||||
<!-- 扫描输入区 --> |
|
||||
<div class="scan-box"> |
|
||||
<input |
|
||||
v-model="scanCode" |
|
||||
placeholder="扫描PO条码或输入PO号" |
|
||||
@keyup.enter="addItem" |
|
||||
ref="scanCodeRef" |
|
||||
/> |
|
||||
</div> |
|
||||
|
<div class="pda-container"> |
||||
|
<div class="status-bar"> |
||||
|
<div class="goBack" @click="handleBack"><i class="el-icon-arrow-left"></i>上一页</div> |
||||
|
<div class="goBack">检验合格入库</div> |
||||
|
<div class="network" style="color: #fff" @click="$router.push({ path: '/' })">🏠首页</div> |
||||
|
</div> |
||||
|
<div style="overflow-y: auto"> |
||||
|
<!-- Step 1: 扫描或查询检验合格单据 --> |
||||
|
<div v-if="processFlag === 1"> |
||||
|
<div class="scan-box" style="margin: 2px;"> |
||||
|
<el-input clearable v-model="scanCode" placeholder="扫描入库单条码或输入单号" |
||||
|
@keyup.enter.native="searchQualifiedList" ref="scanCodeRef" /> |
||||
|
</div> |
||||
|
<!-- <div class="filter-box" style="margin: 2px;"> |
||||
|
<el-button type="text" @click="searchQualifiedList" style="font-size: 16px;">查询检验合格单据</el-button> |
||||
|
</div>--> |
||||
|
<div class="item-list" v-if="qualifiedList.length > 0" style="margin: 2px;"> |
||||
|
<el-form label-position="top" style="margin: 3px;"> |
||||
|
<el-row :gutter="5" @click.native="selectInboundItem(qualifiedDetail)" |
||||
|
v-for="(qualifiedDetail, index) in qualifiedList" :key="index" |
||||
|
:class="index < qualifiedList.length - 1 ? 'bottom-line-row' : ''"> |
||||
|
<el-col :span="8"> |
||||
|
<el-form-item label="物料编码"><span>{{ qualifiedDetail.partNo }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="8"> |
||||
|
<el-form-item label="入库单号"><span>{{ qualifiedDetail.transNo }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="8"> |
||||
|
<el-form-item label=""> |
||||
|
<el-button type="text" class="inboundButton" @click="selectInboundItem(qualifiedDetail)" |
||||
|
style="margin-top: 10px;" size="small">入库</el-button> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="24"> |
||||
|
<el-form-item label="物料描述"><span>{{ qualifiedDetail.partDesc }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="6"> |
||||
|
<el-form-item label="合格数量"><span style="color: #67C23A;">{{ qualifiedDetail.qualifiedQty }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="6"> |
||||
|
<el-form-item label="批次号"><span>{{ qualifiedDetail.batchNo }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="6"> |
||||
|
<el-form-item label="PO号"><span>{{ qualifiedDetail.orderRef1 }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="6"> |
||||
|
<el-form-item label="检验日期"><span>{{ formatDate(qualifiedDetail.inspectionDate) }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
<!-- 商品列表区 --> |
|
||||
<div class="item-list"> |
|
||||
<el-table :height="240" :data="items" @row-click="rowClick" |
|
||||
stripe highlight-current-row border :row-style="{ height: '30px' }" style="width: 100%;"> |
|
||||
<el-table-column prop="code" header-align="center" align="center" label="商品编码"></el-table-column> |
|
||||
<el-table-column prop="qty" header-align="center" align="center" label="数量" width="42"></el-table-column> |
|
||||
<el-table-column prop="recvQty" header-align="center" align="center" label="入库数量"> |
|
||||
<template slot-scope="scope"> |
|
||||
<el-input v-model="scope.row.recvQty" style="height: 11px;width:98%"></el-input> |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="locnCode" header-align="center" align="center" label="库位"> |
|
||||
<template slot-scope="scope"> |
|
||||
<el-input v-model="scope.row.locnCode" style="height: 11px;width:98%"></el-input> |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
</el-table> |
|
||||
</div> |
|
||||
|
<!-- Step 2: 入库确认 --> |
||||
|
<div v-if="processFlag === 2"> |
||||
|
<el-form label-position="top" class="form-section" style="margin: 5px;"> |
||||
|
<el-row :gutter="20"> |
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="入库单号"> |
||||
|
<el-input v-model="inboundItem.transNo" disabled /> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="物料编码"> |
||||
|
<el-input v-model="inboundItem.partNo" disabled /> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="24"> |
||||
|
<el-form-item label="物料描述"> |
||||
|
<el-input v-model="inboundItem.partDesc" disabled /> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="合格数量"> |
||||
|
<el-input v-model="inboundItem.qualifiedQty" disabled style="color: #67C23A;" /> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="批次号"> |
||||
|
<el-input v-model="inboundItem.batchNo" disabled /> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="PO号"> |
||||
|
<el-input v-model="inboundItem.orderRef1" disabled /> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="检验日期"> |
||||
|
<el-input :value="formatDate(inboundItem.inspectionDate)" disabled /> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
|
||||
<!-- 操作按钮区 --> |
|
||||
<el-button prevent-re-click class="submit-btn" @click="submit">确认入库</el-button> |
|
||||
</div> |
|
||||
<el-dialog |
|
||||
style="font-size: 12px" |
|
||||
v-drag |
|
||||
:title="'Dialog'" |
|
||||
:visible.sync="siteVisible" |
|
||||
width="260px" :append-to-body="true" > |
|
||||
<el-form label-position="top" style="margin-left: 7px;margin-top: 10px;"> |
|
||||
<el-row :gutter="20"> |
|
||||
<el-col :span="24"> |
|
||||
<el-form-item :label="'Test'" > |
|
||||
<el-radio label="Y">Y</el-radio> |
|
||||
<el-radio label="N">N</el-radio> |
|
||||
</el-form-item> |
|
||||
</el-col> |
|
||||
</el-row> |
|
||||
</el-form> |
|
||||
<el-footer style="height:40px;margin-top: 10px;text-align:center"> |
|
||||
<el-button type="primary" @click="">确定</el-button> |
|
||||
<el-button type="primary" @click="siteVisible=false">关闭</el-button> |
|
||||
</el-footer> |
|
||||
</el-dialog> |
|
||||
|
<!-- 入库信息确认区域 --> |
||||
|
<el-col :span="24" style="border-top: 1px solid #ddd; padding-top: 15px; margin-top: 10px;"> |
||||
|
<h4 style="margin: 0 0 15px 0; color: #67C23A;">入库信息确认</h4> |
||||
|
</el-col> |
||||
|
|
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="入库数量"> |
||||
|
<el-input v-model="inboundData.inboundQty" type="number" |
||||
|
:max="inboundItem.qualifiedQty" /> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="目标库位"> |
||||
|
<el-input v-model="inboundData.targetLocationId" placeholder="请输入目标库位" /> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
|
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="入库日期"> |
||||
|
<el-date-picker v-model="inboundData.inboundDate" type="date" |
||||
|
format="yyyy-MM-dd" value-format="yyyy-MM-dd" |
||||
|
placeholder="选择入库日期" style="width: 100%" /> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="12"> |
||||
|
<el-form-item label="操作员"> |
||||
|
<el-input v-model="inboundData.operatorName" placeholder="操作员姓名" /> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
|
||||
|
<!-- |
||||
|
<el-col :span="24"> |
||||
|
<el-form-item label="入库备注"> |
||||
|
<el-input v-model="inboundData.inboundRemark" type="textarea" rows="3" |
||||
|
placeholder="请输入入库备注信息" /> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
--> |
||||
|
|
||||
|
<!-- 操作按钮 --> |
||||
|
<el-col :span="8"> |
||||
|
<el-form-item> |
||||
|
<el-button type="text" style="font-size: 16px;" @click="processFlag = 1">回退</el-button> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="8"> |
||||
|
<el-form-item> |
||||
|
<el-button type="text" style="font-size: 16px; color: #67C23A;" @click="confirmInbound"> |
||||
|
确认入库 |
||||
|
</el-button> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="8"> |
||||
|
<el-form-item> |
||||
|
<el-button type="text" style="font-size: 16px;" @click="$router.push('/')">退出</el-button> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
|
||||
|
<!-- Step 3: 入库历史查询 --> |
||||
|
<div v-if="processFlag === 3"> |
||||
|
<div class="filter-box" style="margin: 2px;"> |
||||
|
<el-button type="text" @click="searchInboundHistory" style="font-size: 16px;">查询入库历史</el-button> |
||||
|
</div> |
||||
|
<div class="item-list" v-if="historyList.length > 0" style="margin: 2px;"> |
||||
|
<el-form label-position="top" style="margin: 3px;"> |
||||
|
<el-row :gutter="5" v-for="(historyDetail, index) in historyList" :key="index" |
||||
|
:class="index < historyList.length - 1 ? 'bottom-line-row' : ''"> |
||||
|
<el-col :span="8"> |
||||
|
<el-form-item label="物料编码"><span>{{ historyDetail.partNo }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="8"> |
||||
|
<el-form-item label="入库单号"><span>{{ historyDetail.transNo }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="8"> |
||||
|
<el-form-item label="入库状态"> |
||||
|
<span style="color: #67C23A;">已入库</span> |
||||
|
</el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="24"> |
||||
|
<el-form-item label="物料描述"><span>{{ historyDetail.partDesc }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="6"> |
||||
|
<el-form-item label="入库数量"><span>{{ historyDetail.inboundQty }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="6"> |
||||
|
<el-form-item label="批次号"><span>{{ historyDetail.batchNo }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="6"> |
||||
|
<el-form-item label="操作员"><span>{{ historyDetail.operatorName }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
<el-col :span="6"> |
||||
|
<el-form-item label="入库日期"><span>{{ formatDate(historyDetail.inboundDate) }}</span></el-form-item> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 底部导航 --> |
||||
|
<!-- <div class="bottom-nav"> |
||||
|
<el-button :type="processFlag === 1 ? 'primary' : 'text'" @click="processFlag = 1">待入库</el-button> |
||||
|
<el-button :type="processFlag === 3 ? 'primary' : 'text'" @click="processFlag = 3">入库历史</el-button> |
||||
|
</div>--> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
|
import { getQualifiedInspectionList, confirmQualifiedInbound, getInboundHistory } from "@/api/po/po.js"; |
||||
|
|
||||
export default { |
export default { |
||||
data() { |
data() { |
||||
return { |
return { |
||||
siteVisible: false, |
|
||||
|
processFlag: 1, // 1-检验合格列表, 2-入库确认, 3-入库历史 |
||||
scanCode: '', |
scanCode: '', |
||||
items: [{code: 'A001', qty: 1}, {code: 'A002', qty: 2}] |
|
||||
} |
|
||||
}, |
|
||||
computed: { |
|
||||
totalQty() { |
|
||||
return this.items.reduce((sum, item) => sum + item.qty, 0) |
|
||||
} |
|
||||
|
qualifiedList: [], |
||||
|
historyList: [], |
||||
|
inboundItem: {}, |
||||
|
inboundData: { |
||||
|
inboundQty: '', |
||||
|
targetLocationId: '', |
||||
|
inboundDate: '', |
||||
|
operatorName: '', |
||||
|
inboundRemark: '' |
||||
|
} |
||||
|
}; |
||||
}, |
}, |
||||
methods: { |
methods: { |
||||
rowClick(row){ |
|
||||
|
handleBack() { |
||||
|
if (this.processFlag === 1) { |
||||
|
this.$router.back(); |
||||
|
} else if (this.processFlag === 2) { |
||||
|
this.processFlag = 1; |
||||
|
this.resetInboundData(); |
||||
|
} else { |
||||
|
this.processFlag = 1; |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
// 查询检验合格单据 |
||||
|
searchQualifiedList() { |
||||
|
const params = { |
||||
|
site: '1' // 默认站点 |
||||
|
}; |
||||
|
if (this.scanCode) { |
||||
|
params.transNo = this.scanCode; |
||||
|
} |
||||
|
|
||||
|
getQualifiedInspectionList(params).then(({ data }) => { |
||||
|
if (data.code === 0) { |
||||
|
this.qualifiedList = data.rows || []; |
||||
|
if (this.qualifiedList.length === 0) { |
||||
|
this.$message.success("暂无检验合格待入库单据"); |
||||
|
} |
||||
|
} else { |
||||
|
this.$message.error(data.msg || "查询失败"); |
||||
|
} |
||||
|
}).catch(error => { |
||||
|
this.$message.error("查询失败"); |
||||
|
console.error(error); |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
// 选择入库项目 |
||||
|
selectInboundItem(item) { |
||||
|
this.inboundItem = { ...item }; |
||||
|
this.resetInboundData(); |
||||
|
// 默认入库数量为合格数量 |
||||
|
this.inboundData.inboundQty = item.qualifiedQty; |
||||
|
this.inboundData.targetLocationId = item.locationId; // 默认使用原库位 |
||||
|
this.inboundData.inboundDate = this.getCurrentDate(); |
||||
|
this.inboundData.operatorName = 'current_user'; // 这里应该从用户信息中获取 |
||||
|
this.processFlag = 2; |
||||
|
}, |
||||
|
|
||||
|
// 确认入库 |
||||
|
confirmInbound() { |
||||
|
// 验证必填项 |
||||
|
if (!this.inboundData.inboundQty || this.inboundData.inboundQty <= 0) { |
||||
|
return this.$message.error("请输入有效的入库数量"); |
||||
|
} |
||||
|
|
||||
|
if (!this.inboundData.targetLocationId) { |
||||
|
return this.$message.error("请输入目标库位"); |
||||
|
} |
||||
|
|
||||
|
if (!this.inboundData.inboundDate) { |
||||
|
return this.$message.error("请选择入库日期"); |
||||
|
} |
||||
|
|
||||
|
const inboundQty = parseFloat(this.inboundData.inboundQty); |
||||
|
const qualifiedQty = parseFloat(this.inboundItem.qualifiedQty); |
||||
|
|
||||
|
if (inboundQty > qualifiedQty) { |
||||
|
return this.$message.error("入库数量不能大于合格数量"); |
||||
|
} |
||||
|
|
||||
|
const params = { |
||||
|
site: this.inboundItem.site, |
||||
|
transNo: this.inboundItem.transNo, |
||||
|
itemNo: this.inboundItem.itemNo, |
||||
|
partNo: this.inboundItem.partNo, |
||||
|
batchNo: this.inboundItem.batchNo, |
||||
|
inboundQty: inboundQty, |
||||
|
targetLocationId: this.inboundData.targetLocationId, |
||||
|
inboundDate: this.inboundData.inboundDate, |
||||
|
operatorName: this.inboundData.operatorName, |
||||
|
inboundRemark: this.inboundData.inboundRemark, |
||||
|
warehouseId: this.inboundItem.warehouseId, |
||||
|
orderRef1: this.inboundItem.orderRef1, |
||||
|
orderRef2: this.inboundItem.orderRef2, |
||||
|
orderRef3: this.inboundItem.orderRef3 |
||||
|
}; |
||||
|
|
||||
|
confirmQualifiedInbound(params).then(({ data }) => { |
||||
|
if (data.code === 0) { |
||||
|
this.$message.success("检验合格入库成功"); |
||||
|
this.processFlag = 1; |
||||
|
this.resetInboundData(); |
||||
|
this.searchQualifiedList(); // 刷新列表 |
||||
|
} else { |
||||
|
this.$message.error(data.msg || "入库失败"); |
||||
|
} |
||||
|
}).catch(error => { |
||||
|
this.$message.error("入库失败"); |
||||
|
console.error(error); |
||||
|
}); |
||||
}, |
}, |
||||
addItem() { |
|
||||
if (!this.scanCode) return |
|
||||
this.items.push({ |
|
||||
code: this.scanCode, |
|
||||
qty: 1 |
|
||||
}) |
|
||||
this.scanCode = '' |
|
||||
|
|
||||
|
// 查询入库历史 |
||||
|
searchInboundHistory() { |
||||
|
const params = { |
||||
|
site: '1' |
||||
|
}; |
||||
|
|
||||
|
getInboundHistory(params).then(({ data }) => { |
||||
|
if (data.code === 0) { |
||||
|
this.historyList = data.rows || []; |
||||
|
if (this.historyList.length === 0) { |
||||
|
this.$message.info("暂无入库历史记录"); |
||||
|
} |
||||
|
} else { |
||||
|
this.$message.error(data.msg || "查询失败"); |
||||
|
} |
||||
|
}).catch(error => { |
||||
|
this.$message.error("查询失败"); |
||||
|
console.error(error); |
||||
|
}); |
||||
}, |
}, |
||||
removeItem(index) { |
|
||||
this.items.splice(index, 1) |
|
||||
|
|
||||
|
// 重置入库数据 |
||||
|
resetInboundData() { |
||||
|
this.inboundData = { |
||||
|
inboundQty: '', |
||||
|
targetLocationId: '', |
||||
|
inboundDate: '', |
||||
|
operatorName: '', |
||||
|
inboundRemark: '' |
||||
|
}; |
||||
|
}, |
||||
|
|
||||
|
// 获取当前日期 |
||||
|
getCurrentDate() { |
||||
|
const now = new Date(); |
||||
|
return now.getFullYear() + '-' + |
||||
|
String(now.getMonth() + 1).padStart(2, '0') + '-' + |
||||
|
String(now.getDate()).padStart(2, '0'); |
||||
}, |
}, |
||||
submit() { |
|
||||
alert(`已提交${this.items.length}种商品`) |
|
||||
this.items = [] |
|
||||
|
|
||||
|
// 格式化日期 |
||||
|
formatDate(date) { |
||||
|
if (!date) return ''; |
||||
|
const d = new Date(date); |
||||
|
return d.getFullYear() + '-' + |
||||
|
String(d.getMonth() + 1).padStart(2, '0') + '-' + |
||||
|
String(d.getDate()).padStart(2, '0'); |
||||
} |
} |
||||
}, |
}, |
||||
|
|
||||
mounted() { |
mounted() { |
||||
this.$nextTick(() => { |
this.$nextTick(() => { |
||||
this.$refs.scanCodeRef.focus() |
|
||||
}) |
|
||||
|
if (this.$refs.scanCodeRef) { |
||||
|
this.$refs.scanCodeRef.focus(); |
||||
|
} |
||||
|
}); |
||||
|
// 默认加载检验合格列表 |
||||
|
this.searchQualifiedList(); |
||||
} |
} |
||||
} |
|
||||
|
}; |
||||
</script> |
</script> |
||||
|
|
||||
<style scoped> |
<style scoped> |
||||
|
.pda-container { |
||||
|
height: 100vh; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
background: #f5f5f5; |
||||
|
} |
||||
|
|
||||
|
.status-bar { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
//background: #67C23A; |
||||
|
color: white; |
||||
|
padding: 10px 15px; |
||||
|
font-size: 16px; |
||||
|
} |
||||
|
|
||||
|
.goBack { |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
|
||||
.scan-box input { |
.scan-box input { |
||||
width: 100%; |
width: 100%; |
||||
padding: 12px; |
padding: 12px; |
||||
font-size: 16px; |
font-size: 16px; |
||||
} |
} |
||||
|
|
||||
|
.filter-box { |
||||
|
text-align: center; |
||||
|
padding: 10px; |
||||
|
} |
||||
|
|
||||
.item-list { |
.item-list { |
||||
flex: 1; |
flex: 1; |
||||
overflow-y: auto; |
overflow-y: auto; |
||||
margin: 20px 0; |
|
||||
|
margin: 10px 0; |
||||
|
border: 1px solid rgba(200, 200, 200, 0.8); |
||||
|
background: white; |
||||
|
} |
||||
|
|
||||
|
.item-list span { |
||||
|
color: #000; |
||||
|
font-size: 15px; |
||||
|
} |
||||
|
|
||||
|
.bottom-line-row { |
||||
|
border-bottom: 1px solid rgba(200, 200, 200, 0.8); |
||||
|
} |
||||
|
|
||||
|
.inboundButton { |
||||
|
font-size: 16px; |
||||
|
border-radius: 3px; |
||||
|
color: #67C23A; |
||||
} |
} |
||||
|
|
||||
.item-row { |
|
||||
|
.item-list .el-row { |
||||
|
cursor: pointer; |
||||
|
transition: background 0.3s; |
||||
|
padding: 10px; |
||||
|
} |
||||
|
|
||||
|
.item-list .el-row:hover { |
||||
|
background: #f5f7fa; |
||||
|
} |
||||
|
|
||||
|
.form-section { |
||||
|
background: white; |
||||
|
border-radius: 5px; |
||||
|
} |
||||
|
|
||||
|
.form-section >>> .el-col { |
||||
|
margin-bottom: 12px; |
||||
|
} |
||||
|
|
||||
|
.bottom-nav { |
||||
display: flex; |
display: flex; |
||||
justify-content: space-between; |
|
||||
padding: 8px; |
|
||||
border-bottom: 1px solid #eee; |
|
||||
|
justify-content: space-around; |
||||
|
padding: 10px; |
||||
|
background: white; |
||||
|
border-top: 1px solid #ddd; |
||||
} |
} |
||||
|
|
||||
/deep/ .el-table .cell { |
|
||||
line-height: 24px; |
|
||||
font-size: 12px; |
|
||||
height: 24px; |
|
||||
|
.bottom-nav .el-button { |
||||
|
flex: 1; |
||||
|
margin: 0 5px; |
||||
|
} |
||||
|
|
||||
|
/* 响应式调整 */ |
||||
|
@media (max-width: 768px) { |
||||
|
.status-bar { |
||||
|
font-size: 14px; |
||||
|
padding: 8px 10px; |
||||
|
} |
||||
|
|
||||
|
.scan-box input { |
||||
|
padding: 10px; |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
|
||||
|
.item-list span { |
||||
|
font-size: 13px; |
||||
|
} |
||||
} |
} |
||||
</style> |
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue