Calendar selector generation method and device

Abstract

The embodiment of the present invention provides a calendar selector generation method and device, belonging to the field of data processing technology, the method comprising: when a user opens a date selector, checking whether there is a default date range; parsing the date range to be displayed, obtaining the total number of months tolMonth contained in the date range to be displayed; adding a click event listener for each element in the first display list; setting input boxes for the user to manually input the start and end time of the date range on the first display list and the second display list, calculating the time decision value τ of the user on the first display list and the second display list; after the user completes the date selection on all date subcomponents in the date component set DZ, collecting all selected date information to form a date information set. This solution can improve the convenience of calendar selection.

Description

Technical Field

[0001] The present invention relates to the field of data processing technology, and in particular to a calendar selector generation method, device and electronic equipment. Background Art

[0002] A date picker is a user interface component that allows users to select a specific date or a specific date within a range from a calendar view or by entering text in a specified date format. This type of component is widely used in various software applications and web pages, especially in scenarios where users need to enter date information, such as reservation systems, schedule management, form submission, etc.

[0003] The design and functionality of a date picker can vary depending on the application scenario, but generally has the following characteristics:

[0004] 1. Intuitive interface: Display a calendar view, and users can directly click on the date on the calendar to select.

[0005] 2. Range selection function: Some date pickers support selecting a date range, which is suitable for scenarios where you need to enter a start date and an end date.

[0006] 3. Quick Selection: Provides options for quickly selecting today, yesterday, tomorrow, or a specific time period (such as this week, this month).

[0007] The implementation of the date picker can be based on native HTML elements combined with CSS and JavaScript, or you can use third-party libraries (such as jQuery UI's Datepicker, Bootstrap Datepicker, React DatePicker, etc.), which provide rich configuration options and more advanced functions.

[0008] In the process of designing and developing calendar selectors, the prior art does not provide sufficient support for complex calendar operations, so that when users perform multiple date selection operations over a long period (for example, a multi-month time period), they need to switch calendar interfaces back and forth, which brings inconvenience to the multiple date selection operation.

[0009] The above problems become technical problems that need to be solved. Summary of the invention

[0010] In view of this, an embodiment of the present invention provides a calendar selector generation method, device and electronic device, which at least partially solve the problems existing in the prior art.

[0011] In a first aspect, an embodiment of the present invention provides a calendar selector generation method, comprising:

[0012] When the user opens the date picker, check whether there is a default date range. If yes, use the default date range as the date range to be displayed. If no, set the date range to be displayed as the default time range.

[0013] Parse the date range to be displayed, obtain the total number of months tolMonth contained in the date range to be displayed, and generate a date component set DZ={DZ1,DZ2,…DZ} containing tolMonth date subcomponents. tolMonth}, when the value of tolMonth is greater than or equal to 2, select the end time of the date range to be displayed as the current month curMonth, and set the previous month brfMonth corresponding to curMonth in the area to the left of curMonth;

[0014] Based on each day of the month where curMonth is located, a first display list is generated on the first date subcomponent DZ1, and a click event listener is added to each element in the first display list by traversing each day of the month where curMonth is located and creating corresponding DOM elements;

[0015] The first display list corresponding to the curMonth month is displayed on the right side of the date display interface, and the second display list corresponding to the brfMonth month is displayed on the left side of the date display interface using the second date subcomponent DZ2, and the calendar views corresponding to the first display list and the second display list are rendered respectively;

[0016] On the first display list and the second display list, an input box is set for the user to manually input the start and end time of the date range. After the user inputs in the input box, the curFocus variable is set to reflect the user's focus date. When the user clicks on the date on the calendar, the bound click event handler is triggered. The click event handler updates curFocus, thereby forming a curFocus change vector KF={KF1, KF2, ...KFn} and a curFocus change time vector KT={KT1, KT2, ...KTn} corresponding to the curFocus change vector KF;

[0017] When the value of tolMonth is greater than or equal to 3, based on the curFocus change vector KF={KF1, KF2, ... KFn} and the curFocus change time vector KT={KT1, KT2, ... KTn}, the time decision value τ of the user on the first display list and the second display list is calculated. When the time decision value τ is less than the preset value τ0, on the date display interface, the second date subcomponent DZ2 is covered with the third date subcomponent DZ3, and the first date subcomponent DZ1 is covered with the second date subcomponent DZ2;

[0018] After the user completes date selection on all date subcomponents in the date component set DZ, all selected date information is collected to form a date information set, the date information set is converted into a preset data object, the data object is passed to the parent component corresponding to the date subcomponent through a callback function, and then the display interface of the date selector is closed.

[0019] According to a specific implementation of the embodiment of the present disclosure, when the user opens the date selector, checking whether there is a default date range, if yes, using the default date range as the date range to be displayed includes:

[0020] When calling or initializing the date picker component, set the start time parameter defaultStartDate and the end time parameter defaultEndDate;

[0021] In the initialization logic, check whether the start time parameter defaultStartDate and the end time parameter defaultEndDate have been defined and are valid. If both are valid, the time interval defined by the start time parameter defaultStartDate and the end time parameter defaultEndDate is used as the date interval to be displayed.

[0022] According to a specific implementation of the embodiment of the present disclosure, the date interval to be displayed is parsed to obtain the total number of months tolMonth included in the date interval to be displayed, and a date component set DZ={DZ1, DZ2, …DZ tolMonth},include:

[0023] Create an empty date component set DZ, and based on the value of tolMonth, loop and iterate from the start month to the end month, and generate a date subcomponent DZ1, DZ2, ..., DZtolMonth for each month. Each subcomponent represents a calendar view of a month, including all dates of that month.

[0024] When tolMonth >= 2, set the month to which the end date belongs to curMonth, and set brfMonth in the area to the left of curMonth. brfMonth is the month before curMonth. In the interface layout, the date component of brfMonth is displayed on the left of curMonth.

[0025] According to a specific implementation of an embodiment of the present disclosure, based on each day of the month where curMonth is located, a first display list is generated on the first date subcomponent DZ1, and by traversing each day of the month where curMonth is located and creating a corresponding DOM element, a click event listener is added to each element in the first display list, including:

[0026] Inside the first date subcomponent DZ1, a container for storing list items for each day to be generated is prepared;

[0027] For each day, create a new DOM element, fill the date number in the DOM element, and add the DOM element to the container of DZ1;

