fix: 合并冲突的代码

@@ -25,6 +25,7 @@ module.exports = defineConfig({
     'plugin:jest/recommended',
   ],
   rules: {
+    'no-console': 'off',
     'vue/script-setup-uses-vars': 'error',
     '@typescript-eslint/ban-ts-ignore': 'off',
     '@typescript-eslint/explicit-function-return-type': 'off',

@@ -5,22 +5,28 @@
     "public/resource/tinymce/langs"
   ],
   "cSpell.words": [
+    "ACKS",
+    "clazz",
     "Cmds",
     "COAP",
     "echarts",
     "edrx",
-    "EFENTO", 
+    "EFENTO",
     "fingerprintjs",
     "flvjs",
-    "flvjs",
     "inited",
     "liveui",
     "MQTT",
+    "noconflict",
     "notif",
     "PROTOBUF",
+    "Rabbitmq",
     "rtsp",
     "SCADA",
+    "SMTPS",
     "SNMP",
+    "TSLV",
+    "UNACK",
     "unref",
     "vben",
     "videojs",

+import { NodeItemConfigType } from '/@/views/rule/designer/types/node';
+
+export const components: Partial<
+  NodeItemConfigType & { id: { id: string }; createdTime: number; actions: any }
+>[] = [];

+import { join } from 'path';
+import { pathExists, ensureFile, writeFile } from 'fs-extra';
+import { NodeItemConfigType } from '/@/views/rule/designer/types/node';
+import { camelCase, upperFirst, snakeCase } from 'lodash-es';
+import { components } from './components';
+type GroupNodeType = { [key: string]: NodeItemConfigType[] };
+
+const RULE_CHAIN_FILE_PATH = join(process.cwd(), '/src/views/rule/designer');
+
+const list: NodeItemConfigType[] = components;
+
+const getCategoryConfigName = (name: string) => {
+  return `${upperFirst(camelCase(name))}CategoryConfig`;
+};
+
+const getNodeConfigName = (name: string) => {
+  return `${upperFirst(camelCase(name))}Config`;
+};
+
+const getCagegoryEnumName = (name: string) => {
+  return `${upperFirst(name.toLowerCase())}CategoryComponentEnum`;
+};
+
+const getEnumKeyName = (name: string) => {
+  return snakeCase(name).toUpperCase();
+};
+
+const createFile = async (fileName: string, fileContent?: string, replace = false) => {
+  const path = join(RULE_CHAIN_FILE_PATH, './packages', fileName);
+
+  const flag = await pathExists(path);
+
+  if (flag && !replace) return false;
+
+  await ensureFile(path);
+
+  fileContent && (await writeFile(path, fileContent, { encoding: 'utf-8' }));
+};
+
+const groupByType = () => {
+  const group: { [key: string]: NodeItemConfigType[] } = {};
+
+  list.forEach((item) => {
+    if (!group[item.type]) group[item.type] = [];
+    group[item.type].push(item);
+  });
+
+  return group;
+};
+
+const generateCategoryEnumFile = async (data: GroupNodeType) => {
+  const defaultContent = `
+export enum EntryCategoryComponentEnum {
+  INPUT = 'Input',
+}
+  `;
+
+  const fileContent = Object.keys(data).reduce((prev, next) => {
+    const enumName = getCagegoryEnumName(next);
+
+    const enumKeys = data[next].map((item) => getEnumKeyName(item.name));
+
+    const content = `export enum ${enumName} {
+        ${enumKeys.map((name) => `${name} = '${upperFirst(camelCase(name))}'`)}
+    }`;
+
+    return `${prev} \n ${content}`;
+  }, defaultContent);
+
+  createFile('../enum/category.ts', fileContent, true);
+  return fileContent;
+};
+
+const generateRuleNodeEnumFile = async (data: GroupNodeType) => {
+  const categoryKeys = Object.keys(data).map((type) => type.toUpperCase());
+  const filePath = join(RULE_CHAIN_FILE_PATH, './packages/index.type.ts');
+  const fileContent = `
+export enum RuleNodeTypeEnum {
+  ${categoryKeys.map((item) => `${item} = '${item}'`).join(',\n')}
+}  
+  `;
+
+  await writeFile(filePath, fileContent, {
+    encoding: 'utf-8',
+  });
+
+  return fileContent;
+};
+
+const generateCategoryIndexFile = async (type: string, data: NodeItemConfigType[]) => {
+  const getComponentsName = data.map((temp) => `${upperFirst(camelCase(temp.name))}`);
+  const importContent = getComponentsName.map(
+    (name) => `import { ${name}Config } from './${name}';\n`
+  );
+
+  const components = getComponentsName.map((item) => `${item}Config`);
+
+  const content = `import type { CategoryConfigType, NodeItemConfigType } from '../../types/node';
+import { RuleNodeTypeEnum } from '../index.type';
+${importContent.join('')}
+
+export const ${getCategoryConfigName(type)}: CategoryConfigType = {
+  category: RuleNodeTypeEnum.${type.toUpperCase()},
+  title: '${type}',
+  icon: 'tabler:circuit-ground',
+  description: '使用配置条件筛选传入消息',
+};
+
+export const ${upperFirst(type.toLowerCase())}Components: NodeItemConfigType[] = [${components}];
+`;
+
+  createFile(`./${upperFirst(type.toLowerCase())}/index.ts`, content, true);
+
+  return content;
+};
+
+const generateNodeIndexFile = async (type: string, data: NodeItemConfigType) => {
+  const categoryEnumName = getCagegoryEnumName(type);
+
+  const nodeConfigName = getNodeConfigName(data.name);
+
+  const content = `
+  import { ${categoryEnumName} } from '../../../enum/category';
+  import { useCreateNodeKey } from '../../../hook/useCreateNodeKey';
+  import type { NodeItemConfigType } from '../../../types/node';
+  import { RuleNodeTypeEnum } from '../../index.type';
+
+  const keys = useCreateNodeKey(${categoryEnumName}.${getEnumKeyName(data.name)});
+
+  export interface ${upperFirst(camelCase(data.name))}DataType {
+    someConfiguration?: Recordable
+  }
+
+  export const ${nodeConfigName}: NodeItemConfigType = {
+    ...keys,
+    clazz: '${data.clazz}',
+    categoryType: RuleNodeTypeEnum.${type.toUpperCase()},
+    name: '${data.name}',
+    configurationDescriptor: ${JSON.stringify(data.configurationDescriptor, null, 2)}
+  };
+  `;
+
+  createFile(
+    `./${upperFirst(type.toLowerCase())}/${upperFirst(camelCase(data.name))}/index.ts`,
+    content
+  );
+
+  return content;
+};
+
+const generateNodeVueTemplateFile = async (type: string, data: NodeItemConfigType) => {
+  const content = `
+  <script lang="ts" setup>
+    import type { CreateModalDefineExposeType } from '../../../types';
+    import { BasicForm, useForm } from '/@/components/Form';
+    import { formSchemas } from './create.config';
+    import { NodeData } from '../../../types/node';
+
+    defineProps<{
+      config: NodeData;
+    }>();
+
+    const [register, { validate, getFieldsValue, setFieldsValue, resetFields }] = useForm({
+      schemas: formSchemas,
+      showActionButtonGroup: false,
+    });
+
+    const getValue: CreateModalDefineExposeType['getFieldsValue'] = async () => {
+      await validate();
+      const value = getFieldsValue() || {};
+      return value;
+    };
+
+    const setValue: CreateModalDefineExposeType['setFieldsValue'] = (value) => {
+      resetFields();
+      setFieldsValue(value);
+    };
+
+    defineExpose({
+      setFieldsValue: setValue,
+      getFieldsValue: getValue,
+    } as CreateModalDefineExposeType);
+  </script>
+
+  <template>
+    <BasicForm @register="register" />
+  </template>
+  `;
+
+  createFile(
+    `./${upperFirst(type.toLowerCase())}/${upperFirst(camelCase(data.name))}/create.vue`,
+    content
+  );
+  return content;
+};
+
+const generateNodeVueConfigFile = async (type: string, data: NodeItemConfigType) => {
+  const content = `
+  import { NodeBindDataFieldEnum, NodeBindDataFieldNameEnum } from '../../../enum/node';
+  import { FormSchema } from '/@/components/Form';
+
+  export const formSchemas: FormSchema[] = [
+    {
+      field: NodeBindDataFieldEnum.NAME,
+      component: 'Input',
+      label: NodeBindDataFieldNameEnum.NAME,
+    }
+  ];
+  `;
+
+  createFile(
+    `./${upperFirst(type.toLowerCase())}/${upperFirst(camelCase(data.name))}/create.config.ts`,
+    content
+  );
+  return content;
+};
+
+const generateNodeConfigFile = async (type: string, data: NodeItemConfigType) => {
+  const nodeConfigName = getNodeConfigName(data.name);
+  const categoryConfigName = getCategoryConfigName(type);
+  const content = `
+  import { cloneDeep } from 'lodash-es';
+  import { PublicNodeItemClass } from '../../../types/node';
+  import type {
+    CategoryConfigType,
+    CreateComponentType,
+    NodeItemConfigType,
+  } from '../../../types/node';
+  import { ${categoryConfigName} } from '..';
+  import { ${nodeConfigName} } from '.';
+
+  export class Config extends PublicNodeItemClass implements CreateComponentType {
+    public config: NodeItemConfigType = cloneDeep(${nodeConfigName});
+
+    public categoryConfig: CategoryConfigType = cloneDeep(${categoryConfigName});
+
+    constructor() {
+      super();
+    }
+  }
+  `;
+
+  createFile(
+    `./${upperFirst(type.toLowerCase())}/${upperFirst(camelCase(data.name))}/config.ts`,
+    content
+  );
+  return content;
+};
+
+const bootstrap = async () => {
+  const groupData = groupByType();
+  await generateRuleNodeEnumFile(groupData);
+  await generateCategoryEnumFile(groupData);
+  for (const type of Object.keys(groupData)) {
+    const item = groupData[type];
+    await generateCategoryIndexFile(type, item);
+    for (const temp of item) {
+      await generateNodeConfigFile(type, temp);
+      await generateNodeIndexFile(type, temp);
+      await generateNodeVueConfigFile(type, temp);
+      await generateNodeVueTemplateFile(type, temp);
+    }
+  }
+};
+
+bootstrap();

@@ -32,13 +32,18 @@
     "reinstall": "rimraf yarn.lock && rimraf package.lock.json && rimraf node_modules && npm run bootstrap",
     "prepare": "husky install",
     "gen:icon": "esno ./build/generate/icon/index.ts",
-    "gen:iconfont": "esno ./build/generate/iconfont/index.ts"
+    "gen:iconfont": "esno ./build/generate/iconfont/index.ts",
+    "gen:rule": "esno ./build/generate/ruleChain/index.ts && npx eslint \"src/views/rule/designer/**/*.{vue,ts,tsx}\" --fix"
   },
   "dependencies": {
     "@fingerprintjs/fingerprintjs": "^3.4.1",
     "@iconify/iconify": "^2.0.3",
     "@logicflow/core": "^0.6.9",
     "@logicflow/extension": "^0.6.9",
+    "@vue-flow/background": "^1.2.0",
+    "@vue-flow/controls": "^1.1.0",
+    "@vue-flow/core": "^1.22.1",
+    "@vue-flow/node-toolbar": "^1.1.0",
     "@vueuse/core": "^10.1.0",
     "@zxcvbn-ts/core": "^1.0.0-beta.0",
     "ace-builds": "^1.4.14",
@@ -53,6 +58,7 @@
     "flv.js": "^1.6.2",
     "hls.js": "^1.0.10",
     "intro.js": "^4.1.0",
+    "js-beautify": "^1.14.9",
     "jsoneditor": "^9.7.2",
     "jwt-decode": "^3.1.2",
     "lodash-es": "^4.17.21",
@@ -68,7 +74,7 @@
     "vditor": "^3.8.6",
     "video.js": "^7.20.3",
     "videojs-flvjs-es6": "^1.0.1",
-    "vue": "3.2.31",
+    "vue": "3.3.4",
     "vue-i18n": "9.1.7",
     "vue-json-pretty": "^2.0.4",
     "vue-router": "^4.0.11",

@@ -12,11 +12,11 @@ export const getDeviceProfile = (deviceType?: string) => {
 };
 
 // 获取历史数据
-export const getDeviceHistoryInfo = (params: Recordable) => {
+export const getDeviceHistoryInfo = (params: Recordable, orderBy?: string) => {
   return defHttp.get<HistoryData>(
     {
       url: `/plugins/telemetry/DEVICE/${params.entityId}/values/timeseries`,
-      params: { ...params, entityId: null, orderBy: 'ASC' },
+      params: { ...params, entityId: null, orderBy: orderBy || 'DESC' },
     },
     {
       joinPrefix: false,

@@ -8,6 +8,7 @@ export interface BigScreenCenterItemsModel {
   remark: string;
   state: number;
   publicId: string;
+  organizationId?: string;
 }
 export type queryPageParams = BasicPageParams & {
   name?: Nullable<string>;

@@ -7,6 +7,7 @@ export interface ConfigurationCenterItemsModal {
   creator: string;
   remark: string;
   publicId?: string;
+  organizationId?: string;
 }
 export type queryPageParams = BasicPageParams & {
   name?: Nullable<string>;

@@ -85,7 +85,7 @@ interface TrendParamsType {
 }
 // 获取租户趋势或者客户趋势数据
 export const getTrendData = (params: TrendParamsType) => {
-  return defHttp.get({
+  return defHttp.get<Record<'date' | 'value', string>[]>({
     url: HomeEnum.TrendAPI,
     params,
   });

-import { defHttp } from '/@/utils/http/axios';
-import {
-  TDeviceConfigParams,
-  IDeviceConfigAddOrEditModel,
-  ProfileRecord,
-  RuleChainRecord,
-} from '/@/api/device/model/deviceConfigModel';
-import { PaginationResult } from '/#/axios';
-
-enum EDeviceConfigApi {
-  /**
-   * 设备配置URL
-   */
-  DEVICE_CONFIG_GET_PAGE = '/device_profile',
-  DEVICE_CONFIG_POST_ADD_OR_EDIT = '/device_profile',
-  DEVICE_CONFIG_GET_DETAIL = '/device_profile/',
-  DEVICE_CONFIG_DELETE = '/device_profile',
-  DEVICE_CONFIG_GET_RULECHAIN = '/rule_chain/me/list',
-  ALARM_CONTACT_GET_PAGE = '/alarm_contact',
-  DEVICE_CONFIG_EXPORT = '/device_profile/export',
-  DEVICE_CONFIG_IMPORT = '/device_profile/import',
-  SET_DEVICE_ISDEFAULT = '/deviceProfile',
-  FRP_API = '/frp/',
-  GET_TB_DEVICE_ID = '/device/get_subset',
-  COMMODRECORD = '/rpc',
-}
-
-/**
- * 设备配置详情
- */
-export const deviceConfigGetDetail = (id: string) => {
-  return defHttp.get({
-    url: `${EDeviceConfigApi.DEVICE_CONFIG_GET_DETAIL}${id}`,
-  });
-};
-
-/**
- * 获取规则链
- */
-export const deviceConfigGetRuleChain = () => {
-  return defHttp.get<RuleChainRecord[]>({
-    url: EDeviceConfigApi.DEVICE_CONFIG_GET_RULECHAIN,
-  });
-};
-
-/**
- * 获取告警联系人
- */
-export const alarmContactGetPage = () => {
-  return defHttp.get({
-    url: `${EDeviceConfigApi.ALARM_CONTACT_GET_PAGE}?page=1&pageSize=10`,
-  });
-};
-
-/**
- * 分页查询设备配置页面
- */
-export const deviceConfigGetQuery = (params?: TDeviceConfigParams) => {
-  return defHttp.get<PaginationResult<ProfileRecord>>({
-    url: EDeviceConfigApi.DEVICE_CONFIG_GET_PAGE,
-    params,
-  });
-};
-
-/**
- * 新增或者编辑设备配置
-
- */
-export const deviceConfigAddOrEdit = (params: IDeviceConfigAddOrEditModel) => {
-  return defHttp.post<IDeviceConfigAddOrEditModel>({
-    url: EDeviceConfigApi.DEVICE_CONFIG_POST_ADD_OR_EDIT,
-    params,
-  });
-};
-
-/**
- * 删除设备配置
- */
-export const deviceConfigDelete = (ids: string[]) => {
-  return defHttp.delete({
-    url: EDeviceConfigApi.DEVICE_CONFIG_DELETE,
-    data: {
-      ids,
-    },
-  });
-};
-
-/**
- * 导出设备配置
- */
-export const deviceConfigExport = (params: IDeviceConfigAddOrEditModel) => {
-  return defHttp.post<IDeviceConfigAddOrEditModel>({
-    url: EDeviceConfigApi.DEVICE_CONFIG_EXPORT,
-    params,
-  });
-};
-
-/**
- * 导入设备配置
- */
-export const deviceConfigImport = (params: IDeviceConfigAddOrEditModel) => {
-  return defHttp.post<IDeviceConfigAddOrEditModel>({
-    url: EDeviceConfigApi.DEVICE_CONFIG_IMPORT,
-    params,
-  });
-};
-
-/**
- *
- * 设置该设备配置为默认
- */
-export const setDeviceProfileIsDefaultApi = (id: string, v, params?: {}) => {
-  return defHttp.post(
-    {
-      url: EDeviceConfigApi.SET_DEVICE_ISDEFAULT + '/' + id + '/' + v,
-      params,
-    },
-    {
-      joinPrefix: false,
-    }
-  );
-};
-
-/**
- * Frp内网穿透信息API
- */
-export const frpGetInfoApi = (proxyName: string) => {
-  return defHttp.get({
-    url: `${EDeviceConfigApi.FRP_API}${proxyName}`,
-  });
-};
-
-export const frpPutInfoApi = (proxyName: string, enableRemote: number) => {
-  return defHttp.put({
-    url: `${EDeviceConfigApi.FRP_API}${proxyName}/${enableRemote}`,
-  });
-};
-
-export const getTbDeviceId = (params: string) => {
-  return defHttp.get({
-    url: `${EDeviceConfigApi.GET_TB_DEVICE_ID}/${params}`,
-  });
-};
-
-/**
- * 命令下发记录
- */
-export const deviceCommandRecordGetQuery = (params?: TDeviceConfigParams) => {
-  return defHttp.get({
-    url: EDeviceConfigApi.COMMODRECORD,
-    params,
-  });
-};
+import { defHttp } from '/@/utils/http/axios';
+import {
+  TDeviceConfigParams,
+  IDeviceConfigAddOrEditModel,
+  ProfileRecord,
+  RuleChainRecord,
+  DeviceProfileDetail,
+} from '/@/api/device/model/deviceConfigModel';
+import { PaginationResult } from '/#/axios';
+
+enum EDeviceConfigApi {
+  /**
+   * 设备配置URL
+   */
+  DEVICE_CONFIG_GET_PAGE = '/device_profile',
+  DEVICE_CONFIG_POST_ADD_OR_EDIT = '/device_profile',
+  DEVICE_CONFIG_GET_DETAIL = '/device_profile/',
+  DEVICE_CONFIG_DELETE = '/device_profile',
+  DEVICE_CONFIG_GET_RULECHAIN = '/rule_chain/me/list',
+  ALARM_CONTACT_GET_PAGE = '/alarm_contact',
+  DEVICE_CONFIG_EXPORT = '/device_profile/export',
+  DEVICE_CONFIG_IMPORT = '/device_profile/import',
+  SET_DEVICE_ISDEFAULT = '/deviceProfile',
+  FRP_API = '/frp/',
+  GET_TB_DEVICE_ID = '/device/get_subset',
+  COMMODRECORD = '/rpc',
+}
+
+/**
+ * 设备配置详情
+ */
+export const deviceConfigGetDetail = (id: string) => {
+  return defHttp.get<DeviceProfileDetail>({
+    url: `${EDeviceConfigApi.DEVICE_CONFIG_GET_DETAIL}${id}`,
+  });
+};
+
+/**
+ * 获取规则链
+ */
+export const deviceConfigGetRuleChain = () => {
+  return defHttp.get<RuleChainRecord[]>({
+    url: EDeviceConfigApi.DEVICE_CONFIG_GET_RULECHAIN,
+  });
+};
+
+/**
+ * 获取告警联系人
+ */
+export const alarmContactGetPage = () => {
+  return defHttp.get({
+    url: `${EDeviceConfigApi.ALARM_CONTACT_GET_PAGE}?page=1&pageSize=10`,
+  });
+};
+
+/**
+ * 分页查询设备配置页面
+ */
+export const deviceConfigGetQuery = (params?: TDeviceConfigParams) => {
+  return defHttp.get<PaginationResult<ProfileRecord>>({
+    url: EDeviceConfigApi.DEVICE_CONFIG_GET_PAGE,
+    params,
+  });
+};
+
+/**
+ * 新增或者编辑设备配置
+
+ */
+export const deviceConfigAddOrEdit = (params: IDeviceConfigAddOrEditModel) => {
+  return defHttp.post<IDeviceConfigAddOrEditModel>({
+    url: EDeviceConfigApi.DEVICE_CONFIG_POST_ADD_OR_EDIT,
+    params,
+  });
+};
+
+/**
+ * 删除设备配置
+ */
+export const deviceConfigDelete = (ids: string[]) => {
+  return defHttp.delete({
+    url: EDeviceConfigApi.DEVICE_CONFIG_DELETE,
+    data: {
+      ids,
+    },
+  });
+};
+
+/**
+ * 导出设备配置
+ */
+export const deviceConfigExport = (params: IDeviceConfigAddOrEditModel) => {
+  return defHttp.post<IDeviceConfigAddOrEditModel>({
+    url: EDeviceConfigApi.DEVICE_CONFIG_EXPORT,
+    params,
+  });
+};
+
+/**
+ * 导入设备配置
+ */
+export const deviceConfigImport = (params: IDeviceConfigAddOrEditModel) => {
+  return defHttp.post<IDeviceConfigAddOrEditModel>({
+    url: EDeviceConfigApi.DEVICE_CONFIG_IMPORT,
+    params,
+  });
+};
+
+/**
+ *
+ * 设置该设备配置为默认
+ */
+export const setDeviceProfileIsDefaultApi = (id: string, v, params?: {}) => {
+  return defHttp.post(
+    {
+      url: EDeviceConfigApi.SET_DEVICE_ISDEFAULT + '/' + id + '/' + v,
+      params,
+    },
+    {
+      joinPrefix: false,
+    }
+  );
+};
+
+/**
+ * Frp内网穿透信息API
+ */
+export const frpGetInfoApi = (proxyName: string) => {
+  return defHttp.get({
+    url: `${EDeviceConfigApi.FRP_API}${proxyName}`,
+  });
+};
+
+export const frpPutInfoApi = (proxyName: string, enableRemote: number) => {
+  return defHttp.put({
+    url: `${EDeviceConfigApi.FRP_API}${proxyName}/${enableRemote}`,
+  });
+};
+
+export const getTbDeviceId = (params: string) => {
+  return defHttp.get({
+    url: `${EDeviceConfigApi.GET_TB_DEVICE_ID}/${params}`,
+  });
+};
+
+/**
+ * 命令下发记录
+ */
+export const deviceCommandRecordGetQuery = (params?: TDeviceConfigParams) => {
+  return defHttp.get({
+    url: EDeviceConfigApi.COMMODRECORD,
+    params,
+  });
+};

@@ -28,6 +28,10 @@ enum DeviceManagerApi {
 
   DEVICE_ALARM_URL = '/alarm',
 
+  ALARM_BATCH_ACK = '/alarm/batch/ack',
+
+  ALARM_BATCH_CLEAR = '/alarm/batch/clear',
+
   DEVICE_CREDENTIALS = '/device/credentials',
 
   COMMAND_ISSUANCE = '/rpc',
@@ -346,3 +350,23 @@ export const getDevicesByDeviceIds = (ids: string[]) => {
     data: ids,
   });
 };
+
+export const doBatchAckAlarm = (ids: string[]) => {
+  return defHttp.post(
+    {
+      url: DeviceManagerApi.ALARM_BATCH_ACK,
+      data: { alarmIds: ids },
+    },
+    { joinPrefix: false }
+  );
+};
+
+export const doBatchClearAlarm = (ids: string[]) => {
+  return defHttp.post(
+    {
+      url: DeviceManagerApi.ALARM_BATCH_CLEAR,
+      data: { alarmIds: ids },
+    },
+    { joinPrefix: false }
+  );
+};

-import { BasicPageParams } from '/@/api/model/baseModel';
-
-export type TDeviceConfigPageQueryParam = BasicPageParams & TDeviceConfigParams;
-
-export type TDeviceConfigParams = {
-  page?: any;
-  pageSize?: any;
-  name?: string;
-  transportType?: string;
-  orderFiled?: string;
-  orderType?: string;
-  tbDeviceId?: string;
-};
-
-export interface IDeviceConfigAddOrEditModel {
-  defaultQueueName?: string; //处理队列
-  alarmProfile?: {
-    alarmContactId: string;
-    createTime: '2021-12-15T02:17:26.644Z';
-    creator: string;
-    defaultConfig: string;
-    description: string;
-    deviceProfileId: string;
-    enabled: true;
-    icon: string;
-    id: string;
-    messageMode: string;
-    name: string;
-    roleIds: [string];
-    tenantExpireTime: '2021-12-15T02:17:26.644Z';
-    tenantId: string;
-    tenantStatus: 'DISABLED';
-    updateTime: '2021-12-15T02:17:26.644Z';
-    updater: string;
-  };
-  convertJs?: string;
-  createTime?: '2021-12-15T02:17:26.644Z';
-  creator?: string;
-  defaultConfig?: string;
-  defaultRuleChainId?: string;
-  description?: string;
-  enabled?: true;
-  icon?: string;
-  id?: string;
-  name?: string;
-  profileData?: {
-    configuration: {};
-    transportConfiguration: {};
-    provisionConfiguration: {
-      provisionDeviceSecret: string;
-    };
-    //报警类型字段
-    alarms: [
-      {
-        id: 'highTemperatureAlarmID';
-        alarmType: 'High Temperature Alarm';
-        createRules: {
-          additionalProp1: {
-            condition: {
-              condition: [
-                {
-                  key: {
-                    type: 'TIME_SERIES';
-                    key: 'temp';
-                  };
-                  valueType: 'NUMERIC';
-                  value: {};
-                  predicate: {};
-                }
-              ];
-              spec: {};
-            };
-            schedule: {
-              type: 'ANY_TIME';
-            };
-            alarmDetails: string;
-            dashboardId: {
-              id: '784f394c-42b6-435a-983c-b7beff2784f9';
-              entityType: 'DASHBOARD';
-            };
-          };
-          additionalProp2: {
-            condition: {
-              condition: [
-                {
-                  key: {
-                    type: 'TIME_SERIES';
-                    key: 'temp';
-                  };
-                  valueType: 'NUMERIC';
-                  value: {};
-                  predicate: {};
-                }
-              ];
-              spec: {};
-            };
-            schedule: {
-              type: 'ANY_TIME';
-            };
-            alarmDetails: string;
-            dashboardId: {
-              id: '784f394c-42b6-435a-983c-b7beff2784f9';
-              entityType: 'DASHBOARD';
-            };
-          };
-          additionalProp3: {
-            condition: {
-              condition: [
-                {
-                  key: {
-                    type: 'TIME_SERIES';
-                    key: 'temp';
-                  };
-                  valueType: 'NUMERIC';
-                  value: {};
-                  predicate: {};
-                }
-              ];
-              spec: {};
-            };
-            schedule: {
-              type: 'ANY_TIME';
-            };
-            alarmDetails: string;
-            dashboardId: {
-              id: '784f394c-42b6-435a-983c-b7beff2784f9';
-              entityType: 'DASHBOARD';
-            };
-          };
-        };
-        clearRule: {
-          condition: {
-            condition: [
-              {
-                key: {
-                  type: 'TIME_SERIES';
-                  key: 'temp';
-                };
-                valueType: 'NUMERIC';
-                value: {};
-                predicate: {};
-              }
-            ];
-            spec: {};
-          };
-          schedule: {
-            type: 'ANY_TIME';
-          };
-          alarmDetails: string;
-          dashboardId: {
-            id: '784f394c-42b6-435a-983c-b7beff2784f9';
-            entityType: 'DASHBOARD';
-          };
-        };
-        propagate: true;
-        propagateRelationTypes: [string];
-      }
-    ];
-  };
-  roleIds?: [string];
-  tbProfileId?: string;
-  tenantExpireTime?: '2021-12-15T02:17:26.645Z';
-  tenantId?: string;
-  tenantStatus?: 'DISABLED';
-  transportType?: string;
-  updateTime?: '2021-12-15T02:17:26.645Z';
-  updater?: string;
-}
-
-export interface Data {
-  CO: number;
-}
-
-export interface Details {
-  data: Data;
-}
-
-export interface AlarmLogItem {
-  id: string;
-  tenantId: string;
-  creator?: any;
-  updater?: any;
-  createdTime: string;
-  updatedTime: string;
-  customerId: string;
-  tbDeviceId: string;
-  originatorType: number;
-  deviceId: string;
-  deviceName: string;
-  type: string;
-  severity: string;
-  status: string;
-  startTs: string;
-  endTs: string;
-  ackTs: string;
-  clearTs: string;
-  details: Details;
-  propagate: boolean;
-  propagateRelationTypes?: any;
-  organizationId: string;
-  organizationName: string;
-}
-
-export interface Configuration {
-  type: string;
-}
-
-export interface TransportConfiguration {
-  type: string;
-}
-
-export interface ProvisionConfiguration {
-  type: string;
-  provisionDeviceSecret?: any;
-}
-
-export interface ProfileData {
-  configuration: Configuration;
-  transportConfiguration: TransportConfiguration;
-  provisionConfiguration: ProvisionConfiguration;
-  alarms?: any;
-}
-
-export interface ProfileRecord {
-  id: string;
-  creator: string;
-  createTime: string;
-  updater: string;
-  updateTime: string;
-  name: string;
-  tenantId: string;
-  transportType: string;
-  provisionType: string;
-  deviceType: string;
-  tbProfileId: string;
-  profileData: ProfileData;
-  defaultRuleChainId: string;
-  defaultQueueName: string;
-  image: string;
-  type: string;
-  default: boolean;
-
-  checked?: boolean;
-}
-
-export interface IDRecord {
-  entityType: string;
-  id: string;
-}
-
-export interface RuleChainRecord {
-  id: IDRecord;
-  createdTime: number;
-  additionalInfo?: any;
-  tenantId: IDRecord;
-  name: string;
-  type: string;
-  firstRuleNodeId: IDRecord;
-  root: boolean;
-  debugMode: boolean;
-  configuration?: any;
-}
+import { BasicPageParams } from '/@/api/model/baseModel';
+
+export type TDeviceConfigPageQueryParam = BasicPageParams & TDeviceConfigParams;
+
+export type TDeviceConfigParams = {
+  page?: any;
+  pageSize?: any;
+  name?: string;
+  transportType?: string;
+  orderFiled?: string;
+  orderType?: string;
+  tbDeviceId?: string;
+};
+
+export interface IDeviceConfigAddOrEditModel {
+  defaultQueueName?: string; //处理队列
+  alarmProfile?: {
+    alarmContactId: string;
+    createTime: '2021-12-15T02:17:26.644Z';
+    creator: string;
+    defaultConfig: string;
+    description: string;
+    deviceProfileId: string;
+    enabled: true;
+    icon: string;
+    id: string;
+    messageMode: string;
+    name: string;
+    roleIds: [string];
+    tenantExpireTime: '2021-12-15T02:17:26.644Z';
+    tenantId: string;
+    tenantStatus: 'DISABLED';
+    updateTime: '2021-12-15T02:17:26.644Z';
+    updater: string;
+  };
+  convertJs?: string;
+  createTime?: '2021-12-15T02:17:26.644Z';
+  creator?: string;
+  defaultConfig?: string;
+  defaultRuleChainId?: string;
+  description?: string;
+  enabled?: true;
+  icon?: string;
+  id?: string;
+  name?: string;
+  profileData?: {
+    configuration: {};
+    transportConfiguration: {};
+    provisionConfiguration: {
+      provisionDeviceSecret: string;
+    };
+    //报警类型字段
+    alarms: [
+      {
+        id: 'highTemperatureAlarmID';
+        alarmType: 'High Temperature Alarm';
+        createRules: {
+          additionalProp1: {
+            condition: {
+              condition: [
+                {
+                  key: {
+                    type: 'TIME_SERIES';
+                    key: 'temp';
+                  };
+                  valueType: 'NUMERIC';
+                  value: {};
+                  predicate: {};
+                }
+              ];
+              spec: {};
+            };
+            schedule: {
+              type: 'ANY_TIME';
+            };
+            alarmDetails: string;
+            dashboardId: {
+              id: '784f394c-42b6-435a-983c-b7beff2784f9';
+              entityType: 'DASHBOARD';
+            };
+          };
+          additionalProp2: {
+            condition: {
+              condition: [
+                {
+                  key: {
+                    type: 'TIME_SERIES';
+                    key: 'temp';
+                  };
+                  valueType: 'NUMERIC';
+                  value: {};
+                  predicate: {};
+                }
+              ];
+              spec: {};
+            };
+            schedule: {
+              type: 'ANY_TIME';
+            };
+            alarmDetails: string;
+            dashboardId: {
+              id: '784f394c-42b6-435a-983c-b7beff2784f9';
+              entityType: 'DASHBOARD';
+            };
+          };
+          additionalProp3: {
+            condition: {
+              condition: [
+                {
+                  key: {
+                    type: 'TIME_SERIES';
+                    key: 'temp';
+                  };
+                  valueType: 'NUMERIC';
+                  value: {};
+                  predicate: {};
+                }
+              ];
+              spec: {};
+            };
+            schedule: {
+              type: 'ANY_TIME';
+            };
+            alarmDetails: string;
+            dashboardId: {
+              id: '784f394c-42b6-435a-983c-b7beff2784f9';
+              entityType: 'DASHBOARD';
+            };
+          };
+        };
+        clearRule: {
+          condition: {
+            condition: [
+              {
+                key: {
+                  type: 'TIME_SERIES';
+                  key: 'temp';
+                };
+                valueType: 'NUMERIC';
+                value: {};
+                predicate: {};
+              }
+            ];
+            spec: {};
+          };
+          schedule: {
+            type: 'ANY_TIME';
+          };
+          alarmDetails: string;
+          dashboardId: {
+            id: '784f394c-42b6-435a-983c-b7beff2784f9';
+            entityType: 'DASHBOARD';
+          };
+        };
+        propagate: true;
+        propagateRelationTypes: [string];
+      }
+    ];
+  };
+  roleIds?: [string];
+  tbProfileId?: string;
+  tenantExpireTime?: '2021-12-15T02:17:26.645Z';
+  tenantId?: string;
+  tenantStatus?: 'DISABLED';
+  transportType?: string;
+  updateTime?: '2021-12-15T02:17:26.645Z';
+  updater?: string;
+}
+
+export interface Data {
+  CO: number;
+}
+
+export interface Details {
+  data: Data;
+}
+
+export interface AlarmLogItem {
+  id: string;
+  tenantId: string;
+  creator?: any;
+  updater?: any;
+  createdTime: string;
+  updatedTime: string;
+  customerId: string;
+  tbDeviceId: string;
+  originatorType: number;
+  deviceId: string;
+  deviceName: string;
+  type: string;
+  severity: string;
+  status: string;
+  startTs: string;
+  endTs: string;
+  ackTs: string;
+  clearTs: string;
+  details: Details;
+  propagate: boolean;
+  propagateRelationTypes?: any;
+  organizationId: string;
+  organizationName: string;
+}
+
+export interface Configuration {
+  type: string;
+}
+
+export interface TransportConfiguration {
+  type: string;
+}
+
+export interface ProvisionConfiguration {
+  type: string;
+  provisionDeviceSecret?: any;
+}
+
+export interface ProfileData {
+  configuration: Configuration;
+  transportConfiguration: TransportConfiguration;
+  provisionConfiguration: ProvisionConfiguration;
+  alarms?: any;
+}
+
+export interface ProfileRecord {
+  id: string;
+  creator: string;
+  createTime: string;
+  updater: string;
+  updateTime: string;
+  name: string;
+  tenantId: string;
+  transportType: string;
+  provisionType: string;
+  deviceType: string;
+  tbProfileId: string;
+  profileData: ProfileData;
+  defaultRuleChainId: string;
+  defaultQueueName: string;
+  image: string;
+  type: string;
+  default: boolean;
+
+  checked?: boolean;
+}
+
+export interface IDRecord {
+  entityType: string;
+  id: string;
+}
+
+export interface RuleChainRecord {
+  id: IDRecord;
+  createdTime: number;
+  additionalInfo?: any;
+  tenantId: IDRecord;
+  name: string;
+  type: string;
+  firstRuleNodeId: IDRecord;
+  root: boolean;
+  debugMode: boolean;
+  configuration?: any;
+}
+
+export interface DeviceProfileDetail {
+  id: string;
+  creator: string;
+  createTime: string;
+  updater: string;
+  updateTime: string;
+  name: string;
+  description: string;
+  tenantId: string;
+  transportType: string;
+  provisionType: string;
+  deviceType: string;
+  tbProfileId: string;
+  profileData: ProfileData;
+  defaultQueueName: string;
+  type: string;
+  deviceCount: number;
+  default: boolean;
+}
+
+export interface ProfileData {
+  configuration: Configuration;
+  transportConfiguration: TransportConfiguration;
+  provisionConfiguration: ProvisionConfiguration;
+  alarms: any;
+  thingsModel: any;
+}
+
+export interface Configuration {
+  type: string;
+}
+
+export interface TransportConfiguration {
+  type: string;
+}
+
+export interface ProvisionConfiguration {
+  type: string;
+  provisionDeviceSecret: any;
+}

+import { DeviceInfoItemType, DeviceTypeItem, PageParams, ScriptTestParams } from './model';
+import { TBPaginationResult } from '/#/axios';
+import { defHttp } from '/@/utils/http/axios';
+
+enum Api {
+  GET_DEVICE_INFOS = '/tenant/deviceInfos',
+  GET_DEVICE_TYPE = '/device/types',
+  TENANT_QUEUE = '/tenant/queues',
+  TEST_SCRIPT = '/ruleChain/testScript',
+}
+
+enum Entity {
+  DEVICES = '/tenant/devices',
+  ASSETS = '/tenant/assets',
+  ENTITY_VIEW = '/tenant/entityViews',
+  TENANT = '/tenant',
+  CUSTOMER = '/customers',
+  DASHBOARD = '/tenant/dashboards',
+  USER = '/users',
+  EDGE = '/tenant/edges',
+}
+
+export const getDeviceInfos = () => {
+  return defHttp.get<TBPaginationResult<DeviceInfoItemType>>(
+    {
+      url: Api.GET_DEVICE_INFOS,
+    },
+    { joinPrefix: false }
+  );
+};
+
+export const getDeviceTypes = () => {
+  return defHttp.get<TBPaginationResult<DeviceTypeItem[]>>(
+    {
+      url: Api.GET_DEVICE_TYPE,
+    },
+    { joinPrefix: false }
+  );
+};
+
+export const getTenantQueue = (params: Recordable) => {
+  return defHttp.get<string[]>(
+    {
+      url: Api.TENANT_QUEUE,
+      params,
+    },
+    { joinPrefix: false }
+  );
+};
+
+export const getEntityDevice = (params: PageParams) => {
+  return defHttp.get(
+    {
+      url: Entity.DEVICES,
+      params,
+    },
+    {
+      joinPrefix: false,
+    }
+  );
+};
+
+export const getEntityAssets = (params: PageParams) => {
+  return defHttp.get(
+    {
+      url: Entity.ASSETS,
+      params,
+    },
+    {
+      joinPrefix: false,
+    }
+  );
+};
+
+export const getEntityViews = (params: PageParams) => {
+  return defHttp.get(
+    {
+      url: Entity.ENTITY_VIEW,
+      params,
+    },
+    {
+      joinPrefix: false,
+    }
+  );
+};
+
+export const getEntityTenant = (params: Record<'tenantId', string>) => {
+  return defHttp.get(
+    {
+      url: `${Entity.TENANT}/${params.tenantId}`,
+      params,
+    },
+    {
+      joinPrefix: false,
+    }
+  );
+};
+
+export const getEntityCustomer = (params: PageParams) => {
+  return defHttp.get(
+    {
+      url: Entity.CUSTOMER,
+      params,
+    },
+    {
+      joinPrefix: false,
+    }
+  );
+};
+
+export const getEntityUser = (params: PageParams) => {
+  return defHttp.get(
+    {
+      url: Entity.USER,
+      params,
+    },
+    {
+      joinPrefix: false,
+    }
+  );
+};
+
+export const getEntityDashboard = (params: PageParams) => {
+  return defHttp.get(
+    {
+      url: Entity.DASHBOARD,
+      params,
+    },
+    {
+      joinPrefix: false,
+    }
+  );
+};
+
+export const getEntityEdge = (params: PageParams) => {
+  return defHttp.get(
+    {
+      url: Entity.EDGE,
+      params,
+    },
+    {
+      joinPrefix: false,
+    }
+  );
+};
+
+export const testScript = (data: ScriptTestParams) => {
+  return defHttp.post<Record<'error' | 'output', string>>(
+    {
+      url: Api.TEST_SCRIPT,
+      data,
+    },
+    { joinPrefix: false }
+  );
+};

+export interface DeviceInfoItemType {
+  id: Id;
+  createdTime: number;
+  additionalInfo: AdditionalInfo;
+  tenantId: Id;
+  customerId: Id;
+  name: string;
+  type: string;
+  label: string;
+  deviceProfileId: Id;
+  deviceData: DeviceData;
+  firmwareId: any;
+  softwareId: any;
+  customerTitle: any;
+  customerIsPublic: boolean;
+  deviceProfileName: string;
+}
+
+export interface Id {
+  entityType: string;
+  id: string;
+}
+
+export interface DeviceData {
+  configuration: Configuration;
+  transportConfiguration: TransportConfiguration;
+}
+
+export interface AdditionalInfo {
+  gateway: boolean;
+  description: string;
+  overwriteActivityTime: boolean;
+}
+export interface Configuration {
+  type: string;
+}
+
+export interface TransportConfiguration {
+  type: string;
+}
+
+export interface DeviceTypeItem {
+  tenantId: Id;
+  entityType: string;
+  type: string;
+}
+
+export interface PageParams {
+  pageSize?: number;
+  page?: number;
+  textSearch?: string;
+  sortProperty?: string;
+  sortOrder?: string;
+}
+
+export interface ScriptTestParams {
+  argNames?: string[];
+  metadata?: Recordable;
+  msg?: string;
+  msgType?: string;
+  script?: string;
+  scriptType?: string;
+}

+import { RuleChainPaginationItemType } from './model/type';
+import { TBPaginationResult } from '/#/axios';
+import { defHttp } from '/@/utils/http/axios';
+import { RuleChainDetail, RuleChainType } from '/@/views/rule/designer/types/ruleNode';
+
+enum Api {
+  SAVE_RULE_CHAINS = '/ruleChain',
+  GET_RULE_CHAINS_DETAIL = '/ruleChain',
+  SAVE = '/ruleChain/metadata',
+  GET_RULE_CHAINES = '/ruleChains',
+  GET_RULE_NODE_EVENTS = '/events/RULE_NODE',
+}
+
+export const saveRuleChainDetail = (params: Partial<RuleChainDetail>) => {
+  return defHttp.post<RuleChainDetail>(
+    {
+      url: Api.SAVE_RULE_CHAINS,
+      data: params,
+    },
+    { joinPrefix: false }
+  );
+};
+
+export const getRuleChainDetail = (id: string) => {
+  return defHttp.get<RuleChainDetail>(
+    {
+      url: `${Api.GET_RULE_CHAINS_DETAIL}/${id}`,
+    },
+    { joinPrefix: false }
+  );
+};
+
+export const getRuleChainData = (id: string) => {
+  return defHttp.get<RuleChainType>(
+    {
+      url: `/ruleChain/${id}/metadata`,
+    },
+    { joinPrefix: false }
+  );
+};
+
+export const saveRuleChainData = (data: RuleChainType) => {
+  return defHttp.post(
+    {
+      url: Api.SAVE,
+      data,
+    },
+    { joinPrefix: false }
+  );
+};
+
+export const getRuleChains = (params: Recordable) => {
+  return defHttp.get<TBPaginationResult<RuleChainPaginationItemType>>(
+    {
+      url: Api.GET_RULE_CHAINES,
+      params,
+    },
+    {
+      joinPrefix: false,
+    }
+  );
+};
+
+export const getRuleNodeEventList = (
+  ruleNodeId: string,
+  params: Recordable,
+  data: Recordable & Record<'eventType', string>
+) => {
+  return defHttp.post<TBPaginationResult>(
+    {
+      url: `${Api.GET_RULE_NODE_EVENTS}/${ruleNodeId}`,
+      params,
+      data,
+    },
+    { joinPrefix: false }
+  );
+};

+export interface RuleChainPaginationItemType {
+  id: Id;
+  createdTime: number;
+  additionalInfo?: AdditionalInfo;
+  tenantId: Id;
+  name: string;
+  type: string;
+  firstRuleNodeId: Id;
+  root: boolean;
+  debugMode: boolean;
+  configuration: any;
+}
+
+export interface Id {
+  entityType: string;
+  id: string;
+}
+
+export interface AdditionalInfo {
+  description: string;
+}

@@ -22,6 +22,8 @@ enum ScreenManagerApi {
   GET_ATTRBUTELIST = '/device/attributes/',
   ALARM_PROFILE = '/alarm/profile/',
   MASTER_GET_DEVICE = '/device/list',
+  RULE_CHAINS = '/ruleChains',
+  RULE_CHAIN = '/ruleChain',
 }
 
 /**
@@ -130,3 +132,83 @@ export const byOrganizationIdGetMasterDevice = (params: {
   });
 };
 //TODO-fengtao
+
+/**
+ * 分页查询规则链库
+ */
+
+export const getRuleChinsList = (params) => {
+  return defHttp.get(
+    {
+      url: `${ScreenManagerApi.RULE_CHAINS}`,
+      params,
+    },
+    { joinPrefix: false }
+  );
+};
+
+/**
+ * 新增规则链
+ */
+
+export const createRuleChine = (params) => {
+  return defHttp.post(
+    {
+      url: `${ScreenManagerApi.RULE_CHAIN}`,
+      params,
+    },
+    { joinPrefix: false }
+  );
+};
+
+export const importRuleChine = (params) => {
+  return defHttp.post(
+    {
+      url: `${ScreenManagerApi.RULE_CHAIN}/metadata`,
+      params,
+    },
+    { joinPrefix: false }
+  );
+};
+
+/**
+ * 删除规则链
+ */
+
+export const deleteRuleChine = (id) => {
+  return defHttp.delete(
+    {
+      url: `${ScreenManagerApi.RULE_CHAIN}/`,
+      params: id,
+    },
+    { joinPrefix: false }
+  );
+};
+
+/**
+ * 导出规则链
+ */
+
+export const exportRuleChine = (id) => {
+  return defHttp.get(
+    {
+      url: `${ScreenManagerApi.RULE_CHAIN}/`,
+      params: id + '/metadata',
+    },
+    { joinPrefix: false }
+  );
+};
+
+/**
+ * 设置根规则链接
+ */
+
+export const settingRootChine = (id) => {
+  return defHttp.post(
+    {
+      url: `${ScreenManagerApi.RULE_CHAIN}/`,
+      params: id + '/root',
+    },
+    { joinPrefix: false }
+  );
+};

@@ -66,7 +66,7 @@ export interface RoleReqDTO {
   name?: string;
   remark?: string;
   status: number;
-  menu: Array<string>;
+  menu: Array<string | number>;
 }
 
 export interface ChangeAccountParams {

@@ -34,6 +34,7 @@ enum Api {
   GetAllRoleList = '/role/find/list',
   BaseUserUrl = '/user',
   BaseOrganization = '/organization',
+  RESET_USER_PASSWORD = '/user/reset_password/',
 }
 
 export const getAccountInfo = (userId: string) =>
@@ -172,3 +173,12 @@ export const resetPassword = (params: ChangeAccountParams) =>
     url: Api.BaseUserUrl + '/reset',
     params: params,
   });
+
+/**
+ * 清除密码
+ * @param params
+ */
+export const clearUserPassword = (userId: string) =>
+  defHttp.post({
+    url: Api.RESET_USER_PASSWORD + userId,
+  });

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1694516709762" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18843" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M515.1 513.6m-429 0a429 429 0 1 0 858 0 429 429 0 1 0-858 0Z" fill="#0B6AE2" p-id="18844"></path><path d="M794.8 773.8C745.7 674.6 670.7 562.3 581 556.7c64.7-25.5 110.5-88.5 110.5-162.3 0-96.3-78.1-174.4-174.4-174.4s-174.4 78.1-174.4 174.4c0 73.7 45.8 136.8 110.5 162.3-90.6 5.7-166.1 120-215.2 220 69.6 73.3 168 119 277 119 110.5-0.1 210-46.9 279.8-121.9z" fill="#ffffff" p-id="18845"></path></svg>
\ No newline at end of file

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1694516489379" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6077" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M512 1024Q0 1024 0 512T512 0q512 0 512 512T512 1024z" fill="#0B6AE2" p-id="6078"></path><path d="M672.814545 802.909091H350.72a81.454545 81.454545 0 0 1-81.454545-81.454546V302.545455a81.454545 81.454545 0 0 1 81.454545-81.454546h322.094545a81.454545 81.454545 0 0 1 81.454546 81.454546v418.90909a81.454545 81.454545 0 0 1-81.454546 81.454546z m-322.094545-512a11.636364 11.636364 0 0 0-11.636364 11.636364v418.90909a11.636364 11.636364 0 0 0 11.636364 11.636364h322.094545a11.636364 11.636364 0 0 0 11.636364-11.636364V302.545455a11.636364 11.636364 0 0 0-11.636364-11.636364z" fill="#FFFFFF" p-id="6079"></path><path d="M376.785455 560.407273m29.090909 0l212.247272 0q29.090909 0 29.090909 29.090909l0-0.232727q0 29.090909-29.090909 29.090909l-212.247272 0q-29.090909 0-29.090909-29.090909l0 0.232727q0-29.090909 29.090909-29.090909Z" fill="#FFFFFF" p-id="6080"></path><path d="M512 676.305455m-29.090909 0a29.090909 29.090909 0 1 0 58.181818 0 29.090909 29.090909 0 1 0-58.181818 0Z" fill="#FFFFFF" p-id="6081"></path></svg>
\ No newline at end of file

 <script lang="ts" setup>
-  import { ref, watch } from 'vue';
-  import JSONEditor, { JSONEditorOptions } from 'jsoneditor';
-  import 'jsoneditor/dist/jsoneditor.min.css';
-  import { unref } from 'vue';
-  import { onMounted } from 'vue';
-  import { computed } from '@vue/reactivity';
-  import { onUnmounted } from 'vue';
+  import { onMounted, computed, onUnmounted, unref, ref, watch } from 'vue';
+  import { Tooltip } from 'ant-design-vue';
+  import { Icon } from '/@/components/Icon';
+  import { useFullscreen } from '@vueuse/core';
+  import { isNumber, isObject, isString } from '/@/utils/is';
+  import AceEditor, { Ace } from 'ace-builds';
+  import workerJsonUrl from 'ace-builds/src-noconflict/worker-json?url';
+  import githubTheme from 'ace-builds/src-noconflict/theme-github?url';
+  import 'ace-builds/src-noconflict/mode-json';
 
   enum EventEnum {
     UPDATE_VALUE = 'update:value',
@@ -16,89 +18,134 @@
 
   const props = withDefaults(
     defineProps<{
-      value?: string;
-      options?: JSONEditorOptions;
-      height?: number;
+      value?: string | Recordable;
+      height?: number | string;
+      title?: string;
+      disabled?: boolean;
     }>(),
     {
-      options: () =>
-        ({
-          mode: 'code',
-          mainMenuBar: false,
-          statusBar: false,
-        } as JSONEditorOptions),
       height: 150,
     }
   );
 
   const emit = defineEmits<{
-    (e: EventEnum.UPDATE_VALUE, value: any, instance?: JSONEditor): void;
-    (e: EventEnum.CHANGE, value: any, instance?: JSONEditor): void;
-    (e: EventEnum.BLUR, event: Event, instance?: JSONEditor): void;
-    (e: EventEnum.FOCUS, event: Event, instance?: JSONEditor): void;
+    (e: EventEnum.UPDATE_VALUE, value: any, instance?: Ace.Editor): void;
+    (e: EventEnum.CHANGE, value: any, instance?: Ace.Editor): void;
+    (e: EventEnum.BLUR, event: Event, instance?: Ace.Editor): void;
+    (e: EventEnum.FOCUS, event: Event, instance?: Ace.Editor): void;
   }>();
 
   const jsonEditorElRef = ref<Nullable<any>>();
 
-  const editoreRef = ref<JSONEditor>();
+  const editoreRef = ref<Ace.Editor>();
 
   const isFocus = ref(false);
 
-  const handleChange = (value: any) => {
+  const handleOnChange = () => {
+    const value = get();
     emit(EventEnum.UPDATE_VALUE, value, unref(editoreRef));
     emit(EventEnum.CHANGE, value, unref(editoreRef));
   };
 
-  const handleEmit = (event: Event, key: EventEnum) => {
-    emit(key as EventEnum[keyof EventEnum], event, unref(editoreRef));
+  const handleOnBlur = (event: Event) => {
+    isFocus.value = false;
+    emit(EventEnum.BLUR, event, unref(editoreRef));
   };
 
-  const getOptions = computed(() => {
-    const { options } = props;
-    return {
-      ...options,
-      onChangeText: handleChange,
-      onBlur: (event: Event) => {
-        isFocus.value = false;
-        handleEmit(event, EventEnum.BLUR);
-      },
-      onFocus: (event: Event) => {
-        isFocus.value = true;
-        handleEmit(event, EventEnum.FOCUS);
-      },
-    } as JSONEditorOptions;
-  });
+  const handleOnFocus = (event: Event) => {
+    isFocus.value = true;
+    emit(EventEnum.FOCUS, event, unref(editoreRef));
+  };
+
+  const getFormatValue = (value: Recordable | string = '') => {
+    return isObject(value) ? JSON.stringify(value, null, 2) : value;
+  };
 
   const initialize = () => {
-    editoreRef.value = new JSONEditor(unref(jsonEditorElRef), unref(getOptions));
+    AceEditor.config.setModuleUrl('ace/mode/json_worker', workerJsonUrl);
+    AceEditor.config.setModuleUrl('ace/theme/github', githubTheme);
+    const editor = AceEditor.edit(unref(jsonEditorElRef)!, {
+      mode: 'ace/mode/json',
+    });
+    editor.setTheme('ace/theme/github');
+    editor.setOptions({
+      fontSize: 14,
+    });
+
+    editor.on('change', handleOnChange);
+    editor.on('blur', handleOnBlur);
+    editor.on('focus', handleOnFocus);
+
+    editoreRef.value = editor;
+    unref(editoreRef)?.setValue(getFormatValue(props.value), 1);
+    unref(editoreRef)?.setReadOnly(props.disabled);
   };
 
   watch(
     () => props.value,
     (target) => {
+      // const position = unref(editoreRef)?.getCursorPosition();
       if (unref(isFocus)) return;
-      unref(editoreRef)?.setText(target || '');
+      unref(editoreRef)?.setValue(getFormatValue(target));
+      unref(editoreRef)?.clearSelection();
+      // position && unref(editoreRef)?.moveCursorToPosition(position!);
     },
     {
       immediate: true,
     }
   );
 
+  watch(
+    () => props.disabled,
+    (value) => {
+      unref(editoreRef)?.setReadOnly(value);
+    }
+  );
+
   const get = (): string => {
-    return unref(editoreRef)?.getText() || '';
+    return unref(editoreRef)?.getValue() || '';
   };
 
   const set = (data: any) => {
-    return unref(editoreRef)?.set(data);
+    return unref(editoreRef)?.setValue(getFormatValue(data));
   };
 
   onMounted(() => {
     initialize();
-    unref(editoreRef)?.setText(props.value || '');
+    unref(editoreRef)?.setValue(getFormatValue(props.value));
   });
 
   onUnmounted(() => {
+    unref(editoreRef)?.off('change', handleOnChange);
+    unref(editoreRef)?.off('blur', handleOnBlur);
+    unref(editoreRef)?.off('focus', handleOnFocus);
     unref(editoreRef)?.destroy();
+    unref(editoreRef)?.container.remove();
+  });
+
+  const handleFormat = () => {
+    const value = get();
+    if (isString(value) && !value) return;
+    unref(editoreRef)?.setValue(JSON.stringify(JSON.parse(value), null, 2));
+    unref(editoreRef)?.clearSelection();
+  };
+
+  const handleCompress = () => {
+    const value = get();
+    if (isString(value) && !value) return;
+    unref(editoreRef)?.setValue(JSON.stringify(JSON.parse(value)));
+    unref(editoreRef)?.clearSelection();
+  };
+
+  const jsonEditorContainerElRef = ref<Nullable<HTMLDivElement>>();
+  const { isFullscreen, isSupported, toggle } = useFullscreen(jsonEditorContainerElRef);
+  const handleFullScreen = () => {
+    toggle();
+  };
+
+  const getHeight = computed(() => {
+    const { height } = props;
+    return isNumber(height) ? `${height}px` : height;
   });
 
   defineExpose({
@@ -108,22 +155,41 @@
 </script>
 
 <template>
-  <div class="p-2 bg-gray-200" :style="{ height: `${height}px` }">
-    <div ref="jsonEditorElRef" class="jsoneditor"></div>
+  <div
+    ref="jsonEditorContainerElRef"
+    class="p-2 bg-gray-200 flex flex-col"
+    :style="{ height: getHeight }"
+  >
+    <div class="w-full h-8 flex justify-between items-center">
+      <div>
+        {{ title }}
+      </div>
+      <slot name="header"></slot>
+      <div class="flex h-8 gap-3 justify-end items-center text-dark-500 svg:text-2xl">
+        <slot name="beforeFormat"></slot>
+        <Tooltip title="整洁">
+          <Icon @click="handleFormat" class="cursor-pointer" icon="gg:format-left" />
+        </Tooltip>
+        <slot name="beforeCompress"></slot>
+
+        <Tooltip title="迷你">
+          <Icon @click="handleCompress" class="cursor-pointer" icon="material-symbols:compress" />
+        </Tooltip>
+        <slot name="beforeFullScreen"></slot>
+
+        <Tooltip title="全屏">
+          <Icon
+            v-if="isSupported"
+            class="cursor-pointer"
+            :icon="
+              isFullscreen ? 'material-symbols:fullscreen-exit' : 'material-symbols:fullscreen'
+            "
+            @click="handleFullScreen"
+          />
+        </Tooltip>
+        <slot name="afterFullScreen"></slot>
+      </div>
+    </div>
+    <div ref="jsonEditorElRef" class="flex-auto"></div>
   </div>
 </template>
-
-<style lang="less" scoped>
-  .jsoneditor {
-    border: none !important;
-
-    :deep(.jsoneditor) {
-      border: none !important;
-
-      .ace-jsoneditor,
-      textarea.jsoneditor-text {
-        min-height: auto;
-      }
-    }
-  }
-</style>

@@ -13,6 +13,7 @@ export { default as ApiRadioGroup } from './src/components/ApiRadioGroup.vue';
 export { default as ApiUpload } from './src/components/ApiUpload.vue';
 
 export { default as StructForm } from './src/externalCompns/components/StructForm/StructForm.vue';
+export { default as JavaScriptFunctionEditor } from './src/components/JavaScriptFunctionEditor.vue';
 
 //注册自定义组件
 export {

@@ -16,6 +16,7 @@
           :formProps="getProps"
           :allDefaultValues="defaultValueRef"
           :formModel="formModel"
+          :validateFields="validateFields"
           :setFormModel="setFormModel"
         >
           <template #[item]="data" v-for="item in Object.keys($slots)">

@@ -14,6 +14,7 @@
   import { get, omit } from 'lodash-es';
   import { LoadingOutlined } from '@ant-design/icons-vue';
   import { useI18n } from '/@/hooks/web/useI18n';
+  import { useDebounceFn } from '@vueuse/shared';
 
   const emit = defineEmits(['options-change', 'change']);
   const props = withDefaults(
@@ -27,6 +28,7 @@
       labelField?: string;
       valueField?: string;
       immediate?: boolean;
+      searchField?: string;
       queryEmptyDataAgin?: boolean;
       onChangeHook?: ({ options }: OnChangeHookParams) => void;
       dropdownVisibleChangeHook?: ({ options }: OnChangeHookParams) => void;
@@ -35,6 +37,7 @@
       resultField: '',
       labelField: 'label',
       valueField: 'value',
+      searchField: 'text',
       immediate: true,
       queryEmptyDataAgin: true,
     }
@@ -53,17 +56,27 @@
     const { labelField, valueField = 'value', numberToString } = props;
     return unref(options).reduce((prev, next: Recordable) => {
       if (next) {
-        const value = next[valueField];
+        const value = get(next, valueField);
+        const label = get(next, labelField);
         prev.push({
-          label: next[labelField],
-          value: numberToString ? `${value}` : value,
           ...omit(next, [labelField, valueField]),
+          label,
+          value: numberToString ? `${value}` : value,
         });
       }
       return prev;
     }, [] as OptionsItem[]);
   });
 
+  const getBindProps = computed(() => {
+    const { searchApi } = props;
+    return {
+      ...attrs,
+      showSearch: true,
+      filterOption: !searchApi,
+    };
+  });
+
   watchEffect(() => {
     props.immediate && fetch();
   });
@@ -122,8 +135,9 @@
     onChangeHook({ options });
   }
 
+  const debounceSearchFunction = useDebounceFn(handleSearch, 300);
   async function handleSearch(params?: string) {
-    let { searchApi, api } = props;
+    let { searchApi, api, searchField } = props;
     if (!searchApi || !isFunction(searchApi)) {
       if (!api || !isFunction(api)) return;
       searchApi = api;
@@ -131,7 +145,7 @@
     options.value = [];
     try {
       loading.value = true;
-      const res = await searchApi({ ...props.params, text: params });
+      const res = await searchApi({ ...props.params, [searchField]: params });
       if (Array.isArray(res)) {
         options.value = res;
         emitChange();
@@ -152,11 +166,10 @@
 <template>
   <Select
     @dropdownVisibleChange="handleFetch"
-    v-bind="attrs"
-    show-search
+    v-bind="getBindProps"
     @change="handleChange"
     :options="getOptions"
-    @search="handleSearch"
+    @search="debounceSearchFunction"
     v-model:value="state"
   >
     <template #[item]="data" v-for="item in Object.keys($slots)">

@@ -126,10 +126,16 @@
         }
       }
 
-      async function handleFetch() {
-        if (!props.immediate && unref(isFirstLoad)) {
+      // async function handleFetch() {
+      //   if (!props.immediate && unref(isFirstLoad)) {
+      //     await fetch();
+      //     isFirstLoad.value = false;
+      //   }
+      // }
+
+      async function handleFetch(open) {
+        if (open) {
           await fetch();
-          isFirstLoad.value = false;
         }
       }
 

@@ -6,7 +6,7 @@
 <script lang="ts" setup>
   import { ref, watchEffect, computed, unref, watch, reactive } from 'vue';
   import { Select, Spin } from 'ant-design-vue';
-  import { isFunction } from '/@/utils/is';
+  import { isFunction, isNullAndUnDef } from '/@/utils/is';
   import { useRuleFormItem } from '/@/hooks/component/useFormItem';
   import { useAttrs } from '/@/hooks/core/useAttrs';
   import { get, omit } from 'lodash-es';
@@ -30,8 +30,11 @@
       labelField?: string;
       valueField?: string;
       immediate?: boolean;
-      pagenation?: Pagination;
+      searchField?: string;
+      pagination?: Pagination;
       queryEmptyDataAgin?: boolean;
+      fetchSearch?: boolean;
+      filterOption?: (inputValue: string, options: Recordable) => boolean;
     }>(),
     {
       resultField: '',
@@ -39,14 +42,15 @@
       valueField: 'value',
       immediate: true,
       queryEmptyDataAgin: true,
-      pagenation: () => ({ page: 1, pageSize: 10 }),
+      pagination: () => ({ page: 1, pageSize: 10 }),
+      fetchSearch: false,
     }
   );
 
   const OptionsItem = (_, { attrs }: { attrs: { vNode: any } }) => attrs.vNode;
 
   const options = ref<OptionsItem[]>([]);
-  const pagination = reactive(Object.assign({ total: 0, page: 1, pageSize: 10 }, props.pagenation));
+  const pagination = reactive<Record<'total' | 'page' | 'pageSize', number>>({} as any);
   const scrollLoading = ref(false);
   const lock = ref(false);
   const loading = ref(false);
@@ -55,6 +59,13 @@
   const attrs = useAttrs();
   const { t } = useI18n();
 
+  const getPagination = computed(() => {
+    return {
+      ...props.pagination,
+      ...unref(pagination),
+    };
+  });
+
   // Embedded in the form, just use the hook binding to perform form verification
   const [state] = useRuleFormItem(props, 'value', 'change', emitData);
 
@@ -86,16 +97,18 @@
     { deep: true }
   );
 
-  async function fetch() {
-    const api = props.api;
+  async function fetch(searchText?: string) {
+    const { api, searchField, fetchSearch } = props;
     if (!api || !isFunction(api)) return;
+    const isFetchSearchFlag = fetchSearch && !isNullAndUnDef(searchText) && searchField;
     try {
       !unref(getOptions).length ? (loading.value = true) : (scrollLoading.value = true);
       lock.value = true;
       const { total, items } = await api({
         ...props.params,
-        page: pagination.page,
-        pageSize: pagination.pageSize,
+        page: unref(getPagination).page,
+        pageSize: unref(getPagination).pageSize,
+        ...(isFetchSearchFlag ? { [searchField!]: searchText } : {}),
       });
 
       pagination.total = total;
@@ -105,11 +118,13 @@
         return;
       }
       if (props.resultField) {
-        options.value = [...options.value, ...(get(items, props.resultField) || [])];
+        options.value = isFetchSearchFlag
+          ? get(items, props.resultField) || []
+          : [...options.value, ...(get(items, props.resultField) || [])];
       }
       emitChange();
     } catch (error) {
-      pagination.page = Math.ceil(unref(getOptions).length / pagination.pageSize);
+      pagination.page = Math.ceil(unref(getOptions).length / unref(getPagination).pageSize);
       console.warn(error);
     } finally {
       isFirstLoad.value = false;
@@ -134,17 +149,38 @@
     emitData.value = args;
   }
 
+  const sleep = async (number: number) => {
+    return new Promise((resolve) => {
+      setTimeout(() => {
+        resolve(number);
+      }, number);
+    });
+  };
+
   async function handlePopupScroll(event: MouseEvent) {
     const { scrollHeight, scrollTop, clientHeight } = event.target as HTMLDivElement;
     if (scrollTop + clientHeight >= scrollHeight) {
-      if (unref(getOptions).length < pagination.total && !unref(lock)) {
-        pagination.page = pagination.page + 1;
+      if (unref(getOptions).length < unref(getPagination).total && !unref(lock)) {
+        pagination.page = unref(getPagination).page + 1;
+        scrollLoading.value = true;
+        await sleep(500);
         await fetch();
       }
     }
   }
 
   const debounceHandlePopupScroll = useDebounceFn(handlePopupScroll, 100);
+
+  const handleFilterOption = async (inputValue: string, option: Recordable) => {
+    const { filterOption, fetchSearch } = props;
+    if (filterOption && isFunction(filterOption)) {
+      return filterOption?.(inputValue, option);
+    }
+
+    if (fetchSearch) {
+      await fetch(inputValue);
+    }
+  };
 </script>
 
 <template>
@@ -152,7 +188,10 @@
     @dropdownVisibleChange="handleFetch"
     v-bind="attrs"
     @change="handleChange"
+    @filterOption="handleFilterOption"
     :options="getOptions"
+    optionFilterProp="label"
+    :showSearch="true"
     v-model:value="state"
     @popup-scroll="debounceHandlePopupScroll"
   >

@@ -9,7 +9,7 @@
   import { useMessage } from '/@/hooks/web/useMessage';
   import { computed, ref, unref } from 'vue';
   import { cloneDeep } from 'lodash-es';
-  import { isFunction, isNumber, isObject } from '/@/utils/is';
+  import { isFunction, isNumber, isObject, isString } from '/@/utils/is';
   import { useDesign } from '/@/hooks/web/useDesign';
 
   export interface FileItem {
@@ -40,21 +40,38 @@
       accept?: string;
       maxSize?: number;
       disabled?: boolean;
-      listType?: string;
+      listType?: 'text' | 'picture-card' | 'picture';
       multiple?: boolean;
       maxFileLimit?: number;
-      showUploadList?: boolean | { showPreviewIcon?: boolean; showRemoveIcon?: boolean };
+      showUploadList?: InstanceType<typeof Upload>['$props']['showUploadList'];
       transformFile?: (file: File) => string | Blob | Promise<string | Blob | File>;
       api: (file: string | Blob | Promise<string | Blob | File>) => Promise<FileItem>;
+      overFileLimitHiddenUploadEntry?: boolean;
+      beforeUpload?: (file: File, fileList: File[]) => boolean;
     }>(),
     {
       fileList: () => [],
       maxSize: 5 * 1024 * 1024,
+      overFileLimitHiddenUploadEntry: true,
+      listType: 'text',
       showUploadList: () => ({ showPreviewIcon: true, showRemoveIcon: true }),
     }
   );
 
-  const handleBeforeUpload = (file: File) => {
+  const handleBeforeUpload = (file: File, fileList: File[]) => {
+    const { beforeUpload, accept } = props;
+
+    if (beforeUpload && isFunction(beforeUpload)) return beforeUpload?.(file, fileList);
+
+    if (accept && isString(accept)) {
+      const limitFileSuffix = accept.split(',');
+
+      if (limitFileSuffix.length && !limitFileSuffix.some((suffix) => file.name.includes(suffix))) {
+        createMessage.warning(`允许上传的文件类型包括${accept}`);
+        return false;
+      }
+    }
+
     if (file.size > props.maxSize) {
       createMessage.warning(`文件大小超过${Math.floor(props.maxSize / 1024 / 1024)}mb`);
       return false;
@@ -75,7 +92,7 @@
 
   const getMaxFileLimit = computed(() => {
     const { maxFileLimit } = props;
-    return isPictureCard.value ? 1 : maxFileLimit;
+    return isPictureCard.value ? 1 : maxFileLimit || 1;
   });
 
   const handleUpload = async (file: File | string | Blob | Promise<string | Blob | File>) => {
@@ -126,16 +143,21 @@
 <template>
   <Upload
     class="block"
+    :accept="accept"
     :class="prefixCls"
     :file-list="props.fileList"
     :list-type="props.listType"
     :disabled="getDisabled"
     :before-upload="handleBeforeUpload"
+    :show-upload-list="showUploadList"
     @preview="handlePreview"
     @download="handleDownload"
     :remove="handleRemove"
   >
-    <Spin v-if="!fileList.length" :spinning="loading">
+    <Spin
+      v-if="!(fileList.length >= getMaxFileLimit && overFileLimitHiddenUploadEntry)"
+      :spinning="loading"
+    >
       <div class="w-full h-full flex flex-col justify-center content-center">
         <Tooltip title="点击上传或拖拽上传">
           <InboxOutlined class="text-[3rem] !text-blue-500" />

@@ -14,6 +14,7 @@
   import { upperFirst, cloneDeep } from 'lodash-es';
   import { useItemLabelWidth } from '../hooks/useLabelWidth';
   import { useI18n } from '/@/hooks/web/useI18n';
+  import { NamePath, ValidateOptions } from 'ant-design-vue/lib/form/interface';
 
   export default defineComponent({
     name: 'BasicFormItem',
@@ -39,6 +40,12 @@
         type: Function as PropType<(key: string, value: any) => void>,
         default: null,
       },
+      validateFields: {
+        type: Function as PropType<
+          (nameList?: NamePath[], options?: ValidateOptions) => Promise<any>
+        >,
+        default: null,
+      },
       tableAction: {
         type: Object as PropType<TableActionType>,
       },
@@ -208,6 +215,7 @@
             rules[characterInx].message ||
             t('component.form.maxTip', [rules[characterInx].max] as Recordable);
         }
+        rules.forEach((item) => !item.trigger && (item.trigger = 'change'));
         return rules;
       }
 
@@ -234,6 +242,10 @@
             const value = target ? (isCheck ? target.checked : target.value) : e;
             props.setFormModel(field, value);
           },
+          onBlur: (...args: any[]) => {
+            unref(getComponentsProps)?.onBlur?.(...args);
+            props.validateFields([field], { triggerName: 'blur' }).catch((_) => {});
+          },
         };
         const Comp = componentMap.get(component) as ReturnType<typeof defineComponent>;
 

+<script lang="ts" setup>
+  import { Icon } from '/@/components/Icon';
+  import { Tooltip } from 'ant-design-vue';
+  import { computed, onMounted, onUnmounted, ref, shallowRef, unref, watch } from 'vue';
+  import AceEditor, { Ace } from 'ace-builds';
+  import workerJavascriptUrl from 'ace-builds/src-noconflict/worker-javascript?url';
+  import githubTheme from 'ace-builds/src-noconflict/theme-github?url';
+  import 'ace-builds/src-noconflict/mode-javascript';
+  import 'ace-builds/src-noconflict/ext-searchbox';
+  import 'ace-builds/src-noconflict/ext-language_tools';
+  import 'ace-builds/src-noconflict/snippets/javascript';
+  import { useBeautify } from '/@/hooks/business/useBeautify';
+  import { useFullscreen } from '@vueuse/core';
+  import { isNumber } from '/@/utils/is';
+
+  const emit = defineEmits(['update:value', 'focus', 'blur']);
+  const props = withDefaults(
+    defineProps<{
+      functionName?: string;
+      paramsName?: string[];
+      height?: number | string;
+      value?: string;
+      disabled?: boolean;
+      validateStatus?: boolean;
+    }>(),
+    {
+      functionName: 'method',
+      paramsName: () => [],
+      height: 200,
+      value: '',
+    }
+  );
+
+  const getHeight = computed(() => {
+    const { height } = props;
+    return isNumber(height) ? `${height}px` : height;
+  });
+
+  const javaScriptEditorElRef = ref<Nullable<HTMLDivElement>>();
+  const editorInstance = shallowRef<Ace.Editor>();
+  const isFocus = ref(false);
+
+  const handleFocus = () => {
+    isFocus.value = true;
+    emit('focus', unref(editorInstance));
+  };
+
+  const handleBlur = () => {
+    isFocus.value = false;
+    emit('update:value', get());
+    emit('blur', unref(editorInstance));
+  };
+
+  const handleChange = () => {
+    emit('update:value', get());
+  };
+
+  const initEditor = () => {
+    AceEditor.config.setModuleUrl('ace/mode/javascript_worker', workerJavascriptUrl);
+    AceEditor.config.setModuleUrl('ace/theme/github', githubTheme);
+    const editor = AceEditor.edit(unref(javaScriptEditorElRef)!, {
+      mode: 'ace/mode/javascript',
+    });
+    editor.setTheme('ace/theme/github');
+    editor.setOptions({
+      fontSize: 14,
+      enableBasicAutocompletion: true,
+      enableSnippets: true,
+      enableLiveAutocompletion: true,
+    });
+
+    editor.on('focus', handleFocus);
+    editor.on('blur', handleBlur);
+    editor.on('change', handleChange);
+    editorInstance.value = editor;
+    editor.setValue(props.value);
+    editor?.clearSelection();
+    unref(editorInstance)?.setReadOnly(props.disabled);
+  };
+
+  const get = () => {
+    return unref(editorInstance)?.getValue();
+  };
+
+  const set = (val: string, cursorPos?: number) => {
+    return unref(editorInstance)?.setValue(val, cursorPos);
+  };
+
+  onMounted(() => {
+    initEditor();
+  });
+
+  onUnmounted(() => {
+    unref(editorInstance)?.off('change', handleChange);
+    unref(editorInstance)?.off('focus', handleFocus);
+    unref(editorInstance)?.off('blur', handleBlur);
+    unref(editorInstance)?.destroy();
+    unref(editorInstance)?.container.remove();
+  });
+
+  const { beautifyJs } = useBeautify();
+  const handleFormatCode = async () => {
+    const res = await beautifyJs(get() || '', { indent_size: 4, wrap_line_length: 60 });
+    set(res || '', -1);
+  };
+
+  const jsFunctionContainerElRef = ref<Nullable<HTMLDivElement>>();
+  const { isFullscreen, isSupported, toggle } = useFullscreen(jsFunctionContainerElRef);
+  const handleFullScreen = () => {
+    toggle();
+  };
+
+  watch(
+    () => props.value,
+    (value) => {
+      // const position = unref(editorInstance)?.getCursorPosition();
+      if (unref(isFocus)) return;
+      set(value);
+      unref(editorInstance)?.clearSelection();
+      // position && unref(editorInstance)?.moveCursorToPosition(position!);
+    },
+    {
+      immediate: true,
+    }
+  );
+
+  watch(
+    () => props.disabled,
+    (value) => {
+      unref(editorInstance)?.setReadOnly(value);
+    }
+  );
+
+  defineExpose({
+    get,
+    set,
+  });
+</script>
+
+<template>
+  <section
+    ref="jsFunctionContainerElRef"
+    class="p-2 bg-gray-200 flex flex-col"
+    :style="{ height: getHeight }"
+  >
+    <head class="flex justify-between h-8 items-center">
+      <div class="font-bold">
+        <span>function</span>
+        <span class="ml-1">{{ functionName }}</span>
+        <span>({{ paramsName.join(',') }})</span>
+        <span class="ml-1">{</span>
+      </div>
+      <div class="flex gap-3 items-center svg:text-2xl">
+        <slot name="beforeFormat"></slot>
+
+        <Tooltip title="整洁">
+          <Icon class="cursor-pointer" icon="gg:format-left" @click="handleFormatCode" />
+        </Tooltip>
+        <slot name="beforeFullScreen"></slot>
+        <Tooltip title="全屏">
+          <Icon
+            v-if="isSupported"
+            class="cursor-pointer"
+            :icon="
+              isFullscreen ? 'material-symbols:fullscreen-exit' : 'material-symbols:fullscreen'
+            "
+            @click="handleFullScreen"
+          />
+        </Tooltip>
+        <slot name="afterFullScreen"></slot>
+      </div>
+    </head>
+    <main ref="javaScriptEditorElRef" class="flex-auto"> </main>
+    <footer class="font-bold">}</footer>
+  </section>
+</template>

@@ -30,12 +30,14 @@
       modalProps?: ExtractPropTypes<InstanceType<typeof BasicModal>['$props']>;
       transferProps?: ExtractPropTypes<TransferType['$props']>;
       buttonProps?: ExtractPropTypes<InstanceType<typeof Button>['$props']>;
+      disabled?: any;
     }>(),
     {
       labelField: 'label',
       valueField: 'value',
       buttonName: '选择产品',
       maxTagLength: 2,
+      disabled: false,
     }
   );
 
@@ -146,6 +148,8 @@
   );
 
   const handleOpenModal = () => {
+    const { disabled } = props;
+    if (disabled) return;
     openModal(true);
   };
 

@@ -42,6 +42,7 @@
       onValueChange?: (selectedRowkeys: string[]) => any[];
       onRemoveAfter?: (actionType: ActionType) => Promise<any>;
       onSelectedAfter?: (actionType: ActionType) => Promise<any>;
+      disabled?: any;
     }>(),
     {
       buttonName: '选择设备',
@@ -49,6 +50,7 @@
       maxTagLength: 2,
       labelField: 'label',
       valueField: 'value',
+      disabled: false,
     }
   );
 
@@ -217,6 +219,8 @@
   }
 
   const handleOpenModal = async () => {
+    const { disabled } = props;
+    if (disabled) return;
     openModal(true);
     await nextTick();
     if (props.value && !props.value.length) {

@@ -3,24 +3,26 @@
     <a-input
       placeholder="请输入参数key"
       v-model:value="param.label"
+      :disabled="disabled"
       style="width: 38%; margin-bottom: 5px"
       @change="emitChange"
     />
     <a-input
       placeholder="请输入参数value"
+      :disabled="disabled"
       v-model:value="param.value"
       style="width: 38%; margin: 0 0 5px 60px"
       @change="emitChange"
     />
     <MinusCircleOutlined
-      v-if="dynamicInput.params.length > min"
+      v-if="dynamicInput.params.length > min && !disabled"
       class="dynamic-delete-button"
       @click="remove(param)"
       style="width: 50px"
     />
   </div>
   <div>
-    <a-button type="dashed" style="width: 38%" @click="add">
+    <a-button :disabled="disabled" type="dashed" style="width: 38%" @click="add">
       <PlusOutlined />
       新增
     </a-button>
@@ -49,11 +51,16 @@
       value: propTypes.object.def({}),
       //自定义删除按钮多少才会显示
       min: propTypes.integer.def(0),
+      disabled: {
+        type: Boolean,
+        default: false,
+      },
     },
     emits: ['change', 'update:value'],
     setup(props, { emit }) {
       //input动态数据
       const dynamicInput: UnwrapRef<{ params: Params[] }> = reactive({ params: [] });
+
       //删除Input
       const remove = (item: Params) => {
         let index = dynamicInput.params.indexOf(item);
@@ -108,6 +115,7 @@
         emitChange,
         remove,
         add,
+        // disabled,
       };
     },
   });

@@ -39,7 +39,7 @@ export const formSchemas = (hasStructForm: boolean, isTcp = false): FormSchema[]
         span: 18,
       },
       componentProps: {
-        maxLength: 255,
+        maxLength: 32,
         placeholder: '请输入功能名称',
       },
     },
@@ -52,7 +52,7 @@ export const formSchemas = (hasStructForm: boolean, isTcp = false): FormSchema[]
         span: 18,
       },
       componentProps: {
-        maxLength: 255,
+        maxLength: 128,
         placeholder: '请输入标识符',
       },
     },

 import type { FormProps, FormActionType, UseFormReturnType, FormSchema } from '../types/form';
-import type { NamePath } from 'ant-design-vue/lib/form/interface';
+import type { NamePath, ValidateOptions } from 'ant-design-vue/lib/form/interface';
 import type { DynamicProps } from '/#/utils';
 import { ref, onUnmounted, unref, nextTick, watch } from 'vue';
 import { isProdMode } from '/@/utils/env';
@@ -112,9 +112,12 @@ export function useForm(props?: Props): UseFormReturnType {
       return form.validate(nameList);
     },
 
-    validateFields: async (nameList?: NamePath[]): Promise<Recordable> => {
+    validateFields: async (
+      nameList?: NamePath[],
+      options?: ValidateOptions
+    ): Promise<Recordable> => {
       const form = await getForm();
-      return form.validateFields(nameList);
+      return form.validateFields(nameList, options);
     },
   };
 

 import type { ComputedRef, Ref } from 'vue';
 import type { FormProps, FormSchema, FormActionType } from '../types/form';
-import type { NamePath } from 'ant-design-vue/lib/form/interface';
+import type { NamePath, ValidateOptions } from 'ant-design-vue/lib/form/interface';
 import { unref, toRaw } from 'vue';
 import { isArray, isFunction, isObject, isString } from '/@/utils/is';
 import { deepMerge } from '/@/utils';
@@ -206,8 +206,8 @@ export function useFormEvents({
     });
   }
 
-  async function validateFields(nameList?: NamePath[] | undefined) {
-    return unref(formElRef)?.validateFields(nameList);
+  async function validateFields(nameList?: NamePath[] | undefined, options?: ValidateOptions) {
+    return unref(formElRef)?.validateFields(nameList, options);
   }
 
   async function validate(nameList?: NamePath[] | undefined) {

@@ -38,7 +38,7 @@ export const basicProps = {
   },
   autoSetPlaceHolder: propTypes.bool.def(true),
   // 在INPUT组件上单击回车时，是否自动提交
-  autoSubmitOnEnter: propTypes.bool.def(false),
+  autoSubmitOnEnter: propTypes.bool.def(true),
   submitOnReset: propTypes.bool,
   size: propTypes.oneOf(['default', 'small', 'large']).def('default'),
   // 禁用表单

-import type { NamePath, RuleObject } from 'ant-design-vue/lib/form/interface';
+import type { NamePath, RuleObject, ValidateOptions } from 'ant-design-vue/lib/form/interface';
 import type { VNode } from 'vue';
 import type { ButtonProps as AntdButtonProps } from '/@/components/Button';
 import type { FormItem } from './formItem';
@@ -39,7 +39,7 @@ export interface FormActionType {
     prefixField: string | undefined,
     first?: boolean | undefined
   ) => Promise<void>;
-  validateFields: (nameList?: NamePath[]) => Promise<any>;
+  validateFields: (nameList?: NamePath[], options?: ValidateOptions) => Promise<any>;
   validate: (nameList?: NamePath[]) => Promise<any>;
   scrollToField: (name: NamePath, options?: ScrollOptions) => Promise<void>;
 }

@@ -130,4 +130,11 @@ export type ComponentType =
   | 'ControlGroup'
   | 'JSONEditor'
   | 'OrgTreeSelect'
-  | 'ExtendDesc';
+  | 'ExtendDesc'
+  | 'JavaScriptFunctionEditor'
+  | 'JavascriptEditorWithTestModal'
+  | 'AttributeConfiguration'
+  | 'CorrelationFilters'
+  | 'RelationsQuery'
+  | 'CredentialsCard'
+  | 'ApiComplete';

@@ -394,6 +394,13 @@
       //.ant-table-tbody > tr.ant-table-row-selected td {
       //background-color: fade(@primary-color, 8%) !important;
       //}
+      .ant-table-placeholder {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        height: 670px;
+        max-height: 670px;
+      }
     }
 
     .ant-pagination {

@@ -48,6 +48,7 @@
       'update:value',
       'change',
       'check',
+      'unSelectAll',
       'update:searchValue',
     ],
     setup(props, { attrs, slots, emit, expose }) {
@@ -188,6 +189,7 @@
       }
 
       function checkAll(checkAll: boolean) {
+        if (!checkAll) emit('unSelectAll');
         state.checkedKeys = checkAll ? getEnabledKeys() : ([] as Keys);
       }
 

@@ -2,17 +2,23 @@
   import { isNumber } from 'lodash';
   import videoJs, { VideoJsPlayer, VideoJsPlayerOptions } from 'video.js';
   import 'video.js/dist/video-js.css';
-  import { computed, CSSProperties, onMounted, onUnmounted, ref, unref } from 'vue';
+  import { computed, CSSProperties, onMounted, onUnmounted, ref, toRaw, unref } from 'vue';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { getJwtToken, getShareJwtToken } from '/@/utils/auth';
   import { isShareMode } from '/@/views/sys/share/hook';
   import 'videojs-flvjs-es6';
   const { prefixCls } = useDesign('basic-video-play');
 
-  const props = defineProps<{
-    options?: VideoJsPlayerOptions;
-    withToken?: boolean;
-  }>();
+  const props = withDefaults(
+    defineProps<{
+      options?: VideoJsPlayerOptions;
+      withToken?: boolean;
+      immediateInitOnMounted?: boolean;
+    }>(),
+    {
+      immediateInitOnMounted: true,
+    }
+  );
 
   const emit = defineEmits<{
     (event: 'ready', instance?: Nullable<VideoJsPlayer>): void;
@@ -68,8 +74,18 @@
     });
   };
 
+  const customInit = (getOptionsFn: (optios: VideoJsPlayerOptions) => VideoJsPlayerOptions) => {
+    return (videoPlayInstance.value = videoJs(
+      unref(videoPlayEl)!,
+      getOptionsFn(toRaw(unref(getOptions))),
+      () => {
+        emit('ready', unref(videoPlayInstance));
+      }
+    ));
+  };
+
   onMounted(() => {
-    init();
+    props.immediateInitOnMounted && init();
   });
 
   onUnmounted(() => {
@@ -79,6 +95,7 @@
   });
 
   defineExpose({
+    customInit,
     reloadPlayer: init,
     getInstance: () => unref(videoPlayInstance),
   });

+export enum AlarmStatus {
+  CLEARED_UN_ACK = 'CLEARED_UNACK',
+  ACTIVE_UN_ACK = 'ACTIVE_UNACK',
+  CLEARED_ACK = 'CLEARED_ACK',
+  ACTIVE_ACK = 'ACTIVE_ACK',
+}
+
+export enum AlarmStatusMean {
+  CLEARED_UNACK = '清除未确认',
+  ACTIVE_UNACK = '激活未确认',
+  CLEARED_ACK = '清除已确认',
+  ACTIVE_ACK = '激活已确认',
+}

@@ -38,6 +38,15 @@ export const PLATFORM = 'PLATFORM';
 export const PLATFORM_INFO_CACHE_KEY = 'PLATFORM_INFO';
 
 export const MENU_LIST = 'MENU_LIST';
+
+export const RULE_NODE_LOCAL_CACHE_KEY = 'RULE__NODE__KEY__';
+
+export const RULE_CHAIN_IMPORT_LOCAL_CACHE_KEY = 'RULE__CHAIN__IMPORT__KEY__';
+
+export const RULE_NODE_KEY = 'RULE_NODE';
+
+export const RULE_CHAIN_KEY = 'RULE_CHAIN';
+
 export enum CacheTypeEnum {
   SESSION,
   LOCAL,

@@ -19,4 +19,8 @@ export enum DictEnum {
   DISABLE_CUSTOMER_AUTH = 'disabled_customer_auth',
   // 寄存器数据格式
   REGISTER_DATA_FORMAT = 'register_data_format',
+  // 消息类型 规则节点 Filter message type switch
+  MESSAGE_TYPES_FILTER = 'message_types_filter',
+  // 实体类型 规则节点 Filter originator types switch
+  ORIGINATOR_TYPES = 'originator_types',
 }

@@ -16,4 +16,8 @@ export const PageEnum = {
   DEVICE_LIST: '/device/list',
 
   SHARE_PAGE: '/share/:viewType/:id/:publicId',
+
+  RULE_CHAIN_DETAIL: '/rule/chain/:id',
+
+  RULE_CHAIN_DETAIL_IMPORT: '/rule/chain/import',
 };

+import { saveOrEditDictItem } from '/@/api/system/dict';
+import { SysDictItem } from '/@/api/system/model/dictModel';
+
+interface BatchSettingParamsType {
+  dictId: string;
+  list: any[];
+  transformText: (item: any) => any;
+  transformValue: (item: any) => any;
+  update?: boolean;
+}
+
+export function useBatchSettingDict() {
+  const batchSetting = async (options: BatchSettingParamsType) => {
+    const { dictId, list, transformText, transformValue, update = false } = options;
+    if (!transformText || !transformValue) return;
+    let index = 1;
+    for (const item of list) {
+      const params: Partial<SysDictItem> & { dictId: string } = {
+        dictId,
+        sort: index++,
+        status: 1,
+        itemText: transformText(item),
+        itemValue: transformValue(item),
+      };
+
+      await saveOrEditDictItem(params as SysDictItem, update);
+    }
+  };
+
+  const batchDelete = () => {};
+
+  return {
+    batchSetting,
+    batchDelete,
+  };
+}

+export function useBeautify() {
+  let jsBeautifyModule: any;
+
+  async function loadJsBeautify() {
+    if (jsBeautifyModule) return jsBeautifyModule;
+    jsBeautifyModule = await import('js-beautify/js/lib/beautifier');
+    return jsBeautifyModule;
+  }
+
+  async function beautifyJs(source: string, options?: any) {
+    const module = await loadJsBeautify();
+    return module.js(source, options);
+  }
+  return { beautifyJs };
+}

+import { isObject, isString } from '/@/utils/is';
+
+export function useJsonParse(value: any, defaultValue = {}) {
+  let flag = false;
+  try {
+    value = JSON.parse(value);
+    if (isObject(value) || (isString(value) && value.trim() === '')) flag = true;
+  } catch (error) {
+    value = defaultValue;
+  }
+  return { flag, value };
+}

@@ -2,7 +2,8 @@ import { RouteLocationNormalizedLoaded } from 'vue-router';
 
 const menuMap = new Map();
 
-menuMap.set('/visual/board/detail/:boardId/:boardName?', '/visual/board');
+menuMap.set('/visual/board/detail/:boardId/:boardName/:organizationId?', '/visual/board');
+menuMap.set('/rule/chain/:id', '/rule/chain');
 
 export const useMenuActiveFix = (route: RouteLocationNormalizedLoaded) => {
   let flag = false;

@@ -52,6 +52,7 @@ export function useBatchDelete(
       if (record) {
         await deleteFn([record.id]);
         createMessage.success('删除成功');
+        selectedRowIds.value = [];
       } else {
         await deleteFn(selectedRowIds.value);
         createMessage.success('批量删除成功');

@@ -16,6 +16,7 @@
           mode="multiple"
           v-model:value="model[field]"
           :options="alarmContactOptions.map((item) => ({ value: item.value, label: item.label }))"
+          @change="handleChange"
         >
           <template #dropdownRender="{ menuNode: menu }">
             <v-nodes :vnodes="menu" />
@@ -53,8 +54,14 @@
         return attrs.vnodes;
       },
     },
+    props: {
+      defaultEnable: {
+        type: Boolean,
+        default: false,
+      },
+    },
     emits: ['success', 'register'],
-    setup(_, { emit }) {
+    setup(props, { emit }) {
       const alarmContactOptions: any = ref([]);
       const orgId = ref('');
       const orgFunc = (e) => {
@@ -82,6 +89,7 @@
       const [registerAlarmContactDrawer, { openDrawer }] = useDrawer();
       async function handleSuccess() {
         //获取告警联系人
+        if (!unref(orgId)) return;
         const res = await byOrgIdGetAlarmContact(orgId.value);
         if (res) {
           alarmContactOptions.value = res.map((m) => {
@@ -91,6 +99,10 @@
           alarmContactOptions.value = [];
         }
       }
+
+      const handleChange = () => {
+        validateFields(['alarmContactId']);
+      };
       // 新增或编辑
       const handleOpenAlarmContact = () => {
         openDrawer(true, {
@@ -100,7 +112,10 @@
       const isUpdate = ref(true);
       let allData: any = reactive({});
       const editId = ref('');
-      const [registerForm, { validate, setFieldsValue, resetFields, updateSchema }] = useForm({
+      const [
+        registerForm,
+        { validate, setFieldsValue, resetFields, updateSchema, validateFields },
+      ] = useForm({
         labelWidth: 120,
         schemas: formSchema,
         showActionButtonGroup: false,
@@ -165,6 +180,9 @@
             ...alarmContactIdD,
             ...messageModeD,
           };
+
+          props.defaultEnable && Object.assign(allData, { status: 1 });
+
           if (!unref(isUpdate)) {
             delete allData.id;
           }
@@ -191,6 +209,7 @@
         handleOpenAlarmContact,
         registerAlarmContactDrawer,
         handleSuccess,
+        handleChange,
       };
     },
   });

@@ -37,7 +37,7 @@
           </a-button>
         </template>
         <template #status="{ record }">
-          <Authority value="api:yt:alarm:profile:status">
+          <Authority value="api:yt:alarm:profile:update">
             <Switch
               :checked="record.status === 1"
               :loading="record.pendingStatus"
@@ -47,7 +47,7 @@
             />
           </Authority>
           <Tag
-            v-if="!hasPermission('api:yt:alarm:profile:status')"
+            v-if="!hasPermission('api:yt:alarm:profile:update')"
             :color="record.status ? 'green' : 'red'"
           >
             {{ record.status ? '启用' : '禁用' }}

@@ -3,20 +3,7 @@ import { FormSchema } from '/@/components/Form';
 import { BasicColumn } from '/@/components/Table';
 import moment from 'moment';
 import { findDictItemByCode } from '/@/api/system/dict';
-
-export enum AlarmStatus {
-  CLEARED_UN_ACK = 'CLEARED_UNACK',
-  ACTIVE_UN_ACK = 'ACTIVE_UNACK',
-  CLEARED_ACK = 'CLEARED_ACK',
-  ACTIVE_ACK = 'ACTIVE_ACK',
-}
-
-export enum AlarmStatusMean {
-  CLEARED_UNACK = '清除未确认',
-  ACTIVE_UNACK = '激活未确认',
-  CLEARED_ACK = '清除已确认',
-  ACTIVE_ACK = '激活已确认',
-}
+import { AlarmStatus, AlarmStatusMean } from '/@/enums/alarmEnum';
 
 export const alarmSearchSchemas: FormSchema[] = [
   {
@@ -126,6 +113,10 @@ export const alarmColumns: BasicColumn[] = [
     title: '告警设备',
     dataIndex: 'deviceName',
     width: 100,
+    customRender: ({ record }) => {
+      const { deviceAlias, deviceName } = record || {};
+      return deviceAlias || deviceName;
+    },
   },
   {
     title: '告警场景',
@@ -139,6 +130,12 @@ export const alarmColumns: BasicColumn[] = [
     format: (text) => alarmLevel(text),
   },
   {
+    title: '告警详情',
+    dataIndex: 'details',
+    slots: { customRender: 'details' },
+    width: 160,
+  },
+  {
     title: '状态',
     dataIndex: 'status',
     format: (text) => statusType(text),

@@ -46,14 +46,16 @@
       const alarmStatus = ref('');
       const [registerDrawer, { closeDrawer }] = useDrawerInner(async (data) => {
         await resetFields();
+        const { deviceAlias, deviceName, severity, status, details, id } = data || {};
         await setFieldsValue({
           ...data,
-          severity: alarmLevel(data.severity),
-          status: statusType(data.status),
-          details: JSON.stringify(data.details),
+          deviceName: deviceAlias || deviceName,
+          severity: alarmLevel(severity),
+          status: statusType(status),
+          details: JSON.stringify(details),
         });
-        alarmStatus.value = data.status;
-        alarmId.value = data.id;
+        alarmStatus.value = status;
+        alarmId.value = id;
       });
       // 处理报警
       const handleAlarm = async () => {

-import { AlarmStatus, AlarmStatusMean } from '../config/detail.config';
 import { clearOrAckAlarm, getDeviceAlarm } from '/@/api/device/deviceManager';
 import { notification, Button, Tag } from 'ant-design-vue';
 import { h, onMounted, onUnmounted } from 'vue';
@@ -8,6 +7,7 @@ import { RoleEnum } from '/@/enums/roleEnum';
 import { usePermission } from '/@/hooks/web/usePermission';
 import { useUserStore } from '/@/store/modules/user';
 import { useGlobSetting } from '/@/hooks/setting';
+import { AlarmStatus, AlarmStatusMean } from '/@/enums/alarmEnum';
 
 interface UseAlarmNotifyParams {
   alarmNotifyStatus?: AlarmStatus;

@@ -13,47 +13,105 @@
           ]"
         />
       </template>
+      <template #details="{ record }">
+        <a-button type="link" class="ml-2" @click="handleViewAlarmDetails(record)">
+          查看告警详情
+        </a-button>
+      </template>
+      <template #toolbar>
+        <Tooltip>
+          <template #title>
+            <div>激活未确认: 可以处理，清除</div>
+            <div>激活已确认: 只可清除，已经处理</div>
+            <div>清除未确认: 只可处理，已经清除</div>
+            <div>清除已确认: 不需要做处理和清除</div>
+          </template>
+          <Button @click="handleBatchClear" type="primary" :disabled="getCanBatchClear">
+            <QuestionCircleOutlined class="cursor-pointer" />
+            <span>批量清除</span>
+          </Button>
+        </Tooltip>
+        <Tooltip>
+          <template #title>
+            <div>激活未确认: 可以处理，清除</div>
+            <div>激活已确认: 只可清除，已经处理</div>
+            <div>清除未确认: 只可处理，已经清除</div>
+            <div>清除已确认: 不需要做处理和清除</div>
+          </template>
+          <Button @click="handleBatchAck" type="primary" :disabled="getCanBatchAck">
+            <QuestionCircleOutlined class="cursor-pointer" />
+            <span>批量处理</span>
+          </Button>
+        </Tooltip>
+      </template>
     </BasicTable>
     <AlarmDetailDrawer @register="registerDetailDrawer" @success="handleSuccess" />
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
+  import { defineComponent, nextTick, h, computed } from 'vue';
   import { BasicTable, useTable, TableAction } from '/@/components/Table';
   import { alarmColumns, alarmSearchSchemas } from './config/detail.config';
-  import { getDeviceAlarm } from '/@/api/device/deviceManager';
+  import { doBatchAckAlarm, doBatchClearAlarm, getDeviceAlarm } from '/@/api/device/deviceManager';
   import { useDrawer } from '/@/components/Drawer';
   import AlarmDetailDrawer from './cpns/AlarmDetailDrawer.vue';
+  import { Modal, Button, Tooltip } from 'ant-design-vue';
+  import { JsonPreview } from '/@/components/CodeEditor';
+  import { getDeviceDetail } from '/@/api/device/deviceManager';
+  import { getAttribute } from '/@/api/ruleengine/ruleengineApi';
+  import {
+    operationNumber_OR_TIME,
+    operationString,
+    operationBoolean,
+  } from '/@/views/rule/linkedge/config/formatData';
+  import { AlarmLogItem } from '/@/api/device/model/deviceConfigModel';
+  import { AlarmStatus } from '/@/enums/alarmEnum';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { QuestionCircleOutlined } from '@ant-design/icons-vue';
 
   export default defineComponent({
     name: 'AlarmCenter',
     components: {
+      Button,
       BasicTable,
       TableAction,
       AlarmDetailDrawer,
+      QuestionCircleOutlined,
+      Tooltip,
     },
 
     setup() {
-      const [registerTable, { reload }] = useTable({
-        title: '告警记录列表',
-        api: getDeviceAlarm,
-        columns: alarmColumns,
-        useSearchForm: true,
-        formConfig: {
-          labelWidth: 120,
-          schemas: alarmSearchSchemas,
-          fieldMapToTime: [['alarmTime', ['startTime', 'endTime'], 'x']],
-        },
-        bordered: true,
-        showIndexColumn: false,
-        showTableSetting: true,
-        actionColumn: {
-          width: 200,
-          title: '操作',
-          slots: { customRender: 'action' },
-          fixed: 'right',
-        },
-      });
+      const [registerTable, { reload, getSelectRows, clearSelectedRowKeys, getRowSelection }] =
+        useTable({
+          title: '告警记录列表',
+          api: getDeviceAlarm,
+          columns: alarmColumns,
+          rowKey: 'id',
+          useSearchForm: true,
+          formConfig: {
+            labelWidth: 120,
+            schemas: alarmSearchSchemas,
+            fieldMapToTime: [['alarmTime', ['startTime', 'endTime'], 'x']],
+          },
+          bordered: true,
+          showIndexColumn: false,
+          showTableSetting: true,
+          clickToRowSelect: false,
+          rowSelection: {
+            type: 'checkbox',
+            getCheckboxProps: (record: AlarmLogItem) => {
+              return {
+                disabled: record.status === AlarmStatus.CLEARED_ACK,
+              };
+            },
+          },
+          actionColumn: {
+            width: 200,
+            title: '操作',
+            slots: { customRender: 'action' },
+            fixed: 'right',
+          },
+        });
       const [registerDetailDrawer, { openDrawer }] = useDrawer();
       const handleDetail = (record: Recordable) => {
         openDrawer(true, record);
@@ -61,11 +119,137 @@
       const handleSuccess = () => {
         reload();
       };
+      const handleViewAlarmDetails = async (record: Recordable) => {
+        await nextTick();
+        const { details } = record;
+        const deviceIdKeys = Object.keys(details);
+        const detailObject = deviceIdKeys.map((key) => ({ label: key, value: details[key] }));
+        const dataFormat = await handleAlarmDetailFormat(deviceIdKeys);
+        const dataFormats = detailObject.reduce((acc: any, curr: any) => {
+          dataFormat.forEach((item) => {
+            if (item.tbDeviceId === curr.label) {
+              const findName = item.attribute.find(
+                (item) => item.identifier === curr.value.key
+              )?.name;
+              const findLogin = [
+                ...operationNumber_OR_TIME,
+                ...operationString,
+                ...operationBoolean,
+              ].find((item) => item.value === curr.value.logic)?.symbol;
+              const findAttribute = item.attribute.find(
+                (findItem) => findItem.identifier === curr.value.key
+              );
+              const value = {
+                ['触发属性']: findName,
+                ['触发条件']: `${findLogin}${curr.value.logicValue}`,
+                ['触发值']: `${curr.value.realValue}${
+                  findAttribute.detail?.dataType?.specs?.unit?.key ?? ''
+                }`,
+              };
+              const data = {
+                [item.name]: value,
+              };
+              acc.push(data);
+            }
+          });
+          return [...acc];
+        }, []);
+        const objectFormat = dataFormats.reduce((acc: any, curr: any) => {
+          return {
+            ...acc,
+            ...curr,
+          };
+        }, {});
+        Modal.info({
+          title: '告警详情',
+          width: 600,
+          centered: true,
+          maskClosable: true,
+          content: h(JsonPreview, { data: JSON.parse(JSON.stringify(objectFormat)) }),
+        });
+      };
+      const handleAlarmDetailFormat = async (keys: string[]) => {
+        const temp: any = [];
+        for (let item of keys) {
+          if (item === 'key' || item === 'data') return []; //旧数据则终止
+          const deviceDetailRes = await getDeviceDetail(item);
+          const { deviceProfileId } = deviceDetailRes;
+          if (!deviceProfileId) return [];
+          const attributeRes = await getAttribute(deviceProfileId);
+          const dataFormat: any = handleDataFormat(deviceDetailRes, attributeRes);
+          temp.push(dataFormat);
+        }
+        return temp;
+      };
+      const handleDataFormat = (deviceDetail: any, attributes: any) => {
+        const { name, tbDeviceId, alias } = deviceDetail;
+        const attribute = attributes.map((item) => ({
+          identifier: item.identifier,
+          name: item.name,
+          detail: item.detail,
+        }));
+        return {
+          name: alias || name,
+          tbDeviceId,
+          attribute,
+        };
+      };
+
+      const getCanBatchClear = computed(() => {
+        const rowSelection = getRowSelection();
+        const getRows: AlarmLogItem[] = getSelectRows();
+
+        return (
+          !rowSelection.selectedRowKeys?.length ||
+          getRows.some(
+            (item) =>
+              item.status === AlarmStatus.CLEARED_ACK || item.status === AlarmStatus.CLEARED_UN_ACK
+          )
+        );
+      });
+
+      const getCanBatchAck = computed(() => {
+        const rowSelection = getRowSelection();
+        const getRows: AlarmLogItem[] = getSelectRows();
+
+        return (
+          !rowSelection.selectedRowKeys?.length ||
+          getRows.some(
+            (item) =>
+              item.status === AlarmStatus.CLEARED_ACK || item.status === AlarmStatus.ACTIVE_ACK
+          )
+        );
+      });
+
+      const { createMessage } = useMessage();
+      const handleBatchAck = async () => {
+        const ids = getSelectRows<AlarmLogItem>().map((item) => item.id);
+        if (!ids.length) return;
+        await doBatchAckAlarm(ids);
+        createMessage.success('操作成功');
+        clearSelectedRowKeys();
+        reload();
+      };
+
+      const handleBatchClear = async () => {
+        const ids = getSelectRows<AlarmLogItem>().map((item) => item.id);
+        if (!ids.length) return;
+        await doBatchClearAlarm(ids);
+        createMessage.success('操作成功');
+        clearSelectedRowKeys();
+        reload();
+      };
+
       return {
         registerTable,
         registerDetailDrawer,
         handleDetail,
         handleSuccess,
+        handleViewAlarmDetails,
+        handleBatchAck,
+        handleBatchClear,
+        getCanBatchAck,
+        getCanBatchClear,
       };
     },
   });

@@ -8,23 +8,6 @@
     @ok="handleSubmit"
   >
     <BasicForm @register="registerForm">
-      <template #iconSelect>
-        <Upload
-          name="avatar"
-          list-type="picture-card"
-          class="avatar-uploader"
-          :show-upload-list="false"
-          :customRequest="customUpload"
-          :before-upload="beforeUpload"
-        >
-          <img v-if="tenantLogo" :src="tenantLogo" alt="avatar" />
-          <div v-else>
-            <LoadingOutlined v-if="loading" />
-            <plus-outlined v-else />
-            <div class="ant-upload-text">上传</div>
-          </div>
-        </Upload>
-      </template>
       <template #videoPlatformIdSlot="{ model, field }">
         <a-select
           placeholder="请选择流媒体配置"
@@ -51,23 +34,20 @@
   import { formSchema } from './config.data';
   import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
   import { createOrEditCameraManage } from '/@/api/camera/cameraManager';
-  import { message, Upload } from 'ant-design-vue';
   import { useMessage } from '/@/hooks/web/useMessage';
-  import { PlusOutlined, LoadingOutlined } from '@ant-design/icons-vue';
-  import { upload } from '/@/api/oss/ossFileUploader';
-  import { FileItem } from '/@/components/Upload/src/typing';
+  import { PlusOutlined } from '@ant-design/icons-vue';
   import { getStreamingMediaList } from '/@/api/camera/cameraManager';
   import SteramingDrawer from '../streaming/SteramingDrawer.vue';
   import { useDrawer } from '/@/components/Drawer';
+  import { FileItem } from '/@/components/Form/src/components/ApiUpload.vue';
+  import { buildUUID } from '/@/utils/uuid';
 
   export default defineComponent({
     name: 'ContactDrawer',
     components: {
       BasicDrawer,
       BasicForm,
-      Upload,
       PlusOutlined,
-      LoadingOutlined,
       SteramingDrawer,
       VNodes: (_, { attrs }) => {
         return attrs.vnodes;
@@ -117,42 +97,19 @@
         if (unref(isUpdate)) {
           await nextTick();
           editId.value = data.record.id;
-          tenantLogo.value = data.record?.avatar;
-          await setFieldsValue(data.record);
+          if (data.record.avatar) {
+            setFieldsValue({
+              avatar: [{ uid: buildUUID(), name: 'name', url: data.record.avatar } as FileItem],
+            });
+          }
+          const { avatar, ...params } = data.record;
+          console.log(avatar);
+          await setFieldsValue({ ...params });
         } else {
-          tenantLogo.value = '';
           editId.value = '';
         }
       });
 
-      const tenantLogo = ref('');
-
-      async function customUpload({ file }) {
-        if (beforeUpload(file)) {
-          tenantLogo.value = '';
-          loading.value = true;
-          const formData = new FormData();
-          formData.append('file', file);
-          const response = await upload(formData);
-          if (response.fileStaticUri) {
-            tenantLogo.value = response.fileStaticUri;
-            loading.value = false;
-          }
-        }
-      }
-
-      const beforeUpload = (file: FileItem) => {
-        const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
-        if (!isJpgOrPng) {
-          message.error('只能上传图片文件!');
-        }
-        const isLt2M = (file.size as number) / 1024 / 1024 < 5;
-        if (!isLt2M) {
-          message.error('图片大小不能超过5MB!');
-        }
-        return isJpgOrPng && isLt2M;
-      };
-
       const getTitle = computed(() => (!unref(isUpdate) ? '新增视频配置' : '编辑视频配置'));
 
       async function handleSubmit() {
@@ -161,8 +118,9 @@
           const { createMessage } = useMessage();
           const values = await validate();
           if (!values) return;
-          if (tenantLogo.value !== '') {
-            values.avatar = tenantLogo.value;
+          if (Reflect.has(values, 'avatar')) {
+            const file = (values.avatar || []).at(0) || {};
+            values.avatar = file.url || null;
           }
           if (editId.value !== '') {
             values.id = editId.value;
@@ -187,9 +145,6 @@
         registerDrawer,
         registerForm,
         handleSubmit,
-        customUpload,
-        beforeUpload,
-        tenantLogo,
         loading,
         streamConfigOptions,
         registerSteramingDrawer,

@@ -120,7 +120,7 @@
       const { organizationIdTreeRef, resetFn } = useResetOrganizationTree(searchInfo);
       const [registerModal, { openModal }] = useModal();
       // 表格hooks
-      const [registerTable, { reload, setProps }] = useTable({
+      const [registerTable, { reload, setProps, clearSelectedRowKeys }] = useTable({
         title: '视频列表',
         api: cameraPage,
         columns,
@@ -149,6 +149,7 @@
       // 刷新
       const handleSuccess = () => {
         reload();
+        clearSelectedRowKeys();
       };
       const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions } = useBatchDelete(
         deleteCameraManage,

@@ -20,6 +20,12 @@
   import { useFingerprint } from '/@/utils/useFingerprint';
   import { GetResult } from '@fingerprintjs/fingerprintjs';
 
+  const props = defineProps({
+    mode: {
+      type: String,
+      default: PageMode.SPLIT_SCREEN_MODE,
+    },
+  });
   type CameraRecordItem = CameraRecord & {
     canPlay?: boolean;
     isTransform?: boolean;
@@ -252,7 +258,11 @@
               </Authority>
             </div>
             <Space>
-              <Button type="primary" @click="handleChangeMode(PageMode.SPLIT_SCREEN_MODE)">
+              <Button
+                v-if="props.mode !== PageMode.SPLIT_SCREEN_MODE"
+                type="primary"
+                @click="handleChangeMode(PageMode.SPLIT_SCREEN_MODE)"
+              >
                 分屏模式
               </Button>
               <Button type="primary" @click="handleChangeMode(PageMode.LIST_MODE)">

@@ -7,6 +7,9 @@ import SnHelpMessage from './SnHelpMessage.vue';
 import { DeviceTypeEnum } from '/@/api/device/model/deviceModel';
 import { OrgTreeSelect } from '../../common/OrgTreeSelect';
 import { findDictItemByCode } from '/@/api/system/dict';
+import { FileItem } from '/@/components/Form/src/components/ApiUpload.vue';
+import { createImgPreview } from '/@/components/Preview';
+import { uploadThumbnail } from '/@/api/configuration/center/configurationCenter';
 
 useComponentRegister('OrgTreeSelect', OrgTreeSelect);
 
@@ -114,8 +117,33 @@ export const formSchema: QFormSchema[] = [
   {
     field: 'avatar',
     label: '视频封面',
-    slot: 'iconSelect',
-    component: 'Input',
+    component: 'ApiUpload',
+    changeEvent: 'update:fileList',
+    valueField: 'fileList',
+    componentProps: () => {
+      return {
+        listType: 'picture-card',
+        maxFileLimit: 1,
+        accept: '.png,.jpg,.jpeg,.gif',
+        api: async (file: File) => {
+          try {
+            const formData = new FormData();
+            formData.set('file', file);
+            const { fileStaticUri, fileName } = await uploadThumbnail(formData);
+            return {
+              uid: fileStaticUri,
+              name: fileName,
+              url: fileStaticUri,
+            } as FileItem;
+          } catch (error) {
+            return {};
+          }
+        },
+        onPreview: (fileList: FileItem) => {
+          createImgPreview({ imageList: [fileList.url!] });
+        },
+      };
+    },
   },
   {
     field: 'name',

@@ -12,7 +12,11 @@
 
 <template>
   <div>
-    <SplitScreenMode v-if="mode == PageMode.SPLIT_SCREEN_MODE" @switchMode="handleSwitchMode" />
+    <SplitScreenMode
+      :mode="mode"
+      v-if="mode == PageMode.SPLIT_SCREEN_MODE"
+      @switchMode="handleSwitchMode"
+    />
     <ListMode v-if="mode === PageMode.LIST_MODE" @switchMode="handleSwitchMode" />
   </div>
 </template>

@@ -56,7 +56,10 @@
           return unref(orgList);
         }
       },
-      params: { ...params, _t: unref(timespan) },
+      params: {
+        ...params,
+        _t: unref(timespan),
+      },
       onChange: (...args: any[]) => {
         emit('change', ...args);
       },

@@ -93,6 +93,7 @@ export const formSchema: FormSchema[] = [
       return {
         listType: 'picture-card',
         maxFileLimit: 1,
+        accept: '.png,.jpg,.jpeg,.gif',
         api: async (file: File) => {
           try {
             const formData = new FormData();
@@ -110,6 +111,10 @@ export const formSchema: FormSchema[] = [
         onPreview: (fileList: FileItem) => {
           createImgPreview({ imageList: [fileList.url!] });
         },
+        // showUploadList: {
+        //   showDownloadIcon: true,
+        //   showRemoveIcon: true,
+        // },
       };
     },
   },

@@ -11,7 +11,7 @@
   import { ConfigurationCenterItemsModal } from '/@/api/configuration/center/model/configurationCenterModal';
   import { PageWrapper } from '/@/components/Page';
   import { BasicForm, useForm } from '/@/components/Form';
-  import { ConfigurationPermission, searchFormSchema } from './center.data';
+  import { ConfigurationPermission, Platform, searchFormSchema } from './center.data';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { Authority } from '/@/components/Authority';
   import { isDevMode } from '/@/utils/env';
@@ -30,6 +30,7 @@
   import { ViewType } from '../../visual/board/config/panelDetail';
   import { useRole } from '/@/hooks/business/useRole';
   import { useClipboard } from '@vueuse/core';
+  import { Icon } from '/@/components/Icon';
 
   const listColumn = ref(5);
 
@@ -135,13 +136,19 @@
   const handlePreview = (record: ConfigurationCenterItemsModal) => {
     if (!unref(getPreviewFlag)) return;
     window.open(
-      `${configurationPrefix}/${isDev ? '?dev=1&' : '?'}configurationId=${record!.id}&lightbox=1`
+      `${configurationPrefix}/${isDev ? '?dev=1&' : '?'}configurationId=${
+        record!.id
+      }&lightbox=1&organizationId=${record.organizationId}`
     );
   };
 
   const handleDesign = (record: ConfigurationCenterItemsModal) => {
     if (!unref(getDesignFlag)) return;
-    window.open(`${configurationPrefix}/${isDev ? '?dev=1&' : '?'}configurationId=${record!.id}`);
+    window.open(
+      `${configurationPrefix}/${isDev ? '?dev=1&' : '?'}configurationId=${
+        record!.id
+      }&organizationId=${record.organizationId}`
+    );
   };
 
   const handleDelete = async (record: ConfigurationCenterItemsModal) => {
@@ -164,6 +171,7 @@
     searchParams.set('configurationId', record.id);
     searchParams.set('publicId', record.publicId || '');
     searchParams.set('lightbox', '1');
+    searchParams.set('organizationId', record!.organizationId || '');
     return `${origin}${configurationPrefix}/?${searchParams.toString()}`;
   };
 
@@ -187,7 +195,7 @@
 
   onMounted(() => {
     const clientHeight = document.documentElement.clientHeight;
-    const rect = getBoundingClientRect(unref(listEl)!.$el!) as DOMRect;
+    const rect = getBoundingClientRect(unref(listEl)!.$el! as HTMLElement) as DOMRect;
     // margin-top 24 height 24
     const paginationHeight = 24 + 24 + 8;
     // list pading top 8 maring-top 8 extra slot 56
@@ -322,7 +330,16 @@
                 </template>
                 <template #description>
                   <div class="truncate h-11">
-                    <div class="truncate">{{ item.organizationDTO.name }}</div>
+                    <div class="truncate flex justify-between items-center">
+                      <div>{{ item.organizationDTO.name }}</div>
+                      <Icon
+                        :icon="
+                          item.platform === Platform.PC
+                            ? 'ri:computer-line'
+                            : 'clarity:mobile-phone-solid'
+                        "
+                      />
+                    </div>
                     <div class="truncate">{{ item.remark || '' }} </div>
                   </div>
                 </template>

@@ -22,7 +22,7 @@
   watch(
     () => props.customerList,
     (newValue) => {
-      const transferResult = newValue.map((item) => [item.ts, item.value]);
+      const transferResult = newValue.map((item) => [item.date, item.value]);
 
       setOptions({
         tooltip: {
@@ -35,7 +35,7 @@
           },
         },
         xAxis: {
-          type: 'time',
+          type: 'category',
           splitLine: {
             show: true,
             lineStyle: {
@@ -90,7 +90,7 @@
       trend: props.type,
     });
 
-    const transferResult = res.map((item) => [item.ts, item.value]);
+    const transferResult = res.map((item) => [item.date, item.value]);
     setOptions({
       tooltip: {
         trigger: 'axis',

@@ -2,9 +2,10 @@
   <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts" setup>
-  import { ref, Ref, withDefaults, onMounted, watch } from 'vue';
+  import { ref, Ref, onMounted, watch } from 'vue';
   import { useECharts } from '/@/hooks/web/useECharts';
   import { getTrendData } from '/@/api/dashboard';
+  import { getDateByShortcutQueryKey, ShortcutQueryKeyEnum } from '../hooks/useDate';
 
   interface Props {
     width?: string;
@@ -30,7 +31,7 @@
           },
         },
         xAxis: {
-          type: 'time',
+          type: 'category',
           splitLine: {
             show: true,
             lineStyle: {
@@ -77,15 +78,12 @@
   const chartRef = ref<HTMLDivElement | null>(null);
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
   onMounted(async () => {
-    const endTs = Date.now();
     const res = await getTrendData({
-      startTs: endTs - 2592000000,
-      endTs,
-      interval: 86400000,
+      ...getDateByShortcutQueryKey(ShortcutQueryKeyEnum.LATEST_1_MONTH),
       trend: 'CUSTOMER_TREND',
     });
 
-    const transferResult = res.map((item) => [item.ts, item.value]);
+    const transferResult = res.map((item) => [item.date, item.value]);
     setOptions({
       tooltip: {
         trigger: 'axis',
@@ -97,7 +95,7 @@
         },
       },
       xAxis: {
-        type: 'time',
+        type: 'category',
         splitLine: {
           show: true,
           lineStyle: {

@@ -19,7 +19,8 @@
             <div>1小时: 查询最近1小时的数据,间隔时间为5分钟.</div>
             <div>
               间隔时间:
-              以当前时间作为结束时间,往前推移对应天数或小时的时间作为开始时间,然后在此时间区间内进行分组聚合查询.
+              <span class="font-bold underline">以当前时间作为结束时间</span>
+              ,往前推移对应天数或小时的时间作为开始时间,然后在此时间区间内进行分组聚合查询.
             </div>
           </template>
           <QuestionCircleOutlined class="!mr-1" />
@@ -36,7 +37,15 @@
         <DatePicker
           @change="(_, DateString) => onDateChange(_, DateString, role === RoleEnum.CUSTOMER_USER)"
           v-model:value="dateValue"
-        />
+        >
+          <Button
+            type="link"
+            class="!px-0"
+            :style="dateValue ? { color: '#0960bd', fontWeight: 500 } : { color: '#000000d9' }"
+          >
+            {{ dateValue ? (dateValue as moment.Moment).format('YYYY-MM-DD') : '自定义' }}
+          </Button>
+        </DatePicker>
       </div>
     </template>
     <div v-if="activeKey === '1'">
@@ -95,6 +104,21 @@
     >
       <template #extra>
         <div class="extra-date">
+          <Tooltip :overlayStyle="{ maxWidth: '340px' }">
+            <template #title>
+              <section>
+                <div>最近一个月: 查询最近一个月的数据,间隔时间为1天.</div>
+                <div>最近三个月: 查询最近三个月的数据,间隔时间为1天.</div>
+                <div>最近一年: 查询最近一年的数据,间隔时间为1月.</div>
+                <div>
+                  间隔时间:
+                  <span class="font-bold underline"> 以当天的(最后时间)作为结束时间 </span>
+                  ,往前推移对应天数或月的时间作为开始时间,然后在此时间区间内进行分组聚合查询.
+                </div>
+              </section>
+            </template>
+            <QuestionCircleOutlined class="!mr-2 cursor-pointer" />
+          </Tooltip>
           <template v-for="(item, index) in TenantOrCustomerDateList" :key="item.value">
             <span
               @click="quickQueryTenantOrCustomerTime(index, item.value)"
@@ -104,9 +128,31 @@
           </template>
           <DatePicker.RangePicker
             @change="onDateCustomerChange"
+            :disabledDate="handleDisableDate"
+            @calendarChange="handleCalendarChange"
             size="small"
             v-model:value="customerDateValue"
-          />
+            :showTime="{
+              defaultValue: [dateUtil('00:00:00', 'HH:mm:ss'), dateUtil('23:59:59', 'HH:mm:ss')],
+            }"
+          >
+            <Button
+              type="link"
+              class="!px-0"
+              :style="
+                customerDateValue && customerDateValue.length
+                  ? { color: '#0960bd', fontWeight: 500 }
+                  : { color: '#000000d9' }
+              "
+              >{{
+                customerDateValue && customerDateValue.length
+                  ? `${(customerDateValue?.[0] as moment.Moment)?.format('YYYY-MM-DD')}
+                ~
+                ${(customerDateValue?.[1] as moment.Moment)?.format('YYYY-MM-DD')}`
+                  : '自定义'
+              }}</Button
+            >
+          </DatePicker.RangePicker>
         </div>
       </template>
       <CustomerTrend :customerTrendList="customerTrendList" />
@@ -114,15 +160,15 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { ref, reactive } from 'vue';
-  import { Card, DatePicker, Tooltip } from 'ant-design-vue';
+  import { ref, reactive, unref } from 'vue';
+  import { Card, DatePicker, Tooltip, Button } from 'ant-design-vue';
   import VisitAnalysis from './VisitAnalysis.vue';
   import VisitAnalysisBar from './VisitAnalysisBar.vue';
   import { RoleEnum, isAdmin } from '/@/enums/roleEnum';
   import { useWebSocket } from '@vueuse/core';
   import { getAuthCache } from '/@/utils/auth';
   import { JWT_TOKEN_KEY } from '/@/enums/cacheEnum';
-  import { formatToDateTime } from '/@/utils/dateUtil';
+  import { dateUtil, formatToDateTime } from '/@/utils/dateUtil';
   import CustomerTrend from './CustomerTrend.vue';
   // import TenantTrend from './TenantTrend.vue';
   import CustomerAlarmMessage from './CustomerAlarmMessage.vue';
@@ -130,6 +176,7 @@
   import { getTrendData } from '/@/api/dashboard';
   import { useGlobSetting } from '/@/hooks/setting';
   import { QuestionCircleOutlined } from '@ant-design/icons-vue';
+  import { RangePickerValue } from 'ant-design-vue/lib/date-picker/interface';
 
   defineExpose({
     isAdmin,
@@ -480,6 +527,19 @@
     // onDateTenantChange,
     onDateCustomerChange,
   } = useDate();
+
+  const handleCalendarChange = (val: RangePickerValue) => {
+    customerDateValue.value = val as any;
+  };
+
+  const handleDisableDate = (current: moment.Moment) => {
+    if (!current) return true;
+    if (!unref(customerDateValue) || unref(customerDateValue).length === 0) {
+      return false;
+    }
+    const diffDate = current.diff(unref(customerDateValue)[0], 'days');
+    return Math.abs(diffDate) > 30;
+  };
 </script>
 
 <style lang="less">

@@ -29,7 +29,8 @@
             <div>1小时: 查询最近1小时的数据,间隔时间为5分钟.</div>
             <div>
               间隔时间:
-              以当前时间作为结束时间,往前推移对应天数或小时的时间作为开始时间,然后在此时间区间内进行分组聚合查询.
+              <span class="font-bold underline">以当前时间作为结束时间</span>
+              ,往前推移对应天数或小时的时间作为开始时间,然后在此时间区间内进行分组聚合查询.
             </div>
           </template>
           <QuestionCircleOutlined class="!mr-1" />
@@ -46,7 +47,15 @@
         <DatePicker
           @change="(_, DateString) => onDateChange(_, DateString, role === RoleEnum.CUSTOMER_USER)"
           v-model:value="dateValue"
-        />
+        >
+          <Button
+            type="link"
+            class="!px-0"
+            :style="dateValue ? { color: '#0960bd', fontWeight: 500 } : { color: '#000000d9' }"
+          >
+            {{ dateValue ? (dateValue as moment.Moment).format('YYYY-MM-DD') : '自定义' }}
+          </Button>
+        </DatePicker>
       </div>
     </template>
     <!-- <div v-if="activeKey === '1'">
@@ -80,6 +89,21 @@
     >
       <template #extra>
         <div class="extra-date">
+          <Tooltip :overlayStyle="{ maxWidth: '340px' }">
+            <template #title>
+              <section>
+                <div>最近一个月: 查询最近一个月的数据,间隔时间为1天.</div>
+                <div>最近三个月: 查询最近三个月的数据,间隔时间为1天.</div>
+                <div>最近一年: 查询最近一年的数据,间隔时间为1月.</div>
+                <div>
+                  间隔时间:
+                  <span class="font-bold underline"> 以当天的(最后时间)作为结束时间 </span>
+                  ,往前推移对应天数或月的时间作为开始时间,然后在此时间区间内进行分组聚合查询.
+                </div>
+              </section>
+            </template>
+            <QuestionCircleOutlined class="!mr-2 cursor-pointer" />
+          </Tooltip>
           <template v-for="(item, index) in TenantOrCustomerDateList" :key="item.value">
             <span
               @click="quickQueryTenantOrCustomerTime(index, item.value, 'tenant')"
@@ -90,8 +114,30 @@
           <DatePicker.RangePicker
             @change="onDateTenantChange"
             size="small"
+            @calendarChange="handleCalendarChange"
+            :disabledDate="handleDisableDate"
             v-model:value="tenantDateValue"
-          />
+            :showTime="{
+              defaultValue: [dateUtil('00:00:00', 'HH:mm:ss'), dateUtil('23:59:59', 'HH:mm:ss')],
+            }"
+          >
+            <Button
+              type="link"
+              class="!px-0"
+              :style="
+                tenantDateValue && tenantDateValue.length
+                  ? { color: '#0960bd', fontWeight: 500 }
+                  : { color: '#000000d9' }
+              "
+              >{{
+                tenantDateValue && tenantDateValue.length
+                  ? `${(tenantDateValue?.[0] as moment.Moment)?.format('YYYY-MM-DD')}
+                ~
+                ${(tenantDateValue?.[1] as moment.Moment)?.format('YYYY-MM-DD')}`
+                  : '自定义'
+              }}</Button
+            >
+          </DatePicker.RangePicker>
         </div>
       </template>
       <TenantTrend :tenantTrendList="tenantTrendList" />
@@ -123,8 +169,8 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { ref, reactive } from 'vue';
-  import { Card, DatePicker, Tooltip } from 'ant-design-vue';
+  import { ref, reactive, unref } from 'vue';
+  import { Card, DatePicker, Tooltip, Button } from 'ant-design-vue';
   import { QuestionCircleOutlined } from '@ant-design/icons-vue';
   // import VisitAnalysis from './VisitAnalysis.vue';
   import VisitAnalysisBar from './VisitAnalysisBar.vue';
@@ -132,13 +178,14 @@
   import { useWebSocket } from '@vueuse/core';
   import { getAuthCache } from '/@/utils/auth';
   import { JWT_TOKEN_KEY } from '/@/enums/cacheEnum';
-  import { formatToDateTime } from '/@/utils/dateUtil';
+  import { dateUtil, formatToDateTime } from '/@/utils/dateUtil';
   // import CustomerTrend from './CustomerTrend.vue';
   import TenantTrend from './TenantTrend.vue';
   import CustomerAlarmMessage from './CustomerAlarmMessage.vue';
   import { useDate } from '../hooks/useDate';
   import { getTrendData } from '/@/api/dashboard';
   import { useGlobSetting } from '/@/hooks/setting';
+  import { RangePickerValue } from 'ant-design-vue/lib/date-picker/interface';
 
   defineExpose({
     isAdmin,
@@ -445,7 +492,7 @@
     if (activeIndex.value === index) return;
     activeIndex.value = index;
     dateValue.value = '';
-    console.log(interval);
+
     if (isCustomer) {
       if (activeKey.value === '1') {
         const data = await getTrendData({
@@ -498,6 +545,19 @@
     onDateTenantChange,
     // onDateCustomerChange,
   } = useDate();
+
+  const handleCalendarChange = (val: RangePickerValue) => {
+    tenantDateValue.value = val as any;
+  };
+
+  const handleDisableDate = (current: moment.Moment) => {
+    if (!current) return true;
+    if (!unref(tenantDateValue) || unref(tenantDateValue).length === 0) {
+      return false;
+    }
+    const diffDate = current.diff(unref(tenantDateValue)[0], 'days');
+    return Math.abs(diffDate) > 30;
+  };
 </script>
 
 <style lang="less">

@@ -2,9 +2,10 @@
   <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts" setup>
-  import { ref, Ref, withDefaults, onMounted, watch } from 'vue';
+  import { ref, Ref, onMounted, watch } from 'vue';
   import { useECharts } from '/@/hooks/web/useECharts';
   import { getTrendData } from '/@/api/dashboard/index';
+  import { getDateByShortcutQueryKey, ShortcutQueryKeyEnum } from '../hooks/useDate';
   interface Props {
     width?: string;
     height?: string;
@@ -30,7 +31,7 @@
           },
         },
         xAxis: {
-          type: 'time',
+          type: 'category',
           splitLine: {
             show: true,
             lineStyle: {
@@ -77,14 +78,11 @@
   const chartRef = ref<HTMLDivElement | null>(null);
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
   onMounted(async () => {
-    const endTs = Date.now();
     const res = await getTrendData({
-      startTs: endTs - 2592000000,
-      endTs,
-      interval: 86400000,
+      ...getDateByShortcutQueryKey(ShortcutQueryKeyEnum.LATEST_1_MONTH),
       trend: 'TENANT_TREND',
     });
-    const transferResult = res.map((item) => [item.ts, item.value]);
+    const transferResult = res.map((item) => [item.date, item.value]);
     setOptions({
       tooltip: {
         trigger: 'axis',
@@ -96,7 +94,7 @@
         },
       },
       xAxis: {
-        type: 'time',
+        type: 'category',
         splitLine: {
           show: true,
           lineStyle: {

-import { formatToDateTime } from '/@/utils/dateUtil';
-import { ref } from 'vue';
+import { dateUtil } from '/@/utils/dateUtil';
+import { Ref, ref } from 'vue';
 import { getTrendData } from '/@/api/dashboard';
+import { RangePickerValue } from 'ant-design-vue/lib/date-picker/interface';
+import moment from 'moment';
+
+export enum ShortcutQueryKeyEnum {
+  LATEST_1_MONTH = 'LATEST_1_MONTH',
+  LATEST_3_MONTH = 'LATEST_3_MONTH',
+  LATEST_1_YEAR = 'LATEST_1_YEAR',
+}
+
+export function getDateByShortcutQueryKey(value: ShortcutQueryKeyEnum) {
+  const mapping = {
+    [ShortcutQueryKeyEnum.LATEST_1_MONTH]: () => {
+      return {
+        startTs: dateUtil().subtract(1, 'month').startOf('day').valueOf(),
+        interval: 24 * 60 * 60 * 1000,
+      };
+    },
+    [ShortcutQueryKeyEnum.LATEST_3_MONTH]: () => {
+      return {
+        startTs: dateUtil().subtract(3, 'month').startOf('day').valueOf(),
+        interval: 24 * 60 * 60 * 1000,
+      };
+    },
+    [ShortcutQueryKeyEnum.LATEST_1_YEAR]: () => {
+      return {
+        startTs: dateUtil().subtract(1, 'year').startOf('day').valueOf(),
+        interval: 30 * 24 * 60 * 60 * 1000,
+      };
+    },
+  };
+
+  const result = mapping?.[value]?.();
+
+  return {
+    ...result,
+    endTs: dateUtil().add(1, 'day').startOf('day').valueOf(),
+  };
+}
 
 export function useDate() {
   const tenantDateValue = ref([]);
-  const customerDateValue = ref([]);
-  const tenantTrendList = ref([]);
-  const customerTrendList = ref([]);
+  const customerDateValue = ref<RangePickerValue>([]);
+  const tenantTrendList = ref<[string, string][]>([]);
+  const customerTrendList = ref<[string, string][]>([]);
   const activeTenantIndex = ref(0);
   const activeCustomerIndex = ref(0);
   const TenantOrCustomerDateList = ref([
-    { label: '30天', value: 2592000000 },
-    { label: '最近三个月', value: 7776000000 },
-    { label: '最近一年', value: 31536000000 },
+    { label: '最近一个月', value: ShortcutQueryKeyEnum.LATEST_1_MONTH },
+    { label: '最近三个月', value: ShortcutQueryKeyEnum.LATEST_3_MONTH },
+    { label: '最近一年', value: ShortcutQueryKeyEnum.LATEST_1_YEAR },
   ]);
 
   // 租户趋势和客户趋势快速选择时间
   async function quickQueryTenantOrCustomerTime(
     index: number,
-    value: number,
+    value: ShortcutQueryKeyEnum,
     flag: 'tenant' | 'customer'
   ) {
-    const endTs = Date.now();
     if (flag === 'tenant') {
       if (activeTenantIndex.value === index) return;
       activeTenantIndex.value = index;
       tenantDateValue.value = [];
       const res = await getTrendData({
-        startTs: endTs - value,
-        endTs,
-        interval: value === 2592000000 ? 86400000 : value === 7776000000 ? 172800000 : 2592000000,
+        ...getDateByShortcutQueryKey(value),
         trend: 'TENANT_TREND',
       });
-      tenantTrendList.value = res.map((item) => [item.ts, item.value]);
+      tenantTrendList.value = res.map((item) => [item.date, item.value]);
     } else {
       if (activeCustomerIndex.value === index) return;
       activeCustomerIndex.value = index;
       customerDateValue.value = [];
       const res = await getTrendData({
-        startTs: endTs - value,
-        endTs,
-        interval: value === 2592000000 ? 86400000 : value === 7776000000 ? 172800000 : 2592000000,
+        ...getDateByShortcutQueryKey(value),
         trend: 'CUSTOMER_TREND',
       });
-      customerTrendList.value = res.map((item) => [item.ts, item.value]);
+      customerTrendList.value = res.map((item) => [item.date, item.value]);
     }
   }
 
   // 获取选中的时间范围内的数据
-  async function getDateData(startTs, endTs, trend: 'CUSTOMER_TREND' | 'TENANT_TREND', list) {
-    // 计算时间间隔
-    function computedInterval(startTs: number, endTs: number) {
-      /**
-       * 选择的时间间隔
-       * <=1 2h
-       * <=30 1day
-       *  >30<90 2day
-       *  >90 1month
-       */
-      let interval = 86400000;
-      if (endTs - startTs <= 86400000) {
-        interval = 7200000;
-      } else if (endTs - startTs <= 2592000000) {
-        interval = 86400000;
-      } else if (endTs - startTs > 2592000000 && endTs - startTs < 7776000000) {
-        interval = 172800000;
-      } else if (endTs - startTs > 7776000000) {
-        interval = 2592000000;
-      }
-      return interval;
-    }
-    startTs = parseInt(formatToDateTime(startTs, 'x')) - 86400000;
-    endTs = parseInt(formatToDateTime(endTs, 'x'));
+  async function getDateData(
+    startTs: moment.Moment,
+    endTs: moment.Moment,
+    trend: 'CUSTOMER_TREND' | 'TENANT_TREND',
+    list: Ref<[string, string][]>
+  ) {
     const res = await getTrendData({
-      startTs,
-      endTs,
-      interval: computedInterval(startTs, endTs),
+      startTs: startTs.valueOf(),
+      endTs: endTs.valueOf(),
+      interval: 24 * 60 * 60 * 1000,
       trend,
     });
-    list.value = res.map((item) => [item.ts, item.value]);
+    list.value = res.map((item) => [item.date, item.value]);
   }
 
   // 租户选择日期
-  function onDateTenantChange(_, dateString) {
-    if (!_.length) return;
-    const [startTs, endTs] = dateString;
+  function onDateTenantChange(range: RangePickerValue) {
+    if (!range.length) return;
+    const [startTs, endTs] = range;
     activeTenantIndex.value = -1;
-    getDateData(startTs, endTs, 'TENANT_TREND', tenantTrendList);
+    getDateData(startTs as moment.Moment, endTs as moment.Moment, 'TENANT_TREND', tenantTrendList);
   }
   // 客户趋势选择日期
-  function onDateCustomerChange(_, dateString) {
-    if (!_.length) return;
-    const [startTs, endTs] = dateString;
+  function onDateCustomerChange(range: RangePickerValue) {
+    if (!range.length) return;
+    const [startTs, endTs] = range;
     activeCustomerIndex.value = -1;
-    getDateData(startTs, endTs, 'CUSTOMER_TREND', customerTrendList);
+    getDateData(
+      startTs as moment.Moment,
+      endTs as moment.Moment,
+      'CUSTOMER_TREND',
+      customerTrendList
+    );
   }
   return {
     tenantDateValue,

@@ -22,6 +22,16 @@ export enum ConfigurationPermission {
   PREVIEW = 'api:yt:dataview:center:get_configuration_info:preview',
   PUBLISH = 'api:yt:dataview:center:publish',
   // CANCEL_PUBLISH = 'api:yt:dataview:center:cancel_publish',
+  PUBLISH_INTERFACE = 'api:yt:dataview:center:public_interface',
+}
+
+export enum PublicInterface {
+  CREATE = 'api:yt:dataview:center:public_interface:post',
+  LIST = 'api:yt:dataview:center:public_interface:list',
+  UPDATE = 'api:yt:dataview:center:public_interface:update',
+  DELETE = 'api:yt:dataview:center:public_interface:delete',
+  PUBLISH = 'api:yt:dataview:center:public_interface:publish',
+  CANCEL_PUBLISH = 'api:yt:dataview:center:public_interface:cancel',
 }
 
 // 查询字段
@@ -49,6 +59,7 @@ export const formSchema: FormSchema[] = [
       return {
         listType: 'picture-card',
         maxFileLimit: 1,
+        accept: '.png,.jpg,.jpeg,.gif',
         api: async (file: File) => {
           try {
             const formData = new FormData();
@@ -63,6 +74,10 @@ export const formSchema: FormSchema[] = [
             return {};
           }
         },
+        // showUploadList: true,
+        onDownload(file) {
+          console.log(file);
+        },
         onPreview: (fileList: FileItem) => {
           createImgPreview({ imageList: [fileList.url!] });
         },
@@ -77,7 +92,7 @@ export const formSchema: FormSchema[] = [
     component: 'Input',
     componentProps: {
       placeholder: '请输入大屏名称',
-      maxLength: 255,
+      maxLength: 32,
     },
   },
   {

@@ -124,12 +124,16 @@
   const { largeDesignerPrefix } = useGlobSetting();
 
   const handlePreview = (record: BigScreenCenterItemsModel) => {
-    window.open(`${largeDesignerPrefix}/#/chart/preview/${record.id}`);
+    window.open(
+      `${largeDesignerPrefix}/#/chart/preview/${record.id}?organizationId=${record.organizationId}`
+    );
   };
 
   const handleDesign = (record: BigScreenCenterItemsModel) => {
     if (record.state === 1) return;
-    window.open(`${largeDesignerPrefix}/#/chart/home/${record.id}`);
+    window.open(
+      `${largeDesignerPrefix}/#/chart/home/${record.id}?organizationId=${record.organizationId}`
+    );
   };
 
   const handleDelete = async (record: BigScreenCenterItemsModel) => {
@@ -218,7 +222,10 @@
             <Authority v-if="!isCustomerUser" :value="ConfigurationPermission.CREATE">
               <Button type="primary" @click="handleCreateOrUpdate()"> 新增大屏 </Button>
             </Authority>
-            <Authority v-if="hasPublicInterfacePermission" :value="ConfigurationPermission.CREATE">
+            <Authority
+              v-if="hasPublicInterfacePermission"
+              :value="ConfigurationPermission.PUBLISH_INTERFACE"
+            >
               <Button type="primary" @click="handleCreateOrUpdatePublicApi()">公共接口管理</Button>
             </Authority>
             <CardLayoutButton v-model:value="listColumn" @change="handleCardLayoutChange" />

@@ -9,23 +9,30 @@
         <a-button type="link" class="ml-2" @click="handleRecordContent(record)"> 查看 </a-button>
       </template>
       <template #toolbar>
-        <a-button type="primary" @click="handleCreateOrEdit(null)"> 新增公共接口 </a-button>
-        <Popconfirm
-          title="您确定要批量删除数据"
-          ok-text="确定"
-          cancel-text="取消"
-          @confirm="handleDeleteOrBatchDelete(null)"
-        >
-          <a-button color="error" :disabled="hasBatchDelete"> 批量删除 </a-button>
-        </Popconfirm>
-        <Popconfirm
-          title="您确定要批量发布"
-          ok-text="确定"
-          cancel-text="取消"
-          @confirm="handleBatchPublish('batchPublish')"
-        >
-          <a-button color="error" :disabled="hasBatchPublish"> 批量发布 </a-button>
-        </Popconfirm>
+        <Authority :value="PublicInterface.CREATE">
+          <a-button type="primary" @click="handleCreateOrEdit(null)"> 新增公共接口 </a-button>
+        </Authority>
+
+        <Authority :value="PublicInterface.DELETE">
+          <Popconfirm
+            title="您确定要批量删除数据"
+            ok-text="确定"
+            cancel-text="取消"
+            @confirm="handleDeleteOrBatchDelete(null)"
+          >
+            <a-button color="error" :disabled="hasBatchDelete"> 批量删除 </a-button>
+          </Popconfirm>
+        </Authority>
+        <Authority :value="PublicInterface.PUBLISH">
+          <Popconfirm
+            title="您确定要批量发布"
+            ok-text="确定"
+            cancel-text="取消"
+            @confirm="handleBatchPublish('batchPublish')"
+          >
+            <a-button color="error" :disabled="hasBatchPublish"> 批量发布 </a-button>
+          </Popconfirm>
+        </Authority>
         <!-- <Popconfirm
           title="您确定要批量取消发布"
           ok-text="确定"
@@ -41,6 +48,7 @@
             {
               label: '发布',
               icon: 'ant-design:node-expand-outlined',
+              auth: PublicInterface.PUBLISH,
               onClick: handlePublish.bind(null, 'publish', record),
               ifShow: () => {
                 return record.state === 0 && record.creator === userId;
@@ -49,6 +57,7 @@
             {
               label: '取消发布',
               icon: 'ant-design:node-collapse-outlined',
+              auth: PublicInterface.CANCEL_PUBLISH,
               onClick: handlePublish.bind(null, 'canelPublish', record),
               ifShow: () => {
                 return record.state === 1 && record.creator === userId;
@@ -57,6 +66,7 @@
             {
               label: '修改',
               icon: 'clarity:note-edit-line',
+              auth: PublicInterface.UPDATE,
               onClick: handleCreateOrEdit.bind(null, record),
               ifShow: () => {
                 return record.state === 0 && record.creator === userId;
@@ -65,6 +75,7 @@
             {
               label: '删除',
               icon: 'ant-design:delete-outlined',
+              auth: PublicInterface.DELETE,
               color: 'error',
               ifShow: () => {
                 return record.state === 0 && record.creator === userId;
@@ -99,6 +110,8 @@
   import { useMessage } from '/@/hooks/web/useMessage';
   import { USER_INFO_KEY } from '/@/enums/cacheEnum';
   import { getAuthCache } from '/@/utils/auth';
+  import { PublicInterface } from '../config';
+  import { Authority } from '/@/components/Authority';
 
   const userInfo = getAuthCache(USER_INFO_KEY) as any;
 
@@ -119,7 +132,7 @@
     },
     useSearchForm: true,
     actionColumn: {
-      width: 150,
+      width: 180,
       title: '操作',
       dataIndex: 'action',
       slots: { customRender: 'action' },

@@ -7,11 +7,14 @@ import { JSONEditor } from '/@/components/CodeEditor';
 import { DeviceTypeEnum } from '/@/api/device/model/deviceModel';
 import { getModelServices } from '/@/api/device/modelOfMatter';
 import { ModelOfMatterParams } from '/@/api/device/model/modelOfMatterModel';
-import { toRaw, unref } from 'vue';
+import { nextTick, toRaw, unref } from 'vue';
 import ObjectModelValidateForm from '/@/components/Form/src/externalCompns/components/ObjectModelValidateForm/ObjectModelValidateForm.vue';
 import { CommandDeliveryWayEnum, ServiceCallTypeEnum } from '/@/enums/toolEnum';
 import { TaskTypeEnum } from '/@/views/task/center/config';
 import { AddressTypeEnum } from '/@/views/task/center/components/PollCommandInput';
+import { FileItem } from '/@/components/Form/src/components/ApiUpload.vue';
+import { createImgPreview } from '/@/components/Preview';
+import { uploadThumbnail } from '/@/api/configuration/center/configurationCenter';
 
 useComponentRegister('JSONEditor', JSONEditor);
 useComponentRegister('ObjectModelValidateForm', ObjectModelValidateForm);
@@ -29,15 +32,40 @@ export const step1Schemas: FormSchema[] = [
   {
     field: 'icon',
     label: '设备图片',
-    slot: 'iconSelect',
-    component: 'Input',
+    component: 'ApiUpload',
+    changeEvent: 'update:fileList',
+    valueField: 'fileList',
+    componentProps: () => {
+      return {
+        listType: 'picture-card',
+        maxFileLimit: 1,
+        accept: '.png,.jpg,.jpeg,.gif',
+        api: async (file: File) => {
+          try {
+            const formData = new FormData();
+            formData.set('file', file);
+            const { fileStaticUri, fileName } = await uploadThumbnail(formData);
+            return {
+              uid: fileStaticUri,
+              name: fileName,
+              url: fileStaticUri,
+            } as FileItem;
+          } catch (error) {
+            return {};
+          }
+        },
+        onPreview: (fileList: FileItem) => {
+          createImgPreview({ imageList: [fileList.url!] });
+        },
+      };
+    },
   },
   {
     field: 'alias',
     label: '别名 ',
     component: 'Input',
     componentProps: {
-      maxLength: 255,
+      maxLength: 32,
       placeholder: '请输入别名',
     },
   },
@@ -45,6 +73,10 @@ export const step1Schemas: FormSchema[] = [
     field: 'name',
     label: '设备名称',
     component: 'Input',
+    componentProps: {
+      maxLength: 32,
+      placeholder: '请输入别名',
+    },
     rules: [{ required: true, message: '设备名称为必填项' }],
     slot: 'snCode',
   },
@@ -121,7 +153,7 @@ export const step1Schemas: FormSchema[] = [
   {
     field: 'codeType',
     label: '标识符类型',
-    component: 'Select',
+    component: 'RadioGroup',
     dynamicRules({ values }) {
       return [
         {
@@ -206,10 +238,7 @@ export const step1Schemas: FormSchema[] = [
     },
     ifShow: ({ values }) => {
       return (
-        values?.transportType === TransportTypeEnum.TCP &&
-        (values.deviceType === DeviceTypeEnum.SENSOR ||
-          values.deviceType === DeviceTypeEnum.GATEWAY) &&
-        values?.codeType === TaskTypeEnum.CUSTOM
+        values?.transportType === TransportTypeEnum.TCP && values?.codeType === TaskTypeEnum.CUSTOM
       );
     },
   },
@@ -246,8 +275,9 @@ export const step1Schemas: FormSchema[] = [
     required: true,
     component: 'ApiSelect',
     ifShow: ({ values }) => values.deviceType === 'SENSOR' && values.organizationId,
-    componentProps: ({ formModel }) => {
+    componentProps: ({ formModel, formActionType }) => {
       const { organizationId, transportType } = formModel;
+      const { validateFields } = formActionType;
       if (![organizationId, transportType].every(Boolean)) return {};
       return {
         api: async (params: Recordable) => {
@@ -266,6 +296,10 @@ export const step1Schemas: FormSchema[] = [
         },
         valueField: 'tbDeviceId',
         labelField: 'alias',
+        onChange: async () => {
+          await nextTick();
+          validateFields(['gatewayId']);
+        },
       };
     },
   },

@@ -5,8 +5,8 @@ import { DeviceTypeEnum } from '/@/api/device/model/deviceModel';
 import { getCustomerList } from '/@/api/device/deviceManager';
 import { DescItem } from '/@/components/Description/index';
 import moment from 'moment';
-import { h } from 'vue';
-import { Button } from 'ant-design-vue';
+import { CSSProperties, h } from 'vue';
+import { Button, Tooltip } from 'ant-design-vue';
 import { TypeEnum } from './data';
 import { PageEnum } from '/@/enums/pageEnum';
 import { useGo } from '/@/hooks/web/usePage';
@@ -24,12 +24,19 @@ export const descSchema = (emit: EmitType): DescItem[] => {
       field: 'name',
       label: '设备名称',
       render(val, data: Record<'alias' | 'name', string>) {
-        return h('span', {}, data.alias || val);
+        return h(Tooltip, { title: data.alias || val }, () =>
+          h('span', { style: { cursor: 'pointer' } as CSSProperties }, data.alias || val)
+        );
       },
     },
     {
       field: 'label',
       label: '设备标签',
+      render(val) {
+        return h(Tooltip, { title: val }, () =>
+          h('span', { style: { cursor: 'pointer' } as CSSProperties }, val)
+        );
+      },
     },
     {
       field: 'deviceProfile.name',
@@ -79,6 +86,11 @@ export const descSchema = (emit: EmitType): DescItem[] => {
       field: 'description',
       label: '描述',
       // span: 2,
+      render(val) {
+        return h(Tooltip, { title: val }, () =>
+          h('span', { style: { cursor: 'pointer' } as CSSProperties }, val)
+        );
+      },
     },
   ];
 };
@@ -175,6 +187,10 @@ export const alarmColumns: BasicColumn[] = [
     title: '告警设备',
     dataIndex: 'deviceName',
     width: 120,
+    customRender: ({ record }) => {
+      const { deviceAlias, deviceName } = record || {};
+      return deviceAlias || deviceName;
+    },
   },
   {
     title: '告警场景',
@@ -333,7 +349,7 @@ export const childDeviceColumns: BasicColumn[] = [
 
 export const alarmLevel = (type: string): string => {
   if (type === 'CRITICAL') {
-    return '危险';
+    return '紧急';
   } else if (type === 'MAJOR') {
     return '重要';
   } else if (type === 'MINOR') {

@@ -4,7 +4,7 @@ import { FormSchema } from '/@/components/Table';
 import { DeviceTypeEnum, DeviceState, DeviceRecord } from '/@/api/device/model/deviceModel';
 import { deviceProfile } from '/@/api/device/deviceManager';
 import { h } from 'vue';
-import { Tag } from 'ant-design-vue';
+import { Tag, Tooltip } from 'ant-design-vue';
 import { handeleCopy } from '../../profiles/step/topic';
 
 // 表格列数据
@@ -32,19 +32,33 @@ export const columns: BasicColumn[] = [
           h(
             'div',
             {
-              class: 'cursor-pointer',
+              class: 'cursor-pointer truncate',
             },
-            `${record.alias}`
+            h(
+              Tooltip,
+              {
+                placement: 'topLeft',
+                title: `${record.alias}`,
+              },
+              () => `${record.alias}`
+            )
           ),
         h(
           'div',
           {
-            class: 'cursor-pointer text-blue-500',
+            class: 'cursor-pointer text-blue-500 truncate',
             onClick: () => {
               handeleCopy(`${record.name}`);
             },
           },
-          `${record.name}`
+          h(
+            Tooltip,
+            {
+              placement: 'topLeft',
+              title: `${record.name}`,
+            },
+            () => `${record.name}`
+          )
         ),
       ]);
     },

@@ -52,13 +52,15 @@
       const alarmStatus = ref('');
       const [registerModal, { closeModal }] = useModalInner(async (data) => {
         await resetFields();
+        const { deviceAlias, deviceName, severity, status, id } = data || {};
         await setFieldsValue({
           ...data,
-          severity: alarmLevel(data.severity),
-          status: statusType(data.status),
+          deviceName: deviceAlias || deviceName,
+          severity: alarmLevel(severity),
+          status: statusType(status),
         });
-        alarmId.value = data.id;
-        alarmStatus.value = data.status;
+        alarmId.value = id;
+        alarmStatus.value = status;
       });
       // 处理报警
       const handleAlarm = async () => {