464 lines
16 KiB
Vue
464 lines
16 KiB
Vue
<template>
|
||
<el-main class="right-main">
|
||
<div class="jd-title">
|
||
<div>{{ jobData.岗位名称 }}</div>
|
||
</div>
|
||
|
||
<div class="jd-block1">
|
||
<div class="jd-h1">一、基本信息</div>
|
||
<table class="jd-table">
|
||
<tr>
|
||
<th>岗位名称</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.基本信息.岗位名称 }}</span> -->
|
||
<!-- itemName:对应domain -->
|
||
<edit-text
|
||
:val="jobData.基本信息.岗位名称"
|
||
:bigDomain="'基本信息'"
|
||
:itemName="'岗位名称'"
|
||
@changeDomainVal="changeOverviewVal"
|
||
></edit-text>
|
||
</td>
|
||
<th>所属部门</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.基本信息.所属部门 }}</span> -->
|
||
<edit-text
|
||
:val="jobData.基本信息.所属部门"
|
||
:bigDomain="'基本信息'"
|
||
:itemName="'所属部门'"
|
||
@changeDomainVal="changeOverviewVal"
|
||
></edit-text>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>岗位类别</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.基本信息.岗位类别 }}</span> -->
|
||
<edit-text
|
||
:val="jobData.基本信息.岗位类别"
|
||
:bigDomain="'基本信息'"
|
||
:itemName="'岗位类别'"
|
||
@changeDomainVal="changeOverviewVal"
|
||
></edit-text>
|
||
</td>
|
||
<th>岗位级别</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.基本信息.岗位级别 }}</span> -->
|
||
<edit-text
|
||
:val="jobData.基本信息.岗位级别"
|
||
:bigDomain="'基本信息'"
|
||
:itemName="'岗位级别'"
|
||
@changeDomainVal="changeOverviewVal"
|
||
></edit-text>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>定编人数</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.基本信息.定编人数 }}</span> -->
|
||
<edit-text
|
||
:val="jobData.基本信息.定编人数"
|
||
:bigDomain="'基本信息'"
|
||
:itemName="'定编人数'"
|
||
@changeDomainVal="changeOverviewVal"
|
||
></edit-text>
|
||
</td>
|
||
<th>辖员人数</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.基本信息.辖员人数 }}</span> -->
|
||
<edit-text
|
||
:val="jobData.基本信息.辖员人数"
|
||
:bigDomain="'基本信息'"
|
||
:itemName="'辖员人数'"
|
||
@changeDomainVal="changeOverviewVal"
|
||
></edit-text>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>直接上级</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.基本信息.直接上级 }}</span> -->
|
||
<edit-text
|
||
:val="jobData.基本信息.直接上级"
|
||
:bigDomain="'基本信息'"
|
||
:itemName="'直接上级'"
|
||
@changeDomainVal="changeOverviewVal"
|
||
></edit-text>
|
||
</td>
|
||
<th>直接下级</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.基本信息.直接下级 }}</span> -->
|
||
<edit-text
|
||
:val="jobData.基本信息.直接下级"
|
||
:bigDomain="'基本信息'"
|
||
:itemName="'直接下级'"
|
||
@changeDomainVal="changeOverviewVal"
|
||
></edit-text>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>岗位使命</th>
|
||
<td colspan="3">
|
||
<!-- <span>{{ jobData.基本信息.岗位使命 }}</span> -->
|
||
<edit-text
|
||
:val="jobData.基本信息.岗位使命"
|
||
:bigDomain="'基本信息'"
|
||
:itemName="'岗位使命'"
|
||
@changeDomainVal="changeOverviewVal"
|
||
></edit-text>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
</div>
|
||
<div class="jd-block1">
|
||
<div class="jd-h1">二、岗位职责</div>
|
||
<div class="jd-block2">
|
||
<div class="jd-h2">工作职责</div>
|
||
<!-- <edit-div class="jd-text" v-model="jobData.工作内容.工作概况">
|
||
</edit-div> -->
|
||
<!-- <div class="jd-text">{{ jobData.工作内容.工作概况 }}</div> -->
|
||
<div
|
||
class="jd-block3"
|
||
v-for="(info, title) in jobResponsibility"
|
||
:key="title"
|
||
>
|
||
<div class="jd-h3">{{ title }}</div>
|
||
<!-- <ol class="jd-li">
|
||
<li v-for="(item, index) in info" :key="index">{{ item }}</li>
|
||
</ol> -->
|
||
<edit-list
|
||
:data="info"
|
||
class="jd-li"
|
||
></edit-list>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!--职权范围---->
|
||
<div class="jd-block2">
|
||
<div class="jd-h2">职权范围</div>
|
||
<table class="jd-table jd-table2">
|
||
<tr>
|
||
<th>所受监督</th>
|
||
<td>
|
||
<edit-div v-model="jobData.岗位职责.职权范围.所受监督[0]"></edit-div>
|
||
<!-- <div>{{ jobData.岗位职责.职权范围.所受监督[0] }}</div> -->
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>所施监督</th>
|
||
<td>
|
||
<edit-div v-model="jobData.岗位职责.职权范围.所施监督[0]"></edit-div>
|
||
<!-- <div>{{ jobData.岗位职责.职权范围.所施监督[0] }}</div> -->
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>工作权限</th>
|
||
<td>
|
||
<!-- <tr v-for="item in jobData.岗位职责.职权范围.工作权限"
|
||
style="border:1px solid #ebebeb;border-left:none">
|
||
<div>{{ item }}</div></tr> -->
|
||
<edit-list
|
||
:data="jobData.岗位职责.职权范围.工作权限"
|
||
class="jd-li2"
|
||
></edit-list>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>企业内部沟通</th>
|
||
<td>
|
||
<!-- <tr v-for="item in jobData.岗位职责.职权范围.企业内部沟通"
|
||
style="border:1px solid #ebebeb;border-left:none">
|
||
<div>{{ item }}</div></tr> -->
|
||
<edit-list
|
||
:data="jobData.岗位职责.职权范围.企业内部沟通"
|
||
class="jd-li2"
|
||
></edit-list>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>企业外部沟通</th>
|
||
<td>
|
||
<!-- <tr v-for="item in jobData.岗位职责.职权范围.企业外部沟通"
|
||
style="border:1px solid #ebebeb;border-left:none">
|
||
<div>{{ item }}</div></tr> -->
|
||
<edit-list
|
||
:data="jobData.岗位职责.职权范围.企业外部沟通"
|
||
class="jd-li2"
|
||
></edit-list>
|
||
</td>
|
||
</tr>
|
||
<!-- <tr>
|
||
<th rowspan="2" class="vertical-one">沟通关系</th>
|
||
<th class="vertical-two">企业内部</th>
|
||
<td>
|
||
<ul class="jd-li2">
|
||
<li v-for="item in jobData.工作内容.职权范围.沟通关系企业内部">
|
||
{{ item }}
|
||
</li>
|
||
</ul>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th class="vertical-two">企业外部</th>
|
||
<td>
|
||
<ul class="jd-li2">
|
||
<li v-for="item in jobData.工作内容.职权范围.沟通关系企业外部">
|
||
{{ item }}
|
||
</li>
|
||
</ul>
|
||
</td>
|
||
</tr> -->
|
||
</table>
|
||
</div>
|
||
<div class="jd-block2">
|
||
<div class="jd-h2">工作环境与条件</div>
|
||
<table class="jd-table">
|
||
<tr>
|
||
<th>工作时间</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.岗位职责.工作环境与条件.工作时间[0] }}</span> -->
|
||
<el-radio-group
|
||
v-model="jobData.岗位职责.工作环境与条件.工作时间[0]"
|
||
@change="changeCheckGroup"
|
||
>
|
||
<el-radio :label="'办公班，实际工作时间8小时'"
|
||
>办公班，实际工作时间8小时</el-radio
|
||
>
|
||
<el-radio :label="'综合计算工时工作制'"
|
||
>综合计算工时工作制</el-radio
|
||
>
|
||
<el-radio :label="'不定时工作制'">不定时工作制</el-radio>
|
||
</el-radio-group>
|
||
</td>
|
||
<th>出差频度</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.岗位职责.工作环境与条件.出差频度[0] }}</span> -->
|
||
<el-radio-group
|
||
v-model="jobData.岗位职责.工作环境与条件.出差频度[0]"
|
||
@change="changeCheckGroup"
|
||
>
|
||
<el-radio :label="'驻外工作'">驻外工作</el-radio>
|
||
<el-radio :label="'经常出差'">经常出差</el-radio>
|
||
<el-radio :label="'有时出差'">有时出差</el-radio>
|
||
<el-radio :label="'极少或不出差'">极少或不出差</el-radio>
|
||
</el-radio-group>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>脑力工作强度</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.岗位职责.工作环境与条件.脑力工作强度[0] }}</span> -->
|
||
<el-radio-group
|
||
v-model="jobData.岗位职责.工作环境与条件.脑力工作强度[0]"
|
||
@change="changeCheckGroup"
|
||
>
|
||
<el-radio :label="'高'">高</el-radio>
|
||
<el-radio :label="'中'">中</el-radio>
|
||
<el-radio :label="'低'">低</el-radio>
|
||
</el-radio-group>
|
||
</td>
|
||
<th>体力工作强度</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.岗位职责.工作环境与条件.体力工作强度[0] }}</span> -->
|
||
<el-radio-group
|
||
v-model="jobData.岗位职责.工作环境与条件.体力工作强度[0]"
|
||
@change="changeCheckGroup"
|
||
>
|
||
<el-radio :label="'高'">高</el-radio>
|
||
<el-radio :label="'中'">中</el-radio>
|
||
<el-radio :label="'低'">低</el-radio>
|
||
</el-radio-group>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>主要工作场所</th>
|
||
<td>
|
||
<!-- <span>{{ jobData.岗位职责.工作环境与条件.主要工作场所[0] }}</span> -->
|
||
<el-radio-group
|
||
v-model="jobData.岗位职责.工作环境与条件.主要工作场所[0]"
|
||
@change="changeCheckGroup"
|
||
>
|
||
<el-radio :label="'室内'">室内</el-radio>
|
||
<el-radio :label="'室外'">室外</el-radio>
|
||
</el-radio-group>
|
||
|
||
</td>
|
||
<th>工作环境的舒适性</th>
|
||
<td>
|
||
<!-- <span>{{jobData.岗位职责.工作环境与条件.工作环境的舒适性[0]}}</span> -->
|
||
<el-radio-group
|
||
v-model="jobData.岗位职责.工作环境与条件.工作环境的舒适性[0]"
|
||
@change="changeCheckGroup"
|
||
>
|
||
<el-radio :label="'舒适'">舒适</el-radio>
|
||
<el-radio :label="'一般'">一般</el-radio>
|
||
<el-radio :label="'较差'">较差</el-radio>
|
||
</el-radio-group>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>工作环境的特殊性</th>
|
||
<td colspan="3">
|
||
<!-- <span>{{ workEnvSpecialty }}</span> -->
|
||
<el-checkbox-group
|
||
v-model="jobData.岗位职责.工作环境与条件.工作环境的特殊性"
|
||
@change="changeCheckGroup"
|
||
>
|
||
<el-checkbox label="无"></el-checkbox>
|
||
<el-checkbox label="粉尘\有毒有害气体"></el-checkbox>
|
||
<el-checkbox label="噪音"></el-checkbox>
|
||
<el-checkbox label="高温\高压"></el-checkbox>
|
||
</el-checkbox-group>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
<div class="jd-block1">
|
||
<div class="jd-h1">三、任职资格</div>
|
||
<table class="jd-table jd-table2">
|
||
<tr>
|
||
<th>学历与专业</th>
|
||
<td>
|
||
<tr>
|
||
<th>学历</th>
|
||
<!-- <td><div>{{ jobData.任职资格.学历[0] }}</div></td> -->
|
||
<edit-div v-model="jobData.任职资格.学历[0]"></edit-div>
|
||
</tr>
|
||
<tr>
|
||
<th>专业</th>
|
||
<!-- <td><div>{{ jobData.任职资格.专业[0] }}</div></td> -->
|
||
<edit-div v-model="jobData.任职资格.专业[0]"></edit-div>
|
||
|
||
</tr>
|
||
<tr>
|
||
<th>职业资格</th>
|
||
<!-- <td><div>{{ jobData.任职资格.职业资格[0] }}</div></td> -->
|
||
<edit-div v-model="jobData.任职资格.职业资格[0]"></edit-div>
|
||
|
||
</tr>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>所需知识</th>
|
||
<td>
|
||
<!-- <tr v-for="item in jobData.任职资格.所需知识"
|
||
style="border:1px solid #ebebeb;border-left:none;border-right:none"><div>{{ item }}</div></tr> -->
|
||
<edit-list
|
||
:data="jobData.任职资格.所需知识"
|
||
class="jd-li2"
|
||
></edit-list>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>所需技能或能力</th>
|
||
<td>
|
||
<!-- <tr v-for="item in jobData.任职资格.所需技能或能力"
|
||
style="border:1px solid #ebebeb;border-left:none;border-right:none"><div>{{ item }}</div></tr> -->
|
||
<edit-list
|
||
:data="jobData.任职资格.所需技能或能力"
|
||
class="jd-li2"
|
||
></edit-list>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>所需经历经验</th>
|
||
<td>
|
||
<!-- <div>{{ jobData.任职资格.所需经历或经验[0] }}</div> -->
|
||
<edit-div v-model="jobData.任职资格.所需经历或经验[0]"></edit-div>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>所需体能</th>
|
||
<td>
|
||
<!-- <div>{{ jobData.任职资格.所需体能[0] }}</div> -->
|
||
<edit-div v-model="jobData.任职资格.所需体能[0]"></edit-div>
|
||
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th>所需职业风格</th>
|
||
<td>
|
||
<!-- <div>{{ jobData.任职资格.所需职业风格[0] }}</div> -->
|
||
<edit-div v-model="jobData.任职资格.所需职业风格[0]"></edit-div>
|
||
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
</div>
|
||
</el-main>
|
||
</template>
|
||
|
||
<script>
|
||
import "@/assets/css/mydoc.css";
|
||
|
||
import EditText from "@/components/EditText/EditText.vue";
|
||
import EditDiv from "@/components/EditDiv/index.vue";
|
||
import EditList from "@/components/EditList/index.vue";
|
||
|
||
export default {
|
||
name: "JobShow",
|
||
props: ["data", "comTitleEdit"],
|
||
data() {
|
||
return {
|
||
jobData: this.data,
|
||
titleEdit: this.comTitleEdit,
|
||
};
|
||
},
|
||
computed: {
|
||
workEnvSpecialty() {
|
||
let res = "";
|
||
for (
|
||
let i = 0;
|
||
i < this.jobData.岗位职责.工作环境与条件.工作环境的特殊性.length;
|
||
i++
|
||
) {
|
||
if (i != 0) res += " | ";
|
||
res += this.jobData.岗位职责.工作环境与条件.工作环境的特殊性[i];
|
||
}
|
||
return res;
|
||
},
|
||
jobResponsibility() {
|
||
let jobres = this.jobData.岗位职责.工作职责;
|
||
let keyArr = Object.keys(jobres);
|
||
keyArr.splice(keyArr.indexOf("临时代理工作"), 1);
|
||
keyArr.splice(keyArr.indexOf("工作职责"), 1);
|
||
keyArr.splice(0, 0, "工作职责");
|
||
keyArr.splice(keyArr.length, 0, "临时代理工作");
|
||
let newjobres = {};
|
||
for (let i = 0; i < keyArr.length; i++) {
|
||
newjobres[keyArr[i]] = jobres[keyArr[i]];
|
||
}
|
||
return newjobres;
|
||
},
|
||
},
|
||
methods: {
|
||
changeOverviewVal(bigDomain,domain, newVal) {
|
||
// let bigDomain = "岗位概况";
|
||
this.jobData[bigDomain][domain] = newVal;
|
||
},
|
||
changeCheckGroup(newVal) {
|
||
// console.log(newVal);
|
||
// console.log(this.jobData.工作内容.工作环境与条件);
|
||
},
|
||
getVal() {
|
||
return this.jobData;
|
||
},
|
||
},
|
||
components: {
|
||
EditText,
|
||
EditDiv,
|
||
EditList,
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style scoped>
|
||
ul {
|
||
list-style-type: circle;
|
||
margin-top: 0px;
|
||
margin-bottom: 0px;
|
||
}
|
||
</style>
|
||
|