data.html 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. {%set loadUrl = data['url']['data'] + '&ajax=1' %}
  2. {% if data['ajax'] == False %}
  3. <!DOCTYPE html>
  4. <html>
  5. <head>
  6. {%include '../inc/header.html'%}
  7. <link href="{{static_url('pc/lib/layer/hint.css')}}" rel="stylesheet">
  8. {% if 'camera' in data and data['camera'] %}
  9. <link href="{{static_url('pc/lib/player/video-js.min.css')}}" rel="stylesheet">
  10. {% end %}
  11. <style>
  12. .button dt {
  13. margin-top: -9px;
  14. padding-bottom: 9px;
  15. }
  16. .button .btn-switch {
  17. border-radius: 0px;
  18. height:32px;
  19. width: 40px;
  20. font-size:12px;
  21. cursor: pointer;
  22. outline:none;
  23. margin-left:-9px;
  24. }
  25. .button .open {
  26. color:white;
  27. }
  28. .button .disabled {
  29. color:#bababa;
  30. }
  31. .button .loading {
  32. background-image: url(data:image/gif;base64,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);
  33. background-position: 50%;
  34. background-repeat: no-repeat;
  35. background-size: 15px 15px;
  36. }
  37. </style>
  38. </head>
  39. <body>
  40. <div class="wrapper clearfix">
  41. {%include '../inc/nav.html'%}
  42. <div class="right-cont">
  43. {%include '../inc/top.html'%}
  44. <div class="main">
  45. {%include '../inc/msg.html'%}
  46. {%include 'inc/menu.html'%}
  47. {% if 'stat' in data and data['stat'] %}
  48. <div>
  49. <div class="pannel" name="chart" id="chart">
  50. <h2>今日(<span class="name">{{data['stat']['name']}}</span>)数据趋势</h2>
  51. <div class="box" id="main" style="width: 100%;height:405px;"></div>
  52. </div>
  53. </div>
  54. {% end %}
  55. {% if 'camera' in data and data['camera'] %}
  56. {% for k,v in enumerate(data['camera']) %}
  57. <div class="{% if k%2 == 0 %}left{% else %}right{% end %} w-half">
  58. <div class="pannel">
  59. <h2>{{v['name']}}</h2>
  60. <video id="player-{{k}}" class="player video-js vjs-default-skin" controls>
  61. <source
  62. src="{{v['value']}}"
  63. type="application/x-mpegURL">
  64. </video>
  65. </div>
  66. </div>
  67. {% end %}
  68. {% end %}
  69. <div id="loadMain">
  70. {% end %}
  71. {% if 'pic' in data and data['pic'] %}
  72. {% if 'camera' in data and data['camera'] %}
  73. {%set index = 0 %}
  74. {% for v in data['camera'] %}
  75. {%set index = index+1 %}
  76. {% end %}
  77. {% else %}
  78. {%set index = 0 %}
  79. {% end %}
  80. {% for k,v in enumerate(data['pic']) %}
  81. <div class="{% if index%2 == 0 %}left{% else %}right{% end %} w-half">
  82. <div class="pannel">
  83. <h2>{{v['name']}}</h2>
  84. <div class="box">
  85. <img src="{{v['value']}}" width="100%" style="display: block;" />
  86. </div>
  87. </div>
  88. </div>
  89. {%set index = index+1 %}
  90. {% end %}
  91. {% end %}
  92. {%include 'inc/data.html'%}
  93. {% if data['ajax'] == False %}
  94. </div>
  95. </div>
  96. </div>
  97. </div>
  98. {%include '../inc/footer.html'%}
  99. {%include '../inc/script.html'%}
  100. {% end %}
  101. {% if 'stat' not in data %}
  102. {% else %}
  103. {% if data['ajax'] == False %}
  104. {%include 'chart/simple.html'%}
  105. {% else %}
  106. {%include 'chart/ajax.html'%}
  107. {% end %}
  108. {% end %}
  109. {% if data['ajax'] == False %}
  110. {%include 'inc/load.html'%}
  111. </body>
  112. </html>
  113. {% end %}