阶段性上传

src/router/index.js

@@ -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) {

src/views/modules/book/book-add-or-update.vue

@@ -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>
@@ -90,13 +95,36 @@
           <el-form-item label="优惠价格" prop="salePrice">
             <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,9 +291,9 @@ export default {
         // sort: [
         //   { required: true, message: '排序不能为空', trigger: 'blur' }
         // ],
-        // delFlag: [
+        // splits: [
-        //   { required: true, message: '删除标记不能为空', trigger: 'blur' }
+        //    { 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 = '';

src/views/modules/book/book.vue

@@ -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.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.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',

src/views/modules/book/bookComments.vue

@@ -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>

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

@@ -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: '',         
+
         },
-        dataRule: {
+        timer:null,
-          bookId: [
+        opName:'',
-            { required: true, message: '图书id不能为空', trigger: 'blur' }
+        fileListVoices: [],
+        progressPercent:0,
+        dataRule: {          
+          number: [
+            { required: true, message: '章节序号不能为空', trigger: 'blur' }
           ],
           chapter: [
-            { required: true, message: '章节不能为空', trigger: 'blur' }
+            { required: true, message: '章节标题不能为空', trigger: 'blur' }
           ],
-          content: [
+          // content: [
-            { required: true, message: '内容不能为空', trigger: 'blur' }
+          //   { required: true, message: '内容不能为空', trigger: 'blur' }
-          ],
+          // ],
-          voices: [
+          // voices: [
-            { required: true, message: '音频文件地址不能为空', trigger: 'blur' }
+          //   { required: true, message: '音频文件地址不能为空', trigger: 'blur' }
-          ],
+          // ],
-          createTime: [
+          // createTime: [
-            { required: true, message: '不能为空', trigger: 'blur' }
+          //   { required: true, message: '不能为空', trigger: 'blur' }
-          ],
+          // ],
-          updateTime: [
+          // updateTime: [
-            { required: true, message: '不能为空', trigger: 'blur' }
+          //   { required: true, message: '不能为空', trigger: 'blur' }
-          ],
+          // ],
-          sort: [
+          // sort: [
-            { required: true, message: '不能为空', trigger: 'blur' }
+          //   { required: true, message: '不能为空', trigger: 'blur' }
-          ],
+          // ],
-          delFlag: [
+          // delFlag: [
-            { required: true, message: '不能为空', trigger: 'blur' }
+          //   { 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") {
+        if (res.msg == "success") {
+        //console.log(res,'res')
         this.dataForm.voices = res.url;
         this.$message.success("上传成功");
       } else {
@@ -132,8 +172,8 @@ 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,
+                'number': this.dataForm.number    // 章节序号
-                'updateTime': this.dataForm.updateTime,
+                // 'createTime': this.dataForm.createTime,
-                'sort': this.dataForm.sort,
+                // 'updateTime': this.dataForm.updateTime,
-                'delFlag': this.dataForm.delFlag
+                // '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')
                   }
                 })

src/views/modules/book/bookchapter.vue

@@ -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: '操作成功',

src/views/modules/book/bookcomment-add-or-update.vue

@@ -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>

src/views/modules/book/clock-add-or-update.vue

@@ -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>

src/views/modules/book/clock.vue

@@ -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>
+  

src/views/modules/shop/chooseBook.vue

@@ -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>

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

@@ -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>
@@ -27,7 +59,7 @@
         </el-dialog>
       </el-form-item>
       <el-form-item label="商品轮播图" prop="productImageList">
-        <el-upload :limit="5" class="el-uploadfeng noneBtnImg"
+        <el-upload :limit="5" class="el-uploadfeng noneBtnImg" 
           :class="{ uoloadSty: dataForm.showBtnDealImg, disUoloadSty: dataForm.noneBtnImg }"
           :action="baseUrl + '/oss/fileoss'" list-type="picture-card" :on-preview="handlePictureCardPreview"
           :file-list="swiperfileList" :on-success="bannerHandlePicSuccess" accept=".jpeg,.jpg,.gif,.png"
@@ -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">
@@ -106,7 +144,7 @@
       <el-button @click="handlereset">取消</el-button>
       <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
     </span>
-  </el-dialog>
+  </el-dialog>  
 </template>
 
 <script>
@@ -163,8 +201,12 @@
           delFlag: '',
           sort: '',
           goodsType: '', // 商品类型
-          poids: []
+          poids: [],
+          
+          Books: [] // 关联的图书
+
         },
+        bookidsd:[],
         dataRule: {
           productName: [{
             required: true,
@@ -271,7 +313,13 @@
     created() {
       this.getTreeList()
     },
-    methods: {
+  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 = []
+                  this.swiperfileList = []
-                }
+                  console.log('走这')
-              } else {
+                }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() {
+    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,7 +483,14 @@
       },
       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({
           url: this.$http.adornUrl(`/book/shopcategory/listTree`),
@@ -497,7 +573,15 @@
     },
     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) {

src/views/modules/shop/shopproduct.vue

@@ -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: {
+  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