webapp / GreenwayWeb

Commit 0c8ae4d97263392a37d779bf09ba8b28434d68b1

Authored by wesley88
1 parent 8b06c016

1

Inline Side-by-side
Showing 12 changed files with 526 additions and 15 deletions
admin-web-master/public/index.html
  View file @0c8ae4d
... ... @@ -8,6 +8,9 @@
8 8 <title><%= htmlWebpackPlugin.options.title %></title>
9 9 <!-- 删除: <script src="https://map.qq.com/api/js?v=2.exp&key=YOUR_API_KEY&callback=initMap"></script> -->
10 10 <script src="https://map.qq.com/api/js?v=2.exp&key=PGRBZ-Z3FRJ-DTYFB-XNX4X-DC6HZ-MCFYU"></script>
  11 + <script src="https://map.qq.com/api/gljs?v=1.exp&key=PGRBZ-Z3FRJ-DTYFB-XNX4X-DC6HZ-MCFYU"></script>
  12 + <script charset="utf-8" src="https://map.qq.com/api/gljs?libraries=tools&v=1.exp&key=PGRBZ-Z3FRJ-DTYFB-XNX4X-DC6HZ-MCFYU"></script>
  13 + <!-- <script charset="utf-8" src="https://map.qq.com/api/gljs?v=1.exp&key=PGRBZ-Z3FRJ-DTYFB-XNX4X-DC6HZ-MCFYU&libraries=geometry"></script> -->
11 14 </head>
12 15 <body>
13 16 <noscript>
... ...
admin-web-master/src/assets/images/icon1.png 0 → 100644
View file @0c8ae4d

14.6 KB
admin-web-master/src/assets/images/icon2.png 0 → 100644
View file @0c8ae4d

13 KB
admin-web-master/src/assets/images/icon3.png 0 → 100644
View file @0c8ae4d

14.4 KB
admin-web-master/src/assets/images/icon4.png 0 → 100644
View file @0c8ae4d

3.46 KB
admin-web-master/src/assets/images/icon5.png 0 → 100644
View file @0c8ae4d

3.36 KB
admin-web-master/src/assets/images/icon6.png 0 → 100644
View file @0c8ae4d

3.62 KB
admin-web-master/src/components/add/addcd.vue
  View file @0c8ae4d
... ... @@ -61,10 +61,10 @@
61 61 </el-form-item>
62 62 </el-col>
63 63 </el-row>
64   - <el-form-item label="详细位置" prop="detailedLocation">
  64 + <!-- <el-form-item label="详细位置" prop="detailedLocation">
65 65 <el-input v-model="ruleForm.detailedLocation" placeholder="请输入" maxlength="100">
66 66 </el-input>
67   - </el-form-item>
  67 + </el-form-item> -->
68 68 <el-form-item label="地图标点" prop="mapMarker">
69 69 <div style="width: 100%;height: 300px;">
70 70 <newmap :isonloed="info.id?true:false" :lat="lat" :lng="lng" @updatecenter="updatecenter"></newmap>
... ... @@ -120,7 +120,7 @@
120 120 changadd,
121 121 changedit
122 122 } from '../../api/information'
123   - import newmap from "@/components/newmap/index";
  123 + import newmap from "@/components/newmap/indexall";
