From ea5b3ab8de8985288adcc980f15703776fb2d011 Mon Sep 17 00:00:00 2001
From: kylin L <452061493@qq.com>
Date: Thu, 18 Jan 2024 20:22:42 +0800
Subject: [PATCH] =?UTF-8?q?tab2=E4=B9=9F=E9=9C=80=E8=A6=81=E7=9A=84?=
 =?UTF-8?q?=E8=BD=AE=E6=92=AD=E5=9B=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../project/smallProgram/css/carousel.css     |   2 +-
 .../project/smallProgram/css/carouselSite.css |  54 ++++
 .../project/smallProgram/js/carousel.js       | 253 ++++++++++--------
 .../project/smallProgram/js/carouselSite.js   | 201 ++++++++++++++
 .../project/smallProgram/image/settings.html  |  72 +++--
 5 files changed, 447 insertions(+), 135 deletions(-)
 create mode 100755 lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/css/carouselSite.css
 create mode 100755 lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/js/carouselSite.js

diff --git a/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/css/carousel.css b/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/css/carousel.css
index 1ebc0e97..98457609 100755
--- a/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/css/carousel.css
+++ b/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/css/carousel.css
@@ -51,4 +51,4 @@ ul{
 }
 .img-index li.js_index,.img-index li:hover{
     background-color: rgba(0,0,0,0.7);
-}
\ No newline at end of file
+}
diff --git a/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/css/carouselSite.css b/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/css/carouselSite.css
new file mode 100755
index 00000000..896fba1d
--- /dev/null
+++ b/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/css/carouselSite.css
@@ -0,0 +1,54 @@
+/*定义css变量*/
+:root{
+    --mywidth: 500px;
+    --myheight: 100%;
+}
+
+*{
+    margin: 0;
+    padding: 0;
+}
+ul{
+    list-style: none;
+}
+.carousel-contentSite{
+    width: var(--mywidth);
+    height: var(--myheight);
+    position: relative;
+    overflow: hidden;
+    border-radius:10px;
+}
+.carouselSite{
+    height: var(--myheight);
+    position: absolute;
+}
+.carouselSite li{
+    float: left;
+}
+.carouselSite li,.carouselSite li img{
+    width: var(--mywidth);
+    height: var(--myheight);
+}
+.img-indexSite{
+    position: absolute;
+    bottom: 8px;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+}
+.img-indexSite li{
+    float: left;
+    width: 18px;
+    height: 18px;
+    line-height: 18px;
+    text-align: center;
+    border-radius: 10px;
+    background-color: rgba(0,0,0,0.2);
+    font-size: 12px;
+    cursor: pointer;
+    margin: 0 3px;
+    color: #fff;
+}
+.img-indexSite li.js_indexSite,.img-indexSite li:hover{
+    background-color: rgba(0,0,0,0.7);
+}
\ No newline at end of file
diff --git a/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/js/carousel.js b/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/js/carousel.js
index f4da6aac..9d7328e8 100755
--- a/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/js/carousel.js
+++ b/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/js/carousel.js
@@ -1,168 +1,201 @@
-;(function($){
-	$.fn.carousel = function(param){
-		var carousel = param.carousel,//轮播框架
-		indexContainer = param.indexContainer,//下标框架
-		list = $(carousel).children("li"),//轮播内容
-		len = list.length,//轮播内容数量
-		prev = param.prev,//上翻按钮
-		next = param.next,//下翻按钮
-		timing = param.timing,//自动轮播间隔时间
-		animateTime = param.animateTime,//动画时间
-		autoPlay = param.autoPlay,//自动播放 true/false
-		timer,//定时器
-		index = 1,//索引值
-		indexList,//下标列表
-		indexClassName = "js_index",//下标高亮类名
-		action = true,//开始滚动 true/false
-		totalWidtn = list.width()*(list.length+2),//轮播框架总宽度
-		direction = param.direction;//滚动方向
-		
+(function ($) {
+	$.fn.carousel = function (param) {
+		var carousel = param.carousel, //轮播框架
+			indexContainer = param.indexContainer, //下标框架
+			list = $(carousel).children("li"), //轮播内容
+			len = list.length, //轮播内容数量
+			prev = param.prev, //上翻按钮
+			next = param.next, //下翻按钮
+			timing = param.timing, //自动轮播间隔时间
+			animateTime = param.animateTime, //动画时间
+			autoPlay = param.autoPlay, //自动播放 true/false
+			timer, //定时器
+			index = 1, //索引值
+			indexList, //下标列表
+			indexClassName = "js_index", //下标高亮类名
+			action = true, //开始滚动 true/false
+			totalWidtn = list.width() * (list.length + 2), //轮播框架总宽度
+			direction = param.direction; //滚动方向
 		/*初始化*/
-		for(var i = 1;i <= list.length;i++){
-			$(indexContainer).append("<li>"+i+"</li>")
+		for (var i = 1; i <= list.length; i++) {
+			$(indexContainer).append("<li>" + i + "</li>");
 		}
-		$(carousel).width(totalWidtn)
-		.append($(list[0]).clone())
-		.prepend($(list[list.length-1]).clone())
-		.css("left","-"+list.width()+"px");
+		$(carousel)
+			.width(totalWidtn)
+			.append($(list[0]).clone())
+			.prepend($(list[list.length - 1]).clone())
+			.css("left", "-" + list.width() + "px");
 		list = $(carousel).children("li");
 		indexList = $(indexContainer).children("li");
-		$(indexList[index-1]).addClass(indexClassName);
+		$(indexList[index - 1]).addClass(indexClassName);
 
 		/*判断是否自动播放*/
 		if (autoPlay) {
 			startTiming();
-			$(carousel+","+prev+","+next+","+indexContainer).hover(function(){
-				window.clearInterval(timer);
-			},function(){
-				startTiming();
-			});
+			$(carousel + "," + prev + "," + next + "," + indexContainer).hover(
+				function () {
+					window.clearInterval(timer);
+				},
+				function () {
+					startTiming();
+				}
+			);
 		}
 
 		/*计时方法*/
-		function startTiming(){
+		function startTiming() {
 			/*判断方向*/
 			switch (direction) {
-				case "right" :
-					timer = window.setInterval("$.rightChangeImg();",timing);
-				break;
-				case "left" :
-					timer = window.setInterval("$.leftChangeImg();",timing);
-				break;
+				case "right":
+					timer = window.setInterval("$.rightChangeImg();", timing);
+					break;
+				case "left":
+					timer = window.setInterval("$.leftChangeImg();", timing);
+					break;
 				default:
-					timer = window.setInterval("$.leftChangeImg();",timing);
+					timer = window.setInterval("$.leftChangeImg();", timing);
 			}
-		};
+		}
 
 		/*切换高亮下标*/
-		$.extend({changeIndex:function(index){
-			$(indexList).removeClass(indexClassName);
-			$(indexList[index]).addClass(indexClassName);
-		}});
-		
+		$.extend({
+			changeIndex: function (index) {
+				$(indexList).removeClass(indexClassName);
+				$(indexList[index]).addClass(indexClassName);
+			},
+		});
 
 		/*向左切换图片*/
-		$.extend({leftChangeImg:function(){
-			action = false;
-			if (index==len) {
-				index = 0;
-				$(carousel).stop(true,true).css("left","0px");
-			}
-			index++;
-			$(carousel).stop(true,true).animate({
-				left : "-="+list.width()+"px"
-			},animateTime);
-			setTimeout(function(){
-				if (index==len) {
+		$.extend({
+			leftChangeImg: function () {
+				action = false;
+				if (index == len) {
 					index = 0;
-					$(carousel).stop(true,true).css("left","0px");
+					$(carousel).stop(true, true).css("left", "0px");
 				}
-				action = true;
-			},animateTime);
-			$.changeIndex(index-1);
-		}});
+				index++;
+				$(carousel)
+					.stop(true, true)
+					.animate(
+						{
+							left: "-=" + list.width() + "px",
+						},
+						animateTime
+					);
+				setTimeout(function () {
+					if (index == len) {
+						index = 0;
+						$(carousel).stop(true, true).css("left", "0px");
+					}
+					action = true;
+				}, animateTime);
+				$.changeIndex(index - 1);
+			},
+		});
 
 		/*向右切换图片*/
-		$.extend({rightChangeImg:function(){
-			action = false;
-			if (index==0) {
-				index = len;
-				$(carousel).stop(true,true).css("left","-"+left+"px");
-			}
-			index--;
-			var left = totalWidtn-list.width()*2;
-			$(carousel).stop(true,true).animate({
-				left : "+="+list.width()+"px"
-			},animateTime);
-			setTimeout(function(){
-				if (index==0) {
+		$.extend({
+			rightChangeImg: function () {
+				action = false;
+				if (index == 0) {
 					index = len;
-					$(carousel).stop(true,true).css("left","-"+left+"px");
+					$(carousel)
+						.stop(true, true)
+						.css("left", "-" + left + "px");
 				}
-				action = true;
-			},animateTime);
-			if (index == 0) {
-				$.changeIndex(len-1);
-			}else{
-				$.changeIndex(index-1);
-			}
-		}});
+				index--;
+				var left = totalWidtn - list.width() * 2;
+				$(carousel)
+					.stop(true, true)
+					.animate(
+						{
+							left: "+=" + list.width() + "px",
+						},
+						animateTime
+					);
+				setTimeout(function () {
+					if (index == 0) {
+						index = len;
+						$(carousel)
+							.stop(true, true)
+							.css("left", "-" + left + "px");
+					}
+					action = true;
+				}, animateTime);
+				if (index == 0) {
+					$.changeIndex(len - 1);
+				} else {
+					$.changeIndex(index - 1);
+				}
+			},
+		});
 
 		/*下翻点击处理*/
-		$(next).on("click",function(){
+		$(next).on("click", function () {
 			var nowLeft = Math.abs(parseInt($(carousel).css("left")));
-			var left = totalWidtn-list.width()*2;
+			var left = totalWidtn - list.width() * 2;
 			if (action) {
 				if (nowLeft == left) {
 					index = 0;
-					$(carousel).stop(true,true).css("left","0px");
+					$(carousel).stop(true, true).css("left", "0px");
 				}
 				$.leftChangeImg();
 			}
 		});
 
 		/*上翻点击处理*/
-		$(prev).on("click",function(){
+		$(prev).on("click", function () {
 			var nowLeft = Math.abs(parseInt($(carousel).css("left")));
-			var left = totalWidtn-list.width()*2;
+			var left = totalWidtn - list.width() * 2;
 			if (action) {
 				if (nowLeft == 0) {
 					index = len;
-					$(carousel).stop(true,true).css("left","-"+left+"px");
+					$(carousel)
+						.stop(true, true)
+						.css("left", "-" + left + "px");
 				}
 				$.rightChangeImg();
 			}
 		});
 
 		/*下标点击处理*/
-		indexList.on("click",function(){
-			var no = $(this).index()+1;
+		indexList.on("click", function () {
+			var no = $(this).index() + 1;
 			if (action) {
 				if (no > index) {
-					$.changeIndex(no-1);
+					$.changeIndex(no - 1);
 					action = false;
-					var left = (no - index)*list.width();
+					var left = (no - index) * list.width();
 					index = no;
-					$(carousel).stop(true,true).animate({
-						left : "-="+left+"px"
-					},animateTime);
-					setTimeout(function(){
+					$(carousel)
+						.stop(true, true)
+						.animate(
+							{
+								left: "-=" + left + "px",
+							},
+							animateTime
+						);
+					setTimeout(function () {
 						action = true;
-					},animateTime);
-				}else if (no < index) {
-					$.changeIndex(no-1);
+					}, animateTime);
+				} else if (no < index) {
+					$.changeIndex(no - 1);
 					action = false;
-					var left = (index - no)*list.width();
+					var left = (index - no) * list.width();
 					index = no;
-					$(carousel).stop(true,true).animate({
-						left : "+="+left+"px"
-					},animateTime);
-					setTimeout(function(){
+					$(carousel)
+						.stop(true, true)
+						.animate(
+							{
+								left: "+=" + left + "px",
+							},
+							animateTime
+						);
+					setTimeout(function () {
 						action = true;
-					},animateTime);
+					}, animateTime);
 				}
-	
 			}
 		});
-	}
-})(jQuery);
\ No newline at end of file
+	};
+})(jQuery);
diff --git a/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/js/carouselSite.js b/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/js/carouselSite.js
new file mode 100755
index 00000000..6bd95ac1
--- /dev/null
+++ b/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/static/project/smallProgram/js/carouselSite.js
@@ -0,0 +1,201 @@
+(function ($) {
+	$.fn.carouselSite = function (param) {
+		var carouselSite = param.carousel, //轮播框架
+			indexContainer = param.indexContainer, //下标框架
+			list = $(carouselSite).children("li"), //轮播内容
+			len = list.length, //轮播内容数量
+			prev = param.prev, //上翻按钮
+			next = param.next, //下翻按钮
+			timing = param.timing, //自动轮播间隔时间
+			animateTime = param.animateTime, //动画时间
+			autoPlay = param.autoPlay, //自动播放 true/false
+			timer, //定时器
+			index = 1, //索引值
+			indexListSite, //下标列表
+			indexClassName = "js_indexSite", //下标高亮类名
+			action = true, //开始滚动 true/false
+			totalWidtn = list.width() * (list.length + 2), //轮播框架总宽度
+			direction = param.direction; //滚动方向
+		/*初始化*/
+		for (var i = 1; i <= list.length; i++) {
+			$(indexContainer).append("<li>" + i + "</li>");
+		}
+		$(carouselSite)
+			.width(totalWidtn)
+			.append($(list[0]).clone())
+			.prepend($(list[list.length - 1]).clone())
+			.css("left", "-" + list.width() + "px");
+		list = $(carouselSite).children("li");
+		indexListSite = $(indexContainer).children("li");
+		$(indexListSite[index - 1]).addClass(indexClassName);
+
+		/*判断是否自动播放*/
+		if (autoPlay) {
+			startTiming();
+			$(carouselSite + "," + prev + "," + next + "," + indexContainer).hover(
+				function () {
+					window.clearInterval(timer);
+				},
+				function () {
+					startTiming();
+				}
+			);
+		}
+
+		/*计时方法*/
+		function startTiming() {
+			/*判断方向*/
+			switch (direction) {
+				case "right":
+					timer = window.setInterval("$.rightChangeImg();", timing);
+					break;
+				case "left":
+					timer = window.setInterval("$.leftChangeImg();", timing);
+					break;
+				default:
+					timer = window.setInterval("$.leftChangeImg();", timing);
+			}
+		}
+
+		/*切换高亮下标*/
+		$.extend({
+			changeIndexSite: function (index) {
+				$(indexListSite).removeClass(indexClassName);
+				$(indexListSite[index]).addClass(indexClassName);
+			},
+		});
+
+		/*向左切换图片*/
+		$.extend({
+			leftChangeImg: function () {
+				action = false;
+				if (index == len) {
+					index = 0;
+					$(carouselSite).stop(true, true).css("left", "0px");
+				}
+				index++;
+				$(carouselSite)
+					.stop(true, true)
+					.animate(
+						{
+							left: "-=" + list.width() + "px",
+						},
+						animateTime
+					);
+				setTimeout(function () {
+					if (index == len) {
+						index = 0;
+						$(carouselSite).stop(true, true).css("left", "0px");
+					}
+					action = true;
+				}, animateTime);
+				$.changeIndexSite(index - 1);
+			},
+		});
+
+		/*向右切换图片*/
+		$.extend({
+			rightChangeImg: function () {
+				action = false;
+				if (index == 0) {
+					index = len;
+					$(carouselSite)
+						.stop(true, true)
+						.css("left", "-" + left + "px");
+				}
+				index--;
+				var left = totalWidtn - list.width() * 2;
+				$(carouselSite)
+					.stop(true, true)
+					.animate(
+						{
+							left: "+=" + list.width() + "px",
+						},
+						animateTime
+					);
+				setTimeout(function () {
+					if (index == 0) {
+						index = len;
+						$(carouselSite)
+							.stop(true, true)
+							.css("left", "-" + left + "px");
+					}
+					action = true;
+				}, animateTime);
+				if (index == 0) {
+					$.changeIndexSite(len - 1);
+				} else {
+					$.changeIndexSite(index - 1);
+				}
+			},
+		});
+
+		/*下翻点击处理*/
+		$(next).on("click", function () {
+			var nowLeft = Math.abs(parseInt($(carouselSite).css("left")));
+			var left = totalWidtn - list.width() * 2;
+			if (action) {
+				if (nowLeft == left) {
+					index = 0;
+					$(carouselSite).stop(true, true).css("left", "0px");
+				}
+				$.leftChangeImg();
+			}
+		});
+
+		/*上翻点击处理*/
+		$(prev).on("click", function () {
+			var nowLeft = Math.abs(parseInt($(carouselSite).css("left")));
+			var left = totalWidtn - list.width() * 2;
+			if (action) {
+				if (nowLeft == 0) {
+					index = len;
+					$(carouselSite)
+						.stop(true, true)
+						.css("left", "-" + left + "px");
+				}
+				$.rightChangeImg();
+			}
+		});
+
+		/*下标点击处理*/
+		indexListSite.on("click", function () {
+			var no = $(this).index() + 1;
+			if (action) {
+				if (no > index) {
+					$.changeIndexSite(no - 1);
+					action = false;
+					var left = (no - index) * list.width();
+					index = no;
+					$(carouselSite)
+						.stop(true, true)
+						.animate(
+							{
+								left: "-=" + left + "px",
+							},
+							animateTime
+						);
+					setTimeout(function () {
+						action = true;
+					}, animateTime);
+				} else if (no < index) {
+					$.changeIndexSite(no - 1);
+					action = false;
+					var left = (index - no) * list.width();
+					index = no;
+					$(carouselSite)
+						.stop(true, true)
+						.animate(
+							{
+								left: "+=" + left + "px",
+							},
+							animateTime
+						);
+					setTimeout(function () {
+						action = true;
+					}, animateTime);
+				}
+			}
+		});
+	};
+})(jQuery);
diff --git a/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/templates/project/smallProgram/image/settings.html b/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/templates/project/smallProgram/image/settings.html
index 8b14deb9..7bd550b8 100644
--- a/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/templates/project/smallProgram/image/settings.html
+++ b/lib/EmergencyService/zdxtEmergencyBootStart/src/main/resources/templates/project/smallProgram/image/settings.html
@@ -3,6 +3,7 @@
 <head>
 	<th:block th:include="zdxtInclude :: header('自定义图片')"/>
 	<link rel="stylesheet" href="/project/smallProgram/css/carousel.css" type="text/css"/>
+	<link rel="stylesheet" href="/project/smallProgram/css/carouselSite.css" type="text/css"/>
 	<style>
 		.page-row {
 			display: flex;
@@ -31,7 +32,7 @@
 			<div id="tab-1" class="tab-pane active">
 				<div class="page-row" style="height: 756px;">
 					<div style="height: 100%; width: 60%;">
-						<form class="form-horizontal m" id="form-home-add">
+						<form class="form-horizontal m">
 							<div class="form-group">
 								<label class="col-sm-2 control-label is-required">顶部图：</label>
 								<div class="col-sm-5">
@@ -150,31 +151,31 @@
 					</div>
 					<div style="height: 100%; width: 40%;">
 						<div class="box" style="width: 500px; height: 100px;">
-							<img id="home-top" width="100%" height="100%" />
+							<img id="home-top" name="home-top" width="100%" height="100%" />
 						</div>
 						<div class="box" style="width: 500px; height: 150px;">
 <!--							<img id="home-banner" width="100%" height="100%" />-->
 							<div class="carousel-content">
 							<ul class="carousel">
-								<li><img id="home-banner-1" width="100%" height="100%"></li>
-								<li><img id="home-banner-2" width="100%" height="100%"></li>
-								<li><img id="home-banner-3" width="100%" height="100%"></li>
-								<li><img id="home-banner-4" width="100%" height="100%"></li>
+								<li><img id="home-banner-1" name="home-banner-1" width="100%" height="100%"></li>
+								<li><img id="home-banner-2" name="home-banner-2" width="100%" height="100%"></li>
+								<li><img id="home-banner-3" name="home-banner-3" width="100%" height="100%"></li>
+								<li><img id="home-banner-4" name="home-banner-4" width="100%" height="100%"></li>
 							</ul>
 							<ul class="img-index"></ul>
 							</div>
 						</div>
 						<div class="page-row" style="width: 500px; height: 150px;">
 							<div class="box" style="width: 50%; height: 250px;">
-								<img id="home-bottom-left" width="100%" height="100%" />
+								<img id="home-bottom-left" name="home-bottom-left" width="100%" height="100%" />
 							</div>
 							<div style="width: 50%; height: 250px;">
 								<div style="padding-left: 5px;">
 									<div class="box" style="width: 100%; height: 250px;">
-										<img id="home-bottom-right-top" width="100%" height="100%" />
+										<img id="home-bottom-right-top" name="home-bottom-right-top" width="100%" height="100%" />
 									</div>
 <!--									<div class="box" style="width: 100%; height: 115px;">-->
-<!--										<img id="home-bottom-right-bottom" width="100%" height="100%" />-->
+<!--										<img id="home-bottom-right-bottom" name="home-bottom-right-bottom" width="100%" height="100%" />-->
 <!--									</div>-->
 								</div>
 							</div>
@@ -185,30 +186,38 @@
 			<div id="tab-2" class="tab-pane">
 				<div class="page-row" style="height: 756px;">
 					<div style="height: 100%; width: 60%;">
-						<form class="form-horizontal m" id="form-home-add">
+						<form class="form-horizontal m">
 							<div class="form-group">
 								<label class="col-sm-2 control-label is-required">顶部图：</label>
 								<div class="col-sm-5">
-									<input id="file-site-top" onchange="showImg(this,'site-top')" name="file" type="file" multiple>
+									<input id="file-home-banner1" onchange="showImg(this,'site-banner-1')" name="file" type="file" placeholder="图1" multiple>
 								</div>
 								<div class="col-sm-5">
-									<input class="form-control" type="text" name="title" id="title" placeholder="场景">
+									<input id="file-home-banner2" onchange="showImg(this,'site-banner-2')" name="file" type="file" multiple>
 								</div>
 							</div>
 							<div class="form-group">
-								<label class="col-sm-2 control-label is-required">功能设置：</label>
+								<div class="col-sm-2"></div>
 								<div class="col-sm-5">
-									<input class="form-control" type="text" name="title" id="title" placeholder="名称设置">
+									<input id="file-home-banner3" onchange="showImg(this,'site-banner-3')" name="file" type="file" multiple>
 								</div>
 								<div class="col-sm-5">
-									<input class="form-control" type="text" name="title" id="title" placeholder="图片设置">
+									<input id="file-home-banner4" onchange="showImg(this,'site-banner-4')" name="file" type="file" multiple>
 								</div>
 							</div>
 						</form>
 					</div>
 					<div style="height: 100%; width: 40%;">
-						<div class="box" style="width: 500px; height: 100px;">
-							<img id="site-top" width="100%" height="100%" />
+						<div class="box" style="width: 500px; height: 150px;">
+							<div class="carousel-contentSite">
+								<ul class="carouselSite">
+									<li><img id="site-banner-1" name="site-banner-1" width="100%" height="100%"></li>
+									<li><img id="site-banner-2" name="site-banner-2" width="100%" height="100%"></li>
+									<li><img id="site-banner-3" name="site-banner-3" width="100%" height="100%"></li>
+									<li><img id="site-banner-4" name="site-banner-4" width="100%" height="100%"></li>
+								</ul>
+								<ul class="img-indexSite"></ul>
+							</div>
 						</div>
 					</div>
 				</div>
@@ -228,6 +237,7 @@
 </div>
 <th:block th:include="zdxtInclude :: footer"/>
 <script src="/project/smallProgram/js/carousel.js" type="text/javascript"></script>
+<script src="/project/smallProgram/js/carouselSite.js" type="text/javascript"></script>
 <script th:inline="javascript">
 	var editFlag = [[${@permission.hasPermi('custom:image:edit')}]];
 	var removeFlag = [[${@permission.hasPermi('custom:image:remove')}]];
@@ -236,7 +246,8 @@
 
 	$(function () {
 		queryList();
-		bannerPlay();
+		homeBannerPlay();
+		siteBannerPlay();
 	});
 
 	/** 获取列表 */
@@ -263,20 +274,33 @@
 			data: {"key": obj.guid},
 			dataType: 'json',
 			success: function (data) {
-				console.log(data.data.filePreview.fileList[0]);
-				$('#' + obj.page +'-'+ obj.position).attr("src", data.data.filePreview.fileList[0]);
+				// $('#' + obj.page +'-'+ obj.position).attr("src", data.data.filePreview.fileList[0]);
+				$('[name="' + obj.page +'-'+ obj.position +'"]').attr("src", data.data.filePreview.fileList[0]);
+
 			}
 		});
 	}
 
 	/** 轮播图 */
-	function bannerPlay() {
+	function homeBannerPlay() {
 		$(".carousel-content").carousel({
 			carousel: ".carousel", //轮播图容器
 			indexContainer: ".img-index", //下标容器
 			timing: 3000, //自动播放间隔
 			animateTime: 700, //动画时间
-			autoPlay: true, //是否自动播放 true/false
+			autoPlay: false, //是否自动播放 true/false
+			direction: "left", //滚动方向 right/left
+		});
+	}
+
+	/** 轮播图 */
+	function siteBannerPlay() {
+		$(".carousel-contentSite").carouselSite({
+			carousel: ".carouselSite", //轮播图容器
+			indexContainer: ".img-indexSite", //下标容器
+			timing: 3000, //自动播放间隔
+			animateTime: 700, //动画时间
+			autoPlay: false, //是否自动播放 true/false
 			direction: "left", //滚动方向 right/left
 		});
 	}
@@ -285,7 +309,6 @@
 	function showImg(fileObj,imgId) {
 		var file=fileObj.files[0];
 		var byteSize = file.size / 1024;
-		console.log(byteSize)
 		if (byteSize <= 70000) {
 			var r = new FileReader();
 			r.readAsDataURL(file);
@@ -295,7 +318,8 @@
 				img.src = txt;
 				img.onload = function(){
 					if(img.width <= 50000 && img.height <= 50000){
-						$('#' + imgId).attr("src", txt);
+						// $('#' + imgId).attr("src", txt);
+						$('[name="' + imgId +'"]').attr("src", txt);
 						uploadFiles(file, imgId);
 					}else{
 						$.modal.msgError("尺寸不对 " + img.width + "*" + img.height);