添加新页面

马宇豪

2023-02-13 cbaa21c32c9899e135bc22f51f02fbbed0635164

添加新页面

 src/api/stock.js

@@ -200,3 +200,25 @@
        data:data
    });
}

export function getpifaBox(data) {
    return request({
        headers:{
            'Authorization': getToken()
        },
        url: process.env.BASE_API+'/contract/count/pifaBox',
        method: 'post',
        data:data
    });
}

export function regionPifaBox(data) {
    return request({
        headers:{
            'Authorization': getToken()
        },
        url: process.env.BASE_API+'/contract/count/regionPifaBox',
        method: 'post',
        data:data
    });
}

 src/views/specialCheck/components/areaForm.vue

@@ -32,7 +32,7 @@
                <el-table-column label="隐患数量" prop="hiddendangerSum" align="center"></el-table-column>
                <el-table-column label="整改数量" prop="rectifyHiddendangerSum" align="center"></el-table-column>
                <el-table-column label="重大整改数量" prop="rectifyMajorHiddendangerNum" align="center"></el-table-column>
                <el-table-column fixed="right" label="操作" align="center" class-name="small-padding fixed-width">
                <el-table-column label="操作" align="center" class-name="small-padding">
                    <template slot-scope="scope">
                        <el-button type="text" @click="toEnterprises(scope.row.selfAndcheckInfos)">查看</el-button>
                    </template>

 src/views/stock/components/enterprisePurchaseDetail.vue

对比新文件
@@ -0,0 +1,88 @@
<template>
    <el-dialog
        :visible.sync="purchaseDetailVisible"
        :close-on-click-modal="false"
        width="70%"
        :append-to-body="true"
    >
        <div class="app-container">
            <div class="table_title">新疆吉庆烟花爆竹有限公司<span v-if="timeValue!==''">（{{ timeValue }}）</span>进货情况</div>
            <div class="table_content">
                <el-table
                    v-loading="listLoading"
                    :key="tableKey"
                    :data="scList"
                    border
                    fit
                    highlight-current-row
                    style="width: 100%;"
                >
                    <el-table-column label="序号" type="index" align="center" width="60"/>
                    <el-table-column label="进货生产企业" prop="scCompany" align="center">
                    </el-table-column>
                    <el-table-column label="进货总数量（箱）" prop="totalcol" align="center">
                    </el-table-column>
                    <el-table-column label="爆竹类（箱）" prop="firecracker" align="center">
                    </el-table-column>
                    <el-table-column label="喷花类（箱）" prop="spray" align="center">
                    </el-table-column>
                    <el-table-column label="旋转类（箱）" prop="rotation" align="center">
                    </el-table-column>
                    <el-table-column label="吐珠类（箱）" prop="bead" align="center">
                    </el-table-column>
                    <el-table-column label="玩具类（箱）" prop="toy" align="center">
                    </el-table-column>
                    <el-table-column label="组合烟花类（箱）" prop="combined" align="center">
                    </el-table-column>
                </el-table>
                <br>
            </div>
        </div>
    </el-dialog>
</template>

<script>
    import {computePageCount} from "@/utils";

    export default {
        name: "index",
        data(){
            return{
                scList: [],
                timeValue: '',
                tableKey:'',
                listLoading:false,
                purchaseDetailVisible:false,
            }
        },
        components: {},
        methods:{
            open(scItems,timeRange,startTime,endTime){
                this.scList = scItems;
                for(let i of this.scList){
                    i.firecracker = i.items.filter(it=>it.type === '爆竹类').length>0?i.items.filter(it=>it.type === '爆竹类')[0].boxCount:0
                    i.spray = i.items.filter(it=>it.type === '喷花类').length>0?i.items.filter(it=>it.type === '喷花类')[0].boxCount:0
                    i.rotation = i.items.filter(it=>it.type === '旋转类').length>0?i.items.filter(it=>it.type === '旋转类')[0].boxCount:0
                    i.bead = i.items.filter(it=>it.type === '吐珠类').length>0?i.items.filter(it=>it.type === '吐珠类')[0].boxCount:0
                    i.toy = i.items.filter(it=>it.type === '玩具类').length>0?i.items.filter(it=>it.type === '玩具类')[0].boxCount:0
                    i.combined = i.items.filter(it=>it.type === '组合烟花类').length>0?i.items.filter(it=>it.type === '组合烟花类')[0].boxCount:0
                    i.totalcol = i.firecracker + i.spray + i.rotation + i.bead + i.toy + i.combined
                }
                this.purchaseDetailVisible = true;
                if(timeRange){
                    this.timeValue = startTime.split(' ')[0] + '~' + endTime.split(' ')[0]
                }
            }
        }
    }
</script>

<style scoped>
    .basic_search{
        display:inline-block;
    }
    .table_title{
        font-size: 18px;
        margin-bottom: 20px;
    }
</style>

 src/views/stock/components/statePurchaseDetail.vue