124 124 export default {
125 125 components: {
126 126 upimg,
... ... @@ -238,9 +238,10 @@
238 238  
239 239 updatecenter(e) {
240 240 console.error('-----------', e)
241   - this.ruleForm.detailedLocation = e.address
242   - this.lat = e.lat
243   - this.lng = e.lng
  241 + this.lat = e[0].lat
  242 + this.lng = e[0].lng
  243 + this.ruleForm.detailedLocation = JSON.stringify(e)
  244 +
244 245 },
245 246 changimg(e, type) {
246 247 this.ruleForm[type] = e
... ...
admin-web-master/src/components/chakan/cd.vue
  View file @0c8ae4d
... ... @@ -53,12 +53,12 @@
53 53 </el-form-item>
54 54 </el-col>
55 55 </el-row>
56   - <el-form-item label="详细位置" prop="detailedLocation">
  56 + <!-- <el-form-item label="详细位置" prop="detailedLocation">
57 57 <div class="duiqi">{{editbgid.detailedLocation || '无'}}</div>
58   - </el-form-item>
  58 + </el-form-item> -->
59 59 <el-form-item label="地图标点" prop="mapMarker">
60 60 <div style="width: 100%;height: 300px;">
61   - <newmap :isx="false" :message="editbgid.mapMarker"></newmap>
  61 + <newmap :isx="false" :message="editbgid.detailedLocation"></newmap>
62 62 </div>
63 63 </el-form-item>
64 64 <el-form-item label="场地描述" prop="description">
... ... @@ -249,7 +249,7 @@
249 249 cereBusinessOperationqueryByPage,
250 250 cereContractInformation
251 251 } from '@/api/newly';
252   - import newmap from "@/components/newmap/index";
  252 + import newmap from "@/components/newmap/indexall";
253 253 import {
254 254 changedit
255 255 } from '@/api/information'
... ...
admin-web-master/src/components/newmap/indexall.vue 0 → 100644
  View file @0c8ae4d
  1 +<template>
  2 + <div>
  3 + <div id="container"></div>
  4 + <!-- <div id="toolControl">
  5 + <div
  6 + class="toolItem"
  7 + :class="{ active: activeType === 'marker' }"
  8 + id="marker"
  9 + title="点标记"
  10 + @click="setActiveType('marker')"
  11 + ></div>
  12 + <div
  13 + class="toolItem"
  14 + :class="{ active: activeType === 'polyline' }"
  15 + id="polyline"
  16 + title="折线"
  17 + @click="setActiveType('polyline')"
  18 + ></div>
  19 + <div
  20 + class="toolItem"
  21 + :class="{ active: activeType === 'polygon' }"
  22 + id="polygon"
  23 + title="多边形"
  24 + @click="setActiveType('polygon')"
  25 + ></div>
  26 + <div
  27 + class="toolItem"
  28 + :class="{ active: activeType === 'circle' }"
  29 + id="circle"
  30 + title="圆形"
  31 + @click="setActiveType('circle')"
  32 + ></div>
  33 + <div
  34 + class="toolItem"
  35 + :class="{ active: activeType === 'rectangle' }"
  36 + id="rectangle"
  37 + title="矩形"
  38 + @click="setActiveType('rectangle')"
  39 + ></div>
  40 + <div
  41 + class="toolItem"
  42 + :class="{ active: activeType === 'ellipse' }"
  43 + id="ellipse"
  44 + title="椭圆"
  45 + @click="setActiveType('ellipse')"
  46 + ></div>
  47 + </div> -->
  48 + <!-- <div style="height: 100px;">
  49 + 绘制：鼠标左键点击及移动即可绘制图形
  50 + <br />
  51 + 结束绘制：鼠标左键双击即可结束绘制折线、多边形会自动闭合；圆形、矩形、椭圆单击即可结束
  52 + <br />
  53 + 中断：绘制过程中按下esc键可中断该过程
  54 + </div> -->
  55 + </div>
  56 +</template>
  57 +
  58 +<script>
  59 +export default {
  60 + name: 'IndexAll',
  61 + data() {
  62 + return {
  63 + map: null, // 地图
  64 + editor: null, // 编辑器
  65 + activeType: 'marker', // 激活的图形编辑类型
  66 + marker: null,
  67 + polyline: null,
  68 + polygon: null,
  69 + circle: null,
  70 + rectangle: null,
  71 + ellipse: null,
  72 + };
  73 + },
  74 + props: {
  75 + lat: {
  76 + type: Number,
  77 + default: 30.67
  78 + },
  79 + lng: {
  80 + type: Number,
  81 + default: 104.06
  82 + },
  83 + message:{
  84 + type: String,
  85 + default: ''
  86 + },
  87 + },
  88 + mounted() {
  89 + this.initMap();
  90 + this.setActiveType('polygon')
  91 + },
  92 + methods: {
  93 + setActiveType(type) {
  94 + this.activeType = type;
  95 + this.editor.setActiveOverlay(type);
  96 + },
  97 + initMap() {
  98 + // 初始化地图
  99 + this.map = new TMap.Map('container', {
  100 + zoom: 12, // 设置地图缩放级别
  101 + center: new TMap.LatLng(this.lat, this.lng), // 设置地图中心点坐标
  102 + });
  103 + var path = [];
  104 + if(this.message != '') {
  105 + let listall = JSON.parse(this.message)
  106 + for (let index = 0; index < listall.length; index++) {
  107 + const element = listall[index];
  108 + const c1 = new TMap.LatLng(element.lat,element.lng)
  109 + path.push(c1)
  110 + }
  111 + }
  112 +
  113 + // 初始化几何图形及编辑器
  114 + this.marker = new TMap.MultiMarker({
  115 + map: this.map,
  116 + });
  117 + this.polyline = new TMap.MultiPolyline({
  118 + map: this.map,
  119 + });
  120 + this.polygon = new TMap.MultiPolygon({
  121 + map: this.map,
  122 + geometries: [
  123 + {
  124 + 'id': 'p1', //该多边形在图层中的唯一标识（删除、更新数据时需要）
  125 + 'styleId': 'polygon', //绑定样式名
  126 + 'paths': path, //多边形轮廓
  127 + }
  128 + ]
  129 + });
  130 + this.circle = new TMap.MultiCircle({
  131 + map: this.map,
  132 + });
  133 + this.rectangle = new TMap.MultiRectangle({
  134 + map: this.map,
  135 + });
  136 + this.ellipse = new TMap.MultiEllipse({
  137 + map: this.map,
  138 + });
  139 +
  140 + this.editor = new TMap.tools.GeometryEditor({
  141 + map: this.map, // 编辑器绑定的地图对象
  142 + overlayList: [
  143 + {
  144 + overlay: this.marker,
  145 + id: 'marker',
  146 + },
  147 + {
  148 + overlay: this.polyline,
  149 + id: 'polyline',
  150 + },
  151 + {
  152 + overlay: this.polygon,
  153 + id: 'polygon',
  154 + },
  155 + {
  156 + overlay: this.circle,
  157 + id: 'circle',
  158 + },
  159 + {
  160 + overlay: this.rectangle,
  161 + id: 'rectangle',
  162 + },
  163 + {
  164 + overlay: this.ellipse,
  165 + id: 'ellipse',
  166 + },
  167 + ],
  168 + actionMode: TMap.tools.constants.EDITOR_ACTION.DRAW, // 编辑器的工作模式
  169 + activeOverlayId: 'marker', // 激活图层
  170 + snappable: true, // 开启吸附
  171 + });
  172 +
  173 + // 监听绘制结束事件，获取绘制几何图形
  174 + this.editor.on('draw_complete', (geometry) => {
  175 + const id = geometry.id;
  176 + if (this.editor.getActiveOverlay().id === 'rectangle') {
  177 + const geo = this.rectangle.geometries.filter((item) => item.id === id);
  178 + console.log('绘制的矩形定位的坐标：', geo[0].paths);
  179 + }
  180 +
  181 + if (this.editor.getActiveOverlay().id === 'polygon') {
  182 + // console.error(this.polygon.geometries)
  183 + const geo = this.polygon.geometries.filter((item) => item.id === id);
  184 + console.log('绘制的多边形坐标：', geo[0].paths);
  185 + // var path = [
  186 + // ];
  187 + // for (let index = 0; index < geo[0].paths.length; index++) {
  188 + // const element = geo[0].paths[index];
  189 + // const c1 = new TMap.LatLng(element.lat,element.lng)
  190 + // path.push(c1)
  191 + // }
  192 + // // 计算多边形形心
  193 + // var position = TMap.geometry.computeCentroid(path);
  194 + // console.log('绘制的多边形坐标：',position);
  195 + this.$emit('updatecenter', geo[0].paths);
  196 + }
  197 + });
  198 + },
  199 +
  200 + },
  201 +};
  202 +</script>
  203 +
  204 +<style scoped>
  205 +html,
  206 +body {
  207 + height: 100%;
  208 + margin: 0px;
  209 + padding: 0px;
  210 +}
  211 +
  212 +#container {
  213 + width: 100%;
  214 + height: 300px;
  215 +}
  216 +
  217 +#toolControl {
  218 + position: absolute;
  219 + top: 10px;
  220 + left: 0px;
  221 + right: 0px;
  222 + margin: auto;
  223 + width: 252px;
  224 + z-index: 1001;
  225 +}
  226 +
  227 +.toolItem {
  228 + width: 30px;
  229 + height: 30px;
  230 + float: left;
  231 + margin: 1px;
  232 + padding: 4px;
  233 + border-radius: 3px;
  234 + background-size: 30px 30px;
  235 + background-position: 4px 4px;
  236 + background-repeat: no-repeat;
  237 + box-shadow: 0 1px 2px 0 #e4e7ef;
  238 + background-color: #ffffff;
  239 + border: 1px solid #ffffff;
  240 +}
  241 +
  242 +.toolItem:hover {
  243 + border-color: #789cff;
  244 +}
  245 +
  246 +.active {
  247 + border-color: #d5dff2;
  248 + background-color: #d5dff2;
  249 +}
  250 +
  251 +#marker {
  252 + background-image: url('https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/marker_editor.png');
  253 +}
  254 +
  255 +#polyline {
  256 + background-image: url('https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/polyline.png');
  257 +}
  258 +
  259 +#polygon {
  260 + background-image: url('https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/polygon.png');
  261 +}
  262 +
  263 +#circle {
  264 + background-image: url('https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/circle.png');
  265 +}
  266 +
  267 +#rectangle {
  268 + background-image: url('https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/rectangle.png');
  269 +}
  270 +
  271 +#ellipse {
  272 + background-image: url('https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/ellipse.png');
  273 +}
  274 +</style>
