首页 发现 帮助
注册 登录
chenzhiguang
/
szfh_one
1
0
派生 0
文件 工单管理 0 合并请求 0 Wiki
浏览代码

update

tremble 3 年之前
当前提交
24d0edcf48
共有 46 个文件被更改，包括 37137 次插入 和 0 次删除
分列视图 显示文件统计
  1. 3 0
      .browserslistrc
  2. 17 0
      .eslintrc.js
  3. 23 0
      .gitignore
  4. 24 0
      README.md
  5. 5 0
      babel.config.js
  6. 11936 0
      package-lock.json
  7. 28 0
      package.json
  8. 21 0
      public/index.html
  9. 7 0
      public/js/clipboard.min.js
  10. 2463 0
      public/js/hammer.js
  11. 3 0
      public/js/svg-pan-zoom.min.js
  12. 123 0
      src/App.vue
  13. 二进制
      src/assets/images/bg_pc.jpg
  14. 二进制
      src/assets/images/btn_home.png
  15. 二进制
      src/assets/images/btn_share.png
  16. 二进制
      src/assets/images/close.png
  17. 二进制
      src/assets/images/list_open@2x.png
  18. 二进制
      src/assets/images/list_pulldown@2x.png
  19. 二进制
      src/assets/images/list_retract@2x.png
  20. 1 0
      src/assets/images/map.svg
  21. 二进制
      src/assets/images/maps_bg@2x.png
  22. 二进制
      src/assets/images/nav_skip@2x.png
  23. 二进制
      src/assets/images/pop_close@2x.png
  24. 二进制
      src/assets/images/show_enlarge@2x.png
  25. 二进制
      src/assets/images/show_enlarge@2x_w.png
  26. 二进制
      src/assets/images/show_help@2x.png
  27. 二进制
      src/assets/images/show_narrow@2x.png
  28. 二进制
      src/assets/images/show_narrow@2x_w.png
  29. 7 0
      src/assets/style/public.css
  30. 109 0
      src/assets/style/reset.css
  31. 223 0
      src/components/data.js
  32. 537 0
      src/components/data2.js
  33. 159 0
      src/components/fold.vue
  34. 9514 0
      src/components/map.vue
  35. 10126 0
      src/components/map2.vue
  36. 112 0
      src/components/select.vue
  37. 171 0
      src/components/share.vue
  38. 561 0
      src/components/style.less
  39. 630 0
      src/components/style2.less
  40. 22 0
      src/main.js
  41. 24 0
      src/router/index.js
  42. 35 0
      src/utils/browser.js
  43. 28 0
      src/utils/index.js
  44. 152 0
      src/views/Home.vue
  45. 70 0
      src/views/iframe.vue
  46. 3 0
      vue.config.js

+ 3 - 0
.browserslistrc
查看文件 

@@ -0,0 +1,3 @@
 
+> 1%
 
+last 2 versions
 
+not dead

+ 17 - 0
.eslintrc.js
查看文件 

@@ -0,0 +1,17 @@
 
+module.exports = {
 
+  root: true,
 
+  env: {
 
+    node: true
 
+  },
 
+  'extends': [
 
+    'plugin:vue/essential',
 
+    'eslint:recommended'
 
+  ],
 
+  parserOptions: {
 
+    parser: 'babel-eslint'
 
+  },
 
+  rules: {
 
+    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
 
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
 
+  }
 
+}

+ 23 - 0
.gitignore
查看文件 

@@ -0,0 +1,23 @@
 
+.DS_Store
 
+node_modules
 
+/dist
 
+
 
+
 
+# local env files
 
+.env.local
 
+.env.*.local
 
+
 
+# Log files
 
+npm-debug.log*
 
+yarn-debug.log*
 
+yarn-error.log*
 
+pnpm-debug.log*
 
+
 
+# Editor directories and files
 
+.idea
 
+.vscode
 
+*.suo
 
+*.ntvs*
 
+*.njsproj
 
+*.sln
 
+*.sw?

+ 24 - 0
README.md
查看文件 

@@ -0,0 +1,24 @@
 
+# cdhz
 
+
 
+## Project setup
 
+```
 
+npm install
 
+```
 
+
 
+### Compiles and hot-reloads for development
 
+```
 
+npm run serve
 
+```
 
+
 
+### Compiles and minifies for production
 
+```
 
+npm run build
 
+```
 
+
 
+### Lints and fixes files
 
+```
 
+npm run lint
 
+```
 
+
 
+### Customize configuration
 
+See [Configuration Reference](https://cli.vuejs.org/config/).

+ 5 - 0
babel.config.js
查看文件 

@@ -0,0 +1,5 @@
 
+module.exports = {
 
+  presets: [
 
+    '@vue/cli-plugin-babel/preset'
 
+  ]
 
+}

文件差异内容过多而无法显示
+ 11936 - 0
package-lock.json


+ 28 - 0
package.json
查看文件 

@@ -0,0 +1,28 @@
 
+{
 
+  "name": "cdhz",
 
+  "version": "0.1.0",
 
+  "private": true,
 
+  "scripts": {
 
+    "serve": "vue-cli-service serve",
 
+    "build": "vue-cli-service build",
 
+    "lint": "vue-cli-service lint"
 
+  },
 
+  "dependencies": {
 
+    "@panzoom/panzoom": "^4.3.2",
 
+    "core-js": "^3.6.5",
 
+    "vue": "^2.6.11",
 
+    "vue-router": "^3.2.0"
 
+  },
 
+  "devDependencies": {
 
+    "@vue/cli-plugin-babel": "~4.5.0",
 
+    "@vue/cli-plugin-eslint": "~4.5.0",
 
+    "@vue/cli-plugin-router": "~4.5.0",
 
+    "@vue/cli-service": "~4.5.0",
 
+    "babel-eslint": "^10.1.0",
 
+    "eslint": "^6.7.2",
 
+    "eslint-plugin-vue": "^6.2.2",
 
+    "less": "^3.0.4",
 
+    "less-loader": "^5.0.0",
 
+    "vue-template-compiler": "^2.6.11"
 
+  }
 
+}

+ 21 - 0
public/index.html
查看文件 

@@ -0,0 +1,21 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+  <head>
 
+    <meta charset="utf-8">
 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">
 
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
 
+    <title>首届数字政府建设峰会</title>
 
+  </head>
 
+  <body>
 
+    <noscript>
 
+      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
 
+    </noscript>
 
+    <div id="app"></div>
 
+    <!-- built files will be auto injected -->
 
+    <script src="<%= BASE_URL %>js/svg-pan-zoom.min.js"></script>
 
+    <script src="<%= BASE_URL %>js/hammer.js"></script>
 
+    <script src="<%= BASE_URL %>js/clipboard.min.js"></script>
 
+
 
+  </body>
 
+</html>

文件差异内容过多而无法显示
+ 7 - 0
public/js/clipboard.min.js


文件差异内容过多而无法显示
+ 2463 - 0
public/js/hammer.js


文件差异内容过多而无法显示
+ 3 - 0
public/js/svg-pan-zoom.min.js


+ 123 - 0
src/App.vue
查看文件 

@@ -0,0 +1,123 @@
 
+<template>
 
+  <div id="app">
 
+    <router-view :select="select" />
 
+    <fold
 
+      @close="fActive = false"
 
+      class="fold-con"
 
+      :isActive="fActive"
 
+      :class="{ 'fold-active': fActive }"
 
+    />
 
+
 
+    <vSelect
 
+      v-show="$route.name=='Home'"
 
+      :select="select"
 
+      class="select"
 
+      @select="
 
+        (data) => {
 
+          select = data;
 
+        }
 
+      "
 
+    />
 
+
 
+    <div class="btn-show" @click.stop="fActive = !fActive">参展企业</div>
 
+  </div>
 
+</template>
 
+<script>
 
+import "@/assets/style/reset.css";
 
+import "@/assets/style/public.css";
 
+
 
+import fold from "@/components/fold.vue";
 
+import select from "@/components/select.vue";
 
+
 
+export default {
 
+  components: {
 
+    vSelect: select,
 
+    fold,
 
+  },
 
+  data() {
 
+    return {
 
+      fActive: false,
 
+      showselect:false
 
+    };
 
+  }
 
+};
 
+</script>
 
+
 
+<style lang="less">
 
+html,
 
+body {
 
+  width: 100%;
 
+  height: 100%;
 
+}
 
+#app {
 
+  background: #f7f7f7;
 
+  width: 100%;
 
+  height: 100%;
 
+  overflow: hidden;
 
+  position: relative;
 
+
 
+  .fold-con {
 
+    position: absolute;
 
+    right: -500px;
 
+    bottom: 96px;
 
+    transition: right 0.3s ease;
 
+  }
 
+
 
+  .fold-active {
 
+    z-index: 99;
 
+    right: 30px;
 
+  }
 
+
 
+  .btn-show {
 
+    text-align: center;
 
+    color: #fff;
 
+    background: linear-gradient(270deg, #00cfff 0%, #00aaff 100%);
 
+    bottom: 30px;
 
+    right: 30px;
 
+    position: absolute;
 
+    z-index: 1;
 
+    font-size: 20px;
 
+    cursor: pointer;
 
+    width: 144px;
 
+    height: 56px;
 
+    line-height: 56px;
 
+    border-radius: 6px;
 
+  }
 
+}
 
+
 
+
 
+@media screen and (max-width: 500px) {
 
+#app {
 
+  .fold-con {
 
+    position: absolute;
 
+    right: -100%;
 
+    bottom: 70px;
 
+    transition: right 0.3s ease;
 
+  }
 
+
 
+  .fold-active {
 
+    z-index: 99;
 
+    right: 0;
 
+  }
 
+  .select{
 
+    top: unset;
 
+    bottom: 60px;
 
+    right: 10px;
 
+    transform: scale(0.7);
 
+    transform-origin: right;
 
+  }
 
+
 
+  .btn-show {
 
+    bottom: 20px;
 
+    right: 10px;
 
+    z-index: 1;
 
+    font-size: 16px;
 
+    cursor: pointer;
 
+    width: 90px;
 
+    height: 40px;
 
+    line-height: 40px;
 
+    border-radius: 6px;
 
+  }
 
+}
 
+}
 
+</style>

二进制
src/assets/images/bg_pc.jpg
查看文件


二进制
src/assets/images/btn_home.png
查看文件


二进制
src/assets/images/btn_share.png
查看文件


二进制
src/assets/images/close.png
查看文件


二进制
src/assets/images/list_open@2x.png
查看文件


二进制
src/assets/images/list_pulldown@2x.png
查看文件


二进制
src/assets/images/list_retract@2x.png
查看文件


文件差异内容过多而无法显示
+ 1 - 0
src/assets/images/map.svg


二进制
src/assets/images/maps_bg@2x.png
查看文件


二进制
src/assets/images/nav_skip@2x.png
查看文件


二进制
src/assets/images/pop_close@2x.png
查看文件


二进制
src/assets/images/show_enlarge@2x.png
查看文件


二进制
src/assets/images/show_enlarge@2x_w.png
查看文件


二进制
src/assets/images/show_help@2x.png
查看文件


二进制
src/assets/images/show_narrow@2x.png
查看文件


二进制
src/assets/images/show_narrow@2x_w.png
查看文件


+ 7 - 0
src/assets/style/public.css
查看文件 

@@ -0,0 +1,7 @@
 
+.svg-pan-zoom-control{
 
+  display: none!important;
 
+}
 
+
 
+*{
 
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 
+}

+ 109 - 0
src/assets/style/reset.css
查看文件 

