mirror of https://github.com/veypi/OneAuth.git
You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
111 lines
3.3 KiB
Vue
111 lines
3.3 KiB
Vue
<!--
|
|
* index.vue
|
|
* Copyright (C) 2024 veypi <i@veypi.com>
|
|
* 2024-05-31 17:10
|
|
* Distributed under terms of the MIT license.
|
|
-->
|
|
|
|
<template>
|
|
<div>
|
|
<div class="mb-20" v-if="ofApps.length > 0 && ready">
|
|
<div class="flex justify-between">
|
|
<h1 class="page-h1">{{ $t('c.myapps') }}</h1>
|
|
<div class="my-5 mr-10">
|
|
<div class='vbtn bg-gray-300' @click="new_flag = true" v-if="oaer.access().Get('app', '').CanCreate()">
|
|
{{ $t('p.index.create') }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="grid gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 text-center">
|
|
<div v-for="(item, k) in ofApps" class="flex items-center justify-center" :key="k">
|
|
<Appcard :core="item" :is_part="true"></Appcard>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="" v-if="apps.length > 0">
|
|
<h1 class="page-h1">{{ $t('c.app store') }}</h1>
|
|
<div class="grid gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5 text-center">
|
|
<div v-for="(item, k) in apps" class="flex items-center justify-center" :key="k">
|
|
<Appcard :core="item" :is_part="false"></Appcard>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<UModal v-model="new_flag">
|
|
<UCard>
|
|
<template #header>
|
|
<div class="text-h6">{{ $t('p.index.create') }} </div>
|
|
</template>
|
|
<div class="p-4">
|
|
<Uploader @success="temp_app.icon = $event" dir="/pub/icon/">
|
|
<!-- <img alt="LOGO" class="rounded-full w-16 h-16 mx-auto my-4" :src="temp_app.icon"> -->
|
|
<div alt="LOGO" class="divimg rounded-full w-16 h-16 mx-auto" :style="`--bgurl:url('${temp_app.icon}')`">
|
|
</div>
|
|
</Uploader>
|
|
<Vinput class="mt-4" v-model="temp_app.name" :validate="/^\w{2,}$/" :label="$t('c.appname')" type="text">
|
|
</Vinput>
|
|
<Vinput class='mt-12' v-model="temp_app.typ" type="radio"
|
|
:options="{ 'public': $t('atyp.public'), 'apply': $t('atyp.apply'), 'private': $t('atyp.private') }"
|
|
:validate="/^\w{2,}$/">
|
|
</Vinput>
|
|
</div>
|
|
<template #footer>
|
|
<div class='flex justify-end gap-4'>
|
|
<div class="vbtn bg-vignore" @click="new_flag = false">{{ $t('c.cancel') }}</div>
|
|
<div class="vbtn bg-vsuccess" @click="create_new">{{ $t('c.ok') }}</div>
|
|
</div>
|
|
</template>
|
|
</UCard>
|
|
</UModal>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type { models } from '#imports';
|
|
import msg from '@veypi/msg';
|
|
import oaer from '@veypi/oaer';
|
|
|
|
|
|
let ready = useAppConfig().ready
|
|
|
|
|
|
let allApps = ref<models.App[]>([]);
|
|
let apps = computed(() => allApps.value.filter(e => e.user_status !== 'ok'))
|
|
let ofApps = computed(() => allApps.value.filter(e => e.user_status === 'ok'))
|
|
|
|
function getApps() {
|
|
api.app.List({}).then(
|
|
(e) => {
|
|
allApps.value = e;
|
|
}
|
|
);
|
|
}
|
|
watch(() => ready.value, getApps)
|
|
|
|
|
|
let new_flag = ref(false);
|
|
let temp_app = ref({
|
|
name: "",
|
|
icon: '',
|
|
typ: 'public',
|
|
});
|
|
|
|
function create_new() {
|
|
api.app.Post({
|
|
name: temp_app.value.name,
|
|
icon: temp_app.value.icon,
|
|
typ: temp_app.value.typ,
|
|
status: "ok"
|
|
}).then((e: models.App) => {
|
|
ofApps.value.push(e);
|
|
msg.Info("创建成功");
|
|
new_flag.value = false;
|
|
}).catch(e => {
|
|
msg.Warn("创建失败: " + e);
|
|
})
|
|
}
|
|
onMounted(() => {
|
|
getApps();
|
|
});
|
|
|
|
</script>
|