[0028] For each date element created, add a click event listener to it when adding it to the DOM tree;

[0029] In the click event listener's callback function, define the action that should be performed when a click occurs.

[0030] According to a specific implementation of an embodiment of the present disclosure, the first display list corresponding to the curMonth month is displayed on the right side of the date display interface, and the second display list corresponding to the brfMonth month is displayed on the left side of the date display interface using the second date subcomponent DZ2, and the calendar views corresponding to the first display list and the second display list are rendered respectively, including:

[0031] The date display interface is divided into two parts, the left part is used to display the second display list and calendar view of the brfMonth month, and the right part is used to display the first display list and calendar view of the curMonth month;

[0032] For each date subcomponent, generate a calendar grid based on the corresponding month, with one cell per day and highlight the current date;

[0033] Add a click event for each date on the calendar. When the user clicks a day, the display list below should scroll to or highlight the corresponding item, providing instant feedback.

[0034] According to a specific implementation of the embodiment of the present disclosure, the curFocus variable is set to reflect the user's focus date. When the user clicks a date on the calendar, the bound click event handler is triggered. The click event handler updates curFocus, thereby forming a curFocus change vector KF={KF1, KF2, ...KFn} and a curFocus change time vector KT={KT1, KT2, ...KTn} corresponding to the curFocus change vector KF, including:

[0035] Two date range input box groups are placed above the first display list and the second display list, respectively. Each group contains two input boxes, one for selecting the start date and the other for selecting the end date.

[0036] When setting a date in the input box or by clicking on the calendar to select a date, a visual cue is used to indicate the date where the current curFocus is located;

[0037] Bind an event listener to the input box. When the user enters the date in the input box or changes the date through the date picker, the date change is captured and the curFocus variable is updated.

[0038] A click event handler is bound to each date cell on the calendar. When the user clicks a date, the click event handler not only updates curFocus to the clicked date, but also records the change to generate an element KFi in the KF vector. At the same time, it records the time when the change occurred to form an element KTi in the KT vector, thereby forming a curFocus change vector KF={KF1,KF2,…KFn} and a curFocus change time vector KT={KT1,KT2,…KTn} corresponding to the curFocus change vector KF.

[0039] According to a specific implementation of the embodiment of the present disclosure, the calculation of the time decision value τ of the user on the first display list and the second display list based on the curFocus change vector KF={KF1, KF2, ...KFn} and the curFocus change time vector KT={KT1, KT2, ...KTn} includes:

[0040] According to the distribution of the user's stay time in the first display list and the second display list, the frequency of user decision-making, and tolMonth, the time decision value τ is determined:

[0041]

[0042] in, Indicates the time difference between the i-th and i+1-th curFocus focus changes, n is the total number of curFocus focus changes, is the first correction parameter, All time differences The standard deviation is used to measure the fluctuation range of the time interval. is the total number of times the focus switches between the two display lists, β is the second correction parameter, and γ is the third adjustment parameter related to tolMonth.

[0043] According to a specific implementation of the embodiment of the present disclosure, converting the date information set into a preset data object, passing the data object to the parent component corresponding to the date subcomponent through a callback function, and closing the display interface of the date selector include:

[0044] Iterate through each date subcomponent in DZ and check the date selected by the user on each subcomponent;

[0045] Integrate all the selected dates collected into a date information set, and convert the date information set into one or more preset data objects;

[0046] After the data object is ready, the data object is passed to the parent component of the date subcomponent through a custom callback function, which is provided by the parent component to the subcomponent when the date picker component is initialized;

[0047] After calling the callback function, send a close command to close the date picker display interface.

[0048] In a second aspect, an embodiment of the present invention provides a calendar selector generating device, including:

[0049] Setting module, when the user opens the date picker, check whether there is a default date range, if yes, use the default date range as the date range to be displayed, if not, set the date range to be displayed as the default time range;

[0050] The parsing module parses the date range to be displayed, obtains the total number of months tolMonth contained in the date range to be displayed, and generates a date component set DZ={DZ1,DZ2,…DZ tolMonth}, when the value of tolMonth is greater than or equal to 2, select the end time of the date range to be displayed as the current month curMonth, and set the previous month brfMonth corresponding to curMonth in the area to the left of curMonth;

[0051] Add a module to generate a first display list on the first date subcomponent DZ1 based on each day of the month where curMonth is located, add a click event listener to each element in the first display list by traversing each day of the month where curMonth is located and creating corresponding DOM elements;

[0052] A rendering module displays the first display list corresponding to the curMonth month on the right side of the date display interface, displays the second display list corresponding to the brfMonth month on the left side of the date display interface using the second date subcomponent DZ2, and renders the calendar views corresponding to the first display list and the second display list respectively;

[0053] The update module sets input boxes for users to manually input the start and end time of the date range on the first display list and the second display list. After the user inputs in the input boxes, the curFocus variable is set to reflect the user's focus date. When the user clicks on the date on the calendar, the bound click event handler is triggered. The click event handler updates curFocus, thereby forming a curFocus change vector KF={KF1, KF2, ...KFn} and a curFocus change time vector KT={KT1, KT2, ...KTn} corresponding to the curFocus change vector KF;

[0054] The overlay module, when the value of tolMonth is greater than or equal to 3, calculates the time decision value τ of the user on the first display list and the second display list based on the curFocus change vector KF={KF1, KF2, ... KFn} and the curFocus change time vector KT={KT1, KT2, ... KTn}. When the time decision value τ is less than the preset value τ0, on the date display interface, the second date subcomponent DZ2 is overwritten with the third date subcomponent DZ3, and the first date subcomponent DZ1 is overwritten with the second date subcomponent DZ2;

[0055] A formation module is formed. When the user completes the date selection on all date subcomponents in the date component set DZ, all the selected date information is collected to form a date information set, the date information set is converted into a preset data object, the data object is passed to the parent component corresponding to the date subcomponent through a callback function, and then the display interface of the date selector is closed.

[0056] In a third aspect, an embodiment of the present invention further provides an electronic device, the electronic device comprising:

[0057] at least one processor; and,

[0058] a memory communicatively connected to the at least one processor; wherein,

[0059] The memory stores instructions that can be executed by the at least one processor, and the instructions are executed by the at least one processor to enable the at least one processor to execute the calendar selector generation method in any of the first aspects or any of the implementations of the first aspect.

