Merge branch 'master' of http://182.92.203.7:2001/r/xiehe_website

杨磊

35 分钟以前 ee213bf458d3961a0560ce3b68a3ad38322ece97

 src/views/bookStore/detail.vue

@@ -20,9 +20,9 @@
            </div>
          </el-tooltip>
        </div>
        <div class="bookDetail">
        <div class="bookDetail" v-loading="loading">
          <div class="bookImg">
            <img class="autoImg" :src="bookInfo.icon" alt="" />
            <img class="autoImg" :src="bookInfo.icon ? bookInfo.icon : defaultImg" alt="" />
          </div>
          <span class="iconfont icon-tubiaozhizuo"></span>

@@ -35,24 +35,27 @@
                {{ bookInfo.seriesName }}
              </div>
              <div class="collectBox">
                <div class="collectText" @click="collectBook" v-if="bookInfo.isFavourite">
                  已收藏
                </div>
                <img
                  @click="collectBook"
                  v-if="bookInfo.isFavourite"
                  class="buyIcon"
                  src="@/assets/images/bookStore/shoucang.svg"
                  src="@/assets/images/xiehe/detail/Collection_fill.png"
                  style="margin-right: 10px"
                />
                <span
                  @click="collectBook"
                  v-else
                  class="iconfont icon-shoucang"
                  style="margin-right: 10px"
                >
                </span>
                <div class="collectText" @click="collectBook" v-if="bookInfo.isFavourite">
                  已收藏
                <span v-else class="iconfont icon-shoucang" style="margin-right: 10px"> </span>

                <div class="collectText" @click="collectBook" v-else>
                  收藏

                  <img
                    class="buyIcon"
                    src="@/assets/images/xiehe/detail/Collection.png"
                    style="margin-right: 10px"
                  />
                </div>
                <div class="collectText" @click="collectBook" v-else>收藏</div>
              </div>
            </div>
            <div class="authorBox">
@@ -87,18 +90,16 @@
            </div>
            <div class="authorBox" style="box-sizing: border-box">
              <div class="titleBox1">
                <div>一级分类：</div>
                <div>二级分类：</div>
                <div>分类：</div>
              </div>
              <div class="valueBox">
                <div>全国高等职业教育预防医学专业规划教材</div>
                <div>高等职业教育</div>
              </div>
            </div>
            <div class="purchaseBox">
              <div class="priceBox">
                <span v-if="bookInfo.price && bookInfo.price > 0">
                  <span>定价：</span><span>￥</span> <span>{{ bookInfo.price || '-' }}</span
                  <span>数字教材</span><span>￥</span> <span>{{ bookInfo.price || '-' }}</span
                  ><span v-if="bookInfo.VirtualPrice">原价：￥{{ bookInfo.VirtualPrice }}</span>
                </span>

@@ -167,67 +168,46 @@
              <el-button v-if="currentRoute == 'teachingServices'" plain @click="addPaperBook"
                >纸质样书</el-button
              >
              <el-button plain @click="applyTextBook">申请使用</el-button>
              <el-button
                size="large"
                type="primary"
                @click="useCode"
                v-if="!bookInfo.alreadyBuy && currentBook?.state !== 'Normal'"
                >使用购书码</el-button
              >
              <el-button
                style="background-color: #144941; color: #fff"
                @click="applyTextBook"
                size="large"
                type="primary"
                v-if="!bookInfo.alreadyBuy && currentBook?.state !== 'Normal'"
                >申请试用</el-button
              >

              <el-button
                plain
                size="large"
                @click="read"
                v-if="bookInfo.alreadyBuy || currentBook?.state == 'Normal'"
                >开始阅读</el-button
              >
            </div>
          </div>
        </div>
        <el-dialog title="联系编辑" :visible.sync="contactVisible" width="30%" :lock-scroll="false">
          <div class="contactBox" v-if="bookInfo.editor">
            <div class="contacItem">
              <i class="iconfont icon-renwu-ren contacIcon"></i>
              {{ bookInfo.editor.name }}
            </div>
            <div class="contacItem">
              <i class="iconfont icon-QQ contacIcon"></i>
              {{ bookInfo.editor.qq }}
            </div>
            <div class="contacItem">
              <i class="iconfont icon-tongxunlu contacIcon"></i>
              {{ bookInfo.editor.phone }}
            </div>
            <div class="contacItem">
              <i class="iconfont icon-dianhua contacIcon"></i>
              {{ bookInfo.editor.telephone }}
            </div>
          </div>
          <el-empty v-else description="暂无数据" class="empty" :image-size="100"></el-empty>
        </el-dialog>
        <el-dialog title="信息反馈" :visible.sync="dialogVisible" width="50%" :lock-scroll="false">
          <div class="infoDialog">
            <el-input
              type="textarea"
              :rows="8"
              placeholder="详细描述您所遇到的问题，有助于快速给您反馈！"
              v-model="textarea"
            >
            </el-input>
            <div class="subBtn">
              <el-button type="primary" @click="sendDiscuss">提交</el-button>
            </div>
            <div class="infoList">
              <div class="infoItem" v-for="(item, index) in commentList" :key="index">
                <div class="infoImg">
                  <img v-if="item.icon" class="autoImg" :src="item.icon" alt="" />
                  <i v-else class="el-icon-user-solid"></i>
                </div>
                <div class="infoContent">
                  <div class="infoTitle">
                    <div class="userNameBox">{{ item.content.name }}</div>
                    <div class="userNameBox">
                      {{ moment(item.createDate).format('YYYY-MM-DD') }}
                    </div>
                  </div>
                  <div class="infoText">
                    {{ item.content.content }}
                  </div>
                </div>
              </div>
            </div>
          </div>
        </el-dialog>
      </div>
    </div>

    <el-dialog v-model="buyBookCodeDialog" title="购书" width="30%">
      <div class="buyBookCode">
        <div style="line-height: 30px">购书码 ：</div>
        <el-input style="width: 70%" v-model="activateCode" clearable />
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="buyBookCodeDialog = false">取消</el-button>
          <el-button type="primary" @click="userActiveCodeGet"> 激活 </el-button>
        </span>
      </template>
    </el-dialog>
    <div class="detailContent contentBox">
      <div class="resourceBox">
        <div class="tabsBox">
