|
@@ -3,13 +3,13 @@
|
|
<div class="default-width banner px-6">
|
|
<div class="default-width banner px-6">
|
|
<div class="banner-title">
|
|
<div class="banner-title">
|
|
<h1>{{ info.name }}</h1>
|
|
<h1>{{ info.name }}</h1>
|
|
- <span class="salary">{{ info.payFrom }}-{{ info.payTo }}/月</span>
|
|
|
|
- <span class="refresh-time">2022-10-17 11:03:59 刷新 <v-icon color="warning" size="20">mdi-alert-outline</v-icon></span>
|
|
|
|
|
|
+ <span class="salary">{{ info.payFrom }}-{{ info.payTo }}/{{ positionInfo.payName }}</span>
|
|
|
|
+ <span class="refresh-time">{{ timesTampChange(info.updateTime) }} 刷新 <v-icon color="warning" size="20">mdi-alert-outline</v-icon></span>
|
|
</div>
|
|
</div>
|
|
<div class="banner-tags mt-4">
|
|
<div class="banner-tags mt-4">
|
|
<span v-for="k in desc" :key="k.mdi" class="mr-10">
|
|
<span v-for="k in desc" :key="k.mdi" class="mr-10">
|
|
<v-icon color="#666" size="20">{{ k.mdi }}</v-icon>
|
|
<v-icon color="#666" size="20">{{ k.mdi }}</v-icon>
|
|
- <span class="ml-1">{{ k.label }}</span>
|
|
|
|
|
|
+ <span class="ml-1">{{ positionInfo[k.value] }}</span>
|
|
</span>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="banner-tools my-4" style="height: 47px;">
|
|
<div class="banner-tools my-4" style="height: 47px;">
|
|
@@ -25,17 +25,7 @@
|
|
<v-divider></v-divider>
|
|
<v-divider></v-divider>
|
|
<div class="d-flex">
|
|
<div class="d-flex">
|
|
<div class="content-left">
|
|
<div class="content-left">
|
|
- <div class="left-position-detail">
|
|
|
|
- <h4>职位详情</h4>
|
|
|
|
- <v-container class="pa-0 mt-3">
|
|
|
|
- <v-row no-gutters align="start">
|
|
|
|
- <v-col v-for="k in positionDetail" :key="k.label" cols="4" class="mb-1">
|
|
|
|
- <span class="label-text">{{ k.label }}<span class="value-text">{{ k.value }}</span></span>
|
|
|
|
- </v-col>
|
|
|
|
- </v-row>
|
|
|
|
- </v-container>
|
|
|
|
- </div>
|
|
|
|
- <div class="mt-3" v-if="Object.keys(info).length">
|
|
|
|
|
|
+ <div v-if="Object.keys(info).length">
|
|
<div>岗位职责:</div>
|
|
<div>岗位职责:</div>
|
|
<div class="requirement" v-html="info.content.replace(/\n/g, '</br>')"></div>
|
|
<div class="requirement" v-html="info.content.replace(/\n/g, '</br>')"></div>
|
|
<div class="mt-3">岗位要求:</div>
|
|
<div class="mt-3">岗位要求:</div>
|
|
@@ -67,8 +57,11 @@
|
|
<v-btn class="half-button radius" color="primary">投递简历</v-btn>
|
|
<v-btn class="half-button radius" color="primary">投递简历</v-btn>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
- <div class="content-right">
|
|
|
|
- <similarPositions></similarPositions>
|
|
|
|
|
|
+ <div class="content-right" v-if="Object.keys(info).length">
|
|
|
|
+ <!-- 公司信息 -->
|
|
|
|
+ <EnterpriseInfo :info="{ ...info, position: { ...positionInfo } }"></EnterpriseInfo>
|
|
|
|
+ <!-- 相似职位 -->
|
|
|
|
+ <similarPositions class="mt-3" :list="similarList"></similarPositions>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@@ -77,37 +70,68 @@
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
defineOptions({ name: 'position-details' })
|
|
defineOptions({ name: 'position-details' })
|
|
-import { ref } from 'vue'
|
|
|
|
|
|
+import { ref, reactive } from 'vue'
|
|
import { useRouter } from 'vue-router'
|
|
import { useRouter } from 'vue-router'
|
|
-import { getPositionDetails } from '@/api/position'
|
|
|
|
|
|
+import { timesTampChange } from '@/utils/date'
|
|
|
|
+import { getDict } from '@/hooks/web/useDictionaries'
|
|
|
|
+import { getPositionDetails, getSimilarPosition } from '@/api/position'
|
|
import similarPositions from '@/components/Position/similarPositions.vue'
|
|
import similarPositions from '@/components/Position/similarPositions.vue'
|
|
|
|
+import EnterpriseInfo from '@/components/Enterprise/info.vue'
|
|
|
|
|
|
const router = useRouter()
|
|
const router = useRouter()
|
|
const { id } = router.currentRoute.value.params
|
|
const { id } = router.currentRoute.value.params
|
|
|
|
+const { _value: positionInfo } = JSON.parse(router.currentRoute.value.query.positionInfo)
|
|
|
|
|
|
// 职位详情
|
|
// 职位详情
|
|
const info = ref({})
|
|
const info = ref({})
|
|
const getPositionDetail = async () => {
|
|
const getPositionDetail = async () => {
|
|
const data = await getPositionDetails({ id })
|
|
const data = await getPositionDetails({ id })
|
|
info.value = data
|
|
info.value = data
|
|
- console.log(data, 'info')
|
|
|
|
}
|
|
}
|
|
getPositionDetail()
|
|
getPositionDetail()
|
|
|
|
|
|
const desc = [
|
|
const desc = [
|
|
- { mdi: 'mdi-map-marker-outline', value: 'areaName', label: '广州' },
|
|
|
|
- { mdi: 'mdi-school-outline', value: 'eduName', label: '本科' },
|
|
|
|
- { mdi: 'mdi-clock-time-ten-outline', value: 'expName', label: '1-3年' }
|
|
|
|
|
|
+ { mdi: 'mdi-map-marker-outline', value: 'areaName' },
|
|
|
|
+ { mdi: 'mdi-school-outline', value: 'eduName' },
|
|
|
|
+ { mdi: 'mdi-clock-time-ten-outline', value: 'expName' }
|
|
]
|
|
]
|
|
|
|
|
|
-const positionDetail = [
|
|
|
|
- { label: '招聘人数:', value: '1人' },
|
|
|
|
- { label: '到岗时间:', value: '2周以内' },
|
|
|
|
- { label: '年龄要求:', value: '20-35周岁' },
|
|
|
|
- { label: '婚况要求:', value: '不限' },
|
|
|
|
- { label: '应届生:', value: '接受应届生' },
|
|
|
|
- { label: '语言要求:', value: '普通话' }
|
|
|
|
|
|
+// 相似职位
|
|
|
|
+const similarList = ref([])
|
|
|
|
+const getSimilarPositionList = async () => {
|
|
|
|
+ if (!Object.keys(positionInfo).length) return
|
|
|
|
+ const { list } = await getSimilarPosition({ pageNo: 1, pageSize: 4, positionId: positionInfo.positionId, expType: positionInfo.expType })
|
|
|
|
+ const items = list.splice(0, 4)
|
|
|
|
+ dictList.forEach(item => {
|
|
|
|
+ similarList.value = items.map(e => {
|
|
|
|
+ const valueKey = item.nameKey ? item.nameKey : 'label'
|
|
|
|
+ const idKey = item.valueKey ? item.valueKey : 'value'
|
|
|
|
+ e[item.label] = dictObj[item.value].find(k => Number(k[idKey]) === Number(e[item.key]))[valueKey] || ''
|
|
|
|
+ return e
|
|
|
|
+ })
|
|
|
|
+ })
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+const dictObj = reactive({
|
|
|
|
+ payUnit: [],
|
|
|
|
+ area: []
|
|
|
|
+})
|
|
|
|
+const dictList = [
|
|
|
|
+ { type: 'menduner_pay_unit', value: 'payUnit', key: 'payUnit', label: 'payName' },
|
|
|
|
+ { type: 'menduner_area_type', value: 'area', key: 'areaId', label: 'areaName', params: {}, apiType: 'areaList', nameKey: 'name', valueKey: 'id' }
|
|
]
|
|
]
|
|
|
|
+// 字典
|
|
|
|
+const getDictList = async () => {
|
|
|
|
+ dictList.forEach(async (val) => {
|
|
|
|
+ const { data } = await getDict(val.type, val.params, val.apiType)
|
|
|
|
+ dictObj[val.value] = data
|
|
|
|
+ })
|
|
|
|
+}
|
|
|
|
+const getData = async () => {
|
|
|
|
+ await getDictList()
|
|
|
|
+ getSimilarPositionList()
|
|
|
|
+}
|
|
|
|
+getData()
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
@@ -159,7 +183,6 @@ const positionDetail = [
|
|
}
|
|
}
|
|
.content-right {
|
|
.content-right {
|
|
flex: 1;
|
|
flex: 1;
|
|
- // background-color: #d5e6e8;
|
|
|
|
padding: 20px 20px 20px 0;
|
|
padding: 20px 20px 20px 0;
|
|
}
|
|
}
|
|
.label-text {
|
|
.label-text {
|