mgsdatatable 1.1.2 β 1.1.4
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/README.md +174 -29
- package/dist/mgsdatatable.min.js +2 -2
- package/package.json +1 -1
- package/src/index.js +88 -30
package/README.md
CHANGED
|
@@ -9,14 +9,164 @@ All functions are globally accessible via window.
|
|
|
9
9
|
## β¨ Features
|
|
10
10
|
|
|
11
11
|
- π **Search** β Filter rows you type then enter keyword.
|
|
12
|
-
- β
|
|
12
|
+
- β **Sorting** β Click column headers to sort (ascending/descending).
|
|
13
13
|
- π **Pagination** β Navigate between pages easily.
|
|
14
14
|
- π **Rows Limit** β Set how many rows appear per page.
|
|
15
|
-
- π¨ **
|
|
15
|
+
- π¨ **Result summary** β (e.g. Showing 1β10 of 50).
|
|
16
|
+
- π¨ **Custom Serial Number** β (e.g. Sr.No.).
|
|
16
17
|
- π¦ **No Dependencies** β Works in all modern browsers.
|
|
17
18
|
|
|
18
19
|
---
|
|
19
20
|
|
|
21
|
+
## Function Uses
|
|
22
|
+
|
|
23
|
+
```
|
|
24
|
+
<div id="myTable"> </div>
|
|
25
|
+
<script>
|
|
26
|
+
mgsDataTable({
|
|
27
|
+
target: "#myTable", // Required
|
|
28
|
+
url: "http://localhost/mgs/users", // Required
|
|
29
|
+
data: {}, // Optional, if use laravel then send Laravel CSRF Token {token: "{{csrf_token()}}"}, if use api with Bearer Token (Auth API) to send {bearerToken: 'bearerToken'} other wise No auth / extra filters to send your data.
|
|
30
|
+
pageLimits:[2,3,4,5], // Optional, default: [10,20,30,50,100]
|
|
31
|
+
isLimit: true, // Optional, default: true
|
|
32
|
+
isSearch: true, // Optional, default: true
|
|
33
|
+
isResult: true, // Optional, default: true
|
|
34
|
+
isPagination: true, // Optional, default: true
|
|
35
|
+
isSorting: true, // Optional, default: true
|
|
36
|
+
isSrno: true, // Optional, default: false
|
|
37
|
+
isSrnoText: "ID" // Optional, default: "Sr.No"
|
|
38
|
+
});
|
|
39
|
+
</script>
|
|
40
|
+
|
|
41
|
+
πExplanation of Each Option -
|
|
42
|
+
|
|
43
|
+
1 - target (string) β Required
|
|
44
|
+
|
|
45
|
+
The selector for the table where data will be rendered.
|
|
46
|
+
Example: "#myTable" or ".userTable"
|
|
47
|
+
Without this, the plugin wonβt know which table to build.
|
|
48
|
+
|
|
49
|
+
2 - url (string) β Required
|
|
50
|
+
API endpoint to fetch data.
|
|
51
|
+
Example: "http://localhost/mgs/users"
|
|
52
|
+
The API should return a JSON response.
|
|
53
|
+
Response -
|
|
54
|
+
{
|
|
55
|
+
"status": true,
|
|
56
|
+
"data": {
|
|
57
|
+
"column": [
|
|
58
|
+
"name",
|
|
59
|
+
"role",
|
|
60
|
+
"email",
|
|
61
|
+
"mobile",
|
|
62
|
+
"image",
|
|
63
|
+
"status",
|
|
64
|
+
"action"
|
|
65
|
+
],
|
|
66
|
+
"data": [
|
|
67
|
+
{
|
|
68
|
+
"id": 1,
|
|
69
|
+
"name": "Mangesh",
|
|
70
|
+
"role": "superadmin",
|
|
71
|
+
"email": "mangesh@gmail.com",
|
|
72
|
+
"mobile": "1234567890",
|
|
73
|
+
"image": "<img src='http://localhost/mgs/storage/user/1692380264.avif' style='height: 50px; width: 100px; border-radius: 50px;'>",
|
|
74
|
+
"status": "<span data-id='1' class='status badge badge-sm badge-success' data-status='Inactive'>Active</span>",
|
|
75
|
+
"action": "<span data-id='1' class='btn-danger badge badge-sm badge-danger delete' title='Delete'><i class='fa fa-trash'></i></span> <a href='http://localhost/mgs/user-update/1' class='btn-success badge badge-sm badge-success' title='Update'><i class='fa fa-edit'></i></a>"
|
|
76
|
+
},
|
|
77
|
+
{
|
|
78
|
+
"id": 2,
|
|
79
|
+
"name": "Ashwani",
|
|
80
|
+
"role": "superadmin",
|
|
81
|
+
"email": "ashwani@gmail.com",
|
|
82
|
+
"mobile": "1234567891",
|
|
83
|
+
"image": "<img src='http://localhost/mgs/storage/user/1692380264.avif' style='height: 50px; width: 100px; border-radius: 50px;'>",
|
|
84
|
+
"status": "<span data-id='2' class='status badge badge-sm badge-success' data-status='Inactive'>Active</span>",
|
|
85
|
+
"action": "<span data-id='2' class='btn-danger badge badge-sm badge-danger delete' title='Delete'><i class='fa fa-trash'></i></span> <a href='http://localhost/mgs/user-update/2' class='btn-success badge badge-sm badge-success' title='Update'><i class='fa fa-edit'></i></a>"
|
|
86
|
+
}
|
|
87
|
+
],
|
|
88
|
+
"from": 1,
|
|
89
|
+
"to": 10,
|
|
90
|
+
"total": 30
|
|
91
|
+
},
|
|
92
|
+
"message": "Data found"
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
3 - data (object) β Optional
|
|
96
|
+
|
|
97
|
+
Extra parameters sent with API requests.
|
|
98
|
+
Examples:
|
|
99
|
+
Laravel CSRF Token-
|
|
100
|
+
data: { token: "{{csrf_token()}}" }
|
|
101
|
+
|
|
102
|
+
Bearer Token (Auth API) -
|
|
103
|
+
data: { bearerToken: "yourAccessTokenHere" }
|
|
104
|
+
|
|
105
|
+
No auth / extra filters -
|
|
106
|
+
data: {}
|
|
107
|
+
|
|
108
|
+
4 - pageLimits (array) β Optional
|
|
109
|
+
|
|
110
|
+
Defines the dropdown options for "Items per page".
|
|
111
|
+
Default: [10, 20, 30, 50, 100]
|
|
112
|
+
Example: [2,3,4,5] β lets user pick 2, 3, 4, or 5 rows per page.
|
|
113
|
+
|
|
114
|
+
5 - isLimit (boolean) β Optional
|
|
115
|
+
|
|
116
|
+
Default: true
|
|
117
|
+
Example:
|
|
118
|
+
true β Shows the page limit dropdown.
|
|
119
|
+
false β Hides the page limit dropdown.
|
|
120
|
+
|
|
121
|
+
6 - isSearch (boolean) β Optional
|
|
122
|
+
|
|
123
|
+
Default: true
|
|
124
|
+
Shows/hides the search bar above the table.
|
|
125
|
+
Example:
|
|
126
|
+
true β search enabled.
|
|
127
|
+
false β no search bar.
|
|
128
|
+
|
|
129
|
+
7 - isResult (boolean) β Optional
|
|
130
|
+
|
|
131
|
+
Default: true
|
|
132
|
+
Shows/hides the result count summary (e.g., Showing 1β10 of 50).
|
|
133
|
+
Example:
|
|
134
|
+
true β Shows the result count summary.
|
|
135
|
+
false β Hides the result count summary.
|
|
136
|
+
|
|
137
|
+
8 - isPagination (boolean) β Optional
|
|
138
|
+
|
|
139
|
+
Default: true
|
|
140
|
+
Shows/hides pagination controls (next/previous buttons, page numbers).
|
|
141
|
+
Example:
|
|
142
|
+
true β Shows the pagination controls.
|
|
143
|
+
false β Hides the pagination controls.
|
|
144
|
+
|
|
145
|
+
9 - isSorting (boolean) β Optional
|
|
146
|
+
|
|
147
|
+
Default: true
|
|
148
|
+
Enables column sorting (clicking on header sorts ASC/DESC).
|
|
149
|
+
Example:
|
|
150
|
+
true β Enables column sorting.
|
|
151
|
+
false β Disables column sorting.
|
|
152
|
+
|
|
153
|
+
10 - isSrno (boolean) β Optional
|
|
154
|
+
|
|
155
|
+
Default: false
|
|
156
|
+
Adds a Serial Number column at the start of the table.
|
|
157
|
+
Numbers auto-increment row by row.
|
|
158
|
+
|
|
159
|
+
11 - isSrnoText (string) β Optional
|
|
160
|
+
|
|
161
|
+
Default: "Sr.No"
|
|
162
|
+
Lets you rename the serial number column header.
|
|
163
|
+
Example:
|
|
164
|
+
isSrno: true,
|
|
165
|
+
isSrnoText: "User ID"
|
|
166
|
+
Column header will show User ID instead of Sr.No.
|
|
167
|
+
|
|
168
|
+
```
|
|
169
|
+
|
|
20
170
|
## π Usage via CDN
|
|
21
171
|
|
|
22
172
|
```
|
|
@@ -24,25 +174,23 @@ All functions are globally accessible via window.
|
|
|
24
174
|
<html>
|
|
25
175
|
<head>
|
|
26
176
|
<title>mgsDataTable</title>
|
|
27
|
-
<script src="https://cdn.jsdelivr.net/npm/mgsdatatable@1.1.
|
|
177
|
+
<script src="https://cdn.jsdelivr.net/npm/mgsdatatable@1.1.4/dist/mgsdatatable.min.js"></script>
|
|
28
178
|
</head>
|
|
29
179
|
<body>
|
|
30
|
-
<
|
|
180
|
+
<div id="myTable"> </div>
|
|
31
181
|
<script>
|
|
32
182
|
mgsDataTable({
|
|
33
183
|
target: "#myTable", // Required
|
|
34
184
|
url: "http://localhost/mgs/users", // Required
|
|
35
|
-
data: {}, // Optional
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
isPagination: true, // Optional, default is true
|
|
45
|
-
isSorting: true // Optional, default is true
|
|
185
|
+
data: {}, // Optional, if use laravel then send Laravel CSRF Token {token: "{{csrf_token()}}"}, if use api with Bearer Token (Auth API) to send {bearerToken: 'bearerToken'} other wise No auth / extra filters to send your data.
|
|
186
|
+
pageLimits:[2,3,4,5], // Optional, default: [10,20,30,50,100]
|
|
187
|
+
isLimit: true, // Optional, default: true
|
|
188
|
+
isSearch: true, // Optional, default: true
|
|
189
|
+
isResult: true, // Optional, default: true
|
|
190
|
+
isPagination: true, // Optional, default: true
|
|
191
|
+
isSorting: true, // Optional, default: true
|
|
192
|
+
isSrno: true, // Optional, default: false
|
|
193
|
+
isSrnoText: "ID" // Optional, default: "Sr.No"
|
|
46
194
|
});
|
|
47
195
|
</script>
|
|
48
196
|
</body>
|
|
@@ -65,9 +213,8 @@ npm install mgsdatatable
|
|
|
65
213
|
<title>mgsDataTable</title>
|
|
66
214
|
</head>
|
|
67
215
|
<body>
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
</div>
|
|
216
|
+
|
|
217
|
+
<div id="myTable"> </div>
|
|
71
218
|
|
|
72
219
|
<script type="module">
|
|
73
220
|
import mgsDataTable from 'mgsdatatable';
|
|
@@ -75,17 +222,15 @@ npm install mgsdatatable
|
|
|
75
222
|
mgsDataTable({
|
|
76
223
|
target: "#myTable", // Required
|
|
77
224
|
url: "http://localhost/mgs/users", // Required
|
|
78
|
-
data: {}, // Optional
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
isPagination: true, // Optional, default is true
|
|
88
|
-
isSorting: true // Optional, default is true
|
|
225
|
+
data: {}, // Optional, if use laravel then send Laravel CSRF Token {token: "{{csrf_token()}}"}, if use api with Bearer Token (Auth API) to send {bearerToken: 'bearerToken'} other wise No auth / extra filters to send your data.
|
|
226
|
+
pageLimits:[2,3,4,5], // Optional, default: [10,20,30,50,100]
|
|
227
|
+
isLimit: true, // Optional, default: true
|
|
228
|
+
isSearch: true, // Optional, default: true
|
|
229
|
+
isResult: true, // Optional, default: true
|
|
230
|
+
isPagination: true, // Optional, default: true
|
|
231
|
+
isSorting: true, // Optional, default: true
|
|
232
|
+
isSrno: true, // Optional, default: false
|
|
233
|
+
isSrnoText: "ID" // Optional, default: "Sr.No"
|
|
89
234
|
});
|
|
90
235
|
</script>
|
|
91
236
|
</body>
|
package/dist/mgsdatatable.min.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self).mgsDataTable={})}(this,function(e){"use strict";function n(e,n,t,o,
|
|
1
|
+
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self).mgsDataTable={})}(this,function(e){"use strict";function n(e,n,t,o,i,l,r){try{var a=e[l](r),s=a.value}catch(e){return void t(e)}a.done?n(s):Promise.resolve(s).then(o,i)}function t(e,n,t){return(n=function(e){var n=function(e,n){if("object"!=typeof e||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var o=t.call(e,n||"default");if("object"!=typeof o)return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(e)}(e,"string");return"symbol"==typeof n?n:n+""}(n))in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function o(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);n&&(o=o.filter(function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable})),t.push.apply(t,o)}return t}function i(e){for(var n=1;n<arguments.length;n++){var i=null!=arguments[n]?arguments[n]:{};n%2?o(Object(i),!0).forEach(function(n){t(e,n,i[n])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(i)):o(Object(i)).forEach(function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(i,n))})}return e}function l(e,n){if(null==e)return{};var t,o,i=function(e,n){if(null==e)return{};var t={};for(var o in e)if({}.hasOwnProperty.call(e,o)){if(-1!==n.indexOf(o))continue;t[o]=e[o]}return t}(e,n);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(o=0;o<l.length;o++)t=l[o],-1===n.indexOf(t)&&{}.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}function r(){
|
|
2
2
|
/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */
|
|
3
|
-
var e,n,t="function"==typeof Symbol?Symbol:{},o=t.iterator||"@@iterator",r=t.toStringTag||"@@toStringTag";function a(t,o,r,a){var i=o&&o.prototype instanceof s?o:s,d=Object.create(i.prototype);return l(d,"_invoke",function(t,o,r){var a,i,l,s=0,d=r||[],u=!1,p={p:0,n:0,v:e,a:g,f:g.bind(e,4),d:function(n,t){return a=n,i=0,l=e,p.n=t,c}};function g(t,o){for(i=t,l=o,n=0;!u&&s&&!r&&n<d.length;n++){var r,a=d[n],g=p.p,m=a[2];t>3?(r=m===o)&&(l=a[(i=a[4])?5:(i=3,3)],a[4]=a[5]=e):a[0]<=g&&((r=t<2&&g<a[1])?(i=0,p.v=o,p.n=a[1]):g<m&&(r=t<3||a[0]>o||o>m)&&(a[4]=t,a[5]=o,p.n=m,i=0))}if(r||t>1)return c;throw u=!0,o}return function(r,d,m){if(s>1)throw TypeError("Generator is already running");for(u&&1===d&&g(d,m),i=d,l=m;(n=i<2?e:l)||!u;){a||(i?i<3?(i>1&&(p.n=-1),g(i,l)):p.n=l:p.v=l);try{if(s=2,a){if(i||(r="next"),n=a[r]){if(!(n=n.call(a,l)))throw TypeError("iterator result is not an object");if(!n.done)return n;l=n.value,i<2&&(i=0)}else 1===i&&(n=a.return)&&n.call(a),i<2&&(l=TypeError("The iterator does not provide a '"+r+"' method"),i=1);a=e}else if((n=(u=p.n<0)?l:t.call(o,p))!==c)break}catch(n){a=e,i=1,l=n}finally{s=1}}return{value:n,done:u}}}(t,r,a),!0),d}var c={};function s(){}function d(){}function u(){}n=Object.getPrototypeOf;var p=[][o]?n(n([][o]())):(l(n={},o,function(){return this}),n),g=u.prototype=s.prototype=Object.create(p);function m(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,u):(e.__proto__=u,l(e,r,"GeneratorFunction")),e.prototype=Object.create(g),e}return d.prototype=u,l(g,"constructor",u),l(u,"constructor",d),d.displayName="GeneratorFunction",l(u,r,"GeneratorFunction"),l(g),l(g,r,"Generator"),l(g,o,function(){return this}),l(g,"toString",function(){return"[object Generator]"}),(i=function(){return{w:a,m:m}})()}function l(e,n,t,o){var r=Object.defineProperty;try{r({},"",{})}catch(e){r=0}l=function(e,n,t,o){function a(n,t){l(e,n,function(e){return this._invoke(n,t,e)})}n?r?r(e,n,{value:t,enumerable:!o,configurable:!o,writable:!o}):e[n]=t:(a("next",0),a("throw",1),a("return",2))},l(e,n,t,o)}var c=["token","bearerToken"],s=0,d={target:"",url:"",methodType:"post",data:{},pageLimits:[10,20,30,50,100],page:1,limit:10,column:"",sort:"asc",search:"",prevPage:null,nextPage:null,isSearch:!0,isLimit:!0,isResult:!0,isPagination:!0,isSorting:!0},u=function(){var e,o=(e=i().m(function e(n){var o,l,u,g,m,v,f,y,h,b,x,P,w,_,S,L,T,j,O,k,E,A,C,M,I,q,H,D,N,F,z,R,G,B,U,X,J,W,K,Q,V,Y,Z,$,ee,ne,te,oe,re,ae,ie,le,ce,se,de,ue,pe,ge,me,ve,fe,ye,he,be,xe,Pe,we,_e,Se,Le,Te,je,Oe,ke,Ee,Ae,Ce,Me,Ie,qe,He,De,Ne,Fe,ze,Re,Ge,Be,Ue,Xe,Je,We,Ke,Qe,Ve,Ye,Ze,$e;return i().w(function(e){for(;;)switch(e.p=e.n){case 0:if(d=r(r({},d),n),null!==(o=d)&&void 0!==o&&o.target){e.n=1;break}return alert("Target is requied."),e.a(2);case 1:if(null!==(l=d)&&void 0!==l&&l.url){e.n=2;break}return alert("URL is requied."),e.a(2);case 2:return R=null===(u=d)||void 0===u?void 0:u.target,G=null!==(g=null===(m=d)||void 0===m?void 0:m.url)&&void 0!==g?g:"/",B=r({},null===(v=d)||void 0===v?void 0:v.data),U=B.token,X=B.bearerToken,J=a(B,c),W=null===(f=d)||void 0===f?void 0:f.methodType,K=null!==(y=null===(h=d)||void 0===h?void 0:h.page)&&void 0!==y?y:1,Q=null!==(b=null===(x=d)||void 0===x?void 0:x.limit)&&void 0!==b?b:10,V=null!==(P=null===(w=d)||void 0===w?void 0:w.pageLimits)&&void 0!==P?P:[10,20,30,50,100],Y=null===(_=d)||void 0===_?void 0:_.search,Z=null===(S=d)||void 0===S?void 0:S.column,$=null===(L=d)||void 0===L?void 0:L.sort,ee=null!==(T=null===(j=d)||void 0===j?void 0:j.nextPage)&&void 0!==T?T:null,ne=null!==(O=null===(k=d)||void 0===k?void 0:k.prevPage)&&void 0!==O?O:null,te=null===(E=null===(A=d)||void 0===A?void 0:A.isSearch)||void 0===E||E,oe=null===(C=null===(M=d)||void 0===M?void 0:M.isLimit)||void 0===C||C,re=null===(I=null===(q=d)||void 0===q?void 0:q.isResult)||void 0===I||I,ae=null===(H=null===(D=d)||void 0===D?void 0:D.isPagination)||void 0===H||H,ie=null===(N=null===(F=d)||void 0===F?void 0:F.isSorting)||void 0===N||N,J=r(r({},J),{},{page:K,limit:Q}),null!=Y&&null!=Y&&""!=Y.trim()&&(J=r(r({},J),{},{search:Y})),null!=Z&&null!=Z&&""!=Z.trim()&&(J=r(r({},J),{},{column:Z,sort:$})),le="post"===W.toLowerCase(),(ce=new Headers).append("Content-Type","application/json"),le&&U&&ce.append("X-CSRF-Token",U),X&&ce.append("Authorization","Bearer ".concat(X)),se={method:null===(z=d)||void 0===z?void 0:z.methodType,headers:ce,body:JSON.stringify(J)},de=document.querySelector(R),null==(ue=document.querySelector("._mgsErrorMessage"))||ue.remove(),(pe=document.createElement("div")).className="_mgsSpinner",pe.innerHTML='<i class="fa fa-spinner fa-spin"></i> Loading...',pe.style.cssText="\n position: fixed;\n z-index: 1031;\n width: 70%;\n height: 30%;\n display: flex;\n justify-content: center;\n align-items: center;\n font-size: 20px;\n ",de.insertAdjacentElement("beforebegin",pe),e.p=3,e.n=4,fetch(G,se);case 4:return ye=e.v,e.n=5,ye.json();case 5:if(he=e.v,be=null!==(ge=null==he?void 0:he.data)&&void 0!==ge?ge:[],xe=null!==(me=null==he||null===(ve=he.data)||void 0===ve?void 0:ve.data)&&void 0!==me?me:[],Pe=null!==(fe=null==he?void 0:he.column)&&void 0!==fe?fe:[],we=null!=(null==be?void 0:be.from)&&null!=(null==be?void 0:be.from)&&""!=(null==be?void 0:be.from)?null==be?void 0:be.from:0,_e=null!=(null==be?void 0:be.to)&&null!=(null==be?void 0:be.to)&&""!=(null==be?void 0:be.to)?null==be?void 0:be.to:0,Se=null!=(null==be?void 0:be.total)&&null!=(null==be?void 0:be.total)&&""!=(null==be?void 0:be.total)?null==be?void 0:be.total:0,Le=Math.ceil(Se/Q),Te=Le+2,ee=Le>1&&null==ee&&null==ne?2:ee,(je=document.querySelector("._mgsPaginateResult"))&&je.remove(),(Oe=de.querySelector("tbody"))&&(null==xe?void 0:xe.length)>0&&Oe.remove(),0==s&&(te||oe)&&(ke="",oe&&V.forEach(function(e){ke+='<option value="'.concat(e,'">').concat(e,"</option>")}),Ee='\n <div class="_mgsPerPageSearch"> \n '.concat(oe?'<div class="_mgsPerPageStyle">\n <span>Show</span> \n <select class="_mgsPerPageLimit form-control" name="_mgsPerPageLimit" style="width:100px;padding:8px 10px;border:1px solid #ccc;border-radius:4px;">'.concat(ke,"</select>\n </div>"):"","\n ").concat(te?'<div class="_mgsSearchStyle"> \n <span>Search</span> \n <input type="text" class="form-control _mgsSearchAnyField" name="_mgsSearchAnyField" value="'.concat(Y,'" placeholder="Search any field..." style="width:195px;padding:8px 10px;border:1px solid #ccc;border-radius:4px;">\n </div> '):"","\n </div>\n "),de.insertAdjacentHTML("beforebegin",Ee),(Ae=document.querySelector("._mgsPerPageSearch"))&&(Ae.style.display="flex",Ae.style.justifyContent="space-between",Ae.style.alignItems="center",Ae.style.gap="10px",Ae.style.marginBottom="10px")),(Ce=document.createElement("table")).style.cssText="\n width: 100%;\n min-width: 100%;\n max-width: 100%;\n padding: 10px 5px;\n vertical-align: top;\n border: 1px solid rgb(222, 226, 230);\n background-color: #fff;\n color: #212529;\n border-collapse: collapse;\n ",Me=document.createElement("thead"),Ie=document.createElement("tr"),Pe.forEach(function(e,n){e=p(e);var t=document.createElement("th");(null==xe?void 0:xe.length)>0&&ie&&"Action"!=e&&t.classList.add("_mgsSort"),ie&&"Action"!=e?(t.setAttribute("data-column",n),Z&&n==Z&&"desc"==$?(t.setAttribute("data-sort","desc"),t.innerHTML="".concat(e,' <span style="font-size:14px !important">βΌ</span>')):(t.setAttribute("data-sort","asc"),t.innerHTML="".concat(e,' <span style="font-size:14px !important">β²</span>'))):t.innerHTML=e,t.style.cssText="\n background-color: #f8f9fa;\n font-weight: bold;\n cursor: ".concat((null==xe?void 0:xe.length)>0?"pointer":"not-allowed",";\n width: 150px;\n min-width: 150px;\n max-width: 150px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n text-align:left;\n padding: 2px;\n border-top: 1px solid rgb(222, 226, 230);\n "),Ie.appendChild(t)}),Me.appendChild(Ie),Ce.appendChild(Me),qe=document.createElement("tbody"),(null==xe?void 0:xe.length)>0?xe.forEach(function(e,n){var t=document.createElement("tr");Pe.forEach(function(n){var o=document.createElement("td");o.style.cssText="\n width: 150px;\n min-width: 150px;\n max-width: 150px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n padding: 2px;\n border-top: 1px solid rgb(222, 226, 230);\n ",o.innerHTML=e[n],o.title=e[n],t.appendChild(o)}),qe.appendChild(t)}):(He=document.createElement("tr"),(De=document.createElement("td")).innerHTML="Data not Found",De.setAttribute("colspan",null==Pe?void 0:Pe.length),De.style.cssText="\n width: 100%;\n padding: 2px;\n border-top: 1px solid rgb(222, 226, 230);\n text-align: center;\n color:red;\n ",He.appendChild(De),qe.appendChild(He)),Ce.appendChild(qe),de.innerHTML="",de.appendChild(Ce),de&&(de.style.width="100%",de.style.overflowX="auto"),(Ne=document.querySelector(R+" table"))&&(Ne.style.borderCollapse="collapse",Ne.style.minWidth="100%"),document.querySelectorAll(R+" th, "+R+" td").forEach(function(e){e.style.padding="16px 8px",e.style.borderTop="1px solid #ddd",e.style.whiteSpace="nowrap"}),Fe="",Te>0)for((ze=document.createElement("style")).textContent="\n ._mgsPagination {\n display: flex;\n list-style: none;\n padding: 0;\n gap: 6px;\n }\n ._mgsPageItem {\n display: inline-block;\n }\n ._mgsPageLink {\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: 36px;\n height: 36px;\n padding: 0 10px;\n border: 1px solid #0ec6d5;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #0ec6d5;\n text-decoration: none;\n transition: all 0.2s ease-in-out;\n }\n ._mgsPageLink:hover {\n background-color: #0ec6d5;\n color: #fff;\n }\n ._mgsPageItem.active ._mgsPageLink {\n background-color: #0ec6d5;\n color: #fff;\n border-color: #0ec6d5;\n }\n ._mgsPageItem.disabled ._mgsPageLink {\n border-color: #ccc;\n color: #ccc;\n pointer-events: none;\n cursor: not-allowed;\n }\n ",document.head.appendChild(ze),Re=!0,Ge=0;Ge<Te;Ge++)Be=t({0:"Β« Previous"},Te-1,"Next Β»"),Ue=Be[Ge]?Be[Ge]:Ge,Xe="Β« Previous"==Be[Ge]?ne:"Next Β»"==Be[Ge]?ee:Ge,Je=null==Xe?"cursor: not-allowed !important;":"cursor: pointer !important;",We=null==Xe?"disabled":Xe==K?"active":"",Ke=Ue,2==Te&&(Xe=null,We="disabled"),Le>5&&["Β« Previous",1,2,3,"Next Β»"].includes(Ue)&&K<3?(Ke=Ue,Fe+='<li class="_mgsPageItem '.concat(We,'" style="').concat(Je,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Le,'" href="').concat(Xe,'">').concat(Ke,"</a>\n </li>")):Le>5&&K>2?(We=null==Xe?"disabled":Xe+1==K?"active":"",Ke=K>=3&&!["Β« Previous","Next Β»"].includes(Ue)?Ue+1:Ue,1==Ge?Fe+='<li class="_mgsPageItem '.concat(We,'" style="').concat(Je,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Le,'" href="1">1</a>\n </li>'):K-1<=Ge&&K>=Ge&&Ge<=K+1&&Ge<Le-2&&!["Β« Previous","Next Β»"].includes(Ue)?Fe+='<li class="_mgsPageItem '.concat(We,'" style="').concat(Je,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Le,'" href="').concat(Xe+1,'">').concat(Ke,"</a>\n </li>"):Le>5&&Ge>3&&Ge<Le-1&&!["Β« Previous","Next Β»"].includes(Ue)?Re&&(Re=!1,Ke="...",Fe+='<li class="_mgsPageItem '.concat(We,'" style="').concat(Je,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Le,'" href="').concat(Xe+1,'">').concat(Ke,"</a>\n </li>")):(Ke=Ue,Fe+='<li class="_mgsPageItem '.concat(We=null==Xe?"disabled":Xe==K?"active":"",'" style="').concat(Je,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Le,'" href="').concat(Xe,'">').concat(Ke,"</a>\n </li>"))):Le>5&&Ge>3&&Ge<Le-1&&!["Β« Previous","Next Β»"].includes(Ue)?Re&&(Re=!1,Ke="...",Fe+='<li class="_mgsPageItem '.concat(We,'" style="').concat(Je,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Le,'" href="').concat(Xe,'">').concat(Ke,"</a>\n </li>")):(Ke=Ue,Fe+='<li class="_mgsPageItem '.concat(We,'" style="').concat(Je,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Le,'" href="').concat(Xe,'">').concat(Ke,"</a>\n </li>"));Qe='\n <div class="_mgsPaginateResult">\n '.concat(re?"<div>Showing ".concat(we," to ").concat(_e," of ").concat(Se," results</div>"):"","\n ").concat(ae?'<div style="margin-top:10px;"> \n <ul class="mgsPagination" style="margin-left: auto !important"> \n '.concat(Fe,"\n </ul> \n </div> "):"","\n </div>"),de.insertAdjacentHTML("afterend",Qe),(Ve=document.querySelector("._mgsPaginateResult"))&&(Ve.style.display="flex",Ve.style.justifyContent="space-between",Ve.style.alignItems="center",Ve.style.gap="10px"),(null==xe?void 0:xe.length)>0&&s++,setTimeout(function(){pe.remove()},500),e.n=7;break;case 6:e.p=6,$e=e.v,Ye='\n <div class="_mgsErrorMessage" style="text-align: center; display: block; margin: 10px auto; font-weight: bold; margin-top:50px;"> \n <p>Error Message : <span style=\'color: red; margin-left:10px;\'>'.concat($e.message,"</span></p>\n </div>\n "),de.innerHTML="",de.insertAdjacentHTML("beforebegin",Ye),null==(Ze=document.querySelector("._mgsSpinner"))||Ze.remove();case 7:return e.a(2)}},e,null,[[3,6]])}),function(){var t=this,o=arguments;return new Promise(function(r,a){var i=e.apply(t,o);function l(e){n(i,r,a,l,c,"next",e)}function c(e){n(i,r,a,l,c,"throw",e)}l(void 0)})});return function(e){return o.apply(this,arguments)}}();function p(e){return e.replace(/_/g," ").replace(/\b\w/g,function(e){return e.toUpperCase()})}document.addEventListener("click",function(e){var n=e.target.closest("._mgsPageItem");if(n){e.preventDefault(),n.textContent.trim();var t=n.querySelector("._mgsPageLink"),o=null==t?void 0:t.getAttribute("href"),r=null==t?void 0:t.getAttribute("data-mxpage");if(!o||"null"===o)return t.setAttribute("disabled",!0),void(t.style.cssText="cursor: not-allowed !important;");var a=parseInt(o),i=a>=r?null:a+1,l=a<=1?null:a-1;null==t||t.setAttribute("href",i),t.style.cssText=null==i||null==l?"cursor: not-allowed !important;":"cursor: pointer !important;",u({page:a,prevPage:l,nextPage:i})}}),document.addEventListener("change",function(e){var n=e.target;if(n.classList.contains("_mgsPerPageLimit")){e.preventDefault();var t=parseInt(n.value,10);u({page:1,limit:t,prevPage:null,nextPage:null})}}),document.addEventListener("keyup",function(e){var n=e.target;if(n.classList.contains("_mgsSearchAnyField")&&(e.preventDefault(),"Enter"===e.key)){var t=n.value;document.querySelectorAll("._mgsSort").forEach(function(e){var n=p(e.textContent.trim());e.innerHTML="".concat(n,' <span style="font-size:14px !important">β²</span>'),e.setAttribute("data-sort","asc")});u({page:1,column:"",sort:"",search:t,prevPage:null,nextPage:null})}}),document.addEventListener("click",function(e){var n=e.target.closest("._mgsSort");if(n){e.preventDefault();var t=n.getAttribute("data-column"),o=n.getAttribute("data-sort");u({page:1,column:t,sort:"asc"===o?"desc":"asc"})}}),window.mgsDataTable=u,window.mgsCapitalizeFirstLetter=p,e.mgsCapitalizeFirstLetter=p,e.mgsDataTable=u,Object.defineProperty(e,"__esModule",{value:!0})});
|
|
3
|
+
var e,n,t="function"==typeof Symbol?Symbol:{},o=t.iterator||"@@iterator",i=t.toStringTag||"@@toStringTag";function l(t,o,i,l){var r=o&&o.prototype instanceof c?o:c,d=Object.create(r.prototype);return a(d,"_invoke",function(t,o,i){var l,r,a,c=0,d=i||[],u=!1,p={p:0,n:0,v:e,a:g,f:g.bind(e,4),d:function(n,t){return l=n,r=0,a=e,p.n=t,s}};function g(t,o){for(r=t,a=o,n=0;!u&&c&&!i&&n<d.length;n++){var i,l=d[n],g=p.p,m=l[2];t>3?(i=m===o)&&(a=l[(r=l[4])?5:(r=3,3)],l[4]=l[5]=e):l[0]<=g&&((i=t<2&&g<l[1])?(r=0,p.v=o,p.n=l[1]):g<m&&(i=t<3||l[0]>o||o>m)&&(l[4]=t,l[5]=o,p.n=m,r=0))}if(i||t>1)return s;throw u=!0,o}return function(i,d,m){if(c>1)throw TypeError("Generator is already running");for(u&&1===d&&g(d,m),r=d,a=m;(n=r<2?e:a)||!u;){l||(r?r<3?(r>1&&(p.n=-1),g(r,a)):p.n=a:p.v=a);try{if(c=2,l){if(r||(i="next"),n=l[i]){if(!(n=n.call(l,a)))throw TypeError("iterator result is not an object");if(!n.done)return n;a=n.value,r<2&&(r=0)}else 1===r&&(n=l.return)&&n.call(l),r<2&&(a=TypeError("The iterator does not provide a '"+i+"' method"),r=1);l=e}else if((n=(u=p.n<0)?a:t.call(o,p))!==s)break}catch(n){l=e,r=1,a=n}finally{c=1}}return{value:n,done:u}}}(t,i,l),!0),d}var s={};function c(){}function d(){}function u(){}n=Object.getPrototypeOf;var p=[][o]?n(n([][o]())):(a(n={},o,function(){return this}),n),g=u.prototype=c.prototype=Object.create(p);function m(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,u):(e.__proto__=u,a(e,i,"GeneratorFunction")),e.prototype=Object.create(g),e}return d.prototype=u,a(g,"constructor",u),a(u,"constructor",d),d.displayName="GeneratorFunction",a(u,i,"GeneratorFunction"),a(g),a(g,i,"Generator"),a(g,o,function(){return this}),a(g,"toString",function(){return"[object Generator]"}),(r=function(){return{w:l,m:m}})()}function a(e,n,t,o){var i=Object.defineProperty;try{i({},"",{})}catch(e){i=0}a=function(e,n,t,o){function l(n,t){a(e,n,function(e){return this._invoke(n,t,e)})}n?i?i(e,n,{value:t,enumerable:!o,configurable:!o,writable:!o}):e[n]=t:(l("next",0),l("throw",1),l("return",2))},a(e,n,t,o)}var s=["token","bearerToken"],c=0,d={target:"",url:"",methodType:"post",data:{},pageLimits:[10,20,30,50,100],page:1,limit:null,column:"",sort:"asc",search:"",prevPage:null,nextPage:null,isSearch:!0,isLimit:!0,isResult:!0,isPagination:!0,isSorting:!0,isSrno:!1,isSrnoText:"Sr.No."},u=function(){var e,o=(e=r().m(function e(n){var o,a,u,m,f,v,y,b,h,x,P,w,_,S,T,L,j,E,O,k,C,A,M,I,N,D,H,q,F,z,R,G,B,U,W,X,J,K,Q,V,Y,Z,$,ee,ne,te,oe,ie,le,re,ae,se,ce,de,ue,pe,ge,me,fe,ve,ye,be,he,xe,Pe,we,_e,Se,Te,Le,je,Ee,Oe,ke,Ce,Ae,Me,Ie,Ne,De,He,qe,Fe,ze,Re,Ge,Be,Ue,We,Xe,Je,Ke,Qe,Ve,Ye,Ze,$e,en,nn,tn,on,ln,rn,an,sn;return r().w(function(e){for(;;)switch(e.p=e.n){case 0:if(d=i(i({},d),n),null!==(o=d)&&void 0!==o&&o.target){e.n=1;break}return g("Target is requied in function mgsDataTable","error"),e.a(2);case 1:if(null!==(a=d)&&void 0!==a&&a.url){e.n=2;break}return g("URL is required in function mgsDataTable","error"),e.a(2);case 2:return J=null===(u=d)||void 0===u?void 0:u.target,K=null!==(m=null===(f=d)||void 0===f?void 0:f.url)&&void 0!==m?m:"/",Q=i({},null===(v=d)||void 0===v?void 0:v.data),V=Q.token,Y=Q.bearerToken,Z=l(Q,s),$=null===(y=d)||void 0===y?void 0:y.methodType,ee=null!==(b=null===(h=d)||void 0===h?void 0:h.page)&&void 0!==b?b:1,ne=null!==(x=null===(P=d)||void 0===P?void 0:P.pageLimits)&&void 0!==x?x:[10,20,30,50,100],te=null!==(w=d)&&void 0!==w&&w.limit?null===(_=d)||void 0===_?void 0:_.limit:null!==(S=ne[0])&&void 0!==S?S:10,oe=null===(T=d)||void 0===T?void 0:T.search,ie=null===(L=d)||void 0===L?void 0:L.column,le=null===(j=d)||void 0===j?void 0:j.sort,re=null!==(E=null===(O=d)||void 0===O?void 0:O.nextPage)&&void 0!==E?E:null,ae=null!==(k=null===(C=d)||void 0===C?void 0:C.prevPage)&&void 0!==k?k:null,se=null===(A=null===(M=d)||void 0===M?void 0:M.isSearch)||void 0===A||A,ce=null===(I=null===(N=d)||void 0===N?void 0:N.isLimit)||void 0===I||I,de=null===(D=null===(H=d)||void 0===H?void 0:H.isResult)||void 0===D||D,ue=null===(q=null===(F=d)||void 0===F?void 0:F.isPagination)||void 0===q||q,pe=null===(z=null===(R=d)||void 0===R?void 0:R.isSorting)||void 0===z||z,ge=null!==(G=null===(B=d)||void 0===B?void 0:B.isSrno)&&void 0!==G&&G,me=null!==(U=null===(W=d)||void 0===W?void 0:W.isSrnoText)&&void 0!==U?U:"Sr.No.",Z=i(i({},Z),{},{page:ee,limit:te}),null!=oe&&null!=oe&&""!=oe.trim()&&(Z=i(i({},Z),{},{search:oe})),null!=ie&&null!=ie&&""!=ie.trim()&&(Z=i(i({},Z),{},{column:ge?ie-1:ie,sort:le})),fe="post"===$.toLowerCase(),(ve=new Headers).append("Content-Type","application/json"),fe&&V&&ve.append("X-CSRF-Token",V),Y&&ve.append("Authorization","Bearer ".concat(Y)),ye={method:null===(X=d)||void 0===X?void 0:X.methodType,headers:ve,body:JSON.stringify(Z)},be=document.querySelector(J),null==(he=document.querySelector("._mgsErrorMessage"))||he.remove(),(xe=document.createElement("div")).className="_mgsSpinner",xe.innerHTML='<i class="fa fa-spinner fa-spin"></i> Loading...',xe.style.cssText="\n position: fixed;\n z-index: 1031;\n width: 80%;\n height: 30%;\n display: flex;\n justify-content: center;\n align-items: center;\n font-size: 25px;\n color: #0ec6d5;\n ",be.insertAdjacentElement("beforebegin",xe),e.p=3,e.n=4,fetch(K,ye);case 4:return Te=e.v,e.n=5,Te.json();case 5:if(Le=e.v,je=null!==(Pe=null==Le?void 0:Le.data)&&void 0!==Pe?Pe:[],Ee=null!==(we=null==Le||null===(_e=Le.data)||void 0===_e?void 0:_e.data)&&void 0!==we?we:[],Oe=null!==(Se=null==Le?void 0:Le.column)&&void 0!==Se?Se:[],ke=null!=(null==je?void 0:je.from)&&null!=(null==je?void 0:je.from)&&""!=(null==je?void 0:je.from)?null==je?void 0:je.from:0,Ce=null!=(null==je?void 0:je.to)&&null!=(null==je?void 0:je.to)&&""!=(null==je?void 0:je.to)?null==je?void 0:je.to:0,Ae=null!=(null==je?void 0:je.total)&&null!=(null==je?void 0:je.total)&&""!=(null==je?void 0:je.total)?null==je?void 0:je.total:0,Me=Math.ceil(Ae/te),Ie=Me+2,re=Me>1&&null==re&&null==ae?2:re,(Ne=document.querySelector("._mgsPaginateResult"))&&Ne.remove(),(De=be.querySelector("tbody"))&&(null==Ee?void 0:Ee.length)>0&&De.remove(),0==c&&(se||ce)&&(He="",ce&&ne.forEach(function(e){He+='<option value="'.concat(e,'">').concat(e,"</option>")}),qe='\n <div class="_mgsPerPageSearch"> \n '.concat(ce?'<div class="_mgsPerPageStyle">\n <span>Show</span> \n <select class="_mgsPerPageLimit form-control" name="_mgsPerPageLimit" style="width:100px;padding:8px 10px;border:1px solid #ccc;border-radius:4px;">'.concat(He,"</select>\n </div>"):"","\n ").concat(se?'<div class="_mgsSearchStyle"> \n <span>Search</span> \n <input type="text" class="form-control _mgsSearchAnyField" name="_mgsSearchAnyField" value="'.concat(oe,'" placeholder="Search any field..." style="width:195px;padding:8px 10px;border:1px solid #ccc;border-radius:4px;">\n </div> '):"","\n </div>\n "),be.insertAdjacentHTML("beforebegin",qe),(Fe=document.querySelector("._mgsPerPageSearch"))&&(Fe.style.display="flex",Fe.style.justifyContent="space-between",Fe.style.alignItems="center",Fe.style.gap="10px",Fe.style.marginBottom="10px")),(ze=document.createElement("table")).style.cssText="\n width: 100%;\n min-width: 100%;\n max-width: 100%;\n padding: 10px 5px;\n vertical-align: top;\n border: 1px solid rgb(222, 226, 230);\n background-color: #fff;\n color: #212529;\n border-collapse: collapse;\n ",Re=document.createElement("thead"),Ge=document.createElement("tr"),ge&&Oe.unshift(me),Oe.forEach(function(e,n){e=p(e);var t=document.createElement("th");if((null==Ee?void 0:Ee.length)>0&&pe&&!["Action",me].includes(e)&&t.classList.add("_mgsSort"),t.title=e,t.style.cssText="\n background-color: #f8f9fa;\n font-weight: bold;\n cursor: ".concat((null==Ee?void 0:Ee.length)>0?"pointer":"not-allowed",";\n width: 150px;\n min-width: 150px;\n max-width: 150px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n text-align:left;\n padding: 2px;\n border-top: 1px solid rgb(222, 226, 230);\n position:relative;\n "),pe&&!["Action",me].includes(e)){t.setAttribute("data-column",n),t.innerHTML="".concat(e," ");var o=document.createElement("span");o.style.position="absolute",o.style.display="none",o.style.fontSize="12px",ie&&n==ie&&"desc"==le?(t.setAttribute("data-sort","desc"),o.innerHTML="βΌ"):(t.setAttribute("data-sort","asc"),o.innerHTML="β²"),t.addEventListener("mouseenter",function(){o.style.display="inline"}),t.addEventListener("mouseleave",function(){o.style.display=ie&&n==ie?"inline":"none"}),ie&&n==ie?(t.style.color="#0ec6d5",o.style.display="inline"):t.style.color="default",t.appendChild(o)}else t.innerHTML=e,t.style.cursor="default";Ge.appendChild(t)}),Re.appendChild(Ge),ze.appendChild(Re),Be=document.createElement("tbody"),(null==Ee?void 0:Ee.length)>0?Ee.forEach(function(e,n){var t=document.createElement("tr");Oe.forEach(function(o,i){var l=document.createElement("td");l.style.cssText="\n width: 150px;\n min-width: 150px;\n max-width: 150px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n padding: 2px;\n border-top: 1px solid rgb(222, 226, 230);\n ",l.innerHTML=ge&&0==i?ke+n:e[o],l.title=e[o],t.appendChild(l)}),Be.appendChild(t)}):(Ue=document.createElement("tr"),(We=document.createElement("td")).innerHTML="Data not Found",We.setAttribute("colspan",null==Oe?void 0:Oe.length),We.style.cssText="\n width: 100%;\n padding: 2px;\n border-top: 1px solid rgb(222, 226, 230);\n text-align: center;\n color:red;\n ",Ue.appendChild(We),Be.appendChild(Ue)),ze.appendChild(Be),be.innerHTML="",be.appendChild(ze),be&&(be.style.width="100%",be.style.overflowX="auto"),(Xe=document.querySelector(J+" table"))&&(Xe.style.borderCollapse="collapse",Xe.style.minWidth="100%"),document.querySelectorAll(J+" th, "+J+" td").forEach(function(e){e.style.padding="16px 8px",e.style.borderTop="1px solid #ddd",e.style.whiteSpace="nowrap"}),Je="",Ie>0)for((Ke=document.createElement("style")).textContent="\n ._mgsPagination {\n display: flex;\n list-style: none;\n padding: 0;\n gap: 6px;\n }\n ._mgsPageItem {\n display: inline-block;\n }\n ._mgsPageLink {\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: 36px;\n height: 36px;\n padding: 0 10px;\n border: 1px solid #0ec6d5;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #0ec6d5;\n text-decoration: none;\n transition: all 0.2s ease-in-out;\n }\n ._mgsPageLink:hover {\n background-color: #0ec6d5;\n color: #fff;\n }\n ._mgsPageItem.active ._mgsPageLink {\n background-color: #0ec6d5;\n color: #fff;\n border-color: #0ec6d5;\n }\n ._mgsPageItem.disabled ._mgsPageLink {\n border-color: #ccc;\n color: #ccc;\n pointer-events: none;\n cursor: not-allowed;\n }\n ",document.head.appendChild(Ke),Qe=!0,Ve=0;Ve<Ie;Ve++)Ye=t({0:"Β« Previous"},Ie-1,"Next Β»"),Ze=Ye[Ve]?Ye[Ve]:Ve,$e="Β« Previous"==Ye[Ve]?ae:"Next Β»"==Ye[Ve]?re:Ve,en=null==$e?"cursor: not-allowed !important;":"cursor: pointer !important;",nn=null==$e?"disabled":$e==ee?"active":"",tn=Ze,2==Ie&&($e=null,nn="disabled"),Me>5&&["Β« Previous",1,2,3,"Next Β»"].includes(Ze)&&ee<3?(tn=Ze,Je+='<li class="_mgsPageItem '.concat(nn,'" style="').concat(en,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Me,'" href="').concat($e,'">').concat(tn,"</a>\n </li>")):Me>5&&ee>2?(nn=null==$e?"disabled":$e+1==ee?"active":"",tn=ee>=3&&!["Β« Previous","Next Β»"].includes(Ze)?Ze+1:Ze,1==Ve?Je+='<li class="_mgsPageItem '.concat(nn,'" style="').concat(en,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Me,'" href="1">1</a>\n </li>'):ee-1<=Ve&&ee>=Ve&&Ve<=ee+1&&Ve<Me-2&&!["Β« Previous","Next Β»"].includes(Ze)?Je+='<li class="_mgsPageItem '.concat(nn,'" style="').concat(en,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Me,'" href="').concat($e+1,'">').concat(tn,"</a>\n </li>"):Me>5&&Ve>3&&Ve<Me-1&&!["Β« Previous","Next Β»"].includes(Ze)?Qe&&(Qe=!1,tn="...",Je+='<li class="_mgsPageItem '.concat(nn,'" style="').concat(en,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Me,'" href="').concat($e+1,'">').concat(tn,"</a>\n </li>")):(tn=Ze,Je+='<li class="_mgsPageItem '.concat(nn=null==$e?"disabled":$e==ee?"active":"",'" style="').concat(en,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Me,'" href="').concat($e,'">').concat(tn,"</a>\n </li>"))):Me>5&&Ve>3&&Ve<Me-1&&!["Β« Previous","Next Β»"].includes(Ze)?Qe&&(Qe=!1,tn="...",Je+='<li class="_mgsPageItem '.concat(nn,'" style="').concat(en,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Me,'" href="').concat($e,'">').concat(tn,"</a>\n </li>")):(tn=Ze,Je+='<li class="_mgsPageItem '.concat(nn,'" style="').concat(en,'">\n <a class="_mgsPageLink" data-mxpage="').concat(Me,'" href="').concat($e,'">').concat(tn,"</a>\n </li>"));on='\n <div class="_mgsPaginateResult">\n '.concat(de?"<div>Showing ".concat(ke," to ").concat(Ce," of ").concat(Ae," results</div>"):"","\n ").concat(ue?'<div style="margin-top:10px;"> \n <ul class="mgsPagination" style="margin-left: auto !important"> \n '.concat(Je,"\n </ul> \n </div> "):"","\n </div>"),be.insertAdjacentHTML("afterend",on),(ln=document.querySelector("._mgsPaginateResult"))&&(ln.style.display="flex",ln.style.justifyContent="space-between",ln.style.alignItems="center",ln.style.gap="10px"),(null==Ee?void 0:Ee.length)>0&&c++,setTimeout(function(){xe.remove()},500),e.n=7;break;case 6:e.p=6,sn=e.v,rn='\n <div class="_mgsErrorMessage" style="text-align: center; display: block; margin: 10px auto; font-weight: bold; margin-top:50px;"> \n <p>Error Message : <span style=\'color: red; margin-left:10px;\'>'.concat(sn.message,"</span></p>\n </div>\n "),be.innerHTML="",be.insertAdjacentHTML("beforebegin",rn),null==(an=document.querySelector("._mgsSpinner"))||an.remove();case 7:return e.a(2)}},e,null,[[3,6]])}),function(){var t=this,o=arguments;return new Promise(function(i,l){var r=e.apply(t,o);function a(e){n(r,i,l,a,s,"next",e)}function s(e){n(r,i,l,a,s,"throw",e)}a(void 0)})});return function(e){return o.apply(this,arguments)}}();function p(e){return e.replace(/_/g," ").replace(/\b\w/g,function(e){return e.toUpperCase()})}function g(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"success",t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:4e3,o=document.getElementById("_mgsMessage");o||((o=document.createElement("div")).id="_mgsMessage",o.style.position="fixed",o.style.top="20px",o.style.right="20px",o.style.zIndex="99999",o.style.padding="15px 20px",o.style.borderRadius="5px",o.style.minWidth="200px",o.style.mgsMessageBoxShadow="0 2px 8px rgba(0,0,0,0.15)",o.style.fontFamily="Arial, sans-serif",document.body.appendChild(o)),o.style.display="block",o.innerText=e,o.style.background="success"===n?"#03741dff":"#b30b1bff",o.style.color="#ffff",o.style.border="success"===n?"1px solid #03741dff":"1px solid #b30b1bff",setTimeout(function(){o.style.display="none"},t)}document.addEventListener("click",function(e){var n=e.target.closest("._mgsPageItem");if(n){e.preventDefault(),n.textContent.trim();var t=n.querySelector("._mgsPageLink"),o=null==t?void 0:t.getAttribute("href"),i=null==t?void 0:t.getAttribute("data-mxpage");if(!o||"null"===o)return t.setAttribute("disabled",!0),void(t.style.cssText="cursor: not-allowed !important;");var l=parseInt(o),r=l>=i?null:l+1,a=l<=1?null:l-1;null==t||t.setAttribute("href",r),t.style.cssText=null==r||null==a?"cursor: not-allowed !important;":"cursor: pointer !important;",u({page:l,prevPage:a,nextPage:r})}}),document.addEventListener("change",function(e){var n=e.target;if(n.classList.contains("_mgsPerPageLimit")){e.preventDefault();var t=parseInt(n.value,10);u({page:1,limit:t,prevPage:null,nextPage:null})}}),document.addEventListener("keyup",function(e){var n=e.target;if(n.classList.contains("_mgsSearchAnyField")&&(e.preventDefault(),"Enter"===e.key)){var t=n.value;u({page:1,column:"",sort:"",search:t,prevPage:null,nextPage:null})}}),document.addEventListener("click",function(e){var n=e.target.closest("._mgsSort");if(n){e.preventDefault();var t=n.getAttribute("data-column"),o=n.getAttribute("data-sort");u({page:1,column:t,sort:"asc"===o?"desc":"asc"})}}),window.mgsDataTable=u,window.mgsCapitalizeFirstLetter=p,window.mgsNotifyMessage=g,e.mgsCapitalizeFirstLetter=p,e.mgsDataTable=u,e.mgsNotifyMessage=g,Object.defineProperty(e,"__esModule",{value:!0})});
|
package/package.json
CHANGED
package/src/index.js
CHANGED
|
@@ -7,7 +7,7 @@ let _mgsCommonData = {
|
|
|
7
7
|
data : {},
|
|
8
8
|
pageLimits : [10,20,30,50,100],
|
|
9
9
|
page : 1,
|
|
10
|
-
limit :
|
|
10
|
+
limit : null,
|
|
11
11
|
column : '',
|
|
12
12
|
sort : 'asc',
|
|
13
13
|
search: '',
|
|
@@ -18,15 +18,17 @@ let _mgsCommonData = {
|
|
|
18
18
|
isResult: true,
|
|
19
19
|
isPagination: true,
|
|
20
20
|
isSorting: true,
|
|
21
|
+
isSrno: false,
|
|
22
|
+
isSrnoText:'Sr.No.'
|
|
21
23
|
}
|
|
22
24
|
const mgsDataTable = async (_mgsData) => {
|
|
23
25
|
_mgsCommonData = {..._mgsCommonData, ..._mgsData};
|
|
24
26
|
if(!_mgsCommonData?.target){
|
|
25
|
-
|
|
27
|
+
mgsNotifyMessage('Target is requied in function mgsDataTable', 'error');
|
|
26
28
|
return;
|
|
27
29
|
}
|
|
28
30
|
if(!_mgsCommonData?.url){
|
|
29
|
-
|
|
31
|
+
mgsNotifyMessage('URL is required in function mgsDataTable', 'error')
|
|
30
32
|
return;
|
|
31
33
|
}
|
|
32
34
|
let _mgsTarget = _mgsCommonData?.target;
|
|
@@ -34,8 +36,8 @@ const mgsDataTable = async (_mgsData) => {
|
|
|
34
36
|
let { token, bearerToken, ...allData} = {..._mgsCommonData?.data};
|
|
35
37
|
let methodType = _mgsCommonData?.methodType;
|
|
36
38
|
let page = _mgsCommonData?.page ?? 1;
|
|
37
|
-
let limit = _mgsCommonData?.limit ?? 10;
|
|
38
39
|
let pageLimits = _mgsCommonData?.pageLimits ?? [10,20,30,50,100];
|
|
40
|
+
let limit = (_mgsCommonData?.limit) ? _mgsCommonData?.limit : pageLimits[0] ?? 10;
|
|
39
41
|
let search = _mgsCommonData?.search;
|
|
40
42
|
let column = _mgsCommonData?.column;
|
|
41
43
|
let sort = _mgsCommonData?.sort;
|
|
@@ -46,13 +48,15 @@ const mgsDataTable = async (_mgsData) => {
|
|
|
46
48
|
let isResult = _mgsCommonData?.isResult ?? true;
|
|
47
49
|
let isPagination = _mgsCommonData?.isPagination ?? true;
|
|
48
50
|
let isSorting = _mgsCommonData?.isSorting ?? true;
|
|
51
|
+
let isSrno = _mgsCommonData?.isSrno ?? false;
|
|
52
|
+
let isSrnoText = _mgsCommonData?.isSrnoText ?? 'Sr.No.';
|
|
49
53
|
|
|
50
54
|
allData = { ...allData, page, limit }
|
|
51
55
|
if (search != null && search != undefined && search.trim() != '') {
|
|
52
56
|
allData = { ...allData, search }
|
|
53
57
|
}
|
|
54
58
|
if (column != null && column != undefined && column.trim() != '') {
|
|
55
|
-
allData = { ...allData, column, sort }
|
|
59
|
+
allData = { ...allData, column : (isSrno)?column-1:column, sort }
|
|
56
60
|
}
|
|
57
61
|
|
|
58
62
|
const _mgsIsPost = methodType.toLowerCase() === 'post';
|
|
@@ -79,12 +83,13 @@ const mgsDataTable = async (_mgsData) => {
|
|
|
79
83
|
_mgsSpinner.style.cssText = `
|
|
80
84
|
position: fixed;
|
|
81
85
|
z-index: 1031;
|
|
82
|
-
width:
|
|
86
|
+
width: 80%;
|
|
83
87
|
height: 30%;
|
|
84
88
|
display: flex;
|
|
85
89
|
justify-content: center;
|
|
86
90
|
align-items: center;
|
|
87
|
-
font-size:
|
|
91
|
+
font-size: 25px;
|
|
92
|
+
color: #0ec6d5;
|
|
88
93
|
`;
|
|
89
94
|
_mgsContainer.insertAdjacentElement('beforebegin', _mgsSpinner);
|
|
90
95
|
try {
|
|
@@ -92,7 +97,7 @@ const mgsDataTable = async (_mgsData) => {
|
|
|
92
97
|
const _mgsResp = await _mgsResponse.json();
|
|
93
98
|
const _mgsResult = _mgsResp?.data ?? [];
|
|
94
99
|
const _mgsOutput = _mgsResp?.data?.data ?? [];
|
|
95
|
-
|
|
100
|
+
let _mgsColumn = _mgsResp?.column ?? [];
|
|
96
101
|
const _from = (_mgsResult?.from != undefined && _mgsResult?.from != null && _mgsResult?.from != '')?_mgsResult?.from :0;
|
|
97
102
|
const _to = (_mgsResult?.to != undefined && _mgsResult?.to != null && _mgsResult?.to != '')?_mgsResult?.to :0;
|
|
98
103
|
const _total = (_mgsResult?.total != undefined && _mgsResult?.total != null && _mgsResult?.total != '')?_mgsResult?.total :0;
|
|
@@ -157,24 +162,16 @@ const mgsDataTable = async (_mgsData) => {
|
|
|
157
162
|
// Create thead
|
|
158
163
|
const _mgsThead = document.createElement('thead');
|
|
159
164
|
const _mgsHeadRow = document.createElement('tr');
|
|
165
|
+
if(isSrno){
|
|
166
|
+
_mgsColumn.unshift(isSrnoText);
|
|
167
|
+
}
|
|
160
168
|
_mgsColumn.forEach((text, key) => {
|
|
161
169
|
text = mgsCapitalizeFirstLetter (text);
|
|
162
170
|
const th = document.createElement('th');
|
|
163
|
-
if(_mgsOutput?.length > 0 && isSorting &&
|
|
171
|
+
if(_mgsOutput?.length > 0 && isSorting && !['Action',isSrnoText].includes(text)){
|
|
164
172
|
th.classList.add('_mgsSort');
|
|
165
173
|
}
|
|
166
|
-
|
|
167
|
-
th.setAttribute('data-column', key); // or actual key if mapping to backend
|
|
168
|
-
if (column && key == column && sort == 'desc') {
|
|
169
|
-
th.setAttribute('data-sort', 'desc');
|
|
170
|
-
th.innerHTML = `${text} <span style="font-size:14px !important">βΌ</span>`;
|
|
171
|
-
}else{
|
|
172
|
-
th.setAttribute('data-sort', 'asc');
|
|
173
|
-
th.innerHTML = `${text} <span style="font-size:14px !important">β²</span>`;
|
|
174
|
-
}
|
|
175
|
-
}else{
|
|
176
|
-
th.innerHTML = text;
|
|
177
|
-
}
|
|
174
|
+
th.title = text;
|
|
178
175
|
th.style.cssText = `
|
|
179
176
|
background-color: #f8f9fa;
|
|
180
177
|
font-weight: bold;
|
|
@@ -188,7 +185,44 @@ const mgsDataTable = async (_mgsData) => {
|
|
|
188
185
|
text-align:left;
|
|
189
186
|
padding: 2px;
|
|
190
187
|
border-top: 1px solid rgb(222, 226, 230);
|
|
188
|
+
position:relative;
|
|
191
189
|
`;
|
|
190
|
+
if(isSorting && !['Action',isSrnoText].includes(text)){
|
|
191
|
+
th.setAttribute('data-column', key); // or actual key if mapping to backend
|
|
192
|
+
th.innerHTML = `${text} `;
|
|
193
|
+
// Add sort icon
|
|
194
|
+
const _mgsSortIcon = document.createElement("span");
|
|
195
|
+
_mgsSortIcon.style.position = "absolute";
|
|
196
|
+
_mgsSortIcon.style.display = "none";
|
|
197
|
+
_mgsSortIcon.style.fontSize = "12px";
|
|
198
|
+
if (column && key == column && sort == 'desc') {
|
|
199
|
+
th.setAttribute('data-sort', 'desc');
|
|
200
|
+
_mgsSortIcon.innerHTML = "βΌ";
|
|
201
|
+
}else{
|
|
202
|
+
th.setAttribute('data-sort', 'asc');
|
|
203
|
+
_mgsSortIcon.innerHTML = "β²";
|
|
204
|
+
}
|
|
205
|
+
th.addEventListener("mouseenter", () => {
|
|
206
|
+
_mgsSortIcon.style.display = "inline";
|
|
207
|
+
});
|
|
208
|
+
th.addEventListener("mouseleave", () => {
|
|
209
|
+
if(column && key == column){
|
|
210
|
+
_mgsSortIcon.style.display = "inline";
|
|
211
|
+
}else{
|
|
212
|
+
_mgsSortIcon.style.display = "none";
|
|
213
|
+
}
|
|
214
|
+
});
|
|
215
|
+
if(column && key == column ){
|
|
216
|
+
th.style.color = "#0ec6d5";
|
|
217
|
+
_mgsSortIcon.style.display = "inline";
|
|
218
|
+
}else{
|
|
219
|
+
th.style.color = "default";
|
|
220
|
+
}
|
|
221
|
+
th.appendChild(_mgsSortIcon);
|
|
222
|
+
}else{
|
|
223
|
+
th.innerHTML = text;
|
|
224
|
+
th.style.cursor = 'default'
|
|
225
|
+
}
|
|
192
226
|
_mgsHeadRow.appendChild(th);
|
|
193
227
|
});
|
|
194
228
|
_mgsThead.appendChild(_mgsHeadRow);
|
|
@@ -199,7 +233,7 @@ const mgsDataTable = async (_mgsData) => {
|
|
|
199
233
|
if(_mgsOutput?.length > 0){
|
|
200
234
|
_mgsOutput.forEach((text, key) => {
|
|
201
235
|
let _createRow = document.createElement('tr');
|
|
202
|
-
_mgsColumn.forEach(col => {
|
|
236
|
+
_mgsColumn.forEach((col, ky) => {
|
|
203
237
|
let td = document.createElement('td');
|
|
204
238
|
td.style.cssText = `
|
|
205
239
|
width: 150px;
|
|
@@ -211,7 +245,7 @@ const mgsDataTable = async (_mgsData) => {
|
|
|
211
245
|
padding: 2px;
|
|
212
246
|
border-top: 1px solid rgb(222, 226, 230);
|
|
213
247
|
`;
|
|
214
|
-
td.innerHTML = text[col];
|
|
248
|
+
td.innerHTML = (isSrno && ky == 0)?(_from+key):text[col];
|
|
215
249
|
td.title = text[col];
|
|
216
250
|
_createRow.appendChild(td);
|
|
217
251
|
});
|
|
@@ -451,11 +485,6 @@ document.addEventListener('keyup', function (e) {
|
|
|
451
485
|
let page = 1;
|
|
452
486
|
let column = '';
|
|
453
487
|
let sort = '';
|
|
454
|
-
document.querySelectorAll('._mgsSort').forEach((el) => {
|
|
455
|
-
const text = mgsCapitalizeFirstLetter (el.textContent.trim());
|
|
456
|
-
el.innerHTML = `${text} <span style="font-size:14px !important">β²</span>`;
|
|
457
|
-
el.setAttribute('data-sort', 'asc');
|
|
458
|
-
});
|
|
459
488
|
let prevPage = null;
|
|
460
489
|
let nextPage = null;
|
|
461
490
|
mgsDataTable({page,column, sort, search, prevPage, nextPage});
|
|
@@ -481,9 +510,38 @@ function mgsCapitalizeFirstLetter(str) {
|
|
|
481
510
|
return capitalized;
|
|
482
511
|
}
|
|
483
512
|
|
|
513
|
+
//show message
|
|
514
|
+
function mgsNotifyMessage(message, type = 'success', time=4000) {
|
|
515
|
+
let mgsMessageBox = document.getElementById('_mgsMessage');
|
|
516
|
+
if (!mgsMessageBox) {
|
|
517
|
+
mgsMessageBox = document.createElement('div');
|
|
518
|
+
mgsMessageBox.id = '_mgsMessage';
|
|
519
|
+
mgsMessageBox.style.position = 'fixed';
|
|
520
|
+
mgsMessageBox.style.top = '20px';
|
|
521
|
+
mgsMessageBox.style.right = '20px';
|
|
522
|
+
mgsMessageBox.style.zIndex = '99999';
|
|
523
|
+
mgsMessageBox.style.padding = '15px 20px';
|
|
524
|
+
mgsMessageBox.style.borderRadius = '5px';
|
|
525
|
+
mgsMessageBox.style.minWidth = '200px';
|
|
526
|
+
mgsMessageBox.style.mgsMessageBoxShadow = '0 2px 8px rgba(0,0,0,0.15)';
|
|
527
|
+
mgsMessageBox.style.fontFamily = 'Arial, sans-serif';
|
|
528
|
+
document.body.appendChild(mgsMessageBox);
|
|
529
|
+
}
|
|
530
|
+
|
|
531
|
+
mgsMessageBox.style.display = 'block';
|
|
532
|
+
mgsMessageBox.innerText = message;
|
|
533
|
+
mgsMessageBox.style.background = type === 'success' ? '#03741dff' : '#b30b1bff';
|
|
534
|
+
mgsMessageBox.style.color = '#ffff';
|
|
535
|
+
mgsMessageBox.style.border = type === 'success' ? '1px solid #03741dff' : '1px solid #b30b1bff';
|
|
536
|
+
setTimeout(() => {
|
|
537
|
+
mgsMessageBox.style.display = 'none';
|
|
538
|
+
}, time);
|
|
539
|
+
}
|
|
540
|
+
|
|
484
541
|
// Export globally for UMD/IIFE
|
|
485
542
|
window.mgsDataTable = mgsDataTable;
|
|
486
|
-
window.mgsCapitalizeFirstLetter = mgsCapitalizeFirstLetter
|
|
543
|
+
window.mgsCapitalizeFirstLetter = mgsCapitalizeFirstLetter;
|
|
544
|
+
window.mgsNotifyMessage = mgsNotifyMessage;
|
|
487
545
|
|
|
488
546
|
// If using modules
|
|
489
|
-
export { mgsDataTable, mgsCapitalizeFirstLetter };
|
|
547
|
+
export { mgsDataTable, mgsCapitalizeFirstLetter, mgsNotifyMessage };
|