@@ -262,12 +242,15 @@
            </div>
          </div>
        </div>
        <div v-else-if="editableTabsValue == '2'" class="catalogue">bbbb</div>
        <div v-else-if="editableTabsValue == '2'" class="catalogue">
          <div v-if="bookInfo.catalogue" v-html="bookInfo.catalogue" class="catalogueContent"></div>
          <el-empty description="暂无数据" v-else />
        </div>
        <div v-else-if="editableTabsValue == '6'" class="supportingResources">
          <div class="resourcesBox">
            <el-empty v-if="!resourceHave" :image-size="150" description="暂无内容"></el-empty>
            <div class="distribution" v-if="resourceHave">
              <div class="title">资源分布</div>
              <div class="titleBorderBox">资源分布</div>
              <div class="echartsBox">
                <div class="left">
                  <div id="chartsContent" style="width: 600px; height: 400px"></div>
@@ -285,6 +268,7 @@
            </div>
          </div>
        </div>
        <div v-else class="catalogue"><el-empty description="暂无数据" /></div>
      </div>
      <div class="recommendBox">
        <div class="recommendTitle">推荐教材</div>
@@ -311,6 +295,7 @@
        </div>
      </div>
    </div>
    <teacherCertification :isShow="teacherDialog" @dialog-Change="dialogChange" />
  </div>
</template>

@@ -318,6 +303,7 @@
import moment from 'moment'
import axios from 'axios'
import * as echarts from 'echarts'
import defaultImg from '@/assets/images/book-cover.png'
import imgIcon from '@/assets/images/digitalTextbooks/img.png'
import AudioIcon from '@/assets/images/digitalTextbooks/Audio.png'
import DIcon from '@/assets/images/digitalTextbooks/3D.png'
@@ -328,9 +314,16 @@
import videoIcon from '@/assets/images/digitalTextbooks/video.png'
import VRIcon from '@/assets/images/digitalTextbooks/VR.png'
import ziliaoIcon from '@/assets/images/digitalTextbooks/ziliao.png'
import teacherCertification from '@/views/personalCenter/teacherCertification.vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { ref, onBeforeMount, inject, reactive, onMounted, watchEffect } from 'vue'
const MG = inject('MG')
const config = inject('config')
const logIn = inject('logIn')
import { useUserStore } from '@/store'
const userStore = useUserStore()
let teacherDialog = ref(false)

import { useRouter, useRoute } from 'vue-router'
import { applyBookStore } from '@/store'
const route = useRoute()
@@ -340,10 +333,15 @@
let resourceData = ref([])
let recommendBookListData = ref([])
let editableTabsValue = ref('1')
let activateCode = ref('')
let resourceHave = ref(true)
let currentBook = ref(null)
let loading = ref(false)
let buyBookCodeDialog = ref(false)
var chartDom = null
var myChart = {}
var option = null

const editableTabs = reactive([
  {
    title: '教材信息',
@@ -375,6 +373,7 @@
  digitalTextId.value = route.query.bookId
  getBookDetail(digitalTextId.value)
  getRecommendBookList()
  getTextBookList()
})

watchEffect(() => {
@@ -383,12 +382,163 @@
  }
})

