diff --git a/app/src/protyle/render/av/date.ts b/app/src/protyle/render/av/date.ts
index 8daf967c1..b1d2e1a89 100644
--- a/app/src/protyle/render/av/date.ts
+++ b/app/src/protyle/render/av/date.ts
@@ -1,21 +1,18 @@
+import {transaction} from "../../wysiwyg/transaction";
+import * as dayjs from "dayjs";
+
export const getDateHTML = (data: IAVTable, cellElements: HTMLElement[]) => {
- const colId = cellElements[0].dataset["colId"];
- const colData = data.columns.find(item => {
- if (item.id === colId) {
- return item;
- }
- });
let hasEndDate = true;
- let hasMatch = false;
+ let cellValue:IAVCell
cellElements.forEach((cellElement) => {
data.rows.find(row => {
if (cellElement.parentElement.dataset.id === row.id) {
row.cells.find(cell => {
if (cell.id === cellElement.dataset.id) {
- if (!cell.value || !cell.value.date || !cell.value.date.content2) {
+ if (!cell.value || !cell.value.date || !cell.value.date.hasEndDate) {
hasEndDate = false;
- hasMatch = true;
}
+ cellValue = cell;
return true;
}
});
@@ -23,21 +20,135 @@ export const getDateHTML = (data: IAVTable, cellElements: HTMLElement[]) => {
}
});
});
- if (!hasMatch) {
+ if (!cellValue) {
hasEndDate = false;
}
+ let value = ""
+ if (cellValue?.value?.date?.content) {
+ value = dayjs(cellValue.value.date.content).format("YYYY-MM-DDTHH:mm")
+ }
+ let value2 = ""
+ if (cellValue?.value?.date?.content2) {
+ value2 = dayjs(cellValue.value.date.content2).format("YYYY-MM-DDTHH:mm")
+ }
return `
-
-
+
+
+
+
`;
};
-export const bindDateEvent = (options: { protyle: IProtyle, data: IAV, menuElement: HTMLElement }) => {
-
+export const bindDateEvent = (options: {
+ protyle: IProtyle,
+ data: IAV,
+ menuElement: HTMLElement,
+ cellElements: HTMLElement[]
+}) => {
+ const inputElements: NodeListOf = options.menuElement.querySelectorAll(".b3-text-field");
+ inputElements[0].addEventListener("change", () => {
+ setDateValue({
+ cellElements: options.cellElements,
+ data: options.data,
+ protyle: options.protyle,
+ value: {
+ content: new Date(inputElements[0].value).getTime()
+ }
+ });
+ })
+ inputElements[1].addEventListener("change", () => {
+ setDateValue({
+ cellElements: options.cellElements,
+ data: options.data,
+ protyle: options.protyle,
+ value: {
+ content2: new Date(inputElements[1].value).getTime()
+ }
+ });
+ })
+ const checkElement = options.menuElement.querySelector(".b3-switch") as HTMLInputElement;
+ checkElement.addEventListener("change", () => {
+ if (checkElement.checked) {
+ inputElements[1].classList.remove("fn__none")
+ } else {
+ inputElements[1].classList.add("fn__none")
+ }
+ setDateValue({
+ cellElements: options.cellElements,
+ data: options.data,
+ protyle: options.protyle,
+ value: {
+ hasEndDate: checkElement.checked
+ }
+ });
+ });
};
+
+export const setDateValue = (options: {
+ cellElements: HTMLElement[],
+ data: IAV
+ protyle: IProtyle,
+ value: {
+ content?: number,
+ content2?: number,
+ hasEndDate?: boolean
+ }
+}) => {
+ let cellIndex = 0;
+ Array.from(options.cellElements[0].parentElement.querySelectorAll(".av__cell")).find((item: HTMLElement, index) => {
+ if (item.dataset.id === options.cellElements[0].dataset.id) {
+ cellIndex = index;
+ return true;
+ }
+ });
+ const colId = options.cellElements[0].dataset.colId;
+ const cellDoOperations: IOperation[] = [];
+ const cellUndoOperations: IOperation[] = [];
+ options.cellElements.forEach(item => {
+ let cellData: IAVCell;
+ let oldValue
+ const rowID = item.parentElement.dataset.id;
+ options.data.view.rows.find(row => {
+ if (row.id === rowID) {
+ cellData = row.cells[cellIndex];
+ // 为空时 cellId 每次请求都不一致
+ cellData.id = item.dataset.id;
+ if (!cellData.value) {
+ cellData.value = {};
+ }
+ oldValue = Object.assign({}, cellData.value.date);
+ cellData.value.date = Object.assign(cellData.value.date || {}, options.value);
+ return true;
+ }
+ });
+
+ cellDoOperations.push({
+ action: "updateAttrViewCell",
+ id: cellData.id,
+ keyID: colId,
+ rowID,
+ avID: options.data.id,
+ data: cellData.value
+ });
+ cellUndoOperations.push({
+ action: "updateAttrViewCell",
+ id: cellData.id,
+ keyID: colId,
+ rowID,
+ avID: options.data.id,
+ data: {
+ date: oldValue
+ }
+ });
+ });
+ transaction(options.protyle, cellDoOperations, cellUndoOperations);
+}
diff --git a/app/src/protyle/render/av/openMenuPanel.ts b/app/src/protyle/render/av/openMenuPanel.ts
index aaa34ec57..405907cf9 100644
--- a/app/src/protyle/render/av/openMenuPanel.ts
+++ b/app/src/protyle/render/av/openMenuPanel.ts
@@ -7,7 +7,7 @@ import {hasClosestByAttribute} from "../../util/hasClosest";
import {bindSelectEvent, getSelectHTML, addColOptionOrCell, setColOption, removeCellOption} from "./select";
import {addFilter, getFiltersHTML, setFilter} from "./filter";
import {addSort, bindSortsEvent, getSortsHTML} from "./sort";
-import {bindDateEvent, getDateHTML} from "./date";
+import {bindDateEvent, getDateHTML, setDateValue} from "./date";
export const openMenuPanel = (options: {
protyle: IProtyle,
@@ -59,7 +59,7 @@ export const openMenuPanel = (options: {
} else if (options.type === "date") {
const cellRect = options.cellElements[options.cellElements.length - 1].getBoundingClientRect();
setPosition(menuElement, cellRect.left, cellRect.bottom, cellRect.height);
- bindDateEvent({protyle: options.protyle, data, menuElement});
+ bindDateEvent({protyle: options.protyle, data, menuElement, cellElements: options.cellElements});
const inputElement = menuElement.querySelector("input");
inputElement.select();
inputElement.focus();
@@ -604,6 +604,21 @@ export const openMenuPanel = (options: {
event.preventDefault();
event.stopPropagation();
break;
+ } else if (type === "clearDate") {
+ setDateValue({
+ cellElements: options.cellElements,
+ data,
+ protyle: options.protyle,
+ value: {
+ content: 0,
+ content2: 0,
+ hasEndDate: false
+ }
+ });
+ avPanelElement.remove();
+ event.preventDefault();
+ event.stopPropagation();
+ break;
}
target = target.parentElement;
}
diff --git a/app/src/types/index.d.ts b/app/src/types/index.d.ts
index f50be4c60..21ba91ba0 100644
--- a/app/src/types/index.d.ts
+++ b/app/src/types/index.d.ts
@@ -925,10 +925,10 @@ interface IAVCell {
}
interface IAVCellValue {
- type: TAVCol,
+ type?: TAVCol,
text?: { content: string },
number?: { content?: number, isNotEmpty: boolean, format?: string, formattedContent?: string },
mSelect?: { content: string, color: string }[]
block?: { content: string, id: string }
- date?: { content: string, content2?: string }
+ date?: { content?: number, content2?: number, hasEndDate?: boolean }
}