diff --git a/ruoyi-ui/.env.development b/ruoyi-ui/.env.development
index 302ecd1a..c1482767 100644
--- a/ruoyi-ui/.env.development
+++ b/ruoyi-ui/.env.development
@@ -1,10 +1,10 @@
 # 页面标题
-VUE_APP_TITLE = 若依管理系统
+VUE_APP_TITLE = 智能作业系统
 
 # 开发环境配置
 ENV = 'development'
 
-# 若依管理系统/开发环境
+# 智能作业系统/开发环境
 VUE_APP_BASE_API = '/dev-api'
 
 # 路由懒加载
diff --git a/ruoyi-ui/.env.production b/ruoyi-ui/.env.production
index cb064ec8..55776496 100644
--- a/ruoyi-ui/.env.production
+++ b/ruoyi-ui/.env.production
@@ -1,8 +1,8 @@
-# 页面标题
-VUE_APP_TITLE = 若依管理系统
-
-# 生产环境配置
-ENV = 'production'
-
-# 若依管理系统/生产环境
-VUE_APP_BASE_API = '/prod-api'
+# 页面标题
+VUE_APP_TITLE = 智能作业系统
+
+# 生产环境配置
+ENV = 'production'
+
+# 智能作业系统/生产环境
+VUE_APP_BASE_API = '/prod-api'
diff --git a/ruoyi-ui/.env.staging b/ruoyi-ui/.env.staging
index a47af9a2..b4042af9 100644
--- a/ruoyi-ui/.env.staging
+++ b/ruoyi-ui/.env.staging
@@ -1,10 +1,10 @@
-# 页面标题
-VUE_APP_TITLE = 若依管理系统
-
-NODE_ENV = production
-
-# 测试环境配置
-ENV = 'staging'
-
-# 若依管理系统/测试环境
-VUE_APP_BASE_API = '/stage-api'
+# 页面标题
+VUE_APP_TITLE = 智能作业系统
+
+NODE_ENV = production
+
+# 测试环境配置
+ENV = 'staging'
+
+# 智能作业系统/测试环境
+VUE_APP_BASE_API = '/stage-api'
diff --git a/ruoyi-ui/package.json b/ruoyi-ui/package.json
index 0e77a613..1664dd20 100644
--- a/ruoyi-ui/package.json
+++ b/ruoyi-ui/package.json
@@ -1,7 +1,7 @@
 {
   "name": "ruoyi",
   "version": "3.6.1",
-  "description": "若依管理系统",
+  "description": "智能作业系统",
   "author": "若依",
   "license": "MIT",
   "scripts": {
diff --git a/ruoyi-ui/src/App.vue b/ruoyi-ui/src/App.vue
index a2c4b872..ba498506 100644
--- a/ruoyi-ui/src/App.vue
+++ b/ruoyi-ui/src/App.vue
@@ -1,28 +1,112 @@
-<template>
-  <div id="app">
-    <router-view />
-    <theme-picker />
-  </div>
-</template>
-
-<script>
-import ThemePicker from "@/components/ThemePicker";
-
-export default {
-  name: "App",
-  components: { ThemePicker },
-    metaInfo() {
-        return {
-            title: this.$store.state.settings.dynamicTitle && this.$store.state.settings.title,
-            titleTemplate: title => {
-                return title ? `${title} - ${process.env.VUE_APP_TITLE}` : process.env.VUE_APP_TITLE
-            }
-        }
-    }
-};
-</script>
-<style scoped>
-#app .theme-picker {
-  display: none;
-}
-</style>
+<template>
+  <div id="app">
+    <router-view />
+    <theme-picker />
+  </div>
+</template>
+
+<script>
+import ThemePicker from "@/components/ThemePicker";
+import WaterMark from '@/plugins/waterMark.js'
+
+export default {
+  name: "App",
+  components: { ThemePicker },
+    metaInfo() {
+        return {
+            title: this.$store.state.settings.dynamicTitle && this.$store.state.settings.title,
+            titleTemplate: title => {
+                return title ? `${title} - ${process.env.VUE_APP_TITLE}` : process.env.VUE_APP_TITLE
+            }
+        }
+    },
+  mounted() {
+    // this.initWartHeight = document.body.clientHeight
+    // this.initWaterMark(this.initWartHeight)
+    // window.addEventListener('scroll', this.handleScroll, true)
+  },
+  methods: {
+    //添加水印
+    initWaterMark(height) {
+      let userInfo = this.$store.state.user.userInfo,
+        _time = this.$global.createTime('day'),
+        _str = '测试角色' + ' / ' + '测试用户' + ' / ' + _time
+      console.log(userInfo, '水印')
+      WaterMark(_str, height)
+    },
+    handleScroll() {
+      this.$nextTick(() => {
+        let height = document.getElementById('app-main').scrollHeight
+        console.log('内容区高度', height)
+        if (height && this.initWartHeight != height) {
+          this.initWartHeight = height
+          this.initWaterMark(height)
+        }
+      })
+    },
+    // 根据当前路由设置hasOpen
+    isOpenIframePage() {
+      console.log(this.componentsArr, 'this.componentsArr')
+      const target = this.componentsArr.find(item => {
+        console.log(item, 'item')
+        return item.path === this.$route.query.path
+      })
+      if (target && !target.hasOpen) {
+        target.hasOpen = true
+      }
+    },
+    // 遍历路由的所有页面，把含有iframeComponent标识的收集起来
+    getComponentsArr() {
+      // debugger
+      const router = this.$router
+      const routes = router.options.routes
+      // console.log(router.options.routes, '打印 router.options.routes')
+      const iframeArr = [] //routes.filter(item => item.iframeComponent)
+      const [{ iframeComponent = null } = {}] = iframeArr || []
+      // if (sessionStorage.getItem('iframeMenuList')) return false
+      // 处理单客画像客户明细切换页签改变问题
+      const [{ name: custRouteName, path, component }] = routes.filter(item => item.name === 'uCustView')
+      const custComponent = { name: custRouteName, menuUrl: path, component }
+      // console.log(custViews, 'custViews')
+      if (sessionStorage.getItem('iframeMenuList')) {
+        const iframeMenuList = JSON.parse(sessionStorage.getItem('iframeMenuList')) || []
+        // console.log(routes,iframeArr,'iframeArr')
+        console.log(iframeMenuList, 'options 1111')
+
+        return [...iframeMenuList, custComponent].map(item => {
+          const name = item.menuId || item.menuUrl.replace('/', '')
+          return {
+            name,
+            path: item.menuUrl,
+            menuUrl: item.menuUrl,
+            hasOpen: false, // 是否打开过，默认false
+            component: iframeComponent, // 组件文件的引用
+            // fullPath: item.fullPath,
+          }
+        })
+      }
+      return false
+    },
+    // 初始化iframe
+    initIframe() {
+      // debugger
+      const componentsArr = this.getComponentsArr()
+      console.log(componentsArr, 'componentsArr')
+      if (componentsArr) {
+        componentsArr.forEach(item => {
+          Vue.component(item.name, item.component)
+        })
+        this.componentsArr = componentsArr
+        console.log(this.componentsArr, 'this.componentsArr')
+        // 判断当前路由是否iframe页
+        this.isOpenIframePage()
+      }
+    },
+  },
+};
+</script>
+<style scoped>
+#app .theme-picker {
+  display: none;
+}
+</style>
diff --git a/ruoyi-ui/src/api/login.js b/ruoyi-ui/src/api/login.js
index 6b0cda03..c23e7fb2 100644
--- a/ruoyi-ui/src/api/login.js
+++ b/ruoyi-ui/src/api/login.js
@@ -1,61 +1,61 @@
-import request from '@/utils/request'
-
-// 登录方法
-export function login(username, password, code, uuid) {
-  return request({
-    url: '/auth/login',
-    headers: {
-      isToken: false
-    },
-    method: 'post',
-    data: { username, password, code, uuid }
-  })
-}
-
-// 注册方法
-export function register(data) {
-  return request({
-    url: '/auth/register',
-    headers: {
-      isToken: false
-    },
-    method: 'post',
-    data: data
-  })
-}
-
-// 刷新方法
-export function refreshToken() {
-  return request({
-    url: '/auth/refresh',
-    method: 'post'
-  })
-}
-
-// 获取用户详细信息
-export function getInfo() {
-  return request({
-    url: '/system/user/getInfo',
-    method: 'get'
-  })
-}
-
-// 退出方法
-export function logout() {
-  return request({
-    url: '/auth/logout',
-    method: 'delete'
-  })
-}
-
-// 获取验证码
-export function getCodeImg() {
-  return request({
-    url: '/code',
-    headers: {
-      isToken: false
-    },
-    method: 'get',
-    timeout: 20000
-  })
-}
\ No newline at end of file
+import request from '@/utils/request'
+
+// 登录方法
+export function login(username, password, code, uuid) {
+  return request({
+    url: '/system/login',
+    headers: {
+      isToken: false
+    },
+    method: 'post',
+    data: { username, password, code, uuid }
+  })
+}
+
+// 注册方法
+export function register(data) {
+  return request({
+    url: '/system/register',
+    headers: {
+      isToken: false
+    },
+    method: 'post',
+    data: data
+  })
+}
+
+// 刷新方法
+export function refreshToken() {
+  return request({
+    url: '/system/refresh',
+    method: 'post'
+  })
+}
+
+// 获取用户详细信息
+export function getInfo() {
+  return request({
+    url: '/system/user/getInfo',
+    method: 'get'
+  })
+}
+
+// 退出方法
+export function logout() {
+  return request({
+    url: '/system/logout',
+    method: 'delete'
+  })
+}
+
+// 获取验证码
+export function getCodeImg() {
+  return request({
+    url: '/code',
+    headers: {
+      isToken: false
+    },
+    method: 'get',
+    timeout: 20000
+  })
+}
diff --git a/ruoyi-ui/src/api/system/menu.js b/ruoyi-ui/src/api/system/menu.js
index 97258ee6..ece5e81c 100644
--- a/ruoyi-ui/src/api/system/menu.js
+++ b/ruoyi-ui/src/api/system/menu.js
@@ -1,60 +1,60 @@
-import request from '@/utils/request'
-
-// 查询菜单列表
-export function listMenu(query) {
-  return request({
-    url: '/system/menu/list',
-    method: 'get',
-    params: query
-  })
-}
-
-// 查询菜单详细
-export function getMenu(menuId) {
-  return request({
-    url: '/system/menu/' + menuId,
-    method: 'get'
-  })
-}
-
-// 查询菜单下拉树结构
-export function treeselect() {
-  return request({
-    url: '/system/menu/treeselect',
-    method: 'get'
-  })
-}
-
-// 根据角色ID查询菜单下拉树结构
-export function roleMenuTreeselect(roleId) {
-  return request({
-    url: '/system/menu/roleMenuTreeselect/' + roleId,
-    method: 'get'
-  })
-}
-
-// 新增菜单
-export function addMenu(data) {
-  return request({
-    url: '/system/menu',
-    method: 'post',
-    data: data
-  })
-}
-
-// 修改菜单
-export function updateMenu(data) {
-  return request({
-    url: '/system/menu',
-    method: 'put',
-    data: data
-  })
-}
-
-// 删除菜单
-export function delMenu(menuId) {
-  return request({
-    url: '/system/menu/' + menuId,
-    method: 'delete'
-  })
-}
\ No newline at end of file
+  import request from '@/utils/request'
+
+// 查询菜单列表
+export function listMenu(query) {
+  return request({
+    url: '/system/menu/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询菜单详细
+export function getMenu(menuId) {
+  return request({
+    url: '/system/menu/' + menuId,
+    method: 'get'
+  })
+}
+
+// 查询菜单下拉树结构
+export function treeselect() {
+  return request({
+    url: '/system/menu/treeselect',
+    method: 'get'
+  })
+}
+
+// 根据角色ID查询菜单下拉树结构
+export function roleMenuTreeselect(roleId) {
+  return request({
+    url: '/system/menu/roleMenuTreeselect/' + roleId,
+    method: 'get'
+  })
+}
+
+// 新增菜单
+export function addMenu(data) {
+  return request({
+    url: '/system/menu',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改菜单
+export function updateMenu(data) {
+  return request({
+    url: '/system/menu',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除菜单
+export function delMenu(menuId) {
+  return request({
+    url: '/system/menu/' + menuId,
+    method: 'delete'
+  })
+}
diff --git a/ruoyi-ui/src/assets/img/banner/bg.png b/ruoyi-ui/src/assets/img/banner/bg.png
new file mode 100644
index 00000000..2a34a0dc
Binary files /dev/null and b/ruoyi-ui/src/assets/img/banner/bg.png differ
diff --git a/ruoyi-ui/src/assets/img/banner/head_avatar.png b/ruoyi-ui/src/assets/img/banner/head_avatar.png
new file mode 100644
index 00000000..7854a979
Binary files /dev/null and b/ruoyi-ui/src/assets/img/banner/head_avatar.png differ
diff --git a/ruoyi-ui/src/assets/img/banner/head_bank_logo.png b/ruoyi-ui/src/assets/img/banner/head_bank_logo.png
new file mode 100644
index 00000000..2a2dd33c
Binary files /dev/null and b/ruoyi-ui/src/assets/img/banner/head_bank_logo.png differ
diff --git a/ruoyi-ui/src/assets/img/banner/header_bg.png b/ruoyi-ui/src/assets/img/banner/header_bg.png
new file mode 100644
index 00000000..6f50cd0b
Binary files /dev/null and b/ruoyi-ui/src/assets/img/banner/header_bg.png differ
diff --git a/ruoyi-ui/src/assets/img/banner/new_pro.png b/ruoyi-ui/src/assets/img/banner/new_pro.png
new file mode 100644
index 00000000..ec54678a
Binary files /dev/null and b/ruoyi-ui/src/assets/img/banner/new_pro.png differ
diff --git a/ruoyi-ui/src/assets/img/banner/newpro.png b/ruoyi-ui/src/assets/img/banner/newpro.png
new file mode 100644
index 00000000..df89d2f8
Binary files /dev/null and b/ruoyi-ui/src/assets/img/banner/newpro.png differ
diff --git a/ruoyi-ui/src/assets/img/banner/pro_hot.png b/ruoyi-ui/src/assets/img/banner/pro_hot.png
new file mode 100644
index 00000000..fa19d82f
Binary files /dev/null and b/ruoyi-ui/src/assets/img/banner/pro_hot.png differ
diff --git a/ruoyi-ui/src/assets/img/banner/red_black.png b/ruoyi-ui/src/assets/img/banner/red_black.png
new file mode 100644
index 00000000..fbf01723
Binary files /dev/null and b/ruoyi-ui/src/assets/img/banner/red_black.png differ
diff --git a/ruoyi-ui/src/assets/img/banner/user.png b/ruoyi-ui/src/assets/img/banner/user.png
new file mode 100644
index 00000000..bba9f171
Binary files /dev/null and b/ruoyi-ui/src/assets/img/banner/user.png differ
diff --git a/ruoyi-ui/src/assets/img/home/head_bg_logo.png b/ruoyi-ui/src/assets/img/home/head_bg_logo.png
new file mode 100644
index 00000000..8a250cb4
Binary files /dev/null and b/ruoyi-ui/src/assets/img/home/head_bg_logo.png differ
diff --git a/ruoyi-ui/src/assets/logo-imgs/安全退出icon@2x.png b/ruoyi-ui/src/assets/logo-imgs/安全退出icon@2x.png
new file mode 100644
index 00000000..1b5bd754
Binary files /dev/null and b/ruoyi-ui/src/assets/logo-imgs/安全退出icon@2x.png differ
diff --git a/ruoyi-ui/src/assets/styles/sidebar.scss b/ruoyi-ui/src/assets/styles/sidebar.scss
index 43d5f9a9..7358c58c 100644
--- a/ruoyi-ui/src/assets/styles/sidebar.scss
+++ b/ruoyi-ui/src/assets/styles/sidebar.scss
@@ -1,227 +1,228 @@
-#app {
-
-  .main-container {
-    min-height: 100%;
-    transition: margin-left .28s;
-    margin-left: $base-sidebar-width;
-    position: relative;
-  }
-
-  .sidebarHide {
-    margin-left: 0!important;
-  }
-
-  .sidebar-container {
-    -webkit-transition: width .28s;
-    transition: width 0.28s;
-    width: $base-sidebar-width !important;
-    background-color: $base-menu-background;
-    height: 100%;
-    position: fixed;
-    font-size: 0px;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    z-index: 1001;
-    overflow: hidden;
-    -webkit-box-shadow: 2px 0 6px rgba(0,21,41,.35);
-    box-shadow: 2px 0 6px rgba(0,21,41,.35);
-
-    // reset element-ui css
-    .horizontal-collapse-transition {
-      transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
-    }
-
-    .scrollbar-wrapper {
-      overflow-x: hidden !important;
-    }
-
-    .el-scrollbar__bar.is-vertical {
-      right: 0px;
-    }
-
-    .el-scrollbar {
-      height: 100%;
-    }
-
-    &.has-logo {
-      .el-scrollbar {
-        height: calc(100% - 50px);
-      }
-    }
-
-    .is-horizontal {
-      display: none;
-    }
-
-    a {
-      display: inline-block;
-      width: 100%;
-      overflow: hidden;
-    }
-
-    .svg-icon {
-      margin-right: 16px;
-    }
-
-    .el-menu {
-      border: none;
-      height: 100%;
-      width: 100% !important;
-    }
-
-    .el-menu-item, .el-submenu__title {
-      overflow: hidden !important;
-      text-overflow: ellipsis !important;
-      white-space: nowrap !important;
-    }
-
-    // menu hover
-    .submenu-title-noDropdown,
-    .el-submenu__title {
-      &:hover {
-        background-color: rgba(0, 0, 0, 0.06) !important;
-      }
-    }
-
-    & .theme-dark .is-active > .el-submenu__title {
-      color: $base-menu-color-active !important;
-    }
-
-    & .nest-menu .el-submenu>.el-submenu__title,
-    & .el-submenu .el-menu-item {
-      min-width: $base-sidebar-width !important;
-
-      &:hover {
-        background-color: rgba(0, 0, 0, 0.06) !important;
-      }
-    }
-
-    & .theme-dark .nest-menu .el-submenu>.el-submenu__title,
-    & .theme-dark .el-submenu .el-menu-item {
-      background-color: $base-sub-menu-background !important;
-
-      &:hover {
-        background-color: $base-sub-menu-hover !important;
-      }
-    }
-  }
-
-  .hideSidebar {
-    .sidebar-container {
-      width: 54px !important;
-    }
-
-    .main-container {
-      margin-left: 54px;
-    }
-
-    .submenu-title-noDropdown {
-      padding: 0 !important;
-      position: relative;
-
-      .el-tooltip {
-        padding: 0 !important;
-
-        .svg-icon {
-          margin-left: 20px;
-        }
-      }
-    }
-
-    .el-submenu {
-      overflow: hidden;
-
-      &>.el-submenu__title {
-        padding: 0 !important;
-
-        .svg-icon {
-          margin-left: 20px;
-        }
-
-      }
-    }
-
-    .el-menu--collapse {
-      .el-submenu {
-        &>.el-submenu__title {
-          &>span {
-            height: 0;
-            width: 0;
-            overflow: hidden;
-            visibility: hidden;
-            display: inline-block;
-          }
-        }
-      }
-    }
-  }
-
-  .el-menu--collapse .el-menu .el-submenu {
-    min-width: $base-sidebar-width !important;
-  }
-
-  // mobile responsive
-  .mobile {
-    .main-container {
-      margin-left: 0px;
-    }
-
-    .sidebar-container {
-      transition: transform .28s;
-      width: $base-sidebar-width !important;
-    }
-
-    &.hideSidebar {
-      .sidebar-container {
-        pointer-events: none;
-        transition-duration: 0.3s;
-        transform: translate3d(-$base-sidebar-width, 0, 0);
-      }
-    }
-  }
-
-  .withoutAnimation {
-
-    .main-container,
-    .sidebar-container {
-      transition: none;
-    }
-  }
-}
-
-// when menu collapsed
-.el-menu--vertical {
-  &>.el-menu {
-    .svg-icon {
-      margin-right: 16px;
-    }
-  }
-
-  .nest-menu .el-submenu>.el-submenu__title,
-  .el-menu-item {
-    &:hover {
-      // you can use $subMenuHover
-      background-color: rgba(0, 0, 0, 0.06) !important;
-    }
-  }
-
-  // the scroll bar appears when the subMenu is too long
-  >.el-menu--popup {
-    max-height: 100vh;
-    overflow-y: auto;
-
-    &::-webkit-scrollbar-track-piece {
-      background: #d3dce6;
-    }
-
-    &::-webkit-scrollbar {
-      width: 6px;
-    }
-
-    &::-webkit-scrollbar-thumb {
-      background: #99a9bf;
-      border-radius: 20px;
-    }
-  }
-}
+#app {
+
+  .main-container {
+    transition: margin-left .28s;
+    margin-left: $base-sidebar-width;
+    position: relative;
+    overflow-y: hidden;
+    top: 80px;
+  }
+
+  .sidebarHide {
+    margin-left: 0!important;
+  }
+
+  .sidebar-container {
+    -webkit-transition: width .28s;
+    transition: width 0.28s;
+    width: $base-sidebar-width !important;
+    background-color: $base-menu-background;
+    height: calc(100vh - 80px);
+    position: fixed;
+    font-size: 0px;
+    top: 80px;
+    bottom: 0;
+    left: 0;
+    z-index: 1001;
+    overflow: hidden;
+    -webkit-box-shadow: 2px 0 6px rgba(0,21,41,.35);
+    box-shadow: 2px 0 6px rgba(0,21,41,.35);
+
+    // reset element-ui css
+    .horizontal-collapse-transition {
+      transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
+    }
+
+    .scrollbar-wrapper {
+      overflow-x: hidden !important;
+    }
+
+    .el-scrollbar__bar.is-vertical {
+      right: 0px;
+    }
+
+    .el-scrollbar {
+      height: 100%;
+    }
+
+    &.has-logo {
+      .el-scrollbar {
+        height: calc(100% - 50px);
+      }
+    }
+
+    .is-horizontal {
+      display: none;
+    }
+
+    a {
+      display: inline-block;
+      width: 100%;
+      overflow: hidden;
+    }
+
+    .svg-icon {
+      margin-right: 16px;
+    }
+
+    .el-menu {
+      border: none;
+      height: 100%;
+      width: 100% !important;
+    }
+
+    .el-menu-item, .el-submenu__title {
+      overflow: hidden !important;
+      text-overflow: ellipsis !important;
+      white-space: nowrap !important;
+    }
+
+    // menu hover
+    .submenu-title-noDropdown,
+    .el-submenu__title {
+      &:hover {
+        background-color: rgba(0, 0, 0, 0.06) !important;
+      }
+    }
+
+    & .theme-dark .is-active > .el-submenu__title {
+      color: $base-menu-color-active !important;
+    }
+
+    & .nest-menu .el-submenu>.el-submenu__title,
+    & .el-submenu .el-menu-item {
+      min-width: $base-sidebar-width !important;
+
+      &:hover {
+        background-color: rgba(0, 0, 0, 0.06) !important;
+      }
+    }
+
+    & .theme-dark .nest-menu .el-submenu>.el-submenu__title,
+    & .theme-dark .el-submenu .el-menu-item {
+      background-color: $base-sub-menu-background !important;
+
+      &:hover {
+        background-color: $base-sub-menu-hover !important;
+      }
+    }
+  }
+
+  .hideSidebar {
+    .sidebar-container {
+      width: 54px !important;
+    }
+
+    .main-container {
+      margin-left: 54px;
+    }
+
+    .submenu-title-noDropdown {
+      padding: 0 !important;
+      position: relative;
+
+      .el-tooltip {
+        padding: 0 !important;
+
+        .svg-icon {
+          margin-left: 20px;
+        }
+      }
+    }
+
+    .el-submenu {
+      overflow: hidden;
+
+      &>.el-submenu__title {
+        padding: 0 !important;
+
+        .svg-icon {
+          margin-left: 20px;
+        }
+
+      }
+    }
+
+    .el-menu--collapse {
+      .el-submenu {
+        &>.el-submenu__title {
+          &>span {
+            height: 0;
+            width: 0;
+            overflow: hidden;
+            visibility: hidden;
+            display: inline-block;
+          }
+        }
+      }
+    }
+  }
+
+  .el-menu--collapse .el-menu .el-submenu {
+    min-width: $base-sidebar-width !important;
+  }
+
+  // mobile responsive
+  .mobile {
+    .main-container {
+      margin-left: 0px;
+    }
+
+    .sidebar-container {
+      transition: transform .28s;
+      width: $base-sidebar-width !important;
+    }
+
+    &.hideSidebar {
+      .sidebar-container {
+        pointer-events: none;
+        transition-duration: 0.3s;
+        transform: translate3d(-$base-sidebar-width, 0, 0);
+      }
+    }
+  }
+
+  .withoutAnimation {
+
+    .main-container,
+    .sidebar-container {
+      transition: none;
+    }
+  }
+}
+
+// when menu collapsed
+.el-menu--vertical {
+  &>.el-menu {
+    .svg-icon {
+      margin-right: 16px;
+    }
+  }
+
+  .nest-menu .el-submenu>.el-submenu__title,
+  .el-menu-item {
+    &:hover {
+      // you can use $subMenuHover
+      background-color: rgba(0, 0, 0, 0.06) !important;
+    }
+  }
+
+  // the scroll bar appears when the subMenu is too long
+  >.el-menu--popup {
+    max-height: 100vh;
+    overflow-y: auto;
+
+    &::-webkit-scrollbar-track-piece {
+      background: #d3dce6;
+    }
+
+    &::-webkit-scrollbar {
+      width: 6px;
+    }
+
+    &::-webkit-scrollbar-thumb {
+      background: #99a9bf;
+      border-radius: 20px;
+    }
+  }
+}
diff --git a/ruoyi-ui/src/components/Header.vue b/ruoyi-ui/src/components/Header.vue
new file mode 100644
index 00000000..d91fedfd
--- /dev/null
+++ b/ruoyi-ui/src/components/Header.vue
@@ -0,0 +1,528 @@
+<template>
+  <div class="header">
+    <div class="banner-box">
+      <img src="../assets/img/banner/head_bank_logo.png" alt="" class="bank_logo" />
+      <div class="header-name">
+        <span class="bigcharacter-logo">天津银行公司业务智能作业系统</span>
+        <span class="ismallcharacter-logo">BUSINESS INTELLIGENCE OPERATING SYSTEM OF BANK OF TIANJIN</span>
+      </div>
+      <!-- <div class="model_wrap">
+        <div class="banner-model">
+          <el-badge :is-dot="getDaRankNewStatus" class="banner-model spc_dot">
+            <div @click="toRbRank" class="model-item">
+              <img src="../assets/img/banner/red_black.png" class="banner-icon" />
+              <p>红黑榜</p>
+            </div>
+          </el-badge>
+        </div>
+        <el-badge :is-dot="listNewStatus" class="banner-model">
+          <div @click="toNewProd" class="model-item">
+            <img src="../assets/img/banner/new_pro.png" class="banner-icon" />
+            <p>新品上架</p>
+          </div>
+        </el-badge>
+        <el-badge class="banner-model">
+          <div @click="toHotPro" class="model-item">
+            <img src="../assets/img/banner/pro_hot.png" class="banner-icon" />
+            <p>产品热销</p>
+          </div>
+        </el-badge>
+      </div> -->
+      <div class="banner-user">
+        <img src="../assets/img/banner/head_avatar.png" />
+        <div>
+          <p></p>
+          <p>数据日期：</p>
+        </div>
+      </div>
+      <el-dropdown @command="handleClickCommand" trigger="click">
+        <span>
+          {{ currentRoleName }}
+          <i class="el-icon-arrow-down el-icon--right"></i>
+        </span>
+        <el-dropdown-menu slot="dropdown">
+          <el-dropdown-item v-for="item in roleList" :key="item.roleId" :command="item.roleId">{{
+            item.roleName
+          }}</el-dropdown-item>
+        </el-dropdown-menu>
+      </el-dropdown>
+      <!-- 修改密码 -->
+      <div class="icon-l"></div>
+
+      <div class="logout">
+        <el-tooltip popper-class="func-tootip" placement="bottom" effect="light">
+          <div class="logout-text" slot="content">退出登录</div>
+          <img src="../assets/logo-imgs/安全退出icon@2x.png" alt="" class="icon-close" @click="logout"  />
+        </el-tooltip>
+      </div>
+      <div class="resetPwd">
+        <span class="reset-text" @click="modifyPwd">修改密码</span>
+      </div>
+    </div>
+    <el-dialog
+      class="pwd-dialog"
+      title="修改密码"
+      append-to-body
+      :visible.sync="dialogVisible"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      :show-close="true"
+      width="600px"
+      :before-close="cancle"
+    >
+      <el-form ref="pwdForm" size="small" :model="pwdForm" :rules="pwdRule">
+        <el-form-item label="用户名" >
+          <el-input v-model="pwdForm.loginName" readonly></el-input>
+        </el-form-item>
+        <el-form-item label="原密码"  prop="oldPassword">
+          <el-input v-model="pwdForm.oldPassword" placeholder="请输入原密码" show-password></el-input>
+        </el-form-item>
+        <el-form-item label="新密码" prop="newPassword">
+          <el-input v-model="pwdForm.newPassword" placeholder="请输入新密码" show-password></el-input>
+        </el-form-item>
+        <el-form-item label="确认密码" prop="confirmPwd">
+          <el-input v-model="pwdForm.confirmPwd" placeholder="请再次输入新密码" show-password></el-input>
+        </el-form-item>
+        <el-form-item label="密码格式" required>
+          <div class="reind-text">8~18个字符，以数字或字母开头，可以包含的特殊字符有：`.~!@#%*()?-_=+。</div>
+        </el-form-item>
+      </el-form>
+      <div class="func-btn">
+        <el-button type="default" size="small" @click="cancle">取消</el-button>
+        <el-button type="primary" size="small" @click="updatePwd">保存</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { mapGetters, mapMutations, mapActions } from 'vuex'
+
+export default {
+  // inject: ['reload'],
+  data() {
+    const validateNewPassword = (rule, value, callback) => {
+      if (value === '') {
+        callback(new Error('请输入新密码'))
+      } else {
+        if (this.pwdForm.confirmPwd !== '') {
+          this.$refs.pwdForm.validateField('confirmPwd')
+        }
+        callback()
+      }
+    }
+    const validateConfirmPwd = (rule, value, callback) => {
+      if (value === '') {
+        callback(new Error('请再次输入新密码'))
+      } else if (value !== this.pwdForm.newPassword) {
+        callback(new Error('两次输入密码不一致!'))
+      } else {
+        callback()
+      }
+    }
+    return {
+      roleList: [],
+      getState: true,
+      getDaRankNewStatus: false,
+      listNewStatus: false,
+      currentRole: '',
+      currentRoleName: '',
+      dialogVisible: false,
+      pwdForm: {
+        loginName: '',
+        oldPassword: '',
+        newPassword: '',
+        confirmPwd: '',
+      },
+      pwdRule: {
+        newPassword: [
+          { validator: validateNewPassword, trigger: 'blur' },
+          { required: true, message: '请输入新密码', trigger: 'blur' },
+          {
+            pattern: /^[A-Za-z0-9][A-Za-z0-9`~!@#%*()?\-_=+.]{7,17}$/,
+            message: '8~18个字符，以数字或字母开头，可以包含的特殊字符有：`~!@#%*()?-_=+.',
+            trigger: 'blur',
+          },
+        ],
+        confirmPwd: [
+          { validator: validateConfirmPwd, trigger: 'blur' },
+          { required: true, message: '请再次输入新密码', trigger: 'blur' },
+        ],
+      },
+      isNew: true,
+      isNewRank: true,
+      etDate: '',
+    }
+  },
+  watch: {
+    //监控头部顶部新品上架和红黑榜-new图片显示的问题
+    changeState: {
+      handler(newVal) {
+        this.$store.state.user.headerState = newVal
+        if (!newVal) {
+          this.listNewStatus = false
+        }
+      },
+    },
+    changeStateRed: {
+      handler(newVal) {
+        this.$store.state.user.StateRed = newVal
+        if (!newVal) {
+          this.getDaRankNewStatus = false
+        }
+      },
+    },
+  },
+  methods: {
+    ...mapMutations({
+      // setUserInfo: 'SET_USER_INFO',
+      // setRoleList: 'SET_ROLE_LIST',
+      // switchMenuLoaded: 'SWITCH_MENU_LOADED',
+      // changeState: 'changeState',
+      // changeStateRed: 'changeStateRed',
+    }),
+    ...mapActions({
+      logout: 'doLogOut',
+    }),
+    async logout() {
+      this.$confirm('确定注销并退出系统吗？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.$store.dispatch('LogOut').then(() => {
+          location.href = '/index';
+        })
+      }).catch(() => {});
+    },
+    // doLogout() {
+    //   this.logout()
+    //     .then(res => {
+    //       this.$message.success('注销成功，即将为您跳转到登录页！')
+    //       setTimeout(() => location.reload(), 1500)
+    //     })
+    //     .catch(err => {
+    //       this.$message.success('注销成功，即将为您跳转到登录页！')
+    //       setTimeout(() => this.doClean(), 1500)
+    //     })
+    // },
+    modifyPwd() {
+      this.pwdForm.loginName = this.userInfo.loginName
+      this.dialogVisible = true
+    },
+    cancle() {
+      this.dialogVisible = false
+      this.$refs.pwdForm.resetFields()
+    },
+    updatePwd() {
+      this.$refs.pwdForm.validate(valid => {
+        if (valid) {
+          if (this.pwdForm.confirmPwd !== this.pwdForm.newPassword) {
+            this.$message({
+              message: '两次输入的密码不一致',
+              type: 'error',
+            })
+            return
+          }
+          const { newPassword, ...args } = this.pwdForm
+          this.$api.sys.user
+            .resetPassword({
+              ...args,
+              password: newPassword,
+            })
+            .then(res => {
+              if (res.data.code == 200) {
+                this.$message.success('修改密码成功，请重新登录！')
+                this.dialogVisible = false
+                setTimeout(() => {
+                  this.doClean()
+                }, 500)
+              } else {
+                this.$message({
+                  message: res.data.msg,
+                  type: 'error',
+                })
+              }
+            })
+        } else {
+          this.$message.error('请检查输入项！')
+        }
+      })
+    },
+    doClean() {
+      // this.$store.commit('RESET_USER')
+      // this.$store.commit('RESET_APP')
+      // this.$auth.removeToken()
+      // location.reload()
+    },
+
+    //切换角色
+    handleClickCommand(command) {
+      this.currentRole = command
+      let role = this.roleList.find(item => item.roleId === command)
+      this.currentRoleName = role.roleName
+      this.roleChangeFn(this, role.roleId)
+    },
+    toNewProd() {
+      this.listNewStatus = false
+      window.sessionStorage.setItem('headerState', 'false')
+      this.$router.push({
+        path: '/pm/newProd',
+      })
+    },
+    toHotPro() {
+      this.listNewStatus = false
+      this.$router.push({
+        path: '/pm/hotPro',
+      })
+    },
+    toActive() {
+      this.isNew = false
+      this.$router.push({
+        path: '/mkt/activeQuery',
+      })
+    },
+    toRbRank() {
+      this.getDaRankNewStatus = false
+      window.sessionStorage.setItem('StateRed', 'false')
+      this.$router.push({
+        path: '/ws/rbRank',
+      })
+    },
+  },
+  computed: {
+    ...mapGetters({
+    }),
+  },
+  created() {},
+  mounted() {
+    // if (this.userInfo.userName === '') {
+    //   this.$store.commit('RESET_USER')
+    //   this.$store.commit('RESET_APP')
+    //   this.$auth.removeToken()
+    //   this.$router.replace({ path: '/login' })
+    // }
+    // const role = this.roleList.find(item => item.roleId === this.userInfo.roleId)
+    // ;[this.currentRoleName, this.currentRole] = !role ? ['', ''] : [role.roleName, role.roleId]
+
+    // if (window.sessionStorage.getItem('headerState') !== 'false') {
+    //   if (this.$store.state.user.headerState) {
+    //     //查询新品上架是是否有数据更新接口
+    //     this.$http.post(this.$api.pmApi.listNewStatus, {}).then(res => {
+    //       if (res.data.code == 200) {
+    //         let newState = res.data.data.isNew
+    //         if (newState != 0) {
+    //           this.listNewStatus = true
+    //         } else {
+    //           this.listNewStatus = false
+    //         }
+    //       } else {
+    //         this.$message({
+    //           message: res.data.msg,
+    //           type: 'error',
+    //         })
+    //       }
+    //     })
+    //   } else {
+    //     this.listNewStatus = false
+    //   }
+    // }
+    // if (window.sessionStorage.getItem('StateRed') !== 'false') {
+    //   if (this.$store.state.user.StateRed) {
+    //     // 获取红黑榜是否存在新榜
+    //     this.$http.post(this.$api.main.getDaRankNewStatus, {}).then(res => {
+    //       if (res.data.code == 200) {
+    //         let redState = res.data.data.isNew
+    //         if (redState != 0) {
+    //           this.getDaRankNewStatus = true
+    //         } else {
+    //           this.getDaRankNewStatus = false
+    //         }
+    //       } else {
+    //         this.$message({
+    //           message: res.data.msg,
+    //           type: 'error',
+    //         })
+    //       }
+    //     })
+    //   } else {
+    //     this.getDaRankNewStatus = false
+    //   }
+    // }
+    // const getLoginNum = sessionStorage.getItem('userLoginNum')
+    // if (sessionStorage.getItem('userLoginNum') === '1') {
+    //   this.$confirm('当前为首次登陆，是否前往修改密码？', '提示', {
+    //     type: 'warning',
+    //   })
+    //     .then(() => {
+    //       sessionStorage.removeItem('userLoginNum')
+    //       this.modifyPwd()
+    //     })
+    //     .catch(() => {
+    //       sessionStorage.removeItem('userLoginNum')
+    //     })
+    // }
+    //
+    // this.etDate = sessionStorage.getItem('etDate')
+    // console.log(this.etDate, 'this.etDate')
+  },
+}
+</script>
+
+<style lang="scss">
+.header {
+  width: 100%;
+  // height: 100%;
+  height: 80px;
+}
+.banner-box {
+  // width: 100%;
+  display: flex;
+  align-items: center;
+  height: 100%;
+  font-size: 0.16rem;
+  .bank_logo {
+    width: 100px;
+    margin: 0;
+    height: auto;
+    margin: 0 30px;
+    margin-right: 40px;
+  }
+
+  .banner-model {
+    width: 80px;
+    text-align: center;
+    cursor: pointer;
+    .model-item {
+      display: flex;
+      align-items: center;
+      font-size: 14px;
+    }
+    .banner-icon {
+      width: 0.2rem;
+      height: 0.2rem;
+      margin-right: 0.02rem;
+      background-size: contain;
+      background-repeat: no-repeat;
+    }
+    p {
+      line-height: 18px;
+      // font-size: 12px;
+    }
+    .el-badge {
+      .el-badge__content.is-fixed.is-dot {
+        top: 6px !important;
+        right: 12px !important;
+      }
+      .el-badge__content.is-dot {
+        height: 8px !important;
+        width: 8px !important;
+      }
+    }
+  }
+  .model_wrap {
+    display: flex;
+    margin-left: auto;
+    .banner-model:first-child {
+      margin-left: auto;
+    }
+  }
+  .el-divider--vertical {
+    margin: 15px 8px !important;
+  }
+  .banner-user {
+    display: flex;
+    align-items: center;
+    margin-right: 30px;
+    margin-left: auto;
+    img {
+      margin: 0 10px 0 10px;
+      height: 38px;
+      width: 38px;
+      background-size: contain;
+    }
+    p {
+      font-size: 0.14rem;
+      line-height: 20px;
+    }
+  }
+  .el-dropdown {
+    // max-width: 100px; //角色名称过长不显示注释
+    text-align: center;
+    // line-height: 44px;
+    font-size: 0.16rem;
+    font-weight: bold;
+    cursor: pointer;
+  }
+  .logout {
+    width: 0.2rem;
+    height: 0.2rem;
+    color: red;
+    // margin: 0 0.4rem 0 0.22rem;
+    margin-right: 20px;
+    margin-bottom: 10px;
+    cursor: pointer;
+  }
+}
+</style>
+<style lang="scss" scoped>
+::v-deep .el-badge__content.is-fixed.is-dot {
+  right: 15px;
+  margin-top: 6px;
+  margin-right: 17px;
+  background: red;
+}
+::v-deep .spc_dot .el-badge__content.is-fixed.is-dot {
+  left: 39px;
+  margin-top: 1px !important;
+}
+.resetPwd {
+  cursor: pointer;
+  width: 56px;
+  height: 14px;
+  margin-right: 24px;
+}
+.icon-l{
+  width: 1px;
+  height: 14px;
+  margin-right: 20px;
+  margin-left: 20px;
+  background: #B9C8DF;
+}
+.icon-close{
+  width: 15px;
+  height: 16px;
+}
+  .header-name {
+  width: 308px;
+  height: 40px;
+  // margin: 20px 0 0 10px;
+  display: flex;
+  flex-wrap: wrap;
+  }
+.bigcharacter-logo{
+  width: 308px;
+  height: 22px;
+  color: rgba(34, 34, 34, 1);
+  font-size: 22px;
+  font-family: SourceHanSansCN-Heavy, SourceHanSansCN;
+  text-align: left;
+  font-weight: bolder;
+  line-height: 33px;
+  margin-bottom: 8px;
+}
+.ismallcharacter-logo{
+  width: 308px;
+  height: 9px;
+  display: inline-block;
+  color: rgba(34, 34, 34, 1);
+  font-size: 9px;
+  transform: scale(0.75);
+  font-family: SourceHanSansCN-Bold, SourceHanSansCN;
+  font-weight:600;
+  white-space: nowrap;
+  line-height: 14px;
+  margin-left: -39px;
+
+}
+</style>
diff --git a/ruoyi-ui/src/components/PageTabs.vue b/ruoyi-ui/src/components/PageTabs.vue
index 133daff8..9a5842b0 100644
--- a/ruoyi-ui/src/components/PageTabs.vue
+++ b/ruoyi-ui/src/components/PageTabs.vue
@@ -35,7 +35,7 @@ export default {
       return this.tabList.length > 0
     },
     ...mapGetters({
-      isCollapse: 'getCollapseStatus',
+
     }),
   },
   created(){
diff --git a/ruoyi-ui/src/components/RightFence.vue b/ruoyi-ui/src/components/RightFence.vue
new file mode 100644
index 00000000..24146ba0
--- /dev/null
+++ b/ruoyi-ui/src/components/RightFence.vue
@@ -0,0 +1,42 @@
+<template>
+  <div class="right-fence-box">
+    <div class="content">
+      右侧边栏111
+
+    </div>
+
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {}
+  },
+}
+</script>
+
+<style  lang="scss">
+//右侧边栏布局
+.right-fence-box {
+  //   width: 423px;
+  width: 25.5%;
+  min-height: calc(100% - 104px);
+  border-radius: 6px;
+  box-shadow: 0px 1px 8px 0px rgba(0, 0, 0, 0.1);
+  border-radius: 6px;
+  background: #ffffff;
+  position: absolute;
+  overflow-y: auto;
+  right: 24px;
+  top: 24px;
+  .content{
+    margin-top: 20%;
+    text-align: center;
+  }
+  .tab{
+    font-size: 2px;
+    background: red;
+  }
+}
+</style>
diff --git a/ruoyi-ui/src/layout/components/AppMain.vue b/ruoyi-ui/src/layout/components/AppMain.vue
index 7316d900..53cf6871 100644
--- a/ruoyi-ui/src/layout/components/AppMain.vue
+++ b/ruoyi-ui/src/layout/components/AppMain.vue
@@ -1,20 +1,24 @@
 <template>
   <section class="app-main">
