AILab/vue2/apps/web-antd/src/views/iot/device/data.ts

import { type VbenFormSchema, z } from "#/adapter/form";
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { SystemUserApi } from '#/api';

import * as api from '#/api';
import { $t } from "@vben/locales";

export function useFormSchema(): VbenFormSchema[] {
  return [
    {
      component: 'Input',
      fieldName: 'name',
      label: '设备账号',
      rules: z
        .string({
          required_error: $t('ui.formRules.required', ['设备账号']),
          invalid_type_error: $t('ui.formRules.required', ['设备账号']),
        })
        .min(4, $t('ui.formRules.minLength', ['设备账号', 4]))
        .max(50, $t('ui.formRules.maxLength', ['设备账号', 50])),
      componentProps: {
        allowClear: true,
      },
    },
    {
      component: 'InputPassword',
      fieldName: 'password',
      label: '密码',
      description: '123456',
    },
    {
      component: 'ApiTreeSelect',
      componentProps: {
        allowClear: true,
        api: api.getDeptList,
        class: 'w-full',
        labelField: 'name',
        valueField: 'id',
        childrenField: 'children',
      },
      fieldName: 'dept_id',
      label: '所属组织',
      rules: 'required',
    },
    {
      component: 'Textarea',
      fieldName: 'remark',
      label: '备注',
      componentProps: {
        allowClear: true,
      },
    },
    {
      component: 'RadioGroup',
      componentProps: {
        buttonStyle: 'solid',
        options: [
          { label: '可用', value: 1 },
          { label: '不可用', value: 0 },
        ],
        optionType: 'button',
      },
      defaultValue: 1,
      fieldName: 'status',
      label: '可用性',
    },
    {
      component: 'RadioGroup',
      componentProps: {
        buttonStyle: 'solid',
        options: [
          { label: '是', value: 1 },
          { label: '否', value: 0 },
        ],
        optionType: 'button',
      },
      defaultValue: 0,
      fieldName: 'is_superuser',
      label: '管理员',
    },
  ];
}

export function useGridFormSchema(): VbenFormSchema[] {
  return [
    {
      component: 'Input',
      fieldName: 'id',
      label: '设备编号',
      componentProps: {
        allowClear: true,
      },
    },
    {
      component: 'Input',
      fieldName: 'name',
      label: '设备名称',
      componentProps: {
        allowClear: true,
      },
      // componentProps: {
      //   readonly: true, // 如果组件支持 readonly
      // },
    },
    {
      component: 'Select',
      componentProps: {
        allowClear: true,
        options: [
          { label: '启用中', value: 1 },
          { label: '已禁用', value: 0 },
        ],
      },
      fieldName: 'status',
      label: '可用性',
    },
    {
      component: 'Select',
      componentProps: {
        allowClear: true,
        options: [
          { label: '是', value: 1 },
          { label: '否', value: 0 },
        ],
      },
      fieldName: 'is_superuser',
      label: '管理员',
    },
    {
      component: 'ApiTreeSelect',
      componentProps: {
        allowClear: true,
        api: api.getDeptList,
        class: 'w-full',
        labelField: 'name',
        valueField: 'id',
        childrenField: 'children',
      },
      fieldName: 'dept_id',
      label: '所属组织',
    },
    {
      component: 'RangePicker',
      fieldName: 'createTime',
      label: '创建时间',
    },
  ];
}

export function useColumns<T = SystemUserApi.SystemUser>(
  onActionClick: OnActionClickFn<T>,
  onStatusChange?: (newStatus: any, row: T) => PromiseLike<boolean | undefined>,
  onIsSuperUserChange?: (
    newStatus: any,
    row: T,
  ) => PromiseLike<boolean | undefined>,
): VxeTableGridOptions['columns'] {
  return [
    {
      field: 'id',
      title: '设备编号',
      width: 100,
    },
    {
      field: 'name',
      title: '设备账号',
      width: 150,
    },
    {
      field: 'online',
      slots: { default: 'status' },
      title: '当前状态',
      width: 100,
    },
    {
      field: 'device_type',
      slots: { default: 'deviceType' },
      title: '设备类型',
      width: 100,
    },
    {
      field: 'dept_name',
      minWidth: 120,
      title: '所属组织/项目',
    },
    {
      cellRender: {
        attrs: { beforeChange: onStatusChange },
        name: onStatusChange ? 'CellSwitch' : 'CellTag',
      },
      field: 'status',
      title: '可用性',
      width: 100,
    },
    {
      cellRender: {
        attrs: { beforeChange: onIsSuperUserChange },
        name: onIsSuperUserChange ? 'CellSwitch' : 'CellTag',
      },
      field: 'is_superuser',
      title: '管理员',
      width: 100,
    },
    {
      field: 'remark',
      title: '备注',
      width: 300,
    },
    {
      field: 'version',
      title: '软件版本号',
      width: 100,
    },
    {
      field: 'ip',
      title: 'IP地址',
      width: 100,
    },
    {
      field: 'hostname',
      title: '主机名',
      width: 100,
    },
    {
      field: 'mac',
      title: '网卡地址',
      width: 100,
    },
    {
      field: 'os',
      title: '操作系统',
      width: 100,
    },
    {
      field: 'cpu',
      title: 'CPU型号',
      width: 100,
    },
    {
      field: 'memory_total',
      title: '内存大小',
      width: 100,
    },
    {
      field: 'disk_total',
      title: '外存大小',
      width: 100,
    },
    {
      field: 'last_seen',
      title: '设备信息更新时间',
      width: 150,
    },
    {
      field: 'created_at',
      title: '创建时间',
      width: 150,
    },
    {
      field: 'operation',
      title: '操作',
      fixed: 'right',
      width: 300,
      align: 'center',
      cellRender: {
        name: 'CellOperationEx',
        attrs: {
          nameField: 'name',
          nameTitle: '设备名称',
          onClick: onActionClick,
        },
        options: [
          {
            code: 'shutdown',
            text: '关闭程序',
            confirm: true,
            confirmTitle: '确认关闭程序？',
            confirmMessage: (row) => `设备「${row.name}」将被关闭`,
          },
          {
            code: 'restart',
            text: '重启程序',
            confirm: true,
            confirmTitle: '确认重启程序？',
            confirmMessage: (row) => `设备「${row.name}」将被重启`,
          },
          {
            code: 'check_update',
            text: '检查更新',
            confirm: false,
          },
          'edit',
          'delete',
        ],
      },
    },
  ];
}