admin_home/src/views/news/addJobHunting.vue

<template>
  <div class="mainBox">
    <!-- 浮动目录 -->
    <div class="floating-menu"
      style="position: fixed; top: 20%; right: 130px; transform: translate(-50%, -50%); z-index: 222; opacity: 0.8;">
      <div class="menu-item" @click="scrollToSection('personalInfo')">个人信息</div>
      <div class="menu-item" @click="scrollToSection('jobIntentions')">求职意向</div>
      <div class="menu-item" @click="scrollToSection('professionalSkills')">专业技能</div>
      <div class="menu-item" @click="scrollToSection('workExperience')">工作经历</div>
      <div class="menu-item" @click="scrollToSection('educationExperience')">教育经历</div>
    </div>
    <div class="layerBox">
      <div id="personalInfo">
        <tableTitle1 name="个人信息" />
        <!-- 个人信息表单内容 -->
      </div>
      <el-form :model="form" ref="form" :rules="formRules" label-position="left" label-width="120px">
        <div class="formDiv">
          <el-form-item label="头像：" class="custom-align-right" prop="imgUrl">
            <div class="uploaderBox">
              <el-upload class="avatar-uploader" action="#" :show-file-list="false" :before-upload="beforeAvatarUpload">
                <!-- <img v-if="imgUrl" :src="imgUrl" class="avatar">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i> -->
                <!-- 预览图片 -->
                <img v-if="imgUrl" :src="imgUrl" class="avatar">
                <!-- 上传图标 -->
                <!-- <i v-else class="el-icon-plus avatar-uploader-icon"></i> -->
                <div v-else class="chooseImgDiv">
                  <div>
                    <img src="@/assets/public/upload/noImage.png">
                    <div>选择图片</div>
                  </div>
                </div>
              </el-upload>
              <div class="photo_tips">
                请添加图片，上传格式要求jpg、gif、png，不大于500k</div>
            </div>
          </el-form-item>
          <el-form-item label="姓名：" prop="name" class="custom-align-right">
            <template #label>
              <span class="askBox">
                姓名：
              </span>
            </template>
            <el-input v-model="form.name" autocomplete="off" placeholder="请输入姓名"></el-input>
          </el-form-item>
          <div v-if="creatNews_user_type != 10000">
            <el-form-item label="展示名称：" prop="cat_arr_id" class="custom-align-right">
              <el-cascader :key="parentKey" v-model="form.cat_arr_id" placeholder="请选择要绑定的展示名称" :props="parentData"
                filterable clearable></el-cascader>
            </el-form-item>
          </div>
          <div v-if="creatNews_user_type == 10000">

            <el-form-item label="站点名称：" prop="cat_arr_id" class="custom-align-right">
              <el-cascader :key="parentKey" v-model="form.web_site_id" placeholder="请选择站点名称"
                :options="creatNews_nav_pool_arr" @change="creatNews_nav_pool_change_fun(form.web_site_id)" filterable
                clearable></el-cascader>
            </el-form-item>


            <el-form-item label="展示名称：" prop="cat_arr_id" class="custom-align-right">
              <el-cascader :key="parentKey_2" v-model="form.cat_arr_id" placeholder="请选择要绑定的父级导航" :props="parentData_2"
                filterable clearable></el-cascader>
            </el-form-item>

          </div>
          <el-form-item label="性别：" prop="sexy" class="custom-align-right">
            <el-radio-group v-model="form.sexy">
              <el-radio :label="1">男</el-radio>
              <el-radio :label="2">女</el-radio>
            </el-radio-group>
          </el-form-item>

          <el-form-item label="参加工作时间：" prop="jobtime" class="custom-align-right">
            <el-date-picker v-model="form.jobtime" type="date" placeholder="选择参加工作时间">
            </el-date-picker>
          </el-form-item>
          <!-- {{ years }}
          {{ form.experience }} -->
          <el-form-item label="工作经验：" prop="experience" class="custom-align-right" style="width: 100%;">
            <el-select v-model="form.experience" placeholder="请选择工作经验">
              <el-option v-for="item in years" :key="item.evalue" :label="item.ename" :value="item.evalue"></el-option>
            </el-select>
          </el-form-item>



          <el-form-item label="手机号：" prop="phone" class="custom-align-right">
            <el-input v-model="form.phone" autocomplete="off" placeholder="请输入手机号"></el-input>
          </el-form-item>
          <el-form-item label="微信号：" prop="wx" class="custom-align-right">
            <el-input v-model="form.wx" autocomplete="off" placeholder="请输入微信号"></el-input>
          </el-form-item>

          <el-form-item label="出生年月：" prop="validity" class="custom-align-right">
            <el-date-picker v-model="form.birth" type="date" placeholder="选择出生年月">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="最高学历：" class="custom-align-right" style="width: 100%;">
            <el-select v-model="form.educational" placeholder="请选择最高学历" @change='changeCompanyNature()'>
              <el-option v-for="item in educations" :key="item.evalue" :label="item.ename"
                :value="item.evalue"></el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="政治面貌：" class="custom-align-right" style="width: 100%;">
            <el-select v-model="form.politic" placeholder="请选择政治面貌">
              <el-option label="群众" :value="1"></el-option>
              <el-option label="团员" :value="2"></el-option>
              <el-option label="党员" :value="3"></el-option>
              <el-option label="其他" :value="4"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="籍贯：" prop="origin" class="custom-align-right">
            <el-input v-model="form.origin" autocomplete="off" placeholder="请输入籍贯"></el-input>
          </el-form-item>

          <el-form-item label="语言能力：" class="custom-align-right" style="width: 100%; display: inline;">
            <el-select v-model="form.language" placeholder="请选择语种" style="width: 40%;" @change='changeCompanyNature()'>
              <el-option v-for="item in languages" :key="item.evalue" :label="item.ename"
                :value="item.evalue"></el-option>
            </el-select>
            <el-select v-model="form.level" placeholder="请选择掌握程度" style="width: 40%;" @change='changeCompanyNature()'>
              <el-option v-for="item in languagetypes" :key="item.evalue" :label="item.ename"
                :value="item.evalue"></el-option>
            </el-select>
          </el-form-item>
          <!-- <el-divider content-position="right"> </el-divider> -->
          <div id="jobIntentions" style="margin: 10px 0px;">
            <tableTitle name="求职意向" />
            <!-- 求职意向表单内容 -->
          </div>
          <el-form-item label="工作地点：" prop="city_arr_id" class="custom-align-right">
            <el-cascader :key="cascaderKey" v-model="form.city_arr_id" placeholder="请选择工作地点" :props="cityData"
              filterable clearable></el-cascader>
          </el-form-item>

          <el-form-item label="职位性质：" class="custom-align-right" style="width: 100%;">
            <el-select v-model="form.politic" placeholder="请选择职位性质" @change='changeCompanyNature()'>
              <el-option v-for="item in natures" :key="item.evalue" :label="item.ename"
                :value="item.evalue"></el-option>
            </el-select>
          </el-form-item>



          <el-form-item label="所属行业：" prop="industry" class="custom-align-right" style="width: 100%;">
            <el-select v-model="form.industry" placeholder="请选择所属行业">
              <el-option v-for="item in jobIndustry" :key="item.hyid" :label="item.hyname"
                :value="item.hyid"></el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="职位类别：" prop="job" class="custom-align-right">
            <el-select v-model="form.job" placeholder="请选择职位类别" @change="changeJobname">
              <el-option v-for="item in jobPosition" :key="item.zwid" :label="item.zwname"
                :value="item.zwid"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="具体职位：" prop="job_name_get" class="custom-align-right">
            <el-select v-model="form.job_name_get" placeholder="请选择具体职位">
              <el-option v-for="item in job_name_arr" :key="item.zwid" :label="item.zwname"
                :value="item.zwid"></el-option>
            </el-select>
          </el-form-item>



          <el-form-item label="公司性质：" v-if="jobNature" prop="company_nature" class="custom-align-right">
            <el-select v-model="form.company_nature" placeholder="请选择公司性质" @change='changeCompanyNature()'>
              <el-option v-for="item in jobNature" :key="item.id" :label="item.nature_name" :value="item.id">
              </el-option>

            </el-select>
          </el-form-item>
          <el-form-item label="薪资范围：" prop="salary" class="custom-align-right">
            <el-select v-model="form.salary" placeholder="请选择薪资范围" @change='changeCompanyNature()'>
              <el-option v-for="item in incomes" :key="item.evalue" :label="item.ename"
                :value="item.evalue"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="个人评价：" prop="self_evaluation" class="custom-align-right">
            <el-input v-model="form.self_evaluation" autocomplete="off" type="textarea" aria-rowspan="6"
              placeholder="请输入个人评价"></el-input>
          </el-form-item>
          <!-- <el-divider content-position="right"> </el-divider> -->
          <div id="professionalSkills">
            <tableTitle name="专业技能" />
            <el-button type="primary" class="addBtn" @click="addSkill">
              +添加
            </el-button>
            <!-- 专业技能表单内容 -->
          </div>
          <el-form-item v-for="(item, index) in form.skillList" :key="index" :label="'技能' + (index + 1) + '：'"
            prop="skillList" class="custom-align-right">
            <el-input v-model="form.skillList[index].skill" autocomplete="off" placeholder="请输入专业技能"></el-input>
          </el-form-item>

          <div id="workExperience">
            <tableTitle name="工作经历" />
            <el-button type="primary" class="addBtn" @click="addExperience">
              +添加
            </el-button>
          </div>

          <div v-for="(item, index) in form.job_experience" :key="index">

            <el-form-item label="公司名称：" prop="company_name" class="custom-align-right" style="width: 100%;">
              <el-input v-model="form.job_experience[index].company_name" autocomplete="off"
                placeholder="请输入公司名称"></el-input>
            </el-form-item>


            <el-form-item label="所属行业：" prop="job_industry" class="custom-align-right" style="width: 100%;">
              <el-select v-model="form.job_experience[index].job_industry" placeholder="请选择所属行业"
                @change='changeCompanyNature()'>
                <el-option v-for="item in jobIndustry" :key="item.hyid" :label="item.hyname"
                  :value="item.hyid"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="职位类别：" prop="job_typename" class="custom-align-right">
              <el-select v-model="form.job_experience[index].job_typename" placeholder="请选择职位类别"
                @change="changeCompanyJobname">
                <el-option v-for="item in jobPosition" :key="item.zwid" :label="item.zwname"
                  :value="item.zwid"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="具体职位：" prop="job_name" class="custom-align-right">
              <el-select v-model="form.job_experience[index].job_name" placeholder="请选择具体职位">
                <el-option v-for="item in company_jobname_arr" :key="item.zwid" :label="item.zwname"
                  :value="item.zwid"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="所属部门：" prop="department" class="custom-align-right">
              <el-input v-model="form.job_experience[index].department" autocomplete="off"
                placeholder="请输入所属部门"></el-input>
            </el-form-item>

            <el-form-item label="在职时间：" prop="job_timeList" class="custom-align-right">
              <el-date-picker v-model="form.job_experience[index].job_timeList" type="daterange" range-separator="至"
                start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="工作内容：" prop="job_content" class="custom-align-right">
              <el-input v-model="form.job_experience[index].job_content" autocomplete="off" type="textarea"
                aria-rowspan="6" placeholder="请输入工作内容"></el-input>
            </el-form-item>
            <el-form-item label="工作业绩：" prop="performance" class="custom-align-right">
              <el-input v-model="form.job_experience[index].performance" autocomplete="off" type="textarea"
                aria-rowspan="6" placeholder="请输入工作业绩"></el-input>
            </el-form-item>
            <el-divider></el-divider>
          </div>


          <div id="educationExperience">
            <tableTitle name="教育经历" />
            <el-button type="primary" class="addBtn" @click="addEducation">
              +添加
            </el-button>
            <!-- 教育经历表单内容 -->
          </div>
          <div v-for="(item, index) in form.education_experience" :key="index">
            <el-form-item label="学校名称：" prop="school_name" class="custom-align-right">
              <el-input v-model="form.education_experience[index].school_name" autocomplete="off"
                placeholder="请输入学校名称"></el-input>
            </el-form-item>
            <el-form-item label="学历：" prop="school_education" class="custom-align-right" style="width: 100%;">
              <el-select v-model="form.education_experience[index].school_education" placeholder="请选择学历"
                @change='changeCompanyNature()'>
                <el-option v-for="item in educations" :key="item.evalue" :label="item.ename"
                  :value="item.evalue"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="专业：" prop="school_major" class="custom-align-right">
              <el-input v-model="form.education_experience[index].school_major" autocomplete="off"
                placeholder="请输入专业"></el-input>
            </el-form-item>


            <el-form-item label="时间段：" prop="school_timeList" class="custom-align-right">
              <el-date-picker v-model="form.education_experience[index].school_timeList" type="daterange"
                range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="在校经历：" prop="school_experience" class="custom-align-right">
              <el-input v-model="form.education_experience[index].school_experience" autocomplete="off" type="textarea"
                aria-rowspan="6" placeholder="请输入在校经历"></el-input>
            </el-form-item>
            <!-- <el-divider content-position="right"> </el-divider> -->
          </div>
        </div>
      </el-form>
    </div>
    <div class="bottomBtnBox">
      <el-button type="info" @click="returnPage">返回</el-button>
      <el-button type="primary" @click="editToServe" v-if="editStatus == true">确定</el-button>
      <el-button type="primary" @click="addToServe" v-else>发布求职</el-button>
    </div>

  </div>

