Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-12-21 09:00:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

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

Browse source
This commit is contained in:
Vanessa 2024-01-18 22:55:29 +08:00
parent d9d4dd934f
commit 604b801273
5 changed files with 75 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

65
app/src/assets/scss/business/_custom.scss
View file

@ -1,10 +1,44 @@
.custom-attr {
&__avvalue {
cursor: pointer;
transition: var(--b3-transition);
border-radius: var(--b3-border-radius);
padding: 4px 8px;
line-height: 26px;
min-height: 26px;
&:hover {
background-color: var(--b3-theme-background);
}
}
&__avheader {
border-bottom: 1px solid var(--b3-border-color);
padding: 8px;
.block__logo {
color: var(--b3-protyle-inline-blockref-color);
opacity: .86;
transition: var(--b3-transition);
cursor: pointer;
svg {
margin-right: 4px;
}
&:hover {
opacity: 1;
}
}
}
.b3-label {
display: block;
padding: 8px 16px;
}
.block__logo {
.block__logo:not(.popover__block) {
width: 160px;
color: var(--b3-theme-on-surface);
@ -17,22 +51,6 @@
white-space: nowrap;
overflow: hidden;
}
&.custom-attr__avheader {
color: var(--b3-protyle-inline-blockref-color);
opacity: .86;
transition: var(--b3-transition);
width: 100%;
align-items: center;
justify-content: center;
border-bottom: 1px solid var(--b3-border-color);
padding: 8px 0;
cursor: pointer;
&:hover {
opacity: 1;
}
}
}
.block__icons {
@ -54,19 +72,6 @@
}
}
.custom-attr__avvalue {
cursor: pointer;
transition: var(--b3-transition);
border-radius: var(--b3-border-radius);
padding: 4px 8px;
line-height: 26px;
min-height: 26px;
&:hover {
background-color: var(--b3-theme-background);
}
}
.b3-chip {
margin: 1px 2px;
}

30
app/src/protyle/render/av/blockAttr.ts
View file

@ -1,8 +1,9 @@
import {fetchPost} from "../../../util/fetch";
import {getColIconByType} from "./col";
import {addCol, getColIconByType} from "./col";
import {escapeAttr} from "../../../util/escape";
import * as dayjs from "dayjs";
import {popTextCell} from "./cell";
import {hasClosestBlock} from "../../util/hasClosest";
const genAVRollupHTML = (value: IAVCellValue) => {
let html = "";
@ -149,9 +150,13 @@ export const renderAVAttribute = (element: HTMLElement, id: string, protyle: IPr
avName: string
}) => {
html += `<div data-av-id="${table.avID}" data-node-id="${id}" data-type="NodeAttributeView">
<div class="block__logo custom-attr__avheader popover__block" data-id='${JSON.stringify(table.blockIDs)}'>
<div class="fn__flex custom-attr__avheader">
<div class="block__logo popover__block" data-id='${JSON.stringify(table.blockIDs)}'>
<svg><use xlink:href="#iconDatabase"></use></svg>
<span>${table.avName || window.siyuan.languages.database}</span>
</div>
<div class="fn__flex-1"></div>
<button data-type="addColumn" class="b3-button b3-button--outline"><svg><use xlink:href="#iconAdd"></use></svg>${window.siyuan.languages.addAttr}</button>
</div>`;
table.keyValues?.forEach(item => {
html += `<div class="block__icons av__row" data-id="${id}">
@ -198,6 +203,27 @@ class="fn__flex-1 fn__flex${["url", "text", "number", "email", "phone"].includes
event.stopPropagation();
event.preventDefault();
break;
} else if (type === "template") {
popTextCell(protyle, [target], "template");
event.stopPropagation();
event.preventDefault();
break;
} else if (type === "rollup") {
popTextCell(protyle, [target], "rollup");
event.stopPropagation();
event.preventDefault();
break;
} else if (type === "addColumn") {
const addMenu = addCol(protyle, hasClosestBlock(target) as HTMLElement, "");
const addRect = target.getBoundingClientRect();
addMenu.open({
x: addRect.left,
y: addRect.bottom,
h: addRect.height
});
event.stopPropagation();
event.preventDefault();
break;
}
target = target.parentElement;
}

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

@ -427,7 +427,7 @@ const addAttrViewColAnimation = (options: {
icon?: string,
previousID: string
}) => {
if (!options.blockElement) {
if (!options.blockElement || !options.blockElement.classList.contains("av")) {
return;
}
options.blockElement.querySelectorAll(".av__row").forEach((item, index) => {

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

@ -75,12 +75,14 @@ export const openMenuPanel = (options: {
} else if (options.type === "relation") {
html = getRelationHTML(data, options.cellElements);
if (!html) {
if (options.blockElement.classList.contains("av")) {
openMenuPanel({
protyle: options.protyle,
blockElement: options.blockElement,
type: "edit",
colId: options.cellElements[0].dataset.colId
});
}
return;
}
}

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

@ -296,7 +296,7 @@ export const refreshAV = (protyle: IProtyle, operation: IOperation) => {
if (operation.action === "addAttrViewCol" && isPulse) {
openMenuPanel({protyle, blockElement: item, type: "edit", colId: operation.id});
}
if (operation.action === "updateAttrViewCell") {
if (["updateAttrViewColRollup","updateAttrViewColTemplate", "updateAttrViewCell", "addAttrViewCol"].includes(operation.action)) {
const attrElement = document.querySelector(`.b3-dialog--open[data-key="${Constants.DIALOG_ATTR}"] div[data-av-id="${operation.avID}"]`) as HTMLElement
if (attrElement) {
// 更新属性面板