Browse Source

feat: 修改布局,修改特殊业态的读取方式在config

dev
张耀 3 years ago
parent
commit
4d38844d28
  1. 2
      .gitignore
  2. 9
      public/static/offline/JSON/config.json
  3. 39
      public/static/offline/JSON/getColumnList1.json
  4. 8
      src/components/SearchKeyboard/SearchKeyboard.vue
  5. 15
      src/composables/useGuideFilterShop.ts
  6. 4
      src/composables/useInitConfigAndMallInfo.ts
  7. 3
      src/http/api/parking/index.ts
  8. 4
      src/store/root/actions.ts
  9. 2
      src/store/root/state.ts
  10. 1
      src/types/config.d.ts
  11. 8
      src/types/parking.d.ts
  12. 66
      src/views/Guide/Guide.vue

2
.gitignore

@ -1,7 +1,7 @@
.DS_Store .DS_Store
node_modules node_modules
/dist /dist
*.zip
# local env files # local env files
.env.local .env.local

9
public/static/offline/JSON/config.json

@ -8,6 +8,13 @@
"mobileNav": "https://qianmu-iot.1000my.com/project-jiaxinglcpy-lcpy_react-test/index.html#/", "mobileNav": "https://qianmu-iot.1000my.com/project-jiaxinglcpy-lcpy_react-test/index.html#/",
"fileUrl": "https://test-598d.obs.cn-east-2.myhuaweicloud.com", "fileUrl": "https://test-598d.obs.cn-east-2.myhuaweicloud.com",
"backSocket": "ws://127.0.0.1:7181", "backSocket": "ws://127.0.0.1:7181",
"clickUploadUrl": "/analysis/v1/web/deviceUseClickDataUpload"
"clickUploadUrl": "/analysis/v1/web/deviceUseClickDataUpload",
"specialIndustries": [
"翔云苑",
"杏林苑",
"梅泾苑",
"香枫苑",
"栖凤苑"
]
} }
} }

39
public/static/offline/JSON/getColumnList1.json

@ -1 +1,38 @@
{"code":200,"msg":"操作成功","data":[{"name":"啊冷风机阿萨德浪费记录卡打撒飞机","nameEn":"","fileUrl":"/iotFile/project-odubitlp9mjy2wyuqkpfga/20230609/fCutkOWSsjkSaGJ1OwX38.jpg","shopCode":"mFOZv3PUAAWAj6EnxqnQs","shopName":"濮园一区 01幢","shopNameEn":"","houseNumber":"濮园一区 01幢","building":"濮园未来社区","floor":"L1","point":-1,"buildingCode":"gAi7ksmAnlR22G8CyLXbI","buildingOrder":0,"floorCode":"EuMWamqDI1Vd3v-oIYjY5","floorOrder":1},{"name":"222122","nameEn":"2212","fileUrl":"/iotFile/project-odubitlp9mjy2wyuqkpfga/20230609/wfkSeSVqHBHMuyvOl5pPh.jpg","shopCode":"","shopName":"","shopNameEn":"","houseNumber":"","building":"濮园未来社区","floor":"B1","point":83,"buildingCode":"gAi7ksmAnlR22G8CyLXbI","buildingOrder":0,"floorCode":"_hpC8JxxJI_glAFd56pUK","floorOrder":0}]}
{
"code": 200,
"msg": "操作成功",
"data": [
{
"name": "啊冷风机阿萨德浪费记录卡打撒飞机",
"nameEn": "",
"fileUrl": "/iotFile/project-odubitlp9mjy2wyuqkpfga/20230609/fCutkOWSsjkSaGJ1OwX38.jpg",
"shopCode": "mFOZv3PUAAWAj6EnxqnQs",
"shopName": "濮园一区 01幢",
"shopNameEn": "",
"houseNumber": "濮园一区 01幢",
"building": "濮园未来社区",
"floor": "L1",
"point": -1,
"buildingCode": "gAi7ksmAnlR22G8CyLXbI",
"buildingOrder": 0,
"floorCode": "EuMWamqDI1Vd3v-oIYjY5",
"floorOrder": 1
},
{
"name": "222122",
"nameEn": "2212",
"fileUrl": "/iotFile/project-odubitlp9mjy2wyuqkpfga/20230609/wfkSeSVqHBHMuyvOl5pPh.jpg",
"shopCode": "",
"shopName": "",
"shopNameEn": "",
"houseNumber": "",
"building": "濮园未来社区",
"floor": "B1",
"point": 83,
"buildingCode": "gAi7ksmAnlR22G8CyLXbI",
"buildingOrder": 0,
"floorCode": "_hpC8JxxJI_glAFd56pUK",
"floorOrder": 0
}
]
}

8
src/components/SearchKeyboard/SearchKeyboard.vue

