From b1df3aa2debb9fa48e6d923b8b47cfb64ca6d2b7 Mon Sep 17 00:00:00 2001
From: hujiale <13306077+hujiale9527@user.noreply.gitee.com>
Date: Wed, 23 Oct 2024 19:13:11 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web-test/.env                            |   4 +-
 apps/web-test/src/preferences.ts              |   2 +-
 .../src/router/routes/modules/dashboard.ts    |  60 +++-
 apps/web-test/src/store/auth.ts               |   2 +-
 apps/web-test/src/store/index.ts              |   1 +
 apps/web-test/src/store/tiles.ts              |  14 +
 .../src/views/dashboard/home/addtodo.vue      |  98 ++++++
 .../src/views/dashboard/home/audit.vue        |   2 +-
 .../home/components/CardTiles/index.vue       | 127 +++++++-
 .../home/components/GridGroup/index.vue       | 137 +++-----
 .../home/components/Output1/index.vue         |  16 +-
 .../home/components/Output2/index.vue         |   9 +
 .../home/components/Output5/index.vue         |   2 +-
 .../src/views/dashboard/home/index.vue        | 176 ++++------
 .../src/views/dashboard/home/operation.vue    | 135 ++++++++
 .../src/views/dashboard/home/portal.vue       |  12 +-
 .../src/views/dashboard/home/register.vue     | 305 ++++++++++++++++++
 .../src/views/dashboard/home/tiles.ts         | 110 ++++---
 .../src/views/dashboard/home/todo.vue         |  80 +++++
 .../src/views/dashboard/home/usertemplate.vue |  86 +++++
 .../widgets/user-dropdown/user-dropdown.vue   |   4 +-
 21 files changed, 1092 insertions(+), 290 deletions(-)
 create mode 100644 apps/web-test/src/store/tiles.ts
 create mode 100644 apps/web-test/src/views/dashboard/home/addtodo.vue
 create mode 100644 apps/web-test/src/views/dashboard/home/operation.vue
 create mode 100644 apps/web-test/src/views/dashboard/home/register.vue
 create mode 100644 apps/web-test/src/views/dashboard/home/todo.vue
 create mode 100644 apps/web-test/src/views/dashboard/home/usertemplate.vue

diff --git a/apps/web-test/.env b/apps/web-test/.env
index c14a467f..c6e33a00 100644
--- a/apps/web-test/.env
+++ b/apps/web-test/.env
@@ -1,5 +1,5 @@
 # 应用标题
-VITE_APP_TITLE=Vben Admin Antd
+VITE_APP_TITLE=西北油田办公平台
 
 # 应用命名空间，用于缓存、store等功能的前缀，确保隔离
-VITE_APP_NAMESPACE=vben-web-antd
+VITE_APP_NAMESPACE=xbj
diff --git a/apps/web-test/src/preferences.ts b/apps/web-test/src/preferences.ts
index 1f86698c..1f1f4a2b 100644
--- a/apps/web-test/src/preferences.ts
+++ b/apps/web-test/src/preferences.ts
@@ -7,7 +7,7 @@ import { defineOverridesPreferences } from '@vben/preferences';
 export const overridesPreferences = defineOverridesPreferences({
   // overrides
   app: {
-    name: import.meta.env.VITE_APP_TITLE,
+    name: '西北油田办公平台',
     accessMode: 'frontend',
     authPageLayout: 'panel-center',
     colorGrayMode: false,
diff --git a/apps/web-test/src/router/routes/modules/dashboard.ts b/apps/web-test/src/router/routes/modules/dashboard.ts
index 3f60bfe2..c8e8a8b4 100644
--- a/apps/web-test/src/router/routes/modules/dashboard.ts
+++ b/apps/web-test/src/router/routes/modules/dashboard.ts
@@ -14,7 +14,8 @@ const getRouter = (list: any, type: string) => {
         component: () => null,
         meta: {
           title: list.children[i]?.name,
-          link: list.children[i]?.url
+          link: list.children[i]?.url,
+          icon: 'oui:dot'
         },
       })
     }
@@ -38,7 +39,8 @@ const getRouter = (list: any, type: string) => {
             component: () => null,
             meta: {
               title: list[i].children[j]?.name,
-              link: list[i].children[j]?.url
+              link: list[i].children[j]?.url,
+              icon: 'oui:dot'
             },
           })
         }
@@ -96,6 +98,60 @@ const routes: RouteRecordRaw[] = [
           icon: 'lucide:area-chart',
           title: '磁贴审核',
         },
+      },{
+        name: 'register',
+        path: '/register',
+        component: () => import('#/views/dashboard/home/register.vue'),
+        // component: () => import('#/views/dashboard/home/main.vue'),
+        meta: {
+          hideInMenu: true,
+          icon: 'lucide:area-chart',
+          title: '注册磁贴',
+        },
+      }
+      ,{
+        name: 'usertemplate',
+        path: '/usertemplate',
+        component: () => import('#/views/dashboard/home/usertemplate.vue'),
+        // component: () => import('#/views/dashboard/home/main.vue'),
+        meta: {
+          hideInMenu: true,
+          icon: 'lucide:area-chart',
+          title: '用户模板',
+        },
+      },
+      {
+        name: 'operation',
+        path: '/operation',
+        component: () => import('#/views/dashboard/home/operation.vue'),
+        // component: () => import('#/views/dashboard/home/main.vue'),
+        meta: {
+          hideInMenu: true,
+          icon: 'lucide:area-chart',
+          title: '业务域',
+        },
+      },
+      {
+        name: 'todo',
+        path: '/todo',
+        component: () => import('#/views/dashboard/home/todo.vue'),
+        // component: () => import('#/views/dashboard/home/main.vue'),
+        meta: {
+          hideInMenu: true,
+          icon: 'lucide:area-chart',
+          title: '代办管理',
+        },
+      },
+      {
+        name: 'addtodo',
+        path: '/addtodo',
+        component: () => import('#/views/dashboard/home/addtodo.vue'),
+        // component: () => import('#/views/dashboard/home/main.vue'),
+        meta: {
+          hideInMenu: true,
+          icon: 'lucide:area-chart',
+          title: '新建应用',
+        },
       },
       // {
       //   name: 'test',
diff --git a/apps/web-test/src/store/auth.ts b/apps/web-test/src/store/auth.ts
index e9e89634..5b3f0e42 100644
--- a/apps/web-test/src/store/auth.ts
+++ b/apps/web-test/src/store/auth.ts
@@ -60,7 +60,7 @@ export const useAuthStore = defineStore('auth', () => {
 
         if (userInfo?.realName) {
           notification.success({
-            description: `${$t('authentication.loginSuccessDesc')}:${userInfo?.realName}`,
+            description: `${$t('authentication.loginSuccessDesc')}`,
             duration: 3,
             message: $t('authentication.loginSuccess'),
           });
diff --git a/apps/web-test/src/store/index.ts b/apps/web-test/src/store/index.ts
index 269586ee..a5b6a2f5 100644
--- a/apps/web-test/src/store/index.ts
+++ b/apps/web-test/src/store/index.ts
@@ -1 +1,2 @@
 export * from './auth';
+export * from './tiles'
diff --git a/apps/web-test/src/store/tiles.ts b/apps/web-test/src/store/tiles.ts
new file mode 100644
index 00000000..6ed43666
--- /dev/null
+++ b/apps/web-test/src/store/tiles.ts
@@ -0,0 +1,14 @@
+import {defineStore} from 'pinia'
+export const UseTilesStore = defineStore('tiles',{
+    state: () => {
+        return {
+            tilesIsMove : !1, // 磁贴是否是可编辑状态
+           
+        }
+    },
+    actions: {
+        setTilesIsMove(data: boolean){
+            this.tilesIsMove = data
+        }
+    }
+})
\ No newline at end of file
diff --git a/apps/web-test/src/views/dashboard/home/addtodo.vue b/apps/web-test/src/views/dashboard/home/addtodo.vue
new file mode 100644
index 00000000..f93498e4
--- /dev/null
+++ b/apps/web-test/src/views/dashboard/home/addtodo.vue
@@ -0,0 +1,98 @@
+<template>
+    <div class="w-[100%] px-2 bg-background mt-3 min-w-[1200px]">
+        <div class="w-[70%] mx-auto pt-3">
+            <Steps :current="nowCurrent" :items="[
+                {
+                    title: '添加应用',
+                },
+                {
+                    title: '完成',
+                },
+            ]"></Steps>
+        </div>
+        <Form class="mx-auto w-[40%] mt-5 h-[70vh]" :labelCol="{ style: { width: '80px' } }">
+            <FormItem label="添加类型" :rules="[{ required: true, message: '请添加类型' }]">
+                <RadioGroup v-model:value="formData.type">
+                    <Radio :value="1">自定义</Radio>
+                    <Radio :value="2">从列表中选择</Radio>
+                </RadioGroup>
+            </FormItem>
+            <FormItem label="应用编码" :rules="[{ required: true, message: '请输入应用编码' }]">
+                <Input placeholder="请输入"></Input>
+            </FormItem>
+            <FormItem label="应用名称" :rules="[{ required: true, message: '请输入应用名称' }]">
+                <Input placeholder="请输入"></Input>
+            </FormItem>
+            <FormItem label="接口地址">
+                <Input placeholder="请输入"></Input>
+            </FormItem>
+            <FormItem label="应用顺序" width="20px">
+                <inputNumber>
+                    <template #addonAfter>
+                        <PlusOutlined />
+                    </template>
+                    <template #addonBefore>
+                        <MinusOutlined />
+                    </template>
+                </InputNumber>
+            </FormItem>
+            <FormItem label="  " :colon="false" :wrapperCol="{ style: { width: '80px' } }">
+                <Space warp>
+                    <Button type="primary">提交</Button>
+                    <Button @click="closeNowTab">取消</Button>
+                </Space>
+            </FormItem>
+        </Form>
+
+    </div>
+</template>
+<script setup lang="ts">
+import { ref, reactive, watch } from 'vue'
+import { Steps, Space,RadioGroup,Radio } from 'ant-design-vue';
+import { PlusOutlined, MinusOutlined } from '@ant-design/icons-vue';
+
+import { Button, Form, FormItem, Input, InputNumber, Select, Card, Pagination, Textarea, Checkbox } from 'ant-design-vue';
+import { useRouter } from "vue-router";
+const router = useRouter();
+
+import { useTabs } from '@vben/hooks';
+const { closeCurrentTab } = useTabs();
+function closeNowTab() {
+    router.go(-1)
+    closeCurrentTab();
+}
+let nowCurrent = ref(0)
+
+let formData = reactive({
+    type: 1,
+})
+</script>
+<style scoped lang="scss">
+.c-item {
+    border: 1px solid #ccc;
+    flex: .3333;
+    height: calc(100vh - 150px);
+}
+
+.template-item {
+    border: 1px solid #ccc;
+    width: 30%;
+    cursor: pointer;
+    position: relative;
+
+    .active-icon {
+        position: absolute;
+        right: 3px;
+        top: 3px;
+    }
+
+    &.active {
+        border: 1px solid hsl(var(--primary));
+    }
+}
+
+.form-box {
+    max-height: 90%;
+    overflow-y: auto;
+}
+</style>
\ No newline at end of file
diff --git a/apps/web-test/src/views/dashboard/home/audit.vue b/apps/web-test/src/views/dashboard/home/audit.vue
index 8132dbe0..65bb363d 100644
--- a/apps/web-test/src/views/dashboard/home/audit.vue
+++ b/apps/web-test/src/views/dashboard/home/audit.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="main-box bg-[#ecf3f8] px-3 mt-3 h-[100%]">
+    <div class="main-box px-3 bg-background mt-3 h-[100%]">
         <div class="top-box flex justify-between items-center">
             <Button type="primary">批量审批</Button>
             <div class="flex items-center gap-2">
diff --git a/apps/web-test/src/views/dashboard/home/components/CardTiles/index.vue b/apps/web-test/src/views/dashboard/home/components/CardTiles/index.vue
index b1817b81..13e71c75 100644
--- a/apps/web-test/src/views/dashboard/home/components/CardTiles/index.vue
+++ b/apps/web-test/src/views/dashboard/home/components/CardTiles/index.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="content-box bg-[#fff] px-3 mt-2 h-[100%]">
+    <div class="content-box px-3 mt-2 h-[100%]">
         <div class="filter-box py-3">
             <Form layout="inline">
                 <FormItem label="标题">
@@ -40,7 +40,7 @@
                 <div class="mask-box hidden">
                     <div v-if="type == 'portal'"
                         class="absolute inset-x-0 inset-y-0 bg-[rgba(0,0,0,.3)] flex items-center justify-center gap-4">
-                        <Button type="primary">修改</Button>
+                        <Button type="primary" @click="openInfo(item)">修改</Button>
                         <Button type="primary" danger>删除</Button>
                     </div>
                     <div v-else-if="type == 'audit'"
@@ -48,33 +48,99 @@
                         <Button type="primary">通过</Button>
                         <Button type="primary" danger>驳回</Button>
                     </div>
-                    <ExpandOutlined class="absolute top-2 right-2 text-[#fff]" />
+                    <ExpandOutlined class="absolute top-2 right-2 text-[#fff] cursor-pointer" />
                 </div>
             </Card>
         </div>
         <div class="flex justify-end">
             <Pagination v-model:current="current" :total="500" />
         </div>
+
+        <Modal v-model:open="editcardShow" title="修改磁贴" :width="600">
+            <template #footer>
+                <div class="w-[100%] flex justify-center">
+                    <Button type="primary">预览磁贴</Button>
+                </div>
+            </template>
+            <div class="flex  gap-2">
+                <Form layout="inline" :label-col="labelCol" :wrapperCol="wrapperCol">
+                    <FormItem label="业务域" required>
+                        <Select placeholder="请选择" disabled></Select>
+                    </FormItem>
+                    <FormItem label="适用范围" required>
+                        <Select v-model:value="scope" disabled :options="options2" placeholder="请选择"></Select>
+                    </FormItem>
+                    <FormItem label="编码" required>
+                        <Input disabled v-model:value="editForm.code"></Input>
+                    </FormItem>
+                    <FormItem label="标题" required>
+                        <Input v-model:value="editForm.title"></Input>
+                    </FormItem>
+                    <FormItem label="数据源">
+                        <Input></Input>
+                    </FormItem>
+                    <FormItem label="磁贴大小">
+                        <div class="flex items-center">
+                            <div class="flex items-center">
+                                宽：
+                                <Select v-model:value="editForm.size.w" disabled>
+                                    <SelectOption value="1">1</SelectOption>
+                                    <SelectOption value="2">2</SelectOption>
+                                </Select>
+                            </div>
+                            <div class="flex items-center">
+                                高：
+                                <Select v-model:value="editForm.size.h" disabled>
+                                    <SelectOption value="1">1</SelectOption>
+                                    <SelectOption value="2">2</SelectOption>
+                                </Select>
+                            </div>
+                        </div>
+                    </FormItem>
+                    <FormItem label="图标" required>
+                        <Input></Input>
+                    </FormItem>
+                    <FormItem label="打开方式">
+                        <Select v-model:value="scope" :options="options2" placeholder="请选择"></Select>
+                    </FormItem>
+                    <FormItem label="作者" required>
+                        <Input></Input>
+                    </FormItem>
+                    <FormItem label="联系方式" required>
+                        <Input></Input>
+                    </FormItem>
+                    <FormItem label="链接地址" required :wrapperCol="itemWrapperCol">
+                        <div>
+                            <Input v-model:value="editForm.link"></Input>
+                            <Checkbox>经过授权才可使用</Checkbox>
+                        </div>
+                    </FormItem>
+                    <FormItem label="描述" :wrapperCol="itemWrapperCol">
+                        <Textarea v-model:value="editForm.doc" ></Textarea>
+                    </FormItem>
+                </Form>
+            </div>
+        </Modal>
     </div>
 </template>
 <script setup lang="ts">
-import { ref,toRefs } from 'vue';
+import { ref, toRefs, reactive } from 'vue';
 
 import { ExpandOutlined } from '@ant-design/icons-vue';
-import { Button, Form, FormItem, Input, Select, Card, Pagination } from 'ant-design-vue';
+import { Button, Form, FormItem, Input,Checkbox, Select, Card, Pagination, Modal, SelectOption,Textarea  } from 'ant-design-vue';
 import { tilesList } from '../../tiles'
 const props = defineProps({
-  type: {
-    type: String,
-    default: ''
-  },
-  list: {
-    type: Object,
-    default: []
-  }
+    type: {
+        type: String,
+        default: ''
+    },
+    list: {
+        type: Object,
+        default: []
+    }
 })
 
-let { list,type } = toRefs(props);
+let { list, type } = toRefs(props);
 for (let i = 0; i < tilesList.length; i++) {
     let obj: any = {}
     obj.name = tilesList[i]?.name;
@@ -92,7 +158,38 @@ const options2 = [
         label: '全部',
     },
 ]
-let current = ref(1)
+let current = ref(1);
+
+let editcardShow = ref(false)
+
+let openInfo = (info) => {
+    editcardShow.value = true;
+    editForm.code = info.code;
+    editForm.title = info.name;
+}
+let editForm = reactive({
+    domains: '',
+    scope: '',
+    code: "",
+    title: '',
+    dataSources: '',
+    size: {
+        w: '',
+        h: ''
+    },
+    icon: '',
+    openType: '',
+    author: '',
+    number: '',
+    link: 'www.baidu.com',
+    auth: true,
+    doc: ''
+
+})
+const labelCol = { style: { width: '100px',margin: '0 0 10px 0' } };
+const wrapperCol = { style: { width: '150px' } };
+const itemWrapperCol = { style: { width: '415px' } };
+
 </script>
 <style scoped lang="scss">
 .tiles-list {
diff --git a/apps/web-test/src/views/dashboard/home/components/GridGroup/index.vue b/apps/web-test/src/views/dashboard/home/components/GridGroup/index.vue
index 5faf0602..d51307d3 100644
--- a/apps/web-test/src/views/dashboard/home/components/GridGroup/index.vue
+++ b/apps/web-test/src/views/dashboard/home/components/GridGroup/index.vue
@@ -6,6 +6,9 @@ import { CheckboxGroup, Checkbox, Collapse, CollapsePanel, FloatButtonGroup, Flo
 
 
 import { toRefs } from 'vue'
+import { UseTilesStore } from '#/store';
+import { storeToRefs } from 'pinia'
+const tilesStore = UseTilesStore();
 
 const props = defineProps({
   list: {
@@ -16,44 +19,44 @@ const props = defineProps({
 let { list } = toRefs(props);
 
 const { proxy } = getCurrentInstance();
-const layout = ref(JSON.parse(JSON.stringify(list.value)));
+const layout = ref(list.value)
 onMounted(() => {
-  layout.value = [
-    {
-      "x": 1,
-      "y": 0,
-      "w": 1,
-      "h": 2,
-      "i": "1728964990256",
-      "component": {
-        "name1": "AUTO_1612155980933.png",
-        "name2": "AUTO_1612155980933_C会议管理.png",
-        "size": "2x2",
-        "name": "会议管理",
-        "w": 1,
-        "h": 2,
-        "component": "../Output1/index.vue",
-        "i": 0
-      },
-    },
-    {
-      "x": 4,
-      "y": 0,
-      "w": 1,
-      "h": 2,
-      "i": "1728965029729",
-      "component": {
-        "name1": "AUTO_1612155980933.png",
-        "name2": "AUTO_1612155980933_C会议管理.png",
-        "size": "2x2",
-        "name": "会议管理",
-        "w": 1,
-        "h": 2,
-        "component": "../Output1/index.vue",
-        "i": 0
-      },
-    },
-  ]
+  // layout.value = [
+  //   {
+  //     "x": 1,
+  //     "y": 0,
+  //     "w": 1,
+  //     "h": 2,
+  //     "i": "1728964990256",
+  //     "component": {
+  //       "name1": "AUTO_1612155980933.png",
+  //       "name2": "AUTO_1612155980933_C会议管理.png",
+  //       "size": "2x2",
+  //       "name": "会议管理",
+  //       "w": 1,
+  //       "h": 2,
+  //       "component": "../Output1/index.vue",
+  //       "i": 0
+  //     },
+  //   },
+  //   {
+  //     "x": 4,
+  //     "y": 0,
+  //     "w": 1,
+  //     "h": 2,
+  //     "i": "1728965029729",
+  //     "component": {
+  //       "name1": "AUTO_1612155980933.png",
+  //       "name2": "AUTO_1612155980933_C会议管理.png",
+  //       "size": "2x2",
+  //       "name": "会议管理",
+  //       "w": 1,
+  //       "h": 2,
+  //       "component": "../Output1/index.vue",
+  //       "i": 0
+  //     },
+  //   },
+  // ]
 })
 const colNum = 12;
 let defaultH = 2;
@@ -69,48 +72,6 @@ const DragPos = {
   h: null,
   i: null,
 };
-//  [
-//   {
-//     id: '1-1',
-//     title: '磁贴管理(2×2)',
-//     name: 'xl',
-//     component: './components/Output1/index.vue',
-//     des: '磁贴管理(2×2)',
-//     w: 1,
-//     h: 2,
-//     img: 'WORKBENCH_MANAGER.png'
-//   },
-//   {
-//     id: '1-2',
-//     title: '饼图示例(8×8)',
-//     name: 'xxl',
-//     component: './components/Output2/index.vue',
-//     des: '饼图示例(8×8)',
-//     w: 8,
-//     h: 8,
-//     img: 'AUTO_1620294688040.png'
-//   },
-//   {
-//     id: '1-3',
-//     title: '报表示例(4×4)',
-//     name: 'xxxl',
-//     component: './components/Output3/index.vue',
-//     des: '报表示例(4×4)',
-//     w: 4,
-//     h: 4,
-//     img: "AUTO_1621594591994.png"
-//   },
-//   {
-//     id: '1-4',
-//     title: '列表示例(16×8)',
-//     name: 'xxxxl',
-//     component: './components/Output4/index.vue',
-//     des: '列表示例(16×8)',
-//     w: 16,
-//     h: 8,
-//     img: 'AUTO_1620296071109.png'
-//   },
-// ];
 let currentDragCom = null;
 onMounted(() => {
   document.addEventListener(
@@ -134,6 +95,8 @@ const loadComponent = (path) => {
 };
 // 处理布局数据中的组件
 const processLayout = (layoutSetInfo) => {
+  console.log('layoutSetInfo',layoutSetInfo);
+  
   for (const item of layoutSetInfo) {
     if (!item.component) {
       continue;
@@ -309,7 +272,7 @@ let addTiles = (val) => {
   selectTilseArr.value = arr
 }
 // 磁贴是否可拖拽
-let tilesIsMove = ref(true)
+let {tilesIsMove} = storeToRefs(tilesStore)
 // 取消和确定编辑磁贴
 let cancelOrSure = (type) => {
   if (type == 'cance') {
@@ -320,14 +283,20 @@ let cancelOrSure = (type) => {
     tilesIsMove.value = true;
   }
 }
+
+// 页面跳转
+let goPage = (item) => {
+  if (tilesIsMove) return;
+  router.push(item?.path);
+}
 </script>
 
 <template>
   <div class="container-group">
     <!-- 自定义布局的部分 -->
     <div class="grid-box  select-none">
-      <grid-layout ref="gridLayout" v-model:layout="layout" :col-num="3" :is-draggable="tilesIsMove" :is-mirrored="false"
-        :auto-size="false" :is-resizable="tilesIsMove" :margin="[10, 10]" :row-height="55"
+      <grid-layout ref="gridLayout" v-model:layout="layout" :col-num="4" :is-draggable="tilesIsMove" :is-mirrored="false"
+        :auto-size="false" :is-resizable="false" :margin="[10, 10]" :row-height="40"
         :vertical-compact="true">
 
         <grid-item v-for="(item, index ) in layout" :key="item.i" ref="gridItem" :h="item.h" :i="item.i" :w="item.w"
@@ -335,8 +304,8 @@ let cancelOrSure = (type) => {
           <span class="close" @click="delItem(item)" v-if="tilesIsMove">
             <CloseCircleFilled style="color: #f10215;" />
           </span>
-          <div class="py-2 px-4 box-border w-[100%] h-[100%] us-card-box bg-background">
-            <component :is="item.loadComp" :data="item" :key="item.i" />
+          <div class="py-2 px-4 box-border w-[100%] h-[100%] us-card-box bg-background" @click="goPage(item)">
+            <component :is="loadComponent(item.component)" :data="item" :key="item.i" :type="'sm'"/>
           </div>
         </grid-item>
       </grid-layout>
diff --git a/apps/web-test/src/views/dashboard/home/components/Output1/index.vue b/apps/web-test/src/views/dashboard/home/components/Output1/index.vue
index 108e72ec..a8e9177f 100644
--- a/apps/web-test/src/views/dashboard/home/components/Output1/index.vue
+++ b/apps/web-test/src/views/dashboard/home/components/Output1/index.vue
@@ -1,7 +1,7 @@
 <template>
   <a href="/portal" class="pointer-events-none inline-block w-[100%] h-[100%] flex flex-col items-center gap-1">
-    <img :src="'/xbyt/'+data.component.name2" alt="" class="w-full object-content">
-    <div class="text-sm">{{ data.component.name }}</div>
+    <img :src="'/xbyt/'+data.name2" alt="" class="w-full object-content">
+    <div class="text-sm t-name" :class="type=='sm'?'text-xs':''" >{{ data.name }}</div>
   </a>
 </template>
 <script setup lang="ts">
@@ -11,10 +11,16 @@ const props = defineProps({
     type: Object,
     default: {}
   },
+  type: {
+    type: String,
+    default: ''
+  }
 })
-console.log('propsprops', props.data);
-let { data } = toRefs(props);
+let { data,type } = toRefs(props);
 
 </script>
-<style>
+<style scoped lang="scss">
+.t-name {
+  white-space: nowrap;
+}
 </style>
\ No newline at end of file
diff --git a/apps/web-test/src/views/dashboard/home/components/Output2/index.vue b/apps/web-test/src/views/dashboard/home/components/Output2/index.vue
index 2a5570f1..41e52090 100644
--- a/apps/web-test/src/views/dashboard/home/components/Output2/index.vue
+++ b/apps/web-test/src/views/dashboard/home/components/Output2/index.vue
@@ -79,6 +79,9 @@ import { preferences } from '@vben/preferences';
 
 watch(() => preferences.theme.mode, (n: any) => {
   VxeUI.setTheme(n)
+},{
+    deep: true,
+    immediate: true
 })
 
 interface RowVO {
@@ -171,9 +174,15 @@ watch(
   overflow: hidden; //超出隐藏
   white-space: nowrap; //超出不换行
   overflow-x: auto; //出现水平滚动条
+  padding-bottom: 3px;
+  margin-bottom: 10px;
   li {
     display: inline-block;
     margin-right: 10px;
   }
 }
+
+.f-btn-box::-webkit-scrollbar {
+  height: 5px !important;
+}
 </style>
\ No newline at end of file
diff --git a/apps/web-test/src/views/dashboard/home/components/Output5/index.vue b/apps/web-test/src/views/dashboard/home/components/Output5/index.vue
index c7010af7..bbc2975e 100644
--- a/apps/web-test/src/views/dashboard/home/components/Output5/index.vue
+++ b/apps/web-test/src/views/dashboard/home/components/Output5/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="custom-card w-[100%] h-[100%] flex flex-col">
     <div class="card-name titlt-top">我的应用</div>
-    <GridGroup :list="data.component.childer" class="flex-1"></GridGroup>
+    <GridGroup :list="data.childer" class="flex-1"></GridGroup>
   </div>
 </template>
 <script setup lang="ts">
diff --git a/apps/web-test/src/views/dashboard/home/index.vue b/apps/web-test/src/views/dashboard/home/index.vue
index 4e3420c0..eb80bcc3 100644
--- a/apps/web-test/src/views/dashboard/home/index.vue
+++ b/apps/web-test/src/views/dashboard/home/index.vue
@@ -6,6 +6,11 @@ import { CheckboxGroup, Checkbox, Collapse, CollapsePanel, FloatButtonGroup, Flo
 
 import { tilesList } from './tiles'
 import { useRouter } from "vue-router";
+import { UseTilesStore } from '#/store';
+import { storeToRefs } from 'pinia'
+const tilesStore = UseTilesStore();
+
+
 const router = useRouter();
 
 // import GridGroup from './components/GridGroup/index.vue'
@@ -13,62 +18,17 @@ const router = useRouter();
 const { proxy, ctx: that } = getCurrentInstance();
 const layout = ref([]);
 onMounted(() => {
-  layout.value = [
-    {
-      "x": 1,
-      "y": 0,
-      "w": 1,
-      "h": 2,
-      "i": "1728964990256",
-      "component": {
-        "name1": "AUTO_1612155980933.png",
-        "name2": "AUTO_1612155980933_C会议管理.png",
-        "size": "2x2",
-        "name": "会议管理",
-        "w": 1,
-        "h": 2,
-        "component": "./components/Output1/index.vue",
-        "i": 0,
-        "path": "/portal"
-      },
-    },
-    {
-      "x": 0,
-      "y": 2,
-      "w": 8,
-      "h": 5,
-      "i": "1728964991972",
-      "component": {
-        "name1": "AUTO_1612159241967.png",
-        "name2": "AUTO_1612159241967_C车辆调度.png",
-        "size": "2x2",
-        "name": "车辆调度",
-        "w": 8,
-        "h": 5,
-        "component": "./components/Output2/index.vue",
-        "i": 2,
-        "dom": '.titlt-top'
-      },
-    },
-    {
-      "x": 4,
-      "y": 0,
-      "w": 1,
-      "h": 2,
-      "i": "1728965029729",
-      "component": {
-        "name1": "AUTO_1612155980933.png",
-        "name2": "AUTO_1612155980933_C会议管理.png",
-        "size": "2x2",
-        "name": "会议管理",
-        "w": 1,
-        "h": 2,
-        "component": "./components/Output1/index.vue",
-        "i": 0,
-        "path": "/audit"
-      },
+  let layoutStr = JSON.parse(localStorage.getItem('layout'));
+  if (layoutStr && layoutStr.length > 0) {
+    for (let i = 0; i < layoutStr.length; i++) {
+      if (layoutStr[i]&&layoutStr[i].component) {
+        // layoutStr[i].component = loadComponent(layoutStr[i].component);
+      }
     }
-  ]
+    layout.value = layoutStr
+  }
+  console.log('oooo',layout.value);
+  
 })
 const colNum = 12;
 let defaultH = 2;
@@ -85,48 +45,6 @@ const DragPos = {
   i: null,
 };
 const componentsInfo = tilesList
-//  [
-//   {
-//     id: '1-1',
-//     title: '磁贴管理(2×2)',
-//     name: 'xl',
-//     component: './components/Output1/index.vue',
-//     des: '磁贴管理(2×2)',
-//     w: 1,
-//     h: 2,
-//     img: 'WORKBENCH_MANAGER.png'
-//   },
-//   {
-//     id: '1-2',
-//     title: '饼图示例(8×8)',
-//     name: 'xxl',
-//     component: './components/Output2/index.vue',
-//     des: '饼图示例(8×8)',
-//     w: 8,
-//     h: 8,
-//     img: 'AUTO_1620294688040.png'
-//   },
-//   {
-//     id: '1-3',
-//     title: '报表示例(4×4)',
-//     name: 'xxxl',
-//     component: './components/Output3/index.vue',
-//     des: '报表示例(4×4)',
-//     w: 4,
-//     h: 4,
-//     img: "AUTO_1621594591994.png"
-//   },
-//   {
-//     id: '1-4',
-//     title: '列表示例(16×8)',
-//     name: 'xxxxl',
-//     component: './components/Output4/index.vue',
-//     des: '列表示例(16×8)',
-//     w: 16,
-//     h: 8,
-//     img: 'AUTO_1620296071109.png'
-//   },
-// ];
 let currentDragCom = null;
 onMounted(() => {
   document.addEventListener(
@@ -154,7 +72,7 @@ const processLayout = (layoutSetInfo) => {
     if (!item.component) {
       continue;
     }
-    const resComp = loadComponent(item.component.component);
+    const resComp = loadComponent(item.component);
     item.loadComp = resComp;
   }
 };
@@ -260,12 +178,13 @@ const dragend = (e) => {
     layout.value.splice(delIndex, 1);
     const loadComp = loadComponent(currentDragCom.component);
     layout.value.push({
+      ...currentDragCom,
       x: DragPos.x,
       y: DragPos.y,
       w: currentDragCom.w,
       h: currentDragCom.h,
       i: DragPos.i,
-      component: currentDragCom,
+      isNew: true,
       loadComp,
     });
     proxy.$refs.gridLayout.dragEvent(
@@ -322,22 +241,34 @@ let addTiles = (val) => {
 
   selectTilseArr.value = arr
 }
-// 磁贴是否可拖拽
-let tilesIsMove = ref(false)
+// 磁贴是否可编辑（删除、拖拽、大小）
+let { tilesIsMove } = storeToRefs(tilesStore)
 // 取消和确定编辑磁贴
 let cancelOrSure = (type) => {
   if (type == 'cance') {
     editTiles.value = false;
-    tilesIsMove.value = false;
+    tilesStore.setTilesIsMove(false)
+    layout.value = layout.value.filter((item) => {
+      return !item.isNew
+    })
+
   } else if (type == 'sure') {
+    editTiles.value = false;
+    tilesStore.setTilesIsMove(false)
+    layout.value.forEach((element, index) => {
+      delete element.isNew
+    });
+    let newLayout = JSON.parse(JSON.stringify(layout.value));
+    window.localStorage.setItem('layout', JSON.stringify(newLayout));
+  } else if (type == 'edit') {
     editTiles.value = true;
-    tilesIsMove.value = true;
+    tilesStore.setTilesIsMove(true)
   }
 }
 // 页面跳转
 let goPage = (item) => {
   if (tilesIsMove.value) return;
-  router.push(item.component?.path);
+  router.push(item?.path);
 }
 </script>
 
@@ -347,11 +278,11 @@ let goPage = (item) => {
     <div class="grid-box  select-none index-grid">
       <grid-layout ref="gridLayout" v-model:layout="layout" :col-num="12" :is-draggable="tilesIsMove"
         :is-mirrored="false" :auto-size="false" :responsive="false" :is-resizable="tilesIsMove" :margin="[10, 10]"
-        :row-height="45" :vertical-compact="true">
+        :row-height="70" :vertical-compact="true">
 
         <grid-item v-for="(item, index ) in layout" :key="item.i" ref="gridItem" :h="item.h" :i="item.i" :w="item.w"
-          :x="item.x" :y="item.y" :dragAllowFrom="item.component && item.component.dom ? item.component.dom : null"
-          @resized="resizedEvent">
+          :x="item.x" :y="item.y" :dragAllowFrom="item && item.dom ? item.dom : null"
+          :isResizable="tilesIsMove && item && item.isResize ? item.isResize : false" @resized="resizedEvent">
           <span class="close" @click="delItem(item)" v-if="tilesIsMove">
             <CloseCircleFilled style="color: #f10215;" />
           </span>
@@ -371,7 +302,7 @@ let goPage = (item) => {
     <!-- 右侧悬浮部分 -->
     <FloatButtonGroup shape="circle" :style="{ right: '40px' }">
       <template v-if="!editTiles">
-        <FloatButton tooltip="编辑磁贴" @click="cancelOrSure('sure')">
+        <FloatButton tooltip="编辑磁贴" @click="cancelOrSure('edit')">
           <template #icon>
             <EditOutlined style="font-size: 20px;" />
           </template>
@@ -396,7 +327,7 @@ let goPage = (item) => {
                   <CollapsePanel key="1" header="个人工作台（22）">
                     <!-- 可拖入的组件部分 -->
                     <div class="components-box">
-                      <div v-for="item in componentsInfo.slice(0, 22)" :key="item.name" class="ctrl-box"
+                      <div v-for="item in componentsInfo.slice(0, 22)" :key="item.name" class="ctrl-box bg-background"
                         draggable="true" @drag="drag" @dragend="dragend($event)" @dragstart="dragstart($event, item)"
                         @click="addTiles(item.name)" :class="{ 'active': selectTilseArr.includes(item.name) }">
                         <div class="ctrl-name">{{ item.name + '(' + item.size + ')' }}</div>
@@ -407,7 +338,7 @@ let goPage = (item) => {
                   </CollapsePanel>
                   <CollapsePanel key="2" header="综合行政（12）">
                     <div class="components-box">
-                      <div v-for="item in componentsInfo.slice(22, 34)" :key="item.name" class="ctrl-box"
+                      <div v-for="item in componentsInfo.slice(22, 34)" :key="item.name" class="ctrl-box bg-background"
                         draggable="true" @drag="drag" @dragend="dragend" @dragstart="dragstart($event, item)"
                         @click="addTiles(item.name)" :class="{ 'active': selectTilseArr.includes(item.name) }">
                         <div class="ctrl-name">{{ item.name + '(' + item.size + ')' }}</div>
@@ -419,7 +350,7 @@ let goPage = (item) => {
                   </CollapsePanel>
                   <CollapsePanel key="3" header="经营管理（22）">
                     <div class="components-box">
-                      <div v-for="item in componentsInfo.slice(34, 56)" :key="item.name" class="ctrl-box"
+                      <div v-for="item in componentsInfo.slice(34, 56)" :key="item.name" class="ctrl-box bg-background"
                         draggable="true" @drag="drag" @dragend="dragend" @dragstart="dragstart($event, item)"
                         @click="addTiles(item.name)" :class="{ 'active': selectTilseArr.includes(item.name) }">
                         <div class="ctrl-name">{{ item.name + '(' + item.size + ')' }}</div>
@@ -431,7 +362,7 @@ let goPage = (item) => {
                   </CollapsePanel>
                   <CollapsePanel key="4" header="安全生产（19）">
                     <div class="components-box">
-                      <div v-for="item in componentsInfo.slice(56, 75)" :key="item.name" class="ctrl-box"
+                      <div v-for="item in componentsInfo.slice(56, 75)" :key="item.name" class="ctrl-box bg-background"
                         draggable="true" @drag="drag" @dragend="dragend" @dragstart="dragstart($event, item)"
                         @click="addTiles(item.name)" :class="{ 'active': selectTilseArr.includes(item.name) }">
                         <div class="ctrl-name">{{ item.name + '(' + item.size + ')' }}</div>
@@ -443,7 +374,7 @@ let goPage = (item) => {
                   </CollapsePanel>
                   <CollapsePanel key="5" header="勘探开发（26）">
                     <div class="components-box">
-                      <div v-for="item in componentsInfo.slice(75, 101)" :key="item.name" class="ctrl-box"
+                      <div v-for="item in componentsInfo.slice(75, 101)" :key="item.name" class="ctrl-box bg-background"
                         draggable="true" @drag="drag" @dragend="dragend" @dragstart="dragstart($event, item)"
                         @click="addTiles(item.name)" :class="{ 'active': selectTilseArr.includes(item.name) }">
                         <div class="ctrl-name">{{ item.name + '(' + item.size + ')' }}</div>
@@ -455,9 +386,10 @@ let goPage = (item) => {
                   </CollapsePanel>
                   <CollapsePanel key="6" header="数据管理（1）">
                     <div class="components-box">
-                      <div v-for="item in componentsInfo.slice(101, 102)" :key="item.name" class="ctrl-box"
-                        draggable="true" @drag="drag" @dragend="dragend" @dragstart="dragstart($event, item)"
-                        @click="addTiles(item.name)" :class="{ 'active': selectTilseArr.includes(item.name) }">
+                      <div v-for="item in componentsInfo.slice(101, 102)" :key="item.name"
+                        class="ctrl-box bg-background" draggable="true" @drag="drag" @dragend="dragend"
+                        @dragstart="dragstart($event, item)" @click="addTiles(item.name)"
+                        :class="{ 'active': selectTilseArr.includes(item.name) }">
                         <div class="ctrl-name">{{ item.name + '(' + item.size + ')' }}</div>
                         <img :src="'/xbyt/' + item.name2" alt="">
                         <Checkbox :value="item.name" :checked="selectTilseArr.includes(item.name)"
@@ -467,9 +399,10 @@ let goPage = (item) => {
                   </CollapsePanel>
                   <CollapsePanel key="7" header="总部系统（25）">
                     <div class="components-box">
-                      <div v-for="item in componentsInfo.slice(102, 127)" :key="item.name" class="ctrl-box"
-                        draggable="true" @drag="drag" @dragend="dragend" @dragstart="dragstart($event, item)"
-                        @click="addTiles(item.name)" :class="{ 'active': selectTilseArr.includes(item.name) }">
+                      <div v-for="item in componentsInfo.slice(102, 127)" :key="item.name"
+                        class="ctrl-box bg-background" draggable="true" @drag="drag" @dragend="dragend"
+                        @dragstart="dragstart($event, item)" @click="addTiles(item.name)"
+                        :class="{ 'active': selectTilseArr.includes(item.name) }">
                         <div class="ctrl-name">{{ item.name + '(' + item.size + ')' }}</div>
                         <img :src="'/xbyt/' + item.name2" alt="">
                         <Checkbox :value="item.name" :checked="selectTilseArr.includes(item.name)"
@@ -497,6 +430,7 @@ let goPage = (item) => {
   min-width: 1000px;
   position: relative;
   overflow-x: auto;
+  max-width: unset !important;
 }
 
 .grid-box {
@@ -520,7 +454,6 @@ let goPage = (item) => {
     height: 130px;
     padding: 12px;
     // margin-top: 20px;
-    background: #ecf1f3;
     user-select: none;
     flex-direction: column;
     border-radius: 10px;
@@ -570,7 +503,8 @@ let goPage = (item) => {
   overflow: auto;
   background: transparent;
   // border: 1px solid rgb(66 66 66 / 100%);
-  width: 1200px;
+  // width: 1200px;
+  margin: 0 auto;
 
   .vue-grid-item {
     // padding: 12px 20px;
diff --git a/apps/web-test/src/views/dashboard/home/operation.vue b/apps/web-test/src/views/dashboard/home/operation.vue
new file mode 100644
index 00000000..f1503997
--- /dev/null
+++ b/apps/web-test/src/views/dashboard/home/operation.vue
@@ -0,0 +1,135 @@
+<template>
+    <div class="bg-background p-5 m-4">
+        <div class="flex justify-between mb-4">
+            <Form layout="inline">
+                <FormItem label="业务域编码">
+                    <Input placeholder="请输入"></Input>
+                </FormItem>
+                <FormItem label="业务域名称">
+                    <Input placeholder="请输入"></Input>
+                </FormItem>
+                <Button type="primary">查询</Button>
+            </Form>
+            <div class="flex gap-2">
+                <Button size="small" type="primary">新增</Button>
+                <Button size="small" type="primary">修改</Button>
+                <Button size="small" type="primary" danger>删除</Button>
+            </div>
+        </div>
+        <vxe-table border ref="tableRef" :data="tableData" :radio-config="{ highlight: true }"
+            @cell-click="cellClickEvent" @radio-change="radioChangeEvent">
+            <vxe-column type="radio" width="60">
+                <template #header>
+                    <vxe-button mode="text" @click="clearRadioRowEevnt" :disabled="!selectRow">取消</vxe-button>
+                </template>
+            </vxe-column>
+            <vxe-column field="code" title="业务域编码"></vxe-column>
+            <vxe-column field="id" title="业务域ID"></vxe-column>
+            <vxe-column field="name" title="业务域名称"></vxe-column>
+            <vxe-column field="desc" title="业务域描述" align="center" width="520"></vxe-column>
+            <vxe-column field="operate" title="操作" align="center">
+                <template #default="{ row }">
+                    <div class="flex gap-1 justify-center">
+                        <ContactsFilled style="color: #367cb7;font-size: 20px;" />
+                    </div>
+                </template>
+            </vxe-column>
+        </vxe-table>
+        <div class="py-2 flex justify-between">
+            <div>总共{{ tableData.length }}条数据</div>
+            <Pagination size="small" :total="1000" show-size-changer show-quick-jumper />
+        </div>
+    </div>
+</template>
+<script setup lang="ts">
+import { ref,watch } from 'vue'
+import { EditFilled, DeleteFilled, ContactsFilled, ToolFilled, ThunderboltFilled } from '@ant-design/icons-vue';
+import { type VxeGridProps, VxeUI } from 'vxe-table'
+import { VXETable, type VxeTableInstance, type VxeTableEvents } from 'vxe-table'
+
+import { preferences } from '@vben/preferences';
+
+watch(() => preferences.theme.mode, (n: any) => {
+  VxeUI.setTheme(n)
+},{
+    deep: true,
+    immediate: true
+})
+import { Button, Form, FormItem, Input, Select, Card, Pagination, Textarea, Checkbox } from 'ant-design-vue';
+interface RowVO {
+    code: string
+    name: string
+    id: number
+    desc: string
+    operate: string
+
+}
+
+const selectRow = ref<RowVO | null>(null)
+
+const tableData = ref<RowVO[]>([
+    {
+        code: '001', name: '业务域1', id: 1, desc: '业务域1',
+        operate: ''
+    },
+    {
+        code: '001', name: '业务域1', id: 1, desc: '业务域1',
+        operate: ''
+    },
+    {
+        code: '001', name: '业务域1', id: 1, desc: '业务域1',
+        operate: ''
+    },
+    {
+        code: '001', name: '业务域1', id: 1, desc: '业务域1',
+        operate: ''
+    },{
+        code: '001', name: '业务域1', id: 1, desc: '业务域1',
+        operate: ''
+    },{
+        code: '001', name: '业务域1', id: 1, desc: '业务域1',
+        operate: ''
+    },{
+        code: '001', name: '业务域1', id: 1, desc: '业务域1',
+        operate: ''
+    },{
+        code: '001', name: '业务域1', id: 1, desc: '业务域1',
+        operate: ''
+    },
+])
+
+const tableRef = ref<VxeTableInstance<RowVO>>()
+
+const cellClickEvent: VxeTableEvents.CellClick<RowVO> = () => {
+    console.log('单元格点击事件')
+}
+
+const radioChangeEvent: VxeTableEvents.RadioChange<RowVO> = ({ row }) => {
+    selectRow.value = row
+    console.log('单选事件')
+}
+
+const setSelectRow = (index: number) => {
+    const $table = tableRef.value
+    if ($table) {
+        $table.setRadioRow(tableData.value[index])
+    }
+}
+
+const clearRadioRowEevnt = () => {
+    const $table = tableRef.value
+    if ($table) {
+        selectRow.value = null
+        $table.clearRadioRow()
+    }
+}
+
+const getRadioEvent = () => {
+    const $table = tableRef.value
+    if ($table) {
+        const currRow = $table.getRadioRecord()
+        VXETable.modal.alert(JSON.stringify(currRow))
+    }
+}
+</script>
+<style scoped lang="scss"></style>
\ No newline at end of file
diff --git a/apps/web-test/src/views/dashboard/home/portal.vue b/apps/web-test/src/views/dashboard/home/portal.vue
index f72d1787..4a1f6ef9 100644
--- a/apps/web-test/src/views/dashboard/home/portal.vue
+++ b/apps/web-test/src/views/dashboard/home/portal.vue
@@ -1,9 +1,9 @@
 <template>
-    <div class="main-box bg-[#ecf3f8] px-3 mt-3 h-[100%]">
+    <div class="main-box bg-background px-3 mt-3 h-[100%]">
         <div class="top-box flex justify-between items-center">
             <div class="t-b-name text-base">磁贴管理</div>
             <div class="flex items-center gap-2">
-                <Button type="primary">注册磁贴</Button>
+                <Button type="primary" @click="goToReg">注册磁贴</Button>
                 <VbenIconButton
                     class="hover:text-[#007da3] w-[30px] h-[30px] flex justify-center items-center rounded-[50%]">
                     <UnorderedListOutlined />
@@ -21,7 +21,8 @@ import CardTitle from './components/CardTiles/index.vue';
 import { UnorderedListOutlined, ExpandOutlined } from '@ant-design/icons-vue';
 import { Button, Form, FormItem, Input, Select, Card, Pagination} from 'ant-design-vue';
 import { tilesList } from './tiles'
-
+import { useRouter } from "vue-router";
+const router = useRouter();
 let list: any[] = []
 for (let i = 0; i < tilesList.length; i++) {
     let obj: any = {}
@@ -32,4 +33,9 @@ for (let i = 0; i < tilesList.length; i++) {
     list.push(obj);
     obj = null
 }
+
+let goToReg = () => {
+    router.push("/register");
+
+}
 </script>
\ No newline at end of file
diff --git a/apps/web-test/src/views/dashboard/home/register.vue b/apps/web-test/src/views/dashboard/home/register.vue
new file mode 100644
index 00000000..8e0edfac
--- /dev/null
+++ b/apps/web-test/src/views/dashboard/home/register.vue
@@ -0,0 +1,305 @@
+<template>
+    <div class="w-[100%] px-2 bg-background mt-3 min-w-[1200px]">
+        <div class="w-[70%] mx-auto pt-3">
+            <Steps :current="nowCurrent" :items="[
+                {
+                    title: '选择业务域',
+                },
+                {
+                    title: '选择磁贴模板',
+                },
+                {
+                    title: '填写磁贴信息',
+                },
+            ]"></Steps>
+        </div>
+        <div class="flex gap-3 mt-3 pb-2 justify-center">
+            <div class="c-item flex flex-col  items-center">
+                <div class="s-t my-3">请选择业务域</div>
+                <Form layout="inline" :wrapperCol="wrapperCol">
+                    <FormItem label="名称">
+                        <Input placeholder="请输入"></Input>
+                    </FormItem>
+                    <FormItem label="编码">
+                        <Input placeholder="请输入"></Input>
+                    </FormItem>
+                    <Button type="primary">查询</Button>
+                </Form>
+                <div class="text-xs flex gap-1">
+                    <InfoCircleFilled />
+                    <div>如果找不到相关业务，请<Button type="link">点击此处</Button>新建</div>
+                </div>
+
+                <vxe-table border ref="tableRef" height="70%" :data="tableData" :radio-config="{ highlight: true }"
+                    @cell-click="cellClickEvent" @radio-change="radioChangeEvent">
+                    <vxe-column type="radio" width="60">
+                        <template #header>
+                            <vxe-button mode="text" @click="clearRadioRowEevnt" :disabled="!selectRow">取消</vxe-button>
+                        </template>
+                    </vxe-column>
+                    <vxe-column field="code" title="业务域编码" width="120"></vxe-column>
+                    <vxe-column field="name" title="业务域名称" width="120"></vxe-column>
+                </vxe-table>
+                <div class="flex justify-end w-[100%] px-3 py-3" v-if="nowCurrent == 0">
+                    <Button type="primary" size="large" shape="circle" @click="selectTemplate(1)">
+                        <template #icon>
+                            <ArrowRightOutlined />
+                        </template>
+                    </Button>
+                </div>
+                <!-- <ArrowLeftOutlined /> -->
+            </div>
+            <div class="c-item flex flex-col  items-center" v-show="nowCurrent >= 1">
+                <div class="s-t my-3">请选择磁贴模板</div>
+                <div class="flex flex-wrap h-[100%] gap-3 justify-center ">
+                    <div class="template-item flex flex-col justify-center gap-1 items-center"
+                        :class="{ 'active': templateNum == index }" v-for="(item, index) in templateList" :key="index"
+                        @click="templateClickNum(index)">
+                        <img :src="'/xbyt/' + item.img" class="w-[70px] h-[70px] object-contain">
+                        <div class="text-xs">{{ item.name }}</div>
+
+                        <div class="active-icon" v-if="templateNum == index">
+                            <CheckCircleFilled style="color: hsl(var(--primary));font-size: 20px;"/>
+                        </div>
+                    </div>
+                    <div class="opacity-0 template-item flex flex-col justify-center gap-1 items-center" style="cursor: default;"
+                        v-if="templateList.length % 3 == 2"></div>
+                    <template v-if="templateList.length % 3 == 1">
+                        <div class="opacity-0 template-item flex flex-col justify-center gap-1 items-center" style="cursor: default;"></div>
+                        <div class="opacity-0 template-item flex flex-col justify-center gap-1 items-center" style="cursor: default;"></div>
+                    </template>
+                </div>
+                <div class="flex justify-between w-[100%] px-3 py-3" v-if="nowCurrent == 1">
+                    <Button type="primary" size="large" shape="circle" @click="selectTemplate(0)">
+                        <template #icon>
+                            <ArrowLeftOutlined />
+                        </template>
+                    </Button>
+                    <Button type="primary" size="large" shape="circle" @click="selectTemplate(2)">
+                        <template #icon>
+                            <ArrowRightOutlined />
+                        </template>
+                    </Button>
+                </div>
+            </div>
+            <div class="c-item flex flex-col  items-center" v-show="nowCurrent >= 2">
+                <div class="s-t my-3">请填写磁贴信息</div>
+                <div class="form-box">
+                    <Form :wrapperCol="{ style: { width: '300px' } }" :labelCol="{ style: { width: '80px' } }">
+                        <FormItem label="业务域" :rules="[{ required: true, message: '请输入业务域' }]">
+                            <Input placeholder="请输入"></Input>
+                        </FormItem>
+                        <FormItem label="适用范围" :rules="[{ required: true, message: '请选择适用范围' }]">
+                            <Select placeholder="请选择"></Select>
+                        </FormItem>
+                        <FormItem label="编码" :rules="[{ required: true, message: '请输入编码' }]">
+                            <Input placeholder="请输入"></Input>
+                        </FormItem>
+                        <FormItem label="标题" :rules="[{ required: true, message: '请输入标题' }]">
+                            <Input placeholder="请输入"></Input>
+                        </FormItem>
+                        <FormItem label="链接地址" :rules="[{ required: true, message: '请输入链接地址' }]">
+                            <Input placeholder="请输入"></Input>
+                        </FormItem>
+                        <FormItem label="数据源">
+                            <Input placeholder="请输入"></Input>
+                        </FormItem>
+                        <FormItem label="磁贴大小">
+                            <div class="flex items-center gap-4">
+                                <div class="flex items-center">
+                                    宽：
+                                    <Select>
+                                        <SelectOption value="1">1</SelectOption>
+                                        <SelectOption value="2">2</SelectOption>
+                                    </Select>
+                                </div>
+                                ×
+                                <div class="flex items-center">
+                                    高：
+                                    <Select>
+                                        <SelectOption value="1">1</SelectOption>
+                                        <SelectOption value="2">2</SelectOption>
+                                    </Select>
+                                </div>
+                            </div>
+                        </FormItem>
+                        <FormItem label="图标" :rules="[{ required: true, message: '请上传图标' }]">
+                            <Input placeholder="请输入"></Input>
+                        </FormItem>
+                        <FormItem label="打开方式">
+                            <Select placeholder="请选择"></Select>
+                        </FormItem>
+                        <FormItem label="作者" :rules="[{ required: true, message: '请输入作者' }]">
+                            <Input placeholder="请输入"></Input>
+                        </FormItem>
+                        <FormItem label="联系方式" :rules="[{ required: true, message: '请输入联系方式' }]">
+                            <div>
+                                <Input placeholder="请输入"></Input>
+                                <Checkbox>经过授权才可使用</Checkbox>
+                            </div>
+                        </FormItem>
+                        <FormItem label="描述">
+                            <Textarea placeholder="请输入"></Textarea>
+                        </FormItem>
+                    </Form>
+                </div>
+                <div class="flex justify-between w-[100%] px-3 py-3" v-if="nowCurrent == 2">
+                    <Button type="primary" size="large" shape="circle" @click="selectTemplate(1)">
+                        <template #icon>
+                            <ArrowLeftOutlined />
+                        </template>
+                    </Button>
+                    <Button type="primary" size="large" shape="circle" @click="selectTemplate(3)">
+                        <template #icon>
+                            <ArrowRightOutlined />
+                        </template>
+                    </Button>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script setup lang="ts">
+import { ref, reactive, watch } from 'vue'
+import { Steps } from 'ant-design-vue';
+import { InfoCircleFilled, ArrowRightOutlined, ArrowLeftOutlined,CheckCircleFilled } from '@ant-design/icons-vue';
+import { type VxeGridProps, VxeUI } from 'vxe-table'
+import { VXETable, type VxeTableInstance, type VxeTableEvents } from 'vxe-table'
+
+import { Button, Form, FormItem, Input, Select, Card, Pagination, Textarea, Checkbox } from 'ant-design-vue';
+import { preferences } from '@vben/preferences';
+
+const wrapperCol = { style: { width: '100px' } };
+watch(() => preferences.theme.mode, (n: any) => {
+    VxeUI.setTheme(n)
+},{
+    deep: true,
+    immediate: true
+})
+interface RowVO {
+    code: string
+    name: string
+}
+
+const selectRow = ref<RowVO | null>(null)
+
+const tableData = ref<RowVO[]>([
+    { code: "xzczcz", name: "个人工作台" },
+    { code: "xzczcz", name: "综合行政" },
+    { code: "xzczcz", name: "经营管理" },
+    { code: "xzczcz", name: "安全生产" },
+    { code: "xzczcz", name: "勘探开发" },
+    { code: "xzczcz", name: "数据管理" },
+    { code: "xzczcz", name: "中心工作" },
+    { code: "xzczcz", name: "总部系统" },
+    { code: "xzczcz", name: "功能模块" },
+    { code: "xzczcz", name: "工程院系统" },
+])
+
+const tableRef = ref<VxeTableInstance<RowVO>>()
+
+const cellClickEvent: VxeTableEvents.CellClick<RowVO> = () => {
+    console.log('单元格点击事件')
+}
+
+const radioChangeEvent: VxeTableEvents.RadioChange<RowVO> = ({ row }) => {
+    selectRow.value = row
+    console.log('单选事件')
+}
+
+const setSelectRow = (index: number) => {
+    const $table = tableRef.value
+    if ($table) {
+        $table.setRadioRow(tableData.value[index])
+    }
+}
+
+const clearRadioRowEevnt = () => {
+    const $table = tableRef.value
+    if ($table) {
+        selectRow.value = null
+        $table.clearRadioRow()
+    }
+}
+
+const getRadioEvent = () => {
+    const $table = tableRef.value
+    if ($table) {
+        const currRow = $table.getRadioRecord()
+        VXETable.modal.alert(JSON.stringify(currRow))
+    }
+}
+const templateList = [{
+    img: 'AUTO_1612159241967_C车辆调度.png',
+    name: '多媒体'
+}, {
+    img: 'AUTO_1612160044533_C市场管理.png',
+    name: '柱状图'
+}, {
+    img: 'AUTO_1612174485058_C投资共享.png',
+    name: '卡片'
+}, {
+    img: 'AUTO_1612175576303_C费用报销.png',
+    name: '自定义'
+}, {
+    img: 'AUTO_1612175837663_C设备管理.png',
+    name: '仪表盘'
+}, {
+    img: 'AUTO_1612176568856_C财务管理.png',
+    name: '折线图'
+}, {
+    img: 'AUTO_1612176967032_C土地信息.png',
+    name: '列表'
+}, {
+    img: 'AUTO_1612236164722_C门户网站.png',
+    name: '数字'
+}, {
+    img: 'AUTO_1612251274093_C集输防腐.png',
+    name: '饼图'
+}, {
+    img: 'AUTO_1612254108987_C新井日报.png',
+    name: '快捷入口'
+}, {
+    img: 'AUTO_1612254711440_C单井曲线.png',
+    name: '文本'
+}]
+
+let nowCurrent = ref(0);
+let selectTemplate = (index: number) => {
+    nowCurrent.value = index
+}
+
+let templateNum = ref(0);
+let templateClickNum = (index: number) => {
+    templateNum.value = index
+}
+</script>
+<style scoped lang="scss">
+.c-item {
+    border: 1px solid #ccc;
+    flex: .3333;
+    height: calc(100vh - 150px);
+}
+
+.template-item {
+    border: 1px solid #ccc;
+    width: 30%;
+    cursor: pointer;
+    position: relative;
+
+    .active-icon {
+        position: absolute;
+        right: 3px;
+        top: 3px;
+    }
+
+    &.active {
+        border: 1px solid hsl(var(--primary));
+    }
+}
+
+.form-box {
+    max-height: 90%;
+    overflow-y: auto;
+}
+</style>
\ No newline at end of file
diff --git a/apps/web-test/src/views/dashboard/home/tiles.ts b/apps/web-test/src/views/dashboard/home/tiles.ts
index 31791080..ba432051 100644
--- a/apps/web-test/src/views/dashboard/home/tiles.ts
+++ b/apps/web-test/src/views/dashboard/home/tiles.ts
@@ -1,4 +1,59 @@
 let tilesList = [
+    {
+        "name1": "WORKBENCH_USER_TMPL.png",
+        "name2": "WORKBENCH_USER_TMPL_C用户模板.png",
+        "size": "2x2",
+        "name": "用户模板",
+        "w": 1,
+        "h": 2,
+        "component": "./components/Output1/index.vue",
+        "i": 131,
+        "path": "/usertemplate"
+    },
+    {
+        "name1": "WORKBENCH_BUSINESS.png",
+        "name2": "WORKBENCH_BUSINESS_C业务域.png",
+        "size": "2x2",
+        "name": "业务域",
+        "w": 1,
+        "h": 2,
+        "component": "./components/Output1/index.vue",
+        "i": 128,
+        "path": "/operation"
+    },
+    {
+        "name1": "WORKBENCH_MANAGER.png",
+        "name2": "WORKBENCH_MANAGER_C磁贴管理.png",
+        "size": "2x2",
+        "name": "磁贴管理",
+        "w": 1,
+        "h": 2,
+        "component": "./components/Output1/index.vue",
+        "i": 129,
+        "path": "/portal"
+    },
+    {
+        "name1": "WORKBENCH_AUDIT.png",
+        "name2": "WORKBENCH_AUDIT_C磁贴审核.png",
+        "size": "2x2",
+        "name": "磁贴审核",
+        "w": 1,
+        "h": 2,
+        "component": "./components/Output1/index.vue",
+        "i": 127,
+        "path": "/audit"
+    },
+    {
+        "name1": "AUTO_1612255706920.png",
+        "name2": "AUTO_1612255706920_C待办管理.png",
+        "size": "2x2",
+        "name": "待办管理",
+        "w": 1,
+        "h": 2,
+        "component": "./components/Output1/index.vue",
+        "i": 27,
+        "path": "/todo"
+    },
     {
         "name1": "AUTO_1612155980933.png",
         "name2": "AUTO_1612155980933_C会议管理.png",
@@ -8,7 +63,6 @@ let tilesList = [
         "h": 2,
         "component": "./components/Output1/index.vue",
         "i": 0,
-        "path": "/portal"
     },
     {
         "name1": "AUTO_1612158921536.png",
@@ -19,6 +73,7 @@ let tilesList = [
         "h": 6,
         "component": "./components/Output5/index.vue",
         "dom": '.titlt-top',
+        "isResize": true,
         "childer": [
             {
                 "name1": "AUTO_1612159241967.png",
@@ -44,7 +99,8 @@ let tilesList = [
         "h": 5,
         "component": "./components/Output2/index.vue",
         "i": 2,
-        "dom": '.titlt-top'
+        "dom": '.titlt-top',
+        "isResize": true
     },
     {
         "name1": "AUTO_1612159773503.png",
@@ -287,16 +343,6 @@ let tilesList = [
         "component": "./components/Output1/index.vue",
         "i": 26
     },
-    {
-        "name1": "AUTO_1612255706920.png",
-        "name2": "AUTO_1612255706920_C待办管理.png",
-        "size": "2x2",
-        "name": "待办管理",
-        "w": 1,
-        "h": 2,
-        "component": "./components/Output1/index.vue",
-        "i": 27
-    },
     {
         "name1": "AUTO_1615449162971.png",
         "name2": "AUTO_1615449162971_C日志服务.png",
@@ -1287,36 +1333,6 @@ let tilesList = [
         "component": "./components/Output1/index.vue",
         "i": 126
     },
-    {
-        "name1": "WORKBENCH_AUDIT.png",
-        "name2": "WORKBENCH_AUDIT_C磁贴审核.png",
-        "size": "2x2",
-        "name": "磁贴审核",
-        "w": 1,
-        "h": 2,
-        "component": "./components/Output1/index.vue",
-        "i": 127
-    },
-    {
-        "name1": "WORKBENCH_BUSINESS.png",
-        "name2": "WORKBENCH_BUSINESS_C业务域.png",
-        "size": "2x2",
-        "name": "业务域",
-        "w": 1,
-        "h": 2,
-        "component": "./components/Output1/index.vue",
-        "i": 128
-    },
-    {
-        "name1": "WORKBENCH_MANAGER.png",
-        "name2": "WORKBENCH_MANAGER_C磁贴管理.png",
-        "size": "2x2",
-        "name": "磁贴管理",
-        "w": 1,
-        "h": 2,
-        "component": "./components/Output1/index.vue",
-        "i": 129
-    },
     {
         "name1": "WORKBENCH_USER_AUTH.png",
         "name2": "WORKBENCH_USER_AUTH_C用户授权.png",
@@ -1327,16 +1343,6 @@ let tilesList = [
         "component": "./components/Output1/index.vue",
         "i": 130
     },
-    {
-        "name1": "WORKBENCH_USER_TMPL.png",
-        "name2": "WORKBENCH_USER_TMPL_C用户模板.png",
-        "size": "2x2",
-        "name": "用户模板",
-        "w": 1,
-        "h": 2,
-        "component": "./components/Output1/index.vue",
-        "i": 131
-    }
 ]
 
 export { tilesList }
\ No newline at end of file
diff --git a/apps/web-test/src/views/dashboard/home/todo.vue b/apps/web-test/src/views/dashboard/home/todo.vue
new file mode 100644
index 00000000..4a1a34a9
--- /dev/null
+++ b/apps/web-test/src/views/dashboard/home/todo.vue
@@ -0,0 +1,80 @@
+<template>
+    <div class="bg-background p-5 m-4">
+        <div class="flex justify-between mb-4">
+            <Form layout="inline">
+                <FormItem label="应用名称">
+                    <Input placeholder="请输入"></Input>
+                </FormItem>
+                <FormItem label="应用编码">
+                    <Input placeholder="请输入"></Input>
+                </FormItem>
+                <FormItem label="模板类型">
+                    <Select placeholder="请输入"></Select>
+                </FormItem>
+                <Space warp>
+                    <Button type="primary">查询</Button>
+                    <Button>清空</Button>
+                </Space>
+            </Form>
+        </div>
+        <Space warp class="mb-5">
+            <Button type="primary" :icon="h(PlusOutlined)" class="flex items-center" @click="router.push('/addtodo')">添加应用</Button>
+            <Button :icon="h(UploadOutlined)" class="flex items-center">一键导入</Button>
+            <Button :icon="h(SettingOutlined)" class="flex items-center">配置待办清单</Button>
+        </Space>
+        <vxe-table border ref="tableRef" :data="tableData">
+            <vxe-column field="code" title="应用编码"></vxe-column>
+            <vxe-column field="name" title="应用名称"></vxe-column>
+            <vxe-column field="link" title="接口地址"></vxe-column>
+            <vxe-column field="sort" title="排序" width="50"></vxe-column>
+            <vxe-column field="operate" title="操作" width="350">
+                <template #default="{ row }">
+                    <div class="flex gap-2">
+                        <Button type="link">告警管理</Button>
+                        <Button type="link">编辑</Button>
+                        <Button type="link">删除</Button>
+                        <Button type="link">导出</Button>
+                    </div>
+                </template>
+            </vxe-column>
+        </vxe-table>
+        <div class="py-2 flex justify-between">
+            <div>总共{{ tableData.length }}条数据</div>
+            <Pagination size="small" :total="1000" show-size-changer show-quick-jumper />
+        </div>
+    </div>
+</template>
+<script setup lang="ts">
+import { ref, watch,h } from 'vue'
+import { SettingOutlined,UploadOutlined,PlusOutlined } from '@ant-design/icons-vue';
+import { type VxeGridProps, VxeUI } from 'vxe-table'
+import { VXETable, type VxeTableInstance, type VxeTableEvents } from 'vxe-table'
+
+import { Button, Form, FormItem, Input, Select, Card, Pagination, Textarea, Checkbox, Space } from 'ant-design-vue';
+import { preferences } from '@vben/preferences';
+import { useRouter } from "vue-router";
+const router = useRouter();
+
+watch(() => preferences.theme.mode, (n: any) => {
+    VxeUI.setTheme(n)
+}, {
+    deep: true,
+    immediate: true
+})
+interface RowVO {
+    code: string
+    name: string
+    link: string
+    sort: string
+    // 操作
+    operate: string
+}
+
+
+const tableData = ref<RowVO[]>([
+    { code: "LDQXJ", name: "领导请销假", link: "http://www.baidu.com", sort: "1", operate: "操作" },
+    { code: "DCGL", name: "督察管理", link: "http://www.baidu.com", sort: "3", operate: "操作" },
+    { code: "DZKQ", name: "电子考勤", link: "http://www.baidu.com", sort: "2", operate: "操作" },
+])
+</script>
+<style scoped lang="scss"></style>
\ No newline at end of file
diff --git a/apps/web-test/src/views/dashboard/home/usertemplate.vue b/apps/web-test/src/views/dashboard/home/usertemplate.vue
new file mode 100644
index 00000000..9b277984
--- /dev/null
+++ b/apps/web-test/src/views/dashboard/home/usertemplate.vue
@@ -0,0 +1,86 @@
+<template>
+    <div class="bg-background p-5 m-4">
+        <div class="flex justify-between mb-4">
+            <Form layout="inline">
+                <FormItem label="名称">
+                    <Input placeholder="请输入"></Input>
+                </FormItem>
+                <FormItem label="编码">
+                    <Input placeholder="请输入"></Input>
+                </FormItem>
+                <FormItem label="模板类型">
+                    <Select placeholder="请输入"></Select>
+                </FormItem>
+                <Button type="primary">查询</Button>
+            </Form>
+            <Button type="primary">添加</Button>
+        </div>
+        <vxe-table border ref="tableRef" :data="tableData">
+            <vxe-column field="ucode" title="租户编码"></vxe-column>
+            <vxe-column field="name" title="模板名称"></vxe-column>
+            <vxe-column field="code" title="模板编码"></vxe-column>
+            <vxe-column field="versions" title="模板版本信息"></vxe-column>
+            <vxe-column field="type" title="模板类型"></vxe-column>
+            <vxe-column field="isDefault" title="是否为默认面板"></vxe-column>
+            <vxe-column field="users" title="创建人"></vxe-column>
+            <vxe-column field="time" title="创建时间"></vxe-column>
+            <vxe-column field="maintain" title="维护人"></vxe-column>
+            <vxe-column field="maintaintime" title="维护时间"></vxe-column>
+            <vxe-column field="operate" title="操作" width="150">
+                <template #default="{ row }">
+                    <div class="flex gap-1">
+                        <EditFilled style="color: #5cb15c;font-size: 20px;" />
+                        <DeleteFilled style="color: #e15852;font-size: 20px;"/>
+                        <ContactsFilled style="color: #367cb7;font-size: 20px;"/>
+                        <ToolFilled style="color: #367cb7;font-size: 20px;"/>
+                        <ThunderboltFilled style="color: #e15852;font-size: 20px;"/>
+                    </div>
+                </template>
+            </vxe-column>
+        </vxe-table>
+        <div class="py-2 flex justify-between">
+            <div>总共{{ tableData.length }}条数据</div>
+            <Pagination size="small" :total="1000" show-size-changer show-quick-jumper />
+        </div>
+    </div>
+</template>
+<script setup lang="ts">
+import { ref ,watch} from 'vue'
+import { EditFilled, DeleteFilled, ContactsFilled, ToolFilled, ThunderboltFilled } from '@ant-design/icons-vue';
+import { type VxeGridProps, VxeUI } from 'vxe-table'
+import { VXETable, type VxeTableInstance, type VxeTableEvents } from 'vxe-table'
+
+import { Button, Form, FormItem, Input, Select, Card, Pagination, Textarea, Checkbox } from 'ant-design-vue';
+import { preferences } from '@vben/preferences';
+
+watch(() => preferences.theme.mode, (n: any) => {
+  VxeUI.setTheme(n)
+},{
+    deep: true,
+    immediate: true
+})
+interface RowVO {
+    ucode: string
+    name: string
+    code: string
+    versions: string
+    type: string
+    isDefault: boolean
+    users: string
+    time: string
+    maintain: string
+    maintaintime: string
+    // 操作
+    operate: string
+}
+
+
+const tableData = ref<RowVO[]>([
+    { ucode: 'xbyt', code: "PC_Default", name: "管理员模板", versions: "1.0.0", type: "PC", isDefault: true, users: "admin", time: "2021-01-01 00:00:00", maintain: "admin", maintaintime: "2021-01-01 00:00:00", operate: "编辑" },
+    { ucode: 'xbyt', code: "PC_Default", name: "管理员模板", versions: "1.0.0", type: "PC", isDefault: true, users: "admin", time: "2021-01-01 00:00:00", maintain: "admin", maintaintime: "2021-01-01 00:00:00", operate: "编辑" },
+    { ucode: 'xbyt', code: "PC_Default", name: "管理员模板", versions: "1.0.0", type: "PC", isDefault: true, users: "admin", time: "2021-01-01 00:00:00", maintain: "admin", maintaintime: "2021-01-01 00:00:00", operate: "编辑" },
+    { ucode: 'xbyt', code: "PC_Default", name: "管理员模板", versions: "1.0.0", type: "PC", isDefault: true, users: "admin", time: "2021-01-01 00:00:00", maintain: "admin", maintaintime: "2021-01-01 00:00:00", operate: "编辑" },
+    { ucode: 'xbyt', code: "PC_Default", name: "管理员模板", versions: "1.0.0", type: "PC", isDefault: true, users: "admin", time: "2021-01-01 00:00:00", maintain: "admin", maintaintime: "2021-01-01 00:00:00", operate: "编辑" },
+])
+</script>
+<style scoped lang="scss"></style>
\ No newline at end of file
diff --git a/packages/effects/layouts/src/widgets/user-dropdown/user-dropdown.vue b/packages/effects/layouts/src/widgets/user-dropdown/user-dropdown.vue
index 0c820a4f..ee2c0931 100644
--- a/packages/effects/layouts/src/widgets/user-dropdown/user-dropdown.vue
+++ b/packages/effects/layouts/src/widgets/user-dropdown/user-dropdown.vue
@@ -163,7 +163,7 @@ if (enableShortcutKey.value) {
     <DropdownMenuTrigger>
       <div class="hover:bg-accent ml-1 mr-2 cursor-pointer rounded-full p-1.5">
         <div class="hover:text-accent-foreground flex-center">
-          <VbenAvatar :alt="text" :src="avatar" class="size-8" dot />
+          <VbenAvatar :alt="text" :src="'https://unpkg.com/@vbenjs/static-source@0.1.7/source/avatar-v1.webp'" class="size-8" dot />
         </div>
       </div>
     </DropdownMenuTrigger>
@@ -171,7 +171,7 @@ if (enableShortcutKey.value) {
       <DropdownMenuLabel class="flex items-center p-3">
         <VbenAvatar
           :alt="text"
-          :src="avatar"
+          :src="'https://unpkg.com/@vbenjs/static-source@0.1.7/source/avatar-v1.webp'"
           class="size-12"
           dot
           dot-class="bottom-0 right-1 border-2 size-4 bg-green-500"