Merge branch 'main' of http://47.109.205.240:3000/Web/digital-agriculture-screen

src/components/custom-echart-bar/index.vue

@@ -37,7 +37,7 @@ export default {
   emits: ['click'],
   setup(props, { emit }) {
     const chartRef = ref(null);
-    const { setOptions, getInstance } = useEcharts(chartRef);
+    const { setOptions, getInstance, startAutoPlay } = useEcharts(chartRef);
     const option = reactive({
       tooltip: {
         trigger: 'axis',
@@ -97,6 +97,11 @@ export default {
       option.series = props.isSeries && option.series.length > 0 ? option.series : seriesData;
       option.xAxis.data = xAxisData;
       setOptions(option);
+      startAutoPlay({
+        interval: 2000,
+        seriesIndex: 0,
+        showTooltip: true,
+      });
       getInstance()?.off('click', onClick);
       getInstance()?.on('click', onClick);
     }

src/components/custom-rank-list/index.vue

@@ -187,7 +187,7 @@ onUnmounted(() => {
 .custom-rank-list {
   overflow: hidden;
   width: 100%;
-  height: 100%;
+  height: v-bind('h+"px"');
   .row-item {
     display: flex;
     justify-content: center;

src/views/land/components/distributionCharts.vue

@@ -18,6 +18,14 @@ const state = reactive({
       axisPointer: {
         type: 'shadow',
       },
+      formatter: (data) => {
+        const params = data[0];
+        let str = `<div class="custom-echarts-tips">
+          <span>${params.name}</span><br/>
+          <span>${params.marker} ${params.data} 万亩</span>
+        </div>`;
+        return str;
+      },
     },
     barStyle: {
       barWidth: 15,

src/views/land/components/landCirculation.vue

@@ -7,7 +7,7 @@
 <script setup>
 import { ref } from 'vue';
 const options = ref({
-  attr: { w: '100%', h: 200 },
+  attr: { w: '100%', h: 240 },
   option: {
     // 数据
     dataset: [
@@ -25,20 +25,20 @@ const options = ref({
       { name: '大同', value: 51.11 },
     ],
     type: 'column',
-    rowNum: 5,
+    rowNum: 6,
     isAnimation: true,
-    waitTime: 2,
+    waitTime: 5,
     unit: '万元',
     sort: true,
-    height: 16,
+    height: 12,
     color: 'linear-gradient(90deg,rgba(53,208,192,0.00), #35d0c0)',
     textColor: '#fff',
     borderRadius: '12px',
     carousel: 'single',
     indexPrefix: 'TOP',
     indexFontSize: 12,
-    leftFontSize: 12,
-    rightFontSize: 12,
+    leftFontSize: 14,
+    rightFontSize: 14,
     valueFormatter: (item) => {
       return item.value;
     },
@@ -48,8 +48,6 @@ const options = ref({
 <style scoped lang="scss">
 .rank {
   padding: 10px 20px;
-  height: 200px;
-  overflow: hidden;
 
   &:deep(.row-item) {
     .ranking-info {
@@ -65,15 +63,20 @@ const options = ref({
       .ranking-value {
         color: #fe7f03 !important;
       }
+      .inside-column {
+        background: linear-gradient(90deg, rgba(254, 127, 3, 0), #fe7f03) !important;
+      }
     }
     &:nth-child(2) {
       .ranking-info {
         color: #fef906 !important;
       }
-
       .ranking-value {
         color: #fef906 !important;
       }
+      .inside-column {
+        background: linear-gradient(90deg, rgba(254, 249, 6, 0), #fef906) !important;
+      }
     }
     &:nth-child(3) {
       .ranking-info {
@@ -82,6 +85,9 @@ const options = ref({
       .ranking-value {
         color: #02fd94 !important;
       }
+      .inside-column {
+        background: linear-gradient(90deg, rgba(2, 253, 148, 0), #02fd94) !important;
+      }
     }
   }
 }