From 81c4f29a4a2624c826d4c43a777b1685012bfaf8 Mon Sep 17 00:00:00 2001 From: chuyang02 <208526470@qq.com> Date: Thu, 24 Jul 2025 20:44:15 +0800 Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=94=AF=E4=BB=98=E4=B8=AD?= =?UTF-8?q?=E5=BF=83=EF=BC=8C=E4=BF=AE=E6=94=B9404=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/images/Alipay.png | Bin 0 -> 3183 bytes src/assets/images/wechat.png | Bin 0 -> 3143 bytes src/components/DataTable.vue | 322 ++++++++++++++++++++++++----------- src/views/Notfound.vue | 27 +-- src/views/layout/Balance.vue | 256 ++++++++++++++++++++++++++++ 5 files changed, 498 insertions(+), 107 deletions(-) create mode 100644 src/assets/images/Alipay.png create mode 100644 src/assets/images/wechat.png diff --git a/src/assets/images/Alipay.png b/src/assets/images/Alipay.png new file mode 100644 index 0000000000000000000000000000000000000000..a0d5fe6bc86cda9dbf22997bb98199300390cc95 GIT binary patch literal 3183 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 ZYgbACzaZJxt!Y<)AmWU$#Rd+M{{i+ZaDo5; literal 0 HcmV?d00001 diff --git a/src/assets/images/wechat.png b/src/assets/images/wechat.png new file mode 100644 index 0000000000000000000000000000000000000000..6a759fb2abfbfb427148371444d1ae4306cb019c GIT binary patch literal 3143 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
-
{{ title }}
-

DataTables has most features enabled by default, so all you need to do to use it with your own tables is to - call the construction function: $().DataTable();.

+
{{ title }}
-
-
-
+ + 条数据 + +
+
+ +
-
-
+
+ +
- +
- + - + - +
{{ item.text }} + {{ item.text }} +
{{ item[header.value] }}
- {{ item[header.value] ? '禁用' : '正常'}} + {{ item[header.value] ? "禁用" : "正常" }}
- + {{ objItem[header.child] }}
@@ -56,15 +111,31 @@
- - - + +
{{ header.value }} + {{ header.value }} +
@@ -72,22 +143,79 @@
-
正在展示 {{ (currentPageIndex * pageSize) - (pageSize - 1) }} 到 {{ currentPageIndex * pageSize }} 条数据 总计 {{dataCount}} 条
+
+ 正在展示 {{ currentPageIndex * pageSize - (pageSize - 1) }} 到 + {{ currentPageIndex * pageSize }} 条数据 总计 {{ dataCount }} 条 +
-
+
@@ -118,8 +246,8 @@ export default { }, dataCount: { type: Number, - required: true - } + required: true, + }, }, data() { return { @@ -130,12 +258,10 @@ export default { //总页数 pageCount: 0, //分页按钮数据,[{text:'1',index:1},.....] - pageBtn: [] - } - }, - mounted() { - + pageBtn: [], + }; }, + mounted() {}, methods: { //下一页 nextPage() { @@ -144,11 +270,11 @@ export default { //上一页 previousPage() { if (this.currentPageIndex > 1) { - this.currentPageIndex-- + this.currentPageIndex--; } }, changePage(pageIndex) { - this.currentPageIndex == pageIndex + this.currentPageIndex == pageIndex; }, //更新总页数 updatePageCount(newPageSize) { @@ -156,82 +282,88 @@ export default { this.pageCount += this.dataCount % newPageSize == 0 ? 0 : 1; }, //更新分页按钮数据 - updatePageBtn(newPageIndex){ - this.pageBtn = [] + updatePageBtn(newPageIndex) { + this.pageBtn = []; //初始化首页 - this.pageBtn.push({text: '1', index: 1}) + this.pageBtn.push({ text: "1", index: 1 }); //总页数小于8时显示全部页码 - if(this.pageCount <= 8){ - for(let i = 2; i < this.pageCount; i++){ - this.pageBtn.push({text: `${i}`, index: i}) + if (this.pageCount <= 8) { + for (let i = 2; i < this.pageCount; i++) { + this.pageBtn.push({ text: `${i}`, index: i }); } - }else{ + } else { //当前页左侧显示2格页码,当显示最小页码距离首页中间间隔大于1时隐藏间隔页面 - if(newPageIndex - 2 > 3){ - this.pageBtn.push({text: '...', index: newPageIndex}) + if (newPageIndex - 2 > 3) { + this.pageBtn.push({ text: "...", index: newPageIndex }); } //渲染当前页码左右各两格页码 - const numleft = (newPageIndex - 2) < 2 ? newPageIndex - 2 : 2; - const numright = (newPageIndex + 2) < this.pageCount ? 2 : (this.pageCount - newPageIndex - 1); - for(let i = newPageIndex - numleft; i <= newPageIndex + numright; i++){ - this.pageBtn.push({text: `${i}`, index: i}) + const numleft = newPageIndex - 2 < 2 ? newPageIndex - 2 : 2; + const numright = + newPageIndex + 2 < this.pageCount ? 2 : this.pageCount - newPageIndex - 1; + for (let i = newPageIndex - numleft; i <= newPageIndex + numright; i++) { + this.pageBtn.push({ text: `${i}`, index: i }); } //当前页右侧显示2格页码,当显示最大页码距离尾页中间间隔大于1时隐藏间隔页面 - if(newPageIndex + 2 < this.pageCount - 2){ - this.pageBtn.push({text: '...', index: newPageIndex}) + if (newPageIndex + 2 < this.pageCount - 2) { + this.pageBtn.push({ text: "...", index: newPageIndex }); } } //渲染尾页 - this.pageBtn.push({text: `${this.pageCount}`, index: this.pageCount}) - }, - formatDateTime(str){ - if (!str) return '-'; + this.pageBtn.push({ text: `${this.pageCount}`, index: this.pageCount }); + }, + formatDateTime(str) { + if (!str) return "-"; - const date = new Date(str); - if (isNaN(date)) return '-'; // 防止 Safari 报 Invalid Date + const date = new Date(str); + if (isNaN(date)) return "-"; // 防止 Safari 报 Invalid Date - const pad = n => n.toString().padStart(2, '0'); + const pad = (n) => n.toString().padStart(2, "0"); - const Y = date.getFullYear(); - const M = pad(date.getMonth() + 1); - const D = pad(date.getDate()); - const h = pad(date.getHours()); - const m = pad(date.getMinutes()); - const s = pad(date.getSeconds()); + const Y = date.getFullYear(); + const M = pad(date.getMonth() + 1); + const D = pad(date.getDate()); + const h = pad(date.getHours()); + const m = pad(date.getMinutes()); + const s = pad(date.getSeconds()); - return `${Y}-${M}-${D} ${h}:${m}:${s}`; - }, - modify(id){ - this.$emit('dataModify',id) - }, - deleteData(id){ - this.$emit('dataDelete',id) - } + return `${Y}-${M}-${D} ${h}:${m}:${s}`; + }, + modify(id) { + this.$emit("dataModify", id); + }, + deleteData(id) { + this.$emit("dataDelete", id); + }, }, watch: { //监听分页大小变化 - 'pageSize': { + pageSize: { handler(newVal) { - this.updatePageCount(newVal) + this.updatePageCount(newVal); //单页显示数据量改变时重置当前索引,防止数据以及控件异常 - this.currentPageIndex = 1 - this.$emit('pageChanged',{pageIndex:this.currentPageIndex,pageSize:newVal}) - this.updatePageBtn(this.currentPageIndex) + this.currentPageIndex = 1; + this.$emit("pageChanged", { pageIndex: this.currentPageIndex, pageSize: newVal }); + this.updatePageBtn(this.currentPageIndex); }, - immediate: true + immediate: true, }, //监听页索引,用于切换数据 - 'currentPageIndex': { + currentPageIndex: { handler(newVal) { - this.$emit('pageChanged',{pageIndex:newVal,pageSize:this.pageSize}) - this.updatePageBtn(newVal) + this.$emit("pageChanged", { pageIndex: newVal, pageSize: this.pageSize }); + this.updatePageBtn(newVal); }, - immediate: true - } - } -} + immediate: true, + }, + }, +}; diff --git a/src/views/Notfound.vue b/src/views/Notfound.vue index 38c76ce..b94f511 100644 --- a/src/views/Notfound.vue +++ b/src/views/Notfound.vue @@ -1,20 +1,23 @@ diff --git a/src/views/layout/Balance.vue b/src/views/layout/Balance.vue index e69de29..9d6b1cf 100644 --- a/src/views/layout/Balance.vue +++ b/src/views/layout/Balance.vue @@ -0,0 +1,256 @@ + + + + +