vuexy 0.1.0

data/app/assets/javascripts/vuexy/scripts/pages/app-invoice.js

@@ -0,0 +1,205 @@
+/*=========================================================================================
+    File Name: app-invoice.js
+    Description: app-invoice Javascripts
+    ----------------------------------------------------------------------------------------
+    Item Name: Vuexy  - Vuejs, HTML & Laravel Admin Dashboard Template
+   Version: 1.0
+    Author: PIXINVENT
+    Author URL: http://www.themeforest.net/user/pixinvent
+==========================================================================================*/
+$(function () {
+  'use strict';
+
+  var applyChangesBtn = $('.btn-apply-changes'),
+    discount,
+    tax1,
+    tax2,
+    discountInput,
+    tax1Input,
+    tax2Input,
+    sourceItem = $('.source-item'),
+    date = new Date(),
+    datepicker = $('.date-picker'),
+    dueDate = $('.due-date-picker'),
+    select2 = $('.invoiceto'),
+    countrySelect = $('#customer-country'),
+    btnAddNewItem = $('.btn-add-new '),
+    adminDetails = {
+      'App Design': 'Designed UI kit & app pages.',
+      'App Customization': 'Customization & Bug Fixes.',
+      'ABC Template': 'Bootstrap 4 admin template.',
+      'App Development': 'Native App Development.'
+    },
+    customerDetails = {
+      shelby: {
+        name: 'Thomas Shelby',
+        company: 'Shelby Company Limited',
+        address: 'Small Heath, Birmingham',
+        pincode: 'B10 0HF',
+        country: 'UK',
+        tel: 'Tel: 718-986-6062',
+        email: 'peakyFBlinders@gmail.com'
+      },
+      hunters: {
+        name: 'Dean Winchester',
+        company: 'Hunters Corp',
+        address: '951  Red Hawk Road Minnesota,',
+        pincode: '56222',
+        country: 'USA',
+        tel: 'Tel: 763-242-9206',
+        email: 'waywardSon@gmail.com'
+      }
+    };
+
+  // init date picker
+  if (datepicker.length) {
+    datepicker.each(function () {
+      $(this).flatpickr({
+        defaultDate: date
+      });
+    });
+  }
+
+  if (dueDate.length) {
+    dueDate.flatpickr({
+      defaultDate: new Date(date.getFullYear(), date.getMonth(), date.getDate() + 5)
+    });
+  }
+
+  // Country Select2
+  if (countrySelect.length) {
+    countrySelect.select2({
+      placeholder: 'Select country',
+      dropdownParent: countrySelect.parent()
+    });
+  }
+
+  // Close select2 on modal open
+  $(document).on('click', '.add-new-customer', function () {
+    select2.select2('close');
+  });
+
+  // Select2
+  if (select2.length) {
+    select2.select2({
+      placeholder: 'Select Customer',
+      dropdownParent: $('.invoice-customer')
+    });
+
+    select2.on('change', function () {
+      var $this = $(this),
+        renderDetails =
+          '<div class="customer-details mt-1">' +
+          '<p class="mb-25">' +
+          customerDetails[$this.val()].name +
+          '</p>' +
+          '<p class="mb-25">' +
+          customerDetails[$this.val()].company +
+          '</p>' +
+          '<p class="mb-25">' +
+          customerDetails[$this.val()].address +
+          '</p>' +
+          '<p class="mb-25">' +
+          customerDetails[$this.val()].country +
+          '</p>' +
+          '<p class="mb-0">' +
+          customerDetails[$this.val()].tel +
+          '</p>' +
+          '<p class="mb-0">' +
+          customerDetails[$this.val()].email +
+          '</p>' +
+          '</div>';
+      $('.row-bill-to').find('.customer-details').remove();
+      $('.row-bill-to').find('.col-bill-to').append(renderDetails);
+    });
+
+    select2.on('select2:open', function () {
+      if (!$(document).find('.add-new-customer').length) {
+        $(document)
+          .find('.select2-results__options')
+          .before(
+            '<div class="add-new-customer btn btn-flat-success cursor-pointer rounded-0 text-start mb-50 p-50 w-100" data-bs-toggle="modal" data-bs-target="#add-new-customer-sidebar">' +
+              feather.icons['plus'].toSvg({ class: 'font-medium-1 me-50' }) +
+              '<span class="align-middle">Add New Customer</span></div>'
+          );
+      }
+    });
+  }
+
+  // Repeater init
+  if (sourceItem.length) {
+    sourceItem.on('submit', function (e) {
+      e.preventDefault();
+    });
+    sourceItem.repeater({
+      show: function () {
+        $(this).slideDown();
+      },
+      hide: function (e) {
+        $(this).slideUp();
+      }
+    });
+  }
+
+  // Prevent dropdown from closing on tax change
+  $(document).on('click', '.tax-select', function (e) {
+    e.stopPropagation();
+  });
+
+  // On tax change update it's value
+  function updateValue(listener, el) {
+    listener.closest('.repeater-wrapper').find(el).text(listener.val());
+  }
+
+  // Apply item changes btn
+  if (applyChangesBtn.length) {
+    $(document).on('click', '.btn-apply-changes', function (e) {
+      var $this = $(this);
+      tax1Input = $this.closest('.dropdown-menu').find('#tax-1-input');
+      tax2Input = $this.closest('.dropdown-menu').find('#tax-2-input');
+      discountInput = $this.closest('.dropdown-menu').find('#discount-input');
+      tax1 = $this.closest('.repeater-wrapper').find('.tax-1');
+      tax2 = $this.closest('.repeater-wrapper').find('.tax-2');
+      discount = $('.discount');
+
+      if (tax1Input.val() !== null) {
+        updateValue(tax1Input, tax1);
+      }
+
+      if (tax2Input.val() !== null) {
+        updateValue(tax2Input, tax2);
+      }
+
+      if (discountInput.val().length) {
+        var finalValue = discountInput.val() <= 100 ? discountInput.val() : 100;
+        $this
+          .closest('.repeater-wrapper')
+          .find(discount)
+          .text(finalValue + '%');
+      }
+    });
+  }
+
+  // Item details select onchange
+  $(document).on('change', '.item-details', function () {
+    var $this = $(this),
+      value = adminDetails[$this.val()];
+    if ($this.next('textarea').length) {
+      $this.next('textarea').val(value);
+    } else {
+      $this.after('<textarea class="form-control mt-2" rows="2">' + value + '</textarea>');
+    }
+  });
+  if (btnAddNewItem.length) {
+    btnAddNewItem.on('click', function () {
+      if (feather) {
+        // featherSVG();
+        feather.replace({ width: 14, height: 14 });
+      }
+      var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
+      var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
+        return new bootstrap.Tooltip(tooltipTriggerEl);
+      });
+    });
+  }
+});

