8-25-1

src/App.vue

@@ -1,150 +1,173 @@
 <template>
-  <div id="app">
-    <router-view />
-    <Setings ref="setingsRef" />
-    <Upgrade v-if="isVersion" />
-  </div>
+	<div id="app">
+		<router-view />
+		<Setings ref="setingsRef" />
+		<Upgrade v-if="isVersion" />
+	</div>
 </template>
 
 <script>
-import { on, off } from 'iview/src/utils/dom';
-import { setMatchMedia } from 'iview/src/utils/assist';
-import { mapMutations } from 'vuex';
-import Setings from '@/layout/navBars/breadcrumb/setings.vue';
-import Upgrade from '@/layout/upgrade/index.vue';
-import setting from './setting';
-import { Local } from '@/utils/storage.js';
-import config from '../package.json';
-setMatchMedia();
+	import {
+		on,
+		off
+	} from 'iview/src/utils/dom';
+	import {
+		setMatchMedia
+	} from 'iview/src/utils/assist';
+	import {
+		mapMutations
+	} from 'vuex';
+	import Setings from '@/layout/navBars/breadcrumb/setings.vue';
+	import Upgrade from '@/layout/upgrade/index.vue';
+	import setting from './setting';
+	import {
+		Local
+	} from '@/utils/storage.js';
+	import config from '../package.json';
+	setMatchMedia();
 
-export default {
-  name: 'app',
-  components: { Setings, Upgrade },
-  provide() {
-    return {
-      reload: this.reload,
-    };
-  },
-  data() {
-    return {
-      isVersion: false,
-    };
-  },
-  methods: {
-    ...mapMutations('media', ['setDevice']),
-    handleWindowResize() {
-      this.handleMatchMedia();
-    },
-    handleMatchMedia() {
-      const matchMedia = window.matchMedia;
+	export default {
+		name: 'app',
+		components: {
+			Setings,
+			Upgrade
+		},
+		provide() {
+			return {
+				reload: this.reload,
+			};
+		},
+		data() {
+			return {
+				isVersion: false,
+			};
+		},
+		methods: {
+			...mapMutations('media', ['setDevice']),
+			handleWindowResize() {
+				this.handleMatchMedia();
+			},
+			handleMatchMedia() {
+				const matchMedia = window.matchMedia;
 
-      if (matchMedia('(max-width: 600px)').matches) {
-        var deviceWidth = document.documentElement.clientWidth || window.innerWidth;
-        let css = 'calc(100vw/7.5)';
-        document.documentElement.style.fontSize = css;
-        this.setDevice('Mobile');
-      } else if (matchMedia('(max-width: 992px)').matches) {
-        this.setDevice('Tablet');
-      } else {
-        this.setDevice('Desktop');
-      }
-    },
-    reload() {
-      this.isRouterAlive = false;
-      this.$nextTick(function () {
-        this.isRouterAlive = true;
-      });
-    },
-    // 布局配置弹窗打开
-    openSetingsDrawer() {
-      this.bus.$on('openSetingsDrawer', () => {
-        this.$refs.setingsRef.openDrawer();
-      });
-    },
-    // 获取缓存中的布局配置
-    getLayoutThemeConfig() {
-      if (Local.get('themeConfigPrev')) {
-        this.$store.dispatch('themeConfig/setThemeConfig', Local.get('themeConfigPrev'));
-        document.documentElement.style.cssText = Local.get('themeConfigStyle');
-      } else {
-        Local.set('themeConfigPrev', this.$store.state.themeConfig.themeConfig);
-      }
-    },
-    getVersion() {
-      this.isVersion = false;
-      if (this.$route.path !== `${setting.routePre}/login` && this.$route.path !== '/') {
-        if ((Local.get('version') && Local.get('version') !== config.version) || !Local.get('version'))
-          this.isVersion = true;
-      }
-    },
-  },
-  mounted() {
-    on(window, 'resize', this.handleWindowResize);
-    this.handleMatchMedia();
-    this.openSetingsDrawer();
-    this.getLayoutThemeConfig();
-    this.$nextTick((e) => {
-      // this.getVersion();
-    });
-  },
+				if (matchMedia('(max-width: 600px)').matches) {
+					var deviceWidth = document.documentElement.clientWidth || window.innerWidth;
+					let css = 'calc(100vw/7.5)';
+					document.documentElement.style.fontSize = css;
+					this.setDevice('Mobile');
+				} else if (matchMedia('(max-width: 992px)').matches) {
+					this.setDevice('Tablet');
+				} else {
+					this.setDevice('Desktop');
+				}
+			},
+			reload() {
+				this.isRouterAlive = false;
+				this.$nextTick(function() {
+					this.isRouterAlive = true;
+				});
+			},
+			// 布局配置弹窗打开
+			openSetingsDrawer() {
+				this.bus.$on('openSetingsDrawer', () => {
+					this.$refs.setingsRef.openDrawer();
+				});
+			},
+			// 获取缓存中的布局配置
+			getLayoutThemeConfig() {
+				console.log(this.$store.state.themeConfig.themeConfig);
+				if (Local.get('themeConfigPrev')) {
+					this.$store.dispatch('themeConfig/setThemeConfig', Local.get('themeConfigPrev'));
+					document.documentElement.style.cssText = Local.get('themeConfigStyle');
+				} else {
+					Local.set('themeConfigPrev', this.$store.state.themeConfig.themeConfig);
+				}
+			},
+			getVersion() {
+				this.isVersion = false;
+				if (this.$route.path !== `${setting.routePre}/login` && this.$route.path !== '/') {
+					if ((Local.get('version') && Local.get('version') !== config.version) || !Local.get('version'))
+						this.isVersion = true;
+				}
+			},
+		},
+		mounted() {
+			on(window, 'resize', this.handleWindowResize);
+			this.handleMatchMedia();
+			this.openSetingsDrawer();
+			// this.getLayoutThemeConfig();
+			this.$nextTick((e) => {
+				// this.getVersion();
+			});
+		},
 
-  beforeDestroy() {
-    off(window, 'resize', this.handleWindowResize);
-  },
-  destroyed() {
-    this.bus.$off('openSetingsDrawer');
-  },
-};
+		beforeDestroy() {
+			off(window, 'resize', this.handleWindowResize);
+		},
+		destroyed() {
+			this.bus.$off('openSetingsDrawer');
+		},
+	};
 </script>
 
 <style lang="less">
-.size {
-  width: 100%;
-  height: 100%;
-}
-html,
-body {
-  .size;
-  overflow: hidden;
-  margin: 0;
-  padding: 0;
-}
-#app {
-  .size;
-  font-family: PingFang SC, Arial, Microsoft YaHei, sans-serif;
-}
-.dialog-fade-enter-active {
-  animation: anim-open 0.3s;
-}
-.dialog-fade-leave-active {
-  animation: anim-close 0.3s;
-}
-@keyframes anim-open {
-  0% {
-    transform: translate3d(100%, 0, 0);
-    opacity: 0;
-  }
-  100% {
-    transform: translate3d(0, 0, 0);
-    opacity: 1;
-  }
-}
-@keyframes anim-close {
-  0% {
-    transform: translate3d(0, 0, 0);
-    opacity: 1;
-  }
-  100% {
-    transform: translate3d(100%, 0, 0);
-    opacity: 0;
-  }
-}
-.ivu-modal-wrap /deep/ .connect_customerServer_img {
-  display: none;
-}
-.right-box .ivu-color-picker .ivu-select-dropdown {
-  position: absolute;
-  // width: 300px !important;
-  left: -73px !important;
-}
-</style>
+	.size {
+		width: 100%;
+		height: 100%;
+	}
+
+	html,
+	body {
+		.size;
+		overflow: hidden;
+		margin: 0;
+		padding: 0;
+	}
+
+	#app {
+		.size;
+		font-family: PingFang SC, Arial, Microsoft YaHei, sans-serif;
+	}
+
+	.dialog-fade-enter-active {
+		animation: anim-open 0.3s;
+	}
+
+	.dialog-fade-leave-active {
+		animation: anim-close 0.3s;
+	}
+
+	@keyframes anim-open {
+		0% {
+			transform: translate3d(100%, 0, 0);
+			opacity: 0;
+		}
+
+		100% {
+			transform: translate3d(0, 0, 0);
+			opacity: 1;
+		}
+	}
+
+	@keyframes anim-close {
+		0% {
+			transform: translate3d(0, 0, 0);
+			opacity: 1;
+		}
+
+		100% {
+			transform: translate3d(100%, 0, 0);
+			opacity: 0;
+		}
+	}
+
+	.ivu-modal-wrap /deep/ .connect_customerServer_img {
+		display: none;
+	}
+
+	.right-box .ivu-color-picker .ivu-select-dropdown {
+		position: absolute;
+		// width: 300px !important;
+		left: -73px !important;
+	}
+</style>

src/api/account.js

@@ -43,6 +43,17 @@ export function AccountLogout() {
 	});
 }
 
+/**
+ * 商户端退出登陆
+ * @constructor
+ */
+export function ShopLogout() {
+	return request({
+		url: '/mer/logout',
+		method: 'get',
+	});
+}
+
 /**
  * 获取轮播图和logo
  */

src/components/shopwangEditor/editor.js

@@ -0,0 +1,27 @@
+import E from 'wangeditor'; // npm 安装
+// const E = window.wangEditor // CDN 引入的方式
+import util from '../../utils/bus';
+
+// 获取必要的变量，这些在下文中都会用到
+const { $, BtnMenu, DropListMenu, PanelMenu, DropList, Panel, Tooltip } = E;
+var _this = null;
+export default class AlertMenu extends BtnMenu {
+  constructor(editor) {
+    _this = editor;
+    // data-title属性表示当鼠标悬停在该按钮上时提示该按钮的功能简述
+    const $elem = E.$(
+      `<div class="w-e-menu" data-title="视频">
+                <div class="iconfont iconshipin"></div>
+            </div>`,
+    );
+    super($elem, editor);
+  }
+  // 菜单点击事件
+  clickHandler() {
+    util.$emit('Video');
+    // getvideoint()
+  }
+  tryChangeActive() {
+    this.active();
+  }
+}

src/components/shopwangEditor/html.js

@@ -0,0 +1,26 @@
+import E from 'wangeditor'; // npm 安装
+// const E = window.wangEditor // CDN 引入的方式
+import util from '../../utils/bus';
+// 获取必要的变量，这些在下文中都会用到
+const { $, BtnMenu, DropListMenu, PanelMenu, DropList, Panel, Tooltip } = E;
+var _this = null;
+export default class HtmlMenu extends BtnMenu {
+  constructor(editor) {
+    _this = editor;
+    // data-title属性表示当鼠标悬停在该按钮上时提示该按钮的功能简述
+    const $elem = E.$(
+      `<div class="w-e-menu" data-title="html">
+                <div>HTML</div>
+            </div>`,
+    );
+    super($elem, editor);
+  }
+  // 菜单点击事件
+  clickHandler() {
+    // getHtmlint()
+    util.$emit('Html');
+  }
+  tryChangeActive() {
+    this.active();
+  }
+}

src/components/shopwangEditor/index.vue

@@ -0,0 +1,197 @@
+<template>
+	<div>
+		<div v-show="!monacoBox">
+			<div ref="wang-editor" class="wang-editor" />
+		</div>
+		<div v-if="monacoBox">
+			<Button type="primary" class="bottom" @click="getHtmlint">可视化界面</Button>
+			<monaco @change="changeValue" :value="newHtml" />
+		</div>
+
+		<Modal v-model="modalPic" width="1024px" scrollable footer-hide closable title="上传图片" :mask-closable="false"
+			:z-index="9">
+			<uploadPictures v-if="modalPic" :isChoice="isChoice" @getPic="getPic" @getPicD="getPicD"></uploadPictures>
+		</Modal>
+		<Modal v-model="modalVideo" width="800px" scrollable footer-hide closable title="上传视频" :mask-closable="false"
+			:z-index="9">
+			<uploadVideo v-if="modalVideo" @getVideo="getvideo"></uploadVideo>
+		</Modal>
+	</div>
+</template>
+<script>
+	import monaco from './monaco';
+	import E from 'wangeditor';
+	import AlertMenu from './editor';
+	import HtmlMenu from './html';
+	import uploadPictures from '@/components/uploadPictures2';
+	import uploadVideo from '@/components/uploadVideo2';
+	import {
+		getCookies
+	} from '@/libs/util';
+
+	import util from '../../utils/bus';
+	export default {
+		name: 'Index',
+		components: {
+			uploadPictures,
+			uploadVideo,
+			monaco,
+		},
+		props: {
+			content: {
+				type: String,
+				default: '',
+			},
+		},
+
+		data() {
+			return {
+				monacoBox: false,
+				value: '',
+				modalPic: false,
+				isChoice: '多选',
+				picTit: 'danFrom',
+				img: '',
+				modalVideo: false,
+				editor: null,
+				uploadSize: 2,
+				video: '',
+
+				// header: {
+				//   "Authori-zation": "Bearer " + getCookies("token"),
+				// },
+			};
+		},
+		watch: {
+			content(val) {
+				this.editor.txt.html(val);
+			},
+		},
+		created() {
+			// window.getvideoint = this.getvideoint;
+			// window.getHtmlint = this.getHtmlint;
+		},
+		mounted() {
+			this.createEditor();
+			util.$on('Video', (Video) => {
+				this.getvideoint();
+			});
+			util.$on('Html', (Html) => {
+				this.getHtmlint();
+			});
+		},
+
+		methods: {
+			changeValue(value) {
+				this.newHtml = value;
+				this.$emit('editorContent', value);
+
+				this.$emit('input', value);
+			},
+			// 获取多张图信息
+			getPic(pc) {
+				let _this = this;
+				_this.img = pc.att_dir;
+				_this.modalPic = false;
+				this.editor.cmd.do('insertHTML', `<img src="${_this.img}" style="max-width:100%;"/>`);
+			},
+			getimg() {
+				this.modalPic = true;
+				this.isChoice = '多选';
+			},
+			getvideoint() {
+				this.modalVideo = true;
+			},
+			getHtmlint() {
+				this.monacoBox = !this.monacoBox;
+				this.value = this.newHtml;
+				if (!this.monacoBox) {
+					this.editor.txt.html(this.newHtml);
+				}
+			},
+			getPicD(data) {
+				let _this = this;
+				_this.modalPic = false;
+
+				data.map((d) => {
+					this.editor.cmd.do('insertHTML', `<img src="${d.att_dir}" style="max-width:100%;"/>`);
+				});
+			},
+			getvideo(data) {
+				let _this = this;
+				_this.modalVideo = false;
+				this.video = data;
+				let videoHTML =
+					'<video src="' + this.video +
+					'" controls style="max-width:100%;min-height:500rpx"></video><p><br></p>';
+				this.editor.cmd.do('insertHTML', videoHTML);
+			},
+
+			createEditor() {
+				let _this = this;
+				const menuKey = 'alertMenuKey';
+				const html = 'alertHtml';
+				this.editor = new E(this.$refs['wang-editor']);
+
+				this.editor.menus.extend(menuKey, AlertMenu);
+				this.editor.menus.extend(html, HtmlMenu);
+				this.editor.config.menus = this.editor.config.menus.concat(html);
+				this.editor.config.menus = this.editor.config.menus.concat(menuKey);
+				this.editor.config.uploadImgFromMedia = function() {
+					_this.getimg();
+				};
+				// this.editor.config.uploadVideoHeaders = _this.header;
+				this.editor.config.height = 600;
+				this.editor.config.menus = [
+					'alertHtml',
+					'head',
+					'bold',
+					'fontSize',
+					'fontName',
+					'italic',
+					'underline',
+					'strikeThrough',
+					'indent',
+					'lineHeight',
+					'foreColor',
+					'backColor',
+					'link',
+					'list',
+					// "todo",
+					'justify',
+					'quote',
+					'emoticon',
+					'image',
+					'alertMenuKey',
+					// "table",
+					'code',
+					'splitLine',
+				];
+				// 配置全屏功能按钮是否展示
+				//   this.editor.config.showFullScreen = false
+				this.editor.config.uploadImgShowBase64 = false;
+				//   this.editor.config.uploadImgAccept = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp']
+				this.editor.config.zIndex = 0;
+				//   this.editor.config.uploadImgMaxSize = this.uploadSize * 1024 * 1024
+				this.editor.config.compatibleMode = () => {
+					// 返回 true 表示使用兼容模式；返回 false 使用标准模式
+					return true;
+				};
+				this.editor.config.onchange = (newHtml) => {
+					this.newHtml = newHtml;
+					this.$emit('editorContent', newHtml);
+				};
+				this.editor.config.onchangeTimeout = 300; // change后多久更新数据
+
+				this.editor.create();
+			},
+		},
+	};
+</script>
+
+<style lang="stylus" scoped>
+	.bottom {
+		margin-bottom: 10px;
+		cursor: pointer;
+	}
+</style>

src/components/shopwangEditor/monaco.vue

@@ -0,0 +1,79 @@
+<template>
+  <div ref="code_box" class="text">
+    <Input v-model="content" type="textarea" placeholder="" @on-change="changeContent" />
+  </div>
+</template>
+
+<script>
+// import * as monaco from 'monaco-editor';
+// import 'monaco-editor/esm/vs/basic-languages/javascript/javascript.contribution';
+export default {
+  data() {
+    return {
+      monacoInstance: null,
+      content: '',
+    };
+  },
+  props: {
+    value: {
+      type: String,
+      default: '',
+    },
+  },
+  watch: {
+    value(nal) {},
+  },
+  mounted() {
+    // this.seteditor();
+    this.content = this.value;
+  },
+  methods: {
+    changeContent() {
+      this.$emit('change', this.content);
+    },
+    setValue(val) {
+      // this.monacoInstance.setValue(val)
+    },
+    seteditor() {
+      // 初始化编辑器实例
+
+      this.monacoInstance = monaco.editor.create(this.$refs.code_box, {
+        value: this.value,
+        theme: 'vs', // vs, hc-black, or vs-dark
+
+        language: 'html', // shell、sql、python
+
+        readOnly: false, // 不能编辑
+      });
+      // 编辑器内容发生改变时触发
+      this.monacoInstance.onDidChangeModelContent(() => {
+        this.$emit('change', this.monacoInstance.getValue());
+      });
+    },
+  },
+  beforeDestroy() {
+    this.monacoInstance.dispose();
+    this.monacoInstance = null;
+  },
+};
+</script>
+
+<style lang="css" scoped>
+.editor {
+  width: 100%;
+  margin: 0 auto;
+}
+.text /deep/ .ivu-input-wrapper {
+  min-height: 600px;
+}
+.text /deep/ textarea.ivu-input {
+  min-height: 600px;
+}
+.text {
+  border: 1px solid #ccc;
+  min-height: 600px;
+}
+.w-e-text-container {
+  /* height: 490px !important; */
+}
+</style>

