sf-i-events 1.0.60 → 1.0.62
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 +1 -1
- package/sf-i-events.d.ts +4 -0
- package/sf-i-events.d.ts.map +1 -1
- package/sf-i-events.js +217 -17
- package/sf-i-events.js.map +1 -1
- package/src/sf-i-events.ts +271 -16
package/package.json
CHANGED
package/sf-i-events.d.ts
CHANGED
|
@@ -61,6 +61,7 @@ export declare class SfIEvents extends LitElement {
|
|
|
61
61
|
getApiBodyDetail: () => any;
|
|
62
62
|
mode: string;
|
|
63
63
|
flow: string;
|
|
64
|
+
fill: string;
|
|
64
65
|
static styles: import("lit").CSSResult;
|
|
65
66
|
_SfIEventsC: any;
|
|
66
67
|
_SfRowError: any;
|
|
@@ -139,6 +140,9 @@ export declare class SfIEvents extends LitElement {
|
|
|
139
140
|
renderEventDetail: (event: any, mmddyyyy: any) => void;
|
|
140
141
|
renderCalendar: () => void;
|
|
141
142
|
renderRoleTabs: () => void;
|
|
143
|
+
renderChartSettingsFilters: (container: HTMLDivElement) => void;
|
|
144
|
+
renderChartSettingsSettings: (container: HTMLDivElement) => void;
|
|
145
|
+
renderChartSettings: (container: HTMLDivElement, selectedTab?: number) => void;
|
|
142
146
|
renderChart: (ctx: any, type: any, data: any) => void;
|
|
143
147
|
getCurrentTab: () => string;
|
|
144
148
|
renderTabs: (selectedTab: string) => void;
|
package/sf-i-events.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sf-i-events.d.ts","sourceRoot":"","sources":["src/sf-i-events.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,UAAU,EAAa,gBAAgB,EAAC,MAAM,KAAK,CAAC;AAkB5D;;;;;;;;;;GAUG;AACH,qBACa,SAAU,SAAQ,UAAU;IAEvC,QAAQ,SAAU;IAClB,UAAU,SAAY;IACtB,YAAY,SAAc;IAC1B,QAAQ,SAAU;IAClB,QAAQ,SAAU;IAClB,UAAU,SAAY;IACtB,YAAY,SAAc;IAC1B,YAAY,SAAc;IAG1B,IAAI,EAAG,MAAM,CAAC;IAGd,KAAK,EAAG,MAAM,CAAC;IAGf,SAAS,EAAG,MAAM,CAAC;IAGnB,WAAW,EAAG,MAAM,CAAC;IAGrB,UAAU,EAAG,MAAM,CAAC;IAGpB,SAAS,EAAG,MAAM,CAAC;IAGnB,aAAa,EAAG,MAAM,CAAC;IAGvB,eAAe,EAAG,MAAM,CAAC;IAGzB,WAAW,EAAG,MAAM,CAAC;IAGrB,aAAa,EAAG,MAAM,CAAC;IAGvB,aAAa,EAAG,MAAM,CAAC;IAGvB,SAAS,EAAG,MAAM,CAAC;IAGnB,oBAAoB,EAAG,MAAM,CAAC;IAG9B,MAAM,EAAE,MAAM,CAAqB;IAGnC,eAAe,EAAG,MAAM,CAAC;IAGzB,eAAe,EAAG,MAAM,CAAC;IAGzB,iBAAiB,EAAG,MAAM,CAAC;IAG3B,QAAQ,EAAE,IAAI,EAAG,CAAM;IAGvB,oBAAoB,EAAE,GAAG,CAAM;IAG/B,iBAAiB,EAAE,GAAG,CAAM;IAG5B,gBAAgB,EAAE,GAAG,CAAM;IAG3B,cAAc,EAAE,GAAG,CAAQ;IAG3B,QAAQ,EAAE,GAAG,CAAQ;IAGrB,UAAU,EAAE,MAAM,EAAG,CAA+H;IAGpJ,MAAM,EAAE,GAAG,CAAQ;IAGnB,eAAe,EAAE,GAAG,CAAQ;IAE5B,kBAAkB,YAEjB;IAGD,kBAAkB,EAAE,GAAG,CAAQ;IAE/B,qBAAqB,YAEpB;IAGD,WAAW,EAAE,GAAG,CAAQ;IAExB,cAAc,YAEb;IAGD,sBAAsB,EAAE,GAAG,CAAQ;IAEnC,yBAAyB,YAExB;IAED,cAAc,YAOb;IAED,gBAAgB,YAEf;IAGD,IAAI,EAAG,MAAM,CAAC;IAGd,IAAI,EAAE,MAAM,CAAM;
|
|
1
|
+
{"version":3,"file":"sf-i-events.d.ts","sourceRoot":"","sources":["src/sf-i-events.ts"],"names":[],"mappings":"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"}
|
package/sf-i-events.js
CHANGED
|
@@ -82,6 +82,7 @@ let SfIEvents = class SfIEvents extends LitElement {
|
|
|
82
82
|
return JSON.parse(this.apiBodyDetail);
|
|
83
83
|
};
|
|
84
84
|
this.flow = "";
|
|
85
|
+
this.fill = "solid";
|
|
85
86
|
this.getEventField = (field) => {
|
|
86
87
|
for (var i = 0; i < this.getEventFields().length; i++) {
|
|
87
88
|
if (this.getEventFields()[i].field == field) {
|
|
@@ -270,11 +271,14 @@ let SfIEvents = class SfIEvents extends LitElement {
|
|
|
270
271
|
};
|
|
271
272
|
this.renderStreamEvents = (index, month, year) => {
|
|
272
273
|
const lastDay = this.getLastDayOfMonth(month, year);
|
|
273
|
-
var html = '
|
|
274
|
-
html += '<div class="mb-20">';
|
|
274
|
+
var html = '';
|
|
275
|
+
html += '<div class="mb-20 stream-event-list" part="stream-event-list">';
|
|
275
276
|
html += '<canvas id="myChart"></canvas>';
|
|
277
|
+
html += '<div id="chart-settings-controls"></div>';
|
|
278
|
+
html += '<div id="chart-settings"></div>';
|
|
276
279
|
html += '</div>';
|
|
277
280
|
var total = 0, notStarted = 0, approved = 0, inProgress = 0;
|
|
281
|
+
html += '<div id="stream-event-' + index + '" part="stream-event-list" class="stream-event-list">';
|
|
278
282
|
html += '<div id="stream-event-summary" part="stream-event-total" class="d-flex">';
|
|
279
283
|
html += '<div part="badge-dashboard" class="mr-10"><span class="muted">Total:</span> <span id="graph-total">DASHBOARD_TOTAL</span></div>';
|
|
280
284
|
html += '<div part="badge-dashboard" class="mr-10"><span class="muted">Approved:</span> <span id="graph-approved">DASHBOARD_APPROVED</span></div>';
|
|
@@ -1596,21 +1600,40 @@ let SfIEvents = class SfIEvents extends LitElement {
|
|
|
1596
1600
|
var dataApproved = this._SfStreamContainer.querySelector('#graph-approved').innerHTML;
|
|
1597
1601
|
var dataNotStarted = this._SfStreamContainer.querySelector('#graph-not-started').innerHTML;
|
|
1598
1602
|
var dataInProgress = this._SfStreamContainer.querySelector('#graph-in-progress').innerHTML;
|
|
1599
|
-
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
|
|
1603
|
-
|
|
1604
|
-
|
|
1605
|
-
|
|
1606
|
-
|
|
1607
|
-
|
|
1608
|
-
|
|
1609
|
-
|
|
1610
|
-
|
|
1611
|
-
|
|
1612
|
-
|
|
1613
|
-
|
|
1603
|
+
if (this.fill == "pattern") {
|
|
1604
|
+
const data = {
|
|
1605
|
+
labels: ['Approved', 'Not Started', 'In Progress'],
|
|
1606
|
+
datasets: [{
|
|
1607
|
+
label: 'Compliances',
|
|
1608
|
+
data: [dataApproved, dataNotStarted, dataInProgress],
|
|
1609
|
+
borderWidth: 1,
|
|
1610
|
+
backgroundColor: [
|
|
1611
|
+
Util.createDiagonalPattern3('#20a39e'),
|
|
1612
|
+
Util.createDiagonalPattern2('#A4A9AD'),
|
|
1613
|
+
Util.createDiagonalPattern1('##FFBA49')
|
|
1614
|
+
]
|
|
1615
|
+
}]
|
|
1616
|
+
};
|
|
1617
|
+
this.renderChartSettings(this._SfStreamContainer);
|
|
1618
|
+
this.renderChart(ctx, 'doughnut', data);
|
|
1619
|
+
}
|
|
1620
|
+
if (this.fill == "solid") {
|
|
1621
|
+
const data = {
|
|
1622
|
+
labels: ['Approved', 'Not Started', 'In Progress'],
|
|
1623
|
+
datasets: [{
|
|
1624
|
+
label: 'Compliances',
|
|
1625
|
+
data: [dataApproved, dataNotStarted, dataInProgress],
|
|
1626
|
+
borderWidth: 1,
|
|
1627
|
+
backgroundColor: [
|
|
1628
|
+
'#20a39e',
|
|
1629
|
+
'#A4A9AD',
|
|
1630
|
+
'#FFBA49'
|
|
1631
|
+
]
|
|
1632
|
+
}]
|
|
1633
|
+
};
|
|
1634
|
+
this.renderChartSettings(this._SfStreamContainer);
|
|
1635
|
+
this.renderChart(ctx, 'doughnut', data);
|
|
1636
|
+
}
|
|
1614
1637
|
};
|
|
1615
1638
|
this.renderEventDetail = (event, mmddyyyy) => {
|
|
1616
1639
|
var _a, _b, _c;
|
|
@@ -1835,6 +1858,130 @@ let SfIEvents = class SfIEvents extends LitElement {
|
|
|
1835
1858
|
}
|
|
1836
1859
|
});
|
|
1837
1860
|
};
|
|
1861
|
+
this.renderChartSettingsFilters = (container) => {
|
|
1862
|
+
var _a;
|
|
1863
|
+
console.log(container);
|
|
1864
|
+
var html = `
|
|
1865
|
+
|
|
1866
|
+
<div class="m-20" part="input">
|
|
1867
|
+
<div class="d-flex justify-end">
|
|
1868
|
+
<button id="chart-control-cancel" part="button-icon"><span class="material-icons">close</span></button>
|
|
1869
|
+
</div>
|
|
1870
|
+
Hello
|
|
1871
|
+
</div>
|
|
1872
|
+
|
|
1873
|
+
`;
|
|
1874
|
+
container.innerHTML = html;
|
|
1875
|
+
(_a = container.querySelector('#chart-control-cancel')) === null || _a === void 0 ? void 0 : _a.addEventListener('click', () => {
|
|
1876
|
+
container.innerHTML = '';
|
|
1877
|
+
container.dispatchEvent(new CustomEvent('canceled', { bubbles: true }));
|
|
1878
|
+
});
|
|
1879
|
+
};
|
|
1880
|
+
this.renderChartSettingsSettings = (container) => {
|
|
1881
|
+
var _a, _b, _c;
|
|
1882
|
+
var checkedSolid = '';
|
|
1883
|
+
var checkedPattern = '';
|
|
1884
|
+
if (this.fill == "solid") {
|
|
1885
|
+
checkedSolid = 'checked';
|
|
1886
|
+
}
|
|
1887
|
+
if (this.fill == "pattern") {
|
|
1888
|
+
checkedPattern = 'checked';
|
|
1889
|
+
}
|
|
1890
|
+
var html = `
|
|
1891
|
+
|
|
1892
|
+
<div class="m-10" part="input">
|
|
1893
|
+
<div class="d-flex justify-end">
|
|
1894
|
+
<button id="chart-control-cancel" part="button-icon"><span class="material-icons">close</span></button>
|
|
1895
|
+
</div>
|
|
1896
|
+
<div class="d-flex justify-end">
|
|
1897
|
+
<div>
|
|
1898
|
+
<label part="input-label">Fill</label><br />
|
|
1899
|
+
<div class="switch-field">
|
|
1900
|
+
<input type="radio" id="radio-solid" name="switch-fill" class="switch-solid" value="Solid" ${checkedSolid}/>
|
|
1901
|
+
<label for="radio-solid">Solid</label>
|
|
1902
|
+
<input type="radio" id="radio-pattern" name="switch-fill" class="switch-pattern" value="Pattern" ${checkedPattern}/>
|
|
1903
|
+
<label for="radio-pattern">Pattern</label>
|
|
1904
|
+
</div>
|
|
1905
|
+
</div>
|
|
1906
|
+
</div>
|
|
1907
|
+
</div>
|
|
1908
|
+
|
|
1909
|
+
`;
|
|
1910
|
+
container.innerHTML = html;
|
|
1911
|
+
(_a = container.querySelector('#chart-control-cancel')) === null || _a === void 0 ? void 0 : _a.addEventListener('click', () => {
|
|
1912
|
+
container.innerHTML = '';
|
|
1913
|
+
container.dispatchEvent(new CustomEvent('canceled', { bubbles: true }));
|
|
1914
|
+
});
|
|
1915
|
+
(_b = container.querySelector('.switch-solid')) === null || _b === void 0 ? void 0 : _b.addEventListener('click', () => {
|
|
1916
|
+
this.fill = "solid";
|
|
1917
|
+
if (this.getCurrentTab() == this.TAB_STREAM) {
|
|
1918
|
+
this.renderStream();
|
|
1919
|
+
}
|
|
1920
|
+
});
|
|
1921
|
+
(_c = container.querySelector('.switch-pattern')) === null || _c === void 0 ? void 0 : _c.addEventListener('click', () => {
|
|
1922
|
+
this.fill = "pattern";
|
|
1923
|
+
if (this.getCurrentTab() == this.TAB_STREAM) {
|
|
1924
|
+
this.renderStream();
|
|
1925
|
+
}
|
|
1926
|
+
});
|
|
1927
|
+
};
|
|
1928
|
+
this.renderChartSettings = (container, selectedTab = -1) => {
|
|
1929
|
+
var _a, _b;
|
|
1930
|
+
var html = '';
|
|
1931
|
+
html += '<div class="d-flex justify-end align-start">';
|
|
1932
|
+
if (selectedTab === 0) {
|
|
1933
|
+
html += '<button class="tab-button" id="chart-control-filters" part="calendar-tab-button-selected" class="mr-10"><span class="material-icons">filter_list</span></button>';
|
|
1934
|
+
}
|
|
1935
|
+
else {
|
|
1936
|
+
html += '<button class="tab-button" id="chart-control-filters" part="calendar-tab-button-not-selected" class="mr-10"><span class="material-icons">filter_list</span></button>';
|
|
1937
|
+
}
|
|
1938
|
+
if (selectedTab === 1) {
|
|
1939
|
+
html += '<button class="tab-button" id="chart-control-settings" part="calendar-tab-button-selected" class="mr-10"><span class="material-icons">tune</span></button>';
|
|
1940
|
+
}
|
|
1941
|
+
else {
|
|
1942
|
+
html += '<button class="tab-button" id="chart-control-settings" part="calendar-tab-button-not-selected" class="mr-10"><span class="material-icons">tune</span></button>';
|
|
1943
|
+
}
|
|
1944
|
+
html += '</div>';
|
|
1945
|
+
container.querySelector('#chart-settings-controls').innerHTML = html;
|
|
1946
|
+
(_a = container.querySelector('#chart-settings-controls').querySelector('#chart-control-settings')) === null || _a === void 0 ? void 0 : _a.addEventListener('click', () => {
|
|
1947
|
+
this.renderChartSettings(container, 1);
|
|
1948
|
+
});
|
|
1949
|
+
(_b = container.querySelector('#chart-settings-controls').querySelector('#chart-control-filters')) === null || _b === void 0 ? void 0 : _b.addEventListener('click', () => {
|
|
1950
|
+
this.renderChartSettings(container, 0);
|
|
1951
|
+
});
|
|
1952
|
+
if (selectedTab === 0) {
|
|
1953
|
+
this.renderChartSettingsFilters(container.querySelector('#chart-settings'));
|
|
1954
|
+
}
|
|
1955
|
+
if (selectedTab === 1) {
|
|
1956
|
+
this.renderChartSettingsSettings(container.querySelector('#chart-settings'));
|
|
1957
|
+
}
|
|
1958
|
+
container.querySelector('#chart-settings').addEventListener('canceled', () => {
|
|
1959
|
+
console.log('canceled');
|
|
1960
|
+
this.renderChartSettings(container);
|
|
1961
|
+
});
|
|
1962
|
+
// (container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-settings-cancel')?.addEventListener('click', () => {
|
|
1963
|
+
// ((container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-filters-cancel') as HTMLButtonElement).style.display = 'none';
|
|
1964
|
+
// ((container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-settings-cancel') as HTMLButtonElement).style.display = 'none';
|
|
1965
|
+
// ((container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-settings') as HTMLButtonElement).style.display = 'flex';
|
|
1966
|
+
// ((container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-filters') as HTMLButtonElement).style.display = 'flex';
|
|
1967
|
+
// (container.querySelector('#chart-settings') as HTMLDivElement).innerHTML = '';
|
|
1968
|
+
// });
|
|
1969
|
+
// (container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-filters-cancel')?.addEventListener('click', () => {
|
|
1970
|
+
// ((container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-filters-cancel') as HTMLButtonElement).style.display = 'none';
|
|
1971
|
+
// ((container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-settings-cancel') as HTMLButtonElement).style.display = 'none';
|
|
1972
|
+
// ((container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-settings') as HTMLButtonElement).style.display = 'flex';
|
|
1973
|
+
// ((container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-filters') as HTMLButtonElement).style.display = 'flex';
|
|
1974
|
+
// (container.querySelector('#chart-settings') as HTMLDivElement).innerHTML = '';
|
|
1975
|
+
// });
|
|
1976
|
+
// (container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-filters')?.addEventListener('click', () => {
|
|
1977
|
+
// ((container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-filters-cancel') as HTMLButtonElement).style.display = 'flex';
|
|
1978
|
+
// ((container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-settings-cancel') as HTMLButtonElement).style.display = 'none';
|
|
1979
|
+
// ((container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-settings') as HTMLButtonElement).style.display = 'none';
|
|
1980
|
+
// ((container.querySelector('#chart-settings-controls') as HTMLDivElement).querySelector('#chart-control-filters') as HTMLButtonElement).style.display = 'none';
|
|
1981
|
+
// (container.querySelector('#chart-settings') as HTMLDivElement).innerHTML = '';
|
|
1982
|
+
// this.renderChartSettingsFilters((container.querySelector('#chart-settings') as HTMLDivElement));
|
|
1983
|
+
// })
|
|
1984
|
+
};
|
|
1838
1985
|
this.renderChart = (ctx, type, data) => {
|
|
1839
1986
|
new Chart(ctx, {
|
|
1840
1987
|
type: type,
|
|
@@ -3016,6 +3163,7 @@ let SfIEvents = class SfIEvents extends LitElement {
|
|
|
3016
3163
|
return html `
|
|
3017
3164
|
|
|
3018
3165
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
|
3166
|
+
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
|
3019
3167
|
<div class="SfIEventsC">
|
|
3020
3168
|
|
|
3021
3169
|
<div class="d-flex justify-center">
|
|
@@ -3083,6 +3231,51 @@ SfIEvents.styles = css `
|
|
|
3083
3231
|
visibility: hidden;
|
|
3084
3232
|
}
|
|
3085
3233
|
|
|
3234
|
+
.switch-field {
|
|
3235
|
+
display: flex;
|
|
3236
|
+
overflow: hidden;
|
|
3237
|
+
}
|
|
3238
|
+
|
|
3239
|
+
.switch-field input {
|
|
3240
|
+
position: absolute !important;
|
|
3241
|
+
clip: rect(0, 0, 0, 0);
|
|
3242
|
+
height: 1px;
|
|
3243
|
+
width: 1px;
|
|
3244
|
+
border: 0;
|
|
3245
|
+
overflow: hidden;
|
|
3246
|
+
}
|
|
3247
|
+
|
|
3248
|
+
.switch-field label {
|
|
3249
|
+
background-color: #e4e4e4;
|
|
3250
|
+
color: rgba(0, 0, 0, 0.6);
|
|
3251
|
+
font-size: 14px;
|
|
3252
|
+
line-height: 1;
|
|
3253
|
+
text-align: center;
|
|
3254
|
+
padding: 8px 16px;
|
|
3255
|
+
margin-right: -1px;
|
|
3256
|
+
border: 1px solid rgba(0, 0, 0, 0.2);
|
|
3257
|
+
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
|
|
3258
|
+
transition: all 0.1s ease-in-out;
|
|
3259
|
+
}
|
|
3260
|
+
|
|
3261
|
+
.switch-field label:hover {
|
|
3262
|
+
cursor: pointer;
|
|
3263
|
+
}
|
|
3264
|
+
|
|
3265
|
+
.switch-field input:checked + label {
|
|
3266
|
+
background-color: #505050;
|
|
3267
|
+
box-shadow: none;
|
|
3268
|
+
color: white;
|
|
3269
|
+
}
|
|
3270
|
+
|
|
3271
|
+
.switch-field label:first-of-type {
|
|
3272
|
+
border-radius: 4px 0 0 4px;
|
|
3273
|
+
}
|
|
3274
|
+
|
|
3275
|
+
.switch-field label:last-of-type {
|
|
3276
|
+
border-radius: 0 4px 4px 0;
|
|
3277
|
+
}
|
|
3278
|
+
|
|
3086
3279
|
.commentbox {
|
|
3087
3280
|
padding: 10px;
|
|
3088
3281
|
border: solid 1px gray;
|
|
@@ -3115,6 +3308,10 @@ SfIEvents.styles = css `
|
|
|
3115
3308
|
margin: 20px;
|
|
3116
3309
|
}
|
|
3117
3310
|
|
|
3311
|
+
.m-10 {
|
|
3312
|
+
margin: 10px;
|
|
3313
|
+
}
|
|
3314
|
+
|
|
3118
3315
|
.text-start {
|
|
3119
3316
|
text-align: start;
|
|
3120
3317
|
}
|
|
@@ -3715,6 +3912,9 @@ __decorate([
|
|
|
3715
3912
|
__decorate([
|
|
3716
3913
|
property()
|
|
3717
3914
|
], SfIEvents.prototype, "flow", void 0);
|
|
3915
|
+
__decorate([
|
|
3916
|
+
property()
|
|
3917
|
+
], SfIEvents.prototype, "fill", void 0);
|
|
3718
3918
|
__decorate([
|
|
3719
3919
|
query('.SfIEventsC')
|
|
3720
3920
|
], SfIEvents.prototype, "_SfIEventsC", void 0);
|