初始化页面布局样式等

ruoyi-ui/.env.development

@@ -10,4 +10,4 @@ VUE_APP_BASE_API = '/dev-api'
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true
 
-VUE_APP_BASE_API2 = 'http://localhost:8081/'
+VUE_APP_BASE_API2 = 'http://192.168.110.52:8081/'

ruoyi-ui/package.json

@@ -69,7 +69,7 @@
     "chalk": "4.1.0",
     "compression-webpack-plugin": "5.0.2",
     "connect": "3.6.6",
-    "eslint": "7.15.0",
+    "eslint": "^7.15.0",
     "eslint-plugin-vue": "7.2.0",
     "lint-staged": "10.5.3",
     "runjs": "4.4.2",

ruoyi-ui/src/App.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="app">
-    <router-view />
+    <router-view /> 
     <theme-picker />
   </div>
 </template>

ruoyi-ui/src/api/system/data.js

@@ -0,0 +1,22 @@
+import request from '@/utils/request'
+import { parseStrEmpty } from "@/utils/ruoyi";
+
+// 查询
+export function getList(query) {
+  return request({
+    url: '/dataSource/list',
+    method: 'get',
+    params: query,
+    baseURL:process.env.VUE_APP_BASE_API2
+  })
+}
+
+// 新增
+export function addSave(data) {
+  return request({
+    url: '/dataSource/save',
+    method: 'post',
+    data: data,
+    baseURL:process.env.VUE_APP_BASE_API2
+  })
+}

ruoyi-ui/src/assets/styles/sidebar.scss

@@ -19,7 +19,7 @@
     height: 100%;
     position: fixed;
     font-size: 0px;
-    top: 0;
+    top: 100px;
     bottom: 0;
     left: 0;
     z-index: 1001;

ruoyi-ui/src/assets/styles/variables.scss

@@ -1,5 +1,5 @@
 // base color
-$blue:#324157;
+$blue:#2a82e5;
 $light-blue:#3A71A8;
 $red:#C03639;
 $pink: #E65D6E;
@@ -9,32 +9,34 @@ $yellow:#FEC171;
 $panGreen: #30B08F;
 
 // 默认菜单主题风格
-$base-menu-color:#bfcbd9;
-$base-menu-color-active:#f4f4f5;
-$base-menu-background:#304156;
+$base-menu-color:#fff;
+$base-menu-color-active:#fff;
+$base-menu-background:#222653;
+$base-menuitem-background:#222653;
 $base-logo-title-color: #ffffff;
 
-$base-menu-light-color:rgba(0,0,0,.70);
-$base-menu-light-background:#ffffff;
-$base-logo-light-title-color: #001529;
+$base-menu-light-color:yellow;
+$base-menu-light-background:red;
+$base-el-submenu_title:red;
+$base-logo-light-title-color: #ef0cd1;
 
-$base-sub-menu-background:#1f2d3d;
-$base-sub-menu-hover:#001528;
+$base-sub-menu-background:#373f78;
+$base-sub-menu-hover: #373f78;
 
 // 自定义暗色菜单风格
-/**
-$base-menu-color:hsla(0,0%,100%,.65);
-$base-menu-color-active:#fff;
-$base-menu-background:#001529;
-$base-logo-title-color: #ffffff;
-
-$base-menu-light-color:rgba(0,0,0,.70);
-$base-menu-light-background:#ffffff;
-$base-logo-light-title-color: #001529;
-
-$base-sub-menu-background:#000c17;
-$base-sub-menu-hover:#001528;
-*/
+// /**
+// $base-menu-color:hsla(0,0%,100%,.65);
+// $base-menu-color-active:#fff;#373f78 #2b42ec  #2a82e5
+// $base-menu-background:#001529;
+// $base-logo-title-color: #ffffff;color="#373f78"
+
+// $base-menu-light-color:rgba(0,0,0,.70);
+// $base-menu-light-background:#ffffff;
+// $base-logo-light-title-color: #001529;
+
+// $base-sub-menu-background:#000c17;
+// $base-sub-menu-hover:#001528;
+// */
 
 $base-sidebar-width: 200px;
 

ruoyi-ui/src/components/Pagination/index.vue

@@ -18,6 +18,7 @@
 <script>
 import { scrollTo } from '@/utils/scroll-to'
 
+
 export default {
   name: 'Pagination',
   props: {

ruoyi-ui/src/components/TopNav/index.vue

@@ -165,11 +165,17 @@ export default {
 </script>
 
 <style lang="scss">
+#app .sidebar-container .theme-dark .is-active > .el-submenu__title {
+    color: #a6b2d9 !important;
+}
+#app .sidebar-container .theme-dark .is-active > .el-submenu__title:hover{
+  color: #fff !important;
+}
 .topmenu-container.el-menu--horizontal > .el-menu-item {
   float: left;
   height: 50px !important;
   line-height: 50px !important;
-  color: #999093 !important;
+  color: #df0d53 !important;
   padding: 0 5px !important;
   margin: 0 10px !important;
 }
@@ -188,4 +194,65 @@ export default {
   padding: 0 5px !important;
   margin: 0 10px !important;
 }
+.sidebar-logo-container[data-v-6494804b] {
+    height: 0px !important;
+}
+
+#app .sidebar-container .el-menu-item:hover, #app .sidebar-container .el-submenu__title:hover{
+  color: #fff !important;
+}
+/* 在这里修改你的样式就行 */
+
+.el-submenu__title{
+  height: 45px !important;
+  margin:0px 15px 0px 15px !important;
+  border-radius: 10px;
+  /* background:   linear-gradient(to right, #2b3fed, #2a81e4) !important; */
+  line-height:45px;
+  text-align: center;
+  box-sizing:inherit;
+  color:#a6b2d9 !important;
+}
+.el-submenu__title:hover {
+  background: linear-gradient(to right, #2b3fed, #2a81e4) !important;
+  color: #fff !important;
+}
+
+
+/* .el-submenu.is-active .el-submenu__title {
+  background: linear-gradient(to right, #2b3fed, #2a81e4) !important;
+} */
+.el-submenu .el-menu-item {
+  margin:0px 20px 0px 20px  !important;
+}
+
+#app .sidebar-container .nest-menu .el-submenu > .el-submenu__title, #app .sidebar-container .el-submenu .el-menu-item {
+     min-width: 10px !important;
+   
+    
+}
+.el-menu-item{
+  color: #a6b2d9 !important;
+}
+
+
+.el-submenu:first-child {
+border-top-right-radius: 10px !important;
+border-top-left-radius: 10px !important;
+}
+
+element.style {
+    color: #a6b2d9 !important;
+    background-color: rgb(34, 38, 83);
+}
+
+.submenu-title-noDropdown {
+    padding-left: 60px !important;
+}
+
+::v-deep.el-submenu.is-active > .el-submenu__title {
+  color: red !important;
+}
+
+
 </style>

ruoyi-ui/src/layout/components/Navbar.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="navbar">
+    
     <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container"
       @toggleClick="toggleSideBar" />
 
@@ -26,7 +27,7 @@
 
       </template>
 
