公司关键字检索回显，工作城市改为级联

src/views/recruit/personal/company/index.vue

@@ -3,9 +3,10 @@
     <buttons :current="2" style="position: sticky;"></buttons>
     <div class="company-content">
       <div class="white-bgc pb-3 pt-5">
-        <headSearch placeholder="搜索公司关键字" @handleSearch="val => handleSearch(val, 'name')"></headSearch>
+        <headSearch v-model="content" placeholder="搜索公司关键字" @handleSearch="val => handleSearch(val, 'name')"></headSearch>
         <div class="px-5 mt-3 clear-parent">
-          <areaType :isClear="clear" @handleClick="handleSearch"></areaType>
+          <!-- <areaType :isClear="clear" @handleClick="handleSearch"></areaType> -->
+          <cityCascadeSelect @inputChange="inputChange"></cityCascadeSelect>
           <scaleType class="mt-5" :isClear="clear" @clear="clear = false" @handleClick="handleSearch"></scaleType>
           <div class="clear" @click="handleClear">清空筛选条件</div>
         </div>
@@ -14,8 +15,8 @@
         <companyItem class="mt-3" :list="items"></companyItem>
         <MPagination
           :total="total"
-          :page="query.pageNo"
-          :limit="query.pageSize"
+          :page="pages.pageNo"
+          :limit="pages.pageSize"
           @handleChange="handleChangePage"
         ></MPagination>
       </div>
@@ -33,9 +34,11 @@ import { getEnterpriseSearch } from '@/api/enterprise'
 import { dealDictObjData } from '@/utils/position'
 import headSearch from '@/components/headSearch'
 import scaleType from './components/scaleType'
-import areaType from './components/areaType'
+// import areaType from './components/areaType'
 import companyItem from './components/companyItem'
 import MPagination from '@/components/CtPagination'
+import cityCascadeSelect from '@/views/recruit/personal/position/components/conditionFilter/cityCascadeSelect.vue'
+// F:\work\menduner\src\views\recruit\personal\position\components\conditionFilter\cityCascadeSelect.vue
 
 const route = useRoute()
 const router = useRouter()
@@ -43,14 +46,15 @@ const clear = ref(false)
 
 const total = ref(0)
 const items = ref([])
-const query = ref({
+const pages = ref({
   pageNo: 1,
   pageSize: 12
 })
+const query = ref({})
 
 const dealRouteQuery = (data) => {
   const arr = Object.keys(data).map(e => {
-    if (e !== 'pageSize' && e !== 'pageNo') {
+    if (data[e]) {
       return Array.isArray(data[e]) ? `${e}=${data[e].join()}` : `${e}=${data[e]}`
     }
   }).filter(Boolean)
@@ -59,29 +63,42 @@ const dealRouteQuery = (data) => {
   if (str) router.push(`${route.path}?${str}`)
 }
 
-const content = ref('')
+const content = ref(route.query.name || '')
 // 搜索
 const handleSearch = async (val, key) => {
   if (!val && key !== 'name') return
   if (key === 'name') content.value = val
-  query.value.pageNo = 1
-  // val为-1时选择的是不限或者全国， 此时选中的字段不传
-  if (!val || val === -1 || val[0] === -1) delete query.value[key]
-  else query.value[key] = val
+  pages.value.pageNo = 1
+  query.value[key] = val
+  dealRouteQuery(query.value)
+  await getCompanyData()
+}
+
+const inputChange = async({ idName: key, values }) => { // areaIds
+  if (!values?.length) {
+    values = null
+    delete query.value[key]
+  } else {
+    query.value[key] = values
+  }
+  pages.value.pageNo = 1
   dealRouteQuery(query.value)
   await getCompanyData()
 }
 
 const noParams = ref(true)
 const getCompanyData = async () => {
-  // 没有筛选条件不请求数据
-  if (Object.keys(query.value).length < 3) {
-    noParams.value = true
+  noParams.value = true
+  Object.keys(query.value).forEach(key => {
+    // 没有筛选条件不请求数据
+    if (query.value[key]) noParams.value = false
+  })
+  if (noParams.value === true) {
     items.value = []
     total.value = 0
     return
   }
-  const { list, total: number } = await getEnterpriseSearch(query.value)
+  const { list, total: number } = await getEnterpriseSearch({ ...query.value, ...pages.value })
   if (!list.length) {
     items.value = []
     total.value = 0
@@ -99,11 +116,10 @@ const handleClear = () => {
   clear.value = true
   query.value = {
     name: content.value,
-    pageNo: 1,
-    pageSize: 12
+    areaIds: query.value.areaIds
   }
-  if (content.value) {
-    router.push(`${route.path}?name=${content.value}`)
+  if (query.value.name || query.value.areaIds?.length) {
+    dealRouteQuery(query.value)
     getCompanyData()
   } else {
     router.push(route.path)
@@ -120,7 +136,7 @@ if (Object.keys(route.query).length) {
     else objData[e] = route.query[e]
   })
   if (Object.keys(objData).length) {
-    query.value.pageNo = 1
+    pages.value.pageNo = 1
     query.value = Object.assign(query.value, objData)
     getCompanyData()
   }
@@ -128,7 +144,7 @@ if (Object.keys(route.query).length) {
 
 // 分页
 const handleChangePage = (index) => {
-  query.value.pageNo = index
+  pages.value.pageNo = index
   getCompanyData()
 }
 </script>