From 89ba7fc01c8db5eff97fdfb6cc76403ad2d4f4a1 Mon Sep 17 00:00:00 2001 From: pardnchiu Date: Mon, 4 Nov 2024 10:56:08 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=BE=A9=E6=AF=94=E5=B0=8D=20`APPEND`?= =?UTF-8?q?=20=E4=B8=AD=E6=93=8D=E4=BD=9C=E5=AD=90=E7=AF=80=E9=BB=9E?= =?UTF-8?q?=E6=B8=B2=E6=9F=93=E5=95=8F=E9=A1=8C=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.en.md | 596 +++++++++++++++++++++++++++ README.md | 145 ++++--- dist/PDQuickUI.js | 2 +- dist/PDQuickUI.module.js | 2 +- index.html | 21 +- package.json | 2 +- src/*.ts | Bin 6348 -> 6155 bytes src/PDQuickUI.js | Bin 53161 -> 59368 bytes src/function/check200.ts | Bin 1378 -> 1390 bytes src/function/createReactiveObject.ts | Bin 0 -> 1207 bytes src/function/dateFormat.ts | Bin 1613 -> 1645 bytes src/function/getUniqueID.ts | Bin 467 -> 469 bytes src/interface.ts | 10 +- src/listener/LazyloadListener.ts | Bin 1429 -> 1435 bytes src/listener/SVGListener.ts | Bin 1653 -> 1665 bytes src/model.ts | Bin 36679 -> 42097 bytes static/js/index.js | 175 ++++++-- 17 files changed, 841 insertions(+), 112 deletions(-) create mode 100644 README.en.md create mode 100644 src/function/createReactiveObject.ts diff --git a/README.en.md b/README.en.md new file mode 100644 index 0000000..08f3031 --- /dev/null +++ b/README.en.md @@ -0,0 +1,596 @@ +# PDQuickUI (JavaScript Library) + +![](https://img.shields.io/badge/tag-JavaScript%20Library-bb4444) ![](https://img.shields.io/github/size/pardnchiu/PDQuickUI/dist%2FPDQuickUI.js)
+[![](https://img.shields.io/github/v/release/pardnchiu/PDQuickUI)](https://github.com/pardnchiu/PDQuickUI) [![](https://img.shields.io/npm/v/pdquickui)](https://www.npmjs.com/package/pdquickui) ![](https://img.shields.io/github/license/pardnchiu/PDQuickUI)
+[![](https://img.shields.io/badge/read-English%20Version-ffffff)](https://github.com/pardnchiu/PDQuickUI/blob/main/README.md) + +`PDQuickUI` is a front-end rendering framework derived from [PDRenderKit](https://github.com/pardnchiu/PDRenderKit), focusing on enhancing front-end framework features.
+By integrating a virtual DOM, it rewrites the rendering logic to improve rendering efficiency, enabling faster data observation and automatic updates.
+ +This project removes the `prototype` extensions from `PDRenderKit` to ensure compatibility and performance, making it suitable for complex applications.
+It provides both `module` and non-`module` versions and changes the license from `GPL-3.0` in `PDRenderKit` to `MIT`. + +## Features + +- **Clear Architecture**: Separates UI from data logic, making it easier to maintain. +- **Code Simplicity**: Reduces redundant code and enhances readability. +- **Automatic Rendering**: Monitors data changes and updates automatically, minimizing manual operations. +- **Lightweight**: Maintains full functionality within a file size of less than `20kb`. + +## Installation + +- **Install from npm** + ```bash + npm i pdquickui + ``` +- **Include from CDN** + - **Directly include `PDQuickUI`** + ```html + + ``` + - **Module Version** + ```javascript + import { QUI } from "https://cdn.jsdelivr.net/npm/pdquickui@[VERSION]/dist/PDQuickUI.module.js"; + ``` + +## Features Overview +Automatic Rendering: Automatically reloads when data changes are detected. + +
+Attributes Overview + +| Attribute | Description | +| --- | --- | +| `{{value}}` | Inserts text into an HTML tag and updates automatically when data changes. | +| `:path` | Used with the `temp` tag to load an external HTML fragment into the current page. | +| `:html` | Replaces an element’s `innerHTML` with specified text. | +| `:for` | Supports formats like `item in items`, `(item, index) in items`, `(key, value) in object`. Iterates over data collections to generate corresponding HTML elements. | +| `:if`
`:else-if`
`:elif`
`:else` | Displays or hides elements based on specified conditions, enabling branching logic. | +| `:model` | Binds data to form elements (e.g., `input`), updating data automatically when input changes. | +| `:hide` | Hides elements based on specific conditions. | +| `:[attr]` | Sets element attributes, such as `ID`, `class`, image source, etc.
Examples: `:id`/`:class`/`:src`/`:alt`/`:href`... | +| `@[event]` | Adds event listeners that trigger specified actions upon activation.
Examples: `@click`/`@input`/`@mousedown`... | +| `:@[event]` | Sets event handlers for individual elements within loops, allowing different handlers for each element. | + +
+ +
+Attribute {{value}} + +- index.html + ```HTML +

{{ title }}

+ + ``` +- Result + ```HTML + +

test

+ + ``` + +
+ +
+Attribute :html + +- index.html + ```HTML +
+ + ``` +- Result + ```HTML + +
+ innerHtml +
+ + ``` + +
+ +
+Attribute :path + +*Ensure to disable local file restrictions in your browser or use a live server when testing.* + +- test.html + ```html +

path heading

+

path content

+ ``` +- index.html + ```html + + + + + ``` +- Result + ```html + + +

path heading

+

path content

+ + ``` + +
+ +
+Attribute :for + +- index.html + ```html + + + + + ``` +- Result + ```html + +
  • test1 1
    • +
  • test2 2
    • +
  • test3 3
    • + + ``` + +
    + +
    +Multi-layer :for Nesting + +- index.html + ```html + + + + + ``` +- Result + ```html + + + + ``` + +
    + +
    +Attribute :if/:else-if/:elif/:else + +- index.html + ```html + +

    {{ title }} {{ heading }}

    +

    {{ title }} {{ heading }}

    +

    {{ title }} {{ heading }}

    +

    {{ title }} {{ heading }}

    + + + ``` +- Result: `heading = 1` + ```html + +

    test 1

    + + ``` +- Result: `heading = null && isH2 = true` + ```html + +

    test

    + + ``` +- Result: `heading = 3 && isH2 = null` + ```html + +

    test 3

    + + ``` +- Result: `heading = null && isH2 = null` + ```html + +

    test

    + + ``` + +
    + +
    +Attribute :model + +- index.html + ```html + + + + + + ``` + +
    + +
    +Attribute @[event] + +- index.html + ```html + + + + + ``` + +
    + +
    +Quick CSS Setup + +`:padding`, `:margin`, `:border`, `:border-radius`, `:outline`, `:box-shadow`, `:bg-image`, `:bg-attachment`, `:bg-blend-mode`, `:bg-clip`, `:bg-origin`, `:bg-position`, `:bg-position-x`, `:bg-position-y`, `:bg-repeat`, `:bg-size`, `:bg-color`, `:color` + +
    + +
    +Available Functions + +- `LENGTH()`: + - index.html + ```HTML + +

    Total: {{ LENGTH(array) }}

    + + + ``` + - result + ```HTML + +

    Total: 4

    + + ``` +- `CALC()`: + - index.html + ```HTML + +

    calc: {{ CALC(num * 10) }}

    + + + ``` + - result + ```HTML + +

    calc: 10

    + + ``` +- `UPPER()` / `LOWER()` + - index.html + ```HTML + +

    {{ UPPER(test1) }} {{ LOWER(test2) }}

    + + + ``` + - result + ```HTML + +

    UPPER lower

    + + ``` +- `DATE(num, format)`: + - index.html + ```HTML + +

    {{ DATE(now, YYYY-MM-DD hh:mm:ss) }}

    + + + ``` + - result + ```HTML + +

    2024-08-17 03:40:47

    + + ``` + +
    + +
    +Data Retrieval + +```html + + + + + +``` + +
    + +
    +Lifecycle Hooks + +```html + + +``` + +
    + +
    +Optional Settings + +- test.svg + ```XML + + + + + ``` +- index.html + ```html + + + + + + + + ``` +- result + ```html + + + + + + + + + + ``` + +
    + +## Creator + + + +

    邱敬幃 Pardn Chiu

    + +[![](https://pardn.io/image/mail.svg)](mailto:dev@pardn.io) [![](https://skillicons.dev/icons?i=linkedin)](https://linkedin.com/in/pardnchiu) + +## License + +This project is licensed under the [MIT License](https://github.com/pardnchiu/PDMarkdownKit/blob/main/LICENSE). + +*** + +©️ 2024 [邱敬幃 Pardn Chiu](https://www.linkedin.com/in/pardnchiu) + +*** + +Translate by ChatGPT 4o. \ No newline at end of file diff --git a/README.md b/README.md index b9d0fe3..62b7442 100644 --- a/README.md +++ b/README.md @@ -1,22 +1,23 @@ # PDQuickUI (JavaScript Library) -![](https://img.shields.io/badge/tag-JavaScript%20Library-bb4444) ![](https://img.shields.io/github/license/pardnchiu/PDQuickUI?color=44bb44) ![](https://img.shields.io/badge/creator-Pardn%20Chiu-4444bb)
    -![](https://img.shields.io/github/v/release/pardnchiu/PDQuickUI?color=bbbb44) ![](https://img.shields.io/npm/v/pdquickui?color=44bbbb) ![](https://img.shields.io/github/size/pardnchiu/PDQuickUI/dist%2FPDQuickUI.js?color=bb44bb)
    -[![](https://img.shields.io/badge/read-English%20Version-ffffff)](https://github.com/pardnchiu/PDQuickUI/blob/main/README.md) +![](https://img.shields.io/badge/tag-JavaScript%20Library-bb4444) ![](https://img.shields.io/github/size/pardnchiu/PDQuickUI/dist%2FPDQuickUI.js)
    +[![](https://img.shields.io/github/v/release/pardnchiu/PDQuickUI)](https://github.com/pardnchiu/PDQuickUI) [![](https://img.shields.io/npm/v/pdquickui)](https://www.npmjs.com/package/pdquickui) ![](https://img.shields.io/github/license/pardnchiu/PDQuickUI)
    +[![](https://img.shields.io/badge/read-English%20Version-ffffff)](https://github.com/pardnchiu/PDQuickUI/blob/main/README.en.md) -`PDQuickUI` 是從 [PDRenderKit](https://github.com/pardnchiu/PDRenderKit) 中獨立出來的前端渲染框架。
    -專注於前端框架功能的擴展。引入虛擬 DOM 概念進行重寫，提升了渲染的性能，以及更高效的數據監聽和自動更新。
    -此專案也移除了 `PDRenderKit` 中針對 `prototype` 擴展，確保兼容性與性能，適合複雜的應用場景。
    -提供 `module` 和非 `module` 版本，並將授權從 `PDRenderKit` 的 `GPL-3.0` 改為 `MIT`。 +`PDQuickUI` 是從 [PDRenderKit](https://github.com/pardnchiu/PDRenderKit) 中獨立出來的前端渲染框架，專注於強化前端框架功能。
    +透過引入虛擬 DOM 重寫渲染邏輯，提升渲染效能，並實現更高效的數據監聽和自動更新。
    + +本專案移除了 `PDRenderKit` 中針對 `prototype` 的擴展，確保兼容性與效能，適合用於複雜的應用場景。
    +提供 `module` 和非 `module` 版本，授權從 `PDRenderKit` 的 `GPL-3.0` 更改為 `MIT`。
    ## 特點 -- **清晰的結構**：UI 和資料邏輯分離，方便維護。 -- **代碼簡潔性**：減少重複代碼，提高可讀性。 -- **自動渲染**：監聽資料變更並自動更新，減少手動操作。 -- **輕量化**：實現功能的同時檔案大小也保持在 `20kb` 以內。 +- **清晰的架構**：UI 和資料邏輯分離，維護方便。 +- **代碼簡潔**：減少重複代碼，提升可讀性。 +- **自動渲染**：監控資料變動並自動更新，減少手動操作。 +- **輕量化**：功能完整的同時，文件大小控制在 `20kb` 以內。 -## 使用方法 +## 安裝方式 - **從 npm 安裝** ```bash @@ -33,28 +34,28 @@ ``` ## 功能介紹 -自動渲染：加載自動渲染並在檢測到資料變更後自動渲染。 +自動渲染：加載自動渲染在檢測到資料變更時自動重新渲染。
    -參數概覽 +屬性概覽 -| tag | description | +| 屬性 | 描述 | | --- | --- | -| {{value}} | 將文字插入到 HTML 標籤中，並根據資料變更更新值。 | -| :path | 將外部文件中的 HTML 片段加載到當前頁面。 | -| :html | 使用文字替換元素的 innerHTML。 | -| :for | 支持 item in items、(item, index) in items、(key, value) in object。
    遍歷數據集合，為重複數據顯示生成相應的 HTML 元素。 | -| :if
    :else-if
    :elif
    :else | 根據指定條件顯示或隱藏元素，為實現分支邏輯添加多種選項。 | -| :model | 將資料綁定到表單元素（如 input），當輸入更改時自動更新資料。 | -| :hide | 隱藏元素，根據特定條件顯示它們。 | -| :[attr] | 設定元素屬性，例如 ID、class、圖像來源等。
    例如：:id/:class/:src/:alt/:href... | -| @[event] | 添加事件監聽器，當事件觸發時執行指定操作。
    例如：@click/@input/@mousedown... | -| :@[event] | 為迴圈內的單個元素設置事件處理程序，允許為每個元素設置不同的事件處理。 | +| `{{value}}` | 將文字插入到 HTML 標籤中，並隨資料變更自動更新。 | +| `:path` | 搭配 `temp` 標籤，用於將外部文件中的 HTML 片段加載到當前頁面。 | +| `:html` | 使用文本替換元素的 `innerHTML`。 | +| `:for` | 支援 `item in items`、`(item, index) in items`、`(key, value) in object` 格式，遍歷資料集合，生成對應的 HTML 元素。 | +| `:if`
    `:else-if`
    `:elif`
    `:else` | 根據條件顯示或隱藏元素，實現分支邏輯。 | +| `:model` | 將資料綁定到表單元素（如 `input`），當輸入變更時自動更新資料。 | +| `:hide` | 根據特定條件隱藏元素。 | +| `:[attr]` | 設定元素屬性，例如 `ID`、`class`、圖像來源等。
    範例：`:id`、`:class`、`:src`、`:alt`、`:href`... | +| `@[event]` | 添加事件監聽器，當事件觸發時執行指定操作。
    範例：`@click`、`@input`、`@mousedown`... | +| `:@[event]` | 用於 `:for` 內單個元素的事件處理，允許每個元素設置不同的事件處理。 |
    -{{value}} +屬性 {{value}} - index.html ```HTML @@ -79,7 +80,7 @@
    -:html +屬性 :html - index.html ```HTML @@ -106,7 +107,7 @@
    -:path +屬性 :path *確保測試時已禁用瀏覽器中的本地文件限制或使用實時服務器。* @@ -118,7 +119,7 @@ - index.html ```html -
    + @@ -474,25 +476,7 @@
    -Listerner - -```html - - -``` - -
    - -
    -資料獲取 +資料獲取 ```html @@ -519,7 +503,7 @@
    -渲染狀態 +生命週期 ```html @@ -546,6 +530,53 @@
    +
    +可選設定 + +- test.svg + ```XML + + + + + ``` +- index.html + ```html + + + + + + + + ``` +- result + ```html + + + + + + + + + + ``` + +
    + ## 開發者 diff --git a/dist/PDQuickUI.js b/dist/PDQuickUI.js index 4240c45..29e7235 100644 --- a/dist/PDQuickUI.js +++ b/dist/PDQuickUI.js @@ -1 +1 @@ -!function(){"use strict";const e=document,t=String,n=Number,r=Array,i=Object,o=Boolean,s=Date,a=parseInt,l=isNaN,c=/\{\{\s*(((CALC|LENGTH|UPPER|LOWER|DATE)\(\s*[\w\.\s\+\-\*\/\,\s\/\:]+\s*\))|[\w\.]+)\s*\}\}/i,d=(new RegExp(c,"gi"),/\s+([\w\.]+)\s*$/i),u=/\s*[\!\>\<\=]+\=*\s*/,f=/([\w\.]+)\s*([\+\-\*\/\%])\s*([\d\.]+)/,h=":if",p=":else-if",g=":elif",m=":else",b="startsWith",y="children",E="parentElement",v="toLowerCase",k="dismiss",w="getElementById",O="data",N="event",P="trim",C="src",D="split",_="id",T="isArray",A="indexOf",M="style",x="innerHTML",L="forEach",S="replace",R="value",H="body",I="length",V="match",Y="shift",B="addEventListener",$="type",J="props",z="display",j="vdom",U="appendChild",X="createTextNode",F="removeAttribute",W="keys",q="parentNode",G="setAttribute",K={[h]:null,[p]:null,[g]:null,[m]:null},Q={":id":"id",":src":"src",":alt":"alt",":href":"href",":html":"innerHTML"},Z={":margin":"margin",":padding":"padding",":border":"border",":border-radius":"borderRadius",":borderRadius":"borderRadius",":outline":"outline",":box-sahdow":"boxShadow",":boxSahdow":"boxShadow",":bg-image":"backgroundImage",":backgroundImage":"backgroundImage",":bg-attachment":"backgroundAttachment",":backgroundAttachment":"backgroundAttachment",":bg-blend-mode":"backgroundBlendMode",":backgroundBlendMode":"backgroundBlendMode",":bg-clip":"backgroundClip",":backgroundClip":"backgroundClip",":bg-origin":"backgroundOrigin",":backgroundOrigin":"backgroundOrigin",":bg-position":"backgroundPosition",":backgroundPosition":"backgroundPosition",":bg-position-x":"backgroundPositionX",":backgroundPositionX":"backgroundPositionX",":bg-position-y":"backgroundPositionY",":backgroundPositionY":"backgroundPositionY",":bg-repeat":"backgroundRepeat",":backgroundRepeat":"backgroundRepeat",":bg-size":"backgroundSize",":backgroundSize":"backgroundSize",":bg-color":"backgroundColor",":backgroundColor":"backgroundColor",":color":"color"},ee={create:"CREATE",append:"APPEND",replace:"REPLACE",text:"TEXT",prop:"PROP",remove:"REMOVE"},te="index",ne="元件不存在。";function re(e,t,n){return new Proxy(e,{get(e,r,i){const o=Reflect.get(e,r,i),s=t?`${t}.${r.toString()}`:r.toString();return"object"==typeof o&&null!==o?re(o,s,n):o},set(e,r,i,o){const s=e[r],a=Reflect.set(e,r,i,o),l=t?`${t}.${r.toString()}`:r.toString();return s!==i&&n(l,i,s),a}})}async function ie(e,t=!1){return new Promise((async(n,r)=>{try{const i=await fetch(e);if(i.ok){const e=i.headers.get("Content-Type");if(e&&e[b]("image")){if("image/svg+xml"==e&&!t)return void n(i);const o=await i.blob(),s=new Image,a=URL.createObjectURL(o);s[C]=a,s.crossOrigin="anonymous",s.onload=e=>n({src:a,img:s}),s.onerror=e=>{URL.revokeObjectURL(a),r(e)}}else n(i)}else r(new Error(`HTTP error! status: ${i.status}`))}catch(e){r(e)}}))}window.QUI=class{body;data;event;done={};#e=!0;#t;#n;#r;#i;#o=new Map;#s=!1;#a=null;#l;#c;#d;#u;constructor(n={}){if(t(n[_]||"")[I]<1)return;const r=e[w](n[_]);if(null==r)return;this.#d=r.cloneNode(!0),this[H]=r,this[O]=re(n[O]||{},"",(async()=>{this.#t=Date.now(),null!=this.#c&&!1===await this.#f(this.#c)||(this.#h(),null==this.#i||this.#p(this.#i))})),this[N]=n[N]||{};const i=n.listener||{};!1!==i.svg&&function(){if(null!=ae)return;le=new IntersectionObserver((e=>{e.forEach((e=>{if(!e.isIntersecting)return;const t=e.target,n=(t.getAttribute("src")||"")[P]();n[I]<1||ie(n).then((e=>{le.unobserve(t),e.text().then((e=>{const n=de("div");n.innerHTML=e;const r=n[y][0];r.id=t.id,t.classList[L]((e=>r.classList.add(e))),r.onclick=t.onclick,null!=t[E]&&t[E].insertBefore(r,t),t.remove()})).catch((e=>{t.innerHTML="☒"}))})).catch((e=>{le.unobserve(t),t.innerHTML="☒"}))}))})),[].slice.call(document.body.querySelectorAll("temp-svg[src]:not([src=''])")||[])[L]((e=>le.observe(e)))}(),!1!==i.lazyload&&function(){if(null!=oe)return;se=new IntersectionObserver(((e,t)=>{e[L]((e=>{const t=e.target;if(e.isIntersecting){t.parentElement;const e=t.getAttribute("lazyload")||"";if(e[I]<1)return;t.removeAttribute("lazyload"),delete t.dataset[C],ie(e,!0).then((e=>{se.unobserve(t),t[C]=e[C]})).catch((e=>{se.unobserve(t),t[C]="https://cdn.jsdelivr.net/gh/pardnchiu/PDRenderKit@latest/static/image/404.svg"}))}}))})),[].slice.call(document.body.querySelectorAll("img[lazyload]:not([lazyload=''])")||[])[L]((e=>se.observe(e)))}(),this.#l=n.before_render||void 0,this.#r=n.rendered||void 0,this.#c=n.before_update||void 0,this.#i=n.updated||void 0,this.#a=this.#g(this.#d),(async()=>{this.#t=Date.now(),null!=this.#l&&!1===await this.#f(this.#l)||(this.#h(),null==this.#r||this.#p(this.#r))})()}async#h(){this.#u=this.#g(this.#d),this.#m(this.#u),await this.#b(this.#u),this.#y(this.#u),this.#E(this.#u),this.#n=s.now()-this.#t,console.log("耗時:",this.#n/1e3)}async#f(e){return new Promise(((t,n)=>{t(!1!==e())}))}#p(e){e(!1)}#v(e,r){const s=e[y][r];if("string"==typeof s)return;const a=s[J]||{};if(i[W](a)[I]<1||null==a[h]||null!=(a[p]||a[g]||a[m]))return;let l=r+1,c=e[y][l],d=[r],f=!1;for(;null!=c&&"string"!=typeof c&&!f;){if(d.push(l),l+=1,c=e[y][l],null==c||"string"==typeof c){f=!0;continue}const t=c[J]||{};f=null==(t[p]||t[g]||t[m])}let b=!1;for(let r of d){const i=e[y][r];if(null==i||"string"==typeof i)return;const s=i[J][h]||i[J][p]||i[J][g],a=null!=i[J][m];if(b||!b&&a)i[k]=!0;else if(null!=s){const e=s[D](u)[0],r=s[D](u)[1],a=((s[V](u)||[])[0]||"")[P](),l=this.#k(e,i.data);null==r&&a[I]<1?b=o(l):">"===a?b=(n(l)||0)>(n(r)||0):"<"===a?b=(n(l)||0)<(n(r)||0):">="===a||">=="===a?b=(n(l)||0)>=(n(r)||0):"<="===a||"<=="===a?b=(n(l)||0)<=(n(r)||0):"=="===a||"==="===a?b="null"==r?null==l:"true"==r?o(l):"false"==r?!o(l):"empty"==r?t(l||"")[I]<1:t(l||"")==t(r):"!="!==a&&"!=="!==a||(b="null"==r?null!=l:"true"==r?!o(l):"false"==r?o(l):"empty"==r?t(l||"")[I]>0:t(l||"")!=t(r)),i[k]=!b}}}#w(e,t,n,r){const i=this.#k(n,r.data)||n,s=(Q[t[v]()]||"")[P](),c=(Z[t[v]()]||"")[P]();if(e[M][z]=r[k]?"none":"",":lazyload"===t[v]()&&n[P]()[I]>0&&se.observe(e),":for"===t[v]());else if(":src"===t[v]()&&"temp-svg"===r.tag[v]()&&n[P]()[I]>0){const t=this.#k(n,r.data)||n;e.setAttribute(C,t),le.observe(e)}else t[v]()in K||(t[v]()in Q?e[s]=i:t[v]()in Z?e[M][c]=i:":hide"===t[v]()&&o(l(a(i))?i:a(i))?e[M][z]="none":i[I]>0&&e[G](`${t[S](/^:/,"")}`,i));e[F](t)}#O(e,t,n,r){(()=>{if(!1===t[b]("@"))return;const r=t[S](/^\@/,"on"),i=this[N][n];e[r]=i})(),(()=>{if(!1===t[b](":@"))return;const i=t[S](/^\:\@/,"on"),o=this.#k(n,r.data),s=this[N][o];e[i]=s})()}#k(e,n){if(String(e)[P]()[I]<1)return;const o=c.test(e);let s="",l="";o&&(s=e[D](c)[0]||"",l=e[D](c)[4]||"",e=e[V](c)[1]);const d=/^LENGTH\(.+\)/.test(e);d&&(e=e[S](/^LENGTH\(|\)$/g,""));const u=/^CALC\(.*\)$/.test(e);let h="",p=0;if(u){const t=(e=e[S](/^CALC\(|\)$/g,""))[V](f);e=t[1],h=t[2],p=a(t[3])||0}const g=/^UPPER\(.*\)$/.test(e),m=/^LOWER\(.*\)$/.test(e);(g||m)&&(e=e[S](/^(UPPER|LOWER)\(|\)$/g,""));const b=/^DATE\([\w\,\-\s\:]*\)$/.test(e);let y="";if(b){const t=(e=e[S](/^DATE\(|\)$/g,""))[V](/(\w+),\s*([^\n]+)/);e=t[1],y=t[2]}let E=e[D](/\./),k=n||this[O],w=E[0],N=k[w];if(E[Y](),null==N)return;for(;E[I]>0;)k=N,w=E[0],N=k[w],E[Y]();let C="";if(null!=N&&N instanceof Object&&!r[T](N)?C=t(i[W](N)[I]):null!=N&&(C=N[I]),o){if(d)return s+C+l;if(u&&(N=this.#N(N,h,p),null==N))return;return s+N+l}if(d)return C;if(u){if(N=this.#N(N,h,p),null==N)return}else{if(g)return N.toUpperCase();if(m)return N[v]();if(b)return function(e,n="yyyy/MM/DD (ddd) HH:mm:ss"){const r=new Date(1e3*e),i=t(r.getFullYear()),o=t(r.getMonth()+1),s=t(r.getDate()),a=t(r.getDay()),l=t(r.getHours()),c=t(r.getMinutes()),d=t(r.getSeconds()),u=t(r.getMilliseconds());let f={YYYY:i,yyyy:i,YY:i.slice(-2),yy:i.slice(-2),Y:i.slice(-2),y:i.slice(-2),M:o,MM:("0"+o).slice(-2),D:s,DD:("0"+s).slice(-2),d:a,dd:("0"+a).slice(-2),H:l,HH:("0"+l).slice(-2),h:t(parseInt(l)%12||12),hh:("0"+(parseInt(l)%12||12)).slice(-2),m:c,mm:("0"+c).slice(-2),s:d,ss:("0"+d).slice(-2),SSS:("00"+u).slice(-3),a:parseInt(l)>=12?"pm":"am",A:parseInt(l)>=12?"PM":"AM"};const h=/zh/.test(navigator.language||"")?["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];return f.ddd=h[parseInt(a)].slice(0,3),f.dddd=h[parseInt(a)],n.replace(/YYYY|YY|Y|yyyy|yy|y|MM|M|DD|D|HH|H|hh|h|mm|m|ss|s|SSS|a|A|ddd|dddd/g,(e=>f[e]))}(a(N),y)}return N}#P(e){console.log(e)}#g(e){return{tag:e.tagName[v](),props:(t=e,[...t.attributes].reduce(((e,t)=>(e[t.name]=t.value.trim(),e)),{})),children:ce(e).map((e=>e.nodeType===Node.ELEMENT_NODE?this.#g(e):(e.textContent||"")[P]())),data:null,dismiss:!1};var t}#E(t){const n=e[w](this[H][_]);if(null==n)return void this.#P(ne);const i=this.#C(this.#a,t);r[T](i)&&this.#D(n,i),this.#a=t}#C(e,t,n=[]){if(null==e&&t)return[{[$]:ee.create,[te]:n,[j]:t}];if(e&&!t)return[{[$]:ee.remove,[te]:n}];if(!e&&!t)return[];if(e.tag!==t.tag)return[{[$]:ee[S],[te]:n,[j]:t}];const r=[];return r.push(...this.#_(e,t,n)),r.push(...this.#T(e,t,n)),r}#_(e,t,n=[]){if(null==e||"string"==typeof e||null==t||"string"==typeof t)return[];const r=[],o=e[J],s=i[W](o)[I],a=t[J],l=i[W](a)[I];if(null!=a)for(let e in a){const i=a[e];r.push({[$]:ee.prop,[j]:t,key:e,value:i,[te]:n})}if(s>0){if(l<1)for(let e in o)r.push({[$]:"PROP",[j]:t,key:e,value:null,index:n});for(let e in a)l>0&&!(e in a)&&r.push({[$]:"PROP",[j]:t,key:e,value:null,index:n})}return r}#T(e,t,n=[]){if(null==e||"string"==typeof e||null==t||"string"==typeof t)return[];const i=[],o=r[T](e[y])?e[y]:[],s=r[T](t[y])?t[y]:[],a=Math.max(o[I],s[I]);for(let e=0;e"REMOVE"===e.type)).sort(((e,t)=>(t.index?.length||0)-(e.index?.length||0)));for(const e of s)if(e.index){const t=this.#A(o,e.index);t&&t[q]&&t[q].removeChild(t)}for(let t of n){let n,{index:r}=t,s=JSON.parse(JSON.stringify(r||[]));t.type===ee.append&&(n=s?.pop());const a=s?this.#A(o,s):o;if(a)switch(t.type){case"CREATE":if(t.vdom){const n="string"==typeof t.vdom?e[X](t.vdom):this.#M(t.vdom);if(null==a[E])continue;a[E][U](n)}break;case"REPLACE":if(t.vdom&&a[q]){const e=this.#M(t.vdom);a[q].replaceChild(e,a)}break;case"TEXT":a&&(a.textContent=t.value);break;case"PROP":a instanceof Element&&this.#x(a,t.key,t.value||"",t.vdom);break;case"APPEND":if(t.vdom&&null!=n){const r="string"==typeof t.vdom?e[X](t.vdom):this.#M(t.vdom);if(n+1>a[y][I]?a[U](r):a.insertBefore(r,a[y][n+1]),"string"==typeof t.vdom)continue;for(const[e,r]of i.entries(t.vdom[J]))this.#x(a[y][n],e,r||"",t.vdom)}}}}#A(e,t){let n=e,i=r.from(n.childNodes).filter((e=>e.nodeType===Node.ELEMENT_NODE||e.nodeType===Node.TEXT_NODE&&""!==e.textContent?.trim()))||[];for(const e of t)n=i[e],null!=n&&(i=r.from(n.childNodes).filter((e=>e.nodeType===Node.ELEMENT_NODE||e.nodeType===Node.TEXT_NODE&&""!==e.textContent?.trim()))||[]);return n}#M(t){const n=e.createElement(t.tag);if(t[J])for(const[e,r]of i.entries(t[J]))e[b](":")||e[b]("@")||void 0!==r&&n[G](e,r);for(const r of t[y])if("string"==typeof r)n[U](e[X](r));else{if(!0===r[k])continue;n[U](this.#M(r))}return n}#x(t,n,r,i){if(null==r)t[F](n);else if(n[b](":@")||n[b]("@"))this.#O(t,n,r,i),t[F](n);else if(n.toLocaleLowerCase()[b](":model")){if(!/(input|select|textarea)/i.test(t.tagName))return;const i=t instanceof HTMLInputElement,o=t instanceof HTMLTextAreaElement,s=t instanceof HTMLSelectElement,a=t.getAttribute("type");!i||"checkbox"!==a&&"radio"!==a?s?t[B]("change",(e=>{this[O][r]=e.target[R]||""})):(i||o)&&(t[B]("keyup",(e=>{this[O][r]=e.target[R]||""})),t[B]("change",(e=>{this[O][r]=e.target[R]||""}))):t[B]("change",(t=>{this[O][r]=[...e.body.querySelectorAll("input[name='"+t.target.name+"'][type='"+a+"']:checked")].map((e=>e.value)).join(",")})),t[F](n)}else n[b](":")?this.#w(t,n,r,i):t[G](n,r)}#y(e){let t=0;for(;t{const r=await n.text(),i=de("div",r)?.cloneNode(!0),o=this.#g(i);e[y].splice(t,1,...o[y]),t+=o[y][I]-2})),t++}}#N(e,t,r){return e=n(e),r=n(r),l(e)||l(r)?void 0:"+"===t?e+r:"-"===t?e-r:"*"===t?e*r:"/"===t?e/r:"%"===t?e%r:e}};let oe,se,ae,le;new Map;function ce(e){return r.from(e.childNodes).filter((e=>e.nodeType===Node.ELEMENT_NODE||e.nodeType===Node.TEXT_NODE&&e.textContent&&e.textContent.trim().length>0))}function de(n="",i,o){const s=/\.([\w_-]+)?/gi,a=((n[V](/^\w+(?=[\#\.]*)/i)||[])[0]||"")[P](),l=((n[V](/\#([\w_-]+)?/i)||[])[1]||"")[P](),c=(s.test(n)&&n.match(s)||[]).map((e=>e.replace(/^\./,"")));if(a[I]<1)return;let d,u,f,h=!1;"temp"===n?(h=!0,d=e.createDocumentFragment()):d=e.createElement(a),l[I]&&(d.id=l);for(let e of c)d.classList.add(e);if(null==i&&null!=o&&([i,o]=[o,null]),null!=i&&null!=o)[u,f]=[i,o];else if(null==o)"string"==typeof i||"number"==typeof i||r[T](i)?f=i:u=i;else if(null==i)return d;if("object"==typeof u&&null!=u)for(const e in u){if(!u.hasOwnProperty(e))continue;const t=u[e];-1!=["value","innerText",x,"textContent","contentEditable"][A](e)?d[e]=t:-1!=["color","backgroundColor","width","height","display","float"][A](e)?d.style[e]=t:null!=t&&d[G](e,t)}if(null!=f){const n="string"==typeof f,i="number"==typeof f,o=r[T](f);if(n||i){const t=f;"img"===a||"source"===a?d.src=t:h?d[U](e[X](f)):d[x]=t}else if(o)for(let n of f){const r=n instanceof Element;"string"==typeof n||"number"==typeof n?h?d[U](e[X](t(n))):d[x]+=n:r&&d[U](n)}}return d}}("undefined"==typeof window?window={}:window); \ No newline at end of file +!function(){"use strict";const e=document,t=String,n=Number,o=Array,i=Object,r=Boolean,a=JSON,s=URL,l=Date,d=Math,c=Promise,u=Node,f=parseInt,p=isNaN,g=structuredClone,h=/\{\{\s*(((CALC|LENGTH|UPPER|LOWER|DATE)\(\s*[\w\.\s\+\-\*\/\,\s\/\:]+\s*\))|[\w\.]+)\s*\}\}/i,b=/\s+([\w\.]+)\s*$/i,m=/\s*[\!\>\<\=]+\=*\s*/,y=/([\w\.]+)\s*([\+\-\*\/\%])\s*([\d\.]+)/,k=":path",v=":for",C=":if",E=":else-if",w=":elif",P=":else",A="push",T="splice",D="head",M="startsWith",O="children",x="parentElement",L="textContent",N="toLowerCase",R="dismiss",S="getElementById",B="test",H="data",Y="event",_="trim",$="parse",I="src",V="split",z="isArray",U="indexOf",j="type",F="props",X="display",W="vdom",q="appendChild",G="createTextNode",J="removeAttribute",K="keys",Q="parentNode",Z="setAttribute",ee="addEventListener",te="TEXT_NODE",ne="ELEMENT_NODE",oe="headers",ie="get",re="crossOrigin",ae="anonymous",se="slice",le="unobserve",de="script",ce="tagName",ue="tag",fe="stringify",pe="id",ge="style",he="innerHTML",be="forEach",me="replace",ye="value",ke="body",ve="length",Ce="match",Ee="shift",we="index",Pe={[C]:null,[E]:null,[w]:null,[P]:null},Ae={":id":"id",":src":I,":alt":"alt",":href":"href",tagHtml:"innerHTML"},Te={":margin":"margin",":padding":"padding",":border":"border",":border-radius":"borderRadius",":borderRadius":"borderRadius",":outline":"outline",":box-sahdow":"boxShadow",":boxSahdow":"boxShadow",":bg-image":"backgroundImage",":background-image":"backgroundImage",":backgroundImage":"backgroundImage",":bg-attachment":"backgroundAttachment",":background-attachment":"backgroundAttachment",":backgroundAttachment":"backgroundAttachment",":bg-blend-mode":"backgroundBlendMode",":background-blend-mode":"backgroundBlendMode",":backgroundBlendMode":"backgroundBlendMode",":bg-clip":"backgroundClip",":background-clip":"backgroundClip",":backgroundClip":"backgroundClip",":bg-origin":"backgroundOrigin",":background-origin":"backgroundOrigin",":backgroundOrigin":"backgroundOrigin",":bg-position":"backgroundPosition",":background-position":"backgroundPosition",":backgroundPosition":"backgroundPosition",":bg-position-x":"backgroundPositionX",":background-position-x":"backgroundPositionX",":backgroundPositionX":"backgroundPositionX",":bg-position-y":"backgroundPositionY",":background-position-y":"backgroundPositionY",":backgroundPositionY":"backgroundPositionY",":bg-repeat":"backgroundRepeat",":background-repeat":"backgroundRepeat",":backgroundRepeat":"backgroundRepeat",":bg-size":"backgroundSize",":background-size":"backgroundSize",":backgroundSize":"backgroundSize",":bg-color":"backgroundColor",":background-color":"backgroundColor",":backgroundColor":"backgroundColor",":color":"color"},De={create:"CREATE",append:"APPEND",replace:"REPLACE",text:"TEXT",prop:"PROP",remove:"REMOVE"},Me="ID: 未提供",Oe="元素: 不存在。";async function xe(e,t=!1){return new c((async(n,o)=>{try{const i=await fetch(e);if(i.ok){const e=i[oe][ie]("Content-Type");if(e&&e[M]("image")){if("image/svg+xml"==e&&!t)return void n(i);const r=await i.blob(),a=new Image,l=s.createObjectURL(r);a[I]=l,a[re]=ae,a.onload=e=>n({[I]:l,img:a}),a.onerror=e=>{s.revokeObjectURL(l),o(e)}}else n(i)}else o(new Error(`HTTP error! status: ${i.status}`))}catch(e){o(e)}}))}function Le(e,t,n){return new Proxy(e,{get(e,o,i){const r=Reflect.get(e,o,i),a=t?`${t}.${o.toString()}`:o.toString();return"object"==typeof r&&null!==r?Le(r,a,n):r},set(e,o,i,r){const a=e[o],s=Reflect.set(e,o,i,r),l=t?`${t}.${o.toString()}`:o.toString();return a!==i&&n(l,i,a),s}})}window.QUI=class{body;data;event;done={};#e=!0;#t;#n;#o;#i=new Map;#r=!1;#a;#s;#l;#d;#c=null;#u=null;#f=null;constructor(n={}){if(t(n[pe]||"")[ve]<1)return void this.#p(Me);const o=e[S](n[pe]);if(null==o)return void this.#p(Oe);this.#c=this.#g(o),this[ke]=o,this[H]=Le(n[H]||{},"",(e=>{clearTimeout(this.#o),this.#o=setTimeout((async()=>{this.#t=l.now(),null!=this.#l&&!1===await this.#h(this.#l)||(this.#b(),null==this.#d||this.#m(this.#d))}),300)})),this[Y]=n[Y]||{};const i=n.option||{};!1!==i.svg&&function(){if(null!=Se)return;Be=new IntersectionObserver((e=>{e.forEach((e=>{if(!e.isIntersecting)return;const t=e.target,n=(t.getAttribute("src")||"")[_]();n[ve]<1||xe(n).then((e=>{Be[le](t),e.text().then((e=>{const n=Ye("div");n[he]=e;const o=n[O][0];o.id=t.id,t.classList[be]((e=>o.classList.add(e))),o.onclick=t.onclick,null!=t[x]&&t[x].insertBefore(o,t),t.remove()})).catch((e=>{t[he]="☒"}))})).catch((e=>{Be[le](t),t[he]="☒"}))}))})),[][se].call(document.body.querySelectorAll("temp-svg[src]:not([src=''])")||[])[be]((e=>Be.observe(e)))}(),!1!==i.lazyload&&function(){if(null!=Ne)return;Re=new IntersectionObserver(((e,t)=>{e[be]((e=>{const t=e.target;if(e.isIntersecting){t.parentElement;const e=t.getAttribute("lazyload")||"";if(e[ve]<1)return;t.removeAttribute("lazyload"),delete t.dataset[I],xe(e,!0).then((e=>{Re[le](t),t[I]=e[I]})).catch((e=>{Re[le](t),t[I]="https://cdn.jsdelivr.net/gh/pardnchiu/PDRenderKit@latest/static/image/404.svg"}))}}))})),[][se].call(document.body.querySelectorAll("img[lazyload]:not([lazyload=''])")||[])[be]((e=>Re.observe(e)))}(),this.#a=n.before_render||void 0,this.#s=n.rendered||void 0,this.#l=n.before_update||void 0,this.#d=n.updated||void 0,this.#f=g(this.#c),(async()=>{this.#t=l.now(),null!=this.#a&&!1===await this.#h(this.#a)||(this.#b(),null==this.#s||this.#m(this.#s))})()}#p(...t){const n=Ye(de,`console.log.apply(void 0, ${a[fe](t)});`);e.body[q](n),n.remove()}#g(t){if(t[ce][N]()===de){let n=!1;for(const o of e[D].querySelectorAll(de)||[])if(null!=t[I]&&o[I]===t[I]||null!=t[L]&&o[L]===t[L]){n=!0;break}return n||e[D][q](t),{[ue]:de,[F]:{},[O]:[],[H]:null,[R]:!1}}return{[ue]:t[ce][N](),[F]:(n=t,[...n.attributes].reduce(((e,t)=>(e[t.name]=t.value.trim(),e)),{})),[O]:He(t).map((e=>e.nodeType===Node[ne]?this.#g(e):(e[L]||"")[_]())),[H]:null,[R]:!1};var n}async#b(){this.#u=g(this.#c),null!=this.#u&&(this.#y(this.#u),await this.#k(this.#u),this.#v(this.#u),this.#C(this.#u),this.#n=l.now()-this.#t,this.#p("耗時:",this.#n/1e3))}#y(e){let t=0;for(;t"===s?f=(n(l)||0)>(n(o)||0):"<"===s?f=(n(l)||0)<(n(o)||0):">="===s||">=="===s?f=(n(l)||0)>=(n(o)||0):"<="===s||"<=="===s?f=(n(l)||0)<=(n(o)||0):"=="===s||"==="===s?f="null"==o?null==l:"true"==o?r(l):"false"==o?!r(l):"empty"==o?t(l||"")[ve]<1:t(l||"")==t(o):"!="!==s&&"!=="!==s||(f="null"==o?null!=l:"true"==o?!r(l):"false"==o?r(l):"empty"==o?t(l||"")[ve]>0:t(l||"")!=t(o)),i[R]=!f}}}async#k(e){let t=0;for(;t{const o=Ye("div",await n.text()).cloneNode(!0),i=this.#g(o);e[O][T](t,1,...i[O]),t+=i[O][ve]-2})),t++}}#v(e){let t=0;for(;t0)for(let e in s){const i=s[e];o[A]({[j]:De.prop,[W]:t,key:e,value:i,[we]:n})}if(a>0){if(l<1)for(let e in r)o[A]({[j]:De.prop,[W]:t,key:e,[ye]:null,[we]:n});for(let e in s)l>0&&!(e in s)&&o[A]({[j]:De.prop,[W]:t,key:e,[ye]:null,[we]:n})}return o}#D(e,t,n=[]){if(null==e||"string"==typeof e||null==t||"string"==typeof t)return[];const i=[],r=o[z](e[O])?e[O]:[],a=o[z](t[O])?t[O]:[],s=d.max(r[ve],a[ve]);for(let e=0;e{const e=n.filter((e=>e.type===De.remove)).sort(((e,t)=>{const n=(t.index.length||0)-(e.index.length||0);if(0!==n)return n;for(let n=0;n<(e.index.length||0);n++)if((e.index[n]||0)!==(t.index[n]||0))return(t.index[n]||0)-(e.index[n]||0);return 0}));for(const n of e){const e=this.#M(t,n.index);null!=e&&null!=e[Q]&&e[Q].removeChild(e)}})();for(let o of n){let n,{index:r}=o,s=a[$](a[fe](r||[]));o.type===De.append&&(n=s?.pop());const l=s?this.#M(t,s):t;if(l)if(o.type===De.create&&W in o){const t="string"==typeof o.vdom?e[G](o.vdom):this.#O(o.vdom);if(null==l[x])continue;l[x][q](t)}else if(o.type===De.replace&&W in o&&null!=l[Q]&&"string"!=typeof o.vdom){const e=this.#O(o.vdom);l[Q].replaceChild(e,l)}else if(o.type===De.text&&ye in o&&null!=l)l[L]=o.value||"";else if(o.type===De.prop&&"key"in o&&l instanceof Element)this.#x(l,o.key,o.value||"",o.vdom);else if(o.type===De.append&&W in o&&null!=n){const t="string"==typeof o.vdom?e[G](o.vdom):this.#O(o.vdom);if(n+1>l[O][ve]?l[q](t):l.insertBefore(t,l[O][n+1]),"string"==typeof o.vdom)continue;for(const[e,t]of i.entries(o.vdom[F]))this.#x(l[O][n],e,t||"",o.vdom);this.updatePatchAppendChild(o.vdom,l[O][n])}}}}updatePatchAppendChild(e,t){if("string"!=typeof e)for(const n in e.children.filter((e=>"string"!=typeof e))){const o=e.children[+n],r=t.children[+n];if("string"!=typeof o){for(const[e,t]of i.entries(o[F]))this.#x(r,e,t||"",o);this.updatePatchAppendChild(o,r)}}}async#h(e){return new c(((t,n)=>{t(!1!==e())}))}#m(e){e(!1)}#L(e,t,n,o){const i=this.#E(n,o[H])||n,a=(Ae[t[N]()]||"")[_](),s=(Te[t[N]()]||"")[_]();if(e[ge][X]=o[R]?"none":"",":lazyload"===t[N]()&&n[_]()[ve]>0&&Re.observe(e),t[N]()===v);else if(":src"===t[N]()&&"temp-svg"===o.tag[N]()&&n[_]()[ve]>0){const t=this.#E(n,o[H])||n;e.setAttribute(I,t),Be.observe(e)}else t[N]()in Pe||(t[N]()in Ae?e[a]=i:t[N]()in Te?e[ge][s]=i:":hide"===t[N]()&&r(p(+i)?i:+i)?e[ge][X]="none":i[ve]>0&&e[Z](`${t[me](/^:/,"")}`,i));e[J](t)}#N(e,t,n,o){(()=>{if(!1===t[M]("@"))return;const o=t[me](/^\@/,"on"),i=this[Y][n];e[o]=i})(),(()=>{if(!1===t[M](":@"))return;const i=t[me](/^\:\@/,"on"),r=this.#E(n,o[H]),a=this[Y][r];e[i]=a})()}#E(e,n){if(String(e)[_]()[ve]<1)return;const r=h[B](e);let a="",s="";r&&(a=e[V](h)[0]||"",s=e[V](h)[4]||"",e=e[Ce](h)[1]);const l=/^LENGTH\(.+\)/[B](e);l&&(e=e[me](/^LENGTH\(|\)$/g,""));const d=/^CALC\(.*\)$/[B](e);let c="",u=0;if(d){const t=(e=e[me](/^CALC\(|\)$/g,""))[Ce](y);e=t[1],c=t[2],u=+t[3]||0}const p=/^UPPER\(.*\)$/[B](e),g=/^LOWER\(.*\)$/[B](e);(p||g)&&(e=e[me](/^(UPPER|LOWER)\(|\)$/g,""));const b=/^DATE\([\w\,\-\s\:]*\)$/[B](e);let m="";if(b){const t=(e=e[me](/^DATE\(|\)$/g,""))[Ce](/(\w+),\s*([^\n]+)/);e=t[1],m=t[2]}let k=e[V](/\./),v=n||this[H],C=k[0],E=v[C];if(k[Ee](),null==E)return;for(;k[ve]>0;)v=E,C=k[0],E=v[C],k[Ee]();let w="";if(null!=E&&E instanceof Object&&!o[z](E)?w=t(i[K](E)[ve]):null!=E&&(w=E[ve]),r){if(l)return a+w+s;if(d&&(E=this.#R(E,c,u),null==E))return;return a+E+s}if(l)return w;if(d){if(E=this.#R(E,c,u),null==E)return}else{if(p)return E.toUpperCase();if(g)return E[N]();if(b)return function(e,n="yyyy/MM/DD (ddd) HH:mm:ss"){const o=new Date(1e3*e),i=t(o.getFullYear()),r=t(o.getMonth()+1),a=t(o.getDate()),s=t(o.getDay()),l=t(o.getHours()),d=t(o.getMinutes()),c=t(o.getSeconds()),u=t(o.getMilliseconds());let p={YYYY:i,yyyy:i,YY:i[se](-2),yy:i[se](-2),Y:i[se](-2),y:i[se](-2),M:r,MM:("0"+r)[se](-2),D:a,DD:("0"+a)[se](-2),d:s,dd:("0"+s)[se](-2),H:l,HH:("0"+l)[se](-2),h:t(f(l)%12||12),hh:("0"+(f(l)%12||12))[se](-2),m:d,mm:("0"+d)[se](-2),s:c,ss:("0"+c)[se](-2),SSS:("00"+u)[se](-3),a:f(l)>=12?"pm":"am",A:f(l)>=12?"PM":"AM"};const g=/zh/.test(navigator.language||"")?["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];return p.ddd=g[f(s)][se](0,3),p.dddd=g[f(s)],n.replace(/YYYY|YY|Y|yyyy|yy|y|MM|M|DD|D|HH|H|hh|h|mm|m|ss|s|SSS|a|A|ddd|dddd/g,(e=>p[e]))}(+E,m)}return E}#M(e,t){let n=e,i=o.from(n.childNodes).filter((e=>e.nodeType===u[ne]||e.nodeType===u[te]&&""!==e[L]?.trim()))||[];for(const e of t)n=i[e],null!=n&&(i=o.from(n.childNodes).filter((e=>e.nodeType===u[ne]||e.nodeType===u[te]&&""!==e[L]?.trim()))||[]);return n}#O(t){const n=e.createElement(t.tag);if(t[F])for(const[e,o]of i.entries(t[F]))e[M](":")||e[M]("@")||void 0!==o&&n[Z](e,o);for(const o of t[O])if("string"==typeof o)n[q](e[G](o));else{if(!0===o[R])continue;n[q](this.#O(o))}return n}#x(t,n,o,i){if(null==o)t[J](n);else if(n[M](":@")||n[M]("@"))this.#N(t,n,o,i),t[J](n);else if(n.toLocaleLowerCase()[M](":model")){if(!/(input|select|textarea)/i[B](t[ce]))return;const i=t instanceof HTMLInputElement,r=t instanceof HTMLTextAreaElement,a=t instanceof HTMLSelectElement,s=t.getAttribute("type");!i||"checkbox"!==s&&"radio"!==s?a?t[ee]("change",(e=>{this[H][o]=e.target[ye]||""})):(i||r)&&(t[ee]("keyup",(e=>{this[H][o]=e.target[ye]||""})),t[ee]("change",(e=>{this[H][o]=e.target[ye]||""}))):t[ee]("change",(t=>{this[H][o]=[...e.body.querySelectorAll("input[name='"+t.target.name+"'][type='"+s+"']:checked")].map((e=>e.value)).join(",")})),t[J](n)}else n[M](":")?this.#L(t,n,o,i):t[Z](n,o)}#R(e,t,o){return e=n(e),o=n(o),p(e)||p(o)?void 0:"+"===t?e+o:"-"===t?e-o:"*"===t?e*o:"/"===t?e/o:"%"===t?e%o:e}};let Ne,Re,Se,Be;new Map;function He(e){return o.from(e.childNodes).filter((e=>e.nodeType===Node.ELEMENT_NODE||e.nodeType===Node.TEXT_NODE&&e.textContent&&e.textContent.trim().length>0))}function Ye(n="",i,r){const a=/\.([\w_-]+)?/gi,s=((n[Ce](/^\w+(?=[\#\.]*)/i)||[])[0]||"")[_](),l=((n[Ce](/\#([\w_-]+)?/i)||[])[1]||"")[_](),d=(a.test(n)&&n.match(a)||[]).map((e=>e.replace(/^\./,"")));if(s[ve]<1)return;let c,u,f,p=!1;"temp"===n?(p=!0,c=e.createDocumentFragment()):c=e.createElement(s),l[ve]&&(c.id=l);for(let e of d)c.classList.add(e);if(null==i&&null!=r&&([i,r]=[r,null]),null!=i&&null!=r)[u,f]=[i,r];else if(null==r)"string"==typeof i||"number"==typeof i||o[z](i)?f=i:u=i;else if(null==i)return c;if("object"==typeof u&&null!=u)for(const e in u){if(!u.hasOwnProperty(e))continue;const t=u[e];-1!=["value","innerText",he,"textContent","contentEditable"][U](e)?c[e]=t:-1!=["color","backgroundColor","width","height","display","float"][U](e)?c.style[e]=t:null!=t&&c[Z](e,t)}if(null!=f){const n="string"==typeof f,i="number"==typeof f,r=o[z](f);if(n||i){const t=f;"img"===s||"source"===s?c.src=t:p?c[q](e[G](f)):c[he]=t}else if(r)for(let n of f){const o=n instanceof Element;"string"==typeof n||"number"==typeof n?p?c[q](e[G](t(n))):c[he]+=n:o&&c[q](n)}}return c}}("undefined"==typeof window?window={}:window); \ No newline at end of file diff --git a/dist/PDQuickUI.module.js b/dist/PDQuickUI.module.js index f7f3a9b..71da865 100644 --- a/dist/PDQuickUI.module.js +++ b/dist/PDQuickUI.module.js @@ -1 +1 @@ -!function(){"use strict";const e=document,t=String,n=Number,r=Array,i=Object,o=Boolean,s=Date,a=parseInt,l=isNaN,c=/\{\{\s*(((CALC|LENGTH|UPPER|LOWER|DATE)\(\s*[\w\.\s\+\-\*\/\,\s\/\:]+\s*\))|[\w\.]+)\s*\}\}/i,d=(new RegExp(c,"gi"),/\s+([\w\.]+)\s*$/i),u=/\s*[\!\>\<\=]+\=*\s*/,f=/([\w\.]+)\s*([\+\-\*\/\%])\s*([\d\.]+)/,h=":if",p=":else-if",g=":elif",m=":else",b="startsWith",y="children",E="parentElement",v="toLowerCase",k="dismiss",w="getElementById",O="data",N="event",P="trim",C="src",D="split",_="id",T="isArray",A="indexOf",M="style",x="innerHTML",L="forEach",S="replace",R="value",H="body",I="length",V="match",Y="shift",B="addEventListener",$="type",J="props",z="display",j="vdom",U="appendChild",X="createTextNode",F="removeAttribute",W="keys",q="parentNode",G="setAttribute",K={[h]:null,[p]:null,[g]:null,[m]:null},Q={":id":"id",":src":"src",":alt":"alt",":href":"href",":html":"innerHTML"},Z={":margin":"margin",":padding":"padding",":border":"border",":border-radius":"borderRadius",":borderRadius":"borderRadius",":outline":"outline",":box-sahdow":"boxShadow",":boxSahdow":"boxShadow",":bg-image":"backgroundImage",":backgroundImage":"backgroundImage",":bg-attachment":"backgroundAttachment",":backgroundAttachment":"backgroundAttachment",":bg-blend-mode":"backgroundBlendMode",":backgroundBlendMode":"backgroundBlendMode",":bg-clip":"backgroundClip",":backgroundClip":"backgroundClip",":bg-origin":"backgroundOrigin",":backgroundOrigin":"backgroundOrigin",":bg-position":"backgroundPosition",":backgroundPosition":"backgroundPosition",":bg-position-x":"backgroundPositionX",":backgroundPositionX":"backgroundPositionX",":bg-position-y":"backgroundPositionY",":backgroundPositionY":"backgroundPositionY",":bg-repeat":"backgroundRepeat",":backgroundRepeat":"backgroundRepeat",":bg-size":"backgroundSize",":backgroundSize":"backgroundSize",":bg-color":"backgroundColor",":backgroundColor":"backgroundColor",":color":"color"},ee={create:"CREATE",append:"APPEND",replace:"REPLACE",text:"TEXT",prop:"PROP",remove:"REMOVE"},te="index",ne="元件不存在。";function re(e,t,n){return new Proxy(e,{get(e,r,i){const o=Reflect.get(e,r,i),s=t?`${t}.${r.toString()}`:r.toString();return"object"==typeof o&&null!==o?re(o,s,n):o},set(e,r,i,o){const s=e[r],a=Reflect.set(e,r,i,o),l=t?`${t}.${r.toString()}`:r.toString();return s!==i&&n(l,i,s),a}})}async function ie(e,t=!1){return new Promise((async(n,r)=>{try{const i=await fetch(e);if(i.ok){const e=i.headers.get("Content-Type");if(e&&e[b]("image")){if("image/svg+xml"==e&&!t)return void n(i);const o=await i.blob(),s=new Image,a=URL.createObjectURL(o);s[C]=a,s.crossOrigin="anonymous",s.onload=e=>n({src:a,img:s}),s.onerror=e=>{URL.revokeObjectURL(a),r(e)}}else n(i)}else r(new Error(`HTTP error! status: ${i.status}`))}catch(e){r(e)}}))}window.QUI=class{body;data;event;done={};#e=!0;#t;#n;#r;#i;#o=new Map;#s=!1;#a=null;#l;#c;#d;#u;constructor(n={}){if(t(n[_]||"")[I]<1)return;const r=e[w](n[_]);if(null==r)return;this.#d=r.cloneNode(!0),this[H]=r,this[O]=re(n[O]||{},"",(async()=>{this.#t=Date.now(),null!=this.#c&&!1===await this.#f(this.#c)||(this.#h(),null==this.#i||this.#p(this.#i))})),this[N]=n[N]||{};const i=n.listener||{};!1!==i.svg&&function(){if(null!=ae)return;le=new IntersectionObserver((e=>{e.forEach((e=>{if(!e.isIntersecting)return;const t=e.target,n=(t.getAttribute("src")||"")[P]();n[I]<1||ie(n).then((e=>{le.unobserve(t),e.text().then((e=>{const n=de("div");n.innerHTML=e;const r=n[y][0];r.id=t.id,t.classList[L]((e=>r.classList.add(e))),r.onclick=t.onclick,null!=t[E]&&t[E].insertBefore(r,t),t.remove()})).catch((e=>{t.innerHTML="☒"}))})).catch((e=>{le.unobserve(t),t.innerHTML="☒"}))}))})),[].slice.call(document.body.querySelectorAll("temp-svg[src]:not([src=''])")||[])[L]((e=>le.observe(e)))}(),!1!==i.lazyload&&function(){if(null!=oe)return;se=new IntersectionObserver(((e,t)=>{e[L]((e=>{const t=e.target;if(e.isIntersecting){t.parentElement;const e=t.getAttribute("lazyload")||"";if(e[I]<1)return;t.removeAttribute("lazyload"),delete t.dataset[C],ie(e,!0).then((e=>{se.unobserve(t),t[C]=e[C]})).catch((e=>{se.unobserve(t),t[C]="https://cdn.jsdelivr.net/gh/pardnchiu/PDRenderKit@latest/static/image/404.svg"}))}}))})),[].slice.call(document.body.querySelectorAll("img[lazyload]:not([lazyload=''])")||[])[L]((e=>se.observe(e)))}(),this.#l=n.before_render||void 0,this.#r=n.rendered||void 0,this.#c=n.before_update||void 0,this.#i=n.updated||void 0,this.#a=this.#g(this.#d),(async()=>{this.#t=Date.now(),null!=this.#l&&!1===await this.#f(this.#l)||(this.#h(),null==this.#r||this.#p(this.#r))})()}async#h(){this.#u=this.#g(this.#d),this.#m(this.#u),await this.#b(this.#u),this.#y(this.#u),this.#E(this.#u),this.#n=s.now()-this.#t,console.log("耗時:",this.#n/1e3)}async#f(e){return new Promise(((t,n)=>{t(!1!==e())}))}#p(e){e(!1)}#v(e,r){const s=e[y][r];if("string"==typeof s)return;const a=s[J]||{};if(i[W](a)[I]<1||null==a[h]||null!=(a[p]||a[g]||a[m]))return;let l=r+1,c=e[y][l],d=[r],f=!1;for(;null!=c&&"string"!=typeof c&&!f;){if(d.push(l),l+=1,c=e[y][l],null==c||"string"==typeof c){f=!0;continue}const t=c[J]||{};f=null==(t[p]||t[g]||t[m])}let b=!1;for(let r of d){const i=e[y][r];if(null==i||"string"==typeof i)return;const s=i[J][h]||i[J][p]||i[J][g],a=null!=i[J][m];if(b||!b&&a)i[k]=!0;else if(null!=s){const e=s[D](u)[0],r=s[D](u)[1],a=((s[V](u)||[])[0]||"")[P](),l=this.#k(e,i.data);null==r&&a[I]<1?b=o(l):">"===a?b=(n(l)||0)>(n(r)||0):"<"===a?b=(n(l)||0)<(n(r)||0):">="===a||">=="===a?b=(n(l)||0)>=(n(r)||0):"<="===a||"<=="===a?b=(n(l)||0)<=(n(r)||0):"=="===a||"==="===a?b="null"==r?null==l:"true"==r?o(l):"false"==r?!o(l):"empty"==r?t(l||"")[I]<1:t(l||"")==t(r):"!="!==a&&"!=="!==a||(b="null"==r?null!=l:"true"==r?!o(l):"false"==r?o(l):"empty"==r?t(l||"")[I]>0:t(l||"")!=t(r)),i[k]=!b}}}#w(e,t,n,r){const i=this.#k(n,r.data)||n,s=(Q[t[v]()]||"")[P](),c=(Z[t[v]()]||"")[P]();if(e[M][z]=r[k]?"none":"",":lazyload"===t[v]()&&n[P]()[I]>0&&se.observe(e),":for"===t[v]());else if(":src"===t[v]()&&"temp-svg"===r.tag[v]()&&n[P]()[I]>0){const t=this.#k(n,r.data)||n;e.setAttribute(C,t),le.observe(e)}else t[v]()in K||(t[v]()in Q?e[s]=i:t[v]()in Z?e[M][c]=i:":hide"===t[v]()&&o(l(a(i))?i:a(i))?e[M][z]="none":i[I]>0&&e[G](`${t[S](/^:/,"")}`,i));e[F](t)}#O(e,t,n,r){(()=>{if(!1===t[b]("@"))return;const r=t[S](/^\@/,"on"),i=this[N][n];e[r]=i})(),(()=>{if(!1===t[b](":@"))return;const i=t[S](/^\:\@/,"on"),o=this.#k(n,r.data),s=this[N][o];e[i]=s})()}#k(e,n){if(String(e)[P]()[I]<1)return;const o=c.test(e);let s="",l="";o&&(s=e[D](c)[0]||"",l=e[D](c)[4]||"",e=e[V](c)[1]);const d=/^LENGTH\(.+\)/.test(e);d&&(e=e[S](/^LENGTH\(|\)$/g,""));const u=/^CALC\(.*\)$/.test(e);let h="",p=0;if(u){const t=(e=e[S](/^CALC\(|\)$/g,""))[V](f);e=t[1],h=t[2],p=a(t[3])||0}const g=/^UPPER\(.*\)$/.test(e),m=/^LOWER\(.*\)$/.test(e);(g||m)&&(e=e[S](/^(UPPER|LOWER)\(|\)$/g,""));const b=/^DATE\([\w\,\-\s\:]*\)$/.test(e);let y="";if(b){const t=(e=e[S](/^DATE\(|\)$/g,""))[V](/(\w+),\s*([^\n]+)/);e=t[1],y=t[2]}let E=e[D](/\./),k=n||this[O],w=E[0],N=k[w];if(E[Y](),null==N)return;for(;E[I]>0;)k=N,w=E[0],N=k[w],E[Y]();let C="";if(null!=N&&N instanceof Object&&!r[T](N)?C=t(i[W](N)[I]):null!=N&&(C=N[I]),o){if(d)return s+C+l;if(u&&(N=this.#N(N,h,p),null==N))return;return s+N+l}if(d)return C;if(u){if(N=this.#N(N,h,p),null==N)return}else{if(g)return N.toUpperCase();if(m)return N[v]();if(b)return function(e,n="yyyy/MM/DD (ddd) HH:mm:ss"){const r=new Date(1e3*e),i=t(r.getFullYear()),o=t(r.getMonth()+1),s=t(r.getDate()),a=t(r.getDay()),l=t(r.getHours()),c=t(r.getMinutes()),d=t(r.getSeconds()),u=t(r.getMilliseconds());let f={YYYY:i,yyyy:i,YY:i.slice(-2),yy:i.slice(-2),Y:i.slice(-2),y:i.slice(-2),M:o,MM:("0"+o).slice(-2),D:s,DD:("0"+s).slice(-2),d:a,dd:("0"+a).slice(-2),H:l,HH:("0"+l).slice(-2),h:t(parseInt(l)%12||12),hh:("0"+(parseInt(l)%12||12)).slice(-2),m:c,mm:("0"+c).slice(-2),s:d,ss:("0"+d).slice(-2),SSS:("00"+u).slice(-3),a:parseInt(l)>=12?"pm":"am",A:parseInt(l)>=12?"PM":"AM"};const h=/zh/.test(navigator.language||"")?["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];return f.ddd=h[parseInt(a)].slice(0,3),f.dddd=h[parseInt(a)],n.replace(/YYYY|YY|Y|yyyy|yy|y|MM|M|DD|D|HH|H|hh|h|mm|m|ss|s|SSS|a|A|ddd|dddd/g,(e=>f[e]))}(a(N),y)}return N}#P(e){console.log(e)}#g(e){return{tag:e.tagName[v](),props:(t=e,[...t.attributes].reduce(((e,t)=>(e[t.name]=t.value.trim(),e)),{})),children:ce(e).map((e=>e.nodeType===Node.ELEMENT_NODE?this.#g(e):(e.textContent||"")[P]())),data:null,dismiss:!1};var t}#E(t){const n=e[w](this[H][_]);if(null==n)return void this.#P(ne);const i=this.#C(this.#a,t);r[T](i)&&this.#D(n,i),this.#a=t}#C(e,t,n=[]){if(null==e&&t)return[{[$]:ee.create,[te]:n,[j]:t}];if(e&&!t)return[{[$]:ee.remove,[te]:n}];if(!e&&!t)return[];if(e.tag!==t.tag)return[{[$]:ee[S],[te]:n,[j]:t}];const r=[];return r.push(...this.#_(e,t,n)),r.push(...this.#T(e,t,n)),r}#_(e,t,n=[]){if(null==e||"string"==typeof e||null==t||"string"==typeof t)return[];const r=[],o=e[J],s=i[W](o)[I],a=t[J],l=i[W](a)[I];if(null!=a)for(let e in a){const i=a[e];r.push({[$]:ee.prop,[j]:t,key:e,value:i,[te]:n})}if(s>0){if(l<1)for(let e in o)r.push({[$]:"PROP",[j]:t,key:e,value:null,index:n});for(let e in a)l>0&&!(e in a)&&r.push({[$]:"PROP",[j]:t,key:e,value:null,index:n})}return r}#T(e,t,n=[]){if(null==e||"string"==typeof e||null==t||"string"==typeof t)return[];const i=[],o=r[T](e[y])?e[y]:[],s=r[T](t[y])?t[y]:[],a=Math.max(o[I],s[I]);for(let e=0;e"REMOVE"===e.type)).sort(((e,t)=>(t.index?.length||0)-(e.index?.length||0)));for(const e of s)if(e.index){const t=this.#A(o,e.index);t&&t[q]&&t[q].removeChild(t)}for(let t of n){let n,{index:r}=t,s=JSON.parse(JSON.stringify(r||[]));t.type===ee.append&&(n=s?.pop());const a=s?this.#A(o,s):o;if(a)switch(t.type){case"CREATE":if(t.vdom){const n="string"==typeof t.vdom?e[X](t.vdom):this.#M(t.vdom);if(null==a[E])continue;a[E][U](n)}break;case"REPLACE":if(t.vdom&&a[q]){const e=this.#M(t.vdom);a[q].replaceChild(e,a)}break;case"TEXT":a&&(a.textContent=t.value);break;case"PROP":a instanceof Element&&this.#x(a,t.key,t.value||"",t.vdom);break;case"APPEND":if(t.vdom&&null!=n){const r="string"==typeof t.vdom?e[X](t.vdom):this.#M(t.vdom);if(n+1>a[y][I]?a[U](r):a.insertBefore(r,a[y][n+1]),"string"==typeof t.vdom)continue;for(const[e,r]of i.entries(t.vdom[J]))this.#x(a[y][n],e,r||"",t.vdom)}}}}#A(e,t){let n=e,i=r.from(n.childNodes).filter((e=>e.nodeType===Node.ELEMENT_NODE||e.nodeType===Node.TEXT_NODE&&""!==e.textContent?.trim()))||[];for(const e of t)n=i[e],null!=n&&(i=r.from(n.childNodes).filter((e=>e.nodeType===Node.ELEMENT_NODE||e.nodeType===Node.TEXT_NODE&&""!==e.textContent?.trim()))||[]);return n}#M(t){const n=e.createElement(t.tag);if(t[J])for(const[e,r]of i.entries(t[J]))e[b](":")||e[b]("@")||void 0!==r&&n[G](e,r);for(const r of t[y])if("string"==typeof r)n[U](e[X](r));else{if(!0===r[k])continue;n[U](this.#M(r))}return n}#x(t,n,r,i){if(null==r)t[F](n);else if(n[b](":@")||n[b]("@"))this.#O(t,n,r,i),t[F](n);else if(n.toLocaleLowerCase()[b](":model")){if(!/(input|select|textarea)/i.test(t.tagName))return;const i=t instanceof HTMLInputElement,o=t instanceof HTMLTextAreaElement,s=t instanceof HTMLSelectElement,a=t.getAttribute("type");!i||"checkbox"!==a&&"radio"!==a?s?t[B]("change",(e=>{this[O][r]=e.target[R]||""})):(i||o)&&(t[B]("keyup",(e=>{this[O][r]=e.target[R]||""})),t[B]("change",(e=>{this[O][r]=e.target[R]||""}))):t[B]("change",(t=>{this[O][r]=[...e.body.querySelectorAll("input[name='"+t.target.name+"'][type='"+a+"']:checked")].map((e=>e.value)).join(",")})),t[F](n)}else n[b](":")?this.#w(t,n,r,i):t[G](n,r)}#y(e){let t=0;for(;t{const r=await n.text(),i=de("div",r)?.cloneNode(!0),o=this.#g(i);e[y].splice(t,1,...o[y]),t+=o[y][I]-2})),t++}}#N(e,t,r){return e=n(e),r=n(r),l(e)||l(r)?void 0:"+"===t?e+r:"-"===t?e-r:"*"===t?e*r:"/"===t?e/r:"%"===t?e%r:e}};let oe,se,ae,le;new Map;function ce(e){return r.from(e.childNodes).filter((e=>e.nodeType===Node.ELEMENT_NODE||e.nodeType===Node.TEXT_NODE&&e.textContent&&e.textContent.trim().length>0))}function de(n="",i,o){const s=/\.([\w_-]+)?/gi,a=((n[V](/^\w+(?=[\#\.]*)/i)||[])[0]||"")[P](),l=((n[V](/\#([\w_-]+)?/i)||[])[1]||"")[P](),c=(s.test(n)&&n.match(s)||[]).map((e=>e.replace(/^\./,"")));if(a[I]<1)return;let d,u,f,h=!1;"temp"===n?(h=!0,d=e.createDocumentFragment()):d=e.createElement(a),l[I]&&(d.id=l);for(let e of c)d.classList.add(e);if(null==i&&null!=o&&([i,o]=[o,null]),null!=i&&null!=o)[u,f]=[i,o];else if(null==o)"string"==typeof i||"number"==typeof i||r[T](i)?f=i:u=i;else if(null==i)return d;if("object"==typeof u&&null!=u)for(const e in u){if(!u.hasOwnProperty(e))continue;const t=u[e];-1!=["value","innerText",x,"textContent","contentEditable"][A](e)?d[e]=t:-1!=["color","backgroundColor","width","height","display","float"][A](e)?d.style[e]=t:null!=t&&d[G](e,t)}if(null!=f){const n="string"==typeof f,i="number"==typeof f,o=r[T](f);if(n||i){const t=f;"img"===a||"source"===a?d.src=t:h?d[U](e[X](f)):d[x]=t}else if(o)for(let n of f){const r=n instanceof Element;"string"==typeof n||"number"==typeof n?h?d[U](e[X](t(n))):d[x]+=n:r&&d[U](n)}}return d}}("undefined"==typeof window?window={}:window);export const QUI = window.QUI; +!function(){"use strict";const e=document,t=String,n=Number,o=Array,i=Object,r=Boolean,a=JSON,s=URL,l=Date,d=Math,c=Promise,u=Node,f=parseInt,p=isNaN,g=structuredClone,h=/\{\{\s*(((CALC|LENGTH|UPPER|LOWER|DATE)\(\s*[\w\.\s\+\-\*\/\,\s\/\:]+\s*\))|[\w\.]+)\s*\}\}/i,b=/\s+([\w\.]+)\s*$/i,m=/\s*[\!\>\<\=]+\=*\s*/,y=/([\w\.]+)\s*([\+\-\*\/\%])\s*([\d\.]+)/,k=":path",v=":for",C=":if",E=":else-if",w=":elif",P=":else",A="push",T="splice",D="head",M="startsWith",O="children",x="parentElement",L="textContent",N="toLowerCase",R="dismiss",S="getElementById",B="test",H="data",Y="event",_="trim",$="parse",I="src",V="split",z="isArray",U="indexOf",j="type",F="props",X="display",W="vdom",q="appendChild",G="createTextNode",J="removeAttribute",K="keys",Q="parentNode",Z="setAttribute",ee="addEventListener",te="TEXT_NODE",ne="ELEMENT_NODE",oe="headers",ie="get",re="crossOrigin",ae="anonymous",se="slice",le="unobserve",de="script",ce="tagName",ue="tag",fe="stringify",pe="id",ge="style",he="innerHTML",be="forEach",me="replace",ye="value",ke="body",ve="length",Ce="match",Ee="shift",we="index",Pe={[C]:null,[E]:null,[w]:null,[P]:null},Ae={":id":"id",":src":I,":alt":"alt",":href":"href",tagHtml:"innerHTML"},Te={":margin":"margin",":padding":"padding",":border":"border",":border-radius":"borderRadius",":borderRadius":"borderRadius",":outline":"outline",":box-sahdow":"boxShadow",":boxSahdow":"boxShadow",":bg-image":"backgroundImage",":background-image":"backgroundImage",":backgroundImage":"backgroundImage",":bg-attachment":"backgroundAttachment",":background-attachment":"backgroundAttachment",":backgroundAttachment":"backgroundAttachment",":bg-blend-mode":"backgroundBlendMode",":background-blend-mode":"backgroundBlendMode",":backgroundBlendMode":"backgroundBlendMode",":bg-clip":"backgroundClip",":background-clip":"backgroundClip",":backgroundClip":"backgroundClip",":bg-origin":"backgroundOrigin",":background-origin":"backgroundOrigin",":backgroundOrigin":"backgroundOrigin",":bg-position":"backgroundPosition",":background-position":"backgroundPosition",":backgroundPosition":"backgroundPosition",":bg-position-x":"backgroundPositionX",":background-position-x":"backgroundPositionX",":backgroundPositionX":"backgroundPositionX",":bg-position-y":"backgroundPositionY",":background-position-y":"backgroundPositionY",":backgroundPositionY":"backgroundPositionY",":bg-repeat":"backgroundRepeat",":background-repeat":"backgroundRepeat",":backgroundRepeat":"backgroundRepeat",":bg-size":"backgroundSize",":background-size":"backgroundSize",":backgroundSize":"backgroundSize",":bg-color":"backgroundColor",":background-color":"backgroundColor",":backgroundColor":"backgroundColor",":color":"color"},De={create:"CREATE",append:"APPEND",replace:"REPLACE",text:"TEXT",prop:"PROP",remove:"REMOVE"},Me="ID: 未提供",Oe="元素: 不存在。";async function xe(e,t=!1){return new c((async(n,o)=>{try{const i=await fetch(e);if(i.ok){const e=i[oe][ie]("Content-Type");if(e&&e[M]("image")){if("image/svg+xml"==e&&!t)return void n(i);const r=await i.blob(),a=new Image,l=s.createObjectURL(r);a[I]=l,a[re]=ae,a.onload=e=>n({[I]:l,img:a}),a.onerror=e=>{s.revokeObjectURL(l),o(e)}}else n(i)}else o(new Error(`HTTP error! status: ${i.status}`))}catch(e){o(e)}}))}function Le(e,t,n){return new Proxy(e,{get(e,o,i){const r=Reflect.get(e,o,i),a=t?`${t}.${o.toString()}`:o.toString();return"object"==typeof r&&null!==r?Le(r,a,n):r},set(e,o,i,r){const a=e[o],s=Reflect.set(e,o,i,r),l=t?`${t}.${o.toString()}`:o.toString();return a!==i&&n(l,i,a),s}})}window.QUI=class{body;data;event;done={};#e=!0;#t;#n;#o;#i=new Map;#r=!1;#a;#s;#l;#d;#c=null;#u=null;#f=null;constructor(n={}){if(t(n[pe]||"")[ve]<1)return void this.#p(Me);const o=e[S](n[pe]);if(null==o)return void this.#p(Oe);this.#c=this.#g(o),this[ke]=o,this[H]=Le(n[H]||{},"",(e=>{clearTimeout(this.#o),this.#o=setTimeout((async()=>{this.#t=l.now(),null!=this.#l&&!1===await this.#h(this.#l)||(this.#b(),null==this.#d||this.#m(this.#d))}),300)})),this[Y]=n[Y]||{};const i=n.option||{};!1!==i.svg&&function(){if(null!=Se)return;Be=new IntersectionObserver((e=>{e.forEach((e=>{if(!e.isIntersecting)return;const t=e.target,n=(t.getAttribute("src")||"")[_]();n[ve]<1||xe(n).then((e=>{Be[le](t),e.text().then((e=>{const n=Ye("div");n[he]=e;const o=n[O][0];o.id=t.id,t.classList[be]((e=>o.classList.add(e))),o.onclick=t.onclick,null!=t[x]&&t[x].insertBefore(o,t),t.remove()})).catch((e=>{t[he]="☒"}))})).catch((e=>{Be[le](t),t[he]="☒"}))}))})),[][se].call(document.body.querySelectorAll("temp-svg[src]:not([src=''])")||[])[be]((e=>Be.observe(e)))}(),!1!==i.lazyload&&function(){if(null!=Ne)return;Re=new IntersectionObserver(((e,t)=>{e[be]((e=>{const t=e.target;if(e.isIntersecting){t.parentElement;const e=t.getAttribute("lazyload")||"";if(e[ve]<1)return;t.removeAttribute("lazyload"),delete t.dataset[I],xe(e,!0).then((e=>{Re[le](t),t[I]=e[I]})).catch((e=>{Re[le](t),t[I]="https://cdn.jsdelivr.net/gh/pardnchiu/PDRenderKit@latest/static/image/404.svg"}))}}))})),[][se].call(document.body.querySelectorAll("img[lazyload]:not([lazyload=''])")||[])[be]((e=>Re.observe(e)))}(),this.#a=n.before_render||void 0,this.#s=n.rendered||void 0,this.#l=n.before_update||void 0,this.#d=n.updated||void 0,this.#f=g(this.#c),(async()=>{this.#t=l.now(),null!=this.#a&&!1===await this.#h(this.#a)||(this.#b(),null==this.#s||this.#m(this.#s))})()}#p(...t){const n=Ye(de,`console.log.apply(void 0, ${a[fe](t)});`);e.body[q](n),n.remove()}#g(t){if(t[ce][N]()===de){let n=!1;for(const o of e[D].querySelectorAll(de)||[])if(null!=t[I]&&o[I]===t[I]||null!=t[L]&&o[L]===t[L]){n=!0;break}return n||e[D][q](t),{[ue]:de,[F]:{},[O]:[],[H]:null,[R]:!1}}return{[ue]:t[ce][N](),[F]:(n=t,[...n.attributes].reduce(((e,t)=>(e[t.name]=t.value.trim(),e)),{})),[O]:He(t).map((e=>e.nodeType===Node[ne]?this.#g(e):(e[L]||"")[_]())),[H]:null,[R]:!1};var n}async#b(){this.#u=g(this.#c),null!=this.#u&&(this.#y(this.#u),await this.#k(this.#u),this.#v(this.#u),this.#C(this.#u),this.#n=l.now()-this.#t,this.#p("耗時:",this.#n/1e3))}#y(e){let t=0;for(;t"===s?f=(n(l)||0)>(n(o)||0):"<"===s?f=(n(l)||0)<(n(o)||0):">="===s||">=="===s?f=(n(l)||0)>=(n(o)||0):"<="===s||"<=="===s?f=(n(l)||0)<=(n(o)||0):"=="===s||"==="===s?f="null"==o?null==l:"true"==o?r(l):"false"==o?!r(l):"empty"==o?t(l||"")[ve]<1:t(l||"")==t(o):"!="!==s&&"!=="!==s||(f="null"==o?null!=l:"true"==o?!r(l):"false"==o?r(l):"empty"==o?t(l||"")[ve]>0:t(l||"")!=t(o)),i[R]=!f}}}async#k(e){let t=0;for(;t{const o=Ye("div",await n.text()).cloneNode(!0),i=this.#g(o);e[O][T](t,1,...i[O]),t+=i[O][ve]-2})),t++}}#v(e){let t=0;for(;t0)for(let e in s){const i=s[e];o[A]({[j]:De.prop,[W]:t,key:e,value:i,[we]:n})}if(a>0){if(l<1)for(let e in r)o[A]({[j]:De.prop,[W]:t,key:e,[ye]:null,[we]:n});for(let e in s)l>0&&!(e in s)&&o[A]({[j]:De.prop,[W]:t,key:e,[ye]:null,[we]:n})}return o}#D(e,t,n=[]){if(null==e||"string"==typeof e||null==t||"string"==typeof t)return[];const i=[],r=o[z](e[O])?e[O]:[],a=o[z](t[O])?t[O]:[],s=d.max(r[ve],a[ve]);for(let e=0;e{const e=n.filter((e=>e.type===De.remove)).sort(((e,t)=>{const n=(t.index.length||0)-(e.index.length||0);if(0!==n)return n;for(let n=0;n<(e.index.length||0);n++)if((e.index[n]||0)!==(t.index[n]||0))return(t.index[n]||0)-(e.index[n]||0);return 0}));for(const n of e){const e=this.#M(t,n.index);null!=e&&null!=e[Q]&&e[Q].removeChild(e)}})();for(let o of n){let n,{index:r}=o,s=a[$](a[fe](r||[]));o.type===De.append&&(n=s?.pop());const l=s?this.#M(t,s):t;if(l)if(o.type===De.create&&W in o){const t="string"==typeof o.vdom?e[G](o.vdom):this.#O(o.vdom);if(null==l[x])continue;l[x][q](t)}else if(o.type===De.replace&&W in o&&null!=l[Q]&&"string"!=typeof o.vdom){const e=this.#O(o.vdom);l[Q].replaceChild(e,l)}else if(o.type===De.text&&ye in o&&null!=l)l[L]=o.value||"";else if(o.type===De.prop&&"key"in o&&l instanceof Element)this.#x(l,o.key,o.value||"",o.vdom);else if(o.type===De.append&&W in o&&null!=n){const t="string"==typeof o.vdom?e[G](o.vdom):this.#O(o.vdom);if(n+1>l[O][ve]?l[q](t):l.insertBefore(t,l[O][n+1]),"string"==typeof o.vdom)continue;for(const[e,t]of i.entries(o.vdom[F]))this.#x(l[O][n],e,t||"",o.vdom);this.updatePatchAppendChild(o.vdom,l[O][n])}}}}updatePatchAppendChild(e,t){if("string"!=typeof e)for(const n in e.children.filter((e=>"string"!=typeof e))){const o=e.children[+n],r=t.children[+n];if("string"!=typeof o){for(const[e,t]of i.entries(o[F]))this.#x(r,e,t||"",o);this.updatePatchAppendChild(o,r)}}}async#h(e){return new c(((t,n)=>{t(!1!==e())}))}#m(e){e(!1)}#L(e,t,n,o){const i=this.#E(n,o[H])||n,a=(Ae[t[N]()]||"")[_](),s=(Te[t[N]()]||"")[_]();if(e[ge][X]=o[R]?"none":"",":lazyload"===t[N]()&&n[_]()[ve]>0&&Re.observe(e),t[N]()===v);else if(":src"===t[N]()&&"temp-svg"===o.tag[N]()&&n[_]()[ve]>0){const t=this.#E(n,o[H])||n;e.setAttribute(I,t),Be.observe(e)}else t[N]()in Pe||(t[N]()in Ae?e[a]=i:t[N]()in Te?e[ge][s]=i:":hide"===t[N]()&&r(p(+i)?i:+i)?e[ge][X]="none":i[ve]>0&&e[Z](`${t[me](/^:/,"")}`,i));e[J](t)}#N(e,t,n,o){(()=>{if(!1===t[M]("@"))return;const o=t[me](/^\@/,"on"),i=this[Y][n];e[o]=i})(),(()=>{if(!1===t[M](":@"))return;const i=t[me](/^\:\@/,"on"),r=this.#E(n,o[H]),a=this[Y][r];e[i]=a})()}#E(e,n){if(String(e)[_]()[ve]<1)return;const r=h[B](e);let a="",s="";r&&(a=e[V](h)[0]||"",s=e[V](h)[4]||"",e=e[Ce](h)[1]);const l=/^LENGTH\(.+\)/[B](e);l&&(e=e[me](/^LENGTH\(|\)$/g,""));const d=/^CALC\(.*\)$/[B](e);let c="",u=0;if(d){const t=(e=e[me](/^CALC\(|\)$/g,""))[Ce](y);e=t[1],c=t[2],u=+t[3]||0}const p=/^UPPER\(.*\)$/[B](e),g=/^LOWER\(.*\)$/[B](e);(p||g)&&(e=e[me](/^(UPPER|LOWER)\(|\)$/g,""));const b=/^DATE\([\w\,\-\s\:]*\)$/[B](e);let m="";if(b){const t=(e=e[me](/^DATE\(|\)$/g,""))[Ce](/(\w+),\s*([^\n]+)/);e=t[1],m=t[2]}let k=e[V](/\./),v=n||this[H],C=k[0],E=v[C];if(k[Ee](),null==E)return;for(;k[ve]>0;)v=E,C=k[0],E=v[C],k[Ee]();let w="";if(null!=E&&E instanceof Object&&!o[z](E)?w=t(i[K](E)[ve]):null!=E&&(w=E[ve]),r){if(l)return a+w+s;if(d&&(E=this.#R(E,c,u),null==E))return;return a+E+s}if(l)return w;if(d){if(E=this.#R(E,c,u),null==E)return}else{if(p)return E.toUpperCase();if(g)return E[N]();if(b)return function(e,n="yyyy/MM/DD (ddd) HH:mm:ss"){const o=new Date(1e3*e),i=t(o.getFullYear()),r=t(o.getMonth()+1),a=t(o.getDate()),s=t(o.getDay()),l=t(o.getHours()),d=t(o.getMinutes()),c=t(o.getSeconds()),u=t(o.getMilliseconds());let p={YYYY:i,yyyy:i,YY:i[se](-2),yy:i[se](-2),Y:i[se](-2),y:i[se](-2),M:r,MM:("0"+r)[se](-2),D:a,DD:("0"+a)[se](-2),d:s,dd:("0"+s)[se](-2),H:l,HH:("0"+l)[se](-2),h:t(f(l)%12||12),hh:("0"+(f(l)%12||12))[se](-2),m:d,mm:("0"+d)[se](-2),s:c,ss:("0"+c)[se](-2),SSS:("00"+u)[se](-3),a:f(l)>=12?"pm":"am",A:f(l)>=12?"PM":"AM"};const g=/zh/.test(navigator.language||"")?["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];return p.ddd=g[f(s)][se](0,3),p.dddd=g[f(s)],n.replace(/YYYY|YY|Y|yyyy|yy|y|MM|M|DD|D|HH|H|hh|h|mm|m|ss|s|SSS|a|A|ddd|dddd/g,(e=>p[e]))}(+E,m)}return E}#M(e,t){let n=e,i=o.from(n.childNodes).filter((e=>e.nodeType===u[ne]||e.nodeType===u[te]&&""!==e[L]?.trim()))||[];for(const e of t)n=i[e],null!=n&&(i=o.from(n.childNodes).filter((e=>e.nodeType===u[ne]||e.nodeType===u[te]&&""!==e[L]?.trim()))||[]);return n}#O(t){const n=e.createElement(t.tag);if(t[F])for(const[e,o]of i.entries(t[F]))e[M](":")||e[M]("@")||void 0!==o&&n[Z](e,o);for(const o of t[O])if("string"==typeof o)n[q](e[G](o));else{if(!0===o[R])continue;n[q](this.#O(o))}return n}#x(t,n,o,i){if(null==o)t[J](n);else if(n[M](":@")||n[M]("@"))this.#N(t,n,o,i),t[J](n);else if(n.toLocaleLowerCase()[M](":model")){if(!/(input|select|textarea)/i[B](t[ce]))return;const i=t instanceof HTMLInputElement,r=t instanceof HTMLTextAreaElement,a=t instanceof HTMLSelectElement,s=t.getAttribute("type");!i||"checkbox"!==s&&"radio"!==s?a?t[ee]("change",(e=>{this[H][o]=e.target[ye]||""})):(i||r)&&(t[ee]("keyup",(e=>{this[H][o]=e.target[ye]||""})),t[ee]("change",(e=>{this[H][o]=e.target[ye]||""}))):t[ee]("change",(t=>{this[H][o]=[...e.body.querySelectorAll("input[name='"+t.target.name+"'][type='"+s+"']:checked")].map((e=>e.value)).join(",")})),t[J](n)}else n[M](":")?this.#L(t,n,o,i):t[Z](n,o)}#R(e,t,o){return e=n(e),o=n(o),p(e)||p(o)?void 0:"+"===t?e+o:"-"===t?e-o:"*"===t?e*o:"/"===t?e/o:"%"===t?e%o:e}};let Ne,Re,Se,Be;new Map;function He(e){return o.from(e.childNodes).filter((e=>e.nodeType===Node.ELEMENT_NODE||e.nodeType===Node.TEXT_NODE&&e.textContent&&e.textContent.trim().length>0))}function Ye(n="",i,r){const a=/\.([\w_-]+)?/gi,s=((n[Ce](/^\w+(?=[\#\.]*)/i)||[])[0]||"")[_](),l=((n[Ce](/\#([\w_-]+)?/i)||[])[1]||"")[_](),d=(a.test(n)&&n.match(a)||[]).map((e=>e.replace(/^\./,"")));if(s[ve]<1)return;let c,u,f,p=!1;"temp"===n?(p=!0,c=e.createDocumentFragment()):c=e.createElement(s),l[ve]&&(c.id=l);for(let e of d)c.classList.add(e);if(null==i&&null!=r&&([i,r]=[r,null]),null!=i&&null!=r)[u,f]=[i,r];else if(null==r)"string"==typeof i||"number"==typeof i||o[z](i)?f=i:u=i;else if(null==i)return c;if("object"==typeof u&&null!=u)for(const e in u){if(!u.hasOwnProperty(e))continue;const t=u[e];-1!=["value","innerText",he,"textContent","contentEditable"][U](e)?c[e]=t:-1!=["color","backgroundColor","width","height","display","float"][U](e)?c.style[e]=t:null!=t&&c[Z](e,t)}if(null!=f){const n="string"==typeof f,i="number"==typeof f,r=o[z](f);if(n||i){const t=f;"img"===s||"source"===s?c.src=t:p?c[q](e[G](f)):c[he]=t}else if(r)for(let n of f){const o=n instanceof Element;"string"==typeof n||"number"==typeof n?p?c[q](e[G](t(n))):c[he]+=n:o&&c[q](n)}}return c}}("undefined"==typeof window?window={}:window);export const QUI = window.QUI; diff --git a/index.html b/index.html index 59a77cd..35104b0 100644 --- a/index.html +++ b/index.html @@ -65,8 +65,13 @@ -

    adfasdf

    - +

    {{ title }} 1

    +

    {{ title }} 2

    +

    {{ title }} 3

    +

    {{ title }} 4

    +
    + + @@ -85,20 +90,16 @@ -

    Total: {{ LENGTH(array) }}

    -

    calc: {{ CALC(num * 10) }}

    -

    {{ UPPER(test1) }} {{ LOWER(test2) }}

    -

    {{ DATE(now, YYYY-MM-DD hh:mm:ss) }}

    -

    {{ title }} 1

    -

    {{ title }} 2

    -

    {{ title }} 3

    -

    {{ title }} 4


    {{ string }} {{ CALC(num * 10) }} {{ DATE(now, YYYY-MM-DD hh:mm:ss) }}
    • {{ item }} {{ CALC(index + 1) }}
    +

    Total: {{ LENGTH(array) }}

    +

    calc: {{ CALC(num * 10) }}

    +

    {{ UPPER(test1) }} {{ LOWER(test2) }}

    +

    {{ DATE(now, YYYY-MM-DD hh:mm:ss) }}