index.html 7.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <title>Home</title>
  7. <meta name="description" content="">
  8. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  9. <meta name="robots" content="all,follow">
  10. <!-- Bootstrap CSS-->
  11. <link rel="stylesheet" href="__VENDOR__/bootstrap/css/bootstrap.min.css">
  12. <!-- Font Awesome CSS-->
  13. <link rel="stylesheet" href="__VENDOR__/font-awesome/css/font-awesome.min.css">
  14. <!-- Fontastic Custom icon font-->
  15. <!--<link rel="stylesheet" href="__CSS__/fontastic.css">-->
  16. <link rel="stylesheet" href="__CSS__/iconfont.css">
  17. <!-- Google fonts - Poppins -->
  18. <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,400,700">
  19. <!-- theme stylesheet-->
  20. <link rel="stylesheet" href="__CSS__/style.default.css" id="theme-stylesheet">
  21. <!-- Custom stylesheet - for your changes-->
  22. <link rel="stylesheet" href="__CSS__/custom.css">
  23. <!-- Favicon-->
  24. <link rel="shortcut icon" href="__IMG__/favicon.ico">
  25. <!-- Tweaks for older IEs--><!--[if lt IE 9]>
  26. <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  27. <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]-->
  28. </head>
  29. <body>
  30. <div class="page">
  31. <!-- Main Navbar-->
  32. {include file="layout/header" /}
  33. <div class="page-content d-flex align-items-stretch">
  34. <!-- Side Navbar -->
  35. {include file="layout/navigation" /}
  36. <div class="content-inner">
  37. <!-- Page Header-->
  38. <header class="page-header">
  39. <div class="container-fluid">
  40. <h2 class="no-margin-bottom">系统中心</h2>
  41. </div>
  42. </header>
  43. <!-- Dashboard Counts Section-->
  44. <section class="dashboard-counts no-padding-bottom">
  45. <div class="container-fluid">
  46. <div class="row bg-white has-shadow">
  47. <!-- Item -->
  48. <div class="col-xl-3 col-sm-6">
  49. <div class="item d-flex align-items-center">
  50. <div class="icon bg-violet"><span class="icon iconfont icon-user" style="font-size: 25px; line-height: 1;"></span></div>
  51. <div class="title"><span>New<br>Clients</span>
  52. <div class="progress">
  53. <div role="progressbar" style="width: 25%; height: 4px;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100" class="progress-bar bg-violet"></div>
  54. </div>
  55. </div>
  56. <div class="number"><strong>25</strong></div>
  57. </div>
  58. </div>
  59. <!-- Item -->
  60. <div class="col-xl-3 col-sm-6">
  61. <div class="item d-flex align-items-center">
  62. <div class="icon bg-red"><span class="icon iconfont icon-snippets" style="font-size: 25px; line-height: 1;"></span></div>
  63. <div class="title"><span>Work<br>Orders</span>
  64. <div class="progress">
  65. <div role="progressbar" style="width: 70%; height: 4px;" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" class="progress-bar bg-red"></div>
  66. </div>
  67. </div>
  68. <div class="number"><strong>70</strong></div>
  69. </div>
  70. </div>
  71. <!-- Item -->
  72. <div class="col-xl-3 col-sm-6">
  73. <div class="item d-flex align-items-center">
  74. <div class="icon bg-green"><span class="icon iconfont icon-audit" style="font-size: 25px; line-height: 1;"></span></div>
  75. <div class="title"><span>New<br>Invoices</span>
  76. <div class="progress">
  77. <div role="progressbar" style="width: 40%; height: 4px;" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" class="progress-bar bg-green"></div>
  78. </div>
  79. </div>
  80. <div class="number"><strong>40</strong></div>
  81. </div>
  82. </div>
  83. <!-- Item -->
  84. <div class="col-xl-3 col-sm-6">
  85. <div class="item d-flex align-items-center">
  86. <div class="icon bg-orange"><span class="icon iconfont icon-medicinebox-fill" style="font-size: 25px; line-height: 1;"></span></div>
  87. <div class="title"><span>Open<br>Cases</span>
  88. <div class="progress">
  89. <div role="progressbar" style="width: 50%; height: 4px;" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" class="progress-bar bg-orange"></div>
  90. </div>
  91. </div>
  92. <div class="number"><strong>50</strong></div>
  93. </div>
  94. </div>
  95. </div>
  96. </div>
  97. </section>
  98. <!-- Dashboard Header Section -->
  99. <section class="dashboard-header">
  100. <div class="container-fluid">
  101. <div class="row">
  102. <!-- Statistics -->
  103. <div class="statistics col-lg-3 col-12">
  104. <div class="statistic d-flex align-items-center bg-white has-shadow">
  105. <div class="icon bg-red"><i class="fa fa-tasks"></i></div>
  106. <div class="text"><strong>234</strong><br><small>Applications</small></div>
  107. </div>
  108. <div class="statistic d-flex align-items-center bg-white has-shadow">
  109. <div class="icon bg-green"><i class="fa fa-calendar-o"></i></div>
  110. <div class="text"><strong>152</strong><br><small>Interviews</small></div>
  111. </div>
  112. <div class="statistic d-flex align-items-center bg-white has-shadow">
  113. <div class="icon bg-orange"><i class="fa fa-paper-plane-o"></i></div>
  114. <div class="text"><strong>147</strong><br><small>Forwards</small></div>
  115. </div>
  116. </div>
  117. <!-- Line Chart -->
  118. <div class="chart col-lg-6 col-12">
  119. <div class="line-chart bg-white d-flex align-items-center justify-content-center has-shadow">
  120. <canvas id="lineCahrt"></canvas>
  121. </div>
  122. </div>
  123. <div class="chart col-lg-3 col-12">
  124. <!-- Bar Chart -->
  125. <div class="bar-chart has-shadow bg-white">
  126. <div class="title"><strong class="text-violet">95%</strong><br><small>Current Server Uptime</small></div>
  127. <canvas id="barChartHome"></canvas>
  128. </div>
  129. <!-- Numbers-->
  130. <div class="statistic d-flex align-items-center bg-white has-shadow">
  131. <div class="icon bg-green"><i class="fa fa-line-chart"></i></div>
  132. <div class="text"><strong>99.9%</strong><br><small>Success Rate</small></div>
  133. </div>
  134. </div>
  135. </div>
  136. </div>
  137. </section>
  138. <!-- Page Footer-->
  139. {include file="layout/footer" /}
  140. </div>
  141. </div>
  142. </div>
  143. <!-- JavaScript files-->
  144. <script src="__VENDOR__/jquery/jquery.min.js"></script>
  145. <script src="__VENDOR__/popper.js/umd/popper.min.js"> </script>
  146. <script src="__VENDOR__/bootstrap/js/bootstrap.min.js"></script>
  147. <script src="__VENDOR__/jquery.cookie/jquery.cookie.js"> </script>
  148. <script src="__VENDOR__/chart.js/Chart.min.js"></script>
  149. <script src="__VENDOR__/jquery-validation/jquery.validate.min.js"></script>
  150. <script src="__JS__/charts-home.js"></script>
  151. <script src="__JS__/jquery.form.js"></script>
  152. <script src="__JS__/plugins/layer/layer.min.js"></script>
  153. <!-- Main File-->
  154. <script src="__JS__/front.js"></script>
  155. </body>
  156. </html>