xq-tablelist/dist/js/xq-tablelist.min.js

基于Bootstrap5的表格列表，包括管理列表页面、添加页面、编辑页面，同时包括后台管理员管理的页面。

/*!
 * xq-tablelist v1.0.1 (https://xqkeji.cn/demo/xq-tablelist)
 * Author xqkeji.cn
 * LICENSE SSPL-1.0
 * Copyright 2023 xqkeji.cn
 */
 (function(){"use strict";const d=require("xq-util");const i=require("xq-confirm");const u=require("xq-html5sortable");const c={tableClass:".xq-tablelist",dragClass:".xq-drag",checkAllClass:".xq-tablelist .xq-check-all",addBtnClass:".xq-tablelist .xq-add",editBtnClass:".xq-edit",deleteBtnClass:".xq-delete",copyBtnClass:".xq-copy",batchBtnClass:".xq-batch",backPageClass:".xq-backpage",authTableClass:".xq-auth-table",authCheckTableClass:".xq-auth-check-table",authCheckRowClass:".xq-auth-check-row"};let o={};const e=(t={})=>{o=Object.assign({},c);if(t){for(const e in t){if(Object.hasOwn(o,e)){treegridOptions[e]=t[e]}}}};const f=t=>{if(t in o){return o[t]}const e=o["tableClass"];const c=document.querySelector(e);if(c.hasAttribute(t)){return String(c.getAttribute(t))}return""};let n;const r=()=>{if(n){return n}else{const t=f("tableClass");const e=document.querySelector(t);n=e;return n}};const s=()=>{const t=f("addBtnClass");const e=document.querySelector(t);if(e){e.addEventListener("click",t=>{const e=t.currentTarget;const c=d.parents(e,"table")[0];const o=c.getAttribute("pid");let n=e.getAttribute("xq-url");if(!n){n=window.location.href;if(n.includes(".html")||n.includes("localhost")){n=n.slice(0,Math.max(0,n.lastIndexOf("/")));n+="/add.html"}else{if(o){n=n.replace("/"+o,"")}n=n.slice(0,Math.max(0,n.lastIndexOf("/")));n+=o?"/add/"+o:"/add"}}window.location.href=n})}};const l=s=>{const t=f("editBtnClass");const e=s.querySelector(t);if(e){e.addEventListener("click",t=>{const e=t.currentTarget;const c=r();const o=c?.getAttribute("pid");let n=s.getAttribute("id");n=n.replace("xq_","");if(n){let t=e.getAttribute("xq-url");if(!t){t=window.location.href;if(t.includes(".html")||t.includes("localhost")){t=t.slice(0,Math.max(0,t.lastIndexOf("/")));t=t+"/edit.html?id="+n}else{if(o){t=t.replace("/"+o,"")}t=t.slice(0,Math.max(0,t.lastIndexOf("/")));t=t+"/edit/"+n}}window.location.href=t}else{i({content:"找不到tr的id属性！"})}})}};const a=t=>{const e=document.createElement("input");e.setAttribute("value",t);document.body.append(e);e.select();document.execCommand("copy");e.remove()};const h=e=>{const t=f("copyBtnClass");const c=e.querySelector(t);if(c){c.addEventListener("click",()=>{let t=e.getAttribute("id");t=t.replace("xq_","");if(t){a(t);i({content:"已经将id复制到粘贴板"})}})}};const b=s=>{const t=f("deleteBtnClass");const e=s.querySelector(t);if(e){e.addEventListener("click",t=>{const e=t.currentTarget;const c=r();const o=c?.getAttribute("pid");let n=s.getAttribute("id");n=n.replace("xq_","");if(n){let t=e.getAttribute("xq-url");if(!t){t=window.location.href;if(o){t=t.replace("/"+o,"")}t=t.slice(0,Math.max(0,t.lastIndexOf("/")));t+="/delete"}i({content:"确定要删除吗？",confirm(){fetch(t,{body:JSON.stringify({id:n}),headers:{"content-type":"application/json"},method:"POST"}).then(async t=>{return t.json()}).then(t=>{i({content:t.message,confirm(){if(t.code===200){window.location.reload()}}})})}})}else{i({content:"找不到tr的id属性！"})}})}};const y=t=>{const i=r();let a=t.getAttribute("id");a=a?.replace("xq_","");const e=t.querySelectorAll("input,select");for(const c of e){const o=c.getAttribute("id");if(o!=="id"&&o!=="check_all"){c.addEventListener("change",t=>{const e=t.currentTarget;let c=null;c=e.type==="checkbox"?e.checked:e.value;const o=e.getAttribute("id");const n=o?.slice(0,Math.max(0,o.indexOf("_")));const s=i?.getAttribute("pid");let r=i?.getAttribute("xq-url");const l={id:a,field:n,value:c};if(!r){let t=window.location.href;if(s){t=t.replace("/"+s,"")}t=t.slice(0,Math.max(0,t.lastIndexOf("/")));t+="/change";r=t}else{r+="/change"}fetch(r,{body:JSON.stringify(l),headers:{"content-type":"application/json"},method:"POST"}).then(async t=>{return t.json()}).then(t=>{console.log(t)})})}}};const p=()=>{const t=f("batchBtnClass");const e=document.querySelectorAll(t);if(e){for(const c of e){c.addEventListener("click",t=>{const e=t.currentTarget;const c=d.parents(e,"table")[0];const o=c.getAttribute("pid");const n=d.parents(e,"form")[0];const s=e.getAttribute("name");if(s){let t=e.getAttribute("xq-url");if(!t){t=window.location.href;if(o){t=t.replace("/"+o,"")}t=t.slice(0,Math.max(0,t.lastIndexOf("/")));t=t+"/"+s}const r=d.jsonFormData(n);const l=JSON.stringify(r);if(l!=="{}"){i({content:"确定要进行批量操作吗？",confirm(){fetch(t,{body:l,headers:{"content-type":"application/json"},method:"POST"}).then(async t=>{return t.json()}).then(t=>{i({content:t.message,confirm(){if(t.code===200){window.location.reload()}}})})}})}else{i({content:"没有选择操作数据."})}}})}}};const q=()=>{const t=f("dragClass");const l=document.querySelector(t);if(l){const e=l.querySelector("tbody");if(e){const c=e.querySelector("tbody>tr:first-child");const o=c.getAttribute("id");const n=c.querySelector("td:first-child");n?.classList.add("xq-move");e.setAttribute("id","tbody_"+o);const s=e.querySelectorAll("tbody>tr:not(:first-child)");for(const r of s){const i=r.querySelector("td:first-child");i?.classList.add("xq-move");const a=document.createElement("tbody");a.append(r);const d=r.getAttribute("id");a.setAttribute("id","tbody_"+d);e.after(a)}}u(t,{items:"tbody",handle:".xq-move",placeholder:'<tbody><tr><td colspan="99">&nbsp;</td></tr><tbody>'});l.addEventListener("sortstop",()=>{const c=[];let o=0;const t=l.querySelectorAll("tbody");for(const s of t){o++;const t=s.querySelector("tr:first-child");const e=t?.getAttribute("id");const r={id:e,ordernum:o};c.push(r)}const e=l.getAttribute("pid");let n=l.getAttribute("xq-url");if(!n){n=window.location.href;if(e){n=n.replace("/"+e,"")}n=n.slice(0,Math.max(0,n.lastIndexOf("/")));n+="/b-order"}fetch(n,{body:JSON.stringify(c),headers:{"content-type":"application/json"},method:"POST"}).then(async t=>{return t.json()}).then(t=>{if(t.code===200);})})}};const m=()=>{const t=f("checkAllClass");const e=document.querySelector(t);if(e){e.addEventListener("click",t=>{const e=t.currentTarget;const{checked:c}=e;const o=r();const n=o?.querySelectorAll("tr > td:first-child > input[type=checkbox]");for(const s of n){if(s===e){continue}if(c){s.checked=true}else{s.checked=false}}})}};const x=()=>{let t;let e;const c=f("backPageClass");const o=document.querySelectorAll(c);if(o){t=document.referrer;if(t&&t!==document.location.href&&t!==window.top?.location.href){sessionStorage.setItem(document.location.href,t);e=t}else{const n=sessionStorage.getItem(document.location.href);if(n){e=n.toString()}}for(const s of o){s.addEventListener("click",t=>{t.preventDefault();if(e){document.location.href=e}else{i({content:"系统无法自动返回上一个页面."})}})}}};const g=()=>{const t=f("authTableClass");const e=document.querySelectorAll(t);if(e){for(const s of e){const r=f("authCheckTableClass");const c=s.querySelector(r);if(c){const l=c.querySelector("input[type=checkbox]");if(l){l.addEventListener("click",t=>{const e=t.currentTarget;const{checked:c}=e;const o=s.querySelectorAll("input[type=checkbox]:not("+r+">input[type=checkbox])");for(const n of o){if(c){n.checked=true}else{n.checked=false}}})}}const o=f("authCheckRowClass");const n=s.querySelectorAll(o);for(const i of n){const a=i.querySelector("input[type=checkbox]");if(a){a.addEventListener("click",t=>{const e=t.currentTarget;const{checked:c}=e;const o=d.next(i,"td")[0];const n=o.querySelectorAll("input[type=checkbox]");for(const s of n){if(c){s.checked=true}else{s.checked=false}}})}}}}};const A=()=>{const t=r();if(t){const e=t.querySelectorAll("tr");for(const c of e){l(c);b(c);y(c);h(c)}m();s();p();q()}x();g()};const t=(t={})=>{e(t);A()};d.domReady(()=>{t()});window.xqTableList=t;module.exports=t})();