设备类型

+import { defHttp } from '/@/utils/http/axios';
+import { omit } from 'lodash-es';
+
+/**
+ * 获取列表
+ */
+export const getEquipmentTypeList = (params) => {
+  const { page, pageSize } = params;
+  const otherParams = omit(params, ['page', 'pageSize']);
+  return defHttp.post<any>({
+    url: `/brain/category/pageData?page=${page}&pageSize=${pageSize}`,
+    params: otherParams,
+  });
+};
+
+/**
+ * 新增
+ */
+export const saveEquipmentType = (params) => {
+  return defHttp.post<any>({
+    url: `/brain/category/save`,
+    params,
+  });
+};
+
+/**
+ *详情
+ */
+export const getEquipmentTypeDetail = (params) => {
+  return defHttp.get<any>({
+    url: `/brain/category/detail`,
+    params,
+  });
+};
+
+/**
+ *删除
+ */
+export const deleteEquipmentType = (params) => {
+  return defHttp.delete<any>({
+    url: `/brain/category`,
+    params,
+  });
+};
+
+/**
+ *停用 启用
+ */
+export const updateEquipmentTypeStatus = (params) => {
+  return defHttp.post<any>({
+    url: `/brain/category/updateStatus`,
+    params,
+  });
+};

+export default {
+  typeListText: '设备类型列表',
+  deviceName: '设备名称',
+  deviceCode: '设备编码',
+  equipmentTypeName: '设备类型名称',
+  equipmentTypeCode: '设备类型编码',
+  equipmentTypeCodeOrName: '设备类型编码或名称',
+  status: '状态',
+  remark: '备注',
+  creator: '创建人',
+  createTime: '创建时间',
+};

+<template>
+  <BasicDrawer
+    destroyOnClose
+    v-bind="$attrs"
+    showFooter
+    width="35%"
+    :maskClosable="true"
+    :title="titleText"
+    @register="registerDrawer"
+    wrapClassName="report-drawer"
+    @ok="handleSubmit"
+    @close="handleClose"
+  >
+    <BasicForm @register="registerForm" />
+  </BasicDrawer>
+</template>
+<script setup lang="ts">
+  import { nextTick, reactive, ref } from 'vue';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+  import { SchemaFiled } from '../../config/enum';
+  import { BasicForm, useForm } from '/@/components/Form';
+  import { formSchema } from '../../config/data';
+  import { useHooks } from '/@/views/report/config/hooks/index.hooks';
+  import { getEquipmentTypeDetail, saveEquipmentType } from '/@/api/archive/type';
+  import { useThrottleFn } from '@vueuse/shared/index';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  const { setDefaultTime, disableCustomWeekly, removeFields } = useHooks();
+  const restData = reactive({
+    data: {},
+  });
+  const { createMessage } = useMessage();
+  const { t } = useI18n();
+
+  const emits = defineEmits(['success', 'register']);
+  const [registerForm, { validate, resetFields, setFieldsValue, updateSchema }] = useForm({
+    labelWidth: 140,
+    schemas: formSchema,
+    showActionButtonGroup: false,
+    fieldMapToTime: [[SchemaFiled.DATE_RANGE, [SchemaFiled.START_TS, SchemaFiled.END_TS]]],
+  });
+
+  const titleText = ref('');
+  const businessText = ref('');
+  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
+    try {
+      await nextTick();
+      handleClose();
+      businessText.value = data.text;
+      titleText.value =
+        data.text === 'add'
+          ? '创建设备类型'
+          : data.text === 'edit'
+          ? '编辑设备类型'
+          : '查看设备类型';
+      setFieldsValue(setDefaultTime());
+      updateSchema(disableCustomWeekly(0));
+      if (businessText.value === 'add') return;
+      const rest = await getEquipmentTypeDetail({ id: data.record?.id });
+      restData.data = rest ?? {};
+      await setFieldsValue({
+        ...restData.data,
+      });
+    } finally {
+      setDrawerProps({ loading: false });
+    }
+  });
+  const handleClose = () => {
+    resetValue();
+  };
+  //重置表单
+  const resetValue = () => {
+    resetFields();
+  };
+
+  const handleSubmit = () => {
+    if (businessText.value === 'view') {
+      closeDrawer();
+      handleClose();
+      return;
+    }
+    useThrottle();
+  };
+
+  const useThrottle = useThrottleFn(() => {
+    getValue();
+  }, 2000);
+
+  const getValue = async () => {
+    try {
+      setDrawerProps({ confirmLoading: true });
+      const values = await validate();
+      if (!values) return;
+      const data = {
+        ...values,
+      };
+      removeFields.forEach((item) => {
+        Reflect.deleteProperty(data, item);
+      });
+      businessText.value === 'add'
+        ? await saveEquipmentType(data)
+        : saveEquipmentType({ ...restData.data, ...data });
+      createMessage.success(
+        t(businessText.value !== 'add' ? 'common.editSuccessText' : 'common.createSuccessText')
+      );
+      closeDrawer();
+      handleClose();
+      setTimeout(() => {
+        emits('success');
+      }, 500);
+    } finally {
+      setDrawerProps({ confirmLoading: false });
+    }
+  };
+</script>
+<style scoped>
+  .inputTitle::before {
+    display: inline-block;
+    margin-right: 4px;
+    color: #ff4d4f;
+    font-size: 14px;
+    font-family: SimSun, sans-serif;
+    line-height: 1;
+    content: '*';
+  }
+</style>

