mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-16 14:26:45 +08:00
feat:增加项目审核状态
This commit is contained in:
@@ -74,16 +74,16 @@
|
||||
class="treeMain"
|
||||
:style="{ height: screenHeight - 400 + 'px' }"
|
||||
dropdownClassName="changetreedropdownboe"
|
||||
defaultExpandAll
|
||||
default-expand-all
|
||||
:dropdown-style="{
|
||||
maxHeight: '600px',
|
||||
}"
|
||||
placeholder="BOE组织树"
|
||||
allow-clear
|
||||
tree-default-expand-all
|
||||
:tree-data="treeData"
|
||||
@select="departmentSelect"
|
||||
v-model:selectedKeys="selectedKeys"
|
||||
v-model:expandedKeys="openKeys"
|
||||
>
|
||||
<template #suffixIcon></template>
|
||||
</a-tree>
|
||||
@@ -101,6 +101,7 @@
|
||||
columnWidth: 20,
|
||||
selectedRowKeys: selectedRowKeys,
|
||||
onChange: onSelectChange,
|
||||
type: 'radio',
|
||||
}"
|
||||
/>
|
||||
<div class="pa">
|
||||
@@ -127,70 +128,22 @@
|
||||
<div class="right">
|
||||
<div class="onerow">
|
||||
<div class="onleft">
|
||||
<div class="already">已选</div>
|
||||
<!-- <div class="count">6</div>
|
||||
<div class="peo">人</div> -->
|
||||
</div>
|
||||
<div class="clbox" @click="deleteAll">
|
||||
<div class="colose"></div>
|
||||
<span class="allclear">全部清除</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="tit">快速选人</div>
|
||||
<div style="position: relative; min-height: 180px">
|
||||
<div style="height: 160px" class="selectedsBox" id="selectedsBox">
|
||||
<div class="selecteds" id="selecteds">
|
||||
<!-- 遍历生成 -->
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
flex-wrap: wrap;
|
||||
"
|
||||
>
|
||||
<div class="already">当前归属:</div>
|
||||
<div class="chose" v-for="item in choosepeople" :key="item.key">
|
||||
<div>{{ item.name }}</div>
|
||||
<div class="ch" @click="deleteChoosePeople(item)"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="chose"
|
||||
style="
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-right: 20px;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
color: #409eff;
|
||||
line-height: 22px;
|
||||
"
|
||||
v-if="showMore"
|
||||
@click="morePeopleShow"
|
||||
>
|
||||
<div>
|
||||
查看更多
|
||||
<img
|
||||
style="width: 10px; height: 12px; margin-top: -2px"
|
||||
src="../../assets/images/projectadd/go.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="chose"
|
||||
style="
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-right: 20px;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
color: #409eff;
|
||||
line-height: 22px;
|
||||
"
|
||||
v-if="showHidden"
|
||||
@click="morePeopleHidden"
|
||||
>
|
||||
<div>
|
||||
收起
|
||||
<img
|
||||
style="width: 10px; height: 12px; margin-top: -2px"
|
||||
src="../../assets/images/projectadd/pickUp.png"
|
||||
/>
|
||||
</div>
|
||||
<div class="clbox">
|
||||
<span class="allclear">转移归属权</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -238,6 +191,7 @@
|
||||
import { reactive, toRefs, onMounted, onUnmounted } from "vue";
|
||||
import elementResizeDetectorMaker from "element-resize-detector";
|
||||
// import { message } from "ant-design-vue";
|
||||
import * as api from "../../api/index1";
|
||||
export default {
|
||||
name: "ProjOwnerShip",
|
||||
props: {
|
||||
@@ -271,120 +225,148 @@ export default {
|
||||
nameadd: "",
|
||||
nameaddd: "",
|
||||
com: "",
|
||||
openKeys: [2, 13, 32],
|
||||
//组织树
|
||||
treeData: [
|
||||
{
|
||||
key: 1,
|
||||
title: "京东方",
|
||||
value: "京东方",
|
||||
children: [
|
||||
{
|
||||
key: 2,
|
||||
title: "产研部",
|
||||
value: "产研部",
|
||||
children: [
|
||||
{
|
||||
key: 3,
|
||||
title: "产品部",
|
||||
value: "产品部",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
title: "研究部",
|
||||
value: "研究部",
|
||||
},
|
||||
{
|
||||
key: 5,
|
||||
title: "研究部2",
|
||||
value: "研究部2",
|
||||
},
|
||||
{
|
||||
key: 6,
|
||||
title: "研究3",
|
||||
value: "研究3",
|
||||
},
|
||||
{
|
||||
key: 7,
|
||||
title: "研究4",
|
||||
value: "研究4",
|
||||
},
|
||||
{
|
||||
key: 8,
|
||||
title: "研究部5",
|
||||
value: "研究部5",
|
||||
},
|
||||
{
|
||||
key: 9,
|
||||
title: "研究部6",
|
||||
value: "研究部6",
|
||||
},
|
||||
{
|
||||
key: 10,
|
||||
title: "研究部7",
|
||||
value: "研究部7",
|
||||
},
|
||||
{
|
||||
key: 11,
|
||||
title: "研究部8",
|
||||
value: "研究部8",
|
||||
},
|
||||
{
|
||||
key: 12,
|
||||
title: "研究部9",
|
||||
value: "研究部9",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 13,
|
||||
title: "二级标题",
|
||||
value: "二级标题",
|
||||
children: [
|
||||
{
|
||||
key: 14,
|
||||
title: "三级标题",
|
||||
value: "三级标题",
|
||||
children: [
|
||||
{
|
||||
key: 15,
|
||||
title: "四级标题",
|
||||
value: "四级标题",
|
||||
children: [
|
||||
{
|
||||
key: 16,
|
||||
title: "五级标题",
|
||||
value: "五级标题",
|
||||
children: [
|
||||
{
|
||||
key: 17,
|
||||
title: "六级标题",
|
||||
value: "六级标题",
|
||||
children: [
|
||||
{
|
||||
key: 18,
|
||||
title: "七级标题",
|
||||
value: "七级标题",
|
||||
children: [
|
||||
{
|
||||
key: 19,
|
||||
title: "八级标题",
|
||||
value: "八级标题",
|
||||
children: [
|
||||
{
|
||||
key: 20,
|
||||
title: "九级标题",
|
||||
value: "九级标题",
|
||||
children: [
|
||||
{
|
||||
key: 21,
|
||||
title: "十级标题",
|
||||
value: "十级标题",
|
||||
children: [
|
||||
{
|
||||
key: 22,
|
||||
title: "十一级标题",
|
||||
value: "十一级标题",
|
||||
children: [
|
||||
{
|
||||
key: 23,
|
||||
title: "十二级标题",
|
||||
value: "十二级标题",
|
||||
children: [
|
||||
{
|
||||
key: 24,
|
||||
title:
|
||||
"十三级标题十三级标题十三级标题十三级标题",
|
||||
value: "十三级标题",
|
||||
children: [
|
||||
{
|
||||
key: 25,
|
||||
title:
|
||||
"十四级标题",
|
||||
value:
|
||||
"十四级标题",
|
||||
children: [
|
||||
{
|
||||
key: 26,
|
||||
title:
|
||||
"十五级标题",
|
||||
value:
|
||||
"十五级标题",
|
||||
children: [
|
||||
{
|
||||
key: 27,
|
||||
title:
|
||||
"十六级标题",
|
||||
value:
|
||||
@@ -392,6 +374,7 @@ export default {
|
||||
children:
|
||||
[
|
||||
{
|
||||
key: 28,
|
||||
title:
|
||||
"十七级标题",
|
||||
value:
|
||||
@@ -399,6 +382,7 @@ export default {
|
||||
children:
|
||||
[
|
||||
{
|
||||
key: 29,
|
||||
title:
|
||||
"十八级标题",
|
||||
value:
|
||||
@@ -406,6 +390,7 @@ export default {
|
||||
children:
|
||||
[
|
||||
{
|
||||
key: 30,
|
||||
title:
|
||||
"十九级标题",
|
||||
value:
|
||||
@@ -413,6 +398,7 @@ export default {
|
||||
children:
|
||||
[
|
||||
{
|
||||
key: 31,
|
||||
title:
|
||||
"二十级标题二十级标题",
|
||||
value:
|
||||
@@ -455,14 +441,17 @@ export default {
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 32,
|
||||
title: "人力资源部",
|
||||
value: "人力资源部",
|
||||
children: [
|
||||
{
|
||||
key: 33,
|
||||
title: "人事部",
|
||||
value: "人事部",
|
||||
},
|
||||
{
|
||||
key: 34,
|
||||
title: "行政部",
|
||||
value: "行政部",
|
||||
},
|
||||
@@ -602,6 +591,26 @@ export default {
|
||||
selectedRowKeys: [], //表格选中的key
|
||||
//快速选人-------------------------------------
|
||||
});
|
||||
|
||||
//获取组织树
|
||||
const getOrgTree = () => {
|
||||
let obj = {
|
||||
keyword: "",
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
};
|
||||
api
|
||||
.getOrgTree(obj)
|
||||
.then((res) => {
|
||||
if (res.status === 200) {
|
||||
console.log("获取组织树成功", res);
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log("获取组织树失败", err);
|
||||
});
|
||||
};
|
||||
|
||||
const closeDrawer = () => {
|
||||
state.activeKey = "1";
|
||||
ctx.emit("update:ProjOwnervisible", false);
|
||||
@@ -625,6 +634,8 @@ export default {
|
||||
window.addEventListener("resize", getClientHeight, false);
|
||||
// window.addEventListener("resize", getClientHeightSelecteds, false);
|
||||
// judgeUrl();
|
||||
|
||||
getOrgTree();
|
||||
});
|
||||
onUnmounted(() => {
|
||||
window.removeEventListener("resize", getClientHeight, false);
|
||||
@@ -665,31 +676,50 @@ export default {
|
||||
//根据右侧快速选人高度,判断是否显示更多
|
||||
const selectedsHeight = () => {
|
||||
let resize = elementResizeDetectorMaker();
|
||||
resize.listenTo(document.getElementById('ProjOwnership').querySelector("#selecteds"), function (ele) {
|
||||
console.log("ele", ele.offsetHeight);
|
||||
if (ele.offsetHeight > 160 && !state.showHidden) {
|
||||
state.showMore = true;
|
||||
document.getElementById('ProjOwnership').querySelector("#selectedsBox").style.overflow = "hidden";
|
||||
document.getElementById('ProjOwnership').querySelector("#selectedsBox").style.height = "160px";
|
||||
} else if (ele.offsetHeight < 160) {
|
||||
state.showMore = false;
|
||||
state.showHidden = false;
|
||||
document.getElementById('ProjOwnership').querySelector("#selectedsBox").style.overflow = "hidden";
|
||||
document.getElementById('ProjOwnership').querySelector("#selectedsBox").style.height = "160px";
|
||||
resize.listenTo(
|
||||
document.getElementById("ProjOwnership").querySelector("#selecteds"),
|
||||
function (ele) {
|
||||
console.log("ele", ele.offsetHeight);
|
||||
if (ele.offsetHeight > 160 && !state.showHidden) {
|
||||
state.showMore = true;
|
||||
document
|
||||
.getElementById("ProjOwnership")
|
||||
.querySelector("#selectedsBox").style.overflow = "hidden";
|
||||
document
|
||||
.getElementById("ProjOwnership")
|
||||
.querySelector("#selectedsBox").style.height = "160px";
|
||||
} else if (ele.offsetHeight < 160) {
|
||||
state.showMore = false;
|
||||
state.showHidden = false;
|
||||
document
|
||||
.getElementById("ProjOwnership")
|
||||
.querySelector("#selectedsBox").style.overflow = "hidden";
|
||||
document
|
||||
.getElementById("ProjOwnership")
|
||||
.querySelector("#selectedsBox").style.height = "160px";
|
||||
}
|
||||
}
|
||||
});
|
||||
);
|
||||
};
|
||||
const morePeopleShow = () => {
|
||||
state.showMore = false;
|
||||
state.showHidden = true;
|
||||
document.getElementById('ProjOwnership').querySelector("#selectedsBox").style.overflow = "";
|
||||
document.getElementById('ProjOwnership').querySelector("#selectedsBox").style.height = "";
|
||||
document
|
||||
.getElementById("ProjOwnership")
|
||||
.querySelector("#selectedsBox").style.overflow = "";
|
||||
document
|
||||
.getElementById("ProjOwnership")
|
||||
.querySelector("#selectedsBox").style.height = "";
|
||||
};
|
||||
const morePeopleHidden = () => {
|
||||
state.showMore = true;
|
||||
state.showHidden = false;
|
||||
document.getElementById('ProjOwnership').querySelector("#selectedsBox").style.overflow = "hidden";
|
||||
document.getElementById('ProjOwnership').querySelector("#selectedsBox").style.height = "160px";
|
||||
document
|
||||
.getElementById("ProjOwnership")
|
||||
.querySelector("#selectedsBox").style.overflow = "hidden";
|
||||
document
|
||||
.getElementById("ProjOwnership")
|
||||
.querySelector("#selectedsBox").style.height = "160px";
|
||||
};
|
||||
|
||||
// 结束 快速选人------------------------------------------------------------------
|
||||
@@ -704,6 +734,10 @@ export default {
|
||||
state.selectedRowKeys = []; //表格选中的key
|
||||
//快速选人-------------------------------------
|
||||
};
|
||||
|
||||
const expandTree = (e) => {
|
||||
console.log("展开", e);
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
afterVisibleChange,
|
||||
@@ -717,6 +751,7 @@ export default {
|
||||
morePeopleHidden,
|
||||
|
||||
deleteAll,
|
||||
expandTree,
|
||||
};
|
||||
},
|
||||
};
|
||||
@@ -1164,7 +1199,7 @@ export default {
|
||||
}
|
||||
}
|
||||
.right {
|
||||
width: 320px;
|
||||
width: 340px;
|
||||
flex-shrink: 0;
|
||||
overflow-y: auto;
|
||||
.onerow {
|
||||
@@ -1176,11 +1211,15 @@ export default {
|
||||
.onleft {
|
||||
display: flex;
|
||||
text-align: center;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
margin-left: 32px;
|
||||
.already {
|
||||
color: rgba(51, 51, 51, 1);
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
margin-left: 32px;
|
||||
|
||||
white-space: nowrap;
|
||||
// margin-bottom: 20px;
|
||||
}
|
||||
@@ -1194,9 +1233,35 @@ export default {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
}
|
||||
.chose {
|
||||
// width: 64px;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
height: 24px;
|
||||
// margin-top: 25px;
|
||||
// margin-right: 25px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 2px;
|
||||
border: 1px solid rgba(56, 139, 225, 1);
|
||||
color: rgba(56, 139, 225, 1);
|
||||
font-size: 12px;
|
||||
position: relative;
|
||||
flex-shrink: 0;
|
||||
.ch {
|
||||
position: absolute;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
background-image: url(../../assets/images/basicinfo/ch.png);
|
||||
right: -8px;
|
||||
top: -8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.clbox {
|
||||
margin-left: 30px;
|
||||
margin-bottom: 20px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@@ -1248,30 +1313,6 @@ export default {
|
||||
margin-left: 32px;
|
||||
min-height: 100px;
|
||||
// overflow: hidden;
|
||||
.chose {
|
||||
// width: 64px;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
height: 24px;
|
||||
margin-top: 25px;
|
||||
margin-right: 25px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 2px;
|
||||
border: 1px solid rgba(56, 139, 225, 1);
|
||||
color: rgba(56, 139, 225, 1);
|
||||
font-size: 12px;
|
||||
position: relative;
|
||||
.ch {
|
||||
position: absolute;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
background-image: url(../../assets/images/basicinfo/ch.png);
|
||||
right: -8px;
|
||||
top: -8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user