parent
510bf01362
commit
f50aa032b3
@ -0,0 +1,17 @@ |
|||||||
|
import request from "@/utils/request"; |
||||||
|
import { AxiosPromise } from "axios"; |
||||||
|
import { RemoteDevInfoVO, UnBindingForm } from "@/api/remote/types"; |
||||||
|
|
||||||
|
export function remoteDevInfo(devId: number): AxiosPromise<RemoteDevInfoVO> { |
||||||
|
return request({ |
||||||
|
url: `/api/equipment/v1/remote/${devId}`, |
||||||
|
method: "GET", |
||||||
|
}); |
||||||
|
} |
||||||
|
export function remoteUnbindingLogicId(data: UnBindingForm) { |
||||||
|
return request({ |
||||||
|
url: `/api/equipment/v1/remote/unbinding`, |
||||||
|
method: "POST", |
||||||
|
data, |
||||||
|
}); |
||||||
|
} |
@ -0,0 +1,53 @@ |
|||||||
|
export interface RemoteDevInfoVO { |
||||||
|
devId?: number; |
||||||
|
|
||||||
|
devAdNo?: string; |
||||||
|
|
||||||
|
devSno?: string; |
||||||
|
|
||||||
|
devPppoe?: string; |
||||||
|
|
||||||
|
devVendorName?: string; |
||||||
|
|
||||||
|
devVendorOui?: string; |
||||||
|
|
||||||
|
devTypeName?: string; |
||||||
|
|
||||||
|
devHardVer?: string; |
||||||
|
|
||||||
|
softVer?: string; |
||||||
|
|
||||||
|
domain?: string; |
||||||
|
|
||||||
|
devRemark1?: string; |
||||||
|
|
||||||
|
userSnNo?: string; |
||||||
|
|
||||||
|
useState?: string; |
||||||
|
|
||||||
|
devIp?: string; |
||||||
|
|
||||||
|
devStatus?: string; |
||||||
|
|
||||||
|
customType?: string; |
||||||
|
|
||||||
|
conType?: string; |
||||||
|
|
||||||
|
devOnlineTime?: string; |
||||||
|
|
||||||
|
devAccessType?: string; |
||||||
|
|
||||||
|
devTypeNameDetail?: string; |
||||||
|
|
||||||
|
blacklist?: string; |
||||||
|
|
||||||
|
devRemark4?: string; |
||||||
|
} |
||||||
|
|
||||||
|
export interface UnBindingForm { |
||||||
|
devId?: number; |
||||||
|
devAdNo?: string; |
||||||
|
devSno?: string; |
||||||
|
devVendorOui?: string; |
||||||
|
devRemark4?: string; |
||||||
|
} |
@ -0,0 +1,386 @@ |
|||||||
|
<template> |
||||||
|
<div class="app-container"> |
||||||
|
<el-card shadow="never" v-loading="loading"> |
||||||
|
<el-descriptions title="设备信息" :column="2" border> |
||||||
|
<template |
||||||
|
#extra |
||||||
|
v-if=" |
||||||
|
remote.devRemark4 != null && |
||||||
|
remote.devStatus != '预解绑' && |
||||||
|
remote.devStatus != '预拆机' |
||||||
|
" |
||||||
|
> |
||||||
|
<el-popconfirm |
||||||
|
width="220" |
||||||
|
confirm-button-text="确认" |
||||||
|
cancel-button-text="取消" |
||||||
|
:icon="InfoFilled" |
||||||
|
@confirm="unbindingLogicId" |
||||||
|
icon-color="#626AEF" |
||||||
|
title="确定解绑逻辑ID吗?" |
||||||
|
> |
||||||
|
<template #reference> |
||||||
|
<el-button type="primary">解绑逻辑ID</el-button> |
||||||
|
</template> |
||||||
|
</el-popconfirm> |
||||||
|
</template> |
||||||
|
<el-descriptions-item |
||||||
|
label="AD编号" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.devAdNo }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="设备PPPoE帐号" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.devPppoe }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="设备序列号" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.devVendorOui }}-{{ remote.devSno }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="设备类型和软件版本" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.devVendorName }} {{ remote.devTypeName }} {{ |
||||||
|
remote.devHardVer |
||||||
|
}} {{ remote.softVer }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="设备系统管理域" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.domain }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="黑名单状态" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.blacklist }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="电信维护帐号密码" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.devRemark1 }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="逻辑ID" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.userSnNo }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="安装次数" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.useState }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="IP" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.devIp }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="设备当前状态" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.devStatus }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="客户类型" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.customType }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="拨号方式" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.conType }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="最近一次开机时间" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.devOnlineTime }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="设备网络侧接口" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.devAccessType }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="设备类型" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.devTypeNameDetail }} |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="远程操作" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
<div> |
||||||
|
<el-dropdown split-button placement="right"> |
||||||
|
远程操作列表 |
||||||
|
<template #dropdown> |
||||||
|
<el-dropdown-menu> |
||||||
|
<el-scrollbar height="300"> |
||||||
|
<div v-hasPerm="['family:remote:parameter:tree']"> |
||||||
|
<el-dropdown-item>设备参数树浏览</el-dropdown-item> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:ping:test']"> |
||||||
|
<el-dropdown-item divided>设备Ping测试</el-dropdown-item> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:profiles:upload']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>设备配置文件上传</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:terminal:log_file']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>获取设备终端日志文件</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:dev:change']"> |
||||||
|
<el-dropdown-item divided>设备更换</el-dropdown-item> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:dev:reload']"> |
||||||
|
<el-dropdown-item divided>设备远程重启</el-dropdown-item> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:profiles:issued']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>设备厂商配置文件下发</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:full_service:issued']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>设备全业务配置下发</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:soft_ver:upgrade']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>设备软件版本升级</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:loop_back:diagnosis']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>ATMF5Loopback诊断</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:dsl_loop:diagnosis']"> |
||||||
|
<el-dropdown-item divided>DslLoop诊断</el-dropdown-item> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:dev:monitor']"> |
||||||
|
<el-dropdown-item divided>设备监控</el-dropdown-item> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:ida:diagnosis']"> |
||||||
|
<el-dropdown-item divided>IAD诊断</el-dropdown-item> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:service_port:binding']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>修改业务端口绑定</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:terminal:registration']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>开启终端注册页面</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:speed:operation']"> |
||||||
|
<el-dropdown-item divided>测速操作</el-dropdown-item> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:reset:graphs']"> |
||||||
|
<el-dropdown-item divided>终端重置数图</el-dropdown-item> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:iptv:multicast']"> |
||||||
|
<el-dropdown-item divided>重置IPTV组播</el-dropdown-item> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:node:customize']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>自定义节点定制</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:broadband_1_4:itv_2_3']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>宽带1、4口;ITV 2、3口</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:broadband_3_4:itv_1_2']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>宽带3、4口;ITV 1、2口</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:broadband_1:itv_2_3_4']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>宽带1口;ITV 2、3、4口</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:broadband_1_3_4:itv_2']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>宽带1、3、4口;ITV 2口</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:broadband_1_2_3_4']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>宽带1、 2、3、4口</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:broadband_1_3:itv_2']"> |
||||||
|
<el-dropdown-item divided |
||||||
|
>三合一终端宽带1、3口;ITV 2口</el-dropdown-item |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div v-hasPerm="['family:remote:info:update']"> |
||||||
|
<el-dropdown-item divided>通用信息修改</el-dropdown-item> |
||||||
|
</div> |
||||||
|
</el-scrollbar> |
||||||
|
</el-dropdown-menu> |
||||||
|
</template> |
||||||
|
</el-dropdown> |
||||||
|
</div> |
||||||
|
</el-descriptions-item> |
||||||
|
<el-descriptions-item |
||||||
|
label="其他操作" |
||||||
|
label-align="left" |
||||||
|
align="center" |
||||||
|
label-class-name="my-label" |
||||||
|
class-name="my-content" |
||||||
|
width="150px" |
||||||
|
> |
||||||
|
{{ remote.devTypeNameDetail }} |
||||||
|
</el-descriptions-item> |
||||||
|
</el-descriptions> |
||||||
|
</el-card> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup lang="ts"> |
||||||
|
import { RemoteDevInfoVO, UnBindingForm } from "@/api/remote/types"; |
||||||
|
import { remoteDevInfo, remoteUnbindingLogicId } from "@/api/remote"; |
||||||
|
import { InfoFilled } from "@element-plus/icons-vue"; |
||||||
|
|
||||||
|
const route = useRoute(); |
||||||
|
let devId: number = parseInt(<string>route.params.devId); |
||||||
|
const remote = ref<RemoteDevInfoVO>({}); |
||||||
|
const unbindingForm = ref<UnBindingForm>({}); |
||||||
|
const loading = ref<boolean>(false); |
||||||
|
const getData = () => { |
||||||
|
loading.value = true; |
||||||
|
remoteDevInfo(devId) |
||||||
|
.then(({ data }) => { |
||||||
|
remote.value = data; |
||||||
|
}) |
||||||
|
.finally(() => { |
||||||
|
loading.value = false; |
||||||
|
}); |
||||||
|
}; |
||||||
|
const unbindingLogicId = () => { |
||||||
|
let { devId, devAdNo, devSno, devVendorOui, devRemark4 } = remote.value; |
||||||
|
unbindingForm.value = { |
||||||
|
devId, |
||||||
|
devVendorOui, |
||||||
|
devAdNo, |
||||||
|
devSno, |
||||||
|
devRemark4, |
||||||
|
}; |
||||||
|
loading.value = true; |
||||||
|
remoteUnbindingLogicId(unbindingForm.value) |
||||||
|
.then(() => { |
||||||
|
ElMessage({ |
||||||
|
message: "解绑逻辑ID成功", |
||||||
|
type: "success", |
||||||
|
duration: 1000, |
||||||
|
onClose: () => { |
||||||
|
getData(); |
||||||
|
}, |
||||||
|
}); |
||||||
|
}) |
||||||
|
.finally(() => { |
||||||
|
loading.value = false; |
||||||
|
}); |
||||||
|
}; |
||||||
|
onMounted(() => { |
||||||
|
getData(); |
||||||
|
}); |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
:deep(.my-label) { |
||||||
|
background: var(--el-color-white) !important; |
||||||
|
} |
||||||
|
</style> |
@ -0,0 +1,228 @@ |
|||||||
|
<template> |
||||||
|
<div class="app-container"> |
||||||
|
<div class="search-container"> |
||||||
|
<el-form :model="queryForm" :inline="true"> |
||||||
|
<el-row> |
||||||
|
<el-col :span="6"> |
||||||
|
<el-form-item label="查询条件" prop="selectName"> |
||||||
|
<el-select |
||||||
|
v-model="queryForm.selectName" |
||||||
|
placeholder="请选择" |
||||||
|
style="width: 240px" |
||||||
|
@change="resetSelect" |
||||||
|
clearable |
||||||
|
> |
||||||
|
<el-option |
||||||
|
v-for="item in options" |
||||||
|
:key="item.value" |
||||||
|
:label="item.label" |
||||||
|
:value="item.value" |
||||||
|
/> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="6" v-if="queryForm.selectName !== undefined"> |
||||||
|
<el-form-item prop="selectValue"> |
||||||
|
<el-input |
||||||
|
v-model="queryForm.selectValue" |
||||||
|
placeholder="请输入" |
||||||
|
style="width: 300px" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="buttonColSpan"> |
||||||
|
<el-form-item> |
||||||
|
<el-button type="primary" :icon="Search" @click="handleQuery" |
||||||
|
>搜索 |
||||||
|
</el-button> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
</el-form> |
||||||
|
</div> |
||||||
|
<el-card shadow="never"> |
||||||
|
<template #header> |
||||||
|
<div class="head-parent-right"> |
||||||
|
<table-bar :columns="columns" @change-columns="changeColumns" /> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<div class="any-table"> |
||||||
|
<el-table |
||||||
|
:data="tableData" |
||||||
|
style="width: 100%" |
||||||
|
max-height="380" |
||||||
|
v-loading="loading" |
||||||
|
> |
||||||
|
<el-table-column |
||||||
|
label="设备标识" |
||||||
|
align="center" |
||||||
|
width="240" |
||||||
|
fixed |
||||||
|
show-overflow-tooltip |
||||||
|
v-if="columns[0].show" |
||||||
|
> |
||||||
|
<template #default="scope"> |
||||||
|
<el-button |
||||||
|
type="primary" |
||||||
|
link |
||||||
|
@click="skipRemoteInfo(scope.row.devId)" |
||||||
|
>{{ scope.row.devVendorOui }}-{{ scope.row.devSno }}</el-button |
||||||
|
> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column |
||||||
|
label="AD编号" |
||||||
|
align="center" |
||||||
|
width="200" |
||||||
|
prop="devAdNo" |
||||||
|
v-if="columns[1].show" |
||||||
|
/> |
||||||
|
<el-table-column |
||||||
|
label="宽带账号" |
||||||
|
align="center" |
||||||
|
prop="devPppoe" |
||||||
|
width="200" |
||||||
|
v-if="columns[2].show" |
||||||
|
/> |
||||||
|
<el-table-column |
||||||
|
label="设备类型" |
||||||
|
align="center" |
||||||
|
width="200" |
||||||
|
show-overflow-tooltip |
||||||
|
v-if="columns[3].show" |
||||||
|
> |
||||||
|
<template #default="scope"> |
||||||
|
{{ scope.row.devVendorName }} {{ |
||||||
|
scope.row.devTypeName |
||||||
|
}} {{ scope.row.devHardVer }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column |
||||||
|
label="软件版本" |
||||||
|
align="center" |
||||||
|
prop="softVer" |
||||||
|
width="200" |
||||||
|
v-if="columns[4].show" |
||||||
|
/> |
||||||
|
<el-table-column |
||||||
|
label="设备上行方式" |
||||||
|
align="center" |
||||||
|
v-if="columns[5].show" |
||||||
|
/> |
||||||
|
<el-table-column |
||||||
|
label="设备在线时间" |
||||||
|
align="center" |
||||||
|
prop="devOnlineTime" |
||||||
|
v-if="columns[6].show" |
||||||
|
/> |
||||||
|
<el-table-column |
||||||
|
label="设备状态" |
||||||
|
align="center" |
||||||
|
prop="devStatus" |
||||||
|
v-if="columns[7].show" |
||||||
|
> |
||||||
|
<template #default="scope"> |
||||||
|
<el-tag>{{ scope.row.devStatus }}</el-tag> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column |
||||||
|
label="是否合法" |
||||||
|
align="center" |
||||||
|
v-if="columns[8].show" |
||||||
|
> |
||||||
|
<template #default="scope"> |
||||||
|
<el-tag v-if="scope.row.devStatus === '未注册'">非法</el-tag> |
||||||
|
<el-tag v-else>正常</el-tag> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column |
||||||
|
label="在线状态" |
||||||
|
align="center" |
||||||
|
prop="devOnline" |
||||||
|
v-if="columns[9].show" |
||||||
|
> |
||||||
|
<template #default="scope"> |
||||||
|
<el-tag>{{ scope.row.devOnline }}</el-tag> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="操作" align="center" width="200"> |
||||||
|
<template #default> |
||||||
|
<el-button link type="primary">故障管理</el-button> |
||||||
|
<el-divider direction="vertical" /> |
||||||
|
<el-button link type="primary">网络应用</el-button> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
<pagination |
||||||
|
v-if="total > 0" |
||||||
|
v-model:total="total" |
||||||
|
v-model:page="queryForm.pageNum" |
||||||
|
v-model:limit="queryForm.pageSize" |
||||||
|
@pagination="handleQuery" |
||||||
|
/> |
||||||
|
</div> |
||||||
|
</el-card> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup lang="ts"> |
||||||
|
import { Search } from "@element-plus/icons-vue"; |
||||||
|
import { RemoteEquipmentTable } from "@/api/resources-equipment/types"; |
||||||
|
import { remoteTablePage } from "@/api/resources-equipment"; |
||||||
|
defineOptions({ |
||||||
|
name: "RemoteOperation", |
||||||
|
inheritAttrs: false, |
||||||
|
}); |
||||||
|
const queryForm = ref<SelectForm>({ |
||||||
|
pageNum: 1, |
||||||
|
pageSize: 10, |
||||||
|
}); |
||||||
|
const total = ref<number>(0); |
||||||
|
const options = ref<OptionType[]>([ |
||||||
|
{ label: "设备序列号", value: "devSno" }, |
||||||
|
{ label: "设备AD编号", value: "devAdNo" }, |
||||||
|
]); |
||||||
|
const loading = ref<boolean>(false); |
||||||
|
const buttonColSpan = computed(() => { |
||||||
|
return queryForm.value.selectName === undefined ? 18 : 12; |
||||||
|
}); |
||||||
|
const router = useRouter(); |
||||||
|
const tableData = ref<RemoteEquipmentTable[]>([]); |
||||||
|
const resetSelect = () => { |
||||||
|
queryForm.value.selectValue = undefined; |
||||||
|
}; |
||||||
|
const columns = ref<TableColumns[]>([ |
||||||
|
{ name: "设备标识", show: true }, |
||||||
|
{ name: "AD编号", show: true }, |
||||||
|
{ name: "PPPOE账号", show: true }, |
||||||
|
{ name: "设备类型", show: true }, |
||||||
|
{ name: "软件版本", show: true }, |
||||||
|
{ name: "设备上行方式", show: false }, |
||||||
|
{ name: "设备在线时间", show: false }, |
||||||
|
{ name: "设备状态", show: true }, |
||||||
|
{ name: "是否合法", show: true }, |
||||||
|
{ name: "在线状态", show: true }, |
||||||
|
]); |
||||||
|
const changeColumns = (newColumns: TableColumns[]) => { |
||||||
|
columns.value = newColumns; |
||||||
|
}; |
||||||
|
const handleQuery = () => { |
||||||
|
if (queryForm.value.selectValue === undefined) { |
||||||
|
return; |
||||||
|
} |
||||||
|
loading.value = true; |
||||||
|
remoteTablePage(queryForm.value) |
||||||
|
.then(({ data }) => { |
||||||
|
tableData.value = data.list; |
||||||
|
total.value = data.total; |
||||||
|
}) |
||||||
|
.finally(() => { |
||||||
|
loading.value = false; |
||||||
|
}); |
||||||
|
}; |
||||||
|
const skipRemoteInfo = (devId: number) => { |
||||||
|
router.push({ path: `/resources/remote-info/${devId}` }); |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped></style> |
Loading…
Reference in new issue