|
@@ -1,40 +1,63 @@
|
|
|
<template>
|
|
|
- <div class="overview my-5">
|
|
|
- <div class="overview-item pa-5 color-666" v-for="(val, i) in overview" :key="i">
|
|
|
- <div class="d-flex">
|
|
|
- <div>{{ val.title }}</div>
|
|
|
- <v-tooltip :text="val.desc" location="top">
|
|
|
- <template v-slot:activator="{ props }">
|
|
|
- <span v-bind="props" class="mdi mdi-information-outline ml-1"></span>
|
|
|
- </template>
|
|
|
- </v-tooltip>
|
|
|
- </div>
|
|
|
- <div class="overview-item-value my-3">{{ val.value }}</div>
|
|
|
- <div class="font-size-14">
|
|
|
- 环比
|
|
|
- <span class="color-error">0% ↑</span>
|
|
|
+ <div>
|
|
|
+ <div class="overview my-5">
|
|
|
+ <div class="overview-item pa-5 color-666" v-for="(val, i) in overview" :key="i">
|
|
|
+ <div class="d-flex">
|
|
|
+ <div>{{ val.title }}</div>
|
|
|
+ <v-tooltip :text="val.desc" location="top">
|
|
|
+ <template v-slot:activator="{ props }">
|
|
|
+ <span v-bind="props" class="mdi mdi-information-outline ml-1"></span>
|
|
|
+ </template>
|
|
|
+ </v-tooltip>
|
|
|
+ </div>
|
|
|
+ <div class="overview-item-value my-3">{{ overviewData[val.key] }}</div>
|
|
|
+ <div class="font-size-14">
|
|
|
+ 环比
|
|
|
+ <span class="color-error">{{ typeof val.ratio === 'number' ? val.ratio : overviewData[val.ratio] }}% ↑</span>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div id="myChart" style="width: 100%; height: 500px;background-color: #f7f8fa;border-radius: 8px;" class="pa-3"></div>
|
|
|
</div>
|
|
|
- <div id="myChart" style="width: 100%; height: 500px;background-color: #f7f8fa;border-radius: 8px;" class="pa-3"></div>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
defineOptions({ name: 'overview-page'})
|
|
|
-import { ref, onMounted } from 'vue'
|
|
|
+import { ref, onMounted, watch } from 'vue'
|
|
|
import * as echarts from 'echarts'
|
|
|
+import { getRecentConversations } from '@/api/recruit/enterprise/statistics'
|
|
|
+
|
|
|
+const props = defineProps({
|
|
|
+ query: Object
|
|
|
+})
|
|
|
|
|
|
+const overviewData = ref({
|
|
|
+ position: 0,
|
|
|
+ resume: 0,
|
|
|
+ viewResume: 0,
|
|
|
+ dealResume: 0,
|
|
|
+ interview: 0
|
|
|
+})
|
|
|
// 数据概况
|
|
|
const overview = ref([
|
|
|
- { title: '职位浏览量', value: 86, desc: '指全部职位被候选人查看的人数总和' },
|
|
|
- { title: '收到简历量', value: 12, desc: '指全部职位收到简历的总数' },
|
|
|
- { title: '查看收到简历', value: 0, desc: '指查看候选人主动发送的简历数量' },
|
|
|
- { title: '已处理简历', value: 4, desc: '指招聘方标记"通过筛选"与"不合适"的简历数' },
|
|
|
- { title: '主动联系我的人', value: 0, desc: '指候选人主动发起沟通的人数' },
|
|
|
- { title: '我主动联系的人', value: 5, desc: '指候选人主动发起沟通的人数' },
|
|
|
- { title: '面试数量', value: 0, desc: '面试人数的总数' }
|
|
|
+ { title: '职位浏览量', key: 'position', ratio: 0, desc: '指全部职位被候选人查看的人数总和' },
|
|
|
+ { title: '收到简历量', key: 'resume', ratio: 0, desc: '指全部职位收到简历的总数' },
|
|
|
+ { title: '查看收到简历', key: 'viewResume', ratio: 0, desc: '指查看候选人主动发送的简历数量' },
|
|
|
+ { title: '已处理简历', key: 'dealResume', ratio: 0, desc: '指招聘方标记"通过筛选"与"不合适"的简历数' },
|
|
|
+ { title: '主动联系我的人', key: 'activeContactCount', ratio: 'qqactiveContactCount', desc: '指候选人主动发起沟通的人数' },
|
|
|
+ { title: '我主动联系的人', key: 'usContactCount', ratio: 'qqUsContactCount', desc: '指候选人主动发起沟通的人数' },
|
|
|
+ { title: '面试数量', key: 'interview', ratio: 0, desc: '面试人数的总数' }
|
|
|
])
|
|
|
|
|
|
+// 主动联系我的、我主动联系的人
|
|
|
+const accountInfo = localStorage.getItem('accountInfo') ? JSON.parse(localStorage.getItem('accountInfo')) : {}
|
|
|
+const getRecent = async () => {
|
|
|
+ if (!accountInfo || !accountInfo.userId) return
|
|
|
+ const data = await getRecentConversations({ userId: accountInfo.userId, ...props.query })
|
|
|
+ overviewData.value = Object.assign(overviewData.value, data)
|
|
|
+}
|
|
|
+getRecent()
|
|
|
+
|
|
|
onMounted(() => {
|
|
|
var chartDom = document.getElementById('myChart')
|
|
|
var myChart = echarts.init(chartDom)
|
|
@@ -128,6 +151,14 @@ onMounted(() => {
|
|
|
}
|
|
|
option && myChart.setOption(option)
|
|
|
})
|
|
|
+
|
|
|
+watch(
|
|
|
+ () => props.query,
|
|
|
+ (val) => {
|
|
|
+ if (val) getRecent()
|
|
|
+ },
|
|
|
+ { deep: true }
|
|
|
+)
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|