qj-common 4.3.0 → 4.3.2

package/src/views/layout/components/Sidebar/SidebarItem.vue

@@ -1,113 +1,116 @@
-<template>
-  <div class="menu-wrapper el-menu-custom">
-    <template v-for="item in routes" v-if="item.menuShow == 0">
-      <el-submenu :index="item.proappMenuCode" :key="item.proappMenuCode" @select="selectHandler" v-if="item.children && item.children.length > 0">
-        <template slot="title">
-          <span v-if="item.menuShow == 0">{{ item.menuName }}</span>
-        </template>
-
-        <template v-for="child in item.children">
-          <template v-if="item.children && item.children.length > 0">
-            <sidebar-item :is-nest="true" :key="child.menuAction" :routes="[child]" class="nest-menu" v-if="child.children && child.menuShow == 0"></sidebar-item>
-
-            <el-menu-item :index="'/' + child.menuAction" :key="child.menuAction" @click="routerLink(item, child)" v-else-if="child.menuShow == 0 && proappEnvOpentype == '/'">
-              <span v-if="child.menuShow == 0">{{ child.menuName }}</span>
-            </el-menu-item>
-            <el-menu-item
-              :index="'/' + item.proappMenuCode + '/' + child.menuAction"
-              :key="child.menuAction"
-              @click="routerLink(item, child)"
-              v-else-if="child.menuShow == 0 && proappEnvOpentype != '/'"
-            >
-              <span v-if="child.menuShow == 0">{{ child.menuName }}</span>
-            </el-menu-item>
-          </template>
-        </template>
-      </el-submenu>
-      <el-menu-item :index="'/' + item.menuAction" :key="'/' + item.menuAction" @click="routerPath(item)" v-if="!item.children || item.children.length == 0">
-        <div>
-          <span v-if="item.menuShow == 0">{{ item.menuName }}</span>
-        </div>
-      </el-menu-item>
-    </template>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'SidebarItem',
-  props: {
-    routes: {
-      type: Array,
-    },
-    isNest: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  data() {
-    return {
-      proappEnvOpentype: window.sessionStorage.getItem('proappEnvLayout') ? JSON.parse(window.sessionStorage.getItem('proappEnvLayout')).proappEnvOpentype : null, //默认是null
-      secDomainName:null
-    };
-  },
-  mounted() {
-    // let proappEnvLayout = window.sessionStorage.getItem("proappEnvLayout");
-    // if (proappEnvLayout) {
-    //   this.proappEnvOpentype = JSON.parse(proappEnvLayout).proappEnvOpentype;
-    // }
-     this.secDomainName=sessionStorage.getItem('secDomainName')?sessionStorage.getItem('secDomainName'):null
-  },
-  methods: {
-    routerPath(item) {
-      // console.log(item);
-      if (process.env.NODE_ENV === 'development') {
-        // 表示本地开发
-        location.href = '#/' + item.menuAction;
-      } else {
-        location.href = this.secDomainName + item.menuTarget + '#/' + item.menuAction;
-      }
-      this.$emit('getMenu', item.menuName, null);
-      this.$store.commit('SET_CURRENT_MENU', item);
-    },
-    routerLink(item, child) {
-      console.log(item, child, '二级和三级');
-      this.$emit('getMenu', item.menuName, child.menuName);
-      this.$store.commit('SET_CURRENT_MENU', child);
-      window.sessionStorage.setItem('menuCode', child.proappModelCode);
-      let url = null;
-      if (location.href.indexOf('localhost') > -1) {
-        // 表示本地
-        url = this.proappEnvOpentype == '/' ? `#/${child.menuAction}` : `#/${item.proappMenuCode}/${child.menuAction}`;
-      } else {
-        url = this.proappEnvOpentype == '/' ? `${child.menuTarget}#/${child.menuAction}` : `${child.menuTarget}#/${item.proappMenuCode}/${child.menuAction}`;
-        url = child.menuTarget.indexOf('http')==-1? this.secDomainName+url : url
-      }
-      location.href = url;
-    },
-  },
-};
-</script>
-<style rel="stylesheet" scoped>
-.menu-wrapper li.el-menu-item:hover {
-  background-color: #fff !important;
-}
-.menu-wrapper li.el-menu-item {
-  height: 38px;
-  line-height: 34px;
-  font-size: 12px;
-}
-</style>
-<style>
-.menu-wrapper {
-  font-size: 12px !important;
-}
-.el-submenu__title {
-  font-size: 12px !important;
-  height: 38px !important;
-  line-height: 38px !important;
-}
-.el-submenu__icon-arrow {
-  margin-top: -3px !important;
-}
-</style>
+<template>
+  <div class="menu-wrapper el-menu-custom">
+    <template v-for="item in routes" v-if="item.menuShow == 0">
+      <el-submenu :index="item.proappMenuCode" :key="item.proappMenuCode" @select="selectHandler"
+        v-if="item.children && item.children.length > 0">
+        <template slot="title">
+          <span v-if="item.menuShow == 0">{{ item.menuName }}</span>
+        </template>
+
+        <template v-for="child in item.children">
+          <template v-if="item.children && item.children.length > 0">
+            <sidebar-item :is-nest="true" :key="child.menuAction" :routes="[child]" class="nest-menu"
+              v-if="child.children && child.menuShow == 0"></sidebar-item>
+
+            <el-menu-item :index="'/' + child.menuAction" :key="child.menuAction" @click="routerLink(item, child)"
+              v-else-if="child.menuShow == 0 && proappEnvOpentype == '/'">
+              <span v-if="child.menuShow == 0">{{ child.menuName }}</span>
+            </el-menu-item>
+            <el-menu-item :index="'/' + item.proappMenuCode + '/' + child.menuAction" :key="child.menuAction"
+              @click="routerLink(item, child)" v-else-if="child.menuShow == 0 && proappEnvOpentype != '/'">
+              <span v-if="child.menuShow == 0">{{ child.menuName }}</span>
+            </el-menu-item>
+          </template>
+        </template>
+      </el-submenu>
+      <el-menu-item :index="'/' + item.menuAction" :key="'/' + item.menuAction" @click="routerPath(item)"
+        v-if="!item.children || item.children.length == 0">
+        <div>
+          <span v-if="item.menuShow == 0">{{ item.menuName }}</span>
+        </div>
+      </el-menu-item>
+    </template>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'SidebarItem',
+  props: {
+    routes: {
+      type: Array,
+    },
+    isNest: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      proappEnvOpentype: window.sessionStorage.getItem('proappEnvLayout') ? JSON.parse(window.sessionStorage.getItem('proappEnvLayout')).proappEnvOpentype : null, //默认是null
+      secDomainName: null
+    };
+  },
+  mounted() {
+    // let proappEnvLayout = window.sessionStorage.getItem("proappEnvLayout");
+    // if (proappEnvLayout) {
+    //   this.proappEnvOpentype = JSON.parse(proappEnvLayout).proappEnvOpentype;
+    // }
+    this.secDomainName = sessionStorage.getItem('secDomainName') ? sessionStorage.getItem('secDomainName') : null
+  },
+  methods: {
+    routerPath(item) {
+      // console.log(item);
+      if (process.env.NODE_ENV === 'development') {
+        // 表示本地开发
+        location.href = '#/' + item.menuAction;
+      } else {
+        location.href = this.secDomainName + item.menuTarget + '#/' + item.menuAction;
+      }
+      this.$emit('getMenu', item.menuName, null);
+      this.$store.commit('SET_CURRENT_MENU', item);
+    },
+    routerLink(item, child) {
+      console.log(item, child, '二级和三级');
+      this.$emit('getMenu', item.menuName, child.menuName);
+      this.$store.commit('SET_CURRENT_MENU', child);
+      window.sessionStorage.setItem('menuCode', child.proappModelCode);
+      let url = null;
+      if (location.href.indexOf('localhost') > -1) {
+        // 表示本地
+        url = this.proappEnvOpentype == '/' ? `#/${child.menuAction}` : `#/${item.proappMenuCode}/${child.menuAction}`;
+      } else {
+        url = this.proappEnvOpentype == '/' ? `${child.menuTarget}#/${child.menuAction}` : `${child.menuTarget}#/${item.proappMenuCode}/${child.menuAction}`;
+        url = child.menuTarget.indexOf('http') == -1 ? this.secDomainName + url : url
+      }
+      location.href = url;
+    },
+  },
+};
+</script>
+<style rel="stylesheet" scoped>
+.menu-wrapper li.el-menu-item:hover {
+  background-color: #fff !important;
+}
+
+.menu-wrapper li.el-menu-item {
+  height: 38px;
+  line-height: 34px;
+  font-size: 12px;
+}
+</style>
+<style>
+.menu-wrapper {
+  font-size: 12px !important;
+}
+
+.el-submenu__title {
+  font-size: 12px !important;
+  height: 38px !important;
+  line-height: 38px !important;
+}
+
+.el-submenu__icon-arrow {
+  margin-top: -3px !important;
+}
+</style>

