no message

src/api/common.js

@@ -9,6 +9,38 @@ export function lbsAmapRegion(params) {
   })
 }
 
+export function bigGetLarge1(params) {
+  return request({
+    url: '/big/getLarge1',
+    method: 'post',
+    params
+  })
+}
+
+export function bigGetLarge3(params) {
+  return request({
+    url: '/big/getLarge3',
+    method: 'post',
+    params
+  })
+}
+
+export function bigGetLarge2(params) {
+  return request({
+    url: '/big/getLarge2',
+    method: 'post',
+    params
+  })
+}
+
+export function bigGetLarge9(params) {
+  return request({
+    url: '/big/getLarge9',
+    method: 'post',
+    params
+  })
+}
+
 export function commonCompanywechatGet(params) {
   return request({
     url: '/common/companywechat/get',

src/components/moduleEnclosure.vue

@@ -50,14 +50,14 @@ export default {
   border: 3px solid #082570;
   border-image: linear-gradient(0deg, #34c7ff 0%, #26d5ff 51%, #34c7ff 100%) 3 3;
   box-sizing: border-box;
-  padding: 16px;
+  padding: 12px;
 }
 .am-moduleEnclosurecon {
   position: absolute;
-  top: 16px;
-  bottom: 16px;
-  left: 16px;
-  right: 16px;
+  top: 12px;
+  bottom: 12px;
+  left: 12px;
+  right: 12px;
   z-index: 999;
 }
 .am-moduleEnclosureTitle-div {

src/views/bigViews/dataView1/components/mapDataStatistics.vue

@@ -3,27 +3,27 @@
     <div class="heat-lay-flex">
       <div class="heat-lay-item" style="width: 100%">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">今日新增安装单</div>
+          <div class="heat-item-style1-title">总运营商户（家）</div>
           <div class="fujimaintext">
-            <div class="mainText">6256</div>
+            <div class="mainText">{{Number(info.companyNum)}}</div>
           </div>
         </div>
       </div>
       <div class="averticalBart"></div>
       <div class="heat-lay-item" style="width: 100%">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">今日完工安装单</div>
+          <div class="heat-item-style1-title">总工程师（人）</div>
           <div class="fujimaintext">
-            <div class="mainText">6256</div>
+            <div class="mainText">{{Number(info.allWorker)}}</div>
           </div>
         </div>
       </div>
       <div class="averticalBart"></div>
       <div class="heat-lay-item" style="width: 100%">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">安装未完工累计</div>
+          <div class="heat-item-style1-title">总分销员（人）</div>
           <div class="fujimaintext">
-            <div class="mainText">6256</div>
+            <div class="mainText">{{Number(info.allService)}}</div>
           </div>
         </div>
       </div>
@@ -34,9 +34,9 @@
           class="heat-item-style1"
           style="cursor: pointer"
         >
-          <div class="heat-item-style1-title">今日出勤师傅</div>
+          <div class="heat-item-style1-title">总用户数（人）</div>
           <div class="fujimaintext">
-            <div class="mainText">6256</div>
+            <div class="mainText">{{Number(info.allUser)}}</div>
           </div>
         </div>
       </div>
@@ -45,40 +45,40 @@
     <div class="heat-lay-flex">
       <div class="heat-lay-item" style="width: 100%">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">今日新增维修单</div>
+          <div class="heat-item-style1-title">今日登入商户（家）</div>
           <div class="fujimaintext">
-            <div class="mainText">6256</div>
-            <div class="subText">55.9%</div>
+            <div class="mainText">{{Number(info.loginCompanyNum)}}</div>
+            <div class="subText">{{Number(info.loginCompanyNumPer)}}%</div>
           </div>
         </div>
       </div>
       <div class="averticalBarb"></div>
       <div class="heat-lay-item" style="width: 100%">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">今日完工维修单</div>
+          <div class="heat-item-style1-title">今日登入工程师（人）</div>
           <div class="fujimaintext">
-            <div class="mainText">6256</div>
-            <div class="subText">55.9%</div>
+            <div class="mainText">{{Number(info.loginAllWorker)}}</div>
+            <div class="subText">{{Number(info.loginAllWorkerPer)}}%</div>
           </div>
         </div>
       </div>
       <div class="averticalBarb"></div>
       <div class="heat-lay-item" style="width: 100%">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">维修未完工累计</div>
+          <div class="heat-item-style1-title">今日登入分销员（人）</div>
           <div class="fujimaintext">
-            <div class="mainText">6256</div>
-            <div class="subText">55.9%</div>
+            <div class="mainText">{{Number(info.loginAllService)}}</div>
+            <div class="subText">{{Number(info.loginAllServicePer)}}%</div>
           </div>
         </div>
       </div>
       <div class="averticalBarb"></div>
       <div class="heat-lay-item">
         <div class="heat-item-style1">
-          <div class="heat-item-style1-title">今日回收工单</div>
+          <div class="heat-item-style1-title">今日登入用户（人）</div>
           <div class="fujimaintext">
-            <div class="mainText">6256</div>
-            <div class="subText">55.9%</div>
+            <div class="mainText">{{Number(info.loginAllUser)}}</div>
+            <div class="subText">{{Number(info.loginAllUserPer)}}%</div>
           </div>
         </div>
       </div>
@@ -87,23 +87,46 @@
 </template>
 
 <script>
+import { bigGetRegion, bigGetLarge1, bigGetLarge2 } from '@/api/common.js';
 export default {
   components: {  },
   data() {
     return {
-      
+      info:{
+        "allService": 0,
+        "allUser": 0,
+        "allWorker": 0,
+        "allWorkerOrderNum": 0,
+        "companyNum": 0,
+        "increOrderNum": 0,
+        "loginAllService": 0,
+        "loginAllServicePer": 0,
+        "loginAllUser": 0,
+        "loginAllUserPer": 0,
+        "loginAllWorker": 0,
+        "loginAllWorkerPer": 0,
+        "loginCompanyNum": 0,
+        "loginCompanyNumPer": 0,
+        "neverWorkerNum": 0,
+        "salesOrderNum": 0
+      }
     };
   },
   watch: {
     
   },
   mounted() {
-    
+    this.getBigGetLarge1()
   },
   beforeUnmount() {
   },
   methods: {
-   
+   getBigGetLarge1(pam){
+    bigGetLarge2(pam).then(res=>{
+      this.info = res.data
+      console.log(this.info,"niunpionpoimo;i")
+    })
+   }
   },
 };
 </script>

src/views/bigViews/dataView1/components/mapdata.vue

@@ -47,37 +47,36 @@ import zhejiang from './js/zhejiang.js';
 import moduleEnclosure from '@/components/moduleEnclosure.vue';
 import mapDataStatistics from './mapDataStatistics.vue';
 import * as echarts from 'echarts';
-import { bigGetRegion } from '@/api/common.js';
+import { bigGetRegion, bigGetLarge9 } from '@/api/common.js';
 // 计算 GeoJSON 数据的边界框
 function calculateBoundingBox(geoJsonData) {
-  let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
-  geoJsonData.features.forEach(feature => {
-    feature.geometry.coordinates[0].forEach(coord => {
-      minX = Math.min(minX, coord[0]);
-      minY = Math.min(minY, coord[1]);
-      maxX = Math.max(maxX, coord[0]);
-      maxY = Math.max(maxY, coord[1]);
+    let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+    geoJsonData.features.forEach((feature) => {
+        const coordinates = feature.geometry.coordinates;
+        const type = feature.geometry.type;
+        if (type === 'Polygon') {
+            coordinates.forEach((polygon) => {
+                polygon.forEach((coord) => {
+                    minX = Math.min(minX, coord[0]);
+                    minY = Math.min(minY, coord[1]);
+                    maxX = Math.max(maxX, coord[0]);
+                    maxY = Math.max(maxY, coord[1]);
+                });
+            });
+        } else if (type === 'MultiPolygon') {
+            coordinates.forEach((multiPolygon) => {
+                multiPolygon.forEach((polygon) => {
+                    polygon.forEach((coord) => {
+                        minX = Math.min(minX, coord[0]);
+                        minY = Math.min(minY, coord[1]);
+                        maxX = Math.max(maxX, coord[0]);
+                        maxY = Math.max(maxY, coord[1]);
+                    });
+                });
+            });
+        }
     });
-  });
-  return { minX, minY, maxX, maxY };
-}
-
-// 计算缩放比例
-function calculateZoom(boundingBox, containerWidth, containerHeight) {
-  const geoWidth = boundingBox.maxX - boundingBox.minX;
-  const geoHeight = boundingBox.maxY - boundingBox.minY;
-
-  // 打印调试信息
-  console.log('BoundingBox:', boundingBox);
-  console.log('GeoWidth:', geoWidth, 'GeoHeight:', geoHeight);
-
-  if (geoWidth === 0 || geoHeight === 0) {
-    return 1;  // 如果宽度或高度为0，返回默认缩放比例1
-  }
-
-  const scaleX = containerWidth / geoWidth;
-  const scaleY = containerHeight / geoHeight;
-  return Math.min(scaleX, scaleY);
+    return { minX, minY, maxX, maxY };
 }
 export default {
   components: {
@@ -104,41 +103,44 @@ export default {
     };
   },
   mounted() {
+    this.getbigGetLarge9();
     this.echart_7();
   },
   methods: {
-    echart_7() {
+    getbigGetLarge9(){
+      bigGetLarge9().then(res=>{
+        console.log(res)
+      })
+    },
+    echart_7(pam={
+        country: 100000,
+        // province:"广东省",
+        // city: "广州市"
+      }) {
       var that = this
       if (that.myChart) {
         that.myChart.dispose();
       }
-      bigGetRegion({
-        country: 100000,
-        // province:"广东省",
-        // city: "广州市"
-      }).then(res => {
+      bigGetRegion(pam).then(res => {
         // 初始化 ECharts 实例
         that.myChart = echarts.init(document.getElementById('chart_7'));
         const geoJsonData = JSON.parse(res.data)
-        // 假设第一个省份的中心点为地图的中心点
-        const center = geoJsonData.features[0].properties.center;
         // 计算边界框
         const boundingBox = calculateBoundingBox(geoJsonData);
-        // 获取容器尺寸
-        const containerWidth = that.myChart.getWidth();
-        const containerHeight = that.myChart.getHeight();
-        // 计算合适的缩放比例
-        const zoom = calculateZoom(boundingBox, containerWidth, containerHeight);
-        console.log(center, zoom)
-        // 注册地图
+        // 计算中心点
+        const center = [
+            (boundingBox.minX + boundingBox.maxX) / 2,
+            (boundingBox.minY + boundingBox.maxY) / 2
+        ];
         echarts.registerMap('china', geoJsonData);
         // 指定城市和颜色
         var cityColors = {
           '北京市': '#ff7f50',
-          '上海': '#87cefa',
-          '广州': '#da70d6',
-          '深圳': '#32cd32',
-          '成都': '#6495ed'
+          '上海市': '#87cefa',
+          '广州市': '#da70d6',
+          '深圳市': '#32cd32',
+          '成都市': '#6495ed',
+          '白云区': 'red'
         };
         // 构建 series 数据
         var seriesData = Object.keys(cityColors).map(function (city) {
@@ -146,10 +148,13 @@ export default {
             name: city,
             itemStyle: {
               normal: {
-                areaColor: cityColors[city]
+                areaColor: cityColors[city],
+                borderColor: 'rgba(0,0,0,0)'
               },
               emphasis: {
-                areaColor: '#ffcc33'
+                // 悬浮颜色
+                areaColor: cityColors[city],
+                borderColor: 'rgba(0,0,0,0)'
               }
             }
           };
@@ -163,15 +168,18 @@ export default {
           geo: {
             map: 'china',
             roam: true,
-            zoom: isNaN(zoom) ? 1.2 : zoom, // 设置缩放比例
+            zoom: pam.country ? 1.3 : pam.city ? 4.5 : pam.province ? 1.7 : 2, // 设置缩放比例
             center: center,
             itemStyle: {
               normal: {
-                areaColor: '#eeeeee',
+                // 默认背景色
+                areaColor: 'rgba(0,0,0,0)',
+                // 边框颜色
                 borderColor: '#111'
               },
               emphasis: {
-                areaColor: '#ffcc33'
+                // 默认背景色
+                areaColor: 'red'
               }
             },
             regions: [

src/views/bigViews/dataView1/components/trendChart.vue

@@ -2,91 +2,75 @@
   <moduleEnclosure title="趋势图">
     <template v-slot:rightce>
       <div class="classbtns">
-        <div
-          @click="cindex = 0"
-          :class="{
-            select: cindex === 0,
-          }"
-        >
-          浏览量
+        <div @click="cindex = 0" :class="{
+          select: cindex === 0,
+        }">
+          浏览量(PV)
         </div>
-        <div
-          @click="cindex = 1"
-          :class="{
-            select: cindex === 1,
-          }"
-        >
-          访客量
+        <div @click="cindex = 1" :class="{
+          select: cindex === 1,
+        }">
+          访客量(UV)
         </div>
       </div>
     </template>
-    <el-carousel
-      height="100%"
-      style="width: 100%; height: 100%"
-      ref="elCarousel"
-      :autoplay="false"
-    >
-      <el-carousel-item v-for="(item, index) in 2" :key="index">
-        <div style="width: 100%; height: 100%">
-          <div
-            :id="`chartmain_${item}`"
-            style="width: 100%; height: 100%"
-          ></div>
-        </div>
-      </el-carousel-item>
-    </el-carousel>
+    <div style="width: 100%; height: 100%">
+      <div :id="`chartmain_fkell`" style="width: 100%; height: 100%"></div>
+    </div>
   </moduleEnclosure>
 </template>
 
 <script>
+import { bigGetLarge3 } from '@/api/common.js';
 import moduleEnclosure from '@/components/moduleEnclosure.vue';
 import * as echarts from 'echarts';
-import { getQuery12 } from '@/api/bigView.js';
 import { csize } from '@/utils/const.js';
-let myChart, myChart2;
 export default {
   components: {
     moduleEnclosure,
   },
   data() {
     return {
-      cindex: -1,
-      myChart: null,
-      myChart2: null,
+      cindex: 0,
     };
   },
   mounted() {
-    // this.timeId = getQuery12((res) => {
-    //   this.eac(res.data);
-    //   this.init_myChart2(res.data);
-    // }, 70000);
-    this.cindex = 0;
+    this.getbigGetLarge3()
   },
   beforeUnmount() {
-    this.timeId();
+
   },
   watch: {
-    cindex(newVal, oldValue) {
-      if (oldValue !== -1) {
-        this.$refs.elCarousel.next();
-      }
-      if (this.timed) {
-        clearTimeout(this.timed);
-      }
-      this.timed = setTimeout(() => {
-        this.cindex = this.cindex ? 0 : 1;
-      }, 30000);
-    },
+    cindex(){
+      this.getbigGetLarge3()
+    }
   },
   methods: {
+    getbigGetLarge3() {
+      bigGetLarge3().then(res => {
+        this.eac(res.data)
+      })
+    },
     eac(value) {
+      var that = this
+      if (that.myChart) {
+        that.myChart.dispose();
+      }
       var times = value.map((item) => {
-        var str1 = item.ddate.split(' ')[0];
+        var str1 = item.dstr.split(' ')[0];
         return str1.slice(5);
       });
       var data = value.map((item) => {
-        return item.badapp;
+        return item[["num", "userNum"][this.cindex]];
       });
+      // 计算刻度的间隔
+      var interval = Math.ceil((Math.max(...data) - Math.min(...data)) / 2); // 确保有 3 个刻度
+      interval = interval < 1 ? 1 : interval
+      // 计算 y 轴的最大值和最小值
+      var maxY = Math.ceil(Math.max(...data) / interval) * interval;
+      maxY = maxY < 3 ? 3 : maxY
+      var minY = Math.floor(Math.min(...data) / interval) * interval;
+      minY = minY < 1 ? 1 : minY
       var option = {
         tooltip: {
           trigger: 'axis',
@@ -113,10 +97,10 @@ export default {
           subtext: '',
         },
         grid: {
-          x: csize(65),
+          x: csize(40),
           y: csize(40),
-          x2: csize(30),
-          y2: csize(30),
+          x2: csize(20),
+          y2: csize(20),
         },
         xAxis: {
           data: times,
@@ -138,11 +122,15 @@ export default {
               color: '#8AB1DC',
             },
           },
+          boundaryGap: false,
         },
         yAxis: [
           {
+            min: minY,
+            max: maxY,
+            interval: interval,
             type: 'value',
-            name: '单位（单）',
+            name: '人（次）',
             nameTextStyle: {
               fontSize: csize(16),
             },
@@ -176,8 +164,10 @@ export default {
         series: [
           {
             // For shadow
-            type: 'bar',
+            type: 'line',
             barWidth: 10,
+            smooth: true,  // 设置平滑曲线
+            symbol: 'none',  // 隐藏节点
             itemStyle: {
               color: 'rgba(0,0,0,0.05)',
             },
@@ -187,8 +177,10 @@ export default {
             animation: false,
           },
           {
-            type: 'bar',
+            type: 'line',
             barWidth: 10,
+            smooth: true,  // 设置平滑曲线
+            symbol: 'none',  // 隐藏节点
             itemStyle: {
               color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                 { offset: 0, color: '#0efdff' },
@@ -197,6 +189,18 @@ export default {
               ]),
               barBorderRadius: 5,
             },
+            areaStyle: {  // 设置阴影样式
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{  // 线性渐变，从上到下
+                offset: 0,
+                color: 'rgba(45,77,149,1)'  // 阴影起始颜色
+              }, {  // 线性渐变，从上到下
+                offset: 0.5,
+                color: 'rgba(45,77,149,.5)'  // 阴影起始颜色
+              }, {
+                offset: 1,
+                color: 'rgba(45,77,149,.2)'  // 阴影结束颜色
+              }])
+            },
             emphasis: {
               itemStyle: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -211,248 +215,8 @@ export default {
           },
         ],
       };
-      if (myChart) {
-        myChart.dispose();
-      }
-      myChart = new echarts.init(document.getElementById('chartmain_1'));
-      myChart.setOption(option);
-    },
-    init_myChart2(value) {
-      var times = value.map((item) => {
-        var str1 = item.ddate.split(' ')[0];
-        return str1.slice(5);
-      });
-      var data = value.map((item) => {
-        return item.goodrate;
-      });
-      var data1 = value.map((item) => {
-        return item.insrate;
-      });
-      var data2 = value.map((item) => {
-        return item.reprate;
-      });
-      if (myChart2) {
-        myChart2.dispose();
-      }
-      myChart2 = new echarts.init(document.getElementById('chartmain_2'));
-      myChart2.setOption({
-        tooltip: {
-          trigger: 'axis',
-          formatter: function (params) {
-            var res = '';
-            for (var i = 0, l = params.length; i < l; i++) {
-              res +=
-                '' + params[i].seriesName + ' : ' + params[i].value + '<br>';
-            }
-            return `<div style="color:#fff;">${res}</div>`;
-          },
-          transitionDuration: 0,
-          backgroundColor: '#092a66',
-          borderColor: '#0462b5',
-          borderRadius: 8,
-          borderWidth: 2,
-          padding: [5, 10],
-          axisPointer: {
-            type: 'line',
-            lineStyle: {
-              type: 'dashed',
-              color: '#8AB1DC',
-            },
-          },
-        },
-        legend: {
-          icon: 'circle',
-          itemWidth: 8,
-          itemHeight: 8,
-          itemGap: 10,
-          top: '16',
-          right: '10',
-          data: ['好评率', '安装评价率', '维修评价率'],
-          textStyle: {
-            fontSize: csize(16),
-            color: '#8AB1DC',
-          },
-        },
-        grid: {
-          x: csize(65),
-          y: csize(50),
-          x2: csize(30),
-          y2: csize(30),
-        },
-        xAxis: [
-          {
-            type: 'category',
-            boundaryGap: false,
-            axisLabel: {
-              interval: Math.floor(times.length / 15),
-              showMinLabel: true, //是否显示最小 tick 的 label
-              showMaxLabel: true, //是否显示最大 tick 的 label
-              fontSize: csize(12),
-            },
-            axisLine: {
-              show: false,
-              lineStyle: {
-                color: '#8AB1DC',
-              },
-            },
-            axisTick: {
-              show: false,
-            },
-            data: times,
-          },
-        ],
-        yAxis: [
-          {
-            type: 'value',
-            name: '单位（%）',
-            nameTextStyle: {
-              fontSize: csize(16),
-            },
-            axisLine: {
-              show: false,
-              lineStyle: {
-                color: '#8AB1DC',
-              },
-            },
-            axisLabel: {
-              margin: 10,
-              textStyle: {
-                fontSize: csize(12),
-              },
-            },
-            splitLine: {
-              lineStyle: {
-                color: '#364D95',
-              },
-            },
-            axisTick: {
-              show: false,
-            },
-          },
-        ],
-        series: [
-          {
-            name: '好评率',
-            type: 'line',
-            smooth: true,
-            showSymbol: false,
-            lineStyle: {
-              normal: {
-                width: 2,
-              },
-            },
-            areaStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(
-                  0,
-                  0,
-                  0,
-                  1,
-                  [
-                    {
-                      offset: 0,
-                      color: 'rgba(137, 189, 27, 0.3)',
-                    },
-                    {
-                      offset: 0.8,
-                      color: 'rgba(137, 189, 27, 0)',
-                    },
-                  ],
-                  false
-                ),
-                shadowColor: 'rgba(0, 0, 0, 0.1)',
-                shadowBlur: 10,
-              },
-            },
-            itemStyle: {
-              normal: {
-                color: '#F34799',
-              },
-            },
-            data: data,
-          },
-          {
-            name: '安装评价率',
-            type: 'line',
-            smooth: true,
-            showSymbol: false,
-            lineStyle: {
-              normal: {
-                width: 2,
-              },
-            },
-            areaStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(
-                  0,
-                  0,
-                  0,
-                  1,
-                  [
-                    {
-                      offset: 0,
-                      color: 'rgba(137, 189, 27, 0.3)',
-                    },
-                    {
-                      offset: 0.8,
-                      color: 'rgba(137, 189, 27, 0)',
-                    },
-                  ],
-                  false
-                ),
-                shadowColor: 'rgba(0, 0, 0, 0.1)',
-                shadowBlur: 10,
-              },
-            },
-            itemStyle: {
-              normal: {
-                color: '#1cc840',
-              },
-            },
-            data: data1,
-          },
-          {
-            name: '维修评价率',
-            type: 'line',
-            smooth: true,
-            showSymbol: false,
-            lineStyle: {
-              normal: {
-                width: 2,
-              },
-            },
-            areaStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(
-                  0,
-                  0,
-                  0,
-                  1,
-                  [
-                    {
-                      offset: 0,
-                      color: 'rgba(0, 136, 212, 0.3)',
-                    },
-                    {
-                      offset: 0.8,
-                      color: 'rgba(0, 136, 212, 0)',
-                    },
-                  ],
-                  false
-                ),
-                shadowColor: 'rgba(0, 0, 0, 0.1)',
-                shadowBlur: 10,
-              },
-            },
-            itemStyle: {
-              normal: {
-                color: '#43bbfb',
-              },
-            },
-            data: data2,
-          },
-        ],
-      });
+      that.myChart = new echarts.init(document.getElementById('chartmain_fkell'));
+      that.myChart.setOption(option);
     },
   },
 };
@@ -460,27 +224,34 @@ export default {
 
 <style scoped lang="scss">
 .classbtns {
-  width: 160px;
-  height: 28px;
+  width: 200px;
+  height: 30px;
   display: flex;
   flex-direction: row;
+  justify-content: space-between;
   align-items: center;
-  border: 2px solid #0e72e6;
   cursor: pointer;
-  div {
-    width: 50%;
+
+  div:nth-child(1),
+  div:nth-child(2) {
+    width: 48%;
     height: 100%;
     text-align: center;
     line-height: 28px;
+    border: 1px solid #0e72e6;
+    position: relative;
   }
+
   div:nth-child(1) {
-    border-right: 2px solid #0e72e6;
+    border-right: 1px solid #0e72e6;
   }
+
   .select {
     background: #0e72e6;
     color: #bbd4ff;
   }
 }
+
 ::v-deep .el-carousel__arrow,
 ::v-deep .el-carousel__indicators {
   display: none;