1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
| <template>
| <el-dropdown
| class="p-events-auto"
| trigger="click"
| size="small"
| @command="handleCommand"
| >
| <el-button type="primary" class="el-button-custom">
| <el-icon class="el-icon--left"><TakeawayBox /></el-icon>
| 工具箱
| <el-icon class="el-icon--right"><arrow-down /></el-icon>
| </el-button>
| <template #dropdown>
| <el-dropdown-menu>
| <el-dropdown-item
| v-for="(item, index) in toolItem"
| :key="item.label"
| :command="index"
| >
| <el-button
| :type="item.value ? 'primary' : 'info'"
| plain
| size="default"
| >
| <font-awesome-icon :icon="item.icon" class="m-r-4" />
| {{ item.label + ': ' + (item.value ? '开' : '关') }}
| </el-button>
| </el-dropdown-item>
| </el-dropdown-menu>
| </template>
| </el-dropdown>
| </template>
|
| <script>
| import toolbox from '@/utils/map/toolbox';
| export default {
| data() {
| return {
| toolItem: [
| {
| icon: 'fa fa-map-signs',
| label: '行政区划',
| value: false,
| click: function () {
| this.value = !this.value;
| toolbox.toggleDistrict(this.value);
| }
| },
| {
| icon: 'fa fa-map-signs',
| label: '地物标注',
| value: false,
| click: function () {
| this.value = !this.value;
| toolbox.toggleFeatures(this.value);
| }
| },
| {
| icon: 'fa fa-globe',
| label: '卫星地图',
| value: true,
| click: function () {
| this.value = !this.value;
| toolbox.toggleSatellite(this.value);
| }
| },
| {
| icon: 'fa fa-compass',
| label: '控制罗盘',
| value: true,
| click: function () {
| this.value = !this.value;
| toolbox.toggleControlbar(this.value);
| }
| },
| {
| icon: 'fa fa-crosshairs',
| label: '坐标拾取',
| value: false,
| click: function () {
| this.value = !this.value;
| toolbox.toggleCoorPicking(this.value);
| }
| },
| // {
| // icon: 'fa fa-compass',
| // label: '数据标记',
| // value: true,
| // click: function () {
| // this.value = !this.value;
| // // todo 数据标记
| // }
| // },
| {
| icon: 'fa fa-comment-alt',
| label: '数据弹框',
| value: true,
| click: function () {
| this.value = !this.value;
| toolbox.toggleDataDialogStatus(this.value);
| }
| },
| {
| icon: 'fa fa-comment-alt',
| label: '溯源清单',
| value: true,
| click: function () {
| this.value = !this.value;
| toolbox.toggleSceneSearch(this.value);
| }
| }
| ]
| };
| },
| methods: {
| handleCommand(command) {
| this.toolItem[command].click();
| }
| }
| };
| </script>
|
| <style scoped>
| .el-button {
| margin: initial !important;
| }
| </style>
|
|
