From 6fc11b72fa9f3812e91814c935cc06b8d04f2f51 Mon Sep 17 00:00:00 2001
From: 81041 <81041@DESKTOP-025NVD9>
Date: 星期二, 15 一月 2019 17:13:02 +0800
Subject: [PATCH] Merge branch 'dev_lxw' of https://gitlab.com/whyclxw1/gx_tieta.git into dev_lxw
---
gx_tieta/WebRoot/mobil/iframe/seenhomeinfo.html | 145 ++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 134 insertions(+), 11 deletions(-)
diff --git a/gx_tieta/WebRoot/mobil/iframe/seenhomeinfo.html b/gx_tieta/WebRoot/mobil/iframe/seenhomeinfo.html
index 09093a4..1340e60 100644
--- a/gx_tieta/WebRoot/mobil/iframe/seenhomeinfo.html
+++ b/gx_tieta/WebRoot/mobil/iframe/seenhomeinfo.html
@@ -9,6 +9,7 @@
<link rel="stylesheet" href="../src/css/layui.css">
<link rel="stylesheet" href="../app/css/common.css">
<link rel="stylesheet" href="../app/css/map.css">
+ <link rel="stylesheet" href="../app/css/module.css">
<link rel="stylesheet" href="../font-awesome-4.7.0/css/font-awesome.css">
<style>
body.homeinfo-tab .layui-tab {
@@ -23,9 +24,16 @@
body.homeinfo-tab .layui-tab-content .layui-tab-item.layui-show {
height: 100%;
}
+ #imgCarousel .carousel-item div {
+ text-align: center;
+ }
+ #imgCarousel img {
+ width: 100%;
+ height: auto;
+ }
</style>
</head>
-<body class="full-height homeinfo-tab">
+<body class="full-height homeinfo-tab" style="overflow:hidden;">
<div class="rel-full">
<div class="page-header bg-gay3">
<div class="layui-row h40">
@@ -36,40 +44,56 @@
<div class="layui-col-xs3 layui-col-md1 full-height line-height40 t-align-right"></div>
</div>
</div>
- <div class="page-content abs abs-top40 abs-bottom45">
+ <div class="page-content abs abs-top40 abs-bottom60">
<div class="rel-full">
<div class="abs footer-menu-content-show" id="homeInfo">
<div class="rel-full">
<div class="layui-tab layui-tab-card" lay-filter="homeInfoTab" id="homeInfoTab" style="height: 100%;"></div>
</div>
</div>
- <div class="abs" id="video">
+ <div class="abs h" id="video">
<div class="rel-full">
- 瑙嗛淇℃伅
+ <div class="ck-video-container h" id="ckVideo">
+ <div class="ck-video" id="myVideo"></div>
+ <div class="ck-video-list slide-hide">
+ <div class="ck-video-list-rel">
+ <div class="ck-video-list-container">
+ <ul>
+ <li><a href="javascript:;" class="active-this"><i class="fa fa-video-camera"></i><span>瑙嗛1.mp4</span></a></li>
+ <li><a href="javascript:;"><i class="fa fa-video-camera"></i><span>瑙嗛2.mp4</span></a></li>
+ </ul>
+ </div>
+ <div class="ck-video-bg"></div>
+ <div class="ck-video-slide"><i class="fa fa-angle-right"></i></div>
+ </div>
+ </div>
+ </div>
</div>
</div>
<div class="abs" id="imgs">
<div class="rel-full">
- 鍥剧墖淇℃伅
+ <div class="layui-carousel" id="imgCarousel" lay-filter="imgCarousel">
+ <div carousel-item="" class="carousel-item" id="carouselItems"></div>
+ </div>
</div>
</div>
</div>
</div>
- <div id="pageFooter" class="page-footer" style="position:absolute; bottom: 0;width: 100%; height: 44px; background-color: #FFFFFF; border-top: 1px solid #eeeeee">
+ <div id="pageFooter" class="page-footer" style="position:absolute; bottom: 0;width: 100%; height: 59px; background-color: #FFFFFF; border-top: 1px solid #eeeeee">
<div class="layui-row">
<div class="layui-col-xs4 layui-col-md4">
<div class="hdw-btn">
- <a href="javascript:;" class="this-active h44" data-href="#homeInfo"><i class="fa fa-home mrt4"></i><br><span>鏈烘埧淇℃伅</span></a>
+ <a href="javascript:;" class="this-active h59" data-href="#homeInfo"><i class="fa fa-home mrt8 mrb4"></i><br><span>鏈烘埧淇℃伅</span></a>
</div>
</div>
<div class="layui-col-xs4 layui-col-md4">
<div class="hdw-btn">
- <a href="javascript:;" class="h44" data-href="#video"><i class="fa fa-video-camera mrt4"></i><br><span>瑙嗛</span></a>
+ <a href="javascript:;" class="h59" data-href="#video"><i class="fa fa-video-camera mrt8 mrb4"></i><br><span>瑙嗛</span></a>
</div>
</div>
<div class="layui-col-xs4 layui-col-md4">
<div class="hdw-btn">
- <a href="javascript:;" class="h44" data-href="#imgs"><i class="fa fa-image mrt4"></i><br><span>鍥剧墖</span></a>
+ <a href="javascript:;" class="h59" data-href="#imgs"><i class="fa fa-image mrt8 mrb4"></i><br><span>鍥剧墖</span></a>
</div>
</div>
</div>
@@ -328,16 +352,19 @@
</script>
<script src="../js/jquery-1.8.3.js"></script>
<script src="../../src/layui.js"></script>
+ <script src="../../ckplayer/ckplayer.js"></script>
<script src="../app/js/common.js"></script>
<script src="../../pages/js/GPS.js"></script>
<script type="text/javascript">
// layui妯″潡
- layui.use(['layer', 'laytpl', 'form', 'upload', 'element'], function() {
+ layui.use(['layer', 'laytpl', 'form', 'upload', 'element', 'carousel'], function() {
var layer = layui.layer; // 鑾峰彇layer妯″潡
var laytpl = layui.laytpl; // 鑾峰彇laytpl妯″潡
var form = layui.form; // 鑾峰彇form妯″潡
var upload = layui.upload; // 鑾峰彇upload妯″潡
var element = layui.element; // 鑾峰彇element妯″潡
+ var carousel = layui.carousel; // 鑾峰彇carousel妯″潡
+ var ckVideo = new CkVideo('#ckVideo', '#myVideo'); // 瀹炰緥鍖朇kVideo
var footerMenu = new FooterMenu($('#pageFooter')); // 瀹炰緥鍖栧簳閮ㄥ鑸爮
var homeInfo = parent.$('#homeInfoIframe').data('homeInfo'); // 鏈烘埧淇℃伅
var homeInfoTpl = $('#homeTab').html(); // 鏈烘埧淇℃伅妯℃澘
@@ -367,7 +394,7 @@
if(rs.code == 1) {
var data = rs.data;
var rsData = formatHomeInfo(data);
- console.log(rsData);
+ // console.log(rsData);
laytpl(homeInfoTpl).render(rsData, function(html) {
$('#homeInfoTab').html(html);
element.render('tab', 'homeInfoTab');
@@ -520,6 +547,102 @@
// 杩斿洖缁撴灉闆�
return rs;
}
+
+ // 鑾峰彇瑙嗛鍒楄〃
+ getVideoList(homeInfo.homeId);
+ function getVideoList(sid) {
+ var tmp = {
+ StationId: sid,
+ VideoOrImage: 'video'
+ };
+ var videoContainer = $('#videos .video-list-content');
+ // 璇锋眰瑙嗛鎾斁鍒楄〃
+ $.ajax({
+ type: 'post',
+ async: true,
+ url: 'MyFileAction!searchStationSource',
+ data: 'json='+JSON.stringify(tmp),
+ dataType: 'json',
+ success: function(result) {
+ var rs = JSON.parse(result.result);
+ //console.log(rs);
+ if(rs.code==1) {
+ var data = rs.data;
+ ckVideo.init(data, sid);
+ }else {
+ ckVideo.init([], sid);
+ }
+
+ }
+ });
+ }
+
+
+ // 鏈烘埧鐜鍥剧墖闆嗘ā鍧�
+ var imgCarouselopts = {
+ elem: '#imgCarousel',
+ arrow: 'always',
+ width: '100%',
+ height: '100%',
+ autoplay: false
+ };
+
+ //甯歌杞挱
+ var homeEnvImgs = carousel.render(imgCarouselopts);
+ // 鏌ヨ杞挱鍥捐祫婧�
+ var imgsContainer = $('#carouselItems');
+ searchCarouselImgs(homeInfo.homeId, homeEnvImgs, imgCarouselopts, imgsContainer);
+ function searchCarouselImgs(sid, carousel, options, imgsContainer) {
+ var tmp = {
+ StationId: sid,
+ VideoOrImage: 'image'
+ };
+ // 璇锋眰瑙嗛鎾斁鍒楄〃
+ $.ajax({
+ type: 'post',
+ async: true,
+ url: 'MyFileAction!searchStationSource',
+ data: 'json='+JSON.stringify(tmp),
+ dataType: 'json',
+ success: function(result) {
+ var rs = JSON.parse(result.result);
+ //console.log(rs);
+ var rsList = [];
+ if(rs.code==1) {
+ var data = rs.data;
+ for(var i=0; i<data.length; i++) {
+ var _data = data[i];
+ var tmp = {};
+ tmp.fileName = _data.fileName;
+ tmp.fileUrl = '../../../stationsrc/'+sid+'/image/'+_data.fileName;
+ rsList.push(tmp);
+ }
+ }else {
+ var tmp = {};
+ tmp.fileName = 'none.jpg';
+ tmp.fileUrl = '../../images/none.jpg';
+ rsList.push(tmp);
+ }
+ updateCarouselImgs(homeEnvImgs, imgCarouselopts, imgsContainer, rsList);
+ }
+ });
+ }
+
+ // 鏇存柊鍥剧墖杞挱鍥�
+ function updateCarouselImgs(carousel, options, container, imgs) {
+ // 娓呯┖瀹瑰櫒
+ container.text('');
+ // 閬嶅巻imgs
+ for(var i=0; i<imgs.length; i++) {
+ var _imgs = imgs[i];
+ var item = $('<div><img src="'+_imgs.fileUrl+'"></div>');
+ container.append(item);
+ }
+
+ carousel.reload(options);
+ }
+
+
});
</script>
</body>
--
Gitblit v1.9.1