mirror of
https://github.com/geekgeekrun/geekgeekrun.git
synced 2026-09-08 00:47:15 +08:00
add the logic to view the job info change history
This commit is contained in:
geekgeekrun
@@ -0,0 +1,87 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-table :data="dataForRender">
|
||||
<el-table-column prop="title" label="" width="120px" fixed />
|
||||
<el-table-column
|
||||
v-for="(item, index) in tableProps"
|
||||
:key="index"
|
||||
:prop="item.value"
|
||||
:label="item.label"
|
||||
>
|
||||
<template #header>
|
||||
{{ dayjs(item.value).format('YYYY-MM-DD HH:mm:ss') }}
|
||||
</template>
|
||||
<template #default="{ row }">
|
||||
<div class="of-auto">
|
||||
<pre>{{ row[item.value] }}</pre>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { PropType, computed } from 'vue'
|
||||
import { type VChatStartupLog } from '@geekgeekrun/sqlite-plugin/src/entity/VChatStartupLog'
|
||||
import { JobInfoChangeLog } from '@geekgeekrun/sqlite-plugin/src/entity/JobInfoChangeLog'
|
||||
import { ElTable, ElTableColumn } from 'element-plus'
|
||||
import dayjs from 'dayjs'
|
||||
|
||||
const props = defineProps({
|
||||
jobInfo: {
|
||||
type: Object as PropType<VChatStartupLog>,
|
||||
required: true
|
||||
},
|
||||
jobInfoHistoryList: {
|
||||
type: Array as PropType<JobInfoChangeLog[]>,
|
||||
default: () => []
|
||||
}
|
||||
})
|
||||
|
||||
const tableProps = computed(() =>
|
||||
props.jobInfoHistoryList.map((it) => {
|
||||
return {
|
||||
label: it.__ggr_updateTime,
|
||||
value: it.__ggr_updateTime
|
||||
}
|
||||
})
|
||||
)
|
||||
/**
|
||||
* 定义映射字段表(最好取全量字段)
|
||||
* */
|
||||
const mapObj = {
|
||||
jobName: '职位名称',
|
||||
positionName: '职位分类',
|
||||
experienceName: '工作经验',
|
||||
degreeName: '学历',
|
||||
salaryDesc: '薪资',
|
||||
postDescription: '职位描述',
|
||||
locationName: '工作地点',
|
||||
address: '地址'
|
||||
}
|
||||
|
||||
const dataForRender = computed(() => {
|
||||
const newArr = []
|
||||
const keys = Object.keys(mapObj)
|
||||
keys.forEach((key, keyIndex) => {
|
||||
const obj = {
|
||||
title: mapObj[key]
|
||||
}
|
||||
tableProps.value.forEach((dateKey, dataKeyIndex) => {
|
||||
obj[dateKey.value] = props.jobInfoHistoryList[dataKeyIndex][keys[keyIndex]]
|
||||
})
|
||||
newArr.push(obj)
|
||||
})
|
||||
return newArr
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.form {
|
||||
:deep(.el-form-item__label) {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="scss"></style>
|
||||
@@ -38,7 +38,7 @@
|
||||
link
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="handleViewJobHistoryButtonClick(row.encryptJobId)"
|
||||
@click="handleViewJobHistoryButtonClick(row)"
|
||||
>变更记录</ElButton
|
||||
>
|
||||
<ElButton
|
||||
@@ -77,6 +77,27 @@
|
||||
@closed="selectedJobInfoForViewSnapshot = null"
|
||||
/>
|
||||
</ElDrawer>
|
||||
<ElDialog
|
||||
v-model="historyDialogVisibleModelValue"
|
||||
width="100%"
|
||||
:style="{
|
||||
margin: 0,
|
||||
height: 'fit-content',
|
||||
minHeight: '100%'
|
||||
}"
|
||||
>
|
||||
<JobInfoHistoryList
|
||||
v-if="selectedJobInfoForViewHistory"
|
||||
:job-info="selectedJobInfoForViewHistory"
|
||||
:job-info-history-list="selectedJobHistory ?? []"
|
||||
@closed="
|
||||
() => {
|
||||
selectedJobInfoForViewHistory = null
|
||||
selectedJobHistory = null
|
||||
}
|
||||
"
|
||||
/>
|
||||
</ElDialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -84,8 +105,10 @@
|
||||
import { ref, onMounted, onBeforeUnmount } from 'vue'
|
||||
import { ElTable, ElTableColumn, ElButton, ElPagination, ElDrawer } from 'element-plus'
|
||||
import { type VChatStartupLog } from '@geekgeekrun/sqlite-plugin/src/entity/VChatStartupLog'
|
||||
import { type JobInfoChangeLog } from '@geekgeekrun/sqlite-plugin/src/entity/JobInfoChangeLog'
|
||||
import { PageReq, PagedRes } from '../../../../common/types/pagination'
|
||||
import JobInfoSnapshot from '../../features/JobInfoSnapshot/index.vue'
|
||||
import JobInfoHistoryList from '../../features/JobInfoHistoryList/index.vue'
|
||||
|
||||
const tableData = ref<VChatStartupLog[]>([])
|
||||
const pageSizeList = ref<number[]>([100, 200, 300, 400])
|
||||
@@ -145,12 +168,65 @@ async function handleViewJobOnlineButtonClick(encryptJobId: string) {
|
||||
url: `https://www.zhipin.com/job_detail/${encryptJobId}.html`
|
||||
})
|
||||
}
|
||||
async function handleViewJobHistoryButtonClick(encryptJobId: string) {
|
||||
const historyList = await electron.ipcRenderer.invoke(
|
||||
'get-job-history-by-encrypt-id',
|
||||
encryptJobId
|
||||
)
|
||||
void historyList
|
||||
|
||||
const historyDialogVisibleModelValue = ref(false)
|
||||
const selectedJobInfoForViewHistory = ref<VChatStartupLog | null>(null)
|
||||
const selectedJobHistory = ref<null | JobInfoChangeLog[]>(null)
|
||||
async function handleViewJobHistoryButtonClick(record: VChatStartupLog) {
|
||||
// let { data: historyList } = await electron.ipcRenderer.invoke(
|
||||
// 'get-job-history-by-encrypt-id',
|
||||
// record.encryptJobId
|
||||
// )
|
||||
|
||||
// historyList = historyList.map((it) => ({
|
||||
// ...it,
|
||||
// ...(() => {
|
||||
// try {
|
||||
// return JSON.parse(it.dataAsJson)
|
||||
// } catch {
|
||||
// return {}
|
||||
// }
|
||||
// })(),
|
||||
// __ggr_updateTime: new Date(it.updateTime)
|
||||
// }))
|
||||
const { data: historyList } = await Promise.resolve({
|
||||
data: [
|
||||
{
|
||||
id: 569,
|
||||
encryptJobId: 'f0bf76bbd1d8dcf71Hxz2du8EFFY',
|
||||
updateTime: '2024-10-04T00:12:20.941Z',
|
||||
dataAsJson:
|
||||
'{"encryptId":"f0bf76bbd1d8dcf71Hxz2du8EFFY","encryptUserId":"cf615f0b2a5db54a1Xxz2N26Fls~","invalidStatus":false,"jobName":"前端工程师","position":100901,"positionName":"前端开发工程师1","location":101010100,"locationName":"北京4","experienceName":"3-5年","degreeName":"本科","jobType":0,"proxyJob":0,"proxyType":0,"salaryDesc":"12-15K","payTypeDesc":null,"postDescription":"熟练使用HTML,CSS，JAVASCRIPT;\\n熟练使用NPM或Yarn包管理工具；\\n掌握Sass，PostCss，Less，Stylus进行CSS预处理；\\n熟练使用VITE或Webpack打包工具；\\n精通使用Vue 3.0 、element-PLUS等主流前端框架，熟练使用Vue状态管理，路由配置，vue-loader预处理，组件自定义；\\n熟练使用axios网络组件，掌握使用Cookies，以及网络请求前端加解密技术；\\n熟练掌握前端组件化开发，前端开发框架搭建；\\n掌握前端缓存技术；\\n了解前端优化技巧，并且根据实际情况进行前端框架优化；\\n了解常见前端攻击方式以及预防方法；\\n熟练掌握echarts图表组件，能够对大数据量多图表页面进行性能优化；","encryptAddressId":"6914d969b01eafe21nd409S7FVFSxIm9Wfqf","address":"北京海淀区中软大厦.","longitude":116.334251,"latitude":39.958087,"staticMapUrl":"https://img.bosszhipin.com/beijin/upload/amap_proxy/20230428/48ba41acc9cef1bf3f3c8ba446b40b7757c453bede60b22f6bb61e3b7bce0931da574d19d1d82c88.jpg","pcStaticMapUrl":"https://img.bosszhipin.com/beijin/upload/amap_proxy/20230608/48ba41acc9cef1bf03ae3ae84352bc0cfa3e4b77ee71ca986bb61e3b7bce0931da574d19d1d82c88.jpg","overseasAddressList":[],"overseasInfo":null,"showSkills":["JavaScript","Vue"],"anonymous":0,"jobStatusDesc":"最新"}'
|
||||
},
|
||||
{
|
||||
id: 570,
|
||||
encryptJobId: 'f0bf76bbd1d8dcf71Hxz2du8EFFY',
|
||||
updateTime: '2024-10-04T00:12:21.941Z',
|
||||
dataAsJson:
|
||||
'{"encryptId":"f0bf76bbd1d8dcf71Hxz2du8EFFY","encryptUserId":"cf615f0b2a5db54a1Xxz2N26Fls~","invalidStatus":false,"jobName":"前端工程师","position":100901,"positionName":"前端开发工程师2","location":101010100,"locationName":"北京5","experienceName":"3-5年","degreeName":"本科","jobType":0,"proxyJob":0,"proxyType":0,"salaryDesc":"12-15K","payTypeDesc":null,"postDescription":"熟练使用HTML,CSS，JAVASCRIPT;\\n熟练使用NPM或Yarn包管理工具；\\n掌握Sass，PostCss，Less，Stylus进行CSS预处理；\\n熟练使用VITE或Webpack打包工具；\\n精通使用Vue 3.0 、element-PLUS等主流前端框架，熟练使用Vue状态管理，路由配置，vue-loader预处理，组件自定义；\\n熟练使用axios网络组件，掌握使用Cookies，以及网络请求前端加解密技术；\\n熟练掌握前端组件化开发，前端开发框架搭建；\\n掌握前端缓存技术；\\n了解前端优化技巧，并且根据实际情况进行前端框架优化；\\n了解常见前端攻击方式以及预防方法；\\n熟练掌握echarts图表组件，能够对大数据量多图表页面进行性能优化；","encryptAddressId":"6914d969b01eafe21nd409S7FVFSxIm9Wfqf","address":"北京海淀区中软大厦.","longitude":116.334251,"latitude":39.958087,"staticMapUrl":"https://img.bosszhipin.com/beijin/upload/amap_proxy/20230428/48ba41acc9cef1bf3f3c8ba446b40b7757c453bede60b22f6bb61e3b7bce0931da574d19d1d82c88.jpg","pcStaticMapUrl":"https://img.bosszhipin.com/beijin/upload/amap_proxy/20230608/48ba41acc9cef1bf03ae3ae84352bc0cfa3e4b77ee71ca986bb61e3b7bce0931da574d19d1d82c88.jpg","overseasAddressList":[],"overseasInfo":null,"showSkills":["JavaScript","Vue"],"anonymous":0,"jobStatusDesc":"最新"}'
|
||||
},
|
||||
{
|
||||
id: 571,
|
||||
encryptJobId: 'f0bf76bbd1d8dcf71Hxz2du8EFFY',
|
||||
updateTime: '2024-10-04T00:12:22.941Z',
|
||||
dataAsJson:
|
||||
'{"encryptId":"f0bf76bbd1d8dcf71Hxz2du8EFFY","encryptUserId":"cf615f0b2a5db54a1Xxz2N26Fls~","invalidStatus":false,"jobName":"前端工程师","position":100901,"positionName":"前端开发工程师3","location":101010100,"locationName":"北京6","experienceName":"3-5年","degreeName":"本科","jobType":0,"proxyJob":0,"proxyType":0,"salaryDesc":"12-15K","payTypeDesc":null,"postDescription":"熟练使用HTML,CSS，JAVASCRIPT;\\n熟练使用NPM或Yarn包管理工具；\\n掌握Sass，PostCss，Less，Stylus进行CSS预处理；\\n熟练使用VITE或Webpack打包工具；\\n精通使用Vue 3.0 、element-PLUS等主流前端框架，熟练使用Vue状态管理，路由配置，vue-loader预处理，组件自定义；\\n熟练使用axios网络组件，掌握使用Cookies，以及网络请求前端加解密技术；\\n熟练掌握前端组件化开发，前端开发框架搭建；\\n掌握前端缓存技术；\\n了解前端优化技巧，并且根据实际情况进行前端框架优化；\\n了解常见前端攻击方式以及预防方法；\\n熟练掌握echarts图表组件，能够对大数据量多图表页面进行性能优化；","encryptAddressId":"6914d969b01eafe21nd409S7FVFSxIm9Wfqf","address":"北京海淀区中软大厦.","longitude":116.334251,"latitude":39.958087,"staticMapUrl":"https://img.bosszhipin.com/beijin/upload/amap_proxy/20230428/48ba41acc9cef1bf3f3c8ba446b40b7757c453bede60b22f6bb61e3b7bce0931da574d19d1d82c88.jpg","pcStaticMapUrl":"https://img.bosszhipin.com/beijin/upload/amap_proxy/20230608/48ba41acc9cef1bf03ae3ae84352bc0cfa3e4b77ee71ca986bb61e3b7bce0931da574d19d1d82c88.jpg","overseasAddressList":[],"overseasInfo":null,"showSkills":["JavaScript","Vue"],"anonymous":0,"jobStatusDesc":"最新"}'
|
||||
}
|
||||
].map((it) => ({
|
||||
...it,
|
||||
...(() => {
|
||||
try {
|
||||
return JSON.parse(it.dataAsJson)
|
||||
} catch {
|
||||
return {}
|
||||
}
|
||||
})(),
|
||||
__ggr_updateTime: new Date(it.updateTime)
|
||||
}))
|
||||
})
|
||||
historyDialogVisibleModelValue.value = true
|
||||
selectedJobInfoForViewHistory.value = record
|
||||
selectedJobHistory.value = historyList
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user