mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-24 02:02:55 +08:00
1226 lines
37 KiB
Vue
1226 lines
37 KiB
Vue
<!-- 内部授课页面 -->
|
|
<template>
|
|
<div >
|
|
<div class="tableBox ">
|
|
<a-table :header-cell-style="{ 'text-align': 'center' }" style="border: 1px solid #f2f6fe" :columns="columns"
|
|
:scroll="{ x: 100 }"
|
|
:data-source="tableData"
|
|
:loading="tableLoading"
|
|
@expand="expandTable"
|
|
:pagination="false">
|
|
<template #bodyCell="{ record, column }">
|
|
<template v-if="column.key === 'operation'">
|
|
<a-space style="display:flex ;justify-content: space-around; ">
|
|
<a-button type="link" @click="() => handleLook(record, String(record.courseform))">查看</a-button>
|
|
<a-button type="link" @click="() => handleModify(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 class="tableBox ">
|
|
<div style="float: right;">
|
|
<a-pagination v-if="tableDataTotal > 10" :showSizeChanger="true" :hideOnSinglePage="true" :pageSize="pageSize"
|
|
v-model:current="searchParam.pageNo" :total="tableDataTotal" class="pagination" @change="changePagination" />
|
|
</div>
|
|
</div>
|
|
<!-- 搜索框及按钮 -->
|
|
<div class="filter">
|
|
<a-form layout="inline" style="min-width: 1380px;">
|
|
<a-form-item class="select">
|
|
<!-- v-model:value="searchParam.name" -->
|
|
<a-input v-model:value="searchParam.userNo" style="width: 276px; height: 40px; border-radius: 8px"
|
|
placeholder="请输入工号/讲师姓名进行检索" allowClear showSearch>
|
|
</a-input>
|
|
|
|
<!-- <a-select style="width: 276px" placeholder="请选择所属组织" v-model:value="searchParam.userNo"
|
|
:options="infoteacherList">
|
|
</a-select> -->
|
|
</a-form-item>
|
|
<a-form-item class="select">
|
|
<a-input v-model:value="searchParam.teacherNo" style="width: 260px; height: 40px; border-radius: 8px"
|
|
placeholder="请输入课程名称进行搜索" allowClear showSearch>
|
|
</a-input>
|
|
</a-form-item>
|
|
<a-form-item class="select ">
|
|
<a-range-picker style="width: 260px; height: 40px; border-radius: 8px" v-model:value="searchdate" separator="至"
|
|
:placeholder="[' 开始时间', ' 结束时间']" @change="searchTimeChange" />
|
|
</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.type" placeholder="录入类型"
|
|
:options="OnTheJobStatusList">
|
|
</a-select>
|
|
</a-form-item>
|
|
<a-form-item class="select" v-if="moreid == 2">
|
|
<a-select style="width: 230px" v-model:value="searchParam.status" placeholder="开课状态"
|
|
:options="AuthenticationStatusList">
|
|
</a-select>
|
|
</a-form-item>
|
|
<a-form-item class="select" v-if="moreid == 2">
|
|
<a-select style="width: 230px" placeholder="请选择所属组织" v-model:value="searchParam.departId"
|
|
:options="getOrganizationList">
|
|
</a-select>
|
|
</a-form-item>
|
|
<a-form-item class="select" v-if="moreid == 2">
|
|
<a-select style="width: 230px" placeholder="请选择讲师体系" v-model:value="searchParam.systemId"
|
|
:options="LecturerSystemList">
|
|
</a-select>
|
|
</a-form-item>
|
|
<a-form-item class="select" v-if="moreid == 2">
|
|
<a-select style="width: 230px" v-model:value="searchParam.tlevelName" placeholder="内容分类"
|
|
:options="getTeacherExpertiseList">
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-form>
|
|
<div style="width: 100%;"></div>
|
|
<div style="display: flex; margin-bottom: 20px">
|
|
<a-button @click="addTeacher()" type="primary" class="langbtn">
|
|
<FolderAddOutlined /> 添加授课记录
|
|
</a-button>
|
|
<!-- <div style="margin-left: 20px ;">
|
|
<a-button @click="addTeacher()" class="langbtn">
|
|
<UploadOutlined /> 一键生成讲师费
|
|
</a-button>
|
|
</div> -->
|
|
<a-button @click="handleExport()" class="resetbtn">
|
|
<DownloadOutlined /> 导入
|
|
</a-button>
|
|
<a-button @click="handleExport()" class="resetbtn">
|
|
<UploadOutlined /> 导出
|
|
</a-button>
|
|
</div>
|
|
</div>
|
|
<!-- 表格 -->
|
|
<div class="tableBox ">
|
|
<a-table :header-cell-style="{ 'text-align': 'center' }" style="border: 1px solid #f2f6fe" :columns="columns"
|
|
:scroll="{ x: 1300 }"
|
|
:data-source="tableData"
|
|
:loading="tableLoading"
|
|
@expand="expandTable"
|
|
:pagination="false">
|
|
<template #bodyCell="{ record, column }">
|
|
<template v-if="column.key === 'operation'">
|
|
<a-space style="display:flex ;justify-content: space-around; ">
|
|
<a-button type="link" @click="() => handleLook(record, String(record.courseform))">查看</a-button>
|
|
<a-button type="link" @click="() => handleModify(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 class="tableBox ">
|
|
<div style="float: right;">
|
|
<a-pagination v-if="tableDataTotal > 10" :showSizeChanger="true" :hideOnSinglePage="true" :pageSize="pageSize"
|
|
v-model:current="searchParam.pageNo" :total="tableDataTotal" class="pagination" @change="changePagination" />
|
|
</div>
|
|
</div>
|
|
<!-- 弹窗组件 -->
|
|
<a-drawer v-model:visible="teacherdialog" placement="right" @closa="cancelTeacherDialog" :maskClosable="true" dropdown-style="drawaer"
|
|
width="60%" :title="teacherdialogtitle">
|
|
<a-form :model="formParam" :rules="rules" layout="vertical">
|
|
<!-- 讲师姓名 name 组织 departId-->
|
|
<a-row :gutter="16">
|
|
<a-col :span="12">
|
|
<a-form-item label="讲师名称" name="teacher">
|
|
<a-tree-select v-model:value="formParam.teacher" tree-data-simple-mode
|
|
class="draitem"
|
|
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }" :tree-data="treeData" placeholder="请输入讲师名称" />
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-item label="讲师组织" name="departId">
|
|
<a-popover title="讲师组织">
|
|
<template #content>
|
|
{{ formParam.departId }}
|
|
</template>
|
|
<a-input disabled v-model:value="formParam.departId" class="draitem"
|
|
placeholder="自动带出讲师的组织,展示主要部分,鼠标浮上去展示所有" allowClear showSearch>
|
|
</a-input>
|
|
</a-popover>
|
|
</a-form-item>
|
|
</a-col>
|
|
</a-row>
|
|
<!-- 讲师体系 systemId 级别 levelId -->
|
|
<a-row :gutter="16">
|
|
<a-col :span="12">
|
|
<a-form-item label="讲师体系" name="systemId">
|
|
<a-select disabled class="draitem" v-model:value="formParam.systemId" placeholder="请选择讲师体系"
|
|
:options="LecturerSystemList">
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-item label="讲师级别" name="levelId">
|
|
<a-select disabled class="draitem" v-model:value="formParam.levelId" placeholder="请选择讲师级别"
|
|
:options="getLevelList">
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
</a-row>
|
|
<!-- 内容分类 tlevelName 课程名称 teacherNo -->
|
|
<a-row :gutter="16">
|
|
<a-col :span="12">
|
|
<a-form-item label="内容分类" name="tlevelName">
|
|
<a-select class="draitem" v-model:value="searchParam.tlevelName" placeholder="内容分类"
|
|
:options="getTeacherExpertiseList">
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-item label="课程名称：" name="teacherNo">
|
|
<a-input class="draitem" v-model:value="searchParam.teacherNo"
|
|
placeholder="请输入后搜索面授课" allowClear showSearch>
|
|
</a-input>
|
|
</a-form-item>
|
|
</a-col>
|
|
</a-row>
|
|
<!-- 授课日期 beginTime 开课状态 status -->
|
|
<a-row :gutter="16">
|
|
<a-col :span="12">
|
|
<a-form-item label="授课/课程日期 :" name="beginTime">
|
|
<a-date-picker class="draitem" v-model:value="formParam.beginTime" style="width: 200px"
|
|
format="YYYY-MM-DD" placeholder="请选择课程日期" />
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-item label="开课状态">
|
|
<a-radio-group v-model:value="formParam.status" class="draitem">
|
|
<a-radio :value="0">未开课</a-radio>
|
|
<a-radio :value="1">已开课</a-radio>
|
|
</a-radio-group>
|
|
</a-form-item>
|
|
</a-col>
|
|
</a-row>
|
|
<!-- 授课时长defaultTeachingTime 评分 score-->
|
|
<a-row :gutter="16">
|
|
<a-col :span="12">
|
|
<a-form-item label="初始授课时长" name="defaultTeachingTime">
|
|
<a-input v-model:value="formParam.defaultTeachingTime" style="width:80%; height: 40px; " placeholder="0"
|
|
allowClear showSearch suffix="分钟">
|
|
</a-input>
|
|
<span v-if="formParam.defaultTeachingTime" style="margin-left: 5px ;">{{ (formParam.defaultTeachingTime /60 ).toFixed(2)}}小时</span>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-item label="评分" name="score">
|
|
<a-input class="draitem" v-model:value="formParam.score" placeholder="" allowClear
|
|
showSearch>
|
|
</a-input>
|
|
</a-form-item>
|
|
</a-col>
|
|
</a-row>
|
|
<!-- 参训人数 studys-->
|
|
<a-row :gutter="16">
|
|
<a-col :span="24">
|
|
<a-form-item label="参训人数" name="studys">
|
|
<a-input v-model:value="formParam.studys" class="draitem"
|
|
placeholder="0 " allowClear showSearch>
|
|
</a-input>
|
|
</a-form-item>
|
|
</a-col>
|
|
</a-row>
|
|
<!-- 备注 remark -->
|
|
<a-row :gutter="16">
|
|
<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-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" :loading="buttonLoading">保存
|
|
</a-button>
|
|
</div>
|
|
</a-drawer>
|
|
<!--查看授课详情 -->
|
|
<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.teacher}}</a-descriptions-item>
|
|
<a-descriptions-item label="讲师工号">{{formParam.userNo}}</a-descriptions-item>
|
|
<a-descriptions-item label="讲师组织" :span="2">{{formParam.departId}}</a-descriptions-item>
|
|
<a-descriptions-item label="讲师体系">{{formParam.systemId}}</a-descriptions-item>
|
|
<a-descriptions-item label="讲师级别">{{formParam.levelId }}</a-descriptions-item>
|
|
<a-descriptions-item label="录入方式(未命名)">"未命名"</a-descriptions-item>
|
|
<a-descriptions-item label="课程类型">{{formParam.type==1?'项目开课' :formParam.type==2 ?'路径开课':formParam.type==3 ?'面授开课':''}}</a-descriptions-item>
|
|
<a-descriptions-item label="课程名称">{{formParam.name}}</a-descriptions-item>
|
|
<a-descriptions-item label="开课状态">{{formParam.status==0?'未开课' :formParam.status==1 ?'已开课':''}}</a-descriptions-item>
|
|
<a-descriptions-item label="授课时长 ">{{formParam.duration}}</a-descriptions-item>
|
|
<a-descriptions-item label="授课/课程日期 ">{{formParam.beginTime}}</a-descriptions-item>
|
|
<a-descriptions-item label="参训人数 ">{{formParam.studys}}</a-descriptions-item>
|
|
<a-descriptions-item label="评分 ">{{formParam.score}}</a-descriptions-item>
|
|
<a-descriptions-item label="内容分类 ">{{formParam.teaching}}</a-descriptions-item>
|
|
<a-descriptions-item label="备注 ">{{formParam.remark}}</a-descriptions-item>
|
|
</a-descriptions>
|
|
<span class="line"></span>
|
|
<span>讲师费发放情况</span>
|
|
<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>
|
|
</div>
|
|
</a-drawer>
|
|
<!-- 删除功能弹窗 -->
|
|
<div>
|
|
<a-modal v-model:visible="deleteTeacherdialog" :footer="null" :closable="close" wrapClassName="canclestu1"
|
|
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="cancelTeachDialog" 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> <ImageUpload/> </div> -->
|
|
</div>
|
|
</template>
|
|
<script lang="jsx">
|
|
import { reactive, toRefs, ref } from "vue";
|
|
import moment, { Moment } from 'moment';
|
|
import { useRouter } from "vue-router";
|
|
import {
|
|
RightOutlined,
|
|
UpOutlined,
|
|
UploadOutlined,
|
|
FolderAddOutlined,
|
|
DownloadOutlined
|
|
} from '@ant-design/icons-vue';
|
|
import dayjs from "dayjs";
|
|
// import Editor from "@/components/project/Editor";
|
|
// import ImageUpload from "@/components/project/ImageUpload";
|
|
import { message } from "ant-design-vue";
|
|
import { getTeacherSystemList, infoteacher, getTeacherExpertise, deleteInTeacherCourse } from "../../api/Lecturer";
|
|
import { getNewInTeacherCourseList, getOrganization, getTeacherCourseList, insertInTeacherCourse, updateInTeacherCourse } from "../../api/Teaching";
|
|
// import AddTeacher from "../../components/drawers/project/AddTeacher"
|
|
export default {
|
|
name: "InsideTeaching",
|
|
components: {
|
|
// AddTeacher,
|
|
// Editor,
|
|
// ImageUpload
|
|
RightOutlined, //图标--展开
|
|
UpOutlined,//图标--收起
|
|
UploadOutlined,//图标--导出
|
|
DownloadOutlined,//图标-导入
|
|
FolderAddOutlined,//图标--新增
|
|
},
|
|
setup() {
|
|
const router = useRouter();
|
|
const state = reactive({
|
|
moreid: 1,
|
|
currentPage1: 1,
|
|
pageSize1: 10,
|
|
tableLoading: false,
|
|
delTeacherId: null, //删除id确认
|
|
userNoid: null, //详情工号确认
|
|
lookTeacherId: null, //详情id确认
|
|
deleteTeacherdialog: false, //删除弹窗
|
|
teacherdialog1: null,
|
|
teacherdialog: false, //控制讲师弹窗
|
|
teacherdialogtitle: '',//讲师弹框title内容
|
|
teachingdialog:false,//控制查看抽屉
|
|
pageSizeOptions: ['10', '20', '30', '50'], //下拉选择每页显示多少条
|
|
pageSize: 10,
|
|
tableDataTotal: -1,//table列表总条数
|
|
searchdate: null, //选择时间
|
|
startTime: null, //开始时间
|
|
endTime: null, //结束时间
|
|
formParam: {
|
|
status: 1
|
|
},
|
|
searchParam: {
|
|
userNo: null,//工号姓名
|
|
teacherNo: null,//课程编号
|
|
tsystemName: null,//讲师体系
|
|
payrollPlaceName: null,//发薪地
|
|
pageNo: "1",
|
|
pageSize: "10",
|
|
startDate: null,
|
|
endDate: null,
|
|
},
|
|
})
|
|
|
|
//获取所属组织
|
|
const getOrganizationList = ref([
|
|
// { value: 0, systemName: "讲师体系" },
|
|
]);
|
|
//获取所属组织
|
|
const getOrganizationLista = () => {
|
|
// console.log('getOrganizationList')
|
|
getOrganization().then((res) => {
|
|
if (res.data.code === 200) {
|
|
let arr = res.data.data;
|
|
let array = [];
|
|
arr.map((value) => {
|
|
let obj = {
|
|
value: value.departId,
|
|
label: value.orgName,
|
|
};
|
|
array.push(obj);
|
|
});
|
|
getOrganizationList.value = array;
|
|
}
|
|
})
|
|
}
|
|
getOrganizationLista()
|
|
const LecturerSystemList = ref([
|
|
// { value: 0, systemName: "讲师体系" },
|
|
]);
|
|
//获取讲师体系列表
|
|
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.id,
|
|
label: value.name,
|
|
};
|
|
array.push(obj);
|
|
});
|
|
LecturerSystemList.value = array;
|
|
}
|
|
console.log("获取讲师", LecturerSystemList);
|
|
})
|
|
}
|
|
LecturerSystemLista()
|
|
//获取内容分类
|
|
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 OnTheJobStatusList = ref([
|
|
{ value: 1, label: "项目开课" },
|
|
{ value: 2, label: "路径开课" },
|
|
{ value: 3, label: "面授开课" },
|
|
])
|
|
const AuthenticationStatusList = ref([
|
|
{ value: 0, label: "未开课" },
|
|
{ value: 1, label: "已开课" },
|
|
])
|
|
const columns = ref([
|
|
|
|
// {
|
|
// title: '课程编号 ',
|
|
// dataIndex: 'userNo',
|
|
// key: 'userNo',
|
|
// elipsis: true, align: "center",
|
|
// width: 120,
|
|
// },
|
|
{
|
|
title: '讲师姓名 ',
|
|
fixed: 'left',
|
|
dataIndex: 'teacher',
|
|
key: 'teacher',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '讲师工号 ',
|
|
dataIndex: 'userNo',
|
|
key: 'userNo',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '讲师体系 ',
|
|
dataIndex: 'systemName',
|
|
key: 'systemName',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '所属组织 ',
|
|
dataIndex: 'orgName',
|
|
key: 'orgName',
|
|
elipsis: true, align: "center",
|
|
// customRender: (value, record) => {
|
|
// return (
|
|
// <div>
|
|
// {value.record.orgName}
|
|
// </div>
|
|
// )
|
|
// }
|
|
},
|
|
{
|
|
title: '数据来源(未命名) ',
|
|
dataIndex: 'systemName',
|
|
key: 'systemName',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '课程名称 ',
|
|
dataIndex: 'name',
|
|
key: 'name ',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '课程类型 ',
|
|
dataIndex: 'type',
|
|
key: 'type',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
customRender: (value) => {
|
|
return (
|
|
<div>
|
|
{value.record.type == "1" || value.record.type == "2" || value.record.type == "3"
|
|
? {
|
|
"1": "项目开课",
|
|
"2": "路径开课",
|
|
"3": "面授开课",
|
|
}[value.record.type + ""] || ""
|
|
: "-"}
|
|
</div>
|
|
)
|
|
}
|
|
},
|
|
{
|
|
title: '授课/课程日期 ',
|
|
dataIndex: 'beginTime',
|
|
key: 'beginTime',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '开课状态 ',
|
|
dataIndex: 'status',
|
|
key: 'status',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
customRender: (value) => {
|
|
return (
|
|
<div>
|
|
{value.record.status == 0 || value.record.status == 1
|
|
? {
|
|
"0": "未开课",
|
|
"1": "已开课",
|
|
}[value.record.status + ""] || ""
|
|
: "-"}
|
|
</div>
|
|
)
|
|
}
|
|
},
|
|
{
|
|
title: '内容分类',
|
|
dataIndex: 'teaching',
|
|
key: 'teaching',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '授课时长(H) ',
|
|
dataIndex: 'duration',
|
|
key: 'duration',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '参训人数',
|
|
dataIndex: 'studys',
|
|
key: 'studys',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '评分',
|
|
dataIndex: 'score',
|
|
key: 'score',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '是否生成课时费 ',
|
|
dataIndex: 'feeCreated',
|
|
key: 'feeCreated',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
customRender: (value) => {
|
|
return (
|
|
<div>
|
|
{value.record.feeCreated == 0 || value.record.feeCreated == 1
|
|
? {
|
|
"0": "否",
|
|
"1": "是",
|
|
}[value.record.feeCreated + ""] || ""
|
|
: "-"}
|
|
</div>
|
|
)
|
|
}
|
|
},
|
|
{
|
|
title: '操作 ',
|
|
dataIndex: 'operation',
|
|
key: 'operation',
|
|
elipsis: true, align: "center",
|
|
|
|
fixed: "right",
|
|
scopedSlots: { customRender: "action" },
|
|
},
|
|
])
|
|
//列表数据
|
|
const tableData = ref([
|
|
|
|
])
|
|
//展开切换
|
|
const handlemoreid = () => {
|
|
if (state.moreid == 1) {
|
|
state.moreid = 2
|
|
}
|
|
else if (state.moreid == 2) {
|
|
state.moreid = 1
|
|
state.searchParam.type = null
|
|
state.searchParam.status = null
|
|
state.searchParam.departId = null
|
|
state.searchParam.systemId = null
|
|
state.searchParam.tlevelName = null
|
|
}
|
|
}
|
|
// 搜索
|
|
const searchSubmit = () => {
|
|
getTableDate();
|
|
};
|
|
//修改时间
|
|
const searchTimeChange = (e, date) => {
|
|
let startTime = date[0] + " 00:00:00";
|
|
let endTime = date[1] + " 23:59:59";
|
|
state.startTime = new Date(startTime).getTime();
|
|
state.endTime = new Date(endTime).getTime();
|
|
// state.searchParam.startDate = new Date(startDate).getTime() ;
|
|
// state.searchParam.endDate = new Date(endDate).getTime() ;
|
|
state.searchParam.startDate = state.startTime ? state.startTime : null,
|
|
state.searchParam.endDate = state.endTime ? state.endTime : null
|
|
};
|
|
//重置
|
|
const searchReset = () => {
|
|
state.searchParam = {
|
|
pageNo: 1,
|
|
pageSize: 10,
|
|
name: null,
|
|
offcourseId: null,
|
|
departId: null,
|
|
systemId: null,
|
|
beginTime: null,
|
|
type: null,
|
|
status: null
|
|
};
|
|
getTableDate();
|
|
};
|
|
// List接口数据
|
|
const getTableDate = (obj) => {
|
|
state.tableLoading = true
|
|
let objA = { ...state.searchParam };
|
|
objA.startDate = state.searchParam.startDate !== null ? dayjs(new Date(state.searchParam.startDate).getTime()).format("YYYY-MM-DD") : "",
|
|
objA.endDate = state.searchParam.endDate !== null ? dayjs(new Date(state.searchParam.endDate).getTime()).format("YYYY-MM-DD") : "",
|
|
getNewInTeacherCourseList(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.teacherdialog1 = 0
|
|
state.teacherdialog = true;
|
|
state.teacherdialogtitle = '添加授课记录'
|
|
//获取内部讲师级别
|
|
|
|
}
|
|
//修改信息弹窗
|
|
const handleModify = (record) => {
|
|
// state.teacherdialog1 = 0
|
|
state.teacherdialog = true;
|
|
state.teacherdialogtitle = '修改授课记录'
|
|
state.lookTeacherId = record.teacherId
|
|
TeacherSystem()
|
|
}
|
|
//保存
|
|
const createTeacherDialog = () => {
|
|
if (state.formParam.offcourseId != null) {
|
|
updateInTeacherCourse(state.formParam).then(response => {
|
|
message.success("修改成功");
|
|
});
|
|
}
|
|
else {
|
|
insertInTeacherCourse(state.formParam)
|
|
.then((res) => {
|
|
message.success("保存成功");
|
|
}).catch((err) => {
|
|
console.log(err);
|
|
});
|
|
}
|
|
getTableDate();
|
|
state.teacherdialog = false
|
|
}
|
|
//删除弹窗
|
|
const deleteModal = (record) => {
|
|
state.deleteTeacherdialog = true
|
|
state.delTeacherId = record.offcourseId
|
|
|
|
};
|
|
|
|
//确认删除
|
|
const closeDeleteTeacher = () => {
|
|
//调用删除接口
|
|
deleteInTeacherCourse(state.delTeacherId).then((res) => {
|
|
if (res.data.code == 200) {
|
|
message.success("删除成功");
|
|
state.deleteTeacherdialog = false
|
|
getTableDate();
|
|
}
|
|
})
|
|
}
|
|
|
|
//取消按钮 清空输入的数据
|
|
const cancelTeacherDialog = () => {
|
|
if (state.teacherdialog = true) {
|
|
state.teacherdialog = false
|
|
cancel()
|
|
}
|
|
state.deleteTeacherdialog = false
|
|
};
|
|
|
|
//清空数据
|
|
const cancel = () => {
|
|
state.formParam = {
|
|
teacher: null,
|
|
userNo: null,
|
|
departId: null,
|
|
defaultTeachingTime: null,
|
|
tlevelName: null,
|
|
name: null,
|
|
beginTime: null,
|
|
duration: null,
|
|
studys: null,
|
|
score: null,
|
|
type: null,
|
|
remark: null,
|
|
offcourseId: null
|
|
}
|
|
|
|
}
|
|
//页面内部姓名
|
|
const infoteacherList = ref([
|
|
]);
|
|
const getinfoteacher = (obj) => {
|
|
state.tableLoading = true
|
|
infoteacher()
|
|
.then((res) => {
|
|
infoteacherList.value = res.data.data.records
|
|
})
|
|
};
|
|
|
|
//表格内查看数据操作
|
|
const handleLook = (record) => {
|
|
// state.teacherdialog1 = 1
|
|
state.teachingdialog = true;
|
|
state.teacherdialogtitle = '查看详情'
|
|
// state.userNoid = record.userNo
|
|
state.lookTeacherId = record.teacherId
|
|
// // alert(record.grade)
|
|
TeacherSystem()
|
|
// let id = record.userNo
|
|
// router.push({ path: '/insideteachingdetail', query: { id } })
|
|
// router.push({ path: '/InsideTeachingDetail' })
|
|
}
|
|
const cancelTeachingDialog =()=>{
|
|
state.teachingdialog = false;
|
|
}
|
|
//内部授课详情
|
|
const TeacherSystem = () => {
|
|
getTeacherCourseList( state.lookTeacherId).then((res) => {
|
|
console.log("内部授课详情", res.data);
|
|
state.formParam= res.data.data
|
|
})
|
|
.catch((err) => {
|
|
console.log("内部授课详情", err);
|
|
});
|
|
// state.formParam = {
|
|
// name: record.name,
|
|
// userNo: record.userNo,
|
|
// orgName:record.orgName,
|
|
// departId: record.departId,
|
|
// levelId: record.levelId,
|
|
// tlevelName: record.tlevelName,
|
|
// teacherNo: record.teacherNo,
|
|
// beginTime: moment(record.beginTime, 'YYYY-MM-DD'),
|
|
// // ref< moment.Moment >(moment(record.beginTime,'YYYY-MM-DD')),
|
|
// // record.beginTime,
|
|
// status: record.status,
|
|
// defaultTeachingTime: record.defaultTeachingTime,
|
|
// studys: record.studys,
|
|
// remark: record.remark,
|
|
// }
|
|
}
|
|
//导出功能
|
|
const handleExport = () => {
|
|
window.open(
|
|
`${process.env.VUE_APP_BASE_API}/lesson_records/export?pageNo=${state.currentPage1
|
|
}&pageSize=${state.pageSize1}
|
|
&userNo=${state.searchParam.userNo ? state.searchParam.userNo : ""}
|
|
&teacherNo=${state.searchParam.teacherNo ? state.searchParam.teacherNo : ""}
|
|
&departId=${state.searchParam.departId ? state.searchParam.departId : ""}
|
|
&systemId=${state.searchParam.systemId ? state.searchParam.systemId : ""}
|
|
&startDate=${state.searchParam.startDate ? state.searchParam.startDate : ""}
|
|
&endDate=${state.searchParam.endDate ? state.searchParam.endDate : ""}
|
|
&tlevelName=${state.searchParam.tlevelName ? state.searchParam.tlevelName : ""}
|
|
&type=${state.searchParam.type ? state.searchParam.type : ""}
|
|
&status=${state.searchParam.status ? state.searchParam.status : ""}`)
|
|
}
|
|
return {
|
|
...toRefs(state),
|
|
handlemoreid,
|
|
infoteacherList,
|
|
getinfoteacher,
|
|
handleExport,
|
|
LecturerSystemList,
|
|
getTeacherExpertiseList,
|
|
OnTheJobStatusList,
|
|
getTeacherExpertiseLista,
|
|
AuthenticationStatusList,
|
|
searchSubmit,
|
|
searchReset,
|
|
columns,
|
|
tableData,
|
|
changePagination,
|
|
addTeacher,
|
|
cancelTeacherDialog,
|
|
handleLook,
|
|
cancel,
|
|
deleteModal,
|
|
handleModify,
|
|
closeDeleteTeacher,
|
|
createTeacherDialog,
|
|
getTableDate, //list接口数据调用
|
|
// getStu
|
|
LecturerSystemLista,
|
|
TeacherSystem,
|
|
getOrganizationLista,
|
|
getOrganizationList,searchTimeChange,
|
|
cancelTeachingDialog
|
|
}
|
|
},
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped >
|
|
.select .ant-picker {
|
|
width: 410px !important;
|
|
}
|
|
|
|
.addTimeBox {
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.addTime {
|
|
position: absolute;
|
|
z-index: 10;
|
|
margin-left: 10px;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
}
|
|
|
|
//导出按钮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: 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;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
//添加样式
|
|
.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
|
|
}
|
|
</style> |