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/statePurchaseStatistics.vue | 391 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 391 insertions(+), 0 deletions(-) diff --git a/src/views/stock/statePurchaseStatistics.vue b/src/views/stock/statePurchaseStatistics.vue new file mode 100644 index 0000000..939b587 --- /dev/null +++ b/src/views/stock/statePurchaseStatistics.vue @@ -0,0 +1,391 @@ +<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="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="statePurchaseData" + border + show-summary + fit + id="stateTable" + highlight-current-row + style="width: 100%;" + > + <el-table-column label="序号" type="index" align="center" width="60"/> + <el-table-column label="地(市州)" align="center"> + <template slot-scope="scope"> + <el-link type="primary" @click="digDetail(scope.row)">{{ scope.row.region }}</el-link> + </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 {regionPifaBox} from "../../api/stock"; +import Cookies from "js-cookie"; +import PurchaseDetail from "./components/statePurchaseDetail"; +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: '', + }, + provinceList: [], + cityList: [], + districtList: [], + Cookies: Cookies, + listLoading: false, + statePurchaseData: [], + previewList: [], + options: [ + {label: '全部', value: ''}, + {label: '是', value: 1}, + {label: '否', value: -1} + ], + pickerOptions: { + shortcuts: [{ + text: '最近一周', + onClick(picker) { + const end = new Date(); + const start = new Date(); + start.setTime(start.getTime() - 3600 * 1000 * 24 * 7); + picker.$emit('pick', [start, end]); + } + }, { + text: '最近一个月', + onClick(picker) { + const end = new Date(); + const start = new Date(); + start.setTime(start.getTime() - 3600 * 1000 * 24 * 30); + picker.$emit('pick', [start, end]); + } + }, { + text: '最近三个月', + onClick(picker) { + const end = new Date(); + const start = new Date(); + start.setTime(start.getTime() - 3600 * 1000 * 24 * 90); + picker.$emit('pick', [start, end]); + } + }] + }, + } + }, + created() { + this.initValidTime() + this.getRegionPifaBox() + this.getProvince() + }, + mounted() { + }, + watch: {}, + methods: { + async getRegionPifaBox() { + 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 regionPifaBox(this.listQuery) + if (res.data.code === "200") { + if(res.data.result){ + this.statePurchaseData = res.data.result[0].subRegionData + }else{ + this.statePurchaseData = [] + } + } else { + this.$message({ + type: 'warning', + message: res.data.message + }) + } + this.listLoading = false + }, + digDetail(row){ + if(row.subRegionData){ + this.statePurchaseData = row.subRegionData + } + }, + refresh() { + this.getRegionPifaBox() + }, + + // async exportToExcel() { + // let res = await regionPifaBox(this.listQuery) + // if (res.data.code === '200') { + // if (res.data.result === null || res.data.result === [] || res.data.result.length === 0) { + // this.$message({ + // type: 'warning', + // message: '无数据可导出' + // }) + // } else { + // let allData = res.data.result + // import('@/vendor/Export2Excel').then((excel) => { + // const tHeader = [ + // '序号', + // '地市州', + // '合计(箱)', + // '爆竹类(箱)', + // '喷花类(箱)', + // '旋转类(箱)', + // '吐珠类(箱)', + // '玩具类(箱)', + // '组合烟花类(箱)', + // ] + // const filterVal = [ + // 'index', + // 'region', + // 'total', + // 'baozhuCount', + // 'penhuaCount', + // 'xuanzhuanCount', + // 'tuzhuCount', + // 'wanjuCount', + // 'zuheCount', + // ] + // 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(){ + let xlsxParam = {raw:true} + let wb = XLSX.utils.table_to_book(document.querySelector('#stateTable'),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.initValidTime() + this.listQuery = { + startTime: '', + endTime: '', + companyName: '', + province: '', + city: '', + district: '', + } + this.getRegionPifaBox() + }, + searchProductSearch() { + this.getRegionPifaBox() + }, + + 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 ){ + if(param.subRegionData){ + this.$refs.purchaseDetail.open(param.region,1,this.validTime[0],this.validTime[1]) + }else{ + this.$refs.purchaseDetail.open(param.region,2,this.validTime[0],this.validTime[1]) + } + }else{ + if(param.subRegionData){ + this.$refs.purchaseDetail.open(param.region,1,'','') + }else{ + this.$refs.purchaseDetail.open(param.region,2,'','') + } + } + }, + }, +} +</script> + +<style scoped> +.basic_search { + display: inline-block; +} +</style> -- Gitblit v1.9.2