瀏覽代碼

配置修改上测试

asd26269546 2 年之前
父節點
當前提交
12f7adc958
共有 3 個文件被更改,包括 350 次插入11 次删除
  1. 334 0
      src/components/header-bar.vue
  2. 8 6
      src/libs/axios.js
  3. 8 5
      src/views/main.vue

+ 334 - 0
src/components/header-bar.vue

@@ -0,0 +1,334 @@
+<template>
+    <div id="main" class="header-bar">
+      <header>
+        <ul class="nav">
+          <div class="logo">GrandStar</div>
+		  <li class="header-bar-hover-warp nav-li">
+            <div @click="isChildMenu = !isChildMenu" class="menu-modal">
+				功能导览 
+				<i class="el-icon-arrow-down el-icon--right"></i>
+			</div>
+			<div class="header-bar-hover" v-if="isChildMenu">
+				<ul class="left-menu">
+					<li>
+						<div class="active-warp">
+							<i class="el-icon-edit"></i>
+							<span class="text">常用功能</span>
+						</div>
+					</li>
+					<li>
+						<div class="active-warp">
+							<i class="el-icon-edit"></i>
+							<span class="text">订购服务</span>
+							<i class="el-icon-arrow-down"></i>
+						</div>
+						<div class="child-menu">
+							<div class="active-warp">外贸ERP</div>
+							<div class="active-warp">外贸ERP</div>
+							<div class="active-warp">外贸ERP</div>
+						</div>
+					</li>
+					<li>
+						<div class="active-warp">
+							<i class="el-icon-edit"></i>
+							<span class="text">推荐服务</span>
+						</div>
+					</li>
+				</ul>
+				<div class="header-bar-hover-content">
+					<el-alert
+						title="可将常用功能收纳此栏目中,帮助使用者快捷找到菜单。同时将在顶部导览栏目中生成前7个功能入口。"
+						type="warning"
+						class="el-alert"
+						center
+						show-icon>
+					</el-alert>
+					<el-button type="primary" icon="el-icon-plus">功能配置</el-button>
+					<div class="fun-lists">
+						<div class="fun-list active">
+							<i class="el-icon-edit"></i>
+							<span>客户管理</span>
+						</div>
+						<div class="fun-list">
+							<i class="el-icon-edit"></i>
+							<span>客户管理</span>
+						</div>
+						<div class="fun-list">
+							<i class="el-icon-edit"></i>
+							<span>客户管理</span>
+						</div>
+						<div class="fun-list">
+							<i class="el-icon-edit"></i>
+							<span>客户管理</span>
+						</div>
+						<div class="fun-list">
+							<i class="el-icon-edit"></i>
+							<span>客户管理</span>
+						</div>
+					</div>
+				</div>
+			</div>
+          </li>
+          <li class="nav-li">
+            <router-link to="/main/fjhxCloudVue/#/wel/index">针筒</router-link>
+          </li>
+          <li class="active nav-li">
+            <router-link to="/main/canvas/">canvas</router-link>
+          </li>
+          <li class="nav-li">
+            <router-link to="/main/iotPlatformRoom/#/wel/index">云帆</router-link>
+          </li>
+          <li class="nav-li">
+            <router-link to="/main/about">主服务about</router-link>
+          </li>
+        </ul>
+        <div class="fr">
+          <el-input
+            class="input-search"
+            placeholder="请输入关键词"
+            suffix-icon="el-icon-search"
+			size="mini"
+            v-model="input1">
+          </el-input>
+          <el-dropdown class="dropdown-box">
+            <span class="el-dropdown-link">
+              中文<i class="el-icon-arrow-down el-icon--right"></i>
+            </span>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item>English</el-dropdown-item>
+              <el-dropdown-item>中文</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+          <el-badge :value="12" class="badge">
+            <i class="el-icon-message-solid"></i>
+          </el-badge>
+          
+          <el-dropdown class="dropdown-box">
+            <span class="el-dropdown-link">
+              leehom<i class="el-icon-arrow-down el-icon--right"></i>
+            </span>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item>个人中心</el-dropdown-item>
+              <el-dropdown-item>退出</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+        </div>
+      </header>
+    </div>
+  </template>
+  
+  <script>
+import { registerMicroApps, start } from 'qiankun'
+import { getAll } from '@/libs/micros'
+import router from '../router'
+import store from '../store'
+export default {
+	components: {},
+	data() {
+		return {
+			input1: null,
+			isChildMenu:false,
+		}
+	},
+	computed: {
+		commonData() {
+			return this.$store.state.commonData
+		},
+	},
+	methods: {
+		changeParentState() {
+			this.$store.commit('setCommonData', { parent: 1 })
+		},
+		getData() {},
+	},
+	created() {
+		this.getData()
+	},
+}
+</script>
+  
+  <style scoped lang="less">
+.header-bar {
+	background: #20222A;
+	position: fixed;
+	top: 0;
+	left: 0;
+	right: 0;
+	z-index: 10001;
+	.menu-modal{
+		cursor: pointer;
+	}
+	.nav {
+		display: flex;
+		padding: 0;
+		margin: 0;
+		height: 50px;
+		overflow: hidden;
+		.logo{
+			color: #fff;
+			font-size: 20px;
+			font-weight: bold;
+			line-height: 50px;
+			margin: 0 20px;
+		}
+		.header-bar-hover-warp{
+			.header-bar-hover{
+				position: fixed;
+				top: 50px;
+				left: 0px;
+				right: 0;
+				display: flex;
+				background: #fff;
+				box-shadow: 0px 3px 10px 1px rgba(0,0,0,0.1);
+				height: 500px;
+				.header-bar-hover-content{
+					margin: 32px 20px;
+					text-align: left;
+					.el-alert{
+						line-height:20px;
+						text-align:center;
+						background:#DFECFF;
+						color:#666666;
+						font-weight: 400;
+						margin-bottom: 20px;
+						i{
+							color: #46A6FF;
+						}
+					}
+					.fun-lists{
+						width: 700px;
+						overflow: hidden;
+						.fun-list{
+							width: 120px;
+							height: 40px;
+							margin: 20px 20px 0 0;
+							background: #F1F1F1;
+							border-radius: 4px 4px 4px 4px;
+							line-height: 40px;
+							color: #333333;
+							font-size: 12px;
+							float: left;
+							text-align: center;
+							cursor: pointer;
+							span{
+								margin-left: 10px;
+							}
+						}
+						.fun-list.active{
+							border: 1px solid #46A6FF;
+							background: #fff;
+							color: #46A6FF;
+							box-sizing: border-box;
+							i{
+								color: #46A6FF;
+							}
+						}
+					}
+				}
+				
+				ul{
+					padding: 0 20px;
+					margin: 0;
+					width: 230px;
+					background: #f1f1f1;
+					text-align: left;
+					
+					li{
+						color: #333333;
+						list-style: none;
+						margin: 0;
+						position: relative;
+						.text{
+							margin-left: 10px;
+							font-size: 14px;
+							font-weight: bold;
+						}
+						.el-icon-arrow-down{
+							position: absolute;
+							right: 0;
+							top: 20px;
+						}
+						.child-menu{
+							margin-left: 24px;
+							font-size: 12px;
+							font-weight: 400;
+
+						}
+					}
+					.active-warp{
+						cursor: pointer;
+					}
+					
+					.active-warp:hover{
+						color: #0084FF;
+						i{
+							color: #0084FF;
+						}
+					}
+				}
+			}
+		}
+		.nav-li {
+			width: 130px;
+			height: 50px;
+			font-size: 16px;
+			font-weight: 700;
+			text-align: center;
+			line-height: 50px;
+			list-style: none;
+			color: #fff;
+			a{
+				color: #fff;
+			}
+		}
+		.nav-li.active {
+			background: #0084ff;
+			color: #fff;
+			a {
+				color: #fff;
+			}
+		}
+	}
+	header {
+		z-index: 10;
+		left: 0;
+		right: 0;
+		top: 0;
+		height: 50px;
+		display: flex;
+		justify-content: space-between;
+		.fr {
+			display: flex;
+			.input-search {
+				margin: 12px 40px 12px 0;
+				width: 240px;
+				input {
+					height: 30px;
+				}
+			}
+			.dropdown-box {
+				margin: 0 24px 0 0px;
+				line-height: 50px;
+			}
+			.badge {
+				margin: 15px 24px 15px 0;
+				height: 20px;
+				width: 20px;
+				i {
+					color: #bbbbbb;
+				}
+			}
+			.user-img {
+				margin: 12px 12px 12px 0;
+			}
+		}
+	}
+}
+
+header > a {
+	margin: 0 20px;
+}
+
+</style>
+
+  

