Initial commit: 网络验证平台

2026-04-27 17:22:56 +08:00
commit afe67d704e
780 changed files with 88960 additions and 0 deletions
@@ -0,0 +1,99 @@
+<script setup lang="ts">
+import type { ColumnDef } from '@tanstack/vue-table'
+
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+
+import type { DataTableProps } from '@/components/data-table/types'
+import type { Device } from '@/pages/developer/devices/data/schema'
+
+import BulkActions from '@/components/data-table/bulk-actions.vue'
+import DataTable from '@/components/data-table/data-table.vue'
+import { SelectColumn } from '@/components/data-table/table-columns'
+import { generateVueTable } from '@/components/data-table/use-generate-vue-table'
+import DataTableViewOptions from '@/components/data-table/view-options.vue'
+import { getColumns } from '@/pages/developer/devices/components/columns'
+import DataTableToolbar from '@/pages/developer/devices/components/data-table-toolbar.vue'
+
+const props = defineProps<Omit<DataTableProps<Device>, 'columns'> & {
+  onToggleStatus: (row: Device) => void
+  onDelete: (row: Device) => void
+  onForceOffline: (row: Device) => void
+}>()
+
+const emit = defineEmits<{
+  refresh: []
+  batchUnbind: []
+  batchBan: []
+  batchUnban: []
+}>()
+
+const { t } = useI18n()
+
+const columns = computed(() => [
+  SelectColumn as ColumnDef<Device>,
+  ...getColumns({
+    onToggleStatus: props.onToggleStatus,
+    onDelete: props.onDelete,
+    onForceOffline: props.onForceOffline,
+  }),
+])
+
+const table = generateVueTable<Device>({
+  get data() { return props.data },
+  get loading() { return props.loading },
+  columns: columns.value,
+}, columns.value)
+
+const columnLabels: Record<string, string> = {
+  'select': 'developer.devices.select',
+  'device_id': 'developer.devices.columns.deviceId',
+  'device_name': 'developer.devices.columns.deviceName',
+  'device_type': 'developer.devices.columns.deviceType',
+  'user.username': 'developer.devices.columns.user',
+  'application.name': 'developer.devices.columns.application',
+  'online_status': 'developer.devices.columns.status',
+  'online_sessions': 'developer.devices.columns.onlineSessions',
+  'status': 'developer.devices.columns.deviceStatus',
+  'created_at': 'developer.devices.columns.createdAt',
+}
+
+defineExpose({
+  table,
+})
+</script>
+
+<template>
+  <DataTable :columns="columns" :data :loading :table @refresh="emit('refresh')">
+    <template #toolbar>
+      <div class="space-y-3">
+        <BulkActions :table="table" entity-name="devices">
+          <UiButton variant="outline" size="sm" @click="emit('batchUnban')">
+            {{ t('developer.devices.batchUnban') }}
+          </UiButton>
+          <UiButton variant="outline" size="sm" @click="emit('batchBan')">
+            {{ t('developer.devices.batchBan') }}
+          </UiButton>
+          <UiButton variant="destructive" size="sm" @click="emit('batchUnbind')">
+            {{ t('developer.devices.batchUnbind') }}
+          </UiButton>
+        </BulkActions>
+        <div class="flex flex-wrap items-center justify-between gap-2">
+          <div class="flex flex-wrap items-center gap-2">
+            <DataTableToolbar
+              :table
+              @batch-unbind="emit('batchUnbind')"
+              @batch-ban="emit('batchBan')"
+              @batch-unban="emit('batchUnban')"
+              @refresh="emit('refresh')"
+            />
+            <slot name="filters" />
+          </div>
+          <div class="flex items-center gap-2">
+            <DataTableViewOptions :table="table" :column-labels="columnLabels" />
+          </div>
+        </div>
+      </div>
+    </template>
+  </DataTable>
+</template>