chenkainan
/
changshu_map
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

提交

master
chenkainan 3 months ago
parent
d3dd669930
commit
99695520b3
12 changed files with 187 additions and 93 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      .env.development
  2. 2
      .env.production
  3. 2
      .env.test
  4. 2
      dist/index.html
  5. 1
      dist/static/css/app.0c09c0af.css
  6. 1
      dist/static/css/app.3c10ecc1.css
  7. 1
      dist/static/js/app.02c0cefe.js
  8. 1
      dist/static/js/app.d5255bd2.js
  9. 12
      src/libs/axios.js
  10. 65
      src/libs/utils.js
  11. 103
      src/views/Index.vue
  12. 80
      src/views/compoents/productDetail.vue

2
.env.development
View File

@ -1,5 +1,5 @@
NODE_ENV='development' NODE_ENV='development'
# 请求域名前缀 # 请求域名前缀
VUE_APP_URL='https://tongli.sz-trip.com' VUE_APP_URL='https://changshu.js-dyyj.com'
# 打包后输出目录 # 打包后输出目录
VUE_APP_OUTPUTDIR='dist_dev' VUE_APP_OUTPUTDIR='dist_dev'

2
.env.production
View File

@ -1,5 +1,5 @@
NODE_ENV='production' NODE_ENV='production'
# 请求域名前缀 # 请求域名前缀
VUE_APP_URL='https://tongli.sz-trip.com' VUE_APP_URL='https://changshu.js-dyyj.com'
# 打包后输出目录 # 打包后输出目录
VUE_APP_OUTPUTDIR='dist' VUE_APP_OUTPUTDIR='dist'

2
.env.test
View File

@ -1,5 +1,5 @@
NODE_ENV='production' NODE_ENV='production'
# 请求域名前缀 # 请求域名前缀
VUE_APP_URL='https://tongli.sz-trip.com' VUE_APP_URL='https://changshu.js-dyyj.com'
# 打包后输出目录 # 打包后输出目录
VUE_APP_OUTPUTDIR='dist_test' VUE_APP_OUTPUTDIR='dist_test'

2
dist/index.html
View File

@ -1 +1 @@
<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"><link rel="icon" href="favicon.ico"><title>地图</title><script charset="utf-8" src="https://map.qq.com/api/gljs?v=1.exp&key=YVOBZ-MWJ3Z-34IXK-7J2GL-O33US-QLF5X"></script><script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script><script src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script><script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script><script defer="defer" src="/static/js/chunk-vendors.c33f6caf.js"></script><script defer="defer" src="/static/js/app.d5255bd2.js"></script><link href="/static/css/chunk-vendors.befb54be.css" rel="stylesheet"><link href="/static/css/app.3c10ecc1.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but taihulake doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html> <!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"><link rel="icon" href="favicon.ico"><title>地图</title><script charset="utf-8" src="https://map.qq.com/api/gljs?v=1.exp&key=YVOBZ-MWJ3Z-34IXK-7J2GL-O33US-QLF5X"></script><script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script><script src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script><script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script><script defer="defer" src="/static/js/chunk-vendors.c33f6caf.js"></script><script defer="defer" src="/static/js/app.02c0cefe.js"></script><link href="/static/css/chunk-vendors.befb54be.css" rel="stylesheet"><link href="/static/css/app.0c09c0af.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but taihulake doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>

1
dist/static/css/app.0c09c0af.css
View File

File diff suppressed because one or more lines are too long

1
dist/static/css/app.3c10ecc1.css
View File

File diff suppressed because one or more lines are too long

1
dist/static/js/app.02c0cefe.js
View File

File diff suppressed because one or more lines are too long

1
dist/static/js/app.d5255bd2.js
View File

File diff suppressed because one or more lines are too long

12
src/libs/axios.js
View File

