视屏，图片预览

VisualInspection/js/lib/mytable.js

@@ -25,7 +25,7 @@ String.prototype.replaceAll = function(s1, s2) {
                 page_size: 10
             }
         };
-        this.options = $.extend(true,{}, DEFAULTS, options);
+        this.options = $.extend(true, {}, DEFAULTS, options);
         this.element = element;
         // this.options = options;
         this.pager = options.pager;
@@ -63,7 +63,7 @@ String.prototype.replaceAll = function(s1, s2) {
             var param = options.param;
             // var obj = this.obj;
             //加载层
-            var index = layer.load(2, {shade: false}); //0代表加载的风格，支持0-2
+            var index = layer.load(2, { shade: false }); //0代表加载的风格，支持0-2
             post_common_service(url + "/" + p_cur + "/" + page_size, param, function(data) {
                 // console.log(data);
                 layer.close(index);
@@ -117,7 +117,7 @@ String.prototype.replaceAll = function(s1, s2) {
             });
             // $('#my_table').datatable({checkable: true});
 
-            $('a.lightbox-toggle').lightbox(); //图片轮播
+            // $('a.lightbox-toggle').lightbox(); //图片轮播
             function formatTableData(data, cols, p_cur) {
                 var rows = [];
                 for (var i = 0; i < data.length; i++) {
@@ -175,7 +175,7 @@ String.prototype.replaceAll = function(s1, s2) {
                                     src = src.split('.mp4')[0] + "_screen_0.png"
                                     ispic = false;
                                 }
-                                var pic = (ispic ? '<a class="card lightbox-toggle" data-group="image-group-'+num+'" data-lightbox-group="example-3" href="' + src + '" style="width:60px;height:50px;float:left;">' : '<a class="card" onclick="video_paly(\'' + videosrc + '\')" href="javascript:void(0)" style="width:60px;height:50px;">') +
+                                var pic = (ispic ? '<a class="card lightbox-toggle" onclick="img_play(\'' + src + '\')" href="javascript:void(0)" style="width:60px;height:50px;float:left;">' : '<a class="card" onclick="video_paly(\'' + videosrc + '\')" href="javascript:void(0)" style="width:60px;height:50px;">') +
                                     '<img class="pic-class  img-thumbnail" style="width:60px;height:50px;" src="' + src + '" alt="">' + (ispic ? '' : '<i class="icon icon-play-circle" style=" font-size: 30px;position: absolute;top: 10px;left: 15px;color: white;"></i>') +
                                     '</a>';
                                 picStr += pic;
@@ -216,19 +216,21 @@ String.prototype.replaceAll = function(s1, s2) {
                 row.data = dArr;
                 return row;
             }
+
             function uuid() {
                 var s = [];
                 var hexDigits = "0123456789abcdef";
                 for (var i = 0; i < 36; i++) {
                     s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
                 }
-                s[14] = "4";  // bits 12-15 of the time_hi_and_version field to 0010
-                s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);  // bits 6-7 of the clock_seq_hi_and_reserved to 01
+                s[14] = "4"; // bits 12-15 of the time_hi_and_version field to 0010
+                s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1); // bits 6-7 of the clock_seq_hi_and_reserved to 01
                 s[8] = s[13] = s[18] = s[23] = "-";
-            
+
                 var uuid = s.join("");
                 return uuid;
             }
+
             function clearTable(cols, options, element) {
                 var checkable = options.checkable;
                 var sortable = options.sortable

VisualInspection/js/util/media.js

@@ -1,8 +1,30 @@
 var media_count = 0;
 
+function img_play(src) {
+
+    var height = 404;
+    var width = 640;
+
+    layer.open({
+        area: [width + "px", height + "px"],
+        type: 1,
+        title: '图片预览',
+        maxmin: true,
+        closeBtn: 1,
+        shadeClose: true,
+        skin: 'layui-layer-nobg', //没有背景色
+        shadeClose: true,
+        resize: true,
+        content: "<div style='height: 100%;width:100%;background:#000;text-align: center; '> <img src='" + src + "' style='height: 100%; '/></div>"
+    });
+
+}
+
+
+
 function video_paly(src) {
 
-    var height = 264;
+    var height = 364;
     var width = 640;
 
 
@@ -16,7 +38,7 @@ function video_paly(src) {
         '    class="video-js"' +
         '    controls' +
         '    preload="auto"' +
-        '    width="' + width + '" height="' + height + '"' +
+        '    width="' + width + '" height="' + (height - 42) + '"' +
         '    data-setup=\'{}\'>' +
         '  <source src=\'' + src + '\' type="video/' + videotype + '"></source>' +
         '  <p class="vjs-no-js">' +
@@ -27,11 +49,13 @@ function video_paly(src) {
         '    </a>' +
         '  </p>' +
         '</video>';
+    var lpayer = null;
 
     layer.open({
         area: [width + "px", height + "px"],
         type: 1,
-        title: false,
+        title: '视频播放',
+        maxmin: true,
         closeBtn: 1,
         shadeClose: true,
         content: "<div id='video_content_div'>" + html + "</div>",
@@ -40,7 +64,7 @@ function video_paly(src) {
 
             };
 
-            var player = videojs('my-player' + media_count, options, function onPlayerReady() {
+            lpayer = videojs('my-player' + media_count, options, function onPlayerReady() {
                 videojs.log('Your player is ready!');
 
                 // In this context, `this` is the player that was created by Video.js.
@@ -52,6 +76,14 @@ function video_paly(src) {
                 });
 
             });
+        },
+        full: function() {
+            lpayer.width(window.innerWidth - 20);
+            lpayer.height(window.innerHeight - 40 - 10);
+        },
+        restore: function() {
+            lpayer.width(width);
+            lpayer.height(height - 40);
         }
     });
 

VisualInspection/js/util/util.js

@@ -653,7 +653,7 @@ function settime() {
     $("#time_p").html(nowStr);
     $("#main").css("min-height", window.innerHeight);
     var height = window.innerHeight - $("body").height();
-    $("#foot").css("bottom", height > 0 ? 0 : height - $("#foot").height() - 20);
+    $("#foot").css("bottom", height > 0 ? 0 : height);
     setTimeout(gettime, 1000);
 }