|
|
@@ -0,0 +1,460 @@
|
|
|
+<script setup lang="ts">
|
|
|
+import { clientDel, clientGet, clientPost, clientPut } from '@/utils/request.ts'
|
|
|
+import { onMounted, ref, reactive } from 'vue'
|
|
|
+import type { BaseResponse } from '@/utils/type.ts'
|
|
|
+import { ElMessage, ElMessageBox, ElUpload } from 'element-plus'
|
|
|
+import { Search, Plus, Edit, Delete, RefreshCw, Upload, Download } from 'lucide-vue-next'
|
|
|
+
|
|
|
+interface JobPosting {
|
|
|
+ id: string;
|
|
|
+ companyName: string;
|
|
|
+ jobOpenings: string;
|
|
|
+ keyTerms: string;
|
|
|
+ jobRequirements: string;
|
|
|
+ numberRecruits: string;
|
|
|
+ salary: string;
|
|
|
+ workLocation: string;
|
|
|
+ contact: string;
|
|
|
+ contactInformation: string;
|
|
|
+ remarks: string;
|
|
|
+ createTime: string;
|
|
|
+ updateTime: string;
|
|
|
+}
|
|
|
+
|
|
|
+interface JobPostingList extends BaseResponse {
|
|
|
+ data: {
|
|
|
+ records: JobPosting[];
|
|
|
+ total: number;
|
|
|
+ };
|
|
|
+}
|
|
|
+
|
|
|
+const loading = ref(false)
|
|
|
+const tableData = ref<JobPosting[]>([])
|
|
|
+const total = ref(0)
|
|
|
+const dialogVisible = ref(false)
|
|
|
+const dialogTitle = ref('新增岗位')
|
|
|
+const isEdit = ref(false)
|
|
|
+const selectedIds = ref<string[]>([])
|
|
|
+const BASE_URL = import.meta.env.VITE_APP_BASE_API
|
|
|
+
|
|
|
+const uploadRef = ref() // 上传组件引用
|
|
|
+
|
|
|
+// 分页参数
|
|
|
+const pagination = reactive({
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10
|
|
|
+})
|
|
|
+
|
|
|
+// 搜索参数
|
|
|
+const searchForm = reactive({
|
|
|
+ companyName: '',
|
|
|
+ jobOpenings: '',
|
|
|
+ workLocation: ''
|
|
|
+})
|
|
|
+
|
|
|
+// 表单数据
|
|
|
+const formData = ref<Partial<JobPosting>>({
|
|
|
+ companyName: '',
|
|
|
+ jobOpenings: '',
|
|
|
+ keyTerms: '',
|
|
|
+ jobRequirements: '',
|
|
|
+ numberRecruits: '',
|
|
|
+ salary: '',
|
|
|
+ workLocation: '',
|
|
|
+ contact: '',
|
|
|
+ contactInformation: '',
|
|
|
+ remarks: ''
|
|
|
+})
|
|
|
+
|
|
|
+const getList = async () => {
|
|
|
+ loading.value = true
|
|
|
+ try {
|
|
|
+ const arr:{
|
|
|
+ value:string,
|
|
|
+ column: string,
|
|
|
+ type:string
|
|
|
+ }[] = [];
|
|
|
+ if(searchForm.companyName){
|
|
|
+ arr.push({
|
|
|
+ value: searchForm.companyName,
|
|
|
+ column: 'company_name',
|
|
|
+ type: 'like'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if(searchForm.jobOpenings){
|
|
|
+ arr.push({
|
|
|
+ value: searchForm.jobOpenings,
|
|
|
+ column: 'job_openings',
|
|
|
+ type: 'like'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if(searchForm.workLocation){
|
|
|
+ arr.push({
|
|
|
+ value: searchForm.workLocation,
|
|
|
+ column: 'work_location',
|
|
|
+ type: 'like'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ const res = await clientGet<{pageNum: number, pageSize: number, conditionJson: string},JobPostingList>('/park/smartEmployment/findByPage',{
|
|
|
+ params: {
|
|
|
+ pageNum: pagination.pageNum,
|
|
|
+ pageSize: pagination.pageSize,
|
|
|
+ conditionJson: encodeURIComponent(JSON.stringify(arr))
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if(res.code !== 200){
|
|
|
+ ElMessage.error(res.msg)
|
|
|
+ return
|
|
|
+ }
|
|
|
+ tableData.value = res.data.records
|
|
|
+ total.value = res.data.total
|
|
|
+ } finally {
|
|
|
+ loading.value = false
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const handleSearch = () => {
|
|
|
+ pagination.pageNum = 1
|
|
|
+ getList()
|
|
|
+}
|
|
|
+
|
|
|
+const handleReset = () => {
|
|
|
+ Object.assign(searchForm, {
|
|
|
+ companyName: '',
|
|
|
+ jobOpenings: '',
|
|
|
+ workLocation: ''
|
|
|
+ })
|
|
|
+ pagination.pageNum = 1
|
|
|
+ getList()
|
|
|
+}
|
|
|
+
|
|
|
+const handleAdd = () => {
|
|
|
+ dialogTitle.value = '新增岗位'
|
|
|
+ isEdit.value = false
|
|
|
+ formData.value = {
|
|
|
+ companyName: '',
|
|
|
+ jobOpenings: '',
|
|
|
+ keyTerms: '',
|
|
|
+ jobRequirements: '',
|
|
|
+ numberRecruits: '',
|
|
|
+ salary: '',
|
|
|
+ workLocation: '',
|
|
|
+ contact: '',
|
|
|
+ contactInformation: '',
|
|
|
+ remarks: ''
|
|
|
+ }
|
|
|
+ dialogVisible.value = true
|
|
|
+}
|
|
|
+
|
|
|
+const getById = async (id: string) => {
|
|
|
+ const res = await clientGet(`/park/smartEmployment/getById/${id}`)
|
|
|
+ return res.data // res.data 就是 JobPosting
|
|
|
+}
|
|
|
+
|
|
|
+const handleEdit = async (row: JobPosting) => {
|
|
|
+ dialogTitle.value = '编辑岗位'
|
|
|
+ isEdit.value = true
|
|
|
+ loading.value = true
|
|
|
+ try {
|
|
|
+ const data = await getById(row.id)
|
|
|
+ formData.value = { ...data }
|
|
|
+ dialogVisible.value = true
|
|
|
+ } catch (error) {
|
|
|
+ ElMessage.error('获取岗位详情失败')
|
|
|
+ } finally {
|
|
|
+ loading.value = false
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const handleSave = async () => {
|
|
|
+ loading.value = true
|
|
|
+ try {
|
|
|
+ let res: BaseResponse
|
|
|
+ if (isEdit.value) {
|
|
|
+ res = await clientPut<JobPosting,BaseResponse>('/park/smartEmployment/updateById', formData.value as JobPosting)
|
|
|
+ } else {
|
|
|
+ res = await clientPost<JobPosting,BaseResponse>('/park/smartEmployment/save', formData.value as JobPosting)
|
|
|
+ }
|
|
|
+ if(res.code !== 200){
|
|
|
+ ElMessage.error(res.msg)
|
|
|
+ return
|
|
|
+ }
|
|
|
+ ElMessage.success(res.msg)
|
|
|
+ dialogVisible.value = false
|
|
|
+ getList()
|
|
|
+ } finally {
|
|
|
+ loading.value = false
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const handleDelete = async (row: JobPosting) => {
|
|
|
+ try {
|
|
|
+ await ElMessageBox.confirm('确定要删除这个岗位吗？', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ })
|
|
|
+
|
|
|
+ const res = await clientDel<string[],BaseResponse>('/park/smartEmployment/deleteBatchById',{
|
|
|
+ params:{
|
|
|
+ ids: [row.id]
|
|
|
+ }
|
|
|
+ },'comma')
|
|
|
+
|
|
|
+ if(res.code !== 200){
|
|
|
+ ElMessage.error(res.msg)
|
|
|
+ return
|
|
|
+ }
|
|
|
+ ElMessage.success(res.msg)
|
|
|
+ getList()
|
|
|
+ } catch {}
|
|
|
+}
|
|
|
+
|
|
|
+const handleBatchDelete = async () => {
|
|
|
+ if (selectedIds.value.length === 0) {
|
|
|
+ ElMessage.warning('请选择要删除的岗位')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ try {
|
|
|
+ await ElMessageBox.confirm(`确定要删除选中的 ${selectedIds.value.length} 个岗位吗？`, '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ })
|
|
|
+ const res = await clientDel<string[],BaseResponse>('/park/smartEmployment/deleteBatchById',{
|
|
|
+ params:{
|
|
|
+ ids: selectedIds.value
|
|
|
+ }
|
|
|
+ },'comma')
|
|
|
+ if(res.code !== 200){
|
|
|
+ ElMessage.error(res.msg)
|
|
|
+ return
|
|
|
+ }
|
|
|
+ ElMessage.success(res.msg)
|
|
|
+ selectedIds.value = []
|
|
|
+ getList()
|
|
|
+ } catch {}
|
|
|
+}
|
|
|
+
|
|
|
+const handleSelectionChange = (selection: JobPosting[]) => {
|
|
|
+ selectedIds.value = selection.map(item => item.id)
|
|
|
+}
|
|
|
+
|
|
|
+const handlePageChange = (page: number) => {
|
|
|
+ pagination.pageNum = page
|
|
|
+ getList()
|
|
|
+}
|
|
|
+
|
|
|
+const handleSizeChange = (size: number) => {
|
|
|
+ pagination.pageSize = size
|
|
|
+ pagination.pageNum = 1
|
|
|
+ getList()
|
|
|
+}
|
|
|
+
|
|
|
+/** ===== Excel 相关接口 ===== **/
|
|
|
+
|
|
|
+// 导出 Excel
|
|
|
+const handleExport = async () => {
|
|
|
+ try {
|
|
|
+ const conditionJson = encodeURIComponent(JSON.stringify([]))
|
|
|
+ const res = await clientGet<null, Blob>('/park/smartEmployment/exportExcel', {
|
|
|
+ params: { conditionJson },
|
|
|
+ responseType: 'blob'
|
|
|
+ })
|
|
|
+ const blob = new Blob([res as any], { type: 'application/vnd.ms-excel' })
|
|
|
+ const url = window.URL.createObjectURL(blob)
|
|
|
+ const a = document.createElement('a')
|
|
|
+ a.href = url
|
|
|
+ a.download = '智慧用工信息.xlsx'
|
|
|
+ a.click()
|
|
|
+ window.URL.revokeObjectURL(url)
|
|
|
+ } catch (e) {
|
|
|
+ ElMessage.error('导出失败')
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// 下载模板
|
|
|
+const handleDownloadTemplate = async () => {
|
|
|
+ try {
|
|
|
+ const res = await clientGet<null, Blob>('/park/smartEmployment/downloadTemplateWord', {
|
|
|
+ responseType: 'blob'
|
|
|
+ })
|
|
|
+ const blob = new Blob([res as any], { type: 'application/vnd.ms-excel' })
|
|
|
+ const url = window.URL.createObjectURL(blob)
|
|
|
+ const a = document.createElement('a')
|
|
|
+ a.href = url
|
|
|
+ a.download = '智慧用工信息模板.xlsx'
|
|
|
+ a.click()
|
|
|
+ window.URL.revokeObjectURL(url)
|
|
|
+ } catch (e) {
|
|
|
+ ElMessage.error('下载模板失败')
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// 导入 Excel
|
|
|
+const handleImportSuccess = (res: any) => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ ElMessage.success('导入成功')
|
|
|
+ getList()
|
|
|
+ } else {
|
|
|
+ ElMessage.error(res.msg || '导入失败')
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+onMounted(()=>{
|
|
|
+ getList();
|
|
|
+})
|
|
|
+</script>
|
|
|
+
|
|
|
+<template>
|
|
|
+ <div class="p-6 bg-gray-50 min-h-screen">
|
|
|
+ <!-- 页面标题 -->
|
|
|
+ <div class="mb-6">
|
|
|
+ <h1 class="text-2xl font-bold text-gray-800 mb-2">智慧用工管理</h1>
|
|
|
+ <p class="text-gray-600">管理企业招聘信息和岗位发布</p>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 搜索区域 -->
|
|
|
+ <el-card class="mb-4" shadow="never">
|
|
|
+ <el-form :model="searchForm" inline class="search-form">
|
|
|
+ <el-form-item label="公司名称">
|
|
|
+ <el-input v-model="searchForm.companyName" placeholder="请输入公司名称" clearable style="width: 200px" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="岗位名称">
|
|
|
+ <el-input v-model="searchForm.jobOpenings" placeholder="请输入岗位名称" clearable style="width: 200px" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="工作地点">
|
|
|
+ <el-input v-model="searchForm.workLocation" placeholder="请输入工作地点" clearable style="width: 200px" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" @click="handleSearch" :icon="Search">搜索</el-button>
|
|
|
+ <el-button @click="handleReset" :icon="RefreshCw">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-card>
|
|
|
+
|
|
|
+ <!-- 操作按钮区域 -->
|
|
|
+ <el-card shadow="never">
|
|
|
+ <div class="mb-4 flex justify-between items-center">
|
|
|
+ <div class="flex gap-2">
|
|
|
+ <el-button type="primary" @click="handleAdd" :icon="Plus">新增岗位</el-button>
|
|
|
+ <el-button type="danger" @click="handleBatchDelete" :disabled="selectedIds.length === 0" :icon="Delete">批量删除</el-button>
|
|
|
+ <el-button type="success" @click="handleExport" :icon="Download">导出Excel</el-button>
|
|
|
+ <el-upload
|
|
|
+ ref="uploadRef"
|
|
|
+ :action="BASE_URL+'/park/smartEmployment/importExcel'"
|
|
|
+ :show-file-list="false"
|
|
|
+ accept=".xls,.xlsx"
|
|
|
+ :on-success="handleImportSuccess"
|
|
|
+ >
|
|
|
+ <el-button type="warning" :icon="Upload">导入Excel</el-button>
|
|
|
+ </el-upload>
|
|
|
+ <el-button @click="handleDownloadTemplate" :icon="Download">下载模板</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="text-sm text-gray-500">共 {{ total }} 条记录</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 数据表格 -->
|
|
|
+ <el-table :data="tableData" :loading="loading" @selection-change="handleSelectionChange" stripe class="w-full">
|
|
|
+ <el-table-column type="selection" width="55" />
|
|
|
+ <el-table-column prop="companyName" label="公司名称" min-width="120" />
|
|
|
+ <el-table-column prop="jobOpenings" label="岗位名称" min-width="120" />
|
|
|
+ <el-table-column prop="keyTerms" label="岗位描述" min-width="150" show-overflow-tooltip />
|
|
|
+ <el-table-column prop="numberRecruits" label="招聘人数" width="100" />
|
|
|
+ <el-table-column prop="salary" label="薪资" width="120" />
|
|
|
+ <el-table-column prop="workLocation" label="工作地点" width="120" />
|
|
|
+ <el-table-column prop="contact" label="联系人" width="100" />
|
|
|
+ <el-table-column prop="contactInformation" label="联系方式" width="120" />
|
|
|
+ <el-table-column prop="createTime" label="创建时间" width="180" />
|
|
|
+ <el-table-column label="操作" width="150" fixed="right">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <el-button type="primary" size="small" @click="handleEdit(row)" :icon="Edit" link>编辑</el-button>
|
|
|
+ <el-button type="danger" size="small" @click="handleDelete(row)" :icon="Delete" link>删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <!-- 分页组件 -->
|
|
|
+ <div class="mt-4 flex justify-end">
|
|
|
+ <el-pagination
|
|
|
+ v-model:current-page="pagination.pageNum"
|
|
|
+ v-model:page-size="pagination.pageSize"
|
|
|
+ :page-sizes="[10, 20, 50, 100]"
|
|
|
+ :total="total"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handlePageChange"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+
|
|
|
+ <!-- 新增/编辑对话框 -->
|
|
|
+ <el-dialog v-model="dialogVisible" :title="dialogTitle" width="800px" :close-on-click-modal="false">
|
|
|
+ <el-form :model="formData" label-width="100px" class="px-4">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="公司名称" required>
|
|
|
+ <el-input v-model="formData.companyName" placeholder="请输入公司名称" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="岗位名称" required>
|
|
|
+ <el-input v-model="formData.jobOpenings" placeholder="请输入岗位名称" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="招聘人数">
|
|
|
+ <el-input v-model="formData.numberRecruits" placeholder="请输入招聘人数" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="薪资">
|
|
|
+ <el-input v-model="formData.salary" placeholder="请输入薪资范围" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="工作地点">
|
|
|
+ <el-input v-model="formData.workLocation" placeholder="请输入工作地点" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="联系人">
|
|
|
+ <el-input v-model="formData.contact" placeholder="请输入联系人" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-form-item label="联系方式">
|
|
|
+ <el-input v-model="formData.contactInformation" placeholder="请输入联系方式" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="岗位描述">
|
|
|
+ <el-input v-model="formData.keyTerms" type="textarea" :rows="3" placeholder="请输入岗位描述" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="岗位要求">
|
|
|
+ <el-input v-model="formData.jobRequirements" type="textarea" :rows="3" placeholder="请输入岗位要求" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="备注">
|
|
|
+ <el-input v-model="formData.remarks" type="textarea" :rows="2" placeholder="请输入备注信息" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <div class="dialog-footer">
|
|
|
+ <el-button @click="dialogVisible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="handleSave" :loading="loading">确定</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.search-form .el-form-item {
|
|
|
+ margin-bottom: 16px;
|
|
|
+}
|
|
|
+.dialog-footer {
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+</style>
|