@@ -0,0 +1,109 @@
 
+
 
+html, body, div, span, applet, object, iframe,
 
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
 
+a, abbr, acronym, address, big, cite, code,
 
+del, dfn, em, img, ins, kbd, q, s, samp,
 
+small, strike, strong, sub, sup, tt, var,
 
+b, u, i, center,
 
+dl, dt, dd, ol, ul, li,
 
+fieldset, form, label, legend,
 
+table, caption, tbody, tfoot, thead, tr, th, td,
 
+article, aside, canvas, details, embed, 
+figure, figcaption, footer, header, hgroup, 
+menu, nav, output, ruby, section, summary,
 
+time, mark, audio, video {
 
+  font-family: "Microsoft YaHei","Microsoft JhengHei";;
 
+	margin: 0;
 
+	padding: 0;
 
+	border: 0;
 
+	font-size: 100%;
 
+	vertical-align: baseline;
 
+}
 
+*{
 
+  box-sizing: border-box;
 
+}
 
+/* HTML5 display-role reset for older browsers */
 
+article, aside, details, figcaption, figure, 
+footer, header, hgroup, menu, nav, section, main {
 
+	display: block;
 
+}
 
+html{
 
+	height: 100%;
 
+}
 
+body {
 
+	line-height: 1;
 
+	height: 100%;
 
+}
 
+html,body{
 
+	font-size: 16px;
 
+}
 
+ol, ul {
 
+	list-style: none;
 
+}
 
+blockquote, q {
 
+	quotes: none;
 
+}
 
+blockquote:before, blockquote:after,
 
+q:before, q:after {
 
+	content: '';
 
+	content: none;
 
+}
 
+table {
 
+	border-collapse: collapse;
 
+	border-spacing: 0;
 
+}
 
+button{outline:none; border: none;}
 
+input, button, select, textarea {
 
+outline: none;
 
+appearance: none;
 
+-webkit-appearance: none;
 
+border-radius: 0;
 
+-webkit-appearance: textfield;
 
+    background-color: white;
 
+    -webkit-rtl-ordering: logical;
 
+    cursor: text;
 
+    padding: 1px;
 
+    border-color: initial;
 
+    border-image: initial;
 
+}
 
+input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
 
+        -webkit-appearance:textfield;
 
+}
 
+input[type="number"]{
 
+        -moz-appearance:textfield;
 
+}
 
+input:focus { outline: none; } 
+select::-ms-expand {
 
+display: none;
 
+}
 
+
 
+
 
+::-webkit-scrollbar-track-piece {  
+	background-color:#ffffff;  
+}  
+::-webkit-scrollbar {  
+	width:0;  
+	height:10px;  
+}  
+::-webkit-scrollbar-thumb {  
+	background-color:#e5e5e5;  
+	background-clip:padding-box;  
+	min-height:20px;  
+	border-radius: 3px;
 
+}  
+::-webkit-scrollbar-thumb:hover {  
+	background-color:#929292;  
+}  
+
 
+table th,
 
+table td {
 
+  text-align: center !important;
 
+}
 
+
 
+table th > .cell{
 
+	color: #000;
 
+}
 
+
 
+textarea{
 
+  height: 8rem!important;
 
+}

+ 223 - 0
src/components/data.js
查看文件 

@@ -0,0 +1,223 @@
 
+const raw = {
 
+  primary: [
 
+    {
 
+      url: "uOOgUDc7j&lang=zh&firstView=pano:16,qua:-0.2411,-0.658,-0.2356,0.6734",
 
+      name: "国办&部委",
 
+      id: 1,
 
+      key:'GBBW',
 
+      color: "#DD7E6B",
 
+      isHide:true
 
+    },
 
+    {
 
+      url: "uOOgUDc7j&lang=zh&firstView=pano:34,qua:0.0126,0.2591,-0.0034,0.9658",
 
+      name: "广东省",
 
+      key:'GDS',
 
+      id: 2,
 
+      color: "#DD7E6B",
 
+      isHide:true
 
+    },
 
+    {
 
+      url: "7gjMOKpUke&lang=zh&firstView=pano:2,qua:-0.1805,0.096,0.0177,0.9787",
 
+      name: "深圳",
 
+      key:'SZ',
 
+      id: 3,
 
+      color: "#DD7E6B",
 
+      isHide:true
 
+    },
 
+    {
 
+      url: "vroMUXdx",
 
+      name: "上海",
 
+      key:'SH',
 
+      id: 4,
 
+      color: "#DD7E6B",
 
+      isHide:true
 
+    },
 
+    {
 
+      url: "vroMUXdx",
 
+      name: "贵州",
 
+      id: 5,
 
+      key:'GZ',
 
+      color: "#DD7E6B",
 
+      isHide:true
 
+    },
 
+    {
 
+      url: "vroMUXdx",
 
+      name: "北京",
 
+      id: 6,
 
+      key:'BJ',
 
+      color: "#DD7E6B",
 
+      isHide:true
 
+    },
 
+    {
 
+      url: "vroMUXdx",
 
+      name: "休息区",
 
+      key:'XIUXIQU',
 
+      id: 7,
 
+      color: "#DD7E6B",
 
+      isHide:true
 
+    },
 
+    {
 
+      url: "vroMUXdx",
 
+      name: "A区",
 
+      id: 8,
 
+      color: "#916CE5",
 
+    },
 
+    {
 
+      url: "vroMUXdx",
 
+      name: "B区",
 
+      id: 9,
 
+      color: "#DDBC6B",
 
+    },
 
+  ],
 
+  secondary: [
 
+    {
 
+      p_id: 8,
 
+      bgclr: '#794DDD',
 
+      data: [
 
+		{
 
+          xuhao: "A1",
 
+          url: "oFCV0OaG84&lang=zh&firstView=pano:0,qua:-0.1158,0.7445,0.1339,0.6438",
 
+          name: "华为",
 
+          id:1
 
+        },
 
+		{
 
+          xuhao: "A2",
 
+          url: "vroMUXdx",
 
+          name: "腾讯",
 
+          id:2
 
+        },{
 
+          xuhao: "A3",
 
+          url: "vroMUXdx",
 
+          name: "深智城",
 
+          id:3
 
+        },{
 
+          xuhao: "A4",
 
+          url: "vroMUXdx",
 
+          name: "广联达",
 
+          id:4
 
+        },{
 
+          xuhao: "A5",
 
+          url: "vroMUXdx",
 
+          name: "深信服",
 
+          id:5
 
+        },{
 
+          xuhao: "A6",
 
+          url: "vroMUXdx",
 
+          name: "中国电信",
 
+          id:6
 
+        },
 
+        {
 
+          xuhao: "A7",
 
+          url: "vroMUXdx",
 
+          name: "中国移动",
 
+          id:7
 
+        },
 
+        {
 
+          xuhao: "A8",
 
+          url: "vroMUXdx",
 
+          name: "中国联通",
 
+          id:8
 
+        },
 
+      ],
 
+    },
 
+    {
 
+      p_id: 9,
 
+      bgclr: '#CC9C23',
 
+      data: [
 
+        {
 
+          xuhao: "B1",
 
+          url: "vroMUkZaw692dHm&lang=zh&firstView=pano:8,qua:0.017,0.246,-0.0043,0.9691Xdx",
 
+          name: "中国电子信息产业集团有限公司",
 
+          id: 1
 
+        },
 
+		{
 
+          xuhao: "B2",
 
+          url: "C2phKAqXHV&lang=zh&firstView=pano:2,qua:-0.0188,0.703,0.0186,0.7107",
 
+          name: "奇安信科技集团股份有限公司",
 
+          id: 2
 
+        },
 
+        {
 
+          xuhao: "B3",
 
+          url: "vroMUXdx",
 
+          name: "中电科新型智慧城市研究院有限公司",
 
+          id: 3
 
+        },
 
+		{
 
+          xuhao: "B4",
 
+          url: "vroMUXdx",
 
+          name: "杭州海康威视数字技术股份有限公司",
 
+          id: 4
 
+        },
 
+		{
 
+          xuhao: "B5",
 
+          url: "vroMUXdx",
 
+          name: "科大讯飞股份有限公司",
 
+          id: 5
 
+        },
 
+		{
 
+          xuhao: "B6",
 
+          url: "vroMUXdx",
 
+          name: "奥格科技股份有限公司",
 
+          id: 6
 
+        },
 
+		{
 
+          xuhao: "B7",
 
+          url: "vroMUXdx",
 
+          name: "中兴通讯股份有限公司",
 
+          id: 7
 
+        },
 
+		{
 
+          xuhao: "B8",
 
+          url: "vroMUXdx",
 
+          name: "阿里巴巴集团控股有限公司",
 
+          id: 8
 
+        },
 
+		{
 
+          xuhao: "B9",
 
+          url: "vroMUXdx",
 
+          name: "广州市智慧城市投资公司",
 
+          id: 9
 
+        },
 
+		{
 
+          xuhao: "B10",
 
+          url: "vroMUXdx",
 
+          name: "云从科技集团股份有限公司",
 
+          id: 10
 
+        },
 
+		{
 
+          xuhao: "B11",
 
+          url: "vroMUXdx",
 
+          name: "广州广电运通金融电子股份有限公司",
 
+          id: 11
 
+        },
 
+		{
 
+          xuhao: "B12",
 
+          url: "vroMUXdx",
 
+          name: "中国南方电网有限责任公司",
 
+          id: 12
 
+        },
 
+      ],
 
+    },
 
+  ]
 
+};
 
+
 
+let loop = (main, sub) => {
 
+  let data = main.map((item) => {
 
+    sub.forEach((sub) => {
 
+      if (item.id === sub.p_id) {
 
+        item.sub = sub;
 
+        item.show = false;
 
+      }
 
+    });
 
+    return item;
 
+  });
 
+
 
+  return data;
 
+};
 
+
 
+let data = loop(raw.primary, raw.secondary);
 
+
 
+module.exports = {
 
+  data,
 
+  raw,
 
+};

+ 537 - 0
src/components/data2.js
查看文件 

@@ -0,0 +1,537 @@
 