-    <transition name="fade-transform" mode="out-in">
-      <keep-alive :include="cachedViews">
-        <router-view v-if="!$route.meta.link" :key="key" />
-      </keep-alive>
-    </transition>
+    <div class="left-main">
+      <transition name="fade-transform" mode="out-in">
+        <keep-alive :include="cachedViews">
+          <router-view v-if="!$route.meta.link" :key="key" />
+        </keep-alive>
+      </transition>
+    </div>
+    <RightFence></RightFence>
     <iframe-toggle />
   </section>
 </template>
 
 <script>
 import iframeToggle from "./IframeToggle/index"
+import RightFence from '@/components/RightFence.vue'
 
 export default {
   name: 'AppMain',
-  components: { iframeToggle },
+  components: { iframeToggle, RightFence },
   computed: {
     cachedViews() {
       return this.$store.state.tagsView.cachedViews
@@ -30,10 +34,13 @@ export default {
 .app-main {
   /* 50= navbar  50  */
   background-color: #EBEFFB;
-  min-height: calc(100vh - 50px);
+  height: calc(100vh - 50px);
   width: 100%;
+  overflow-y: auto;
   position: relative;
-  overflow: hidden;
+}
+.left-main{
+  width: calc(75% - 40px);
 }
 
 .fixed-header + .app-main {
@@ -43,7 +50,7 @@ export default {
 .hasTagsView {
   .app-main {
     /* 84 = navbar + tags-view = 50 + 34 */
-    min-height: calc(100vh - 0px);
+    height: calc(100vh - 80px);
   }
 
   .fixed-header + .app-main {
diff --git a/ruoyi-ui/src/layout/components/Sidebar/Logo.vue b/ruoyi-ui/src/layout/components/Sidebar/Logo.vue
index c8401c51..18acd318 100644
--- a/ruoyi-ui/src/layout/components/Sidebar/Logo.vue
+++ b/ruoyi-ui/src/layout/components/Sidebar/Logo.vue
@@ -1,93 +1,93 @@
-<template>
-  <div class="sidebar-logo-container" :class="{'collapse':collapse}" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
-    <transition name="sidebarLogoFade">
-      <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo" />
-        <h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1>
-      </router-link>
-      <router-link v-else key="expand" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo" />
-        <h1 class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1>
-      </router-link>
-    </transition>
-  </div>
-</template>
-
-<script>
-import logoImg from '@/assets/logo/logo.png'
-import variables from '@/assets/styles/variables.scss'
-
-export default {
-  name: 'SidebarLogo',
-  props: {
-    collapse: {
-      type: Boolean,
-      required: true
-    }
-  },
-  computed: {
-    variables() {
-      return variables;
-    },
-    sideTheme() {
-      return this.$store.state.settings.sideTheme
-    }
-  },
-  data() {
-    return {
-      title: '若依管理系统',
-      logo: logoImg
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.sidebarLogoFade-enter-active {
-  transition: opacity 1.5s;
-}
-
-.sidebarLogoFade-enter,
-.sidebarLogoFade-leave-to {
-  opacity: 0;
-}
-
-.sidebar-logo-container {
-  position: relative;
-  width: 100%;
-  height: 50px;
-  line-height: 50px;
-  background: #2b2f3a;
-  text-align: center;
-  overflow: hidden;
-
-  & .sidebar-logo-link {
-    height: 100%;
-    width: 100%;
-
-    & .sidebar-logo {
-      width: 32px;
-      height: 32px;
-      vertical-align: middle;
-      margin-right: 12px;
-    }
-
-    & .sidebar-title {
-      display: inline-block;
-      margin: 0;
-      color: #fff;
-      font-weight: 600;
-      line-height: 50px;
-      font-size: 14px;
-      font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
-      vertical-align: middle;
-    }
-  }
-
-  &.collapse {
-    .sidebar-logo {
-      margin-right: 0px;
-    }
-  }
-}
-</style>
+<template>
+  <div class="sidebar-logo-container" :class="{'collapse':collapse}" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
+    <transition name="sidebarLogoFade">
+      <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
+        <img v-if="logo" :src="logo" class="sidebar-logo" />
+        <h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1>
+      </router-link>
+      <router-link v-else key="expand" class="sidebar-logo-link" to="/">
+        <img v-if="logo" :src="logo" class="sidebar-logo" />
+        <h1 class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1>
+      </router-link>
+    </transition>
+  </div>
+</template>
+
+<script>
+import logoImg from '@/assets/logo/logo.png'
+import variables from '@/assets/styles/variables.scss'
+
+export default {
+  name: 'SidebarLogo',
+  props: {
+    collapse: {
+      type: Boolean,
+      required: true
+    }
+  },
+  computed: {
+    variables() {
+      return variables;
+    },
+    sideTheme() {
+      return this.$store.state.settings.sideTheme
+    }
+  },
+  data() {
+    return {
+      title: '智能作业系统',
+      logo: logoImg
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.sidebarLogoFade-enter-active {
+  transition: opacity 1.5s;
+}
+
+.sidebarLogoFade-enter,
+.sidebarLogoFade-leave-to {
+  opacity: 0;
+}
+
+.sidebar-logo-container {
+  position: relative;
+  width: 100%;
+  height: 50px;
+  line-height: 50px;
+  background: #2b2f3a;
+  text-align: center;
+  overflow: hidden;
+
+  & .sidebar-logo-link {
+    height: 100%;
+    width: 100%;
+
+    & .sidebar-logo {
+      width: 32px;
+      height: 32px;
+      vertical-align: middle;
+      margin-right: 12px;
+    }
+
+    & .sidebar-title {
+      display: inline-block;
+      margin: 0;
+      color: #fff;
+      font-weight: 600;
+      line-height: 50px;
+      font-size: 14px;
+      font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
+      vertical-align: middle;
+    }
+  }
+
+  &.collapse {
+    .sidebar-logo {
+      margin-right: 0px;
+    }
+  }
+}
+</style>
diff --git a/ruoyi-ui/src/layout/components/Sidebar/index.vue b/ruoyi-ui/src/layout/components/Sidebar/index.vue
index 24fb533b..51d0839f 100644
--- a/ruoyi-ui/src/layout/components/Sidebar/index.vue
+++ b/ruoyi-ui/src/layout/components/Sidebar/index.vue
@@ -1,57 +1,57 @@
-<template>
-    <div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
-        <logo v-if="showLogo" :collapse="isCollapse" />
-        <el-scrollbar :class="settings.sideTheme" wrap-class="scrollbar-wrapper">
-            <el-menu
-                :default-active="activeMenu"
-                :collapse="isCollapse"
-                :background-color="settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground"
-                :text-color="settings.sideTheme === 'theme-dark' ? variables.menuColor : variables.menuLightColor"
-                :unique-opened="true"
-                :active-text-color="settings.theme"
-                :collapse-transition="false"
-                mode="vertical"
-            >
-                <sidebar-item
-                    v-for="(route, index) in sidebarRouters"
-                    :key="route.path  + index"
-                    :item="route"
-                    :base-path="route.path"
-                />
-            </el-menu>
-        </el-scrollbar>
-    </div>
-</template>
-
-<script>
-import { mapGetters, mapState } from "vuex";
-import Logo from "./Logo";
-import SidebarItem from "./SidebarItem";
-import variables from "@/assets/styles/variables.scss";
-
-export default {
-    components: { SidebarItem, Logo },
-    computed: {
-        ...mapState(["settings"]),
-        ...mapGetters(["sidebarRouters", "sidebar"]),
-        activeMenu() {
-            const route = this.$route;
-            const { meta, path } = route;
-            // if set path, the sidebar will highlight the path you set
-            if (meta.activeMenu) {
-                return meta.activeMenu;
-            }
-            return path;
-        },
-        showLogo() {
-            return this.$store.state.settings.sidebarLogo;
-        },
-        variables() {
-            return variables;
-        },
-        isCollapse() {
-            return !this.sidebar.opened;
-        }
-    }
-};
-</script>
+<template>
+    <div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
+        <logo v-if="showLogo" :collapse="isCollapse" />
+        <el-scrollbar :class="settings.sideTheme" wrap-class="scrollbar-wrapper">
+            <el-menu
+                :default-active="activeMenu"
+                :collapse="isCollapse"
+                :background-color="settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground"
+                :text-color="settings.sideTheme === 'theme-dark' ? variables.menuColor : variables.menuLightColor"
+                :unique-opened="true"
+                :active-text-color="settings.theme"
+                :collapse-transition="false"
+                mode="vertical"
+            >
+                <sidebar-item
+                    v-for="(route, index) in sidebarRouters"
+                    :key="route.path  + index"
+                    :item="route"
+                    :base-path="route.path"
+                />
+            </el-menu>
+        </el-scrollbar>
+    </div>
+</template>
+
+<script>
+import { mapGetters, mapState } from "vuex";
+import Logo from "./Logo";
+import SidebarItem from "./SidebarItem";
+import variables from "@/assets/styles/variables.scss";
+
+export default {
+    components: { SidebarItem, Logo },
+    computed: {
+        ...mapState(["settings"]),
+        ...mapGetters(["sidebarRouters", "sidebar"]),
+        activeMenu() {
+            const route = this.$route;
+            const { meta, path } = route;
+            // if set path, the sidebar will highlight the path you set
+            if (meta.activeMenu) {
+                return meta.activeMenu;
+            }
+            return path;
+        },
+        showLogo() {
+            return this.$store.state.settings.sidebarLogo;
+        },
+        variables() {
+            return variables;
+        },
+        isCollapse() {
+            return !this.sidebar.opened;
+        }
+    }
+};
+</script>
diff --git a/ruoyi-ui/src/layout/index.vue b/ruoyi-ui/src/layout/index.vue
index 16366a88..39cc9743 100644
--- a/ruoyi-ui/src/layout/index.vue
+++ b/ruoyi-ui/src/layout/index.vue
@@ -1,5 +1,10 @@
 <template>
   <div :class="classObj" class="app-wrapper" :style="{'--current-color': theme}">
+    <div class="app-layout-header">
+      <div class="me-header">
+        <p-header></p-header>
+      </div>
+    </div>
     <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside"/>
     <sidebar v-if="!sidebar.hide" class="sidebar-container" />
     <div :class="{hasTagsView:needTagsView,sidebarHide:sidebar.hide}" class="main-container">
@@ -11,12 +16,14 @@
       <right-panel>
         <settings />
       </right-panel>
+      <RightFence></RightFence>
     </div>
   </div>
 </template>
 
 <script>
 import RightPanel from '@/components/RightPanel'
+import pHeader from '@/components/Header'
 import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components'
 import ResizeMixin from './mixin/ResizeHandler'
 import { mapState } from 'vuex'
@@ -28,6 +35,7 @@ export default {
     AppMain,
     Navbar,
     RightPanel,
+    pHeader,
     Settings,
     Sidebar,
     TagsView
@@ -65,12 +73,25 @@ export default {
 <style lang="scss" scoped>
   @import "~@/assets/styles/mixin.scss";
   @import "~@/assets/styles/variables.scss";
-
+  .app-layout-header {
+    width: 100%;
+    position: fixed;
+  }
+  .me-header {
+    width: 100%;
+    // height: 0.6rem;
+    height: 80px;
+    background-image: url('./../assets/img/home/head_bg_logo.png');
+    color: #333;
+    // background-size: cover;
+    background-size: 100% 100%;
+  }
   .app-wrapper {
     @include clearfix;
     position: relative;
-    height: 100%;
+    height: calc(100% - 0px);
     width: 100%;
+    overflow-y: hidden;
 
     &.mobile.openSidebar {
       position: fixed;
diff --git a/ruoyi-ui/src/main.js b/ruoyi-ui/src/main.js
index ebd94b9d..1adcb485 100644
--- a/ruoyi-ui/src/main.js
+++ b/ruoyi-ui/src/main.js
@@ -1,86 +1,88 @@
-import Vue from 'vue'
-
-import Cookies from 'js-cookie'
-
-import Element from 'element-ui'
-import './assets/styles/element-variables.scss'
-
-import '@/assets/styles/index.scss' // global css
-import '@/assets/styles/ruoyi.scss' // ruoyi css
-import App from './App'
-import store from './store'
-import router from './router'
-import directive from './directive' // directive
-import plugins from './plugins' // plugins
-import { download } from '@/utils/request'
-
-import './assets/icons' // icon
-import './permission' // permission control
-import { getDicts } from "@/api/system/dict/data";
-import { getConfigKey } from "@/api/system/config";
-import { parseTime, resetForm, addDateRange, selectDictLabel, selectDictLabels, handleTree } from "@/utils/ruoyi";
-// 分页组件
-import Pagination from "@/components/Pagination";
-// 自定义表格工具组件
-import RightToolbar from "@/components/RightToolbar"
-// 富文本组件
-import Editor from "@/components/Editor"
-// 文件上传组件
-import FileUpload from "@/components/FileUpload"
-// 图片上传组件
-import ImageUpload from "@/components/ImageUpload"
-// 图片预览组件
-import ImagePreview from "@/components/ImagePreview"
-// 字典标签组件
-import DictTag from '@/components/DictTag'
-// 头部标签组件
-import VueMeta from 'vue-meta'
-// 字典数据组件
-import DictData from '@/components/DictData'
-
-// 全局方法挂载
-Vue.prototype.getDicts = getDicts
-Vue.prototype.getConfigKey = getConfigKey
-Vue.prototype.parseTime = parseTime
-Vue.prototype.resetForm = resetForm
-Vue.prototype.addDateRange = addDateRange
-Vue.prototype.selectDictLabel = selectDictLabel
-Vue.prototype.selectDictLabels = selectDictLabels
-Vue.prototype.download = download
-Vue.prototype.handleTree = handleTree
-
-// 全局组件挂载
-Vue.component('DictTag', DictTag)
-Vue.component('Pagination', Pagination)
-Vue.component('RightToolbar', RightToolbar)
-Vue.component('Editor', Editor)
-Vue.component('FileUpload', FileUpload)
-Vue.component('ImageUpload', ImageUpload)
-Vue.component('ImagePreview', ImagePreview)
-
-Vue.use(directive)
-Vue.use(plugins)
-Vue.use(VueMeta)
-DictData.install()
-
-/**
- * If you don't want to use mock-server
- * you want to use MockJs for mock api
- * you can execute: mockXHR()
- *
- * Currently MockJs will be used in the production environment,
- * please remove it before going online! ! !
- */
-
-Vue.use(Element, {
-  size: Cookies.get('size') || 'medium' // set element-ui default size
-})
-
-Vue.config.productionTip = false
-
-new Vue({
-  el: '#app',
-  router,
-  store,
-  render: h => h(App)
-})
+import Vue from 'vue'
+
+import Cookies from 'js-cookie'
+
+import Element from 'element-ui'
+import './assets/styles/element-variables.scss'
+
+import '@/assets/styles/index.scss' // global css
+import '@/assets/styles/ruoyi.scss' // ruoyi css
+import App from './App'
+import store from './store'
+import router from './router'
+import directive from './directive' // directive
+import plugins from './plugins' // plugins
+import global from './plugins/global';
+import { download } from '@/utils/request'
+
+import './assets/icons' // icon
+import './permission' // permission control
+import { getDicts } from "@/api/system/dict/data";
+import { getConfigKey } from "@/api/system/config";
+import { parseTime, resetForm, addDateRange, selectDictLabel, selectDictLabels, handleTree } from "@/utils/ruoyi";
+// 分页组件
+import Pagination from "@/components/Pagination";
+// 自定义表格工具组件
+import RightToolbar from "@/components/RightToolbar"
+// 富文本组件
+import Editor from "@/components/Editor"
+// 文件上传组件
+import FileUpload from "@/components/FileUpload"
+// 图片上传组件
+import ImageUpload from "@/components/ImageUpload"
+// 图片预览组件
+import ImagePreview from "@/components/ImagePreview"
+// 字典标签组件
+import DictTag from '@/components/DictTag'
+// 头部标签组件
+import VueMeta from 'vue-meta'
+// 字典数据组件
+import DictData from '@/components/DictData'
+
+// 全局方法挂载
+Vue.prototype.getDicts = getDicts
+Vue.prototype.getConfigKey = getConfigKey
+Vue.prototype.parseTime = parseTime
+Vue.prototype.resetForm = resetForm
+Vue.prototype.addDateRange = addDateRange
+Vue.prototype.selectDictLabel = selectDictLabel
+Vue.prototype.selectDictLabels = selectDictLabels
+Vue.prototype.download = download
+Vue.prototype.handleTree = handleTree
+Vue.prototype.$global = global;
+
+// 全局组件挂载
+Vue.component('DictTag', DictTag)
+Vue.component('Pagination', Pagination)
+Vue.component('RightToolbar', RightToolbar)
+Vue.component('Editor', Editor)
+Vue.component('FileUpload', FileUpload)
+Vue.component('ImageUpload', ImageUpload)
+Vue.component('ImagePreview', ImagePreview)
+
+Vue.use(directive)
+Vue.use(plugins)
+Vue.use(VueMeta)
+DictData.install()
+
+/**
+ * If you don't want to use mock-server
+ * you want to use MockJs for mock api
+ * you can execute: mockXHR()
+ *
+ * Currently MockJs will be used in the production environment,
+ * please remove it before going online! ! !
+ */
+
+Vue.use(Element, {
+  size: Cookies.get('size') || 'medium' // set element-ui default size
+})
+
+Vue.config.productionTip = false
+
+new Vue({
+  el: '#app',
+  router,
+  store,
+  render: h => h(App)
+})
diff --git a/ruoyi-ui/src/plugins/global.js b/ruoyi-ui/src/plugins/global.js
new file mode 100644
index 00000000..706842d9
--- /dev/null
+++ b/ruoyi-ui/src/plugins/global.js
@@ -0,0 +1,473 @@
+import axios from 'axios'
+const global = {
+  // 表单必输项
+  requiredRule: {
+    required: true,
+    message: '该项为必输项！',
+    trigger: ['blur', 'change'],
+  },
+
+  // 文件上传接口
+  uploadURL: process.env.VUE_APP_BASE_API + 'sys/file/upload',
+
+  //影像平台接口上传接口文件
+  uploadToIcon: process.env.VUE_APP_BASE_API + '/sys/file/uploadToIcon',
+
+  //文件下载
+  downLoadUrl: process.env.VUE_APP_BASE_API + 'sys/file/download?fileId=',
+
+  // 公告文件上传接口
+  uploadToIconSf: process.env.VUE_APP_BASE_API + '/sys/file/upload',
+  // 图片
+  // getPicUrl:'/get/{value}/mg.do'
+  getPicUrl: process.env.VUE_APP_BASE_API + '/sys/file/get/{value}/mg.do',
+
+  // 码值转换
+  getNameByCode: (codeInfo, codeValue, isMult = false) => {
+    if (!codeInfo) {
+      return codeValue
+    }
+    if (!codeValue) {
+      return ''
+    }
+    if (isMult) codeValue = isMult ? codeValue.split(',') : codeValue
+    let codeName = '',
+      codeValues = []
+    for (let i = 0; i < codeInfo.length; i++) {
+      if (Array.isArray(codeValue)) {
+        for (let j = 0; j < codeValue.length; j++) {
+          if (codeValue[j] == codeInfo[i].value) {
+            codeValues.push(codeInfo[i].content)
+          }
+        }
+      } else {
+        if (codeValue == codeInfo[i].value) {
+          codeName = codeInfo[i].content
+          break
+        }
+      }
+      codeName = codeValues.join(',')
+    }
+    return codeName == '' ? codeValue : codeName
+  },
+
+  // 分转元
+  regFenToYuan: val => {
+    let num = Number(val)
+    if (!isNaN(num)) {
+      num = num * 0.01 + ''
+      let reg = num.indexOf('.') > -1 ? /(\d{1,3})(?=(?:\d{3})+\.)/g : /(\d{1,3})(?=(?:\d{3})+$)/g //千分符的正则
+      return num.replace(reg, '$1,')
+    } else {
+      return null
+    }
+  },
+  // 判断字符串是否为空
+  isEmptyStr(str) {
+    if (str == '') return true
+    const regu = '^[ ]+$'
+    const re = new RegExp(regu)
+    return re.test(str)
+  },
+  //文件下载/表格导出
+  downloadFiles(_url, _params, _this, requestFn = 'download') {
+
+    _this.$http[requestFn](_url, _params).then(response => {
+      if (_url === _this.$api.cmApi.exporAllCstInfo) {
+        console.log(response, 'response')
+        // if (response.isOK) {
+        //   _this.$message.successs(response.msg)
+        // } else {
+        //   _this.$message.error(response.msg)
+        // }
+      } else if (!response.data.code) {
+        let contentDisposition = response.headers['content-disposition']
+        const blob = new Blob([response.data])
+
+        if ('download' in document.createElement('a')) {
+          const elink = document.createElement('a')
+          let fileName = decodeURI(contentDisposition.substring(contentDisposition.indexOf('filename=') + 9, contentDisposition.length));
+          fileName = fileName.replace((/"/g), "");
+          elink.download = fileName
+          elink.style.display = 'none'
+          elink.href = URL.createObjectURL(blob)
+          document.body.appendChild(elink)
+          elink.click()
+          URL.revokeObjectURL(elink.href)
+          document.body.removeChild(elink)
+        } else {
+          navigator.msSaveBlob(blob, fileName)
+        }
+      } else {
+        _this.$message.error(response.msg)
+      }
+    })
+  },
+
+  /* 文件下载/表格导出
+   * 支持影像平台下载
+   */
+  downloadImage(_url, _params, _this, requestFn = 'download') {
+    _this.$http[requestFn](_url, _params).then(response => {
+      if (!response.data.code) {
+        let fileName = response.headers['content-disposition']
+        const blob = new Blob([response.data])
+        if ('download' in document.createElement('a')) {
+          const elink = document.createElement('a')
+          // 公共方法不支持截取，去掉fileName两边的""
+          fileName = fileName.substr(0, fileName.length - 1)
+          let spcStr = (fileName.split('=')[1]).substr(1)
+          elink.download = fileName && decodeURI(spcStr)
+          elink.style.display = 'none'
+          elink.href = URL.createObjectURL(blob)
+          document.body.appendChild(elink)
+          elink.click()
+          URL.revokeObjectURL(elink.href)
+          document.body.removeChild(elink)
+        } else {
+          navigator.msSaveBlob(blob, fileName)
+        }
+      } else {
+        _this.$message.error(response.msg)
+      }
+    })
+  },
+  /**
+   * 每隔几个字符进行添加对应标记
+   * @param {*} str 需要添加标记的字符串
+   * @param {*} vkey 标记
+   * @param {*} vnum 字符个数
+   */
+  strReplace: (str, vnum = 2, vkey = '-') => {
+    if (!str) return ''
+    let result = ''
+    for (var i = 0, len = str.length; i < len; i++) {
+      result += str[i]
+      if (i % vnum == 1) result += vkey
+    }
+    if (result.slice(-1) == vkey) result = result.slice(0, -1)
+    return result
+  },
+  /**
+   * 判断是否是数组
+   */
+  isArrayFn: value => {
+    if (typeof Array.isArray === 'function') {
+      return Array.isArray(value)
+    } else {
+      return Object.prototype.toString.call(value) === '[object Array]'
+    }
+  },
+  /**
+   * isEmpty 判空
+   */
+  isEmpty: str => {
+    let flag = true
+    if (str != null && str != undefined)
+      flag =
+      str
+      .replace(/(^\s*)|(\s*$)/g, '')
+      .replace(/<\/?.+?>/g, '')
+      .replace(/[\r\n]/g, '').length > 0 ?
+      false :
+      true
+    return flag
+  },
+  /**
+   * 时间格式化
+   * @param {*} time 传入的时间
+   */
+  timeFamat(time) {
+    var newTime = new Date(time)
+    var year = newTime.getFullYear() //年
+    var month = newTime.getMonth() + 1 //月
+    var day = newTime.getDate() //日
+
+    var clock = year + '-'
+
+    if (month < 10) clock += '0'
+
+    clock += month + '-'
+
+    if (day < 10) clock += '0'
+
+    clock += day
+
+    return clock
+  },
+  /**
+   * 创建当前时间
+   * @param {*} isTrue 精确到年、月、天标识
+   */
+  createTime: isTrue => {
+    var now = new Date()
+
+    var year = now.getFullYear() //年
+    var month = now.getMonth() + 1 //月
+    var day = now.getDate() //日
+
+    var hh = now.getHours() //时
+    var mm = now.getMinutes() //分
+    var ss = now.getSeconds() //秒
+    if (isTrue == 'year') return year
+
+    var clock = year + '-'
+
+    if (month < 10) clock += '0'
+
+    if (isTrue == 'month') return (clock += month)
+
+    clock += month + '-'
+
+    if (day < 10) clock += '0'
+
+    clock += day
+
+    //精确到天
+    if (isTrue == 'day') return clock
+    clock += clock + ' '
+
+    if (hh < 10) clock += '0'
+
+    clock += hh + ':'
+    if (mm < 10) clock += '0'
+    clock += mm + ':'
+
+    if (ss < 10) clock += '0'
+    clock += ss
+    return clock
+  },
+  //加法
+  NumberAdd: (arg1, arg2, n = 2) => {
+    var r1, r2, m
+    try {
+      r1 = arg1.toString().split('.')[1].length
+    } catch (e) {
+      r1 = 0
+    }
+    try {
+      r2 = arg2.toString().split('.')[1].length
+    } catch (e) {
+      r2 = 0
+    }
+    m = Math.pow(10, Math.max(r1, r2))
+    return ((arg1 * m + arg2 * m) / m).toFixed(n)
+  },
+  //减法
+  NumberSub: (arg1, arg2) => {
+    var r1, r2, m, n
+    try {
+      r1 = arg1.toString().split('.')[1].length
+    } catch (e) {
+      r1 = 0
+    }
+    try {
+      r2 = arg2.toString().split('.')[1].length
+    } catch (e) {
+      r2 = 0
+    }
+    m = Math.pow(10, Math.max(r1, r2))
+    //动态控制精度长度
+    n = r1 >= r2 ? r1 : r2
+    return ((arg1 * m - arg2 * m) / m).toFixed(n)
+  },
+  //乘法
+  NumberMul: (arg1, arg2) => {
+    var m = 0,
+      s1 = arg1.toString(),
+      s2 = arg2.toString()
+    try {
+      m += s1.split('.')[1].length
+    } catch (e) {}
+    try {
+      m += s2.split('.')[1].length
+    } catch (e) {}
+    return (Number(s1.replace('.', '')) * Number(s2.replace('.', ''))) / Math.pow(10, m)
+  },
+
+  //除法
+  NumberDiv: (arg1, arg2) => {
+    var t1 = 0,
+      t2 = 0,
+      r1,
+      r2
+    try {
+      t1 = arg1.toString().split('.')[1].length
+    } catch (e) {}
+    try {
+      t2 = arg2.toString().split('.')[1].length
+    } catch (e) {}
+
+    r1 = Number(arg1.toString().replace('.', ''))
+
+    r2 = Number(arg2.toString().replace('.', ''))
+    return (r1 / r2) * Math.pow(10, t2 - t1)
+  },
+
+  /* 
+  检查数组是否有重复
+  keyName:数组里面的对象的属性名
+  */
+  isArrayRepeat: (arr, keyName) => {
+    let hash = {}
+    if (keyName) {
+      for (let i in arr) {
+        if (hash[arr[i][keyName]]) {
+          return true
+        } else {
+          hash[arr[i][keyName]] = true
+        }
+      }
+    } else {
+      for (let i in arr) {
+        if (hash[arr[i]]) {
+          return true
+        } else {
+          hash[arr[i]] = true
+        }
+      }
+    }
+    return false
+  },
+  /* 
+    异步请求顺序执行
+    _arr:方法名
+  */
+  async getAllFn(_arr, _this) {
+    for (let i = 0; i < _arr.length; i++) {
+      await this.getReqDataFn(_arr[i], _this)
+    }
+  },
+  getReqDataFn(fn, _this) {
+    var p = new Promise(resolve => {
+      _this[fn]()
+      setTimeout(() => {
+        resolve()
+      }, 100)
+    })
+    return p
+  },
+
+  /* 
+  格式化金额数字, 加千分位并保留两位小数
+  params: num(传入的金额)
+  */
+  formatAmountNum: num => {
+    if (num == 0) {
+      return num
+    }
+    if (!num) {
+      return
+    }
+    num = num + ''
+    if (!num.includes('.')) {
+      num += '.'
+    }
+    return num
+      .replace(/(\d)(?=(\d{3})+\.)/g, function ($0, $1) {
+        return $1 + ','
+      })
+      .replace(/\.$/, '.00')
+  },
+  /**
+   * 时间比较大小
+   */
+  compareDate: (sDate, eDate, isSame = false) => {
+    let st = new Date(sDate)
+    let et = new Date(eDate)
+    let flag = !st && !et ? false : st.getTime() >= et.getTime() ? false : true
+    if (isSame) flag = !st && !et ? false : st.getTime() > et.getTime() ? false : true
+    return flag
+  },
+  /**
+   * 手机号码验证
+   */
+  checkPhoneFn: (mobile) => {
+    let reg = /^0?(13[0-9]|14[5-9]|15[012356789]|166|17[0-8]|18[0-9]|19[0-9])[0-9]{8}$/;
+    return reg.test(mobile)
+  },
+  /**
+   * 将指定日期区间按月份分割
+   * @param {Object} beginDate 开始日期
+   * @param {Object} endDate 结束日期
+   * @return {Array} 分割好的array数组
+   */
+  dateCutByMonth(beginDate, endDate) {
+    //分割好的数组
+    let dateCutList = new Array();
+    let b_date = new Date(beginDate);
+    let e_date = new Date(endDate);
+    //获取各个年份
+    let b_year = parseInt(b_date.getFullYear());
+    let e_year = parseInt(e_date.getFullYear());
+    //获取各个月份
+    let b_month = parseInt(b_date.getMonth()) + 1;
+    let e_month = parseInt(e_date.getMonth()) + 1;
+
+    //获取日期之间相差的月数
+    let month_list = monthList();
+
+    //按月份分割日期
+    for (let i = 0; i < month_list.length; i++) {
+      //当前月开始日期:第一天
+      let i_b_date = new Date(month_list[i]);
+      i_b_date.setDate(1);
+      //当前月最后一天
+      let i_e_date = new Date(month_list[i]);
+      i_e_date.setMonth(i_e_date.getMonth() + 1);
+      i_e_date.setDate(1);
+      i_e_date.setDate(i_e_date.getDate() - 1);
+
+      //第一次循环：开始月份
+      if (i == 0) {
+        let i_e_ymd = dateToString(i_e_date);
+        dateCutList.push([beginDate, i_e_ymd]);
+
+        //除第一次和最后一次循环：中间月份
+      } else if (i != 0 && i != month_list.length - 1) {
+        let i_b_ymd = dateToString(i_b_date);
+        let i_e_ymd = dateToString(i_e_date);
+        dateCutList.push([i_b_ymd, i_e_ymd]);
+        //最后一次循环：结束月份
+      } else if (i == month_list.length - 1) {
+        let i_b_ymd = dateToString(i_b_date);
+        dateCutList.push([i_b_ymd, endDate]);
+      }
+    }
+    return dateCutList;
+    /**
+     * 获取日期区间的月份集合
+     */
+    function monthList() {
+      //相差的月份总数
+      let result = new Array();
+
+      let b = new Date(b_year, b_month - 1, 1);
+      let e = new Date(e_year, e_month - 1, 1);
+      while (b < e) {
+        result.push(b.getFullYear() + "-" + (b.getMonth() + 1));
+        b.setMonth(b.getMonth() + 1);
+      }
+      result.push(e_year + "-" + e_month);
+      return result;
+    }
+    /**
+     * 将日期转换为指定格式的字符串
+     * @param {Date} date 要转换的日期
+     */
+    function dateToString(date) {
+      let month = (date.getMonth() + 1);
+      let day = date.getDate();
+      if (month < 10) {
+        month = '0' + month
+      }
+      if (day < 10) {
+        day = '0' + day
+      }
+      return date.getFullYear() + "-" + (month) + "-" + day;
+    }
+
+  },
+}
+
+export default global
\ No newline at end of file
diff --git a/ruoyi-ui/src/plugins/waterMark.js b/ruoyi-ui/src/plugins/waterMark.js
new file mode 100644
index 00000000..0bb70494
--- /dev/null
+++ b/ruoyi-ui/src/plugins/waterMark.js
@@ -0,0 +1,32 @@
+let style
+let clearWaterMark = () => {
+  if (style) style.remove
+}
+export default function createWaterMark(str,_height) {
+  clearWaterMark()
+  if (!str) return
+  let width = window.parseInt(document.body.clientWidth),
+    canvasWidth = width / window.parseInt(width / 400),
+    fontFamily = window.getComputedStyle(document.body)['font-family'],
+    canvas = document.createElement('canvas')
+  canvas.width = canvasWidth
+  canvas.height = 200
+  let cxt = canvas.getContext('2d')
+  cxt.rotate((-20 * Math.PI) / 180)
+  cxt.font = `18px${fontFamily}`
+  cxt.fillStyle = 'rgba(8,8,8,0.2)'
+  cxt.fillText(str, 50, 200)
+  let imgSrc = canvas.toDataURL('image/png')
+  style = document.createElement('style')
+  style.innerHTML = `.with-watermark:before{
+        content:"";
+        width:100%;
+        pointer-events:none;
+        height:${_height}px;
+        display:block;
+        position:absolute;
+        z-index:99999;
+        background-image:url("${imgSrc}")
+    }`
+  ;(document.head.append || document.head.appendChild).apply(document.head, [style])
+}
diff --git a/ruoyi-ui/src/store/modules/user.js b/ruoyi-ui/src/store/modules/user.js
index 262de9b0..816d5b49 100644
--- a/ruoyi-ui/src/store/modules/user.js
+++ b/ruoyi-ui/src/store/modules/user.js
@@ -1,115 +1,115 @@
-import { login, logout, getInfo, refreshToken } from '@/api/login'
-import { getToken, setToken, setExpiresIn, removeToken } from '@/utils/auth'
-
-const user = {
-  state: {
-    token: getToken(),
-    name: '',
-    avatar: '',
-    roles: [],
-    permissions: []
-  },
-
-  mutations: {
-    SET_TOKEN: (state, token) => {
-      state.token = token
-    },
-    SET_EXPIRES_IN: (state, time) => {
-      state.expires_in = time
-    },
-    SET_NAME: (state, name) => {
-      state.name = name
-    },
-    SET_AVATAR: (state, avatar) => {
-      state.avatar = avatar
-    },
-    SET_ROLES: (state, roles) => {
-      state.roles = roles
-    },
-    SET_PERMISSIONS: (state, permissions) => {
-      state.permissions = permissions
-    }
-  },
-
-  actions: {
-    // 登录
-    Login({ commit }, userInfo) {
-      const username = userInfo.username.trim()
-      const password = userInfo.password
-      const code = userInfo.code
-      const uuid = userInfo.uuid
-      return new Promise((resolve, reject) => {
-        login(username, password, code, uuid).then(res => {
-          let data = res.data
-          setToken(data.access_token)
-          commit('SET_TOKEN', data.access_token)
-          setExpiresIn(data.expires_in)
-          commit('SET_EXPIRES_IN', data.expires_in)
-          resolve()
-        }).catch(error => {
-          reject(error)
-        })
-      })
-    },
-
-    // 获取用户信息
-    GetInfo({ commit, state }) {
-      return new Promise((resolve, reject) => {
-        getInfo().then(res => {
-          const user = res.user
-          const avatar = (user.avatar == "" || user.avatar == null) ? require("@/assets/images/profile.jpg") : user.avatar;
-          if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组
-            commit('SET_ROLES', res.roles)
-            commit('SET_PERMISSIONS', res.permissions)
-          } else {
-            commit('SET_ROLES', ['ROLE_DEFAULT'])
-          }
-          commit('SET_NAME', user.userName)
-          commit('SET_AVATAR', avatar)
-          resolve(res)
-        }).catch(error => {
-          reject(error)
-        })
-      })
-    },
-
-    // 刷新token
-    RefreshToken({commit, state}) {
-      return new Promise((resolve, reject) => {
-        refreshToken(state.token).then(res => {
-          setExpiresIn(res.data)
-          commit('SET_EXPIRES_IN', res.data)
-          resolve()
-        }).catch(error => {
-          reject(error)
-        })
-      })
-    },
-    
-    // 退出系统
-    LogOut({ commit, state }) {
-      return new Promise((resolve, reject) => {
-        logout(state.token).then(() => {
-          commit('SET_TOKEN', '')
-          commit('SET_ROLES', [])
-          commit('SET_PERMISSIONS', [])
-          removeToken()
-          resolve()
-        }).catch(error => {
-          reject(error)
-        })
-      })
-    },
-
-    // 前端 登出
-    FedLogOut({ commit }) {
-      return new Promise(resolve => {
-        commit('SET_TOKEN', '')
-        removeToken()
-        resolve()
-      })
-    }
-  }
-}
-
-export default user
+import { login, logout, getInfo, refreshToken } from '@/api/login'
+import { getToken, setToken, setExpiresIn, removeToken } from '@/utils/auth'
+
+const user = {
+  state: {
+    token: getToken(),
+    name: '',
+    avatar: '',
+    roles: [],
+    permissions: []
+  },
+
+  mutations: {
+    SET_TOKEN: (state, token) => {
+      state.token = token
+    },
+    SET_EXPIRES_IN: (state, time) => {
+      state.expires_in = time
+    },
+    SET_NAME: (state, name) => {
+      state.name = name
+    },
+    SET_AVATAR: (state, avatar) => {
+      state.avatar = avatar
+    },
+    SET_ROLES: (state, roles) => {
+      state.roles = roles
+    },
+    SET_PERMISSIONS: (state, permissions) => {
+      state.permissions = permissions
+    }
+  },
+
+  actions: {
+    // 登录
+    Login({ commit }, userInfo) {
+      const username = userInfo.username.trim()
+      const password = userInfo.password
+      const code = userInfo.code
+      const uuid = userInfo.uuid
+      return new Promise((resolve, reject) => {
+        login(username, password, code, uuid).then(res => {
+          let data = res.data
+          setToken(data.access_token)
+          commit('SET_TOKEN', data.access_token)
+          setExpiresIn(data.expires_in)
+          commit('SET_EXPIRES_IN', data.expires_in)
+          resolve()
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+
+    // 获取用户信息
+    GetInfo({ commit, state }) {
+      return new Promise((resolve, reject) => {
+        getInfo().then(res => {
+          const user = res.user
+          const avatar = (user.avatar == "" || user.avatar == null) ? require("@/assets/images/profile.jpg") : user.avatar;
+          if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组
+            commit('SET_ROLES', res.roles)
+            commit('SET_PERMISSIONS', res.permissions)
+          } else {
+            commit('SET_ROLES', ['ROLE_DEFAULT'])
+          }
+          commit('SET_NAME', user.userName)
+          commit('SET_AVATAR', avatar)
+          resolve(res)
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+
+    // 刷新token
+    RefreshToken({commit, state}) {
+      return new Promise((resolve, reject) => {
+        refreshToken(state.token).then(res => {
+          setExpiresIn(res.data)
+          commit('SET_EXPIRES_IN', res.data)
+          resolve()
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+
+    // 退出系统
+    LogOut({ commit, state }) {
+      return new Promise((resolve, reject) => {
+        logout(state.token).then(() => {
+          commit('SET_TOKEN', '')
+          commit('SET_ROLES', [])
+          commit('SET_PERMISSIONS', [])
+          removeToken()
+          resolve()
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+
+    // 前端 登出
+    FedLogOut({ commit }) {
+      return new Promise(resolve => {
+        commit('SET_TOKEN', '')
+        removeToken()
+        resolve()
+      })
+    }
+  }
+}
+
+export default user
diff --git a/ruoyi-ui/src/views/index.vue b/ruoyi-ui/src/views/index.vue
index 3537e5e3..eb4969d5 100644
--- a/ruoyi-ui/src/views/index.vue
+++ b/ruoyi-ui/src/views/index.vue
@@ -1,10 +1,10 @@
 <template>
-  <div class="app-container">
+  <div class="app-container home-page">
     <PageTabs
       class="alive-tabs"
       :tabdate="tabdate">
     </PageTabs>
-    <div style="width: 100%;height:100%;background-color: #ffffff;margin-left: 5px;box-shadow: 0px 1px 8px 0px rgba(0,0,0,0.1);border-radius: 6px;">
+    <div style="width: 100%;height: calc(100vh - 500px);background-color: #ffffff;margin-left: 5px;box-shadow: 0px 1px 8px 0px rgba(0,0,0,0.1);border-radius: 6px;">
 
     </div>
   </div>
@@ -36,6 +36,8 @@ export default {
   activated() {
   },
   created() {
+    console.log('用户基本信息', sessionStorage.getItem('userInfo'))
+    console.log('缓存', JSON.stringify(sessionStorage.sessionObj))
     let roleType =
       sessionStorage.getItem('userInfo') && JSON.parse(sessionStorage.getItem('userInfo')).roleType
         ? JSON.parse(sessionStorage.getItem('userInfo')).roleType