Files
fe-manage/src/views/lecturer/OrganizationApproval.vue
2025-02-21 17:41:48 +08:00

1695 lines
48 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!-- 归属组织 -->
<template>
<!-- 搜索框及按钮 -->
<div class="filter" style="min-width: 1380px; margin: 20px">
<a-form layout="inline">
<a-form-item class="select">
<div>
<a-input
style="width: 235px; height: 40px; border-radius: 8px"
v-model:value="searchParam.name"
placeholder="请输入编号/名称进行搜索"
v-on:keydown.enter="enterPressHadlerSearch"
/>
</div>
</a-form-item>
<a-form-item class="select">
<div>
<!-- TODO GX03 -->
<a-select
style="width: 235px"
v-model:value="searchParam.status"
placeholder="请选择状态"
allowClear
v-on:keydown.enter="enterPressHadlerSearch"
>
<!-- 0正常数据 1待审核 2审核中 3审核通过 4拒绝 5撤回 -->
<a-select-option :value="0">全部</a-select-option>
<a-select-option :value="1">待审核</a-select-option>
<a-select-option :value="2">审核中</a-select-option>
<a-select-option :value="3">审核通过</a-select-option>
<a-select-option :value="4">拒绝</a-select-option>
<a-select-option :value="5">撤回</a-select-option>
</a-select>
</div>
</a-form-item>
<a-form-item class="select">
<div>
<a-select
style="width: 235px"
v-model:value="searchParam.isParent"
placeholder="请选择节点类型"
allowClear
:options="TrainOrglist"
v-on:keydown.enter="enterPressHadlerSearch"
/>
</div>
</a-form-item>
<a-form-item class="select">
<div>
<a-input
style="width: 235px; height: 40px; border-radius: 8px"
v-model:value="searchParam.leaderName"
placeholder="请输入担当姓名/工号"
v-on:keydown.enter="enterPressHadlerSearch"
/>
</div>
</a-form-item>
<div style="display: flex; margin-bottom: 20px">
<a-button @click="searchSubmit()" type="primary" class="resetbtn"
>查询
</a-button>
<!-- <div class="btn btn1" @click="searchReset" style="background:rgba(64, 158, 255, 0);" > -->
<!-- <div class="search"></div> -->
<a-button class="resetbtn" @click="searchReset">重置</a-button>
</div>
</a-form>
<div style="width: 100%"></div>
<!-- <div style="display: flex; margin-bottom: 20px"> -->
<!-- <a-button
v-if="checkMenu('lecturerTrainOrgAdd')"
@click="addTeacher()"
type="primary"
class="resetbtn"
style="width: 164px"
>
<div class="search"></div>
新增培训发生组织
</a-button> -->
<!-- <div
class="btnn btn2"
@click="downOpen"
style="margin-right: 14px"
v-if="checkMenu('lecturerTrainOrgExport')"
>
<div class="daochu"></div>
<div class="btnText">导出</div>
</div> -->
<!-- </div> -->
<!-- 数据处理 -->
<a-table
style="border: 1px solid #f2f6fe"
:columns="columns"
:data-source="tableData"
:loading="tableLoading"
@expand="expandTable"
:pagination="false"
>
<template #bodyCell="{ record, column }">
<template v-if="column.key === 'operation'">
<a-space>
<lockLecturer
:parentName="record.parentName"
:id="record.id"
:title="'培训发生组织详情'"
@searchList="searchList"
>
<div style="color: #1890ff; cursor: pointer">查看</div>
</lockLecturer>
<!-- <a-button
v-if="record.status != 2 && checkMenu('lecturerTrainOrgEdit')"
type="link"
@click="() => handleModify(record, String(record.courseform))"
>编辑</a-button
> -->
<!-- TODO GX02 -->
<a-button
v-if="record.status == 1 || record.status == 4"
type="link"
@click="() => updateModal(record)"
>删除</a-button
>
<!-- <a-button type="link" @click="() => deleteModal(record, String(record.courseform))">删除</a-button> -->
<!-- <a-button
@click="isEnablePost(record, 0)"
v-if="record.enable && checkMenu('lecturerTrainOrgStop')"
type="link"
>启用</a-button
> -->
<!-- <a-button
@click="isEnablePost(record, 1)"
v-if="!record.enable && checkMenu('lecturerTrainOrgStop')"
type="link"
>停用</a-button
> -->
</a-space>
</template>
</template>
</a-table>
<div class="tableBox">
<div class="pa">
<a-pagination
v-if="tableDataTotal > 10"
:showSizeChanger="true"
:showQuickJumper="true"
:hideOnSinglePage="false"
:pageSize="searchParam.pageSize"
:current="searchParam.pageNo"
:total="tableDataTotal"
class="pagination"
@change="changePagination"
/>
</div>
</div>
<!-- 删除功能弹窗 -->
<div>
<a-modal
v-model:visible="deleteInTeacherdialog"
:footer="null"
:closable="close"
centered="true"
>
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon1"></div>
<span>提示</span>
</div>
<div class="body">
<span>您确定要删除当前组织吗</span>
</div>
<div class="del_btnbox">
<div
class="del_btn btn2"
@click="cancelTeacherDialog"
style="margin-right: 32px"
>
<div class="btnText">取消</div>
</div>
<div class="del_btn btn2" @click="closeDeleteTeacher">
<div class="btnText">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
</div>
<!-- 抽屉 -->
<div class="example" v-if="example">
<a-spin />
</div>
<a-drawer
class="largeDrawerInside"
v-model:visible="teacherdialog"
:closable="false"
:title="false"
placement="right"
width="60%"
:maskClosable="false"
>
<div style="padding: 24px">
<div class="headers" style="margin-top: -24px">
<div class="headerTitle">{{ teacherdialogtitle }}</div>
<img
style="width: 29px; height: 29px; cursor: pointer"
src="@/assets/images/basicinfo/close.png"
@click="cancelTeacherDialog"
/>
</div>
<a-form :model="formParam" layout="vertical" ref="formRef">
<a-row :gutter="16">
<a-col :span="24">
<!-- <span class="line"></span><span>讲师体系基本信息</span> -->
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :span="12">
<a-form-item name="affiliationCode">
<template v-slot:label>
<img
style="margin-right: 4px; width: 7px; height: 7px"
src="@/assets/images/coursewareManage/asterisk.png"
alt=""
/>
培训发生组织编号
</template>
<a-input
disabled
v-model:value="formParam.affiliationCode"
class="draitem"
placeholder="请输入讲师体系编号"
allowClear
showSearch
>
</a-input>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item name="affiliationName">
<template v-slot:label>
<img
style="margin-right: 4px; width: 7px; height: 7px"
src="@/assets/images/coursewareManage/asterisk.png"
alt=""
/>
培训发生组织名称
</template>
<a-input
:maxlength="30"
show-count
v-model:value="formParam.affiliationName"
class="draitem"
placeholder="请输入培训发生组织名称"
allowClear
showSearch
>
</a-input>
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :span="12">
<a-form-item name="code">
<template v-slot:label>
<img
style="margin-right: 4px; width: 7px; height: 7px"
src="@/assets/images/coursewareManage/asterisk.png"
alt=""
/>
是否为根节点
</template>
<div style="display: flex; align-items: center">
<a-radio-group
:disabled="formParam.locking"
style="min-width: 126px"
@change="selectRadio"
v-model:value="formParam.isParent"
name="radioGroup"
>
<a-radio :value="1"></a-radio>
<a-radio :value="0"></a-radio>
</a-radio-group>
<a-select
:disabled="formParam.locking"
v-model:value="formParam.code"
:placeholder="
!formParam.isParent ? '请选择审批层级' : '请选择根节点'
"
:options="
!formParam.isParent ? PlaceOfPayList : PlaceOfPayListTwo
"
allowClear
showSearch
/>
</div>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item name="actValue">
<template v-slot:label>
<img
style="margin-right: 4px; width: 7px; height: 7px"
src="@/assets/images/coursewareManage/asterisk.png"
alt=""
/>
组织担当
</template>
<!-- <a-select v-model:value="formParam.zzfzr" placeholder="请选择组织负责人"
:options="PlaceOfPayList" allowClear showSearch/> -->
<!-- <ProjectManager :type="0" v-model:value="formParam.actValue" :placeholder="'请选择担当'" v-model:arrayList="formParam.actArray" ></ProjectManager> -->
<AddApprover
:title="'组织担当'"
v-model:arrayList="formParam.actArray"
@valueChange="valueChange"
:type="0"
>
<a-select
style="width: 100%"
v-model:value="formParam.actValue"
:open="false"
:placeholder="'请选择担当'"
></a-select>
</AddApprover>
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="16" v-if="formParam.isParent">
<a-col :span="12">
<a-form-item name="leveOneValue">
<template v-slot:label>
<img
style="margin-right: 4px; width: 7px; height: 7px"
src="@/assets/images/coursewareManage/asterisk.png"
alt=""
/>
一级审批人
</template>
<!-- <a-select v-model:value="formParam.yjspr" placeholder="请选择一级审批人"
:options="PlaceOfPayList" allowClear showSearch/> -->
<!-- <ProjectManager :type="1" v-model:value="formParam.leveOneValue" :placeholder="'请选择一级审批人'" v-model:arrayList="formParam.leveOneArray" ></ProjectManager> -->
<AddApprover
:title="'一级审批人'"
v-model:arrayList="formParam.leveOneArray"
@valueChange="valueChange"
:type="1"
>
<a-select
style="width: 100%"
v-model:value="formParam.leveOneValue"
:open="false"
:placeholder="'请选择一级审批人'"
></a-select>
</AddApprover>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="二级审批人">
<!-- <a-select v-model:value="formParam.zzfzr" placeholder="请选择二级审批人"
:options="PlaceOfPayList" allowClear showSearch/> -->
<!-- <ProjectManager :type="1" :placeholder="'请选择二级审批人'" v-model:arrayList="formParam.leveTwoArray" ></ProjectManager> -->
<AddApprover
:title="'二级审批人'"
v-model:arrayList="formParam.leveTwoArray"
@valueChange="valueChange"
:type="2"
>
<a-select
style="width: 100%"
v-model:value="formParam.leveTwoValue"
:open="false"
:placeholder="'请选择二级审批人'"
></a-select>
</AddApprover>
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :span="12" v-if="formParam.isParent">
<a-form-item label="三级审批人">
<!-- <a-select v-model:value="formParam.sjspr" placeholder="请选择三级审批人"
:options="PlaceOfPayList" allowClear showSearch/> -->
<!-- <ProjectManager :type="1" :placeholder="'请选择三级审批人'" v-model:arrayList="formParam.leveThreeArray" ></ProjectManager> -->
<AddApprover
:title="'三级审批人'"
v-model:arrayList="formParam.leveThreeArray"
@valueChange="valueChange"
:type="3"
>
<a-select
style="width: 100%"
v-model:value="formParam.leveThreeValue"
:open="false"
:placeholder="'请选择三级审批人'"
></a-select>
</AddApprover>
</a-form-item>
</a-col>
<a-col :span="12" v-if="formParam.isParent == 0">
<a-form-item name="isContains">
<template v-slot:label>
<img
style="margin-right: 4px; width: 7px; height: 7px"
src="@/assets/images/coursewareManage/asterisk.png"
alt=""
/>
审批流程是否加该担当
</template>
<a-select
v-model:value="formParam.isContains"
placeholder="请选择审批流程是否加担当"
:options="isConSelect"
allowClear
showSearch
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item label="备注">
<a-input
v-model:value="formParam.remark"
showCount
:maxlength="200"
style="width: 100%; height: 40px; border-radius: 8px"
placeholder="请输入"
/>
</a-form-item>
</a-col>
</a-row>
<a-form-item name="orglistName">
<template v-slot:label>
<img
style="margin-right: 4px; width: 7px; height: 7px"
src="@/assets/images/coursewareManage/asterisk.png"
alt=""
/>
选择管理组织
</template>
<a-row :gutter="50" style="margin-bottom: 10px">
<a-col :span="2">
<!-- <a-tag color="blue" style="line-height: 40px; ">管理业务</a-tag> -->
<a-button
type="primary"
@click="addContentData"
style="width: 100px; height: 40px; border-radius: 8px"
>添加组织</a-button
>
</a-col>
<!-- <a-col :span="20">
<div class="add_content" @click="addContentData" >+</div>
</a-col> -->
</a-row>
</a-form-item>
<!-- 备注 remark -->
<a-row :gutter="16" style="padding-bottom: 60px">
<a-col :span="24">
<a-form-item label="">
<!-- <a-textarea v-model:value="formParam.remark" showCount :maxlength="200"
style="width: 100%; height: 100px; border-radius: 8px" placeholder="请输入" /> -->
<a-table
:dataSource="formParam?.affiliationOrgList"
:scroll="{ x: '600' }"
:columns="orgColumns"
/>
</a-form-item>
</a-col>
</a-row>
</a-form>
<!-- 交互按钮 -->
<div
:style="{
position: 'absolute',
right: 0,
bottom: 0,
width: '100%',
borderTop: '1px solid #e9e9e9',
padding: '10px 16px',
background: '#fff',
textAlign: 'right',
zIndex: 1,
}"
>
<a-button class="drabtn" @click="cancelTeacherDialog">取消</a-button>
<a-button
class="drabtn"
type="primary"
@click="createTeacherDialog(0)"
:loading="buttonLoading"
>保存</a-button
>
<a-button
v-if="editParams || editIndex > 1"
class="drabtn"
type="primary"
@click="createTeacherDialog(1)"
:loading="buttonLoading"
>提交</a-button
>
</div>
</div>
</a-drawer>
<AddOrgContent
:Addtitle="'选择组织'"
:isParent="formParam.isParent"
v-model:showContent="showContent"
:AddContentLists="formParam.affiliationOrgLists"
v-model:AddContentList="formParam.affiliationOrgList"
/>
</div>
</template>
<script lang="jsx">
import { reactive, toRefs, ref, watch, onMounted } from "vue";
import { FolderAddOutlined } from "@ant-design/icons-vue";
import { message } from "ant-design-vue";
import dialog from "@/utils/dialog";
import ProjectManager from "@/components/project/ProjectManagerLecturer";
import {
queryTrainOrg,
deleteTrainOrg,
addReviewer,
updateTrainOrg,
} from "../../api/organization";
import AddOrgContent from "../../components/project/AddOrgContent.vue";
import * as lecturer from "../../api/Lecturer.js";
import lockLecturer from "@/components/project/lockLecturer";
import AddApprover from "@/components/project/AddApprover";
import { checkMenu } from "@/utils/utils";
export default {
name: "organizationList",
components: {
ProjectManager,
FolderAddOutlined, //图标--新增
AddOrgContent,
lockLecturer,
AddApprover,
},
setup() {
const formRef = ref();
const state = reactive({
example: false,
editParams: true,
editIndex: 0,
tableDataTotal: 0,
vf: true,
showContent: false,
tableLoading: false,
deleteInTeacherdialog: false,
teacherdialog: false,
teacherdialogtitle: null,
delId: null,
searchParam: {
name: null,
isParent: null,
leaderName: null,
status: null,
approvalType: null,
pageNo: "1",
pageSize: "10",
},
formParam: {
orglistName: null,
affiliationCode: null,
affiliationName: null,
isParent: 1,
remark: null,
actValue: null,
actArray: [],
leveOneValue: null,
leveTwoValue: null,
leveThreeValue: null,
leveOneArray: [],
leveTwoArray: [],
leveThreeArray: [],
code: null,
isContains: "0",
affiliationOrgList: [],
affiliationOrgLists: [],
locking: 1,
},
});
const PlaceOfPayList = ref([
{ value: "1", label: "一级审批" },
{ value: "2", label: "二级审批" },
{ value: "3", label: "三级审批" },
]);
const isConSelect = ref([
{ value: "1", label: "是" },
{ value: "0", label: "否" },
]);
const placeData = () => {
lecturer.parentList().then((res) => {
if (res.data.code == 200) {
PlaceOfPayListTwo.value = res.data.data.map((item) => {
return {
value: item.affiliationCode,
label: item.affiliationName,
};
});
}
});
};
// placeData()
const PlaceOfPayListTwo = ref([]);
const selectRadio = (val) => {
if (val.target.value == 1) {
state.formParam.leveOneArray = [];
state.formParam.leveTwoArray = [];
state.formParam.leveThreeArray = [];
state.formParam.leveOneValue = null;
state.formParam.leveTwoValue = null;
state.formParam.leveThreeValue = null;
}
state.formParam.code = null;
};
onMounted(() => {
//初始化时
state.searchParam.status = 2
});
const columns = ref([
// {
// title: '培训发生组织编号 ',
// dataIndex: 'affiliationCode',
// key: 'affiliationCode',
// ellipsis: true,
// align: "center",
// width: '100px',
// },
{
title: "培训发生组织名称 ",
dataIndex: "affiliationName",
key: "affiliationName",
ellipsis: true,
align: "left",
width: "200px",
customCell: () => {
return { style: { userSelect: "text" } };
},
},
{
title: "状态",
dataIndex: "status",
key: "status",
ellipsis: true,
align: "center",
width: "100px",
customRender: ({ text }) => {
switch (text) {
case "1":
return <span>待提交</span>;
case "2":
return <span>审核中</span>;
case "3":
return <span>已完成</span>;
case "4":
return <span>审核失败</span>;
case "5":
return <span>待审核</span>;
default:
return <span>-</span>;
}
},
},
{
title: "是否为根节点",
dataIndex: "parentName",
key: "parentName",
align: "left",
width: "200px",
customRender: ({ text, record }) => {
return text ? (
<div>
<span style={{ marginRight: "10px" }}></span>({text})
</div>
) : (
<div>
<span style={{ marginRight: "10px" }}></span>(
{{ 1: "一", 2: "二", 3: "三" }[record.code]}级审批)
</div>
);
},
},
{
title: "担当",
dataIndex: "leaderName",
key: "leaderName",
ellipsis: true,
align: "left",
width: "200px",
customCell: () => {
return { style: { userSelect: "text" } };
},
},
// {
// title: '备注 ',
// dataIndex: 'remark',
// key: 'remark',
// ellipsis: true, align: "center",
// width: 160,
// },
{
title: "操作 ",
dataIndex: "operation",
key: "operation",
width: "120px",
align: "center",
fixed: "right",
scopedSlots: { customRender: "action" },
},
]);
const orgColumns = ref([
{
title: "组织名称",
dataIndex: "orgName",
key: "orgName",
ellipsis: true,
width: "20%",
align: "center",
},
{
title: "是否被培训发生组织选择",
dataIndex: "isSelect",
key: "isSelect",
ellipsis: true,
align: "center",
width: "30%",
customRender: (text) => {
return (
<div>
{text.record.isSelect == 1
? `是 (${text.record.affiliationName})`
: "否 (-)"}
</div>
);
},
},
{
title: "担当",
dataIndex: "leaders",
key: "leaders",
ellipsis: true,
align: "center",
width: "60%",
customRender: (text) => {
return <div>{text.record.leaders || "-"}</div>;
},
},
]);
//列表数据
const tableData = ref([]);
// List接口数据
const getTableDate = (obj) => {
state.tableLoading = true;
let objA = {
...state.searchParam ,
//TODO GX03
//审批未通过意外的数据
approvalType:1,
moduleType:1
};
if(objA.status == 0){
objA.approvalType = null; //全部数据
objA.status = null;
}
if(objA.status == 3){ //审核通过
objA.approvalType = 0;
}
queryTrainOrg(objA).then((res) => {
tableData.value = res.data.data.records;
state.tableDataTotal = Number(res.data.data.total);
state.tableLoading = false;
});
};
getTableDate();
// 搜索
const searchSubmit = () => {
state.searchParam.pageNo = 1;
getTableDate();
};
const searchList = (val) => {
getTableDate();
};
//重置
const searchReset = () => {
state.searchParam = {
name: null,
isParent: null,
leaderName: null,
pageNo: 1,
pageSize: 10,
};
getTableDate();
};
// // 翻页
const changePagination = (page, pageSize) => {
state.searchParam.pageNo = page;
// state.pageNo = page;
state.searchParam.pageSize = pageSize;
getTableDate();
};
const updateModal = (record) => {
dialog({
content: "是否确认删除 ?",
ok: () => {
lecturer
.affiliatRemoveById(record.id)
.then((res) => {
message.success("删除成功");
getTableDate();
})
.catch((err) => {
message.destroy();
message.error(err.data.msg);
});
},
});
};
//删除弹窗
const deleteModal = (record) => {
let contents = "";
(record.status == 1 || record.status == 4) &&
record.parentName &&
(contents = "是否确认进行删除?");
(record.status == 1 || record.status == 4) &&
!record.parentName &&
(contents = "是否确认进行删除?删除后关联的子节点将一并删除");
record.status == 2 && (contents = "该培训发生组织正在审核中,无法删除");
dialog({
content: contents || "是否确认进行删除?",
isCloseBtn: record.status == 2 ? false : true,
ok: () => {
lecturer
.affiliationDelById(record.id)
.then((res) => {
if (typeof res.data.data != "object") {
message.error(res.data.data);
return;
}
message.success("删除成功");
searchSubmit();
})
.catch((err) => {
message.destroy();
message.error(err.data.msg);
});
},
});
};
const isEnablePost = (record, status) => {
dialog({
content: `是否确认${!status ? "启用" : "停用"}该培训发生组织?`,
ok: () => {
lecturer
.isEnable({ id: record.id, status })
.then((res) => {
if (typeof res.data.data != "object") {
message.error(res.data.data);
return;
}
message.success(`${!status ? "启用" : "停用"}成功`);
searchSubmit();
})
.catch((err) => {
message.destroy();
message.error(err.data.msg);
});
},
});
};
//确认删除
const closeDeleteTeacher = () => {
//调用删除接口
deleteTrainOrg({ kid: state.delId }).then((res) => {
if (res.data.code == 200) {
// message.success("删除成功");
state.deleteInTeacherdialog = false;
searchSubmit();
}
});
};
//取消按钮 清空输入的数据
const cancelTeacherDialog = () => {
if ((state.teacherdialog = true)) {
formRef.value.resetFields();
state.teacherdialog = false;
}
cancel();
state.deleteInTeacherdialog = false;
state.editTeacher = false;
};
watch(
() => state.teacherdialog,
(val) => {
if (val) {
placeData();
} else {
state.editParams = true;
state.editIndex = 0;
}
}
);
const addTeacher = () => {
(state.teacherdialog = true), (state.formParam.locking = 0);
state.teacherdialogtitle = "新增培训发生组织";
state.vf = true;
lecturer
.getAffiliationCode()
.then((res) => {
state.formParam.affiliationCode = res.data.data;
})
.catch(() => {
message.error("获取培训发生组织编号失败");
});
};
const downOpen = () => {
window.open(
`/manageApi/admin/export/exportTeacherAffiliation?name=${
state.searchParam.name || ""
}&isParent=${state.searchParam.isParent || ""}&leaderName=${
state.searchParam.leaderName || ""
}`
);
};
const addContentData = () => {
state.showContent = true;
};
watch(
() => state.formParam,
(val) => {
if (!state.editParams) {
state.editIndex++;
}
},
{ deep: true }
);
//修改信息弹窗
const handleModify = (record) => {
lecturer.getAffiliationById(record.id).then((res) => {
res.data.data.status == 3 && (state.editParams = false);
state.formParam = res.data.data;
const actArray = res.data.data.affiliationUserList
.filter((item) => item.type == 0)
.reduce((accumulator, current) => {
if (!accumulator.some((item) => item.userId === current.userId)) {
accumulator.push(current);
}
return accumulator;
}, []);
const leveOneArray = res.data.data.affiliationUserList
.filter((item) => item.type == 1)
.reduce((accumulator, current) => {
if (!accumulator.some((item) => item.userId === current.userId)) {
accumulator.push(current);
}
return accumulator;
}, []);
const leveTwoArray = res.data.data.affiliationUserList
.filter((item) => item.type == 2)
.reduce((accumulator, current) => {
if (!accumulator.some((item) => item.userId === current.userId)) {
accumulator.push(current);
}
return accumulator;
}, []);
const leveThreeArray = res.data.data.affiliationUserList
.filter((item) => item.type == 3)
.reduce((accumulator, current) => {
if (!accumulator.some((item) => item.userId === current.userId)) {
accumulator.push(current);
}
return accumulator;
}, []);
state.formParam.actArray = actArray.map((item) => {
return {
label: item.userName + item.userNo,
value: item.userId,
realName: item.userName,
...item,
id: item.userId,
};
});
state.formParam.actValue = state.formParam.actArray
.map((item) => item.label)
.join(",");
state.formParam.leveOneArray = leveOneArray.map((item) => {
return {
label: item.userName + item.userNo,
value: item.userId,
realName: item.userName,
...item,
};
});
state.formParam.leveOneValue = state.formParam.leveOneArray
.map((item) => item.label)
.join(",");
state.formParam.leveTwoArray = leveTwoArray.map((item) => {
return {
label: item.userName + item.userNo,
value: item.userId,
realName: item.userName,
...item,
};
});
state.formParam.leveTwoValue =
state.formParam.leveTwoArray.map((item) => item.label).join(",") ||
null;
state.formParam.leveThreeArray = leveThreeArray.map((item) => {
return {
label: item.userName + item.userNo,
value: item.userId,
realName: item.userName,
...item,
};
});
state.formParam.leveThreeValue =
state.formParam.leveThreeArray.map((item) => item.label).join(",") ||
null;
state.formParam.orglistName = state.formParam.affiliationOrgList
?.map((item) => item.id)
.join(",");
state.formParam.selectOrgList?.map((item) => {
state.formParam.affiliationOrgList.some((item2) => {
if (item.orgId == item2.orgId) {
item2 = Object.assign(item2, item);
return true;
}
});
});
state.formParam.affiliationOrgLists =
state.formParam.affiliationOrgList;
state.formParam.isContains = String(state.formParam.isContains);
state.teacherdialog = true;
state.teacherdialogtitle = "编辑培训发生组织";
state.vf = false;
});
// TeacherSystem(record)
};
const TeacherSystem = (record) => {
state.formParam.affiliationCode = record.affiliationCode;
state.formParam.affiliationName = record.affiliationName;
state.formParam.remark = record.remark;
};
const cancel = () => {
state.formParam = {
orglistName: null,
affiliationCode: null,
affiliationName: null,
isParent: 1,
remark: null,
actValue: null,
actArray: [],
leveOneValue: null,
leveTwoValue: null,
leveThreeValue: null,
leveOneArray: [],
leveTwoArray: [],
leveThreeArray: [],
code: null,
isContains: "0",
affiliationOrgList: [],
affiliationOrgLists: [],
locking: 1,
};
};
async function validateField(name) {
return new Promise((resolve) => {
formRef.value
.validateFields([name])
.then(() => {
resolve(false);
})
.catch(() => {
resolve(true);
});
});
}
const valueChange = (val, type) => {
if (type == 0) {
state.formParam.actValue =
val?.map((item) => item.label).join(",") || null;
} else if (type == 1) {
state.formParam.leveOneValue =
val?.map((item) => item.label).join(",") || null;
} else if (type == 2) {
state.formParam.leveTwoValue =
val?.map((item) => item.label).join(",") || null;
} else if (type == 3) {
state.formParam.leveThreeValue =
val?.map((item) => item.label).join(",") || null;
}
};
//保存
const createTeacherDialog = async (val) => {
state.formParam.affiliationName = state.formParam.affiliationName?.trim();
state.formParam.affiliationUserList = [
...state.formParam?.actArray,
...state.formParam?.leveOneArray,
...state.formParam?.leveTwoArray,
...state.formParam?.leveThreeArray,
];
state.formParam.orglistName = state.formParam.affiliationOrgList
?.map((item) => item.id)
.join(",");
let formItemNames = Object.keys(rules);
if (state.formParam.isParent == 0) {
formItemNames = formItemNames.filter((item) => item != "leveOneValue");
} else {
formItemNames = formItemNames.filter((item) => item != "isContains");
}
for (let i = 0; i < formItemNames.length; i++) {
// const result = await validateField(formItemNames[i]);
const result = state.formParam[formItemNames[i]];
if (!result) {
if (formItemNames[i] == "code" && !state.formParam.isParent) {
return message.error(rules[formItemNames[i]][0].log2);
} else {
return message.error(rules[formItemNames[i]][0].log);
}
}
}
if (
!state.formParam.leveTwoValue &&
state.formParam.leveThreeValue &&
state.formParam.isParent
) {
return message.error("请选择二级审批人");
}
state.formParam.remark = state.formParam?.remark?.trim();
state.formParam.submitStatus = val;
dialog({
content: val
? "是否确认提交一旦提交将进入BPM系统审核流程。"
: "是否确认保存?",
ok: () => {
state.example = true;
if (state.vf == false) {
updateTrainOrg(state.formParam)
.then((res) => {
if (res.data.code == 200) {
message.success("修改成功");
cancel();
getTableDate();
} else {
message.error(res.data.msg);
}
state.teacherdialog = false;
state.example = false;
})
.catch((err) => {
message.destroy();
message.error(err.data.msg);
state.teacherdialog = false;
state.example = false;
cancel();
});
} else {
addReviewer(state.formParam)
.then((res) => {
message.success("保存成功");
state.teacherdialog = false;
cancel();
searchSubmit();
state.example = false;
})
.catch((err) => {
message.destroy();
message.error(err.data.msg);
state.teacherdialog = false;
cancel();
state.example = false;
});
}
},
});
};
const rules = {
affiliationCode: [
{ required: true, message: "", log: "请选择培训发生组织编号" },
],
affiliationName: [
{ required: true, message: "", log: "请选择培训发生组织名称" },
],
code: [
{
required: true,
message: "",
log: "请选择根节点",
log2: "请选择审批层级",
},
],
actValue: [{ required: true, message: "", log: "请选择组织担当" }],
leveOneValue: [{ required: true, message: "", log: "请选择一级审批人" }],
isContains: [
{ required: true, message: "", log: "请选择审批流程是否加担当" },
],
orglistName: [{ required: true, message: "", log: "请选择管理组织" }],
};
const TrainOrglist = ref([
{ label: "全部", value: "" },
{ label: "根节点", value: "0" },
{ label: "子节点", value: "1" },
]);
//回车
const enterPressHadlerSearch = (e) => {
if (e.keyCode === 13) {
searchSubmit();
}
};
return {
...toRefs(state),
enterPressHadlerSearch,
TrainOrglist,
rules,
formRef,
columns,
orgColumns,
tableData,
getTableDate,
searchSubmit,
selectRadio,
PlaceOfPayList,
isConSelect,
PlaceOfPayListTwo,
placeData,
searchReset,
searchList,
deleteModal,
isEnablePost,
updateModal,
cancelTeacherDialog,
addTeacher,
downOpen,
addContentData,
handleModify,
closeDeleteTeacher,
changePagination,
TeacherSystem,
createTeacherDialog,
valueChange,
validateField,
checkMenu,
};
},
};
</script>
<style lang="scss" scoped>
.example {
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.45);
position: fixed;
top: 0;
left: 0;
z-index: 999999;
display: flex;
justify-content: center;
align-items: center;
}
.headers {
height: 73px;
border-bottom: 1px solid #e8e8e8;
display: flex;
justify-content: space-between;
align-items: center;
// background-color: red;
margin-bottom: 20px;
.headerTitle {
font-size: 18px;
font-weight: 600;
color: #333333;
line-height: 25px;
// margin-left: 24px;
}
}
.tableBox {
padding-bottom: 20px;
margin: 20px 38px 30px;
::v-deep .ant-select-dropdown {
display: inline-block;
}
::v-deep .ant-select-selection-item {
margin-left: 3px;
}
::v-deep .ant-pagination-options-size-changer.ant-select {
width: 84px;
}
.pa {
width: 100%;
display: flex;
justify-content: right;
}
}
.add_content {
width: 40px;
height: 40px;
cursor: pointer;
border-radius: 50%;
background-color: #4ea6ff;
text-align: center;
line-height: 40px;
color: #ffffff;
font-size: 26px;
}
//导出按钮icon
.daochu {
width: 16px;
height: 18px;
background-image: url("../../assets/images/coursewareManage/export1.png");
}
//弹窗内详情样式
.display1 {
display: inline-block;
width: 200px;
}
// .display0{
// display:inline-block ;
// width:200px ;
// text-align:center }
//弹窗内确认取消按钮布局
.del_btnbox {
display: flex;
margin: 30px auto;
justify-content: center;
.del_btn {
width: 100px;
height: 40px;
background: rgba(64, 158, 255, 0);
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
cursor: pointer;
.btnText {
font-size: 14px;
font-weight: 400;
line-height: 40px;
}
}
.btn1 {
border: 1px solid rgba(64, 158, 255, 1);
color: #4ea6ff;
margin-right: 14px;
}
.btn2 {
background-color: #4ea6ff;
color: #ffffff;
}
}
.ant-table-cell-fix-right {
width: 300px !important;
}
.ant-table-tbody > tr > td {
text-align: center;
}
.InsideLecturer {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
position: relative;
.filter {
margin-left: 38px;
margin-right: 38px;
margin-top: 30px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.select {
margin-right: 20px;
margin-bottom: 20px;
}
}
}
.delete {
z-index: 9999;
width: 424px;
background: #ffffff;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
border-radius: 4px;
position: absolute;
left: 30%;
top: 10%;
// transform: translate(-50%, -50%);
.del_header {
position: absolute;
width: calc(100%);
height: 40px;
background: linear-gradient(
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
}
.del_main {
width: 100%;
position: relative;
.header {
display: flex;
align-items: center;
padding-top: 20px;
padding-left: 26px;
font-size: 16px;
.del-icon {
width: 16px;
height: 16px;
margin-right: 10px;
background-image: url(@/assets/images/coursewareManage/notice.png);
background-size: 100% 100%;
}
.icon {
width: 16px;
height: 16px;
margin-right: 10px;
background-image: url(@/assets/images/coursewareManage/QR.png);
background-size: 100% 100%;
}
.close_exit {
position: absolute;
right: 42px;
cursor: pointer;
width: 20px;
height: 20px;
background-image: url(@/assets/images/coursewareManage/close.png);
background-size: 100% 100%;
}
}
.body {
width: 100%;
margin: 34px auto 56px auto;
display: flex;
justify-content: center;
align-items: center;
}
.del_btnbox {
display: flex;
margin: 30px auto;
justify-content: center;
.del_btn {
width: 100px;
height: 40px;
background: rgba(64, 158, 255, 0);
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
.btnText {
font-size: 14px;
font-weight: 400;
line-height: 40px;
}
}
.btn1 {
border: 1px solid rgba(64, 158, 255, 1);
color: #4ea6ff;
}
.btn2 {
background-color: #4ea6ff;
color: #ffffff;
}
}
}
}
.CreatePath {
.out {
z-index: 9999;
display: block;
position: absolute;
top: 90px;
width: 1080px !important;
height: 650px;
overflow: auto;
background-color: #fff;
box-shadow: 0 0 10px rgba(118, 136, 166, 0.21);
left: 50%;
top: 300px;
transform: translate(-50%, -50%);
.top {
width: 100%;
height: 68px;
background: linear-gradient(
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
display: flex;
align-items: center;
.topimg {
width: 18px;
height: 18px;
margin-left: 27px;
margin-top: -2px;
}
.topc {
color: #000000;
font-size: 16px;
margin-left: 8px;
}
}
.mid {
width: 100%;
height: 100%;
background-color: #fff;
display: flex;
flex-direction: column;
align-items: center;
.d {
// margin-top: 8px;
// color: #ff4e4e;
margin-left: -5px;
}
}
}
}
// 重置样式
.resetbtn {
width: 100px;
height: 40px;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
.search {
width: 15px;
height: 16px;
margin-right: 5px;
background: url("../../assets/images/courseManage/add0.png") no-repeat;
background-size: 100% 100%;
}
}
.btnn {
padding: 0px 26px 0px 26px;
height: 40px;
background: #1890ff;
border-radius: 8px;
border: 1px solid #1890ff;
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
.btnText {
font-size: 14px;
font-weight: 400;
color: #fff;
line-height: 36px;
margin-left: 5px;
}
.daochu {
width: 16px;
height: 18px;
background-image: url("../../assets/images/coursewareManage/export1.png");
}
}
//展开收起样式
.moreidbtn {
border: none;
color: #4ea6ff;
width: 80px;
}
//小竖线
.line {
float: left;
width: 3px;
height: 25px;
background: #4ea6ff;
border-radius: 30%;
margin-right: 5px;
}
//抽屉功能
.drawaer
/* 改变所有 a-tree-select 输入框的高度 */
.ant-tree-select .ant-select-selection {
height: 40px;
line-height: 40px;
/* 确保文字垂直居中 */
}
.draitem {
width: 100%;
height: 40px !important;
border-radius: 8px;
line-height: 40px;
}
.drabtn {
height: 40px;
width: 80px;
border-radius: 8px;
margin-right: 20px;
}
::v-deep .ant-select:not(.ant-select-customize-input) .ant-select-selector {
border-radius: 8px;
height: 40px;
line-height: 40px;
text-align: left;
}
.ant-col-12 {
height: 90px;
}
.item_inp {
flex: 1;
text-align: center;
.i_upload_img {
width: 100px;
height: 100px;
border-radius: 8px;
}
.i_upload {
width: 100px;
height: 100px;
border: 1px solid #4ea6ff;
border-radius: 50%;
text-align: center;
align-items: center;
cursor: pointer;
.addimg {
position: relative;
.heng {
position: absolute;
top: 50px;
left: 25px;
width: 50px;
border: 1px solid #4ea6ff;
}
.shu {
position: absolute;
top: 25px;
left: 50px;
height: 50px;
border: 1px solid #4ea6ff;
}
}
}
.ant-upload.ant-upload-select-picture-card {
border: 0px !important;
border-radius: 50% !important;
}
}
.ant-upload.ant-upload-select-picture-card {
border: 0px !important;
border-radius: 50% !important;
}
</style>