main.php 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460
  1. <?php
  2. use yii\helpers\Html;
  3. use yii\bootstrap\Nav;
  4. use yii\bootstrap\NavBar;
  5. use yii\widgets\Breadcrumbs;
  6. use app\models\User;
  7. use app\assets\AppAsset;
  8. use app\widgets\Alert;
  9. $user = User::findOne(\Yii::$app->user->id);
  10. $userName = \Yii::$app->user->id ? $user->getName() : '';
  11. ?>
  12. <?php $this->beginPage() ?>
  13. <!DOCTYPE html>
  14. <html lang="en">
  15. <head>
  16. <meta charset="utf-8" />
  17. <title><?= Html::encode($this->title) ?> - Walle 瓦力平台</title>
  18. <link href="/dist/css/bootstrap.min.css" rel="stylesheet" />
  19. <link href="/dist/css/font-awesome.min.css" rel="stylesheet" />
  20. <!--[if IE 7]>
  21. <link rel="stylesheet" href="/dist/css/font-awesome-ie7.min.css" />
  22. <![endif]-->
  23. <!-- page specific plugin styles -->
  24. <!-- ace styles -->
  25. <link rel="stylesheet" href="/dist/css/ace.min.css" />
  26. <link rel="stylesheet" href="/dist/css/ace-rtl.min.css" />
  27. <link rel="stylesheet" href="/dist/css/ace-skins.min.css" />
  28. <!--[if lte IE 8]>
  29. <link rel="stylesheet" href="/dist/css/ace-ie.min.css" />
  30. <![endif]-->
  31. <!--[if !IE]> -->
  32. <script type="text/javascript">
  33. window.jQuery || document.write("<script src='/dist/js/jquery-2.0.3.min.js'>"+"<"+"script>");
  34. </script>
  35. <!-- <![endif]-->
  36. <!--[if IE]>
  37. <script type="text/javascript">
  38. window.jQuery || document.write("<script src='/dist/js/jquery-1.10.2.min.js'>"+"<"+"script>");
  39. </script>
  40. <![endif]-->
  41. <!-- inline styles related to this page -->
  42. <!-- ace settings handler -->
  43. <script src="/dist/js/ace-extra.min.js"></script>
  44. <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
  45. <!--[if lt IE 9]>
  46. <script src="/dist/js/html5shiv.js"></script>
  47. <script src="/dist/js/respond.min.js"></script>
  48. <![endif]-->
  49. </head>
  50. <body>
  51. <div class="navbar navbar-default" id="navbar">
  52. <script type="text/javascript">
  53. try{ace.settings.check('navbar' , 'fixed')}catch(e){}
  54. </script>
  55. <div class="navbar-container" id="navbar-container">
  56. <div class="navbar-header pull-left">
  57. <a href="#" class="navbar-brand">
  58. <small>Walle</small>
  59. </a><!-- /.brand -->
  60. </div><!-- /.navbar-header -->
  61. <div class="navbar-header pull-right" role="navigation">
  62. <ul class="nav ace-nav">
  63. <li class="light-blue">
  64. <a data-toggle="dropdown" href="#" class="dropdown-toggle">
  65. <span class="user-info"><?= $userName ?></span>
  66. <i class="icon-caret-down"></i>
  67. </a>
  68. <ul class="user-menu pull-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">
  69. <li>
  70. <a href="#">
  71. <i class="icon-cog"></i>
  72. 设置
  73. </a>
  74. </li>
  75. <li>
  76. <a href="#">
  77. <i class="icon-user"></i>
  78. 个人资料
  79. </a>
  80. </li>
  81. <li class="divider"></li>
  82. <li>
  83. <a href="/site/logout">
  84. <i class="icon-off"></i>
  85. 退出
  86. </a>
  87. </li>
  88. </ul>
  89. </li>
  90. </ul><!-- /.ace-nav -->
  91. </div><!-- /.navbar-header -->
  92. </div><!-- /.container -->
  93. </div>
  94. <div class="main-container" id="main-container">
  95. <script type="text/javascript">
  96. try{ace.settings.check('main-container' , 'fixed')}catch(e){}
  97. </script>
  98. <div class="main-container-inner">
  99. <a class="menu-toggler" id="menu-toggler" href="#">
  100. <span class="menu-text"></span>
  101. </a>
  102. <div class="sidebar" id="sidebar">
  103. <script type="text/javascript">
  104. try{ace.settings.check('sidebar' , 'fixed')}catch(e){}
  105. </script>
  106. <ul class="nav nav-list">
  107. <li>
  108. <a href="#" class="dropdown-toggle">
  109. <i class="icon-desktop"></i>
  110. <span class="menu-text"> 上线部署 </span>
  111. <b class="arrow icon-angle-down"></b>
  112. </a>
  113. <ul class="submenu">
  114. <li>
  115. <a href="/walle/config/">
  116. <i class="icon-double-angle-right"></i>
  117. 项目配置
  118. </a>
  119. </li>
  120. <li>
  121. <a href="/walle/index">
  122. <i class="icon-double-angle-right"></i>
  123. 我的上线任务
  124. </a>
  125. </li>
  126. <li>
  127. <a href="/walle/submit/">
  128. <i class="icon-double-angle-right"></i>
  129. 提交上线任务
  130. </a>
  131. </li>
  132. </ul>
  133. </li>
  134. <!---->
  135. <!-- <li>-->
  136. <!-- <a href="#" class="dropdown-toggle">-->
  137. <!-- <i class="icon-list"></i>-->
  138. <!-- <span class="menu-text"> 日志监控 </span>-->
  139. <!---->
  140. <!-- <b class="arrow icon-angle-down"></b>-->
  141. <!-- </a>-->
  142. <!---->
  143. <!-- <ul class="submenu">-->
  144. <!-- <li>-->
  145. <!-- <a href="/logger/search">-->
  146. <!-- <i class="icon-double-angle-right"></i>-->
  147. <!-- 日志查看-->
  148. <!-- </a>-->
  149. <!-- </li>-->
  150. <!-- <li>-->
  151. <!-- <a href="/subscribe/index">-->
  152. <!-- <i class="icon-double-angle-right"></i>-->
  153. <!-- 日志订阅-->
  154. <!-- </a>-->
  155. <!-- </li>-->
  156. <!-- <li>-->
  157. <!-- <a href="/logger/index">-->
  158. <!-- <i class="icon-double-angle-right"></i>-->
  159. <!-- 报表-->
  160. <!-- </a>-->
  161. <!-- </li>-->
  162. <!-- </ul>-->
  163. <!-- </li>-->
  164. </ul><!-- /.nav-list -->
  165. </div>
  166. <div class="main-content">
  167. <div class="breadcrumbs" id="breadcrumbs">
  168. <ul class="breadcrumb">
  169. <li>
  170. <i class="icon-home home-icon"></i>
  171. <a href="/">首页</a>
  172. </li>
  173. <li class="active"><?= $this->title ?></li>
  174. </ul><!-- .breadcrumb -->
  175. </div>
  176. <div class="page-content">
  177. <div class="row">
  178. <div class="col-xs-12">
  179. <?= $content ?>
  180. </div><!-- /.col -->
  181. </div><!-- /.row -->
  182. </div><!-- /.page-content -->
  183. </div><!-- /.main-content -->
  184. </div><!-- /.main-container-inner -->
  185. <a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
  186. <i class="icon-double-angle-up icon-only bigger-110"></i>
  187. </a>
  188. </div><!-- /.main-container -->
  189. <!-- basic scripts -->
  190. <script type="text/javascript">
  191. if("ontouchend" in document) document.write("<script src='/dist/js/jquery.mobile.custom.min.js'>"+"<"+"script>");
  192. </script>
  193. <script src="/dist/js/bootstrap.min.js"></script>
  194. <script src="/dist/js/typeahead-bs2.min.js"></script>
  195. <!-- page specific plugin scripts -->
  196. <!--[if lte IE 8]>
  197. <script src="/dist/js/excanvas.min.js"></script>
  198. <![endif]-->
  199. <script src="/dist/js/jquery-ui-1.10.3.custom.min.js"></script>
  200. <script src="/dist/js/jquery.ui.touch-punch.min.js"></script>
  201. <script src="/dist/js/jquery.slimscroll.min.js"></script>
  202. <script src="/dist/js/jquery.easy-pie-chart.min.js"></script>
  203. <script src="/dist/js/jquery.sparkline.min.js"></script>
  204. <script src="/dist/js/flot/jquery.flot.min.js"></script>
  205. <script src="/dist/js/flot/jquery.flot.pie.min.js"></script>
  206. <script src="/dist/js/flot/jquery.flot.resize.min.js"></script>
  207. <!-- ace scripts -->
  208. <script src="/dist/js/ace-elements.min.js"></script>
  209. <script src="/dist/js/ace.min.js"></script>
  210. <!-- inline scripts related to this page -->
  211. <script type="text/javascript">
  212. jQuery(function($) {
  213. $('.easy-pie-chart.percentage').each(function(){
  214. var $box = $(this).closest('.infobox');
  215. var barColor = $(this).data('color') || (!$box.hasClass('infobox-dark') ? $box.css('color') : 'rgba(255,255,255,0.95)');
  216. var trackColor = barColor == 'rgba(255,255,255,0.95)' ? 'rgba(255,255,255,0.25)' : '#E2E2E2';
  217. var size = parseInt($(this).data('size')) || 50;
  218. $(this).easyPieChart({
  219. barColor: barColor,
  220. trackColor: trackColor,
  221. scaleColor: false,
  222. lineCap: 'butt',
  223. lineWidth: parseInt(size/10),
  224. animate: /msie\s*(8|7|6)/.test(navigator.userAgent.toLowerCase()) ? false : 1000,
  225. size: size
  226. });
  227. })
  228. $('.sparkline').each(function(){
  229. var $box = $(this).closest('.infobox');
  230. var barColor = !$box.hasClass('infobox-dark') ? $box.css('color') : '#FFF';
  231. $(this).sparkline('html', {tagValuesAttribute:'data-values', type: 'bar', barColor: barColor , chartRangeMin:$(this).data('min') || 0} );
  232. });
  233. var placeholder = $('#piechart-placeholder').css({'width':'90%' , 'min-height':'150px'});
  234. var data = [
  235. { label: "social networks", data: 38.7, color: "#68BC31"},
  236. { label: "search engines", data: 24.5, color: "#2091CF"},
  237. { label: "ad campaigns", data: 8.2, color: "#AF4E96"},
  238. { label: "direct traffic", data: 18.6, color: "#DA5430"},
  239. { label: "other", data: 10, color: "#FEE074"}
  240. ]
  241. function drawPieChart(placeholder, data, position) {
  242. $.plot(placeholder, data, {
  243. series: {
  244. pie: {
  245. show: true,
  246. tilt:0.8,
  247. highlight: {
  248. opacity: 0.25
  249. },
  250. stroke: {
  251. color: '#fff',
  252. width: 2
  253. },
  254. startAngle: 2
  255. }
  256. },
  257. legend: {
  258. show: true,
  259. position: position || "ne",
  260. labelBoxBorderColor: null,
  261. margin:[-30,15]
  262. }
  263. ,
  264. grid: {
  265. hoverable: true,
  266. clickable: true
  267. }
  268. })
  269. }
  270. drawPieChart(placeholder, data);
  271. /**
  272. we saved the drawing function and the data to redraw with different position later when switching to RTL mode dynamically
  273. so that's not needed actually.
  274. */
  275. placeholder.data('chart', data);
  276. placeholder.data('draw', drawPieChart);
  277. var $tooltip = $("<div class='tooltip top in'><div class='tooltip-inner'></div></div>").hide().appendTo('body');
  278. var previousPoint = null;
  279. placeholder.on('plothover', function (event, pos, item) {
  280. if(item) {
  281. if (previousPoint != item.seriesIndex) {
  282. previousPoint = item.seriesIndex;
  283. var tip = item.series['label'] + " : " + item.series['percent']+'%';
  284. $tooltip.show().children(0).text(tip);
  285. }
  286. $tooltip.css({top:pos.pageY + 10, left:pos.pageX + 10});
  287. } else {
  288. $tooltip.hide();
  289. previousPoint = null;
  290. }
  291. });
  292. var d1 = [];
  293. for (var i = 0; i < Math.PI * 2; i += 0.5) {
  294. d1.push([i, Math.sin(i)]);
  295. }
  296. var d2 = [];
  297. for (var i = 0; i < Math.PI * 2; i += 0.5) {
  298. d2.push([i, Math.cos(i)]);
  299. }
  300. var d3 = [];
  301. for (var i = 0; i < Math.PI * 2; i += 0.2) {
  302. d3.push([i, Math.tan(i)]);
  303. }
  304. var sales_charts = $('#sales-charts').css({'width':'100%' , 'height':'220px'});
  305. $.plot("#sales-charts", [
  306. { label: "Domains", data: d1 },
  307. { label: "Hosting", data: d2 },
  308. { label: "Services", data: d3 }
  309. ], {
  310. hoverable: true,
  311. shadowSize: 0,
  312. series: {
  313. lines: { show: true },
  314. points: { show: true }
  315. },
  316. xaxis: {
  317. tickLength: 0
  318. },
  319. yaxis: {
  320. ticks: 10,
  321. min: -2,
  322. max: 2,
  323. tickDecimals: 3
  324. },
  325. grid: {
  326. backgroundColor: { colors: [ "#fff", "#fff" ] },
  327. borderWidth: 1,
  328. borderColor:'#555'
  329. }
  330. });
  331. $('#recent-box [data-rel="tooltip"]').tooltip({placement: tooltip_placement});
  332. function tooltip_placement(context, source) {
  333. var $source = $(source);
  334. var $parent = $source.closest('.tab-content')
  335. var off1 = $parent.offset();
  336. var w1 = $parent.width();
  337. var off2 = $source.offset();
  338. var w2 = $source.width();
  339. if( parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2) ) return 'right';
  340. return 'left';
  341. }
  342. $('.dialogs,.comments').slimScroll({
  343. height: '300px'
  344. });
  345. //Android's default browser somehow is confused when tapping on label which will lead to dragging the task
  346. //so disable dragging when clicking on label
  347. var agent = navigator.userAgent.toLowerCase();
  348. if("ontouchstart" in document && /applewebkit/.test(agent) && /android/.test(agent))
  349. $('#tasks').on('touchstart', function(e){
  350. var li = $(e.target).closest('#tasks li');
  351. if(li.length == 0)return;
  352. var label = li.find('label.inline').get(0);
  353. if(label == e.target || $.contains(label, e.target)) e.stopImmediatePropagation() ;
  354. });
  355. $('#tasks').sortable({
  356. opacity:0.8,
  357. revert:true,
  358. forceHelperSize:true,
  359. placeholder: 'draggable-placeholder',
  360. forcePlaceholderSize:true,
  361. tolerance:'pointer',
  362. stop: function( event, ui ) {//just for Chrome!!!! so that dropdowns on items don't appear below other items after being moved
  363. $(ui.item).css('z-index', 'auto');
  364. }
  365. }
  366. );
  367. $('#tasks').disableSelection();
  368. $('#tasks input:checkbox').removeAttr('checked').on('click', function(){
  369. if(this.checked) $(this).closest('li').addClass('selected');
  370. else $(this).closest('li').removeClass('selected');
  371. });
  372. })
  373. </script>
  374. <?php $this->endBody() ?>
  375. </body>
  376. </html>
  377. <?php $this->endPage() ?>