<template> <div class="app-container"> <div class="search"> <el-date-picker v-model="table.getdataListParm.parammaps.inputDatetime" class="inputDatetime filter-item" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" style="width: 250px;" /> <el-button class="el-icon-arrow-left elIconArrowLeft" @click="handleBefore" /> <el-button class="el-icon-arrow-right elIconArrowRight" @click="handleNext" /> <el-button class="successBorder" @click="handleSearch">查询</el-button> </div> <div class="operation"> <el-button class="success" icon="el-icon-plus" @click="handleCreate">新增盘点单</el-button> <el-button class="success" icon="el-icon-upload2" @click="handleInventoryList">下载盘点单</el-button> <el-upload style="float: right;" :headers="headers" :data="uploadData" :action="uploadExcelUrl" :show-file-list="false" :before-upload="beforeImport" :on-success="handleImportSuccess"> <el-button class="import" icon="el-icon-download" style="float: right;">导入</el-button> </el-upload> <el-button class="import" icon="el-icon-upload2" style="float: right;margin-right: 10px;" @click="handleExport(1)">导出</el-button> </div> <div class="table"> <el-table :key="table.tableKey" v-loading="table.listLoading" element-loading-text="给我一点时间" :data="table.list" border fit highlight-current-row style="width: 100%;" :row-style="rowStyle" :cell-style="cellStyle" class="elTable table-fixed" > <el-table-column label="序号" align="center" type="index" width="50px"> <template slot-scope="scope"> <span>{{ scope.$index + (table.pageNum-1) * table.pageSize + 1 }}</span> </template> </el-table-column> <el-table-column label="盘点日期" min-width="130px" align="center"> <template slot-scope="scope"> <span>{{ scope.row.inventorydate }}</span> </template> </el-table-column> <el-table-column label="盘点人" min-width="130px" align="center"> <template slot-scope="scope"> <span>{{ scope.row.createuser }}</span> </template> </el-table-column> <el-table-column label="盘盈库存(kg)" min-width="110px" align="center"> <template slot-scope="scope"> <span>{{ scope.row.moreWeight }}</span> </template> </el-table-column> <el-table-column label="盘亏库存(kg)" min-width="110px" align="center"> <template slot-scope="scope"> <span>{{ scope.row.lessWeight }}</span> </template> </el-table-column> <el-table-column label="盈亏净值(kg)" min-width="110px" align="center"> <template slot-scope="scope"> <span>{{ scope.row.differWeight }}</span> </template> </el-table-column> <el-table-column label="备注" min-width="110px" align="center"> <template slot-scope="scope"> <span>{{ scope.row.remark }}</span> </template> </el-table-column> <el-table-column label="操作" align="center" width="80" class-name="small-padding fixed-width" fixed="right"> <template slot-scope="scope"> <el-button class="miniSuccess" :disabled="isokDisable" icon="el-icon-search" @click="handleSee(scope.row)" /> <span v-if="scope.$index + (table.pageNum-1) * table.pageSize + 1 == 1" class="centerSpan">|</span> <el-button v-if="scope.$index + (table.pageNum-1) * table.pageSize + 1 == 1" icon="el-icon-delete" class="miniDanger" @click="handleRowDelete(scope.row)" /> </template> </el-table-column> </el-table> <pagination v-show="table.total>=0" :total="table.total" :page.sync="table.getdataListParm.offset" :limit.sync="table.getdataListParm.pagecount" @pagination="getList" /> </div> <!-- 新增盘点单 --> <el-dialog :title="textMap[create.dialogStatus]" :visible.sync="create.dialogFormVisible" :close-on-click-modal="false" width="90%"> <div class="app-add"> <el-form ref="createTemp" :rules="create.rules" :model="create.createTemp" label-position="right" label-width="160px" style="width: 90%;margin:0 auto"> <el-row> <el-col :span="8"> <el-form-item label="盘点日期:" prop="inventorydate"> <!-- :picker-options="create.pickerOptions2" --> <el-date-picker v-model="create.createTemp.inventorydate" class="filter-item" type="date" placeholder="盘点日期" :disabled="create.dialogStatus==='see'" :picker-options="create.pickerOptions1" :clearable="false" /> </el-form-item> </el-col> <el-col :span="8"> <el-form-item label="盘点人:" prop="createuser"> <el-input ref="createuser" v-model="create.createTemp.createuser" class="filter-item" placeholder="盘点人" type="text" disabled /> </el-form-item> </el-col> <el-col :span="8"> <el-form-item label="备注:" prop="remark"> <el-input ref="remark" v-model="create.createTemp.remark" class="filter-item" placeholder="备注" type="text" :disabled="create.dialogStatus==='see'" /> </el-form-item> </el-col> </el-row> </el-form> <el-table :key="create.tableKey" v-loading="create.listLoading" element-loading-text="给我一点时间" :data="create.list" border fit highlight-current-row style="width: 100%;margin-bottom: 50px;" :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.feedname }}</span> </template> </el-table-column> <el-table-column label="库存重量(kg)" min-width="130px" align="center"> <template slot-scope="scope"> <span>{{ scope.row.stockweight }}</span> </template> </el-table-column> <el-table-column label="实际重量(kg)" min-width="110px" align="center"> <template slot-scope="scope"> <el-input v-if="create.dialogStatus==='create'" ref="input" v-model="scope.row.factweight" style="width:80%;padding:10px 0;" @blur="blurFactweight(scope.row)" /> <span v-else> {{ scope.row.factweight }}</span> </template> </el-table-column> <el-table-column label="差值(kg)" min-width="110px" align="center"> <template slot-scope="scope"> <span>{{ scope.row.differ }}</span> </template> </el-table-column> </el-table> <div slot="footer" class="dialog-footer"> <el-button v-if="create.dialogStatus==='see'" class="import" icon="el-icon-upload2" :disabled="isokDisable" @click="handleExport(2)">导出</el-button> <el-button class="cancelClose" @click="create.dialogFormVisible = false; ">关闭</el-button> <el-button v-if="create.dialogStatus==='create'" class="save" :disabled="isokDisable" @click="createData()">确认</el-button> </div> </div> </el-dialog> </div> </template> <script> import { GetDataByName, ExecDataByConfig, failproccess, PostDataByName } from '@/api/common' import Pagination from '@/components/Pagination' import { parseTime, json2excel } from '@/utils/index.js' import { MessageBox } from 'element-ui' import Cookies from 'js-cookie' import axios from 'axios' import { getToken } from '@/utils/auth' export default { name: 'InventoryList', components: { Pagination }, data() { return { table: { getdataListParm: { name: 'getBigInventoryList', page: 1, offset: 1, pagecount: 10, returntype: 'Map', parammaps: { pastureid: Cookies.get('pastureid'), startTime: '', stopTime: '', inputDatetime: '' } }, tableKey: 0, list: [], total: 0, listLoading: true }, textMap: { create: '新增', see: '查看盘点单' }, create: { pickerOptions1: { disabledDate: this.disabledDate }, dialogFormVisible: false, dialogStatus: '', createTemp: { pastureid: Cookies.get('pastureid'), remark: '', inventorydate: parseTime(new Date(), '{y}-{m}-{d}'), createuser: Cookies.get('employename') }, rules: {}, getdataListParm: { name: 'getFeedstorageWeightList', page: 1, offset: 1, pagecount: '', returntype: 'Map', parammaps: { pastureid: Cookies.get('pastureid'), emp: Cookies.get('employename') } }, tableKey: 0, list: [], total: 0, listLoading: true, getMaxdataParm: { name: 'getInventoryMaxdate', page: 1, offset: 1, pagecount: '', returntype: 'Map', parammaps: { pastureid: Cookies.get('pastureid') } }, maxDate: '' }, see: { getdataListParm: { name: 'getInventoryList', page: 1, offset: 1, pagecount: 10, returntype: 'Map', parammaps: {} } }, requestParam: {}, download: { getdataListParm: { name: 'getBigInventoryList', page: 1, offset: 1, pagecount: 0, returntype: 'Map', parammaps: { pastureid: Cookies.get('pastureid'), startTime: '', stopTime: '', inputDatetime: '' } }, list: [] }, isokDisable: false, rowStyle: { maxHeight: 30 + 'px', height: 30 + 'px' }, cellStyle: { padding: 0 + 'px' } } }, computed: { // 设置请求头 headers() { return { token: getToken() } }, uploadData() { return { name: 'checkFeed,insertBigInventoryUpload,insertInventoryUpload', importParams: '盘点日期,盘点人,备注,饲料名称,库存重量(kg),实际重量(kg)', sheetname: 'Sheet1', // 登录牧场 pastureid: Cookies.get('pastureid'), // 日期参数 dateParams: '盘点日期', // 必填参数 requiredParams: '盘点日期,饲料名称,库存重量(kg),实际重量(kg)', // 为数值的参数 numParams: '实际重量(kg)' } }, // 设置上传地址 uploadExcelUrl() { return process.env.VUE_APP_BASE_API + 'authdata/ImportExcel' } }, created() { this.getList() }, methods: { handleBefore() { if (this.table.getdataListParm.parammaps.inputDatetime !== '' && this.table.getdataListParm.parammaps.inputDatetime !== null) { var start = new Date(this.table.getdataListParm.parammaps.inputDatetime[0].setDate(this.table.getdataListParm.parammaps.inputDatetime[0].getDate() - 1)) var stop = new Date(this.table.getdataListParm.parammaps.inputDatetime[1].setDate(this.table.getdataListParm.parammaps.inputDatetime[1].getDate() - 1)) this.table.getdataListParm.parammaps.inputDatetime.length = 0 this.table.getdataListParm.parammaps.inputDatetime.push(start, stop) this.table.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}') this.table.getdataListParm.parammaps.stopTime = parseTime(stop, '{y}-{m}-{d}') this.$forceUpdate() } }, handleNext() { if (this.table.getdataListParm.parammaps.inputDatetime !== '' && this.table.getdataListParm.parammaps.inputDatetime !== null) { var start = new Date(this.table.getdataListParm.parammaps.inputDatetime[0].setDate(this.table.getdataListParm.parammaps.inputDatetime[0].getDate() + 1)) var stop = new Date(this.table.getdataListParm.parammaps.inputDatetime[1].setDate(this.table.getdataListParm.parammaps.inputDatetime[1].getDate() + 1)) this.table.getdataListParm.parammaps.inputDatetime.length = 0 this.table.getdataListParm.parammaps.inputDatetime.push(start, stop) this.table.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}') this.table.getdataListParm.parammaps.stopTime = parseTime(stop, '{y}-{m}-{d}') this.$forceUpdate() } }, handleSearch() { console.log('点击了查询') if (this.table.getdataListParm.parammaps.inputDatetime !== '' && this.table.getdataListParm.parammaps.inputDatetime !== null) { this.table.getdataListParm.parammaps.startTime = parseTime(this.table.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}') this.table.getdataListParm.parammaps.stopTime = parseTime(this.table.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}') } else { this.table.getdataListParm.parammaps.inputDatetime = '' this.table.getdataListParm.parammaps.startTime = '' this.table.getdataListParm.parammaps.stopTime = '' } this.table.getdataListParm.offset = 1 this.getList() }, getList() { this.table.listLoading = true GetDataByName(this.table.getdataListParm).then(response => { console.log('table数据', response.data.list) if (response.data.list !== null) { this.table.list = response.data.list this.table.pageNum = response.data.pageNum this.table.pageSize = response.data.pageSize this.table.total = response.data.total } else { this.table.list = [] } setTimeout(() => { this.table.listLoading = false }, 100) }) }, resetCreateTemp() { this.create.createTemp = { pastureid: Cookies.get('pastureid'), remark: '', inventorydate: parseTime(new Date(), '{y}-{m}-{d}'), createuser: Cookies.get('employename') } }, handleCreate() { console.log('点击了新增盘点单') this.resetCreateTemp() this.create.dialogStatus = 'create' this.create.dialogFormVisible = true this.getMaxDate() this.getCreateList() }, disabledDate(time) { return time.getTime() < new Date(this.create.maxDate) || time.getTime() > Date.now() }, getMaxDate() { GetDataByName(this.create.getMaxdataParm).then(response => { this.create.maxDate = response.data.list[0].maxdate console.log(response.data.list[0]) }) }, getCreateList() { this.create.listLoading = true GetDataByName(this.create.getdataListParm).then(response => { console.log('table数据', response.data.list) if (response.data.list !== null) { for (let i = 0; i < response.data.list.length; i++) { this.$set(response.data.list[i], 'factweight', '') this.$set(response.data.list[i], 'differ', '') } this.create.list = response.data.list this.create.pageNum = response.data.pageNum this.create.pageSize = response.data.pageSize this.create.total = response.data.total } else { this.create.list = [] } setTimeout(() => { this.create.listLoading = false }, 100) }) }, // 实际重量 blurFactweight(row) { if (row.factweight !== '' && row.stockweight !== '') { row.differ = parseFloat(row.factweight) - parseFloat(row.stockweight) } }, createData() { this.$refs['createTemp'].validate(valid => { if (valid) { this.isokDisable = true setTimeout(() => { this.isokDisable = false }, 1000) var createList = [] for (let i = 0; i < this.create.list.length; i++) { if (this.create.list[i].factweight !== '') { createList.push(this.create.list[i]) } } for (let i = 0; i < createList.length; i++) { const keepTwoNum = /^\d+(\.\d{1,2})?$/ // 实际重量 if (!keepTwoNum.test(parseFloat(createList[i].factweight))) { this.$message({ type: 'error', message: '实际重量请输入自然数并保留两位小数', duration: 2000 }) return false } } this.requestParam.common = { 'returnmap': '0' } this.requestParam.data = [] this.requestParam.data[0] = { 'name': 'insertBigInventory', 'type': 'e', 'parammaps': { 'pastureid': this.create.createTemp.pastureid, 'inventorydate': parseTime(this.create.createTemp.inventorydate, '{y}-{m}-{d}'), 'createuser': this.create.createTemp.createuser, 'remark': this.create.createTemp.remark }} this.requestParam.data[1] = { 'name': 'insertSpotList', 'resultmaps': { 'list': createList }} this.requestParam.data[1].children = [] this.requestParam.data[1].children[0] = { 'name': 'insertInventory', 'type': 'e', 'parammaps': { invid: '@insertBigInventory.LastInsertId', pastureid: '@insertSpotList.pastureid', feedname: '@insertSpotList.feedname', feedid: '@insertSpotList.feedid', stockweight: '@insertSpotList.stockweight', factweight: '@insertSpotList.factweight' }} ExecDataByConfig(this.requestParam).then(response => { if (response.msg === 'fail') { const inventorydate = new RegExp("key 'inventorydate'") if (inventorydate.test(response.data)) { this.$message({ type: 'error', message: '当前日期已盘点,不可重复录入', duration: 2000 }) } else { this.$notify({ title: '保存失败', message: response.data, type: 'warning', duration: 2000 }) } } else { this.$notify({ title: '', message: '成功', type: 'success', duration: 2000 }) this.create.dialogFormVisible = false this.getList() } }) } }) }, handleSee(row) { console.log('点击了查看') this.create.dialogStatus = 'see' this.create.dialogFormVisible = true this.create.createTemp = Object.assign({}, row) this.see.getdataListParm.parammaps.pastureid = row.pastureid this.see.getdataListParm.parammaps.id = row.id this.getSeeList() }, getSeeList() { this.create.listLoading = true GetDataByName(this.see.getdataListParm).then(response => { console.log('table数据', response.data.list) if (response.data.list !== null) { this.create.list = response.data.list this.create.pageNum = response.data.pageNum this.create.pageSize = response.data.pageSize this.create.total = response.data.total } else { this.create.list = [] } setTimeout(() => { this.create.listLoading = false }, 100) }) }, handleRowDelete(row) { MessageBox.confirm('是否确认删除此信息?', { confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning' }).then(() => { this.requestParam.name = 'deleteBigInventory' this.requestParam.parammaps = {} this.requestParam.parammaps.pastureid = row.pastureid this.requestParam.parammaps.id = row.id PostDataByName(this.requestParam).then(response => { if (response.msg === 'fail') { this.$notify({ title: '删除失败', message: response.data, type: 'warning', duration: 2000 }) } else { this.$notify({ title: '成功', message: '删除成功', type: 'success', duration: 2000 }) this.getList() } }) }).catch(() => { this.$message({ type: 'info', message: '已取消删除' }) }) }, handleInventoryList() { this.download.getdataListParm.name = 'getFeedstorageWeightList' this.download.getdataListParm.parammaps = {} this.download.getdataListParm.parammaps.pastureid = Cookies.get('pastureid') this.download.getdataListParm.parammaps.emp = Cookies.get('employename') GetDataByName(this.download.getdataListParm).then(response => { if (response.data.list !== null) { this.download.list = response.data.list } else { this.download.list = [] } var downloadList = [ { 'obj1': '1、文件类型为xlsx类型,对应表格文件名格式为:文件名称.xlsx;' }, { 'obj1': '2、底部工作表名称不可更改,默认为:Sheet1;' }, { 'obj1': '3、盘点日期,饲料名称为必填;' }, { 'obj1': '4、饲料名称必须与系统基础数据-饲料表中匹配;' }, { 'obj1': '5、实际重量为非负数,至多保留俩位小数;' }, { 'obj1': '6、盘点日期为文本格式的年-月-日,例:2020-10-10,盘点日期不可与系统已存在日期重复;盘点日期需保持一致' }, { 'obj1': '7、库存重量仅做参考,不与系统现有库存做校验;' }, { 'obj1': '8、实际重量可仅填写部分,导入已填写实际重量的饲料生成盘点单。' }, { 'obj1': '9、若有备注则填写在表格内容中第一个饲料行内即可;' } ] var excelDatas = [ { tHeader: ['盘点日期', '盘点人', '备注', '饲料名称', '库存重量(kg)', '实际重量(kg)'], filterVal: ['nowdate', 'emp', '', 'feedname', 'stockweight', ''], tableDatas: this.download.list, sheetName: 'Sheet1' }, { tHeader: ['填写规范:'], filterVal: ['obj1'], tableDatas: downloadList, sheetName: 'Sheet2' } ] json2excel(excelDatas, '盘点单导入模板', true, 'xlsx') }) }, handleExport(item) { if (item == 1) { this.download.getdataListParm.parammaps.inputDatetime = this.table.getdataListParm.parammaps.inputDatetime if (this.download.getdataListParm.parammaps.inputDatetime !== '' && this.download.getdataListParm.parammaps.inputDatetime !== null) { this.download.getdataListParm.parammaps.startTime = parseTime(this.download.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}') this.download.getdataListParm.parammaps.stopTime = parseTime(this.download.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}') } else { this.download.getdataListParm.parammaps.inputDatetime = '' this.download.getdataListParm.parammaps.startTime = '' this.download.getdataListParm.parammaps.stopTime = '' } this.download.getdataListParm.name = 'getBigInventoryList' GetDataByName(this.download.getdataListParm).then(response => { if (response.data.list !== null) { this.download.list = response.data.list } else { this.download.list = [] } var excelDatas = [ { tHeader: ['盘点日期', '盘点人', '盘盈库存(kg)', '盘亏库存(kg)', '盈亏净值(kg)', '备注'], filterVal: ['inventorydate', 'createuser', 'moreWeight', 'lessWeight', 'differWeight', 'remark'], tableDatas: this.download.list, sheetName: 'Sheet1' } ] json2excel(excelDatas, '盘点单', true, 'xlsx') }) } else { this.download.getdataListParm.name = 'getInventoryList' this.download.getdataListParm.parammaps = this.see.getdataListParm.parammaps GetDataByName(this.download.getdataListParm).then(response => { for (let i = 0; i < response.data.list.length; i++) { this.$set(response.data.list[i], 'inventorydate', this.create.createTemp.inventorydate) this.$set(response.data.list[i], 'createuser', this.create.createTemp.createuser) this.$set(response.data.list[i], 'remark', this.create.createTemp.remark) } if (response.data.list !== null) { this.download.list = response.data.list } else { this.download.list = [] } var excelDatas = [ { tHeader: ['盘点日期', '盘点人', '备注', '饲料名称', '库存重量(kg)', '实际重量(kg)', '差值(kg)'], filterVal: ['inventorydate', 'createuser', 'remark', 'feedname', 'stockweight', 'factweight', 'differ'], tableDatas: this.download.list, sheetName: 'Sheet1' } ] json2excel(excelDatas, '盘点-查看', true, 'xlsx') }) } }, beforeImport(file) { const isLt2M = file.size / 1024 / 1024 < 2 if (!isLt2M) { this.$message.error('上传文件大小不能超过 2MB!') } return isLt2M }, handleImportSuccess(res, file) { this.getList() if (res.msg === 'ok') { this.$message({ title: '成功', message: '导入成功:' + res.data.success + '条!', type: 'success', duration: 2000 }) if (res.data.err_count > 0) { this.$notify({ title: '失败', message: '导入失败:' + res.data.err_count + '条!', type: 'danger', duration: 2000 }) import('@/vendor/Export2Excel').then(excel => { const list1 = res.data.result const tHeader = [ '盘点日期', '盘点人', '备注', '饲料名称', '库存重量(kg)', '实际重量(kg)', '错误信息' ] const filterVal = [ '盘点日期', '盘点人', '备注', '饲料名称', '库存重量(kg)', '实际重量(kg)', 'error_msg' ] const data1 = this.formatJson(filterVal, list1) excel.export_json_to_excel({ header: tHeader, data: data1, filename: '盘点单报错信息', autoWidth: true, bookType: 'xlsx' }) }) } } else { this.$notify({ title: '失败', message: '上传失败', type: 'danger', duration: 2000 }) } }, formatJson(filterVal, jsonData) { return jsonData.map(v => filterVal.map(j => { if (j === 'timestamp') { return parseTime(v[j]) } else { return v[j] } }) ) } } } </script> <style lang="scss" scoped> .search{margin-top:10px;} .table{margin-top:10px;} </style> <style> .inputDatetime .el-range-separator{ padding: 0; margin: 0 10px; } </style>