Vanessa 2023-08-03 15:08:07 +08:00
parent 8e1e8139bb
commit 91b23f0bb0
18 changed files with 159 additions and 39 deletions

View File

@ -1,5 +1,11 @@
document.body.insertAdjacentHTML('afterbegin', `<svg style="position: absolute; width: 0; height: 0; overflow: hidden;" xmlns="http://www.w3.org/2000/svg">
<defs>
<symbol id="iconEmail" viewBox="0 0 32 32">
<path d="M29.675 4.429h-27.351c-0.582 0-1.052 0.47-1.052 1.052v21.039c0 0.582 0.47 1.052 1.052 1.052h27.351c0.582 0 1.052-0.47 1.052-1.052v-21.039c0-0.582-0.47-1.052-1.052-1.052zM28.36 8.071v17.134h-24.721v-17.134l-0.907-0.707 1.292-1.66 1.407 1.095h21.141l1.407-1.095 1.292 1.66-0.911 0.707zM26.572 6.795l-10.572 8.218-11.979-9.313-1.292 1.66 0.907 0.707 11.23 8.731c0.308 0.241 0.702 0.387 1.129 0.387s0.821-0.146 1.133-0.39l-0.004 0.003 12.143-9.435-1.292-1.66-1.404 1.091z"></path>
</symbol>
<symbol id="iconPhone" viewBox="0 0 32 32">
<path d="M2.31 5.753l3.993-3.99c0.487-0.487 1.14-0.761 1.83-0.761s1.342 0.27 1.83 0.761l4.301 4.293c0.487 0.487 0.761 1.144 0.761 1.833 0 0.694-0.27 1.342-0.761 1.833l-3.36 3.363c0.808 1.854 1.9 3.438 3.239 4.773l0 0c1.376 1.384 2.985 2.475 4.769 3.247l3.36-3.363c0.487-0.487 1.14-0.761 1.83-0.761 0.003 0 0.006-0 0.009-0 0.712 0 1.356 0.291 1.82 0.761l0 0 4.305 4.293c0.487 0.487 0.761 1.144 0.761 1.834 0 0.694-0.27 1.342-0.761 1.834l-3.99 3.99c-0.832 0.832-1.98 1.309-3.157 1.309-0.244 0-0.48-0.019-0.72-0.060-4.964-0.817-9.891-3.461-13.87-7.435-3.975-3.982-6.614-8.909-7.439-13.877-0.236-1.41 0.236-2.861 1.249-3.877zM3.72 9.183c0.731 4.421 3.108 8.83 6.689 12.411s7.986 5.958 12.407 6.689c0.555 0.094 1.125-0.094 1.53-0.495l3.918-3.918-4.155-4.158-4.526 4.533-0.81-0.3c-4.983-1.869-8.846-5.732-10.671-10.592l-0.041-0.124-0.3-0.81 4.529-4.526-4.155-4.158-3.918 3.918c-0.405 0.405-0.592 0.975-0.499 1.53z"></path>
</symbol>
<symbol id="iconDrag" viewBox="0 0 32 32">
<path d="M6.647 5.61c0.354 0.208 0.78 0.331 1.235 0.331 1.365 0 2.471-1.106 2.471-2.471 0-0.91-0.492-1.705-1.224-2.133l-0.012-0.006c-0.354-0.208-0.78-0.331-1.235-0.331-1.365 0-2.471 1.106-2.471 2.471 0 0.91 0.492 1.705 1.224 2.133l0.012 0.006zM6.647 18.14c0.354 0.208 0.78 0.331 1.235 0.331 1.365 0 2.471-1.106 2.471-2.471 0-0.91-0.492-1.705-1.224-2.133l-0.012-0.006c-0.354-0.208-0.78-0.331-1.235-0.331-1.365 0-2.471 1.106-2.471 2.471 0 0.91 0.492 1.705 1.224 2.133l0.012 0.006zM21.647 3.471c0 1.364 1.106 2.471 2.471 2.471s2.471-1.106 2.471-2.471v0c0-1.364-1.106-2.471-2.471-2.471s-2.471 1.106-2.471 2.471v0zM21.647 16c0 1.364 1.106 2.471 2.471 2.471s2.471-1.106 2.471-2.471v0c0-1.364-1.106-2.471-2.471-2.471s-2.471 1.106-2.471 2.471v0zM6.647 30.669c0.354 0.208 0.78 0.331 1.235 0.331 1.365 0 2.471-1.106 2.471-2.471 0-0.91-0.492-1.705-1.224-2.133l-0.012-0.006c-0.354-0.208-0.78-0.331-1.235-0.331-1.365 0-2.471 1.106-2.471 2.471 0 0.91 0.492 1.705 1.224 2.133l0.012 0.006zM21.647 28.529c0 1.364 1.106 2.471 2.471 2.471s2.471-1.106 2.471-2.471v0c0-1.364-1.106-2.471-2.471-2.471s-2.471 1.106-2.471 2.471v0z"></path>
</symbol>

View File

@ -2,5 +2,5 @@
"name": "ant",
"author": "Vanessa",
"url": "https://github.com/Vanessa219",
"version": "1.21.1"
"version": "1.22.0"
}

View File

@ -28,6 +28,18 @@
<body>
<h2>SiYuan</h2>
<div class="fn__clear">
<div>
<svg>
<use xlink:href="#iconPhone"></use>
</svg>
iconPhone
</div>
<div>
<svg>
<use xlink:href="#iconEmail"></use>
</svg>
iconEmail
</div>
<div>
<svg>
<use xlink:href="#iconDrag"></use>

View File

@ -1,5 +1,11 @@
document.body.insertAdjacentHTML('afterbegin', `<svg style="position: absolute; width: 0; height: 0; overflow: hidden;" xmlns="http://www.w3.org/2000/svg">
<defs>
<symbol id="iconEmail" viewBox="0 0 32 32">
<path d="M16 0.925c-8.28 0-15 6.72-15 15s6.72 15 15 15h7.5v-3h-7.5c-6.51 0-12-5.49-12-12s5.49-12 12-12 12 5.49 12 12v2.145c0 1.185-1.065 2.355-2.25 2.355s-2.25-1.17-2.25-2.355v-2.145c0-4.14-3.36-7.5-7.5-7.5s-7.5 3.36-7.5 7.5 3.36 7.5 7.5 7.5c2.070 0 3.96-0.84 5.31-2.205 0.975 1.335 2.655 2.205 4.44 2.205 2.955 0 5.25-2.4 5.25-5.355v-2.145c0-8.28-6.72-15-15-15zM16 20.425c-2.49 0-4.5-2.010-4.5-4.5s2.010-4.5 4.5-4.5 4.5 2.010 4.5 4.5-2.010 4.5-4.5 4.5z"></path>
</symbol>
<symbol id="iconPhone" viewBox="0 0 32 32">
<path d="M6.9 4.333c0.1 1.483 0.35 2.933 0.75 4.317l-2 2c-0.683-2-1.117-4.117-1.267-6.317h2.517zM23.333 24.367c1.417 0.4 2.867 0.65 4.333 0.75v2.483c-2.2-0.15-4.317-0.583-6.333-1.25l2-1.983zM8.5 1h-5.833c-0.917 0-1.667 0.75-1.667 1.667 0 15.65 12.683 28.333 28.333 28.333 0.917 0 1.667-0.75 1.667-1.667v-5.817c0-0.917-0.75-1.667-1.667-1.667-2.067 0-4.083-0.333-5.95-0.95-0.167-0.067-0.35-0.083-0.517-0.083-0.433 0-0.85 0.167-1.183 0.483l-3.667 3.667c-4.717-2.417-8.583-6.267-10.983-10.983l3.667-3.667c0.467-0.467 0.6-1.117 0.417-1.7-0.617-1.867-0.95-3.867-0.95-5.95 0-0.917-0.75-1.667-1.667-1.667z"></path>
</symbol>
<symbol id="iconDrag" viewBox="0 0 32 32">
<path d="M14.125 27.25c0 2.063-1.688 3.75-3.75 3.75s-3.75-1.688-3.75-3.75 1.688-3.75 3.75-3.75 3.75 1.688 3.75 3.75zM10.375 12.25c-2.063 0-3.75 1.688-3.75 3.75s1.688 3.75 3.75 3.75 3.75-1.688 3.75-3.75-1.688-3.75-3.75-3.75zM10.375 1c-2.063 0-3.75 1.688-3.75 3.75s1.688 3.75 3.75 3.75 3.75-1.688 3.75-3.75-1.688-3.75-3.75-3.75zM21.625 8.5c2.063 0 3.75-1.688 3.75-3.75s-1.688-3.75-3.75-3.75-3.75 1.688-3.75 3.75 1.688 3.75 3.75 3.75zM21.625 12.25c-2.063 0-3.75 1.688-3.75 3.75s1.688 3.75 3.75 3.75 3.75-1.688 3.75-3.75-1.688-3.75-3.75-3.75zM21.625 23.5c-2.063 0-3.75 1.688-3.75 3.75s1.688 3.75 3.75 3.75 3.75-1.688 3.75-3.75-1.688-3.75-3.75-3.75z"></path>
</symbol>

View File

@ -2,5 +2,5 @@
"name": "material",
"author": "Vanessa",
"url": "https://github.com/Vanessa219",
"version": "1.21.1"
"version": "1.22.0"
}

