This commit is contained in:
2026-06-22 11:24:08 +08:00
parent 4e1b30b3cc
commit a4af179c16
14 changed files with 612 additions and 36 deletions
-2
View File
@@ -18,7 +18,6 @@ declare module 'vue' {
ElAvatar: typeof import('element-plus/es')['ElAvatar']
ElBacktop: typeof import('element-plus/es')['ElBacktop']
ElButton: typeof import('element-plus/es')['ElButton']
ElButtonGroup: typeof import('element-plus/es')['ElButtonGroup']
ElCard: typeof import('element-plus/es')['ElCard']
ElCascader: typeof import('element-plus/es')['ElCascader']
ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
@@ -40,7 +39,6 @@ declare module 'vue' {
ElFormItem: typeof import('element-plus/es')['ElFormItem']
ElHeader: typeof import('element-plus/es')['ElHeader']
ElIcon: typeof import('element-plus/es')['ElIcon']
ElImage: typeof import('element-plus/es')['ElImage']
ElInput: typeof import('element-plus/es')['ElInput']
ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
ElLink: typeof import('element-plus/es')['ElLink']
+8
View File
@@ -63,3 +63,11 @@ export function getCursorEquipmentExtractRecords(params) {
params,
});
}
export function getCursorEquipmentIpLogs(params) {
return request({
url: `${baseUrl}/ipLogs`,
method: 'get',
params,
});
}
+8
View File
@@ -88,3 +88,11 @@ export function getCursorEquipmentExtractRecords(params: Record<string, any>) {
params,
});
}
export function getCursorEquipmentIpLogs(params: Record<string, any>) {
return request({
url: `${baseUrl}/ipLogs`,
method: 'get',
params,
});
}
@@ -42,6 +42,12 @@ function copyText(text: unknown, label = '内容') {
ElMessage.success(`${label}已复制`);
});
}
function sourceLabel(source: string) {
if (source === 'report') return '心跳上报';
if (source === 'activateByCode') return '激活码激活';
return source || '-';
}
</script>
<template>
@@ -111,6 +117,59 @@ function copyText(text: unknown, label = '内容') {
</el-descriptions-item>
</el-descriptions>
<!-- IP 信息区块 -->
<template v-if="row.raw?.lastLoginIpInfo || row.lastLoginIpInfo">
<el-divider content-position="left">最后登录 IP 详情</el-divider>
<el-descriptions :column="2" border size="small">
<el-descriptions-item label="出口 IP">
<span class="ip-text">{{ display((row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.query) }}</span>
<el-button
v-if="(row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.query"
link type="primary"
@click="copyText((row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.query, 'IP 地址')"
>复制</el-button>
</el-descriptions-item>
<el-descriptions-item label="来源">
{{ sourceLabel((row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.source) }}
</el-descriptions-item>
<el-descriptions-item label="国家">
{{ display((row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.country) }}
<span v-if="(row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.countryCode" class="country-code">
{{ (row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.countryCode }}
</span>
</el-descriptions-item>
<el-descriptions-item label="/">
{{ display((row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.regionName) }}
</el-descriptions-item>
<el-descriptions-item label="城市">
{{ display((row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.city) }}
</el-descriptions-item>
<el-descriptions-item label="时区">
{{ display((row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.timezone) }}
</el-descriptions-item>
<el-descriptions-item label="ISP 运营商" :span="2">
{{ display((row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.isp) }}
</el-descriptions-item>
<el-descriptions-item label="组织" :span="2">
{{ display((row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.org) }}
</el-descriptions-item>
<el-descriptions-item label="AS 信息" :span="2">
{{ display((row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.asInfo) }}
</el-descriptions-item>
<el-descriptions-item label="经纬度">
{{ (row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.lat }},
{{ (row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.lon }}
</el-descriptions-item>
<el-descriptions-item label="上报时间">
{{ display((row.raw?.lastLoginIpInfo || row.lastLoginIpInfo)?.createTime) }}
</el-descriptions-item>
</el-descriptions>
</template>
<template v-else>
<el-divider content-position="left">最后登录 IP 详情</el-divider>
<div class="no-ip-tip">暂无 IP 记录(客户端未上报 ipInfo</div>
</template>
<template #footer>
<el-button @click="emit('update:modelValue', false)">关闭</el-button>
</template>
@@ -132,6 +191,24 @@ function copyText(text: unknown, label = '内容') {
line-height: 1.6;
}
.ip-text {
font-family: monospace;
font-weight: 600;
margin-right: 4px;
}
.country-code {
color: #909399;
font-size: 12px;
}
.no-ip-tip {
color: #909399;
font-size: 13px;
padding: 12px 0;
text-align: center;
}
:deep(.equipment-detail-dialog) {
max-width: calc(100vw - 24px);
}
@@ -0,0 +1,151 @@
<script lang="ts" setup>
import { ElMessage } from 'element-plus';
const props = defineProps({
modelValue: { type: Boolean, default: false },
row: { type: Object, default: null },
loading: { type: Boolean, default: false },
records: { type: Array as () => Record<string, any>[], default: () => [] },
total: { type: Number, default: 0 },
page: { type: Number, default: 1 },
pageSize: { type: Number, default: 20 },
});
const emit = defineEmits([
'update:modelValue',
'update:page',
'update:page-size',
'refresh',
]);
function handleOpen() {
emit('refresh');
}
function formatTime(value: any) {
if (!value) return '-';
const d = new Date(value);
if (Number.isNaN(d.getTime())) return String(value);
const p = (v: number) => String(v).padStart(2, '0');
return `${d.getFullYear()}-${p(d.getMonth() + 1)}-${p(d.getDate())} ${p(d.getHours())}:${p(d.getMinutes())}:${p(d.getSeconds())}`;
}
function sourceLabel(source: string) {
if (source === 'report') return '心跳上报';
if (source === 'activateByCode') return '激活码激活';
return source || '-';
}
function copyText(text: unknown, label = '内容') {
const value = String(text || '').trim();
if (!value) {
ElMessage.warning(`暂无${label}可复制`);
return;
}
navigator.clipboard.writeText(value).then(() => {
ElMessage.success(`${label}已复制`);
});
}
</script>
<template>
<el-dialog
class="ip-logs-dialog"
:model-value="modelValue"
title="IP 登录日志"
width="900px"
@update:model-value="(v: boolean) => emit('update:modelValue', v)"
@open="handleOpen"
>
<div class="dialog-desc" v-if="row">
<span>设备:{{ row.machineCode || row.id || '-' }}</span>
</div>
<el-table v-loading="loading" :data="records" border stripe size="small" style="width: 100%">
<el-table-column label="IP 地址" width="140" prop="query">
<template #default="{ row: r }">
<span class="ip-text">{{ r.query || '-' }}</span>
<el-button v-if="r.query" link size="small" type="primary" @click="copyText(r.query, 'IP')">复制</el-button>
</template>
</el-table-column>
<el-table-column label="来源" width="110" align="center">
<template #default="{ row: r }">
<el-tag size="small" :type="r.source === 'activateByCode' ? 'warning' : 'info'">
{{ sourceLabel(r.source) }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="国家 / 地区" min-width="140">
<template #default="{ row: r }">
<span>{{ r.country || '-' }}</span>
<span v-if="r.countryCode" class="country-code">{{ r.countryCode }}</span>
</template>
</el-table-column>
<el-table-column label="城市" width="110" prop="city">
<template #default="{ row: r }">{{ r.city || '-' }}</template>
</el-table-column>
<el-table-column label="ISP 运营商" min-width="200" show-overflow-tooltip prop="isp">
<template #default="{ row: r }">{{ r.isp || '-' }}</template>
</el-table-column>
<el-table-column label="时区" width="140" show-overflow-tooltip prop="timezone">
<template #default="{ row: r }">{{ r.timezone || '-' }}</template>
</el-table-column>
<el-table-column label="上报时间" width="170">
<template #default="{ row: r }">{{ formatTime(r.createTime) }}</template>
</el-table-column>
</el-table>
<el-pagination
class="pager"
:current-page="page"
:page-size="pageSize"
background
layout="total, sizes, prev, pager, next"
:page-sizes="[20, 50, 100]"
:total="total"
@current-change="(v: number) => emit('update:page', v)"
@size-change="(v: number) => emit('update:page-size', v)"
/>
<template #footer>
<el-button @click="emit('update:modelValue', false)">关闭</el-button>
<el-button type="primary" :loading="loading" @click="emit('refresh')">刷新</el-button>
</template>
</el-dialog>
</template>
<style scoped lang="less">
.dialog-desc {
margin-bottom: 12px;
color: #606266;
font-size: 13px;
}
.ip-text {
font-family: monospace;
font-weight: 600;
margin-right: 4px;
}
.country-code {
color: #909399;
font-size: 12px;
}
.pager {
display: flex;
justify-content: flex-end;
margin-top: 12px;
}
:deep(.ip-logs-dialog) {
max-width: calc(100vw - 24px);
}
@media (max-width: 768px) {
:deep(.ip-logs-dialog) {
width: calc(100vw - 24px) !important;
margin: 0 auto;
}
}
</style>
@@ -6,6 +6,7 @@ import EditDialog from './components/edit.vue';
import DeleteDialog from './components/delete.vue';
import ActivationRecords from './components/activationRecords.vue';
import ExtractRecords from './components/extractRecords.vue';
import IpLogs from './components/ipLogs.vue';
import {
activateCursorEquipment,
addCursorEquipment,
@@ -13,6 +14,7 @@ import {
getCursorEquipmentActivationRecords,
getCursorEquipmentDetail,
getCursorEquipmentExtractRecords,
getCursorEquipmentIpLogs,
getCursorEquipmentList,
updateCursorEquipment,
} from '../../../api/cursorEquipment';
@@ -59,6 +61,16 @@ const extractState = reactive({
pageSize: 20,
});
const ipLogsState = reactive({
loading: false,
records: [] as EquipmentRow[],
total: 0,
page: 1,
pageSize: 20,
});
const ipLogsVisible = ref(false);
const statusOptions = [
{ label: '未激活', value: 0 },
{ label: '已激活', value: 1 },
@@ -122,6 +134,13 @@ watch(
},
);
watch(
() => [ipLogsState.page, ipLogsState.pageSize],
() => {
if (ipLogsVisible.value) fetchIpLogs();
},
);
function pick(raw: any, ...keys: string[]) {
for (const key of keys) {
if (raw?.[key] !== undefined && raw?.[key] !== null) return raw[key];
@@ -167,6 +186,8 @@ function normalizeRow(raw: any): EquipmentRow {
lastExtractedAt: formatTime(pick(raw, 'last_extracted_at', 'lastExtractedAt', 'extracted_at')),
expiredAt: formatTime(pick(raw, 'expiredAt', 'expired_at', 'expireTime', 'expire_time')),
createdAt: formatTime(pick(raw, 'create_time', 'created_at', 'createdAt', 'CreatedAt')),
lastLoginIp: pick(raw, 'lastLoginIp', 'last_login_ip') || '',
lastLoginIpInfo: raw?.lastLoginIpInfo ?? null,
remark: pick(raw, 'remark', 'Remark'),
raw,
};
@@ -343,6 +364,14 @@ function openExtractRecords(row: EquipmentRow) {
extractVisible.value = true;
}
function openIpLogs(row: EquipmentRow) {
currentRow.value = row;
ipLogsState.page = 1;
ipLogsState.records = [];
ipLogsState.total = 0;
ipLogsVisible.value = true;
}
async function fetchActivationRecords() {
if (!currentRow.value?.id) return;
activationState.loading = true;
@@ -385,6 +414,27 @@ async function fetchExtractRecords() {
}
}
async function fetchIpLogs() {
if (!currentRow.value?.id) return;
ipLogsState.loading = true;
try {
const res = await getCursorEquipmentIpLogs({
equipmentId: currentRow.value.id,
page: ipLogsState.page,
pageSize: ipLogsState.pageSize,
});
if (res?.code !== 200) {
ElMessage.error(res?.msg || '获取 IP 日志失败');
return;
}
const list = Array.isArray(res?.data?.list) ? res.data.list : Array.isArray(res?.data) ? res.data : [];
ipLogsState.records = list;
ipLogsState.total = Number(res?.data?.total || list.length || 0);
} finally {
ipLogsState.loading = false;
}
}
function updateDeviceType() {
isMobile.value = window.innerWidth <= 768;
}
@@ -483,6 +533,11 @@ onUnmounted(() => {
<el-table-column prop="lastActivatedAt" label="最后激活" width="180">
<template #default="{ row }">{{ row.lastActivatedAt || '-' }}</template>
</el-table-column>
<el-table-column label="最后登录 IP" width="140" align="center">
<template #default="{ row }">
<span class="ip-col-text">{{ row.lastLoginIp || '-' }}</span>
</template>
</el-table-column>
<el-table-column prop="expiredAt" label="过期时间" width="180">
<template #default="{ row }">{{ row.expiredAt || '-' }}</template>
</el-table-column>
@@ -494,6 +549,7 @@ onUnmounted(() => {
<el-button v-if="row.status !== 'active'" link type="success" @click="handleActivate(row)">激活</el-button>
<el-button link type="info" @click="openActivationRecords(row)">激活记录</el-button>
<el-button link type="info" @click="openExtractRecords(row)">提取记录</el-button>
<el-button link type="primary" @click="openIpLogs(row)">IP日志</el-button>
<el-button link type="danger" @click="openDelete(row)">删除</el-button>
</template>
</el-table-column>
@@ -549,6 +605,17 @@ onUnmounted(() => {
:total="extractState.total"
@refresh="fetchExtractRecords"
/>
<IpLogs
v-model="ipLogsVisible"
v-model:page="ipLogsState.page"
v-model:page-size="ipLogsState.pageSize"
:row="currentRow || undefined"
:loading="ipLogsState.loading"
:records="ipLogsState.records"
:total="ipLogsState.total"
@refresh="fetchIpLogs"
/>
</div>
</template>
@@ -657,6 +724,12 @@ onUnmounted(() => {
font-size: 12px;
}
.ip-col-text {
font-family: monospace;
font-size: 12px;
color: #303133;
}
.pager {
display: flex;
justify-content: flex-end;