|
@@ -0,0 +1,109 @@
|
|
|
|
+<!-- 我的众聘 -->
|
|
|
|
+<template>
|
|
|
|
+ <div class="default-width py-3">
|
|
|
|
+ <v-tabs v-model="tab" align-tabs="start" color="primary" bg-color="#fff" @update:model-value="getPositionList">
|
|
|
|
+ <v-tab :value="1">{{ $t('publicRecruitment.myRecommendation') }}</v-tab>
|
|
|
|
+ <v-tab :value="2">{{ $t('publicRecruitment.myRegistration') }}</v-tab>
|
|
|
|
+ </v-tabs>
|
|
|
|
+ <div class="mt-3">
|
|
|
|
+ <!-- 我的推荐 -->
|
|
|
|
+ <div v-if="tab === 1" class="d-flex">
|
|
|
|
+ <div class="pa-3 mr-3 white-bgc" style="min-height: 500px; border-radius: 5px; flex: 1;">
|
|
|
|
+ <div style="width: 100%;">
|
|
|
|
+ <!-- 统计 -->
|
|
|
|
+ <div class="statisticsBox">
|
|
|
|
+ <div class="statisticsBox-item" v-for="item in statisticsList" :key="item.name">
|
|
|
|
+ <div style="font-size: 18px; color: #333; font-weight: bold;">{{ statistics[item.name] || '0' }}</div>
|
|
|
|
+ <span style="font-size: 13px; color: #666;">{{ item.label }}</span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="topTip">推荐好友入职得赏金/积分</div>
|
|
|
|
+ <!-- 数据 -->
|
|
|
|
+ <div class="dataBox" v-for="(item, index) in dataList" :key="index">
|
|
|
|
+ <v-img class="float-left" :src="item.logoUrl || 'https://minio.citupro.com/dev/menduner/company-avatar.png'" :width="30" :height="30"></v-img>
|
|
|
|
+ <span class="dataBox-name">{{ item.anotherName }}</span>
|
|
|
|
+ <span class="dataBox-address">{{ item.areaName }}</span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 滚动区域 -->
|
|
|
|
+ <div class="pa-3 white-bgc" style="height: 300px; border-radius: 5px; width: 360px;">
|
|
|
|
+ 滚动区域
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 我的报名 -->
|
|
|
|
+ <div v-if="tab === 2" class="pa-3 white-bgc" style="min-height: 500px; border-radius: 5px;">
|
|
|
|
+ <span>456</span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script setup>
|
|
|
|
+import { ref } from 'vue'
|
|
|
|
+defineOptions({name: 'personal-myPublicRecruitment-index'})
|
|
|
|
+
|
|
|
|
+// 数据统计
|
|
|
|
+const statistics = ref({ statisticsA: '3', statisticsB: '7', statisticsC: '5', statisticsD: '2', statisticsE: '1' })
|
|
|
|
+const statisticsList = ref([
|
|
|
|
+ { count: '', label: '已报名', name: 'statisticsA' },
|
|
|
|
+ { count: '', label: '已过筛', name: 'statisticsB' },
|
|
|
|
+ { count: '', label: '已过面', name: 'statisticsC' },
|
|
|
|
+ { count: '', label: '已入职', name: 'statisticsD' },
|
|
|
|
+ { count: '', label: '已结算', name: 'statisticsE' }
|
|
|
|
+])
|
|
|
|
+
|
|
|
|
+const tab = ref(1)
|
|
|
|
+const getPositionList = () => {}
|
|
|
|
+const dataList = ref([
|
|
|
|
+ { anotherName: '132' }
|
|
|
|
+])
|
|
|
|
+</script>
|
|
|
|
+<style lang="scss" scoped>
|
|
|
|
+.topTip {
|
|
|
|
+ color: #999;
|
|
|
|
+ // margin-left: 20px;
|
|
|
|
+ font-size: 14px;
|
|
|
|
+ padding: 5px 10px;
|
|
|
|
+ width: 100%;
|
|
|
|
+ // background-color: var(--default-bgc);
|
|
|
|
+}
|
|
|
|
+.statisticsBox {
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: space-around;
|
|
|
|
+ border-radius: 10px;
|
|
|
|
+ text-align: center;
|
|
|
|
+ padding: 10px 0;
|
|
|
|
+ background-color: var(--default-bgc);
|
|
|
|
+ .statisticsBox-item {
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ &:hover {
|
|
|
|
+ div, span { color: var(--v-primary-base) !important; }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+.dataBox {
|
|
|
|
+ height: 40px;
|
|
|
|
+ line-height: 30px;
|
|
|
|
+ margin-top: 8px;
|
|
|
|
+ .dataBox-name {
|
|
|
|
+ width: 120px;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ max-width: 120px;
|
|
|
|
+ vertical-align: middle;
|
|
|
|
+ white-space: nowrap;
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ color: #666;
|
|
|
|
+ font-size: 13px;
|
|
|
|
+ margin-left: 5px;
|
|
|
|
+ &:hover {
|
|
|
|
+ color: var(--v-primary-base);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .dataBox-address {
|
|
|
|
+ color: #555;
|
|
|
|
+ font-size: 13px;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+</style>
|