src/components/uploadVideo2/index.vue

@@ -1,194 +1,186 @@
 <template>
-  <div>
-    <div class="mt20 ml20">
-      <Input class="perW35" v-model="videoLink" placeholder="请输入视频链接" />
-      <input type="file" ref="refid" style="display: none" @change="zh_uploadFile_change" />
-      <Button
-        v-if="upload_type !== '1' || videoLink"
-        type="primary"
-        icon="ios-cloud-upload-outline"
-        class="ml10"
-        @click="zh_uploadFile"
-        >{{ videoLink ? '确认添加' : '上传视频' }}</Button
-      >
-      <Upload
-        v-if="upload_type === '1' && !videoLink"
-        :show-upload-list="false"
-        :action="fileUrl"
-        class="ml10"
-        :before-upload="videoSaveToUrl"
-        :data="uploadData"
-        :headers="header"
-        :multiple="true"
-        style="display: inline-block"
-      >
-        <Button type="primary" icon="ios-cloud-upload-outline">上传视频</Button>
-      </Upload>
-      <Progress :percent="progress" :stroke-width="5" v-if="upload.videoIng" />
-      <div class="iview-video-style" v-if="formValidate.video_link">
-        <video
-          style="width: 100%; height: 100% !important; border-radius: 10px"
-          :src="formValidate.video_link"
-          controls="controls"
-        >
-          您的浏览器不支持 video 标签。
-        </video>
-        <div class="mark"></div>
-        <Icon type="ios-trash-outline" class="iconv" @click="delVideo" />
-      </div>
-    </div>
-    <div class="mt50 ml20">
-      <Button type="primary" @click="uploads">确认</Button>
-    </div>
-  </div>
+	<div>
+		<div class="mt20 ml20">
+			<Input class="perW35" v-model="videoLink" placeholder="请输入视频链接" />
+			<input type="file" ref="refid" style="display: none" @change="zh_uploadFile_change" />
+			<Button v-if="upload_type !== '1' || videoLink" type="primary" icon="ios-cloud-upload-outline" class="ml10"
+				@click="zh_uploadFile">{{ videoLink ? '确认添加' : '上传视频' }}</Button>
+			<Upload v-if="upload_type === '1' && !videoLink" :show-upload-list="false" :action="fileUrl" class="ml10"
+				:before-upload="videoSaveToUrl" :data="uploadData" :headers="header" :multiple="true"
+				style="display: inline-block">
+				<Button type="primary" icon="ios-cloud-upload-outline">上传视频</Button>
+			</Upload>
+			<Progress :percent="progress" :stroke-width="5" v-if="upload.videoIng" />
+			<div class="iview-video-style" v-if="formValidate.video_link">
+				<video style="width: 100%; height: 100% !important; border-radius: 10px" :src="formValidate.video_link"
+					controls="controls">
+					您的浏览器不支持 video 标签。
+				</video>
+				<div class="mark"></div>
+				<Icon type="ios-trash-outline" class="iconv" @click="delVideo" />
+			</div>
+		</div>
+		<div class="mt50 ml20">
+			<Button type="primary" @click="uploads">确认</Button>
+		</div>
+	</div>
 </template>
 
 <script>
-import { uploadByPieces } from '@/utils/upload'; //引入uploadByPieces方法
-import { productGetTempKeysApi, uploadType } from '@/api/product';
-import Setting from '@/setting';
-import { getCookies } from '@/libs/util';
-// import "../../../public/UEditor/dialogs/internal";
-export default {
-  name: 'vide11o',
-  data() {
-    return {
-      fileUrl: Setting.apiBaseURL + '/file/upload',
-      upload: {
-        videoIng: false, // 是否显示进度条；
-      },
-      progress: 0, // 进度条默认0
-      videoLink: '',
-      formValidate: {
-        video_link: '',
-      },
-      upload_type: '',
-      uploadData: {},
-      header: {},
-    };
-  },
-  created() {
-    this.uploadType();
-    this.getToken();
-  },
-  methods: {
-    videoSaveToUrl(file) {
-      uploadByPieces({
-        file: file, // 视频实体
-        pieceSize: 3, // 分片大小
-        success: (data) => {
-          this.formValidate.video_link = data.file_path;
-          this.progress = 100;
-        },
-        error: (e) => {
-          this.$Message.error(e.msg);
-        },
-        uploading: (chunk, allChunk) => {
-          this.videoIng = true;
-          let st = Math.floor((chunk / allChunk) * 100);
-          this.progress = st;
-        },
-      });
-      return false;
-    },
-    // 删除视频；
-    delVideo() {
-      let that = this;
-      that.$set(that.formValidate, 'video_link', '');
-    },
-    //获取视频上传类型
-    uploadType() {
-      uploadType().then((res) => {
-        this.upload_type = res.data.upload_type;
-      });
-    },
-    // 上传成功
-    handleSuccess(res, file, fileList) {
-      if (res.status === 200) {
-        this.formValidate.video_link = res.data.src;
-        this.$Message.success(res.msg);
-      } else {
-        this.$Message.error(res.msg);
-      }
-    },
-    getToken() {
-      this.header['Authori-zation'] = 'Bearer ' + getCookies('token');
-    },
-    beforeUpload() {
-      this.uploadData = {};
-      let promise = new Promise((resolve) => {
-        this.$nextTick(function () {
-          resolve(true);
-        });
-      });
-      return promise;
-    },
-    zh_uploadFile() {
-      if (this.videoLink) {
-        this.formValidate.video_link = this.videoLink;
-      } else {
-        this.$refs.refid.click();
-      }
-    },
-    zh_uploadFile_change(evfile) {
-      let that = this;
-      if (evfile.target.files[0].type !== 'video/mp4') {
-        return that.$Message.error('只能上传mp4文件');
-      }
-      productGetTempKeysApi().then((res) => {
-        that.$videoCloud
-          .videoUpload({
-            type: res.data.type,
-            evfile: evfile,
-            res: res,
-            uploading(status, progress) {
-              that.upload.videoIng = status;
-            },
-          })
-          .then((res) => {
-            that.formValidate.video_link = res.url;
-            that.$Message.success('视频上传成功');
-          })
-          .catch((res) => {
-            that.$Message.error(res);
-          });
-      });
-    },
-    uploads() {
-      this.$emit('getVideo', this.formValidate.video_link);
-    },
-  },
-};
+	import {
+		uploadByPieces
+	} from '@/utils/uploads'; //引入uploadByPieces方法
+	import {
+		productGetTempKeysApi,
+		uploadType
+	} from '@/api/shopuploadPictures';
+	import Setting from '@/setting';
+	import {
+		getCookies
+	} from '@/libs/util';
+	// import "../../../public/UEditor/dialogs/internal";
+	export default {
+		name: 'vide11o',
+		data() {
+			return {
+				fileUrl: Setting.apiBaseURL + '/file/upload',
+				upload: {
+					videoIng: false, // 是否显示进度条；
+				},
+				progress: 0, // 进度条默认0
+				videoLink: '',
+				formValidate: {
+					video_link: '',
+				},
+				upload_type: '',
+				uploadData: {},
+				header: {},
+			};
+		},
+		created() {
+			this.uploadType();
+			this.getToken();
+		},
+		methods: {
+			videoSaveToUrl(file) {
+				uploadByPieces({
+					file: file, // 视频实体
+					pieceSize: 3, // 分片大小
+					success: (data) => {
+						this.formValidate.video_link = data.file_path;
+						this.progress = 100;
+					},
+					error: (e) => {
+						this.$Message.error(e.msg);
+					},
+					uploading: (chunk, allChunk) => {
+						this.videoIng = true;
+						let st = Math.floor((chunk / allChunk) * 100);
+						this.progress = st;
+					},
+				});
+				return false;
+			},
+			// 删除视频；
+			delVideo() {
+				let that = this;
+				that.$set(that.formValidate, 'video_link', '');
+			},
+			//获取视频上传类型
+			uploadType() {
+				uploadType().then((res) => {
+					this.upload_type = res.data.upload_type;
+				});
+			},
+			// 上传成功
+			handleSuccess(res, file, fileList) {
+				if (res.status === 200) {
+					this.formValidate.video_link = res.data.src;
+					this.$Message.success(res.msg);
+				} else {
+					this.$Message.error(res.msg);
+				}
+			},
+			getToken() {
+				this.header['Authori-zation'] = 'Bearer ' + getCookies('token');
+			},
+			beforeUpload() {
+				this.uploadData = {};
+				let promise = new Promise((resolve) => {
+					this.$nextTick(function() {
+						resolve(true);
+					});
+				});
+				return promise;
+			},
+			zh_uploadFile() {
+				if (this.videoLink) {
+					this.formValidate.video_link = this.videoLink;
+				} else {
+					this.$refs.refid.click();
+				}
+			},
+			zh_uploadFile_change(evfile) {
+				let that = this;
+				if (evfile.target.files[0].type !== 'video/mp4') {
+					return that.$Message.error('只能上传mp4文件');
+				}
+				productGetTempKeysApi().then((res) => {
+					that.$videoCloud
+						.videoUpload({
+							type: res.data.type,
+							evfile: evfile,
+							res: res,
+							uploading(status, progress) {
+								that.upload.videoIng = status;
+							},
+						})
+						.then((res) => {
+							that.formValidate.video_link = res.url;
+							that.$Message.success('视频上传成功');
+						})
+						.catch((res) => {
+							that.$Message.error(res);
+						});
+				});
+			},
+			uploads() {
+				this.$emit('getVideo', this.formValidate.video_link);
+			},
+		},
+	};
 </script>
 
 <style scoped>
-.iview-video-style {
-  width: 40%;
-  height: 180px;
-  border-radius: 10px;
-  background-color: #707070;
-  margin-top: 10px;
-  position: relative;
-  overflow: hidden;
-}
-.iview-video-style .iconv {
-  color: #fff;
-  line-height: 180px;
-  width: 50px;
-  height: 50px;
-  display: inherit;
-  font-size: 26px;
-  position: absolute;
-  top: -74px;
-  left: 50%;
-  margin-left: -25px;
-}
-.iview-video-style .mark {
-  position: absolute;
-  width: 100%;
-  height: 30px;
-  top: 0;
-  background-color: rgba(0, 0, 0, 0.5);
-  text-align: center;
-}
-</style>
+	.iview-video-style {
+		width: 40%;
+		height: 180px;
+		border-radius: 10px;
+		background-color: #707070;
+		margin-top: 10px;
+		position: relative;
+		overflow: hidden;
+	}
+
+	.iview-video-style .iconv {
+		color: #fff;
+		line-height: 180px;
+		width: 50px;
+		height: 50px;
+		display: inherit;
+		font-size: 26px;
+		position: absolute;
+		top: -74px;
+		left: 50%;
+		margin-left: -25px;
+	}
+
+	.iview-video-style .mark {
+		position: absolute;
+		width: 100%;
+		height: 30px;
+		top: 0;
+		background-color: rgba(0, 0, 0, 0.5);
+		text-align: center;
+	}
+</style>

src/layout/component/aside.vue

@@ -1,146 +1,157 @@
 <template>
-  <el-aside class="layout-aside" :class="setCollapseWidth" v-if="clientWidth > 1000">
-    <Logo v-if="setShowLogo && menuList.length && getThemeConfig.layout !== 'columns'" />
-    <div v-if="menuList.length && !getThemeConfig.isCollapse && getThemeConfig.layout == 'columns'" class="cat-name">
-      {{ adminTitle || catName }}
-    </div>
-    <el-scrollbar class="flex-auto" ref="layoutAsideRef">
-      <Vertical :menuList="menuList" :class="setCollapseWidth" />
-    </el-scrollbar>
-  </el-aside>
-  <el-drawer :visible.sync="getThemeConfig.isCollapse" :with-header="false" direction="ltr" size="180px" v-else>
-    <el-aside class="layout-aside w100 h100">
-      <Logo v-if="setShowLogo && menuList.length" />
-      <el-scrollbar class="flex-auto" ref="layoutAsideRef">
-        <Vertical :menuList="menuList" />
-      </el-scrollbar>
-    </el-aside>
-  </el-drawer>
+	<el-aside class="layout-aside" :class="setCollapseWidth" v-if="clientWidth > 1000">
+		<Logo v-if="setShowLogo && menuList.length && getThemeConfig.layout !== 'columns'" />
+		<div v-if="menuList.length && !getThemeConfig.isCollapse && getThemeConfig.layout == 'columns'"
+			class="cat-name">
+			{{ adminTitle || catName }}
+		</div>
+		<el-scrollbar class="flex-auto" ref="layoutAsideRef">
+			<Vertical :menuList="menuList" :class="setCollapseWidth" />
+		</el-scrollbar>
+	</el-aside>
+	<el-drawer :visible.sync="getThemeConfig.isCollapse" :with-header="false" direction="ltr" size="180px" v-else>
+		<el-aside class="layout-aside w100 h100">
+			<Logo v-if="setShowLogo && menuList.length" />
+			<el-scrollbar class="flex-auto" ref="layoutAsideRef">
+				<Vertical :menuList="menuList" />
+			</el-scrollbar>
+		</el-aside>
+	</el-drawer>
 </template>
 
 <script>