0 275 \ No newline at end of file
... ...
admin-web-master/src/components/newmap/map.vue
  View file @0c8ae4d
... ... @@ -70,9 +70,14 @@ export default {
70 70 item.lng = parseFloat(list[1]);
71 71 item.name = this.ontype == '1' ? item.shopName : this.ontype == '2' ? item.advertisingName : this.ontype == '3' ? item.venueName :'无';
72 72 const markerLatLng = new qq.maps.LatLng(item.lat, item.lng);
  73 + const customIconUrl1 = require('@/assets/images/icon4.png'); // 确保返回的是 URL 字符串
  74 + const customIconUrl2 = require('@/assets/images/icon6.png'); // 确保返回的是 URL 字符串
  75 + const customIconUrl3 = require('@/assets/images/icon5.png'); // 确保返回的是 URL 字符串
  76 + const icon = this.ontype == '1'?customIconUrl1:this.ontype == '2'?customIconUrl2:this.ontype =='3'?customIconUrl3:''
73 77 const marker = new qq.maps.Marker({
74 78 position: markerLatLng,
75   - map: this.map
  79 + map: this.map,
  80 + icon:icon
76 81 });
77 82  
78 83 // 为标记添加点击事件监听器
... ... @@ -87,10 +92,11 @@ export default {
87 92 showInfoWindow(marker, item) {
88 93 // 设置信息窗口的内容
89 94 const content = `
90   - <div>
91   - <p style="padding-top:5px;"><strong>资源名称:</strong> ${item.name}</p>
92   - <p style="padding-top:5px;"><strong>位置:</strong> ${item.detailedLocation}</p>
93   - </div>
  95 + <div style="padding:10px 0;border-radius: 18px;">
  96 + <p style="padding-top:10px;">资源名称:${item.name}</p>
  97 + <p style="padding-top:10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;max-width: 200px;">位置:${item.detailedLocation}</p>
  98 + <p style="padding-top:10px;">租赁情况:<text style="${item.publishStatus=='4'?"color: #3f9b6a;":"color: #f59a23;"}">${item.publishStatus=='0'?'空置中':item.publishStatus=='1'?'待审核':item.publishStatus=='2'?'已发布':item.publishStatus=='3'?'不通过':item.publishStatus=='4'?'已租赁':'-'}</text></p>
  99 + </div>
94 100 `;
95 101 // <div style="background: #fff;padding:5px 15px;border-radius: 18px;">
96 102 // <el-form :model="${item}" ref="ruleForm" label-width="80px" class="demo-ruleForm">
... ...
admin-web-master/src/components/newmap/map2.vue 0 → 100644
  View file @0c8ae4d
  1 +<template>
  2 + <div style="position: relative;width: 100%;">
  3 + <div id="mapContainer" class="map"></div>
  4 + </div>
  5 +</template>
  6 +
  7 +<script>
  8 +export default {
  9 + name: 'TencentMap',
  10 + props: {
  11 + lat: {
  12 + type: Number,
  13 + default: 30.67
  14 + },
  15 + lng: {
  16 + type: Number,
  17 + default: 104.06
  18 + },
  19 + isonloed: {
  20 + type: Boolean,
  21 + default: false
  22 + },
  23 + isx: {
  24 + type: Boolean,
  25 + default: true
  26 + },
  27 + ontype: {
  28 + type: String,
  29 + default: '1'
  30 + },
  31 + message: {
  32 + type: Array,
  33 + default: () => []
  34 + },
  35 + },
  36 + data() {
  37 + return {
  38 + map: null,
  39 + marker: null,
  40 + address: '',
  41 + markers: [],
  42 + infoWindow: null,
  43 + };
  44 + },
  45 + mounted() {
  46 + // 初始化地图
  47 + this.initMap(this.message);
  48 + },
  49 + methods: {
  50 + initMap(e) {
  51 + // this.message = e
  52 + e.forEach((item,index) => {
  53 + let list = this.ontype == '1' ? item.mapPunctuation.split(',') : this.ontype == '2' ? item.mapPunctuation.split(',') : this.ontype == '3' ? item.mapMarker.split(',') : [];
  54 + item.lat = parseFloat(list[0]);
  55 + item.lng = parseFloat(list[1]);
  56 + item.name = this.ontype == '1' ? item.shopName : this.ontype == '2' ? item.advertisingName : this.ontype == '3' ? item.venueName :'无';
  57 + // const markerLatLng = new TMap.LatLng(item.lat, item.lng);
  58 + // let marker = {
  59 + // "id": 'marker'+(index+1),
  60 + // "styleId": 'marker',
  61 + // "position": new TMap.LatLng(item.lat,item.lng),
  62 + // "properties": {
  63 + // "title": "marker" +(index+1)
  64 + // }
  65 + // }
  66 + this.markers.push(item);
  67 + });
  68 + // 将经纬度转换为腾讯地图的LatLng对象
  69 + const centerLatLng = new TMap.LatLng(this.lat, this.lng);
  70 + console.error(this.lat, this.lng)
  71 + // 创建地图实例
  72 + //初始化地图
  73 +
  74 + this.map = new TMap.Map("mapContainer", {
  75 + zoom:12,//设置地图缩放级别
  76 + center: centerLatLng//设置地图中心点坐标
  77 + });
  78 + // this.map = new TMap.Map(document.getElementById('mapContainer'), {
  79 + // center: centerLatLng,
  80 + // zoom: 13
  81 + // });
  82 +
  83 + // 创建信息窗口实例
  84 + // this.infoWindow = new TMap.InfoWindow({
  85 + // map: this.map,
  86 + // });
  87 + // this.marker = new TMap.MultiMarker({
  88 + // map: this.map,
  89 + // styles: {
  90 + // // 点标记样式
  91 + // marker: new TMap.MarkerStyle({
  92 + // width: 20, // 样式宽
  93 + // height: 30, // 样式高
  94 + // anchor: { x: 10, y: 30 }, // 描点位置
  95 + // src: 'https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/markerNew.png'
  96 + // }),
  97 + // },
  98 + // geometries: [
  99 + // // 点标记数据数组
  100 + // {
  101 + // // 标记位置(纬度，经度，高度)
  102 + // position: centerLatLng,
  103 + // id: 'marker',
  104 + // },
  105 + // ],
  106 + // });
  107 +
  108 + // 遍历 message 数组，为每个位置创建一个标记
  109 +
  110 +
  111 +
  112 + this.createMarker()
  113 + },
  114 + createMarker(e) {
  115 + let list = [
  116 + [30.67454811395484,104.00550842285156],
  117 + [30.67,104.06],
  118 + ]
  119 + const customIconUrl1 = require('@/assets/images/icon4.png'); // 确保返回的是 URL 字符串
  120 + const customIconUrl2 = require('@/assets/images/icon6.png'); // 确保返回的是 URL 字符串
  121 + const customIconUrl3 = require('@/assets/images/icon5.png'); // 确保返回的是 URL 字符串
  122 + const icon = this.ontype == '1'?customIconUrl1:this.ontype == '2'?customIconUrl2:this.ontype =='3'?customIconUrl3:''
  123 + this.marker = new TMap.MultiMarker({
  124 + id: 'marker-layer',
  125 + map: this.map,
  126 + styles: {
  127 + "marker": new TMap.MarkerStyle({
  128 + "width": 51,
  129 + "height": 53,
  130 + "anchor": { x: 16, y: 32 },
  131 + "src": icon
  132 + })
  133 + },
  134 + geometries: [
  135 + {
  136 + "id": 'marker1',
  137 + "styleId": 'marker',
  138 + "position": new TMap.LatLng(list[0][0],list[0][1],),
  139 + "properties": {
  140 + "title": "marker1"
  141 + }
  142 + },
  143 + {
  144 + "id": 'marker2',
  145 + "styleId": 'marker',
  146 + "position": new TMap.LatLng(list[1][0],list[1][1],),
  147 + "properties": {
  148 + "title": "marker2"
  149 + }
  150 + },
  151 + ]
  152 + });
  153 +
  154 + return
  155 + if (!this.marker) {
  156 + this.marker = new TMap.MultiMarker({
  157 + id: 'marker-layer',
  158 + map: this.map,
  159 + styles: {
  160 + "marker": new TMap.MarkerStyle({
  161 + "width": 25,
  162 + "height": 35,
  163 + "anchor": { x: 16, y: 32 },
  164 + "src": 'https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/markerDefault.png'
  165 + })
  166 + },
  167 + geometries: e
  168 + });
  169 + this.marker = new TMap.MultiMarker({
  170 + id: 'marker-layer',
  171 + map: this.map,
  172 + styles: {
  173 + "marker": new TMap.MarkerStyle({
  174 + "width": 51,
  175 + "height": 53,
  176 + "anchor": { x: 16, y: 32 },
  177 + "src": icon
  178 + })
  179 + },
  180 + geometries: e
  181 + });
  182 + }
  183 + },
  184 + showInfoWindow(marker, item) {
  185 + console.error('----------')
  186 + // 设置信息窗口的内容
  187 + const content = `
  188 + <div style="padding:10px 0;border-radius: 18px;">
  189 + <p style="padding-top:10px;">资源名称:${item.name}</p>
  190 + <p style="padding-top:10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;max-width: 200px;">位置:${item.detailedLocation}</p>
  191 + <p style="padding-top:10px;">租赁情况:<text style="${item.publishStatus=='4'?"color: #3f9b6a;":"color: #f59a23;"}">${item.publishStatus=='0'?'空置中':item.publishStatus=='1'?'待审核':item.publishStatus=='2'?'已发布':item.publishStatus=='3'?'不通过':item.publishStatus=='4'?'已租赁':'-'}</text></p>
  192 + </div>
  193 + `;
  194 + // <div style="background: #fff;padding:5px 15px;border-radius: 18px;">
  195 + // <el-form :model="${item}" ref="ruleForm" label-width="80px" class="demo-ruleForm">
  196 + // <el-form-item label="资源名称" prop="entityName">
  197 + // <div class="duiqi">${item.name}</div>
  198 + // </el-form-item>
  199 + // <el-form-item label="位置" prop="entityName">
  200 + // <div class="duiqi">${item.detailedLocation}</div>
  201 + // </el-form-item>
  202 + // </el-form>
  203 + // </div>
  204 + // 设置信息窗口的位置和内容
  205 + this.infoWindow.setPosition(marker.getPosition());
  206 + this.infoWindow.setContent(content);
  207 + this.infoWindow.open();
  208 + }
  209 + }
  210 +}
  211 +</script>
  212 +
  213 +<style scoped>
  214 +.map {
  215 + width: 100%;
  216 + height: 400px;
  217 + overflow: hidden;
  218 +}
  219 +
  220 +.address-info {
  221 + position: absolute;
  222 + bottom: 0;
  223 + left: 0;
  224 + z-index: 999999;
  225 + background: #ffffff;
  226 +}
  227 +</style>
0 228 \ No newline at end of file
... ...