对比新文件
@@ -0,0 +1,134 @@
<template>
    <el-dialog
        :visible.sync="personPurchaseDetailVisible"
        :close-on-click-modal="false"
        width="70%"
        :append-to-body="true"
    >
        <div class="app-container">
            <div class="table_title"><span>{{stateName}}</span>各批发企业进货情况</div>
            <div class="table_content">
                <el-table
                    v-loading="listLoading"
                    :key="tableKey"
                    :data="statePurchaseDetailData"
                    border
                    fit
                    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="生产企业" prop="scCompany" align="center">
                    </el-table-column>
                    <el-table-column label="进货总数量（箱）" prop="totalcol" align="center">
                    </el-table-column>
                    <el-table-column label="爆竹类（箱）" prop="firecracker" align="center">
                    </el-table-column>
                    <el-table-column label="喷花类（箱）" prop="spray" align="center">
                    </el-table-column>
                    <el-table-column label="旋转类（箱）" prop="rotation" align="center">
                    </el-table-column>
                    <el-table-column label="吐珠类（箱）" prop="bead" align="center">
                    </el-table-column>
                    <el-table-column label="玩具类（箱）" prop="toy" align="center">
                    </el-table-column>
                    <el-table-column label="组合烟花类（箱）" prop="combined" align="center">
                    </el-table-column>
                </el-table>
                <br>
<!--                <el-pagination-->
<!--                    v-show="recordTotal>0"-->
<!--                    :current-page="currentPage"-->
<!--                    :page-sizes="[10, 15]"-->
<!--                    :page-size="pageSize"-->
<!--                    :total="recordTotal"-->
<!--                    layout="total, sizes, prev, pager, next, jumper"-->
<!--                    background-->
<!--                    style="float:right;"-->
<!--                    @size-change="handleSizeChange"-->
<!--                    @current-change="handleCurrentChange"-->
<!--                />-->
<!--                <br>-->
            </div>
        </div>
    </el-dialog>
</template>

<script>
    import {computePageCount} from "@/utils";
    import {getpifaBox} from "../../../api/stock";

    export default {
        name: "index",
        data(){
            return{
                stateName:'',
                unitType: 1,
                tableKey:'',
                listLoading:false,
                statePurchaseDetailData:[],
                personPurchaseDetailVisible:false,
            }
        },
        components: {},
        methods:{
            open(stateName,type,startTime,endTime){
                this.stateName = stateName;
                this.unitType = type;
                this.personPurchaseDetailVisible = true;
                this.getStatepifaBox(stateName,startTime,endTime);
            },
            async getStatepifaBox(stateName,startTime,endTime){
                this.listLoading = true
                const listQuery = {
                    startTime: startTime,
                    endTime: endTime,
                    companyName: '',
                    province: '',
                    city: '',
                    district: '',
                }
                if(this.unitType == 1){
                    listQuery.city = stateName
                }else{
                    listQuery.district = stateName
                }
                let res = await getpifaBox(listQuery)
                if(res.data.code === "200"){
                    const data = res.data.result
                    for(let t of data){
                        for(let i of t.scItems){
                            i.pifaCompany = t.pifaCompany
                            i.firecracker = i.items.filter(it=>it.type === '爆竹类').length>0?i.items.filter(it=>it.type === '爆竹类')[0].boxCount:0
                            i.spray = i.items.filter(it=>it.type === '喷花类').length>0?i.items.filter(it=>it.type === '喷花类')[0].boxCount:0
                            i.rotation = i.items.filter(it=>it.type === '旋转类').length>0?i.items.filter(it=>it.type === '旋转类')[0].boxCount:0
                            i.bead = i.items.filter(it=>it.type === '吐珠类').length>0?i.items.filter(it=>it.type === '吐珠类')[0].boxCount:0
                            i.toy = i.items.filter(it=>it.type === '玩具类').length>0?i.items.filter(it=>it.type === '玩具类')[0].boxCount:0
                            i.combined = i.items.filter(it=>it.type === '组合烟花类').length>0?i.items.filter(it=>it.type === '组合烟花类')[0].boxCount:0
                            i.totalcol = i.firecracker + i.spray + i.rotation + i.bead + i.toy + i.combined
                            this.statePurchaseDetailData.push(i)
                        }
                    }
                }else{
                    this.$message({
                        type:'warning',
                        message:res.data.message
                    })
                }
                this.listLoading = false
            }
        }
    }
</script>

<style scoped>
    .basic_search{
        display:inline-block;
    }
    .table_title{
        font-size: 18px;
        margin-bottom: 20px;
    }
</style>

 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>

 src/views/stock/enterpriseSale.vue

@@ -1,10 +1,5 @@
<template>
    <div class="container">
        <el-breadcrumb style="padding-top: 10px;padding-bottom: 10px" >
            <el-breadcrumb-item :to="{ path: '/stock/enterpriseSale' }">进销存</el-breadcrumb-item>
            <el-breadcrumb-item>进销存详情</el-breadcrumb-item>
        </el-breadcrumb>

    <div class="app-container">
        <div class="filter-container">
            <el-row>
                时间：&emsp;&emsp;
@@ -173,6 +168,7 @@
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
            />
            <br>
        </div>
        <in-storage-detail ref="inStorageDetail"></in-storage-detail>
        <out-storage-detail ref="outStorageDetail"></out-storage-detail>

 src/views/stock/enterpriseStock.vue

@@ -1,12 +1,6 @@
<template>
  <div class="container">
    <el-breadcrumb style="padding-top: 10px;padding-bottom: 10px" >
      <el-breadcrumb-item :to="{ path: '/stock/enterprise' }">库存监管</el-breadcrumb-item>
      <el-breadcrumb-item >库存详情</el-breadcrumb-item>
    </el-breadcrumb>

  <div class="app-container">
    <div class="filter-container">

      <el-row style="padding-top: 10px">
        <div style="display: block;">
        <div class="basic_search">
@@ -197,6 +191,7 @@
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
        <br>
    </div>
  </div>


 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>