@lambo-design/pro-layout 1.0.0-beta.290 → 1.0.0-beta.292

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/package.json +2 -2
  2. package/src/components/pro-layout-header/pro-layout-tools/components/pro-layout-tools-quick-notice.vue +131 -131
  3. package/src/components/pro-layout-header/pro-layout-tools/components/pro-layout-tools-quick-todo.vue +119 -119
  4. package/src/components/pro-layout-sider/components/pro-layout-sider-collapsed-menu.vue +3 -2
  5. package/src/components/pro-layout-sider/components/pro-layout-sider-menu-item.vue +22 -25
  6. package/src/components/pro-layout-sider/index.vue +4 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lambo-design/pro-layout",
3
- "version": "1.0.0-beta.290",
3
+ "version": "1.0.0-beta.292",
4
4
  "description": "",
5
5
  "main": "index.js",
6
6
  "author": "lambo",
@@ -11,7 +11,7 @@
11
11
  },
12
12
  "devDependencies": {
13
13
  "@lambo-design/core": "^4.7.1-beta.129",
14
- "@lambo-design/shared": "^1.0.0-beta.136"
14
+ "@lambo-design/shared": "^1.0.0-beta.143"
15
15
  },
16
16
  "scripts": {}
17
17
  }
package/src/components/pro-layout-header/pro-layout-tools/components/pro-layout-tools-quick-notice.vue CHANGED
@@ -1,131 +1,131 @@
1
- <template>
2
- <div class="pro-layout-tools-quick-notice">
3
- <Dropdown >
4
- <Badge :count="noticeDatas.length" class-name="badge-count">
5
- <Icon type="ios-notifications-outline" size="20" style="cursor: pointer"></Icon>
6
- </Badge>
7
- <template #list>
8
- <DropdownMenu slot="list" class="notice-dropdown-menu">
9
- <DropdownItem v-for="(item, index) in noticeDatas" :key="index" class="dropdown-item" @click.native="getDetail(item)" >
10
- <div class="item-image">
11
- <Icon type="ios-mail" size="24"/>
12
- </div>
13
- <div class="item-title" :title="item.noticeTitle">
14
- {{ item.noticeTitle }}
15
- </div>
16
- <div class="item-time">
17
- {{ item.publishTime }}
18
- </div>
19
- </DropdownItem>
20
- <div class="dropdown-footer" :class="[noticeDatas.length == 0 ? 'no-line' : '']">
21
- <Button type="text" v-if="noticeDatas.length > 0" @click="getMore" class="display-more" >查看更多</Button>
22
- <Button type="text" v-if="noticeDatas.length > 0" @click="markRead" class="mark-read" >一键已读</Button>
23
- <div class="no-data" v-if="noticeDatas.length == 0" >暂无未读通知</div>
24
- </div>
25
- </DropdownMenu>
26
- </template>
27
- </Dropdown>
28
- </div>
29
- </template>
30
-
31
- <script>
32
- import Bus from '@lambo-design/shared/utils/bus';
33
- import {deepCopy} from '@lambo-design/shared/utils/assist';
34
- export default {
35
- name: "pro-layout-tools-quick-notice",
36
- data() {
37
- return {
38
- noticeDatas:[]
39
- }
40
- },
41
- methods: {
42
- initListener() {
43
- Bus.$on('other-datas',(data) => {
44
- this.initNoticeList(data);
45
- })
46
- },
47
- destroyListener() {
48
- Bus.$off('other-datas')
49
- },
50
- initNoticeList(data) {
51
- if (data && data.noticeDatas) {
52
- this.noticeDatas = deepCopy(data.noticeDatas);
53
- }
54
- },
55
- getDetail(item){
56
- Bus.$emit('other-operate','notice-detail',item)
57
- },
58
- markRead(){
59
- Bus.$emit('other-operate','notice-mark-read')
60
- },
61
- getMore() {
62
- Bus.$emit('other-operate','notice-more')
63
- }
64
- },
65
- created() {
66
- this.initListener()
67
- },
68
- beforeDestroy() {
69
- this.destroyListener()
70
- }
71
- }
72
- </script>
73
-
74
- <style lang="less">
75
- @import "@lambo-design/core/src/styles/default";
76
- .pro-layout-tools-quick-notice{
77
- .badge-count{
78
- top:12px;
79
- height: 10px;
80
- line-height: 8px;
81
- min-width: 8px;
82
- padding: 0;
83
- font-size: 8px;
84
- width: 10px;
85
- }
86
- }
87
- .notice-dropdown-menu {
88
- max-height: 300px;
89
- width: 300px;
90
- &::-webkit-scrollbar {
91
- width: 0;
92
- height: 0;
93
- }
94
- .dropdown-item {
95
- overflow: hidden;
96
- line-height: 24px;
97
- padding: 8px;
98
- .item-image{
99
- float: left;
100
- }
101
- .item-title{
102
- float: left;
103
- margin-left: 5px;
104
- width: 120px;
105
- white-space:nowrap;
106
- overflow:hidden;
107
- text-overflow: ellipsis;
108
- }
109
- .item-time{
110
- float: right;
111
- }
112
- }
113
- .dropdown-footer{
114
- line-height: 24px;
115
- border-top: 1px solid var(--layout-sider-line-color,@_layout-sider-line-color);
116
- padding: 8px;
117
- &.no-line{
118
- border: 0;
119
- }
120
- .display-more{
121
- float: left;
122
- }
123
- .mark-read{
124
- float: right;
125
- }
126
- .no-data{
127
- text-align: center;
128
- }
129
- }
130
- }
131
- </style>
1
+ <template>
2
+ <div class="pro-layout-tools-quick-notice">
3
+ <Dropdown >
4
+ <Badge :count="noticeDatas.length" class-name="badge-count">
5
+ <Icon type="ios-notifications-outline" size="20" style="cursor: pointer"></Icon>
6
+ </Badge>
7
+ <template #list>
8
+ <DropdownMenu slot="list" class="notice-dropdown-menu">
9
+ <DropdownItem v-for="(item, index) in noticeDatas" :key="index" class="dropdown-item" @click.native="getDetail(item)" >
10
+ <div class="item-image">
11
+ <Icon type="ios-mail" size="24"/>
12
+ </div>
13
+ <div class="item-title" :title="item.noticeTitle">
14
+ {{ item.noticeTitle }}
15
+ </div>
16
+ <div class="item-time">
17
+ {{ item.publishTime }}
18
+ </div>
19
+ </DropdownItem>
20
+ <div class="dropdown-footer" :class="[noticeDatas.length == 0 ? 'no-line' : '']">
21
+ <Button type="text" v-if="noticeDatas.length > 0" @click="getMore" class="display-more" >查看更多</Button>
22
+ <Button type="text" v-if="noticeDatas.length > 0" @click="markRead" class="mark-read" >一键已读</Button>
23
+ <div class="no-data" v-if="noticeDatas.length == 0" >暂无未读通知</div>
24
+ </div>
25
+ </DropdownMenu>
26
+ </template>
27
+ </Dropdown>
28
+ </div>
29
+ </template>
30
+
31
+ <script>
32
+ import Bus from '@lambo-design/shared/utils/bus';
33
+ import {deepCopy} from '@lambo-design/shared/utils/assist';
34
+ export default {
35
+ name: "pro-layout-tools-quick-notice",
36
+ data() {
37
+ return {
38
+ noticeDatas:[]
39
+ }
40
+ },
41
+ methods: {
42
+ initListener() {
43
+ Bus.$on('other-datas',(data) => {
44
+ this.initNoticeList(data);
45
+ })
46
+ },
47
+ destroyListener() {
48
+ Bus.$off('other-datas')
49
+ },
50
+ initNoticeList(data) {
51
+ if (data && data.noticeDatas) {
52
+ this.noticeDatas = deepCopy(data.noticeDatas);
53
+ }
54
+ },
55
+ getDetail(item){
56
+ Bus.$emit('other-operate','notice-detail',item)
57
+ },
58
+ markRead(){
59
+ Bus.$emit('other-operate','notice-mark-read')
60
+ },
61
+ getMore() {
62
+ Bus.$emit('other-operate','notice-more')
63
+ }
64
+ },
65
+ created() {
66
+ this.initListener()
67
+ },
68
+ beforeDestroy() {
69
+ this.destroyListener()
70
+ }
71
+ }
72
+ </script>
73
+
74
+ <style lang="less">
75
+ @import "@lambo-design/core/src/styles/default";
76
+ .pro-layout-tools-quick-notice{
77
+ .badge-count{
78
+ top:12px;
79
+ height: 10px;
80
+ line-height: 8px;
81
+ min-width: 8px;
82
+ padding: 0;
83
+ font-size: 8px;
84
+ width: 10px;
85
+ }
86
+ }
87
+ .notice-dropdown-menu {
88
+ max-height: 300px;
89
+ width: 300px;
90
+ &::-webkit-scrollbar {
91
+ width: 0;
92
+ height: 0;
93
+ }
94
+ .dropdown-item {
95
+ overflow: hidden;
96
+ line-height: 24px;
97
+ padding: 8px;
98
+ .item-image{
99
+ float: left;
100
+ }
101
+ .item-title{
102
+ float: left;
103
+ margin-left: 5px;
104
+ width: 120px;
105
+ white-space:nowrap;
106
+ overflow:hidden;
107
+ text-overflow: ellipsis;
108
+ }
109
+ .item-time{
110
+ float: right;
111
+ }
112
+ }
113
+ .dropdown-footer{
114
+ line-height: 24px;
115
+ border-top: 1px solid var(--layout-sider-line-color,@_layout-sider-line-color);
116
+ padding: 8px;
117
+ &.no-line{
118
+ border: 0;
119
+ }
120
+ .display-more{
121
+ float: left;
122
+ }
123
+ .mark-read{
124
+ float: right;
125
+ }
126
+ .no-data{
127
+ text-align: center;
128
+ }
129
+ }
130
+ }
131
+ </style>
package/src/components/pro-layout-header/pro-layout-tools/components/pro-layout-tools-quick-todo.vue CHANGED
@@ -1,119 +1,119 @@
1
- <template>
2
- <div class="pro-layout-tools-quick-todo">
3
- <Dropdown >
4
- <Badge :count="todoDatas.length" class-name="badge-count">
5
- <Icon type="ios-alarm-outline" size="18" style="cursor: pointer"/>
6
- </Badge>
7
- <template #list>
8
- <DropdownMenu slot="list" class="todo-dropdown-menu">
9
- <DropdownItem v-for="(item, index) in todoDatas" :key="index" class="dropdown-item" @click.native="getDetail(item)" >
10
- <div class="item-title" :title="item.name">
11
- {{ item.name }}
12
- </div>
13
- <div class="item-time">
14
- {{ formatTimestamp(item.createTime,'YYYY-MM-DD HH:mm:ss') }}
15
- </div>
16
- </DropdownItem>
17
- <div class="dropdown-footer" :class="[todoDatas.length == 0 ? 'no-line' : '']">
18
- <Button type="text" v-if="todoDatas.length > 0" @click="getMore" >查看更多</Button>
19
- <div class="no-data" v-if="todoDatas.length == 0" >暂无代办</div>
20
- </div>
21
- </DropdownMenu>
22
- </template>
23
- </Dropdown>
24
- </div>
25
- </template>
26
-
27
- <script>
28
- import Bus from '@lambo-design/shared/utils/bus';
29
- import {deepCopy} from '@lambo-design/shared/utils/assist';
30
- import {formatTimestamp} from '@lambo-design/shared/utils/date'
31
- export default {
32
- name: "pro-layout-tools-quick-todo",
33
- data() {
34
- return {
35
- formatTimestamp: formatTimestamp,
36
- todoDatas:[]
37
- }
38
- },
39
- methods: {
40
- initListener() {
41
- Bus.$on('other-datas',(data) => {
42
- this.initTodoList(data);
43
- })
44
- },
45
- destroyListener() {
46
- Bus.$off('other-datas')
47
- },
48
- initTodoList(data) {
49
- if (data && data.todoDatas) {
50
- this.todoDatas = deepCopy(data.todoDatas);
51
- }
52
- },
53
- getDetail(item){
54
- Bus.$emit('other-operate','todo-detail',item)
55
- },
56
- getMore() {
57
- Bus.$emit('other-operate','todo-more')
58
- }
59
- },
60
- created() {
61
- this.initListener()
62
- },
63
- beforeDestroy() {
64
- this.destroyListener()
65
- }
66
- }
67
- </script>
68
-
69
- <style lang="less">
70
- @import "@lambo-design/core/src/styles/default";
71
- .pro-layout-tools-quick-todo{
72
- .badge-count{
73
- top:12px;
74
- height: 10px;
75
- line-height: 8px;
76
- min-width: 8px;
77
- padding: 0;
78
- font-size: 8px;
79
- width: 10px;
80
- }
81
- }
82
- .todo-dropdown-menu {
83
- max-height: 300px;
84
- width: 300px;
85
- overflow-y: auto;
86
- &::-webkit-scrollbar {
87
- width: 0;
88
- height: 0;
89
- }
90
- .dropdown-item {
91
- overflow: hidden;
92
- line-height: 24px;
93
- padding: 8px;
94
- .item-title{
95
- float: left;
96
- margin-left: 5px;
97
- width: 120px;
98
- white-space:nowrap;
99
- overflow:hidden;
100
- text-overflow: ellipsis;
101
- }
102
- .item-time{
103
- float: right;
104
- }
105
- }
106
- .dropdown-footer{
107
- line-height: 24px;
108
- border-top: 1px solid var(--layout-sider-line-color,@_layout-sider-line-color);
109
- padding: 8px;
110
- text-align: center;
111
- &.no-line{
112
- border: 0;
113
- }
114
- .no-data{
115
- text-align: center;
116
- }
117
- }
118
- }
119
- </style>
1
+ <template>
2
+ <div class="pro-layout-tools-quick-todo">
3
+ <Dropdown >
4
+ <Badge :count="todoDatas.length" class-name="badge-count">
5
+ <Icon type="ios-alarm-outline" size="18" style="cursor: pointer"/>
6
+ </Badge>
7
+ <template #list>
8
+ <DropdownMenu slot="list" class="todo-dropdown-menu">
9
+ <DropdownItem v-for="(item, index) in todoDatas" :key="index" class="dropdown-item" @click.native="getDetail(item)" >
10
+ <div class="item-title" :title="item.name">
11
+ {{ item.name }}
12
+ </div>
13
+ <div class="item-time">
14
+ {{ formatTimestamp(item.createTime,'YYYY-MM-DD HH:mm:ss') }}
15
+ </div>
16
+ </DropdownItem>
17
+ <div class="dropdown-footer" :class="[todoDatas.length == 0 ? 'no-line' : '']">
18
+ <Button type="text" v-if="todoDatas.length > 0" @click="getMore" >查看更多</Button>
19
+ <div class="no-data" v-if="todoDatas.length == 0" >暂无代办</div>
20
+ </div>
21
+ </DropdownMenu>
22
+ </template>
23
+ </Dropdown>
24
+ </div>
25
+ </template>
26
+
27
+ <script>
28
+ import Bus from '@lambo-design/shared/utils/bus';
29
+ import {deepCopy} from '@lambo-design/shared/utils/assist';
30
+ import {formatTimestamp} from '@lambo-design/shared/utils/date'
31
+ export default {
32
+ name: "pro-layout-tools-quick-todo",
33
+ data() {
34
+ return {
35
+ formatTimestamp: formatTimestamp,
36
+ todoDatas:[]
37
+ }
38
+ },
39
+ methods: {
40
+ initListener() {
41
+ Bus.$on('other-datas',(data) => {
42
+ this.initTodoList(data);
43
+ })
44
+ },
45
+ destroyListener() {
46
+ Bus.$off('other-datas')
47
+ },
48
+ initTodoList(data) {
49
+ if (data && data.todoDatas) {
50
+ this.todoDatas = deepCopy(data.todoDatas);
51
+ }
52
+ },
53
+ getDetail(item){
54
+ Bus.$emit('other-operate','todo-detail',item)
55
+ },
56
+ getMore() {
57
+ Bus.$emit('other-operate','todo-more')
58
+ }
59
+ },
60
+ created() {
61
+ this.initListener()
62
+ },
63
+ beforeDestroy() {
64
+ this.destroyListener()
65
+ }
66
+ }
67
+ </script>
68
+
69
+ <style lang="less">
70
+ @import "@lambo-design/core/src/styles/default";
71
+ .pro-layout-tools-quick-todo{
72
+ .badge-count{
73
+ top:12px;
74
+ height: 10px;
75
+ line-height: 8px;
76
+ min-width: 8px;
77
+ padding: 0;
78
+ font-size: 8px;
79
+ width: 10px;
80
+ }
81
+ }
82
+ .todo-dropdown-menu {
83
+ max-height: 300px;
84
+ width: 300px;
85
+ overflow-y: auto;
86
+ &::-webkit-scrollbar {
87
+ width: 0;
88
+ height: 0;
89
+ }
90
+ .dropdown-item {
91
+ overflow: hidden;
92
+ line-height: 24px;
93
+ padding: 8px;
94
+ .item-title{
95
+ float: left;
96
+ margin-left: 5px;
97
+ width: 120px;
98
+ white-space:nowrap;
99
+ overflow:hidden;
100
+ text-overflow: ellipsis;
101
+ }
102
+ .item-time{
103
+ float: right;
104
+ }
105
+ }
106
+ .dropdown-footer{
107
+ line-height: 24px;
108
+ border-top: 1px solid var(--layout-sider-line-color,@_layout-sider-line-color);
109
+ padding: 8px;
110
+ text-align: center;
111
+ &.no-line{
112
+ border: 0;
113
+ }
114
+ .no-data{
115
+ text-align: center;
116
+ }
117
+ }
118
+ }
119
+ </style>
package/src/components/pro-layout-sider/components/pro-layout-sider-collapsed-menu.vue CHANGED
@@ -5,7 +5,7 @@
5
5
  :class="['drop-menu-a', activeItem.indexOf(parentItem.name) >= 0 ? 'selected-parent' : '']" type="text"
