From cbaa21c32c9899e135bc22f51f02fbbed0635164 Mon Sep 17 00:00:00 2001 From: 马宇豪 <978517621@qq.com> Date: 星期一, 13 二月 2023 13:19:43 +0800 Subject: [PATCH] 添加新页面 --- src/views/stock/enterprisePurchaseStatistics.vue | 395 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 395 insertions(+), 0 deletions(-) diff --git a/src/views/stock/enterprisePurchaseStatistics.vue b/src/views/stock/enterprisePurchaseStatistics.vue new file mode 100644 index 0000000..2ba0d35 --- /dev/null +++ b/src/views/stock/enterprisePurchaseStatistics.vue @@ -0,0 +1,395 @@ +<template> + <div class="app-container"> + <div class="filter-container"> + <div style="display: block"> + <div class="basic_search"> + <span>区域:</span> + <el-select v-model="listQuery.province" clearable filterable @change="changeArea('province')"> + <el-option + v-for="item in provinceList" + :key="item.id" + :label="item.name" + :value="item.name" + > + </el-option> + </el-select> + </div> + <div class="basic_search"> + <el-select v-model="listQuery.city" prop="city" clearable filterable @change="changeArea('city')"> + <el-option + v-for="item in cityList" + :key="item.id" + :label="item.name" + :value="item.name" + > + </el-option> + </el-select> + </div> + <div class="basic_search"> + <el-select v-model="listQuery.district" clearable filterable @change="changeArea('district')"> + <el-option + v-for="item in districtList" + :key="item.id" + :label="item.name" + :value="item.name" + > + </el-option> + </el-select> + </div> + </div> + <div style="display: block;"> + <div class="basic_search" style="padding-top: 10px;"> + <span>按时间查询:</span> + <el-date-picker + value-format="yyyy-MM-dd HH:mm:ss" + v-model="validTime" + type="datetimerange" + :default-time="['00:00:00','23:59:59']" + :picker-options="pickerOptions" + range-separator="-" + start-placeholder="开始日期" + end-placeholder="结束日期" + > + </el-date-picker> + </div> + <div class="basic_search" style="padding-top: 10px"> + <span>企业名称:</span> + <el-input filterable clearable v-model="listQuery.companyName" style="width:200px"> + </el-input> + </div> + <div class="basic_search" style="margin-right: 10px;padding-top: 10px"> + <el-button style="margin-left: 10px;" type="primary" @click="reset()">重置</el-button> + <el-button style="margin-left: 10px;" type="primary" icon="el-icon-search" @click="searchProductSearch('查询','')">查询</el-button> + <el-button style="margin-left: 10px;" type="primary" icon="el-icon-download" @click="exportToExcel">导出</el-button> + </div> + </div> + </div> + <div class="table_content"> + <el-table + v-loading="listLoading" + :key="tableKey" + :data="enterprisePurchaseData" + border + show-summary + fit + id="enterPriseTable" + highlight-current-row + style="width: 100%;" + > + <el-table-column label="序号" type="index" align="center" width="60"/> + <el-table-column label="批发企业" prop="pifaCompany" align="center"> + </el-table-column> + <el-table-column label="所属地区" align="center"> + <template slot-scope="scope"> + {{[scope.row.province,scope.row.city,scope.row.district].filter(item=>item!=="" &item!=null).join("-")}} + </template> + </el-table-column> + <el-table-column label="合计(箱)" prop="total" align="center"> + </el-table-column> + <el-table-column label="爆竹类(箱)" prop="baozhuCount" align="center"> + </el-table-column> + <el-table-column label="喷花类(箱)" prop="penhuaCount" align="center"> + </el-table-column> + <el-table-column label="旋转类(箱)" prop="xuanzhuanCount" align="center"> + </el-table-column> + <el-table-column label="吐珠类(箱)" prop="tuzhuCount" align="center"> + </el-table-column> + <el-table-column label="玩具类(箱)" prop="wanjuCount" align="center"> + </el-table-column> + <el-table-column label="组合烟花类(箱)" prop="zuheCount" align="center"> + </el-table-column> + <el-table-column label="操作" align="center" width="120" class-name="small-padding fixed-width"> + <template slot-scope="scope"> + <el-button type="text" @click="showDetail(scope.row)">查看详情</el-button> + </template> + </el-table-column> + </el-table> + <br> +<!-- <el-pagination--> +<!-- v-show="recordTotal>0"--> +<!-- :current-page="currentPage"--> +<!-- :page-sizes="[20, 50, 100, 200]"--> +<!-- :page-size="pageSize"--> +<!-- :total="recordTotal"--> +<!-- layout="total, sizes, prev, pager, next, jumper"--> +<!-- background--> +<!-- style="float:right;"--> +<!-- @size-change="handleSizeChange"--> +<!-- @current-change="handleCurrentChange"--> +<!-- />--> +<!-- <br>--> + <PurchaseDetail ref="purchaseDetail"></PurchaseDetail> + </div> + </div> +</template> + +<script> + import { computePageCount } from "../../utils"; + import {exportEnterpriseEntryStatistics, getEnterpriseEntryStatistics} from "../../api/flow"; + import {getCityListData, getProvinceListData} from "../../api/area"; + import { getpifaBox } from "../../api/stock"; + import Cookies from "js-cookie"; + import PurchaseDetail from "./components/enterprisePurchaseDetail"; + import FileSaver from 'file-saver' + import XLSX from 'xlsx' + export default { + name: "enterpriseEntryStatistics", + components: {PurchaseDetail}, + data(){ + return{ + tableKey:'', + validTime:['',''], + listQuery: { + startTime: '', + endTime: '', + companyName: '', + province: '', + city: '', + district: '', + }, + pickerOptions: { + shortcuts: [{ + text: '最近一周', + onClick(picker) { + const end = new Date() + const start = new Date() + start.setTime(start.getTime() - 3600 * 1000 * 24 * 6) + end.setTime(end.getTime() + 3600 * 1000 * 24) + picker.$emit('pick', [start, end]) + } + }, { + text: '最近一个月', + onClick(picker) { + const end = new Date() + const start = new Date() + start.setTime(start.getTime() - 3600 * 1000 * 24 * 29) + end.setTime(end.getTime() + 3600 * 1000 * 24) + picker.$emit('pick', [start, end]) + } + }, { + text: '最近三个月', + onClick(picker) { + const end = new Date() + const start = new Date() + start.setTime(start.getTime() - 3600 * 1000 * 24 * 89) + end.setTime(end.getTime() + 3600 * 1000 * 24) + picker.$emit('pick', [start, end]) + } + },] + }, + provinceList:[], + cityList:[], + districtList:[], + Cookies:Cookies, + listLoading:false, + enterprisePurchaseData:[], + previewList:[], + options: [ + { label: '全部', value: '' }, + { label: '是', value:1 }, + { label: '否', value: -1 } + ] + } + }, + created() { + this.initValidTime() + this.getpifaBox() + this.getProvince() + }, + mounted(){ + }, + watch: { + }, + methods:{ + async getpifaBox(){ + this.listLoading = true + if( this.validTime !== null ){ + this.listQuery.startTime = this.validTime[0] + this.listQuery.endTime = this.validTime[1] + }else{ + this.listQuery.startTime = '' + this.listQuery.endTime = '' + } + let res = await getpifaBox(this.listQuery) + if(res.data.code === "200"){ + this.enterprisePurchaseData = res.data.result + }else{ + this.$message({ + type:'warning', + message:res.data.message + }) + } + this.listLoading = false + }, + refresh(){ + this.getpifaBox() + }, + + // async exportToExcel(){ + // let res = await exportEnterpriseEntryStatistics(this.listQuery) + // if(res.data.code === '200'){ + // if(res.data.result === null ||res.data.result === [] || res.data.result.length === 0){ + // debugger + // this.$message({ + // type:'warning', + // message:'无数据可导出' + // }) + // }else{ + // let allData = res.data.result + // import('@/vendor/Export2Excel').then((excel) => { + // const tHeader = [ + // '地区', + // '企业名称', + // '爆竹类(箱)', + // '喷花类(箱)', + // '旋转类(箱)', + // '吐珠类(箱)', + // '玩具类(箱)', + // '组合烟花类(箱)', + // '合计(箱)', + // ] + // const filterVal = [ + // 'name', + // 'enterprisename', + // 'num_爆竹类', + // 'num_喷花类', + // 'num_旋转类', + // 'num_吐珠类', + // 'num_玩具类', + // 'num_组合烟花类', + // 'totalcol' + // ] + // const data = this.formatJson(filterVal, allData) + // excel.export_json_to_excel({ + // header: tHeader, + // data, + // filename: '企业分类入库统计' + // }) + // }) + // } + // + // }else{ + // this.$message({ + // message:res.data.message, + // type:'warning' + // }) + // } + // }, + + // exportToExcel(){ + // const sheetName = '批发企业进货统计' + // let wb = XLSX.utils.table_to_book(document.querySelector('#enterPriseTable')) + // let wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' }) + // try { + // FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), sheetName + '.xlsx') + // console.log('daochu') + // } catch (e) { + // if (typeof console !== 'undefined') console.log(e, wbout) + // } + // // return wbout + // }, + exportToExcel(){ + let xlsxParam = {raw:true} + let wb = XLSX.utils.table_to_book(document.querySelector('#enterPriseTable'),xlsxParam) + let wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' }) + try { + FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), '各批发企业进货统计.xlsx') + } catch (e) { + if (typeof console !== 'undefined') console.log(e, wbout) + } + return wbout + }, + formatJson(filterVal, jsonData) { + return jsonData.map(v => filterVal.map(j => v[j])) + }, + async getProvince(){ + let res = await getProvinceListData() + if(res.data.code === "200"){ + this.provinceList = res.data.result.provinceList + } + },//获取省 + + async changeArea(value){ + if(value === 'province'){ + this.listQuery.city = '' + this.listQuery.district = '' + this.areaListQuery = { + type: 2, + parenttype: 1, + parentname: this.listQuery.province, + } + let res = await getCityListData(this.areaListQuery) + if(res.data.code === "200"){ + this.cityList = res.data.result + } + }else if(value === 'city'){ + this.listQuery.district = '' + this.areaListQuery = { + type: 3, + parenttype: 2, + parentname: this.listQuery.city, + } + let res = await getCityListData(this.areaListQuery) + if(res.data.code === "200"){ + this.districtList = res.data.result + } + } + }, + + reset(){ + this.listQuery= { + startTime: '', + endTime: '', + companyName: '', + province: '', + city: '', + district: '', + } + }, + searchProductSearch(){ + this.getpifaBox() + }, + + initValidTime(){ + const end = new Date(); + if(end.getDate() - 1 === 0){ + this.validTime[0] = [end.getFullYear(), end.getMonth() , this.returnDay(end.getMonth(),end.getFullYear())].join("-") + " 00:00:00" ; + this.validTime[1] = [end.getFullYear(), end.getMonth() , this.returnDay(end.getMonth(),end.getFullYear())].join("-") +" 23:59:59"; + }else if(end.getDate() - 1 === 0 && end.getMonth() === 0){ + this.validTime[0] = [end.getFullYear() - 1, 12, 31].join("-") + " 00:00:00" ; + this.validTime[1] = [end.getFullYear() - 1, 12, 31].join("-") +" 23:59:59"; + } + else{ + this.validTime[0] = [end.getFullYear(), end.getMonth() + 1, end.getDate() - 1].join("-") + " 00:00:00" ; + this.validTime[1] = [end.getFullYear(), end.getMonth() + 1, end.getDate() - 1].join("-") +" 23:59:59"; + } + }, + returnDay(value,year){ + if(value === 1 || value === 3|| value === 5 || value === 7 || value === 8 || value === 10 || value === 12){ + return 31 + }else if(value === 2){ + if(year % 4 === 0){ + return 29 + }else{ + return 28 + } + }else{ + return 30 + } + }, + showDetail(param){ + if( this.validTime !== null ){ + this.$refs.purchaseDetail.open(param.scItems,true,this.validTime[0],this.validTime[1]) + }else{ + this.$refs.purchaseDetail.open(param.scItems,false) + } + }, + }, + } +</script> + +<style scoped> + .basic_search{ + display:inline-block; + } +</style> -- Gitblit v1.9.2