mirror of https://github.com/halo-dev/halo-admin
样式美化
ruibaby
parent
e0591f7749
commit
4799a7ec31
|
|
@ -1,7 +1,10 @@
|
|||
<template>
|
||||
<div class="footer">
|
||||
<div class="copyright">
|
||||
Proudly power by <a target="_blank" href="https://github.com/halo-dev/halo">Halo</a>
|
||||
Proudly power by
|
||||
<router-link :to="{ name:'About' }">
|
||||
<a href="javascript:void(0);">Halo</a>
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -176,6 +176,13 @@ export const asyncRouterMap = [
|
|||
name: 'ToolList',
|
||||
component: () => import('@/views/system/ToolList'),
|
||||
meta: { title: '小工具', hiddenHeaderContent: false }
|
||||
},
|
||||
{
|
||||
path: '/system/about',
|
||||
name: 'About',
|
||||
component: () => import('@/views/system/About'),
|
||||
hidden: true,
|
||||
meta: { title: '关于 Halo', hiddenHeaderContent: false }
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,23 +2,17 @@
|
|||
<div class="page-header-index-wide">
|
||||
<a-row :gutter="12">
|
||||
<a-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24">
|
||||
<a-card>
|
||||
<div style="margin-bottom: 16px">
|
||||
<a-input
|
||||
v-model="postToStage.title"
|
||||
v-decorator="['title', { rules: [{ required: true, message: '请输入页面标题' }] }]"
|
||||
size="large"
|
||||
placeholder="请输入页面标题"
|
||||
/>
|
||||
</div>
|
||||
<a-button type="primary" @click="showDrawer">发布</a-button>
|
||||
</a-card>
|
||||
|
||||
<a-card>
|
||||
<div id="editor">
|
||||
<mavon-editor v-model="postToStage.originalContent"/>
|
||||
</div>
|
||||
</a-card>
|
||||
<div style="margin-bottom: 16px">
|
||||
<a-input
|
||||
v-model="postToStage.title"
|
||||
v-decorator="['title', { rules: [{ required: true, message: '请输入页面标题' }] }]"
|
||||
size="large"
|
||||
placeholder="请输入页面标题"
|
||||
/>
|
||||
</div>
|
||||
<div id="editor">
|
||||
<mavon-editor v-model="postToStage.originalContent" :boxShadow="false" :ishljs="true"/>
|
||||
</div>
|
||||
</a-col>
|
||||
|
||||
<a-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24">
|
||||
|
|
@ -34,17 +28,17 @@
|
|||
<h3 class="post-setting-drawer-title">基本设置</h3>
|
||||
<div class="post-setting-drawer-item">
|
||||
<a-form layout="vertical">
|
||||
<a-form-item label="页面路径：" :help="'https://localhost:8090/p/'+ (postToStage.url ? postToStage.url : '{auto_generate}')">
|
||||
<a-form-item
|
||||
label="页面路径："
|
||||
:help="'https://localhost:8090/p/'+ (postToStage.url ? postToStage.url : '{auto_generate}')"
|
||||
>
|
||||
<a-input v-model="postToStage.url"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="页面密码：">
|
||||
<a-input type="password" v-model="postToStage.password"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="是否关闭评论：">
|
||||
<a-radio-group
|
||||
v-model="postToStage.disallowComment"
|
||||
:defaultValue="false"
|
||||
>
|
||||
<a-radio-group v-model="postToStage.disallowComment" :defaultValue="false">
|
||||
<a-radio :value="false">开启</a-radio>
|
||||
<a-radio :value="true">关闭</a-radio>
|
||||
</a-radio-group>
|
||||
|
|
@ -76,11 +70,19 @@
|
|||
</a-drawer>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<footer-tool-bar
|
||||
:style="{ width: isSideMenu() && isDesktop() ? `calc(100% - ${sidebarOpened ? 256 : 80}px)` : '100%'}"
|
||||
>
|
||||
<a-button type="primary" @click="showDrawer">发布</a-button>
|
||||
<a-button type="dashed" style="margin-left: 8px;">附件库</a-button>
|
||||
</footer-tool-bar>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mavonEditor } from 'mavon-editor'
|
||||
import FooterToolBar from '@/components/FooterToolbar'
|
||||
import { mixin, mixinDevice } from '@/utils/mixin.js'
|
||||
import 'mavon-editor/dist/css/index.css'
|
||||
import postApi from '@/api/post'
|
||||
|
|
@ -88,9 +90,9 @@ import themeApi from '@/api/theme'
|
|||
export default {
|
||||
name: 'Editor',
|
||||
components: {
|
||||
mavonEditor
|
||||
mavonEditor,
|
||||
FooterToolBar
|
||||
},
|
||||
|
||||
mixins: [mixin, mixinDevice],
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -179,17 +181,9 @@ export default {
|
|||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
#editor {
|
||||
margin: auto;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.v-note-wrapper {
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.ant-card {
|
||||
margin-bottom: 16px;
|
||||
min-height: 540px;
|
||||
}
|
||||
|
||||
.ant-form-vertical .ant-form-item {
|
||||
|
|
|
|||
|
|
@ -11,9 +11,11 @@
|
|||
<div class="card-container">
|
||||
<a-tabs type="card">
|
||||
<a-tab-pane
|
||||
tab="内置页面"
|
||||
key="internal"
|
||||
>
|
||||
<span slot="tab">
|
||||
<a-icon type="pushpin" />内置页面
|
||||
</span>
|
||||
<a-table
|
||||
:columns="internalColumns"
|
||||
:dataSource="internalPages"
|
||||
|
|
@ -45,9 +47,12 @@
|
|||
</a-table>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane
|
||||
tab="自定义页面"
|
||||
key="custom"
|
||||
>自定义页面</a-tab-pane>
|
||||
>
|
||||
<span slot="tab">
|
||||
<a-icon type="fork" />内置页面
|
||||
</span>
|
||||
自定义页面</a-tab-pane>
|
||||
</a-tabs>
|
||||
</div>
|
||||
</a-col>
|
||||
|
|
|
|||
|
|
@ -497,10 +497,6 @@ export default {
|
|||
min-height: 540px;
|
||||
}
|
||||
|
||||
.ant-card {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.ant-form-vertical .ant-form-item {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,10 @@
|
|||
<template>
|
||||
<div class="page-header-index-wide">About page</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
|
|
@ -2,7 +2,10 @@
|
|||
<div class="page-header-index-wide">
|
||||
<div class="card-container">
|
||||
<a-tabs type="card">
|
||||
<a-tab-pane tab="资源文件备份" key="1">
|
||||
<a-tab-pane key="1">
|
||||
<span slot="tab">
|
||||
<a-icon type="folder" />资源文件备份
|
||||
</span>
|
||||
<a-table :columns="columns" :dataSource="ResourcesData">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a href="javascript:;" @click="downResources('ResourcesData',record.id)">下载</a>
|
||||
|
|
@ -14,7 +17,10 @@
|
|||
</a-table>
|
||||
<a-button type="primary" @click="backupData('ResourcesData')">备份</a-button>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="数据库备份" key="2">
|
||||
<a-tab-pane key="2">
|
||||
<span slot="tab">
|
||||
<a-icon type="database" />资源文件备份
|
||||
</span>
|
||||
<a-table :columns="columns" :dataSource="DataBaseData">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a href="javascript:;" @click="downResources('DataBaseData',record.id)">下载</a>
|
||||
|
|
@ -26,7 +32,10 @@
|
|||
</a-table>
|
||||
<a-button type="primary" @click="backupData('DataBaseData')">备份</a-button>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane tab="文章备份" key="3">
|
||||
<a-tab-pane key="3">
|
||||
<span slot="tab">
|
||||
<a-icon type="read" />文章备份
|
||||
</span>
|
||||
<a-table :columns="columns" :dataSource="FileData">
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a href="javascript:;" @click="downResources('FileData',record.id)">下载</a>
|
||||
|
|
@ -125,11 +134,8 @@ export default {
|
|||
<style>
|
||||
.card-container {
|
||||
background: #f5f5f5;
|
||||
overflow: hidden;
|
||||
padding: 24px;
|
||||
}
|
||||
.card-container > .ant-tabs-card > .ant-tabs-content {
|
||||
/* height: 120px; */
|
||||
margin-top: -16px;
|
||||
}
|
||||
|
||||
|
|
@ -151,4 +157,7 @@ export default {
|
|||
border-color: #fff;
|
||||
background: #fff;
|
||||
}
|
||||
.ant-form-vertical .ant-form-item {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@
|
|||
</a-tab-pane>
|
||||
<a-tab-pane key="seo">
|
||||
<span slot="tab">
|
||||
<a-icon type="read" />SEO设置
|
||||
<a-icon type="global" />SEO设置
|
||||
</span>
|
||||
<a-form layout="vertical">
|
||||
<a-form-item label="关键词： " :wrapper-col="wrapperCol">
|
||||
|
|
|
|||
|
|
@ -4,23 +4,32 @@
|
|||
<a-col :lg="10" :md="24" :style="{ 'padding-bottom': '12px' }">
|
||||
<a-card :bodyStyle="{ padding: '16' }" :bordered="false">
|
||||
<div class="profile-center-avatarHolder">
|
||||
<div class="avatar">
|
||||
<img :src="user.avatar || 'https://gravatar.loli.net/avatar/?s=256&d=mm'" />
|
||||
</div>
|
||||
<a-tooltip placement="right" :trigger="['hover']" title="点击可修改头像">
|
||||
<template slot="title">
|
||||
<span>prompt text</span>
|
||||
</template>
|
||||
<div class="avatar">
|
||||
<img :src="user.avatar || 'https://gravatar.loli.net/avatar/?s=256&d=mm'">
|
||||
</div>
|
||||
</a-tooltip>
|
||||
<div class="username">{{ user.nickname }}</div>
|
||||
<div class="bio">{{ user.description }}</div>
|
||||
</div>
|
||||
<div class="profile-center-detail">
|
||||
<p>
|
||||
<a-icon type="mail" />
|
||||
<a-icon type="link"/>
|
||||
<a href="http://localhost:8090" target="method">http://localhost:8090</a>
|
||||
</p>
|
||||
<p>
|
||||
<a-icon type="mail"/>
|
||||
{{ user.email }}
|
||||
</p>
|
||||
<p>
|
||||
<a-icon type="calendar" />
|
||||
<a-icon type="calendar"/>
|
||||
{{ counts.establishDays || 0 }} 天
|
||||
</p>
|
||||
</div>
|
||||
<a-divider />
|
||||
<a-divider/>
|
||||
<div class="general-profile">
|
||||
<a-list :loading="countsLoading" itemLayout="horizontal">
|
||||
<a-list-item>累计发表了 {{ counts.postCount || 0 }} 篇文章。</a-list-item>
|
||||
|
|
@ -37,43 +46,48 @@
|
|||
<a-card :bodyStyle="{ padding: '0' }" :bordered="false" title="个人资料">
|
||||
<div class="card-container">
|
||||
<a-tabs type="card">
|
||||
<a-tab-pane key="1" tab="基本资料">
|
||||
<a-tab-pane key="1">
|
||||
<span slot="tab">
|
||||
<a-icon type="idcard"/>基本资料
|
||||
</span>
|
||||
<a-form layout="vertical">
|
||||
<a-form-item label="用户名：">
|
||||
<a-input v-model="user.username" />
|
||||
<a-input v-model="user.username"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="昵称：">
|
||||
<a-input v-model="user.nickname" />
|
||||
<a-input v-model="user.nickname"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="邮箱：">
|
||||
<a-input v-model="user.email" />
|
||||
<a-input v-model="user.email"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="个人说明：">
|
||||
<a-input :autosize="{ minRows: 5 }" type="textarea" v-model="user.description" />
|
||||
<a-input :autosize="{ minRows: 5 }" type="textarea" v-model="user.description"/>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-button @click="updateProfile" type="primary">保存</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="密码">
|
||||
<a-tab-pane key="2">
|
||||
<span slot="tab">
|
||||
<a-icon type="lock"/>密码
|
||||
</span>
|
||||
<a-form layout="vertical">
|
||||
<a-form-item label="原密码：">
|
||||
<a-input type="password" v-model="passwordParam.oldPassword" />
|
||||
<a-input type="password" v-model="passwordParam.oldPassword"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="新密码：">
|
||||
<a-input type="password" v-model="passwordParam.newPassword" />
|
||||
<a-input type="password" v-model="passwordParam.newPassword"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="确认密码：">
|
||||
<a-input type="password" v-model="passwordParam.confirmPassword" />
|
||||
<a-input type="password" v-model="passwordParam.confirmPassword"/>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-button
|
||||
:disabled="passwordUpdateButtonDisabled"
|
||||
@click="updatePassword"
|
||||
type="primary"
|
||||
>确认更改
|
||||
</a-button>
|
||||
>确认更改</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-tab-pane>
|
||||
|
|
@ -162,6 +176,7 @@ export default {
|
|||
margin-bottom: 20px;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
|
||||
img {
|
||||
height: 100%;
|
||||
|
|
|
|||
Loading…
Reference in New Issue