346 lines
13 KiB
HTML
346 lines
13 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||
<meta
|
||
name="viewport"
|
||
content="width=device-width, initial-scale=1.0,maximum-scale=1.0,user-scalable=no"
|
||
/>
|
||
<title>国防宣教</title>
|
||
<link rel="stylesheet" href="./css/index.css" />
|
||
<link rel="stylesheet" href="./css/swiper-3.4.2.min.css" />
|
||
<link
|
||
rel="stylesheet"
|
||
href="https://a.amap.com/jsapi_demos/static/demo-center/css/demo-center.css"
|
||
/>
|
||
<script src="./js/jquery.min.js"></script>
|
||
<script src="./js/api.js"></script>
|
||
<script src="./js/moment.js"></script>
|
||
<script src="./js/swiper-3.4.2.min.js"></script>
|
||
<script
|
||
type="text/javascript"
|
||
src="https://webapi.amap.com/maps?v=2.0&key=307b14b003f9288ba0cad406d5e1238e"
|
||
></script>
|
||
<script>
|
||
// var map = new AMap.Map("container", {
|
||
// zoom: 11,
|
||
// center: [107.535867, 31.228318],
|
||
// resizeEnable: true,
|
||
// });
|
||
sessionStorage.setItem("local", "107.487141,31.219671");
|
||
AMap.plugin("AMap.Geolocation", function () {
|
||
var geolocation = new AMap.Geolocation({
|
||
enableHighAccuracy: true, //是否使用高精度定位,默认:true
|
||
timeout: 10000, //超过10秒后停止定位,默认:5s
|
||
position: "RB", //定位按钮的停靠位置
|
||
offset: [10, 20], //定位按钮与设置的停靠位置的偏移量,默认:[10, 20]
|
||
zoomToAccuracy: true, //定位成功后是否自动调整地图视野到定位点
|
||
});
|
||
// map.addControl(geolocation);
|
||
geolocation.getCurrentPosition(function (status, result) {
|
||
console.log("##", status, result);
|
||
if (status == "complete") {
|
||
// console.log('cmp');
|
||
onComplete(result);
|
||
} else {
|
||
// geolocation.getCityInfo((stat,res)=>{
|
||
// if(stat=="complete"){
|
||
// onComplete(result);
|
||
// }
|
||
// })
|
||
// console.log('###',result)
|
||
onError(result);
|
||
}
|
||
});
|
||
});
|
||
// AMap.plugin("AMap.CitySearch", function () {
|
||
// var citySearch = new AMap.CitySearch();
|
||
// citySearch.getLocalCity(function (status, result) {
|
||
// if (status === "complete" && result.info === "OK") {
|
||
// // 查询成功,result即为当前所在城市信息
|
||
// }
|
||
// });
|
||
// });
|
||
|
||
function onComplete(data) {
|
||
sessionStorage.setItem("local", data.position);
|
||
}
|
||
function onError(data) {
|
||
// sessionStorage.setItem("local", "107.487141,31.219671");
|
||
}
|
||
|
||
// var dw = window.innerWidth;
|
||
// var dh = window.innerHeight;
|
||
var code;
|
||
var mp3;
|
||
var zzggListQuery = {
|
||
current: 1,
|
||
size: 10,
|
||
};
|
||
var zzggTotal = 0;
|
||
$(function () {
|
||
code = getUrlParam("code");
|
||
if (isDebug) {
|
||
$("#debug").show();
|
||
}
|
||
if (!sessionStorage.getItem("token")) {
|
||
login(code);
|
||
}
|
||
newsList();
|
||
getBanner();
|
||
// scrollPageInit()
|
||
init();
|
||
});
|
||
|
||
function getUrlParam(name) {
|
||
var searchParams = new URLSearchParams(window.location.search);
|
||
return searchParams.get(name);
|
||
}
|
||
function handleTabClick(el, name) {
|
||
// if (name === "qkcz") {
|
||
// if (JSON.parse(sessionStorage.getItem("info")).type === "10") {
|
||
// error();
|
||
// } else {
|
||
window.location.href = `${name}.html`;
|
||
// }
|
||
// } else {
|
||
// window.location.href = `${name}.html`;
|
||
// }
|
||
}
|
||
function hideAllTabItem() {
|
||
$(".gfxj").hide();
|
||
$(".gsgg").hide();
|
||
$(".jjyb").hide();
|
||
$(".qkcz").hide();
|
||
}
|
||
function openDialog(title) {
|
||
$(".dialog").css("display", "flex");
|
||
let map = {
|
||
yxjb: "预先警报",
|
||
kxjb: "空袭警报",
|
||
jcjb: "解除警报",
|
||
fzjb: "防灾警报",
|
||
};
|
||
let audioMap = {
|
||
fzjb: "fz",
|
||
yxjb: "yx",
|
||
kxjb: "kx",
|
||
jcjb: "jc",
|
||
};
|
||
let contentMap = {
|
||
yxjb: "预先告知,敌人即将实施空袭,要求做好防空袭的准备。规定音响信号:鸣36秒,停24秒,重复3遍为一个周期,时间为3分钟。听到预先警报后,应立即拉断电闸,关闭燃气,熄灭炉火,携带好个人防护器材和必需的生活用品,按定人、定位、定路线的要求,迅速有序地进入工程或指定掩蔽地域。",
|
||
kxjb: "表明敌空袭兵器已临近,空袭即刻或已经开始,警告迅速掩蔽。规定音响信号:鸣6秒,停6秒,反复15遍为一个周期,时间3分钟。听到空袭警报时,应就近进入人防工程掩蔽。如情况紧急无法进入人防工程时,要利用地形地物就近掩蔽。",
|
||
jcjb: "表明该阶段空袭已结束,空袭警报解除。规定音响信号,连续长鸣一长声,时间为3分钟。进入安全地带。听到解除警报并不意味着危险不存在,还可能会出现房屋倒塌和大火,附近可能沾染放射性物质或染毒、染菌。因此,需要保持清醒的头脑,清点并携带好自己的物品,有组织地撤出危险区域,进入安全地带。恢复生产和生活秩序。由于空袭打乱了社会和家庭的生产、生活秩序,为此各类人员应遵守战时的有关规定,协助有关部门尽快恢复生产和生活秩序,将损失降低到最小。",
|
||
fzjb: "鸣15秒,停10秒,再鸣5秒,停10秒,反复3遍,时间为2分钟。可简单记为:“三长三短。”灾情警报是平时发生重大自然灾情和突发事故时发放的警报。主要向人们通报有重大灾情的发生,要立即实施应急的救援和采取防护措施。",
|
||
};
|
||
let temp = audioMap[title];
|
||
mp3 = $("#audio")[0];
|
||
$(mp3).attr(
|
||
"src",
|
||
"https://ykdz.yundazhou.com:8000/file/jbmp3/jbmp3" + temp + ".mp3"
|
||
);
|
||
mp3.play();
|
||
$(".dialog .title").text(map[title]);
|
||
$(".dialog .content").text(contentMap[title]);
|
||
|
||
$(".dialog .icon_alert").attr("class", `icon_alert ${title}`);
|
||
// icon_alert yxjb
|
||
}
|
||
function closeDialog() {
|
||
$(".dialog").hide();
|
||
pausePlay();
|
||
}
|
||
function pausePlay() {
|
||
mp3.pause();
|
||
}
|
||
</script>
|
||
</head>
|
||
<body>
|
||
<audio
|
||
id="audio"
|
||
src="https://ykdz.yundazhou.com:8000/file/jbmp3/jbmp3fz.mp3"
|
||
></audio>
|
||
<div class="dwdh"></div>
|
||
<div id="debug" style="display: none">
|
||
<button onclick="debugLogin()">登陆</button>
|
||
<button onclick="getInfo()">Info</button>
|
||
</div>
|
||
<!-- <div class="banner"></div> -->
|
||
|
||
<div class="swiper-container">
|
||
<div class="swiper-wrapper">
|
||
<!-- <div class="swiper-slide">Slide 1</div>
|
||
<div class="swiper-slide">Slide 2</div>
|
||
<div class="swiper-slide">Slide 3</div> -->
|
||
</div>
|
||
<!-- 如果需要分页器 -->
|
||
<div class="swiper-pagination"></div>
|
||
|
||
<!-- 如果需要导航按钮 -->
|
||
<!-- <div class="swiper-button-prev"></div> -->
|
||
<!-- <div class="swiper-button-next"></div> -->
|
||
|
||
<!-- 如果需要滚动条 -->
|
||
<!-- <div class="swiper-scrollbar"></div> -->
|
||
</div>
|
||
<script>
|
||
getBanner();
|
||
</script>
|
||
<div class="tabs">
|
||
<div class="tab active" onclick="handleTabClick(this,'index')">
|
||
国防宣教
|
||
</div>
|
||
<div class="tab" onclick="handleTabClick(this,'gsgg')">公示公告</div>
|
||
<div class="tab" onclick="handleTabClick(this,'jjyb')">紧急掩蔽</div>
|
||
<div class="tab" onclick="handleTabClick(this,'qkcz')">情况处置</div>
|
||
</div>
|
||
<div class="body">
|
||
<!-- 国防宣教 -->
|
||
<div class="gfxj">
|
||
<div class="layer">
|
||
<div class="title"><i class="line"></i>警报试听</div>
|
||
<div class="navList">
|
||
<div class="navItem">
|
||
<div class="navBg fk">防空</div>
|
||
<div class="menuList">
|
||
<div class="menuItem" onclick="openDialog('yxjb')">
|
||
<div class="icon yxjb"></div>
|
||
<div>预先警报</div>
|
||
</div>
|
||
<div class="menuItem" onclick="openDialog('kxjb')">
|
||
<div class="icon kxjb"></div>
|
||
<div>空袭警报</div>
|
||
</div>
|
||
<div class="menuItem" onclick="openDialog('jcjb')">
|
||
<div class="icon jcjb"></div>
|
||
<div>解除警报</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="navItem">
|
||
<div class="navBg fz">防灾</div>
|
||
<div class="menuList">
|
||
<div class="menuItem" onclick="openDialog('fzjb')">
|
||
<div class="icon fzjb"></div>
|
||
<div>防灾警报</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="layer zcgg">
|
||
<div class="title"><i class="line"></i>政策公告</div>
|
||
<div class="newslist zcggList" id="zcggList">
|
||
<!-- <div class="newsItem">
|
||
<div class="newsInfo">
|
||
<div class="newsTitle">海浪橙色警报:东海东部将...</div>
|
||
<div class="newsContent">国家海洋预报台8月28日8时发...</div>
|
||
<div class="newsDetail">
|
||
<span class="newsAuthor">李强</span
|
||
><span class="newsDate">2024-08-22</span>
|
||
</div>
|
||
</div>
|
||
<img src="" alt="" />
|
||
</div>
|
||
<div class="newsItem">
|
||
<div class="newsInfo">
|
||
<div class="newsTitle">海浪橙色警报:东海东部将...</div>
|
||
<div class="newsContent">国家海洋预报台8月28日8时发...</div>
|
||
<div class="newsDetail">
|
||
<span class="newsAuthor">李强</span
|
||
><span class="newsDate">2024-08-22</span>
|
||
</div>
|
||
</div>
|
||
<img src="" alt="" />
|
||
</div> -->
|
||
</div>
|
||
|
||
<!-- <div class="loader-box">
|
||
<div id="loader"></div>
|
||
<div id="nothing" class="hidden">没有更多了~</div>
|
||
</div> -->
|
||
</div>
|
||
</div>
|
||
<!-- 公示公告 -->
|
||
<div class="layer gsgg" style="display: none">
|
||
<div class="newslist gsggList">
|
||
<!-- <div class="newsItem">
|
||
<div class="newsInfo">
|
||
<div class="newsTitle">
|
||
热到史上第二!高温红色预警信号七连发!
|
||
</div>
|
||
<div class="newsDetail">
|
||
<span class="newsAuthor">李强</span
|
||
><span class="newsDate">2024-08-22</span>
|
||
</div>
|
||
</div>
|
||
<img src="" alt="" />
|
||
</div>
|
||
<div class="newsItem">
|
||
<div class="newsInfo">
|
||
<div class="newsTitle">海浪橙色警报:东海东部将...</div>
|
||
<div class="newsContent">国家海洋预报台8月28日8时发...</div>
|
||
<div class="newsDetail">
|
||
<span class="newsAuthor">李强</span
|
||
><span class="newsDate">2024-08-22</span>
|
||
</div>
|
||
</div>
|
||
<img src="" alt="" />
|
||
</div> -->
|
||
</div>
|
||
</div>
|
||
<!-- 情况处置 -->
|
||
<!-- <div class="layer qkcz" style="display: none">
|
||
<div class="btn_qksb">
|
||
<i class="icon_plus" onclick="handleEventUpload()"></i>
|
||
</div>
|
||
<div class="newslist qkczList"></div>
|
||
</div>
|
||
<div class="maplayer jjyb" style="display: none">
|
||
<div id="container" class="map"></div>
|
||
<div class="markList"></div>
|
||
<script
|
||
type="text/javascript"
|
||
src="https://webapi.amap.com/maps?v=2.0&key=307b14b003f9288ba0cad406d5e1238e"
|
||
></script>
|
||
|
||
<script type="text/javascript">
|
||
// var current_position;
|
||
// 创建地图实例
|
||
var map = new AMap.Map("container", {
|
||
zoom: 11,
|
||
center: [107.535867, 31.228318],
|
||
resizeEnable: true,
|
||
});
|
||
</script>
|
||
</div> -->
|
||
</div>
|
||
<div class="dialog">
|
||
<div class="dialogBox">
|
||
<div class="dialog_bg"></div>
|
||
<div class="title">
|
||
<i class="icon_dots mr142"></i>预先警报<i class="icon_dots ml142"></i>
|
||
</div>
|
||
<div class="icon_alert yxjb" onclick="pausePlay()"></div>
|
||
<div class="content">
|
||
预先警报信号的作用是在城市可能遭到空袭的情况下,告知市民提前做好防空袭各项准备。音响信号为:鸣36秒停24秒,重复3遍,时间3分钟,主要是城市有遭空袭迹象时的早期预报,提示人们实施防护或紧急疏散。
|
||
</div>
|
||
<button class="btn_ok" type="button" onclick="closeDialog()">
|
||
我知道了
|
||
</button>
|
||
<div class="tips">再点击一下图标可以关闭警报</div>
|
||
</div>
|
||
</div>
|
||
<div id="hotal">
|
||
<!-- 提示框 -->
|
||
<div class="toast_box">
|
||
<p id="toast"></p>
|
||
</div>
|
||
<!-- <button id="toliet" type="button" onclick="correct()">正常</button>
|
||
<button id="toliet" type="button" onclick="warning()">警告</button>
|
||
<button id="toliet" type="button" onclick="error()">报错异常</button> -->
|
||
</div>
|
||
</body>
|
||
</html>
|