[0060] In a fourth aspect, an embodiment of the present invention further provides a non-transitory computer-readable storage medium, which stores computer instructions, and the computer instructions are used to enable the computer to execute the calendar selector generation method in the aforementioned first aspect or any implementation of the first aspect.

[0061] In the fifth aspect, an embodiment of the present invention further provides a computer program product, which includes a computer program stored on a non-transitory computer-readable storage medium, and the computer program includes program instructions. When the program instructions are executed by a computer, the computer executes the calendar selector generation method in the aforementioned first aspect or any implementation of the first aspect.

[0062] The calendar selector generation scheme in the embodiment of the present invention includes: when the user opens the date selector, checking whether there is a default date range, if yes, using the default date range as the date range to be displayed, if no, setting the date range to be displayed as the default time range; parsing the date range to be displayed, obtaining the total number of months tolMonth included in the date range to be displayed, and generating a date component set DZ={DZ1,DZ2,…DZ tolMonth}, when the value of tolMonth is greater than or equal to 2, select the end time of the date range to be displayed as the current month curMonth, and set the previous month brfMonth corresponding to curMonth in the left area of ​​curMonth; based on each day of the month where curMonth is located, generate a first display list on the first date subcomponent DZ1, traverse each day of the month where curMonth is located and create corresponding DOM elements, and add a click event listener to each element in the first display list; display the first display list corresponding to the curMonth month on the right side of the date display interface, and display the second display list corresponding to the brfMonth month on the left side of the date display interface using the second date subcomponent DZ2, and render the calendar views corresponding to the first display list and the second display list respectively; on the first display list and the second display list, set input boxes for users to manually enter the start and end time of the date range. After the user enters in the input box, set the curFocus variable to reflect the user's focus date. When the user clicks on the date on the calendar, trigger the bound click event handler, the click event The processor updates curFocus, thereby forming a curFocus change vector KF={KF1, KF2, ... KFn} and a curFocus change time vector KT={KT1, KT2, ... KTn} corresponding to the curFocus change vector KF; when the value of tolMonth is greater than or equal to 3, based on the curFocus change vector KF={KF1, KF2, ... KFn} and the curFocus change time vector KT={KT1, KT2, ... KTn}, calculate the user in the first display list and the second display list When the time decision value τ on the table is less than the preset value τ0, on the date display interface, the third date subcomponent DZ3 covers the second date subcomponent DZ2, and the second date subcomponent DZ2 covers the first date subcomponent DZ1; when the user completes the date selection on all date subcomponents in the date component set DZ, all selected date information is collected to form a date information set, the date information set is converted into a preset data object, the data object is passed to the parent component corresponding to the date subcomponent through a callback function, and the display interface of the date selector is closed. Through this solution, the convenience of calendar selection is improved. BRIEF DESCRIPTION OF THE DRAWINGS

[0063] In order to more clearly illustrate the technical solutions of the embodiments of the present invention, the drawings required for use in the embodiments will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present invention. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

[0064] Figure 1 A schematic diagram of a calendar selector generation method provided by an embodiment of the present invention;

[0065] Figure 2 A schematic diagram of another method for generating a calendar selector provided by an embodiment of the present invention;

[0066] Figure 3 A schematic diagram of the structure of a calendar selector generating device provided by an embodiment of the present invention;

[0067] Figure 4 A schematic diagram of an electronic device provided by an embodiment of the present invention. DETAILED DESCRIPTION

[0068] The embodiments of the present invention are described in detail below with reference to the accompanying drawings.

[0069] The following describes the embodiments of the present disclosure through specific examples, and those skilled in the art can easily understand other advantages and effects of the present disclosure from the contents disclosed in this specification. Obviously, the described embodiments are only a part of the embodiments of the present disclosure, rather than all of the embodiments. The present disclosure can also be implemented or applied through other different specific embodiments, and the details in this specification can also be modified or changed in various ways based on different viewpoints and applications without departing from the spirit of the present disclosure. It should be noted that the following embodiments and features in the embodiments can be combined with each other without conflict. Based on the embodiments in the present disclosure, all other embodiments obtained by ordinary technicians in the field without making creative work are within the scope of protection of the present disclosure.

[0070] It should be noted that various aspects of the embodiments within the scope of the appended claims are described below. It should be apparent that the aspects described herein may be embodied in a wide variety of forms, and any specific structure and / or function described herein is merely illustrative. Based on the present disclosure, it should be understood by those skilled in the art that an aspect described herein may be implemented independently of any other aspect, and two or more of these aspects may be combined in various ways. For example, any number of aspects described herein may be used to implement the device and / or practice the method. In addition, other structures and / or functionalities other than one or more of the aspects described herein may be used to implement this device and / or practice this method.

[0071] It should also be noted that the illustrations provided in the following embodiments are only schematic illustrations of the basic concept of the present disclosure. The drawings only show components related to the present disclosure rather than being drawn according to the number, shape and size of components in actual implementation. In actual implementation, the type, quantity and proportion of each component may be changed arbitrarily, and the component layout may also be more complicated.

[0072] Additionally, in the following description, specific details are provided to facilitate a thorough understanding of the examples. However, it will be understood by those skilled in the art that the aspects described may be practiced without these specific details.

[0073] The present disclosure provides a calendar selector generation method. The calendar selector generation method provided in the present disclosure can be executed by a computing device, which can be implemented as software or a combination of software and hardware, and can be integrated in a server, terminal device, etc.

[0074] See also Figure 1 and Figure 2 , the embodiment of the present disclosure provides a calendar selector generation method, including:

[0075] S101, when the user opens the date selector, check whether there is a default date range, if yes, use the default date range as the date range to be displayed, if not, set the date range to be displayed as the default time range.

[0076] When calling or initializing the date picker component, two optional parameters are received, usually defaultStartDate and defaultEndDate, representing the default date range.

[0077] In the component initialization logic, first check whether these two parameters have been defined and are valid (for example, the format is correct, the start date is not greater than the end date, etc.). If both are valid, proceed to the next step; if not passed in or invalid, set the date range according to the default behavior of the component, such as displaying the current month or the last user-selected date range.

[0078] Based on the inspection results, use the API provided by the component or directly manipulate the component status to set defaultStartDate and defaultEndDate as the display range of the date selector.

[0079] In the interface display, in order to ensure that users can clearly see the currently selected date range, it can be emphasized through highlighting, labeling or other visual means. At the same time, users are allowed to freely adjust this range without being restricted by the default value.