-      <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
+      <!-- <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
         <div class="avatar-wrapper">
           <img :src="avatar" class="user-avatar">
           <i class="el-icon-caret-bottom" />
@@ -42,7 +43,7 @@
             <span>退出登录</span>
           </el-dropdown-item>
         </el-dropdown-menu>
-      </el-dropdown>
+      </el-dropdown> -->
     </div>
   </div>
 </template>
@@ -96,17 +97,17 @@ export default {
     toggleSideBar() {
       this.$store.dispatch('app/toggleSideBar')
     },
-    async logout() {
-      this.$confirm('确定注销并退出系统吗？', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        this.$store.dispatch('LogOut').then(() => {
-          location.href = '/index';
-        })
-      }).catch(() => { });
-    }
+    // async logout() {
+    //   this.$confirm('确定注销并退出系统吗？', '提示', {
+    //     confirmButtonText: '确定',
+    //     cancelButtonText: '取消',
+    //     type: 'warning'
+    //   }).then(() => {
+    //     this.$store.dispatch('LogOut').then(() => {
+    //       location.href = '/index';
+    //     })
+    //   }).catch(() => { });
+    // }
   }
 }
 </script>
@@ -118,6 +119,7 @@ export default {
   position: relative;
   background: #fff;
   box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
+  /* position: absolute; */
 
   .hamburger-container {
     line-height: 46px;

ruoyi-ui/src/layout/components/Sidebar/Logo.vue

@@ -1,7 +1,9 @@
 <template>
+  
   <div class="sidebar-logo-container" :class="{ 'collapse': collapse }"
     :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
-    <transition name="sidebarLogoFade">
+
+    <!-- <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"
@@ -14,12 +16,12 @@
           :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{
             title }} </h1>
       </router-link>
-    </transition>
+    </transition> -->
   </div>
 </template>
 
 <script>
-import logoImg from '@/assets/logo/logo.png'
+import logoImg from '@/assets/logo/logo.png'//图片地址
 import variables from '@/assets/styles/variables.scss'
 
 export default {
@@ -40,7 +42,7 @@ export default {
   },
   data() {
     return {
-      title: '后台管理系统',
+      title: '后台管理系统',//文案
       logo: logoImg
     }
   }

ruoyi-ui/src/layout/index.vue

@@ -1,111 +1,257 @@
 <template>
-  <div :class="classObj" class="app-wrapper" :style="{'--current-color': theme}">
-    <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">
-      <div :class="{'fixed-header':fixedHeader}">
-        <navbar/>
-        <tags-view v-if="needTagsView"/>
+  <div class="combarr" >
+    <div class="combar" >
+      <div class="bar">
+        <span >
+          <img src="../assets/images/comlo.png" alt="" class="imgg" /> 
+        </span>
+        <span class="spann">智能制造平台</span>
+
+        <span style="float: right; margin-right: -1000px">
+          <el-dropdown
+            class="avatar-container right-menu-item hover-effect"
+            trigger="click"
+          >
+            <div class="avatar-wrapper">
+              <img :src="avatar" class="user-avatar" />
+              <span style="">
+                <button class="jianbiase">Admin</button>
+              </span>
+              <i class="el-icon-caret-bottom" />
+            </div>
+            <el-dropdown-menu slot="dropdown" style="margin-top: -20px">
+              <router-link to="/user/profile">
+                <el-dropdown-item>个人中心</el-dropdown-item>
+              </router-link>
+              <el-dropdown-item @click.native="setting = true">
+                <span>布局设置</span>
+              </el-dropdown-item>
+              <el-dropdown-item divided @click.native="logout">
+                <span>退出登录</span>
+              </el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+        </span>
+      </div>
+    </div>
+    <div style="height: 100px;"></div>
+    <div
+      :class="classObj"
+      class="app-wrapper"
+      :style="{ '--current-color': theme }"
+    >
+      <div
+        v-if="device === 'mobile' && sidebar.opened"
+        class="drawer-bg"
+        @click="handleClickOutside"
+      />
+      <sidebar v-if="!sidebar.hide" class="sidebar-container" style="background-color: #222653;border-top-left-radius: 15px;"/>
+      <div
+        :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }"
+        class="main-container"
+      >
+        <div :class="{ 'fixed-header': fixedHeader }">
+          <navbar />
+          <tags-view v-if="needTagsView" />
+        </div>
+        <app-main />
+        <right-panel>
+          <settings />
+        </right-panel>
       </div>
-      <app-main/>
-      <right-panel>
-        <settings/>
-      </right-panel>
     </div>
   </div>
 </template>
 
 <script>
-import RightPanel from '@/components/RightPanel'
-import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components'
-import ResizeMixin from './mixin/ResizeHandler'
-import { mapState } from 'vuex'
-import variables from '@/assets/styles/variables.scss'
+import { mapGetters } from "vuex";
+import RightPanel from "@/components/RightPanel";
+import { AppMain, Navbar, Settings, Sidebar, TagsView } from "./components";
+import ResizeMixin from "./mixin/ResizeHandler";
+import { mapState } from "vuex";
+import variables from "@/assets/styles/variables.scss";
 
 export default {
-  name: 'Layout',
+  name: "Layout",
   components: {
     AppMain,
     Navbar,
     RightPanel,
     Settings,
     Sidebar,
-    TagsView
+    TagsView,
   },
   mixins: [ResizeMixin],
   computed: {
     ...mapState({
-      theme: state => state.settings.theme,
-      sideTheme: state => state.settings.sideTheme,
-      sidebar: state => state.app.sidebar,
-      device: state => state.app.device,
-      needTagsView: state => state.settings.tagsView,
-      fixedHeader: state => state.settings.fixedHeader
+      theme: (state) => state.settings.theme,
+      sideTheme: (state) => state.settings.sideTheme,
+      sidebar: (state) => state.app.sidebar,
+      device: (state) => state.app.device,
+      needTagsView: (state) => state.settings.tagsView,
+      fixedHeader: (state) => state.settings.fixedHeader,
+      ...mapGetters(["avatar"]),
     }),
     classObj() {
       return {
-        hideSidebar: !this.sidebar.opened,
+        // hideSidebar: !this.sidebar.opened,
         openSidebar: this.sidebar.opened,
         withoutAnimation: this.sidebar.withoutAnimation,
-        mobile: this.device === 'mobile'
-      }
+        mobile: this.device === "mobile",
+      };
     },
     variables() {
       return variables;
-    }
+    },
+    setting: {
+      get() {
+        return this.$store.state.settings.showSettings
+      },
+      set(val) {
+        this.$store.dispatch('settings/changeSetting', {
+          key: 'showSettings',
+          value: val
+        })
+      }
+    },
   },
   methods: {
+    
+    async logout() {
+      this.$confirm('确定注销并退出系统吗？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.$store.dispatch('LogOut').then(() => {
+          location.href = '/index';
+        })
+      }).catch(() => { });
+    },
     handleClickOutside() {
-      this.$store.dispatch('app/closeSideBar', { withoutAnimation: false })
-    }
-  }
-}
+      this.$store.dispatch("app/closeSideBar", { withoutAnimation: false });
+      
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
-  @import "~@/assets/styles/mixin.scss";
-  @import "~@/assets/styles/variables.scss";
-
-  .app-wrapper {
-    @include clearfix;
-    position: relative;
-    height: 100%;
-    width: 100%;
-
-    &.mobile.openSidebar {
-      position: fixed;
-      top: 0;
-    }
-  }
+@import "~@/assets/styles/mixin.scss";
+@import "~@/assets/styles/variables.scss";
 