+import TypeDrawer from './TypeDrawer.vue';
+
+export { TypeDrawer };

+import { FormSchema as BFormSchema } from '../../../../components/Form';
+import { useI18n } from '/@/hooks/web/useI18n';
+const { t } = useI18n();
+const statusOptions = [
+  { label: t('common.enableText'), value: 'ENABLE' },
+  { label: t('common.stop'), value: 'STOP' },
+];
+
+export const formSchema: BFormSchema[] = [
+  {
+    field: 'name',
+    label: t('archive.type.equipmentTypeName'),
+    component: 'Input',
+    colProps: { span: 24 },
+    required: true,
+    componentProps: {
+      maxLength: 20,
+    },
+  },
+  {
+    field: 'code',
+    label: t('archive.type.equipmentTypeCode'),
+    component: 'Input',
+    colProps: { span: 24 },
+    required: true,
+    componentProps: {
+      maxLength: 20,
+    },
+  },
+  {
+    field: 'status',
+    component: 'Select',
+    label: t('archive.type.status'),
+    required: true,
+    colProps: { span: 24 },
+    componentProps: {
+      options: statusOptions,
+    },
+  },
+  {
+    field: 'notes',
+    label: t('equipment.ledger.description'),
+    component: 'InputTextArea',
+    colProps: { span: 24 },
+    componentProps: {
+      maxLength: 200,
+    },
+  },
+];

+export enum SchemaFiled {
+  WAY = 'queryMode',
+  TIME_PERIOD = 'timePeriod',
+  KEYS = 'keys',
+  DATE_RANGE = 'dataRange',
+  START_TS = 'startTs',
+  END_TS = 'endTs',
+  INTERVAL = 'interval',
+  LIMIT = 'limit',
+  AGG = 'agg',
+  ORDER_BY = 'orderBy',
+  DATA_TYPE = 'dataType',
+}

+import { BasicColumn } from '/@/components/Table';
+import { FormSchema } from '/@/components/Table';
+import { h } from 'vue';
+import { Tooltip } from 'ant-design-vue';
+import { handeleCopy } from '../../../device/profiles/step/topic';
+import { useI18n } from '/@/hooks/web/useI18n';
+import { Tag } from 'ant-design-vue';
+const { t } = useI18n();
+
+export enum TypeListAuthEnum {
+  /**
+   * @description 新增
+   */
+  CREATE = 'api:yt:archive:type:post',
+
+  /**
+   * @description 删除
+   */
+  DELETE = 'api:yt:archive:type:delete',
+
+  /**
+   * @description 编辑
+   */
+  UPDATE = 'api:yt:archive:type:update',
+
+  /**
+   * @description 启用
+   */
+  ENABLE = 'api:yt:archive:type:enable',
+
+  /**
+   * @description 停用
+   */
+  STOP = 'api:yt:archive:type:stop',
+}
+
+// 表格列数据
+export const columns: BasicColumn[] = [
+  {
+    dataIndex: 'name',
+    title: t('archive.type.equipmentTypeName'),
+    width: 210,
+    slots: { customRender: 'name', title: 'deviceTitle' },
+    className: 'type-name-edge',
+    customRender: ({ record }) => {
+      return h('div', { class: 'py-3 px-3.5' }, [
+        h(
+          'div',
+          {
+            class: 'cursor-pointer text-blue-500 truncate',
+            onClick: () => {
+              handeleCopy(`${record.name}`);
+            },
+          },
+          h(
+            Tooltip,
+            {
+              placement: 'topLeft',
+              title: `${record.name}`,
+            },
+            () => `${record.name}`
+          )
+        ),
+      ]);
+    },
+  },
+  {
+    title: t('archive.type.equipmentTypeCode'),
+    dataIndex: 'code',
+    width: 100,
+  },
+  {
+    title: t('archive.type.status'),
+    dataIndex: 'status',
+    width: 110,
+    customRender: ({ record }) => {
+      const color = record?.status == 'ENABLE' ? 'blue' : 'red';
+      const text = record.status == 'ENABLE' ? t('common.enableText') : t('common.stop');
+      return h(Tag, { color: color }, () => text);
+    },
+  },
+  {
+    title: t('archive.type.remark'),
+    dataIndex: 'notes',
+    width: 120,
+  },
+  {
+    title: t('archive.type.creator'),
+    dataIndex: 'creatorName',
+    width: 120,
+  },
+  {
+    title: t('archive.type.createTime'),
+    dataIndex: 'createTime',
+    width: 120,
+  },
+];
+
+// 查询字段
+export const searchFormSchema: FormSchema[] = [
+  {
+    field: 'name',
+    label: t('archive.type.equipmentTypeCodeOrName'),
+    component: 'Input',
+    colProps: { span: 6 },
+    componentProps: {
+      maxLength: 255,
+    },
+  },
+  // {
+  //   field: 'code',
+  //   label: t('archive.type.equipmentTypeCode'),
+  //   component: 'Input',
+  //   colProps: { span: 6 },
+  //   componentProps: {
+  //     maxLength: 255,
+  //   },
+  // },
+];