[0080] S102, parsing the date interval to be displayed, obtaining the total number of months tolMonth included in the date interval to be displayed, and generating a date component set DZ={DZ1, DZ2, …DZ tolMonth}, when the value of tolMonth is greater than or equal to 2, select the end time of the date range to be displayed as the current month curMonth, and set the previous month brfMonth corresponding to curMonth in the area to the left of curMonth.

[0081] In the process of parsing the date range to be displayed, it is necessary to clarify the date range to be displayed, which usually consists of two dates, namely the start date and the end date.

[0082] The total number of months tolMonth included in the date range to be displayed is obtained by calculating the number of full months between the start date and the end date (including both ends), including determining which month the two dates belong to and then calculating the difference in the number of months between them.

[0083] You can create an empty date component set DZ, based on the value of tolMonth, loop iterate from the start month to the end month (including both), and generate a date subcomponent DZ1, DZ2, ..., DZ for each month tolMonth Each child component represents a calendar view for a month, containing all the dates in that month.

[0084] When tolMonth>=2, the month to which the end date belongs is directly set to curMonth. This is because the end month is required to be located in the right area in the interface layout, and the previous month needs to be set to its left.

[0085] Set brfMonth to the left of curMonth, which is the month before curMonth. This means that in the interface layout, the date component of brfMonth will be displayed to the left of curMonth.

[0086] S103, based on each day of the month where curMonth is located, generate a first display list on the first date subcomponent DZ1, by traversing each day of the month where curMonth is located and creating corresponding DOM elements, adding a click event listener to each element in the first display list.

[0087] You can determine how many days there are in the month curMonth, using the properties of the date object to calculate the number of days in a particular month. On the page or inside a component, prepare a container element (such as a ), which is used to store the list items for each day to be generated. This container will be the first display list, and its ID can be set to DZ1.

[0088] Starting from the 1st, traverse to the last day of the month, and for each day: create a new DOM element (e.g. or ), representing this day. Set the content of this element, which can include the date number and other information you want to display, and add this element to the DZ1 container.

[0089] For each date element created, a click event listener is added to it when it is added to the DOM tree. In the listener's callback function, you can define the action that should be performed when a certain day is clicked, such as displaying detailed information, navigating to another page, etc.

[0090] After completing the above steps, a list of every day of the month will be displayed on the page, and each list item has click-through interaction capabilities.

[0091] S104, displaying the first display list corresponding to the curMonth month on the right side of the date display interface, and displaying the second display list corresponding to the brfMonth month on the left side of the date display interface using the second date subcomponent DZ2, respectively rendering the calendar views corresponding to the first display list and the second display list.

[0092] The interface is divided into two parts, the left side is used to display the second display list and calendar view of brfMonth, and the right side is used to display the first display list and calendar view of curMonth. This separation can be achieved using CSS Flexbox or Grid layout.

[0093] The left area displays the month brfMonth, with each day marked in the calendar view and corresponding to the second display list items below. The list items should contain brief information or icons to reflect the events or data related to the date. The right area displays the current month curMonth, showing the detailed first display list.

[0094] For each date subcomponent, a calendar grid is generated according to the corresponding month, with one cell for each day, highlighting the current date or other special days (such as weekends and holidays).

[0095] Add a click event for each date on the calendar. When the user clicks a day, the display list below should scroll to or highlight the corresponding item to provide immediate feedback. The list items are interactive and can be clicked to expand more details or trigger related actions.

[0096] S105. On the first display list and the second display list, input boxes are set for the user to manually input the start and end time of the date range. After the user inputs in the input box, the curFocus variable is set to reflect the user's focus date. When the user clicks on the date on the calendar, the bound click event handler is triggered. The click event handler updates curFocus, thereby forming a curFocus change vector KF={KF1, KF2, ...KFn} and a curFocus change time vector KT={KT1, KT2, ...KTn} corresponding to the curFocus change vector KF.

[0097] Place two date range input box groups above or near the first display list and the second display list, respectively. Each group contains two input boxes, one for selecting the start date and the other for selecting the end date. You can use the date picker component to improve the user experience and ensure that users can easily select the date instead of manually entering it.

[0098] You can design a visual cue (such as a highlighted border, a different background color, or an icon change) to indicate the date that the current curFocus is set on, either in the input box or by clicking on the calendar selection.

[0099] Bind an event listener (such as onChange) to the input box. When the user enters in the input box or changes the date through the date picker, capture these changes and update the curFocus variable. Validate the validity of the input, such as checking that the date format is correct and that the start date is not greater than the end date.

[0100] Each date cell on the calendar should be bound to a click event handler. When the user clicks a date, the handler not only updates curFocus to the clicked date, but also records the change, that is, generates an element KFi in the KF vector, and records the time when the change occurs, forming an element KTi in the KT vector, and then forms the curFocus change vector KF={KF1,KF2,…KFn}, and the curFocus change time vector KT={KT1,KT2,…KTn} corresponding to the curFocus change vector KF.

[0101] A data structure can be designed to store KF (curFocus change vector) and KT (curFocus change time vector). Whenever curFocus changes due to user input or calendar clicks, a new element is appended to the corresponding vector.

[0102] As an example, the user enters "20240715" as the start date in the input box. After verification, the system updates curFocus and records this operation, generating KF1=20240715 and recording the time of the change as KT1. The user then clicks July 20, triggering the click event handler, updating curFocus to "20240720". The system records this change as KF2=20240720 and records the click time as KT2.

[0103] In this way, the application can track the user's focus date changes and the specific time they occur, providing a basis for data analysis or further interaction logic.

[0104] S106, when the value of tolMonth is greater than or equal to 3, based on the curFocus change vector KF={KF1, KF2,…KFn} and the curFocus change moment vector KT={KT1, KT2,…KTn}, calculate the user's time decision value τ on the first display list and the second display list. When the time decision value τ is less than the preset value τ0, on the date display interface, the third date subcomponent DZ3 covers the second date subcomponent DZ2, and the second date subcomponent DZ2 covers the first date subcomponent DZ1.

[0105] The time decision value τ is usually used to measure the speed at which users make choices at different time points or the average decision interval. If tolMonth>=3, this indicator can be evaluated by calculating the time difference between adjacent curFocus changes.

[0106] For each consecutive (KFi, KF(i+1)) pair, calculate the difference in months between them. Then, based on these month differences and the corresponding timestamps (KTi, KT(i+1)), calculate the actual time interval between each decision (in days or hours, here we take days as an example).

