Add customer communication system
This commit is contained in:
sysadmin
@@ -10,6 +10,12 @@
|
||||
<p class="text-muted">Order ID: @Model.Id</p>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
@if (Model.Customer != null)
|
||||
{
|
||||
<button class="btn btn-success" onclick="showMessageModal('@Model.Id', '@Model.Customer.DisplayName')">
|
||||
<i class="fas fa-comment"></i> Message Customer
|
||||
</button>
|
||||
}
|
||||
<a href="@Url.Action("Edit", new { id = Model.Id })" class="btn btn-primary">
|
||||
<i class="fas fa-edit"></i> Edit Order
|
||||
</a>
|
||||
@@ -28,7 +34,28 @@
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<p><strong>Identity Reference:</strong> @Model.IdentityReference</p>
|
||||
@if (Model.Customer != null)
|
||||
{
|
||||
<p><strong>Customer:</strong> @Model.Customer.DisplayName
|
||||
@if (!string.IsNullOrEmpty(Model.Customer.TelegramUsername))
|
||||
{
|
||||
<span class="text-muted">(@@@Model.Customer.TelegramUsername)</span>
|
||||
}
|
||||
</p>
|
||||
<p><strong>Customer Type:</strong> <span class="badge bg-info">@Model.Customer.CustomerType</span></p>
|
||||
@if (Model.Customer.RiskScore > 0)
|
||||
{
|
||||
<p><strong>Risk Score:</strong>
|
||||
<span class="badge @(Model.Customer.RiskScore > 50 ? "bg-danger" : Model.Customer.RiskScore > 25 ? "bg-warning" : "bg-success")">
|
||||
@Model.Customer.RiskScore/100
|
||||
</span>
|
||||
</p>
|
||||
}
|
||||
}
|
||||
else if (!string.IsNullOrEmpty(Model.IdentityReference))
|
||||
{
|
||||
<p><strong>Identity Reference:</strong> @Model.IdentityReference</p>
|
||||
}
|
||||
<p><strong>Status:</strong>
|
||||
@{
|
||||
var badgeClass = Model.Status switch
|
||||
@@ -192,4 +219,126 @@
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (Model.Customer != null)
|
||||
{
|
||||
<!-- Customer Messaging Modal -->
|
||||
<div class="modal fade" id="messageModal" tabindex="-1" aria-labelledby="messageModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="messageModalLabel">
|
||||
<i class="fas fa-comment"></i> Message Customer: <span id="customerName"></span>
|
||||
</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form id="messageForm">
|
||||
<input type="hidden" id="orderId" name="orderId" />
|
||||
<input type="hidden" id="customerId" name="customerId" value="@Model.Customer.Id" />
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="messageType" class="form-label">Message Type</label>
|
||||
<select class="form-select" id="messageType" name="messageType" required>
|
||||
<option value="0">Order Update</option>
|
||||
<option value="1">Payment Reminder</option>
|
||||
<option value="2">Shipping Information</option>
|
||||
<option value="3">Customer Service</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="messageSubject" class="form-label">Subject</label>
|
||||
<input type="text" class="form-control" id="messageSubject" name="subject" required
|
||||
placeholder="Brief subject line..." maxlength="100">
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="messageContent" class="form-label">Message</label>
|
||||
<textarea class="form-control" id="messageContent" name="content" rows="4" required
|
||||
placeholder="Type your message to the customer..." maxlength="1000"></textarea>
|
||||
<div class="form-text">Message will be delivered via Telegram</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="isUrgent" name="isUrgent">
|
||||
<label class="form-check-label" for="isUrgent">
|
||||
Mark as urgent (higher priority delivery)
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
|
||||
<button type="button" class="btn btn-primary" onclick="sendMessage()">
|
||||
<i class="fas fa-paper-plane"></i> Send Message
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<script>
|
||||
function showMessageModal(orderId, customerName) {
|
||||
document.getElementById('orderId').value = orderId;
|
||||
document.getElementById('customerName').textContent = customerName;
|
||||
|
||||
// Clear previous form data
|
||||
document.getElementById('messageForm').reset();
|
||||
document.getElementById('orderId').value = orderId; // Reset cleared this
|
||||
|
||||
// Show modal
|
||||
var modal = new bootstrap.Modal(document.getElementById('messageModal'));
|
||||
modal.show();
|
||||
}
|
||||
|
||||
function sendMessage() {
|
||||
const form = document.getElementById('messageForm');
|
||||
const formData = new FormData(form);
|
||||
|
||||
const messageData = {
|
||||
customerId: formData.get('customerId'),
|
||||
orderId: formData.get('orderId'),
|
||||
type: parseInt(formData.get('messageType')),
|
||||
subject: formData.get('subject'),
|
||||
content: formData.get('content'),
|
||||
isUrgent: formData.get('isUrgent') === 'on',
|
||||
priority: formData.get('isUrgent') === 'on' ? 1 : 5
|
||||
};
|
||||
|
||||
// Send message via API
|
||||
fetch('/api/messages', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': 'Bearer ' + sessionStorage.getItem('authToken')
|
||||
},
|
||||
body: JSON.stringify(messageData)
|
||||
})
|
||||
.then(response => {
|
||||
if (response.ok) {
|
||||
// Close modal and show success
|
||||
var modal = bootstrap.Modal.getInstance(document.getElementById('messageModal'));
|
||||
modal.hide();
|
||||
|
||||
// Show success message
|
||||
alert('Message sent successfully! The customer will receive it via Telegram.');
|
||||
|
||||
// Optionally refresh the page to show updated communication history
|
||||
window.location.reload();
|
||||
} else {
|
||||
response.text().then(error => {
|
||||
alert('Failed to send message: ' + error);
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error sending message:', error);
|
||||
alert('Error sending message. Please try again.');
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@@ -37,7 +37,27 @@
|
||||
{
|
||||
<tr>
|
||||
<td><code>@order.Id.ToString().Substring(0, 8)...</code></td>
|
||||
<td>@order.ShippingName</td>
|
||||
<td>
|
||||
@if (order.Customer != null)
|
||||
{
|
||||
<div>
|
||||
<strong>@order.Customer.DisplayName</strong>
|
||||
@if (!string.IsNullOrEmpty(order.Customer.TelegramUsername))
|
||||
{
|
||||
<br><small class="text-muted">@@@order.Customer.TelegramUsername</small>
|
||||
}
|
||||
<br><small class="badge bg-info">@order.Customer.CustomerType</small>
|
||||
</div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<span class="text-muted">@order.ShippingName</span>
|
||||
@if (!string.IsNullOrEmpty(order.IdentityReference))
|
||||
{
|
||||
<br><small class="text-muted">(@order.IdentityReference)</small>
|
||||
}
|
||||
}
|
||||
</td>
|
||||
<td>@order.ShippingCity, @order.ShippingCountry</td>
|
||||
<td>
|
||||
@{
|
||||
@@ -60,6 +80,12 @@
|
||||
<a href="@Url.Action("Details", new { id = order.Id })" class="btn btn-sm btn-outline-primary">
|
||||
<i class="fas fa-eye"></i> View
|
||||
</a>
|
||||
@if (order.Customer != null)
|
||||
{
|
||||
<a href="@Url.Action("Details", new { id = order.Id })" class="btn btn-sm btn-success ms-1" title="Message Customer">
|
||||
<i class="fas fa-comment"></i>
|
||||
</a>
|
||||
}
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user