up

src/views/meteorological/remoteSense/drought/Drought.vue

@@ -367,7 +367,9 @@ import axios from 'axios';
 import 'echarts-gl';
 import { downLoadFile } from '@/utils/download.js';
 import * as xlsx from 'xlsx'; // Vue3 版本
+import { useRouter } from 'vue-router';
 
+const router = useRouter();
 let viewer = ref(null);
 const areaDiv = ref(null);
 const typesofDiv = ref(null);
@@ -437,12 +439,6 @@ let dic = {
     中度干旱: { color: 'rgba(205, 92, 92, 1)', disabled: false },
     重度干旱: { color: 'red', disabled: false },
 };
-watch(
-    () => Township.arr,
-    val => {
-        console.log('val:', val);
-    }
-);
 //行政区划数据
 var data = {
     title: [],
@@ -468,6 +464,10 @@ let layersDic = {
 
 // 组件挂载完成后执行
 onMounted(() => {
+    initonMounted()
+});
+
+function initonMounted() {
     getareaStatisticsDroughts('370211'); //干旱等级面积统计
     getproportionOfAreas('370211'); //干旱等级面积占比
     geteachFreezingGradeAreas(); //高标准农田干旱等级面积占比
@@ -492,7 +492,9 @@ onMounted(() => {
     leftWra ? (leftWra.style.transform = 'translate(-107%,0)') : '';
     let rightWra = document.querySelector('.rightWra');
     rightWra.style.transform = 'translate(107%,0)';
-});
+    localStorage.setItem(router.currentRoute.value.path, true);
+}
+
 
 /*-------------地图------------------------*/
 const mapOption = {
@@ -1117,9 +1119,6 @@ const onSubmit = () => {
         droughtRating: formInline.value.droughtRating,
         area: formInline.value.area,
     }).then(res => {
-        console.log(res.data);
-        let data = [];
-        let newData = [];
         tableItem.value = [
             {
                 lable: '',
@@ -2690,11 +2689,12 @@ function chartModes() {
         console.log(item.重度干旱);
         arr.push(item.region);
         item.湿润 !== undefined ? 湿润.push(item.湿润) : 湿润.push(0);
-        item.适宜 !== undefined ? 适宜.push(item.适宜) : 适宜.psuh(0);
+        item.适宜 !== undefined ? 适宜.push(item.适宜) : 适宜.push(0);
         item.轻度干旱 !== undefined ? 轻度干旱.push(item.轻度干旱) : 轻度干旱.push(0);
         item.中度干旱 !== undefined ? 中度干旱.push(item.中度干旱) : 中度干旱.push(0);
         item.重度干旱 !== undefined ? 重度干旱.push(item.重度干旱) : 重度干旱.push(0);
     });
+    let ends = (10 / arr.length) * 100;
     let option = {
         tooltip: {
             trigger: 'axis',
@@ -2726,38 +2726,32 @@ function chartModes() {
             icon: 'rect',
             itemWidth: 4, // 图例图表宽度
             itemHeight: 12, // 图例图标高度
-            data: ['餐费', '打车费', '零食', '日用品'],
+            data: [],
         },
         dataZoom: [
             {
-                // start: 0,//默认为0
-                // end: 100,//默认为100
                 type: 'slider',
-                show: false,
-                // xAxisIndex: [0],
-                handleSize: 0, //滑动条的 左右2个滑动条的大小
-                startValue: 0, // 初始显示值
-                endValue: 6, // 结束显示值
-                height: 10, //组件高度
-                left: '5%', //左边的距离
-                right: '4%', //右边的距离
-                bottom: 5, //底边的距离
-                borderColor: '#000',
-                fillerColor: '#269cdb',
-                borderRadius: 5,
-                backgroundColor: '#33384b', //两边未选中的滑动条区域的颜色
-                showDataShadow: false, //是否显示数据阴影 默认auto
-                showDetail: false, //即拖拽时候是否显示详细数值信息 默认true
-                realtime: true, //是否实时更新
-                filterMode: 'filter',
+                width: '40%',
+                top: '90%',
+                start: 0,
+                end: ends,
+                showDataShadow: false,
+                showDetail: false,
+                fillerColor: 'rgba(64, 158, 255)',
+                borderRadius: '50%',
+                moveHandleSize: 0,
+                moveHandleStyle: {},
+                left: '30%',
+                height: 12,
+                handleSize: '80%',
+                handleIcon: 'path://M512,512m-448,0a448,448,0,1,0,896,0a448,448,0,1,0,-896,0Z',
+                handleStyle: {
+                    borderWidth: 0,
+                    color: 'rgba(64, 158, 255)',
+                },
             },
-            //下面这个属性是里面拖到
             {
                 type: 'inside',
-                show: true,
-                // xAxisIndex: [0],
-                start: 1, //默认为1
-                end: 100, //默认为100
             },
         ],
         grid: {
@@ -2773,7 +2767,7 @@ function chartModes() {
             axisLabel: {
                 fontSize: 12,
                 interval: 0,
-                rotate: 40,
+                rotate: 0,
             },
             axisLine: {
                 lineStyle: {