mirror of https://github.com/halo-dev/halo-admin
Remove useless file.
ruibaby
parent
d9518b908a
commit
7ad394d936
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="footer">
|
<div class="footer">
|
||||||
<div class="copyright">
|
<div class="copyright">
|
||||||
Proudly power by <a href="https://github.com/halo-dev/halo">Halo</a>
|
Proudly power by <a target="_blank" href="https://github.com/halo-dev/halo">Halo</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -1,89 +0,0 @@
|
||||||
<template>
|
|
||||||
<a-popover
|
|
||||||
v-model="visible"
|
|
||||||
trigger="click"
|
|
||||||
placement="bottomRight"
|
|
||||||
overlayClassName="header-notice-wrapper"
|
|
||||||
:autoAdjustOverflow="true"
|
|
||||||
:arrowPointAtCenter="true"
|
|
||||||
:overlayStyle="{ width: '300px', top: '50px' }"
|
|
||||||
>
|
|
||||||
<template slot="content">
|
|
||||||
<a-spin :spinning="loadding">
|
|
||||||
<a-tabs>
|
|
||||||
<a-tab-pane tab="通知" key="1">
|
|
||||||
<a-list>
|
|
||||||
<a-list-item>
|
|
||||||
<a-list-item-meta title="你收到了 14 份新周报" description="一年前">
|
|
||||||
<a-avatar style="background-color: white" slot="avatar" src="https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png"/>
|
|
||||||
</a-list-item-meta>
|
|
||||||
</a-list-item>
|
|
||||||
<a-list-item>
|
|
||||||
<a-list-item-meta title="你推荐的 曲妮妮 已通过第三轮面试" description="一年前">
|
|
||||||
<a-avatar style="background-color: white" slot="avatar" src="https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png"/>
|
|
||||||
</a-list-item-meta>
|
|
||||||
</a-list-item>
|
|
||||||
<a-list-item>
|
|
||||||
<a-list-item-meta title="这种模板可以区分多种通知类型" description="一年前">
|
|
||||||
<a-avatar style="background-color: white" slot="avatar" src="https://gw.alipayobjects.com/zos/rmsportal/kISTdvpyTAhtGxpovNWd.png"/>
|
|
||||||
</a-list-item-meta>
|
|
||||||
</a-list-item>
|
|
||||||
</a-list>
|
|
||||||
</a-tab-pane>
|
|
||||||
<a-tab-pane tab="消息" key="2">
|
|
||||||
123
|
|
||||||
</a-tab-pane>
|
|
||||||
<a-tab-pane tab="待办" key="3">
|
|
||||||
123
|
|
||||||
</a-tab-pane>
|
|
||||||
</a-tabs>
|
|
||||||
</a-spin>
|
|
||||||
</template>
|
|
||||||
<span @click="fetchNotice" class="header-notice">
|
|
||||||
<a-badge count="12">
|
|
||||||
<a-icon style="font-size: 16px; padding: 4px" type="bell" />
|
|
||||||
</a-badge>
|
|
||||||
</span>
|
|
||||||
</a-popover>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
name: 'HeaderNotice',
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
loadding: false,
|
|
||||||
visible: false
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
fetchNotice() {
|
|
||||||
if (!this.visible) {
|
|
||||||
this.loadding = true
|
|
||||||
setTimeout(() => {
|
|
||||||
this.loadding = false
|
|
||||||
}, 2000)
|
|
||||||
} else {
|
|
||||||
this.loadding = false
|
|
||||||
}
|
|
||||||
this.visible = !this.visible
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="css">
|
|
||||||
.header-notice-wrapper {
|
|
||||||
top: 50px !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
<style lang="less" scoped>
|
|
||||||
.header-notice{
|
|
||||||
display: inline-block;
|
|
||||||
transition: all 0.3s;
|
|
||||||
|
|
||||||
span {
|
|
||||||
vertical-align: initial;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,2 +0,0 @@
|
||||||
import NoticeIcon from './NoticeIcon'
|
|
||||||
export default NoticeIcon
|
|
||||||
|
|
@ -1,43 +0,0 @@
|
||||||
# NumberInfo 数据文本
|
|
||||||
|
|
||||||
常用在数据卡片中，用于突出展示某个业务数据。
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
引用方式：
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
import NumberInfo from '@/components/NumberInfo'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
components: {
|
|
||||||
NumberInfo
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## 代码演示 [demo](https://pro.loacg.com/test/home)
|
|
||||||
|
|
||||||
```html
|
|
||||||
<number-info
|
|
||||||
:sub-title="() => { return 'Visits this week' }"
|
|
||||||
:total="12321"
|
|
||||||
status="up"
|
|
||||||
:sub-total="17.1"></number-info>
|
|
||||||
```
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## API
|
|
||||||
|
|
||||||
参数 | 说明 | 类型 | 默认值
|
|
||||||
----|------|-----|------
|
|
||||||
title | 标题 | ReactNode\|string | -
|
|
||||||
subTitle | 子标题 | ReactNode\|string | -
|
|
||||||
total | 总量 | ReactNode\|string | -
|
|
||||||
subTotal | 子总量 | ReactNode\|string | -
|
|
||||||
status | 增加状态 | 'up \| down' | -
|
|
||||||
theme | 状态样式 | string | 'light'
|
|
||||||
gap | 设置数字和描述之间的间距（像素）| number | 8
|
|
||||||
Loading…
Reference in New Issue