修改采购ui
This commit is contained in:
@@ -1,38 +1,40 @@
|
||||
<template>
|
||||
<div class="erp-receipt-page">
|
||||
<el-card shadow="never" class="panel-card">
|
||||
<div slot="header" class="panel-header">
|
||||
<section class="surface-panel">
|
||||
<header class="surface-header">
|
||||
<span>收货记录</span>
|
||||
<el-button type="primary" size="mini" @click="openDialog()">新增收货</el-button>
|
||||
</div>
|
||||
<div class="toolbar">
|
||||
<el-input v-model="query.orderId" placeholder="订单ID" size="small" clearable class="toolbar-input" />
|
||||
<el-input v-model="query.itemId" placeholder="订单明细ID" size="small" clearable class="toolbar-input" />
|
||||
<el-select v-model="query.quality" placeholder="质检结果" size="small" clearable class="toolbar-input">
|
||||
<el-button type="primary" size="small" @click="openDialog()">新增收货</el-button>
|
||||
</header>
|
||||
<div class="inline-filter">
|
||||
<el-input v-model="query.orderId" placeholder="订单ID" size="small" clearable />
|
||||
<el-input v-model="query.itemId" placeholder="订单明细ID" size="small" clearable />
|
||||
<el-select v-model="query.quality" placeholder="质检结果" size="small" clearable>
|
||||
<el-option label="合格" value="OK" />
|
||||
<el-option label="不合格" value="NG" />
|
||||
</el-select>
|
||||
<el-button size="small" type="primary" @click="loadData">查询</el-button>
|
||||
<el-button size="small" @click="resetQuery">重置</el-button>
|
||||
<div class="filter-actions">
|
||||
<el-button size="small" type="primary" @click="loadData">查询</el-button>
|
||||
<el-button size="small" @click="resetQuery">重置</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-table :data="list" border size="small" v-loading="loading">
|
||||
<el-table-column prop="receiptId" label="ID" width="80" />
|
||||
<el-table-column prop="orderId" label="订单ID" width="120" />
|
||||
<el-table-column prop="itemId" label="明细ID" width="120" />
|
||||
<el-table-column prop="receivedQty" label="收货数量" width="120" />
|
||||
<el-table-column prop="qualityResult" label="质检结果" width="120">
|
||||
<el-table-column prop="orderId" label="订单ID" />
|
||||
<el-table-column prop="itemId" label="明细ID" />
|
||||
<el-table-column prop="receivedQty" label="收货数量" />
|
||||
<el-table-column prop="qualityResult" label="质检结果">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :type="scope.row.qualityResult === 'NG' ? 'danger' : 'success'" size="mini">
|
||||
{{ scope.row.qualityResult || 'OK' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="receiptTime" label="收货时间" width="160" />
|
||||
<el-table-column label="备注" min-width="160" prop="remark" />
|
||||
<el-table-column prop="receiptTime" label="收货时间" />
|
||||
<el-table-column label="备注" prop="remark" />
|
||||
<el-table-column label="操作" width="140">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" size="mini" @click="openDialog(scope.row)">编辑</el-button>
|
||||
<el-button type="text" size="mini" style="color:#c0392b" @click="handleDelete(scope.row)">删除</el-button>
|
||||
<el-button type="text" size="mini" class="danger" @click="handleDelete(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@@ -43,19 +45,19 @@
|
||||
:limit.sync="query.pageSize"
|
||||
@pagination="loadData"
|
||||
/>
|
||||
</el-card>
|
||||
</section>
|
||||
|
||||
<el-card shadow="never" class="panel-card">
|
||||
<div slot="header" class="panel-header">
|
||||
<section class="surface-panel">
|
||||
<header class="surface-header">
|
||||
<span>到货趋势</span>
|
||||
</div>
|
||||
</header>
|
||||
<el-table :data="chartData" border size="small" height="300">
|
||||
<el-table-column prop="date" label="日期" width="140" />
|
||||
<el-table-column prop="date" label="日期" />
|
||||
<el-table-column prop="totalQty" label="累计收货(吨)" />
|
||||
<el-table-column prop="qualifiedQty" label="合格数量(吨)" />
|
||||
<el-table-column prop="ngQty" label="不合格(吨)" />
|
||||
</el-table>
|
||||
</el-card>
|
||||
</section>
|
||||
|
||||
<el-dialog :title="dialog.title" :visible.sync="dialog.visible" width="480px">
|
||||
<el-form :model="dialog.form" :rules="rules" ref="form" label-width="100px" size="small">
|
||||
@@ -187,28 +189,40 @@ export default {
|
||||
<style lang="scss" scoped>
|
||||
.erp-receipt-page {
|
||||
padding: 16px;
|
||||
background: #eef1f3;
|
||||
min-height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
}
|
||||
.panel-card {
|
||||
margin-bottom: 18px;
|
||||
border: 1px solid #d0d5d8;
|
||||
.surface-panel {
|
||||
background: #fff;
|
||||
border: 1px solid #d6dce1;
|
||||
border-radius: 4px;
|
||||
padding: 16px;
|
||||
}
|
||||
.panel-header {
|
||||
.surface-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-weight: 600;
|
||||
color: #1f2d3d;
|
||||
}
|
||||
.toolbar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.toolbar-input {
|
||||
width: 140px;
|
||||
margin-right: 8px;
|
||||
.inline-filter {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
margin-bottom: 12px;
|
||||
> *:not(.filter-actions) {
|
||||
flex: 1 1 150px;
|
||||
}
|
||||
.filter-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
}
|
||||
.danger {
|
||||
color: #c0392b;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user