Skip to content

B
bigwood
Commit 97ecc1d6 authored by youjie's avatar youjie
Browse files
Options

no message

parent a8dabd16
Hide whitespace changes
Inline Side-by-side
Showing with 116 additions and 11 deletions
src/components/CharteredBus/CharteredBusCard.vue
View file @ 97ecc1d6
......@@ -74,6 +74,7 @@
<div class="rounded-borders" :class="{ 'q-ml-sm col': $q.platform.is.desktop, 'q-mt-sm height-320': $q.platform.is.mobile }" style="overflow: hidden" id="baiduCharteredBusMapBaoChe">
<GoogleMap api-key="AIzaSyCvRZN9lGl3y3EsM0A0sWPf1pZ2olGsyNg" style="width: 100%; height: 100%" :center="center" :zoom="15" v-if="center">
<Marker :options="{ position: center }" />
<Circle></Circle>
</GoogleMap>
</div>
</div>
......@@ -166,17 +167,18 @@ import CharteredBusService from '../../api/CharteredBus'
import { DirtionmaryHelper } from "src/config/dictionary";
import useScrollModule from "src/module/scrollbar/scrollModule";
import { defineComponent, nextTick, reactive, toRefs, watch } from "vue";
import { GoogleMap, Marker } from 'vue3-google-map'
import { GoogleMap, Marker, Circle } from 'vue3-google-map'
import ImagePreview from "../common/ImagePreview.vue";
import { ApiResult } from '../../@types/enumHelper'
import message from '../../utils/message'
import { useHotel } from '../../utils/hotelRate'
import { useI18n } from 'vue-i18n'
export default defineComponent({
props:["ProductId"],
components:{GoogleMap,ImagePreview},
setup(props) {
const { t } = useI18n()
const data = reactive({
t:{} as any,
scrollStyle: {} as any,
......@@ -184,6 +186,7 @@ export default defineComponent({
currentImage:'',
showImagePriview:false,
center:{} as any,
radius: 0,
images:[],
type: [],
typeInfo: {} as any,
......@@ -215,6 +218,11 @@ export default defineComponent({
data.typeInfo = data.type.find(y => y.id == data.t.CarType) ?? data.type[1]
data.images = r.data.data.ImageList
nextTick(()=>{
data.center = {
lng:data.t.PlaceList[0].Lng,
lat:data.t.PlaceList[0].Lat
}
data.radius = data.t.PlaceList[0].Range
methods.initMap(data.t.PlaceList[0].Lng,data.t.PlaceList[0].Lat)
})
} else {
......@@ -230,10 +238,35 @@ export default defineComponent({
data.center = { lat: parseFloat(lng), lng: parseFloat(lat) }
}else{
let Bmap = window.BMapGL
let mPoint = new Bmap.Point(lat, lng)
var b = new Bmap.Map('baiduCharteredBusMapBaoChe')
b.centerAndZoom(new Bmap.Point(lat, lng), 15)
b.centerAndZoom(mPoint, 15)
b.enableScrollWheelZoom(true)
var opts = {
position: mPoint, // 指定文本标注所在的地理位置
offset: new Bmap.Size(-40, 10), // 设置文本偏移量
styles:{
position: 'absolute',
display: 'inline',
cursor: 'inherit',
whiteSpace: 'nowrap',
backgroundColor: '#FFFFFF',
color: 'red',
border: 0,
left: '167px',
top: '104px',
padding: '1px 5px',
borderRadius: '3px',
},
};
// 创建文本标注对象
var label = new Bmap.Label(`${t('v102.CharteredBus.jiesongdianfw')}`, opts);
var circle = new Bmap.Circle(mPoint,data.radius,{fillColor:"blue", strokeWeight: 1 ,fillOpacity: 0.3, strokeOpacity: 0.3});
b.addOverlay(new Bmap.Marker(new Bmap.Point(lat, lng)))
b.addOverlay(label)
b.addOverlay(circle)
// console.log(new Bmap.Circle(new Bmap.radiu(lat, lng)),'-=====')
}
},
}
......
src/i18n/ja-RB/index.ts
View file @ 97ecc1d6
......@@ -975,6 +975,9 @@ export default {
nt: '註文情報がありません'
},
CharteredBus: {
jiesongdianfw: '送迎点範囲です',
d: 'ポイント',
fw: '範囲',
pageTitle: '車両検索します',
pageTitle2: 'ハイヤーの註文です',
baochetype: 'チャータータイプです',
......
src/i18n/ko-HG/index.ts
View file @ 97ecc1d6
......@@ -975,6 +975,9 @@ export default {
nt:"주문 정보가 없습니다"
},
CharteredBus:{
jiesongdianfw: '픽업점 범위',
d: '점',
fw: '범위',
pagetitle:'자동차 검색',
pagetitle2:"전세차 주문서",
baochetype:"대절차 유형",
......
src/i18n/zh-TW/index.ts
View file @ 97ecc1d6
......@@ -975,6 +975,9 @@ export default {
nt: '沒有訂單信息'
},
CharteredBus:{
jiesongdianfw: '接送點範圍',
d: '點',
fw: '範圍',
pageTitle: '車輛檢索',
pageTitle2: '包車訂單',
baochetype: '包車類型',
......
src/pages/CharteredBus/CharteredBusPreview.vue
View file @ 97ecc1d6
......@@ -56,16 +56,17 @@
</div>
</div>
</div>
<!-- <div :class="{ 'q-px-lg': $q.platform.is.desktop }">
<div :class="{ 'q-px-lg': $q.platform.is.desktop }">
<div :class="{'column':($q.screen.width<1200 || $q.platform.is.mobile),'row items-center':!($q.screen.width<1200 || $q.platform.is.mobile)}">
<div class="f12 text-dark" :class="{ 'col-2': $q.platform.is.desktop, 'col-3': $q.platform.is.mobile }">{{ $t('v102.CharteredBus.sc') }}：</div>
<div class="f12 text-dark" :class="{ 'col-2': $q.platform.is.desktop, 'col-3': $q.platform.is.mobile }">{{ $t('v102.CharteredBus.sjc.c25') }}{{ $t('v102.CharteredBus.d') }}：</div>
<div class="row items-center col wrap q-mt-md">
<div class="q-pa-sm rounded-borders q-mr-md q-mb-md cursor-pointer row items-center" :class="{ 'bg-grey-2': !x.checked, 'bg-primary text-white': x.checked }" @click="changeDetailListHandler(x,2)" v-for="x in PlaceTypes">
<span>{{ x.Address }}</span>
<span class="q-mr-sm q-pr-sm" :style="{'border-right': x.checked?'1px solid #ffffff':'1px solid gray'}">{{ x.Address }}</span>
<span>{{ x.Range }} m{{ $t('v102.CharteredBus.fw') }}</span>
</div>
</div>
</div>
</div> -->
</div>
<div :class="{ 'q-px-lg': $q.platform.is.desktop }">
<div :class="{'column':($q.screen.width<1200 || $q.platform.is.mobile),'row items-center':!($q.screen.width<1200 || $q.platform.is.mobile)}">
<div class="f12 text-dark" :class="{ 'col-2': $q.platform.is.desktop, 'col-3': $q.platform.is.mobile }">{{ $t('v102.CharteredBus.tt') }}：</div>
......@@ -172,8 +173,16 @@
<div class="col">{{ $t('v102.CharteredBus.sjc.c8') }}</div>
</div>
<div style="border-top: 1px dashed #eee" :class="{'row items-center':$q.platform.is.desktop,'column':$q.platform.is.mobile}">
<q-input v-if="msg.OrderType!=1" dense standout v-model="msg.GetonAddress" class="col q-mt-md col" :class="{'q-mr-md':$q.platform.is.desktop}" :placeholder="$t('v102.CharteredBus.sjcp.c5')" :rules="[ val => val && val.length > 0 || ' ']" ref="guestGetonAddress"/>
<q-input v-if="msg.OrderType!=2" dense standout v-model="msg.GetoffAddress" class="col q-mt-md" :class="{'q-mr-md':$q.platform.is.desktop}" :placeholder="$t('v102.CharteredBus.sjcp.c6')" :rules="[ val => val && val.length > 0 || ' ']" ref="guestGetoffAddress"/>
<q-input v-if="msg.OrderType!=1" dense standout v-model="msg.GetonAddress" class="col q-mt-md col" :class="{'q-mr-md':$q.platform.is.desktop}" :placeholder="$t('v102.CharteredBus.sjcp.c5')" :rules="[ val => val && val.length > 0 || ' ']" ref="guestGetonAddress">
<template #prepend>
<q-icon class="text-red q-mr-xs" name="place" size="xs" @click="initMap(1,GetOnTheBusObj.Address,GetOnTheBusObj.Lng,GetOnTheBusObj.Lat)"></q-icon>
</template>
</q-input>
<q-input v-if="msg.OrderType!=2" dense standout v-model="msg.GetoffAddress" class="col q-mt-md" :class="{'q-mr-md':$q.platform.is.desktop}" :placeholder="$t('v102.CharteredBus.sjcp.c6')" :rules="[ val => val && val.length > 0 || ' ']" ref="guestGetoffAddress">
<template #append>
<q-icon class="text-red q-mr-xs" name="place" size="xs" @click="initMap(2,GetOffTheBusIdObj.Address,GetOffTheBusIdObj.Lng,GetOffTheBusIdObj.Lat)"></q-icon>
</template>
</q-input>
<q-field standout :model-value="msg.OrderDate" class="col text-dark cursor-pointer height" ref="guestTimeData">
<template v-slot:control>
<div class="self-center full-width no-outline" tabindex="0">
......@@ -313,9 +322,18 @@
<q-dialog v-model="showDetails">
<CharteredBusCard :ProductId="ProductId"></CharteredBusCard>
</q-dialog>
<q-dialog v-model="showGoogleMap">
<div class="rounded-borders" :class="{ 'q-ml-sm col': $q.platform.is.desktop, 'q-mt-sm height-320': $q.platform.is.mobile }" style="overflow: hidden" id="baiduCharteredBusMapBaoCheCar">
<GoogleMap api-key="AIzaSyCvRZN9lGl3y3EsM0A0sWPf1pZ2olGsyNg" style="width: 100%; height: 100%" :center="center" :zoom="15" v-if="center">
<Marker :options="{ position: center }" />
<Circle></Circle>
</GoogleMap>
</div>
</q-dialog>
</template>
<script lang="ts">
import { GoogleMap, Marker, Circle } from 'vue3-google-map'
import { useRouter } from 'vue-router'
import { ApiResult } from 'src/@types/enumHelper'
import TicketService from '../../api/CharteredBus'
......@@ -329,7 +347,7 @@ import CharteredBusCard from '../../components/CharteredBus/CharteredBusCard.vue
import CharteredBusService from '../../api/CharteredBus'
import { date } from 'quasar'
export default defineComponent({
components: { CharteredBusCard },
components: { CharteredBusCard,GoogleMap },
setup(props) {
const $router = useRouter()
let { setTitle } = useMetaModule()
......@@ -339,6 +357,11 @@ export default defineComponent({
setTitle(pageTitle.value)
const data = reactive({
GetOnTheBusObj: {} as any,
GetOffTheBusIdObj: {} as any,
center:{} as any,
radius: 0,
showGoogleMap: false,
SetOutTime2: '',
timeData2: ref('19:42'),
timeData: ref('19:42'),
......@@ -375,6 +398,7 @@ export default defineComponent({
types: [] as any,
AirportTypes: [] as any,
PlaceTypes: [] as any,
PlaceTypes2: [] as any,
isCheck: false,
SetOutTime: '',
detailsObj: {} as any,
......@@ -420,6 +444,44 @@ export default defineComponent({
const menu = inject(DirtionmaryHelper.MENU_KEYS) as any
menu.value = 5
const methods = {
initMap(type: Number,Address: String,lat: any, lng: any) {
return
data.showGoogleMap = true
let country=localStorage.getItem(DirtionmaryHelper.USER_IN_COUNTRY) ?? 'GW'
if(country!='CN'){
data.center = { lat: parseFloat(lng), lng: parseFloat(lat) }
}else{
let Bmap = window.BMapGL
let mPoint = new Bmap.Point(lat, lng)
var b = new Bmap.Map('baiduCharteredBusMapBaoCheCar')
b.centerAndZoom(mPoint, 15)
b.enableScrollWheelZoom(true)
var opts = {
position: mPoint, // 指定文本标注所在的地理位置
offset: new Bmap.Size(-40, 10), // 设置文本偏移量
styles:{
position: 'absolute',
display: 'inline',
cursor: 'inherit',
whiteSpace: 'nowrap',
backgroundColor: '#FFFFFF',
color: 'red',
border: 0,
left: '167px',
top: '104px',
padding: '1px 5px',
borderRadius: '3px',
},
};
// 创建文本标注对象
var label = new Bmap.Label(`${t('v102.CharteredBus.jiesongdianfw')}`, opts);
var circle = new Bmap.Circle(mPoint,data.radius,{fillColor:"blue", strokeWeight: 1 ,fillOpacity: 0.3, strokeOpacity: 0.3});
b.addOverlay(new Bmap.Marker(new Bmap.Point(lat, lng)))
b.addOverlay(label)
b.addOverlay(circle)
// console.log(new Bmap.Circle(new Bmap.radiu(lat, lng)),'-=====')
}
},
// 获取订单详情
getOrderInfo(){
CharteredBusService.GetTYMyCarOrderInfo(data.msg.OrderId)
......@@ -538,7 +600,8 @@ export default defineComponent({
if(data.AirportTypes.length>0){
methods.changeDetailListHandler(data.AirportTypes[0],1,data.msg.OrderId)
}
data.PlaceTypes = r.data.data.PlaceList
data.PlaceTypes = JSON.parse(JSON.stringify(r.data.data.PlaceList))
data.PlaceTypes2 = JSON.parse(JSON.stringify(r.data.data.PlaceList))
data.types = r.data.data.CarTypeList
if(data.types&&data.types.length==0){
message.errorMsg(`${t('v102.ticket.nobj')}`)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment