From a4831debee63c7071a261c5f6ecfa62fd535b2ab Mon Sep 17 00:00:00 2001
From: quanyawei <401863037@qq.com>
Date: Thu, 25 Jan 2024 16:21:18 +0800
Subject: [PATCH] 分页修改
---
src/views/list/devicesVersion.vue | 166 +++++++++++++++++++++++++++++--------------------------
1 files changed, 87 insertions(+), 79 deletions(-)
diff --git a/src/views/list/devicesVersion.vue b/src/views/list/devicesVersion.vue
index 8f830a4..057dc27 100644
--- a/src/views/list/devicesVersion.vue
+++ b/src/views/list/devicesVersion.vue
@@ -3,23 +3,24 @@
<a-card :bordered="false" style="margin-top:24px">
<div class="tableList">
<div class="tableListForm">
- <a-form
- @submit="handleSearch"
- layout="horizontal"
- :form="searchForm"
- >
+ <a-form @submit="handleSearch" layout="horizontal" :form="searchForm">
<a-row :gutter="{ md: 8, lg: 24, xl: 48 }">
<a-button
icon="plus"
type="primary"
@click="() => this.handleModalVisible(true)"
style="margin-left: 25px;"
- >������</a-button>
+ >������</a-button
+ >
<a-form-item
v-bind="searchFormLayout"
style="width: 240px;float: right;"
>
- <a-input v-model="serch.name" placeholder="���������������������" allow-clear />
+ <a-input
+ v-model="serch.name"
+ placeholder="���������������������"
+ allow-clear
+ />
</a-form-item>
</a-row>
</a-form>
@@ -45,19 +46,21 @@
@cancel="handleCreateModalCancel"
okText="������"
>
-
- <a-form style="margin-top: 8px" :form="createForm">
+ <a-form style="margin-top: 8px" :form="createForm">
<a-form-item
:labelCol="{ span: 5 }"
:wrapperCol="{ span: 15 }"
label="������"
has-feedback
>
- <a-input
- placeholder="������������"
- type="string"
- v-decorator="['deviceName', { rules: [{ required: true, message: '������������������' }] }]"
- />
+ <a-input
+ placeholder="������������"
+ type="string"
+ v-decorator="[
+ 'deviceName',
+ { rules: [{ required: true, message: '������������������' }] },
+ ]"
+ />
</a-form-item>
<a-form-item
@@ -90,14 +93,11 @@
<script lang="tsx">
import { Component, Prop, Vue, Model, Watch } from "vue-property-decorator";
-
import moment from "moment";
import { get, post } from "@/util/request";
-
import UpdateTaskForm from "./components/UpdateTaskFormVersion.vue";
import DistributionVersion from "./components/DistributionVersion.vue";
-
import modalService from "@/core/ModalService.ts";
@@ -107,24 +107,24 @@
@Component({
components: {
UpdateTaskForm,
- DistributionVersion
- }
+ DistributionVersion,
+ },
})
export default class QueryList extends Vue {
private searchForm: any;
private serch: any = {
- name: ""
+ name: "",
};
private searchFormLayout: any = {
labelCol: {
- span: 5
+ span: 5,
},
wrapperCol: {
span: 18,
- offset: 1
- }
+ offset: 1,
+ },
};
private form: any = {};
@@ -159,30 +159,40 @@
private columns: any[] = [
{
+ title: "������",
+ dataIndex: "key",
+ key: "key",
+ align: "center",
+ customRender: (text: any, record: any, index: any) => `${index + 1}`,
+ width: 60,
+ },
+ {
title: "������",
- dataIndex: "name"
+ dataIndex: "name",
},
{
title: "������������",
- dataIndex: "createTime"
+ dataIndex: "createTime",
},
{
title: "������",
- dataIndex: "desc"
+ dataIndex: "desc",
},
{
title: "������",
- customRender: this.opRender
- }
+ customRender: this.opRender,
+ },
];
private pagination: any = {
total: 0,
- current: 0,
- pageSize: 5,
- showSizeChanger: false,
- showQuickJumper: false
+ current: 1,
+ pageSize: 10,
+ showSizeChanger: true,
+ showQuickJumper: true,
+ pageSizeOptions: ["10", "30", "60", "100"],
+ showTotal: (total: number) => `������ ${this.pagination.total} ���������`, //���������������������������
};
constructor() {
super();
@@ -200,20 +210,20 @@
return [
{
text: status[0],
- value: 0
+ value: 0,
},
{
text: status[1],
- value: 1
+ value: 1,
},
{
text: status[2],
- value: 2
+ value: 2,
},
{
text: status[3],
- value: 3
- }
+ value: 3,
+ },
];
}
@@ -233,20 +243,23 @@
private handleSearch(): void {
get("manageRole/getManageRoleByNameFuzzy", {
- name: this.serch.name,
- current: 1,
- size: 100
- })
- .then(res => {
+ name: this.serch.name,
+ current: 1,
+ size: 100,
+ })
+ .then((res) => {
this.dataSource = res.data.data.manageRoles;
})
- .catch(err => {
+ .catch((err) => {
console.log(err);
});
}
private handlerTableChange(pagination: any, filter: any, sorter: any): void {
- this.loadRuleData(pagination.current)
+ this.pagination.current = pagination.current;
+ this.pagination.pageSize = pagination.pageSize;
+ this.pagination.total = pagination.total;
+ this.loadRuleData(pagination.current);
}
private testCallback(param: any) {}
@@ -287,7 +300,7 @@
private handleUpdateModalVisible1(visible: boolean, record: any): void {
this.updateRecord1 = record;
- this.distributionMenuVisible = true;
+ this.distributionMenuVisible = true;
}
private handleCreateModalOk() {
@@ -295,23 +308,21 @@
if (err) {
return;
}
- post("version/insert",
- {
- name: this.createForm.getFieldValue("deviceName"),
- desc: this.createForm.getFieldValue("desc")
- }
- )
+ post("version/insert", {
+ name: this.createForm.getFieldValue("deviceName"),
+ desc: this.createForm.getFieldValue("desc"),
+ })
.then((res: any) => {
if (res.data.code !== 0) {
this.$message.warning(res.data.message, 2);
- return
+ return;
}
this.createForm.resetFields();
this.$message.success(res.data.message, 2);
this.visibleCreateModal = false;
this.loadRuleData(1);
})
- .catch(err => {
+ .catch((err) => {
console.log(err);
});
});
@@ -333,44 +344,41 @@
private created() {
this.createForm = this.$form.createForm(this, { name: "devicesVersion" });
- this.searchForm = this.$form.createForm(this, {name: "devicesVersion"});
+ this.searchForm = this.$form.createForm(this, { name: "devicesVersion" });
this.loadRuleData(1);
}
- private loadRuleData(page:number) {
+ private loadRuleData(page: number) {
this.tableLoading = true;
get("version/query", {
- name: this.serch.name,
- orderType: 1,
- order: 'createTime',
- page: page,
- size: 8
- })
- .then(res => {
- if (res.data.code !== 0) {
- this.$message.error(res.data.message, 2);
- } else {
- this.tableLoading = false;
- this.pagination.current = res.data.data.current;
- this.pagination.total = res.data.data.total;
- this.pagination.pageSize = res.data.data.size;
- this.dataSource = res.data.data.versions;
- }
- });
+ name: this.serch.name,
+ orderType: 1,
+ order: "createTime",
+ page: page,
+ size: this.pagination.pageSize,
+ }).then((res) => {
+ if (res.data.code !== 0) {
+ this.$message.error(res.data.message, 2);
+ } else {
+ this.tableLoading = false;
+ this.pagination.current = res.data.data.current;
+ this.pagination.total = res.data.data.total;
+ this.pagination.pageSize = res.data.data.size;
+ this.dataSource = res.data.data.versions;
+ }
+ });
}
private deleteManageRole(record: any) {
- post("version/delete",
- { id: record.id },
- )
- .then(res => {
+ post("version/delete", { id: record.id })
+ .then((res) => {
if (res.data.code === 0) {
- this.$message.success('������������',2)
+ this.$message.success("������������", 2);
this.loadRuleData(1);
}
})
- .catch(err=> {
- this.$message.warning(err,2)
+ .catch((err) => {
+ this.$message.warning(err, 2);
});
}
--
Gitblit v1.8.0