chenkainan
1 year ago
17 changed files with 1076 additions and 118 deletions
|
After Width: | Height: | Size: 4.2 KiB |
@ -0,0 +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"><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 defer="defer" src="/static/js/chunk-vendors.c33f6caf.js"></script><script defer="defer" src="/static/js/app.5a057ce3.js"></script><link href="/static/css/chunk-vendors.befb54be.css" rel="stylesheet"><link href="/static/css/app.0cd07668.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> |
|||
@ -0,0 +1 @@ |
|||
.bg[data-v-e0228542]{width:100%;min-height:100vh;background:#f7f7f7;padding-top:.41333rem}.top-box[data-v-e0228542]{width:9.29333rem;padding:.4rem;margin:0 auto;font-weight:700;font-size:.53333rem;color:#000}.top-box .top-btn[data-v-e0228542]{width:1.82667rem;line-height:.8rem;border-radius:.4rem;border:1px solid #ccc;text-align:center;font-weight:400;font-size:.36rem;color:#000}.item[data-v-e0228542]{width:9.29333rem;height:3.2rem;background:#fff;box-shadow:0 1px .21333rem 0 hsla(0,0%,60%,.35);border-radius:.26667rem;margin:0 auto .44rem;padding:.17333rem;display:flex;justify-content:space-between}.item img[data-v-e0228542]{-o-object-fit:cover;object-fit:cover;width:2.84rem;height:2.84rem;border-radius:.17333rem}.item .content[data-v-e0228542]{padding:.2rem 0;width:5.46667rem}.item .content .title[data-v-e0228542]{font-weight:700;font-size:.44rem;color:#111}.item .content .subtitle[data-v-e0228542]{margin-top:8px;font-weight:500;font-size:.36rem;color:#666}.item .contents[data-v-e0228542]{width:4.53333rem}.item .delLine[data-v-e0228542]{width:.66667rem}.item .delLine img[data-v-e0228542]{width:.4rem;height:.45333rem} |
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1 @@ |
|||
"use strict";(self["webpackChunktaihulake"]=self["webpackChunktaihulake"]||[]).push([[46],{46:function(t,e,s){s.r(e),s.d(e,{default:function(){return r}});var i=function(){var t=this,e=t._self._c;return e("div",{staticClass:"bg"},[t.type?e("div",{staticClass:"top-box flex-between"},[e("div",[t._v("我的行程")]),e("div",{staticClass:"top-btn",on:{click:t.addLine}},[t._v("+添加")])]):t._e(),t._l(t.list,(function(s,i){return e("div",{key:i,staticClass:"item",on:{click:function(e){return t.viewDetail(s)}}},[e("img",{attrs:{src:t.util.showImg(s.image),alt:""}}),e("div",{class:["content",{contents:t.type}]},[e("div",{staticClass:"title"},[t._v(t._s(s.name))]),t.type?e("div",{staticClass:"subtitle text-overflowRows",staticStyle:{display:"flex"}},t._l(s.points,(function(i,n){return e("div",{key:n},[t._v(t._s(i.name)),n+1!=s.points.length?e("span",[t._v("-")]):t._e()])})),0):e("div",{staticClass:"subtitle"},[t._v(t._s(s.points.length)+"个景点")]),t.type?e("div",{staticClass:"subtitle"},[t._v(t._s(s.date))]):t._e()]),t.type?e("div",{staticClass:"delLine flex-center"},[e("img",{attrs:{src:"https://static.ticket.sz-trip.com/yandu/images/map/delLine.png",alt:""},on:{click:function(e){return t.delLine(i)}}})]):t._e()])}))],2)},n=[],a=(s(7658),{data(){return{list:[],type:this.$route.query.type}},mounted(){this.getList()},methods:{getList(){this.post({type:this.$route.query.type?1:"",code:this.$route.query.code},"/api/emap/getLineByCode").then((t=>{this.list=t.data}))},viewDetail(t){sessionStorage.setItem("lineDetail",JSON.stringify(t)),this.$router.push("/")},addLine(){this.$router.push("/")}}}),l=a,u=s(1001),c=(0,u.Z)(l,i,n,!1,null,"e0228542",null),r=c.exports}}]); |
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,315 @@ |
|||
<template> |
|||
<div class="bg"> |
|||
<!-- 景点详情 --> |
|||
<div class="info" v-if="info"> |
|||
<img :src="util.showImg(info.image)" class="info-img"> |
|||
<div class="info-content"> |
|||
<div class="title text-overflow">{{info.title}}</div> |
|||
<div class="subtitle text-overflow">营业时间：{{info.open_time}}-{{info.close_time}}</div> |
|||
<div class="subtitle text-overflow">地址：{{info.address}}</div> |
|||
<div class="location" @click="util.openMap(info)"> |
|||
<img src="https://static.ticket.sz-trip.com/yandu/images/map/lineLocation.png" alt=""> |
|||
导航 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="title">{{detail.name}}</div> |
|||
<div class="subtitle">{{detail.points.length}}个景点</div> |
|||
|
|||
<!-- 线路列表 --> |
|||
<div class="box"> |
|||
<div class="item" v-for="(item,index) in detail.points" :key="index"> |
|||
<div :class="['line',{'lineF': index == 0, 'lineE': index+1 == detail.points.length, 'lineS': index == selectIndex}]"></div> |
|||
<div :class="['num',{'numS': index == selectIndex, 'numE': index+1 == detail.points.length}]"> |
|||
{{index == 0 ? '起' : ((index+1 == detail.points.length) ? '终' : index + 1)}} |
|||
</div> |
|||
<div :class="['content', {'contents': selectIndex == index}]" @click="choosePoint(item, index)"> |
|||
{{item.name}} |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<!-- 推荐攻略 --> |
|||
<div> |
|||
<div class="title">推荐攻略</div> |
|||
<div class="strategy-info" @click="util.gotoDetailMini(strategyInfo)"> |
|||
<img :src="util.showImg(strategyInfo.image)" class="strategy-img"> |
|||
|
|||
<div class="strategy-content flex-between"> |
|||
<div class="strategy-title text-overflowRows">{{strategyInfo.title}}</div> |
|||
<div class="strategy-subtitle flex-between"> |
|||
<div> |
|||
<img :src="util.showImg(strategyInfo.author_img)" alt=""> |
|||
{{strategyInfo.author}} |
|||
</div> |
|||
<div> |
|||
<img src="https://static.ticket.sz-trip.com/yandu/images/map/eye.png" alt=""> |
|||
{{strategyInfo.view}} |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
detail: {}, |
|||
selectIndex: null, |
|||
info: null, |
|||
strategyInfo: {} |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.detail = JSON.parse(sessionStorage.getItem('lineDetail')) |
|||
|
|||
// 获取攻略详情 |
|||
this.get({ |
|||
id: this.detail.article_id |
|||
},'/api/article/getArticleById').then(res => { |
|||
this.strategyInfo = res.data |
|||
}) |
|||
}, |
|||
methods: { |
|||
// 选中景点 |
|||
choosePoint(item,index) { |
|||
if(this.selectIndex == index) { |
|||
this.info = null |
|||
this.selectIndex = null |
|||
return; |
|||
} |
|||
this.selectIndex = index |
|||
if(['ticket', 'hotel'].includes(item.goods.genre)) { |
|||
// 景点酒店 |
|||
this.get({ |
|||
id: item.goods.scenic_id |
|||
},'/api/scenic/getScenicById').then(res => { |
|||
if(res.data) { |
|||
this.info = res.data |
|||
this.$emit('changeCenter', item.lonlat) |
|||
} |
|||
}) |
|||
}else if(item.goods.genre == 'food') { |
|||
this.get({ |
|||
goods_id: item.goods.id |
|||
},'/api/goods/getGoodDetail').then(res => { |
|||
if(res.data) { |
|||
this.info = res.data |
|||
this.$emit('changeCenter', item.lonlat) |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.bg { |
|||
width: 750px; |
|||
max-height: 60vh; |
|||
overflow-x: hidden; |
|||
overflow-y: auto; |
|||
padding: 43px 0 96px 27px; |
|||
position: relative; |
|||
overflow: visible; |
|||
} |
|||
|
|||
.title { |
|||
font-weight: bold; |
|||
font-size: 37px; |
|||
color: #111111; |
|||
} |
|||
|
|||
.subtitle { |
|||
font-weight: 500; |
|||
font-size: 24px; |
|||
color: #666666; |
|||
margin-top: 15px; |
|||
} |
|||
|
|||
.box { |
|||
margin-top: 49px; |
|||
|
|||
.item { |
|||
display: flex; |
|||
align-items: center; |
|||
padding-left: 41px; |
|||
height: 116px; |
|||
position: relative; |
|||
padding-bottom: 19px; |
|||
|
|||
.line { |
|||
width: 0px; |
|||
height: 100%; |
|||
border-left: 3px dashed #71B580; |
|||
position: absolute; |
|||
top: 0; |
|||
left: 64px; |
|||
} |
|||
|
|||
.lineF { |
|||
height: 50%; |
|||
top: auto; |
|||
bottom: 5px; |
|||
} |
|||
|
|||
.lineE { |
|||
height: 50%; |
|||
top: 5px; |
|||
} |
|||
|
|||
.num { |
|||
width: 53px; |
|||
height: 53px; |
|||
line-height: 53px; |
|||
background: #FFFFFF; |
|||
border-radius: 50%; |
|||
border: 2px solid #71B580; |
|||
text-align: center; |
|||
font-weight: bold; |
|||
font-size: 32px; |
|||
color: #71B580; |
|||
position: relative; |
|||
} |
|||
|
|||
.numS { |
|||
background: #71B580; |
|||
color: #FFFFFF; |
|||
} |
|||
|
|||
.content { |
|||
width: 597px; |
|||
height: 97px; |
|||
background-image: url('https://static.ticket.sz-trip.com/yandu/images/map/lineBg.png'); |
|||
background-size: 100% 100%; |
|||
font-weight: 500; |
|||
font-size: 28px; |
|||
color: #333333; |
|||
display: flex; |
|||
align-items: center; |
|||
padding-left: 50px; |
|||
} |
|||
.contents { |
|||
background-image: url('https://static.ticket.sz-trip.com/yandu/images/map/lineBgs.png'); |
|||
color: #FFFFFF; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.info { |
|||
width: 573px; |
|||
height: 202px; |
|||
background: #FFFFFF; |
|||
box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.3); |
|||
border-radius: 13px; |
|||
position: absolute; |
|||
top: -400px; |
|||
left: 88px; |
|||
padding: 5px; |
|||
display: flex; |
|||
|
|||
.info-img { |
|||
width: 187px; |
|||
height: 187px; |
|||
border-radius: 7px; |
|||
object-fit: cover; |
|||
} |
|||
|
|||
.info-content { |
|||
padding: 7px 0 3px; |
|||
margin-left: 15px; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: space-between; |
|||
width: 344px; |
|||
|
|||
.title { |
|||
font-weight: bold; |
|||
font-size: 29px; |
|||
color: #333333; |
|||
width: 344px; |
|||
} |
|||
|
|||
.subtitle { |
|||
font-weight: 500; |
|||
font-size: 23px; |
|||
color: #666666; |
|||
width: 344px; |
|||
margin-top: 0; |
|||
} |
|||
|
|||
.location { |
|||
font-weight: bold; |
|||
font-size: 23px; |
|||
color: #71B580; |
|||
display: flex; |
|||
align-items: center; |
|||
margin-left: auto; |
|||
|
|||
img { |
|||
width: 32px; |
|||
height: 32px; |
|||
margin-right: 5px; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.strategy-info { |
|||
width: 697px; |
|||
height: 213px; |
|||
background: #FFFFFF; |
|||
box-shadow: 0px 1px 16px 0px rgba(153,153,153,0.35); |
|||
border-radius: 20px; |
|||
margin-top: 25px; |
|||
padding: 13px; |
|||
display: flex; |
|||
|
|||
.strategy-img { |
|||
object-fit: cover; |
|||
width: 187px; |
|||
height: 187px; |
|||
border-radius: 13px; |
|||
} |
|||
|
|||
.strategy-content { |
|||
width: 455px; |
|||
margin-left: 18px; |
|||
flex-direction: column; |
|||
padding: 5px 0; |
|||
|
|||
.strategy-title { |
|||
font-weight: bold; |
|||
font-size: 31px; |
|||
color: #111111; |
|||
} |
|||
|
|||
.strategy-subtitle { |
|||
font-weight: 500; |
|||
font-size: 27px; |
|||
color: #888888; |
|||
width: 100%; |
|||
|
|||
div { |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
|
|||
img { |
|||
width: 27px; |
|||
margin-right: 5px; |
|||
} |
|||
|
|||
.strategy-userImg { |
|||
width: 37px !important; |
|||
height: 37px !important; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue