Skip to content

任超 / js.portalStaticPage

Go to a project
Toggle navigation
Toggle navigation pinning
4fe05c87 by 任超
Options

style:办事指南

1 parent d0dfb127
Inline Side-by-side
Showing 7 changed files with 92 additions and 113 deletions
......@@ -188,3 +188,18 @@
color: #006CFF!important;
border-color: #006CFF!important;
}
.itemButton {
display: inline-block;
float: right;
width: 170px;
}
.itemButton a {
display: inline-block;
}
.itemButton a:nth-child(1) {
position: relative;
left: 15px;
}
.itemButton button {
display: inline-block;
}
\ No newline at end of file
......
......@@ -6,43 +6,27 @@ $(function () {
var element = layui.element;
//监听Tab切换，以改变地址hash值
element.on('tab(navtab)', function () {
if (this.getAttribute('lay-id') == 1) {
$("body,html").animate({ scrollTop: $(".tudi").offset().top });
$(".online_business h2").removeClass('titleActive')
$(".tudi .online_business h2").addClass('titleActive')
} else if (this.getAttribute('lay-id') == 2) {
$("body,html").animate({ scrollTop: $(".jianzhu").offset().top });
$(".online_business h2").removeClass('titleActive')
$(".jianzhu .online_business h2").addClass('titleActive')
} else if (this.getAttribute('lay-id') == 3) {
$("body,html").animate({ scrollTop: $(".linmu").offset().top });
$(".online_business h2").removeClass('titleActive')
$(".linmu .online_business h2").addClass('titleActive')
} else if (this.getAttribute('lay-id') == 4) {
$("body,html").animate({ scrollTop: $(".qita").offset().top });
$(".online_business h2").removeClass('titleActive')
$(".qita .online_business h2").addClass('titleActive')
} else {
let idUum = undefined
idUum = this.getAttribute('lay-id')-1
$(".layui-tab-content .online_business h2").removeClass('titleActive')
if (this.getAttribute('lay-id')==0) {
$("body,html").animate({ scrollTop: 0 });
$(".online_business h2").removeClass('titleActive')
} else {
$("body,html").animate({ scrollTop: $(".layui-tab-content").eq(idUum).offset().top });
$("#tabContentListOnline .layui-tab-content").eq(idUum).find('.online_business h2').addClass('titleActive')
}
});
element.on('tab(navtab1)', function () {
if (this.getAttribute('lay-id') == 1) {
$("body,html").animate({ scrollTop: $(".tudi1").offset().top });
$(".navtab1 h2").removeClass('titleActive')
$(".tudi1 .navtab1 h2").addClass('titleActive')
} else if (this.getAttribute('lay-id') == 2) {
$("body,html").animate({ scrollTop: $(".jianzhu1").offset().top });
$(".navtab1 h2").removeClass('titleActive')
$(".jianzhu1 .navtab1 h2").addClass('titleActive')
} else if (this.getAttribute('lay-id') == 3) {
$("body,html").animate({ scrollTop: $(".linmu1").offset().top });
$(".navtab1 h2").removeClass('titleActive')
$(".linmu1 .navtab1 h2").addClass('titleActive')
} else {
let idUum1 = undefined
idUum1 = this.getAttribute('lay-id')-1
$(".layui-tab-content .online_business h2").removeClass('titleActive')
if (this.getAttribute('lay-id')==0) {
$("body,html").animate({ scrollTop: 0 });
$(".navtab1 h2").removeClass('titleActive')
$(".online_business h2").removeClass('titleActive')
} else {
$("body,html").animate({ scrollTop: $("#tabContentList .layui-tab-content").eq(idUum1).offset().top });
$("#tabContentList .layui-tab-content").eq(idUum1).find('.online_business h2').addClass('titleActive')
}
});
});
......@@ -74,7 +58,6 @@ layui.config({
$(document).on("click", ".area_list li", function (e) {
$(".area_list li").removeClass("active2")
$(this).addClass("active2");
console.log(666, $(this).attr("data-id"))
_getGuideBusinessInWssq($(this).attr("data-id"))
_getGuideBusinessInReserve($(this).attr("data-id"))
})
......@@ -91,6 +74,7 @@ layui.use(['form', 'common'], function () {
});
// 初始化数据
function _initData() {
var regionId = undefined;
var area_list = $(".area_list");
area_list.empty();
var li
......@@ -103,10 +87,16 @@ function _initData() {
if (result.code == 200 && result.data != null) {
let data = result.data[0].children[0].children
for (var i = 0; i < data.length; i++) {
if(i==0) {
li = '<li data-id="' + data[i].id + '" class="active2">' + data[i].name + '</li>';
}else {
li = '<li data-id="' + data[i].id + '">' + data[i].name + '</li>';
}
area_list.append(li);
}
regionId = data[0].id
_getGuideBusinessInWssq(regionId)
_getGuideBusinessInReserve(regionId)
}
}
})
......
......@@ -13,7 +13,7 @@ function SetServicesPath() {
//设置全局參數
var portal =
{
'api_url': "http://192.168.2.59:8000", //属性名用引号括起来，属性间由逗号隔开
'api_url': "http://192.168.2.108:8000", //属性名用引号括起来，属性间由逗号隔开
'name': 'myName',
"rootPath": GetRootPath()
};
......
$(function () {
//元素
var oFileInput = $("#fileInput"); //选择文件按钮
var sizeObj = []; //存放每个文件大小的数组，用来比较去重
//点击选择文件按钮选文件
function handleUpdate() {
$(document).on("click", ".fileListName .fileName .operation", function (e) {
var index = $(this).parent().index();
flieList.splice(index, 1)
sizeObj.splice(index, 1)
if(flieList.length==1) {
$(this).parent().parent().parent('.fileSpan').find('.update').attr('src','../../staticImages/update.png');
$(this).parent().parent().parent('.fileSpan').find('.updatetext').text('点击文件上传')
}
$(this).parent().remove()
})
})
// 存放每个文件大小的数组，用来比较去重
var sizeObj = [];
function handleUpdate(e,$input) {
if(flieList.length>=2) {
layer.msg('已经完成上传最大限度', { icon: 5 });
return false
}else {
analysisList(this.files, $("#fileInput"));
}
let file = [];
file.push(e.files[0])
analysisList(file, document.getElementById("#"+$input), $input);
}
}
//解析列表函数
function analysisList(obj, inputName) {
function analysisList(obj, inputName, $input) {
//如果没有文件
if (obj.length < 1) {
return false;
......@@ -42,15 +55,17 @@ $(function () {
//把这个文件的大小放进数组中
sizeObj.push(size);
}
createList() //生成列表
document.querySelector('#fileInput').value = null
};
//生成列表
function createList() {
createList(); //生成列表
document.querySelector("#"+$input).value = null
};
//生成列表
function createList() {
$('.fileListName').empty()
console.log(flieList, 98898989)
for (var i = 0; i < flieList.length; i++) {
var fileData = flieList[i];
name = fileData[1]
var name = fileData[1]
$('.fileListName').append(
'<li class="fileName">'+
'<span title="' + name + '">' + name + '</span>' +
......@@ -58,21 +73,4 @@ $(function () {
'</li>'
);
}
}
$(document).on("click", ".fileListName .fileName .operation", function (e) {
var index = $(this).parent().index();
flieList.splice(index, 1)
sizeObj.splice(index, 1)
if(flieList.length==1) {
$(this).parent().parent().parent('.fileSpan').find('.update').attr('src','../../staticImages/update.png');
$(this).parent().parent().parent('.fileSpan').find('.updatetext').text('点击文件上传')
}
$(this).parent().remove()
})
})
//通过文件名，返回文件的后缀名
function fileType(name) {
var nameArr = name.split(".");
return nameArr[nameArr.length - 1].toLowerCase();
}
\ No newline at end of file
......
......@@ -2,48 +2,13 @@ $(function () {
//元素
var oFileInput1 = $("#fileInput1"); //选择文件按钮
var sizeObj1 = []; //存放每个文件大小的数组，用来比较去重
// var oFileSpan = $("#fileSpan");
// //拖拽外部文件，进入目标元素触发
// oFileSpan.on("dragenter", function () {
// $(this).find('.file_name').css("background", "#ccc");
// $(this).find('.file_name').empty();
// $(this).find('.file_name').append(
// '<p style="line-height:240px">可以方鼠标了</p>'
// )
// });
// //拖拽外部文件，进入目标、离开目标之间，连续触发
// oFileSpan.on("dragover", function () {
// return false;
// });
// //拖拽外部文件，离开目标元素触发
// oFileSpan.on("dragleave", function () {
// $(this).find('.file_name').empty();
// $(this).find('.file_name').css("background", "#ffff");
// $(this).find('.file_name').append(
// '<img class="update" src="../staticImages/update.png">'+
// '<p class="updatetext">点击或拖拽文件上传</p>'+
// '<div class="fileListName"></div>'
// )
// });
// //拖拽外部文件，在目标元素上释放鼠标触发
// oFileSpan.on("drop", function (ev) {
// var fs = ev.originalEvent.dataTransfer.files;
// $(this).find('.file_name').empty();
// $(this).find('.file_name').css("background", "#ffff");
// $(this).find('.file_name').append(
// '<img class="update" src="../staticImages/update.png">'+
// '<p class="updatetext">点击或拖拽文件上传</p>'+
// '<div class="fileListName"></div>'
// )
// analysisList(fs); //解析列表函数
// return false;
// });
//点击选择文件按钮选文件
oFileInput1.on("change", function () {
if(flieList1.length>=2) {
layer.msg('已经完成上传最大限度', { icon: 5 });
return false
}else {
console.log(this.files)
analysisList(this.files, oFileInput1);
}
})
......@@ -53,6 +18,7 @@ $(function () {
if (obj.length < 1) {
return false;
}
console.log(999999999, obj)
for (var i = 0; i < obj.length; i++) {
var fileObj = obj[i]; //单个文件
var name = fileObj.name; //文件名
......@@ -72,7 +38,7 @@ $(function () {
var itemArr = [fileObj, name, size]; //文件，文件名，文件大小，文件类型
flieList1.push(itemArr);
if (flieList1.length==2){
inputName.parent().find('.update').attr('src','../staticImages/Yes.png');
inputName.parent().find('.update').attr('src','../../staticImages/Yes.png');
inputName.parent().find('.updatetext').text('')
}
//把这个文件的大小放进数组中
......@@ -90,7 +56,7 @@ $(function () {
$('.fileListName1').append(
'<li class="fileName">'+
'<span title="' + name + '">' + name + '</span>' +
'<img class="operation" src="../staticImages/chacha.png">'+
'<img class="operation" src="../../staticImages/chacha.png">'+
'</li>'
);
}
......@@ -100,7 +66,7 @@ $(function () {
flieList1.splice(index, 1)
sizeObj1.splice(index, 1)
if(flieList1.length==1) {
$(this).parent().parent().parent('.fileSpan').find('.update').attr('src','../staticImages/update.png');
$(this).parent().parent().parent('.fileSpan').find('.update').attr('src','../../staticImages/update.png');
$(this).parent().parent().parent('.fileSpan').find('.updatetext').text('点击文件上传')
}
$(this).parent().remove()
......
......@@ -77,7 +77,7 @@
<!-- 网上申请 -->
<script id="businessGuide" type="text/html">
{{# layui.each(d.list, function(index, item){ }}
<div class="layui-tab-content tudi1" style="padding:0">
<div class="layui-tab-content" style="padding:0">
<div class="online_business navtab1">
<h2>
<svg class="icon svg-icon" aria-hidden="true">
......@@ -89,11 +89,16 @@
<ul class="online_list">
{{# for(var i = 0; i < item.bsznListVOS.length; i++){ }}
<li>
<a href='./businessGuideDeatil.html?id="{{item.bsznListVOS[i].bsmBszn}}"' target="_blank">
<span>{{item.bsznListVOS[i].headline}}</span>
<div class="itemButton">
<a href='./businessGuideDeatil.html?id="{{item.bsznListVOS[i].bsmBszn}}"' target="_blank">
<button type="button"
class="layui-btn layui-btn-sm layui-btn-normal">在线办理</button>
class="layui-btn layui-btn-sm">查看详情</button>
</a>
<a>
<button type="button" class="layui-btn layui-btn-sm layui-btn-normal">在线办理</button>
</a>
</div>
</li>
{{# } }}
</ul>
......@@ -101,10 +106,10 @@
{{# }); }}
</script>
<!-- 在线预约 -->
<!-- 在线预约 -->
<script id="onlineBooking" type="text/html">
{{# layui.each(d.onlineList, function(index, item){ }}
<div class="layui-tab-content tudi1" style="padding:0">
<div class="layui-tab-content" style="padding:0">
<div class="online_business navtab1">
<h2>
<svg class="icon svg-icon" aria-hidden="true">
......@@ -116,15 +121,20 @@
<ul class="online_list">
{{# for(var i = 0; i < item.bsznListVOS.length; i++){ }}
<li>
<a href='./businessGuideDeatil.html?id={{item.bsznListVOS[i].bsmBszn}}'>
<span>{{item.bsznListVOS[i].headline}}</span>
<button type="button"
class="layui-btn layui-btn-sm layui-btn-normal">在线办理</button>
<div class="itemButton">
<a href='./businessGuideDeatil.html?id={{item.bsznListVOS[i].bsmBszn}}' target="_blank">
<button type="button" class="layui-btn layui-btn-sm">查看详情</button>
</a>
<a>
<button type="button" class="layui-btn layui-btn-sm layui-btn-normal">在线办理</button>
</a>
</div>
</li>
{{# } }}
</ul>
</div>
{{# }); }}
</script>
</html>
\ No newline at end of file
......
......@@ -116,7 +116,7 @@
<div class="img_update">
<div class="fileBox">
<div class="fileSpan vm">
<input type="file" multiple id="fileInput" onclick="" onchange="imgUpdate"/>
<input type="file" multiple id="fileInput" onclick="" onchange="handleUpdate(this,'fileInput')"/>
<div class="file_name">
<img class="update" src="../../staticImages/update.png">
<p class="updatetext">点击文件上传</p>
......