From 8972c003baaf282e5d21c7646f5f98632e132b0e Mon Sep 17 00:00:00 2001
From: jackhoo_98 <jackhoo_98@foxmail.com>
Date: Wed, 1 Mar 2023 10:58:19 +0800
Subject: [PATCH 1/7] =?UTF-8?q?feat:=20=E5=8D=8F=E8=AE=AE=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=20=E5=8A=A0=E5=85=A5=E6=9D=83=E9=99=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/link/protocol.ts                     |   8 +-
 src/views/device/Firmware/Task/index.vue     |   2 +-
 src/views/link/AccessConfig/Detail/index.vue |  12 +-
 src/views/link/Protocol/Save/index.vue       |  18 ++-
 src/views/link/Protocol/index.vue            | 115 ++++++++-----------
 5 files changed, 76 insertions(+), 79 deletions(-)

diff --git a/src/api/link/protocol.ts b/src/api/link/protocol.ts
index b77a782a..c0b3b35d 100644
--- a/src/api/link/protocol.ts
+++ b/src/api/link/protocol.ts
@@ -3,15 +3,13 @@ import { BASE_API_PATH } from '@/utils/variable';
 
 export const PROTOCOL_UPLOAD = `${BASE_API_PATH}/file/upload`;
 
-export const detail = (id: string) => server.get(`/gateway/device/${id}`);
+export const save = (data: Object) => server.post(`/protocol`, data);
 
-export const save = (data: Object) => server.post(`/gateway/device`, data);
-
-export const update = (data: Object) => server.patch(`/gateway/device`, data);
+export const update = (data: Object) => server.patch(`/protocol`, data);
 
 export const list = (data: Object) => server.post(`/protocol/_query`, data);
 
-export const remove = (id: string) => server.remove(`/gateway/device/${id}`);
+export const remove = (id: string) => server.remove(`/protocol/${id}`);
 
 export const querySystemApi = (data: Object) =>
     server.post(`/system/config/scopes`, data);
diff --git a/src/views/device/Firmware/Task/index.vue b/src/views/device/Firmware/Task/index.vue
index 42e65021..b9cff6fc 100644
--- a/src/views/device/Firmware/Task/index.vue
+++ b/src/views/device/Firmware/Task/index.vue
@@ -225,7 +225,7 @@ const handlEye = (data: object) => {
 };
 
 const handlDetails = (id: string) => {
-    // menuStory.jumpPage('device/Firmware/Task/Detail', { id });
+    menuStory.jumpPage('device/Firmware/Task/Detail', { id });
 };
 const saveChange = (value: boolean) => {
     visible.value = false;
diff --git a/src/views/link/AccessConfig/Detail/index.vue b/src/views/link/AccessConfig/Detail/index.vue
index 1c8ee150..a4554e90 100644
--- a/src/views/link/AccessConfig/Detail/index.vue
+++ b/src/views/link/AccessConfig/Detail/index.vue
@@ -98,7 +98,13 @@ const getTypeList = (result: Record<string, any>) => {
             edge.push(item);
         } else {
             item.type = 'network';
-            network.push(item);
+            // network.push(item);
+            /**
+             * 插件设备接入 暂时不开发 todo
+             */
+            if (item.id !== 'plugin_gateway' || item.name !== '插件设备接入') {
+                network.push(item);
+            }
         }
     });
 
@@ -135,6 +141,10 @@ const queryProviders = async () => {
     const resp = await getProviders();
     if (resp.status === 200) {
         dataSource.value = getTypeList(resp.result);
+        // dataSource.value = getTypeList(resp.result)[0].list.filter(
+        //     (item) => item.name !== '插件设备接入',
+        // );
+        console.log(111, dataSource.value);
     }
 };
 
diff --git a/src/views/link/Protocol/Save/index.vue b/src/views/link/Protocol/Save/index.vue
index d4ad2ccb..1d73657d 100644
--- a/src/views/link/Protocol/Save/index.vue
+++ b/src/views/link/Protocol/Save/index.vue
@@ -1,13 +1,9 @@
 <template lang="">
     <a-modal
         :title="data.id ? '编辑' : '新增'"
-        ok-text="确认"
-        cancel-text="取消"
         :visible="true"
         width="700px"
-        :confirm-loading="loading"
         @cancel="handleCancel"
-        @ok="handleOk"
     >
         <a-form
             class="form"
@@ -55,6 +51,19 @@
                 />
             </a-form-item>
         </a-form>
+        <template #footer>
+            <a-button key="back" @click="handleCancel">取消</a-button>
+            <PermissionButton
+                key="submit"
+                type="primary"
+                :loading="loading"
+                @click="handleOk"
+                style="margin-left: 8px"
+                :hasPermission="`link/Protocol:${id ? 'update' : 'add'}`"
+            >
+                确认
+            </PermissionButton>
+        </template>
     </a-modal>
 </template>
 <script lang="ts" setup>
@@ -124,7 +133,6 @@ const onSubmit = () => {
                 ? await save(params)
                 : await update({ ...props.data, ...params });
             if (response.status === 200) {
-                message.success('操作成功');
                 emit('change', true);
             }
             loading.value = false;
diff --git a/src/views/link/Protocol/index.vue b/src/views/link/Protocol/index.vue
index 6a772dcb..2b84eb32 100644
--- a/src/views/link/Protocol/index.vue
+++ b/src/views/link/Protocol/index.vue
@@ -13,9 +13,14 @@
                 :params="params"
             >
                 <template #headerTitle>
-                    <a-button type="primary" @click="handlAdd"
-                        ><AIcon type="PlusOutlined" />新增</a-button
+                    <PermissionButton
+                        type="primary"
+                        @click="handlAdd"
+                        hasPermission="link/Protocol:add"
                     >
+                        <template #icon><AIcon type="PlusOutlined" /></template>
+                        新增
+                    </PermissionButton>
                 </template>
                 <template #card="slotProps">
                     <CardBox
@@ -31,11 +36,16 @@
                         </template>
                         <template #content>
                             <div class="card-item-content">
-                                <h3
-                                    class="card-item-content-title card-item-content-title-a"
-                                >
-                                    {{ slotProps.name }}
-                                </h3>
+                                <a-tooltip>
+                                    <template #title>
+                                        {{ slotProps.name }}
+                                    </template>
+                                    <h3
+                                        class="card-item-content-title card-item-content-title-a"
+                                    >
+                                        {{ slotProps.name }}
+                                    </h3>
+                                </a-tooltip>
                                 <a-row class="card-item-content-box">
                                     <a-col
                                         :span="12"
@@ -70,78 +80,49 @@
                             </div>
                         </template>
                         <template #actions="item">
-                            <a-tooltip
-                                v-bind="item.tooltip"
-                                :title="item.disabled && item.tooltip.title"
+                            <PermissionButton
+                                :disabled="item.disabled"
+                                :popConfirm="item.popConfirm"
+                                :tooltip="{
+                                    ...item.tooltip,
+                                }"
+                                @click="item.onClick"
+                                :hasPermission="'link/Protocol:' + item.key"
                             >
-                                <a-popconfirm
-                                    v-if="item.popConfirm"
-                                    v-bind="item.popConfirm"
-                                    :disabled="item.disabled"
-                                >
-                                    <a-button :disabled="item.disabled">
-                                        <AIcon
-                                            type="DeleteOutlined"
-                                            v-if="item.key === 'delete'"
-                                        />
-                                        <template v-else>
-                                            <AIcon :type="item.icon" />
-                                            <span>{{ item.text }}</span>
-                                        </template>
-                                    </a-button>
-                                </a-popconfirm>
+                                <AIcon
+                                    type="DeleteOutlined"
+                                    v-if="item.key === 'delete'"
+                                />
                                 <template v-else>
-                                    <a-button
-                                        :disabled="item.disabled"
-                                        @click="item.onClick"
-                                    >
-                                        <AIcon
-                                            type="DeleteOutlined"
-                                            v-if="item.key === 'delete'"
-                                        />
-                                        <template v-else>
-                                            <AIcon :type="item.icon" />
-                                            <span>{{ item.text }}</span>
-                                        </template>
-                                    </a-button>
+                                    <AIcon :type="item.icon" />
+                                    <span>{{ item?.text }}</span>
                                 </template>
-                            </a-tooltip>
+                            </PermissionButton>
                         </template>
                     </CardBox>
                 </template>
                 <template #action="slotProps">
-                    <a-space :size="16">
-                        <a-tooltip
+                    <a-space>
+                        <template
                             v-for="i in getActions(slotProps, 'table')"
                             :key="i.key"
-                            v-bind="i.tooltip"
                         >
-                            <a-popconfirm
-                                v-if="i.popConfirm"
-                                v-bind="i.popConfirm"
+                            <PermissionButton
                                 :disabled="i.disabled"
-                            >
-                                <a-button
-                                    :disabled="i.disabled"
-                                    style="padding: 0"
-                                    type="link"
-                                    ><AIcon :type="i.icon"
-                                /></a-button>
-                            </a-popconfirm>
-                            <a-button
-                                style="padding: 0"
+                                :popConfirm="i.popConfirm"
+                                :tooltip="{
+                                    ...i.tooltip,
+                                }"
+                                style="padding: 0px"
+                                @click="i.onClick"
                                 type="link"
-                                v-else
-                                @click="i.onClick && i.onClick(slotProps)"
+                                :hasPermission="'link/Protocol:' + i.key"
                             >
-                                <a-button
-                                    :disabled="i.disabled"
-                                    style="padding: 0"
-                                    type="link"
+                                <template #icon
                                     ><AIcon :type="i.icon"
-                                /></a-button>
-                            </a-button>
-                        </a-tooltip>
+                                /></template>
+                            </PermissionButton>
+                        </template>
                     </a-space>
                 </template>
             </JTable>
@@ -173,7 +154,6 @@ const columns = [
         },
         width: 200,
         fixed: 'left',
