wyf 2 лет назад
Родитель
Сommit
e050524f87

+ 6 - 1
src/views/datamanager/platformdata/charts/BarChart.vue

@@ -2,4 +2,9 @@
 
 
 <script setup lang="ts"></script>
 <script setup lang="ts"></script>
 
 
-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+  #bar-chart {
+    width: 100%;
+    height: 372px;
+  }
+</style>

+ 6 - 1
src/views/datamanager/platformdata/charts/LineChart.vue

@@ -2,4 +2,9 @@
 
 
 <script setup lang="ts"></script>
 <script setup lang="ts"></script>
 
 
-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+  #line-chart {
+    width: 100%;
+    height: 372px;
+  }
+</style>

+ 2 - 2
src/views/datamanager/platformdata/compoents/common/ChartIndex.vue

@@ -1,7 +1,7 @@
 <template>
 <template>
   <Timenation />
   <Timenation />
-  <BarChart />
-  <LineChart />
+  <BarChart v-if="true" />
+  <LineChart v-else />
   <!-- <div v-if="isShowAll === false" style="text-align: center">
   <!-- <div v-if="isShowAll === false" style="text-align: center">
     <el-button type="text" @click="currentDayChart">今日</el-button>
     <el-button type="text" @click="currentDayChart">今日</el-button>
     <el-button type="text" @click="currentMonthChart">本月</el-button>
     <el-button type="text" @click="currentMonthChart">本月</el-button>

+ 27 - 33
src/views/datamanager/platformdata/compoents/common/Timenation.vue

@@ -7,10 +7,12 @@
       start-placeholder="开始日期"
       start-placeholder="开始日期"
       end-placeholder="结束日期"
       end-placeholder="结束日期"
       @change="change"
       @change="change"
-      :shortcuts="shortcuts"
+      style="max-width: 299px"
     ></el-date-picker>
     ></el-date-picker>
     <div class="shortcut">
     <div class="shortcut">
-      <el-button @click="">最近一周</el-button>
+      <el-button @click="changeDateToday">今日</el-button>
+      <el-button @click="changeDateThisMonth">本月</el-button>
+      <el-button @click="changeDateTotal">累计</el-button>
     </div>
     </div>
   </div>
   </div>
 </template>
 </template>
@@ -18,47 +20,39 @@
 <script setup lang="ts">
 <script setup lang="ts">
   import { ref } from 'vue';
   import { ref } from 'vue';
 
 
-  const dateRange = ref('');
+  const dateRange = ref<Date[]>();
   const change = (val: any) => {
   const change = (val: any) => {
     console.log(val);
     console.log(val);
   };
   };
 
 
-  const shortcuts = [
-    {
-      text: '今日',
-      value: () => {
-        const end = new Date();
-        const start = new Date();
-        start.setTime(start.getTime() - 3600 * 1000 * 24 * 1);
-        return [start, end];
-      },
-    },
-    {
-      text: '本月',
-      value: () => {
-        const end = new Date();
-        const start = new Date();
-        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
-        return [start, end];
-      },
-    },
-    {
-      text: '累计',
-      value: () => {
-        const end = new Date();
-        const start = new Date();
-        start.setTime(0);
-        return [start, end];
-      },
-    },
-  ];
+  const changeDateToday = () => {
+    const end = new Date();
+    const start = new Date();
+    dateRange.value = [start, end];
+  };
+
+  const changeDateThisMonth = () => {
+    const end = new Date();
+    const start = new Date();
+    const nowDate = start.getDate();
+    start.setTime(start.getTime() - 3600 * 1000 * 24 * (nowDate - 1));
+    dateRange.value = [start, end];
+  };
+
+  const changeDateTotal = () => {
+    const end = new Date();
+    const start = new Date();
+    start.setTime(0);
+    dateRange.value = [start, end];
+  };
 </script>
 </script>
 
 
 <style lang="scss" scoped>
 <style lang="scss" scoped>
   .timenation {
   .timenation {
+    padding-right: 25px;
     width: 100%;
     width: 100%;
     display: flex;
     display: flex;
-    justify-content: center;
+    justify-content: space-between;
     align-items: center;
     align-items: center;
   }
   }
 </style>
 </style>

+ 11 - 1
src/views/datamanager/platformdata/compoents/query/Query.vue

@@ -127,6 +127,16 @@
   //         return Promise.reject();
   //         return Promise.reject();
   //     });
   //     });
   // }
   // }
+  // :deep(.el-dialog__header) {
+  //   padding: 0;
+  // }
 </script>
 </script>
 
 
-<style scoped></style>
+<style scoped lang="scss">
+  :deep(.el-dialog__header) {
+    padding: 0;
+  }
+  :deep(.el-dialog__headerbtn) {
+    padding-top: 23px;
+  }
+</style>