2022-12-12

src/config/settings.js

@@ -32,7 +32,7 @@ const aliUpSetting = {
 // const Url = process.env.NODE_ENV === "development" ? apiUrl.dev : apiUrl.master;
 const Url = apiUrl.master;
 module.exports = {
-  // 是否是千鸟云商标准系统
+  // 是否是六牛科技标准系统
   isQN: true,
   //默认的接口地址 如果是开发环境和生产环境走dev
   apiUrl: Url,
@@ -54,13 +54,13 @@ module.exports = {
   //进行编译的依赖
   transpileDependencies: ["vue-echarts", "resize-detector"],
   //标题 （包括初次加载雪花屏的标题 页面的标题 浏览器的标题）
-  title: "千鸟云商",
+  title: "六牛科技",
   //标题分隔符
   titleSeparator: " - ",
   //标题是否反转 如果为false:"page - title"，如果为ture:"title - page"
   titleReverse: false,
   //简写
-  abbreviation: "千鸟云商",
+  abbreviation: "六牛科技",
   //语言类型zh、en
   i18n: "zh",
   //开发环境端口号

src/layouts/index.vue

@@ -1,441 +1,406 @@
 <template>
-  <div
-    :class="classObj"
-    class="vue-admin-beautiful-wrapper"
-    @click="wrapperClick"
-  >
-    <!-- 横向布局 -->
-    <div
-      v-if="'horizontal' === layout"
-      :class="{
+	<div :class="classObj" class="vue-admin-beautiful-wrapper" @click="wrapperClick">
+		<!-- 横向布局 -->
+		<div v-if="'horizontal' === layout" :class="{
         fixed: header === 'fixed',
         'no-tags-bar': !showTagsBar,
-      }"
-      class="layout-container-horizontal"
-    >
-      <div
-        :class="header === 'fixed' ? 'fixed-header' : ''"
-        class="layout-header"
-      >
-        <top-bar></top-bar>
-        <div v-if="showTagsBar" :class="{ 'tag-bar-horizontal': showTagsBar }">
-          <div class="vab-main">
-            <tags-bar></tags-bar>
-          </div>
-        </div>
-      </div>
-      <div class="vab-main main-padding">
-        <app-main></app-main>
-      </div>
-    </div>
-    <!-- 纵向布局 -->
-    <div
-      v-else-if="'vertical' === layout"
-      :class="{
+      }" class="layout-container-horizontal">
+			<div :class="header === 'fixed' ? 'fixed-header' : ''" class="layout-header">
+				<top-bar></top-bar>
+				<div v-if="showTagsBar" :class="{ 'tag-bar-horizontal': showTagsBar }">
+					<div class="vab-main">
+						<tags-bar></tags-bar>
+					</div>
+				</div>
+			</div>
+			<div class="vab-main main-padding">
+				<app-main></app-main>
+			</div>
+		</div>
+		<!-- 纵向布局 -->
+		<div v-else-if="'vertical' === layout" :class="{
         fixed: header === 'fixed',
         'no-tags-bar': !showTagsBar,
-      }"
-      class="layout-container-vertical"
-    >
-      <div
-        v-if="device === 'mobile' && !collapse"
-        class="mask"
-        @click="handleFoldSideBar"
-      ></div>
-      <side-bar></side-bar>
-      <div :class="collapse ? 'is-collapse-main' : ''" class="vab-main">
-        <div
-          :class="header === 'fixed' ? 'fixed-header' : ''"
-          class="layout-header"
-        >
-          <nav-bar></nav-bar>
-          <tags-bar v-if="showTagsBar" />
-        </div>
-        <app-main></app-main>
-      </div>
-    </div>
-    <!--画廊布局 -->
-    <div
-      v-else-if="'gallery' === layout"
-      :class="{
+      }" class="layout-container-vertical">
+			<div v-if="device === 'mobile' && !collapse" class="mask" @click="handleFoldSideBar"></div>
+			<side-bar></side-bar>
+			<div :class="collapse ? 'is-collapse-main' : ''" class="vab-main">
+				<div :class="header === 'fixed' ? 'fixed-header' : ''" class="layout-header">
+					<nav-bar></nav-bar>
+					<tags-bar v-if="showTagsBar" />
+				</div>
+				<app-main></app-main>
+			</div>
+		</div>
+		<!--画廊布局 -->
+		<div v-else-if="'gallery' === layout" :class="{
         fixed: header === 'fixed',
         'no-tags-bar': !showTagsBar,
-      }"
-      class="layout-container-gallery"
-    >
-      <gallery-bar></gallery-bar>
-      <div :class="collapse ? 'is-collapse-main' : ''" class="vab-main">
-        <!--      <div class="vab-main is-collapse-main">-->
-        <div
-          :class="header === 'fixed' ? 'fixed-header' : ''"
-          class="layout-header"
-        >
-          <nav-bar></nav-bar>
-          <tags-bar v-if="showTagsBar" />
-        </div>
-        <app-main></app-main>
-      </div>
-    </div>
-    <!--综合布局 -->
-    <div
-      v-else-if="'comprehensive' === layout"
-      :class="{
+      }" class="layout-container-gallery">
+			<gallery-bar></gallery-bar>
+			<div :class="collapse ? 'is-collapse-main' : ''" class="vab-main">
+				<div :class="header === 'fixed' ? 'fixed-header' : ''" class="layout-header">
+					<nav-bar></nav-bar>
+					<tags-bar v-if="showTagsBar" />
+				</div>
+				<app-main></app-main>
+			</div>
+		</div>
+		<!--综合布局 -->
+		<div v-else-if="'comprehensive' === layout" :class="{
         fixed: header === 'fixed',
         'no-tags-bar': !showTagsBar,
