zm/nuttyreading-master-html
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

阶段性上传

Browse Source
This commit is contained in:
@fawn-nine
2023-09-08 18:05:44 +08:00
parent 8130b2d81a
commit d21ce2d01b
13 changed files with 1755 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
dist.zip Normal file
View File

Binary file not shown.

2
src/router/index.js
View File

@@ -48,6 +48,8 @@ const mainRoutes = {
{ path: '/user-point-memery', component: _import('modules/user/user-point-memery'), name: 'user-point-memery', meta: { title: '充/扣记录', isTab: true } },
{ path: '/order-epay', component: _import('modules/order/order-errorpay'), name: 'order-epay', meta: { title: '充值异常列表', isTab: true } },
{ path: '/xieyi_list', component: _import('modules/xieyi/xieyi'), name: 'xieyi_list', meta: { title: '协议管理', isTab: true } },
{ path: '/book-comments', component: _import('modules/book/bookComments'), name: 'book-comments', meta: { title: '书评管理', isTab: true } },
{ path: '/clock', component: _import('modules/book/clock'), name: 'clock', meta: { title: '打卡管理', isTab: true } },
],
beforeEnter (to, from, next) {

56
src/views/modules/book/book-add-or-update.vue
View File

@@ -64,6 +64,11 @@
<el-form-item label="序言" prop="title">
<el-input v-model="dataForm.title" placeholder="序言" :rows="3" type="textarea"></el-input>
</el-form-item>
<el-form-item label="拆分类型" prop="splits">
<el-radio-group v-model="dataForm.splits" >
<el-radio v-for="item in splitsTypeList" :key="item.dictType" :label="item.dictType" :value="item.dictType">{{item.dictValue}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="目录" prop="content">
<el-input v-model="dataForm.content" placeholder="目录" :rows="5" type="textarea"></el-input>
</el-form-item>
@@ -91,12 +96,35 @@
<el-input v-model="dataForm.salePrice" placeholder="优惠价格"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="是否可听" >
<!-- <el-input v-model="dataForm.salePrice" placeholder="优惠价格"></el-input> -->
<el-switch
style="display: block"
v-model="dataForm.canListen"
active-color="#13ce66"
inactive-color="#ff4949"
active-text="可听"
inactive-text="不可听">
</el-switch>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="是否参与打卡" prop="clockIn" label-width="250">
<el-radio-group v-model="dataForm.clockIn">
<!-- <el-radio :label="3">听书</el-radio> -->
<el-radio :label="1">参与打卡</el-radio>
<el-radio :label="2">不参与打卡</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="付费类型" prop="isVip">
<el-radio-group v-model="dataForm.isVip">
<!-- <el-radio :label="3">听书</el-radio> -->
<el-radio :label="2">付费</el-radio>
<el-radio :label="1">会免</el-radio>
<el-radio :label="0">免费</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="免费章节数" prop="freeChapterCount">
@@ -191,6 +219,7 @@ export default {
dataForm: {
id: 0,
name: '',
splits:0,
authorId: [],
description: '',
title: '',
@@ -199,7 +228,7 @@ export default {
price: '',
salePrice:'',
istop: '',
isVip:'',
isVip:0,
freeChapterCount:0,
isSale: '',
publisherId: [],
@@ -210,9 +239,13 @@ export default {
updateTime: '',
sort: '',
delFlag: '',
novel : ''
novel: '',
canListen: false,
clockIn:0,
},
splitsTypeList:[],
dataRule: {
// name: [
// { required: true, message: '书名不能为空', trigger: 'blur' }
// ],
@@ -258,8 +291,8 @@ export default {
// sort: [
// { required: true, message: '排序不能为空', trigger: 'blur' }
// ],
// delFlag: [
// { required: true, message: '删除标记不能为空', trigger: 'blur' }
// splits: [
// { required: true, message: '拆分类类型不能为空', trigger: 'blur' }
// ]
}
}
@@ -296,6 +329,7 @@ export default {
this.dataForm.isVip = data.book.isVip
this.dataForm.isSale = data.book.isSale
this.dataForm.freeChapterCount = data.book.freeChapterCount
this.dataForm.splits = data.book.splits
// this.dataForm.publisherId = data.book.publisherId
this.dataForm.images = data.book.images
this.dataForm.pid = data.book.pid
@@ -305,6 +339,7 @@ export default {
this.dataForm.sort = data.book.sort
this.dataForm.delFlag = data.book.delFlag
this.dataForm.novel = data.book.novel
this.dataForm.clockIn = data.book.clockIn
var checklist = data.book.type
var authorList = data.book.authorId
var publisherlish = data.book.publisherId
@@ -363,7 +398,10 @@ export default {
'updateTime': this.dataForm.updateTime,
'sort': this.dataForm.sort,
'delFlag': this.dataForm.delFlag,
'novel' : this.dataForm.novel
'novel': this.dataForm.novel,
'splits': this.dataForm.splits,
'canListen': this.dataForm.canListen,
'clockIn': this.dataForm.clockIn
})
}).then(({ data }) => {
if (data && data.code === 0) {
@@ -403,6 +441,14 @@ export default {
console.log(data)
this.bookList = data.dataList
})
// 获取图书拆分类型
this.$http({
url: this.$http.adornUrl('/book/sysdictdata/selectByType/splitsType'),
method: 'get',
}).then(({ data }) => {
this.splitsTypeList = data.dataList
})
},
handleRemove(file) {
this.dataForm.images = '';

18
src/views/modules/book/book.vue
View File

@@ -124,11 +124,17 @@
</el-table-column> -->
<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
<template slot-scope="scope">
<router-link :to="{path: 'book-comments' , query:{ id : scope.row.id} }">
<el-button type="text" size="small">书评管理</el-button>
</router-link>
<router-link :to="{path: 'clock' , query:{ id : scope.row.id} }">
<el-button type="text" size="small">打卡管理</el-button>
</router-link>
<router-link :to="{path: 'book-bookchapter' , query:{ id : scope.row.id , pageIndex} }">
<el-button v-if="scope.row.chapterStatus == '成功'" type="text" size="small">章节列表</el-button>
</router-link>
<el-button v-if="scope.row.chapterStatus == '未处理' || scope.row.chapterStatus == '失败'" type="text" size="small" @click="chapterHandle(scope.row.id)">章节拆分</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.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>
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
@@ -278,7 +284,13 @@ export default {
})
console.log(event)
},
chapterHandle(id){
chapterHandle(id, row) {
if (row.novel == '') {
this.$alert('请上传电子书文件后在进行此操作', '提示', {
confirmButtonText: '好的',
});
return false
}
this.$http({
url: this.$http.adornUrl('/book/book/getChapter'),
method: 'get',

234
src/views/modules/book/bookComments.vue Normal file
View File

@@ -0,0 +1,234 @@
<template>
<div class="mod-config">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<!-- <el-form-item>
<el-input v-model="dataForm.key" placeholder="参数名" clearable></el-input>
</el-form-item> -->
<el-form-item>
<!-- <el-button @click="getDataList()">查询</el-button> -->
<el-button v-if="isAuth('book:bookchapter:save')" type="primary" @click="addOrUpdateHandle()">增加书评</el-button>
<el-button v-if="isAuth('book:bookchapter:delete')" type="danger" @click="deleteHandle()" :disabled="dataListSelections.length <= 0">批量删除</el-button>
<!-- <router-link :to="{path: 'book-book' , query:{ upPageIndex } }">
<el-button type="primary">返回上一级</el-button>
</router-link> -->
</el-form-item>
</el-form>
<el-table
:data="dataList"
border
v-loading="dataListLoading"
@selection-change="selectionChangeHandle"
style="width: 100%;">
<el-table-column
type="selection"
header-align="center"
align="center"
width="50">
</el-table-column>
<el-table-column label="序号" width="70" align="center">
<template slot-scope="scope">
{{ (pageIndex - 1) * pageSize + scope.$index + 1 }}
</template>
</el-table-column>
<!-- <el-table-column
prop="id"
header-align="center"
align="center"
label="">
</el-table-column>
<el-table-column
prop="bookId"
header-align="center"
align="center"
label="图书id">
</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"
:show-overflow-tooltip="true"
label="内容">
</el-table-column> -->
<el-table-column
prop="image"
header-align="center"
align="center"
label="封面图">
<template slot-scope="scope">
<img :src="scope.row.image" width="100px" />
</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="150"
label="操作">
<template slot-scope="scope">
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
</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"
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 './bookcomment-add-or-update.vue'
export default {
data () {
return {
dataForm: {
key: ''
},
dataList: [1],
bookid:0,
upPageIndex:0,
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
dataListSelections: [],
addOrUpdateVisible: false
}
},
components: {
AddOrUpdate
},
activated () {
this.bookid = this.$route.query.id;
if(this.$route.query.upPageInde != null){
this.pageIndex = this.$route.query.upPageIndex;
console.log(this.pageIndex)
}
this.upPageIndex = this.$route.query.pageIndex;
console.log(this.bookid)
this.getDataList()
},
methods: {
// 获取数据列表
getDataList () {
this.dataListLoading = true
this.$http({
// url: this.$http.adornUrl('/forum/articles/list'),
url: this.$http.adornUrl('/forum/articles/desccreatelist'),
method: 'get',
params: this.$http.adornParams({
'page': this.pageIndex,
'limit': this.pageSize,
//'key': this.dataForm.key,
'bookid' : this.bookid
})
// data: {
// 'page': this.pageIndex,
// 'limit': this.pageSize,
// // //'key': this.dataForm.key,
// 'bookid' : this.bookid
// }
}).then(({data}) => {
if (data && data.code === 0) {
this.dataList = data.page.list
this.totalPage = data.page.totalCount
} 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 (id) {
this.addOrUpdateVisible = true
this.$nextTick(() => {
this.$refs.addOrUpdate.init(id, this.bookid)
})
},
// 删除
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('/forum/articles/delete'),
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)
}
})
})
}
}
}
</script>

108
src/views/modules/book/bookchapter-add-or-update.vue
View File

@@ -7,6 +7,9 @@
<!-- <el-form-item label="图书id" prop="bookId">
<el-input v-model="dataForm.bookId" placeholder="图书id"></el-input>
</el-form-item> -->
<el-form-item label="章节序号" prop="number" v-show="opName== 'update'">
<el-input style="width: 150px;" type="number" v-model="dataForm.number" placeholder="章节序号：1，2..."></el-input>
</el-form-item>
<el-form-item label="章节" prop="chapter">
<el-input v-model="dataForm.chapter" placeholder="章节"></el-input>
</el-form-item>
@@ -15,9 +18,17 @@
</el-form-item> -->
<el-form-item label="音频文件上传" prop="voices">
<el-upload class="upload-demo" :action= "baseUrl + '/oss/fileoss'" :on-preview="handlePreview"
:on-remove="handleRemove" :on-success="handleVoicesSuccess" multiple :limit="3" :file-list="fileListVoices">
:on-remove="handleRemove" :on-success="handleVoicesSuccess" multiple :limit="3" :file-list="fileListVoices"
:on-progress="onUpload"
>
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
<!-- 进度条 -->
<el-progress
:percentage="progressPercent" :text-inside="true"
:stroke-width="24" status="success">
</el-progress>
<audio controls="controls" hidden src="./static/audio/tsy.wav" ref="audio"></audio>
<audio id="resource" :src="dataForm.voices" controls v-show='true'></audio>
</el-form-item>
@@ -56,40 +67,46 @@ import global from '../../common/common.vue' //引入共用组间
visible: false,
dataForm: {
id: 0,
bookId: '',
number:null,
bookId: this.$route.query.id,
chapter: '',
content: '',
voices: '',
createTime: '',
updateTime: '',
sort: '',
delFlag: ''
delFlag: '',
},
timer:null,
opName:'',
fileListVoices: [],
progressPercent:0,
dataRule: {
bookId: [
{ required: true, message: '图书id不能为空', trigger: 'blur' }
number: [
{ required: true, message: '章节序号不能为空', trigger: 'blur' }
],
chapter: [
{ required: true, message: '章节不能为空', trigger: 'blur' }
{ required: true, message: '章节标题不能为空', trigger: 'blur' }
],
content: [
{ required: true, message: '内容不能为空', trigger: 'blur' }
],
voices: [
{ required: true, message: '音频文件地址不能为空', trigger: 'blur' }
],
createTime: [
{ required: true, message: '不能为空', trigger: 'blur' }
],
updateTime: [
{ required: true, message: '不能为空', trigger: 'blur' }
],
sort: [
{ required: true, message: '不能为空', trigger: 'blur' }
],
delFlag: [
{ required: true, message: '不能为空', trigger: 'blur' }
]
// content: [
// { required: true, message: '内容不能为空', trigger: 'blur' }
// ],
// voices: [
// { required: true, message: '音频文件地址不能为空', trigger: 'blur' }
// ],
// createTime: [
// { required: true, message: '不能为空', trigger: 'blur' }
// ],
// updateTime: [
// { required: true, message: '不能为空', trigger: 'blur' }
// ],
// sort: [
// { required: true, message: '不能为空', trigger: 'blur' }
// ],
// delFlag: [
// { required: true, message: '不能为空', trigger: 'blur' }
// ]
}
}
},
@@ -97,6 +114,8 @@ import global from '../../common/common.vue' //引入共用组间
init (id) {
this.dataForm.id = id || 0
this.visible = true
this.dataForm.id ==0 ? this.opName = 'update' : this.opName = '11'
console.log(this.opName,'this.opName')
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
@@ -106,14 +125,15 @@ import global from '../../common/common.vue' //引入共用组间
params: this.$http.adornParams()
}).then(({data}) => {
if (data && data.code === 0) {
this.dataForm.bookId = data.bookChapter.bookId
this.dataForm.bookId = data.bookChapter.id
this.dataForm.chapter = data.bookChapter.chapter
this.dataForm.content = data.bookChapter.content
this.dataForm.voices = data.bookChapter.voices
this.dataForm.createTime = data.bookChapter.createTime
this.dataForm.updateTime = data.bookChapter.updateTime
this.dataForm.sort = data.bookChapter.sort
this.dataForm.delFlag = data.bookChapter.delFlag
this.dataForm.delFlag = data.bookChapter.delFlag,
this.dataForm.number = data.bookChapter.number
}
})
}
@@ -122,8 +142,28 @@ import global from '../../common/common.vue' //引入共用组间
handleRemove(file) {
this.dataForm.voices = '';
},
// 上传时进度条
onUpload(event, file, fileList) { //三个参数看情况使用
console.log(event,file,fileList)
this.loading = true
//使用定时器来制作进度条
setTimeout(() => {
//progressPercent 进度条数字
this.progressPercent = Math.floor(event.percent)
//这里之所以到72%就结束定时器，下面具体解释
// console.log(this.progressPercent,'event.percent')
// if (Math.floor(this.progressPercent) == 100) {
// clearInterval(this.timer)
// // 这里必须使用this.timer = null，否则清除定时器无效
// this.timer = null
// }
},1000)
},
handleVoicesSuccess(res, file) {
if (res.msg == "success") {
//console.log(res,'res')
this.dataForm.voices = res.url;
this.$message.success("上传成功");
} else {
@@ -133,7 +173,7 @@ import global from '../../common/common.vue' //引入共用组间
handlePreview(file) {
console.log(file);
},
// 表单提交
// 表单提交 老的
dataFormSubmit () {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
@@ -142,14 +182,15 @@ import global from '../../common/common.vue' //引入共用组间
method: 'post',
data: this.$http.adornData({
'id': this.dataForm.id || undefined,
'bookId': this.dataForm.bookId,
'bookId': this.$route.query.id,
'chapter': this.dataForm.chapter,
'content': this.dataForm.content,
'voices': this.dataForm.voices,
'createTime': this.dataForm.createTime,
'updateTime': this.dataForm.updateTime,
'sort': this.dataForm.sort,
'delFlag': this.dataForm.delFlag
'number': this.dataForm.number // 章节序号
// 'createTime': this.dataForm.createTime,
// 'updateTime': this.dataForm.updateTime,
// 'sort': this.dataForm.sort,
// 'delFlag': this.dataForm.delFlag
})
}).then(({data}) => {
if (data && data.code === 0) {
@@ -159,6 +200,9 @@ import global from '../../common/common.vue' //引入共用组间
duration: 1500,
onClose: () => {
this.visible = false
this.opName = ''
this.$refs.dataForm.resetFields()
this.fileListVoices = []
this.$emit('refreshDataList')
}
})

12
src/views/modules/book/bookchapter.vue
View File

@@ -55,18 +55,18 @@
:show-overflow-tooltip="true"
label="内容">
</el-table-column>
<!-- <el-table-column
<el-table-column
prop="voices"
header-align="center"
align="center"
label="音频文件地址">
</el-table-column> -->
<el-table-column
</el-table-column>
<!-- <el-table-column
prop="createTime"
header-align="center"
align="center"
label="创建时间">
</el-table-column>
</el-table-column> -->
<el-table-column
prop="updateTime"
header-align="center"
@@ -202,11 +202,13 @@
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.dataListLoading = true
this.$http({
url: this.$http.adornUrl('/book/bookchapter/delete'),
method: 'post',
data: this.$http.adornData(ids, false)
}).then(({data}) => {
}).then(({ data }) => {
this.dataListLoading = false
if (data && data.code === 0) {
this.$message({
message: '操作成功',

377
src/views/modules/book/bookcomment-add-or-update.vue Normal file
View File

@@ -0,0 +1,377 @@
<template>
<el-dialog :title="!dataForm.productId ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible"
@close="handlereset" lock-scroll width="750px">
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" label-width="100px">
<!-- <el-form-item label="所属分类" prop="poids">
<el-cascader v-model="dataForm.poids" :options="categorys" :props="props" clearable></el-cascader>
</el-form-item> -->
<!-- <el-form-item label="商品类型" prop="goodsType">
<el-select v-model="dataForm.goodsType" placeholder="请选择">
<el-option v-for="item in goodsTypeList" :key="item.dictType" :label="item.dictValue" :value="item.dictType">
</el-option>
</el-select>
</el-form-item> -->
<!-- 关联的图书ids -->
<el-form-item label="标题" prop="title">
<el-input v-model="dataForm.title" placeholder="请输入标题"></el-input>
</el-form-item>
<el-form-item label="封面图" prop="productImages">
<el-upload :limit="1" class="el-uploadfeng "
:class="{ uoloadSty: dataForm.showBtnDealImg, disUoloadSty: dataForm.noneBtnImg }"
:action="baseUrl + '/oss/fileoss'" list-type="picture-card" :on-preview="handlePictureCardPreview"
:file-list="fileList" :on-success="handlePicSuccess" accept=".jpeg,.jpg,.gif,.png" :on-remove="handleRemove">
<i class="el-icon-plus"></i>
</el-upload>
<el-dialog :visible.sync="dialogVisible" :append-to-body="true">
<img width="100%" :src="dataForm.productImages" alt="">
</el-dialog>
</el-form-item>
<el-form-item label="书评详情" prop="productDetails">
<quill-editor v-model="dataForm.productDetails" ref="myQuillEditor" :options="editorOption"
@blur="onEditorBlur($event)" @focus="onEditorFocus($event)"
@ready="onEditorReady($event)" class="shangpin_editor">
</quill-editor>
</el-form-item>
<!-- <el-form-item label="排序" prop="sort">
<el-input v-model="dataForm.sort" placeholder="排序"></el-input>
</el-form-item> -->
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="handlereset">取消</el-button>
<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
</span>
</el-dialog>
</template>
<script>
import {
quillEditor
} from 'vue-quill-editor'
import global from '../../common/common.vue' //引入共用组间
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
export default {
data() {
return {
baseUrl: global.baseUrl,
visible: false,
categorys: [],
fileList: [], // 封面图
swiperfileList: [],
dialogVisible: false,
props: {
value: "catId",
label: "name",
children: "children",
checkStrictly: true
},
dataForm: {
productId: 0,
limitCountImg: 1, // 图片数量
// productImageList: '', // 轮播图
showBtnDealImg: true,
noneBtnImg: false,
title: '',
productPid: '',
productImages: '',
shupingid:null,
},
dataRule: {
title: [{
required: true,
message: '书评标题不能为空',
trigger: 'blur'
}],
productImages: [{
required: true,
message: '商品图不能为空',
trigger: 'blur'
}],
},
// 富文本编辑器配置
editorOption: {
modules: {
toolbar: [
['bold', 'italic', 'underline', 'strike'], // 加粗 斜体 下划线 删除线
['blockquote', 'code-block'], // 引用 代码块
[{
header: 1
}, {
header: 2
}], // 1、2 级标题
[{
list: 'ordered'
}, {
list: 'bullet'
}], // 有序、无序列表
[{
script: 'sub'
}, {
script: 'super'
}], // 上标/下标
[{
indent: '-1'
}, {
indent: '+1'
}], // 缩进
[{
direction: 'rtl'
}], // 文本方向
[{
size: ['12', '14', '16', '18', '20', '22', '24', '28', '32', '36']
}], // 字体大小
[{
header: [1, 2, 3, 4, 5, 6]
}], // 标题
[{
color: []
}, {
background: []
}], // 字体颜色、字体背景颜色
// [{ font: ['songti'] }], // 字体种类
[{
align: []
}], // 对齐方式
['clean'], // 清除文本格式
['image', 'video'] // 链接、图片、视频
]
},
placeholder: '请输入正文'
},
}
},
created() {
},
methods: {
init(id,bookid) {
this.productPid = bookid
this.dataForm.shupingid = id || null
console.log(id,this.productPid,'this.productPid')
this.dataForm.productId = bookid || 0
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.productId) {
this.$http({
url: this.$http.adornUrl(`/forum/articles/info/${id}`),
method: 'get',
params: this.$http.adornParams()
}).then(({
data
}) => {
// console.log(data,666)
if (data && data.code === 0) {
this.dataForm.title = data.BookForumArticlesEntity.title
this.dataForm.productImages = data.BookForumArticlesEntity.image
this.dataForm.productDetails = data.BookForumArticlesEntity.content
if (data.BookForumArticlesEntity.productImages != "") {
var img = {
name: '',
url: data.BookForumArticlesEntity.image
}
var attr = []
attr.push(img)
this.fileList = attr
}
} else {
console.log(data.BookForumArticlesEntity.productImageList)
let arr = []
let arr1 = []
arr = data.BookForumArticlesEntity.productImageList.split(',');
console.log(arr)
arr.forEach((item, index) => {
arr1.push({
name: index,
url: item
})
});
this.swiperfileList = arr1
}
})
}
})
},
dealImgChange(file, fileList) {
this.dataForm.noneBtnImg = fileList.length >= this.dataForm.limitCountImg;
},
// 表单提交
dataFormSubmit() {
// console.log('userid', this.$store.state.user.id)
this.$refs['dataForm'].validate((valid) => {
if (valid) {
this.$http({
url: this.$http.adornUrl(`/forum/articles/${!this.dataForm.shupingid ? 'save' : 'update'}`),
method: 'post',
data: this.$http.adornData({
'bookid': this.dataForm.productId || undefined,
'title': this.dataForm.title,
'image': this.dataForm.productImages,
'content': this.dataForm.productDetails,
'userid': this.$store.state.user.id,
'id': this.dataForm.shupingid
})
}).then(({
data
}) => {
if (data && data.code === 0) {
this.$message({
message: '操作成功',
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.dataForm.productDetails = ''
this.$refs['dataForm'].resetFields()
// this.$refs['dataForm'].reset()
this.$emit('refreshDataList')
}
})
} else {
this.$message.error(data.msg)
}
})
}
})
},
changeTime(e) {
console.log(e)
},
handlePictureCardPreview(file) {
this.dataForm.productImages = file.url;
this.dialogVisible = true;
},
bannerHandlePicSuccess(res, file) {
// 轮播图上传成功
if (res.msg == "success") {
this.swiperfileList.push({
name: file.name,
url: res.url
})
this.dataForm.productImages = res.url
console.log(this.swiperfileList,this.dataForm.productImages)
this.$message.success("上传成功");
} else {
this.$message.error("上传失败");
}
},
// 字符串图片地址
getStringImgUrl() {
let arr = this.swiperfileList.map(item => item.url)
if (arr.length <= 0) {
return null
} else {
return arr.toString()
}
},
handlePicSuccess(res, file) {
// console.log(res,'res')
if (res.msg == "success") {
this.dataForm.productImages = res.url;
this.fileList.push({
name: file.name,
url: res.url
})
this.dataForm.productImages = res.url
console.log(this.dataForm.productImages,'productImages')
this.$message.success("上传成功");
} else {
this.$message.error("上传失败");
}
},
handleRemove(file, fileList) {
this.dataForm.productImages = '';
this.fileList = fileList
this.dataForm.noneBtnImg = fileList.length >= this.dataForm.limitCountImg;
},
handlereset() {
this.fileList = [],
this.visible = false
this.swiperfileList = []
this.$refs['dataForm'].resetFields()
this.dataForm.productDetails = ''
// this.$refs['dataForm'].reset()
},
// 失去焦点事件
onEditorBlur(quill) {
console.log('editor blur!', quill)
},
// 获得焦点事件
onEditorFocus(quill) {
//console.log('editor focus!', quill)
},
// 准备富文本编辑器
onEditorReady(quill) {
// console.log('editor ready!', quill)
},
},
components: {
quillEditor
},
mounted() {
this.$bus.$on("haveBookIds", (data) => {
// console.log('haveBookIds', data)
data.bookIds.length > 0 ? this.dataForm.Books = data.bookIds : this.dataForm.Books = []
});
},
watch: {
visible: {
handler(val, oldVal) {
// this.getGoodsTypeList()
},
deep: true
},
}
}
</script>
<style lang="less">
// .disUoloadSty {
// .el-upload--picture-card {
// display: none;
// /* 上传按钮隐藏 */
// }
// }
// .el-form-item {
// /deep/ .el-form-item__label {
// font-size: 12px;
// }
// }
.el-uploadfeng {
.el-upload-list__item {
width: 120px;
height: 120px;
}
.el-upload--picture-card {
width: 120px;
height: 120px;
line-height: 120px;
}
}
.shangpin_editor .ql-editor {
height: 150px;
}
</style>

436
src/views/modules/book/clock-add-or-update.vue Normal file
View File

@@ -0,0 +1,436 @@
<template>
<el-dialog :title="!dataForm.productId ? '新增' : '修改'" :close-on-click-modal="false" :visible.sync="visible"
@close="handlereset" lock-scroll width="750px">
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" label-width="100px">
<!-- <el-form-item label="所属分类" prop="poids">
<el-cascader v-model="dataForm.poids" :options="categorys" :props="props" clearable></el-cascader>
</el-form-item> -->
<!-- <el-form-item label="商品类型" prop="goodsType">
<el-select v-model="dataForm.goodsType" placeholder="请选择">
<el-option v-for="item in goodsTypeList" :key="item.dictType" :label="item.dictValue" :value="item.dictType">
</el-option>
</el-select>
</el-form-item> -->
<!-- 关联的图书ids -->
<el-form-item label="主题" prop="title">
<el-input v-model="dataForm.title" placeholder="请输入打卡主题"></el-input>
</el-form-item>
<el-form-item label="打卡索引" prop="days">
<el-input v-model="dataForm.days" placeholder="打卡第N天，例如：1,2,3"></el-input>
</el-form-item>
<el-form-item label="卡片" >
<el-upload :limit="1" class="el-uploadfeng "
:class="{ uoloadSty: dataForm.showBtnDealImg, disUoloadSty: dataForm.noneBtnImg }"
:action="baseUrl + '/oss/fileoss'" list-type="picture-card" :on-preview="handlePictureCardPreview"
:file-list="fileList" :on-success="handlePicSuccess" accept=".jpeg,.jpg,.gif,.png" :on-remove="handleRemove">
<i class="el-icon-plus"></i>
</el-upload>
<el-dialog :visible.sync="dialogVisible" :append-to-body="true">
<img width="100%" :src="dataForm.productImages" alt="">
</el-dialog>
</el-form-item>
<!-- <el-form-item label="音频" prop="productImages">
<el-upload :limit="1" class="el-uploadfeng "
:class="{ uoloadSty: dataForm.showBtnDealImg, disUoloadSty: dataForm.noneBtnImg }"
:action="baseUrl + '/oss/fileoss'" list-type="picture-card" :on-preview="handlePictureCardPreview"
:file-list="fileList" :on-success="handlePicSuccess" accept=".jpeg,.jpg,.gif,.png" :on-remove="handleRemove">
<i class="el-icon-plus"></i>
</el-upload>
<audio id="resource" :src="dataForm.voices" controls v-show='true'></audio>
<el-dialog :visible.sync="dialogVisible" :append-to-body="true">
<img width="100%" :src="dataForm.productImages" alt="">
</el-dialog>
</el-form-item> -->
<el-form-item label="视频" >
<el-upload :limit="1" class="el-uploadvideo "
:class="{ uoloadSty: dataForm.showBtnDealImg, disUoloadSty: dataForm.noneBtnImg }"
:action="baseUrl + '/oss/fileoss'"
:file-list="videoList" :on-success="videohandlePicSuccess" accept=".mp4" :on-remove="videohandleRemove">
<!-- <i class="el-icon-plus"></i> -->
<el-button slot="trigger" size="small" type="primary">上传文件</el-button>
</el-upload>
<div>
<video controls width="250" v-if="dataForm.video">
<source :src="dataForm.video" type="video/mp4" />
</video>
</div>
</el-form-item>
<el-form-item label="打卡描述" prop="productDetails">
<quill-editor v-model="dataForm.productDetails" ref="myQuillEditor" :options="editorOption"
@blur="onEditorBlur($event)" @focus="onEditorFocus($event)"
@ready="onEditorReady($event)" class="shangpin_editor">
</quill-editor>
</el-form-item>
<!-- <el-form-item label="排序" prop="sort">
<el-input v-model="dataForm.sort" placeholder="排序"></el-input>
</el-form-item> -->
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="handlereset">取消</el-button>
<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
</span>
</el-dialog>
</template>
<script>
import {
quillEditor
} from 'vue-quill-editor'
import global from '../../common/common.vue' //引入共用组间
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
export default {
data() {
return {
baseUrl: global.baseUrl,
visible: false,
categorys: [],
fileList: [], // 封面图
swiperfileList: [],
dialogVisible: false,
props: {
value: "catId",
label: "name",
children: "children",
checkStrictly: true
},
dataForm: {
productId: 0,
limitCountImg: 1, // 图片数量
productImageList: '', // 轮播图
showBtnDealImg: true,
noneBtnImg: false,
title: '',
productPid: '',
productImages: '',
shupingid: null,
voices: '',
video: '', // 视频地址
days:''
},
videoList:[],
dataRule: {
title: [{
required: true,
message: '书评标题不能为空',
trigger: 'blur'
}],
productImages: [{
required: true,
message: '商品图不能为空',
trigger: 'blur'
}],
},
// 富文本编辑器配置
editorOption: {
modules: {
toolbar: [
['bold', 'italic', 'underline', 'strike'], // 加粗 斜体 下划线 删除线
['blockquote', 'code-block'], // 引用 代码块
[{
header: 1
}, {
header: 2
}], // 1、2 级标题
[{
list: 'ordered'
}, {
list: 'bullet'
}], // 有序、无序列表
[{
script: 'sub'
}, {
script: 'super'
}], // 上标/下标
[{
indent: '-1'
}, {
indent: '+1'
}], // 缩进
[{
direction: 'rtl'
}], // 文本方向
[{
size: ['12', '14', '16', '18', '20', '22', '24', '28', '32', '36']
}], // 字体大小
[{
header: [1, 2, 3, 4, 5, 6]
}], // 标题
[{
color: []
}, {
background: []
}], // 字体颜色、字体背景颜色
// [{ font: ['songti'] }], // 字体种类
[{
align: []
}], // 对齐方式
['clean'], // 清除文本格式
['image', 'video'] // 链接、图片、视频
]
},
placeholder: '请输入正文'
},
}
},
created() {
},
methods: {
init(id,bookid) {
this.productPid = bookid
this.dataForm.shupingid = id || null
console.log(id,this.productPid,'this.productPid')
this.dataForm.productId = bookid || 0
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.productId) {
this.$http({
url: this.$http.adornUrl(`/book/task/info/${id}`),
method: 'get',
params: this.$http.adornParams()
}).then(({
data
}) => {
console.log(data,666)
if (data && data.code === 0) {
this.dataForm.title = data.bookTaskEntity.heading
this.dataForm.video = data.bookTaskEntity.video
this.dataForm.days = data.bookTaskEntity.days
this.dataForm.productImages = data.bookTaskEntity.images
this.dataForm.productDetails = data.bookTaskEntity.content
console.log(this.dataForm.video,'this.dataForm.video')
if (data.bookTaskEntity.images != "") {
var img = {
name: '',
url: data.bookTaskEntity.images
}
var attr = []
attr.push(img)
this.fileList = attr
}
// else {
// console.log(data.bookBuyConfig.productImageList)
// let arr = []
// let arr1 = []
// arr = data.bookBuyConfig.productImageList.split(',');
// console.log(arr)
// arr.forEach((item, index) => {
// arr1.push({
// name: index,
// url: item
// })
// });
// this.swiperfileList = arr1
// }
}
})
}
})
},
dealImgChange(file, fileList) {
this.dataForm.noneBtnImg = fileList.length >= this.dataForm.limitCountImg;
},
// 表单提交
dataFormSubmit() {
// console.log('userid', this.$store.state.user.id)
this.$refs['dataForm'].validate((valid) => {
if (valid) {
this.$http({
url: this.$http.adornUrl(`/book/task/${!this.dataForm.shupingid ? 'save' : 'update'}`),
method: 'post',
data: this.$http.adornData({
'bookid': this.productPid,
'heading': this.dataForm.title,
'images': this.dataForm.productImages,
'content': this.dataForm.productDetails,
'days': this.dataForm.days,
'video': this.dataForm.video,
// 'video': "https://ehh-private-01.oss-cn-beijing.aliyuncs.com…3/08/28/91fd5a4c35c34763abca5d2929637164movie.mp4",
'id': this.dataForm.shupingid || undefined,
})
}).then(({
data
}) => {
if (data && data.code === 0) {
this.$message({
message: '操作成功',
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.dataForm.productDetails = ''
this.$refs['dataForm'].resetFields()
// this.$refs['dataForm'].reset()
this.$emit('refreshDataList')
}
})
} else {
this.$message.error(data.msg)
}
})
}
})
},
changeTime(e) {
console.log(e)
},
handlePictureCardPreview(file) {
this.dataForm.productImages = file.url;
this.dialogVisible = true;
},
bannerHandlePicSuccess(res, file) {
// 轮播图上传成功
if (res.msg == "success") {
this.swiperfileList.push({
name: file.name,
url: res.url
})
this.dataForm.productImages = res.url
console.log(this.swiperfileList,this.dataForm.productImages)
this.$message.success("上传成功");
} else {
this.$message.error("上传失败");
}
},
// 字符串图片地址
getStringImgUrl() {
let arr = this.swiperfileList.map(item => item.url)
if (arr.length <= 0) {
return null
} else {
return arr.toString()
}
},
handlePicSuccess(res, file) {
// console.log(res,'res')
if (res.msg == "success") {
this.dataForm.productImages = res.url;
this.fileList.push({
name: file.name,
url: res.url
})
this.dataForm.productImages = res.url
console.log(this.dataForm.productImages,'productImages')
this.$message.success("上传成功");
} else {
this.$message.error("上传失败");
}
},
videohandlePicSuccess(res, file) {
console.log(res,'res')
if (res.msg == "success") {
// this.dataForm.productImages = res.url;
this.videoList.push({
name: file.name,
url: res.url
})
this.dataForm.video = res.url
// console.log(this.dataForm.productImages,'productImages')
this.$message.success("上传成功");
} else {
this.$message.error("上传失败");
}
},
handleRemove(file, fileList) {
this.dataForm.productImages = '';
this.fileList = fileList
this.dataForm.noneBtnImg = fileList.length >= this.dataForm.limitCountImg;
},
videohandleRemove(file, fileList) {
this.dataForm.video = '';
this.videoList = fileList
},
handlereset() {
this.fileList = [],
this.visible = false
this.swiperfileList = []
this.$refs['dataForm'].resetFields()
this.dataForm.productDetails = ''
// this.$refs['dataForm'].reset()
},
// 失去焦点事件
onEditorBlur(quill) {
console.log('editor blur!', quill)
},
// 获得焦点事件
onEditorFocus(quill) {
//console.log('editor focus!', quill)
},
// 准备富文本编辑器
onEditorReady(quill) {
// console.log('editor ready!', quill)
},
},
components: {
quillEditor
},
mounted() {
this.$bus.$on("haveBookIds", (data) => {
// console.log('haveBookIds', data)
data.bookIds.length > 0 ? this.dataForm.Books = data.bookIds : this.dataForm.Books = []
});
},
watch: {
visible: {
handler(val, oldVal) {
// this.getGoodsTypeList()
},
deep: true
},
}
}
</script>
<style lang="less">
/deep/ .el-uploadvideo .el-upload-list li{height: auto !important;}
// .disUoloadSty {
// .el-upload--picture-card {
// display: none;
// /* 上传按钮隐藏 */
// }
// }
// .el-form-item {
// /deep/ .el-form-item__label {
// font-size: 12px;
// }
// }
.el-uploadfeng {
.el-upload-list__item {
width: 120px;
height: 120px;
}
.el-upload--picture-card {
width: 120px;
height: 120px;
line-height: 120px;
}
}
.shangpin_editor .ql-editor {
height: 150px;
}
</style>

