1.3
This commit is contained in:
311
src/views/consumablesManagement/inAndOutManagement.vue
Normal file
311
src/views/consumablesManagement/inAndOutManagement.vue
Normal file
@@ -0,0 +1,311 @@
|
||||
<template>
|
||||
<div class="page-box">
|
||||
<search-bar
|
||||
:formConfigs="formConfig"
|
||||
ref="searchBarForm"
|
||||
@headBtnClick="buttonClick"
|
||||
@select-changed="selectChanged"
|
||||
/>
|
||||
<base-table
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:table-props="tableProps"
|
||||
:table-data="tableData"
|
||||
:max-height="tableH"
|
||||
>
|
||||
<method-btn
|
||||
v-if="tableBtn.length"
|
||||
slot="handleBtn"
|
||||
:width="120"
|
||||
label="操作"
|
||||
fixed="right"
|
||||
:method-list="tableBtn"
|
||||
@clickBtn="handleClick"
|
||||
/>
|
||||
</base-table>
|
||||
<pagination
|
||||
:page.sync="listQuery.current"
|
||||
:limit.sync="listQuery.size"
|
||||
:total="total"
|
||||
@pagination="getList"
|
||||
/>
|
||||
<!-- 入库 -->
|
||||
<base-dialog
|
||||
:title="addAndEdit"
|
||||
:dialogVisible="centervisible"
|
||||
@cancel="handleCancel"
|
||||
@confirm="handleConfirm"
|
||||
:before-close="handleCancel"
|
||||
>
|
||||
<in-and-out-management-add
|
||||
ref="inAndOutManagementAdd"
|
||||
@successSubmit="successSubmit"
|
||||
/>
|
||||
</base-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import InAndOutManagementAdd from './components/inAndOutManagementAdd'
|
||||
import InnerTable from './components/InnerTable'
|
||||
import { tableHeight } from '@/utils/index'
|
||||
import {
|
||||
getMaterialManagePage,
|
||||
outInRecordRecordExport
|
||||
} from '@/api/consumablesManagement'
|
||||
import { sideLibraryList, materialList } from '@/api/basicConfig'
|
||||
const tableProps = [
|
||||
{
|
||||
prop: 'line',
|
||||
label: '产线',
|
||||
minWidth: 120
|
||||
},
|
||||
{
|
||||
prop: 'sideLibraryName',
|
||||
label: '所属线边库',
|
||||
minWidth: 150
|
||||
},
|
||||
{
|
||||
prop: 'materialName',
|
||||
label: '耗材名称',
|
||||
minWidth: 150
|
||||
},
|
||||
{
|
||||
prop: 'spec',
|
||||
label: '规格',
|
||||
minWidth: 150
|
||||
},
|
||||
{
|
||||
prop: 'unit',
|
||||
label: '单位',
|
||||
minWidth: 150
|
||||
},
|
||||
{
|
||||
prop: 'stockNum',
|
||||
label: '库存数量/个',
|
||||
sortable: true,
|
||||
minWidth: 150
|
||||
},
|
||||
{
|
||||
prop: 'details',
|
||||
label: '库存详情',
|
||||
minWidth: 100,
|
||||
subcomponent: InnerTable
|
||||
},
|
||||
{
|
||||
prop: 'minNum',
|
||||
label: '最低安全库存',
|
||||
width: 150
|
||||
},
|
||||
{
|
||||
prop: 'maxNum',
|
||||
label: '最高安全库存',
|
||||
width: 150
|
||||
},
|
||||
{
|
||||
prop: 'remark',
|
||||
label: '备注',
|
||||
minWidth: 150
|
||||
}
|
||||
]
|
||||
const tableBtn = [
|
||||
{
|
||||
type: 'edit',
|
||||
btnName: '编辑'
|
||||
},
|
||||
{
|
||||
type: 'output',
|
||||
btnName: '出库'
|
||||
}
|
||||
]
|
||||
export default {
|
||||
name: 'InAndOutManagement',
|
||||
components: { InAndOutManagementAdd },
|
||||
data() {
|
||||
return {
|
||||
formConfig: [
|
||||
{
|
||||
type: 'select',
|
||||
label: '产线',
|
||||
selectOptions: JSON.parse(localStorage.getItem('publicList'))
|
||||
.proLineVoList,
|
||||
param: 'lineName',
|
||||
labelField: 'dataName',
|
||||
valueField: 'dataName',
|
||||
defaultSelect: '',
|
||||
onchange: true,
|
||||
width: 150
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
label: '线边库名称',
|
||||
selectOptions: [],
|
||||
param: 'libraryName',
|
||||
labelField: 'name',
|
||||
valueField: 'name',
|
||||
defaultSelect: '',
|
||||
width: 200
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
label: '耗材名称',
|
||||
selectOptions: [],
|
||||
param: 'materialName',
|
||||
labelField: 'name',
|
||||
valueField: 'name',
|
||||
defaultSelect: '',
|
||||
width: 150
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: '查询',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: '入库',
|
||||
name: 'add',
|
||||
color: 'primary',
|
||||
plain: true
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: '导出',
|
||||
name: 'export',
|
||||
color: 'primary',
|
||||
plain: true
|
||||
}
|
||||
],
|
||||
tableProps,
|
||||
tableData: [],
|
||||
tableBtn,
|
||||
tableH: tableHeight(275),
|
||||
total: 0,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 20
|
||||
},
|
||||
addAndEdit: '',
|
||||
centervisible: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH = tableHeight(275)
|
||||
})
|
||||
this.getMaterialList()
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
getMaterialManagePage({ ...this.listQuery }).then((res) => {
|
||||
console.log(res)
|
||||
if (res.code === 0) {
|
||||
this.total = res.data.total
|
||||
this.tableData = res.data.records
|
||||
}
|
||||
})
|
||||
},
|
||||
selectChanged(val) {
|
||||
console.log(val)
|
||||
if (val.value) {
|
||||
let id = null
|
||||
let line = JSON.parse(localStorage.getItem('publicList')).proLineVoList
|
||||
line &&
|
||||
line.map((item) => {
|
||||
if (item.dataName === val.value) {
|
||||
id = item.dataCode
|
||||
}
|
||||
})
|
||||
sideLibraryList({ id }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.formConfig[1].selectOptions = res.data
|
||||
this.formConfig[1].defaultSelect = null
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
getMaterialList() {
|
||||
materialList().then((res) => {
|
||||
console.log(res)
|
||||
if (res.code === 0) {
|
||||
this.formConfig[2].selectOptions = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
handleClick(val) {
|
||||
console.log(val)
|
||||
if (val.type === 'edit') {
|
||||
this.centervisible = true
|
||||
this.addAndEdit = '编辑'
|
||||
const param = { id: val.data.id, type: 'edit' }
|
||||
this.$nextTick(() => {
|
||||
this.$refs.inAndOutManagementAdd.init(param)
|
||||
})
|
||||
} else if (val.type === 'output') {
|
||||
this.centervisible = true
|
||||
this.addAndEdit = '出库'
|
||||
const param = { id: val.data.id, type: 'output' }
|
||||
this.$nextTick(() => {
|
||||
this.$refs.inAndOutManagementAdd.init(param)
|
||||
})
|
||||
}
|
||||
},
|
||||
buttonClick(val) {
|
||||
console.log(val)
|
||||
switch (val.btnName) {
|
||||
case 'search':
|
||||
this.listQuery.lineName = val.lineName
|
||||
this.listQuery.libraryName = val.libraryName
|
||||
this.listQuery.materialName = val.materialName
|
||||
this.listQuery.current = 1
|
||||
this.getList()
|
||||
break
|
||||
case 'add':
|
||||
this.centervisible = true
|
||||
this.addAndEdit = '入库'
|
||||
this.$nextTick(() => {
|
||||
this.$refs.inAndOutManagementAdd.init()
|
||||
})
|
||||
break
|
||||
default:
|
||||
outInRecordRecordExport({ ...this.listQuery }).then((response) => {
|
||||
console.log(response)
|
||||
let fileName = ''
|
||||
const contentDisposition = response.headers['content-disposition']
|
||||
if (contentDisposition) {
|
||||
fileName = decodeURIComponent(
|
||||
contentDisposition.slice(
|
||||
contentDisposition.indexOf('filename=') + 9
|
||||
)
|
||||
)
|
||||
}
|
||||
const blob = new Blob([response.data])
|
||||
const reader = new FileReader()
|
||||
reader.readAsDataURL(blob)
|
||||
reader.onload = (e) => {
|
||||
const a = document.createElement('a')
|
||||
a.download = fileName
|
||||
a.href = e.target.result
|
||||
document.body.appendChild(a)
|
||||
a.click()
|
||||
document.body.removeChild(a)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
handleCancel() {
|
||||
this.$refs.inAndOutManagementAdd.formClear()
|
||||
this.addAndEdit = ''
|
||||
this.centervisible = false
|
||||
},
|
||||
handleConfirm() {
|
||||
this.$refs.inAndOutManagementAdd.submitForm()
|
||||
},
|
||||
successSubmit() {
|
||||
this.handleCancel()
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user