初始化
This commit is contained in:
203
packages/wechat/AppJob/components/Add.vue
Normal file
203
packages/wechat/AppJob/components/Add.vue
Normal file
@@ -0,0 +1,203 @@
|
||||
<template>
|
||||
<ai-detail>
|
||||
<!-- 返回按钮 -->
|
||||
<template #title>
|
||||
<ai-title title="添加招工就业信息" isShowBack isShowBottomBorder @onBackClick="cancel(false)"></ai-title>
|
||||
</template>
|
||||
|
||||
<!-- 内容 -->
|
||||
<template #content>
|
||||
<el-form class="ai-form" :model="formData" ref="ruleForm" :rules="formRules">
|
||||
<ai-card title="岗位信息">
|
||||
<div slot="content" class="ai-content">
|
||||
<!-- 招聘岗位 -->
|
||||
<el-form-item label="招聘岗位" prop="title" style="width: 45%">
|
||||
<el-input placeholder="请输入" v-model="formData.title" maxlength="30" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 招聘人数 -->
|
||||
<el-form-item label="招聘人数" prop="total" style="width: 45%">
|
||||
<el-input placeholder="请输入" v-model="formData.total" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 学历 -->
|
||||
<el-form-item label="学历" prop="education" style="width: 45%">
|
||||
<el-input placeholder="请输入" v-model="formData.education" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 性别 -->
|
||||
<el-form-item label="招聘性别" prop="gender" style="width: 45%">
|
||||
<ai-select v-model="formData.gender" :selectList="$dict.getDict('JobGender')"></ai-select>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 年龄 -->
|
||||
<el-form-item label="年龄" prop="age" style="width: 45%">
|
||||
<el-input placeholder="请输入,如“18-60”" v-model="formData.age" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 薪酬待遇 -->
|
||||
<el-form-item label="薪酬待遇" prop="salary" style="width: 45%">
|
||||
<el-input placeholder="请输入,如“5k-10k”" v-model="formData.salary" maxlength="10" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 岗位说明 -->
|
||||
<el-form-item label="岗位说明" prop="remark" style="width: 100%">
|
||||
<el-input type="textarea" placeholder="请输入" maxlength="500" v-model="formData.remark" show-word-limit :rows="4"></el-input>
|
||||
</el-form-item>
|
||||
<!-- / -->
|
||||
</div>
|
||||
</ai-card>
|
||||
|
||||
<ai-card title="企业信息">
|
||||
<div slot="content" class="ai-content">
|
||||
<!-- 单位名称 -->
|
||||
<el-form-item label="单位名称" prop="companyName" style="width: 45%">
|
||||
<el-input placeholder="请输入" v-model="formData.companyName" maxlength="30" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 联系人 -->
|
||||
<el-form-item label="联系人" prop="linkName" style="width: 45%">
|
||||
<el-input placeholder="请输入" v-model="formData.linkName" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 联系方式 -->
|
||||
<el-form-item label="联系方式" prop="linkPhone" style="width: 100%">
|
||||
<el-input placeholder="请输入" v-model="formData.linkPhone" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</ai-card>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<!-- 底部按钮 -->
|
||||
<template #footer>
|
||||
<el-button @click="cancel">取消</el-button>
|
||||
<el-button type="primary" @click="confirm('ruleForm')">提交</el-button>
|
||||
</template>
|
||||
</ai-detail>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Add',
|
||||
// 组件
|
||||
components: {},
|
||||
props: {
|
||||
instance: Function,
|
||||
dict: Object,
|
||||
params: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
info: {},
|
||||
id: '',
|
||||
formData: {
|
||||
title: '',
|
||||
total: '',
|
||||
education: '',
|
||||
gender: '',
|
||||
age: '',
|
||||
salary: '',
|
||||
remark: '',
|
||||
companyName: '',
|
||||
linkName: '',
|
||||
linkPhone: '',
|
||||
status: '0',
|
||||
},
|
||||
formRules: {
|
||||
title: [{ required: true, message: '请输入招聘岗位', trigger: 'change' }],
|
||||
total: [{ required: true, message: '请输入招聘人数位', trigger: 'change' }],
|
||||
education: [{ required: true, message: '请输入招聘学历', trigger: 'change' }],
|
||||
age: [{ required: true, message: '请输入招聘年龄', trigger: 'change' }],
|
||||
gender: [{ required: true, message: '请输入招聘性别', trigger: 'change' }],
|
||||
salary: [{ required: true, message: '请输入薪酬待遇', trigger: 'change' }],
|
||||
// remark: [
|
||||
// { required: true, message: '请输入岗位说明', trigger: 'change' }
|
||||
// ],
|
||||
companyName: [{ required: true, message: '请输入单位名称', trigger: 'change' }],
|
||||
linkName: [{ required: true, message: '请输入联系人', trigger: 'change' }],
|
||||
linkPhone: [{ required: true, message: '请输入联系方式', trigger: 'change' }],
|
||||
},
|
||||
}
|
||||
},
|
||||
// 计算
|
||||
computed: {},
|
||||
// 监听
|
||||
watch: {},
|
||||
created() {
|
||||
this.dict.load('JobGender').then(() => {})
|
||||
if (this.params && this.params.id) {
|
||||
this.id = this.params.id
|
||||
this.getInfoList(this.params.id)
|
||||
}
|
||||
},
|
||||
// 实例创建后
|
||||
onShow() {},
|
||||
// 实例渲染后
|
||||
mounted() {},
|
||||
// 方法
|
||||
methods: {
|
||||
getInfoList(id) {
|
||||
this.instance.post(`/app/appjob/detail?id=${id}`).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.formData = res.data
|
||||
window.console.log(this.info)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 确定新增
|
||||
confirm() {
|
||||
this.$refs['ruleForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
this.instance
|
||||
.post(`/app/appjob/addOrUpdate`, {
|
||||
title: this.formData.title,
|
||||
total: this.formData.total,
|
||||
education: this.formData.education,
|
||||
gender: this.formData.gender,
|
||||
age: this.formData.age,
|
||||
salary: this.formData.salary,
|
||||
remark: this.formData.remark,
|
||||
companyName: this.formData.companyName,
|
||||
linkName: this.formData.linkName,
|
||||
linkPhone: this.formData.linkPhone,
|
||||
status: this.formData.status,
|
||||
id: this.id,
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('提交成功')
|
||||
setTimeout(() => {
|
||||
this.cancel(true)
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 返回按钮
|
||||
cancel(isRefresh) {
|
||||
this.$emit('change', {
|
||||
type: 'list',
|
||||
isRefresh: isRefresh ? true : false,
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
::v-deep.ai-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.ai-card {
|
||||
.ai-content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
291
packages/wechat/AppJob/components/List.vue
Normal file
291
packages/wechat/AppJob/components/List.vue
Normal file
@@ -0,0 +1,291 @@
|
||||
<template>
|
||||
<section class="list">
|
||||
<ai-list>
|
||||
<!-- 标题 -->
|
||||
<ai-title slot="title" title="招工就业" isShowBottomBorder />
|
||||
|
||||
<template #custom>
|
||||
<!-- 卡片 -->
|
||||
<el-row type="flex" class="staDataPane">
|
||||
<div class="boxItem">
|
||||
<div>招聘单位总数</div>
|
||||
<b>{{ staData.countCompany || 0 }}</b>
|
||||
</div>
|
||||
|
||||
<div class="boxItem">
|
||||
<div>招聘岗位总数</div>
|
||||
<b>{{ staData.countTotal || 0 }}</b>
|
||||
</div>
|
||||
|
||||
<div class="boxItem">
|
||||
<div>招聘人员总数</div>
|
||||
<b>{{ staData.countUser || 0 }}</b>
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<!-- 内容 -->
|
||||
<div class="mainPane">
|
||||
<ai-search-bar>
|
||||
<template slot="left">
|
||||
<!-- 性别下拉选择框 -->
|
||||
<ai-select v-model="searchObj.gender" placeholder="请选择性别" clearable @change=";(page.current = 1), getList()" :selectList="dict.getDict('JobGender')"></ai-select>
|
||||
</template>
|
||||
|
||||
<!-- 搜索 -->
|
||||
<template slot="right"> <el-input v-model="searchObj.title" size="small" placeholder="请输入单位名称" clearable @keyup.enter.native=";(page.current = 1), getList()" @clear=";(page.current = 1), (searchObj.title = ''), getList()" suffix-icon="iconfont iconSearch"/></template>
|
||||
</ai-search-bar>
|
||||
|
||||
<ai-search-bar>
|
||||
<!-- 添加 -->
|
||||
<template #left>
|
||||
<el-button type="primary" icon="iconfont iconAdd" size="small" @click="add('')">添加</el-button>
|
||||
<el-button icon="iconfont iconDelete" size="small" @click="toDelete()" :disabled="ids.length == 0">删除</el-button>
|
||||
</template>
|
||||
|
||||
<!-- 导入导出 -->
|
||||
<template #right>
|
||||
<ai-import :instance="instance" :dict="dict" type="appjob" name="招工就业" @success="getList(), $message.success('导入成功!')">
|
||||
<el-button icon="iconfont iconImport">导入</el-button>
|
||||
</ai-import>
|
||||
|
||||
<ai-download :instance="instance" url="/app/appjob/listExport" :params="param" fileName="招工就业模板" />
|
||||
</template>
|
||||
</ai-search-bar>
|
||||
|
||||
<ai-table :tableData="tableData" :colConfigs="colConfigs" :total="page.total" :current.sync="page.current" :size.sync="page.size" @selection-change="(v) => (ids = v.map((e) => e.id))" @getList="getList">
|
||||
<!-- 是否启用 -->
|
||||
<el-table-column label="是否启用" slot="status" align="center" width="80">
|
||||
<template v-slot="{ row }">
|
||||
<el-switch v-model="row.status" @change="onChange(row)" active-value="1" inactive-value="0" active-color="#5088FF" inactive-color="#D0D4DC"> </el-switch>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<!-- 操作 -->
|
||||
<el-table-column label="操作" align="center" width="140" slot="options">
|
||||
<template slot-scope="{ row }">
|
||||
<el-button type="text" @click="add(row.id)">编辑</el-button>
|
||||
<el-button type="text" @click="toDelete(row.id)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</ai-table>
|
||||
</div>
|
||||
</template>
|
||||
</ai-list>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'list',
|
||||
// 组件
|
||||
components: {},
|
||||
props: {
|
||||
params: Object,
|
||||
instance: Function,
|
||||
dict: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
page: {
|
||||
size: 10,
|
||||
current: 1,
|
||||
total: 0,
|
||||
},
|
||||
searchObj: {
|
||||
gender: '',
|
||||
title: '',
|
||||
},
|
||||
colConfigs: [
|
||||
{ type: 'selection' },
|
||||
{ prop: 'companyName', label: '单位名称', width: '180px' },
|
||||
{ prop: 'title', label: '招聘岗位', width: '150px' },
|
||||
{ prop: 'total', label: '招聘人数', width: '80px' },
|
||||
{ prop: 'education', label: '学历', width: '80px' },
|
||||
{
|
||||
prop: 'gender',
|
||||
label: '性别',
|
||||
width: '60px',
|
||||
render: (h, { row }) => {
|
||||
return h('span', null, this.dict.getLabel('JobGender', row.gender))
|
||||
},
|
||||
},
|
||||
{ prop: 'age', label: '年龄' },
|
||||
{ prop: 'salary', label: '薪酬待遇' },
|
||||
{ prop: 'linkName', label: '联系人', width: '80px' },
|
||||
{ prop: 'linkPhone', label: '联系方式' },
|
||||
{ prop: 'createUserName', label: '添加人' },
|
||||
{ prop: 'createTime', label: '添加日期', width: '160px' },
|
||||
{ slot: 'status', label: '是否启用' },
|
||||
],
|
||||
staData: [],
|
||||
ids: [],
|
||||
}
|
||||
},
|
||||
// 计算
|
||||
computed: {
|
||||
param() {
|
||||
let params = {}
|
||||
//导出搜索条件
|
||||
if (this.ids.length) {
|
||||
params = {
|
||||
...params,
|
||||
ids: this.ids,
|
||||
}
|
||||
} else {
|
||||
params = {
|
||||
...params,
|
||||
...this.searchObj,
|
||||
}
|
||||
}
|
||||
return params
|
||||
},
|
||||
},
|
||||
// 监听
|
||||
watch: {},
|
||||
|
||||
// 实例创建后
|
||||
created() {
|
||||
this.dict.load('JobGender').then(() => {
|
||||
this.getList()
|
||||
this.getStaData()
|
||||
})
|
||||
},
|
||||
|
||||
// 实例创建后
|
||||
onShow() {},
|
||||
// 实例渲染后
|
||||
mounted() {
|
||||
this.dict.load('JobGender').then(() => {
|
||||
this.$nextTick(() => this.getList())
|
||||
})
|
||||
},
|
||||
// 方法
|
||||
methods: {
|
||||
getList() {
|
||||
this.instance
|
||||
.post(`/app/appjob/list`, null, {
|
||||
params: {
|
||||
...this.page,
|
||||
...this.searchObj,
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code == 0) {
|
||||
// console.log(res.data.records)
|
||||
this.tableData = res.data.records
|
||||
this.page.total = res.data.total
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
|
||||
// 添加
|
||||
add(id) {
|
||||
this.$emit('change', {
|
||||
type: 'Add',
|
||||
params: {
|
||||
id: id || '',
|
||||
},
|
||||
})
|
||||
},
|
||||
|
||||
// 删除
|
||||
toDelete(id) {
|
||||
this.$confirm('删除后不可恢复,是否要删除该事项?').then(() => {
|
||||
this.instance
|
||||
.post('/app/appjob/delete', null, {
|
||||
params: { ids: id || this.ids.join(',') },
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('删除成功!')
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// 启用停用
|
||||
onChange(row) {
|
||||
this.instance.post(`/app/appjob/setStatus?id=${row.id}&status=${row.status}`).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success(+row.status ? '已启用' : '不启用')
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 统计
|
||||
getStaData() {
|
||||
this.instance.post('/app/appjob/statistic').then((res) => {
|
||||
if (res?.data) {
|
||||
this.staData = res.data
|
||||
// console.log(this.staData)
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.list {
|
||||
height: 100%;
|
||||
|
||||
::v-deep .ai-list__content {
|
||||
padding: 0 16px 16px !important;
|
||||
box-sizing: border-box;
|
||||
|
||||
.ai-list__content--wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .staDataPane {
|
||||
width: 100%;
|
||||
gap: 16px;
|
||||
padding-top: 10px;
|
||||
|
||||
.boxItem {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0 16px;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
border: 1px solid #eee;
|
||||
background: #fff;
|
||||
|
||||
b {
|
||||
font-size: 20px;
|
||||
font-family: DINAlternate-Bold, DINAlternate,serif;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .mainPane {
|
||||
background: #fff;
|
||||
border: 1px solid #eee;
|
||||
padding: 12px 16px;
|
||||
}
|
||||
|
||||
.WhereaboutsConfigForm {
|
||||
flex-wrap: wrap;
|
||||
|
||||
.el-select {
|
||||
width: 100%;
|
||||
|
||||
::v-deep .el-tag__close.el-icon-close {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user