6
6
  @mouseover="handleMousemove($event, children)">
7
7
  <ProLayoutSiderIcon :icon-type="parentItem.meta.icon" :icon-size="hideTitle ? 26 : 14"></ProLayoutSiderIcon>
8
- <span v-if="!hideTitle" class="menu-title" style="display: inline-block">&nbsp;{{ showTitle(parentItem) }}</span>
8
+ <span v-if="!hideTitle" >&nbsp;{{ showTitle(parentItem) }}</span>
9
9
  <Icon v-if="!hideTitle" :size="16"type="ios-arrow-forward"/>
10
10
  </a>
11
11
  <DropdownMenu ref="dropdown" slot="list" style="width: auto">
@@ -15,7 +15,7 @@
15
15
  </ProLayoutSiderCollapsedMenu>
16
16
  <DropdownItem v-else :key="`drop-${child.name}`" :name="child.name">
17
17
  <ProLayoutSiderIcon :icon-type="child.meta.icon"></ProLayoutSiderIcon>
18
- <span class="menu-title">&nbsp;{{ showTitle(child) }}</span>
18
+ <span class="menu-title-nochildren">&nbsp;{{ showTitle(child) }}</span>
19
19
  </DropdownItem>
20
20
  </template>
21
21
  </DropdownMenu>