[0107] Sum all time intervals and divide by the number of decisions to get the average time interval ΔT_avg. If you need to convert it into months to meet the comparison criteria of tolMonth, you can convert it according to actual needs.

[0108] Judge τ: If ΔT_avg is less than the preset threshold τ0 (in months), it is considered that the user's time decision value τ is small and the conditions are met for interface adjustment.

[0109] When τ<τ0, the following interface changes are performed: In the front-end display layer, the DOM structure is dynamically modified through JavaScript or related front-end frameworks (such as React, Vue, etc.), so that the third date subcomponent DZ3 covers the second date subcomponent DZ2, and the second date subcomponent DZ2 covers the first date subcomponent DZ1. This may involve CSS zindex adjustment, position attribute (position) setting, or smooth transition using animation effects. At the same time, this coverage is reversible, that is, when the condition is no longer met (for example, τ is greater than τ0 again), the interface can be restored to its original state.

[0110] As an implementation method, the time decision value τ may be determined according to the distribution of the user's stay time in the first display list and the second display list, the frequency of the user's decision, and tolMonth:

[0111]

[0112] in, Indicates the time difference between the i-th and i+1-th curFocus focus changes, n is the total number of curFocus focus changes, is the first correction parameter, All time differences The standard deviation is used to measure the fluctuation range of the time interval. is the total number of times the focus switches between the two display lists, β is the second correction parameter, and γ is the third adjustment parameter related to tolMonth.

[0113] S107, when the user completes date selection on all date subcomponents in the date component set DZ, collect all selected date information to form a date information set, convert the date information set into a preset data object, pass the data object to the parent component corresponding to the date subcomponent through a callback function, and then close the display interface of the date selector.

[0114] After the user completes the selection on all date subcomponents in the date component set DZ, the following steps are performed to collect information, process data, and pass it to the parent component through the callback function:

[0115] You can loop through each date subcomponent in the DZ, checking the date selected by the user on each subcomponent. This includes accessing the state or properties of each subcomponent to obtain the selected date data it stores.

[0116] Collect all selected dates into a collection, which may be an array or an object in a specific format. For example, if the user can select multiple dates, the collection may contain multiple date objects, each containing the details of the date (such as year, month, day).

[0117] Convert the collection of date information into one or more pre-defined data objects as needed. This may involve restructuring the data structure, formatting the date string, or adding additional metadata (such as user ID, selected date type tag, etc.).

[0118] Once the data object is ready, pass it to the parent of the date child component through the callback function defined earlier. This callback function is provided by the parent component to the child component when the date picker component is initialized. After calling the callback function, send a command or signal to close the display interface of the date picker. Ensure that the user's selection is processed accurately and the user interface is responsive, improving the user experience.

[0119] According to a specific implementation of the embodiment of the present disclosure, when the user opens the date selector, checking whether there is a default date range, if yes, using the default date range as the date range to be displayed includes:

[0120] When calling or initializing the date picker component, set the start time parameter defaultStartDate and the end time parameter defaultEndDate;

[0121] In the initialization logic, check whether the start time parameter defaultStartDate and the end time parameter defaultEndDate have been defined and are valid. If both are valid, the time interval defined by the start time parameter defaultStartDate and the end time parameter defaultEndDate is used as the date interval to be displayed.

[0122] According to a specific implementation of the embodiment of the present disclosure, the date interval to be displayed is parsed to obtain the total number of months tolMonth included in the date interval to be displayed, and a date component set DZ={DZ1, DZ2, …DZ tolMonth },include:

[0123] Create an empty date component set DZ, and based on the value of tolMonth, loop and iterate from the start month to the end month, and generate a date subcomponent DZ1, DZ2, ..., DZtolMonth for each month. Each subcomponent represents a calendar view of a month, including all dates of that month.

[0124] When tolMonth >= 2, set the month to which the end date belongs to curMonth, and set brfMonth in the area to the left of curMonth. brfMonth is the month before curMonth. In the interface layout, the date component of brfMonth is displayed on the left of curMonth.

[0125] According to a specific implementation of an embodiment of the present disclosure, based on each day of the month where curMonth is located, a first display list is generated on the first date subcomponent DZ1, and by traversing each day of the month where curMonth is located and creating a corresponding DOM element, a click event listener is added to each element in the first display list, including:

[0126] Inside the first date subcomponent DZ1, a container for storing list items for each day to be generated is prepared;

[0127] For each day, create a new DOM element, fill the date number in the DOM element, and add the DOM element to the container of DZ1;

[0128] For each date element created, add a click event listener to it when adding it to the DOM tree;

[0129] In the click event listener's callback function, define the action that should be performed when a click occurs.

[0130] According to a specific implementation of an embodiment of the present disclosure, the first display list corresponding to the curMonth month is displayed on the right side of the date display interface, and the second display list corresponding to the brfMonth month is displayed on the left side of the date display interface using the second date subcomponent DZ2, and the calendar views corresponding to the first display list and the second display list are rendered respectively, including:

[0131] The date display interface is divided into two parts, the left part is used to display the second display list and calendar view of the brfMonth month, and the right part is used to display the first display list and calendar view of the curMonth month;

[0132] For each date subcomponent, generate a calendar grid based on the corresponding month, with one cell per day and highlight the current date;

[0133] Add a click event for each date on the calendar. When the user clicks a day, the display list below should scroll to or highlight the corresponding item, providing instant feedback.

[0134] According to a specific implementation of the embodiment of the present disclosure, the curFocus variable is set to reflect the user's focus date. When the user clicks a date on the calendar, the bound click event handler is triggered. The click event handler updates curFocus, thereby forming a curFocus change vector KF={KF1, KF2, ...KFn} and a curFocus change time vector KT={KT1, KT2, ...KTn} corresponding to the curFocus change vector KF, including:

[0135] Two date range input box groups are placed above the first display list and the second display list, respectively. Each group contains two input boxes, one for selecting the start date and the other for selecting the end date.

[0136] When setting a date in the input box or by clicking on the calendar to select a date, a visual cue is used to indicate the date where the current curFocus is located;

[0137] Bind an event listener to the input box. When the user enters the date in the input box or changes the date through the date picker, the date change is captured and the curFocus variable is updated.

