|
@@ -0,0 +1,121 @@
|
|
|
|
+<template>
|
|
|
|
+ <div>
|
|
|
|
+ <CommonStyle v-for="(val, i) in list" :key="i" :btnTitle="val.title">
|
|
|
|
+ <v-list>
|
|
|
|
+ <v-list-item
|
|
|
|
+ v-for="(item, index) in val.items"
|
|
|
|
+ :key="index"
|
|
|
|
+ :active="val.selected.includes(item.value)"
|
|
|
|
+ color="primary"
|
|
|
|
+ :value="item.value"
|
|
|
|
+ @click="handleClick(item, val)"
|
|
|
|
+ >
|
|
|
|
+ <v-list-item-title>{{ item.label }}</v-list-item-title>
|
|
|
|
+ </v-list-item>
|
|
|
|
+ </v-list>
|
|
|
|
+ </CommonStyle>
|
|
|
|
+ <span class="reset-text cursor-pointer ml-3" @click="handleReset">重置</span>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script setup>
|
|
|
|
+defineOptions({ name: 'screen-page'})
|
|
|
|
+import { ref, defineProps, defineEmits, watch } from 'vue'
|
|
|
|
+import { getDict } from '@/hooks/web/useDictionaries'
|
|
|
|
+import CommonStyle from './commonStyle.vue'
|
|
|
|
+
|
|
|
|
+const emit = defineEmits(['search'])
|
|
|
|
+const props = defineProps({
|
|
|
|
+ tab: {
|
|
|
|
+ type: Number,
|
|
|
|
+ default: 0
|
|
|
|
+ }
|
|
|
|
+})
|
|
|
|
+
|
|
|
|
+const list = ref([
|
|
|
|
+ {
|
|
|
|
+ title: '应聘岗位',
|
|
|
|
+ defaultTitle: '应聘岗位',
|
|
|
|
+ selected: [],
|
|
|
|
+ items: [
|
|
|
|
+ { label: 'Java_广州 150-200元/天', value: '0' }
|
|
|
|
+ ]
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '学历',
|
|
|
|
+ defaultTitle: '学历',
|
|
|
|
+ dictTypeName: 'menduner_education_type',
|
|
|
|
+ selected: [],
|
|
|
|
+ items: []
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '工作经验',
|
|
|
|
+ defaultTitle: '工作经验',
|
|
|
|
+ dictTypeName: 'menduner_exp_type',
|
|
|
|
+ selected: [],
|
|
|
|
+ items: []
|
|
|
|
+ },
|
|
|
|
+ // {
|
|
|
|
+ // title: '年龄',
|
|
|
|
+ // defaultTitle: '年龄',
|
|
|
|
+ // selected: [],
|
|
|
|
+ // items: [
|
|
|
|
+ // { label: '16-20岁', value: '0' },
|
|
|
|
+ // { label: '21-25岁', value: '1' },
|
|
|
|
+ // { label: '26-30岁', value: '2' },
|
|
|
|
+ // { label: '31-35岁', value: '3' },
|
|
|
|
+ // { label: '35岁以上', value: '4' }
|
|
|
|
+ // ]
|
|
|
|
+ // },
|
|
|
|
+ {
|
|
|
|
+ title: '求职状态',
|
|
|
|
+ defaultTitle: '求职状态',
|
|
|
|
+ dictTypeName: 'menduner_job_status',
|
|
|
|
+ selected: [],
|
|
|
|
+ items: []
|
|
|
|
+ }
|
|
|
|
+])
|
|
|
|
+
|
|
|
|
+// 获取字典数据
|
|
|
|
+list.value.forEach(k => {
|
|
|
|
+ if (!k.dictTypeName) return
|
|
|
|
+ getDict(k.dictTypeName).then(({ data }) => {
|
|
|
|
+ data = data?.length && data || []
|
|
|
|
+ k.items = data
|
|
|
|
+ })
|
|
|
|
+})
|
|
|
|
+
|
|
|
|
+// 单击
|
|
|
|
+const handleClick = (item, val) => {
|
|
|
|
+ const obj = val.selected.includes(item.value)
|
|
|
|
+ val.selected = obj ? val.selected.filter(i => i !== item.value) : [item.value]
|
|
|
|
+ val.title = obj ? val.defaultTitle : item.label
|
|
|
|
+ emit('search', item.value)
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+// 重置
|
|
|
|
+const handleReset = () => {
|
|
|
|
+ list.value.map(e => {
|
|
|
|
+ e.selected = []
|
|
|
|
+ e.title = e.defaultTitle
|
|
|
|
+ return e
|
|
|
|
+ })
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+watch(
|
|
|
|
+ () => props.tab,
|
|
|
|
+ () => {
|
|
|
|
+ handleReset()
|
|
|
|
+ }
|
|
|
|
+)
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style scoped lang="scss">
|
|
|
|
+.reset-text {
|
|
|
|
+ font-size: 14px;
|
|
|
|
+ color: #777;
|
|
|
|
+ &:hover {
|
|
|
|
+ color: var(--v-primary-base);
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+</style>
|