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

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lambo-design/pro-layout",
3
- "version": "1.0.0-beta.292",
3
+ "version": "1.0.0-beta.294",
4
4
  "description": "",
5
5
  "main": "index.js",
6
6
  "author": "lambo",
@@ -1,16 +1,29 @@
1
1
  <template>
2
2
  <div class="pro-layout-header-wrapper">
3
3
  <div class="trigger-box" :style="menuScalingStyle">
4
- <LamboProTrigger v-if="systemInfo.menuScaling === '1'"></LamboProTrigger>
4
+ <slot name="pro-layout-trigger">
5
+ <LamboProTrigger v-if="systemInfo.menuScaling === '1'"></LamboProTrigger>
6
+ </slot>
5
7
  </div>
6
8
  <div class="logo-box">
7
- <LamboProLogo></LamboProLogo>
9
+ <slot name="pro-layout-logo">
10
+ <LamboProLogo></LamboProLogo>
11
+ </slot>
8
12
  </div>
9
13
  <div class="nav-box" v-show="!systemInfo || !systemInfo.navType || systemInfo.navType == 'dropdown'">
10
- <LamboProNav></LamboProNav>
14
+ <slot name="pro-layout-nav">
15
+ <LamboProNav></LamboProNav>
16
+ </slot>
11
17
  </div>
12
18
  <div class="tools-box">
13
- <LamboProTools></LamboProTools>
19
+ <LamboProTools>
20
+ <template slot = "pro-layout-icons">
21
+ <slot name="pro-layout-icons"></slot>
22
+ </template>
23
+ <template slot = "pro-layout-user">
24
+ <slot name="pro-layout-user"></slot>
25
+ </template>
26
+ </LamboProTools>
14
27
  </div>
15
28
  <div v-show="systemInfo && systemInfo.navType && systemInfo.navType == 'slide'">
16
29
  <LamboProNavSilde></LamboProNavSilde>
@@ -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>
@@ -148,6 +148,14 @@ export default {
148
148
  @import '@lambo-design/core/src/styles/default.less';
149
149
  .quick-search-fast-con-modal {
150
150
  .modal-content {
151
+ height: 300px;
152
+ overflow-x: hidden;
153
+ overflow-y: auto;
154
+ -ms-overflow-style: none; /* Internet Explorer 10+ */
155
+ scrollbar-width: none; /* Firefox */
156
+ &::-webkit-scrollbar {
157
+ display: none; /* Chrome, Safari 和 Opera */
158
+ }
151
159
  .menu-style {
152
160
  margin : 5px;
153
161
  font-size : 16px;
@@ -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>
@@ -1,7 +1,11 @@
1
1
  <template>
2
2
  <div class="pro-layout-tools-wrapper">
3
- <LamboProLayoutToolsQuickIcons></LamboProLayoutToolsQuickIcons>
4
- <LamboProLayoutToolsUser></LamboProLayoutToolsUser>
3
+ <slot name="pro-layout-icons">
4
+ <LamboProLayoutToolsQuickIcons></LamboProLayoutToolsQuickIcons>
5
+ </slot>
6
+ <slot name="pro-layout-user">
7
+ <LamboProLayoutToolsUser></LamboProLayoutToolsUser>
8
+ </slot>
5
9
  </div>
6
10
  </template>
7
11
 
package/src/index.vue CHANGED
@@ -1,7 +1,23 @@
1
1
  <template>
2
2
  <i-layout class="pro-layout" :class="layoutClass">
3
3
  <i-header class="pro-layout-header" :style="systemInfo.headBackground ? headBackgroundStyle : ''">
4
- <LamboProLayoutHeader></LamboProLayoutHeader>
4
+ <LamboProLayoutHeader>
5
+ <template slot = "pro-layout-trigger">
6
+ <slot name="pro-layout-trigger"></slot>
7
+ </template>
8
+ <template slot = "pro-layout-logo">
9
+ <slot name="pro-layout-logo"></slot>
10
+ </template>
11
+ <template slot = "pro-layout-nav">
12
+ <slot name="pro-layout-nav"></slot>
13
+ </template>
14
+ <template slot = "pro-layout-icons">
15
+ <slot name="pro-layout-icons"></slot>
16
+ </template>
17
+ <template slot = "pro-layout-user">
18
+ <slot name="pro-layout-user"></slot>
19
+ </template>
20
+ </LamboProLayoutHeader>
5
21
  </i-header>
6
22
  <i-layout>
7
23
  <i-sider