fix: 修改客户分析、商品分析查询条件

src/views/modules/datacenter/customer-analysis/index.vue

@@ -7,12 +7,14 @@
             style="margin-right: 20px"
             v-model="formInline.dateType"
             placeholder="请选择"
+            @change="handleDateTypeChange"
           >
             <el-option
               v-for="item in [
-                { value: '1', label: '日' },
+                { value: '1', label: '近1天' },
-                { value: '3', label: '月' },
+                { value: '7', label: '近7天' },
-                { value: '4', label: '年' },
+                { value: '30', label: '近30天' },
+                { value: 'custom', label: '自定义' },
               ]"
               :key="item.value"
               :label="item.label"
@@ -21,6 +23,17 @@
             </el-option>
           </el-select>
         </el-form-item>
+        <el-form-item v-if="formInline.dateType === 'custom'">
+          <el-date-picker
+            v-model="formInline.timeRange"
+            type="datetimerange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            value-format="yyyy-MM-dd HH:mm:ss"
+          >
+          </el-date-picker>
+        </el-form-item>
         <el-form-item>
           <el-button @click="getList" type="primary">查询</el-button>
           <el-button @click="batchExport" type="success">导出</el-button>
@@ -139,13 +152,15 @@ import * as XLSX from "xlsx";
 import { saveAs } from "file-saver";
 import { mapState } from "vuex";
 import * as echarts from "echarts";
+import dayjs from "dayjs";
 export default {
   data() {
     return {
       value1: "",
       value: "",
       formInline: {
-        dateType: "1",
+        dateType: "7",
+        timeRange: [],
       },
       analysis: {},
       trend: [],
@@ -162,16 +177,19 @@ export default {
     });
   },
   methods: {
+    handleDateTypeChange() {
+      this.formInline.timeRange = [];
+    },
     getList() {
-      this.$api.dataCenter
+      let params = this.getParams();
-        .customerAnalysis({ dateType: this.formInline.dateType })
+      if (!params) return;
-        .then((res) => {
+      this.$api.dataCenter.customerAnalysis(params).then((res) => {
-          this.analysis = res.data.data;
+        this.analysis = res.data.data;
-        });
+      });
 
       const elementTypes = ["1", "2", "3", "4"];
       const chartPromises = elementTypes.map((type) =>
-        this.$api.dataCenter.customerTrend({ ...this.formInline, elementType: type })
+        this.$api.dataCenter.customerTrend({ ...params, elementType: type })
       );
 
       Promise.all(chartPromises).then((responses) => {
@@ -179,6 +197,30 @@ export default {
         this.init(chartData);
       });
     },
+    getParams() {
+      let params = {};
+      if (this.formInline.dateType === "custom") {
+        if (
+          this.formInline.timeRange &&
+          this.formInline.timeRange.length === 2
+        ) {
+          params.startTime = this.formInline.timeRange[0];
+          params.endTime = this.formInline.timeRange[1];
+        } else {
+          this.$message.error("请选择时间范围");
+          return null;
+        }
+      } else {
+        const end = dayjs().endOf("day").format("YYYY-MM-DD HH:mm:ss");
+        const start = dayjs()
+          .subtract(this.formInline.dateType - 1, "day")
+          .startOf("day")
+          .format("YYYY-MM-DD HH:mm:ss");
+        params.startTime = start;
+        params.endTime = end;
+      }
+      return params;
+    },
     init(allData) {
       // 先销毁旧实例
       this.charts.forEach((chart) => {

src/views/modules/datacenter/product-analysis/index.vue

@@ -7,13 +7,14 @@
             style="margin-right: 20px"
             v-model="formInline.dateType"
             placeholder="请选择"
+            @change="handleDateTypeChange"
           >
             <el-option
               v-for="item in [
-                { value: '1', label: '日' },
+                { value: '1', label: '近1天' },
-                { value: '2', label: '周' },
+                { value: '7', label: '近7天' },
-                { value: '3', label: '月' },
+                { value: '30', label: '近30天' },
-                { value: '4', label: '年' },
+                { value: 'custom', label: '自定义' },
               ]"
               :key="item.value"
               :label="item.label"
@@ -22,6 +23,17 @@
             </el-option>
           </el-select>
         </el-form-item>
+        <el-form-item v-if="formInline.dateType === 'custom'">
+          <el-date-picker
+            v-model="formInline.timeRange"
+            type="datetimerange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            value-format="yyyy-MM-dd HH:mm:ss"
+          >
+          </el-date-picker>
+        </el-form-item>
         <el-form-item>
           <el-button @click="getList" type="primary">查询</el-button>
           <el-button @click="batchExport" type="success">导出</el-button>
@@ -318,11 +330,13 @@
 </template>
 
 <script>
+import dayjs from "dayjs";
 export default {
   data() {
     return {
       formInline: {
-        dateType: "1",
+        dateType: "7",
+        timeRange: [],
       },
       productList: {},
     };
@@ -331,12 +345,41 @@ export default {
     this.getList();
   },
   methods: {
+    handleDateTypeChange() {
+      this.formInline.timeRange = [];
+    },
     getList() {
-      this.$api.dataCenter.productAnalysis(this.formInline).then((res) => {
+      let params = this.getParams();
+      if (!params) return;
+      this.$api.dataCenter.productAnalysis(params).then((res) => {
         this.productList = res.data.data;
         console.log(res);
       });
     },
+    getParams() {
+      let params = {};
+      if (this.formInline.dateType === "custom") {
+        if (
+          this.formInline.timeRange &&
+          this.formInline.timeRange.length === 2
+        ) {
+          params.startTime = this.formInline.timeRange[0];
+          params.endTime = this.formInline.timeRange[1];
+        } else {
+          this.$message.error("请选择时间范围");
+          return null;
+        }
+      } else {
+        const end = dayjs().endOf("day").format("YYYY-MM-DD HH:mm:ss");
+        const start = dayjs()
+          .subtract(this.formInline.dateType - 1, "day")
+          .startOf("day")
+          .format("YYYY-MM-DD HH:mm:ss");
+        params.startTime = start;
+        params.endTime = end;
+      }
+      return params;
+    },
     batchExport() {
       console.log("导出");
     },