me_recommendinfo.jsp 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547
  1. <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
  2. <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
  3. <%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
  4. <%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
  5. <%
  6. String path = request.getContextPath();
  7. String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort() + path+"/";
  8. request.setAttribute("contextPath", basePath);
  9. %>
  10. <!DOCTYPE html>
  11. <html lang="en">
  12. <head>
  13. <meta charset="UTF-8">
  14. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  15. <meta name="apple-mobile-web-app-capable" content="yes">
  16. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  17. <meta name="format-detection" content="telephone=no">
  18. <title>推介详情</title>
  19. <base href="${contextPath}">
  20. <script src="app/lib/flexible.js"></script>
  21. <script type="text/javascript" src="res/js/jquery.min.js"></script>
  22. <script type="text/javascript" src="res/js/layer/layer.min.js"></script>
  23. <script type="text/javascript" src="app/js/public.js"></script>
  24. <script type="text/javascript" src="app/js/imgUp.js"></script>
  25. <script src="app/lib/swiper-4.3.2.min.js"></script>
  26. <link rel="stylesheet" href="app/lib/flexible.css">
  27. <link rel="stylesheet" href="app/lib/swiper-4.3.2.min.css" />
  28. <link rel="stylesheet" href="app/css/basem.css">
  29. <link rel="stylesheet" href="app/css/logome.css">
  30. <link rel="stylesheet" href="app/css/public.css">
  31. <link rel="stylesheet" href="app/css/index.css">
  32. <link rel="stylesheet" href="app/css/sc_common.css">
  33. <link rel="stylesheet" href="app/css/sc_img.css">
  34. <style type="text/css">
  35. .terminated {
  36. position: absolute;
  37. top: 0;
  38. right: 0.5rem;
  39. }
  40. </style>
  41. </head>
  42. <body>
  43. <div class="titbox blubg">
  44. <a class="titreturn left" href="javascript:void(0)" onclick="javascript:history.go(-1)"><img src="app/img/fanhui16@2x.png" alt=""></a>
  45. <h1>推介进度</h1>
  46. </a>
  47. </div>
  48. <div class="top50 recomDeta">
  49. <ul class="kindul productul recommUl orderUL">
  50. <li class="current">
  51. <a href="javascript:void(0)" title="odProgress">
  52. 推介进度
  53. <i></i>
  54. </a>
  55. </li>
  56. <li>
  57. <a href="javascript:void(0)" title="odNum">
  58. 客户详情
  59. </a>
  60. </li>
  61. <li>
  62. <a href="javascript:void(0)" title="odDet">
  63. 产品详情
  64. </a>
  65. </li>
  66. </ul>
  67. <div class="orderInfo">
  68. <div class="processTrace hide show" id="odProgress">
  69. <div class="curve">
  70. <p>当前状态:<span class='state'>
  71. <c:if test="${orderType=='1'}">
  72. <c:choose>
  73. <c:when test="${orderState=='0'}">备案成功</c:when>
  74. <c:when test="${orderState=='1'}">受理成功</c:when>
  75. <c:when test="${orderState=='2'}">邀约成功</c:when>
  76. <c:when test="${orderState=='3'}">到访成功</c:when>
  77. <c:when test="${orderState=='4'}">认购成功</c:when>
  78. <c:when test="${orderState=='5'}">签约成功</c:when>
  79. <c:when test="${orderState=='6'}">确认签约</c:when>
  80. <c:otherwise>
  81. 交房
  82. </c:otherwise>
  83. </c:choose>
  84. </c:if>
  85. <c:if test="${orderType=='2' }">
  86. <c:choose>
  87. <c:when test="${orderState=='0'}">备案成功</c:when>
  88. <c:when test="${orderState=='1'}">订单推进中</c:when>
  89. <c:when test="${orderState=='2'}">签约成功</c:when>
  90. <c:when test="${orderState=='3'}">确认签约</c:when>
  91. </c:choose>
  92. </c:if>
  93. </span></p>
  94. <p class="curTime">更新日期:<span><fmt:formatDate value="${modifyDate}" pattern="yyyy-MM-dd" /></span></p>
  95. </div>
  96. <div class="orderUls">
  97. <ul class='haveWrite'>
  98. <c:forEach var="list" items="${list}" varStatus="status">
  99. <c:if test="${orderType=='2'}">
  100. <%-- <c:choose>
  101. <c:when test="${status.index=='0' || status.index=='1' || status.index=='3' }">
  102. <li class="${status.index==orderState?'currentLi':''}">
  103. <div class="dott">
  104. <span class="dottImg"></span>
  105. <!-- <span></span> -->
  106. </div>
  107. <div class="flowpathCont">
  108. <p class="trackingT">${list.name}</p>
  109. <p class="trackingTime ">${list.fill_content}</p>
  110. <p class="trackingTime "><fmt:formatDate value="${list.fill_time}" pattern="yyyy-MM-dd" /></p>
  111. </div>
  112. </li>
  113. </c:when>
  114. <c:otherwise> --%>
  115. <li class="${status.index==orderState?'currentLi':''}">
  116. <div class="dott">
  117. <span class="dottImg"></span>
  118. <span>${list.action}</span>
  119. </div>
  120. <div class="flowpathCont">
  121. <p class="trackingT">${list.name}</p>
  122. <c:choose>
  123. <c:when test="${list.fillflg == '1'}">
  124. <a href="javascript:void(0)" onclick="fill('${orderState+1}');" class="blubg planWrite">进度填报</a>
  125. </c:when>
  126. <c:otherwise>
  127. <p class="trackingTime ">${list.fill_content}</p>
  128. <p class="trackingTime "><fmt:formatDate value="${list.fill_time}" pattern="yyyy-MM-dd" /></p>
  129. </c:otherwise>
  130. </c:choose>
  131. <c:set value="${ fn:split(list.imge_url1, ',') }" var="imge_url1" />
  132. <c:if test="${imge_url1!= null && fn:length(imge_url1) > 0}">
  133. <div class="surePic">
  134. <c:forEach items="${imge_url1}" var="img">
  135. <c:if test="${not empty img}">
  136. <img src="${img}" alt="">
  137. </c:if>
  138. </c:forEach>
  139. </div>
  140. </c:if>
  141. </div>
  142. </li>
  143. <%-- </c:otherwise>
  144. </c:choose> --%>
  145. </c:if>
  146. <c:if test="${orderType=='1'}">
  147. <%-- <c:choose>
  148. <c:when test="${status.index=='0' || status.index=='1' || status.index=='6' }">
  149. <li class="${status.index==orderState?'currentLi':''}">
  150. <div class="dott">
  151. <span class="dottImg"></span>
  152. <!-- <span></span> -->
  153. </div>
  154. <div class="flowpathCont">
  155. <p class="trackingT">${list.name}</p>
  156. <p class="trackingTime ">${list.fill_content}</p>
  157. <p class="trackingTime "><fmt:formatDate value="${list.fill_time}" pattern="yyyy-MM-dd" /></p>
  158. </div>
  159. </li>
  160. </c:when>
  161. <c:otherwise> --%>
  162. <li class="${status.index==orderState?'currentLi':''}">
  163. <div class="dott">
  164. <span class="dottImg"></span>
  165. <span>${list.action}</span>
  166. </div>
  167. <div class="flowpathCont">
  168. <p class="trackingT">${list.name}</p>
  169. <c:choose>
  170. <c:when test="${list.fillflg == '1'}">
  171. <%-- <c:choose>
  172. <c:when test="${status.index=='5'}">
  173. <a href="javascript:void(0)" onclick="fill(2);" class="blubg planWrite">进度填报</a>
  174. </c:when>
  175. <c:otherwise>
  176. </c:otherwise>
  177. </c:choose> --%>
  178. <a href="javascript:void(0)" onclick="fill('${orderState+1}');" class="blubg planWrite">进度填报</a>
  179. </c:when>
  180. <c:otherwise>
  181. <p class="trackingTime ">${list.fill_content}</p>
  182. <p class="trackingTime "><fmt:formatDate value="${list.fill_time}" pattern="yyyy-MM-dd" /></p>
  183. </c:otherwise>
  184. </c:choose>
  185. <c:set value="${ fn:split(list.imge_url1, ',') }" var="imge_url1" />
  186. <c:if test="${imge_url1!= null && fn:length(imge_url1) > 0}">
  187. <div class="surePic">
  188. <c:forEach items="${imge_url1}" var="img">
  189. <c:if test="${not empty img}">
  190. <img src="${img}" alt="">
  191. </c:if>
  192. </c:forEach>
  193. </div>
  194. </c:if>
  195. </div>
  196. </li>
  197. <%-- </c:otherwise>
  198. </c:choose> --%>
  199. </c:if>
  200. </c:forEach>
  201. </ul>
  202. </div>
  203. </div>
  204. <div id="odNum" class="hide">
  205. <div class="whbg ">
  206. <div class="safe">
  207. <ul>
  208. <li class="merecli">
  209. <p class="meaddle left">客户姓名:</p>
  210. <input class="meaddinpu left" type="text" value="${maptemp['name']}" readonly="readonly">
  211. </li>
  212. <li class="merecli">
  213. <p class="meaddle left">联系电话:</p><a style="color: rgb(16, 77, 159);" href="tel:${maptemp['phone']}">${maptemp['phone']}</a>
  214. </li>
  215. <li class="merecli">
  216. <p class="meaddle left">工作单位:</p>
  217. <input class="meaddinpu left" type="text" value="${maptemp['company']}" readonly="readonly">
  218. </li>
  219. <li class="merecli">
  220. <p class="meaddle left">所在区域:</p>
  221. <input class="meaddinpu left" type="text" value="${maptemp['attributionArea']}" readonly="readonly">
  222. </li>
  223. <li class="merecli meaddlila">
  224. <p class="meaddle left">详细地址:</p>
  225. <textarea class="meaddinpu left" style="border:none;padding-top:0.1rem;" name="" id="" readonly="readonly">${maptemp['address']}</textarea>
  226. </li>
  227. </ul>
  228. </div>
  229. </div>
  230. <div class="whbg top10">
  231. <div class="safe">
  232. <ul>
  233. <li class="merecli">
  234. <p class="meaddle left">跟单人员:</p>
  235. <input class="meaddinpu left graytxt" type="text" value="${maptemp['salerName']}" readonly="readonly">
  236. </li>
  237. <li class="merecli">
  238. <p class="meaddle left">联系方式:</p>
  239. <input class="meaddinpu left graytxt" type="text" value="${maptemp['salerPhone']}" readonly="readonly">
  240. </li>
  241. </ul>
  242. </div>
  243. </div>
  244. </div>
  245. <div id="odDet" class="hide">
  246. <div class="referrals">
  247. <ul id="productlist">
  248. <c:forEach var="listproduct" items="${listproduct}" varStatus="status">
  249. <li>
  250. <a href='web/mgmProduct/detail.cs?productid=${listproduct.productId}&plat=H5'>
  251. <div class="referinfo">
  252. <img src=" ${listproduct.fill_time!=''?listproduct.productImg:'app/img/jz2@2x.png'}" alt="">
  253. <div class="referCont">
  254. <p class="refertit">${listproduct.productName}</p>
  255. <p>
  256. <span class="designation">佣金:</span>
  257. <span class="graytxt"> ${listproduct.commissionRate}</span>
  258. </p>
  259. <p>
  260. <span class="designation">售价:</span>
  261. <span class="price">¥${listproduct.price}${listproduct.unit}</span>
  262. </p>
  263. <p>
  264. <span class="designation">意向数量:</span>
  265. <span class="blutxt">${listproduct.willCnt}${listproduct.unit}</span>
  266. </p>
  267. </div>
  268. </div>
  269. </a>
  270. </li>
  271. </c:forEach>
  272. </ul>
  273. </div>
  274. </div>
  275. </div>
  276. </div>
  277. <script type="text/javascript">
  278. var page=1;
  279. var totalpage="${pageTotal}";
  280. var totalheight=0 ;
  281. var totalheight2=0 ;
  282. $(window).scroll(function(){
  283. totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop());
  284. if($(document).height() == totalheight){
  285. page++;
  286. if(page<=totalpage){
  287. $.ajax({
  288. type: 'POST',
  289. url: '${contextPath}web/mgmOrder/orderPruductDetails.cs?page='+page,
  290. dataType:"html",
  291. data:"",
  292. success: function(html){
  293. $('#productlist').append(html);
  294. }
  295. });
  296. }else{
  297. page = totalpage ;
  298. }
  299. }
  300. });
  301. //填报进度触发
  302. function fill(obj){
  303. var orderState = "${orderState}";
  304. var orderType="${orderType}"
  305. if(orderState=='4' && orderType=="1"){
  306. $("#selectmoney").show();
  307. $("#blubtnsuccess").attr("onclick","submit_form_commission()");
  308. }else if(orderState=='1' && orderType=="2"){
  309. $("#selectmoney").show();
  310. $("#blubtnsuccess").attr("onclick","submit_form_commission()");
  311. }else{
  312. $("#spgl").hide();
  313. $("#tbjd").show();
  314. }
  315. $("#orderState").val(obj);
  316. }
  317. //签约提交
  318. function submit_form_commission(){
  319. var selecttype = $("#selecttype").val();
  320. $("#commissionMeans").val(selecttype);
  321. var t = true;
  322. if(selecttype=='1'){
  323. $("input[validte='true']").each(function(){
  324. if(t){
  325. var val = $(this).val();
  326. if(val==""){
  327. layer.msg($(this).attr("validtemsg"));
  328. t=false;
  329. }
  330. }
  331. });
  332. }else if(selecttype=='2'){
  333. $(".sellInfo input[type='text']").each(function(){
  334. if(t){
  335. var val = $(this).val();
  336. if(val==""){
  337. layer.msg($(this).attr("validtemsg"));
  338. t=false;
  339. }
  340. }
  341.   });
  342. }
  343. if(t){
  344. if($("#presentationCondition").val()==''){
  345. layer.msg("请填写情况说明");
  346. return false;
  347. }
  348. }else {
  349. return false;
  350. }
  351. $.ajax({
  352. url:"${contextPath}/web/mgmOrder/signAcntract.cs",
  353. type:"post",
  354. data: $('#orderinfo').serialize(),
  355. success:function(data){
  356. var datas=eval(data.data);
  357. console.log(data);
  358. if (data.ret == 1) {
  359. layer.msg(data.msg);
  360. location.reload();
  361. }else{
  362. layer.alert(data.msg);
  363. }
  364. },
  365. error:function(e){
  366. alert("错误!!");
  367. }
  368. });
  369. }
  370. //一般提交
  371. function submit_form(code){
  372. if($("#presentationCondition").val()==''){
  373. layer.msg("请填写情况说明");
  374. return false;
  375. }
  376. $.ajax({
  377. url:"${contextPath}/web/mgmOrder/orderFillProgress.cs",
  378. type:"post",
  379. data: $('#orderinfo').serialize(),
  380. success:function(data){
  381. var datas=eval(data.data);
  382. console.log(data);
  383. if (data.ret == 1) {
  384. layer.msg(data.msg);
  385. location.reload();
  386. }else{
  387. layer.alert(data.msg);
  388. }
  389. },
  390. error:function(e){
  391. alert("错误!!");
  392. }
  393. });
  394. }
  395. </script>
  396. <div id="tbjd" class="recomMask" style="display:none;">
  397. <div class="recomWrite">
  398. <form action="" id="orderinfo">
  399. <input type="hidden" name="orderId" value="${orderId}"/>
  400. <input type="hidden" name="orderState" id="orderState" value="${orderState}"/>
  401. <input type="hidden" name="commissionMeans" id="commissionMeans"/>
  402. <p class="sharetit"><img src="app/img/line.png" alt="">进度填报<img src="app/img/line.png" alt=""><img onclick="div_colse('tbjd')" src="app/img/x.png" alt="" class="writeCancel"></p>
  403. <c:if test="${listproduct!= null && fn:length(listproduct) > 0}">
  404. <div class="recomP" id="spgl">
  405. <!-- 主导销售 -->
  406. <div class="sellInfo">
  407. <p class="blutxt">商品管理</p>
  408. <c:forEach var="listproduct" items="${listproduct}" varStatus="status">
  409. <input name="productId" type="hidden" value="${listproduct.id}"/>
  410. <div class="sellGoods">
  411. <div>
  412. <span class="htxt fl">${listproduct.productName}</span>
  413. <input type="text" placeholder="" name="productName" class="redtxt fr" readonly="readonly" value="¥${listproduct.price}元/${listproduct.unit}">
  414. </div>
  415. <div >
  416. <span class="fl">佣金比例金额:</span>
  417. <input type="text" name="commissionRate" onkeyup="clearNoNum(this)" class="fr" validte="true" validtemsg="请输入佣金比例金额" value="${listproduct.commissionRate}">
  418. </div>
  419. <div class="zdxs">
  420. <p class="fl">溢出价佣金比例:</p>
  421. <input type="text" name="commissionRateYc" onkeyup="clearNoNum(this)" class="fr" validtemsg="请输入溢出价佣金比例">
  422. </div>
  423. <div>
  424. <span class="fl">认购数量</span>
  425. <input type="text" name="numbers" class="fr" onkeyup="clearNoNum(this)" value="${listproduct.willCnt}" validte="true" validtemsg="请输入认购数量" >
  426. </div>
  427. <div class="zdxs">
  428. <span class="fl">标准价金额:</span>
  429. <input type="text" name="standardAmount" onkeyup="clearNoNum(this)" class="fr" validtemsg="请输入标准价金额" >
  430. </div>
  431. <div >
  432. <span class="htxt fl">成交金额:</span>
  433. <input type="text" name="volumeTransaction" onkeyup="clearNoNum(this)" class="fr" validte="true" validtemsg="请输入成交金额" >
  434. </div>
  435. </div>
  436. </c:forEach>
  437. <div class="Contract">
  438. <span class="redtxt fl">合同金额:</span>
  439. <input type="text" placeholder="" class="redtxt fr" onkeyup="clearNoNum(this)" name="contractGrandTotal" validte="true" validtemsg="请输入合同金额">
  440. </div>
  441. </div>
  442. </div>
  443. </c:if>
  444. <div class="recomP">
  445. <p>情况说明:</p>
  446. <textarea name="presentationCondition" id="presentationCondition" cols="30" rows="4" placeholder="请输入情况说明" class="contents"></textarea>
  447. <!-- <p>上传图片 <span class="fr">(最多可上传五张图片)</span></p>
  448. <div class="planPic">
  449. <input type="file">
  450. </div> -->
  451. <div class="img-box full">
  452. <section class=" img-section">
  453. <p >上传图片:<span class="fr">(最多可上传五张图片)</span></p>
  454. <div class="z_photo upimg-div clear" >
  455. <section class="z_file fl">
  456. <img src="app/img/shangchuan@2x.png" class="add-img">
  457. <input type="file" name="file" id="file" class="file" value="" accept="image/jpg,image/jpeg,image/png,image/bmp" multiple />
  458. </section>
  459. </div>
  460. </section>
  461. </div>
  462. <aside class="mask works-mask">
  463. <div class="mask-content">
  464. <p class="del-p ">您确定要删除吗?</p>
  465. <p class="check-p"><span class="del-com wsdel-ok">确定</span><span class="wsdel-no">取消</span></p>
  466. </div>
  467. </aside>
  468. <a id="blubtnsuccess" href="javascript:void(0)" onclick="submit_form();" class="blubtn bluSucess">填报完成</a>
  469. </form>
  470. </div>
  471. </div>
  472. </div>
  473. <div id="selectmoney" class="recomMask" style="display:none;">
  474. <div class="recomWrite">
  475. <p class="sharetit"><img src="app/img/line.png" alt="">进度填报<img src="app/img/line.png" alt=""><img onclick="div_colse('selectmoney')" src="app/img/x.png" alt="" class="writeCancel"></p>
  476. <div class="recomMoney">
  477. <p>请选择佣金计算方式</p>
  478. <div class="moneyway">
  479. <a href="javacript:void(0)" onclick="selectmoney('1');" class="fl active">信息推介</a>
  480. <a href="javacript:void(0)" onclick="selectmoney('2');" class="fr">主导销售</a>
  481. <input type="hidden" id="selecttype" value="1"/>
  482. </div>
  483. <p class="top50"><img src="app/img/notice@2x.png" alt="">佣金以实际发放为准,此处仅做参考</p>
  484. </div>
  485. <a href="javacript:void(0)" onclick="next();" class="blubtn bluSucess">下一步</a>
  486. </div>
  487. </div>
  488. <script type="text/javascript">
  489. //选中改变值
  490. function selectmoney(obj){
  491. $("#selecttype").val(obj);
  492. }
  493. //下一步处理
  494. function next(){
  495. $(".zdxs").hide();
  496. var selecttype = $("#selecttype").val();
  497. if(selecttype=="2"){
  498. $(".zdxs").show();
  499. }else{
  500. $(".zdxs").hide();
  501. }
  502. $("#selectmoney").hide();
  503. $("#tbjd").show();
  504. }
  505. function clearNoNum(obj){
  506. obj.value = obj.value.replace(/[^\d.]/g,""); //清除“数字”和“.”以外的字符
  507. obj.value = obj.value.replace(/\.{2,}/g,"."); //只保留第一个. 清除多余的
  508. obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
  509. // obj.value = obj.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3');//只能输入两个小数
  510. if(obj.value.indexOf(".")< 0 && obj.value !=""){//以上已经过滤,此处控制的是如果没有小数点,首位不能为类似于 01、02的金额
  511. obj.value= parseFloat(obj.value);
  512. }
  513. }
  514. function div_colse(id){
  515. $("#"+id).hide();
  516. }
  517. </script>
  518. </body>
  519. </html>