customer_data.html 37 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055
  1. {extend name="public/layout" /}
  2. {block name="title"}客户数据统计{/block}
  3. {block name="head"}
  4. {include file="public/head"}
  5. <style>
  6. html,
  7. body {
  8. min-width: 1100px;
  9. }
  10. .body-h {
  11. display: block;
  12. /* box-shadow: 0 0 4px 0 #B6CADE; */
  13. border-radius: 5px;
  14. margin: 15px;
  15. background-color: #ffffff;
  16. }
  17. .layui-table th:last-child {
  18. border-right: none;
  19. }
  20. .layui-table-view .layui-table {
  21. /* width:100% */
  22. }
  23. .layui-table thead tr,
  24. .layui-table-header {
  25. background-color: #D8E6F1 !important;
  26. }
  27. .line-middle {
  28. width: 10px;
  29. height: 100%;
  30. margin: 0px 10px;
  31. }
  32. .line {
  33. width: 10px;
  34. height: 2px;
  35. background-color: #999999;
  36. }
  37. .mb0 {
  38. margin-bottom: 0px;
  39. }
  40. .layui-btn {
  41. background-color: #fff;
  42. color: #555;
  43. border: 1px solid #c9c9c9
  44. }
  45. .layui-btn:hover {
  46. background-color: #fff;
  47. color: #555;
  48. border: 1px solid #249efb;
  49. }
  50. .layui-btn-primary,
  51. .sBtn {
  52. background-color: #249efb;
  53. color: #fff;
  54. border: 1px solid #249efb;
  55. }
  56. .layui-btn-primary:hover {
  57. background-color: #249efb;
  58. color: #fff;
  59. border: 1px solid #249efb;
  60. }
  61. .sBtn:hover {
  62. background-color: #249efb;
  63. color: #fff;
  64. border: 1px solid #249efb;
  65. }
  66. .flex-row,
  67. .row {
  68. display: flex;
  69. }
  70. .align-center {
  71. align-items: center;
  72. }
  73. .ml10 {
  74. margin-left: 10px;
  75. }
  76. .mt10 {
  77. margin-top: 10px;
  78. }
  79. .padding-tlr {
  80. padding: 15px 15px 0px;
  81. }
  82. .layui-input-block {
  83. margin-left: 0px;
  84. }
  85. .justify-end {
  86. justify-content: flex-end;
  87. }
  88. .justify-between {
  89. justify-content: space-between;
  90. }
  91. .layui-table td,
  92. .layui-table th {
  93. box-sizing: border-box !important;
  94. }
  95. .layui-table-view .layui-table {
  96. width: 100%;
  97. }
  98. .layui-tab-title {
  99. /* left: 25px; */
  100. margin-top: 15px;
  101. }
  102. /* .layui-this {
  103. color: #249EFB !important;
  104. } */
  105. .layui-tab-title li {
  106. margin: 0px 5px;
  107. border-radius: 2px;
  108. }
  109. .layui-tab-brief>.layui-tab-more li.layui-this:after,
  110. .layui-tab-brief>.layui-tab-title .layui-this:after {
  111. border: none;
  112. }
  113. .layui-tab-title .layui-this:after {
  114. width: 50px;
  115. height: 4px;
  116. background-color: #249EFB;
  117. top: 37px;
  118. left: 50%;
  119. transform: translateX(-50%);
  120. }
  121. .layui-tab-content {
  122. padding: 0;
  123. }
  124. .layui-table-body {
  125. height: 66vh;
  126. }
  127. table tr td a {
  128. color: #249EFB;
  129. }
  130. .layui-tab-title li.lineicon {
  131. float: right;
  132. background-color: #fff !important;
  133. margin-top: 10px;
  134. }
  135. .lineicon img {
  136. display: block;
  137. width: 24px;
  138. }
  139. .layui-tab-title {
  140. border-bottom: 1px solid #f5f5f5;
  141. }
  142. .layui-card-body .layui-table-body {
  143. overflow-y: auto !important;
  144. height: 75vh;
  145. }
  146. .layui-table td,
  147. .layui-table th,
  148. .layui-table-col-set,
  149. .layui-table-fixed-r,
  150. .layui-table-grid-down,
  151. .layui-table-header,
  152. .layui-table-page,
  153. .layui-table-tips-main,
  154. .layui-table-tool,
  155. .layui-table-total,
  156. .layui-table-view,
  157. .layui-table[lay-skin=line],
  158. .layui-table[lay-skin=row] {
  159. border-color: #ccc !important;
  160. }
  161. .lay-mask {
  162. width: 100%;
  163. height: 100%;
  164. background-color: rgba(0, 0, 0, 0.3);
  165. position: fixed;
  166. top: 0px;
  167. left: 0px;
  168. z-index: 9999 !important;
  169. }
  170. .lay-block {
  171. width: 400px;
  172. height: 100%;
  173. background-color: #fff;
  174. position: absolute;
  175. right: 0px;
  176. top: 0px;
  177. box-sizing: border-box;
  178. padding: 10px;
  179. overflow: auto;
  180. }
  181. .lay-title {
  182. width: 100%;
  183. height: 40px;
  184. display: flex;
  185. align-items: center;
  186. justify-content: space-between;
  187. }
  188. .lay-title>span {
  189. font-size: 16px;
  190. color: #333333;
  191. font-weight: 600;
  192. }
  193. .lay-title>i {
  194. font-weight: 600;
  195. cursor: pointer;
  196. }
  197. .layui-content {
  198. width: 100%;
  199. height: auto;
  200. }
  201. .lay-item {
  202. width: 100%;
  203. height: 50px;
  204. display: flex;
  205. align-items: center;
  206. justify-content: space-between;
  207. }
  208. .lay-item>div {
  209. display: flex;
  210. align-items: center;
  211. }
  212. .lay-item>div>span {
  213. margin-left: 6px;
  214. }
  215. .layui-form-switch {
  216. margin-top: 0px !important;
  217. transform: scale(0.8, 0.8);
  218. }
  219. .layui-fluid{padding:15px 0;}
  220. .layui-card{padding:15px;}
  221. .selectDateBox {
  222. position: absolute;
  223. width: 330px;
  224. height: 100px;
  225. box-shadow: 0 2px 4px rgb(0 0 0 / 12%);
  226. background-color: #fff;
  227. z-index: 99999 !important;
  228. top: 45px;
  229. box-sizing: border-box;
  230. padding: 5px 8px;
  231. }
  232. .selecstDateBox {
  233. position: absolute;
  234. width: 330px;
  235. height: 100px;
  236. box-shadow: 0 2px 4px rgb(0 0 0 / 12%);
  237. background-color: #fff;
  238. z-index: 99999 !important;
  239. top: 45px;
  240. right: 0;
  241. box-sizing: border-box;
  242. padding: 5px 8px;
  243. }
  244. .date-flex,.date-flex1 {
  245. display: flex;
  246. align-items: center;
  247. }
  248. .date-box {
  249. padding: 15px 0px 10px;
  250. }
  251. #rangeDepart {
  252. width: 260px;
  253. height: 38px;
  254. }
  255. xm-select > .xm-body {
  256. z-index: 99999 !important;
  257. }
  258. .intelanaly{
  259. position: relative;
  260. top: -30px;
  261. float: right;
  262. }
  263. .intelanaly a{
  264. color:#249EFB;
  265. margin-left: 10px;
  266. margin-right: 10px;
  267. }
  268. </style>
  269. {/block}
  270. {block name="body"}
  271. <!-- -->
  272. <div class="layui-tab layui-tab-brief body-h" lay-filter="tabnavs"
  273. style="background-color: #fff;margin:15px;border-radius: 5px;box-sizing: border-box;height: 96vh;padding: 1px 0;">
  274. <ul class="layui-tab-title">
  275. <li class="layui-this customer-data">客户数据统计</li>
  276. {auth:check name="statistics/clue"}
  277. <li class="clue-statis">获客统计</li>
  278. {/auth:check}
  279. {auth:check name="statistics/table"}<li class="large-table">客户跟进数据</li>{/auth:check}
  280. <li class="statistics_data">渠道统计</li>
  281. <li class="behavior_statistics">行为统计</li>
  282. <li class="high_behavior_statistics">高层</li>
  283. <li class="manage_statistics">管理层</li>
  284. <li class="customer_list">客户统计列表</li>
  285. <li class="general_statistics">总统计</li>
  286. {auth:check name="statistics/new_table_data"}<li class="large-tables">统计部报表</li>{/auth:check}
  287. {auth:check name="statistics/office_table_data"}<li class="office_statistics">总经办报表</li>{/auth:check}
  288. <li></li>
  289. </ul>
  290. <div class="intelanaly"><a href="/largescreen.html#/intelanaly?r={$rootId}" target="_blank" data-a="{$Request.root}">打开智能大屏</a><a class="copy" href="javascript:void(0)" data-link="{$Request.host}/largescreen.html#/intelanaly?r={$rootId}">复制链接</a></div>
  291. <div class="channelTips" style="width:100%;background-color: #f2f2f2;padding: 10px 0px;">
  292. <div
  293. style="width: 100%;box-sizing: border-box;padding: 15px 10px;background-color: #F0F8FF;color: #0567B4;border-radius: 10px;">
  294. 只统计填写渠道的客户</div>
  295. </div>
  296. <div class="layui-tab-content">
  297. <!-- 1 -->
  298. <div class="layui-tab-item layui-show">
  299. <div class="layui-fluid">
  300. <div class="layui-card">
  301. <div class="search-form layui-form padding-tlr">
  302. <div class="flex-row align-center justify-between">
  303. <div class="flex-row align-center">
  304. {if $Request.get.type == 2}
  305. <div class="layui-inline" style="float: left;">
  306. <div class="goback">
  307. <!-- <a href="javascript:history.back(-1)" style="color:#269efb;"> -->
  308. <a href="{:url('statistics/customer')}" style="color:#269efb;margin-right: 10px;">
  309. <i class="layui-icon layui-icon-return"></i>
  310. <span>返回</span>
  311. </a>
  312. </div>
  313. </div>
  314. {/if}
  315. <!-- <div class="layui-inline row ml10" id="timeBtn">
  316. <input type="button" class="layui-btn" value="今日" />
  317. <input type="button" class="layui-btn" value="3天" />
  318. <input type="button" class="layui-btn" value="7天" />
  319. <input type="button" class="layui-btn" value="1个月" />
  320. </div> -->
  321. <!-- <div class="layui-inline ml10">
  322. <input type="text" class="layui-input" id="sDate" autocomplete="off"
  323. name="start_date" placeholder="选择开始日期">
  324. </div>
  325. <div class="line-middle">
  326. <div class="line"></div>
  327. </div>
  328. <div class="layui-inline">
  329. <input type="text" class="layui-input" autocomplete="off" id="eDate" name="end_date"
  330. placeholder="选择结束日期">
  331. </div> -->
  332. <div class="layui-input-inline layui-form mdt10" style="display:inline-block">
  333. <!-- <select name="select_org_id" class="type_id" id="select_org_id" lay-search>
  334. <option value="">请选择部门</option>
  335. {volist name="org" id="i"}
  336. <option value="{$i.id}">{$i.name}</option>
  337. {/volist}
  338. </select> -->
  339. <div id="rangeDepart"></div>
  340. </div>
  341. <div class="layui-input-inline layui-form ml10" style="display:inline-block;width:200px;">
  342. <!-- <label class="layui-form-label" style="width: 60px;">跟进时间</label> -->
  343. <div class="layui-input-inline select-date relative">
  344. <!-- 注意:这一层元素并不是必须的 -->
  345. <input type="hidden" id="istype" value="">
  346. <input type="text" class="layui-input" id="sDate" name="start_date" placeholder="开始日期 - 结束日期"
  347. autocomplete="off">
  348. <div data-type="" class="selecstDateBox layui-hide">
  349. <div data-type="" class="date-flex1">
  350. <div data-type="today" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">今日
  351. </div>
  352. <div data-type="yesterday" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">昨日</div>
  353. <div data-type="week" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">本周
  354. </div>
  355. <div data-type="lastWeek" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">上周</div>
  356. <div data-type="month" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">本月
  357. </div>
  358. <div data-type="lastMonth" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">上月</div>
  359. <div data-type="all" class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">
  360. 累计</div>
  361. </div>
  362. <div data-type="" class="date-box">
  363. <input data-type="" type="text" id="select_sDate" placeholder="选择开始时间 - 结束时间" readonly autocomplete="off"
  364. class="layui-input">
  365. </div>
  366. </div>
  367. </div>
  368. </div>
  369. </div>
  370. <div>
  371. <button class="layui-btn sBtn ml10 submitbtn" lay-submit
  372. lay-filter="table-search">筛选</button>
  373. </div>
  374. </div>
  375. </div>
  376. <div class="layui-card-body">
  377. <table lay-filter="datalist" id="list"></table>
  378. </div>
  379. </div>
  380. </div>
  381. </div>
  382. <!-- 1 -->
  383. {auth:check name="statistics/clue"}
  384. <!-- 2 -->
  385. <div class="layui-tab-item" style="height:90vh;">
  386. <iframe src="clue.html" style="width: 100%;height:100%;" scrolling="0" frameborder="0"></iframe>
  387. </div>
  388. <!-- 2 -->
  389. {/auth:check}
  390. <!-- 4 -->
  391. {auth:check name="statistics/table"}
  392. <div class="layui-tab-item" style="height:90vh;">
  393. <iframe id="iframe04" src="" style="width: 100%;height:100%;" scrolling="0" frameborder="0"></iframe>
  394. </div>
  395. {/auth:check}
  396. <!-- 5 渠道统计 -->
  397. <div class="layui-tab-item" style="height:80vh;">
  398. <iframe id="iframe05" src="" style="width: 100%;height:100%;" scrolling="0" frameborder="0"></iframe>
  399. </div>
  400. <!-- 6 行为统计 -->
  401. <div class="layui-tab-item" style="height:86vh;">
  402. <iframe id="iframe06" src="" style="width: 100%;height:100%;" scrolling="0" frameborder="0"></iframe>
  403. </div>
  404. <!-- 7 高层行为统计 -->
  405. <div class="layui-tab-item" style="height:86vh;">
  406. <iframe id="iframe07" src="" style="width: 100%;height:100%;" scrolling="0" frameborder="0"></iframe>
  407. </div>
  408. <!-- 8 管理层 -->
  409. <div class="layui-tab-item" style="height:86vh;">
  410. <iframe id="iframe08" src="" style="width: 100%;height:100%;" scrolling="0" frameborder="0"></iframe>
  411. </div>
  412. <!-- 9 客户统计列表 -->
  413. <div class="layui-tab-item" style="height:80vh;">
  414. <iframe id="iframe09" src="" style="width: 100%;height:100%;" scrolling="0" frameborder="0"></iframe>
  415. </div>
  416. <!-- 10 总统计 -->
  417. <div class="layui-tab-item" style="height:86vh;">
  418. <iframe id="iframe10" src="" style="width: 100%;height:100%;" scrolling="0" frameborder="0"></iframe>
  419. </div>
  420. <!-- 11 统计总报表 -->
  421. {auth:check name="statistics/new_table_data"}
  422. <div class="layui-tab-item" style="height:86vh;">
  423. <iframe id="iframe11" src="" style="width: 100%;height:100%;" scrolling="0" frameborder="0"></iframe>
  424. </div>
  425. {/auth:check}
  426. {auth:check name="statistics/office_table_data"}
  427. <!-- 12 总经办报表 -->
  428. <div class="layui-tab-item" style="height:86vh;">
  429. <iframe id="iframe12" src="" style="width: 100%;height:100%;" scrolling="0" frameborder="0"></iframe>
  430. </div>
  431. {/auth:check}
  432. </div>
  433. </div>
  434. <!-- -->
  435. <div class="lay-mask layui-hide">
  436. <div class="lay-block">
  437. <div class="lay-title">
  438. <span>表格显示设置</span>
  439. <i class="layui-icon layui-icon-close"></i>
  440. </div>
  441. <div class="layui-content layui-form">
  442. </div>
  443. </div>
  444. </div>
  445. {/block}
  446. {block name="js"}
  447. <script type="text/html" id="org_name">
  448. <a href="customer.html?type=2&org_id={{d.id}}">{{d.org_name}}</a>
  449. </script>
  450. <script src="__STATIC__/layui/layui/lay/modules/xm-select.js" type="text/javascript" charset="utf-8"></script>
  451. <script type="text/javascript" src="__STATIC__/js/Sortable.js"></script>
  452. <script>
  453. layui.use(['table', 'form', 'laydate', 'element'], function () {
  454. let table = layui.table,
  455. form = layui.form,
  456. element = layui.element,
  457. laydate = layui.laydate,
  458. $ = layui.$;
  459. $('body').attr('layadmin-themealias', 'default');
  460. var bodyH = $('.body-h').height() * 0.82;
  461. document.onkeydown = function (event) {
  462. var e = event || window.event || arguments.callee.caller.arguments[0];
  463. if (e && e.keyCode == 13) {
  464. $(".submitbtn").trigger("click");
  465. }
  466. };
  467. //执行一个laydate实例
  468. // laydate.render({
  469. // elem: '#sDate' //指定元素
  470. // });
  471. // laydate.render({
  472. // elem: '#eDate' //指定元素
  473. // });
  474. $('#addWechatTime').click(function () {
  475. $('.selectDateBox').toggleClass('layui-hide');
  476. $('.selecstDateBox').addClass('layui-hide');
  477. })
  478. $('#sDate').click(function () {
  479. $('.selecstDateBox').toggleClass('layui-hide');
  480. $('.selectDateBox').addClass('layui-hide');
  481. })
  482. laydate.render({
  483. elem: '#select_date'
  484. , type: 'date'
  485. , range: true
  486. , format: 'yyyy/MM/dd'
  487. , trigger: 'click',//呼出事件改成click
  488. done: function (value, date, endDate) {
  489. $('.selectDateBox').addClass('layui-hide');
  490. $('#addWechatTime').val(value);
  491. }
  492. });
  493. laydate.render({
  494. elem: '#select_sDate' //指定元素
  495. , type: 'date'
  496. , format: 'yyyy/MM/dd'
  497. , range: true
  498. , trigger: 'click',//呼出事件改成click
  499. done: function (value, date, endDate) {
  500. $('.selecstDateBox').addClass('layui-hide');
  501. $('#sDate').val(value);
  502. }
  503. });
  504. var dateObj = {};
  505. setDate();
  506. function setDate() {
  507. let date = new Date();
  508. let year = date.getFullYear();
  509. let month = date.getMonth() + 1;
  510. let day = date.getDate();
  511. let lastDate = new Date(new Date().getTime() - (1 * 24 * 60 * 60 * 1000));
  512. let lastYear = lastDate.getFullYear();
  513. let lastMonth = lastDate.getMonth() + 1;
  514. let lastDay = lastDate.getDate();
  515. let weekObj = getMondayAndSunday();
  516. let monthObj = getMonthFirstDayAndLastDay();
  517. dateObj = {
  518. today: `${year}/${month}/${day}`,
  519. yesterday: `${lastYear}/${lastMonth}/${lastDay}`,
  520. ...weekObj,
  521. ...monthObj
  522. }
  523. }
  524. var departTree = xmSelect.render({
  525. el: "#rangeDepart",
  526. name: 'select_org_id',
  527. autoRow: true,
  528. filterable: true,
  529. tips: '请选择',
  530. radio: true,
  531. tree: {
  532. show: true,
  533. showFolderIcon: true,
  534. showLine: true,
  535. indent: 20,
  536. expandedKeys: [ -3 ],
  537. //是否严格遵守父子模式
  538. strict: false,
  539. },
  540. height: "200px",
  541. data: [],
  542. //文本显示模式
  543. //处理方式
  544. });
  545. $.ajax({
  546. url: '{:url("statistics/get_person")}',
  547. type: "post",
  548. data: {},
  549. success: function(res) {
  550. departTree.update({data:res})
  551. }
  552. })
  553. $('.date-flex div').click(function () {
  554. let type = $(this).prop('dataset').type;
  555. if (type == 'today') {
  556. $('#select_date').val(`${dateObj.today} - ${dateObj.today}`);
  557. $('#addWechatTime').val(`${dateObj.today} - ${dateObj.today}`);
  558. } else if (type == 'yesterday') {
  559. $('#select_date').val(`${dateObj.yesterday} - ${dateObj.yesterday}`);
  560. $('#addWechatTime').val(`${dateObj.yesterday} - ${dateObj.yesterday}`);
  561. } else if (type == 'week') {
  562. $('#select_date').val(`${dateObj.thisWeekMonday} - ${dateObj.thisWeekSunday}`);
  563. $('#addWechatTime').val(`${dateObj.thisWeekMonday} - ${dateObj.thisWeekSunday}`);
  564. } else if (type == 'lastWeek') {
  565. $('#select_date').val(`${dateObj.lastWeekMonday} - ${dateObj.lastWeekSunday}`);
  566. $('#addWechatTime').val(`${dateObj.lastWeekMonday} - ${dateObj.lastWeekSunday}`);
  567. } else if (type == 'month') {
  568. $('#select_date').val(`${dateObj.thisMonthFirstDay} - ${dateObj.thisMonthLastDay}`);
  569. $('#addWechatTime').val(`${dateObj.thisMonthFirstDay} - ${dateObj.thisMonthLastDay}`);
  570. } else if (type == 'lastMonth') {
  571. $('#select_date').val(`${dateObj.lastMonthFirstDay} - ${dateObj.lastMonthLastDay}`);
  572. $('#addWechatTime').val(`${dateObj.lastMonthFirstDay} - ${dateObj.lastMonthLastDay}`);
  573. } else {
  574. $('#select_date').val('');
  575. $('#sDate').val('')
  576. $('#addWechatTime').val('');
  577. }
  578. $('.selectDateBox').addClass('layui-hide');
  579. })
  580. $('.date-flex1 div').click(function () {
  581. let type = $(this).prop('dataset').type;
  582. if (type == 'today') {
  583. itmesss = dateToYYYYMMDD(dateObj.today);
  584. itmesss2 = dateToYYYYMMDD(dateObj.today);
  585. $('#select_sDate').val(itmesss+' - '+itmesss2);
  586. $('#sDate').val(itmesss+' - '+itmesss2);
  587. } else if (type == 'yesterday') {
  588. itmesss = dateToYYYYMMDD(dateObj.yesterday);
  589. itmesss2 = dateToYYYYMMDD(dateObj.yesterday);
  590. $('#select_sDate').val(itmesss+' - '+itmesss2);
  591. $('#sDate').val(itmesss+' - '+itmesss2);
  592. } else if (type == 'week') {
  593. $('#select_sDate').val(`${dateObj.thisWeekMonday} - ${dateObj.thisWeekSunday}`);
  594. $('#sDate').val(`${dateObj.thisWeekMonday} - ${dateObj.thisWeekSunday}`);
  595. } else if (type == 'lastWeek') {
  596. $('#select_sDate').val(`${dateObj.lastWeekMonday} - ${dateObj.lastWeekSunday}`);
  597. $('#sDate').val(`${dateObj.lastWeekMonday} - ${dateObj.lastWeekSunday}`);
  598. } else if (type == 'month') {
  599. $('#select_sDate').val(`${dateObj.thisMonthFirstDay} - ${dateObj.thisMonthLastDay}`);
  600. $('#sDate').val(`${dateObj.thisMonthFirstDay} - ${dateObj.thisMonthLastDay}`);
  601. } else if (type == 'lastMonth') {
  602. $('#select_sDate').val(`${dateObj.lastMonthFirstDay} - ${dateObj.lastMonthLastDay}`);
  603. $('#sDate').val(`${dateObj.lastMonthFirstDay} - ${dateObj.lastMonthLastDay}`);
  604. } else {
  605. $('#select_sDate').val('');
  606. $('#sDate').val('');
  607. }
  608. $('.selecstDateBox').addClass('layui-hide');
  609. })
  610. function getMondayAndSunday() {
  611. var today = new Date();
  612. //构建当前日期,格式:2022-08-22 00:00:00
  613. var year = today.getFullYear(); //本年
  614. var month = today.getMonth() + 1; //本月
  615. var day = today.getDate(); //本日
  616. var newDate = new Date(year + "/" + month + "/" + day + " 00:00:00"); //年月日拼接
  617. var nowTime = newDate.getTime(); //当前的时间戳
  618. var weekDay = newDate.getDay(); //当前星期 0.1.2.3.4.5.6 【0 = 周日】
  619. var oneDayTime = 24 * 60 * 60 * 1000; //一天的总ms
  620. // 当前星期减去天数,如今天为周五,则本周一为周五的时间戳减去4天的时间戳。但周日特殊,周一至周六是周几的到的weekDay就是几,但是周日的到的为0,需特殊处理
  621. var thisWeekMondayTime = (1 - weekDay) * oneDayTime + nowTime; //本周一的时间戳
  622. if (weekDay == 0) {
  623. // weekDay = 0 为周日,此时本周一时间为周日减去6天的时间
  624. thisWeekMondayTime = nowTime - 6 * oneDayTime
  625. }
  626. var thisWeekSundayTime = thisWeekMondayTime + 6 * 24 * 60 * 60 * 1000 // 本周日
  627. var lastWeekMondayTime = thisWeekMondayTime - 7 * oneDayTime // 上周一
  628. var lastWeekSundayTime = thisWeekMondayTime - oneDayTime // 上周日
  629. var res = {
  630. thisWeekMonday: dateToYYYYMMDD(thisWeekMondayTime),
  631. thisWeekSunday: dateToYYYYMMDD(thisWeekSundayTime),
  632. lastWeekMonday: dateToYYYYMMDD(lastWeekMondayTime),
  633. lastWeekSunday: dateToYYYYMMDD(lastWeekSundayTime),
  634. }
  635. return res;
  636. }
  637. function getMonthFirstDayAndLastDay() {
  638. var date = new Date()
  639. // 值得注意的是,如果day取值为0,意味着取的是date时间的上一个月的最后一天,简单理解:date当前月的第一天,再减去一天
  640. var thisMonthFirstDay = date.setDate(1) // 本月第一天
  641. var thisMonthLastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0) // 本月最后一天
  642. var lastMonthFirstDay = new Date(date.getFullYear(), date.getMonth() - 1, 1) // 上月第一天
  643. var lastMonthLastDay = date.setDate(0) // 上月最后一天
  644. // var day = new Date(date.getFullYear(), date.getMonth(), 0).getDate()
  645. // var lastMonthLastDay = new Date(date.getFullYear(), date.getMonth() - 1, day) // 上月最后一天
  646. var res = {
  647. thisMonthFirstDay: dateToYYYYMMDD(thisMonthFirstDay),
  648. thisMonthLastDay: dateToYYYYMMDD(thisMonthLastDay),
  649. lastMonthFirstDay: dateToYYYYMMDD(lastMonthFirstDay),
  650. lastMonthLastDay: dateToYYYYMMDD(lastMonthLastDay),
  651. }
  652. return res
  653. }
  654. function dateToYYYYMMDD(date) {
  655. var time = new Date(date);
  656. var y = time.getFullYear();
  657. var m = (time.getMonth() + 1);
  658. m = m > 9 ? m : '0' + m;
  659. var d = time.getDate();
  660. d = d > 9 ? d : '0' + d;
  661. return y + "/" + m + "/" + d;
  662. }
  663. $('.channelTips').hide();
  664. $(document).click('layui-tjbtn', function () {
  665. $('#iframe02').attr('src', 'follow_up.html');
  666. })
  667. $('.clue-statis').click(function () {
  668. $('.channelTips').hide();
  669. })
  670. $('.customer-data').click(function () {
  671. $('.channelTips').hide();
  672. })
  673. $('.large-screen').click(function () {
  674. $('.channelTips').hide()
  675. $('#iframe03').attr('src', 'inspectors.html');
  676. })
  677. $('.large-table').click(function () {
  678. $('.channelTips').hide()
  679. $('#iframe04').attr('src', 'table.html');
  680. })
  681. $('.statistics_data').click(function () {
  682. $('.channelTips').show()
  683. $('#iframe05').attr('src', 'channelStatistics.html');
  684. })
  685. $('.behavior_statistics').click(function () {
  686. $('.channelTips').hide()
  687. $('#iframe06').attr('src', 'behaviorStatistics.html');
  688. })
  689. $('.high_behavior_statistics').click(function () {
  690. $('.channelTips').hide()
  691. $('#iframe07').attr('src', 'highBehaviorStatistics.html');
  692. })
  693. $('.manage_statistics').click(function () {
  694. $('.channelTips').hide()
  695. $('#iframe08').attr('src', 'manageStatistics.html');
  696. })
  697. $('.customer_list').click(function () {
  698. $('.channelTips').hide()
  699. $('#iframe09').attr('src', 'customer_list.html');
  700. })
  701. $('.general_statistics').click(function () {
  702. $('.channelTips').hide()
  703. $('#iframe10').attr('src', 'generalStatistics.html');
  704. })
  705. $('.large-tables').click(function () {
  706. $('.channelTips').hide()
  707. $('#iframe11').attr('src', 'new_table_data.html');
  708. })
  709. $('.office_statistics').click(function () {
  710. $('.channelTips').hide()
  711. $('#iframe12').attr('src', 'office_table_data.html');
  712. })
  713. let cols1 = [[
  714. { templet: '#org_name', title: '部门名称', width: '11%', align: 'center', 'fixed': 'left' },
  715. { field: 'employee_num', title: '人效', width: '5%', align: 'center' },
  716. { field: 'unconfirm_num', title: '待确认', width: '5%', align: 'center' },
  717. { field: 'measure_num', title: '量房数', width: '5%', align: 'center' },
  718. { field: 'shop_num', title: '到店数', width: '5%', align: 'center' },
  719. { field: 'maika_num', title: '无忧数', width: '5%', align: 'center' },
  720. { field: 'meet_num', title: '见面数', width: '5%', align: 'center' },
  721. { field: 'meet_lv', title: '见面率', width: '7%', align: 'center' },
  722. { field: 'deposit_num', title: "定金数", width: '5%', align: 'center'},
  723. { field: 'deposit_lv', title: "交定率", width: '5%', align: 'center'},
  724. { field: 'deposit_total_money', title: "定金金额", width: '7%', align: 'center'},
  725. { field: 'signed_num', title: "合同数", width: '5%', align: 'center'},
  726. { field: 'signed_lv', title: "合同率", width: '7%', align: 'center'},
  727. { field: 'signed_total_money', title: "合同金额", width: '7%', align: 'center'},
  728. { field: 'average_val', title: '均单值', width: '7%', align: 'center' },
  729. { field: 'clue_num', title: '获客量', width: '5%', align: 'center' },
  730. { field: 'customer_num', title: '线索量', width: '5%', align: 'center' },
  731. { field: 'effective_num', title: '有效线索量', width: '5%', align: 'center' },
  732. { field: 'effective_lv', title: '有效率', width: '5%', align: 'center' }
  733. ]];
  734. let cols2 = [[
  735. { field: 'name', title: '员工名称', width: '11%', align: 'center', 'fixed': 'left' },
  736. { field: 'org_name', title: '部门名称', width: '10%', align: 'center' },
  737. { field: 'unconfirm_num', title: '待确认', width: '6%', align: 'center' },
  738. { field: 'measure_num', title: '量房数', width: '6%', align: 'center' },
  739. { field: 'shop_num', title: '到店数', width: '6%', align: 'center' },
  740. { field: 'maika_num', title: '无忧数', width: '5%', align: 'center' },
  741. { field: 'meet_num', title: '见面数', width: '6%', align: 'center' },
  742. { field: 'meet_lv', title: '见面率', width: '6%', align: 'center' },
  743. { field: 'deposit_num', title: "定金数", width: '5%', align: 'center' },
  744. { field: 'deposit_lv', title: "交定率", width: '5%', align: 'center' },
  745. { field: 'deposit_total_money', title: "定金金额", width: '5%', align: 'center' },
  746. { field: 'signed_num', title: "合同数", width: '5%', align: 'center' },
  747. { field: 'signed_lv', title: "合同率", width: '5%', align: 'center' },
  748. { field: 'signed_total_money', title: "合同金额", width: '5%', align: 'center' },
  749. { field: 'average_val', title: '均单值', width: '5%', align: 'center' },
  750. { field: 'clue_num', title: '获客量', width: '5%', align: 'center' },
  751. { field: 'customer_num', title: '线索量', width: '5%', align: 'center' },
  752. { field: 'effective_num', title: '有效线索量', width: '5%', align: 'center' },
  753. { field: 'effective_lv', title: '有效率', width: '5%', align: 'center' }
  754. ]];
  755. let cols = cols1;
  756. let url = '{:url("statistics/customer")}';
  757. if (location.search.search('type=2') > 0) {
  758. cols = cols2;
  759. url = '{:url("statistics/customer", ["type"=>2, "org_id"=>$Request.get.org_id])}';
  760. $('#istype').val(2);
  761. }
  762. table.render({
  763. elem: '#list'
  764. , url: url
  765. , page: true
  766. , height: bodyH
  767. , cols: cols
  768. , id: 'tablelist'
  769. });
  770. function setYMD(time) {
  771. let dateTime = new Date(time);
  772. let year = dateTime.getFullYear();
  773. let Month = dateTime.getMonth() + 1;
  774. let days = dateTime.getDate();
  775. return `${year}-${Month > 9 ? Month : '0' + Month}-${days > 9 ? days : '0' + days}`;
  776. }
  777. var dateArr = {};
  778. var today = new Date().getTime();
  779. var oneTime = 24 * 60 * 60 * 1000;
  780. var threeDay1 = today - 3 * oneTime;
  781. var sevenDay1 = today - 6 * oneTime;
  782. var oneMonth = today - 30 * oneTime;
  783. dateArr = {
  784. nowS: setYMD(today),
  785. nowE: setYMD(today),
  786. threeDayS: setYMD(threeDay1),
  787. threeDayE: setYMD(today),
  788. sevenDayS: setYMD(sevenDay1),
  789. sevenDayE: setYMD(today),
  790. oneMonthS: setYMD(oneMonth),
  791. oneMonthE: setYMD(today),
  792. }
  793. $('.lineicon').on('click', function () {
  794. window.parent.reloadInternet();
  795. // location.href="/dashboard/index/welcome.html";
  796. })
  797. $('#timeBtn').on('click', function (e) {
  798. if (!!(e.target.localName != 'input')) return;
  799. let o = document.querySelector('#timeBtn').children;
  800. if (e.target.classList.contains('layui-btn-primary') == true) {
  801. for (var i = 0; i < o.length; i++) {
  802. o[i].className = 'layui-btn';
  803. }
  804. $('#sDate').val('');
  805. $('#eDate').val('');
  806. return;
  807. } else {
  808. for (var i = 0; i < o.length; i++) {
  809. o[i].className = 'layui-btn';
  810. }
  811. e.target.className = 'layui-btn layui-btn-primary';
  812. if (!!(e.target.className.indexOf('layui-btn-primary') > 0)) {
  813. if (e.target.value == '今日') {
  814. $('#sDate').val(dateArr.nowS);
  815. $('#eDate').val(dateArr.nowE);
  816. } else if (e.target.value == '3天') {
  817. $('#sDate').val(dateArr.threeDayS);
  818. $('#eDate').val(dateArr.threeDayE);
  819. } else if (e.target.value == '7天') {
  820. $('#sDate').val(dateArr.sevenDayS);
  821. $('#eDate').val(dateArr.sevenDayE);
  822. } else {
  823. $('#sDate').val(dateArr.oneMonthS);
  824. $('#eDate').val(dateArr.oneMonthE);
  825. }
  826. }
  827. }
  828. })
  829. // ---------表格设置---------- //
  830. window.dialogFunc = function (tableData,types) {
  831. renderTableSwitch(tableData,types);
  832. $('.lay-mask').removeClass('layui-hide');
  833. }
  834. function renderTableSwitch(data,types) {
  835. let htmls = data.map((item, index) => {
  836. return `<div class="lay-item sort_time">
  837. <div>
  838. <img style="display:${types==55?'none':'block'}" src="__STATIC__/img/sorticon.png" width="16px" alt="">
  839. <span>${item.name}</span>
  840. </div>
  841. <div>
  842. <input type="checkbox" lay-filter="tableSort" ${item.show == 1 ? 'checked' : ''} name="${item.field}" lay-skin="switch">
  843. </div>
  844. </div>`;
  845. }).join('');
  846. $('.layui-content').html(htmls);
  847. setTimeout(() => {
  848. form.render();
  849. var check='';
  850. var names='';
  851. form.on('switch(tableSort)', function (data) {
  852. getdatalist(types);
  853. })
  854. if(types != 55){
  855. new Sortable($('.layui-content')[0], {
  856. handle: '.lay-item', // handle's class
  857. animation: 150,
  858. // 结束拖拽
  859. onEnd: function (/**Event*/evt) {
  860. getdatalist(types,0);
  861. },
  862. });
  863. }
  864. }, 300)
  865. }
  866. function getdatalist(types){
  867. let getCheckedField = $('.sort_time');
  868. let itemArr = [];
  869. let check;
  870. getCheckedField.each(function (i) {
  871. let ischeck = $(this).find('input').prop("checked");
  872. if(ischeck){
  873. check = 1
  874. }else{
  875. check = 0
  876. }
  877. let names = $(this).find('input').attr('name');
  878. itemArr.push({name:names, show: check, sort: i + 1 });
  879. })
  880. var datajson = JSON.stringify(itemArr);
  881. var typeVal = localStorage.getItem('XQ$SORT');
  882. $.ajax({
  883. type: "post",
  884. url: '{:url("statistics/fieldSetting")}',
  885. data: {
  886. type: typeVal,
  887. content:datajson
  888. },
  889. success: function (res) {
  890. window.ajaxslist();
  891. }
  892. })
  893. }
  894. $('.layui-icon-close').click(function () {
  895. $('.lay-mask').addClass('layui-hide');
  896. })
  897. $('.lay-block').click(function(e) {
  898. e.stopPropagation();
  899. })
  900. $('.lay-mask').click(function() {
  901. $(this).addClass('layui-hide');
  902. })
  903. // ---------表格设置---------- //
  904. form.on('submit(table-search)', function (data) {
  905. let field = data.field;
  906. let element = $('.layui-btn-primary');
  907. if (element && element[0]) {
  908. let el = element[0].value;
  909. }
  910. let option = {
  911. where: field
  912. , page: {
  913. curr: 1
  914. }
  915. };
  916. if ($('#istype').val() == 2) {
  917. option.cols = cols2
  918. } else {
  919. option.cols = cols1
  920. }
  921. //执行重载
  922. table.reload('tablelist', option);
  923. });
  924. function copyTextToClipboard(text) {
  925. if (navigator.clipboard && navigator.clipboard.writeText) {
  926. // 使用 Clipboard API
  927. navigator.clipboard.writeText(text)
  928. .then(function() {
  929. layer.msg('复制成功');
  930. })
  931. .catch(function(err) {
  932. fallbackCopyTextToClipboard(text);
  933. });
  934. } else {
  935. // 回退到 execCommand 方法
  936. fallbackCopyTextToClipboard(text);
  937. }
  938. }
  939. function fallbackCopyTextToClipboard(text) {
  940. var textarea = document.createElement('textarea');
  941. textarea.value = text;
  942. document.body.appendChild(textarea);
  943. textarea.select();
  944. document.execCommand('copy');
  945. document.body.removeChild(textarea);
  946. layer.msg('复制成功');
  947. }
  948. $('.copy').click(function(){
  949. let l = $(this).data("link");
  950. copyTextToClipboard(l);
  951. });
  952. })
  953. </script>
  954. {/block}