Merge branch 'dev' of https://git.citupro.com/zhengnaiwen_citu/menduner into dev

src/components/Enterprise/components/positions.vue

@@ -12,10 +12,7 @@
       </div>
     </div>
     <div class="d-flex mt-3">
-      <areaType v-if="areaList.length" :list="areaList" @inputChange="val => handleSearch('areaIds', val)"></areaType>
-      <expType :isSingle="true" @inputChange="val => handleSearch('expType', val)"></expType>
-      <educationType :isSingle="true" @inputChange="val => handleSearch('eduType', val)"></educationType>
-      <payScope @input-change="val => handleSearch('payType', val)"></payScope>
+      <conditionFilter v-if="show" ref="conditionFilterRef" :showFilterList="showFilterList" @reset="handleReset" @change="handleQueryChange"></conditionFilter>
       <div style="width: 300px;">
         <v-text-field
           v-model="query.content"
@@ -79,7 +76,7 @@
 
 <script setup>
 defineOptions({ name: 'recruitment-positions'})
-import { reactive, ref, provide } from 'vue'
+import { reactive, ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { timesTampChange } from '@/utils/date'
 import { getDict } from '@/hooks/web/useDictionaries'
@@ -88,10 +85,7 @@ import { prologue, defaultText } from '@/hooks/web/useIM'
 import { getUserAvatar } from '@/utils/avatar'
 import { getJobAdvertisedPositionCount, getJobAreaByEnterpriseId, getJobAdvertisedSearch } from '@/api/position'
 import MPagination from '@/components/CtPagination'
-import expType from '@/views/recruit/personal/position/components/conditionFilter/expType.vue'
-import educationType from '@/views/recruit/personal/position/components/conditionFilter/educationType.vue'
-import payScope from '@/views/recruit/personal/position/components/conditionFilter/payScope.vue'
-import areaType from '@/views/recruit/personal/position/components/conditionFilter/areaType.vue'
+import conditionFilter from '@/views/recruit/personal/position/components/conditionFilter'
 
 const props = defineProps({
   info: {
@@ -107,9 +101,9 @@ const pageInfo = ref({
 })
 let query = reactive({})
 const route = useRoute(); const router = useRouter()
-const routeQuery = (route?.query && route.query && Object.keys(route?.query).length) ? route.query : null
-if (routeQuery?.content) query.content = routeQuery?.content
-provide('routeQuery', routeQuery)
+let routeQuery = (route?.query && route.query && Object.keys(route?.query).length) ? route.query : null
+if (routeQuery?.content) query.content = routeQuery?.content || ''
+// provide('routeQuery', routeQuery)
 if (routeQuery) query = routeQuery
 
 // 职位详情
@@ -125,12 +119,32 @@ const getDictData = async () => {
 }
 getDictData()
 
+const show = ref(false)
+const showFilterList = ref([
+  { key: 'expType', isSingle: false },
+  { key: 'eduType', isSingle: true },
+  { key: 'payType', isSingle: true },
+])
+const getProvideData = (list) => {
+  if (!list?.length) return
+  getDict('menduner_area_type', {}, 'areaList').then(({ data }) => {
+    data = data?.length && data || []
+    const arr = list.map(e => {
+      const obj = data.find(k => k.id === e.key)
+      if (!obj) return
+      return { label: obj.name, value: obj.id }
+    }).filter(Boolean)
+    if (arr?.length) showFilterList.value.unshift({ key: 'areaIds', isSingle: true, provideData: arr})
+    show.value = true
+  })
+}
+
 // 职位类别&工作地点
 const positionCategory = ref([])
-const areaList = ref([])
 const getData = async () => {
   const data = await getJobAdvertisedPositionCount({ enterpriseId: props.info.enterprise.id })
-  areaList.value = await getJobAreaByEnterpriseId({ enterpriseId: props.info.enterprise.id })
+  const areaList = await getJobAreaByEnterpriseId({ enterpriseId: props.info.enterprise.id })
+  getProvideData(areaList)
   const list = data.map(val => {
     const value = industryList.value.find(e => Number(e.id) === Number(val.key))
     if (!value) return
@@ -148,8 +162,6 @@ const getPoAr = async () => {
 }
 getPoAr()
 
-
-
 // 职位类别选中
 const handleClickCategory = (k) => {
   positionCategory.value.map(e => e.active = false)
@@ -169,9 +181,11 @@ const dealRouteQuery = () => {
   if (str) router.replace(`${route.path}?${str}`)
 }
 
-const handleSearch = (key, { values }) => {
-  if (values === -1 || !values || values[0] === -1 || !values.length) delete query[key]
-  else query[key] = values
+const handleSearch = (key, { values = [] }) => {
+  if (key) {
+    if (values === -1 || !values || values[0] === -1 || !values.length) delete query[key]
+    else query[key] = values
+  }
   dealRouteQuery()
   getPositionList(true)
 }
@@ -202,6 +216,22 @@ const handleChangePage = (index) => {
   getPositionList()
 }
 
+// 参数改变
+const handleQueryChange = (key, val) => { // val为字符串,数组的话用_下划线分隔
+  pageInfo.value.pageNo = 1
+  const values = val ? val.split('_') : []
+  handleSearch(key, { values })
+}
+
+// 清空筛选条件
+const handleReset = async () => {
+  pageInfo.value.pageNo = 1
+  showFilterList.value.forEach(e => {
+    delete query[e.key]
+  })
+  handleSearch(null, {})
+}
+
 // 城市、学历、工作经验
 const desc = [
   { mdi: 'mdi-map-marker-outline', value: 'areaName' },

src/views/recruit/enterprise/enterpriseCenter/components/introduction.vue

@@ -1,71 +0,0 @@
-<!-- 公司简介 -->
-<template>
-  <div>
-    <h4 class="mb-1">公司简介</h4>
-    <div v-if="props.info.enterprise?.introduce" class="requirement" v-html="props.info.enterprise?.introduce?.replace(/\n/g, '</br>')"></div>
-    <div v-else>暂无</div>
-    <v-divider class="my-3"></v-divider>
-    <h4>作息时间</h4>
-    <div>
-      <v-icon class="mr-2" size="25" color="primary">mdi-alarm</v-icon>
-      <span class="workAndRest">{{ props.info.enterprise?.time }}</span>
-      <v-icon class="mr-2 ml-4" size="25" color="primary">mdi-calendar-range</v-icon>
-      <span class="workAndRest">{{ props.info.enterprise?.restType }}</span>
-    </div>
-    <v-divider class="my-3"></v-divider>
-    <h4>企业福利</h4>
-    <div class="welfare-tags">
-      <v-chip size="small" label v-for="(k, i) in info.enterprise?.welfareList" :key="i" class="mb-2 welfare-tags-item ellipsis" color="primary">{{ k }}</v-chip>
-    </div>
-    <v-divider class="my-3"></v-divider>
-    <h4 class="mb-1">关于我们</h4>
-    <div v-if="props.info.enterprise?.aboutUs" class="requirement" v-html="props.info.enterprise?.aboutUs?.replace(/\n/g, '</br>')"></div>
-  </div>
-</template>
-
-<script setup>
-defineOptions({name: 'enterprise-enterpriseCenter-introduction'})
-
-const props = defineProps({
-  info: {
-    type: Object,
-    default: () => {}
-  }
-})
-</script>
-
-<style scoped lang="scss">
-h4 { margin-bottom: 8px; }
-.requirement {
-  white-space: pre-wrap;
-  word-break: break-all;
-  line-height: 28px;
-  color: var(--color-333);
-  font-size: 15px;
-  text-align: justify;
-  letter-spacing: 0;
-  // width: 60%;
-}
-.workAndRest {
-  color: var(--color-666);
-  font-size: 15px;
-}
-.welfare-tags {
-  display: flex;
-  // width: 242px;
-  flex-wrap: wrap;
-  // height: 100px;
-  // overflow: hidden;
-  text-align: center;
-}
-.welfare-tags-item {
-  display: block;
-  width: 117px;
-  max-width: 117px;
-  text-align: center;
-  line-height: 26px;
-  margin-right: 8px;
-  // &:nth-child(2n) { margin-right: 0; }
-}
-</style>
-

src/views/recruit/enterprise/enterpriseCenter/components/positions.vue

@@ -1,273 +0,0 @@
-<!-- 在招职位 -->
-<template>
-  <div class="top">
-    <div class="d-flex">
-      <div class="font-weight-bold position-category-left">职位类别：</div>
-      <div class="position-category-right">
-        <span 
-          :class="['category-item', {'default-active': k.active}, {'font-weight-bold': k.active}]" 
-          v-for="k in positionCategory" 
-          :key="k.id"
-          @click="handleClickCategory(k)"
-        >{{ k.id === -1 ? `${k.label}` : `${k.label} (${k.number})` }}</span>
-      </div>
-    </div>
-    <div class="d-flex mt-3">
-      <areaType v-if="areaList.length" :list="areaList" @inputChange="val => handleSearch('areaIds', val)"></areaType>
-      <expType :isSingle="true" @inputChange="val => handleSearch('expType', val)"></expType>
-      <educationType :isSingle="true" @inputChange="val => handleSearch('eduType', val)"></educationType>
-      <payScope @input-change="val => handleSearch('payType', val)"></payScope>
-      <div style="width: 300px;">
-        <v-text-field
-          v-model="query.content"
-          variant="outlined" 
-          label="查找职位关键字"
-          hide-details
-          color="primary"
-          append-inner-icon="mdi-magnify"
-          @click:append-inner="handleSearch('content', { values: query.content })"
-          @keyup.enter="handleSearch('content', { values: query.content })"
-        >
-        </v-text-field>
-      </div>
-    </div>
-  </div>
-  <v-divider class="mt-5"></v-divider>
-  <div class="bottom mt-4">
-    <div v-if="list.length">
-      <div 
-        v-for="(val, i) in list" 
-        :key="i" 
-        :class="['bottom-item', {'border-bottom-dashed': i !== list.length -1}, 'd-flex', 'justify-space-between', 'cursor-pointer']" 
-        @mouseenter="val.active = true"
-        @mouseleave="val.active = false"
-        @click="handlePosition(val)"
-      >
-        <div>
-          <p v-if="val.job.name.includes('style')" :class="['name', {'default-active': val.active }]" v-html="val.job.name"></p>
-          <p v-else :class="['name', {'default-active': val.active }]">{{ val.job.name }}</p>
-          <div style="line-height: 40px;">
-            <span v-for="k in desc" :key="k.mdi" class="mr-5">
-              <v-icon color="var(--color-666)" size="15">{{ k.mdi }}</v-icon>
-              <span class="ml-1 tag-text">{{ val.job[k.value] }}</span>
-            </span>
-          </div>
-        </div>
-        <div v-if="!val.active" class="text-right">
-          <p v-if="!val.job.payFrom && !val.job.payTo" class="salary">面议</p>
-          <p v-else class="salary">{{ val.job.payFrom ? val.job.payFrom + '-' : '' }}{{ val.job.payTo }}{{ val.job.payName ? '/' + val.job.payName : '' }}</p>
-          <div class="update-time">{{ timesTampChange(val.job.updateTime) }} 刷新</div>
-        </div>
-        <div v-else class="account-info">
-          <v-avatar :image="val.contact.avatar || 'https://minio.citupro.com/dev/menduner/7.png'"></v-avatar>
-          <span class="account-label">{{ val.contact.name }} · {{ val.contact.postNameCn }}</span>
-          <span>
-            <v-btn class="half-button" color="primary" size="small">立即沟通</v-btn>
-          </span>
-        </div>
-      </div>
-      <MPagination
-        :total="total"
-        :page="pageInfo.pageNo"
-        :limit="pageInfo.pageSize"
-        @handleChange="handleChangePage"
-      ></MPagination>
-    </div>
-    <Empty v-else :elevation="false"></Empty>
-  </div>
-</template>
-
-<script setup>
-defineOptions({name: 'enterprise-enterpriseCenter-positions'})
-import { reactive, ref, provide } from 'vue'
-import { useRoute, useRouter } from 'vue-router'
-import { timesTampChange } from '@/utils/date'
-import { getDict } from '@/hooks/web/useDictionaries'
-import { dealDictObjData } from '@/utils/position'
-import { getJobAdvertisedPositionCount, getJobAreaByEnterpriseId, getJobAdvertisedSearch } from '@/api/position'
-import MPagination from '@/components/CtPagination'
-import expType from '@/views/recruit/personal/position/components/conditionFilter/expType.vue'
-import educationType from '@/views/recruit/personal/position/components/conditionFilter/educationType.vue'
-import payScope from '@/views/recruit/personal/position/components/conditionFilter/payScope.vue'
-import areaType from '@/views/recruit/personal/position/components/conditionFilter/areaType.vue'
-
-const props = defineProps({
-  info: {
-    type: Object,
-    default: () => {}
-  }
-})
-
-const total = ref(0)
-const pageInfo = ref({
-  pageSize: 10,
-  pageNo: 1
-})
-let query = reactive({})
-const route = useRoute(); const router = useRouter()
-const routeQuery = (route?.query && route.query && Object.keys(route?.query).length) ? route.query : null
-if (routeQuery?.content) query.content = routeQuery?.content
-provide('routeQuery', routeQuery)
-if (routeQuery) query = routeQuery
-
-// 职位详情
-const handlePosition = (val) => {
-  window.open(`/recruit/personal/position/details/${val.job.positionId}`)
-}
-
-// 行业列表
-const industryList = ref([])
-const getDictData = async () => {
-  const { data } = await getDict('menduner_industry_type', {}, 'industryList')
-  industryList.value = data
-}
-getDictData()
-
-// 职位类别&工作地点
-const positionCategory = ref([])
-const areaList = ref([])
-const getData = async () => {
-  const data = await getJobAdvertisedPositionCount({ enterpriseId: props.info.enterprise.id })
-  areaList.value = await getJobAreaByEnterpriseId({ enterpriseId: props.info.enterprise.id })
-  const list = data.map(val => {
-    const value = industryList.value.find(e => Number(e.id) === Number(val.key))
-    return { id: value.id, label: value.nameCn, number: val.value, active: false }
-  })
-  positionCategory.value = [{ id: -1, label: '全部', active: true }, ...list]
-}
-const getPoAr = async () => {
-  await getData()
-  // 职位类别回显
-  if (routeQuery?.positionId) {
-    positionCategory.value.map(e => e.active = false)
-    positionCategory.value.find(e => e.id === routeQuery.positionId).active = true
-  }
-}
-getPoAr()
-
-
-
-// 职位类别选中
-const handleClickCategory = (k) => {
-  positionCategory.value.map(e => e.active = false)
-  k.active = !k.active
-  handleSearch('positionId', { values: k.id })
-}
-
-const dealRouteQuery = () => {
-  const arr = Object.keys(query).map(e => {
-    if (Array.isArray(query[e]) && !query[e].length) {
-      delete query[e]
-    }
-    if (!query[e]) delete query[e]
-    if (e !== 'pageSize' && e !== 'pageNo' && e !== 'enterpriseId') return `${e}=${query[e]}`
-  }).filter(Boolean)
-  const str = ['key=recruitmentPositions', ...arr].join('&')
-  if (str) router.replace(`${route.path}?${str}`)
-}
-
-const handleSearch = (key, { values }) => {
-  if (values === -1 || !values || values[0] === -1 || !values.length) delete query[key]
-  else query[key] = values
-  dealRouteQuery()
-  getPositionList(true)
-}
-
-// 职位列表
-const list = ref([])
-// 职位列表
-const getPositionList = async (isSearch) => {
-  query = {
-    ...query,
-    ...pageInfo.value,
-    enterpriseId: props.info.enterprise.id
-  }
-  delete query.key
-  if (isSearch) query.pageNo = 1
-  const { list: arr, total: number } = await getJobAdvertisedSearch(query)
-  total.value = number
-  list.value = arr.map(e => {
-    e.active = false
-    e.job = { ...e.job, ...dealDictObjData({}, e.job) }
-    return e
-  })
-}
-getPositionList()
-
-const handleChangePage = (index) => {
-  pageInfo.value.pageNo = index
-  getPositionList()
-}
-
-// 城市、学历、工作经验
-const desc = [
-  { mdi: 'mdi-map-marker-outline', value: 'areaName' },
-  { mdi: 'mdi-school-outline', value: 'eduName' },
-  { mdi: 'mdi-clock-time-ten-outline', value: 'expName' }
-]
-</script>
-
-<style scoped lang="scss">
-.bottom-item {
-  width: 100%;
-  height: 68px;
-  margin-bottom: 12px;
-}
-.name {
-  position: relative;
-  max-width: 200px;
-  margin-right: 8px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  font-weight: 600;
-}
-.salary {
-  font-size: 16px;
-  font-weight: 700;
-  color: var(--v-error-base);
-  line-height: 22px;
-  flex: none;
-}
-.tag-text {
-  color: var(--color-222);
-  font-size: 14px;
-}
-.update-time {
-  color: var(--color-666);
-  font-size: 14px;
-  line-height: 40px;
-}
-.account-info {
-  line-height: 52px;
-  .account-label {
-    color: var(--color-666);
-    font-size: 14px;
-    font-weight: 600;
-    margin: 0 10px;
-  }
-}
-.position-category-left {
-  width: 80px;
-}
-.position-category-right {
-  flex: 1;
-}
-.category-item {
-  display: inline-block;
-  margin-right: 20px;
-  font-size: 15px;
-  color: var(--color-666);
-  cursor: pointer;
-  &:hover {
-    color: var(--v-primary-base);
-  }
-}
-:deep(.v-field__input) {
-  height: 28px;
-  padding: 0 0 0 10px;
-  font-size: 12px;
-  min-height: 28px;
-}
-</style>
-

src/views/recruit/enterprise/enterpriseCenter/components/video.vue

@@ -1,40 +0,0 @@
-<!-- 企业视频 -->
-<template>
-  <div class="box">
-    <div class="box-item" v-for="(val, i) in props.info.enterprise?.albumList" :key="val">
-      <v-img v-if="checkIsImage(val)" width="205" height="115" :src="val" cover rounded @click="handleClick(i)"></v-img>
-      <video v-else class="videos-radius" :src="val" controls height="118" width="200" preload="preload" @click="handleClick(i)"></video>
-    </div>
-  </div>
-  <PreviewImg v-if="showPreview" :current="current" :list="props.info.enterprise?.albumList" @close="showPreview = !showPreview"></PreviewImg>
-</template>
-
-<script setup>
-import { checkIsImage } from '@/utils'
-import { ref } from 'vue'
-defineOptions({name: 'enterprise-enterpriseCenter-video'})
-
-const props = defineProps({
-  info: {
-    type: Object,
-    default: () => {}
-  }
-})
-
-// 预览
-const showPreview = ref(false)
-const current = ref(0)
-const handleClick = (index) => {
-  showPreview.value = !showPreview.value
-  current.value = index
-}
-</script>
-<style lang="scss" scoped>
-.box {
-  display: flex;
-  flex-wrap: wrap;
-  .box-item {
-    margin: 0 12px 12px 0;
-  }
-}
-</style>

src/views/recruit/personal/position/components/conditionFilter.vue

@@ -8,6 +8,7 @@
           :title="item.title"
           :isSingle="item.isSingle"
           :dictName="item.dictShow"
+          :provideData="item.provideData || []"
           :info="item"
           @inputChange="inputChange"
         ></component>
@@ -15,12 +16,12 @@
     </div>
     <div v-if="showSelectList?.length">
       <div style="margin-top: 20px; border-top: 1px solid #eee;">
-        <div v-for="item in showSelectList" :key="item.key" style="margin: 8px 8px 8px 0px;">
+        <div v-for="item in showSelectList" :key="item.key" style="margin: 4px 8px 4px 0px;">
           <template v-if="item.checkedItems?.length">
             <span style="color: #999;">{{ item.title }}：</span>
             <v-btn
               v-for="(val, index) in item.checkedItems" :key="item.key + index"
-              class="mr-3 py-0 px-2"
+              class="mr-3 my-1 py-0 px-2"
               density="comfortable"
               color="primary" variant="tonal"
               v-bind="props"
@@ -31,7 +32,9 @@
           </template>
         </div>
       </div>
-      <div class="clearFilterCriteria" @click="emits('reset')">{{ $t('common.clearFilterCriteria') }}</div>
+      <div style="text-align: right;">
+        <span class="clearFilterCriteria" @click="emits('reset')">{{ $t('common.clearFilterCriteria') }}</span>
+      </div>
     </div>
   </div>
 </template>
@@ -44,13 +47,13 @@ const emits = defineEmits(['change', 'reset'])
 const props = defineProps({
   showFilterList: { // 职位检索
     type: [Array, String],
-    default: 'all'
+    default: ''
   },
 })
-const list = shallowRef(props.showFilterList === 'all' ? filterList : props.showFilterList.map(e => {
+const list = shallowRef(props.showFilterList === 'all' ? filterList : props.showFilterList?.length? props.showFilterList.map(e => {
   const item = filterList.find(i => i.key === e.key)
   return item ? { ...item, ...e } : ''
-}).filter(Boolean))
+}).filter(Boolean) : [])
 
 const inputChange = ({ idName: key, values }) => {
   const str = values.length ? values.join('_') : ''
@@ -63,7 +66,7 @@ const deleteChip = (item, val) => { // 删除某个标签-更新路由 val结构
     if (e.value !== val.value) newArr.push(e.value)
     return newArr
   }, []) || []
-  inputChange({ idName: item.key, values: ids, isDel: true })
+  inputChange({ idName: item.key, values: ids })
 }
 
 const showSelectList = ref([])
@@ -112,7 +115,6 @@ watch(
   font-size: 14px;
   margin-top: 4px;
   color: var(--color-999);
-  text-align: right;
   &:hover {
     color: var(--v-primary-base);
   }

src/views/recruit/personal/position/components/conditionFilter/JobType.vue

@@ -1,65 +0,0 @@
-<template>
-  <commonStyle :btnTitle="title" :close-on-content-click="false" v-if="show">
-    <v-list>
-      <v-list-item
-        v-for="item in items" :key="item.id" :value="item.value"
-        :active="selectedItems.includes(item.value)"
-        color="primary"
-        @click="handle(item.value)"
-      >
-        <template v-if="selectedItems.includes(item.value)" v-slot:append>
-          <v-icon icon="mdi-check"></v-icon>
-        </template>
-        <v-list-item-title>{{ item.label }}</v-list-item-title>
-      </v-list-item>
-    </v-list>
-  </commonStyle>
-</template>
-<script setup>
-import commonStyle from './commonStyle.vue'
-import { getDict } from '@/hooks/web/useDictionaries'
-import { ref, inject } from 'vue';
-
-defineOptions({name: 'conditionFilter-JobType'})
-const emits = defineEmits(['inputChange'])
-const query = inject('routeQuery')
-const props = defineProps({
-  positionIndexPage: { // 职位检索
-    type: Boolean,
-    default: false
-  }
-})
-
-const title = ref('求职类型')
-let show = ref(false)
-let items = ref()
-const selectedItems = ref([])
-
-getDict('menduner_job_type').then(({ data }) => {
-  data = data?.length && data || []
-  items.value = data
-  // 刷新回显
-  if (query && query.jobType) {
-    const str = query.jobType.split(',')[0]
-    const arr = str.split('_')
-    if (arr?.length) {
-      selectedItems.value = arr
-      title.value = selectedItems.value.length ? `求职类型(${selectedItems.value.length})` : '求职类型'
-      if (!props.positionIndexPage) emits('inputChange', { values: selectedItems.value, isEmit: true })
-    }
-  }
-  show.value = true
-})
-const handle = (val) => {
-  if (selectedItems.value.includes(val)) {
-    selectedItems.value = selectedItems.value.filter(i => i !== val)
-  } else {
-    selectedItems.value.push(val)
-  }
-  title.value = selectedItems.value.length ? `求职类型(${selectedItems.value.length})` : '求职类型'
-  if (props.positionIndexPage) emits('inputChange', selectedItems.value)
-  else emits('inputChange', { values: selectedItems.value, isEmit: true })
-}
-</script>
-<style lang="scss" scoped>
-</style>

src/views/recruit/personal/position/components/conditionFilter/areaType.vue

@@ -1,62 +0,0 @@
-<template>
-  <commonStyle :btnTitle="title" v-if="show">
-    <v-list :items="items">
-      <v-list-item
-        color="primary"
-        :active="selectedItems.includes(item.id)"
-        v-for="item in items" :key="item.id" :value="item.id"
-        @click="handle(item)"
-      > 
-        <template v-if="selectedItems.includes(item.id)" v-slot:append>
-          <v-icon icon="mdi-check"></v-icon>
-        </template>
-        <v-list-item-title>{{ item.label }}</v-list-item-title>
-      </v-list-item>
-    </v-list>
-  </commonStyle>
-</template>
-
-<script setup>
-import commonStyle from './commonStyle.vue'
-import { getDict } from '@/hooks/web/useDictionaries'
-import { ref, inject } from 'vue';
-
-defineOptions({name: 'conditionFilter-area-type'})
-const emits = defineEmits(['inputChange'])
-const props = defineProps({
-  list: Array
-})
-
-const show = ref(false)
-const query = inject('routeQuery')
-const title = ref('工作地点')
-let items = ref()
-let selectedItems = ref([])
-getDict('menduner_area_type', {}, 'areaList').then(({ data }) => {
-  data = data?.length && data || []
-  const arr = props.list.map(e => {
-    const obj = data.find(k => k.id === e.key)
-    if (!obj) return
-    const { id, parentId, type, name: label } = obj
-    return { id, label, number: e.value, parentId, type }
-  }).filter(Boolean)
-  items.value = [{ id: -1, label: '全部' }, ...arr]
-  show.value = true
-})
-
-if (query && query?.areaIds) {
-    title.value = '工作地点(1)'
-    selectedItems.value = [query.areaIds]
-    emits('inputChange', { values: selectedItems.value })
-  }
-
-const handle = (val) => {
-  const obj = selectedItems.value.includes(val.id)
-  title.value = obj ? '工作地点' : (val.id === -1 ? '工作地点' : '工作地点(1)')
-  selectedItems.value = obj ? [] : [val.id]
-  emits('inputChange', { values: selectedItems.value })
-}
-</script>
-
-<style lang="scss" scoped>
-</style>

src/views/recruit/personal/position/components/conditionFilter/commonPath.vue

@@ -46,6 +46,10 @@ const props = defineProps({
     type: [String, Number],
     default: ''
   },
+  provideData: {
+    type: Array,
+    default: () => []
+  },
   title: {
     type: String,
     default: '类型名称'
@@ -82,6 +86,10 @@ const handle = (value) => {
 
 // 字典
 if (props.dictName === 1) show.value = true // 插槽使用
+else if (props.provideData?.length) { // 自定义下拉数据
+  items.value = props.provideData
+  show.value = true
+}
 else if (props.dictName) {
   getDict(props.dictName).then(({ data }) => {
     data = data?.length && data || []

src/views/recruit/personal/position/components/conditionFilter/companyIndustry.vue

@@ -1,42 +0,0 @@
-<template>
-  <commonStyle :btnTitle="title" :close-on-content-click="false">
-    <industryTypeCard :select="selectedItems" @handleClickIndustry="handle"></industryTypeCard>
-  </commonStyle>
-</template>
-
-<script setup>
-import commonStyle from './commonStyle.vue'
-import industryTypeCard from '@/components/industryTypeCard'
-import { inject, ref } from 'vue'
-defineOptions({name: 'conditionFilter-company-industry'})
-const emits = defineEmits(['inputChange'])
-const query = inject('routeQuery')
-const props = defineProps({
-  positionIndexPage: { // 职位检索
-    type: Boolean,
-    default: false
-  }
-})
-
-const title = ref('行业类型')
-const selectedItems = ref([])
-
-if (query && query.industryIds) {
-  const str = query.industryIds.split(',')[0]
-  const arr = str.split('_')
-  if (arr?.length) {
-    selectedItems.value = arr
-    title.value = selectedItems.value.length ? `行业类型(${selectedItems.value.length})` : '行业类型'
-  }
-}
-
-const handle = (arr) => {
-  selectedItems.value = arr
-  title.value = selectedItems.value.length ? `行业类型(${selectedItems.value.length})` : '行业类型'
-  if (props.positionIndexPage) emits('inputChange', selectedItems.value)
-  else emits('inputChange', { values: selectedItems.value, isEmit: true })
-}
-</script>
-
-<style lang="scss" scoped>
-</style>

src/views/recruit/personal/position/components/conditionFilter/educationType.vue

@@ -1,73 +0,0 @@
-<template>
-  <commonStyle v-if="show" :btnTitle="title" :closeOnContentClick="props.isSingle">
-    <v-list>
-      <v-list-item
-        color="primary"
-        :active="selectedItems.includes(item.value)"
-        v-for="item in items" :key="item.id" :value="item.value"
-        @click="handle(item.value)"
-      >
-        <template v-if="selectedItems.includes(item.value)" v-slot:append>
-          <v-icon icon="mdi-check"></v-icon>
-        </template>
-        <v-list-item-title>{{ item.label }}</v-list-item-title>
-      </v-list-item>
-    </v-list>
-  </commonStyle>
-</template>
-<script setup>
-import commonStyle from './commonStyle.vue'
-import { getDict } from '@/hooks/web/useDictionaries'
-import { ref, inject } from 'vue';
-defineOptions({name: 'conditionFilter-educationType'})
-const emits = defineEmits(['inputChange'])
-const query = inject('routeQuery')
-
-const props = defineProps({
-  isSingle: {
-    type: Boolean,
-    default: false
-  },
-  positionIndexPage: { // 职位检索
-    type: Boolean,
-    default: false
-  }
-})
-
-const title = ref('学历要求')
-const show = ref(false)
-let items = ref()
-const selectedItems = ref([])
-
-getDict('menduner_education_type').then(({ data }) => {
-  data = data?.length && data || []
-  items.value = data
-  if (query && query.eduType) {
-    const str = query.eduType.split(',')[0]
-    const arr = str.split('_')
-    if (arr?.length) {
-      selectedItems.value = arr
-      title.value = selectedItems.value.length ? `学历要求(${selectedItems.value.length})` : '学历要求'
-      if (!props.positionIndexPage) emits('inputChange', { values: selectedItems.value, isEmit: true })
-    }
-  }
-  show.value = true
-})
-const handle = (val) => {
-  const obj = selectedItems.value.find(e => e === val)
-  if (props.isSingle) {
-    // 单选
-    selectedItems.value = obj ? [] : [val]
-  } else {
-    // 多选 
-    if (obj) {
-      selectedItems.value = selectedItems.value.filter(i => i !== val)
-    } else selectedItems.value.push(val)
-  }
-  title.value = selectedItems.value.length ? `学历要求(${selectedItems.value.length})` : '学历要求'
-  if (props.positionIndexPage) emits('inputChange', selectedItems.value)
-  else emits('inputChange', { values: selectedItems.value, isEmit: true })
-}
-</script>
-<style lang="scss" scoped>
-</style>

src/views/recruit/personal/position/components/conditionFilter/expType.vue

@@ -1,80 +0,0 @@
-<template>
-  <commonStyle v-if="show" :btnTitle="title" :closeOnContentClick="props.isSingle">
-    <v-list>
-      <v-list-item
-        color="primary"
-        :active="selectedItems.includes(item.value)"
-        v-for="item in items" :key="item.id" :value="item.value"
-        @click="handle(item.value)"
-      >
-        <template v-if="selectedItems.includes(item.value)" v-slot:append>
-          <v-icon icon="mdi-check"></v-icon>
-        </template>
-        <v-list-item-title>{{ item.label }}</v-list-item-title>
-      </v-list-item>
-    </v-list>
-  </commonStyle>
-</template>
-<script setup>
-import commonStyle from './commonStyle.vue'
-import { getDict } from '@/hooks/web/useDictionaries'
-import { ref, inject } from 'vue';
-
-defineOptions({name: 'conditionFilter-expType'})
-const emits = defineEmits(['inputChange'])
-const query = inject('routeQuery')
-const props = defineProps({
-  isSingle: {
-    type: Boolean,
-    default: false
-  },
-  positionIndexPage: { // 职位检索
-    type: Boolean,
-    default: false
-  }
-})
-const title = ref('工作经验')
-const show = ref(false)
-let items = ref()
-const selectedItems = ref([])
-
-getDict('menduner_exp_type').then(({ data }) => {
-  data = data?.length && data || []
-  items.value = data
-  if (query && query.expType) {
-    const str = query.expType.split(',')[0]
-    const arr = str.split('_')
-    if (arr?.length) {
-      selectedItems.value = arr
-      title.value = selectedItems.value.length ? `工作经验(${selectedItems.value.length})` : '工作经验'
-      if (!props.positionIndexPage) emits('inputChange', { values: selectedItems.value, isEmit: true })
-    }
-  }
-  show.value = true
-})
-const handle = (val) => {
-  const obj = selectedItems.value.find(e => e === val)
-  if (props.isSingle) {
-    // 单选
-    selectedItems.value = obj ? [] : [val]
-  } else {
-    // 多选 
-    if (obj) {
-      // 已存在的再次选中就取消掉
-      selectedItems.value = selectedItems.value.filter(i => i !== val)
-    } else {
-      // 不存在
-      if (val === '2') selectedItems.value = [val] // 选中经验不限时清空其它选中项
-      else selectedItems.value.push(val)
-      // 当经验不限已存在时还选中其它项，把经验不限给清掉
-      if (val !== '2' && selectedItems.value.find(k => k === '2')) selectedItems.value = selectedItems.value.filter(i => i !== '2')
-    }
-  }
-  title.value = selectedItems.value.length ? `工作经验(${selectedItems.value.length})` : '工作经验'
-  if (props.positionIndexPage) emits('inputChange', selectedItems.value)
-  else emits('inputChange', { values: selectedItems.value, isEmit: true })
-}
-</script>
-
-<style lang="scss" scoped>
-</style>

src/views/recruit/personal/position/components/conditionFilter/financingStatus.vue

@@ -1,63 +0,0 @@
-<template>
-  <commonStyle v-if="show" :btnTitle="title" :close-on-content-click="false">
-    <v-list>
-      <v-list-item
-        color="primary"
-        :active="selectedItems.includes(item.value)"
-        v-for="item in items" :key="item.id" :value="item.value"
-        @click="handle(item.value)"
-      >
-        <template v-if="selectedItems.includes(item.value)" v-slot:append>
-          <v-icon icon="mdi-check"></v-icon>
-        </template>
-        <v-list-item-title>{{ item.label }}</v-list-item-title>
-      </v-list-item>
-    </v-list>
-  </commonStyle>
-</template>
-<script setup>
-import commonStyle from './commonStyle.vue'
-import { getDict } from '@/hooks/web/useDictionaries'
-import { ref, inject } from 'vue';
-defineOptions({name: 'conditionFilter-financingStatus'})
-const emits = defineEmits(['inputChange'])
-const query = inject('routeQuery')
-const props = defineProps({
-  positionIndexPage: { // 职位检索
-    type: Boolean,
-    default: false
-  }
-})
-
-const title = ref('融资阶段')
-let show = ref(false)
-let items = ref()
-const selectedItems = ref([])
-
-getDict('menduner_financing_status').then(({ data }) => {
-  data = data?.length && data || []
-  items.value = data
-  if (query && query.financingStatus	) {
-    const str = query.financingStatus	.split(',')[0]
-    const arr = str.split('_')
-    if (arr?.length) {
-      selectedItems.value = arr
-      title.value = selectedItems.value.length ? `融资阶段(${selectedItems.value.length})` : '融资阶段'
-      if (!props.positionIndexPage) emits('inputChange', { values: selectedItems.value, isEmit: true })
-    }
-  }
-  show.value = true
-})
-const handle = (val) => {
-  if (selectedItems.value.includes(val)) {
-    selectedItems.value = selectedItems.value.filter(i => i !== val)
-  } else {
-    selectedItems.value.push(val)
-  }
-  title.value = selectedItems.value.length ? `融资阶段(${selectedItems.value.length})` : '融资阶段'
-  if (props.positionIndexPage) emits('inputChange', selectedItems.value)
-  else emits('inputChange', { values: selectedItems.value, isEmit: true })
-}
-</script>
-<style lang="scss" scoped>
-</style>

src/views/recruit/personal/position/components/conditionFilter/payScope.vue

@@ -1,59 +0,0 @@
-<template>
-  <commonStyle v-if="show" :btnTitle="title" :close-on-content-click="true">
-    <v-list>
-      <v-list-item
-        color="primary"
-        :active="selectedItems.includes(item.value)"
-        v-for="item in items" :key="item.id" :value="item.value"
-        @click="handle(item.value)"
-      >
-        <template v-if="selectedItems.includes(item.value)" v-slot:append>
-          <v-icon icon="mdi-check"></v-icon>
-        </template>
-        <v-list-item-title>{{ item.label }}</v-list-item-title>
-      </v-list-item>
-    </v-list>
-  </commonStyle>
-</template>
-<script setup>
-import commonStyle from './commonStyle.vue'
-import { getDict } from '@/hooks/web/useDictionaries'
-import { ref, inject } from 'vue';
-defineOptions({name: 'conditionFilter-payScope'})
-const emits = defineEmits(['inputChange'])
-const query = inject('routeQuery')
-const props = defineProps({
-  positionIndexPage: { // 职位检索
-    type: Boolean,
-    default: false
-  }
-})
-
-const title = ref('薪资待遇')
-const show = ref(false)
-let items = ref()
-let selectedItems = ref([])
-
-getDict('menduner_pay_scope').then(({ data }) => {
-  data = data?.length && data || []
-  items.value = data
-  if (query && query.payType) {
-    title.value = '薪资待遇(1)'
-    selectedItems.value = [query.payType]
-    if (!props.positionIndexPage) emits('inputChange', { values: selectedItems.value, isEmit: true })
-  }
-  show.value = true
-})
-const handle = (val) => {
-  if (selectedItems.value.includes(val)) {
-    selectedItems.value = selectedItems.value.filter(i => i !== val)
-  } else {
-    selectedItems.value = [val]
-  }
-  title.value = selectedItems.value.length ? `薪资待遇(${selectedItems.value.length})` : '薪资待遇'
-  if (props.positionIndexPage) emits('inputChange', selectedItems.value)
-  else emits('inputChange', { values: selectedItems.value, isEmit: true })
-}
-</script>
-<style lang="scss" scoped>
-</style>

src/views/recruit/personal/position/components/conditionFilter/positionType.vue

@@ -1,42 +0,0 @@
-<template>
-  <commonStyle :btnTitle="title" :close-on-content-click="true">
-    <!-- 后端需要单选 -->
-    <jobTypeCard :select="selectedItems" isSingle echo clearable @handleJobClick="handle"></jobTypeCard>
-  </commonStyle>
-</template>
-
-<script setup>
-import commonStyle from './commonStyle.vue'
-import jobTypeCard from '@/components/jobTypeCard'
-import { inject, ref } from 'vue'
-defineOptions({name: 'conditionFilter-company-industry'})
-const emits = defineEmits(['inputChange'])
-const query = inject('routeQuery')
-const props = defineProps({
-  positionIndexPage: { // 职位检索
-    type: Boolean,
-    default: false
-  }
-})
-
-const title = ref('职位类型')
-const selectedItems = ref([])
-
-if (query && query.positionId) {
-  const str = query.positionId.split(',')[0]
-  const arr = str.split('_')
-  if (arr?.length) {
-    selectedItems.value = arr
-    title.value = selectedItems.value.length ? `职位类型(${selectedItems.value.length})` : '职位类型'
-  }
-}
-const handle = (arr) => {
-  selectedItems.value = arr
-  title.value = selectedItems.value.length ? `职位类型(${selectedItems.value.length})` : '职位类型'
-  if (props.positionIndexPage) emits('inputChange', selectedItems.value)
-  else emits('inputChange', { values: arr.length ? arr[0] : '', isEmit: true })
-}
-</script>
-
-<style lang="scss" scoped>
-</style>

src/views/recruit/personal/position/components/conditionFilter/scale.vue

@@ -1,64 +0,0 @@
-<template>
-  <commonStyle v-if="show" :btnTitle="title" :closeOnContentClick="false">
-    <v-list>
-      <v-list-item
-        color="primary"
-        :active="selectedItems.includes(item.value)"
-        v-for="item in items" :key="item.id" :value="item.value"
-        @click="handle(item.value)"
-      >
-        <template v-if="selectedItems.includes(item.value)" v-slot:append>
-          <v-icon icon="mdi-check"></v-icon>
-        </template>
-        <v-list-item-title>{{ item.label }}</v-list-item-title>
-      </v-list-item>
-    </v-list>
-  </commonStyle>
-</template>
-
-<script setup>
-import commonStyle from './commonStyle.vue'
-import { getDict } from '@/hooks/web/useDictionaries'
-import { ref, inject } from 'vue';
-defineOptions({name: 'conditionFilter-scale'})
-const emits = defineEmits(['inputChange'])
-const query = inject('routeQuery')
-const props = defineProps({
-  positionIndexPage: { // 职位检索
-    type: Boolean,
-    default: false
-  }
-})
-
-const title = ref('公司规模')
-let show = ref(false)
-let items = ref()
-const selectedItems = ref([])
-
-getDict('menduner_scale').then(({ data }) => {
-  data = data?.length && data || []
-  items.value = data
-  if (query && query.scale) {
-    const str = query.scale.split(',')[0]
-    const arr = str.split('_')
-    if (arr?.length) {
-      selectedItems.value = arr
-      title.value = selectedItems.value.length ? `公司规模(${selectedItems.value.length})` : '公司规模'
-      if (!props.positionIndexPage) emits('inputChange', { values: selectedItems.value, isEmit: true })
-    }
-  }
-  show.value = true
-})
-const handle = (val) => {
-  if (selectedItems.value.includes(val)) {
-    selectedItems.value = selectedItems.value.filter(i => i !== val)
-  } else {
-    selectedItems.value.push(val)
-  }
-  title.value = selectedItems.value.length ? `公司规模(${selectedItems.value.length})` : '公司规模'
-  if (props.positionIndexPage) emits('inputChange', selectedItems.value)
-  else emits('inputChange', { values: selectedItems.value, isEmit: true })
-}
-</script>
-<style lang="scss" scoped>
-</style>

src/views/recruit/personal/position/components/dict.js

@@ -1,9 +1,20 @@
 import { getDict } from '@/hooks/web/useDictionaries'
 import commonPath from './conditionFilter/commonPath.vue'
+// import areaType from './conditionFilter/areaType.vue'
 
 // dictUse: 查数据回显(一维数组字典)，dictShow: 用户操作的字典(用户看到的数据)
 // 当type是tree类型的数据的时候需要提供dictType
 const dictList = [
+  { 
+    dictShow: 'menduner_area_type',
+    apiType: 'areaList',
+    key: 'areaIds',
+    itemKey: 'id',
+    itemText: 'name',
+    title: '工作地点',
+    path: commonPath,
+    data: []
+  },
   { 
     dictUse: 'menduner_industry_type',
     apiType: 'industryList',
@@ -12,7 +23,6 @@ const dictList = [
     itemKey: 'id',
     itemText: 'nameCn',
     title: '行业类型',
-    isSingle: true,
     path: commonPath,
     data: []
   },

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

@@ -11,7 +11,7 @@
       </div>
       <cityFilter class="mx-5 mb-3" ref="cityFilterRef" @change="handleQueryChange"></cityFilter>
       <div class="d-flex justify-space-between mx-5 mb-3">
-        <conditionFilter ref="conditionFilterRef" @reset="handleReset" @change="handleQueryChange"></conditionFilter>
+        <conditionFilter ref="conditionFilterRef" :showFilterList="showFilterList" @reset="handleReset" @change="handleQueryChange"></conditionFilter>
       </div>
     </div>
     <div class="d-flex mt-3">
@@ -48,6 +48,16 @@ defineOptions({name: 'retrieval-position-page'})
 const route = useRoute(); const router = useRouter()
 const cityFilterRef = ref()
 const conditionFilterRef = ref()
+const showFilterList = [
+  { key: 'industryIds' },
+  { key: 'positionId', isSingle: true },
+  { key: 'jobType' },
+  { key: 'expType' },
+  { key: 'payType' },
+  { key: 'eduType' },
+  { key: 'scale' },
+  { key: 'financingStatus' },
+]
 
 const pageInfo = { pageNo: 1, pageSize: 20}
 const items = ref([])