230
src/views/modules/book/clock.vue Normal file
View File

@@ -0,0 +1,230 @@
<template>
<div class="mod-config">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item>
<!-- <el-button @click="getDataList()">查询</el-button> -->
<el-button v-if="isAuth('book:bookchapter:save')" type="primary" @click="addOrUpdateHandle()">增加打卡任务</el-button>
<el-button v-if="isAuth('book:bookchapter:delete')" type="danger" @click="deleteHandle()" :disabled="dataListSelections.length <= 0">批量删除</el-button>
<!-- <router-link :to="{path: 'book-book' , query:{ upPageIndex } }">
<el-button type="primary">返回上一级</el-button>
</router-link> -->
</el-form-item>
</el-form>
<el-table
:data="dataList"
border
v-loading="dataListLoading"
@selection-change="selectionChangeHandle"
style="width: 100%;">
<el-table-column
type="selection"
header-align="center"
align="center"
width="50">
</el-table-column>
<el-table-column label="序号" width="70" align="center">
<template slot-scope="scope">
{{ (pageIndex - 1) * pageSize + scope.$index + 1 }}
</template>
</el-table-column>
<!-- <el-table-column
prop="id"
header-align="center"
align="center"
label="">
</el-table-column>
-->
<el-table-column
prop="heading"
label="主题">
</el-table-column>
<el-table-column
prop="days"
align="center"
label="第N天">
</el-table-column>
<el-table-column
prop="content"
header-align="center"
align="center"
:show-overflow-tooltip="true"
label="内容">
</el-table-column>
<el-table-column
prop="images"
header-align="center"
align="center"
label="卡片">
<template slot-scope="scope">
<img v-if="scope.row.images != ''" :src="scope.row.images" width="100px" />
</template>
</el-table-column>
<el-table-column
prop="video"
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="150"
label="操作">
<template slot-scope="scope">
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">删除</el-button>
</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"
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 './clock-add-or-update.vue'
export default {
data () {
return {
dataForm: {
key: ''
},
dataList: [1],
bookid:0,
upPageIndex:0,
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
dataListSelections: [],
addOrUpdateVisible: false
}
},
components: {
AddOrUpdate
},
activated () {
this.bookid = this.$route.query.id;
if(this.$route.query.upPageInde != null){
this.pageIndex = this.$route.query.upPageIndex;
console.log(this.pageIndex)
}
this.upPageIndex = this.$route.query.pageIndex;
console.log(this.bookid)
this.getDataList()
},
methods: {
// 获取数据列表
getDataList () {
this.dataListLoading = true
this.$http({
// url: this.$http.adornUrl('/forum/articles/list'),
url: this.$http.adornUrl('/book/task/list'),
method: 'get',
params: this.$http.adornParams({
'page': this.pageIndex,
'limit': this.pageSize,
//'key': this.dataForm.key,
'bookid' : this.bookid
})
// data: {
// 'page': this.pageIndex,
// 'limit': this.pageSize,
// // //'key': this.dataForm.key,
// 'bookid' : this.bookid
// }
}).then(({data}) => {
if (data && data.code === 0) {
this.dataList = data.page.list
this.totalPage = data.page.totalCount
} 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 (id) {
this.addOrUpdateVisible = true
this.$nextTick(() => {
this.$refs.addOrUpdate.init(id, this.bookid)
})
},
// 删除
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('/book/task/delete'),
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)
}
})
})
}
}
}
</script>

