Files
nuttyreading-master-html/src/views/modules/course/courseCatalogue.vue
2024-06-12 16:41:22 +08:00

459 lines
13 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<div class="mod-config">
<el-form
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<!-- <el-form-item label="课程目录名称">
<el-input v-model="query.keywords" placeholder="课程目录名称" clearable></el-input>
</el-form-item> -->
<el-form-item>
<el-button
@click="
pageIndex = 1;
getDataList();
"
>查询</el-button
>
<el-button type="primary" @click="addOrUpdateHandle()">新增</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
border
v-loading="dataListLoading"
style="width: 100%;"
>
<el-table-column
prop="title"
header-align="center"
align="center"
label="目录名称"
>
</el-table-column>
<el-table-column
prop="sort"
header-align="center"
align="center"
label="收费类型"
width="100"
>
<template slot-scope="scope">
<div v-if="scope.row.type == 0">免费</div>
<div v-if="scope.row.type == 1">普通收费</div>
<div v-if="scope.row.type == 2">超v课程</div>
</template>
</el-table-column>
<el-table-column
prop="sort"
header-align="center"
align="center"
label="价格(半年/一年)"
width="160"
>
<template slot-scope="scope">
<div>{{ scope.row.halfFee }} / {{ scope.row.fee }}</div>
</template>
</el-table-column>
<el-table-column
prop="sort"
header-align="center"
align="center"
label="关联商品"
width="500"
>
<template slot-scope="scope">
<div v-for="(item, i) in scope.row.productList">
{{ item.productName }}
<span style="color: #ff5b36;"
>{{ item.activePrice ? item.activePrice : item.price }}</span
>
<span
style="color: #9c9a9b;text-decoration:line-through;"
v-if="item.activePrice > 0"
>{{ item.price }}</span
>
</div>
</template>
</el-table-column>
<el-table-column
prop="buyPeoples"
header-align="center"
align="center"
label="购买人数"
width="80"
>
</el-table-column>
<el-table-column
prop="sort"
header-align="center"
align="center"
label="排序"
width="80"
>
</el-table-column>
<!-- <el-table-column
prop="createTime"
header-align="center"
align="center"
label="创建日期"
width="160"
>
</el-table-column> -->
<el-table-column
fixed="right"
header-align="center"
align="center"
width="220"
label="操作"
>
<template slot-scope="scope">
<div>
<router-link
:to="{
path: 'course-courseChapter',
query: { id: scope.row.id, courseid: courseid, pageIndex }
}"
>
<el-button type="text" size="small">章节管理</el-button>
</router-link>
<el-button
type="text"
size="small"
@click="addOrUpdateHandle(scope.row)"
>修改</el-button
>
<el-button
style="color:red"
type="text"
size="small"
@click="deleteHandle(scope.row.id)"
>删除</el-button
>
<el-dropdown>
<el-button type="text" size="small"
>更多操作<i class="el-icon-arrow-down el-icon--right"></i
></el-button>
<!-- <span type="primary" size="mini" class="el-dropdown-link">
更多操作<i class="el-icon-arrow-down el-icon--right"></i>
</span> -->
<el-dropdown-menu slot="dropdown">
<el-dropdown-item @click.native="priceHandle(scope.row)"
>修改价格</el-dropdown-item
>
<el-dropdown-item
@click.native="handleCreateProduct(scope.row.id)"
>创建商品</el-dropdown-item
>
<el-dropdown-item @click.native="migrate(scope.row)"
>迁移本部</el-dropdown-item
>
</el-dropdown-menu>
</el-dropdown>
</div>
</template>
</el-table-column>
</el-table>
<!-- <el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageIndex"
:page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="totalPage"
style="padding: 30px 0; text-align: center;" layout="total, sizes, prev, pager, next, jumper">
</el-pagination> -->
<!-- 弹窗, 新增 / 修改 -->
<add-or-update
v-if="addOrUpdateVisible"
ref="addOrUpdate"
@refreshDataList="getDataList"
></add-or-update>
<move-course
v-if="drawerVisible" :catalogueId="catalogueId" :catalogueTitle = "catalogueTitle"
ref="moveCourse"
@mycloseDrawer="mycloseDrawer"
></move-course>
<price
v-if="priceVisible"
ref="priceUpdate"
@refreshDataList="getDataList"
></price>
</div>
</template>
<script>
import moveCourse from "./moveCourse.vue";
import AddOrUpdate from "./catalogue-add-or-update";
import price from "./catalogue-price";
export default {
data() {
return {
dataForm: {
key: ""
},
query: {
type: "",
categoryId: "",
sociologyId: "",
keywords: ""
},
drawerVisible: false,
dataList: [],
delFlag: false,
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
dataListSelections: [],
addOrUpdateVisible: false,
priceVisible: false,
urlList: {
createProduct: "/master/course/createProductForCatalogue"
},
catalogueId:null, // 操作的目录id,
courseId:null, // 勾选的课程id,
catalogueTitle:'' //迁移的课程名称
};
},
components: {
AddOrUpdate,
price,
moveCourse
},
activated() {
this.courseid = this.$route.query.id;
if (this.$route.query.upPageInde != null) {
this.pageIndex = this.$route.query.upPageIndex;
console.log(this.pageIndex);
}
this.getDataList();
},
methods: {
// 获取数据列表
getDataList() {
this.dataListLoading = true;
this.$http({
url: this.$http.adornUrl("/master/course/getCourseCatalogues"),
method: "post",
data: this.$http.adornData({
id: this.courseid
// 'page': this.pageIndex,
// 'limit': this.pageSize,
// "type": this.query.type||0, //类型0全部1医学2国学
// "categoryId": this.query.categoryId, //医学类型id当type为1时为必填项;为0时代表全部
// "sociologyId": this.query.sociologyId, //国学类型id,当type为2时为必填项为0代表全部
// "keywords": this.query.keywords //关键字
})
}).then(({ data }) => {
if (data && data.code === 0) {
this.dataList = data.catalogues;
// this.totalPage = data.page.total
} else {
this.dataList = [];
// this.totalPage = 0
}
this.dataListLoading = false;
});
},
mycloseDrawer(val) {
console.log("999999", val);
this.drawerVisible = false;
this.getDataList();
},
migrate(item) {
// 课程迁移
// console.log(item);
// this.$confirm("您正在进行课程迁移操作, 是否继续?", "提示", {
// confirmButtonText: "确定",
// cancelButtonText: "取消",
// type: "warning"
// })
// .then(() => {
this.catalogueId = item.id
this.catalogueTitle = item.title
this.drawerVisible = true;
this.$nextTick(() => {
this.$refs["moveCourse"].getDataList();
});
// })
// .catch(() => {});
},
// 每页数
sizeChangeHandle(val) {
this.pageSize = val;
this.pageIndex = 1;
this.getDataList();
},
// 当前页
currentChangeHandle(val) {
this.pageIndex = val;
this.getDataList();
},
// 多选
selectionChangeHandle(val) {
this.dataListSelections = val;
},
// 新增 / 修改
addOrUpdateHandle(row) {
console.log("row1", row);
this.addOrUpdateVisible = true;
this.$nextTick(() => {
this.$refs.addOrUpdate.init(row, this.courseid);
});
},
handleCreateProduct(id) {
console.log("id at line 260:", id);
this.$http
.request({
url: this.$http.adornUrl(`${this.urlList.createProduct}`),
method: "POST",
data: {
id: id
},
header: {
//默认 无 说明:请求头
"Content-Type": "application/json"
}
})
.then(res => {
console.log("result at line 452:", res);
if (res && res.data.code === 0) {
this.$message.success(res.data.msg);
this.getDataList();
} else {
this.$message.error(res.data.msg);
}
});
},
priceHandle(row) {
console.log("row1", row);
this.priceVisible = true;
this.$nextTick(() => {
this.$refs.priceUpdate.init(row, this.courseid);
});
},
// 删除
deleteHandle(id) {
// var ids = id ? [id] : this.dataListSelections.map(item => {
// return item.id
// })
this.$confirm(
`确定对[id=${id}]进行[${id ? "删除" : "批量删除"}]操作?`,
"提示",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}
).then(() => {
this.$http({
url: this.$http.adornUrl("/master/course/delCourseCatalogue"),
method: "post",
data: this.$http.adornData({
id: id
})
}).then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: "操作成功",
type: "success",
duration: 1500,
onClose: () => {
this.getDataList();
}
});
} else {
this.$message.error(data.msg);
}
});
});
},
// 开关变化
SwitchChange(event) {
/*点击时他会自动把你绑定的值变更,直接去请求数据就可以了*/
var parms = {
delFlag: event.delFlag,
id: event.id
};
this.$http({
url: this.$http.adornUrl("/book/book/update"),
method: "post",
data: parms
})
.then(res => {
this.$message({
message: "成功",
type: "success"
});
this.loading = false;
this.getDataList();
})
.catch(error => {
this.loading = false;
console.log(error);
});
console.log(event);
},
chapterHandle(id, row) {
if (row.novel == "") {
this.$alert("请上传电子书文件后在进行此操作", "提示", {
confirmButtonText: "好的"
});
return false;
}
this.$http({
url: this.$http.adornUrl("/book/book/getChapter"),
method: "get",
params: this.$http.adornParams({
id: id
})
}).then(res => {
this.$message({
message: "成功",
type: "success"
});
this.loading = false;
this.getDataList();
});
},
contentHandle(id) {
this.$http({
url: this.$http.adornUrl("/book/bookchaptercontent/getBookVoices"),
method: "get",
params: this.$http.adornParams({
id: id
})
}).then(res => {
this.$message({
message: "成功",
type: "success"
});
this.loading = false;
this.getDataList();
});
},
voicesHandle(id) {
//allVoices
this.$http({
// url: this.$http.adornUrl('/book/bookchaptercontent/allVoices'),
url: this.$http.adornUrl("/book/bookchaptercontent/AllVOices"),
method: "get",
params: this.$http.adornParams({
id: id
})
}).then(res => {
console.log("book/bookchaptercontent/AllVOices");
this.$message({
message: "成功",
type: "success"
});
this.loading = false;
this.getDataList();
});
}
}
};
</script>