From d2b5a837f5cc4d6e9fa831bdfcfda43faaf74ab9 Mon Sep 17 00:00:00 2001
From: zx <604444282@qq.com>
Date: Wed, 23 Feb 2022 14:50:07 +0800
Subject: [PATCH] zx

---
 src/api/SaleRank/index.js                     |   2 +-
 src/router/index.js                           |  72 ++++++-
 .../SaleRank/AllEnergy/EnergyCY/index.vue     | 202 ++++++++++++++++++
 src/views/SaleRank/AllEnergy/EnergyCY/opt.js  | 111 ++++++++++
 .../SaleRank/AllEnergy/EnergyNE/index.vue     | 202 ++++++++++++++++++
 src/views/SaleRank/AllEnergy/EnergyNE/opt.js  | 111 ++++++++++
 .../SaleRank/AllEnergy/EnergyQH/index.vue     | 202 ++++++++++++++++++
 src/views/SaleRank/AllEnergy/EnergyQH/opt.js  | 111 ++++++++++
 .../SaleRank/AllEnergy/EnergyQY/index.vue     | 202 ++++++++++++++++++
 src/views/SaleRank/AllEnergy/EnergyQY/opt.js  | 111 ++++++++++
 .../SaleRank/AllEnergy/EnergyYDH/index.vue    | 202 ++++++++++++++++++
 src/views/SaleRank/AllEnergy/EnergyYDH/opt.js | 111 ++++++++++
 src/views/SaleRank/AllLevel/MPVCar/index.vue  | 202 ++++++++++++++++++
 src/views/SaleRank/AllLevel/MPVCar/opt.js     | 111 ++++++++++
 src/views/SaleRank/AllLevel/SUVCar/index.vue  | 202 ++++++++++++++++++
 src/views/SaleRank/AllLevel/SUVCar/opt.js     | 111 ++++++++++
 src/views/SaleRank/AllLevel/jcCar/index.vue   | 202 ++++++++++++++++++
 src/views/SaleRank/AllLevel/jcCar/opt.js      | 111 ++++++++++
 src/views/SaleRank/AllLevel/xxCar/index.vue   | 202 ++++++++++++++++++
 src/views/SaleRank/AllLevel/xxCar/opt.js      | 111 ++++++++++
 src/views/SaleRank/AllLevel/zdxCar/index.vue  | 202 ++++++++++++++++++
 src/views/SaleRank/AllLevel/zdxCar/opt.js     | 111 ++++++++++
 src/views/SaleRank/AllLevel/zxCar/index.vue   | 202 ++++++++++++++++++
 src/views/SaleRank/AllLevel/zxCar/opt.js      | 111 ++++++++++
 src/views/SaleRank/AllPrice/Price10/index.vue | 202 ++++++++++++++++++
 src/views/SaleRank/AllPrice/Price10/opt.js    | 111 ++++++++++
 .../SaleRank/AllPrice/Price1015/index.vue     | 202 ++++++++++++++++++
 src/views/SaleRank/AllPrice/Price1015/opt.js  | 111 ++++++++++
 .../SaleRank/AllPrice/Price1525/index.vue     | 202 ++++++++++++++++++
 src/views/SaleRank/AllPrice/Price1525/opt.js  | 111 ++++++++++
 .../SaleRank/AllPrice/Price2535/index.vue     | 202 ++++++++++++++++++
 src/views/SaleRank/AllPrice/Price2535/opt.js  | 111 ++++++++++
 .../SaleRank/AllPrice/Price3550/index.vue     | 202 ++++++++++++++++++
 src/views/SaleRank/AllPrice/Price3550/opt.js  | 111 ++++++++++
 src/views/SaleRank/AllPrice/Price50/index.vue | 202 ++++++++++++++++++
 src/views/SaleRank/AllPrice/Price50/opt.js    | 111 ++++++++++
 src/views/SaleRank/CitySale/index.vue         |  20 +-
 37 files changed, 5410 insertions(+), 5 deletions(-)
 create mode 100644 src/views/SaleRank/AllEnergy/EnergyCY/index.vue
 create mode 100644 src/views/SaleRank/AllEnergy/EnergyCY/opt.js
 create mode 100644 src/views/SaleRank/AllEnergy/EnergyNE/index.vue
 create mode 100644 src/views/SaleRank/AllEnergy/EnergyNE/opt.js
 create mode 100644 src/views/SaleRank/AllEnergy/EnergyQH/index.vue
 create mode 100644 src/views/SaleRank/AllEnergy/EnergyQH/opt.js
 create mode 100644 src/views/SaleRank/AllEnergy/EnergyQY/index.vue
 create mode 100644 src/views/SaleRank/AllEnergy/EnergyQY/opt.js
 create mode 100644 src/views/SaleRank/AllEnergy/EnergyYDH/index.vue
 create mode 100644 src/views/SaleRank/AllEnergy/EnergyYDH/opt.js
 create mode 100644 src/views/SaleRank/AllLevel/MPVCar/index.vue
 create mode 100644 src/views/SaleRank/AllLevel/MPVCar/opt.js
 create mode 100644 src/views/SaleRank/AllLevel/SUVCar/index.vue
 create mode 100644 src/views/SaleRank/AllLevel/SUVCar/opt.js
 create mode 100644 src/views/SaleRank/AllLevel/jcCar/index.vue
 create mode 100644 src/views/SaleRank/AllLevel/jcCar/opt.js
 create mode 100644 src/views/SaleRank/AllLevel/xxCar/index.vue
 create mode 100644 src/views/SaleRank/AllLevel/xxCar/opt.js
 create mode 100644 src/views/SaleRank/AllLevel/zdxCar/index.vue
 create mode 100644 src/views/SaleRank/AllLevel/zdxCar/opt.js
 create mode 100644 src/views/SaleRank/AllLevel/zxCar/index.vue
 create mode 100644 src/views/SaleRank/AllLevel/zxCar/opt.js
 create mode 100644 src/views/SaleRank/AllPrice/Price10/index.vue
 create mode 100644 src/views/SaleRank/AllPrice/Price10/opt.js
 create mode 100644 src/views/SaleRank/AllPrice/Price1015/index.vue
 create mode 100644 src/views/SaleRank/AllPrice/Price1015/opt.js
 create mode 100644 src/views/SaleRank/AllPrice/Price1525/index.vue
 create mode 100644 src/views/SaleRank/AllPrice/Price1525/opt.js
 create mode 100644 src/views/SaleRank/AllPrice/Price2535/index.vue
 create mode 100644 src/views/SaleRank/AllPrice/Price2535/opt.js
 create mode 100644 src/views/SaleRank/AllPrice/Price3550/index.vue
 create mode 100644 src/views/SaleRank/AllPrice/Price3550/opt.js
 create mode 100644 src/views/SaleRank/AllPrice/Price50/index.vue
 create mode 100644 src/views/SaleRank/AllPrice/Price50/opt.js

