|
|
<template>
|
|
|
<div class="detail-container">
|
|
|
<div style="height: 56px"></div>
|
|
|
<!-- 面包屑 -->
|
|
|
<a-breadcrumb class="w" style="width: 960px; min-width: 960px">
|
|
|
<a-breadcrumb-item href>
|
|
|
<router-link to="/main">
|
|
|
<a-icon type="home" />
|
|
|
</router-link>
|
|
|
</a-breadcrumb-item>
|
|
|
<a-breadcrumb-item href>
|
|
|
<a @click="toList">
|
|
|
<span>{{ "职位列表" }}</span>
|
|
|
</a>
|
|
|
</a-breadcrumb-item>
|
|
|
<a-breadcrumb-item href>
|
|
|
<span style="color: #333">{{ "职位详情" }}</span>
|
|
|
</a-breadcrumb-item>
|
|
|
</a-breadcrumb>
|
|
|
<!-- 主体区域 -->
|
|
|
<div class="maincontent w g_flex_row_between">
|
|
|
<div class="m-money-obj g_mb_20 g_p_20 g_flex_row_between" style="background-color: #fff; border-radius: 6px; width: 800px; margin: 0 auto 20px" v-if="false">
|
|
|
<div class="g_flex_row_start">
|
|
|
<div style="font-size: 16px; font-weight: 600; margin-right: 4px">代理佣金</div>
|
|
|
<div class="g_flex_column_center" @click="isSee = !isSee" style="cursor: pointer">
|
|
|
<i class="iconfont icon-zhengyan11" style="font-size: 22px; color: #ff4400; line-height: 0.1" v-if="isSee"></i>
|
|
|
<i class="iconfont icon-biyan11" style="font-size: 22px; color: #ff4400; line-height: 0.1; margin-top: -4px" v-if="!isSee"></i>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="g_flex_row_end" @click="viewDetail" style="cursor: pointer">
|
|
|
<div class="g_flex_column_center g_fs_14">
|
|
|
<span v-if="isSee">
|
|
|
{{ jobDetail.servetype }}
|
|
|
</span>
|
|
|
<span v-if="!isSee"> *** </span>
|
|
|
</div>
|
|
|
<div class="g_flex_column_center">
|
|
|
<i class="iconfont icon-xiangyou1"></i>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<!-- 非职教 -->
|
|
|
<div class="maincontentleft">
|
|
|
<div class="mask" v-if="!(jobDetail.recruitment == '1')"></div>
|
|
|
|
|
|
<div class="subset">
|
|
|
<a-skeleton avatar active class="skeleton1" v-show="skeletonshow" :paragraph="{ rows: 4 }" />
|
|
|
<div class="subsetleft" v-show="!skeletonshow" style="border-bottom: 1px solid rgb(237, 237, 237);padding-bottom: 20px;">
|
|
|
<div class="info">
|
|
|
<!-- <div class="imgbox">
|
|
|
<img v-if="jobDetail.logo || store.logo" :src="jobDetail.logo || store.logo" alt />
|
|
|
<img v-else src="../../../static/img/nopicture.png" alt />
|
|
|
</div> -->
|
|
|
<div class="jobinfobox">
|
|
|
<div class="g_flex_row_between">
|
|
|
<div class="jobname">
|
|
|
{{ jobDetail.jobName }}
|
|
|
<span class="hotTag" v-if="jobDetail.hotJob == 1">
|
|
|
<i class="iconfont icon-dianzan1 mr0" style="font-size: 12px"></i>
|
|
|
主推
|
|
|
</span>
|
|
|
</div>
|
|
|
<div style="color: #a1a1a1; font-size: 14px; margin-left: 15px">{{ jobDetail.up_time }}</div>
|
|
|
</div>
|
|
|
<div class="jobinfo">
|
|
|
<span>{{ jobDetail.district ? jobDetail.district + " | " : "" }} </span>
|
|
|
|
|
|
<span>{{ jobDetail.gender }}</span>
|
|
|
<span>{{ jobDetail.age }}</span>
|
|
|
</div>
|
|
|
<div class="jobtag" v-if="jobDetail && jobDetail.jobRequestLabelNames && jobDetail.jobRequestLabelNames.length > 0">
|
|
|
<a-tag :color="labelColor[index % labelColor.length]" style="margin-bottom: 8px" v-for="(item, index) in jobDetail.jobRequestLabelNames" :key="index">
|
|
|
{{ item }}
|
|
|
</a-tag>
|
|
|
</div>
|
|
|
<!-- <div style="height: 27px" v-if="!jobDetail.jobRequestLabelNames" class="jobtag">
|
|
|
<a-tag :color="labelColor[1]">暂无要求</a-tag>
|
|
|
</div> -->
|
|
|
<!-- <div class="jobtag1">
|
|
|
<a-tag v-for="(item, index) in jobDetail.jobSpecialLabelNames" :key="index">{{ item }}</a-tag>
|
|
|
</div>
|
|
|
<div style="height: 27px" v-if="!jobDetail.jobSpecialLabelNames" class="jobtag">
|
|
|
<a-tag style="background-color: #f5f5f5">暂无特色</a-tag>
|
|
|
</div> -->
|
|
|
<div class="g_flex_row_between g_mt_4">
|
|
|
<div style="display: flex; align-items: center; height: 26px; margin-top: 8px">
|
|
|
<div class="jobpricehour" v-html="getSalaryClassifyValue(jobDetail.salaryClassify, jobDetail.salaryClassifyValue)"></div>
|
|
|
<span style="font-size: 14px"> | </span>
|
|
|
<div class="g_flex_column_end">
|
|
|
<div class="jobpricemonth">
|
|
|
<span>{{ jobDetail.minMonthlyPay / 100 }}</span
|
|
|
>-<span>{{ jobDetail.maxMonthlyPay / 100 }}</span
|
|
|
>元/月
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="sub-bottombox fss">
|
|
|
<button type="primary" class="jobDespBtn g_fs_14" style="padding: 0 5px; width: 100px">
|
|
|
<a :href="jobDetail.customServiceUrl || 'javascript:;'" target="_blank" v-if="jobDetail.customServiceUrl">
|
|
|
<a-icon class="g_fs_14" type="message" />
|
|
|
联系客服
|
|
|
</a>
|
|
|
<a href="javascript:;" v-else @click="noCustom">
|
|
|
<a-icon class="g_fs_14" type="message" />
|
|
|
联系客服
|
|
|
</a>
|
|
|
</button>
|
|
|
|
|
|
<!-- <a-dropdown :trigger="['click']" overlayClassName="special-dropdown" v-else>
|
|
|
<button type="primary" class="jobDespBtn"
|
|
|
style="padding: 0 15px;width: 116px;"
|
|
|
>
|
|
|
<a href="javascript:;" target="_blank"
|
|
|
style="font-size: 14px;"
|
|
|
>
|
|
|
<i class="iconfont icon-kefu_lan mr6"></i>
|
|
|
联系客服
|
|
|
</a>
|
|
|
</button>
|
|
|
<a-menu slot="overlay" style="padding: 0 10px">
|
|
|
<a-menu-item v-for="(item, index) in customServiceUsers" :key="index"> <i class="iconfont icon-dianhua1 mr4 f14" style="color: #1890ff"></i>{{ item.aliasName }} {{ item.tel }} </a-menu-item>
|
|
|
</a-menu>
|
|
|
</a-dropdown> -->
|
|
|
<a-button class="" @click="torecord()" v-if="jobDetail.recruitment == '1'" type="primary" style="font-size: 14px;width: 100px;font-weight: bold;">立即报名</a-button>
|
|
|
<button class="norecruitment bottombox1" v-else>暂时停招</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- <div class="swiperBox" style="display: flex; justify-content: start">
|
|
|
<img :src="jobDetail.logo || jobDetail.store.logo" alt v-if="jobDetail.logo || jobDetail.store.logo" @click="showImage(0, 'logo')" style="cursor: pointer; width: 80px; height: 45px" />
|
|
|
<div id="swiper">
|
|
|
<div class="swiper-wrapper">
|
|
|
<div class="swiper-slide" v-for="(item, index) in [...storeImage]" :key="index">
|
|
|
<img :src="item" alt v-if="isImg(item)" @click="showImage(index)" style="cursor: pointer" />
|
|
|
<div v-if="!isImg(item)">
|
|
|
<div style="position: absolute; width: 78px; height: 78px; left: 0; top: 0; z-index: 99; background-color: transparent; cursor: pointer" @click.stop="handlePreview(item)"></div>
|
|
|
<video class="imgSpan" style="width: 80px; height: 45px" controls>
|
|
|
<source :src="item" type="video/mp4" />
|
|
|
<source :src="item" type="video/ogg" />
|
|
|
您的浏览器不支持 HTML5 video 标签。
|
|
|
</video>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="swiper-button-next"></div>
|
|
|
<div class="swiper-button-prev"></div>
|
|
|
</div> -->
|
|
|
<a-modal :visible="previewVisible" wrapClassName="spic" centered :footer="null" @cancel="handleCancel">
|
|
|
<video style="width: 100%; max-height: calc(100vh - 40px)" id="movie" autoplay :src="previewImage" controls="controls" />
|
|
|
</a-modal>
|
|
|
</div>
|
|
|
<div class="subsetright">
|
|
|
<div class="topbox" v-if="false">
|
|
|
<div>服务费</div>
|
|
|
<div>
|
|
|
<span>{{ jobDetail.servetype }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="jobinformationbox" style="padding-left: 20px; padding-top: 4px">
|
|
|
<h1 v-if="false">
|
|
|
<div class="infotitle">
|
|
|
<span @click="tabchange = 1" :class="tabchange === 1 ? 'active' : ''">基本信息</span>
|
|
|
<span @click="tabchange = 0" :class="tabchange === 0 ? 'active' : ''" v-if="false">财务结算</span>
|
|
|
<span @click="tabchange = 2" :class="tabchange === 2 ? 'active' : ''">职位描述</span>
|
|
|
</div>
|
|
|
</h1>
|
|
|
<div class="g_flex_row_between" style="border-bottom: 1px solid rgb(237, 237, 237);">
|
|
|
<div v-for="(item,index) in tabList" :key="index"
|
|
|
class="tab-item"
|
|
|
:class="tabActive == (index + 1) ? 'tab-item-active' : ''"
|
|
|
@click="updateTab(item,index)"
|
|
|
>
|
|
|
{{ item.title }}
|
|
|
<div class="bor"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="pay" id="tip" v-show="tabchange === 1">
|
|
|
<div class="mb12 mt20 titlestyle">温馨提示</div>
|
|
|
<div class="showInfo" style="width: unset; color: #ff4400 !important">{{ jobDetail.notes || "-" }}</div>
|
|
|
</div>
|
|
|
<div v-if="tabchange == 1" style="display: flex">
|
|
|
<!-- 薪资 -->
|
|
|
<div class="baseInfoContent" v-if="tabchange === 1">
|
|
|
<div class="pay" id="pay">
|
|
|
<div class="mb12 mt20">薪资待遇</div>
|
|
|
<a-descriptions bordered size="small" :column="1" class="leftDesc boubleLevel">
|
|
|
<a-descriptions-item class="test1">
|
|
|
<span slot="label" class>薪资明细</span>
|
|
|
<span>{{ jobDetail.salaryDetail || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<!-- <a-descriptions-item>
|
|
|
<span slot="label" class>发薪日</span>
|
|
|
<span>{{ jobDetail.payDay || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<a-descriptions-item>
|
|
|
<span slot="label" class>银行卡</span>
|
|
|
<span>{{ jobDetail.bankInfo || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<a-descriptions-item>
|
|
|
<span slot="label" class>保险</span>
|
|
|
<span>{{ jobDetail.employeeInsurance || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<a-descriptions-item>
|
|
|
<span slot="label" class>押金</span>
|
|
|
<span>{{ jobDetail.foregift || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<template v-if="jobClassify == 2">
|
|
|
<a-descriptions-item>
|
|
|
<span slot="label" class>培训/试用期</span>
|
|
|
<span>{{ jobDetail.training || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
</template>
|
|
|
<template v-else>
|
|
|
<a-descriptions-item v-if="jobClassify == 1">
|
|
|
<span slot="label" class>培训</span>
|
|
|
<span>{{ jobDetail.training || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<a-descriptions-item>
|
|
|
<span slot="label" class>试用期</span>
|
|
|
<span>{{ jobDetail.probationStr || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
</template> -->
|
|
|
|
|
|
<!-- <a-descriptions-item>
|
|
|
<span slot="label" class>福利待遇</span>
|
|
|
<span>{{ jobDetail.boon || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<a-descriptions-item v-if="jobClassify == 1">
|
|
|
<span slot="label" class>薪资说明</span>
|
|
|
<span style="white-space: break-spaces">
|
|
|
{{ jobDetail.salaryDesp || "-" }}
|
|
|
</span>
|
|
|
</a-descriptions-item> -->
|
|
|
</a-descriptions>
|
|
|
</div>
|
|
|
<!-- 岗位要求 -->
|
|
|
<div class="required" id="required">
|
|
|
<div class="mb12 mt20">招聘要求</div>
|
|
|
<a-descriptions bordered size="small" :column="1" class="leftDesc">
|
|
|
<a-descriptions-item class="test1">
|
|
|
<span slot="label" class>性别年龄</span>
|
|
|
<span>
|
|
|
<span class="man" v-if="jobDetail.minAgeMan">
|
|
|
男 {{ jobDetail.minAgeMan }}<span v-if="jobDetail.maxAgeMan"> {{ "- " + jobDetail.maxAgeMan }} </span>岁 ；
|
|
|
</span>
|
|
|
<span class="woman" v-if="jobDetail.minAgeWoman">
|
|
|
女 {{ jobDetail.minAgeWoman }}<span>{{ "- " + jobDetail.maxAgeWoman }}</span
|
|
|
>岁
|
|
|
</span>
|
|
|
{{ jobDetail.genderRemark || "" }}
|
|
|
</span>
|
|
|
</a-descriptions-item>
|
|
|
<!-- <a-descriptions-item>
|
|
|
<span slot="label" class>文化要求</span>
|
|
|
<span>{{ jobDetail.education || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<a-descriptions-item>
|
|
|
<span slot="label" class>体检</span>
|
|
|
<span>{{ jobDetail.healthRequire || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
|
|
|
<a-descriptions-item>
|
|
|
<span slot="label" class>证件</span>
|
|
|
<span>{{ jobDetail.idCardStr || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
|
|
|
<a-descriptions-item>
|
|
|
<span slot="label" class>疑难杂症</span>
|
|
|
<span>{{ jobDetail.otherRequireStr || "-" }}</span>
|
|
|
</a-descriptions-item> -->
|
|
|
</a-descriptions>
|
|
|
</div>
|
|
|
<!-- 基本信息 -->
|
|
|
<div class id="contentspecial">
|
|
|
<div class="mb12 mt20">岗位说明</div>
|
|
|
<a-descriptions bordered size="small" :column="1" class="leftDesc">
|
|
|
<!-- <a-descriptions-item class="test1">
|
|
|
<span slot="label" class>工作内容</span>
|
|
|
<span>{{ jobDetail.workContent || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
|
|
|
<a-descriptions-item class="test1">
|
|
|
<span slot="label" class>工作方式</span>
|
|
|
<span>{{ jobDetail.workMode || "-" }}</span>
|
|
|
</a-descriptions-item> -->
|
|
|
|
|
|
<a-descriptions-item>
|
|
|
<span slot="label" class>班次工时</span>
|
|
|
<span>{{ jobDetail.workClasses || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<!-- <a-descriptions-item>
|
|
|
<span slot="label" class>工作衣</span>
|
|
|
<span>{{ jobDetail.workClothes || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<a-descriptions-item>
|
|
|
<span slot="label" class>车间</span>
|
|
|
<span>{{ jobDetail.securityCheck || "-" }}</span>
|
|
|
</a-descriptions-item> -->
|
|
|
</a-descriptions>
|
|
|
</div>
|
|
|
|
|
|
<!-- <div class="condition" id="condition">
|
|
|
<div class="mb12 mt20">吃饭住宿</div>
|
|
|
<ul class="conditiontable">
|
|
|
<li>
|
|
|
<span>吃饭</span>
|
|
|
<span>{{ jobDetail.workingLunch || "-" }}</span>
|
|
|
</li>
|
|
|
<li>
|
|
|
<span>住宿费用</span>
|
|
|
<span>{{ jobDetail.dormitory || "-" }}</span>
|
|
|
</li>
|
|
|
<li>
|
|
|
<span>宿舍设施</span>
|
|
|
<span>{{ jobDetail.dormitoryFacilities || "-" }}</span>
|
|
|
</li>
|
|
|
<li>
|
|
|
<span>宿舍距离</span>
|
|
|
<span>{{ jobDetail.dormDistance || "-" }}</span>
|
|
|
</li>
|
|
|
<li>
|
|
|
<span>入住条件</span>
|
|
|
<span>{{ jobDetail.dormitoryDesp || "-" }}</span>
|
|
|
</li>
|
|
|
</ul>
|
|
|
</div> -->
|
|
|
<div class="required" id="abutment">
|
|
|
<div class="mb12 mt20">对接信息</div>
|
|
|
<a-descriptions bordered size="small" :column="1" class="leftDesc">
|
|
|
<!-- <a-descriptions-item class="test1">
|
|
|
<span slot="label" class>面试时间</span>
|
|
|
<span>{{ jobDetail.interviewDuration || "-" }}</span>
|
|
|
</a-descriptions-item> -->
|
|
|
<a-descriptions-item class="test1">
|
|
|
<span slot="label" class>面试地点</span>
|
|
|
<span>{{ jobDetail.interviewAddr || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<a-descriptions-item class="test1">
|
|
|
<span slot="label" class>面试说明</span>
|
|
|
<span>{{ jobDetail.interviewDesp || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<!--<a-descriptions-item class="test1">
|
|
|
<span slot="label" class>入职说明</span>
|
|
|
<span>{{ jobDetail.entryDesp || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<a-descriptions-item class="test1">
|
|
|
<span slot="label" class>离职说明</span>
|
|
|
<span>{{ jobDetail.leaveRequire || "-" }}</span>
|
|
|
</a-descriptions-item> -->
|
|
|
</a-descriptions>
|
|
|
<!-- <a-descriptions bordered size="small" :column="1" class="leftDesc" v-else>
|
|
|
<a-descriptions-item class="test1">
|
|
|
<span slot="label" class>驻场信息</span>
|
|
|
<span>{{ onSiteUsersInfo || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<a-descriptions-item class="test1">
|
|
|
<span slot="label" class>面试地址</span>
|
|
|
<span>{{ jobDetail.interviewAddr || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<a-descriptions-item class="test1">
|
|
|
<span slot="label" class>其他说明</span>
|
|
|
<span>{{ jobDetail.otherInfo || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
</a-descriptions> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- <a-anchor @click.prevent class="navigation">
|
|
|
<a-anchor-link href="#tip" title="注意" />
|
|
|
<a-anchor-link href="#pay" title="薪资" />
|
|
|
<a-anchor-link href="#required" title="要求" />
|
|
|
<a-anchor-link href="#contentspecial" title="岗位" />
|
|
|
<a-anchor-link href="#condition" title="吃住" />
|
|
|
<a-anchor-link href="#abutment" title="对接" />
|
|
|
</a-anchor> -->
|
|
|
</div>
|
|
|
|
|
|
<!-- 财务结算 -->
|
|
|
<div v-if="tabchange == 0">
|
|
|
<a-descriptions bordered size="small" :column="1" class="leftDesc mt20" style="width: 900px">
|
|
|
<a-descriptions-item class="test1">
|
|
|
<span slot="label" class>服务费</span>
|
|
|
<span>{{ jobDetail.servetype }}</span>
|
|
|
</a-descriptions-item>
|
|
|
<a-descriptions-item class="test1">
|
|
|
<span slot="label" class>服务费详情</span>
|
|
|
<span>{{ jobDetail.returnFeeDesp || "-" }}</span>
|
|
|
</a-descriptions-item>
|
|
|
</a-descriptions>
|
|
|
</div>
|
|
|
<div v-if="tabchange == 2">
|
|
|
<div class="pay" id="tip">
|
|
|
<div class="mb12 mt20 titlestyle">职位通告</div>
|
|
|
<div class="showInfo" style="width: unset; color: #000 !important">
|
|
|
<div class="copy" @click="copyText($event)">复制</div>
|
|
|
<div class="copyInfo" style="border: none; padding: 0 0; width: unset; white-space: pre-line">{{ jobDetail.jobInfo.split("————————")[0] || "-" }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="maincontentright">
|
|
|
<div class="card-top g_flex_row_between" style="padding-left: 16px; padding-right: 16px; font-size: 14px; background-color: #1890ff; height: 40px; border-top-left-radius: 6px; border-top-right-radius: 6px">
|
|
|
<div class="g_flex_column_center">
|
|
|
<i style="color: #fff; font-weight: 600;font-size: 16px;">代理佣金</i>
|
|
|
</div>
|
|
|
<div class="g_flex_column_center" @click="isSee = !isSee" style="cursor: pointer">
|
|
|
<i class="iconfont icon-zhengyan11" style="font-size: 22px; color: #fff; line-height: 0.1" v-if="isSee"></i>
|
|
|
<i class="iconfont icon-biyan11" style="font-size: 22px; color: #fff; line-height: 0.1; margin-top: -4px" v-if="!isSee"></i>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="card-bottom" style="background-color: #fff; border-bottom-right-radius: 6px; border-bottom-left-radius: 6px; padding: 16px">
|
|
|
<div class="box" style="border-radius: 6px; border: 1px solid #ededed; min-height: 288px">
|
|
|
<div class="title g_flex_row_start" style="height: 40px; border-bottom: 1px solid #ededed; padding: 0 16px">
|
|
|
<div style="font-size: 14px; height: 100%; font-weight: 600" class="g_flex_column_center">佣金：</div>
|
|
|
<div class="g_flex_column_center" style="font-size: 14px; height: 100%; color: #333">
|
|
|
<span v-if="isSee">
|
|
|
{{ jobDetail.servetype }}
|
|
|
</span>
|
|
|
<span v-if="!isSee"> *** </span>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="content g_p_16">
|
|
|
<div class="con" style="white-space: pre-wrap; font-size: 14px; color: #333">
|
|
|
<span v-if="isSee">
|
|
|
{{ jobDetail.returnFeeDesp || "-" }}
|
|
|
</span>
|
|
|
<span v-if="!isSee"> *** </span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<recordModal :show.sync="recordShow" :jobDetail="jobDetail"></recordModal>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import { getJobDetailApi } from "../../api/job";
|
|
|
import { disposeJobListData, getSalaryClassifyValue, setJobInfoPosition } from "../../utils/commonUtil";
|
|
|
import mserve from "../../components/FirstJob/components/servre.vue";
|
|
|
import { nationlist } from "../../utils/datalist";
|
|
|
import { getUserManagerApi } from "../../api/userinfo";
|
|
|
import "swiper/dist/css/swiper.css";
|
|
|
import Vue from "vue";
|
|
|
import Viewer from "v-viewer";
|
|
|
import "viewerjs/dist/viewer.css";
|
|
|
import swiper from "swiper";
|
|
|
import GDMap from "../map.vue";
|
|
|
// import recordbill from "@/components/FirstJob/components/recordbill.vue";
|
|
|
import Clipboard from "clipboard";
|
|
|
// 报名弹窗
|
|
|
import recordModal from "./components/vocationalRecord.vue";
|
|
|
|
|
|
// import map from '../map.vue'
|
|
|
Vue.use(Viewer, {
|
|
|
defaultOptions: {
|
|
|
// 需要配置的属性
|
|
|
toolbar: {
|
|
|
zoomIn: true,
|
|
|
zoomOut: true,
|
|
|
oneToOne: false,
|
|
|
reset: false,
|
|
|
prev: true,
|
|
|
play: {
|
|
|
show: true,
|
|
|
size: "large",
|
|
|
},
|
|
|
next: true,
|
|
|
rotateLeft: true,
|
|
|
rotateRight: true,
|
|
|
flipHorizontal: false,
|
|
|
flipVertical: false,
|
|
|
},
|
|
|
title: false,
|
|
|
navbar: false,
|
|
|
initialViewIndex: 1,
|
|
|
isMeetting: false,
|
|
|
},
|
|
|
});
|
|
|
export default {
|
|
|
// 组件名称
|
|
|
name: "",
|
|
|
// 局部注册的组件
|
|
|
components: {
|
|
|
mserve,
|
|
|
GDMap,
|
|
|
recordModal,
|
|
|
// GDMap
|
|
|
// recordbill,
|
|
|
},
|
|
|
// 组件参数 接收来自父组件的数据
|
|
|
props: {},
|
|
|
// 组件状态值
|
|
|
data() {
|
|
|
return {
|
|
|
tabActive:1,
|
|
|
tabList:[
|
|
|
{
|
|
|
title: "基本信息",
|
|
|
key: 1,
|
|
|
},
|
|
|
// {
|
|
|
// title: "财务结算",
|
|
|
// key: 0,
|
|
|
// },
|
|
|
{
|
|
|
title: "职位描述",
|
|
|
key: 2,
|
|
|
},
|
|
|
// }
|
|
|
],
|
|
|
isSee: true,
|
|
|
agency: {},
|
|
|
onSiteUsersInfo: "",
|
|
|
customServiceUsers: [],
|
|
|
previewVisible: false,
|
|
|
previewImage: "",
|
|
|
relationList: [],
|
|
|
jobDetail: {}, // 职位相关信息
|
|
|
storeImage: [],
|
|
|
storeInfo: {},
|
|
|
id: "",
|
|
|
jobClassify: "",
|
|
|
currentPageNum: this.$route.query.page || "",
|
|
|
visible: false, // 录单模态框的展示
|
|
|
xiangdanVisible: false, // 详单的弹出
|
|
|
confirmLoading: false, // 录单提交的loading效果
|
|
|
positionInfo: {}, // 企业位置信息
|
|
|
jobPoses: {}, // 职位位置信息
|
|
|
store: {}, // 职位详情信息
|
|
|
skeletonshow: true,
|
|
|
tabchange: 1,
|
|
|
nationlist,
|
|
|
imgList: [], // 预览图片列表
|
|
|
labelColor: ["pink", "blue", "purple", "orange", "green", "cyan", "red", "purple"],
|
|
|
form: {
|
|
|
// 录单数据
|
|
|
name: "",
|
|
|
peoplecard: "",
|
|
|
gender: "",
|
|
|
nation: "",
|
|
|
location: "",
|
|
|
firm: "",
|
|
|
post: "",
|
|
|
pattern: "",
|
|
|
policy: "",
|
|
|
proxy: "",
|
|
|
facedate: "",
|
|
|
},
|
|
|
storeJob: {},
|
|
|
// rules: {
|
|
|
// // 录单校验规则
|
|
|
// name: [{ required: true, message: "请输入姓名", trigger: "submit" }],
|
|
|
// // tel: [{ required: true, message: "请输入手机号", trigger: "submit" }],
|
|
|
// },
|
|
|
apply: {},
|
|
|
myswiper: null, // 存储swiper实例
|
|
|
managerInfo: {},
|
|
|
customServiceUrl: "", // 客服信息
|
|
|
from: null, // 来源
|
|
|
recordShow: false,
|
|
|
zhijiaoList: [
|
|
|
// 职教列表
|
|
|
{
|
|
|
id: 0,
|
|
|
vocationalName: "电气工程师（初级班）",
|
|
|
logo: "https://matripe-cms.oss-cn-beijing.aliyuncs.com/zhijiao/job1.png",
|
|
|
tuition: "6800元",
|
|
|
serviceCharge: "2000元/人",
|
|
|
salary: "7000-9000元/月",
|
|
|
enterprise: "",
|
|
|
semester: "30天",
|
|
|
totalProfit: "2500元/人+就业分成",
|
|
|
address: "河南省郑州市航空港区如荼路重英街交叉口南侧100米路东",
|
|
|
desp: `一、就业前景：
|
|
|
1. 学习合格后，公司统一推荐到相关企业的设备安装、调试、运营维护等相关岗位。
|
|
|
2. 薪酬待遇：电气工程师（初级）实习期6000-8000元/月，实习期过后，7000-9000元/月。
|
|
|
|
|
|
二、关于学校
|
|
|
优星图教育科技是集智能制造设备的研发生产、智能工厂设计与升级改造、自动化技能人才培养培训为一体的智能制造整体解决方案供应商。双师型教师团队，先进的自动化教学设备，理论结合实操，让你用最短的时间学会最有用的技术，从而实现高质量就业！
|
|
|
|
|
|
三、课程介绍
|
|
|
本培养体系通过70%实操+30%理论相结合的模式掌握自动化技术，每个模块均有考核，考核通过即可推荐工作，未通过即针对性辅导，完成技术掌握。课程体系持续升级，教学内容以就业为导向，紧贴企业需求。
|
|
|
|
|
|
四、课程内容：
|
|
|
1. 电工基础课程
|
|
|
2. 气动基础课程
|
|
|
3. 传感器课程
|
|
|
4. 西门子200SMART PLC课程
|
|
|
5. ABB机器人课程
|
|
|
|
|
|
五、学习时间：
|
|
|
周一到周六
|
|
|
夏季：上午 8:30-11:30，下午 14:00-18:00，晚上 19:00-21:00 （晚自习）
|
|
|
冬季：上午 8:30-11:30，下午 13:30-17:30，晚上 18:30-20:30 （晚自习）
|
|
|
周日休息期间教室全天开放，可随时实操。
|
|
|
|
|
|
六、招生对象
|
|
|
基本要求：初中及以上学历，年龄18-35周岁；思想端正；心理和身体健康，无危害团体的传染性疾病；热爱自动化行业；服从公司安排，适应出差。
|
|
|
1. 工厂中想通过学习一门技术改变自己的一线操作工；
|
|
|
2. 从事自动化设备机构装配人员电控知识的扩展；
|
|
|
3. 想从事自动化行业的自动化相关专业毕业生，在步入岗位前的充电学习。
|
|
|
|
|
|
七、吃饭住宿
|
|
|
1. 吃饭自理，住宿4-8人间，收费12-18元/天/人。预约报名缴纳300元定金送开学大礼包（被褥四件套+生活用品大礼包），独立卫生间、空调、热水器，免费洗衣机、饮水机24小时提供。
|
|
|
2. 住宿期间水电费全免！
|
|
|
|
|
|
八、服务流程
|
|
|
报名成功----到校考察----面试合格----缴纳费用----签订协议----安排入学----学习合格----推荐就业。
|
|
|
|
|
|
九、学员需提前准备的环节
|
|
|
1. 换洗衣服、常用物品即可
|
|
|
|
|
|
十、学习地址
|
|
|
河南省郑州市航空港区如荼路重英街交叉口南侧100米路东`,
|
|
|
},
|
|
|
{
|
|
|
id: 1,
|
|
|
vocationalName: "调试工程师（中级班）",
|
|
|
logo: "https://matripe-cms.oss-cn-beijing.aliyuncs.com/zhijiao/job2.png",
|
|
|
tuition: "11800元",
|
|
|
serviceCharge: "3000元/人",
|
|
|
salary: "8000-11000元/月",
|
|
|
enterprise: "",
|
|
|
semester: "60天",
|
|
|
totalProfit: "4000元/人+就业分成",
|
|
|
address: "河南省郑州市航空港区如荼路重英街交叉口南侧100米路东",
|
|
|
desp: `一、就业前景：
|
|
|
1. 学习合格后，公司统一推荐到相关企业的设备安装、调试、运营维护等相关岗位。
|
|
|
2. 薪酬待遇：调试工程师（中级）实习期7000-9000元/月，实习期过后，8000-11000元/月。
|
|
|
|
|
|
二、关于学校
|
|
|
优星图教育科技是集智能制造设备的研发生产、智能工厂设计与升级改造、自动化技能人才培养培训为一体的智能制造整体解决方案供应商。双师型教师团队，先进的自动化教学设备，理论结合实操，让你用最短的时间学会最有用的技术，从而实现高质量就业！
|
|
|
|
|
|
三、课程介绍
|
|
|
本培养体系通过70%实操+30%理论相结合的模式掌握自动化技术，每个模块均有考核，考核通过即可推荐工作，未通过即针对性辅导，完成技术掌握。课程体系持续升级，教学内容以就业为导向，紧贴企业需求。
|
|
|
|
|
|
四、课程内容：
|
|
|
1. PLC编程基础知识
|
|
|
2. 编程基本指令学习
|
|
|
3. 威纶通触摸屏
|
|
|
4. 运动控制课程
|
|
|
5. 模拟量应用课程
|
|
|
6. 通信课程/绘图课程
|
|
|
7. 非标设备实操课程
|
|
|
|
|
|
五、学习时间：
|
|
|
周一到周六
|
|
|
夏季：上午 8:30-11:30，下午 14:00-18:00，晚上 19:00-21:00 （晚自习）
|
|
|
冬季：上午 8:30-11:30，下午 13:30-17:30，晚上 18:30-20:30 （晚自习）
|
|
|
周日休息期间教室全天开放，可随时实操。
|
|
|
|
|
|
六、招生对象
|
|
|
基本要求：初中及以上学历，年龄18-35周岁；思想端正；心理和身体健康，无危害团体的传染性疾病；热爱自动化行业；服从公司安排，适应出差。
|
|
|
1. 工厂中想通过学习一门技术改变自己的一线操作工；
|
|
|
2. 从事自动化设备机构装配人员电控知识的扩展；
|
|
|
3. 想从事自动化行业的自动化相关专业毕业生，在步入岗位前的充电学习。
|
|
|
|
|
|
七、吃饭住宿
|
|
|
1. 吃饭自理，住宿4-8人间，收费12-18元/天/人。预约报名缴纳300元定金送开学大礼包（被褥四件套+生活用品大礼包），独立卫生间、空调、热水器，免费洗衣机、饮水机24小时提供。
|
|
|
2. 住宿期间水电费全免！
|
|
|
|
|
|
八、服务流程
|
|
|
报名成功----到校考察----面试合格----缴纳费用----签订协议----安排入学----学习合格----推荐就业。
|
|
|
|
|
|
九、学员需提前准备的环节
|
|
|
1. 换洗衣服、常用物品即可
|
|
|
|
|
|
十、学习地址
|
|
|
河南省郑州市航空港区如荼路重英街交叉口南侧100米路东`,
|
|
|
},
|
|
|
{
|
|
|
id: 2,
|
|
|
vocationalName: "运营管理团队（高级班）",
|
|
|
logo: "https://matripe-cms.oss-cn-beijing.aliyuncs.com/zhijiao/job3.png",
|
|
|
tuition: "19800元",
|
|
|
serviceCharge: "6500元/人",
|
|
|
salary: "9000-11000元/月",
|
|
|
enterprise: "",
|
|
|
semester: "90天",
|
|
|
totalProfit: "8000元/人",
|
|
|
address: "河南省郑州市航空港区如荼路重英街交叉口南侧100米路东",
|
|
|
desp: `一、就业前景：
|
|
|
1. 学习合格后，公司统一推荐到相关企业的设备安装、调试、运营维护等相关岗位。
|
|
|
2. 薪酬待遇：运营/教师精英班（高级）实习期（三个月）8000-9000元/月，实习期过后9000-11000元/月，运营管理类学员孵化创业年综合收入20w。
|
|
|
|
|
|
二、关于学校
|
|
|
优星图教育科技是集智能制造设备的研发生产、智能工厂设计与升级改造、自动化技能人才培养培训为一体的智能制造整体解决方案供应商。双师型教师团队，先进的自动化教学设备，理论结合实操，让你用最短的时间学会最有用的技术，从而实现高质量就业！
|
|
|
|
|
|
三、课程介绍
|
|
|
本培养体系通过70%实操+30%理论相结合的模式掌握自动化技术，每个模块均有考核，考核通过即可推荐工作，未通过即针对性辅导，完成技术掌握。课程体系持续升级，教学内容以就业为导向，紧贴企业需求。
|
|
|
|
|
|
四、课程内容：
|
|
|
1. 自动化专业技能培训 5周
|
|
|
2. 自动化教学技法培训 5周
|
|
|
3. 线上新媒体应用培训 1周
|
|
|
4. 综合素养培训 1周
|
|
|
|
|
|
五、学习时间：
|
|
|
周一到周六
|
|
|
夏季：上午 8:30-11:30，下午 14:00-18:00，晚上 19:00-21:00 （晚自习）
|
|
|
冬季：上午 8:30-11:30，下午 13:30-17:30，晚上 18:30-20:30 （晚自习）
|
|
|
周日休息期间教室全天开放，可随时实操。
|
|
|
|
|
|
六、招生对象
|
|
|
基本要求：初中及以上学历，年龄18-35周岁；思想端正；心理和身体健康，无危害团体的传染性疾病；热爱自动化行业；服从公司安排，适应出差。
|
|
|
1. 工厂中想通过学习一门技术改变自己的一线操作工；
|
|
|
2. 从事自动化设备机构装配人员电控知识的扩展；
|
|
|
3. 想从事自动化行业的自动化相关专业毕业生，在步入岗位前的充电学习。
|
|
|
|
|
|
七、吃饭住宿
|
|
|
1. 吃饭自理，住宿4-8人间，收费12-18元/天/人。预约报名缴纳300元定金送开学大礼包（被褥四件套+生活用品大礼包），独立卫生间、空调、热水器，免费洗衣机、饮水机24小时提供。
|
|
|
2. 住宿期间水电费全免！
|
|
|
|
|
|
八、服务流程
|
|
|
报名成功----到校考察----面试合格----缴纳费用----签订协议----安排入学----学习合格----推荐就业。
|
|
|
|
|
|
九、学员需提前准备的环节
|
|
|
1. 换洗衣服、常用物品即可
|
|
|
|
|
|
十、学习地址
|
|
|
河南省郑州市航空港区如荼路重英街交叉口南侧100米路东`,
|
|
|
},
|
|
|
],
|
|
|
};
|
|
|
},
|
|
|
// 计算属性
|
|
|
computed: {},
|
|
|
// 侦听器
|
|
|
watch: {},
|
|
|
// 生命周期钩子 注：没用到的钩子请自行删除
|
|
|
/**
|
|
|
* 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
|
|
|
*/
|
|
|
|
|
|
beforeCreate() {},
|
|
|
created() {
|
|
|
// console.log(this.$router.matcher.match());
|
|
|
if (sessionStorage.getItem("PAGE_TYPE")) {
|
|
|
this.id = JSON.parse(sessionStorage.getItem("PAGE_TYPE")).id;
|
|
|
|
|
|
this.jobClassify = JSON.parse(sessionStorage.getItem("PAGE_TYPE")).jobClassify;
|
|
|
this.currentPageNum = JSON.parse(sessionStorage.getItem("PAGE_TYPE")).pageNum;
|
|
|
|
|
|
console.log("PAGE_TYPE", JSON.parse(sessionStorage.getItem("PAGE_TYPE")));
|
|
|
}
|
|
|
if (this.$route.query.jobClassify) {
|
|
|
this.jobClassify = this.$route.query.jobClassify;
|
|
|
}
|
|
|
if (this.$route.query.id) {
|
|
|
this.id = this.$route.query.id;
|
|
|
}
|
|
|
console.log("this.id ", this.id);
|
|
|
console.log("this.$route", this.$route); // 获取传过来的params数据
|
|
|
if (this.$route.query.type) {
|
|
|
this.from = this.$route.query.type;
|
|
|
this.jobDetail = this.zhijiaoList.find((item) => item.id == this.$route.query.id);
|
|
|
this.skeletonshow = false;
|
|
|
console.log(this.jobDetail);
|
|
|
} else {
|
|
|
this.getJobDetail();
|
|
|
}
|
|
|
this.getUserManager();
|
|
|
// Object.defineProperties("window.opener", "sessionStorage", {
|
|
|
// LOGIN_DATA: {},
|
|
|
// });
|
|
|
// console.log(window.opener);
|
|
|
},
|
|
|
/**
|
|
|
* el 被新创建的 vm.el 替换，并挂载到实例上去之后调用该钩子。
|
|
|
* 如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.el 也在文档内。
|
|
|
*/
|
|
|
mounted() {
|
|
|
let that = this;
|
|
|
// console.log(this.$refs.scrollimg);
|
|
|
// this.$refs.scrollimg.goTo(0, false);
|
|
|
setTimeout(() => {
|
|
|
this.myswiper = new swiper("#swiper", {
|
|
|
// loop: true,
|
|
|
// loopAdditionalSlides: 3,
|
|
|
// speed: 500,
|
|
|
// keyboard: true,
|
|
|
// allowTouchMove: false,
|
|
|
// slidesPerView: 1,
|
|
|
slidesPerView: 4,
|
|
|
slidesPerGroup: 1,
|
|
|
// loop: true,
|
|
|
// loopFillGroupWithBlank: true,
|
|
|
// pagination: {
|
|
|
// el: ".swiper-pagination",
|
|
|
// clickable: true,
|
|
|
// },
|
|
|
navigation: {
|
|
|
nextEl: ".swiper-button-next",
|
|
|
prevEl: ".swiper-button-prev",
|
|
|
disabledClass: "swiper-button-disabled",
|
|
|
},
|
|
|
// spaceBetween: 100,
|
|
|
// effect: 'fade',
|
|
|
// fadeEffect: {
|
|
|
// crossFade: true,
|
|
|
// },
|
|
|
// autoplay: {
|
|
|
// delay: 8000,
|
|
|
// stopOnLastSlide: false,
|
|
|
// disableOnInteraction: false,
|
|
|
// },
|
|
|
on: {
|
|
|
// slideChangeTransitionEnd() {
|
|
|
// that.progressPercent = 0
|
|
|
// },
|
|
|
},
|
|
|
});
|
|
|
}, 1000);
|
|
|
},
|
|
|
// 组件方法
|
|
|
methods: {
|
|
|
noCustom() {
|
|
|
this.$message.error("此职位暂未接入客服");
|
|
|
},
|
|
|
async getJobDetail() {
|
|
|
console.log("this.id", this.id);
|
|
|
try {
|
|
|
const { data } = await getJobDetailApi(this.id, this.jobClassify);
|
|
|
console.log("data", data);
|
|
|
if (data.status === 200) {
|
|
|
console.log(data);
|
|
|
this.jobDetail = disposeJobListData(data.data.record);
|
|
|
this.jobDetail = {
|
|
|
...this.jobDetail,
|
|
|
...data.data,
|
|
|
};
|
|
|
this.jobDetail.jobDesp = data.data.record.jobDesp.replaceAll("*****", "");
|
|
|
this.customServiceUrl = data.data.customServiceUrl;
|
|
|
this.jobPoses = data.data.jobPoses;
|
|
|
this.agency = data.data.record.supplier;
|
|
|
this.customServiceUsers = data.data.customServiceUsers;
|
|
|
|
|
|
if (this.jobClassify == 1) {
|
|
|
this.positionInfo = data.data.store;
|
|
|
this.store = data.data.store;
|
|
|
this.positionInfo.desc = this.positionInfo.detailPosition;
|
|
|
this.positionInfo.containerName = "mapContainer";
|
|
|
this.positionInfo.name = this.positionInfo.aliasName;
|
|
|
this.jobDetail.district = setJobInfoPosition(disposeJobListData(data.data.store).district);
|
|
|
} else {
|
|
|
this.positionInfo = data.data.record;
|
|
|
this.store = data.data.record;
|
|
|
this.positionInfo.desc = this.positionInfo.storeAddr;
|
|
|
this.positionInfo.containerName = "mapContainer";
|
|
|
this.positionInfo.name = this.positionInfo.storeName;
|
|
|
this.positionInfo.lat = this.positionInfo.storeLat;
|
|
|
this.positionInfo.lng = this.positionInfo.storeLng;
|
|
|
this.jobDetail.district = setJobInfoPosition(this.positionInfo.storeDistrict);
|
|
|
console.log("this.jobDetail", this.jobDetail);
|
|
|
}
|
|
|
if (data.data.onSiteUsers) {
|
|
|
this.onSiteUsersInfo = data.data.onSiteUsers.map((item) => `${item.aliasName} ${item.tel}`).join(", ");
|
|
|
}
|
|
|
|
|
|
// console.log(this.jobDetail.jobRequestLabelNames)
|
|
|
// if(this.jobDetail.jobRequestLabelNames){
|
|
|
// this.jobDetail.jobRequestLabelNames = this.jobDetail.jobRequestLabelNames.split(',')
|
|
|
// }
|
|
|
|
|
|
// if(this.jobDetail.jobSpecialLabelNames){
|
|
|
// this.jobDetail.jobSpecialLabelNames = this.jobDetail.jobSpecialLabelNames.split(',')
|
|
|
// }
|
|
|
|
|
|
this.skeletonshow = false;
|
|
|
console.log(this.jobDetail);
|
|
|
console.log(this.jobPoses);
|
|
|
let newdata = {
|
|
|
id: data.data.record.id,
|
|
|
// aliasName: data.data.store.aliasName,
|
|
|
jobName: data.data.record.jobName,
|
|
|
};
|
|
|
this.storeInfo = newdata;
|
|
|
let regs = /\.(jpg|jpeg|png)(\?.*)?$/;
|
|
|
// data.data.storeImage.forEach((item) => {
|
|
|
// if (regs.test(item.url.toLowerCase())) {
|
|
|
// this.storeImage.push(item.url)
|
|
|
// }
|
|
|
// })
|
|
|
// console.log(this.storeImage);
|
|
|
let storeImage = [];
|
|
|
let storeVideo = [];
|
|
|
if (data.data.storeImage) {
|
|
|
data.data.storeImage.forEach((item) => {
|
|
|
console.log(item.url);
|
|
|
|
|
|
if (regs.test(item.url.toLowerCase())) {
|
|
|
storeImage.push(item.url);
|
|
|
} else {
|
|
|
storeVideo.push(item.url);
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
if (data.data.images) {
|
|
|
data.data.images.forEach((item) => {
|
|
|
console.log(item.url);
|
|
|
|
|
|
if (regs.test(item.url.toLowerCase())) {
|
|
|
storeImage.push(item.url);
|
|
|
} else {
|
|
|
storeVideo.push(item.url);
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
this.jobDetail.up_time = this.timeShowXXX2(this.jobDetail.updateTime);
|
|
|
this.storeImage = [...storeImage, ...storeVideo];
|
|
|
console.log("this.storeImage", this.storeImage);
|
|
|
} else {
|
|
|
this.$message.warning("数据获取失败");
|
|
|
}
|
|
|
|
|
|
// = data.data.recordList;
|
|
|
// console.log(data);
|
|
|
// console.log(this.jobDetail);
|
|
|
} catch (error) {
|
|
|
console.log(error);
|
|
|
}
|
|
|
},
|
|
|
timeShowXXX2(val) {
|
|
|
const now = Date.now();
|
|
|
const diff = now - val;
|
|
|
|
|
|
const seconds = Math.floor(diff / 1000);
|
|
|
const minutes = Math.floor(seconds / 60);
|
|
|
const hours = Math.floor(minutes / 60);
|
|
|
const days = Math.floor(hours / 24);
|
|
|
|
|
|
if (days < 2) {
|
|
|
if (hours > 0) {
|
|
|
return `${hours}小时前`;
|
|
|
} else if (minutes > 0) {
|
|
|
return `${minutes}分钟前`;
|
|
|
} else {
|
|
|
return `${seconds}秒前`;
|
|
|
}
|
|
|
} else {
|
|
|
return `${days}天前`;
|
|
|
}
|
|
|
},
|
|
|
/**
|
|
|
* 获取登录人对应的客户经理信息
|
|
|
*/
|
|
|
getUserManager() {
|
|
|
getUserManagerApi().then(({ data }) => {
|
|
|
console.log(data);
|
|
|
// this.$store.commit('setManagerInfo', data.data)
|
|
|
this.managerInfo = data.data;
|
|
|
// console.log('+++++++++++++++++++++++++', this.$store)
|
|
|
});
|
|
|
},
|
|
|
/**
|
|
|
* 职教职培报名点击
|
|
|
*/
|
|
|
showRecord(info) {
|
|
|
console.log(info);
|
|
|
this.currentInfo = info;
|
|
|
this.recordShow = true;
|
|
|
// window.open(`https://jinshuju.net/f/ohFOxo?x_field_1=${this.jobDetail.vocationalName}&background=white&banner=show&embedded=true&inner_redirect=false`);
|
|
|
},
|
|
|
// 录单弹出层的关闭
|
|
|
handleCancel() {
|
|
|
this.visible = false;
|
|
|
this.previewVisible = false;
|
|
|
let movie = document.querySelector("#movie");
|
|
|
console.dir(movie);
|
|
|
movie.pause();
|
|
|
// this.form = {
|
|
|
// // 录单数据
|
|
|
// name: '',
|
|
|
// tel: '',
|
|
|
// peoplecard: '',
|
|
|
// username: '',
|
|
|
// }
|
|
|
},
|
|
|
// 录单提交按钮的回调
|
|
|
handleOk() {
|
|
|
this.$refs.ruleForm.validate((ispass, no) => {
|
|
|
// console.log(ispass);
|
|
|
if (ispass) {
|
|
|
this.confirmLoading = true;
|
|
|
|
|
|
setTimeout(() => {
|
|
|
this.confirmLoading = false;
|
|
|
this.visible = false;
|
|
|
}, 2000);
|
|
|
} else {
|
|
|
// console.log(123);
|
|
|
}
|
|
|
console.log(no);
|
|
|
});
|
|
|
},
|
|
|
// 弹出录单模态框
|
|
|
// showmodal() {
|
|
|
// this.visible = true;
|
|
|
// console.log(this.id);
|
|
|
// },
|
|
|
showmodal() {
|
|
|
this.visible = true;
|
|
|
// this.apply = item;
|
|
|
// console.log(this.apply);
|
|
|
// console.log(id);
|
|
|
},
|
|
|
onClose() {
|
|
|
this.visible = false;
|
|
|
this.form = {
|
|
|
// 录单数据
|
|
|
name: "",
|
|
|
peoplecard: "",
|
|
|
gender: "", // 性别
|
|
|
nation: "", // 民族
|
|
|
location: "", // 家庭住址
|
|
|
firm: "", // 公司名
|
|
|
post: "", // 岗位
|
|
|
pattern: "", // 模式
|
|
|
policy: "", // 代理政策
|
|
|
proxy: "", // 代理
|
|
|
facedate: "", // 面试时间
|
|
|
};
|
|
|
},
|
|
|
torecord(item) {
|
|
|
// 跳转到路由新页面的方法
|
|
|
console.log(item);
|
|
|
// let userinfo = JSON.stringify(item);
|
|
|
console.log(this.jobDetail);
|
|
|
console.log(this.storeInfo);
|
|
|
this.storeInfo.currentPageNum = this.currentPageNum;
|
|
|
console.log(this.storeInfo);
|
|
|
this.$router.push({ name: "recordbill", params: this.storeInfo });
|
|
|
sessionStorage.setItem("CURRENT_FIRM", JSON.stringify(this.storeInfo));
|
|
|
},
|
|
|
getSalaryClassifyValue(salaryClassify, salaryClassifyValue) {
|
|
|
return getSalaryClassifyValue(salaryClassify, salaryClassifyValue);
|
|
|
},
|
|
|
/**
|
|
|
* 图片预览点击
|
|
|
*
|
|
|
*
|
|
|
*/
|
|
|
showImage(idx, type) {
|
|
|
var that = this;
|
|
|
console.log(that.storeImage);
|
|
|
that.storeImage.forEach((item, index) => {
|
|
|
if (that.isImg(item)) {
|
|
|
that.imgList.push(item);
|
|
|
}
|
|
|
});
|
|
|
if (type == "logo") {
|
|
|
that.imgList.unshift(that.jobDetail.logo || that.jobDetail.store.logo);
|
|
|
}
|
|
|
|
|
|
this.$viewerApi({
|
|
|
options: { initialViewIndex: idx },
|
|
|
images: this.imgList,
|
|
|
});
|
|
|
|
|
|
// }
|
|
|
},
|
|
|
isImg(str) {
|
|
|
console.log(str);
|
|
|
let regs = /\.(jpg|jpeg|png)(\?.*)?$/;
|
|
|
return regs.test(str);
|
|
|
},
|
|
|
|
|
|
copyText() {
|
|
|
console.log(123);
|
|
|
var clipboard = new Clipboard(".copy", {
|
|
|
// .copy 是点击的触发元素
|
|
|
target: function () {
|
|
|
// 通过target指定要复印的节点
|
|
|
return document.querySelector(".copyInfo"); // .copyInfo 是要复制的目标内容
|
|
|
},
|
|
|
});
|
|
|
clipboard.on("success", (e) => {
|
|
|
// success 是成功的回调 success => error 可以捕获复制失败的异常信息
|
|
|
console.log(e);
|
|
|
this.$message.success("复制成功");
|
|
|
});
|
|
|
},
|
|
|
toList() {
|
|
|
// 跳转到列表页
|
|
|
this.$router.push({
|
|
|
path: "/list",
|
|
|
// query: {
|
|
|
// pagenum: this.currentPageNum || "",
|
|
|
// },
|
|
|
});
|
|
|
},
|
|
|
handlePreview(file) {
|
|
|
this.previewImage = file;
|
|
|
this.previewVisible = true;
|
|
|
},
|
|
|
|
|
|
viewDetail() {
|
|
|
let that = this;
|
|
|
console.log("ces", that.jobDetail.returnFeeDesp);
|
|
|
const h = this.$createElement;
|
|
|
this.$info({
|
|
|
title: that.jobDetail.returnFeeDesp || "-",
|
|
|
onOk() {},
|
|
|
});
|
|
|
},
|
|
|
|
|
|
updateTab($item,$inedx){
|
|
|
this.tabActive = $item.key;
|
|
|
this.tabchange = $item.key;
|
|
|
}
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="less">
|
|
|
.special-dropdown .ant-dropdown-menu-item:hover {
|
|
|
background-color: #fff;
|
|
|
}
|
|
|
.special-dropdown ul > li {
|
|
|
border-bottom: 1px solid #eee;
|
|
|
line-height: 30px;
|
|
|
}
|
|
|
.special-dropdown ul > li:last-child {
|
|
|
border-bottom: 0;
|
|
|
}
|
|
|
|
|
|
.detail-container {
|
|
|
background-color: #f0f0f0;
|
|
|
// overflow: hidden;
|
|
|
// border-top: 1px solid #eeefef;
|
|
|
|
|
|
// background-color: #f6f6f6;
|
|
|
}
|
|
|
/deep/ .ant-form {
|
|
|
// overflow: auto;
|
|
|
margin-bottom: 50px;
|
|
|
}
|
|
|
// 录单模态框样式
|
|
|
/deep/ .ant-drawer-wrapper-body {
|
|
|
// overflow: none;
|
|
|
// position: relative;
|
|
|
&::-webkit-scrollbar {
|
|
|
/*滚动条整体样式*/
|
|
|
width: 0px; /*高宽分别对应横竖滚动条的尺寸*/
|
|
|
height: 4px;
|
|
|
}
|
|
|
|
|
|
.ant-drawer-header {
|
|
|
position: absolute;
|
|
|
width: 100%;
|
|
|
background-color: #fff;
|
|
|
padding: 12px 24px;
|
|
|
z-index: 999;
|
|
|
.ant-drawer-close {
|
|
|
height: 48px;
|
|
|
width: 48px;
|
|
|
line-height: 48px;
|
|
|
}
|
|
|
}
|
|
|
.ant-drawer-body {
|
|
|
overflow-y: auto;
|
|
|
margin-top: 47px;
|
|
|
}
|
|
|
}
|
|
|
// /deep/ .ant-modal {
|
|
|
// top: 30px !important;
|
|
|
// }
|
|
|
// .modal {
|
|
|
// .ant-form-item {
|
|
|
// margin-top: -8px;
|
|
|
// /deep/ .ant-form-item-label {
|
|
|
// line-height: 22px;
|
|
|
// }
|
|
|
// .ant-input {
|
|
|
// // width: 430px;
|
|
|
// height: 40px;
|
|
|
// // border: none;
|
|
|
// border: 1px solid #dddddd;
|
|
|
// box-shadow: none !important;
|
|
|
// // background-color: #f6f6f6;
|
|
|
// }
|
|
|
// }
|
|
|
// /deep/ .ant-modal-footer {
|
|
|
// padding: 10px 24px;
|
|
|
// .ant-btn {
|
|
|
// &:hover {
|
|
|
// color: #1890ff;
|
|
|
// border-color: #1890ff;
|
|
|
// }
|
|
|
// }
|
|
|
// .ant-btn.ant-btn-primary {
|
|
|
// background-color: #1890ff !important;
|
|
|
// border: none;
|
|
|
// line-height: 32px;
|
|
|
// margin-left: 12px;
|
|
|
// color: #fff;
|
|
|
// box-shadow: none;
|
|
|
// &:hover {
|
|
|
// background-color: #ff8025 !important;
|
|
|
// }
|
|
|
// }
|
|
|
// }
|
|
|
// /deep/ .ant-modal-header {
|
|
|
// .ant-modal-title {
|
|
|
// font-size: 20px;
|
|
|
// // font-weight: normal;
|
|
|
// }
|
|
|
// }
|
|
|
// /deep/ .ant-modal-body {
|
|
|
// padding: 24px 24px 8px 24px;
|
|
|
// overflow: auto;
|
|
|
// height: 630px;
|
|
|
// max-height: 630px !important;
|
|
|
// }
|
|
|
// }
|
|
|
/deep/ .maincontent {
|
|
|
// display: flex;
|
|
|
// justify-content: space-between;
|
|
|
margin-top: 12px;
|
|
|
.maincontentleft {
|
|
|
width: 640px;
|
|
|
text-align: left;
|
|
|
background-color: #ffffff;
|
|
|
border-radius: 6px;
|
|
|
// margin: 0 auto;
|
|
|
overflow: hidden;
|
|
|
margin-bottom: 20px;
|
|
|
.subset {
|
|
|
padding: 20px;
|
|
|
padding-bottom: 12px;
|
|
|
// margin-bottom: 16px;
|
|
|
// width: 914px;
|
|
|
background-color: #fff;
|
|
|
// height: 302px;
|
|
|
border-radius: 6px;
|
|
|
// border: 1px solid #ededed;
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
.subsetleft {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
.info {
|
|
|
display: flex;
|
|
|
}
|
|
|
.imgbox {
|
|
|
width: 186px;
|
|
|
height: 186px;
|
|
|
margin-right: 20px;
|
|
|
overflow: hidden;
|
|
|
position: relative;
|
|
|
// .slick-active {
|
|
|
// button {
|
|
|
// background-color: #fe6a00 !important;
|
|
|
// }
|
|
|
// }
|
|
|
// .slick-track {
|
|
|
// transition: all 0s ease 0s !important;
|
|
|
// }
|
|
|
img {
|
|
|
position: absolute;
|
|
|
// width: 100%;
|
|
|
// height: 100%;
|
|
|
height: 100%;
|
|
|
// width: 100%;
|
|
|
top: 50%;
|
|
|
left: 50%;
|
|
|
// left: 0;
|
|
|
// top: 0;
|
|
|
// right: 0;
|
|
|
// bottom: 0;
|
|
|
// margin: auto;
|
|
|
transform: translateX(-50%) translateY(-50%);
|
|
|
}
|
|
|
|
|
|
.ant-carousel {
|
|
|
.slick-slide {
|
|
|
text-align: center;
|
|
|
height: 186px;
|
|
|
// height: 160px;
|
|
|
// line-height: 160px;
|
|
|
// background: #364d79;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
.custom-slick-arrow {
|
|
|
width: 35px;
|
|
|
height: 35px;
|
|
|
font-size: 35px;
|
|
|
margin-top: -20px;
|
|
|
border-radius: 50%;
|
|
|
color: #fff;
|
|
|
background-color: rgba(31, 45, 61, 0.11);
|
|
|
opacity: 0.6;
|
|
|
}
|
|
|
.custom-slick-arrow:before {
|
|
|
// color: #1890ff;
|
|
|
display: none;
|
|
|
}
|
|
|
.custom-slick-arrow:hover {
|
|
|
// background-color: #ff6a00cc;
|
|
|
opacity: 0.8;
|
|
|
}
|
|
|
.slick-slide h3 {
|
|
|
color: #fff;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.jobinfobox {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
width: 600px;
|
|
|
justify-content: space-between;
|
|
|
// .hotTag {
|
|
|
// display: flex;
|
|
|
// line-height: 44px;
|
|
|
// margin-left: 18px;
|
|
|
// div {
|
|
|
// font-size: 14px;
|
|
|
// }
|
|
|
// li {
|
|
|
// margin-right: 12px;
|
|
|
// color: #ff6a00;
|
|
|
// font-size: 14px;
|
|
|
// cursor: pointer;
|
|
|
// }
|
|
|
// > .active {
|
|
|
// text-decoration: underline;
|
|
|
// }
|
|
|
// }
|
|
|
.hotTag {
|
|
|
background-color: #1890ff;
|
|
|
color: #fff;
|
|
|
font-size: 12px;
|
|
|
padding: 2px 4px;
|
|
|
border-radius: 2px;
|
|
|
position: relative;
|
|
|
top: -3px;
|
|
|
i {
|
|
|
margin-right: 4px;
|
|
|
color: #fff;
|
|
|
}
|
|
|
}
|
|
|
.jobname {
|
|
|
// margin: 12px 0;
|
|
|
font-size: 20px;
|
|
|
font-weight: 600;
|
|
|
text-align: left;
|
|
|
color: #333;
|
|
|
line-height: 30px;
|
|
|
height: 26px;
|
|
|
overflow: hidden;
|
|
|
// &:hover {
|
|
|
// color: #1890ff;
|
|
|
// }
|
|
|
}
|
|
|
.jobinfo {
|
|
|
margin-top: 8px;
|
|
|
font-size: 14px;
|
|
|
font-weight: 400;
|
|
|
text-align: left;
|
|
|
color: #999;
|
|
|
line-height: 26px;
|
|
|
height: 19px;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
.jobtag,
|
|
|
.jobtag1 {
|
|
|
margin-top: 12px;
|
|
|
text-align: left;
|
|
|
max-width: 80%;
|
|
|
overflow: hidden;
|
|
|
height: 34px;
|
|
|
// span:first-child {
|
|
|
// color: #1890ff;
|
|
|
// background: rgba(254, 97, 0, 0.1);
|
|
|
// }
|
|
|
span {
|
|
|
margin-right: 8px;
|
|
|
font-size: 14px;
|
|
|
padding: 0px 12px;
|
|
|
border: none;
|
|
|
height: 26px;
|
|
|
line-height: 26px;
|
|
|
// background: rgba(51, 51, 51, 0.06);
|
|
|
border-radius: 4px;
|
|
|
}
|
|
|
}
|
|
|
.jobtag1 {
|
|
|
span {
|
|
|
background-color: #f5f5f5;
|
|
|
color: #666;
|
|
|
}
|
|
|
}
|
|
|
.jobpricemonth {
|
|
|
// margin-top: 16px;
|
|
|
font-size: 14px;
|
|
|
font-weight: bold;
|
|
|
text-align: left;
|
|
|
color: #666;
|
|
|
line-height: 26px;
|
|
|
margin-top: 6px;
|
|
|
}
|
|
|
.jobpricehour {
|
|
|
// margin-top: 16px;
|
|
|
font-size: 14px;
|
|
|
font-weight: bold;
|
|
|
text-align: left;
|
|
|
color: #ff4400;
|
|
|
// line-height: 24px;
|
|
|
span {
|
|
|
vertical-align: baseline;
|
|
|
font-weight: 600;
|
|
|
font-size: 22px;
|
|
|
line-height: 26px;
|
|
|
}
|
|
|
}
|
|
|
.billbutton {
|
|
|
display: flex;
|
|
|
justify-content: flex-start;
|
|
|
margin-top: 15px;
|
|
|
span {
|
|
|
padding: 0 16px;
|
|
|
height: 36px;
|
|
|
margin-right: 20px;
|
|
|
border-radius: 4px;
|
|
|
background-color: rgba(254, 97, 0, 0.1);
|
|
|
font-size: 18px;
|
|
|
font-weight: normal;
|
|
|
color: #1890ff;
|
|
|
line-height: 34px;
|
|
|
}
|
|
|
// button {
|
|
|
// width: 160px;
|
|
|
// // padding: 0 16px;
|
|
|
// height: 36px;
|
|
|
// border: none;
|
|
|
// background-color: #1890ff;
|
|
|
// color: #fff;
|
|
|
// font-weight: normal;
|
|
|
// font-size: 18px;
|
|
|
// border-radius: 4px;
|
|
|
// cursor: pointer;
|
|
|
// &:hover {
|
|
|
// background-color: #ff7614;
|
|
|
// }
|
|
|
// }
|
|
|
.dropdown {
|
|
|
width: 160px;
|
|
|
padding: 0 16px;
|
|
|
height: 36px;
|
|
|
border: none;
|
|
|
background-color: #1890ff;
|
|
|
color: #fff;
|
|
|
font-weight: normal;
|
|
|
font-size: 18px;
|
|
|
border-radius: 4px;
|
|
|
text-align: center;
|
|
|
line-height: 36px;
|
|
|
cursor: pointer;
|
|
|
&:hover {
|
|
|
color: #fff;
|
|
|
|
|
|
background-color: #1890ffcc;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.sub-bottombox {
|
|
|
font-size: 14px;
|
|
|
|
|
|
.bottombox1 {
|
|
|
width: 116px;
|
|
|
height: 32px;
|
|
|
line-height: 30px;
|
|
|
font-size: 14px;
|
|
|
// border: 1px solid rgba(77, 87, 94, 0.3);
|
|
|
border-radius: 4px;
|
|
|
border: 1px solid #1890ff;
|
|
|
background-color: #fff;
|
|
|
color: #1890ff;
|
|
|
cursor: pointer;
|
|
|
&:hover {
|
|
|
color: #fff;
|
|
|
|
|
|
background-color: #1890ff;
|
|
|
}
|
|
|
}
|
|
|
.jobDespBtn {
|
|
|
// width: 116px;
|
|
|
height: 32px;
|
|
|
line-height: 30px;
|
|
|
font-size: 14px;
|
|
|
margin-right: 20px;
|
|
|
// border: 1px solid rgba(77, 87, 94, 0.3);
|
|
|
border-radius: 4px;
|
|
|
border: 1px solid #d9d9d9;
|
|
|
background-color: #fff;
|
|
|
color: #333;
|
|
|
transition: none;
|
|
|
cursor: pointer;
|
|
|
&:hover {
|
|
|
color: #1890ff;
|
|
|
border: 1px solid #1890ff;
|
|
|
|
|
|
// background-color: #ff791a;
|
|
|
}
|
|
|
i {
|
|
|
color: #1890ff;
|
|
|
}
|
|
|
}
|
|
|
.norecruitment {
|
|
|
border: 1px solid #ccc;
|
|
|
margin-left: 16px;
|
|
|
color: #ccc;
|
|
|
cursor: default;
|
|
|
&:hover {
|
|
|
border: 1px solid #ccc;
|
|
|
background-color: #fff;
|
|
|
color: #ccc;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.subsetright {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
justify-content: space-between;
|
|
|
align-items: flex-end;
|
|
|
.topbox {
|
|
|
width: 116px;
|
|
|
height: 54px;
|
|
|
text-align: center;
|
|
|
overflow: hidden;
|
|
|
border-radius: 4px;
|
|
|
line-height: 30px;
|
|
|
div {
|
|
|
// font-weight: normal;
|
|
|
font-size: 14px;
|
|
|
|
|
|
span:first-of-type {
|
|
|
font-size: 20px;
|
|
|
// font-weight: normal;
|
|
|
}
|
|
|
}
|
|
|
div:first-child {
|
|
|
height: 24px;
|
|
|
background: #ff4400;
|
|
|
line-height: 21px;
|
|
|
font-size: 14px;
|
|
|
color: #ffffff;
|
|
|
border: 1px solid #ff4400;
|
|
|
border-radius: 4px 4px 0px 0px;
|
|
|
}
|
|
|
div:last-child {
|
|
|
font-weight: normal;
|
|
|
background-color: #ff6a001a;
|
|
|
color: #ff4400;
|
|
|
font-size: 18px;
|
|
|
span:last-child {
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}
|
|
|
.proxy {
|
|
|
margin-bottom: 16px;
|
|
|
div {
|
|
|
white-space: break-spaces;
|
|
|
}
|
|
|
// padding: 20px !important;
|
|
|
}
|
|
|
.jobinformationbox,
|
|
|
.proxy {
|
|
|
width: 620px;
|
|
|
// border: 1px solid #eeefef;
|
|
|
overflow: hidden;
|
|
|
border-radius: 4px;
|
|
|
padding: 20px 0;
|
|
|
background-color: #fff;
|
|
|
|
|
|
h1 {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
font-size: 18px;
|
|
|
// margin-bottom: 20px;
|
|
|
> span {
|
|
|
font-size: 14px;
|
|
|
color: #1890ff;
|
|
|
text-decoration: underline;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
.infotitle {
|
|
|
display: flex;
|
|
|
margin-top: -2px;
|
|
|
border-bottom: 1px solid #eeefef;
|
|
|
span {
|
|
|
margin-bottom: -1px;
|
|
|
height: 30px;
|
|
|
line-height: 27px;
|
|
|
padding: 1px 12px 0 12px;
|
|
|
margin-right: 6px;
|
|
|
background-color: #fafafa;
|
|
|
border: 1px solid #ededed;
|
|
|
border-bottom: none;
|
|
|
cursor: pointer;
|
|
|
border-radius: 4px 4px 0 0;
|
|
|
font-size: 14px;
|
|
|
color: #333;
|
|
|
}
|
|
|
.active {
|
|
|
background-color: #fafafa;
|
|
|
font-weight: bold;
|
|
|
color: #1890ff;
|
|
|
}
|
|
|
}
|
|
|
span {
|
|
|
height: 25px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
#tip,
|
|
|
#other {
|
|
|
div:last-child {
|
|
|
width: 640px;
|
|
|
padding: 12px 16px;
|
|
|
font-size: 14px;
|
|
|
border: 1px solid #ededed;
|
|
|
color: #333;
|
|
|
}
|
|
|
}
|
|
|
.copy {
|
|
|
width: 46px !important;
|
|
|
position: relative;
|
|
|
padding: 0px 8px !important;
|
|
|
float: right;
|
|
|
top: 6px;
|
|
|
/* right: 20px; */
|
|
|
bottom: 4px;
|
|
|
font-size: 14px !important;
|
|
|
border: 1px solid #1890ff !important;
|
|
|
color: #1890ff !important;
|
|
|
line-height: 22px;
|
|
|
text-align: center;
|
|
|
border-radius: 4px;
|
|
|
cursor: pointer;
|
|
|
&:hover {
|
|
|
color: #fff !important;
|
|
|
background-color: #1890ff !important;
|
|
|
}
|
|
|
}
|
|
|
.jobinformationbox {
|
|
|
h1 {
|
|
|
position: relative;
|
|
|
.copy {
|
|
|
position: absolute;
|
|
|
padding: 0px 12px;
|
|
|
right: 20px;
|
|
|
bottom: 4px;
|
|
|
font-size: 14px;
|
|
|
border: 1px solid #1890ff;
|
|
|
color: #1890ff;
|
|
|
// border-radius: 5px;
|
|
|
line-height: 22px;
|
|
|
text-align: center;
|
|
|
cursor: pointer;
|
|
|
&:hover {
|
|
|
color: #fff;
|
|
|
background-color: #1890ff;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.navigation {
|
|
|
position: relative;
|
|
|
flex: 1;
|
|
|
margin-top: 40px;
|
|
|
// width: 70px !important;
|
|
|
.ant-affix {
|
|
|
left: calc(50% + 156px) !important; // 手动定位固定位置
|
|
|
}
|
|
|
.ant-anchor-wrapper {
|
|
|
padding-left: 5px !important;
|
|
|
}
|
|
|
.ant-anchor-ink-ball {
|
|
|
// border-color: #1890ff;
|
|
|
width: 12px;
|
|
|
height: 12px;
|
|
|
border: 3px solid #1890ff;
|
|
|
}
|
|
|
.ant-anchor-link {
|
|
|
padding: 10px 20px !important;
|
|
|
a {
|
|
|
color: #666;
|
|
|
font-size: 18px;
|
|
|
font-weight: 600;
|
|
|
}
|
|
|
}
|
|
|
.ant-anchor-link-active {
|
|
|
a {
|
|
|
color: #1890ff !important;
|
|
|
// font-weight: bold;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.baseInfoContent {
|
|
|
width: 600px;
|
|
|
> div {
|
|
|
> div:first-child {
|
|
|
font-size: 16px;
|
|
|
color: #333;
|
|
|
font-weight: 600;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.condition {
|
|
|
.conditiontable {
|
|
|
display: flex;
|
|
|
width: 640px;
|
|
|
flex-direction: column;
|
|
|
font-size: 14px;
|
|
|
border-radius: 6px;
|
|
|
border: 1px solid #ededed;
|
|
|
> li {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
border-bottom: 1px solid #ededed;
|
|
|
|
|
|
&:last-child {
|
|
|
border-bottom: 0px;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
li {
|
|
|
display: flex;
|
|
|
min-height: 44px;
|
|
|
width: 100%;
|
|
|
span:first-child {
|
|
|
padding: 12px 16px;
|
|
|
width: 124px;
|
|
|
text-align: center;
|
|
|
border-right: 1px solid #ededed;
|
|
|
color: #666;
|
|
|
// font-weight: bold;
|
|
|
}
|
|
|
span:last-child {
|
|
|
flex: 1;
|
|
|
display: flex;
|
|
|
color: #333;
|
|
|
padding: 12px 16px;
|
|
|
white-space: break-space;
|
|
|
align-items: center;
|
|
|
}
|
|
|
}
|
|
|
li:not(li:last-child) {
|
|
|
border-bottom: 1px solid #ededed;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.maincontentright {
|
|
|
// position: sticky;
|
|
|
// top: 0;
|
|
|
width: 300px;
|
|
|
> div {
|
|
|
// margin-bottom: 16px;
|
|
|
// padding: 16px;
|
|
|
}
|
|
|
.jobDetailInfo {
|
|
|
width: 300px;
|
|
|
overflow: hidden;
|
|
|
// height: 114px;
|
|
|
// padding: 0 20px 0px 20px;
|
|
|
border-radius: 4px;
|
|
|
background-color: #fff;
|
|
|
text-align: left;
|
|
|
h1 {
|
|
|
position: relative;
|
|
|
text-align: center;
|
|
|
margin-bottom: 0;
|
|
|
|
|
|
span {
|
|
|
position: absolute;
|
|
|
right: 10px;
|
|
|
color: #1890ff;
|
|
|
}
|
|
|
}
|
|
|
p {
|
|
|
font-size: 16px;
|
|
|
word-break: break-all;
|
|
|
white-space: break-spaces;
|
|
|
padding: 16px 20px;
|
|
|
}
|
|
|
}
|
|
|
.hotphone {
|
|
|
overflow: hidden;
|
|
|
position: relative;
|
|
|
width: 300px;
|
|
|
height: 200px;
|
|
|
// height: 114px;
|
|
|
// padding: 0 20px 20px 20px;
|
|
|
border: 1px solid #eee;
|
|
|
border-radius: 6px;
|
|
|
background-color: #fff;
|
|
|
text-align: center;
|
|
|
// p {
|
|
|
// position: absolute;
|
|
|
// width: 100%;
|
|
|
// font-size: 20px;
|
|
|
// color: #333;
|
|
|
// font-weight: 600;
|
|
|
// top: 75%;
|
|
|
// left: 50%;
|
|
|
// transform: translateX(-50%) translateY(-50%);
|
|
|
// }
|
|
|
}
|
|
|
.companyinfo {
|
|
|
overflow: hidden;
|
|
|
// padding: 0 20px 20px 20px;
|
|
|
border-radius: 6px;
|
|
|
border: 1px solid #ededed;
|
|
|
background-color: #fff;
|
|
|
|
|
|
.companydetail {
|
|
|
// width: 200px;
|
|
|
p:first-of-type {
|
|
|
padding: 20px;
|
|
|
font-size: 18px;
|
|
|
font-weight: normal;
|
|
|
text-align: left;
|
|
|
color: #4d575e;
|
|
|
margin-bottom: 12px;
|
|
|
line-height: 22px;
|
|
|
white-space: nowrap;
|
|
|
overflow: hidden;
|
|
|
text-overflow: ellipsis;
|
|
|
}
|
|
|
.imgbox {
|
|
|
// width: 230px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
height: 172px;
|
|
|
margin-bottom: 12px;
|
|
|
img {
|
|
|
width: 100%;
|
|
|
}
|
|
|
}
|
|
|
p:last-of-type {
|
|
|
font-size: 14px;
|
|
|
text-align: left;
|
|
|
color: #788085;
|
|
|
line-height: 22px;
|
|
|
margin-bottom: 15px;
|
|
|
}
|
|
|
}
|
|
|
.companylocation {
|
|
|
// width: 200px;
|
|
|
h1 {
|
|
|
// height: 50px;
|
|
|
// line-height: 50px;
|
|
|
padding-top: 10px;
|
|
|
text-align: center;
|
|
|
// border-top: 1px solid #eeefef;
|
|
|
}
|
|
|
.imgbox {
|
|
|
width: 200px;
|
|
|
height: 200px;
|
|
|
margin-top: 20px;
|
|
|
|
|
|
img {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.recommendposition {
|
|
|
border: 1px solid #ededed;
|
|
|
}
|
|
|
}
|
|
|
.leftDesc {
|
|
|
.ant-descriptions-view {
|
|
|
width: 600px;
|
|
|
border-radius: 6px;
|
|
|
// border: 0 !important;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.leftDesc.ant-descriptions-bordered table {
|
|
|
// min-height: 352px !important;
|
|
|
tbody {
|
|
|
tr {
|
|
|
height: 44px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.leftDesc.ant-descriptions-bordered .ant-descriptions-item-label {
|
|
|
width: 124px;
|
|
|
text-align: center;
|
|
|
font-weight: normal;
|
|
|
background-color: #fff;
|
|
|
padding: 8px 0;
|
|
|
font-size: 14px;
|
|
|
color: #666;
|
|
|
letter-spacing: 1px;
|
|
|
// padding: 8px 0px;
|
|
|
/*vertical-align: baseline;*/
|
|
|
}
|
|
|
|
|
|
.leftDesc.ant-descriptions-bordered .ant-descriptions-item-content {
|
|
|
white-space: break-spaces;
|
|
|
text-align: left;
|
|
|
// padding-left: 8px;
|
|
|
font-size: 14px;
|
|
|
color: #333;
|
|
|
}
|
|
|
.boubleLevel > .ant-descriptions-view > table > tbody > .ant-descriptions-row:last-child > .ant-descriptions-item-content {
|
|
|
// padding: 0 !important;
|
|
|
.noborder {
|
|
|
.ant-descriptions-view {
|
|
|
// border: 0 !important;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
// .right
|
|
|
}
|
|
|
.showInfo {
|
|
|
width: unset;
|
|
|
white-space: pre-wrap;
|
|
|
word-break: break-all;
|
|
|
line-height: 28px;
|
|
|
color: #1890ff !important;
|
|
|
border-radius: 6px;
|
|
|
}
|
|
|
.hotTel {
|
|
|
position: fixed;
|
|
|
top: 50%;
|
|
|
left: calc(50vw + 616px);
|
|
|
width: 104px;
|
|
|
height: 110px;
|
|
|
background-color: #fff;
|
|
|
box-shadow: 5px 0px 10px 3px #eee;
|
|
|
text-align: center;
|
|
|
padding-top: 10px;
|
|
|
> i {
|
|
|
font-size: 40px;
|
|
|
}
|
|
|
> p {
|
|
|
font-size: 14px;
|
|
|
text-align: center;
|
|
|
color: #1890ff;
|
|
|
}
|
|
|
&:hover > div {
|
|
|
display: block;
|
|
|
}
|
|
|
div {
|
|
|
position: absolute;
|
|
|
display: none;
|
|
|
height: 110px;
|
|
|
width: 200px;
|
|
|
left: -236px;
|
|
|
bottom: 0px;
|
|
|
text-align: center;
|
|
|
box-shadow: 5px 0px 10px 3px #ddd;
|
|
|
background-color: #fff;
|
|
|
> p:first-child {
|
|
|
padding: 14px 0;
|
|
|
border-bottom: 1px solid #eee;
|
|
|
}
|
|
|
> p:last-child {
|
|
|
padding: 16px 0;
|
|
|
font-size: 24px;
|
|
|
color: #1890ff;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.mask {
|
|
|
position: fixed;
|
|
|
width: 100vw;
|
|
|
height: 100vh;
|
|
|
background-color: rgba(0, 0, 0, 0.06);
|
|
|
top: 0;
|
|
|
left: 0;
|
|
|
z-index: 999;
|
|
|
pointer-events: none;
|
|
|
}
|
|
|
.swiperBox {
|
|
|
width: 350px;
|
|
|
margin-top: 20px;
|
|
|
position: relative;
|
|
|
.swiper-button-next {
|
|
|
right: 0px;
|
|
|
background-image: url(http://matripe.oss-cn-beijing.aliyuncs.com/img/right.svg);
|
|
|
}
|
|
|
.swiper-button-prev {
|
|
|
left: -10px;
|
|
|
background-image: url(http://matripe.oss-cn-beijing.aliyuncs.com/img/left.svg);
|
|
|
}
|
|
|
}
|
|
|
#swiper {
|
|
|
width: 340px;
|
|
|
overflow: hidden;
|
|
|
.swiper-wrapper {
|
|
|
// width: 460px;
|
|
|
}
|
|
|
.swiper-slide {
|
|
|
img {
|
|
|
width: 80px;
|
|
|
height: 45px;
|
|
|
object-fit: cover;
|
|
|
// width: 100%;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.swiper-button-disabled {
|
|
|
display: none;
|
|
|
}
|
|
|
.spic.ant-modal-wrap {
|
|
|
text-align: center;
|
|
|
}
|
|
|
/deep/ .spic {
|
|
|
.ant-modal {
|
|
|
width: auto !important;
|
|
|
display: inline-block;
|
|
|
}
|
|
|
.ant-modal-close {
|
|
|
top: 24px;
|
|
|
right: 6px;
|
|
|
position: fixed;
|
|
|
color: #fff;
|
|
|
|
|
|
.ant-modal-close-x {
|
|
|
font-size: 30px;
|
|
|
}
|
|
|
}
|
|
|
.ant-modal-content {
|
|
|
background-color: transparent;
|
|
|
|
|
|
.ant-modal-body {
|
|
|
padding: 0;
|
|
|
}
|
|
|
|
|
|
img {
|
|
|
-moz-user-select: none;
|
|
|
-webkit-user-select: none;
|
|
|
-ms-user-select: none;
|
|
|
-khtml-user-select: none;
|
|
|
user-select: none;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.rightFixed {
|
|
|
/deep/.ant-anchor-ink {
|
|
|
display: none;
|
|
|
}
|
|
|
}
|
|
|
.default_avatar {
|
|
|
width: 186px;
|
|
|
height: 186px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
text-align: center;
|
|
|
background-color: #d85043;
|
|
|
color: #fff;
|
|
|
font-size: 44px;
|
|
|
line-height: 1.3;
|
|
|
}
|
|
|
.tab-item{
|
|
|
width: 50%;
|
|
|
text-align: center;
|
|
|
font-size: 16px;
|
|
|
padding-bottom: 12px;
|
|
|
cursor: pointer;
|
|
|
position: relative;
|
|
|
.bor{
|
|
|
position: absolute;
|
|
|
left: 50%;
|
|
|
transform: translateX(-50%);
|
|
|
bottom: 0;
|
|
|
width: 20px;
|
|
|
height: 2px;
|
|
|
background-color: transparent;
|
|
|
}
|
|
|
}
|
|
|
.tab-item-active{
|
|
|
color: #1890ff;
|
|
|
font-weight: 600;
|
|
|
.bor{
|
|
|
background-color: #1890ff;
|
|
|
}
|
|
|
}
|
|
|
</style>
|