[0138] A click event handler is bound to each date cell on the calendar. When the user clicks a date, the click event handler not only updates curFocus to the clicked date, but also records the change to generate an element KFi in the KF vector. At the same time, it records the time when the change occurred to form an element KTi in the KT vector, thereby forming a curFocus change vector KF={KF1,KF2,…KFn} and a curFocus change time vector KT={KT1,KT2,…KTn} corresponding to the curFocus change vector KF.

[0139] According to a specific implementation of the embodiment of the present disclosure, the calculation of the time decision value τ of the user on the first display list and the second display list based on the curFocus change vector KF={KF1, KF2, ...KFn} and the curFocus change time vector KT={KT1, KT2, ...KTn} includes:

[0140] According to the distribution of the user's stay time in the first display list and the second display list, the frequency of user decision-making, and tolMonth, the time decision value τ is determined:

[0141]

[0142] in, Indicates the time difference between the i-th and i+1-th curFocus focus changes, n is the total number of curFocus focus changes, is the first correction parameter, All time differences The standard deviation is used to measure the fluctuation range of the time interval. is the total number of times the focus switches between the two display lists, β is the second correction parameter, and γ is the third adjustment parameter related to tolMonth.

[0143] According to a specific implementation of the embodiment of the present disclosure, converting the date information set into a preset data object, passing the data object to the parent component corresponding to the date subcomponent through a callback function, and closing the display interface of the date selector include:

[0144] Iterate through each date subcomponent in DZ and check the date selected by the user on each subcomponent;

[0145] Integrate all the selected dates collected into a date information set, and convert the date information set into one or more preset data objects;

[0146] After the data object is ready, the data object is passed to the parent component of the date subcomponent through a custom callback function, which is provided by the parent component to the subcomponent when the date picker component is initialized;

[0147] After calling the callback function, send a close command to close the date picker display interface.

[0148] Corresponding to the above method embodiment, see Figure 3 The embodiment of the present invention further discloses a calendar selector generating device 30, comprising:

[0149] Setting module 301, when the user opens the date selector, checks whether there is a default date range, if yes, uses the default date range as the date range to be displayed, if no, sets the date range to be displayed as the default time range;

[0150] The parsing module 302 parses the date interval to be displayed, obtains the total number of months tolMonth included in the date interval to be displayed, and generates a date component set DZ={DZ1, DZ2, …DZ tolMonth }, when the value of tolMonth is greater than or equal to 2, select the end time of the date range to be displayed as the current month curMonth, and set the previous month brfMonth corresponding to curMonth in the area to the left of curMonth;

[0151] Adding module 303, based on each day of the month where curMonth is located, generates a first display list on the first date subcomponent DZ1, by traversing each day of the month where curMonth is located and creating corresponding DOM elements, and adding a click event listener to each element in the first display list;

[0152] The rendering module 304 displays the first display list corresponding to the curMonth month on the right side of the date display interface, displays the second display list corresponding to the brfMonth month on the left side of the date display interface using the second date subcomponent DZ2, and renders the calendar views corresponding to the first display list and the second display list respectively;

[0153] The updating module 305 sets input boxes for the user to manually input the start and end time of the date range on the first display list and the second display list. After the user inputs in the input boxes, the curFocus variable is set to reflect the user's focus date. When the user clicks on the date on the calendar, the bound click event handler is triggered. The click event handler updates curFocus, thereby forming a curFocus change vector KF={KF1, KF2, ...KFn} and a curFocus change time vector KT={KT1, KT2, ...KTn} corresponding to the curFocus change vector KF.

[0154] Overlay module 306, when the value of tolMonth is greater than or equal to 3, based on the curFocus change vector KF={KF1, KF2, ... KFn} and the curFocus change time vector KT={KT1, KT2, ... KTn}, calculates the time decision value τ of the user on the first display list and the second display list, and when the time decision value τ is less than the preset value τ0, on the date display interface, the second date subcomponent DZ2 is overwritten with the third date subcomponent DZ3, and the first date subcomponent DZ1 is overwritten with the second date subcomponent DZ2;

[0155] Forming module 307, when the user completes date selection on all date subcomponents in the date component set DZ, collects all selected date information to form a date information set, converts the date information set into a preset data object, passes the data object to the parent component corresponding to the date subcomponent through a callback function, and then closes the display interface of the date selector.

[0156] See also Figure 4 The embodiment of the present invention further provides an electronic device 60, the electronic device comprising:

[0157] at least one processor; and,

[0158] a memory communicatively connected to the at least one processor; wherein,

[0159] The memory stores instructions that can be executed by the at least one processor, and the instructions are executed by the at least one processor so that the at least one processor can execute the calendar selector generation method in the aforementioned method embodiment.

[0160] An embodiment of the present invention further provides a non-transitory computer-readable storage medium, which stores computer instructions, and the computer instructions are used to enable the computer to execute the aforementioned method embodiment.

[0161] An embodiment of the present invention also provides a computer program product, which includes a computer program stored on a non-transitory computer-readable storage medium. The computer program includes program instructions, which, when executed by a computer, enable the computer to execute the calendar selector generation method in the aforementioned method embodiment.

[0162] Reference below Figure 4 , which shows a schematic diagram of the structure of an electronic device 60 suitable for implementing the embodiment of the present disclosure. The electronic device in the embodiment of the present disclosure may include, but is not limited to, mobile terminals such as mobile phones, notebook computers, digital broadcast receivers, PDAs (personal digital assistants), PADs (tablet computers), PMPs (portable multimedia players), vehicle terminals (such as vehicle navigation terminals), etc., and fixed terminals such as digital TVs, desktop computers, etc. Figure 4 The electronic device shown is only an example and should not bring any limitation to the functions and scope of use of the embodiments of the present disclosure.

[0163] like Figure 4 As shown, the electronic device 60 may include a processing device (e.g., a central processing unit, a graphics processing unit, etc.) 601, which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM) 602 or a program loaded from a storage device 608 into a random access memory (RAM) 603. In the RAM 603, various programs and data required for the operation of the electronic device 60 are also stored. The processing device 601, the ROM 602, and the RAM 603 are connected to each other via a bus 604. An input / output (I / O) interface 605 is also connected to the bus 604.

