99 lines
3.9 KiB
Vue
99 lines
3.9 KiB
Vue
<script setup lang="ts">
|
||
import { reactive, onMounted } from "vue"
|
||
|
||
const state = reactive({
|
||
versionList: [
|
||
{timestamp:'2024-01-11', icon:'CircleCloseFilled', color:'#F56C6C', content: [
|
||
'1、token 过期页面重复提示 “用户凭证已过期，请重新登录！” 问题处理；',
|
||
'2、页面管理表格列表不会自适应 问题处理；'
|
||
]},
|
||
{timestamp:'2024-01-09', icon:'CircleCheckFilled', color:'#409EFF', content: ['项目开源']},
|
||
{timestamp:'2023-07-07', icon:'CircleCheckFilled', color:'#409EFF', content: ['v2.0.0 集成 magic-api']},
|
||
{timestamp:'2023-07-06', icon:'CircleCheckFilled', color:'#409EFF', content: ['v1.0.0 前端amis，后端未使用 magic-api']},
|
||
{timestamp:'2023-03-20', icon:'CircleCheckFilled', color:'#409EFF', content: ['项目初始化']},
|
||
]
|
||
})
|
||
|
||
onMounted(()=>{
|
||
|
||
})
|
||
|
||
</script>
|
||
<template>
|
||
<div class="home-container">
|
||
<el-card shadow="never">
|
||
<template #header>
|
||
<span>公告</span>
|
||
</template>
|
||
<div>
|
||
<div>
|
||
<span class="title">Tansci Boot</span>
|
||
<el-divider direction="vertical" />
|
||
<el-link type="primary" href="https://gitee.com/typ1805" target="_blank">Gitee</el-link>
|
||
<el-divider direction="vertical" />
|
||
<el-link type="primary" href="https://github.com/typ1805" target="_blank">GitHub</el-link>
|
||
</div>
|
||
<div class="text">
|
||
<el-space alignment="normal" direction="vertical">
|
||
<el-text tag="p">基于 SpringBoot2 + magic-api + Vue3 + Element Plus + amis3.0 快速开发管理系统</el-text>
|
||
<el-text tag="p">Tansci-Boot 是一个前后端分离后台管理系统， 前端集成 amis 低代码前端框架，后端集成 magic-api 的接口快速开发框架。包含基础权限、安全认证、以及常用的一些组件功能。项目易上手，技术更综合，能力更全面。</el-text>
|
||
<el-text tag="p">amis 是一个低代码前端框架，它使用 JSON 配置来生成页面，可以减少页面开发工作量，极大提升效率。</el-text>
|
||
<el-text tag="p">magic-api 一个基于 Java 的接口快速开发框架，通过 magic-api 提供的 UI 界面完成编写接口，无需定义 Controller、Service、Dao、Mapper、XML、VO 等 Java 对象即可完成常见的 HTTP API 接口开发。</el-text>
|
||
</el-space>
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
<div class="cards">
|
||
<el-card shadow="never">
|
||
<template #header>
|
||
<span>官方信息</span>
|
||
</template>
|
||
<div>
|
||
<div>
|
||
<el-text>官网：</el-text>
|
||
<el-link type="success" href="https://typ1805.gitee.io" target="_blank">https://typ1805.gitee.io</el-link>
|
||
</div>
|
||
<div style="padding-top: 1rem;">
|
||
<el-text>交流群：</el-text>
|
||
<el-link type="success">747200630</el-link>
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
<el-card shadow="never" style="flex: 1;">
|
||
<template #header>
|
||
<span>Tansci发展史</span>
|
||
</template>
|
||
<div>
|
||
<el-timeline>
|
||
<el-timeline-item v-for="item in state.versionList" :key="item" :color="item.color" :icon="item.icon" :timestamp="item.timestamp" placement="top">
|
||
<el-card v-if="item.content.length > 1">
|
||
<p v-for="c in item.content" :key="c">{{ c }}</p>
|
||
</el-card>
|
||
<p v-else>{{ item.content[0] }}</p>
|
||
</el-timeline-item>
|
||
</el-timeline>
|
||
</div>
|
||
</el-card>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
<style lang="scss" scoped>
|
||
.home-container{
|
||
.title{
|
||
font-size: 20px;
|
||
font-weight: 700;
|
||
}
|
||
.text{
|
||
padding: 2rem 0;
|
||
}
|
||
.el-card{
|
||
margin: 1rem 0;
|
||
}
|
||
.cards{
|
||
display: flex;
|
||
.el-card{
|
||
margin-right: 1rem;
|
||
}
|
||
}
|
||
}
|
||
</style> |