Compare commits
3 Commits
v1.0.3-rc1
...
v1.0.6
Author | SHA1 | Date | |
---|---|---|---|
9ef6da3efb | |||
2aea1eae7f | |||
063a1330d7 |
@ -33,9 +33,9 @@ if (!isProduction) {
|
|||||||
})
|
})
|
||||||
app.use(vite.middlewares)
|
app.use(vite.middlewares)
|
||||||
} else {
|
} else {
|
||||||
const compression = (await import('compression')).default
|
//const compression = (await import('compression')).default
|
||||||
const sirv = (await import('sirv')).default
|
const sirv = (await import('sirv')).default
|
||||||
app.use(compression())
|
//app.use(compression())
|
||||||
app.use(base, sirv('./dist/client', { extensions: [] }))
|
app.use(base, sirv('./dist/client', { extensions: [] }))
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -98,7 +98,7 @@ onMounted(async () => {
|
|||||||
<li v-for="item in routeStore.allRoutes"
|
<li v-for="item in routeStore.allRoutes"
|
||||||
:key="item.path"
|
:key="item.path"
|
||||||
:class="{ 'active-item' : item.path == $route.path }"
|
:class="{ 'active-item' : item.path == $route.path }"
|
||||||
>{{ item.name }}</li>
|
><a :href="item.path">{{ item.name }}</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</template></ClientOnly>
|
</template></ClientOnly>
|
||||||
</nav>
|
</nav>
|
||||||
|
@ -21,8 +21,8 @@ body {
|
|||||||
|
|
||||||
// MDUI 组件样式
|
// MDUI 组件样式
|
||||||
mdui-card {
|
mdui-card {
|
||||||
width: 100%;
|
width: 98%;
|
||||||
padding: 0 16px 16px;
|
padding: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
mdui-text-field {
|
mdui-text-field {
|
||||||
|
@ -12,14 +12,27 @@ export const useWorkReadState = defineStore('workRead', () => {
|
|||||||
const pesud = ref(null)
|
const pesud = ref(null)
|
||||||
const title = ref(null)
|
const title = ref(null)
|
||||||
const text = ref(null)
|
const text = ref(null)
|
||||||
const publishedTime = ref(null)
|
|
||||||
const state = ref('')
|
const state = ref('')
|
||||||
|
const publishedTime = ref(null)
|
||||||
|
const wordCount = ref(0)
|
||||||
|
const kudoCount = ref(0)
|
||||||
|
const hitCount = ref(0)
|
||||||
|
const category = ref([])
|
||||||
|
const fandom = ref([])
|
||||||
|
const lang = ref(null)
|
||||||
function setData(data) {
|
function setData(data) {
|
||||||
id.value = data.workId
|
id.value = data.workId
|
||||||
title.value = data.title
|
title.value = data.title
|
||||||
summary.value = [escapeAndFormatText(data.summary)]
|
summary.value = [escapeAndFormatText(data.summary)]
|
||||||
pesud.value = data.pesud
|
pesud.value = data.pesud
|
||||||
text.value = data.text.split('\n\n')
|
text.value = data.text.split('\n\n')
|
||||||
|
publishedTime.value = data.stats.publishedTime
|
||||||
|
wordCount.value = data.stats.wordCount
|
||||||
|
kudoCount.value = data.stats.kudoCount
|
||||||
|
hitCount.value = data.stats.hitCount
|
||||||
|
category.value = data.category
|
||||||
|
fandom.value = data.fandom
|
||||||
|
lang.value = data.lang
|
||||||
}
|
}
|
||||||
async function loadWork(target) {
|
async function loadWork(target) {
|
||||||
if (target == id.value || state.value == 'loading') return
|
if (target == id.value || state.value == 'loading') return
|
||||||
@ -39,8 +52,14 @@ export const useWorkReadState = defineStore('workRead', () => {
|
|||||||
summary,
|
summary,
|
||||||
pesud,
|
pesud,
|
||||||
text,
|
text,
|
||||||
publishedTime,
|
|
||||||
state,
|
state,
|
||||||
|
publishedTime,
|
||||||
|
wordCount,
|
||||||
|
kudoCount,
|
||||||
|
hitCount,
|
||||||
|
category,
|
||||||
|
fandom,
|
||||||
|
lang,
|
||||||
setData,
|
setData,
|
||||||
loadWork
|
loadWork
|
||||||
}
|
}
|
||||||
|
@ -1,11 +1,19 @@
|
|||||||
<script setup>import 'mdui/components/divider.js'</script>
|
<script setup>
|
||||||
|
import 'mdui/components/divider.js'
|
||||||
|
defineProps(['class']) // 接收外部 class 属性
|
||||||
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<ClientOnly><mdui-divider class='hr-divider'></mdui-divider>
|
<ClientOnly>
|
||||||
<template #ssr><hr/></template></ClientOnly>
|
<!-- 将 class 传入 mdui-divider 中 -->
|
||||||
|
<mdui-divider :class="['hr-divider', $attrs.class]"></mdui-divider>
|
||||||
|
<template #ssr><hr :class="['hr-divider', $attrs.class]" /></template>
|
||||||
|
</ClientOnly>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.hr-divider {
|
.hr-divider {
|
||||||
margin: 8px 0px;
|
margin: 8px 0px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
@ -22,6 +22,9 @@ import 'mdui/components/button.js'
|
|||||||
import 'mdui/components/dropdown.js'
|
import 'mdui/components/dropdown.js'
|
||||||
import 'mdui/components/menu.js'
|
import 'mdui/components/menu.js'
|
||||||
import 'mdui/components/menu-item.js'
|
import 'mdui/components/menu-item.js'
|
||||||
|
import 'mdui/components/collapse.js'
|
||||||
|
import 'mdui/components/collapse-item.js'
|
||||||
|
import 'mdui/components/card.js'
|
||||||
|
|
||||||
import '@mdui/icons/bookmark.js'
|
import '@mdui/icons/bookmark.js'
|
||||||
|
|
||||||
@ -47,6 +50,12 @@ let bookmarkStore = null
|
|||||||
let paragraphs = []
|
let paragraphs = []
|
||||||
let currentParagraph = null
|
let currentParagraph = null
|
||||||
|
|
||||||
|
const categoryName = {
|
||||||
|
mm: "男/男",
|
||||||
|
ff: "女/女",
|
||||||
|
fm: '女/男'
|
||||||
|
}
|
||||||
|
|
||||||
async function addBookmark() {
|
async function addBookmark() {
|
||||||
if (currentParagraph) {
|
if (currentParagraph) {
|
||||||
const id = await bookmarkStore.add(workReadState.id, readIndex, currentParagraph.textContent.slice(0,20), '')
|
const id = await bookmarkStore.add(workReadState.id, readIndex, currentParagraph.textContent.slice(0,20), '')
|
||||||
@ -187,10 +196,42 @@ onBeforeUnmount(() => {
|
|||||||
<article>
|
<article>
|
||||||
<h1 style="margin: auto">{{ workReadState.title }}</h1>
|
<h1 style="margin: auto">{{ workReadState.title }}</h1>
|
||||||
<h4>{{ workReadState.pesud }}</h4>
|
<h4>{{ workReadState.pesud }}</h4>
|
||||||
|
<mdui-card style="margin: 8px; padding: 0px;"><mdui-collapse acc>
|
||||||
|
<mdui-collapse-item value="info"><mdui-list-item class="infoblockhead" slot="header">
|
||||||
|
作品信息
|
||||||
|
</mdui-list-item><div class="infoblock"><dl>
|
||||||
|
<dt>分类</dt><ul>
|
||||||
|
<li v-for="item in workReadState.category" :key="item">
|
||||||
|
{{ categoryName[item] }}</li>
|
||||||
|
</ul>
|
||||||
|
<dt>原著</dt><ul>
|
||||||
|
<li v-for="item in workReadState.fandom" :key="item">
|
||||||
|
{{ item }}</li>
|
||||||
|
</ul>
|
||||||
|
<dt>语言</dt><dd>
|
||||||
|
{{ workReadState.lang }}
|
||||||
|
</dd>
|
||||||
|
</dl></div></mdui-collapse-item>
|
||||||
|
<mdui-collapse-item value="stats"><mdui-list-item class="infoblockhead" slot="header">
|
||||||
|
作品状态
|
||||||
|
</mdui-list-item><div class="infoblock"><dl>
|
||||||
|
<dt>发布时间</dt><dd>
|
||||||
|
{{ workReadState.publishedTime.year }} -
|
||||||
|
{{ workReadState.publishedTime.month }} -
|
||||||
|
{{ workReadState.publishedTime.date }}
|
||||||
|
</dd>
|
||||||
|
<dt>字数</dt><dd>
|
||||||
|
{{ workReadState.wordCount }}
|
||||||
|
</dd>
|
||||||
|
<dt>点击</dt><dd>
|
||||||
|
{{ workReadState.hitCount }}
|
||||||
|
</dd>
|
||||||
|
</dl></div></mdui-collapse-item>
|
||||||
|
</mdui-collapse></mdui-card>
|
||||||
<blockquote>
|
<blockquote>
|
||||||
<p v-for="para in workReadState.summary" :key="para" v-html='para'></p>
|
<p v-for="para in workReadState.summary" :key="para" v-html='para'></p>
|
||||||
</blockquote>
|
</blockquote>
|
||||||
<Hr/>
|
<Hr />
|
||||||
<div ref='content'>
|
<div ref='content'>
|
||||||
<p v-for="(para, index) in workReadState.text" :key="para" :data-index="index">{{ para }}</p>
|
<p v-for="(para, index) in workReadState.text" :key="para" :data-index="index">{{ para }}</p>
|
||||||
</div>
|
</div>
|
||||||
@ -237,6 +278,31 @@ onBeforeUnmount(() => {
|
|||||||
<template v-if="workReadState.state == 'ready'">
|
<template v-if="workReadState.state == 'ready'">
|
||||||
<h1>{{ workReadState.title }}</h1>
|
<h1>{{ workReadState.title }}</h1>
|
||||||
<h2>{{ workReadState.pesud }}</h2>
|
<h2>{{ workReadState.pesud }}</h2>
|
||||||
|
<dl>
|
||||||
|
<dt>分类</dt><ul>
|
||||||
|
<li v-for="item in workReadState.category" :key="item">
|
||||||
|
{{ categoryName[item] }}</li>
|
||||||
|
</ul>
|
||||||
|
<dt>原著</dt><ul>
|
||||||
|
<li v-for="item in workReadState.fandom" :key="item">
|
||||||
|
{{ item }}</li>
|
||||||
|
</ul>
|
||||||
|
<dt>语言</dt><dd>
|
||||||
|
{{ workReadState.lang }}
|
||||||
|
</dd>
|
||||||
|
<dt>发布时间</dt><dd>
|
||||||
|
{{ workReadState.publishedTime.year }} -
|
||||||
|
{{ workReadState.publishedTime.month }} -
|
||||||
|
{{ workReadState.publishedTime.date }}
|
||||||
|
</dd>
|
||||||
|
<dt>字数</dt><dd>
|
||||||
|
{{ workReadState.wordCount }}
|
||||||
|
</dd>
|
||||||
|
<dt>点击</dt><dd>
|
||||||
|
{{ workReadState.hitCount }}
|
||||||
|
</dd>
|
||||||
|
</dl>
|
||||||
|
<Hr />
|
||||||
<blockquote>
|
<blockquote>
|
||||||
<p v-for="para in workReadState.summary" :key="para" v-html='para'></p>
|
<p v-for="para in workReadState.summary" :key="para" v-html='para'></p>
|
||||||
</blockquote>
|
</blockquote>
|
||||||
@ -254,4 +320,12 @@ onBeforeUnmount(() => {
|
|||||||
z-index: 1000; /* 确保悬浮按钮在其他内容上方 */
|
z-index: 1000; /* 确保悬浮按钮在其他内容上方 */
|
||||||
animation: slideInFromRight var(--mdui-motion-duration-medium2) var(--mdui-motion-easing-standard); /* 动画时长和缓动效果 */
|
animation: slideInFromRight var(--mdui-motion-duration-medium2) var(--mdui-motion-easing-standard); /* 动画时长和缓动效果 */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.infoblock {
|
||||||
|
margin: 8px 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.infoblockhead {
|
||||||
|
background-color: rgb(var(--mdui-color-primary-container));
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@ -19,8 +19,11 @@ export default defineConfig({
|
|||||||
}),
|
}),
|
||||||
vueJsx(),
|
vueJsx(),
|
||||||
vueDevTools(),
|
vueDevTools(),
|
||||||
markdown()
|
markdown({
|
||||||
|
markdownItSetup(md) {
|
||||||
|
md.renderer.rules.hr = () => "<Hr />"
|
||||||
|
}
|
||||||
|
})
|
||||||
],
|
],
|
||||||
resolve: {
|
resolve: {
|
||||||
alias: {
|
alias: {
|
||||||
|
Reference in New Issue
Block a user