204
src/views/modules/shop/chooseBook.vue Normal file
View File

@@ -0,0 +1,204 @@
<template>
<div>
<!-- 选择关联图书 -->
<el-dialog v-if="tableData.length > 0"
title="请选择"
v-loading="loading"
:visible.sync="chooseBookVisible"
width="30%"
:before-close="handleClose">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getBookList()">
<el-form-item>
<el-input v-model="dataForm.key" placeholder="图书名" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button @click="getBookList()">查询</el-button>
</el-form-item>
</el-form>
<el-table
:data="tableData"
stripe
ref="multipleTablebb"
style="width: 100%"
@selection-change="handleSelectionChange"
>
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column
prop="name" label="日期" >
</el-table-column>
<el-table-column
prop="images"
label="封面图"
>
<template slot-scope="scope">
<img :src="scope.row.images" width="100" height="100">
</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"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
<span slot="footer" class="dialog-footer">
<el-button @click="chooseBookVisible = false">取 消</el-button>
<el-button type="primary" @click="submitBookIds">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
props: {
chooseBookVisible: {
type: Boolean,
value: false,
},
bookIds: {
type: Array,
value:[]
}
},
data() {
return {
dataForm: {
key:''
},
pageSize: 10,
pageIndex: 1,
oldSelected:[],
totalPage: 0,
tableData: [],
loading: false,
selectedBooks: [], // 选中的书籍
show : this.chooseBookVisible
}
},
created() {
this.getBookList()
},
mounted() {
this.$bus.$on("showchooseBook", (data) => {
if (data.bookIds.length > 0) {
this.$nextTick(()=> {
//this.toggleSelection() // 获取到已选中的数据
this.oldSelected = data.bookIds
console.log(this.oldSelected,'oldSelected')
})
}
});
},
methods: {
// 初始化
getBookList() {
this.loading = true
this.$http({
url: this.$http.adornUrl('/book/book/list'),
method: 'get',
params: this.$http.adornParams({
'page': this.pageIndex,
'limit': this.pageSize,
'bookName': this.dataForm.key,
// 'publisherName' : this.query.publisherName,
// 'authorName' : this.query.authorName
})
}).then(({ data }) => {
if (data && data.code === 0) {
this.tableData = data.page.list
this.totalPage = data.page.totalCount
this.oldSelected = JSON.parse(sessionStorage.getItem('Books'))
this.$nextTick(()=> {
this.toggleSelection() // 获取到已选中的数据
})
} else {
this.dataList = []
this.totalPage = 0
}
this.loading = false
})
},
// 渲染默认选中
toggleSelection() {
// console.log('渲染选中', this.oldSelected)
this.tableData.forEach((item1) => {
this.oldSelected.forEach((item2) => {
if (item2.id == item1.id) {
this.selectedBooks.push(item1)
this.$refs.multipleTablebb.toggleRowSelection(item1, true)
console.log(item1,'item1')
}
})
})
// if (this.oldSelected.length > 0) {
// this.selectedBooks.forEach(item => {
// this.$refs.multipleTablebb.toggleRowSelection(item, true);
// })
// }
},
submitBookIds() {
// 提交bookids
this.$bus.$emit("haveBookIds", { 'bookIds': this.selectedBooks });
this.handleClose()
},
handleSelectionChange(e) {
console.log(e)
this.selectedBooks = e
},
handleClose() { // 关闭组件
this.$emit('closeBookf', false)
},
// 每页数
sizeChangeHandle(val) {
this.pageSize = val
this.pageIndex = 1
this.getBookList()
},
// 当前页
currentChangeHandle(val) {
this.pageIndex = val
this.getBookList()
},
},
watch: {
bookIds: {
handler(val, oldVal) {
console.log(val, 'cal')
// if (val.length > 0) {
// this.selectedBooks = val
// val.forEach(item => {
// this.$nextTick(() => {
// this.$refs.multipleTablebb.toggleRowSelection(item, true);
// });
// })
// this.$nextTick(() => {
// this.toggleSelection()
// });
// }
},
deep: true
}
}
}
</script>
<style>
</style>

