'init

unknown
Showing 6 changed files with 55 additions and 20 deletions
package-lock.json
package.json
src/App.vue
src/components/basic/Map_info.vue
src/components/menu/MyMenu.vue
src/main.js
--- a/package-lock.json
View file @38485ed
+++ b/package-lock.json
View file @38485ed
@@ -4617,6 +4617,11 @@
        }
      }
    },
+    "font-awesome": {
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz",
+      "integrity": "sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM="
+    },
    "for-in": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
--- a/package.json
View file @38485ed
+++ b/package.json
View file @38485ed
@@ -13,6 +13,7 @@
    "@mapbox/mapbox-gl-draw": "^1.1.2",
    "@supermap/iclient-mapboxgl": "^10.0.0",
    "ant-design-vue": "^1.4.10",
+    "font-awesome": "^4.7.0",
    "jquery": "^3.4.1",
    "mapbox-gl": "^1.6.0",
    "mapbox-gl-compare": "^0.3.0",
--- a/src/App.vue
View file @38485ed
+++ b/src/App.vue
View file @38485ed
@@ -2,13 +2,13 @@
 * @Author: jiangbotao
 * @Date: 2019-12-12 17:40:15
 * @LastEditors: jiangbotao
- * @LastEditTime: 2019-12-14 10:21:51
+ * @LastEditTime: 2019-12-14 11:49:06
 * @FilePath: \mymapbox\src\App.vue
 -->
 <template>
-<a-layout id="components-layout-demo-top-side-2">
+  <a-layout id="components-layout-demo-top-side-2">
    <a-layout-header class="header">
-      <a-icon type="compass" />&nbsp;&nbsp;温州项目VUE 2DMap示例(v10.0)
+      <span class="fa fa-globe fa-lg"></span>&nbsp;&nbsp;温州项目VUE 2DMap示例(v10.0)
      <a-menu
        theme="dark"
        mode="horizontal"
@@ -17,7 +17,7 @@
      </a-menu>
    </a-layout-header>
    <a-layout>
-      <a-layout-sider width="200" style="background: #fff">
+      <a-layout-sider collapsible v-model="collapsed">
        <MyMenu></MyMenu>
      </a-layout-sider>
      <a-layout style="padding: 10px 10px 10px 10px">
@@ -47,11 +47,11 @@ export default {
 <style>
  .ant-layout-header {
    height: 64px;
-    padding: 0 10px;
+    padding: 0 25px;
    line-height: 64px;
    background: #096fd0;
    color: white;
-    font-size: 30px;
+    font-size: 26px;
    border-bottom-style: solid;
    border-bottom-width: 2px;
    border-bottom-color: #bb5905;
@@ -66,6 +66,26 @@ export default {
    margin: 16px 28px 16px 0;
    float: left;
  }
+  .ant-layout-sider {
+    position: relative;
+    min-width: 0;
+    background:white;
+    -webkit-transition: all 0.2s;
+    transition: all 0.2s;
+  }
+  .ant-layout-sider-trigger {
+    position: fixed;
+    bottom: 0;
+    z-index: 1;
+    height: 48px;
+    color: #b73c3c;
+    line-height: 48px;
+    text-align: center;
+    background: #ffffff;
+    cursor: pointer;
+    -webkit-transition: all 0.2s;
+    transition: all 0.2s;
+  }
  #app{
    height: 100%;
  }
--- a/src/components/basic/Map_info.vue
View file @38485ed
+++ b/src/components/basic/Map_info.vue
View file @38485ed
@@ -2,7 +2,7 @@
 * @Author: jiangbotao
 * @Date: 2019-12-09 23:17:48
 * @LastEditors: jiangbotao
- * @LastEditTime: 2019-12-13 00:41:31
+ * @LastEditTime: 2019-12-14 12:06:23
 * @FilePath: \mymapbox\src\components\Map3857.vue
 -->
 <template>
@@ -12,6 +12,7 @@
 </template>
 <script>
+import $ from 'jquery';
 import mapboxgl from 'mapbox-gl';
 import { Logo, MapService } from '@supermap/iclient-mapboxgl';
 export default {
@@ -75,6 +76,10 @@ export default {
                .setHTML(innerHTML + "</br>")
                .addTo(map);
        }
+        $('#map').on('resize', function() { 
+            console.log('resize');
+        });
    }
 }
 </script>
--- a/src/components/menu/MyMenu.vue
View file @38485ed
+++ b/src/components/menu/MyMenu.vue
View file @38485ed
@@ -2,24 +2,24 @@
 * @Author: jiangbotao
 * @Date: 2019-12-13 23:53:57
 * @LastEditors: jiangbotao
