all files / common/actions/ pivot-button.js

85.55% Statements 752/879
77.34% Branches 710/918
96.15% Functions 50/52
85.55% Lines 752/879
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567 568 569 570 571 572 573 574 575 576 577 578 579 580 581 582 583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 638 639 640 641 642 643 644 645 646 647 648 649 650 651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 690 691 692 693 694 695 696 697 698 699 700 701 702 703 704 705 706 707 708 709 710 711 712 713 714 715 716 717 718 719 720 721 722 723 724 725 726 727 728 729 730 731 732 733 734 735 736 737 738 739 740 741 742 743 744 745 746 747 748 749 750 751 752 753 754 755 756 757 758 759 760 761 762 763 764 765 766 767 768 769 770 771 772 773 774 775 776 777 778 779 780 781 782 783 784 785 786 787 788 789 790 791 792 793 794 795 796 797 798 799 800 801 802 803 804 805 806 807 808 809 810 811 812 813 814 815 816 817 818 819 820 821 822 823 824 825 826 827 828 829 830 831 832 833 834 835 836 837 838 839 840 841 842 843 844 845 846 847 848 849 850 851 852 853 854 855 856 857 858 859 860 861 862 863 864 865 866 867 868 869 870 871 872 873 874 875 876 877 878 879 880 881 882 883 884 885 886 887 888 889 890 891 892 893 894 895 896 897 898 899 900 901 902 903 904 905 906 907 908 909 910 911 912 913 914 915 916 917 918 919 920 921 922 923 924 925 926 927 928 929 930 931 932 933 934 935 936 937 938 939 940 941 942 943 944 945 946 947 948 949 950 951 952 953 954 955 956 957 958 959 960 961 962 963 964 965 966 967 968 969 970 971 972 973 974 975 976 977 978 979 980 981 982 983 984 985 986 987 988 989 990 991 992 993 994 995 996 997 998 999 1000 1001 1002 1003 1004 1005 1006 1007 1008 1009 1010 1011 1012 1013 1014 1015 1016 1017 1018 1019 1020 1021 1022 1023 1024 1025 1026 1027 1028 1029 1030 1031 1032 1033 1034 1035 1036 1037 1038 1039 1040 1041 1042 1043 1044 1045 1046 1047 1048 1049 1050 1051 1052 1053 1054 1055 1056 1057 1058 1059 1060 1061 1062 1063 1064 1065 1066 1067 1068 1069 1070 1071 1072 1073 1074 1075 1076 1077 1078 1079 1080 1081 1082 1083 1084 1085 1086 1087 1088 1089 1090 1091 1092 1093 1094 1095 1096 1097 1098 1099 1100 1101 1102 1103 1104 1105 1106 1107 1108 1109 1110 1111 1112 1113 1114 1115 1116 1117 1118 1119 1120 1121 1122 1123 1124 1125 1126 1127 1128 1129 1130 1131 1132 1133 1134 1135 1136 1137 1138 1139 1140 1141 1142 1143 1144 1145 1146 1147 1148 1149 1150 1151 1152 1153 1154 1155 1156 1157 1158 1159 1160 1161 1162 1163 1164 1165 1166 1167 1168 1169 1170 1171 1172 1173 1174 1175 1176 1177 1178 1179 1180 1181 1182 1183 1184 1185 1186 1187 1188 1189 1190 1191 1192 1193 1194 1195 1196 1197 1198 1199 1200 1201 1202 1203 1204 1205 1206 1207 1208 1209 1210 1211 1212 1213 1214 1215 1216 1217 1218 1219 1220 1221 1222 1223 1224 1225 1226 1227 1228 1229 1230 1231 1232 1233 1234 1235 1236 1237 1238 1239 1240 1241 1242 1243 1244 1245 1246 1247 1248 1249 1250 1251 1252 1253 1254 1255 1256 1257 1258 1259 1260 1261 1262 1263 1264 1265 1266 1267 1268 1269 1270 1271 1272 1273 1274 1275 1276 1277 1278 1279 1280 1281 1282 1283 1284 1285 1286 1287 1288 1289 1290 1291 1292 1293 1294 1295 1296 1297 1298 1299 1300 1301 1302 1303 1304 1305 1306 1307 1308 1309 1310 1311 1312 1313 1314 1315 1316 1317 1318 1319 1320 1321 1322 1323 1324 1325 1326 1327 1328 1329 1330 1331 1332 1333 1334 1335 1336 1337 1338 1339 1340 1341 1342 1343 1344 1345 1346 1347 1348 1349 1350 1351 1352 1353 1354 1355 1356 1357 1358 1359 1360 1361 1362 1363 1364 1365 1366 1367 1368 1369 1370 1371 1372 1373 1374 1375 1376 1377 1378 1379 1380 1381 1382 1383 1384 1385 1386 1387 1388 1389 1390 1391 1392 1393 1394 1395 1396 1397 1398 1399 1400 1401 1402 1403 1404 1405 1406 1407 1408 1409 1410 1411 1412 1413 1414 1415 1416 1417 1418 1419 1420 1421 1422 1423 1424 1425 1426 1427 1428 1429 1430 1431 1432 1433 1434 1435 1436 1437 1438 1439 1440 1441 1442 1443 1444 1445 1446 1447 1448 1449 1450 1451 1452 1453 1454 1455 1456 1457 1458 1459 1460 1461 1462 1463 1464 1465 1466 1467 1468 1469 1470 1471 1472 1473 1474 1475 1476 1477 1478 1479 1480 1481 1482 1483 1484 1485 1486 1487 1488 1489 1490 1491 1492 1493 1494 1495 1496 1497 1498 1499 1500 1501 1502 1503 1504 1505 1506 1507 1508 1509 1510 1511 1512 1513 1514 1515 1516 1517 1518 1519 1520 1521 1522 1523 1524 1525 1526 1527 1528 1529 1530 1531 1532 1533 1534 1535 1536 1537 1538 1539 1540 1541 1542 1543 1544 1545 1546 1547 1548 1549 1550 1551 1552 1553 1554 1555 1556 1557 1558 1559 1560 1561   167× 167× 167× 167× 167× 100×   167×   4814× 4814× 4814×   4814× 4814× 4814×   39× 39×   4814× 4814× 4814× 4814×     4814×   525× 525× 525×           525× 295× 295× 295×     230× 230×       4814× 1624× 1624× 1582×   1582× 225×     1357×   1582×       42×       3190× 3190× 3190×     4772× 4772× 304× 371× 371× 371×     371×         371×         4468× 8060×   8060× 10590× 10590×   10590× 10590× 10590× 9836×       9836×   9836×   9836×                           9836×       9836×       9836× 9836× 9836× 9836× 9834× 9558×         4504×   9558× 6434×   9558× 2357×     9834× 205×       205×   120×     85×   205×   9834×       9834× 7396×   7384×     12×       2438× 2438×           9834× 9834× 9834× 9834×       9836× 9836×       9836× 9836× 9836× 9836× 9836×   9808× 9808×           4468× 1182×   1182× 1099× 1099× 320× 638×   320× 320×           320× 320× 320×                         320× 320×       1182× 1182× 1099×     3286× 1185× 1185×   1185× 1094× 1094× 36× 36× 36×   36× 36× 36× 36× 36× 36× 36× 181× 181× 34×   147× 147×   87× 87×   87× 87× 87× 803× 803× 803× 803×   803×   163× 163×   163× 163×           36×                   36× 36× 36×                       36× 36×                     9836× 9836× 9836× 1742×   9836× 9836× 606×     9230×   9836× 8935× 8935×   5007×     3928×       9836× 9836× 9836×                         9836×       9836×   2357× 2357×       2357×   2357× 2357× 2357× 2011×       2011× 2011×       2011× 2011× 2011×           2011×       2011× 1356× 1331×     25×       655× 655×           2011× 2011×   13× 13×                                                   9808×                         9836×     9836×           9836× 9836× 2438×   9836×   4504× 4504× 4504× 4504× 82×     4422×   4504×   934×     3570× 3570× 8097× 1370×       4504× 200×           4304×         4504× 4306× 3217× 3211×           1089× 1089×               198×   4504× 4504×   6434× 6434× 6434× 330×     6104×   6434× 6434×   1182×   1182×         5252× 5252× 13070× 2092×       6434×           6434×   6434×         6434× 4980×     4972×           1454×     1454×           6434× 6434×   1742× 1742× 60×     1682×   1742× 1742× 1742× 1742× 1742× 1742× 60×   1682× 708× 191×   517× 517×     509×       974× 23× 21× 19×     17×                             951×   1742×   60× 60× 60×               60× 56×             60×   27× 27×       27×     27× 27× 27× 27×   27× 27× 27× 27× 27×             27×   27× 27× 27× 27× 27×       27×   27× 27× 27× 27×     27×                     24×   27× 27×       27× 27× 27× 27× 27× 81× 81×   27×   27× 27×   27× 27×   25×   25× 19× 19× 19×     27× 27× 27× 27×             27×   104× 104× 104×         40× 40× 40×     40× 40×           40× 40×   40×     35×     35× 35×   40× 40× 10× 10×                     138×     125×     13×                       80×   80× 80× 80× 80× 80×     80× 80× 14×     66×   80× 80×   80×               78×   78×             80×   80× 80× 80× 80× 79×   80× 14×     66×     79× 34× 34× 34× 34× 34×   45× 45× 45×     115×                                                           81× 81×                                                                                                                 27× 27× 27× 27× 27× 27× 27×     27×         27× 27×   27× 27× 27×             27× 27×           27×       27×   27×               61× 61× 61×                 53×         53× 53× 53× 53×     61×   22× 22× 22×   22× 22× 22× 22×                                                                                                                 53× 53× 53× 53× 53×                                                   53× 5746× 5746× 5699× 426×     5273×       53×     53×   53× 24× 24× 24× 3400×     53×         53×   53× 53× 53× 53× 53× 17× 40× 17× 17×       53×   53× 53× 53× 53× 14× 14×   53× 53×     53× 53× 53× 53× 13×     53× 53× 210× 210× 53× 53×         57× 57× 57× 236× 236× 57× 57×     57× 57× 43× 43×     14× 14×       17× 17× 52×                               52× 14× 14× 14×                     9836× 9836× 9560× 4694×   9560× 6434×   9560× 2011×     9836× 205×   9836× 9834×     9836× 9836× 9560× 4694×   9560× 6434×   9560× 2011×     9836× 205×   9836× 9834×     167×     167×     167×   167×     167×   167× 167× 167×   167× 167× 167× 14×   167× 167× 167×   167× 162× 162×   167× 100×   167× 167×        
define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "../../pivotfieldlist/base/field-list", "../../common/base/css-constant", "../../common/base/constant", "@syncfusion/ej2-buttons", "@syncfusion/ej2-popups", "../popups/aggregate-menu", "../../pivotfieldlist/renderer/axis-field-renderer", "@syncfusion/ej2-dropdowns", "../../base/util"], function (require, exports, ej2_base_1, ej2_base_2, ej2_base_3, field_list_1, cls, events, ej2_buttons_1, ej2_popups_1, aggregate_menu_1, axis_field_renderer_1, ej2_dropdowns_1, util_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var PivotButton = (function () {
        function PivotButton(parent) {
            this.parent = parent;
            this.menuOption = new aggregate_menu_1.AggregateMenu(this.parent);
            this.parent.pivotButtonModule = this;
            this.addEventListener();
            if (this.parent instanceof field_list_1.PivotFieldList) {
                this.axisField = new axis_field_renderer_1.AxisFieldRenderer(this.parent);
            }
            this.isDestroyed = false;
        }
        PivotButton.prototype.renderPivotButton = function (args) {
            var _this = this;
            var _a;
            this.parentElement = this.parent.getModuleName() === 'pivotview' ? this.parent.element :
                document.getElementById(this.parent.element.id + '_Container');
            var currentAxisElements = Array.prototype.slice.call(this.parentElement.querySelectorAll('.e-group-' + args.axis));
            var axisElement;
            if (args.axis === 'rows' && this.parent.showGroupingBar && this.parent.groupingBarModule
                && ej2_base_1.isNullOrUndefined(this.parentElement.querySelector('.' + cls.GROUP_PIVOT_ROW))) {
                currentAxisElements.push(this.parent.groupingBarModule.rowPanel);
                axisElement = this.parent.groupingBarModule.rowPanel;
            }
            var field = ej2_base_1.extend([], args.field, null, true);
            var axis = args.axis;
            var valuePos = -1;
            var showValuesButton = (this.parent.dataType === 'pivot' ? (this.parent.getModuleName() === 'pivotfieldlist' &&
                this.parent.pivotGridModule) ?
                this.parent.pivotGridModule.showValuesButton : this.parent.showValuesButton : false);
            if (((this.parent.dataSourceSettings.valueAxis === 'row' && args.axis === 'rows') ||
                (this.parent.dataSourceSettings.valueAxis === 'column' && args.axis === 'columns')) && showValuesButton && this.parent.dataSourceSettings.values.length > 1) {
                Eif (ej2_base_1.isNullOrUndefined(util_1.PivotUtil.getFieldByName('[Measures]', field))) {
                    var measureField = util_1.PivotUtil.getFieldByName('[Measures]', this.parent.dataSourceSettings.fieldMapping);
                    var valueField = {
                        name: '[Measures]', caption: this.parent.localeObj.getConstant('values'),
                        axis: args.axis,
                        showRemoveIcon: (measureField && 'showRemoveIcon' in measureField) ? measureField.showRemoveIcon : true,
                        allowDragAndDrop: (measureField && 'allowDragAndDrop' in measureField) ? measureField.allowDragAndDrop : true
                    };
                    if ((this.parent.dataSourceSettings.valueIndex === -1 || this.parent.dataSourceSettings.valueIndex > field.length)) {
                        valuePos = field.length;
                        field.push(valueField);
                        this.parent.setProperties({ dataSourceSettings: { valueIndex: -1 } }, true);
                    }
                    else {
                        valuePos = this.parent.dataSourceSettings.valueIndex;
                        field.splice(valuePos, 0, valueField);
                    }
                }
            }
            if (this.parent.getModuleName() === 'pivotfieldlist') {
                this.parentElement = document.getElementById(this.parent.element.id + '_Container');
                if (this.parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-' + axis)) {
                    var axisPrompt = this.parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-' + axis)
                        .querySelector('.' + cls.AXIS_PROMPT_CLASS);
                    if (field.length === 0) {
                        ej2_base_3.removeClass([axisPrompt], cls.ICON_DISABLE);
                    }
                    else {
                        ej2_base_3.addClass([axisPrompt], cls.ICON_DISABLE);
                    }
                    axisElement =
                        this.parentElement.querySelector('.' + cls.FIELD_LIST_CLASS + '-' + axis).querySelector('.' + cls.AXIS_CONTENT_CLASS);
                }
                else {
                    return;
                }
            }
            else {
                this.parentElement = this.parent.element;
                Eif (!ej2_base_1.isNullOrUndefined(this.parentElement.querySelector('.e-group-' + axis))) {
                    axisElement = this.parentElement.querySelector('.e-group-' + axis);
                }
            }
            Eif (axisElement) {
                if (this.parent.getModuleName() === 'pivotview' && field.length === 0) {
                    for (var i = 0; i < currentAxisElements.length; i++) {
                        var element = currentAxisElements[i];
                        Eif (!element.classList.contains(cls.GROUP_CHART_VALUE) && !element.classList.contains(cls.GROUP_CHART_COLUMN)) {
                            var axisPrompt = ej2_base_1.createElement('span', {
                                className: cls.AXIS_PROMPT_CLASS
                            });
                            axisPrompt.innerText = (this.parent.groupingBarSettings.allowDragAndDrop ? axis === 'rows' ? this.parent.localeObj.getConstant('rowAxisPrompt') :
                                axis === 'columns' ? this.parent.localeObj.getConstant('columnAxisPrompt') :
                                    axis === 'values' ? this.parent.localeObj.getConstant('valueAxisPrompt') :
                                        axis === 'filters' ? this.parent.localeObj.getConstant('filterAxisPrompt') :
                                            this.parent.localeObj.getConstant('allFields') : '');
                            element.appendChild(axisPrompt);
                        }
                    }
                }
                else {
                    for (var i = 0, cnt = field.length; i < cnt; i++) {
                        var elements = this.parent.getModuleName() === 'pivotfieldlist' ?
                            [axisElement] : currentAxisElements;
                        for (var j = 0; j < elements.length; j++) {
                            var element = elements[j];
                            Eif ((this.parent.olapEngineModule && (this.parent.olapEngineModule.fieldList[field[i].name] ||
                                field[i].name === '[Measures]')) || this.parent.engineModule) {
                                var isMeasureAvail = (this.parent.dataType === 'olap' && (field[i].name.toLowerCase() === '[measures]' || axis === 'values'));
                                var isMeasureFieldsAvail = (this.parent.dataType === 'olap' && axis === 'values');
                                if (!element.classList.contains(cls.GROUP_CHART_VALUE) && !element.classList.contains(cls.GROUP_CHART_COLUMN)) {
                                    var buttonWrapper = ej2_base_1.createElement('div', {
                                        className: cls.PIVOT_BUTTON_WRAPPER_CLASS + (i === 0 && axis !== 'all-fields' ? ' e-first-btn' : ''),
                                        attrs: { 'data-tag': axis + ':' + field[i].name }
                                    });
                                    var buttonCaption = field[i].caption ? field[i].caption :
                                        field[i].name;
                                    buttonCaption = this.parent.enableHtmlSanitizer ?
                                        ej2_base_1.SanitizeHtmlHelper.sanitize(buttonCaption) : buttonCaption;
                                    var buttonElement = ej2_base_1.createElement('div', {
                                        id: this.parent.element.id + '_' + field[i].name, className: cls.PIVOT_BUTTON_CLASS + ' ' + field[i].name.replace(/[^A-Z0-9]/ig, ''),
                                        attrs: {
                                            'data-uid': field[i].name,
                                            'tabindex': (this.parent.getModuleName() === 'pivotview' && this.parent.grid && axis === 'rows' && !element.classList.contains(cls.GROUP_CHART_ROW)) ? '-1' : '0',
                                            'isvalue': (i === valuePos || isMeasureAvail && !isMeasureFieldsAvail) ? 'true' : 'false',
                                            'aria-disabled': 'false', 'aria-label': buttonCaption,
                                            'data-type': (this.parent.dataType === 'olap' ? isMeasureFieldsAvail ? 'isMeasureFieldsAvail' : isMeasureAvail ? 'isMeasureAvail' : field[i].type : field[i].type),
                                            'data-caption': buttonCaption,
                                            'data-basefield': this.parent.enableHtmlSanitizer ? ej2_base_1.SanitizeHtmlHelper.sanitize(field[i].baseField) : field[i].baseField,
                                            'data-baseitem': this.parent.enableHtmlSanitizer ? ej2_base_1.SanitizeHtmlHelper.sanitize(field[i].baseItem) : field[i].baseItem,
                                            'role': 'button'
                                        }
                                    });
                                    var dropIndicatorElement = ej2_base_1.createElement('span', {
                                        attrs: { 'tabindex': '-1', 'aria-disabled': 'false' },
                                        className: cls.DROP_INDICATOR_CLASS
                                    });
                                    var dropLastIndicatorElement = ej2_base_1.createElement('span', {
                                        attrs: { 'tabindex': '-1', 'aria-disabled': 'false' },
                                        className: cls.DROP_INDICATOR_CLASS + '-last'
                                    });
                                    var dragWrapper = this.createButtonDragIcon(field[i], buttonElement);
                                    var contentElement = this.createButtonText(field, i, axis, valuePos);
                                    buttonElement.appendChild(contentElement);
                                    if (axis !== 'all-fields') {
                                        if (!isMeasureAvail && !field[i].isNamedSet && !field[i].isCalculatedField) {
                                            if (['filters', 'values'].indexOf(axis) === -1 && valuePos !== i &&
                                                !(this.parent.dataType === 'olap' && ((this.parent.getModuleName() === 'pivotview' &&
                                                    this.parent.enableVirtualization) || (this.parent.getModuleName() === 'pivotfieldlist' &&
                                                    this.parent.pivotGridModule !== undefined &&
                                                    this.parent.pivotGridModule.enableVirtualization)))) {
                                                this.createSortOption(buttonElement, field[i].name, field[i]);
                                            }
                                            if (axis !== 'values' && valuePos !== i) {
                                                this.createFilterOption(buttonElement, field[i].name, axis, field[i]);
                                            }
                                            if (axis === 'values') {
                                                this.getTypeStatus(field, i, buttonElement);
                                            }
                                        }
                                        if ((field[i].isCalculatedField || field[i].type === 'CalculatedField')) {
                                            var calcElement = ej2_base_1.createElement('span', {
                                                attrs: { 'tabindex': '-1', 'aria-disabled': 'false', 'title': this.parent.localeObj.getConstant('editCalculatedField') },
                                                className: cls.ICON + ' ' + cls.CALC_EDIT
                                            });
                                            if (this.parent.allowCalculatedField && this.parent.calculatedFieldModule &&
                                                (field[i].showEditIcon || field[i].showEditIcon === undefined)) {
                                                ej2_base_3.removeClass([calcElement], cls.ICON_DISABLE);
                                            }
                                            else {
                                                ej2_base_3.addClass([calcElement], cls.ICON_DISABLE);
                                            }
                                            buttonElement.appendChild(calcElement);
                                        }
                                        var removeElement = ej2_base_1.createElement('span', {
                                            attrs: { 'tabindex': '-1', 'aria-disabled': 'false', 'title': this.parent.localeObj.getConstant('remove') },
                                            className: cls.ICON + ' ' + cls.REMOVE_CLASS
                                        });
                                        if (this.parent.getModuleName() === 'pivotview') {
                                            if ((this.parent.groupingBarSettings.showRemoveIcon &&
                                                (field[i].showRemoveIcon || field[i].showRemoveIcon === undefined))) {
                                                ej2_base_3.removeClass([removeElement], cls.ICON_DISABLE);
                                            }
                                            else {
                                                ej2_base_3.addClass([removeElement], cls.ICON_DISABLE);
                                            }
                                        }
                                        else {
                                            Eif (field[i].showRemoveIcon || field[i].showRemoveIcon === undefined) {
                                                ej2_base_3.removeClass([removeElement], cls.ICON_DISABLE);
                                            }
                                            else {
                                                ej2_base_3.addClass([removeElement], cls.ICON_DISABLE);
                                            }
                                        }
                                        buttonElement.appendChild(removeElement);
                                        buttonWrapper.appendChild(dropIndicatorElement);
                                        buttonWrapper.appendChild(buttonElement);
                                        buttonWrapper.appendChild(dropLastIndicatorElement);
                                    }
                                    else {
                                        buttonWrapper.appendChild(dropIndicatorElement);
                                        buttonWrapper.appendChild(buttonElement);
                                    }
                                    element.appendChild(buttonWrapper);
                                    var pivotButton = new ej2_buttons_1.Button({
                                        enableRtl: this.parent.enableRtl, locale: this.parent.locale,
                                        enableHtmlSanitizer: this.parent.enableHtmlSanitizer, cssClass: this.parent.cssClass
                                    });
                                    pivotButton.isStringTemplate = true;
                                    pivotButton.appendTo(buttonElement);
                                    this.unWireEvent(buttonWrapper, i === valuePos && axis !== 'all-fields' ? 'values' : axis, isMeasureAvail);
                                    this.wireEvent(buttonWrapper, i === valuePos && axis !== 'all-fields' ? 'values' : axis, isMeasureAvail);
                                    if ((this.parent.getModuleName() === 'pivotview' && !this.parent.isAdaptive) ||
                                        this.parent.getModuleName() === 'pivotfieldlist') {
                                        this.createDraggable(field[i], this.parent.getModuleName() === 'pivotview' ? contentElement : dragWrapper);
                                        ej2_base_1.getInstance(buttonElement.querySelector('.' + cls.BUTTON_DRAGGABLE), ej2_base_1.Draggable).enableAutoScroll = false;
                                    }
                                }
                            }
                        }
                    }
                    if (axis === 'values') {
                        var valueFiedDropDownList = ej2_base_2.select('.' + cls.GROUP_CHART_VALUE_DROPDOWN_DIV, this.parentElement) ?
                            ej2_base_1.getInstance(ej2_base_2.select('.' + cls.GROUP_CHART_VALUE_DROPDOWN_DIV, this.parentElement), ej2_dropdowns_1.DropDownList) : null;
                        var _loop_1 = function (i) {
                            var element = currentAxisElements[i];
                            if (element.classList.contains(cls.GROUP_CHART_VALUE) && this_1.parent.pivotChartModule) {
                                var valueData = field.map(function (item) {
                                    return { text: item.caption ? item.caption : item.name, value: item.name };
                                });
                                var parent_1 = this_1.parent;
                                Iif (valueFiedDropDownList && element.querySelector('.' + cls.GROUP_CHART_VALUE_DROPDOWN_DIV)) {
                                    valueFiedDropDownList.dataSource = valueData;
                                    valueFiedDropDownList.value = !parent_1.chartSettings.enableMultipleAxis ?
                                        parent_1.pivotChartModule.currentMeasure : valueData[0].value;
                                }
                                else {
                                    var ddlDiv = ej2_base_1.createElement('div', { className: cls.GROUP_CHART_VALUE_DROPDOWN_DIV });
                                    element.appendChild(ddlDiv);
                                    valueFiedDropDownList = new ej2_dropdowns_1.DropDownList({
                                        dataSource: valueData,
                                        enableRtl: this_1.parent.enableRtl,
                                        locale: this_1.parent.locale,
                                        value: !parent_1.chartSettings.enableMultipleAxis ?
                                            parent_1.pivotChartModule.currentMeasure : valueData[0].value,
                                        width: 200,
                                        fields: { value: 'value', text: 'text' },
                                        cssClass: cls.GROUP_CHART_VALUE_DROPDOWN + (this_1.parent.cssClass ? (' ' + this_1.parent.cssClass) : ''),
                                        change: function (args) {
                                            Eif (args.e && args.e !== null) {
                                                parent_1.chartSettings.value = args.value;
                                            }
                                        }
                                    });
                                    valueFiedDropDownList.isStringTemplate = true;
                                    valueFiedDropDownList.appendTo(ddlDiv);
                                }
                            }
                        };
                        var this_1 = this;
                        for (var i = 0; i < currentAxisElements.length; i++) {
                            _loop_1(i);
                        }
                    }
                    else if (axis === 'columns') {
                        var availColindex = undefined;
                        var columnFieldDropDownList = ej2_base_2.select('.' + cls.GROUP_CHART_COLUMN_DROPDOWN_DIV, this.parentElement) ?
                            ej2_base_1.getInstance(ej2_base_2.select('.' + cls.GROUP_CHART_COLUMN_DROPDOWN_DIV, this.parentElement), ej2_dropdowns_1.DropDownList) : null;
                        for (var i = 0; i < currentAxisElements.length; i++) {
                            var element = currentAxisElements[i];
                            if (element.classList.contains(cls.GROUP_CHART_COLUMN) && this.parent.pivotChartModule) {
                                var currentMeasure = this.parent.pivotChartModule.currentMeasure;
                                var delimiter = this.parent.chartSettings.columnDelimiter ? this.parent.chartSettings.columnDelimiter : '-';
                                var columnHeader = (this.parent.chartSettings.columnHeader && this.parent.chartSettings.columnHeader !== '') ?
                                    this.parent.chartSettings.columnHeader.split(delimiter).join(' - ') : '';
                                var engineModule = this.parent.dataType === 'olap' ? this.parent.olapEngineModule : this.parent.engineModule;
                                var pivotValues = engineModule.pivotValues;
                                var totColIndex = this.parent.pivotChartModule.getColumnTotalIndex(pivotValues);
                                var rKeys = Object.keys(pivotValues);
                                var columnData = [];
                                var firstValueRow = false;
                                for (var _i = 0, rKeys_1 = rKeys; _i < rKeys_1.length; _i++) {
                                    var rKey = rKeys_1[_i];
                                    if (firstValueRow) {
                                        break;
                                    }
                                    var rowIndex = Number(rKey);
                                    if (pivotValues[rowIndex][0] && pivotValues[rowIndex][0].axis === 'row' &&
                                        (this.parent.dataSourceSettings.rows.length === 0 ? true : pivotValues[rowIndex][0].type !== 'grand sum')) {
                                        var firstRowCell = pivotValues[rowIndex][0];
                                        var tupInfo = this.parent.dataType === 'olap' ?
                                            engineModule.tupRowInfo[firstRowCell.ordinal] : undefined;
                                        var rows = pivotValues[rowIndex];
                                        var cKeys = Object.keys(rows);
                                        for (var _b = 0, cKeys_1 = cKeys; _b < cKeys_1.length; _b++) {
                                            var cKey = cKeys_1[_b];
                                            var cellIndex = Number(cKey);
                                            var cell = pivotValues[rowIndex][cellIndex];
                                            var actualText = (this.parent.dataType === 'olap' && tupInfo && tupInfo.measureName) ?
                                                tupInfo.measureName : cell.actualText;
                                            if (!totColIndex[cell.colIndex] && cell.axis === 'value' && firstRowCell.type !== 'header' &&
                                                actualText !== '' && actualText === currentMeasure) {
                                                firstValueRow = true;
                                                var columnSeries = this.parent.dataType === 'olap' ? cell.columnHeaders.toString().split(/~~|::/).join(' - ')
                                                    : cell.columnHeaders.toString().split(this.parent.dataSourceSettings.valueSortSettings.headerDelimiter).join(' - ');
                                                columnData.push({ value: columnSeries, text: columnSeries, title: (_a = {}, _a['title'] = columnSeries, _a) });
                                                if (columnSeries === columnHeader) {
                                                    availColindex = columnData.length;
                                                }
                                            }
                                        }
                                    }
                                }
                                Iif (columnFieldDropDownList && element.querySelector('.' + cls.GROUP_CHART_COLUMN_DROPDOWN_DIV)) {
                                    columnFieldDropDownList.dataSource = columnData;
                                    if (availColindex !== undefined) {
                                        columnFieldDropDownList.value = columnData[availColindex - 1].value;
                                    }
                                    else {
                                        columnFieldDropDownList.value = columnData[0].value;
                                    }
                                }
                                else {
                                    var ddlDiv = ej2_base_1.createElement('div', { className: cls.GROUP_CHART_COLUMN_DROPDOWN_DIV });
                                    element.appendChild(ddlDiv);
                                    columnFieldDropDownList = new ej2_dropdowns_1.DropDownList({
                                        dataSource: columnData,
                                        enableRtl: this.parent.enableRtl,
                                        locale: this.parent.locale,
                                        value: availColindex ? columnData[availColindex - 1].value : (columnData[0] ? columnData[0].value : ''),
                                        width: '200',
                                        fields: { value: 'value', text: 'text', htmlAttributes: 'title' },
                                        cssClass: cls.GROUP_CHART_COLUMN_DROPDOWN + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
                                        change: function (args) {
                                            Eif (args.e && args.e !== null) {
                                                var delimiter_1 = _this.parent.chartSettings.columnDelimiter ? _this.parent.chartSettings.columnDelimiter : '-';
                                                _this.parent.chartSettings.columnHeader = args.value.split(' - ').join(delimiter_1);
                                            }
                                        }
                                    });
                                    columnFieldDropDownList.isStringTemplate = true;
                                    columnFieldDropDownList.appendTo(ddlDiv);
                                }
                            }
                        }
                    }
                }
            }
            else {
                return;
            }
        };
        PivotButton.prototype.createButtonText = function (field, i, axis, valuePos) {
            var aggregation;
            var filterMem;
            if (axis === 'filters') {
                filterMem = this.updateButtontext(field[i].name);
            }
            var engineModule;
            if (this.parent.dataType === 'olap') {
                engineModule = this.parent.olapEngineModule;
            }
            else {
                engineModule = this.parent.engineModule;
            }
            if (engineModule.fieldList && engineModule.fieldList[field[i].name] !== undefined) {
                aggregation = engineModule.fieldList[field[i].name].aggregateType;
                if ((aggregation !== 'DistinctCount') && (engineModule.fieldList[field[i].name].type !== 'number' || engineModule.fieldList[field[i].name].type === 'include' ||
                    engineModule.fieldList[field[i].name].type === 'exclude')) {
                    aggregation = 'Count';
                }
                else {
                    aggregation = aggregation === undefined ? 'Sum' :
                        engineModule.fieldList[field[i].name].aggregateType;
                }
            }
            var text = field[i].caption ? field[i].caption : field[i].name;
            text = this.parent.enableHtmlSanitizer ? ej2_base_1.SanitizeHtmlHelper.sanitize(text) : text;
            var buttonText = ej2_base_1.createElement('span', {
                attrs: {
                    title: axis === 'filters' ? (this.parent.dataType === 'olap' && engineModule.fieldList[field[i].name].type === 'CalculatedField') ?
                        text : (text + ' (' + filterMem + ')') : (this.parent.dataType === 'olap' ?
                        text : (((!this.parent.dataSourceSettings.showAggregationOnValueField || axis !== 'values' || aggregation === 'CalculatedField') ?
                        text : this.parent.localeObj.getConstant(aggregation) + ' ' + this.parent.localeObj.getConstant('of') + ' ' + text))),
                    'tabindex': '-1', 'aria-disabled': 'false', 'oncontextmenu': 'return false;',
                    'data-type': valuePos === i ? '' : aggregation
                },
                className: cls.PIVOT_BUTTON_CONTENT_CLASS + ' ' +
                    (this.parent.getModuleName() === 'pivotview' ?
                        this.parent.groupingBarSettings.allowDragAndDrop && (field[i].allowDragAndDrop || field[i].allowDragAndDrop === undefined) ? '' : cls.DRAG_DISABLE_CLASS : '')
            });
            buttonText.innerText = axis === 'filters' ? (this.parent.dataType === 'olap' && engineModule.fieldList[field[i].name].type === 'CalculatedField') ?
                text : (text + ' (' + filterMem + ')') : (this.parent.dataType === 'olap' ?
                text : (!this.parent.dataSourceSettings.showAggregationOnValueField || axis !== 'values' || aggregation === 'CalculatedField' ?
                text : this.parent.localeObj.getConstant(aggregation) + ' ' + this.parent.localeObj.getConstant('of') + ' ' + text));
            return buttonText;
        };
        PivotButton.prototype.getTypeStatus = function (field, i, buttonElement) {
            var engineModule;
            Iif (this.parent.dataType === 'olap') {
                engineModule = this.parent.olapEngineModule;
            }
            else {
                engineModule = this.parent.engineModule;
            }
            Eif (engineModule.fieldList) {
                var fieldListItem = engineModule.fieldList[field[i].name];
                if (fieldListItem.aggregateType !== 'CalculatedField' && this.validateDropdown(fieldListItem.type)) {
                    this.createSummaryType(buttonElement, field[i].name, field[i]);
                }
            }
        };
        PivotButton.prototype.validateDropdown = function (type) {
            var aggregateType = this.parent.aggregateTypes;
            Iif (type !== 'number') {
                return (aggregateType.indexOf('Count') > -1 || aggregateType.indexOf('DistinctCount') > -1);
            }
            else {
                for (var i = 0; i < aggregateType.length; i++) {
                    Eif (this.parent.getAllSummaryType().indexOf(aggregateType[i]) > -1) {
                        return true;
                    }
                }
                return false;
            }
        };
        PivotButton.prototype.createSummaryType = function (pivotButton, fieldName, field) {
            var spanElement = ej2_base_1.createElement('span', {
                attrs: { 'tabindex': '-1', 'aria-disabled': 'false', 'title': this.parent.localeObj.getConstant('format') },
                className: cls.ICON + ' ' + cls.AXISFIELD_ICON_CLASS
            });
            if (this.parent.getModuleName() === 'pivotview') {
                if (this.parent.groupingBarSettings.showValueTypeIcon && field.showValueTypeIcon) {
                    ej2_base_3.removeClass([spanElement], cls.ICON_DISABLE);
                }
                else {
                    ej2_base_3.addClass([spanElement], cls.ICON_DISABLE);
                }
            }
            else {
                Eif (field.showValueTypeIcon) {
                    ej2_base_3.removeClass([spanElement], cls.ICON_DISABLE);
                }
                else {
                    ej2_base_3.addClass([spanElement], cls.ICON_DISABLE);
                }
            }
            pivotButton.appendChild(spanElement);
            return spanElement;
        };
        PivotButton.prototype.createMenuOption = function (args) {
            this.menuOption.render(args, this.parentElement);
            this.parent.pivotButtonModule = this;
        };
        PivotButton.prototype.openCalculatedFieldDialog = function (args) {
            var fieldName = args.target.parentElement.getAttribute('data-uid');
            var fieldInfo = util_1.PivotUtil.getFieldInfo(fieldName, this.parent);
            this.parent.actionObj.actionName = events.editCalculatedField;
            this.parent.actionObj.fieldInfo = fieldInfo;
            Iif (this.parent.actionBeginMethod()) {
                return;
            }
            try {
                if (this.parent.getModuleName() === 'pivotview') {
                    Iif (this.parent.isAdaptive && (this.parent.showFieldList &&
                        this.parent.pivotFieldListModule &&
                        !this.parent.pivotFieldListModule.isDestroyed)) {
                        this.parent.pivotFieldListModule.element
                            .querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS).click();
                        this.parent.pivotFieldListModule.dialogRenderer.adaptiveElement.select(4);
                        (this.parent.pivotFieldListModule.calculatedFieldModule).updateAdaptiveCalculatedField(true, fieldName);
                    }
                    else {
                        Eif (!this.parent.isAdaptive) {
                            this.parent.calculatedFieldModule.buttonCall = true;
                        }
                        this.parent.notify(events.initCalculatedField, { edit: true, fieldName: fieldName });
                    }
                }
                else Eif (this.parent.getModuleName() === 'pivotfieldlist') {
                    if (this.parent.isAdaptive) {
                        this.parent.dialogRenderer.adaptiveElement.select(4);
                        (this.parent.calculatedFieldModule).updateAdaptiveCalculatedField(true, fieldName);
                        this.parent.calculatedFieldModule.buttonCall = true;
                    }
                    else {
                        Eif (this.parent.dialogRenderer.fieldListDialog) {
                            this.parent.dialogRenderer.fieldListDialog.hide();
                            ej2_base_3.addClass([this.parent.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS)], cls.ICON_HIDDEN);
                        }
                        this.parent.notify(events.initCalculatedField, { edit: true, fieldName: fieldName });
                        Eif (this.parent.calculatedFieldModule) {
                            this.parent.calculatedFieldModule.buttonCall = true;
                        }
                    }
                }
            }
            catch (execption) {
                this.parent.actionFailureMethod(execption);
            }
        };
        PivotButton.prototype.createDraggable = function (field, target) {
            this.draggable = new ej2_base_1.Draggable(target, {
                clone: true,
                enableTailMode: true,
                enableAutoScroll: true,
                helper: this.createDragClone.bind(this),
                dragStart: this.onDragStart.bind(this),
                drag: this.onDragging.bind(this),
                dragStop: this.onDragStop.bind(this),
                abort: (this.parent.getModuleName() === 'pivotview' ?
                    !(this.parent.groupingBarSettings.allowDragAndDrop && field.allowDragAndDrop) ?
                        '.' + cls.PIVOT_BUTTON_CLASS : '' : !field.allowDragAndDrop ? '.' + cls.PIVOT_BUTTON_CLASS : '')
            });
        };
        PivotButton.prototype.createButtonDragIcon = function (field, pivotButton) {
            var dragWrapper = ej2_base_1.createElement('span', {
                attrs: { 'tabindex': '-1', 'aria-disabled': 'false' }
            });
            var dragElement = ej2_base_1.createElement('span', {
                attrs: {
                    'tabindex': '-1', 'aria-disabled': 'false', 'title': this.parent.localeObj.getConstant('drag')
                },
                className: cls.ICON + ' ' + cls.DRAG_CLASS + ' ' + ((field.allowDragAndDrop || field.allowDragAndDrop === undefined) ? '' : cls.DRAG_DISABLE_CLASS)
            });
            dragWrapper.appendChild(dragElement);
            if (this.parent.getModuleName() === 'pivotfieldlist') {
                pivotButton.appendChild(dragWrapper);
            }
            return dragWrapper;
        };
        PivotButton.prototype.createSortOption = function (pivotButton, fieldName, field) {
            var sortCLass;
            var spanElement;
            var engineModule;
            if (this.parent.dataType === 'olap') {
                engineModule = this.parent.olapEngineModule;
            }
            else {
                engineModule = this.parent.engineModule;
            }
            if (this.parent.isDeferLayoutUpdate === false || (this.parent.pivotGridModule &&
                this.parent.pivotGridModule.pivotDeferLayoutUpdate === false)) {
                sortCLass = engineModule.fieldList[fieldName].sort === 'Descending' ? cls.SORT_DESCEND_CLASS : '';
            }
            else {
                sortCLass = '';
                for (var i = 0; i < this.parent.dataSourceSettings.sortSettings.length; i++) {
                    if (this.parent.dataSourceSettings.sortSettings[i].name === fieldName) {
                        sortCLass = this.parent.dataSourceSettings.sortSettings[i].order === 'Descending' ? cls.SORT_DESCEND_CLASS : '';
                    }
                }
            }
            if (engineModule.fieldList && engineModule.fieldList[fieldName].sort === 'None') {
                spanElement = ej2_base_1.createElement('span', {
                    attrs: { 'tabindex': '-1', 'aria-disabled': 'false', 'title': this.parent.localeObj.getConstant('sort') },
                    className: cls.ICON
                });
            }
            else {
                spanElement = ej2_base_1.createElement('span', {
                    attrs: { 'tabindex': '-1', 'aria-disabled': 'false', 'title': this.parent.localeObj.getConstant('sort') },
                    className: cls.ICON + ' ' + cls.SORT_CLASS + ' ' + sortCLass
                });
            }
            if (this.parent.dataSourceSettings.enableSorting) {
                if (this.parent.getModuleName() === 'pivotview') {
                    if (field.showSortIcon && this.parent.groupingBarSettings.showSortIcon) {
                        ej2_base_3.removeClass([spanElement], cls.ICON_DISABLE);
                    }
                    else {
                        ej2_base_3.addClass([spanElement], cls.ICON_DISABLE);
                    }
                }
                else {
                    Eif (field.showSortIcon) {
                        ej2_base_3.removeClass([spanElement], cls.ICON_DISABLE);
                    }
                    else {
                        ej2_base_3.addClass([spanElement], cls.ICON_DISABLE);
                    }
                }
            }
            else {
                ej2_base_3.addClass([spanElement], cls.ICON_DISABLE);
            }
            pivotButton.appendChild(spanElement);
            return spanElement;
        };
        PivotButton.prototype.createFilterOption = function (pivotButton, fieldName, axis, field) {
            var filterCLass;
            var engineModule;
            if (this.parent.dataType === 'olap') {
                engineModule = this.parent.olapEngineModule;
            }
            else {
                engineModule = this.parent.engineModule;
            }
            var filterField = util_1.PivotUtil.getFieldByName(fieldName, this.parent.dataSourceSettings.filterSettings);
            if (this.parent.isDeferLayoutUpdate === false || (this.parent.pivotGridModule &&
                this.parent.pivotGridModule.pivotDeferLayoutUpdate === false)) {
                engineModule.fieldList[fieldName].filter = engineModule.fieldList[fieldName].filter === null ?
                    [] : engineModule.fieldList[fieldName].filter;
                filterCLass = ((this.parent.dataSourceSettings.mode === 'Server' && !filterField) ||
                    (this.parent.dataSourceSettings.mode === 'Local' && engineModule.fieldList[fieldName].filter.length === 0)) ?
                    !engineModule.fieldList[fieldName].isExcelFilter ? cls.FILTER_CLASS : cls.FILTERED_CLASS : cls.FILTERED_CLASS;
            }
            else {
                filterCLass = cls.FILTER_CLASS;
                for (var i = 0; i < this.parent.dataSourceSettings.filterSettings.length; i++) {
                    if (this.parent.dataSourceSettings.filterSettings[i].name === fieldName) {
                        filterCLass = cls.FILTERED_CLASS;
                    }
                }
            }
            var spanElement = ej2_base_1.createElement('span', {
                attrs: {
                    'tabindex': '-1', 'aria-disabled': 'false', 'title': this.parent.localeObj.getConstant('filter')
                },
                className: cls.FILTER_COMMON_CLASS + ' ' + cls.ICON + ' ' + filterCLass
            });
            Eif ((((this.parent.dataSourceSettings.allowLabelFilter || this.parent.dataSourceSettings.allowValueFilter) &&
                axis !== 'filters') || this.parent.dataSourceSettings.allowMemberFilter)) {
                ej2_base_3.removeClass([spanElement], cls.ICON_DISABLE);
            }
            else {
                ej2_base_3.addClass([spanElement], cls.ICON_DISABLE);
            }
            if (this.parent.getModuleName() === 'pivotview') {
                if ((((this.parent.dataSourceSettings.allowLabelFilter || this.parent.dataSourceSettings.allowValueFilter) &&
                    axis !== 'filters') || this.parent.dataSourceSettings.allowMemberFilter) &&
                    this.parent.groupingBarSettings.showFilterIcon && field.showFilterIcon) {
                    ej2_base_3.removeClass([spanElement], cls.ICON_DISABLE);
                }
                else {
                    ej2_base_3.addClass([spanElement], cls.ICON_DISABLE);
                }
            }
            else {
                Eif (field.showFilterIcon && (((this.parent.dataSourceSettings.allowLabelFilter ||
                    this.parent.dataSourceSettings.allowValueFilter) && axis !== 'filters') ||
                    this.parent.dataSourceSettings.allowMemberFilter)) {
                    ej2_base_3.removeClass([spanElement], cls.ICON_DISABLE);
                }
                else {
                    ej2_base_3.addClass([spanElement], cls.ICON_DISABLE);
                }
            }
            pivotButton.appendChild(spanElement);
            return spanElement;
        };
        PivotButton.prototype.updateButtontext = function (fieldName) {
            var engineModule;
            if (this.parent.dataType === 'olap') {
                engineModule = this.parent.olapEngineModule;
            }
            else {
                engineModule = this.parent.engineModule;
            }
            var filterCount = engineModule.fieldList[fieldName].filter.length;
            var filterType = engineModule.fieldList[fieldName].filterType;
            var memLen = engineModule.fieldList[fieldName].dateMember.length;
            var filterMem;
            var firstNode = engineModule.fieldList[fieldName].filter[0];
            if (this.parent.dataType === 'olap') {
                filterMem = this.updateOlapButtonText(engineModule, fieldName, firstNode, filterCount);
            }
            else if (filterType === 'include') {
                if (filterCount === 1) {
                    filterMem = firstNode;
                }
                else Eif (filterCount > 1) {
                    if (filterCount === memLen) {
                        filterMem = this.parent.localeObj.getConstant('all');
                    }
                    else {
                        filterMem = this.parent.localeObj.getConstant('multipleItems');
                    }
                }
            }
            else if (filterType === 'exclude') {
                if (filterCount === 1) {
                    if (memLen === 2) {
                        if (firstNode !== engineModule.fieldList[fieldName].dateMember[0].actualText) {
                            filterMem = firstNode;
                        }
                        else {
                            filterMem = engineModule.fieldList[fieldName].dateMember[0].actualText;
                        }
                    }
                    else {
                        filterMem = this.parent.localeObj.getConstant('multipleItems');
                    }
                }
                else Eif (filterCount > 1) {
                    var j = void 0;
                    var allNodes = Object.keys(engineModule.fieldList[fieldName].members);
                    var filteredItems = engineModule.fieldList[fieldName].filter;
                    Eif (filterCount === (allNodes.length - 1)) {
                        for (j = 0; j < allNodes.length; j++) {
                            var test = allNodes[j];
                            var x = filteredItems.indexOf(test);
                            Eif (x === -1) {
                                filterMem = allNodes[j];
                                break;
                            }
                        }
                    }
                    else {
                        filterMem = this.parent.localeObj.getConstant('multipleItems');
                    }
                }
            }
            else {
                filterMem = this.parent.localeObj.getConstant('all');
            }
            return filterMem;
        };
        PivotButton.prototype.updateOlapButtonText = function (engineModule, fieldName, firstNode, filterCount) {
            var filterMem;
            var filterItems = engineModule.fieldList[fieldName].actualFilter;
            if (filterItems.length > 0) {
                var cMembers = engineModule.fieldList[fieldName].members;
                var actualFilterItems = [];
                Eif (engineModule.fieldList[fieldName].filterMembers.length > 0) {
                    var dummyfilterItems = {};
                    for (var _i = 0, filterItems_1 = filterItems; _i < filterItems_1.length; _i++) {
                        var item = filterItems_1[_i];
                        dummyfilterItems[item] = item;
                        Eif (cMembers[item]) {
                            dummyfilterItems = this.parent.pivotCommon.eventBase.getParentNode(fieldName, item, dummyfilterItems);
                        }
                    }
                    var updatedFilterItems = dummyfilterItems ? Object.keys(dummyfilterItems) : [];
                    for (var _a = 0, updatedFilterItems_1 = updatedFilterItems; _a < updatedFilterItems_1.length; _a++) {
                        var item = updatedFilterItems_1[_a];
                        Eif (cMembers[item].isSelected) {
                            Eif (!(cMembers[item].parent && cMembers[cMembers[item].parent].isSelected)) {
                                actualFilterItems.push(item);
                            }
                        }
                    }
                    firstNode = actualFilterItems.length === 1 ? cMembers[actualFilterItems[0]].caption : firstNode;
                }
                filterCount = actualFilterItems.length === 0 ? filterCount : actualFilterItems.length;
            }
            if (filterCount === 0) {
                filterMem = (engineModule.fieldList[fieldName].allMember ?
                    engineModule.fieldList[fieldName].allMember : this.parent.localeObj.getConstant('all'));
            }
            else Eif (filterCount === 1) {
                filterMem = firstNode;
            }
            else if (filterCount > 1) {
                filterMem = this.parent.localeObj.getConstant('multipleItems');
            }
            return filterMem;
        };
        PivotButton.prototype.createDragClone = function (args) {
            var element = ej2_base_3.closest(args.element, '.' + cls.PIVOT_BUTTON_CLASS);
            var cloneElement = ej2_base_1.createElement('div', {
                id: this.parent.element.id + '_DragClone',
                className: cls.DRAG_CLONE_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : '')
            });
            var contentElement = ej2_base_1.createElement('span', {
                className: cls.TEXT_CONTENT_CLASS
            });
            contentElement.innerText = this.parent.enableHtmlSanitizer ? ej2_base_1.SanitizeHtmlHelper.sanitize(element.textContent) : element.textContent;
            cloneElement.appendChild(contentElement);
            document.body.appendChild(cloneElement);
            return cloneElement;
        };
        PivotButton.prototype.onDragStart = function (e) {
            var _this = this;
            var element = ej2_base_3.closest(e.element, '.' + cls.PIVOT_BUTTON_CLASS);
            var dragItem = document.getElementById(this.parent.element.id + '_DragClone');
            var fieldInfo = util_1.PivotUtil.getFieldInfo(element.getAttribute('data-uid'), this.parent);
            var dragEventArgs = {
                fieldName: fieldInfo.fieldName,
                fieldItem: fieldInfo.fieldItem,
                axis: fieldInfo.axis,
                dataSourceSettings: util_1.PivotUtil.getClonedDataSourceSettings(this.parent.dataSourceSettings),
                cancel: false
            };
            var control = this.parent.getModuleName() === 'pivotfieldlist' &&
                this.parent.isPopupView ? this.parent.pivotGridModule : this.parent;
            control.trigger(events.fieldDragStart, dragEventArgs, function (observedArgs) {
                Eif (!observedArgs.cancel) {
                    _this.parent.isDragging = true;
                    var engineModule = void 0;
                    Iif (_this.parent.dataType === 'olap') {
                        engineModule = _this.parent.olapEngineModule;
                    }
                    else {
                        engineModule = _this.parent.engineModule;
                    }
                    var data = engineModule.fieldList[element.getAttribute('data-uid')];
                    var axis = [cls.ROW_AXIS_CLASS, cls.COLUMN_AXIS_CLASS, cls.FILTER_AXIS_CLASS];
                    ej2_base_3.addClass([element], cls.SELECTED_NODE_CLASS);
                    if (dragItem && (_this.parent.getModuleName() === 'pivotfieldlist' &&
                        _this.parent.renderMode) === 'Popup') {
                        var fieldListPopup = _this.parent;
                        dragItem.style.zIndex = (fieldListPopup.dialogRenderer.fieldListDialog.zIndex + 1).toString();
                    }
                    if (data && data.aggregateType === 'CalculatedField') {
                        for (var _i = 0, axis_1 = axis; _i < axis_1.length; _i++) {
                            var axisContent = axis_1[_i];
                            ej2_base_3.addClass([_this.parentElement.querySelector('.' + axisContent)], cls.NO_DRAG_CLASS);
                        }
                    }
                }
                else {
                    _this.parent.isDragging = false;
                    _this.draggable.intDestroy(e.event);
                    ej2_base_1.detach(dragItem);
                }
            });
        };
        PivotButton.prototype.onDragging = function (e) {
            this.draggable.setProperties({ cursorAt: { top: (!ej2_base_3.isNullOrUndefined(e.event.targetTouches) || ej2_base_3.Browser.isDevice) ? 60 : -20 } });
        };
        PivotButton.prototype.onDragStop = function (args) {
            this.parent.isDragging = false;
            Iif (args.target && args.element && (ej2_base_3.closest(args.element, '.' + cls.GROUP_ALL_FIELDS_CLASS) &&
                !ej2_base_3.closest(args.target, '.' + cls.DROPPABLE_CLASS))) {
                args.cancel = true;
            }
            var element = ej2_base_3.closest(args.element, '.' + cls.PIVOT_BUTTON_CLASS);
            ej2_base_3.removeClass([].slice.call(this.parentElement.querySelectorAll('.' + cls.PIVOT_BUTTON_CLASS)), cls.SELECTED_NODE_CLASS);
            ej2_base_3.removeClass([].slice.call(this.parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS)), cls.INDICATOR_HOVER_CLASS);
            var axis = [cls.ROW_AXIS_CLASS, cls.COLUMN_AXIS_CLASS, cls.FILTER_AXIS_CLASS];
            for (var _i = 0, axis_2 = axis; _i < axis_2.length; _i++) {
                var axisContent = axis_2[_i];
                ej2_base_3.removeClass([this.parentElement.querySelector('.' + axisContent)], cls.NO_DRAG_CLASS);
            }
            if (this.parent.pivotCommon.filterDialog.dialogPopUp) {
                this.parent.pivotCommon.filterDialog.dialogPopUp.close();
            }
            Eif (document.getElementById(this.parent.element.id + '_DragClone')) {
                ej2_base_1.remove(document.getElementById(this.parent.element.id + '_DragClone'));
            }
            document.body.style.cursor = 'auto';
            if (!this.isButtonDropped(args.target, element) || args.cancel) {
                return;
            }
            this.parent.pivotCommon.dataSourceUpdate.control = this.parent.getModuleName() === 'pivotview' ? this.parent :
                (this.parent.pivotGridModule ? this.parent.pivotGridModule : this.parent);
            if (this.parent.pivotCommon.nodeStateModified.onStateModified(args, element.getAttribute('data-uid'))) {
                this.updateDataSource();
                var thisObj = this;
                thisObj.parent.axisFieldModule.render();
            }
        };
        PivotButton.prototype.isButtonDropped = function (dropTarget, target) {
            var axisPanel = ej2_base_3.closest(target, '.' + cls.DROPPABLE_CLASS);
            var droppableElement = ej2_base_3.closest(dropTarget, '.' + cls.DROPPABLE_CLASS);
            var isDropped = true;
            if (axisPanel && axisPanel === droppableElement) {
                var pivotButtons = [].slice.call(axisPanel.querySelectorAll('.' + cls.PIVOT_BUTTON_CLASS));
                var droppableTarget = ej2_base_3.closest(dropTarget, '.' + cls.PIVOT_BUTTON_WRAPPER_CLASS);
                var sourcePosition = void 0;
                var droppedPosition = -1;
                for (var i = 0, n = pivotButtons.length; i < n; i++) {
                    if (pivotButtons[i].id === target.id) {
                        sourcePosition = i;
                    }
                    if (droppableTarget) {
                        var droppableButton = droppableTarget.querySelector('.' + cls.PIVOT_BUTTON_CLASS);
                        if (pivotButtons[i].id === droppableButton.id) {
                            droppedPosition = i;
                        }
                    }
                }
                if (sourcePosition === droppedPosition || (sourcePosition === (pivotButtons.length - 1) && droppedPosition === -1)) {
                    ej2_base_3.removeClass([].slice.call(this.parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS)), cls.INDICATOR_HOVER_CLASS);
                    isDropped = false;
                }
            }
            return isDropped;
        };
        PivotButton.prototype.updateSorting = function (args) {
            var buttonElement = ej2_base_3.closest(args.target, '.' + cls.PIVOT_BUTTON_CLASS);
            var fieldInfo = util_1.PivotUtil.getFieldInfo((buttonElement ? buttonElement.getAttribute('data-uid') : ''), this.parent);
            if (!(args.target.classList.contains(cls.FILTER_COMMON_CLASS)) &&
                !(args.target.classList.contains(cls.REMOVE_CLASS)) &&
                !(args.target.classList.contains(cls.DRAG_CLASS)) &&
                (buttonElement && fieldInfo.fieldItem && (fieldInfo.fieldItem.showSortIcon ||
                    ej2_base_1.isNullOrUndefined(fieldInfo.fieldItem.showSortIcon)) && !fieldInfo.fieldItem.isCalculatedField)) {
                this.parent.actionObj.actionName = events.sortField;
                this.parent.actionObj.fieldInfo = fieldInfo;
                Iif (this.parent.actionBeginMethod()) {
                    return;
                }
                try {
                    Eif ((this.parent instanceof field_list_1.PivotFieldList || this.parent.groupingBarSettings.showSortIcon) &&
                        this.parent.dataSourceSettings.enableSorting &&
                        !(this.parent.dataType === 'olap' && ((this.parent.getModuleName() === 'pivotfieldlist' &&
                            this.parent.pivotGridModule !== undefined &&
                            this.parent.pivotGridModule.enableVirtualization) ||
                            (this.parent.getModuleName() === 'pivotview' && this.parent.enableVirtualization)))) {
                        this.parent.pivotCommon.eventBase.updateSorting(args);
                        if (this.parent.staticPivotGridModule) {
                            this.parent.staticPivotGridModule.actionObj = this.parent.actionObj;
                        }
                        if (this.parent.isDeferLayoutUpdate === false || (this.parent.pivotGridModule
                            && this.parent.pivotGridModule.pivotDeferLayoutUpdate === false) ||
                            this.parent.getModuleName() !== 'pivotfieldlist') {
                            var actionInfo = {
                                sortInfo: this.parent.lastSortInfo
                            };
                            this.parent.actionObj.actionInfo = actionInfo;
                            this.updateDataSource(true);
                        }
                        var thisObj = this;
                        if (thisObj.parent instanceof field_list_1.PivotFieldList) {
                            thisObj.axisField.render();
                            if (this.parent.isPopupView && this.parent.pivotGridModule) {
                                this.parent.pivotGridModule.notify(events.uiUpdate, this);
                            }
                            else if (this.parent.staticPivotGridModule) {
                                this.parent.staticPivotGridModule.notify(events.uiUpdate, this);
                            }
                        }
                    }
                }
                catch (execption) {
                    this.parent.actionFailureMethod(execption);
                }
            }
        };
        PivotButton.prototype.updateDataSource = function (isRefreshGrid) {
            if (this.parent.isDeferLayoutUpdate === false || (this.parent.pivotGridModule
                && this.parent.pivotGridModule.pivotDeferLayoutUpdate === false) ||
                this.parent.getModuleName() === 'pivotview') {
                this.parent.updateDataSource(isRefreshGrid);
            }
            else {
                if (this.parent.getModuleName() === 'pivotfieldlist' && this.parent.isPopupView && this.parent.pivotGridModule) {
                    Iif (this.parent.dataType === 'olap') {
                        this.parent.pivotGridModule.olapEngineModule = this.parent.olapEngineModule;
                    }
                    else {
                        this.parent.pivotGridModule.engineModule = this.parent.engineModule;
                    }
                    this.parent.pivotGridModule.notify(events.uiUpdate, this);
                    this.parent.pivotGridModule.setProperties({
                        dataSourceSettings: this.parent.dataSourceSettings.properties
                    }, true);
                }
                else {
                    this.parent.triggerPopulateEvent();
                }
            }
        };
        PivotButton.prototype.updateFiltering = function (args) {
            var pivotObj = this.parent.pivotGridModule ?
                this.parent.pivotGridModule : this.parent;
            var fieldName = args.target.parentElement.getAttribute('data-uid');
            var fieldInfo = util_1.PivotUtil.getFieldInfo(fieldName, this.parent);
            this.parent.actionObj.actionName = events.filterField;
            this.parent.actionObj.fieldInfo = fieldInfo;
            Iif (this.parent.actionBeginMethod()) {
                return;
            }
            try {
                if (pivotObj.getModuleName() === 'pivotfieldlist') {
                    ej2_popups_1.showSpinner(pivotObj.fieldListSpinnerElement);
                }
                else {
                    pivotObj.showWaitingPopup();
                }
                pivotObj.mouseEventArgs = args;
                pivotObj.filterTargetID = this.parent.pivotCommon.moduleName !== 'pivotfieldlist' ?
                    this.parent.element : document.getElementById(this.parent.pivotCommon.parentID + '_Container');
                if (pivotObj.dataSourceSettings.mode === 'Server') {
                    Iif (this.parent.engineModule.fieldList[fieldName].members &&
                        Object.keys(this.parent.engineModule.fieldList[fieldName].members).length > 0) {
                        this.updateFilterEvents();
                    }
                    else {
                        pivotObj.getEngine('fetchFieldMembers', null, null, null, null, null, fieldName);
                    }
                }
                else {
                    if (pivotObj.dataType === 'pivot' && !this.parent.engineModule.fieldList[fieldName].isMembersFilled) {
                        this.parent.engineModule.fetchFieldMembers(fieldName);
                    }
                    this.updateFilterEvents();
                }
            }
            catch (execption) {
                this.parent.actionFailureMethod(execption);
            }
        };
        PivotButton.prototype.updateFilterEvents = function () {
            var pivotObj = this.parent.pivotGridModule ?
                this.parent.pivotGridModule : this.parent;
            this.parent.pivotCommon.eventBase.updateFiltering(pivotObj.mouseEventArgs);
            var target = pivotObj.mouseEventArgs.target;
            this.fieldName = target.parentElement.getAttribute('data-uid');
            if (this.parent.pivotCommon.filterDialog.dialogPopUp) {
                this.bindDialogEvents();
            }
            if (pivotObj.getModuleName() === 'pivotfieldlist') {
                ej2_popups_1.hideSpinner(pivotObj.fieldListSpinnerElement);
            }
            else {
                pivotObj.hideWaitingPopup();
            }
        };
        PivotButton.prototype.bindDialogEvents = function () {
            if (this.parent.pivotCommon.filterDialog.allowExcelLikeFilter && this.parent.pivotCommon.filterDialog.tabObj) {
                this.index = this.parent.pivotCommon.filterDialog.tabObj.selectedItem;
                this.updateDialogButtonEvents();
                this.parent.pivotCommon.filterDialog.dialogPopUp.buttons = this.buttonModel();
                this.parent.pivotCommon.filterDialog.dialogPopUp.dataBind();
                this.parent.pivotCommon.filterDialog.tabObj.selected = this.tabSelect.bind(this);
            }
            else Eif (this.parent.dataSourceSettings.allowMemberFilter) {
                this.index = 0;
                this.updateDialogButtonEvents();
            }
        };
        PivotButton.prototype.buttonModel = function () {
            return [
                {
                    isFlat: false,
                    buttonModel: {
                        cssClass: 'e-clear-filter-button' + (this.parent.pivotCommon.filterDialog.allowExcelLikeFilter ? '' : ' ' + cls.ICON_DISABLE) + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
                        iconCss: 'e-icons e-clear-filter-icon', enableRtl: this.parent.enableRtl,
                        content: this.parent.localeObj.getConstant('clearFilter'), disabled: (this.parent.pivotCommon.filterDialog.filterObject ? false : true)
                    },
                    click: this.ClearFilter.bind(this)
                },
                {
                    isFlat: false,
                    buttonModel: {
                        cssClass: cls.OK_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('ok'), isPrimary: true
                    },
                    click: (this.index === 0 ? this.updateFilterState.bind(this, this.fieldName) : this.updateCustomFilter.bind(this))
                },
                {
                    isFlat: false,
                    click: this.parent.pivotCommon.filterDialog.closeFilterDialog.bind(this.parent.pivotCommon.filterDialog),
                    buttonModel: { cssClass: cls.CANCEL_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('cancel') }
                }
            ];
        };
        PivotButton.prototype.tabSelect = function (e) {
            this.index = e.selectedIndex;
            this.updateDialogButtonEvents();
            ej2_base_3.removeClass([].slice.call(this.parent.pivotCommon.filterDialog.dialogPopUp.element.querySelectorAll('.e-selected-tab')), 'e-selected-tab');
            Eif (e.selectedIndex > 0) {
                ej2_base_3.addClass([this.parent.pivotCommon.filterDialog.dialogPopUp.element.querySelector('.e-filter-div-content' + '.' + (e.selectedIndex === 1 && this.parent.dataSourceSettings.allowLabelFilter ? 'e-label-filter' : 'e-value-filter'))], 'e-selected-tab');
            }
            Iif (e.selectedIndex === 0) {
                this.parent.pivotCommon.filterDialog.updateCheckedState();
            }
            else {
                this.parent.pivotCommon.filterDialog.dialogPopUp.buttons[0].buttonModel.disabled = false;
                this.parent.pivotCommon.filterDialog.dialogPopUp.element.querySelector('.' + cls.OK_BUTTON_CLASS).removeAttribute('disabled');
            }
        };
        PivotButton.prototype.updateDialogButtonEvents = function () {
            this.parent.pivotCommon.filterDialog.dialogPopUp.buttons = this.buttonModel();
            this.parent.pivotCommon.filterDialog.dialogPopUp.dataBind();
        };
        PivotButton.prototype.updateCustomFilter = function () {
            var _this = this;
            var dialogElement = this.parent.pivotCommon.filterDialog.dialogPopUp.element.querySelector('.e-selected-tab');
            var fieldName = dialogElement.getAttribute('data-fieldname');
            var levelName = dialogElement.getAttribute('data-selectedField');
            var filterType = dialogElement.getAttribute('data-type');
            var measure = dialogElement.getAttribute('data-measure');
            var operator = dialogElement.getAttribute('data-operator');
            var operand1 = dialogElement.getAttribute('data-value1');
            var operand2 = dialogElement.getAttribute('data-value2');
            var type = ((filterType === 'value') ? 'Value' : (filterType === 'date') ? 'Date' :
                (filterType === 'number') ? 'Number' : 'Label');
            var filterItem = {
                name: fieldName,
                type: type,
                measure: measure,
                condition: operator,
                value1: filterType === 'date' ? new Date(operand1) : operand1,
                value2: filterType === 'date' ? new Date(operand2) : operand2
            };
            var filterObject;
            Iif (this.parent.dataType === 'olap') {
                filterItem.selectedField = levelName;
                this.removeDataSourceSettings(fieldName, levelName, type);
                var filterItems = this.parent.dataSourceSettings.filterSettings;
                for (var _i = 0, filterItems_2 = filterItems; _i < filterItems_2.length; _i++) {
                    var item = filterItems_2[_i];
                    if (item.name === fieldName && item.selectedField === levelName) {
                        filterObject = item;
                    }
                }
            }
            else {
                filterObject = util_1.PivotUtil.getFilterItemByName(fieldName, this.parent.dataSourceSettings.filterSettings);
            }
            if ((ej2_base_3.isNullOrUndefined(operand1) || operand1 === '') ||
                (['Between', 'NotBetween'].indexOf(operator) > -1 && (ej2_base_3.isNullOrUndefined(operand2) || operand2 === ''))) {
                var inputElementString = (type.toLowerCase() + ((ej2_base_3.isNullOrUndefined(operand1) || operand1 === '') ? '_input_option_1' : '_input_option_2'));
                var focusElement = ej2_base_2.select('#' + this.parent.element.id + '_' + inputElementString, dialogElement);
                ej2_base_3.addClass([focusElement], cls.EMPTY_FIELD);
                focusElement.focus();
                return;
            }
            var filterEventArgs = {
                cancel: false,
                filterSettings: filterItem,
                dataSourceSettings: util_1.PivotUtil.getClonedDataSourceSettings(this.parent.dataSourceSettings)
            };
            var control = this.parent.getModuleName() === 'pivotfieldlist' &&
                this.parent.isPopupView ? this.parent.pivotGridModule : this.parent;
            control.trigger(events.memberFiltering, filterEventArgs, function (observedArgs) {
                Eif (!observedArgs.cancel) {
                    filterItem = observedArgs.filterSettings;
                    Eif (filterObject) {
                        filterObject = filterObject.properties ?
                            filterObject.properties : filterObject;
                        filterObject.type = filterItem.type;
                        filterObject.measure = filterItem.measure;
                        filterObject.condition = filterItem.condition;
                        filterObject.value1 = filterItem.value1;
                        filterObject.value2 = filterItem.value2;
                        Iif (_this.parent.dataType === 'olap') {
                            filterObject.selectedField = filterItem.selectedField;
                        }
                    }
                    else {
                        _this.parent.dataSourceSettings.filterSettings.push(filterItem);
                    }
                }
                Eif (type !== 'Value') {
                    _this.parent.lastFilterInfo = util_1.PivotUtil.getFilterItemByName(fieldName, _this.parent.dataSourceSettings.filterSettings);
                    _this.parent.lastFilterInfo = _this.parent.lastFilterInfo.properties ?
                        _this.parent.lastFilterInfo.properties : _this.parent.lastFilterInfo;
                }
                _this.parent.pivotCommon.filterDialog.dialogPopUp.close();
                Eif (!observedArgs.cancel) {
                    _this.refreshPivotButtonState(fieldName, true);
                    _this.updateDataSource(true);
                }
            });
        };
        PivotButton.prototype.ClearFilter = function () {
            var dialogElement = this.parent.pivotCommon.filterDialog.dialogPopUp.element;
            var fieldName = dialogElement.getAttribute('data-fieldname');
            var tabElement = dialogElement.querySelector('.e-selected-tab');
            this.parent.pivotCommon.filterDialog.dialogPopUp.close();
            if (this.parent.dataType === 'olap' && tabElement) {
                var levelName = tabElement.getAttribute('data-selectedField');
                this.removeDataSourceSettings(fieldName, levelName);
            }
            else {
                this.removeDataSourceSettings(fieldName);
            }
            var filterObject = util_1.PivotUtil.getFilterItemByName(fieldName, this.parent.dataSourceSettings.filterSettings);
            this.refreshPivotButtonState(fieldName, filterObject ? true : false);
            this.updateDataSource(true);
        };
        PivotButton.prototype.removeButton = function (args) {
            var _this = this;
            var target = args.target;
            var fieldName = target.parentElement.getAttribute('data-uid');
            var fieldInfo = util_1.PivotUtil.getFieldInfo(fieldName, this.parent);
            this.parent.actionObj.actionName = events.removeField;
            this.parent.actionObj.fieldInfo = fieldInfo;
            Iif (this.parent.actionBeginMethod()) {
                return;
            }
            var removeFieldArgs = {
                cancel: false, fieldName: fieldName,
                dataSourceSettings: util_1.PivotUtil.getClonedDataSourceSettings(this.parent.dataSourceSettings),
                fieldItem: fieldInfo.fieldItem, axis: fieldInfo.axis
            };
            try {
                var control = this.parent.getModuleName() === 'pivotfieldlist' &&
                    this.parent.isPopupView ? this.parent.pivotGridModule : this.parent;
                control.trigger(events.fieldRemove, removeFieldArgs, function (observedArgs) {
                    Eif (!observedArgs.cancel) {
                        Iif (target.parentElement.getAttribute('isvalue') === 'true') {
                            _this.parent.setProperties({ dataSourceSettings: { values: [] } }, true);
                            if (_this.parent.dataType === 'olap') {
                                _this.parent.pivotCommon.dataSourceUpdate.removeFieldFromReport('[Measures]');
                            }
                        }
                        else {
                            _this.parent.pivotCommon.dataSourceUpdate.removeFieldFromReport(fieldName);
                            if (_this.parent.dataType === 'pivot' && _this.parent.showValuesButton && _this.parent.dataSourceSettings.values.length > 1 &&
                                fieldInfo.position < _this.parent.dataSourceSettings.valueIndex && ((_this.parent.dataSourceSettings.valueAxis === 'row' &&
                                observedArgs.axis === 'rows') || (_this.parent.dataSourceSettings.valueAxis === 'column' && observedArgs.axis === 'columns'))) {
                                _this.parent.setProperties({
                                    dataSourceSettings: { valueIndex: _this.parent.dataSourceSettings.valueIndex - 1 }
                                }, true);
                            }
                            Iif (_this.parent.dataType === 'olap' && _this.parent.dataSourceSettings.values.length === 0) {
                                _this.parent.pivotCommon.dataSourceUpdate.removeFieldFromReport('[Measures]');
                            }
                        }
                        if (_this.parent.getModuleName() === 'pivotfieldlist') {
                            _this.parent.axisFieldModule.render();
                        }
                        _this.updateDataSource();
                    }
                });
            }
            catch (execption) {
                this.parent.actionFailureMethod(execption);
            }
        };
        PivotButton.prototype.nodeStateModified = function (args) {
            var target = ej2_base_3.closest(args.node, 'li');
            var fieldName = target.getAttribute('data-fieldname');
            if (target.getAttribute('data-memberId') === 'all') {
                this.parent.pivotCommon.filterDialog.memberTreeView.nodeChecked = null;
                if (args.action === 'check') {
                    this.parent.pivotCommon.filterDialog.memberTreeView.checkAll();
                }
                else {
                    this.parent.pivotCommon.filterDialog.memberTreeView.uncheckAll();
                }
                Iif (this.parent.dataType === 'olap' && this.parent.olapEngineModule &&
                    !this.parent.olapEngineModule.fieldList[fieldName].isHierarchy) {
                    this.updateNodeStates(this.parent.pivotCommon.filterDialog.memberTreeView.getAllCheckedNodes(), fieldName);
                }
                this.checkedStateAll(args.action);
                this.parent.pivotCommon.filterDialog.memberTreeView.nodeChecked = this.nodeStateModified.bind(this);
            }
            else {
                Iif (this.parent.dataType === 'olap' && this.parent.olapEngineModule &&
                    !this.parent.olapEngineModule.fieldList[fieldName].isHierarchy) {
                    var checkedNodes = this.parent.pivotCommon.filterDialog.memberTreeView.getAllCheckedNodes();
                    this.updateNodeStates(checkedNodes, fieldName);
                }
                var pos = this.parent.pivotCommon.currentTreeItemsPos[target.getAttribute('data-memberId')].index;
                Eif (this.parent.pivotCommon.currentTreeItems[pos]) {
                    this.parent.pivotCommon.currentTreeItems[pos].isSelected = args.action === 'check';
                    this.parent.pivotCommon.currentTreeItemsPos[target.getAttribute('data-memberId')].isSelected = args.action === 'check';
                }
            }
            this.parent.pivotCommon.filterDialog.updateCheckedState();
        };
        PivotButton.prototype.checkedStateAll = function (state) {
            var searchItemObj = {};
            for (var _i = 0, _a = this.parent.pivotCommon.searchTreeItems; _i < _a.length; _i++) {
                var item = _a[_i];
                item.isSelected = state === 'check';
                searchItemObj[item.htmlAttributes['data-memberId']] = item.htmlAttributes['data-memberId'];
            }
            for (var _b = 0, _c = this.parent.pivotCommon.currentTreeItems; _b < _c.length; _b++) {
                var item = _c[_b];
                Eif (searchItemObj[item.htmlAttributes['data-memberId']] !== undefined) {
                    item.isSelected = state === 'check';
                    this.parent.pivotCommon.currentTreeItemsPos[item.htmlAttributes['data-memberId']].isSelected = state === 'check';
                }
            }
        };
        PivotButton.prototype.updateNodeStates = function (checkedNodes, fieldName) {
            var fieldList = this.parent.pivotCommon.engineModule.fieldList[fieldName];
            var currentMembers = fieldList.members;
            var searchMembers = fieldList.currrentMembers;
            if (fieldList.searchMembers.length > 0) {
                var members = Object.keys(searchMembers);
                for (var _i = 0, members_1 = members; _i < members_1.length; _i++) {
                    var member = members_1[_i];
                    if (searchMembers[member]) {
                        searchMembers[member].isSelected = false;
                    }
                    if (currentMembers[member]) {
                        currentMembers[member].isSelected = false;
                        if (this.parent.pivotCommon.filterDialog.memberTreeView.element.querySelector('li[data-memberId="' + member + '"]')) {
                            var element = this.parent.pivotCommon.filterDialog.memberTreeView.element.querySelector('li[data-memberId="' + member + '"]');
                            if (element && !element.querySelector('ul')) {
                                this.parent.pivotCommon.eventBase.updateChildNodeStates(fieldList.filterMembers, fieldName, member, false);
                            }
                        }
                    }
                }
                for (var _a = 0, checkedNodes_1 = checkedNodes; _a < checkedNodes_1.length; _a++) {
                    var node = checkedNodes_1[_a];
                    if (currentMembers[node]) {
                        if (this.parent.pivotCommon.filterDialog.memberTreeView.element.querySelector('li[data-memberId="' + node + '"]')) {
                            var element = this.parent.pivotCommon.filterDialog.memberTreeView.element.querySelector('li[data-memberId="' + node + '"]');
                            if (element && !element.querySelector('ul')) {
                                currentMembers[node].isSelected = true;
                                this.parent.pivotCommon.eventBase.updateChildNodeStates(fieldList.filterMembers, fieldName, node, true);
                            }
                        }
                    }
                    if (searchMembers[node]) {
                        searchMembers[node].isSelected = true;
                    }
                }
            }
            else {
                var members = Object.keys(currentMembers);
                for (var _b = 0, members_2 = members; _b < members_2.length; _b++) {
                    var member = members_2[_b];
                    if (currentMembers[member].isSelected) {
                        currentMembers[member].isSelected = false;
                    }
                }
                for (var _c = 0, checkedNodes_2 = checkedNodes; _c < checkedNodes_2.length; _c++) {
                    var node = checkedNodes_2[_c];
                    if (currentMembers[node]) {
                        currentMembers[node].isSelected = true;
                        this.parent.pivotCommon.eventBase.updateChildNodeStates(fieldList.filterMembers, fieldName, node, true);
                    }
                }
            }
        };
        PivotButton.prototype.updateFilterState = function (fieldName) {
            var _this = this;
            var isNodeUnChecked = false;
            var filterItem = { items: [], name: fieldName, type: 'Include' };
            var engineModule = this.parent.dataType === 'olap' ? this.parent.olapEngineModule : this.parent.engineModule;
            Iif (this.parent.dataType === 'olap' && engineModule &&
                !engineModule.fieldList[fieldName].isHierarchy) {
                var cMembers = engineModule.fieldList[fieldName].members;
                var sMembers = engineModule.fieldList[fieldName].currrentMembers;
                filterItem.items = this.parent.pivotCommon.filterDialog.memberTreeView.getAllCheckedNodes();
                filterItem.levelCount = engineModule.fieldList[fieldName].levelCount;
                isNodeUnChecked = (filterItem.items.length ===
                    this.parent.pivotCommon.filterDialog.memberTreeView.fields.dataSource.length ?
                    false : true);
                if (engineModule.fieldList[fieldName].searchMembers.length > 0 && !isNodeUnChecked) {
                    var cNodeLength = Object.keys(cMembers).length;
                    var sNodeLength = Object.keys(sMembers).length;
                    isNodeUnChecked = cNodeLength === sNodeLength && cNodeLength === filterItem.items.length ? false : true;
                }
                var filterItems = filterItem.items;
                for (var _i = 0, filterItems_3 = filterItems; _i < filterItems_3.length; _i++) {
                    var node = filterItems_3[_i];
                    if (engineModule.fieldList[fieldName].searchMembers.length > 0 && sMembers[node]) {
                        sMembers[node].isSelected = true;
                    }
                    else if (cMembers[node]) {
                        cMembers[node].isSelected = true;
                    }
                }
            }
            else {
                for (var _a = 0, _b = this.parent.pivotCommon.searchTreeItems; _a < _b.length; _a++) {
                    var item = _b[_a];
                    if (item.isSelected) {
                        if (this.parent.pivotCommon.isDateField) {
                            filterItem.items.push(item.name);
                        }
                        else {
                            filterItem.items.push(item.htmlAttributes['data-memberId']);
                        }
                    }
                }
                isNodeUnChecked = (filterItem.items.length === this.parent.pivotCommon.currentTreeItems.length ?
                    false : true);
            }
            if (this.parent.dataType === 'olap') {
                this.removeDataSourceSettings(fieldName);
            }
            if (this.parent.allowDeferLayoutUpdate) {
                engineModule.fieldList[filterItem.name].filterType = filterItem.type.toLowerCase();
                engineModule.fieldList[filterItem.name].filter = [];
                for (var i = 0; i < filterItem.items.length; i++) {
                    engineModule.fieldList[filterItem.name].filter.push(filterItem.items[i]);
                }
            }
            var filterEventArgs = {
                filterSettings: filterItem,
                dataSourceSettings: util_1.PivotUtil.getClonedDataSourceSettings(this.parent.dataSourceSettings),
                cancel: false
            };
            var control = this.parent.getModuleName() === 'pivotfieldlist' &&
                this.parent.isPopupView ? this.parent.pivotGridModule : this.parent;
            control.trigger(events.memberFiltering, filterEventArgs, function (observedArgs) {
                filterItem = observedArgs.filterSettings;
                Eif (!observedArgs.cancel) {
                    var filterObject = util_1.PivotUtil.getFilterItemByName(fieldName, _this.parent.dataSourceSettings.filterSettings);
                    if (filterObject) {
                        for (var i = 0; i < _this.parent.dataSourceSettings.filterSettings.length; i++) {
                            if (_this.parent.dataSourceSettings.filterSettings[i].name === fieldName) {
                                _this.parent.dataSourceSettings.filterSettings.splice(i, 1);
                                break;
                            }
                        }
                    }
                    _this.parent.dataSourceSettings.filterSettings.push(filterItem);
                }
                _this.parent.pivotCommon.filterDialog.dialogPopUp.close();
                Eif (!observedArgs.cancel) {
                    _this.refreshPivotButtonState(fieldName, isNodeUnChecked);
                    if (!isNodeUnChecked) {
                        _this.removeDataSourceSettings(fieldName);
                        filterItem = {};
                    }
                    _this.parent.lastFilterInfo = filterItem;
                    var actionInfo = {
                        filterInfo: _this.parent.lastFilterInfo
                    };
                    _this.parent.actionObj.actionInfo = actionInfo;
                    _this.updateDataSource(true);
                    var thisObj = _this;
                    if (thisObj.parent instanceof field_list_1.PivotFieldList) {
                        thisObj.axisField.render();
                    }
                }
                var pivotButtons = [].slice.call(_this.parentElement.querySelectorAll('.e-pivot-button'));
                for (var _i = 0, pivotButtons_1 = pivotButtons; _i < pivotButtons_1.length; _i++) {
                    var item = pivotButtons_1[_i];
                    if (item.getAttribute('data-uid') === fieldName) {
                        item.focus();
                        break;
                    }
                }
            });
        };
        PivotButton.prototype.refreshPivotButtonState = function (fieldName, isFiltered) {
            var pivotButtons = [].slice.call(this.parentElement.querySelectorAll('.e-pivot-button'));
            var selectedButton;
            for (var _i = 0, pivotButtons_2 = pivotButtons; _i < pivotButtons_2.length; _i++) {
                var item = pivotButtons_2[_i];
                if (item.getAttribute('data-uid') === fieldName) {
                    selectedButton = item.querySelector('.' + cls.FILTER_COMMON_CLASS);
                    break;
                }
            }
            Eif (selectedButton) {
                if (isFiltered) {
                    ej2_base_3.removeClass([selectedButton], cls.FILTER_CLASS);
                    ej2_base_3.addClass([selectedButton], cls.FILTERED_CLASS);
                }
                else {
                    ej2_base_3.removeClass([selectedButton], cls.FILTERED_CLASS);
                    ej2_base_3.addClass([selectedButton], cls.FILTER_CLASS);
                }
            }
        };
        PivotButton.prototype.removeDataSourceSettings = function (fieldName, selectedField, type) {
            var filterSettings = this.parent.dataSourceSettings.filterSettings;
            for (var len = 0, lnt = filterSettings.length; len < lnt; len++) {
                Iif (this.parent.dataType === 'olap' && selectedField) {
                    if (!type && filterSettings[len].name === fieldName &&
                        filterSettings[len].selectedField === selectedField) {
                        filterSettings.splice(len, 1);
                        break;
                    }
                    else if (type) {
                        if (filterSettings[len].type !== type &&
                            filterSettings[len].name === fieldName) {
                            filterSettings.splice(len, 1);
                            lnt--;
                            len--;
                        }
                    }
                }
                else {
                    if (filterSettings[len].name === fieldName) {
                        filterSettings.splice(len, 1);
                        Eif (this.parent.dataType !== 'olap') {
                            break;
                        }
                        lnt--;
                        len--;
                    }
                }
            }
        };
        PivotButton.prototype.updateDropIndicator = function (e) {
            Eif (this.parent.isDragging) {
                ej2_base_3.removeClass([].slice.call(this.parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS + '-last')), cls.INDICATOR_HOVER_CLASS);
                ej2_base_3.removeClass([].slice.call(this.parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS)), cls.INDICATOR_HOVER_CLASS);
                Eif (ej2_base_3.closest(e.target, '.' + cls.DROPPABLE_CLASS)) {
                    var element = ej2_base_3.closest(e.target, '.' + cls.PIVOT_BUTTON_WRAPPER_CLASS);
                    ej2_base_3.addClass([element.querySelector('.' + cls.DROP_INDICATOR_CLASS)], cls.INDICATOR_HOVER_CLASS);
                }
            }
        };
        PivotButton.prototype.wireEvent = function (element, axis, isMeasureAvail) {
            ej2_base_2.EventHandler.add(element, 'mouseover', this.updateDropIndicator, this);
            if (!isMeasureAvail) {
                if (['filters', 'values'].indexOf(axis) === -1 && element.querySelector('.' + cls.PIVOT_BUTTON_CLASS) !== null) {
                    ej2_base_2.EventHandler.add(element.querySelector('.' + cls.PIVOT_BUTTON_CLASS), 'click', this.updateSorting, this);
                }
                if (axis !== 'values' && element.querySelector('.' + cls.FILTER_COMMON_CLASS) !== null) {
                    ej2_base_2.EventHandler.add(element.querySelector('.' + cls.FILTER_COMMON_CLASS), 'click', this.updateFiltering, this);
                }
                if (axis === 'values' && element.querySelector('.' + cls.AXISFIELD_ICON_CLASS) !== null) {
                    ej2_base_2.EventHandler.add(element.querySelector('.' + cls.AXISFIELD_ICON_CLASS), 'click', this.createMenuOption, this);
                }
            }
            if (element.querySelector('.' + cls.CALC_EDIT) !== null) {
                ej2_base_2.EventHandler.add(element.querySelector('.' + cls.CALC_EDIT), 'click', this.openCalculatedFieldDialog, this);
            }
            if (element.querySelector('.' + cls.REMOVE_CLASS) !== null) {
                ej2_base_2.EventHandler.add(element.querySelector('.' + cls.REMOVE_CLASS), 'click', this.removeButton, this);
            }
        };
        PivotButton.prototype.unWireEvent = function (element, axis, isMeasureAvail) {
            ej2_base_2.EventHandler.remove(element, 'mouseover', this.updateDropIndicator);
            if (!isMeasureAvail) {
                if (['filters', 'values'].indexOf(axis) === -1 && element.querySelector('.' + cls.PIVOT_BUTTON_CLASS) !== null) {
                    ej2_base_2.EventHandler.remove(element.querySelector('.' + cls.PIVOT_BUTTON_CLASS), 'click', this.updateSorting);
                }
                if (axis !== 'values' && element.querySelector('.' + cls.FILTER_COMMON_CLASS) !== null) {
                    ej2_base_2.EventHandler.remove(element.querySelector('.' + cls.FILTER_COMMON_CLASS), 'click', this.updateFiltering);
                }
                if (axis === 'values' && element.querySelector('.' + cls.AXISFIELD_ICON_CLASS) !== null) {
                    ej2_base_2.EventHandler.remove(element.querySelector('.' + cls.AXISFIELD_ICON_CLASS), 'click', this.createMenuOption);
                }
            }
            if (element.querySelector('.' + cls.CALC_EDIT) !== null) {
                ej2_base_2.EventHandler.remove(element.querySelector('.' + cls.CALC_EDIT), 'click', this.openCalculatedFieldDialog);
            }
            if (element.querySelector('.' + cls.REMOVE_CLASS) !== null) {
                ej2_base_2.EventHandler.remove(element.querySelector('.' + cls.REMOVE_CLASS), 'click', this.removeButton);
            }
        };
        PivotButton.prototype.addEventListener = function () {
            this.handlers = {
                load: this.renderPivotButton
            };
            Iif (this.parent.isDestroyed) {
                return;
            }
            this.parent.on(events.pivotButtonUpdate, this.handlers.load, this);
        };
        PivotButton.prototype.removeEventListener = function () {
            Iif (this.parent.isDestroyed) {
                return;
            }
            this.parent.off(events.pivotButtonUpdate, this.handlers.load);
        };
        PivotButton.prototype.destroy = function () {
            Eif (this.menuOption) {
                this.menuOption.destroy();
                this.menuOption = null;
            }
            var element = ej2_base_2.select('.' + cls.GROUP_CHART_VALUE_DROPDOWN_DIV, this.parentElement);
            var valueFiedDropDownList = element ? ej2_base_1.getInstance(element, ej2_dropdowns_1.DropDownList) : null;
            if (valueFiedDropDownList && !valueFiedDropDownList.isDestroyed) {
                valueFiedDropDownList.destroy();
            }
            element = ej2_base_2.select('.' + cls.GROUP_CHART_COLUMN_DROPDOWN_DIV, this.parentElement);
            var columnFieldDropDownList = element ? ej2_base_1.getInstance(element, ej2_dropdowns_1.DropDownList) : null;
            if (columnFieldDropDownList && !columnFieldDropDownList.isDestroyed) {
                columnFieldDropDownList.destroy();
                columnFieldDropDownList = null;
            }
            if (this.draggable && !this.draggable.isDestroyed) {
                this.draggable.destroy();
                this.draggable = null;
            }
            if (this.axisField) {
                this.axisField = null;
            }
            this.removeEventListener();
            this.isDestroyed = true;
        };
        return PivotButton;
    }());
    exports.PivotButton = PivotButton;
});