[WIP] Handle timezone offset for timeRange

This commit is contained in:
Louis Lam
2022-09-25 19:38:28 +08:00
parent f11dfc8f43
commit 3f63cb246b
7 changed files with 110 additions and 32 deletions

View File

@@ -607,7 +607,7 @@ export default {
recurringInterval: "Interval",
"Recurring": "Recurring",
strategyManual: "Active/Inactive Manually",
warningTimezone: "It is NOT your current browser's timezone. It is your server's timezone.",
warningTimezone: "It is using your current Device/PC's timezone.",
weekdayShortMon: "Mon",
weekdayShortTue: "Tue",
weekdayShortWed: "Wed",

View File

@@ -109,7 +109,6 @@
:monthChangeOnScroll="false"
:minDate="minDate"
format="yyyy-MM-dd HH:mm"
utc="preserve"
/>
</div>
</template>
@@ -185,8 +184,8 @@
<Datepicker
v-model="maintenance.timeRange"
:dark="$root.isDark"
timePicker disableTimeRangeValidation range
placeholder="Select Time"
timePicker
disableTimeRangeValidation range
textInput
/>
</div>
@@ -201,7 +200,7 @@
:monthChangeOnScroll="false"
:minDate="minDate"
:enableTimePicker="false"
utc="preserve"
:utc="true"
/>
</div>
</template>
@@ -357,6 +356,9 @@ export default {
},
methods: {
init() {
// Use browser's timezone!
let timezone = dayjs.tz.guess();
this.affectedMonitors = [];
this.selectedStatusPages = [];
@@ -380,10 +382,8 @@ export default {
daysOfMonth: [],
};
} else if (this.isEdit) {
this.$root.getSocket().emit("getMaintenance", this.$route.params.id, (res) => {
this.$root.getSocket().emit("getMaintenance", this.$route.params.id, timezone, (res) => {
if (res.ok) {
res.maintenance.start_date = this.$root.datetimeFormat(res.maintenance.start_date, "YYYY-MM-DDTHH:mm");
res.maintenance.end_date = this.$root.datetimeFormat(res.maintenance.end_date, "YYYY-MM-DDTHH:mm");
this.maintenance = res.maintenance;
this.$root.getSocket().emit("getMonitorMaintenance", this.$route.params.id, (res) => {
@@ -441,8 +441,11 @@ export default {
this.maintenance.end_date = this.$root.toUTC(this.maintenance.end_date);
*/
// Use browser's timezone!
let timezone = dayjs.tz.guess();
if (this.isAdd) {
this.$root.addMaintenance(this.maintenance, async (res) => {
this.$root.addMaintenance(this.maintenance, timezone, async (res) => {
if (res.ok) {
await this.addMonitorMaintenance(res.maintenanceID, async () => {
await this.addMaintenanceStatusPage(res.maintenanceID, () => {
@@ -459,7 +462,7 @@ export default {
});
} else {
this.$root.getSocket().emit("editMaintenance", this.maintenance, async (res) => {
this.$root.getSocket().emit("editMaintenance", this.maintenance, timezone, async (res) => {
if (res.ok) {
await this.addMonitorMaintenance(res.maintenanceID, async () => {
await this.addMaintenanceStatusPage(res.maintenanceID, () => {

View File

@@ -7,7 +7,7 @@
// Backend uses the compiled file util.js
// Frontend uses util.ts
Object.defineProperty(exports, "__esModule", { value: true });
exports.parseTimeFormatFromVueDatePicker = exports.parseVueDatePickerTimeFormat = exports.getMaintenanceRelativeURL = exports.getMonitorRelativeURL = exports.genSecret = exports.getCryptoRandomInt = exports.getRandomInt = exports.getRandomArbitrary = exports.TimeLogger = exports.polyfill = exports.log = exports.debug = exports.ucfirst = exports.sleep = exports.flipStatus = exports.STATUS_PAGE_MAINTENANCE = exports.STATUS_PAGE_PARTIAL_DOWN = exports.STATUS_PAGE_ALL_UP = exports.STATUS_PAGE_ALL_DOWN = exports.MAINTENANCE = exports.PENDING = exports.UP = exports.DOWN = exports.appName = exports.isDev = void 0;
exports.parseTimeFromTimeObject = exports.parseTimeObject = exports.getMaintenanceRelativeURL = exports.getMonitorRelativeURL = exports.genSecret = exports.getCryptoRandomInt = exports.getRandomInt = exports.getRandomArbitrary = exports.TimeLogger = exports.polyfill = exports.log = exports.debug = exports.ucfirst = exports.sleep = exports.flipStatus = exports.STATUS_PAGE_MAINTENANCE = exports.STATUS_PAGE_PARTIAL_DOWN = exports.STATUS_PAGE_ALL_UP = exports.STATUS_PAGE_ALL_DOWN = exports.MAINTENANCE = exports.PENDING = exports.UP = exports.DOWN = exports.appName = exports.isDev = void 0;
const _dayjs = require("dayjs");
const dayjs = _dayjs;
exports.isDev = process.env.NODE_ENV === "development";
@@ -314,7 +314,7 @@ exports.getMaintenanceRelativeURL = getMaintenanceRelativeURL;
* @param {string} time E.g. 12:00
* @returns object
*/
function parseVueDatePickerTimeFormat(time) {
function parseTimeObject(time) {
if (!time) {
return {
hours: 0,
@@ -335,11 +335,11 @@ function parseVueDatePickerTimeFormat(time) {
}
return obj;
}
exports.parseVueDatePickerTimeFormat = parseVueDatePickerTimeFormat;
exports.parseTimeObject = parseTimeObject;
/**
* @returns string e.g. 12:00
*/
function parseTimeFormatFromVueDatePicker(obj) {
function parseTimeFromTimeObject(obj) {
if (!obj) {
return obj;
}
@@ -350,4 +350,4 @@ function parseTimeFormatFromVueDatePicker(obj) {
}
return result;
}
exports.parseTimeFormatFromVueDatePicker = parseTimeFormatFromVueDatePicker;
exports.parseTimeFromTimeObject = parseTimeFromTimeObject;

View File

@@ -348,7 +348,7 @@ export function getMaintenanceRelativeURL(id: string) {
* @param {string} time E.g. 12:00
* @returns object
*/
export function parseVueDatePickerTimeFormat(time: string) {
export function parseTimeObject(time: string) {
if (!time) {
return {
hours: 0,
@@ -376,7 +376,7 @@ export function parseVueDatePickerTimeFormat(time: string) {
/**
* @returns string e.g. 12:00
*/
export function parseTimeFormatFromVueDatePicker(obj : any) {
export function parseTimeFromTimeObject(obj : any) {
if (!obj) {
return obj;
}
@@ -391,3 +391,4 @@ export function parseTimeFormatFromVueDatePicker(obj : any) {
return result;
}