1
0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2025-01-21 17:29:17 +08:00

149 lines
6.5 KiB
Vue
Raw Normal View History

<template>
<LayoutContent>
<div class="brief">
<el-row :gutter="20">
<el-col :span="4">
<div class="icon">
<el-image class="image" :src="getImageUrl(appDetail.icon)"></el-image>
</div>
</el-col>
<el-col :span="20">
<div class="a-detail">
<div class="a-name">
<font size="5" style="font-weight: 800">{{ appDetail.name }}</font>
</div>
<div class="a-description">
<span>
<font>
{{ appDetail.description }}
</font>
</span>
</div>
<el-descriptions :column="1">
<el-descriptions-item :label="$t('app.version')">
<el-select v-model="appSelect.version">
<el-option
v-for="(v, index) in appDetail.versions"
:key="index"
:value="v"
:label="v"
>
{{ v }}
</el-option>
</el-select>
</el-descriptions-item>
<el-descriptions-item :label="'链接'">
<el-link>source</el-link>
</el-descriptions-item>
<el-descriptions-item :label="'来源'">FIT2CLOUD</el-descriptions-item>
</el-descriptions>
<div>
<el-button type="primary">安装</el-button>
</div>
</div>
</el-col>
</el-row>
</div>
<el-divider border-style="double" />
<div class="detail">
<v-md-preview :text="readme"></v-md-preview>
</div>
</LayoutContent>
</template>
<script lang="ts" setup>
import LayoutContent from '@/layout/layout-content.vue';
import { getAssetsFile } from '@/utils/image';
import { reactive, ref } from 'vue';
import detail from './detail.json';
let appDetail = ref<any>();
appDetail.value = detail;
let appSelect = reactive({
version: '',
});
appSelect.version = appDetail.value.versions[0];
let readme = ref<string>(`<p align="center">
<a href="https://halo.run" target="_blank" rel="noopener noreferrer">
<img width="100" src="https://halo.run/logo" alt="Halo logo" />
</a>
</p>
<p align="center"><b>Halo</b> [ˈheɪloʊ]一款现代化的开源博客/CMS系统值得一试</p>
<p align="center">
<a href="https://github.com/halo-dev/halo/releases"><img alt="GitHub release" src="https://img.shields.io/github/release/halo-dev/halo.svg?style=flat-square" /></a>
<a href="https://github.com/halo-dev/halo/releases"><img alt="GitHub All Releases" src="https://img.shields.io/github/downloads/halo-dev/halo/total.svg?style=flat-square" /></a>
<a href="https://hub.docker.com/r/halohub/halo"><img alt="Docker pulls" src="https://img.shields.io/docker/pulls/halohub/halo?style=flat-square" /></a>
<a href="https://github.com/halo-dev/halo/commits"><img alt="GitHub last commit" src="https://img.shields.io/github/last-commit/halo-dev/halo.svg?style=flat-square" /></a>
<a href="https://github.com/halo-dev/halo/actions"><img alt="GitHub Workflow Status" src="https://img.shields.io/github/workflow/status/halo-dev/halo/Halo%20CI?style=flat-square" /></a>
<br />
<a href="https://halo.run">官网</a>
<a href="https://docs.halo.run">文档</a>
<a href="https://bbs.halo.run">社区</a>
<a href="https://gitee.com/halo-dev">Gitee</a>
<a href="https://t.me/halo_dev">Telegram 频道</a>
</p>
---
## 快速开始
详细部署文档请查阅<https://docs.halo.run>
## 在线体验
- 环境地址<https://demo.halo.run>
- 后台地址<https://demo.halo.run/admin>
- 用户名demo
- 密码P@ssw0rd123..
- 使用前请阅读<https://demo.halo.run/archives/tips>
## 生态
| 项目 | 状态 | 描述 |
| --- | --- | --- |
| [halo-admin](https://github.com/halo-dev/halo-admin) | <a href="https://github.com/halo-dev/halo-admin/releases"><img alt="GitHub release" src="https://img.shields.io/github/release/halo-dev/halo-admin.svg?style=flat-square" /></a> | Web 管理端 UI已内置在主应用 |
| [js-sdk](https://github.com/halo-dev/js-sdk) | <a href="https://github.com/halo-dev/js-sdk"><img alt="npm release" src="https://img.shields.io/npm/v/@halo-dev/content-api?style=flat-square"/></a> | JavaScript SDK |
| [halo-comment](https://github.com/halo-dev/halo-comment) | <a href="https://www.npmjs.com/package/halo-comment"><img alt="npm release" src="https://img.shields.io/npm/v/halo-comment?style=flat-square"/></a> | 独立评论组件,可以非常方便的集成到主题中 |
| [halo-comment-normal](https://github.com/halo-dev/halo-comment-normal) | <a href="https://www.npmjs.com/package/halo-comment-normal"><img alt="npm release" src="https://img.shields.io/npm/v/halo-comment-normal?style=flat-square"/></a> | 另外一款评论组件 |
| [halo-mobile-app](https://github.com/halo-dev/halo-mobile-app) | 已停止维护 | 移动端管理 APP |
| [tencent-cloudbase-halo](https://github.com/halo-dev/tencent-cloudbase-halo) | 无 | 腾讯云 CloudBase 一键部署配置 |
| [halo-theme-\*](https://github.com/topics/halo-theme) | 无 | GitHub 上开源的 Halo 主题集合 |
## 许可证
[![license](https://img.shields.io/github/license/halo-dev/halo.svg?style=flat-square)](https://github.com/halo-dev/halo/blob/master/LICENSE)
Halo 使用 GPL-v3.0 协议开源请遵守开源协议
## 贡献
参考 [CONTRIBUTING](https://github.com/halo-dev/halo/blob/master/CONTRIBUTING.md)。
<a href="https://github.com/halo-dev/halo/graphs/contributors"><img src="https://opencollective.com/halo/contributors.svg?width=890&button=false" /></a>
## 状态
![Repobeats analytics](https://repobeats.axiom.co/api/embed/ad008b2151c22e7cf734d2688befaa795d593b95.svg 'Repobeats analytics image')
`);
const getImageUrl = (name: string) => {
return getAssetsFile(name);
};
</script>
<style lang="scss">
.brief {
height: 30vh;
.icon {
.image {
width: auto;
height: 20vh;
}
}
}
</style>