mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/IZYIM-Prototype.git
synced 2026-08-19 04:33:55 +00:00
Jackk Goh
1597 lines
103 KiB
HTML
1597 lines
103 KiB
HTML
<!DOCTYPE html>
|
|
<!--
|
|
Template Name: Metronic - Responsive Admin Dashboard Template build with Twitter Bootstrap 3.3.7
|
|
Version: 4.7.5
|
|
Author: KeenThemes
|
|
Website: http://www.keenthemes.com/
|
|
Contact: support@keenthemes.com
|
|
Follow: www.twitter.com/keenthemes
|
|
Dribbble: www.dribbble.com/keenthemes
|
|
Like: www.facebook.com/keenthemes
|
|
Purchase: http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes
|
|
Renew Support: http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes
|
|
License: You must have a valid license purchased only from themeforest(the above link) in order to legally use the theme for your project.
|
|
-->
|
|
<!--[if IE 8]>
|
|
<html lang="en" class="ie8 no-js">
|
|
<![endif]-->
|
|
<!--[if IE 9]>
|
|
<html lang="en" class="ie9 no-js">
|
|
<![endif]-->
|
|
<!--[if !IE]><!-->
|
|
<html lang="en">
|
|
<!--<![endif]-->
|
|
<!-- BEGIN HEAD -->
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>IZYIM | Messenger</title>
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta content="width=device-width, initial-scale=1" name="viewport" />
|
|
<meta content="Preview page of Metronic Admin Theme #1 for statistics, charts, recent events and reports" name="description" />
|
|
<meta content="" name="author" />
|
|
<!-- BEGIN GLOBAL MANDATORY STYLES -->
|
|
<link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700&subset=all" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css" rel="stylesheet" type="text/css" />
|
|
<!-- END GLOBAL MANDATORY STYLES -->
|
|
<!-- BEGIN PAGE LEVEL PLUGINS -->
|
|
<link href="../assets/global/plugins/bootstrap-daterangepicker/daterangepicker.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/morris/morris.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/fullcalendar/fullcalendar.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/plugins/jqvmap/jqvmap/jqvmap.css" rel="stylesheet" type="text/css" />
|
|
<!-- END PAGE LEVEL PLUGINS -->
|
|
<!-- BEGIN THEME GLOBAL STYLES -->
|
|
<link href="../assets/global/plugins/jstree/dist/themes/default/style.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/global/css/components.min.css" rel="stylesheet" id="style_components" type="text/css" />
|
|
<link href="../assets/global/css/plugins.min.css" rel="stylesheet" type="text/css" />
|
|
<!-- END THEME GLOBAL STYLES -->
|
|
<!-- BEGIN THEME LAYOUT STYLES -->
|
|
<link rel="stylesheet" type="text/css" href="../assets/qweqwe/css/jquery.emojipicker.css">
|
|
<link rel="stylesheet" type="text/css" href="../assets/qweqwe/css/jquery.emojipicker.a.css">
|
|
<link href="../assets/layouts/layout/css/layout.min.css" rel="stylesheet" type="text/css" />
|
|
<link href="../assets/lightbox/dist/ekko-lightbox.css" rel="stylesheet">
|
|
<link href="../assets/layouts/layout/css/themes/darkblue.min.css" rel="stylesheet" type="text/css" id="style_color" />
|
|
<link href="../assets/layouts/layout/css/custom.min.css" rel="stylesheet" type="text/css" />
|
|
<!-- END THEME LAYOUT STYLES -->
|
|
<link rel="shortcut icon" href="favicon.ico" />
|
|
<style>
|
|
.qweqwe {
|
|
height: 435px !important;
|
|
}
|
|
.chat-form {
|
|
margin-top: 1px;
|
|
}
|
|
.tooltip {
|
|
position: fixed;
|
|
}
|
|
.btn-circless {
|
|
width: 50px;
|
|
height: 50px;
|
|
text-align: center;
|
|
padding: 6px 0;
|
|
font-size: 12px;
|
|
line-height: 1.428571429;
|
|
border-radius: 15px;
|
|
}
|
|
@media (min-width: 992px) {
|
|
.page-content-wrapper .page-content {
|
|
margin-left: 190px;
|
|
}
|
|
}
|
|
.img-fluid {
|
|
max-width: 100% !important;
|
|
height: auto !important;
|
|
vertical-align: middle !important;
|
|
}
|
|
@media (min-width: 992px){
|
|
.page-sidebar {
|
|
width: 190px;
|
|
float: left;
|
|
position: relative;
|
|
margin-right: -100%;
|
|
}
|
|
}
|
|
.media-object-4 {
|
|
width: 35px;
|
|
}
|
|
tr.eror {
|
|
border: 2px solid red;
|
|
}
|
|
</style>
|
|
</head>
|
|
<!-- END HEAD -->
|
|
<body class="page-header-fixed page-sidebar-closed-hide-logo page-content-white">
|
|
<div class="page-wrapper">
|
|
<!-- BEGIN HEADER -->
|
|
<div class="page-header navbar navbar-fixed-top">
|
|
|
|
<!-- BEGIN HEADER INNER -->
|
|
<div class="page-header-inner ">
|
|
<!-- BEGIN LOGO -->
|
|
<div class="page-logo">
|
|
<div class="menu-toggler sidebar-toggler">
|
|
<span></span>
|
|
</div>
|
|
</div>
|
|
<!-- END LOGO -->
|
|
<!-- BEGIN RESPONSIVE MENU TOGGLER -->
|
|
<a href="javascript:;" class="menu-toggler responsive-toggler" data-toggle="collapse" data-target=".navbar-collapse">
|
|
<span></span>
|
|
</a>
|
|
<!-- END RESPONSIVE MENU TOGGLER -->
|
|
<!-- BEGIN TOP NAVIGATION MENU -->
|
|
|
|
<div class="top-menu">
|
|
<img style="margin-left:100px; margin-top:9px; border-radius:100%" class="media-object-4" src="../assets/layouts/layout/img/1.png" alt="...">
|
|
<ul class="nav navbar-nav pull-right">
|
|
<!-- BEGIN USER LOGIN DROPDOWN -->
|
|
<!-- DOC: Apply "dropdown-dark" class after below "dropdown-extended" to change the dropdown styte -->
|
|
|
|
<li class="dropdown dropdown-user pull-right">
|
|
|
|
<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
|
|
<img alt="" class="img-circle" src="../assets/layouts/layout/img/avatar3_small.jpg" />
|
|
<span class="username username-hide-on-mobile"> Syed Amir </span>
|
|
<i class="fa fa-angle-down"></i>
|
|
</a>
|
|
<ul class="dropdown-menu dropdown-menu-default">
|
|
<li>
|
|
<a href="page_user_profile_1.html">
|
|
<i class="icon-user"></i> My Profile </a>
|
|
</li>
|
|
<li>
|
|
<a href="page_user_login_1.html">
|
|
<i class="icon-key"></i> Log Out </a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
|
|
<!-- END USER LOGIN DROPDOWN -->
|
|
</ul>
|
|
</div>
|
|
<!-- END TOP NAVIGATION MENU -->
|
|
</div>
|
|
<!-- END HEADER INNER -->
|
|
</div>
|
|
<!-- END HEADER -->
|
|
<!-- BEGIN HEADER & CONTENT DIVIDER -->
|
|
<div class="clearfix"> </div>
|
|
<!-- END HEADER & CONTENT DIVIDER -->
|
|
<!-- BEGIN CONTAINER -->
|
|
<div class="page-container">
|
|
<!-- BEGIN SIDEBAR -->
|
|
<div class="page-sidebar-wrapper">
|
|
<!-- BEGIN SIDEBAR -->
|
|
<!-- DOC: Set data-auto-scroll="false" to disable the sidebar from auto scrolling/focusing -->
|
|
<!-- DOC: Change data-auto-speed="200" to adjust the sub menu slide up/down speed -->
|
|
<div class="page-sidebar navbar-collapse collapse">
|
|
<!-- BEGIN SIDEBAR MENU -->
|
|
<!-- DOC: Apply "page-sidebar-menu-light" class right after "page-sidebar-menu" to enable light sidebar menu style(without borders) -->
|
|
<!-- DOC: Apply "page-sidebar-menu-hover-submenu" class right after "page-sidebar-menu" to enable hoverable(hover vs accordion) sub menu mode -->
|
|
<!-- DOC: Apply "page-sidebar-menu-closed" class right after "page-sidebar-menu" to collapse("page-sidebar-closed" class must be applied to the body element) the sidebar sub menu mode -->
|
|
<!-- DOC: Set data-auto-scroll="false" to disable the sidebar from auto scrolling/focusing -->
|
|
<!-- DOC: Set data-keep-expand="true" to keep the submenues expanded -->
|
|
<!-- DOC: Set data-auto-speed="200" to adjust the sub menu slide up/down speed -->
|
|
<ul class="page-sidebar-menu page-header-fixed page-sidebar-menu-closed" data-keep-expanded="false" data-auto-scroll="true" data-slide-speed="200" style="padding-top: 20px">
|
|
<!-- DOC: To remove the sidebar toggler from the sidebar you just need to completely remove the below "sidebar-toggler-wrapper" LI element -->
|
|
<!-- BEGIN SIDEBAR TOGGLER BUTTON -->
|
|
<li class="sidebar-toggler-wrapper hide">
|
|
<div class="sidebar-toggler">
|
|
<span></span>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<center><img src="../assets/global/img/logo.png" style="height:auto ; width:60%"/></center>
|
|
</li>
|
|
<hr>
|
|
<li class="nav-item start">
|
|
<a href="index.html" class="nav-link nav-toggle">
|
|
<i class="icon-home"></i>
|
|
<span class="title">Order Status</span>
|
|
<span class="selected"></span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="notice.html" class="nav-link nav-toggle">
|
|
<i class="fa fa-newspaper-o"></i>
|
|
<span class="title">Notice</span>
|
|
<span class="selected"></span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item active open">
|
|
<a href="chat.html" class="nav-link nav-toggle">
|
|
<i class="fa fa-comments-o"></i>
|
|
<span class="title">Messenger</span>
|
|
<span class="selected"></span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="trackorder.html" class="nav-link nav-toggle">
|
|
<i class="icon-basket"></i>
|
|
<span class="title">Track Order</span>
|
|
<span class="selected"></span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item ">
|
|
<a href="javascript:;" class="nav-link nav-toggle">
|
|
<i class="icon-basket"></i>
|
|
<span class="title">Orders</span>
|
|
<span class="arrow"></span>
|
|
</a>
|
|
<ul class="sub-menu">
|
|
<li class="nav-item ">
|
|
<a href="purchaseorder.html" class="nav-link ">
|
|
<i class="icon-clock"></i>
|
|
<span class="title">Purchase Order</span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item ">
|
|
<a href="shippingorderstatus.html" class="nav-link ">
|
|
<i class="icon-check"></i>
|
|
<span class="title">Shipping Order</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="profile.html" class="nav-link nav-toggle">
|
|
<i class="icon-user"></i>
|
|
<span class="title">Profile</span>
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="contactlist.html" class="nav-link nav-toggle">
|
|
<i class="icon-notebook"></i>
|
|
<span class="title">Contact List</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<!-- END SIDEBAR MENU -->
|
|
<!-- END SIDEBAR MENU -->
|
|
</div>
|
|
<!-- END SIDEBAR -->
|
|
</div>
|
|
<!-- END SIDEBAR -->
|
|
<!-- BEGIN CONTENT -->
|
|
<div class="page-content-wrapper">
|
|
<!-- BEGIN CONTENT BODY -->
|
|
<div class="page-content">
|
|
<!-- BEGIN PAGE BAR -->
|
|
<div class="page-bar">
|
|
<ul class="page-breadcrumb">
|
|
<li>
|
|
<a href="index.html">Home</a>
|
|
<i class="fa fa-circle"></i>
|
|
</li>
|
|
<li>
|
|
<span>Contact List</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<!-- CONTENT -->
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="portlet light bordered" style="margin-bottom: 10px;">
|
|
<div class="portlet-title">
|
|
<div class="caption">
|
|
<span class="caption-subject bold font-purple-plum uppercase"> Order List </span>
|
|
</div>
|
|
<div class="inputs">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="col-md-9">
|
|
<div class="portlet-input input-inline input-small" style="margin-bottom:10px">
|
|
<div class="input-icon right">
|
|
<i class="icon-magnifier"></i>
|
|
<input type="text" class="form-control input-circle" placeholder="search...">
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="btn-group" style="width:100%">
|
|
<a href="" class="btn btn-circle btn-icon-only btn-default" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
|
|
<span class="fa fa-filter"></span>
|
|
</a>
|
|
<ul class="dropdown-menu pull-right">
|
|
<li>
|
|
<a href="javascript:;">
|
|
<span class="label label-sm label-success"> Active </span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="javascript:;">
|
|
<span class="label label-sm label-success"> Closed </span>
|
|
</a>
|
|
</li>
|
|
<li class="active">
|
|
<a href="javascript:;">
|
|
<span class="label label-sm label-success"> Pending </span>
|
|
</a>
|
|
</li>
|
|
<li class="active">
|
|
<a href="javascript:;">
|
|
<span class="label label-sm label-success"> Cancel </span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="portlet-body">
|
|
<div id="tree_1" class="tree-demo">
|
|
<ul>
|
|
<li onclick="show_general();">
|
|
General
|
|
</li>
|
|
<li>
|
|
CIEF
|
|
<ul>
|
|
<li data-jstree='{ "opened" : true }'>
|
|
014528
|
|
<ul>
|
|
<li data-jstree='{ "type" : "file" }' onclick="show_content();"> 014528 (1)<span style="margin-bottom: 20px;" class="badge badge-danger">5</span></li>
|
|
<li data-jstree='{ "type" : "file" }' onclick="show_content();"> 014528 (2)<span style="margin-bottom: 20px;" class="badge badge-danger">2</span></li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
Help
|
|
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row" id="file_manager" >
|
|
<div class="col-md-12">
|
|
<div class="portlet light bordered">
|
|
<div class="portlet-title">
|
|
<div class="caption">
|
|
<span class="caption-subject bold font-purple-plum uppercase"> File Manager </span>
|
|
</div>
|
|
</div>
|
|
<div class="portlet-body">
|
|
<div class="row">
|
|
<div class="col-md-12" style="text-align:center;">
|
|
<img src="../assets/global/img/folderimg.ico" alt="Image" style="width:100px;height:100px;" data-toggle="modal" href="#doc">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-9" id="with_content">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="portlet light portlet-fit full-height-content full-height-content-scrollable bordered">
|
|
<div class="portlet-title">
|
|
<div class="caption">
|
|
<i class="icon-bubble font-hide hide"></i>
|
|
<span class="caption-subject font-hide bold uppercase">Chats</span>
|
|
</div>
|
|
<div class="actions">
|
|
<a class="btn btn-circle btn-default" style="margin-left: 15px;" data-toggle="modal" href="#chat">
|
|
<i class="fa fa-plus"></i> Add Group </a>
|
|
<a href="javascript:window.open('trackorder.html', 'Track Order', 'width=1000,height=600');" class="btn btn-circle btn-default tooltips" data-placement="bottom" data-original-title="Track Order">
|
|
<i class="fa fa-map-marker" aria-hidden="true"></i> Track Order
|
|
</a>
|
|
<a class="btn btn-circle btn-icon-only btn-default fullscreen" href="javascript:;" data-original-title="" title=""> </a>
|
|
</div>
|
|
</div>
|
|
<div class="portlet-body" style="height: 400px;" id="chats">
|
|
<div class="scroller" style="height:80%" data-always-visible="1" data-rail-visible1="1">
|
|
<div class="tabbable-custom nav-justified">
|
|
<ul class="nav nav-tabs nav-justified">
|
|
<li class="active">
|
|
<a href="#tab_1_1_1" data-toggle="tab">
|
|
<span class="editInPlace">014528 </span> <i class="dropdown-toggless fa fa-users pull-right tooltips" data-placement="bottom" data-original-title="Members" aria-hidden="true"></i>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="#tab_1_1_2" data-toggle="tab">
|
|
<span class="editInPlace">014528 (2)</span> <i class="dropdown-toggless fa fa-users pull-right tooltips" data-placement="bottom" data-original-title="Members" aria-hidden="true"></i>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<div class="tab-content">
|
|
<div class="tab-pane active" id="tab_1_1_1">
|
|
<ul class="chats">
|
|
<li class="in">
|
|
<a style="float:left" data-toggle="modal" href="#profile"> Bob Nilson </a>
|
|
<br>
|
|
<img class="avatar" alt="" src="../assets/layouts/layout/img/avatar1.jpg" />
|
|
<div class="message">
|
|
<span class="arrow"> </span>
|
|
<span class="body"><strong> Decision requested</strong> <a data-toggle="modal" href="#request">View</a> <br/> <a href="#url">Reply</a> <a href="#url">Recall</a> </span>
|
|
<span class="datetime" style="float:right"> 20:30 </span>
|
|
</div>
|
|
</li>
|
|
<li class="out">
|
|
<a style="float:right" data-toggle="modal" href="#profile">Lisa Wong </a>
|
|
<br>
|
|
<img class="avatar" alt="" src="../assets/layouts/layout/img/avatar2.jpg" />
|
|
<div class="message">
|
|
<span class="arrow"> </span>
|
|
<span class="body"> <img src="../assets/global/img/attachment.PNG" alt="Container" ><br/> <a href="#url">Reply</a> <a href="#url">Recall</a> </span>
|
|
<span class="datetime" style="float:left"> 20:11 </span>
|
|
</div>
|
|
</li>
|
|
<li class="out">
|
|
<a style="float:right" data-toggle="modal" href="#profile"> Lisa Wong </a>
|
|
<br>
|
|
<img class="avatar" alt="" src="../assets/layouts/layout/img/avatar2.jpg" />
|
|
<div class="message">
|
|
<span class="arrow"></span>
|
|
<span class="body"><img src="../assets/global/img/cont.jpg" alt="Container" style="width:204px;height:128px;"> <br/> <a href="#url">Reply</a> <a href="#url">Recall</a> </span>
|
|
<span class="datetime" style="float:left"> 20:11 </span>
|
|
</div>
|
|
</li>
|
|
<li class="in">
|
|
<a style="float:left" data-toggle="modal" href="#profile"> Bob Nilson </a>
|
|
<br>
|
|
<img class="avatar" alt="" src="../assets/layouts/layout/img/avatar1.jpg" />
|
|
<div class="message">
|
|
<span class="arrow"> </span>
|
|
<span class="body"> Confirm <br/> <a href="#url">Reply</a> <a href="#url">Recall</a> </span>
|
|
<span class="datetime" style="float:right"> 20:30 </span>
|
|
</div>
|
|
</li>
|
|
<li class="in">
|
|
<a style="float:left" data-toggle="modal" href="#profile"> Bob Nilson </a>
|
|
<br>
|
|
<img class="avatar" alt="" src="../assets/layouts/layout/img/avatar1.jpg" />
|
|
<div class="message">
|
|
<span class="arrow"> </span>
|
|
<span class="body"> Proceed. <br/> <a href="#url">Reply</a> <a href="#url">Recall</a> </span>
|
|
<span class="datetime" style="float:right"> 20:30 </span>
|
|
</div>
|
|
</li>
|
|
<li class="out">
|
|
<a style="float:right" data-toggle="modal" href="#profile"> Richard Doe </a>
|
|
<br>
|
|
<img class="avatar" alt="" src="../assets/layouts/layout/img/avatar3.jpg" />
|
|
<div class="message">
|
|
<span class="arrow"> </span>
|
|
<span class="body"> CNTR58 <br/> <a href="#url">Reply</a> <a href="#url">Recall</a></span>
|
|
<span class="datetime" style="float:left"> 20:33 </span>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="tab-pane" id="tab_1_1_2">
|
|
<ul class="chats">
|
|
<li class="in">
|
|
<a style="float:right" data-toggle="modal" href="#profile"> Bob Nilson </a>
|
|
<br>
|
|
<img class="avatar" alt="" src="../assets/layouts/layout/img/avatar1.jpg" />
|
|
<div class="message">
|
|
<span class="arrow"> </span>
|
|
<span class="body"> Hi.<br/><a href="#url">Reply</a> <a href="#url">Recall</a> </span>
|
|
<span class="datetime" style="float:right"> 20:30 </span>
|
|
</div>
|
|
</li>
|
|
<li class="out">
|
|
<a style="float:right" data-toggle="modal" href="#profile"> Richard Doe </a>
|
|
<br>
|
|
<img class="avatar" alt="" src="../assets/layouts/layout/img/avatar3.jpg" />
|
|
<div class="message">
|
|
<span class="arrow"> </span>
|
|
<span class="body"> Bye. <br/><a href="#url">Reply</a> <a href="#url">Recall</a> </span>
|
|
<span class="datetime" style="float:left"> 20:33 </span>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="chat-form">
|
|
<div class="input-group">
|
|
<span class="input-group-btn icn-only" style="display:none">
|
|
<button id="create" style="display:none" class="btn blue"><i class="fa fa-check icon-white"></i></button>
|
|
</span>
|
|
<input type="text" id="text-custom-trigger" class="form-control">
|
|
<span class="input-group-btn icn-only">
|
|
<button class="btn blue" id="toggle"><i class="fa fa-smile-o icon-white"></i></button>
|
|
</span>
|
|
<span class="input-group-btn icn-only">
|
|
<button type="button" class="btn blue" data-container="body" data-toggle="popover" data-placement="top" data-html="true" data-content="
|
|
<button type='button' class='btn btn-default btn-circle btn-circless'><i class='fa fa-file' style='font-size:20px' aria-hidden='true'></i></button>
|
|
|
|
<button type='button' class='btn btn-default btn-circle btn-circless'><i class='fa fa-picture-o' style='font-size:20px' aria-hidden='true' ></i></button>
|
|
|
|
<button type='button' class='btn btn-default btn-circle btn-circless'><i class='fa fa-video-camera' style='font-size:20px' aria-hidden='true'></i></button>
|
|
|
|
<button type='button' class='btn btn-default btn-circle btn-circless'><img class='avatar' alt='' src='../assets/global/img/qrc.png' style='width:25px;height:25px;'/></a></button>
|
|
|
|
<button type='button' class='btn btn-default btn-circle btn-circless'><i class='fa fa-address-card-o' style='font-size:20px' aria-hidden='true''></i></button>
|
|
<script>
|
|
$('#testing').click(function(){$('#decision').modal('show');})
|
|
</script>
|
|
">
|
|
<i class="fa fa-plus-square" aria-hidden="true"></i></button>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-9" id="without_content" style="display:none;">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="portlet light portlet-fit full-height-content full-height-content-scrollable bordered">
|
|
<div class="portlet-title">
|
|
<div class="caption">
|
|
<i class="icon-bubble font-hide hide"></i>
|
|
<span class="caption-subject font-hide bold uppercase">Chats</span>
|
|
</div>
|
|
</div>
|
|
<div class="portlet-body" style="height: 400px;">
|
|
<h3 style="text-align:center; margin-top: 150px;">Please choose order number </h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-9" id="general_content" style="display:none;" >
|
|
<div class="portlet light bordered">
|
|
<div class="portlet-title">
|
|
<div class="caption">
|
|
<i class="icon-share font-dark hide"></i>
|
|
<span class="caption-subject font-dark bold uppercase">General Notifications</span>
|
|
</div>
|
|
<div class="actions">
|
|
<div class="btn-group">
|
|
<a class="btn btn-sm blue btn-outline btn-circle" href="javascript:;" data-toggle="dropdown" data-hover="dropdown" data-close-others="true"> Filter By
|
|
<i class="fa fa-angle-down"></i>
|
|
</a>
|
|
<div class="dropdown-menu hold-on-click dropdown-checkboxes pull-right">
|
|
<label class="mt-checkbox mt-checkbox-outline">
|
|
<input type="checkbox" />
|
|
<span></span>
|
|
</label>
|
|
<label class="mt-checkbox mt-checkbox-outline">
|
|
<input type="checkbox" /> Currency Update
|
|
<span></span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-content">
|
|
<div class="tab-pane active" id="tab_1_1_1">
|
|
<ul class="chats">
|
|
<li class="in">
|
|
|
|
<br>
|
|
<img class="avatar" alt="" src="../assets/global/img/company_logo.png" />
|
|
<div class="message">
|
|
<div class="desc"> CIEF updated currency <strong>Buy 1.6</strong> and <strong>Sell 1.605</strong>.</div>
|
|
<span class="datetime" style="float:left"> 20:11 </span>
|
|
</div>
|
|
</li>
|
|
<li class="in">
|
|
|
|
<br>
|
|
<img class="avatar" alt="" src="../assets/global/img/abc.png" />
|
|
<div class="message">
|
|
<div class="desc"> ABC updated currency. <strong>Buy 1.59</strong> and <strong>Sell 1.60</strong>.</div>
|
|
<span class="datetime" style="float:left"> 20:11 </span>
|
|
</div>
|
|
</li>
|
|
<li class="in">
|
|
|
|
<br>
|
|
<img class="avatar" alt="" src="../assets/global/img/company_logo.png" />
|
|
<div class="message">
|
|
<div class="desc"> CIEF updated currency <strong>Buy 1.59</strong> and <strong>Sell 1.60</strong>.</div>
|
|
<span class="datetime" style="float:left"> 20:33 </span>
|
|
</div>
|
|
</li>
|
|
<li class="out">
|
|
<img class="avatar" alt="" src="../assets/layouts/layout/img/avatar2.jpg" />
|
|
<div class="message">
|
|
<span class="arrow"> </span>
|
|
<a href="javascript:;" class="name"> Lisa Wong </a>
|
|
<span class="datetime"> at 20:11 </span>
|
|
<span class="body"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </span>
|
|
</div>
|
|
</li>
|
|
<li class="out">
|
|
<img class="avatar" alt="" src="../assets/layouts/layout/img/avatar2.jpg" />
|
|
<div class="message">
|
|
<span class="arrow"> </span>
|
|
<a href="javascript:;" class="name"> Lisa Wong </a>
|
|
<span class="datetime"> at 20:11 </span>
|
|
<span class="body"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. </span>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<div class="chat-form">
|
|
<div class="input-cont">
|
|
<input class="form-control" type="text" placeholder="Type a message here..." /> </div>
|
|
<div class="btn-cont">
|
|
<span class="arrow"> </span>
|
|
<a href="" class="btn blue icn-only">
|
|
<i class="fa fa-check icon-white"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</ul>
|
|
</div>
|
|
|
|
</div>
|
|
<!--
|
|
|
|
-->
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END CONTENT -->
|
|
</div>
|
|
<!-- END CONTENT BODY -->
|
|
|
|
<div class="modal fade in " id="request" tabindex="-1" role="basic" aria-hidden="true" style="z-index:999999;">
|
|
<div class="modal-dialog modal-lg ">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
|
|
|
|
<div class="caption">
|
|
<h3><i class='fa fa-question'></i>Decision Request</h3>
|
|
</div>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="portlet light bordered">
|
|
<form role="form" action="#">
|
|
<div class="form-group">
|
|
<br/>
|
|
<h2><strong>Unmatch Measurement</strong></h2>
|
|
<div class="portlet-body">
|
|
<table class="table table-bordered table-hover">
|
|
<thead>
|
|
<tr >
|
|
<th width="5">No</th>
|
|
<th width="10">Total Ctn (nominal)</th>
|
|
<th width="10">Measurement (nominal)</th>
|
|
<th width="10">Weight (nominal)</th>
|
|
<th width="5">Total Ctn (actual)</th>
|
|
<th width="10">Measurement (actual)</th>
|
|
<th width="10">Weight (actual)</th>
|
|
<th width="10">Photo Reference</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr class="eror" >
|
|
<td>1</td>
|
|
<td>4</td>
|
|
<td>40x40x40</td>
|
|
<td>10kg</td>
|
|
<td ><a href="javascript:void(0)" id="totalctn" data-type="text" data-pk="1" data-original-title="Total Ctn"> 3 </a></td>
|
|
<td><a href="javascript:void(0)" id="measurement" data-type="text" data-pk="1" data-original-title="Measurement"> 30 x 30 x 30 </a></td>
|
|
<td><a href="javascript:void(0)" id="weight" data-type="text" data-pk="1" data-original-title="Weight"> 9.8kg </a></td>
|
|
<td>
|
|
<div>
|
|
<span><img class="img-responsive" src="../assets/pages/media/works/img7.jpg" alt="" style="width: 50%; height: 50%"></span>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>2</td>
|
|
<td>4</td>
|
|
<td>40x40x40</td>
|
|
<td>10kg</td>
|
|
<td><a href="javascript:void(0)" id="totalctn2" data-type="text" data-pk="1" data-original-title="Total Ctn"> 4 </a></td>
|
|
<td><a href="javascript:void(0)" id="measurement2" data-type="text" data-pk="1" data-original-title="Measurement"> 40 x 40 x 40 </a></td>
|
|
<td><a href="javascript:void(0)" id="weight2" data-type="text" data-pk="1" data-original-title="Weight"> 9.8kg </a></td>
|
|
<td>
|
|
<div>
|
|
<span><img class="img-responsive" src="../assets/pages/media/works/img8.jpg" alt="" style="width: 50%; height: 50%"></span>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>3</td>
|
|
<td>4</td>
|
|
<td>40x40x40</td>
|
|
<td>10kg</td>
|
|
<td><a href="javascript:void(0)" id="totalctn3" data-type="text" data-pk="1" data-original-title="Total Ctn"> 4 </a></td>
|
|
<td><a href="javascript:void(0)" id="measurement3" data-type="text" data-pk="1" data-original-title="Measurement"> 40 x 40 x 40 </a></td>
|
|
<td><a href="javascript:void(0)" id="weight3" data-type="text" data-pk="1" data-original-title="Weight"> 9.8kg </a></td>
|
|
<td>
|
|
<div>
|
|
<span><img class="img-responsive" src="../assets/pages/media/works/img9.jpg" alt="" style="width: 50%; height: 50%"></span>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn green" onclick="confirm('Thank you. Will proceed with your order.')" data-dismiss="modal" >Yes</button>
|
|
<button type="button" class="btn dark btn-outline" data-dismiss="modal">No</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal fade in " id="chat" tabindex="-1" role="basic" aria-hidden="true" style="z-index:999999;">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
|
|
<div class="portlet box blue">
|
|
<div class="portlet-title">
|
|
<div class="caption">
|
|
<i class="fa fa-gift"></i>Select Contact</div>
|
|
<div class="tools">
|
|
<a href="javascript:;" class="collapse" data-original-title="" title=""> </a>
|
|
</div>
|
|
</div>
|
|
<div class="portlet-body">
|
|
<div class="table-toolbar">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="sample_1_wrapper" class="dataTables_wrapper no-footer">
|
|
<div class="row">
|
|
<div class="col-md-6 col-md-6">
|
|
<div id="sample_1_filter" class="dataTables_filter">
|
|
<label>Search:
|
|
<input type="search" class="form-control input-sm input-small input-inline" placeholder aria-controls="sample_1">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<button style="margin-left:180px" type="select" class="btn green">
|
|
Select All</button>
|
|
</div>
|
|
<div class="table-scrollable">
|
|
<table style="" class="table table-striped table-bordered table-hover" id="sample_3">
|
|
<thead>
|
|
<tr role="row">
|
|
<th class="sorting_disabled" rowspan="1" colspan="1" aria-label="" style="width: 62px;">
|
|
<label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
|
|
<input type="checkbox" class="group-checkable" data-set="#sample_1 .checkboxes">
|
|
<span></span>
|
|
</label>
|
|
</th>
|
|
<th class="sorting_asc" tabindex="0" aria-controls="sample_1" rowspan="1" colspan="1" aria-sort="ascending" aria-label="No : activate to sort column descending" style="width: 136px;"> Contact </th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr class="gradeX odd" role="row">
|
|
<td>
|
|
<label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
|
|
<input type="checkbox" class="checkboxes" value="1">
|
|
<span></span>
|
|
</label>
|
|
</td>
|
|
<td class="sorting_1"> Linda Wong </td>
|
|
|
|
</tr>
|
|
<tr class="gradeX even" role="row">
|
|
<td>
|
|
<label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
|
|
<input type="checkbox" class="checkboxes" value="1">
|
|
<span></span>
|
|
</label>
|
|
</td>
|
|
<td class="sorting_1"> Edris Karim </td>
|
|
|
|
</tr>
|
|
<tr class="gradeX odd" role="row">
|
|
<td>
|
|
<label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
|
|
<input type="checkbox" class="checkboxes" value="1">
|
|
<span></span>
|
|
</label>
|
|
</td>
|
|
<td class="sorting_1"> Azrin Hamidi </td>
|
|
|
|
</tr>
|
|
<tr class="gradeX even" role="row">
|
|
<td>
|
|
<label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
|
|
<input type="checkbox" class="checkboxes" value="1">
|
|
<span></span>
|
|
</label>
|
|
</td>
|
|
<td class="sorting_1"> Kuhanraj Balan </td>
|
|
|
|
</tr>
|
|
<tr class="gradeX odd" role="row">
|
|
<td>
|
|
<label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
|
|
<input type="checkbox" class="checkboxes" value="1">
|
|
<span></span>
|
|
</label>
|
|
</td>
|
|
<td class="sorting_1"> Dia Audia </td>
|
|
|
|
</tr>
|
|
<tr class="gradeX even" role="row">
|
|
<td>
|
|
<label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
|
|
<input type="checkbox" class="checkboxes" value="1">
|
|
<span></span>
|
|
</label>
|
|
</td>
|
|
<td class="sorting_1"> Belly Goh </td>
|
|
|
|
</tr>
|
|
<tr class="gradeX odd" role="row">
|
|
<td>
|
|
<label class="mt-checkbox mt-checkbox-single mt-checkbox-outline">
|
|
<input type="checkbox" class="checkboxes" value="1">
|
|
<span></span>
|
|
</label>
|
|
</td>
|
|
<td class="sorting_1"> Zamani Hashim </td>
|
|
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="row">
|
|
|
|
<br>
|
|
<br>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="form-actions">
|
|
<div class="row">
|
|
<div style="margin-left:220px" class="col-md-offset-5 col-md-5">
|
|
<button type="submit" class="btn green">
|
|
Send</button>
|
|
<button type="button" class="btn dark btn-outline" data-dismiss="modal">Close</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- /.modal-dialog -->
|
|
</div>
|
|
<div class="modal fade" id="member" tabindex="-1" role="member" style="z-index:999999;" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-body">
|
|
<form role="form">
|
|
<div class="form-body">
|
|
<div class="form-group">
|
|
<label>Choose Member</label>
|
|
<div class="row">
|
|
|
|
<div class="col-md-12">
|
|
<div class="input-group">
|
|
<input class="form-control" value="A" disabled>
|
|
<span class="input-group-addon">
|
|
<input type="checkbox"> </span>
|
|
</div>
|
|
<!-- /input-group -->
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="input-group">
|
|
<input class="form-control" value="B" disabled>
|
|
<span class="input-group-addon">
|
|
<input type="checkbox"> </span>
|
|
</div>
|
|
<!-- /input-group -->
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="input-group">
|
|
<input class="form-control" value="C" disabled>
|
|
<span class="input-group-addon">
|
|
<input type="checkbox"> </span>
|
|
</div>
|
|
<!-- /input-group -->
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="input-group">
|
|
<input class="form-control" value="D" disabled>
|
|
<span class="input-group-addon">
|
|
<input type="checkbox"> </span>
|
|
</div>
|
|
<!-- /input-group -->
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="input-group">
|
|
<input class="form-control" value="E" disabled>
|
|
<span class="input-group-addon">
|
|
<input type="checkbox"> </span>
|
|
</div>
|
|
<!-- /input-group -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn dark btn-outline" data-dismiss="modal">Close</button>
|
|
<button type="button" class="btn green">Create</button>
|
|
</div>
|
|
</div>
|
|
<!-- /.modal-content -->
|
|
</div>
|
|
<!-- /.modal-dialog -->
|
|
</div>
|
|
<div class="modal fade" id="profile" tabindex="-1" role="profile" aria-hidden="true">
|
|
<div class="portlet-body" >
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-body">
|
|
<div class="form-body">
|
|
<div class="form-group">
|
|
|
|
<!-- PERSONAL INFO TAB -->
|
|
<div align="center">
|
|
<div class="profile-userpic">
|
|
<img src="../assets/pages/media/profile/profile_user.jpg" class="img-responsive" alt="" style="width:200px;height:200px;"> </div>
|
|
<br/>
|
|
<a href="javascript:void(0)" class="btn btn-primary btn-follow"> Add as Friend</a>
|
|
<a class="btn btn-primary btn-follow float:right" data-toggle="modal" id="share" href="#member"> Share to Friend</a>
|
|
</div>
|
|
|
|
<div class="tab-pane active" id="tab_1_1">
|
|
<form role="form" action="#">
|
|
<table style="width:100%">
|
|
<form action="#" class="form-horizontal form-row-seperated">
|
|
<tr>
|
|
<div class="form-group">
|
|
<td> <label class="control-label">First Name </label></td>
|
|
<td><label class="control-label">: Syed </label></td>
|
|
</div>
|
|
</tr>
|
|
<tr>
|
|
<div class="form-group">
|
|
<td><label class="control-label">Last Name </label></td>
|
|
<td><label class="control-label">: Amir</label></td>
|
|
</div>
|
|
</tr>
|
|
<tr>
|
|
<div class="form-group">
|
|
<td><label class="control-label">Phone No </label></td>
|
|
<td><label class="control-label">: 0142536987</label></td>
|
|
</div>
|
|
</tr>
|
|
<tr>
|
|
<div class="form-group">
|
|
<td><label class="control-label">Email</label></td>
|
|
<td><label class="control-label">: amirleader@gmail.com</label></td>
|
|
</div>
|
|
</tr>
|
|
<tr>
|
|
<div class="form-group">
|
|
<td><label class="control-label">Position</label></td>
|
|
<td><label class="control-label">: Sales</label></td>
|
|
</div>
|
|
</tr>
|
|
<tr>
|
|
<div class="form-group">
|
|
<td><label class="control-label">Interests</label></td>
|
|
<td><label class="control-label">: Design</label></td>
|
|
</div>
|
|
</tr>
|
|
<tr>
|
|
<div class="form-group">
|
|
<td><label class="control-label">Occupation</label></td>
|
|
<td><label class="control-label">: Forwarder</label></td>
|
|
</div>
|
|
</tr>
|
|
</form>
|
|
</table>
|
|
</form>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Modal -->
|
|
<div class="modal fade in" id="move" tabindex="-1" role="basic" aria-hidden="true" style="z-index:999999;">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
|
|
|
|
<div class="caption">
|
|
<i class="fa fa-gift"></i>Move File
|
|
</div>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="form">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="form-group">
|
|
<label>Folder</label>
|
|
<select id="folder" class="form-control" onchange="show_hide(this);">
|
|
<option>Select / Create New Folder</option>
|
|
<option value="doc">Documents</option>
|
|
<option value="img">Images</option>
|
|
<option value="sound">Sounds</option>
|
|
<option value="oth">Others</option>
|
|
<option value="create">Create New</option>
|
|
</select>
|
|
</div>
|
|
<div class="form-group" id="folder_name" style="display: none">
|
|
<label>Folder Name</label>
|
|
<input type="text" class="form-control">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn dark btn-outline" data-dismiss="modal">Cancel</button>
|
|
<button type="button" class="btn green" data-dismiss="modal">Move</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal fade" id="doc" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal">✕</button>
|
|
<h4 class="modal-title" id="myModalLabel">File Manager</h4>
|
|
</div>
|
|
|
|
<div class="modal-body">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="col-md-4">
|
|
<div class="btn-group ">
|
|
<a class="btn dropdown-toggle btn-default" data-toggle="dropdown" href="#">
|
|
<span class="glyphicon glyphicon-plus-sign"></span>File Type
|
|
<span class="caret"></span>
|
|
</a>
|
|
<ul class="dropdown-menu">
|
|
<li><a href="#">Documents</a></li>
|
|
<li><a href="#">Images</a></li>
|
|
<li><a href="#">Sounds</a></li>
|
|
<li><a href="#">Others</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<br/>
|
|
<div class="col-md-4">
|
|
<div class="input-group">
|
|
<input type="text" class="form-control" placeholder="Search" name="q">
|
|
<div class="input-group-btn">
|
|
<button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-4">
|
|
<div class="pull-right">
|
|
<button class="btn btn-default">
|
|
<span class="glyphicon glyphicon-refresh"></span>
|
|
</button>
|
|
<a class="btn btn-default" href='#move' data-toggle='modal'>
|
|
<span class="glyphicon glyphicon-move"></span>
|
|
</a>
|
|
<div class="btn-group">
|
|
<button id="list" type="button" class="btn btn-default"><span class="glyphicon glyphicon-align-justify"></span>
|
|
</button>
|
|
<button id="thumbnail" type="button" class="btn btn-default"> <span class="glyphicon glyphicon-th"></span>
|
|
</button>
|
|
</div>
|
|
<div class="btn-group ">
|
|
<a class="btn dropdown-toggle btn-default" data-toggle="dropdown" href="#">
|
|
Sort
|
|
<span class="caret"></span>
|
|
</a>
|
|
<ul class="dropdown-menu">
|
|
<li><a href="#">ID</a></li>
|
|
<li><a href="#">Title</a></li>
|
|
<li><a href="#">Date</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-12">
|
|
<div class="col-md-3">
|
|
<div class="row">
|
|
<div class="col-md-9">
|
|
<form action="#" class="dropzone dropzone-file-area" id="my-dropzone" style="width: 180px;margin-top: 0px;margin-left: 0px;margin-right: 0px;">
|
|
<h4 class="sbold">Drop files here or click to upload</h4>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="thumbnails" class="col-md-9">
|
|
<div data-code="example-2">
|
|
<div class="row">
|
|
<div class="col-md-10" style="float: none; margin: 0 auto;">
|
|
<div class="row" style="margin-left:5px;margin-right:5px;margin-top:15px;margin-bottom:15px;">
|
|
<h5>Please click image to download <i class="fa fa-download" aria-hidden="true"></i></h5>
|
|
<a href="https://unsplash.it/1200/768.jpg?image=251" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">
|
|
<img src="https://unsplash.it/600.jpg?image=251" class="img-fluid">
|
|
</a>
|
|
<a href="https://unsplash.it/1200/768.jpg?image=252" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">
|
|
<img src="https://unsplash.it/600.jpg?image=252" class="img-fluid">
|
|
</a>
|
|
<a href="https://unsplash.it/1200/768.jpg?image=253" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">
|
|
<img src="https://unsplash.it/600.jpg?image=253" class="img-fluid">
|
|
</a>
|
|
</div>
|
|
<div class="row" style="margin-left:5px;margin-right:5px;margin-top:10px;margin-bottom:10px;">
|
|
<a href="https://unsplash.it/1200/768.jpg?image=254" download data-gallery="example-gallery" class="col-sm-4">
|
|
<img src="https://unsplash.it/600.jpg?image=254" class="img-fluid">
|
|
</a>
|
|
<a href="https://unsplash.it/1200/768.jpg?image=255" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">
|
|
<img src="https://unsplash.it/600.jpg?image=255" class="img-fluid">
|
|
</a>
|
|
<a href="https://unsplash.it/1200/768.jpg?image=256" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">
|
|
<img src="https://unsplash.it/600.jpg?image=256" class="img-fluid">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-9" id="lists" style="display:none;">
|
|
<table class="table table-hover" id="example2" style="height:300px">
|
|
|
|
<thead>
|
|
<tr>
|
|
<th><label class='mt-checkbox mt-checkbox-single mt-checkbox-outline'><input type='checkbox' class='group-checkable' data-set='#example2 .checkboxes' /><span></span></label></th>
|
|
<th>ID</th>
|
|
<th>Date</th>
|
|
<th>Title</th>
|
|
<th class="text-center">Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><label class='mt-checkbox mt-checkbox-single mt-checkbox-outline'><input type='checkbox' class='checkboxes' value='1' /><span></span></label></td>
|
|
<td>1</td>
|
|
<td>2017-08-02 13:45:22</td>
|
|
<td><a href="https://unsplash.it/1200/768.jpg?image=251" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">Container</a></td>
|
|
<td class="text-center"><a href="#" onclick="confirm('Are you confirm to delete this file?')" class="btn btn-xs"><span class="glyphicon glyphicon-trash"></span></a><a href="#" class="btn btn-xs"><span class="glyphicon glyphicon-download-alt"></span></a></td>
|
|
</tr>
|
|
<tr>
|
|
<td><label class='mt-checkbox mt-checkbox-single mt-checkbox-outline'><input type='checkbox' class='checkboxes' value='1' /><span></span></label></td>
|
|
<td>2</td>
|
|
<td>2017-08-02 13:45:22</td>
|
|
<td><a href="https://unsplash.it/1200/768.jpg?image=251" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">Container</a></td>
|
|
<td class="text-center"><a href="#" onclick="confirm('Are you confirm to delete this file?')" class="btn btn-xs"><span class="glyphicon glyphicon-trash"></span></a><a href="#" class="btn btn-xs"><span class="glyphicon glyphicon-download-alt"></span></a></td>
|
|
</tr>
|
|
<tr>
|
|
<td><label class='mt-checkbox mt-checkbox-single mt-checkbox-outline'><input type='checkbox' class='checkboxes' value='1' /><span></span></label></td>
|
|
<td>3</td>
|
|
<td>2017-08-02 13:45:22</td>
|
|
<td><a href="https://unsplash.it/1200/768.jpg?image=251" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">Container</a></td>
|
|
<td class="text-center"><a href="#" onclick="confirm('Are you confirm to delete this file?')" class="btn btn-xs"><span class="glyphicon glyphicon-trash"></span></a><a href="#" class="btn btn-xs"><span class="glyphicon glyphicon-download-alt"></span></a></td>
|
|
</tr>
|
|
<tr>
|
|
<td><label class='mt-checkbox mt-checkbox-single mt-checkbox-outline'><input type='checkbox' class='checkboxes' value='1' /><span></span></label></td>
|
|
<td>4</td>
|
|
<td>2017-08-02 13:45:22</td>
|
|
<td><a href="https://unsplash.it/1200/768.jpg?image=251" data-toggle="lightbox" data-gallery="example-gallery" class="col-sm-4">Container</a></td>
|
|
<td class="text-center"><a href="#" onclick="confirm('Are you confirm to delete this file?')" class="btn btn-xs"><span class="glyphicon glyphicon-trash"></span></a><a href="#" class="btn btn-xs"><span class="glyphicon glyphicon-download-alt"></span></a></td>
|
|
</tr>
|
|
|
|
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- END CONTENT -->
|
|
<!-- BEGIN QUICK SIDEBAR -->
|
|
<a href="javascript:;" class="page-quick-sidebar-toggler">
|
|
<i class="icon-login"></i>
|
|
</a>
|
|
<div class="page-quick-sidebar-wrapper" data-close-on-body-click="false">
|
|
<div class="page-quick-sidebar">
|
|
<ul class="nav nav-tabs">
|
|
<li class="active">
|
|
<a href="javascript:;" data-target="#quick_sidebar_tab_1" data-toggle="tab"> IMPORTER
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="javascript:;" data-target="#quick_sidebar_tab_2" data-toggle="tab"> FORWARDER
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<div class="tab-content">
|
|
<div class="tab-pane active page-quick-sidebar-chat" id="quick_sidebar_tab_1">
|
|
<div class="page-quick-sidebar-chat-users" data-rail-color="#ddd" data-wrapper-class="page-quick-sidebar-list">
|
|
<h3 class="list-heading">Members</h3>
|
|
<ul class="media-list list-items">
|
|
<li class="media">
|
|
<img class="media-object" src="../assets/layouts/layout/img/avatar2.jpg" alt="..." data-toggle="modal" href="#profile">
|
|
<div class="media-body">
|
|
<h4 class="media-heading">Lisa Wongs</h4>
|
|
<div class="media-heading-sub">Admin </div>
|
|
</div>
|
|
</li>
|
|
<li class="media">
|
|
<img class="media-object" src="../assets/layouts/layout/img/avatar1.jpg" alt="..." data-toggle="modal" href="#profile">
|
|
<div class="media-body">
|
|
<h4 class="media-heading">Bob Nilso</h4>
|
|
</div>
|
|
</li>
|
|
<li class="media">
|
|
<img class="media-object" src="../assets/layouts/layout/img/avatar3.jpg" alt="..." data-toggle="modal" href="#profile">
|
|
<div class="media-body">
|
|
<h4 class="media-heading">Richard Doe</h4>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane page-quick-sidebar-chat" id="quick_sidebar_tab_2">
|
|
<div class="page-quick-sidebar-chat-users" data-rail-color="#ddd" data-wrapper-class="page-quick-sidebar-list">
|
|
<h3 class="list-heading">Members</h3>
|
|
<ul class="media-list list-items">
|
|
<li class="media">
|
|
<img class="media-object" src="../assets/layouts/layout/img/avatar1.jpg" alt="..." data-toggle="modal" href="#profile">
|
|
<div class="media-body">
|
|
<h4 class="media-heading">Bob Nilso</h4>
|
|
<div class="media-heading-sub">Admin </div>
|
|
</div>
|
|
</li>
|
|
<li class="media">
|
|
<img class="media-object" src="../assets/layouts/layout/img/avatar2.jpg" alt="..." data-toggle="modal" href="#profile">
|
|
<div class="media-body">
|
|
<h4 class="media-heading">Lisa Wongs</h4>
|
|
</div>
|
|
</li>
|
|
<li class="media">
|
|
<img class="media-object" src="../assets/layouts/layout/img/avatar3.jpg" alt="..." data-toggle="modal" href="#profile">
|
|
<div class="media-body">
|
|
<h4 class="media-heading">Richard Doe</h4>
|
|
</div>
|
|
</li>
|
|
<li align="center">
|
|
<div class="actions">
|
|
<a class="btn btn-circle btn-default" style="margin-left: 15px;" data-toggle="modal" href="#member">
|
|
<i class="fa fa-plus"></i> Add </a>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END QUICK SIDEBAR -->
|
|
</div>
|
|
|
|
</div>
|
|
<a id="download" href="" download hidden></a>
|
|
|
|
<!-- END CONTAINER -->
|
|
<!-- BEGIN FOOTER -->
|
|
<div class="page-footer">
|
|
<div class="page-footer-inner">
|
|
Copyright © 2017 IZYIM.COM
|
|
<div class="scroll-to-top">
|
|
<i class="icon-arrow-up"></i>
|
|
</div>
|
|
</div>
|
|
<!-- END FOOTER -->
|
|
</div>
|
|
<!--[if lt IE 9]>
|
|
<script src="../assets/global/plugins/respond.min.js"></script>
|
|
<script src="../assets/global/plugins/excanvas.min.js"></script>
|
|
<script src="../assets/global/plugins/ie8.fix.min.js"></script>
|
|
<![endif]-->
|
|
<!-- BEGIN CORE PLUGINS -->
|
|
<script src="../assets/global/plugins/dropzone/dropzone.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/jquery.min.js" type="text/javascript"></script>
|
|
<script type="text/javascript" src="../assets/qweqwe/js/jquery.emojipicker.js"></script>
|
|
<script type="text/javascript" src="../assets/qweqwe/js/jquery.emojis.js"></script>
|
|
<script src="../assets/global/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/js.cookie.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/jquery.blockui.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js" type="text/javascript"></script>
|
|
<!-- END CORE PLUGINS -->
|
|
<!-- BEGIN PAGE LEVEL PLUGINS -->
|
|
<script src="../assets/global/plugins/moment.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/bootstrap-daterangepicker/daterangepicker.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/morris/morris.min.js" type="text/javascript"></script>
|
|
<!-- END PAGE LEVEL PLUGINS -->
|
|
<!-- BEGIN THEME GLOBAL SCRIPTS -->
|
|
<script src="../assets/global/scripts/app.min.js" type="text/javascript"></script>
|
|
<!-- END THEME GLOBAL SCRIPTS -->
|
|
<!-- BEGIN PAGE LEVEL SCRIPTS -->
|
|
<script src="../assets/pages/scripts/dashboard.min.js" type="text/javascript"></script>
|
|
<script src="../assets/global/plugins/jstree/dist/jstree.min.js" type="text/javascript"></script>
|
|
<script src="../assets/pages/scripts/ui-tree.min.js" type="text/javascript"></script>
|
|
<!-- END PAGE LEVEL SCRIPTS -->
|
|
<!-- BEGIN THEME LAYOUT SCRIPTS -->
|
|
<script src="../assets/layouts/layout/scripts/layout.min.js" type="text/javascript"></script>
|
|
<script src="../assets/layouts/layout/scripts/demo.min.js" type="text/javascript"></script>
|
|
<script src="../assets/layouts/global/scripts/quick-sidebar.min.js" type="text/javascript"></script>
|
|
<script src="../assets/layouts/global/scripts/quick-nav.min.js" type="text/javascript"></script>
|
|
<!-- END THEME LAYOUT SCRIPTS -->
|
|
<script type="text/javascript">
|
|
$(document).ready(function(e) {
|
|
if(window.location.search == '?menu=true'){
|
|
//alert('heiiiii');
|
|
document.getElementById("without_content").style.display = "";
|
|
document.getElementById("with_content").style.display = "none";
|
|
document.getElementById("general_content").style.display = "none";
|
|
document.getElementById("file_manager").style.display = "none";
|
|
|
|
}else{
|
|
//alert('hoooo');
|
|
document.getElementById("without_content").style.display = "none";
|
|
document.getElementById("with_content").style.display = "";
|
|
document.getElementById("general_content").style.display = "none";
|
|
document.getElementById("file_manager").style.display = "";
|
|
}
|
|
|
|
$('#create').click(function(e) {
|
|
e.preventDefault();
|
|
$('#text-custom-trigger').emojiPicker({
|
|
width: '320px',
|
|
height: '200px',
|
|
button: false
|
|
});
|
|
});
|
|
|
|
$('#toggle').click(function(e) {
|
|
e.preventDefault();
|
|
$('#text-custom-trigger').emojiPicker('toggle');
|
|
});
|
|
|
|
$('#destroy').click(function(e) {
|
|
e.preventDefault();
|
|
$('#text-custom-trigger').emojiPicker('destroy');
|
|
})
|
|
|
|
$("#create").trigger('click');
|
|
|
|
});
|
|
</script>
|
|
<script type="text/javascript">
|
|
function show_content(){
|
|
//alert('hoooo');
|
|
document.getElementById("without_content").style.display = "none";
|
|
document.getElementById("with_content").style.display = "";
|
|
document.getElementById("file_manager").style.display = "";
|
|
document.getElementById("general_content").style.display = "none";
|
|
}
|
|
function show_general(){
|
|
//alert('hoooo');
|
|
document.getElementById("without_content").style.display = "none";
|
|
document.getElementById("general_content").style.display = "";
|
|
document.getElementById("with_content").style.display = "none";
|
|
document.getElementById("file_manager").style.display = "none";
|
|
}
|
|
window.onload = function() {
|
|
var elements = getElementsByClassName('editInPlace', '*', document);
|
|
for (var i = 0; i < elements.length; i++) {
|
|
elements[i].ondblclick = function() {
|
|
this.setAttribute('oldText', this.innerHTML); // not actually required. I use this just in case you want to cancel and set the original text back.
|
|
var textBox = document.createElement('INPUT');
|
|
textBox.setAttribute('type', 'text');
|
|
textBox.value = this.innerHTML;
|
|
textBox.onblur = function() {
|
|
var newValue = this.value;
|
|
this.parentNode.innerHTML = newValue;
|
|
//alert("Your new value: \n\n" + newValue);
|
|
}
|
|
|
|
this.innerHTML = '';
|
|
|
|
this.appendChild(textBox);
|
|
}
|
|
}(i);
|
|
}
|
|
|
|
function getElementsByClassName(className, tag, elm) {
|
|
var testClass = new RegExp("(^|\\s)" + className + "(\\s|$)");
|
|
var tag = tag || "*";
|
|
var elm = elm || document;
|
|
var elements = (tag == "*" && elm.all) ? elm.all : elm.getElementsByTagName(tag);
|
|
var returnElements = [];
|
|
var current;
|
|
var length = elements.length;
|
|
for (var i = 0; i < length; i++) {
|
|
current = elements[i];
|
|
if (testClass.test(current.className)) {
|
|
returnElements.push(current);
|
|
}
|
|
}
|
|
return returnElements;
|
|
}
|
|
$('[data-toggle="popover"]').popover({trigger: 'focus'})
|
|
|
|
</script>
|
|
<script src="http://cdnjs.cloudflare.com/ajax/libs/tether/1.2.0/js/tether.min.js" integrity="sha384-Plbmg8JY28KFelvJVai01l8WyZzrYWG825m+cZ0eDDS1f7d/js6ikvy1+X+guPIB" crossorigin="anonymous"></script>
|
|
<script src="../assets/lightbox/dist/ekko-lightbox.js"></script>
|
|
<script src="http://cdnjs.cloudflare.com/ajax/libs/anchor-js/3.2.1/anchor.min.js"></script>
|
|
<script type="text/javascript">
|
|
$(document).ready(function ($) {
|
|
// delegate calls to data-toggle="lightbox"
|
|
$(document).on('click', '[data-toggle="lightbox"]:not([data-gallery="navigateTo"]):not([data-gallery="example-gallery-11"])', function(event) {
|
|
event.preventDefault();
|
|
return $(this).ekkoLightbox({
|
|
onShown: function() {
|
|
if (window.console) {
|
|
return console.log('Checking our the events huh?');
|
|
}
|
|
},
|
|
onNavigate: function(direction, itemIndex) {
|
|
if (window.console) {
|
|
return console.log('Navigating '+direction+'. Current item: '+itemIndex);
|
|
}
|
|
}
|
|
});
|
|
});
|
|
var table = $('#example2');
|
|
|
|
var tableWrapper = jQuery('#example2_wrapper');
|
|
|
|
table.find('.group-checkable').change(function () {
|
|
var set = jQuery(this).attr("data-set");
|
|
var checked = jQuery(this).is(":checked");
|
|
jQuery(set).each(function () {
|
|
if (checked) {
|
|
$(this).prop("checked", true);
|
|
$(this).parents('tr').addClass("active");
|
|
} else {
|
|
$(this).prop("checked", false);
|
|
$(this).parents('tr').removeClass("active");
|
|
}
|
|
});
|
|
});
|
|
|
|
$(document).on('click', '#download2', function(event) {
|
|
var url = $( ".ekko-lightbox-item.show" ).children("img").attr('src');
|
|
$("a#download").attr("href", url);
|
|
document.getElementById('download').click();
|
|
|
|
});
|
|
|
|
table.on('change', 'tbody tr .checkboxes', function () {
|
|
$(this).parents('tr').toggleClass("active");
|
|
});
|
|
// disable wrapping
|
|
$(document).on('click', '[data-toggle="lightbox"][data-gallery="example-gallery-11"]', function(event) {
|
|
event.preventDefault();
|
|
return $(this).ekkoLightbox({
|
|
wrapping: false
|
|
});
|
|
});
|
|
|
|
//Programmatically call
|
|
$('#open-image').click(function (e) {
|
|
e.preventDefault();
|
|
$(this).ekkoLightbox();
|
|
});
|
|
$('#open-youtube').click(function (e) {
|
|
e.preventDefault();
|
|
$(this).ekkoLightbox();
|
|
});
|
|
|
|
// navigateTo
|
|
$(document).on('click', '[data-toggle="lightbox"][data-gallery="navigateTo"]', function(event) {
|
|
event.preventDefault();
|
|
|
|
return $(this).ekkoLightbox({
|
|
onShown: function() {
|
|
|
|
this.modal().on('click', '.modal-footer a', function(e) {
|
|
|
|
e.preventDefault();
|
|
this.navigateTo(2);
|
|
|
|
}.bind(this));
|
|
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
/**
|
|
* Documentation specific - ignore this
|
|
*/
|
|
anchors.options.placement = 'left';
|
|
anchors.add('h3');
|
|
$('code[data-code]').each(function() {
|
|
|
|
var $code = $(this),
|
|
$pair = $('div[data-code="'+$code.data('code')+'"]');
|
|
|
|
$code.hide();
|
|
var text = $code.text($pair.html()).html().trim().split("\n");
|
|
var indentLength = text[text.length - 1].match(/^\s+/)
|
|
indentLength = indentLength ? indentLength[0].length : 24;
|
|
var indent = '';
|
|
for(var i = 0; i < indentLength; i++)
|
|
indent += ' ';
|
|
if($code.data('trim') == 'all') {
|
|
for (var i = 0; i < text.length; i++)
|
|
text[i] = text[i].trim();
|
|
} else {
|
|
for (var i = 0; i < text.length; i++)
|
|
text[i] = text[i].replace(indent, ' ').replace(' ', '');
|
|
}
|
|
text = text.join("\n");
|
|
$code.html(text).show();
|
|
|
|
});
|
|
});
|
|
$('#thumbnail').on('click', function() {
|
|
document.getElementById("thumbnails").style.display = "";
|
|
document.getElementById("lists").style.display = "none";
|
|
});
|
|
$('#list').on('click', function() {
|
|
document.getElementById("thumbnails").style.display = "none";
|
|
document.getElementById("lists").style.display = "";
|
|
});
|
|
function show_hide(val){
|
|
var drop_val = val.value;
|
|
if(drop_val == "create"){
|
|
document.getElementById("folder_name").style.display = "";
|
|
}else{
|
|
document.getElementById("folder_name").style.display = "none";
|
|
}
|
|
}
|
|
|
|
</script>
|
|
</body>
|
|
</html> |