|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<div class="common-draw-list-view">
|
|
|
- <div
|
|
|
+ <!-- <div
|
|
|
v-if="route.query.idx === '5'"
|
|
|
class="no-content"
|
|
|
>
|
|
@@ -10,9 +10,8 @@
|
|
|
alt=""
|
|
|
draggable="false"
|
|
|
>
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
<ul
|
|
|
- v-if="route.query.idx !== '5'"
|
|
|
ref="drawUlEl"
|
|
|
class="common-draw-list"
|
|
|
@wheel="onDrawUlWheel"
|
|
@@ -23,6 +22,7 @@
|
|
|
>
|
|
|
<img
|
|
|
class=""
|
|
|
+ :data-original="`${imgPrefixHigh}/${drawName}`"
|
|
|
:src="`${imgPrefix}/${drawName}`"
|
|
|
alt=""
|
|
|
draggable="false"
|
|
@@ -31,7 +31,6 @@
|
|
|
</li>
|
|
|
</ul>
|
|
|
<ul
|
|
|
- v-if="route.query.idx !== '5'"
|
|
|
ref="groupUlEl"
|
|
|
class="group-list"
|
|
|
@wheel="onGroupUlWheel"
|
|
@@ -97,9 +96,9 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import { ref, computed, } from "vue"
|
|
|
+import { ref, computed, onMounted, } from "vue"
|
|
|
import { useRoute, useRouter } from "vue-router"
|
|
|
-import { hasShownForword, likeRecord } from "@/store/index.js"
|
|
|
+import { likeRecord } from "@/store/index.js"
|
|
|
import { drawTree } from "@/assets/draw-tree.js"
|
|
|
import Viewer from 'viewerjs'
|
|
|
|
|
@@ -115,9 +114,11 @@ const activeGroupIdx = ref(0)
|
|
|
|
|
|
const groupL1Name = Object.keys(drawTree)[Number(route.query.idx) - 1]
|
|
|
const groupList = Object.values(drawTree)[Number(route.query.idx) - 1]
|
|
|
+console.log(groupL1Name, groupList, 'groupList')
|
|
|
const groupName = computed(() => {
|
|
|
return Object.keys(groupList)[activeGroupIdx.value]
|
|
|
})
|
|
|
+
|
|
|
const drawList = computed(() => {
|
|
|
return Object.keys(groupList[Object.keys(groupList)[activeGroupIdx.value]])
|
|
|
})
|
|
@@ -125,10 +126,16 @@ const imgPrefix = computed(() => {
|
|
|
return `${process.env.VUE_APP_OUTER_ASSETS_PREFIX}draws/${encodeURIComponent(groupL1Name)}/${encodeURIComponent(groupName.value)}`
|
|
|
})
|
|
|
|
|
|
+const imgPrefixHigh = computed(() => {
|
|
|
+ return `${process.env.VUE_APP_OUTER_ASSETS_PREFIX}drawsHigh/${encodeURIComponent(groupL1Name)}/${encodeURIComponent(groupName.value)}`
|
|
|
+})
|
|
|
+
|
|
|
const isViewingBigImage = ref(false)
|
|
|
let viewer = null
|
|
|
function onClickImg(e) {
|
|
|
+ // console.log(e.target)
|
|
|
viewer = new Viewer(e.target, {
|
|
|
+ url: 'data-original',
|
|
|
backdrop: 'static', // 点击空白区域不会关闭
|
|
|
button: true,
|
|
|
fullscreen: true,
|
|
@@ -163,10 +170,28 @@ api.reportVisit(Number(route.query.idx)).then((res) => {
|
|
|
console.log('sdfsdf', res)
|
|
|
})
|
|
|
|
|
|
-const likeCount = ref(null)
|
|
|
-api.getLikeCount(route.query.idx).then((res) => {
|
|
|
- likeCount.value = res
|
|
|
+
|
|
|
+// // 显示单元点赞
|
|
|
+// const likeCount = ref(null)
|
|
|
+// api.getLikeCount(route.query.idx).then((res) => {
|
|
|
+// likeCount.value = res
|
|
|
+// })
|
|
|
+
|
|
|
+const likeCount = ref()
|
|
|
+onMounted(() => {
|
|
|
+ getLikeCount()
|
|
|
})
|
|
|
+
|
|
|
+const getLikeCount = () => {
|
|
|
+ // 总点赞量
|
|
|
+ likeCount.value = 0
|
|
|
+ api.getAllLikeCount().then((res) => {
|
|
|
+ likeCount.value += res
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
const hasLiked = computed(() => {
|
|
|
return likeRecord.value[route.query.idx - 1]
|
|
|
})
|