Files
fe-manage/src/views/lecturer/LecturerApproval.vue
2024-10-22 08:48:38 +08:00

1113 lines
33 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 >
<!-- 搜索框及按钮 -->
<div class="filter" >
<a-form layout="inline" style="min-width: 1380px;">
<a-form-item class="select">
<a-select style="width: 276px" v-model:value="searchParam.trainorgId" placeholder="培训发生组织" allowClear
:options="trainOrglist">
</a-select>
</a-form-item>
<a-form-item class="select ">
<div class="select addTimeBox">
<div class="addTime" >创建时间</div>
<a-range-picker
v-model:value="searchdate"
style="width: 420px"
format="YYYY-MM-DD"
valueFormat="YYYY-MM-DD"
separator="至"
:placeholder="[' 开始时间', ' 结束时间']"
/>
</div>
</a-form-item>
<a-form-item class="select">
<a-select style="width: 230px ;margin-bottom:20px" v-model:value="searchParam.status" placeholder="请选择状态" allowClear
:options="AuthenticationStatusList">
</a-select>
</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 v-if="moreid == 1">
<a-button @click="handlemoreid()" class="moreidbtn" type="text"> 展开
<RightOutlined />
</a-button>
</div>
<div v-if="moreid == 2">
<a-button @click="handlemoreid()" class="moreidbtn"> 返回
<UpOutlined />
</a-button>
</div> -->
</div>
<!-- <div style="width:100%"></div> -->
<!-- <a-form-item class="select" v-if="moreid == 2">
<a-select style="width: 230px ;margin-bottom:20px" v-model:value="searchParam.courseType" placeholder="请选择费用类型" allowClear
:options="courseTypeList">
</a-select>
</a-form-item>
<a-form-item class="select" v-if="moreid == 2">
<a-select style="width: 230px ;margin-bottom:20px" v-model:value="searchParam.type" placeholder="请选择课程类型" allowClear
:options="OnTheJobStatusList">
</a-select>
</a-form-item>
<a-form-item class="select" v-if="moreid == 2">
<a-select style="width: 230px ;margin-bottom:20px" v-model:value="searchParam.status" placeholder="请选择状态" allowClear
:options="AuthenticationStatusList">
</a-select>
</a-form-item>
<a-form-item class="select" v-if="moreid == 2">
<a-select style="width: 230px ;margin-bottom:20px" placeholder="请选择讲师体系" v-model:value="searchParam.kid" allowClear
:options="lecturerSystemList" @change="changetlevel">
</a-select>
</a-form-item>
<a-form-item class="select" v-if="moreid == 2">
<a-select style="width: 230px ;margin-bottom:10px" v-model:value="searchParam.levelId" placeholder="请选择讲师级别" allowClear :disabled="getLevelList.length!==0 ? false:true"
:options="getLevelList">
</a-select>
</a-form-item> -->
</a-form>
<!-- <div style="width: 100%;"></div>
<div style="display: flex; margin-bottom: 20px">
<a-button @click="handleExport()" class="resetbtn">
<UploadOutlined /> 导出
</a-button>
<div v-if="moreid == 2" style="line-height: 40px;" >当前页面汇总金额:<span style="line-height: 40px; font-size: 24px; color: rgb(207, 34, 34) ;font-weight: 600;">1,230,490</span>元 当前总汇总金额:<span style="line-height: 40px; font-size: 24px; color: rgb(207, 34, 34) ;font-weight: 600;">9,230,490</span></div>
</div> -->
<!-- 表格 -->
<div style="padding: 10px 0">
<a-table :header-cell-style="{ 'text-align': 'center' }" 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 >
<a-button type="link" @click="() => handleLook(record, String(record.courseform))">查看</a-button>
<a-button type="link" @click="() => handleOperate(record, String(record.courseform))">审批</a-button>
<!-- <a-button type="link" @click="() => deleteModal(record, String(record.courseform))">删除</a-button> -->
</a-space>
</template>
</template>
</a-table>
</div>
</div>
<div class="tableBox ">
<div style="float: right;">
<a-pagination
v-if="tableDataTotal > 10"
:showSizeChanger="false"
:showQuickJumper="true"
:hideOnSinglePage="true"
:pageSize="searchParam.pageSize"
:current="searchParam.pageNo"
:total="tableDataTotal"
class="pagination"
@change="changePagination"
/>
</div>
</div>
<!-- 弹窗组件 -->
<!--查看讲师费详情 -->
<a-drawer v-model:visible="teachingdialog" placement="right"
@closa="cancelTeachingDialog" :maskClosable="true" width="60%" title="查看讲师费用">
<span class="line"></span>
<span>讲师费用详情</span>
<a-descriptions bordered :column="2" :contentStyle="rowCenter" :labelStyle="rowCenter">
<a-descriptions-item label="审批编号(未命名)">{{formParam.teacherName}}</a-descriptions-item>
<a-descriptions-item label="培训发生组织">{{formParam.trainOrg}}</a-descriptions-item>
<a-descriptions-item label="汇总周期" >{{formParam.summaryDate}}</a-descriptions-item>
<a-descriptions-item label="汇总金额">{{formParam.totalFee}}</a-descriptions-item>
<a-descriptions-item label="'提交时间(未命名)'">{{formParam.payableExpense}}</a-descriptions-item>
<a-descriptions-item label="状态">{{formParam.status=="A10"?'待审核' :formParam.status=="A20"?'已提交':formParam.status== "A30" ?'审核中':formParam.status== "E10" ?'审核打回':formParam.status=="S20"?'审核通过':''}}</a-descriptions-item>
</a-descriptions>
<span class="line"></span>
<span>审批详情</span>
<div style="padding: 10px 0">
<a-table :header-cell-style="{ 'text-align': 'center' }" style="border: 1px solid #f2f6fe" :columns="columnsExamine"
:data-source="tableDataExamine" :loading="examinetableLoading" @expand="expandTable" :pagination="false">
<template #bodyCell="{ record, column }">
</template>
</a-table>
</div>
<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="cancelTeachingDialog">取消</a-button>
<a-button class="drabtn" type="primary" @click="cancelTeachingDialog" :loading="buttonLoading">提交讲师费
</a-button>
<!-- <a-button class="drabtn" @click="cancelTeachingDialog" type="primary" danger>拒绝</a-button> -->
</div>
</a-drawer>
<!-- 修改状态功能弹窗 -->
<div>
<a-modal v-model:visible="editTeacher" :footer="null" :closable="close" wrapClassName=""
centered="true">
<div class="delete" style="width:500px">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon1"></div>
<span>提示</span>
</div>
<a-form style="margin-left:20px; margin-top:10px ">
<a-form-item label="审批" >
<a-radio-group v-model:value="formParamstatues.status">
<a-radio value="S20">同意</a-radio>
<a-radio value="E10">拒绝</a-radio>
</a-radio-group>
</a-form-item>
<a-form-item label="备注">
<a-textarea v-model:value="formParamstatues.remark"
style="width: 90%; height: 100px; border-radius: 8px ;" placeholder="一旦拒绝 备注变为必填" />
</a-form-item>
</a-form>
<div class="del_btnbox">
<div class="del_btn btn2" @click="cancelTeachingDialog" style="margin-right: 32px">
<div class="btnText">取消</div>
</div>
<div class="del_btn btn2" @click="closehandleOperate">
<div class="btnText">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
</div>
<!-- <div> <Upload/> </div> -->
</div>
</template>
<script lang="jsx">
import { reactive, toRefs, ref ,watch} from "vue";
import { message } from "ant-design-vue";
import dayjs from "dayjs";
import {
RightOutlined,
UpOutlined,
UploadOutlined,
FolderAddOutlined,
DownloadOutlined
} from '@ant-design/icons-vue';
import ProjectManager from "@/components/project/ProjectManagerNew";
import {getPayRollPlace} from "../../api/Lecturer";
import {expenseBillList,queryById,getTeacherFeeApprovalList ,updateTeacherFee,updateStatusSubmit,approveTeacherFee,getTrainOrg,getTeacherLevel} from "../../api/lecturerFeeManagement";
import { getTeacherExpertise,getTeacherSystemList } from "../../api/Lecturer";
// lecturerFeeManagement
// import {getProjSt} from "../../api/indexProjStu";
// import AddTeacher from "../../components/drawers/project/AddTeacher"
export default {
name: "LecturerApproval",
components: {
RightOutlined, //图标--展开
UpOutlined,//图标--收起
UploadOutlined,//图标--导出
DownloadOutlined,//图标-导入
FolderAddOutlined,//图标--新增
ProjectManager,
},
setup() {
const state = reactive({
moreid:1,
byPid:null,
currentPage1: 1,
pageSize1: 10,
promotionrecordsLoading:false , //晋级记录遮罩层
teacherrecordsLoading:false,// 授课记录遮罩层
tableLoading:false,
examinetableLoading:false,
tagsshow:"1",
delTeacherId:null, //删除id确认
newStatus:null , //修改状态码确认
id:null, //内部讲师工号确认
lookTeacherId:null, //内部讲师详情id确认
// deleteInTeacherdialog: false, //删除弹窗
editTeacher:false , //修改状态弹窗
handleOperate1:null, //修改状态弹窗内容
teacherdialog1: null,
teachingdialog: false, //控制讲师弹窗
teacherdialogtitle: '',//讲师弹框title内容
pageSizeOptions: ['10', '20', '30', '50'], //下拉选择每页显示多少条
pageSize: 10,
tableDataTotal: -1,//table列表总条数
formParam: {
beginTime:null ,
defaultTeachingTime:"0",
},
formParamstatues:{
status:'S20',
remark: null,
id:null,
},
searchdate: null, //选择时间
searchParam: {
teacherNo:null,
teacherName:null,
trainorgId:null,
id:null,
levelId:null,
courseType:null,
certStatus:null,
salaryName:null,
payrollPlaceId:null,
status:null,
pageNo: "1",
pageSize: "10",
beginTime: null,
endTime: null,
},
})
//费用类型
const courseTypeList=ref([
{ value: 1, label: "课程开发" },
{ value: 2, label: "作业人员入模培训" },
{ value: 3, label: "其他" },
])
//获取内容分类
const getTeacherExpertiseList = ref([
// { value: 0, label: "未定级" },
])
const getTeacherExpertiseLista = () => {
getTeacherExpertise().then((res) => {
if (res.data.code === 200) {
let arr = res.data.data;
let array = [];
arr.map((value) => {
let obj = {
value: value.id,
label: value.name,
};
array.push(obj);
});
getTeacherExpertiseList.value = array;
}
})
}
getTeacherExpertiseLista()
const lecturerSystemList = ref([
]);
///获取讲师体系列表
const LecturerSystemLista =() => {
// console.log('点击了LecturerSystemLista')
getTeacherSystemList().then((res) => {
if (res.data.code === 200) {
let arr = res.data.data;
let array = [];
arr.map((value) => {
let obj = {
value: value.kid,
label: value.systemName,
};
array.push(obj);
});
lecturerSystemList.value = array;
}
})
}
LecturerSystemLista()
const trainOrglist=ref([])
//获取培训发生组织
const trainOrglista =() => {
getTrainOrg().then((res)=>{
if (res.data.code === 200) {
let arr = res.data.data;
let array = [];
arr.map((value) => {
let obj = {
value: value.trainorgId,
label: value.trainOrg,
};
array.push(obj);
});
trainOrglist.value = array;
}
})
}
trainOrglista()
//获取讲师级别
const getLevelList = ref([
])
const getLevelLista =() => {
getTeacherLevel().then((res)=>{
if (res.data.code === 200) {
let arr = res.data.data;
let array = getLevelList.value;
arr.map((value) => {
let obj = {
value: value.levelId,
label: value.levelName,
};
array.push(obj);
});
getLevelList.value = array;
}
})
}
getLevelLista()
//课程类型
const OnTheJobStatusList = ref([
{ value: 1, label: "项目开课" },
{ value: 2, label: "路径开课" },
{ value: 3, label: "面授开课" },
])
//认证状态
const AuthenticationStatusList = ref([
{ value: 0, label: "未认证" },
{ value: 1, label: "已认证" },
])
//获取讲师发薪地列表
const PlaceOfPayList = ref([
// { value: 0, label: "发薪地B1" },
])
const PlaceOfPayLista =() => {
getPayRollPlace().then((res)=>{
if (res.data.code === 200) {
let arr = res.data.data;
let array = [];
arr.map((value) => {
let obj = {
value: value.id,
label: value.name,
};
array.push(obj);
});
PlaceOfPayList.value = array;
}
console.log("获取发薪地", PlaceOfPayList);
})
}
PlaceOfPayLista()
//状态
const AccountStatusList = ref([
{ value:"A10", label: "待审核", },
{ value:"A20", label: "已提交", },
{ value:"A30", label: "审核中", },
{ value:"E10", label: "审核打回", },
{ value:"S20", label: "审核通过", },
])
watch(
)
//切换筛选
const handlemoreid=()=>{
if(state.moreid==1){
state.moreid=2
}
else if(state.moreid == 2){
state.moreid=1
state.searchParam.certStatus=null
state.searchParam.salaryName=null
state.searchParam.payrollPlaceId=null
state.searchParam.status=null
}
}
//新增页面内部姓名
const infoteacherList = ref([
// { value: 0, systemName: "讲师体系" },
]);
const getinfoteacher = () => {
// state.tableLoading=true
// ()
// .then((res) => {
// infoteacherList.value = res.data.data.records
// })
};
const columns = ref([
{
title: '培训发生组织 ',
dataIndex: 'trainOrg',
key: 'trainOrg',
elipsis: true, align: "center",
width: 120,
},
{
title: '汇总周期 ',
dataIndex: 'summaryDate',
key: 'summaryDate',
elipsis: true,
align: "center",
width:300
},
{
title: '汇总金额 ',
dataIndex: 'totalFee',
key: 'totalFee',
elipsis: true,
align: "center",
width: 200,
},
{
title: '提交时间(未命名)',
dataIndex: 'trainOrg',
key: 'trainOrg',
elipsis: true, align: "center",
width: 120,
},
{
title: '状态 ',
dataIndex: 'status',
key: 'status',
elipsis: true,
align: "center",
width: 120,
customRender: (value) => {
return (
<div>
{value.record.status == "A10" || value.record.status == "A20" ||value.record.status == "A30" ||value.record.status == "E10"||value.record.status == "S20"
? {
"A10": "待审核",
"A20": "已提交",
"A30": "审核中",
"E10": "审核打回",
"S20": "审核通过",
}[value.record.status + ""] || ""
: "-"}
</div>
)
}
},
{
title: '操作 ',
dataIndex: 'operation',
key: 'operation',
elipsis: true, align: "right",
fixed: "right",
width: 400,
scopedSlots: { customRender: "action" },
},
])
//列表数据
const tableData = ref([
])
// 搜索
const searchSubmit = () => {
getTableDate();
};
//重置
const searchReset = () => {
state.searchdate= null,
state.searchParam = {
endTime:null,
beginTime:null,
teacherNo:null,
id:null,
levelId:null,
courseType:null,
certStatus:null,
salaryName:null,
payrollPlaceId:null,
status:null,
pageNo: 1,
pageSize: 10 ,
};
getTableDate();
};
// //修改时间
// function searchTimeChange(time, timeStr) {
// let startTime = timeStr[0]
// let endTime = timeStr[1] ;
// state.startTime = new Date(startTime).getTime();
// state.endTime = new Date(endTime).getTime();
// // state.searchParam.beginTime = new Date(beginTime).getTime() ;
// // state.searchParam.endTime = new Date(endTime).getTime() ;
// state.searchParam.beginTime = state.startTime ? state.startTime : null,
// state.searchParam.endTime = state.endTime ? state.endTime : null
// }
// List接口数据
const getTableDate = (obj) => {
state.tableLoading=true
let objA = { ...state.searchParam };
objA.beginTime = state.searchdate ? dayjs(state.searchdate[0]).format("YYYY-MM-DD") : "",
objA.endTime = state.searchdate ? dayjs(state.searchdate[1]).format("YYYY-MM-DD") : "",
expenseBillList(objA)
.then((res) => {
tableData.value = res.data.data.records
state.tableDataTotal = Number(res.data.data.total);
state.tableLoading=false
console.log("获取讲师tableData", tableData);
})
};
getTableDate()
// // 翻页
const changePagination = (page,pageSize) => {
state.searchParam.pageNo = page;
state.currentPage1 = page;
state.pageSize1 = pageSize;
getTableDate();
};
// 新增讲师
const addTeacher = () => {
state.teachingdialog = true;
state.teacherdialogtitle = '添加讲师费'
}
//修改状态窗口
const handleOperate = (record) => {
state.editTeacher = true
state.formParamstatues.id= record.id
};
//提交
const closehandleOperate= ()=>{
approveTeacherFee(state.formParamstatues).then((res) => {
message.success("审批成功");
state.editTeacher = false
getTableDate();
})
}
//取消按钮 清空输入的数据
const cancelTeachingDialog = () => {
if(state.teachingdialog = true )
{
state.teachingdialog = false
cancel()
}
state.deleteInTeacherdialog = false
state.editTeacher = false
};
//清空数据
const cancel = () => {
state.formParam ={
teacher:null,
teacherNo:null,
departId:null,
id:null,
courseName:0,
levelId:null,
payrollPlaceId:null,
// 费用类型 : null
teacherpayrollPlace:null,
teachingDate:null,
defaultTeachingTime:0,
courseType:null,
studys:null,
teacherlevelPay:null,
score:null,
trainOrg:null,
payableExpense:null,
expense:null,
remark:null,
}
}
//表格内查看数据操作
const handleLook = (record) => {
state.teachingdialog = true;
state.id= record.id
TeacherSystem()
gettableDataExamine( )
}
//详情
const TeacherSystem=()=>{
queryById({id : state.id}).then((res) => {
// state.formParam=Object.assign({} ,res.data.data)
state.formParam=res.data.data
console.log( state.formParam)
})
.catch((err) => {
console.log("详情", err);
});
}
const tableDataExamine = ref([
])
const gettableDataExamine = () => {
getTeacherFeeApprovalList({id : state.id})
.then((res) => {
tableDataExamine.value = res.data.data.records
})
};
//二级页面
const columnsExamine = ref([
{
title: '审批人 ',
dataIndex: 'teacherName',
key: 'teacherName',
elipsis: true, align: "center",
width: 120,
},
{
title: '审批状态 ',
dataIndex: 'status',
key: 'status',
elipsis: true, align: "center",
width: 120,
customRender: (value) => {
return (
<div>
{value.record.status == "A10" || value.record.status == "A20" ||value.record.status == "A30" ||value.record.status == "E10"||value.record.status == "S20"
? {
"A10": "待审核",
"A20": "已提交",
"A30": "审核中",
"E10": "审核打回",
"S20": "审核通过",
}[value.record.status + ""] || ""
: "-"}
</div>
)
}
},
{
title: '审批时间 ',
dataIndex: 'teacherName',
key: 'teacherName',
elipsis: true, align: "center",
width: 120,
},
{
title: '备注 ',
dataIndex: 'remark',
key: 'remark',
elipsis: true, align: "center",
width: 120,
},
])
function managerChange(e, l, d, t, orgName) {
console.log(e, l);
state.searchParam.teacherNo = d;
state.searchParam.teacherName = t;
// state.searchParam.trainorgName=orgName
}
//导出功能
const handleExport = ()=>{
window.open (
`${process.env.VUE_APP_BASE_API}/teacher/fee/exportTeacherFee?pageNo=${
state.currentPage1
}&pageSize=${state.pageSize1}&teacherNo=${
state.searchParam.teacherNo ? state.searchParam.teacherNo : ""
}&tsystemName=${ state.searchParam.tsystemName ? state.searchParam.tsystemName : ""}&levelId=${
state.searchParam.levelId ? state.searchParam.levelId : ""
}&courseType=${ state.searchParam.courseType ? state.searchParam.courseType : ""}&certStatus=${
state.searchParam.certStatus ? state.searchParam.certStatus : ""
}&salaryName=${state.searchParam.salaryName ? state.searchParam.salaryName : ""}&payrollPlaceId=${state.searchParam.payrollPlaceId ? state.searchParam.payrollPlaceId : ""}&status=${state.searchParam.status ? state.searchParam.status : ""}&beginTime=${state.searchParam.beginTime ? state.searchParam.beginTime : ""}&endTime=${state.searchParam.endTime ? state.searchParam.endTime : ""}`
);
// this.download('lesson_records/export', {
// ...state.searchParam
// }, `project_${new Date().getTime()}.xlsx` )
}
return {
...toRefs(state),
// searchTimeChange,
gettableDataExamine,
courseTypeList,
managerChange,
trainOrglist,
trainOrglista,
getTeacherExpertiseList,
getTeacherExpertiseLista,
handlemoreid,
handleExport,
lecturerSystemList,
getLevelList,
OnTheJobStatusList,
getLevelLista,
PlaceOfPayLista,
AuthenticationStatusList,
PlaceOfPayList,
AccountStatusList,
searchSubmit,
searchReset,
columns,
columnsExamine,
tableData,
tableDataExamine,
changePagination,
addTeacher,
cancelTeachingDialog,
handleLook,
cancel,
handleOperate,
closehandleOperate,
getTableDate, //list接口数据调用
// getStu
LecturerSystemLista,
TeacherSystem,
infoteacherList,
getinfoteacher,
}
},
};
</script>
<style lang="scss" scoped >
.select .ant-picker {
width: 410px !important;
}
.addTimeBox {
position: relative;
display: flex;
align-items: center;
.addTime {
position: absolute;
z-index: 1;
margin-left: 10px;
color: rgba(0, 0, 0, 0.4);
}
.ant-picker {
padding-left: 85px;
}
::v-deep .ant-picker-range .ant-picker-active-bar {
margin-left: 85px !important;
}
}
//导出按钮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;
}
.InsideTeaching {
width: 100%;
height: 100%;
.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: 10px;
}
}
}
.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;
}
}
}
}
//添加样式
.langbtn {
height: 40px;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
}
// 重置样式
.resetbtn {
width: 100px;
height: 40px;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
}
//展开收起样式
.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 输入框的高度 */
// ::v-deep .ant-select:not(.ant-select-customize-input) .ant-select-selector{
// height: 40px;
// line-height: 40px;
// border-radius: 8px
// /* 确保文字垂直居中 */
// }
::v-deep .ant-select-single:not(.ant-select-customize-input) .ant-select-selector{
height: 40px !important;
line-height: 40px;
border-radius: 8px
}
// 抽屉内样式
.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;
}
.ant-col-12{
height:90px;
}
::v-deep .ant-select-selection-overflow-item {
margin-top: -2px;
}
::v-deep .ant-select-multiple .ant-select-selection-item {
height: 34px
}
.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;
}
}
</style>