no message

src/api/scattered.ts

+import { HttpResponse } from '../@types'
+import request from './request'
+
+
+
+
+class HotelService {
+  //获取相似数据
+  static async GetHotelRoomsList(param:any): Promise<HttpResponse> {
+    return request('dmc_post_Get_GetJAPAN_RoomsList', param)
+  }
+  //
+  //获取酒店详情
+  static async GetHotelDetailScat(param:any): Promise<HttpResponse> {
+    return request('dmc_post_Get_GetJAPAN_HotelDetail', param)
+  }
+  // 获取散客酒店列表
+  static async GetJAPANHotelList(param:any):Promise<HttpResponse>{
+    param.reviewRatingUpperLimits=param.reviewRatingUpperLimits&&param.reviewRatingUpperLimits!=''?param.reviewRatingUpperLimits:0
+    param.reviewRatingLowerLimits=param.reviewRatingLowerLimits&&param.reviewRatingLowerLimits!=''?param.reviewRatingLowerLimits:0
+    param.searchMaxRate=param.searchMaxRate&&param.searchMaxRate!=''?param.searchMaxRate:0
+    param.searchMinRate=param.searchMinRate&&param.searchMinRate!=''?param.searchMinRate:0
+    return request('dmc_post_Get_GetJAPAN_HotelList',param)
+  }
+}
+
+export default HotelService

src/assets/svg/scattered/The.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg t="1670564176126" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2186" width="1024" height="1024"><path d="M701.5 548.7c71.6-56.2 117.7-143.4 117.7-241.5C819.2 137.5 681.7 0 512 0S204.8 137.5 204.8 307.2c0 98.1 46.1 185.2 117.7 241.5C133.6 624 0 808.2 0 1024h1024c0-215.8-133.6-400-322.5-475.3z" fill="#9d9da6" p-id="2187"></path></svg>
\ No newline at end of file

src/components/hotel/list/hotelCard.vue

@@ -16,7 +16,7 @@
       <div class="q-px-sm">
           <img v-for="item in 5" class="q-mr-xs" width="15" height="11" src="../../../assets/images/hotelCard0.png" />
       </div>
-      <div class="q-px-sm row items-center justify-between nowrap absolute" style="left: 0;right: 0;bottom: 16px;">
+      <div class="q-px-sm row items-center justify-between no-wrap absolute" style="left: 0;right: 0;bottom: 16px;">
         <div>
           <q-icon class="text-grey-13 q-mr-xs" name="place" size="xs"></q-icon>
           <span class="fz12 text-weight-bold text-grey-7">日本东京</span>

src/components/hotel/list/hotelDetails.vue

@@ -38,7 +38,7 @@
           <a class="fz14 text-weight-bold text-blue q-ml-sm" :href="h.URL" target="_blank">{{ h.URL }}</a>
         </div>
       </div>
-      <div class="q-py-lg nowrap col" :class="{ row: $q.platform.is.desktop, column: $q.platform.is.mobile }">
+      <div class="q-py-lg no-wrap col" :class="{ row: $q.platform.is.desktop, column: $q.platform.is.mobile }">
         <div class="row rounded-borders relative-position" :class="{ 'col-6': $q.platform.is.desktop, 'height-320': $q.platform.is.mobile }" style="overflow: hidden" v-if="h.List">
           <div v-if="h.ChainBrand" class="f12 absolute-left bg-white" style="padding: 5px; bottom: unset; z-index: 1; border-bottom-right-radius: 4px">
             <div class="row items-center rounded-borders" style="overflow: hidden">

src/components/scattered/list/ListTable.vue