@ -64,7 +64,7 @@
stroke-style="#D8B78A" stroke-style="#D8B78A"
fill-style="rgba(0, 0, 0, 0.03)" fill-style="rgba(0, 0, 0, 0.03)"
:width="700" :width="700"
:height="214"
:height="348"
@result="result" @result="result"
/> />
</div> </div>
@ -303,10 +303,10 @@ watch(wordsList, () => {
} }
.hand { .hand {
position: absolute; position: absolute;
top: 145px;
top: 81px;
left: 190px; left: 190px;
width: 700px; width: 700px;
height: 270px;
height: 348px;
padding-top: 0; padding-top: 0;
padding-left: 0; padding-left: 0;
background: #fff; background: #fff;
@ -417,7 +417,7 @@ watch(wordsList, () => {
} }
.hand-wrapper { .hand-wrapper {
width: 700px; width: 700px;
height: 270px;
height: 348px;
} }
} }
} }

15
src/composables/useGuideFilterShop.ts

@ -42,6 +42,19 @@ export const useGuideFilterShop = () => {
} }
}) })
} }
//根据特殊业态控制楼栋(店铺)信息
const specialIdx = ref(0)
function changeSpecial(params: any) {
if (specialIdx.value === params.order) {
return
}
specialIdx.value = params.order
if (specialIdx.value === 0) {
buildingShopList.value = shopListGroupByIndustry.value.slice().filter(item => specialIndustries.value.includes(item.name))
} else {
buildingShopList.value = shopListGroupByIndustry.value.filter(item => item.name === specialIndustries.value[specialIdx.value - 1])
}
}
return { floorIdx, selectedShopList, filterShopByFloorName, filterAboutCurrentInfo, buildingShopList }
return { specialIdx, changeSpecial, floorIdx, selectedShopList, filterShopByFloorName, filterAboutCurrentInfo, buildingShopList }
} }

4
src/composables/useInitConfigAndMallInfo.ts

