.
This commit is contained in:
224
web/src/App.vue
Normal file
224
web/src/App.vue
Normal file
@@ -0,0 +1,224 @@
|
||||
<template>
|
||||
<a-layout class="layout">
|
||||
<a-layout-header class="header">
|
||||
<div class="header-content">
|
||||
<h2>Go Desk</h2>
|
||||
<a-tabs v-model:active-key="activeTab" class="header-tabs">
|
||||
<a-tab-pane key="user" title="用户查询" />
|
||||
<a-tab-pane key="device" title="设备调用测试" />
|
||||
</a-tabs>
|
||||
</div>
|
||||
</a-layout-header>
|
||||
<a-layout-content class="content">
|
||||
<!-- 用户查询页面 -->
|
||||
<div v-if="activeTab === 'user'">
|
||||
<!-- 查询表单 -->
|
||||
<a-card class="search-card">
|
||||
<a-form :model="formModel" layout="inline">
|
||||
<a-form-item label="关键字">
|
||||
<a-input
|
||||
v-model="formModel.keyword"
|
||||
placeholder="姓名、账号、电话"
|
||||
allow-clear
|
||||
style="width: 200px"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="状态">
|
||||
<a-select
|
||||
v-model="formModel.status"
|
||||
placeholder="选择状态"
|
||||
style="width: 120px"
|
||||
>
|
||||
<a-option :value="0">全部</a-option>
|
||||
<a-option :value="1">正常</a-option>
|
||||
<a-option :value="2">停用</a-option>
|
||||
<a-option :value="3">已删除</a-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-space>
|
||||
<a-button type="primary" @click="handleSearch">
|
||||
<template #icon>
|
||||
<icon-search />
|
||||
</template>
|
||||
查询
|
||||
</a-button>
|
||||
<a-button @click="handleReset">
|
||||
<template #icon>
|
||||
<icon-refresh />
|
||||
</template>
|
||||
重置
|
||||
</a-button>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
|
||||
<!-- 数据表格 -->
|
||||
<a-card class="table-card">
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data="tableData"
|
||||
:loading="loading"
|
||||
:pagination="pagination"
|
||||
@page-change="handlePageChange"
|
||||
@page-size-change="handlePageSizeChange"
|
||||
>
|
||||
<template #status="{ record }">
|
||||
<a-tag v-if="record.status === 1" color="green">正常</a-tag>
|
||||
<a-tag v-else-if="record.status === 2" color="orange">停用</a-tag>
|
||||
<a-tag v-else-if="record.status === 3" color="gray">已删除</a-tag>
|
||||
</template>
|
||||
</a-table>
|
||||
</a-card>
|
||||
</div>
|
||||
|
||||
<!-- 设备调用测试页面 -->
|
||||
<DeviceTest v-if="activeTab === 'device'" />
|
||||
</a-layout-content>
|
||||
</a-layout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { Message } from '@arco-design/web-vue'
|
||||
import DeviceTest from './components/DeviceTest.vue'
|
||||
|
||||
const activeTab = ref('user')
|
||||
const loading = ref(false)
|
||||
const formModel = ref({
|
||||
keyword: '',
|
||||
status: 0,
|
||||
role: 0,
|
||||
organid: 0
|
||||
})
|
||||
const tableData = ref([])
|
||||
const pagination = ref({
|
||||
current: 1,
|
||||
pageSize: 20,
|
||||
total: 0,
|
||||
showPageSize: true,
|
||||
showTotal: true
|
||||
})
|
||||
|
||||
const columns = [
|
||||
{ title: '编号', dataIndex: 'memberid', width: 80 },
|
||||
{ title: '姓名', dataIndex: 'membername', width: 120 },
|
||||
{ title: '账号', dataIndex: 'account', width: 150 },
|
||||
{ title: '联系电话', dataIndex: 'contactphone', width: 130 },
|
||||
{ title: '机构ID', dataIndex: 'organid', width: 100 },
|
||||
{ title: '状态', dataIndex: 'status', slotName: 'status', width: 80 },
|
||||
{ title: '创建时间', dataIndex: 'createtime', width: 180 },
|
||||
{ title: '修改时间', dataIndex: 'updatetime', width: 180 }
|
||||
]
|
||||
|
||||
const loadData = async () => {
|
||||
if (!window.go || !window.go.main || !window.go.main.App || !window.go.main.App.QueryUsers) {
|
||||
console.error('Go 后端未就绪，请确保应用已启动')
|
||||
loading.value = false
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
const result = await window.go.main.App.QueryUsers(
|
||||
formModel.value.keyword || '',
|
||||
formModel.value.status || 0,
|
||||
formModel.value.role || 0,
|
||||
formModel.value.organid || 0,
|
||||
pagination.value.current,
|
||||
pagination.value.pageSize,
|
||||
'createtime',
|
||||
'descend'
|
||||
)
|
||||
|
||||
if (result && result.rows) {
|
||||
tableData.value = result.rows
|
||||
pagination.value.total = result.total || 0
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('查询失败:', error)
|
||||
Message.error('查询失败: ' + (error.message || error))
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const handleSearch = () => {
|
||||
pagination.value.current = 1
|
||||
loadData()
|
||||
}
|
||||
|
||||
const handleReset = () => {
|
||||
formModel.value = {
|
||||
keyword: '',
|
||||
status: 0,
|
||||
role: 0,
|
||||
organid: 0
|
||||
}
|
||||
pagination.value.current = 1
|
||||
loadData()
|
||||
}
|
||||
|
||||
const handlePageChange = (page) => {
|
||||
pagination.value.current = page
|
||||
loadData()
|
||||
}
|
||||
|
||||
const handlePageSizeChange = (pageSize) => {
|
||||
pagination.value.pageSize = pageSize
|
||||
pagination.value.current = 1
|
||||
loadData()
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
loadData()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.layout {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.header {
|
||||
background: var(--color-bg-2);
|
||||
border-bottom: 1px solid var(--color-border);
|
||||
}
|
||||
|
||||
.header-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 100%;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.header-content h2 {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.header-tabs {
|
||||
flex: 1;
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 20px;
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
background: var(--color-bg-1);
|
||||
}
|
||||
|
||||
.search-card {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.table-card {
|
||||
flex: 1;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user