|
|
@@ -260,6 +260,69 @@ if (!empty($id) && is_numeric($id)) {
|
|
|
font-weight: bold;
|
|
|
color: #d9534f;
|
|
|
}
|
|
|
+
|
|
|
+ /* 客户选择样式 */
|
|
|
+ .customer-search-container {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ position: relative;
|
|
|
+ width: 60%;
|
|
|
+ }
|
|
|
+ .customer-dropdown {
|
|
|
+ display: none;
|
|
|
+ position: absolute;
|
|
|
+ background: white;
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ max-height: 200px;
|
|
|
+ overflow-y: auto;
|
|
|
+ width: 100%;
|
|
|
+ z-index: 1000;
|
|
|
+ box-shadow: 0 3px 8px rgba(0,0,0,0.25);
|
|
|
+ border-radius: 0 0 4px 4px;
|
|
|
+ top: 100%;
|
|
|
+ left: 0;
|
|
|
+ }
|
|
|
+ .customer-item {
|
|
|
+ padding: 10px 12px;
|
|
|
+ cursor: pointer;
|
|
|
+ border-bottom: 1px solid #eee;
|
|
|
+ transition: background-color 0.2s;
|
|
|
+ }
|
|
|
+ .customer-item:hover {
|
|
|
+ background-color: #f0f0f0;
|
|
|
+ }
|
|
|
+ .customer-item:last-child {
|
|
|
+ border-bottom: none;
|
|
|
+ }
|
|
|
+ .selected-customer-info {
|
|
|
+ font-weight: bold;
|
|
|
+ padding: 8px 10px;
|
|
|
+ border: 1px solid #ddd;
|
|
|
+ background-color: #f9f9f9;
|
|
|
+ display: none;
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ word-break: break-all;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: normal;
|
|
|
+ min-height: 38px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ .selected-customer-info:hover {
|
|
|
+ background-color: #f0f0f0;
|
|
|
+ }
|
|
|
+ .customer-clear-btn {
|
|
|
+ margin-left: 5px;
|
|
|
+ color: #e74c3c;
|
|
|
+ font-weight: bold;
|
|
|
+ cursor: pointer;
|
|
|
+ float: right;
|
|
|
+ }
|
|
|
+ .customer-clear-btn:hover {
|
|
|
+ color: #c0392b;
|
|
|
+ }
|
|
|
</style>
|
|
|
</head>
|
|
|
<body>
|
|
|
@@ -277,16 +340,14 @@ if (!empty($id) && is_numeric($id)) {
|
|
|
<tr>
|
|
|
<th width="8%">客户选择</th>
|
|
|
<td>
|
|
|
- <div style="display: flex; width: 60%; position: relative; align-items: center;" class="customerinput">
|
|
|
- <div style="flex: 1; position: relative;">
|
|
|
- <input type="text" class="customer-search fastsearch" placeholder="输入客户编码或名称搜索..." style="width: 100%;" value="<?= htmlspecialcharsFix(isset($order['cs_code']) && $order['cs_code'] ? $order['cs_code'] . ' - ' . $order['cs_company'] : $order['cs_company']) ?>">
|
|
|
- <div class="customerlist" style="display: none; position: absolute; background: white; border: 1px solid #ccc; max-height: 200px; overflow-y: auto; width: 100%; z-index: 1000; box-shadow: 0 2px 5px rgba(0,0,0,0.2);">
|
|
|
- <ul style="list-style: none; padding: 0; margin: 0;"></ul>
|
|
|
- </div>
|
|
|
- <input type="hidden" name="customer_id" id="customer_id" value="<?= $order['customer_id'] ?>">
|
|
|
- <div class="selected-customer-info" style="margin-top: 5px; font-weight: bold;"></div>
|
|
|
+ <div class="customer-search-container">
|
|
|
+ <input type="text" id="customer_search" class="customer-search txt1" data-type="customer" placeholder="输入客户编码或名称搜索..." style="width: 100%;" value="<?= htmlspecialcharsFix(isset($order['cs_code']) && $order['cs_code'] ? $order['cs_code'] . ' - ' . $order['cs_company'] : $order['cs_company']) ?>">
|
|
|
+ <div id="customer_dropdown" class="customer-dropdown"></div>
|
|
|
+ <div id="customer_selected" class="selected-customer-info" style="display: block;" title="<?= htmlspecialcharsFix(isset($order['cs_code']) && $order['cs_code'] ? $order['cs_code'] . ' - ' . $order['cs_company'] : $order['cs_company']) ?>">
|
|
|
+ <?= htmlspecialcharsFix(isset($order['cs_code']) && $order['cs_code'] ? $order['cs_code'] . ' - ' . $order['cs_company'] : $order['cs_company']) ?>
|
|
|
+ <span class="customer-clear-btn" data-type="customer">X</span>
|
|
|
</div>
|
|
|
- <span class="delete-customer" style="margin-left: 10px; color: #e74c3c; font-weight: bold; font-size: 18px; cursor: pointer; width: 24px; height: 24px; line-height: 24px; text-align: center; border-radius: 50%;">×</span>
|
|
|
+ <input type="hidden" name="customer_id" id="customer_id" value="<?= $order['customer_id'] ?>">
|
|
|
</div>
|
|
|
</td>
|
|
|
</tr>
|
|
|
@@ -428,58 +489,44 @@ if (!empty($id) && is_numeric($id)) {
|
|
|
}
|
|
|
});
|
|
|
|
|
|
- // 添加客户删除按钮事件
|
|
|
- $('.delete-customer').on('click', function() {
|
|
|
- // if(confirm('确定要清除当前选择的客户吗？')) {
|
|
|
- // 清空客户ID和客户名称
|
|
|
- $('#customer_id').val('');
|
|
|
- $('.customer-search').val('').focus();
|
|
|
- $('.selected-customer-info').text('');
|
|
|
- // }
|
|
|
- });
|
|
|
+ // 隐藏搜索框，因为已经选择了客户
|
|
|
+ $('#customer_search').hide();
|
|
|
|
|
|
- // 添加样式到客户删除按钮
|
|
|
- $('.delete-customer').hover(
|
|
|
- function() { $(this).css('background-color', '#e74c3c').css('color', 'white'); },
|
|
|
- function() { $(this).css('background-color', '').css('color', '#e74c3c'); }
|
|
|
- );
|
|
|
-
|
|
|
- // 添加产品行按钮点击事件
|
|
|
- $('#add-product-btn').on('click', function() {
|
|
|
- addEmptyProductRow();
|
|
|
- updateNoProductsMessage();
|
|
|
- });
|
|
|
+ // 客户搜索功能
|
|
|
+ var customerSearchTimeout = null;
|
|
|
+ var customerIsComposing = false;
|
|
|
|
|
|
- // 删除产品行
|
|
|
- $(document).on('click', '.delete-product', function() {
|
|
|
- if ($('.product-row').length > 1) {
|
|
|
- $(this).closest('.product-row').remove();
|
|
|
- reindexProductRows();
|
|
|
- calculateOrderTotal();
|
|
|
- updateNoProductsMessage();
|
|
|
- } else {
|
|
|
- // 如果只剩最后一个产品行，则清空它而不是删除
|
|
|
- $(this).closest('.product-row').remove();
|
|
|
- updateNoProductsMessage();
|
|
|
- calculateOrderTotal(); // 确保在删除最后一个产品时也更新总额
|
|
|
- }
|
|
|
+ // 监听输入法组合事件
|
|
|
+ $(document).on('compositionstart', '.customer-search', function() {
|
|
|
+ customerIsComposing = true;
|
|
|
});
|
|
|
|
|
|
- // 客户搜索功能
|
|
|
- var customerSearchTimeout = null;
|
|
|
- $(document).on('keyup', '.customer-search', function() {
|
|
|
+ $(document).on('compositionend', '.customer-search', function() {
|
|
|
+ customerIsComposing = false;
|
|
|
+ $(this).trigger('input'); // 手动触发一次input事件
|
|
|
+ });
|
|
|
+
|
|
|
+ // 客户搜索输入处理
|
|
|
+ $(document).on('input', '#customer_search', function() {
|
|
|
+ // 如果是输入法正在组合中文，不处理
|
|
|
+ if (customerIsComposing) return;
|
|
|
+
|
|
|
var $this = $(this);
|
|
|
var searchTerm = $this.val().trim();
|
|
|
- var customerList = $('.customerlist');
|
|
|
+ var customerDropdown = $('#customer_dropdown');
|
|
|
|
|
|
// 清除之前的超时
|
|
|
clearTimeout(customerSearchTimeout);
|
|
|
|
|
|
// 隐藏之前的结果
|
|
|
- customerList.hide();
|
|
|
+ customerDropdown.hide().empty();
|
|
|
|
|
|
- // 如果搜索词少于2个字符，不执行搜索
|
|
|
- if (searchTerm.length < 2) {
|
|
|
+ // 清除之前的选择
|
|
|
+ $('#customer_id').val('0');
|
|
|
+ $('#customer_selected').hide();
|
|
|
+
|
|
|
+ // 如果搜索词少于1个字符，不执行搜索
|
|
|
+ if (searchTerm.length < 1) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
@@ -491,8 +538,7 @@ if (!empty($id) && is_numeric($id)) {
|
|
|
data: {search: searchTerm},
|
|
|
dataType: 'json',
|
|
|
success: function(data) {
|
|
|
- var ul = customerList.find('ul');
|
|
|
- ul.empty();
|
|
|
+ customerDropdown.empty();
|
|
|
|
|
|
if (data && data.customers && data.customers.length > 0) {
|
|
|
$.each(data.customers, function(i, customer) {
|
|
|
@@ -500,10 +546,16 @@ if (!empty($id) && is_numeric($id)) {
|
|
|
if (customer.cs_code) {
|
|
|
displayText = customer.cs_code + ' - ' + displayText;
|
|
|
}
|
|
|
- ul.append('<li data-id="' + customer.id + '" data-code="' + (customer.cs_code || '') + '">' +
|
|
|
- displayText + '</li>');
|
|
|
+
|
|
|
+ var item = $('<div class="customer-item"></div>')
|
|
|
+ .attr('data-id', customer.id)
|
|
|
+ .attr('data-company', customer.cs_company)
|
|
|
+ .attr('data-display', displayText)
|
|
|
+ .text(displayText);
|
|
|
+
|
|
|
+ customerDropdown.append(item);
|
|
|
});
|
|
|
- customerList.show();
|
|
|
+ customerDropdown.show();
|
|
|
}
|
|
|
},
|
|
|
error: function() {
|
|
|
@@ -514,17 +566,62 @@ if (!empty($id) && is_numeric($id)) {
|
|
|
});
|
|
|
|
|
|
// 点击选择客户
|
|
|
- $(document).on('click', '.customerlist li', function() {
|
|
|
+ $(document).on('click', '.customer-item', function() {
|
|
|
var $this = $(this);
|
|
|
var customerId = $this.data('id');
|
|
|
- var customerName = $this.text();
|
|
|
- var customerCode = $this.data('code') || '';
|
|
|
+ var customerName = $this.data('company');
|
|
|
+ var displayText = $this.data('display');
|
|
|
|
|
|
// 设置选中的客户ID和名称
|
|
|
$('#customer_id').val(customerId);
|
|
|
- $('.customer-search').val(customerName);
|
|
|
- $('.selected-customer-info').text(customerName);
|
|
|
- $('.customerlist').hide();
|
|
|
+ $('#customer_search').hide();
|
|
|
+ $('#customer_selected').text(displayText).append('<span class="customer-clear-btn" data-type="customer">X</span>').show();
|
|
|
+
|
|
|
+ // 添加标题属性，便于查看完整信息
|
|
|
+ $('#customer_selected').attr('title', displayText);
|
|
|
+
|
|
|
+ // 隐藏下拉菜单
|
|
|
+ $('#customer_dropdown').hide();
|
|
|
+ });
|
|
|
+
|
|
|
+ // 点击X按钮清除选择的客户
|
|
|
+ $(document).on('click', '.customer-clear-btn', function(e) {
|
|
|
+ e.stopPropagation();
|
|
|
+
|
|
|
+ // 显示搜索框，隐藏已选信息
|
|
|
+ $('#customer_search').val('').show();
|
|
|
+ $('#customer_selected').hide();
|
|
|
+
|
|
|
+ // 清空客户ID
|
|
|
+ $('#customer_id').val('0');
|
|
|
+ });
|
|
|
+
|
|
|
+ // 点击其他地方隐藏下拉列表
|
|
|
+ $(document).on('click', function(e) {
|
|
|
+ if (!$(e.target).closest('.customer-search-container').length) {
|
|
|
+ $('#customer_dropdown').hide();
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // 添加产品行按钮点击事件
|
|
|
+ $('#add-product-btn').on('click', function() {
|
|
|
+ addEmptyProductRow();
|
|
|
+ updateNoProductsMessage();
|
|
|
+ });
|
|
|
+
|
|
|
+ // 删除产品行
|
|
|
+ $(document).on('click', '.delete-product', function() {
|
|
|
+ if ($('.product-row').length > 1) {
|
|
|
+ $(this).closest('.product-row').remove();
|
|
|
+ reindexProductRows();
|
|
|
+ calculateOrderTotal();
|
|
|
+ updateNoProductsMessage();
|
|
|
+ } else {
|
|
|
+ // 如果只剩最后一个产品行，则清空它而不是删除
|
|
|
+ $(this).closest('.product-row').remove();
|
|
|
+ updateNoProductsMessage();
|
|
|
+ calculateOrderTotal(); // 确保在删除最后一个产品时也更新总额
|
|
|
+ }
|
|
|
});
|
|
|
|
|
|
// 产品搜索框聚焦时显示搜索提示
|
|
|
@@ -685,8 +782,8 @@ if (!empty($id) && is_numeric($id)) {
|
|
|
if (!$(e.target).closest('.product-search').length && !$(e.target).closest('.productlist').length) {
|
|
|
$('.productlist').hide();
|
|
|
}
|
|
|
- if (!$(e.target).closest('.customerinput').length) {
|
|
|
- $('.customerlist').hide();
|
|
|
+ if (!$(e.target).closest('.customer-search-container').length) {
|
|
|
+ $('#customer_dropdown').hide();
|
|
|
}
|
|
|
});
|
|
|
|
|
|
@@ -1004,7 +1101,7 @@ if (!empty($id) && is_numeric($id)) {
|
|
|
function validateOrderForm() {
|
|
|
var orderCode = $('#order_code').val();
|
|
|
var customerId = $('#customer_id').val();
|
|
|
- var customerName = $('.customer-search').val();
|
|
|
+ var customerName = $('#customer_search').val() || $('#customer_selected').text().trim();
|
|
|
var hasProducts = false;
|
|
|
var allSpecsSelected = true;
|
|
|
var allPricesValid = true;
|
|
|
@@ -1071,13 +1168,13 @@ if (!empty($id) && is_numeric($id)) {
|
|
|
|
|
|
if (!customerId || customerId == '0') {
|
|
|
alert('请选择客户');
|
|
|
- $('.customer-search').focus();
|
|
|
+ $('#customer_search').focus();
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
if (!customerName) {
|
|
|
alert('客户名称不能为空');
|
|
|
- $('.customer-search').focus();
|
|
|
+ $('#customer_search').focus();
|
|
|
return false;
|
|
|
}
|
|
|
|
igb