package/src/views/layout/components/Sidebar/index.vue

@@ -1,193 +1,203 @@
-<template>
-  <div style="background: rgb(234, 237, 241)">
-    <div class="app-title">{{ title }}</div>
-    <scroll-bar>
-      <el-menu mode="vertical" class="el-menu-vertical-demo" :default-active="isActive" background-color="#fff" @select="handleSelect" @open="handleOpen">
-        <sidebar-item :routes="routes" @getMenu="getMenu"></sidebar-item>
-      </el-menu>
-    </scroll-bar>
-  </div>
-</template>
-
-<script>
-import { mapGetters } from 'vuex';
-import SidebarItem from './SidebarItem';
-import ScrollBar from '#/components/ScrollBar';
-
-export default {
-  components: { SidebarItem, ScrollBar },
-  data() {
-    return {
-      title: null,
-      seconedTitle: null,
-      thirdTitle: null,
-      current: null,
-    };
-  },
-
-  mounted() {
-    this.getMenuList();
-  },
-  activated() {
-    this.getMenuList();
-  },
-
-  methods: {
-    getMenuList() {
-      let menuList = window.sessionStorage.getItem('menuList') ? JSON.parse(window.sessionStorage.getItem('menuList')).menuList : null,
-        code = window.sessionStorage.getItem('menuCode'),
-        secondMenuList = window.sessionStorage.getItem('menu') && JSON.parse(window.sessionStorage.getItem('menu'))[code];
-      menuList &&
-        menuList.forEach((el) => {
-          if (el.proappModelCode == code) {
-            this.title = el.menuName;
-          }
-        });
-      console.log(secondMenuList, 'menuName');
-      // 获取二级或者三级菜单
-      secondMenuList &&
-        secondMenuList.forEach((el) => {
-          if (!el.menuAction) {
-            el.children &&
-              el.children.forEach((res) => {
-                if (res.routechildren) {
-                  res.routechildren.map((val) => {
-                    if (val.menuAction == this.$route.path.replace('/', '')) {
-                      this.current = res;
-                      console.log(res, 'l++ll');
-                    }
-                  });
-                }
-                if (res.menuAction == this.$route.path.replace('/', '')) {
-                  this.seconedTitle = el.menuName;
-                  this.thirdTitle = res.menuName;
-                }
-              });
-          } else if (el.menuAction == this.$route.path.replace('/', '')) {
-            // this.current = el;
-            this.seconedTitle = el.menuName;
-            this.thirdTitle = null;
-          }
-        });
-      this.$emit('getFirstLevelMenu', this.title, this.seconedTitle, this.thirdTitle); // 获取一级菜单
-    },
-    handleSelect(key, keyPath) {
-      // console.log(key, keyPath, "default-openeds");
-    },
-    getMenu(second, third) {
-      this.seconedTitle = second;
-      this.thirdTitle = third;
-      this.$emit('getFirstLevelMenu', this.title, this.seconedTitle, this.thirdTitle); // 获取一级菜单
-    },
-    handleOpen(key, keyPath) {
-      console.log(key, keyPath, 'fggggggggggggggggggggggggg');
-    },
-    handleMenu(data) {
-      let menu = {};
-      data &&
-        data.forEach((el) => {
-          menu[el.proappModelCode] = el.children;
-        });
-      this.menuCode(data);
-      window.sessionStorage.setItem('menu', JSON.stringify(menu));
-    },
-    menuCode(data) {
-      if (!data || !data.length) {
-        return;
-      } else {
-        for (var i = 0; i < data.length; i++) {
-          if (data[i].menuCode == 'P0000111') {
-            window.sessionStorage.setItem('menuAction', data[i].menuAction);
-            return;
-          } else {
-            let childs = data[i].children;
-            if (childs && childs.length > 0) {
-              this.menuCode(childs);
-            }
-          }
-        }
-      }
-    },
-  },
-  computed: {
-    ...mapGetters(['appList']),
-    routes() {
-      console.log('开始执行', this.$route);
-      let menuCode = null;
-      if (this.$route.meta.menuCode) {
-        menuCode = this.$route.meta.menuCode;
-        window.sessionStorage.setItem('menuCode', menuCode);
-      } else {
-        try {
-          menuCode = JSON.parse(window.sessionStorage.getItem('menuCode'));
-        } catch (err) {
-          console.log('出错了' + err);
-          menuCode = window.sessionStorage.getItem('menuCode');
-        }
-      }
-      if (!window.sessionStorage.getItem('menu') || window.sessionStorage.getItem('menu') == '{}') {
-        let menuList = window.sessionStorage.getItem('menuList') ? JSON.parse(window.sessionStorage.getItem('menuList')).menuList : null;
-        if (menuList) {
-          this.handleMenu(menuList.menuList);
-        }
-      }
-      return window.sessionStorage.getItem('menu') ? JSON.parse(window.sessionStorage.getItem('menu'))[menuCode] : null;
-    },
-    isActive() {
-      this.getMenuList();
-      let current = this.$store.getters.currentMenu;
-      console.log(this.current, 'this.current');
-      if (!current && this.current) {
-        current = this.current;
-      }
-      console.log(current, 'current');
-      let path = this.$route.path;
-      if (current && Array.isArray(current.routechildren) && current.routechildren.length > 0) {
-        let arr = current.routechildren.map((res) => '/' + res.menuAction == this.$route.path);
-
-        if (arr && arr.length > 0) {
-          path = '/' + current.menuAction;
-        }
-      }
-
-      console.log(current, 'path');
-      console.log(path, 'path');
-      return path;
-    },
-  },
-  watch: {
-    $route: {
-      handler() {
-        let menuList = window.sessionStorage.getItem('menuList') ? JSON.parse(window.sessionStorage.getItem('menuList')).menuList : null,
-          code = window.sessionStorage.getItem('menuCode');
-        menuList &&
-          menuList.forEach((el) => {
-            if (el.proappModelCode == code) {
-              this.title = el.menuName;
-              console.log(this.title, 'this.title');
-            }
-          });
-      },
-    },
-  },
-};
-</script>
-<style rel="stylesheet/scss" lang="scss" scoped>
-.el-menu-vertical-demo {
-  padding-top: 42px;
-}
-.app-title {
-  height: 41px;
-  line-height: 42px;
-  // text-align: center;
-  text-indent: 20px;
-  color: #333;
-  font-weight: bold;
-  position: absolute;
-  width: 100%;
-  z-index: 1;
-  background: #fff;
-  font-size: 14px;
-  // border-bottom: solid 1px #e5e5e5;
-}
-</style>
+<template>
+  <div style="background: rgb(234, 237, 241)">
+    <div class="app-title">{{ title }}</div>
+    <scroll-bar>
+      <el-menu mode="vertical" class="el-menu-vertical-demo" :default-active="isActive" background-color="#fff"
+        @select="handleSelect" @open="handleOpen">
+        <sidebar-item :routes="routes" @getMenu="getMenu"></sidebar-item>
+      </el-menu>
+    </scroll-bar>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+import SidebarItem from './SidebarItem';
+import ScrollBar from '#/components/ScrollBar';
+
+export default {
+  components: { SidebarItem, ScrollBar },
+  data() {
+    return {
+      title: null,
+      seconedTitle: null,
+      thirdTitle: null,
+      current: null,
+    };
+  },
+
+  mounted() {
+    this.getMenuList();
+  },
+  activated() {
+    this.getMenuList();
+  },
+
+  methods: {
+    getMenuList() {
+      let menuList = window.sessionStorage.getItem('menuList') ? JSON.parse(window.sessionStorage.getItem('menuList')).menuList : null,
+        code = window.sessionStorage.getItem('menuCode'),
+        secondMenuList = window.sessionStorage.getItem('menu') && JSON.parse(window.sessionStorage.getItem('menu'))[code];
+      menuList &&
+        menuList.forEach((el) => {
+          if (el.proappModelCode == code) {
+            this.title = el.menuName;
+          }
+        });
+      console.log(secondMenuList, 'menuName');
+      // 获取二级或者三级菜单
+      secondMenuList &&
+        secondMenuList.forEach((el) => {
+          if (!el.menuAction) {
+            el.children &&
+              el.children.forEach((res) => {
+                if (res.routechildren) {
+                  res.routechildren.map((val) => {
+                    if (val.menuAction == this.$route.path.replace('/', '')) {
+                      this.current = res;
+                      console.log(res, 'l++ll');
+                    }
+                  });
+                }
+                if (res.menuAction == this.$route.path.replace('/', '')) {
+                  this.seconedTitle = el.menuName;
+                  this.thirdTitle = res.menuName;
+                }
+              });
+          } else if (el.menuAction == this.$route.path.replace('/', '')) {
+            // this.current = el;
+            this.seconedTitle = el.menuName;
+            this.thirdTitle = null;
+          }
+        });
+      this.$emit('getFirstLevelMenu', this.title, this.seconedTitle, this.thirdTitle); // 获取一级菜单
+    },
+    handleSelect(key, keyPath) {
+      // console.log(key, keyPath, "default-openeds");
+    },
+    getMenu(second, third) {
+      this.seconedTitle = second;
+      this.thirdTitle = third;
+      this.$emit('getFirstLevelMenu', this.title, this.seconedTitle, this.thirdTitle); // 获取一级菜单
+    },
+    handleOpen(key, keyPath) {
+      console.log(key, keyPath, 'fggggggggggggggggggggggggg');
+    },
+    handleMenu(data) {
+      let menu = {};
+      data &&
+        data.forEach((el) => {
+          menu[el.proappModelCode] = el.children;
+        });
+      this.menuCode(data);
+      window.sessionStorage.setItem('menu', JSON.stringify(menu));
+    },
+    menuCode(data) {
+      if (!data || !data.length) {
+        return;
+      } else {
+        for (var i = 0; i < data.length; i++) {
+          if (data[i].menuCode == 'P0000111') {
+            window.sessionStorage.setItem('menuAction', data[i].menuAction);
+            return;
+          } else {
+            let childs = data[i].children;
+            if (childs && childs.length > 0) {
+              this.menuCode(childs);
+            }
+          }
+        }
+      }
+    },
+  },
+  computed: {
+    ...mapGetters(['appList']),
+    routes() {
+      console.log('开始执行', this.$route);
+      let menuCode = null;
+      if (this.$route.meta.menuCode) {
+        menuCode = this.$route.meta.menuCode;
+        window.sessionStorage.setItem('menuCode', menuCode);
+      } else {
+        try {
+          menuCode = JSON.parse(window.sessionStorage.getItem('menuCode'));
+        } catch (err) {
+          console.log('出错了' + err);
+          menuCode = window.sessionStorage.getItem('menuCode');
+        }
+      }
+      if (!window.sessionStorage.getItem('menu') || window.sessionStorage.getItem('menu') == '{}') {
+        let menuList = window.sessionStorage.getItem('menuList') ? JSON.parse(window.sessionStorage.getItem('menuList')).menuList : null;
+        if (menuList) {
+          this.handleMenu(menuList.menuList);
+        }
+      }
+      return window.sessionStorage.getItem('menu') ? JSON.parse(window.sessionStorage.getItem('menu'))[menuCode] : null;
+    },
+    isActive() {
+      this.getMenuList();
+      let current = this.$store.getters.currentMenu;
+      console.log(this.current, 'this.current');
+      if (!current && this.current) {
+        current = this.current;
+      }
+      if (this.$route.path && this.$route.meta) {
+        if ('title' in this.$route.meta && 'icon' in this.$route.meta && 'menuCode' in this.$route.meta && 'params' in this.$route.meta) {
+          localStorage.setItem('showMenuAction', this.$route.path)
+        }
+      }
+
+
+      console.log(current, 'current');
+      let path = this.$route.path;
+      if (current && Array.isArray(current.routechildren) && current.routechildren.length > 0) {
+        let arr = current.routechildren.map((res) => '/' + res.menuAction == this.$route.path);
+
+        if (arr && arr.length > 0) {
+          path = '/' + current.menuAction;
+        }
+      }
+
+      console.log(current, 'path');
+      console.log(path, 'path');
+      path = localStorage.getItem('showMenuAction') ? localStorage.getItem('showMenuAction') : path
+      return path;
+    },
+  },
+  watch: {
+    $route: {
+      handler() {
+        let menuList = window.sessionStorage.getItem('menuList') ? JSON.parse(window.sessionStorage.getItem('menuList')).menuList : null,
+          code = window.sessionStorage.getItem('menuCode');
+        menuList &&
+          menuList.forEach((el) => {
+            if (el.proappModelCode == code) {
+              this.title = el.menuName;
+              console.log(this.title, 'this.title');
+            }
+          });
+      },
+    },
+  },
+};
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+.el-menu-vertical-demo {
+  padding-top: 42px;
+}
+
+.app-title {
+  height: 41px;
+  line-height: 42px;
+  // text-align: center;
+  text-indent: 20px;
+  color: #333;
+  font-weight: bold;
+  position: absolute;
+  width: 100%;
+  z-index: 1;
+  background: #fff;
+  font-size: 14px;
+  // border-bottom: solid 1px #e5e5e5;
+}
+</style>