@lambo-design/pro-layout 1.0.0-beta.300 → 1.0.0-beta.302

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.300",
3
+ "version": "1.0.0-beta.302",
4
4
  "description": "",
5
5
  "main": "index.js",
6
6
  "author": "lambo",
@@ -10,8 +10,8 @@
10
10
  "registry": "https://registry.npmjs.org/"
11
11
  },
12
12
  "devDependencies": {
13
- "@lambo-design/shared": "^1.0.0-beta.155",
14
- "@lambo-design/core": "^4.7.1-beta.130"
13
+ "@lambo-design/core": "^4.7.1-beta.131",
14
+ "@lambo-design/shared": "^1.0.0-beta.160"
15
15
  },
16
16
  "scripts": {}
17
17
  }
@@ -1,193 +1,193 @@
1
- <template>
2
- <div class="menu-list" >
3
- <ul class="top-menu" :style="layoutSize === 'default' ? {height: '64px'} : {height: '50px'}" ref="topNav">
4
- <li class="top-menu-item" v-show="pointer <= index && index < pointer + topMenuNum && flag" :class="{ 'active': activeName === item.appId }" v-for="(item,index) in topMenList" :key="item.appId" @click="selectApp(item.appId)">
5
- <div class="menu-item" :style="layoutSize === 'default' ? {paddingTop: '10px'} : {paddingTop: '2px'}">
6
- <p class="menu-icon"><Icon :type="item.icon" :size="20"></Icon></p>
7
- <p class="menu-txt" :title="item.name">{{ item.name }}</p>
8
- </div>
9
- </li>
10
- </ul>
11
- </div>
12
- </template>
13
-
14
- <script>
15
- import Bus from '@lambo-design/shared/utils/bus'
16
- import { deepCopy } from '@lambo-design/shared/utils/assist'
17
-
18
- export default {
19
- props: {
20
- acceptInt: {
21
- type: Number,
22
- default: 0
23
- },
24
- topMenListNum: {
25
- type: Number,
26
- default: 0
27
- }
28
- },
29
- data() {
30
- return {
31
- systemInfo:{},
32
- pointer:0,
33
- flag:true,
34
- arrowFlag: true,
35
- acceptAppId: '',
36
- navList: [],
37
- topMenList: [],
38
- topTqmMenList:[],
39
- otherList: [],
40
- activeName: '',
41
- topMenuNum: 7,
42
- lastTopMenuNum:-1,
43
- originMenuList: [],
44
- layoutSize:"default"
45
- }
46
- },
47
- methods: {
48
- initListener() {
49
- Bus.$on('system-info',(data) => {
50
- this.initSystemInfo(data);
51
- })
52
- Bus.$on('nav-list', (data) => {
53
- this.initNav(data)
54
- })
55
- Bus.$on('change-app', ({ appId, appInfo }) => {
56
- this.changeApp(appId, appInfo)
57
- })
58
- },
59
- destroyListener() {
60
- Bus.$off('system-info')
61
- Bus.$off('nav-list')
62
- Bus.$off('change-app')
63
- },
64
- initSystemInfo(data) {
65
- if (data) {
66
- this.layoutSize = data.layoutSize ? data.layoutSize : 'default';
67
- this.topMenuNum = data.topMenu ? data.topMenu : 4;
68
- this.acceptAppId = data.acceptAppId ? data.acceptAppId : '';
69
- if (!this.activeName) {
70
- this.activeName = this.acceptAppId
71
- }
72
- this.initNav(this.navList)
73
- }
74
- },
75
- initNav(data) {
76
- if (data.toString() === this.navList.toString() && this.topMenuNum === this.lastTopMenuNum) {
77
- return
78
- }
79
- this.navList = data
80
- this.lastTopMenuNum = this.topMenuNum
81
- if (data.length > this.topMenuNum) {
82
- let navList = deepCopy(data)
83
- this.topMenList = navList
84
- this.$emit('topMen-list', this.topMenList);
85
- this.$emit('topMen-num', this.topMenuNum);
86
- this.$emit('topMen-true', true);
87
- // this.topMenList = navList.splice(0, this.topMenuNum)
88
- // this.otherList = navList
89
- } else {
90
- this.topMenList = this.navList
91
- this.$emit('topMen-true', false);
92
- }
93
- if (this.topMenList.length > 0) {
94
- let appId = this.topMenList[0].appId
95
- for (let i = 0; i < this.topMenList.length; i++) {
96
- if (this.topMenList[i].selected == true) {
97
- appId = this.topMenList[i].appId
98
- }
99
- }
100
- if (this.activeName) {
101
- appId = this.activeName
102
- }
103
- this.selectApp(appId)
104
- }
105
- },
106
- selectApp(appId) {
107
- if (appId) {
108
- this.activeName = appId
109
- let res = this.navList.filter(app => app.appId == appId)
110
- Bus.$emit('change-app', { appId, appInfo: res[0] })
111
- }
112
- },
113
- changeApp(appId, appInfo){
114
- if (appId) {
115
- this.activeName = appId
116
- }
117
- }
118
- },
119
- watch: {
120
- acceptInt(val){
121
- this.pointer = val;
122
- }
123
- },
124
- created() {
125
- this.initListener()
126
- },
127
- beforeDestroy() {
128
- this.destroyListener()
129
- }
130
- }
131
- </script>
132
-
133
- <style scoped lang="less">
134
- @import '@lambo-design/core/src/styles/default.less';
135
- .menu-list {
136
- height: 100%;
137
- line-height: 24px;
138
- //color: #ffffff;
139
- cursor: pointer;
140
- font-size: 16px;
141
- margin-left: 15px;
142
- .top-menu {
143
- overflow: hidden;
144
- .top-menu-item {
145
- padding-left: 15px;
146
- padding-right: 15px;
147
- position: relative;
148
- height: 100%;
149
- //color: #FFFFFF;
150
- list-style: none;
151
- float: left;
152
- &:hover {
153
- //background: transparent;
154
- .menu-item {
155
- //color: #fff;
156
- }
157
- }
158
- &.active {
159
- //background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0)) !important;
160
- //border-bottom: 2px solid var(--primary-color-tint-5, @_primary-color-tint-5);
161
- .menu-item {
162
- //color: #fff;
163
- width: 135px;
164
- }
165
- }
166
- .menu-item {
167
- display: flex;
168
- margin-top: 10px;
169
- padding-right: 10px;
170
- width: 135px;
171
-
172
- }
173
- .menu-icon {
174
- height: 20px;
175
- line-height: 20px;
176
- text-align: center;
177
- margin-right: 10px;
178
- margin-left: 10px;
179
- margin-top: 3px;
180
- }
181
- .menu-txt {
182
- text-align: center;
183
- font-size: 14px;
184
- line-height: 2;
185
- width: 135px;
186
- white-space: nowrap;
187
- overflow: hidden;
188
- text-overflow: ellipsis;
189
- }
190
- }
191
- }
192
- }
193
- </style>
1
+ <template>
2
+ <div class="menu-list" >
3
+ <ul class="top-menu" :style="layoutSize === 'default' ? {height: '64px'} : {height: '50px'}" ref="topNav">
4
+ <li class="top-menu-item" v-show="pointer <= index && index < pointer + topMenuNum && flag" :class="{ 'active': activeName === item.appId }" v-for="(item,index) in topMenList" :key="item.appId" @click="selectApp(item.appId)">
5
+ <div class="menu-item" :style="layoutSize === 'default' ? {paddingTop: '10px'} : {paddingTop: '2px'}">
6
+ <p class="menu-icon"><Icon :type="item.icon" :size="20"></Icon></p>
7
+ <p class="menu-txt" :title="item.name">{{ item.name }}</p>
8
+ </div>
9
+ </li>
10
+ </ul>
11
+ </div>
12
+ </template>
13
+
14
+ <script>
15
+ import Bus from '@lambo-design/shared/utils/bus'
16
+ import { deepCopy } from '@lambo-design/shared/utils/assist'
17
+
18
+ export default {
19
+ props: {
20
+ acceptInt: {
21
+ type: Number,
22
+ default: 0
23
+ },
24
+ topMenListNum: {
25
+ type: Number,
26
+ default: 0
27
+ }
28
+ },
29
+ data() {
30
+ return {
31
+ systemInfo:{},
32
+ pointer:0,
33
+ flag:true,
34
+ arrowFlag: true,
35
+ acceptAppId: '',
36
+ navList: [],
37
+ topMenList: [],
38
+ topTqmMenList:[],
39
+ otherList: [],
40
+ activeName: '',
41
+ topMenuNum: 7,
42
+ lastTopMenuNum:-1,
43
+ originMenuList: [],
44
+ layoutSize:"default"
45
+ }
46
+ },
47
+ methods: {
48
+ initListener() {
49
+ Bus.$on('system-info',(data) => {
50
+ this.initSystemInfo(data);
51
+ })
52
+ Bus.$on('nav-list', (data) => {
53
+ this.initNav(data)
54
+ })
55
+ Bus.$on('change-app', ({ appId, appInfo }) => {
56
+ this.changeApp(appId, appInfo)
57
+ })
58
+ },
59
+ destroyListener() {
60
+ Bus.$off('system-info')
61
+ Bus.$off('nav-list')
62
+ Bus.$off('change-app')
63
+ },
64
+ initSystemInfo(data) {
65
+ if (data) {
66
+ this.layoutSize = data.layoutSize ? data.layoutSize : 'default';
67
+ this.topMenuNum = data.topMenu ? data.topMenu : 4;
68
+ this.acceptAppId = data.acceptAppId ? data.acceptAppId : '';
69
+ if (!this.activeName) {
70
+ this.activeName = this.acceptAppId
71
+ }
72
+ this.initNav(this.navList)
73
+ }
74
+ },
75
+ initNav(data) {
76
+ if (data.toString() === this.navList.toString() && this.topMenuNum === this.lastTopMenuNum) {
77
+ return
78
+ }
79
+ this.navList = data
80
+ this.lastTopMenuNum = this.topMenuNum
81
+ if (data.length > this.topMenuNum) {
82
+ let navList = deepCopy(data)
83
+ this.topMenList = navList
84
+ this.$emit('topMen-list', this.topMenList);
85
+ this.$emit('topMen-num', this.topMenuNum);
86
+ this.$emit('topMen-true', true);
87
+ // this.topMenList = navList.splice(0, this.topMenuNum)
88
+ // this.otherList = navList
89
+ } else {
90
+ this.topMenList = this.navList
91
+ this.$emit('topMen-true', false);
92
+ }
93
+ if (this.topMenList.length > 0) {
94
+ let appId = this.topMenList[0].appId
95
+ for (let i = 0; i < this.topMenList.length; i++) {
96
+ if (this.topMenList[i].selected == true) {
97
+ appId = this.topMenList[i].appId
98
+ }
99
+ }
100
+ if (this.activeName) {
101
+ appId = this.activeName
102
+ }
103
+ this.selectApp(appId)
104
+ }
105
+ },
106
+ selectApp(appId) {
107
+ if (appId) {
108
+ this.activeName = appId
109
+ let res = this.navList.filter(app => app.appId == appId)
110
+ Bus.$emit('change-app', { appId, appInfo: res[0] })
111
+ }
112
+ },
113
+ changeApp(appId, appInfo){
114
+ if (appId) {
115
+ this.activeName = appId
116
+ }
117
+ }
118
+ },
119
+ watch: {
120
+ acceptInt(val){
121
+ this.pointer = val;
122
+ }
123
+ },
124
+ created() {
125
+ this.initListener()
126
+ },
127
+ beforeDestroy() {
128
+ this.destroyListener()
129
+ }
130
+ }
131
+ </script>
132
+
133
+ <style scoped lang="less">
134
+ @import '@lambo-design/core/src/styles/default.less';
135
+ .menu-list {
136
+ height: 100%;
137
+ line-height: 24px;
138
+ //color: #ffffff;
139
+ cursor: pointer;
140
+ font-size: 16px;
141
+ margin-left: 15px;
142
+ .top-menu {
143
+ overflow: hidden;
144
+ .top-menu-item {
145
+ padding-left: 15px;
146
+ padding-right: 15px;
147
+ position: relative;
148
+ height: 100%;
149
+ //color: #FFFFFF;
150
+ list-style: none;
151
+ float: left;
152
+ &:hover {
153
+ //background: transparent;
154
+ .menu-item {
155
+ //color: #fff;
156
+ }
157
+ }
158
+ &.active {
159
+ //background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0)) !important;
160
+ //border-bottom: 2px solid var(--primary-color-tint-5, @_primary-color-tint-5);
161
+ .menu-item {
162
+ //color: #fff;
163
+ width: 135px;
164
+ }
165
+ }
166
+ .menu-item {
167
+ display: flex;
168
+ margin-top: 10px;
169
+ padding-right: 10px;
170
+ width: 135px;
171
+
172
+ }
173
+ .menu-icon {
174
+ height: 20px;
175
+ line-height: 20px;
176
+ text-align: center;
177
+ margin-right: 10px;
178
+ margin-left: 10px;
179
+ margin-top: 3px;
180
+ }
181
+ .menu-txt {
182
+ text-align: center;
183
+ font-size: 14px;
184
+ line-height: 2;
185
+ width: 135px;
186
+ white-space: nowrap;
187
+ overflow: hidden;
188
+ text-overflow: ellipsis;
189
+ }
190
+ }
191
+ }
192
+ }
193
+ </style>
@@ -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>
@@ -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>
@@ -169,13 +169,14 @@ export default {
169
169
  <style lang="less" scoped>
170
170
  @import "@lambo-design/core/src/styles/default.less";
171
171
  .search-fast-con{
172
+ width: 100%;
173
+ position: absolute;
174
+ top: 0px;
175
+ z-index: 1000;
172
176
  .search-fast-con-side{
173
177
  width: 100%;
174
- position: absolute;
175
- top: 0px;
176
- z-index: 1000;
177
178
  .sideInput{
178
- width: 240px;
179
+ width: 100%;
179
180
  padding: 3px 0 4px 0;
180
181
  transform: translateX(-14px);
181
182
  /deep/.ivu-icon{
@@ -186,7 +187,7 @@ export default {
186
187
  }
187
188
  /deep/.ivu-input{
188
189
  font-size: 14px;
189
- width: 240px;
190
+ width: 100%;
190
191
  height: 40px;
191
192
  font-weight: 400;
192
193
  border: none;
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <div class="pro-layout-sider-wrapper" :class="[collapsed ? 'menu-has-collapsed' : '']">
2
+ <div ref="listenWidth" class="pro-layout-sider-wrapper" :class="[collapsed ? 'menu-has-collapsed' : '']">
3
3
  <Menu v-show="!collapsed" ref="menu"
4
4
  :accordion="accordion" :active-name="activeName"
5
5
  :open-names="openedNames" theme="dark"
@@ -50,8 +50,9 @@
50
50
  </template>
51
51
  </Menu>
52
52
 
53
- <ProLayoutSiderOtherMenu :collapsed="collapsed" @select-menu="selectMenu"></ProLayoutSiderOtherMenu>
53
+ <ProLayoutSiderOtherMenu :style="{width:otherWidth}" :collapsed="collapsed" @select-menu="selectMenu"></ProLayoutSiderOtherMenu>
54
54
  <ProLayoutSiderSearch
55
+ :style="{width:otherWidth}"
55
56
  v-show="!collapsed"
56
57
  :searchType="0"
57
58
  @select-menu="selectMenu"
@@ -113,6 +114,7 @@ export default {
113
114
  data(){
114
115
  return {
115
116
  show: false,
117
+ otherWidth:'',
116
118
  originalAllMenuList: [],
117
119
  navList: [],
118
120
  originMenuList:[],
@@ -243,9 +245,9 @@ export default {
243
245
  },100)
244
246
  },
245
247
  handleSelect(name,uri,pid){
246
- if (this.activeName == name) {
248
+ /*if (this.activeName == name) {
247
249
  return;
248
- }
250
+ }*/
249
251
  let menu = null;
250
252
  if (name.indexOf("isTurnByHref_") > -1) {
251
253
  name = name.replace("isTurnByHref_","");
@@ -255,7 +257,24 @@ export default {
255
257
  }
256
258
  let tagList = this.tagList;
257
259
  if (menu && menu.name) {
258
- if (!tagExists(tagList,menu.name)) {
260
+ if (isOpenBlank(menu)) {
261
+ Bus.$emit('menu-click', menu.name , menu)
262
+ } else {
263
+ let tag = tagList.find(item => item.name == menu.name);
264
+ if (!tag) {
265
+ tag = {}
266
+ }
267
+ if ('home' != menu.name) {
268
+ let res = tagList.filter(item => item.name !== menu.name);
269
+ menu.cts = new Date().getTime();
270
+ tag = Object.assign(tag, menu);
271
+ res.push(tag);
272
+ tagList = deepCopy(res);
273
+ }
274
+ Bus.$emit('tag-list', tagList, menu.name)
275
+ }
276
+
277
+ /*if (!tagExists(tagList,menu.name)) {
259
278
  if (!isOpenBlank(menu)) {
260
279
  tagList.push(menu);
261
280
  } else {
@@ -265,14 +284,15 @@ export default {
265
284
  let tag = tagList.find(item => item.name == menu.name);
266
285
  if ('home' != menu.name) {
267
286
  let res = tagList.filter(item => item.name !== menu.name);
287
+ menu.cts = new Date().getTime();
268
288
  tag = Object.assign(tag, menu);
269
289
  res.push(tag);
270
290
  tagList = deepCopy(res);
271
291
  }
272
292
  }
273
- Bus.$emit('tag-list', tagList, menu.name)
293
+ Bus.$emit('tag-list', tagList, menu.name)*/
274
294
  }
275
- if (menu.meta && Array.isArray(menu.meta.crumbs)) {
295
+ /*if (menu.meta && Array.isArray(menu.meta.crumbs)) {
276
296
  let parentMenu = menu.meta.crumbs[0]
277
297
  this.$set(this, 'selectedTopParent', parentMenu.name);
278
298
  } else {
@@ -291,7 +311,7 @@ export default {
291
311
  this.openedNames = [parentName]; // 设置最外层父菜单为展开状态
292
312
  this.activeName = menu.name; // 设置当前菜单为激活状态
293
313
  }
294
- }
314
+ }*/
295
315
  },
296
316
  getTopParent(menu) {
297
317
  return menu.parent ? this.getTopParent(menu.parent) : menu.name;
@@ -338,6 +358,10 @@ export default {
338
358
  }
339
359
  return openNames
340
360
  },
361
+ handleResize() {
362
+ const targetElement = this.$refs.listenWidth; // 获取 DOM 元素的引用
363
+ this.otherWidth = targetElement.clientWidth+'px'; // 获取 div 元素的宽度
364
+ }
341
365
  },
342
366
  watch:{
343
367
  activeName(){
@@ -350,11 +374,16 @@ export default {
350
374
  })
351
375
  }
352
376
  },
377
+ mounted() {
378
+ window.addEventListener('resize', this.handleResize); // 监听窗口大小变化事件
379
+ this.handleResize(); // 初始化时获取一次宽度
380
+ },
353
381
  created(){
354
382
  this.initListener();
355
383
  },
356
384
  beforeDestroy(){
357
385
  this.destroyListener();
386
+ window.removeEventListener('resize', this.handleResize); // 在组件销毁前移除事件监听器,以防止内存泄漏
358
387
  }
359
388
 
360
389
  }
package/src/index.vue CHANGED
@@ -341,6 +341,10 @@ export default {
341
341
  overflow-y: scroll;
342
342
  margin-right: -18px;
343
343
  }
344
+ .ivu-layout-sider-children::-webkit-scrollbar {
345
+ /* 隐藏默认的滚动条 */
346
+ display: none;
347
+ }
344
348
  }
345
349
  .pro-layout-content{
346
350
  .pro-layout-content-layout{
@@ -389,6 +393,10 @@ export default {
389
393
  .ivu-layout-sider-children{
390
394
  height: calc(100vh - 50px);
391
395
  }
396
+ .ivu-layout-sider-children::-webkit-scrollbar {
397
+ /* 隐藏默认的滚动条 */
398
+ display: none;
399
+ }
392
400
  }
393
401
  .pro-layout-content{
394
402
  .pro-layout-content-layout{