| <link rel="icon" type="image/svg+xml" href="/logo_1.jpg" /> | <link rel="icon" type="image/svg+xml" href="/logo_1.jpg" /> | ||||
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||||
| <title>后台管理系统</title> | <title>后台管理系统</title> | ||||
| <script type="module" crossorigin src="/assets/index-XPjI18tg.js"></script> | |||||
| <link rel="stylesheet" crossorigin href="/assets/index-T7d3tWJo.css"> | |||||
| <script type="module" crossorigin src="/assets/index-r0jWs-NT.js"></script> | |||||
| <link rel="stylesheet" crossorigin href="/assets/index-gaoqHXDk.css"> | |||||
| </head> | </head> | ||||
| <body> | <body> | ||||
| <div id="app"></div> | <div id="app"></div> |
| export const GetStatsHa = getModel(url.StatsHa); | export const GetStatsHa = getModel(url.StatsHa); | ||||
| export const GetStatsAgeandgender = getModel(url.StatsAgeandgender); | export const GetStatsAgeandgender = getModel(url.StatsAgeandgender); | ||||
| export const GetStatsEducation = getModel(url.StatsEducation); | export const GetStatsEducation = getModel(url.StatsEducation); | ||||
| export const GetStatsPosition = getModel(url.StatsPosition); | |||||
| export const GetStatsPosition = getModel(url.StatsPosition); | |||||
| export const GetStatsTitleAndSkill = getModel(url.StatsTitleAndSkill); | |||||
| export const GetStatsJobMajor = getModel(url.StatsJobMajor); |
| advertscheduleUpdate : String, | advertscheduleUpdate : String, | ||||
| advertscheduleList : String, | advertscheduleList : String, | ||||
| advertscheduleDetail : String, | advertscheduleDetail : String, | ||||
| // 活动 | // 活动 | ||||
| activityExportUsers: String, | |||||
| activityaddressAdd: String, | |||||
| activityaddressDel: String, | |||||
| activityaddressUpdate: String, | |||||
| activityaddressList: String, | |||||
| activityaddressDetail: String, | |||||
| activityaddressCate: String, | |||||
| activityExportUsers : String, | |||||
| activityaddressAdd : String, | |||||
| activityaddressDel : String, | |||||
| activityaddressUpdate : String, | |||||
| activityaddressList : String, | |||||
| activityaddressDetail : String, | |||||
| activityaddressCate : String, | |||||
| // 简历 | // 简历 | ||||
| // 列表 | // 列表 | ||||
| 'JobseekerList' : String, // 查看 | 'JobseekerList' : String, // 查看 | ||||
| 'JobapplicantUpdateexperience' : String, | 'JobapplicantUpdateexperience' : String, | ||||
| 'JobapplicantListexperience' : String, | 'JobapplicantListexperience' : String, | ||||
| 'JobapplicantExperiencedetail' : String, | 'JobapplicantExperiencedetail' : String, | ||||
| // 统计 | |||||
| StatsMajor: String, | |||||
| StatsCertificate: String, | |||||
| StatsWorkExperience: String, | |||||
| StatsHa: String, | |||||
| StatsAgeandgender: String, | |||||
| StatsEducation: String, | |||||
| StatsPosition: String, | |||||
| // 统计 | |||||
| StatsMajor : String, | |||||
| StatsCertificate : String, | |||||
| StatsWorkExperience : String, | |||||
| StatsHa : String, | |||||
| StatsAgeandgender : String, | |||||
| StatsEducation : String, | |||||
| StatsPosition : String, | |||||
| StatsTitleAndSkill : String, | |||||
| StatsJobMajor : String, | |||||
| } | } | ||||
| } | } |
| StatsAgeandgender: admin + '/stats/ageandgender', // 求职者年龄与性别统计 | StatsAgeandgender: admin + '/stats/ageandgender', // 求职者年龄与性别统计 | ||||
| StatsEducation: admin + '/stats/education', // 求职者学历统计 | StatsEducation: admin + '/stats/education', // 求职者学历统计 | ||||
| StatsPosition: admin + '/stats/position', // 求职者求职意向统计 | StatsPosition: admin + '/stats/position', // 求职者求职意向统计 | ||||
| StatsTitleAndSkill: admin + '/stats/titleandskill', // 求职者职称与技能统计 | |||||
| StatsJobMajor: admin + '/stats/job_major', // 企业职位统计 | |||||
| } | } |
| import { ref, onMounted, computed } from 'vue'; | import { ref, onMounted, computed } from 'vue'; | ||||
| import { useMenu } from '@/hooks/useMenu'; | import { useMenu } from '@/hooks/useMenu'; | ||||
| let { menuList, onMenu, routerCur, routerArrayCur } = useMenu(); | let { menuList, onMenu, routerCur, routerArrayCur } = useMenu(); | ||||
| console.log(menuList) | |||||
| const selectedMenu = computed(() => { | const selectedMenu = computed(() => { | ||||
| let newSelectedMenu = [routerCur()]; | let newSelectedMenu = [routerCur()]; | ||||
| return newSelectedMenu; | return newSelectedMenu; | ||||
| }) | }) | ||||
| const openSubMenu = computed(() => { | const openSubMenu = computed(() => { | ||||
| let newOpenSubMenu = [routerArrayCur()]; | |||||
| console.log(routerArrayCur()) | |||||
| let newOpenSubMenu = routerArrayCur(); | |||||
| return newOpenSubMenu; | return newOpenSubMenu; | ||||
| }) | }) | ||||
| ::-webkit-scrollbar { | ::-webkit-scrollbar { | ||||
| /* 设置滚动条宽度 */ | /* 设置滚动条宽度 */ | ||||
| width: 0px; | width: 0px; | ||||
| height: 0px; | |||||
| } | } | ||||
| .ant-menu { | .ant-menu { |
| // 获取当前路由父路由 | // 获取当前路由父路由 | ||||
| function routerArrayCur() { | function routerArrayCur() { | ||||
| return router.currentRoute.value.matched[1].path; | |||||
| if(router.currentRoute.value.matched.length > 3) { | |||||
| return [router.currentRoute.value.matched[1].path, router.currentRoute.value.matched[2].path] | |||||
| } else { | |||||
| return [router.currentRoute.value.matched[1].path] | |||||
| } | |||||
| } | } | ||||
| // 跳转路由 | // 跳转路由 |
| // 求职者管理 | // 求职者管理 | ||||
| const JokSeekerRoute : AppRouteRecordRaw = { | const JokSeekerRoute : AppRouteRecordRaw = { | ||||
| path: '/job-seeker', | |||||
| path: '/job/seeker', | |||||
| name: 'jobSeeker', | name: 'jobSeeker', | ||||
| component: routerList.JobSeeker, | component: routerList.JobSeeker, | ||||
| meta: { | meta: { | ||||
| // 招聘会管理 | // 招聘会管理 | ||||
| const JokFairRoute : AppRouteRecordRaw = { | const JokFairRoute : AppRouteRecordRaw = { | ||||
| path: '/job-fair', | |||||
| path: '/job/fair', | |||||
| name: 'jobFair', | name: 'jobFair', | ||||
| component: routerList.JokFair, | component: routerList.JokFair, | ||||
| meta: { | meta: { | ||||
| path: '/statistics/resume/major', | path: '/statistics/resume/major', | ||||
| name: 'statisticsResumeMajor', | name: 'statisticsResumeMajor', | ||||
| component: routerList.StatisticsResumeMajor, | component: routerList.StatisticsResumeMajor, | ||||
| meta: { | |||||
| title: '专业', | |||||
| icon: HomeOutlined | |||||
| }, | |||||
| }, | |||||
| { | |||||
| path: '/statistics/resume/age/sex', | |||||
| name: 'statisticsResumeAgeSex', | |||||
| component: routerList.StatisticsResumeAgeSex, | |||||
| meta: { | |||||
| title: '年龄与性别', | |||||
| icon: HomeOutlined | |||||
| }, | |||||
| }, | |||||
| { | |||||
| path: '/statistics/resume/certificate/skill', | |||||
| name: 'statisticsResumeCertificateSkill', | |||||
| component: routerList.StatisticsResumeCertificateSkill, | |||||
| meta: { | |||||
| title: '技能证书', | |||||
| icon: HomeOutlined | |||||
| }, | |||||
| }, | |||||
| { | |||||
| path: '/statistics/resume/education', | |||||
| name: 'statisticsResumeEducation', | |||||
| component: routerList.StatisticsResumeEducation, | |||||
| meta: { | |||||
| title: '学历', | |||||
| icon: HomeOutlined | |||||
| }, | |||||
| }, | |||||
| { | |||||
| path: '/statistics/resume/holidays/accommodation', | |||||
| name: 'statisticsResumeHolidaysAccommodation', | |||||
| component: routerList.StatisticsResumeHolidaysAccommodation, | |||||
| meta: { | |||||
| title: '节假日与食宿', | |||||
| icon: HomeOutlined | |||||
| }, | |||||
| }, | |||||
| { | |||||
| path: '/statistics/resume/job/intention', | |||||
| name: 'statisticsResumeJobIntention', | |||||
| component: routerList.StatisticsResumeJobIntention, | |||||
| meta: { | |||||
| title: '求职意向', | |||||
| icon: HomeOutlined | |||||
| }, | |||||
| }, | |||||
| { | |||||
| path: '/statistics/resume/title/skill', | |||||
| name: 'statisticsResumeTitleSkill', | |||||
| component: routerList.StatisticsResumeTitleSkill, | |||||
| meta: { | meta: { | ||||
| title: '职称与技能', | title: '职称与技能', | ||||
| icon: HomeOutlined | icon: HomeOutlined | ||||
| }, | }, | ||||
| } | |||||
| }, | |||||
| { | |||||
| path: '/statistics/resume/work/experience', | |||||
| name: 'statisticsResumeWorkExperience', | |||||
| component: routerList.StatisticsResumeWorkExperience, | |||||
| meta: { | |||||
| title: '工作经验', | |||||
| icon: HomeOutlined | |||||
| }, | |||||
| }, | |||||
| ], | ], | ||||
| }, | |||||
| { | |||||
| path: '/statistics/company', | |||||
| name: 'statisticsCompany', | |||||
| component: routerList.StatisticsCompany, | |||||
| meta: { | |||||
| title: '企业统计', | |||||
| icon: HomeOutlined | |||||
| }, | |||||
| children: [ | |||||
| { | |||||
| path: '/statistics/company/job', | |||||
| name: 'statisticsCompanyJob', | |||||
| component: routerList.StatisticsCompanyJob, | |||||
| meta: { | |||||
| title: '职位', | |||||
| icon: HomeOutlined | |||||
| }, | |||||
| }, | |||||
| ] | |||||
| } | } | ||||
| ], | ], | ||||
| import Statistics from '@/views/statistics/index.vue'; | import Statistics from '@/views/statistics/index.vue'; | ||||
| import StatisticsResume from '@/views/statistics/resume/index.vue'; | import StatisticsResume from '@/views/statistics/resume/index.vue'; | ||||
| import StatisticsResumeMajor from '@/views/statistics/resume/major/index.vue'; | import StatisticsResumeMajor from '@/views/statistics/resume/major/index.vue'; | ||||
| import StatisticsResumeAgeSex from '@/views/statistics/resume/ageSex/index.vue'; | |||||
| import StatisticsResumeCertificateSkill from '@/views/statistics/resume/certificateSkill/index.vue'; | |||||
| import StatisticsResumeEducation from '@/views/statistics/resume/education/index.vue'; | |||||
| import StatisticsResumeHolidaysAccommodation from '@/views/statistics/resume/holidaysAccommodation/index.vue'; | |||||
| import StatisticsResumeJobIntention from '@/views/statistics/resume/jobIntention/index.vue'; | |||||
| import StatisticsResumeTitleSkill from '@/views/statistics/resume/titleSkill/index.vue'; | |||||
| import StatisticsResumeWorkExperience from '@/views/statistics/resume/workExperience/index.vue'; | |||||
| import StatisticsCompany from '@/views/statistics/company/index.vue'; | |||||
| import StatisticsCompanyJob from '@/views/statistics/company/job/index.vue'; | |||||
| export const routerList = { | export const routerList = { | ||||
| Permission, | Permission, | ||||
| ActivityAddress, | ActivityAddress, | ||||
| Statistics, | Statistics, | ||||
| StatisticsResume, | StatisticsResume, | ||||
| StatisticsResumeMajor | |||||
| StatisticsResumeMajor, | |||||
| StatisticsResumeAgeSex, | |||||
| StatisticsResumeCertificateSkill, | |||||
| StatisticsResumeEducation, | |||||
| StatisticsResumeHolidaysAccommodation, | |||||
| StatisticsResumeJobIntention, | |||||
| StatisticsResumeTitleSkill, | |||||
| StatisticsResumeWorkExperience, | |||||
| StatisticsCompany, | |||||
| StatisticsCompanyJob | |||||
| } | } |
| pushItem(item) | pushItem(item) | ||||
| }) | }) | ||||
| let arr = state.arrresult; | let arr = state.arrresult; | ||||
| // let arr = ['permission', 'role', 'account', 'company', 'vip', 'member', 'homemake', 'homemakeType', 'homemakePosition', 'homemakeDemand', 'homemakeAppointment', 'job', 'department', 'jobSeeker', 'jobResume', 'jobFair', 'jobFairList', 'jobFairCompany', 'information', 'section', 'article', 'list', 'putIn', 'advertisementList', 'advertisement', 'activity', 'activityList', 'activityAddress', 'statistics', 'statisticsResume', 'statisticsResumeMajor']; | |||||
| // let arr = ['permission', 'role', 'account', 'company', 'vip', 'member', 'homemake', 'homemakeType', 'homemakePosition', 'homemakeDemand', 'homemakeAppointment', 'job', 'department', 'jobSeeker', 'jobResume', 'jobFair', 'jobFairList', 'jobFairCompany', 'information', 'section', 'article', 'list', 'putIn', 'advertisementList', 'advertisement', 'activity', 'activityList', 'activityAddress', 'statistics', 'statisticsResume', 'statisticsResumeMajor','statisticsResumeAgeSex','statisticsResumeCertificateSkill','statisticsResumeEducation','statisticsResumeHolidaysAccommodation','statisticsResumeJobIntention','statisticsResumeTitleSkill','statisticsResumeWorkExperience']; | |||||
| let routes = routerDynamic(routesModuleList, arr); | let routes = routerDynamic(routesModuleList, arr); | ||||
| LayoutRoute.children.push(...routes); | LayoutRoute.children.push(...routes); | ||||
| commit('SET_MENU', LayoutRoute.children); | commit('SET_MENU', LayoutRoute.children); |
| const { routerTo } = useAsRouter(); | const { routerTo } = useAsRouter(); | ||||
| const createForm = ref<Object>({ | const createForm = ref<Object>({ | ||||
| mobile: '13215816085', | |||||
| password: '123456' | |||||
| mobile: '', | |||||
| password: '' | |||||
| }) | }) | ||||
| const toLogin = () => { | const toLogin = () => { | ||||
| if (!createForm.value.mobile) { | if (!createForm.value.mobile) { |
| } | } | ||||
| if(newVal[0].parent_id == -1) { | if(newVal[0].parent_id == -1) { | ||||
| cascaderParentId.value.push(newVal[0].id); | |||||
| addOtherForm.value.isAddLevel = true; | addOtherForm.value.isAddLevel = true; | ||||
| addOtherForm.value.isTopLevel = true; | addOtherForm.value.isTopLevel = true; | ||||
| addOtherForm.value.parent_id = -1; | addOtherForm.value.parent_id = -1; | ||||
| } else { | } else { | ||||
| cascaderParentId.value.push(newVal[0].parent_id); | |||||
| cascaderParentId.value.push(newVal[0].id); | |||||
| addOtherForm.value.isAddLevel = true | addOtherForm.value.isAddLevel = true | ||||
| addOtherForm.value.isTopLevel = false | addOtherForm.value.isTopLevel = false | ||||
| addOtherForm.value.parent_id = 0; | addOtherForm.value.parent_id = 0; | ||||
| } | } | ||||
| } else if(newVal[1]){ | } else if(newVal[1]){ | ||||
| title.value = "添加下级权限/菜单"; | title.value = "添加下级权限/菜单"; | ||||
| console.log(newVal[1]) | |||||
| createForm.value.p_type = newVal[1].p_type | |||||
| cascaderParentId.value = []; | cascaderParentId.value = []; | ||||
| if(newVal[1].parent_id == -1) { | if(newVal[1].parent_id == -1) { | ||||
| cascaderParentId.value.push(newVal[1].id); | cascaderParentId.value.push(newVal[1].id); | ||||
| addOtherForm.value.isAddLevel = true; | |||||
| addOtherForm.value.isTopLevel = true; | |||||
| addOtherForm.value.parent_id = -1; | |||||
| } else { | } else { | ||||
| cascaderParentId.value.push(newVal[1].parent_id); | cascaderParentId.value.push(newVal[1].parent_id); | ||||
| cascaderParentId.value.push(newVal[1].id); | cascaderParentId.value.push(newVal[1].id); | ||||
| addOtherForm.value.isAddLevel = true | |||||
| addOtherForm.value.isTopLevel = false | |||||
| addOtherForm.value.parent_id = 0; | |||||
| } | } | ||||
| createForm.value.parent_id = newVal[1].id | createForm.value.parent_id = newVal[1].id | ||||
| } else { | } else { |
| <template> | |||||
| <router-view></router-view> | |||||
| </template> | |||||
| <script> | |||||
| </script> | |||||
| <style> | |||||
| </style> |
| export const cols = <ColType.type[]>[ | |||||
| { | |||||
| title: '职位', | |||||
| dataIndex: 'major' | |||||
| }, | |||||
| { | |||||
| title: '总数', | |||||
| dataIndex: 'total' | |||||
| } | |||||
| ]; |
| <template> | |||||
| <job-search @searchData="searchData" @clearData="clearData" :search_params="commomParams.search"></job-search> | |||||
| <a-c-operation @refresh="clearData" :need_add="false"></a-c-operation> | |||||
| <a-c-table :data="commomParams.table.data" :columns="commomParams.table.columns" :pagination="commomParams.page" | |||||
| @page="getPage" :loading="loading"> | |||||
| </a-c-table> | |||||
| </template> | |||||
| <script setup lang="ts"> | |||||
| import { ref, onMounted } from 'vue'; | |||||
| import JobSearch from '@/views/statistics/company/job/search/index.vue'; | |||||
| import { GetStatsJobMajor } from '@/apis/models'; | |||||
| import { cols } from '@/views/statistics/company/job/columns'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { commomParams } = useCommon(); | |||||
| let loading = ref<Boolean>(true); | |||||
| onMounted(() => { | |||||
| getData(commomParams.value.search); | |||||
| }) | |||||
| const searchData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const clearData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const getPage = (data : object) => { | |||||
| commomParams.value.search.page = data.current; | |||||
| commomParams.value.search.pagesize = data.pageSize; | |||||
| getData(); | |||||
| } | |||||
| const getData = async () => { | |||||
| try { | |||||
| loading.value = true; | |||||
| let res = await GetStatsJobMajor(commomParams.value.search); | |||||
| loading.value = false; | |||||
| commomParams.value.table.data = res.data.list; | |||||
| commomParams.value.table.columns = cols; | |||||
| commomParams.value.page = { | |||||
| current: commomParams.value.search.page, | |||||
| pageSize: commomParams.value.search.pagesize, | |||||
| total: res.data.total, | |||||
| pageSizeOptions: ['10', '20', '30', '40'], | |||||
| hideOnSinglePage: false, | |||||
| showSizeChanger: true | |||||
| }; | |||||
| } catch { | |||||
| loading.value = false; | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> |
| <template> | |||||
| <a-drawer :width="500" title="搜索" placement="right" :open="openSearchModel" @close="onClose"> | |||||
| <template #extra> | |||||
| <a-button style="margin-right: 8px" @click="clearSearch">清空搜索</a-button> | |||||
| <a-button type="primary" @click="getData">搜索</a-button> | |||||
| </template> | |||||
| <a-form :model="commomParams.search"> | |||||
| <a-row :gutter="[10]"> | |||||
| <a-col span="24"> | |||||
| <a-form-item label="选择时间"> | |||||
| <a-range-picker @Change="getRange" style="width: 100%;"/> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </a-form> | |||||
| </a-drawer> | |||||
| </template> | |||||
| <script lang="ts" setup> | |||||
| import { ref, onMounted, watch, computed } from 'vue'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { store, commomParams, openSearchModel, hideSearch, dayjs } = useCommon(); | |||||
| const dayjsRef = ref(dayjs); | |||||
| let props = defineProps(['search_params']); | |||||
| const emit = defineEmits(); | |||||
| openSearchModel = computed(() => { | |||||
| return store.state.openSearchModel; | |||||
| }) | |||||
| interface listType { | |||||
| start_date: String, | |||||
| end_date: String | |||||
| } | |||||
| commomParams.value.search = commomParams.value.search as listType; | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| commomParams.value.search.sort = 'major'; | |||||
| watch(() => props.search_params, (newVal) => { | |||||
| emit('searchData', commomParams.value.search) | |||||
| }, { | |||||
| immediate: true | |||||
| }) | |||||
| const getData = () => { | |||||
| commomParams.value.search.start_date = dayjsRef.value(val[0]).format('YYYY-MM-DD'); | |||||
| commomParams.value.search.end_date = dayjsRef.value(val[1]).format('YYYY-MM-DD'); | |||||
| emit('searchData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| // 清空搜索 | |||||
| const clearSearch = () => { | |||||
| commomParams.value.search = { | |||||
| page: 1, | |||||
| pagesize: 10, | |||||
| sort: 'major', | |||||
| sortby: 'desc', | |||||
| keyword: '' | |||||
| } | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| emit('clearData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| const onClose = () => { | |||||
| clearSearch() | |||||
| hideSearch() | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> | |||||
| export const cols = <ColType.type[]>[ | |||||
| { | |||||
| title: '专业名', | |||||
| dataIndex: 'major' | |||||
| }, | |||||
| { | |||||
| title: '总数', | |||||
| dataIndex: 'total' | |||||
| } | |||||
| ]; |
| <template> | |||||
| <age-sex-search @searchData="searchData" @clearData="clearData" :search_params="commomParams.search"></age-sex-search> | |||||
| <a-c-operation @refresh="clearData" :need_add="false"></a-c-operation> | |||||
| <a-row> | |||||
| <a-col :span="12"> | |||||
| <div ref="agePie" style="width: 100%; height: 480px;"></div> | |||||
| </a-col> | |||||
| <a-col :span="12"> | |||||
| <div ref="sexPie" style="width: 100%; height: 480px;"></div> | |||||
| </a-col> | |||||
| </a-row> | |||||
| <!-- | |||||
| <a-c-table :data="commomParams.table.data" :columns="commomParams.table.columns" :pagination="commomParams.page" | |||||
| @page="getPage" :loading="loading"> | |||||
| </a-c-table> --> | |||||
| </template> | |||||
| <script setup lang="ts"> | |||||
| import { ref, onMounted } from 'vue'; | |||||
| import AgeSexSearch from '@/views/statistics/resume/ageSex/search/index.vue'; | |||||
| import { GetStatsAgeandgender } from '@/apis/models'; | |||||
| import { init } from 'echarts'; | |||||
| import { cols } from '@/views/statistics/resume/ageSex/columns'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { commomParams } = useCommon(); | |||||
| let loading = ref<Boolean>(true); | |||||
| const agePie = ref(null); | |||||
| const sexPie = ref(null); | |||||
| // 设置环形图的数据 | |||||
| const ageData = ref([ | |||||
| { name: '0-18岁', value: 20 }, | |||||
| { name: '19-30岁', value: 30 }, | |||||
| { name: '31-45岁', value: 40 }, | |||||
| { name: '46岁以上', value: 10 }, | |||||
| ]) | |||||
| const sexData = ref([ | |||||
| { name: '男', value: 20 }, | |||||
| { name: '女', value: 30 } | |||||
| ]) | |||||
| onMounted(() => { | |||||
| getData(commomParams.value.search); | |||||
| getAgePieInit() | |||||
| getSexPieInit() | |||||
| }) | |||||
| const getAgePieInit = () => { | |||||
| const agePieOption = init(agePie.value) | |||||
| const option = { | |||||
| legend: { | |||||
| orient: 'vertical', | |||||
| top: '10%', | |||||
| left: 'left' | |||||
| }, | |||||
| tooltip: { | |||||
| trigger: 'item', | |||||
| formatter: '{a} <br/>{b} : {c} ({d}%)', | |||||
| }, | |||||
| series: [ | |||||
| { | |||||
| name: '年龄分布', | |||||
| type: 'pie', | |||||
| radius: ['40%', '70%'], | |||||
| center: ['50%', '50%'], | |||||
| data: ageData.value, | |||||
| emphasis: { | |||||
| itemStyle: { | |||||
| shadowBlur: 10, | |||||
| shadowOffsetX: 0, | |||||
| shadowColor: 'rgba(0, 0, 0, 0.5)', | |||||
| }, | |||||
| }, | |||||
| }, | |||||
| ], | |||||
| }; | |||||
| agePieOption.setOption(option) | |||||
| } | |||||
| const getSexPieInit = () => { | |||||
| const sexPieOption = init(sexPie.value) | |||||
| const option = { | |||||
| legend: { | |||||
| orient: 'vertical', | |||||
| top: '10%', | |||||
| left: 'left' | |||||
| }, | |||||
| tooltip: { | |||||
| trigger: 'item', | |||||
| formatter: '{a} <br/>{b} : {c} ({d}%)', | |||||
| }, | |||||
| series: [ | |||||
| { | |||||
| name: '性别分布', | |||||
| type: 'pie', | |||||
| radius: ['40%', '70%'], | |||||
| center: ['50%', '50%'], | |||||
| data: sexData.value, | |||||
| emphasis: { | |||||
| itemStyle: { | |||||
| shadowBlur: 10, | |||||
| shadowOffsetX: 0, | |||||
| shadowColor: 'rgba(0, 0, 0, 0.5)', | |||||
| }, | |||||
| }, | |||||
| }, | |||||
| ], | |||||
| }; | |||||
| sexPieOption.setOption(option) | |||||
| } | |||||
| const searchData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const clearData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const getPage = (data : object) => { | |||||
| commomParams.value.search.page = data.current; | |||||
| commomParams.value.search.pagesize = data.pageSize; | |||||
| getData(); | |||||
| } | |||||
| const getData = async () => { | |||||
| try { | |||||
| loading.value = true; | |||||
| let res = await GetStatsAgeandgender(commomParams.value.search); | |||||
| loading.value = false; | |||||
| ageData.value = res.data.age_group_list.map(item => { | |||||
| return {name: item.age_group, value: item.total} | |||||
| }) | |||||
| getAgePieInit() | |||||
| sexData.value = res.data.gender_list.map(item => { | |||||
| return {name: item.gender, value: item.total} | |||||
| }) | |||||
| getSexPieInit() | |||||
| commomParams.value.page = { | |||||
| current: commomParams.value.search.page, | |||||
| pageSize: commomParams.value.search.pagesize, | |||||
| total: res.data.total, | |||||
| pageSizeOptions: ['10', '20', '30', '40'], | |||||
| hideOnSinglePage: false, | |||||
| showSizeChanger: true | |||||
| }; | |||||
| } catch { | |||||
| loading.value = false; | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> |
| <template> | |||||
| <a-drawer :width="500" title="搜索" placement="right" :open="openSearchModel" @close="onClose"> | |||||
| <template #extra> | |||||
| <a-button style="margin-right: 8px" @click="clearSearch">清空搜索</a-button> | |||||
| <a-button type="primary" @click="getData">搜索</a-button> | |||||
| </template> | |||||
| <a-form :model="commomParams.search"> | |||||
| <a-row :gutter="[10]"> | |||||
| <a-col span="24"> | |||||
| <a-form-item label="选择时间"> | |||||
| <a-range-picker @Change="getRange" style="width: 100%;"/> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </a-form> | |||||
| </a-drawer> | |||||
| </template> | |||||
| <script lang="ts" setup> | |||||
| import { ref, onMounted, watch, computed } from 'vue'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { store, commomParams, openSearchModel, hideSearch, dayjs } = useCommon(); | |||||
| const dayjsRef = ref(dayjs); | |||||
| let props = defineProps(['search_params']); | |||||
| const emit = defineEmits(); | |||||
| openSearchModel = computed(() => { | |||||
| return store.state.openSearchModel; | |||||
| }) | |||||
| interface listType { | |||||
| start_date: String, | |||||
| end_date: String | |||||
| } | |||||
| commomParams.value.search = commomParams.value.search as listType; | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| commomParams.value.search.sort = 'work_experience'; | |||||
| watch(() => props.search_params, (newVal) => { | |||||
| emit('searchData', commomParams.value.search) | |||||
| }, { | |||||
| immediate: true | |||||
| }) | |||||
| const getData = () => { | |||||
| commomParams.value.search.start_date = dayjsRef.value(val[0]).format('YYYY-MM-DD'); | |||||
| commomParams.value.search.end_date = dayjsRef.value(val[1]).format('YYYY-MM-DD'); | |||||
| emit('searchData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| // 清空搜索 | |||||
| const clearSearch = () => { | |||||
| commomParams.value.search = { | |||||
| page: 1, | |||||
| pagesize: 10, | |||||
| sort: 'work_experience', | |||||
| sortby: 'desc', | |||||
| keyword: '' | |||||
| } | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| emit('clearData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| const onClose = () => { | |||||
| clearSearch() | |||||
| hideSearch() | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> | |||||
| export const cols = <ColType.type[]>[ | |||||
| { | |||||
| title: '证书名', | |||||
| dataIndex: 'certificate' | |||||
| }, | |||||
| { | |||||
| title: '总数', | |||||
| dataIndex: 'total' | |||||
| } | |||||
| ]; |
| <template> | |||||
| <certificate-skill-search @searchData="searchData" @clearData="clearData" :search_params="commomParams.search"></certificate-skill-search> | |||||
| <a-c-operation @refresh="clearData" :need_add="false"></a-c-operation> | |||||
| <a-c-table :data="commomParams.table.data" :columns="commomParams.table.columns" :pagination="commomParams.page" | |||||
| @page="getPage" :loading="loading"> | |||||
| </a-c-table> | |||||
| </template> | |||||
| <script setup lang="ts"> | |||||
| import { ref, onMounted } from 'vue'; | |||||
| import CertificateSkillSearch from '@/views/statistics/resume/certificateSkill/search/index.vue'; | |||||
| import { GetStatsCertificate } from '@/apis/models'; | |||||
| import { cols } from '@/views/statistics/resume/certificateSkill/columns'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { commomParams } = useCommon(); | |||||
| let loading = ref<Boolean>(true); | |||||
| onMounted(() => { | |||||
| getData(commomParams.value.search); | |||||
| }) | |||||
| const searchData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const clearData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const getPage = (data : object) => { | |||||
| commomParams.value.search.page = data.current; | |||||
| commomParams.value.search.pagesize = data.pageSize; | |||||
| getData(); | |||||
| } | |||||
| const getData = async () => { | |||||
| try { | |||||
| loading.value = true; | |||||
| let res = await GetStatsCertificate(commomParams.value.search); | |||||
| loading.value = false; | |||||
| commomParams.value.table.data = res.data.list; | |||||
| commomParams.value.table.columns = cols; | |||||
| commomParams.value.page = { | |||||
| current: commomParams.value.search.page, | |||||
| pageSize: commomParams.value.search.pagesize, | |||||
| total: res.data.total, | |||||
| pageSizeOptions: ['10', '20', '30', '40'], | |||||
| hideOnSinglePage: false, | |||||
| showSizeChanger: true | |||||
| }; | |||||
| } catch { | |||||
| loading.value = false; | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> |
| <template> | |||||
| <a-drawer :width="500" title="搜索" placement="right" :open="openSearchModel" @close="onClose"> | |||||
| <template #extra> | |||||
| <a-button style="margin-right: 8px" @click="clearSearch">清空搜索</a-button> | |||||
| <a-button type="primary" @click="getData">搜索</a-button> | |||||
| </template> | |||||
| <a-form :model="commomParams.search"> | |||||
| <a-row :gutter="[10]"> | |||||
| <a-col span="24"> | |||||
| <a-form-item label="选择时间"> | |||||
| <a-range-picker @Change="getRange" style="width: 100%;"/> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </a-form> | |||||
| </a-drawer> | |||||
| </template> | |||||
| <script lang="ts" setup> | |||||
| import { ref, onMounted, watch, computed } from 'vue'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { store, commomParams, openSearchModel, hideSearch, dayjs } = useCommon(); | |||||
| const dayjsRef = ref(dayjs); | |||||
| let props = defineProps(['search_params']); | |||||
| const emit = defineEmits(); | |||||
| openSearchModel = computed(() => { | |||||
| return store.state.openSearchModel; | |||||
| }) | |||||
| interface listType { | |||||
| start_date: String, | |||||
| end_date: String | |||||
| } | |||||
| commomParams.value.search = commomParams.value.search as listType; | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| commomParams.value.search.sort = 'certificate'; | |||||
| watch(() => props.search_params, (newVal) => { | |||||
| emit('searchData', commomParams.value.search) | |||||
| }, { | |||||
| immediate: true | |||||
| }) | |||||
| const getData = () => { | |||||
| commomParams.value.search.start_date = dayjsRef.value(val[0]).format('YYYY-MM-DD'); | |||||
| commomParams.value.search.end_date = dayjsRef.value(val[1]).format('YYYY-MM-DD'); | |||||
| emit('searchData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| // 清空搜索 | |||||
| const clearSearch = () => { | |||||
| commomParams.value.search = { | |||||
| page: 1, | |||||
| pagesize: 10, | |||||
| sort: 'certificate', | |||||
| sortby: 'desc', | |||||
| keyword: '' | |||||
| } | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| emit('clearData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| const onClose = () => { | |||||
| clearSearch() | |||||
| hideSearch() | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> | |||||
| export const cols = <ColType.type[]>[ | |||||
| { | |||||
| title: '学历', | |||||
| dataIndex: 'education' | |||||
| }, | |||||
| { | |||||
| title: '总数', | |||||
| dataIndex: 'total' | |||||
| } | |||||
| ]; |
| <template> | |||||
| <major-search @searchData="searchData" @clearData="clearData" :search_params="commomParams.search"></major-search> | |||||
| <a-c-operation @refresh="clearData" :need_add="false"></a-c-operation> | |||||
| <a-c-table :data="commomParams.table.data" :columns="commomParams.table.columns" :pagination="commomParams.page" | |||||
| @page="getPage" :loading="loading"> | |||||
| </a-c-table> | |||||
| </template> | |||||
| <script setup lang="ts"> | |||||
| import { ref, onMounted } from 'vue'; | |||||
| import MajorSearch from '@/views/statistics/resume/education/search/index.vue'; | |||||
| import { GetStatsEducation } from '@/apis/models'; | |||||
| import { cols } from '@/views/statistics/resume/education/columns'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { commomParams } = useCommon(); | |||||
| let loading = ref<Boolean>(true); | |||||
| onMounted(() => { | |||||
| getData(commomParams.value.search); | |||||
| }) | |||||
| const searchData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const clearData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const getPage = (data : object) => { | |||||
| commomParams.value.search.page = data.current; | |||||
| commomParams.value.search.pagesize = data.pageSize; | |||||
| getData(); | |||||
| } | |||||
| const getData = async () => { | |||||
| try { | |||||
| loading.value = true; | |||||
| let res = await GetStatsEducation(commomParams.value.search); | |||||
| loading.value = false; | |||||
| commomParams.value.table.data = res.data.list; | |||||
| commomParams.value.table.columns = cols; | |||||
| commomParams.value.page = { | |||||
| current: commomParams.value.search.page, | |||||
| pageSize: commomParams.value.search.pagesize, | |||||
| total: res.data.total, | |||||
| pageSizeOptions: ['10', '20', '30', '40'], | |||||
| hideOnSinglePage: false, | |||||
| showSizeChanger: true | |||||
| }; | |||||
| } catch { | |||||
| loading.value = false; | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> |
| <template> | |||||
| <a-drawer :width="500" title="搜索" placement="right" :open="openSearchModel" @close="onClose"> | |||||
| <template #extra> | |||||
| <a-button style="margin-right: 8px" @click="clearSearch">清空搜索</a-button> | |||||
| <a-button type="primary" @click="getData">搜索</a-button> | |||||
| </template> | |||||
| <a-form :model="commomParams.search"> | |||||
| <a-row :gutter="[10]"> | |||||
| <a-col span="24"> | |||||
| <a-form-item label="选择时间"> | |||||
| <a-range-picker @Change="getRange" style="width: 100%;"/> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </a-form> | |||||
| </a-drawer> | |||||
| </template> | |||||
| <script lang="ts" setup> | |||||
| import { ref, onMounted, watch, computed } from 'vue'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { store, commomParams, openSearchModel, hideSearch, dayjs } = useCommon(); | |||||
| const dayjsRef = ref(dayjs); | |||||
| let props = defineProps(['search_params']); | |||||
| const emit = defineEmits(); | |||||
| openSearchModel = computed(() => { | |||||
| return store.state.openSearchModel; | |||||
| }) | |||||
| interface listType { | |||||
| start_date: String, | |||||
| end_date: String | |||||
| } | |||||
| commomParams.value.search = commomParams.value.search as listType; | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| commomParams.value.search.sort = 'education'; | |||||
| watch(() => props.search_params, (newVal) => { | |||||
| emit('searchData', commomParams.value.search) | |||||
| }, { | |||||
| immediate: true | |||||
| }) | |||||
| const getData = () => { | |||||
| commomParams.value.search.start_date = dayjsRef.value(val[0]).format('YYYY-MM-DD'); | |||||
| commomParams.value.search.end_date = dayjsRef.value(val[1]).format('YYYY-MM-DD'); | |||||
| emit('searchData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| // 清空搜索 | |||||
| const clearSearch = () => { | |||||
| commomParams.value.search = { | |||||
| page: 1, | |||||
| pagesize: 10, | |||||
| sort: 'education', | |||||
| sortby: 'desc', | |||||
| keyword: '' | |||||
| } | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| emit('clearData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| const onClose = () => { | |||||
| clearSearch() | |||||
| hideSearch() | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> | |||||
| export const cols = <ColType.type[]>[ | |||||
| { | |||||
| title: '专业名', | |||||
| dataIndex: 'major' | |||||
| }, | |||||
| { | |||||
| title: '总数', | |||||
| dataIndex: 'total' | |||||
| } | |||||
| ]; |
| <template> | |||||
| <major-search @searchData="searchData" @clearData="clearData" :search_params="commomParams.search"></major-search> | |||||
| <a-c-operation @refresh="clearData" :need_add="false"></a-c-operation> | |||||
| <!-- <a-c-table :data="commomParams.table.data" :columns="commomParams.table.columns" :pagination="commomParams.page" | |||||
| @page="getPage" :loading="loading"> | |||||
| </a-c-table> --> | |||||
| <a-row> | |||||
| <a-col :span="12"> | |||||
| <div ref="holidayPie" style="width: 100%; height: 400px;"></div> | |||||
| </a-col> | |||||
| <a-col :span="12"> | |||||
| <div ref="accommodationPie" style="width: 100%; height: 400px;"></div> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </template> | |||||
| <script setup lang="ts"> | |||||
| import { ref, onMounted } from 'vue'; | |||||
| import MajorSearch from '@/views/statistics/resume/holidaysAccommodation/search/index.vue'; | |||||
| import { GetStatsHa } from '@/apis/models'; | |||||
| import { init } from 'echarts'; | |||||
| import { cols } from '@/views/statistics/resume/holidaysAccommodation/columns'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { commomParams } = useCommon(); | |||||
| let loading = ref<Boolean>(true); | |||||
| const holidayPie = ref(null); | |||||
| const accommodationPie = ref(null); | |||||
| // 设置环形图的数据 | |||||
| const holidayData = ref([ | |||||
| { name: '提供食宿', value: 20 }, | |||||
| { name: '包住', value: 30 }, | |||||
| { name: '31-45岁', value: 40 }, | |||||
| { name: '46岁以上', value: 10 }, | |||||
| ]) | |||||
| const accommodationData = ref([ | |||||
| { name: '月休4日', value: 20 }, | |||||
| { name: '三班倒', value: 30 } | |||||
| ]) | |||||
| onMounted(() => { | |||||
| getData(commomParams.value.search); | |||||
| getHolidayPieInit() | |||||
| getAccommodationPieInit() | |||||
| }) | |||||
| const getHolidayPieInit = () => { | |||||
| const holidayPieOption = init(holidayPie.value) | |||||
| const option = { | |||||
| legend: { | |||||
| orient: 'vertical', | |||||
| top: '10%', | |||||
| left: 'left' | |||||
| }, | |||||
| tooltip: { | |||||
| trigger: 'item', | |||||
| formatter: '{a} <br/>{b} : {c} ({d}%)', | |||||
| }, | |||||
| series: [ | |||||
| { | |||||
| name: '节假日休息分布', | |||||
| type: 'pie', | |||||
| radius: ['40%', '70%'], | |||||
| center: ['50%', '50%'], | |||||
| data: holidayData.value, | |||||
| emphasis: { | |||||
| itemStyle: { | |||||
| shadowBlur: 10, | |||||
| shadowOffsetX: 0, | |||||
| shadowColor: 'rgba(0, 0, 0, 0.5)', | |||||
| }, | |||||
| }, | |||||
| }, | |||||
| ], | |||||
| }; | |||||
| holidayPieOption.setOption(option) | |||||
| } | |||||
| const getAccommodationPieInit = () => { | |||||
| const accommodationPieOption = init(accommodationPie.value) | |||||
| const option = { | |||||
| legend: { | |||||
| orient: 'vertical', | |||||
| top: '10%', | |||||
| left: 'left' | |||||
| }, | |||||
| tooltip: { | |||||
| trigger: 'item', | |||||
| formatter: '{a} <br/>{b} : {c} ({d}%)', | |||||
| }, | |||||
| series: [ | |||||
| { | |||||
| name: '食宿情况分布', | |||||
| type: 'pie', | |||||
| radius: ['40%', '70%'], | |||||
| center: ['50%', '50%'], | |||||
| data: accommodationData.value, | |||||
| emphasis: { | |||||
| itemStyle: { | |||||
| shadowBlur: 10, | |||||
| shadowOffsetX: 0, | |||||
| shadowColor: 'rgba(0, 0, 0, 0.5)', | |||||
| }, | |||||
| }, | |||||
| }, | |||||
| ], | |||||
| }; | |||||
| accommodationPieOption.setOption(option) | |||||
| } | |||||
| const searchData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const clearData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const getPage = (data : object) => { | |||||
| commomParams.value.search.page = data.current; | |||||
| commomParams.value.search.pagesize = data.pageSize; | |||||
| getData(); | |||||
| } | |||||
| const getData = async () => { | |||||
| try { | |||||
| loading.value = true; | |||||
| let res = await GetStatsHa(commomParams.value.search); | |||||
| loading.value = false; | |||||
| holidayData.value = res.data.holiday_rest_list.map(item => { | |||||
| return {name: item.holiday_rest, value: item.total} | |||||
| }) | |||||
| getHolidayPieInit() | |||||
| accommodationData.value = res.data.accommodation_list.map(item => { | |||||
| return {name: item.AccommodationRequirement, value: item.Total} | |||||
| }) | |||||
| getAccommodationPieInit() | |||||
| commomParams.value.page = { | |||||
| current: commomParams.value.search.page, | |||||
| pageSize: commomParams.value.search.pagesize, | |||||
| total: res.data.total, | |||||
| pageSizeOptions: ['10', '20', '30', '40'], | |||||
| hideOnSinglePage: false, | |||||
| showSizeChanger: true | |||||
| }; | |||||
| } catch { | |||||
| loading.value = false; | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> |
| <template> | |||||
| <a-drawer :width="500" title="搜索" placement="right" :open="openSearchModel" @close="onClose"> | |||||
| <template #extra> | |||||
| <a-button style="margin-right: 8px" @click="clearSearch">清空搜索</a-button> | |||||
| <a-button type="primary" @click="getData">搜索</a-button> | |||||
| </template> | |||||
| <a-form :model="commomParams.search"> | |||||
| <a-row :gutter="[10]"> | |||||
| <a-col span="24"> | |||||
| <a-form-item label="选择时间"> | |||||
| <a-range-picker @Change="getRange" style="width: 100%;"/> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </a-form> | |||||
| </a-drawer> | |||||
| </template> | |||||
| <script lang="ts" setup> | |||||
| import { ref, onMounted, watch, computed } from 'vue'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { store, commomParams, openSearchModel, hideSearch, dayjs } = useCommon(); | |||||
| const dayjsRef = ref(dayjs); | |||||
| let props = defineProps(['search_params']); | |||||
| const emit = defineEmits(); | |||||
| openSearchModel = computed(() => { | |||||
| return store.state.openSearchModel; | |||||
| }) | |||||
| interface listType { | |||||
| start_date: String, | |||||
| end_date: String | |||||
| } | |||||
| commomParams.value.search = commomParams.value.search as listType; | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| commomParams.value.search.sort = 'holiday_rest'; | |||||
| watch(() => props.search_params, (newVal) => { | |||||
| emit('searchData', commomParams.value.search) | |||||
| }, { | |||||
| immediate: true | |||||
| }) | |||||
| const getData = () => { | |||||
| commomParams.value.search.start_date = dayjsRef.value(val[0]).format('YYYY-MM-DD'); | |||||
| commomParams.value.search.end_date = dayjsRef.value(val[1]).format('YYYY-MM-DD'); | |||||
| emit('searchData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| // 清空搜索 | |||||
| const clearSearch = () => { | |||||
| commomParams.value.search = { | |||||
| page: 1, | |||||
| pagesize: 10, | |||||
| sort: 'holiday_rest', | |||||
| sortby: 'desc', | |||||
| keyword: '' | |||||
| } | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| emit('clearData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| const onClose = () => { | |||||
| clearSearch() | |||||
| hideSearch() | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> | |||||
| export const cols = <ColType.type[]>[ | |||||
| { | |||||
| title: '岗位', | |||||
| dataIndex: 'position_name' | |||||
| }, | |||||
| { | |||||
| title: '总数', | |||||
| dataIndex: 'total' | |||||
| } | |||||
| ]; |
| <template> | |||||
| <job-intention-search @searchData="searchData" @clearData="clearData" :search_params="commomParams.search"></job-intention-search> | |||||
| <a-c-operation @refresh="clearData" :need_add="false"></a-c-operation> | |||||
| <a-c-table :data="commomParams.table.data" :columns="commomParams.table.columns" :pagination="commomParams.page" | |||||
| @page="getPage" :loading="loading"> | |||||
| </a-c-table> | |||||
| </template> | |||||
| <script setup lang="ts"> | |||||
| import { ref, onMounted } from 'vue'; | |||||
| import JobIntentionSearch from '@/views/statistics/resume/jobIntention/search/index.vue'; | |||||
| import { GetStatsPosition } from '@/apis/models'; | |||||
| import { cols } from '@/views/statistics/resume/jobIntention/columns'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { commomParams } = useCommon(); | |||||
| let loading = ref<Boolean>(true); | |||||
| onMounted(() => { | |||||
| getData(commomParams.value.search); | |||||
| }) | |||||
| const searchData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const clearData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const getPage = (data : object) => { | |||||
| commomParams.value.search.page = data.current; | |||||
| commomParams.value.search.pagesize = data.pageSize; | |||||
| getData(); | |||||
| } | |||||
| const getData = async () => { | |||||
| try { | |||||
| loading.value = true; | |||||
| let res = await GetStatsPosition(commomParams.value.search); | |||||
| loading.value = false; | |||||
| commomParams.value.table.data = res.data.list; | |||||
| commomParams.value.table.columns = cols; | |||||
| commomParams.value.page = { | |||||
| current: commomParams.value.search.page, | |||||
| pageSize: commomParams.value.search.pagesize, | |||||
| total: res.data.total, | |||||
| pageSizeOptions: ['10', '20', '30', '40'], | |||||
| hideOnSinglePage: false, | |||||
| showSizeChanger: true | |||||
| }; | |||||
| } catch { | |||||
| loading.value = false; | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> |
| <template> | |||||
| <a-drawer :width="500" title="搜索" placement="right" :open="openSearchModel" @close="onClose"> | |||||
| <template #extra> | |||||
| <a-button style="margin-right: 8px" @click="clearSearch">清空搜索</a-button> | |||||
| <a-button type="primary" @click="getData">搜索</a-button> | |||||
| </template> | |||||
| <a-form :model="commomParams.search"> | |||||
| <a-row :gutter="[10]"> | |||||
| <a-col span="24"> | |||||
| <a-form-item label="选择时间"> | |||||
| <a-range-picker @Change="getRange" style="width: 100%;"/> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </a-form> | |||||
| </a-drawer> | |||||
| </template> | |||||
| <script lang="ts" setup> | |||||
| import { ref, onMounted, watch, computed } from 'vue'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { store, commomParams, openSearchModel, hideSearch, dayjs } = useCommon(); | |||||
| const dayjsRef = ref(dayjs); | |||||
| let props = defineProps(['search_params']); | |||||
| const emit = defineEmits(); | |||||
| openSearchModel = computed(() => { | |||||
| return store.state.openSearchModel; | |||||
| }) | |||||
| interface listType { | |||||
| start_date: String, | |||||
| end_date: String | |||||
| } | |||||
| commomParams.value.search = commomParams.value.search as listType; | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| commomParams.value.search.sort = 'level1'; | |||||
| watch(() => props.search_params, (newVal) => { | |||||
| emit('searchData', commomParams.value.search) | |||||
| }, { | |||||
| immediate: true | |||||
| }) | |||||
| const getData = () => { | |||||
| commomParams.value.search.start_date = dayjsRef.value(val[0]).format('YYYY-MM-DD'); | |||||
| commomParams.value.search.end_date = dayjsRef.value(val[1]).format('YYYY-MM-DD'); | |||||
| emit('searchData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| // 清空搜索 | |||||
| const clearSearch = () => { | |||||
| commomParams.value.search = { | |||||
| page: 1, | |||||
| pagesize: 10, | |||||
| sort: 'level1', | |||||
| sortby: 'desc', | |||||
| keyword: '' | |||||
| } | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| emit('clearData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| const onClose = () => { | |||||
| clearSearch() | |||||
| hideSearch() | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> | |||||
| export const cols = <ColType.type[]>[ | |||||
| { | |||||
| title: '专业名', | |||||
| dataIndex: 'major' | |||||
| }, | |||||
| { | |||||
| title: '总数', | |||||
| dataIndex: 'total' | |||||
| } | |||||
| ]; |
| <template> | <template> | ||||
| <a-card title="求职者专业统计"> | |||||
| <major-search @searchData="searchData" @clearData="clearData" :search_params="commomParams.search"></major-search> | |||||
| <a-c-table :data="commomParams.table.data" :columns="commomParams.table.columns" :pagination="commomParams.page" | |||||
| @page="getPage" :loading="loading"> | |||||
| </a-c-table> | |||||
| </a-card> | |||||
| <major-search @searchData="searchData" @clearData="clearData" :search_params="commomParams.search"></major-search> | |||||
| <a-c-operation @refresh="clearData" :need_add="false"></a-c-operation> | |||||
| <a-c-table :data="commomParams.table.data" :columns="commomParams.table.columns" :pagination="commomParams.page" | |||||
| @page="getPage" :loading="loading"> | |||||
| </a-c-table> | |||||
| </template> | </template> | ||||
| <script setup lang="ts"> | <script setup lang="ts"> | ||||
| import { ref, onMounted } from 'vue'; | import { ref, onMounted } from 'vue'; | ||||
| import MajorSearch from '@/views/statistics/resume/major/search/index.vue'; | import MajorSearch from '@/views/statistics/resume/major/search/index.vue'; | ||||
| import { GetStatsHa } from '@/apis/models'; | |||||
| import { GetStatsMajor } from '@/apis/models'; | |||||
| import { cols } from '@/views/statistics/resume/major/columns'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | import { useCommon } from '@/hooks/useCommon'; | ||||
| let { commomParams } = useCommon(); | let { commomParams } = useCommon(); | ||||
| } | } | ||||
| const clearData = (data : object) => { | const clearData = (data : object) => { | ||||
| if (data) { | |||||
| commomParams.value.search = data | |||||
| } else { | |||||
| commomParams.value.search = { | |||||
| page: 1, | |||||
| pagesize: 10, | |||||
| sort: 'work_experience', | |||||
| sortby: 'asc', | |||||
| keyword: '' | |||||
| } | |||||
| } | |||||
| commomParams.value.search = data | |||||
| getData(); | getData(); | ||||
| } | } | ||||
| const getData = async () => { | const getData = async () => { | ||||
| try { | try { | ||||
| loading.value = true; | loading.value = true; | ||||
| let res = await GetStatsHa(commomParams.value.search); | |||||
| let res = await GetStatsMajor(commomParams.value.search); | |||||
| loading.value = false; | loading.value = false; | ||||
| commomParams.value.table.data = res.data.list; | commomParams.value.table.data = res.data.list; | ||||
| commomParams.value.table.columns = cols; | commomParams.value.table.columns = cols; |
| <template> | <template> | ||||
| <a-range-picker @Change="getRange" /> | |||||
| <a-drawer :width="500" title="搜索" placement="right" :open="openSearchModel" @close="onClose"> | |||||
| <template #extra> | |||||
| <a-button style="margin-right: 8px" @click="clearSearch">清空搜索</a-button> | |||||
| <a-button type="primary" @click="getData">搜索</a-button> | |||||
| </template> | |||||
| <a-form :model="commomParams.search"> | |||||
| <a-row :gutter="[10]"> | |||||
| <a-col span="24"> | |||||
| <a-form-item label="选择时间"> | |||||
| <a-range-picker @Change="getRange" style="width: 100%;"/> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </a-form> | |||||
| </a-drawer> | |||||
| </template> | </template> | ||||
| <script lang="ts" setup> | <script lang="ts" setup> | ||||
| import { ref, onMounted, watch, computed } from 'vue'; | import { ref, onMounted, watch, computed } from 'vue'; | ||||
| import { useCommon } from '@/hooks/useCommon'; | import { useCommon } from '@/hooks/useCommon'; | ||||
| let { commomParams, dayjs } = useCommon(); | |||||
| let { store, commomParams, openSearchModel, hideSearch, dayjs } = useCommon(); | |||||
| const dayjsRef = ref(dayjs); | const dayjsRef = ref(dayjs); | ||||
| let props = defineProps(['search_params']); | let props = defineProps(['search_params']); | ||||
| const emit = defineEmits(); | const emit = defineEmits(); | ||||
| openSearchModel = computed(() => { | |||||
| return store.state.openSearchModel; | |||||
| }) | |||||
| interface listType { | interface listType { | ||||
| start_date: String, | start_date: String, | ||||
| end_date: String | end_date: String | ||||
| commomParams.value.search = commomParams.value.search as listType; | commomParams.value.search = commomParams.value.search as listType; | ||||
| commomParams.value.search.start_date = '2020-01-01'; | commomParams.value.search.start_date = '2020-01-01'; | ||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | ||||
| commomParams.value.search.sort = 'work_experience'; | |||||
| commomParams.value.search.sort = 'major'; | |||||
| watch(() => props.search_params, (newVal) => { | watch(() => props.search_params, (newVal) => { | ||||
| emit('searchData', commomParams.value.search) | emit('searchData', commomParams.value.search) | ||||
| immediate: true | immediate: true | ||||
| }) | }) | ||||
| const getRange = (val) => { | |||||
| const getData = () => { | |||||
| commomParams.value.search.start_date = dayjsRef.value(val[0]).format('YYYY-MM-DD'); | commomParams.value.search.start_date = dayjsRef.value(val[0]).format('YYYY-MM-DD'); | ||||
| commomParams.value.search.end_date = dayjsRef.value(val[1]).format('YYYY-MM-DD'); | commomParams.value.search.end_date = dayjsRef.value(val[1]).format('YYYY-MM-DD'); | ||||
| emit('searchData', commomParams.value.search); | emit('searchData', commomParams.value.search); | ||||
| } | |||||
| const getData = () => { | |||||
| emit('searchData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | } | ||||
| // 清空搜索 | // 清空搜索 | ||||
| commomParams.value.search = { | commomParams.value.search = { | ||||
| page: 1, | page: 1, | ||||
| pagesize: 10, | pagesize: 10, | ||||
| sort: 'work_experience', | |||||
| sortby: 'asc', | |||||
| sort: 'major', | |||||
| sortby: 'desc', | |||||
| keyword: '' | keyword: '' | ||||
| } | } | ||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| emit('clearData', commomParams.value.search); | emit('clearData', commomParams.value.search); | ||||
| hideSearch() | |||||
| } | } | ||||
| const onClose = () => { | const onClose = () => { | ||||
| clearSearch() | clearSearch() | ||||
| hideSearch() | |||||
| } | } | ||||
| </script> | </script> | ||||
| <style> | <style> | ||||
| </style> | |||||
| </style> | |||||
| export const cols = <ColType.type[]>[ | |||||
| { | |||||
| title: '专业名', | |||||
| dataIndex: 'major' | |||||
| }, | |||||
| { | |||||
| title: '总数', | |||||
| dataIndex: 'total' | |||||
| } | |||||
| ]; |
| <template> | |||||
| <title-skill-search @searchData="searchData" @clearData="clearData" :search_params="commomParams.search"></title-skill-search> | |||||
| <a-c-operation @refresh="clearData" :need_add="false"></a-c-operation> | |||||
| <!-- <a-c-table :data="commomParams.table.data" :columns="commomParams.table.columns" :pagination="commomParams.page" | |||||
| @page="getPage" :loading="loading"> | |||||
| </a-c-table> --> | |||||
| <a-row> | |||||
| <a-col :span="12"> | |||||
| <div ref="titlePie" style="width: 100%; height: 400px;"></div> | |||||
| </a-col> | |||||
| <a-col :span="12"> | |||||
| <div ref="skillPie" style="width: 100%; height: 400px;"></div> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </template> | |||||
| <script setup lang="ts"> | |||||
| import { ref, onMounted } from 'vue'; | |||||
| import TitleSkillSearch from '@/views/statistics/resume/titleSkill/search/index.vue'; | |||||
| import { GetStatsTitleAndSkill } from '@/apis/models'; | |||||
| import { init } from 'echarts'; | |||||
| import { cols } from '@/views/statistics/resume/holidaysAccommodation/columns'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { commomParams } = useCommon(); | |||||
| let loading = ref<Boolean>(true); | |||||
| const titlePie = ref(null); | |||||
| const skillPie = ref(null); | |||||
| // 设置环形图的数据 | |||||
| const titleData = ref([ | |||||
| { name: '初级', value: 20 }, | |||||
| { name: '中级', value: 30 } | |||||
| ]) | |||||
| const skillData = ref([ | |||||
| { name: '初级工', value: 20 }, | |||||
| { name: '中级工', value: 30 } | |||||
| ]) | |||||
| onMounted(() => { | |||||
| getData(commomParams.value.search); | |||||
| getTitlePieInit() | |||||
| getSkillPieInit() | |||||
| }) | |||||
| const getTitlePieInit = () => { | |||||
| const titlePieOption = init(titlePie.value) | |||||
| const option = { | |||||
| legend: { | |||||
| orient: 'vertical', | |||||
| top: '10%', | |||||
| left: 'left' | |||||
| }, | |||||
| tooltip: { | |||||
| trigger: 'item', | |||||
| formatter: '{a} <br/>{b} : {c} ({d}%)', | |||||
| }, | |||||
| series: [ | |||||
| { | |||||
| name: '职称分布', | |||||
| type: 'pie', | |||||
| radius: ['40%', '70%'], | |||||
| center: ['50%', '50%'], | |||||
| data: titleData.value, | |||||
| emphasis: { | |||||
| itemStyle: { | |||||
| shadowBlur: 10, | |||||
| shadowOffsetX: 0, | |||||
| shadowColor: 'rgba(0, 0, 0, 0.5)', | |||||
| }, | |||||
| }, | |||||
| }, | |||||
| ], | |||||
| }; | |||||
| titlePieOption.setOption(option) | |||||
| } | |||||
| const getSkillPieInit = () => { | |||||
| const skillPieOption = init(skillPie.value) | |||||
| const option = { | |||||
| legend: { | |||||
| orient: 'vertical', | |||||
| top: '10%', | |||||
| left: 'left' | |||||
| }, | |||||
| tooltip: { | |||||
| trigger: 'item', | |||||
| formatter: '{a} <br/>{b} : {c} ({d}%)', | |||||
| }, | |||||
| series: [ | |||||
| { | |||||
| name: '技能分布', | |||||
| type: 'pie', | |||||
| radius: ['40%', '70%'], | |||||
| center: ['50%', '50%'], | |||||
| data: skillData.value, | |||||
| emphasis: { | |||||
| itemStyle: { | |||||
| shadowBlur: 10, | |||||
| shadowOffsetX: 0, | |||||
| shadowColor: 'rgba(0, 0, 0, 0.5)', | |||||
| }, | |||||
| }, | |||||
| }, | |||||
| ], | |||||
| }; | |||||
| skillPieOption.setOption(option) | |||||
| } | |||||
| const searchData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const clearData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const getPage = (data : object) => { | |||||
| commomParams.value.search.page = data.current; | |||||
| commomParams.value.search.pagesize = data.pageSize; | |||||
| getData(); | |||||
| } | |||||
| const getData = async () => { | |||||
| try { | |||||
| loading.value = true; | |||||
| let res = await GetStatsTitleAndSkill(commomParams.value.search); | |||||
| loading.value = false; | |||||
| skillData.value = res.data.skill_cert_list.map(item => { | |||||
| return {name: item.skill_cert, value: item.total} | |||||
| }) | |||||
| getSkillPieInit() | |||||
| titleData.value = res.data.title_stat_list.map(item => { | |||||
| return {name: item.title, value: item.total} | |||||
| }) | |||||
| getTitlePieInit() | |||||
| commomParams.value.page = { | |||||
| current: commomParams.value.search.page, | |||||
| pageSize: commomParams.value.search.pagesize, | |||||
| total: res.data.total, | |||||
| pageSizeOptions: ['10', '20', '30', '40'], | |||||
| hideOnSinglePage: false, | |||||
| showSizeChanger: true | |||||
| }; | |||||
| } catch { | |||||
| loading.value = false; | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> |
| <template> | |||||
| <a-drawer :width="500" title="搜索" placement="right" :open="openSearchModel" @close="onClose"> | |||||
| <template #extra> | |||||
| <a-button style="margin-right: 8px" @click="clearSearch">清空搜索</a-button> | |||||
| <a-button type="primary" @click="getData">搜索</a-button> | |||||
| </template> | |||||
| <a-form :model="commomParams.search"> | |||||
| <a-row :gutter="[10]"> | |||||
| <a-col span="24"> | |||||
| <a-form-item label="选择时间"> | |||||
| <a-range-picker @Change="getRange" style="width: 100%;"/> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </a-form> | |||||
| </a-drawer> | |||||
| </template> | |||||
| <script lang="ts" setup> | |||||
| import { ref, onMounted, watch, computed } from 'vue'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { store, commomParams, openSearchModel, hideSearch, dayjs } = useCommon(); | |||||
| const dayjsRef = ref(dayjs); | |||||
| let props = defineProps(['search_params']); | |||||
| const emit = defineEmits(); | |||||
| openSearchModel = computed(() => { | |||||
| return store.state.openSearchModel; | |||||
| }) | |||||
| interface listType { | |||||
| start_date: String, | |||||
| end_date: String | |||||
| } | |||||
| commomParams.value.search = commomParams.value.search as listType; | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| commomParams.value.search.sort = 'level1'; | |||||
| watch(() => props.search_params, (newVal) => { | |||||
| emit('searchData', commomParams.value.search) | |||||
| }, { | |||||
| immediate: true | |||||
| }) | |||||
| const getData = () => { | |||||
| commomParams.value.search.start_date = dayjsRef.value(val[0]).format('YYYY-MM-DD'); | |||||
| commomParams.value.search.end_date = dayjsRef.value(val[1]).format('YYYY-MM-DD'); | |||||
| emit('searchData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| // 清空搜索 | |||||
| const clearSearch = () => { | |||||
| commomParams.value.search = { | |||||
| page: 1, | |||||
| pagesize: 10, | |||||
| sort: 'level1', | |||||
| sortby: 'desc', | |||||
| keyword: '' | |||||
| } | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| emit('clearData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| const onClose = () => { | |||||
| clearSearch() | |||||
| hideSearch() | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> | |||||
| export const cols = <ColType.type[]>[ | |||||
| { | |||||
| title: '工作经验', | |||||
| dataIndex: 'work_experience' | |||||
| }, | |||||
| { | |||||
| title: '总数', | |||||
| dataIndex: 'total' | |||||
| } | |||||
| ]; |
| <template> | |||||
| <work-experience-search @searchData="searchData" @clearData="clearData" :search_params="commomParams.search"></work-experience-search> | |||||
| <a-c-operation @refresh="clearData" :need_add="false"></a-c-operation> | |||||
| <a-c-table :data="commomParams.table.data" :columns="commomParams.table.columns" :pagination="commomParams.page" | |||||
| @page="getPage" :loading="loading"> | |||||
| </a-c-table> | |||||
| </template> | |||||
| <script setup lang="ts"> | |||||
| import { ref, onMounted } from 'vue'; | |||||
| import WorkExperienceSearch from '@/views/statistics/resume/workExperience/search/index.vue'; | |||||
| import { GetStatsWorkExperience } from '@/apis/models'; | |||||
| import { cols } from '@/views/statistics/resume/workExperience/columns'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { commomParams } = useCommon(); | |||||
| let loading = ref<Boolean>(true); | |||||
| onMounted(() => { | |||||
| getData(commomParams.value.search); | |||||
| }) | |||||
| const searchData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const clearData = (data : object) => { | |||||
| commomParams.value.search = data | |||||
| getData(); | |||||
| } | |||||
| const getPage = (data : object) => { | |||||
| commomParams.value.search.page = data.current; | |||||
| commomParams.value.search.pagesize = data.pageSize; | |||||
| getData(); | |||||
| } | |||||
| const getData = async () => { | |||||
| try { | |||||
| loading.value = true; | |||||
| let res = await GetStatsWorkExperience(commomParams.value.search); | |||||
| loading.value = false; | |||||
| commomParams.value.table.data = res.data.list; | |||||
| commomParams.value.table.columns = cols; | |||||
| commomParams.value.page = { | |||||
| current: commomParams.value.search.page, | |||||
| pageSize: commomParams.value.search.pagesize, | |||||
| total: res.data.total, | |||||
| pageSizeOptions: ['10', '20', '30', '40'], | |||||
| hideOnSinglePage: false, | |||||
| showSizeChanger: true | |||||
| }; | |||||
| } catch { | |||||
| loading.value = false; | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> |
| <template> | |||||
| <a-drawer :width="500" title="搜索" placement="right" :open="openSearchModel" @close="onClose"> | |||||
| <template #extra> | |||||
| <a-button style="margin-right: 8px" @click="clearSearch">清空搜索</a-button> | |||||
| <a-button type="primary" @click="getData">搜索</a-button> | |||||
| </template> | |||||
| <a-form :model="commomParams.search"> | |||||
| <a-row :gutter="[10]"> | |||||
| <a-col span="24"> | |||||
| <a-form-item label="选择时间"> | |||||
| <a-range-picker @Change="getRange" style="width: 100%;"/> | |||||
| </a-form-item> | |||||
| </a-col> | |||||
| </a-row> | |||||
| </a-form> | |||||
| </a-drawer> | |||||
| </template> | |||||
| <script lang="ts" setup> | |||||
| import { ref, onMounted, watch, computed } from 'vue'; | |||||
| import { useCommon } from '@/hooks/useCommon'; | |||||
| let { store, commomParams, openSearchModel, hideSearch, dayjs } = useCommon(); | |||||
| const dayjsRef = ref(dayjs); | |||||
| let props = defineProps(['search_params']); | |||||
| const emit = defineEmits(); | |||||
| openSearchModel = computed(() => { | |||||
| return store.state.openSearchModel; | |||||
| }) | |||||
| interface listType { | |||||
| start_date: String, | |||||
| end_date: String | |||||
| } | |||||
| commomParams.value.search = commomParams.value.search as listType; | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| commomParams.value.search.sort = 'work_experience'; | |||||
| watch(() => props.search_params, (newVal) => { | |||||
| emit('searchData', commomParams.value.search) | |||||
| }, { | |||||
| immediate: true | |||||
| }) | |||||
| const getData = () => { | |||||
| commomParams.value.search.start_date = dayjsRef.value(val[0]).format('YYYY-MM-DD'); | |||||
| commomParams.value.search.end_date = dayjsRef.value(val[1]).format('YYYY-MM-DD'); | |||||
| emit('searchData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| // 清空搜索 | |||||
| const clearSearch = () => { | |||||
| commomParams.value.search = { | |||||
| page: 1, | |||||
| pagesize: 10, | |||||
| sort: 'work_experience', | |||||
| sortby: 'desc', | |||||
| keyword: '' | |||||
| } | |||||
| commomParams.value.search.start_date = '2020-01-01'; | |||||
| commomParams.value.search.end_date = dayjs().format('YYYY-MM-DD'); | |||||
| emit('clearData', commomParams.value.search); | |||||
| hideSearch() | |||||
| } | |||||
| const onClose = () => { | |||||
| clearSearch() | |||||
| hideSearch() | |||||
| } | |||||
| </script> | |||||
| <style> | |||||
| </style> | |||||