@ -6,12 +6,22 @@ import axios from "axios";
import {Dialog, Toast} from "vant"; import {Dialog, Toast} from "vant";
import store from '@/store'; import store from '@/store';
const http = axios.create({ const http = axios.create({
baseURL: process.env.VUE_APP_URL, // baseURL: process.env.VUE_APP_URL,
timeout: 6000 // 请求超时时间 当请求时间超过`秒还未取得结果时 提示用户请求超时 timeout: 6000 // 请求超时时间 当请求时间超过`秒还未取得结果时 提示用户请求超时
}) })
//添加请求拦截器 //添加请求拦截器
http.interceptors.request.use((config) => { http.interceptors.request.use((config) => {
const { customBaseURL } = config.params || {}; // 从请求参数中获取自定义的 baseURL
if (customBaseURL) {
config.baseURL = customBaseURL; // 如果有自定义的 baseURL，则使用它
// 移除自定义的 baseURL 参数，避免传递到后端
delete config.params.customBaseURL;
} else {
// 默认的 baseURL，可以根据环境变量设置
config.baseURL = process.env.VUE_APP_URL;
}
const token = store.state.user.userInfo.token; const token = store.state.user.userInfo.token;
config.headers['token'] = token config.headers['token'] = token
config.headers['Content-Type'] = 'application/json;charset=UTF-8' config.headers['Content-Type'] = 'application/json;charset=UTF-8'

65
src/libs/utils.js
View File

@ -58,8 +58,8 @@ export default {
openMap(item) { openMap(item) {
let data = { let data = {
type: 'map', type: 'map',
lon: item.tengxun_map.lon, lon: item.scene_lon,
lat: item.tengxun_map.lat, lat: item.scene_lat,
name: item.title, name: item.title,
address: item.address address: item.address
} }
@ -72,7 +72,7 @@ export default {
if (img.indexOf('https://') != -1 || img.indexOf('http://') != -1) { if (img.indexOf('https://') != -1 || img.indexOf('http://') != -1) {
return img; return img;
} else { } else {
return 'https://tongli.sz-trip.com' + img; return 'https://changshu.js-dyyj.com' + img;
} }
}, },
// 跳回小程序 // 跳回小程序
@ -90,37 +90,38 @@ export default {
return return
}else if(item.link_type == 2){ }else if(item.link_type == 2){
// 外部H5 // 外部H5
window.location.href = item.ext_link // window.location.href = item.ext_link
window.location.href = 'https://m.cloud.sz-trip.com/MailMerchandiseDetail?type=ticket&id=' + item.id
return return
} }
switch (item.genre){ // switch (item.genre){
// 景点 // // 景点
case 'ticket': // case 'ticket':
uni.navigateTo({ // uni.navigateTo({
url: '/subPackages/ticketBooking/detail?id=' + item.id // url: '/subPackages/ticketBooking/detail?id=' + item.id
}) // })
break; // break;
// 酒店 // // 酒店
case 'hotel': // case 'hotel':
uni.navigateTo({ // uni.navigateTo({
url: '/subPackages/hotelHomestay/detail?id=' + item.id // url: '/subPackages/hotelHomestay/detail?id=' + item.id
}) // })
break; // break;
// 美食 // // 美食
case 'food': // case 'food':
uni.navigateTo({ // uni.navigateTo({
url: '/subPackages/food/foodDetail?id=' + item.id // url: '/subPackages/food/foodDetail?id=' + item.id
}) // })
break; // break;
// 攻略 // // 攻略
case 'article': // case 'article':
uni.navigateTo({ // uni.navigateTo({
url: '/subPackages/travelGuide/detail?id=' + item.id // url: '/subPackages/travelGuide/detail?id=' + item.id
}) // })
break; // break;
default: // default:
break; // break;
} // }
} }
} }
} }

103
src/views/Index.vue
View File