-      }"
-      class="layout-container-comprehensive"
-    >
-      <comprehensive-bar></comprehensive-bar>
-      <div :class="collapse ? 'is-collapse-main' : ''" class="vab-main">
-        <div
-          :class="header === 'fixed' ? 'fixed-header' : ''"
-          class="layout-header"
-        >
-          <nav-bar layout="comprehensive"></nav-bar>
-          <tags-bar v-if="showTagsBar" />
-        </div>
-        <app-main></app-main>
-      </div>
-    </div>
-    <!--常规布局 -->
-    <div
-      v-else-if="'common' === layout"
-      :class="{
+      }" class="layout-container-comprehensive">
+			<comprehensive-bar></comprehensive-bar>
+			<div :class="collapse ? 'is-collapse-main' : ''" class="vab-main">
+				<div :class="header === 'fixed' ? 'fixed-header' : ''" class="layout-header">
+					<nav-bar layout="comprehensive"></nav-bar>
+					<tags-bar v-if="showTagsBar" />
+				</div>
+				<app-main></app-main>
+			</div>
+		</div>
+		<!--常规布局 -->
+		<div v-else-if="'common' === layout" :class="{
         fixed: header === 'fixed',
         'no-tags-bar': !showTagsBar,
-      }"
-      class="layout-container-common"
-    >
-      <div
-        :class="header === 'fixed' ? 'fixed-header' : ''"
-        class="layout-header"
-      >
-        <top-bar layout="common"></top-bar>
-        <div v-if="showTagsBar">
-          <side-bar layout="common"></side-bar>
-          <div :class="collapse ? 'is-collapse-main' : ''" class="vab-main">
-            <tags-bar layout="common"></tags-bar>
-          </div>
-        </div>
-      </div>
-      <div
-        :class="collapse ? 'is-collapse-main' : ''"
-        class="vab-main main-padding"
-      >
-        <app-main></app-main>
-      </div>
-    </div>
-    <el-backtop></el-backtop>
-  </div>
+      }" class="layout-container-common">
+			<div :class="header === 'fixed' ? 'fixed-header' : ''" class="layout-header">
+				<top-bar layout="common"></top-bar>
+				<div v-if="showTagsBar">
+					<side-bar layout="common"></side-bar>
+					<div :class="collapse ? 'is-collapse-main' : ''" class="vab-main">
+						<tags-bar layout="common"></tags-bar>
+					</div>
+				</div>
+			</div>
+			<div :class="collapse ? 'is-collapse-main' : ''" class="vab-main main-padding">
+				<app-main></app-main>
+			</div>
+		</div>
+		<el-backtop></el-backtop>
+	</div>
 </template>
 
 <script>
