feat: 合并代码

apps/web-antd/src/views/property/greenPlantRentalManagement/reportStatistics/index.vue

@@ -7,6 +7,8 @@ import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
 
 import { Button } from 'ant-design-vue';
 
+import { statisticsByTime } from '#/api/property/reportStatistics';
+
 const orderLineRef = ref<EchartsUIType>();
 const leasePieRef = ref<EchartsUIType>();
 const customerTypesBarRef = ref<EchartsUIType>();
@@ -27,14 +29,18 @@ const { renderEcharts: renderConservationTasksBar } = useEcharts(
 const { renderEcharts: renderMaintenanceQualityScoresPei } = useEcharts(
   maintenanceQualityScoresPeiRef,
 );
+const timeUnit = ref<number>(1)
 
-onMounted(() => {
+onMounted(async () => {
+  // 查询订单数量趋势
+  const res = await statisticsByTime({ timeUnit: timeUnit.value });
+  const xAxisData = res?.time ?? [];
+  const seriesData = res?.counts ?? [];
   renderEcharts({
-    title: { text: '订单数量趋势' },
     tooltip: { trigger: 'axis' },
     xAxis: {
       type: 'category',
-      data: ['1月', '2月', '3月', '4月', '5月', '6月'],
+      data: xAxisData,
       boundaryGap: false,
     },
     yAxis: { type: 'value' },
@@ -42,7 +48,7 @@ onMounted(() => {
       {
         name: '订单数',
         type: 'line',
-        data: [120, 132, 101, 134, 90, 230],
+        data: seriesData,
         smooth: true,
       },
     ],
@@ -199,6 +205,15 @@ onMounted(() => {
     ],
   });
 });
+const nodeOptions = [
+  { label: '日', value: 1 },
+  { label: '周', value: 2 },
+  { label: '月', value: 3 },
+];
+function handleAssociationChange(e: any) {
+  console.log(e);
+  timeUnit.value = e.target.value;
+}
 </script>
 <template>
   <div class="main">
@@ -226,6 +241,19 @@ onMounted(() => {
         </div>
         <div class="row-first">
           <div class="item1">
+            <div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px;">
+              <span style="font-size: 18px; font-weight: bold;">订单数量趋势</span>
+              <div>
+                <RadioGroup
+                  v-model:value="timeUnit"
+                  :options="nodeOptions"
+                  button-style="solid"
+                  option-type="button"
+                  @change="handleAssociationChange"
+                />
+
+              </div>
+            </div>
             <EchartsUI
               ref="orderLineRef"
               height="350px"
@@ -300,9 +328,6 @@ onMounted(() => {
       .title-operate {
         display: flex;
 
-        .calendar {
-        }
-
         .export {
           margin-left: 20px;
         }
@@ -339,17 +364,21 @@ onMounted(() => {
         display: flex;
         justify-content: space-between;
         height: 400px;
+        margin-bottom: 50px;
       }
 
       .row-second {
         display: flex;
         justify-content: space-between;
         height: 400px;
+        margin-bottom: 50px;
+
       }
 
       .row-third {
         height: 400px;
         margin-bottom: 50px;
+        
       }
 
       .row-fouth {
@@ -359,11 +388,19 @@ onMounted(() => {
       .item1 {
         width: 45%;
         height: 100%;
+        background-color: #fff;
+        padding: 10px;
+        border-radius: 8px;
+        // margin: 20px;
+
       }
 
       .item2 {
         width: 50%;
         height: 100%;
+        background-color: #fff;
+        padding: 10px;
+        border-radius: 8px;
       }
     }
   }