%PDF- %PDF-
Direktori : /home/opti/workflow/src/views/account/contact/ |
Current File : /home/opti/workflow/src/views/account/contact/index.ejs |
<% include ../../partials/header %> <!-- ////////////////////////////////////////////////////////////////////////////--> <% include ../../partials/sidebar %> <div class="app-content content"> <div class="content-wrapper"> <div class="content-header row"> <div class="content-header-left col-md-6 col-12 mb-2"> <h3 class="content-header-title mb-0">Contacts</h3> <div class="row breadcrumbs-top"> <div class="breadcrumb-wrapper col-12"> <ol class="breadcrumb"> <li class="breadcrumb-item"><a href="/index">Home</a> </li> <!-- <li class="breadcrumb-item"><a href="#">Users</a> --> </li> <li class="breadcrumb-item active">Contacts </li> </ol> </div> </div> </div> <!-- <div class="content-header-right text-md-right col-md-6 col-12"> <div class="btn-group"> <button class="btn btn-round btn-info" type="button"><i class="icon-cog3"></i> Settings</button> </div> </div> --> <div class="text-center"> <a class="quick-btn text-red" href="" data-toggle="modal" data-target="#addContact"> <i class="la la-plus fa-2x"></i> <span>New Contact</span> </a> </div> </div> <div class="content-detached <% /*content-right */ %>"> <div class="content-body"> <section class="row"> <div class="col-12"> <div class="card"> <!-- <div class="card-head"> <div class="card-header"> <h4 class="card-title">All Contacts</h4> <a class="heading-elements-toggle"><i class="la la-ellipsis-h font-medium-3"></i></a> <div class="heading-elements"> <button class="btn btn-primary btn-sm" data-toggle="modal" data-target="#addContact"><i class="ft-plus white"></i> Add Contacts</button> <span class="dropdown"> <button id="btnSearchDrop1" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" class="btn btn-warning dropdown-toggle dropdown-menu-right btn-sm"><i class="ft-download-cloud white"></i></button> <span aria-labelledby="btnSearchDrop1" class="dropdown-menu mt-1 dropdown-menu-right"> <a href="#" class="dropdown-item"><i class="ft-upload"></i> Import</a> <a href="#" class="dropdown-item"><i class="ft-download"></i> Export</a> <a href="#" class="dropdown-item"><i class="ft-shuffle"></i> Find Duplicate</a> </span> </span> <button class="btn btn-default btn-sm"><i class="ft-settings white"></i></button> </div> </div> </div> --> <div class="card-content"> <div class="card-body"> <!-- Task List table --> <div class="table-responsive"> <table id="users-contacts" class="table table-white-space table-bordered row-grouping display no-wrap icheck table-middle"> <thead> <tr> <th>S/N</th> <th>Name</th> <th>Email</th> <th>Phone</th> <!-- <th>Favorite</th> --> <th>Actions</th> </tr> </thead> <tbody> <% k = 0 %> <% contacts.forEach(contact=>{ %> <% k++ %> <% if(contact.contactType == 1){ %> <tr> <td> <!-- <input type="checkbox" class="input-chk"> --> <%= k %> </td> <td> <div class="media"> <div class="media-left pr-1"> <span class="avatar avatar-sm avatar-online rounded-circle"> <img src="/assets/images/contacts/<%= contact.person.passport %>" alt="avatar"><i></i></span> </div> <div class="media-body media-middle"> <a href="#" class="media-heading"><%= contact.person.firstName +" " +contact.person.lastName %></a> </div> </div> </td> <td class="text-center"> <a href="mailto:email@example.com"><%= contact.person.email %></a> </td> <td><%= contact.person.phoneNo %></td> <!-- <td class="text-center"><i class="la la-star yellow darken-2"></i></td> --> <td> <span class="dropdown"> <button id="btnSearchDrop2" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" class="btn btn-primary dropdown-toggle dropdown-menu-right"><i class="ft-settings"></i></button> <span aria-labelledby="btnSearchDrop2" class="dropdown-menu mt-1 dropdown-menu-right"> <a href="#" class="dropdown-item"><i class="ft-edit-2"></i> Edit</a> <a href="#" class="dropdown-item"><i class="ft-trash-2"></i> Delete</a> <!-- <a href="#" class="dropdown-item"><i class="ft-plus-circle primary"></i> Projects</a> <a href="#" class="dropdown-item"><i class="ft-plus-circle info"></i> Team</a> <a href="#" class="dropdown-item"><i class="ft-plus-circle warning"></i> Clients</a> <a href="#" class="dropdown-item"><i class="ft-plus-circle success"></i> Friends</a> --> </span> </span> </td> </tr> <% } else { %> <tr> <td> <!-- <input type="checkbox" class="input-chk"> --> <%= k %> </td> <td> <div class="media"> <div class="media-left pr-1"> <span class="avatar avatar-sm avatar-online rounded-circle"> <img src="/assets/images/contacts/<%= contact.group.logoUrl %>" alt="logo"><i></i></span> </div> <div class="media-body media-middle"> <a href="#" class="media-heading"><%= contact.group.name %></a> </div> </div> </td> <td class="text-center"> <a href="<%= contact.group.email %>"><%= contact.group.email %></a> </td> <td><%= contact.group.phoneNo %></td> <!-- <td class="text-center"><i class="la la-star yellow darken-2"></i></td> --> <td> <span class="dropdown"> <button id="btnSearchDrop3" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" class="btn btn-primary dropdown-toggle dropdown-menu-right"><i class="ft-settings"></i></button> <span aria-labelledby="btnSearchDrop3" class="dropdown-menu mt-1 dropdown-menu-right"> <a href="#" class="dropdown-item"><i class="ft-edit-2"></i> Edit</a> <a href="#" class="dropdown-item"><i class="ft-trash-2"></i> Delete</a> <!-- <a href="#" class="dropdown-item"><i class="ft-plus-circle primary"></i> Projects</a> <a href="#" class="dropdown-item"><i class="ft-plus-circle info"></i> Team</a> <a href="#" class="dropdown-item"><i class="ft-plus-circle warning"></i> Clients</a> <a href="#" class="dropdown-item"><i class="ft-plus-circle success"></i> Friends</a> --> </span> </span> </td> </tr> <% } %> <% }) %> </tbody> <tfoot> <tr> <th></th> <th>Name</th> <th>Email</th> <th>Phone</th> <!-- <th>Favorite</th> --> <th>Actions</th> </tr> </tfoot> </table> </div> </div> </div> </div> </div> </section> </div> </div> <% /* %> <div class="sidebar-detached sidebar-left" ,=","> <div class="sidebar"> <div class="bug-list-sidebar-content"> <!-- Predefined Views --> <div class="card"> <div class="card-head"> <div class="media p-1"> <div class="media-left pr-1"> <span class="avatar avatar-sm avatar-online rounded-circle"> <img src="../../../app-assets/images/portrait/small/avatar-s-1.png" alt="avatar"><i></i></span> </div> <div class="media-body media-middle"> <h5 class="media-heading">Margaret Govan</h5> </div> </div> </div> <!-- contacts search --> <div class="card-body border-top-blue-grey border-top-lighten-5"> <div class="bug-list-search"> <div class="bug-list-search-content"> <form action="#"> <div class="position-relative"> <input type="search" id="search-contacts" class="form-control" placeholder="Search contacts..."> <div class="form-control-position"> <i class="la la-search text-size-base text-muted"></i> </div> </div> </form> </div> </div> </div> <!-- /contacts search --> <!-- contacts view --> <div class="card-body"> <div class="list-group"> <a href="#" class="list-group-item active">All Contacts</a> <a href="#" class="list-group-item list-group-item-action">Recently contacted</a> <a href="#" class="list-group-item list-group-item-action">Favorite contacts</a> </div> </div> <!-- Groups--> <div class="card-body"> <p class="lead">Groups</p> <ul class="list-group"> <li class="list-group-item"> <span class="badge badge-primary badge-pill float-right">14</span> <a href="#"> Project</a> </li> <li class="list-group-item"> <span class="badge badge-info badge-pill float-right">22</span> <a href="#"> Team</a> </li> <li class="list-group-item"> <span class="badge badge-warning badge-pill float-right">10</span> <a href="#"> Clients</a> </li> <li class="list-group-item"> <span class="badge badge-success badge-pill float-right">5</span> <a href="#"> Friends</a> </li> </ul> </div> <!--/ Groups--> <!--More--> <div class="card-body "> <p class="lead">More</p> <ul class="list-group"> <li><a href="#" class="list-group-item">Import</a></li> <li><a href="#" class="list-group-item">Export</a></li> <li><a href="#" class="list-group-item">Print</a></li> <!-- <li><a href="#" class="list-group-item">Restore contacts</a></li> <li><a href="#" class="list-group-item">Find duplicate</a></li> --> </ul> </div> <!--/More--> </div> <!--/ Predefined Views --> </div> </div> </div> <% */ %> </div> </div> <!-- ////////////////////////////////////////////////////////////////////////////--> <!---////////////////////////////////////////--> <!-----Modal for creating contact--> <div class="modal fade text-left" id="addContact" tabindex="-1" role="dialog" aria-labelledby="myModalLabel16" style="display: none;" aria-hidden="true"> <div class="modal-dialog modal-lg" role="document"> <form action="/accounts/contacts/create" method="POST" enctype="multipart/form-data" > <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title" id="myModalLabel16">Add New Contact</h4> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <!-- --> <div class="col-xl-12 col-lg-12"> <div class="card-content"> <div class="card-body"> <ul class="nav nav-tabs nav-underline no-hover-bg nav-justified"> <li class="nav-item"> <a class="nav-link active" id="active-tab32" data-toggle="tab" href="#active32" aria-controls="active32" aria-expanded="true">Individual</a> </li> <li class="nav-item"> <a class="nav-link " id="link-tab32" data-toggle="tab" href="#link32" aria-controls="link32" aria-expanded="false">Group</a> </li> </ul> <div class="tab-content px-1 pt-1"> <div role="tabpanel" class="tab-pane active" id="active32" aria-labelledby="active-tab32" aria-expanded="true"> <form action="/accounts/contacts/create" method="POST" enctype="multipart/form-data" > <div class="row col-12"> <div class="card col-lg-7 col-7 col-md-7"> <div class="card-body"> <input type="hidden" value="1" name="contactType"/><!-- 1 is for individual--> <div class="form-group"> <label for="salutation">Salutation :</label> <input type="text" class="form-control" id="salutation" name="salutation"> </div> <div class="form-group"> <label for="firstname">Firstname :</label> <input type="text" class="form-control" id="firstname" name="firstname"> </div> <div class="form-group"> <label for="middlename">Middlename :</label> <input type="text" class="form-control" id="middlename" name="middlename"> </div> <div class="form-group"> <label for="lastname">Lastname :</label> <input type="text" class="form-control" id="lastname" name="lastname"> </div> <div class="form-group"> <label for="email">Email :</label> <input type="email" class="form-control" id="email" name="email"> </div> <div class="form-group"> <label for="phoneNo">Phone Number :</label> <input type="text" class="form-control" id="phoneNo" name="phoneNo"> </div> <!-- </div> --> </div> </div> <div class="card col-12 col-md-5"> <div class="col-lg-12 col-md-12"> <div class="card"> <!-- <div class="card-header"> <h4 class="card-title" id="image_type">Contact Passport</h4> </div> --> <div class="card-block"> <div class="card-body"> <label for="address">Contact Passport</label> <fieldset class="form-group"> <div class="custom-file"> <input type="file" class="custom-file-input" id="image" name="passport"> <label class="custom-file-label" for="image">Choose file</label> </div> </fieldset> <div class="form-group"> <label for="suffix">Suffix :</label> <input type="text" class="form-control" id="suffix" name="suffix"> </div> <div class="form-group"> <label for="gender">Gender :</label> <select class="form-control" id="gender" name="gender"> <option value="1">Male</option> <option value="2">Female</option> </select> </div> <div class="form-group"> <label for="maritalStatus">Marital Status :</label> <select class="form-control" id="maritalStatus" name="maritalStatus"> <option value="1">Single</option> <option value="2">Married</option> <option value="2">Divorced</option> </select> </div> <div class="form-group"> <label for="birthdate">Date of Birth :</label> <input type="date" id="birthdate" class="form-control" name="birthdate" data-toggle="tooltip" data-trigger="hover" data-placement="top" data-title="Date of Birth" data-original-title="" title=""> </div> </div> <div class="modal-footer"> <button type="button" class="btn grey btn-secondary" data-dismiss="modal">Close</button> <input type="submit" class="btn btn-primary" value="Save Contact" /> </div> </div> </div> </div> </div> </div> </form> </div> <div class="tab-pane " id="link32" role="tabpanel" aria-labelledby="link-tab32" aria-expanded="false"> <form action="/accounts/contacts/create" method="POST" enctype="multipart/form-data" > <input type="hidden" name="contactType" value="2"/><!-- 2 is form group--> <div class="row col-12"> <div class="card col-lg-7 col-7 col-md-7"> <div class="card-body"> <div class="form-group"> <label for="name">Name :</label> <input type="text" class="form-control" id="name" name="name"> </div> <div class="form-group"> <label for="nameLocal">Name Local :</label> <input type="text" class="form-control" id="nameLocal" name="nameLocal"> </div> <div class="form-group"> <label for="offSiteName">Offsite Name :</label> <input type="text" class="form-control" id="offSiteName" name="offSiteName"> </div> <div class="form-group"> <label for="email">Email :</label> <input type="email" class="form-control" id="email" name="email"> </div> <div class="form-group"> <label for="phoneNo">Phone Number :</label> <input type="text" class="form-control" id="phoneNo" name="phoneNo"> </div> </div> </div> <div class="card col-12 col-md-5"> <div class="col-lg-12 col-md-12"> <div class="card"> <!-- <div class="card-header"> --> <!-- </div> --> <div class="card-block"> <div class="card-body"> <fieldset class="form-group"> <label for="address">Contact Logo</label> <div class="custom-file"> <input type="file" class="custom-file-input" id="logo" name="logo"> <label class="custom-file-label" for="logo">Choose file</label> </div> </fieldset> <div class="form-group"> <label for="address">Address :</label> <textarea name="address" id="address" rows="4" class="form-control"></textarea> </div> <div class="form-group"> <label for="comment">Comment :</label> <textarea name="comment" id="comment" name="comment" rows="4" class="form-control"></textarea> </div> <div class="modal-footer"> <button type="button" class="btn grey btn-secondary" data-dismiss="modal">Close</button> <input type="submit" class="btn btn-primary" value="Save Contact" /> </div> </div> </div> </div> </div> </div> </div> </form> </div> </div> </div> </div> </div> </div> </div> </div> </div> <% include ../../partials/footer %> <!-- <script src="/app-assets/js/scripts/pages/invoices-list.js"/> --> <script > function contactTypeChange(){ var contactType = $("#contactType").val(); console.log(contactType); if(contactType == 1){ //contact is individual // $("#personDiv").removeClass('d-none') // $("#groupDiv").addClass('d-none') $("#groupDiv").addClass('d-none') $("#personDiv").removeClass('d-none') } if(contactType == 2){ console.log("am 2") $("#personDiv").addClass('d-none') $("#groupDiv").removeClass('d-none') } } </script>