|
|
@@ -0,0 +1,999 @@
|
|
|
+<template>
|
|
|
+ <div class="pb_content">
|
|
|
+ <div class="pb_content_body">
|
|
|
+ <div class="student_head">
|
|
|
+ <!-- <img src="../assets/banner.png" alt="" /> -->
|
|
|
+ <el-carousel trigger="click" style="width: 100%; height: 100%">
|
|
|
+ <el-carousel-item v-for="item in bannerList" :key="item.id">
|
|
|
+ <!-- <h3 class="small">{{ item }}</h3> -->
|
|
|
+ <img class="imgS" :src="item.poster" alt="" />
|
|
|
+ </el-carousel-item>
|
|
|
+ </el-carousel>
|
|
|
+ </div>
|
|
|
+ <div class="reBox">
|
|
|
+ <div class="reTop">
|
|
|
+ <div>课程</div>
|
|
|
+ <div>
|
|
|
+ <div class="search" @click="selectAll">
|
|
|
+ <img src="../assets/icon/search.png" alt="" />
|
|
|
+ </div>
|
|
|
+ <input
|
|
|
+ class="sInput"
|
|
|
+ type="text"
|
|
|
+ placeholder="请输入关键字"
|
|
|
+ v-model="sCourse"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="choose">
|
|
|
+ <div
|
|
|
+ class="all_choose"
|
|
|
+ v-for="(item, index) in CourseType[0]"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <span>{{ item.name }}:</span>
|
|
|
+ <div class="typeCss">
|
|
|
+ <div
|
|
|
+ class="cName"
|
|
|
+ @click="getCourse(item.name, '', item.id, 1)"
|
|
|
+ :class="typeE.indexOf(item.id) != -1 ? 'isCType' : ''"
|
|
|
+ >
|
|
|
+ 全部
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-for="(item1, index1) in CourseTypeJson[item.id]"
|
|
|
+ :key="index + '-' + index1"
|
|
|
+ :label="item1.id"
|
|
|
+ @click="getCourse(item.name, item.id, item1.id, 2)"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="cName"
|
|
|
+ :class="
|
|
|
+ typea == item1.id || typeb == item1.id || typed == item1.id || typee == item1.id || typef == item1.id
|
|
|
+ ? 'isCType'
|
|
|
+ : ''
|
|
|
+ "
|
|
|
+ >
|
|
|
+ {{ item1.name }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="body_student">
|
|
|
+ <!-- <div class="top">
|
|
|
+ <div :class="{ active: 0 == zoneListId }" @click="selectAll()">
|
|
|
+ 所有课程
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ :class="{ active: item.id == zoneListId }"
|
|
|
+ v-for="(item, index) in zoneList"
|
|
|
+ :key="index"
|
|
|
+ @click="checkZone(item.id)"
|
|
|
+ >
|
|
|
+ {{ item.name }}
|
|
|
+ </div>
|
|
|
+ </div> -->
|
|
|
+ <div>
|
|
|
+ <div class="main_box">
|
|
|
+ <div
|
|
|
+ class="box_course"
|
|
|
+ v-for="(item, index) in zoneClass"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <div class="wheel">
|
|
|
+ <img
|
|
|
+ :src="
|
|
|
+ item.cover
|
|
|
+ ? JSON.parse(item.cover)[0].url
|
|
|
+ : require('../assets/wheel.png')
|
|
|
+ "
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="middle_white">
|
|
|
+ <div class="textOverflow">{{ item.title }}</div>
|
|
|
+ <div class="nameAndLength">
|
|
|
+ <el-tooltip
|
|
|
+ class="typeN"
|
|
|
+ effect="light"
|
|
|
+ :content="item.typename"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
+ <div>{{ item.typename }}</div>
|
|
|
+ </el-tooltip>
|
|
|
+
|
|
|
+ <div>{{ JSON.parse(item.chapters).length }}阶段</div>
|
|
|
+ </div>
|
|
|
+ <div class="school_box">
|
|
|
+ <el-tooltip
|
|
|
+ effect="light"
|
|
|
+ :content="item.school"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
+ <div class="school">
|
|
|
+ {{ item.school }}
|
|
|
+ </div>
|
|
|
+ </el-tooltip>
|
|
|
+ <div style="color: #b4b4b4">{{ item.utime }}</div>
|
|
|
+ </div>
|
|
|
+ <!-- <div class="people">
|
|
|
+ <div class="man">
|
|
|
+ <img src="../assets/people.png" alt="" />
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ {{
|
|
|
+ item.pNum != null && item.pNum != "" ? item.pNum : "0"
|
|
|
+ }}人学习
|
|
|
+ </div>
|
|
|
+ </div> -->
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="now_study"
|
|
|
+ @click="
|
|
|
+ goTo(
|
|
|
+ '/courseDetailS?courseId=' +
|
|
|
+ item.courseId +
|
|
|
+ '&userid=' +
|
|
|
+ userid +
|
|
|
+ '&oid=' +
|
|
|
+ oid +
|
|
|
+ '&org=' +
|
|
|
+ org +
|
|
|
+ '&cid=' +
|
|
|
+ classId +
|
|
|
+ '&tType=' +
|
|
|
+ tType +
|
|
|
+ '&screenType=' +
|
|
|
+ screenType
|
|
|
+ )
|
|
|
+ "
|
|
|
+ >
|
|
|
+ 立即学习
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="course_empty" v-if="zoneClass.length == 0">
|
|
|
+ 暂无课程
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="student_page"
|
|
|
+ style="margin: 15px 0 0"
|
|
|
+ v-if="zoneClass.length > 0"
|
|
|
+ >
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :page-size="10"
|
|
|
+ :total="total"
|
|
|
+ v-if="page && zoneListId != 0"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :page-size="10"
|
|
|
+ :total="total"
|
|
|
+ v-if="page && zoneListId == 0"
|
|
|
+ @current-change="handleCurrentChange1"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ zoneList: [],
|
|
|
+ zoneClass: [],
|
|
|
+ page: 1,
|
|
|
+ total: 0,
|
|
|
+ isListAjax: false,
|
|
|
+ zoneListId: "",
|
|
|
+ bannerList: [],
|
|
|
+ userid: this.$route.query.userid,
|
|
|
+ oid: this.$route.query.oid,
|
|
|
+ classId: this.$route.query.cid,
|
|
|
+ tType: this.$route.query.tType,
|
|
|
+ org: this.$route.query.org,
|
|
|
+ screenType: this.$route.query.screenType,
|
|
|
+ CourseType: [],
|
|
|
+ CourseTypeJson: {},
|
|
|
+ courseTypeId: {},
|
|
|
+ sCourse: "",
|
|
|
+ isCType: "",
|
|
|
+ typea: "",
|
|
|
+ typeb: "",
|
|
|
+ typed: "",
|
|
|
+ typeE: [],
|
|
|
+ loading: "",
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ goTo(path) {
|
|
|
+ this.$router.push(path);
|
|
|
+ },
|
|
|
+ // getZone() {
|
|
|
+ // this.ajax
|
|
|
+ // .get(this.$store.state.api + "getZone", "")
|
|
|
+ // .then((res) => {
|
|
|
+ // this.zoneList = res.data[0];
|
|
|
+ // // this.zoneListId = this.zoneList[0].id;
|
|
|
+ // // this.getZoneClass(this.zoneList[0].id);
|
|
|
+ // this.selectAll();
|
|
|
+ // })
|
|
|
+ // .catch((err) => {
|
|
|
+ // console.error(err);
|
|
|
+ // });
|
|
|
+ // },
|
|
|
+ //获取专区下的课程
|
|
|
+ getZoneClass(zid) {
|
|
|
+ this.isListAjax = true;
|
|
|
+ // const loading = this.openLoading(document.querySelector(".main_box"));
|
|
|
+ let params = {
|
|
|
+ bid: zid,
|
|
|
+ oid: this.oid,
|
|
|
+ page: this.page,
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "getZoneClassStudent", params)
|
|
|
+ .then((res) => {
|
|
|
+ // loading.close();
|
|
|
+ this.isListAjax = false;
|
|
|
+ this.zoneClass = res.data[0];
|
|
|
+ this.total = res.data[0].length ? res.data[0][0].num : 0;
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getCourse(typeName, ftypeId, typeid, type) {
|
|
|
+ this.page = 1;
|
|
|
+ this.zoneClass = [];
|
|
|
+ if (typeName == "年级") {
|
|
|
+ if (type == 1) {
|
|
|
+ if (this.typeE.indexOf(typeid) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(typeid), 1);
|
|
|
+ } else {
|
|
|
+ this.typeE.push(typeid);
|
|
|
+ if (this.typea != "") {
|
|
|
+ this.typea = "";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (this.typea == typeid) {
|
|
|
+ this.typea = "";
|
|
|
+ } else {
|
|
|
+ this.typea = typeid;
|
|
|
+ if (this.typeE.indexOf(ftypeId) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(ftypeId), 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else if (typeName == "专栏") {
|
|
|
+ if (type == 1) {
|
|
|
+ if (this.typeE.indexOf(typeid) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(typeid), 1);
|
|
|
+ } else {
|
|
|
+ this.typeE.push(typeid);
|
|
|
+ if (this.typeb != "") {
|
|
|
+ this.typeb = "";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (this.typeb == typeid) {
|
|
|
+ this.typeb = "";
|
|
|
+ } else {
|
|
|
+ this.typeb = typeid;
|
|
|
+ if (this.typeE.indexOf(ftypeId) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(ftypeId), 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else if (typeName == "栏目") {
|
|
|
+ if (type == 1) {
|
|
|
+ if (this.typeE.indexOf(typeid) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(typeid), 1);
|
|
|
+ } else {
|
|
|
+ this.typeE.push(typeid);
|
|
|
+ if (this.typeb != "") {
|
|
|
+ this.typeb = "";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (this.typeb == typeid) {
|
|
|
+ this.typeb = "";
|
|
|
+ } else {
|
|
|
+ this.typeb = typeid;
|
|
|
+ if (this.typeE.indexOf(ftypeId) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(ftypeId), 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else if (typeName == "主题") {
|
|
|
+ if (type == 1) {
|
|
|
+ if (this.typeE.indexOf(typeid) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(typeid), 1);
|
|
|
+ } else {
|
|
|
+ this.typeE.push(typeid);
|
|
|
+ if (this.typed != "") {
|
|
|
+ this.typed = "";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (this.typed == typeid) {
|
|
|
+ this.typed = "";
|
|
|
+ } else {
|
|
|
+ this.typed = typeid;
|
|
|
+ if (this.typeE.indexOf(ftypeId) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(ftypeId), 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else if (typeName == "赛道") {
|
|
|
+ if (type == 1) {
|
|
|
+ if (this.typeE.indexOf(typeid) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(typeid), 1);
|
|
|
+ } else {
|
|
|
+ this.typeE.push(typeid);
|
|
|
+ if (this.typef != "") {
|
|
|
+ this.typef = "";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (this.typef == typeid) {
|
|
|
+ this.typef = "";
|
|
|
+ } else {
|
|
|
+ this.typef = typeid;
|
|
|
+ if (this.typeE.indexOf(ftypeId) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(ftypeId), 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else if (typeName == "学院") {
|
|
|
+ if (type == 1) {
|
|
|
+ if (this.typeE.indexOf(typeid) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(typeid), 1);
|
|
|
+ } else {
|
|
|
+ this.typeE.push(typeid);
|
|
|
+ if (this.typeb != "") {
|
|
|
+ this.typeb = "";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (this.typeb == typeid) {
|
|
|
+ this.typeb = "";
|
|
|
+ } else {
|
|
|
+ this.typeb = typeid;
|
|
|
+ if (this.typeE.indexOf(ftypeId) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(ftypeId), 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else if (typeName == "学科") {
|
|
|
+ if (type == 1) {
|
|
|
+ if (this.typeE.indexOf(typeid) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(typeid), 1);
|
|
|
+ } else {
|
|
|
+ this.typeE.push(typeid);
|
|
|
+ if (this.typed != "") {
|
|
|
+ this.typed = "";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (this.typed == typeid) {
|
|
|
+ this.typed = "";
|
|
|
+ } else {
|
|
|
+ this.typed = typeid;
|
|
|
+ if (this.typeE.indexOf(ftypeId) != -1) {
|
|
|
+ this.typeE.splice(this.typeE.indexOf(ftypeId), 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.loading = this.openLoading(document.querySelector(".main_box"));
|
|
|
+ if (!this.loading) {
|
|
|
+ this.loading = this.openLoading(document.querySelector(".main_box"));
|
|
|
+ }
|
|
|
+ this.selectAll();
|
|
|
+ },
|
|
|
+ selectAll() {
|
|
|
+ this.zoneListId = 0;
|
|
|
+ this.isListAjax = true;
|
|
|
+ // this.loading = this.openLoading(document.querySelector(".main_box"));
|
|
|
+ // if (!this.loading) {
|
|
|
+ // this.loading = this.openLoading(document.querySelector(".main_box"));
|
|
|
+ // }
|
|
|
+ let params = {
|
|
|
+ type: '2',
|
|
|
+ uid: this.userid,
|
|
|
+ oid: this.oid,
|
|
|
+ org: this.org,
|
|
|
+ typea: this.typea != undefined ? this.typea : "",
|
|
|
+ typeb: this.typeb != undefined ? this.typeb : "",
|
|
|
+ typec: this.typec != undefined ? this.typec : "",
|
|
|
+ typed: this.typed != undefined ? this.typed : "",
|
|
|
+ typef: this.typef != undefined ? this.typef : "",
|
|
|
+ typeE: this.typeE.join(","),
|
|
|
+ cu: "",
|
|
|
+ cn: "",
|
|
|
+ page: this.page,
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "selectStudentCourseNew22", params)
|
|
|
+ .then((res) => {
|
|
|
+ if (this.loading) {
|
|
|
+ this.loading.close();
|
|
|
+ this.loading = "";
|
|
|
+ }
|
|
|
+ this.isListAjax = false;
|
|
|
+ this.zoneClass = res.data[0];
|
|
|
+ this.total = res.data[0].length ? res.data[0][0].num : 0;
|
|
|
+
|
|
|
+ // this.selectType({
|
|
|
+ // data: [res.data[1], res.data[2], res.data[3], res.data[4]],
|
|
|
+ // });
|
|
|
+ this.selectAllType();
|
|
|
+ // this.getBanner({
|
|
|
+ // data: [res.data[6], res.data[5], res.data[7]],
|
|
|
+ // });
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ checkZone(id) {
|
|
|
+ this.page = 1;
|
|
|
+ this.zoneListId = id;
|
|
|
+ this.getZoneClass(id);
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.page = val;
|
|
|
+ this.getZoneClass(this.zoneListId);
|
|
|
+ },
|
|
|
+ handleCurrentChange1(val) {
|
|
|
+ if (!this.loading) {
|
|
|
+ this.loading = this.openLoading(document.querySelector(".main_box"));
|
|
|
+ }
|
|
|
+ this.page = val;
|
|
|
+ this.selectAll();
|
|
|
+ },
|
|
|
+ //获取banner
|
|
|
+ getBanner(res) {
|
|
|
+ // var a = false;
|
|
|
+ // if (this.org == "eb2af5e9-ac3d-46b6-9fe3-3c1c364f018d") {
|
|
|
+ // a = true;
|
|
|
+ // }
|
|
|
+ // let params = {
|
|
|
+ // oid: this.org,
|
|
|
+ // };
|
|
|
+ // this.ajax
|
|
|
+ // .get(this.$store.state.api + "selectBannerByOid", params)
|
|
|
+ // .then((res) => {
|
|
|
+ if (res.data[0].length > 0) {
|
|
|
+ this.bannerList = res.data[0];
|
|
|
+ } else {
|
|
|
+ this.getBannerByOid({
|
|
|
+ data: [res.data[1], res.data[2]],
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // })
|
|
|
+ // .catch((err) => {
|
|
|
+ // console.error(err);
|
|
|
+ // });
|
|
|
+ },
|
|
|
+ getBannerByOid(res) {
|
|
|
+ // let params = {
|
|
|
+ // oid: this.oid,
|
|
|
+ // };
|
|
|
+ // this.ajax
|
|
|
+ // .get(this.$store.state.api + "selectBannerByOid", params)
|
|
|
+ // .then((res) => {
|
|
|
+ if (res.data[0].length > 0) {
|
|
|
+ this.bannerList = res.data[0];
|
|
|
+ } else {
|
|
|
+ this.getOldBanner({
|
|
|
+ data: [res.data[1]],
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // })
|
|
|
+ // .catch((err) => {
|
|
|
+ // console.error(err);
|
|
|
+ // });
|
|
|
+ },
|
|
|
+ getOldBanner(res) {
|
|
|
+ // this.ajax
|
|
|
+ // .get(this.$store.state.api + "getBanner", "")
|
|
|
+ // .then((res) => {
|
|
|
+ this.bannerList = res.data[0];
|
|
|
+ // })
|
|
|
+ // .catch((err) => {
|
|
|
+ // console.error(err);
|
|
|
+ // });
|
|
|
+ },
|
|
|
+ selectAllType() {
|
|
|
+ let params = {
|
|
|
+ org: this.org && this.org != "" ? this.org : "",
|
|
|
+ oid: this.oid && this.oid != "" ? this.oid : "",
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "selectStudentType", params)
|
|
|
+ .then((res) => {
|
|
|
+ this.CourseTypeJson = {};
|
|
|
+ this.CourseType = res.data;
|
|
|
+ for (var i = 0; i < res.data[0].length; i++) {
|
|
|
+ if (!this.cid) {
|
|
|
+ this.courseTypeId[res.data[0][i].id] = "";
|
|
|
+ }
|
|
|
+ if (!this.CourseTypeJson[res.data[0][i].id]) {
|
|
|
+ this.CourseTypeJson[res.data[0][i].id] = [];
|
|
|
+ }
|
|
|
+
|
|
|
+ // if (res.data[2].length == 0 && res.data[3].length == 0) {
|
|
|
+ for (var j = 0; j < res.data[1].length; j++) {
|
|
|
+ if (res.data[0][i].id == res.data[1][j].pid) {
|
|
|
+ if (!this.CourseTypeJson[res.data[0][i].id]) {
|
|
|
+ this.CourseTypeJson[res.data[0][i].id] = [];
|
|
|
+ }
|
|
|
+ this.CourseTypeJson[res.data[0][i].id].push(res.data[1][j]); // 去除公共分类
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // } else {
|
|
|
+ // if (res.data[2].length > 0) {
|
|
|
+ // for (var j = 0; j < res.data[2].length; j++) {
|
|
|
+ // if (res.data[0][i].id == res.data[2][j].pid) {
|
|
|
+ // this.CourseTypeJson[res.data[0][i].id].push(res.data[2][j]); // 去除公共分类
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // if (res.data[3].length > 0) {
|
|
|
+ // for (var j = 0; j < res.data[3].length; j++) {
|
|
|
+ // if (res.data[0][i].id == res.data[3][j].pid) {
|
|
|
+ // this.CourseTypeJson[res.data[0][i].id].push(res.data[3][j]); // 去除公共分类
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ }
|
|
|
+ this.$forceUpdate();
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ selectType(res) {
|
|
|
+ // this.ajax
|
|
|
+ // .get(this.$store.state.api + "selectType")
|
|
|
+ // .then((res) => {
|
|
|
+ this.CourseTypeJson = {};
|
|
|
+ this.CourseType = res.data;
|
|
|
+ for (var i = 0; i < res.data[0].length; i++) {
|
|
|
+ if (!this.cid) {
|
|
|
+ this.courseTypeId[res.data[0][i].id] = "";
|
|
|
+ }
|
|
|
+ if (this.oid == "69893dca-1d47-11ed-8c78-005056b86db5") {
|
|
|
+ if (res.data[0][i].name == "栏目") {
|
|
|
+ this.CourseType[0][i].name = "主题";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for (var j = 0; j < res.data[1].length; j++) {
|
|
|
+ if (res.data[0][i].id == res.data[1][j].pid) {
|
|
|
+ if (!this.CourseTypeJson[res.data[0][i].id]) {
|
|
|
+ this.CourseTypeJson[res.data[0][i].id] = [];
|
|
|
+ }
|
|
|
+ this.CourseTypeJson[res.data[0][i].id].push(res.data[1][j]); // 去除公共分类
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.selectTypeByOid({ data: [res.data[0], res.data[2]] });
|
|
|
+ this.selectTypeByOrg({ data: [res.data[0], res.data[3]] });
|
|
|
+ // })
|
|
|
+ // .catch((err) => {
|
|
|
+ // console.error(err);
|
|
|
+ // });
|
|
|
+ },
|
|
|
+ selectTypeByOid(res) {
|
|
|
+ // let params = {
|
|
|
+ // oid: this.oid,
|
|
|
+ // };
|
|
|
+ // this.ajax
|
|
|
+ // .get(this.$store.state.api + "selectTypeByOid", params)
|
|
|
+ // .then((res) => {
|
|
|
+ for (var i = 0; i < res.data[0].length; i++) {
|
|
|
+ for (var j = 0; j < res.data[1].length; j++) {
|
|
|
+ if (res.data[0][i].id == res.data[1][j].pid) {
|
|
|
+ if (!this.CourseTypeJson[res.data[0][i].id]) {
|
|
|
+ this.CourseTypeJson[res.data[0][i].id] = [];
|
|
|
+ }
|
|
|
+ this.CourseTypeJson[res.data[0][i].id].push(res.data[1][j]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$forceUpdate();
|
|
|
+ // })
|
|
|
+ // .catch((err) => {
|
|
|
+ // console.error(err);
|
|
|
+ // });
|
|
|
+ },
|
|
|
+ selectTypeByOrg(res) {
|
|
|
+ // let params = {
|
|
|
+ // oid: this.org,
|
|
|
+ // };
|
|
|
+ // this.ajax
|
|
|
+ // .get(this.$store.state.api + "selectTypeByOrg", params)
|
|
|
+ // .then((res) => {
|
|
|
+ for (var i = 0; i < res.data[0].length; i++) {
|
|
|
+ for (var j = 0; j < res.data[1].length; j++) {
|
|
|
+ if (res.data[0][i].id == res.data[1][j].pid) {
|
|
|
+ if (!this.CourseTypeJson[res.data[0][i].id]) {
|
|
|
+ this.CourseTypeJson[res.data[0][i].id] = [];
|
|
|
+ }
|
|
|
+ this.CourseTypeJson[res.data[0][i].id].push(res.data[1][j]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$forceUpdate();
|
|
|
+ // })
|
|
|
+ // .catch((err) => {
|
|
|
+ // console.error(err);
|
|
|
+ // });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ beforeDestroy() {
|
|
|
+ clearInterval(this.timer);
|
|
|
+ this.timer = null;
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.loading = this.openLoading(document.querySelector(".main_box"));
|
|
|
+ // this.selectType();
|
|
|
+ this.selectAll();
|
|
|
+ // this.getBanner();
|
|
|
+ this.timer = setInterval(() => {
|
|
|
+ this.selectAll();
|
|
|
+ // this.getBanner();
|
|
|
+ }, 5000);
|
|
|
+ document.scrollingElement.scrollTop = 0;
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+@media screen and (max-width: 1024px) {
|
|
|
+ .box_course {
|
|
|
+ margin: 0px 5px 20px 5px !important;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.student_head .imgS {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ cursor: pointer;
|
|
|
+ object-fit: cover;
|
|
|
+}
|
|
|
+
|
|
|
+.top {
|
|
|
+ padding: 20px 30px 20px 1%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.top div {
|
|
|
+ cursor: pointer;
|
|
|
+ box-sizing: border-box;
|
|
|
+ height: 35px;
|
|
|
+ line-height: 35px;
|
|
|
+ margin: 0 10px 0 0;
|
|
|
+ padding-bottom: 5px;
|
|
|
+ width: 80px;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.top .active {
|
|
|
+ border-bottom: 3px solid #0e71e6;
|
|
|
+}
|
|
|
+
|
|
|
+.isactive {
|
|
|
+ border-bottom: 3px solid #0e71e6;
|
|
|
+}
|
|
|
+
|
|
|
+.box_fk {
|
|
|
+ width: 8px;
|
|
|
+ height: 21px;
|
|
|
+ background: #0e71e6;
|
|
|
+ margin-right: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.wheel {
|
|
|
+ width: 100%;
|
|
|
+ height: 140px;
|
|
|
+}
|
|
|
+
|
|
|
+.man {
|
|
|
+ width: 16px;
|
|
|
+ height: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.wheel > img,
|
|
|
+.man > img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ object-fit: cover;
|
|
|
+}
|
|
|
+
|
|
|
+.box_course {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ margin: 0px 1% 20px;
|
|
|
+ width: 300px;
|
|
|
+ height: 260px;
|
|
|
+ /*border: 1px solid #cecece; */
|
|
|
+ border-radius: 10px;
|
|
|
+ overflow: hidden;
|
|
|
+ box-shadow: 0px 1px 3px 0px rgb(0 0 0 / 20%), 0px 1px 1px 0px rgb(0 0 0 / 14%),
|
|
|
+ 0px 2px 1px -1px rgb(0 0 0 / 12%);
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+
|
|
|
+.middle_white {
|
|
|
+ font-size: 14px;
|
|
|
+ margin: 5px 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.people {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.people > div:nth-child(2) {
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.now_study {
|
|
|
+ width: 100%;
|
|
|
+ height: 40px;
|
|
|
+ color: #fff;
|
|
|
+ background: #4a9eed;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 40px;
|
|
|
+ font-size: 13px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.now_study:hover {
|
|
|
+ background: #205cc6;
|
|
|
+}
|
|
|
+
|
|
|
+.main_box {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ justify-content: flex-start;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+.right_bottom_flex {
|
|
|
+ width: 219px;
|
|
|
+ height: 144px;
|
|
|
+ margin: auto 0;
|
|
|
+}
|
|
|
+
|
|
|
+.right_bottom_flex > img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.body_student {
|
|
|
+ margin: 10px auto;
|
|
|
+ width: 91.5%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.student_head {
|
|
|
+ width: 100%;
|
|
|
+ /* height: 30%; */
|
|
|
+}
|
|
|
+
|
|
|
+.textOverflow {
|
|
|
+ padding: 0 5px 0 0px;
|
|
|
+ width: 95%;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.student_page {
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.course_empty {
|
|
|
+ width: 100%;
|
|
|
+ height: 200px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+
|
|
|
+.choose {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ height: 100%;
|
|
|
+ justify-content: space-evenly;
|
|
|
+ align-items: flex-start;
|
|
|
+ padding: 10px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.all_choose {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: baseline;
|
|
|
+ margin: 10px 0;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.all_choose > span {
|
|
|
+ min-width: 80px;
|
|
|
+ display: block;
|
|
|
+ letter-spacing: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+.all_choose > span:nth-child(1) {
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+.all_choose >>> .el-checkbox-group {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ width: 820px;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ align-content: center;
|
|
|
+ justify-content: flex-start;
|
|
|
+ align-items: center;
|
|
|
+ margin-top: 3px;
|
|
|
+}
|
|
|
+
|
|
|
+.all_choose > .el-checkbox-group >>> .el-checkbox {
|
|
|
+ margin-bottom: 10px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.all_choose > .el-checkbox-group > .el-checkbox >>> .el-checkbox__label {
|
|
|
+ min-width: 80px;
|
|
|
+ overflow: hidden;
|
|
|
+ width: 80px;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+
|
|
|
+.all_choose > .el-checkbox-group > .el-checkbox >>> .el-checkbox__label:hover {
|
|
|
+ width: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.cName {
|
|
|
+ cursor: pointer;
|
|
|
+ margin: 0 10px 10px 0;
|
|
|
+ color: #b9b6b9;
|
|
|
+ min-width: 80px;
|
|
|
+ width: 80px;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+}
|
|
|
+
|
|
|
+.reBox {
|
|
|
+ position: relative;
|
|
|
+ top: -25px;
|
|
|
+ z-index: 999;
|
|
|
+ left: 5%;
|
|
|
+ background: #fff;
|
|
|
+ width: 90%;
|
|
|
+ border-radius: 5px;
|
|
|
+ padding-left: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.reTop {
|
|
|
+ padding: 20px 0 0 0;
|
|
|
+ border-bottom: 1px solid #eee;
|
|
|
+ width: 98%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+
|
|
|
+.reTop > div:nth-child(1) {
|
|
|
+ font-weight: bold;
|
|
|
+ width: 40px;
|
|
|
+ border-bottom: 1px solid #205cc6;
|
|
|
+ padding-bottom: 20px;
|
|
|
+ color: #205cc6;
|
|
|
+ font-size: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.reTop > div:nth-child(2) {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ border: 1px solid #ccced3;
|
|
|
+ width: 300px;
|
|
|
+ border-radius: 8px;
|
|
|
+ padding: 5px 0;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.search {
|
|
|
+ width: 20px;
|
|
|
+ padding: 0 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.search > img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.sInput {
|
|
|
+ border: none;
|
|
|
+ width: 85%;
|
|
|
+}
|
|
|
+
|
|
|
+.sInput:focus-visible {
|
|
|
+ outline: none;
|
|
|
+}
|
|
|
+
|
|
|
+.nameAndLength {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin: 5px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.typeN {
|
|
|
+ width: 200px;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+}
|
|
|
+
|
|
|
+.isCType {
|
|
|
+ color: #6282c2;
|
|
|
+}
|
|
|
+
|
|
|
+.typeCss {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ justify-content: flex-start;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.school {
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ max-width: 50%;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.school_box {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+</style>
|
