<template>
<div class="app-container">
<el-tabs v-model="activeName" @tab-click="handleTabClick">
<el-tab-pane label="库存统计" name="first">
<div class="search">
<el-date-picker v-model="tab.table.getdataListParm.parammaps.inputDatetime" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" style="float: left;width: 250px;margin-bottom:10px;" />
<el-input v-model="tab.table.getdataListParm.parammaps.source" style="float: left;width: 245px;margin-bottom:10px;" placeholder="配方名称" />
<el-button class="successBorder" style="float: left;margin-left: 10px;margin-bottom:10px;" @click="handleSearch">查询</el-button>
<el-button class="export" style="float: right;margin-right: 10px;margin-bottom:10px;" @click="handleExport">导出</el-button>
</div>
<div class="table">
<el-table
:key="tab.table.tableKey"
v-loading="tab.table.listLoading"
element-loading-text="给我一点时间"
:data="tab.table.list"
border
fit
highlight-current-row
style="width: 100%;"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
>
<el-table-column label="饲料名称" min-width="130px" align="center">
<template slot-scope="scope">
<span>{{ scope.row.bigcowclass }}</span>
</template>
</el-table-column>
<el-table-column label="期初" min-width="130px" align="center">
<el-table-column prop="bigcowclass" align="center" label="期初库存（kg）" min-width="120" />
<el-table-column prop="bigcowclass" align="center" label="期初金额（元）" min-width="120" />
</el-table-column>
<el-table-column label="用量" min-width="110px" align="center">
<el-table-column prop="bigcowclass" align="center" label="入库重量（kg）" min-width="120" />
<el-table-column prop="bigcowclass" align="center" label="系统出库重量（kg）" min-width="120" />
<el-table-column prop="bigcowclass" align="center" label="人工用料重量（kg）" min-width="120" />
<el-table-column prop="bigcowclass" align="center" label="损耗重量（kg）" min-width="120" />
</el-table-column>
<el-table-column label="期末" min-width="130px" align="center">
<el-table-column prop="bigcowclass" align="center" label="期末库存（kg）" min-width="120" />
<el-table-column prop="bigcowclass" align="center" label="期末金额（元）" min-width="120" />
</el-table-column>
</el-table>
<pagination v-show="tab.table.total>=0" :total="tab.table.total" :page.sync="tab.table.getdataListParm.offset" :limit.sync="tab.table.getdataListParm.pagecount" @pagination="getTabList" />
</div>
</el-tab-pane>
<el-tab-pane label="用料分析" name="second">
<el-table :data="tab2.table.list" max-height="420">
<el-table-column v-for="item in tab2.table.tableConfig" :key="item.id" align="center" :label="item.label" :prop="item.prop" :width="item.width">
<el-table-column v-for="item1 in item.children" v-if="item.children || item.children.length>0" :key="item1.id" align="center" :label="item1.label" :prop="item1.prop" :width="item1.width">
<el-table-column v-for="item2 in item1.children" v-if="item1.children || item1.children.length>0" :key="item2.id" :label="item2.label" :prop="item2.prop" :width="item2.width" />
</el-table-column>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="价格分析" name="third">价格分析</el-tab-pane>
</el-tabs>
</div>
</div>
</template>
<script>
import { GetDataByName } from '@/api/common'
import Cookies from 'js-cookie'
import { parseTime } from '@/utils/index.js'
import Pagination from '@/components/Pagination'
export default {
name: 'InventoryManagement',
components: { Pagination },
data() {
return {
fileComment: [{ 'label': '商务文件评分', 'children': [{ 'label': '1' }, { 'label': '2' }, { 'label': '管理员' }] }],
activeName: 'first',
tab: {
table: {
getdataListParm: {
name: 'getBarmilkList',
page: 1,
offset: 1,
pagecount: 10,
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
startTime: '',
stopTime: '',
inputDatetime: ''
}
},
tableKey: 1,
list: [],
total: 0,
listLoading: true
}
},
tab2: {
table: {
getdataListParm: {
name: 'getBarmilkList',
page: 1,
offset: 1,
pagecount: 10,
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
startTime: '',
stopTime: '',
inputDatetime: ''
}
},
tableKey: 1,
list: [],
tableConfig: [],
total: 0,
listLoading: true
}
},
rowStyle: { maxHeight: 50 + 'px', height: 45 + 'px' },
cellStyle: { padding: 0 + 'px' }
}
},
created() {
this.getTabList()
this.getTab2List()
},
methods: {
handleTabClick() {
},
getTabList() {
this.tab.table.listLoading = true
GetDataByName(this.tab.table.getdataListParm).then(response => {
console.log('库存统计table数据', response.data.list)
if (response.data.list !== null) {
this.tab.table.list = response.data.list
this.tab.table.total = response.data.total
} else {
this.tab.table.list = []
}
setTimeout(() => {
this.tab.table.listLoading = false
}, 100)
})
},
handleSearch() {},
handleExport() {},
getTab2List() {
this.tab2.table.listLoading = true
GetDataByName(this.tab2.table.getdataListParm).then(response => {
console.log('库存统计table数据', response.data.list)
this.tab2.table.list = [{
'districtName': 10,
'timeDimension1': '00001',
'timeDimension2': '00002',
'timeDimension3': '00003',
'timeDimension4': '00004'
}, {
'districtName': 11,
'timeDimension1': '11111',
'timeDimension2': '11112',
'timeDimension3': '11113',
'timeDimension4': '11114'
}, {
'districtName': 12,
'timeDimension1': '22221',
'timeDimension2': '22222',
'timeDimension3': '22223',
'timeDimension4': '22224'
}, {
'districtName': 13,
'timeDimension1': '33331',
'timeDimension2': '33332',
'timeDimension3': '33333',
'timeDimension4': '33334'
}],
this.tab2.table.tableConfig = [{
id: 90,
label: '饲料名称',
prop: '',
width: '',
children: [{
id: 91,
label: '栏舍名称/饲料参数',
prop: 'districtName',
width: ''
}]
}, {
id: 100,
label: '饲料01',
prop: '',
width: '',
children: [{
id: 101,
label: '理论',
prop: 'timeDimension1',
width: ''
}, {
id: 102,
label: '实际',
prop: 'timeDimension2',
width: ''
}, {
id: 103,
label: '误差值',
prop: 'timeDimension2',
width: ''
}, {
id: 104,
label: '误差率',
prop: 'timeDimension2',
width: ''
}]
}, {
id: 110,
label: '饲料02',
prop: '',
width: '',
children: [{
id: 111,
label: '理论',
prop: 'timeDimension3',
width: ''
}, {
id: 112,
label: '实际',
prop: 'timeDimension4',
width: ''
}, {
id: 113,
label: '误差值',
prop: 'timeDimension2',
width: ''
}, {
id: 114,
label: '误差率',
prop: 'timeDimension2',
width: ''
}]
}]
// if (response.data.list !== null) {
// this.tab2.table.list = response.data.list
// this.tab2.table.total = response.data.total
// } else {
// this.tab2.table.list = []
// }
setTimeout(() => {
this.tab2.table.listLoading = false
}, 100)
})
}
}
}
</script>
<style lang="scss" scoped>
.search{margin-bottom:10px;}
</style>