JSFiddle - React, Tailwind, and code Playground

by MrTest

JavaScript

$(document).ready(function() {

/*! Filsters DropDown
    ---------------------------------------------*/
    $('.rightPaneReport > a').click(function() {

        if ($(this).hasClass('filters')) {
            $(this).next('.filter').slideToggle(200);
        }
        return false;
    });

    $('.contacts-summary > p').click(function() {
        $(this).next().slideToggle(200);
    });

    $('.contacts-summary > p:first-child').next().show();

    /* Contact summary table*/
    $('.summary-table tbody tr td').filter(':odd').addClass('odd');
    $('.summary-table tbody tr td').filter(':even').addClass('even');

    // DatePicker
    $(".datepicker").datepicker({
        changeMonth: true,
        changeYear: true,
        dateFormat: 'dd-mm-yy'
    });

    // Data <-> Grid Switch
    $('.data-grid-switch').click(function() {

        if ($(this).html() === "View Data Table.") {
            $(this).html('View Data Graph.');
            $('.graph-view').hide();
            $('div.data-view').show();

        } else if ($(this).html() === "View Data Graph.") {
            $(this).html('View Data Table.');
            $('div.data-view').hide();
            $('.graph-view').show();
        }

    });

    // Product Destination Switch
    $('.product-destination-switch').click(function() {

        if ($(this).html() === "Suppliers Addresses") {

            $(this).html('Destination Table');
            $('.destination-table').hide();
            $('.suppliers-addresses').show();

        } else if ($(this).html() === "Destination Table") {

            $(this).html('Suppliers Addresses');
            $('.suppliers-addresses').hide();
            $('.destination-table').show();

        }
        return false;
    });

    // Composition Page
    if ($('#tabs').length > 0) {

        $('#tabs').tabs();
    }

    //DataTable
    if ($('.datatable').length > 0) {

        if ($('.compositional-single-table').length > 0) {

           ...