96
src/views/modules/shop/shopproduct-add-or-update.vue
View File

@@ -11,6 +11,38 @@
</el-option>
</el-select>
</el-form-item>
<!-- 关联的图书ids -->
<el-form-item label="关联图书" prop="Books">
<el-table
:data="dataForm.Books"
stripe
style="width: 100%">
<el-table-column
prop="name" label="图书名" >
</el-table-column>
<el-table-column
prop="images"
label="封面图"
>
<template slot-scope="scope">
<img :src="scope.row.images" width="100" height="100">
</template>
</el-table-column>
<!-- <el-table-column
prop="images"
label="是否可试听"
>
</el-table-column> -->
<el-table-column width="180">
<template slot-scope="scope">
<el-button type="danger" @click="deliteBook(scope.$index)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div style="text-align: center;">
<el-button type="primary" size="mini" plain @click="showChooseBook">添加</el-button>
</div>
</el-form-item>
<el-form-item label="商品名称" prop="productName">
<el-input v-model="dataForm.productName" placeholder="商品名称"></el-input>
</el-form-item>
@@ -84,6 +116,12 @@
<el-input v-model="dataForm.format" placeholder="16开或其他规格"></el-input>
</el-form-item>
</div>
<!-- 关联的图书ids -->
<!-- <div style="clear: both;">
<el-form-item label="关联图书" prop="Books">
</el-form-item>
</div> -->
<div style="clear: both;">
<el-form-item label="是否包邮" prop="isFreeMail">
<el-radio-group v-model="dataForm.isFreeMail">
@@ -163,8 +201,12 @@
delFlag: '',
sort: '',
goodsType: '', // 商品类型
poids: []
poids: [],
Books: [] // 关联的图书
},
bookidsd:[],
dataRule: {
productName: [{
required: true,
@@ -272,6 +314,12 @@
this.getTreeList()
},
methods: {
showChooseBook() {
// 显示图书列表
this.$emit("showchooseBookf", { 'bookIds': this.dataForm.Books });
console.log('发送指令')
this.$bus.$emit("showchooseBook", { 'bookIds': this.dataForm.Books });
},
init(id) {
this.dataForm.productId = id || 0
this.visible = true
@@ -308,6 +356,14 @@
this.dataForm.poids = data.shopProduct.poids
this.dataForm.productStock = data.shopProduct.productStock
this.dataForm.hDprice = data.shopProduct.activityPrice
let arrArr = []
if (data.shopProduct.bookidsimages !== '') {
this.dataForm.Books = data.shopProduct.bookidsimages
}
sessionStorage.setItem('Books', JSON.stringify(this.dataForm.Books))
if (data.shopProduct.productImages != "") {
var img = {
name: '',
@@ -317,18 +373,19 @@
attr.push(img)
this.fileList = attr
}
if (data.shopProduct.productImageList == null || data.shopProduct.productImageList[0] == '' ||
data.shopProduct.productImageList == "") {
return this.swiperfileList = []
}
} else {
this.swiperfileList = []
console.log('走这')
}else {
// 有轮播图
console.log(data.shopProduct.productImageList)
let arr = []
let arr1 = []
arr = data.shopProduct.productImageList.split(',');
console.log(arr)
console.log(arr, '处理后得轮播图数组')
arr.forEach((item, index) => {
arr1.push({
name: index,
@@ -337,6 +394,7 @@
});
this.swiperfileList = arr1
}
}
})
}
})
@@ -352,14 +410,23 @@
console.log(data.dataList)
this.goodsTypeList = data.dataList
})
},
// 删除图书
deliteBook(index) {
this.dataForm.Books.splice(index, 1)
sessionStorage.setItem('Books',JSON.stringify(this.dataForm.Books))
},
dealImgChange(file, fileList) {
this.dataForm.noneBtnImg = fileList.length >= this.dataForm.limitCountImg;
},
// 表单提交
dataFormSubmit() {
this.getBookIds()
// console.log(this.bookidsd,'this.bookidsd')
// return false
this.$refs['dataForm'].validate((valid) => {
this.dataForm.productImageList = this.getStringImgUrl()
var bookIDS = this.getBookIds()
// console.log(this.dataForm.productImageList)
if (valid) {
this.$http({
@@ -388,7 +455,9 @@
'pageNum': this.dataForm.pageNum,
'quality': this.dataForm.quality, // 内文用纸
'productStock': this.dataForm.productStock, // 库存
'activityPrice': this.dataForm.hDprice
'activityPrice': this.dataForm.hDprice,
'bookids': this.bookidsd, // 关联的图书
'bookidsimages': this.dataForm.Books // 关联的图书对象
})
}).then(({
data
@@ -414,6 +483,13 @@
},
changeTime(e) {
console.log(e)
},
getBookIds() {
// 图书ids
console.log(this.dataForm.Books,'Books')
this.bookidsd = this.dataForm.Books.map(item => {
return item.id
})
},
getTreeList() {
this.$http({
@@ -498,6 +574,14 @@
components: {
quillEditor
},
mounted() {
this.$bus.$on("haveBookIds", (data) => {
sessionStorage.setItem('Books', JSON.stringify(data.bookIds))
// console.log('haveBookIds',data)
data.bookIds.length > 0 ? this.dataForm.Books = data.bookIds : this.dataForm.Books = []
});
},
watch: {
visible: {
handler(val, oldVal) {

24
src/views/modules/shop/shopproduct.vue
View File

@@ -66,11 +66,13 @@
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList" @showchooseBookf = "showchooseBookf"></add-or-update>
<choose-book v-if="chooseBookVisible" :bookIds = bookIds ref="chooseBook" :chooseBookVisible = chooseBookVisible @closeBookf = "closeBookf"></choose-book>
</div>
</template>
<script>
import chooseBook from './chooseBook.vue'
import AddOrUpdate from './shopproduct-add-or-update'
export default {
data () {
@@ -85,16 +87,32 @@
totalPage: 0,
dataListLoading: false,
dataListSelections: [],
addOrUpdateVisible: false
addOrUpdateVisible: false,
chooseBookVisible: false,
bookIds:[]
}
},
components: {
AddOrUpdate
AddOrUpdate,
chooseBook
},
activated () {
this.getDataList()
},
methods: {
closeBookf() {
this.chooseBookVisible = false
},
showchooseBookf(e) {
// 显示图书列表
this.chooseBookVisible = true
console.log(this.bookIds,'this.bookIds')
// this.$nextTick(() => {
// this.$refs.chooseBook.getBookList()
// this.bookIds = e.bookIds
// })
},
// 获取数据列表
getDataList () {
this.dataListLoading = true