-import Vertical from '@/layout/navMenu/vertical.vue';
-import Logo from '@/layout/logo/index.vue';
-export default {
-  name: 'layoutAside',
-  components: { Vertical, Logo },
-  data() {
-    return {
-      // menuList: [],
-      clientWidth: '',
-      catName: '',
-    };
-  },
-  computed: {
-    adminTitle() {
-      return this.$store.state.app.adminTitle || '';
-    },
-    // 设置左侧菜单的具体宽度
-    menuList() {
-      this.$store.state.menus.childMenuList.length > 0
-        ? (this.$store.state.themeConfig.themeConfig.isCollapse = false)
-        : (this.$store.state.themeConfig.themeConfig.isCollapse = true);
-      return this.$store.state.menus.childMenuList;
-    },
-    setCollapseWidth() {
-      let { layout, isCollapse } = this.$store.state.themeConfig.themeConfig;
-      let asideBrColor = '';
-      layout === 'classic' || layout === 'columns' ? (asideBrColor = 'layout-el-aside-br-color') : '';
+	import Vertical from '@/layout/navMenu/vertical.vue';
+	import Logo from '@/layout/logo/index.vue';
+	export default {
+		name: 'layoutAside',
+		components: {
+			Vertical,
+			Logo
+		},
+		data() {
+			return {
+				// menuList: [],
+				clientWidth: '',
+				catName: '',
+			};
+		},
+		computed: {
+			adminTitle() {
+				return this.$store.state.app.adminTitle || '';
+			},
+			// 设置左侧菜单的具体宽度
+			menuList() {
+				this.$store.state.menus.childMenuList.length > 0 ?
+					(this.$store.state.themeConfig.themeConfig.isCollapse = false) :
+					(this.$store.state.themeConfig.themeConfig.isCollapse = true);
+				console.log(this.$store.state.menus.childMenuList, 'asid');
+				return this.$store.state.menus.childMenuList;
+			},
+			setCollapseWidth() {
+				let {
+					layout,
+					isCollapse
+				} = this.$store.state.themeConfig.themeConfig;
+				let asideBrColor = '';
+				layout === 'classic' || layout === 'columns' ? (asideBrColor = 'layout-el-aside-br-color') : '';
 
-      if (layout === 'columns') {
-        // 分栏布局，菜单收起时宽度给 1px
-        if (isCollapse) {
-          return ['layout-aside-width1', asideBrColor];
-        } else {
-          return ['layout-aside-width-default', asideBrColor];
-        }
-      } else {
-        // 其它布局给 64px
-        if (isCollapse) {
-          return ['layout-aside-width64', asideBrColor];
-        } else {
-          return ['layout-aside-width-default', asideBrColor];
-        }
-      }
-    },
-    // 设置 logo 是否显示
-    setShowLogo() {
-      let { layout, isShowLogo } = this.$store.state.themeConfig.themeConfig;
-      return (isShowLogo && layout === 'defaults') || (isShowLogo && layout === 'columns');
-    },
-    // 获取布局配置信息
-    getThemeConfig() {
-      return this.$store.state.themeConfig.themeConfig;
-    },
-  },
-  created() {
-    this.initMenuFixed(document.body.clientWidth);
-    this.setFilterRoutes();
-    // this.bus.$on('setSendColumnsChildren', (res) => {
-    //   this.menuList = res || [];
-    //   this.menuList.length > 0
-    //     ? (this.$store.state.themeConfig.themeConfig.isCollapse = false)
-    //     : (this.$store.state.themeConfig.themeConfig.isCollapse = true);
-    // });
-    this.bus.$on('layoutMobileResize', (res) => {
-      this.initMenuFixed(res.clientWidth);
-    });
-    this.bus.$on('oneCatName', (name) => {
-      this.catName = name;
-    });
-    // 菜单滚动条监听
-    this.bus.$on('updateElScrollBar', () => {
-      setTimeout(() => {
-        this.$refs.layoutAsideRef.update();
-      }, 300);
-    });
-    if (this.$store.state.themeConfig.themeConfig.layout !== 'columns') {
-      this.bus.$on('routesListChange', () => {
-        this.setFilterRoutes();
-      });
-    }
-  },
-  beforeDestroy() {
-    this.bus.$off('routesListChange');
-  },
-  methods: {
-    // 设置/过滤路由（非静态路由/是否显示在菜单中）
-    setFilterRoutes() {
-      if (this.$store.state.themeConfig.themeConfig.layout === 'columns') return false;
-      this.$store.commit('menus/childMenuList', this.filterRoutesFun(this.$store.state.routesList.routesList));
-      // this.menuList = this.filterRoutesFun(this.$store.state.routesList.routesList);
-    },
-    // 设置/过滤路由 递归函数
-    filterRoutesFun(arr) {
-      return arr
-        .filter((item) => item.path)
-        .map((item) => {
-          item = Object.assign({}, item);
-          if (item.children) item.children = this.filterRoutesFun(item.children);
-          return item;
-        });
-    },
-    // 设置菜单导航是否固定（移动端）
-    initMenuFixed(clientWidth) {
-      this.clientWidth = clientWidth;
-      this.$emit('routesListChange');
-    },
-  },
-  // 页面销毁时
-  destroyed() {
-    // 取消菜单滚动条监听
-    this.bus.$off('updateElScrollBar', () => {});
-  },
-};
+				if (layout === 'columns') {
+					// 分栏布局，菜单收起时宽度给 1px
+					if (isCollapse) {
+						return ['layout-aside-width1', asideBrColor];
+					} else {
+						return ['layout-aside-width-default', asideBrColor];
+					}
+				} else {
+					// 其它布局给 64px
+					if (isCollapse) {
+						return ['layout-aside-width64', asideBrColor];
+					} else {
+						return ['layout-aside-width-default', asideBrColor];
+					}
+				}
+			},
+			// 设置 logo 是否显示
+			setShowLogo() {
+				let {
+					layout,
+					isShowLogo
+				} = this.$store.state.themeConfig.themeConfig;
+				return (isShowLogo && layout === 'defaults') || (isShowLogo && layout === 'columns');
+			},
+			// 获取布局配置信息
+			getThemeConfig() {
+				return this.$store.state.themeConfig.themeConfig;
+			},
+		},
+		created() {
+			this.initMenuFixed(document.body.clientWidth);
+			this.setFilterRoutes();
+			// this.bus.$on('setSendColumnsChildren', (res) => {
+			//   this.menuList = res || [];
+			//   this.menuList.length > 0
+			//     ? (this.$store.state.themeConfig.themeConfig.isCollapse = false)
+			//     : (this.$store.state.themeConfig.themeConfig.isCollapse = true);
+			// });
+			this.bus.$on('layoutMobileResize', (res) => {
+				this.initMenuFixed(res.clientWidth);
+			});
+			this.bus.$on('oneCatName', (name) => {
+				this.catName = name;
+			});
+			// 菜单滚动条监听
+			this.bus.$on('updateElScrollBar', () => {
+				setTimeout(() => {
+					this.$refs.layoutAsideRef.update();
+				}, 300);
+			});
+			if (this.$store.state.themeConfig.themeConfig.layout !== 'columns') {
+				this.bus.$on('routesListChange', () => {
+					this.setFilterRoutes();
+				});
+			}
+		},
+		beforeDestroy() {
+			this.bus.$off('routesListChange');
+		},
+		methods: {
+			// 设置/过滤路由（非静态路由/是否显示在菜单中）
+			setFilterRoutes() {
+				if (this.$store.state.themeConfig.themeConfig.layout === 'columns') return false;
+				this.$store.commit('menus/childMenuList', this.filterRoutesFun(this.$store.state.routesList.routesList));
+				// this.menuList = this.filterRoutesFun(this.$store.state.routesList.routesList);
+			},
+			// 设置/过滤路由 递归函数
+			filterRoutesFun(arr) {
+				return arr
+					.filter((item) => item.path)
+					.map((item) => {
+						item = Object.assign({}, item);
+						if (item.children) item.children = this.filterRoutesFun(item.children);
+						return item;
+					});
+			},
+			// 设置菜单导航是否固定（移动端）
+			initMenuFixed(clientWidth) {
+				this.clientWidth = clientWidth;
+				this.$emit('routesListChange');
+			},
+		},
+		// 页面销毁时
+		destroyed() {
+			// 取消菜单滚动条监听
+			this.bus.$off('updateElScrollBar', () => {});
+		},
+	};
 </script>
 <style lang="scss" scoped>
-.cat-name {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  height: 50px;
-  border-bottom: 1px solid var(--prev-border-color-lighter);
-  font-weight: 500;
-  font-size: 15px;
-}
-</style>
+	.cat-name {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		height: 50px;
+		border-bottom: 1px solid var(--prev-border-color-lighter);
+		font-weight: 500;
+		font-size: 15px;
+	}
+</style>

src/layout/component/columnsAside.vue

@@ -24,7 +24,7 @@
                   $t(v.title) && $t(v.title).length >= 4
                     ? $t(v.title).substr(0, setColumnsAsidelayout === 'columns-vertical' ? 4 : 3)
                     : $t(v.title)
-                }}1
+                }}
 							</div>
 						</a>
 					</div>
