案件统计图表

guanqb

2023-04-08 e0cc7111543f4ea05ebd008309369c6534a8aa81

案件统计图表

 src/views/home/components/rightContainer.vue

@@ -369,7 +369,7 @@
            })
            setTimeout(() => {
                eventchangemychart.hideLoading()
                eventchangemychart.setOption(this.initEventChangeOption(optionsData.xData, optionsData.yData))
                eventchangemychart.setOption(this.initEventChangeOption(optionsData.xData, optionsData.yDataList))
            }, 500)
        },

@@ -401,18 +401,42 @@
                end,
                this.policeStaionID != "" ? this.policeStaionID : this.userInfo.dept_id
            ).then((res) => {
                if (res.data.length > 0) {
                    return res.data.reduce(
                if (res.data.timeList) {
                    let yDataList = {}
                    yDataList.dqList = res.data.dqList.reduce(
                        (previous, current) => {
                            previous.xData.push(current.days)
                            previous.yData.push(current.cout)
                            previous.push(current.count)
                            return previous
                        },
                        { xData: [], yData: [] }
                        []
                    )
                    yDataList.zpList = res.data.zpList.reduce(
                        (previous, current) => {
                            previous.push(current.count)
                            return previous
                        },
                        []
                    )
                    yDataList.jfList = res.data.jfList.reduce(
                        (previous, current) => {
                            previous.push(current.count)
                            return previous
                        },
                        []
                    )
                    yDataList.qtList = res.data.qtList.reduce(
                        (previous, current) => {
                            previous.push(current.count)
                            return previous
                        },
                        []
                    )
                    let xData = res.data.timeList.map(item => item.slice(5, 10))
                    return { xData, yDataList }
                } else {
                    return { xData: [], yData: [] }
                    return { xData: [], yDataList: {} }
                }

            })

            return caseAll
@@ -438,9 +462,7 @@

            const optionsData = await this.getCaseAll(date[0], date[1])


            // eventchangemychart.setOption(this.initEventChangeOption(optionsData.xData, optionsData.yData))
            eventchangemychart.setOption(this.initEventChangeOption(['盗窃', '诈骗', '纠纷', '其他'], [12, 34, 25, 8]))
            eventchangemychart.setOption(this.initEventChangeOption(optionsData.xData, optionsData.yDataList))

            setTimeout(() => {
                this.eventChangeEchartsLoading = false
@@ -448,7 +470,7 @@
        },

        // 案件统计的options
        initEventChangeOption (xData, yData) {
        initEventChangeOption (xData, yDataList) {
            let option
            if (xData.length == 0) {
                //暂无数据
@@ -484,6 +506,9 @@
                            },
                        },
                    },
                    legend: {
                        data: ['盗窃', '诈骗', '纠纷', '其他']
                    },
                    yAxis: {
                        type: "value",

@@ -504,7 +529,8 @@
                    },
                    series: [
                        {
                            data: yData,
                            name: '盗窃',
                            data: yDataList.dqList,
                            type: "line",
                            smooth: true,
                            areaStyle: {
@@ -539,6 +565,117 @@
                                },
                            },
                        },
                        {
                            name: '诈骗',
                            data: yDataList.zpList,
                            type: "line",
                            smooth: true,
                            areaStyle: {
                                normal: {
                                    //渐变色
                                    color: new this.$echarts.graphic.LinearGradient(
                                        0,
                                        0,
                                        0,
                                        1,
                                        [
                                            {
                                                //波形图渐变色样式
                                                offset: 0,
                                                color: "rgba(3, 108, 255, 0.7)",
                                            },
                                            {
                                                offset: 0.8,
                                                color: "rgba(3, 108, 255, 0.1)",
                                            },
                                        ],
                                        false
                                    ),
                                },
                            },
                            itemStyle: {
                                normal: {
                                    color: "red", //改变折线点的颜色
                                    lineStyle: {
                                        color: "rgba(3, 108, 255, 1)", //改变折线颜色
                                    },
                                },
                            },
                        },
                        {
                            name: '纠纷',
                            data: yDataList.jfList,
                            type: "line",
                            smooth: true,
                            areaStyle: {
                                normal: {
                                    //渐变色
                                    color: new this.$echarts.graphic.LinearGradient(
                                        0,
                                        0,
                                        0,
                                        1,
                                        [
                                            {
                                                //波形图渐变色样式
                                                offset: 0,
                                                color: "rgba(3, 108, 255, 0.7)",
                                            },
                                            {
                                                offset: 0.8,
                                                color: "rgba(3, 108, 255, 0.1)",
                                            },
                                        ],
                                        false
                                    ),
                                },
                            },
                            itemStyle: {
                                normal: {
                                    color: "red", //改变折线点的颜色
                                    lineStyle: {
                                        color: "rgba(3, 108, 255, 1)", //改变折线颜色
                                    },
                                },
                            },
                        },
                        {
                            name: '其他',
                            data: yDataList.qtList,
                            type: "line",
                            smooth: true,
                            areaStyle: {
                                normal: {
                                    //渐变色
                                    color: new this.$echarts.graphic.LinearGradient(
                                        0,
                                        0,
                                        0,
                                        1,
                                        [
                                            {
                                                //波形图渐变色样式
                                                offset: 0,
                                                color: "rgba(3, 108, 255, 0.7)",
                                            },
                                            {
                                                offset: 0.8,
                                                color: "rgba(3, 108, 255, 0.1)",
                                            },
                                        ],
                                        false
                                    ),
                                },
                            },
                            itemStyle: {
                                normal: {
                                    color: "red", //改变折线点的颜色
                                    lineStyle: {
                                        color: "rgba(3, 108, 255, 1)", //改变折线颜色
                                    },
                                },
                            },
                        }
                    ],
                    grid: {
                        top: "4%",