2026-06-12 02:03:09 +08:00
|
|
|
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).ApigoKanban={})}(this,function(e){"use strict";var t,n,a,i,d,s=e=>{throw TypeError(e)},o=(e,t,n)=>t.has(e)||s("Cannot "+n),r=(e,t,n)=>(o(e,t,"read from private field"),n?n.call(e):t.get(e)),l=(e,t,n)=>t.has(e)?s("Cannot add the same private member more than once"):t instanceof WeakSet?t.add(e):t.set(e,n),c=(e,t,n)=>(o(e,t,"access private method"),n);class p extends HTMLElement{constructor(){super(),l(this,n),l(this,t,[]),this.attachShadow({mode:"open"})}connectedCallback(){c(this,n,a).call(this)}get data(){return r(this,t)}set data(e){((e,t,n,a)=>{o(e,t,"write to private field"),a?a.call(e,n):t.set(e,n)})(this,t,e),c(this,n,a).call(this)}}t=new WeakMap,n=new WeakSet,a=function(){this.shadowRoot.innerHTML=`\n <style>\n :host {\n display: flex;\n gap: 16px;\n padding: 16px;\n overflow-x: auto;\n font-family: system-ui, -apple-system, sans-serif;\n }\n .column {\n background: #f1f2f4;\n border-radius: 8px;\n width: 280px;\n min-width: 280px;\n display: flex;\n flex-direction: column;\n max-height: 100%;\n }\n .column-header {\n padding: 12px;\n font-weight: bold;\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n .items-container {\n flex: 1;\n padding: 8px;\n min-height: 50px;\n }\n .item {\n background: white;\n border-radius: 4px;\n padding: 12px;\n margin-bottom: 8px;\n box-shadow: 0 1px 3px rgba(0,0,0,0.1);\n cursor: grab;\n }\n .item:active {\n cursor: grabbing;\n }\n .item.dragging {\n opacity: 0.5;\n }\n .items-container.drag-over {\n background: rgba(0,0,0,0.05);\n }\n </style>\n ${r(this,t).map(e=>`\n <div class="column" data-id="${e.id}">\n <div class="column-header">\n <span>${e.title}</span>\n </div>\n <div class="items-container" data-column-id="${e.id}">\n ${(e.items||[]).map(t=>`\n <div class="item" draggable="true" data-id="${t.id}" data-column-id="${e.id}">\n ${t.content}\n </div>\n `).join("")}\n </div>\n </div>\n `).join("")}\n `,c(this,n,i).call(this)},i=function(){const e=this.shadowRoot.querySelectorAll(".item"),t=this.shadowRoot.querySelectorAll(".items-container");e.forEach(e=>{e.addEventListener("dragstart",t=>{e.classList.add("dragging"),t.dataTransfer.setData("text/plain",JSON.stringify({itemId:e.dataset.id,fromColumnId:e.dataset.columnId}))}),e.addEventListener("dragend",()=>{e.classList.remove("dragging")})}),t.forEach(e=>{e.addEventListener("dragover",t=>{t.preventDefault(),e.classList.add("drag-over")}),e.addEventListener("dragleave",()=>{e.classList.remove("drag-over")}),e.addEventListener("drop",t=>{t.preventDefault(),e.classList.remove("drag-over");const a=JSON.parse(t.dataTransfer.getData("text/plain"));c(this,n,d).call(this,a.itemId,a.fromColumnId,e.dataset.columnId)})})},d=function(e,i,d){if(i===d)return;const s=r(this,t).find(e=>e.id===i),o=r(this,t).find(e=>e.id===d),l=s.items.findIndex(t=>t.id===e),[p]=s.items.splice(l,1);o.items.push(p),c(this,n,a).call(this),this.dispatchEvent(new CustomEvent("@update",{detail:r(this,t),bubbles:!0,composed:!0}))},customElements.define("web-kanban",p),"undefined"!=typeof globalThis&&globalThis.Component&&globalThis.Component.register("Kanban",e=>{const t=document.createElement("web-kanban");e.appendChild(t),e.kanbanInstance=t,e.state.__watch("data",e=>t.data=e),e.state.data&&(t.data=e.state.data),t.addEventListener("@update",t=>{e.state.data=t.detail,e.dispatchEvent(new CustomEvent("update",{detail:t.detail}))})}),"undefined"!=typeof globalThis&&(globalThis.Kanban=p),e.Kanban=p,Object.defineProperty(e,Symbol.
|