@@ -113,6 +113,7 @@
 			setFilterRoutes() {
 				if (this.$store.state.routesList.routesList.length <= 0) return false;
 				this.columnsAsideList = this.filterRoutesFun(this.$store.state.routesList.routesList);
+				console.log(this.columnsAsideList, 'columnsAside');
 				//   const resData = getHeaderName(this.$route.path, this.columnsAsideList);
 				const resData = this.setSendChildren(getHeaderName(this.$route, this.columnsAsideList));
 				if (!resData.children) {

src/layout/component/transverseAside.vue

@@ -1,330 +1,354 @@
 <template>
-  <div class="layout-columns-tra-aside el-menu-horizontal-warp">
-    <el-scrollbar ref="elMenuHorizontalScrollRef" @wheel.native.prevent="onElMenuHorizontalScroll">
-      <ul>
-        <li
-          v-for="(v, k) in columnsAsideList"
-          :key="k"
-          @click="onColumnsAsideMenuClick(v)"
-          ref="columnsAsideOffsetLeftRefs"
-          class="layout-columns"
-          :class="{ 'layout-columns-active': v.k === liIndex }"
-          :title="$t(v.title)"
-        >
-          <div :class="setColumnsAsidelayout" v-if="!v.isLink || (v.isLink && v.isIframe)">
-            <Icon :type="v.icon" />
-            <div class="font12">
-              {{
+	<div class="layout-columns-tra-aside el-menu-horizontal-warp">
+		<el-scrollbar ref="elMenuHorizontalScrollRef" @wheel.native.prevent="onElMenuHorizontalScroll">
+			<ul>
+				<li v-for="(v, k) in columnsAsideList" :key="k" @click="onColumnsAsideMenuClick(v)"
+					ref="columnsAsideOffsetLeftRefs" class="layout-columns"
+					:class="{ 'layout-columns-active': v.k === liIndex }" :title="$t(v.title)">
+					<div :class="setColumnsAsidelayout" v-if="!v.isLink || (v.isLink && v.isIframe)">
+						<Icon :type="v.icon" />
+						<div class="font12">
+							{{
                 $t(v.title) && $t(v.title).length >= 4
                   ? $t(v.title).substr(0, setColumnsAsidelayout === 'columns-vertical' ? 4 : 3)
                   : $t(v.title)
               }}
-            </div>
-          </div>
-          <div :class="setColumnsAsidelayout" v-else>
-            <a :href="v.isLink" target="_blank">
-              <Icon :type="v.icon" />
-              <div class="font12">
-                {{
+						</div>
+					</div>
+					<div :class="setColumnsAsidelayout" v-else>
+						<a :href="v.isLink" target="_blank">
+							<Icon :type="v.icon" />
+							<div class="font12">
+								{{
                   $t(v.title) && $t(v.title).length >= 4
                     ? $t(v.title).substr(0, setColumnsAsidelayout === 'columns-vertical' ? 4 : 3)
                     : $t(v.title)
                 }}1
-              </div>
-            </a>
-          </div>
-        </li>
-        <div ref="columnsAsideActiveRef" :class="setColumnsAsideStyle"></div>
-      </ul>
-    </el-scrollbar>
-  </div>
+							</div>
+						</a>
+					</div>
+				</li>
+				<div ref="columnsAsideActiveRef" :class="setColumnsAsideStyle"></div>
+			</ul>
+		</el-scrollbar>
+	</div>
 </template>
 
 <script>
-import { getMenuSider, getHeaderName } from '@/libs/system';
-import Logo from '@/layout/logo/index.vue';
+	import {
+		getMenuSider,
+		getHeaderName
+	} from '@/libs/system';
+	import Logo from '@/layout/logo/index.vue';
 
-export default {
-  name: 'layoutColumnsAside',
-  components: { Logo },
-  data() {
-    return {
-      columnsAsideList: [],
-      liIndex: 0,
-      difference: 0,
-      routeSplit: [],
-      activePath: '',
-    };
-  },
-  computed: {
-    // 设置分栏高亮风格
-    setColumnsAsideStyle() {
-      return this.$store.state.themeConfig.themeConfig.columnsAsideStyle;
-    },
-    // 设置分栏布局风格
-    setColumnsAsidelayout() {
-      return this.$store.state.themeConfig.themeConfig.columnsAsideLayout;
-    },
-    Layout() {
-      return this.$store.state.themeConfig.themeConfig.Layout;
-    },
-    routesList() {
-      this.$store.state.routesList.routesList;
-    },
-  },
-  beforeDestroy() {
-    this.bus.$off('routesListChange');
-  },
-  mounted() {
-    this.bus.$on('routesListChange', () => {
-      this.setFilterRoutes();
-    });
-    this.setFilterRoutes();
-    this.$nextTick((e) => {
-      this.initElMenuOffsetLeft();
-    });
-  },
-  methods: {
-    // 设置横向滚动条可以鼠标滚轮滚动
-    onElMenuHorizontalScroll(e) {
-      const eventDelta = e.wheelDelta || -e.deltaY * 40;
-      this.$refs.elMenuHorizontalScrollRef.$refs.wrap.scrollLeft =
-        this.$refs.elMenuHorizontalScrollRef.$refs.wrap.scrollLeft + eventDelta / 4;
-    },
-    // 初始化数据，页面刷新时，滚动条滚动到对应位置
-    initElMenuOffsetLeft() {
-      this.$nextTick(() => {
-        let els = document.querySelector('.layout-columns.layout-columns-active');
-        if (!els) return false;
-        this.$refs.elMenuHorizontalScrollRef.$refs.wrap.scrollLeft = els.offsetLeft;
-      });
-    },
-    // 设置菜单高亮位置移动
-    setColumnsAsideMove(k) {
-      if (k === undefined) return false;
-      const els = this.$refs.columnsAsideOffsetLeftRefs;
-      this.liIndex = k;
-      this.$refs.columnsAsideActiveRef.style.left = `${els[k].offsetLeft + this.difference}px`;
-    },
-    // 菜单高亮点击事件
-    onColumnsAsideMenuClick(v) {
-      let { path, redirect } = v;
-      if (path) this.$router.push(path);
-      else this.$router.push(path);
-      // 一个路由设置自动收起菜单
-      if (!v.children || v.children.length <= 1) this.$store.state.themeConfig.themeConfig.isCollapse = true;
-      else if (v.children.length > 1) this.$store.state.themeConfig.themeConfig.isCollapse = false;
-      // this.bus.$emit('setSendColumnsChildren', getMenuSider(this.columnsAsideList, path));
-    },
-    // 设置高亮动态位置
-    onColumnsAsideDown(k) {
-      this.$nextTick(() => {
-        this.setColumnsAsideMove(k);
-      });
-    },
-    // 设置/过滤路由（非静态路由/是否显示在菜单中）
-    setFilterRoutes() {
-      if (this.$store.state.routesList.routesList.length <= 0) return false;
-      this.columnsAsideList = this.filterRoutesFun(this.$store.state.routesList.routesList);
-      //   const resData = getHeaderName(this.$route.path, this.columnsAsideList);
-      const resData = this.setSendChildren(getHeaderName(this.$route, this.columnsAsideList));
-      if (!resData.children) {
-        this.bus.$emit('setSendColumnsChildren', []);
-        this.$store.commit('menus/childMenuList', []);
+	export default {
+		name: 'layoutColumnsAside',
+		components: {
+			Logo
+		},
+		data() {
+			return {
+				columnsAsideList: [],
+				liIndex: 0,
+				difference: 0,
+				routeSplit: [],
+				activePath: '',
+			};
+		},
+		computed: {
+			// 设置分栏高亮风格
+			setColumnsAsideStyle() {
+				return this.$store.state.themeConfig.themeConfig.columnsAsideStyle;
+			},
+			// 设置分栏布局风格
+			setColumnsAsidelayout() {
+				return this.$store.state.themeConfig.themeConfig.columnsAsideLayout;
+			},
+			Layout() {
+				return this.$store.state.themeConfig.themeConfig.Layout;
+			},
+			routesList() {
+				this.$store.state.routesList.routesList;
+			},
+		},
+		beforeDestroy() {
+			this.bus.$off('routesListChange');
+		},
+		mounted() {
+			this.bus.$on('routesListChange', () => {
+				this.setFilterRoutes();
+			});
+			this.setFilterRoutes();
+			this.$nextTick((e) => {
+				this.initElMenuOffsetLeft();
+			});
+		},
+		methods: {
+			// 设置横向滚动条可以鼠标滚轮滚动
+			onElMenuHorizontalScroll(e) {
+				const eventDelta = e.wheelDelta || -e.deltaY * 40;
+				this.$refs.elMenuHorizontalScrollRef.$refs.wrap.scrollLeft =
+					this.$refs.elMenuHorizontalScrollRef.$refs.wrap.scrollLeft + eventDelta / 4;
+			},
+			// 初始化数据，页面刷新时，滚动条滚动到对应位置
+			initElMenuOffsetLeft() {
+				this.$nextTick(() => {
+					let els = document.querySelector('.layout-columns.layout-columns-active');
+					if (!els) return false;
+					this.$refs.elMenuHorizontalScrollRef.$refs.wrap.scrollLeft = els.offsetLeft;
+				});
+			},
+			// 设置菜单高亮位置移动
+			setColumnsAsideMove(k) {
+				if (k === undefined) return false;
+				const els = this.$refs.columnsAsideOffsetLeftRefs;
+				this.liIndex = k;
+				this.$refs.columnsAsideActiveRef.style.left = `${els[k].offsetLeft + this.difference}px`;
+			},
+			// 菜单高亮点击事件
+			onColumnsAsideMenuClick(v) {
+				let {
+					path,
+					redirect
+				} = v;
+				if (path) this.$router.push(path);
+				else this.$router.push(path);
+				// 一个路由设置自动收起菜单
+				if (!v.children || v.children.length <= 1) this.$store.state.themeConfig.themeConfig.isCollapse = true;
+				else if (v.children.length > 1) this.$store.state.themeConfig.themeConfig.isCollapse = false;
+				// this.bus.$emit('setSendColumnsChildren', getMenuSider(this.columnsAsideList, path));
+			},
+			// 设置高亮动态位置
+			onColumnsAsideDown(k) {
+				this.$nextTick(() => {
+					this.setColumnsAsideMove(k);
+				});
+			},
+			// 设置/过滤路由（非静态路由/是否显示在菜单中）
+			setFilterRoutes() {
+				if (this.$store.state.routesList.routesList.length <= 0) return false;
+				this.columnsAsideList = this.filterRoutesFun(this.$store.state.routesList.routesList);
+				//   const resData = getHeaderName(this.$route.path, this.columnsAsideList);
+				const resData = this.setSendChildren(getHeaderName(this.$route, this.columnsAsideList));
+				if (!resData.children) {
+					this.bus.$emit('setSendColumnsChildren', []);
+					this.$store.commit('menus/childMenuList', []);
 
-        this.$store.state.themeConfig.themeConfig.isCollapse = true;
-        return false;
-      }
-      this.bus.$emit('oneCatName', resData.item[0].title);
-      this.onColumnsAsideDown(resData.item[0].k);
-      // 刷新时，初始化一个路由设置自动收起菜单
-      resData.children.length > 0
-        ? (this.$store.state.themeConfig.themeConfig.isCollapse = false)
-        : (this.$store.state.themeConfig.themeConfig.isCollapse = true);
-      this.bus.$emit('setSendColumnsChildren', resData?.children || []);
-      this.$store.commit('menus/childMenuList', resData?.children || []);
-    },
-    // 传送当前子级数据到菜单中
-    setSendChildren(path) {
-      const currentPathSplit = path.split('/');
-      let currentData = {};
-      this.columnsAsideList.map((v, k) => {
-        if (v.path === path) {
-          v['k'] = k;
-          currentData['item'] = [{ ...v }];
-          //   currentData['children'] = [{ ...v }];
-          if (v.children) currentData['children'] = v.children;
-        }
-      });
-      return currentData;
-    },
-    // 路由过滤递归函数
-    filterRoutesFun(arr) {
-      return arr
-        .filter((item) => item.path)
-        .map((item) => {
-          item = Object.assign({}, item);
-          if (item.children) item.children = this.filterRoutesFun(item.children);
-          return item;
-        });
-    },
-    // tagsView 点击时，根据路由查找下标 columnsAsideList，实现左侧菜单高亮
-    setColumnsMenuHighlight(path) {
-      // this.routeSplit = path.split('/');
-      // this.routeSplit.shift();
-      // const routeFirst = `/${this.routeSplit[0]}`;
-      const currentSplitRoute = this.columnsAsideList.find((v) => v.path === path);
-      if (!currentSplitRoute) {
-        // this.onColumnsAsideDown(0);
-        return false;
-      }
-      // 延迟拿值，防止取不到
-      setTimeout(() => {
-        this.onColumnsAsideDown(currentSplitRoute.k);
-      }, 0);
-    },
-  },
-  watch: {
-    // 监听 vuex 数据变化
-    '$store.state': {
-      handler(val) {
-        val.themeConfig.themeConfig.columnsAsideStyle === 'columnsRound'
-          ? (this.difference = 3)
-          : (this.difference = 0);
-        if (val.routesList.routesList.length === this.columnsAsideList.length) return false;
-      },
-      deep: true,
-    },
-    // 监听路由的变化
-    $route: {
-      handler(to) {
-        this.setColumnsMenuHighlight(to.path);
-        // this.setColumnsAsideMove();
-        let HeadName = getHeaderName(to, this.columnsAsideList);
-        let asideList = getMenuSider(this.columnsAsideList, HeadName)[0]?.children;
-        const resData = this.setSendChildren(HeadName);
-        if (resData.length <= 0) return false;
-        this.onColumnsAsideDown(resData.item[0].k);
-        this.bus.$emit('oneCatName', resData.item[0].title);
-        this.bus.$emit('setSendColumnsChildren', asideList || []);
-        this.$store.commit('menus/childMenuList', asideList || []);
-      },
-      deep: true,
-    },
-  },
-};
+					this.$store.state.themeConfig.themeConfig.isCollapse = true;
+					return false;
+				}
+				this.bus.$emit('oneCatName', resData.item[0].title);
+				this.onColumnsAsideDown(resData.item[0].k);
+				// 刷新时，初始化一个路由设置自动收起菜单
+				resData.children.length > 0 ?
+					(this.$store.state.themeConfig.themeConfig.isCollapse = false) :
+					(this.$store.state.themeConfig.themeConfig.isCollapse = true);
+				this.bus.$emit('setSendColumnsChildren', resData?.children || []);
+				this.$store.commit('menus/childMenuList', resData?.children || []);
+			},
+			// 传送当前子级数据到菜单中
+			setSendChildren(path) {
+				const currentPathSplit = path.split('/');
+				let currentData = {};
+				this.columnsAsideList.map((v, k) => {
+					if (v.path === path) {
+						v['k'] = k;
+						currentData['item'] = [{
+							...v
+						}];
+						//   currentData['children'] = [{ ...v }];
+						if (v.children) currentData['children'] = v.children;
+					}
+				});
+				return currentData;
+			},
+			// 路由过滤递归函数
+			filterRoutesFun(arr) {
+				return arr
+					.filter((item) => item.path)
+					.map((item) => {
+						item = Object.assign({}, item);
+						if (item.children) item.children = this.filterRoutesFun(item.children);
+						return item;
+					});
+			},
+			// tagsView 点击时，根据路由查找下标 columnsAsideList，实现左侧菜单高亮
+			setColumnsMenuHighlight(path) {
+				// this.routeSplit = path.split('/');
+				// this.routeSplit.shift();
+				// const routeFirst = `/${this.routeSplit[0]}`;
+				const currentSplitRoute = this.columnsAsideList.find((v) => v.path === path);
+				if (!currentSplitRoute) {
+					// this.onColumnsAsideDown(0);
+					return false;
+				}
+				// 延迟拿值，防止取不到
+				setTimeout(() => {
+					this.onColumnsAsideDown(currentSplitRoute.k);
+				}, 0);
+			},
+		},
+		watch: {
+			// 监听 vuex 数据变化
+			'$store.state': {
+				handler(val) {
+					val.themeConfig.themeConfig.columnsAsideStyle === 'columnsRound' ?
+						(this.difference = 3) :
+						(this.difference = 0);
+					if (val.routesList.routesList.length === this.columnsAsideList.length) return false;
+				},
+				deep: true,
+			},
+			// 监听路由的变化
+			$route: {
+				handler(to) {
+					this.setColumnsMenuHighlight(to.path);
+					// this.setColumnsAsideMove();
+					let HeadName = getHeaderName(to, this.columnsAsideList);
+					let asideList = getMenuSider(this.columnsAsideList, HeadName)[0]?.children;
+					const resData = this.setSendChildren(HeadName);
+					if (resData.length <= 0) return false;
+					this.onColumnsAsideDown(resData.item[0].k);
+					this.bus.$emit('oneCatName', resData.item[0].title);
+					this.bus.$emit('setSendColumnsChildren', asideList || []);
+					this.$store.commit('menus/childMenuList', asideList || []);
+				},
+				deep: true,
+			},
+		},
+	};
 </script>
 
 <style scoped lang="scss">
-/deep/ .el-scrollbar__bar.is-horizontal {
-  height: 0;
-}
-.el-menu-horizontal-warp {
-  ::v-deep .el-scrollbar__bar.is-vertical {
-    display: none;
-  }
-  ::v-deep .el-scrollbar__wrap {
-    overflow-y: hidden !important;
-    overflow-x: scroll !important;
-  }
-  ::v-deep a {
-    width: 100%;
-  }
-  .el-menu.el-menu--horizontal {
-    display: flex;
-    height: 100%;
-    width: 100%;
-    box-sizing: border-box;
-  }
-}
+	/deep/ .el-scrollbar__bar.is-horizontal {
+		height: 0;
+	}
 
-.layout-columns-tra-aside {
-  height: 100%;
-  background: var(--prev-bg-columnsMenuBar);
-  // box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
-  overflow-y: hidden;
-  // flex: 1;
-  ul {
-    position: relative;
-    display: flex;
-    li {
-      color: var(--prev-bg-columnsMenuBarColor);
-      width: 80px;
-      height: 50px;
-      text-align: center;
-      display: flex;
-      cursor: pointer;
-      position: relative;
-      z-index: 1;
-      .columns-vertical {
-        margin: auto;
-        .columns-vertical-title {
-          //   padding-top: 1px;
-        }
-      }
-      .columns-horizontal {
-        display: flex;
-        height: 50px;
-        width: 80px;
-        align-items: center;
-        justify-content: center;
-        padding: 0 5px;
-        i {
-          margin-right: 5px;
-        }
-        a {
-          display: flex;
-          .columns-horizontal-title {
-            padding-top: 1px;
-          }
-        }
-      }
-      a {
-        text-decoration: none;
-        color: var(--prev-bg-columnsMenuBarColor);
-      }
-    }
-    // li:hover {
-    //   background: var(--prev-bg-menu-hover-ba-color);
-    //   color: var(--prev-bg-columnsMenuBarColor);
-    // }
-    .layout-columns {
-      transition: 0.3s ease-in-out;
-    }
-    .layout-columns-active,
-    .layout-columns-active a {
-      color: var(--prev-bg-columnsMenuActiveColor);
-      transition: 0.3s ease-in-out;
-    }
-    .columns-round {
-      background: var(--prev-color-primary);
-      position: absolute;
-      left: 0;
-      height: 40px;
-      width: 80px;
-      margin-top: 5px;
-      transform: translatey(0%);
-      z-index: 0;
-      transition: 0.3s ease-in-out;
-      border-radius: 3px;
-    }
-    .columns-card {
-      @extend .columns-round;
-      top: 0;
-      height: 50px;
-      width: 80px;
-      border-radius: 0;
-      margin-top: 0px;
-    }
-  }
-}
-/deep/ .el-scrollbar {
-  height: 50px;
-}
-/deep/ .el-scrollbar__bar.is-horizontal {
-  display: none;
-}
-/deep/ .el-scrollbar__thumb {
-  display: none;
-}
-</style>
+	.el-menu-horizontal-warp {
+		::v-deep .el-scrollbar__bar.is-vertical {
+			display: none;
+		}
+
+		::v-deep .el-scrollbar__wrap {
+			overflow-y: hidden !important;
+			overflow-x: scroll !important;
+		}
+
+		::v-deep a {
+			width: 100%;
+		}
+
+		.el-menu.el-menu--horizontal {
+			display: flex;
+			height: 100%;
+			width: 100%;
+			box-sizing: border-box;
+		}
+	}
+
+	.layout-columns-tra-aside {
+		height: 100%;
+		background: var(--prev-bg-columnsMenuBar);
+		// box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
+		overflow-y: hidden;
+
+		// flex: 1;
+		ul {
+			position: relative;
+			display: flex;
+
+			li {
+				color: var(--prev-bg-columnsMenuBarColor);
+				width: 80px;
+				height: 50px;
+				text-align: center;
+				display: flex;
+				cursor: pointer;
+				position: relative;
+				z-index: 1;
+
+				.columns-vertical {
+					margin: auto;
+
+					.columns-vertical-title {
+						//   padding-top: 1px;
+					}
+				}
+
+				.columns-horizontal {
+					display: flex;
+					height: 50px;
+					width: 80px;
+					align-items: center;
+					justify-content: center;
+					padding: 0 5px;
+
+					i {
+						margin-right: 5px;
+					}
+
+					a {
+						display: flex;
+
+						.columns-horizontal-title {
+							padding-top: 1px;
+						}
+					}
+				}
+
+				a {
+					text-decoration: none;
+					color: var(--prev-bg-columnsMenuBarColor);
+				}
+			}
+
+			// li:hover {
+			//   background: var(--prev-bg-menu-hover-ba-color);
+			//   color: var(--prev-bg-columnsMenuBarColor);
+			// }
+			.layout-columns {
+				transition: 0.3s ease-in-out;
+			}
+
+			.layout-columns-active,
+			.layout-columns-active a {
+				color: var(--prev-bg-columnsMenuActiveColor);
+				transition: 0.3s ease-in-out;
+			}
+
+			.columns-round {
+				background: var(--prev-color-primary);
+				position: absolute;
+				left: 0;
+				height: 40px;
+				width: 80px;
+				margin-top: 5px;
+				transform: translatey(0%);
+				z-index: 0;
+				transition: 0.3s ease-in-out;
+				border-radius: 3px;
+			}
+
+			.columns-card {
+				@extend .columns-round;
+				top: 0;
+				height: 50px;
+				width: 80px;
+				border-radius: 0;
+				margin-top: 0px;
+			}
+		}
+	}
+
+	/deep/ .el-scrollbar {
+		height: 50px;
+	}
+
+	/deep/ .el-scrollbar__bar.is-horizontal {
+		display: none;
+	}
+
+	/deep/ .el-scrollbar__thumb {
+		display: none;
+	}
+</style>

src/layout/index.vue

@@ -1,79 +1,108 @@
 <template>
-  <Mains v-if="headMenuNoShow" />
-  <Defaults v-else-if="getThemeConfig.layout === 'defaults'" />
-  <Classic v-else-if="getThemeConfig.layout === 'classic'" />
-  <Transverse v-else-if="getThemeConfig.layout === 'transverse'" />
-  <Columns v-else-if="getThemeConfig.layout === 'columns'" />
+	<Mains v-if="headMenuNoShow" />
+	<Defaults v-else-if="getThemeConfig.layout === 'defaults'" />
+	<Classic v-else-if="getThemeConfig.layout === 'columns'|| getThemeConfig.layout === 'classic'" />
+	<Transverse v-else-if="getThemeConfig.layout === 'transverse'" />
+	<!-- <Columns v-else-if="getThemeConfig.layout === 'columns'" /> -->
 </template>
 
 <script>
-import { Local } from '@/utils/storage.js';
-import { mapMutations } from 'vuex';
-import { getNewTagList } from '@/libs/util';
+	import {
+		Local
+	} from '@/utils/storage.js';
+	import {
+		mapMutations
+	} from 'vuex';
+	import {
+		getNewTagList
+	} from '@/libs/util';
 
-export default {
-  name: 'layout',
-  components: {
-    Defaults: () => import('@/layout/main/defaults.vue'),
-    Classic: () => import('@/layout/main/classic.vue'),
-    Transverse: () => import('@/layout/main/transverse.vue'),
-    Columns: () => import('@/layout/main/columns.vue'),
-    Mains: () => import('@/layout/component/main.vue'),
-  },
-  data() {
-    return {
-      headMenuNoShow: false,
-    };
-  },
-  computed: {
-    // 获取布局配置信息
-    getThemeConfig() {
-      return this.$store.state.themeConfig.themeConfig;
-    },
-    tagNavList() {
-      return this.$store.state.app.tagNavList;
-    },
-  },
-  watch: {
-    $route(newRoute) {
-      this.headMenuNoShow = this.$route.meta.fullScreen;
-      const { name, query, params, meta, path } = newRoute;
-      this.addTag({
-        route: { name, query, params, meta, path },
-        type: 'push',
-      });
-      this.setBreadCrumb(newRoute);
-      this.setTagNavList(getNewTagList(this.tagNavList, newRoute));
-    },
-  },
-  created() {
-    this.headMenuNoShow = this.$route.meta.fullScreen;
-    this.onLayoutResize();
-    window.addEventListener('resize', this.onLayoutResize);
-  },
-  methods: {
-    ...mapMutations(['setBreadCrumb', 'setTagNavList', 'addTag', 'setLocal', 'setHomeRoute', 'closeTag']),
+	export default {
+		name: 'layout',
+		components: {
+			Defaults: () => import('@/layout/main/defaults.vue'),
+			Classic: () => import('@/layout/main/classic.vue'),
+			Transverse: () => import('@/layout/main/transverse.vue'),
+			Columns: () => import('@/layout/main/columns.vue'),
+			Mains: () => import('@/layout/component/main.vue'),
+		},
+		data() {
+			return {
+				headMenuNoShow: false,
+			};
+		},
+		computed: {
+			// 获取布局配置信息
+			getThemeConfig() {
+				console.log(this.$store.state.themeConfig.themeConfig, 'class');
+				return this.$store.state.themeConfig.themeConfig;
+			},
+			tagNavList() {
+				return this.$store.state.app.tagNavList;
+			},
+		},
+		watch: {
+			$route(newRoute) {
+				this.headMenuNoShow = this.$route.meta.fullScreen;
+				const {
+					name,
+					query,
+					params,
+					meta,
+					path
+				} = newRoute;
+				this.addTag({
+					route: {
+						name,
+						query,
+						params,
+						meta,
+						path
+					},
+					type: 'push',
+				});
+				this.setBreadCrumb(newRoute);
+				this.setTagNavList(getNewTagList(this.tagNavList, newRoute));
+			},
+		},
+		created() {
+			this.headMenuNoShow = this.$route.meta.fullScreen;
+			this.onLayoutResize();
+			window.addEventListener('resize', this.onLayoutResize);
+		},
+		methods: {
+			...mapMutations(['setBreadCrumb', 'setTagNavList', 'addTag', 'setLocal', 'setHomeRoute', 'closeTag']),
 
-    // 窗口大小改变时(适配移动端)
-    onLayoutResize() {
-      if (!Local.get('oldLayout')) Local.set('oldLayout', this.$store.state.themeConfig.themeConfig.layout);
-      const clientWidth = document.body.clientWidth;
-      if (clientWidth < 1000) {
-        this.$store.state.themeConfig.themeConfig.isCollapse = false;
-        this.bus.$emit('layoutMobileResize', {
-          layout: 'defaults',
-          clientWidth,
-        });
-      } else {
-        this.bus.$emit('layoutMobileResize', {
-          layout: Local.get('oldLayout') ? Local.get('oldLayout') : this.$store.state.themeConfig.themeConfig.layout,
-          clientWidth,
-        });
-      }
-    },
-  },
-  distroyed() {
-    window.removeEventListener('resize', this.onLayoutResize);
-  },
-};
-</script>
+			// 窗口大小改变时(适配移动端)
+			onLayoutResize() {
+				console.log(Local.get('oldLayout'), 'layout');
+				if (!Local.get('oldLayout')) Local.set('oldLayout', this.bus.$emit('layoutMobileResize', {
+					layout: 'defaults',
+					clientWidth,
+				}));
+				// Local.set('oldLayout', this.$store.state.themeConfig.themeConfig.layout);
+				const clientWidth = document.body.clientWidth;
+				if (clientWidth < 1000) {
+					this.$store.state.themeConfig.themeConfig.isCollapse = false;
+					this.bus.$emit('layoutMobileResize', {
+						layout: 'defaults',
+						clientWidth,
+					});
+				} else {
+					this.bus.$emit('layoutMobileResize', {
+						layout: 'defaults',
+						clientWidth,
+					});
+					// this.bus.$emit('layoutMobileResize', {
+					// 	layout: Local.get('oldLayout') ? Local.get('oldLayout') : this.$store.state.themeConfig
+					// 		.themeConfig.layout,
+					// 	clientWidth,
+					// });
+				}
+			},
+		},
+		distroyed() {
+			window.removeEventListener('resize', this.onLayoutResize);
+		},
+	};
+</script>

src/layout/main/columns.vue

@@ -1,33 +1,38 @@
 <template>
-  <el-container class="layout-container">
-    <ColumnsAside />
-    <div class="layout-columns-warp">
-      <Asides />
-      <el-container class="flex-center layout-backtop">
-        <Headers v-if="isFixedHeader" />
-        <el-scrollbar>
-          <Headers v-if="!isFixedHeader" />
-          <Mains />
-        </el-scrollbar>
-      </el-container>
-    </div>
-    <el-backtop target=".layout-backtop .el-scrollbar__wrap"></el-backtop>
-  </el-container>
+	<el-container class="layout-container">
+		<ColumnsAside />
+		<div class="layout-columns-warp">
+			<Asides />
+			<el-container class="flex-center layout-backtop">
+				<Headers v-if="isFixedHeader" />
+				<el-scrollbar>
+					<Headers v-if="!isFixedHeader" />
+					<Mains />
+				</el-scrollbar>
+			</el-container>
+		</div>
+		<el-backtop target=".layout-backtop .el-scrollbar__wrap"></el-backtop>
+	</el-container>
 </template>
 
 <script>
-import Asides from '@/layout/component/aside.vue';
-import Headers from '@/layout/component/header.vue';
-import Mains from '@/layout/component/main.vue';
-import ColumnsAside from '@/layout/component/columnsAside.vue';
-export default {
-  name: 'layoutColumns',
-  components: { Asides, Headers, Mains, ColumnsAside },
-  computed: {
-    // 是否开启固定 header
-    isFixedHeader() {
-      return this.$store.state.themeConfig.themeConfig.isFixedHeader;
-    },
-  },
-};
-</script>
+	import Asides from '@/layout/component/aside.vue';
+	import Headers from '@/layout/component/header.vue';
+	import Mains from '@/layout/component/main.vue';
+	import ColumnsAside from '@/layout/component/columnsAside.vue';
+	export default {
+		name: 'layoutColumns',
+		components: {
+			Asides,
+			Headers,
+			Mains,
+			ColumnsAside
+		},
+		computed: {
+			// 是否开启固定 header
+			isFixedHeader() {
+				return this.$store.state.themeConfig.themeConfig.isFixedHeader;
+			},
+		},
+	};
+</script>

src/layout/navBars/breadcrumb/user.vue

@@ -1,277 +1,331 @@
 <template>
-  <div class="layout-navbars-breadcrumb-user" :style="{ flex: layoutUserFlexNum }">
-    <div class="layout-navbars-breadcrumb-user-icon" @click="refresh">
-      <i class="el-icon-refresh-right" :title="$t('message.user.title7')"></i>
-    </div>
-    <div class="layout-navbars-breadcrumb-user-icon" @click="onSearchClick">
-      <i class="el-icon-search" :title="$t('message.user.title2')"></i>
-    </div>
+	<div class="layout-navbars-breadcrumb-user" :style="{ flex: layoutUserFlexNum }">
+		<div class="layout-navbars-breadcrumb-user-icon" @click="refresh">
+			<i class="el-icon-refresh-right" :title="$t('message.user.title7')"></i>
+		</div>
+		<div class="layout-navbars-breadcrumb-user-icon" @click="onSearchClick">
+			<i class="el-icon-search" :title="$t('message.user.title2')"></i>
+		</div>
 
-    <div class="layout-navbars-breadcrumb-user-icon">
-      <el-popover
-        placement="bottom"
-        trigger="click"
-        v-model="isShowUserNewsPopover"
-        :width="300"
-        popper-class="el-popover-pupop-user-news"
-      >
-        <el-badge :is-dot="isDot" @click.stop="openNews" slot="reference">
-          <i class="el-icon-bell" :title="$t('message.user.title4')"></i>
-        </el-badge>
-        <transition name="el-zoom-in-top">
-          <UserNews v-show="isShowUserNewsPopover" @haveNews="initIsDot" />
-        </transition>
-      </el-popover>
-    </div>
-    <div class="layout-navbars-breadcrumb-user-icon mr10" @click="onScreenfullClick">
-      <i
-        :title="isScreenfull ? $t('message.user.title6') : $t('message.user.title5')"
-        :class="!isScreenfull ? 'el-icon-full-screen' : 'el-icon-crop'"
-      ></i>
-    </div>
-    <el-dropdown :show-timeout="70" :hide-timeout="50" @command="onDropdownCommand">
-      <span class="layout-navbars-breadcrumb-user-link">
-        <img :src="getUserInfos.head_pic" class="layout-navbars-breadcrumb-user-link-photo mr5" />
-        {{ getUserInfos.account === '' ? 'test' : getUserInfos.account }}
-        <i class="el-icon-arrow-down el-icon--right"></i>
-      </span>
-      <el-dropdown-menu slot="dropdown">
-        <!-- <el-dropdown-item :command="homePath">{{ $t('message.user.dropdown1') }}</el-dropdown-item> -->
-        <el-dropdown-item command="user">{{ $t('message.user.dropdown6') }}</el-dropdown-item>
-        <!-- <el-dropdown-item command="wareHouse">{{ $t('message.user.dropdown6') }}</el-dropdown-item> -->
-        <!-- <el-dropdown-item command="/personal">{{ $t('message.user.dropdown2') }}</el-dropdown-item> -->
-        <!-- <el-dropdown-item command="/404">{{ $t('message.user.dropdown3') }}</el-dropdown-item> -->
-        <!-- <el-dropdown-item command="/401">{{ $t('message.user.dropdown4') }}</el-dropdown-item> -->
-        <el-dropdown-item divided command="logOut">{{ $t('message.user.dropdown5') }}</el-dropdown-item>
-      </el-dropdown-menu>
-    </el-dropdown>
-    <div class="layout-navbars-breadcrumb-user-icon" @click="onLayoutSetingClick">
-      <i class="el-icon-setting" :title="$t('message.user.title3')"></i>
-    </div>
-    <Search ref="searchRef" />
-  </div>
+		<div class="layout-navbars-breadcrumb-user-icon">
+			<el-popover placement="bottom" trigger="click" v-model="isShowUserNewsPopover" :width="300"
+				popper-class="el-popover-pupop-user-news">
+				<el-badge :is-dot="isDot" @click.stop="openNews" slot="reference">
+					<i class="el-icon-bell" :title="$t('message.user.title4')"></i>
+				</el-badge>
+				<transition name="el-zoom-in-top">
+					<UserNews v-show="isShowUserNewsPopover" @haveNews="initIsDot" />
+				</transition>
+			</el-popover>
+		</div>
+		<div class="layout-navbars-breadcrumb-user-icon mr10" @click="onScreenfullClick">
+			<i :title="isScreenfull ? $t('message.user.title6') : $t('message.user.title5')"
+				:class="!isScreenfull ? 'el-icon-full-screen' : 'el-icon-crop'"></i>
+		</div>
+		<el-dropdown :show-timeout="70" :hide-timeout="50" @command="onDropdownCommand">
+			<span class="layout-navbars-breadcrumb-user-link">
+				<img :src="getUserInfos.head_pic" class="layout-navbars-breadcrumb-user-link-photo mr5" />
+				{{ getUserInfos.account === '' ? 'test' : getUserInfos.account }}
+				<i class="el-icon-arrow-down el-icon--right"></i>
+			</span>
+			<el-dropdown-menu slot="dropdown">
+				<!-- <el-dropdown-item :command="homePath">{{ $t('message.user.dropdown1') }}</el-dropdown-item> -->
+				<el-dropdown-item command="user">{{ $t('message.user.dropdown6') }}</el-dropdown-item>
+				<!-- <el-dropdown-item command="wareHouse">{{ $t('message.user.dropdown6') }}</el-dropdown-item> -->
+				<!-- <el-dropdown-item command="/personal">{{ $t('message.user.dropdown2') }}</el-dropdown-item> -->
+				<!-- <el-dropdown-item command="/404">{{ $t('message.user.dropdown3') }}</el-dropdown-item> -->
+				<!-- <el-dropdown-item command="/401">{{ $t('message.user.dropdown4') }}</el-dropdown-item> -->
+				<el-dropdown-item divided command="logOut">{{ $t('message.user.dropdown5') }}</el-dropdown-item>
+			</el-dropdown-menu>
+		</el-dropdown>
+		<div class="layout-navbars-breadcrumb-user-icon" @click="onLayoutSetingClick">
+			<i class="el-icon-setting" :title="$t('message.user.title3')"></i>
+		</div>
+		<Search ref="searchRef" />
+	</div>
 </template>
 
 <script>
-import screenfull from 'screenfull';
-import { AccountLogout } from '@/api/account';
-import { removeCookies } from '@/libs/util';
-import { Session, Local } from '@/utils/storage.js';
-import UserNews from '@/layout/navBars/breadcrumb/userNews.vue';
-import Search from '@/layout/navBars/breadcrumb/search.vue';
-import settings from '../../../setting';
-export default {
-  name: 'layoutBreadcrumbUser',
-  components: { UserNews, Search },
-  data() {
-    return {
-      isScreenfull: false,
-      isShowUserNewsPopover: false,
-      disabledI18n: 'zh-cn',
-      disabledSize: '',
-      homePath: `${settings.routePre}/home`,
-      isDot: false,
-    };
-  },
-  computed: {
-    // 获取用户信息
-    getUserInfos() {
-      return this.$store.state.userInfo.userInfo;
-    },
-    // 设置弹性盒子布局 flex
-    layoutUserFlexNum() {
-      let { layout, isClassicSplitMenu } = this.$store.state.themeConfig.themeConfig;
-      let num = '';
-      if (layout === 'defaults' || (layout === 'classic' && !isClassicSplitMenu) || layout === 'columns') num = 1;
-      else num = null;
-      return num;
-    },
-  },
-  mounted() {
-    if (Local.get('themeConfigPrev')) {
-      this.initI18n();
-      this.initComponentSize();
-    }
-  },
-  methods: {
-    initIsDot(status) {
-      this.isDot = status;
-    },
-    openNews() {
-      this.isShowUserNewsPopover = !this.isShowUserNewsPopover;
-      this.isDot = false;
-    },
-    // 搜索点击
-    onSearchClick() {
-      this.$refs.searchRef.openSearch();
-    },
-    // 布局配置点击
-    onLayoutSetingClick() {
-      this.bus.$emit('openSetingsDrawer');
-    },
-    refresh() {
-      this.bus.$emit('onTagsViewRefreshRouterView', this.$route.path);
-    },
-    // 全屏点击
-    onScreenfullClick() {
-      if (!screenfull.isEnabled) {
-        this.$message.warning('暂不不支持全屏');
-        return false;
-      }
-      screenfull.toggle();
-      screenfull.on('change', () => {
-        if (screenfull.isFullscreen) this.isScreenfull = true;
-        else this.isScreenfull = false;
-      });
-      // 监听菜单 horizontal.vue 滚动条高度更新
-      this.bus.$emit('updateElScrollBar');
-    },
-    // 组件大小改变
-    onComponentSizeChange(size) {
-      Local.remove('themeConfigPrev');
-      this.$store.state.themeConfig.themeConfig.globalComponentSize = size;
-      Local.set('themeConfigPrev', this.$store.state.themeConfig.themeConfig);
-      this.$ELEMENT.size = size;
-      this.initComponentSize();
-      window.location.reload();
-    },
-    // 语言切换
-    onLanguageChange(lang) {
-      Local.remove('themeConfigPrev');
-      this.$store.state.themeConfig.themeConfig.globalI18n = lang;
-      Local.set('themeConfigPrev', this.$store.state.themeConfig.themeConfig);
-      this.$i18n.locale = lang;
-      this.initI18n();
-    },
-    // 初始化言语国际化
-    initI18n() {
-      switch (Local.get('themeConfigPrev').globalI18n) {
-        case 'zh-cn':
-          this.disabledI18n = 'zh-cn';
-          break;
-        case 'en':
-          this.disabledI18n = 'en';
-          break;
-        case 'zh-tw':
-          this.disabledI18n = 'zh-tw';
-          break;
-      }
-    },
-    // 初始化全局组件大小
-    initComponentSize() {
-      switch (Local.get('themeConfigPrev').globalComponentSize) {
-        case '':
-          this.disabledSize = '';
-          break;
-        case 'medium':
-          this.disabledSize = 'medium';
-          break;
-        case 'small':
-          this.disabledSize = 'small';
-          break;
-        case 'mini':
-          this.disabledSize = 'mini';
-          break;
-      }
-    },
-    // `dropdown 下拉菜单` 当前项点击
-    onDropdownCommand(path) {
-      if (path === 'logOut') {
-        setTimeout(() => {
-          this.$msgbox({
-            closeOnClickModal: false,
-            closeOnPressEscape: false,
-            title: this.$t('message.user.logOutTitle'),
-            message: this.$t('message.user.logOutMessage'),
-            showCancelButton: true,
-            confirmButtonText: this.$t('message.user.logOutConfirm'),
-            cancelButtonText: this.$t('message.user.logOutCancel'),
-            beforeClose: (action, instance, done) => {
-              if (action === 'confirm') {
-                instance.confirmButtonLoading = true;
-                instance.confirmButtonText = this.$t('message.user.logOutExit');
-                AccountLogout().then((res) => {
-                  done();
-                  this.$Message.success('您已成功退出');
-                  this.$store.commit('clearAll');
-                  // localStorage.clear();
-                  // sessionStorage.clear();
-                  removeCookies('token');
-                  removeCookies('expires_time');
-                  removeCookies('uuid');
-                  // this.$router.replace({ path: `${settings.routePre}/login` });
-                  setTimeout(() => {
-                    this.$router.replace({ name: 'login' });
-                    instance.confirmButtonLoading = false;
-                  }, 1500);
-                });
-              } else {
-                done();
-              }
-            },
-          })
-            .then(() => {
-              // 清除缓存/token等
-              Session.clear();
-              // 使用 reload 时，不需要调用 resetRoute() 重置路由
-              window.location.reload();
-            })
-            .catch(() => {});
-        }, 150);
-      } else if (path === 'user') {
-        this.$router.push({ name: 'systemUser' });
-      } else {
-        this.$router.push(path);
-      }
-    },
-  },
-};
+	import screenfull from 'screenfull';
+	import {
+		AccountLogout,
+		ShopLogout
+	} from '@/api/account';
+	import {
+		removeCookies
+	} from '@/libs/util';
+	import {
+		Session,
+		Local
+	} from '@/utils/storage.js';
+	import UserNews from '@/layout/navBars/breadcrumb/userNews.vue';
+	import Search from '@/layout/navBars/breadcrumb/search.vue';
+	import settings from '../../../setting';
+	export default {
+		name: 'layoutBreadcrumbUser',
+		components: {
+			UserNews,
+			Search
+		},
+		data() {
+			return {
+				isScreenfull: false,
+				isShowUserNewsPopover: false,
+				disabledI18n: 'zh-cn',
+				disabledSize: '',
+				homePath: `${settings.routePre}/home`,
+				isDot: false,
+			};
+		},
+		computed: {
+			// 获取用户信息
+			getUserInfos() {
+				return this.$store.state.userInfo.userInfo;
+			},
+			// 设置弹性盒子布局 flex
+			layoutUserFlexNum() {
+				let {
+					layout,
+					isClassicSplitMenu
+				} = this.$store.state.themeConfig.themeConfig;
+				let num = '';
+				if (layout === 'defaults' || (layout === 'classic' && !isClassicSplitMenu) || layout === 'columns') num =
+					1;
+				else num = null;
+				return num;
+			},
+		},
+		mounted() {
+			if (Local.get('themeConfigPrev')) {
+				this.initI18n();
+				this.initComponentSize();
+			}
+		},
+		methods: {
+			initIsDot(status) {
+				this.isDot = status;
+			},
+			openNews() {
+				this.isShowUserNewsPopover = !this.isShowUserNewsPopover;
+				this.isDot = false;
+			},
+			// 搜索点击
+			onSearchClick() {
+				this.$refs.searchRef.openSearch();
+			},
+			// 布局配置点击
+			onLayoutSetingClick() {
+				this.bus.$emit('openSetingsDrawer');
+			},
+			refresh() {
+				this.bus.$emit('onTagsViewRefreshRouterView', this.$route.path);
+			},
+			// 全屏点击
+			onScreenfullClick() {
+				if (!screenfull.isEnabled) {
+					this.$message.warning('暂不不支持全屏');
+					return false;
+				}
+				screenfull.toggle();
+				screenfull.on('change', () => {
+					if (screenfull.isFullscreen) this.isScreenfull = true;
+					else this.isScreenfull = false;
+				});
+				// 监听菜单 horizontal.vue 滚动条高度更新
+				this.bus.$emit('updateElScrollBar');
+			},
+			// 组件大小改变
+			onComponentSizeChange(size) {
+				Local.remove('themeConfigPrev');
+				this.$store.state.themeConfig.themeConfig.globalComponentSize = size;
+				Local.set('themeConfigPrev', this.$store.state.themeConfig.themeConfig);
+				this.$ELEMENT.size = size;
+				this.initComponentSize();
+				window.location.reload();
+			},
+			// 语言切换
+			onLanguageChange(lang) {
+				Local.remove('themeConfigPrev');
+				this.$store.state.themeConfig.themeConfig.globalI18n = lang;
+				Local.set('themeConfigPrev', this.$store.state.themeConfig.themeConfig);
+				this.$i18n.locale = lang;
+				this.initI18n();
+			},
+			// 初始化言语国际化
+			initI18n() {
+				switch (Local.get('themeConfigPrev').globalI18n) {
+					case 'zh-cn':
+						this.disabledI18n = 'zh-cn';
+						break;
+					case 'en':
+						this.disabledI18n = 'en';
+						break;
+					case 'zh-tw':
+						this.disabledI18n = 'zh-tw';
+						break;
+				}
+			},
+			// 初始化全局组件大小
+			initComponentSize() {
+				switch (Local.get('themeConfigPrev').globalComponentSize) {
+					case '':
+						this.disabledSize = '';
+						break;
+					case 'medium':
+						this.disabledSize = 'medium';
+						break;
+					case 'small':
+						this.disabledSize = 'small';
+						break;
+					case 'mini':
+						this.disabledSize = 'mini';
+						break;
+				}
+			},
+			// `dropdown 下拉菜单` 当前项点击
+			onDropdownCommand(path) {
+				if (path === 'logOut') {
+					setTimeout(() => {
+						this.$msgbox({
+								closeOnClickModal: false,
+								closeOnPressEscape: false,
+								title: this.$t('message.user.logOutTitle'),
+								message: this.$t('message.user.logOutMessage'),
+								showCancelButton: true,
+								confirmButtonText: this.$t('message.user.logOutConfirm'),
+								cancelButtonText: this.$t('message.user.logOutCancel'),
+								beforeClose: (action, instance, done) => {
+									console.log(done, 'done');
+									if (action === 'confirm') {
+										instance.confirmButtonLoading = true;
+										instance.confirmButtonText = this.$t('message.user.logOutExit');
+										console.log(this.$store.state.userInfo);
+										let type = this.$store.state.userInfo.type
+										console.log(type, 'type');
+										if (type == 'admin') {
+											AccountLogout().then((res) => {
+												// done();
+												this.$Message.success('您已成功退出');
+												this.$store.commit('clearAll');
+												// localStorage.clear();
+												// sessionStorage.clear();
+												removeCookies('token');
+												removeCookies('expires_time');
+												removeCookies('uuid');
+												console.log(
+													`${settings.routePre}/shop/login`,
+													'admin'
+												);
+												// this.$router.replace({ path: `${settings.routePre}/login` });
+												setTimeout(() => {
+													this.$router.replace({
+														name: 'login'
+													});
+													done();
+													instance.confirmButtonLoading = false;
+												}, 1500);
+											});
+										} else {
+											ShopLogout().then((res) => {
+												// done();
+												this.$Message.success('您已成功退出');
+												this.$store.commit('clearAll');
+												// localStorage.clear();
+												// sessionStorage.clear();
+												removeCookies('token');
+												removeCookies('expires_time');
+												removeCookies('uuid');
+												console.log(
+													`${settings.routePre}/shop/login`,
+													'khd'
+												);
+												setTimeout(() => {
+													this.$router.replace(
+														`${settings.routePre}/shop/login`
+													);
+													instance.confirmButtonLoading = false;
+													done();
+												}, 1500);
+											});
+										}
+
+									} else {
+										done();
+									}
+								},
+							})
+							.then(() => {
+								// 清除缓存/token等
+								Session.clear();
+								// 使用 reload 时，不需要调用 resetRoute() 重置路由
+								window.location.reload();
+							})
+							.catch(() => {});
+					}, 150);
+				} else if (path === 'user') {
+					this.$router.push({
+						name: 'systemUser'
+					});
+				} else {
+					this.$router.push(path);
+				}
+			},
+		},
+	};
 </script>
 
 <style scoped lang="scss">
-.layout-navbars-breadcrumb-user {
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  &-link {
-    height: 100%;
-    display: flex;
-    align-items: center;
-    white-space: nowrap;
-    &-photo {
-      width: 30px;
-      height: 30px;
-      border-radius: 100%;
-    }
-  }
-  &-icon {
-    padding: 0 10px;
-    cursor: pointer;
-    color: var(--prev-bg-topBarColor);
-    height: 50px;
-    line-height: 50px;
-    display: flex;
-    align-items: center;
-    &:hover {
-      background: var(--prev-color-hover);
-      i {
-        display: inline-block;
-        animation: logoAnimation 0.3s ease-in-out;
-      }
-    }
-  }
-  & ::v-deep .el-dropdown {
-    color: var(--prev-bg-topBarColor);
-    cursor: pointer;
-  }
-  & ::v-deep .el-badge {
-    height: 40px;
-    line-height: 40px;
-    display: flex;
-    align-items: center;
-  }
-  & ::v-deep .el-badge__content.is-fixed {
-    top: 12px;
-  }
-}
-</style>
+	.layout-navbars-breadcrumb-user {
+		display: flex;
+		align-items: center;
+		justify-content: flex-end;
+
+		&-link {
+			height: 100%;
+			display: flex;
+			align-items: center;
+			white-space: nowrap;
+
+			&-photo {
+				width: 30px;
+				height: 30px;
+				border-radius: 100%;
+			}
+		}
+
+		&-icon {
+			padding: 0 10px;
+			cursor: pointer;
+			color: var(--prev-bg-topBarColor);
+			height: 50px;
+			line-height: 50px;
+			display: flex;
+			align-items: center;
+
+			&:hover {
+				background: var(--prev-color-hover);
+
+				i {
+					display: inline-block;
+					animation: logoAnimation 0.3s ease-in-out;
+				}
+			}
+		}
+
+		& ::v-deep .el-dropdown {
+			color: var(--prev-bg-topBarColor);
+			cursor: pointer;
+		}
+
+		& ::v-deep .el-badge {
+			height: 40px;
+			line-height: 40px;
+			display: flex;
+			align-items: center;
+		}
+
+		& ::v-deep .el-badge__content.is-fixed {
+			top: 12px;
+		}
+	}
+</style>

src/layout/navMenu/subItem.vue

@@ -5,43 +5,43 @@
  * @Description: 
 -->
 <template>
-  <div>
-    <template v-for="val in chil">
-      <el-submenu :index="val.path" :key="val.path" v-if="val.is_show && val.children && val.children.length > 0">
-        <template slot="title">
-          <i class="ivu-icon" :class="val.icon"></i>
-          <span>{{ $t(val.title) }}</span>
-        </template>
-        <sub-item :chil="val.children" />
-      </el-submenu>
-      <template v-else-if="val.is_show">
-        <el-menu-item :index="val.path" :key="val.path">
-          <template v-if="!val.isLink || (val.isLink && val.isIframe)">
-            <i class="ivu-icon" :class="val.icon ? val.icon : ''"></i>
-            <span>{{ $t(val.title) }}</span>
-          </template>
-          <template v-else>
-            <a :href="val.isLink" target="_blank">
-              <i class="ivu-icon" :class="val.icon ? val.icon : ''"></i>
-              {{ $t(val.title) }}
-            </a>
-          </template>
-        </el-menu-item>
-      </template>
-    </template>
-  </div>
+	<div>
+		<template v-for="val in chil">
+			<el-submenu :index="val.path" :key="val.path" v-if="val.is_show && val.children && val.children.length > 0">
+				<template slot="title">
+					<i class="ivu-icon" :class="val.icon"></i>
+					<span>{{ $t(val.title) }}</span>
+				</template>
+				<sub-item :chil="val.children" />
+			</el-submenu>
+			<template v-else-if="val.is_show">
+				<el-menu-item :index="val.path" :key="val.path">
+					<template v-if="!val.isLink || (val.isLink && val.isIframe)">
+						<i class="ivu-icon" :class="val.icon ? val.icon : ''"></i>
+						<span>{{ $t(val.title) }}</span>
+					</template>
+					<template v-else>
+						<a :href="val.isLink" target="_blank">
+							<i class="ivu-icon" :class="val.icon ? val.icon : ''"></i>
+							{{ $t(val.title) }}
+						</a>
+					</template>
+				</el-menu-item>
+			</template>
+		</template>
+	</div>
 </template>
 
 <script>
-export default {
-  name: 'subItem',
-  props: {
-    chil: {
-      type: Array,
-      default() {
-        return [];
-      },
-    },
-  },
-};
-</script>
+	export default {
+		name: 'subItem',
+		props: {
+			chil: {
+				type: Array,
+				default () {
+					return [];
+				},
+			},
+		},
+	};
+</script>

src/layout/navMenu/vertical.vue

@@ -1,106 +1,97 @@
 <template>
-  <div>
-    <el-menu
-      router
-      :class="setColumnsAsideStyle"
-      background-color="transparent"
-      :default-active="activePath || defaultActive"
-      :collapse="setIsCollapse"
-      :unique-opened="getThemeConfig.isUniqueOpened"
-      :collapse-transition="true"
-    >
-      <template v-for="val in menuList">
-        <el-submenu
-          :index="val.path"
-          v-if="val.is_show && val.children && val.children.length > 0"
-          :key="val.path"
-        >
-          <template slot="title">
-            <Icon
-              :class="
+	<div>
+		<el-menu router :class="setColumnsAsideStyle" background-color="transparent"
+			:default-active="activePath || defaultActive" :collapse="setIsCollapse"
+			:unique-opened="getThemeConfig.isUniqueOpened" :collapse-transition="true">
+			<template v-for="val in menuList">
+				<el-submenu :index="val.path" v-if="val.is_show && val.children && val.children.length > 0"
+					:key="val.path">
+					<template slot="title">
+						<Icon :class="
                 ['defaults', 'classic'].includes(getThemeConfig.layout) && getThemeConfig.isCollapse ? 'center' : 'mr10'
-              "
-              :type="val.icon ? val.icon : ''"
-            />
-            <span>{{ $t(val.title) }} </span>
-          </template>
-          <SubItem :chil="val.children" />
-        </el-submenu>
-        <template v-else-if="val.is_show">
-          <el-menu-item :index="val.path" :key="val.path">
-            <Icon
-              :class="
+              " :type="val.icon ? val.icon : ''" />
+						<span>{{ $t(val.title) }} </span>
+					</template>
+					<SubItem :chil="val.children" />
+				</el-submenu>
+				<template v-else-if="val.is_show">
+					<el-menu-item :index="val.path" :key="val.path">
+						<Icon :class="
                 ['defaults', 'classic'].includes(getThemeConfig.layout) && getThemeConfig.isCollapse ? 'center' : 'mr10'
-              "
-              :type="val.icon ? val.icon : ''"
-            />
-            <template slot="title" v-if="!val.isLink || (val.isLink && val.isIframe)">
-              <span>{{ $t(val.title) }}</span>
-            </template>
-            <template slot="title" v-else>
-              <a :href="val.isLink" target="_blank">{{ $t(val.title) }}</a>
-            </template>
-          </el-menu-item>
-        </template>
-      </template>
-    </el-menu>
-  </div>
+              " :type="val.icon ? val.icon : ''" />
+						<template slot="title" v-if="!val.isLink || (val.isLink && val.isIframe)">
+							<span>{{ $t(val.title) }}</span>
+						</template>
+						<template slot="title" v-else>
+							<a :href="val.isLink" target="_blank">{{ $t(val.title) }}</a>
+						</template>
+					</el-menu-item>
+				</template>
+			</template>
+		</el-menu>
+	</div>
 </template>
 
 <script>
-import SubItem from '@/layout/navMenu/subItem.vue';
-import { mapState } from 'vuex';
+	import SubItem from '@/layout/navMenu/subItem.vue';
+	import {
+		mapState
+	} from 'vuex';
 
-export default {
-  name: 'navMenuVertical',
-  components: { SubItem },
-  props: {
-    menuList: {
-      type: Array,
-      default() {
-        return [];
-      },
-    },
-  },
-  data() {
-    return {
-      defaultActive: this.$route.path,
-      onRoutes: '',
-    };
-  },
-  computed: {
-    ...mapState('menu', ['activePath']),
-    // 设置分栏高亮风格
-    setColumnsAsideStyle() {
-      return this.$store.state.themeConfig.themeConfig.columnsAsideStyle;
-    },
-    // 获取布局配置信息
-    getThemeConfig() {
-      return this.$store.state.themeConfig.themeConfig;
-    },
-    // 设置左侧菜单是否展开/收起
-    setIsCollapse() {
-      return document.body.clientWidth < 1000 ? false : this.$store.state.themeConfig.themeConfig.isCollapse;
-    },
-  },
-  watch: {
-    // 监听路由的变化
-    $route: {
-      handler(to) {
-        this.defaultActive = to.path;
-        const clientWidth = document.body.clientWidth;
-        if (clientWidth < 1000) this.$store.state.themeConfig.themeConfig.isCollapse = false;
-      },
-      deep: true,
-    },
-  },
-  created() {},
-};
+	export default {
+		name: 'navMenuVertical',
+		components: {
+			SubItem
+		},
+		props: {
+			menuList: {
+				type: Array,
+				default () {
+					return [];
+				},
+			},
+		},
+		data() {
+			return {
+				defaultActive: this.$route.path,
+				onRoutes: '',
+			};
+		},
+		computed: {
+			...mapState('menu', ['activePath']),
+			// 设置分栏高亮风格
+			setColumnsAsideStyle() {
+				return this.$store.state.themeConfig.themeConfig.columnsAsideStyle;
+			},
+			// 获取布局配置信息
+			getThemeConfig() {
+				return this.$store.state.themeConfig.themeConfig;
+			},
+			// 设置左侧菜单是否展开/收起
+			setIsCollapse() {
+				return document.body.clientWidth < 1000 ? false : this.$store.state.themeConfig.themeConfig.isCollapse;
+			},
+		},
+		watch: {
+			// 监听路由的变化
+			$route: {
+				handler(to) {
+					this.defaultActive = to.path;
+					const clientWidth = document.body.clientWidth;
+					if (clientWidth < 1000) this.$store.state.themeConfig.themeConfig.isCollapse = false;
+				},
+				deep: true,
+			},
+		},
+		created() {
+			console.log(this.menuList, 'vertical');
+		},
+	};
 </script>
 <style lang="scss" scoped>
-/deep/ .center {
-  text-align: center;
-  margin-right: 0 !important;
-  margin-left: 5px;
-}
-</style>
+	/deep/ .center {
+		text-align: center;
+		margin-right: 0 !important;
+		margin-left: 5px;
+	}
+</style>

src/pages/account/login/index.vue

@@ -231,6 +231,7 @@
 
 						// 记录用户信息
 						this.$store.commit('userInfo/name', data.user_info.account);
+						this.$store.commit('userInfo/type', 'admin');
 						this.$store.commit('userInfo/avatar', data.user_info.head_pic);
 						this.$store.commit('userInfo/access', data.unique_auth);
 						this.$store.commit('userInfo/logo', data.logo);
@@ -338,11 +339,12 @@
 			handleSubmit(name) {
 				this.$refs[name].validate((valid) => {
 					if (valid) {
-						if (this.login_captcha == 1) {
-							this.$refs.verify.show();
-						} else {
-							this.closeModel();
-						}
+						this.closeModel();
+						// if (this.login_captcha == 1) {
+						// 	this.$refs.verify.show();
+						// } else {
+						// 	this.closeModel();
+						// }
 					}
 				});
 			},

src/pages/account/shoplogin/index.vue

@@ -224,6 +224,7 @@
 
 						this.$store.commit('userInfo/uniqueAuth', data.unique_auth);
 						this.$store.commit('userInfo/userInfo', data.user_info);
+						this.$store.commit('userInfo/type', 'shanghu');
 						// 保存菜单信息
 						this.$store.commit('menus/setopenMenus', []);
 						this.$store.commit('menus/getmenusNav', data.menus);
@@ -343,13 +344,15 @@
 				}
 			},
 			handleSubmit(name) {
+				console.log(name)
 				this.$refs[name].validate((valid) => {
 					if (valid) {
-						if (this.login_captcha == 1) {
-							this.$refs.verify.show();
-						} else {
-							this.closeModel();
-						}
+						this.closeModel();
+						// if (this.login_captcha == 1) {
+						// 	this.$refs.verify.show();
+						// } else {
+						// 	this.closeModel();
+						// }
 					}
 				});
 			},

src/pages/notify/smsConfig/index.vue

@@ -1,377 +1,402 @@
 <template>
-  <div>
-    <div class="i-layout-page-header header-title">
-      <span class="ivu-page-header-title" v-if="!isShowList"
-        >一号通账户<span class="title-tips">快速开通短信接口、物流接口、商品采集接口、电子面单接口等</span></span
-      >
-      <div v-if="isShowList" class="acea-row row-between-wrapper picTxt">
-        <div slot="content">
-          <Avatar class="dashboard-workplace-header-avatar" :src="imgUrl" />
-          <div class="dashboard-workplace-header-tip">
-            <p class="dashboard-workplace-header-tip-title">{{ smsAccount }}，祝您每一天开心！</p>
-            <p class="dashboard-workplace-header-tip-desc">
-              <a href="#" @click="onChangePassswordIndex">修改密码</a>
-              <Divider type="vertical" />
-              <!-- <a href="#" @click="onChangePhone">修改手机号</a>
+	<div>
+		<div class="i-layout-page-header header-title">
+			<span class="ivu-page-header-title" v-if="!isShowList">一号通账户<span
+					class="title-tips">快速开通短信接口、物流接口、商品采集接口、电子面单接口等</span></span>
+			<div v-if="isShowList" class="acea-row row-between-wrapper picTxt">
+				<div slot="content">
+					<Avatar class="dashboard-workplace-header-avatar" :src="imgUrl" />
+					<div class="dashboard-workplace-header-tip">
+						<p class="dashboard-workplace-header-tip-title">{{ smsAccount }}，祝您每一天开心！</p>
+						<p class="dashboard-workplace-header-tip-desc">
+							<a href="#" @click="onChangePassswordIndex">修改密码</a>
+							<Divider type="vertical" />
+							<!-- <a href="#" @click="onChangePhone">修改手机号</a>
                 <Divider type="vertical" /> -->
-              <a href="#" @click="signOut">退出登录</a>
-            </p>
-          </div>
-        </div>
-        <div class="dashboard">
-          <div class="dashboard-workplace-header-extra">
-            <div class="acea-row">
-              <div class="header-extra">
-                <p class="mb5"><span>短信条数</span></p>
-                <div v-if="sms.open === 0">
-                  <p>暂未开通</p>
-                  <Button size="small" type="primary" class="mt3 samll_font" @click="onOpen('sms')">开通服务</Button>
-                </div>
-                <div v-else>
-                  <p>{{ sms.num || 0 }}</p>
-                  <Button
-                    size="small"
-                    type="primary"
-                    class="mt3 samll_font"
-                    style="textalign: center"
-                    @click="mealPay('sms')"
-                    >套餐购买</Button
-                  >
-                </div>
-              </div>
-              <div class="header-extra">
-                <p class="mb5"><span>采集次数</span></p>
-                <div v-if="copy.open === 0">
-                  <p>暂未开通</p>
-                  <Button size="small" type="primary" class="mt3 samll_font" @click="onOpen('copy')">开通服务</Button>
-                </div>
-                <div v-else>
-                  <p>{{ copy.num || 0 }}</p>
-                  <Button size="small" type="primary" class="mt3 samll_font" @click="mealPay('copy')">套餐购买</Button>
-                </div>
-              </div>
-              <div class="header-extra">
-                <p class="mb5"><span>物流查询次数</span></p>
-                <div v-if="query.open === 0">
-                  <p>暂未开通</p>
-                  <Button size="small" type="primary" class="mt3 samll_font" @click="onOpen('query')">开通服务</Button>
-                </div>
-                <div v-else>
-                  <p>{{ query.num || 0 }}</p>
-                  <Button size="small" type="primary" class="mt3 samll_font" @click="mealPay('expr_query')"
-                    >套餐购买</Button
-                  >
-                </div>
-              </div>
-              <div class="header-extra" style="border: none">
-                <p class="mb5"><span>面单打印次数</span></p>
-                <div v-if="dump.open === 0">
-                  <p>暂未开通</p>
-                  <Button size="small" type="primary" class="mt3 samll_font" @click="onOpen('dump')">开通服务</Button>
-                </div>
-                <div v-else>
-                  <p>{{ dump.num || 0 }}</p>
-                  <Button size="small" type="primary" class="mt3 samll_font" @click="mealPay('expr_dump')"
-                    >套餐购买</Button
-                  >
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <Card :bordered="false" dis-hover class="ivu-mt" style="min-height: 600px">
-      <login-from
-        @on-change="onChangePasssword"
-        v-if="isShowLogn"
-        @on-changes="onChangeReg"
-        @on-Login="onLogin"
-      ></login-from>
-      <forget-password v-if="isShow" @goback="goback" @on-Login="onLogin" :isIndex="isIndex"></forget-password>
-      <register-from v-if="isShowReg" @on-change="logoup"></register-from>
-      <table-list
-        ref="tableLists"
-        v-if="isShowList"
-        :sms="sms"
-        :copy="copy"
-        :dump="dump"
-        :query="query"
-        :accountInfo="accountInfo"
-        @openService="openService"
-      ></table-list>
-      <forget-phone v-if="isForgetPhone" @gobackPhone="gobackPhone" @on-Login="onLogin"></forget-phone>
-      <Spin size="large" fix v-if="spinShow"></Spin>
-    </Card>
-  </div>
+							<a href="#" @click="signOut">退出登录</a>
+						</p>
+					</div>
+				</div>
+				<div class="dashboard">
+					<div class="dashboard-workplace-header-extra">
+						<div class="acea-row">
+							<div class="header-extra">
+								<p class="mb5"><span>短信条数</span></p>
+								<div v-if="sms.open === 0">
+									<p>暂未开通</p>
+									<Button size="small" type="primary" class="mt3 samll_font"
+										@click="onOpen('sms')">开通服务</Button>
+								</div>
+								<div v-else>
+									<p>{{ sms.num || 0 }}</p>
+									<Button size="small" type="primary" class="mt3 samll_font" style="textalign: center"
+										@click="mealPay('sms')">套餐购买</Button>
+								</div>
+							</div>
+							<div class="header-extra">
+								<p class="mb5"><span>采集次数</span></p>
+								<div v-if="copy.open === 0">
+									<p>暂未开通</p>
+									<Button size="small" type="primary" class="mt3 samll_font"
+										@click="onOpen('copy')">开通服务</Button>
+								</div>
+								<div v-else>
+									<p>{{ copy.num || 0 }}</p>
+									<Button size="small" type="primary" class="mt3 samll_font"
+										@click="mealPay('copy')">套餐购买</Button>
+								</div>
+							</div>
+							<div class="header-extra">
+								<p class="mb5"><span>物流查询次数</span></p>
+								<div v-if="query.open === 0">
+									<p>暂未开通</p>
+									<Button size="small" type="primary" class="mt3 samll_font"
+										@click="onOpen('query')">开通服务</Button>
+								</div>
+								<div v-else>
+									<p>{{ query.num || 0 }}</p>
+									<Button size="small" type="primary" class="mt3 samll_font"
+										@click="mealPay('expr_query')">套餐购买</Button>
+								</div>
+							</div>
+							<div class="header-extra" style="border: none">
+								<p class="mb5"><span>面单打印次数</span></p>
+								<div v-if="dump.open === 0">
+									<p>暂未开通</p>
+									<Button size="small" type="primary" class="mt3 samll_font"
+										@click="onOpen('dump')">开通服务</Button>
+								</div>
+								<div v-else>
+									<p>{{ dump.num || 0 }}</p>
+									<Button size="small" type="primary" class="mt3 samll_font"
+										@click="mealPay('expr_dump')">套餐购买</Button>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+		<Card :bordered="false" dis-hover class="ivu-mt" style="min-height: 600px">
+			<login-from @on-change="onChangePasssword" v-if="isShowLogn" @on-changes="onChangeReg"
+				@on-Login="onLogin"></login-from>
+			<forget-password v-if="isShow" @goback="goback" @on-Login="onLogin" :isIndex="isIndex"></forget-password>
+			<register-from v-if="isShowReg" @on-change="logoup"></register-from>
+			<table-list ref="tableLists" v-if="isShowList" :sms="sms" :copy="copy" :dump="dump" :query="query"
+				:accountInfo="accountInfo" @openService="openService"></table-list>
+			<forget-phone v-if="isForgetPhone" @gobackPhone="gobackPhone" @on-Login="onLogin"></forget-phone>
+			<Spin size="large" fix v-if="spinShow"></Spin>
+		</Card>
+	</div>
 </template>
 
 <script>
-import loginFrom from './components/loginFrom';
-import forgetPassword from './components/forgetPassword';
-import registerFrom from './components/register';
-import tableList from './tableList';
-import forgetPhone from './components/forgetPhone';
-import { isLoginApi, logoutApi, smsNumberApi, serveInfoApi } from '@/api/setting';
-export default {
-  name: 'smsConfig',
-  components: { loginFrom, forgetPassword, registerFrom, tableList, forgetPhone },
-  data() {
-    return {
-      imgUrl: require('@/assets/images/ren.png'),
-      spinShow: false,
-      isShowLogn: false, // 登录
-      isShow: false, // 修改密码
-      isShowReg: false, // 注册
-      isShowList: false, // 登录之后列表
-      smsAccount: '',
-      accountInfo: {},
-      isForgetPhone: false, // 修改手机号
-      isIndex: false, // 判断忘记密码返回的路径
-      sms: { open: 0 }, // 短信信息
-      query: { open: 0 }, // 物流查询
-      dump: { open: 0 }, // 电子面单打印
-      copy: { open: 0 }, // 商品采集
-    };
-  },
-  created() {
-    this.onIsLogin();
-  },
-  methods: {
-    onChangePhone() {
-      this.isForgetPhone = true;
-      this.isShowLogn = false;
-      this.isShowList = false;
-    },
-    onOpen(val) {
-      this.$refs.tableLists.onOpenIndex(val);
-    },
-    mealPay(val) {
-      this.$router.push({ path: this.$routeProStr + '/setting/sms/sms_pay/index', query: { type: val } });
-    },
-    // 开通服务
-    openService(val) {
-      switch (val) {
-        case 'sms':
-          this.sms.open = 1;
-          break;
-        case 'copy':
-          this.copy.open = 1;
-          break;
-        case 'query':
-          this.query.open = 1;
-          break;
-        default:
-          this.dump.open = 1;
-          break;
-      }
-    },
-    // 平台用户信息
-    getServeInfo() {
-      this.spinShow = true;
-      serveInfoApi()
-        .then(async (res) => {
-          let data = res.data;
-          this.sms = {
-            num: data.sms.num,
-            open: data.sms.open,
-            surp: data.sms.open,
-          };
-          this.query = {
-            num: data.query.num,
-            open: data.query.open,
-            surp: data.query.open,
-          };
-          this.dump = {
-            num: data.dump.num,
-            open: data.dump.open,
-            surp: data.dump.open,
-          };
-          this.copy = {
-            num: data.copy.num,
-            open: data.copy.open,
-            surp: data.copy.open,
-          };
-          this.spinShow = false;
-          this.smsAccount = data.account;
-          this.accountInfo = data;
-        })
-        .catch((res) => {
-          this.$Message.error(res.msg);
-          this.isShowLogn = true;
-          this.isShowList = false;
-          this.spinShow = false;
-        });
-    },
-    // 查看是否登录
-    onIsLogin() {
-      this.spinShow = true;
-      isLoginApi()
-        .then(async (res) => {
-          let data = res.data;
-          this.isShowLogn = !data.status;
-          this.isShowList = data.status;
-          this.spinShow = false;
-          if (data.status) {
-            this.getServeInfo();
-          }
-        })
-        .catch((res) => {
-          this.spinShow = false;
-          this.$Message.error(res.msg);
-        });
-    },
-    // 退出登录
-    signOut() {
-      logoutApi()
-        .then(async (res) => {
-          this.isShowLogn = true;
-          this.isShowList = false;
-        })
-        .catch((res) => {
-          this.$Message.error(res.msg);
-        });
-    },
-    // 修改密码
-    onChangePassswordIndex() {
-      this.isIndex = true;
-      this.passsword();
-    },
-    // 忘记密码
-    onChangePasssword() {
-      this.isIndex = false;
-      this.passsword();
-      // this.isShowLogn = false;
-      // this.isShow = true;
-      // this.isShowList = false;
-    },
-    passsword() {
-      this.isShowLogn = false;
-      this.isShow = true;
-      this.isShowList = false;
-    },
+	import loginFrom from './components/loginFrom';
+	import forgetPassword from './components/forgetPassword';
+	import registerFrom from './components/register';
+	import tableList from './tableList';
+	import forgetPhone from './components/forgetPhone';
+	import {
+		isLoginApi,
+		logoutApi,
+		smsNumberApi,
+		serveInfoApi
+	} from '@/api/setting';
+	export default {
+		name: 'smsConfig',
+		components: {
+			loginFrom,
+			forgetPassword,
+			registerFrom,
+			tableList,
+			forgetPhone
+		},
+		data() {
+			return {
+				imgUrl: require('@/assets/images/ren.png'),
+				spinShow: false,
+				isShowLogn: false, // 登录
+				isShow: false, // 修改密码
+				isShowReg: false, // 注册
+				isShowList: false, // 登录之后列表
+				smsAccount: '',
+				accountInfo: {},
+				isForgetPhone: false, // 修改手机号
+				isIndex: false, // 判断忘记密码返回的路径
+				sms: {
+					open: 0
+				}, // 短信信息
+				query: {
+					open: 0
+				}, // 物流查询
+				dump: {
+					open: 0
+				}, // 电子面单打印
+				copy: {
+					open: 0
+				}, // 商品采集
+			};
+		},
+		created() {
+			this.onIsLogin();
+		},
+		methods: {
+			onChangePhone() {
+				this.isForgetPhone = true;
+				this.isShowLogn = false;
+				this.isShowList = false;
+			},
+			onOpen(val) {
+				this.$refs.tableLists.onOpenIndex(val);
+			},
+			mealPay(val) {
+				this.$router.push({
+					path: this.$routeProStr + '/setting/sms/sms_pay/index',
+					query: {
+						type: val
+					}
+				});
+			},
+			// 开通服务
+			openService(val) {
+				switch (val) {
+					case 'sms':
+						this.sms.open = 1;
+						break;
+					case 'copy':
+						this.copy.open = 1;
+						break;
+					case 'query':
+						this.query.open = 1;
+						break;
+					default:
+						this.dump.open = 1;
+						break;
+				}
+			},
+			// 平台用户信息
+			getServeInfo() {
+				this.spinShow = true;
+				serveInfoApi()
+					.then(async (res) => {
+						let data = res.data;
+						this.sms = {
+							num: data.sms.num,
+							open: data.sms.open,
+							surp: data.sms.open,
+						};
+						this.query = {
+							num: data.query.num,
+							open: data.query.open,
+							surp: data.query.open,
+						};
+						this.dump = {
+							num: data.dump.num,
+							open: data.dump.open,
+							surp: data.dump.open,
+						};
+						this.copy = {
+							num: data.copy.num,
+							open: data.copy.open,
+							surp: data.copy.open,
+						};
+						this.spinShow = false;
+						this.smsAccount = data.account;
+						this.accountInfo = data;
+					})
+					.catch((res) => {
+						this.$Message.error(res.msg);
+						this.isShowLogn = true;
+						this.isShowList = false;
+						this.spinShow = false;
+					});
+			},
+			// 查看是否登录
+			onIsLogin() {
+				this.spinShow = true;
+				isLoginApi()
+					.then(async (res) => {
+						let data = res.data;
+						this.isShowLogn = !data.status;
+						this.isShowList = data.status;
+						this.spinShow = false;
+						if (data.status) {
+							this.getServeInfo();
+						}
+					})
+					.catch((res) => {
+						this.spinShow = false;
+						this.$Message.error(res.msg);
+					});
+			},
+			// 退出登录
+			signOut() {
+				logoutApi()
+					.then(async (res) => {
+						this.isShowLogn = true;
+						this.isShowList = false;
+					})
+					.catch((res) => {
+						this.$Message.error(res.msg);
+					});
+			},
+			// 修改密码
+			onChangePassswordIndex() {
+				this.isIndex = true;
+				this.passsword();
+			},
+			// 忘记密码
+			onChangePasssword() {
+				this.isIndex = false;
+				this.passsword();
+				// this.isShowLogn = false;
+				// this.isShow = true;
+				// this.isShowList = false;
+			},
+			passsword() {
+				this.isShowLogn = false;
+				this.isShow = true;
+				this.isShowList = false;
+			},
 
-    // 立即注册
-    onChangeReg() {
-      this.isShowLogn = false;
-      this.isShow = false;
-      this.isShowReg = true;
-    },
-    // 立即登录
-    logoup() {
-      this.isShowLogn = true;
-      this.isShow = false;
-      this.isShowReg = false;
-    },
-    // 登录跳转
-    onLogin() {
-      let url = this.$route.query.url;
-      if (url) {
-        this.$router.replace(url + '?type=' + this.$route.query.type);
-      } else {
-        this.isShowLogn = false;
-        this.isShow = false;
-        this.isShowReg = false;
-        this.isForgetPhone = false;
-        this.isShowList = true;
-        this.getServeInfo();
-      }
-    },
-    // 密码返回
-    goback() {
-      if (this.isIndex) {
-        this.isShowList = true;
-        this.isShow = false;
-      } else {
-        this.isShowLogn = true;
-        this.isShow = false;
-      }
-    },
-    // 手机号返回
-    gobackPhone() {
-      this.isShowList = true;
-      this.isForgetPhone = false;
-    },
-  },
-};
+			// 立即注册
+			onChangeReg() {
+				this.isShowLogn = false;
+				this.isShow = false;
+				this.isShowReg = true;
+			},
+			// 立即登录
+			logoup() {
+				this.isShowLogn = true;
+				this.isShow = false;
+				this.isShowReg = false;
+			},
+			// 登录跳转
+			onLogin() {
+				let url = this.$route.query.url;
+				if (url) {
+					this.$router.replace(url + '?type=' + this.$route.query.type);
+				} else {
+					this.isShowLogn = false;
+					this.isShow = false;
+					this.isShowReg = false;
+					this.isForgetPhone = false;
+					this.isShowList = true;
+					this.getServeInfo();
+				}
+			},
+			// 密码返回
+			goback() {
+				if (this.isIndex) {
+					this.isShowList = true;
+					this.isShow = false;
+				} else {
+					this.isShowLogn = true;
+					this.isShow = false;
+				}
+			},
+			// 手机号返回
+			gobackPhone() {
+				this.isShowList = true;
+				this.isForgetPhone = false;
+			},
+		},
+	};
 </script>
 
 <style lang="less" scoped>
-.picTxt {
-  padding: 8px 0 12px;
-}
-.dashboard {
-  width: auto !important;
-  min-width: 300px;
-}
-.header-extra {
-  /*width: 25%;*/
-  border-right: 1px solid #e9e9e9;
-  text-align: center;
-  padding: 0 18px;
-}
-.page-account-top-tit {
-  font-size: 21px;
-  color: #1890ff;
-}
-.dashboard-workplace {
-  &-header {
-    &-avatar {
-      width: 64px;
-      height: 64px;
-      border-radius: 50%;
-      margin-right: 16px;
-    }
-    &-tip {
-      display: inline-block;
-      vertical-align: middle;
-      &-title {
-        font-size: 20px;
-        font-weight: bold;
-        margin-bottom: 12px;
-      }
-      &-desc {
-        color: #808695;
-      }
-    }
-    &-extra {
-      width: 100% !important;
-      .ivu-col {
-        p {
-          text-align: right;
-        }
-        p:first-child {
-          span:first-child {
-            margin-right: 4px;
-          }
-          span:last-child {
-            color: #808695;
-          }
-        }
-        p:last-child {
-          font-size: 22px;
-        }
-      }
-    }
-  }
-}
-@aaa: ~'>>>';
-.conBox {
-  @{aaa} .ivu-page-header-extra {
-    width: auto !important;
-    min-width: 457px;
-  }
-  @{aaa} .ivu-page-header {
-    padding: 16px 0px 0 32px !important;
-  }
-}
-.samll_font {
-  text-align: center;
-  padding: 0px 10px;
-}
-.title-tips {
-  font-size: 14px;
-  color: #999;
-  margin-left: 10px;
-}
-</style>
+	.picTxt {
+		padding: 8px 0 12px;
+	}
+
+	.dashboard {
+		width: auto !important;
+		min-width: 300px;
+	}
+
+	.header-extra {
+		/*width: 25%;*/
+		border-right: 1px solid #e9e9e9;
+		text-align: center;
+		padding: 0 18px;
+	}
+
+	.page-account-top-tit {
+		font-size: 21px;
+		color: #1890ff;
+	}
+
+	.dashboard-workplace {
+		&-header {
+			&-avatar {
+				width: 64px;
+				height: 64px;
+				border-radius: 50%;
+				margin-right: 16px;
+			}
+
+			&-tip {
+				display: inline-block;
+				vertical-align: middle;
+
+				&-title {
+					font-size: 20px;
+					font-weight: bold;
+					margin-bottom: 12px;
+				}
+
+				&-desc {
+					color: #808695;
+				}
+			}
+
+			&-extra {
+				width: 100% !important;
+
+				.ivu-col {
+					p {
+						text-align: right;
+					}
+
+					p:first-child {
+						span:first-child {
+							margin-right: 4px;
+						}
+
+						span:last-child {
+							color: #808695;
+						}
+					}
+
+					p:last-child {
+						font-size: 22px;
+					}
+				}
+			}
+		}
+	}
+
+	@aaa: ~'>>>';
+
+	.conBox {
+		@{aaa} .ivu-page-header-extra {
+			width: auto !important;
+			min-width: 457px;
+		}
+
+		@{aaa} .ivu-page-header {
+			padding: 16px 0px 0 32px !important;
+		}
+	}
+
+	.samll_font {
+		text-align: center;
+		padding: 0px 10px;
+	}
+
+	.title-tips {
+		font-size: 14px;
+		color: #999;
+		margin-left: 10px;
+	}
+</style>

src/pages/shop_product/productAdd/index.vue

@@ -1005,7 +1005,7 @@
 	import addAttr from '../productAttr/addAttr';
 	import goodsList from '@/components/goodsList/index';
 	import taoBao from './taoBao';
-	import WangEditor from '@/components/wangEditor/index.vue';
+	import WangEditor from '@/components/shopwangEditor/index.vue';
 	import {
 		userLabelAddApi
 	} from '@/api/user';

src/pages/shop_product/productList/index.vue

@@ -29,8 +29,8 @@
 			<div class="Button">
 				<router-link v-auth="['product-product-save']" :to="$routeProStrshop + '/product/add_product'"><Button
 						type="primary" class="bnt mr15" icon="md-add">添加商品</Button></router-link>
-				<Button v-auth="['product-crawl-save']" type="success" class="bnt mr15" @click="onCopy">商品采集</Button>
-				<Dropdown class="bnt mr15" @on-click="batchSelect" :transfer="true">
+				<!-- <Button v-auth="['product-crawl-save']" type="success" class="bnt mr15" @click="onCopy">商品采集</Button> -->
+				<!-- <Dropdown class="bnt mr15" @on-click="batchSelect" :transfer="true">
 					<Button type="info">
 						批量修改
 						<Icon type="ios-arrow-down"></Icon>
@@ -43,7 +43,7 @@
 						<DropdownItem :name="5">关联用户标签</DropdownItem>
 						<DropdownItem :name="6">活动推荐</DropdownItem>
 					</DropdownMenu>
-				</Dropdown>
+				</Dropdown> -->
 				<Button v-auth="['product-product-product_show']" class="bnt mr15" type="info" @click="onDismount"
 					v-show="artFrom.type === '1'">批量下架</Button>
 				<Button v-auth="['product-product-product_show']" class="bnt mr15" @click="onShelves"

src/store/module/routesList.js

@@ -1,20 +1,23 @@
 const routesListModule = {
-  namespaced: true,
-  state: {
-    routesList: [],
-  },
-  mutations: {
-    // 设置路由，菜单中使用到
-    getRoutesList(state, data) {
-      state.routesList = data;
-    },
-  },
-  actions: {
-    // 设置路由，菜单中使用到
-    async setRoutesList({ commit }, data) {
-      commit('getRoutesList', data);
-    },
-  },
+	namespaced: true,
+	state: {
+		routesList: [],
+	},
+	mutations: {
+		// 设置路由，菜单中使用到
+		getRoutesList(state, data) {
+			console.log(data, 'getRoutesList');
+			state.routesList = data;
+		},
+	},
+	actions: {
+		// 设置路由，菜单中使用到
+		async setRoutesList({
+			commit
+		}, data) {
+			commit('getRoutesList', data);
+		},
+	},
 };
 
-export default routesListModule;
+export default routesListModule;

src/store/module/themeConfig.js

@@ -2,121 +2,126 @@
  * 修改一下配置时，需要每次都清理 `window.localStorage` 浏览器永久缓存，配置才会生效
  */
 const themeConfigModule = {
-  namespaced: true,
-  state: {
-    themeConfig: {
-      // 是否开启布局配置抽屉
-      isDrawer: false,
+	namespaced: true,
+	state: {
+		themeConfig: {
+			// 是否开启布局配置抽屉
+			isDrawer: false,
 
-      /**
-       * 全局主题
-       */
-      // 默认 primary 主题颜色
-      primary: '#409eff',
-      // 菜单背景色
-      menuBgColor: '#282c34',
-      // 是否开启深色模式
-      isIsDark: false,
-      themeStyle: 'theme-1',
-      /**
-       * 菜单 / 顶栏
-       * 请注意：
-       * 需要同时修改 `/@/theme/common/var.scss` 对应的值，
-       */
-      // 默认顶栏导航背景颜色
-      topBar: '#ffffff',
-      // 默认顶栏导航字体颜色
-      topBarColor: '#606266',
-      // 默认菜单导航背景颜色
-      menuBar: '#282c34',
-      // 默认菜单导航字体颜色
-      menuBarColor: '#eaeaea',
-      // 默认分栏菜单背景颜色
-      columnsMenuBar: '#282c34',
-      // 默认分栏菜单字体颜色
-      columnsMenuBarColor: '#e6e6e6',
+			/**
+			 * 全局主题
+			 */
+			// 默认 primary 主题颜色
+			primary: '#409eff',
+			// 菜单背景色
+			menuBgColor: '#282c34',
+			// 是否开启深色模式
+			isIsDark: false,
+			themeStyle: 'theme-1',
+			/**
+			 * 菜单 / 顶栏
+			 * 请注意：
+			 * 需要同时修改 `/@/theme/common/var.scss` 对应的值，
+			 */
+			// 默认顶栏导航背景颜色
+			topBar: '#ffffff',
+			// 默认顶栏导航字体颜色
+			topBarColor: '#606266',
+			// 默认菜单导航背景颜色
+			menuBar: '#282c34',
+			// 默认菜单导航字体颜色
+			menuBarColor: '#eaeaea',
+			// 默认分栏菜单背景颜色
+			columnsMenuBar: '#282c34',
+			// 默认分栏菜单字体颜色
+			columnsMenuBarColor: '#e6e6e6',
 
-      /**
-       * 界面设置
-       */
-      // 是否开启菜单水平折叠效果
-      isCollapse: false,
-      // 是否开启菜单手风琴效果
-      isUniqueOpened: false,
-      // 是否开启固定 Header
-      isFixedHeader: true,
+			/**
+			 * 界面设置
+			 */
+			// 是否开启菜单水平折叠效果
+			isCollapse: false,
+			// 是否开启菜单手风琴效果
+			isUniqueOpened: false,
+			// 是否开启固定 Header
+			isFixedHeader: true,
 
-      /**
-       * 界面显示
-       */
-      // 是否开启侧边栏 Logo
-      isShowLogo: true,
-      // 是否开启 Breadcrumb
-      isBreadcrumb: true,
-      // 是否开启 Breadcrumb 图标
-      isBreadcrumbIcon: false,
-      // 是否开启 Tagsview
-      isTagsview: true,
-      // 是否开启 Tagsview 图标
-      isTagsviewIcon: false,
-      // 是否开启 TagsView 缓存
-      isCacheTagsView: false,
-      // 是否开启 Footer 底部版权信息
-      isFooter: true,
-      // 是否开启灰色模式
-      isGrayscale: false,
-      // 是否开启色弱模式
-      isInvert: false,
+			/**
+			 * 界面显示
+			 */
+			// 是否开启侧边栏 Logo
+			isShowLogo: true,
+			// 是否开启 Breadcrumb
+			isBreadcrumb: true,
+			// 是否开启 Breadcrumb 图标
+			isBreadcrumbIcon: false,
+			// 是否开启 Tagsview
+			isTagsview: true,
+			// 是否开启 Tagsview 图标
+			isTagsviewIcon: false,
+			// 是否开启 TagsView 缓存
+			isCacheTagsView: false,
+			// 是否开启 Footer 底部版权信息
+			isFooter: true,
+			// 是否开启灰色模式
+			isGrayscale: false,
+			// 是否开启色弱模式
+			isInvert: false,
 
-      /**
-       * 其它设置
-       */
-      // 默认 Tagsview 风格，可选 1、 tags-style-one，自行扩展：
-      // 1、需修改 @/layout/navBars/breadcrumb/setings.vue `getThemeConfig.tagsStyle` el-option
-      // 2、需修改 @/layout/navBars/tagsView/tagsView.vue 代码最底部注释部分 css 样式
-      tagsStyle: 'tags-style-five',
-      // 主页面切换动画：可选值"<slide-right|slide-left|opacitys>"，默认 slide-right
-      animation: 'opacitys',
-      // 分栏高亮风格：可选值"<columns-round|columns-card>"，默认 columns-round
-      columnsAsideStyle: 'columns-card',
-      // 分栏布局风格：可ƒ选值"<columns-horizontal|columns-vertical>"，默认 columns-horizontal
-      columnsAsideLayout: 'columns-vertical',
+			/**
+			 * 其它设置
+			 */
+			// 默认 Tagsview 风格，可选 1、 tags-style-one，自行扩展：
+			// 1、需修改 @/layout/navBars/breadcrumb/setings.vue `getThemeConfig.tagsStyle` el-option
+			// 2、需修改 @/layout/navBars/tagsView/tagsView.vue 代码最底部注释部分 css 样式
+			tagsStyle: 'tags-style-five',
+			// 主页面切换动画：可选值"<slide-right|slide-left|opacitys>"，默认 slide-right
+			animation: 'opacitys',
+			// 分栏高亮风格：可选值"<columns-round|columns-card>"，默认 columns-round
+			columnsAsideStyle: 'columns-card',
+			// 分栏布局风格：可ƒ选值"<columns-horizontal|columns-vertical>"，默认 columns-horizontal
+			columnsAsideLayout: 'columns-vertical',
 
-      /**
-       * 布局切换
-       * 注意：为了演示，切换布局时，颜色会被还原成默认，代码位置：/@/layout/navBars/breadcrumb/setings.vue
-       * 中的 `initSetLayoutChange(设置布局切换，重置主题样式)` 方法
-       */
-      // 布局切换：可选值"<defaults|classic|transverse|columns>"，默认 defaults
-      layout: 'columns',
+			/**
+			 * 布局切换
+			 * 注意：为了演示，切换布局时，颜色会被还原成默认，代码位置：/@/layout/navBars/breadcrumb/setings.vue
+			 * 中的 `initSetLayoutChange(设置布局切换，重置主题样式)` 方法
+			 */
+			// 布局切换：可选值"<defaults|classic|transverse|columns>"，默认 defaults
+			layout: 'defaults',
+			// layout: 'defaults',
 
-      /**
-       * 全局网站标题 / 副标题
-       */
-      // 网站主标题（菜单导航、浏览器当前网页标题）
-      globalTitle: 'crmeb-admin',
-      // 网站副标题（登录页顶部文字）
-      globalViceTitle: 'SMALL@小柒',
-      // 网站描述（登录页顶部文字）
-      globalViceDes: 'vue2',
-      // 默认初始语言，可选值"<zh-cn|en|zh-tw>"，默认 zh-cn
-      globalI18n: 'zh-cn',
-      // 默认全局组件大小，可选值"<|medium|small|mini>"，默认 ''
-      globalComponentSize: '',
-    },
-  },
-  mutations: {
-    // 设置布局配置
-    getThemeConfig(state, data) {
-      state.themeConfig = data;
-    },
-  },
-  actions: {
-    // 设置布局配置
-    setThemeConfig({ commit }, data) {
-      commit('getThemeConfig', data);
-    },
-  },
+			/**
+			 * 全局网站标题 / 副标题
+			 */
+			// 网站主标题（菜单导航、浏览器当前网页标题）
+			globalTitle: 'crmeb-admin',
+			// 网站副标题（登录页顶部文字）
+			globalViceTitle: 'SMALL@小柒',
+			// 网站描述（登录页顶部文字）
+			globalViceDes: 'vue2',
+			// 默认初始语言，可选值"<zh-cn|en|zh-tw>"，默认 zh-cn
+			globalI18n: 'zh-cn',
+			// 默认全局组件大小，可选值"<|medium|small|mini>"，默认 ''
+			globalComponentSize: '',
+		},
+	},
+	mutations: {
+		// 设置布局配置
+		getThemeConfig(state, data) {
+			console.log(data, 'getThemeConfig');
+			state.themeConfig = data;
+		},
+	},
+	actions: {
+		// 设置布局配置
+		setThemeConfig({
+			commit
+		}, data) {
+			console.log(data, '789456132');
+			commit('getThemeConfig', data);
+		},
+	},
 };
 
-export default themeConfigModule;
+export default themeConfigModule;

src/store/module/userInfo.js

@@ -9,96 +9,103 @@
 // +----------------------------------------------------------------------
 
 export default {
-  namespaced: true,
-  state: {
-    userInfo: null,
-    uniqueAuth: [],
-    name: '',
-    avatar: '',
-    access: '',
-    logo: '',
-    logoSmall: '',
-    version: '',
-    newOrderAudioLink: '',
-    pageName: '',
-    //当删除数据并提交时存储默认数据(可视化)
-    uploadListDataswiperBg: {},
-    uploadListDatamenus: {},
-    uploadListDataactivity: {},
-    uploadListDatarecommend: {},
-    uploadListDataadsRecommend: {},
-    txtListData: {},
-  },
-  mutations: {
-    //当删除数据并提交时存储默认数据(可视化)
-    uploadListswiperBg(state, data) {
-      state.uploadListDataswiperBg = data;
-    },
-    uploadListmenus(state, data) {
-      state.uploadListDatamenus = data;
-    },
-    uploadListrecommend(state, data) {
-      state.uploadListDatarecommend = data;
-    },
-    uploadListactivity(state, data) {
-      state.uploadListDataactivity = data;
-    },
-    uploadListadsRecommend(state, data) {
-      state.uploadListDataadsRecommend = data;
-    },
-    txtList(state, data) {
-      state.txtListData = data;
-    },
-    //
-    setPageName(state, id) {
-      state.pageName = id;
-    },
-    userInfo(state, userInfo) {
-      state.userInfo = userInfo;
-    },
-    userRealName(state, realName) {
-      state.userInfo.real_name = realName;
-    },
-    userRealHeadPic(state, headPic) {
-      state.userInfo.head_pic = headPic;
-    },
-    uniqueAuth(state, uniqueAuth) {
-      state.uniqueAuth = uniqueAuth;
-    },
-    name(state, name) {
-      state.name = name;
-    },
-    avatar(state, avatar) {
-      state.avatar = avatar;
-    },
-    access(state, access) {
-      state.access = access;
-    },
-    logo(state, logo) {
-      state.logo = logo;
-    },
-    logoSmall(state, logoSmall) {
-      state.logoSmall = logoSmall;
-    },
-    version(state, version) {
-      state.version = version;
-    },
-    newOrderAudioLink(state, newOrderAudioLink) {
-      state.newOrderAudioLink = newOrderAudioLink;
-    },
-  },
-  actions: {
-    getMenusNavList({ commit }) {
-      return new Promise((resolve, reject) => {
-        menusApi()
-          .then(async (res) => {
-            resolve(res);
-            commit('getmenusNav', res.data.menus);
-          })
-          .catch((res) => {
-            reject(res);
-          });
-      });
-    },
-  },
-};
+	namespaced: true,
+	state: {
+		userInfo: null,
+		uniqueAuth: [],
+		name: '',
+		type: '',
+		avatar: '',
+		access: '',
+		logo: '',
+		logoSmall: '',
+		version: '',
+		newOrderAudioLink: '',
+		pageName: '',
+		//当删除数据并提交时存储默认数据(可视化)
+		uploadListDataswiperBg: {},
+		uploadListDatamenus: {},
+		uploadListDataactivity: {},
+		uploadListDatarecommend: {},
+		uploadListDataadsRecommend: {},
+		txtListData: {},
+	},
+	mutations: {
+		//当删除数据并提交时存储默认数据(可视化)
+		uploadListswiperBg(state, data) {
+			state.uploadListDataswiperBg = data;
+		},
+		uploadListmenus(state, data) {
+			state.uploadListDatamenus = data;
+		},
+		uploadListrecommend(state, data) {
+			state.uploadListDatarecommend = data;
+		},
+		uploadListactivity(state, data) {
+			state.uploadListDataactivity = data;
+		},
+		uploadListadsRecommend(state, data) {
+			state.uploadListDataadsRecommend = data;
+		},
+		txtList(state, data) {
+			state.txtListData = data;
+		},
+		//
+		setPageName(state, id) {
+			state.pageName = id;
+		},
+		userInfo(state, userInfo) {
+			state.userInfo = userInfo;
+		},
+		userRealName(state, realName) {
+			state.userInfo.real_name = realName;
+		},
+		type(state, type) {
+			console.log(type);
+			state.type = type;
+		},
+		userRealHeadPic(state, headPic) {
+			state.userInfo.head_pic = headPic;
+		},
+		uniqueAuth(state, uniqueAuth) {
+			state.uniqueAuth = uniqueAuth;
+		},
+		name(state, name) {
+			state.name = name;
+		},
+		avatar(state, avatar) {
+			state.avatar = avatar;
+		},
+		access(state, access) {
+			state.access = access;
+		},
+		logo(state, logo) {
+			state.logo = logo;
+		},
+		logoSmall(state, logoSmall) {
+			state.logoSmall = logoSmall;
+		},
+		version(state, version) {
+			state.version = version;
+		},
+		newOrderAudioLink(state, newOrderAudioLink) {
+			state.newOrderAudioLink = newOrderAudioLink;
+		},
+	},
+	actions: {
+		getMenusNavList({
+			commit
+		}) {
+			return new Promise((resolve, reject) => {
+				menusApi()
+					.then(async (res) => {
+						resolve(res);
+						commit('getmenusNav', res.data.menus);
+					})
+					.catch((res) => {
+						reject(res);
+					});
+			});
+		},
+	},
+};

vue.config.js

@@ -3,7 +3,7 @@ const Setting = require('./src/setting.env');
 // 引入打包分析文件
 const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
 // 引入js打包工具
-const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
+// const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
 
 const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin');
 
@@ -39,20 +39,20 @@ module.exports = {
   // 打包优化
   configureWebpack: (config) => {
     const pluginsPro = [];
-    pluginsPro.push(
-      // js文件压缩
-      new UglifyJsPlugin({
-        uglifyOptions: {
-          compress: {
-            drop_debugger: true,
-            drop_console: true, //生产环境自动删除console
-            pure_funcs: ['console.log'], //移除console
-          },
-        },
-        sourceMap: false,
-        parallel: true, //使用多进程并行运行来提高构建速度。默认并发运行数：os.cpus().length - 1。
-      }),
-    );
+    // pluginsPro.push(
+    // 	// js文件压缩
+    // 	new UglifyJsPlugin({
+    // 		uglifyOptions: {
+    // 			compress: {
+    // 				drop_debugger: true,
+    // 				drop_console: true, //生产环境自动删除console
+    // 				pure_funcs: ['console.log'], //移除console
+    // 			},
+    // 		},
+    // 		sourceMap: false,
+    // 		parallel: true, //使用多进程并行运行来提高构建速度。默认并发运行数：os.cpus().length - 1。
+    // 	}),
+    // );
     if (process.env.NODE_ENV === 'production') {
       config.plugins = [...config.plugins, ...pluginsPro];
     }