data/app/assets/javascripts/vuexy/scripts/pages/app-invoice.min.js

@@ -0,0 +1 @@
+$((function(){"use strict";var e,t,n,a,o,l,s=$(".btn-apply-changes"),c=$(".source-item"),i=new Date,r=$(".date-picker"),d=$(".due-date-picker"),p=$(".invoiceto"),u=$("#customer-country"),m=$(".btn-add-new "),h={"App Design":"Designed UI kit & app pages.","App Customization":"Customization & Bug Fixes.","ABC Template":"Bootstrap 4 admin template.","App Development":"Native App Development."},f={shelby:{name:"Thomas Shelby",company:"Shelby Company Limited",address:"Small Heath, Birmingham",pincode:"B10 0HF",country:"UK",tel:"Tel: 718-986-6062",email:"peakyFBlinders@gmail.com"},hunters:{name:"Dean Winchester",company:"Hunters Corp",address:"951  Red Hawk Road Minnesota,",pincode:"56222",country:"USA",tel:"Tel: 763-242-9206",email:"waywardSon@gmail.com"}};function g(e,t){e.closest(".repeater-wrapper").find(t).text(e.val())}r.length&&r.each((function(){$(this).flatpickr({defaultDate:i})})),d.length&&d.flatpickr({defaultDate:new Date(i.getFullYear(),i.getMonth(),i.getDate()+5)}),u.length&&u.select2({placeholder:"Select country",dropdownParent:u.parent()}),$(document).on("click",".add-new-customer",(function(){p.select2("close")})),p.length&&(p.select2({placeholder:"Select Customer",dropdownParent:$(".invoice-customer")}),p.on("change",(function(){var e=$(this),t='<div class="customer-details mt-1"><p class="mb-25">'+f[e.val()].name+'</p><p class="mb-25">'+f[e.val()].company+'</p><p class="mb-25">'+f[e.val()].address+'</p><p class="mb-25">'+f[e.val()].country+'</p><p class="mb-0">'+f[e.val()].tel+'</p><p class="mb-0">'+f[e.val()].email+"</p></div>";$(".row-bill-to").find(".customer-details").remove(),$(".row-bill-to").find(".col-bill-to").append(t)})),p.on("select2:open",(function(){$(document).find(".add-new-customer").length||$(document).find(".select2-results__options").before('<div class="add-new-customer btn btn-flat-success cursor-pointer rounded-0 text-start mb-50 p-50 w-100" data-bs-toggle="modal" data-bs-target="#add-new-customer-sidebar">'+feather.icons.plus.toSvg({class:"font-medium-1 me-50"})+'<span class="align-middle">Add New Customer</span></div>')}))),c.length&&(c.on("submit",(function(e){e.preventDefault()})),c.repeater({show:function(){$(this).slideDown()},hide:function(e){$(this).slideUp()}})),$(document).on("click",".tax-select",(function(e){e.stopPropagation()})),s.length&&$(document).on("click",".btn-apply-changes",(function(s){var c=$(this);if(o=c.closest(".dropdown-menu").find("#tax-1-input"),l=c.closest(".dropdown-menu").find("#tax-2-input"),a=c.closest(".dropdown-menu").find("#discount-input"),t=c.closest(".repeater-wrapper").find(".tax-1"),n=c.closest(".repeater-wrapper").find(".tax-2"),e=$(".discount"),null!==o.val()&&g(o,t),null!==l.val()&&g(l,n),a.val().length){var i=a.val()<=100?a.val():100;c.closest(".repeater-wrapper").find(e).text(i+"%")}})),$(document).on("change",".item-details",(function(){var e=$(this),t=h[e.val()];e.next("textarea").length?e.next("textarea").val(t):e.after('<textarea class="form-control mt-2" rows="2">'+t+"</textarea>")})),m.length&&m.on("click",(function(){feather&&feather.replace({width:14,height:14});[].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]')).map((function(e){return new bootstrap.Tooltip(e)}))}))}));

data/app/assets/javascripts/vuexy/scripts/pages/app-kanban.js

@@ -0,0 +1,433 @@
+$(function () {
+  'use strict';
+
+  var boards,
+    openSidebar = true,
+    kanbanWrapper = $('.kanban-wrapper'),
+    sidebar = $('.update-item-sidebar'),
+    datePicker = $('#due-date'),
+    select2 = $('.select2'),
+    commentEditor = $('.comment-editor'),
+    addNewForm = $('.add-new-board'),
+    updateItemSidebar = $('.update-item-sidebar'),
+    addNewInput = $('.add-new-board-input');
+
+  var assetPath = '../../../app-assets/';
+  if ($('body').attr('data-framework') === 'laravel') {
+    assetPath = $('body').attr('data-asset-path');
+  }
+
+  // Get Data
+  $.ajax({
+    type: 'GET',
+    dataType: 'json',
+    async: false,
+    url: assetPath + 'data/kanban.json',
+    success: function (data) {
+      boards = data;
+    }
+  });
+
+  // Toggle add new input and actions
+  addNewInput.toggle();
+
+  // datepicker init
+  if (datePicker.length) {
+    datePicker.flatpickr({
+      monthSelectorType: 'static',
+      altInput: true,
+      altFormat: 'j F, Y',
+      dateFormat: 'Y-m-d'
+    });
+  }
+
+  // select2
+  if (select2.length) {
+    function renderLabels(option) {
+      if (!option.id) {
+        return option.text;
+      }
+      var $badge = "<div class='badge " + $(option.element).data('color') + " rounded-pill'> " + option.text + '</div>';
+
+      return $badge;
+    }
+
+    select2.each(function () {
+      var $this = $(this);
+      $this.wrap("<div class='position-relative'></div>").select2({
+        placeholder: 'Select Label',
+        dropdownParent: $this.parent(),
+        templateResult: renderLabels,
+        templateSelection: renderLabels,
+        escapeMarkup: function (es) {
+          return es;
+        }
+      });
+    });
+  }
+
+  // Comment editor
+  if (commentEditor.length) {
+    new Quill('.comment-editor', {
+      modules: {
+        toolbar: '.comment-toolbar'
+      },
+      placeholder: 'Write a Comment... ',
+      theme: 'snow'
+    });
+  }
+
+  // Render board dropdown
+  function renderBoardDropdown() {
+    return (
+      "<div class='dropdown'>" +
+      feather.icons['more-vertical'].toSvg({
+        class: 'dropdown-toggle cursor-pointer font-medium-3 me-0',
+        id: 'board-dropdown',
+        'data-bs-toggle': 'dropdown',
+        'aria-haspopup': 'true',
+        'aria-expanded': 'false'
+      }) +
+      "<div class='dropdown-menu dropdown-menu-end' aria-labelledby='board-dropdown'>" +
+      "<a class='dropdown-item delete-board' href='#'> " +
+      feather.icons['trash'].toSvg({ class: 'font-medium-1 align-middle' }) +
+      "<span class='align-middle ms-25'>Delete</span></a>" +
+      "<a class='dropdown-item' href='#'>" +
+      feather.icons['edit'].toSvg({ class: 'font-medium-1 align-middle' }) +
+      "<span class='align-middle ms-25'>Rename</span></a>" +
+      "<a class='dropdown-item' href='#'>" +
+      feather.icons['archive'].toSvg({ class: 'font-medium-1 align-middle' }) +
+      "<span class='align-middle ms-25'>Archive</span></a>" +
+      '</div>' +
+      '</div>'
+    );
+  }
+
+  // Render item dropdown
+  function renderDropdown() {
+    return (
+      "<div class='dropdown item-dropdown px-1'>" +
+      feather.icons['more-vertical'].toSvg({
+        class: 'dropdown-toggle cursor-pointer me-0 font-medium-1',
+        id: 'item-dropdown',
+        ' data-bs-toggle': 'dropdown',
+        'aria-haspopup': 'true',
+        'aria-expanded': 'false'
+      }) +
+      "<div class='dropdown-menu dropdown-menu-end' aria-labelledby='item-dropdown'>" +
+      "<a class='dropdown-item' href='#'>Copy task link</a>" +
+      "<a class='dropdown-item' href='#'>Duplicate task</a>" +
+      "<a class='dropdown-item delete-task' href='#'>Delete</a>" +
+      '</div>' +
+      '</div>'
+    );
+  }
+  // Render header
+  function renderHeader(color, text) {
+    return (
+      "<div class='d-flex justify-content-between flex-wrap align-items-center mb-1'>" +
+      "<div class='item-badges'> " +
+      "<div class='badge rounded-pill badge-light-" +
+      color +
+      "'> " +
+      text +
+      '</div>' +
+      '</div>' +
+      renderDropdown() +
+      '</div>'
+    );
+  }
+
+  // Render avatar
+  function renderAvatar(images, pullUp, margin, members, size) {
+    var $transition = pullUp ? ' pull-up' : '',
+      member = members !== undefined ? members.split(',') : '';
+
+    return images !== undefined
+      ? images
+          .split(',')
+          .map(function (img, index, arr) {
+            var $margin = margin !== undefined && index !== arr.length - 1 ? ' me-' + margin + '' : '';
+
+            return (
+              "<li class='avatar kanban-item-avatar" +
+              ' ' +
+              $transition +
+              ' ' +
+              $margin +
+              "'" +
+              "data-bs-toggle='tooltip' data-bs-placement='top'" +
+              "title='" +
+              member[index] +
+              "'" +
+              '>' +
+              "<img src='" +
+              assetPath +
+              'images/portrait/small/' +
+              img +
+              "' alt='Avatar' height='" +
+              size +
+              "'>" +
+              '</li>'
+            );
+          })
+          .join(' ')
+      : '';
+  }
+
+  // Render footer
+  function renderFooter(attachments, comments, assigned, members) {
+    return (
+      "<div class='d-flex justify-content-between align-items-center flex-wrap mt-1'>" +
+      "<div> <span class='align-middle me-50'>" +
+      feather.icons['paperclip'].toSvg({ class: 'font-medium-1 align-middle me-25' }) +
+      "<span class='attachments align-middle'>" +
+      attachments +
+      '</span>' +
+      "</span> <span class='align-middle'>" +
+      feather.icons['message-square'].toSvg({ class: 'font-medium-1 align-middle me-25' }) +
+      '<span>' +
+      comments +
+      '</span>' +
+      '</span></div>' +
+      "<ul class='avatar-group mb-0'>" +
+      renderAvatar(assigned, true, 0, members, 28) +
+      '</ul>' +
+      '</div>'
+    );
+  }
+
+  // Init kanban
+  var kanban = new jKanban({
+    element: '.kanban-wrapper',
+    gutter: '15px',
+    widthBoard: '250px',
+    dragItems: true,
+    boards: boards,
+    dragBoards: true,
+    addItemButton: true,
+    itemAddOptions: {
+      enabled: true, // add a button to board for easy item creation
+      content: '+ Add New Item', // text or html content of the board button
+      class: 'kanban-title-button btn btn-default btn-xs', // default class of the button
+      footer: false // position the button on footer
+    },
+    click: function (el) {
+      var el = $(el);
+      var flag = false;
+      var title = el.attr('data-eid') ? el.find('.kanban-text').text() : el.text(),
+        date = el.attr('data-due-date'),
+        dateObj = new Date(),
+        year = dateObj.getFullYear(),
+        dateToUse = date
+          ? date + ', ' + year
+          : dateObj.getDate() +
+            ' ' +
+            dateObj.toLocaleString('en', {
+              month: 'long'
+            }) +
+            ', ' +
+            year,
+        label = el.attr('data-badge-text'),
+        avatars = el.attr('data-assigned');
+
+      if (el.find('.kanban-item-avatar').length) {
+        el.find('.kanban-item-avatar').on('click', function (e) {
+          e.stopPropagation();
+        });
+      }
+      $(document).on('click','.item-dropdown', function(e) {
+        flag = true
+      })
+      setTimeout(function(){
+        if(flag === false) {
+          sidebar.modal('show');
+        }
+      }, 50)
+      sidebar.find('.update-item-form').on('submit', function (e) {
+        e.preventDefault();
+      });
+      sidebar.find('#title').val(title);
+      sidebar.find(datePicker).next('.form-control').val(dateToUse);
+      sidebar.find(select2).val(label).trigger('change');
+      sidebar.find('.assigned').empty();
+      sidebar
+        .find('.assigned')
+        .append(
+          renderAvatar(avatars, false, '50', el.attr('data-members'), 32) +
+            "<li class='avatar avatar-add-member ms-50'>" +
+            "<span class='avatar-content'>" +
+            feather.icons['plus'].toSvg({ class: 'avatar-icon' }) +
+            '</li>'
+        );
+    },
+    buttonClick: function (el, boardId) {
+      var addNew = document.createElement('form');
+      addNew.setAttribute('class', 'new-item-form');
+      addNew.innerHTML =
+        '<div class="mb-1">' +
+        '<textarea class="form-control add-new-item" rows="2" placeholder="Add Content" required></textarea>' +
+        '</div>' +
+        '<div class="mb-2">' +
+        '<button type="submit" class="btn btn-primary btn-sm me-1">Add</button>' +
+        '<button type="button" class="btn btn-outline-secondary btn-sm cancel-add-item">Cancel</button>' +
+        '</div>';
+      kanban.addForm(boardId, addNew);
+      addNew.querySelector('textarea').focus();
+      addNew.addEventListener('submit', function (e) {
+        e.preventDefault();
+        var currentBoard = $(".kanban-board[data-id='" + boardId + "']");
+        kanban.addElement(boardId, {
+          title: "<span class='kanban-text'>" + e.target[0].value + '</span>',
+          id: boardId + '-' + currentBoard.find('.kanban-item').length + 1
+        });
+
+        currentBoard.find('.kanban-item:last-child .kanban-text').before(renderDropdown());
+        addNew.remove();
+      });
+      $(document).on('click', '.cancel-add-item', function () {
+        $(this).closest(addNew).toggle();
+      });
+    },
+    dragEl: function (el, source) {
+      $(el).find('.item-dropdown, .item-dropdown .dropdown-menu.show').removeClass('show');
+    }
+  });
+
+  if (kanbanWrapper.length) {
+    new PerfectScrollbar(kanbanWrapper[0]);
+  }
+
+  // Render add new inline with boards
+  $('.kanban-container').append(addNewForm);
+
+  // Change add item button to flat button
+  $.each($('.kanban-title-button'), function () {
+    $(this).removeClass().addClass('kanban-title-button btn btn-flat-secondary btn-sm ms-50');
+    Waves.init();
+    Waves.attach("[class*='btn-flat-']");
+  });
+
+  // Makes kanban title editable
+  $(document).on('mouseenter', '.kanban-title-board', function () {
+    $(this).attr('contenteditable', 'true');
+  });
+
+  // Appends delete icon with title
+  $.each($('.kanban-board-header'), function () {
+    $(this).append(renderBoardDropdown());
+  });
+
+  // Deletes Board
+  $(document).on('click', '.delete-board', function () {
+    var id = $(this).closest('.kanban-board').data('id');
+    kanban.removeBoard(id);
+  });
+
+  // Delete task
+  $(document).on('click', '.dropdown-item.delete-task', function () {
+    openSidebar = true;
+    var id = $(this).closest('.kanban-item').data('eid');
+    kanban.removeElement(id);
+  });
+
+  // Open/Cancel add new input
+  $('.add-new-btn, .cancel-add-new').on('click', function () {
+    addNewInput.toggle();
+  });
+
+  // Add new board
+  addNewForm.on('submit', function (e) {
+    e.preventDefault();
+    var $this = $(this),
+      value = $this.find('.form-control').val(),
+      id = value.replace(/\s+/g, '-').toLowerCase();
+    kanban.addBoards([
+      {
+        id: id,
+        title: value
+      }
+    ]);
+    // Adds delete board option to new board & updates data-order
+    $('.kanban-board:last-child').find('.kanban-board-header').append(renderBoardDropdown());
+
+    // Remove current append new add new form
+    addNewInput.val('').css('display', 'none');
+    $('.kanban-container').append(addNewForm);
+
+    // Update class & init waves
+    $.each($('.kanban-title-button'), function () {
+      $(this).removeClass().addClass('kanban-title-button btn btn-flat-secondary btn-sm ms-50');
+      Waves.init();
+      Waves.attach("[class*='btn-flat-']");
+    });
+  });
+
+  // Clear comment editor on close
+  sidebar.on('hidden.bs.modal', function () {
+    sidebar.find('.ql-editor')[0].innerHTML = '';
+    sidebar.find('.nav-link-activity').removeClass('active');
+    sidebar.find('.tab-pane-activity').removeClass('show active');
+    sidebar.find('.nav-link-update').addClass('active');
+    sidebar.find('.tab-pane-update').addClass('show active');
+  });
+
+  // Re-init tooltip when modal opens(Bootstrap bug)
+  sidebar.on('shown.bs.modal', function () {
+    $('[data-bs-toggle="tooltip"]').tooltip();
+  });
+
+  $('.update-item-form').on('submit', function (e) {
+    e.preventDefault();
+    sidebar.modal('hide');
+  });
+
+  // Render custom items
+  $.each($('.kanban-item'), function () {
+    var $this = $(this),
+      $text = "<span class='kanban-text'>" + $this.text() + '</span>';
+    if ($this.attr('data-badge') !== undefined && $this.attr('data-badge-text') !== undefined) {
+      $this.html(renderHeader($this.attr('data-badge'), $this.attr('data-badge-text')) + $text);
+    }
+    if (
+      $this.attr('data-comments') !== undefined ||
+      $this.attr('data-due-date') !== undefined ||
+      $this.attr('data-assigned') !== undefined
+    ) {
+      $this.append(
+        renderFooter(
+          $this.attr('data-attachments'),
+          $this.attr('data-comments'),
+          $this.attr('data-assigned'),
+          $this.attr('data-members')
+        )
+      );
+    }
+    if ($this.attr('data-image') !== undefined) {
+      $this.html(
+        renderHeader($this.attr('data-badge'), $this.attr('data-badge-text')) +
+          "<img class='img-fluid rounded mb-50' src='" +
+          assetPath +
+          'images/slider/' +
+          $this.attr('data-image') +
+          "' height='32'/>" +
+          $text +
+          renderFooter(
+            $this.attr('data-due-date'),
+            $this.attr('data-comments'),
+            $this.attr('data-assigned'),
+            $this.attr('data-members')
+          )
+      );
+    }
+    $this.on('mouseenter', function () {
+      $this.find('.item-dropdown, .item-dropdown .dropdown-menu.show').removeClass('show');
+    });
+  });
+
+  if (updateItemSidebar.length) {
+    updateItemSidebar.on('hidden.bs.modal', function () {
+      updateItemSidebar.find('.file-attachments').val('');
+    });
+  }
+});

data/app/assets/javascripts/vuexy/scripts/pages/app-kanban.min.js

@@ -0,0 +1 @@
+$((function(){"use strict";var a,t=$(".kanban-wrapper"),e=$(".update-item-sidebar"),n=$("#due-date"),d=$(".select2"),o=$(".comment-editor"),i=$(".add-new-board"),s=$(".update-item-sidebar"),r=$(".add-new-board-input"),l="../../../app-assets/";if("laravel"===$("body").attr("data-framework")&&(l=$("body").attr("data-asset-path")),$.ajax({type:"GET",dataType:"json",async:!1,url:l+"data/kanban.json",success:function(t){a=t}}),r.toggle(),n.length&&n.flatpickr({monthSelectorType:"static",altInput:!0,altFormat:"j F, Y",dateFormat:"Y-m-d"}),d.length){function a(a){return a.id?"<div class='badge "+$(a.element).data("color")+" rounded-pill'> "+a.text+"</div>":a.text}d.each((function(){var t=$(this);t.wrap("<div class='position-relative'></div>").select2({placeholder:"Select Label",dropdownParent:t.parent(),templateResult:a,templateSelection:a,escapeMarkup:function(a){return a}})}))}function c(){return"<div class='dropdown'>"+feather.icons["more-vertical"].toSvg({class:"dropdown-toggle cursor-pointer font-medium-3 me-0",id:"board-dropdown","data-bs-toggle":"dropdown","aria-haspopup":"true","aria-expanded":"false"})+"<div class='dropdown-menu dropdown-menu-end' aria-labelledby='board-dropdown'><a class='dropdown-item delete-board' href='#'> "+feather.icons.trash.toSvg({class:"font-medium-1 align-middle"})+"<span class='align-middle ms-25'>Delete</span></a><a class='dropdown-item' href='#'>"+feather.icons.edit.toSvg({class:"font-medium-1 align-middle"})+"<span class='align-middle ms-25'>Rename</span></a><a class='dropdown-item' href='#'>"+feather.icons.archive.toSvg({class:"font-medium-1 align-middle"})+"<span class='align-middle ms-25'>Archive</span></a></div></div>"}function m(){return"<div class='dropdown item-dropdown px-1'>"+feather.icons["more-vertical"].toSvg({class:"dropdown-toggle cursor-pointer me-0 font-medium-1",id:"item-dropdown"," data-bs-toggle":"dropdown","aria-haspopup":"true","aria-expanded":"false"})+"<div class='dropdown-menu dropdown-menu-end' aria-labelledby='item-dropdown'><a class='dropdown-item' href='#'>Copy task link</a><a class='dropdown-item' href='#'>Duplicate task</a><a class='dropdown-item delete-task' href='#'>Delete</a></div></div>"}function p(a,t){return"<div class='d-flex justify-content-between flex-wrap align-items-center mb-1'><div class='item-badges'> <div class='badge rounded-pill badge-light-"+a+"'> "+t+"</div></div>"+m()+"</div>"}function u(a,t,e,n,d){var o=t?" pull-up":"",i=void 0!==n?n.split(","):"";return void 0!==a?a.split(",").map((function(a,t,n){var s=void 0!==e&&t!==n.length-1?" me-"+e:"";return"<li class='avatar kanban-item-avatar "+o+" "+s+"'data-bs-toggle='tooltip' data-bs-placement='top'title='"+i[t]+"'><img src='"+l+"images/portrait/small/"+a+"' alt='Avatar' height='"+d+"'></li>"})).join(" "):""}function b(a,t,e,n){return"<div class='d-flex justify-content-between align-items-center flex-wrap mt-1'><div> <span class='align-middle me-50'>"+feather.icons.paperclip.toSvg({class:"font-medium-1 align-middle me-25"})+"<span class='attachments align-middle'>"+a+"</span></span> <span class='align-middle'>"+feather.icons["message-square"].toSvg({class:"font-medium-1 align-middle me-25"})+"<span>"+t+"</span></span></div><ul class='avatar-group mb-0'>"+u(e,!0,0,n,28)+"</ul></div>"}o.length&&new Quill(".comment-editor",{modules:{toolbar:".comment-toolbar"},placeholder:"Write a Comment... ",theme:"snow"});var f=new jKanban({element:".kanban-wrapper",gutter:"15px",widthBoard:"250px",dragItems:!0,boards:a,dragBoards:!0,addItemButton:!0,itemAddOptions:{enabled:!0,content:"+ Add New Item",class:"kanban-title-button btn btn-default btn-xs",footer:!1},click:function(a){a=$(a);var t=!1,o=a.attr("data-eid")?a.find(".kanban-text").text():a.text(),i=a.attr("data-due-date"),s=new Date,r=s.getFullYear(),l=i?i+", "+r:s.getDate()+" "+s.toLocaleString("en",{month:"long"})+", "+r,c=a.attr("data-badge-text"),m=a.attr("data-assigned");a.find(".kanban-item-avatar").length&&a.find(".kanban-item-avatar").on("click",(function(a){a.stopPropagation()})),$(document).on("click",".item-dropdown",(function(a){t=!0})),setTimeout((function(){!1===t&&e.modal("show")}),50),e.find(".update-item-form").on("submit",(function(a){a.preventDefault()})),e.find("#title").val(o),e.find(n).next(".form-control").val(l),e.find(d).val(c).trigger("change"),e.find(".assigned").empty(),e.find(".assigned").append(u(m,!1,"50",a.attr("data-members"),32)+"<li class='avatar avatar-add-member ms-50'><span class='avatar-content'>"+feather.icons.plus.toSvg({class:"avatar-icon"})+"</li>")},buttonClick:function(a,t){var e=document.createElement("form");e.setAttribute("class","new-item-form"),e.innerHTML='<div class="mb-1"><textarea class="form-control add-new-item" rows="2" placeholder="Add Content" required></textarea></div><div class="mb-2"><button type="submit" class="btn btn-primary btn-sm me-1">Add</button><button type="button" class="btn btn-outline-secondary btn-sm cancel-add-item">Cancel</button></div>',f.addForm(t,e),e.querySelector("textarea").focus(),e.addEventListener("submit",(function(a){a.preventDefault();var n=$(".kanban-board[data-id='"+t+"']");f.addElement(t,{title:"<span class='kanban-text'>"+a.target[0].value+"</span>",id:t+"-"+n.find(".kanban-item").length+1}),n.find(".kanban-item:last-child .kanban-text").before(m()),e.remove()})),$(document).on("click",".cancel-add-item",(function(){$(this).closest(e).toggle()}))},dragEl:function(a,t){$(a).find(".item-dropdown, .item-dropdown .dropdown-menu.show").removeClass("show")}});t.length&&new PerfectScrollbar(t[0]),$(".kanban-container").append(i),$.each($(".kanban-title-button"),(function(){$(this).removeClass().addClass("kanban-title-button btn btn-flat-secondary btn-sm ms-50"),Waves.init(),Waves.attach("[class*='btn-flat-']")})),$(document).on("mouseenter",".kanban-title-board",(function(){$(this).attr("contenteditable","true")})),$.each($(".kanban-board-header"),(function(){$(this).append(c())})),$(document).on("click",".delete-board",(function(){var a=$(this).closest(".kanban-board").data("id");f.removeBoard(a)})),$(document).on("click",".dropdown-item.delete-task",(function(){!0;var a=$(this).closest(".kanban-item").data("eid");f.removeElement(a)})),$(".add-new-btn, .cancel-add-new").on("click",(function(){r.toggle()})),i.on("submit",(function(a){a.preventDefault();var t=$(this).find(".form-control").val(),e=t.replace(/\s+/g,"-").toLowerCase();f.addBoards([{id:e,title:t}]),$(".kanban-board:last-child").find(".kanban-board-header").append(c()),r.val("").css("display","none"),$(".kanban-container").append(i),$.each($(".kanban-title-button"),(function(){$(this).removeClass().addClass("kanban-title-button btn btn-flat-secondary btn-sm ms-50"),Waves.init(),Waves.attach("[class*='btn-flat-']")}))})),e.on("hidden.bs.modal",(function(){e.find(".ql-editor")[0].innerHTML="",e.find(".nav-link-activity").removeClass("active"),e.find(".tab-pane-activity").removeClass("show active"),e.find(".nav-link-update").addClass("active"),e.find(".tab-pane-update").addClass("show active")})),e.on("shown.bs.modal",(function(){$('[data-bs-toggle="tooltip"]').tooltip()})),$(".update-item-form").on("submit",(function(a){a.preventDefault(),e.modal("hide")})),$.each($(".kanban-item"),(function(){var a=$(this),t="<span class='kanban-text'>"+a.text()+"</span>";void 0!==a.attr("data-badge")&&void 0!==a.attr("data-badge-text")&&a.html(p(a.attr("data-badge"),a.attr("data-badge-text"))+t),void 0===a.attr("data-comments")&&void 0===a.attr("data-due-date")&&void 0===a.attr("data-assigned")||a.append(b(a.attr("data-attachments"),a.attr("data-comments"),a.attr("data-assigned"),a.attr("data-members"))),void 0!==a.attr("data-image")&&a.html(p(a.attr("data-badge"),a.attr("data-badge-text"))+"<img class='img-fluid rounded mb-50' src='"+l+"images/slider/"+a.attr("data-image")+"' height='32'/>"+t+b(a.attr("data-due-date"),a.attr("data-comments"),a.attr("data-assigned"),a.attr("data-members"))),a.on("mouseenter",(function(){a.find(".item-dropdown, .item-dropdown .dropdown-menu.show").removeClass("show")}))})),s.length&&s.on("hidden.bs.modal",(function(){s.find(".file-attachments").val("")}))}));