|
@@ -0,0 +1,432 @@
|
|
|
+<template>
|
|
|
+ <div id="courseContent">
|
|
|
+ <div style="margin-bottom: 20px">
|
|
|
+ <el-button
|
|
|
+ v-if="!submitStatusInfo"
|
|
|
+ @click="addCourse"
|
|
|
+ size="small"
|
|
|
+ :disabled="tableData.length > 0 && tableData[0].type > 0"
|
|
|
+ >添加课程</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ v-if="!submitStatusInfo"
|
|
|
+ @click="addMoreList"
|
|
|
+ size="small"
|
|
|
+ :disabled="
|
|
|
+ tableData.length > 0 && tableData[0].courseName ? true : false
|
|
|
+ "
|
|
|
+ >添加模块/章/节</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ @click="openAudition"
|
|
|
+ type="success"
|
|
|
+ size="small"
|
|
|
+ v-if="tableData.length > 0"
|
|
|
+ >试听设置</el-button
|
|
|
+ >
|
|
|
+ <el-button type="primary" @click="openPlayPhotoSet" size="small"
|
|
|
+ >播放和拍照设置</el-button
|
|
|
+ >
|
|
|
+ <el-button type="primary" @click="openStyleNumSet" size="small"
|
|
|
+ >每天学习限制</el-button
|
|
|
+ >
|
|
|
+ <el-button type="primary" @click="openHandoutSet" size="small"
|
|
|
+ >关联讲义</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ border
|
|
|
+ :header-cell-style="{
|
|
|
+ 'background-color': '#eee',
|
|
|
+ padding: '8px',
|
|
|
+ color: '#333',
|
|
|
+ }"
|
|
|
+ :default-sort="{ prop: 'sort', order: 'ascending' }"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ v-for="(item, index) in compayTypes(tableSetVideo)"
|
|
|
+ :width="item.width"
|
|
|
+ :key="index"
|
|
|
+ :label="item.label"
|
|
|
+ align="center"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ header-align="center"
|
|
|
+ :sortable="item.prop === 'sort'"
|
|
|
+ sort-by="sort"
|
|
|
+ :prop="item.prop"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span v-if="item.scope === 'types'">{{
|
|
|
+ scope.row[item.prop] === 1
|
|
|
+ ? "录播"
|
|
|
+ : scope.row[item.prop] === 2
|
|
|
+ ? "直播"
|
|
|
+ : scope.row[item.prop] === 3
|
|
|
+ ? "回放"
|
|
|
+ : "未知"
|
|
|
+ }}</span>
|
|
|
+ <span v-else-if="item.scope === 'type'">{{
|
|
|
+ scope.row[item.prop] === 1
|
|
|
+ ? "模块"
|
|
|
+ : scope.row[item.prop] === 2
|
|
|
+ ? "章"
|
|
|
+ : scope.row[item.prop] === 3
|
|
|
+ ? "节"
|
|
|
+ : "未知"
|
|
|
+ }}</span>
|
|
|
+ <span v-else-if="item.scope === 'busin'">
|
|
|
+ {{ scope.row[item.prop1] + " - " + scope.row[item.prop2] }}
|
|
|
+ </span>
|
|
|
+ <span v-else-if="item.scope === 'Status'">
|
|
|
+ {{
|
|
|
+ scope.row[item.prop] === 1
|
|
|
+ ? "发布"
|
|
|
+ : scope.row[item.prop] === 0
|
|
|
+ ? "未发布"
|
|
|
+ : "未知"
|
|
|
+ }}
|
|
|
+ </span>
|
|
|
+ <div v-else-if="item.scope === 'inputs'">
|
|
|
+ <el-input-number
|
|
|
+ style="width: 50px"
|
|
|
+ size="small"
|
|
|
+ :controls="false"
|
|
|
+ v-model="scope.row[item.prop]"
|
|
|
+ controls-position="right"
|
|
|
+ :min="0"
|
|
|
+ ></el-input-number>
|
|
|
+ </div>
|
|
|
+ <span v-else>{{ scope.row[item.prop] }}</span></template
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="操作"
|
|
|
+ align="center"
|
|
|
+ fixed="right"
|
|
|
+ width="100px"
|
|
|
+ v-if="!submitStatusInfo"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button type="text" @click="delCourse(scope.row)">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <popple-set
|
|
|
+ :key="Math.random()"
|
|
|
+ ref="poppleSet"
|
|
|
+ @uploadArrays="uploadArrays"
|
|
|
+ />
|
|
|
+ <course-check ref="courseCheck" @backData="backVideoData" />
|
|
|
+ <more-list-check
|
|
|
+ ref="moreListCheck"
|
|
|
+ @backData="backMoreListData"
|
|
|
+ :bfCourseId="bfCourseId"
|
|
|
+ />
|
|
|
+ <play-photo ref="playPhoto" @backData="backPlayPhotoData" />
|
|
|
+ <every-day-study-num ref="everyDayStudyNum" @backData="backEveryDaySet" />
|
|
|
+ <handout-view ref="handoutView" @backData="backHandoutView" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import poppleSet from "../../poppleSet.vue";
|
|
|
+import courseCheck from "./courseCheck.vue";
|
|
|
+import moreListCheck from "./moreListCheck.vue";
|
|
|
+import playPhoto from "./playPhoto.vue";
|
|
|
+import everyDayStudyNum from "./everyDayStudyNum.vue";
|
|
|
+import handoutView from "./handoutView.vue";
|
|
|
+
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ poppleSet,
|
|
|
+ courseCheck,
|
|
|
+ moreListCheck,
|
|
|
+ playPhoto,
|
|
|
+ everyDayStudyNum,
|
|
|
+ handoutView,
|
|
|
+ },
|
|
|
+ props: ["listData", "submitStatusInfo"],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ tableSetVideo: [
|
|
|
+ { label: "排序", prop: "sort", scope: "inputs", width: "100" },
|
|
|
+ { label: "编码", prop: "code", width: "140" },
|
|
|
+ { label: "课程名称", prop: "courseName", width: "300", type: 1 },
|
|
|
+ { label: "类型", prop: "type", width: "190", type: 2, scope: "type" },
|
|
|
+ { label: "名称", prop: "menuName", width: "300", type: 2 },
|
|
|
+ { label: "科目", prop: "subjectName", width: "150", type: 1 },
|
|
|
+ { label: "专业", prop: "categoryName", type: 1 },
|
|
|
+ { label: "院校", prop: "schoolName", width: "150", type: 1 },
|
|
|
+ // {
|
|
|
+ // label: "业务层次",
|
|
|
+ // prop1: "projectName",
|
|
|
+ // prop2: "businessName",
|
|
|
+ // scope: "busin",
|
|
|
+ // width: "350px",
|
|
|
+ // type: 1,
|
|
|
+ // },
|
|
|
+ // { label: "教育类型", prop: "educationName", width: "160", type: 1 },
|
|
|
+ {
|
|
|
+ label: "发布状态",
|
|
|
+ prop: "publishStatus",
|
|
|
+ scope: "Status",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ tableData: [],
|
|
|
+ auditionList: [], //试听数据
|
|
|
+ bfCourseId: 0,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ tableData(val) {
|
|
|
+ if (val.length === 0) {
|
|
|
+ this.auditionList = [];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ compayTypes: function () {
|
|
|
+ return function (array) {
|
|
|
+ let ary = [];
|
|
|
+ ary = array.filter((item) => {
|
|
|
+ if (this.tableData.length > 0) {
|
|
|
+ if (this.tableData[0].type) {
|
|
|
+ return item.type !== 1;
|
|
|
+ } else {
|
|
|
+ return item.type !== 2;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return item;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return ary;
|
|
|
+ };
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.$bus.$on("sendBybus", () => {
|
|
|
+ this.tableData = [];
|
|
|
+ });
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ /**
|
|
|
+ * 获取初始课程列表
|
|
|
+ */
|
|
|
+ getBybusCoursetableData(id) {
|
|
|
+ this.$api.obtainCourseSgoodsId(id).then((res) => {
|
|
|
+ if (res.rows.length === 1 && res.rows[0].courseShow === 0) {
|
|
|
+ this.bfCourseId = res.rows[0].courseId;
|
|
|
+ this.getMoreList(res.rows[0].courseId);
|
|
|
+ this.auditionList.forEach((item) => {
|
|
|
+ item.courseId = res.rows[0].courseId;
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.tableData = res.rows;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 获取商品模块/章/节列表
|
|
|
+ */
|
|
|
+ getMoreList(id) {
|
|
|
+ this.$api.inquireCoursemenuListS({ courseId: id }).then((res) => {
|
|
|
+ res.rows.forEach((item) => {
|
|
|
+ item.auditionMinute = this.$methodsTools.secondToDate(
|
|
|
+ item.durationTime,
|
|
|
+ false
|
|
|
+ );
|
|
|
+ item.name = item.menuName;
|
|
|
+ });
|
|
|
+ this.tableData = res.rows;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 获取初始课程试听列表
|
|
|
+ */
|
|
|
+ getBybusCourseAudition(audition) {
|
|
|
+ this.auditionList = audition;
|
|
|
+ console.log(audition);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 点击添加函数
|
|
|
+ */
|
|
|
+ addCourse() {
|
|
|
+ //搜索条件
|
|
|
+ var data = {
|
|
|
+ businessId: this.listData.businessId,
|
|
|
+ subjectIds: this.listData.subjectIds.toString(),
|
|
|
+ status: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ pageNum: 1,
|
|
|
+ publishStatus: 1,
|
|
|
+ };
|
|
|
+ //已选课程
|
|
|
+ var aList = this.tableData.map((item) => {
|
|
|
+ return item.courseId;
|
|
|
+ });
|
|
|
+ //打开选择课程组件
|
|
|
+ this.$refs.courseCheck.openBox(
|
|
|
+ data,
|
|
|
+ aList,
|
|
|
+ this.listData.educationTypeId
|
|
|
+ );
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 选择课程回调数据
|
|
|
+ */
|
|
|
+ backVideoData(array) {
|
|
|
+ let copyData = JSON.parse(JSON.stringify(array));
|
|
|
+ if (this.tableData.length) {
|
|
|
+ let maxIndex = 0;
|
|
|
+ this.tableData.forEach((item) => {
|
|
|
+ if (item.sort > maxIndex) {
|
|
|
+ maxIndex = item.sort;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ copyData.forEach((item, index) => {
|
|
|
+ item.sort = maxIndex + index + 1;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ copyData.forEach((item, index) => {
|
|
|
+ item.sort = index + 1;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.tableData = this.tableData.concat(copyData);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 删除课程
|
|
|
+ */
|
|
|
+ delCourse(item) {
|
|
|
+ if (this.tableData[0].type) {
|
|
|
+ const FINDINDEX = this.tableData.findIndex((items) => {
|
|
|
+ return items.type === item.type && item.menuId === item.menuId;
|
|
|
+ });
|
|
|
+ this.tableData.splice(FINDINDEX, 1);
|
|
|
+ this.auditionList = this.auditionList.filter((items) => {
|
|
|
+ return items.TypeId !== item.TypeId;
|
|
|
+ });
|
|
|
+ this.$message.success("删除成功");
|
|
|
+ } else {
|
|
|
+ const FINDINDEX = this.tableData.findIndex((items) => {
|
|
|
+ return items.courseId === item.courseId;
|
|
|
+ });
|
|
|
+ this.tableData.splice(FINDINDEX, 1);
|
|
|
+ this.auditionList = this.auditionList.filter((items) => {
|
|
|
+ return items.courseId !== item.courseId;
|
|
|
+ });
|
|
|
+ this.$message.success("删除成功");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 点击添加函数
|
|
|
+ */
|
|
|
+ addMoreList() {
|
|
|
+ //搜索条件
|
|
|
+ var data = {
|
|
|
+ businessId: this.listData.businessId,
|
|
|
+ subjectIds: this.listData.subjectIds.toString(),
|
|
|
+ status: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ pageNum: 1,
|
|
|
+ publishStatus: 1,
|
|
|
+ };
|
|
|
+ //已选模块/章/节
|
|
|
+ var aList = this.tableData.map((item) => {
|
|
|
+ return `${item.type}-${item.menuId}`;
|
|
|
+ });
|
|
|
+ //打开选择模块/章/节组件
|
|
|
+ this.$refs.moreListCheck.openBox(
|
|
|
+ data,
|
|
|
+ aList,
|
|
|
+ this.listData.educationTypeId
|
|
|
+ );
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 选择模块/章/节回调数据
|
|
|
+ */
|
|
|
+ backMoreListData(array) {
|
|
|
+ let copyData = JSON.parse(JSON.stringify(array));
|
|
|
+ if (this.tableData.length) {
|
|
|
+ let maxIndex = 0;
|
|
|
+ this.tableData.forEach((item) => {
|
|
|
+ if (item.sort > maxIndex) {
|
|
|
+ maxIndex = item.sort;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ copyData.forEach((item, index) => {
|
|
|
+ item.sort = maxIndex + index + 1;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ copyData.forEach((item, index) => {
|
|
|
+ item.sort = index + 1;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.tableData = this.tableData.concat(copyData);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 点击试听函数
|
|
|
+ */
|
|
|
+ openAudition() {
|
|
|
+ console.log(this.tableData, this.auditionList);
|
|
|
+ this.$refs.poppleSet.openExpand(this.tableData, this.auditionList);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 试听回调数据
|
|
|
+ */
|
|
|
+ uploadArrays(arrays) {
|
|
|
+ this.auditionList = arrays;
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 点击播放和拍照设置函数
|
|
|
+ */
|
|
|
+ openPlayPhotoSet() {
|
|
|
+ this.$refs.playPhoto.openBox(this.listData);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 播放和拍照设置回调数据
|
|
|
+ */
|
|
|
+ backPlayPhotoData(obj) {
|
|
|
+ this.$set(this.listData, "playConfig", obj.playConfig);
|
|
|
+ this.$set(this.listData, "photographConfig", obj.photographConfig);
|
|
|
+ this.$set(
|
|
|
+ this.listData,
|
|
|
+ "goodsPhotographExamConfig",
|
|
|
+ obj.goodsPhotographExamConfig
|
|
|
+ );
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 点击学习限制函数
|
|
|
+ */
|
|
|
+ openStyleNumSet() {
|
|
|
+ this.$refs.everyDayStudyNum.openBox(this.listData.sectionMaxNum);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 学习限制回调数据
|
|
|
+ */
|
|
|
+ backEveryDaySet(num) {
|
|
|
+ this.$set(this.listData, "sectionMaxNum", num);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 点击选择讲义函数
|
|
|
+ */
|
|
|
+ openHandoutSet() {
|
|
|
+ if (!this.listData.businessId) {
|
|
|
+ this.$message.warning("请选择业务层次");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ console.log(this.listData);
|
|
|
+ this.$refs.handoutView.openBox(this.listData.handoutsId);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 讲义回调数据
|
|
|
+ */
|
|
|
+ backHandoutView(id) {
|
|
|
+ this.$set(this.listData, "handoutsId", id);
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+</style>
|