|
|
@ -1,12 +1,5 @@
|
|
|
|
<!--
|
|
|
|
|
|
|
|
* @Author: donghao donghao@supervision.ltd
|
|
|
|
|
|
|
|
* @Date: 2025-03-06 15:15:47
|
|
|
|
|
|
|
|
* @LastEditors: donghao donghao@supervision.ltd
|
|
|
|
|
|
|
|
* @LastEditTime: 2025-03-11 14:46:58
|
|
|
|
|
|
|
|
* @FilePath: \vite-ai\data-dashboard\src\views\dashboard\DeviceStatus.vue
|
|
|
|
|
|
|
|
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
|
|
|
|
|
|
|
-->
|
|
|
|
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
|
|
|
|
<div class="bg_basic_content">
|
|
|
|
<div class="device-status-header mt-[32px]">
|
|
|
|
<div class="device-status-header mt-[32px]">
|
|
|
|
<ContentHeader bgLayout="1855">
|
|
|
|
<ContentHeader bgLayout="1855">
|
|
|
|
<template #title>
|
|
|
|
<template #title>
|
|
|
@ -16,28 +9,12 @@
|
|
|
|
</ContentHeader>
|
|
|
|
</ContentHeader>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="px-[16px] device-status-content-box">
|
|
|
|
<div class="px-[16px] device-status-content-box">
|
|
|
|
<div class="device-status-search-box">
|
|
|
|
<div class="mt-[16px] bg-transparent baseTable_wrap full_table" v-loading="dataLoading" :element-loading-svg="svg"
|
|
|
|
<el-select v-model="formData.name" placeholder="设备名称" class="custom-select">
|
|
|
|
|
|
|
|
<el-option label="设备A" value="deviceA"></el-option>
|
|
|
|
|
|
|
|
<el-option label="设备B" value="deviceB"></el-option>
|
|
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
<el-select v-model="formData.deviceId" placeholder="设备ID" class="custom-select">
|
|
|
|
|
|
|
|
<el-option label="ID-001" value="id001"></el-option>
|
|
|
|
|
|
|
|
<el-option label="ID-002" value="id002"></el-option>
|
|
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
<el-button type="primary" @click="handleQuery" class="query-btn">
|
|
|
|
|
|
|
|
<i class="el-icon-search"></i> 查询
|
|
|
|
|
|
|
|
</el-button>
|
|
|
|
|
|
|
|
<el-button @click="handleReset" class="reset-btn">
|
|
|
|
|
|
|
|
<i class="el-icon-refresh-right"></i> 重置
|
|
|
|
|
|
|
|
</el-button>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="bg-transparent baseTable_wrap" v-loading="dataLoading" :element-loading-svg="svg"
|
|
|
|
|
|
|
|
element-loading-svg-view-box="-10, -10, 50, 50">
|
|
|
|
element-loading-svg-view-box="-10, -10, 50, 50">
|
|
|
|
<template v-if="pagination.total > 0">
|
|
|
|
<template v-if="pagination.total > 0">
|
|
|
|
<BaseTable class="bg-transparent baseTable_box" :total="pagination.total"
|
|
|
|
<BaseTable class="bg-transparent baseTable_box" :total="pagination.total"
|
|
|
|
:pageSize="pagination.pageSize" :dataSource="listData" :isFixedPagination="true" :columns="columns"
|
|
|
|
:pageSize="pagination.pageSize" :dataSource="listData" :isFixedPagination="true"
|
|
|
|
:page="pagination.currentPage" @change="handleTableChange">
|
|
|
|
:columns="columns" :page="pagination.currentPage" @change="handleTableChange">
|
|
|
|
<template v-slot:actionBar="{ row }">
|
|
|
|
<template v-slot:actionBar="{ row }">
|
|
|
|
<ul class="flex table_action_box">
|
|
|
|
<ul class="flex table_action_box">
|
|
|
|
<li class="flex items-center mr-[16px]" @click="openCurrent(row)">
|
|
|
|
<li class="flex items-center mr-[16px]" @click="openCurrent(row)">
|
|
|
@ -66,6 +43,7 @@
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
@ -196,10 +174,10 @@ const listData = ref([]);
|
|
|
|
|
|
|
|
|
|
|
|
// const searchValue = ref("");
|
|
|
|
// const searchValue = ref("");
|
|
|
|
|
|
|
|
|
|
|
|
const formData = reactive({
|
|
|
|
// const formData = reactive({
|
|
|
|
name: "",
|
|
|
|
// name: "",
|
|
|
|
status: ""
|
|
|
|
// status: ""
|
|
|
|
});
|
|
|
|
// });
|
|
|
|
|
|
|
|
|
|
|
|
const dataLoading = ref(true);
|
|
|
|
const dataLoading = ref(true);
|
|
|
|
|
|
|
|
|
|
|
@ -207,7 +185,7 @@ const getList = async () => {
|
|
|
|
const { currentPage, pageSize } = pagination.value;
|
|
|
|
const { currentPage, pageSize } = pagination.value;
|
|
|
|
const res = await fetch('/api/getDeviceStatusList', {
|
|
|
|
const res = await fetch('/api/getDeviceStatusList', {
|
|
|
|
method: 'POST',
|
|
|
|
method: 'POST',
|
|
|
|
body: JSON.stringify({ ...formData, page: currentPage, pageSize })
|
|
|
|
body: JSON.stringify({ page: currentPage, pageSize })
|
|
|
|
})
|
|
|
|
})
|
|
|
|
const { data } = await res.json()
|
|
|
|
const { data } = await res.json()
|
|
|
|
console.log(data, 'getList_data')
|
|
|
|
console.log(data, 'getList_data')
|
|
|
@ -219,18 +197,6 @@ const getList = async () => {
|
|
|
|
};
|
|
|
|
};
|
|
|
|
dataLoading.value = false;
|
|
|
|
dataLoading.value = false;
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
// 查询方法
|
|
|
|
|
|
|
|
const handleQuery = () => {
|
|
|
|
|
|
|
|
getList()
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 重置方法
|
|
|
|
|
|
|
|
const handleReset = () => {
|
|
|
|
|
|
|
|
formData.name = '';
|
|
|
|
|
|
|
|
formData.deviceId = '';
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function handleTableChange(record) {
|
|
|
|
function handleTableChange(record) {
|
|
|
|
console.log("handleTableChange_record", record);
|
|
|
|
console.log("handleTableChange_record", record);
|
|
|
|
pagination.value = {
|
|
|
|
pagination.value = {
|
|
|
|