diff --git a/public/resource/img/logo.png b/public/resource/img/logo.png
index 3a9cd65..b7b77c1 100644
Binary files a/public/resource/img/logo.png and b/public/resource/img/logo.png differ
diff --git a/public/resource/img/logo_yudao.png b/public/resource/img/logo_yudao.png
new file mode 100644
index 0000000..3a9cd65
Binary files /dev/null and b/public/resource/img/logo_yudao.png differ
diff --git a/src/components/Application/src/AppLogo.vue b/src/components/Application/src/AppLogo.vue
index c1917db..bef2a7f 100644
--- a/src/components/Application/src/AppLogo.vue
+++ b/src/components/Application/src/AppLogo.vue
@@ -49,7 +49,8 @@ function goHome() {
 .@{prefix-cls} {
   display: flex;
   align-items: center;
-  padding-left: 7px;
+  justify-content: center;
+   padding-left: 7px;
   cursor: pointer;
   transition: all 0.2s ease;
 
diff --git a/src/components/Page/src/PageWrapper.vue b/src/components/Page/src/PageWrapper.vue
index 5ca3f2e..64f5108 100644
--- a/src/components/Page/src/PageWrapper.vue
+++ b/src/components/Page/src/PageWrapper.vue
@@ -127,8 +127,10 @@ watch(
 <template>
   <div ref="wrapperRef" :class="getClass">
     <PageHeader
-      v-if="getShowHeader" v-bind="omit($attrs, 'class')" ref="headerRef" :style="getHeaderStyle"
-      style="margin: 1rem; border-radius: 1rem;" :ghost="ghost" :title="title"
+      v-if="getShowHeader"
+      v-bind="omit($attrs, 'class')"
+      ref="headerRef" class="m-1" :style="getHeaderStyle"
+      style="padding:6px 8px;" :ghost="ghost" :title="title"
     >
       <template #default>
         <template v-if="content">
@@ -163,14 +165,14 @@ watch(
   position: relative;
 
   .@{prefix-cls}-content {
-    margin: 1rem;
-    border-radius: 1rem;
+    margin: 0.1rem;
+    border-radius: 0.5rem;
   }
 
   .ant-page-header {
     &:empty {
-      margin: 1rem;
-      border-radius: 1rem;
+      margin: 0.1rem;
+      border-radius: 0.5rem;
     }
   }
 
diff --git a/src/enums/appEnum.ts b/src/enums/appEnum.ts
index bf54049..26d9d8a 100644
--- a/src/enums/appEnum.ts
+++ b/src/enums/appEnum.ts
@@ -73,5 +73,6 @@ export enum IconEnum {
   ADDS = 'ant-design:plus-circle-outlined',
   CHANGE = 'ant-design:one-to-one-outlined',
   WARN = 'ant-design:warning-outlined',
+  BACK_CALC = 'ant-design:backward-outlined',
 
 }
diff --git a/src/layouts/default/feature/index.vue b/src/layouts/default/feature/index.vue
index 21b8413..4903117 100644
--- a/src/layouts/default/feature/index.vue
+++ b/src/layouts/default/feature/index.vue
@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { FloatButton } from 'ant-design-vue'
+import { FloatButton, notification } from 'ant-design-vue'
 import { QuestionCircleOutlined } from '@ant-design/icons-vue'
 import { computed, unref } from 'vue'
 
@@ -36,6 +36,16 @@ const getIsFixedSettingDrawer = computed(() => {
 
   return settingButtonPosition === SettingButtonPositionEnum.FIXED
 })
+
+function openNotification() {
+  notification.open({
+    message: '信息提示',
+    description: '该功能开发中，敬请期待！',
+    onClick: () => {
+      console.log('Notification Clicked!')
+    },
+  })
+}
 </script>
 
 <template>
@@ -46,7 +56,7 @@ const getIsFixedSettingDrawer = computed(() => {
     type="primary"
     :badge="{ dot: true }"
     :style="{ right: '64px' }"
-    @click="openWindow(SITE_URL)"
+    @click="openNotification()"
   >
     <template #icon>
       <QuestionCircleOutlined />
diff --git a/src/locales/lang/en/action.json b/src/locales/lang/en/action.json
index 819a633..562ff38 100644
--- a/src/locales/lang/en/action.json
+++ b/src/locales/lang/en/action.json
@@ -14,6 +14,6 @@
   "createBatch": "CreateBatch",
   "createInstant": "CreateInstant",
   "pointConfig": "PointConfig",
-  "warnConfig": "WarnConfig"
-
+  "warnConfig": "WarnConfig",
+  "backCalc": "backCalc"
 }
diff --git a/src/locales/lang/zh-CN/action.json b/src/locales/lang/zh-CN/action.json
index 84fcdee..c84a365 100644
--- a/src/locales/lang/zh-CN/action.json
+++ b/src/locales/lang/zh-CN/action.json
@@ -15,5 +15,6 @@
   "createBatch": "批量导入",
   "createInstant": "新增实例",
   "pointConfig": "测点配置",
-  "warnConfig": "预警配置"
+  "warnConfig": "预警配置",
+  "backCalc": "回算"
 }
diff --git a/src/views/dashboard/demo/components/DynamicInfo.vue b/src/views/dashboard/demo/components/DynamicInfo.vue
new file mode 100644
index 0000000..62033f1
--- /dev/null
+++ b/src/views/dashboard/demo/components/DynamicInfo.vue
@@ -0,0 +1,52 @@
+<script lang="ts" setup>
+import { Card, List } from 'ant-design-vue'
+import { dynamicInfoItems } from './data'
+import { Icon } from '@/components/Icon'
+
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => {},
+  },
+})
+const ListItem = List.Item
+const ListItemMeta = List.Item.Meta
+</script>
+
+<template>
+  <Card id="www" :title="props.data.Header" v-bind="$attrs" class-name="spcard">
+    <template #extra>
+      <a-button type="link">
+        更多
+      </a-button>
+    </template>
+    <List item-layout="horizontal" :data-source="props.data.Content">
+      <template #renderItem="{ item }">
+        <ListItem>
+          <ListItemMeta>
+            <template #description>
+              {{ item.StartTime }} {{ item.Duration }}
+            </template>
+            <!-- eslint-disable-next-line -->
+            <!-- <template #title> {{ item.Text }} <span v-html="item.desc"> </span> </template> -->
+            <template #title>
+              {{ item.Text }}
+            </template>
+
+            <!-- <template #avatar>
+              <Icon :icon="item.avatar" :size="30" />
+            </template> -->
+          </ListItemMeta>
+        </ListItem>
+      </template>
+    </List>
+  </Card>
+</template>
+
+<style scoped>
+::v-deep(.ant-card-body) {
+  height:80%;
+  padding:10px;
+overflow-y: auto;
+}
+</style>
diff --git a/src/views/dashboard/demo/components/Operation.vue b/src/views/dashboard/demo/components/Operation.vue
new file mode 100644
index 0000000..8934c7a
--- /dev/null
+++ b/src/views/dashboard/demo/components/Operation.vue
@@ -0,0 +1,69 @@
+<script lang="ts" setup>
+import { Card, Comment, List, ListItem } from 'ant-design-vue'
+
+import dayjs from 'dayjs'
+import { DislikeFilled, DislikeOutlined, LikeFilled, LikeOutlined } from '@ant-design/icons-vue'
+import { ref } from 'vue'
+import relativeTime from 'dayjs/plugin/relativeTime'
+import { navItems } from './data'
+import { Icon } from '@/components/Icon'
+
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => {},
+  },
+})
+dayjs.extend(relativeTime)
+</script>
+
+<template>
+  <Card :title="props.data.Header" v-bind="$attrs">
+    <template #extra>
+      <a-button type="link">
+        {{ props.data.Content.length }} 条指导建议
+      </a-button>
+    </template>
+    <List
+      class="comment-list"
+      item-layout="horizontal"
+      :data-source="props.data.Content"
+    >
+      <template #renderItem="{ item }">
+        <ListItem>
+          <Comment>
+            <template #author>
+              <a>{{ item.FaultDesc }}</a>
+            </template>
+            <template #content>
+              <p>
+                {{ item.Guide }}
+              </p>
+            </template>
+            <template #datetime>
+              <a-tooltip :title="dayjs().format('YYYY-MM-DD HH:mm:ss')">
+                <span>{{ dayjs().fromNow() }}</span>
+              </a-tooltip>
+            </template>
+          </Comment>
+        </ListItem>
+      </template>
+    </List>
+  </Card>
+</template>
+
+<style scoped>
+::v-deep(.ant-card-body) {
+  height:80%;
+  padding:5px;
+overflow-y: auto;
+}
+
+::v-deep(.ant-list-item) {
+  padding:5px;
+}
+
+::v-deep(.ant-list-header) {
+padding:5px
+}
+</style>
diff --git a/src/views/dashboard/demo/components/ParameterInfo.vue b/src/views/dashboard/demo/components/ParameterInfo.vue
new file mode 100644
index 0000000..cfdcb42
--- /dev/null
+++ b/src/views/dashboard/demo/components/ParameterInfo.vue
@@ -0,0 +1,39 @@
+<script lang="ts" setup>
+import { Card } from 'ant-design-vue'
+import { BasicTable, useTable } from '@/components/Table'
+
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => {},
+  },
+})
+
+const [registerTable] = useTable({
+  dataSource: props.data.Content,
+  rowKey: 'id',
+  size: 'small',
+  immediate: false,
+  columns: props.data.Columns,
+  useSearchForm: false,
+  showTableSetting: false,
+  showIndexColumn: false,
+})
+</script>
+
+<template>
+  <Card :title="props.data.Header" v-bind="$attrs">
+    <!-- <template #extra>
+      <a-button type="link">
+        更多
+      </a-button>
+    </template> -->
+    <BasicTable @register="registerTable" />
+  </Card>
+</template>
+
+<style scoped>
+::v-deep(.ant-card-body) {
+  padding:5px;
+}
+</style>
diff --git a/src/views/dashboard/demo/components/ProjectCard.vue b/src/views/dashboard/demo/components/ProjectCard.vue
new file mode 100644
index 0000000..27cf44f
--- /dev/null
+++ b/src/views/dashboard/demo/components/ProjectCard.vue
@@ -0,0 +1,49 @@
+<script lang="ts" setup>
+import { Card, CardGrid } from 'ant-design-vue'
+import { groupItems } from './data'
+import { Icon } from '@/components/Icon'
+
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => {},
+  },
+})
+</script>
+
+<template>
+  <Card :title="props.data.Header" v-bind="$attrs">
+    <template #extra>
+      <a-button type="link">
+        更多
+      </a-button>
+    </template>
+
+    <CardGrid v-for="item in props.data.Content" :key="item.Point" class="!h-1/3 !w-full !md:w-1/2">
+      <!-- <Icon :icon="item.icon" :color="item.color" size="30" /> -->
+      <div class="text-center text-lg">
+        {{ item.Point }}
+      </div>
+
+      <div class="text-secondary mt-2 h-10 flex">
+        {{ item.FaultDesc }}
+      </div>
+      <!-- <div class="text-secondary flex justify-between">
+        <span>{{ item.group }}</span>
+        <span>{{ item.date }}</span>
+      </div> -->
+    </CardGrid>
+  </Card>
+</template>
+
+<style scoped>
+::v-deep(.ant-card-grid) {
+  padding:15px;
+}
+
+::v-deep(.ant-card-body) {
+height:80%;
+overflow-y: auto;
+
+}
+</style>
diff --git a/src/views/dashboard/demo/components/QuickNav.vue b/src/views/dashboard/demo/components/QuickNav.vue
new file mode 100644
index 0000000..d949d47
--- /dev/null
+++ b/src/views/dashboard/demo/components/QuickNav.vue
@@ -0,0 +1,16 @@
+<script lang="ts" setup>
+import { Card, CardGrid } from 'ant-design-vue'
+import { navItems } from './data'
+import { Icon } from '@/components/Icon'
+</script>
+
+<template>
+  <Card title="快捷导航">
+    <CardGrid v-for="item in navItems" :key="item.title">
+      <span class="flex flex-col items-center">
+        <Icon :icon="item.icon" :color="item.color" size="20" />
+        <span class="text-md mt-2 truncate">{{ item.title }}</span>
+      </span>
+    </CardGrid>
+  </Card>
+</template>
diff --git a/src/views/dashboard/demo/components/SaleRadar.vue b/src/views/dashboard/demo/components/SaleRadar.vue
new file mode 100644
index 0000000..b89c309
--- /dev/null
+++ b/src/views/dashboard/demo/components/SaleRadar.vue
@@ -0,0 +1,91 @@
+<script lang="ts" setup>
+import type { Ref } from 'vue'
+import { ref, watch } from 'vue'
+import { Card } from 'ant-design-vue'
+import { useECharts } from '@/hooks/web/useECharts'
+import { propTypes } from '@/utils/propTypes'
+
+const props = defineProps({
+  loading: Boolean,
+  width: propTypes.string.def('100%'),
+  height: propTypes.string.def('400px'),
+})
+
+const chartRef = ref<HTMLDivElement | null>(null)
+const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
+watch(
+  () => props.loading,
+  () => {
+    if (props.loading)
+      return
+
+    setOptions({
+      legend: {
+        bottom: 0,
+        data: ['Visits', 'Sales'],
+      },
+      tooltip: {},
+      radar: {
+        radius: '60%',
+        splitNumber: 8,
+        indicator: [
+          {
+            name: '2017',
+          },
+          {
+            name: '2017',
+          },
+          {
+            name: '2018',
+          },
+          {
+            name: '2019',
+          },
+          {
+            name: '2020',
+          },
+          {
+            name: '2021',
+          },
+        ],
+      },
+      series: [
+        {
+          type: 'radar',
+          symbolSize: 0,
+          areaStyle: {
+            shadowBlur: 0,
+            shadowColor: 'rgba(0,0,0,.2)',
+            shadowOffsetX: 0,
+            shadowOffsetY: 10,
+            opacity: 1,
+          },
+          data: [
+            {
+              value: [90, 50, 86, 40, 50, 20],
+              name: 'Visits',
+              itemStyle: {
+                color: '#b6a2de',
+              },
+            },
+            {
+              value: [70, 75, 70, 76, 20, 85],
+              name: 'Sales',
+              itemStyle: {
+                color: '#67e0e3',
+              },
+            },
+          ],
+        },
+      ],
+    })
+  },
+  { immediate: true },
+)
+</script>
+
+<template>
+  <Card title="销售统计" :loading="loading">
+    <div ref="chartRef" :style="{ width, height }" />
+  </Card>
+</template>
diff --git a/src/views/dashboard/demo/components/WorkbenchHeader.vue b/src/views/dashboard/demo/components/WorkbenchHeader.vue
new file mode 100644
index 0000000..af2d12d
--- /dev/null
+++ b/src/views/dashboard/demo/components/WorkbenchHeader.vue
@@ -0,0 +1,36 @@
+<script lang="ts" setup>
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => {},
+  },
+})
+</script>
+
+<template>
+  <div>
+    <!-- <Avatar :src="userinfo.user.avatar || headerImg" :size="72" class="!mx-auto !block" /> -->
+    <div class="mt-2 md:mt-0">
+      <h1 class="text-center text-lg md:text-2xl">
+        <!-- 早安, {{ userinfo.user.nickname }}, 开始您一天的工作吧！ -->
+        {{ props.data.title }}
+      </h1>
+      <!-- <span class="text-secondary"> 今日晴，20℃ - 32℃！ </span> -->
+    </div>
+    <!-- <div class="mt-4 flex flex-1 justify-end md:mt-0">
+      <div class="flex flex-col justify-center text-right">
+        <span class="text-secondary"> 待办 </span>
+        <span class="text-2xl">2/10</span>
+      </div>
+
+      <div class="mx-12 flex flex-col justify-center text-right md:mx-16">
+        <span class="text-secondary"> 项目 </span>
+        <span class="text-2xl">8</span>
+      </div>
+      <div class="mr-4 flex flex-col justify-center text-right md:mr-10">
+        <span class="text-secondary"> 团队 </span>
+        <span class="text-2xl">300</span>
+      </div>
+    </div> -->
+  </div>
+</template>
diff --git a/src/views/dashboard/demo/components/data.ts b/src/views/dashboard/demo/components/data.ts
new file mode 100644
index 0000000..750b142
--- /dev/null
+++ b/src/views/dashboard/demo/components/data.ts
@@ -0,0 +1,156 @@
+interface GroupItem {
+  title: string
+  icon: string
+  color: string
+  desc: string
+  date: string
+  group: string
+}
+
+interface NavItem {
+  title: string
+  icon: string
+  color: string
+}
+
+interface DynamicInfoItem {
+  avatar: string
+  name: string
+  date: string
+  desc: string
+}
+
+export const navItems: NavItem[] = [
+  {
+    title: '首页',
+    icon: 'ion:home-outline',
+    color: '#1fdaca',
+  },
+  {
+    title: '仪表盘',
+    icon: 'ion:grid-outline',
+    color: '#bf0c2c',
+  },
+  {
+    title: '组件',
+    icon: 'ion:layers-outline',
+    color: '#e18525',
+  },
+  {
+    title: '系统管理',
+    icon: 'ion:settings-outline',
+    color: '#3fb27f',
+  },
+  {
+    title: '权限管理',
+    icon: 'ion:key-outline',
+    color: '#4daf1bc9',
+  },
+  {
+    title: '图表',
+    icon: 'ion:bar-chart-outline',
+    color: '#00d8ff',
+  },
+]
+
+export const dynamicInfoItems: DynamicInfoItem[] = [
+  {
+    avatar: 'dynamic-avatar-1|svg',
+    name: '威廉',
+    date: '刚刚',
+    desc: '在 <a>开源组</a> 创建了项目 <a>Vue</a>',
+  },
+  {
+    avatar: 'dynamic-avatar-2|svg',
+    name: '艾文',
+    date: '1个小时前',
+    desc: '关注了 <a>威廉</a> ',
+  },
+  {
+    avatar: 'dynamic-avatar-3|svg',
+    name: '克里斯',
+    date: '1天前',
+    desc: '发布了 <a>个人动态</a> ',
+  },
+  {
+    avatar: 'dynamic-avatar-4|svg',
+    name: 'XingyuV',
+    date: '2天前',
+    desc: '发表文章 <a>如何编写一个Vite插件</a> ',
+  },
+  {
+    avatar: 'dynamic-avatar-5|svg',
+    name: '皮特',
+    date: '3天前',
+    desc: '回复了 <a>杰克</a> 的问题 <a>如何进行项目优化？</a>',
+  },
+  {
+    avatar: 'dynamic-avatar-6|svg',
+    name: '杰克',
+    date: '1周前',
+    desc: '关闭了问题 <a>如何运行项目</a> ',
+  },
+  {
+    avatar: 'dynamic-avatar-1|svg',
+    name: '威廉',
+    date: '1周前',
+    desc: '发布了 <a>个人动态</a> ',
+  },
+  {
+    avatar: 'dynamic-avatar-1|svg',
+    name: '威廉',
+    date: '2021-04-01 20:00',
+    desc: '推送了代码到 <a>Github</a>',
+  },
+]
+
+export const groupItems: GroupItem[] = [
+  {
+    title: 'Github',
+    icon: 'carbon:logo-github',
+    color: '',
+    desc: '不要等待机会，而要创造机会。',
+    group: '开源组',
+    date: '2021-04-01',
+  },
+  {
+    title: 'Vue',
+    icon: 'ion:logo-vue',
+    color: '#3fb27f',
+    desc: '现在的你决定将来的你。',
+    group: '算法组',
+    date: '2021-04-01',
+  },
+  {
+    title: 'Html5',
+    icon: 'ion:logo-html5',
+    color: '#e18525',
+    desc: '没有什么才能比努力更重要。',
+    group: '上班摸鱼',
+    date: '2021-04-01',
+  },
+  {
+    title: 'Angular',
+    icon: 'ion:logo-angular',
+    color: '#bf0c2c',
+    desc: '热情和欲望可以突破一切难关。',
+    group: 'UI',
+    date: '2021-04-01',
+  },
+  {
+    title: 'React',
+    icon: 'bx:bxl-react',
+    color: '#00d8ff',
+    desc: '健康的身体是实现目标的基石。',
+    group: '技术牛',
+    date: '2021-04-01',
+  },
+  {
+    title: 'Js',
+    icon: 'ion:logo-javascript',
+    color: '#EBD94E',
+    desc: '路是走出来的，而不是空想出来的。',
+    group: '架构组',
+    date: '2021-04-01',
+  },
+]
diff --git a/src/views/dashboard/demo/components/demo.json b/src/views/dashboard/demo/components/demo.json
new file mode 100644
index 0000000..63b037f
--- /dev/null
+++ b/src/views/dashboard/demo/components/demo.json
@@ -0,0 +1,130 @@
+{
+  "title": "示例设备展示",
+  "LeftUp": {
+    "Header": "设备静态图",
+    "pathq": "/src/assets/images/header.jpg",
+    "path": "/src/assets/svg/illustration.svg",
+    "Content": ""
+  },
+  "LeftMidUp": {
+    "Header": "故障诊断",
+    "Content": [{
+      "FaultDesc": "故障1故障1故障1故障1故障1",
+      "Point": "Diagnosis1"
+    }, {
+      "FaultDesc": "故障2",
+      "Point": "Diagnosis2"
+    },
+    {
+      "FaultDesc": "故障2",
+      "Point": "Diagnosis2"
+    }, {
+      "FaultDesc": "故障2",
+      "Point": "Diagnosis2"
+    }, {
+      "FaultDesc": "故障2",
+      "Point": "Diagnosis2"
+    }, {
+      "FaultDesc": "故障2",
+      "Point": "Diagnosis2"
+    }]
+  },
+  "RightMidUp": {
+    "Header": "报警记录",
+    "Content": [{
+      "Text": "故障1",
+      "StartTime": "Diagnosis1",
+      "Duration": 12.3
+    }, {
+      "Text": "故障1",
+      "StartTime": "Diagnosis1",
+      "Duration": 12.3
+    }]
+  },
+  "RightUp": {
+    "Header": "大模型-操作指导",
+    "Content": [{
+      "FaultDesc": "故障1",
+      "Guide": "如何处理故障1"
+    }, {
+      "FaultDesc": "故障2",
+      "Guide": "如何处理故障2"
+    }]
+  },
+  "LeftDown": {
+    "Header": "生产流程",
+		 "path": "/src/assets/svg/illustration.svg",
+    "Content": "/api/v1/assets/production_flow.svg"
+  },
+  "RightDown": {
+    "Header": "参数信息",
+    "Columns": [{
+      "title": "序号",
+      "dataIndex": "序号",
+      "width": 40
+    }, {
+      "title": "描述",
+      "dataIndex": "描述",
+      "width": 200
+    }, {
+      "title": "点号",
+      "dataIndex": "点号",
+      "width": 100
+    }, {
+      "title": "测量值",
+      "dataIndex": "测量值",
+      "width": 80
+    }, {
+      "title": "预测值",
+      "dataIndex": "预测值",
+      "width": 100
+    }, {
+      "title": "安全区域",
+      "dataIndex": "安全区域",
+      "width": 140
+    }],
+    "Content": [{
+      "序号": 1,
+      "描述": "",
+      "点号": "",
+      "测量值": 0.0,
+      "预测值": 0.0,
+      "安全区域": ""
+    }, {
+      "序号": 2,
+      "描述": "",
+      "点号": "",
+      "测量值": 0.0,
+      "预测值": 0.0,
+      "安全区域": ""
+    }, {
+      "序号": 3,
+      "描述": "",
+      "点号": "",
+      "测量值": 0.0,
+      "预测值": 0.0,
+      "安全区域": ""
+    }, {
+      "序号": 4,
+      "描述": "",
+      "点号": "",
+      "测量值": 0.0,
+      "预测值": 0.0,
+      "安全区域": ""
+    }, {
+      "序号": 5,
+      "描述": "",
+      "点号": "",
+      "测量值": 0.0,
+      "预测值": 0.0,
+      "安全区域": ""
+    }, {
+      "序号": 6,
+      "描述": "",
+      "点号": "",
+      "测量值": 0.0,
+      "预测值": 0.0,
+      "安全区域": ""
+    }]
+  }
+}
diff --git a/src/views/dashboard/demo/components/staticImg.vue b/src/views/dashboard/demo/components/staticImg.vue
new file mode 100644
index 0000000..e77a60f
--- /dev/null
+++ b/src/views/dashboard/demo/components/staticImg.vue
@@ -0,0 +1,18 @@
+<script lang="ts" setup>
+import { Card, CardGrid } from 'ant-design-vue'
+import { navItems } from './data'
+import { Icon } from '@/components/Icon'
+
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => {},
+  },
+})
+</script>
+
+<template>
+  <Card class="enter-y !my-1" :title="props.data.Header">
+    <img class="mx-auto h-50 w-full" :src="props.data.path">
+  </Card>
+</template>
diff --git a/src/views/dashboard/demo/index.vue b/src/views/dashboard/demo/index.vue
new file mode 100644
index 0000000..7289ff8
--- /dev/null
+++ b/src/views/dashboard/demo/index.vue
@@ -0,0 +1,54 @@
+<script lang="ts" setup>
+import { ref } from 'vue'
+import WorkbenchHeader from './components/WorkbenchHeader.vue'
+import ProjectCard from './components/ProjectCard.vue'
+import DynamicInfo from './components/DynamicInfo.vue'
+import StaticImg from './components/staticImg.vue'
+import ParameterInfo from './components/ParameterInfo.vue'
+import Operation from './components/Operation.vue'
+import data from './components/demo.json'
+import { PageWrapper } from '@/components/Page'
+
+const loading = ref(true)
+
+setTimeout(() => {
+  loading.value = false
+}, 500)
+</script>
+
+<template>
+  <PageWrapper class="m-1">
+    <template #headerContent>
+      <WorkbenchHeader :data="data" />
+    </template>
+    <div class="bg-[#f5f5f5]">
+      <div class="enter-y h-90 md:flex">
+        <StaticImg class="m-1 w-full md:w-1/4" :loading="loading" :data="data.LeftUp" />
+        <ProjectCard class="enter-y m-1 w-full md:w-1/4" :loading="loading" :data="data.LeftMidUp" />
+        <DynamicInfo :loading="loading" class="enter-y m-1 w-full md:w-1/4" :data="data.RightMidUp" />
+        <Operation class="m-1 w-full md:w-1/4" :loading="loading" :data="data.RightUp" />
+      </div>
+      <div class="enter-y h-95 md:flex">
+        <StaticImg class="m-1 w-full md:w-1/2" :loading="loading" :data="data.LeftDown" />
+        <ParameterInfo class="m-1 w-full md:w-1/2" :loading="loading" :data="data.RightDown" />
+      </div>
+      <!-- <div class="enter-y w-full !mr-4 lg:w-7/10">
+        <StaticImg :loading="loading" :data="data.LeftUp" class="enter-y" />
+      </div> -->
+
+      <!-- <div class="enter-y w-full !mr-4 lg:w-7/10">
+        <ProjectCard :loading="loading" class="enter-y" />
+        <DynamicInfo :loading="loading" class="enter-y !my-4" />
+      </div>
+      <div class="enter-y w-full lg:w-3/10">
+        <QuickNav :loading="loading" class="enter-y" />
+
+        <Card class="enter-y !my-4" :loading="loading">
+          <img class="mx-auto h-30 xl:h-50" src="@/assets/svg/illustration.svg">
+        </Card>
+
+        <SaleRadar :loading="loading" class="enter-y" />
+      </div> -->
+    </div>
+  </PageWrapper>
+</template>
diff --git a/src/views/run/calc/calc.data.ts b/src/views/run/calc/calc.data.ts
new file mode 100644
index 0000000..f0df0ad
--- /dev/null
+++ b/src/views/run/calc/calc.data.ts
@@ -0,0 +1,188 @@
+import moment from 'moment'
+
+import { ref } from 'vue'
+import type { BasicColumn, FormSchema } from '@/components/Table'
+import { DICT_TYPE, getDictOptions } from '@/utils/dict'
+import { optionListApi, subSystemListApi } from '@/api/alert/model/select'
+import type { systemSelectParams } from '@/api/alert/model/model/optionsModel'
+
+export const columns: BasicColumn[] = [
+  {
+    title: '编号',
+    dataIndex: 'id',
+    width: 80,
+    fixed: 'left',
+  },
+  {
+    title: '模型名称',
+    dataIndex: 'modelName',
+    width: 250,
+    className: 'instant',
+    slots: { customRender: 'detail' },
+    fixed: 'left',
+  },
+  {
+    title: '算法',
+    dataIndex: 'Algorithm',
+    width: 200,
+
+  },
+  {
+    title: '模式覆盖率',
+    dataIndex: 'CoveredPercent',
+    width: 200,
+  },
+  {
+    title: '报警次数',
+    dataIndex: 'AlarmNumber',
+    width: 200,
+  },
+  {
+    title: '总报警时间(m)',
+    dataIndex: 'AlarmToatlMinutes',
+    width: 200,
+  },
+  {
+    title: '系统维度',
+    dataIndex: 'Dimension',
+    width: 200,
+  },
+  {
+    title: '计算耗时(s)',
+    dataIndex: 'CalcSeconds',
+    width: 200,
+  },
+  {
+    title: '状态',
+    dataIndex: 'status',
+    width: 100,
+    slots: { customRender: 'status' },
+    fixed: 'right',
+  },
+]
+
+const optionList = await optionListApi()
+
+const systemOptions = ref<any>([])
+systemOptions.value = optionList.systems
+export const searchFormSchema: FormSchema[] = [
+  {
+    label: '机组',
+    field: 'unit',
+    component: 'Select',
+    defaultValue: optionList.units[0].id || null,
+    colProps: { span: 4 },
+
+    componentProps: ({ formModel }) => {
+      return {
+      // xxxx props
+        allowClear: false,
+        placeholder: '请选择机组',
+        options: optionList.units.map(unit => ({ value: unit.id, label: unit.name })),
+        onChange: async (e: any) => {
+          // const { reload } = tableAction
+          // reload()
+          // or
+          console.log(e)
+          const param: systemSelectParams = {
+            unitId: e,
+            typeId: formModel.type,
+          }
+          systemOptions.value = await subSystemListApi(param)
+          formModel.system = systemOptions.value[0].id
+        },
+      }
+    },
+  },
+  {
+    label: '系统',
+    field: 'type',
+    component: 'Select',
+    defaultValue: optionList.types[0].id || null,
+    colProps: { span: 4 },
+    componentProps: ({ formModel }) => {
+      return {
+        allowClear: false,
+        placeholder: '请选择系统',
+        options: optionList.types.map(type => ({ value: type.id, label: type.name })),
+        onChange: async (e: any) => {
+          // const { reload } = tableAction
+          // reload()
+          // or
+          console.log(e)
+          const param: systemSelectParams = {
+            unitId: formModel.unit,
+            typeId: e,
+          }
+          systemOptions.value = await subSystemListApi(param)
+        },
+      }
+    },
+  },
+  {
+    label: '子系统',
+    field: 'system',
+    component: 'Select',
+    defaultValue: systemOptions.value[0].id || null,
+    colProps: { span: 4 },
+    componentProps: () => {
+      return {
+        allowClear: false,
+        placeholder: '请选择子系统',
+        options: systemOptions.value.map(system => ({ value: system.id, label: system.name })),
+      }
+    },
+  },
+
+  {
+    label: '模型名称',
+    field: 'modelName',
+    component: 'Input',
+
+    defaultValue: '',
+    componentProps: {
+      placeholder: '请输入模型名称',
+    },
+    colProps: { span: 4 },
+  },
+]
+
+export const calcFormSchemas: FormSchema[] = [
+  {
+    label: '回算时间',
+    field: 'time',
+    component: 'RangePicker',
+    componentProps: {
+      placeholder: ['开始时间', '结束时间'],
+      defaultValue: [moment().subtract(1, 'day').format('YYYY-MM-DD HH:mm:ss'), moment().format('YYYY-MM-DD HH:mm:ss')],
+      valueFormat: 'YYYY-MM-DD HH:mm:ss',
+      showTime: {
+        defaultValue: [moment().subtract(1, 'day').format('YYYY-MM-DD HH:mm:ss'), moment().format('YYYY-MM-DD HH:mm:ss')],
+      },
+
+      onChange: (e: any) => {
+        console.log(e)
+      },
+    },
+    required: true,
+
+    colProps: {
+      span: 8,
+    },
+  },
+  {
+    label: '回算采样周期',
+    field: 'interval',
+    component: 'Select',
+    defaultValue: 60,
+
+    componentProps: {
+      options: [{ value: 10, label: '10秒' }, { value: 60, label: '60秒' }, { value: 300, label: '300秒' }],
+    },
+    required: true,
+    colProps: {
+      span: 4,
+    },
+  },
+
+]
diff --git a/src/views/run/calc/index.vue b/src/views/run/calc/index.vue
new file mode 100644
index 0000000..efe594c
--- /dev/null
+++ b/src/views/run/calc/index.vue
@@ -0,0 +1,185 @@
+<script lang="ts" setup>
+import { Badge, Button, Divider, Switch } from 'ant-design-vue'
+import { onMounted, ref } from 'vue'
+import moment from 'moment'
+import HistoryModal from '../../exa/config/HistoryModal.vue'
+import { calcFormSchemas, columns, searchFormSchema } from './calc.data'
+
+import { BasicTable, TableAction, useTable } from '@/components/Table'
+import { BasicForm, useForm } from '@/components/Form'
+
+import { getInstantCount, getInstantPage, updateInstant } from '@/api/alert/run/instant'
+import { getExaNow } from '@/api/alert/exa'
+import { useI18n } from '@/hooks/web/useI18n'
+import { router } from '@/router'
+import { useMessage } from '@/hooks/web/useMessage'
+import { IconEnum } from '@/enums/appEnum'
+import { useModal } from '@/components/Modal'
+
+defineOptions({ name: 'InstantCalc' })
+const { createMessage } = useMessage()
+const { t } = useI18n()
+
+const [registerHistoryModal, { openModal: openHistoryModal }] = useModal()
+const [registerCreateModal, { openModal: openCreateModal }] = useModal()
+const [registerUpdateModal, { openModal: openUpdateModal }] = useModal()
+
+const [registerTable, { getForm, reload, getDataSource, updateTableDataRecord }] = useTable({
+  title: '实例列表',
+  api: getInstantPage,
+  rowKey: 'id',
+  immediate: true,
+  columns,
+  formConfig: {
+    labelWidth: 70,
+    schemas: searchFormSchema,
+    showResetButton: false,
+    actionColOptions: {
+      span: 2,
+    },
+
+  },
+  useSearchForm: true,
+  showTableSetting: true,
+  showIndexColumn: false,
+  actionColumn: {
+    width: 100,
+    title: t('common.action'),
+    dataIndex: 'action',
+    fixed: 'right',
+  },
+})
+
+const isShow = ref<boolean>(false)
+
+function handleCreate() {
+  openCreateModal(true, { isUpdate: false })
+  isShow.value = true
+}
+
+function handleEdit(record: Recordable) {
+  openUpdateModal(true, { record, isUpdate: true })
+}
+async function handleDelete(record: Recordable) {
+  await deleteRole(record.id)
+  createMessage.success(t('common.delSuccessText'))
+  reload()
+}
+
+const itemName = ref<string>()
+const legendName = ref<string[]>()
+function handleHistory(record: Recordable) {
+  itemName.value = (JSON.parse(record.instantInfo)).model_state
+  legendName.value = []
+  legendName.value.push(`${record.mpName}-${itemName.value}`)
+  openHistoryModal(true, { record })
+}
+
+function handleWarnConfig(record: Recordable) {
+  router.push(`/run/warnConfig?id=${record.id}`)
+}
+
+/**
+ * BasicForm绑定注册;
+ */
+const [registerForm] = useForm({
+  // 注册表单列
+  schemas: calcFormSchemas,
+  // 是否显示展开收起按钮，默认false
+  // showAdvancedButton: true,
+  // // // 超过指定行数折叠，默认3行
+  // autoAdvancedLine: 1,
+  // // // 折叠时默认显示行数，默认1行
+  // alwaysShowLines: 1,
+  layout: 'horizontal',
+  model: { time: [moment().subtract(1, 'day').format('YYYY-MM-DD HH:mm:ss'), moment().format('YYYY-MM-DD HH:mm:ss')] },
+  fieldMapToTime: [
+    // data为时间组件在表单内的字段，startTime，endTime为转化后的开始时间于结束时间
+    ['time', ['startTime', 'endTime'], 'YYYY-MM-DD HH:mm:ss'],
+  ],
+  actionColOptions: { span: 2 },
+  showSubmitButton: false,
+  showResetButton: false,
+})
+
+/**
+ * 点击提交按钮的value值----改为导出按钮
+ * @param values
+ */
+function handleSubmit(values: any) {
+  console.log('提交按钮数据::::', values)
+}
+// 回算
+function handleCalc(values: any) {
+  console.log('提交按钮数据::::', values)
+}
+</script>
+
+<template>
+  <div>
+    <BasicTable @register="registerTable">
+      <template #form-formFooter>
+        <!-- <a-button v-auth="['run:instant:create']" type="primary" :pre-icon="IconEnum.ADD" @click="handleCreate">
+          {{ t('action.create') }}
+        </a-button> -->
+        <Divider orientation="left">
+          回算
+        </Divider>
+        <!-- 自定义表单 -->
+        <BasicForm @register="registerForm">
+          <template #advanceBefore>
+            <a-button v-auth="['run:instant:create']" type="primary" :pre-icon="IconEnum.ADD" @click="handleCreate">
+              {{ t('action.create') }}
+            </a-button>
+          </template>
+        </BasicForm>
+      </template>
+
+      <!-- 统计量点击跳转历史曲线 -->
+      <template #history="{ record }">
+        <a @click="handleHistory(record)">
+          {{ record.pointSte }}
+        </a>
+        <!-- <SlidersOutlined class="click-status" /> -->
+      </template>
+
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              { icon: IconEnum.BACK_CALC, label: t('action.backCalc'), onClick: handleWarnConfig.bind(null, record) },
+            ]"
+          />
+        </template>
+      </template>
+    </BasicTable>
+    <HistoryModal :item-name="itemName" :legend-name="legendName" @register="registerHistoryModal" />
+    <CreateModal :item-name="itemName" :legend-name="legendName" @register="registerCreateModal" @success="reload" />
+    <UpdateModal @register="registerUpdateModal" @success="reload" />
+  </div>
+</template>
+
+<style lang="less" scoped>
+:deep(.instant) {
+  font-weight: bold;
+  color: #0B55A4
+}
+
+:deep(.alarm .ant-badge-status-dot) {
+  animation: flash 1s linear infinite;
+}
+
+@keyframes flash {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+.runningStatus {
+  cursor: pointer;
+}
+</style>
diff --git a/src/views/run/instant/index.vue b/src/views/run/instant/index.vue
index dad4936..0b589b3 100644
--- a/src/views/run/instant/index.vue
+++ b/src/views/run/instant/index.vue
@@ -136,7 +136,7 @@ async function getNow() {
 }
 
 function handleWarnConfig(record: Recordable) {
-  router.push(`/run/warnConfig?id=${record.id}`)
+  router.push(`/run/instant/warn/config?id=${record.id}`)
 }
 </script>
 
diff --git a/src/views/warn/UpdateModal.vue b/src/views/run/instant/warnConfig/UpdateModal.vue
similarity index 100%
rename from src/views/warn/UpdateModal.vue
rename to src/views/run/instant/warnConfig/UpdateModal.vue
diff --git a/src/views/warn/index.vue b/src/views/run/instant/warnConfig/index.vue
similarity index 100%
rename from src/views/warn/index.vue
rename to src/views/run/instant/warnConfig/index.vue
diff --git a/src/views/warn/warn.data.ts b/src/views/run/instant/warnConfig/warn.data.ts
similarity index 100%
rename from src/views/warn/warn.data.ts
rename to src/views/run/instant/warnConfig/warn.data.ts
diff --git a/src/views/system/user/user.data.ts b/src/views/system/user/user.data.ts
index 48353bc..3750fc1 100644
--- a/src/views/system/user/user.data.ts
+++ b/src/views/system/user/user.data.ts
@@ -182,18 +182,18 @@ export const formSchema: FormSchema[] = [
       options: getDictOptions(DICT_TYPE.SYSTEM_USER_SEX),
     },
   },
-  {
-    label: '岗位',
-    field: 'postIds',
-    component: 'ApiSelect',
-    defaultValue: [],
-    componentProps: {
-      api: () => listSimplePosts(),
-      labelField: 'name',
-      valueField: 'id',
-      mode: 'tags',
-    },
-  },
+  // {
+  //   label: '岗位',
+  //   field: 'postIds',
+  //   component: 'ApiSelect',
+  //   defaultValue: [],
+  //   componentProps: {
+  //     api: () => listSimplePosts(),
+  //     labelField: 'name',
+  //     valueField: 'id',
+  //     mode: 'tags',
+  //   },
+  // },
   {
     label: '状态',
     field: 'status',