-- bug 面授选择课程

This commit is contained in:
yuping
2022-12-03 16:55:36 +08:00
parent 6f7001dd03
commit 6f3fc382d9
2 changed files with 194 additions and 143 deletions

View File

@@ -28,11 +28,11 @@
</div> </div>
<span style="margin-right: 3px">选择课程</span> <span style="margin-right: 3px">选择课程</span>
</div> </div>
<div class="btnbox" @click="showDrawerSelFacet"> <div class="btnbox">
<button class="xkbtn"> <button class="xkbtn" @click="showDrawerSelFacet">
{{ chooseCourse == null ? "选择" : "修改" }}面授课 {{ chooseCourse == null ? "选择" : chooseCourseName }}面授课
</button> </button>
<div v-if="chooseCourse > 0"> <div v-if="chooseCourse">
<a-tag closable color="processing" @close="logC"> <a-tag closable color="processing" @close="logC">
<span style="font-size:14px;line-height: 33px;">删除课程</span> <span style="font-size:14px;line-height: 33px;">删除课程</span>
</a-tag> </a-tag>
@@ -41,7 +41,7 @@
</div> </div>
<!-- 选择面授侧弹窗 --> <!-- 选择面授侧弹窗 -->
<div> <div>
<sel-facet v-model:selfacetVisible="selfacetvisible" v-model:chooseCourse="chooseCourse"/> <sel-facet v-model:selfacetVisible="selfacetvisible" v-model:chooseCourse="chooseCourse" v-model:chooseCourseName="chooseCourseName"/>
</div> </div>
<!-- 选择面授侧弹窗 --> <!-- 选择面授侧弹窗 -->
</div> </div>
@@ -371,6 +371,7 @@ export default {
chooseTime: [], chooseTime: [],
fileList: [], fileList: [],
chooseCourse: null, //选择的在线课程 chooseCourse: null, //选择的在线课程
chooseCourseName: null, //选择的在线课程
assessmentId: null, assessmentId: null,
EditTestId: null, EditTestId: null,
EditWorkId: null, EditWorkId: null,
@@ -419,6 +420,7 @@ export default {
const logC = e => { const logC = e => {
state.chooseCourse = null; state.chooseCourse = null;
state.chooseCourseName = null;
console.log(e); console.log(e);
}; };
const logW = e => { const logW = e => {

View File

@@ -1,19 +1,19 @@
<template> <template>
<a-drawer <a-drawer
:visible="selfacetVisible" :visible="selfacetVisible"
class="drawerStyle selfacetDrawer" class="drawerStyle selfacetDrawer"
width="80%" width="80%"
title="添加在线" title="添加在线"
placement="right" placement="right"
@after-visible-change="afterVisibleChange" @after-visible-change="afterVisibleChange"
> >
<div class="drawerMain"> <div class="drawerMain">
<div class="header"> <div class="header">
<div class="headerTitle">选择面授</div> <div class="headerTitle">选择面授</div>
<img <img
style="width: 29px; height: 29px; cursor: pointer" style="width: 29px; height: 29px; cursor: pointer"
src="../../assets/images/basicinfo/close.png" src="../../assets/images/basicinfo/close.png"
@click="closeDrawer" @click="closeDrawer"
/> />
</div> </div>
<div class="contentMain"> <div class="contentMain">
@@ -23,26 +23,26 @@
<div class="ipt_name">课程信息</div> <div class="ipt_name">课程信息</div>
<div class="fi_input"> <div class="fi_input">
<a-input <a-input
v-model:value="name" v-model:value="name"
style="width: 240px; height: 40px; border-radius: 8px" style="width: 240px; height: 40px; border-radius: 8px"
placeholder="请输入项目名称" placeholder="请输入项目名称"
/> />
</div> </div>
</div> </div>
<div class="mii_ipt"> <div class="mii_ipt">
<div class="ipt_name">课程状态</div> <div class="ipt_name">课程状态</div>
<div class="select fitems"> <div class="select fitems">
<a-select <a-select
v-model:value="auditStatus" v-model:value="auditStatus"
dropdownClassName="dropdown-style" dropdownClassName="dropdown-style"
style="width: 200px" style="width: 200px"
placeholder="请选择状态" placeholder="请选择状态"
:options="options1" :options="options1"
allowClear allowClear
showSearch showSearch
> >
</a-select> </a-select>
</div> </div>
</div> </div>
</div> </div>
<div class="mi_btns"> <div class="mi_btns">
@@ -57,88 +57,88 @@
</div> </div>
</div> </div>
<div class="main_notice"> <div class="main_notice">
<div class="mntc_left"> <div class="mntc_left">
<div class="notice_icon"></div> <div class="notice_icon"></div>
<div v-if="offcourse == null"> <div v-if="offcourse == null">
<span class="title" <span class="title"
>已选择 <span class="data">0</span> </span >已选择 <span class="data">0</span> </span
> >
</div> </div>
<div v-else> <div v-else>
<span class="title" <span class="title"
>已选择 <span class="data">1</span> ;</span >已选择 <span class="data">1</span> ;</span
> >
<span class="title" <span class="title"
>课程编号 >课程编号
<span class="data">{{ offcourse.offcourseId }}</span> <span class="data">{{ offcourse.offcourseId }}</span>
</span> </span>
<span class="title" <span class="title"
>名称 >名称
<span class="data">{{ <span class="data">{{
offcourse.name offcourse.name
}}</span> }}</span>
</span> </span>
<span class="title" <span class="title"
>分类 >分类
<span class="data">{{ <span class="data">{{
offcourse.categoryId offcourse.categoryId
}}</span> }}</span>
</span> </span>
<span class="title" <span class="title"
>授课老师 >授课老师
<span class="data">{{ <span class="data">{{
offcourse.teacherId offcourse.teacherId
}}</span> }}</span>
</span> </span>
<span class="title" <span class="title"
>创建人 >创建人
<span class="data">{{ offcourse.createUser }}</span> <span class="data">{{ offcourse.createUser }}</span>
</span> </span>
</div>
</div>
</div> </div>
</div>
</div>
<div class="main_table"> <div class="main_table">
<a-table <a-table
class="ant-table-striped" class="ant-table-striped"
:row-class-name=" :row-class-name="
(_record, index) => (index % 2 === 1 ? 'table-striped' : null) (_record, index) => (index % 2 === 1 ? 'table-striped' : null)
" "
:row-selection="rowSelection" :row-selection="rowSelection"
:columns="columns1" :columns="columns1"
:data-source="classTableData" :data-source="classTableData"
:loading="tableDataTotal === -1 ? true : false" :loading="tableDataTotal === -1 ? true : false"
:pagination="false" :pagination="false"
/> />
<div class="pa"> <div class="pa">
<a-pagination <a-pagination
v-if="total > 10" v-if="total > 10"
showSizeChanger="true" showSizeChanger="true"
showQuickJumper="true" showQuickJumper="true"
hideOnSinglePage="true" hideOnSinglePage="true"
:pageSize="pageSize" :pageSize="pageSize"
:current="currentPage" :current="currentPage"
:total="tableDataTotal" :total="tableDataTotal"
class="pagination" class="pagination"
@change="changePaginationStu" @change="changePaginationStu"
/> />
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</a-drawer> </a-drawer>
</template> </template>
<script> <script>
//import { ApiFilled } from "@ant-design/icons-vue"; //import { ApiFilled } from "@ant-design/icons-vue";
import { reactive, toRefs, ref } from "vue"; import {reactive, toRefs, ref, computed} from "vue";
// import { planList } from "../../api/indexTaskadd"; // import { planList } from "../../api/indexTaskadd";
import {detail} from "../../api/indexCourse"; import {detail} from "../../api/indexCourse";
import { list } from "../../api/indexTaskadd"; import {list} from "../../api/indexTaskadd";
import { toDate } from "../../api/method"; import {toDate} from "../../api/method";
const columns1 = [ const columns1 = [
{ {
@@ -196,6 +196,10 @@ export default {
type: Number, type: Number,
default: null, default: null,
}, },
chooseCourseName: {
type: String,
default: null,
},
titleTag: { titleTag: {
type: Boolean, type: Boolean,
default: false, default: false,
@@ -221,59 +225,75 @@ export default {
valueContent: null, //内容分类 valueContent: null, //内容分类
selectedRows: [], //选择的数据 selectedRows: [], //选择的数据
selectedRowKeys: [], selectedRowKeys: [],
titleTag:false, titleTag: false,
offcourse:null, offcourse: null,
auditStatus:null, auditStatus: null,
name:null, name: null,
courseInfo:[]
}); });
const rowSelection = {
type: "radio", const rowSelection = computed(() => {
onSelect: (selectedRows) => { console.log(3333333333)
state.chooseCourse=selectedRows.num; console.log(state.selectedRows)
console.log(selectedRows,"==========",state.chooseCourse); return {
closeDrawer(); type: "radio",
}, selectedRowKeys: state.selectedRows,
}; onSelect: (selectedRows) => {
console.log('select')
state.chooseCourse = selectedRows.num;
state.chooseCourseName = selectedRows.name;
console.log(selectedRows, "==========", state.chooseCourse);
closeDrawer();
},
onChange: (selectedRows) => {
console.log('onChange')
state.selectedRows = selectedRows
},
}
})
const closeDrawer = () => { const closeDrawer = () => {
ctx.emit("update:selfacetVisible", false); ctx.emit("update:selfacetVisible", false);
ctx.emit("update:chooseCourse", state.chooseCourse); state.chooseCourse && ctx.emit("update:chooseCourse", state.chooseCourse);
state.chooseCourseName && ctx.emit("update:chooseCourseName", state.chooseCourseName);
}; };
const afterVisibleChange = (bool) => { const afterVisibleChange = (bool) => {
if(bool){ if (bool) {
state.chooseCourse=props.chooseCourse; state.chooseCourse = props.chooseCourse;
getClassList(); state.chooseCourseName = props.chooseCourseName;
getFaceInfo(); state.selectedRows = props.chooseCourse ? [props.chooseCourse] : [];
getClassList();
// getFaceInfo();
} }
}; };
// const showDrawerSelFacet = () => { // const showDrawerSelFacet = () => {
// state.selfacetvisible = true; // state.selfacetvisible = true;
// }; // };
const getFaceInfo =()=>{ // const getFaceInfo = () => {
detail({offcourseId:36}).then((res) => { // detail({offcourseId: 36}).then((res) => {
state.chooseCourse = res.data.data; // state.courseInfo = res.data.data;
}).catch(); // }).catch();
} // }
//获取面授课列表 //获取面授课列表
const getClassList = (obj) => { const getClassList = (obj) => {
let objn = obj || { let objn = obj || {
auditStatus:state.auditStatus, auditStatus: state.auditStatus,
name:state.name, name: state.name,
pageNo:state.currentPage, pageNo: state.currentPage,
pageSize:state.pageSize pageSize: state.pageSize
}; };
list(objn) list(objn)
.then((res) => { .then((res) => {
console.log(res.data.data.rows); console.log(res.data.data.rows);
let result = res.data.data; let result = res.data.data;
state.tableDataTotal = result.total; state.tableDataTotal = result.total;
getClassData(result.rows); getClassData(result.rows);
}) })
.catch((err) => { .catch((err) => {
console.log("获取列表失败", err.data); console.log("获取列表失败", err.data);
}); });
}; };
const getClassData = (tabledata) => { const getClassData = (tabledata) => {
@@ -317,7 +337,7 @@ export default {
console.log("改变了", value, option); console.log("改变了", value, option);
console.log(state.valueContent); console.log(state.valueContent);
}; };
//搜索 //搜索
const search = () => { const search = () => {
//重新获取列表 //重新获取列表
getClassList(); getClassList();
@@ -366,6 +386,7 @@ export default {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
.headerTitle { .headerTitle {
font-size: 18px; font-size: 18px;
font-weight: 600; font-weight: 600;
@@ -374,6 +395,7 @@ export default {
margin-left: 24px; margin-left: 24px;
} }
} }
.contentMain { .contentMain {
.main_items { .main_items {
display: flex; display: flex;
@@ -381,23 +403,28 @@ export default {
margin-bottom: 12px; margin-bottom: 12px;
margin-top: 32px; margin-top: 32px;
flex-wrap: wrap; flex-wrap: wrap;
.mi_ipts { .mi_ipts {
display: flex; display: flex;
margin-bottom: 20px; margin-bottom: 20px;
.mii_ipt { .mii_ipt {
display: flex; display: flex;
align-items: center; align-items: center;
margin-right: 24px; margin-right: 24px;
.ipt_name { .ipt_name {
white-space: nowrap; white-space: nowrap;
} }
} }
} }
.mi_btns { .mi_btns {
display: flex; display: flex;
margin-left: 38px; margin-left: 38px;
margin-bottom: 20px; margin-bottom: 20px;
cursor: pointer; cursor: pointer;
.btn { .btn {
padding: 0px 26px 0px 26px; padding: 0px 26px 0px 26px;
height: 38px; height: 38px;
@@ -408,9 +435,11 @@ export default {
justify-content: center; justify-content: center;
margin-left: 14px; margin-left: 14px;
flex-shrink: 0; flex-shrink: 0;
.search { .search {
background-size: 100%; background-size: 100%;
} }
.btnText { .btnText {
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
@@ -418,78 +447,96 @@ export default {
margin-left: 5px; margin-left: 5px;
} }
} }
.btn1 { .btn1 {
background: rgb(64, 158, 255); background: rgb(64, 158, 255);
.search { .search {
width: 15px; width: 15px;
height: 17px; height: 17px;
background-image: url("@/assets/images/coursewareManage/search0.png"); background-image: url("@/assets/images/coursewareManage/search0.png");
} }
.btnText { .btnText {
color: rgb(255, 255, 255); color: rgb(255, 255, 255);
} }
} }
.btn2 { .btn2 {
background: rgb(255, 255, 255); background: rgb(255, 255, 255);
.search { .search {
width: 15px; width: 15px;
height: 17px; height: 17px;
background-image: url("@/assets/images/coursewareManage/reset1.png"); background-image: url("@/assets/images/coursewareManage/reset1.png");
} }
.btnText { .btnText {
color: rgb(64, 158, 255); color: rgb(64, 158, 255);
} }
} }
.btn1:hover { .btn1:hover {
background: rgb(255, 255, 255); background: rgb(255, 255, 255);
.search { .search {
background-image: url("@/assets/images/courseManage/search1.png"); background-image: url("@/assets/images/courseManage/search1.png");
} }
.btnText { .btnText {
color: #388be1; color: #388be1;
} }
} }
.btn2:hover { .btn2:hover {
background: rgba(64, 158, 255, 1); background: rgba(64, 158, 255, 1);
.search { .search {
background-image: url("@/assets/images/courseManage/reset0.png"); background-image: url("@/assets/images/courseManage/reset0.png");
} }
.btnText { .btnText {
color: #ffffff; color: #ffffff;
} }
} }
} }
} }
.main_notice { .main_notice {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
margin-bottom: 32px; margin-bottom: 32px;
height: 40px; height: 40px;
background-color: #e9f6fe; background-color: #e9f6fe;
.mntc_left {
display: flex; .mntc_left {
align-items: center; display: flex;
.title { align-items: center;
color: rgba(0, 0, 0, 0.65);
margin-right: 17px; .title {
} color: rgba(0, 0, 0, 0.65);
.data { margin-right: 17px;
color: #388be1;
}
.notice_icon {
width: 14px;
height: 14px;
margin-right: 9px;
margin-left: 9px;
background-image: url(@/assets/images/coursewareManage/gan.png);
background-size: 100% 100%;
}
}
.mntc_right {
cursor: pointer;
}
} }
.data {
color: #388be1;
}
.notice_icon {
width: 14px;
height: 14px;
margin-right: 9px;
margin-left: 9px;
background-image: url(@/assets/images/coursewareManage/gan.png);
background-size: 100% 100%;
}
}
.mntc_right {
cursor: pointer;
}
}
} }
.main_btns { .main_btns {
@@ -501,6 +548,7 @@ export default {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.16); box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.16);
.btn1 { .btn1 {
width: 100px; width: 100px;
height: 40px; height: 40px;
@@ -510,6 +558,7 @@ export default {
background-color: #fff; background-color: #fff;
cursor: pointer; cursor: pointer;
} }
.btn2 { .btn2 {
cursor: pointer; cursor: pointer;
width: 100px; width: 100px;