analysis.html 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404
  1. {extend name="public/layout"/} {block name="title"}楼盘数据统计{/block} {block name="body"}
  2. <link rel="stylesheet" href="__STATIC__/css/csspc.css">
  3. <link rel="stylesheet" href="__STATIC__/css/font.css">
  4. <style type="text/css">
  5. html{background: none;min-width:1100px;}
  6. .layui-form-select{float:left;width: 60%;}
  7. .sjtj_dl .sjtj_dl_dd{float: right;min-width:200px;margin-top:1px;margin-right: 10px;}
  8. .sjtj_dl .sjtj_dl_dd p{font-size: 14px;}
  9. .set_times{height: 36px;border:1px solid #c7d8e6;}
  10. .table_box thead tr th {
  11. text-align: center;
  12. white-space: nowrap;
  13. background: #d8e6f1;
  14. border-right: 1px solid #d8e6f1;
  15. /* outline: 1px solid #d4d4d4; */
  16. /* border:none !important; */
  17. }
  18. .table_box tbody tr td {
  19. text-align: center;
  20. word-break: keep-all;
  21. white-space: nowrap;
  22. /* outline: 1px solid #d4d4d4; */
  23. /* border:none !important; */
  24. }
  25. .table_box tbody tr td,.table_box thead tr th{border:1px solid #c7d8e6;}
  26. .table_box{position: relative;border-collapse: collapse;}
  27. .head_t_th_p1{font-size: 16px;font-weight: bold;}
  28. .head_t_th_p2{font-size: 14px;}
  29. .borhuise{border:1px solid #d1e5f5;}
  30. .borhuiserleft{border-left:1px solid #d1e5f5;}
  31. .borhuisertop,.bodylist_dd_p{border-top:1px solid #d1e5f5;}
  32. /* .body_top{background: #D8D8D8;} */
  33. .body_top .body_top_dd{width:16.66%;float:left;color:#475562;}
  34. .list_dd01{width:190px;}
  35. .list_dd02{width:96px;}
  36. .list_dd03{width:126px;}
  37. .list_dd04{width:160px;}
  38. .body_c .body_c_dd{float:left;text-align: center;font-size: 14px;border-left:1px solid #d1e5f5;line-height: 38px;}
  39. .lanse{color:#249efb}
  40. .bodylist li{line-height: 38px;}
  41. .bodylist li .bodylist_dd{border-left:1px solid #d1e5f5;border-top:1px solid #d1e5f5;float:left;text-align: center;font-size: 14px;}
  42. .bodylist_dd_p{line-height: 38px !important;}
  43. .layui-table{margin-top:0;}
  44. .iwidth {width: 220px !important;display: inline-block;}
  45. .table_tbodys tr td div{line-height: 30px;padding: 6px 15px;border-bottom: 1px solid #e6e6e6;}
  46. .table_tbodys br{display: contents;}
  47. .ispddiv{padding:0 !important;}
  48. .tableHeadertr{background: #D8E6F1 !important;}
  49. .bodybgsbox{margin-right: 16px;width: 100%;}
  50. .bodybgs{background: #f1f9ff;overflow: hidden;display: none;}
  51. .tableboxs{overflow-y: auto;width: 100%;height: 78vh;display: none;}
  52. .tableHeader{position:sticky;top:0;background: #d8e6f1;z-index:2;}
  53. #rangeDepart {
  54. width: 63%;
  55. height: 38px;
  56. }
  57. xm-select > .xm-body {
  58. z-index: 99999 !important;
  59. }
  60. </style>
  61. <body class="">
  62. <form class="layui-form layui-form-box ds" id="bodybox">
  63. <dl class="sjtj_dl">
  64. <dd style="float: left;">
  65. <button type="button" class="layui-btn layuiadmin-btn-list" id="export">
  66. 导出
  67. </button>
  68. </dd>
  69. <dd class="sjtj_dl_dd mdr20" style="width: 144px;min-width: 144px;margin-top:0;">
  70. <button class="layui-btn layuiadmin-btn-list submitbtn" id="searchbox" type="button">
  71. 搜索
  72. </button>
  73. <button class="layui-btn layuiadmin-btn-list" type="button" id="resetbtn">
  74. 重置
  75. </button>
  76. </dd>
  77. <dd class="sjtj_dl_dd" style="min-width:312px;">
  78. <p class="ids lh38">更新时间:</p>
  79. <input type="text" style="border:1px solid #e6e6e6;height:36px;" class=" iwidth layui-input" name="time" id="time_date" required lay-verify="required" placeholder="开始时间 - 结束时间" autocomplete="off">
  80. </dd>
  81. <dd class="sjtj_dl_dd width15_">
  82. <p class="wleft lh38">小区VR:</p>
  83. <select name="vr" id="hasvr">
  84. <option value="">请选择</option>
  85. <option value="有">有</option>
  86. <option value="无">无</option>
  87. </select>
  88. </dd>
  89. <dd class="sjtj_dl_dd width15_">
  90. <p class="wleft lh38">楼盘名称:</p>
  91. <select name="buildingname" id="building">
  92. <option value="">请选择</option>
  93. {volist name="building" id="vo"}
  94. <option value="{$vo.community_id}">{$vo.name}</option>
  95. {/volist}
  96. </select>
  97. </dd>
  98. <dd class="sjtj_dl_dd width15_">
  99. <p class="wleft lh38">选择部门:</p>
  100. <!-- <select name="org" id="org" lay-filter="org_select" lay-search>
  101. <option value="">请选择</option>
  102. {volist name="org" id="vo"}
  103. <option value="{$vo.id}">{$vo.title}</option>
  104. {/volist}
  105. </select> -->
  106. <div id="rangeDepart" class="wleft"></div>
  107. </dd>
  108. </dl>
  109. <div class="clear"></div>
  110. <div class="bodybgsbox">
  111. <div class="mdt30 borhuise borl0 bodybgs">
  112. <dl class="woverflow body_top pdtb20 borhuiserleft">
  113. <dd class="textc body_top_dd">
  114. <p class="font16 textb bodyTops01">0</p>
  115. <p class="font14">楼盘数量</p>
  116. </dd>
  117. <dd class="textc body_top_dd">
  118. <p class="font16 textb bodyTops02">0</p>
  119. <p class="font14">小区VR</p>
  120. </dd>
  121. <dd class="textc body_top_dd">
  122. <p class="font16 textb bodyTops03">0</p>
  123. <p class="font14">户型个数</p>
  124. </dd>
  125. <dd class="textc body_top_dd">
  126. <p class="font16 textb bodyTops04">0</p>
  127. <p class="font14">户型VR完整度</p>
  128. </dd>
  129. <dd class="textc body_top_dd">
  130. <p class="font16 textb bodyTops05">0</p>
  131. <p class="font14">研发案例</p>
  132. </dd>
  133. <dd class="textc body_top_dd">
  134. <p class="font16 textb bodyTops06">0</p>
  135. <p class="font14">研发案例完整度</p>
  136. </dd>
  137. </dl
  138. </div>
  139. </div>
  140. <div class="tableboxs">
  141. <table lay-filter="tabletotalbox" class="layui-table table_box">
  142. <thead class="tableHeader">
  143. <tr class="tableHeadertr">
  144. </tr>
  145. </thead>
  146. <tbody class="table_tbodys">
  147. </tbody>
  148. </table>
  149. </div>
  150. </form>
  151. </body>
  152. {/block} {block name="js"}
  153. <script type="text/javascript" src="__STATIC__/js/jquery.min.js"></script>
  154. <script type="text/javascript" src="__STATIC__/js/FileSaver.min.js"></script>
  155. <script type="text/javascript" src="__STATIC__/js/tableExport.min.js"></script>
  156. <script src="__STATIC__/layui/layui/layui.js"></script>
  157. <script src="__STATIC__/layui/layui/lay/modules/xm-select.js" type="text/javascript" charset="utf-8"></script>
  158. <script>
  159. var org = eval('{$org|raw}');
  160. layui.config({
  161. base: '__LAYUI__/',
  162. urlbase: '/sys'
  163. }).extend({
  164. index: 'lib/index' //主入口模块
  165. }).use(['index','element','upload','laydate','form','table', 'jquery'], function() {
  166. var
  167. // $ = layui.$,
  168. $ = layui.jquery,
  169. layer = layui.layer,
  170. form = layui.form,
  171. element = layui.element,
  172. laydate = layui.laydate,
  173. table=layui.table;
  174. $('#org').append(setOrgOption(org, ''));
  175. form.render('select')
  176. laydate.render({
  177. elem: '#time_date'
  178. , type: 'date'
  179. , range: true
  180. , trigger: 'click'//呼出事件改成click
  181. });
  182. function switch_set(numbers){
  183. switch(numbers){
  184. case 1:
  185. return "一";
  186. case 2:
  187. return "二";
  188. case 3:
  189. return "三";
  190. case 4:
  191. return "四";
  192. case 5:
  193. return "五";
  194. case 6:
  195. return "六";
  196. case 7:
  197. return "七";
  198. }
  199. }
  200. var departTree = xmSelect.render({
  201. el: "#rangeDepart",
  202. name: 'org',
  203. autoRow: true,
  204. filterable: true,
  205. tips: '请选择',
  206. radio: true,
  207. tree: {
  208. show: true,
  209. showFolderIcon: true,
  210. showLine: true,
  211. indent: 20,
  212. expandedKeys: [ -3 ],
  213. //是否严格遵守父子模式
  214. strict: false,
  215. },
  216. height: "200px",
  217. data: [],
  218. //文本显示模式
  219. //处理方式
  220. });
  221. $.ajax({
  222. url: '{:url("statistics/get_person")}',
  223. type: "post",
  224. data: {},
  225. success: function(res) {
  226. departTree.update({data:res})
  227. }
  228. })
  229. $('#searchbox').click(function () {
  230. var formData = new FormData();
  231. var orgids = departTree.getValue('value')[0]?departTree.getValue('value')[0]:'';
  232. formData.append('org', orgids);
  233. formData.append('community_id', $('#building').val());
  234. formData.append('vr', $('#hasvr').val());
  235. formData.append('time', $('#time_date').val());
  236. apiurl(formData);
  237. })
  238. $('#resetbtn').click(function(){
  239. departTree.setValue([ ]);
  240. $("#bodybox")[0].reset();
  241. layui.form.render();
  242. location.reload();
  243. })
  244. form.on('select(org_select)', function (data) {
  245. var formData = new FormData();
  246. formData.append('org', data.value);
  247. apiurl(formData);
  248. })
  249. window.parent.htmlhide = function(){
  250. $('.tableboxs').hide();
  251. $('.bodybgs').hide();
  252. }
  253. apiurl();
  254. function apiurl(formData){
  255. layer.load();
  256. $.ajax({
  257. url: '{:url("building/analysis")}',
  258. type: 'post',
  259. dataType: 'json',
  260. data: formData,
  261. processData: false,
  262. contentType: false,
  263. success: function(res) {
  264. if(res.code==0){
  265. layer.closeAll('loading');
  266. $('.tableboxs').show();
  267. $('.bodybgs').show();
  268. $('.bodyTops01').html(res.data.building_count);
  269. $('.bodyTops02').html(res.data.vr_count);
  270. $('.bodyTops03').html(res.data.housetype_count);
  271. $('.bodyTops04').html(res.data.housetype_vr_percent+'%');
  272. $('.bodyTops05').html(res.data.develop_all);
  273. $('.bodyTops06').html(res.data.housetype_deveolp_percent+'%');
  274. let str='<th lay-data="" colspan="1" >楼盘名称</th><th lay-data="" colspan = "1" > 基层部门</th>';
  275. let num= res.data.org_length;
  276. for(let i=0;i< res.data.org_length;i++){
  277. str+='<th lay-data="" colspan = "1">'+ switch_set(num-i) +'级部门</th>';
  278. }
  279. str+=`<th lay-data="" colspan="1">小区VR</th><th lay-data="" colspan="1">户型个数</th><th lay-data="" colspan="1">户型VR数量</th>
  280. <th lay-data="" colspan="1">户型VR完整度</th><th lay-data="" colspan="1">研发案例数量</th><th lay-data="" colspan="1">研发案例完整度</th>
  281. <th lay-data="" colspan="1">动态更新次数</th><th lay-data="" colspan="1">最近更新时间</th>
  282. <th lay-data="" colspan="1">浏览时长</th><th lay-data="" colspan="1">转发次数</th><th lay-data="" colspan="1">关联案例浏览次数</th><th lay-data="" colspan="1">在施工地浏览次数</th>
  283. <th lay-data="" colspan="1">楼盘上传时间</th>`;
  284. $('.tableHeadertr').html(str);
  285. let htmlstr='';
  286. for(let j = 0; j < res.data.list.length; j++){
  287. // 基层部门
  288. let basiclevel='';
  289. if(!res.data.list[j].assign_org.length){
  290. basiclevel="无";
  291. }else{
  292. for (let k = 0; k < res.data.list[j].assign_org.length; k++){
  293. if(k==res.data.list[j].assign_org.length-1){
  294. basiclevel+="<div class='borb0'>"+ res.data.list[j].assign_org[k].name +"</div>"
  295. }else{
  296. basiclevel+="<div>"+ res.data.list[j].assign_org[k].name +"</div><br/>"
  297. }
  298. }
  299. }
  300. // 上级部门
  301. let lastdapartstr='';
  302. if(res.data.org_length!=0){
  303. if(res.data.list[j].parents_org.length==0){
  304. for (let i = 0; i < res.data.org_length; i++) {
  305. lastdapartstr += '<td lay-data="" rowspan ="1">无</td>';
  306. }
  307. }else{
  308. for (let r = 0; r < res.data.list[j].parents_org.length; r++) {
  309. let str1 = '';
  310. for (let t = 0; t < res.data.list[j].parents_org[r].length; t++) {
  311. if(t==res.data.list[j].parents_org[r].length-1){
  312. str1 += "<div class='borb0'>" + (res.data.list[j].parents_org[r][t] ? res.data.list[j].parents_org[r][t] : '无') + "</div>"
  313. }else{
  314. str1 += "<div>" + (res.data.list[j].parents_org[r][t] ? res.data.list[j].parents_org[r][t] : '无') + "</div>"
  315. }
  316. }
  317. lastdapartstr += '<td lay-data="" rowspan ="1" class="ispddiv">' + str1 + '</td>';
  318. }
  319. }
  320. }
  321. htmlstr+=`<tr>
  322. <td lay-data="" rowspan="1">${res.data.list[j].name}</td>
  323. <td lay-data="" rowspan="1" class="${basiclevel=="无"?'':'ispddiv'}">${basiclevel}</td>
  324. ${lastdapartstr}
  325. <td lay-data="" rowspan="1">${res.data.list[j].vr_link?'有':'无'}</td>
  326. <td lay-data="" rowspan="1">${res.data.list[j].housetype_count}</td>
  327. <td lay-data="" rowspan="1">${res.data.list[j].housetype_vr_count}</td>
  328. <td lay-data="" rowspan="1">${res.data.list[j].housetype_vr_percent}%</td>
  329. <td lay-data="" rowspan="1">${res.data.list[j].develop_count}</td>
  330. <td lay-data="" rowspan="1">${res.data.list[j].develop_percent}%</td>
  331. <td lay-data="" rowspan="1">${res.data.list[j].progress_count}</td>
  332. <td lay-data="" rowspan="1">${res.data.list[j].last_update_time?res.data.list[j].last_update_time:'--'}</td>
  333. <td lay-data="" rowspan="1">${res.data.list[j].visit_due_time}</td>
  334. <td lay-data="" rowspan="1">${res.data.list[j].shared_times}</td>
  335. <td lay-data="" rowspan="1">${res.data.list[j].mater_case_view}</td>
  336. <td lay-data="" rowspan="1">${res.data.list[j].construction_view}</td>
  337. <td lay-data="" rowspan="1">${res.data.list[j].addtime}</td>
  338. </tr>`;
  339. }
  340. $('.table_tbodys').html(htmlstr);
  341. // $(window).resize(function(){
  342. // $('.bodybgs').width($('.table_box').width());
  343. // }).resize();
  344. // $('.bodybgs').width($('.table_box').width());
  345. }
  346. }
  347. });
  348. }
  349. $('#export').on('click',function () {
  350. $('table').tableExport({
  351. type: 'excel',
  352. mso: {
  353. styles: ['background-color', 'border-top-color', 'border-left-color', 'border-right-color', 'border-bottom-color', 'border-top-width', 'border-left-width', 'border-right-width', 'border-bottom-width', 'border-top-style', 'border-left-style', 'border-right-style', 'border-bottom-style', 'color']
  354. }
  355. });
  356. })
  357. function setOrgOption(opt, sj) {
  358. var html = '';
  359. opt.forEach(element => {
  360. html += '<option value="' + element.id + '">' + sj + element.title + '</option>';
  361. if (element && element.children.length > 0) html += setOrgOption(element.children, sj + '-');
  362. });
  363. return html;
  364. }
  365. function in_array(search, array) {
  366. for (var i in array) {
  367. if (array[i] == search) {
  368. return true;
  369. }
  370. }
  371. return false;
  372. }
  373. document.onkeydown=function(event){
  374. var e = event || window.event || arguments.callee.caller.arguments[0];
  375. if(e && e.keyCode==13){
  376. $(".submitbtn").trigger("click");
  377. }
  378. };
  379. })
  380. </script>
  381. {/block}