235 lines
6.9 KiB
Vue
235 lines
6.9 KiB
Vue
<template>
|
|
<pn-page-card>
|
|
<template #title>
|
|
{{ $t('software__title') }}
|
|
</template>
|
|
|
|
<pn-scroll-list>
|
|
<template #card-body-header>
|
|
<div class="q-pa-md">
|
|
{{ $t('software__description') }}
|
|
</div>
|
|
</template>
|
|
|
|
<q-list separator>
|
|
<q-expansion-item
|
|
v-for="item in software"
|
|
group="somegroup"
|
|
>
|
|
<template #header>
|
|
<q-item-section avatar>
|
|
<q-avatar square size="sm" v-if="item.logo">
|
|
<img :src="'3software/logo/' + item.logo">
|
|
</q-avatar>
|
|
</q-item-section>
|
|
|
|
<q-item-section>
|
|
<div class="flex items-baseline">
|
|
<span class="text-h6">
|
|
{{ item.name }}
|
|
</span>
|
|
<span v-if = "item.ver" class="text-caption q-pl-xs">
|
|
{{ 'v.' + item.ver }}
|
|
</span>
|
|
</div>
|
|
</q-item-section>
|
|
</template>
|
|
<div class="w100 flex column q-px-md q-gutter-y-md q-py-sm">
|
|
<div class="flex row no-wrap items-center">
|
|
<q-icon name="mdi-scale-balance" size="sm" class="q-pr-lg" color="grey"/>
|
|
<div
|
|
@click="downloadFile('3software/license/' + item.license_file)"
|
|
class="flex w100 column q-pl-sm cursor-pointer"
|
|
>
|
|
<span> {{ item.license }} </span>
|
|
<span
|
|
class="text-caption"
|
|
style="white-space: pre-line;"
|
|
>
|
|
{{ item.license_copyright }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex row no-wrap items-center" v-if="item.web">
|
|
<q-icon name="mdi-web" size="sm" class="q-pr-lg" color="grey"/>
|
|
<span
|
|
class="q-pl-sm cursor-pointer"
|
|
@click="tg.openLink(item.web_url)"
|
|
>
|
|
{{ item.web }}
|
|
</span>
|
|
</div>
|
|
|
|
<div class="flex row no-wrap items-center" v-if="item.git">
|
|
<q-icon name="mdi-github" size="sm" class="q-pr-lg" color="grey"/>
|
|
<span
|
|
class="q-pl-sm cursor-pointer"
|
|
@click="tg.openLink(item.git_url)"
|
|
>
|
|
{{ item.git }}
|
|
</span>
|
|
</div>
|
|
|
|
</div>
|
|
</q-expansion-item>
|
|
</q-list>
|
|
</pn-scroll-list>
|
|
</pn-page-card>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { inject } from 'vue'
|
|
import type { WebApp } from '@twa-dev/types'
|
|
|
|
const tg = inject('tg') as WebApp
|
|
|
|
const software = [
|
|
{
|
|
id: 1,
|
|
name: 'Vue',
|
|
ver: '3.4',
|
|
logo: 'vue.webp',
|
|
web: 'vuejs.org',
|
|
web_url: 'https://vuejs.org/',
|
|
git: 'vuejs/core',
|
|
git_url: 'https://github.com/vuejs/core',
|
|
license: 'MIT License',
|
|
license_copyright: 'Copyright (c) 2018-present, Yuxi (Evan) You and Vue contributors',
|
|
license_file: 'vue/LICENSE.txt'
|
|
},
|
|
{
|
|
id: 2,
|
|
name: 'Quasar',
|
|
ver: '2.x',
|
|
logo: 'quasar.png',
|
|
web: 'quasar.dev',
|
|
web_url: 'https://quasar.dev/',
|
|
git: 'quasarframework/quasar',
|
|
git_url: 'https://github.com/quasarframework/quasar',
|
|
license: 'MIT License',
|
|
license_copyright: 'Copyright (c) 2015-present Razvan Stoenescu',
|
|
license_file: 'quasar/LICENSE.txt'
|
|
},
|
|
{
|
|
id: 3,
|
|
name: 'Pinia',
|
|
ver: '2.x',
|
|
logo: 'pinia.svg',
|
|
web: 'pinia.vuejs.org',
|
|
web_url: 'https://pinia.vuejs.org/',
|
|
git: 'vuejs/pinia',
|
|
git_url: 'https://github.com/vuejs/pinia',
|
|
license: 'MIT License',
|
|
license_copyright: 'Copyright (c) 2019-present Eduardo San Martin Morote',
|
|
license_file: 'pinia/LICENSE.txt'
|
|
},
|
|
{
|
|
id: 4,
|
|
name: 'Vue Router',
|
|
ver: '4.x',
|
|
logo: 'vue.webp',
|
|
web: 'router.vuejs.org',
|
|
web_url: 'https://router.vuejs.org/',
|
|
git: 'vuejs/router',
|
|
git_url: 'https://github.com/vuejs/router',
|
|
license: 'MIT License',
|
|
license_copyright: 'Copyright (c) 2019-present Eduardo San Martin Morote',
|
|
license_file: 'vue-router/LICENSE.txt'
|
|
},
|
|
{
|
|
id: 5,
|
|
name: 'Vue i18n',
|
|
ver: '9.x',
|
|
logo: 'vue-i18n.svg',
|
|
web: 'vue-i18n.intlify.dev',
|
|
web_url: 'https://vue-i18n.intlify.dev/',
|
|
git: 'intlify/vue-i18n',
|
|
git_url: 'https://github.com/intlify/vue-i18n',
|
|
license: 'MIT License',
|
|
license_copyright: 'Copyright (c) 2016-present kazuya kawaguchi and contributors',
|
|
license_file: 'vue-i18n/LICENSE.txt'
|
|
},
|
|
{
|
|
id: 6,
|
|
name: 'Axios',
|
|
ver: '1.x',
|
|
logo: 'axios.svg',
|
|
web: 'axios-http.com',
|
|
web_url: 'https://axios-http.com/',
|
|
git: 'axios/axios',
|
|
git_url: 'https://github.com/axios/axios',
|
|
license: 'MIT License',
|
|
license_copyright: 'Copyright (c) 2014-present Matt Zabriskie & Collaborators',
|
|
license_file: 'axios/LICENSE.txt'
|
|
},
|
|
{
|
|
id: 7,
|
|
name: 'better-sqlite3',
|
|
ver: '11.x',
|
|
logo: '',
|
|
web: '',
|
|
web_url: '',
|
|
git: 'WiseLibs/better-sqlite3',
|
|
git_url: 'https://github.com/WiseLibs/better-sqlite3',
|
|
license: 'MIT License',
|
|
license_copyright: 'Copyright (c) 2017 Joshua Wise',
|
|
license_file: 'better-sqlite3/LICENSE.txt'
|
|
},
|
|
{
|
|
id: 8,
|
|
name: 'Express',
|
|
ver: '4.x',
|
|
logo: 'express.svg',
|
|
web: 'expressjs.com',
|
|
web_url: 'https://expressjs.com/',
|
|
git: 'expressjs/express',
|
|
git_url: 'https://github.com/expressjs/express',
|
|
license: 'MIT License',
|
|
license_copyright: `Copyright (c) 2009-2014 TJ Holowaychuk <tj@vision-media.ca>
|
|
Copyright (c) 2013-2014 Roman Shtylman <shtylman+expressjs@gmail.com>
|
|
Copyright (c) 2014-2015 Douglas Christopher Wilson <doug@somethingdoug.com>`,
|
|
license_file: 'express/LICENSE.txt'
|
|
}
|
|
]
|
|
|
|
|
|
const downloadFile = async (url: string) => {
|
|
try {
|
|
const fullUrl = '/admin/' + url;
|
|
const fileUrl = new URL(fullUrl, window.location.origin).href;
|
|
|
|
const response = await fetch(fileUrl)
|
|
|
|
if (!response.ok) throw new Error(`HTTP error: ${response.status}`)
|
|
|
|
const blob = await response.blob()
|
|
const downloadUrl = URL.createObjectURL(blob)
|
|
const link = document.createElement('a')
|
|
|
|
const extractFileName = (url: string): string => {
|
|
return url.substring(url.lastIndexOf('/') + 1)
|
|
}
|
|
|
|
link.href = downloadUrl
|
|
link.download = extractFileName(url)
|
|
link.style.display = 'none'
|
|
|
|
document.body.appendChild(link)
|
|
link.click()
|
|
|
|
setTimeout(() => {
|
|
document.body.removeChild(link)
|
|
URL.revokeObjectURL(downloadUrl)
|
|
}, 100)
|
|
|
|
} catch (error) {
|
|
console.error('Download error:', error)
|
|
}
|
|
}
|
|
|
|
</script>
|
|
|
|
<style scope>
|
|
</style>
|