123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171 |
- <!doctype html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>镇街排名(按面积)</title>
- <meta name="viewport"
- content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
- <!-- 引入mui的css样式 -->
- <link href="../css/mui.css" rel="stylesheet" />
- <!-- 引入app样式 -->
- <link rel="stylesheet" type="text/css" href="../css/app.css" />
- <link rel="stylesheet" type="text/css" href="../css/app.new.css">
- <!-- 引入字体 -->
- <link rel="stylesheet" type="text/css" href="../fonts/TTTGB-Medium.css" />
- <link rel="stylesheet" type="text/css" href="../fonts/font-time.css" />
- <link rel="stylesheet" type="text/css" href="../fonts/font-jt.css">
- <!-- 引入独有样式 -->
- <link rel="stylesheet" type="text/css" href="../css/khpm.child.css">
- </head>
- <body>
- <div class="mui-content">
- <!-- 具体内容 -->
- <div class="mui-content-padded">
- <div class="mui-scroll-wrapper" style="top: 0px;">
- <div class="mui-scroll" style="padding-top: 5px;">
- <!-- 镇街排名 -->
- <div id="item1" class="mui-control-content mui-active">
- </div>
- <!-- 村庄排名 -->
- <div id="item2" class="mui-control-content">
- </div>
- </div>
- </div>
- </div>
- </div>
- </body>
- </html>
- <!-- 引入mui脚本 -->
- <script src="../js/mui.js" type="text/javascript" charset="utf-8"></script>
- <!-- 引入jquery脚本 -->
- <script src="../js/jquery.js" type="text/javascript" charset="utf-8"></script>
- <!-- 引入存储脚本 -->
- <script src="../js/save.js" type="text/javascript" charset="utf-8"></script>
- <!-- 引入网络脚本 -->
- <script src="../js/ajax.js" type="text/javascript" charset="utf-8"></script>
- <!-- 引入通用脚本 -->
- <script src="../js/common.js" type="text/javascript" charset="utf-8"></script>
- <!-- 引入图表脚本 -->
- <script src="../js/ECharts/echarts.js" type="text/javascript" charset="utf-8"></script>
- <!-- 引入自定义图表脚本 -->
- <script src="../js/CRECharts.js" type="text/javascript" charset="utf-8"></script>
- <!-- 引入webview脚本 -->
- <script src="../js/webview.js" type="text/javascript" charset="utf-8"></script>
- <!-- 本页独有脚本 -->
- <script type="text/javascript">
- mui.init();
- /* 必须加 否则将导致数据表无法滚动 */
- mui('.mui-scroll-wrapper').scroll({
- scrollY: true, //是否竖向滚动
- scrollX: true, //是否横向滚动
- startX: 0, //初始化时滚动至x
- startY: 0, //初始化时滚动至y
- indicators: false, //是否显示滚动条
- deceleration: 0.0006, //阻尼系数,系数越小滑动越灵敏
- bounce: false, //是否启用回弹
- });
- /* 本地存储的用户 */
- var joinUser = undefined;
- /* 统计数据 */
- var countData = [];
- /* 初始化完成 */
- plusInit(function() {
- /* 获取存储的用户信息 */
- getSaveUserInfo({
- success: function(userInfo) {
- joinUser = userInfo;
- asyncCountData('ssxz', function(resData) {
- // console.log(JSON.stringify(resData));
- countData = resData;
- addCountItemToList(0, 'item1', countData.length);
- });
- },
- error: function(err) {
- muiAlertError(err);
- },
- });
- });
- /**
- * 同步统计数据
- * @param {String} field 统计字段
- * @param {Function} callback 同步完成回调
- */
- function asyncCountData(field, callback) {
- sendAjax({
- type: 'post',
- waitMessage: '正在同步排名数据...',
- url: 'appQueryXzqCaseArea',
- data: {
- userId: joinUser.userID,
- type: 'all',
- field: field,
- },
- success: function(resData) {
- var countData = [];
- for (var i = 0; i < resData.length; i++) {
- countData.push(resData[i]);
- }
- if (callback != undefined) callback(countData);
- },
- error: function(err) {
- muiAlertError(err);
- }
- })
- }
- /**
- * 填充统计排名数据
- * @param {int} index 索引
- * @param {String} domId 填充控件索引
- * @param {int} length 总数
- */
- function addCountItemToList(index, domId, length) {
- var countHtml = "";
- if (index == countData.length) {
- return;
- }
- if (index == 0) {
- $('#' + domId).empty();
- }
- var data = countData[index];
- var allArea = (parseFloat(data.case_all) - parseFloat(data.wait_assign)).toFixed(2) + "亩";
- var okCheckArea = (parseFloat(data.case_all) - parseFloat(data.wait_assign) - parseFloat(data.wait_check)).toFixed(
- 2) + "亩";
- var waitCheckArea = (parseFloat(data.wait_check)).toFixed(2) + "亩";
- var jbntArea = (parseFloat(data.basicFarmlandArea)).toFixed(2) + "亩";
- var divList = document.createElement('div');
- if (index % 2 == 0) {
- divList.className = 'cr-item jt-row-even-number';
- } else {
- divList.className = 'cr-item jt-row-odd-number';
- }
- countHtml += "<div class=\"cr-item-row\" style=\"height: 40px;\">";
- countHtml += "<div class=\"cr-item-name\">";
- countHtml += "<span style='background-color:" + randomRgbColor([200, 236], [200, 236], [200, 236]) + "'>" + data
- .xzqName + "</span>";
- countHtml += "</div>";
- countHtml += "<div class=\"cr-item-order\"><span>排名</span><span></span><span>" + (parseInt(
- length) - parseInt(index)) + "</span></div>";
- countHtml += "</div>";
- countHtml += "<div class=\"cr-item-row\">";
- countHtml += "<div class=\"cr-item-column cr-item-title\">总面积</div>";
- countHtml += "<div class=\"cr-item-column cr-item-title\">占用基本农田</div>";
- countHtml += "<div class=\"cr-item-column cr-item-title\">已处理面积</div>";
- countHtml += "<div class=\"cr-item-column cr-item-title\">待处理面积</div>";
- countHtml += "</div>";
- countHtml += "<div class=\"cr-item-row\">";
- countHtml += "<div class=\"cr-item-column cr-item-value\">" + allArea + "</div>";
- countHtml += "<div class=\"cr-item-column cr-item-value f-color-case-wait-verify\">" + jbntArea + "</div>";
- countHtml += "<div class=\"cr-item-column cr-item-value f-color-case-wait-check\">" + okCheckArea + "</div>";
- countHtml += "<div class=\"cr-item-column cr-item-value f-color-case-wait-flight\">" + waitCheckArea + "</div>";
- countHtml += "</div>";
- divList.innerHTML = countHtml;
- $(divList).hide();
- $('#' + domId).append(divList);
- $(divList).slideDown(200, function() {
- addCountItemToList(index + 1, domId, length);
- });
- }
- </script>
|