-  import { mapActions, mapGetters } from "vuex";
-  import { tokenName } from "@/config/settings";
-  import { getBasicSetup } from "@/api/System";
-  import { getDataFieldRadio } from "@/access/check";
-  export default {
-    name: "Layout",
-    data() {
-      return {
-        oldLayout: "",
-        width: 0,
-        playAudio: true,
-      };
-    },
-    computed: {
-      ...mapGetters({
-        layout: "settings/layout",
-        showTagsBar: "settings/showTagsBar",
-        collapse: "settings/collapse",
-        header: "settings/header",
-        device: "settings/device",
-      }),
-      classObj() {
-        return {
-          mobile: this.device === "mobile",
-        };
-      },
-    },
-    beforeMount() {
-      window.addEventListener("resize", this.handleLayouts);
-    },
-    beforeDestroy() {
-      window.removeEventListener("resize", this.handleLayouts);
-    },
-    mounted() {
-      this.oldLayout = this.layout;
-      this.handleLayouts();
-
-      this.$nextTick(() => {
-        window.addEventListener(
-          "storage",
-          (e) => {
-            if (e.key === tokenName || e.key === null) window.location.reload();
-            if (e.key === tokenName && e.value === null)
-              window.location.reload();
-          },
-          false
-        );
-      });
-      // 获取详情设置详情
-      this.getBasicSetup();
-      // 如果有出库单权限或者有新订单权限加语音提示
-      if (this.systemType === 1) {
-        if (
-          this.$accessCheck(this.$Access.newOrderList) ||
-          this.$accessCheck(this.$Access.InventoryOut)
-        ) {
-          const message = "听不到订单提示语音，请进行以下操作";
-          const title =
-            "1，请检查电脑音响是否开启，音量是否设置为静音；<br>2，请检查【设置-语音配置】是否开启订单提醒！<p style='color: #E6A23C'>确认以上操作后，下一笔新订单即可听到语音播报</p>";
-          this.$baseNotify(
-            title,
-            message,
-            "warning",
-            "bottom-right",
-            5000,
-            true
-          );
-        }
-      }
-    },
-    methods: {
-      ...mapActions({
-        handleOpenSideBar: "settings/openSideBar",
-        handleFoldSideBar: "settings/foldSideBar",
-        handleChangeLayout: "settings/changeLayout",
-        handleToggleDevice: "settings/toggleDevice",
-        changePrintTag: "MUser/changePrintTag",
-        changeSalePriceTimes: "MUser/changeSalePriceTimes",
-        changeEnableLocationManagement: "MUser/changeEnableLocationManagement",
-        changeBaseSetting: "MUser/changeBaseSetting",
-      }),
-      handleLayouts() {
-        const width = document.body.getBoundingClientRect().width;
-        if (this.width !== width) {
-          const isMobile = width - 1 < 992;
-          this.handleChangeLayout(isMobile ? "vertical" : this.oldLayout);
-          this.handleToggleDevice(isMobile ? "mobile" : "desktop");
-          this.width = width;
-        }
-      },
-      wrapperClick() {
-        let audio = document.getElementById("orderTip");
-        if (audio !== null && this.playAudio) {
-          audio.pause();
-          this.playAudio = false;
-        }
-      },
-      //  获取设置详情
-      async getBasicSetup() {
-        const { data } = await getBasicSetup();
-        if (data.basicData) {
-          this.changePrintTag(data.basicData.printTag || 4);
-          this.changeSalePriceTimes(data.basicData.salePriceTimes || 1.2);
-          this.changeEnableLocationManagement(
-            data.basicData.enableLocationManagement || 4
-          );
-          this.changeBaseSetting(data.basicData);
-        } else {
-          this.changePrintTag(4);
-          this.changeSalePriceTimes(1.2);
-          this.changeEnableLocationManagement(4);
-          this.changeBaseSetting({});
-        }
-      },
-    },
-  };
+	import {
+		mapActions,
+		mapGetters
+	} from "vuex";
+	import {
+		tokenName
+	} from "@/config/settings";
+	import {
+		getBasicSetup
+	} from "@/api/System";
+	import {
+		getDataFieldRadio
+	} from "@/access/check";
+	export default {
+		name: "Layout",
+		data() {
+			return {
+				oldLayout: "",
+				width: 0,
+				playAudio: true,
+			};
+		},
+		computed: {
+			...mapGetters({
+				layout: "settings/layout",
+				showTagsBar: "settings/showTagsBar",
+				collapse: "settings/collapse",
+				header: "settings/header",
+				device: "settings/device",
+			}),
+			classObj() {
+				return {
+					mobile: this.device === "mobile",
+				};
+			},
+		},
+		beforeMount() {
+			window.addEventListener("resize", this.handleLayouts);
+		},
+		beforeDestroy() {
+			window.removeEventListener("resize", this.handleLayouts);
+		},
+		mounted() {
+			this.oldLayout = this.layout;
+			this.handleLayouts();
+			this.$nextTick(() => {
+				window.addEventListener(
+					"storage",
+					(e) => {
+						if (e.key === tokenName || e.key === null) window.location.reload();
+						if (e.key === tokenName && e.value === null)
+							window.location.reload();
+					},
+					false
+				);
+			});
+			// 获取详情设置详情
+			this.getBasicSetup();
+			// 如果有出库单权限或者有新订单权限加语音提示
+			if (this.systemType === 1) {
+				if (
+					this.$accessCheck(this.$Access.newOrderList) ||
+					this.$accessCheck(this.$Access.InventoryOut)
+				) {
+					const message = "听不到订单提示语音，请进行以下操作";
+					const title =
+						"1，请检查电脑音响是否开启，音量是否设置为静音；<br>2，请检查【设置-语音配置】是否开启订单提醒！<p style='color: #E6A23C'>确认以上操作后，下一笔新订单即可听到语音播报</p>";
+					this.$baseNotify(
+						title,
+						message,
+						"warning",
+						"bottom-right",
+						5000,
+						true
+					);
+				}
+			}
+		},
+		methods: {
+			...mapActions({
+				handleOpenSideBar: "settings/openSideBar",
+				handleFoldSideBar: "settings/foldSideBar",
+				handleChangeLayout: "settings/changeLayout",
+				handleToggleDevice: "settings/toggleDevice",
+				changePrintTag: "MUser/changePrintTag",
+				changeSalePriceTimes: "MUser/changeSalePriceTimes",
+				changeEnableLocationManagement: "MUser/changeEnableLocationManagement",
+				changeBaseSetting: "MUser/changeBaseSetting",
+			}),
+			handleLayouts() {
+				const width = document.body.getBoundingClientRect().width;
+				if (this.width !== width) {
+					const isMobile = width - 1 < 992;
+					this.handleChangeLayout(isMobile ? "vertical" : this.oldLayout);
+					this.handleToggleDevice(isMobile ? "mobile" : "desktop");
+					this.width = width;
+				}
+			},
+			wrapperClick() {
+				let audio = document.getElementById("orderTip");
+				if (audio !== null && this.playAudio) {
+					audio.pause();
+					this.playAudio = false;
+				}
+			},
+			//  获取设置详情
+			async getBasicSetup() {
+				const {
+					data
+				} = await getBasicSetup();
+				if (data.basicData) {
+					this.changePrintTag(data.basicData.printTag || 4);
+					this.changeSalePriceTimes(data.basicData.salePriceTimes || 1.2);
+					this.changeEnableLocationManagement(
+						data.basicData.enableLocationManagement || 4
+					);
+					this.changeBaseSetting(data.basicData);
+				} else {
+					this.changePrintTag(4);
+					this.changeSalePriceTimes(1.2);
+					this.changeEnableLocationManagement(4);
+					this.changeBaseSetting({});
+				}
+			},
+		},
+	};
 </script>
 
 <style lang="scss" scoped>