[0164] Typically, the following devices may be connected to the I / O interface 605: an input device 606 including, for example, a touch screen, a touch pad, a keyboard, a mouse, an image sensor, a microphone, a gage, a gyroscope, etc.; an output device 607 including, for example, a liquid crystal display (LCD), a speaker, a vibrator, etc.; a storage device 608 including, for example, a magnetic tape, a hard disk, etc.; and a communication device 609. The communication device 609 may allow the electronic device 60 to communicate with other devices wirelessly or by wire to exchange data. Although Figure 4 The electronic device 60 is shown with various devices, but it should be understood that it is not required to implement or have all the devices shown. More or fewer devices may be implemented or have instead.

[0165] In particular, according to an embodiment of the present disclosure, the process described above with reference to the flowchart can be implemented as a computer software program. For example, an embodiment of the present disclosure includes a computer program product, which includes a computer program carried on a computer-readable medium, and the computer program contains program code for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from a network through a communication device 609, or installed from a storage device 608, or installed from a ROM 602. When the computer program is executed by the processing device 601, the above-mentioned functions defined in the method of the embodiment of the present disclosure are executed.

[0166] The above is only a specific embodiment of the present invention, but the protection scope of the present invention is not limited thereto. Any changes or substitutions that can be easily thought of by a person skilled in the art within the technical scope disclosed by the present invention should be included in the protection scope of the present invention. Therefore, the protection scope of the present invention shall be subject to the protection scope of the claims.

Claims

1. A calendar selector generation method, characterized in that: include: When the user opens the date picker, check whether there is a default date range. If yes, use the default date range as the date range to be displayed. If no, set the date range to be displayed as the default time range. Parse the date interval to be displayed, obtain the total number of months tolMonth included in the date interval to be displayed, and generate a date component set DZ={DZ1, DZ2, …DZ tolMonth }, when the value of tolMonth is greater than or equal to 2, select the end time of the date range to be displayed as the current month curMonth, and set the previous month brfMonth corresponding to curMonth in the area to the left of curMonth; Based on each day of the month where curMonth is located, a first display list is generated on the first date subcomponent DZ1, and a click event listener is added to each element in the first display list by traversing each day of the month where curMonth is located and creating corresponding DOM elements; The first display list corresponding to the curMonth month is displayed on the right side of the date display interface, and the second display list corresponding to the brfMonth month is displayed on the left side of the date display interface using the second date subcomponent DZ2, and the calendar views corresponding to the first display list and the second display list are rendered respectively; On the first display list and the second display list, an input box is set for the user to manually input the start and end time of the date range. After the user inputs in the input box, the curFocus variable is set to reflect the user's focus date. When the user clicks on the date on the calendar, the bound click event handler is triggered, and the click event handler updates curFocus, thereby forming a curFocus change vector KF = {KF1, KF2, ... KFn}, and a curFocus change time vector KT = {KT1, KT2, ... KTn} corresponding to the curFocus change vector KF; When the value of tolMonth is greater than or equal to 3, based on the curFocus change vector KF = {KF1, KF2, ... KFn} and the curFocus change time vector KT = {KT1, KT2, ... KTn}, the time decision value τ of the user on the first display list and the second display list is calculated. When the time decision value τ is less than the preset value τ0, on the date display interface, the second date subcomponent DZ2 is covered with the third date subcomponent DZ3, and the first date subcomponent DZ1 is covered with the second date subcomponent DZ2; When the user completes the date selection on all date subcomponents in the date component set DZ, all the selected date information is collected to form a date information set, the date information set is converted into a preset data object, the data object is passed to the parent component corresponding to the date subcomponent through a callback function, and then the display interface of the date selector is closed; The curFocus variable is set to reflect the user's focus date. When the user clicks a date on the calendar, the bound click event handler is triggered. The click event handler updates curFocus, thereby forming a curFocus change vector KF={KF1, KF2, ...KFn} and a curFocus change time vector KT={KT1, KT2, ...KTn} corresponding to the curFocus change vector KF, including: Two date range input box groups are placed above the first display list and the second display list, respectively. Each group contains two input boxes, one for selecting the start date and the other for selecting the end date. When setting a date in the input box or by clicking on the calendar to select a date, a visual cue is used to indicate the date where the current curFocus is located; Bind an event listener to the input box. When the user enters the date in the input box or changes the date through the date picker, the date change is captured and the curFocus variable is updated. Bind a click event handler to each date cell on the calendar. When the user clicks a date, the click event handler not only updates curFocus to the clicked date, but also records the change to generate an element KFi in the KF vector, and records the time when the change occurs to form an element KTi in the KT vector, thereby forming a curFocus change vector KF = {KF1, KF2, ... KFn}, and a curFocus change time vector KT = {KT1, KT2, ... KTn} corresponding to the curFocus change vector KF; The method of calculating the time decision value τ of the user on the first display list and the second display list based on the curFocus change vector KF={KF1, KF2, ...KFn} and the curFocus change time vector KT={KT1, KT2, ...KTn} includes: According to the distribution of the user's stay time in the first display list and the second display list, the frequency of user decision-making, and tolMonth, the time decision value τ is determined: Where, ΔT i =K T(i+1) -K T(i) represents the time difference between the i-th and i+1-th curFocus focus changes, n is the total number of curFocus focus changes, α is the first correction parameter, and σ(ΔT) is the total time difference ΔT i The standard deviation is used to measure the fluctuation range of the time interval, f chg is the total number of times the focus switches between the two display lists, β is the second correction parameter, and γ is the third adjustment parameter related to tolMonth.

2. The method according to claim 1, characterized in that When the user opens the date picker, check whether there is a default date range, and if so, use the default date range as the date range to be displayed, including: When calling or initializing the date picker component, set the start time parameter defaultStartDate and the end time parameter defaultEndDate; In the initialization logic, check whether the start time parameter defaultStartDate and the end time parameter defaultEndDate have been defined and are valid. If both are valid, the time interval defined by the start time parameter defaultStartDate and the end time parameter defaultEndDate is used as the date interval to be displayed.

3. The method according to claim 2, characterized in that The date interval to be displayed is parsed to obtain the total number of months tolMonth included in the date interval to be displayed, and a date component set DZ={DZ1, DZ2, ... DZ tolMonth },include: Create an empty date component set DZ, and based on the value of tolMonth, loop and iterate from the start month to the end month, and generate a date subcomponent DZ1, DZ2, ..., DZtolMonth for each month. Each subcomponent represents a calendar view of a month, including all dates of that month. When tolMonth>=2, the month to which the end date belongs is set to curMonth, and brfMonth is set in the area to the left of curMonth. brfMonth is the month before curMonth. In the interface layout, the date component of brfMonth is displayed on the left of curMonth.