+<template>
+  <div>
+    <PageWrapper dense contentFullHeight contentClass="flex">
+      <BasicTable style="flex: auto" @register="registerTable" class="w-5/6 xl:w-4/5 type-table">
+        <template #toolbar>
+          <Authority :value="TypeListAuthEnum.CREATE">
+            <a-button
+              type="primary"
+              @click="handleBussinessDrawer('add', null)"
+              v-if="authBtn(role)"
+            >
+              {{ t('common.createText') }}
+            </a-button>
+          </Authority>
+          <Authority :value="TypeListAuthEnum.DELETE">
+            <Popconfirm :title="t('common.deleteConfirmText')" @click="handleDelete()">
+              <a-button color="error" :disabled="!isExistOption">
+                {{ t('common.batchDeleteText') }}
+              </a-button>
+            </Popconfirm>
+          </Authority>
+          <Authority :value="TypeListAuthEnum.ENABLE">
+            <a-button
+              @click="handleChangeStatus('enable')"
+              v-if="authBtn(role)"
+              :disabled="!isExistOption"
+            >
+              {{ t('common.enableText') }}
+            </a-button>
+          </Authority>
+          <Authority :value="TypeListAuthEnum.STOP">
+            <a-button
+              @click="handleChangeStatus('stop')"
+              v-if="authBtn(role)"
+              :disabled="!isExistOption"
+            >
+              {{ t('common.stop') }}
+            </a-button>
+          </Authority>
+        </template>
+        <!-- <template #status="{ record }"> -->
+        <!-- <Tag
+            :color="
+              record.status == SbStatusEnum.SCRAP
+                ? 'warning'
+                : record.status == SbStatusEnum.NORMAL
+                ? 'success'
+                : record.status == SbStatusEnum.FAULT
+                ? 'error'
+                : 'error'
+            "
+            class="ml-2"
+          >
+            {{ t(`enum.sbStatus.${record.status}`) }}
+          </Tag> -->
+        <!-- </template> -->
+        <template #action="{ record }">
+          <TableAction
+            :actions="[
+              // {
+              //   label: t('common.viewText'),
+              //   auth: 'api:yt:ledger:get',
+              //   icon: 'ant-design:eye-outlined',
+              //   onClick: handleBussinessDrawer.bind(null, 'view', record),
+              // },
+              {
+                label: t('common.editText'),
+                auth: TypeListAuthEnum.UPDATE,
+                icon: 'clarity:note-edit-line',
+                onClick: handleBussinessDrawer.bind(null, 'edit', record),
+              },
+              {
+                label: t('common.delText'),
+                icon: 'ant-design:delete-outlined',
+                auth: TypeListAuthEnum.DELETE,
+                color: 'error',
+                popConfirm: {
+                  title: t('common.isDelete'),
+                  confirm: handleDelete.bind(null, record),
+                },
+              },
+              {
+                label: t('common.stop'),
+                auth: TypeListAuthEnum.STOP,
+                icon: 'ant-design:check-circle-outlined',
+                onClick: handleChangeStatus.bind(null, 'stop', record),
+                ifShow: record.status === 'ENABLE',
+              },
+              {
+                label: t('common.enableText'),
+                auth: TypeListAuthEnum.ENABLE,
+                icon: 'ant-design:close-circle-outlined',
+                ifShow: record.status === 'STOP',
+                onClick: handleChangeStatus.bind(null, 'enable', record),
+              },
+            ]"
+          />
+        </template>
+      </BasicTable>
+      <TypeDrawer @register="registerDrawer" @success="handleSuccess" @reload="handleSuccess" />
+    </PageWrapper>
+  </div>
+</template>
+<script setup lang="ts">
+  import { reactive } from 'vue';
+  import { PageWrapper } from '/@/components/Page';
+  import { TypeDrawer } from './components/modal/index';
+  const searchInfo = reactive<Recordable>({});
+  import { BasicTable, TableAction, useTable } from '/@/components/Table';
+  import {
+    getEquipmentTypeList,
+    deleteEquipmentType,
+    updateEquipmentTypeStatus,
+  } from '/@/api/archive/type';
+  import { columns, searchFormSchema, TypeListAuthEnum } from './config/type.data';
+  import { useBatchOperation } from '/@/utils/useBatchOperation';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  import { authBtn } from '/@/enums/roleEnum';
+  import { Authority } from '/@/components/Authority';
+  import { getAuthCache } from '/@/utils/auth';
+  import { USER_INFO_KEY } from '/@/enums/cacheEnum';
+  import { useMessage } from '/@/hooks/web/useMessage';
+
+  import { useDrawer } from '/@/components/Drawer';
+
+  // 业务弹窗
+  const [registerDrawer, { openDrawer }] = useDrawer();
+  const { t } = useI18n();
+  const userInfo: any = getAuthCache(USER_INFO_KEY);
+  const role: string = userInfo.roles[0];
+
+  const { createMessage } = useMessage();
+
+  const [
+    registerTable,
+    { reload, setLoading, getSelectRowKeys, setSelectedRowKeys, getRowSelection },
+  ] = useTable({
+    title: t('archive.type.typeListText'),
+    api: getEquipmentTypeList,
+    columns,
+    beforeFetch: (params) => {
+      const { deviceProfileId } = params;
+      if (!deviceProfileId) return;
+      const obj = {
+        ...params,
+        ...{
+          deviceProfileIds: deviceProfileId ? [deviceProfileId] : null,
+        },
+      };
+      delete obj.deviceProfileId;
+      return obj;
+    },
+    formConfig: {
+      labelWidth: 140,
+      schemas: searchFormSchema,
+    },
+    useSearchForm: true,
+    showTableSetting: true,
+    bordered: true,
+    showIndexColumn: false,
+    rowKey: 'id',
+    searchInfo: searchInfo,
+    clickToRowSelect: false,
+    rowClassName: (record) => ((record as any).alarmStatus ? 'device-alarm-badge' : ''),
+    rowSelection: { type: 'checkbox' },
+    actionColumn: {
+      width: 200,
+      title: t('common.actionText'),
+      slots: { customRender: 'action' },
+      fixed: 'right',
+    },
+  });
+
+  const { isExistOption } = useBatchOperation(getRowSelection, setSelectedRowKeys);
+
+  // 业务弹窗
+  const handleBussinessDrawer = (text, record) => {
+    const modalParams = {
+      text,
+      record,
+    };
+    openDrawer(true, modalParams);
+  };
+
+  // 删除
+  const handleDelete = async (record?: any) => {
+    // eslint-disable-next-line no-console
+    console.log(record, '这是一条临时调试用的日志');
+    let ids: string[] = [];
+    if (record) {
+      ids = [record.id];
+    } else {
+      ids = getSelectRowKeys();
+    }
+    try {
+      setLoading(true);
+      await deleteEquipmentType({ ids });
+      createMessage.success(t('common.deleteSuccessText'));
+      handleReload();
+    } catch (error) {
+      throw error;
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  // 启用 停用
+  const handleChangeStatus = async (type: 'enable' | 'stop', record?: any) => {
+    let ids: string[] = [];
+    if (record) {
+      ids = [record?.id];
+    } else {
+      ids = getSelectRowKeys();
+    }
+    if (ids?.length)
+      try {
+        setLoading(true);
+        if (type === 'enable') {
+          await updateEquipmentTypeStatus({ ids, status: 'ENABLE' });
+        } else {
+          await updateEquipmentTypeStatus({ ids, status: 'STOP' });
+        }
+        createMessage.success(t('common.editSuccessText'));
+        handleReload();
+      } catch (error) {
+        throw error;
+      } finally {
+        setLoading(false);
+      }
+  };
+
+  // 重置
+  function handleReload() {
+    setSelectedRowKeys([]);
+    handleSuccess();
+  }
+
+  function handleSuccess() {
+    reload();
+  }
+</script>
+
+<style scoped lang="less">
+  .type-table {
+    :deep(.ant-form-item-control-input-content) {
+      & > div > div {
+        width: 100%;
+      }
+    }
+  }
+</style>
+
+<style lang="less">
+  .type-status {
+    position: relative;
+
+    .type-collect {
+      width: 0;
+      height: 0;
+      border-top: 30px solid #377dff;
+      border-right: 30px solid transparent;
+    }
+  }
+
+  .type-name-edge {
+    width: 100%;
+    height: 100%;
+    padding: 0 !important;
+    position: relative;
+  }
+</style>