mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-16 06:16:46 +08:00
490 lines
16 KiB
Vue
490 lines
16 KiB
Vue
<template>
|
|
<!-- 内部讲师查看详情 -->
|
|
<div class="LookInsideLecturer">
|
|
<a-layout-header style="background: white;color: black; font-size: 20px ;">
|
|
<span>查看讲师</span>
|
|
<router-link to="/lecturerList" class="goback">
|
|
<span class="return"></span>
|
|
<!-- <router-link class="returntext" to="/lecturerList" style="line-height:47px ">
|
|
返回
|
|
</router-link> -->
|
|
<div class="returntext" to="/goback" style="line-height:47px " @click="goback">
|
|
返回
|
|
</div>
|
|
</router-link>
|
|
</a-layout-header>
|
|
<a-divider style="height: 1px; background-color: #b7b8b7 ;margin: 0;" />
|
|
<a-layout-content>
|
|
<!-- 讲师信息 -->
|
|
<div style="width: 100%;margin-top: 10px;">
|
|
<span class="line"></span>
|
|
<a-descriptions title="讲师信息" bordered :column="4" :contentStyle="rowCenter" :labelStyle="rowCenter">
|
|
<!-- 一层 -->
|
|
<a-descriptions-item label="讲师头像">
|
|
<!-- <a-avatar :src="formParam.photo" /> -->
|
|
<a-image
|
|
:width="55" style="border-radius: 50%;"
|
|
:src=formParam.photo
|
|
/></a-descriptions-item>
|
|
<a-descriptions-item label="讲师工号">{{formParam.userNo}}</a-descriptions-item>
|
|
<a-descriptions-item label="讲师姓名">{{formParam.name}}</a-descriptions-item>
|
|
<a-descriptions-item label="讲师体系">{{formParam.tsystemName}}</a-descriptions-item>
|
|
<!-- 二层 -->
|
|
<a-descriptions-item label="讲师级别">{{formParam.tlevelName
|
|
}}</a-descriptions-item>
|
|
<a-descriptions-item label="认证状态">{{ formParam.certStatus==0?'未认证' :formParam.certStatus==1 ?'已认证':''}}
|
|
<span>
|
|
<a-button type="text" class="moreidbtn" v-if="formParam.certStatus == 1"
|
|
@click="handleup">查看认证资料</a-button>
|
|
</span>
|
|
</a-descriptions-item>
|
|
<a-descriptions-item label="授课时长"> <span v-if="formParam.teaching!= null" >{{ (formParam.teaching /60 ).toFixed(2)}}小时</span>
|
|
</a-descriptions-item>
|
|
<a-descriptions-item label="发薪地 ">{{formParam.payrollPlaceName}}</a-descriptions-item>
|
|
<!-- 三层 -->
|
|
<a-descriptions-item label="在职状态">{{formParam.waitStatus=='0'?'在职' :formParam.waitStatus=='1' ?'离职':''}}</a-descriptions-item>
|
|
<a-descriptions-item label="账号状态">{{formParam.status=='0'?'临时' :formParam.status=='1' ?'启用':formParam.status==1 ?'停用':''}}</a-descriptions-item>
|
|
<a-descriptions-item label="创建方式">{{formParam.entryType=='0'?'系统生成' :formParam.entryType=='1'?'手动录入':''}}</a-descriptions-item>
|
|
<a-descriptions-item label="所属组织" > <a-popover title="所属组织">
|
|
<template #content>
|
|
{{ formParam.orgName }}
|
|
</template>
|
|
{{ formParam.neworgName }}
|
|
</a-popover>
|
|
</a-descriptions-item>
|
|
</a-descriptions>
|
|
<div style="margin-top: 10px;"></div>
|
|
<span class="line" ></span>
|
|
<a-descriptions title="其他信息" bordered :column="4" :contentStyle="rowCenter" :labelStyle="rowCenter" >
|
|
<!-- 一层 -->
|
|
<a-descriptions-item label="讲师介绍" :span="4"><div style="min-width: 500px;">
|
|
{{formParam.description ===null ? ' --' :formParam.description}} </div> </a-descriptions-item>
|
|
<a-descriptions-item label="工作职责" :span="4">{{formParam.workExperience ===null?'--':formParam.workExperience}}</a-descriptions-item>
|
|
<a-descriptions-item label="擅长课程" :span="4">{{formParam.courses===null?'--':formParam.courses}}</a-descriptions-item>
|
|
<a-descriptions-item label="教师专长" :span="4">{{formParam.expertise===null?'--':formParam.expertise}}</a-descriptions-item>
|
|
</a-descriptions>
|
|
<!-- 记录 -->
|
|
<div style="margin-top: 1px;"></div>
|
|
<a-tabs v-model:activeKey="activeKey">
|
|
<a-tab-pane key="1" tab="授课记录">
|
|
<a-table :header-cell-style="{ 'text-align': 'center' }" style="border: 1px solid #f2f6fe" :columns="teacherrecordsColumns"
|
|
|
|
:data-source="teacherrecordstableData" :loading="teacherrecordsLoading" @expand="expandTable" :pagination="false">
|
|
<template #bodyCell="{ record, column }" >
|
|
<!-- 鼠标悬停提示 -->
|
|
<template v-if="column.key === 'remark'">
|
|
<a-space style="display:flex ;justify-content: space-around; ">
|
|
<a-popover>
|
|
<template #content>
|
|
<p>{{ record.remark }}</p>
|
|
</template>
|
|
<span>{{ record.remark }}</span>
|
|
</a-popover>
|
|
</a-space>
|
|
</template>
|
|
</template>
|
|
</a-table>
|
|
<div style="float: right;">
|
|
<a-pagination
|
|
v-if="tableDataTotal > 10"
|
|
:showSizeChanger="true"
|
|
:showQuickJumper="false"
|
|
:hideOnSinglePage="true"
|
|
:pageSize="searchParam.pageSize"
|
|
:current="searchParam.pageNo"
|
|
:total="tableDataTotal"
|
|
class="pagination"
|
|
@change="changePagination"
|
|
/>
|
|
</div>
|
|
</a-tab-pane>
|
|
<a-tab-pane key="2" tab="晋级记录">
|
|
<a-table :header-cell-style="{ 'text-align': 'center' }" style="border: 1px solid #f2f6fe" :columns="promotionrecordsColumns"
|
|
|
|
:data-source="promotionrecordstableData" :loading="promotionrecordsLoading" @expand="expandTable" :pagination="false">
|
|
<template #bodyCell="{ record, column,index }" >
|
|
</template>
|
|
</a-table>
|
|
<div style="float: right;">
|
|
<a-pagination
|
|
v-if="teacherrepromotableDataTotal > 10"
|
|
:showSizeChanger="true"
|
|
:showQuickJumper="false"
|
|
:hideOnSinglePage="true"
|
|
:pageSize="teacherrepromo.pageSize"
|
|
:current="teacherrepromo.pageNo"
|
|
:total="teacherrepromotableDataTotal"
|
|
class="pagination"
|
|
@change="teacherrepromoPagination"
|
|
/>
|
|
</div>
|
|
</a-tab-pane>
|
|
</a-tabs>
|
|
</div>
|
|
</a-layout-content>
|
|
</div>
|
|
</template>
|
|
<script lang ="jsx">
|
|
import { useRouter,useRoute } from "vue-router";
|
|
import { reactive, toRefs, ref, computed } from "vue"
|
|
import { useStore } from "vuex";
|
|
import {getTeacherById ,getTeacherLogList} from "../../api/Lecturer";
|
|
import { getNewInTeacherCourseList } from "../../api/Teaching";
|
|
import boe from '@/assets/boe.jpg'
|
|
export default{
|
|
name :"LookInsideLecturer",
|
|
components:{
|
|
|
|
},
|
|
setup(){
|
|
const router=useRouter();
|
|
const { query: { id }} = useRoute();
|
|
const state = reactive({
|
|
activeKey:'1',
|
|
id,
|
|
formParam: {
|
|
},
|
|
promotionrecordsLoading: false, //晋级记录遮罩层
|
|
teacherrecordsLoading: false,// 授课记录遮罩层
|
|
teacherrecordstableDataTotal: -1,//授课记录列表总条数
|
|
teacherrepromotableDataTotal: -1,//晋级记录总条数
|
|
teacherrecords: {
|
|
recordType:1,
|
|
pageNo: "1",
|
|
pageSize: "10",
|
|
id: null
|
|
},
|
|
teacherrepromo:{
|
|
userId:null,
|
|
pageNo: "1",
|
|
pageSize: "10",
|
|
}
|
|
});
|
|
|
|
//内部讲师详情
|
|
const TeacherSystem = () => {
|
|
getTeacherById({id:state.id}).then((res) => {
|
|
let objA= res.data.data
|
|
console.log(objA ,'11111111111')
|
|
// if( objA.orgName !==null ){
|
|
// objA.neworgName=objA.orgName.split('/')
|
|
|
|
// objA.neworgName= objA.neworgName[objA.neworgName.length-1]
|
|
// }
|
|
state.formParam = objA
|
|
state.formParam.photo = state.formParam.photo ===null ?boe : state.formParam.photo
|
|
state.teacherrepromo.userId=res.data.data.id
|
|
console.log(state.teacherrepromo.id);
|
|
getteacherrecordstableData()
|
|
getpromotionrecordstableData()
|
|
})
|
|
.catch((err) => {
|
|
console.log("内部讲师详情", err);
|
|
});
|
|
}
|
|
TeacherSystem()
|
|
//授课记录列表
|
|
const teacherrecordsColumns = ref([
|
|
{
|
|
title: '课程编号',
|
|
dataIndex: 'courseId',
|
|
key: 'courseId',
|
|
align: "center",
|
|
customRender: (text,record,index) => `${index+1}`,
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '课程名称',
|
|
dataIndex: 'courseName',
|
|
key: 'courseName',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '课程日期',
|
|
dataIndex: 'beginTime',
|
|
key: 'beginTime',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: "内容分类",
|
|
width: 100,
|
|
dataIndex: "sysType1",
|
|
ellipsis: true,
|
|
key: "keywords",
|
|
align: "center",
|
|
// customRender: ({ record,text }) =>
|
|
// `${getSysTypeMap(record.sysType1, record.sysTypeId)?getSysTypeMap(record.sysType1) : ""}
|
|
// ${getSysTypeMap(record.sysType2, record.sysTypeId)?'-'+getSysTypeMap(record.sysType2) : ""}
|
|
// ${getSysTypeMap(record.sysType3, record.sysTypeId)?'-'+getSysTypeMap(record.sysType3) : ""}
|
|
// `
|
|
},
|
|
{
|
|
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: 'studentNum',
|
|
key: 'studentNum',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '授课时长(分钟)',
|
|
dataIndex: 'teaching',
|
|
key: 'teaching',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '评分',
|
|
dataIndex: 'score',
|
|
key: 'score',
|
|
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: 'remark ',
|
|
key: 'remark ',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
scopedSlots: { customRender: "remark" },
|
|
},
|
|
])
|
|
//授课记录列表数据
|
|
const teacherrecordstableData = ref([
|
|
])
|
|
const getteacherrecordstableData = () => {
|
|
state.teacherrecordsLoading = true
|
|
state.teacherrecords.name = state.formParam.name
|
|
let obj = { ...state.teacherrecords }
|
|
// api接口
|
|
getNewInTeacherCourseList(obj).then((res) => {
|
|
console.log(res);
|
|
teacherrecordstableData.value = res.data.data.records
|
|
state.teacherrecordstableDataTotal = Number(res.data.data.total);
|
|
state.teacherrecordsLoading = false
|
|
})
|
|
};
|
|
//授课翻页
|
|
const teacherchangePagination = (page) => {
|
|
state.teacherrecords.pageNo = page;
|
|
getteacherrecordstableData();
|
|
};
|
|
//晋级记录翻页
|
|
const teacherrepromoPagination = (page) => {
|
|
state.teacherrepromo.pageNo = page;
|
|
getpromotionrecordstableData();
|
|
};
|
|
//晋级记录列表
|
|
const promotionrecordsColumns = ref([
|
|
{
|
|
title: '变更时间',
|
|
dataIndex: 'operatorTime',
|
|
key: 'operatorTime',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '变更方式',
|
|
dataIndex: 'operatorType',
|
|
key: 'operatorType',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '变更结果',
|
|
dataIndex: 'levelName',
|
|
key: 'levelName',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
{
|
|
title: '操作人',
|
|
dataIndex: 'operatorId',
|
|
key: 'operatorId',
|
|
elipsis: true, align: "center",
|
|
width: 120,
|
|
},
|
|
])
|
|
//晋级记录列表数据
|
|
const promotionrecordstableData = ref([
|
|
])
|
|
const getpromotionrecordstableData = () => {
|
|
state.promotionrecordsLoading = true
|
|
// state.teacherrepromo.kid = state.kid
|
|
getTeacherLogList(state.teacherrepromo).then((res) => {
|
|
promotionrecordstableData.value = res.data.data.records
|
|
state.teacherrepromotableDataTotal = Number(res.data.data.total);
|
|
})
|
|
state.promotionrecordsLoading = false
|
|
};
|
|
const goback = ()=>{
|
|
router.back()
|
|
}
|
|
const store = useStore();
|
|
// // 内容分类
|
|
// const sysTypeOptions = computed(() => {return store.state.content_type;});
|
|
// //内容分类
|
|
// const getSysTypeMap = (code) => {
|
|
// if(code=="")return
|
|
// // console.log(store.state.sysTypeMap,'map集合');
|
|
// return store.state.sysTypeMap.get(code)
|
|
// }
|
|
// getSysTypeMap()
|
|
|
|
const handleup = ()=>{
|
|
window.open (
|
|
`${process.env.VUE_APP_BASE_API}/teacherUpload/teacherDownload?teacherId= ${state.id}`
|
|
);
|
|
}
|
|
return{
|
|
...toRefs(state),
|
|
router,
|
|
goback,
|
|
handleup,
|
|
// getSysTypeMap,
|
|
// sysTypeOptions,
|
|
TeacherSystem,
|
|
rowCenter:{"text-align":"center"},
|
|
teacherrecordstableData,
|
|
teacherrecordsColumns,
|
|
getteacherrecordstableData,
|
|
teacherchangePagination,
|
|
teacherrepromoPagination,
|
|
promotionrecordsColumns,
|
|
promotionrecordstableData,
|
|
getpromotionrecordstableData,
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
|
|
.LookInsideLecturer {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
.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;
|
|
}
|
|
}
|
|
}
|
|
.backbtn{
|
|
float: right;
|
|
margin-right: 20px;
|
|
border: none;
|
|
color: #4ea6ff;
|
|
width: 80px;
|
|
height:64px
|
|
}
|
|
//小竖线
|
|
.line{
|
|
float:left; width: 3px; height: 25px; background: #4ea6ff;border-radius: 30%; margin-right: 5px;
|
|
}
|
|
::v-deep .ant-descriptions-header{
|
|
margin-bottom: 10px ;
|
|
}
|
|
.goback {
|
|
float: right;
|
|
padding-right: 70px;
|
|
//padding-top: 37px;
|
|
position: relative;
|
|
|
|
.return {
|
|
display: inline-block;
|
|
width: 42px;
|
|
height: 42px;
|
|
margin-top: 17px;
|
|
margin-right: 10px;
|
|
background-image: url("../../assets/images/projectadd/return.png");
|
|
}
|
|
|
|
.returntext {
|
|
display: inline-block;
|
|
position: absolute;
|
|
top: 12px;
|
|
color: #4ea6ff;
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
.moreidbtn {
|
|
border: none;
|
|
color: #4ea6ff;
|
|
width: 80px
|
|
}
|
|
|
|
::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> |