|
@@ -0,0 +1,409 @@
|
|
|
+<template>
|
|
|
+ <div id="detail" style="background:#fff;">
|
|
|
+ <el-form ref="form" :model="info" label-position="right" label-width="auto" :rules="rules" style="padding:0.4rem;">
|
|
|
+ <el-form-item label="职位名称" prop="job_name">
|
|
|
+ <el-input v-model="info.job_name" placeholder="请填写职位名称" style="margin:5px 0px"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="工作性质" prop="is_practice">
|
|
|
+ <drawer
|
|
|
+ :data="praList"
|
|
|
+ type="is_practice"
|
|
|
+ :selected="info.is_practice"
|
|
|
+ placeholder="点击选择工作性质"
|
|
|
+ need="value"
|
|
|
+ @select="selectChange"
|
|
|
+ style="margin:5px 0px"
|
|
|
+ >
|
|
|
+ </drawer>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="职位分类" prop="category">
|
|
|
+ <drawer
|
|
|
+ :data="jobTypeList"
|
|
|
+ type="category"
|
|
|
+ :selected="info.category"
|
|
|
+ placeholder="点击选择职位"
|
|
|
+ need="label"
|
|
|
+ @select="selectChange"
|
|
|
+ style="margin:5px 0px"
|
|
|
+ ></drawer>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="截止时间" prop="end_date">
|
|
|
+ <el-input v-model="info.end_date" placeholder="请选择日期" @click.native="dateVis = true" style="margin:5px 0px"></el-input>
|
|
|
+ <nut-datepicker
|
|
|
+ :is-visible="dateVis"
|
|
|
+ :defaultValue="new Date().toLocaleString()"
|
|
|
+ :endDate="endDate"
|
|
|
+ type="date"
|
|
|
+ title="请选择日期"
|
|
|
+ :is-show-chinese="false"
|
|
|
+ @close="dateVis = false"
|
|
|
+ @choose="selectDate"
|
|
|
+ ></nut-datepicker>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="工作城市" prop="city">
|
|
|
+ <tag-all-select
|
|
|
+ placeholder="点击选择城市"
|
|
|
+ :firstList="provinceList"
|
|
|
+ :secondList="cityList"
|
|
|
+ @selectChange="selectChange"
|
|
|
+ @listChange="listChange"
|
|
|
+ :selected="info.city"
|
|
|
+ type="city"
|
|
|
+ ></tag-all-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="学历要求" prop="xl_req">
|
|
|
+ <drawer
|
|
|
+ :data="edu_list"
|
|
|
+ type="xl_req"
|
|
|
+ :selected="info.xl_req"
|
|
|
+ placeholder="点击选择工作性质"
|
|
|
+ need="label"
|
|
|
+ @select="selectChange"
|
|
|
+ style="margin:5px 0px"
|
|
|
+ >
|
|
|
+ </drawer>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="专业要求" prop="zy_req">
|
|
|
+ <tagSecSelect
|
|
|
+ placeholder="点击选择相关专业"
|
|
|
+ :selected="info.zy_req"
|
|
|
+ :firstList="subjectList"
|
|
|
+ :secondList="subjectSubList"
|
|
|
+ @selectChange="selectChange"
|
|
|
+ @listChange="listChange"
|
|
|
+ type="zy_req"
|
|
|
+ ></tagSecSelect>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="薪资待遇" prop="salary">
|
|
|
+ <el-col :span="10">
|
|
|
+ <el-input type="number" v-model="info.salary.min">
|
|
|
+ <template #append>
|
|
|
+ <strong>K</strong>
|
|
|
+ </template>
|
|
|
+ </el-input>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4" style="text-align:center;">
|
|
|
+ 至
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="10">
|
|
|
+ <el-input type="number" v-model="info.salary.max">
|
|
|
+ <template #append>
|
|
|
+ <strong>K</strong>
|
|
|
+ </template>
|
|
|
+ </el-input>
|
|
|
+ </el-col>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="职位诱惑" prop="job_tag">
|
|
|
+ <tagCheckbox
|
|
|
+ placeholder="点击选择职位诱惑"
|
|
|
+ :firstList="entice_list"
|
|
|
+ @selectChange="selectChange"
|
|
|
+ @listChange="listChange"
|
|
|
+ :selected="info.job_tag"
|
|
|
+ type="job_tag"
|
|
|
+ ></tagCheckbox>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="招聘人数" prop="job_number">
|
|
|
+ <el-input-number v-model="info.job_number" :min="1" placeholder="添加需要招聘的人数" style="width:100%;margin:5px 0px"></el-input-number>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="职位描述" prop="job_desc">
|
|
|
+ <el-input type="textarea" :rows="5" placeholder="请输入职位描述" v-model="info.job_desc" style="margin:5px 0px"> </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="简历投递说明" prop="apply_intro">
|
|
|
+ <el-input type="textarea" :rows="5" placeholder="请输入简历投递说明" v-model="info.apply_intro" style="margin:5px 0px"> </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="岗位要求" prop="welfare">
|
|
|
+ <el-input type="textarea" :rows="5" placeholder="请输入岗位要求" v-model="info.welfare" style="margin:5px 0px"> </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="其他说明" prop="job_req">
|
|
|
+ <el-input type="textarea" :rows="5" placeholder="请输入其他描述" v-model="info.other" style="margin:5px 0px"> </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24" style="padding-top:1rem;">
|
|
|
+ <el-button style="width:100%;border-radius: 30px" type="success" @click="toSubmit()">保存</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" style="padding-top:1rem;">
|
|
|
+ <el-button style="width:100%;border-radius: 30px" type="info" @click="$router.push({ path: '/jobs/index' })">返回</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import drawer from '@/components/drawer.vue';
|
|
|
+import tagAllSelect from '@/components/tag-all-select.vue';
|
|
|
+import tagSecSelect from '@/components/tag-sec-select.vue';
|
|
|
+import tagCheckbox from '@/components/tag-checkbox.vue';
|
|
|
+import { mapActions, mapState } from 'vuex';
|
|
|
+export default {
|
|
|
+ name: 'detail',
|
|
|
+ props: {},
|
|
|
+ components: {
|
|
|
+ drawer,
|
|
|
+ tagAllSelect,
|
|
|
+ tagSecSelect,
|
|
|
+ tagCheckbox,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ info: {
|
|
|
+ salary: {},
|
|
|
+ },
|
|
|
+ dateVis: false,
|
|
|
+ endDate: `${new Date().getFullYear() + 1}-${new Date().getMonth() + 1}-${new Date().getDate()}`,
|
|
|
+ jobTypeList: [
|
|
|
+ {
|
|
|
+ label: 'IT',
|
|
|
+ value: '1',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: 'test2',
|
|
|
+ value: '2',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: 'test3',
|
|
|
+ value: '3',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: 'test4',
|
|
|
+ value: '4',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ praList: [{ value: 0, label: '校招' }, { value: 1, label: '实习' }, { value: 2, label: '社招' }],
|
|
|
+ edu_list: [
|
|
|
+ { value: '不限', label: '不限' },
|
|
|
+ { value: '中专及以上', label: '中专及以上' },
|
|
|
+ { value: '大专及以上', label: '大专及以上' },
|
|
|
+ { value: '本科及以上', label: '本科及以上' },
|
|
|
+ { value: '硕士及以上', label: '硕士及以上' },
|
|
|
+ { value: '博士及以上', label: '博士及以上' },
|
|
|
+ ],
|
|
|
+ cityList: [],
|
|
|
+ provinceList: [{ label: '北京市', value: '110000' }, { label: '吉林省', value: '220000' }, { label: '沈阳省', value: '210000' }],
|
|
|
+ secondList: [{ label: '长春市', value: '220100' }, { label: '吉林市', value: '220200' }],
|
|
|
+ secondList1: [{ label: '沈阳市', value: '210100' }, { label: '大连市', value: '210200' }],
|
|
|
+ subjectList: [
|
|
|
+ { label: '不限专业', value: '0' },
|
|
|
+ { label: '哲学', value: '1' },
|
|
|
+ { label: '经济学', value: '2' },
|
|
|
+ { label: '法学', value: '3' },
|
|
|
+ { label: '教育学', value: '4' },
|
|
|
+ { label: '文学', value: '5' },
|
|
|
+ { label: '历史学', value: '6' },
|
|
|
+ { label: '理学', value: '7' },
|
|
|
+ { label: '工学', value: '8' },
|
|
|
+ { label: '农学', value: '9' },
|
|
|
+ { label: '医学', value: '10' },
|
|
|
+ ],
|
|
|
+ subjectSubList: [],
|
|
|
+ subjectSub: [
|
|
|
+ { label: '哲学类', value: '11' },
|
|
|
+ { label: '哲学', value: '12' },
|
|
|
+ { label: '逻辑类', value: '13' },
|
|
|
+ { label: '宗教类', value: '14' },
|
|
|
+ { label: '伦理类', value: '15' },
|
|
|
+ ],
|
|
|
+ subjectSub2: [{ label: '社会经济学', value: '16' }, { label: '国际经济学', value: '17' }, { label: '资本主义经济学', value: '18' }],
|
|
|
+ entice_list: [
|
|
|
+ { value: '1', label: '年底双薪' },
|
|
|
+ { value: '2', label: '绩效奖金' },
|
|
|
+ { value: '3', label: '岗前培训' },
|
|
|
+ { value: '4', label: '节日礼物' },
|
|
|
+ { value: '5', label: '扁平管理' },
|
|
|
+ { value: '6', label: '年度旅游' },
|
|
|
+ { value: '7', label: '岗位晋升' },
|
|
|
+ { value: '8', label: '股票期权' },
|
|
|
+ { value: '9', label: '弹性工作' },
|
|
|
+ { value: '10', label: '带薪年假' },
|
|
|
+ { value: '11', label: '交通补助' },
|
|
|
+ { value: '12', label: '餐补' },
|
|
|
+ { value: '13', label: '房补' },
|
|
|
+ { value: '14', label: '免费班车' },
|
|
|
+ { value: '15', label: '员工旅游' },
|
|
|
+ { value: '16', label: '包吃包住' },
|
|
|
+ { value: '17', label: '健康体检' },
|
|
|
+ { value: '18', label: '留人基金' },
|
|
|
+ { value: '19', label: '学费返还' },
|
|
|
+ ],
|
|
|
+ rules: {
|
|
|
+ job_name: [{ required: true, message: '请输入职位名称', trigger: 'blur' }],
|
|
|
+ is_practice: [{ required: true, message: '请选择工作性质', trigger: 'blur' }],
|
|
|
+ category: [{ required: true, message: '请选择职位分类', trigger: 'blur' }],
|
|
|
+ end_date: [{ required: true, message: '请选择截止时间', trigger: 'change' }],
|
|
|
+ city: [{ required: true, message: '请选择工作城市', trigger: 'blur' }],
|
|
|
+ xl_req: [{ required: true, message: '请选择学历要求', trigger: 'blur' }],
|
|
|
+ zy_req: [{ required: true, message: '请选择专业要求', trigger: 'blur' }],
|
|
|
+ salary: {
|
|
|
+ type: 'object',
|
|
|
+ fields: {
|
|
|
+ max: { required: true, message: '请输入完整的薪资待遇', type: 'string' },
|
|
|
+ min: { required: true, message: '请输入完整的薪资待遇', type: 'string' },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ job_tag: [{ required: true, message: '请选择职位诱惑', trigger: 'blur' }],
|
|
|
+ job_number: [{ required: true, message: '请输入招聘人数', trigger: 'blur' }],
|
|
|
+ job_desc: [{ required: true, message: '请输入职位描述', trigger: 'blur' }],
|
|
|
+ apply_intro: [{ required: true, message: '请输入简历投递说明', trigger: 'blur' }],
|
|
|
+ welfare: [{ required: true, message: '请输入岗位要求', trigger: 'blur' }],
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.search();
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState({
|
|
|
+ user: state => state.user.user,
|
|
|
+ }),
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...mapActions(['postsOperation']),
|
|
|
+ async search() {
|
|
|
+ if (this.$route.query.id) {
|
|
|
+ let result = await this.postsOperation({ type: 'search', data: { id: this.$route.query.id } });
|
|
|
+ let infos = JSON.parse(JSON.stringify(result.data));
|
|
|
+ infos.salary.max = `${infos.salary.max}`;
|
|
|
+ infos.salary.min = `${infos.salary.min}`;
|
|
|
+ this.$set(this, `info`, infos);
|
|
|
+ this.returnData(this.info);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ selectChange({ type, value }) {
|
|
|
+ console.log(type, value);
|
|
|
+ this.$set(this.info, `${type}`, value);
|
|
|
+ },
|
|
|
+ selectDate(date) {
|
|
|
+ this.$set(this.info, `end_date`, date[3]);
|
|
|
+ this.dateVis = false;
|
|
|
+ },
|
|
|
+ listChange({ value, type }) {
|
|
|
+ //此方法是更换子列表的
|
|
|
+ if (value.value === '220000') {
|
|
|
+ this.$set(this, `cityList`, this.secondList);
|
|
|
+ } else if (value.value === '210000') {
|
|
|
+ this.$set(this, `cityList`, this.secondList1);
|
|
|
+ } else if (type === 'zy_req') {
|
|
|
+ //专业查询模拟
|
|
|
+ this.$set(this, `subjectSubList`, value === '1' ? this.subjectSub : this.subjectSub2);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ toSubmit() {
|
|
|
+ this.$refs.form.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ this.submit();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async submit() {
|
|
|
+ let result;
|
|
|
+ let infos = JSON.parse(JSON.stringify(this.info));
|
|
|
+ let mid = '';
|
|
|
+ infos.salary.text = infos.salary.min + 'k-' + infos.salary.max + 'k/月';
|
|
|
+ if (typeof infos.city === 'object') {
|
|
|
+ infos.city.map(item => {
|
|
|
+ mid === '' ? (mid = item.label) : (mid += `,${item.label}`);
|
|
|
+ });
|
|
|
+ infos.city = mid;
|
|
|
+ mid = '';
|
|
|
+ }
|
|
|
+ if (typeof infos.job_tag === 'object') {
|
|
|
+ infos.job_tag.map(item => {
|
|
|
+ mid === '' ? (mid = item.label) : (mid += `,${item.label}`);
|
|
|
+ });
|
|
|
+ infos.job_tag = mid;
|
|
|
+ mid = '';
|
|
|
+ }
|
|
|
+ if (typeof infos.zy_req === 'object') {
|
|
|
+ infos.zy_req.map(item => {
|
|
|
+ mid === '' ? (mid = item.label) : (mid += `,${item.label}`);
|
|
|
+ });
|
|
|
+ infos.zy_req = mid;
|
|
|
+ }
|
|
|
+ if (this.info.id) {
|
|
|
+ result = await this.postsOperation({ type: 'update', data: { info: infos, id: this.$route.query.id } });
|
|
|
+ } else {
|
|
|
+ result = await this.postsOperation({ type: 'add', data: { info: infos, corpname: '福瑞', corpid: this.user.corpid } });
|
|
|
+ }
|
|
|
+ if (`${result.errcode}` === '0') {
|
|
|
+ this.$message.success('操作成功');
|
|
|
+ this.$router.push('/jobs/index');
|
|
|
+ } else {
|
|
|
+ this.$message.error(result.errmsg);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ returnData(data) {
|
|
|
+ if (data.city) {
|
|
|
+ let mid = data.city.split(',');
|
|
|
+ let selected = [];
|
|
|
+ for (const select of mid) {
|
|
|
+ let res = this.provinceList.filter(item => item.label === select);
|
|
|
+ if (res.length > 0) {
|
|
|
+ selected = [...selected, ...res];
|
|
|
+ } else {
|
|
|
+ let res = this.secondList.filter(item => item.label === select);
|
|
|
+ if (res.length > 0) {
|
|
|
+ selected = [...selected, ...res];
|
|
|
+ } else {
|
|
|
+ let res = this.secondList1.filter(item => item.label === select);
|
|
|
+ if (res.length > 0) {
|
|
|
+ selected = [...selected, ...res];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$set(this.info, `city`, selected);
|
|
|
+ }
|
|
|
+ if (data.zy_req) {
|
|
|
+ let mid = data.zy_req.split(',');
|
|
|
+ let selected = [];
|
|
|
+ for (const select of mid) {
|
|
|
+ let res = this.subjectList.filter(item => item.label === select && item.value === '0');
|
|
|
+ if (res.length <= 0) {
|
|
|
+ res = this.subjectSub.filter(item => item.label === select);
|
|
|
+ selected = [...selected, ...res];
|
|
|
+ res = this.subjectSub2.filter(item => item.label === select);
|
|
|
+ selected = [...selected, ...res];
|
|
|
+ this.$set(this.info, `zy_req`, selected);
|
|
|
+ } else {
|
|
|
+ this.$set(this.info, `zy_req`, res);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (data.job_tag) {
|
|
|
+ let mid = data.job_tag.split(',');
|
|
|
+ let selected = [];
|
|
|
+ for (const select of mid) {
|
|
|
+ let res = this.entice_list.filter(item => item.label === select);
|
|
|
+ selected = [...selected, ...res];
|
|
|
+ }
|
|
|
+ this.$set(this.info, `job_tag`, selected);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+/deep/.el-input__inner {
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+.el-form-item {
|
|
|
+ border-bottom: 0.0625rem solid #bbb;
|
|
|
+}
|
|
|
+.el-form-item {
|
|
|
+ margin: 0;
|
|
|
+}
|
|
|
+/deep/.el-form-item__label {
|
|
|
+ line-height: 51px;
|
|
|
+}
|
|
|
+/deep/.el-form-item__error {
|
|
|
+ color: #f56c6c;
|
|
|
+ font-size: 12px;
|
|
|
+ line-height: 1;
|
|
|
+ padding-top: 4px;
|
|
|
+ position: absolute;
|
|
|
+ top: 2rem;
|
|
|
+ left: -6.5rem;
|
|
|
+}
|
|
|
+</style>
|