mirror of
https://github.com/xinnan-tech/xiaozhi-esp32-server.git
synced 2026-07-22 15:13:55 +08:00
@@ -4,20 +4,58 @@ import {getServiceUrl} from '../api'
|
||||
|
||||
export default {
|
||||
// 用户列表
|
||||
getUserList(callback) {
|
||||
getUserList(params, callback) {
|
||||
const queryParams = new URLSearchParams({
|
||||
page: params.page,
|
||||
limit: params.limit,
|
||||
mobile: params.mobile
|
||||
}).toString();
|
||||
|
||||
RequestService.sendRequest()
|
||||
.url(`${getServiceUrl()}/api/v1/admin/users?${queryParams}`)
|
||||
.method('GET')
|
||||
.success((res) => {
|
||||
RequestService.clearRequestTime()
|
||||
callback(res)
|
||||
})
|
||||
.fail((err) => {
|
||||
console.error('请求失败:', err)
|
||||
RequestService.reAjaxFun(() => {
|
||||
this.getUserList(callback)
|
||||
})
|
||||
}).send()
|
||||
},
|
||||
// 删除用户
|
||||
deleteUser(id, callback) {
|
||||
RequestService.sendRequest()
|
||||
.url(`${getServiceUrl()}/api/v1/admin/users`)
|
||||
.method('GET')
|
||||
.url(`${getServiceUrl()}/api/v1/admin/users/${id}`)
|
||||
.method('DELETE')
|
||||
.success((res) => {
|
||||
RequestService.clearRequestTime()
|
||||
callback(res)
|
||||
})
|
||||
.fail((err) => {
|
||||
console.error('请求失败:', err)
|
||||
console.error('删除失败:', err)
|
||||
RequestService.reAjaxFun(() => {
|
||||
this.getUserList(callback)
|
||||
this.deleteUser(id, callback)
|
||||
})
|
||||
}).send()
|
||||
},
|
||||
// 重置用户密码
|
||||
resetUserPassword(id, callback) {
|
||||
RequestService.sendRequest()
|
||||
.url(`${getServiceUrl()}/api/v1/admin/users/${id}`)
|
||||
.method('PUT')
|
||||
.success((res) => {
|
||||
RequestService.clearRequestTime()
|
||||
callback(res)
|
||||
})
|
||||
.send()
|
||||
.fail((err) => {
|
||||
console.error('重置密码失败:', err)
|
||||
RequestService.reAjaxFun(() => {
|
||||
this.resetUserPassword(id, callback)
|
||||
})
|
||||
}).send()
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -0,0 +1,77 @@
|
||||
<template>
|
||||
<el-dialog :visible.sync="visible" width="400px" center>
|
||||
<div style="margin: 22px 15px;">
|
||||
<div style="font-weight: 400;font-size: 14px;text-align: left;color: #3d4566;">
|
||||
<div style="color: red;display: inline-block;">*</div>
|
||||
用户密码:
|
||||
</div>
|
||||
<div class="input-46" style="margin-top: 12px;">
|
||||
<el-input v-model="password" type="text" :readonly="true" style="font-weight: bold; color: #333;"/>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex;margin: 15px 15px;gap: 7px;">
|
||||
<div class="dialog-btn" style="background: #e6ebff;border: 1px solid #adbdff;color: #5778ff;" @click="closeDialog">
|
||||
关闭
|
||||
</div>
|
||||
<div class="dialog-btn" style="background: #5778ff;color: white;" @click="copyPassword">
|
||||
复制密码
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'ViewPasswordDialog',
|
||||
props: {
|
||||
visible: { type: Boolean, required: true },
|
||||
password: { type: String, default: '' }
|
||||
},
|
||||
methods: {
|
||||
closeDialog() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
copyPassword() {
|
||||
navigator.clipboard.writeText(this.password)
|
||||
this.$message.success('密码已复制')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.input-46 {
|
||||
border: 1px solid #e4e6ef;
|
||||
background: #f6f8fb;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.dialog-btn {
|
||||
cursor: pointer;
|
||||
flex: 1;
|
||||
border-radius: 23px;
|
||||
height: 40px;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
::v-deep .el-dialog {
|
||||
border-radius: 15px;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
::v-deep .el-dialog__headerbtn {
|
||||
display: none;
|
||||
}
|
||||
|
||||
::v-deep .el-dialog__body {
|
||||
padding: 4px 6px;
|
||||
}
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
background-color: #f6f8fb !important;
|
||||
cursor: default !important;
|
||||
}
|
||||
</style>
|
||||
@@ -13,9 +13,9 @@
|
||||
<el-card class="user-card" shadow="never">
|
||||
<el-table :data="userList" class="transparent-table" :header-cell-class-name="headerCellClassName">
|
||||
<el-table-column label="选择" type="selection" align="center" width="120"></el-table-column>
|
||||
<el-table-column label="用户Id" prop="user_id" align="center"></el-table-column>
|
||||
<el-table-column label="用户Id" prop="userid" align="center"></el-table-column>
|
||||
<el-table-column label="手机号码" prop="mobile" align="center"></el-table-column>
|
||||
<el-table-column label="设备数量" prop="device_count" align="center"></el-table-column>
|
||||
<el-table-column label="设备数量" prop="deviceCount" align="center"></el-table-column>
|
||||
<el-table-column label="状态" prop="status" align="center"></el-table-column>
|
||||
<el-table-column label="操作" align="center">
|
||||
<template slot-scope="scope">
|
||||
@@ -42,13 +42,7 @@
|
||||
<button class="pagination-btn" :disabled="currentPage === 1" @click="goFirst">首页</button>
|
||||
<button class="pagination-btn" :disabled="currentPage === 1" @click="goPrev">上一页</button>
|
||||
|
||||
<button
|
||||
v-for="page in visiblePages"
|
||||
:key="page"
|
||||
class="pagination-btn"
|
||||
:class="{ active: page === currentPage }"
|
||||
@click="goToPage(page)"
|
||||
>
|
||||
<button v-for="page in visiblePages" :key="page" class="pagination-btn" :class="{ active: page === currentPage }" @click="goToPage(page)">
|
||||
{{ page }}
|
||||
</button>
|
||||
|
||||
@@ -61,6 +55,7 @@
|
||||
<div style="font-size: 12px; font-weight: 400; margin-top: auto; padding-top: 30px; color: #979db1;">
|
||||
©2025 xiaozhi-esp32-server
|
||||
</div>
|
||||
<view-password-dialog :visible.sync="showViewPassword" :password="currentPassword"/>
|
||||
</el-main>
|
||||
</div>
|
||||
</template>
|
||||
@@ -68,18 +63,19 @@
|
||||
<script>
|
||||
import HeaderBar from "@/components/HeaderBar.vue";
|
||||
import adminApi from '@/apis/module/admin';
|
||||
|
||||
import ViewPasswordDialog from '@/components/ViewPasswordDialog.vue'
|
||||
|
||||
export default {
|
||||
components: { HeaderBar },
|
||||
components: { HeaderBar, ViewPasswordDialog },
|
||||
data() {
|
||||
return {
|
||||
showViewPassword: false,
|
||||
currentPassword: '', // 存储获取到的密码
|
||||
searchPhone: '',
|
||||
userList: [],
|
||||
originalUserList: [], // 原始数据
|
||||
currentPage: 1,
|
||||
pageSize: 5,
|
||||
total: 20
|
||||
total: 0
|
||||
};
|
||||
},
|
||||
created() {
|
||||
@@ -108,43 +104,43 @@ export default {
|
||||
methods: {
|
||||
// 获取用户列表
|
||||
fetchUsers() {
|
||||
adminApi.getUserList(({data}) => {
|
||||
if (data.code === 0) {
|
||||
const responseData = data.data[0] || data.data;
|
||||
this.originalUserList = responseData.list.map(user => ({
|
||||
...user,
|
||||
status: user.status === '1' ? '正常' : '禁用'
|
||||
}));
|
||||
this.userList = [...this.originalUserList];
|
||||
this.total = responseData.totalCount || 0;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 分页变化
|
||||
handleCurrentChange(page) {
|
||||
this.currentPage = page;
|
||||
this.fetchUsers();
|
||||
adminApi.getUserList({
|
||||
page: this.currentPage,
|
||||
limit: this.pageSize,
|
||||
mobile: this.searchPhone
|
||||
}, ({ data }) => {
|
||||
if (data.code === 0) {
|
||||
this.userList = data.data.list.map(user => ({
|
||||
...user,
|
||||
status: user.status === '1' ? '正常' : '禁用'
|
||||
}));
|
||||
this.total = data.data.total;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 搜索
|
||||
handleSearch() {
|
||||
if (!this.searchPhone) {
|
||||
this.userList = [...this.originalUserList];
|
||||
return;
|
||||
}
|
||||
this.userList = this.originalUserList.filter(user =>
|
||||
user.mobile.includes(this.searchPhone)
|
||||
)},
|
||||
this.currentPage = 1;
|
||||
this.fetchUsers();
|
||||
},
|
||||
batchDelete() {
|
||||
console.log('执行批量删除操作');
|
||||
},
|
||||
batchDisable() {
|
||||
console.log('执行批量禁用操作');
|
||||
},
|
||||
// 重置密码
|
||||
resetPassword(row) {
|
||||
console.log('重置用户密码,用户:', row);
|
||||
},
|
||||
adminApi.resetUserPassword(row.userid, ({ data }) => {
|
||||
if (data.code === 0) {
|
||||
this.currentPassword = data.data
|
||||
this.showViewPassword = true
|
||||
} else {
|
||||
this.$message.error(data.msg || '获取密码失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
disableUser(row) {
|
||||
row.status = '禁用';
|
||||
console.log('禁用用户:', row);
|
||||
@@ -153,8 +149,22 @@ export default {
|
||||
row.status = '正常';
|
||||
console.log('恢复用户:', row);
|
||||
},
|
||||
// 用户删除
|
||||
deleteUser(row) {
|
||||
console.log('删除用户:', row);
|
||||
this.$confirm('确定要删除该用户吗?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
adminApi.deleteUser(row.userid, ({data}) => {
|
||||
if (data.code === 0) {
|
||||
this.$message.success('删除成功')
|
||||
this.fetchUsers()
|
||||
} else {
|
||||
this.$message.error(data.msg || '删除失败')
|
||||
}
|
||||
})
|
||||
}).catch(() => {})
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.pageSize = val;
|
||||
@@ -168,23 +178,23 @@ export default {
|
||||
},
|
||||
goFirst() {
|
||||
this.currentPage = 1;
|
||||
this.handleCurrentChange(1);
|
||||
this.fetchUsers();
|
||||
},
|
||||
goPrev() {
|
||||
if (this.currentPage > 1) {
|
||||
this.currentPage--;
|
||||
this.handleCurrentChange(this.currentPage);
|
||||
this.fetchUsers();
|
||||
}
|
||||
},
|
||||
goNext() {
|
||||
if (this.currentPage < this.pageCount) {
|
||||
this.currentPage++;
|
||||
this.handleCurrentChange(this.currentPage);
|
||||
this.fetchUsers();
|
||||
}
|
||||
},
|
||||
goToPage(page) {
|
||||
this.currentPage = page;
|
||||
this.handleCurrentChange(page);
|
||||
this.fetchUsers();
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user