-  .drawer-bg {
-    background: #000;
-    opacity: 0.3;
-    width: 100%;
-    top: 0;
-    height: 100%;
-    position: absolute;
-    z-index: 999;
-  }
+/* .main-container{
+  position: relative;
+}
+.navbar{
+  position:sticky !important;
+} */
+.combar{
+  position:fixed;
+  display:block;
+  width: 100%;
+} 
+.jianbiase {
+  width: 80px;
+  height: 25px;
+  background: linear-gradient(
+    to right,
+    rgb(13, 86, 232),
+    yellow,
+    rgb(228, 17, 17)
+  );
+  border-radius: 15px;
+  margin-top: 15px;
+  /* position:absolute;
+    left: 25px;
+    top: 25px;
+    z-index: 1; */
+}
+.user-avatar {
+  cursor: pointer;
+  width: 40px;
+  height: 40px;
+  border-radius: 50px; //是谁的样式来着
+  z-index: 2;
+
+  vertical-align: middle;
+  margin-right: -18px;
+  position: relative;
+}
 
-  .fixed-header {
+.right-menu-item {
+  display: inline-block;
+  padding: 0 8px;
+  height: 100%;
+  font-size: 18px;
+  color: #7c008a;
+  vertical-align: text-bottom;
+}
+
+.bar {
+  width: 800px;
+  height: 100px;
+  text-align: center;
+  line-height: 100px;
+  /* position: fixed; */
+}
+
+.imgg {
+  width: 120px;
+  height: 45px;
+  float: left;
+  margin-top: 28px;
+  margin-left: 50px;
+}
+.spann {
+  text-align: center;
+  line-height: 100px;
+  font-size: 30px;
+  color: #003e8a;
+  font-weight: bolder;
+  margin-left: -400px;
+}
+
+.app-wrapper {
+  @include clearfix;
+  position: relative;
+  height: 100%;
+  width: 100%;
+
+  &.mobile.openSidebar {
     position: fixed;
     top: 0;
-    right: 0;
-    z-index: 9;
-    width: calc(100% - #{$base-sidebar-width});
-    transition: width 0.28s;
   }
+}
 
-  .hideSidebar .fixed-header {
-    width: calc(100% - 54px);
-  }
+.drawer-bg {
+  background: #000;
+  opacity: 0.3;
+  width: 100%;
+  top: 0;
+  height: 100%;
+  position: absolute;
+  z-index: 999;
+}
 
-  .sidebarHide .fixed-header {
-    width: 100%;
-  }
+.fixed-header {
+  position: fixed;
+  top: 0;
+  right: 0;
+  z-index: 9;
+  width: calc(100% - #{$base-sidebar-width});
+  transition: width 0.28s;
+}
 
-  .mobile .fixed-header {
-    width: 100%;
-  }
+.hideSidebar .fixed-header {
+  width: calc(100% - 54px);
+}
+
+.sidebarHide .fixed-header {
+  width: 100%;
+}
+
+.mobile .fixed-header {
+  width: 100%;
+}
 </style>

ruoyi-ui/src/router/index.js

@@ -30,6 +30,19 @@ import Layout from '@/layout'
 
 // 公共路由
 export const constantRoutes = [
+  // {
+  //   path: '/data',
+  //   component: data,
+  //   hidden: true, 
+  //   children: [
+  //     {
+  //       path: 'data',
+  //       component: () => import('../data/index.vue'),
+  //       name: 'data',
+  //       meta: { title: '数据引擎', icon: 'user' }
+  //     }
+  //   ]
+  // },
   {
     path: '/redirect',
     component: Layout,
@@ -87,11 +100,26 @@ export const constantRoutes = [
         meta: { title: '个人中心', icon: 'user' }
       }
     ]
-  }
+  },
+
 ]
 
 // 动态路由，基于用户权限动态去加载
 export const dynamicRoutes = [
+  {
+    path: '/system/data/index',
+    component: Layout,
+    hidden: true,
+    permissions: ['system:data:index'],
+    children: [
+      {
+        path: 'role/:userId(\\d+)',
+        component: () => import('@/views/system/data/index'),
+        name: 'AuthRole',
+        meta: { title: '数据源配置', activeMenu: '/system/data' }
+      }
+    ]
+  },
   {
     path: '/system/user-auth',
     component: Layout,
@@ -106,6 +134,7 @@ export const dynamicRoutes = [
       }
     ]
   },
+  
   {
     path: '/system/role-auth',
     component: Layout,

ruoyi-ui/src/views/login.vue

@@ -1,28 +1,34 @@
 <template>
   <div class="login">
     <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
-      <h3 class="title">后台管理系统</h3>
+      <img src="../assets/images/comlo.png"  class="comlogo">
+      <span class="title">智能制造平台</span>
       <el-form-item prop="username">
-        <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
-          <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
+        <p  style="line-height: 12px;">用户名</p>
+        <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号" show-password>
+          <!-- <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" /> -->
         </el-input>
       </el-form-item>
       <el-form-item prop="password">
-        <el-input v-model="loginForm.password" type="password" auto-complete="off" placeholder="密码"
-          @keyup.enter.native="handleLogin">
-          <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
+        <p  style="line-height: 12px;">密码</p>
+        <el-input v-model="loginForm.password" type="password" auto-complete="off" placeholder="密码"  
+          @keyup.enter.native="handleLogin" show-password>
+          <!-- <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" /> -->
         </el-input>
       </el-form-item>
+  
       <el-form-item prop="code" v-if="captchaEnabled">
+        <div style="line-height: 12px;">验证码</div>
         <el-input v-model="loginForm.code" auto-complete="off" placeholder="验证码" style="width: 63%"
-          @keyup.enter.native="handleLogin">
-          <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
+          @keyup.enter.native="handleLogin" show-password>
+          <!-- <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" /> -->
         </el-input>
         <div class="login-code">
           <img :src="codeUrl" @click="getCode" class="login-code-img" />
         </div>
       </el-form-item>
-      <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
+      <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;" class="a">在这个设备上记住我</el-checkbox>
+      
       <el-form-item style="width:100%;">
         <el-button :loading="loading" size="medium" type="primary" style="width:100%;"
           @click.native.prevent="handleLogin">
@@ -88,6 +94,7 @@ export default {
     this.getCookie();
   },
   methods: {
+    forgetEvent(){},
     getCode() {
       getCodeImg().then(res => {
         this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled;
@@ -136,23 +143,31 @@ export default {
 </script>
 
 <style rel="stylesheet/scss" lang="scss">
+.comlogo{
+  width: 90px;
+  margin-right: 15px;
+}
 .login {
   display: flex;
   justify-content: center;
   align-items: center;
   height: 100%;
-  background-image: url("../assets/images/login-background.jpg");
+  background-image: url("../assets/images/one.jpg");
   background-size: cover;
 }
 
 .title {
-  margin: 0px auto 30px auto;
+  margin: 0px 30px 30px auto;
   text-align: center;
-  color: #707070;
+  color:#07448a;
+  font-size: 26px;
+  font-weight: bolder;
+ 
+
 }
 
 .login-form {
-  border-radius: 6px;
+  border-radius: 20px;
   background: #ffffff;
   width: 400px;
   padding: 25px 25px 5px 25px;
@@ -205,4 +220,8 @@ export default {
 .login-code-img {
   height: 38px;
 }
+.a{
+  float: left;
+}
+
 </style>

ruoyi-ui/src/views/register.vue

@@ -1,27 +1,28 @@
 <template>
   <div class="register">
     <el-form ref="registerForm" :model="registerForm" :rules="registerRules" class="register-form">
-      <h3 class="title">后台管理系统</h3>
+      <img src="../assets/images/comlo.png"  class="comlogo">
+      <span class="title">智能制造平台</span>
       <el-form-item prop="username">
-        <el-input v-model="registerForm.username" type="text" auto-complete="off" placeholder="账号">
-          <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
+        <el-input v-model="registerForm.username" type="text" auto-complete="off" placeholder="账号" show-password>
+          <!-- <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" /> -->
         </el-input>
       </el-form-item>
       <el-form-item prop="password">
         <el-input v-model="registerForm.password" type="password" auto-complete="off" placeholder="密码"
-          @keyup.enter.native="handleRegister">
-          <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
+          @keyup.enter.native="handleRegister" show-password>
+          <!-- <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" /> -->
         </el-input>
       </el-form-item>
       <el-form-item prop="confirmPassword">
         <el-input v-model="registerForm.confirmPassword" type="password" auto-complete="off" placeholder="确认密码"
-          @keyup.enter.native="handleRegister">
-          <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
+          @keyup.enter.native="handleRegister" show-password>
+          <!-- <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" /> -->
         </el-input>
       </el-form-item>
       <el-form-item prop="code" v-if="captchaEnabled">
         <el-input v-model="registerForm.code" auto-complete="off" placeholder="验证码" style="width: 63%"
-          @keyup.enter.native="handleRegister">
+          @keyup.enter.native="handleRegister" show-password>
           <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
         </el-input>
         <div class="register-code">
@@ -126,19 +127,25 @@ export default {
 </script>
 
 <style rel="stylesheet/scss" lang="scss">
+.comlogo{
+  width: 90px;
+  margin-right: 15px;
+}
 .register {
   display: flex;
   justify-content: center;
   align-items: center;
   height: 100%;
-  background-image: url("../assets/images/login-background.jpg");
+  background-image: url("../assets/images/one.jpg");
   background-size: cover;
 }
 
 .title {
-  margin: 0px auto 30px auto;
+  margin: 0px 30px 30px auto;
   text-align: center;
-  color: #707070;
+  color:#07448a;
+  font-size: 26px;
+  font-weight: bolder;
 }
 
 .register-form {
@@ -195,4 +202,10 @@ export default {
 .register-code-img {
   height: 38px;
 }
+.a{
+  float: left;
+}
+.b{
+  float: right;
+}
 </style>

ruoyi-ui/src/views/system/PortalEngine/index.vue

@@ -0,0 +1,93 @@
+<template>
+  <div class="engine-container">
+    <div class="portal">
+      <div class="portalmen">租户管理</div>
+      <div class="portalexp">
+        <el-button round class="export">导出</el-button>
+        <el-button type="primary" round>+新建租户</el-button>
+      </div>
+    </div>
+  
+    <div class="portalcon">
+      <div class="portalconTop">
+        <el-input
+          placeholder="搜索您的客户..."
+          prefix-icon="el-icon-search"
+          v-model="input2"
+          style="width: 300px;"
+        >
+        </el-input>
+        <el-select v-model="value" placeholder="筛选">
+          <el-option
+            v-for="item in options"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+        <el-date-picker
+      v-model="value1"
+      type="date"
+      placeholder="选择日期">
+    </el-date-picker>
+      </div>
+      <div class="portalconBottom"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+    data() {
+      return {
+        options: [{
+          value: '选项1',
+          label: '黄金糕'
+        }, {
+          value: '选项2',
+          label: '双皮奶'
+        }, {
+          value: '选项3',
+          label: '蚵仔煎'
+        }, {
+          value: '选项4',
+          label: '龙须面'
+        }, {
+          value: '选项5',
+          label: '北京烤鸭'
+        }],
+        value: ''
+      }
+    }
+  }
+</script>
+<style lang="scss" scoped>
+.engine-container{
+  background-color: #f5f5fa;
+  padding: 40px 60px 40px 40px;
+} 
+.portal {
+  width: 1200px;
+  height:30px;
+  margin-bottom: 20px;
+  /* background-color: #f0f811; */
+  /* float: left; */
+}
+.portalmen {
+  font-size: 26px;
+  font-weight: bolder;
+  float: left;
+ 
+}
+.portalexp {
+  float: right;
+}
+.export {
+  margin-right: 20px;
+}
+.portalcon{
+  height: 800px;
+  background-color: #fff;
+}
+</style>

ruoyi-ui/src/views/system/data/index.vue

@@ -0,0 +1,239 @@
+<template>
+  <div>
+    <div class="warp">
+      <div class="dataconfig">数据源配置</div>
+      <div class="formbox">
+        <div class="content">
+          <div class="contenttil">
+            <div class="title">数据库注册</div>
+
+            <el-form
+              label-position="top"
+              label-width="80px"
+              :model="formLabelAlign"
+              ref="ruleForm"
+            >
+              <el-form-item label="数据库类型" class="datatype datadate">
+                <el-select
+                  v-model="formLabelAlign.databaseType"
+                  placeholder="数据库类型"
+                  style="width: 300px; text-align: center"
+                >
+                  <el-option label="mysql" value="mysql"></el-option>
+                  <el-option label="sqlserver" value="sqlserver"></el-option>
+                  <el-option label="dm" value="dm"></el-option>
+                  <el-option label="oracle" value="oracle"></el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="数据库名" class="datadate">
+                <el-input v-model="formLabelAlign.databaseName"></el-input>
+              </el-form-item>
+              <el-form-item label="数据库IP" class="datadate">
+                <el-input v-model="formLabelAlign.databaseIp"></el-input>
+              </el-form-item>
+              <el-form-item label="用户名" class="datadate">
+                <el-input v-model="formLabelAlign.username"></el-input>
+              </el-form-item>
+              <el-form-item label="密码" class="datadate">
+                <el-input v-model="formLabelAlign.password"></el-input>
+              </el-form-item>
+              <el-form-item label="端口号" class="datadate">
+                <el-input v-model="formLabelAlign.portNumber"></el-input>
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary" @click="submitForm('ruleForm')"
+                style="width: 300px;border-radius: 20px;margin-top: 20px;"  
+                >提交</el-button
+                >
+              </el-form-item>
+            </el-form>
+          </div>
+        </div>
+      </div>
+
+      <!-- <div :class="{ hidden: hidden }" class="pagination-container">
+        <el-pagination
+          :background="background"
+          :current-page.sync="currentPage"
+          :page-size.sync="pageSize"
+          :layout="layout"
+          :page-sizes="pageSizes"
+          :pager-count="pagerCount"
+          :total="total"
+          v-bind="$attrs"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+        />
+      </div> -->
+    </div>
+  </div>
+</template>
+<script>
+import { getList, addSave } from "@/api/system/data";
+import { scrollTo } from "@/utils/scroll-to";
+import {
+  listUser,
+  getUser,
+  delUser,
+  addUser,
+  updateUser,
+  resetUserPwd,
+  changeUserStatus,
+  deptTreeSelect,
+} from "@/api/system/user";
+import { getToken } from "@/utils/auth";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+export default {
+  name: "Pagination",
+  props: {
+    total: {
+      required: true,
+      type: Number,
+    },
+    page: {
+      type: Number,
+      default: 1,
+    },
+    limit: {
+      type: Number,
+      default: 20,
+    },
+    pageSizes: {
+      type: Array,
+      default() {
+        return [10, 20, 30, 50];
+      },
+    },
+    // 移动端页码按钮的数量端默认值5
+    pagerCount: {
+      type: Number,
+      default: document.body.clientWidth < 992 ? 5 : 7,
+    },
+    layout: {
+      type: String,
+      default: "total, sizes, prev, pager, next, jumper",
+    },
+    background: {
+      type: Boolean,
+      default: true,
+    },
+    autoScroll: {
+      type: Boolean,
+      default: true,
+    },
+    hidden: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      formLabelAlign: {},
+    };
+  },
+  computed: {
+    currentPage: {
+      get() {
+        return this.page;
+      },
+      set(val) {
+        this.$emit("update:page", val);
+      },
+    },
+    pageSize: {
+      get() {
+        return this.limit;
+      },
+      set(val) {
+        this.$emit("update:limit", val);
+      },
+    },
+  },
+  mounted() {
+    // 获取列表
+    getList().then((res) => {
+      console.log(res);
+      // 获取列表后的操作
+    });
+  },
+  methods: {
+    handleSizeChange(val) {
+      if (this.currentPage * val > this.total) {
+        this.currentPage = 1;
+      }
+      this.$emit("pagination", { page: this.currentPage, limit: val });
+      if (this.autoScroll) {
+        scrollTo(0, 800);
+      }
+    },
+    handleCurrentChange(val) {
+      this.$emit("pagination", { page: val, limit: this.pageSize });
+      if (this.autoScroll) {
+        scrollTo(0, 800);
+      }
+    },
+    submitForm(formName) {
+      console.log(this.formLabelAlign);
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          // 这个是提交后端，新增接口，数据直接填写就可以了。
+          addSave(this.formLabelAlign).then((res) => {
+            console.log(res);
+            // 新增成功后，操作的东西，写这里
+          });
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+
+.pagination-container {
+  background: #fff;
+  padding: 32px 16px;
+}
+.pagination-container.hidden {
+  display: none;
+}
+.el-input {
+  width: 300px;
+}
+.formbox {
+  background-color: #f5f5fa;
+}
+.dataconfig {
+  background-color: #f5f5fa;
+  font-size: 26px;
+  margin: 20px 0px 0px 20px;
+}
+.datadate {
+  margin: 0px 0px 0px 0px !important;
+}
+
+.title {
+  margin: 15px 0px 20px 0px;
+}
+.content {
+  width: 800px;
+  margin: 0 auto;
+  height: 650px;
+  border: 2px solid #fff;
+  border-radius: 15px;
+  background-color: #fff;
+}
+.contenttil{
+ width: 400px;
+ height: 650px;
+ margin:0 auto;
+}
+.title {
+  color: #3366ff;
+  font-size: 28px;
+}
+</style>

ruoyi-ui/src/views/system/menu/index.vue

@@ -10,6 +10,7 @@
         />
       </el-form-item>
       <el-form-item label="状态" prop="status">
+
         <el-select v-model="queryParams.status" placeholder="菜单状态" clearable>
           <el-option
             v-for="dict in dict.type.sys_normal_disable"
@@ -450,3 +451,13 @@ export default {
   }
 };
 </script>
+<style scoped lang="scss">
+
+
+/* #app .sidebar-container .submenu-title-noDropdown:hover, #app .sidebar-container .el-submenu__title:hover {
+    background-color: rgba(0, 0, 0, 0.06) !important;
+}  */
+.submenu-title-noDropdown:hover{
+  background-color:  linear-gradient(to right, blue, rgb(69, 118, 225));
+}
+</style>

ruoyi-ui/src/views/system/user/index.vue

@@ -2,9 +2,9 @@
   <div class="app-container">
     <el-row :gutter="20">
       <!--部门数据-->
-      <el-col :span="4" :xs="24">
-        <div class="head-container">
-          <el-input
+      <!-- <el-col :span="4" :xs="24"> -->
+      <!-- <div class="head-container"> -->
+      <!-- <el-input
             v-model="deptName"
             placeholder="请输入部门名称"
             clearable
@@ -12,8 +12,8 @@
             prefix-icon="el-icon-search"
             style="margin-bottom: 20px"
           />
-        </div>
-        <div class="head-container">
+        </div> -->
+      <!-- <div class="head-container">
           <el-tree
             :data="deptOptions"
             :props="defaultProps"
@@ -25,30 +25,24 @@
             highlight-current
             @node-click="handleNodeClick"
           />
-        </div>
-      </el-col>
+        </div> -->
+      <!-- </el-col> -->
+
       <!--用户数据-->
       <el-col :span="20" :xs="24">
         <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-          <el-form-item label="用户名称" prop="userName">
-            <el-input
-              v-model="queryParams.userName"
-              placeholder="请输入用户名称"
-              clearable
-              style="width: 240px"
-              @keyup.enter.native="handleQuery"
-            />
-          </el-form-item>
-          <el-form-item label="手机号码" prop="phonenumber">
-            <el-input
-              v-model="queryParams.phonenumber"
-              placeholder="请输入手机号码"
-              clearable
-              style="width: 240px"
-              @keyup.enter.native="handleQuery"
-            />
-          </el-form-item>
-          <el-form-item label="状态" prop="status">
+          <div style="float: left">
+            <el-form-item prop="userName">
+              
+              <!-- <i class="el-icon-search"></i> -->
+              <el-input prefix-icon="el-icon-search" v-model="queryParams.userName" placeholder="搜索您的客户..." clearable style="width: 240px"
+                @keyup.enter.native="handleQuery" />
+            </el-form-item>
+            <el-form-item prop="phonenumber">
+              <el-input v-model="queryParams.phonenumber" placeholder="筛选" clearable style="width: 240px"
+                @keyup.enter.native="handleQuery" />
+            </el-form-item>
+            <!-- <el-form-item label="状态" prop="status">
             <el-select
               v-model="queryParams.status"
               placeholder="用户状态"
@@ -62,8 +56,8 @@
                 :value="dict.value"
               />
             </el-select>
-          </el-form-item>
-          <el-form-item label="创建时间">
+          </el-form-item> -->
+            <!-- <el-form-item >
             <el-date-picker
               v-model="dateRange"
               style="width: 240px"
@@ -73,98 +67,79 @@
               start-placeholder="开始日期"
               end-placeholder="结束日期"
             ></el-date-picker>
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+          </el-form-item> -->
+            <!-- <el-form-item> -->
+            <!-- <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
             <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-          </el-form-item>
-        </el-form>
+          </el-form-item> -->
 
-        <el-row :gutter="10" class="mb8">
-          <el-col :span="1.5">
-            <el-button
-              type="primary"
-              plain
-              icon="el-icon-plus"
-              size="mini"
-              @click="handleAdd"
-              v-hasPermi="['system:user:add']"
-            >新增</el-button>
-          </el-col>
-          <el-col :span="1.5">
-            <el-button
-              type="success"
-              plain
-              icon="el-icon-edit"
-              size="mini"
-              :disabled="single"
-              @click="handleUpdate"
-              v-hasPermi="['system:user:edit']"
-            >修改</el-button>
-          </el-col>
-          <el-col :span="1.5">
-            <el-button
-              type="danger"
-              plain
-              icon="el-icon-delete"
-              size="mini"
-              :disabled="multiple"
-              @click="handleDelete"
-              v-hasPermi="['system:user:remove']"
-            >删除</el-button>
-          </el-col>
-          <el-col :span="1.5">
-            <el-button
-              type="info"
-              plain
-              icon="el-icon-upload2"
-              size="mini"
-              @click="handleImport"
-              v-hasPermi="['system:user:import']"
-            >导入</el-button>
-          </el-col>
-          <el-col :span="1.5">
-            <el-button
-              type="warning"
-              plain
-              icon="el-icon-download"
-              size="mini"
-              @click="handleExport"
-              v-hasPermi="['system:user:export']"
-            >导出</el-button>
-          </el-col>
-          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
-        </el-row>
+            <el-date-picker v-model="value1" type="date" placeholder="选择日期">
+            </el-date-picker>
+          </div>
+
+          <div style="float: right">
+            <el-col :span="1.5">
+              <el-button plain size="mini" @click="handleAdd" v-hasPermi="['system:user:add']"
+                style="border-radius: 15px; margin-right: 0%">新增</el-button>
+            </el-col>
+            <!-- <el-col :span="1.5">
+              <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
+                v-hasPermi="['system:user:edit']">修改</el-button>
+            </el-col> -->
+            <el-col :span="1.5">
+              <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
+                v-hasPermi="['system:user:remove']"></el-button>
+            </el-col>
+          </div>
 
-        <el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
+          <!-- <el-col :span="1.5">
+              <el-button type="info" plain icon="el-icon-upload2" size="mini" @click="handleImport"
+                v-hasPermi="['system:user:import']">导入</el-button>
+            </el-col>
+            <el-col :span="1.5">
+              <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
+                v-hasPermi="['system:user:export']">导出</el-button>
+            </el-col> -->
+          <!-- <right-toolbar
+                :showSearch.sync="showSearch"
+                @queryTable="getList"
+                :columns="columns"
+              ></right-toolbar>
+             -->
+        </el-form>
+
+        <el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange" stripe>
           <el-table-column type="selection" width="50" align="center" />
-          <el-table-column label="用户编号" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
-          <el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
-          <el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
-          <el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
-          <el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
-          <el-table-column label="状态" align="center" key="status" v-if="columns[5].visible">
-            <template slot-scope="scope">
+          <el-table-column label="操作" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
+          <el-table-column label="用户名" align="center" key="userName" prop="userName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
+          <el-table-column label="名字" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
+          <el-table-column label="姓氏" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
+          <el-table-column label="角色" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
+          <el-table-column label="邮箱地址" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" width="200" />
+          <el-table-column label="激活" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
+          <el-table-column label="上次登录时间" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="150" >
+          <!-- <el-table-column label="创建时间" align="center" key="status" v-if="columns[5].visible"> -->
+            <!-- <template slot-scope="scope">
               <el-switch
                 v-model="scope.row.status"
                 active-value="0"
                 inactive-value="1"
                 @change="handleStatusChange(scope.row)"
               ></el-switch>
-            </template>
+            </template> -->
           </el-table-column>
-          <el-table-column label="创建时间" align="center" prop="createTime" v-if="columns[6].visible" width="160">
+          <el-table-column label="创建时间" align="center" prop="createTime" v-if="columns[6].visible" width="260">
             <template slot-scope="scope">
               <span>{{ parseTime(scope.row.createTime) }}</span>
             </template>
           </el-table-column>
-          <el-table-column
+          <!-- <el-table-column
             label="操作"
             align="center"
             width="160"
             class-name="small-padding fixed-width"
-          >
-            <template slot-scope="scope" v-if="scope.row.userId !== 1">
+          > -->
+            <!-- <template slot-scope="scope" v-if="scope.row.userId !== 1">
               <el-button
                 size="mini"
                 type="text"
@@ -188,17 +163,12 @@
                     v-hasPermi="['system:user:edit']">分配角色</el-dropdown-item>
                 </el-dropdown-menu>
               </el-dropdown>
-            </template>
-          </el-table-column>
+            </template> -->
+          <!-- </el-table-column> -->
         </el-table>
 
-        <pagination
-          v-show="total>0"
-          :total="total"
-          :page.sync="queryParams.pageNum"
-          :limit.sync="queryParams.pageSize"
-          @pagination="getList"
-        />
+        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
+          @pagination="getList" />
       </el-col>
     </el-row>
 
@@ -207,7 +177,7 @@
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
         <el-row>
           <el-col :span="12">
-            <el-form-item label="用户昵称" prop="nickName">
+            <el-form-item label="用户名" prop="nickName">
               <el-input v-model="form.nickName" placeholder="请输入用户昵称" maxlength="30" />
             </el-form-item>
           </el-col>
@@ -237,7 +207,7 @@
           </el-col>
           <el-col :span="12">
             <el-form-item v-if="form.userId == undefined" label="用户密码" prop="password">
-              <el-input v-model="form.password" placeholder="请输入用户密码" type="password" maxlength="20" show-password/>
+              <el-input v-model="form.password" placeholder="请输入用户密码" type="password" maxlength="20" show-password />
             </el-form-item>
           </el-col>
         </el-row>
@@ -245,23 +215,16 @@
           <el-col :span="12">
             <el-form-item label="用户性别">
               <el-select v-model="form.sex" placeholder="请选择性别">
-                <el-option
-                  v-for="dict in dict.type.sys_user_sex"
-                  :key="dict.value"
-                  :label="dict.label"
-                  :value="dict.value"
-                ></el-option>
+                <el-option v-for="dict in dict.type.sys_user_sex" :key="dict.value" :label="dict.label"
+                  :value="dict.value"></el-option>
               </el-select>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="状态">
               <el-radio-group v-model="form.status">
-                <el-radio
-                  v-for="dict in dict.type.sys_normal_disable"
-                  :key="dict.value"
-                  :label="dict.value"
-                >{{dict.label}}</el-radio>
+                <el-radio v-for="dict in dict.type.sys_normal_disable" :key="dict.value" :label="dict.value">{{ dict.label
+                }}</el-radio>
               </el-radio-group>
             </el-form-item>
           </el-col>
@@ -270,26 +233,16 @@
           <el-col :span="12">
             <el-form-item label="岗位">
               <el-select v-model="form.postIds" multiple placeholder="请选择岗位">
-                <el-option
-                  v-for="item in postOptions"
-                  :key="item.postId"
-                  :label="item.postName"
-                  :value="item.postId"
-                  :disabled="item.status == 1"
-                ></el-option>
+                <el-option v-for="item in postOptions" :key="item.postId" :label="item.postName" :value="item.postId"
+                  :disabled="item.status == 1"></el-option>
               </el-select>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="角色">
               <el-select v-model="form.roleIds" multiple placeholder="请选择角色">
-                <el-option
-                  v-for="item in roleOptions"
-                  :key="item.roleId"
-                  :label="item.roleName"
-                  :value="item.roleId"
-                  :disabled="item.status == 1"
-                ></el-option>
+                <el-option v-for="item in roleOptions" :key="item.roleId" :label="item.roleName" :value="item.roleId"
+                  :disabled="item.status == 1"></el-option>
               </el-select>
             </el-form-item>
           </el-col>
@@ -297,7 +250,7 @@
         <el-row>
           <el-col :span="24">
             <el-form-item label="备注">
-              <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
+              <el-input v-model="formNaNpxark" type="textarea" placeholder="请输入内容"></el-input>
             </el-form-item>
           </el-col>
         </el-row>
@@ -310,26 +263,19 @@
 
     <!-- 用户导入对话框 -->
     <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
-      <el-upload
-        ref="upload"
-        :limit="1"
-        accept=".xlsx, .xls"
-        :headers="upload.headers"
-        :action="upload.url + '?updateSupport=' + upload.updateSupport"
-        :disabled="upload.isUploading"
-        :on-progress="handleFileUploadProgress"
-        :on-success="handleFileSuccess"
-        :auto-upload="false"
-        drag
-      >
+      <el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
+        :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
+        :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
         <i class="el-icon-upload"></i>
         <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
         <div class="el-upload__tip text-center" slot="tip">
           <div class="el-upload__tip" slot="tip">
-            <el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的用户数据
+            <el-checkbox v-model="upload.updateSupport" />
+            是否更新已经存在的用户数据
           </div>
           <span>仅允许导入xls、xlsx格式文件。</span>
-          <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="importTemplate">下载模板</el-link>
+          <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
+            @click="importTemplate">下载模板</el-link>
         </div>
       </el-upload>
       <div slot="footer" class="dialog-footer">
@@ -341,17 +287,57 @@
 </template>
 
 <script>
-import { listUser, getUser, delUser, addUser, updateUser, resetUserPwd, changeUserStatus, deptTreeSelect } from "@/api/system/user";
+import {
+  listUser,
+  getUser,
+  delUser,
+  addUser,
+  updateUser,
+  resetUserPwd,
+  changeUserStatus,
+  deptTreeSelect,
+} from "@/api/system/user";
 import { getToken } from "@/utils/auth";
 import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 
 export default {
   name: "User",
-  dicts: ['sys_normal_disable', 'sys_user_sex'],
+  dicts: ["sys_normal_disable", "sys_user_sex"],
   components: { Treeselect },
   data() {
     return {
+      pickerOptions: {
+        disabledDate(time) {
+          return time.getTime() > Date.now();
+        },
+        shortcuts: [
+          {
+            text: "今天",
+            onClick(picker) {
+              picker.$emit("pick", new Date());
+            },
+          },
+          {
+            text: "昨天",
+            onClick(picker) {
+              const date = new Date();
+              date.setTime(date.getTime() - 3600 * 1000 * 24);
+              picker.$emit("pick", date);
+            },
+          },
+          {
+            text: "一周前",
+            onClick(picker) {
+              const date = new Date();
+              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
+              picker.$emit("pick", date);
+            },
+          },
+        ],
+      },
+      value1: "",
+      value2: "",
       // 遮罩层
       loading: true,
       // 选中数组
@@ -386,7 +372,7 @@ export default {
       form: {},
       defaultProps: {
         children: "children",
-        label: "label"
+        label: "label",
       },
       // 用户导入参数
       upload: {
@@ -401,7 +387,7 @@ export default {
         // 设置上传的请求头部
         headers: { Authorization: "Bearer " + getToken() },
         // 上传的地址
-        url: process.env.VUE_APP_BASE_API + "/system/user/importData"
+        url: process.env.VUE_APP_BASE_API + "/system/user/importData",
       },
       // 查询参数
       queryParams: {
@@ -410,7 +396,7 @@ export default {
         userName: undefined,
         phonenumber: undefined,
         status: undefined,
-        deptId: undefined
+        deptId: undefined,
       },
       // 列信息
       columns: [
@@ -420,56 +406,77 @@ export default {
         { key: 3, label: `部门`, visible: true },
         { key: 4, label: `手机号码`, visible: true },
         { key: 5, label: `状态`, visible: true },
-        { key: 6, label: `创建时间`, visible: true }
+        { key: 6, label: `创建时间`, visible: true },
       ],
       // 表单校验
       rules: {
         userName: [
           { required: true, message: "用户名称不能为空", trigger: "blur" },
-          { min: 2, max: 20, message: '用户名称长度必须介于 2 和 20 之间', trigger: 'blur' }
+          {
+            min: 2,
+            max: 20,
+            message: "用户名称长度必须介于 2 和 20 之间",
+            trigger: "blur",
+          },
         ],
         nickName: [
-          { required: true, message: "用户昵称不能为空", trigger: "blur" }
+          { required: true, message: "用户昵称不能为空", trigger: "blur" },
         ],
         password: [
           { required: true, message: "用户密码不能为空", trigger: "blur" },
-          { min: 5, max: 20, message: '用户密码长度必须介于 5 和 20 之间', trigger: 'blur' }
+          {
+            min: 5,
+            max: 20,
+            message: "用户密码长度必须介于 5 和 20 之间",
+            trigger: "blur",
+          },
         ],
         email: [
           {
             type: "email",
             message: "请输入正确的邮箱地址",
-            trigger: ["blur", "change"]
-          }
+            trigger: ["blur", "change"],
+          },
         ],
         phonenumber: [
           {
             pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
             message: "请输入正确的手机号码",
-            trigger: "blur"
-          }
-        ]
-      }
+            trigger: "blur",
+          },
+        ],
+      },
     };
   },
   watch: {
     // 根据名称筛选部门树
     deptName(val) {
       this.$refs.tree.filter(val);
-    }
+    },
   },
   created() {
     this.getList();
     this.getDeptTree();
-    this.getConfigKey("sys.user.initPassword").then(response => {
+    this.getConfigKey("sys.user.initPassword").then((response) => {
       this.initPassword = response.msg;
     });
   },
   methods: {
+
+    // tableRowClassName(row, rowIndex) {
+    //     if (rowIndex === 1) {
+    //       return 'waring-row';
+    //     } else if (rowIndex === 2) {
+    //       return 'success-row';
+    //     }
+    //     return '';
+    //   },
+
     /** 查询用户列表 */
     getList() {
       this.loading = true;
-      listUser(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
+      listUser(this.addDateRange(this.queryParams, this.dateRange)).then(
+        (response) => {
           this.userList = response.rows;
           this.total = response.total;
           this.loading = false;
@@ -478,7 +485,7 @@ export default {
     },
     /** 查询部门下拉树结构 */
     getDeptTree() {
-      deptTreeSelect().then(response => {
+      deptTreeSelect().then((response) => {
         this.deptOptions = response.data;
       });
     },
@@ -495,13 +502,17 @@ export default {
     // 用户状态修改
     handleStatusChange(row) {
       let text = row.status === "0" ? "启用" : "停用";
-      this.$modal.confirm('确认要"' + text + '""' + row.userName + '"用户吗？').then(function() {
-        return changeUserStatus(row.userId, row.status);
-      }).then(() => {
-        this.$modal.msgSuccess(text + "成功");
-      }).catch(function() {
-        row.status = row.status === "0" ? "1" : "0";
-      });
+      this.$modal
+        .confirm('确认要"' + text + '""' + row.userName + '"用户吗？')
+        .then(function () {
+          return changeUserStatus(row.userId, row.status);
+        })
+        .then(() => {
+          this.$modal.msgSuccess(text + "成功");
+        })
+        .catch(function () {
+          row.status = row.status === "0" ? "1" : "0";
+        });
     },
     // 取消按钮
     cancel() {
@@ -522,7 +533,7 @@ export default {
         status: "0",
         remark: undefined,
         postIds: [],
-        roleIds: []
+        roleIds: [],
       };
       this.resetForm("form");
     },
@@ -541,7 +552,7 @@ export default {
     },
     // 多选框选中数据
     handleSelectionChange(selection) {
-      this.ids = selection.map(item => item.userId);
+      this.ids = selection.map((item) => item.userId);
       this.single = selection.length != 1;
       this.multiple = !selection.length;
     },
@@ -561,7 +572,7 @@ export default {
     /** 新增按钮操作 */
     handleAdd() {
       this.reset();
-      getUser().then(response => {
+      getUser().then((response) => {
         this.postOptions = response.posts;
         this.roleOptions = response.roles;
         this.open = true;
@@ -573,7 +584,7 @@ export default {
     handleUpdate(row) {
       this.reset();
       const userId = row.userId || this.ids;
-      getUser(userId).then(response => {
+      getUser(userId).then((response) => {
         this.form = response.data;
         this.postOptions = response.posts;
         this.roleOptions = response.roles;
@@ -591,30 +602,32 @@ export default {
         cancelButtonText: "取消",
         closeOnClickModal: false,
         inputPattern: /^.{5,20}$/,
-        inputErrorMessage: "用户密码长度必须介于 5 和 20 之间"
-      }).then(({ value }) => {
-          resetUserPwd(row.userId, value).then(response => {
+        inputErrorMessage: "用户密码长度必须介于 5 和 20 之间",
+      })
+        .then(({ value }) => {
+          resetUserPwd(row.userId, value).then((response) => {
             this.$modal.msgSuccess("修改成功，新密码是：" + value);
           });
-        }).catch(() => {});
+        })
+        .catch(() => { });
     },
     /** 分配角色操作 */
-    handleAuthRole: function(row) {
+    handleAuthRole: function (row) {
       const userId = row.userId;
       this.$router.push("/system/user-auth/role/" + userId);
     },
     /** 提交按钮 */
-    submitForm: function() {
-      this.$refs["form"].validate(valid => {
+    submitForm: function () {
+      this.$refs["form"].validate((valid) => {
         if (valid) {
           if (this.form.userId != undefined) {
-            updateUser(this.form).then(response => {
+            updateUser(this.form).then((response) => {
               this.$modal.msgSuccess("修改成功");
               this.open = false;
               this.getList();
             });
           } else {
-            addUser(this.form).then(response => {
+            addUser(this.form).then((response) => {
               this.$modal.msgSuccess("新增成功");
               this.open = false;
               this.getList();
@@ -626,18 +639,26 @@ export default {
     /** 删除按钮操作 */
     handleDelete(row) {
       const userIds = row.userId || this.ids;
-      this.$modal.confirm('是否确认删除用户编号为"' + userIds + '"的数据项？').then(function() {
-        return delUser(userIds);
-      }).then(() => {
-        this.getList();
-        this.$modal.msgSuccess("删除成功");
-      }).catch(() => {});
+      this.$modal
+        .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
+        .then(function () {
+          return delUser(userIds);
+        })
+        .then(() => {
+          this.getList();
+          this.$modal.msgSuccess("删除成功");
+        })
+        .catch(() => { });
     },
     /** 导出按钮操作 */
     handleExport() {
-      this.download('system/user/export', {
-        ...this.queryParams
-      }, `user_${new Date().getTime()}.xlsx`)
+      this.download(
+        "system/user/export",
+        {
+          ...this.queryParams,
+        },
+        `user_${new Date().getTime()}.xlsx`
+      );
     },
     /** 导入按钮操作 */
     handleImport() {
@@ -646,8 +667,11 @@ export default {
     },
     /** 下载模板操作 */
     importTemplate() {
-      this.download('system/user/importTemplate', {
-      }, `user_template_${new Date().getTime()}.xlsx`)
+      this.download(
+        "system/user/importTemplate",
+        {},
+        `user_template_${new Date().getTime()}.xlsx`
+      );
     },
     // 文件上传中处理
     handleFileUploadProgress(event, file, fileList) {
@@ -658,13 +682,28 @@ export default {
       this.upload.open = false;
       this.upload.isUploading = false;
       this.$refs.upload.clearFiles();
-      this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
+      this.$alert(
+        "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
+        response.msg +
+        "</div>",
+        "导入结果",
+        { dangerouslyUseHTMLString: true }
+      );
       this.getList();
     },
     // 提交上传文件
     submitFileForm() {
       this.$refs.upload.submit();
-    }
-  }
+    },
+  },
 };
-</script>
+</script>
+<style lang="scss" scoped>
+ /* .el-table .waring-row {
+    background: #e01313 !important;
+  }
+
+  .el-table .success-row {
+    background:#8da814 !important;
+  } */
+</style>

ruoyi-ui/vue.config.js

@@ -35,7 +35,7 @@ module.exports = {
     proxy: {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
-        target: `http://localhost:8080`,
+        target: `http://192.168.110.52:8080`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''