const getTextBookList = async () => {
  const data = {
    start: 0,
    size: 9999,
    topicIdOrRefCode: 'applyDigitalBook',
    appRefCode: config.appRefCode,
    sort: {
      type: 'Desc',
      field: 'CreateDate',
    },
  }
  const res = await MG.ugc.getTopicMessageList(data)
  if (res.datas && res.datas.length > 0) {
    for (let i = 0; i < res.datas.length; i++) {
      const item = res.datas[i]
      item.content = JSON.parse(item.content)[0]
      item.productId = item.content.id
    }
    currentBook.value = res.datas.find((item) => item.productId == digitalTextId.value)
  }
}

const read = () => {
  let token = localStorage.getItem(config.tokenKey)
  const url = config.textBookResourceUrl + '?bookId=' + bookInfo.value.refCode + '&token=' + token
  window.open(url)
}

const userActiveCodeGet = () => {
  let lock = true
  console.log(activateCode.value, 'activateCode.value')

  if (activateCode.value == '') {
    ElMessage({
      type: 'error',
      message: '请输入激活码！',
    })
  } else {
    if (lock) {
      lock = false

      MG.store
        .getActiveCode({
          code: activateCode.value,
        })
        .then((res) => {
          console.log(res, 'res')
          const cfg = JSON.parse(res.config)
          console.log(cfg, 'cfg')
          if (cfg && cfg.length > 0) {
            const isActive = cfg.findIndex((item) => item.id == digitalTextId.value)

            if (isActive > -1) {
              MG.store
                .userActiveCode({
                  code: activateCode.value,
                })
                .then((res) => {
                  ElMessage({
                    type: res == '激活成功' ? 'success' : 'error',
                    message: res,
                  })
                  activateCode.value = ''
                  buyBookCodeDialog.value = false
                  getBookDetail(digitalTextId.value)
                  lock = true
                })
            } else {
              ElMessage({
                type: 'error',
                message: '您输入的购书码有误',
              })
            }
          } else {
            ElMessage({
              type: 'error',
              message: '您输入的购书码有误',
            })
          }
        })
    }
  }
}

const useCode = () => {
  if (localStorage.getItem(config.tokenKey)) {
    buyBookCodeDialog.value = true
  } else {
    logIn()
  }
}

const dialogChange = (val) => {
  if (val == false) {
    teacherDialog.value = false
  } else {
    teacherDialog.value = true
  }
}

//收藏书籍
const collectBook = () => {
  if (localStorage.getItem(config.tokenKey)) {
    if (bookInfo.value.isFavourite) {
      MG.store
        .delProductLink({
          productIds: [bookInfo.value.id],
          linkType: 'FavoriteBookCity',
        })
        .then(() => {
          bookInfo.value.isFavourite = false
        })
    } else {
      let params = {
        productIds: [bookInfo.value.id],
        linkType: 'FavoriteBookCity',
      }
      MG.store.addProductLink(params).then((res) => {
        bookInfo.value.isFavourite = true
      })
    }
  } else {
    logIn()
    console.log(logIn)
  }
}

//申请试用
const applyTextBook = () => {
  localStorage.setItem('applyBookInfo', JSON.stringify(bookInfo.value))
  router.push({
    path: '/textBookApply',
  })
const applyTextBook = async () => {
  if (currentBook.value?.state == 'WaitAudit') {
    ElMessageBox.confirm('您已申请试用该书，是否前往查看', '提示', {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    }).then(() => {
      router.push({
        path: '/myApply',
      })
    })
  } else {
    toApply()
  }
}

const toApply = () => {
  if (localStorage.getItem(config.tokenKey)) {
    if (userStore.userInfo && userStore.userInfo.role == 'Teacher') {
      localStorage.setItem('applyBookInfo', JSON.stringify(bookInfo.value))
      router.push({
        path: '/textBookApply',
      })
    } else {
      teacherDialog.value = true
    }
  } else {
    logIn()
  }
}

const getRecommendBookList = () => {
@@ -523,6 +673,7 @@
}

const getBookDetail = (id) => {
  loading.value = true
  const query = {
    path: '*',
    queryType: '*',
@@ -549,6 +700,7 @@
  MG.store.getProductDetail(query).then((res) => {
    console.log(res, 'res')
    bookInfo.value = res.datas
    loading.value = false
    console.log(res.datas, 'res')
  })
}
@@ -639,8 +791,8 @@
  box-sizing: border-box;
}
.collectText {
  font-size: 16px;
  line-height: 25px;
  font-size: 18px;
  line-height: 18px;
  display: inline-block;
}
.bookName {
@@ -826,6 +978,7 @@
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    margin-top: 20px;
  }
  .left {
  }
@@ -935,4 +1088,20 @@
    }
  }
}
.textbookContent,
.authorInfo {
  margin-top: 20px;
  line-height: 28px;
}
.buyBookCode {
  width: 100%;
  display: flex;
  padding: 40px 10px;
  text-align: center;
  align-items: center;
}
.tab-name {
  width: 100px;
  height: 40px;
}
</style>