5 năm trước cách đây · 5ec2cee318
--- a/build/utils.js
+++ b/build/utils.js
@@ -47,7 +47,8 @@ exports.cssLoaders = function (options) {
 
																     if (options.extract) {
															
 
																       return ExtractTextPlugin.extract({
															
 
																         use: loaders,
															
 
																-        fallback: 'vue-style-loader'
															
 
																+        fallback: 'vue-style-loader',
															
 
																+        publicPath:'../../'
															
 
																       })
															
 
																     } else {
															
 
																       return ['vue-style-loader'].concat(loaders)
															
--- a/build/webpack.base.conf.js
+++ b/build/webpack.base.conf.js
@@ -58,8 +58,8 @@ module.exports = {
 
																         test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
															
 
																         loader: 'url-loader',
															
 
																         options: {
															
 
																-          limit: 1024*1000,
															
 
																-          name: utils.assetsPath('img/[name].[hash:7].[ext]')
															
 
																+          limit: 1000,
															
 
																+          name: utils.assetsPath('img/[name].[hash:7].[ext]'),
															
 
																         }
															
 
																       },
															
 
																       {
															
--- a/config/index.js
+++ b/config/index.js
@@ -13,7 +13,7 @@ module.exports = {
 
																     proxyTable: {},
															
 
																     // Various Dev Server settings
															
 
																-    host: 'localhost', // can be overwritten by process.env.HOST
															
 
																+    host: '192.168.0.103', // can be overwritten by process.env.HOST
															
 
																     port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
															
 
																     autoOpenBrowser: false,
															
 
																     errorOverlay: true,
															
--- a/config/prod.env.js
+++ b/config/prod.env.js
@@ -1,4 +1,9 @@
 
																 'use strict'
															
 
																+
															
 
																+
															
 
																+let params = process.argv.splice(2)[0]||'prod';
															
 
																+
															
 
																 module.exports = {
															
 
																-  NODE_ENV: '"production"'
															
 
																+  NODE_ENV: '"production"',
															
 
																+  ISLOCAL: '"'+params+'"'
															
 
																 }
															
--- a/index.html
+++ b/index.html
@@ -6,8 +6,8 @@
 
																     <meta name="force-rendering" content="webkit"/>
															
 
																     <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
															
 
																     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
															
 
																-    <!-- <link rel="apple-touch-icon" sizes="180x180" href="static/img/favicon.ico"> -->
															
 
																-    <!-- <link rel="icon" type="image/png" href="static/img/favicon.ico" sizes="192x192"> -->
															
 
																+    <link rel="apple-touch-icon" sizes="180x180" href="http://4d-tjw.oss-cn-shenzhen.aliyuncs.com/images/favicon.png">
															
 
																+    <link rel="icon" type="image/png" href="http://4d-tjw.oss-cn-shenzhen.aliyuncs.com/images/favicon.png" sizes="192x192">
															
 
																     <title>珠海国家高新区-不可移动文物一张图</title>
															
 
																   </head>
															
 
																   <body>
															
--- a/package.json
+++ b/package.json
@@ -8,16 +8,19 @@
 
																     "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
															
 
																     "start": "npm run dev",
															
 
																     "lint": "eslint --ext .js,.vue src",
															
 
																-    "build": "node build/build.js"
															
 
																+    "build": "node build/build.js",
															
 
																+    "local": "node build/build.js  --local"
															
 
																   },
															
 
																   "dependencies": {
															
 
																     "axios": "^0.18.0",
															
 
																     "babel-polyfill": "^6.26.0",
															
 
																     "echarts": "^4.2.0-rc.2",
															
 
																     "jquery": "^2.1.1",
															
 
																+    "jsonp": "^0.2.1",
															
 
																     "vue": "^2.5.2",
															
 
																     "vue-concise-slider": "^3.3.8",
															
 
																-    "vue-router": "^3.0.1"
															
 
																+    "vue-router": "^3.0.1",
															
 
																+    "weixin-js-sdk": "^1.4.0-test"
															
 
																   },
															
 
																   "devDependencies": {
															
 
																     "autoprefixer": "^7.1.2",
															
--- a/src/App.vue
+++ b/src/App.vue
@@ -7,9 +7,75 @@
 
																 <script>
															
 
																 import '@/assets/style/reset.css'
															
 
																 import '@/assets/style/public.css'
															
 
																+import wx from 'weixin-js-sdk'
															
 
																+import jsonp from 'jsonp'
															
 
																 export default {
															
 
																-  name: 'App'
															
 
																+  name: 'App',
															
 
																+  data () {
															
 
																+    return {
															
 
																+
															
 
																+    }
															
 
																+  },
															
 
																+  methods: {
															
 
																+    wxShare () {
															
 
																+      let url = location.href.split('#')[0]
															
 
																+      jsonp('https://www.4dage.com/wechat/jssdk/share/?uri=' +
															
 
																+  window.escape(url) + '&name=4dageshare', 'success_jsonp', function (err, data) {
															
 
																+        if (err) {
															
 
																+          console.err(err)
															
 
																+          console.log('出错啦')
															
 
																+        } else {
															
 
																+          wx.config({
															
 
																+            debug: false, // 开启调试模式
															
 
																+            appId: data.appId,
															
 
																+            timestamp: data.timestamp,
															
 
																+            nonceStr: data.nonceStr,
															
 
																+            signature: data.signature,
															
 
																+            jsApiList: ['checkJsApi',
															
 
																+              'onMenuShareTimeline',
															
 
																+              'onMenuShareAppMessage',
															
 
																+              'onMenuShareQQ',
															
 
																+              'onMenuShareWeibo',
															
 
																+              'hideMenuItems',
															
 
																+              'showMenuItems',
															
 
																+              'hideAllNonBaseMenuItem',
															
 
																+              'showAllNonBaseMenuItem',
															
 
																+              'translateVoice',
															
 
																+              'startRecord',
															
 
																+              'stopRecord',
															
 
																+              'onRecordEnd',
															
 
																+              'playVoice',
															
 
																+              'pauseVoice',
															
 
																+              'stopVoice',
															
 
																+              'uploadVoice',
															
 
																+              'downloadVoice']
															
 
																+          })
															
 
																+        }
															
 
																+        wx.ready(function () {
															
 
																+          var shareData = {
															
 
																+            title: '珠海国家高新区-不可移动文物一张图', //  标题
															
 
																+            desc: '美好不应被损毁，我们保护它，也让您可以零距离欣赏', //  描述
															
 
																+            link: window.location.href, //  分享的URL，必须和当前打开的网页的URL是一样的
															
 
																+            imgUrl: 'http://4d-tjw.oss-cn-shenzhen.aliyuncs.com/images/share.jpg', //  缩略图地址
															
 
																+            success: function () {
															
 
																+
															
 
																+            },
															
 
																+            cancel: function () {
															
 
																+
															
 
																+            }
															
 
																+          }
															
 
																+          wx.onMenuShareAppMessage(shareData)
															
 
																+          wx.onMenuShareTimeline(shareData)
															
 
																+          wx.onMenuShareQQ(shareData)
															
 
																+          wx.onMenuShareQZone(shareData)
															
 
																+        })
															
 
																+      })
															
 
																+    }
															
 
																+  },
															
 
																+  mounted () {
															
 
																+    this.wxShare()
															
 
																+  }
															
 
																 }
															
 
																 </script>
															
--- a/src/assets/icon/iconfont.css
+++ b/src/assets/icon/iconfont.css
--- a/src/assets/icon/iconfont.eot
+++ b/src/assets/icon/iconfont.eot
--- a/src/assets/icon/iconfont.js
+++ b/src/assets/icon/iconfont.js
--- a/src/assets/icon/iconfont.svg
+++ b/src/assets/icon/iconfont.svg
--- a/src/assets/icon/iconfont.ttf
+++ b/src/assets/icon/iconfont.ttf
--- a/src/assets/icon/iconfont.woff
+++ b/src/assets/icon/iconfont.woff
--- a/src/assets/icon/iconfont.woff2
+++ b/src/assets/icon/iconfont.woff2
--- a/src/assets/images/bg.jpg
+++ b/src/assets/images/bg.jpg
--- a/src/assets/images/cover/东岸绵始大楼.jpg
+++ b/src/assets/images/cover/东岸绵始大楼.jpg
--- a/src/assets/images/cover/会同北碉楼.jpg
+++ b/src/assets/images/cover/会同北碉楼.jpg
--- a/src/assets/images/cover/会同北闸门.jpg
+++ b/src/assets/images/cover/会同北闸门.jpg
--- a/src/assets/images/cover/会同南碉楼.jpg
+++ b/src/assets/images/cover/会同南碉楼.jpg
--- a/src/assets/images/cover/会同南闸门.jpg
+++ b/src/assets/images/cover/会同南闸门.jpg
--- a/src/assets/images/cover/会同莫氏大宅.jpg
+++ b/src/assets/images/cover/会同莫氏大宅.jpg
--- a/src/assets/images/cover/会同莫氏大宗祠.jpg
+++ b/src/assets/images/cover/会同莫氏大宗祠.jpg
--- a/src/assets/images/cover/佩玉梁公祠.jpg
+++ b/src/assets/images/cover/佩玉梁公祠.jpg
--- a/src/assets/images/cover/北沙卢氏孖祠.jpg
+++ b/src/assets/images/cover/北沙卢氏孖祠.jpg
--- a/src/assets/images/cover/古氏大宗祠.jpg
+++ b/src/assets/images/cover/古氏大宗祠.jpg
--- a/src/assets/images/cover/唐家古围墙.jpg
+++ b/src/assets/images/cover/唐家古围墙.jpg
--- a/src/assets/images/cover/唐家平里庙.jpg
+++ b/src/assets/images/cover/唐家平里庙.jpg
--- a/src/assets/images/cover/唐家梁氏大宗祠（振绪堂）.jpg
+++ b/src/assets/images/cover/唐家梁氏大宗祠（振绪堂）.jpg
--- a/src/assets/images/cover/唐家湾国防建设烈士墓.jpg
+++ b/src/assets/images/cover/唐家湾国防建设烈士墓.jpg
--- a/src/assets/images/cover/唐家湾建设和保卫海岛烈士墓.jpg
+++ b/src/assets/images/cover/唐家湾建设和保卫海岛烈士墓.jpg
--- a/src/assets/images/cover/唐家湾抗日烈士纪念碑.jpg
+++ b/src/assets/images/cover/唐家湾抗日烈士纪念碑.jpg
--- a/src/assets/images/cover/唐家湾解放万山群岛烈士纪念碑.jpg
+++ b/src/assets/images/cover/唐家湾解放万山群岛烈士纪念碑.jpg
--- a/src/assets/images/cover/唐家车站旧址.jpg
+++ b/src/assets/images/cover/唐家车站旧址.jpg
--- a/src/assets/images/cover/大王角灯塔.jpg
+++ b/src/assets/images/cover/大王角灯塔.jpg
--- a/src/assets/images/cover/太史第（唐宝锷故居）.jpg
+++ b/src/assets/images/cover/太史第（唐宝锷故居）.jpg
--- a/src/assets/images/cover/官塘乡主庙.jpg
+++ b/src/assets/images/cover/官塘乡主庙.jpg
--- a/src/assets/images/cover/宪尧唐公祠.jpg
+++ b/src/assets/images/cover/宪尧唐公祠.jpg
--- a/src/assets/images/cover/寿山梁公祠.jpg
+++ b/src/assets/images/cover/寿山梁公祠.jpg
--- a/src/assets/images/cover/易初祠.jpg
+++ b/src/assets/images/cover/易初祠.jpg
--- a/src/assets/images/cover/月奇梁公祠.jpg
+++ b/src/assets/images/cover/月奇梁公祠.jpg
--- a/src/assets/images/cover/步九梁公祠.jpg
+++ b/src/assets/images/cover/步九梁公祠.jpg
--- a/src/assets/images/cover/淇澳天后宫.jpg
+++ b/src/assets/images/cover/淇澳天后宫.jpg
--- a/src/assets/images/cover/淇澳文昌宫.jpg
+++ b/src/assets/images/cover/淇澳文昌宫.jpg
--- a/src/assets/images/cover/淇澳祖庙.jpg
+++ b/src/assets/images/cover/淇澳祖庙.jpg
--- a/src/assets/images/cover/淇澳钟氏大宗祠.jpg
+++ b/src/assets/images/cover/淇澳钟氏大宗祠.jpg
--- a/src/assets/images/cover/清晓古公祠.jpg
+++ b/src/assets/images/cover/清晓古公祠.jpg
--- a/src/assets/images/cover/瑞芝唐公祠.jpg
+++ b/src/assets/images/cover/瑞芝唐公祠.jpg
--- a/src/assets/images/cover/苏兆征故居.jpg
+++ b/src/assets/images/cover/苏兆征故居.jpg
--- a/src/assets/images/cover/诚斋谭公祠.jpg
+++ b/src/assets/images/cover/诚斋谭公祠.jpg
--- a/src/assets/images/cover/那洲南门楼.jpg
+++ b/src/assets/images/cover/那洲南门楼.jpg
--- a/src/assets/images/cover/那洲梁氏大宅.jpg
+++ b/src/assets/images/cover/那洲梁氏大宅.jpg
--- a/src/assets/images/cover/那洲炮楼.jpg
+++ b/src/assets/images/cover/那洲炮楼.jpg
--- a/src/assets/images/cover/青云桥（会同单孔桥）.jpg
+++ b/src/assets/images/cover/青云桥（会同单孔桥）.jpg
--- a/src/assets/images/cover/鸡山三房祠.jpg
+++ b/src/assets/images/cover/鸡山三房祠.jpg
--- a/src/assets/images/default.jpg
+++ b/src/assets/images/default.jpg
--- a/src/assets/images/img_all_bg.jpg
+++ b/src/assets/images/img_all_bg.jpg
--- a/src/assets/images/xiala.png
+++ b/src/assets/images/xiala.png
--- a/src/assets/style/public.css
+++ b/src/assets/style/public.css
@@ -4,6 +4,10 @@
 
																   overflow: hidden;
															
 
																   position: relative;
															
 
																 }
															
 
																+*{
															
 
																+  -webkit-tap-highlight-color:transparent;
															
 
																+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
															
 
																+}
															
 
																 .clear::after {
															
 
																   content: '';
															
--- a/src/components/Plan/index.vue
+++ b/src/components/Plan/index.vue
@@ -178,7 +178,7 @@ export default {
 
																       oldVal && this.markerArr[oldVal].seftadditional.pause()
															
 
																       newVal && this.markerArr[newVal].seftadditional.play()
															
 
																     },
															
 
																-    
															
 
																+
															
 
																     lngLatArr (val) {
															
 
																       if (val !== 'ignore') {
															
 
																         this.init()
															
--- a/src/components/Slide/index.vue
+++ b/src/components/Slide/index.vue
@@ -4,7 +4,7 @@
 
																       <slot name="up" />
															
 
																     </a>
															
 
																     <div class="slide-layout">
															
 
																-      <div :style="layoutStyle" class="continure">
															
 
																+      <div :style="layoutStyle" class="continure" :class="{'m-continure':ismobile}">
															
 
																         <div v-for="(iscreen, index) in screens" :key="index" :style="itemStyle" class="item">
															
 
																           <slot name="item" :data="iscreen" :index="index" />
															
 
																         </div>
															
@@ -18,6 +18,8 @@
 
																 </template>
															
 
																 <script>
															
 
																+import browser from '@/util/browser'
															
 
																+
															
 
																 export default {
															
 
																   props: {
															
 
																     screens: {
															
@@ -31,7 +33,9 @@ export default {
 
																   },
															
 
																   data () {
															
 
																     return {
															
 
																-      index: this.current
															
 
																+      index: this.current,
															
 
																+      ismobile: browser.mobile
															
 
																+
															
 
																     }
															
 
																   },
															
 
																   computed: {
															
@@ -90,6 +94,7 @@ export default {
 
																   background-color: #fa3800;
															
 
																   padding: 12px 15px;
															
 
																   cursor: pointer;
															
 
																+  transform: translateY(-50%)
															
 
																 }
															
 
																 .up {
															
@@ -103,5 +108,15 @@ export default {
 
																 .continure {
															
 
																   overflow: hidden;
															
 
																   transition: transform .5s ease;
															
 
																+  display: flex;
															
 
																+  align-items: center;
															
 
																+}
															
 
																+
															
 
																+.m-continure{
															
 
																+  height: 40vh;
															
 
																+}
															
 
																+.m-continure .item{
															
 
																+  text-align: center;
															
 
																 }
															
 
																+
															
 
																 </style>
															
--- a/src/components/Slider/index.vue
+++ b/src/components/Slider/index.vue
@@ -7,15 +7,7 @@
 
																       <div class="bg-darkgrey-hand"></div>
															
 
																       <ul class="slider-ul">
															
 
																         <li class="slider-ul-first"><i class="icon-dian"></i></li>
															
 
																-        <li><i class="icon-dian"></i></li>
															
 
																-        <li><i class="icon-dian"></i></li>
															
 
																-        <li><i class="icon-dian"></i></li>
															
 
																-        <li><i class="icon-dian"></i></li>
															
 
																-        <li><i class="icon-dian"></i></li>
															
 
																-        <li><i class="icon-dian"></i></li>
															
 
																-        <li><i class="icon-dian"></i></li>
															
 
																-        <li><i class="icon-dian"></i></li>
															
 
																-        <li><i class="icon-dian"></i></li>
															
 
																+        <li v-for="(item, i) in 9" :key="i"><i class="icon-dian"></i></li>
															
 
																       </ul>
															
 
																     </div>
															
 
																     <div class="slide-selected"></div>
															
--- a/src/components/maps/index.vue
+++ b/src/components/maps/index.vue
@@ -181,7 +181,8 @@ export default {
 
																     clickHandle (ev) {
															
 
																       let title = navs[ev.target.className.baseVal.substring(5)]
															
 
																       if (title) {
															
 
																-        this.$router.push({name: 'map', params: {title: title}})
															
 
																+        let link = this.$isLocal ? {name: 'list', params: {title: title, type: '全部'}} : {name: 'map', params: {title: title}}
															
 
																+        this.$router.push(link)
															
 
																       }
															
 
																     }
															
 
																   }
															
@@ -197,6 +198,8 @@ export default {
 
																 }
															
 
																 .st:hover {
															
 
																   fill: #f13800;
															
 
																+  -webkit-tap-highlight-color:transparent;
															
 
																+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
															
 
																 }
															
 
																 .st0 {
															
@@ -270,4 +273,18 @@ export default {
 
																   transform-origin: 420px 690px;
															
 
																   fill: #bbc5bc;
															
 
																 }
															
 
																+
															
 
																+@media screen and (max-width: 1400px){
															
 
																+  .layout{
															
 
																+    position: relative;
															
 
																+  }
															
 
																+  .layout > svg{
															
 
																+    width: 900px;
															
 
																+    height: 650px;
															
 
																+  }
															
 
																+  .st {
															
 
																+    font-size: 14px;
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																 </style>
															
--- a/src/data.js
+++ b/src/data.js
--- a/src/main.js
+++ b/src/main.js
@@ -9,9 +9,12 @@ import '@/assets/icon/iconfont.css'
 
																 // axios.defaults.baseURL = 'http://192.168.0.249:8080/'
															
 
																 // axios.defaults.baseURL = '/'
															
 
																+const isLocal = process.env.NODE_ENV === 'development' ? false : ~(process.env.ISLOCAL.indexOf('local'))
															
 
																+
															
 
																 Vue.config.productionTip = false
															
 
																 Vue.prototype.$http = axios
															
 
																 Vue.prototype.$bus = new Vue()
															
 
																+Vue.prototype.$isLocal = isLocal
															
 
																 /* eslint-disable no-new */
															
 
																 new Vue({
															
--- a/src/pages/external/index.vue
+++ b/src/pages/external/index.vue
@@ -3,15 +3,24 @@
 
																     <div v-if="ismobile" class="top-layer">
															
 
																       <a @click="clickHandle" class="rad"><i class="iconfont icon-left"></i>返回</a>
															
 
																       <a @click="exitHandle" class="xiangce" v-if="key" :class="{active: big}">大场景</a>
															
 
																-      <a @click="xiangceHandle" class="xiangce" v-if="key" :class="{active: !big}">相册</a>
															
 
																+      <a @click="xiangceHandle" class="xiangce" v-if="key&&imgs.length>0" :class="{active: !big}">相册</a>
															
 
																     </div>
															
 
																     <template v-else>
															
 
																       <a @click="clickHandle" class="rad"><i class="iconfont icon-left"></i>返回</a>
															
 
																       <!-- <a @click="xiangceHandle" class="xiangce" v-if="key">相册</a> -->
															
 
																-      <select @change="changeHandle" class="ncxihiasj" v-model="asdasd" v-if="key">
															
 
																-        <option value="big">大场景</option>
															
 
																-        <option value="xiangce">相册</option>
															
 
																-      </select>
															
 
																+        <select @change="changeHandle" class="ncxihiasj" v-model="asdasd" v-if="key">
															
 
																+          <option value="big">大场景</option>
															
 
																+          <option v-if="imgs.length>0" value="xiangce">相册</option>
															
 
																+        </select>
															
 
																+        <div class="r-aside" :class="{'show':show}" @click.stop>
															
 
																+          <div class="image-title">{{name}}</div>
															
 
																+          <div class="image-detail">
															
 
																+            <p v-for="(item,i) in introduce" :key="i">{{item}}</p>
															
 
																+          </div>
															
 
																+          <div class="switch" @click="show = !show" @touchmove.prevent>
															
 
																+            <i class="iconfont" :class="show ? 'icon-left' : 'icon-right'"></i>
															
 
																+          </div>
															
 
																+        </div>
															
 
																     </template>
															
 
																     <template v-if="ismobile">
															
@@ -21,15 +30,22 @@
 
																         <div class="image-layout">
															
 
																           <Slide :screens="screens" :current="0">
															
 
																             <i class="iconfont icon-left" slot="up"></i>
															
 
																-            <img slot="item" slot-scope="{data}" :src="data" class="image-item">
															
 
																+            <div slot="item" slot-scope="{data}" class="image-item" :style="{background:`url(${data}) no-repeat center center`,backgroundSize:'contain'}"  @click.stop></div>
															
 
																+            <!-- <img slot="item" slot-scope="{data}" :src="data" class="image-item"> -->
															
 
																             <i class="iconfont icon-right" slot="next"></i>
															
 
																           </Slide>
															
 
																+          <div class="image-introduce">
															
 
																+            <div class="intro-title">{{name}}</div>
															
 
																+            <div class="intro-detail">
															
 
																+              <p v-for="(item,i) in introduce" :key="i">{{item}}</p>
															
 
																+            </div>
															
 
																+          </div>
															
 
																         </div>
															
 
																       </div>
															
 
																     </template>
															
 
																     <template v-else>
															
 
																       <iframe :src="url" frameborder="0"></iframe>
															
 
																-      <imageQuery :screens="screens" @exitHandle="exitHandle" />
															
 
																+      <imageQuery :show="show" :screens="screens" @exitHandle="exitHandle" />
															
 
																     </template>
															
 
																   </div>
															
 
																 </template>
															
@@ -44,7 +60,8 @@ export default {
 
																   components: { imageQuery, Slide },
															
 
																   data () {
															
 
																     let key = Object.keys(data.data).find(id => this.$route.params.id === id)
															
 
																-    if (!data.data[key].data) {
															
 
																+
															
 
																+    if (!key) {
															
 
																       key = null
															
 
																     }
															
 
																     return {
															
@@ -52,6 +69,7 @@ export default {
 
																       urls: [],
															
 
																       key,
															
 
																       big: true,
															
 
																+      show: false,
															
 
																       ismobile: browser.mobile,
															
 
																       screens: null
															
 
																     }
															
@@ -59,6 +77,19 @@ export default {
 
																   computed: {
															
 
																     url () {
															
 
																       return this.$route.params.url
															
 
																+    },
															
 
																+    imgs () {
															
 
																+      let id = Object.keys(data.data).find(key => this.$route.params.id === key)
															
 
																+
															
 
																+      return data.data[id].data || []
															
 
																+    },
															
 
																+    name () {
															
 
																+      let id = Object.keys(data.data).find(key => this.$route.params.id === key)
															
 
																+      return data.data[id].name || ''
															
 
																+    },
															
 
																+    introduce () {
															
 
																+      let id = Object.keys(data.data).find(key => this.$route.params.id === key)
															
 
																+      return data.data[id].introduce || []
															
 
																     }
															
 
																   },
															
 
																   methods: {
															
@@ -82,7 +113,17 @@ export default {
 
																       this.asdasd = 'big'
															
 
																     },
															
 
																     clickHandle () {
															
 
																-      this.$router.back()
															
 
																+      if (this.$route.query.show) {
															
 
																+        let {show, title, type} = this.$route.query
															
 
																+        this.$router.push({
															
 
																+          name: 'item',
															
 
																+          params: {
															
 
																+            show, title, type
															
 
																+          }
															
 
																+        })
															
 
																+      } else {
															
 
																+        this.$router.back()
															
 
																+      }
															
 
																       // while (global.paths.length !== 0) {
															
 
																       //   let path = global.paths.pop()
															
@@ -121,7 +162,7 @@ export default {
 
																   background-color: #fa3800;
															
 
																   left: 10px;
															
 
																   top: 10px;
															
 
																-  padding: 8px 15px;
															
 
																+  padding: 8px 20px 10px 16px;
															
 
																   cursor: pointer;
															
 
																   z-index: 999;
															
 
																 }
															
@@ -142,7 +183,7 @@ export default {
 
																 }
															
 
																 .asjdfioasfhuioasfh {
															
 
																-  height: calc(100% - 50px);
															
 
																+  height: 100%;
															
 
																   background-color: #000;
															
 
																 }
															
@@ -179,20 +220,21 @@ export default {
 
																 .ncxihiasj {
															
 
																   position: absolute;
															
 
																-  left: 100px;
															
 
																+  left: 112px;
															
 
																   border: 1px solid #fff;
															
 
																   z-index: 999;
															
 
																-  background-color: transparent;
															
 
																+  font-size: 1em;
															
 
																+  background: url('~@/assets/images/xiala.png') center right 6px no-repeat;
															
 
																+  background-size: 20%;
															
 
																   color: #fff;
															
 
																-  top: 12px;
															
 
																-  width: 65px;
															
 
																+  top: 10px;
															
 
																+  width: 90px;
															
 
																   border-radius: 3px;
															
 
																-  height: 30px;
															
 
																+  height: 34px;
															
 
																+  line-height: 34px;
															
 
																   text-align: center;
															
 
																   padding: 0 10px;
															
 
																-  appearance:none;
															
 
																-  -moz-appearance:none;
															
 
																-  -webkit-appearance:none;
															
 
																+  cursor: pointer;
															
 
																 }
															
 
																 .ncxihiasj option{
															
@@ -207,7 +249,7 @@ export default {
 
																 .image-dialog {
															
 
																   position: fixed;
															
 
																-  z-index: 9999999999999999999;
															
 
																+  z-index: 9999;
															
 
																   left: 0;
															
 
																   top: 0;
															
 
																   right: 0;
															
@@ -238,5 +280,87 @@ export default {
 
																 .image-item {
															
 
																   width: 100%;
															
 
																+  height: 100%;
															
 
																+}
															
 
																+
															
 
																+.r-aside{
															
 
																+  box-sizing: border-box;
															
 
																+  position: absolute;
															
 
																+  right: 0;
															
 
																+  top: 0;
															
 
																+  bottom: 0;
															
 
																+  width: 350px;
															
 
																+  height: 100%;
															
 
																+  background-color: #fffbf8;
															
 
																+  display: flex;
															
 
																+  flex-direction: column;
															
 
																+  padding: 20px 0;
															
 
																+  border-left: 1px solid #f1c4a3;
															
 
																+  z-index: 999999;
															
 
																+  transform: translateX(0);
															
 
																+  transition: transform .3s ease;
															
 
																+}
															
 
																+
															
 
																+.r-aside.show{
															
 
																+  transform: translateX(350px);
															
 
																+  transition: transform .3s ease;
															
 
																+}
															
 
																+
															
 
																+.r-aside .image-title{
															
 
																+  font-weight: bold;
															
 
																+  font-size: 18px;
															
 
																+  padding-bottom: 15px;
															
 
																+  border-bottom: 1px solid #f1c4a3;
															
 
																+  margin: 0 20px;
															
 
																+}
															
 
																+.r-aside .image-detail{
															
 
																+  padding: 15px 0;
															
 
																+  height: 100%;
															
 
																+  overflow-y: scroll;
															
 
																+  margin: 0 10px 0 20px;
															
 
																+}
															
 
																+
															
 
																+.r-aside .image-detail p{
															
 
																+  text-indent: 32px;
															
 
																+  line-height: 1.8;
															
 
																+}
															
 
																+
															
 
																+.switch {
															
 
																+  position: absolute;
															
 
																+  right: 100%;
															
 
																+  top: 50%;
															
 
																+  transform: translateY(-50%);
															
 
																+  background-color: #fa3800;
															
 
																+  width: 14px;
															
 
																+  height: 80px;
															
 
																+  color: #fff;
															
 
																+  line-height: 80px;
															
 
																+  text-align: center;
															
 
																+  cursor: pointer;
															
 
																+  z-index: 9999999;
															
 
																+}
															
 
																+
															
 
																+.image-introduce{
															
 
																+  color:#fff;
															
 
																+  padding:20px 10px;
															
 
																+  line-height:1.5;
															
 
																+
															
 
																+}
															
 
																+.image-introduce .intro-title{
															
 
																+  font-size:18px;
															
 
																+  font-weight:bold;
															
 
																+  margin-bottom:20px;
															
 
																+}
															
 
																+.image-introduce .intro-detail{
															
 
																+  height: 150px;
															
 
																+  overflow-y: auto;
															
 
																+  overflow-x: hidden;
															
 
																+}
															
 
																+.image-introduce .intro-detail p{
															
 
																+  text-indent:32px;
															
 
																+}
															
 
																+
															
 
																+.asjdfioasfhuioasfh >>> .ctrl{
															
 
																+  top:25%;
															
 
																 }
															
 
																 </style>
															
--- a/src/pages/home/index.vue
+++ b/src/pages/home/index.vue
@@ -6,18 +6,18 @@
 
																           <!-- <img src="@/assets/images/address.png" alt=""> -->
															
 
																           <maps />
															
 
																           <!-- <img :src="item.img" v-for="item in maps" :key="item.cls" class="map-item" :class="'map-' + item.cls"> -->
															
 
																-          <router-link v-for="item in address" :key="item.name" :class="item.name" :to="{name: 'map', params: {title: item.text}}">
															
 
																+          <a v-for="item in address" :key="item.name" :class="item.name" @click="to(item)">
															
 
																             {{item.text}}<span>{{item.count}}</span>
															
 
																-          </router-link>
															
 
																+          </a>
															
 
																         </div>
															
 
																       </ViewOperation>
															
 
																       <div class="address wide" v-else>
															
 
																         <!-- <img src="@/assets/images/address.png" alt=""> -->
															
 
																         <maps />
															
 
																         <!-- <img :src="item.img" v-for="item in maps" :key="item.cls" class="map-item" :class="'map-' + item.cls"> -->
															
 
																-        <router-link v-for="item in address" :key="item.name" :class="item.name" :to="{name: 'map', params: {title: item.text}}">
															
 
																+        <a v-for="item in address" :key="item.name" :class="item.name" @click="to(item)">
															
 
																           {{item.text}}<span>{{item.count}}</span>
															
 
																-        </router-link>
															
 
																+        </a>
															
 
																       </div>
															
 
																     </div>
															
 
																   </div>
															
@@ -29,24 +29,6 @@ import browser from '@/util/browser'
 
																 import ViewOperation from '@/components/ViewOperation'
															
 
																 import maps from '@/components/maps'
															
 
																-// const maps = [
															
 
																-//   {cls: 'bs', img: require('@/assets/images/bs.png')},
															
 
																-//   {cls: 'da', img: require('@/assets/images/da.png')},
															
 
																-//   {cls: 'gt', img: require('@/assets/images/gt.png')},
															
 
																-//   {cls: 'hh', img: require('@/assets/images/hh.png')},
															
 
																-//   {cls: 'ht', img: require('@/assets/images/ht.png')},
															
 
																-//   {cls: 'jf', img: require('@/assets/images/jf.png')},
															
 
																-//   {cls: 'js', img: require('@/assets/images/js.png')},
															
 
																-//   {cls: 'nt', img: require('@/assets/images/nt.png')},
															
 
																-//   {cls: 'nz', img: require('@/assets/images/nz.png')},
															
 
																-//   {cls: 'qa', img: require('@/assets/images/qa.png')},
															
 
																-//   {cls: 'sc', img: require('@/assets/images/sc.png')},
															
 
																-//   {cls: 'tj', img: require('@/assets/images/tj.png')},
															
 
																-//   {cls: 'tl', img: require('@/assets/images/tl.png')},
															
 
																-//   {cls: 'xc', img: require('@/assets/images/xc.png')},
															
 
																-//   {cls: 'yf', img: require('@/assets/images/yf.png')},
															
 
																-//   {cls: 'yx', img: require('@/assets/images/yx.png')}
															
 
																-// ]
															
 
																 const setting = [
															
 
																   {name: 'yf', text: '永丰社区'},
															
 
																   {name: 'bs', text: '北沙社区'},
															
@@ -92,6 +74,12 @@ export default {
 
																   components: {
															
 
																     ViewOperation,
															
 
																     maps
															
 
																+  },
															
 
																+  methods: {
															
 
																+    to (item) {
															
 
																+      let link = this.$isLocal ? {name: 'list', params: {title: item.text, type: '全部'}} : {name: 'map', params: {title: item.text}}
															
 
																+      this.$router.push(link)
															
 
																+    }
															
 
																   }
															
 
																 }
															
 
																 </script>
															
--- a/src/pages/home/style.css
+++ b/src/pages/home/style.css
@@ -2,7 +2,6 @@
 
																   box-sizing: border-box;
															
 
																   width: 100%;
															
 
																   height: 100%;
															
 
																-  background: #fff url('~@/assets/images/bg.jpg') center center;
															
 
																 }
															
 
																 .layout.wide {
															
@@ -123,7 +122,7 @@
 
																 }
															
 
																 .yx {
															
 
																-  top: 96%;
															
 
																+  top: 94%;
															
 
																   left: 58%;
															
 
																 }
															
@@ -152,3 +151,22 @@
 
																   width: 17.5%;
															
 
																   top: 47.5%;
															
 
																 }
															
 
																+
															
 
																+@media screen and (max-width: 1400px){
															
 
																+  .address {
															
 
																+    width: 900px;
															
 
																+    height: 650px;
															
 
																+  }
															
 
																+  .nz {
															
 
																+    top: 60%;
															
 
																+    left: 10%;
															
 
																+  }
															
 
																+  .yx {
															
 
																+    top: 90%;
															
 
																+    left: 57%;
															
 
																+  }
															
 
																+  .hh{
															
 
																+    top:57%;
															
 
																+    left: 64%;
															
 
																+  }
															
 
																+}
															
--- a/src/pages/imageQuery/index.vue
+++ b/src/pages/imageQuery/index.vue
@@ -1,24 +1,51 @@
 
																 <template>
															
 
																-  <div class="image-dialog" v-if="screensa" @click="exitHandle">
															
 
																+  <div class="image-dialog" :class="{'i-show':isShow}" v-if="screensa" @click="exitHandle">
															
 
																     <!-- <a @click="exitHandle"><i class="iconfont icon-left"></i>返回</a> -->
															
 
																-    <div class="image-layout">
															
 
																+    <div class="image-layout" :class="{'m-image-layout':ismobile}">
															
 
																       <Slide :screens="screensa" :current="0">
															
 
																         <i class="iconfont icon-left" slot="up"></i>
															
 
																-        <img slot="item" slot-scope="{data}" :src="data" class="image-item"  @click.stop>
															
 
																+        <div v-if="ismobile" slot="item" slot-scope="{data}" class="image-item" :style="{background:`url(${data}) no-repeat center center`,backgroundSize:'contain'}"  @click.stop></div>
															
 
																+        <img v-else slot="item" slot-scope="{data}" :src="data" class="image-item"  @click.stop>
															
 
																         <i class="iconfont icon-right" slot="next"></i>
															
 
																       </Slide>
															
 
																+      <div class="image-introduce" v-if="ismobile">
															
 
																+        <div class="intro-title">{{name}}</div>
															
 
																+        <div class="intro-detail" @touchmove.stop>
															
 
																+          <p v-for="(item,i) in introduce" :key="i">{{item}}</p>
															
 
																+        </div>
															
 
																+      </div>
															
 
																     </div>
															
 
																+
															
 
																+    <template v-if="showAside&&!ismobile">
															
 
																+      <div class="r-aside" @click.stop>
															
 
																+        <div class="image-title">{{name}}</div>
															
 
																+        <div class="image-detail">
															
 
																+          <p v-for="(item,i) in introduce" :key="i">{{item}}</p>
															
 
																+        </div>
															
 
																+        <div class="switch" @click="show = !show" @touchmove.prevent>
															
 
																+          <i class="iconfont" :class="show ? 'icon-left' : 'icon-right'"></i>
															
 
																+        </div>
															
 
																+      </div>
															
 
																+    </template>
															
 
																   </div>
															
 
																 </template>
															
 
																 <script>
															
 
																 import Slide from '@/components/Slide'
															
 
																+import browser from '@/util/browser'
															
 
																+
															
 
																 export default {
															
 
																   components: { Slide },
															
 
																-  props: ['screens'],
															
 
																+  props: ['screens', 'show', 'showAside', 'name', 'introduce'],
															
 
																   data () {
															
 
																     return {
															
 
																-      screensa: this.screens
															
 
																+      screensa: this.screens,
															
 
																+      ismobile: browser.mobile
															
 
																+    }
															
 
																+  },
															
 
																+  computed: {
															
 
																+    isShow () {
															
 
																+      return !this.show && !this.ismobile
															
 
																     }
															
 
																   },
															
 
																   watch: {
															
@@ -39,12 +66,20 @@ export default {
 
																 .image-dialog {
															
 
																   position: fixed;
															
 
																-  z-index: 9999999999999999999;
															
 
																+  z-index: 99999;
															
 
																   left: 0;
															
 
																   top: 0;
															
 
																   right: 0;
															
 
																   bottom: 0;
															
 
																   background-color: rgba(0,0,0,0.8);
															
 
																+  transform: translateX(0);
															
 
																+  transition: width .3s ease;
															
 
																+  width: 100%;
															
 
																+}
															
 
																+
															
 
																+.image-dialog.i-show{
															
 
																+  transition: width .3s ease;
															
 
																+  width: calc(100% - 350px);
															
 
																 }
															
 
																 .image-dialog a {
															
@@ -70,5 +105,81 @@ export default {
 
																 .image-item {
															
 
																   width: 100%;
															
 
																+  height: 100%;
															
 
																+}
															
 
																+
															
 
																+.r-aside{
															
 
																+  box-sizing: border-box;
															
 
																+  position: absolute;
															
 
																+  right: -350px;
															
 
																+  top: 0;
															
 
																+  bottom: 0;
															
 
																+  width: 350px;
															
 
																+  height: 100%;
															
 
																+  background-color: #fffbf8;
															
 
																+  display: flex;
															
 
																+  flex-direction: column;
															
 
																+  padding: 20px 0;
															
 
																+  border-left: 1px solid #f1c4a3;
															
 
																+  z-index: 999999;
															
 
																+}
															
 
																+
															
 
																+.r-aside .image-title{
															
 
																+  font-weight: bold;
															
 
																+  font-size: 18px;
															
 
																+  padding-bottom: 15px;
															
 
																+  border-bottom: 1px solid #f1c4a3;
															
 
																+  margin: 0 20px;
															
 
																+}
															
 
																+.r-aside .image-detail{
															
 
																+  padding: 15px 0;
															
 
																+  height: 100%;
															
 
																+  overflow-y: scroll;
															
 
																+  margin: 0 10px 0 20px;
															
 
																+}
															
 
																+
															
 
																+.r-aside .image-detail p{
															
 
																+  text-indent: 32px;
															
 
																+  line-height: 1.8;
															
 
																 }
															
 
																+
															
 
																+.switch {
															
 
																+  position: absolute;
															
 
																+  right: 100%;
															
 
																+  top: 50%;
															
 
																+  transform: translateY(-50%);
															
 
																+  background-color: #fa3800;
															
 
																+  width: 14px;
															
 
																+  height: 80px;
															
 
																+  color: #fff;
															
 
																+  line-height: 80px;
															
 
																+  text-align: center;
															
 
																+  cursor: pointer;
															
 
																+  z-index: 9999999;
															
 
																+}
															
 
																+
															
 
																+.image-introduce{
															
 
																+  color:#fff;
															
 
																+  padding:20px 10px;
															
 
																+  line-height:1.5;
															
 
																+
															
 
																+}
															
 
																+.image-introduce .intro-title{
															
 
																+  font-size:18px;
															
 
																+  font-weight:bold;
															
 
																+  margin-bottom:20px;
															
 
																+}
															
 
																+.image-introduce .intro-detail{
															
 
																+  height: 150px;
															
 
																+  overflow-y: auto;
															
 
																+  overflow-x: hidden;
															
 
																+}
															
 
																+.image-introduce .intro-detail p{
															
 
																+  text-indent:32px;
															
 
																+}
															
 
																+
															
 
																+.m-image-layout >>> .ctrl{
															
 
																+  top:25%;
															
 
																+}
															
 
																+
															
 
																 </style>
															
--- a/src/pages/layout/aside/down.vue
+++ b/src/pages/layout/aside/down.vue
@@ -10,7 +10,7 @@
 
																       </span>
															
 
																     </h3>
															
 
																     <ul v-show="showContent && children.length > 0">
															
 
																-      <li v-for="(item, key) in children" :key="key" @click="clickHandle(item)" :class="{active: item.name === active}">
															
 
																+      <li v-for="(item, key) in children" :key="key" @click.stop="clickHandle(item)" :class="{active: item.name === active}">
															
 
																         <p>• {{item.name}} <i class="iconfont icon-wancheng1" v-if="item.link || item.data"></i> </p>
															
 
																       </li>
															
 
																     </ul>
															
@@ -44,7 +44,10 @@ export default {
 
																   computed: {
															
 
																     children () {
															
 
																       let children = [...this.setting.children]
															
 
																-
															
 
																+      let title = this.setting.title
															
 
																+      if (title === '全部' && this.key) {
															
 
																+        return []
															
 
																+      }
															
 
																       if (this.key) {
															
 
																         children = children.filter(item => {
															
 
																           return ~item.name.indexOf(this.keyword)
															
@@ -56,8 +59,8 @@ export default {
 
																   watch: {
															
 
																     show (newVal) {
															
 
																       if (newVal === this.title) {
															
 
																-        this.showContent = false
															
 
																-        this.parentClickHandle()
															
 
																+        this.showContent = true
															
 
																+        // this.parentClickHandle()
															
 
																       }
															
 
																     },
															
 
																     '$route': {
															
@@ -106,6 +109,9 @@ export default {
 
																       this.showAll = false
															
 
																     }
															
 
																     this.$bus.$on('quxiao', this.quxiaoHandle)
															
 
																+    this.$bus.$on('closeitem', (data) => {
															
 
																+      this.showContent = false
															
 
																+    })
															
 
																   },
															
 
																   beforeDestroy () {
															
 
																     this.$bus.$off('quxiao', this.quxiaoHandle)
															
--- a/src/pages/layout/aside/index.vue
+++ b/src/pages/layout/aside/index.vue
@@ -4,7 +4,7 @@
 
																     <div class="search mobileSearch" v-if="ismobile" @touchmove.prevent>
															
 
																       <a  @click="show = true"><i class="iconfont icon-menu"></i></a>
															
 
																-      <div @click="$router.push({name: 'search'})">
															
 
																+      <div @click="$router.push({name: 'search',query:{type:$route.name}})">
															
 
																         <input placeholder="搜索">
															
 
																       </div>
															
 
																       <a><i class="iconfont icon-sousuo"></i></a>
															
@@ -43,6 +43,7 @@
 
																           <down
															
 
																             :aaaactive="showTitle === type.title"
															
 
																             :setting="type"
															
 
																+            :keyword="keyword"
															
 
																             v-for="(type, key) in types"
															
 
																             :key="key"
															
 
																             @showcontent="handleChange(type)"
															
@@ -74,40 +75,73 @@ export default {
 
																       showTab: 'module',
															
 
																       keyword: '',
															
 
																       ismobile: browser.mobile,
															
 
																-      showTitle: ''
															
 
																+      showTitle: '',
															
 
																+      clickItem: false
															
 
																     }
															
 
																   },
															
 
																   methods: {
															
 
																     handleChange (type) {
															
 
																-      if (this.$route.params.title !== type.title) {
															
 
																-        this.$router.push({name: 'map', params: {title: type.title}})
															
 
																+      let route = this.$route
															
 
																+      if (route.name === 'map' || route.name === 'info') {
															
 
																+        if (route.params.title !== type.title) {
															
 
																+          this.$router.push({name: 'map', params: {title: type.title}})
															
 
																+        }
															
 
																+      } else {
															
 
																+        this.$router.push({
															
 
																+          name: 'list',
															
 
																+          params: this.showTab === 'type' ? {type: type.title} : {title: type.title}
															
 
																+        })
															
 
																       }
															
 
																     },
															
 
																     checkHandle (type, item) {
															
 
																-      this.$router.push({name: 'info',
															
 
																-        params: {
															
 
																-          title: type.title,
															
 
																-          show: item.name
															
 
																-        }
															
 
																-      })
															
 
																+      let route = this.$route
															
 
																+      if (route.name === 'map' || route.name === 'info' || route.name === 'home') {
															
 
																+        this.$router.push({name: 'info',
															
 
																+          params: {
															
 
																+            title: type.title,
															
 
																+            show: item.name
															
 
																+          }
															
 
																+        })
															
 
																+      } else {
															
 
																+        this.clickItem = !this.clickItem
															
 
																+        this.$bus.$emit('itemclick', this.clickItem)
															
 
																+        this.$router.push({
															
 
																+          name: 'item',
															
 
																+          params: this.showTab === 'type' ? {title: '全部', type: type.title, show: item.name} : {title: type.title, type: '全部', show: item.name}
															
 
																+        })
															
 
																+      }
															
 
																     }
															
 
																   },
															
 
																   watch: {
															
 
																     '$route': {
															
 
																       deep: true,
															
 
																-      immediate: true,
															
 
																+      immediate: false,
															
 
																       handler (newVal) {
															
 
																         setTimeout(() => {
															
 
																-          this.showTitle = newVal.params.title
															
 
																-
															
 
																-          if (this.types.find(item => item.title === this.showTitle)) {
															
 
																-            this.showTab = 'type'
															
 
																+          if (newVal.name === 'map' || newVal.name === 'info' || newVal.name === 'home') {
															
 
																+            this.showTitle = newVal.params.title
															
 
																           } else {
															
 
																-            this.showTab = 'module'
															
 
																+            this.showTitle = this.showTab === 'type' ? newVal.params.type : newVal.params.title
															
 
																           }
															
 
																+          // if (this.types.find(item => item.title === this.showTitle)) {
															
 
																+          //   this.showTab = 'type'
															
 
																+          // } else {
															
 
																+          //   this.showTab = 'module'
															
 
																+          // }
															
 
																         })
															
 
																       }
															
 
																+    },
															
 
																+    showTab (newVal) {
															
 
																+      if (!this.keyword) {
															
 
																+        this.$bus.$emit('closeitem', false)
															
 
																+      }
															
 
																+      this.showTitle = newVal === 'type' ? this.$route.params.type : this.$route.params.title
															
 
																     }
															
 
																+  },
															
 
																+  mounted () {
															
 
																+    this.$bus.$on('showaside', data => {
															
 
																+      this.show = data
															
 
																+    })
															
 
																   }
															
 
																 }
															
 
																 </script>
															
--- a/src/pages/layout/index.vue
+++ b/src/pages/layout/index.vue
@@ -1,5 +1,5 @@
 
																 <template>
															
 
																-  <div class='layout-con'>
															
 
																+  <div class='layout-con' :style="{background: `#fff url(${bg}) center center`}">
															
 
																     <router-view :showside='isSide' @sidestatus='getSideStatus'></router-view>
															
 
																     <Aside />
															
 
																   </div>
															
@@ -18,6 +18,12 @@ export default {
 
																       isSide: true
															
 
																     }
															
 
																   },
															
 
																+  computed: {
															
 
																+    bg () {
															
 
																+      let bg = this.$isLocal ? require('@/assets/images/bg.jpg') : 'http://4d-tjw.oss-cn-shenzhen.aliyuncs.com/images/bg.jpg'
															
 
																+      return bg
															
 
																+    }
															
 
																+  },
															
 
																   methods: {
															
 
																     getSideStatus (data) {
															
 
																       this.isShow = data
															
--- a/src/pages/list/index.vue
+++ b/src/pages/list/index.vue
@@ -0,0 +1,364 @@
 
																+<!--  -->
															
 
																+<template>
															
 
																+  <div class="layout" :style="{height:showList?'100%':'0',background:isWide?`#fff url(${bg}) top center`:''}">
															
 
																+  <!-- background: #fff url('~@/assets/images/img_all_bg.jpg') top center; -->
															
 
																+
															
 
																+    <template v-if="!isWide">
															
 
																+      <div class="mobile-icon">
															
 
																+        <template v-if="currentArea && currentArea.link">
															
 
																+          <span class="list-icon" @click="goto(currentArea)">
															
 
																+            <i class="iconfont icon-leixing_hangpai"></i>航拍
															
 
																+          </span>
															
 
																+        </template>
															
 
																+        <div
															
 
																+            @click="tapMap()"
															
 
																+            class="list-icon"
															
 
																+          >
															
 
																+          <i class="iconfont icon-tuceng"></i>地图
															
 
																+        </div>
															
 
																+      </div>
															
 
																+    </template>
															
 
																+    <div class="nav-top" v-if="isWide">
															
 
																+      <div class="nav-name">
															
 
																+        <div
															
 
																+          v-if="!isLocal"
															
 
																+          @click="tapMap()"
															
 
																+          class="go-map"
															
 
																+        >
															
 
																+          <i class="iconfont icon-left"></i>
															
 
																+          <span>地图模式</span>
															
 
																+        </div>
															
 
																+        <div class="nav-tag" v-if="currentArea.link">
															
 
																+          <span class="fs">俯视整个{{currentArea.title}}</span>
															
 
																+          <span @click="goto(currentArea)" class="hpsj">航拍视角</span>
															
 
																+        </div>
															
 
																+      </div>
															
 
																+      <div class="area">
															
 
																+        <span class="txt-bold">区域：</span>
															
 
																+        <ul>
															
 
																+          <li
															
 
																+            :class="{active:item==$route.params.title}"
															
 
																+            @click="$router.push({name: 'list', params: {title: item}})"
															
 
																+            v-for="(item,i) in area"
															
 
																+            :key="i"
															
 
																+          >{{item}}</li>
															
 
																+        </ul>
															
 
																+      </div>
															
 
																+      <div class="types">
															
 
																+        <span class="txt-bold">类型：</span>
															
 
																+        <ul>
															
 
																+          <li
															
 
																+            :class="{active:item==$route.params.type}"
															
 
																+            @click="$router.push({name: 'list', params: {type: item}})"
															
 
																+            v-for="(item,i) in types"
															
 
																+            :key="i"
															
 
																+          >{{item}}</li>
															
 
																+        </ul>
															
 
																+      </div>
															
 
																+    </div>
															
 
																+    <div class="mobile-top" v-else>
															
 
																+      <div class="mobile-area">
															
 
																+        <div class="li-type">区域：</div>
															
 
																+        <div class="li-ul" ref="ularea">
															
 
																+          <ul>
															
 
																+            <li
															
 
																+              :class="{active:item==$route.params.title}"
															
 
																+              @click="$router.push({name: 'list', params: {title: item}})"
															
 
																+              v-for="(item,i) in area"
															
 
																+              :key="i"
															
 
																+              :ref="`areali${i}`"
															
 
																+            >{{item}}</li>
															
 
																+            <li class="tiancong"></li>
															
 
																+          </ul>
															
 
																+        </div>
															
 
																+      </div>
															
 
																+      <div class="mobile-types">
															
 
																+        <div class="li-type">类型：</div>
															
 
																+        <div class="li-ul" ref="ultype">
															
 
																+          <ul>
															
 
																+            <li
															
 
																+              :class="{active:item==$route.params.type}"
															
 
																+              @click="$router.push({name: 'list', params: {type: item}})"
															
 
																+              v-for="(item,i) in types"
															
 
																+              :ref="`typeli${i}`"
															
 
																+              :key="i"
															
 
																+            >{{item}}</li>
															
 
																+            <li class="tiancong"></li>
															
 
																+          </ul>
															
 
																+        </div>
															
 
																+      </div>
															
 
																+    </div>
															
 
																+    <div class="list-body" >
															
 
																+      <div class="list-con" ref="listcon" :style="{height: (wh.height - topCap)+ 'px'}" >
															
 
																+        <div
															
 
																+          @click="goto(item)"
															
 
																+          :class="{card:true,'card-animation':i===whichitem&&isWide}"
															
 
																+          :ref="`list${i}`"
															
 
																+          v-for="(item, i) in list"
															
 
																+          :key="i"
															
 
																+        >
															
 
																+          <div class="card-img">
															
 
																+            <img :src="item.coverImg|| defaultImg">
															
 
																+            <div class="card-mask" v-if="!item.link&&!item.data">
															
 
																+              <p>正在拍摄
															
 
																+                <br>敬请期待
															
 
																+              </p>
															
 
																+            </div>
															
 
																+            <div class="card-mask clear-mask" v-else>
															
 
																+              <div class="show-type">
															
 
																+                <i
															
 
																+                  v-for="(iType,idxT) in item.showType"
															
 
																+                  :key="idxT"
															
 
																+                  class="iconfont"
															
 
																+                  :class="'icon-'+iType"
															
 
																+                ></i>
															
 
																+              </div>
															
 
																+            </div>
															
 
																+          </div>
															
 
																+          <div class="card-txt">
															
 
																+            <div class="title">
															
 
																+              <i class="iconfont" :class="'icon-'+item.type"></i>
															
 
																+              <span>{{item.name}}</span>
															
 
																+            </div>
															
 
																+            <div class="tag">
															
 
																+              <span class="tag-span" v-for="(sub,idx) in item.tags" :key="idx">{{sub}}</span>
															
 
																+            </div>
															
 
																+            <div class="address">
															
 
																+              <span>{{item.address}}</span>
															
 
																+            </div>
															
 
																+          </div>
															
 
																+        </div>
															
 
																+      </div>
															
 
																+    </div>
															
 
																+    <imageQuery :introduce="introduce" :name="name" :showAside="true" :screens="screens" @exitHandle="screens = null"/>
															
 
																+  </div>
															
 
																+</template>
															
 
																+
															
 
																+<script>
															
 
																+// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
															
 
																+// 例如：import 《组件名称》 from '《组件路径》';
															
 
																+import browser from '@/util/browser'
															
 
																+
															
 
																+import data from '@/data'
															
 
																+import imageQuery from '@/pages/imageQuery'
															
 
																+
															
 
																+const wh = { width: window.innerWidth, height: window.innerHeight }
															
 
																+const fixScroll = 40
															
 
																+const topCap = wh.width > 1085 ? 208 : 168
															
 
																+export default {
															
 
																+  // import引入的组件需要注入到对象中才能使用
															
 
																+  components: { imageQuery },
															
 
																+  data () {
															
 
																+    // 这里存放数据
															
 
																+    return {
															
 
																+      ismobile: browser.mobile,
															
 
																+      wh,
															
 
																+      showAside: false,
															
 
																+      whichitem: '',
															
 
																+      whichareali: '',
															
 
																+      whichtypeli: '',
															
 
																+      list: [],
															
 
																+      fixScroll,
															
 
																+      topCap,
															
 
																+      currentArea: {},
															
 
																+      screens: null,
															
 
																+      introduce: [],
															
 
																+      name: '',
															
 
																+      showList: false,
															
 
																+      timeout: null
															
 
																+
															
 
																+    }
															
 
																+  },
															
 
																+  // 监听属性 类似于data概念
															
 
																+  computed: {
															
 
																+    isWide () {
															
 
																+      return this.wh.width > 1085
															
 
																+    },
															
 
																+    bg () {
															
 
																+      return this.$isLocal ? require('@/assets/images/img_all_bg.jpg') : `${data.cdnHref}img_all_bg.jpg`
															
 
																+    },
															
 
																+    defaultImg () {
															
 
																+      return this.$isLocal ? require('@/assets/images/default.jpg') : `${data.cdnHref}default.jpg`
															
 
																+    },
															
 
																+    area () {
															
 
																+      return data.modules.map(item => {
															
 
																+        return item.title
															
 
																+      })
															
 
																+    },
															
 
																+    isLocal () {
															
 
																+      return this.$isLocal
															
 
																+    },
															
 
																+    types () {
															
 
																+      return data.types.map(item => {
															
 
																+        return item.title
															
 
																+      })
															
 
																+    }
															
 
																+  },
															
 
																+  // 监控data中的数据变化
															
 
																+  watch: {
															
 
																+    showList (newVal) {
															
 
																+      if (!this.ismobile) {
															
 
																+        this.$bus.$emit('showaside', false)
															
 
																+      }
															
 
																+    },
															
 
																+    '$route.params.title': {
															
 
																+      deep: true,
															
 
																+      immediate: true,
															
 
																+      handler (newVal, oldVal) {
															
 
																+        setTimeout(() => {
															
 
																+          if (newVal !== oldVal) {
															
 
																+            let tempArr = data.modules.find(item => item.title === newVal)
															
 
																+            this.currentArea = tempArr
															
 
																+
															
 
																+            let children = [...tempArr.children]
															
 
																+
															
 
																+            if (tempArr && this.$route.params.type !== '全部') {
															
 
																+              children = children.filter(
															
 
																+                item => item.tagType.name === this.$route.params.type
															
 
																+              )
															
 
																+              this.list = children
															
 
																+            } else if (tempArr && this.$route.params.type === '全部') {
															
 
																+              this.list = children
															
 
																+            }
															
 
																+            if (this.ismobile) {
															
 
																+              this.paramsNavChange()
															
 
																+            }
															
 
																+          }
															
 
																+        })
															
 
																+      }
															
 
																+    },
															
 
																+    '$route.params.type': {
															
 
																+      deep: true,
															
 
																+      immediate: true,
															
 
																+      handler (newVal, oldVal) {
															
 
																+        setTimeout(() => {
															
 
																+          if (newVal !== oldVal) {
															
 
																+            let tempArr = data.modules.find(
															
 
																+              item => item.title === this.$route.params.title
															
 
																+            )
															
 
																+            let children = [...tempArr.children]
															
 
																+
															
 
																+            if (tempArr && newVal !== '全部') {
															
 
																+              children = children.filter(
															
 
																+                item => item.tagType.name === this.$route.params.type
															
 
																+              )
															
 
																+              this.list = children
															
 
																+            } else if (tempArr && newVal === '全部') {
															
 
																+              this.list = children
															
 
																+            }
															
 
																+            if (this.ismobile) {
															
 
																+              this.paramsNavChange()
															
 
																+            }
															
 
																+          }
															
 
																+        })
															
 
																+      }
															
 
																+    },
															
 
																+    '$route.params.show': {
															
 
																+      deep: true,
															
 
																+      immediate: true,
															
 
																+      handler (newVal, oldVal) {
															
 
																+        this.paramsShowChange()
															
 
																+      }
															
 
																+    }
															
 
																+  },
															
 
																+  // 方法集合
															
 
																+  methods: {
															
 
																+    tapMap () {
															
 
																+      let route = this.$route
															
 
																+      this.$router.push({
															
 
																+        name: route.params.show ? 'info' : 'map',
															
 
																+        params: {title: route.params.title, show: route.params.show}
															
 
																+      })
															
 
																+    },
															
 
																+    paramsNavChange () {
															
 
																+      let {type, title} = this.$route.params
															
 
																+      if (type || title) {
															
 
																+        this.area.find((item, i) => {
															
 
																+          if (item === title) {
															
 
																+            let areali = `areali${i}`
															
 
																+            this.$refs.ularea.scrollLeft = this.$refs[areali] && this.$refs[areali][0].offsetLeft
															
 
																+          }
															
 
																+        })
															
 
																+        this.types.find((item, i) => {
															
 
																+          if (item === type) {
															
 
																+            let typeli = `typeli${i}`
															
 
																+            this.$refs.ultype.scrollLeft = this.$refs[typeli] && this.$refs[typeli][0].offsetLeft
															
 
																+          }
															
 
																+        })
															
 
																+      }
															
 
																+    },
															
 
																+    paramsShowChange () {
															
 
																+      setTimeout(() => {
															
 
																+        let show = this.$route.params.show
															
 
																+        if (show) {
															
 
																+          this.list.find((item, i) => {
															
 
																+            if (show === item.name) {
															
 
																+              this.whichitem = i
															
 
																+              let l = `list${i}`
															
 
																+              this.$refs.listcon.scrollTop =
															
 
																+              this.$refs[l] && this.$refs[l][0].offsetTop - ((this.isWide ? fixScroll : 0) + topCap)
															
 
																+            }
															
 
																+          })
															
 
																+        }
															
 
																+      })
															
 
																+      if (this.isWide) {
															
 
																+        if (this.timeout) {
															
 
																+          clearTimeout(this.timeout)
															
 
																+        }
															
 
																+        this.timeout = setTimeout(() => {
															
 
																+          this.whichitem = ''
															
 
																+        }, 1000)
															
 
																+      }
															
 
																+    },
															
 
																+    goto (info) {
															
 
																+      if (info.link) {
															
 
																+        let params = this.$route.params
															
 
																+        let name = null
															
 
																+        let id = null
															
 
																+        Object.keys(data.data).forEach(key => {
															
 
																+          if (data.data[key] === info) {
															
 
																+            id = key
															
 
																+            name = data.data[key].name
															
 
																+          }
															
 
																+        })
															
 
																+        this.$router.push({
															
 
																+          name: 'external',
															
 
																+          params: { url: info.link, id: id },
															
 
																+          query: {title: params.title, type: params.type, show: name}
															
 
																+        })
															
 
																+      } else if (info.data) {
															
 
																+        this.screens = info.data
															
 
																+        this.introduce = info.introduce
															
 
																+        this.name = info.name
															
 
																+      }
															
 
																+    }
															
 
																+  },
															
 
																+  // 生命周期 - 创建完成（可以访问当前this实例）
															
 
																+  created () {},
															
 
																+  // 生命周期 - 挂载完成（可以访问DOM元素）
															
 
																+  mounted () {
															
 
																+    window.onresize = () => {
															
 
																+      if (this.isWide) {
															
 
																+        this.$router.go(0)
															
 
																+      }
															
 
																+    }
															
 
																+    this.$bus.$on('itemclick', data => {
															
 
																+      this.paramsShowChange()
															
 
																+    })
															
 
																+    setTimeout(() => {
															
 
																+      this.showList = true
															
 
																+    })
															
 
																+  },
															
 
																+  beforeDestroy () {},
															
 
																+  beforeCreate () {}, // 生命周期 - 创建之前
															
 
																+  beforeMount () {}, // 生命周期 - 挂载之前
															
 
																+  beforeUpdate () {}, // 生命周期 - 更新之前
															
 
																+  updated () {}, // 生命周期 - 更新之后
															
 
																+  destroyed () {}, // 生命周期 - 销毁完成
															
 
																+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
															
 
																+}
															
 
																+</script>
															
 
																+<style scoped>
															
 
																+/* 引入公共css类 */
															
 
																+@import "./style.css";
															
 
																+</style>
															
--- a/src/pages/list/style.css
+++ b/src/pages/list/style.css
@@ -0,0 +1,317 @@
 
																+.layout{
															
 
																+  transition: all ease 0.8s;
															
 
																+  box-sizing: border-box;
															
 
																+  width: 100%;
															
 
																+  overflow: hidden;
															
 
																+  -webkit-overflow-scrolling: touch;
															
 
																+}
															
 
																+
															
 
																+.txt-bold{
															
 
																+  font-weight: bold;
															
 
																+  width: 60px;
															
 
																+}
															
 
																+
															
 
																+.clear{
															
 
																+  clear: both;
															
 
																+}
															
 
																+
															
 
																+.nav-top{
															
 
																+  margin: 0 50px 20px;
															
 
																+  padding-top: 60px;
															
 
																+
															
 
																+}
															
 
																+.nav-top .nav-name .go-map{
															
 
																+  background: #fa3800;
															
 
																+  color: #fff;
															
 
																+  padding: 10px;
															
 
																+  border-radius: 4px;
															
 
																+  display: inline-block;
															
 
																+  cursor: pointer;
															
 
																+  text-decoration: none;
															
 
																+  margin:0 15px 30px 0;
															
 
																+  font-size: 14px;
															
 
																+}
															
 
																+.nav-top .nav-name .nav-tag{
															
 
																+  display: inline-block;
															
 
																+  font-size: 0;
															
 
																+}
															
 
																+.nav-top .nav-name .fs{
															
 
																+  padding: 10px 10px 7px 10px;
															
 
																+  box-shadow:0 3px 8px rgba(0,0,0,0.1);
															
 
																+  font-size: 14px;
															
 
																+  cursor: default;
															
 
																+  border-radius: 3px 0 0 3px;
															
 
																+
															
 
																+}
															
 
																+.nav-top .nav-name .hpsj{
															
 
																+  cursor: pointer;
															
 
																+  font-size: 14px;
															
 
																+  background: #fa3800;
															
 
																+  color: #fff;
															
 
																+  padding: 10px;
															
 
																+  border-radius: 0 3px 3px 0;
															
 
																+  margin-bottom: 30px;
															
 
																+  box-shadow:0 3px 8px rgba(0,0,0,0.1);
															
 
																+  display: inline-block;
															
 
																+}
															
 
																+.nav-top .go-map .iconfont{
															
 
																+  font-size: 14px;
															
 
																+}
															
 
																+.nav-top .area,.nav-top .types{
															
 
																+  margin-bottom: 20px ;
															
 
																+  display: flex;
															
 
																+  align-items: baseline;
															
 
																+}
															
 
																+
															
 
																+.nav-top .area  ul,.nav-top .types ul{
															
 
																+  display: inline-block;
															
 
																+}
															
 
																+
															
 
																+.nav-top .area  ul li,.nav-top .types ul li{
															
 
																+  display: inline-block;
															
 
																+  padding: 5px 10px;
															
 
																+  margin:0 2px;
															
 
																+  cursor: pointer;
															
 
																+  border-radius: 4px;
															
 
																+}
															
 
																+
															
 
																+.nav-top .area  ul li:hover,.nav-top .types ul li:hover{
															
 
																+  background: #fa3800;
															
 
																+  color: #fff;
															
 
																+}
															
 
																+
															
 
																+.nav-top .active{
															
 
																+  background: #fa3800;
															
 
																+  color: #fff;
															
 
																+}
															
 
																+
															
 
																+.list-con{
															
 
																+  width: 100%;
															
 
																+  padding: 0 30px 40px;
															
 
																+  box-sizing: border-box;
															
 
																+  overflow-y: scroll;
															
 
																+}
															
 
																+
															
 
																+.list-con .card{
															
 
																+  display: inline-block;
															
 
																+  width: 23%;
															
 
																+  box-sizing: border-box;
															
 
																+  margin: 30px 1% 0;
															
 
																+  background: #fff;
															
 
																+  border-radius: 4px;
															
 
																+  overflow: hidden;
															
 
																+  box-shadow: 1px 1px 10px #ccc;
															
 
																+  cursor: pointer;
															
 
																+}
															
 
																+.card-animation{
															
 
																+  animation: scaleFrames 0.5s 1;
															
 
																+}
															
 
																+.list-con .card:hover{
															
 
																+  animation: scaleFrames 0.5s 1;
															
 
																+  animation-fill-mode: forwards;
															
 
																+}
															
 
																+
															
 
																+.list-con .card .card-img{
															
 
																+  position: relative;
															
 
																+  font-size: 0;
															
 
																+  max-height: 240px;
															
 
																+  overflow: hidden;
															
 
																+}
															
 
																+.list-con .card .card-img .card-mask{
															
 
																+  position: absolute;
															
 
																+  top: 0;
															
 
																+  left: 0;
															
 
																+  width: 100%;
															
 
																+  height: 100%;
															
 
																+  background: rgba(0, 0, 0, 0.5);
															
 
																+  color: #fff;
															
 
																+  font-size: 16px;
															
 
																+}
															
 
																+
															
 
																+.list-con .card .card-img .clear-mask{
															
 
																+  background: none;
															
 
																+}
															
 
																+
															
 
																+.list-con .card .card-img .card-mask p {
															
 
																+  position: absolute;
															
 
																+  left: 50%;
															
 
																+  top: 50%;
															
 
																+  transform: translateX(-50%) translateY(-50%);
															
 
																+  line-height: 1.5;
															
 
																+}
															
 
																+
															
 
																+.list-con .card .card-img .card-mask .show-type {
															
 
																+  position: absolute;
															
 
																+  bottom: 10px;
															
 
																+  left: 20px;
															
 
																+}
															
 
																+
															
 
																+.list-con .card .card-img .card-mask .show-type i{
															
 
																+  font-size: 24px;
															
 
																+  margin-right: 10px;
															
 
																+}
															
 
																+
															
 
																+
															
 
																+.list-con .card .card-img img{
															
 
																+  width: 100%;
															
 
																+  height: 100%;
															
 
																+}
															
 
																+
															
 
																+.list-con .card .card-txt{
															
 
																+  padding: 0 10px;
															
 
																+}
															
 
																+
															
 
																+.list-con .card .card-txt div{
															
 
																+  margin: 10px 0;
															
 
																+}
															
 
																+
															
 
																+.list-con .card .card-txt .title .iconfont{
															
 
																+  color: #fa3800;
															
 
																+  font-size: 28px;
															
 
																+}
															
 
																+
															
 
																+.list-con .card .card-txt .title{
															
 
																+  font-weight: bold;
															
 
																+  display: table;
															
 
																+}
															
 
																+.list-con .card .card-txt .title span{
															
 
																+  display: table-cell;
															
 
																+  vertical-align: middle;
															
 
																+  padding-left: 10px;
															
 
																+}
															
 
																+
															
 
																+.list-con .card .card-txt .tag .tag-span{
															
 
																+  display: inline-block;
															
 
																+  color: #f13800;
															
 
																+  border: 1px solid #ff9d7f;
															
 
																+  padding: 2px 5px;
															
 
																+  margin-right: 10px;
															
 
																+  font-size: 12px;
															
 
																+}
															
 
																+.list-con .card .card-txt .address{
															
 
																+  font-size: 14px;
															
 
																+  color: #2b2521;
															
 
																+}
															
 
																+
															
 
																+.mobile-top{
															
 
																+  overflow: hidden;
															
 
																+  margin: 70px 10px 0;
															
 
																+}
															
 
																+.mobile-types,.mobile-area{
															
 
																+  position: relative;
															
 
																+  display: flex;
															
 
																+  align-items: center;
															
 
																+  margin: 10px 0; 
															
 
																+}
															
 
																+.mobile-types .li-type,.mobile-area .li-type{
															
 
																+  position: absolute;
															
 
																+  left: 0;
															
 
																+  padding: 5px 0;
															
 
																+  width: 50px;
															
 
																+  display: inline-block;
															
 
																+}
															
 
																+.mobile-types .li-ul,.mobile-area .li-ul{
															
 
																+  position: relative;
															
 
																+  left: 50px;
															
 
																+  white-space: nowrap;
															
 
																+  overflow-x: scroll;
															
 
																+}
															
 
																+.mobile-types .li-ul li,.mobile-area .li-ul li{
															
 
																+  padding: 5px 10px;
															
 
																+  border-radius: 4px;
															
 
																+  display: inline-block;
															
 
																+  -webkit-tap-highlight-color:transparent;
															
 
																+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
															
 
																+  overflow-x: auto;
															
 
																+  overflow-y: hidden;
															
 
																+  white-space: nowrap;
															
 
																+}
															
 
																+
															
 
																+.mobile-types .li-ul::-webkit-scrollbar, .mobile-area .li-ul::-webkit-scrollbar{
															
 
																+  display: none;
															
 
																+}
															
 
																+
															
 
																+.mobile-top .active{
															
 
																+  background: #fa3800;
															
 
																+  color: #fff;
															
 
																+}
															
 
																+
															
 
																+.mobile-top .tiancong{
															
 
																+  display: inline-block;
															
 
																+  width: 40px;
															
 
																+}
															
 
																+
															
 
																+.mobile-icon{
															
 
																+  position: fixed;
															
 
																+  bottom: 10px;
															
 
																+  left: 10px;
															
 
																+  z-index: 99999;
															
 
																+}
															
 
																+
															
 
																+.mobile-icon .list-icon{
															
 
																+  padding: 5px 12px;
															
 
																+  border-radius: 5px;
															
 
																+  box-shadow: 0 0 10px rgba(0,0,0,0.2);
															
 
																+  text-align: center;
															
 
																+  color: #2b2521;
															
 
																+  font-size: 12px;
															
 
																+  background-color: #fff;
															
 
																+  width: 48px;
															
 
																+  box-sizing: border-box;
															
 
																+  margin-top: 10px;
															
 
																+  text-decoration: none;
															
 
																+  display: block;
															
 
																+}
															
 
																+
															
 
																+
															
 
																+.mobile-icon .list-icon i {
															
 
																+  display: block;
															
 
																+  color: #2b2521;
															
 
																+  font-size: 24px;
															
 
																+}
															
 
																+
															
 
																+/* 动画帧 */
															
 
																+
															
 
																+@keyframes scaleFrames
															
 
																+{
															
 
																+  0% {
															
 
																+    transform: scale(1)
															
 
																+  }
															
 
																+
															
 
																+  100% {
															
 
																+    transform: scale(1.05)
															
 
																+  }
															
 
																+}
															
 
																+
															
 
																+@media screen and (max-width: 1085px){
															
 
																+  .list-body{
															
 
																+    width: 100%;
															
 
																+  }
															
 
																+  .list-con{
															
 
																+    padding: 10px 0;
															
 
																+    box-sizing:inherit;
															
 
																+  }
															
 
																+
															
 
																+  .list-con .card{
															
 
																+    width: calc(100% - 20px);
															
 
																+    margin: 10px;
															
 
																+  }
															
 
																+
															
 
																+  .nav-top{
															
 
																+    margin: 0 10px 20px;
															
 
																+  }
															
 
																+  .nav-name{
															
 
																+    display: none;
															
 
																+  }
															
 
																+  .nav-top{
															
 
																+    padding-top: 80px;
															
 
																+  }
															
 
																+  .list-con .card{
															
 
																+    -webkit-tap-highlight-color:transparent;
															
 
																+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
															
 
																+  }
															
 
																+  .list-con .card:hover{
															
 
																+    animation: none;
															
 
																+    animation-fill-mode: none;
															
 
																+  }
															
 
																+}
															
--- a/src/pages/map/index.vue
+++ b/src/pages/map/index.vue
@@ -1,19 +1,12 @@
 
																 <template>
															
 
																-  <div class="layout" @touchmove.prevent>
															
 
																-    <div id="map"></div>
															
 
																-
															
 
																-    <div class="dialog" v-show="showDialog">
															
 
																-      <a class="close" @click="showDialog = false"></a>
															
 
																-      <a class="jleft" @click="slideHandle(--imgIndex)">
															
 
																-        <img src="@/assets/images/jiantou.png">
															
 
																-      </a>
															
 
																-      <a class="jright" @click="slideHandle(++imgIndex)">
															
 
																-        <img src="@/assets/images/jiantou2.png">
															
 
																-      </a>
															
 
																-    </div>
															
 
																-
															
 
																-    <div class="map-bottom-layout" :class="{mobile: ismobile}">
															
 
																-      <div class="map-tabs clear" :class="{mobile: ismobile}" v-if="dmodel && dmodel.link">
															
 
																+<div class="layout" :style="{top:showList?'0':'100%'}" @touchmove.prevent>
															
 
																+  <div id="map"></div>
															
 
																+  <div class="map-bottom-layout" :class="{mobile: ismobile}">
															
 
																+    <div class="map-tabs clear" :class="{mobile: ismobile}">
															
 
																+      <template v-if="!isLocal && !ismobile">
															
 
																+        <a class="rad list-pc-icon" @click="tapList()"><i class="iconfont icon-suolve"></i></a>
															
 
																+      </template>
															
 
																+      <template v-if="dmodel && dmodel.link">
															
 
																         <template v-if="ismobile">
															
 
																           <span v-if="mapTab === 1" @click="goto(dmodel)">
															
 
																             <i class="iconfont icon-leixing_hangpai"></i>航拍
															
@@ -22,39 +15,46 @@
 
																             <i class="iconfont icon-tuceng"></i>平面
															
 
																           </span>
															
 
																         </template>
															
 
																-        <template v-else>
															
 
																-          <a :class="{active: mapTab === 1}" class="rad">
															
 
																-            俯视整个{{$route.params.title}}
															
 
																-          </a>
															
 
																-          <a @click="goto(dmodel)" :class="{active: mapTab === 0}" class="rad">
															
 
																+        <template v-if="!ismobile">
															
 
																+          <a class="rad mar-left" >
															
 
																+              俯视整个{{$route.params.title}}
															
 
																+            </a>
															
 
																+          <a @click="goto(dmodel)" :class="{active: mapTab === 1}" class="rad mar-rigth">
															
 
																             航拍视角
															
 
																           </a>
															
 
																         </template>
															
 
																-      </div>
															
 
																-
															
 
																-      <div class="focus-info" v-if="info && ismobile">
															
 
																-        <h3>{{info.name}}</h3>
															
 
																-        <div class="tags">
															
 
																-          <span>{{info.parent}}</span>
															
 
																+      </template>
															
 
																+      <template v-if="!isLocal && ismobile">
															
 
																+        <div class="list-icon" @click="tapList()">
															
 
																+          <i class="iconfont icon-suolve"></i>列图
															
 
																         </div>
															
 
																-        <div class="tags">
															
 
																-          <span>{{info.tagType}}</span>
															
 
																-        </div>
															
 
																-        <p>{{info.address}}</p>
															
 
																-        <div class="types">
															
 
																-          <i v-for="type in info.showType" :key="type" class="iconfont" :class="'icon-'+type"></i>
															
 
																-        </div>
															
 
																-        <a @click="goto(info)" v-if="info.link || info.data">
															
 
																+      </template>
															
 
																+    </div>
															
 
																+
															
 
																+    <div class="focus-info" v-if="info && ismobile">
															
 
																+      <h3>{{info.name}}</h3>
															
 
																+      <div class="tags">
															
 
																+        <span>{{info.parent}}</span>
															
 
																+      </div>
															
 
																+      <div class="tags">
															
 
																+        <span>{{info.tagType.name}}</span>
															
 
																+      </div>
															
 
																+      <p>{{info.address}}</p>
															
 
																+      <div class="types">
															
 
																+        <i v-for="type in info.showType" :key="type" class="iconfont" :class="'icon-'+type"></i>
															
 
																+      </div>
															
 
																+      <a @click="goto(info)" v-if="info.link || info.data">
															
 
																           <span>点击</span><span>参观</span>
															
 
																         </a>
															
 
																-        <a class="nolink" v-else>
															
 
																+      <a class="nolink" v-else>
															
 
																           <span>正在</span><span>拍摄</span>
															
 
																         </a>
															
 
																-      </div>
															
 
																     </div>
															
 
																+  </div>
															
 
																+
															
 
																+  <imageQuery :introduce="introduce" :name="name" :showAside="true" :screens="screens" @exitHandle="screens = null"/>
															
 
																-    <imageQuery :screens="screens" @exitHandle="screens = null" />
															
 
																-    <!-- <div class="image-dialog" v-if="screens">
															
 
																+  <!-- <div class="image-dialog" v-if="screens">
															
 
																       <a @click="screens = null"><i class="iconfont icon-left"></i>返回</a>
															
 
																       <div class="image-layout">
															
 
																         <Slide :screens="screens" :current="0">
															
@@ -64,7 +64,7 @@
 
																         </Slide>
															
 
																       </div>
															
 
																     </div> -->
															
 
																-  </div>
															
 
																+</div>
															
 
																 </template>
															
 
																 <script>
															
@@ -74,7 +74,9 @@ import data from '@/data'
 
																 const AMap = global.AMap
															
 
																 export default {
															
 
																-  components: { imageQuery },
															
 
																+  components: {
															
 
																+    imageQuery
															
 
																+  },
															
 
																   data () {
															
 
																     return {
															
 
																       cacheMakers: [],
															
@@ -84,7 +86,17 @@ export default {
 
																       ismobile: browser.mobile,
															
 
																       info: null,
															
 
																       dmodel: {},
															
 
																-      screens: null
															
 
																+      isType: true,
															
 
																+      screens: null,
															
 
																+      showList: false,
															
 
																+      introduce: [],
															
 
																+      name: ''
															
 
																+
															
 
																+    }
															
 
																+  },
															
 
																+  computed: {
															
 
																+    isLocal () {
															
 
																+      return this.$isLocal
															
 
																     }
															
 
																   },
															
 
																   methods: {
															
@@ -109,10 +121,10 @@ export default {
 
																             <span>${item.name}</span>
															
 
																           </h3>
															
 
																           <div class="content">
															
 
																-            <div><span>${item.parent}</span><span>${item.tagType}</span></div>
															
 
																+            <div><span>${item.parent}</span><span>${item.tagType.name}</span></div>
															
 
																             <p>${item.address}</p>
															
 
																             <div class="oper">
															
 
																-              <div>${types.join('')}</div>
															
 
																+              <div>${(item.link || item.data) ? types.join('') : ''}</div>
															
 
																               <a class='query-image'>${(item.link || item.data) ? '点击参观' : '正在拍摄'}</a>
															
 
																             </div>
															
 
																           </div>
															
@@ -205,10 +217,21 @@ export default {
 
																       global.AMap.event.addListener(marker, 'click', e => {
															
 
																         if (!show) {
															
 
																-          this.$router.push({name: 'info', params: {title: this.$route.params.title, show: item.name}})
															
 
																+          this.$router.push({
															
 
																+            name: 'info',
															
 
																+            params: {
															
 
																+              title: this.$route.params.title,
															
 
																+              show: item.name
															
 
																+            }
															
 
																+          })
															
 
																           // marker.seftadditional.play()
															
 
																         } else {
															
 
																-          this.$router.push({name: 'map', params: {title: this.$route.params.title}})
															
 
																+          this.$router.push({
															
 
																+            name: 'map',
															
 
																+            params: {
															
 
																+              title: this.$route.params.title
															
 
																+            }
															
 
																+          })
															
 
																           // marker.seftadditional.pause()
															
 
																         }
															
 
																       })
															
@@ -219,7 +242,12 @@ export default {
 
																           content: infoDom
															
 
																         })
															
 
																         infoDom.querySelector('h3').addEventListener('click', () => {
															
 
																-          this.$router.push({name: 'map', params: {title: this.$route.params.title}})
															
 
																+          this.$router.push({
															
 
																+            name: 'map',
															
 
																+            params: {
															
 
																+              title: this.$route.params.title
															
 
																+            }
															
 
																+          })
															
 
																           // marker.seftadditional.pause()
															
 
																         })
															
 
																         infoDom.querySelector('a').addEventListener('click', clickHandle)
															
@@ -235,6 +263,38 @@ export default {
 
																       }
															
 
																       this.loadding(item, params.show)
															
 
																     },
															
 
																+    tapList () {
															
 
																+      let {params} = this.$route
															
 
																+      // let items, item
															
 
																+      // let tagType
															
 
																+
															
 
																+      // if (params.show) {
															
 
																+      //   if (data.types.find(item => item.title === params.title)) {
															
 
																+      //     items = data.types.find(item => item.title === params.title)
															
 
																+      //   } else {
															
 
																+      //     items = data.modules.find(item => item.title === params.title)
															
 
																+      //   }
															
 
																+      //   if (name === 'map' || name === 'info' || name === 'home') {
															
 
																+
															
 
																+      //   }
															
 
																+      //   item = items ? items.children.find(item => item.name === params.show) : ''
															
 
																+
															
 
																+      //   tagType = item.tagType.name
															
 
																+      // }
															
 
																+
															
 
																+      this.$router.push({
															
 
																+        name: params.show ? 'item' : 'list',
															
 
																+        params: !this.isType ? {
															
 
																+          title: params.title,
															
 
																+          type: '全部',
															
 
																+          show: params.show
															
 
																+        } : {
															
 
																+          title: '全部',
															
 
																+          type: params.title,
															
 
																+          show: params.show
															
 
																+        }
															
 
																+      })
															
 
																+    },
															
 
																     goto (info) {
															
 
																       if (info.link) {
															
 
																         let id = null
															
@@ -243,13 +303,23 @@ export default {
 
																             id = key
															
 
																           }
															
 
																         })
															
 
																-        this.$router.push({name: 'external', params: {url: info.link, id: id}})
															
 
																+        this.$router.push({
															
 
																+          name: 'external',
															
 
																+          params: {
															
 
																+            url: info.link,
															
 
																+            id: id
															
 
																+          }
															
 
																+        })
															
 
																       } else if (info.data) {
															
 
																         this.screens = info.data
															
 
																+        this.introduce = info.introduce
															
 
																+        this.name = info.name
															
 
																       }
															
 
																     },
															
 
																     queryImage (item) {
															
 
																       this.screens = item.data
															
 
																+      this.introduce = item.introduce
															
 
																+      this.name = item.name
															
 
																     }
															
 
																   },
															
 
																   watch: {
															
@@ -260,16 +330,22 @@ export default {
 
																         this.map.add(this.satellite)
															
 
																       }
															
 
																     },
															
 
																+    showList () {
															
 
																+      if (!this.ismobile) {
															
 
																+        this.$bus.$emit('showaside', true)
															
 
																+      }
															
 
																+    },
															
 
																     '$route.params.title': {
															
 
																       handler: function (newVal, oldVal) {
															
 
																         setTimeout(() => {
															
 
																           if (newVal !== oldVal) {
															
 
																             let params = this.$route.params
															
 
																             let item = data.modules.find(item => item.title === params.title)
															
 
																+            this.isType = false
															
 
																             if (!item) {
															
 
																+              this.isType = true
															
 
																               item = data.types.find(item => item.title === params.title)
															
 
																             }
															
 
																-
															
 
																             this.map.setCenter(item.center)
															
 
																             this.map.setZoom(item.zoom)
															
 
																           }
															
@@ -283,6 +359,9 @@ export default {
 
																     }
															
 
																   },
															
 
																   mounted () {
															
 
																+    setTimeout(() => {
															
 
																+      this.showList = true
															
 
																+    })
															
 
																     this.map = new global.AMap.Map('map', {
															
 
																       mapStyle: 'amap://styles/fresh',
															
 
																       zoom: 18,
															
@@ -296,8 +375,6 @@ export default {
 
																 <style scoped>
															
 
																 @import url(./style);
															
 
																-</style>
															
 
																-
															
 
																-<style>
															
 
																+</style><style>
															
 
																 @import url(./map_style);
															
 
																 </style>
															
--- a/src/pages/map/style.css
+++ b/src/pages/map/style.css
@@ -1,7 +1,9 @@
 
																 .layout, #map {
															
 
																   width: 100%;
															
 
																-  height: 100%
															
 
																+  height: 100%;
															
 
																+  transition: ease 0.8s all;
															
 
																+  position: relative;
															
 
																 }
															
 
																 .maker-info {
															
@@ -239,11 +241,29 @@
 
																   background-color: #ffffff;
															
 
																   color: #2b2521;
															
 
																 }
															
 
																+.map-tabs .mar-left{
															
 
																+  margin-left: 15px;
															
 
																+  cursor: default;
															
 
																+  border-radius: 3px 0 0 3px;
															
 
																+}
															
 
																+
															
 
																+.map-tabs .mar-rigth{
															
 
																+  border-radius: 0 3px 3px 0;
															
 
																+}
															
 
																+.map-tabs .list-pc-icon{
															
 
																+  padding: 0 10px;
															
 
																+}
															
 
																 .map-tabs a.active {
															
 
																   background-color: #fa3800;
															
 
																   color: #fff;
															
 
																+  /* margin-left: 15px; */
															
 
																+}
															
 
																+
															
 
																+
															
 
																+.map-tabs a .icon-suolve{
															
 
																+  font-size: 22px;
															
 
																 }
															
 
																 .map-tabs span {
															
@@ -255,6 +275,7 @@
 
																   color: #2b2521;
															
 
																   font-size: 12px;
															
 
																   background-color: #fff;
															
 
																+  margin-bottom: 10px;
															
 
																 }
															
 
																 .map-tabs span i {
															
@@ -264,6 +285,25 @@
 
																 }
															
 
																+.map-tabs .list-icon {
															
 
																+  padding: 5px 12px;
															
 
																+  border-radius: 5px;
															
 
																+  box-shadow: 0 0 10px rgba(0,0,0,0.2);
															
 
																+  text-align: center;
															
 
																+  color: #2b2521;
															
 
																+  font-size: 12px;
															
 
																+  background-color: #fff;
															
 
																+  width: 48px;
															
 
																+  box-sizing: border-box;
															
 
																+}
															
 
																+
															
 
																+.map-tabs .list-icon i {
															
 
																+  display: block;
															
 
																+  color: #2b2521;
															
 
																+  font-size: 24px;
															
 
																+
															
 
																+}
															
 
																+
															
 
																 .focus-info {
															
 
																   z-index: 10;
															
 
																   background-color: #fff;
															
--- a/src/pages/search/index.vue
+++ b/src/pages/search/index.vue
@@ -7,19 +7,18 @@
 
																     </div>
															
 
																     <ul class="list">
															
 
																-      <li v-for="item in listData" :key="item.name">
															
 
																+      <li  @click="tapSearch(item)" v-for="(item, i) in listData" :key="i">
															
 
																         <svg class="icon" aria-hidden="true">
															
 
																           <use :xlink:href="'#icon-'+item.type"></use>
															
 
																         </svg>
															
 
																         <div class="info">
															
 
																           <h3>{{item.name}}</h3>
															
 
																           <div>
															
 
																-            <span v-for="tag in item.tags" :key="tag">{{tag}}</span>
															
 
																+            <span v-for="(tag, idx) in item.tags" :key="idx">{{tag}}</span>
															
 
																           </div>
															
 
																         </div>
															
 
																-        <a @click="$router.push({name: 'info', params: {title: item.title, show: item.name}})">
															
 
																+        <a>
															
 
																           <span><i class="iconfont icon-jiantou"></i></span>
															
 
																-          看位置
															
 
																         </a>
															
 
																       </li>
															
 
																     </ul>
															
@@ -38,16 +37,37 @@ export default {
 
																   computed: {
															
 
																     listData () {
															
 
																       let list = []
															
 
																+
															
 
																       data.modules.forEach(m => {
															
 
																+        if (m.title === '全部') {
															
 
																+          return
															
 
																+        }
															
 
																         m.children.forEach(item => {
															
 
																           if (~item.name.indexOf(this.keyword)) {
															
 
																             list.push({...item, title: m.title})
															
 
																           }
															
 
																         })
															
 
																       })
															
 
																-      console.log(list)
															
 
																       return list
															
 
																     }
															
 
																+  },
															
 
																+  methods: {
															
 
																+    tapSearch (item) {
															
 
																+      let {type} = this.$route.query
															
 
																+      if (type === 'map' || type === 'info' || type === 'home') {
															
 
																+        this.$router.push({name: 'info',
															
 
																+          params: {
															
 
																+            title: item.title,
															
 
																+            show: item.name
															
 
																+          }
															
 
																+        })
															
 
																+      } else {
															
 
																+        this.$router.push({
															
 
																+          name: 'item',
															
 
																+          params: type === 'type' ? {title: '全部', type: item.title, show: item.name} : {title: item.title, type: '全部', show: item.name}
															
 
																+        })
															
 
																+      }
															
 
																+    }
															
 
																   }
															
 
																 }
															
 
																 </script>
															
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -2,45 +2,62 @@ import Vue from 'vue'
 
																 import Router from 'vue-router'
															
 
																 import Layout from '@/pages/layout'
															
 
																 import Map from '@/pages/map'
															
 
																+import List from '@/pages/list'
															
 
																 import Home from '@/pages/home'
															
 
																 import Search from '@/pages/search'
															
 
																 import External from '@/pages/External'
															
 
																 Vue.use(Router)
															
 
																+// let isLocal = process.env.isLocal
															
 
																+let isLocal = Vue.$isLocal
															
 
																+
															
 
																+let routes = [
															
 
																+  {
															
 
																+    path: '/',
															
 
																+    name: 'mainLayout',
															
 
																+    component: Layout,
															
 
																+    children: [
															
 
																+      {
															
 
																+        path: '/',
															
 
																+        name: 'home',
															
 
																+        component: Home
															
 
																+      },
															
 
																+      {
															
 
																+        path: '/list/:title/:type',
															
 
																+        name: 'list',
															
 
																+        component: List,
															
 
																+        children: [
															
 
																+          {name: 'item', path: ':show'}
															
 
																+        ]
															
 
																+      }
															
 
																+    ]
															
 
																+  },
															
 
																+  {
															
 
																+    path: '/search',
															
 
																+    name: 'search',
															
 
																+    component: Search
															
 
																+  },
															
 
																+  {
															
 
																+    path: '/external/:url/:id',
															
 
																+    name: 'external',
															
 
																+    component: External
															
 
																+  }
															
 
																+]
															
 
																+
															
 
																+isLocal || routes[0].children.push(
															
 
																+  {
															
 
																+    path: '/map/:title',
															
 
																+    name: 'map',
															
 
																+    component: Map,
															
 
																+    children: [
															
 
																+      {name: 'info', path: ':show'}
															
 
																+    ]
															
 
																+  }
															
 
																+)
															
 
																+
															
 
																 const router = new Router({
															
 
																-  routes: [
															
 
																-    {
															
 
																-      path: '/',
															
 
																-      name: 'mainLayout',
															
 
																-      component: Layout,
															
 
																-      children: [
															
 
																-        {
															
 
																-          path: '/',
															
 
																-          name: 'home',
															
 
																-          component: Home
															
 
																-        },
															
 
																-        {
															
 
																-          path: '/map/:title',
															
 
																-          name: 'map',
															
 
																-          component: Map,
															
 
																-          children: [
															
 
																-            {name: 'info', path: ':show'}
															
 
																-          ]
															
 
																-        }
															
 
																-      ]
															
 
																-    },
															
 
																-    {
															
 
																-      path: '/search',
															
 
																-      name: 'search',
															
 
																-      component: Search
															
 
																-    },
															
 
																-    {
															
 
																-      path: '/external/:url/:id',
															
 
																-      name: 'external',
															
 
																-      component: External
															
 
																-    }
															
 
																-  ],
															
 
																+  routes,
															
 
																   scrollBehavior (to, from, savedPosition) {
															
 
																     if (to.hash === '') {
															
 
																       return { x: 0, y: 0 }