d31e475c by 刘远

修改结构

1 parent 5184130d
...@@ -13,11 +13,11 @@ ...@@ -13,11 +13,11 @@
13 } 13 }
14 * { 14 * {
15 margin: 0px; 15 margin: 0px;
16 padding: 0px; 16 padding: 0px;
17 list-style: none; 17 list-style: none;
18 } 18 }
19 19
20 .cesium-viewer-toolbar, .cesium-viewer-animationContainer, .cesium-viewer-bottom, .cesium-viewer-fullscreenContainer { 20 .cesium-viewer-toolbar, .cesium-viewer-animationContainer, .cesium-viewer-bottom, .cesium-viewer-fullscreenContainer {
21 display: none !important; 21 display: none !important;
22 } 22 }
23 </style> 23 </style>
......
1 <template> 1 <template>
2 <div class="container"> 2 <div class="container">
3 <div class="wrapper"> 3 <div class="wrapper">
4 <div class="nav-box selected" :class="[isYZT?'selected':'no-selected']" @click="jumpNav('isYZT')"> 4 <div class="nav-box" :class="[isYZT?'selected':'no-selected']" @click="jumpNav('isYZT')">
5 <span>一张图</span> 5 <span>一张图</span>
6 </div> 6 </div>
7 <div class="nav-box no-selected" :class="[isCGSC?'selected':'no-selected']" @click="jumpNav('isCGSC')"> 7 <div class="nav-box" :class="[isCGSC?'selected':'no-selected']" @click="jumpNav('isCGSC')">
8 <span>成果审查管理</span> 8 <span>成果审查管理</span>
9 </div> 9 </div>
10 <div class="nav-box no-selected" :class="[isSSJD?'selected':'no-selected']" @click="jumpNav('isSSJD')"> 10 <div class="nav-box" :class="[isSSJD?'selected':'no-selected']" @click="jumpNav('isSSJD')">
11 <span>实施监督预警</span> 11 <span>实施监督预警</span>
12 </div> 12 </div>
13 <div class="nav-box no-selected" :class="[isPGJG?'selected':'no-selected']" @click="jumpNav('isPGJG')"> 13 <div class="nav-box" :class="[isPGJG?'selected':'no-selected']" @click="jumpNav('isPGJG')">
14 <span>批后监管</span> 14 <span>批后监管</span>
15 </div> 15 </div>
16 </div> 16 </div>
17
18 </div> 17 </div>
19 </template> 18 </template>
20 19
...@@ -24,16 +23,20 @@ ...@@ -24,16 +23,20 @@
24 components: {}, 23 components: {},
25 data() { 24 data() {
26 return { 25 return {
27 isYZT: true, // 一张图 26 isYZT: false, // 一张图
28 isCGSC: false, // 成果审查管理 27 isCGSC: true, // 成果审查管理
29 isSSJD: false, // 实施监督预警 28 isSSJD: false, // 实施监督预警
30 isPGJG: false, // 批后监管 29 isPGJG: false, // 批后监管
30 flagArr: ['isYZT', 'isCGSC', 'isSSJD', 'isPGJG']
31 } 31 }
32 }, 32 },
33 mounted() {}, 33 mounted() {},
34 methods: { 34 methods: {
35 jumpNav(val) { 35 jumpNav(val) {
36 this[val] = !this[val]; 36 this.flagArr.forEach(ele => {
37 if (ele == val) this[val] = true;
38 else this[ele] = false;
39 });
37 }, 40 },
38 } 41 }
39 } 42 }
...@@ -51,9 +54,9 @@ ...@@ -51,9 +54,9 @@
51 justify-content: space-around; 54 justify-content: space-around;
52 font-size: 24px; 55 font-size: 24px;
53 color: #FFFFFF; 56 color: #FFFFFF;
57 cursor: pointer;
54 } 58 }
55 59
56
57 .nav-box { 60 .nav-box {
58 width: 306px !important; 61 width: 306px !important;
59 text-align: center; 62 text-align: center;
......
1 <template> 1 <template>
2 <div class="container"> 2 <div class="container">
3 <div class="assert-list" 3 <div class="assert-list" :class="[isAssert?'a-selected':'a-no-selected']" @click="changeSelect('isAssert')">
4 :class="[isAssert?'a-selected':'a-no-selected']"
5 @click="changeSelect('isAssert')">
6 <div class="expend"> 4 <div class="expend">
7 <img src="../assets/一张图/icon_资源目录.png" alt=""> 5 <img src="../assets/一张图/icon_资源目录.png" alt="">
8 </div> 6 </div>
...@@ -11,30 +9,26 @@ ...@@ -11,30 +9,26 @@
11 <div style="margin-top: 16px;" v-show='isAssert'> 9 <div style="margin-top: 16px;" v-show='isAssert'>
12 <treeSearch @foldAssert='foldAssert'></treeSearch> 10 <treeSearch @foldAssert='foldAssert'></treeSearch>
13 </div> 11 </div>
14 12
15 <div class="assert-list" 13 <div class="assert-list" :class="[isZTFX?'a-selected':'a-no-selected']" @click="changeSelect('isZTFX')"
16 :class="[isZTFX?'a-selected':'a-no-selected']" 14 style="margin-top: 30px;">
17 @click="changeSelect('isZTFX')"
18 style="margin-top: 30px;">
19 <div class="expend"> 15 <div class="expend">
20 <img src="../assets/一张图/icon_专题分析.png" alt=""> 16 <img src="../assets/一张图/icon_专题分析.png" alt="">
21 </div> 17 </div>
22 <div class="name">专题分析</div> 18 <div class="name">专题分析</div>
23 </div> 19 </div>
24 <div style="margin-top: 16px;" v-show='isZTFX'> 20 <div style="margin-top: 16px;" v-show='isZTFX'>
25 <treeSearch @foldAssert='foldAssert'></treeSearch> 21 <treeSearch @foldAssert='foldAssert'></treeSearch>
26 </div> 22 </div>
27 23
28 <div class="assert-list" 24 <div class="assert-list" :class="[isFASC?'a-selected':'a-no-selected']" @click="changeSelect('isFASC')"
29 :class="[isFASC?'a-selected':'a-no-selected']" 25 style="margin-top: 30px;">
30 @click="changeSelect('isFASC')"
31 style="margin-top: 30px;">
32 <div class="expend"> 26 <div class="expend">
33 <img src="../assets/一张图/icon_方案审查.png" alt=""> 27 <img src="../assets/一张图/icon_方案审查.png" alt="">
34 </div> 28 </div>
35 <div class="name">方案审查</div> 29 <div class="name">方案审查</div>
36 </div> 30 </div>
37 <div style="margin-top: 16px;" v-show='isFASC'> 31 <div style="margin-top: 16px;" v-show='isFASC'>
38 <treeSearch @foldAssert='foldAssert'></treeSearch> 32 <treeSearch @foldAssert='foldAssert'></treeSearch>
39 </div> 33 </div>
40 34
...@@ -42,11 +36,10 @@ ...@@ -42,11 +36,10 @@
42 </template> 36 </template>
43 37
44 <script> 38 <script>
45
46 import treeSearch from './treeSearch'; 39 import treeSearch from './treeSearch';
47 40
48 41
49 export default { 42 export default {
50 name: 'leftAssert', 43 name: 'leftAssert',
51 components: { 44 components: {
52 treeSearch 45 treeSearch
...@@ -65,11 +58,12 @@ ...@@ -65,11 +58,12 @@
65 methods: { 58 methods: {
66 changeSelect(val) { 59 changeSelect(val) {
67 this.keepKey.forEach(ele => { 60 this.keepKey.forEach(ele => {
68 if(val == ele) this[ele] = true; else this[ele] = false; 61 if (val == ele) this[ele] = true;
62 else this[ele] = false;
69 }) 63 })
70 }, 64 },
71 foldAssert() { 65 foldAssert() {
72 this.isAssert = false; 66 this.isAssert = false;
73 } 67 }
74 } 68 }
75 } 69 }
...@@ -90,14 +84,14 @@ ...@@ -90,14 +84,14 @@
90 cursor: pointer; 84 cursor: pointer;
91 } 85 }
92 86
93 .a-selected{ 87 .a-selected {
94 background-image: url('../assets/一张图/bg_资源目录.png'); 88 background-image: url('../assets/一张图/bg_资源目录.png');
95 } 89 }
96 90
97 .a-no-selected { 91 .a-no-selected {
98 background-image: url('../assets/一张图/bg_专题分析.png'); 92 background-image: url('../assets/一张图/bg_专题分析.png');
99 } 93 }
100 94
101 .assert-list .expend { 95 .assert-list .expend {
102 transform: translate(20.7px, 2px); 96 transform: translate(20.7px, 2px);
103 } 97 }
......
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
16 <span>总用地面积</span> 16 <span>总用地面积</span>
17 <span>26.245</span> 17 <span>26.245</span>
18 </div> 18 </div>
19 <div class="list-box"> 19 <div class="list-box">
20 <span>净用地面积</span> 20 <span>净用地面积</span>
21 <span>26.07</span> 21 <span>26.07</span>
22 </div> 22 </div>
...@@ -32,8 +32,7 @@ ...@@ -32,8 +32,7 @@
32 name: 'mapPop', 32 name: 'mapPop',
33 components: {}, 33 components: {},
34 data() { 34 data() {
35 return { 35 return {}
36 }
37 }, 36 },
38 mounted() {}, 37 mounted() {},
39 methods: { 38 methods: {
...@@ -51,14 +50,14 @@ ...@@ -51,14 +50,14 @@
51 font-size: 16px; 50 font-size: 16px;
52 } 51 }
53 52
54 .list-box span:nth-of-type(1){ 53 .list-box span:nth-of-type(1) {
55 display: inline-block; 54 display: inline-block;
56 width: 98px; 55 width: 98px;
57 margin-right: 20px; 56 margin-right: 20px;
58 color: rgba(255, 255, 255, .7); 57 color: rgba(255, 255, 255, .7);
59 } 58 }
60 59
61 .list-box span:nth-of-type(2){ 60 .list-box span:nth-of-type(2) {
62 margin-top: 14px; 61 margin-top: 14px;
63 display: inline-block; 62 display: inline-block;
64 } 63 }
......
...@@ -36,6 +36,9 @@ ...@@ -36,6 +36,9 @@
36 }, 36 },
37 mounted() {}, 37 mounted() {},
38 methods: { 38 methods: {
39 handleSearch(val) {
40 this.$emit('searchRoat', val);
41 },
39 handleIs2D() { 42 handleIs2D() {
40 this.is2D = !this.is2D; 43 this.is2D = !this.is2D;
41 this.$emit('is2D', this.is2D); 44 this.$emit('is2D', this.is2D);
...@@ -52,9 +55,6 @@ ...@@ -52,9 +55,6 @@
52 this.isClear = !this.isClear; 55 this.isClear = !this.isClear;
53 this.$emit('isClear', this.isClear); 56 this.$emit('isClear', this.isClear);
54 }, 57 },
55 handleSearch(val) {
56 this.$emit('searchRoat', val);
57 }
58 } 58 }
59 } 59 }
60 </script> 60 </script>
......