+ 8 - 6
src/libs/axios.js

@@ -20,11 +20,13 @@ axios.interceptors.request.use(
         if(userData && userData.access_token){
             token = userData.access_token
         }
-        
+        if(config.url.indexOf('oauth/captcha') === -1){
+            config.headers['Content-Type'] = 'application/json;charset=UTF-8'
+            config.headers['Authorization'] = 'Basic c2FiZXI6c2FiZXJfc2VjcmV0'
+            config.headers['Blade-Auth'] = token
+        }
         config.data = JSON.stringify(config.data)
-        config.headers['Content-Type'] = 'application/json;charset=UTF-8'
-        config.headers['Authorization'] = 'Basic c2FiZXI6c2FiZXJfc2VjcmV0'
-        config.headers['Blade-Auth'] = token
+        
         return config;
     },
     error => {
@@ -138,7 +140,7 @@ export function get(url, params = {}) {
         if(process.env.NODE_ENV == "development"){
             var getUrl = "http://" + window.location.host + "" + url
         }else{
-            var getUrl = "https://" + window.location.host + "/api" + url
+            var getUrl = "https://" + window.location.host + url
         }
         axios.get(getUrl, {params:params})
             .then(response => {
@@ -164,7 +166,7 @@ export function post(url, data = {},params,headers) {
         if(process.env.NODE_ENV == "development"){
             var postUrl = "http://" + window.location.host + url
         }else{
-            var postUrl = "https://" + window.location.host +'/api' + url
+            var postUrl = "https://" + window.location.host + url
         }
         axios.post(postUrl, data = {},{
             params:params,

+ 8 - 5
src/views/main.vue

@@ -1,6 +1,7 @@
 <template>
   <div id="main" class="main">
-    <header>
+	<header-bar></header-bar>
+    <!-- <header>
       <ul class="nav">
         <img class="logo" src="../assets/logo.png" alt=""></img>
         <li>
@@ -49,7 +50,7 @@
           </el-dropdown-menu>
         </el-dropdown>
       </div>
-    </header>
+    </header> -->
     <!-- <span @click="changeParentState">主项目的数据:{{ commonData.parent }},点击变回1</span> -->
     <content>
       <!-- <left-mneu></left-mneu> -->
@@ -65,10 +66,11 @@
 <script>
 import leftMneu from '@/components/left-menu'
 import { registerMicroApps, start } from 'qiankun'
+import headerBar from '@/components/header-bar'
 import { getAll } from '@/libs/micros'
 import router from '../router'
 import store from '../store'
-console.log(getAll())
+console.log(process.env.NODE_ENV)
 const state = getAll()
 state.router = router
 registerMicroApps([
@@ -83,7 +85,7 @@ registerMicroApps([
 	},
 	{
 		name: 'fjhxCloudVue',
-		entry: 'http://localhost:1777',
+		entry: (process.env.NODE_ENV === "development") ?  'http://localhost:1777' : 'http://36.134.91.96:10002',
 		container: '#appContainer',
 		activeRule: '/main/fjhxCloudVue',
 		props:{
@@ -112,7 +114,8 @@ registerMicroApps([
 start();
 export default {
 	components:{
-		leftMneu
+		leftMneu,
+		headerBar
 	},
 	data() {
 		return {