+<template>
+  <div class="full-height column hotel-list">
+    <q-table v-if="$q.platform.is.desktop" :loading="loading" :rows="hotels" :loading-label="$t('loading')" class="col sticky-header-column-table" flat :pagination="pages" :no-data-label="$t('noneData')" :columns="cols">
+      <template v-slot:top>
+        <div class="row full-width">
+          <div class="col"></div>
+          <q-btn class="hover q-mr-md" v-for="(item,index) in 2"
+          :class="{'bg-blue text-white':pages.sort==index+1,'bg-grey-3':pages.sort!=index+1}" @click="pages.sort=index+1,initHotels()">
+            {{index+1==1?$t('v101.scattered.anrenqi'):$t('v101.scattered.anjiage')}}
+          </q-btn>
+        </div>
+      </template>
+      <template v-slot:body-cell-hotelName="props">
+        <q-td class="cursor-pointer" :props="props" @click="goUrl('/scattered/hotelDetails',props.row)">
+          <span>{{props.row.hotelName}}</span>
+        </q-td>
+      </template>
+      <template v-slot:body-cell-reviewRating="props">
+        <q-td :props="props">
+          <div class="row no-wrap items-center">
+              <q-rating v-model="props.row.reviewRating" size="1.5em" color="orange" :max="props.row.reviewRating" readonly />
+            <span class="q-ml-xs" v-if="props.row.reviewRating>0">{{props.row.reviewRating}}</span>
+          </div>
+        </q-td>
+      </template>
+      <template v-slot:body-cell-lowrateBySetCurrency="props">
+        <q-td :props="props">
+          <span class="q-ml-xs text-orange text-weight-bold fz18" >
+            円
+            <template v-if="props.row.type==1">
+              {{getPrice(props.row.lowrateBySetCurrency)}}
+            </template>
+            <template v-else>
+              {{props.row.lowrateBySetCurrency}}
+            </template>
+          </span>
+          <span class="text-grey-8 q-pl-xs">{{$t('v101.scattered.qi')}}</span>
+        </q-td>
+      </template>
+      <template v-slot:body-cell-type="props">
+        <q-td :props="props">
+          <span class="q-ml-xs text-green-4 fz14" >
+            {{props.row.type==2?$t('v101.scattered.ziying'):$t('v101.scattered.jalan')}}
+          </span>
+        </q-td>
+      </template>
+      <template v-slot:body-cell-hotelFeaturesMask="props">
+        <q-td :props="props">
+          <span v-for="(subItem,index) in props.row.hotelFeaturesMask" :key="index">
+            <span class="rounded-borders bg-blue-1 text-blue q-mr-xs q-px-sm q-py-xs" v-if="subItem">
+              {{subItem==1?themeList[index].name:''}}
+          </span>
+          </span>
+        </q-td>
+      </template>
+      <template v-slot:bottom>
+        <q-pagination class="full-width justify-end" v-model="pages.displayFrom" color="primary" :max="pageCount" :input="true" @update:model-value="changePageHandler" />
+      </template>
+    </q-table>
+  </div>
+</template>
+
+<script lang="ts">
+import { useRouter } from 'vue-router'
+import HotelService from '../../../api/scattered'
+import { DirtionmaryHelper } from '../../../config/dictionary'
+import message from '../../../utils/message'
+import { defineComponent, inject, reactive, toRefs, watch } from 'vue'
+import { date,useQuasar } from 'quasar'
+import { useI18n } from 'vue-i18n'
+import { HotelArea, useHotel } from '../../../utils/hotelRate'
+export default defineComponent({
+  components: { },
+  name: 'list-table',
+  setup() {
+    const $q=useQuasar()
+    const { t } = useI18n()
+    const search = inject(DirtionmaryHelper.HOTEL_QUERY_PARAM) as any
+    const $router = useRouter()
+    watch(search, (n, o) => {
+      if (data.loading) return
+      search.displayFrom = 1
+      methods.initHotels()
+    })
+
+    const data = reactive({
+      groupBookingFlg: '' as any,
+      JapanIncrease: '' as any,
+      travelLngLat: [] as Array<any>,//地图坐标
+      themeList: [] as Array<HotelArea>,
+      hotels: [] as Array<any>,
+      loading: false,
+      cols: [
+        { name: 'hotelName', label: t('v101.scattered.titleHeard1'), align: 'left' },
+        { name: 'reviewRating', label: t('v101.scattered.titleHeard2'), field: (row: any) => (row.reviewRating), align: 'left' },
+        { name: 'lowrateBySetCurrency', label: t('v101.scattered.titleHeard3'), align: 'left' },
+        { name: 'type', label: t('v101.scattered.titleHeard4'), field: (row: any) => row.type==2?t('v101.scattered.ziying'):t('v101.scattered.jalan'), align: 'left' },
+        { name: 'hotelFeaturesMask', label: t('v101.scattered.titleHeard5'), align: 'left' },
+        { name: 'address', label: t('v101.scattered.titleHeard6'), field: (row: any) => (row.address), align: 'left' },
+      ] as any,
+      pages: {
+        displayFrom: 1,//页数
+        numberOfResults: 12,
+        rowsPerPage: 15,
+        sort: 1
+      },
+      pageCount: 0,
+      pageTitle: '' as (string | undefined),
+      mobileCols:[
+        
+      ],
+      showPriceList:false,
+      queryHotelObj:{},
+      orderSubmitObj:{} as any,
+      orderSubmitItemObj:{} as any,
+      showOrderPreview: false,
+      showHotelDetailId: 0,
+      
+    })
+    data.themeList = useHotel.getHotelTheme()
+    console.log(data.themeList,'-----')
+    data.pageTitle = inject(DirtionmaryHelper.PAGE_TITLE_KEY)
+
+
+    const methods = {
+      initHotels() {
+        data.loading = true
+        data.hotels = []
+        let dataList = [];
+        data.travelLngLat = [];
+        let param = Object.assign(data.pages, search)
+        HotelService.GetJAPANHotelList(param)
+          .then(r => {
+            if (r.data.data.parmResult && r.data.data.parmResult.hotelSummary) {
+                dataList = r.data.data.parmResult.hotelSummary;
+            }
+            var ourHotelList = r.data.data.ourHotelList;
+            if (ourHotelList && ourHotelList.length > 0) {
+                ourHotelList.forEach(x => {
+                    x.type = 2
+                })
+            }
+            if (dataList && dataList.length > 0) {
+                //获取酒店坐标
+                dataList.forEach(x => {
+                    x.reviewRating = parseFloat(x.reviewRating);
+                    x.lowrateBySetCurrency = parseFloat(x.lowrateBySetCurrency);
+                    let obj = {
+                        lat: x.latitudeW,
+                        lng: x.longitudeW,
+                        name: x.hotelName
+                    }
+                    data.travelLngLat.push(obj);
+                    x.type = 1
+                })
+            }
+            data.hotels = ourHotelList.concat(dataList);
+            data.hotels.forEach(x=>{
+                if(isNaN(x.reviewRating)){
+                    x.reviewRating=0
+                }
+                x.hotelFeaturesMask = x.hotelFeaturesMask.split(',')
+            })
+            //按价格升序
+            if(data.pages.sort==2){
+              data.hotels.sort(methods.getSortFun('asc', 'lowrateBySetCurrency'));    
+            }
+            //按照星级降序
+            if(data.pages.sort==1){
+              data.hotels.sort(methods.getSortFun('desc', 'reviewRating'));    
+            }
+            let jalanTotalCount = 0
+            if (r.data.data.parmResult && r.data.data.parmResult.numberOfResultMatched) {
+                jalanTotalCount = r.data.data.parmResult.numberOfResultMatched;
+            }
+
+            let ourHotelTotalCount = 0;
+            if (ourHotelList && ourHotelList.length > 0) {
+                ourHotelTotalCount = ourHotelList[0].totalHotelCount;
+            }
+            let totalCount = Number(jalanTotalCount) + Number(ourHotelTotalCount);
+            data.pageCount = r.data.data.parmResult.numberOfResultMatched
+            data.groupBookingFlg = r.data.data.parmResult.groupBookingFlg;
+            data.JapanIncrease = r.data.data.parmResult.JapanIncrease;
+            data.loading = false
+          })
+          .catch(e => {
+            data.loading = false
+          })
+      },
+      //数组排序
+      getSortFun(order, sortBy) {
+        var ordAlpah = (order == 'asc') ? '>' : '<';
+        var sortFun = new Function('a', 'b', 'return a.' + sortBy + ordAlpah + 'b.' + sortBy + '?1:-1');
+        return sortFun;
+      },
+      //获取价格
+      getPrice(price) {
+        return Math.ceil(price / data.JapanIncrease);
+      },
+      changePageHandler(n: any) {
+        data.pages.displayFrom = n
+        methods.initHotels()
+      },
+      showHotelDetailHandler(hotelId:number){
+        data.showHotelDetailId=hotelId
+      },
+      goUrl(url:string,row: {}){
+        url = `${url}/${row.hotelId}/${data.groupBookingFlg}/${row.type==1?methods.getPrice(row.lowrateBySetCurrency):row.lowrateBySetCurrency}`
+        window.open(url, '_blank')
+        // $router.push({ path:url })
+      },
+    }
+    methods.initHotels()
+    return { ...toRefs(data), ...methods }
+  }
+})
+</script>
+
+<style>
+
+</style>

