|
@@ -0,0 +1,134 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <Toptitle title="最高库存预警表">
|
|
|
+ <slot name="titleButton">
|
|
|
+ <div style="display:flex;">
|
|
|
+ <Button @click="exportData"
|
|
|
+ type="warning"
|
|
|
+ ghost
|
|
|
+ icon='md-return-left'
|
|
|
+ style="margin-right:10px;">导出</Button>
|
|
|
+ </div>
|
|
|
+ </slot>
|
|
|
+ </Toptitle>
|
|
|
+ <div class="warehouseList_top">
|
|
|
+ <Form :label-width="100">
|
|
|
+ <FormItem label="物料分类">
|
|
|
+ <Select v-model="searchData.material_type_id"
|
|
|
+
|
|
|
+ multiple
|
|
|
+ filterable
|
|
|
+ style="width:200px">
|
|
|
+ <Option v-for="item in materialTypeList"
|
|
|
+ :key="item.id"
|
|
|
+ :value="item.id"
|
|
|
+ :label="item.title">
|
|
|
+ </Option>
|
|
|
+ </Select>
|
|
|
+ </FormItem>
|
|
|
+ <FormItem label="物料名称">
|
|
|
+ <Select v-model="searchData.material_id"
|
|
|
+
|
|
|
+ multiple
|
|
|
+ filterable
|
|
|
+ style="width:200px">
|
|
|
+ <Option v-for="item in materialNameList"
|
|
|
+ :key="item.id"
|
|
|
+ :value="item.id"
|
|
|
+
|
|
|
+ :label="item.title">
|
|
|
+ </Option>
|
|
|
+ </Select>
|
|
|
+ </FormItem>
|
|
|
+ <FormItem>
|
|
|
+ <Button type="primary"
|
|
|
+ @click="handleSearchData">搜索</Button>
|
|
|
+ </FormItem>
|
|
|
+ </Form>
|
|
|
+ </div>
|
|
|
+ <div class="warehouseList_content">
|
|
|
+ <Table :columns="tableColums"
|
|
|
+ :data="tableData"
|
|
|
+ border>
|
|
|
+ </Table>
|
|
|
+ <div class="pageSlotStyle">
|
|
|
+ <Page :page-size-opts="[10, 20, 30, 40,100,1000]"
|
|
|
+ @on-page-size-change='changeSize'
|
|
|
+ @on-change='changePage'
|
|
|
+ :current='page_index'
|
|
|
+ show-total
|
|
|
+ :total="total"
|
|
|
+ show-sizer
|
|
|
+ :page-size='page_size' />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data(){
|
|
|
+ return{
|
|
|
+ searchData:{
|
|
|
+ material_type_id:'',
|
|
|
+ material_id:''
|
|
|
+ },
|
|
|
+ materialTypeList:[],
|
|
|
+ materialNameList:[],
|
|
|
+ tableData:[],
|
|
|
+ tableColums:[
|
|
|
+ { title: '物料名称', align: 'center', key: 'title', minWidth: 120 },
|
|
|
+ { title: '规格型号', align: 'center', key: 'model', minWidth: 120 },
|
|
|
+ { title: '计量单位', align: 'center', key: 'unit', minWidth: 120 },
|
|
|
+ { title: '最高库存', align: 'center', key: 'top_number', minWidth: 120 },
|
|
|
+ { title: '现存量', align: 'center', key: 'num', minWidth: 120 },
|
|
|
+ { title: '差量', align: 'center', key: 'difference', minWidth: 120 }
|
|
|
+ ],
|
|
|
+ total:'',
|
|
|
+ page_size:10,
|
|
|
+ page_index:1,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created(){
|
|
|
+ this.getData();
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ exportData(){
|
|
|
+
|
|
|
+ },
|
|
|
+ changeSize (e) {
|
|
|
+ this.page_size = e;
|
|
|
+ this.getData()
|
|
|
+ },
|
|
|
+ changePage (e) {
|
|
|
+ this.page_index = e;
|
|
|
+ this.getData()
|
|
|
+ },
|
|
|
+ getData(row){
|
|
|
+ this.axios.get('/api/warehouse_stock_highest_list',{params:{row}}).then(res=>{
|
|
|
+ this.tableData = res.data.data;
|
|
|
+ for(let i =0;i<res.data.material;i++){
|
|
|
+ console.log(1)
|
|
|
+ this.materialNameList.push({label:res.data.material[i],value:res.data.material[i]})
|
|
|
+ }
|
|
|
+ for(let i =0;i<res.data.type_title;i++){
|
|
|
+ this.materialTypeList.push({label:res.data.type_title[i],value:res.data.type_title[i]})
|
|
|
+ }
|
|
|
+
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.warehouseList_top{
|
|
|
+ margin: 20px 0;
|
|
|
+}
|
|
|
+.ivu-form{
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+}
|
|
|
+.pageSlotStyle{
|
|
|
+ margin: 20px 0;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+</style>
|