6 changed files with 1562 additions and 10 deletions
@ -0,0 +1,297 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-08-16 11:11:52 |
||||
|
@ 备注: 人员选择 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import { |
||||
|
geiOrgAllPeople, |
||||
|
saveEditDutyInfo, |
||||
|
getDutyCont, |
||||
|
get_org_everyone_people, |
||||
|
getOrgTree, |
||||
|
getOrgPeopleList, |
||||
|
} from "@/api/hr/paiban/index"; |
||||
|
import UserIcon from "@/assets/images/1.png"; |
||||
|
|
||||
|
const props = defineProps({ |
||||
|
isShow: { |
||||
|
type: Boolean, |
||||
|
default: false, |
||||
|
}, |
||||
|
orgKey: { |
||||
|
type: Object, |
||||
|
default() { |
||||
|
return {}; |
||||
|
}, |
||||
|
}, |
||||
|
orgInfo: { |
||||
|
type: Object, |
||||
|
default() { |
||||
|
return {}; |
||||
|
}, |
||||
|
}, |
||||
|
currOrgCont: { |
||||
|
type: Number, |
||||
|
default: 309, |
||||
|
}, |
||||
|
currOrgContName: { |
||||
|
type: String, |
||||
|
default: "", |
||||
|
}, |
||||
|
}); |
||||
|
const loading = ref(false); |
||||
|
const emits = defineEmits(["update:isOpen", "subitRefresh"]); |
||||
|
const openPage = computed({ |
||||
|
get() { |
||||
|
return props.isShow; |
||||
|
}, |
||||
|
set(val: boolean) { |
||||
|
emits("update:isShow", val); |
||||
|
}, |
||||
|
}); |
||||
|
//行政组织列表 |
||||
|
const currOrgManList = ref([]); |
||||
|
const peopleAry = ref([]); //人员列表 |
||||
|
//搜索条件 |
||||
|
const searchAry = reactive({ |
||||
|
id: props.currOrgCont * 1, |
||||
|
name: "", |
||||
|
page: 1, |
||||
|
pagesize: 10, |
||||
|
}); |
||||
|
//已选择的数据 |
||||
|
const pickUserAry = ref(props.orgInfo ? props.orgInfo : []); |
||||
|
const pickUserKeyAry = ref(props.orgKey ? props.orgKey : []); |
||||
|
const totalCount = ref(0); //一共多少数据 |
||||
|
//选中行政组织节点 |
||||
|
const pickOrgNode = (val: any, v: any, y: any, u: any) => { |
||||
|
searchAry.id = val.id * 1; |
||||
|
searchAry.page = 1; |
||||
|
getPeople(); |
||||
|
}; |
||||
|
//树字段转换 |
||||
|
const defaultProps = { |
||||
|
children: "children", |
||||
|
label: "name", |
||||
|
}; |
||||
|
const saveInfo = ref(""); |
||||
|
const loadTable = ref(false); |
||||
|
//获取行政组织 |
||||
|
const getOrgTreeSub = () => { |
||||
|
currOrgManList.value = []; |
||||
|
getOrgTree({ |
||||
|
id: props.currOrgCont * 1, |
||||
|
}).then((res: any) => { |
||||
|
console.log("获取行政组织人员信息get_org", res); |
||||
|
currOrgManList.value = res.data; |
||||
|
}); |
||||
|
}; |
||||
|
//清空所有数据 |
||||
|
const delAll = () => { |
||||
|
pickUserAry.value = []; |
||||
|
pickUserKeyAry.value = []; |
||||
|
}; |
||||
|
//关闭选择 |
||||
|
const closeOrgUserPAge = () => { |
||||
|
emits("update:isShow", false); |
||||
|
delAll(); |
||||
|
currOrgManList.value = []; |
||||
|
peopleAry.value = []; |
||||
|
searchAry.id = props.currOrgCont * 1; |
||||
|
searchAry.page = 1; |
||||
|
searchAry.pagesize = 10; |
||||
|
searchAry.name = ""; |
||||
|
}; |
||||
|
//搜索人员 |
||||
|
const searchPeopleUs = () => { |
||||
|
searchAry.id = props.currOrgCont * 1; |
||||
|
searchAry.page = 1; |
||||
|
getPeople(); |
||||
|
}; |
||||
|
//获取人员信息 |
||||
|
const getPeople = () => { |
||||
|
loadTable.value = true; |
||||
|
getOrgPeopleList({ |
||||
|
id: searchAry.id, |
||||
|
name: searchAry.name, |
||||
|
page: searchAry.page, |
||||
|
pagesize: searchAry.pagesize, |
||||
|
}) |
||||
|
.then((res: any) => { |
||||
|
console.log("获取人员信息------val----->", res); |
||||
|
let userListAry = res.data; |
||||
|
totalCount.value = userListAry.total; |
||||
|
peopleAry.value = userListAry.list; |
||||
|
loadTable.value = false; |
||||
|
}) |
||||
|
.finally(() => { |
||||
|
loadTable.value = false; |
||||
|
}); |
||||
|
}; |
||||
|
//选择人员 |
||||
|
const handleCurrentChange = (val: any) => { |
||||
|
console.log("选择人员------row----->", val); |
||||
|
let isNew = true; |
||||
|
console.log("选择人员------row----->", Array.isArray(pickUserAry.value)); |
||||
|
if (Array.isArray(pickUserAry.value)) { |
||||
|
let neeAry = new Array(); |
||||
|
let neeKeyAry = new Array(); |
||||
|
pickUserAry.value.forEach((item, index) => { |
||||
|
if (item.userKey == val.userKey) { |
||||
|
isNew = false; |
||||
|
} else { |
||||
|
neeAry.push(item); |
||||
|
neeKeyAry.push(item.userKey); |
||||
|
} |
||||
|
}); |
||||
|
if (isNew) { |
||||
|
pickUserAry.value.push(val); |
||||
|
pickUserKeyAry.value.push(val.userKey); |
||||
|
} else { |
||||
|
pickUserAry.value = neeAry; |
||||
|
pickUserKeyAry.value = neeKeyAry; |
||||
|
} |
||||
|
} else { |
||||
|
pickUserAry.value.push(val); |
||||
|
pickUserKeyAry.value.push(val.userKey); |
||||
|
} |
||||
|
}; |
||||
|
// 勾选的行改变颜色 |
||||
|
const rowClass = (val: any) => { |
||||
|
if (Array.isArray(pickUserKeyAry.value)) { |
||||
|
if (pickUserKeyAry.value.includes(val.userKey)) { |
||||
|
return "active"; |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
//翻页 |
||||
|
const pageCurrentChange = (val: any) => { |
||||
|
searchAry.page = val; |
||||
|
console.log("翻页数据--->", val, searchAry); |
||||
|
getPeople(); |
||||
|
}; |
||||
|
//删除已选中的数据 |
||||
|
const delPickUs = (val: any) => { |
||||
|
if (Array.isArray(pickUserAry.value)) { |
||||
|
let neeAry = new Array(); |
||||
|
let neeKeyAry = new Array(); |
||||
|
pickUserAry.value.forEach((item, index) => { |
||||
|
if (item.userKey != val.userKey) { |
||||
|
neeAry.push(item); |
||||
|
neeKeyAry.push(item.userKey); |
||||
|
} |
||||
|
}); |
||||
|
pickUserAry.value = neeAry; |
||||
|
pickUserKeyAry.value = neeKeyAry; |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
//选定 |
||||
|
const pickOkUser = () => {}; |
||||
|
onMounted(() => { |
||||
|
console.log("新家项目---》", props); |
||||
|
getOrgTreeSub(); |
||||
|
getPeople(); |
||||
|
}); |
||||
|
</script> |
||||
|
<template> |
||||
|
<el-dialog |
||||
|
v-model="openPage" |
||||
|
title="选择人员" |
||||
|
width="900" |
||||
|
draggable |
||||
|
:before-close="closeOrgUserPAge" |
||||
|
append-to-body |
||||
|
> |
||||
|
<div class="bianBox"> |
||||
|
<div class="bianKuang"> |
||||
|
<div class="topHead">行政组织</div> |
||||
|
<el-scrollbar class="bianScro"> |
||||
|
<el-tree |
||||
|
style="width: 100%" |
||||
|
:data="currOrgManList" |
||||
|
:props="defaultProps" |
||||
|
:expand-on-click-node="false" |
||||
|
:check-on-click-node="true" |
||||
|
node-key="id" |
||||
|
@node-click="pickOrgNode" |
||||
|
/> |
||||
|
</el-scrollbar> |
||||
|
</div> |
||||
|
<div class="bianKuangCenter"> |
||||
|
<div class="topHead"> |
||||
|
<el-input |
||||
|
v-model="searchAry.name" |
||||
|
clearable |
||||
|
placeholder="请输入姓名或工号、手机号码" |
||||
|
> |
||||
|
<template #append> |
||||
|
<el-button class="fa fa-search" @click="searchPeopleUs" /> |
||||
|
</template> |
||||
|
</el-input> |
||||
|
</div> |
||||
|
<el-row class="rowHead"> |
||||
|
<el-col :span="4">照片</el-col> |
||||
|
<el-col :span="6">姓名</el-col> |
||||
|
<el-col :span="7">工号</el-col> |
||||
|
<el-col :span="7">联系方式</el-col> |
||||
|
</el-row> |
||||
|
<el-scrollbar class="bianScroRow"> |
||||
|
<el-row |
||||
|
v-for="item in peopleAry" |
||||
|
:key="item.userKey" |
||||
|
@click="handleCurrentChange(item)" |
||||
|
:class="'rowInfo ' + rowClass(item)" |
||||
|
> |
||||
|
<el-col :span="4" class="imgBoxCol"> |
||||
|
<img class="imgBox" :src="item.userAvatar ? item.userAvatar : UserIcon" /> |
||||
|
</el-col> |
||||
|
<el-col :span="6">{{ item.userName }}</el-col> |
||||
|
<el-col :span="7">{{ item.userNumber }}</el-col> |
||||
|
<el-col :span="7">{{ item.telStr }}</el-col> |
||||
|
</el-row> |
||||
|
</el-scrollbar> |
||||
|
<div class="fanyeBox"> |
||||
|
<el-pagination |
||||
|
size="small" |
||||
|
background |
||||
|
layout="prev, pager, next" |
||||
|
:total="totalCount" |
||||
|
@current-change="pageCurrentChange" |
||||
|
/> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="bianKuang"> |
||||
|
<div class="topHead fencha"> |
||||
|
<div> |
||||
|
已选择(<el-text class="mx-1" type="danger">{{ pickUserAry.length }}</el-text |
||||
|
>) |
||||
|
</div> |
||||
|
<div><el-text class="mx-1" type="danger" @click="delAll">清空</el-text></div> |
||||
|
</div> |
||||
|
<el-scrollbar class="bianScroRight"> |
||||
|
<div v-for="item in pickUserAry" :key="item.userKey" class="userBox"> |
||||
|
<img :src="item.userAvatar ? item.userAvatar : UserIcon" /> |
||||
|
<div> |
||||
|
<el-space wrap> |
||||
|
<el-text class="mx-1 pianyi fa fa-user" type="info" |
||||
|
>{{ item.userName }}({{ item.userNumber }})</el-text |
||||
|
> |
||||
|
<el-text class="mx-1 pianyi fa fa-phone" type="primary">{{ |
||||
|
item.telStr |
||||
|
}}</el-text> |
||||
|
</el-space> |
||||
|
</div> |
||||
|
<i class="fa fa-trash-o" @click="delPickUs(item)" /> |
||||
|
</div> |
||||
|
</el-scrollbar> |
||||
|
<div class="footBut"> |
||||
|
<el-button @click="closeOrgUserPAge">取消</el-button> |
||||
|
<el-button type="primary" @click="pickOkUser">确定</el-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
<style lang="scss" scoped></style> |
||||
@ -0,0 +1,409 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-08-16 11:11:52 |
||||
|
@ 备注: 人员选择 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import { |
||||
|
geiOrgAllPeople, |
||||
|
saveEditDutyInfo, |
||||
|
getDutyCont, |
||||
|
get_org_everyone_people, |
||||
|
getOrgTree, |
||||
|
getOrgPeopleList, |
||||
|
} from "@/api/hr/paiban/index"; |
||||
|
import UserIcon from "@/assets/images/1.png"; |
||||
|
|
||||
|
const props = defineProps({ |
||||
|
isShow: { |
||||
|
type: Boolean, |
||||
|
default: false, |
||||
|
}, |
||||
|
currOrgCont: { |
||||
|
type: Number, |
||||
|
default: 309, |
||||
|
}, |
||||
|
currOrgContName: { |
||||
|
type: String, |
||||
|
default: "", |
||||
|
}, |
||||
|
orgKey: { |
||||
|
type: Object, |
||||
|
default() { |
||||
|
return {}; |
||||
|
}, |
||||
|
}, |
||||
|
orgInfo: { |
||||
|
type: Object, |
||||
|
default() { |
||||
|
return {}; |
||||
|
}, |
||||
|
}, |
||||
|
}); |
||||
|
//已选择的数据 |
||||
|
const pickUserAry = ref(props.orgInfo ? props.orgInfo : []); |
||||
|
const pickUserKeyAry = ref(props.orgKey ? props.orgKey : []); |
||||
|
const loading = ref(false); |
||||
|
const emits = defineEmits([ |
||||
|
"update:isOpen", |
||||
|
"update:orgKey", |
||||
|
"update:orgInfo", |
||||
|
"subitRefresh", |
||||
|
]); |
||||
|
const openPage = computed({ |
||||
|
get() { |
||||
|
return props.isShow; |
||||
|
}, |
||||
|
set(val: boolean) { |
||||
|
emits("update:isShow", val); |
||||
|
}, |
||||
|
}); |
||||
|
|
||||
|
//行政组织列表 |
||||
|
const currOrgManList = ref([]); |
||||
|
const loadTable = ref(false); |
||||
|
const totalCount = ref(0); //一共多少数据 |
||||
|
const peopleAry = ref([]); //人员列表 |
||||
|
//获取行政组织 |
||||
|
const getOrgTreeSub = () => { |
||||
|
currOrgManList.value = []; |
||||
|
getOrgTree({ |
||||
|
id: props.currOrgCont * 1, |
||||
|
}).then((res: any) => { |
||||
|
console.log("获取行政组织人员信息get_org", res); |
||||
|
currOrgManList.value = res.data; |
||||
|
}); |
||||
|
}; |
||||
|
//树字段转换 |
||||
|
const defaultProps = { |
||||
|
children: "children", |
||||
|
label: "name", |
||||
|
}; |
||||
|
//搜索条件 |
||||
|
const searchAry = reactive({ |
||||
|
id: props.currOrgCont * 1, |
||||
|
name: "", |
||||
|
page: 1, |
||||
|
pagesize: 10, |
||||
|
}); |
||||
|
//选中行政组织节点 |
||||
|
const pickOrgNode = (val: any, v: any, y: any, u: any) => { |
||||
|
searchAry.id = val.id * 1; |
||||
|
searchAry.page = 1; |
||||
|
getPeople(); |
||||
|
}; |
||||
|
//获取人员信息 |
||||
|
const getPeople = () => { |
||||
|
loadTable.value = true; |
||||
|
getOrgPeopleList({ |
||||
|
id: searchAry.id, |
||||
|
name: searchAry.name, |
||||
|
page: searchAry.page, |
||||
|
pagesize: searchAry.pagesize, |
||||
|
}) |
||||
|
.then((res: any) => { |
||||
|
console.log("获取人员信息------val----->", res); |
||||
|
let userListAry = res.data; |
||||
|
totalCount.value = userListAry.total; |
||||
|
peopleAry.value = userListAry.list; |
||||
|
loadTable.value = false; |
||||
|
}) |
||||
|
.finally(() => { |
||||
|
loadTable.value = false; |
||||
|
}); |
||||
|
}; |
||||
|
//关闭选择 |
||||
|
const closeOrgUserPAge = () => { |
||||
|
emits("update:isShow", false); |
||||
|
delAll(); |
||||
|
currOrgManList.value = []; |
||||
|
}; |
||||
|
//清空所有数据 |
||||
|
const delAll = () => { |
||||
|
pickUserAry.value = []; |
||||
|
pickUserKeyAry.value = []; |
||||
|
}; |
||||
|
//选择人员 |
||||
|
const handleCurrentChange = (val: any) => { |
||||
|
console.log("选择人员------row----->", val); |
||||
|
let isNew = true; |
||||
|
console.log("选择人员------row----->", Array.isArray(pickUserAry.value)); |
||||
|
if (Array.isArray(pickUserAry.value)) { |
||||
|
let neeAry = new Array(); |
||||
|
let neeKeyAry = new Array(); |
||||
|
pickUserAry.value.forEach((item, index) => { |
||||
|
if (item.userKey == val.userKey) { |
||||
|
isNew = false; |
||||
|
} else { |
||||
|
neeAry.push(item); |
||||
|
neeKeyAry.push(item.userKey); |
||||
|
} |
||||
|
}); |
||||
|
if (isNew) { |
||||
|
pickUserAry.value.push(val); |
||||
|
pickUserKeyAry.value.push(val.userKey); |
||||
|
} else { |
||||
|
pickUserAry.value = neeAry; |
||||
|
pickUserKeyAry.value = neeKeyAry; |
||||
|
} |
||||
|
} else { |
||||
|
pickUserAry.value.push(val); |
||||
|
pickUserKeyAry.value.push(val.userKey); |
||||
|
} |
||||
|
}; |
||||
|
// 勾选的行改变颜色 |
||||
|
const rowClass = (val: any) => { |
||||
|
if (Array.isArray(pickUserKeyAry.value)) { |
||||
|
if (pickUserKeyAry.value.includes(val.userKey)) { |
||||
|
return "active"; |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
//翻页 |
||||
|
const pageCurrentChange = (val: any) => { |
||||
|
searchAry.page = val; |
||||
|
console.log("翻页数据--->", val, searchAry); |
||||
|
getPeople(); |
||||
|
}; |
||||
|
//删除已选中的数据 |
||||
|
const delPickUs = (val: any) => { |
||||
|
if (Array.isArray(pickUserAry.value)) { |
||||
|
let neeAry = new Array(); |
||||
|
let neeKeyAry = new Array(); |
||||
|
pickUserAry.value.forEach((item, index) => { |
||||
|
if (item.userKey != val.userKey) { |
||||
|
neeAry.push(item); |
||||
|
neeKeyAry.push(item.userKey); |
||||
|
} |
||||
|
}); |
||||
|
pickUserAry.value = neeAry; |
||||
|
pickUserKeyAry.value = neeKeyAry; |
||||
|
} |
||||
|
}; |
||||
|
//搜索人员 |
||||
|
const searchPeopleUs = () => { |
||||
|
searchAry.id = props.currOrgCont * 1; |
||||
|
searchAry.page = 1; |
||||
|
getPeople(); |
||||
|
}; |
||||
|
//选定 |
||||
|
const pickOkUser = () => { |
||||
|
console.log("选定数据----2---->", pickUserAry.value); |
||||
|
console.log("选定数据---1------>", pickUserKeyAry.value); |
||||
|
emits("update:orgKey", pickUserKeyAry.value); |
||||
|
emits("update:orgInfo", pickUserAry.value); |
||||
|
closeOrgUserPAge(); |
||||
|
}; |
||||
|
onMounted(() => { |
||||
|
console.log("选择人员", props); |
||||
|
getOrgTreeSub(); |
||||
|
getPeople(); |
||||
|
}); |
||||
|
</script> |
||||
|
<template> |
||||
|
<el-dialog |
||||
|
v-model="openPage" |
||||
|
title="选择人员" |
||||
|
width="900" |
||||
|
draggable |
||||
|
:before-close="closeOrgUserPAge" |
||||
|
append-to-body |
||||
|
> |
||||
|
<div class="bianBox"> |
||||
|
<div class="bianKuang"> |
||||
|
<div class="topHead">行政组织</div> |
||||
|
<el-scrollbar class="bianScro"> |
||||
|
<el-tree |
||||
|
style="width: 100%" |
||||
|
:data="currOrgManList" |
||||
|
:props="defaultProps" |
||||
|
:expand-on-click-node="false" |
||||
|
:check-on-click-node="true" |
||||
|
node-key="id" |
||||
|
@node-click="pickOrgNode" |
||||
|
/> |
||||
|
</el-scrollbar> |
||||
|
</div> |
||||
|
<div class="bianKuangCenter"> |
||||
|
<div class="topHead"> |
||||
|
<el-input |
||||
|
v-model="searchAry.name" |
||||
|
clearable |
||||
|
placeholder="请输入姓名或工号、手机号码" |
||||
|
> |
||||
|
<template #append> |
||||
|
<el-button class="fa fa-search" @click="searchPeopleUs" /> |
||||
|
</template> |
||||
|
</el-input> |
||||
|
</div> |
||||
|
<el-row class="rowHead"> |
||||
|
<el-col :span="4">照片</el-col> |
||||
|
<el-col :span="6">姓名</el-col> |
||||
|
<el-col :span="7">工号</el-col> |
||||
|
<el-col :span="7">联系方式</el-col> |
||||
|
</el-row> |
||||
|
<el-scrollbar class="bianScroRow"> |
||||
|
<el-row |
||||
|
v-for="item in peopleAry" |
||||
|
:key="item.userKey" |
||||
|
@click="handleCurrentChange(item)" |
||||
|
:class="'rowInfo ' + rowClass(item)" |
||||
|
> |
||||
|
<el-col :span="4" class="imgBoxCol"> |
||||
|
<img class="imgBox" :src="item.userAvatar ? item.userAvatar : UserIcon" /> |
||||
|
</el-col> |
||||
|
<el-col :span="6">{{ item.userName }}</el-col> |
||||
|
<el-col :span="7">{{ item.userNumber }}</el-col> |
||||
|
<el-col :span="7">{{ item.telStr }}</el-col> |
||||
|
</el-row> |
||||
|
</el-scrollbar> |
||||
|
<div class="fanyeBox"> |
||||
|
<el-pagination |
||||
|
size="small" |
||||
|
background |
||||
|
layout="prev, pager, next" |
||||
|
:total="totalCount" |
||||
|
@current-change="pageCurrentChange" |
||||
|
/> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="bianKuang"> |
||||
|
<div class="topHead fencha"> |
||||
|
<div> |
||||
|
已选择(<el-text class="mx-1" type="danger">{{ pickUserAry.length }}</el-text |
||||
|
>) |
||||
|
</div> |
||||
|
<div><el-text class="mx-1" type="danger" @click="delAll">清空</el-text></div> |
||||
|
</div> |
||||
|
<el-scrollbar class="bianScroRight"> |
||||
|
<div v-for="item in pickUserAry" :key="item.userKey" class="userBox"> |
||||
|
<img :src="item.userAvatar ? item.userAvatar : UserIcon" /> |
||||
|
<div> |
||||
|
<el-space wrap> |
||||
|
<el-text class="mx-1 pianyi fa fa-user" type="info" |
||||
|
>{{ item.userName }}({{ item.userNumber }})</el-text |
||||
|
> |
||||
|
<el-text class="mx-1 pianyi fa fa-phone" type="primary">{{ |
||||
|
item.telStr |
||||
|
}}</el-text> |
||||
|
</el-space> |
||||
|
</div> |
||||
|
<i class="fa fa-trash-o" @click="delPickUs(item)" /> |
||||
|
</div> |
||||
|
</el-scrollbar> |
||||
|
<div class="footBut"> |
||||
|
<el-button @click="closeOrgUserPAge">取消</el-button> |
||||
|
<el-button type="primary" @click="pickOkUser">确定</el-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
<style lang="scss" scoped> |
||||
|
.eidtPickUs { |
||||
|
width: 100%; |
||||
|
margin-bottom: 5px; |
||||
|
} |
||||
|
.bianBox { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
width: 100%; |
||||
|
height: 510px; |
||||
|
border: 1px solid rgba(200, 201, 204, 0.5); |
||||
|
.bianKuang { |
||||
|
width: 300px; |
||||
|
height: 510px; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
.bianKuangCenter { |
||||
|
width: 500px; |
||||
|
height: 510px; |
||||
|
border-left: 1px solid rgba(200, 201, 204, 0.5); |
||||
|
border-right: 1px solid rgba(200, 201, 204, 0.5); |
||||
|
} |
||||
|
.topHead { |
||||
|
height: 40px; |
||||
|
border-bottom: 1px solid rgba(200, 201, 204, 0.5); |
||||
|
padding: 0 5px; |
||||
|
align-items: center; |
||||
|
display: flex; |
||||
|
} |
||||
|
.fencha { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
} |
||||
|
.bianScro { |
||||
|
width: 100%; |
||||
|
height: 455px; |
||||
|
padding: 0px 0px; |
||||
|
.userBox { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
padding: 10px 5px; |
||||
|
border-bottom: 1px dashed rgba(200, 201, 204, 0.5); |
||||
|
img { |
||||
|
width: 40px; |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.bianScroRight { |
||||
|
width: 100%; |
||||
|
height: 415px; |
||||
|
padding: 0px 0px; |
||||
|
.userBox { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
padding: 10px 5px; |
||||
|
border-bottom: 1px dashed rgba(200, 201, 204, 0.5); |
||||
|
img { |
||||
|
width: 40px; |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.fanyeBox { |
||||
|
width: 100%; |
||||
|
text-align: center; |
||||
|
display: flex; |
||||
|
justify-content: space-around; |
||||
|
align-items: center; |
||||
|
margin-top: 10px; |
||||
|
} |
||||
|
.imgBox { |
||||
|
width: 40px; |
||||
|
height: 40px; |
||||
|
} |
||||
|
.rowHead { |
||||
|
padding: 10px 0; |
||||
|
text-align: center; |
||||
|
font-weight: bold; |
||||
|
color: #000000; |
||||
|
background-color: rgba(244, 245, 249, 1); |
||||
|
} |
||||
|
.imgBoxCol { |
||||
|
text-align: center; |
||||
|
} |
||||
|
.bianScroRow { |
||||
|
width: 100%; |
||||
|
height: 380px; |
||||
|
.rowInfo { |
||||
|
padding: 10px 0 5px 0; |
||||
|
border-bottom: 1px dashed rgba(200, 201, 204, 0.5); |
||||
|
align-items: center; |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
.rowInfo.active { |
||||
|
background-color: rgb(248, 152, 152); |
||||
|
} |
||||
|
} |
||||
|
.footBut { |
||||
|
padding: 10px 5px 0 0; |
||||
|
text-align: right; |
||||
|
border-top: 1px solid rgba(200, 201, 204, 0.5); |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,616 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-08-12 15:48:52 |
||||
|
@ 备注: 编辑排班记录 |
||||
|
--> |
||||
|
<script lang="ts" setup> |
||||
|
import { get_org } from "@/api/opk/zxy/news/api"; |
||||
|
import OrgPeople from "@/views/hr/company/orgPeopleNew.vue"; |
||||
|
import UserIcon from "@/assets/images/1.png"; |
||||
|
|
||||
|
import { |
||||
|
geiOrgAllPeople, |
||||
|
saveEditDutyInfo, |
||||
|
getDutyCont, |
||||
|
get_org_everyone_people, |
||||
|
getOrgTree, |
||||
|
getOrgPeopleList, |
||||
|
} from "@/api/hr/paiban/index"; |
||||
|
|
||||
|
const props = defineProps({ |
||||
|
isOpen: { |
||||
|
type: Boolean, |
||||
|
default: false, |
||||
|
}, |
||||
|
cumpanyId: { |
||||
|
type: Number, |
||||
|
default: "", |
||||
|
}, |
||||
|
dutyCont: { |
||||
|
type: Object, |
||||
|
default() { |
||||
|
return {}; |
||||
|
}, |
||||
|
}, |
||||
|
currOrgManList: { |
||||
|
type: Object, |
||||
|
default() { |
||||
|
return {}; |
||||
|
}, |
||||
|
}, |
||||
|
currOrgCont: { |
||||
|
type: Number, |
||||
|
default: 309, |
||||
|
}, |
||||
|
currOrgContName: { |
||||
|
type: String, |
||||
|
default: "", |
||||
|
}, |
||||
|
}); |
||||
|
const userOpen = ref(true); |
||||
|
const ruleFormRef = ref(null); |
||||
|
const loading = ref(false); |
||||
|
const emits = defineEmits(["update:isOpen", "pickRefresh"]); |
||||
|
const isShow = computed({ |
||||
|
get() { |
||||
|
// console.log("对话框状态",props.isOpen); |
||||
|
|
||||
|
return props.isOpen; |
||||
|
}, |
||||
|
set(val: boolean) { |
||||
|
// console.log("对话框状态",props.isOpen); |
||||
|
emits("update:isOpen", val); |
||||
|
}, |
||||
|
}); |
||||
|
const currtOrg = ref(props.cumpanyId); |
||||
|
const saveInfo = computed(() => props.dutyCont); |
||||
|
|
||||
|
const openBaiTianPage = ref(false); //白天 |
||||
|
const openNightPage = ref(false); //夜晚 |
||||
|
const openAllDayPage = ref(false); //值班 |
||||
|
const openMorningPage = ref(false); //上午 |
||||
|
const openAfternoonPage = ref(false); //下午 |
||||
|
|
||||
|
//获取行政组织人员信息 |
||||
|
const getOrgPeople = () => { |
||||
|
loading.value = true; |
||||
|
getDutyCont({ id: saveInfo.value.id.toString() }) |
||||
|
.then((res) => { |
||||
|
console.log("获取单一排版信息", res, props.dutyCont); |
||||
|
|
||||
|
saveInfo.value.allDay = res.data.allDayAry; |
||||
|
saveInfo.value.baiTian = res.data.baiTianAry; |
||||
|
saveInfo.value.night = res.data.nightAry; |
||||
|
saveInfo.value.morning = res.data.morningAry; |
||||
|
saveInfo.value.afternoon = res.data.afternoonAry; |
||||
|
saveInfo.value.allDayAll = res.data.allDayAryAll; |
||||
|
saveInfo.value.baiTianAll = res.data.baiTianAryAll; |
||||
|
saveInfo.value.nightAll = res.data.nightAryAll; |
||||
|
saveInfo.value.morningAll = res.data.morningAryAll; |
||||
|
saveInfo.value.afternoonAll = res.data.afternoonAryAll; |
||||
|
// saveInfo.value.isCompany = 1; |
||||
|
console.log("获取单一排版信息", saveInfo.value); |
||||
|
loading.value = false; |
||||
|
}) |
||||
|
.finally(() => { |
||||
|
loading.value = false; |
||||
|
}); |
||||
|
}; |
||||
|
const closeSavePage = () => { |
||||
|
emits("update:isOpen", false); |
||||
|
// ruleFormRef.value.resetFields(); |
||||
|
}; |
||||
|
//删除已选中得项目 |
||||
|
const delCloseTag = (userKey: number, userList: any, userListes: any) => { |
||||
|
console.log("删除已选中得项目", userKey, userList, userListes); |
||||
|
if (Array.isArray(userList) && userList.length > 0) { |
||||
|
userList.forEach((item: any, index: number) => { |
||||
|
if (item.userKey == userKey) { |
||||
|
userList.splice(index, 1); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
if (Array.isArray(userListes) && userListes.length > 0) { |
||||
|
userListes.forEach((item: any, index: number) => { |
||||
|
if (item == userKey) { |
||||
|
userListes.splice(index, 1); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
console.log("删除已选中得项目----2------->", userKey, userList, userListes); |
||||
|
// userList.splice(userList.indexOf(userKey), 1); |
||||
|
// userListes.splice(userListes.indexOf(userKey), 1); |
||||
|
}; |
||||
|
//确定提交 |
||||
|
const saveCenter = () => { |
||||
|
console.log("提交数据", saveInfo.value); |
||||
|
saveInfo.value.holiday = saveInfo.value.holiday.toString(); |
||||
|
saveEditDutyInfo(saveInfo.value).then((res: any) => { |
||||
|
closeSavePage(); |
||||
|
emits( |
||||
|
"pickRefresh", |
||||
|
props.cumpanyId, |
||||
|
saveInfo.value.years, |
||||
|
saveInfo.value.month, |
||||
|
saveInfo.value.orgid |
||||
|
); |
||||
|
}); |
||||
|
}; |
||||
|
|
||||
|
//行政组织列表 |
||||
|
const currOrgManList = ref([]); |
||||
|
//获取行政组织 |
||||
|
const getOrgTreeSub = () => { |
||||
|
currOrgManList.value = []; |
||||
|
getOrgTree({ |
||||
|
id: props.currOrgCont * 1, |
||||
|
}).then((res: any) => { |
||||
|
console.log("获取行政组织人员信息get_org", res); |
||||
|
currOrgManList.value = res.data; |
||||
|
}); |
||||
|
}; |
||||
|
const defaultProps = { |
||||
|
children: "children", |
||||
|
label: "name", |
||||
|
}; |
||||
|
const pickUserAry = ref([]); |
||||
|
const pickUserKeyAry = ref([]); |
||||
|
const totalCount = ref(0); //一共多少数据 |
||||
|
//搜索文本 |
||||
|
const searchOrgPeople = reactive({ |
||||
|
name: "", |
||||
|
}); |
||||
|
//选中行政组织节点 |
||||
|
const pickOrgNode = (val: any, v: any, y: any, u: any) => { |
||||
|
console.log("选中行政组织节点------val----->", val); |
||||
|
console.log("选中行政组织节点------v----->", v); |
||||
|
console.log("选中行政组织节点-----y------>", y); |
||||
|
console.log("选中行政组织节点-----u------>", u); |
||||
|
searchAry.id = val.id * 1; |
||||
|
searchAry.page = 1; |
||||
|
getPeople(); |
||||
|
}; |
||||
|
const loadTable = ref(false); |
||||
|
const searchAry = reactive({ |
||||
|
id: props.currOrgCont * 1, |
||||
|
name: "", |
||||
|
page: 1, |
||||
|
pagesize: 10, |
||||
|
}); |
||||
|
const peopleAry = ref([]); |
||||
|
//获取人员信息 |
||||
|
const getPeople = () => { |
||||
|
loadTable.value = true; |
||||
|
getOrgPeopleList({ |
||||
|
id: searchAry.id, |
||||
|
name: searchAry.name, |
||||
|
page: searchAry.page, |
||||
|
pagesize: searchAry.pagesize, |
||||
|
}) |
||||
|
.then((res: any) => { |
||||
|
console.log("获取人员信息------val----->", res); |
||||
|
let userListAry = res.data; |
||||
|
totalCount.value = userListAry.total; |
||||
|
peopleAry.value = userListAry.list; |
||||
|
loadTable.value = false; |
||||
|
}) |
||||
|
.finally(() => { |
||||
|
loadTable.value = false; |
||||
|
}); |
||||
|
}; |
||||
|
//表单状态 |
||||
|
const tableRowClassName = ({ row, rowIndex }: { row: User; rowIndex: number }) => { |
||||
|
console.log("表单状态------row----->", row); |
||||
|
// console.log("表单状态------rowIndex----->", rowIndex); |
||||
|
// if (Array.isArray(pickUserKeyAry.value)) { |
||||
|
// if (pickUserKeyAry.value.includes(row.userKey)) { |
||||
|
// return "warning-row"; |
||||
|
// } else { |
||||
|
// return ""; |
||||
|
// } |
||||
|
// } |
||||
|
}; |
||||
|
|
||||
|
// 勾选的行改变颜色 |
||||
|
const rowClass = (val: any) => { |
||||
|
if (Array.isArray(pickUserKeyAry.value)) { |
||||
|
if (pickUserKeyAry.value.includes(val.userKey)) { |
||||
|
return "active"; |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
//选择人员 |
||||
|
const handleCurrentChange = (val: any) => { |
||||
|
console.log("选择人员------row----->", val); |
||||
|
let isNew = true; |
||||
|
console.log("选择人员------row----->", Array.isArray(pickUserAry.value)); |
||||
|
if (Array.isArray(pickUserAry.value)) { |
||||
|
let neeAry = new Array(); |
||||
|
let neeKeyAry = new Array(); |
||||
|
pickUserAry.value.forEach((item, index) => { |
||||
|
if (item.userKey == val.userKey) { |
||||
|
isNew = false; |
||||
|
} else { |
||||
|
neeAry.push(item); |
||||
|
neeKeyAry.push(item.userKey); |
||||
|
} |
||||
|
}); |
||||
|
if (isNew) { |
||||
|
pickUserAry.value.push(val); |
||||
|
pickUserKeyAry.value.push(val.userKey); |
||||
|
} else { |
||||
|
pickUserAry.value = neeAry; |
||||
|
pickUserKeyAry.value = neeKeyAry; |
||||
|
} |
||||
|
} else { |
||||
|
pickUserAry.value.push(val); |
||||
|
pickUserKeyAry.value.push(val.userKey); |
||||
|
} |
||||
|
}; |
||||
|
//删除已选中的数据 |
||||
|
const delPickUs = (val: any) => { |
||||
|
if (Array.isArray(pickUserAry.value)) { |
||||
|
let neeAry = new Array(); |
||||
|
let neeKeyAry = new Array(); |
||||
|
pickUserAry.value.forEach((item, index) => { |
||||
|
if (item.userKey != val.userKey) { |
||||
|
neeAry.push(item); |
||||
|
neeKeyAry.push(item.userKey); |
||||
|
} |
||||
|
}); |
||||
|
pickUserAry.value = neeAry; |
||||
|
pickUserKeyAry.value = neeKeyAry; |
||||
|
} |
||||
|
}; |
||||
|
//清空所有数据 |
||||
|
const delAll = () => { |
||||
|
pickUserAry.value = []; |
||||
|
pickUserKeyAry.value = []; |
||||
|
}; |
||||
|
//翻页 |
||||
|
const pageCurrentChange = (val: any) => { |
||||
|
searchAry.page = val; |
||||
|
console.log("翻页数据--->", val, searchAry); |
||||
|
getPeople(); |
||||
|
}; |
||||
|
//搜索人员 |
||||
|
const searchPeopleUs = () => { |
||||
|
searchAry.id = props.currOrgCont * 1; |
||||
|
searchAry.page = 1; |
||||
|
getPeople(); |
||||
|
}; |
||||
|
//关闭选择 |
||||
|
const closeOrgUserPAge = () => { |
||||
|
userOpen.value = false; |
||||
|
delAll(); |
||||
|
currOrgManList.value = []; |
||||
|
peopleAry.value = []; |
||||
|
searchAry.id = props.currOrgCont * 1; |
||||
|
searchAry.page = 1; |
||||
|
searchAry.pagesize = 10; |
||||
|
searchAry.name = ""; |
||||
|
}; |
||||
|
//选定 |
||||
|
const pickOkUser = () => {}; |
||||
|
onMounted(() => { |
||||
|
getOrgPeople(); |
||||
|
// getOrgTreeSub(); |
||||
|
// getPeople(); |
||||
|
}); |
||||
|
//打开人员选择器 |
||||
|
const openPickUserPage = (val: number) => { |
||||
|
console.log("打开人员选择器", val); |
||||
|
switch (val) { |
||||
|
case 1: |
||||
|
openBaiTianPage.value = true; |
||||
|
break; |
||||
|
case 2: |
||||
|
openNightPage.value = true; |
||||
|
break; |
||||
|
case 3: |
||||
|
openAllDayPage.value = true; |
||||
|
console.log("打开人员选择器", openAllDayPage.value); |
||||
|
break; |
||||
|
case 4: |
||||
|
openMorningPage.value = true; |
||||
|
break; |
||||
|
case 5: |
||||
|
openAfternoonPage.value = true; |
||||
|
break; |
||||
|
default: |
||||
|
break; |
||||
|
} |
||||
|
}; |
||||
|
</script> |
||||
|
<template> |
||||
|
<el-dialog |
||||
|
v-model="isShow" |
||||
|
:title=" |
||||
|
saveInfo.years + '年' + saveInfo.month + '月' + saveInfo.days + '日编辑值班信息' |
||||
|
" |
||||
|
width="500" |
||||
|
:before-close="closeSavePage" |
||||
|
draggable |
||||
|
> |
||||
|
<el-form ref="ruleFormRef" :model="saveInfo" label-width="80" style="width: 100%"> |
||||
|
<el-form-item label="行政组织" prop="orgname"> |
||||
|
<el-input v-model="saveInfo.orgname" disabled /> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="节假日" prop="holiday"> |
||||
|
<el-switch |
||||
|
v-model="saveInfo.holiday" |
||||
|
:active-value="1" |
||||
|
inline-prompt |
||||
|
:inactive-value="2" |
||||
|
active-text="是" |
||||
|
inactive-text="否" |
||||
|
v-loading="loading" |
||||
|
/> |
||||
|
</el-form-item> |
||||
|
<el-form-item v-if="saveInfo.holiday == 1" label="长白" prop="baiTian"> |
||||
|
<el-space wrap class="eidtPickUs" v-loading="loading"> |
||||
|
<el-tag |
||||
|
v-for="(item, index) in saveInfo.baiTianAll" |
||||
|
closable |
||||
|
:disable-transitions="false" |
||||
|
@close="delCloseTag(item.userKey, saveInfo.baiTianAll, saveInfo.baiTian)" |
||||
|
:key="item.userKey" |
||||
|
>{{ item.userName }}({{ item.userNumber }})</el-tag |
||||
|
> |
||||
|
</el-space> |
||||
|
|
||||
|
<el-button |
||||
|
type="info" |
||||
|
v-loading="loading" |
||||
|
round |
||||
|
size="small" |
||||
|
@click="openPickUserPage(1)" |
||||
|
>编辑</el-button |
||||
|
> |
||||
|
</el-form-item> |
||||
|
<el-form-item v-if="saveInfo.holiday == 1" label="夜晚" prop="night"> |
||||
|
<el-space wrap class="eidtPickUs" v-loading="loading"> |
||||
|
<el-tag |
||||
|
v-for="(item, index) in saveInfo.nightAll" |
||||
|
closable |
||||
|
:disable-transitions="false" |
||||
|
@close="delCloseTag(item.userKey, saveInfo.nightAll, saveInfo.night)" |
||||
|
:key="item.userKey" |
||||
|
>{{ item.userName }}({{ item.userNumber }})</el-tag |
||||
|
> |
||||
|
</el-space> |
||||
|
|
||||
|
<el-button |
||||
|
type="danger" |
||||
|
round |
||||
|
size="small" |
||||
|
v-loading="loading" |
||||
|
@click="openPickUserPage(2)" |
||||
|
>编辑</el-button |
||||
|
> |
||||
|
</el-form-item> |
||||
|
<el-form-item v-if="saveInfo.holiday != 1" label="值班" prop="allDay"> |
||||
|
<el-space wrap class="eidtPickUs" v-loading="loading"> |
||||
|
<el-tag |
||||
|
v-for="(item, index) in saveInfo.allDayAll" |
||||
|
closable |
||||
|
:disable-transitions="false" |
||||
|
@close="delCloseTag(item.userKey, saveInfo.allDayAll, saveInfo.allDay)" |
||||
|
:key="item.userKey" |
||||
|
>{{ item.userName }}({{ item.userNumber }})</el-tag |
||||
|
> |
||||
|
</el-space> |
||||
|
|
||||
|
<el-button |
||||
|
type="primary" |
||||
|
round |
||||
|
size="small" |
||||
|
v-loading="loading" |
||||
|
@click="openPickUserPage(3)" |
||||
|
>编辑</el-button |
||||
|
> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="上午" prop="morning"> |
||||
|
<el-space wrap class="eidtPickUs" v-loading="loading"> |
||||
|
<el-tag |
||||
|
v-for="(item, index) in saveInfo.morningAll" |
||||
|
closable |
||||
|
:disable-transitions="false" |
||||
|
@close="delCloseTag(item.userKey, saveInfo.morningAll, saveInfo.morning)" |
||||
|
:key="item.userKey" |
||||
|
>{{ item.userName }}({{ item.userNumber }})</el-tag |
||||
|
> |
||||
|
</el-space> |
||||
|
|
||||
|
<el-button |
||||
|
type="success" |
||||
|
round |
||||
|
size="small" |
||||
|
v-loading="loading" |
||||
|
@click="openPickUserPage(4)" |
||||
|
>编辑</el-button |
||||
|
> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="下午" prop="afternoon"> |
||||
|
<el-space wrap class="eidtPickUs" v-loading="loading"> |
||||
|
<el-tag |
||||
|
v-for="(item, index) in saveInfo.afternoonAll" |
||||
|
closable |
||||
|
:disable-transitions="false" |
||||
|
@close="delCloseTag(item.userKey, saveInfo.afternoonAll, saveInfo.afternoon)" |
||||
|
:key="item.userKey" |
||||
|
>{{ item.userName }}({{ item.userNumber }})</el-tag |
||||
|
> |
||||
|
</el-space> |
||||
|
|
||||
|
<el-button |
||||
|
type="warning" |
||||
|
round |
||||
|
size="small" |
||||
|
v-loading="loading" |
||||
|
@click="openPickUserPage(5)" |
||||
|
>编辑</el-button |
||||
|
> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<template #footer> |
||||
|
<div class="dialog-footer"> |
||||
|
<el-button @click="closeSavePage">取消</el-button> |
||||
|
<el-button type="primary" @click="saveCenter"> 确定 </el-button> |
||||
|
</div> |
||||
|
</template> |
||||
|
<OrgPeople |
||||
|
v-if="openBaiTianPage" |
||||
|
v-model:is-show="openBaiTianPage" |
||||
|
v-model:org-key="saveInfo.baiTian" |
||||
|
v-model:org-info="saveInfo.baiTianAll" |
||||
|
:curr-org-cont="props.currOrgCont" |
||||
|
:curr-org-cont-name="props.currOrgContName" |
||||
|
:page-id="saveInfo.id" |
||||
|
/> |
||||
|
<OrgPeople |
||||
|
v-if="openNightPage" |
||||
|
v-model:is-show="openNightPage" |
||||
|
v-model:org-key="saveInfo.night" |
||||
|
v-model:org-info="saveInfo.nightAll" |
||||
|
:curr-org-cont="props.currOrgCont" |
||||
|
:curr-org-cont-name="props.currOrgContName" |
||||
|
:page-id="saveInfo.id" |
||||
|
/> |
||||
|
<OrgPeople |
||||
|
v-if="openAllDayPage" |
||||
|
v-model:is-show="openAllDayPage" |
||||
|
v-model:org-key="saveInfo.allDay" |
||||
|
v-model:org-info="saveInfo.allDayAll" |
||||
|
:curr-org-cont="props.currOrgCont" |
||||
|
:curr-org-cont-name="props.currOrgContName" |
||||
|
:page-id="saveInfo.id" |
||||
|
/> |
||||
|
<OrgPeople |
||||
|
v-if="openMorningPage" |
||||
|
v-model:is-show="openMorningPage" |
||||
|
v-model:org-key="saveInfo.morning" |
||||
|
v-model:org-info="saveInfo.morningAll" |
||||
|
:curr-org-cont="props.currOrgCont" |
||||
|
:curr-org-cont-name="props.currOrgContName" |
||||
|
:page-id="saveInfo.id" |
||||
|
/> |
||||
|
<OrgPeople |
||||
|
v-if="openAfternoonPage" |
||||
|
v-model:is-show="openAfternoonPage" |
||||
|
v-model:org-key="saveInfo.afternoon" |
||||
|
v-model:org-info="saveInfo.afternoonAll" |
||||
|
:curr-org-cont="props.currOrgCont" |
||||
|
:curr-org-cont-name="props.currOrgContName" |
||||
|
:page-id="saveInfo.id" |
||||
|
/> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
<style lang="scss" scoped> |
||||
|
.eidtPickUs { |
||||
|
width: 100%; |
||||
|
margin-bottom: 5px; |
||||
|
} |
||||
|
.bianBox { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
width: 100%; |
||||
|
height: 510px; |
||||
|
border: 1px solid rgba(200, 201, 204, 0.5); |
||||
|
.bianKuang { |
||||
|
width: 300px; |
||||
|
height: 510px; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
.bianKuangCenter { |
||||
|
width: 500px; |
||||
|
height: 510px; |
||||
|
border-left: 1px solid rgba(200, 201, 204, 0.5); |
||||
|
border-right: 1px solid rgba(200, 201, 204, 0.5); |
||||
|
} |
||||
|
.topHead { |
||||
|
height: 40px; |
||||
|
border-bottom: 1px solid rgba(200, 201, 204, 0.5); |
||||
|
padding: 0 5px; |
||||
|
align-items: center; |
||||
|
display: flex; |
||||
|
} |
||||
|
.fencha { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
} |
||||
|
.bianScro { |
||||
|
width: 100%; |
||||
|
height: 455px; |
||||
|
padding: 0px 0px; |
||||
|
.userBox { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
padding: 10px 5px; |
||||
|
border-bottom: 1px dashed rgba(200, 201, 204, 0.5); |
||||
|
img { |
||||
|
width: 40px; |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.bianScroRight { |
||||
|
width: 100%; |
||||
|
height: 415px; |
||||
|
padding: 0px 0px; |
||||
|
.userBox { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
padding: 10px 5px; |
||||
|
border-bottom: 1px dashed rgba(200, 201, 204, 0.5); |
||||
|
img { |
||||
|
width: 40px; |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.fanyeBox { |
||||
|
width: 100%; |
||||
|
text-align: center; |
||||
|
display: flex; |
||||
|
justify-content: space-around; |
||||
|
align-items: center; |
||||
|
margin-top: 10px; |
||||
|
} |
||||
|
.imgBox { |
||||
|
width: 40px; |
||||
|
height: 40px; |
||||
|
} |
||||
|
.rowHead { |
||||
|
padding: 10px 0; |
||||
|
text-align: center; |
||||
|
font-weight: bold; |
||||
|
color: #000000; |
||||
|
background-color: rgba(244, 245, 249, 1); |
||||
|
} |
||||
|
.imgBoxCol { |
||||
|
text-align: center; |
||||
|
} |
||||
|
.bianScroRow { |
||||
|
width: 100%; |
||||
|
height: 380px; |
||||
|
.rowInfo { |
||||
|
padding: 10px 0 5px 0; |
||||
|
border-bottom: 1px dashed rgba(200, 201, 204, 0.5); |
||||
|
align-items: center; |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
.rowInfo.active { |
||||
|
background-color: rgb(248, 152, 152); |
||||
|
} |
||||
|
} |
||||
|
.footBut { |
||||
|
padding: 10px 5px 0 0; |
||||
|
text-align: right; |
||||
|
border-top: 1px solid rgba(200, 201, 204, 0.5); |
||||
|
} |
||||
|
</style> |
||||
File diff suppressed because one or more lines are too long
Loading…
Reference in new issue