fix: 修改组件按需引入插件

* fix: bug#17668

* fix: 视频屏蔽RTC

* fix: 修改组件按需引入插件

plugin/jetlinks.ts

@@ -306,7 +306,7 @@ function getSideEffects(compName: string, options: JetlinksVueResolverOptions, _
 }
 
 const filterName = ['message', 'Notification']
-const primitiveNames = ['AIcon','Affix', 'Anchor', 'AnchorLink', 'message', 'Notification', 'AutoComplete', 'AutoCompleteOptGroup', 'AutoCompleteOption', 'Alert', 'Avatar', 'AvatarGroup', 'BackTop', 'Badge', 'BadgeRibbon', 'Breadcrumb', 'BreadcrumbItem', 'BreadcrumbSeparator', 'Button', 'ButtonGroup', 'Calendar', 'Card', 'CardGrid', 'CardMeta', 'Collapse', 'CollapsePanel', 'Carousel', 'Cascader', 'Checkbox', 'CheckboxGroup', 'Col', 'Comment', 'ConfigProvider', 'DatePicker', 'MonthPicker', 'WeekPicker', 'RangePicker', 'QuarterPicker', 'Descriptions', 'DescriptionsItem', 'Divider', 'Dropdown', 'DropdownButton', 'Drawer', 'Empty', 'Form', 'FormItem', 'FormItemRest', 'Grid', 'Input', 'InputGroup', 'InputPassword', 'InputSearch', 'Textarea', 'Image', 'ImagePreviewGroup', 'InputNumber', 'Layout', 'LayoutHeader', 'LayoutSider', 'LayoutFooter', 'LayoutContent', 'List', 'ListItem', 'ListItemMeta', 'Menu', 'MenuDivider', 'MenuItem', 'MenuItemGroup', 'SubMenu', 'Mentions', 'MentionsOption', 'Modal', 'Statistic', 'StatisticCountdown', 'PageHeader', 'Pagination', 'Popconfirm', 'Popover', 'Progress', 'Radio', 'RadioButton', 'RadioGroup', 'Rate', 'Result', 'Row', 'Select', 'SelectOptGroup', 'SelectOption', 'SelectBoolean', 'Skeleton', 'SkeletonButton', 'SkeletonAvatar', 'SkeletonInput', 'SkeletonImage', 'Slider', 'Space', 'Spin', 'Steps', 'Step', 'Switch', 'Table', 'TableColumn', 'TableColumnGroup', 'TableSummary', 'TableSummaryRow', 'TableSummaryCell', 'Transfer', 'Tree', 'TreeNode', 'DirectoryTree', 'TreeSelect', 'TreeSelectNode', 'Tabs', 'TabPane', 'Tag', 'CheckableTag', 'TimePicker', 'TimeRangePicker', 'Timeline', 'TimelineItem', 'Tooltip', 'Typography', 'TypographyLink', 'TypographyParagraph', 'TypographyText', 'TypographyTitle', 'Upload', 'UploadDragger', 'LocaleProvider', 'ProTable', 'Search', 'AdvancedSearch', 'Ellipsis', 'MonacoEditor', 'ProLayout', 'ScrollTable', 'TableCard', 'Scrollbar', 'CardSelect', 'ColorPicker', 'PopconfirmModal', 'DataTable',
+const primitiveNames = ['AIcon','Affix', 'Anchor', 'AnchorLink', 'message', 'Notification', 'AutoComplete', 'AutoCompleteOptGroup', 'AutoCompleteOption', 'Alert', 'Avatar', 'AvatarGroup', 'BackTop', 'Badge', 'BadgeRibbon', 'Breadcrumb', 'BreadcrumbItem', 'BreadcrumbSeparator', 'Button', 'ButtonGroup', 'Calendar', 'Card', 'CardGrid', 'CardMeta', 'Collapse', 'CollapsePanel', 'Carousel', 'Cascader', 'Checkbox', 'CheckboxGroup', 'Col', 'Comment', 'ConfigProvider', 'DatePicker', 'MonthPicker', 'WeekPicker', 'RangePicker', 'QuarterPicker', 'Descriptions', 'DescriptionsItem', 'Divider', 'Dropdown', 'DropdownButton', 'Drawer', 'Empty', 'Form', 'FormItem', 'FormItemRest', 'Grid', 'Input', 'InputGroup', 'InputPassword', 'InputSearch', 'Textarea', 'Image', 'ImagePreviewGroup', 'InputNumber', 'Layout', 'LayoutHeader', 'LayoutSider', 'LayoutFooter', 'LayoutContent', 'List', 'ListItem', 'ListItemMeta', 'Menu', 'MenuDivider', 'MenuItem', 'MenuItemGroup', 'SubMenu', 'Mentions', 'MentionsOption', 'Modal', 'Statistic', 'StatisticCountdown', 'PageHeader', 'Pagination', 'Popconfirm', 'Popover', 'Progress', 'Radio', 'RadioButton', 'RadioGroup', 'Rate', 'Result', 'Row', 'Select', 'SelectOptGroup', 'SelectOption', 'SelectBoolean', 'Skeleton', 'SkeletonButton', 'SkeletonAvatar', 'SkeletonInput', 'SkeletonImage', 'Slider', 'Space', 'Spin', 'Steps', 'Step', 'Switch', 'Table', 'TableColumn', 'TableColumnGroup', 'TableSummary', 'TableSummaryRow', 'TableSummaryCell', 'Transfer', 'Tree', 'TreeNode', 'DirectoryTree', 'TreeSelect', 'TreeSelectNode', 'Tabs', 'TabPane', 'Tag', 'CheckableTag', 'TimePicker', 'TimeRangePicker', 'Timeline', 'TimelineItem', 'Tooltip', 'Typography', 'TypographyLink', 'TypographyParagraph', 'TypographyText', 'TypographyTitle', 'Upload', 'UploadDragger', 'LocaleProvider', 'ProTable', 'Search', 'AdvancedSearch', 'Ellipsis', 'MonacoEditor', 'ProLayout', 'ScrollTable', 'TableCard', 'Scrollbar', 'CardSelect', 'PopconfirmModal', 'DataTable',
   'DataTableArray',
   'DataTableString',
   'DataTableInteger',

src/api/device/instance.ts

@@ -617,3 +617,17 @@ export const queryByParent = (deviceId: string) => server.get(`/device/gateway/$
 
 export const queryCodeTips = (productId: string, deviceId: string) => server.get(`/device/transparent-codec/${productId}/${deviceId}.d.ts`)
 export const queryProductCodeTips = (productId: string) => server.get(`/device/transparent-codec/${productId}.d.ts`)
+
+/**
+ * 获取设备物模型规则TS
+ * @param deviceId 设备ID
+ * @returns 
+ */
+export const queryTypescript = (deviceId:string) => server.get(`/device/${deviceId}/virtual-property.d.ts`) 
+
+/**
+ * 获取产品物模型规则TS
+ * @param productId 产品ID
+ * @returns 
+ */
+export const queryProductTs = (productId:string) => server.get(`/product/${productId}/virtual-property.d.ts`)

src/api/link/type.ts

@@ -36,3 +36,8 @@ export const save = (data: Object) => server.post(`/network/config`, data);
 export const update = (data: Object) => server.patch(`/network/config`, data);
 
 export const detail = (id: string) => server.get(`/network/config/${id}`);
+
+/**
+ * 获取TCP粘拆包TS资源
+ */
+export const getTs = () => server.get('/system/resources/ScriptPayloadParser.d.ts')

src/api/media/device.ts

@@ -25,4 +25,6 @@ export default {
     queryProvider: (data?: any) => server.post<any>(`/gateway/device/detail/_query`, data),
     // 查询网关配置
     getConfiguration: (id: string, transport: string) => server.get<any>(`/protocol/${id}/${transport}/configuration`),
+    //校验ID合法
+    validateId: (id:string) => server.get<any>('/media/device/id/_validate',{id:id})
 }

src/components/FRuleEditor/Editor/index.vue

@@ -29,19 +29,28 @@
       </div>
     </div>
     <div class="editor">
-      <j-monaco-editor v-if="loading" v-model:model-value="_value" theme="vs" ref="editor" language="javascript"/>
+      <j-monaco-editor v-if="loading" v-model:model-value="_value" theme="vs" ref="editor" language="javascript" :registrationTypescript="typescriptTip"
+        :init="editorInit"/>
     </div>
   </div>
 </template>
 <script setup lang="ts" name="Editor">
-
+import {
+  queryTypescript,
+  queryProductTs
+} from '@/api/device/instance';
+import { useInstanceStore } from '@/store/instance';
+import { useProductStore } from '@/store/product';
+import { inject } from 'vue'
 interface Props {
   mode?: 'advance' | 'simple';
   id?: string;
   value?: string;
 }
 const props = defineProps<Props>()
-
+const target = inject('target')
+const instanceStore = useInstanceStore()
+const productStore = useProductStore()
 interface Emits {
   (e: 'change', data: string): void;
   (e: 'update:value', data: string): void;
@@ -58,6 +67,56 @@ type SymbolType = {
   key: string,
   value: string
 }
+
+const typescriptTip = reactive({
+  typescript: ''
+})
+
+const queryCode = () => {
+  let id = ''
+  if(target==='device'){
+    id = instanceStore.current.id
+    queryTypescript(id).then(res => {
+      if (res.status===200) {
+        typescriptTip.typescript = res.result
+      }
+    })
+  }else if(target ==='product'){
+    id = productStore.current.id
+    queryProductTs(id).then(res => {
+      if (res.status===200) {
+        typescriptTip.typescript = res.result
+      }
+    })
+  }
+  
+}
+queryCode()
+
+const editorInit = (editor: any, monaco: any) => {
+  monaco.languages.typescript.javascriptDefaults.setDiagnosticsOptions({
+    noSemanticValidation: true,
+    noSyntaxValidation: false,
+  });
+
+  // compiler options
+  monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
+    allowJs: true,
+    checkJs: true,
+    allowNonTsExtensions: true,
+    target: monaco.languages.typescript.ScriptTarget.ESNext,
+    strictNullChecks: false,
+    strictPropertyInitialization: true,
+    strictFunctionTypes: true,
+    strictBindCallApply: true,
+    useDefineForClassFields: true,//permit class static fields with private name to have initializer
+    moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,
+    module: monaco.languages.typescript.ModuleKind.CommonJS,
+    typeRoots: ["types"],
+    lib: ["esnext"]
+  });
+}
+
 const symbolList = [
   {
     key: 'add',

src/components/Player/index.vue

@@ -35,7 +35,7 @@ type PlayerProps = {
     updateTime?: number;
     key?: string | number;
     loading?: boolean;
-    protocol?: 'mp4' | 'flv' | 'hls';
+    protocol?: 'mp4' | 'flv' | 'hls' | 'rtc';
     onDestroy?: (e?: any) => void;
     onMessage?: (msg: any) => void;
     onError?: (err: any) => void;

src/utils/consts.ts

@@ -50,6 +50,7 @@ export const SystemConst = {
 
 export const USER_CENTER_MENU_CODE = 'account-center'
 export const USER_CENTER_MENU_BUTTON_CODE = 'user-center-passwd-update'
+export const messageSubscribe  = 'message-subscribe'
 
 /**协议列表 */
 export const protocolList = [

src/utils/request.ts

@@ -150,43 +150,50 @@ const showNotification = (message: string, description: string, key?: string, sh
  * @returns {Promise<never>}
  */
 const errorHandler = (error: any) => {
+  
   if (error.response) {
     const data = error.response.data
     const status = error.response.status
-    if (data?.code === 'license required') {
+    if(data instanceof Blob){
-     Modal.error({
+      data.text().then((res)=>{
-        key: 'License',
+        showNotification(error.message, (JSON.parse(res).message + '').substr(0,90))
-        title: 'License已到期或者错误',
-        content: h(
-          'a',
-          {
-            onClick: () =>
-            {
-              Modal.destroyAll?.();
-              window.location.href = '/#/init-license';
-            }
-          },
-          '请更新License'
-        )
       })
-    } else if (status === 403) {
+    }else{
-      showNotification('Forbidden', (data.message + '').substr(0, 90), '403')
+      if (data?.code === 'license required') {
-    } else if (status === 500) {
+        Modal.error({
-      showNotification('Server Side Error', (data.message + '').substr(0, 90), '500')
+           key: 'License',
-    } else if (status === 400) {
+           title: 'License已到期或者错误',
-      showNotification('Request Error', (data.message + '').substr(0, 90), '400')
+           content: h(
-    } else if (status === 401) {
+             'a',
-      showNotification('Unauthorized', '用户未登录', '401')
+             {
-      setTimeout(() => {
+               onClick: () =>
-        cleanToken()
+               {
-        router.replace({
+                 Modal.destroyAll?.();
-          path: LoginPath
+                 window.location.href = '/#/init-license';
-        })
+               }
-      }, 0)
+             },
-    } else if (status === 404) {
+             '请更新License'
-      const data = error?.response?.data
+           )
-      const message = error?.response?.data?.message || `${data?.error} ${data?.path}`
+         })
-      showNotification(error?.code, message, '404')
+       } else if (status === 403) {
+         showNotification('Forbidden', (data.message + '').substr(0, 90), '403')
+       } else if (status === 500) {
+         showNotification('Server Side Error', (data.message + '').substr(0, 90), '500')
+       } else if (status === 400) {
+         showNotification('Request Error', (data.message + '').substr(0, 90), '400')
+       } else if (status === 401) {
+         showNotification('Unauthorized', '用户未登录', '401')
+         setTimeout(() => {
+           cleanToken()
+           router.replace({
+             path: LoginPath
+           })
+         }, 0)
+       } else if (status === 404) {
+         const data = error?.response?.data
+         const message = error?.response?.data?.message || `${data?.error} ${data?.path}`
+         showNotification(error?.code, message, '404')
+       }
     }
   } else if (error.response === undefined) {
     if (error.message.includes('timeout')) {

src/utils/websocket.ts

@@ -13,10 +13,11 @@ const timeout = 5000
 const tempQueue: any[] = [] // websocket未连接上时，缓存消息列
 
 export const initWebSocket = () => {
+    const token = getToken()
+    if (!token) return
     if (ws) {
         return ws
     }
-    const token = getToken()
     const url = `${document.location.protocol.replace('http', 'ws')}//${document.location.host}${BASE_API_PATH}/messaging/${token}?:X_Access_Token=${token}`;
     if (count < total) {
         count += 1
@@ -102,6 +103,13 @@ export const getWebSocket = (id: string, topic: string, parameter: Record<string
     }
 })
 
+export const closeWs = () => {
+    if (ws) {
+        ws.close()
+        timer && clearInterval(timer)
+    }
+} 
+
 /**
  * 重连
  */

src/views/device/Instance/Detail/ChildDevice/EdgeMap/index.vue

@@ -123,7 +123,6 @@
 <script lang="ts" setup>
 import { useInstanceStore } from '@/store/instance';
 import {
-    getEdgeMap,
     saveEdgeMap,
     removeEdgeMap,
     edgeChannel,

src/views/device/Instance/Detail/ChildDevice/index.vue

@@ -89,6 +89,7 @@
                         :key="i.key"
                     >
                         <PermissionButton
+                            v-if="i.key !== 'update' || detail.accessProvider === 'official-edge-gateway'"
                             :disabled="i.disabled"
                             :popConfirm="i.popConfirm"
                             :tooltip="{
@@ -307,6 +308,9 @@ const closeBindDevice = (val: boolean) => {
 const closeChildSave = () => {
     childVisible.value = false;
 };
+onMounted(()=>{
+    console.log(detail.value.accessProvider)
+})
 </script>
 
 <style lang="less">

src/views/device/Instance/Import/modal.vue

@@ -162,6 +162,7 @@ const save = () => {
 const importCancel = () => {
   importVisible.value = false
   emit('save')
+  cancel()
 }
 </script>
 

src/views/device/components/InklingDevice/index.vue

@@ -177,7 +177,7 @@ const checkChange = (e: any) => { // 全选
     const keys = deviceList.value.filter(item => {
       //  过滤已选中和已绑定
       const type = !checkKeys.value.includes(item.id) && !disabledKeys.value.includes(item.id)
-      if (type && checkCache.value.has(item.id)) {
+      if (type && !checkCache.value.has(item.id)) {
         checkCache.value.set(item.id, item)
       }
       return type

src/views/device/components/Metadata/Base/components/Source.vue

@@ -99,6 +99,7 @@ import { useInstanceStore } from '@/store/instance';
 import { resetRule } from '@/api/device/instance';
 import { updata } from '@/api/rule-engine/configuration';
 import { onlyMessage } from '@/utils/comm';
+import { provide } from 'vue';
 const instanceStore = useInstanceStore();
 const PropertySource: { label: string; value: string }[] = isNoCommunity
     ? [
@@ -156,7 +157,7 @@ const props = defineProps({
         default: []
     }
 });
-
+provide('target',props.target)
 const emit = defineEmits<Emit>();
 const formItemContext = Form.useInjectFormItemContext();
 

src/views/link/AccessConfig/components/Channel/index.vue

@@ -49,6 +49,7 @@
                                 :hasPermission="`link/AccessConfig:${
                                     id === ':id' ? 'add' : 'update'
                                 }`"
+                                :loading="loading"
                             >
                                 保存
                             </PermissionButton>
@@ -88,6 +89,7 @@ const route = useRoute();
 const view = route.query.view as string;
 const id = route.params.id as string;
 
+const loading = ref(false)
 const props = defineProps({
     provider: {
         type: Object,
@@ -106,6 +108,7 @@ const formState = ref<FormState>({
     description: '',
 });
 const onFinish = async (values: any) => {
+    loading.value = true
     const providerId = props.provider.id;
     const params = {
         ...values,
@@ -124,6 +127,7 @@ const onFinish = async (values: any) => {
             setTimeout(() => window.close(), 300);
         }
     }
+    loading.value = false
 };
 
 onMounted(() => {

src/views/link/AccessConfig/components/Cloud/Ctwing.vue

@@ -328,6 +328,7 @@
                 :hasPermission="`link/AccessConfig:${
                     id === ':id' ? 'add' : 'update'
                 }`"
+                :loading="loading"
             >
                 保存
             </PermissionButton>
@@ -376,6 +377,7 @@ const route = useRoute();
 const view = route.query.view as string;
 const id = route.params.id as string;
 
+const loading = ref(false)
 const props = defineProps({
     provider: {
         type: Object,
@@ -434,6 +436,7 @@ const procotolSearch = (value: string) => {
 
 const saveData = async () => {
     const data: any = await formRef2.value?.validate();
+    loading.value = true
     const params = {
         ...data,
         configuration: {
@@ -460,6 +463,7 @@ const saveData = async () => {
             setTimeout(() => window.close(), 300);
         }
     }
+    loading.value = false
 };
 
 const queryProcotolList = async (id: string, params = {}) => {

src/views/link/AccessConfig/components/Cloud/OneNet.vue

@@ -406,6 +406,7 @@
                 :hasPermission="`link/AccessConfig:${
                     id === ':id' ? 'add' : 'update'
                 }`"
+                :loading="loading"
             >
                 保存
             </PermissionButton>
@@ -486,6 +487,7 @@ const formData = ref<Form>({
     description: '',
 });
 
+const loading = ref(false)
 const current = ref(0);
 const stepCurrent = ref(0);
 const steps = ref(['接入配置', '消息协议', '完成']);
@@ -515,6 +517,7 @@ const procotolSearch = (value: string) => {
 
 const saveData = async () => {
     const data: any = await formRef2.value?.validate();
+    loading.value = true
     const params = {
         ...data,
         configuration: {
@@ -542,6 +545,7 @@ const saveData = async () => {
             setTimeout(() => window.close(), 300);
         }
     }
+    loading.value =false
 };
 
 const queryProcotolList = async (id: string, params = {}) => {

src/views/link/AccessConfig/components/Edge/geteway.vue

@@ -49,6 +49,7 @@
                                 }`"
                   html-type="submit"
                   type="primary"
+                  :loading="loading"
               >
                 保存
               </PermissionButton>
@@ -88,6 +89,7 @@ const route = useRoute();
 const view = route.query.view as string;
 const id = route.params.id as string;
 
+const loading = ref(false)
 const props = defineProps({
   provider: {
     type: Object,
@@ -106,6 +108,7 @@ const formState = ref<FormState>({
   description: '',
 });
 const onFinish = async (values: any) => {
+  loading.value = true
   const providerId = props.provider.id;
   const params = {
     ...values,
@@ -124,6 +127,7 @@ const onFinish = async (values: any) => {
       setTimeout(() => window.close(), 300);
     }
   }
+  loading.value = false
 };
 
 onMounted(() => {

src/views/link/AccessConfig/components/Edge/index.vue

@@ -156,6 +156,7 @@
                                 :hasPermission="`link/AccessConfig:${
                                     id === ':id' ? 'add' : 'update'
                                 }`"
+                                :loading="loading"
                             >
                                 保存
                             </PermissionButton>
@@ -187,6 +188,7 @@
                 :hasPermission="`link/AccessConfig:${
                     id === ':id' ? 'add' : 'update'
                 }`"
+                :loading="loading"
             >
                 保存
             </PermissionButton>
@@ -223,6 +225,7 @@ const route = useRoute();
 const view = route.query.view as string;
 const id = route.params.id as string;
 
+const loading = ref(false)
 const props = defineProps({
     provider: {
         type: Object,
@@ -252,6 +255,7 @@ const networkList: any = ref([]);
 const allNetworkList: any = ref([]);
 
 const onFinish = async (values: any) => {
+    loading.value = true
     const providerId = props.provider.id;
     const params = {
         ...values,
@@ -270,6 +274,7 @@ const onFinish = async (values: any) => {
             setTimeout(() => window.close(), 300);
         }
     }
+    loading.value = false
 };
 
 const checkedChange = (id: string) => {

src/views/link/AccessConfig/components/Media/index.vue

@@ -50,6 +50,7 @@
                                     :hasPermission="`link/AccessConfig:${
                                         id === ':id' ? 'add' : 'update'
                                     }`"
+                                    :loading="loading"
                                 >
                                     保存
                                 </PermissionButton>
@@ -104,6 +105,7 @@ const props = defineProps({
     },
 });
 
+const loading = ref(false);
 const channel = ref(props.provider.channel);
 
 const formState = ref<FormState>({
@@ -111,6 +113,7 @@ const formState = ref<FormState>({
     description: '',
 });
 const onFinish = async (values: any) => {
+    loading.value = true
     const params = {
         ...values,
         provider: 'fixed-media',
@@ -132,6 +135,7 @@ const onFinish = async (values: any) => {
             history.back();
         }
     }
+    loading.value = false
 };
 
 onMounted(() => {

src/views/link/Type/Detail/index.vue

@@ -903,6 +903,8 @@
                                                                         .script
                                                                 "
                                                                 language="javascript"
+                                                                :init="editorInit"
+                                                                :registrationTypescript="typescriptTip"
                                                             />
                                                         </div>
                                                     </j-form-item>
@@ -1127,6 +1129,7 @@ import {
     start,
     resourceClusters,
     resourceClustersById,
+    getTs
 } from '@/api/link/type';
 import {
     ParserConfiguration,
@@ -1172,6 +1175,34 @@ const portOptionsIndex: any = ref([]);
 const certIdOptions = ref([]);
 const configClustersList = ref<any[]>([]);
 
+const typescriptTip = reactive({
+  typescript: ''
+})
+
+const editorInit = (editor: any, monaco: any) => {
+  monaco.languages.typescript.javascriptDefaults.setDiagnosticsOptions({
+    noSemanticValidation: true,
+    noSyntaxValidation: false,
+  });
+
+  // compiler options
+  monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
+    allowJs: true,
+    checkJs: true,
+    allowNonTsExtensions: true,
+    target: monaco.languages.typescript.ScriptTarget.ESNext,
+    strictNullChecks: false,
+    strictPropertyInitialization: true,
+    strictFunctionTypes: true,
+    strictBindCallApply: true,
+    useDefineForClassFields: true,//permit class static fields with private name to have initializer
+    moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,
+    module: monaco.languages.typescript.ModuleKind.CommonJS,
+    typeRoots: ["types"],
+    lib: ["esnext"]
+  });
+}
+
 const dynamicValidateForm = reactive<{ cluster: FormData2Type[] }>({
     cluster: [{ ...cloneDeep(FormStates2), id: '1' }],
 });
@@ -1250,6 +1281,13 @@ const changeType = (value: string) => {
         const { configuration } = dynamicValidateForm.cluster[0];
         value && (configuration.host = '0.0.0.0');
     }
+    if(value ==='TCP_SERVER'){
+        getTs().then((res:any)=>{
+            if (res.status===200) {
+                typescriptTip.typescript = res.result
+            }
+        })
+    }
 };
 
 const updateClustersListIndex = () => {

src/views/media/Device/Channel/Live/Preset.vue

@@ -4,7 +4,7 @@
         :columns="columns"
         :dataSource="dataSource"
         :pagination="false"
-        :scroll="{ y: 200 }"
+        :scroll="share ? { y: 560} :{ y: 200 }"
     >
         <template #bodyCell="{ column, record }">
             <template v-if="column.dataIndex === 'actions'">
@@ -61,6 +61,10 @@ const props = defineProps({
         type: Object as PropType<Partial<Record<string, any>>>,
         default: () => ({}),
     },
+    share:{
+        type:Boolean,
+        default:false
+    }
 });
 
 const emits = defineEmits(['refresh'])

src/views/media/Device/Channel/Live/Share.vue

@@ -41,7 +41,7 @@ const url = ref('');
 const urlRef = ref<HTMLInputElement>()
 
 watchEffect(() => {
-    url.value = `${window.location.origin}#/media/device/Share?deviceId=${props.data.deviceId}&channelId=${props.data.channelId}&type=${route.query.type}&${TOKEN_KEY}=${token}`
+    url.value = `${window.location.origin}#/media/device/Share?deviceId=${props.data.deviceId}&channelId=${props.data.channelId}&type=${route.query.type}&id=${props.data.id}&${TOKEN_KEY}=${token}`
 })
 
 const onCopy = () => {

src/views/media/Device/Channel/Live/index.vue

@@ -3,7 +3,8 @@
     <j-modal
         v-model:visible="_vis"
         title="播放"
-        :width="_type ? 1200 : 900"
+        :width="type === 'share'? '100%' : _type ? 1200 : 900"
+        :class="{share: type === 'share'}"
         :maskClosable="false"
         @ok="_vis = false"
         :destroyOnClose="true"
@@ -20,6 +21,7 @@
                 <j-radio-button value="mp4">MP4</j-radio-button>
                 <j-radio-button value="flv">FLV</j-radio-button>
                 <j-radio-button value="m3u8">HLS</j-radio-button>
+                <!-- <j-radio-button value='rtc'>RTC</j-radio-button> -->
             </j-radio-group>
             <div class="media-live-share" v-if="type !== 'share'">
                 <j-button type="link" @click="onShare"
@@ -132,9 +134,9 @@
             </div>
         </div>
         <template #footer>
-          <j-space>
+          <j-space v-if="type !== 'share'">
-            <j-button :disabled="type === 'share'" @click="_vis = false">取消</j-button>
+            <j-button  @click="_vis = false">取消</j-button>
-            <j-button :disabled="type === 'share'" @click="_vis = false" type="primary">确定</j-button>
+            <j-button  @click="_vis = false" type="primary">确定</j-button>
           </j-space>
         </template>
     </j-modal>
@@ -179,7 +181,7 @@ const player = ref();
 // 视频地址
 const url = ref('');
 // 视频类型
-const mediaType = ref<'mp4' | 'flv' | 'hls'>('mp4');
+const mediaType = ref<'mp4' | 'flv' | 'hls' | 'rtc'>('mp4');
 const showTool = ref(false);
 const showToolLock = ref(false);
 

src/views/media/Device/Channel/Live/shareLive.vue

@@ -0,0 +1,335 @@
+<template>
+  <div style="width: 95%; margin: 0 auto;">
+    <div class="media-live-tool">
+            <j-radio-group
+                v-model:value="mediaType"
+                button-style="solid"
+                @change="mediaStart"
+            >
+                <j-radio-button value="mp4">MP4</j-radio-button>
+                <j-radio-button value="flv">FLV</j-radio-button>
+                <j-radio-button value="m3u8">HLS</j-radio-button>
+            </j-radio-group>
+            <div class="media-live-share" v-if="type !== 'share'">
+                <j-button type="link" @click="onShare"
+                    ><AIcon type="ShareAltOutlined" />分享视频</j-button
+                >
+            </div>
+        </div>
+        <div class="media-live">
+            <div class="media-live-video">
+                <div
+                    :class="mediaToolClass"
+                    @mouseleave="mouseleave"
+                    @mouseenter="showTool = true"
+                >
+                    <div class="tool-item" v-if="type !== 'share'">
+                        <template v-if="isRecord === 0">
+                            <j-dropdown
+                                trigger="click"
+                                @visibleChange="visibleChange"
+                                @click="showToolLock = true"
+                            >
+                                <div>开始录像</div>
+                                <template #overlay>
+                                    <j-menu @click="recordStart">
+                                        <j-menu-item
+                                            key="true"
+                                            v-if="_type"
+                                        >
+                                            <span style="padding-right: 12px"
+                                                >本地存储</span
+                                            >
+                                            <j-tooltip title="存储在设备本地">
+                                                <a-icon
+                                                    type="QuestionCircleOutlined"
+                                                />
+                                            </j-tooltip>
+                                        </j-menu-item>
+                                        <j-menu-item key="false">
+                                            <span style="padding-right: 12px"
+                                                >云端存储</span
+                                            >
+                                            <j-tooltip title="存储在服务器中">
+                                                <a-icon
+                                                    type="QuestionCircleOutlined"
+                                                />
+                                            </j-tooltip>
+                                        </j-menu-item>
+                                    </j-menu>
+                                </template>
+                            </j-dropdown>
+                        </template>
+                        <div v-else-if="isRecord === 1">请求录像中</div>
+                        <div
+                            v-else-if="isRecord === 2"
+                            @click.stop="recordStop"
+                        >
+                            停止录像
+                        </div>
+                    </div>
+
+                    <div class="tool-item" @click.stop="handleRefresh">
+                        刷新
+                    </div>
+                    <div class="tool-item">
+                        <j-popconfirm
+                            title="重置将断开直播, 可能会影响其他播放者"
+                            @confirm="handleReset"
+                        >
+                            重置
+                        </j-popconfirm>
+                    </div>
+                </div>
+                <LivePlayer
+                    ref="player"
+                    :live="true"
+                    :url="url"
+                    :protocol="mediaType"
+                    autoplay
+                />
+            </div>
+            <div class="media-live-actions" v-if="_type">
+                <div class="actions-tool">
+                    <MediaTool
+                        @onMouseDown="handleMouseDown"
+                        @onMouseUp="handleMouseUp"
+                    >
+                        <template #center>
+                            <div class="center">
+                                <div>转速控制</div>
+                                <j-dropdown>
+                                    <span
+                                        >{{ _speed }}<AIcon type="DownOutlined"
+                                    /></span>
+                                    <template #overlay>
+                                        <j-menu @click="onMenuChange">
+                                            <j-menu-item
+                                                :key="item.value"
+                                                v-for="item in speedList"
+                                            >
+                                                {{ item.label }}
+                                            </j-menu-item>
+                                        </j-menu>
+                                    </template>
+                                </j-dropdown>
+                            </div>
+                        </template>
+                    </MediaTool>
+                </div>
+                <Preset :data="data" @refresh="onRefresh" :share="true"/>
+            </div>
+        </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { PropType } from 'vue';
+import LivePlayer from '@/components/Player/index.vue';
+import MediaTool from '@/components/Player/mediaTool.vue';
+import channelApi from '@/api/media/channel';
+import Share from './Share.vue';
+import Preset from './Preset.vue';
+
+type Emits = {
+    (e: 'update:visible', data: boolean): void;
+    (e: 'refresh'): void;
+};
+const emit = defineEmits<Emits>();
+
+const props = defineProps({
+    visible: { type: Boolean, default: false },
+    data: {
+        type: Object as PropType<Partial<Record<string, any>>>,
+        default: () => ({}),
+    },
+    type: {
+        type: String as PropType<'share' | 'normal'>,
+        default: 'normal',
+    },
+});
+
+const route = useRoute();
+
+const _vis = computed({
+    get: () => props.visible,
+    set: (val) => emit('update:visible', val),
+});
+
+// 播放器
+const player = ref();
+// 视频地址
+const url = ref('');
+// 视频类型
+const mediaType = ref<'mp4' | 'flv' | 'hls' | 'rtc'>('mp4');
+const showTool = ref(false);
+const showToolLock = ref(false);
+
+const visible = ref(false);
+
+const _type = computed(() => {
+  return route.query.type !== 'fixed-media'
+})
+
+const speedList = [
+    { label: '高', value: 180 },
+    { label: '中', value: 90 },
+    { label: '低', value: 45 },
+];
+const speed = ref(90);
+
+const _speed = computed(() => {
+    return speedList.find((item) => item.value === speed.value)?.label;
+});
+
+const onMenuChange = (val: any) => {
+    speed.value = val.key;
+};
+
+const mouseleave = () => {
+    if (!showToolLock.value) {
+        showTool.value = false;
+    }
+};
+
+const visibleChange = (v: boolean) => {
+    showTool.value = v;
+};
+
+const getPopupContainer = (trigger: HTMLElement) => {
+    return trigger?.parentNode || document.body;
+};
+
+const mediaToolClass = computed(() => {
+    return {
+        'media-tool': true,
+        'media-tool-show': showTool.value,
+    };
+});
+
+/**
+ * 媒体开始播放
+ */
+const mediaStart = () => {
+    url.value = channelApi.ptzStart(
+        props.data.deviceId,
+        props.data.channelId,
+        mediaType.value,
+    );
+};
+
+// 录像状态
+const isRecord = ref(0); // 0：停止录像； 1：请求录像中； 2：开始录像
+/**
+ * 查询录像状态
+ */
+const getIsRecord = async () => {
+    const { result } = await channelApi.ptzIsRecord(
+        props.data.deviceId,
+        props.data.channelId,
+    );
+    isRecord.value = result ? 2 : 0;
+};
+
+/**
+ * 开始录像
+ */
+const recordStart = async ({ key }: { key: string }) => {
+    showToolLock.value = false;
+    showTool.value = false;
+    isRecord.value = 1;
+    const local = key === 'true';
+    const res = await channelApi
+        .recordStart(props.data.deviceId, props.data.channelId, { local })
+        .catch(() => ({ success: false }));
+    if (res.success) {
+        isRecord.value = 2;
+    } else {
+        isRecord.value = 0;
+    }
+};
+
+/**
+ * 停止录像
+ */
+const recordStop = async () => {
+    const res = await channelApi.recordStop(
+        props.data.deviceId,
+        props.data.channelId,
+    );
+    if (res.success) {
+        isRecord.value = 0;
+    }
+};
+
+/**
+ * 刷新
+ */
+const handleRefresh = () => {
+    // player.value.play();
+    url.value = '';
+    setTimeout(() => {
+        mediaStart();
+    }, 500);
+};
+
+/**
+ * 重置
+ */
+const handleReset = async () => {
+    channelApi.mediaStop(props.data.deviceId, props.data.channelId);
+};
+
+/**
+ * 点击控制按钮
+ * @param type 控制类型
+ */
+const handleMouseDown = (type: string) => {
+    channelApi.ptzTool(props.data.deviceId, props.data.channelId, type, speed.value);
+};
+const handleMouseUp = () => {
+    channelApi.ptzStop(props.data.deviceId, props.data.channelId);
+};
+
+/**
+ * 分享视频
+ */
+const onShare = () => {
+    visible.value = true;
+};
+
+const onRefresh = () => {
+    emit('refresh')
+}
+
+watch(
+    () => _vis.value,
+    (val: boolean) => {
+        if (val) {
+            mediaStart();
+            getIsRecord();
+        } else {
+            // url置空, 即销毁播放器
+            url.value = '';
+        }
+    },
+    {
+      immediate: true
+    }
+);
+</script>
+<style lang="less" scoped>
+@import './index.less';
+:deep(.live-player-stretch-btn) {
+    display: none;
+}
+:deep(.vjs-icon-spinner) {
+    display: none;
+}
+
+.center {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+</style>

src/views/media/Device/Channel/Share/index.vue

@@ -1,16 +1,17 @@
 <template>
-    <Live :visible="true" type="share" :data="playData" />
+    <ShareLive :visible="true" type="share" :data="playData"/>
 </template>
 
 <script lang="ts" setup>
 import { LocalStore } from '@/utils/comm';
 import { TOKEN_KEY } from '@/utils/variable';
-import Live from '../Live/index.vue';
+import ShareLive from '../Live/shareLive.vue';
 
 const playData = ref({
     deviceId: '',
     channelId: '',
-    type: ''
+    type: '',
+    id:''
 });
 
 // 获取url信息
@@ -21,7 +22,8 @@ watchEffect(() => {
     playData.value = {
         deviceId: obj?.deviceId || '',
         channelId: obj?.channelId || '',
-        type: obj?.type
+        type: obj?.type,
+        id:obj.id || ''
     };
     if(obj?.[TOKEN_KEY]){
         LocalStore.set(TOKEN_KEY, obj?.[TOKEN_KEY]);

src/views/media/Device/Save/index.vue

@@ -310,6 +310,7 @@ import DeviceApi from '@/api/media/device';
 import { PROVIDER_OPTIONS } from '@/views/media/Device/const';
 import type { ProductType } from '@/views/media/Device/typings';
 import SaveProduct from './SaveProduct.vue';
+import { notification } from 'jetlinks-ui-components';
 
 const router = useRouter();
 const route = useRoute();
@@ -425,13 +426,18 @@ const handleSubmit = () => {
     formRef.value
         ?.validate()
         .then(async () => {
-            btnLoading.value = true;
+            const resq:any = await DeviceApi.validateId(id)
-            const res = !route.query.id
+            if(resq.status === 200 && resq?.result?.passed){
-                ? await DeviceApi.save(params)
+                btnLoading.value = true;
-                : await DeviceApi.update(params);
+                const res = !route.query.id
-            if (res?.success) {
+                    ? await DeviceApi.save(params)
-                onlyMessage('保存成功');
+                    : await DeviceApi.update(params);
-                history.back();
+                if (res?.success) {
+                    onlyMessage('保存成功');
+                    history.back();
+                }
+            }else{
+                notification.error({ key: 'error', message: '设备ID已重复'})
             }
         })
         .catch((err: any) => {

src/views/system/Department/components/AddDeviceOrProductDialog.vue

@@ -42,7 +42,7 @@
                     :columns="searchColumns"
                     target="category-bind-modal"
                     @search="search"
-                    style="width: 75%;"
+                    style="width: 75%; margin-bottom: 0;"
                 />
             </template>
             <template #card="slotProps">

src/views/system/Menu/Setting/index.vue

@@ -81,6 +81,7 @@ import { cloneDeep } from 'lodash';
 import { onlyMessage } from '@/utils/comm';
 import {
     USER_CENTER_MENU_CODE,
+    messageSubscribe
 } from '@/utils/consts';
 import { protocolList } from '@/utils/consts';
 import { getProviders } from '@/api/data-collect/channel';
@@ -201,7 +202,7 @@ const onDragend = (info: AntTreeNodeDropEvent) => {
 onMounted(() => {
     getSystemPermission_api().then((resp: any) => {
         const filterBaseMenu = BaseMenu.filter(item => ![
-          USER_CENTER_MENU_CODE,
+          USER_CENTER_MENU_CODE,messageSubscribe
         ].includes(item.code))
         baseMenu.value = filterMenu(
             resp.result.map((item: any) => JSON.parse(item).id),
@@ -212,7 +213,7 @@ onMounted(() => {
                 systemMenu.value = resp.result?.filter(
                     (item: { code: string }) =>
                         ![
-                            USER_CENTER_MENU_CODE
+                            USER_CENTER_MENU_CODE,messageSubscribe
                         ].includes(item.code),
                 );
                 //初始化菜单
@@ -221,12 +222,12 @@ onMounted(() => {
                 selectedKeys.value = systemMenuData.checkedKeys;
 
                 const AllMenu = filterMenus(mergeArr(
-                    cloneDeep(filterBaseMenu),
+                    cloneDeep(baseMenu.value),
                     cloneDeep(systemMenu.value),
                 ))
                 console.log(AllMenu);
                 // 处理排序
-                treeData.value = handleSortsArr(AllMenu);
+                treeData.value = handleSortsArr(systemMenu.value);
             }
         });
     });

src/views/system/Menu/index.vue

@@ -83,7 +83,7 @@ import PermissionButton from '@/components/PermissionButton/index.vue';
 import { getMenuTree_api, delMenuInfo_api } from '@/api/system/menu';
 import dayjs from 'dayjs';
 import { useUserInfo } from '@/store/userInfo';
-import { USER_CENTER_MENU_CODE } from '@/utils/consts'
+import { USER_CENTER_MENU_CODE,messageSubscribe } from '@/utils/consts'
 import { storeToRefs } from 'pinia';
 import { onlyMessage } from '@/utils/comm';
 
@@ -212,7 +212,7 @@ const table = reactive({
         return {
             code: resp.message,
             result: {
-                data: resp.result?.filter((item: { code: string }) => ![USER_CENTER_MENU_CODE].includes(item.code)),
+                data: resp.result?.filter((item: { code: string }) => ![USER_CENTER_MENU_CODE,messageSubscribe].includes(item.code)),
                 pageIndex: resp.pageIndex,
                 pageSize: resp.pageSize,
                 total: resp.total,

src/views/user/Login/index.vue

@@ -178,6 +178,7 @@ import { LocalStore } from '@/utils/comm';
 import { BASE_API_PATH, TOKEN_KEY, Version_Code } from '@/utils/variable';
 import { SystemConst } from '@/utils/consts';
 import {encrypt} from '@/utils/encrypt'
+import { closeWs } from '@/utils/websocket'
 
 const store = useUserInfo();
 const systemStore = useSystem();
@@ -382,6 +383,7 @@ getOpen();
 getCode();
 screenRotation(screenWidth.value, screenHeight.value);
 
+closeWs()
 onMounted(()=>{
     getRsa()
 })