4. The method according to claim 3, characterized in that The method generates a first display list on the first date subcomponent DZ1 based on each day of the month where curMonth is located, traverses each day of the month where curMonth is located and creates corresponding DOM elements, and adds a click event listener to each element in the first display list, including: Inside the first date subcomponent DZ1, a container for storing list items for each day to be generated is prepared; For each day, create a new DOM element, fill the date number in the DOM element, and add the DOM element to the container of DZ1; For each date element created, add a click event listener to it when adding it to the DOM tree; In the click event listener's callback function, define the action that should be performed when a click occurs.

5. The method according to claim 4, characterized in that The first display list corresponding to the curMonth month is displayed on the right side of the date display interface, and the second display list corresponding to the brfMonth month is displayed on the left side of the date display interface using the second date subcomponent DZ2, and the calendar views corresponding to the first display list and the second display list are rendered respectively, including: The date display interface is divided into two parts, the left part is used to display the second display list and calendar view of the brfMonth month, and the right part is used to display the first display list and calendar view of the curMonth month; For each date subcomponent, generate a calendar grid based on the corresponding month, with one cell per day and highlight the current date; Add a click event for each date on the calendar. When the user clicks a day, the display list below should scroll to or highlight the corresponding item, providing instant feedback.

6. The method according to claim 5, characterized in that The step of converting the date information set into a preset data object, passing the data object to a parent component corresponding to the date subcomponent in a callback function, and then closing the display interface of the date selector includes: Iterate through each date subcomponent in DZ and check the date selected by the user on each subcomponent; Integrate all the selected dates collected into a date information set, and convert the date information set into one or more preset data objects; After the data object is ready, the data object is passed to the parent component of the date subcomponent through a custom callback function, which is provided by the parent component to the subcomponent when the date picker component is initialized; After calling the callback function, send a close command to close the date picker display interface.

7. A calendar selector generating device, characterized in that: include: Setting module, when the user opens the date picker, check whether there is a default date range, if yes, use the default date range as the date range to be displayed, if not, set the date range to be displayed as the default time range; The parsing module parses the date interval to be displayed, obtains the total number of months tolMonth included in the date interval to be displayed, and generates a date component set DZ={DZ1, DZ2, …DZ tolMonth }, when the value of tolMonth is greater than or equal to 2, select the end time of the date range to be displayed as the current month curMonth, and set the previous month brfMonth corresponding to curMonth in the area to the left of curMonth; Add a module to generate a first display list on the first date subcomponent DZ1 based on each day of the month where curMonth is located, add a click event listener to each element in the first display list by traversing each day of the month where curMonth is located and creating corresponding DOM elements; A rendering module displays the first display list corresponding to the curMonth month on the right side of the date display interface, displays the second display list corresponding to the brfMonth month on the left side of the date display interface using the second date subcomponent DZ2, and renders the calendar views corresponding to the first display list and the second display list respectively; The updating module sets input boxes for users to manually input the start and end time of the date range on the first display list and the second display list. After the user inputs in the input boxes, the curFocus variable is set to reflect the user's focus date. When the user clicks on the date on the calendar, the bound click event handler is triggered. The click event handler updates curFocus, thereby forming a curFocus change vector KF = {KF1, KF2, ... KFn} and a curFocus change time vector KT = {KT1, KT2, ... KTn} corresponding to the curFocus change vector KF; The overlay module, when the value of tolMonth is greater than or equal to 3, calculates the time decision value τ of the user on the first display list and the second display list based on the curFocus change vector KF = {KF1, KF2, ... KFn} and the curFocus change time vector KT = {KT1, KT2, ... KTn}, and when the time decision value τ is less than the preset value τ0, on the date display interface, the third date subcomponent DZ3 is used to cover the second date subcomponent DZ2, and the second date subcomponent DZ2 is used to cover the first date subcomponent DZ1; A formation module, when the user completes the date selection on all date subcomponents in the date component set DZ, collects all the selected date information to form a date information set, converts the date information set into a preset data object, passes the data object to the parent component corresponding to the date subcomponent through a callback function, and then closes the display interface of the date selector; The curFocus variable is set to reflect the user's focus date. When the user clicks a date on the calendar, the bound click event handler is triggered. The click event handler updates curFocus, thereby forming a curFocus change vector KF={KF1, KF2, ...KFn} and a curFocus change time vector KT={KT1, KT2, ...KTn} corresponding to the curFocus change vector KF, including: Two date range input box groups are placed above the first display list and the second display list, respectively. Each group contains two input boxes, one for selecting the start date and the other for selecting the end date. When setting a date in the input box or by clicking on the calendar to select a date, a visual cue is used to indicate the date where the current curFocus is located; Bind an event listener to the input box. When the user enters the date in the input box or changes the date through the date picker, the date change is captured and the curFocus variable is updated. Bind a click event handler to each date cell on the calendar. When the user clicks a date, the click event handler not only updates curFocus to the clicked date, but also records the change to generate an element KFi in the KF vector, and records the time when the change occurs to form an element KTi in the KT vector, thereby forming a curFocus change vector KF = {KF1, KF2, ... KFn}, and a curFocus change time vector KT = {KT1, KT2, ... KTn} corresponding to the curFocus change vector KF; The method of calculating the time decision value τ of the user on the first display list and the second display list based on the curFocus change vector KF={KF1, KF2, ...KFn} and the curFocus change time vector KT={KT1, KT2, ...KTn} includes: According to the distribution of the user's stay time in the first display list and the second display list, the frequency of user decision-making, and tolMonth, the time decision value τ is determined: Where, ΔT i =K T(i+1) -K T(i) represents the time difference between the i-th and i+1-th curFocus focus changes, n is the total number of curFocus focus changes, α is the first correction parameter, and σ(ΔT) is the total time difference ΔT i The standard deviation is used to measure the fluctuation range of the time interval, f chg is the total number of times the focus switches between the two display lists, β is the second correction parameter, and γ is the third adjustment parameter related to tolMonth.

8. An electronic device, characterized in that: The electronic device comprises: at least one processor; and, a memory communicatively connected to the at least one processor; wherein, The memory stores instructions that can be executed by the at least one processor, and the instructions are executed by the at least one processor to enable the at least one processor to execute the calendar selector generating method described in any one of claims 1 to 6.

Images