重写筛选组件

src/main.js

@@ -1,51 +1,49 @@
-import { createApp } from 'vue'
-import App from './App.vue'
-import router from './router'
-import store from './store'
+import { createApp } from "vue"
+import App from "./App.vue"
+import router from "./router"
+import store from "./store"
 // import ElementPlus from 'element-plus'
 // import { ElButton, ElInput } from 'element-plus'
 
 import {
-  ElButton,
-  ElInput,
-  ElSelect,
-  ElOption,
-  ElLoading,
-  ElCheckbox,
-  ElCheckboxGroup,
-  ElCarousel,
-  ElCarouselItem,
-  ElBadge,
-  ElDropdown,
-  ElPopover,
-  ElDatePicker,
-  ElMessage,
-  ElSkeleton,
-  ElSkeletonItem,
-  ElBreadcrumb,
-  ElAffix,
-  ElConfigProvider,
-  ElProgress,
-  ElScrollbar
-  // 其他需要的组件
-} from 'element-plus'
+    ElButton,
+    ElInput,
+    ElSelect,
+    ElOption,
+    ElLoading,
+    ElCheckbox,
+    ElCheckboxGroup,
+    ElCarousel,
+    ElCarouselItem,
+    ElBadge,
+    ElDropdown,
+    ElPopover,
+    ElDatePicker,
+    ElMessage,
+    ElSkeleton,
+    ElSkeletonItem,
+    ElBreadcrumb,
+    ElAffix,
+    ElConfigProvider,
+    ElProgress,
+    ElScrollbar,
+    // 其他需要的组件
+} from "element-plus"
 
-import 'element-plus/theme-chalk/index.css'
-import 'element-plus/dist/index.css'
-import 'element-plus/theme-chalk/index.css'
-import locale from 'element-plus/lib/locale/lang/zh-cn';
+import "element-plus/theme-chalk/index.css"
+import "element-plus/dist/index.css"
+import "element-plus/theme-chalk/index.css"
+import locale from "element-plus/lib/locale/lang/zh-cn"
 
-import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
-
-import lazyPlugin from 'vue3-lazyload'
+import zhCn from "element-plus/dist/locale/zh-cn.mjs"
 
+import lazyPlugin from "vue3-lazyload"
 
 // import zhCn from 'element-plus/lib/locale/lang/zh-cn'
-import api from "./utils/api";
+import api from "./utils/api"
 
 //引入封装Axios请求
-import Axios from '@/utils/axios';
-
+import Axios from "@/utils/axios"
 
 const app = createApp(App)
 
@@ -62,7 +60,7 @@ app.use(ElBadge)
 app.use(ElDropdown)
 app.use(ElPopover)
 app.use(ElDatePicker, {
-  locale: zhCn
+    locale: zhCn,
 })
 app.use(ElSkeleton)
 app.use(ElSkeletonItem)
@@ -78,16 +76,46 @@ app.use(lazyPlugin)
 
 app.use(store).use(router).use(Axios)
 
-api.index().then(res => {
-  store.state.seachTypeData = res.data.combination
-  store.state.indexData = res.data
-  store.state.ListSelectBtn = res.data.recommendedTab
-  store.state.user = res.data.user
-  store.state.nav = res.data.nav
-  store.state.wechat = res.data.wechat
-  store.state.apartment = res.data.config.apartment
-  store.state.schoolList = res.data.schoolList
-  store.state.advData = res.data.adv
-}).finally(() => {
-  app.mount('#app')
-})
+api.index()
+    .then(res => {
+        store.state.seachTypeData = res.data.combination
+        store.state.indexData = res.data
+        store.state.ListSelectBtn = res.data.recommendedTab
+        store.state.user = res.data.user
+        store.state.nav = res.data.nav
+        store.state.wechat = res.data.wechat
+        store.state.apartment = res.data.config.apartment
+        store.state.schoolList = res.data.schoolList
+        store.state.advData = res.data.adv
+        store.state.typeKey = res.data.config.type
+
+        // 将 location 转换为对象 好用于级联选择器
+        const location = res.data.config.location || {}
+        const type = res.data.config.type || {}
+
+        store.state.locationObj = optimalValue(location)
+        store.state.typeObj = optimalValue(type)
+    })
+    .finally(() => {
+        app.mount("#app")
+    })
+
+// 优化值
+const optimalValue = data => {
+    let obj = {}
+    for (const key in data) {
+        const [parentKey, childKey] = key.split(".")
+
+        if (!childKey) {
+            obj[parentKey] = {
+                name: data[key],
+                children: {},
+            }
+        } else {
+            if (!obj[parentKey].children) obj[parentKey].children = {}
+            obj[parentKey].children[key] = data[key]
+        }
+    }
+
+    return obj || {}
+}