order_add.php 39 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974
  1. <?php
  2. require_once 'conn.php';
  3. checkLogin();
  4. $page = $_GET['Page'] ?? '';
  5. $keys = urlencode($_GET['Keys'] ?? '');
  6. $customerId = isset($_GET['customer_id']) ? intval($_GET['customer_id']) : 0; // 添加获取客户ID参数
  7. $hrefstr = "keys=$keys&Page=$page";
  8. // 如果有客户ID,获取客户信息
  9. $customerInfo = null;
  10. $contactOptions = '<option value="">请选择联系人</option>';
  11. if ($customerId > 0) {
  12. $customerQuery = $conn->query("SELECT c.id, c.cs_code, c.cs_company
  13. FROM customer c
  14. WHERE c.id = " . $customerId);
  15. if ($customerQuery && $customerQuery->num_rows > 0) {
  16. $customerInfo = $customerQuery->fetch_assoc();
  17. // 获取该客户的联系人列表,不再自动选择第一个联系人
  18. $contactsQuery = $conn->query("SELECT id, contact_name FROM customer_contact
  19. WHERE customer_id = " . $customerId);
  20. if ($contactsQuery && $contactsQuery->num_rows > 0) {
  21. // 移除自动选择联系人的逻辑
  22. while ($contact = $contactsQuery->fetch_assoc()) {
  23. $contactOptions .= '<option value="' . $contact['id'] . '">' .
  24. htmlspecialcharsFix($contact['contact_name']) . '</option>';
  25. }
  26. }
  27. }
  28. }
  29. ?>
  30. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  31. <html xmlns="http://www.w3.org/1999/xhtml">
  32. <head>
  33. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  34. <title>新增订单</title>
  35. <link rel="stylesheet" href="css/common.css" type="text/css" />
  36. <link rel="stylesheet" href="css/alert.css" type="text/css" />
  37. <script src="js/jquery-1.7.2.min.js"></script>
  38. <script src="js/js.js"></script>
  39. <style>
  40. body {
  41. margin: 0;
  42. padding: 20px;
  43. background: #fff;
  44. }
  45. #man_zone {
  46. margin-left: 0;
  47. }
  48. .product-row {
  49. position: relative;
  50. padding: 12px 15px;
  51. padding-right: 40px; /* Add right padding to make room for delete button */
  52. margin-bottom: 8px;
  53. border-radius: 4px;
  54. display: flex;
  55. align-items: center;
  56. flex-wrap: wrap;
  57. gap: 20px; /* 增加间距 */
  58. background-color: #f9f9f9;
  59. box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  60. }
  61. .delete-product {
  62. position: absolute;
  63. right: 10px;
  64. top: 50%;
  65. transform: translateY(-50%);
  66. color: #e74c3c;
  67. font-weight: bold;
  68. font-size: 18px;
  69. cursor: pointer;
  70. width: 24px;
  71. height: 24px;
  72. line-height: 24px;
  73. text-align: center;
  74. border-radius: 50%;
  75. z-index: 5;
  76. }
  77. .delete-product:hover {
  78. background-color: #e74c3c;
  79. color: white;
  80. }
  81. .product-info {
  82. flex: 3;
  83. min-width: 200px;
  84. }
  85. .product-spec {
  86. flex: 2;
  87. min-width: 200px;
  88. }
  89. .product-quantity {
  90. flex: 1;
  91. min-width: 80px;
  92. }
  93. .product-unit {
  94. flex: 0.8;
  95. min-width: 60px;
  96. }
  97. .product-price {
  98. flex: 1;
  99. min-width: 100px;
  100. }
  101. .product-total {
  102. flex: 1.2;
  103. min-width: 100px;
  104. font-weight: bold;
  105. }
  106. .product-row input[type="number"] {
  107. width: 90%;
  108. padding: 5px;
  109. border: 1px solid #ddd;
  110. border-radius: 4px;
  111. }
  112. .product-row select {
  113. width: 100%;
  114. padding: 5px;
  115. }
  116. .selected-product-info {
  117. font-weight: bold;
  118. margin-bottom: 3px;
  119. }
  120. .row-section {
  121. display: flex;
  122. flex-direction: column;
  123. }
  124. .row-section-label {
  125. font-size: 12px;
  126. color: #666;
  127. margin-bottom: 3px;
  128. }
  129. .row-section-label span {
  130. display: none; /* 在大屏幕上隐藏标签文本 */
  131. }
  132. .spec-info {
  133. margin-top: 2px;
  134. font-size: 12px;
  135. color: #666;
  136. }
  137. /* 在小屏幕上的响应式布局 */
  138. @media (max-width: 768px) {
  139. .product-row {
  140. flex-direction: column;
  141. align-items: flex-start;
  142. }
  143. .product-info, .product-spec, .product-quantity,
  144. .product-unit, .product-price, .product-total {
  145. width: 100%;
  146. min-width: 100%;
  147. margin-bottom: 8px;
  148. }
  149. .row-section-label span {
  150. display: inline; /* 在小屏幕上显示标签文本 */
  151. }
  152. .product-list-header {
  153. display: none !important; /* 在小屏幕上隐藏表头 */
  154. }
  155. }
  156. .add-product-btn {
  157. background-color: #4CAF50;
  158. color: white;
  159. padding: 10px 15px;
  160. border: none;
  161. border-radius: 4px;
  162. cursor: pointer;
  163. margin-bottom: 15px;
  164. font-size: 14px;
  165. display: flex;
  166. align-items: center;
  167. justify-content: center;
  168. gap: 8px;
  169. transition: background-color 0.2s;
  170. box-shadow: 0 2px 5px rgba(0,0,0,0.1);
  171. }
  172. .add-product-btn:hover {
  173. background-color: #45a049;
  174. }
  175. .total-section {
  176. margin-top: 20px;
  177. padding: 10px;
  178. background-color: #eee;
  179. font-weight: bold;
  180. }
  181. #product-container {
  182. margin-bottom: 20px;
  183. }
  184. .productlist {
  185. display: none;
  186. position: absolute;
  187. background: white;
  188. border: 1px solid #ccc;
  189. max-height: 200px;
  190. overflow-y: auto;
  191. width: 100%;
  192. z-index: 1000;
  193. box-shadow: 0 3px 8px rgba(0,0,0,0.25);
  194. border-radius: 0 0 4px 4px;
  195. top: 100%;
  196. left: 0;
  197. }
  198. .productlist ul {
  199. list-style: none;
  200. padding: 0;
  201. margin: 0;
  202. }
  203. .productlist li {
  204. padding: 10px 12px;
  205. cursor: pointer;
  206. border-bottom: 1px solid #eee;
  207. transition: background-color 0.2s;
  208. }
  209. .productlist li:hover {
  210. background-color: #f0f0f0;
  211. }
  212. .productlist li:last-child {
  213. border-bottom: none;
  214. }
  215. .productinput {
  216. position: relative;
  217. }
  218. .productlist li .category-tag {
  219. color: #777;
  220. font-size: 12px;
  221. font-style: italic;
  222. margin-left: 5px;
  223. }
  224. /* Specification select styling */
  225. .spec-select {
  226. width: 100%;
  227. padding: 6px;
  228. margin-top: 5px;
  229. border: 1px solid #ccc;
  230. border-radius: 4px;
  231. }
  232. .spec-select:disabled {
  233. background-color: #f9f9f9;
  234. }
  235. .spec-price {
  236. font-weight: bold;
  237. color: #d9534f;
  238. }
  239. /* 产品行样式优化 - 单行布局 */
  240. /* 客户选择样式 */
  241. .customer-search-container {
  242. display: flex;
  243. align-items: center;
  244. margin-bottom: 10px;
  245. position: relative;
  246. width: 60%;
  247. }
  248. .customer-dropdown {
  249. display: none;
  250. position: absolute;
  251. background: white;
  252. border: 1px solid #ccc;
  253. max-height: 200px;
  254. overflow-y: auto;
  255. width: 100%;
  256. z-index: 1000;
  257. box-shadow: 0 3px 8px rgba(0,0,0,0.25);
  258. border-radius: 0 0 4px 4px;
  259. top: 100%;
  260. left: 0;
  261. }
  262. .customer-item {
  263. padding: 10px 12px;
  264. cursor: pointer;
  265. border-bottom: 1px solid #eee;
  266. transition: background-color 0.2s;
  267. }
  268. .customer-item:hover {
  269. background-color: #f0f0f0;
  270. }
  271. .customer-item:last-child {
  272. border-bottom: none;
  273. }
  274. .selected-customer-info {
  275. font-weight: bold;
  276. padding: 8px 10px;
  277. border: 1px solid #ddd;
  278. background-color: #f9f9f9;
  279. display: none;
  280. width: 100%;
  281. box-sizing: border-box;
  282. word-break: break-all;
  283. overflow: hidden;
  284. text-overflow: ellipsis;
  285. white-space: normal;
  286. min-height: 38px;
  287. cursor: pointer;
  288. }
  289. .selected-customer-info:hover {
  290. background-color: #f0f0f0;
  291. }
  292. .customer-clear-btn {
  293. margin-left: 5px;
  294. color: #e74c3c;
  295. font-weight: bold;
  296. cursor: pointer;
  297. float: right;
  298. }
  299. .customer-clear-btn:hover {
  300. color: #c0392b;
  301. }
  302. .product-row .total-price-input {
  303. width: 90%;
  304. }
  305. </style>
  306. </head>
  307. <body>
  308. <div id="man_zone">
  309. <form name="form1" id="form1" method="post" action="order_save.php?<?= $hrefstr ?>" onsubmit="return validateOrderForm()">
  310. <table width="100%" border="0" cellpadding="3" cellspacing="1" class="table1">
  311. <tbody>
  312. <tr>
  313. <th width="8%" nowrap>销售开单号</th>
  314. <td><input type="text" id="order_code" name="order_code" value="" class="txt1" placeholder="请输入销售开单号 (多个用 / 分隔) " maxlength="100" /></td>
  315. </tr>
  316. <tr>
  317. <th width="8%" nowrap>订单类型</th>
  318. <td>
  319. <div style="display: flex; gap: 20px;">
  320. <label style="display: flex; align-items: center;">
  321. <input type="radio" name="order_type" id="order_type_1" value="1"> 美特柏品牌订单
  322. </label>
  323. <label style="display: flex; align-items: center;">
  324. <input type="radio" name="order_type" id="order_type_2" value="2"> 定制订单
  325. </label>
  326. </div>
  327. </td>
  328. </tr>
  329. <tr>
  330. <th width="8%" nowrap>客户选择</th>
  331. <td>
  332. <?php if ($customerInfo): ?>
  333. <!-- 已有客户ID,只显示客户信息 -->
  334. <div class="customer-search-container">
  335. <input type="hidden" name="customer_id" id="customer_id" value="<?= $customerId ?>">
  336. <!-- 联系人字段设为空 -->
  337. <input type="hidden" name="contact_id" id="contact_id" value="">
  338. <div class="selected-customer-info" style="display: block;" title="<?= htmlspecialcharsFix($customerInfo['cs_code'] . ' - ' . $customerInfo['cs_company']) ?>">
  339. <?= htmlspecialcharsFix($customerInfo['cs_code'] . ' - ' . $customerInfo['cs_company']) ?>
  340. <span class="customer-clear-btn" data-type="customer" style="display: none;">X</span>
  341. </div>
  342. </div>
  343. <?php else: ?>
  344. <!-- 无客户ID,显示搜索框 -->
  345. <div class="customer-search-container">
  346. <input type="text" id="customer_search" class="customer-search txt1" data-type="customer" placeholder="输入客户编码或名称搜索..." style="width: 100%;">
  347. <div id="customer_dropdown" class="customer-dropdown"></div>
  348. <div id="customer_selected" class="selected-customer-info" title=""></div>
  349. <input type="hidden" name="customer_id" id="customer_id" value="0">
  350. <input type="hidden" name="contact_id" id="contact_id" value="">
  351. </div>
  352. <?php endif; ?>
  353. </td>
  354. </tr>
  355. <tr>
  356. <th width="8%" nowrap>最新销售单日期</th>
  357. <td><input type="date" id="order_date" name="order_date" value="<?= date('Y-m-d') ?>" class="txt1" style="width: 20%; min-width: 200px;" /> <span style="color: red">注:以上你录入的单号里面最新的销售开单单号日期</span></td>
  358. </tr>
  359. <tr>
  360. <th width="8%" nowrap>出货日期</th>
  361. <td><input type="date" id="shipping_date" name="shipping_date" value="<?= date('Y-m-d') ?>" class="txt1" style="width: 20%; min-width: 200px;" /> <span style="color: red"></span></td>
  362. </tr>
  363. <tr>
  364. <th width="8%" valign="top" nowrap>产品列表</th>
  365. <td>
  366. <div class="product-list-header" style="display: flex; background-color: #eee; padding: 8px 15px; margin-bottom: 10px; border-radius: 4px; font-weight: bold; color: #555; font-size: 13px; gap: 20px;">
  367. <div style="flex: 3; min-width: 200px;">产品</div>
  368. <div style="flex: 1; min-width: 80px;">数量</div>
  369. <div style="flex: 0.8; min-width: 60px;">单位</div>
  370. <div style="flex: 1.2; min-width: 100px;">总价</div>
  371. </div>
  372. <div id="product-container">
  373. <!-- 产品行将通过添加按钮添加 -->
  374. <div id="no-products-message" style="padding: 15px; text-align: center; color: #777; background-color: #f5f5f5; border: 1px dashed #ddd; border-radius: 4px; margin-bottom: 15px; display: block;">
  375. <i class="fa fa-info-circle"></i> 请点击"添加产品"按钮添加产品
  376. </div>
  377. </div>
  378. <!-- 在订单总额上方添加的新按钮 -->
  379. <div style="text-align: center; margin-bottom: 15px;">
  380. <button type="button" id="add-product-btn-bottom" class="add-product-btn">添加产品</button>
  381. </div>
  382. <div class="total-section" style="margin-top: 20px; padding: 15px; background-color: #f5f5f5; border-radius: 4px; box-shadow: 0 1px 3px rgba(0,0,0,0.1);">
  383. <div style="display: flex; justify-content: flex-end; align-items: center;">
  384. <label style="font-size: 16px; margin-right: 10px;">订单总额:</label>
  385. <span id="total-amount" style="font-size: 18px; font-weight: bold; color: #e74c3c;">0.00</span>
  386. <input type="hidden" name="total_amount" id="total-amount-input" value="0.00">
  387. <input type="hidden" name="subtotal" id="subtotal-input" value="0.00">
  388. </div>
  389. </div>
  390. </td>
  391. </tr>
  392. <tr>
  393. <th width="8%" nowrap>是否参与返点</th>
  394. <td>
  395. <div style="display: flex; gap: 20px;">
  396. <label style="display: flex; align-items: center;">
  397. <input type="radio" name="no_cashback" id="no_cashback_0" value="0" checked> 参与返点
  398. </label>
  399. <label style="display: flex; align-items: center;">
  400. <input type="radio" name="no_cashback" id="no_cashback_1" value="1"> 不参与返点
  401. </label>
  402. </div>
  403. <div style="margin-top: 5px; font-size: 12px; color: #666;">
  404. 注:选择"不参与返点"的订单将不计入返点统计和计算
  405. </div>
  406. </td>
  407. </tr>
  408. <tr>
  409. <th width="8%" nowrap>订单备注</th>
  410. <td>
  411. <textarea name="notes" rows="3" style="width: 90%;"></textarea>
  412. </td>
  413. </tr>
  414. <tr>
  415. <th></th>
  416. <td>
  417. <input type="submit" name="save" value="保存订单" class="btn1">
  418. <input type="button" value="返回" class="btn1" onClick="location.href='order.php?<?= $hrefstr ?>'" />
  419. </td>
  420. </tr>
  421. </tbody>
  422. </table>
  423. </form>
  424. <script>
  425. var productIndex = 1;
  426. $(document).ready(function() {
  427. // 初始化计算
  428. calculateOrderTotal();
  429. // 移除第一个默认产品行(如果不需要的话)
  430. if ($('.product-row').length > 0) {
  431. $('.product-row').first().remove();
  432. }
  433. // 添加默认的产品行
  434. addEmptyProductRow();
  435. updateNoProductsMessage();
  436. // 添加产品行按钮点击事件
  437. $('#add-product-btn-bottom').on('click', function() {
  438. addEmptyProductRow();
  439. updateNoProductsMessage();
  440. });
  441. // 删除产品行
  442. $(document).on('click', '.delete-product', function() {
  443. if ($('.product-row').length > 1) {
  444. $(this).closest('.product-row').remove();
  445. reindexProductRows();
  446. calculateOrderTotal();
  447. updateNoProductsMessage();
  448. } else {
  449. // 如果只剩最后一个产品行,则清空它而不是删除
  450. $(this).closest('.product-row').remove();
  451. updateNoProductsMessage();
  452. calculateOrderTotal(); // 确保在删除最后一个产品时也更新总额
  453. }
  454. });
  455. // 客户搜索功能
  456. var customerSearchTimeout = null;
  457. var customerIsComposing = false;
  458. // 监听输入法组合事件
  459. $(document).on('compositionstart', '.customer-search', function() {
  460. customerIsComposing = true;
  461. });
  462. $(document).on('compositionend', '.customer-search', function() {
  463. customerIsComposing = false;
  464. $(this).trigger('input'); // 手动触发一次input事件
  465. });
  466. // 客户搜索输入处理
  467. $(document).on('input', '#customer_search', function() {
  468. // 如果是输入法正在组合中文,不处理
  469. if (customerIsComposing) return;
  470. var $this = $(this);
  471. var searchTerm = $this.val().trim();
  472. var customerDropdown = $('#customer_dropdown');
  473. // 清除之前的超时
  474. clearTimeout(customerSearchTimeout);
  475. // 隐藏之前的结果
  476. customerDropdown.hide().empty();
  477. // 清除之前的选择
  478. $('#customer_id').val('0');
  479. $('#customer_selected').hide();
  480. // 如果搜索词少于1个字符,不执行搜索
  481. if (searchTerm.length < 1) {
  482. return;
  483. }
  484. // 设置一个300毫秒的超时,以减少请求数量
  485. customerSearchTimeout = setTimeout(function() {
  486. $.ajax({
  487. url: 'get_customer_search.php',
  488. type: 'GET',
  489. data: {search: searchTerm},
  490. dataType: 'json',
  491. success: function(data) {
  492. customerDropdown.empty();
  493. if (data && data.customers && data.customers.length > 0) {
  494. $.each(data.customers, function(i, customer) {
  495. var displayText = customer.cs_company;
  496. if (customer.cs_code) {
  497. displayText = customer.cs_code + ' - ' + displayText;
  498. }
  499. var item = $('<div class="customer-item"></div>')
  500. .attr('data-id', customer.id)
  501. .attr('data-company', customer.cs_company)
  502. .attr('data-display', displayText)
  503. .text(displayText);
  504. customerDropdown.append(item);
  505. });
  506. customerDropdown.show();
  507. }
  508. },
  509. error: function() {
  510. console.log('搜索客户失败,请重试');
  511. }
  512. });
  513. }, 300);
  514. });
  515. // 点击选择客户
  516. $(document).on('click', '.customer-item', function() {
  517. var $this = $(this);
  518. var customerId = $this.data('id');
  519. var customerName = $this.data('company');
  520. var displayText = $this.data('display');
  521. // 设置选中的客户ID和名称
  522. $('#customer_id').val(customerId);
  523. $('#customer_search').hide();
  524. $('#customer_selected').text(displayText).append('<span class="customer-clear-btn" data-type="customer">X</span>').show();
  525. // 添加标题属性,便于查看完整信息
  526. $('#customer_selected').attr('title', displayText);
  527. // 隐藏下拉菜单
  528. $('#customer_dropdown').hide();
  529. // 加载客户联系人
  530. loadCustomerContacts(customerId);
  531. });
  532. // 点击X按钮清除选择的客户
  533. $(document).on('click', '.customer-clear-btn', function(e) {
  534. e.stopPropagation();
  535. // 显示搜索框,隐藏已选信息
  536. $('#customer_search').val('').show();
  537. $('#customer_selected').hide();
  538. // 清空客户ID和联系人ID
  539. $('#customer_id').val('0');
  540. $('#contact_id').val('');
  541. });
  542. // 点击其他地方隐藏下拉列表
  543. $(document).on('click', function(e) {
  544. if (!$(e.target).closest('.customer-search-container').length) {
  545. $('#customer_dropdown').hide();
  546. }
  547. });
  548. // 产品搜索框聚焦时显示搜索提示
  549. $(document).on('focus', '.product-search', function() {
  550. // 隐藏所有已打开的产品搜索列表
  551. $('.productlist').hide();
  552. // 当前搜索框的值
  553. var searchTerm = $(this).val().trim();
  554. if (searchTerm.length >= 2) {
  555. // 找到当前行的产品列表并显示
  556. $(this).siblings('.productlist').show();
  557. }
  558. });
  559. // 产品搜索功能 - 行内搜索
  560. var productSearchTimeouts = {};
  561. var isComposing = false;
  562. // 监听输入法组合事件
  563. $(document).on('compositionstart', '.product-search', function() {
  564. isComposing = true;
  565. });
  566. $(document).on('compositionend', '.product-search', function() {
  567. isComposing = false;
  568. $(this).trigger('input'); // 手动触发一次input事件
  569. });
  570. $(document).on('input', '.product-search', function() {
  571. // 如果是输入法正在组合中文,不处理
  572. if (isComposing) return;
  573. var $this = $(this);
  574. var rowIndex = $this.closest('.product-row').data('index');
  575. var searchTerm = $this.val().trim();
  576. var productList = $this.siblings('.productlist');
  577. // 清除之前的超时
  578. clearTimeout(productSearchTimeouts[rowIndex]);
  579. // 隐藏之前的结果
  580. productList.hide();
  581. // 如果搜索词少于2个字符,不执行搜索
  582. if (searchTerm.length < 1) {
  583. return;
  584. }
  585. console.warn(searchTerm);
  586. // 设置一个300毫秒的超时,以减少请求数量
  587. productSearchTimeouts[rowIndex] = setTimeout(function() {
  588. $.ajax({
  589. url: 'get_product_info.php',
  590. type: 'GET',
  591. data: {search: searchTerm},
  592. dataType: 'json',
  593. success: function(data) {
  594. var ul = productList.find('ul');
  595. ul.empty();
  596. if (data && data.products && data.products.length > 0) {
  597. $.each(data.products, function(i, product) {
  598. ul.append('<li data-id="' + product.id + '">' +
  599. product.ProductName +
  600. (product.category_name ? ' <span class="category-tag">(' + product.category_name + ')</span>' : '') +
  601. '</li>');
  602. });
  603. productList.show();
  604. }
  605. },
  606. error: function() {
  607. console.log('搜索产品失败,请重试');
  608. }
  609. });
  610. }, 300);
  611. });
  612. // 点击选择产品 - 行内搜索结果
  613. $(document).on('click', '.productlist li', function() {
  614. var $this = $(this);
  615. var productId = $this.data('id');
  616. var productName = $this.text(); // 这会包含分类名,需要清理
  617. var categoryTag = $this.find('.category-tag').text();
  618. var row = $this.closest('.product-row');
  619. // 检查是否已存在相同的产品
  620. var isDuplicate = false;
  621. $('.product-id-input').not(row.find('.product-id-input')).each(function() {
  622. if ($(this).val() == productId) {
  623. isDuplicate = true;
  624. return false; // 跳出循环
  625. }
  626. });
  627. if (isDuplicate) {
  628. alert('该产品已添加,不能添加相同的产品');
  629. return;
  630. }
  631. // 清理产品名称,移除分类信息
  632. if (categoryTag) {
  633. productName = productName.replace(categoryTag, '').trim();
  634. }
  635. // 设置产品ID和名称
  636. row.find('.product-id-input').val(productId);
  637. row.find('.product-search').hide();
  638. // 显示包含分类的完整产品信息
  639. var displayName = productName;
  640. if (categoryTag) {
  641. displayName += ' <span class="category-tag">' + categoryTag + '</span>';
  642. }
  643. row.find('.selected-product-info').html(displayName).show();
  644. // 隐藏产品搜索结果
  645. row.find('.productlist').hide();
  646. // 获取产品单位信息
  647. getProductSpecifications(productId, row);
  648. });
  649. // 点击其他地方隐藏下拉列表
  650. $(document).on('click', function(e) {
  651. if (!$(e.target).closest('.product-search').length && !$(e.target).closest('.productlist').length) {
  652. $('.productlist').hide();
  653. }
  654. if (!$(e.target).closest('.customerinput').length) {
  655. $('.customerlist').hide();
  656. }
  657. });
  658. // 点击已选产品名显示的标签时,切换回搜索模式
  659. $(document).on('click', '.selected-product-info', function() {
  660. var row = $(this).closest('.product-row');
  661. var productId = row.find('.product-id-input').val();
  662. // 只有当已经选择了产品时才允许重新选择
  663. if (productId) {
  664. if (confirm('确定要重新选择产品吗?这将清除当前选择的产品信息。')) {
  665. // 清空产品ID
  666. row.find('.product-id-input').val('');
  667. // 隐藏产品信息,显示搜索框
  668. $(this).hide();
  669. row.find('.product-search').val('').show();
  670. // 清除单位信息
  671. row.find('.unit-input').val('');
  672. row.find('.unit-label').text('');
  673. // 清除总价信息并重新计算总额
  674. row.find('.total-price-input').val('0.00');
  675. calculateOrderTotal();
  676. }
  677. }
  678. });
  679. });
  680. function addEmptyProductRow() {
  681. var html = `
  682. <div class="product-row" data-index="${productIndex}">
  683. <span class="delete-product">×</span>
  684. <div class="row-section product-info">
  685. <div class="row-section-label"><span>产品</span></div>
  686. <input type="hidden" name="items[${productIndex}][product_id]" class="product-id-input" value="">
  687. <input type="text" class="product-search" placeholder="输入产品名称搜索..." style="width: 100%; padding: 5px; border: 1px solid #ddd; border-radius: 4px;">
  688. <div class="productlist" style="width: 100%; max-height: 200px;"><ul></ul></div>
  689. <div class="selected-product-info" style="cursor: pointer; display: none;" title="点击重新选择产品"></div>
  690. </div>
  691. <div class="row-section product-quantity">
  692. <div class="row-section-label"><span>数量</span></div>
  693. <input type="number" name="items[${productIndex}][quantity]" value="1" min="1" class="quantity-input">
  694. </div>
  695. <div class="row-section product-unit">
  696. <div class="row-section-label"><span>单位</span></div>
  697. <span class="unit-label" style="display: inline-block; padding: 2px 5px; min-width: 30px;"></span>
  698. <input type="hidden" name="items[${productIndex}][unit]" class="unit-input" value="">
  699. </div>
  700. <div class="row-section product-total">
  701. <div class="row-section-label"><span>总价</span></div>
  702. <input type="number" step="0.01" name="items[${productIndex}][total_price]" value="0.00" class="total-price-input" placeholder="输入总价" onchange="calculateOrderTotal()">
  703. </div>
  704. </div>
  705. `;
  706. $('#product-container').append(html);
  707. productIndex++;
  708. return productIndex - 1; // 返回新添加行的索引
  709. }
  710. function getProductSpecifications(productId, row) {
  711. if (!productId) return;
  712. $.ajax({
  713. url: 'get_product_info.php',
  714. type: 'GET',
  715. data: {product_id: productId},
  716. dataType: 'json',
  717. success: function(data) {
  718. if (data && data.product) {
  719. // 设置单位信息
  720. if (data.product.unit) {
  721. row.find('.unit-input').val(data.product.unit);
  722. row.find('.unit-label').text(data.product.unit);
  723. }
  724. } else {
  725. alert('获取产品信息失败');
  726. // 重置产品选择
  727. row.find('.product-id-input').val('');
  728. row.find('.selected-product-info').hide();
  729. row.find('.product-search').val('').show();
  730. }
  731. },
  732. error: function() {
  733. alert('获取产品信息失败,请重试');
  734. // 重置产品选择
  735. row.find('.product-id-input').val('');
  736. row.find('.selected-product-info').hide();
  737. row.find('.product-search').val('').show();
  738. }
  739. });
  740. }
  741. function reindexProductRows() {
  742. $('.product-row').each(function(index) {
  743. $(this).attr('data-index', index);
  744. $(this).find('select, input').each(function() {
  745. var name = $(this).attr('name');
  746. if (name) {
  747. name = name.replace(/items\[\d+\]/, 'items[' + index + ']');
  748. $(this).attr('name', name);
  749. }
  750. });
  751. });
  752. productIndex = $('.product-row').length;
  753. }
  754. function calculateOrderTotal() {
  755. var total = 0;
  756. $('.total-price-input').each(function() {
  757. total += parseFloat($(this).val()) || 0;
  758. });
  759. // 更新总额和隐藏的小计字段
  760. $('#total-amount').text(total.toFixed(2));
  761. $('#total-amount-input').val(total.toFixed(2));
  762. $('#subtotal-input').val(total.toFixed(2)); // 为兼容性保留
  763. }
  764. function loadCustomerContacts(customerId) {
  765. if (customerId) {
  766. $.ajax({
  767. url: 'get_customer_contacts.php',
  768. type: 'GET',
  769. data: {customer_id: customerId},
  770. dataType: 'json',
  771. success: function(data) {
  772. // 不自动选择第一个联系人,让字段为空
  773. $('#contact_id').val('');
  774. }
  775. });
  776. } else {
  777. $('#contact_id').val('');
  778. }
  779. }
  780. function validateOrderForm() {
  781. var orderCode = $('#order_code').val();
  782. var customerId = $('#customer_id').val();
  783. var customerName = $('#customer_search').val();
  784. var orderType = $('input[name="order_type"]:checked').val();
  785. var hasProducts = false;
  786. var allTotalPricesValid = true;
  787. var firstInvalidField = null;
  788. var hasUnselectedProducts = false;
  789. // 检查是否有产品行
  790. if ($('.product-row').length === 0) {
  791. alert('请至少添加一个产品');
  792. $('#add-product-btn').focus();
  793. return false;
  794. }
  795. // 检查订单类型是否已选择
  796. if (!orderType) {
  797. alert('请选择订单类型');
  798. $('#order_type_1').focus();
  799. return false;
  800. }
  801. $('.product-row').each(function() {
  802. var productId = $(this).find('.product-id-input').val();
  803. var totalPriceInput = $(this).find('.total-price-input');
  804. var totalPrice = parseFloat(totalPriceInput.val()) || 0;
  805. var productSearch = $(this).find('.product-search');
  806. var searchValue = productSearch.val().trim();
  807. // 检查产品是否已选择
  808. if (!productId) {
  809. if (searchValue) {
  810. // 如果有搜索内容但未选择产品
  811. hasUnselectedProducts = true;
  812. if (!firstInvalidField) {
  813. firstInvalidField = productSearch;
  814. }
  815. } else {
  816. // 如果既没有选择产品也没有搜索内容
  817. if (!firstInvalidField) {
  818. firstInvalidField = productSearch;
  819. }
  820. }
  821. return true; // continue
  822. }
  823. hasProducts = true;
  824. // 检查总价是否有效
  825. if (totalPrice <= 0) {
  826. allTotalPricesValid = false;
  827. if (!firstInvalidField) {
  828. firstInvalidField = totalPriceInput;
  829. }
  830. }
  831. });
  832. if (!orderCode) {
  833. alert('销售开单号不能为空');
  834. $('#order_code').focus();
  835. return false;
  836. }
  837. if (!customerId || customerId == '0') {
  838. alert('请选择客户');
  839. $('#customer_search').focus();
  840. return false;
  841. }
  842. // 只有当客户ID为0时才检查客户名称
  843. if (customerId == '0' && !customerName) {
  844. alert('请输入并选择有效的客户');
  845. $('#customer_search').focus();
  846. return false;
  847. }
  848. if (!hasProducts) {
  849. alert('请至少添加一个有效的产品');
  850. if (firstInvalidField) {
  851. firstInvalidField.focus();
  852. } else {
  853. $('#add-product-btn').focus();
  854. }
  855. return false;
  856. }
  857. if (hasUnselectedProducts) {
  858. alert('请从搜索结果中选择产品,不能直接提交未选择的产品');
  859. if (firstInvalidField) {
  860. firstInvalidField.focus();
  861. }
  862. return false;
  863. }
  864. if (!allTotalPricesValid) {
  865. alert('请为所有产品输入有效的总价');
  866. if (firstInvalidField) {
  867. firstInvalidField.focus();
  868. }
  869. return false;
  870. }
  871. return true;
  872. }
  873. function updateNoProductsMessage() {
  874. if ($('.product-row').length > 0) {
  875. $('#no-products-message').hide();
  876. } else {
  877. $('#no-products-message').show();
  878. }
  879. }
  880. </script>
  881. </div>
  882. </body>
  883. </html>