Skip to content

Commit ebfbdfd

Browse files
freddysundownerfreddysundowner
committed
added licence key data field
1 parent c60dcce commit ebfbdfd

File tree

4 files changed

+219
-165
lines changed

4 files changed

+219
-165
lines changed

‎client/packages/lowcoder-comps/package.json‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "lowcoder-comps",
3-
"version": "0.0.24",
3+
"version": "0.0.25",
44
"type": "module",
55
"license": "MIT",
66
"dependencies": {
@@ -10,6 +10,8 @@
1010
"@fullcalendar/list": "^6.1.9",
1111
"@fullcalendar/moment": "^6.1.6",
1212
"@fullcalendar/react": "^6.1.6",
13+
"@fullcalendar/resource": "^6.1.11",
14+
"@fullcalendar/resource-timeline": "^6.1.11",
1315
"@fullcalendar/timegrid": "^6.1.6",
1416
"@types/react": "^18.2.45",
1517
"@types/react-dom": "^18.2.18",

‎client/packages/lowcoder-comps/src/comps/calendarComp/calendarComp.tsx‎

Lines changed: 65 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ import { default as Form } from "antd/es/form";
2626
import { default as Input } from "antd/es/input";
2727
import { trans, getCalendarLocale } from "../../i18n/comps";
2828
import { createRef, useContext, useRef, useState } from "react";
29+
import resourceTimelinePlugin from "@fullcalendar/resource-timeline";
2930
import FullCalendar from "@fullcalendar/react";
3031
import dayGridPlugin from "@fullcalendar/daygrid";
3132
import timeGridPlugin from "@fullcalendar/timegrid";
@@ -66,8 +67,9 @@ const childrenMap = {
6667
dayMaxEvents: withDefault(NumberControl, 2),
6768
eventMaxStack: withDefault(NumberControl, 0),
6869
style: styleControl(CalendarStyle),
70+
licenceKey: withDefault(StringControl, ""),
6971
};
70-
72+
7173
let CalendarBasicComp = (function () {
7274
return new UICompBuilder(childrenMap, (props) => {
7375
const theme = useContext(ThemeContext);
@@ -83,7 +85,9 @@ let CalendarBasicComp = (function () {
8385
start: dayjs(item.start, DateParser).format(),
8486
end: dayjs(item.end, DateParser).format(),
8587
allDay: item.allDay,
86-
color: isValidColor(item.color || "") ? item.color : theme?.theme?.primary,
88+
color: isValidColor(item.color || "")
89+
? item.color
90+
: theme?.theme?.primary,
8791
...(item.groupId ? { groupId: item.groupId } : null),
8892
};
8993
});
@@ -104,8 +108,13 @@ let CalendarBasicComp = (function () {
104108
function renderEventContent(eventInfo: EventContentArg) {
105109
const isList = eventInfo.view.type === "listWeek";
106110
let sizeClass = "";
107-
if ([ViewType.WEEK, ViewType.DAY].includes(eventInfo.view.type as ViewType)) {
108-
const duration = dayjs(eventInfo.event.end).diff(dayjs(eventInfo.event.start), "minutes");
111+
if (
112+
[ViewType.WEEK, ViewType.DAY].includes(eventInfo.view.type as ViewType)
113+
) {
114+
const duration = dayjs(eventInfo.event.end).diff(
115+
dayjs(eventInfo.event.start),
116+
"minutes"
117+
);
109118
if (duration <= 30 || eventInfo.event.allDay) {
110119
sizeClass = "small";
111120
} else if (duration <= 60) {
@@ -137,7 +146,9 @@ let CalendarBasicComp = (function () {
137146
onClick={(e) => {
138147
e.stopPropagation();
139148
props.onEvent("change");
140-
const event = events.filter((item: EventType) => item.id !== eventInfo.event.id);
149+
const event = events.filter(
150+
(item: EventType) => item.id !== eventInfo.event.id
151+
);
141152
props.events.onChange(event);
142153
}}
143154
onMouseDown={(e) => {
@@ -195,7 +206,9 @@ let CalendarBasicComp = (function () {
195206
};
196207

197208
const showModal = (event: EventType, ifEdit: boolean) => {
198-
const modalTitle = ifEdit ? trans("calendar.editEvent") : trans("calendar.creatEvent");
209+
const modalTitle = ifEdit
210+
? trans("calendar.editEvent")
211+
: trans("calendar.creatEvent");
199212
form && form.setFieldsValue(event);
200213
const eventId = editEvent.current?.id;
201214
CustomModal.confirm({
@@ -209,14 +222,18 @@ let CalendarBasicComp = (function () {
209222
</Tooltip>
210223
}
211224
name="id"
212-
rules={[{ required: true, message: trans("calendar.eventIdRequire") }]}
225+
rules={[
226+
{ required: true, message: trans("calendar.eventIdRequire") },
227+
]}
213228
>
214229
<Input />
215230
</Form.Item>
216231
<Form.Item
217232
label={trans("calendar.eventName")}
218233
name="title"
219-
rules={[{ required: true, message: trans("calendar.eventNameRequire") }]}
234+
rules={[
235+
{ required: true, message: trans("calendar.eventNameRequire") },
236+
]}
220237
>
221238
<Input />
222239
</Form.Item>
@@ -239,9 +256,13 @@ let CalendarBasicComp = (function () {
239256
form.submit();
240257
return form.validateFields().then(() => {
241258
const { id, groupId, color, title = "" } = form.getFieldsValue();
242-
const idExist = props.events.value.findIndex((item: EventType) => item.id === id);
259+
const idExist = props.events.value.findIndex(
260+
(item: EventType) => item.id === id
261+
);
243262
if (idExist > -1 && id !== eventId) {
244-
form.setFields([{ name: "id", errors: [trans("calendar.eventIdExist")] }]);
263+
form.setFields([
264+
{ name: "id", errors: [trans("calendar.eventIdExist")] },
265+
]);
245266
throw new Error();
246267
}
247268
if (ifEdit) {
@@ -306,7 +327,14 @@ let CalendarBasicComp = (function () {
306327
locale={getCalendarLocale()}
307328
locales={allLocales}
308329
firstDay={Number(firstDay)}
309-
plugins={[dayGridPlugin, timeGridPlugin, interactionPlugin, listPlugin, momentPlugin]}
330+
plugins={[
331+
dayGridPlugin,
332+
timeGridPlugin,
333+
interactionPlugin,
334+
listPlugin,
335+
momentPlugin,
336+
resourceTimelinePlugin,
337+
]}
310338
headerToolbar={headerToolbar}
311339
moreLinkClick={(info) => {
312340
let left = 0;
@@ -319,15 +347,19 @@ let CalendarBasicComp = (function () {
319347
}
320348
} else {
321349
if (info.allDay) {
322-
left = ele.offsetParent?.parentElement?.parentElement?.offsetLeft || 0;
350+
left =
351+
ele.offsetParent?.parentElement?.parentElement?.offsetLeft ||
352+
0;
323353
} else {
324354
left =
325-
ele.offsetParent?.parentElement?.parentElement?.parentElement?.offsetLeft || 0;
355+
ele.offsetParent?.parentElement?.parentElement?.parentElement
356+
?.offsetLeft || 0;
326357
}
327358
}
328359
setLeft(left);
329360
}}
330361
buttonText={buttonText}
362+
schedulerLicenseKey={props.licenceKey.value}
331363
views={views}
332364
eventClassNames={() => (!showEventTime ? "no-time" : "")}
333365
slotLabelFormat={slotLabelFormat}
@@ -346,7 +378,9 @@ let CalendarBasicComp = (function () {
346378
eventContent={renderEventContent}
347379
select={(info) => handleCreate(info)}
348380
eventClick={(info) => {
349-
const event = events.find((item: EventType) => item.id === info.event.id);
381+
const event = events.find(
382+
(item: EventType) => item.id === info.event.id
383+
);
350384
editEvent.current = event;
351385
setTimeout(() => {
352386
editEvent.current = undefined;
@@ -387,12 +421,19 @@ let CalendarBasicComp = (function () {
387421
.setPropertyViewFn((children) => {
388422
return (
389423
<>
390-
<Section name={sectionNames.basic}>{children.events.propertyView({})}</Section>
391-
<Section name={sectionNames.interaction}>{children.onEvent.getPropertyView()}</Section>
424+
<Section name={sectionNames.basic}>
425+
{children.events.propertyView({})}
426+
</Section>
427+
<Section name={sectionNames.interaction}>
428+
{children.licenceKey.propertyView({
429+
label: trans("calendar.licence"),
430+
})}
431+
{children.onEvent.getPropertyView()}
432+
</Section>
392433
<Section name={sectionNames.advanced}>
393434
{children.editable.propertyView({
394-
label: trans("calendar.editable"),
395-
})}
435+
label: trans("calendar.editable"),
436+
})}
396437
{children.defaultDate.propertyView({
397438
label: trans("calendar.defaultDate"),
398439
tooltip: trans("calendar.defaultDateTooltip"),
@@ -424,8 +465,12 @@ let CalendarBasicComp = (function () {
424465
tooltip: trans("calendar.eventMaxStackTooltip"),
425466
})}
426467
</Section>
427-
<Section name={sectionNames.layout}>{hiddenPropertyView(children)}</Section>
428-
<Section name={sectionNames.style}>{children.style.getPropertyView()}</Section>
468+
<Section name={sectionNames.layout}>
469+
{hiddenPropertyView(children)}
470+
</Section>
471+
<Section name={sectionNames.style}>
472+
{children.style.getPropertyView()}
473+
</Section>
429474
</>
430475
);
431476
})

‎client/packages/lowcoder-comps/src/comps/calendarComp/calendarConstants.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -205,9 +205,9 @@ export const Wrapper = styled.div<{
205205
flex-direction: inherit;
206206
}
207207
.fc-day-today .fc-daygrid-day-number {
208-
background-color: ${(props) => props.$theme.primary};
208+
background-color: ${(props) => props.$theme?.primary};
209209
color: ${(props) =>
210-
contrastText(props.$theme.primary || "", props.$theme.textDark, props.$theme.textLight)};
210+
contrastText(props.$theme?.primary || "", props.$theme?.textDark, props.$theme?.textLight)};
211211
}
212212
.fc-daygrid-day-events {
213213
padding: 1px 0 5px 0;
@@ -585,10 +585,10 @@ export const Wrapper = styled.div<{
585585
}
586586
.fc-day-today.fc-col-header-cell {
587587
background-color: ${(props) =>
588-
isDarkColor(props.$style.background) ? "#ffffff19" : toHex(props.$theme.primary!) + "19"};
588+
isDarkColor(props.$style.background) ? "#ffffff19" : toHex(props.$theme?.primary!) + "19"};
589589
a {
590590
color: ${(props) =>
591-
!isDarkColor(props.$style.background) && darkenColor(props.$theme.primary!, 0.1)};
591+
!isDarkColor(props.$style.background) && darkenColor(props.$theme?.primary!, 0.1)};
592592
}
593593
}
594594
.fc-col-header-cell-cushion {

0 commit comments

Comments
 (0)