mirror of
https://github.com/silenty4ng/k5web
synced 2025-01-09 13:24:38 +00:00
update
This commit is contained in:
parent
44b79d3845
commit
e6480e7eab
7 changed files with 317 additions and 113 deletions
|
@ -40,7 +40,7 @@ axios.interceptors.response.use(
|
||||||
(response: AxiosResponse<HttpResponse>) => {
|
(response: AxiosResponse<HttpResponse>) => {
|
||||||
const res = response.data;
|
const res = response.data;
|
||||||
// if the custom code is not 20000, it is judged as an error.
|
// if the custom code is not 20000, it is judged as an error.
|
||||||
if (res.code !== 20000) {
|
if (res.code !== 200) {
|
||||||
Message.error({
|
Message.error({
|
||||||
content: res.msg || 'Error',
|
content: res.msg || 'Error',
|
||||||
duration: 5 * 1000,
|
duration: 5 * 1000,
|
||||||
|
|
|
@ -3,14 +3,14 @@
|
||||||
<t-dialog
|
<t-dialog
|
||||||
v-model:visible="userStore.showLogin"
|
v-model:visible="userStore.showLogin"
|
||||||
attach="body"
|
attach="body"
|
||||||
header="登录"
|
:header="$t('global.login')"
|
||||||
destroy-on-close
|
destroy-on-close
|
||||||
:footer="false"
|
:footer="false"
|
||||||
>
|
>
|
||||||
<template #body>
|
<template #body>
|
||||||
<t-form ref="form" :data="formData" :colon="true" :label-width="0" @submit="onLogin">
|
<t-form ref="form" :data="formData" :colon="true" :label-width="0" @submit="onLogin">
|
||||||
<t-form-item name="account">
|
<t-form-item name="account">
|
||||||
<t-input v-model="formData.account" clearable placeholder="请输入账户名">
|
<t-input v-model="formData.account" clearable :placeholder="$t('global.username')">
|
||||||
<template #prefix-icon>
|
<template #prefix-icon>
|
||||||
<desktop-icon />
|
<desktop-icon />
|
||||||
</template>
|
</template>
|
||||||
|
@ -18,7 +18,7 @@
|
||||||
</t-form-item>
|
</t-form-item>
|
||||||
|
|
||||||
<t-form-item name="password">
|
<t-form-item name="password">
|
||||||
<t-input v-model="formData.password" type="password" clearable placeholder="请输入密码">
|
<t-input v-model="formData.password" type="password" clearable :placeholder="$t('global.password')">
|
||||||
<template #prefix-icon>
|
<template #prefix-icon>
|
||||||
<lock-on-icon />
|
<lock-on-icon />
|
||||||
</template>
|
</template>
|
||||||
|
@ -26,7 +26,7 @@
|
||||||
</t-form-item>
|
</t-form-item>
|
||||||
|
|
||||||
<t-form-item>
|
<t-form-item>
|
||||||
<t-button theme="primary" type="submit" block>登录</t-button>
|
<t-button theme="primary" type="submit" block>{{$t('global.login')}}</t-button>
|
||||||
</t-form-item>
|
</t-form-item>
|
||||||
</t-form>
|
</t-form>
|
||||||
</template>
|
</template>
|
||||||
|
@ -34,14 +34,14 @@
|
||||||
<t-dialog
|
<t-dialog
|
||||||
v-model:visible="userStore.showRegister"
|
v-model:visible="userStore.showRegister"
|
||||||
attach="body"
|
attach="body"
|
||||||
header="注册"
|
:header="$t('global.register')"
|
||||||
destroy-on-close
|
destroy-on-close
|
||||||
:footer="false"
|
:footer="false"
|
||||||
>
|
>
|
||||||
<template #body>
|
<template #body>
|
||||||
<t-form ref="form" :data="formData" :colon="true" :label-width="0" @submit="onRegister">
|
<t-form ref="form" :data="formData" :colon="true" :label-width="0" @submit="onRegister">
|
||||||
<t-form-item name="account">
|
<t-form-item name="account">
|
||||||
<t-input v-model="formData.account" clearable placeholder="请输入账户名">
|
<t-input v-model="formData.account" clearable :placeholder="$t('global.username')">
|
||||||
<template #prefix-icon>
|
<template #prefix-icon>
|
||||||
<desktop-icon />
|
<desktop-icon />
|
||||||
</template>
|
</template>
|
||||||
|
@ -49,7 +49,7 @@
|
||||||
</t-form-item>
|
</t-form-item>
|
||||||
|
|
||||||
<t-form-item name="password">
|
<t-form-item name="password">
|
||||||
<t-input v-model="formData.password" type="password" clearable placeholder="请输入密码">
|
<t-input v-model="formData.password" type="password" clearable :placeholder="$t('global.password')">
|
||||||
<template #prefix-icon>
|
<template #prefix-icon>
|
||||||
<lock-on-icon />
|
<lock-on-icon />
|
||||||
</template>
|
</template>
|
||||||
|
@ -57,7 +57,7 @@
|
||||||
</t-form-item>
|
</t-form-item>
|
||||||
|
|
||||||
<t-form-item name="password2">
|
<t-form-item name="password2">
|
||||||
<t-input v-model="formData.password2" type="password" clearable placeholder="请再次输入密码">
|
<t-input v-model="formData.password2" type="password" clearable :placeholder="$t('global.password2')">
|
||||||
<template #prefix-icon>
|
<template #prefix-icon>
|
||||||
<lock-on-icon />
|
<lock-on-icon />
|
||||||
</template>
|
</template>
|
||||||
|
@ -65,7 +65,7 @@
|
||||||
</t-form-item>
|
</t-form-item>
|
||||||
|
|
||||||
<t-form-item>
|
<t-form-item>
|
||||||
<t-button theme="primary" type="submit" block>登录</t-button>
|
<t-button theme="primary" type="submit" block>{{$t('global.register')}}</t-button>
|
||||||
</t-form-item>
|
</t-form-item>
|
||||||
</t-form>
|
</t-form>
|
||||||
</template>
|
</template>
|
||||||
|
@ -126,6 +126,8 @@
|
||||||
import usePermission from '@/hooks/permission';
|
import usePermission from '@/hooks/permission';
|
||||||
import useResponsive from '@/hooks/responsive';
|
import useResponsive from '@/hooks/responsive';
|
||||||
import PageLayout from './page-layout.vue';
|
import PageLayout from './page-layout.vue';
|
||||||
|
import axios from 'axios';
|
||||||
|
import { Message } from '@arco-design/web-vue';
|
||||||
|
|
||||||
const formData = reactive({
|
const formData = reactive({
|
||||||
account: '',
|
account: '',
|
||||||
|
@ -133,16 +135,45 @@
|
||||||
password2: ''
|
password2: ''
|
||||||
});
|
});
|
||||||
|
|
||||||
const onLogin = () => {
|
const onLogin = async () => {
|
||||||
console.log(formData)
|
const resp : any = await axios.post("https://k5.vicicode.com/wsapi/login", {
|
||||||
userStore.setInfo({
|
'username': formData.account,
|
||||||
showLogin: false,
|
'password': formData.password
|
||||||
name: '开发中'
|
|
||||||
})
|
})
|
||||||
|
if(resp.code == 200){
|
||||||
|
userStore.setInfo({
|
||||||
|
showLogin: false,
|
||||||
|
name: formData.account,
|
||||||
|
accountId: resp.token
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const onRegister = () => {
|
const onRegister = async () => {
|
||||||
console.log(formData)
|
if(formData.password == '' || formData.account == ''){
|
||||||
|
Message.error({
|
||||||
|
content: '用户名及密码不能为空',
|
||||||
|
duration: 5 * 1000,
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if(formData.password != formData.password2){
|
||||||
|
Message.error({
|
||||||
|
content: '两次输入密码不一致',
|
||||||
|
duration: 5 * 1000,
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const resp : any = await axios.post("https://k5.vicicode.com/wsapi/register", {
|
||||||
|
'username': formData.account,
|
||||||
|
'password': formData.password
|
||||||
|
})
|
||||||
|
if(resp.code == 200){
|
||||||
|
userStore.setInfo({
|
||||||
|
showRegister: false,
|
||||||
|
showLogin: true
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const isInit = ref(false);
|
const isInit = ref(false);
|
||||||
|
|
|
@ -141,6 +141,12 @@ export default {
|
||||||
'global.use': 'Use',
|
'global.use': 'Use',
|
||||||
'tool.ssbpatch': 'LOSEHU S Firmware SI4732 SSB Patch',
|
'tool.ssbpatch': 'LOSEHU S Firmware SI4732 SSB Patch',
|
||||||
'tool.writessbpatch': 'SSB Patch Write',
|
'tool.writessbpatch': 'SSB Patch Write',
|
||||||
|
'global.login': 'Login',
|
||||||
|
'global.register': 'Register',
|
||||||
|
'global.logout': 'Logout',
|
||||||
|
'global.username': 'Username',
|
||||||
|
'global.password': 'Password',
|
||||||
|
'global.password2': 'Retype password ',
|
||||||
...localeSettings,
|
...localeSettings,
|
||||||
...localeMessageBox,
|
...localeMessageBox,
|
||||||
...localeLogin,
|
...localeLogin,
|
||||||
|
|
|
@ -141,6 +141,12 @@ export default {
|
||||||
'global.use': '使用',
|
'global.use': '使用',
|
||||||
'tool.ssbpatch': 'LOSEHU S 版固件 SI4732 单边带补丁',
|
'tool.ssbpatch': 'LOSEHU S 版固件 SI4732 单边带补丁',
|
||||||
'tool.writessbpatch': '写入单边带补丁',
|
'tool.writessbpatch': '写入单边带补丁',
|
||||||
|
'global.login': '登录',
|
||||||
|
'global.register': '注册',
|
||||||
|
'global.logout': '退出',
|
||||||
|
'global.username': '请输入用户名',
|
||||||
|
'global.password': '请输入密码',
|
||||||
|
'global.password2': '请再次输入密码',
|
||||||
...localeSettings,
|
...localeSettings,
|
||||||
...localeMessageBox,
|
...localeMessageBox,
|
||||||
...localeLogin,
|
...localeLogin,
|
||||||
|
|
|
@ -8,67 +8,28 @@
|
||||||
<div style="margin-right: 20px;">
|
<div style="margin-right: 20px;">
|
||||||
<template v-if="userStore.name">
|
<template v-if="userStore.name">
|
||||||
<a-link @click="showPanel"> {{ userStore.name }} </a-link>
|
<a-link @click="showPanel"> {{ userStore.name }} </a-link>
|
||||||
<a-link @click="userStore.logout()"> 退出 </a-link>
|
<a-link @click="userStore.logout()"> {{ $t('global.logout') }} </a-link>
|
||||||
</template>
|
</template>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<a-link @click="userStore.setInfo({ showLogin: true })"> 登录 </a-link>
|
<a-link @click="userStore.setInfo({ showLogin: true })"> {{ $t('global.login') }} </a-link>
|
||||||
<a-link @click="userStore.setInfo({ showRegister: true })"> 注册 </a-link>
|
<a-link @click="userStore.setInfo({ showRegister: true })"> {{ $t('global.register') }} </a-link>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<a-list>
|
<a-list>
|
||||||
<a-list-item style="width: 100%;">
|
<a-list-item style="width: 100%;" v-for="item in state.nowpage">
|
||||||
<a-list-item-meta
|
<a-list-item-meta
|
||||||
title="LOSEHU126.bin"
|
:title="item.title"
|
||||||
description="https://github.com/losehu/uv-k5-firmware-custom"
|
:description="item.desc"
|
||||||
>
|
>
|
||||||
</a-list-item-meta>
|
</a-list-item-meta>
|
||||||
<template #actions>
|
<template #actions>
|
||||||
<a-link @click="useFirmware('/LOSEHU126.bin')">{{$t('global.use')}}</a-link>
|
<a-link @click="onStar(item.id)">👍</a-link>
|
||||||
</template>
|
<a-link @click="useFirmware('https://k5.vicicode.com/wsapi/download?id=' + item.id)">{{$t('global.use')}}</a-link>
|
||||||
</a-list-item>
|
|
||||||
<a-list-item style="width: 100%;">
|
|
||||||
<a-list-item-meta
|
|
||||||
title="LOSEHU126K.bin"
|
|
||||||
description="https://github.com/losehu/uv-k5-firmware-custom"
|
|
||||||
>
|
|
||||||
</a-list-item-meta>
|
|
||||||
<template #actions>
|
|
||||||
<a-link @click="useFirmware('/LOSEHU126K.bin')">{{$t('global.use')}}</a-link>
|
|
||||||
</template>
|
|
||||||
</a-list-item>
|
|
||||||
<a-list-item style="width: 100%;">
|
|
||||||
<a-list-item-meta
|
|
||||||
title="LOSEHU126H.bin"
|
|
||||||
description="https://github.com/losehu/uv-k5-firmware-custom"
|
|
||||||
>
|
|
||||||
</a-list-item-meta>
|
|
||||||
<template #actions>
|
|
||||||
<a-link @click="useFirmware('/LOSEHU126H.bin')">{{$t('global.use')}}</a-link>
|
|
||||||
</template>
|
|
||||||
</a-list-item>
|
|
||||||
<a-list-item style="width: 100%;">
|
|
||||||
<a-list-item-meta
|
|
||||||
title="LOSEHU117P6(我基于 LOSEHU117 修改的固件)"
|
|
||||||
description="https://github.com/silenty4ng/uv-k5-firmware-chinese-lts"
|
|
||||||
>
|
|
||||||
</a-list-item-meta>
|
|
||||||
<template #actions>
|
|
||||||
<a-link @click="useFirmware('/LOSEHU117P6.bin')">{{$t('global.use')}}</a-link>
|
|
||||||
</template>
|
|
||||||
</a-list-item>
|
|
||||||
<a-list-item style="width: 100%;">
|
|
||||||
<a-list-item-meta
|
|
||||||
title="LOSEHU117P6K(我基于 LOSEHU117K 修改的固件)"
|
|
||||||
description="https://github.com/silenty4ng/uv-k5-firmware-chinese-lts"
|
|
||||||
>
|
|
||||||
</a-list-item-meta>
|
|
||||||
<template #actions>
|
|
||||||
<a-link @click="useFirmware('/LOSEHU117P6K.bin')">{{$t('global.use')}}</a-link>
|
|
||||||
</template>
|
</template>
|
||||||
</a-list-item>
|
</a-list-item>
|
||||||
</a-list>
|
</a-list>
|
||||||
<t-pagination style="margin: 10px;" :total="5" showPageNumber :showPageSize="false" />
|
<t-pagination style="margin: 10px;" :total="state.total" :current="state.page" showPageNumber :showPageSize="false" />
|
||||||
</a-card>
|
</a-card>
|
||||||
</a-col>
|
</a-col>
|
||||||
</a-row>
|
</a-row>
|
||||||
|
@ -80,16 +41,16 @@
|
||||||
</t-button>
|
</t-button>
|
||||||
</div>
|
</div>
|
||||||
<t-list :split="true">
|
<t-list :split="true">
|
||||||
<t-list-item v-for="item in 20">
|
<t-list-item v-for="item in state.myList">
|
||||||
<div style="display: flex; width: 100%;">
|
<div style="display: flex; width: 100%;">
|
||||||
<div style="width: 90%;">
|
<div style="width: 90%;">
|
||||||
<t-tag theme="primary" variant="outline">审核中</t-tag>
|
<t-tag theme="primary" variant="outline">{{ item.audit ? '已审核' : '审核中' }}</t-tag>
|
||||||
固件名称
|
{{ item.title }}
|
||||||
<br>
|
<br>
|
||||||
固件描述固件描述固件描述固件描述固件描述固件描述固件描述固件描述固件描述固件描述固件描述固件描述固件描述固件描述固件描述固件描述固件描述固件描述固件描述
|
{{ item.desc }}
|
||||||
</div>
|
</div>
|
||||||
<div style="width: 10%; margin: auto; text-align: center;">
|
<div style="width: 10%; margin: auto; text-align: center;">
|
||||||
<t-link theme="primary" hover="color">删除</t-link>
|
<t-link theme="primary" hover="color" @click="onDT(item.id)">删除</t-link>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</t-list-item>
|
</t-list-item>
|
||||||
|
@ -111,7 +72,7 @@
|
||||||
<t-form-item label="固件文件" name="firmware" label-align="top">
|
<t-form-item label="固件文件" name="firmware" label-align="top">
|
||||||
<t-upload
|
<t-upload
|
||||||
v-model="formData.firmware"
|
v-model="formData.firmware"
|
||||||
action="https://service-bv448zsw-1257786608.gz.apigw.tencentcs.com/api/upload-demo"
|
action="https://k5.vicicode.com/wsapi/base64"
|
||||||
:abridge-name="[8, 6]"
|
:abridge-name="[8, 6]"
|
||||||
theme="file-input"
|
theme="file-input"
|
||||||
placeholder="未选择文件"
|
placeholder="未选择文件"
|
||||||
|
@ -126,10 +87,12 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { reactive, nextTick } from 'vue';
|
import { reactive, nextTick, onMounted, watch } from 'vue';
|
||||||
import { useAppStore, useUserStore } from '@/store';
|
import { useAppStore, useUserStore } from '@/store';
|
||||||
import { useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
import { RefreshIcon } from 'tdesign-icons-vue-next';
|
import { RefreshIcon } from 'tdesign-icons-vue-next';
|
||||||
|
import axios from 'axios';
|
||||||
|
import { Message } from '@arco-design/web-vue';
|
||||||
|
|
||||||
const appStore = useAppStore();
|
const appStore = useAppStore();
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
|
@ -141,13 +104,21 @@
|
||||||
loading: boolean,
|
loading: boolean,
|
||||||
showPanel: boolean,
|
showPanel: boolean,
|
||||||
showUpload: boolean,
|
showUpload: boolean,
|
||||||
refLoading: boolean
|
refLoading: boolean,
|
||||||
|
myList: any,
|
||||||
|
total: number,
|
||||||
|
page: number,
|
||||||
|
nowpage: any
|
||||||
} = reactive({
|
} = reactive({
|
||||||
binaryFile: undefined,
|
binaryFile: undefined,
|
||||||
loading: false,
|
loading: false,
|
||||||
showPanel: false,
|
showPanel: false,
|
||||||
showUpload: false,
|
showUpload: false,
|
||||||
refLoading: false
|
refLoading: false,
|
||||||
|
myList: [],
|
||||||
|
total: 0,
|
||||||
|
page: 1,
|
||||||
|
nowpage: []
|
||||||
})
|
})
|
||||||
|
|
||||||
const formData = reactive({
|
const formData = reactive({
|
||||||
|
@ -156,8 +127,29 @@
|
||||||
firmware: []
|
firmware: []
|
||||||
})
|
})
|
||||||
|
|
||||||
const showPanel = () => {
|
onMounted(async ()=>{
|
||||||
|
const resp : any = await axios.get("https://k5.vicicode.com/wsapi/list?type=0&page=" + state.page + "&t=" + Date.now())
|
||||||
|
state.total = resp.total
|
||||||
|
state.nowpage = resp.data
|
||||||
|
})
|
||||||
|
|
||||||
|
watch(state, async (n, o)=>{
|
||||||
|
if(n.page != o.page){
|
||||||
|
const resp : any = await axios.get("https://k5.vicicode.com/wsapi/list?type=0&page=" + state.page + "&t=" + Date.now())
|
||||||
|
state.total = resp.total
|
||||||
|
state.nowpage = resp.data
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
const showPanel = async () => {
|
||||||
|
state.refLoading = true;
|
||||||
state.showPanel = true
|
state.showPanel = true
|
||||||
|
const resp : any = await axios.post("https://k5.vicicode.com/wsapi/my_list", {
|
||||||
|
'type': 0,
|
||||||
|
'token': userStore.accountId
|
||||||
|
})
|
||||||
|
state.myList = resp.data
|
||||||
|
state.refLoading = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
const showUpload = () => {
|
const showUpload = () => {
|
||||||
|
@ -167,16 +159,45 @@
|
||||||
state.showUpload = true
|
state.showUpload = true
|
||||||
}
|
}
|
||||||
|
|
||||||
const onUF = () => {
|
const onUF = async () => {
|
||||||
console.log(formData)
|
if(formData.title == "" || formData.firmware.length == 0){
|
||||||
|
Message.error({
|
||||||
|
content: '未填写名称及上传文件',
|
||||||
|
duration: 5 * 1000,
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
await axios.post("https://k5.vicicode.com/wsapi/upload", {
|
||||||
|
'type': 0,
|
||||||
|
'token': userStore.accountId,
|
||||||
|
'title': formData.title,
|
||||||
|
'desc': formData.desc,
|
||||||
|
'data': formData.firmware[0].url
|
||||||
|
})
|
||||||
state.showUpload = false;
|
state.showUpload = false;
|
||||||
|
showPanel()
|
||||||
|
}
|
||||||
|
|
||||||
|
const onDT = async (id: any) => {
|
||||||
|
await axios.post("https://k5.vicicode.com/wsapi/delete", {
|
||||||
|
'id': id,
|
||||||
|
'token': userStore.accountId,
|
||||||
|
})
|
||||||
|
showPanel()
|
||||||
|
}
|
||||||
|
|
||||||
|
const onStar = async (id: any) => {
|
||||||
|
await axios.post("https://k5.vicicode.com/wsapi/star", {
|
||||||
|
'id': id
|
||||||
|
})
|
||||||
|
Message.success({
|
||||||
|
content: '点赞成功',
|
||||||
|
duration: 5 * 1000,
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
const refit = () => {
|
const refit = () => {
|
||||||
state.refLoading = true;
|
showPanel()
|
||||||
setTimeout(() => {
|
|
||||||
state.refLoading = false;
|
|
||||||
}, 1000);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const useFirmware = (url: string) => {
|
const useFirmware = (url: string) => {
|
||||||
|
|
|
@ -5,39 +5,32 @@
|
||||||
<a-col :span="24">
|
<a-col :span="24">
|
||||||
<a-card class="general-card" :title="$t('menu.image')">
|
<a-card class="general-card" :title="$t('menu.image')">
|
||||||
<template #extra>
|
<template #extra>
|
||||||
<div style="margin-right: 20px;">
|
<div style="margin-right: 20px;">
|
||||||
<template v-if="userStore.name">
|
<template v-if="userStore.name">
|
||||||
<a-link> {{ userStore.name }} </a-link>
|
<a-link @click="showPanel"> {{ userStore.name }} </a-link>
|
||||||
<a-link @click="userStore.logout()"> 退出 </a-link>
|
<a-link @click="userStore.logout()"> {{ $t('global.logout') }} </a-link>
|
||||||
</template>
|
</template>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<a-link @click="userStore.setInfo({ showLogin: true })"> 登录 </a-link>
|
<a-link @click="userStore.setInfo({ showLogin: true })"> {{ $t('global.login') }} </a-link>
|
||||||
<a-link @click="userStore.setInfo({ showRegister: true })"> 注册 </a-link>
|
<a-link @click="userStore.setInfo({ showRegister: true })"> {{ $t('global.register') }} </a-link>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<a-row :gutter="20">
|
<a-row :gutter="20">
|
||||||
<a-col :span="4" v-for="i in [
|
<a-col :span="4" v-for="i in state.nowpage">
|
||||||
{ name: '罗狮虎', url: '/img1.png'},
|
|
||||||
{ name: '离线小恐龙', url: '/img2.png'},
|
|
||||||
{ name: '不忘初心牢记使命', url: '/img3.png'},
|
|
||||||
{ name: '为人民服务', url: '/img4.png'},
|
|
||||||
{ name: '严禁收听敌台广播', url: '/img5.png'},
|
|
||||||
{ name: '爱因斯坦', url: '/img6.png'},
|
|
||||||
]">
|
|
||||||
<t-card :style="{ width: '100%', marginBottom: '10px' }">
|
<t-card :style="{ width: '100%', marginBottom: '10px' }">
|
||||||
<template #cover>
|
<template #cover>
|
||||||
<img :title="i.name" :src="i.url">
|
<img :title="i.title" :src="'https://k5.vicicode.com/wsapi/download?id=' + i.id">
|
||||||
</template>
|
</template>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<t-row :align="'middle'" justify="center" style="gap: 24px">
|
<t-row :align="'middle'" justify="center" style="gap: 24px">
|
||||||
<t-col flex="auto" style="display: inline-flex; justify-content: center">
|
<t-col flex="auto" style="display: inline-flex; justify-content: center">
|
||||||
<t-button variant="text" shape="square" @click="upImg(i)">
|
<t-button variant="text" shape="square" @click="onStar(i.id)">
|
||||||
<thumb-up-icon />
|
<thumb-up-icon />
|
||||||
</t-button>
|
</t-button>
|
||||||
</t-col>
|
</t-col>
|
||||||
<t-col flex="auto" style="display: inline-flex; justify-content: center">
|
<t-col flex="auto" style="display: inline-flex; justify-content: center">
|
||||||
<t-button variant="text" shape="square" @click="useImg(i)">
|
<t-button variant="text" shape="square" @click="useImg('https://k5.vicicode.com/wsapi/download?id=' + i.id)">
|
||||||
<check-double-icon />
|
<check-double-icon />
|
||||||
</t-button>
|
</t-button>
|
||||||
</t-col>
|
</t-col>
|
||||||
|
@ -50,14 +43,67 @@
|
||||||
</a-card>
|
</a-card>
|
||||||
</a-col>
|
</a-col>
|
||||||
</a-row>
|
</a-row>
|
||||||
|
<t-drawer v-model:visible="state.showPanel" size="50%" header="我的图片" :footer="false">
|
||||||
|
<div style="display: flex; align-items: center; justify-content: space-between;">
|
||||||
|
<t-button style="margin: 10px" @click="showUpload">上传新图片</t-button>
|
||||||
|
<t-button :loading="state.refLoading" shape="circle" theme="outline" @click="refit">
|
||||||
|
<template #icon> <RefreshIcon /> </template>
|
||||||
|
</t-button>
|
||||||
|
</div>
|
||||||
|
<t-list :split="true">
|
||||||
|
<t-list-item v-for="item in state.myList">
|
||||||
|
<div style="display: flex; width: 100%;">
|
||||||
|
<div style="width: 90%;">
|
||||||
|
<t-tag theme="primary" variant="outline">{{ item.audit ? '已审核' : '审核中' }}</t-tag>
|
||||||
|
{{ item.title }}
|
||||||
|
<br>
|
||||||
|
{{ item.desc }}
|
||||||
|
</div>
|
||||||
|
<div style="width: 10%; margin: auto; text-align: center;">
|
||||||
|
<t-link theme="primary" hover="color" @click="onDT(item.id)">删除</t-link>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</t-list-item>
|
||||||
|
</t-list>
|
||||||
|
</t-drawer>
|
||||||
|
<t-drawer v-model:visible="state.showUpload" size="25%" header="上传新图片" :footer="false">
|
||||||
|
<t-form
|
||||||
|
:data="formData"
|
||||||
|
reset-type="initial"
|
||||||
|
colon
|
||||||
|
@submit="onUF"
|
||||||
|
>
|
||||||
|
<t-form-item label="图片名称" name="title" label-align="top">
|
||||||
|
<t-input v-model="formData.title"></t-input>
|
||||||
|
</t-form-item>
|
||||||
|
<t-form-item label="图片描述" name="desc" label-align="top">
|
||||||
|
<t-textarea :autosize="{ minRows: 5, maxRows: 10 }" v-model="formData.desc" placeholder="请输入" clearable />
|
||||||
|
</t-form-item>
|
||||||
|
<t-form-item label="图片文件" name="firmware" label-align="top">
|
||||||
|
<t-upload
|
||||||
|
v-model="formData.firmware"
|
||||||
|
action="https://k5.vicicode.com/wsapi/base64"
|
||||||
|
:abridge-name="[8, 6]"
|
||||||
|
theme="file-input"
|
||||||
|
placeholder="未选择文件"
|
||||||
|
></t-upload>
|
||||||
|
</t-form-item>
|
||||||
|
<t-form-item label-align="top">
|
||||||
|
<t-button theme="primary" type="submit" block>提交审核</t-button>
|
||||||
|
</t-form-item>
|
||||||
|
</t-form>
|
||||||
|
</t-drawer>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ThumbUpIcon, CheckDoubleIcon } from 'tdesign-icons-vue-next';
|
import { ThumbUpIcon, CheckDoubleIcon } from 'tdesign-icons-vue-next';
|
||||||
import { reactive, nextTick } from 'vue';
|
import { reactive, nextTick, onMounted, watch } from 'vue';
|
||||||
import { useAppStore, useUserStore } from '@/store';
|
import { useAppStore, useUserStore } from '@/store';
|
||||||
import { useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
|
import axios from 'axios';
|
||||||
|
import { Message } from '@arco-design/web-vue';
|
||||||
|
import { RefreshIcon } from 'tdesign-icons-vue-next';
|
||||||
|
|
||||||
const appStore = useAppStore();
|
const appStore = useAppStore();
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
|
@ -66,21 +112,112 @@
|
||||||
|
|
||||||
const state : {
|
const state : {
|
||||||
binaryFile: any,
|
binaryFile: any,
|
||||||
loading: boolean
|
loading: boolean,
|
||||||
|
showPanel: boolean,
|
||||||
|
showUpload: boolean,
|
||||||
|
refLoading: boolean,
|
||||||
|
myList: any,
|
||||||
|
total: number,
|
||||||
|
page: number,
|
||||||
|
nowpage: any
|
||||||
} = reactive({
|
} = reactive({
|
||||||
binaryFile: undefined,
|
binaryFile: undefined,
|
||||||
loading: false
|
loading: false,
|
||||||
|
showPanel: false,
|
||||||
|
showUpload: false,
|
||||||
|
refLoading: false,
|
||||||
|
myList: [],
|
||||||
|
total: 0,
|
||||||
|
page: 1,
|
||||||
|
nowpage: []
|
||||||
})
|
})
|
||||||
|
|
||||||
const upImg = (i:any) => {
|
|
||||||
alert('图片工坊即将推出');
|
const formData = reactive({
|
||||||
|
title: '',
|
||||||
|
desc: '',
|
||||||
|
firmware: []
|
||||||
|
})
|
||||||
|
|
||||||
|
onMounted(async ()=>{
|
||||||
|
const resp : any = await axios.get("https://k5.vicicode.com/wsapi/list?type=1&page=" + state.page + "&t=" + Date.now())
|
||||||
|
state.total = resp.total
|
||||||
|
state.nowpage = resp.data
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
const showPanel = async () => {
|
||||||
|
state.refLoading = true;
|
||||||
|
state.showPanel = true
|
||||||
|
const resp : any = await axios.post("https://k5.vicicode.com/wsapi/my_list", {
|
||||||
|
'type': 1,
|
||||||
|
'token': userStore.accountId
|
||||||
|
})
|
||||||
|
state.myList = resp.data
|
||||||
|
state.refLoading = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
const useImg = (i:any) => {
|
const showUpload = () => {
|
||||||
|
formData.title = ''
|
||||||
|
formData.desc = ''
|
||||||
|
formData.firmware = []
|
||||||
|
state.showUpload = true
|
||||||
|
}
|
||||||
|
|
||||||
|
const onUF = async () => {
|
||||||
|
if(formData.title == "" || formData.firmware.length == 0){
|
||||||
|
Message.error({
|
||||||
|
content: '未填写名称及上传文件',
|
||||||
|
duration: 5 * 1000,
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
await axios.post("https://k5.vicicode.com/wsapi/upload", {
|
||||||
|
'type': 1,
|
||||||
|
'token': userStore.accountId,
|
||||||
|
'title': formData.title,
|
||||||
|
'desc': formData.desc,
|
||||||
|
'data': formData.firmware[0].url
|
||||||
|
})
|
||||||
|
state.showUpload = false;
|
||||||
|
showPanel()
|
||||||
|
}
|
||||||
|
|
||||||
|
const onDT = async (id: any) => {
|
||||||
|
await axios.post("https://k5.vicicode.com/wsapi/delete", {
|
||||||
|
'id': id,
|
||||||
|
'token': userStore.accountId,
|
||||||
|
})
|
||||||
|
showPanel()
|
||||||
|
}
|
||||||
|
|
||||||
|
const onStar = async (id: any) => {
|
||||||
|
await axios.post("https://k5.vicicode.com/wsapi/star", {
|
||||||
|
'id': id
|
||||||
|
})
|
||||||
|
Message.success({
|
||||||
|
content: '点赞成功',
|
||||||
|
duration: 5 * 1000,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const refit = () => {
|
||||||
|
showPanel()
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(state, async (n, o)=>{
|
||||||
|
if(n.page != o.page){
|
||||||
|
const resp : any = await axios.get("https://k5.vicicode.com/wsapi/list?type=1&page=" + state.page + "&t=" + Date.now())
|
||||||
|
state.total = resp.total
|
||||||
|
state.nowpage = resp.data
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
const useImg = (url:any) => {
|
||||||
router.push({
|
router.push({
|
||||||
path: '/tool/image',
|
path: '/tool/image',
|
||||||
query: {
|
query: {
|
||||||
url: i.url
|
url
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -47,9 +47,12 @@ const state : {
|
||||||
|
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
|
|
||||||
onMounted(()=>{
|
onMounted(async ()=>{
|
||||||
if(route.query.url){
|
if(route.query.url){
|
||||||
useImg(route.query.url)
|
const img = await fetch(route.query.url, {
|
||||||
|
responseType: 'blob'
|
||||||
|
});
|
||||||
|
useImg(window.URL.createObjectURL(await img.blob()))
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue