首页和导航栏调整
Showing
5 changed files
with
25 additions
and
16 deletions
... | @@ -42,7 +42,7 @@ export default { | ... | @@ -42,7 +42,7 @@ export default { |
42 | this.isShow = true; | 42 | this.isShow = true; |
43 | this.tips = tips+'...'; | 43 | this.tips = tips+'...'; |
44 | }, | 44 | }, |
45 | loadingHide(tips){ | 45 | loadingHide(){ |
46 | this.isShow = false; | 46 | this.isShow = false; |
47 | } | 47 | } |
48 | }, | 48 | }, | ... | ... |
... | @@ -98,6 +98,9 @@ ol, ul { list-style:none; } | ... | @@ -98,6 +98,9 @@ ol, ul { list-style:none; } |
98 | ::-webkit-scrollbar-track { | 98 | ::-webkit-scrollbar-track { |
99 | border-radius: 0; | 99 | border-radius: 0; |
100 | } | 100 | } |
101 | /deep/ .el-tabs--border-card{ | ||
102 | border: 0; | ||
103 | } | ||
101 | //二级菜单样式 | 104 | //二级菜单样式 |
102 | .tabs{ | 105 | .tabs{ |
103 | >.el-tabs__content{ | 106 | >.el-tabs__content{ | ... | ... |
... | @@ -12,6 +12,7 @@ | ... | @@ -12,6 +12,7 @@ |
12 | <span class="logo-text" v-show="!textLogo">不动产权籍调查系统</span> | 12 | <span class="logo-text" v-show="!textLogo">不动产权籍调查系统</span> |
13 | </div> | 13 | </div> |
14 | 14 | ||
15 | <div class="wrap"> | ||
15 | <div class="search-box"> | 16 | <div class="search-box"> |
16 | <el-input | 17 | <el-input |
17 | maxlength="28" | 18 | maxlength="28" |
... | @@ -28,20 +29,20 @@ | ... | @@ -28,20 +29,20 @@ |
28 | <div class="treeModule" :style="{height:treeHeight+'px'}"> | 29 | <div class="treeModule" :style="{height:treeHeight+'px'}"> |
29 | <LineTree :pd="pd" v-if="lineTreeVisible" @itemClick="itemClick"></LineTree> | 30 | <LineTree :pd="pd" v-if="lineTreeVisible" @itemClick="itemClick"></LineTree> |
30 | </div> | 31 | </div> |
32 | </div> | ||
31 | </el-aside> | 33 | </el-aside> |
32 | <el-container class="calcWidth"> | 34 | <el-container class="calcWidth"> |
33 | <el-header> | 35 | <el-header> |
34 | <div class="header-top"> | 36 | <div class="header-top"> |
35 | <!-- <div class="top-items" @click="toggleClick"> | 37 | <div class="top-items" @click="toggleClick"> |
36 | <i class="iconfont iconsuojin" v-show="!isActive"></i> | 38 | <i class="iconfont iconsuojin" v-show="!isActive"></i> |
37 | <i class="iconfont iconzhankai" v-show="isActive"></i> | 39 | <i class="iconfont iconzhankai" v-show="isActive"></i> |
38 | </div> --> | 40 | </div> |
39 | <div | 41 | <div |
40 | class="top-items" | 42 | class="top-items" |
41 | v-for="(item, index) in headTop" | 43 | v-for="(item, index) in headTop" |
42 | :key="index + '1'" | 44 | :key="index + '1'" |
43 | :class="{ 'is-active': item.select }" | 45 | :class="{ 'is-active': item.select }" |
44 | :style="{'height':item.name == '首页' && item.select ? '64'+'px' : '65'+'px'}" | ||
45 | @click="selectTopItems(index)" | 46 | @click="selectTopItems(index)" |
46 | > | 47 | > |
47 | <i :class="item.icon"></i> | 48 | <i :class="item.icon"></i> |
... | @@ -475,11 +476,13 @@ export default { | ... | @@ -475,11 +476,13 @@ export default { |
475 | height: 66px; | 476 | height: 66px; |
476 | // border-bottom: 1px solid#EAEAEA; | 477 | // border-bottom: 1px solid#EAEAEA; |
477 | box-sizing: border-box; | 478 | box-sizing: border-box; |
478 | background-image: url('../assets/images/banner.png'); | 479 | // background-image: url('../assets/images/banner.png'); |
480 | background-color: #006CFF; | ||
479 | display: flex; | 481 | display: flex; |
480 | flex-grow: 1; | 482 | flex-grow: 1; |
481 | justify-content: center; | 483 | border-left: 1px solid #3E9FFF; |
482 | align-items: center; | 484 | // justify-content: center; |
485 | // align-items: center; | ||
483 | .top-items { | 486 | .top-items { |
484 | cursor: pointer; | 487 | cursor: pointer; |
485 | height: 66px; | 488 | height: 66px; |
... | @@ -504,10 +507,10 @@ export default { | ... | @@ -504,10 +507,10 @@ export default { |
504 | } | 507 | } |
505 | } | 508 | } |
506 | .top-items:hover{ | 509 | .top-items:hover{ |
507 | background: hsla(0,0%,100%,.2); | 510 | background: #0091FF; |
508 | } | 511 | } |
509 | .top-items.is-active { | 512 | .top-items.is-active { |
510 | background: hsla(0,0%,100%,.2); | 513 | background: #0091FF; |
511 | } | 514 | } |
512 | } | 515 | } |
513 | .header-bottom { | 516 | .header-bottom { |
... | @@ -536,8 +539,11 @@ export default { | ... | @@ -536,8 +539,11 @@ export default { |
536 | background-color: #ffffff; | 539 | background-color: #ffffff; |
537 | color: #333; | 540 | color: #333; |
538 | // text-align: center; | 541 | // text-align: center; |
539 | overflow: hidden; | 542 | overflow: overlay; |
540 | transition: width 0.3s; | 543 | transition: width 0.3s; |
544 | box-shadow: 1px 0px 2px 1px rgba(49, 132, 245, 0.1); | ||
545 | position: relative; | ||
546 | z-index: 1000; | ||
541 | .logo-box { | 547 | .logo-box { |
542 | width: 100%; | 548 | width: 100%; |
543 | height: 66px; | 549 | height: 66px; |
... | @@ -545,7 +551,7 @@ export default { | ... | @@ -545,7 +551,7 @@ export default { |
545 | box-sizing: border-box; | 551 | box-sizing: border-box; |
546 | padding: 10px 20px; | 552 | padding: 10px 20px; |
547 | transition: width 0.3s; | 553 | transition: width 0.3s; |
548 | background-color: #287CC5; | 554 | background-color: #006CFF; |
549 | .logo-img { | 555 | .logo-img { |
550 | width: 44px; | 556 | width: 44px; |
551 | float: left; | 557 | float: left; |
... | @@ -557,11 +563,13 @@ export default { | ... | @@ -557,11 +563,13 @@ export default { |
557 | font-size: 20px; | 563 | font-size: 20px; |
558 | } | 564 | } |
559 | } | 565 | } |
566 | .wrap{ | ||
567 | height: calc(100% - 66px); | ||
568 | overflow-x: hidden; | ||
560 | .search-box{ | 569 | .search-box{ |
561 | height: 65px; | 570 | height: 65px; |
562 | box-sizing: border-box; | 571 | box-sizing: border-box; |
563 | padding: 18px 20px; | 572 | padding: 18px 20px; |
564 | border-right: 1px solid #dedede; | ||
565 | .searchInput{ | 573 | .searchInput{ |
566 | /deep/ .el-input__inner{ | 574 | /deep/ .el-input__inner{ |
567 | width: 240px; | 575 | width: 240px; |
... | @@ -577,7 +585,7 @@ export default { | ... | @@ -577,7 +585,7 @@ export default { |
577 | } | 585 | } |
578 | .treeModule { | 586 | .treeModule { |
579 | box-sizing: border-box; | 587 | box-sizing: border-box; |
580 | border-right: 1px solid #dedede; | 588 | } |
581 | } | 589 | } |
582 | .logo-box-show { | 590 | .logo-box-show { |
583 | width: 64px; | 591 | width: 64px; | ... | ... |
... | @@ -347,14 +347,12 @@ export default { | ... | @@ -347,14 +347,12 @@ export default { |
347 | float: left; | 347 | float: left; |
348 | margin-right: 20px; | 348 | margin-right: 20px; |
349 | flex: 1; | 349 | flex: 1; |
350 | border: 1px solid #E6E6E6; | ||
351 | /deep/ .el-card__body{ | 350 | /deep/ .el-card__body{ |
352 | padding: 0; | 351 | padding: 0; |
353 | } | 352 | } |
354 | } | 353 | } |
355 | .download { | 354 | .download { |
356 | width: 50%; | 355 | width: 50%; |
357 | border: 1px solid #E6E6E6; | ||
358 | /deep/ .el-card__body{ | 356 | /deep/ .el-card__body{ |
359 | padding: 0; | 357 | padding: 0; |
360 | } | 358 | } |
... | @@ -379,7 +377,6 @@ export default { | ... | @@ -379,7 +377,6 @@ export default { |
379 | height: 100%; | 377 | height: 100%; |
380 | margin-right: 20px; | 378 | margin-right: 20px; |
381 | background: #fff; | 379 | background: #fff; |
382 | border: 1px solid #E6E6E6; | ||
383 | box-shadow: 0 0 8px 0 rgba(232, 237, 250, 0.6), 0 2px 4px 0 rgba(232, 237, 250, 0.5); | 380 | box-shadow: 0 0 8px 0 rgba(232, 237, 250, 0.6), 0 2px 4px 0 rgba(232, 237, 250, 0.5); |
384 | /deep/ .el-card__body{ | 381 | /deep/ .el-card__body{ |
385 | height: calc(100% - 93px); | 382 | height: calc(100% - 93px); | ... | ... |
-
Please register or sign in to post a comment