瀏覽代碼

全局配置修改

asd26269546 2 年之前
父節點
當前提交
b8c67f50c2
共有 4 個文件被更改,包括 299 次插入206 次删除
  1. 207 199
      src/components/header-bar.vue
  2. 7 1
      src/libs/micros.js
  3. 12 2
      src/views/login.vue
  4. 73 4
      src/views/main.vue

+ 207 - 199
src/components/header-bar.vue

@@ -1,15 +1,28 @@
 <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">
+	<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>
+				</li>
+				<li class="nav-li" v-for="i in barData" :key="i.id">
+					<span>{{ i.name }}</span>
+				</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> -->
+				<div class="header-bar-hover" v-if="isChildMenu">
+					<!-- <ul class="left-menu">
 					<li>
 						<div class="active-warp">
 							<i class="el-icon-edit"></i>
@@ -35,8 +48,8 @@
 						</div>
 					</li>
 				</ul> -->
-				<div class="header-bar-hover-content">
-					<!-- <el-alert
+					<div class="header-bar-hover-content">
+						<!-- <el-alert
 						title="可将常用功能收纳此栏目中,帮助使用者快捷找到菜单。同时将在顶部导览栏目中生成前7个功能入口。"
 						type="warning"
 						class="el-alert"
@@ -67,33 +80,30 @@
 						</div>
 						
 					</div> -->
-					<ul class="menu-warp">
-						
-						<li v-for="i in menuData.children" :key="i.id" class="menu-ul">
-							<div class="menu-title">{{i.name}}</div>
-							<ul style="background:#fff" >
-								<li @click="toWDLY(j)" style="cursor: pointer;" v-for="j in i.children" :key="j.id">{{j.name}}</li>
-							</ul>
-						</li>
-					</ul>
+						<ul class="menu-warp">
+							<li
+								v-for="i in menuData.children"
+								:key="i.id"
+								class="menu-ul"
+							>
+								<div class="menu-title">{{ i.name }}</div>
+								<ul style="background: #fff">
+									<li
+										@click="toWDLY(j)"
+										style="cursor: pointer"
+										v-for="j in i.children"
+										:key="j.id"
+									>
+										{{ j.name }}
+									</li>
+								</ul>
+							</li>
+						</ul>
+					</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
+			</ul>
+			<div class="fr">
+				<!-- <el-input
             class="input-search"
             placeholder="请输入关键词"
             suffix-icon="el-icon-search"
@@ -109,23 +119,25 @@
               <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 @click.native="$router.push('/')">退出</el-dropdown-item>
-            </el-dropdown-menu>
-          </el-dropdown>
-        </div>
-      </header>
-    </div>
-  </template>
+				<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 @click.native="$router.push('/')"
+							>退出</el-dropdown-item
+						>
+					</el-dropdown-menu>
+				</el-dropdown>
+			</div>
+		</header>
+	</div>
+</template>
   
   <script>
 import { registerMicroApps, start } from 'qiankun'