@ -10,7 +10,9 @@ export const useInitConfigAndMallInfo = async () => {
const _config = await getConfig() const _config = await getConfig()
const store = useRootStore() const store = useRootStore()
store.SET_CONFIG(_config.data) store.SET_CONFIG(_config.data)
if (_config.data.specialIndustries) {
store.SET_SPECIAL_INDUSTRIES(_config.data.specialIndustries)
}
const [_DeviceInfo, _shopAndBuilding, _facilityList, _weather, _shopListByFloor, _shopListByIndustry, _brandInfo, _indexJson] = const [_DeviceInfo, _shopAndBuilding, _facilityList, _weather, _shopListByFloor, _shopListByIndustry, _brandInfo, _indexJson] =
await Promise.all([ await Promise.all([
getDeviceInfo(), getDeviceInfo(),

3
src/http/api/parking/index.ts

@ -6,4 +6,5 @@ export const getFindCar = (license: string) => request<CarInfo>({ url: `/ThirdPa
export const getThirdTraffic = (projectCode: string) => export const getThirdTraffic = (projectCode: string) =>
request<Traffic[]>({ url: `/guide/v1/web/thirdTraffic`, params: { projectCode }, method: 'get' }) request<Traffic[]>({ url: `/guide/v1/web/thirdTraffic`, params: { projectCode }, method: 'get' })
export const getParkingInfo = () => request<ParkingInfo>({ url: `/JSON/getParkingInfo.json` })
// ParkingInfo
export const getParkingInfo = () => request<any>({ url: `/JSON/getParkingInfo.json` })

4
src/store/root/actions.ts

@ -20,6 +20,7 @@ export interface Actions {
SET_SHOW_DETAIL(flag: boolean): void SET_SHOW_DETAIL(flag: boolean): void
SET_SHOW_SEARCH(flag: boolean): void SET_SHOW_SEARCH(flag: boolean): void
SET_HOT_SEARCH(list: HotSearch[]): void SET_HOT_SEARCH(list: HotSearch[]): void
SET_SPECIAL_INDUSTRIES(list: string[]): void
} }
export type GenActions = CreateActions<Root, State, Actions> export type GenActions = CreateActions<Root, State, Actions>
@ -72,5 +73,8 @@ export const actions: GenActions = {
}, },
SET_HOT_SEARCH(list) { SET_HOT_SEARCH(list) {
this.hotSearchList = list this.hotSearchList = list
},
SET_SPECIAL_INDUSTRIES(list) {
this.specialIndustries = list
} }
} }

2
src/store/root/state.ts

@ -35,5 +35,5 @@ export const state = (): State => ({
device: {} as Device, device: {} as Device,
shop: {} as Shop, shop: {} as Shop,
hotSearchList: [], hotSearchList: [],
specialIndustries: ['濮园一区', '濮园二区', '濮园三区', '濮园四区', '濮园五区']
specialIndustries: ['翔云苑', '杏林苑', '梅泾苑', '香枫苑', '栖凤苑'] //['濮园一区', '濮园二区', '濮园三区', '濮园四区', '濮园五区']
}) })

1
src/types/config.d.ts

@ -2,4 +2,5 @@ declare interface Config {
interfaceUrl: string interfaceUrl: string
sourceUrl: string sourceUrl: string
mobileNav: string mobileNav: string
specialIndustries?: string[]
} }

8
src/types/parking.d.ts

@ -1,8 +0,0 @@
declare interface ParkingInfo {
title: string
titleEn: string
content: string
contentEn: string
fileList: string[]
qrFileList: Array<{ name: string; nameEn: string; fileUrl: string }>
}

66
src/views/Guide/Guide.vue

@ -56,12 +56,26 @@
/> />
<!-- 线 --> <!-- 线 -->
<img class="line" src="@/assets/images/guide/line.svg" alt="" /> <img class="line" src="@/assets/images/guide/line.svg" alt="" />
<img class="line line2" src="@/assets/images/guide/line.svg" alt="" />
<!-- 店铺 --> <!-- 店铺 -->
<div class="bg"></div> <div class="bg"></div>
<TypeBtnList
v-if="!showShopList"
class="special-btn-group"
:list="[
{
title: '所有',
titleEn: 'All'
},
...specialList
]"
@change-type="changeSpecial"
/>
<scrollView <scrollView
v-if="showShopList" v-if="showShopList"
ref="shopScroll" ref="shopScroll"
class="shop-container-scroll animate__animated animate__fadeInUp"
class="shop-container-scroll not-special animate__animated animate__fadeInUp"
:pull-up="false" :pull-up="false"
:list="selectedShopList" :list="selectedShopList"
:scrollbar="true" :scrollbar="true"
@ -81,7 +95,7 @@
ref="buildingScroll" ref="buildingScroll"
class="shop-container-scroll animate__animated animate__fadeInUp" class="shop-container-scroll animate__animated animate__fadeInUp"
:pull-up="false" :pull-up="false"
:list="selectedShopList"
:list="buildingShopList"
:scrollbar="true" :scrollbar="true"
> >
<ul class="shop-items-wrapper"> <ul class="shop-items-wrapper">
@ -124,9 +138,10 @@ import { storeToRefs } from 'pinia'
import { useRootStore } from '@/store/root' import { useRootStore } from '@/store/root'
const store = useRootStore() const store = useRootStore()
const { language, facilityList, mapStatus, device } = storeToRefs(store)
const { specialIndustries, language, facilityList, mapStatus, device } = storeToRefs(store)
const { floorIdx, selectedShopList, filterShopByFloorName, filterAboutCurrentInfo, buildingShopList } = useGuideFilterShop() //
const { specialIdx, changeSpecial, floorIdx, selectedShopList, filterShopByFloorName, filterAboutCurrentInfo, buildingShopList } =
useGuideFilterShop() //
const { switchFloor, handleMapIcon, list, mapIdx } = useGuideMapOperation() // const { switchFloor, handleMapIcon, list, mapIdx } = useGuideMapOperation() //
const { handleFacility } = useFacilityNav() // const { handleFacility } = useFacilityNav() //
@ -189,6 +204,7 @@ function change(params: any) {
showHand.value = true showHand.value = true
} }
} else { } else {
specialIdx.value = 0
showShopList.value = false showShopList.value = false
if (buildingScroll?.value?._BScrollRef?.scrollerHeight > 719) { if (buildingScroll?.value?._BScrollRef?.scrollerHeight > 719) {
showHand.value = true showHand.value = true
@ -211,6 +227,13 @@ function getFacName(item: Facility) {
// ? switchLanguage(item, 'customFacilityName') // ? switchLanguage(item, 'customFacilityName')
// : switchLanguage(item, 'name') // : switchLanguage(item, 'name')
} }
//
const specialList = specialIndustries.value.map(item => {
return {
title: item,
titleEn: item
}
})
onMounted(() => { onMounted(() => {
if (mapStatus.value) { if (mapStatus.value) {
@ -282,6 +305,9 @@ watch(mapStatus, newValue => {
position: absolute; position: absolute;
top: 1228px; top: 1228px;
z-index: 1; z-index: 1;
&.line2 {
top: 1297px;
}
} }
.tip { .tip {
position: absolute; position: absolute;
@ -378,15 +404,43 @@ watch(mapStatus, newValue => {
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: contain; background-size: contain;
} }
.special-btn-group {
position: absolute;
top: 1243px;
left: 64px;
width: 952px;
:deep(.btn-item) {
h4 {
height: 58px;
padding-bottom: 14px;
font-size: 24px;
}
&.active {
h4 {
font-size: 24px;
}
&.btn-en {
h4 {
font-size: 15px;
}
}
}
}
}
.shop-container-scroll { .shop-container-scroll {
position: absolute; position: absolute;
top: 1231px;
top: 1329px;
left: 64px; left: 64px;
z-index: 1; z-index: 1;
overflow: hidden; overflow: hidden;
width: 974px; width: 974px;
height: 619px;
height: 591px;
padding-right: 29px; padding-right: 29px;
&.not-special {
top: 1231px;
height: 619px;
}
.shop-items-wrapper { .shop-items-wrapper {
padding-top: 30px; padding-top: 30px;
.shop-format-wrapper { .shop-format-wrapper {

Loading…
Cancel
Save