diff --git a/main/manager-web/src/apis/module/model.js b/main/manager-web/src/apis/module/model.js new file mode 100644 index 00000000..2534bb5a --- /dev/null +++ b/main/manager-web/src/apis/module/model.js @@ -0,0 +1,30 @@ +import RequestService from '../httpRequest' +import {getServiceUrl} from '../api' + + +export default { + // 获取模型配置列表 + getModelList(params, callback) { + const queryParams = new URLSearchParams({ + modelType: params.modelType, + modelName: params.modelName || '', + page: params.page || 0, + limit: params.limit || 10 + }).toString(); + + RequestService.sendRequest() + .url(`${getServiceUrl()}/api/v1/models/models/list?${queryParams}`) + .method('GET') + .success((res) => { + RequestService.clearRequestTime() + callback(res) + }) + .fail((err) => { + console.error('获取模型列表失败:', err) + RequestService.reAjaxFun(() => { + this.getModelList(params, callback) + }) + }).send() + }, + +} diff --git a/main/manager-web/src/views/ModelConfig.vue b/main/manager-web/src/views/ModelConfig.vue index ba252620..3345fb2c 100644 --- a/main/manager-web/src/views/ModelConfig.vue +++ b/main/manager-web/src/views/ModelConfig.vue @@ -97,8 +97,16 @@ 删除 -
- +
+ + + + + + + 共{{ total }}条记录
@@ -143,6 +151,28 @@ export default { isAllSelected: false }; }, + + computed: { + pageCount() { + return Math.ceil(this.total / this.pageSize); + }, + visiblePages() { + const pages = []; + const maxVisible = 3; + let start = Math.max(1, this.currentPage - 1); + let end = Math.min(this.pageCount, start + maxVisible - 1); + + if (end - start + 1 < maxVisible) { + start = Math.max(1, end - maxVisible + 1); + } + + for (let i = start; i <= end; i++) { + pages.push(i); + } + return pages; + } + }, + methods: { headerCellClassName({ column, columnIndex }) { if (columnIndex === 0) { @@ -228,6 +258,31 @@ export default { }, handleAddConfirm(newModel) { console.log('新增模型数据:', newModel); + }, + + // 分页器 + goFirst() { + this.currentPage = 1; + this.loadData(); + }, + goPrev() { + if (this.currentPage > 1) { + this.currentPage--; + this.loadData(); + } + }, + goNext() { + if (this.currentPage < this.pageCount) { + this.currentPage++; + this.loadData(); + } + }, + goToPage(page) { + this.currentPage = page; + this.loadData(); + }, + loadData() { + console.log('加载数据,当前页:', this.currentPage); } }, }; @@ -353,6 +408,7 @@ export default { height: 100%; min-width: 600px; overflow-x: auto; + background-color: white; } @@ -573,5 +629,74 @@ export default { padding-right: 10px; } +/* 分页器 */ +.custom-pagination { + display: flex; + align-items: center; + gap: 8px; + margin-top: 15px; + + /* 导航按钮样式 (首页、上一页、下一页) */ + + .pagination-btn:first-child, + .pagination-btn:nth-child(2), + .pagination-btn:nth-last-child(2) { + min-width: 60px; + height: 32px; + padding: 0 12px; + border-radius: 4px; + border: 1px solid #e4e7ed; + background: #DEE7FF; + color: #606266; + font-size: 14px; + cursor: pointer; + transition: all 0.3s ease; + + &:hover { + background: #d7dce6; + } + + &:disabled { + opacity: 0.6; + cursor: not-allowed; + } + } + + /* 数字按钮样式 */ + + .pagination-btn:not(:first-child):not(:nth-child(2)):not(:nth-last-child(2)) { + min-width: 28px; + height: 32px; + padding: 0; + border-radius: 4px; + border: 1px solid transparent; + background: transparent; + color: #606266; + font-size: 14px; + cursor: pointer; + transition: all 0.3s ease; + + &:hover { + background: rgba(245, 247, 250, 0.3); + } + } + + .pagination-btn.active { + background: #5f70f3 !important; + color: #ffffff !important; + border-color: #5f70f3 !important; + + &:hover { + background: #6d7cf5 !important; + } + } + + .total-text { + color: #909399; + font-size: 14px; + margin-left: 10px; + } +} + diff --git a/main/manager-web/src/views/UserManagement.vue b/main/manager-web/src/views/UserManagement.vue index 7e92aa55..aee22aec 100644 --- a/main/manager-web/src/views/UserManagement.vue +++ b/main/manager-web/src/views/UserManagement.vue @@ -231,7 +231,7 @@ export default { row.status = '正常'; console.log('恢复用户:', row); }, - + // 用户删除 deleteUser(row) { this.$confirm('确定要删除该用户吗?', '警告', { @@ -346,9 +346,9 @@ $table-bg-color: #ecf1fd; } .user-card { - background: $table-bg-color; + background: white; border-radius: 12px; - padding: 20px; + padding: 15px; margin: 15px; } @@ -498,11 +498,11 @@ $table-bg-color: #ecf1fd; } :deep(.el-table) { - background: $table-bg-color; + background: white; &.transparent-table { .el-table__header th { - background: $table-bg-color !important; + background: white !important; color: black; } @@ -515,7 +515,7 @@ $table-bg-color: #ecf1fd; } .el-table__body tr { - background-color: $table-bg-color; + background-color: white; td { border: { top: 1px solid rgba(0, 0, 0, 0.04);