Files
nuttyreading-master-html/src/views/modules/course/courseList.vue
始于初见 298edb2c53 1、课程加图片
2、新增运营标签绑定课程
2024-04-19 10:34:01 +08:00

456 lines
16 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 label="出版社名称">
<el-input v-model="query.publisherName" placeholder="出版社名称" clearable></el-input>
</el-form-item>
<el-form-item label="作者姓名">
<el-input v-model="query.authorName" 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-button v-if="isAuth('book:book:delete')" type="danger" @click="deleteHandle()"
:disabled="dataListSelections.length <= 0">批量删除</el-button> -->
</el-form-item>
</el-form>
<el-table
:data="dataList"
border
v-loading="dataListLoading"
style="width: 100%;"
>
<!-- <el-table-column min-width="155px
" prop="delFlag" header-align="center" align="center" label="状态">
<template slot-scope="scope">
<el-switch :active-value=1 :inactive-value=0 style="display: block" v-model="scope.row.delFlag" disabled
@change="SwitchChange(scope.row)" active-color="#13ce66" inactive-color="#ff4949" active-text="未删"
inactive-text="已删">
</el-switch>
</template>
</el-table-column> -->
<el-table-column
prop="title"
header-align="center"
align="center"
label="课程名"
>
</el-table-column>
<!-- <el-table-column prop="authorName" header-align="center" align="center" label="作者姓名">
</el-table-column>
<el-table-column header-align="center" align="center" label="插图">
<template slot-scope="scope">
<img v-if="scope.row.images != ''" :src="scope.row.images" width="70" height="100" class="tableImg" />
</template>
</el-table-column> -->
<!-- <el-table-column prop="description" header-align="center" align="center" :show-overflow-tooltip="true" label="简介">
</el-table-column> -->
<!-- <el-table-column
prop="title"
header-align="center"
align="center"
label="序言">
</el-table-column>
<el-table-column
prop="content"
header-align="center"
align="center"
label="内容">
</el-table-column> -->
<!-- <el-table-column prop="type" header-align="center" align="center" label="类型">
</el-table-column>
<el-table-column prop="price" header-align="center" align="center" label="价格">
</el-table-column> -->
<!-- <el-table-column
prop="istop"
header-align="center"
align="center"
label="置顶">
</el-table-column> -->
<!-- <el-table-column prop="publisherName" header-align="center" align="center" label="出版商名称">
</el-table-column> -->
<!-- <el-table-column prop="chapterStatus" header-align="center" align="center" label="章节拆分">
<template slot-scope="scope">
<span v-if="scope.row.chapterStatus == '成功'" style="color:blue">{{scope.row.chapterStatus}}</span>
<span v-if="scope.row.chapterStatus == '失败'" style="color: red">{{scope.row.chapterStatus}}</span>
<span v-if="scope.row.chapterStatus == '处理中'">{{scope.row.chapterStatus}}</span>
<span v-if="scope.row.chapterStatus == '未处理'">{{scope.row.chapterStatus}}</span>
</template>
</el-table-column>
<el-table-column prop="contentStatus" header-align="center" align="center" label="单句拆分">
<template slot-scope="scope">
<span v-if="scope.row.contentStatus == '成功'" style="color:blue">{{scope.row.contentStatus}}</span>
<span v-if="scope.row.contentStatus == '失败'" style="color: red">{{scope.row.contentStatus}}</span>
<span v-if="scope.row.contentStatus == '处理中'">{{scope.row.contentStatus}}</span>
<span v-if="scope.row.contentStatus == '未处理'">{{scope.row.contentStatus}}</span>
</template>
</el-table-column>
<el-table-column prop="voicesStatus" header-align="center" align="center" label="音频处理">
<template slot-scope="scope">
<span v-if="scope.row.voicesStatus == '成功'" style="color:blue">{{scope.row.voicesStatus}}</span>
<span v-if="scope.row.voicesStatus == '失败'" style="color: red">{{scope.row.voicesStatus}}</span>
<span v-if="scope.row.voicesStatus == '处理中'">{{scope.row.voicesStatus}}</span>
<span v-if="scope.row.voicesStatus == '未处理'">{{scope.row.voicesStatus}}</span>
</template>
</el-table-column> -->
<!-- <el-table-column
prop="pid"
header-align="center"
align="center"
label="父id">
</el-table-column>
<el-table-column
prop="level"
header-align="center"
align="center"
label="层级">
</el-table-column> -->
<el-table-column label="课程图" header-align="center" align="center">
<template slot-scope="scope">
<div v-if="scope.row.image" style="width:100%;display: flex;
align-items: center;justify-content: center;">
<img
:src="scope.row.image"
alt=""
width="80px"
height="80px"
/>
</div>
</template>
</el-table-column>
<el-table-column
prop="createTime"
header-align="center"
align="center"
label="创建日期"
>
</el-table-column>
<!-- <el-table-column prop="updateTime" header-align="center" align="center" label="更新日期">
</el-table-column> -->
<!-- <el-table-column
prop="sort"
header-align="center"
align="center"
label="排序">
</el-table-column>
<el-table-column
prop="delFlag"
header-align="center"
align="center"
label="删除标记">
</el-table-column> -->
<el-table-column
fixed="right"
header-align="center"
align="center"
width="250"
label="操作"
>
<template slot-scope="scope">
<!-- <el-dropdown style="border: 1px solid #17B3A3; border-radius: 5px; padding: 4px;">
<span class="el-dropdown-link" style="color:#17B3A3">
操作管理<i class="el-icon-arrow-down el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>
<router-link :to="{path: 'book-comments' , query:{ id : scope.row.id} }">
<el-button type="text" size="small">书评管理</el-button>
</router-link>
</el-dropdown-item>
<el-dropdown-item>
<router-link :to="{path: 'clock' , query:{ id : scope.row.id} }">
<el-button type="text" size="small">打卡管理</el-button>
</router-link>
</el-dropdown-item>
<el-dropdown-item>
<router-link :to="{path: 'book-bookchapter' , query:{ id : scope.row.id , pageIndex} }">
<el-button type="text" size="small">章节管理</el-button>
</router-link>
</el-dropdown-item>
<el-dropdown-item>
<router-link :to="{path: 'talkBook' , query:{ id : scope.row.id , pageIndex} }">
<el-button type="text" size="small">讲书管理</el-button>
</router-link>
</el-dropdown-item>
<el-dropdown-item>
<router-link :to="{path: 'yian' , query:{ id : scope.row.id , pageIndex} }">
<el-button type="text" size="small">医案管理</el-button>
</router-link>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown> -->
<!-- <el-button v-if="scope.row.chapterStatus == '未处理' || scope.row.chapterStatus == '失败'" type="text" size="small" @click="chapterHandle(scope.row.id,scope.row)">章节拆分</el-button> -->
<!-- <el-button v-if="scope.row.chapterStatus == '成功' && (scope.row.contentStatus == '未处理' || scope.row.contentStatus == '失败') " type="text" size="small" @click="contentHandle(scope.row.id)">单句拆分</el-button> -->
<!-- <el-button v-if="scope.row.contentStatus == '成功' && (scope.row.voicesStatus == '未处理' || scope.row.voicesStatus == '失败') " type="text" size="small" @click="voicesHandle(scope.row.id)">音频处理</el-button> -->
<div>
<router-link
:to="{
path: 'course-courseCatalogue',
query: { id: scope.row.id, 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
type="text"
size="small"
@click="deleteHandle(scope.row.id)"
>删除</el-button
>
</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>
</div>
</template>
<script>
import AddOrUpdate from "./course-add-or-update";
export default {
data() {
return {
dataForm: {
key: ""
},
query: {
type: "",
categoryId: "",
sociologyId: "",
keywords: ""
},
dataList: [],
delFlag: false,
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
dataListSelections: [],
addOrUpdateVisible: false
};
},
components: {
AddOrUpdate
},
activated() {
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/getCourseList"),
method: "post",
data: this.$http.adornData({
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.page.records;
this.totalPage = data.page.total;
} else {
this.dataList = [];
this.totalPage = 0;
}
this.dataListLoading = false;
});
},
// 每页数
sizeChangeHandle(val) {
this.pageSize = val;
this.pageIndex = 1;
this.getDataList();
},
// 当前页
currentChangeHandle(val) {
this.pageIndex = val;
this.getDataList();
},
// 多选
selectionChangeHandle(val) {
this.dataListSelections = val;
},
// 新增 / 修改
addOrUpdateHandle(row) {
this.addOrUpdateVisible = true;
this.$nextTick(() => {
this.$refs.addOrUpdate.init(row);
});
},
// 删除
deleteHandle(id) {
var ids = id
? [id]
: this.dataListSelections.map(item => {
return item.id;
});
this.$confirm(
`确定对[id=${ids.join(",")}]进行[${id ? "删除" : "批量删除"}]操作?`,
"提示",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}
).then(() => {
this.$http({
url: this.$http.adornUrl("/master/course/delCourse?id=" + ids),
method: "post"
// data: this.$http.adornData(ids, false)
}).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>