270 lines
13 KiB
HTML
270 lines
13 KiB
HTML
{{define "title"}}{{if .Enquiry.ID}}Edit{{else}}New{{end}} Enquiry - CMC Sales{{end}}
|
|
|
|
{{define "content"}}
|
|
<div class="columns">
|
|
<div class="column is-8 is-offset-2">
|
|
<div class="card">
|
|
<header class="card-header">
|
|
<p class="card-header-title">
|
|
{{if .Enquiry.ID}}
|
|
Edit Enquiry: {{.Enquiry.Title}}
|
|
{{else}}
|
|
New Enquiry
|
|
{{end}}
|
|
</p>
|
|
</header>
|
|
<div class="card-content">
|
|
<form
|
|
{{if .Enquiry.ID}}
|
|
hx-put="/api/v1/enquiries/{{.Enquiry.ID}}"
|
|
{{else}}
|
|
hx-post="/api/v1/enquiries"
|
|
{{end}}
|
|
hx-headers='{"Content-Type": "application/json"}'
|
|
hx-target="#form-response">
|
|
|
|
<!-- Basic Information -->
|
|
<div class="field">
|
|
<label class="label">Title/Enquiry Number</label>
|
|
<div class="control">
|
|
<input
|
|
class="input"
|
|
type="text"
|
|
name="title"
|
|
value="{{.Enquiry.Title}}"
|
|
placeholder="Auto-generated if left blank">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="columns">
|
|
<div class="column">
|
|
<div class="field">
|
|
<label class="label">User (Sales Rep)</label>
|
|
<div class="control">
|
|
<div class="select is-fullwidth">
|
|
<select name="user_id" required>
|
|
<option value="">Select User</option>
|
|
{{range .Users}}
|
|
<option value="{{.ID}}" {{if eq .ID $.Enquiry.UserID}}selected{{end}}>
|
|
{{.FirstName}} {{.LastName}}
|
|
</option>
|
|
{{end}}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="field">
|
|
<label class="label">Status</label>
|
|
<div class="control">
|
|
<div class="select is-fullwidth">
|
|
<select name="status_id" required>
|
|
{{range .Statuses}}
|
|
<option value="{{.ID}}" {{if eq .ID $.Enquiry.StatusID}}selected{{end}}>
|
|
{{.Name}}
|
|
</option>
|
|
{{end}}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Customer and Contact -->
|
|
<div class="columns">
|
|
<div class="column">
|
|
<div class="field">
|
|
<label class="label">Customer</label>
|
|
<div class="control">
|
|
<div class="select is-fullwidth">
|
|
<select name="customer_id" required>
|
|
<option value="">Select Customer</option>
|
|
{{range .Customers}}
|
|
<option value="{{.ID}}" {{if eq .ID $.Enquiry.CustomerID}}selected{{end}}>
|
|
{{.Name}}
|
|
</option>
|
|
{{end}}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="field">
|
|
<label class="label">Contact</label>
|
|
<div class="control">
|
|
<div class="select is-fullwidth">
|
|
<select name="contact_user_id" required>
|
|
<option value="">Select Contact</option>
|
|
{{range .Contacts}}
|
|
<option value="{{.ID}}" {{if eq .ID $.Enquiry.ContactUserID}}selected{{end}}>
|
|
{{.FirstName}} {{.LastName}}
|
|
</option>
|
|
{{end}}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Location -->
|
|
<div class="columns">
|
|
<div class="column">
|
|
<div class="field">
|
|
<label class="label">State</label>
|
|
<div class="control">
|
|
<div class="select is-fullwidth">
|
|
<select name="state_id" required>
|
|
{{range .States}}
|
|
<option value="{{.ID}}" {{if eq .ID $.Enquiry.StateID}}selected{{end}}>
|
|
{{.Name}}
|
|
</option>
|
|
{{end}}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column">
|
|
<div class="field">
|
|
<label class="label">Country</label>
|
|
<div class="control">
|
|
<div class="select is-fullwidth">
|
|
<select name="country_id" required>
|
|
{{range .Countries}}
|
|
<option value="{{.ID}}" {{if eq .ID $.Enquiry.CountryID}}selected{{end}}>
|
|
{{.Name}}
|
|
</option>
|
|
{{end}}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Principle -->
|
|
<div class="field">
|
|
<label class="label">Principle (Supplier)</label>
|
|
<div class="control">
|
|
<div class="select is-fullwidth">
|
|
<select name="principle_id" required>
|
|
<option value="">Select Principle</option>
|
|
{{range .Principles}}
|
|
<option value="{{.ID}}" {{if eq .ID $.Enquiry.PrincipleID}}selected{{end}}>
|
|
{{if .ShortName}}
|
|
{{.ShortName}} - {{.Name}}
|
|
{{else}}
|
|
{{.Name}}
|
|
{{end}}
|
|
</option>
|
|
{{end}}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Comments -->
|
|
<div class="field">
|
|
<label class="label">Comments</label>
|
|
<div class="control">
|
|
<textarea
|
|
class="textarea"
|
|
name="comments"
|
|
rows="4"
|
|
placeholder="Enter enquiry details and comments...">{{.Enquiry.Comments}}</textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Options -->
|
|
<div class="field">
|
|
<div class="control">
|
|
<label class="checkbox">
|
|
<input type="checkbox" name="gst" {{if .Enquiry.Gst}}checked{{end}}>
|
|
GST Applicable
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<div class="control">
|
|
<label class="checkbox">
|
|
<input type="checkbox" name="posted" {{if .Enquiry.Posted}}checked{{end}}>
|
|
Posted
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
{{if not .Enquiry.ID}}
|
|
<div class="field">
|
|
<div class="control">
|
|
<label class="checkbox">
|
|
<input type="checkbox" name="send_enquiry_email" checked>
|
|
Send enquiry email to contact
|
|
</label>
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
|
|
<!-- Submit Buttons -->
|
|
<div class="field is-grouped">
|
|
<div class="control">
|
|
<button type="submit" class="button is-primary">
|
|
{{if .Enquiry.ID}}Update{{else}}Create{{end}} Enquiry
|
|
</button>
|
|
</div>
|
|
<div class="control">
|
|
<a href="/enquiries" class="button is-light">Cancel</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Response area -->
|
|
<div id="form-response"></div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
|
|
{{define "scripts"}}
|
|
<script>
|
|
// Handle form submission success
|
|
document.addEventListener('htmx:afterSwap', function(evt) {
|
|
if (evt.detail.target.id === 'form-response') {
|
|
// Redirect to enquiry view on successful creation/update
|
|
const response = evt.detail.xhr.response;
|
|
if (evt.detail.xhr.status === 200 || evt.detail.xhr.status === 201) {
|
|
try {
|
|
const enquiry = JSON.parse(response);
|
|
window.location.href = '/enquiries/' + enquiry.id;
|
|
} catch (e) {
|
|
// If parsing fails, redirect to index
|
|
window.location.href = '/enquiries';
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
// Customer selection triggers contact loading
|
|
document.querySelector('select[name="customer_id"]').addEventListener('change', function(e) {
|
|
const customerId = e.target.value;
|
|
if (customerId) {
|
|
// Load contacts for selected customer
|
|
fetch(`/api/v1/customers/${customerId}/contacts`)
|
|
.then(response => response.json())
|
|
.then(contacts => {
|
|
const contactSelect = document.querySelector('select[name="contact_user_id"]');
|
|
contactSelect.innerHTML = '<option value="">Select Contact</option>';
|
|
contacts.forEach(contact => {
|
|
contactSelect.innerHTML += `<option value="${contact.id}">${contact.first_name} ${contact.last_name}</option>`;
|
|
});
|
|
})
|
|
.catch(err => console.error('Failed to load contacts:', err));
|
|
}
|
|
});
|
|
</script>
|
|
{{end}} |