</template>

<script>
import { getWebSiteId, getUseType } from '@/utils/auth'
//表格标题
import tableTitle from './components/tableTitle';
import tableTitle1 from './components/tableTitle1';
//引入公用样式
import '@/styles/global.less';
//格式化时间
import { formatLocalDate } from '@/utils/public';

export default {
  components: {
    tableTitle,
    tableTitle1
  },
  data() {

    //0.全局操作 start ------------------------------------------------------------>
    //表单验证
    const validateEmpty = (rule, value, callback) => {
      console.log(value, '-------------value--------')
      console.log(rule, '-------------rule--------')
      if (value == '') {
        callback(new Error('该项不能为空！'))
      } else {
        callback()
      }
    }
    const validateArray = (rule, value, callback) => {
      console.log(value, '-------------value--------')
      if (value.length == 0) {
        callback(new Error('该项不能为空！'))
      } else {
        callback()
      }
    }
    const validateArraySkill = (rule, value, callback) => {
      console.log(value, '-------------value--------')
      //查看value中的skill是不是为空
      let $values = value.filter(item => {
        return item.skill == ''
      })
      if ($values.length > 0) {
        callback(new Error('技能项不能有空！'))
      } else {
        callback()
      }
    }
    const validateCompanyNameEmpty = (rule, value, callback) => {
      console.log(value, '-------------value--------')
      if (value.length == 0) {
        callback(new Error('该项不能为空！'))
      }
      value.forEach(item => {
        if (item == '') {
          callback(new Error('公司名称不能为空！'))
        }
      })
      callback()
    }
    const validateJobIndustryEmpty = (rule, value, callback) => {
      console.log(value, '-------------value--------')
      if (value == '') {
        callback(new Error('该项不能为空！'))
      }
      value.forEach(item => {
        if (item == '') {
          callback(new Error('所属行业不能为空！'))
        }
      })
      callback()
    }
    const validateJobContentEmpty = (rule, value, callback) => {
      console.log(value, '-------------value--------')
      if (value.length == 0) {
        callback(new Error('该项不能为空！'))
      }
      value.forEach(item => {
        if (item == '') {
          callback(new Error('工作内容不能为空！'))
        }
      })
      callback()
    }
    const validateJobNameEmpty = (rule, value, callback) => {
      console.log(value, '--------1-----value--------')
      if (value == '') {
        callback(new Error('该项不能为空！'))
      }
      value.forEach(item => {
        if (item == '') {
          callback(new Error('职位名称不能为空！'))
        }
      })
      callback()
    }
    const validateJobTimeListEmpty = (rule, value, callback) => {
      console.log(value, '-------------value--------')
      if (value == '') {
        callback(new Error('该项不能为空！'))
      }
      value.forEach(item => {
        if (item == '') {
          callback(new Error('工作时间不能为空！'))
        }
      })
      callback()
    }

    const validateNumber = (rule, value, callback) => {
      console.log(value, '-------------value--------')
      if (value == '') {
        callback(new Error('该项不能为空！'))
      } else if (isNaN(value)) {
      }
    }
    let self = this;
    //0.全局操作 end ------------------------------------------------------------>
    return {
      jobIndustry: {},
      jobNature: [],
      jobPosition: {},
      jobEnum: {},
      educations: [],
      languages: [],
      languagetypes: [],
      natures: [],
      maritals: [],
      incomes: [],
      job_name_arr: [],//职位名称
      company_jobname_arr: [],//公司职位名称
      timeList: [],
      // imgurl: "http://img.bjzxtw.org.cn/dev/image/jpeg/20250220/1740044079754901.png",
      imgUrl: "",
      websiteid: 0,
      cascaderKey: 0,//弹窗用的key
      creatNews_pid_num: "0",//请求子导航用的pid
      creatNews_nav_pool_arr: [],//
      creatNews_add_nav_pool_arr: [],//
      creatNews_son_website_id_num: "",
      checked: false,
      formLabelWidth: '80px',//表单的长度
      //1.表单项 start ------------------------------------------------------------>
      editStatus: false,
      tableDivTitle: "添加求职",
      disclaimer: true,//免责声明
      //提交表单
      creatNews_user_type: 0,//判断用户类型'

      form: {
        experience: '',//工作经验
        industry: '',//行业
        job: '',//职位
        self_evaluation: '',//自我评价
        city_arr_id: [],
        skillList: [{ 'skill': '' }],
        job_experience: [{
          company_name: '',
          job_industry: '',
          job_name: '',
          job_typename: '',
          department: '',
          // job_timeList: ['2025-02-21 00:00:00', '2025-02-29 00:00:00'],
          job_timeList: [],
          performance: '',
          job_content: ''

        }],//工作经验
        education_experience: [{
          school_name: '',
          school_education: '',
          school_major: '',
          school_timeList: '',
          school_experience: ''
        }],//教育经历

        // 用于存储所有专业技能
        slelf_evaluation: '',//自我评价
        cat_arr_id: [],//导航池名称
        web_site_id: 0,
        name: "",
        sexy: 1,
        // jobtime: "2025-02-21 00:00:00",//工作时间
        jobtime: "",//工作时间
        origin: "",
        //校验专用
        industry: '',//行业
        job: '',//职位名称
        company_name: [],//公司名称
        job_industry: [],//行业
        job_name: [],//具体职位-工作经验
        job_typename: [],//职位类别-工作经验
        department: [],//所属部门
        job_timeList: [],//工作时间
        job_content: [],//工作内容
        job_name_get: '',
      },
      //1.2 表单验证规则
      formRules: {
        skillList: [{ required: true, trigger: 'blur', validator: validateArraySkill }],
        salary: [{ required: true, trigger: 'blur', validator: validateEmpty }],
        //求职名称不能为空
        name: [{ required: true, trigger: 'blur', validator: validateEmpty }],
        imgUrl: [{ required: true, trigger: 'blur', validator: validateEmpty }],
        sexy: [{ required: true, trigger: 'blur', validator: validateEmpty }],
        jobtime: [{ required: true, trigger: 'blur', validator: validateEmpty }],
        origin: [{ required: true, trigger: 'blur', validator: validateEmpty }],
        city_arr_id: [{ required: true, trigger: 'blur', validator: validateEmpty }],
        industry: [{ required: true, trigger: 'blur', validator: validateEmpty }],
        job: [{ required: true, trigger: 'blur', validator: validateEmpty }],
        slelf_evaluation: [{ required: true, trigger: 'blur', validator: validateEmpty }],
        company_name: [{ required: true, trigger: 'blur', validator: validateCompanyNameEmpty }],
        job_industry: [{ required: true, trigger: 'blur', validator: validateJobIndustryEmpty }],
        // job_name: [{ required: true, trigger: 'blur', validator: validateEmpty }],
        job_timeList: [{ required: true, trigger: 'blur', validator: validateArray }],
        job_content: [{ required: true, trigger: 'blur', validator: validateArray }],
        cat_arr_id: [{ required: true, trigger: 'blur', validator: validateArray }],
        job_typename: [{ required: true, trigger: 'blur', validator: validateArray }],
      },
      //1.3富文本编辑器配置

      //1.4图片上传
      //获取父级导航池
      parentKey: 0,//获取父级导航

      parentData: {
        checkStrictly: true,
        lazy: true,
        async lazyLoad(node, resolve) {
          const { level, data } = node;
          if (data && data.children && data.children.length !== 0) {
            return resolve(node)
          }
          // console.log(level)
          let parentId = level == 0 ? 0 : data.value
          let parames = {
            'pid': parentId
          }
          self.$store.dispatch('pool/categoryList', parames).then(res => {
            if (res.data) {
              const nodes = res.data.map(item => ({
                value: item.id,
                label: item.name,
                leaf: level >= 3,
                children: []
              }))
              resolve(nodes)
            }
          })
        }
      },
      //时间跨度
      pickerOptions: {
        selectableRange: '1900-01-01 to 2100-12-31', // 允许选择的日期范围
        // disabledDate(time) {
        //   return time.getTime() < Date.now() - 86400000; // 禁用今天之前的日期
        // },
      },

      parentKey_2: 0,//获取父级导航
      parentData_2: {
        checkStrictly: true,
        lazy: true,
        async lazyLoad(node, resolve) {
          const { level, data } = node;
          if (data && data.children && data.children.length !== 0) {
            return resolve(node)
          }
          let parentId;
          if (data != undefined) {
            parentId = data.value;
          } else {
            parentId = self.creatNews_pid_num.toString();
          }
          let parames = {
            'website_id': self.form.web_site_id ? self.form.web_site_id : self.websiteid,
            'pid': parentId

          }
          self.$store.dispatch('pool/get_creatNews_nav_son_actions', parames).then(res => {
            if (res.data) {
              const nodes = res.data.map(item => ({
                value: item.category_id,
                label: item.name,
                leaf: level >= 3,
                children: []
              }))
              resolve(nodes)
            }
          })
        }
      },
      cityData: {
        checkStrictly: true,
        lazy: true,
        async lazyLoad(node, resolve) {
          const { level, data } = node;
          if (data && data.children && data.children.length !== 0) {
            return resolve(node)
          }
          console.log(level, '====level-----')
          let parentId = level == 0 ? 0 : data.value
          let parames = {
            'pid': parentId
          }
          self.$store.dispatch('pool/getcityList', parames).then(res => {
            if (res.data) {
              const nodes = res.data.map(item => ({
                value: item.id,
                label: item.name,
                leaf: level >= 3,
                children: []
              }))
              resolve(nodes)
            }
          })
        }
      },
      inputList: [
        { value: '' }
      ]
      //表单项 end ------------------------------------------------------------>
    };
  },
  methods: {
    changeCompanyNature(val) {
      this.$forceUpdate();
    },
    changeJobname(value) {
      // 修改此处，确保传递的是正确的参数对象
      this.form.job_name_get = ''; // 清空具体职位选择
      this.$store.dispatch('news/getPositionList', { zwpid: value }).then(res => {
        console.log(res.data, '-----res.job_name_arr----------------------')
        this.job_name_arr = res.data;
      })
    },
    changeCompanyJobname(value) {
      // 修改此处，确保传递的是正确的参数对象
      this.form.job_name = ''; // 清空具体职位选择
      this.$store.dispatch('news/getPositionList', { zwpid: value }).then(res => {
        // console.log(res.data, '-----changeCompanyJobname.getPositionList----------------------') 
        this.company_jobname_arr = res.data;
        console.log(this.company_jobname_arr, '-----changeCompanyJobname.getPositionList----------------------')
      })
    },
    getJobHuntingData() {
      this.$store.dispatch('news/getJobHuntingData', {}).then(res => {
        if (res.code == 200) {
          this.jobEnum = res.data.jobEnum;
          this.educations = this.jobEnum.filter(item => item.egroup === 'education');
          this.languages = this.jobEnum.filter(item => item.egroup === 'language');
          this.languagetypes = this.jobEnum.filter(item => item.egroup === 'languagetype');
          this.natures = this.jobEnum.filter(item => item.egroup === 'nature');
          this.maritals = this.jobEnum.filter(item => item.egroup === 'marital');
          this.incomes = this.jobEnum.filter(item => item.egroup === 'income');
          this.years = this.jobEnum.filter(item => item.egroup === 'years');
          this.jobIndustry = res.data.jobIndustry;
          this.jobNature = res.data.jobNature;
          console.log(this.educations, '-----this.jobNature----------------------')
          this.jobPosition = res.data.jobPosition.filter(item => item.zwpid == 0);
          //具体职位
          this.jobPosition1 = res.data.jobPosition.filter(item => item.zwpid !== 0);
        }
      })
    },
    // ... 其他方法
    addSkill() {
      //判断skill是不是为空，为空则不能添加
      const hasEmptySkill = this.form.skillList.some(item => {
        if (item.skill == '') {
          this.$message.error('请先填写专业技能');
          return true; // 返回 true 表示找到了空的 skill
        }
        return false; // 返回 false 表示没有找到空的 skill
      });
      if (hasEmptySkill) {
        return; // 如果有空的 skill，则提前结束 addSkill 方法
      }
      this.form.skillList.push({ skill: '' });
    },
    addExperience() {
      const hasEmptyExperience = this.form.job_experience.some(item => {
        // console.log(item, '-------------item--------')
        if (item.company_name == '' || item.job_industry == '' || item.job_name == '' || item.job_timeList == '' || item.job_content == '' || item.job_typename == '') {
          this.$message.error('请先填写工作经历');
          return true; // 返回 true 表示找到了空的 skill
        }
        return false;
      })
      if (hasEmptyExperience) {
        return; // 如果有空的 skill，则提前结束 addSkill 方法
      }
      this.form.job_experience.push({
        company_name: '',
        job_industry: '',
        job_name: '',
        job_typename: '',
        department: '',
        job_timeList: '',
        performance: '',
        job_content: ''
      });
    },
    addEducation() {
      const hasEmptyEducation = this.form.education_experience.some(item => {

        if (item.school_name == '') {
          this.$message.error('请先填写学校名称');
          return true; // 返回 true 表示找到了空的 skill
        }
      })
      if (hasEmptyEducation) {
        return; // 如果有空的 skill，则提前结束 addSkill 方法
      }
      this.form.education_experience.push({
        school_name: '',
        degree: '',
        major: '',
        graduation_time: ''
      });
    },
    scrollToSection(id) {
      const element = document.getElementById(id);
      if (element) {
        element.scrollIntoView({ behavior: 'smooth' });
      }
    },

    //1.提交表单 start ------------------------------------------------------------>
    //1.1 直接上传图片
    beforeAvatarUpload(file) {
      const isJPG = file.type === 'image/jpeg';
      const isPNG = file.type === 'image/png';
      const isLt2M = file.size / 1024 / 1024 < 2;

      if (!isJPG && !isPNG) {
        this.$message.error('上传缩略图只能是 JPG 或 PNG 格式!');
        return false;
      }
      if (!isLt2M) {
        this.$message.error('上传缩略图大小不能超过 2MB!');
        return false;
      }
      const formData = new FormData();
      formData.append('file', file);
      this.$store.dispatch('pool/uploadFile', formData).then(res => {
        this.imgUrl = res.data.imgUrl;//显示缩略图
        this.form.imgUrl = res.data.imgUrl;//提供表单地址
        // this.$set(this, 'imgUrl', res.data.imgUrl); // 设置 imgUrl
        // this.$set(this.form, 'imgurl', res.data.imgUrl); // 设置 form.imgurl
        console.log(res.data.imgUrl)
        console.log(this.imgurl, '-------------imgurl-----2---')
        console.log(this.form.imgUrl, '-------------form.imgurl--------')
      })
      // 阻止默认的上传行为
      return false;
    },
    //1.2 提交表单
    addToServe() {
      //先进行验证
      console.log(this.form, '-------------form1--------');
      this.$refs.form.validate(valid => {

        if (valid) {
          // 创建 form 对象的深拷贝
          const formCopy = JSON.parse(JSON.stringify(this.form));

          // 在副本上进行 JSON 转换
          formCopy.job_experience = JSON.stringify(formCopy.job_experience);
          formCopy.education_experience = JSON.stringify(formCopy.education_experience);
          formCopy.skillList = JSON.stringify(formCopy.skillList);
          formCopy.city_arr_id = JSON.stringify(formCopy.city_arr_id);
          formCopy.cat_arr_id = JSON.stringify(formCopy.cat_arr_id);
          formCopy.website_id = formCopy.web_site_id == 0 ? this.websiteid : formCopy.web_site_id;
          // 去掉 formCopy.web_site_id
          delete formCopy.web_site_id;
          if (formCopy.website_id == 0) {
            this.$message.error('请选择站点名称');
            return;
          }

          if (formCopy.jobtime != '' && formCopy.jobtime != null && formCopy.jobtime != undefined) {
            formCopy.jobtime = formatLocalDate(formCopy.jobtime);
          } else {
            formCopy.jobtime = null;
          }
          console.log(formCopy.birth, "-----------------birth----------");
          if (formCopy.birth != '' && formCopy.birth != null && formCopy.birth != undefined) {
            formCopy.birth = formatLocalDate(formCopy.birth);
          } else {
            formCopy.birth = null;
          }
          formCopy.job_timeList.forEach(item => {
            item = formatLocalDate(item);
          });
          console.log(new Date().getTime(), '-------------------校验结束------------------');
          //判断用户身份
          if (this.creatNews_user_type == 10000) {
            console.log("用户身份为管理员,无需审核直接发布!")
            this.form.status = 2;
          } else {
            console.log("用户身份为其他用户,提交到审核!")
            this.form.status = 1;
          }
          this.$store.dispatch('news/addJobHunting', formCopy).then(res => {
            if (res.code == 200) {
              //汇报结果
              this.$message({
                type: 'success',
                message: '已成功添加求职！'
              });
              this.cleatForm(2);
              //返回列表页
              this.returnPage()
            } else {
              this.$message({
                type: 'error',
                message: "求职发布失败，请稍后再试！"
              });
            }
          }).catch(() => {
            this.$message({
              type: 'info',
              message: '网络错误，请重试！'
            });
          })
        }
      })
    },
    //1.3 清理表单
    cleatForm(type) {
      this.form = {
        title: '',//求职标题
        islink: 0,//是否使用外链 0非 1是
        linkurl: "",//外链地址
        //1.2没有使用外链
        cat_arr_id: '',//导航池名称
        level: "",//推荐等级
        web_site_id: 0,
        name: "",
        sexy: 1,
        jobtime: "",//工作时间
        //校验专用
        company_name: [],//公司名称
        job_industry: [],//行业
        job_name: [],//职位名称
        job_typename: [],//职位类别-工作经验
        department: [],//所属部门
        job_timeList: [],//工作时间
        job_content: [],//工作内容
      };
      this.imgUrl = "";
    },
    //提交表单 end ------------------------------------------------------------>

    //2.跳转操作 start ------------------------------------------------------------>
    returnPage() {
      this.$router.push({
        path: '/jobHuntingList',
      });
    },
    //跳转操作 end ------------------------------------------------------------>

    //3.回显操作 ------------------------------------------------------------>
    //3.1回显数据
    getMainData() {
      let data = {
        id: this.$route.query.id
      };
      this.$store.dispatch('news/getJobHuntingInfo', data).then(res => {
        console.log(res);

        this.form.cat_arr_id = Array.isArray(res.data.cat_arr_id) ? res.data.cat_arr_id : JSON.parse(res.data.cat_arr_id);
        this.parentKey += 1; // 触发级联选择器重新加载
        this.loadCascaderPath(this.form.cat_arr_id); // 加载路径数据

        this.form.name = res.data.name;
        this.form.sexy = res.data.sexy;
        this.form.age = res.data.age;
        this.form.phone = res.data.phone;
        this.form.email = res.data.email;
        this.form.wx = res.data.wx;
        this.form.company_nature = res.data.company_nature;
        this.form.salary = res.data.salary;
        this.form.self_evaluation = res.data.self_evaluation;
        this.form.job = parseInt(res.data.job);
        this.form.industry = res.data.industry;
        this.form.experience = res.data.experience;


        this.form.educational = res.data.educationa == null ? "" : parseInt(res.data.educational);
        this.form.politic = res.data.politic;
        this.form.language = res.data.language;
        this.form.level = res.data.level;


        this.form.address = res.data.address;
        this.form.content = res.data.content;
        this.form.imgUrl = res.data.imgurl;
        this.imgUrl = res.data.imgurl;
        this.form.web_site_id = res.data.website_id;
        this.form.jobtime = res.data.jobtime ? new Date(res.data.jobtime) : '';
        this.form.birth = res.data.birth ? new Date(res.data.birth) : '';
        this.form.origin = res.data.origin;
        this.form.city_arr_id = Array.isArray(res.data.city_arr_id) ? res.data.city_arr_id : JSON.parse(res.data.city_arr_id);
        this.form.job_experience = JSON.parse(res.data.job_experience);
        // console.log(this.form.job_experience, '-----------------this.form.job_experience----------------------')
        this.form.education_experience = JSON.parse(res.data.education_experience);
        this.form.skillList = JSON.parse(res.data.skillList);
        this.form.job_name_get = res.data.job_name_get == null ? '' : parseInt(res.data.job_name_get);

      }).catch(() => {
        this.$message({
          type: 'info',
          message: '网络错误，请重试！'
        });
      })
    },
    async loadCascaderPath(path) {
      for (let i = 0; i < path.length; i++) {
        const parentId = path[i - 1] || 0; // 获取当前层级的父级ID
        const level = i; // 当前层级的索引
        await this.$store.dispatch('pool/categoryList', { pid: parentId })
          .then((res) => {
            const nodes = res.data.map(item => ({
              value: item.id,
              label: item.name,
              leaf: level >= 3, // 假设4层结构，设置叶子节点标记
            }));
            // 级联选择器加载数据
            if (level === path.length - 1) {
              this.form.cat_arr_id = path; // 确保最后一级路径正确设置
              this.parentKey += 1; // 强制刷新 cascader
            }
          });
      }
    },
    //1.3提交修改
    editToServe() {
      //提交之前先判断是否为外链
      //如果使用了外链，清理掉除了外链以外的内容

      //添加要修改的id
      this.form.id = this.editId;
      //先进行验证
      let startTime = new Date().getTime();
      console.log(startTime, '-------------------开始------------------');
      this.$refs.form.validate(valid => {
        //记录开始时间
        let startTime1 = new Date().getTime();
        console.log(startTime1, '-------------------校验开始------------------');
        if (valid) {
          console.log(this.form)
          // 创建 form 对象的深拷贝
          const formCopy = JSON.parse(JSON.stringify(this.form));

          // 在副本上进行 JSON 转换
          formCopy.job_experience = JSON.stringify(formCopy.job_experience);
          formCopy.education_experience = JSON.stringify(formCopy.education_experience);
          formCopy.skillList = JSON.stringify(formCopy.skillList);
          formCopy.city_arr_id = JSON.stringify(formCopy.city_arr_id);
          formCopy.cat_arr_id = JSON.stringify(formCopy.cat_arr_id);
          formCopy.website_id = formCopy.web_site_id == 0 ? this.websiteid : formCopy.web_site_id;
          // 去掉 formCopy.web_site_id
          delete formCopy.web_site_id;

          if (formCopy.website_id == 0) {
            this.$message.error('请选择站点名称');
            return;
          }

          if (formCopy.jobtime != '' && formCopy.jobtime != null && formCopy.jobtime != undefined) {
            formCopy.jobtime = formatLocalDate(formCopy.jobtime);
          } else {
            formCopy.jobtime = null;
          }
          console.log(formCopy.birth, "-----------------birth----------");
          if (formCopy.birth != '' && formCopy.birth != null && formCopy.birth != undefined) {
            formCopy.birth = formatLocalDate(formCopy.birth);
          } else {
            formCopy.birth = null;
          }


          formCopy.job_timeList.forEach(item => {
            item = formatLocalDate(item);
          });
          console.log(new Date().getTime(), '-------------------校验结束------------------');
          //判断用户身份
          if (this.creatNews_user_type == 10000) {
            console.log("用户身份为管理员,无需审核直接发布!")
            this.form.status = 2;
          } else {
            console.log("用户身份为其他用户,提交到审核!")
            this.form.status = 1;
          }
          this.$store.dispatch('news/updateJobHunting', formCopy).then(res => {
            //记录结束时间
            let endTime = new Date().getTime(); //计算时间差
            console.log(endTime, '-------------------结束------------------');
            let time = endTime - this.startTime;
            //记录时间差
            console.log('时间差'.time, '------------------2--------');
            if (res.code != 200) {
              this.$message.error("修改失败，请稍后再试！");
            } else {
              //汇报结果
              this.$message({
                type: 'success',
                message: '已成功编辑求职！'
              });
              this.cleatForm(2);
              //返回列表页
              this.returnPage()
            }
          }).catch(() => {
            this.$message({
              type: 'info',
              message: '网络错误，请重试！'
            });
          })
        }
      })
    },
    //跳转操作 end ------------------------------------------------------------>
    get_creatNews_form_id_fun() {//判断用户类型ajax
      this.$store.dispatch('public/getInfo').then(res => {
        //     console.log("res======",res)
        // this.form.user_type = res.data.type_id;

      }).catch(() => {
        this.$message({
          type: 'info',
          message: '网络错误，请重试！'
        });
      })
      // console.log("this.form.user_type==",this.form);
      // console.log("this.form.user_type==2",this.form.user_type);

    },
    get_creatNews_nav_pool_arr_fun() {//xx
      this.$store.dispatch('pool/get_creatNews_nav_actions', { page: 1, pageSize: 666666 }).then(res => {
        res.data.rows.forEach((per_obj) => {
          let new_per = {
            label: per_obj.website_name,
            value: per_obj.id,
          }
          this.creatNews_nav_pool_arr.push(new_per)
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '网络错误，请重试！'
        });
      })
    },
    creatNews_nav_pool_change_fun() {      //xx  导航池级
      let that = this; this.form.web_site_id = this.form.web_site_id[0]
      that.parentKey_2 += 1; this.$store.dispatch('pool/get_creatNews_nav_son_actions', { pid: String(this.creatNews_pid_num), website_id: String(this.form.web_site_id) }).then(res => {
        if (res.data.length == 0) {//没有导航池子级
          // alert("没有导航池子级");
          return
        } this.creatNews_add_nav_pool_arr = res.data; this.creatNews_add_nav_pool_arr.forEach((per_obj) => {
          per_obj.label = per_obj.name,
            per_obj.value = per_obj.id, this.creatNews_pid_num = per_obj.category_id
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '网络错误，请重试！'
        });
      })
    },
  },
  mounted() {
    this.creatNews_user_type = getUseType()
    this.websiteid = getWebSiteId()
    this.get_creatNews_form_id_fun()//
    this.get_creatNews_nav_pool_arr_fun()//
    this.getJobHuntingData()
    console.log(this.websiteid, '-------websiteid-------');
    //1.判断是新建还是回显
    if (this.$route.query.id != undefined) {
      this.editId = this.$route.query.id;
      this.editStatus = true;
      console.log("编辑新闻！")
      this.getMainData();
    } else {
      this.editStatus = false;
      console.log("添加新闻！")
    }
  },
  watch: {
    'form.job_experience': {
      // console.log(form.job_experience, ',-=-------job_typename---------');
      handler(newVal, oldVal) {
        // console.log(oldVal, ',-=-------job_typename---------');
        newVal.forEach((item, index) => {
          // 确保每个对象都有默认值
          // if (!item.company_name) item.job_industry = '';
          // if (!item.job_name) item.job_name = '';
          // if (!item.department) item.department = '';
          // if (!item.job_timeList) item.job_timeList = '';
          // if (!item.job_content) item.job_content = '';
          // if (!item.performance) item.performance = '';
          // 检查 company_name 是否发生变化
          // console.log(newVal[index].job_typename, oldVal[index].job_typename, '---job_typename---');
          // console.log(newVal[index].job_industry, '---job_industry---');
          this.form.company_name[index] = item.company_name;
          this.form.job_industry[index] = item.job_industry;
          this.form.job_name[index] = item.job_name;
          this.form.job_typename[index] = item.job_typename;
          this.form.department[index] = item.department;
          this.form.job_timeList[index] = item.job_timeList;
          this.form.job_content[index] = item.job_content;


          // console.log(this.form.job_industry, '-=-------job_industry---------');
          // console.log(this.form.company_name, '-=-------job_name---------');
          // if (oldVal[index] && oldVal[index].company_name !== item.company_name) {
          //   // 如果发生变化，就修改this.form.company_name相应的值
          // }
        });
      },
      deep: true // 深度监听数组内部对象的变化
    }
  }
};
</script>

