|
|
@@ -1,336 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="p-4">
|
|
|
- <div class="position-header">
|
|
|
- <div class="position-title">岗位管理</div>
|
|
|
- <div class="handle-btns">
|
|
|
- <a-button class="btn" type="primary" @click="addHandle">新增</a-button>
|
|
|
- <a-button class="btn" @click="editHandle">修改</a-button>
|
|
|
- <a-button class="btn" danger @click="delHandle">删除</a-button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="position-body">
|
|
|
- <div class="structure-tree list-items">
|
|
|
- <div class="item-title">部门列表</div>
|
|
|
- <a-tree :replaceFields="replaceFields" :treeData="treeData" v-if="treeData" @select="nodeSelect"></a-tree>
|
|
|
- </div>
|
|
|
- <div class="posts-list list-items">
|
|
|
- <div class="item-title">职位列表</div>
|
|
|
- <div class="posts-box item-box">
|
|
|
- <div class="posts item" v-for="(item, index) in posts.data" :key="index"
|
|
|
- @click="chooseHandle(item, 'posts')">
|
|
|
- <span :class="{ 'chosed': item.departid === posts.currentId }">{{ item.departName }}</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="position-list list-items">
|
|
|
- <div class="item-title">岗位列表</div>
|
|
|
- <div class="position-box item-box">
|
|
|
- <div class="position item" v-for="(item, index) in position.data" :key="index">
|
|
|
- <span :class="{ 'chosed': item.id === position.currentId }" @click="chooseHandle(item, 'position')">{{ item.name }}</span>
|
|
|
- <span v-if="item.id === position.currentId" style="color: red;" @click="openDetailModal(item)">查看</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <PositionDrawer :formData="formData" :drawerTitle="drawerTitle" @onSubmit="onSubmit" ref="drawerRef">
|
|
|
- </PositionDrawer>
|
|
|
- <PositionModal v-if="showModal" @closeModal="showModal = false" :positionDetail="positionDetail"/>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import { defineComponent, reactive, ref, toRefs, computed, onMounted, watch, createVNode } from 'vue';
|
|
|
-import PositionDrawer from './PositionDrawer.vue';
|
|
|
-import PositionModal from './PositionModal.vue';
|
|
|
-import { structureList, getPostsList, getPositionList, delPosition } from '/@/api/sys/position';
|
|
|
-import { message, Modal } from 'ant-design-vue';
|
|
|
-import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
|
|
-
|
|
|
-export default defineComponent({
|
|
|
- name: 'position',
|
|
|
- components: { PositionDrawer, PositionModal, ExclamationCircleOutlined },
|
|
|
- setup(props, { emit }) {
|
|
|
- const drawerRef = ref(null)
|
|
|
- const data = reactive({
|
|
|
- replaceFields: {
|
|
|
- children: 'children',
|
|
|
- title: 'name',
|
|
|
- key: 'id'
|
|
|
- },
|
|
|
- treeData: [],//单位列表树
|
|
|
- currentNode: "",//当前选中的树节点
|
|
|
- posts: {
|
|
|
- currentId: "",
|
|
|
- data: []
|
|
|
- },//职位数据
|
|
|
- position: {
|
|
|
- currentId: "",
|
|
|
- data: []
|
|
|
- },//岗位数据
|
|
|
- formData: {
|
|
|
- id: "",
|
|
|
- orgid: "",
|
|
|
- oabaseid: "",
|
|
|
- name: '',
|
|
|
- duty: '',
|
|
|
- sort: 0,
|
|
|
- },
|
|
|
- drawerTitle: '新增岗位',
|
|
|
- showModal:false,
|
|
|
- positionDetail:{}
|
|
|
- });
|
|
|
- /**
|
|
|
- * 点击树节点触发
|
|
|
- */
|
|
|
- const nodeSelect = (selectkey, { selectedNodes, node }) => {
|
|
|
- if (node.dataRef.departid === data.currentNode) {
|
|
|
- return;
|
|
|
- } else {
|
|
|
- data.currentNode = node.dataRef.departid
|
|
|
- }
|
|
|
- resetTwoDatas()
|
|
|
- let params = {
|
|
|
- departmentId: node.dataRef.departid
|
|
|
- }
|
|
|
- getPostsList(params).then(res => {
|
|
|
- if (res.datas) {
|
|
|
- data.posts.data = res.datas
|
|
|
- }
|
|
|
- })
|
|
|
- };
|
|
|
- const resetTwoDatas = () => {
|
|
|
- data.posts.data = []
|
|
|
- data.posts.currentId = ""
|
|
|
- data.position.data = []
|
|
|
- data.position.currentId = ""
|
|
|
- }
|
|
|
- const chooseHandle = (item, type) => {
|
|
|
- if (type === 'posts') {
|
|
|
- if (data.posts.currentId === item.departid) {
|
|
|
- return;
|
|
|
- }
|
|
|
- data.posts.currentId = item.departid
|
|
|
- data.position.data = []
|
|
|
- data.position.currentId = ""
|
|
|
- //此处查询岗位数据
|
|
|
- let params = {
|
|
|
- zwId: data.posts.currentId
|
|
|
- }
|
|
|
- getPositionList(params).then(res => {
|
|
|
- if (res.datas && res.datas.length) {
|
|
|
- data.position.data = res.datas
|
|
|
- } else {
|
|
|
- message.info('该职位下无岗位数据')
|
|
|
- }
|
|
|
- })
|
|
|
- } else {
|
|
|
- data.position.currentId = item.id
|
|
|
- }
|
|
|
- }
|
|
|
- onMounted(() => {
|
|
|
- structureList().then(res => {
|
|
|
- res.length && (data.treeData = res)
|
|
|
- })
|
|
|
- });
|
|
|
- /**
|
|
|
- * 对岗位的操作
|
|
|
- */
|
|
|
- const addHandle = () => {
|
|
|
- if (data.currentNode === "") {
|
|
|
- message.error('请先选择机构!')
|
|
|
- } else if (data.posts.currentId === "") {
|
|
|
- message.error('请先选择职位!')
|
|
|
- } else {
|
|
|
- data.formData = {
|
|
|
- id: "",
|
|
|
- orgid: data.currentNode,
|
|
|
- oabaseid: data.posts.currentId,
|
|
|
- name: "",
|
|
|
- duty: "",
|
|
|
- sort: data.position.data.length + 1,
|
|
|
- }
|
|
|
- data.drawerTitle = '新增岗位'
|
|
|
- drawerRef.value.showDrawer()
|
|
|
- }
|
|
|
- }
|
|
|
- const editHandle = () => {
|
|
|
- if (data.currentNode === "") {
|
|
|
- message.error('请先选择机构!')
|
|
|
- } else if (data.posts.currentId === "") {
|
|
|
- message.error('请先选择职位!')
|
|
|
- } else if (data.position.currentId === "") {
|
|
|
- message.error('请先选择岗位!')
|
|
|
- } else {
|
|
|
- data.position.data.forEach(item => {
|
|
|
- if (item.id === data.position.currentId) {
|
|
|
- data.formData = {
|
|
|
- id: data.position.currentId,
|
|
|
- orgid: data.currentNode,
|
|
|
- oabaseid: data.posts.currentId,
|
|
|
- name: item.name,
|
|
|
- duty: item.duty,
|
|
|
- sort: parseInt(item.sort),
|
|
|
- }
|
|
|
- data.drawerTitle = '修改岗位'
|
|
|
- drawerRef.value.showDrawer()
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- const delHandle = () => {
|
|
|
- if (data.currentNode === "") {
|
|
|
- message.error('请先选择机构!')
|
|
|
- } else if (data.posts.currentId === "") {
|
|
|
- message.error('请先选择职位!')
|
|
|
- } else if (data.position.currentId === "") {
|
|
|
- message.error('请先选择岗位!')
|
|
|
- } else {
|
|
|
- Modal.confirm({
|
|
|
- title: '删除提示',
|
|
|
- icon: createVNode(ExclamationCircleOutlined),
|
|
|
- content: '确定删除岗位?',
|
|
|
- centered: true,
|
|
|
- okText: '确定',
|
|
|
- okType: 'danger',
|
|
|
- cancelText: '取消',
|
|
|
- onOk: (() => {
|
|
|
- let params = {
|
|
|
- oabaseid: data.posts.currentId,
|
|
|
- id: data.position.currentId
|
|
|
- }
|
|
|
- delPosition(params).then(res => {
|
|
|
- if (res.datas === 1) {
|
|
|
- message.success('操作成功')
|
|
|
- onSubmit(true)
|
|
|
- } else {
|
|
|
- message.error('操作失败')
|
|
|
- }
|
|
|
- })
|
|
|
- })
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
- const openDetailModal = (item) => {
|
|
|
- data.positionDetail = item
|
|
|
- data.showModal = true
|
|
|
- }
|
|
|
- const onSubmit = (e) => {
|
|
|
- if (e) {
|
|
|
- data.position.data = []
|
|
|
- data.position.currentId = ""
|
|
|
- let params = {
|
|
|
- zwId: data.posts.currentId
|
|
|
- }
|
|
|
- getPositionList(params).then(res => {
|
|
|
- if (res.datas && res.datas.length) {
|
|
|
- data.position.data = res.datas
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- return {
|
|
|
- drawerRef,
|
|
|
- ...toRefs(data),
|
|
|
- nodeSelect,
|
|
|
- chooseHandle,
|
|
|
- addHandle,
|
|
|
- editHandle,
|
|
|
- delHandle,
|
|
|
- openDetailModal,
|
|
|
- onSubmit
|
|
|
- };
|
|
|
- },
|
|
|
-});
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="less" scoped>
|
|
|
-.p-4 {
|
|
|
- height: 100%;
|
|
|
-
|
|
|
- .position-header {
|
|
|
- padding: 10px;
|
|
|
- width: 100%;
|
|
|
- height: 70px;
|
|
|
- background-color: #fff;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .position-title {
|
|
|
- font-size: 16px;
|
|
|
- font-weight: 500;
|
|
|
- margin-left: 20px;
|
|
|
- user-select: none;
|
|
|
- }
|
|
|
-
|
|
|
- .handle-btns {
|
|
|
- margin-right: 20px;
|
|
|
- display: flex;
|
|
|
-
|
|
|
- .btn {
|
|
|
- margin-right: 10px;
|
|
|
-
|
|
|
- &:last-child {
|
|
|
- margin-right: 0;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .position-body {
|
|
|
- margin-top: 20px;
|
|
|
- width: 100%;
|
|
|
- // height: 800px;
|
|
|
- height: calc(100% - 90px);
|
|
|
- display: flex;
|
|
|
-
|
|
|
- .list-items {
|
|
|
- margin-right: 20px;
|
|
|
- padding: 10px;
|
|
|
- height: 100%;
|
|
|
- overflow: auto;
|
|
|
- flex: 1;
|
|
|
- background-color: #fff;
|
|
|
-
|
|
|
- &:last-child {
|
|
|
- margin-right: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .item-title {
|
|
|
- padding-left: 10px;
|
|
|
- height: 40px;
|
|
|
- line-height: 40px;
|
|
|
- font-size: 16px;
|
|
|
- background-color: #9eafe7;
|
|
|
- }
|
|
|
-
|
|
|
- .item-box {
|
|
|
- margin-top: 7px;
|
|
|
-
|
|
|
- .item {
|
|
|
- width: fit-content;
|
|
|
- height: 32px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- span {
|
|
|
- padding: 4px;
|
|
|
- cursor: pointer;
|
|
|
- user-select: none;
|
|
|
-
|
|
|
- &:hover {
|
|
|
- background-color: #f5f5f5;
|
|
|
- }
|
|
|
-
|
|
|
- margin-right: 30px;
|
|
|
- }
|
|
|
-
|
|
|
- .chosed {
|
|
|
- background-color: #dbedff;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|