0ct0pu5/siyuan
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

🎨 https://github.com/siyuan-note/siyuan/issues/9888

Browse source
This commit is contained in:
Vanessa 2023-12-23 18:06:27 +08:00
parent a41eac8659
commit b378073775
7 changed files with 54 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/src/assets/scss/component/_menu.scss
View file

@ -262,7 +262,7 @@
color: var(--b3-theme-on-surface);
flex-shrink: 0;
&--arrow {
&--small {
margin: 0 0 0 8px;
height: 10px;
}

4
app/src/assets/scss/component/_switch.scss
View file

@ -20,6 +20,10 @@
margin-left: 14px;
}
&--menu {
margin: 13px 6px 13px 0;
}
&:after {
border: 1px solid var(--b3-theme-surface-lighter);
box-shadow: var(--b3-point-shadow);

2
app/src/menus/Menu.ts
View file

@ -230,7 +230,7 @@ export class MenuItem {
options.submenu.forEach((item) => {
submenuElement.firstElementChild.append(new MenuItem(item).element);
});
this.element.insertAdjacentHTML("beforeend", '<svg class="b3-menu__icon b3-menu__icon--arrow"><use xlink:href="#iconRight"></use></svg>');
this.element.insertAdjacentHTML("beforeend", '<svg class="b3-menu__icon b3-menu__icon--small"><use xlink:href="#iconRight"></use></svg>');
this.element.append(submenuElement);
}
}

54
app/src/protyle/render/av/col.ts
View file