+const raw = {
 
+  primary: [
 
+    {
 
+      name: "C区",
 
+      id: 1,
 
+      color: "#ED8A5F",
 
+    },
 
+    {
 
+      name: "D区",
 
+      id: 2,
 
+      color: "#EAB363",
 
+    },
 
+    {
 
+      name: "E区",
 
+      id: 3,
 
+      color: "#C872DD",
 
+    },
 
+    {
 
+      name: "F区",
 
+      id: 4,
 
+      color: "#5EDAEF",
 
+    },
 
+    {
 
+      name: "G区",
 
+      id: 5,
 
+      color: "#3A6BD6",
 
+    },
 
+    {
 
+      name: "H区",
 
+      id: 6,
 
+      color: "#80CE89",
 
+    },
 
+  ],
 
+  secondary: [
 
+    {
 
+      p_id: 1, //对应primary的id
 
+      bgclr: "#E36E3B",
 
+      data: [
 
+        {
 
+          xuhao: "C1",
 
+          url: "sPOpr07IX&lang=zh&firstView=pano:52,qua:-0.0006,-0.5783,-0.0004,0.8158",
 
+          name: "视联动力信息技术股份有限公司",
 
+          id: 1,
 
+        },
 
+        {
 
+          xuhao: "C2",
 
+          url: "sPOpr07IX&lang=zh&firstView=pano:16,qua:-0.1747,-0.0027,-0.0005,0.9846",
 
+          name: "齐心好视通",
 
+          id: 2,
 
+        },
 
+        {
 
+          xuhao: "C3",
 
+          url: "vroMUXdx",
 
+          name: "上海卓繁信息技术股份有限公司",
 
+          id: 3,
 
+        },
 
+        {
 
+          xuhao: "C4",
 
+          url: "vroMUXdx",
 
+          name: "信创联盟",
 
+          id: 4,
 
+        },
 
+        {
 
+          xuhao: "C5",
 
+          url: "vroMUXdx",
 
+          name: "信创联盟",
 
+          id: 5,
 
+        },
 
+        {
 
+          xuhao: "C6",
 
+          url: "vroMUXdx",
 
+          name: "工业和信息化部电子第五研究所",
 
+          id: 6,
 
+        },
 
+        {
 
+          xuhao: "C7",
 
+          url: "vroMUXdx",
 
+          name: "联想集团",
 
+          id: 7,
 
+        },
 
+      ],
 
+    },
 
+    {
 
+      p_id: 2,
 
+      bgclr: "#DF9325",
 
+      data: [
 
+        {
 
+          xuhao: "D1",
 
+          url: "https://www.4dkankan.com/spc.html?m=RNAdjRVrG&lang=zh&firstView=pano:0,qua:-0.0876,0.6674,0.0796,0.7352",
 
+          name: "厦门市巨龙信息科技有限公司",
 
+          id: 1,
 
+        },
 
+        {
 
+          xuhao: "D2",
 
+          url: "RNAdjRVrG&lang=zh&firstView=pano:0,qua:-0.0876,0.6674,0.0796,0.7352",
 
+          name: "珠海欧比特宇航科技股份有限公司",
 
+          id: 2,
 
+        },
 
+        {
 
+          xuhao: "D3",
 
+          url: "vroMUXdx",
 
+          name: "广东君略科技咨询有限公司",
 
+          id: 3,
 
+        },
 
+        {
 
+          xuhao: "D4",
 
+          url: "vroMUXdx",
 
+          name: "广州智能科技发展有限公司",
 
+          id: 4,
 
+        },
 
+        {
 
+          xuhao: "D5",
 
+          url: "vroMUXdx",
 
+          name: "广州市中智软件开发有限公司",
 
+          id: 5,
 
+        },
 
+        {
 
+          xuhao: "D6",
 
+          url: "vroMUXdx",
 
+          name: "广东方纬科技有限公司",
 
+          id: 6,
 
+        },
 
+        {
 
+          xuhao: "D7",
 
+          url: "vroMUXdx",
 
+          name: "武大吉奥信息技术有限公司",
 
+          id: 7,
 
+        },
 
+        {
 
+          xuhao: "D8",
 
+          url: "vroMUXdx",
 
+          name: "珠海市四维时代网络有限公司",
 
+          id: 8,
 
+        },
 
+      ],
 
+    },
 
+    {
 
+      p_id: 3, //对应primary的id
 
+      bgclr: "#B53BD3",
 
+      data: [
 
+        {
 
+          xuhao: "E1",
 
+          url: "vroMUXdx",
 
+          name: "中国航天科工集团第二研究院七〇六所",
 
+          id: 1,
 
+        },
 
+        {
 
+          xuhao: "E2",
 
+          url: "vroMUXdx",
 
+          name: "珠海金山办公软件有限公司",
 
+          id: 2,
 
+        },
 
+        {
 
+          xuhao: "E3",
 
+          url: "vroMUXdx",
 
+          name: "广州软件应用技术研究所",
 
+          id: 3,
 
+        },
 
+        {
 
+          xuhao: "E4",
 
+          url: "vroMUXdx",
 
+          name: "中智政源技术有限公司",
 
+          id: 4,
 
+        },
 
+        {
 
+          xuhao: "E5",
 
+          url: "vroMUXdx",
 
+          name: "南方报业传媒集团",
 
+          id: 5,
 
+        },
 
+        {
 
+          xuhao: "E6",
 
+          url: "vroMUXdx",
 
+          name: "北京国脉互联信息顾问有限公司",
 
+          id: 6,
 
+        },
 
+        {
 
+          xuhao: "E7",
 
+          url: "vroMUXdx",
 
+          name: "广东紫慧旭光科技有限公司",
 
+          id: 7,
 
+        },
 
+        {
 
+          xuhao: "E8",
 
+          url: "vroMUXdx",
 
+          name: "双杨信息科技（珠海）有限公司",
 
+          id: 8,
 
+        },
 
+        {
 
+          xuhao: "E9",
 
+          url: "vroMUXdx",
 
+          name: "广州华资软件技术有限公司",
 
+          id: 9,
 
+        },
 
+        {
 
+          xuhao: "E10",
 
+          url: "vroMUXdx",
 
+          name: "北京构力科技有限公司",
 
+          id: 10,
 
+        },
 
+        {
 
+          xuhao: "E11",
 
+          url: "vroMUXdx",
 
+          name: "深圳云天励飞技术股份有限公司",
 
+          id: 11,
 
+        },
 
+      ],
 
+    },
 
+    {
 
+      p_id: 4, //对应primary的id
 
+      bgclr: "#13B1CC",
 
+      data: [
 
+        {
 
+          xuhao: "F1",
 
+          url: "vroMUXdx",
 
+          name: "360政企安全集团",
 
+          id: 1,
 
+        },
 
+        {
 
+          xuhao: "F2",
 
+          url: "vroMUXdx",
 
+          name: "北京永信至诚科技股份有限公司",
 
+          id: 2,
 
+        },
 
+        {
 
+          xuhao: "F3",
 
+          url: "vroMUXdx",
 
+          name: "开普数智科技（广东）有限公司",
 
+          id: 3,
 
+        },
 
+        {
 
+          xuhao: "F4",
 
+          url: "vroMUXdx",
 
+          name: "北京安天网络安全技术有限公司",
 
+          id: 4,
 
+        },
 
+        {
 
+          xuhao: "F5",
 
+          url: "vroMUXdx",
 
+          name: "中孚信息股份有限公司",
 
+          id: 5,
 
+        },
 
+        {
 
+          xuhao: "F6",
 
+          url: "vroMUXdx",
 
+          name: "广东中安网脉华南技术有限公司",
 
+          id: 6,
 
+        },
 
+        {
 
+          xuhao: "F7",
 
+          url: "vroMUXdx",
 
+          name: "数安时代科技股份有限公司",
 
+          id: 7,
 
+        },
 
+        {
 
+          xuhao: "F8",
 
+          url: "vroMUXdx",
 
+          name: "北京升鑫网络科技有限公司",
 
+          id: 8,
 
+        },
 
+        {
 
+          xuhao: "F9",
 
+          url: "vroMUXdx",
 
+          name: "广东省电子商务认证有限公司",
 
+          id: 9,
 
+        },
 
+        {
 
+          xuhao: "F10",
 
+          url: "vroMUXdx",
 
+          name: "杭州世平信息科技有限公司",
 
+          id: 10,
 
+        },
 
+        {
 
+          xuhao: "F11",
 
+          url: "vroMUXdx",
 
+          name: "绿盟科技集团股份有限公司",
 
+          id: 11,
 
+        },
 
+        {
 
+          xuhao: "F12",
 
+          url: "vroMUXdx",
 
+          name: "天融信科技集团",
 
+          id: 12,
 
+        },
 
+        {
 
+          xuhao: "F13",
 
+          url: "vroMUXdx",
 
+          name: "北京启明星辰信息安全技术有限公司",
 
+          id: 13,
 
+        },
 
+        {
 
+          xuhao: "F14",
 
+          url: "vroMUXdx",
 
+          name: "杭州安恒信息技术股份有限公司",
 
+          id: 14,
 
+        },
 
+        {
 
+          xuhao: "F15",
 
+          url: "vroMUXdx",
 
+          name: "广东广宇科技发展有限公司",
 
+          id: 15,
 
+        },
 
+      ],
 
+    },
 
+    {
 
+      p_id: 5, //对应primary的id
 
+      bgclr: "#598BF6",
 
+      data: [
 
+        {
 
+          xuhao: "G1",
 
+          url: "vroMUXdx",
 
+          name: "新华三技术有限公司",
 
+          id: 1,
 
+        },
 
+        {
 
+          xuhao: "G2",
 
+          url: "vroMUXdx",
 
+          name: "广东省医学科学院广东省人民医院",
 
+          id: 2,
 
+        },
 
+        {
 
+          xuhao: "G3",
 
+          url: "vroMUXdx",
 
+          name: "广州南科信息科技有限公司",
 
+          id: 3,
 
+        },
 
+        {
 
+          xuhao: "G4",
 
+          url: "vroMUXdx",
 
+          name: "北明软件有限公司",
 
+          id: 4,
 
+        },
 
+        {
 
+          xuhao: "G5",
 
+          url: "vroMUXdx",
 
+          name: "北京东方通科技股份有限公司",
 
+          id: 5,
 
+        },
 
+        {
 
+          xuhao: "G6",
 
+          url: "vroMUXdx",
 
+          name: "广东金赋科技股份有限公司",
 
+          id: 6,
 
+        },
 
+        {
 
+          xuhao: "G7",
 
+          url: "vroMUXdx",
 
+          name: "深圳太极云软技术有限公司",
 
+          id: 7,
 
+        },
 
+        {
 
+          xuhao: "G8",
 
+          url: "vroMUXdx",
 
+          name: "国泰新点软件股份有限公司",
 
+          id: 8,
 
+        },
 
+        {
 
+          xuhao: "G9",
 
+          url: "vroMUXdx",
 
+          name: "厦门市美亚柏科信息股份有限公司 ",
 
+          id: 9,
 
+        },
 
+        {
 
+          xuhao: "G10",
 
+          url: "vroMUXdx",
 
+          name: "西湾智慧（广东）信息科技有限公司",
 
+          id: 10,
 
+        },
 
+        {
 
+          xuhao: "G11",
 
+          url: "vroMUXdx",
 
+          name: "广州数鹏通科技有限公司",
 
+          id: 11,
 
+        },
 
+        {
 
+          xuhao: "G12",
 
+          url: "vroMUXdx",
 
+          name: "福建博思软件股份有限公司",
 
+          id: 12,
 
+        },
 
+        {
 
+          xuhao: "G13",
 
+          url: "vroMUXdx",
 
+          name: "广州政企互联科技有限公司",
 
+          id: 13,
 
+        },
 
+        {
 
+          xuhao: "G14",
 
+          url: "vroMUXdx",
 
+          name: "广东南方数码科技股份有限公司",
 
+          id: 14,
 
+        },
 
+      ],
 
+    },
 
+    {
 
+      p_id: 6, //对应primary的id
 
+      bgclr: "#66AF6B",
 
+      data: [
 
+        {
 
+          xuhao: "H1",
 
+          url: "vroMUXdx",
 
+          name: "广东中浦科技有限公司",
 
+          id: 1,
 
+        },
 
+        {
 
+          xuhao: "H2",
 
+          url: "vroMUXdx",
 
+          name: "统信软件技术有限公司",
 
+          id: 2,
 
+        },
 
+        {
 
+          xuhao: "H3",
 
+          url: "vroMUXdx",
 
+          name: "北京数字认证股份有限公司",
 
+          id: 3,
 
+        },
 
+        {
 
+          xuhao: "H4",
 
+          url: "vroMUXdx",
 
+          name: "金税信息技术服务股份有限公司",
 
+          id: 4,
 
+        },
 
+        {
 
+          xuhao: "H5",
 
+          url: "vroMUXdx",
 
+          name: "北京国脉信安科技有限公司",
 
+          id: 5,
 
+        },
 
+        {
 
+          xuhao: "H6",
 
+          url: "vroMUXdx",
 
+          name: "润建股份有限公司",
 
+          id: 6,
 
+        },
 
+        {
 
+          xuhao: "H7",
 
+          url: "vroMUXdx",
 
+          name: "广东紫晶信息存储技术股份有限公司",
 
+          id: 7,
 
+        },
 
+        {
 
+          xuhao: "H8",
 
+          url: "vroMUXdx",
 
+          name: "广东三鼎实业集团有限公司",
 
+          id: 8,
 
+        },
 
+        {
 
+          xuhao: "H9",
 
+          url: "vroMUXdx",
 
+          name: "广东智信信息科技股份有限公司",
 
+          id: 9,
 
+        },
 
+        {
 
+          xuhao: "H10",
 
+          url: "vroMUXdx",
 
+          name: "广东国腾量子科技有限公司",
 
+          id: 10,
 
+        },
 
+        {
 
+          xuhao: "H11",
 
+          url: "vroMUXdx",
 
+          name: "北京建设数字科技有限公司",
 
+          id: 11,
 
+        },
 
+        {
 
+          xuhao: "H12",
 
+          url: "vroMUXdx",
 
+          name: "广东信航信息技术有限公司",
 
+          id: 12,
 
+        },
 
+        {
 
+          xuhao: "H13",
 
+          url: "vroMUXdx",
 
+          name: "瀚蓝环境股份有限公司",
 
+          id: 13,
 
+        },
 
+        {
 
+          xuhao: "H14",
 
+          url: "vroMUXdx",
 
+          name: "国衡智慧（广东）科技有限公司",
 
+          id: 14,
 
+        },
 
+        {
 
+          xuhao: "H15",
 
+          url: "vroMUXdx",
 
+          name: "广东数字生态科技有限责任公司",
 
+          id: 15,
 
+        },
 
+        {
 
+          xuhao: "H16",
 
+          url: "vroMUXdx",
 
+          name: "云浮市物联网研究院有限公司",
 
+          id: 16,
 
+        },
 
+        {
 
+          xuhao: "H17",
 
+          url: "vroMUXdx",
 
+          name: "广州中大凯旋电子科技有限公司",
 
+          id: 17,
 
+        },
 
+        {
 
+          xuhao: "H18",
 
+          url: "vroMUXdx",
 
+          name: "广东柯内特环境科技有限公司",
 
+          id: 18,
 
+        },
 
+        {
 
+          xuhao: "H19",
 
+          url: "vroMUXdx",
 
+          name: "广东省广播电视网络股份有限公司",
 
+          id: 19,
 
+        },
 
+      ],
 
+    },
 
+  ],
 
+};
 