diff --git a/src/api/SaleRank/index.js b/src/api/SaleRank/index.js
index 7c78597..29180e7 100644
--- a/src/api/SaleRank/index.js
+++ b/src/api/SaleRank/index.js
@@ -91,7 +91,7 @@ export function getCheZhuCarSpecidChart(params) {
     })
 }
 
-// 按级别-汽车级别销售排行榜-各级别/更多
+// 按级别-汽车级别销售排行榜-各级别/更多 价格/能源
 export function getCheZhuCarCategory(params) {
     let obj =  Object.assign({action: 'getCheZhuCarCategory', sType: 'Marketing'}, params)
     return httpService({
diff --git a/src/router/index.js b/src/router/index.js
index 057a4b4..ddab119 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -208,7 +208,7 @@ const router = [
                         path: 'citySale', //城市销量
                         component: resolve => require(['@/views/SaleRank/CitySale'], resolve),
                     },
-                    ////
+                    ////级别，价格，能源
                     {
                         path: 'aLevel', //所有级别
                         component: resolve => require(['@/views/SaleRank/AllLevel/index.vue'], resolve),
@@ -225,7 +225,75 @@ const router = [
                         path: 'level1', //微型车
                         component: resolve => require(['@/views/SaleRank/AllLevel/wxCar/index.vue'], resolve),
                     },
-                    ////
+                    {
+                        path: 'level2', //小型车
+                        component: resolve => require(['@/views/SaleRank/AllLevel/xxCar/index.vue'], resolve),
+                    },
+                    {
+                        path: 'level3', //紧凑型车
+                        component: resolve => require(['@/views/SaleRank/AllLevel/jcCar/index.vue'], resolve),
+                    },
+                    {
+                        path: 'level4', //中型车
+                        component: resolve => require(['@/views/SaleRank/AllLevel/zxCar/index.vue'], resolve),
+                    },
+                    {
+                        path: 'level5', //中大型车
+                        component: resolve => require(['@/views/SaleRank/AllLevel/zdxCar/index.vue'], resolve),
+                    },
+                    {
+                        path: 'level6', //MPV
+                        component: resolve => require(['@/views/SaleRank/AllLevel/MPVCar/index.vue'], resolve),
+                    },
+                    {
+                        path: 'level7', //SUV
+                        component: resolve => require(['@/views/SaleRank/AllLevel/SUVCar/index.vue'], resolve),
+                    },
+                    {
+                        path: 'price1', //10w以内
+                        component: resolve => require(['@/views/SaleRank/AllPrice/Price10/index.vue'], resolve),
+                    },
+                    {
+                        path: 'price2', //10-15
+                        component: resolve => require(['@/views/SaleRank/AllPrice/Price1015/index.vue'], resolve),
+                    },
+                    {
+                        path: 'price3', //15-25
+                        component: resolve => require(['@/views/SaleRank/AllPrice/Price1525/index.vue'], resolve),
+                    },
+                    {
+                        path: 'price4', //25-35
+                        component: resolve => require(['@/views/SaleRank/AllPrice/Price2535/index.vue'], resolve),
+                    },
+                    {
+                        path: 'price5', //35-50
+                        component: resolve => require(['@/views/SaleRank/AllPrice/Price3550/index.vue'], resolve),
+                    },
+                    {
+                        path: 'price6', //50+
+                        component: resolve => require(['@/views/SaleRank/AllPrice/Price50/index.vue'], resolve),
+                    },
+                    {
+                        path: 'energy1', //汽油
+                        component: resolve => require(['@/views/SaleRank/AllEnergy/EnergyQY/index.vue'], resolve),
+                    },
+                    {
+                        path: 'energy2', //柴油
+                        component: resolve => require(['@/views/SaleRank/AllEnergy/EnergyCY/index.vue'], resolve),
+                    },
+                    {
+                        path: 'energy3', //混动
+                        component: resolve => require(['@/views/SaleRank/AllEnergy/EnergyYDH/index.vue'], resolve),
+                    },
+                    {
+                        path: 'energy4', //新能源
+                        component: resolve => require(['@/views/SaleRank/AllEnergy/EnergyNE/index.vue'], resolve),
+                    },
+                    {
+                        path: 'energy5', //轻混
+                        component: resolve => require(['@/views/SaleRank/AllEnergy/EnergyQH/index.vue'], resolve),
+                    },
+                    ////////////////////
                     {
                         path: 'brandInfo', //汽车品牌销量-销量
                         component: resolve => require(['@/views/SaleRank/BrandInfo/index.vue'], resolve),
diff --git a/src/views/SaleRank/AllEnergy/EnergyCY/index.vue b/src/views/SaleRank/AllEnergy/EnergyCY/index.vue
new file mode 100644
index 0000000..e052c08
--- /dev/null
+++ b/src/views/SaleRank/AllEnergy/EnergyCY/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="ecy-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="柴油车销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'EnergyCY',
+    data() {
+        return {
+            load: false,
+            time: '柴油车销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sEnergyType: 2
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sEnergyType: 2
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .ecy-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllEnergy/EnergyCY/opt.js b/src/views/SaleRank/AllEnergy/EnergyCY/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllEnergy/EnergyCY/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllEnergy/EnergyNE/index.vue b/src/views/SaleRank/AllEnergy/EnergyNE/index.vue
new file mode 100644
index 0000000..efbbd45
--- /dev/null
+++ b/src/views/SaleRank/AllEnergy/EnergyNE/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="ne-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="新能源车排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'EnergyNE',
+    data() {
+        return {
+            load: false,
+            time: '新能源车销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sEnergyType: 4
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sEnergyType: 4
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .ne-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllEnergy/EnergyNE/opt.js b/src/views/SaleRank/AllEnergy/EnergyNE/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllEnergy/EnergyNE/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllEnergy/EnergyQH/index.vue b/src/views/SaleRank/AllEnergy/EnergyQH/index.vue
new file mode 100644
index 0000000..0ccca68
--- /dev/null
+++ b/src/views/SaleRank/AllEnergy/EnergyQH/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="qh-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="轻混系统排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'EnergyNE',
+    data() {
+        return {
+            load: false,
+            time: '轻混系统销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sEnergyType: 5
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sEnergyType: 5
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .qh-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllEnergy/EnergyQH/opt.js b/src/views/SaleRank/AllEnergy/EnergyQH/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllEnergy/EnergyQH/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllEnergy/EnergyQY/index.vue b/src/views/SaleRank/AllEnergy/EnergyQY/index.vue
new file mode 100644
index 0000000..e60d608
--- /dev/null
+++ b/src/views/SaleRank/AllEnergy/EnergyQY/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="eqy-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="汽油车销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'EnergyQY',
+    data() {
+        return {
+            load: false,
+            time: '汽油车销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sEnergyType: 1
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sEnergyType: 1
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .eqy-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllEnergy/EnergyQY/opt.js b/src/views/SaleRank/AllEnergy/EnergyQY/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllEnergy/EnergyQY/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllEnergy/EnergyYDH/index.vue b/src/views/SaleRank/AllEnergy/EnergyYDH/index.vue
new file mode 100644
index 0000000..d75c011
--- /dev/null
+++ b/src/views/SaleRank/AllEnergy/EnergyYDH/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="ydh-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="油电混动销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'EnergyYDH',
+    data() {
+        return {
+            load: false,
+            time: '油电混动销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sEnergyType: 3
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sEnergyType: 3
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .ydh-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllEnergy/EnergyYDH/opt.js b/src/views/SaleRank/AllEnergy/EnergyYDH/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllEnergy/EnergyYDH/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllLevel/MPVCar/index.vue b/src/views/SaleRank/AllLevel/MPVCar/index.vue
new file mode 100644
index 0000000..9290085
--- /dev/null
+++ b/src/views/SaleRank/AllLevel/MPVCar/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="mpv-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="MPV销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'MPVCar',
+    data() {
+        return {
+            load: false,
+            time: 'MPV销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sSpec: 'mpv'
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sSpec: 'mpv'
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .mpv-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllLevel/MPVCar/opt.js b/src/views/SaleRank/AllLevel/MPVCar/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllLevel/MPVCar/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllLevel/SUVCar/index.vue b/src/views/SaleRank/AllLevel/SUVCar/index.vue
new file mode 100644
index 0000000..4ebbd7e
--- /dev/null
+++ b/src/views/SaleRank/AllLevel/SUVCar/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="suv-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="SUV销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'SUVCar',
+    data() {
+        return {
+            load: false,
+            time: 'SUV销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sSpec: 'suv'
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sSpec: 'suv'
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .suv-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllLevel/SUVCar/opt.js b/src/views/SaleRank/AllLevel/SUVCar/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllLevel/SUVCar/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllLevel/jcCar/index.vue b/src/views/SaleRank/AllLevel/jcCar/index.vue
new file mode 100644
index 0000000..7826035
--- /dev/null
+++ b/src/views/SaleRank/AllLevel/jcCar/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="jc-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="紧凑型车销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'jcCar',
+    data() {
+        return {
+            load: false,
+            time: '紧凑型车销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sSpec: 'a'
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sSpec: 'a'
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .jc-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllLevel/jcCar/opt.js b/src/views/SaleRank/AllLevel/jcCar/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllLevel/jcCar/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllLevel/xxCar/index.vue b/src/views/SaleRank/AllLevel/xxCar/index.vue
new file mode 100644
index 0000000..c945437
--- /dev/null
+++ b/src/views/SaleRank/AllLevel/xxCar/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="xxc-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="小型车销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'xxCar',
+    data() {
+        return {
+            load: false,
+            time: '小型车销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sSpec: 'a0'
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sSpec: 'a0'
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .xxc-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllLevel/xxCar/opt.js b/src/views/SaleRank/AllLevel/xxCar/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllLevel/xxCar/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllLevel/zdxCar/index.vue b/src/views/SaleRank/AllLevel/zdxCar/index.vue
new file mode 100644
index 0000000..7910d38
--- /dev/null
+++ b/src/views/SaleRank/AllLevel/zdxCar/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="zdx-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="中大型车销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'zdxCar',
+    data() {
+        return {
+            load: false,
+            time: '中大型车销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sSpec: 'c'
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sSpec: 'c'
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .zdx-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllLevel/zdxCar/opt.js b/src/views/SaleRank/AllLevel/zdxCar/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllLevel/zdxCar/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllLevel/zxCar/index.vue b/src/views/SaleRank/AllLevel/zxCar/index.vue
new file mode 100644
index 0000000..18c711e
--- /dev/null
+++ b/src/views/SaleRank/AllLevel/zxCar/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="zx-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="中型车销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'ZXCar',
+    data() {
+        return {
+            load: false,
+            time: '中型车销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sSpec: 'b'
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sSpec: 'b'
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .zx-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllLevel/zxCar/opt.js b/src/views/SaleRank/AllLevel/zxCar/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllLevel/zxCar/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllPrice/Price10/index.vue b/src/views/SaleRank/AllPrice/Price10/index.vue
new file mode 100644
index 0000000..8d67c71
--- /dev/null
+++ b/src/views/SaleRank/AllPrice/Price10/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="p10-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="10万以内销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'Price10',
+    data() {
+        return {
+            load: false,
+            time: '10万以内销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sPriceType: 1
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sPriceType: 1
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .p10-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllPrice/Price10/opt.js b/src/views/SaleRank/AllPrice/Price10/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllPrice/Price10/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllPrice/Price1015/index.vue b/src/views/SaleRank/AllPrice/Price1015/index.vue
new file mode 100644
index 0000000..ce3172c
--- /dev/null
+++ b/src/views/SaleRank/AllPrice/Price1015/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="p1015-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="10万-15万销量排行榜销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'Price1015',
+    data() {
+        return {
+            load: false,
+            time: '10万-15万销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sPriceType: 2
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sPriceType: 2
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .p1015-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllPrice/Price1015/opt.js b/src/views/SaleRank/AllPrice/Price1015/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllPrice/Price1015/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllPrice/Price1525/index.vue b/src/views/SaleRank/AllPrice/Price1525/index.vue
new file mode 100644
index 0000000..c36e594
--- /dev/null
+++ b/src/views/SaleRank/AllPrice/Price1525/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="p1525-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="15万-25万销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'Price1525',
+    data() {
+        return {
+            load: false,
+            time: '15万-25万销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sPriceType: 3
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sPriceType: 3
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .p1525-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllPrice/Price1525/opt.js b/src/views/SaleRank/AllPrice/Price1525/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllPrice/Price1525/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllPrice/Price2535/index.vue b/src/views/SaleRank/AllPrice/Price2535/index.vue
new file mode 100644
index 0000000..3574ed9
--- /dev/null
+++ b/src/views/SaleRank/AllPrice/Price2535/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="p2535-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="25万-35万销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'Price2535',
+    data() {
+        return {
+            load: false,
+            time: '25万-35万销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sPriceType: 4
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sPriceType: 4
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .p2535-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllPrice/Price2535/opt.js b/src/views/SaleRank/AllPrice/Price2535/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllPrice/Price2535/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllPrice/Price3550/index.vue b/src/views/SaleRank/AllPrice/Price3550/index.vue
new file mode 100644
index 0000000..1ccb3a9
--- /dev/null
+++ b/src/views/SaleRank/AllPrice/Price3550/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="p3550-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="35万-50万销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'Price3550',
+    data() {
+        return {
+            load: false,
+            time: '35万-50万销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sPriceType: 1
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sPriceType: 1
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .p3550-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllPrice/Price3550/opt.js b/src/views/SaleRank/AllPrice/Price3550/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllPrice/Price3550/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/AllPrice/Price50/index.vue b/src/views/SaleRank/AllPrice/Price50/index.vue
new file mode 100644
index 0000000..5695282
--- /dev/null
+++ b/src/views/SaleRank/AllPrice/Price50/index.vue
@@ -0,0 +1,202 @@
+<template>
+    <div class="p10-outter" v-loading="load">
+        <v-label-div :title="time+'('+form.sStartTime+'至'+form.sEndTime+')'">
+            <v-btn @click="onTable">查看图表</v-btn>
+            <v-btn @click="goBack">返回</v-btn>
+        </v-label-div>
+        <div class="d2">
+            <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                <a-icon slot="suffixIcon" type="calendar" />
+            </a-range-picker>
+            <a-button @click="onSearch" style="margin-left: 40px" type="primary">查询</a-button>
+        </div>
+        <div class="d3">
+            <v-table ref="rtable" :columns="columns" :data="tbData" :pagination="pagination" :loading="tableLoading">
+                <template slot="about" slot-scope="text, record">
+                    <a-button type="primary" @click="onSale(record)">销量</a-button>
+                </template>
+            </v-table>
+        </div>
+        <a-modal title="50万以上销量排行榜趋势图(单位:辆)" width="1200px" :footer="null" @cancel="onClose" :visible="visible">
+            <div class="modal-table">
+                <a-range-picker style="width: 360px" v-model="selTime" :disabled-date="disabledDate" valueFormat="YYYY-MM-DD">
+                    <a-icon slot="suffixIcon" type="calendar" />
+                </a-range-picker>
+                <a-button @click="onSearch" type="primary" style="margin-left: 40px">查询</a-button>
+                <div class="tb-inner">
+                    <v-echarts :opt="opt"></v-echarts>
+                </div>
+            </div>
+        </a-modal>
+    </div>
+</template>
+
+<script>
+import {getCheZhuCarCategory} from "@/api/SaleRank"
+import {getCheZhuCountTime} from "@/api/SaleRank"
+import {getBrandName} from "@/api/comm"
+import createOpt from "./opt"
+import moment from "moment";
+export default {
+    name: 'Price50',
+    data() {
+        return {
+            load: false,
+            time: '50万以上销量排行榜',
+            selTime: [],
+            form: {
+                token: '',
+                sStartTime: '',
+                sEndTime: '',
+                sTimeType: 4,
+                sPriceType: 6
+            },
+            opt: {},
+            //表格
+            pagination: {
+                pageSize: 20,
+            },
+            tbData: [],
+            tableLoading: false,
+            columns: [
+                {
+                    title: "排名",
+                    dataIndex: "id",
+                    key: "id",
+                    width: 120
+                },
+                {
+                    title: "车型",
+                    dataIndex: "seriesname",
+                    key: "seriesname",
+                },
+                {
+                    title: "能源类型",
+                    dataIndex: "energys",
+                    key: "energys",
+                },
+                {
+                    title: "销量",
+                    dataIndex: "salescount",
+                    key: "salescount",
+                },
+                {
+                    title: "售价(万元)",
+                    dataIndex: "price",
+                    key: "price",
+                },
+                {
+                    title: "车型相关",
+                    dataIndex: "about",
+                    key: "about",
+                    scopedSlots: { customRender: "about" },
+                },
+            ],
+            //图表
+            visible: false,
+        }
+    },
+    created() {
+        this.form.token = this.getToken
+        this.getData();
+    },
+    methods: {
+        getData() {
+            this.load = true;
+            let o = {token: this.getToken};
+            getCheZhuCountTime(o).then(res => {
+                let data = res.data;
+                this.form.sStartTime = data.Data[0].Time;
+                this.form.sEndTime = data.Data[data.Data.length-1].Time;
+                let obj = {
+                    token: this.getToken,
+                    sTimeType: 4,
+                    sStartTime: this.form.sStartTime + '-01',
+                    sEndTime: this.form.sEndTime + '-01',
+                    sPriceType: 6
+                }
+                getCheZhuCarCategory(obj).then(res => {
+                    let data = res.data;
+                    this.tbData = data;
+                    let dx = [];
+                    let ds = [];
+                    data.forEach(ele => {
+                        dx.push(ele.seriesname);
+                        ds.push(ele.salescount);
+                    })
+                    this.opt = createOpt(dx,ds);
+                });
+                this.load = false
+            });
+        },
+        //查询
+        onSearch() {
+            this.form.sStartTime = this.selTime[0];
+            this.form.sEndTime = this.selTime[1];
+            let obj = Object.assign({},this.form);
+            getCheZhuCarCategory(obj).then(res => {
+                let data = res.data;
+                this.tbData = data;
+                let dx = [];
+                let ds = [];
+                data.forEach(ele => {
+                    dx.push(ele.seriesname);
+                    ds.push(ele.salescount);
+                })
+                this.opt = createOpt(dx,ds);        
+            })
+        },
+        //查看图表
+        onTable() {
+            this.visible = true;
+        },
+        onClose() {
+            this.visible = false;
+        },
+        //返回
+        goBack() {
+            this.$router.go(-1);
+        },
+        disabledDate(current) {
+            return current > moment();
+        },
+        //点击销量
+        onSale(value) {
+            let seriesname = value.seriesname;
+            getBrandName({token: this.getToken, sSeriesName:seriesname}).then(res => {
+                let brandName = res.data;
+                this.$router.push(
+                {
+                    path: '/saleRank/seriesInfo',
+                    query: {
+                        sBrand: brandName,
+                        sSeriesName: seriesname
+                    }
+                }
+            );
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+    .p10-outter {
+        width: 1552px;
+        border: 2px solid #0f2a4d;
+        .d2 {
+            display: flex;
+            justify-content: flex-start;
+            padding: 16px;
+        }
+    }
+    .modal-table {
+        width: 1200px;
+        height: 460px;
+        .tb-inner {
+            width: 100%;
+            height: calc(100% - 48px);
+            margin-top: 24px;
+        }
+    }    
+</style>
\ No newline at end of file
diff --git a/src/views/SaleRank/AllPrice/Price50/opt.js b/src/views/SaleRank/AllPrice/Price50/opt.js
new file mode 100644
index 0000000..245fdc6
--- /dev/null
+++ b/src/views/SaleRank/AllPrice/Price50/opt.js
@@ -0,0 +1,111 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-12 09:12:13
+ * @LastEditTime: 2021-11-02 18:03:08
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/BrandInsight/brandTop/opt.js
+ */
+import * as echarts from "echarts";
+import { bigNumberTransform } from "@/utils/gol/dataTool"
+export default function createOpt(dx,ds) {
+    return {
+        grid: {
+            top: "16px",
+            left: "16px",
+            right: "28px",
+            bottom: "16px",
+            containLabel: true,
+        },
+        tooltip: {
+            trigger: "axis",
+            backgroundColor: "#08182F",
+            color: "#fff",
+            borderColor: "#3373CC",
+            textStyle: {
+                color: "#fff", //设置文字颜色
+            },
+            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
+            formatter: function (params) {
+                var result = "";
+                var dotHtml =
+                    '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>';
+                params.forEach(function (item) {
+                    result += item.axisValue + "</br>" + dotHtml + item.data;
+                });
+                return result;
+            },
+        },
+        xAxis: {
+            type: "category",
+            axisTick: {
+                show: false,
+            },
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#fff",
+                },
+            },
+            data: dx,
+        },
+        yAxis: {
+            type: "value",
+            axisLine: {
+                show: false,
+                lineStyle: {
+                    color: "#FFF",
+                },
+            },
+            axisLabel: {
+                formatter: (value) => {
+                    let str = bigNumberTransform(value);
+                    return str;
+                }
+            },
+            splitLine: {
+                lineStyle: {
+                    type: "dashed", // y轴分割线类型
+                    color: "#012b4b",
+                },
+            },
+        },
+        series: [
+            {
+                name: "2001",
+                data: ds,
+                type: "bar",
+                barWidth: 24,
+                itemStyle: {
+                    normal: {
+                        label: {
+                            show: true, //开启显示
+                            position: 'top', //在上方显示
+                            textStyle: { //数值样式
+                                color: '#fff',
+                                fontSize: 14
+                            }
+                        },
+                        color: new echarts.graphic.LinearGradient(
+                            0,
+                            1,
+                            0,
+                            0,
+                            [
+                                {
+                                    offset: 0,
+                                    color: "rgba(91, 157, 249, 0)", // 0% 处的颜色
+                                },
+                                {
+                                    offset: 1,
+                                    color: "#3373CC", // 100% 处的颜色#3373CC
+                                },
+                            ],
+                            false
+                        ),
+                    },
+                },
+            },
+        ],
+    }
+}
diff --git a/src/views/SaleRank/CitySale/index.vue b/src/views/SaleRank/CitySale/index.vue
index ef8812e..365d80e 100644
--- a/src/views/SaleRank/CitySale/index.vue
+++ b/src/views/SaleRank/CitySale/index.vue
@@ -181,7 +181,15 @@ export default {
         },
         //点击明细
         onSalePro(record) {
-            let obj = Object.assign(this.form, {sProv: record.key})
+            let obj = {
+                token: this.form.token,
+                sTimeType: 4,
+                sStartTime: this.form.sStartTime,
+                sEndTime: this.form.sEndTime,
+                sBrandType: '',
+                iPageIndex: 1,
+                sProv: record.key
+            }
             getSalesType0(obj).then(res => {
                 let data = res.data;
                 this.dataProCity = data
@@ -197,7 +205,15 @@ export default {
             this.visible = true;
         },
         onSaleCity(record) {
-            let obj = Object.assign(this.form, {sCity: record.key})
+            let obj = {
+                token: this.form.token,
+                sTimeType: 4,
+                sStartTime: this.form.sStartTime,
+                sEndTime: this.form.sEndTime,
+                sBrandType: '',
+                iPageIndex: 1,
+                sCity: record.key
+            }
             getSalesType6(obj).then(res => {
                 let data = res.data;
                 this.dataCityBrand = data