nrwms_web/src/views/business-data/asnDetail/index.vue

312 lines
10 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="app-container">
<!--工具栏-->
<div class="head-container">
<el-form ref="asnForm" :inline="true" :model="asnFrom" :rules="rules" size="small" label-width="80px">
<el-form-item label="系统单号" prop="relatedBill1">
<el-input v-model="asnFrom.relatedBill1" style="width: 140px;" />
</el-form-item>
<el-form-item label="订单来源">
<el-input v-model="asnFrom.orderOrigin" style="width: 140px;" />
</el-form-item>
<el-form-item label="货主" filters filter-method>
<el-input v-model="asnFrom.structure" style="width: 140px;" />
</el-form-item>
<el-form-item label="登记单号">
<el-input v-model="asnFrom.relatedBill2" style="width: 140px;" />
</el-form-item>
<el-form-item label="订单状态" prop="status">
<el-select
v-model="asnFrom.status"
filterable
placeholder="订单状态"
style="width: 140px;"
>
<el-option
v-for="item in dict.asn_status"
:key="item.id"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="单据类型" prop="billType">
<el-select v-model="asnFrom.billType" value-key="id" filterable placeholder="请选择单据类型"
style="width: 140px;">
<el-option
v-for="item in billTypeList"
:key="item.id"
:label="item.name"
:value="item"
/>
</el-select>
</el-form-item>
</el-form>
<el-divider></el-divider>
<!--如果想在工具栏加入更多按钮,可以使用插槽方式, slot = 'left' or 'right'-->
<crudOperation :permission="permission" :tableKey="this.$options.name">
<el-button
slot="left"
v-permission="permission.edit"
class="filter-item"
type="primary"
size="mini"
@click="editAsn()"
>
保存
</el-button>
<el-button
slot="right"
v-permission="permission.add"
class="filter-item"
type="primary"
size="mini"
plain="plain"
icon="el-icon-document-add"
@click="crud.toAdd"
>
添加物料
</el-button>
</crudOperation>
<!--表单组件-->
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="500px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="120px">
<el-form-item label="行号" prop="lineNo">
<el-input v-model="form.lineNo" style="width: 200px;" />
</el-form-item>
<el-form-item label="物料" prop="item" style="width: 200px">
<el-select v-model="form.item" value-key="id" filterable placeholder="请选择物料"
style="width: 200px;">
<el-option
v-for="item in itemList"
:key="item.id"
:label="item.code"
:value="item"
/>
</el-select>
</el-form-item>
<el-form-item label="订单数量">
<el-input v-model="form.orderQty" style="width: 200px;"/>
</el-form-item>
<el-form-item label="收货数量">
<el-input v-model="form.receivedQty" style="width: 200px;"/>
</el-form-item>
<el-form-item label="上架数量">
<el-input v-model="form.putQty" style="width: 200px;"/>
</el-form-item>
<el-form-item label="成品物料编码">
<el-input v-model="form.propC1" style="width: 200px;"/>
</el-form-item>
<el-form-item label="中标批次名称">
<el-input v-model="form.propC2" style="width: 200px;"/>
</el-form-item>
<el-form-item label="序列号">
<el-input type="textarea" v-model="form.propC3" style="width: 270px;"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
</div>
</el-dialog>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" height="67vh" size="small" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column prop="asn.relatedBill1" label="入库单号" width="100"/>
<el-table-column prop="asn.billType.name" label="单据类型" width="100"/>
<el-table-column prop="asn.status" label="入库单状态" width="100">
<template slot-scope="scope">
{{ dict.label.asn_status[scope.row.asn.status] }}
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" prop="lineNo" width="50" label="行号">
<template slot-scope="scope">
<div>{{ scope.row.lineNo }}</div>
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" prop="itemCode" label="物料编码">
<template slot-scope="scope">
<div>{{ scope.row.item.code }}</div>
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" prop="itemName" label="物料名称">
<template slot-scope="scope">
<div>{{ scope.row.item.name }}</div>
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" prop="propC4" label="操作方式">
<template slot-scope="scope">
<div>{{ scope.row.propC4 }}</div>
</template>
</el-table-column>
<el-table-column prop="status" label="状态">
<template slot-scope="scope">
{{ dict.label.asn_status[scope.row.status] }}
</template>
</el-table-column>
<el-table-column prop="orderQty" label="订单数量"></el-table-column>
<el-table-column prop="receivedQty" label="收货数量"/>
<el-table-column prop="putQty" label="上架数量"/>
<el-table-column prop="propC1" label="中标批次名称"/>
<el-table-column prop="propC2" label="成品物料编码"/>
<el-table-column prop="propC3" label="序列号" :show-overflow-tooltip="true"/>
<el-table-column prop="createTime" label="创建时间" width="135" />
<el-table-column v-if="checkPer(['admin','asnDetail:edit','asnDetail:del'])" :show-overflow-tooltip="false" label="操作" fixed="right" width="150px" align="center">
<template slot-scope="scope">
<udOperation
:data="scope.row"
:permission="permission"
/>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<div style="float: right;">
<pagination />
</div>
</div>
</div>
</template>
<script>
import crudOperation from '@crud/CRUD.operation'
import crudAsnDetail from '@/api/asnDetail'
import crudItem from '@/api/item'
import crudAsn from '@/api/asn'
import crudBillType from '@/api/billType'
import {selectEgvSceneAll} from '@/api/agvScene'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import udOperation from '@crud/UD.operation'
import pagination from '@crud/Pagination'
const defaultForm = {
id: null,
asn:{id:null},
item: null,
stock: null,
lineNo: null,
po: null,
status: 'OPEN',
orderQty: 0,
receivedQty: 0,
moveQty: 0,
putQty: 0,
weight: 0,
volume: 0,
remark: null,
propC1: null,
propC2: null,
propC3: null,
propC4: null,
propC5: null,
propC6: null,
propD1: null,
propD2: null,
deptId: null,
sourceName: null,
sourceId: null,
createBy: null,
updateBy: null,
createTime: null,
updateTime: null
}
export default {
name: 'AsnDetail',
// eslint-disable-next-line vue/no-unused-components
components: { pagination, crudOperation, rrOperation, udOperation },
mixins: [presenter(), header(), form(defaultForm), crud()],
dicts: ['asn_status'],
cruds() {
return CRUD({ title: '入库明细', url: 'api/asnDetail', idField: 'id', sort: 'id,desc', crudMethod: { ...crudAsnDetail },
optShow: {
add: false,
edit: false,
del: false,
download: false
},
queryOnPresenterCreated: false
})
},
data() {
return {
show_update: true,
queryTypeOptions: [
{ key: 'code', display_name: '代码' },
{ key: 'name', display_name: '名称' },
{ key: 'enabled', display_name: '状态' },
{ key: 'heat', display_name: '热度' }
],
permission: {
add: ['admin', 'asnDetail:add'],
edit: ['admin', 'asnDetail:edit'],
del: ['admin', 'asnDetail:del'],
download: ['admin', 'asnDetail:download']
},
rules: {
code: [
{ required: true, message: '库区编号不能为空', trigger: 'blur' }
]
},
itemList:[],
billTypeList:[],
asnFrom:{}
}
},
mounted() {
this.getItemList()
this.getBillTypeList()
this.defaultTableList()
},
methods: {
// 钩子在获取表格数据之前执行false 则代表不获取数据
[CRUD.HOOK.beforeRefresh]() {
return true
},
// 加载单头
defaultTableList() {
if (this.$route.query.asn.id===undefined){
this.crud.notify("找不到入库单",400)
}else {
this.asn = this.$route.query.asn
this.query.asnId = this.asn.id
defaultForm.asn.id = this.asn.id
this.asnFrom = this.asn
this.crud.toQuery()
}
},
getItemList() {
crudItem.getItemsList({}).then(res => {
this.itemList = res.map(function (obj) {
if (obj.hasChildren) {
obj.children = null
}
return obj
})
})
},
getBillTypeList() {
crudBillType.getBillType({}).then(res => {
this.billTypeList = res.map(function(obj) {
if (obj.hasChildren) {
obj.children = null
}
return obj
})
})
},
editAsn(){
crudAsn.edit(this.asnFrom).then(res => {
this.crud.notify("保存成功",200)
})
}
}
}
</script>
<style scoped>
</style>