mirror of
https://github.com/ialley-workshop-open/uni-halo.git
synced 2026-06-11 12:49:30 +08:00
v1.0.0-beta 源码正式开源
This commit is contained in:
@@ -0,0 +1,286 @@
|
||||
<template>
|
||||
<view class="app-page">
|
||||
<!-- 博主信息 -->
|
||||
<view class="blogger bg-white flex flex-center ma-24 mt-30 pa-24 round-3" @click="fnToModifyProfile">
|
||||
<image class="avatar" :src="$utils.checkAvatarUrl(bloggerInfo.avatar, true)" mode="aspectFill"></image>
|
||||
<view class="info pl-24">
|
||||
<view class="name text-weight-b text-grey-darken-5">☔️{{ bloggerInfo.nickname }} 欢迎回来!</view>
|
||||
<view class="mt-12 text-size-s text-grey-darken-1">{{ bloggerInfo.description || '这个人真懒,没填写描述~' }}</view>
|
||||
</view>
|
||||
<view class="modify"><text class="text-grey-darken-1 text-size-m iconfont icon-angle-right"></text></view>
|
||||
</view>
|
||||
|
||||
<!-- 工作台导航 -->
|
||||
<view class="works bg-white ma-24 mt-36 pt-24 pb-16 flex flex-wrap round-3">
|
||||
<view class="works-item pt-24 pb-24 flex flex-col flex-center " v-for="(item, index) in workList" :key="index">
|
||||
<view class="icon flex flex-center round-4" :style="{ backgroundColor: item.bgColor }" @click="fnOnNav(item)">
|
||||
<text class="haloicon" :class="[item.icon]"></text>
|
||||
</view>
|
||||
<view class="mt-12 title text-size-s text-grey-darken-1">{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<tm-bottomnavigation
|
||||
class="shadow-6"
|
||||
position="bottom"
|
||||
:bottom="24"
|
||||
:safe="false"
|
||||
:round="3"
|
||||
:offset-left="12"
|
||||
border=""
|
||||
icon-color="blue"
|
||||
icon-color-grey="blue"
|
||||
:list="quickBarList"
|
||||
@change="fnOnNavBar"
|
||||
></tm-bottomnavigation>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import tmBottomnavigation from '@/tm-vuetify/components/tm-bottomnavigation/tm-bottomnavigation.vue';
|
||||
export default {
|
||||
components: { tmBottomnavigation },
|
||||
data() {
|
||||
return {
|
||||
workList: [
|
||||
{
|
||||
icon: 'haloicon-shuxie1',
|
||||
name: '日记管理',
|
||||
bgColor: 'rgba(80,167,255,1)',
|
||||
path: '/pagesB/journal/journal',
|
||||
todo: false
|
||||
},
|
||||
{
|
||||
icon: 'haloicon-wenzhang1',
|
||||
name: '文章管理',
|
||||
bgColor: 'rgba(27,187,179,1)',
|
||||
path: '/pagesB/articles/articles',
|
||||
todo: false
|
||||
},
|
||||
{
|
||||
icon: 'haloicon-fenlei2',
|
||||
name: '分类管理',
|
||||
bgColor: 'rgba(253,103,132,1)',
|
||||
path: '/pagesB/category/category',
|
||||
todo: false
|
||||
},
|
||||
{
|
||||
icon: 'haloicon-biaoqian2',
|
||||
name: '标签管理',
|
||||
bgColor: '#6638B5',
|
||||
path: '/pagesB/tags/tags',
|
||||
todo: false
|
||||
},
|
||||
{
|
||||
icon: 'haloicon-fujian1',
|
||||
name: '附件管理',
|
||||
bgColor: 'rgba(253,103,132,1)',
|
||||
path: '/pagesB/attachment/attachment',
|
||||
todo: false
|
||||
},
|
||||
{
|
||||
icon: 'haloicon-links',
|
||||
name: '友链管理',
|
||||
bgColor: 'rgba(80,167,255,1)',
|
||||
path: '/pagesB/links/links',
|
||||
todo: false
|
||||
},
|
||||
{
|
||||
icon: 'haloicon-tukuguanli',
|
||||
name: '图库管理',
|
||||
bgColor: 'rgba(254,178,0,1) ',
|
||||
path: '/pagesB/photos/photos',
|
||||
todo: false
|
||||
},
|
||||
{
|
||||
icon: 'haloicon-pinglun1',
|
||||
name: '评论管理',
|
||||
bgColor: 'rgba(27,187,179,1)',
|
||||
path: '/pagesB/comments/comments',
|
||||
todo: false
|
||||
},
|
||||
{
|
||||
icon: 'haloicon-xitongrizhi',
|
||||
name: '日志管理',
|
||||
bgColor: '#6638B5',
|
||||
path: '/pagesB/logs/logs',
|
||||
todo: false
|
||||
},
|
||||
{
|
||||
icon: 'haloicon-caidan',
|
||||
name: '菜单设置',
|
||||
bgColor: 'rgba(254,178,0,1)',
|
||||
path: '/pagesB/menus/menus',
|
||||
todo: true
|
||||
},
|
||||
{
|
||||
icon: 'haloicon-password',
|
||||
name: '修改密码',
|
||||
bgColor: 'rgba(27,187,179,1)',
|
||||
path: '/pagesB/password/password',
|
||||
todo: false
|
||||
},
|
||||
{
|
||||
icon: 'haloicon-shezhi',
|
||||
name: '系统设置',
|
||||
bgColor: '#8698A2',
|
||||
path: '/pagesB/settings/settings',
|
||||
todo: true
|
||||
}
|
||||
],
|
||||
quickBarList: [
|
||||
{ key: 'logout', iconSize: 36, icon: 'icon-poweroff', fontSize: 26, value: '退出登录' },
|
||||
{
|
||||
key: 'article-edit',
|
||||
iconSize: 36,
|
||||
icon: 'icon-plus',
|
||||
fontSize: 26,
|
||||
value: '写文章',
|
||||
custom: true,
|
||||
customColor: 'blue',
|
||||
customFontColor: 'white'
|
||||
},
|
||||
{ key: 'back-home', iconSize: 36, icon: 'icon-home', fontSize: 26, value: '返回首页' }
|
||||
]
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
bloggerInfo() {
|
||||
return this.$tm.vx.getters().blogger.getBlogger;
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// this.fnGetData();
|
||||
this.fnSetPageTitle('欢迎登录工作台');
|
||||
console.log(this.bloggerInfo);
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
uni.stopPullDownRefresh();
|
||||
},
|
||||
methods: {
|
||||
fnGetData() {
|
||||
this.$httpApi.admin
|
||||
.getLinkList()
|
||||
.then(res => {
|
||||
console.log('getLinkList,success:', res);
|
||||
})
|
||||
.catch(err => {
|
||||
console.log('getLinkList,error:', err);
|
||||
});
|
||||
},
|
||||
fnToModifyProfile() {
|
||||
this.$Router.push({
|
||||
path: '/pagesB/profile/profile'
|
||||
});
|
||||
},
|
||||
fnOnNav(item) {
|
||||
if (item.todo) return uni.$tm.toast('功能开发中...');
|
||||
this.$Router.push({
|
||||
path: item.path
|
||||
});
|
||||
},
|
||||
fnOnNavBar(e) {
|
||||
if (e.item.key == 'logout') {
|
||||
uni.$eShowModal({
|
||||
title: '提示',
|
||||
content: '是否要退出当前后台管理登录?',
|
||||
showCancel: true,
|
||||
cancelText: '否',
|
||||
cancelColor: '#999999',
|
||||
confirmText: '是',
|
||||
confirmColor: '#03a9f4'
|
||||
})
|
||||
.then(res => {
|
||||
uni.showLoading({
|
||||
title: '正在退出登录...'
|
||||
});
|
||||
uni.$tm.vx.actions('user/adminLogout');
|
||||
setTimeout(() => {
|
||||
uni.hideLoading();
|
||||
uni.switchTab({
|
||||
url: '/pages/tabbar/about/about'
|
||||
});
|
||||
}, 1000);
|
||||
})
|
||||
.catch(err => {});
|
||||
} else if (e.item.key == 'article-edit') {
|
||||
uni.$tm.toast(e.item.value);
|
||||
this.$Router.push({
|
||||
path: '/pagesB/articles/article-edit'
|
||||
});
|
||||
} else if (e.item.key == 'back-home') {
|
||||
uni.$eShowModal({
|
||||
title: '提示',
|
||||
content: '是否返回首页?',
|
||||
showCancel: true,
|
||||
cancelText: '否',
|
||||
cancelColor: '#999999',
|
||||
confirmText: '是',
|
||||
confirmColor: '#03a9f4'
|
||||
})
|
||||
.then(res => {
|
||||
uni.switchTab({
|
||||
url: '/pages/tabbar/home/home'
|
||||
});
|
||||
})
|
||||
.catch(err => {});
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.app-page {
|
||||
width: 100vw;
|
||||
|
||||
::v-deep {
|
||||
.tm-bottomnavigation {
|
||||
box-shadow: 0rpx 4rpx 24rpx rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.blogger {
|
||||
box-shadow: 0rpx 0rpx 24rpx rgba(0, 0, 0, 0.05);
|
||||
.avatar {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 50%;
|
||||
border: 6rpx solid #ffffff;
|
||||
box-shadow: 0rpx 0rpx 24rpx rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
.info {
|
||||
width: 0;
|
||||
flex-grow: 1;
|
||||
|
||||
.name {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
.modify {
|
||||
width: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.works {
|
||||
box-shadow: 0rpx 0rpx 24rpx rgba(0, 0, 0, 0.05);
|
||||
&-item {
|
||||
width: 25%;
|
||||
box-sizing: border-box;
|
||||
|
||||
.icon {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
box-shadow: 0rpx 4rpx 24rpx rgba(0, 0, 0, 0.1);
|
||||
.haloicon {
|
||||
color: #ffffff;
|
||||
font-size: 66rpx;
|
||||
}
|
||||
}
|
||||
.title {
|
||||
color: #55647a;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user