@opendesign-plus-test/components 0.0.1-rc.34 → 0.0.1-rc.36
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/dist/chunk-OElCookieNotice.cjs.js +1 -1
- package/dist/chunk-OElCookieNotice.es.js +60 -54
- package/dist/components/OHeaderUser.vue.d.ts +2 -0
- package/dist/components/activity/composables/useActivityConfig.d.ts +17 -0
- package/dist/components/activity/config.d.ts +0 -14
- package/dist/components/header/OHeader.vue.d.ts +8 -2
- package/dist/components/header/OHeaderMobile.vue.d.ts +171 -0
- package/dist/components/header/components/HeaderContent.vue.d.ts +8 -1
- package/dist/components/header/components/HeaderNav.vue.d.ts +13 -1
- package/dist/components/header/components/HeaderNavMobile.vue.d.ts +33 -0
- package/dist/components/header/index.d.ts +128 -5
- package/dist/components/header/types.d.ts +80 -0
- package/dist/components/meeting/OMeetingCalendar.vue.d.ts +1 -0
- package/dist/components/meeting/composables/useMeetingConfig.d.ts +14 -0
- package/dist/components/meeting/config.d.ts +1 -16
- package/dist/components/meeting/types.d.ts +2 -0
- package/dist/components/meeting/utils.d.ts +1 -15
- package/dist/components.cjs.js +39 -39
- package/dist/components.css +1 -1
- package/dist/components.es.js +10107 -10368
- package/package.json +2 -2
- package/src/components/OHeaderUser.vue +4 -4
- package/src/components/OSourceCode.vue +1 -1
- package/src/components/activity/OActivityApproval.vue +3 -4
- package/src/components/activity/OActivityForm.vue +7 -6
- package/src/components/activity/OMyActivityCalendar.vue +11 -12
- package/src/components/activity/composables/useActivityConfig.ts +143 -0
- package/src/components/activity/config.ts +1 -141
- package/src/components/header/OHeader.vue +6 -24
- package/src/components/header/OHeaderMobile.vue +177 -0
- package/src/components/header/components/HeaderContent.vue +190 -11
- package/src/components/header/components/HeaderNav.vue +3 -5
- package/src/components/header/components/HeaderNavMobile.vue +377 -0
- package/src/components/header/index.ts +5 -5
- package/src/components/header/types.ts +91 -0
- package/src/components/meeting/OMeetingCalendar.vue +41 -45
- package/src/components/meeting/OMeetingForm.vue +11 -18
- package/src/components/meeting/OMyMeetingCalendar.vue +9 -9
- package/src/components/meeting/OSigMeetingCalendar.vue +5 -6
- package/src/components/meeting/components/OMeetingCalendarList.vue +28 -37
- package/src/components/meeting/components/OMeetingDetail.vue +13 -12
- package/src/components/meeting/components/OSigMeetingAside.vue +4 -1
- package/src/components/meeting/composables/useMeetingConfig.ts +108 -0
- package/src/components/meeting/config.ts +13 -75
- package/src/components/meeting/index.ts +1 -1
- package/src/components/meeting/types.ts +2 -0
- package/src/components/meeting/utils.ts +3 -56
- package/src/i18n/en.ts +20 -17
- package/src/i18n/zh.ts +5 -2
- package/dist/components/header/OHeaderMoblie.vue.d.ts +0 -33
- package/dist/components/header/components/HeaderNavMoblie.vue.d.ts +0 -17
- package/dist/components/header/components/HeaderUbmcNav.vue.d.ts +0 -2
- package/src/components/header/OHeaderMoblie.vue +0 -152
- package/src/components/header/components/HeaderNavMoblie.vue +0 -346
- package/src/components/header/components/HeaderUbmcNav.vue +0 -540
|
@@ -1,15 +1,6 @@
|
|
|
1
1
|
import dayjs from 'dayjs';
|
|
2
|
-
import {
|
|
3
|
-
import { INTERVAL_MONTH, INTERVAL_WEEK, INTERVAL_WEEK_OPTIONS, MEETING_TABS } from './config';
|
|
4
|
-
import { CalendarDataType, meetingTabT, OptionItemT } from '@/components/meeting/types.ts';
|
|
2
|
+
import { OptionItemT } from './types';
|
|
5
3
|
|
|
6
|
-
const { t } = useI18n();
|
|
7
|
-
/**
|
|
8
|
-
* 格式化时间
|
|
9
|
-
* @param {string} date 时间
|
|
10
|
-
* @param {string} format 时间格式
|
|
11
|
-
* @returns {string} 返回
|
|
12
|
-
*/
|
|
13
4
|
export const formatDate = (date: string | Date = new Date(), format: string = 'YYYY-MM-DD'): string => {
|
|
14
5
|
let dateStr = date;
|
|
15
6
|
if (!dateStr) {
|
|
@@ -25,34 +16,14 @@ export const findLabelFromOptions = (value: string | number, options: OptionItem
|
|
|
25
16
|
const find = options.find((o) => o[valueKey] === value);
|
|
26
17
|
return find?.[labelKey] || value;
|
|
27
18
|
};
|
|
28
|
-
|
|
29
|
-
if (cycleType === INTERVAL_WEEK) {
|
|
30
|
-
return points
|
|
31
|
-
.sort((a, b) => {
|
|
32
|
-
const aIdx = INTERVAL_WEEK_OPTIONS.findIndex((v) => v.value === a);
|
|
33
|
-
const bIdx = INTERVAL_WEEK_OPTIONS.findIndex((v) => v.value === b);
|
|
34
|
-
return aIdx - bIdx;
|
|
35
|
-
})
|
|
36
|
-
.map((point: number) => findLabelFromOptions(point, INTERVAL_WEEK_OPTIONS))
|
|
37
|
-
.join(t('meeting.cycleSplit'));
|
|
38
|
-
}
|
|
39
|
-
if (cycleType === INTERVAL_MONTH) {
|
|
40
|
-
return points.join(t('meeting.cycleSplit'));
|
|
41
|
-
}
|
|
42
|
-
return '';
|
|
43
|
-
};
|
|
44
|
-
// 处理发言人的序号
|
|
19
|
+
|
|
45
20
|
export const speakerNum = (val: string) => {
|
|
46
21
|
const regex = /\d+/g;
|
|
47
22
|
const match = val.match(regex) || '';
|
|
48
23
|
|
|
49
24
|
return parseInt(match[0]);
|
|
50
25
|
};
|
|
51
|
-
|
|
52
|
-
* 将时间转换为秒数
|
|
53
|
-
* @param {string} date 时间 hh:mm:ss
|
|
54
|
-
* @returns {number}
|
|
55
|
-
*/
|
|
26
|
+
|
|
56
27
|
export const getDateNumber = (date: string) => {
|
|
57
28
|
const arr: string[] = date.split(':');
|
|
58
29
|
if (arr.length > 3 || !arr.length) {
|
|
@@ -82,7 +53,6 @@ export const formatDateNumber = (num: number) => {
|
|
|
82
53
|
return `${ formatNumber(h) }:${ formatNumber(m) }:${ formatNumber(s) }`;
|
|
83
54
|
};
|
|
84
55
|
|
|
85
|
-
// 时分秒 转换成 以秒为单位的格式 - xx秒
|
|
86
56
|
export const transformTime = (time: string) => {
|
|
87
57
|
const arr = time.split(':');
|
|
88
58
|
const hh = arr[arr.length - 3] ? parseInt(arr[arr.length - 3]) : 0;
|
|
@@ -92,32 +62,9 @@ export const transformTime = (time: string) => {
|
|
|
92
62
|
return hh * 60 * 60 + mm * 60 + ss;
|
|
93
63
|
};
|
|
94
64
|
|
|
95
|
-
// 以秒为单位的格式 转换成 时分秒 - hh:mm:ss
|
|
96
65
|
export const transformSeconds = (seconds: number) => {
|
|
97
66
|
const hh = Math.floor(seconds / 3600);
|
|
98
67
|
const mm = Math.floor((seconds - hh * 3600) / 60);
|
|
99
68
|
const ss = Math.floor(seconds - hh * 3600 - mm * 60);
|
|
100
69
|
return `${ hh ? `${ hh.toString().padStart(2, '0') }:` : '' }${ mm.toString().padStart(2, '0') }:${ ss.toString().padStart(2, '0') }`;
|
|
101
|
-
};
|
|
102
|
-
|
|
103
|
-
export const getConfig = (val: CalendarDataType, key: keyof meetingTabT): string => {
|
|
104
|
-
let value = val;
|
|
105
|
-
if (val === CalendarDataType.ACTIVITY) {
|
|
106
|
-
value = CalendarDataType.EVENTS;
|
|
107
|
-
}
|
|
108
|
-
const find: meetingTabT = MEETING_TABS.find(v => v.value === value)!;
|
|
109
|
-
return find?.[key] || '';
|
|
110
|
-
};
|
|
111
|
-
|
|
112
|
-
export const getPlatformLabel = (platform: string) => {
|
|
113
|
-
switch (platform) {
|
|
114
|
-
case 'WELINK':
|
|
115
|
-
return 'WeLink';
|
|
116
|
-
case 'ZOOM':
|
|
117
|
-
return 'Zoom';
|
|
118
|
-
case 'TENCENT':
|
|
119
|
-
return '腾讯会议';
|
|
120
|
-
default:
|
|
121
|
-
return platform;
|
|
122
|
-
}
|
|
123
70
|
};
|
package/src/i18n/en.ts
CHANGED
|
@@ -39,8 +39,8 @@ export default {
|
|
|
39
39
|
'meeting.myMeeting': 'My Meetings',
|
|
40
40
|
'meeting.meetingCancel': '[{0}] meeting canceled.',
|
|
41
41
|
'meeting.todayNonMeeting': 'No meetings scheduled for today.',
|
|
42
|
-
'meeting.online': '
|
|
43
|
-
'meeting.offline': '
|
|
42
|
+
'meeting.online': 'Online',
|
|
43
|
+
'meeting.offline': 'Offline',
|
|
44
44
|
'meeting.meetingSingle': 'This meeting',
|
|
45
45
|
'meeting.meetingCycle': 'All recurring meetings',
|
|
46
46
|
'meeting.bookMeeting': 'Book Meeting',
|
|
@@ -122,7 +122,7 @@ export default {
|
|
|
122
122
|
'meeting.meetingTypeSummit': 'Summit',
|
|
123
123
|
'meeting.allSigs': 'All SIGs',
|
|
124
124
|
'meeting.allGroups': 'All Groups',
|
|
125
|
-
'meeting.meetingCreator': '
|
|
125
|
+
'meeting.meetingCreator': 'Convener',
|
|
126
126
|
'meeting.meetingDate2': 'Time',
|
|
127
127
|
'meeting.meetingId': 'Meeting ID',
|
|
128
128
|
'meeting.meetingLink': 'Meeting Link',
|
|
@@ -175,6 +175,7 @@ export default {
|
|
|
175
175
|
'meeting.enterActivityName': 'Enter a name',
|
|
176
176
|
'meeting.activityOrganizer': 'Organizer',
|
|
177
177
|
'meeting.selectActivityOrganizer': 'Select organizer',
|
|
178
|
+
'meeting.activityDetail2': 'Details',
|
|
178
179
|
'meeting.activityType': 'Event Type',
|
|
179
180
|
'meeting.selectActivityType': 'Select type',
|
|
180
181
|
'meeting.activityTime': 'Event Time',
|
|
@@ -234,28 +235,30 @@ export default {
|
|
|
234
235
|
'meeting.reviewed': 'Reviewed',
|
|
235
236
|
'meeting.activityActionSuccess': '"{0}" {1} successful',
|
|
236
237
|
'meeting.activityActionFail': '"{0}" {1} failed',
|
|
237
|
-
'meeting.activityNameMaxLength': '
|
|
238
|
-
'meeting.selectActivityTime': 'Select
|
|
239
|
-
'meeting.selectActivityDate': 'Select
|
|
238
|
+
'meeting.activityNameMaxLength': 'Event name cannot exceed 50 characters',
|
|
239
|
+
'meeting.selectActivityTime': 'Select event time',
|
|
240
|
+
'meeting.selectActivityDate': 'Select event date',
|
|
240
241
|
'meeting.activityTimeRange': 'Start and end time must be between 8:00-22:00',
|
|
241
242
|
'meeting.endDateAfterStartDate': 'End date must be after start date',
|
|
242
243
|
'meeting.registerDeadlineBeforeEnd': 'Registration deadline must be before end date',
|
|
243
|
-
'meeting.enterActivityAddress': 'Enter
|
|
244
|
-
'meeting.activityAddressMaxLength': '
|
|
244
|
+
'meeting.enterActivityAddress': 'Enter event location',
|
|
245
|
+
'meeting.activityAddressMaxLength': 'Event location cannot exceed 255 characters',
|
|
245
246
|
'meeting.invalidRegistrationUrl': 'Enter a valid registration URL',
|
|
246
|
-
'meeting.invalidActivityDetailUrl': 'Enter a valid
|
|
247
|
-
'meeting.activityContentMaxLength': '
|
|
248
|
-
'meeting.revokeActivitySuccess': '"{0}"
|
|
249
|
-
'meeting.revokeActivityFail': '"{0}"
|
|
250
|
-
'meeting.submitReviewSuccess': '"{0}"
|
|
251
|
-
'meeting.submitReviewFail': '"{0}"
|
|
252
|
-
'meeting.deleteActivitySuccess': '"{0}"
|
|
253
|
-
'meeting.deleteActivityFail': '"{0}"
|
|
247
|
+
'meeting.invalidActivityDetailUrl': 'Enter a valid event detail URL',
|
|
248
|
+
'meeting.activityContentMaxLength': 'Event content cannot exceed 1000 characters',
|
|
249
|
+
'meeting.revokeActivitySuccess': '"{0}" event review withdrawn successfully',
|
|
250
|
+
'meeting.revokeActivityFail': '"{0}" event review withdrawal failed',
|
|
251
|
+
'meeting.submitReviewSuccess': '"{0}" event submitted for review successfully',
|
|
252
|
+
'meeting.submitReviewFail': '"{0}" event submission failed',
|
|
253
|
+
'meeting.deleteActivitySuccess': '"{0}" event deleted successfully',
|
|
254
|
+
'meeting.deleteActivityFail': '"{0}" event deletion failed',
|
|
254
255
|
'meeting.loading': 'Loading...',
|
|
255
|
-
'meeting.confirmRevokeActivity': 'Are you sure you want to withdraw "{0}"
|
|
256
|
+
'meeting.confirmRevokeActivity': 'Are you sure you want to withdraw "{0}" event? After withdrawal, the event will become a draft.',
|
|
256
257
|
'events.status': 'Status',
|
|
257
258
|
'events.statusAll': 'All',
|
|
258
259
|
'events.statusIng': 'Progress',
|
|
259
260
|
'events.statusFinish': 'Finish',
|
|
260
261
|
'events.searchPlaceholder': 'Enter search...',
|
|
262
|
+
'common.collapse': 'Collapse',
|
|
263
|
+
'common.expand': 'Expand',
|
|
261
264
|
};
|
package/src/i18n/zh.ts
CHANGED
|
@@ -165,6 +165,7 @@ export default {
|
|
|
165
165
|
'meeting.activityOrganizer': '活动主办方',
|
|
166
166
|
'meeting.selectActivityOrganizer': '请选择活动主办方',
|
|
167
167
|
'meeting.activityType': '活动类型',
|
|
168
|
+
'meeting.activityDetail2': '活动详情',
|
|
168
169
|
'meeting.selectActivityType': '请选择活动类型',
|
|
169
170
|
'meeting.activityTime': '活动时间',
|
|
170
171
|
'meeting.selectActivityStartDate': '请选择活动起始日期',
|
|
@@ -201,14 +202,14 @@ export default {
|
|
|
201
202
|
'meeting.rejectReview': '审核驳回',
|
|
202
203
|
'meeting.reviewNotes': '审核备注',
|
|
203
204
|
'meeting.enterReviewNotes': '请输入审核的备注信息',
|
|
204
|
-
'meeting.confirmCancelActivity': '确定取消"
|
|
205
|
+
'meeting.confirmCancelActivity': '确定取消"{0}"活动?取消后将不会在会议首页呈现,且已报名的数据也会被清空,请谨慎操作。',
|
|
205
206
|
'meeting.confirmBtn': '确定',
|
|
206
207
|
'meeting.activityDetail': '活动详情',
|
|
207
208
|
'meeting.modifyActivity': '修改活动',
|
|
208
209
|
'meeting.withdrawReview': '撤销审核',
|
|
209
210
|
'meeting.deleteActivity': '删除活动',
|
|
210
211
|
'meeting.submitReview': '提交审核',
|
|
211
|
-
'meeting.confirmDeleteActivity': '确定删除"
|
|
212
|
+
'meeting.confirmDeleteActivity': '确定删除"{0}"活动?删除后记录将不再我的个人中心呈现。',
|
|
212
213
|
'meeting.registerNow': '我要报名',
|
|
213
214
|
'meeting.onlineOffline': '线上与线下',
|
|
214
215
|
'meeting.statusDraft': '草稿',
|
|
@@ -247,4 +248,6 @@ export default {
|
|
|
247
248
|
'events.statusIng': '进行中',
|
|
248
249
|
'events.statusFinish': '已结束',
|
|
249
250
|
'events.searchPlaceholder': '搜索活动名称、地点',
|
|
251
|
+
'common.collapse': '收起',
|
|
252
|
+
'common.expand': '展开',
|
|
250
253
|
};
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
export interface OHeaderT {
|
|
2
|
-
(e: 'go-back'): void;
|
|
3
|
-
(e: 'go-home'): void;
|
|
4
|
-
}
|
|
5
|
-
declare function __VLS_template(): {
|
|
6
|
-
attrs: Partial<{}>;
|
|
7
|
-
slots: {
|
|
8
|
-
rightConfig?(_: {}): any;
|
|
9
|
-
tool?(_: {}): any;
|
|
10
|
-
logo?(_: {}): any;
|
|
11
|
-
toolbar?(_: {}): any;
|
|
12
|
-
};
|
|
13
|
-
refs: {
|
|
14
|
-
mobileNav: import('../../../vue/dist/vue.esm-bundler.js').CreateComponentPublicInstanceWithMixins<Record<string, any> & {}, {}, {}, {}, {}, import('../../../vue/dist/vue.esm-bundler.js').ComponentOptionsMixin, import('../../../vue/dist/vue.esm-bundler.js').ComponentOptionsMixin, {}, import('../../../vue/dist/vue.esm-bundler.js').PublicProps, {}, false, {}, {}, {}, {}, string, {}, any, import('../../../vue/dist/vue.esm-bundler.js').ComponentProvideOptions, {
|
|
15
|
-
P: {};
|
|
16
|
-
B: {};
|
|
17
|
-
D: {};
|
|
18
|
-
C: {};
|
|
19
|
-
M: {};
|
|
20
|
-
Defaults: {};
|
|
21
|
-
}, Record<string, any> & {}, {}, {}, {}, {}, {}> | null;
|
|
22
|
-
};
|
|
23
|
-
rootEl: HTMLDivElement;
|
|
24
|
-
};
|
|
25
|
-
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
26
|
-
declare const __VLS_component: import('../../../vue/dist/vue.esm-bundler.js').DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import('../../../vue/dist/vue.esm-bundler.js').PublicProps>;
|
|
27
|
-
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
28
|
-
export default _default;
|
|
29
|
-
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
30
|
-
new (): {
|
|
31
|
-
$slots: S;
|
|
32
|
-
};
|
|
33
|
-
};
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
declare function __VLS_template(): {
|
|
2
|
-
attrs: Partial<{}>;
|
|
3
|
-
slots: {
|
|
4
|
-
tool?(_: {}): any;
|
|
5
|
-
};
|
|
6
|
-
refs: {};
|
|
7
|
-
rootEl: HTMLDivElement;
|
|
8
|
-
};
|
|
9
|
-
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
10
|
-
declare const __VLS_component: import('../../../../vue/dist/vue.esm-bundler.js').DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import('../../../../vue/dist/vue.esm-bundler.js').PublicProps>;
|
|
11
|
-
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
12
|
-
export default _default;
|
|
13
|
-
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
14
|
-
new (): {
|
|
15
|
-
$slots: S;
|
|
16
|
-
};
|
|
17
|
-
};
|
|
@@ -1,152 +0,0 @@
|
|
|
1
|
-
<script setup lang="ts">
|
|
2
|
-
import { ref } from 'vue';
|
|
3
|
-
import { OIcon, OIconArrowLeft } from '@opensig/opendesign';
|
|
4
|
-
|
|
5
|
-
import ContentWrapper from '../common/ContentWrapper.vue';
|
|
6
|
-
import HeaderNavMoblie from './components/HeaderNavMoblie.vue';
|
|
7
|
-
|
|
8
|
-
import IconClose from '~icons/components/icon-close.svg';
|
|
9
|
-
import IconMenu from '~icons/components/icon-header-menu.svg';
|
|
10
|
-
|
|
11
|
-
export interface OHeaderT {
|
|
12
|
-
(e: 'go-back'): void;
|
|
13
|
-
(e: 'go-home'): void;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
const emit = defineEmits<OHeaderT>();
|
|
17
|
-
|
|
18
|
-
const props = defineProps({
|
|
19
|
-
logo: undefined,
|
|
20
|
-
navData: undefined,
|
|
21
|
-
codeData: undefined,
|
|
22
|
-
isSimpleHeader: undefined,
|
|
23
|
-
headerTitle: undefined,
|
|
24
|
-
});
|
|
25
|
-
|
|
26
|
-
const goBack = () => {
|
|
27
|
-
emit('go-back');
|
|
28
|
-
};
|
|
29
|
-
const goHome = () => {
|
|
30
|
-
emit('go-home');
|
|
31
|
-
};
|
|
32
|
-
|
|
33
|
-
const menuShow = ref(false);
|
|
34
|
-
const menuPanel = () => {
|
|
35
|
-
setTimeout(() => {
|
|
36
|
-
menuShow.value = !menuShow.value;
|
|
37
|
-
document.body.style.overflow = menuShow.value ? 'hidden' : '';
|
|
38
|
-
}, 200);
|
|
39
|
-
};
|
|
40
|
-
|
|
41
|
-
const mobileClick = () => {
|
|
42
|
-
menuPanel();
|
|
43
|
-
};
|
|
44
|
-
</script>
|
|
45
|
-
|
|
46
|
-
<template>
|
|
47
|
-
<div class="header">
|
|
48
|
-
<ContentWrapper class="header-wrap">
|
|
49
|
-
<!-- 二级路由简单头部 -->
|
|
50
|
-
<div v-if="isSimpleHeader" class="header-simple">
|
|
51
|
-
<div class="simple-header-left">
|
|
52
|
-
<OIcon @click="goBack">
|
|
53
|
-
<OIconArrowLeft />
|
|
54
|
-
</OIcon>
|
|
55
|
-
<div v-if="headerTitle" class="header-title">
|
|
56
|
-
{{ headerTitle }}
|
|
57
|
-
</div>
|
|
58
|
-
</div>
|
|
59
|
-
<div v-if="$slots.rightConfig" class="simple-header-right">
|
|
60
|
-
<slot name="rightConfig"></slot>
|
|
61
|
-
</div>
|
|
62
|
-
</div>
|
|
63
|
-
<template v-else>
|
|
64
|
-
<div class="header-left">
|
|
65
|
-
<OIcon @click="menuPanel">
|
|
66
|
-
<IconMenu v-if="!menuShow" />
|
|
67
|
-
<IconClose v-else />
|
|
68
|
-
</OIcon>
|
|
69
|
-
</div>
|
|
70
|
-
<HeaderNavMoblie ref="mobileNav" :nav-data="navData" :code-data="codeData" :menu-show="menuShow" @link-click="mobileClick">
|
|
71
|
-
<template #tool>
|
|
72
|
-
<slot name="tool"></slot>
|
|
73
|
-
</template>
|
|
74
|
-
</HeaderNavMoblie>
|
|
75
|
-
<div class="header-center">
|
|
76
|
-
<div class="header-logo" @click="goHome">
|
|
77
|
-
<slot name="logo">
|
|
78
|
-
<img v-if="props.logo" class="logo" alt="logo" :src="props.logo" />
|
|
79
|
-
</slot>
|
|
80
|
-
</div>
|
|
81
|
-
</div>
|
|
82
|
-
<div class="header-right">
|
|
83
|
-
<slot name="toolbar"></slot>
|
|
84
|
-
</div>
|
|
85
|
-
</template>
|
|
86
|
-
</ContentWrapper>
|
|
87
|
-
</div>
|
|
88
|
-
</template>
|
|
89
|
-
|
|
90
|
-
<style lang="scss" scoped>
|
|
91
|
-
.header {
|
|
92
|
-
background-color: var(--o-color-fill2);
|
|
93
|
-
position: fixed;
|
|
94
|
-
left: 0;
|
|
95
|
-
right: 0;
|
|
96
|
-
top: 0;
|
|
97
|
-
z-index: 999;
|
|
98
|
-
box-shadow: 0 3px 9px 0 rgba(0, 18, 85, 0.08);
|
|
99
|
-
backdrop-filter: blur(5px);
|
|
100
|
-
--o-header-height: 56px;
|
|
101
|
-
}
|
|
102
|
-
.header-wrap {
|
|
103
|
-
display: flex;
|
|
104
|
-
align-items: center;
|
|
105
|
-
height: var(--o-header-height);
|
|
106
|
-
justify-content: space-between;
|
|
107
|
-
position: relative;
|
|
108
|
-
}
|
|
109
|
-
.header-simple {
|
|
110
|
-
width: 100%;
|
|
111
|
-
display: flex;
|
|
112
|
-
align-items: center;
|
|
113
|
-
justify-content: space-between;
|
|
114
|
-
.o-icon {
|
|
115
|
-
font-size: 24px;
|
|
116
|
-
}
|
|
117
|
-
.simple-header-left {
|
|
118
|
-
display: flex;
|
|
119
|
-
gap: 16px;
|
|
120
|
-
color: var(--o-color-info1);
|
|
121
|
-
overflow: hidden;
|
|
122
|
-
flex-grow: 1;
|
|
123
|
-
.header-title {
|
|
124
|
-
color: var(--o-color-info1);
|
|
125
|
-
font-weight: 500;
|
|
126
|
-
overflow: hidden;
|
|
127
|
-
white-space: nowrap;
|
|
128
|
-
text-overflow: ellipsis;
|
|
129
|
-
@include text2;
|
|
130
|
-
}
|
|
131
|
-
}
|
|
132
|
-
.simple-header-right {
|
|
133
|
-
flex-shrink: 0;
|
|
134
|
-
color: var(--o-color-info1);
|
|
135
|
-
font-weight: 500;
|
|
136
|
-
font-size: 16px;
|
|
137
|
-
line-height: 24px;
|
|
138
|
-
}
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
.header-left {
|
|
142
|
-
display: flex;
|
|
143
|
-
align-items: center;
|
|
144
|
-
.o-icon {
|
|
145
|
-
--icon-size: 24px;
|
|
146
|
-
}
|
|
147
|
-
}
|
|
148
|
-
.logo {
|
|
149
|
-
height: 24px;
|
|
150
|
-
width: auto;
|
|
151
|
-
}
|
|
152
|
-
</style>
|