frame0.html 17 KB

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