+
 
+let loop = (main, sub) => {
 
+  let data = main.map((item) => {
 
+    sub.forEach((sub) => {
 
+      if (item.id === sub.p_id) {
 
+        item.sub = sub;
 
+        item.show = false;
 
+      }
 
+    });
 
+    return item;
 
+  });
 
+
 
+  return data;
 
+};
 
+
 
+let data = loop(raw.primary, raw.secondary);
 
+
 
+module.exports = {
 
+  data,
 
+  raw,
 
+};

+ 159 - 0
src/components/fold.vue
查看文件 

@@ -0,0 +1,159 @@
 
+<template>
 
+  <div class="fold">
 
+    <ul>
 
+      <li :class="{anima:isActive}" @click.stop="showItem(item)" :style="{background:item.color,transitionDelay:`${(i+1)*0.1}s`}" v-for="(item,i) in rawdata" :key="i">
 
+        <div>
 
+          <span>{{item.name}}</span>
 
+          <span>{{item.xuhao}}</span>
 
+        </div>
 
+        <img v-if="item.sub" :src="require(`@/assets/images/${!item.show?`show_enlarge@2x.png`:`show_narrow@2x.png`}`)" alt="">
 
+        <ul @click.stop v-if="item.sub" :style="{maxHeight:item.show?`${item.sub.data.length*70}px`:'0','padding-bottom':item.show?'10px':'0'}">
 
+          <li :style="{background:item.sub.bgclr||''}" v-for="(sub,idx) in item.sub.data" :key="idx">
 
+            <div @click.stop="showItem(sub)" :class="{bLine:item.bgclr}">
 
+              <div>
 
+                <span>{{sub.name}}</span>
 
+                <span>{{sub.xuhao}}</span>
 
+              </div>
 
+            </div>
 
+          </li>
 
+        </ul>
 
+      </li>
 
+    </ul>
 
+  </div>
 
+</template>
 
+
 
+<script>
 
+import {data} from './data.js'
 
+import {data as data2} from './data2.js'
 
+
 
+import browser from '@/utils/browser'
 
+
 
+
 
+export default {
 
+  props:['isActive'],
 
+  data(){
 
+    let tt = data.concat(data2)
 
+    let temp = tt.filter(item=>{
 
+      item.show = false
 
+      return !item.isHide
 
+    })
 
+    return {
 
+      rawdata:temp,
 
+      isMobile: browser.mobile
 
+    }
 
+  },
 
+  methods:{
 
+    goto(url){
 
+      this.$router.push({
 
+        name:'iframe',
 
+        params:{
 
+          id: url
 
+        }
 
+      })
 
+    },
 
+    showItem(item){
 
+      if (!item.sub) {
 
+        this.goto(item.url)
 
+        return 
+      }
 
+      item.show = !item.show
 
+    }
 
+  }
 
+}
 
+</script>
 
+
 
+<style lang="less" scoped>
 
