Merge pull request #53 from zero-fsc/v1.0.2

fix(custom): fix bug

CHANGELOG.md

@@ -1,3 +1,11 @@
+# v1.0.2-alpha.4(2023-03-17)
+### Feature
+- use BEM specification toreconstruct the layout and naming conventions.
+- add setting module
+
+### Bug Fixes
+- fix layout style
+
 # v1.0.2-alpha.3(2023-03-01)
 
 ### Feature

CHANGELOG.zh-CN.md

@@ -1,3 +1,12 @@
+# v1.0.2-alpha.4(2023-03-17)
+### Feature
+- 使用BEM规范重构layout整体布局及命名规范
+- 新增全局setting模块
+
+### Bug Fixes
+- 修复layout样式问题
+- 修复分析页问题
+
 # v1.0.2-alpha.3(2023-03-01)
 
 ### Feature

src/App.vue

@@ -16,5 +16,6 @@ export default {
 #app {
   overflow: visible;
   width: 100%;
+  height: 100%;
 }
 </style>

src/components/Setting/index.vue

@@ -0,0 +1,35 @@
+<!--
+* @description Setting component
+* @fileName index.vue
+* @author zero_fsc
+* @date 2023/03/11 00:05:10
+!-->
+<template>
+  <div class="setting-container">
+    <i role="img" class="el-icon-setting" @click="handleExplicitDrawer"></i>
+    <el-drawer title="全局配置" :visible.sync="drawer" :modal-append-to-body="false">
+      <span>我来啦!</span>
+    </el-drawer>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      drawer: false,
+    };
+  },
+
+  computed: {},
+
+  mounted() {},
+
+  methods: {
+    handleExplicitDrawer() {
+      this.drawer = true;
+    },
+  },
+};
+</script>
+<style lang="scss" scoped></style>

src/css/element.less

@@ -15,22 +15,23 @@
   line-height: 2.5rem;
 }
 
-.el-footer {
-  height: auto !important;
-}
-
 .el-menu-vertical-demo:not(.el-menu--collapse) {
   width: 200px;
   min-height: 400px;
 }
 
 .el-main, .el-footer {
-  overflow: hidden !important;
+  overflow: visible !important;
   padding: 0 !important;
   color: #333;
   background-color: #e9eef3;
 }
 
+.el-footer {
+  height: auto !important;
+  line-height: 0.6rem;
+}
+
 .el-menu {
   height: 100%;
 }

src/layouts/content/index.vue

@@ -5,7 +5,6 @@
     </div>
     <div class="ov-layout-main__content">
       <router-view />
-      <!-- <footer-comp /> -->
     </div>
   </div>
 </template>
@@ -19,8 +18,6 @@ export default {
     return {};
   },
 
-  computed: {},
-
   mounted() {},
 
   methods: {},

src/layouts/footer/index.vue

@@ -16,7 +16,6 @@ export default {
 
 <style lang="less" scoped>
 .ov-layout-footer {
-  margin: 0.6rem 0 0.3rem;
   text-align: center;
 
   &__description {

src/layouts/header/index.vue

@@ -10,6 +10,9 @@
       <bread-crumb :breadcrumb-style="{ 'margin-left': '15px' }" />
     </div>
     <div class="ov-layout-header-body ov-layout-header-action">
+      <!-- Setting -->
+      <setting-comp class="ov-layout-header-action__item setting-item" />
+      <el-divider direction="vertical"></el-divider>
       <!-- i18n -->
       <i18n-comp class="ov-layout-header-action__item i18n-item" />
       <el-divider direction="vertical"></el-divider>
@@ -37,9 +40,10 @@
 import BreadCrumb from '@components/BreadCrumb';
 import { mapState, mapMutations } from 'vuex';
 import I18nComp from '@components/I18n';
+import SettingComp from '@components/Setting';
 
 export default {
-  components: { I18nComp, BreadCrumb },
+  components: { I18nComp, BreadCrumb, SettingComp },
   data() {
     return {
       userName: 'Admin',

src/layouts/index.vue

@@ -48,7 +48,7 @@ export default {
 .layout-header {
   position: fixed;
   top: 0;
-  z-index: 500;
+  z-index: 5;
   width: 100%;
   height: 0.6rem !important;
   background-color: #fff;
@@ -62,7 +62,6 @@ export default {
 
   .el-aside {
     position: fixed;
-    z-index: 500;
     width: 200px;
     min-width: 200px;
     max-width: 200px;

src/store/index.js

@@ -1,11 +1,13 @@
 import Vue from 'vue';
 import Vuex from 'vuex';
 import common from './modules/common';
+import setting from './modules/setting';
 
 Vue.use(Vuex);
 
 export default new Vuex.Store({
   modules: {
     common,
+    setting,
   },
 });

src/store/modules/setting.js

@@ -0,0 +1,16 @@
+export default {
+  namespaced: true,
+  state: {
+    isShowFooter: false,
+  },
+
+  getters: {},
+
+  mutations: {
+    handleExplicitFooter(state, status) {
+      state.isShowFooter = status;
+    },
+  },
+
+  actions: {},
+};

src/views/DashBoard/ayalysis/comps/footerLine.vue

@@ -40,6 +40,7 @@ export default {
           textStyle: {
             color: '#606266',
           },
+          extraCssText: 'z-index: auto',
         },
         grid: {
           top: '15%',

src/views/login/login.vue

@@ -133,7 +133,7 @@ export default {
                 this.$router.push(this.redirectPath);
               } else {
                 this.$router.push({
-                  name: 'DashBoard',
+                  name: 'Ayalysis',
                 });
               }
             } else {

src/views/login/ssoLogin.vue

@@ -56,7 +56,7 @@ export default {
           return;
         }
         this.$router.push({
-          name: 'DashBoard',
+          name: 'Ayalysis',
         });
       });
     },