-  @mixin fix-header {
-    position: fixed;
-    top: 0;
-    right: 0;
-    left: 0;
-    z-index: $base-z-index - 2;
-    width: 100%;
-    overflow: hidden;
-    transition: $base-transition;
-  }
-
-  .vue-admin-beautiful-wrapper {
-    position: relative;
-    width: 100%;
-    height: 100%;
-    color: #2c3e50;
-    .layout-header {
-      box-shadow: $base-box-shadow;
-    }
-
-    .layout-container-horizontal,
-    .layout-container-common {
-      position: relative;
-
-      &.fixed {
-        padding-top: calc(#{$base-top-bar-height} + #{$base-tags-bar-height});
-      }
-
-      &.fixed.no-tags-bar {
-        padding-top: $base-top-bar-height;
-      }
-
-      ::v-deep {
-        .vab-main {
-          width: 88%;
-          margin: auto;
-        }
-
-        .fixed-header {
-          @include fix-header;
-        }
-
-        .tag-bar-horizontal {
-          background: $base-color-white;
-          box-shadow: $base-box-shadow;
-        }
-
-        .nav-bar-container {
-          .fold-unfold {
-            display: none;
-          }
-        }
-
-        .main-padding {
-          .app-main-container {
-            margin-top: $base-padding;
-            margin-bottom: $base-padding;
-            background: $base-color-white;
-          }
-        }
-      }
-    }
-
-    .layout-container-common {
-      ::v-deep {
-        .top-bar-container {
-          .vab-main {
-            width: 100%;
-            margin: auto $base-padding;
-          }
-        }
-      }
-    }
-
-    .layout-container-horizontal {
-      ::v-deep {
-        .tags-bar-container {
-          padding-right: 0;
-          padding-left: 0;
-        }
-      }
-    }
-
-    .layout-container-vertical,
-    .layout-container-comprehensive,
-    .layout-container-gallery,
-    .layout-container-common {
-      position: relative;
-
-      .mask {
-        position: fixed;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        left: 0;
-        z-index: $base-z-index - 1;
-        width: 100%;
-        height: 100vh;
-        overflow: hidden;
-        background: #000;
-        opacity: 0.5;
-      }
-
-      &.fixed {
-        padding-top: calc(#{$base-nav-bar-height} + #{$base-tags-bar-height});
-      }
-
-      &.fixed.no-tags-bar {
-        padding-top: $base-nav-bar-height;
-      }
-
-      .vab-main {
-        position: relative;
-        width: auto;
-        min-height: 100%;
-        margin-left: $base-left-menu-width;
-        background: #f6f8f9;
-        transition: $base-transition;
-
-        ::v-deep {
-          .fixed-header {
-            @include fix-header;
-
-            left: $base-left-menu-width;
-            width: $base-right-content-width;
-          }
-
-          .nav-bar-container {
-            position: relative;
-            box-sizing: border-box;
-          }
-
-          .tags-bar-container {
-            box-sizing: border-box;
-          }
-
-          .app-main-container {
-            /*width: calc(100% - #{$base-padding} - #{$base-padding});*/
-            width: calc(100% - #{$base-padding} - 14px);
-            /*margin: $base-padding auto;*/
-            margin: 16px auto;
-            /*background: $base-color-white;*/
-            border-radius: $base-border-radius;
-          }
-        }
-
-        &.is-collapse-main {
-          margin-left: $base-left-menu-width-min;
-
-          ::v-deep {
-            .fixed-header {
-              left: $base-left-menu-width-min;
-              width: calc(100% - 65px);
-            }
-          }
-        }
-      }
-    }
-
-    /* 手机端开始 */
-    &.mobile {
-      ::v-deep {
-        .el-pager,
-        .el-pagination__jump {
-          display: none;
-        }
-
-        .layout-container-vertical {
-          .el-scrollbar.side-bar-container.is-collapse {
-            width: 0;
-          }
-
-          .vab-main {
-            width: 100%;
-            margin-left: 0;
-          }
-        }
-
-        .vab-main {
-          .fixed-header {
-            left: 0 !important;
-            width: 100% !important;
-          }
-        }
-      }
-    }
-
-    /* 手机端结束 */
-  }
+	@mixin fix-header {
+		position: fixed;
+		top: 0;
+		right: 0;
+		left: 0;
+		z-index: $base-z-index - 2;
+		width: 100%;
+		overflow: hidden;
+		transition: $base-transition;
+	}
+
+	.vue-admin-beautiful-wrapper {
+		position: relative;
+		width: 100%;
+		height: 100%;
+		color: #2c3e50;
+
+		.layout-header {
+			box-shadow: $base-box-shadow;
+		}
+
+		.layout-container-horizontal,
+		.layout-container-common {
+			position: relative;
+
+			&.fixed {
+				padding-top: calc(#{$base-top-bar-height} + #{$base-tags-bar-height});
+			}
+
+			&.fixed.no-tags-bar {
+				padding-top: $base-top-bar-height;
+			}
+
+			::v-deep {
+				.vab-main {
+					width: 88%;
+					margin: auto;
+				}
+
+				.fixed-header {
+					@include fix-header;
+				}
+
+				.tag-bar-horizontal {
+					background: $base-color-white;
+					box-shadow: $base-box-shadow;
+				}
+
+				.nav-bar-container {
+					.fold-unfold {
+						display: none;
+					}
+				}
+
+				.main-padding {
+					.app-main-container {
+						margin-top: $base-padding;
+						margin-bottom: $base-padding;
+						background: $base-color-white;
+					}
+				}
+			}
+		}
+
+		.layout-container-common {
+			::v-deep {
+				.top-bar-container {
+					.vab-main {
+						width: 100%;
+						margin: auto $base-padding;
+					}
+				}
+			}
+		}
+
+		.layout-container-horizontal {
+			::v-deep {
+				.tags-bar-container {
+					padding-right: 0;
+					padding-left: 0;
+				}
+			}
+		}
+
+		.layout-container-vertical,
+		.layout-container-comprehensive,
+		.layout-container-gallery,
+		.layout-container-common {
+			position: relative;
+
+			.mask {
+				position: fixed;
+				top: 0;
+				right: 0;
+				bottom: 0;
+				left: 0;
+				z-index: $base-z-index - 1;
+				width: 100%;
+				height: 100vh;
+				overflow: hidden;
+				background: #000;
+				opacity: 0.5;
+			}
+
+			&.fixed {
+				padding-top: calc(#{$base-nav-bar-height} + #{$base-tags-bar-height});
+			}
+
+			&.fixed.no-tags-bar {
+				padding-top: $base-nav-bar-height;
+			}
+
+			.vab-main {
+				position: relative;
+				width: auto;
+				min-height: 100%;
+				margin-left: $base-left-menu-width;
+				background: #f6f8f9;
+				transition: $base-transition;
+
+				::v-deep {
+					.fixed-header {
+						@include fix-header;
+
+						left: $base-left-menu-width;
+						width: $base-right-content-width;
+					}
+
+					.nav-bar-container {
+						position: relative;
+						box-sizing: border-box;
+					}
+
+					.tags-bar-container {
+						box-sizing: border-box;
+					}
+
+					.app-main-container {
+						/*width: calc(100% - #{$base-padding} - #{$base-padding});*/
+						width: calc(100% - #{$base-padding} - 14px);
+						/*margin: $base-padding auto;*/
+						margin: 16px auto;
+						/*background: $base-color-white;*/
+						border-radius: $base-border-radius;
+					}
+				}
+
+				&.is-collapse-main {
+					margin-left: $base-left-menu-width-min;
+
+					::v-deep {
+						.fixed-header {
+							left: $base-left-menu-width-min;
+							width: calc(100% - 65px);
+						}
+					}
+				}
+			}
+		}
+
+		/* 手机端开始 */
+		&.mobile {
+			::v-deep {
+
+				.el-pager,
+				.el-pagination__jump {
+					display: none;
+				}
+
+				.layout-container-vertical {
+					.el-scrollbar.side-bar-container.is-collapse {
+						width: 0;
+					}
+
+					.vab-main {
+						width: 100%;
+						margin-left: 0;
+					}
+				}
+
+				.vab-main {
+					.fixed-header {
+						left: 0 !important;
+						width: 100% !important;
+					}
+				}
+			}
+		}
+
+		/* 手机端结束 */
+	}
 </style>

src/vab/components/GalleryBar/index.vue

@@ -1,344 +1,325 @@
 <template>
-  <el-scrollbar
-    :class="{ 'is-collapse': collapse }"
-    class="gallery-bar-container"
-  >
-    <logo></logo>
-    <el-tabs
-      v-model="firstMenu"
-      tab-position="left"
-      @tab-click="handleTabClick"
-    >
-      <el-tab-pane
-        v-for="item in handleRoutes"
-        :key="item.path"
-        :name="item.path"
-      >
-        <div
-          v-if="!appMenus.includes(item.meta.title)"
-          slot="label"
-          :title="item.meta.title"
-          class="gallery-grid"
-        >
-          <el-popover v-if="collapse" placement="right" trigger="hover">
-            <div class="menu-box">
-              <div
-                v-for="(route, index) in item.children"
-                :key="index"
-                class="menu-col"
-              >
-                <p>{{ route.meta.title }}</p>
-                <ul
-                  v-if="route.children && route.children.length"
-                  class="menu-ul"
-                >
-                  <li
-                    v-for="(menu, indexT) in route.children"
-                    :key="indexT"
-                    class="menu-li"
-                    @click="menuClick(menu)"
-                  >
-                    {{ menu.meta.title }}
-                  </li>
-                </ul>
-                <ul v-else class="menu-ul">
-                  <li class="menu-li" @click="menuClick(route)">
-                    {{ route.meta.title }}
-                  </li>
-                </ul>
-              </div>
-            </div>
-            <div slot="reference">
-              <vab-remix-icon
-                v-if="item.meta.remixIcon"
-                :icon-class="item.meta.remixIcon"
-                :is-svg="item.meta.isCustomSvgIcon"
-                class="vab-remix-icon"
-              />
-              {{ item.meta.title }}
-            </div>
-          </el-popover>
-          <div v-else>
-            <vab-remix-icon
-              v-if="item.meta.remixIcon"
-              :icon-class="item.meta.remixIcon"
-              :is-svg="item.meta.isCustomSvgIcon"
-              class="vab-remix-icon"
-            />
-            {{ item.meta.title }}
-          </div>
-        </div>
-      </el-tab-pane>
-    </el-tabs>
-    <el-menu
-      :background-color="variables['gallery-second-menu-background']"
-      :default-active="activeMenu"
-      :default-openeds="defaultOpens"
-      :unique-opened="uniqueOpened"
-      mode="vertical"
-    >
-      <vab-menu
-        v-for="route in partialRoutes"
-        :key="route.fullPath"
-        :item="route"
-      ></vab-menu>
-    </el-menu>
-  </el-scrollbar>
+	<el-scrollbar :class="{ 'is-collapse': collapse }" class="gallery-bar-container">
+		<logo></logo>
+		<el-tabs v-model="firstMenu" tab-position="left" @tab-click="handleTabClick">
+			<el-tab-pane v-for="item in handleRoutes" :key="item.path" :name="item.path">
+				<div v-if="!appMenus.includes(item.meta.title)" slot="label" :title="item.meta.title"
+					class="gallery-grid">
+					<el-popover v-if="collapse" placement="right" trigger="hover">
+						<div class="menu-box">
+							<div v-for="(route, index) in item.children" :key="index" class="menu-col">
+								<p>{{ route.meta.title }}</p>
+								<ul v-if="route.children && route.children.length" class="menu-ul">
+									<li v-for="(menu, indexT) in route.children" :key="indexT" class="menu-li"
+										@click="menuClick(menu)">
+										{{ menu.meta.title }}
+									</li>
+								</ul>
+								<ul v-else class="menu-ul">
+									<li class="menu-li" @click="menuClick(route)">
+										{{ route.meta.title }}
+									</li>
+								</ul>
+							</div>
+						</div>
+						<div slot="reference">
+							<vab-remix-icon v-if="item.meta.remixIcon" :icon-class="item.meta.remixIcon"
+								:is-svg="item.meta.isCustomSvgIcon" class="vab-remix-icon" />
+							{{ item.meta.title }}
+						</div>
+					</el-popover>
+					<div v-else>
+						<vab-remix-icon v-if="item.meta.remixIcon" :icon-class="item.meta.remixIcon"
+							:is-svg="item.meta.isCustomSvgIcon" class="vab-remix-icon" />
+						{{ item.meta.title }}
+					</div>
+				</div>
+			</el-tab-pane>
+		</el-tabs>
+		<el-menu :background-color="variables['gallery-second-menu-background']" :default-active="activeMenu"
+			:default-openeds="defaultOpens" :unique-opened="uniqueOpened" mode="vertical">
+			<vab-menu v-for="route in partialRoutes" :key="route.fullPath" :item="route"></vab-menu>
+		</el-menu>
+	</el-scrollbar>
 </template>
 <script>
-  import { handleFirstMenu, handleHeadMenu } from "@/utils/routes";
-  import variables from "@/config/variables.scss";
-  import { mapGetters } from "vuex";
-  import { menus } from "./menus";
-  import { storeMenus } from "./storeMenus";
-  import { merchMenus } from "./merchMenus";
-  import {
-    defaultOpeneds,
-    openFirstMenu,
-    uniqueOpened,
-  } from "@/config/settings";
-  export default {
-    name: "GalleryBar",
-    data() {
-      return {
-        uniqueOpened,
-        firstMenu: "",
-        defaultOpens: defaultOpeneds,
-        variables: variables,
-        appMenus: [
-          "单据模版",
-          "分销",
-          "营销",
-          "收银台",
-          "多商户",
-          "多门店",
-          "供应商管理端",
-          "钱货日清对账",
-          "积分商城",
-          "销售提成",
-          "设置",
-          "商城",
-        ],
-      };
-    },
-    computed: {
-      ...mapGetters({
-        collapse: "settings/collapse",
-        routes: "routes/routes",
-        partialRoutes: "routes/partialRoutes",
-        // 区分后台类型，1-总后台，2-多门店，3-多商户
-        systemType: "MUser/systemType",
-      }),
+	import {
+		handleFirstMenu,
+		handleHeadMenu
+	} from "@/utils/routes";
+	import variables from "@/config/variables.scss";
+	import {
+		mapGetters
+	} from "vuex";
+	import {
+		menus
+	} from "./menus";
+	import {
+		storeMenus
+	} from "./storeMenus";
+	import {
+		merchMenus
+	} from "./merchMenus";
+	import {
+		defaultOpeneds,
+		openFirstMenu,
+		uniqueOpened,
+	} from "@/config/settings";
+	export default {
+		name: "GalleryBar",
+		data() {
+			return {
+				uniqueOpened,
+				firstMenu: "",
+				defaultOpens: defaultOpeneds,
+				variables: variables,
+				appMenus: [
+					"单据模版",
+					"分销",
+					"营销",
+					"收银台",
+					"多商户",
+					"多门店",
+					"供应商管理端",
+					"钱货日清对账",
+					"积分商城",
+					"销售提成",
+					"设置",
+					"商城",
+				],
+			};
+		},
+		computed: {
+			...mapGetters({
+				collapse: "settings/collapse",
+				routes: "routes/routes",
+				partialRoutes: "routes/partialRoutes",
+				// 区分后台类型，1-总后台，2-多门店，3-多商户
+				systemType: "MUser/systemType",
+			}),
 
-      activeMenu() {
-        const route = this.$route;
-        const { meta, path } = route;
-        if (meta.activeMenu) {
-          return meta.activeMenu;
-        }
-        return path;
-      },
-      menuList() {
-        if (this.systemType === 2) {
-          return storeMenus();
-        } else if (this.systemType === 3) {
-          return merchMenus();
-        } else {
-          return menus();
-        }
-      },
-      handleRoutes() {
-        return this.menuList.filter(
-          (item) => item.hidden !== true && item.meta
-        );
-      },
-    },
-    watch: {
-      $route: {
-        handler(val) {
-          const firstMenu =
-            this.systemType === 2 ? handleHeadMenu() : handleFirstMenu();
-          if (this.firstMenu !== firstMenu) {
-            this.firstMenu = firstMenu;
-            this.handleTabClick({ name: firstMenu }, true);
-          }
-        },
-        immediate: true,
-      },
-    },
-    methods: {
-      handleTabClick(tab, mounted) {
-        const pageItem = this.menuList.find((item) => item.path === tab.name);
-        if (!pageItem) {
-          return;
-        }
-        const childrenArr = pageItem.children;
-        this.$store.dispatch("routes/setPartialRoutes", childrenArr);
-        if (mounted !== true && openFirstMenu) {
-          this.$router.push(childrenArr[0].fullPath);
-        }
-        // this.$store.dispatch("settings/openSideBar");
-      },
-      menuClick(route) {
-        this.$router.push(route.fullPath);
-      },
-    },
-  };
+			activeMenu() {
+				const route = this.$route;
+				const {
+					meta,
+					path
+				} = route;
+				if (meta.activeMenu) {
+					return meta.activeMenu;
+				}
+				return path;
+			},
+			menuList() {
+				console.log(this.systemType,'ml')
+				if (this.systemType === 2) {
+					return storeMenus();
+				} else if (this.systemType === 3) {
+					return merchMenus();
+				} else {
+					return menus();
+				}
+			},
+			handleRoutes() {
+				console.log(this.menuList,'过滤');
+				return this.menuList.filter(
+					(item) => item.hidden !== true && item.meta
+				);
+			},
+		},
+		watch: {
+			$route: {
+				handler(val) {
+					const firstMenu =
+						this.systemType === 2 ? handleHeadMenu() : handleFirstMenu();
+					if (this.firstMenu !== firstMenu) {
+						this.firstMenu = firstMenu;
+						this.handleTabClick({
+							name: firstMenu
+						}, true);
+					}
+				},
+				immediate: true,
+			},
+		},
+		methods: {
+			handleTabClick(tab, mounted) {
+				const pageItem = this.menuList.find((item) => item.path === tab.name);
+				if (!pageItem) {
+					return;
+				}
+				const childrenArr = pageItem.children;
+				this.$store.dispatch("routes/setPartialRoutes", childrenArr);
+				if (mounted !== true && openFirstMenu) {
+					this.$router.push(childrenArr[0].fullPath);
+				}
+				// this.$store.dispatch("settings/openSideBar");
+			},
+			menuClick(route) {
+				this.$router.push(route.fullPath);
+			},
+		},
+	};
 </script>
 <style lang="scss" scoped>
-  @mixin active {
-    &:hover {
-      color: $base-color-blue;
-      background-color: $base-gallery-second-menu-background-active !important;
+	@mixin active {
+		&:hover {
+			color: $base-color-blue;
+			background-color: $base-gallery-second-menu-background-active !important;
 
-      i,
-      svg {
-        color: $base-color-blue;
-      }
-    }
+			i,
+			svg {
+				color: $base-color-blue;
+			}
+		}
 
-    &.is-active {
-      color: $base-color-blue;
-      background-color: $base-gallery-second-menu-background-active !important;
-    }
-  }
+		&.is-active {
+			color: $base-color-blue;
+			background-color: $base-gallery-second-menu-background-active !important;
+		}
+	}
 
-  .gallery-bar-container {
-    position: fixed;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    z-index: $base-z-index;
-    width: $base-left-menu-width;
-    height: 100vh;
-    overflow: hidden;
-    background: $base-gallery-second-menu-background;
-    box-shadow: $base-box-shadow;
-    transition: width $base-transition-time;
+	.gallery-bar-container {
+		position: fixed;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		z-index: $base-z-index;
+		width: $base-left-menu-width;
+		height: 100vh;
+		overflow: hidden;
+		background: $base-gallery-second-menu-background;
+		box-shadow: $base-box-shadow;
+		transition: width $base-transition-time;
 
-    .gallery-grid {
-      width: $base-left-menu-width-min;
-      height: $base-left-menu-width-min;
-      padding: 10px;
-      padding-top: calc((#{$base-left-menu-width-min} - 55px) / 2);
-      overflow: hidden;
-      text-align: center;
-      text-overflow: ellipsis;
-      word-break: break-all;
-      white-space: nowrap;
-      svg {
-        display: block;
-        height: 20px;
-        margin: auto;
-        margin-top: 10px;
-        margin-bottom: -7px;
-      }
+		.gallery-grid {
+			width: $base-left-menu-width-min;
+			height: $base-left-menu-width-min;
+			padding: 10px;
+			padding-top: calc((#{$base-left-menu-width-min} - 55px) / 2);
+			overflow: hidden;
+			text-align: center;
+			text-overflow: ellipsis;
+			word-break: break-all;
+			white-space: nowrap;
 
-      [class*="ri-"] {
-        display: block;
-        height: 20px;
-        margin: auto;
-      }
-    }
+			svg {
+				display: block;
+				height: 20px;
+				margin: auto;
+				margin-top: 10px;
+				margin-bottom: -7px;
+			}
 
-    ::v-deep {
-      .el-scrollbar__wrap {
-        overflow-x: hidden;
-      }
+			[class*="ri-"] {
+				display: block;
+				height: 20px;
+				margin: auto;
+			}
+		}
 
-      .el-tabs {
-        position: fixed;
-        width: $base-left-menu-width-min;
+		::v-deep {
+			.el-scrollbar__wrap {
+				overflow-x: hidden;
+			}
 
-        .el-tabs__nav {
-          height: calc(100vh - #{$base-logo-height});
-          background: $base-gallery-first-menu-background;
-          overflow-y: auto;
-        }
+			.el-tabs {
+				position: fixed;
+				width: $base-left-menu-width-min;
 
-        .el-tabs__item {
-          height: auto;
-          padding: 0;
-          line-height: auto;
-          color: $base-color-white;
+				.el-tabs__nav {
+					height: calc(100vh - #{$base-logo-height});
+					background: $base-gallery-first-menu-background;
+					overflow-y: auto;
+				}
 
-          &.is-active {
-            background: $base-color-blue;
-          }
-        }
-      }
+				.el-tabs__item {
+					height: auto;
+					padding: 0;
+					line-height: auto;
+					color: $base-color-white;
 
-      .el-tabs__active-bar.is-left,
-      .el-tabs--left .el-tabs__nav-wrap.is-left::after {
-        display: none;
-      }
+					&.is-active {
+						background: $base-color-blue;
+					}
+				}
+			}
 
-      .el-tabs + .el-menu {
-        left: $base-left-menu-width-min;
-        display: fixed;
-        width: calc(#{$base-left-menu-width} - #{$base-left-menu-width-min});
-        border: 0;
-      }
+			.el-tabs__active-bar.is-left,
+			.el-tabs--left .el-tabs__nav-wrap.is-left::after {
+				display: none;
+			}
 
-      .el-menu {
-        border: 0;
+			.el-tabs+.el-menu {
+				left: $base-left-menu-width-min;
+				display: fixed;
+				width: calc(#{$base-left-menu-width} - #{$base-left-menu-width-min});
+				border: 0;
+			}
 
-        .vab-fas-icon {
-          padding-right: 3px;
-          font-size: $base-font-size-default;
-        }
+			.el-menu {
+				border: 0;
 
-        .vab-remix-icon {
-          padding-right: 3px;
-          font-size: $base-font-size-default + 2;
-        }
+				.vab-fas-icon {
+					padding-right: 3px;
+					font-size: $base-font-size-default;
+				}
 
-        .el-menu-item,
-        .el-submenu__title {
-          height: $base-menu-item-height;
-          overflow: hidden;
-          line-height: $base-menu-item-height;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-          vertical-align: middle;
+				.vab-remix-icon {
+					padding-right: 3px;
+					font-size: $base-font-size-default + 2;
+				}
 
-          @include active;
-        }
-      }
-    }
+				.el-menu-item,
+				.el-submenu__title {
+					height: $base-menu-item-height;
+					overflow: hidden;
+					line-height: $base-menu-item-height;
+					text-overflow: ellipsis;
+					white-space: nowrap;
+					vertical-align: middle;
 
-    &.is-collapse {
-      ::v-deep {
-        width: 0;
-      }
-    }
-  }
+					@include active;
+				}
+			}
+		}
 
-  /*  自定义menu样式*/
-  .menu-box {
-    display: flex;
-    padding: 10px 0;
-    .menu-col {
-      padding: 0 24px;
-      font-size: 14px;
-      border-right: 1px solid #eeeeee;
-      &:last-child {
-        border-right: 0;
-      }
-      p {
-        font-weight: 300;
-        color: rgba(0, 0, 0, 0.6);
-      }
-      .menu-ul {
-        .menu-li {
-          padding-top: 16px;
-          color: #000000;
-          cursor: pointer;
-          &:hover {
-            color: $base-color-blue;
-          }
-        }
-      }
-    }
-  }
+		&.is-collapse {
+			::v-deep {
+				width: 0;
+			}
+		}
+	}
+
+	/*  自定义menu样式*/
+	.menu-box {
+		display: flex;
+		padding: 10px 0;
+
+		.menu-col {
+			padding: 0 24px;
+			font-size: 14px;
+			border-right: 1px solid #eeeeee;
+
+			&:last-child {
+				border-right: 0;
+			}
+
+			p {
+				font-weight: 300;
+				color: rgba(0, 0, 0, 0.6);
+			}
+
+			.menu-ul {
+				.menu-li {
+					padding-top: 16px;
+					color: #000000;
+					cursor: pointer;
+
+					&:hover {
+						color: $base-color-blue;
+					}
+				}
+			}
+		}
+	}
 </style>