+.fold{
 
+  width: 320px;
 
+  min-height: 70px;
 
+  max-height: 600px;
 
+  background: linear-gradient(180deg, #00D3F6 0%, #234ED8 100%);
 
+  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
 
+  opacity: 1;
 
+  padding: 15px;
 
+  border-radius: 4px;
 
+  overflow: auto;
 
+  .mb-top{
 
+    position: relative;
 
+    border-bottom: 1px solid #ECECEC;
 
+    margin-bottom: 10px;
 
+    padding: 10px 0 20px;
 
+    font-weight: bold;
 
+    >img{
 
+      position: absolute;
 
+      transform: translateX(-50%);
 
+      left: 50%;
 
+      top: 0px;
 
+    }
 
+  }
 
+  >ul{
 
+    color: #FFFFFF;
 
+    height: 100%;
 
+    overflow: hidden;
 
+   >li{
 
+      padding: 0 15px;
 
+      line-height: 40px;
 
+      border-radius: 4px;
 
+      background: #231815;
 
+      position: relative;
 
+      margin-bottom: 10px;
 
+      overflow: hidden;
 
+      transform: translateX(150%);
 
+      transition: none;
 
+      >div{
 
+        display: flex;
 
+        justify-content: space-between;
 
+      }
 
+     >img{
 
+       position: absolute;
 
+       top: 18px;
 
+       right: 15px;
 
+       width: 10px;
 
+     }
 
+     >ul{
 
+      max-height: 0;
 
+      transition: all 0.3s ease;
 
+       >li{
 
+          line-height: 36px;
 
+          background: rgba(255, 255, 255, 0.2);
 
+          border-radius: 4px;
 
+          padding: 0 10px;
 
+          font-size: 14px;
 
+          overflow: hidden;
 
+          cursor: pointer;
 
+          &:not(:last-of-type){
 
+            margin-bottom: 10px;
 
+          }
 
+          >div{
 
+            >div{
 
+              display: flex;
 
+              justify-content: space-between;
 
+              &:not(:last-of-type){
 
+                border-bottom: 1px solid rgba(255,255,255,0.4);
 
+              }
 
+            }
 
+          }
 
+          .bLine{
 
+            >div{
 
+              &:not(:last-of-type){
 
+                border-bottom: 1px solid rgba(0,0,0,0.1);
 
+              }
 
+            }
 
+          }
 
+       }
 
+     }
 
+   } 
+   .anima{
 
+      transform: translateX(0);
 
+      transition: ease .3s transform;
 
+   }
 
+  }
 
+}
 
+
 
+@media screen and (max-width: 500px) {
 
+  .fold{
 
+    max-height: calc(100vh - 70px);
 
+  }
 
+
 
+}
 
+</style>

文件差异内容过多而无法显示
+ 9514 - 0
src/components/map.vue


文件差异内容过多而无法显示
+ 10126 - 0
src/components/map2.vue


+ 112 - 0
src/components/select.vue
查看文件 

@@ -0,0 +1,112 @@
 
+<template>
 
+  <ul class="selectcon">
 
+    <li :class="{ active: active==2 }" @click="active=2,$emit('select',2)">
 
+      <span class="txt">2楼</span>
 
+      <span class="line"></span>
 
+      <span class="round"></span>
 
+    </li>
 
+    <span class="v-line" :style="{top:active==1?'30px':'36px'}"></span>
 
+    <li :class="{ active: active==1 }" @click="active=1,$emit('select',1)">
 
+      <span class="txt">1楼</span>
 
+      <span class="line"></span>
 
+      <span class="round"></span>
 
+    </li>
 
+  </ul>
 
+</template>
 
+
 
+<script>
 
+export default {
 
+  props:['select'],
 
+  data(){
 
+    return {
 
+      active:this.select
 
+    }
 
+  },
 
+  watch:{
 
+    '$route':{
 
+      deep:true,
 
+      handler:function (newVal) {
 
+        console.log(newVal);
 
+        if (newVal != 'Home') {
 
+          this.showselect = true
 
+        }
 
+        
+      }
 
+    }
 
+  }
 
+};
 
+</script>
 
+
 
+<style lang="less" scoped>
 
+.selectcon {
 
+  position: fixed;
 
+  top: 40px;
 
+  right: 10px;
 
+  color: #fff;
 
+  > li {
 
+    display: flex;
 
+    align-items: center;
 
+    justify-content: flex-end;
 
+    cursor: pointer;
 
+    margin-right: 5px;
 
+    &:last-of-type{
 
+      margin-top: 52px;
 
+    }
 
+    .txt {
 
+      width: 80px;
 
+      display: inline-block;
 
+      height: 34px;
 
+      line-height: 34px;
 
+      text-align: right;
 
+    }
 
+    .line {
 
+      display: inline-block;
 
+      background: #fff;
 
+      width: 24px;
 
+      height: 1px;
 
+    }
 
+    .round {
 
+      width: 32px;
 
+      height: 32px;
 
+      background: #fff;
 
+      border-radius: 50%;
 
+    }
 
+  }
 
+  .v-line{
 
+    height: 60px;
 
+    top: 36px;
 
+    display: inline-block;
 
+    background: #fff;
 
+    width: 2px;
 
+    position: absolute;
 
+    right: 20px;
 
+  }
 
+  .active {
 
+    margin-right: 0;
 
+    .txt {
 
+      width: 80px;
 
+      display: inline-block;
 
+      height: 34px;
 
+      line-height: 34px;
 
+      border-radius: 60px;
 
+      background: linear-gradient(270deg, #00cfff 0%, #00aaff 100%);
 
+      border: 4px solid #fff;
 
+      box-sizing: content-box;
 
+      text-align: center;
 
+    }
 
+    .line {
 
+      display: inline-block;
 
+      background: #fff;
 
+      width: 24px;
 
+      height: 2px;
 
+    }
 
+    .round {
 
+      width: 42px;
 
+      height: 42px;
 
+      background: linear-gradient(270deg, #00cfff 0%, #00aaff 100%);
 
+      border-radius: 50%;
 
+      border: 8px solid #fff;
 
+    }
 
+  }
 
+}
 
+</style>

+ 171 - 0
src/components/share.vue
查看文件 

@@ -0,0 +1,171 @@
 
+<template>
 
+  <div class="intro brightness" >
 
+    <div v-if="!istips">
 
+      <p>分享链接给好友</p>
 
+      <div class="link" v-html="url"></div>
 
+      <div class="btn">
 
+        <span ref="btn" class="submit" :data-clipboard-text="url">
 
+          一键复制
 
+        </span>
 
+      </div>
 
+      <img
 
+        class="close"
 
+        @click.stop="$emit('close')"
 
+        :src="require('@/assets/images/close.png')"
 
+      />
 
+    </div>
 
+
 
+    <transition name="fade">
 
+      <div class="tips" v-if="istips">
 
+        场景链接复制成功
 
+      </div>
 
+    </transition>
 
+  </div>
 
+</template>
 
+
 
+<script>
 
+export default {
 
+  methods: {
 
+    handleoutside() {
 
+      this.$emit("close");
 
+    },
 
+  },
 
+  mounted() {
 
+    let copy = new window.ClipboardJS(this.$refs.btn);
 
+    copy.on("success", (e) => {
 
+      this.istips = true
 
+      setTimeout(() => {
 
+        this.istips = false
 
+        this.$emit('close')
 
+      }, 3000);
 
+      e.clearSelection();
 
+    });
 
+    copy.on("error", (err) => console.log(err));
 
+  },
 
+  data() {
 
+    return {
 
+      url: window.location.href.replace('http://','https://'),
 
+      istips:false
 
+    };
 
+  }
 
+};
 
+</script>
 
+
 
+<style lang="less" scoped>
 
+@bx: 0 3px 6px rgba(0, 0, 0, 1);
 
+@bc: rgba(12, 91, 246, 0.8);
 
+@animation: 0.3s ease all;
 
+@color:#000;
 
+
 
+.intro {
 
+  text-align: center;
 
+  width: 100%;
 
+  height: 100%;
 
+  position: fixed;
 
+  z-index: 999;
 
+  top: 0;
 
+  left: 0;
 
+  background: linear-gradient(180deg, rgba(0, 33, 75, 0.84) 0%, rgba(35, 78, 216, 0.84) 100%);
 
+  > div {
 
+    padding: 20px;
 
+    width: 640px;
 
+    transform: translate(-50%, -50%);
 
+    top: 50%;
 
+    left: 50%;
 
+    position: fixed;
 
+    background-color: rgba(27, 27, 27, 0.9);
 
+    border-radius: 5px;
 
+    color:#fff;
 
+    box-sizing: content-box;
 
+    > p {
 
+      text-align: left;
 
+    }
 
+    .link {
 
+      color: #fff;
 
+      text-align: center;
 
+      padding: 30px 20px;
 
+      word-wrap: break-word;
 
+      width: 100%;
 
+      margin: 50px auto;
 
+    }
 
+
 
+    .btn{
 
+      width: 100%;
 
+      display: flex;
 
+      justify-content: space-around;
 
+      align-items: center;
 
+      margin-bottom: 20px;
 
+      >span{
 
+        background: linear-gradient(180deg, #00D3F6 0%, #234ED8 100%);
 
+        border-radius: 32px;
 
+        width: 250px;
 
+        height: 64px;
 
+        line-height: 64px;
 
+        cursor: pointer;
 
+        font-size: 24px;
 
+        border: 1px solid #fff;
 
+        display: inline-block;
 
+      }
 
+    }
 
+
 
+    .close {
 
+      position: absolute;
 
+      top: 14px;
 
+      width: 50px;
 
+      height: 50px;
 
+      right: -10px;
 
+      transform: translateX(-50%);
 
+      border-radius: 30px;
 
+      cursor: pointer;
 
+    }
 
+  }
 
+
 
+  .tips{
 
+    position: absolute;
 
+    top: 50%;
 
+    left: 50%;
 
+    transform: translate(-50%,-50%);
 
+    width: 20%;
 
+    padding: 20px 10px;
 
+    z-index: 99999;
 
+  }
 
+}
 
+@media screen and (max-width: 500px) {
 
+  .intro {
 
+  > div {
 
+    padding: 20px;
 
+    width: 80%;
 
+    > p {
 
+      text-align: center;
 
+      margin-top: 40px;
 
+      font-size: 18px;
 
+    }
 
+    .link {
 
+      color: #fff;
 
+      text-align: center;
 
+      padding: 10px 0px;
 
+      word-wrap: break-word;
 
+      margin: 10px auto 30px;
 
+    }
 
+
 
+    .btn{
 
+      >span{
 
+        width: 60%;
 
+        height: 44px;
 
+        line-height: 44px;
 
+        font-size: 16px;
 
+      }
 
+
 
+    }
 
+
 
+    .close {
 
+      top: 14px;
 
+      width: 30px;
 
+      height: 30px;
 
+      right: 0px;
 
+    }
 
+  }
 
+
 
+}
 
+}
 
+</style>

+ 561 - 0
src/components/style.less
查看文件 

@@ -0,0 +1,561 @@
 
+.cls-1,
 
+.cls-160 {
 
+  fill: none;
 
+}
 
+.cls-2 {
 
+  opacity: 0.8;
 
+}
 
+.cls-3 {
 
+  clip-path: url(#clip-path);
 
+}
 
+.cls-4 {
 
+  clip-path: url(#clip-path-2);
 
+}
 
+.cls-158,
 
+.cls-5 {
 
+  isolation: isolate;
 
+}
 
+.cls-6 {
 
+  fill: #7f7f7f;
 
+}
 
+.cls-158,
 
+.cls-159,
 
+.cls-7 {
 
+  fill: #fff;
 
+}
 
+.cls-8 {
 
+  fill: #00446c;
 
+}
 
+.cls-9 {
 
+  fill: #00315b;
 
+}
 
+.cls-10 {
 
+  fill: #003c70;
 
+}
 
+.cls-11 {
 
+  fill: #c4000f;
 
+}
 
+.cls-12 {
 
+  fill: #7a000a;
 
+}
 
+.cls-13 {
 
+  fill: #a0000d;
 
+}
 
+.cls-14 {
 
+  fill: #cd6f00;
 
+}
 
+.cls-15 {
 
+  fill: #ab5d00;
 
+}
 
+.cls-16 {
 
+  fill: #d39100;
 
+}
 
+.cls-17 {
 
+  fill: #af000e;
 
+}
 
+.cls-18 {
 
+  fill: #e40012;
 
+}
 
+.cls-19 {
 
+  fill: #b66300;
 
+}
 
+.cls-20 {
 
+  fill: #ee8100;
 
+}
 
+.cls-21 {
 
+  fill: #c06800;
 
+}
 
+.cls-22 {
 
+  fill: #7f4500;
 
+}
 
+.cls-23 {
 
+  fill: #835a00;
 
+}
 
+.cls-24 {
 
+  fill: #c58800;
 
+}
 
+.cls-25 {
 
+  fill: #f5a900;
 
+}
 
+.cls-26 {
 
+  clip-path: url(#clip-path-4);
 
+}
 
+.cls-27 {
 
+  fill: #a25800;
 
+}
 
+.cls-28 {
 
+  fill: #9d5500;
 
+}
 
+.cls-29 {
 
+  clip-path: url(#clip-path-5);
 
+}
 
+.cls-30 {
 
+  fill: #a9000d;
 
+}
 
+.cls-31 {
 
+  fill: #a4000d;
 
+}
 
+.cls-32 {
 
+  fill: #ba8000;
 
+}
 
+.cls-33 {
 
+  clip-path: url(#clip-path-6);
 
+}
 
+.cls-34 {
 
+  fill: #9d6c00;
 
+}
 
+.cls-35 {
 
+  fill: #986900;
 
+}
 
+.cls-36 {
 
+  clip-path: url(#clip-path-7);
 
+}
 
+.cls-37 {
 
+  fill: #004077;
 
+}
 
+.cls-38 {
 
+  fill: #003e74;
 
+}
 
+.cls-39 {
 
+  clip-path: url(#clip-path-8);
 
+}
 
+.cls-40 {
 
+  clip-path: url(#clip-path-9);
 
+}
 
+.cls-41 {
 
+  fill: #00437e;
 
+}
 
+.cls-42 {
 
+  fill: #00427a;
 
+}
 
+.cls-43 {
 
+  clip-path: url(#clip-path-10);
 
+}
 
+.cls-44 {
 
+  clip-path: url(#clip-path-11);
 
+}
 
+.cls-45 {
 
+  fill: #003a6d;
 
+}
 
+.cls-46 {
 
+  clip-path: url(#clip-path-12);
 
+}
 
+.cls-47 {
 
+  fill: #003869;
 
+}
 
+.cls-48 {
 
+  clip-path: url(#clip-path-13);
 
+}
 
+.cls-49 {
 
+  fill: #003766;
 
+}
 
+.cls-50 {
 
+  fill: #003563;
 
+}
 
+.cls-51 {
 
+  fill: #00335f;
 
+}
 
+.cls-52 {
 
+  fill: #00315c;
 
+}
 
+.cls-53 {
 
+  fill: #002f58;
 
+}
 
+.cls-54 {
 
+  clip-path: url(#clip-path-14);
 
+}
 
+.cls-55 {
 
+  fill: #005baa;
 
+}
 
+.cls-56 {
 
+  clip-path: url(#clip-path-15);
 
+}
 
+.cls-57 {
 
+  clip-path: url(#clip-path-16);
 
+}
 
+.cls-58 {
 
+  fill: #945000;
 
+}
 
+.cls-59 {
 
+  fill: #985300;
 
+}
 
+.cls-60 {
 
+  clip-path: url(#clip-path-17);
 
+}
 
+.cls-61 {
 
+  fill: #7c4300;
 
+}
 
+.cls-62 {
 
+  clip-path: url(#clip-path-18);
 
+}
 
+.cls-63 {
 
+  fill: #92000c;
 
+}
 
+.cls-64 {
 
+  fill: #96000c;
 
+}
 
+.cls-65 {
 
+  clip-path: url(#clip-path-19);
 
+}
 
+.cls-66 {
 
+  clip-path: url(#clip-path-20);
 
+}
 
+.cls-67 {
 
+  fill: #770009;
 
+}
 
+.cls-68 {
 
+  clip-path: url(#clip-path-21);
 
+}
 
+.cls-69 {
 
+  clip-path: url(#clip-path-22);
 
+}
 
+.cls-70 {
 
+  fill: #7f5800;
 
+}
 
+.cls-71 {
 
+  clip-path: url(#clip-path-23);
 
+}
 
+.cls-72 {
 
+  clip-path: url(#clip-path-24);
 
+}
 
+.cls-73 {
 
+  fill: #936500;
 
+}
 
+.cls-74 {
 
+  clip-path: url(#clip-path-25);
 
+}
 
+.cls-75 {
 
+  fill: #005a8d;
 
+}
 
+.cls-76 {
 
+  fill: #005789;
 
+}
 
+.cls-77 {
 
+  clip-path: url(#clip-path-26);
 
+}
 
+.cls-78 {
 
+  fill: #005485;
 
+}
 
+.cls-79 {
 
+  clip-path: url(#clip-path-27);
 
+}
 
+.cls-80 {
 
+  fill: #005c91;
 
+}
 
+.cls-81 {
 
+  clip-path: url(#clip-path-28);
 
+}
 
+.cls-82 {
 
+  fill: #005281;
 
+}
 
+.cls-83 {
 
+  fill: #004f7d;
 
+}
 
+.cls-84 {
 
+  clip-path: url(#clip-path-29);
 
+}
 
+.cls-85 {
 
+  clip-path: url(#clip-path-30);
 
+}
 
+.cls-86 {
 
+  clip-path: url(#clip-path-31);
 
+}
 
+.cls-87 {
 
+  fill: #004d79;
 
+}
 
+.cls-88 {
 
+  clip-path: url(#clip-path-32);
 
+}
 
+.cls-89 {
 
+  clip-path: url(#clip-path-33);
 
+}
 
+.cls-90 {
 
+  fill: #004a75;
 
+}
 
+.cls-91 {
 
+  fill: #004871;
 
+}
 
+.cls-92 {
 
+  clip-path: url(#clip-path-34);
 
+}
 
+.cls-93 {
 
+  clip-path: url(#clip-path-35);
 
+}
 
+.cls-94 {
 
+  clip-path: url(#clip-path-36);
 
+}
 
+.cls-95 {
 
+  clip-path: url(#clip-path-37);
 
+}
 
+.cls-96 {
 
+  clip-path: url(#clip-path-38);
 
+}
 
+.cls-97 {
 
+  clip-path: url(#clip-path-39);
 
+}
 
+.cls-98 {
 
+  fill: #8e6200;
 
+}
 
+.cls-99 {
 
+  fill: #895f00;
 
+}
 
+.cls-100 {
 
+  clip-path: url(#clip-path-40);
 
+}
 
+.cls-101 {
 
+  fill: #006898;
 
+}
 
+.cls-102 {
 
+  clip-path: url(#clip-path-41);
 
+}
 
+.cls-103 {
 
+  fill: #0072a6;
 
+}
 
+.cls-104 {
 
+  fill: #006fa2;
 
+}
 
+.cls-105 {
 
+  clip-path: url(#clip-path-42);
 
+}
 
+.cls-106 {
 
+  fill: #0075ab;
 
+}
 
+.cls-107 {
 
+  clip-path: url(#clip-path-43);
 
+}
 
+.cls-108 {
 
+  fill: #006594;
 
+}
 
+.cls-109 {
 
+  fill: #00628f;
 
+}
 
+.cls-110 {
 
+  clip-path: url(#clip-path-44);
 
+}
 
+.cls-111 {
 
+  fill: #005f8b;
 
+}
 
+.cls-112 {
 
+  fill: #005c86;
 
+}
 
+.cls-113 {
 
+  clip-path: url(#clip-path-45);
 
+}
 
+.cls-114 {
 
+  fill: #005881;
 
+}
 
+.cls-115 {
 
+  clip-path: url(#clip-path-46);
 
+}
 
+.cls-116 {
 
+  fill: #00557d;
 
+}
 
+.cls-117 {
 
+  clip-path: url(#clip-path-47);
 
+}
 
+.cls-118 {
 
+  clip-path: url(#clip-path-48);
 
+}
 
+.cls-119 {
 
+  fill: #00456d;
 
+}
 
+.cls-120 {
 
+  fill: #004369;
 
+}
 
+.cls-121 {
 
+  clip-path: url(#clip-path-49);
 
+}
 
+.cls-122 {
 
+  clip-path: url(#clip-path-50);
 
+}
 
+.cls-123 {
 
+  clip-path: url(#clip-path-51);
 
+}
 
+.cls-124 {
 
+  fill: #ab7600;
 
+}
 
+.cls-125 {
 
+  clip-path: url(#clip-path-52);
 
+}
 
+.cls-126 {
 
+  clip-path: url(#clip-path-53);
 
+}
 
+.cls-127 {
 
+  fill: #005278;
 
+}
 
+.cls-128 {
 
+  clip-path: url(#clip-path-54);
 
+}
 
+.cls-129 {
 
+  fill: #00547b;
 
+}
 
+.cls-130 {
 
+  fill: #0088c7;
 
+}
 
+.cls-131 {
 
+  fill: #009ee7;
 
+}
 
+.cls-132 {
 
+  clip-path: url(#clip-path-55);
 
+}
 
+.cls-133 {
 
+  clip-path: url(#clip-path-56);
 
+}
 
+.cls-134 {
 
+  clip-path: url(#clip-path-57);
 
+}
 
+.cls-135 {
 
+  clip-path: url(#clip-path-58);
 
+}
 
+.cls-136 {
 
+  clip-path: url(#clip-path-59);
 
+}
 
+.cls-137 {
 
+  clip-path: url(#clip-path-60);
 
+}
 
+.cls-138 {
 
+  fill: #0080ca;
 
+}
 
+.cls-139 {
 
+  clip-path: url(#clip-path-61);
 
+}
 
+.cls-140 {
 
+  clip-path: url(#clip-path-62);
 
+}
 
+.cls-141 {
 
+  clip-path: url(#clip-path-63);
 
+}
 
+.cls-142 {
 
+  clip-path: url(#clip-path-64);
 
+}
 
+.cls-143 {
 
+  clip-path: url(#clip-path-65);
 
+}
 
+.cls-144 {
 
+  clip-path: url(#clip-path-66);
 
+}
 
+.cls-145 {
 
+  clip-path: url(#clip-path-67);
 
+}
 
+.cls-146 {
 
+  clip-path: url(#clip-path-68);
 
+}
 
+.cls-147 {
 
+  clip-path: url(#clip-path-69);
 
+}
 
+.cls-148 {
 
+  clip-path: url(#clip-path-70);
 
+}
 
+.cls-149 {
 
+  fill: #006eae;
 
+}
 
+.cls-150 {
 
+  fill: #004e92;
 
+}
 
+.cls-151 {
 
+  fill: #006b9d;
 
+}
 
+.cls-152,
 
+.cls-161 {
 
+  fill: #dd7e6b;
 
+}
 
+.cls-153 {
 
+  fill: #b5483c;
 
+}
 
+.cls-154 {
 
+  fill: #a52f2d;
 
+}
 
+.cls-155 {
 
+  fill: #ba433a;
 
+}
 
+.cls-156 {
 
+  fill: #ce5e4e;
 
+}
 
+.cls-157 {
 
+  fill: #a8a8a8;
 
+}
 
+.cls-158 {
 
+  opacity: 0.6;
 
+}
 
+.cls-159 {
 
+  opacity: 0.9;
 
+}
 
+.cls-160 {
 
+  stroke: #fff;
 
+  stroke-miterlimit: 10;
 
+}
 
+.cls-161,
 
+.cls-167,
 
+.cls-173 {
 
+  font-size: 16px;
 
+  font-family: SourceHanSansCN-Regular-GBpc-EUC-H, Source Han Sans CN;
 
+}
 
+.cls-162,
 
+.cls-167 {
 
+  fill: #916ce5;
 
+}
 
+.cls-163 {
 
+  fill: #6952cc;
 
+}
 
+.cls-164 {
 
+  fill: #5644c1;
 
+}
 
+.cls-165 {
 
+  fill: #6850cc;
 
+}
 
+.cls-166 {
 
+  fill: #7b5dd8;
 
+}
 
+.cls-168,
 
+.cls-173 {
 
+  fill: #ddbc6b;
 
+}
 
+.cls-169 {
 
+  fill: #ba7820;
 
+}
 
+.cls-170 {
 
+  fill: #9e6613;
 
+}
 
+.cls-171 {
 
+  fill: #b58024;
 
+}
 
+.cls-172 {
 
+  fill: #c99b41;
 
+}
 
+.cls-174 {
 
+  fill: #b2b2b2;
 
+}
 
+.cls-175 {
 
+  fill: #858585;
 
+}
 
+
 
+
 
+
 
+g[data-istag="yes"] {
 
+  display: none;
 
+}
 
+
 
+g[data-isface="yes"]{
 
+  cursor: pointer;
 
+}
 
+
 
+
 
+g[data-isid="yes"] {
 
+  &:hover {
 
+    >g[data-isface="yes"]{
 
+      .cls-168, .cls-173 {
 
+        fill: #fde5aa;
 
+      }
 
+      .cls-162, .cls-167{
 
+        fill: #C1A6FF;
 
+      }
 
+      .cls-152, .cls-161{
 
+        fill: #EE927F;
 
+      }
 
+    }
 
+    
+    g[data-istag="yes"] {
 
+      display: block;
 
+    }
 
+  }
 
+}

+ 630 - 0
src/components/style2.less
查看文件 

@@ -0,0 +1,630 @@
 
+.cls-1,
 
+.cls-160 {
 
+  fill: none;
 
+}
 
+.cls-2 {
 
+  opacity: 0.8;
 
+}
 
+.cls-3 {
 
+  clip-path: url(#clip-path);
 
+}
 
+.cls-4 {
 
+  clip-path: url(#clip-path-2);
 
+}
 
+.cls-158,
 
+.cls-5 {
 
+  isolation: isolate;
 
+}
 
+.cls-6 {
 
+  fill: #7f7f7f;
 
+}
 
+.cls-158,
 
+.cls-159,
 
+.cls-7 {
 
+  fill: #fff;
 
+}
 
+.cls-8 {
 
+  fill: #00446c;
 
+}
 
+.cls-9 {
 
+  fill: #00315b;
 
+}
 
+.cls-10 {
 
+  fill: #003c70;
 
+}
 
+.cls-11 {
 
+  fill: #c4000f;
 
+}
 
+.cls-12 {
 
+  fill: #7a000a;
 
+}
 
+.cls-13 {
 
+  fill: #a0000d;
 
+}
 
+.cls-14 {
 
+  fill: #cd6f00;
 
+}
 
+.cls-15 {
 
+  fill: #ab5d00;
 
+}
 
+.cls-16 {
 
+  fill: #d39100;
 
+}
 
+.cls-17 {
 
+  fill: #af000e;
 
+}
 
+.cls-18 {
 
+  fill: #e40012;
 
+}
 
+.cls-19 {
 
+  fill: #b66300;
 
+}
 
+.cls-20 {
 
+  fill: #ee8100;
 
+}
 
+.cls-21 {
 
+  fill: #c06800;
 
+}
 
+.cls-22 {
 
+  fill: #7f4500;
 
+}
 
+.cls-23 {
 
+  fill: #835a00;
 
+}
 
+.cls-24 {
 
+  fill: #c58800;
 
+}
 
+.cls-25 {
 
+  fill: #f5a900;
 
+}
 
+.cls-26 {
 
+  clip-path: url(#clip-path-4);
 
+}
 
+.cls-27 {
 
+  fill: #a25800;
 
+}
 
+.cls-28 {
 
+  fill: #9d5500;
 
+}
 
+.cls-29 {
 
+  clip-path: url(#clip-path-5);
 
+}
 
+.cls-30 {
 
+  fill: #a9000d;
 
+}
 
+.cls-31 {
 
+  fill: #a4000d;
 
+}
 
+.cls-32 {
 
+  fill: #ba8000;
 
+}
 
+.cls-33 {
 
+  clip-path: url(#clip-path-6);
 
+}
 
+.cls-34 {
 
+  fill: #9d6c00;
 
+}
 
+.cls-35 {
 
+  fill: #986900;
 
+}
 
+.cls-36 {
 
+  clip-path: url(#clip-path-7);
 
+}
 
+.cls-37 {
 
+  fill: #004077;
 
+}
 
+.cls-38 {
 
+  fill: #003e74;
 
+}
 
+.cls-39 {
 
+  clip-path: url(#clip-path-8);
 
+}
 
+.cls-40 {
 
+  clip-path: url(#clip-path-9);
 
+}
 
+.cls-41 {
 
+  fill: #00437e;
 
+}
 
+.cls-42 {
 
+  fill: #00427a;
 
+}
 
+.cls-43 {
 
+  clip-path: url(#clip-path-10);
 
+}
 
+.cls-44 {
 
+  clip-path: url(#clip-path-11);
 
+}
 
+.cls-45 {
 
+  fill: #003a6d;
 
+}
 
+.cls-46 {
 
+  clip-path: url(#clip-path-12);
 
+}
 
+.cls-47 {
 
+  fill: #003869;
 
+}
 
+.cls-48 {
 
+  clip-path: url(#clip-path-13);
 
+}
 
+.cls-49 {
 
+  fill: #003766;
 
+}
 
+.cls-50 {
 
+  fill: #003563;
 
+}
 
+.cls-51 {
 
+  fill: #00335f;
 
+}
 
+.cls-52 {
 
+  fill: #00315c;
 
+}
 
+.cls-53 {
 
+  fill: #002f58;
 
+}
 
+.cls-54 {
 
+  clip-path: url(#clip-path-14);
 
+}
 
+.cls-55 {
 
+  fill: #005baa;
 
+}
 
+.cls-56 {
 
+  clip-path: url(#clip-path-15);
 
+}
 
+.cls-57 {
 
+  clip-path: url(#clip-path-16);
 
+}
 
+.cls-58 {
 
+  fill: #945000;
 
+}
 
+.cls-59 {
 
+  fill: #985300;
 
+}
 
+.cls-60 {
 
+  clip-path: url(#clip-path-17);
 
+}
 
+.cls-61 {
 
+  fill: #7c4300;
 
+}
 
+.cls-62 {
 
+  clip-path: url(#clip-path-18);
 
+}
 
+.cls-63 {
 
+  fill: #92000c;
 
+}
 
+.cls-64 {
 
+  fill: #96000c;
 
+}
 
+.cls-65 {
 
+  clip-path: url(#clip-path-19);
 
+}
 
+.cls-66 {
 
+  clip-path: url(#clip-path-20);
 
+}
 
+.cls-67 {
 
+  fill: #770009;
 
+}
 
+.cls-68 {
 
+  clip-path: url(#clip-path-21);
 
+}
 
+.cls-69 {
 
+  clip-path: url(#clip-path-22);
 
+}
 
+.cls-70 {
 
+  fill: #7f5800;
 
+}
 
+.cls-71 {
 
+  clip-path: url(#clip-path-23);
 
+}
 
+.cls-72 {
 
+  clip-path: url(#clip-path-24);
 
+}
 
+.cls-73 {
 
+  fill: #936500;
 
+}
 
+.cls-74 {
 
+  clip-path: url(#clip-path-25);
 
+}
 
+.cls-75 {
 
+  fill: #005a8d;
 
+}
 
+.cls-76 {
 
+  fill: #005789;
 
+}
 
+.cls-77 {
 
+  clip-path: url(#clip-path-26);
 
+}
 
+.cls-78 {
 
+  fill: #005485;
 
+}
 
+.cls-79 {
 
+  clip-path: url(#clip-path-27);
 
+}
 
+.cls-80 {
 
+  fill: #005c91;
 
+}
 
+.cls-81 {
 
+  clip-path: url(#clip-path-28);
 
+}
 
+.cls-82 {
 
+  fill: #005281;
 
+}
 
+.cls-83 {
 
+  fill: #004f7d;
 
+}
 
+.cls-84 {
 
+  clip-path: url(#clip-path-29);
 
+}
 
+.cls-85 {
 
+  clip-path: url(#clip-path-30);
 
+}
 
+.cls-86 {
 
+  clip-path: url(#clip-path-31);
 
+}
 
+.cls-87 {
 
+  fill: #004d79;
 
+}
 
+.cls-88 {
 
+  clip-path: url(#clip-path-32);
 
+}
 
+.cls-89 {
 
+  clip-path: url(#clip-path-33);
 
+}
 
+.cls-90 {
 
+  fill: #004a75;
 
+}
 
+.cls-91 {
 
+  fill: #004871;
 
+}
 
+.cls-92 {
 
+  clip-path: url(#clip-path-34);
 
+}
 
+.cls-93 {
 
+  clip-path: url(#clip-path-35);
 
+}
 
+.cls-94 {
 
+  clip-path: url(#clip-path-36);
 
+}
 
+.cls-95 {
 
+  clip-path: url(#clip-path-37);
 
+}
 
+.cls-96 {
 
+  clip-path: url(#clip-path-38);
 
+}
 
+.cls-97 {
 
+  clip-path: url(#clip-path-39);
 
+}
 
+.cls-98 {
 
+  fill: #8e6200;
 
+}
 
+.cls-99 {
 
+  fill: #895f00;
 
+}
 
+.cls-100 {
 
+  clip-path: url(#clip-path-40);
 
+}
 
+.cls-101 {
 
+  fill: #006898;
 
+}
 
+.cls-102 {
 
+  clip-path: url(#clip-path-41);
 
+}
 
+.cls-103 {
 
+  fill: #0072a6;
 
+}
 
+.cls-104 {
 
+  fill: #006fa2;
 
+}
 
+.cls-105 {
 
+  clip-path: url(#clip-path-42);
 
+}
 
+.cls-106 {
 
+  fill: #0075ab;
 
+}
 
+.cls-107 {
 
+  clip-path: url(#clip-path-43);
 
+}
 
+.cls-108 {
 
+  fill: #006594;
 
+}
 
+.cls-109 {
 
+  fill: #00628f;
 
+}
 
+.cls-110 {
 
+  clip-path: url(#clip-path-44);
 
+}
 
+.cls-111 {
 
+  fill: #005f8b;
 
+}
 
+.cls-112 {
 
+  fill: #005c86;
 
+}
 
+.cls-113 {
 
+  clip-path: url(#clip-path-45);
 
+}
 
+.cls-114 {
 
+  fill: #005881;
 
+}
 
+.cls-115 {
 
+  clip-path: url(#clip-path-46);
 
+}
 
+.cls-116 {
 
+  fill: #00557d;
 
+}
 
+.cls-117 {
 
+  clip-path: url(#clip-path-47);
 
+}
 
+.cls-118 {
 
+  clip-path: url(#clip-path-48);
 
+}
 
+.cls-119 {
 
+  fill: #00456d;
 
+}
 
+.cls-120 {
 
+  fill: #004369;
 
+}
 
+.cls-121 {
 
+  clip-path: url(#clip-path-49);
 
+}
 
+.cls-122 {
 
+  clip-path: url(#clip-path-50);
 
+}
 
+.cls-123 {
 
+  clip-path: url(#clip-path-51);
 
+}
 
+.cls-124 {
 
+  fill: #ab7600;
 
+}
 
+.cls-125 {
 
+  clip-path: url(#clip-path-52);
 
+}
 
+.cls-126 {
 
+  clip-path: url(#clip-path-53);
 
+}
 
+.cls-127 {
 
+  fill: #005278;
 
+}
 
+.cls-128 {
 
+  clip-path: url(#clip-path-54);
 
+}
 
+.cls-129 {
 
+  fill: #00547b;
 
+}
 
+.cls-130 {
 
+  fill: #0088c7;
 
+}
 
+.cls-131 {
 
+  fill: #009ee7;
 
+}
 
+.cls-132 {
 
+  clip-path: url(#clip-path-55);
 
+}
 
+.cls-133 {
 
+  clip-path: url(#clip-path-56);
 
+}
 
+.cls-134 {
 
+  clip-path: url(#clip-path-57);
 
+}
 
+.cls-135 {
 
+  clip-path: url(#clip-path-58);
 
+}
 
+.cls-136 {
 
+  clip-path: url(#clip-path-59);
 
+}
 
+.cls-137 {
 
+  clip-path: url(#clip-path-60);
 
+}
 
+.cls-138 {
 
+  fill: #0080ca;
 
+}
 
+.cls-139 {
 
+  clip-path: url(#clip-path-61);
 
+}
 
+.cls-140 {
 
+  clip-path: url(#clip-path-62);
 
+}
 
+.cls-141 {
 
+  clip-path: url(#clip-path-63);
 
+}
 
+.cls-142 {
 
+  clip-path: url(#clip-path-64);
 
+}
 
+.cls-143 {
 
+  clip-path: url(#clip-path-65);
 
+}
 
+.cls-144 {
 
+  clip-path: url(#clip-path-66);
 
+}
 
+.cls-145 {
 
+  clip-path: url(#clip-path-67);
 
+}
 
+.cls-146 {
 
+  clip-path: url(#clip-path-68);
 
+}
 
+.cls-147 {
 
+  clip-path: url(#clip-path-69);
 
+}
 
+.cls-148 {
 
+  clip-path: url(#clip-path-70);
 
+}
 
+.cls-149 {
 
+  fill: #006eae;
 
+}
 
+.cls-150 {
 
+  fill: #004e92;
 
+}
 
+.cls-151 {
 
+  fill: #006b9d;
 
+}
 
+.cls-152,
 
+.cls-161 {
 
+  fill: #3a6bd6;
 
+}
 
+.cls-153 {
 
+  fill: #35549b;
 
+}
 
+.cls-154 {
 
+  fill: #224589;
 
+}
 
+.cls-155 {
 
+  fill: #3f5db2;
 
+}
 
+.cls-156 {
 
+  fill: #2d4e96;
 
+}
 
+.cls-157 {
 
+  fill: #a8a8a8;
 
+}
 
+.cls-158 {
 
+  opacity: 0.6;
 
+}
 
+.cls-159 {
 
+  opacity: 0.9;
 
+}
 
+.cls-160 {
 
+  stroke: #fff;
 
+  stroke-miterlimit: 10;
 
+}
 
+.cls-161,
 
+.cls-172,
 
+.cls-178,
 
+.cls-184,
 
+.cls-190,
 
+.cls-196 {
 
+  font-size: 16px;
 
+  font-family: SourceHanSansCN-Regular-GBpc-EUC-H, Source Han Sans CN;
 
+}
 
+.cls-162 {
 
+  letter-spacing: -0.46em;
 
+}
 
+.cls-163 {
 
+  letter-spacing: -0.04em;
 
+}
 
+.cls-164 {
 
+  letter-spacing: -0.04em;
 
+}
 
+.cls-165 {
 
+  letter-spacing: -0.46em;
 
+}
 
+.cls-166 {
 
+  fill: #c95c3f;
 
+}
 
+.cls-167 {
 
+  fill: #b23b2b;
 
+}
 
+.cls-168 {
 
+  fill: #cc5c3e;
 
+}
 
+.cls-169 {
 
+  fill: #dd734e;
 
+}
 
+.cls-170 {
 
+  fill: #e49b77;
 
+}
 
+.cls-171,
 
+.cls-172 {
 
+  fill: #ed8a5f;
 
+}
 
+.cls-173,
 
+.cls-178 {
 
+  fill: #eab363;
 
+}
 
+.cls-174 {
 
+  fill: #bf833c;
 
+}
 
+.cls-175 {
 
+  fill: #b26d28;
 
+}
 
+.cls-176 {
 
+  fill: #d69947;
 
+}
 
+.cls-177 {
 
+  fill: #c68334;
 
+}
 
+.cls-179,
 
+.cls-184 {
 
+  fill: #80ce89;
 
+}
 
+.cls-180 {
 
+  fill: #579659;
 
+}
 
+.cls-181 {
 
+  fill: #3d703d;
 
+}
 
+.cls-182 {
 
+  fill: #66af6b;
 
+}
 
+.cls-183 {
 
+  fill: #518e53;
 
+}
 
+.cls-185 {
 
+  fill: #5edaef;
 
+}
 
+.cls-186 {
 
+  fill: #1eadad;
 
+}
 
+.cls-187 {
 
+  fill: #0c9393;
 
+}
 
+.cls-188 {
 
+  fill: #43c4d1;
 
+}
 
+.cls-189,
 
+.cls-190 {
 
+  fill: #18b0b7;
 
+}
 
+.cls-191,
 
+.cls-196 {
 
+  fill: #c872dd;
 
+}
 
+.cls-192 {
 
+  fill: #9045a8;
 
+}
 
+.cls-193 {
 
+  fill: #793493;
 
+}
 
+.cls-194 {
 
+  fill: #b359c9;
 
+}
 
+.cls-195 {
 
+  fill: #9944ad;
 
+}
 
+
 
+
 
+
 
+g[data-istag="yes"] {
 
+  display: none;
 
+}
 
+
 
+g[data-isface="yes"]{
 
+  cursor: pointer;
 
+}
 
+
 
+
 
+g[data-isid="yes"] {
 
+  &:hover {
 
+    >g[data-isface="yes"]{
 
+      .cls-173, .cls-178{
 
+        fill: #FFD092;
 
+      }
 
+      .cls-191, .cls-196{
 
+        fill: #E2B3EE;
 
+      }
 
+      .cls-171, .cls-172{
 
+        fill: #FFA57D;
 
+      }
 
+      .cls-185{
 
+        fill: #98EFFE;
 
+      }
 
+      .cls-152, .cls-161{
 
+        fill: #598BF6;
 
+      }
 
+      .cls-179, .cls-184{
 
+        fill: #B3EAB9;
 
+      }
 
+    }
 
+    
+    g[data-istag="yes"] {
 
+      display: block;
 
+    }
 
+  }
 
+}

+ 22 - 0
src/main.js
查看文件 

@@ -0,0 +1,22 @@
 
+import Vue from 'vue'
 
+import App from './App.vue'
 
+import router from './router'
 
+import browser from "@/utils/browser";
 
+
 
+
 
+Vue.config.productionTip = false
 
+
 
+
 
+Vue.mixin({
 
+  data() {
 
+    return {
 
+      g_isMobile: browser.mobile,
 
+    };
 
+  },
 
+});
 
+
 
+
 
+new Vue({
 
+  router,
 
+  render: h => h(App)
 
+}).$mount('#app')

+ 24 - 0
src/router/index.js
查看文件 

@@ -0,0 +1,24 @@
 
+import Vue from 'vue'
 
+import VueRouter from 'vue-router'
 
+import Home from '../views/Home.vue'
 
+
 
+Vue.use(VueRouter)
 
+
 
+const routes = [
 
+  {
 
+    path: '/',
 
+    name: 'Home',
 
+    component: Home
 
+  },
 
+  {
 
+    path: '/iframe/:id',
 
+    name: 'iframe',
 
+    component: () => import('../views/iframe.vue')
 
+  }
 
+]
 
+
 
+const router = new VueRouter({
 
+  routes
 
+})
 
+
 
+export default router

+ 35 - 0
src/utils/browser.js
查看文件 

@@ -0,0 +1,35 @@
 
+function versions () {
 
+  var u = window.navigator.userAgent
 
+  return {
 
+    // IE内核
 
+    trident: u.indexOf('Trident') > -1,
 
+    // Firefox
 
+    firefox: u.indexOf('Firefox') > -1,
 
+    // edge
 
+    edge: u.indexOf('Edge') > -1,
 
+    // opera内核
 
+    presto: u.indexOf('Presto') > -1,
 
+    // 苹果、谷歌内核
 
+    webKit: u.indexOf('AppleWebKit') > -1,
 
+    // 火狐内核
 
+    gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') === -1,
 
+    // 是否为移动终端
 
+    mobile: /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent),
 
+    // ios终端
 
+    ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
 
+    // android终端或者uc浏览器
 
+    android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1,
 
+    // 是否为iPhone或者安卓QQ浏览器
 
+    iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1,
 
+    // 是否为iPad
 
+    iPad: u.indexOf('iPad') > -1,
 
+    // 是否为web应用程序，没有头部与底部
 
+    webApp: u.indexOf('Safari') === -1,
 
+    // 是否为微信浏览器
 
+    weixin: ~u.indexOf('MicroMessenger'),
 
+    // 获取浏览器语言
 
+    language: (navigator.browserLanguage || navigator.language).toLowerCase()
 
+  }
 
+}
 
+
 
+export default versions()

+ 28 - 0
src/utils/index.js
查看文件 

@@ -0,0 +1,28 @@
 
+module.exports = {
 
+  copyTextToClipboard: function (text,cb) {
 
+    var textArea = document.createElement('textarea')
 
+    textArea.style.position = 'fixed'
 
+    textArea.style.top = 0
 
+    textArea.style.left = 0
 
+    textArea.style.width = '2em'
 
+    textArea.style.height = '2em'
 
+    textArea.style.padding = 0
 
+    textArea.style.border = 'none'
 
+    textArea.style.outline = 'none'
 
+    textArea.style.boxShadow = 'none'
 
+    textArea.style.background = 'transparent'
 
+    textArea.value = text
 
+
 
+    document.body.appendChild(textArea)
 
+
 
+    textArea.select()
 
+
 
+    try {
 
+      document.execCommand('copy') ? cb('success'):cb('success')
 
+    } catch (err) {
 
+      cb(err)
 
+    }
 
+
 
+    document.body.removeChild(textArea)
 
+  }
 
+}

+ 152 - 0
src/views/Home.vue
查看文件 

@@ -0,0 +1,152 @@
 
+<template>
 
+  <div
 
+    class="home"
 
+    :style="{ backgroundImage: `url(${require(`@/assets/images/bg_pc.jpg`)})` }"
 
+  >
 
+    <!-- <component class="map" :key="cp" :is="cp"/> -->
 
+    
+    <vMap class="map" v-if="select==1"/>
 
+    <vMap2 class="map" v-else  />
 
+  
+
 
+    <!-- <div
 
+      @click.stop="fActive = false"
 
+      v-if="isMobile && (fActive || tipsActive)"
 
+      class="mask"
 
+    ></div> -->
 
+
 
+
 
+  </div>
 
+</template>
 
+
 
+<script>
 
+// @ is an alias to /src
 
+import map from "@/components/map.vue";
 
+import map2 from "@/components/map2.vue";
 
+
 
+export default {
 
+  name: "Home",
 
+  props:['select'],
 
+  components: {
 
+    vMap: map,
 
+    vMap2: map2,
 
+  },
 
+  data() {
 
+    return {
 
+    };
 
+  },
 
+ 
+  computed: {
 
+  },
 
+  mounted() {
 
+    
+  },
 
+};
 
+</script>
 
+
 
+<style lang="less" scoped>
 
+.home {
 
+  position: relative;
 
+  width: 100%;
 
+  height: 100%;
 
+  background-size: cover;
 
+  .logo {
 
+    position: absolute;
 
+    left: 30px;
 
+    top: 50px;
 
+    width: 390px;
 
+    z-index: 90;
 
+  }
 
+  .map {
 
+    width: 100%;
 
+    height: 100%;
 
+    margin: 0;
 
+  }
 
+
 
+}
 
+
 
+@media screen and (max-width: 500px) {
 
+  .home {
 
+    background: none;
 
+    .tips {
 
+      position: fixed;
 
+      width: 88%;
 
+      background: #fff;
 
+      transform: translate(-50%, -50%);
 
+      top: 50%;
 
+      left: 50%;
 
+      border-radius: 4px;
 
+      z-index: 999;
 
+      > div {
 
+        position: relative;
 
+        width: 100%;
 
+        padding: 20px;
 
+        > p {
 
+          font-weight: bold;
 
+          margin-bottom: 10px;
 
+        }
 
+        > ul {
 
+          display: flex;
 
+          flex-wrap: wrap;
 
+          justify-content: space-between;
 
+          > li {
 
+            width: 48%;
 
+            display: flex;
 
+            align-items: center;
 
+            margin: 10px 0;
 
+            > i {
 
+              min-width: 20px;
 
+              height: 20px;
 
+              display: inline-block;
 
+              margin-right: 10px;
 
+            }
 
+          }
 
+        }
 
+        > img {
 
+          position: absolute;
 
+          right: 10px;
 
+          width: 10px;
 
+          top: 10px;
 
+        }
 
+      }
 
+    }
 
+    .bg {
 
+      z-index: 0;
 
+      position: fixed;
 
+      width: 100%;
 
+    }
 
+    .logo {
 
+      left: 50%;
 
+      transform: translateX(-50%);
 
+      top: 15px;
 
+      width: 60%;
 
+    }
 
+    .mask {
 
+      width: 100%;
 
+      height: 100%;
 
+      position: fixed;
 
+      left: 0;
 
+      top: 0;
 
+      background: rgba(0, 0, 0, 0.5);
 
+      transition: 0.3s all ease;
 
+      z-index: 98;
 
+    }
 
+    .fold-con {
 
+      position: absolute;
 
+      left: 0;
 
+      bottom: -800px;
 
+      width: 100%;
 
+      transition: 0.3s all ease;
 
+    }
 
+    .fold-active {
 
+      bottom: 0;
 
+      z-index: 99;
 
+      border-radius: 14px 14px 0px 0px;
 
+    }
 
+    .map {
 
+    }
 
+  
+ 
+  }
 
+}
 
+</style>

+ 70 - 0
src/views/iframe.vue
查看文件 

@@ -0,0 +1,70 @@
 
+<template>
 
+  <div class="iframe">
 
+    <ul class="aside">
 
+      <li>
 
+        <img @click="$router.push({name:'Home'})" :src="require('@/assets/images/btn_home.png')" alt="">
 
+      </li>
 
+      <li>
 
+        <img @click="isShowShare = true" :src="require('@/assets/images/btn_share.png')" alt="">
 
+      </li>
 
+    </ul>
 
+    <vShare v-if="isShowShare" @close="isShowShare = false" />
 
+
 
+    <iframe :src="`https://www.4dkankan.com/spc.html?m=${sceneCode}`" frameborder="0"></iframe>
 
+  </div>
 
+</template>
 
+
 
+<script>
 
+import vShare from "@/components/share";
 
+
 
+export default {
 
+  components:{vShare},
 
+  data(){
 
+    return {
 
+      isShowShare: false,
 
+      sceneCode:this.$route.params.id
 
+    }
 
+  }
 
+}
 
+</script>
 
+
 
+<style lang="less" scoped>
 
+.iframe{
 
+  width: 100%;
 
+  height: 100%;
 
+  position: relative;
 
+  .aside{
 
+    position: absolute;
 
+    top: 50%;
 
+    left: 14px;
 
+    transform: translateY(-50%);
 
+    >li{
 
+      cursor: pointer;
 
+      margin: 10px 0;
 
+      width: 60px;
 
+      >img{
 
+        width: 100%;
 
+      }
 
+    }
 
+  }
 
+  >iframe{
 
+    width: 100%;
 
+    height: 100%;
 
+  }
 
+}
 
+
 
+@media screen and (max-width: 500px) {
 
+  .iframe{
 
+  .aside{
 
+    top: 30px;
 
+    left: 14px;
 
+    transform: none;
 
+    >li{
 
+      margin: 10px 0;
 
+      width: 46px;
 
+    }
 
+  }
 
+}
 
+}
 
+
 
+</style>

+ 3 - 0
vue.config.js
查看文件 

@@ -0,0 +1,3 @@
 
+module.exports = {
 
+  publicPath: "./"
 
+};