- * @LastEditTime: 2019-12-13 23:57:11
+ * @LastEditTime: 2019-12-14 12:09:23
 * @FilePath: \supermapvue\src\components\menu\MyMenu.vue
 -->
 <template>
-    <a-menu
+    <a-menu theme="light" :defaultSelectedKeys="['1']" mode="inline">
-        mode="inline"
+        <a-menu-item key="1">
-        :defaultSelectedKeys="['1']"
+            <span class="fa fa-map fa-lg"/>
-        :defaultOpenKeys="['sub1']"
+            <router-link :to="'/'"><span>默认信息</span></router-link>
-        :style="{ height: '100%', borderRight: 0 }">
+        </a-menu-item>
        <a-sub-menu key="sub1">
-            <span slot="title"><a-icon type="user" />基本信息</span>
+            <span slot="title"><a-icon type="user" /><span>基本信息</span></span>
            <a-menu-item key="1_1"><router-link :to="'/'">地图信息</router-link></a-menu-item>
            <a-menu-item key="1_2"><router-link :to="'/rastertile'">栅格瓦片</router-link></a-menu-item>
            <a-menu-item key="1_3"><router-link :to="'/mvt'">矢量瓦片</router-link></a-menu-item>
            <a-menu-item key="1_4"><router-link :to="'/measure'">地图量测</router-link></a-menu-item>
        </a-sub-menu>
        <a-sub-menu key="sub2">
-            <span slot="title"><a-icon type="laptop" />要素查询</span>
+            <span slot="title"><a-icon type="team" /><span>要素查询</span></span>
            <a-menu-item key="2_1"><router-link :to="'/feature_bounds'">Bounds查询</router-link></a-menu-item>
            <a-menu-item key="2_2"><router-link :to="'/feature_buffer'">缓冲区查询</router-link></a-menu-item>
            <a-menu-item key="2_3"><router-link :to="'/feature_draw'">手工空间查询</router-link></a-menu-item>
@@ -27,23 +27,26 @@
            <a-menu-item key="2_5"><router-link :to="'/feature_sql'">SQL查询</router-link></a-menu-item>
        </a-sub-menu>
        <a-sub-menu key="sub3">
-            <span slot="title"><a-icon type="notification" />检索</span>
+            <span slot="title"><a-icon type="compass" /><span>要素检索</span></span>
            <a-menu-item key="3_1"><router-link :to="'/query_bounds'">Bounds检索</router-link></a-menu-item>
            <a-menu-item key="3_2"><router-link :to="'/query_distance'">距离检索</router-link></a-menu-item>
            <a-menu-item key="3_3"><router-link :to="'/query_geo'">几何检索</router-link></a-menu-item>
            <a-menu-item key="3_4"><router-link :to="'/query_sql'">SQL检索</router-link></a-menu-item>
        </a-sub-menu>
        <a-sub-menu key="sub4">
-            <span slot="title"><a-icon type="appstore" />空间</span>
+            <span slot="title"><a-icon type="appstore" /><span>空间</span></span>
            <a-menu-item key="4_1"><router-link :to="'/spatial_buffer'">构造缓冲区</router-link></a-menu-item>
            <a-menu-item key="4_2"><router-link :to="'/spatial_heatmap'">热力图</router-link></a-menu-item>
        </a-sub-menu>
        <a-sub-menu key="sub5">
-            <span slot="title"><a-icon type="setting" />专题图</span>
+            <span slot="title"><a-icon type="setting" /><span>专题图</span></span>
            <a-menu-item key="5_1"><router-link :to="'/theme_dot'">点密度</router-link></a-menu-item>
            <a-menu-item key="5_2"><router-link :to="'/theme_gra'">分级图</router-link></a-menu-item>
            <a-menu-item key="5_3"><router-link :to="'/theme_range'">分段渲染</router-link></a-menu-item>
            <a-menu-item key="5_4"><router-link :to="'/theme_label'">注记图</router-link></a-menu-item>
        </a-sub-menu>
    </a-menu>
-</template>
\ No newline at end of file
+</template>
+<style scoped>
+</style>
\ No newline at end of file
--- a/src/main.js
View file @38485ed
+++ b/src/main.js
View file @38485ed
@@ -2,7 +2,7 @@
 * @Author: jiangbotao
 * @Date: 2019-12-12 17:40:15
 * @LastEditors: jiangbotao
- * @LastEditTime: 2019-12-13 23:28:46
+ * @LastEditTime: 2019-12-14 11:51:38
 * @FilePath: \supermapvue\src\main.js
 */
 // The Vue build version to load with the `import` command
@@ -12,6 +12,7 @@ import Antd from 'ant-design-vue'
 import App from './App'
 import router from './router'
 import 'ant-design-vue/dist/antd.css'
+import 'font-awesome/css/font-awesome.css'
 Vue.config.productionTip = false
 Vue.use(Antd)