sannongshichangwang/components/job/list_jobHunting.vue

<template>
    <!-- 求职列表页 -->
    <main class="index_main">
        <section class="table_out clearfix">
            <div class="table_head clearfix phone_none">
                <div class="table_head_name">姓名</div>
                <div class="table_head_job">岗位</div>
                <div class="table_head_sex">性别</div>
                <div class="table_head_experience">工作经验</div>
                <div class="table_head_native">籍贯</div>
                <div class="table_head_industry">所属行业</div>
                <div class="table_head_address">地区</div>
                <div class="table_head_time">时间</div>
            </div>
            <div class="table_ul clearfix">
                <div class="table_li clearfix" v-for="(item, index) in jobList" :key="index">
                    <NuxtLink class="table_li_a clearfix" :href="getLinkPathDetail(item)" :title="item.name">
                        <div class="table_li_name dot1">
                            <label class="table_li_label pc_none">姓名:</label>
                            <div class="table_li_name_in dot1">
                                {{ item.name }}
                            </div>
                        </div>
                        <div class="table_li_job dot1">
                            <label class="table_li_label pc_none">岗位:</label>
                            <div class="table_li_text dot1">
                                {{ item.jtzw_name }}
                            </div>
                        </div>
                        <div class="table_li_sex dot1">
                            <label class="table_li_label pc_none">性别:</label>
                            <div class="table_li_text dot1">
                                {{ item.sexy ? '男' : '女' }}
                            </div>
                        </div>
                        <div class="table_li_experience dot1">
                            <label class="table_li_label pc_none">工作经验:</label>
                            <div class="table_li_text dot1">
                                {{ item.experience_name }}
                            </div>
                        </div>
                        <div class="table_li_native dot1">
                            <label class="table_li_label pc_none">籍贯:</label>
                            <div class="table_li_text dot1">
                                {{ item.origin }}
                            </div>
                        </div>
                        <div class="table_li_industry dot1">
                            <label class="table_li_label pc_none">所属行业:</label>
                            <div class="table_li_text dot1">
                                {{ item.hy_name }}
                            </div>
                        </div>
                        <div class="table_li_address">
                            <label class="table_li_label pc_none">地区:</label>
                            <span class="table_li_in dot1">
                                {{ item.city_name }}
                            </span>
                        </div>
                        <div class="table_li_time dot1">
                            <label class="table_li_label pc_none">时间:</label>
                            <span class="table_li_in dot1">
                                {{ getTime(item.updated_at, 'year', 1) }}
                            </span>
                        </div>
                    </NuxtLink>
                </div>
            </div>
            <div class="empty" v-if="jobList == false">
                <img src="@/public/topic/empty.png" alt="" class="empty_img">
                <span class="empty_text">当前暂无数据</span>
            </div>
        </section>
    </main>
    <!-- 分页器 -->
    <div class="pagination11" v-if="jobList != false">
        <div class="pagination">
            <el-pagination background layout="prev, pager, next" :total="total" :page-size="pageSize" prev-text="上一页"
                next-text="下一页" @current-change="changePage" />
        </div>
    </div>
</template>


<script setup>
//0.加载页面依赖 start ---------------------------------------->
import { ref, onMounted } from 'vue';
import { ElMessage, ElPagination } from 'element-plus';
import { NuxtLink } from '#components';
//0.加载页面依赖 end ---------------------------------------->

//1.获得路由id start ---------------------------------------->
const targetSegment = getRoutePath(3);
//1.1 获得当前的路由id
let navTitle = ref('')//二级导航标题
let navCid = ref('')//二级导航id
//通过导航路径反向查询导航id
const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
    method: 'GET',
    query: {
        'pinyin': targetSegment,
    },
});
if (getRouteId.code == 200) {
    navTitle.value = getRouteId.data.alias
    navCid.value = getRouteId.data.category_id
} else {
    console.log("获得路由id出错！", getRouteId.message)
}

//1.获得路由id end ---------------------------------------->

// 获取商品数据列表 start--------------------------------------->
const jobList = ref()
const page = ref(1)
const pageSize = ref(10)
const total = ref()
const getJobsList = await requestDataPromise('/web/getWebsiteJobList', {
    method: 'GET',
    query: {
        'catid': navCid.value,
        'page': page.value,
        'pageSize': pageSize.value,
        'type': 2
    },
});
console.log("获取数据列表job", getJobsList.data.JobHunting);

if (getJobsList.code == 200) {
    jobList.value = getJobsList.data.JobHunting
    total.value = getJobsList.data.hunt_count
}
// 获取商品数据 end----------------------------------------->

//4.页面数据 end ---------------------------------------->

</script>

<style lang="less" scoped>
@import url('@/assets/css/job/list_qiuzhi.less');
</style>