mirror of https://github.com/halo-dev/halo-admin
refactor: installation page logo (#383)
Ryan Wang
GitHub
parent
e3532fa4e9
commit
5f893aa5c5
|
|
@ -1,125 +1,121 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<a-row align="middle" class="h-screen" justify="center" type="flex">
|
||||||
<a-row align="middle" class="h-screen" justify="center" type="flex">
|
<a-col :lg="16" :md="20" :sm="20" :xl="12" :xs="23" :xxl="8">
|
||||||
<a-col :lg="16" :md="20" :sm="20" :xl="12" :xs="23" :xxl="8">
|
<div class="card-container animated fadeIn">
|
||||||
<div class="card-container animated fadeIn">
|
<a-card :bordered="false" style="box-shadow: rgba(99, 99, 99, 0.2) 0 2px 8px 0;">
|
||||||
<a-card :bordered="false" style="box-shadow: rgba(99, 99, 99, 0.2) 0 2px 8px 0;">
|
<div class="halo-logo">
|
||||||
<div class="halo-logo">
|
<img alt="Halo Logo" src="/images/logo.svg" />
|
||||||
<span
|
<span>安装向导</span>
|
||||||
>Halo
|
</div>
|
||||||
<small>安装向导</small>
|
<a-alert :message="`欢迎使用 Halo，您正在安装的是 Halo ${VERSION}。`" show-icon type="success" />
|
||||||
</span>
|
<!-- Blogger info -->
|
||||||
</div>
|
<div class="mt-5 mb-5">
|
||||||
<a-alert :message="`欢迎使用 Halo，您正在安装的是 Halo ${VERSION}。`" show-icon type="success" />
|
<a-radio-group v-model="installationMode">
|
||||||
<!-- Blogger info -->
|
<a-radio-button value="new">
|
||||||
<div class="mt-5 mb-5">
|
全新安装
|
||||||
<a-radio-group v-model="installationMode">
|
</a-radio-button>
|
||||||
<a-radio-button value="new">
|
<a-radio-button value="import">
|
||||||
全新安装
|
数据导入
|
||||||
</a-radio-button>
|
</a-radio-button>
|
||||||
<a-radio-button value="import">
|
</a-radio-group>
|
||||||
数据导入
|
</div>
|
||||||
</a-radio-button>
|
<a-form-model
|
||||||
</a-radio-group>
|
v-show="isInstallMode"
|
||||||
</div>
|
ref="installationForm"
|
||||||
<a-form-model
|
:model="form.model"
|
||||||
v-show="isInstallMode"
|
:rules="form.rules"
|
||||||
ref="installationForm"
|
class="installationForm animated fadeIn"
|
||||||
:model="form.model"
|
layout="horizontal"
|
||||||
:rules="form.rules"
|
>
|
||||||
class="installationForm animated fadeIn"
|
<a-divider dashed orientation="left">
|
||||||
layout="horizontal"
|
管理员信息
|
||||||
>
|
</a-divider>
|
||||||
<a-divider dashed orientation="left">
|
<a-form-model-item prop="username">
|
||||||
管理员信息
|
<a-input v-model="form.model.username" placeholder="用户名">
|
||||||
</a-divider>
|
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="user" />
|
||||||
<a-form-model-item prop="username">
|
</a-input>
|
||||||
<a-input v-model="form.model.username" placeholder="用户名">
|
</a-form-model-item>
|
||||||
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="user" />
|
<a-form-model-item prop="username">
|
||||||
</a-input>
|
<a-input v-model="form.model.nickname" placeholder="用户昵称">
|
||||||
</a-form-model-item>
|
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="user" />
|
||||||
<a-form-model-item prop="username">
|
</a-input>
|
||||||
<a-input v-model="form.model.nickname" placeholder="用户昵称">
|
</a-form-model-item>
|
||||||
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="user" />
|
<a-form-model-item prop="email">
|
||||||
</a-input>
|
<a-input v-model="form.model.email" placeholder="用户邮箱">
|
||||||
</a-form-model-item>
|
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="mail" />
|
||||||
<a-form-model-item prop="email">
|
</a-input>
|
||||||
<a-input v-model="form.model.email" placeholder="用户邮箱">
|
</a-form-model-item>
|
||||||
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="mail" />
|
<a-form-model-item prop="password">
|
||||||
</a-input>
|
<a-input v-model="form.model.password" placeholder="登录密码（8-100位）" type="password">
|
||||||
</a-form-model-item>
|
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="lock" />
|
||||||
<a-form-model-item prop="password">
|
</a-input>
|
||||||
<a-input v-model="form.model.password" placeholder="登录密码（8-100位）" type="password">
|
</a-form-model-item>
|
||||||
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="lock" />
|
<a-form-model-item prop="confirmPassword">
|
||||||
</a-input>
|
<a-input v-model="form.model.confirmPassword" placeholder="确认登录密码" type="password">
|
||||||
</a-form-model-item>
|
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="lock" />
|
||||||
<a-form-model-item prop="confirmPassword">
|
</a-input>
|
||||||
<a-input v-model="form.model.confirmPassword" placeholder="确认登录密码" type="password">
|
</a-form-model-item>
|
||||||
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="lock" />
|
<a-divider dashed orientation="left">
|
||||||
</a-input>
|
站点信息
|
||||||
</a-form-model-item>
|
</a-divider>
|
||||||
<a-divider dashed orientation="left">
|
<a-form-model-item prop="url">
|
||||||
站点信息
|
<a-input v-model="form.model.url" placeholder="博客地址">
|
||||||
</a-divider>
|
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="link" />
|
||||||
<a-form-model-item prop="url">
|
</a-input>
|
||||||
<a-input v-model="form.model.url" placeholder="博客地址">
|
</a-form-model-item>
|
||||||
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="link" />
|
<a-form-model-item prop="title">
|
||||||
</a-input>
|
<a-input v-model="form.model.title" placeholder="博客标题">
|
||||||
</a-form-model-item>
|
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="book" />
|
||||||
<a-form-model-item prop="title">
|
</a-input>
|
||||||
<a-input v-model="form.model.title" placeholder="博客标题">
|
</a-form-model-item>
|
||||||
<a-icon slot="prefix" style="color: rgba(0,0,0,.25)" type="book" />
|
</a-form-model>
|
||||||
</a-input>
|
|
||||||
</a-form-model-item>
|
|
||||||
</a-form-model>
|
|
||||||
|
|
||||||
<!-- Data migration -->
|
<!-- Data migration -->
|
||||||
<div v-show="isImportMode" class="animated fadeIn">
|
<div v-show="isImportMode" class="animated fadeIn">
|
||||||
<FilePondUpload
|
<FilePondUpload
|
||||||
ref="upload"
|
ref="upload"
|
||||||
:accepts="['application/json']"
|
:accepts="['application/json']"
|
||||||
:multiple="false"
|
:multiple="false"
|
||||||
:uploadHandler="onImportUpload"
|
:uploadHandler="onImportUpload"
|
||||||
label="拖拽或点击选择数据文件<br>请确认是否为 Halo 后台导出的文件。"
|
label="拖拽或点击选择数据文件<br>请确认是否为 Halo 后台导出的文件。"
|
||||||
name="file"
|
name="file"
|
||||||
></FilePondUpload>
|
></FilePondUpload>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="mt-8">
|
<div class="mt-8">
|
||||||
<ReactiveButton
|
<ReactiveButton
|
||||||
v-if="isInstallMode"
|
v-if="isInstallMode"
|
||||||
:errored="form.installErrored"
|
:errored="form.installErrored"
|
||||||
:loading="form.installing"
|
:loading="form.installing"
|
||||||
block
|
block
|
||||||
erroredText="安装失败"
|
erroredText="安装失败"
|
||||||
icon="check"
|
icon="check"
|
||||||
loadedText="安装成功"
|
loadedText="安装成功"
|
||||||
size="large"
|
size="large"
|
||||||
text="安装"
|
text="安装"
|
||||||
type="primary"
|
type="primary"
|
||||||
@callback="handleInstallCallback"
|
@callback="handleInstallCallback"
|
||||||
@click="handleInstall"
|
@click="handleInstall"
|
||||||
></ReactiveButton>
|
></ReactiveButton>
|
||||||
<ReactiveButton
|
<ReactiveButton
|
||||||
v-if="isImportMode"
|
v-if="isImportMode"
|
||||||
:errored="form.importErrored"
|
:errored="form.importErrored"
|
||||||
:loading="form.importing"
|
:loading="form.importing"
|
||||||
block
|
block
|
||||||
erroredText="导入失败"
|
erroredText="导入失败"
|
||||||
icon="import"
|
icon="import"
|
||||||
loadedText="导入成功"
|
loadedText="导入成功"
|
||||||
size="large"
|
size="large"
|
||||||
text="导入"
|
text="导入"
|
||||||
type="primary"
|
type="primary"
|
||||||
@callback="handleImportCallback"
|
@callback="handleImportCallback"
|
||||||
@click="handleImport"
|
@click="handleImport"
|
||||||
></ReactiveButton>
|
></ReactiveButton>
|
||||||
</div>
|
</div>
|
||||||
</a-card>
|
</a-card>
|
||||||
</div>
|
</div>
|
||||||
</a-col>
|
</a-col>
|
||||||
</a-row>
|
</a-row>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue