+
{{ $t('header.recommend') }}
@@ -23,9 +23,11 @@
diff --git a/src/components/PublicComponent/PublicComponent.vue b/src/components/PublicComponent/PublicComponent.vue
index a8e4468..7504728 100644
--- a/src/components/PublicComponent/PublicComponent.vue
+++ b/src/components/PublicComponent/PublicComponent.vue
@@ -1,12 +1,16 @@
+
+
+
+
@@ -22,16 +26,17 @@ import { useRootStore } from '@/store/root'
import { useRouter, useRoute } from 'vue-router'
import { useHandleScreen } from '@/composables/useHandleScreen'
import { useInitMap } from '@/composables/useInitMap'
+import { createShopListMap } from '@/utils/utils'
import Map from '@/components/Map/Map.vue'
import Header from '@/components/Header/Header.vue'
import Menu from '../Menu/Menu.vue'
import shopdetail from '@/components/ShopDetail/ShopDetail.vue'
const AutoBackNotification = defineAsyncComponent(() => import('@/base/AutoBackNotification/AutoBackNotification.vue'))
-
+const RecommendDialog = defineAsyncComponent(() => import('@/components/Recommend/Recommend.vue'))
const router = useRouter()
const route = useRoute()
const store = useRootStore()
-const { language, showSearch, showDetail } = storeToRefs(store)
+const { language, showSearch, showDetail, shopList, showColumnList } = storeToRefs(store)
const { checkHandleScreen, showCountDownDialog, title, toIndexTime, toWallpaperTime, isWallpaper } = useHandleScreen(handleScreen)
//指定时间返回首页时做的操作
@@ -50,6 +55,8 @@ function handleDetail() {
onMounted(() => {
!window.Map_QM && useInitMap()
window.addEventListener('touchend', checkHandleScreen)
+ // 生成店铺map映射
+ store.SET_SHOP_MAP(createShopListMap(shopList.value))
})
onBeforeUnmount(() => {
window.removeEventListener('touchend', checkHandleScreen)
diff --git a/src/components/Recommend/Recommend.vue b/src/components/Recommend/Recommend.vue
new file mode 100644
index 0000000..8129afb
--- /dev/null
+++ b/src/components/Recommend/Recommend.vue
@@ -0,0 +1,211 @@
+
+
+
+
+

+
+
+
+
+
餐饮推荐
+
/
+
DINING RECOMMENDATION
+
+
+
+
+
![]()
+
+
{{ switchLanguage(item, 'name') }}
+
+
{{ switchLanguage(item, 'shopName') }}
+
+
![]()
+
{{ item.houseNumber }}
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/composables/useArea.ts b/src/composables/useArea.ts
deleted file mode 100644
index cbc02d1..0000000
--- a/src/composables/useArea.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { ref, shallowRef, toRefs } from 'vue'
-import { useRootStore } from '@/store/root'
-import { hideMapDialog } from '@/composables/useInitMap'
-export const useArea = () => {
- const store = useRootStore()
- const { shopList, device } = toRefs(store)
-
- const areaName = ref('全部区域') //楼层选中索引
- const selectedShopListA = shallowRef(shopList.value.filter(item => item.floor === device.value.floor)) //选中楼层的店铺列表
-
- // 切换楼层
- function changeArea(name: string) {
- areaName.value = name
- selectedShopListA.value = shopList.value.filter(item => item.floor === name)
- hideMapDialog()
- }
-
- return { areaName, selectedShopListA, changeArea }
-}
diff --git a/src/composables/useGuideFilterShop.ts b/src/composables/useGuideFilterShop.ts
index 0f9c41a..14d433f 100644
--- a/src/composables/useGuideFilterShop.ts
+++ b/src/composables/useGuideFilterShop.ts
@@ -3,10 +3,11 @@ import { useRootStore } from '@/store/root'
import { hideMapDialog } from '@/composables/useInitMap'
export const useGuideFilterShop = () => {
const store = useRootStore()
- const { shopList, device } = toRefs(store)
+ const { shopList } = toRefs(store)
- const floorIdx = ref(device.value.floorOrder) //楼层选中索引
- const selectedShopList = shallowRef(shopList.value.filter(item => item.floor === device.value.floor)) //选中楼层的店铺列表
+ const areaName = ref('全部区域') //区域选中索引
+ const floorIdx = ref(6) //楼层选中索引
+ const selectedShopList = shallowRef([]) //选中楼层的店铺列表
// 切换楼层
function changeFloor(floorOrder: number) {
@@ -16,5 +17,16 @@ export const useGuideFilterShop = () => {
window.Map_QM.showFloor(floorOrder)
}
- return { floorIdx, selectedShopList, changeFloor }
+ // 切换区域
+ function changeArea(name: string) {
+ areaName.value = name
+ if (name === '全部区域') {
+ selectedShopList.value = shopList.value.filter(item => item.floorOrder === floorIdx.value)
+ } else {
+ selectedShopList.value = selectedShopList.value.filter(item => item.regionName === name)
+ }
+ hideMapDialog()
+ }
+
+ return { areaName, floorIdx, selectedShopList, changeFloor, changeArea }
}
diff --git a/src/composables/useGuideMapOperation.ts b/src/composables/useGuideMapOperation.ts
index bc5a5ca..fc40f16 100644
--- a/src/composables/useGuideMapOperation.ts
+++ b/src/composables/useGuideMapOperation.ts
@@ -1,14 +1,14 @@
import { onBeforeUnmount, ref, toRefs } from 'vue'
-import { useRootStore } from '@/store/root'
import { hideMapDialog } from '@/composables/useInitMap'
import { list, MapControl } from '@/views/Guide/list'
import type { Item } from '@/views/Guide/list'
+import { useRootStore } from '@/store/root'
-export const useGuideMapOperation = (callback?: () => void) => {
- const store = useRootStore()
- const { device } = toRefs(store)
+export const useGuideMapOperation = (callback: (index: number) => void) => {
const mapIdx = ref(-1)
const mapTimer = ref()
+ const store = useRootStore()
+ const { device } = toRefs(store)
//我的方向
function onClickMeDirect() {
@@ -32,8 +32,7 @@ export const useGuideMapOperation = (callback?: () => void) => {
switch (item.name) {
case MapControl.RESET:
- switchFloor(device.value.floorOrder)
- callback?.()
+ callback(6)
onClickDeviceSite()
mapTimer.value = setTimeout(() => {
mapIdx.value = -1
@@ -43,8 +42,7 @@ export const useGuideMapOperation = (callback?: () => void) => {
break
case MapControl.DIRECTION:
- switchFloor(device.value.floorOrder)
- callback?.()
+ callback(device.value.floorOrder)
onClickMeDirect()
break
diff --git a/src/composables/useInitConfigAndMallInfo.ts b/src/composables/useInitConfigAndMallInfo.ts
index e550733..c75bfdd 100644
--- a/src/composables/useInitConfigAndMallInfo.ts
+++ b/src/composables/useInitConfigAndMallInfo.ts
@@ -2,6 +2,7 @@ import { useRootStore } from '@/store/root'
import { getConfig, getFacilitiesList, getWeather } from '@/http/api/base'
import { getShopAndBuildingList } from '@/http/api/shop'
import { getDeviceInfo } from '@/http/api/building'
+import { getArtWorkList } from '@/http/api/art'
import { getShopListByFloor, getShopListByIndustry, getBrandInfo } from '@/http/api/brand'
import Message from '@/base/Message/Message'
@@ -11,15 +12,17 @@ export const useInitConfigAndMallInfo = async () => {
const store = useRootStore()
store.SET_CONFIG(_config.data)
- const [_DeviceInfo, _shopAndBuilding, _facilityList, _weather, _shopListByFloor, _shopListByIndustry, _brandInfo] = await Promise.all([
- getDeviceInfo(),
- getShopAndBuildingList(),
- getFacilitiesList(),
- getWeather(),
- getShopListByFloor(),
- getShopListByIndustry(),
- getBrandInfo()
- ])
+ const [_DeviceInfo, _shopAndBuilding, _facilityList, _weather, _shopListByFloor, _shopListByIndustry, _brandInfo, _artWorkList] =
+ await Promise.all([
+ getDeviceInfo(),
+ getShopAndBuildingList(),
+ getFacilitiesList(),
+ getWeather(),
+ getShopListByFloor(),
+ getShopListByIndustry(),
+ getBrandInfo(),
+ getArtWorkList()
+ ])
const { shopList, buildingList } = _shopAndBuilding.data
store.SET_DEVICE(_DeviceInfo.data)
@@ -30,6 +33,7 @@ export const useInitConfigAndMallInfo = async () => {
store.SET_SHOP_LIST_BY_INDUSTRY(_shopListByIndustry.data.list)
store.SET_FACILITY_LIST(_facilityList.data)
store.SET_WEATHER(_weather.data)
+ store.SET_ART_PLACE_LIST(_artWorkList.data)
} catch (error) {
Message({ text: '初始化数据失败', type: 'success' })
}
diff --git a/src/http/api/art/index.ts b/src/http/api/art/index.ts
new file mode 100644
index 0000000..10629a3
--- /dev/null
+++ b/src/http/api/art/index.ts
@@ -0,0 +1,8 @@
+import { request } from '@/http/http'
+import { PREFIX } from '@/enums'
+
+//获取艺术列表
+export const getArtList = () => request({ url: `${PREFIX.STATIC_URL}/JSON/getArtList.json` })
+
+// 获取艺术装置列表
+export const getArtWorkList = () => request({ url: `${PREFIX.STATIC_URL}/JSON/getArtWorkList.json` })
diff --git a/src/http/api/base/index.ts b/src/http/api/base/index.ts
index 275ad8e..8c9cb27 100644
--- a/src/http/api/base/index.ts
+++ b/src/http/api/base/index.ts
@@ -23,3 +23,9 @@ export const getHandWriting = (data: WrittenQuery) => request({ url: `
//获取区域
export const getRegionList = () => request({ url: `${PREFIX.STATIC_URL}/JSON/getRegionList.json` })
+
+// 获取楼层缩略图
+export const getFloorPicList = () => request({ url: `${PREFIX.STATIC_URL}/JSON/getFloorPicList.json` })
+
+// 获取区域缩略图
+export const getAreaPicList = () => request({ url: `${PREFIX.STATIC_URL}/JSON/getAreaPicList.json` })
diff --git a/src/http/api/menu/index.ts b/src/http/api/menu/index.ts
new file mode 100644
index 0000000..6862c0c
--- /dev/null
+++ b/src/http/api/menu/index.ts
@@ -0,0 +1,4 @@
+import { request } from '../../http'
+import { PREFIX } from '@/enums'
+// 菜单列表
+export const getMenuList = () => request({ url: `${PREFIX.STATIC_URL}/JSON/getHomeBtn.json` })
diff --git a/src/http/api/parking/index.ts b/src/http/api/parking/index.ts
index 24667ab..5524359 100644
--- a/src/http/api/parking/index.ts
+++ b/src/http/api/parking/index.ts
@@ -1,7 +1,8 @@
import { request } from '../../http'
import { getPrefixUrl } from '../../http'
+import { PREFIX } from '@/enums'
//找车
export const getFindCar = (license: string) =>
request({ url: `${getPrefixUrl().interfaceUrl}/ThirdPark/GetPlaceInfo?carCode=${license}` })
-export const getParkingInfo = () => request({ url: `/JSON/getParkingInfo.json` })
+export const getParkingInfo = () => request({ url: `${PREFIX.STATIC_URL}/JSON/getParkingInfo.json` })
diff --git a/src/http/api/place/index.ts b/src/http/api/place/index.ts
new file mode 100644
index 0000000..d5b9e48
--- /dev/null
+++ b/src/http/api/place/index.ts
@@ -0,0 +1,5 @@
+import { request } from '@/http/http'
+import { PREFIX } from '@/enums'
+
+//获取地图图示列表
+export const getPlaceList = () => request({ url: `${PREFIX.STATIC_URL}/JSON/getPlaceList.json` })
diff --git a/src/http/api/statistics/index.ts b/src/http/api/statistics/index.ts
index 9549820..99b43f2 100644
--- a/src/http/api/statistics/index.ts
+++ b/src/http/api/statistics/index.ts
@@ -1,7 +1,10 @@
import { request } from '../../http'
import type { Query, Clickquery } from './types'
+import { getPrefixUrl } from '@/http/http'
//数据统计
-export const getStatistics = (data: Query) => request({ url: `/analysis/v1/web/deviceUseClickDataUpload`, data, method: 'post' })
+export const getStatistics = (data: Query) =>
+ request({ url: `${getPrefixUrl().interfaceUrl}/analysis/v1/web/deviceUseClickDataUpload`, data, method: 'post' })
//数据统计(模块点击、活动点击、使用人次点击)
-export const getGuideClickDataUpload = (data: Clickquery) => request({ url: '/analysis/v1/web/guideClickDataUpload', data, method: 'post' })
+export const getGuideClickDataUpload = (data: Clickquery) =>
+ request({ url: `${getPrefixUrl().interfaceUrl}/analysis/v1/web/guideClickDataUpload`, data, method: 'post' })
diff --git a/src/main.ts b/src/main.ts
index cf7df74..ec42c80 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -5,6 +5,7 @@ import { setupI18n } from './i18n'
import { setupPinia } from './store'
import { setupErrorHandler } from './errorHandler'
import { setupPlugins } from './plugins'
+import { VueMasonryPlugin } from 'vue-masonry'
import { useInitConfigAndMallInfo } from './composables/useInitConfigAndMallInfo'
import '@/assets/scss/index.scss'
@@ -19,6 +20,7 @@ async function bootstrap() {
setupPlugins(app)
setupErrorHandler(app)
app.mount('#app')
+ app.use(VueMasonryPlugin)
}
bootstrap()
diff --git a/src/store/root/actions.ts b/src/store/root/actions.ts
index 4b528f3..f6e0c38 100644
--- a/src/store/root/actions.ts
+++ b/src/store/root/actions.ts
@@ -21,6 +21,8 @@ export interface Actions {
SET_SHOW_SEARCH(flag: boolean): void
SET_COLUMN_LIST(list: Featured[]): void
SET_SHOW_COLUMNLIST(flag: boolean): void
+ SET_SHOP_MAP(shopMap: ShopMap): void
+ SET_ART_PLACE_LIST(list: ArtPlace[]): void
}
export type GenActions = CreateActions
@@ -76,5 +78,11 @@ export const actions: GenActions = {
},
SET_SHOW_COLUMNLIST(flag) {
this.showColumnList = flag
+ },
+ SET_SHOP_MAP(shopMap) {
+ this.shopMap = shopMap
+ },
+ SET_ART_PLACE_LIST(list) {
+ this.artPlaceList = list
}
}
diff --git a/src/store/root/state.ts b/src/store/root/state.ts
index a59d63e..28fbcd1 100644
--- a/src/store/root/state.ts
+++ b/src/store/root/state.ts
@@ -17,6 +17,8 @@ export interface State {
shop: Shop //店铺信息
columnList: Featured[] //推荐页的卡片
showColumnList: boolean //是否显示专栏
+ shopMap: ShopMap // 店铺code与店铺信息集合
+ artPlaceList: ArtPlace[] // 艺术装置集合
}
export const state = (): State => ({
@@ -35,5 +37,7 @@ export const state = (): State => ({
device: {} as Device,
shop: {} as Shop,
columnList: [],
- showColumnList: false
+ showColumnList: false,
+ shopMap: {} as ShopMap,
+ artPlaceList: []
})
diff --git a/src/types/art.d.ts b/src/types/art.d.ts
new file mode 100644
index 0000000..baee5e7
--- /dev/null
+++ b/src/types/art.d.ts
@@ -0,0 +1,23 @@
+declare type Art = {
+ id: number
+ title: string
+ content: {
+ name: string
+ nameEn: string
+ point: string
+ }
+}
+
+declare type ArtPlace = {
+ id: number
+ title: string
+ content: {
+ name: string
+ nameEn: string
+ file_code: string[]
+ point: string
+ content: string
+ contentEn: string
+ icon: string[]
+ }
+}
diff --git a/src/types/building.d.ts b/src/types/building.d.ts
index 4b46d0f..3b3c937 100644
--- a/src/types/building.d.ts
+++ b/src/types/building.d.ts
@@ -12,3 +12,22 @@ declare interface Building {
buildingOrder: number
floorList: Floor[]
}
+
+declare interface FloorPic {
+ id: number
+ title: string
+ content: {
+ name: string
+ floorOrder: string
+ file_code: string[]
+ }
+}
+
+declare interface AreaPic {
+ id: number
+ title: string
+ content: {
+ name: string
+ file_code: string[]
+ }
+}
diff --git a/src/types/featured.d.ts b/src/types/featured.d.ts
index 4866a5c..4385dd3 100644
--- a/src/types/featured.d.ts
+++ b/src/types/featured.d.ts
@@ -7,3 +7,16 @@ declare interface Featured {
crossFileCode: string //横屏图片
verticalFileCode: string //竖屏图片
}
+
+declare interface FeaturedList {
+ nameEn: string
+ shopNameEn: string
+ point: number
+ floorOrder: number
+ floor: string
+ shopCode: stirng
+ shopName: string
+ name: string
+ houseNumber: string
+ fileUrl: string
+}
diff --git a/src/types/menu.d.ts b/src/types/menu.d.ts
new file mode 100644
index 0000000..62eb13b
--- /dev/null
+++ b/src/types/menu.d.ts
@@ -0,0 +1,7 @@
+declare interface MenuType {
+ id: number
+ moduleName: string
+ moduleNameEn: string
+ moduleLogo: string
+ routePath: string
+}
diff --git a/src/types/place.d.ts b/src/types/place.d.ts
new file mode 100644
index 0000000..f11272c
--- /dev/null
+++ b/src/types/place.d.ts
@@ -0,0 +1,10 @@
+declare type PlaceType = {
+ id: number
+ title: string
+ content: {
+ name: string
+ nameEn: string
+ backgroundColor: string
+ borderColor: string
+ }
+}
diff --git a/src/types/shop.d.ts b/src/types/shop.d.ts
index f8696d9..c49a261 100644
--- a/src/types/shop.d.ts
+++ b/src/types/shop.d.ts
@@ -44,3 +44,5 @@ declare interface Shop {
regionName?: string //区域名称
regionNameEn?: string //区域名称英文
}
+
+declare type ShopMap = Record
diff --git a/src/utils/utils.ts b/src/utils/utils.ts
index f8d2244..620b990 100644
--- a/src/utils/utils.ts
+++ b/src/utils/utils.ts
@@ -129,7 +129,7 @@ export const isInDuringDate = (startDate: string, endDate: string) => {
}
//图片地址加上前缀
-export const addPrefixByRecursive = (data: any[], prefix = PREFIX.STATIC_URL, exp = /\.(png|jpg|jpeg|JPG|PNG|MP4|mp4)$/) => {
+export const addPrefixByRecursive = (data: any[], prefix = PREFIX.STATIC_URL, exp = /\.(png|jpg|jpeg|JPG|PNG|MP4|mp4|svg)$/) => {
if (data && typeof data === 'object') {
for (const key in data) {
if (typeof data[key] === 'string' && exp.test(data[key])) {
@@ -142,3 +142,12 @@ export const addPrefixByRecursive = (data: any[], prefix = PREFIX.STATIC_URL, ex
}
return data
}
+
+// 生成店铺map
+export const createShopListMap = (shopList: Readonly) => {
+ const myMap: ShopMap = {}
+ shopList.forEach(item => {
+ myMap[item.shopCode] = item
+ })
+ return myMap
+}
diff --git a/src/views/Guide/Area.vue b/src/views/Guide/Area.vue
index 3874508..99a0623 100644
--- a/src/views/Guide/Area.vue
+++ b/src/views/Guide/Area.vue
@@ -2,28 +2,41 @@
-
{{ item }}
+
{{ switchLanguage(item, 'regionName') }}