prsx-crm/components/timeRange/timeRange.js

import {
    formatTime
} from "../../utils/getTime.js"
Component({
    options: {
        addGlobalClass: true
    },
    properties: {
        dateTypes: {
            type: Array,
            value: ["全部", "本年", "本季", "本月"]
        },
        dateType: {
            type: String,
            value: "本年"
        },
        onChange: {
            type: Function,
        },
        grading: {
            type: String,
            value: "year-month"
        }
    },
    lifetimes: {
        attached: function () {
            getApp().globalData.Language.getLanguagePackage(this)
            this.setData({
                actions: this.data.dateTypes.map(item => {
                    return {
                        name: getApp().globalData.Language.getMapText(item),
                        value: item,
                        color: item == this.data.dateType ? "#3874F6" : ""
                    }
                }),
                "whereType.begdate": formatTime(new Date(), "-").split(' ')[0].slice(0, this.data.grading === "year-month" ? 7 : 10),
            })
            this.setRange();
        }
    },
    data: {
        actionShow: false,
        whereType: {
            value: "begdate",
            enddate: "",
            begTimestamp: new Date().getTime(),
            endTimestamp: "",
        },
        begdate: "",
        enddate: "",
        showTimePicker: false,
    },
    methods: {
        openActionSheet() {
            this.setData({
                actionShow: true
            })
        },
        confirmTimePicker() {
            let whereType = this.data.whereType,
                begdate = whereType.begdate,
                enddate = whereType.enddate;
            if (whereType.enddate == "") {
                whereType.value = "enddate";
                this.setData({
                    whereType
                })
                wx.showToast({
                    title: getApp().globalData.Language.getMapText("请选择结束时间"),
                    icon: "none"
                })
            } else {
                this.setData({
                    showTimePicker: false,
                    begdate,
                    enddate,
                    actions: this.data.actions.map(item => {
                        item.color = ""
                        return item
                    })
                })
                this.triggerEvent("onChange", {
                    dateType: '',
                    isAll: 99,
                    begdate,
                    enddate
                })
            }
        },
        openTimePicker() {
            this.setData({
                showTimePicker: true
            })
        },
        cancelWhereType() {
            this.setData({
                showTimePicker: false
            })
        },
        /* 日期选择器 */
        datetimeOnInput(event) {
            let type = event.currentTarget.dataset.name,
            whereType = this.data.whereType,
            grading = this.data.grading || "year-month"; // 获取粒度，默认值为 "year-month"
            if (type == "begdate") {
            whereType.begTimestamp = event.detail;
            whereType.begdate = formatTime(new Date(event.detail), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
            if (whereType.begTimestamp > whereType.endTimestamp) {
                whereType.endTimestamp = whereType.begTimestamp;
                whereType.enddate = '';
            }
            } else {
            whereType.endTimestamp = event.detail;
            whereType.enddate = formatTime(new Date(event.detail), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
            }
            this.setData({
            whereType
            });
        },
        //切换日期类型
        changeDateType(e) {
            const {
                name
            } = e.target.dataset;
            this.setData({
                "whereType.value": name
            })
        },
        /* 周期选择器 */
        onSelect(event) {
            const {
                value
            } = event.detail;
            if (this.data.dateType == value) return this.onCancel();
            this.setData({
                dateType: value,
                actions: this.data.actions.map(item => {
                    item.color = item.value == value ? "#3874F6" : "";
                    item.loading = item.value == value ? true : false;
                    return item
                })
            })
            this.setRange();
            this.triggerEvent("onChange", {
                dateType: value,
                isAll: this.data.dateType == "全部" ? 1 : 0,
                begdate: "",
                enddate: ""
            })
        },
        onCancel() {
            this.setData({
                actionShow: false,
                actions: this.data.actions.map(item => {
                    item.loading = false;
                    return item
                })
            })
        },
        setRange() {
            let dateType = this.data.dateType,
                grading = this.data.grading, // 获取粒度
                whereType = {
                    value: "begdate",
                    begdate: formatTime(new Date(), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10),
                    enddate: "",
                    begTimestamp: new Date().getTime(),
                    endTimestamp: "",
                },
                begdate = "",
                enddate = "";
            const currentMonth = new Date().getMonth() + 1;
            switch (dateType) {
                case '本年':
                    begdate = formatTime(new Date(), "-").split(' ')[0].slice(0, 4) + (grading === "year-month" ? "-01" : "-01-01");
                    enddate = formatTime(new Date(), "-").split(' ')[0].slice(0, 4) + (grading === "year-month" ? "-12" : "-12-31");
                    whereType.begdate = begdate;
                    whereType.enddate = enddate;
                    break;
                case '本月':
                    begdate = formatTime(new Date(), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
                    enddate = formatTime(new Date(), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
                    whereType.begdate = begdate;
                    whereType.enddate = enddate;
                    break;
                case '本季':
                    begdate = formatTime(new Date(), "-").split(' ')[0].slice(0, 4) + "-" + (Math.floor((new Date().getMonth() + 1) / 3) * 3 - 2) + (grading === "year-month" ? "" : "-01");
                    enddate = formatTime(new Date(), "-").split(' ')[0].slice(0, 4) + "-" + (Math.floor((new Date().getMonth() + 1) / 3) * 3) + (grading === "year-month" ? "" : "-30");
                    whereType.begdate = begdate;
                    whereType.enddate = enddate;
                    break;
                case '去年':
                    begdate = (new Date().getFullYear() - 1) + (grading === "year-month" ? "-01" : "-01-01");
                    enddate = (new Date().getFullYear() - 1) + (grading === "year-month" ? "-12" : "-12-31");
                    whereType.begdate = begdate;
                    whereType.enddate = enddate;
                    break;
                case '上月':
                    const lastMonth = new Date();
                    lastMonth.setMonth(lastMonth.getMonth() - 1);
                    begdate = formatTime(lastMonth, "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
                    enddate = formatTime(lastMonth, "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
                    whereType.begdate = begdate;
                    whereType.enddate = enddate;
                    break;
                case '近一年':
                    begdate = formatTime(new Date(new Date().setFullYear(new Date().getFullYear() - 1)), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
                    enddate = formatTime(new Date(), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
                    whereType.begdate = begdate;
                    whereType.enddate = enddate;
                    break;
                case '近三个月':
                    begdate = formatTime(new Date(new Date().setMonth(new Date().getMonth() - 3)), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
                    enddate = formatTime(new Date(), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
                    whereType.begdate = begdate;
                    whereType.enddate = enddate;
                    break;
                case '近九个月':
                    begdate = formatTime(new Date(new Date().setMonth(new Date().getMonth() - 9)), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
                    enddate = formatTime(new Date(), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
                    whereType.begdate = begdate;
                    whereType.enddate = enddate;
                    break;
                case '近六个月':
                    begdate = formatTime(new Date(new Date().setMonth(new Date().getMonth() - 6)), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
                    enddate = formatTime(new Date(), "-").split(' ')[0].slice(0, grading === "year-month" ? 7 : 10);
                    whereType.begdate = begdate;
                    whereType.enddate = enddate;
                    break;
                default:
                    break;
            }
            if (dateType != "全部") {
                whereType.begTimestamp = new Date(begdate + (grading === "year-month" ? '-01' : '')).getTime();
                whereType.endTimestamp = new Date(enddate + (grading === "year-month" ? '-30' : '')).getTime();
            }
            this.setData({
                whereType,
                begdate,
                enddate
            });
        }
    }
})