@ -4,6 +4,10 @@
<!-- 点位分类 --> <!-- 点位分类 -->
<div class="type-box" v-if="typeShow"> <div class="type-box" v-if="typeShow">
<div class="search">
<img src="https://static.ticket.sz-trip.com/changshu/images/map/search.png" alt="" />
搜索
</div>
<div :class="['type-item',{'type-active': index == typeIndex}]" v-for="(item,index) in mapType" <div :class="['type-item',{'type-active': index == typeIndex}]" v-for="(item,index) in mapType"
@click="getSpotsByCategory(index)">{{item.name}}</div> @click="getSpotsByCategory(index)">{{item.name}}</div>
</div> </div>
@ -24,7 +28,7 @@
</div> </div>
</div> </div>
<!-- 行程线路 --> <!-- 行程线路 -->
<div> <!-- <div>
<div class="area-item area-items" @click="addLine" v-if="isMyLine"> <div class="area-item area-items" @click="addLine" v-if="isMyLine">
<img src="https://static.ticket.sz-trip.com/yandu/images/map/myLine.png" alt="" /> <img src="https://static.ticket.sz-trip.com/yandu/images/map/myLine.png" alt="" />
我的<br>行程 我的<br>行程
@ -37,14 +41,14 @@
<img src="https://static.ticket.sz-trip.com/yandu/images/map/line.png" alt="" /> <img src="https://static.ticket.sz-trip.com/yandu/images/map/line.png" alt="" />
线路<br>推荐 线路<br>推荐
</div> </div>
</div> </div> -->
</div> </div>
<!-- 详情弹框 --> <!-- 详情弹框 -->
<van-popup v-model="detailShow" @close="audioPause" :overlay-style="{'background-color': 'rgba(0, 0, 0, 0)'}" <van-popup v-model="detailShow" @close="audioPause" :overlay-style="{'background-color': 'rgba(0, 0, 0, 0)'}"
position="bottom" round> position="bottom" round>
<ProductDetail ref="detailRef" :type="productType" :info="detailInfo" :audioSrc="audioSrc" <ProductDetail ref="detailRef" :type="productType" :info="detailInfo" :audioSrc="audioSrc"
:genreType="genreType" /> :genreType="genreType" :content="detailContent" :imgList="imgList" :isCanBuy="isCanBuy" :tel="tel" />
</van-popup> </van-popup>
<!-- 输入线路信息弹框 --> <!-- 输入线路信息弹框 -->
@ -130,6 +134,10 @@
audioSrc: '', audioSrc: '',
genreType: '', genreType: '',
isMyLine: false, // 是否有我的线路 isMyLine: false, // 是否有我的线路
detailContent: '',
imgList: '',
isCanBuy: false,
tel: ''
}; };
}, },
mounted() { mounted() {
@ -157,7 +165,7 @@
if (res.data.length > 0) { if (res.data.length > 0) {
this.getAreaDetail() this.getAreaDetail()
this.getCategory() this.getCategory()
this.getMyLine() // this.getMyLine()
} }
}) })
}, },
@ -168,7 +176,7 @@
this.mapObj.destroy() this.mapObj.destroy()
this.getAreaDetail() this.getAreaDetail()
this.getCategory() this.getCategory()
this.getMyLine() // this.getMyLine()
}, },
// 根据code获取当前区域信息 // 根据code获取当前区域信息
getAreaDetail() { getAreaDetail() {
@ -323,13 +331,15 @@
this.maps.forEach(item => { this.maps.forEach(item => {
markers.push({ markers.push({
"styleId": 'marker', "styleId": 'marker',
id: item.goods ? (item.goods.genre == 'food' ? item.goods.id : item.goods id: item.goods.id, // 产品id
.scenic_id) : '', // 产品id
genre: item.goods ? item.goods.genre : '', // 产品类型 genre: item.goods ? item.goods.genre : '', // 产品类型
name: item.name, // 产品名称 name: item.name, // 产品名称
address: item.address, // 详情地址 address: item.address, // 详情地址,
audioSrc: item.audio_file, // 音频路径 audioSrc: item.audio_file, // 音频路径
spotId: item.id, // 点位id spotId: item.id, // 点位id
detailContent: item.detail_content, // 简介
imgList: item.album_images, // 图片
tel: item.tel, // 电话
position: new TMap.LatLng(JSON.parse(item.poi)[1], JSON.parse(item.poi)[0]) position: new TMap.LatLng(JSON.parse(item.poi)[1], JSON.parse(item.poi)[0])
}) })
@ -353,7 +363,7 @@
"marker": new TMap.MarkerStyle({ "marker": new TMap.MarkerStyle({
"width": 27, "width": 27,
"height": 33, "height": 33,
"src": 'https://static.ticket.sz-trip.com/yandu/images/map/scenic.png', "src": 'https://static.ticket.sz-trip.com/changshu/images/map/scenic.png',
"src": this.util.showImg(this.mapType.find(i => { "src": this.util.showImg(this.mapType.find(i => {
return i.id == this.maps[0].category_id return i.id == this.maps[0].category_id
}).icon_image) }).icon_image)
@ -427,29 +437,41 @@
} else { } else {
this.audioSrc = evt.geometry.audioSrc this.audioSrc = evt.geometry.audioSrc
this.genreType = evt.geometry.genre this.genreType = evt.geometry.genre
if (['ticket', 'hotel'].includes(evt.geometry.genre)) { this.detailContent = evt.geometry.detailContent
// 景点酒店 this.imgList = evt.geometry.imgList
this.tel = evt.geometry.tel
if (['ticket'].includes(evt.geometry.genre)) {
// 景点 酒景
this.get({ this.get({
id: evt.geometry.id id: evt.geometry.id,
}, '/api/scenic/getScenicById').then(res => { customBaseURL: 'https://api.cloud.sz-trip.com'
}, '/api/product/get_product_detail').then(res => {
if (res.data) { if (res.data) {
// 酒店类型展示购买按钮
if(evt.geometry.genre == 'ticket') {
this.isCanBuy = true
this.productType = true this.productType = true
}
this.detailInfo = res.data this.detailInfo = res.data
this.detailInfo.genre = evt.geometry.genre this.detailInfo.genre = evt.geometry.genre
this.detailShow = true this.detailShow = true
} }
}) })
} else if (evt.geometry.genre == 'food') {
this.get({
goods_id: evt.geometry.id
}, '/api/goods/getGoodDetail').then(res => {
if (res.data) {
this.productType = true
this.detailInfo = res.data
this.detailShow = true
} }
}) // else if (evt.geometry.genre == 'food') {
} else { // this.get({
// goods_id: evt.geometry.id
// }, '/api/goods/getGoodDetail').then(res => {
// if (res.data) {
// this.productType = true
// this.detailInfo = res.data
// this.detailShow = true
// }
// })
// }
else {
// 停车场 卫生间等 // 停车场 卫生间等
this.detailInfo = { this.detailInfo = {
title: evt.geometry.name, title: evt.geometry.name,
@ -458,7 +480,7 @@
lat: evt.geometry.position.lat lat: evt.geometry.position.lat
} }
console.log(this.detailInfo) console.log(this.detailInfo)
this.productType = false this.productType = true
this.detailShow = true this.detailShow = true
} }
} }
@ -680,28 +702,47 @@
.type-box { .type-box {
position: fixed; position: fixed;
z-index: 2000; z-index: 2000;
width: 723px; width: 750px;
height: 53px; top: 0;
top: 22px; left: 0;
left: 27px;
display: flex; display: flex;
overflow-x: auto; overflow-x: auto;
padding: 16px;
background-color: #fff;
.type-item { .type-item {
padding: 0 26px; padding: 0 26px;
line-height: 53px; line-height: 53px;
background: #FFFFFF; background: #F2F2F2;
border-radius: 13px; border-radius: 13px;
font-weight: 500; font-weight: 500;
font-size: 27px; font-size: 27px;
color: #000000; color: #333333;
margin-right: 27px; margin-right: 27px;
flex-shrink: 0; flex-shrink: 0;
} }
.type-active { .type-active {
background: linear-gradient(130deg, #9EE4FE, #7FD491); background: #00AEA0;
color: #fff;
}
.search {
padding-right: 21px;
font-weight: bold; font-weight: bold;
font-size: 27px;
color: #00AEA0;
border-right: 1px solid #CCCCCC;
display: flex;
align-items: center;
margin-right: 18px;
white-space: nowrap;
img {
width: 25px;
height: 25px;
margin-right: 8px;
}
} }
} }

80
src/views/compoents/productDetail.vue
View File

@ -3,11 +3,15 @@
<div class="bg"> <div class="bg">
<div class="top flex-between"> <div class="top flex-between">
{{info.title}} {{info.title}}
<div class="top-btn" v-if="type" @click="util.gotoDetailMini(info)">购买</div> <div v-if="type && audioSrc">
<img src="https://static.ticket.sz-trip.com/changshu/images/map/pause.png" v-if="isAudioPlay" @click="audioPlay(false)">
<img src="https://static.ticket.sz-trip.com/changshu/images/map/play.png" v-else @click="audioPlay(true)">
<div>讲解</div>
</div>
</div> </div>
<div class="img-box" v-if="type && info.list_images"> <div class="img-box" v-if="type && imgList">
<img v-for="(item,index) in info.list_images.split(',')" :src="util.showImg(item)" alt="" /> <img v-for="(item,index) in imgList.split(',')" :src="util.showImg(item)" alt="" />
</div> </div>
<div class="scenic-detail flex-between" :style="{marginTop: type ? '' : '0'}"> <div class="scenic-detail flex-between" :style="{marginTop: type ? '' : '0'}">
@ -16,23 +20,24 @@
<div :class="[type ? 'text-overflow' : 'text-overflowRows']">地址：{{info.address}}</div> <div :class="[type ? 'text-overflow' : 'text-overflowRows']">地址：{{info.address}}</div>
</div> </div>
<div class="scenic-right flex-between"> <div class="scenic-right flex-between">
<div v-if="type && audioSrc"> <div v-if="type && tel" @click="goTel">
<img src="https://static.ticket.sz-trip.com/yandu/images/map/pause.png" v-if="isAudioPlay" @click="audioPlay(false)"> <img src="https://static.ticket.sz-trip.com/changshu/images/map/phone.png">
<img src="https://static.ticket.sz-trip.com/yandu/images/map/play.png" v-else @click="audioPlay(true)"> <div>电话</div>
<div>讲解</div>
</div> </div>
<div v-else></div> <div v-else></div>
<div @click="util.openMap(info)"> <div @click="util.openMap(info)">
<img src="https://static.ticket.sz-trip.com/yandu/images/map/navigation.png" alt=""> <img src="https://static.ticket.sz-trip.com/changshu/images/map/location.png" alt="">
<div>导航</div> <div>导航</div>
</div> </div>
</div> </div>
</div> </div>
<div class="buy-btn" v-if="isCanBuy" @click="util.gotoDetailMini(info)">在线预订</div>
<div class="scenic-content" v-if="type"> <div class="scenic-content" v-if="type">
简介: 简介:
<div v-html="util.formateRichText(info.feature_content)"></div> <div v-html="util.formateRichText(content)"></div>
</div> </div>
<!-- 音频讲解 --> <!-- 音频讲解 -->
<audio :src="audioSrc" ref="audio" controls v-show="false" @ended="endAudio"></audio> <audio :src="audioSrc" ref="audio" controls v-show="false" @ended="endAudio"></audio>
@ -48,15 +53,31 @@
}, },
info: { info: {
type: Object, type: Object,
detault: {} default: {}
}, },
audioSrc: { audioSrc: {
type: String, type: String,
detault: '' default: ''
}, },
genreType: { genreType: {
type: String, type: String,
detault: '' default: ''
},
imgList: {
type: String,
default: ''
},
content: {
type: String,
default: ''
},
isCanBuy: {
type: Boolean,
default: false
},
tel: {
type: String,
default: ''
} }
}, },
data() { data() {
@ -65,9 +86,14 @@
} }
}, },
mounted() { mounted() {
this.$refs.audio.src = this.util.showImg(this.audioSrc) this.$refs.audio.src = this.util.showImg(this.audioSrc) || ''
this.info.link_type = 2
}, },
methods: { methods: {
// 拨打电话
goTel() {
window.location.href = 'tel:' + this.tel;
},
audioPlay(status) { audioPlay(status) {
console.log(this.$refs.audio.paused) console.log(this.$refs.audio.paused)
if(status) { if(status) {
@ -100,16 +126,32 @@
font-size: 40px; font-size: 40px;
color: #000000; color: #000000;
.top-btn { img {
width: 133px; width: 37px;
line-height: 59px; height: 37px;
background: #F74A57; margin-bottom: 5px;
}
div {
text-align: center;
font-weight: 500;
font-size: 24px;
color: #00AEA0;
white-space: nowrap;
}
}
.buy-btn {
margin: 36px 0 0 auto;
width: 200px;
height: 59px;
background: #FF7F00;
border-radius: 13px; border-radius: 13px;
line-height: 59px;
text-align: center; text-align: center;
font-weight: bold;
font-size: 32px; font-size: 32px;
color: #FFFFFF; color: #FFFFFF;
} }
}
.img-box { .img-box {
overflow-x: auto; overflow-x: auto;
display: flex; display: flex;
@ -153,7 +195,7 @@
width: 150px; width: 150px;
font-weight: 500; font-weight: 500;
font-size: 24px; font-size: 24px;
color: #71B580; color: #00AEA0;
img { img {
width: 37px; width: 37px;

Write Preview
Loading…
Cancel
Save