@ -115,7 +115,7 @@ export const getEditHTML = (options: {
<span class="fn__space"></span>
<svg class="b3-menu__icon"><use xlink:href="#${getColIconByType(colData.type)}"></use></svg>
<span class="b3-menu__accelerator" style="margin-left: 0">${getColNameByType(colData.type)}</span>
<svg class="b3-menu__icon b3-menu__icon--arrow"><use xlink:href="#iconRight"></use></svg>
<svg class="b3-menu__icon b3-menu__icon--small"><use xlink:href="#iconRight"></use></svg>
</button>`;
if (colData.options && colData.options.length > 0) {
html += `<button class="b3-menu__separator"></button>
@ -147,6 +147,24 @@ export const getEditHTML = (options: {
<button class="b3-menu__item">
<textarea rows="${colData.template.split("\n").length}" placeholder="${window.siyuan.languages.template}" data-type="updateTemplate" style="margin: 4px 0" rows="1" class="fn__block b3-text-field">${colData.template}</textarea>
</button>`;
} else if (colData.type === "relation") {
const databaseName = "TODO"
html += `<button class="b3-menu__item" data-type="goUpdateColType">
<span class="b3-menu__label">${window.siyuan.languages.relatedTo}</span>
<span class="fn__space"></span>
<svg class="b3-menu__icon"><use xlink:href="#iconDatabase"></use></svg>
<span class="b3-menu__accelerator" style="margin-left: 0">${databaseName}</span>
<svg class="b3-menu__icon b3-menu__icon--small"><use xlink:href="#iconRight"></use></svg>
</button>
<label class="b3-menu__item">
<span class="fn__flex-center">${databaseName}</span>
<svg class="b3-menu__icon b3-menu__icon--small"><use xlink:href="#iconHelp"></use></svg>
<span class="fn__space fn__flex-1"></span>
<input type="checkbox" class="b3-switch b3-switch--menu">
</label>
<label class="b3-menu__item" data-type="nobg">
<input class="b3-text-field fn__block" style="margin: 4px" placeholder="todo">
</label>`;
}
return `<div class="b3-menu__items">
${html}
@ -155,7 +173,7 @@ export const getEditHTML = (options: {
<svg class="b3-menu__icon" style=""><use xlink:href="#icon${colData.hidden ? "Eye" : "Eyeoff"}"></use></svg>
<span class="b3-menu__label">${colData.hidden ? window.siyuan.languages.showCol : window.siyuan.languages.hideCol}</span>
</button>
<button class="b3-menu__item" data-type="duplicateCol">
<button class="b3-menu__item${colData.type === "relation" ? " fn__none" : ""}" data-type="duplicateCol">
<svg class="b3-menu__icon" style=""><use xlink:href="#iconCopy"></use></svg>
<span class="b3-menu__label">${window.siyuan.languages.duplicate}</span>
</button>
@ -621,20 +639,22 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen
}
});
if (type !== "block") {
menu.addItem({
icon: "iconCopy",
label: window.siyuan.languages.duplicate,
click() {
duplicateCol({
protyle,
type,
avID,
colId,
icon: menu.element.querySelector(".block__icon").getAttribute("data-icon"),
newValue: (window.siyuan.menus.menu.element.querySelector(".b3-text-field") as HTMLInputElement).value
});
}
});
if (type !== "relation") {
menu.addItem({
icon: "iconCopy",
label: window.siyuan.languages.duplicate,
click() {
duplicateCol({
protyle,
type,
avID,
colId,
icon: menu.element.querySelector(".block__icon").getAttribute("data-icon"),
newValue: (window.siyuan.menus.menu.element.querySelector(".b3-text-field") as HTMLInputElement).value
});
}
});
}
menu.addItem({
icon: "iconTrashcan",
label: window.siyuan.languages.delete,
@ -656,7 +676,7 @@ export const showColMenu = (protyle: IProtyle, blockElement: Element, cellElemen
menu.addSeparator();
}
menu.addItem({
label: `<label class="fn__flex" style="margin: 4px 0"><span>${window.siyuan.languages.wrap}</span><span class="fn__space fn__flex-1"></span>
label: `<label class="fn__flex" style="margin: 4px 0;padding-right: 6px"><span>${window.siyuan.languages.wrap}</span><span class="fn__space fn__flex-1"></span>
<input type="checkbox" class="b3-switch fn__flex-center"${cellElement.dataset.wrap === "true" ? " checked" : ""}></label>`,
bind(element) {
const inputElement = element.querySelector("input") as HTMLInputElement;

12
app/src/protyle/render/av/date.ts
View file

@ -37,18 +37,18 @@ export const getDateHTML = (data: IAVTable, cellElements: HTMLElement[]) => {
}
return `<div class="b3-menu__items">
<div>
<input type="${isNotTime ? "date" : "datetime-local"}" max="${isNotTime ? "9999-12-31" : "9999-12-31 23:59"}" value="${value}" data-value="${value ? dayjs(cellValue.value.date.content).format("YYYY-MM-DD HH:mm") : ""}" class="b3-text-field fn__size200"><br>
<input type="${isNotTime ? "date" : "datetime-local"}" max="${isNotTime ? "9999-12-31" : "9999-12-31 23:59"}" value="${value2}" data-value="${value2 ? dayjs(cellValue.value.date.content2).format("YYYY-MM-DD HH:mm") : ""}" style="margin-top: 8px" class="b3-text-field fn__size200${hasEndDate ? "" : " fn__none"}">
<input type="${isNotTime ? "date" : "datetime-local"}" max="${isNotTime ? "9999-12-31" : "9999-12-31 23:59"}" value="${value}" data-value="${value ? dayjs(cellValue.value.date.content).format("YYYY-MM-DD HH:mm") : ""}" class="b3-text-field fn__size200" style="margin-top: 4px;"><br>
<input type="${isNotTime ? "date" : "datetime-local"}" max="${isNotTime ? "9999-12-31" : "9999-12-31 23:59"}" value="${value2}" data-value="${value2 ? dayjs(cellValue.value.date.content2).format("YYYY-MM-DD HH:mm") : ""}" style="margin-top: 8px;margin-bottom: 4px" class="b3-text-field fn__size200${hasEndDate ? "" : " fn__none"}">
<button class="b3-menu__separator"></button>
<label class="b3-menu__item">
<span>${window.siyuan.languages.endDate}</span>
<span class="fn__flex-center">${window.siyuan.languages.endDate}</span>
<span class="fn__space fn__flex-1"></span>
<input type="checkbox" class="b3-switch fn__flex-center"${hasEndDate ? " checked" : ""}>
<input type="checkbox" class="b3-switch b3-switch--menu"${hasEndDate ? " checked" : ""}>
</label>
<label class="b3-menu__item">
<span>${window.siyuan.languages.includeTime}</span>
<span class="fn__flex-center">${window.siyuan.languages.includeTime}</span>
<span class="fn__space fn__flex-1"></span>
<input type="checkbox" class="b3-switch fn__flex-center"${isNotTime ? "" : " checked"}>
<input type="checkbox" class="b3-switch b3-switch--menu"${isNotTime ? "" : " checked"}>
</label>
<button class="b3-menu__separator"></button>
<button class="b3-menu__item" data-type="clearDate">

2
app/src/protyle/render/av/filter.ts
View file

@ -15,7 +15,7 @@ export const getDefaultOperatorByType = (type: TAVCol) => {
if (["checkbox"].includes(type)) {
return "Is false";
}
if (["text", "mSelect", "url", "block", "email", "phone", "template"].includes(type)) {
if (["relation", "rollup", "text", "mSelect", "url", "block", "email", "phone", "template"].includes(type)) {
return "Contains";
}
};

8
app/src/protyle/render/av/view.ts
View file

@ -118,25 +118,25 @@ export const getViewHTML = (data: IAVTable) => {
<svg class="b3-menu__icon"></svg>
<span class="b3-menu__label">${window.siyuan.languages.attr}</span>
<span class="b3-menu__accelerator">${data.columns.filter((item: IAVColumn) => !item.hidden).length}/${data.columns.length}</span>
<svg class="b3-menu__icon b3-menu__icon--arrow"><use xlink:href="#iconRight"></use></svg>
<svg class="b3-menu__icon b3-menu__icon--small"><use xlink:href="#iconRight"></use></svg>
</button>
<button class="b3-menu__item" data-type="goFilters">
<svg class="b3-menu__icon"><use xlink:href="#iconFilter"></use></svg>
<span class="b3-menu__label">${window.siyuan.languages.filter}</span>
<span class="b3-menu__accelerator">${data.filters.length}</span>
<svg class="b3-menu__icon b3-menu__icon--arrow"><use xlink:href="#iconRight"></use></svg>
<svg class="b3-menu__icon b3-menu__icon--small"><use xlink:href="#iconRight"></use></svg>
</button>
<button class="b3-menu__item" data-type="goSorts">
<svg class="b3-menu__icon"><use xlink:href="#iconSort"></use></svg>
<span class="b3-menu__label">${window.siyuan.languages.sort}</span>
<span class="b3-menu__accelerator">${data.sorts.length}</span>
<svg class="b3-menu__icon b3-menu__icon--arrow"><use xlink:href="#iconRight"></use></svg>
<svg class="b3-menu__icon b3-menu__icon--small"><use xlink:href="#iconRight"></use></svg>
</button>
<button class="b3-menu__item" data-type="set-page-size" data-size="${data.pageSize}">
<svg class="b3-menu__icon"></svg>
<span class="b3-menu__label">${window.siyuan.languages.pageCount}</span>
<span class="b3-menu__accelerator">${data.pageSize}</span>
<svg class="b3-menu__icon b3-menu__icon--arrow"><use xlink:href="#iconRight"></use></svg>
<svg class="b3-menu__icon b3-menu__icon--small"><use xlink:href="#iconRight"></use></svg>
</button>
<button class="b3-menu__separator"></button>
<button class="b3-menu__item" data-type="duplicate-view">