@@ -137,8 +149,9 @@ export default {
 	data() {
 		return {
 			input1: null,
-			isChildMenu:false,
-			menuData:[],
+			isChildMenu: false,
+			menuData: [],
+			barData: [],
 		}
 	},
 	computed: {
@@ -147,7 +160,7 @@ export default {
 		},
 	},
 	methods: {
-		toWDLY(_i){
+		toWDLY(_i) {
 			console.log(_i)
 			this.$router.push('/main/fjhxCloudVue/#/' + _i.path)
 			this.isChildMenu = false
@@ -157,11 +170,11 @@ export default {
 		},
 		getData() {
 			const v = this
-			v.$get('/api/blade-system/menu/routes').then(res=>{
-				v.menuData = res.data[3]
+			v.$get('/api/blade-system/menu/routes').then((res) => {
+				v.menuData = res.data.length >= 1 ? res.data[0] : []
+				v.barData = res.data
 				console.log(v.menuData)
 			})
-			
 		},
 	},
 	created() {
@@ -172,159 +185,155 @@ export default {
   
   <style scoped lang="less">
 .header-bar {
-	background: #20222A;
+	background: #20222a;
 	position: fixed;
 	top: 0;
 	left: 0;
 	right: 0;
-	z-index: 11205;
-	.menu-modal{
+	z-index: 1100;
+	.menu-modal {
 		cursor: pointer;
 	}
-	
-	.nav {
+	.header-bar-hover {
+		position: fixed;
+		z-index: 205;
+		top: 50px;
+		left: 0px;
+		right: 0;
 		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;
-				z-index: 1000000;
-				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;
-						}
+		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-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;
-							}
-						}
+				}
+				.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;
+			}
+		}
+
+		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;
+				}
+			}
+		}
+		.menu-warp {
+			width: 100vw;
+			background: #fff;
+			overflow: hidden;
+			.menu-ul {
+				float: left;
+				width: 100px;
+				margin-right: 80px;
+				.menu-title {
+					font-weight: bold;
+					color: #333333;
+					height: 40px;
+					line-height: 40px;
+					border-bottom: 1px solid #ddd;
+				}
+				ul {
+					li {
 						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{
+						padding: 0;
+						height: 34px;
+						line-height: 34px;
+						font-size: 12px;
+						font-weight: 400;
 						cursor: pointer;
 					}
-					
-					.active-warp:hover{
-						color: #0084FF;
-						i{
-							color: #0084FF;
-						}
-					}
-				}
-				.menu-warp{
-					width: 100vw;
-					background: #fff;
-					overflow: hidden;
-					.menu-ul{
-						float: left;
-						width: 100px;
-						margin-right: 80px;
-						.menu-title{
-							font-weight: bold;
-							color: #333333;
-							height: 40px;
-							line-height: 40px;
-							border-bottom: 1px solid #ddd;
-						}
-						ul{
-							li{
-								list-style: none;
-								margin: 0;
-								padding: 0;
-								height: 34px;
-								line-height: 34px;
-								font-size: 12px;
-								font-weight: 400;
-								cursor: pointer;
-							}
-							li:hover{
-								color:#0084FF;
-							}
-						}
+					li:hover {
+						color: #0084ff;
 					}
 				}
 			}
 		}
+	}
+	.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;
+		}
 		.nav-li {
 			width: 130px;
 			height: 50px;
@@ -334,7 +343,7 @@ export default {
 			line-height: 50px;
 			list-style: none;
 			color: #fff;
-			a{
+			a {
 				color: #fff;
 			}
 		}
@@ -385,7 +394,6 @@ export default {
 header > a {
 	margin: 0 20px;
 }
-
 </style>
 
   

+ 7 - 1
src/libs/micros.js

@@ -7,8 +7,14 @@ const state = JSON.parse(window.localStorage.getItem('state')) || {
 console.log(state)
 const actions = initGlobalState(state)
 actions.onGlobalStateChange((state, prev) => {
+	
+	const stateCopy = {
+		theme:state.state,
+		token:state.token
+	}
+	console.log(stateCopy)
 	// state: 变更后的状态; prev 变更前的状态
-	window.localStorage.setItem('state',JSON.stringify(state))
+	window.localStorage.setItem('state',JSON.stringify(stateCopy))
 	state = state
 	console.log(state, prev, '123123123');
 });

+ 12 - 2
src/views/login.vue

@@ -13,6 +13,14 @@
 						<h2>ByteSailing 管理系统</h2>
 						<div style="margin-top:30px">
 							<el-input
+								placeholder="请输入租户号"
+								prefix-icon="el-icon-user-solid"
+								v-model="loginForm.tenantId"
+								@keyup.enter.native="login">
+							</el-input>
+						</div>
+						<div style="margin-top:30px">
+							<el-input
 								placeholder="请输入账号"
 								prefix-icon="el-icon-user-solid"
 								v-model="loginForm.username"
@@ -62,7 +70,7 @@ export default {
 			checked:false,
 			loginForm: {
 				//租户ID
-				tenantId: '000000',
+				tenantId: '845206',
 				//部门ID
 				deptId: '',
 				//角色ID
@@ -72,7 +80,7 @@ export default {
 				//密码
 				passwordCopy: '',
 				//账号类型
-				type: 'account',
+				type: 'loginWithoutVerificationCode',
 				//验证码的值
 				code: '',
 				//验证码的索引
@@ -119,6 +127,8 @@ export default {
 					setTimeout(()=>{
 						v.$router.push("/main")
 					},1000)
+
+					
 				}else{
 					
 				}

+ 73 - 4
src/views/main.vue

@@ -1,6 +1,31 @@
 <template>
   <div id="main" class="main">
 	<header-bar></header-bar>
+	<!-- <el-table
+		:data="tableData"
+		style="width: 100%;margin;top:200px"
+		:default-sort = "{prop: 'date', order: 'descending'}"
+		>
+		<el-table-column label="交易时间" prop="time" width="78" fixed />
+		<el-table-column label="资产小计" prop="total" width="78" fixed>
+			<template slot-scope="scope">
+				<span style="color: #940819">{{ scope.row.total.toFixed(2) }}</span>
+			</template>
+		</el-table-column>
+		<template v-if="bankList && bankList.length > 0">
+			<tbody v-for="(item) in bankList" :key="item.id">
+			<el-table-column :render-header="(h, obj) => renderHeader(h, obj, item)" align="center">
+				<el-table-column label="收入" align="right" width="80" :prop="'rmbIncome-' + item.id">
+				</el-table-column>
+				<el-table-column label="支出" align="right" width="80"  :prop="'rmbExpenditure-' + item.id">
+				</el-table-column>
+				<el-table-column label="余额" align="right" width="80"  :prop="'rmbAmount-' + item.id">
+				</el-table-column>
+			</el-table-column>
+			</tbody>
+		</template>
+		
+	</el-table> -->
     <!-- <header>
       <ul class="nav">
         <img class="logo" src="../assets/logo.png" alt=""></img>
@@ -41,7 +66,7 @@
           <img  src="../assets/icon_people.png" alt=""></img>
         </div>
         <el-dropdown class="dropdown-box">
-          <span class="el-dropdown-link">
+          <span class="el-dropdown-link">;
             leehom<i class="el-icon-arrow-down el-icon--right"></i>
           </span>
           <el-dropdown-menu slot="dropdown">
@@ -85,7 +110,8 @@ registerMicroApps([
 	},
 	{
 		name: 'fjhxCloudVue',
-		entry: (process.env.NODE_ENV === "development") ?  'http://localhost:1777' : 'http://wdly.bytesail.cn:10002',
+		entry: (process.env.NODE_ENV === "development") ?  'http://localhost:1777' : 'https://wdly.bytesail.cn:10002',
+		//entry: (process.env.NODE_ENV === "development") ?  'https://wdly.bytesail.cn:10002' : 'https://wdly.bytesail.cn:10002',
 		container: '#appContainer',
 		activeRule: '/main/fjhxCloudVue',
 		props:{
@@ -120,6 +146,8 @@ export default {
 	data() {
 		return {
 			input1: null,
+			tableData:[],
+			bankList:[],
 		}
 	},
 	computed: {
@@ -128,19 +156,60 @@ export default {
 		},
 	},
 	methods: {
+		renderHeader(h, para, item) {
+		return h('div', {
+				attrs: {
+				class: 'cell',
+				},
+				domProps: {
+				innerHTML: item.name + '</br>(' + item.accountNumber + ')',
+				},
+			})
+		},
 		changeParentState() {
 			this.$store.commit('setCommonData', { parent: 1 })
 		},
 		getData(){
-
+			
 		},
 	},
 	created(){
-		this.getData()
+		//this.getData()
 	},
 }
 </script>
+<style>
+  .loading-9 {
+		--r1: 154%;
+		--r2: 68.5%;
+		width: 60px;
+		height: 60px;
+		border-radius: 50%;
+		background:
+			radial-gradient(var(--r1) var(--r2) at top, #0000 79.5%, #269af2 80%) center left,
+			radial-gradient(var(--r1) var(--r2) at bottom, #269af2 79.5%, #0000 80%) center center,
+			radial-gradient(var(--r1) var(--r2) at top, #0000 79.5%, #269af2 80%) center right,
+			#ccc;
+		background-size: 50.5% 220%;
+		background-position: -100% 0%, 0% 0%, 100% 0%;
+		background-repeat: no-repeat;
+		animation: p9 .3s infinite linear;
+	}
+
+	@keyframes p9 {
+		33% {
+			background-position: 0% 33%, 100% 33%, 200% 33%
+		}
+
+		66% {
+			background-position: -100% 66%, 0% 66%, 100% 66%
+		}
 
+		100% {
+			background-position: 0% 100%, 100% 100%, 200% 100%
+		}
+	}
+</style>
 <style scoped lang="less">
 .main {
 	height: 100%;