View File

@ -1,4 +1,6 @@
{
"email": "Email",
"phone": "Phone",
"inboxTip": "Open the user guide to search the <code class='fn__code'>inbox</code> to view the instructions",
"builtIn": "Built-in",
"endDate": "End date",

View File

@ -1,4 +1,6 @@
{
"email": "Correo electrónico",
"phone": "Teléfono",
"inboxTip": "Abra la guía del usuario para buscar en la <code class='fn__code'>bandeja de entrada</code> para ver las instrucciones",
"builtIn": "Incorporado",
"endDate": "Fecha de finalización",

View File

@ -1,4 +1,6 @@
{
"email": "E-mail",
"phone": "Téléphone",
"inboxTip": "Ouvrez le guide de l'utilisateur pour rechercher la <code class='fn__code'>boîte de réception</code> pour afficher les instructions",
"builtIn": "Intégré",
"endDate": "Date de fin",

View File

@ -1,4 +1,6 @@
{
"email": "郵箱",
"phone": "電話",
"inboxTip": "打開用戶指南搜索 <code class='fn__code'>收集箱</code> 查看使用說明",
"builtIn": "內置",
"endDate": "結束日期",

View File

@ -1,4 +1,6 @@
{
"email": "邮箱",
"phone": "电话",
"inboxTip": "打开用户指南搜索 <code class='fn__code'>收集箱</code> 查看使用说明",
"builtIn": "内置",
"endDate": "结束时间",

View File

@ -175,28 +175,21 @@
display: flex;
align-items: center;
svg {
height: 12px;
width: 12px;
color: var(--b3-theme-on-surface);
margin-right: 5px;
flex-shrink: 0;
}
[data-type="block-ref"],
[data-type="a"] {
[data-type="block-ref"] {
display: none;
position: absolute;
right: 5px;
font-size: 10px;
}
&:hover [data-type="a"] {
display: block;
.block__icon {
position: absolute;
right: 5px;
}
&:hover {
border-bottom: 0 !important;
}
&:hover .block__icon {
opacity: 1;
background-color: var(--b3-theme-background-light) !important;
}
}
@ -206,10 +199,17 @@
align-items: center;
flex: 1;
overflow: hidden;
& > svg {
height: 12px;
width: 12px;
color: var(--b3-theme-on-surface);
margin-right: 5px;
flex-shrink: 0;
}
}
&__celltext {
flex: 1;
overflow: hidden;
.b3-chip {

View File

@ -11,6 +11,8 @@ import {openMenuPanel} from "./openMenuPanel";
import {hintRef} from "../../hint/extend";
import {hideElements} from "../../ui/hideElements";
import {focusByRange} from "../../util/selection";
import {writeText} from "../../util/compatibility";
import {showMessage} from "../../../dialog/message";
export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLElement }) => {
const blockElement = hasClosestBlock(event.target);
@ -103,6 +105,29 @@ export const avClick = (protyle: IProtyle, event: MouseEvent & { target: HTMLEle
return true;
}
const copyElement = hasClosestByAttribute(event.target, "data-type", "copy");
if (copyElement) {
writeText(copyElement.previousElementSibling.textContent.trim());
showMessage(window.siyuan.languages.copied);
event.preventDefault();
event.stopPropagation();
return true;
}
const linkElement = hasClosestByClassName(event.target, "av__celltext--url");
if (linkElement) {
let prefix = ""
if (linkElement.dataset.type === "phone") {
prefix = "tel:"
} else if (linkElement.dataset.type === "email") {
prefix = "mailto:"
}
window.open(prefix + linkElement.textContent.trim());
event.preventDefault();
event.stopPropagation();
return true;
}
const cellHeaderElement = hasClosestByClassName(event.target, "av__cellheader");
if (cellHeaderElement) {
showColMenu(protyle, blockElement, cellHeaderElement.parentElement);

View File

@ -101,7 +101,7 @@ export const addCol = (protyle: IProtyle, blockElement: HTMLElement) => {
const id = Lute.NewNodeID();
transaction(protyle, [{
action: "addAttrViewCol",
name: "Link",
name: "URL",
avID,
type: "url",
id
@ -112,5 +112,41 @@ export const addCol = (protyle: IProtyle, blockElement: HTMLElement) => {
}]);
}
});
menu.addItem({
icon: "iconEmail",
label: window.siyuan.languages.email,
click() {
const id = Lute.NewNodeID();
transaction(protyle, [{
action: "addAttrViewCol",
name: "Email",
avID,
type: "email",
id
}], [{
action: "removeAttrViewCol",
id,
avID,
}]);
}
});
menu.addItem({
icon: "iconPhone",
label: window.siyuan.languages.phone,
click() {
const id = Lute.NewNodeID();
transaction(protyle, [{
action: "addAttrViewCol",
name: "Phone",
avID,
type: "phone",
id
}], [{
action: "removeAttrViewCol",
id,
avID,
}]);
}
});
return menu;
};

View File

@ -86,7 +86,7 @@ export const genCellValue = (colType: TAVCol, value: string | {
}
};
}
} else if (["text", "block", "url"].includes(colType)) {
} else if (["text", "block", "url", "phone", "email"].includes(colType)) {
cellValue = {
type: colType,
[colType]: {
@ -348,7 +348,7 @@ export const popTextCell = (protyle: IProtyle, cellElements: HTMLElement[]) => {
let html = "";
const style = `style="position:absolute;left: ${cellRect.left}px;top: ${cellRect.top}px;width:${Math.max(cellRect.width, 200)}px;height: ${cellRect.height}px"`;
const blockElement = hasClosestBlock(cellElements[0]);
if (["text", "url"].includes(type)) {
if (["text", "url", "email", "phone"].includes(type)) {
html = `<textarea ${style} class="b3-text-field">${cellElements[0].firstElementChild.textContent}</textarea>`;
} else if (type === "number") {
html = `<input type="number" value="${cellElements[0].textContent}" ${style} class="b3-text-field">`;

View File

@ -229,6 +229,10 @@ export const getColIconByType = (type: TAVCol) => {
return "iconCalendar";
case "url":
return "iconLink";
case "email":
return "iconEmail";
case "phone":
return "iconPhone";
}
};

View File

@ -11,7 +11,7 @@ export const getDefaultOperatorByType = (type: TAVCol) => {
if (type === "number" || type === "select") {
return "=";
}
if (["text", "mSelect", "url", "block"].includes(type)) {
if (["text", "mSelect", "url", "block", "email", "phone"].includes(type)) {
return "Contains";
}
};
@ -139,6 +139,8 @@ export const setFilter = (options: {
case "block":
case "text":
case "url":
case "phone":
case "email":
selectHTML = `<option ${"=" === options.filter.operator ? "selected" : ""} value="=">${window.siyuan.languages.filterOperatorIs}</option>
<option ${"!=" === options.filter.operator ? "selected" : ""} value="!=">${window.siyuan.languages.filterOperatorIsNot}</option>
<option ${"Contains" === options.filter.operator ? "selected" : ""} value="Contains">${window.siyuan.languages.filterOperatorContains}</option>
@ -212,7 +214,7 @@ export const setFilter = (options: {
}
});
});
} else if (["text", "url", "block"].includes(colData.type)) {
} else if (["text", "url", "block", "email", "phone"].includes(colData.type)) {
menu.addItem({
iconHTML: "",
label: `<input style="margin: 4px 0" value="${options.filter.value ? options.filter.value[colData.type as "text"].content : ""}" class="b3-text-field fn__size200">`
@ -388,8 +390,10 @@ export const getFiltersHTML = (data: IAVTable) => {
} else if ("<=" === filter.operator) {
filterValue = `${filter.value.number.content}`;
}
} else if (filter.value?.text?.content || filter.value?.block?.content || filter.value?.url?.content) {
const content = filter.value?.text?.content || filter.value?.block?.content || filter.value?.url?.content;
} else if (filter.value?.text?.content || filter.value?.block?.content || filter.value?.url?.content ||
filter.value?.phone?.content || filter.value?.email?.content) {
const content = filter.value?.text?.content || filter.value?.block?.content ||
filter.value?.url?.content || filter.value?.phone?.content || filter.value?.email?.content;
if (["=", "Contains"].includes(filter.operator)) {
filterValue = `: ${content}`;
} else if (filter.operator === "Does not contains") {

View File

@ -68,10 +68,10 @@ style="width: ${column.width || "200px"}">${getCalcValue(column) || '<svg><use x
let text = "";
if (cell.valueType === "text") {
text = `<span class="av__celltext">${cell.value?.text.content || ""}</span>`;
} else if (cell.valueType === "url") {
text = `<span class="av__celltext av__celltext--url">${cell.value?.url.content || ""}</span>`;
if (cell.value?.url.content) {
text += `<span class="b3-chip b3-chip--info b3-chip--small" data-type="a" data-href="${cell.value.url.content}">${window.siyuan.languages.openBy}</span>`;
} else if (["url", "email", "phone"].includes(cell.valueType)) {
text = `<span class="av__celltext av__celltext--url" data-type="${cell.valueType}">${cell.value ? cell.value[cell.valueType as "url"].content : ""}</span>`;
if (cell.value && cell.value[cell.valueType as "url"].content) {
text += `<span data-type="copy" class="b3-tooltips b3-tooltips__n block__icon" aria-label="${window.siyuan.languages.copy}"><svg><use xlink:href="#iconCopy"></use></svg></span>`;
}
} else if (cell.valueType === "block") {
text = `<span class="av__celltext">${cell.value?.block.content || ""}</span>`;
@ -235,6 +235,16 @@ const genAVValueHTML = (value: IAVCellValue) => {
<span class="fn__space"></span>
<a href="${value.url.content}" target="_blank" aria-label="${window.siyuan.languages.openBy}" class="block__icon block__icon--show fn__flex-center b3-tooltips__w b3-tooltips"><svg><use xlink:href="#iconLink"></use></svg></a>`;
break;
case "phone":
html = `<input value="${value.phone.content}" class="b3-text-field b3-text-field--text fn__flex-1">
<span class="fn__space"></span>
<a href="tel:${value.phone.content}" target="_blank" aria-label="${window.siyuan.languages.openBy}" class="block__icon block__icon--show fn__flex-center b3-tooltips__w b3-tooltips"><svg><use xlink:href="#iconPhone"></use></svg></a>`;
break;
case "email":
html = `<input value="${value.email.content}" class="b3-text-field b3-text-field--text fn__flex-1">
<span class="fn__space"></span>
<a href="mailto:${value.email.content}" target="_blank" aria-label="${window.siyuan.languages.openBy}" class="block__icon block__icon--show fn__flex-center b3-tooltips__w b3-tooltips"><svg><use xlink:href="#iconEmail"></use></svg></a>`;
break;
}
return html;
};
@ -266,7 +276,7 @@ export const renderAVAttribute = (element: HTMLElement, id: string) => {
</div>
<div data-av-id="${table.avID}" data-key-id="${item.values[0].keyID}" data-block-id="${item.values[0].blockID}" data-id="${item.values[0].id}" data-type="${item.values[0].type}"
data-options="${item.key?.options ? escapeAttr(JSON.stringify(item.key.options)) : "[]"}"
class="fn__flex-1 fn__flex${["url", "text", "number"].includes(item.values[0].type) ? "" : " custom-attr__avvalue"}">
class="fn__flex-1 fn__flex${["url", "text", "number", "email", "phone"].includes(item.values[0].type) ? "" : " custom-attr__avvalue"}">
${genAVValueHTML(item.values[0])}
</div>
</div>`;
@ -436,15 +446,9 @@ class="fn__flex-1 fn__flex${["url", "text", "number"].includes(item.values[0].ty
element.querySelectorAll(".b3-text-field--text").forEach((item: HTMLInputElement) => {
item.addEventListener("change", () => {
let value;
if (item.parentElement.dataset.type === "url") {
if (["url", "text", "email", "phone"].includes(item.parentElement.dataset.type)) {
value = {
url: {
content: item.value
}
};
} else if (item.parentElement.dataset.type === "text") {
value = {
text: {
[item.parentElement.dataset.type]: {
content: item.value
}
};

View File

@ -45,7 +45,18 @@ type TEventBus = "ws-main" |
"open-menu-av" | "open-menu-content" | "open-menu-breadcrumbmore" |
"input-search" |
"loaded-protyle"
type TAVCol = "text" | "date" | "number" | "relation" | "rollup" | "select" | "block" | "mSelect" | "url"
type TAVCol =
"text"
| "date"
| "number"
| "relation"
| "rollup"
| "select"
| "block"
| "mSelect"
| "url"
| "email"
| "phone"
type THintSource = "search" | "av" | "hint";
type TAVFilterOperator =
"="
@ -932,6 +943,8 @@ interface IAVCellValue {
mSelect?: { content: string, color: string }[]
block?: { content: string, id?: string }
url?: { content: string }
phone?: { content: string }
email?: { content: string }
date?: IAVCellDateValue
}