<style scoped lang="less">
.floating-menu {
  position: fixed;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  background-color: #f8f8f8;
  border: 1px solid #ddd;
  padding: 10px;
  border-radius: 4px;
  z-index: 222;
}

.menu-item {
  cursor: pointer;
  margin-bottom: 5px;
  font-size: 14px;
}

.menu-item:hover {
  color: #409eff;
}

//执行v-deep穿透scope选择器 start------------------------------------------------------------>*/
::v-deep .custom-form-item>.el-form-item__label {
  line-height: 140px !important;
}

::v-deep .custom-textarea .el-textarea__inner {
  resize: none;
  /* 禁止用户拖拽调整大小 */
}

::v-deep .custom-align-right .el-form-item__label {
  text-align: right;
  /* 设置标签文字右对齐 */
}

::v-deep .el-select {
  width: 100%;
  /* 禁止用户拖拽调整大小 */
}

::v-deep .el-input-group__prepend {
  color: black !important;
}

.formLabelFloatBox {
  margin-bottom: 10px;
  position: relative;

  .formLabeladdIcon {
    position: absolute;
    right: 45px;
    top: 5px;
    width: 38px;
    height: 24px;
  }

  .formLabelDelIcon {
    position: absolute;
    right: 5px;
    top: 5px;
    width: 38px;
    height: 24px;
  }


}

//该项不能为空几个字的位置
::v-deep .el-form-item__error {
  color: #ff4949;
  font-size: 12px;
  line-height: 1;
  padding-top: 4px;
  position: relative;
}

//输入框距离底部的距离
::v-deep .el-form-item {
  margin-bottom: 5px;
}

//图片提示文字样式
.photo_tips {
  font-size: 14px;
  color: #999;
}

#educationExperience,
#workExperience,
#professionalSkills {
  position: relative;
}

.addBtn {
  position: absolute;
  right: 0px;
  top: -8px;
  width: 78px;
  // display: inline-block;
  // margin-bottom: 0px;
}

//执行v-deep穿透scope选择器 end------------------------------------------------------------>*/</style>