src/i18n/zh-TW/index.ts

-import { HotelType } from './../../@types/index';
+import { HotelType, RoomType } from './../../@types/index';
 export default {
   //#region ending v1.0.0
   failed: '執行失敗',
@@ -653,7 +653,39 @@ export default {
       ruzhuTime: '入住時間',
       tuifangTime: '退房時間',
       timeTis: '退房時間必須大於當前時間',
-      prompt: '超過13歲視為成人處理'
+      prompt: '超過13歲視為成人處理',
+      HotelMeal1: '無餐',
+      HotelMeal2: '含早餐',
+      HotelMeal3: '含晚餐',
+      HotelMeal4: '包含早餐.晚餐',
+      RoomType1: '標準',
+      RoomType2: '普通',
+      RoomType3: '經濟',
+      RoomType4: '精品',
+      RoomType5: '豪華',
+      RoomType6: '套房',
+      HotelRoom1: '單人間',
+      HotelRoom2: '雙人間',
+      HotelRoom3: '大床房',
+      HotelRoom4: '三人間',
+      HotelRoom5: '四人間',
+      HotelRoom6: '日式房',
+      HotelRoom7: '日式+西式混合',
+      HotelRoom8: '大床房(小型)',
+      HotelRoom9: '未知房型',
+      jinyan: '禁煙',
+      kexiyan: '可吸煙',
+      wuyushi: '無浴室',
+      youyushi: '有浴室',
+      iscan1: '無餐',
+      iscan2: '含早晚餐',
+      iscan3: '含早餐',
+      iscan4: '含晚餐',
+      Time1: '入住時間',
+      Time2: '最遲入住時間',
+      Time3: '最遲退房時間',
+      renju: '人均',
+      yuyue: '預約',
     },
     
   }

src/pages/scattered/HotelList.vue

+<template>
+  <div class="fix-height-subpage column no-wrap q-pa-md">
+    <list-header></list-header>
+    <div class="col q-mt-md" :class="{'light-shadow q-pa-md bg-white rounded-border':$q.platform.is.desktop}">
+      <list-table></list-table>
+    </div>
+    <hotel-tips></hotel-tips>
+  </div>
+</template>
+
+<script lang="ts">
+import useMetaModule from '../../module/meta/metaModule'
+import { useI18n } from 'vue-i18n'
+import svgIcon from '../../components/global/svg-icon.vue'
+import { defineComponent, inject, provide, reactive, ref, toRefs } from 'vue'
+import { DirtionmaryHelper } from '../../config/dictionary'
+import ListHeader from '../../components/scattered/list/ListHeader.vue'
+import ListTable from '../../components/scattered/list/ListTable.vue'
+import HotelTips from '../../components/hotel/list/HotelTips.vue'
+import { date } from 'quasar'
+export default defineComponent({
+  components: { svgIcon, ListHeader, ListTable, HotelTips },
+  setup() {
+    const data = reactive({})
+    let { setTitle } = useMetaModule()
+    const { locale, t } = useI18n()
+    const pageTitle = inject(DirtionmaryHelper.PAGE_TITLE_KEY) as any
+    pageTitle.value = t('hotel.pageTitle')
+    setTitle(pageTitle.value)
+    const search = reactive({
+        arrivalDate: '',//开始日期
+        departureDate: '',//结束日期
+        searchroomGroup: [] as Array<ang>,//客房数
+        searchHotelIdList: [],
+        freeword: '',//地区名字 酒店名字
+        freewordType: 1, //类型 1，地区，2-酒店名称
+        reviewRatingUpperLimits: '',//最大评分数
+        reviewRatingLowerLimits: '',//最小评分数
+        searchHotelCategory: [], //酒店分类
+        searchHotelFeatures: [], //酒店特征
+        searchRoomType: [], //类型的房间
+        searchMealType: [], //饮食条件搜索	
+        searchMinRate: '', //最小金额
+        searchMaxRate: '', //最大金额
+    })
+
+    provide(DirtionmaryHelper.HOTEL_QUERY_PARAM, search)
+
+    const menu=inject(DirtionmaryHelper.MENU_KEYS) as any
+    menu.value=14
+    const methods = {}
+    return {
+      ...toRefs(data),
+      ...methods
+    }
+  }
+})
+</script>
+
+<style></style>

src/router/routes.ts

@@ -13,6 +13,7 @@ const routes: RouteRecordRaw[] = [
       { path: '/personal', component: () => import('pages/personal/personal.vue')},
       { path: '/scattered', component: () => import('pages/scattered/HotelList.vue')},
       { path: '/scattered/hotelDetails/:hotelId/:groupBookingFlg/:lowrateBySetCurrency', component: () => import('pages/scattered/hotelDetails.vue')},
+      { path: '/scattered/HotelSure/:hotelId/:roomOptionCd', component: () => import('pages/scattered/HotelSure.vue')},
       { path: '/comingsoon', component: () => import('pages/ComingSoon.vue')}
     ]
   },

src/utils/hotelRate.ts

@@ -6,6 +6,7 @@ interface HotelRate {
 interface HotelArea {
     name:string,
 }
+
 const {t} =i18n.global
 const useHotel={
     // 酒店星级
@@ -118,6 +119,30 @@ const useHotel={
         }
         return rates
     },
+    // 房间等级标准、豪华等
+    getHotelRoomType():HotelArea[]{
+        let rates=[] as HotelArea[]
+        for(let i=1;i<35;i++){
+            rates.push({name:t(`v101.scatteredDetails.RoomType${i}`)})
+        }
+        return rates
+    },
+    // 散客详情房型
+    getHotelScatRoom():HotelArea[]{
+        let rates=[] as HotelArea[]
+        for(let i=1;i<10;i++){
+            rates.push({name:t(`v101.scatteredDetails.HotelRoom${i}`)})
+        }
+        return rates
+    },
+    // 散客详情含餐
+    getHotelScatMeal():HotelArea[]{
+        let rates=[] as HotelArea[]
+        for(let i=1;i<10;i++){
+            rates.push({name:t(`v101.scatteredDetails.iscan${i}`)})
+        }
+        return rates
+    },
 }
 export {useHotel, 
     type HotelRate,