frame0.html 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
  6. <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  7. <title></title>
  8. <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
  9. <link rel="stylesheet" type="text/css" href="../../css/swiper.css">
  10. <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
  11. <link rel="stylesheet" type="text/css" href="../../css/aui.css"/>
  12. <link rel="stylesheet" href="../../css/projeck.css">
  13. <style>
  14. body{
  15. /*background: #fff;*/
  16. background: url("../../image/top.png") no-repeat;
  17. background-size: 100%;
  18. /*padding-top: 40px;*/
  19. }
  20. .aui-grid-label{
  21. font-size: 14px !important;
  22. width: 90%;
  23. margin: auto;
  24. overflow: hidden;
  25. text-overflow: ellipsis;
  26. white-space: nowrap;
  27. }
  28. .swiper-slide{
  29. height: 200px
  30. }
  31. .swiper-slide img{
  32. -webkit-border-radius: 10px;
  33. -moz-border-radius: 10px;
  34. border-radius: 10px;
  35. width: 100%;
  36. height: 200px;
  37. object-fit: cover;
  38. }
  39. .api_swiper_wrap .swiper-pagination-fraction{
  40. bottom:1px;
  41. }
  42. .api_page_text{
  43. bottom:0;
  44. }
  45. .api_grids{
  46. padding: 0 20px 0 10px;
  47. }
  48. .api_grids .aui-col-xs-3{
  49. font-size: 12px;
  50. display: inline-block;
  51. height: 42px;
  52. line-height: 42px;
  53. text-align: center;
  54. color: #009fe8;
  55. border: 1px solid #009fe8;
  56. border-radius: 10px;
  57. width: auto;
  58. padding: 0;
  59. margin-bottom:20px;
  60. }
  61. .api_grids .aui-grid-label{
  62. margin-top: 0;
  63. overflow: hidden;
  64. text-overflow: ellipsis;
  65. white-space: nowrap;
  66. }
  67. .height_duty{
  68. height: 45px;
  69. overflow: hidden;
  70. -webkit-box-sizing: border-box;
  71. -moz-box-sizing: border-box;
  72. box-sizing: border-box;
  73. }
  74. .aui-grid [class*=aui-col-]{
  75. padding: 0
  76. }
  77. .api_intelligence{
  78. margin-top: 20px;
  79. }
  80. </style>
  81. </head>
  82. <body>
  83. <div class="api_layout" id="api_layout">
  84. <div>
  85. <div class="duty">
  86. <p class="duty_title"><span id="duty_title"></span> <i class="duty_icon icon"></i></p>
  87. <div class="height_duty" id="box">
  88. <p class="duty_content" id="ul1"></p>
  89. <p class="duty_content" id="ul2"></p>
  90. </div>
  91. </div>
  92. <!--banner-->
  93. <div class="api_swiper_wrap">
  94. <div class="swiper-container">
  95. <div class="swiper-wrapper" id="age_list">
  96. </div>
  97. <div class="swiper-pagination swiper-pagination-fraction" id="api_page"></div>
  98. </div>
  99. </div>
  100. <!--新闻-->
  101. <div class="api_news" id="api_newsList"></div>
  102. <!--智慧-->
  103. <div class="api_intelligence">
  104. <section class="aui-grid" id="api_grid">
  105. <div class="aui-row" style="padding:0 10px;" id="imgNav">
  106. </div>
  107. </section>
  108. </div>
  109. <div class="api_line"></div>
  110. <!-- 基层区队 -->
  111. <div id="DistrictTeam">
  112. <div class="api_office">
  113. <h1 class="api_title" style="margin-bottom: 13px">
  114. 机关科室
  115. <img src="{{=i%2 == 0?'../../image/icon01.png':'../../image/edit.png'}}" alt="">
  116. </h1>
  117. <section class="aui-grid api_grids">
  118. <div class="aui-row">
  119. <div class="aui-col-xs-3 api_col" onclick="openURl('{{=it[i].children[j].link}}','{{=it[i].children[j].title}}');">
  120. <div class="aui-grid-label">机关科室</div>
  121. </div>
  122. <div class="aui-col-xs-3 api_col" onclick="openURl('{{=it[i].children[j].link}}','{{=it[i].children[j].title}}');">
  123. <div class="aui-grid-label">机关科室</div>
  124. </div>
  125. <div class="aui-col-xs-3 api_col" onclick="openURl('{{=it[i].children[j].link}}','{{=it[i].children[j].title}}');">
  126. <div class="aui-grid-label">机关科室</div>
  127. </div>
  128. <div class="aui-col-xs-3 api_col" onclick="openURl('{{=it[i].children[j].link}}','{{=it[i].children[j].title}}');">
  129. <div class="aui-grid-label">机关科室</div>
  130. </div>
  131. <div class="aui-col-xs-3 api_col" onclick="openURl('{{=it[i].children[j].link}}','{{=it[i].children[j].title}}');">
  132. <div class="aui-grid-label">机关科室</div>
  133. </div>
  134. </div>
  135. </section>
  136. </div>
  137. </div>
  138. </div>
  139. </div>
  140. </body>
  141. </html>
  142. <!-- 轮播 -->
  143. <script type="text/template" id="template">
  144. {{~it:value}}
  145. <div class="swiper-slide" onclick="openUrlBanner('{{=value.jumpURL}}')">
  146. <a href="javascript:;" >
  147. <img src="{{=value.imgURL}}" alt="">
  148. </a>
  149. <div class="api_page_text">
  150. <p class="api_banner_info">{{=value.title}}</p>
  151. </div>
  152. </div>
  153. {{~}}
  154. </script>
  155. <!-- 新闻 -->
  156. <script type="text/template" id="templateNews">
  157. <h1 class="api_title">
  158. 新闻动态
  159. <i class="icon News_icon"></i>
  160. <span class="api_more" onclick="openNewsList('')">更多</span>
  161. </h1>
  162. <ul class="api_newsList">
  163. {{~it:value}}
  164. <li onclick="openURl('{{=value.detail_url}}','{{=value.title}}')">
  165. <img src="{{=value.main_img}}" alt="">
  166. <p>{{=value.title}}</p>
  167. </li>
  168. {{~}}
  169. </ul>
  170. <div class="api_line"></div>
  171. </script>
  172. <!-- 智慧枣泉煤矿 -->
  173. <!-- 3 -->
  174. <script type="text/template" id="templateNav">
  175. {{~it:value}}
  176. <div class="aui-col-xs-4 item" onclick="openURl('{{=value.link}}','{{=value.title}}');">
  177. <img src="{{=value.icon}}" alt="">
  178. <div class="aui-grid-label">{{=value.title}}</div>
  179. </div>
  180. {{~}}
  181. </script>
  182. <!-- 4 -->
  183. <script type="text/template" id="templateNav_Four">
  184. {{~it:value}}
  185. <div class="aui-col-xs-3 item" onclick="openURl('{{=value.link}}','{{=value.title}}');">
  186. <img src="{{=value.icon}}" alt="">
  187. <div class="aui-grid-label">{{=value.title}}</div>
  188. </div>
  189. {{~}}
  190. </script>
  191. <!-- 区队 -->
  192. <script type="text/template" id="templateDistrict">
  193. {{ for (var i = 0;i<it.length;i++) { }}
  194. <div class="api_office">
  195. <h1 class="api_title" style="margin-bottom: 13px">
  196. {{=it[i].title}}
  197. <img src="{{=i%2 == 0?'../../image/icon01.png':'../../image/edit.png'}}" alt="">
  198. </h1>
  199. <section class="aui-grid api_grids">
  200. <div class="aui-row">
  201. {{ for (var j =0 ;j<it[i].children.length;j++) { }}
  202. <div class="aui-col-xs-3 api_col" onclick="openURl('{{=it[i].children[j].link}}','{{=it[i].children[j].title}}');">
  203. <div class="aui-grid-label">{{=it[i].children[j].title}}</div>
  204. </div>
  205. {{ } }}
  206. </div>
  207. </section>
  208. </div>
  209. {{ } }}
  210. </script>
  211. <script type="text/javascript" src="../../script/api.js"></script>
  212. <script type="text/javascript" src="../../script/swiper.min.js"></script>
  213. <script src="../../script/doT.min.js" charset="utf-8"></script>
  214. <script src="../../script/config.js" charset="utf-8"></script>
  215. <script type="text/javascript">
  216. var toast = new auiToast(),isFlat = true;
  217. $apis.swiper('.swiper-container',true,'fraction');
  218. apiready = function () {
  219. api.closeFrame({
  220. name: 'frame3'
  221. });
  222. // 监听app从后台返回前台刷新
  223. api.addEventListener({
  224. name:'resume'
  225. }, function(ret, err){
  226. getBannerData()
  227. getNewsData()
  228. getNoticeData()
  229. getImgNavData()
  230. getDistrictteamData()
  231. });
  232. // 每次打开app刷新一次
  233. if(isFlat){
  234. getBannerData()
  235. getNewsData()
  236. getNoticeData()
  237. getImgNavData()
  238. getDistrictteamData()
  239. isFlat =false;
  240. }
  241. // banner
  242. getBannerCache();
  243. // 公告
  244. getNoticeDataCache();
  245. //news
  246. getNewsDataCache();
  247. //图片nav
  248. getImgNavDataCache();
  249. //区队
  250. getDistrictteamDataCache();
  251. // 下拉刷新
  252. setCustomRefreshHeader();
  253. };
  254. // 下拉刷新
  255. function setCustomRefreshHeader() {
  256. api.setRefreshHeaderInfo({
  257. bgColor: '#f2f2f2',
  258. textColor: '#000',
  259. textDown: '下拉刷新...',
  260. textUp: '松开刷新...'
  261. }, function(ret, err) {
  262. getBannerData()
  263. getNewsData()
  264. getNoticeData()
  265. getImgNavData()
  266. getDistrictteamData()
  267. });
  268. }
  269. function flexWidth(){
  270. var cols=document.getElementsByClassName('api_col');
  271. for (var i = 0; i < cols.length; i++) {
  272. cols[i].style.width = (api.frameWidth / 4 -19) + 'px';
  273. cols[i].style.marginLeft = 10 + 'px'
  274. }
  275. }
  276. // openUrlBanner
  277. function openUrlBanner(urls,titles){
  278. $event.openWin('openURlId1','openUrlBanner',{url:urls,title:titles},'');
  279. }
  280. // openURl
  281. function openURl(urls,titles){
  282. var appU = urls.split('//');
  283. if (appU && appU[1] == 'app:') {
  284. $event.openWin('organization_win',appU[2],'','');
  285. }else {
  286. var name,value,info =[],Qrurl= urls;
  287. var str = Qrurl;
  288. var num=str.indexOf("?");
  289. str=str.substr(num+1);
  290. var arr=str.split("&");
  291. for(var i=0;i < arr.length;i++){
  292. num=arr[i].indexOf("=");
  293. if(num>0){
  294. name=arr[i].substring(0,num);
  295. value=arr[i].substr(num+1);
  296. this[name]=value;
  297. info.push(value)
  298. }
  299. }
  300. if (info[2] != "" && info[2]) {
  301. $event.openWin('browseQrcode_win','../browseQrcode/browseQrcode_win',{pageId:info[2],title:titles},'');
  302. }else {
  303. $event.openWin('openURlId','openUrl',{url:urls,title:titles},'');
  304. }
  305. }
  306. }
  307. // banner
  308. function getBannerData() {
  309. $http.requestData(UrlRouter.bannerApi,'get','')
  310. .then(ret=>{
  311. if (ret.code === 0) {
  312. $apis.html(age_list,'#template',ret.data.data);
  313. $apis.writeFile($apis.CACHE_DIR('banner'),ret.data.data);
  314. mySwiper.destroy(true,true);
  315. $apis.swiper('.swiper-container',true,'fraction');
  316. mySwiper.init();
  317. }else if (ret.code === 401) {
  318. api.alert({
  319. title: '提示',
  320. msg: '登录过期,重新登录',
  321. }, function(ret, err) {
  322. var index = ret.buttonIndex;
  323. if (index == 1) {
  324. $api.clearStorage ();
  325. api.setStatusBarStyle({
  326. color: 'rgba(0,0,0,0)',
  327. style: 'light'
  328. });
  329. api.closeWin({
  330. name:'index'
  331. });
  332. }
  333. });
  334. }
  335. })
  336. .catch(err=>{})
  337. }
  338. function getBannerCache() {
  339. $apis.readFile($apis.CACHE_DIR('banner'),function (ret,err) {
  340. if( ret.status ){
  341. $apis.html(age_list,'#template',JSON.parse(ret.data));
  342. mySwiper.destroy(true,true);
  343. $apis.swiper('.swiper-container',true,'fraction');
  344. mySwiper.init();
  345. }else{
  346. getBannerData(headers)
  347. }
  348. });
  349. }
  350. // 新闻
  351. function getNewsDataCache() {
  352. $apis.readFile($apis.CACHE_DIR('news'),function (ret,err) {
  353. if( ret.status ){
  354. $apis.html(api_newsList,'#templateNews',JSON.parse(ret.data));
  355. }else{
  356. getNwesData(headers)
  357. }
  358. })
  359. }
  360. function getNewsData() {
  361. $http.requestData(UrlRouter.nwesApi,'get','')
  362. .then(ret=>{
  363. if (ret.code === 0) {
  364. api.refreshHeaderLoadDone();
  365. $apis.html(api_newsList,'#templateNews',ret.data.data);
  366. $apis.writeFile($apis.CACHE_DIR('news'),ret.data.data);
  367. }
  368. })
  369. .catch(err=>{})
  370. }
  371. //公告
  372. function getNoticeDataCache() {
  373. $apis.readFile($apis.CACHE_DIR('Notice'),function (ret,err) {
  374. if( ret.status ){
  375. if (JSON.parse(ret.data).message == "暂无公告") {
  376. $api.html($api.byId('duty_title'),JSON.parse(ret.data).title);
  377. $api.html($api.dom('#ul1'), JSON.parse(ret.data).message);
  378. }else {
  379. $api.html($api.byId('duty_title'),JSON.parse(ret.data).title );
  380. $api.html($api.dom('#ul1'), JSON.parse(ret.data).content);
  381. textRoll(200);
  382. }
  383. }else{
  384. getNoticeData()
  385. }
  386. })
  387. }
  388. function getNoticeData() {
  389. $http.requestData(UrlRouter.NoticeApi,'get','')
  390. .then(ret=>{
  391. if (ret.code === 0) {
  392. if (ret.data.message == "暂无公告") {
  393. $api.html($api.byId('duty_title'),ret.data.title );
  394. api.refreshHeaderLoadDone();
  395. $api.html($api.dom('#ul1'), ret.data.message);
  396. $apis.writeFile($apis.CACHE_DIR('Notice'),ret.data)
  397. }else {
  398. $api.html($api.byId('duty_title'),ret.data.title );
  399. $api.html($api.dom('#ul1'), ret.data.content);
  400. $apis.writeFile($apis.CACHE_DIR('Notice'),ret.data)
  401. }
  402. }
  403. })
  404. .catch(err=>{})
  405. }
  406. textRoll(200);
  407. // 图片导航
  408. function getImgNavDataCache() {
  409. $apis.readFile($apis.CACHE_DIR('ImgNav'),function (ret,err) {
  410. if (ret.status) {
  411. if (JSON.parse(ret.data).index_link_num == 3 ) {
  412. $apis.html(imgNav,'#templateNav',JSON.parse(ret.data).data);
  413. }else {
  414. $apis.html(imgNav,'#templateNav_Four',JSON.parse(ret.data).data);
  415. }
  416. }else {
  417. getImgNavData()
  418. }
  419. })
  420. }
  421. function getImgNavData() {
  422. $http.requestData(UrlRouter.ImgApi,'get','')
  423. .then(ret=>{
  424. if (ret.code === 0) {
  425. api.refreshHeaderLoadDone();
  426. if (ret.data.index_link_num == 3) {
  427. $apis.html(imgNav,'#templateNav',ret.data.data);
  428. } else {
  429. $apis.html(imgNav,'#templateNav_Four',ret.data.data);
  430. }
  431. $apis.writeFile($apis.CACHE_DIR('ImgNav'),ret.data);
  432. }
  433. })
  434. .catch(err=>{})
  435. }
  436. // 区队
  437. function getDistrictteamDataCache() {
  438. $apis.readFile($apis.CACHE_DIR('District'),function (ret,err) {
  439. if (ret.status) {
  440. $apis.html(DistrictTeam,'#templateDistrict',JSON.parse(ret.data));
  441. flexWidth();
  442. }else {
  443. getDistrictteamData()
  444. }
  445. })
  446. }
  447. function getDistrictteamData() {
  448. $http.requestData(UrlRouter.DistrictteamApi,'get','')
  449. .then(ret=>{
  450. if (ret.code === 0) {
  451. api.refreshHeaderLoadDone();
  452. $apis.html(DistrictTeam,'#templateDistrict',ret.data);
  453. $apis.writeFile($apis.CACHE_DIR('District'),ret.data);
  454. flexWidth();
  455. }
  456. })
  457. .catch(err=>{})
  458. }
  459. // 文字无缝滚动
  460. function textRoll(t) {
  461. var ul1 = document.getElementById("ul1");
  462. var ul2 = document.getElementById("ul2");
  463. var box = document.getElementById("box");
  464. var timer = '';
  465. if (ul1.offsetHeight > box.offsetHeight) {
  466. ul2.innerText = ul1.innerText;
  467. }
  468. box.scrollTop = 0;
  469. timer = setInterval(rollStart, t);
  470. }
  471. function rollStart() {
  472. if (document.getElementById("box").scrollTop > document.getElementById("ul1").scrollHeight) {
  473. document.getElementById("box").scrollTop = 0;
  474. } else {
  475. document.getElementById("box").scrollTop++;
  476. }
  477. }
  478. // open新文列表
  479. function openNewsList(urls){
  480. $event.openWin('openNews','openNews',{url:urls},'');
  481. }
  482. </script>