qj-common 4.3.0 → 4.3.2

package/src/views/pc/default/leftMenu-modules/leftMenu-style4.vue

@@ -1,192 +1,192 @@
-<template>
-  <div class="left-menu-containers">
-    <div class="menu-vertical-demo menu-list clearfloat">
-      <!--<div class="tool-menu-top c-theme" @click="userHandler">会员中心</div>-->
-      <div class="app-scroll-container">
-        <ul class="menu-vertical">
-          <li v-for="(item, index) in leftMenuList" :key="index">
-            <div class="menu-list" v-if="item.menuTarget == 1 ? false : true">
-              <!--<div class="menu-group">{{item.menuName}}</div>-->
-              <div
-                v-for="(itemChild, indexChild) in item.children"
-                :key="indexChild"
-              >
-                <div
-                  class="menu-item"
-                  v-if="itemChild.menuTarget == 1 ? false : true"
-                  :class="[
-                    $route.path === `/${itemChild.menuAction}`
-                      ? 'bg-theme'
-                      : '',
-                  ]"
-                >
-                  <!-- item.menuTarget ==1 表示不显示 -->
-                  <a @click="_router(itemChild)">{{ itemChild.menuName }}</a>
-                </div>
-              </div>
-            </div>
-          </li>
-        </ul>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import { mapGetters } from 'vuex';
-import { getProappinfo } from '#/api/login';
-import ScrollBar from '#/components/ScrollBar';
-export default {
-  components: { ScrollBar },
-  props: {
-    leftMenuList: {
-      type: Array,
-      default: [],
-    },
-  },
-  data() {
-    return {
-      // logoImg: require("../assets/logo.png"),
-      indexHref: '/paas/index',
-      appActive: process.env.APP_PATH, // 当前点击的项目名称
-      maxMenuHeight: document.documentElement.clientHeight - 300,
-      menuArr: [],
-    };
-  },
-  computed: {
-    ...mapGetters(['appList', 'sidebar']),
-  },
-  mounted() {
-    document.querySelector('body').setAttribute('style', 'background:#fff');
-    this.getAppInfo();
-  },
-  methods: {
-    _router(item) {
-      if (location.href.indexOf('localhost') > -1) {
-        location.href = '#/' + item.menuAction;
-      } else {
-        location.href.indexOf(item.menuTarget) < 0
-          ? (location.href = item.menuTarget + '#/' + item.menuAction)
-          : this.$router.push(item.menuAction);
-      }
-      return false;
-    },
-    userHandler() {
-      location.href = '/paas/user-manager/index.html#/user';
-    },
-    getAppInfo() {
-      let imgLogo = JSON.parse(
-        window.sessionStorage.getItem('proappEnvLayout')
-      );
-      if (imgLogo) {
-        this.logoImg = imgLogo.proappEnvLogo;
-        this.indexHref = imgLogo.proappEnvIndexr;
-      } else {
-        getProappinfo().then((data) => {
-          console.log(data, 'data');
-          if (data) {
-            this.indexHref = data.proappEnvIndexr;
-            window.sessionStorage.setItem(
-              'proappEnvLayout',
-              JSON.stringify(data)
-            );
-            this.$store.commit('setProappEnvLayout', data);
-            this.logoImg = data.proappEnvLogo;
-          }
-        });
-      }
-    },
-  },
-  //watch:{
-  //	leftMenuList(newVal,oldVal){
-  //		console.log(newVal,'newVal')
-  //	}
-  //}
-};
-</script>
-
-<style rel="stylesheet" scoped>
-.left-menu-containers {
-  float: left;
-  margin-top: 30px;
-}
-.menu-vertical-demo {
-  /* position: absolute; */
-  width: 200px;
-  /* left: 0;
-  top: 0; */
-  /* bottom: 0; */
-  /* transition: width 0.43s; */
-  background: #fff;
-}
-.app-scroll-container {
-  /* border: 1px solid #d5d3d3;
-  border-top: 0 none;
-  border-radius: 0 0 5px 5px; */
-  /*overflow-y: auto;
-  overflow-x: hidden;*/
-}
-
-.menu-vertical {
-  width: 178px;
-  background: #fff;
-  border-right: none;
-  box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.1);
-  /*margin: 10px;
-  margin-top: 0;*/
-  border-radius: 10px;
-}
-.menu-vertical li .menu-list {
-  border-bottom: 1px solid #eeeeee;
-  padding: 13px 0;
-
-  margin: 0px 30px;
-}
-/* .el-menu-item-group__title .el-menu-item-group__title{
-  color: red;
-} */
-.menu-vertical .menu-group {
-  line-height: 40px;
-  color: #212121;
-  font-size: 16px;
-  margin-bottom: 5px;
-  position: relative;
-  text-indent: 2rem;
-}
-.menu-vertical .menu-group .icon {
-  left: 33px;
-  position: absolute;
-  color: #828282;
-}
-.menu-vertical .menu-item {
-  height: 40px;
-  line-height: 40px;
-  font-size: 16px;
-  font-weight: 500;
-  /*text-indent: 2rem;*/
-  text-align: center;
-  padding: 0 !important;
-  cursor: pointer;
-  /* text-indent: -10px; */
-  color: rgba(0, 0, 0, 0.6);
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  background-color: #e9edf0;
-  border-radius: 5px;
-  margin: 20px 0;
-}
-
-.tool-menu-top {
-  padding-top: 16px;
-  font-weight: bold;
-  font-size: 24px;
-  width: 100%;
-  text-align: center;
-  line-height: 60px;
-  cursor: pointer;
-}
-.menu-vertical li:last-child .menu-list {
-  border: none;
-}
-</style>
+<template>
+  <div class="left-menu-containers">
+    <div class="menu-vertical-demo menu-list clearfloat">
+      <!--<div class="tool-menu-top c-theme" @click="userHandler">会员中心</div>-->
+      <div class="app-scroll-container">
+        <ul class="menu-vertical">
+          <li v-for="(item, index) in leftMenuList" :key="index">
+            <div class="menu-list" v-if="item.menuTarget == 1 ? false : true">
+              <!--<div class="menu-group">{{item.menuName}}</div>-->
+              <div
+                v-for="(itemChild, indexChild) in item.children"
+                :key="indexChild"
+              >
+                <div
+                  class="menu-item"
+                  v-if="itemChild.menuTarget == 1 ? false : true"
+                  :class="[
+                    $route.path === `/${itemChild.menuAction}`
+                      ? 'bg-theme'
+                      : '',
+                  ]"
+                >
+                  <!-- item.menuTarget ==1 表示不显示 -->
+                  <a @click="_router(itemChild)">{{ itemChild.menuName }}</a>
+                </div>
+              </div>
+            </div>
+          </li>
+        </ul>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+import { getProappinfo } from '#/api/login';
+import ScrollBar from '#/components/ScrollBar';
+export default {
+  components: { ScrollBar },
+  props: {
+    leftMenuList: {
+      type: Array,
+      default: [],
+    },
+  },
+  data() {
+    return {
+      // logoImg: require("../assets/logo.png"),
+      indexHref: '/paas/index',
+      appActive: process.env.APP_PATH, // 当前点击的项目名称
+      maxMenuHeight: document.documentElement.clientHeight - 300,
+      menuArr: [],
+    };
+  },
+  computed: {
+    ...mapGetters(['appList', 'sidebar']),
+  },
+  mounted() {
+    document.querySelector('body').setAttribute('style', 'background:#fff');
+    this.getAppInfo();
+  },
+  methods: {
+    _router(item) {
+      if (location.href.indexOf('localhost') > -1) {
+        location.href = '#/' + item.menuAction;
+      } else {
+        location.href.indexOf(item.menuTarget) < 0
+          ? (location.href = item.menuTarget + '#/' + item.menuAction)
+          : this.$router.push(item.menuAction);
+      }
+      return false;
+    },
+    userHandler() {
+      location.href = '/paas/user-manager/index.html#/user';
+    },
+    getAppInfo() {
+      let imgLogo = JSON.parse(
+        window.sessionStorage.getItem('proappEnvLayout')
+      );
+      if (imgLogo) {
+        this.logoImg = imgLogo.proappEnvLogo;
+        this.indexHref = imgLogo.proappEnvIndexr;
+      } else {
+        getProappinfo().then((data) => {
+          console.log(data, 'data');
+          if (data) {
+            this.indexHref = data.proappEnvIndexr;
+            window.sessionStorage.setItem(
+              'proappEnvLayout',
+              JSON.stringify(data)
+            );
+            this.$store.commit('setProappEnvLayout', data);
+            this.logoImg = data.proappEnvLogo;
+          }
+        });
+      }
+    },
+  },
+  //watch:{
+  //	leftMenuList(newVal,oldVal){
+  //		console.log(newVal,'newVal')
+  //	}
+  //}
+};
+</script>
+
+<style rel="stylesheet" scoped>
+.left-menu-containers {
+  float: left;
+  margin-top: 30px;
+}
+.menu-vertical-demo {
+  /* position: absolute; */
+  width: 200px;
+  /* left: 0;
+  top: 0; */
+  /* bottom: 0; */
+  /* transition: width 0.43s; */
+  background: #fff;
+}
+.app-scroll-container {
+  /* border: 1px solid #d5d3d3;
+  border-top: 0 none;
+  border-radius: 0 0 5px 5px; */
+  /*overflow-y: auto;
+  overflow-x: hidden;*/
+}
+
+.menu-vertical {
+  width: 178px;
+  background: #fff;
+  border-right: none;
+  box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.1);
+  /*margin: 10px;
+  margin-top: 0;*/
+  border-radius: 10px;
+}
+.menu-vertical li .menu-list {
+  border-bottom: 1px solid #eeeeee;
+  padding: 13px 0;
+
+  margin: 0px 30px;
+}
+/* .el-menu-item-group__title .el-menu-item-group__title{
+  color: red;
+} */
+.menu-vertical .menu-group {
+  line-height: 40px;
+  color: #212121;
+  font-size: 16px;
+  margin-bottom: 5px;
+  position: relative;
+  text-indent: 2rem;
+}
+.menu-vertical .menu-group .icon {
+  left: 33px;
+  position: absolute;
+  color: #828282;
+}
+.menu-vertical .menu-item {
+  height: 40px;
+  line-height: 40px;
+  font-size: 16px;
+  font-weight: 500;
+  /*text-indent: 2rem;*/
+  text-align: center;
+  padding: 0 !important;
+  cursor: pointer;
+  /* text-indent: -10px; */
+  color: rgba(0, 0, 0, 0.6);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  background-color: #e9edf0;
+  border-radius: 5px;
+  margin: 20px 0;
+}
+
+.tool-menu-top {
+  padding-top: 16px;
+  font-weight: bold;
+  font-size: 24px;
+  width: 100%;
+  text-align: center;
+  line-height: 60px;
+  cursor: pointer;
+}
+.menu-vertical li:last-child .menu-list {
+  border: none;
+}
+</style>