|
|
@@ -74,6 +74,19 @@
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
+
|
|
|
+ <el-pagination
|
|
|
+ v-model:current-page="pageNum"
|
|
|
+ v-model:page-size="pageSize"
|
|
|
+ :page-sizes="[10, 20, 50]"
|
|
|
+ :total="total"
|
|
|
+ :hide-on-single-page="false"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ background
|
|
|
+ class="pagination"
|
|
|
+ @size-change="handlePageSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ />
|
|
|
</el-card>
|
|
|
|
|
|
<!-- 添加用户弹窗 -->
|
|
|
@@ -141,7 +154,14 @@ const deviceCode = computed(() => route.query.deviceCode || '')
|
|
|
const deviceName = computed(() => route.query.deviceName || '')
|
|
|
|
|
|
// 列表数据
|
|
|
-const tableData = ref([])
|
|
|
+const allUsers = ref([])
|
|
|
+const pageNum = ref(1)
|
|
|
+const pageSize = ref(10)
|
|
|
+const total = computed(() => allUsers.value.length)
|
|
|
+const tableData = computed(() => {
|
|
|
+ const start = (pageNum.value - 1) * pageSize.value
|
|
|
+ return allUsers.value.slice(start, start + pageSize.value)
|
|
|
+})
|
|
|
const loading = ref(false)
|
|
|
const selectedBindIds = ref([])
|
|
|
|
|
|
@@ -153,12 +173,34 @@ async function loadData() {
|
|
|
loading.value = true
|
|
|
try {
|
|
|
const res = await getDeviceUsers(deviceId.value)
|
|
|
- tableData.value = res.data || []
|
|
|
+ allUsers.value = Array.isArray(res.data) ? res.data : []
|
|
|
+ normalizePageNum()
|
|
|
+ clearSelection()
|
|
|
} finally {
|
|
|
loading.value = false
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+function normalizePageNum() {
|
|
|
+ const maxPage = Math.max(1, Math.ceil(total.value / pageSize.value))
|
|
|
+ if (pageNum.value > maxPage) {
|
|
|
+ pageNum.value = maxPage
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function clearSelection() {
|
|
|
+ selectedBindIds.value = []
|
|
|
+}
|
|
|
+
|
|
|
+function handlePageSizeChange() {
|
|
|
+ pageNum.value = 1
|
|
|
+ clearSelection()
|
|
|
+}
|
|
|
+
|
|
|
+function handleCurrentChange() {
|
|
|
+ clearSelection()
|
|
|
+}
|
|
|
+
|
|
|
/**
|
|
|
* 多选变化(选择的是 bindId,即 user_device.id)
|
|
|
*/
|
|
|
@@ -327,6 +369,12 @@ onMounted(loadData)
|
|
|
flex: 1;
|
|
|
}
|
|
|
|
|
|
+.pagination {
|
|
|
+ margin-top: 16px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+}
|
|
|
+
|
|
|
.add-user-tip {
|
|
|
color: #909399;
|
|
|
font-size: 13px;
|