-        // scopedSlots: true,
     },
     {
         title: '名称',
@@ -182,6 +162,7 @@ const columns = [
         search: {
             type: 'string',
         },
+        ellipsis: true,
     },
     {
         title: '类型',
@@ -227,7 +208,7 @@ const getActions = (
     if (!data) return [];
     const actions = [
         {
-            key: 'edit',
+            key: 'update',
             text: '编辑',
             tooltip: {
                 title: '编辑',

From ec89aaae888a7fd8d090e4b468fe7f50d997b657 Mon Sep 17 00:00:00 2001
From: jackhoo_98 <jackhoo_98@foxmail.com>
Date: Wed, 1 Mar 2023 11:37:26 +0800
Subject: [PATCH 2/7] =?UTF-8?q?feat:=20=E8=AF=81=E4=B9=A6=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=20=E5=8A=A0=E5=85=A5=E6=9D=83=E9=99=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/Log/Access/index.vue       |  2 +-
 src/views/link/Certificate/index.vue | 74 +++++++++++++---------------
 2 files changed, 34 insertions(+), 42 deletions(-)

diff --git a/src/views/Log/Access/index.vue b/src/views/Log/Access/index.vue
index 48679537..d8d80a1a 100644
--- a/src/views/Log/Access/index.vue
+++ b/src/views/Log/Access/index.vue
@@ -144,7 +144,7 @@ const columns = [
         search: {
             type: 'string',
         },
-        // width: 200,
+        ellipsis: true,
     },
     {
         title: '请求方法',
diff --git a/src/views/link/Certificate/index.vue b/src/views/link/Certificate/index.vue
index e4474b35..00d723de 100644
--- a/src/views/link/Certificate/index.vue
+++ b/src/views/link/Certificate/index.vue
@@ -13,45 +13,40 @@
                 :params="params"
             >
                 <template #headerTitle>
-                    <a-button type="primary" @click="handlAdd"
-                        ><AIcon type="PlusOutlined" />新增</a-button
+                    <PermissionButton
+                        type="primary"
+                        @click="handlAdd"
+                        hasPermission="link/Certificate:add"
                     >
+                        <template #icon><AIcon type="PlusOutlined" /></template>
+                        新增
+                    </PermissionButton>
                 </template>
                 <template #type="slotProps">
                     <span>{{ slotProps.type.text }}</span>
                 </template>
                 <template #action="slotProps">
-                    <a-space :size="16">
-                        <a-tooltip
+                    <a-space>
+                        <template
                             v-for="i in getActions(slotProps)"
                             :key="i.key"
-                            v-bind="i.tooltip"
                         >
-                            <a-popconfirm
-                                v-if="i.popConfirm"
-                                v-bind="i.popConfirm"
-                            >
-                                <a-button
-                                    :disabled="i.disabled"
-                                    style="padding: 0"
-                                    type="link"
-                                    ><AIcon :type="i.icon"
-                                /></a-button>
-                            </a-popconfirm>
-                            <a-button
-                                style="padding: 0"
+                            <PermissionButton
+                                :disabled="i.disabled"
+                                :popConfirm="i.popConfirm"
+                                :tooltip="{
+                                    ...i.tooltip,
+                                }"
+                                style="padding: 0px"
+                                @click="i.onClick"
                                 type="link"
-                                v-else
-                                @click="i.onClick && i.onClick(slotProps)"
+                                :hasPermission="'link/Certificate:' + i.key"
                             >
-                                <a-button
-                                    :disabled="i.disabled"
-                                    style="padding: 0"
-                                    type="link"
+                                <template #icon
                                     ><AIcon :type="i.icon"
-                                /></a-button>
-                            </a-button>
-                        </a-tooltip>
+                                /></template>
+                            </PermissionButton>
+                        </template>
                     </a-space>
                 </template>
             </JTable>
@@ -62,7 +57,9 @@
 import type { ActionsType } from '@/components/Table/index';
 import { query, remove } from '@/api/link/certificate';
 import { message } from 'ant-design-vue';
+import { useMenuStore } from 'store/menu';
 
+const menuStory = useMenuStore();
 const tableRef = ref<Record<string, any>>({});
 const router = useRouter();
 const params = ref<Record<string, any>>({});
@@ -119,7 +116,7 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
     }
     return [
         {
-            key: 'eye',
+            key: 'view',
             text: '查看',
             tooltip: {
                 title: '查看',
@@ -130,7 +127,7 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
             },
         },
         {
-            key: 'edit',
+            key: 'update',
             text: '编辑',
             tooltip: {
                 title: '编辑',
@@ -157,24 +154,19 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
 };
 
 const handlAdd = () => {
-    router.push({
-        path: `/iot/link/certificate/detail/:id`,
-        query: { view: false },
-    });
+    menuStory.jumpPage(
+        `link/Certificate/Detail`,
+        { id: ':id' },
+        { view: false },
+    );
 };
 
 const handlEye = (id: string) => {
-    router.push({
-        path: `/iot/link/certificate/detail/${id}`,
-        query: { view: true },
-    });
+    menuStory.jumpPage(`link/Certificate/Detail`, { id }, { view: true });
 };
 
 const handlEdit = (id: string) => {
-    router.push({
-        path: `/iot/link/certificate/detail/${id}`,
-        query: { view: false },
-    });
+    menuStory.jumpPage(`link/Certificate/Detail`, { id }, { view: false });
 };
 
 const handlDelete = async (id: string) => {

From d3e45d78bbc769629581fb4e7ec79e620bf2e62e Mon Sep 17 00:00:00 2001
From: jackhoo_98 <jackhoo_98@foxmail.com>
Date: Wed, 1 Mar 2023 14:49:52 +0800
Subject: [PATCH 3/7] =?UTF-8?q?feat:=20=E6=B5=81=E5=AA=92=E4=BD=93?=
 =?UTF-8?q?=E6=9C=8D=E5=8A=A1=20=E5=8A=A0=E5=85=A5=E6=9D=83=E9=99=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/link/AccessConfig/index.vue   |  2 +-
 src/views/link/Certificate/index.vue    |  1 -
 src/views/media/Stream/Detail/index.vue |  7 +-
 src/views/media/Stream/index.vue        | 85 ++++++++++---------------
 4 files changed, 36 insertions(+), 59 deletions(-)

diff --git a/src/views/link/AccessConfig/index.vue b/src/views/link/AccessConfig/index.vue
index b6c35571..0f75d961 100644
--- a/src/views/link/AccessConfig/index.vue
+++ b/src/views/link/AccessConfig/index.vue
@@ -12,7 +12,7 @@
                     sorts: [{ name: 'createTime', order: 'desc' }],
                 }"
                 gridColumn="2"
-                gridColumns="[2]"
+                :gridColumns="[1, 2]"
                 :params="params"
             >
                 <template #headerTitle>
diff --git a/src/views/link/Certificate/index.vue b/src/views/link/Certificate/index.vue
index 00d723de..be381425 100644
--- a/src/views/link/Certificate/index.vue
+++ b/src/views/link/Certificate/index.vue
@@ -61,7 +61,6 @@ import { useMenuStore } from 'store/menu';
 
 const menuStory = useMenuStore();
 const tableRef = ref<Record<string, any>>({});
-const router = useRouter();
 const params = ref<Record<string, any>>({});
 
 const columns = [
diff --git a/src/views/media/Stream/Detail/index.vue b/src/views/media/Stream/Detail/index.vue
index b7761594..94d41983 100644
--- a/src/views/media/Stream/Detail/index.vue
+++ b/src/views/media/Stream/Detail/index.vue
@@ -88,7 +88,7 @@
                                     <template #title>
                                         <p>调用流媒体接口时请求的服务地址</p>
                                     </template>
-                                    <question-circle-outlined />
+                                    <AIcon type="QuestionCircleOutlined" />
                                 </a-tooltip>
                             </div>
 
@@ -144,7 +144,7 @@
                                             视频设备将流推送到该IP地址下，部分设备仅支持IP地址，建议全是用IP地址
                                         </p>
                                     </template>
-                                    <question-circle-outlined />
+                                    <AIcon type="QuestionCircleOutlined" />
                                 </a-tooltip>
                             </div>
 
@@ -266,10 +266,9 @@
 </template>
 
 <script lang="ts" setup name="StreamDetail">
-import { message, Form } from 'ant-design-vue';
+import { message } from 'ant-design-vue';
 import { queryProviders, queryDetail, save, update } from '@/api/media/stream';
 import type { FormInstance } from 'ant-design-vue';
-import { QuestionCircleOutlined } from '@ant-design/icons-vue';
 
 import { FormDataType } from '../type';
 
diff --git a/src/views/media/Stream/index.vue b/src/views/media/Stream/index.vue
index 46e1e797..1ff8dd96 100644
--- a/src/views/media/Stream/index.vue
+++ b/src/views/media/Stream/index.vue
@@ -16,9 +16,14 @@
                 :params="params"
             >
                 <template #headerTitle>
-                    <a-button type="primary" @click="handlAdd"
-                        ><plus-outlined />新增</a-button
+                    <PermissionButton
+                        type="primary"
+                        @click="handlAdd"
+                        hasPermission="media/Stream:add"
                     >
+                        <template #icon><AIcon type="PlusOutlined" /></template>
+                        新增
+                    </PermissionButton>
                 </template>
                 <template #card="slotProps">
                     <CardBox
@@ -106,42 +111,24 @@
                             </div>
                         </template>
                         <template #actions="item">
-                            <a-tooltip
-                                v-bind="item.tooltip"
-                                :title="item.disabled && item.tooltip.title"
+                            <PermissionButton
+                                :disabled="item.disabled"
+                                :popConfirm="item.popConfirm"
+                                :tooltip="{
+                                    ...item.tooltip,
+                                }"
+                                @click="item.onClick"
+                                :hasPermission="'media/Stream:' + item.key"
                             >
-                                <a-popconfirm
-                                    v-if="item.popConfirm"
-                                    v-bind="item.popConfirm"
-                                    :disabled="item.disabled"
-                                >
-                                    <a-button :disabled="item.disabled">
-                                        <AIcon
-                                            type="DeleteOutlined"
-                                            v-if="item.key === 'delete'"
-                                        />
-                                        <template v-else>
-                                            <AIcon :type="item.icon" />
-                                            <span>{{ item.text }}</span>
-                                        </template>
-                                    </a-button>
-                                </a-popconfirm>
+                                <AIcon
+                                    type="DeleteOutlined"
+                                    v-if="item.key === 'delete'"
+                                />
                                 <template v-else>
-                                    <a-button
-                                        :disabled="item.disabled"
-                                        @click="item.onClick"
-                                    >
-                                        <AIcon
-                                            type="DeleteOutlined"
-                                            v-if="item.key === 'delete'"
-                                        />
-                                        <template v-else>
-                                            <AIcon :type="item.icon" />
-                                            <span>{{ item.text }}</span>
-                                        </template>
-                                    </a-button>
+                                    <AIcon :type="item.icon" />
+                                    <span>{{ item?.text }}</span>
                                 </template>
-                            </a-tooltip>
+                            </PermissionButton>
                         </template>
                     </CardBox>
                 </template>
@@ -154,10 +141,10 @@ import type { ActionsType } from '@/components/Table/index.vue';
 import { getImage } from '@/utils/comm';
 import { query, remove, disable, enalbe } from '@/api/media/stream';
 import { message } from 'ant-design-vue';
-import Detail from './Detail/index.vue';
+import { useMenuStore } from 'store/menu';
 
+const menuStory = useMenuStore();
 const tableRef = ref<Record<string, any>>({});
-const router = useRouter();
 const params = ref<Record<string, any>>({});
 
 const columns = [
@@ -194,9 +181,10 @@ const columns = [
 const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
     if (!data) return [];
     const state = data.state.value;
+    const stateText = state === 'enabled' ? '禁用' : '启用';
     const actions = [
         {
-            key: 'edit',
+            key: 'update',
             text: '编辑',
             tooltip: {
                 title: '编辑',
@@ -208,13 +196,13 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
         },
         {
             key: 'action',
-            text: state === 'enabled' ? '禁用' : '启用',
+            text: stateText,
             tooltip: {
-                title: state === 'enabled' ? '禁用' : '启用',
+                title: stateText,
             },
             icon: state === 'enabled' ? 'StopOutlined' : 'CheckCircleOutlined',
             popConfirm: {
-                title: `确认${state === 'enabled' ? '禁用' : '启用'}?`,
+                title: `确认${stateText}?`,
                 onConfirm: async () => {
                     let res =
                         state === 'enabled'
@@ -255,22 +243,13 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
 };
 
 const handlAdd = () => {
-    router.push({
-        path: `/iot/link/Stream/detail/:id`,
-        query: { view: false },
-    });
+    menuStory.jumpPage(`media/Stream/Detail`, { id: ':id' }, { view: false });
 };
 const handlEdit = (id: string) => {
-    router.push({
-        path: `/iot/link/Stream/detail/${id}`,
-        query: { view: false },
-    });
+    menuStory.jumpPage(`media/Stream/Detail`, { id }, { view: false });
 };
 const handlEye = (id: string) => {
-    router.push({
-        path: `/iot/link/Stream/detail/${id}`,
-        query: { view: true },
-    });
+    menuStory.jumpPage(`media/Stream/Detail`, { id }, { view: true });
 };
 
 /**

From 716387150adb6f553b378c746bad95197376b76f Mon Sep 17 00:00:00 2001
From: jackhoo_98 <jackhoo_98@foxmail.com>
Date: Wed, 1 Mar 2023 15:45:49 +0800
Subject: [PATCH 4/7] =?UTF-8?q?feat:=20=E7=BD=91=E7=BB=9C=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=20=E5=8A=A0=E5=85=A5=E6=9D=83=E9=99=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/link/Type/Detail/index.vue |  46 ++++----
 src/views/link/Type/data.ts          |  10 ++
 src/views/link/Type/index.vue        | 152 ++++++++++-----------------
 3 files changed, 93 insertions(+), 115 deletions(-)

diff --git a/src/views/link/Type/Detail/index.vue b/src/views/link/Type/Detail/index.vue
index c56ded01..48f32450 100644
--- a/src/views/link/Type/Detail/index.vue
+++ b/src/views/link/Type/Detail/index.vue
@@ -56,10 +56,9 @@
                                                 独立配置:集群下不同节点使用不同配置
                                             </p>
                                         </template>
-                                        <question-circle-outlined />
+                                        <AIcon type="QuestionCircleOutlined" />
                                     </a-tooltip>
                                 </div>
-
                                 <a-radio-group
                                     v-model:value="formData.shareCluster"
                                     button-style="solid"
@@ -101,8 +100,9 @@
                                     :header="`#${index + 1}.节点`"
                                 >
                                     <template #extra v-if="!shareCluster">
-                                        <delete-outlined
+                                        <AIcon
                                             @click="removeCluster(cluster)"
+                                            type="DeleteOutlined"
                                         />
                                     </template>
                                     <a-row :gutter="[24, 0]">
@@ -171,7 +171,9 @@
                                                                 绑定到服务器上的网卡地址,绑定到所有网卡:0.0.0.0
                                                             </p>
                                                         </template>
-                                                        <question-circle-outlined />
+                                                        <AIcon
+                                                            type="QuestionCircleOutlined"
+                                                        />
                                                     </a-tooltip>
                                                 </div>
 
@@ -230,7 +232,9 @@
                                                                 监听指定端口的请求
                                                             </p>
                                                         </template>
-                                                        <question-circle-outlined />
+                                                        <AIcon
+                                                            type="QuestionCircleOutlined"
+                                                        />
                                                     </a-tooltip>
                                                 </div>
                                                 <a-select
@@ -281,7 +285,9 @@
                                                                 对外提供访问的地址,内网环境时填写服务器的内网IP地址
                                                             </p>
                                                         </template>
-                                                        <question-circle-outlined />
+                                                        <AIcon
+                                                            type="QuestionCircleOutlined"
+                                                        />
                                                     </a-tooltip>
                                                 </div>
                                                 <a-input
@@ -324,7 +330,9 @@
                                                                 对外提供访问的端口
                                                             </p>
                                                         </template>
-                                                        <question-circle-outlined />
+                                                        <AIcon
+                                                            type="QuestionCircleOutlined"
+                                                        />
                                                     </a-tooltip>
                                                 </div>
 
@@ -517,7 +525,9 @@
                                                                 当连接的服务为EMQ时,可能需要使用共享的订阅前缀,如:$queue或$share
                                                             </p>
                                                         </template>
-                                                        <question-circle-outlined />
+                                                        <AIcon
+                                                            type="QuestionCircleOutlined"
+                                                        />
                                                     </a-tooltip>
                                                 </div>
                                                 <a-input
@@ -560,7 +570,9 @@
                                                                 单次收发消息的最大长度,单位:字节;设置过大可能会影响性能
                                                             </p>
                                                         </template>
-                                                        <question-circle-outlined />
+                                                        <AIcon
+                                                            type="QuestionCircleOutlined"
+                                                        />
                                                     </a-tooltip>
                                                 </div>
                                                 <a-input-number
@@ -691,7 +703,9 @@
                                                                 处理TCP粘拆包的方式
                                                             </p>
                                                         </template>
-                                                        <question-circle-outlined />
+                                                        <AIcon
+                                                            type="QuestionCircleOutlined"
+                                                        />
                                                     </a-tooltip>
                                                 </div>
                                                 <a-select
@@ -966,7 +980,7 @@
                         </div>
                         <a-form-item v-if="!shareCluster">
                             <a-button type="dashed" block @click="addCluster">
-                                <PlusOutlined />
+                                <AIcon type="PlusOutlined" />
                                 新增
                             </a-button>
                         </a-form-item>
@@ -986,14 +1000,15 @@
                 </a-form>
             </div>
             <div class="footer">
-                <a-button
+                <PermissionButton
                     v-if="view === 'false'"
                     type="primary"
                     @click="saveData"
                     :loading="loading"
+                    :hasPermission="`link/Type:${id ? 'update' : 'add'}`"
                 >
                     保存
-                </a-button>
+                </PermissionButton>
             </div>
         </a-card>
     </page-container>
@@ -1002,11 +1017,6 @@
 <script lang="ts" setup name="AccessNetwork">
 import { message } from 'ant-design-vue';
 import type { FormInstance } from 'ant-design-vue';
-import {
-    DeleteOutlined,
-    PlusOutlined,
-    QuestionCircleOutlined,
-} from '@ant-design/icons-vue';
 import {
     update,
     save,
diff --git a/src/views/link/Type/data.ts b/src/views/link/Type/data.ts
index e0fe7816..3d3df67b 100644
--- a/src/views/link/Type/data.ts
+++ b/src/views/link/Type/data.ts
@@ -301,3 +301,13 @@ export const Rules = {
         },
     ],
 };
+
+export const TiTlePermissionButtonStyle = {
+    padding: 0,
+    color: ' #1890ff !important',
+    'font-weight': 700,
+    'font-size': '16px',
+    overflow: 'hidden',
+    'text-overflow': 'ellipsis',
+    'white-space': 'nowrap',
+};
diff --git a/src/views/link/Type/index.vue b/src/views/link/Type/index.vue
index 9fff29a0..b8f89f3c 100644
--- a/src/views/link/Type/index.vue
+++ b/src/views/link/Type/index.vue
@@ -14,9 +14,14 @@
                 :params="params"
             >
                 <template #headerTitle>
-                    <a-button type="primary" @click="handlAdd"
-                        ><AIcon type="PlusOutlined" />新增</a-button
+                    <PermissionButton
+                        type="primary"
+                        @click="handlAdd"
+                        hasPermission="link/Type:add"
                     >
+                        <template #icon><AIcon type="PlusOutlined" /></template>
+                        新增
+                    </PermissionButton>
                 </template>
                 <template #card="slotProps">
                     <CardBox
@@ -43,18 +48,14 @@
                         </template>
                         <template #content>
                             <div class="card-item-content">
-                                <!-- <a
+                                <PermissionButton
+                                    type="link"
                                     @click="handlEye(slotProps.id)"
-                                    class="card-item-content-title-a"
+                                    hasPermission="link/Type:view"
+                                    :style="TiTlePermissionButtonStyle"
                                 >
                                     {{ slotProps.name }}
-                                </a> -->
-                                <h3
-                                    @click="handlEye(slotProps.id)"
-                                    class="card-item-content-title card-item-content-title-a"
-                                >
-                                    {{ slotProps.name }}
-                                </h3>
+                                </PermissionButton>
                                 <a-row class="card-item-content-box">
                                     <a-col :span="12">
                                         <div class="card-item-content-text">
@@ -88,78 +89,49 @@
                             </div>
                         </template>
                         <template #actions="item">
-                            <a-tooltip
-                                v-bind="item.tooltip"
-                                :title="item.disabled && item.tooltip.title"
+                            <PermissionButton
+                                :disabled="item.disabled"
+                                :popConfirm="item.popConfirm"
+                                :tooltip="{
+                                    ...item.tooltip,
+                                }"
+                                @click="item.onClick"
+                                :hasPermission="'link/Type:' + item.key"
                             >
-                                <a-popconfirm
-                                    v-if="item.popConfirm"
-                                    v-bind="item.popConfirm"
-                                    :disabled="item.disabled"
-                                >
-                                    <a-button :disabled="item.disabled">
-                                        <AIcon
-                                            type="DeleteOutlined"
-                                            v-if="item.key === 'delete'"
-                                        />
-                                        <template v-else>
-                                            <AIcon :type="item.icon" />
-                                            <span>{{ item.text }}</span>
-                                        </template>
-                                    </a-button>
-                                </a-popconfirm>
+                                <AIcon
+                                    type="DeleteOutlined"
+                                    v-if="item.key === 'delete'"
+                                />
                                 <template v-else>
-                                    <a-button
-                                        :disabled="item.disabled"
-                                        @click="item.onClick"
-                                    >
-                                        <AIcon
-                                            type="DeleteOutlined"
-                                            v-if="item.key === 'delete'"
-                                        />
-                                        <template v-else>
-                                            <AIcon :type="item.icon" />
-                                            <span>{{ item.text }}</span>
-                                        </template>
-                                    </a-button>
+                                    <AIcon :type="item.icon" />
+                                    <span>{{ item?.text }}</span>
                                 </template>
-                            </a-tooltip>
+                            </PermissionButton>
                         </template>
                     </CardBox>
                 </template>
                 <template #action="slotProps">
-                    <a-space :size="16">
-                        <a-tooltip
+                    <a-space>
+                        <template
                             v-for="i in getActions(slotProps, 'table')"
                             :key="i.key"
-                            v-bind="i.tooltip"
                         >
-                            <a-popconfirm
-                                v-if="i.popConfirm"
-                                v-bind="i.popConfirm"
+                            <PermissionButton
                                 :disabled="i.disabled"
-                            >
-                                <a-button
-                                    :disabled="i.disabled"
-                                    style="padding: 0"
-                                    type="link"
-                                    ><AIcon :type="i.icon"
-                                /></a-button>
-                            </a-popconfirm>
-                            <a-button
-                                style="padding: 0"
+                                :popConfirm="i.popConfirm"
+                                :tooltip="{
+                                    ...i.tooltip,
+                                }"
+                                style="padding: 0px"
+                                @click="i.onClick"
                                 type="link"
-                                v-else
-                                @click="i.onClick && i.onClick(slotProps)"
+                                :hasPermission="'link/Type:' + i.key"
                             >
-                                <a-button
-                                    :disabled="i.disabled"
-                                    style="padding: 0"
-                                    type="link"
+                                <template #icon
                                     ><AIcon :type="i.icon"
-                                /></a-button>
-                            </a-button>
-                        </a-tooltip>
+                                /></template>
+                            </PermissionButton>
+                        </template>
                     </a-space>
                 </template>
                 <template #state="slotProps">
@@ -186,13 +158,15 @@
     </page-container>
 </template>
 <script lang="ts" setup name="TypePage">
-import type { ActionsType } from '@/components/Table/index'
+import type { ActionsType } from '@/components/Table/index';
 import { getImage } from '@/utils/comm';
 import { supports, query, remove, start, shutdown } from '@/api/link/type';
 import { message } from 'ant-design-vue';
+import { TiTlePermissionButtonStyle } from './data';
+import { useMenuStore } from 'store/menu';
 
+const menuStory = useMenuStore();
 const tableRef = ref<Record<string, any>>({});
-const router = useRouter();
 const params = ref<Record<string, any>>({});
 const options = ref([]);
 
@@ -282,9 +256,10 @@ const getActions = (
 ): ActionsType[] => {
     if (!data) return [];
     const state = data.state.value;
+    const stateText = state === 'enabled' ? '禁用' : '启用';
     const actions = [
         {
-            key: 'eye',
+            key: 'view',
             text: '查看',
             tooltip: {
                 title: '查看',
@@ -295,7 +270,7 @@ const getActions = (
             },
         },
         {
-            key: 'edit',
+            key: 'update',
             text: '编辑',
             tooltip: {
                 title: '编辑',
@@ -307,13 +282,13 @@ const getActions = (
         },
         {
             key: 'action',
-            text: state === 'enabled' ? '禁用' : '启用',
+            text: stateText,
             tooltip: {
-                title: state === 'enabled' ? '禁用' : '启用',
+                title: stateText,
             },
             icon: state === 'enabled' ? 'StopOutlined' : 'CheckCircleOutlined',
             popConfirm: {
-                title: `确认${state === 'enabled' ? '禁用' : '启用'}?`,
+                title: `确认${stateText}?`,
                 onConfirm: async () => {
                     let res =
                         state === 'enabled'
@@ -353,36 +328,19 @@ const getActions = (
     ];
     return type === 'table'
         ? actions
-        : actions.filter((item) => item.key !== 'eye');
+        : actions.filter((item) => item.key !== 'view');
 };
 
 const handlAdd = () => {
-    router.push({
-        path: `/iot/link/type/detail/:id`,
-        query: { view: false },
-    });
+    menuStory.jumpPage(`link/Type/Detail`, { id: ':id' }, { view: false });
 };
 
 const handlEye = (id: string) => {
-    router.push({
-        path: `/iot/link/type/detail/${id}`,
-        query: { view: true },
-    });
+    menuStory.jumpPage(`link/Type/Detail`, { id }, { view: true });
 };
 
 const handlEdit = (id: string) => {
-    router.push({
-        path: `/iot/link/type/detail/${id}`,
-        query: { view: false },
-    });
-};
-
-const handlDelete = async (id: string) => {
-    const res = await remove(id);
-    if (res.success) {
-        message.success('操作成功');
-        tableRef.value.reload();
-    }
+    menuStory.jumpPage(`link/Type/Detail`, { id }, { view: false });
 };
 
 const getDetails = (slotProps: Partial<Record<string, any>>) => {

From 4e75bf94c6a2711ec5b666176081fbe5cd172857 Mon Sep 17 00:00:00 2001
From: jackhoo_98 <jackhoo_98@foxmail.com>
Date: Wed, 1 Mar 2023 17:08:18 +0800
Subject: [PATCH 5/7] =?UTF-8?q?feat:=20=E8=BF=9C=E7=A8=8B=E5=8D=87?=
 =?UTF-8?q?=E7=BA=A7=20=E5=8A=A0=E5=85=A5=E6=9D=83=E9=99=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../device/Firmware/Task/Detail/index.vue     | 81 +++++++++----------
 src/views/device/Firmware/Task/index.vue      |  9 ++-
 src/views/device/Firmware/index.vue           | 58 ++++++-------
 3 files changed, 70 insertions(+), 78 deletions(-)

diff --git a/src/views/device/Firmware/Task/Detail/index.vue b/src/views/device/Firmware/Task/Detail/index.vue
index dc4f4d29..ef8d17e4 100644
--- a/src/views/device/Firmware/Task/Detail/index.vue
+++ b/src/views/device/Firmware/Task/Detail/index.vue
@@ -17,19 +17,21 @@
                             </div>
 
                             <div class="state-title-right">
-                                <div>
-                                    <a-popconfirm
-                                        title="确定批量重试?"
-                                        ok-text="确定"
-                                        cancel-text="取消"
-                                        @confirm="confirm"
+                                <div class="state-button">
+                                    <PermissionButton
+                                        type="link"
                                         v-if="
                                             item.key === 'failed' &&
                                             stateInfo?.mode?.value === 'push'
                                         "
+                                        hasPermission="device/Firmware:update"
+                                        :popConfirm="{
+                                            title: `确定批量重试`,
+                                            onConfirm: confirm,
+                                        }"
                                     >
-                                        <a href="#">批量重试</a>
-                                    </a-popconfirm>
+                                        批量重试
+                                    </PermissionButton>
                                 </div>
 
                                 <div class="img">
@@ -85,37 +87,27 @@
                     <span>{{ slotProps.progress }}%</span>
                 </template>
                 <template #action="slotProps">
-                    <a-space :size="16">
-                        <a-tooltip
+                    <a-space>
+                        <template
                             v-for="i in getActions(slotProps)"
                             :key="i.key"
-                            v-bind="i.tooltip"
                         >
-                            <a-popconfirm
-                                v-if="i.popConfirm"
-                                v-bind="i.popConfirm"
-                            >
-                                <a-button
-                                    :disabled="i.disabled"
-                                    style="padding: 0"
-                                    type="link"
-                                    ><AIcon :type="i.icon"
-                                /></a-button>
-                            </a-popconfirm>
-                            <a-button
-                                style="padding: 0"
+                            <PermissionButton
+                                :disabled="i.disabled"
+                                :popConfirm="i.popConfirm"
+                                :tooltip="{
+                                    ...i.tooltip,
+                                }"
+                                style="padding: 0px"
+                                @click="i.onClick"
                                 type="link"
-                                v-else
-                                @click="i.onClick && i.onClick(slotProps)"
+                                :hasPermission="'device/Firmware:' + i.key"
                             >
-                                <a-button
-                                    :disabled="i.disabled"
-                                    style="padding: 0"
-                                    type="link"
+                                <template #icon
                                     ><AIcon :type="i.icon"
-                                /></a-button>
-                            </a-button>
-                        </a-tooltip>
+                                /></template>
+                            </PermissionButton>
+                        </template>
                     </a-space>
                 </template>
             </JTable>
@@ -129,7 +121,6 @@ import {
     taskById,
     history,
     historyCount,
-    queryProduct,
     startTask,
     startOneTask,
 } from '@/api/device/firmware';
@@ -138,8 +129,8 @@ import { getImage } from '@/utils/comm';
 import moment from 'moment';
 import { cloneDeep } from 'lodash-es';
 import Save from './Save.vue';
+
 const tableRef = ref<Record<string, any>>({});
-const router = useRouter();
 const route = useRoute();
 const params = ref<Record<string, any>>({});
 const taskId = route.params?.id as string;
@@ -286,7 +277,7 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
     }
     const Actions = [
         {
-            key: 'eye',
+            key: 'view',
             text: '查看',
             tooltip: {
                 title: '查看',
@@ -297,25 +288,23 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
             },
         },
         {
-            key: 'try',
+            key: 'update',
             text: '重试',
             tooltip: {
                 title: '重试',
             },
             icon: 'RedoOutlined',
-            onClick: async () => {
-                handlTry(data.id);
+            popConfirm: {
+                title: `确认重试?`,
+                onConfirm: async () => {
+                    handlTry(data.id);
+                },
             },
         },
     ];
     return Actions;
 };
 
-const handlAdd = () => {
-    current.value = {};
-    visible.value = true;
-};
-
 const handlEye = (data: string) => {
     current.value = data || '';
     visible.value = true;
@@ -434,4 +423,8 @@ const handleSearch = (e: any) => {
         }
     }
 }
+.state-button {
+    margin-top: -5px;
+    margin-right: -12px;
+}
 </style>
diff --git a/src/views/device/Firmware/Task/index.vue b/src/views/device/Firmware/Task/index.vue
index b9cff6fc..5c60d08d 100644
--- a/src/views/device/Firmware/Task/index.vue
+++ b/src/views/device/Firmware/Task/index.vue
@@ -13,9 +13,14 @@
             :params="params"
         >
             <template #headerTitle>
-                <a-button type="primary" @click="handlAdd"
-                    ><AIcon type="PlusOutlined" />新增</a-button
+                <PermissionButton
+                    type="primary"
+                    @click="handlAdd"
+                    hasPermission="device/Firmware:add"
                 >
+                    <template #icon><AIcon type="PlusOutlined" /></template>
+                    新增
+                </PermissionButton>
             </template>
             <template #mode="slotProps">
                 <span>{{ slotProps.mode.text }}</span>
diff --git a/src/views/device/Firmware/index.vue b/src/views/device/Firmware/index.vue
index 520ad2d4..b6f869d1 100644
--- a/src/views/device/Firmware/index.vue
+++ b/src/views/device/Firmware/index.vue
@@ -13,9 +13,14 @@
                 :params="params"
             >
                 <template #headerTitle>
-                    <a-button type="primary" @click="handlAdd"
-                        ><plus-outlined />新增</a-button
+                    <PermissionButton
+                        type="primary"
+                        @click="handlAdd"
+                        hasPermission="device/Firmware:add"
                     >
+                        <template #icon><AIcon type="PlusOutlined" /></template>
+                        新增
+                    </PermissionButton>
                 </template>
                 <template #productId="slotProps">
                     <span>{{ slotProps.productName }}</span>
@@ -28,37 +33,27 @@
                     }}</span>
                 </template>
                 <template #action="slotProps">
-                    <a-space :size="16">
-                        <a-tooltip
+                    <a-space>
+                        <template
                             v-for="i in getActions(slotProps)"
                             :key="i.key"
-                            v-bind="i.tooltip"
                         >
-                            <a-popconfirm
-                                v-if="i.popConfirm"
-                                v-bind="i.popConfirm"
-                            >
-                                <a-button
-                                    :disabled="i.disabled"
-                                    style="padding: 0"
-                                    type="link"
-                                    ><AIcon :type="i.icon"
-                                /></a-button>
-                            </a-popconfirm>
-                            <a-button
-                                style="padding: 0"
+                            <PermissionButton
+                                :disabled="i.disabled"
+                                :popConfirm="i.popConfirm"
+                                :tooltip="{
+                                    ...i.tooltip,
+                                }"
+                                style="padding: 0px"
+                                @click="i.onClick"
                                 type="link"
-                                v-else
-                                @click="i.onClick && i.onClick(slotProps)"
+                                :hasPermission="'device/Firmware:' + i.key"
                             >
-                                <a-button
-                                    :disabled="i.disabled"
-                                    style="padding: 0"
-                                    type="link"
+                                <template #icon
                                     ><AIcon :type="i.icon"
-                                /></a-button>
-                            </a-button>
-                        </a-tooltip>
+                                /></template>
+                            </PermissionButton>
+                        </template>
                     </a-space>
                 </template>
             </JTable>
@@ -79,7 +74,6 @@ import type { FormDataType } from './type';
 const menuStory = useMenuStore();
 
 const tableRef = ref<Record<string, any>>({});
-const router = useRouter();
 const params = ref<Record<string, any>>({});
 
 const productOptions = ref([]);
@@ -174,7 +168,7 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
     }
     return [
         {
-            key: 'FileTextOutlined',
+            key: 'view',
             text: '升级任务',
             tooltip: {
                 title: '升级任务',
@@ -185,7 +179,7 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
             },
         },
         {
-            key: 'edit',
+            key: 'update',
             text: '编辑',
             tooltip: {
                 title: '编辑',
@@ -211,7 +205,7 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
     ];
 };
 
-const handlUpdate = (data: FormDataType) => {
+const handlUpdate = (data: Partial<Record<string, any>>) => {
     menuStory.jumpPage(
         'device/Firmware/Task',
         {},
@@ -226,7 +220,7 @@ const handlAdd = () => {
     current.value = {};
     visible.value = true;
 };
-const handlEdit = (data: FormDataType) => {
+const handlEdit = (data: Partial<Record<string, any>>) => {
     current.value = _.cloneDeep(data);
     visible.value = true;
 };

From 1230ea3d90f22fac11adbf09d2aca08398f638ab Mon Sep 17 00:00:00 2001
From: jackhoo_98 <jackhoo_98@foxmail.com>
Date: Wed, 1 Mar 2023 17:08:32 +0800
Subject: [PATCH 6/7] =?UTF-8?q?feat:=20=E8=BF=90=E7=BB=B4=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=20=E4=BB=AA=E8=A1=A8=E7=9B=98=20=E6=96=B0=E5=A2=9Eemp?=
 =?UTF-8?q?ty=E7=8A=B6=E6=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/AIcon/index.tsx                  |  1 +
 src/views/link/DashBoard/components/Cpu.vue     | 13 ++++++++++---
 src/views/link/DashBoard/components/Jvm.vue     | 13 ++++++++++---
 src/views/link/DashBoard/components/Network.vue | 12 +++++++-----
 4 files changed, 28 insertions(+), 11 deletions(-)

diff --git a/src/components/AIcon/index.tsx b/src/components/AIcon/index.tsx
index 6e1682a0..17c9c963 100644
--- a/src/components/AIcon/index.tsx
+++ b/src/components/AIcon/index.tsx
@@ -60,6 +60,7 @@ const iconKeys = [
     'RedoOutlined',
     'VideoCameraOutlined',
     'HistoryOutlined',
+    'CalendarOutlined',
 ]
 
 const Icon = (props: {type: string}) => {
diff --git a/src/views/link/DashBoard/components/Cpu.vue b/src/views/link/DashBoard/components/Cpu.vue
index 0dd9da8f..6f62f3e5 100644
--- a/src/views/link/DashBoard/components/Cpu.vue
+++ b/src/views/link/DashBoard/components/Cpu.vue
@@ -10,7 +10,9 @@
                     format="YYYY-MM-DD HH:mm:ss"
                     v-model="data.time"
                 >
-                    <template #suffixIcon><a-icon type="calendar" /></template>
+                    <template #suffixIcon
+                        ><AIcon type="CalendarOutlined"
+                    /></template>
                     <template #renderExtraFooter>
                         <a-radio-group
                             default-value="a"
@@ -31,7 +33,8 @@
                     >
                 </a-range-picker>
             </div>
-            <div ref="chartRef" style="width: 100%; height: 300px"></div>
+            <a-empty v-if="empty" class="empty" />
+            <div v-else ref="chartRef" style="width: 100%; height: 300px"></div>
         </div>
     </a-spin>
 </template>
@@ -50,8 +53,8 @@ import {
 } from './tool.ts';
 
 const chartRef = ref<Record<string, any>>({});
-
 const loading = ref(false);
+const empty = ref(false);
 const data = ref({
     type: 'hour',
     time: [null, null],
@@ -140,6 +143,7 @@ const handleCpuOptions = (optionsData, xAxis) => {
                 : typeDataLine,
         };
         myChart.setOption(options);
+        xAxis.length === 0 && (empty.value = true);
         window.addEventListener('resize', function () {
             myChart.resize();
         });
@@ -186,4 +190,7 @@ watch(
         margin-top: 8px;
     }
 }
+.empty {
+    height: 300px;
+}
 </style>
diff --git a/src/views/link/DashBoard/components/Jvm.vue b/src/views/link/DashBoard/components/Jvm.vue
index f876e0ae..44671b76 100644
--- a/src/views/link/DashBoard/components/Jvm.vue
+++ b/src/views/link/DashBoard/components/Jvm.vue
@@ -10,7 +10,9 @@
                     format="YYYY-MM-DD HH:mm:ss"
                     v-model="data.time"
                 >
-                    <template #suffixIcon><a-icon type="calendar" /></template>
+                    <template #suffixIcon
+                        ><AIcon type="CalendarOutlined"
+                    /></template>
                     <template #renderExtraFooter>
                         <a-radio-group
                             default-value="a"
@@ -31,7 +33,8 @@
                     >
                 </a-range-picker>
             </div>
-            <div ref="chartRef" style="width: 100%; height: 300px"></div>
+            <a-empty v-if="empty" class="empty" />
+            <div v-else ref="chartRef" style="width: 100%; height: 300px"></div>
         </div>
     </a-spin>
 </template>
@@ -50,7 +53,7 @@ import {
 } from './tool.ts';
 
 const chartRef = ref<Record<string, any>>({});
-
+const empty = ref(false);
 const loading = ref(false);
 const data = ref({
     type: 'hour',
@@ -144,6 +147,7 @@ const handleJVMOptions = (optionsData, xAxis) => {
                 : typeDataLine,
         };
         myChart.setOption(options);
+        xAxis.length === 0 && (empty.value = true);
         window.addEventListener('resize', function () {
             myChart.resize();
         });
@@ -190,4 +194,7 @@ watch(
         margin-top: 8px;
     }
 }
+.empty {
+    height: 300px;
+}
 </style>
diff --git a/src/views/link/DashBoard/components/Network.vue b/src/views/link/DashBoard/components/Network.vue
index 2db01cc6..46188f4f 100644
--- a/src/views/link/DashBoard/components/Network.vue
+++ b/src/views/link/DashBoard/components/Network.vue
@@ -43,12 +43,12 @@
                 </div>
             </div>
             <div>
+                <a-empty v-if="empty" class="empty" />
                 <div
+                    v-else
                     ref="chartRef"
-                    v-if="flag"
                     style="width: 100%; height: 350px"
                 ></div>
-                <a-empty v-else style="height: 300px; margin-top: 120px" />
             </div>
         </div>
     </a-spin>
@@ -67,10 +67,8 @@ import moment from 'moment';
 import * as echarts from 'echarts';
 
 const chartRef = ref<Record<string, any>>({});
-
-const flag = ref(true);
+const empty = ref(false);
 const loading = ref(false);
-const myChart = ref(null);
 const data = ref({
     type: 'bytesRead',
     time: {
@@ -163,6 +161,7 @@ const handleNetworkOptions = (optionsData, xAxis) => {
                 : typeDataLine,
         };
         myChart.setOption(options);
+        // xAxis.length === 0 && (empty.value = true);
         window.addEventListener('resize', function () {
             myChart.resize();
         });
@@ -216,4 +215,7 @@ watch(
     display: flex;
     align-items: center;
 }
+.empty {
+    height: 300px;
+}
 </style>

From 730997231eea52aa06af16ae50f34f19611756a4 Mon Sep 17 00:00:00 2001
From: xieyonghong <18010623010@163.com>
Date: Wed, 1 Mar 2023 17:24:57 +0800
Subject: [PATCH 7/7] =?UTF-8?q?update:=20=E4=BC=98=E5=8C=96ProLayout?=
 =?UTF-8?q?=E4=BD=BF=E7=94=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Layout/BasicLayout.tsx         | 221 ----------------
 src/components/Layout/BasicLayoutPage.vue     |  10 +-
 src/components/Layout/PageContainer.tsx       |   0
 src/components/Layout/RouteContext.tsx        |  45 ----
 .../Layout/components/Header/Header.tsx       | 127 ---------
 .../Layout/components/Header/index.less       |  64 -----
 .../Layout/components/Header/index.tsx        |  59 -----
 .../components/PageContainer/index.less       |  23 --
 .../Layout/components/PageContainer/index.tsx | 250 ------------------
 .../components/PageContainer/types.d.ts       |  56 ----
 .../Layout/components/SiderMenu/BaseMenu.tsx  | 217 ---------------
 .../components/SiderMenu/SiderMenu.less       |  20 --
 .../Layout/components/SiderMenu/SiderMenu.tsx | 186 -------------
 src/components/Layout/defaultSetting.ts       |  68 -----
 src/components/Layout/hooks/context.ts        |  10 -
 src/components/Layout/index.ts                |   4 +-
 src/components/Layout/typings.ts              |  68 -----
 src/components/Layout/utils.ts                |  48 ----
 src/components/index.ts                       |   3 +-
 src/main.ts                                   |   1 -
 src/router/menu.ts                            |   4 -
 src/views/demo/Search.vue                     | 120 ---------
 src/views/system/Basis/index.vue              |   1 -
 yarn.lock                                     |   4 +-
 24 files changed, 10 insertions(+), 1599 deletions(-)
 delete mode 100644 src/components/Layout/BasicLayout.tsx
 delete mode 100644 src/components/Layout/PageContainer.tsx
 delete mode 100644 src/components/Layout/RouteContext.tsx
 delete mode 100644 src/components/Layout/components/Header/Header.tsx
 delete mode 100644 src/components/Layout/components/Header/index.less
 delete mode 100644 src/components/Layout/components/Header/index.tsx
 delete mode 100644 src/components/Layout/components/PageContainer/index.less
 delete mode 100644 src/components/Layout/components/PageContainer/index.tsx
 delete mode 100644 src/components/Layout/components/PageContainer/types.d.ts
 delete mode 100644 src/components/Layout/components/SiderMenu/BaseMenu.tsx
 delete mode 100644 src/components/Layout/components/SiderMenu/SiderMenu.less
 delete mode 100644 src/components/Layout/components/SiderMenu/SiderMenu.tsx
 delete mode 100644 src/components/Layout/defaultSetting.ts
 delete mode 100644 src/components/Layout/hooks/context.ts
 delete mode 100644 src/components/Layout/typings.ts
 delete mode 100644 src/components/Layout/utils.ts
 delete mode 100644 src/views/demo/Search.vue

diff --git a/src/components/Layout/BasicLayout.tsx b/src/components/Layout/BasicLayout.tsx
deleted file mode 100644
index 18cfcdf2..00000000
--- a/src/components/Layout/BasicLayout.tsx
+++ /dev/null
@@ -1,221 +0,0 @@
-import {
-  computed,
-  reactive,
-  unref,
-  defineComponent,
-  toRefs,
-  provide
-} from 'vue'
-
-import type { ExtractPropTypes, PropType, CSSProperties} from 'vue'
-import { Layout } from 'ant-design-vue'
-import { defaultSettingProps } from './defaultSetting'
-import type { BreadcrumbProps, RouteContextProps } from './RouteContext'
-import type {
-  BreadcrumbRender,
-  CollapsedButtonRender, CustomRender,
-  HeaderRender,
-  MenuContentRender,
-  MenuExtraRender,
-  MenuHeaderRender,
-  MenuItemRender,
-  RightContentRender,
-  SubMenuItemRender
-} from './typings'
-import SiderMenuWrapper, { siderMenuProps } from 'components/Layout/components/SiderMenu/SiderMenu'
-import { getSlot } from '@/utils/comm'
-import { getMenuFirstChildren } from 'components/Layout/utils'
-import { pick } from 'lodash-es'
-import { routeContextInjectKey } from './RouteContext'
-import { HeaderView, headerViewProps } from './components/Header'
-
-export const basicLayoutProps = {
-  ...defaultSettingProps,
-  ...siderMenuProps,
-  ...headerViewProps,
-
-  breadcrumb: {
-    type: [Object, Function] as PropType<BreadcrumbProps>,
-    default: () => null
-  },
-  breadcrumbRender: {
-    type: [Object, Function, Boolean] as PropType<BreadcrumbRender>,
-    default() {
-      return null
-    }
-  },
-  contentStyle: {
-    type: [String, Object] as PropType<CSSProperties>,
-    default: () => {
-      return null
-    }
-  },
-  pure: {
-    type: Boolean,
-    default: () => false
-  }
-}
-
-export type BasicLayoutProps = Partial<ExtractPropTypes<typeof basicLayoutProps>>;
-
-export default defineComponent({
-  name: 'ProLayout',
-  inheritAttrs: false,
-  props: basicLayoutProps,
-  emits: [
-    'update:collapsed',
-    'update:open-keys',
-    'update:selected-keys',
-    'collapse',
-    'openKeys',
-    'select',
-    'menuHeaderClick',
-    'menuClick'
-  ],
-  setup(props, { emit, attrs, slots }) {
-    const siderWidth = computed(() => (props.collapsed ? props.collapsedWidth : props.siderWidth))
-
-    const onCollapse = (collapsed: boolean) => {
-      emit('update:collapsed', collapsed)
-      emit('collapse', collapsed)
-    }
-    const onOpenKeys = (openKeys: string[] | false) => {
-      emit('update:open-keys', openKeys)
-      emit('openKeys', openKeys)
-    }
-    const onSelect = (selectedKeys: string[] | false) => {
-      emit('update:selected-keys', selectedKeys)
-      emit('select', selectedKeys)
-    }
-    const onMenuHeaderClick = (e: MouseEvent) => {
-      emit('menuHeaderClick', e)
-    }
-    const onMenuClick = (args: any) => {
-      emit('menuClick', args)
-    }
-    const headerRender = (
-      p: BasicLayoutProps & {
-        hasSiderMenu: boolean;
-        headerRender: HeaderRender;
-        rightContentRender: RightContentRender;
-      },
-      matchMenuKeys?: string[]
-    ): CustomRender | null => {
-      if (p.headerRender === false) {
-        return null
-      }
-      return <HeaderView {...p} />
-    }
-
-    const breadcrumb = computed<BreadcrumbProps>(() => ({
-      ...props.breadcrumb,
-      itemRender: getSlot<BreadcrumbRender>(slots, props, 'breadcrumbRender') as BreadcrumbRender
-    }))
-
-    const flatMenuData = computed(
-      () => (props.selectedKeys && getMenuFirstChildren(props.menuData, props.selectedKeys[0])) || [])
-
-    const routeContext = reactive<RouteContextProps>({
-      ...(pick(toRefs(props), [
-        'menuData',
-        'openKeys',
-        'selectedKeys',
-        'contentWidth',
-        'headerHeight'
-      ]) as any),
-      siderWidth,
-      breadcrumb,
-      flatMenuData
-    })
-
-    provide(routeContextInjectKey, routeContext)
-
-    return () => {
-      const {
-        pure,
-        onCollapse: propsOnCollapse,
-        onOpenKeys: propsOnOpenKeys,
-        onSelect: propsOnSelect,
-        onMenuClick: propsOnMenuClick,
-        ...restProps
-      } = props
-
-      const collapsedButtonRender = getSlot<CollapsedButtonRender>(slots, props, 'collapsedButtonRender')
-      const rightContentRender = getSlot<RightContentRender>(slots, props, 'rightContentRender')
-      const customHeaderRender = getSlot<HeaderRender>(slots, props, 'headerRender')
-
-      // menu
-      const menuHeaderRender = getSlot<MenuHeaderRender>(slots, props, 'menuHeaderRender')
-      const menuExtraRender = getSlot<MenuExtraRender>(slots, props, 'menuExtraRender')
-      const menuContentRender = getSlot<MenuContentRender>(slots, props, 'menuContentRender')
-      const menuItemRender = getSlot<MenuItemRender>(slots, props, 'menuItemRender')
-      const subMenuItemRender = getSlot<SubMenuItemRender>(slots, props, 'subMenuItemRender')
-
-      const headerDom = computed(() =>
-        headerRender(
-          {
-            ...props,
-            hasSiderMenu: true,
-            menuItemRender,
-            subMenuItemRender,
-            menuData: props.menuData,
-            onCollapse,
-            onOpenKeys,
-            onSelect,
-            onMenuHeaderClick,
-            rightContentRender,
-            collapsedButtonRender,
-            menuExtraRender,
-            menuContentRender,
-            headerRender: customHeaderRender,
-            theme: props.navTheme
-          },
-          []
-        )
-      )
-
-      return (
-        <>
-          {
-            pure ? (
-              slots.default?.()
-            ) : (
-              <Layout
-                class={'pro-layout'}
-                style={{
-                  minHeight: '100vh'
-                }}
-              >
-                <SiderMenuWrapper
-                  {...restProps}
-                  theme={props.navTheme}
-                  menuHeaderRender={menuHeaderRender}
-                  menuExtraRender={menuExtraRender}
-                  menuContentRender={menuContentRender}
-                  menuItemRender={menuItemRender}
-                  subMenuItemRender={subMenuItemRender}
-                  collapsedButtonRender={collapsedButtonRender}
-                  onCollapse={onCollapse}
-                  onSelect={onSelect}
-                  onOpenKeys={onOpenKeys}
-                  onMenuClick={onMenuClick}
-                />
-
-                <Layout>
-                  {headerDom.value}
-                  <Layout>
-                    {slots.default?.()}
-                  </Layout>
-                </Layout>
-              </Layout>
-            )
-          }
-        </>
-      )
-    }
-  }
-})
-
-
-
-
diff --git a/src/components/Layout/BasicLayoutPage.vue b/src/components/Layout/BasicLayoutPage.vue
index ebc3adc4..59079f75 100644
--- a/src/components/Layout/BasicLayoutPage.vue
+++ b/src/components/Layout/BasicLayoutPage.vue
@@ -1,5 +1,5 @@
 <template>
-  <ProLayout
+  <j-pro-layout
     v-bind='layoutConf'
     v-model:openKeys="state.openKeys"
     v-model:collapsed="state.collapsed"
@@ -14,14 +14,13 @@
     <router-view v-slot='{ Component}'>
       <component :is='Component' />
     </router-view>
-  </ProLayout>
+  </j-pro-layout>
 </template>
 
 <script setup lang="ts" name='BasicLayoutPage'>
-import { ProLayout } from '@/components/Layout'
 import DefaultSetting from '../../../config/config'
 import { useMenuStore } from '@/store/menu'
-import { clearMenuItem } from 'components/Layout/utils'
+import { clearMenuItem } from 'jetlinks-ui-components/es/ProLayout/util'
 
 type StateType = {
   collapsed: boolean
@@ -36,11 +35,12 @@ const route = useRoute()
 const menu = useMenuStore()
 
 const layoutConf = reactive({
-  navTheme: DefaultSetting.layout.theme,
+  theme: DefaultSetting.layout.theme,
   siderWidth: DefaultSetting.layout.siderWidth,
   logo: DefaultSetting.layout.logo,
   title: DefaultSetting.layout.title,
   menuData: clearMenuItem(menu.siderMenus),
+  splitMenus: true
 });
 
 const state = reactive<StateType>({
diff --git a/src/components/Layout/PageContainer.tsx b/src/components/Layout/PageContainer.tsx
deleted file mode 100644
index e69de29b..00000000
diff --git a/src/components/Layout/RouteContext.tsx b/src/components/Layout/RouteContext.tsx
deleted file mode 100644
index 78f995b4..00000000
--- a/src/components/Layout/RouteContext.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import type { ComputedRef, VNodeChild, InjectionKey } from 'vue'
-import type { PureSettings } from 'components/Layout/defaultSetting'
-import type { MenuDataItem } from 'components/Layout/typings'
-import { useContext } from 'components/Layout/hooks/context'
-
-export interface Route {
-  path: string;
-  breadcrumbName: string;
-  children?: Omit<Route, 'children'>[];
-}
-
-export interface BreadcrumbProps {
-  prefixCls?: string;
-  routes?: Route[];
-  params?: any;
-  separator?: VNodeChild;
-  itemRender?: (opts: { route: Route; params: any; routes: Array<Route>; paths: Array<string> }) => VNodeChild;
-}
-
-export type BreadcrumbListReturn = Pick<BreadcrumbProps, Extract<keyof BreadcrumbProps, 'routes' | 'itemRender'>>;
-
-export interface MenuState {
-  selectedKeys: string[];
-  openKeys: string[];
-}
-
-export interface RouteContextProps extends Partial<PureSettings>, MenuState {
-  menuData: MenuDataItem[];
-  flatMenuData?: MenuDataItem[];
-
-  getPrefixCls?: (suffixCls?: string, customizePrefixCls?: string) => string;
-  breadcrumb?: BreadcrumbListReturn | ComputedRef<BreadcrumbListReturn>;
-  collapsed?: boolean;
-  hasSideMenu?: boolean;
-  siderWidth?: number;
-  headerHeight?: number;
-  /* 附加属性 */
-  [key: string]: any;
-}
-
-export const routeContextInjectKey: InjectionKey<RouteContextProps> = Symbol('route-context');
-
-export const useRouteContext = () =>
-  useContext<Required<RouteContextProps>>(routeContextInjectKey, {});
-
diff --git a/src/components/Layout/components/Header/Header.tsx b/src/components/Layout/components/Header/Header.tsx
deleted file mode 100644
index 8d7de6d7..00000000
--- a/src/components/Layout/components/Header/Header.tsx
+++ /dev/null
@@ -1,127 +0,0 @@
-import type { ExtractPropTypes, FunctionalComponent } from 'vue'
-import { defineComponent, PropType } from 'vue'
-import { defaultRenderLogo, siderMenuProps } from 'components/Layout/components/SiderMenu/SiderMenu'
-import BaseMenu from '../SiderMenu/BaseMenu'
-import { useRouteContext } from 'components/Layout/RouteContext'
-import { default as ResizeObserver } from 'ant-design-vue/es/vc-resize-observer';
-import { defaultSettingProps } from 'components/Layout/defaultSetting'
-import PropTypes from 'ant-design-vue/es/_util/vue-types'
-import { CustomRender, MenuDataItem, ProProps, RightContentRender, WithFalse } from 'components/Layout/typings'
-import './index.less'
-import { RouteRecordRaw } from 'vue-router'
-import { clearMenuItem } from 'components/Layout/utils'
-
-export const headerProps = {
-  ...defaultSettingProps,
-  collapsed: PropTypes.looseBool,
-  menuData: {
-    type: Array as PropType<MenuDataItem[]>,
-    default: () => [],
-  },
-  logo: siderMenuProps.logo,
-  logoStyle: siderMenuProps.logoStyle,
-  menuRender: {
-    type: [Object, Function] as PropType<
-      WithFalse<(props: ProProps, defaultDom: CustomRender) => CustomRender>
-      >,
-    default: () => undefined,
-  },
-  menuItemRender: siderMenuProps.menuItemRender,
-  subMenuItemRender: siderMenuProps.subMenuItemRender,
-  rightContentRender: {
-    type: [Object, Function] as PropType<RightContentRender>,
-    default: () => undefined,
-  },
-  siderWidth: PropTypes.number.def(208),
-  // events
-  onMenuHeaderClick: PropTypes.func,
-  onCollapse: siderMenuProps.onCollapse,
-  onOpenKeys: siderMenuProps.onOpenKeys,
-  onSelect: siderMenuProps.onSelect,
-}
-
-export type HeaderProps = ExtractPropTypes<typeof headerProps>;
-
-export default defineComponent({
-  name: 'Header',
-  emits: [
-    'menuHeaderClick', 'collapse', 'openKeys', 'select'
-  ],
-  inheritAttrs: false,
-  props: headerProps,
-  setup(props, { slots, emit}) {
-
-    const {
-      onSelect,
-      onMenuHeaderClick,
-      onOpenKeys,
-      logo,
-      logoStyle,
-      menuData,
-      navTheme,
-      contentWidth,
-      title,
-      rightContentRender
-    } = props;
-
-    const rightSize = ref<number | string>('auto')
-
-    const context = useRouteContext();
-
-    const noChildrenMenuData = (menuData || []).map((item) => ({
-      ...item,
-      children: undefined,
-    })) as RouteRecordRaw[];
-
-    const clearMenuData = clearMenuItem(noChildrenMenuData);
-
-    return () => (
-      <>
-        <div
-          class={`header-content ${navTheme}`}
-        >
-          <div class={`header-main ${contentWidth === 'Fixed' ? 'wide' : ''}`}>
-            <div class={'header-main-left'} onClick={onMenuHeaderClick}>
-              <div class={'header-logo'}>
-                <a>
-                  {defaultRenderLogo(logo, logoStyle)}
-                  <h1 title={title}>{ title }</h1>
-                </a>
-              </div>
-            </div>
-            <div style={{ flex: 1 }} class={'header-menu'}>
-              <BaseMenu
-                theme={props.navTheme === 'realDark' ? 'dark' : props.navTheme}
-                menuData={clearMenuData}
-                mode={'horizontal'}
-                menuItemRender={props.menuItemRender}
-                subMenuItemRender={props.subMenuItemRender}
-                openKeys={context.openKeys}
-                selectedKeys={context.selectedKeys}
-                {...{
-                  'onUpdate:openKeys': ($event: string[]) => onOpenKeys && onOpenKeys($event),
-                  'onUpdate:selectedKeys': ($event: string[]) => onSelect && onSelect($event),
-                }}
-              />
-            </div>
-            <div class={'header-right'} style={{ minWidth: rightSize.value }}>
-              <div>
-                <ResizeObserver
-                  onResize={({ width }: { width: number}) => {
-                    rightSize.value = width
-                  }}
-                >
-                  {
-                    rightContentRender && typeof rightContentRender === 'function' ? (
-                      <div>{rightContentRender({...props})}</div>
-                    ) : rightContentRender
-                  }
-                </ResizeObserver>
-              </div>
-            </div>
-          </div>
-        </div>
-      </>
-    )
-  }
-})
\ No newline at end of file
diff --git a/src/components/Layout/components/Header/index.less b/src/components/Layout/components/Header/index.less
deleted file mode 100644
index d9734f2f..00000000
--- a/src/components/Layout/components/Header/index.less
+++ /dev/null
@@ -1,64 +0,0 @@
-.header-content {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  box-shadow: 0 1px 4px 0 rgb(0 21 41 / 12%);
-  transition: background .3s,width .2s;
-
-  &.light {
-    background-color: #fff;
-  }
-
-  &.dark {
-    .header-logo {
-      >a {
-        > h1 {
-          color: #fff !important;
-        }
-      }
-    }
-  }
-
-  .header-main {
-    padding-left: 16px;
-    display: flex;
-    height: 100%;
-
-    .header-main-left {
-      display: flex;
-      min-width: 192px;
-
-      .header-logo {
-        height: 100%;
-        position: relative;
-        display: flex;
-        justify-content: center;
-        min-width: 165px;
-        overflow: hidden;
-
-        > a {
-          color: @primary-color;
-          text-decoration: none;
-          background-color: transparent;
-          outline: none;
-          cursor: pointer;
-          transition: color .3s;
-
-          > h1 {
-            vertical-align: top;
-            display: inline-block;
-            margin: 0 0 0 12px;
-            font-size: 16px;
-            color: rgba(0,0,0,.85);
-          }
-        }
-
-        img {
-          display: inline-block;
-          height: 32px;
-          vertical-align: middle;
-        }
-      }
-    }
-  }
-}
\ No newline at end of file
diff --git a/src/components/Layout/components/Header/index.tsx b/src/components/Layout/components/Header/index.tsx
deleted file mode 100644
index a804a3a2..00000000
--- a/src/components/Layout/components/Header/index.tsx
+++ /dev/null
@@ -1,59 +0,0 @@
-import type { ExtractPropTypes } from 'vue'
-import Header, { headerProps } from './Header'
-import { useRouteContext } from 'components/Layout/RouteContext'
-import type { RouteRecordRaw } from 'vue-router'
-import { clearMenuItem } from 'components/Layout/utils'
-import { Layout } from 'ant-design-vue'
-
-export const headerViewProps = {
-  ...headerProps
-}
-
-export type HeaderViewProps = Partial<ExtractPropTypes<typeof headerViewProps>>;
-
-export const HeaderView = defineComponent({
-  name: 'HeaderView',
-  inheritAttrs: false,
-  props: headerViewProps,
-  setup(props) {
-    const { headerHeight, onCollapse } = toRefs(props);
-
-    const context = useRouteContext();
-
-    const clearMenuData = computed(
-      () => (context.menuData && clearMenuItem(context.menuData as RouteRecordRaw[])) || []
-    );
-
-    return () => (
-      <>
-        <Layout.Header
-          style={{
-            padding: 0,
-            height: `${headerHeight.value}px`,
-            lineHeight: `${headerHeight.value}px`,
-            width: `100%`,
-            background: 'transparent'
-          }}
-        />
-        <Layout.Header
-          style={{
-            padding: 0,
-            height: `${headerHeight.value}px`,
-            lineHeight: `${headerHeight.value}px`,
-            width: `100%`,
-            zIndex: 19,
-            position: 'fixed',
-            top: 0,
-            right: 0
-          }}
-        >
-          <Header
-            {...props}
-            onCollapse={onCollapse.value}
-            menuData={clearMenuData.value}
-          />
-        </Layout.Header>
-      </>
-    )
-}
-})
\ No newline at end of file
diff --git a/src/components/Layout/components/PageContainer/index.less b/src/components/Layout/components/PageContainer/index.less
deleted file mode 100644
index 2e617c9f..00000000
--- a/src/components/Layout/components/PageContainer/index.less
+++ /dev/null
@@ -1,23 +0,0 @@
-.page-container {
-  min-height: 100%;
-  display: flex;
-  flex-direction: column;
-
-  .page-container-grid-content {
-    padding: 24px;
-    flex: 1 1 auto;
-    display: flex;
-    flex-direction: column;
-    > div, .page-container-children-content, .page-container-full-height {
-      min-height: 100%;
-      display: flex;
-      flex-direction: column;
-    }
-
-    //.children-full-height {
-    //  > :nth-child(1) {
-    //    min-height: 100%;
-    //  }
-    //}
-  }
-}
\ No newline at end of file
diff --git a/src/components/Layout/components/PageContainer/index.tsx b/src/components/Layout/components/PageContainer/index.tsx
deleted file mode 100644
index 6ae909b1..00000000
--- a/src/components/Layout/components/PageContainer/index.tsx
+++ /dev/null
@@ -1,250 +0,0 @@
-import { TabPaneProps } from 'ant-design-vue'
-import type { ExtractPropTypes, FunctionalComponent, PropType, VNodeChild } from 'vue'
-import { pageHeaderProps } from 'ant-design-vue/es/page-header';
-import type { DefaultPropRender, PageHeaderRender } from 'components/Layout/typings'
-import type { AffixProps, TabBarExtraContent } from 'components/Layout/components/PageContainer/types'
-import { useRouteContext } from 'components/Layout/RouteContext'
-import { getSlotVNode } from '@/utils/comm'
-import { Affix, Spin, PageHeader, Tabs } from 'ant-design-vue';
-import './index.less'
-
-export const pageHeaderTabConfig = {
-  /**
-   * @name tabs 的列表
-   */
-  tabList: {
-    type: [Object, Function, Array] as PropType<(Omit<TabPaneProps, 'id'> & { key?: string })[]>,
-    default: () => undefined,
-  },
-  /**
-   * @name 当前选中 tab 的 key
-   */
-  tabActiveKey: String, //PropTypes.string,
-  /**
-   * @name tab 上多余的区域
-   */
-  tabBarExtraContent: {
-    type: [Object, Function] as PropType<TabBarExtraContent>,
-    default: () => undefined,
-  },
-  /**
-   * @name tabs 的其他配置
-   */
-  tabProps: {
-    type: Object, //as PropType<TabsProps>,
-    default: () => undefined,
-  },
-  /**
-   * @name 固定 PageHeader 到页面顶部
-   */
-  fixedHeader: Boolean, //PropTypes.looseBool,
-  // events
-  onTabChange: Function, //PropTypes.func,
-};
-export type PageHeaderTabConfig = Partial<ExtractPropTypes<typeof pageHeaderTabConfig>>;
-
-
-export const pageContainerProps = {
-  ...pageHeaderTabConfig,
-  ...pageHeaderProps,
-  prefixCls: {
-    type: String,
-    default: 'ant-pro',
-  }, //PropTypes.string.def('ant-pro'),
-  title: {
-    type: [Object, String, Boolean, Function] as PropType<DefaultPropRender>,
-    default: () => null,
-  },
-  subTitle: {
-    type: [Object, String, Boolean, Function] as PropType<DefaultPropRender>,
-    default: () => null,
-  },
-  content: {
-    type: [Object, String, Boolean, Function] as PropType<DefaultPropRender>,
-    default: () => null,
-  },
-  extra: {
-    type: [Object, String, Boolean, Function] as PropType<DefaultPropRender>,
-    default: () => null,
-  },
-  extraContent: {
-    type: [Object, String, Boolean, Function] as PropType<DefaultPropRender>,
-    default: () => null,
-  },
-  header: {
-    type: [Object, String, Boolean, Function] as PropType<DefaultPropRender>,
-    default: () => null,
-  },
-  pageHeaderRender: {
-    type: [Object, Function, Boolean] as PropType<PageHeaderRender>,
-    default: () => undefined,
-  },
-  affixProps: {
-    type: [Object, Function] as PropType<AffixProps>,
-  },
-  ghost: {
-    type: Boolean,
-    default: () => false,
-  }, //PropTypes.looseBool,
-  loading: {
-    type: Boolean,
-    default: () => undefined,
-  }, //PropTypes.looseBool,
-  childrenFullHeight: {
-    type: Boolean,
-    default: () => true,
-  }
-};
-
-export type PageContainerProps = Partial<ExtractPropTypes<typeof pageContainerProps>>;
-
-const renderFooter = (
-  props: Omit< PageContainerProps, 'title' >
-): VNodeChild | JSX.Element => {
-  const { tabList, tabActiveKey, onTabChange, tabBarExtraContent, tabProps } = props;
-  if (tabList && tabList.length) {
-    return (
-      <Tabs
-        class={`page-container-tabs`}
-        activeKey={tabActiveKey}
-        onChange={(key: string | number) => {
-          if (onTabChange) {
-            onTabChange(key);
-          }
-        }}
-        tabBarExtraContent={tabBarExtraContent}
-        {...tabProps}
-      >
-        {tabList.map((item) => (
-          <Tabs.TabPane {...item} tab={item.tab} key={item.key} />
-        ))}
-      </Tabs>
-    );
-  }
-  return null;
-}
-
-const ProPageHeader: FunctionalComponent<PageContainerProps> = (props) => {
-  const {
-    title,
-    tabList,
-    tabActiveKey,
-    content,
-    pageHeaderRender,
-    header,
-    extraContent,
-    prefixCls,
-    fixedHeader: _,
-    ...restProps
-  } = props;
-
-  const value = useRouteContext()
-
-  if (pageHeaderRender === false) {
-    return null;
-  }
-
-  if (pageHeaderRender) {
-    return pageHeaderRender({ ...props });
-  }
-  let pageHeaderTitle = title;
-  if (!title && title !== false) {
-    pageHeaderTitle = value.title;
-  }
-
-  const unrefBreadcrumb = unref(value.breadcrumb || {});
-  const breadcrumb = (props as any).breadcrumb || {
-    ...unrefBreadcrumb,
-    routes: unrefBreadcrumb.routes,
-    itemRender: unrefBreadcrumb.itemRender,
-  };
-
-  return (
-    <div class={`page-container-wrap`}>
-      <PageHeader
-        {...restProps}
-        // {...value}
-        title={pageHeaderTitle}
-        breadcrumb={breadcrumb}
-        footer={renderFooter({
-          ...restProps,
-          tabList,
-          tabActiveKey
-        })}
-        prefixCls={prefixCls}
-      >
-        {/*{header || renderPageHeader(content, extraContent)}*/}
-        { header }
-      </PageHeader>
-    </div>
-  );
-}
-
-const PageContainer = defineComponent({
-  name: 'PageContainer',
-  inheritAttrs: false,
-  props: pageContainerProps,
-  setup(props, { slots }) {
-    const { loading, affixProps, ghost, childrenFullHeight } = toRefs(props);
-
-    const value = useRouteContext();
-
-    const headerDom = computed(() => {
-      // const tags = getSlotVNode<DefaultPropRender>(slots, props, 'tags');
-      const headerContent = getSlotVNode<DefaultPropRender>(slots, props, 'content');
-      const extra = getSlotVNode<DefaultPropRender>(slots, props, 'extra');
-      const extraContent = getSlotVNode<DefaultPropRender>(slots, props, 'extraContent');
-      const subTitle = getSlotVNode<DefaultPropRender>(slots, props, 'subTitle');
-      const title = getSlotVNode<DefaultPropRender>(slots, props, 'title');
-
-      // @ts-ignore
-      return (
-        <ProPageHeader
-          {...props}
-          prefixCls={undefined}
-          ghost={ghost.value}
-          title={title}
-          subTitle={subTitle}
-          content={headerContent}
-          // tags={tags}
-          extra={extra}
-          extraContent={extraContent}
-        />
-      );
-    })
-
-    return () => {
-      const { fixedHeader } = props;
-      return (
-        <div class={'page-container'}>
-          {fixedHeader && headerDom.value ? (
-            <Affix {...affixProps.value} offsetTop={value.hasHeader && value.fixedHeader ? value.headerHeight : 0}>
-              {headerDom.value}
-            </Affix>
-          ) : (
-            headerDom.value
-          )}
-          <div class={'page-container-grid-content'}>
-            {loading.value ? (
-              <Spin />
-            ) : slots.default ? (
-              <div>
-                <div class={`page-container-children-content ${childrenFullHeight.value ? 'children-full-height' : ''}`}>{slots.default()}</div>
-                {value.hasFooterToolbar && (
-                  <div
-                    style={{
-                      height: 48,
-                      marginTop: 24,
-                    }}
-                  />
-                )}
-              </div>
-            ) : null}
-          </div>
-        </div>
-      );
-    };
-  }
-})
-
-export default PageContainer
\ No newline at end of file
diff --git a/src/components/Layout/components/PageContainer/types.d.ts b/src/components/Layout/components/PageContainer/types.d.ts
deleted file mode 100644
index f189788a..00000000
--- a/src/components/Layout/components/PageContainer/types.d.ts
+++ /dev/null
@@ -1,56 +0,0 @@
-import type { VNodeChild, CSSProperties, VNode } from 'vue';
-
-export interface Tab {
-  key: string;
-  tab: string | VNode | JSX.Element;
-}
-
-export type TabBarType = 'line' | 'card' | 'editable-card';
-export type TabSize = 'default' | 'large' | 'small';
-export type TabPosition = 'left' | 'right';
-export type TabBarExtraPosition = TabPosition;
-
-export type TabBarExtraMap = Partial<Record<TabBarExtraPosition, VNodeChild>>;
-
-export type TabBarExtraContent = VNodeChild | TabBarExtraMap;
-
-export interface TabsProps {
-  prefixCls?: string;
-  class?: string | string[];
-  style?: CSSProperties;
-  id?: string;
-
-  activeKey?: string;
-  hideAdd?: boolean;
-  // Unchangeable
-  // size?: TabSize;
-  tabBarStyle?: CSSProperties;
-  tabPosition?: TabPosition;
-  type?: TabBarType;
-  tabBarGutter?: number;
-}
-
-export interface AffixProps {
-  offsetBottom: number;
-  offsetTop: number;
-  target?: () => HTMLElement;
-
-  onChange?: (affixed: boolean) => void;
-}
-
-export interface TabPaneProps {
-  tab?: string | VNodeChild | JSX.Element;
-  class?: string | string[];
-  style?: CSSProperties;
-  disabled?: boolean;
-  forceRender?: boolean;
-  closable?: boolean;
-  closeIcon?: VNodeChild | JSX.Element;
-
-  prefixCls?: string;
-  tabKey?: string;
-  id: string;
-  animated?: boolean;
-  active?: boolean;
-  destroyInactiveTabPane?: boolean;
-}
\ No newline at end of file
diff --git a/src/components/Layout/components/SiderMenu/BaseMenu.tsx b/src/components/Layout/components/SiderMenu/BaseMenu.tsx
deleted file mode 100644
index c73f5002..00000000
--- a/src/components/Layout/components/SiderMenu/BaseMenu.tsx
+++ /dev/null
@@ -1,217 +0,0 @@
-import { isVNode, defineComponent, getCurrentInstance, withCtx } from 'vue'
-import type { FunctionalComponent, PropType, VNodeChild, ComponentInternalInstance, ConcreteComponent, ExtractPropTypes, VNode } from 'vue'
-import type {
-  MenuDataItem,
-  WithFalse,
-  MenuItemRender,
-  LayoutType,
-  MenuTheme,
-  SubMenuItemRender,
-  MenuMode
-} from '../../typings'
-import type {
-  SelectEventHandler,
-  MenuClickEventHandler,
-  SelectInfo,
-  MenuInfo,
-} from 'ant-design-vue/es/menu/src/interface';
-import type { Key } from 'ant-design-vue/es/_util/type';
-import IconFont from '@/components/AIcon'
-import { Menu } from 'ant-design-vue';
-import { isUrl } from '@/utils/regular'
-
-export const baseMenuProps = {
-  mode: {
-    type: String as PropType<MenuMode>,
-    default: 'inline',
-  },
-  menuData: {
-    type: Array as PropType<MenuDataItem[]>,
-    default: () => [],
-  },
-  layout: {
-    type: String as PropType<LayoutType>,
-    default: 'side',
-  },
-  theme: {
-    type: String as PropType<MenuTheme | 'realDark'>,
-    default: 'dark',
-  },
-  collapsed: {
-    type: Boolean as PropType<boolean | undefined>,
-    default: () => false,
-  },
-  openKeys: {
-    type: Array as PropType<WithFalse<string[]>>,
-    default: () => undefined,
-  },
-  selectedKeys: {
-    type: Array as PropType<WithFalse<string[]>>,
-    default: () => undefined,
-  },
-  menuProps: {
-    type: Object as PropType<Record<string, any>>,
-    default: () => null,
-  },
-  menuItemRender: {
-    type: [Object, Function, Boolean] as PropType<MenuItemRender>,
-    default: () => undefined,
-  },
-  subMenuItemRender: {
-    type: [Object, Function, Boolean] as PropType<SubMenuItemRender>,
-    default: () => undefined,
-  },
-  onClick: [Function, Object] as PropType<(...args: any) => void>,
-}
-
-export type BaseMenuProps = ExtractPropTypes<typeof baseMenuProps>;
-
-const LazyIcon: FunctionalComponent<{ icon:  VNodeChild | string;}> = (props) => {
-  const {icon} = props
-  if (!icon) return null
-  if (typeof icon === 'string' && icon !== '') {
-    return <IconFont type={icon} />;
-  }
-  if (isVNode(icon)) {
-    return icon;
-  }
-}
-
-class MenuUtil {
-  props: BaseMenuProps;
-  ctx: ComponentInternalInstance | null;
-  RouterLink: ConcreteComponent;
-
-  constructor(props: BaseMenuProps, ctx: ComponentInternalInstance | null) {
-    this.props = props
-    this.ctx = ctx
-    this.RouterLink = resolveComponent('router-link') as ConcreteComponent
-  }
-
-  getNavMenuItems = (menusData: MenuDataItem[] = []) => {
-    return menusData.map((item) => this.getSubMenuOrItem(item)).filter((item) => item);
-  };
-
-  getSubMenuOrItem = (item: MenuDataItem): VNode => {
-    if (
-      Array.isArray(item.children) &&
-      item.children.length > 0 &&
-      !item?.meta?.hideInMenu &&
-      !item?.meta?.hideChildrenInMenu
-    ) {
-      if (this.props.subMenuItemRender) {
-        const subMenuItemRender = withCtx(this.props.subMenuItemRender, this.ctx);
-        return subMenuItemRender({
-          item,
-          children: this.getNavMenuItems(item.children),
-        }) as VNode;
-      }
-      const menuTitle = item.meta?.title
-
-
-      const defaultTitle = item.meta?.icon ? (
-        <span class={`header-menu-item`}>
-          <span class={`header-menu-item-title`}>{menuTitle}</span>
-        </span>
-      ) : (
-        <span class={`header-menu-item`}>{menuTitle}</span>
-      );
-
-      return (
-        <Menu.SubMenu
-          title={defaultTitle}
-          key={item.path}
-          icon={<LazyIcon icon={item.meta?.icon} />}
-        >
-          {this.getNavMenuItems(item.children)}
-        </Menu.SubMenu>
-      )
-    }
-
-    const menuItemRender = this.props.menuItemRender && withCtx(this.props.menuItemRender, this.ctx);
-
-    const [title, icon] = this.getMenuItem(item);
-
-    return (
-      (menuItemRender && (menuItemRender({ item, title, icon }) as VNode)) || (
-        <Menu.Item disabled={item.meta?.disabled} danger={item.meta?.danger} key={item.path}>
-          {title}
-        </Menu.Item>
-      )
-    )
-  }
-
-  getMenuItem = (item: MenuDataItem) => {
-    const meta = { ...item.meta };
-    const target = (meta.target || null) as string | null;
-    const hasUrl = isUrl(item.path);
-    const CustomTag: any = (target && 'a') || this.RouterLink;
-    const props = { to: { path: item.path, ...item.meta } };
-    const attrs = hasUrl || target ? { ...item.meta, href: item.path, target } : {};
-
-    const icon = (item.meta?.icon && <LazyIcon icon={item.meta.icon} />) || undefined;
-    const menuTitle = item.meta?.title;
-    const defaultTitle = item.meta?.icon ? (
-      <CustomTag {...attrs} {...props} class={`header-menu-item`}>
-        {icon}
-        <span class={`header-menu-item-title`}>{menuTitle}</span>
-      </CustomTag>
-    ) : (
-      <CustomTag {...attrs} {...props} class={`header-menu-item`}>
-        <span>{menuTitle}</span>
-      </CustomTag>
-    );
-
-    return [defaultTitle, icon];
-  }
-
-  conversionPath = (path: string) => {
-    if (path && path.indexOf('http') === 0) {
-      return path;
-    }
-    return `/${path || ''}`.replace(/\/+/g, '/');
-  }
-}
-
-export default defineComponent({
-  name: 'BaseMenu',
-  props: baseMenuProps,
-  emits: ['update:openKeys', 'update:selectedKeys', 'click'],
-  setup(props, { emit }) {
-    const ctx = getCurrentInstance()
-
-    const menuUtil = new MenuUtil(props, ctx);
-
-    const handleOpenChange = (openKeys: Key[]): void => {
-      emit('update:openKeys', openKeys);
-    };
-
-    const handleSelect: SelectEventHandler = (args: SelectInfo): void => {
-      // ignore https? link handle selectkeys
-      if (isUrl(args.key as string)) {
-        return;
-      }
-      emit('update:selectedKeys', args.selectedKeys);
-    };
-
-    const handleClick: MenuClickEventHandler = (args: MenuInfo) => {
-      emit('click', args);
-    };
-
-    return () => (
-      <Menu
-        {...props}
-        key='Menu'
-        inlineIndent={16}
-        theme={props.theme as 'dark' | 'light'}
-        openKeys={props.openKeys === false ? [] : props.openKeys}
-        selectedKeys={props.selectedKeys || []}
-        onOpenChange={handleOpenChange}
-        onSelect={handleSelect}
-        onClick={handleClick}
-      >
-        {menuUtil.getNavMenuItems(props.menuData)}
-      </Menu>
-    )
-  }
-})
\ No newline at end of file
diff --git a/src/components/Layout/components/SiderMenu/SiderMenu.less b/src/components/Layout/components/SiderMenu/SiderMenu.less
deleted file mode 100644
index bc177192..00000000
--- a/src/components/Layout/components/SiderMenu/SiderMenu.less
+++ /dev/null
@@ -1,20 +0,0 @@
-.pro-layout-sider {
-  position: fixed;
-  top: 0;
-  left: 0;
-  z-index: 100;
-  height: 100%;
-  overflow: auto;
-  overflow-x: hidden;
-  box-shadow: 2px 0 8px 0 rgb(29 35 41 / 5%);
-
-  .ant-layout-sider-children {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-  }
-
-  .ant-menu-inline {
-    background: transparent;
-  }
-}
diff --git a/src/components/Layout/components/SiderMenu/SiderMenu.tsx b/src/components/Layout/components/SiderMenu/SiderMenu.tsx
deleted file mode 100644
index 89496a93..00000000
--- a/src/components/Layout/components/SiderMenu/SiderMenu.tsx
+++ /dev/null
@@ -1,186 +0,0 @@
-import { Layout, Menu } from 'ant-design-vue';
-import type { CSSProperties, ExtractPropTypes, FunctionalComponent, PropType } from 'vue'
-import type {
-  LogoRender,
-  MenuHeaderRender,
-  MenuExtraRender,
-  MenuContentRender,
-  CollapsedButtonRender,
-  WithFalse,
-  CustomRender
-} from '../../typings'
-import PropTypes from 'ant-design-vue/es/_util/vue-types';
-import { baseMenuProps } from 'components/Layout/components/SiderMenu/BaseMenu'
-import AIcon from '@/components/AIcon'
-import { useRouteContext } from 'components/Layout/RouteContext'
-import BaseMenu from './BaseMenu'
-import './SiderMenu.less'
-import { computed } from 'vue'
-import { omit } from 'lodash-es'
-
-const { Sider } = Layout
-
-export const defaultRenderLogo = (logo?: CustomRender, logoStyle?: CSSProperties): CustomRender => {
-  if (!logo) {
-    return null;
-  }
-  if (typeof logo === 'string') {
-    return <img src={logo} alt="logo" style={logoStyle} />;
-  }
-  if (typeof logo === 'function') {
-    // @ts-ignore
-    return logo();
-  }
-  return logo;
-};
-
-export const siderMenuProps = {
-  ...baseMenuProps,
-  logo: {
-    type: [Object, String, Function] as PropType<LogoRender>,
-    default: () => '',
-  },
-  logoStyle: {
-    type: Object as PropType<CSSProperties>,
-    default: () => undefined,
-  },
-  siderWidth: PropTypes.number.def(208),
-  headerHeight: PropTypes.number.def(48),
-  collapsedWidth: PropTypes.number.def(48),
-  menuHeaderRender: {
-    type: [Function, Object, Boolean] as PropType<MenuHeaderRender>,
-    default: () => undefined,
-  },
-  menuContentRender: {
-    type: [Function, Object, Boolean] as PropType<MenuContentRender>,
-    default: () => undefined,
-  },
-  menuExtraRender: {
-    type: [Function, Object, Boolean] as PropType<MenuExtraRender>,
-    default: () => undefined,
-  },
-  collapsedButtonRender: {
-    type: [Function, Object, Boolean] as PropType<CollapsedButtonRender>,
-    default: () => undefined,
-  },
-  onMenuHeaderClick: PropTypes.func,
-  onMenuClick: PropTypes.func,
-  onCollapse: {
-    type: Function as PropType<(collapsed: boolean) => void>,
-  },
-  onOpenKeys: {
-    type: Function as PropType<(openKeys: WithFalse<string[]>) => void>,
-  },
-  onSelect: {
-    type: Function as PropType<(selectedKeys: WithFalse<string[]>) => void>,
-  },
-}
-
-export type SiderMenuProps = Partial<ExtractPropTypes<typeof siderMenuProps>>;
-
-export const defaultRenderCollapsedButton = (collapsed?: boolean): CustomRender =>
-  collapsed ? <AIcon type={'MenuUnfoldOutlined'} /> : <AIcon type={'MenuFoldOutlined'} />;
-
-const SiderMenu: FunctionalComponent<SiderMenuProps> = (props, { slots, emit}) => {
-  const {
-    collapsed,
-    collapsedWidth = 48,
-    menuContentRender = false,
-    collapsedButtonRender = defaultRenderCollapsedButton,
-  } = props;
-
-  const context = useRouteContext();
-  const sSideWidth = computed(() => (props.collapsed ? props.collapsedWidth : props.siderWidth));
-
-
-  const handleSelect = ($event: string[]) => {
-    if (props.onSelect) {
-      props.onSelect([context.selectedKeys[0], ...$event]);
-    }
-  }
-
-  const defaultMenuDom = (
-    <BaseMenu
-      theme={props.theme as 'dark' | 'light'}
-      mode="inline"
-      menuData={context.flatMenuData}
-      collapsed={props.collapsed}
-      openKeys={context.openKeys}
-      selectedKeys={context.selectedKeys}
-      menuItemRender={props.menuItemRender}
-      subMenuItemRender={props.subMenuItemRender}
-      onClick={props.onMenuClick}
-      style={{
-        width: '100%',
-      }}
-      {...{
-        'onUpdate:openKeys': ($event: string[]) => props.onOpenKeys && props.onOpenKeys($event),
-        'onUpdate:selectedKeys': handleSelect,
-      }}
-    />
-  )
-
-  const Style = computed(() => {
-    return {
-      overflow: 'hidden',
-      height: '100vh',
-      zIndex: 18,
-      paddingTop: `${props.headerHeight}px`,
-      flex: `0 0 ${sSideWidth.value}px`,
-      minWidth: `${sSideWidth.value}px`,
-      maxWidth: `${sSideWidth.value}px`,
-      width: `${sSideWidth.value}px`,
-      transition: 'background-color 0.3s ease 0s, min-width 0.3s ease 0s, max-width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) 0s'
-    }
-  })
-
-  return (
-    <>
-      <div
-        style={Style.value}
-      ></div>
-      <Sider
-        collapsible
-        trigger={null}
-        collapsed={collapsed}
-        onCollapse={(collapse: boolean) => {
-          props.onCollapse?.(collapse);
-        }}
-        collapsedWidth={collapsedWidth}
-        style={omit(Style.value, ['transition'])}
-        width={sSideWidth.value}
-        theme={props.theme as 'dark' | 'light'}
-        class={'pro-layout-sider'}
-      >
-        <div style="flex: 1; overflow: hidden auto;">
-          {(menuContentRender && menuContentRender(props, defaultMenuDom)) || defaultMenuDom}
-        </div>
-        <div class={`header-links`}>
-          {collapsedButtonRender !== false ? (
-            <Menu
-              class={`header-link-menu`}
-              inlineIndent={16}
-              theme={props.theme as 'light' | 'dark'}
-              selectedKeys={[]}
-              openKeys={[]}
-              mode="inline"
-              onClick={() => {
-                if (props.onCollapse) {
-                  props.onCollapse(!props.collapsed);
-                }
-              }}
-            >
-              <Menu.Item key={'collapsed-button'} class={`header-collapsed-button`} title={false}>
-                {collapsedButtonRender && typeof collapsedButtonRender === 'function'
-                  ? collapsedButtonRender(collapsed)
-                  : collapsedButtonRender}
-              </Menu.Item>
-            </Menu>
-          ) : null}
-        </div>
-      </Sider>
-    </>
-  )
-}
-
-export default SiderMenu
\ No newline at end of file
diff --git a/src/components/Layout/defaultSetting.ts b/src/components/Layout/defaultSetting.ts
deleted file mode 100644
index 741ceda0..00000000
--- a/src/components/Layout/defaultSetting.ts
+++ /dev/null
@@ -1,68 +0,0 @@
-import type { PropType } from 'vue'
-import config from '../../../config/config'
-
-export interface PureSettings {
-  title: string
-  /**
-   * theme for nav menu
-   */
-  navTheme: 'dark' | 'light' | 'realDark' | undefined;
-  /**
-   * nav menu position: `side` or `top`
-   */
-  headerHeight?: number;
-  /**
-   * customize header height
-   */
-  layout: 'side' | 'top' | 'mix';
-  /**
-   * layout of content: `Fluid` or `Fixed`, only works when layout is top
-   */
-  contentWidth: 'Fluid' | 'Fixed';
-  menu: { locale?: boolean; defaultOpenAll?: boolean };
-  splitMenus?: boolean;
-}
-
-export const defaultSettings = {
-  navTheme: 'dark',
-  layout: 'side',
-  contentWidth: 'Fluid',
-  fixedHeader: false,
-  fixSiderbar: false,
-  menu: {},
-  headerHeight: 48,
-  iconfontUrl: '',
-  title: config.title
-};
-
-export const defaultSettingProps = {
-  navTheme: {
-    type: String as PropType<PureSettings['navTheme']>,
-    default: defaultSettings.navTheme,
-  },
-  title: {
-    type: String as PropType<PureSettings['title']>,
-    default: () => defaultSettings.title,
-  },
-  layout: {
-    type: String as PropType<PureSettings['layout']>,
-    default: defaultSettings.layout,
-  },
-  contentWidth: {
-    type: String as PropType<PureSettings['contentWidth']>,
-    default: defaultSettings.contentWidth,
-  },
-  menu: {
-    type: Object as PropType<PureSettings['menu']>,
-    default: () => {
-      return {
-        locale: true,
-      };
-    },
-  },
-  headerHeight: {
-    type: Number as PropType<PureSettings['headerHeight']>,
-    default: defaultSettings.headerHeight,
-  },
-}
-
diff --git a/src/components/Layout/hooks/context.ts b/src/components/Layout/hooks/context.ts
deleted file mode 100644
index c02aba9e..00000000
--- a/src/components/Layout/hooks/context.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { InjectionKey } from 'vue'
-
-export type ContextType<T> = any;
-
-export const useContext = <T>(
-  contextInjectKey: string | InjectionKey<ContextType<T>> = Symbol(),
-  defaultValue?: ContextType<T>
-): T => {
-  return inject(contextInjectKey, defaultValue || ({} as T));
-};
\ No newline at end of file
diff --git a/src/components/Layout/index.ts b/src/components/Layout/index.ts
index 66fb03d7..c4c946e2 100644
--- a/src/components/Layout/index.ts
+++ b/src/components/Layout/index.ts
@@ -1,4 +1,2 @@
-export { default as ProLayout } from './BasicLayout';
 export { default as BasicLayoutPage } from './BasicLayoutPage.vue'
-export { default as BlankLayoutPage } from './BlankLayoutPage.vue'
-export { default as PageContainer } from './components/PageContainer'
\ No newline at end of file
+export { default as BlankLayoutPage } from './BlankLayoutPage.vue'
\ No newline at end of file
diff --git a/src/components/Layout/typings.ts b/src/components/Layout/typings.ts
deleted file mode 100644
index b4e90976..00000000
--- a/src/components/Layout/typings.ts
+++ /dev/null
@@ -1,68 +0,0 @@
-import type { VNode, Slots } from 'vue';
-import { BreadcrumbProps } from 'components/Layout/RouteContext'
-import { VueNode } from 'ant-design-vue/es/_util/type'
-
-export interface MetaRecord {
-  /**
-   * @name 菜单的icon
-   */
-  icon?: string | VNode;
-  /**
-   * @name 自定义菜单的国际化 key，如果没有则返回自身
-   */
-  title?: string;
-  /**
-   * @name 在菜单中隐藏子节点
-   */
-  hideChildInMenu?: boolean;
-  /**
-   * @name 在菜单中隐藏自己和子节点
-   */
-  hideInMenu?: boolean;
-
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  [key: string]: any;
-}
-export interface MenuDataItem {
-  /**
-   * @name 用于标定选中的值，默认是 path
-   */
-  path: string;
-  name?: string | symbol;
-  meta?: MetaRecord;
-  /**
-   * @name 子菜单
-   */
-  children?: MenuDataItem[];
-}
-export type Theme = 'dark' | 'light';
-
-export type MenuTheme = Theme;
-export type MenuMode = 'horizontal' | 'vertical' | 'inline';
-export type LayoutType = 'side' | 'top' | 'mix';
-export type ProProps = Record<never, never>;
-export type TargetType = '_blank' | '_self' | unknown;
-export type BreadcrumbRender = BreadcrumbProps['itemRender'];
-
-export type CustomRender = VueNode;
-export type WithFalse<T> = T | false;
-export type LogoRender = WithFalse<CustomRender>;
-
-export type DefaultPropRender = WithFalse<CustomRender>;
-export type HeaderContentRender = WithFalse<() => CustomRender>;
-export type HeaderRender = WithFalse<(props: ProProps) => CustomRender>;
-export type FooterRender = WithFalse<(props: ProProps) => CustomRender>;
-export type RightContentRender = WithFalse<(props: ProProps) => CustomRender>;
-export type MenuItemRender = WithFalse<
-  (args: { item: MenuDataItem; title?: JSX.Element; icon?: JSX.Element }) => CustomRender
-  >;
-export type SubMenuItemRender = WithFalse<(args: { item: MenuDataItem; children?: CustomRender[] }) => CustomRender>;
-export type MenuHeaderRender = WithFalse<(logo: CustomRender, title: CustomRender, props?: ProProps) => CustomRender>;
-export type MenuContentRender = WithFalse<(props: ProProps, defaultDom: CustomRender) => CustomRender>;
-export type MenuFooterRender = WithFalse<(props?: ProProps) => CustomRender>;
-export type MenuExtraRender = WithFalse<(props?: ProProps) => CustomRender>;
-
-export type CollapsedButtonRender = WithFalse<(collapsed?: boolean) => CustomRender>;
-
-export type PageHeaderRender = WithFalse<(props?: ProProps) => CustomRender>;
-
diff --git a/src/components/Layout/utils.ts b/src/components/Layout/utils.ts
deleted file mode 100644
index 2422b857..00000000
--- a/src/components/Layout/utils.ts
+++ /dev/null
@@ -1,48 +0,0 @@
-import type { MenuDataItem } from 'components/Layout/typings'
-import type { RouteRecord, RouteRecordRaw } from 'vue-router'
-
-export function getMenuFirstChildren(menus: MenuDataItem[], key?: string) {
-  return key === undefined ? [] : (menus[menus.findIndex((menu) => menu.path === key)] || {}).children || [];
-}
-
-export function clearMenuItem(menusData: RouteRecord[] | RouteRecordRaw[]): RouteRecordRaw[] {
-  return menusData
-    .map((item: RouteRecord | RouteRecordRaw) => {
-      const finalItem = { ...item };
-      if (finalItem.meta?.hideInMenu) {
-        return null;
-      }
-
-      if (finalItem && finalItem?.children) {
-        if (
-          !finalItem.meta?.hideChildInMenu &&
-          finalItem.children.some(
-            (child: RouteRecord | RouteRecordRaw) => child && !child.meta?.hideInMenu
-          )
-        ) {
-          return {
-            ...item,
-            children: clearMenuItem(finalItem.children),
-          };
-        }
-        delete finalItem.children;
-      }
-      return finalItem;
-    })
-    .filter((item) => item) as RouteRecordRaw[];
-}
-
-export function flatMap(menusData: RouteRecord[]): MenuDataItem[] {
-  return menusData
-    .map((item) => {
-      const finalItem = { ...item } as MenuDataItem;
-      if (!finalItem.name || finalItem.meta?.hideInMenu) {
-        return null;
-      }
-      if (finalItem.children) {
-        delete finalItem.children;
-      }
-      return finalItem;
-    })
-    .filter((item) => item) as MenuDataItem[];
-}
diff --git a/src/components/index.ts b/src/components/index.ts
index fe3c80f6..2420c509 100644
--- a/src/components/index.ts
+++ b/src/components/index.ts
@@ -9,7 +9,8 @@ import Search from './Search'
 import NormalUpload from './NormalUpload/index.vue'
 import FileFormat from './FileFormat/index.vue'
 import JUpload from './JUpload/index.vue'
-import { BasicLayoutPage, BlankLayoutPage, PageContainer } from './Layout'
+import { BasicLayoutPage, BlankLayoutPage } from './Layout'
+import { PageContainer } from 'jetlinks-ui-components/es/components'
 import Ellipsis from './Ellipsis/index.vue'
 import JEmpty from './Empty/index.vue'
 import AMapComponent from './AMapComponent/index.vue'
diff --git a/src/main.ts b/src/main.ts
index c1d1c439..90409060 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -6,7 +6,6 @@ import router from './router'
 import './style.less'
 import jComponents from 'jetlinks-ui-components'
 import 'jetlinks-ui-components/es/style.js'
-import 'jetlinks-ui-components/es/style/variable.less'
 
 const app = createApp(App)
 
diff --git a/src/router/menu.ts b/src/router/menu.ts
index 0213719d..6d35c9db 100644
--- a/src/router/menu.ts
+++ b/src/router/menu.ts
@@ -23,10 +23,6 @@ export default [
         path: '/form',
         component: () => import('@/views/demo/Form.vue')
     },
-    {
-        path: '/search',
-        component: () => import('@/views/demo/Search.vue')
-    },
     {
         path: '/system/Api',
         component: () => import('@/views/system/Platforms/index.vue')
diff --git a/src/views/demo/Search.vue b/src/views/demo/Search.vue
deleted file mode 100644
index 6b1fb421..00000000
--- a/src/views/demo/Search.vue
+++ /dev/null
@@ -1,120 +0,0 @@
-<template>
-  <BasicLayoutPage
-
-  >
-    <div class='search'>
-      <Search
-        :columns='columns'
-        target='device-instance-search'
-        @search='search'
-      />
-      <Search
-        type='simple'
-        :columns='columns'
-        target='product'
-        @search='search'
-      />
-    </div>
-  </BasicLayoutPage>
-</template>
-
-<script setup name='demoSearch'>
-
-import { category } from '../../api/device/product'
-import BasicLayoutPage from '@/components/Layout/BasicLayoutPage.vue'
-
-const columns = [
-  {
-    title: '名称',
-    dataIndex: 'name',
-    key: 'name',
-    search: {
-      rename: 'deviceId',
-      type: 'select',
-      options: [
-        {
-          label: '测试1',
-          value: 'test1'
-        },
-        {
-          label: '测试2',
-          value: 'test2'
-        },
-        {
-          label: '测试3',
-          value: 'test3'
-        },
-      ],
-      handleValue: (v) => {
-        return '123'
-      }
-    }
-  },
-  {
-    title: '序号',
-    dataIndex: 'sortIndex',
-    key: 'sortIndex',
-    scopedSlots: true,
-    search: {
-      type: 'number',
-    }
-  },
-  {
-    title: 'ID',
-    dataIndex: 'id',
-    key: 'id',
-    search: {
-      type: 'string',
-    }
-  },
-  {
-    title: '时间',
-    dataIndex: 'date',
-    key: 'date',
-    search: {
-      type: 'date',
-    }
-  },
-  {
-    title: '时间2',
-    dataIndex: 'date2',
-    key: 'date2',
-    search: {
-      type: 'time',
-      defaultTermType: 'lt'
-    }
-  },
-  {
-    title: '分类',
-    dataIndex: 'classifiedName',
-    key: 'classifiedName',
-    search: {
-      first: true,
-      type: 'treeSelect',
-      options: async () => {
-        return new Promise((res) => {
-          category().then(resp => {
-            res(resp.result)
-          })
-        })
-      }
-    }
-  },
-  {
-    title: '操作',
-    key: 'action',
-    fixed: 'right',
-    width: 250,
-    scopedSlots: true,
-  }
-]
-const search = (params) => {
-  console.log(params)
-}
-</script>
-
-<style scoped>
-.search {
-  width: calc(100% - 330px);
-}
-</style>
\ No newline at end of file
diff --git a/src/views/system/Basis/index.vue b/src/views/system/Basis/index.vue
index 03517937..5c39a5cb 100644
--- a/src/views/system/Basis/index.vue
+++ b/src/views/system/Basis/index.vue
@@ -291,7 +291,6 @@ import { LocalStore } from '@/utils/comm';
 
 import { save_api, getDetails_api } from '@/api/system/basis';
 import { usePermissionStore } from '@/store/permission';
-import PageContainer from 'components/Layout/components/PageContainer'
 
 const action = ref<string>(`${BASE_API_PATH}/file/static`);
 const headers = ref({ [TOKEN_KEY]: LocalStore.get(TOKEN_KEY) });
diff --git a/yarn.lock b/yarn.lock
index f03c4f22..135ad32f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3898,8 +3898,8 @@ jetlinks-store@^0.0.3:
 
 jetlinks-ui-components@^1.0.0:
   version "1.0.0"
-  resolved "https://registry.jetlinks.cn/jetlinks-ui-components/-/jetlinks-ui-components-1.0.0.tgz#d12144cd57e9547a9fdec1b28fe4c4135fba50ce"
-  integrity sha512-oqeQpQqidJJMdPa/DzU4V++93r9i9IdHEvqNqDg/+zzw+AhbehtcaRKUVb2bQcMWWCnJWCdv0Md8K5NIdIaoDw==
+  resolved "https://registry.jetlinks.cn/jetlinks-ui-components/-/jetlinks-ui-components-1.0.0.tgz#dca7bb82e53f464990b0851635e8f82be6c69db6"
+  integrity sha512-pgJ0Uiw4Dxc0AU2GqaOaVhNYun1VEmv78OtJcir2sq9rVSIuXCtTl1eHYMPiiPb6z1fG677KKs1gqvrpUwhguQ==
   dependencies:
     "@vueuse/core" "^9.12.0"
     ant-design-vue "^3.2.15"