@@ -63,6 +63,7 @@ export default {
63
63
  </script>
64
64
  <style lang="less" scoped>
65
65
  @import "@lambo-design/core/src/styles/default";
66
+ @import '../../../styles/other-menu.less';
66
67
  .collased-menu-dropdown {
67
68
  width: 100%;
68
69
  margin: 0;
package/src/components/pro-layout-sider/components/pro-layout-sider-menu-item.vue CHANGED
@@ -16,7 +16,8 @@
16
16
  <template v-if="item.children && item.children.length === 1">
17
17
  <ProLayoutSiderMenuItem v-if="showChildren(item)" :key="`menu-${item.name}`"
18
18
  :parent-item="item"
19
- :collect-map="collectMap">
19
+ :collect-map="collectMap"
20
+ :system-info="systemInfo">
20
21
  </ProLayoutSiderMenuItem>
21
22
  <menu-item v-else :key="`menu-${item.children[0].name}`" :name="getNameOrHref(item, true)">
22
23
  <Row type="flex" justify="center" align="top">
@@ -35,7 +36,8 @@
35
36
  <template v-else>
36
37
  <ProLayoutSiderMenuItem v-if="showChildren(item)" :key="`menu-${item.name}`"
37
38
  :parent-item="item"
38
- :collect-map="collectMap">
39
+ :collect-map="collectMap"
40
+ :system-info="systemInfo">
39
41
  </ProLayoutSiderMenuItem>
40
42
  <menu-item v-else :key="`menu-${item.name}`" :name="getNameOrHref(item)">
41
43
  <Row type="flex" justify="center" align="top">
@@ -67,35 +69,30 @@ export default {
67
69
  collectMap: {
68
70
  type: Object,
69
71
  default: () => {}
70
- }
71
- },
72
- data(){
73
- return{
74
- systemInfo:{}
75
- }
72
+ },
73
+ systemInfo: {
74
+ type: Object,
75
+ default: () => {
76
+ return {
77
+ systemName: '后台管理系统',
78
+ systemLogo: '',
79
+ layoutSize: 'small',
80
+ acceptAppId: '',
81
+ tabNum: 5,
82
+ topMenu: 4,
83
+ rightTopOptButtonList: [],
84
+ menuScaling:'1',
85
+ headBackground:'',
86
+ menuLogo: '1',
87
+ }
88
+ }
89
+ },
76
90
  },
77
91
  methods: {
78
92
  toggleCollect(item) {
79
93
  Bus.$emit('toggle-collect-menu',!this.collectMap[item.name],item)
80
94
  },
81
- initListener(){
82
- Bus.$on('system-info',(data)=>{
83
- this.initSystemInfo(data)
84
- })
85
- },
86
- initSystemInfo(data){
87
- this.systemInfo = deepCopy(data)
88
- },
89
- destroyListener(){
90
- Bus.$off('system-info')
91
- },
92
- },
93
- created(){
94
- this.initListener();
95
95
  },
96
- beforeDestroy(){
97
- this.destroyListener();
98
- }
99
96
  }
100
97
  </script>
101
98
 
package/src/components/pro-layout-sider/index.vue CHANGED
@@ -9,7 +9,8 @@
9
9
  <ProLayoutSiderMenuItem v-if="showChildren(item)"
10
10
  :key="`menu-${item.name}`"
11
11
  :parent-item="item"
12
- :collect-map="isCollected">
12
+ :collect-map="isCollected"
13
+ :system-info="systemInfo">
13
14
  </ProLayoutSiderMenuItem>
14
15
  <MenuItem v-else :key="`menu-${item.children[0].name}`"
15
16
  :name="getNameOrHref(item, true)">
@@ -29,7 +30,8 @@
29
30
  <ProLayoutSiderMenuItem v-if="showChildren(item)"
30
31
  :key="`menu-${item.name}`"
31
32
  :parent-item="item"
32
- :collect-map="isCollected">
33
+ :collect-map="isCollected"
34
+ :system-info="systemInfo">
33
35
  </ProLayoutSiderMenuItem>
34
36
  <MenuItem v-else :key="`menu-${item.name}`"
35
37
  :name="getNameOrHref(item)">