Compare commits
4 Commits
Author | SHA1 | Date | |
---|---|---|---|
2aea1eae7f | |||
063a1330d7 | |||
0607e6241b | |||
89538823fc |
@ -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>
|
||||||
|
@ -5,6 +5,7 @@ import App from './App.vue'
|
|||||||
|
|
||||||
import ClientOnly from './ssr/ClientOnly.vue'
|
import ClientOnly from './ssr/ClientOnly.vue'
|
||||||
import Hr from './ui/BetterHr.vue'
|
import Hr from './ui/BetterHr.vue'
|
||||||
|
import Form from './ui/Form.vue'
|
||||||
|
|
||||||
export function createApp() {
|
export function createApp() {
|
||||||
const app = createSSRApp(App)
|
const app = createSSRApp(App)
|
||||||
@ -13,5 +14,6 @@ export function createApp() {
|
|||||||
app
|
app
|
||||||
.component('ClientOnly', ClientOnly)
|
.component('ClientOnly', ClientOnly)
|
||||||
.component('Hr', Hr)
|
.component('Hr', Hr)
|
||||||
|
.component('Form', Form)
|
||||||
return { app, pinia }
|
return { app, pinia }
|
||||||
}
|
}
|
||||||
|
@ -16,7 +16,7 @@
|
|||||||
---
|
---
|
||||||
- MDUI 2 [mdui.org](https://mdui.org)
|
- MDUI 2 [mdui.org](https://mdui.org)
|
||||||
- Vue 3 [vuejs.org](https://vuejs.org)
|
- Vue 3 [vuejs.org](https://vuejs.org)
|
||||||
- Vite 6 [vitejs.dev](https://vitejs.dev)
|
- Vite 6 [vitejs.dev](https://vite.dev)
|
||||||
|
|
||||||
其他
|
其他
|
||||||
---
|
---
|
||||||
|
20
src/ui/Form.vue
Normal file
20
src/ui/Form.vue
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
<template>
|
||||||
|
<form @submit="handleSubmit">
|
||||||
|
<slot></slot>
|
||||||
|
</form>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref } from 'vue'
|
||||||
|
|
||||||
|
const emit = defineEmits(['submit'])
|
||||||
|
|
||||||
|
function handleSubmit(event) {
|
||||||
|
event.preventDefault()
|
||||||
|
const form = event.target
|
||||||
|
const formData = new FormData(form)
|
||||||
|
const data = Object.fromEntries(formData.entries())
|
||||||
|
emit('submit', data, event)
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
@ -9,13 +9,13 @@ import Intro from '../texts/intro.md'
|
|||||||
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
|
||||||
const src = ref('')
|
|
||||||
const srcText = ref(null)
|
|
||||||
const err = ref(false)
|
const err = ref(false)
|
||||||
|
const srcText = ref(null)
|
||||||
|
|
||||||
function convert(from) {
|
function convert(from) {
|
||||||
if( Number(from) ) {
|
if( Number(from) ) {
|
||||||
return {
|
return {
|
||||||
|
type: 's',
|
||||||
id: Number(from)
|
id: Number(from)
|
||||||
}
|
}
|
||||||
} else if (from.includes('https://archiveofourown.org/works/')) {
|
} else if (from.includes('https://archiveofourown.org/works/')) {
|
||||||
@ -35,9 +35,10 @@ function convert(from) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function onConvert() {
|
function onConvert(data) {
|
||||||
const { id, cid } = convert(src.value)
|
const { type, id, cid } = convert(data.src)
|
||||||
if (id == null) {
|
console.log(type, id, cid)
|
||||||
|
if (type == null) {
|
||||||
err.value = true
|
err.value = true
|
||||||
srcText.value?.focus()
|
srcText.value?.focus()
|
||||||
} else {
|
} else {
|
||||||
@ -56,17 +57,17 @@ function onConvert() {
|
|||||||
<section id="converter">
|
<section id="converter">
|
||||||
<h2>链接转换</h2>
|
<h2>链接转换</h2>
|
||||||
<p>输入完整链接或者 ID</p>
|
<p>输入完整链接或者 ID</p>
|
||||||
<ClientOnly>
|
<Form @submit="onConvert"><ClientOnly>
|
||||||
<mdui-text-field variant="filled" label="链接" placeholder="https://archiveofourown.org/works/114514" @input="src = $event.target.value" ref='srcText'>
|
<mdui-text-field variant="filled" label="链接" name="src" placeholder="https://archiveofourown.org/works/114514" ref='srcText'>
|
||||||
<span v-if='err' slot="helper" class='warn-text'>链接格式错误!</span>
|
<span v-if='err' slot="helper" class='warn-text'>链接格式错误!</span>
|
||||||
</mdui-text-field><br/>
|
</mdui-text-field><br/>
|
||||||
<div style="display: flex">
|
<div style="display: flex">
|
||||||
<div style="flex-grow: 1"></div>
|
<div style="flex-grow: 1"></div>
|
||||||
<mdui-button @click='onConvert'>-></mdui-button>
|
<mdui-button type="submit">-></mdui-button>
|
||||||
</div>
|
</div>
|
||||||
{{ src }}
|
|
||||||
<template #ssr>
|
<template #ssr>
|
||||||
Padding...
|
<input type="text" id="src" name="src" />
|
||||||
</template></ClientOnly>
|
<input type="submit" />
|
||||||
|
</template></ClientOnly></Form>
|
||||||
</section>
|
</section>
|
||||||
</template>
|
</template>
|
||||||
|
@ -120,7 +120,7 @@ function openBookmarkMenu(bk, index) {
|
|||||||
async function deleteBookmark() {
|
async function deleteBookmark() {
|
||||||
if (bookmarkSelect.value) {
|
if (bookmarkSelect.value) {
|
||||||
bookmarkStore.del(bookmarkSelect.value.bk.id)
|
bookmarkStore.del(bookmarkSelect.value.bk.id)
|
||||||
bookmarks.value.splice(bookmarkSelect.value.index)
|
bookmarks.value.splice(bookmarkSelect.value.index,1)
|
||||||
bookmarkSelect.value = null
|
bookmarkSelect.value = null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -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