mirror of
https://github.com/openfoodfoundation/openfoodnetwork
synced 2026-01-25 20:46:48 +00:00
278a8b1ec2
* Keep save bar visible as long as there's a customer form displayed. * Only display "You have unsaved changes" when there's any difference from the original values. If form changes are reverted, hide that note. * Similarly, only let the button be enabled if there are any actual changes to be saved.
107 lines
7.0 KiB
Plaintext
107 lines
7.0 KiB
Plaintext
- content_for :page_title do
|
|
%h1.page-title
|
|
=t :customers
|
|
|
|
- content_for :main_ng_app_name do
|
|
= "admin.customers"
|
|
|
|
- content_for :page_actions do
|
|
%li
|
|
%a.button.icon-plus#new-customer{ href: "#", "new-customer-dialog" => true }
|
|
= t('admin.customers.index.new_customer')
|
|
|
|
= admin_inject_column_preferences(module: 'admin.customers')
|
|
= admin_inject_shops(@shops, module: 'admin.customers')
|
|
= admin_inject_available_countries(module: 'admin.customers')
|
|
|
|
%div{ "ng-controller": 'customersCtrl' }
|
|
.row.filters
|
|
.sixteen.columns.alpha.omega
|
|
.filter_select.five.columns.alpha
|
|
%label{ for: 'quick_search', "ng-class": '{disabled: !shop_id}' }=t('admin.quick_search')
|
|
%br
|
|
%input.fullwidth{ type: "text", id: 'quick_search', placeholder: t('.search_by_email'), "ng-model": 'quickSearch', "ng-disabled": '!shop_id' }
|
|
.filter_select.four.columns
|
|
%label{ for: 'hub_id', "ng-bind": "shop_id ? '#{t('admin.shop')}' : '#{t('admin.variant_overrides.index.select_a_shop')}'" }
|
|
%br
|
|
%input.ofn-select2.fullwidth#shop_id{ "ng-model": 'shop_id', name: 'shop_id', data: 'shops', "on-selecting": 'confirmRefresh' }
|
|
.seven.columns.omega
|
|
|
|
%hr.divider{ "ng-show": "!RequestMonitor.loading && filteredCustomers.length > 0" }
|
|
|
|
.row.controls{ "ng-show": "!RequestMonitor.loading && filteredCustomers.length > 0" }
|
|
.thirteen.columns.alpha
|
|
%columns-dropdown{ action: "#{controller_name}_#{action_name}" }
|
|
|
|
.row{ 'ng-if' => 'shop_id && RequestMonitor.loading' }
|
|
.sixteen.columns.alpha#loading
|
|
= render partial: "components/admin_spinner"
|
|
%h1
|
|
= t :loading_customers
|
|
|
|
.row.margin-bottom-50{ "ng-show": "!RequestMonitor.loading" }
|
|
%form{ name: "customers_form" }
|
|
%h1#no_results{ 'ng-show' => '!RequestMonitor.loading && filteredCustomers.length == 0' }
|
|
=t :no_customers_found
|
|
|
|
%save-bar{ persist: "filteredCustomers.length > 0" }
|
|
%input.red{ type: "button", value: t(:save_changes), "ng-click": "submitAll(customers_form)", "ng-disabled": "!hasUnsavedChanges()" }
|
|
|
|
%table.index#customers{ 'ng-show' => '!RequestMonitor.loading && filteredCustomers.length > 0' }
|
|
%col.email{ width: "20%", 'ng-show' => 'columns.email.visible' }
|
|
%col.first_name{ width: "20%", 'ng-show' => 'columns.first_name.visible' }
|
|
%col.last_name{ width: "20%", 'ng-show' => 'columns.last_name.visible' }
|
|
%col.code{ width: "10%", 'ng-show' => 'columns.code.visible' }
|
|
%col.tags{ width: "20%", 'ng-show' => 'columns.tags.visible' }
|
|
%col.bill_address{ width: "10%", 'ng-show' => 'columns.bill_address.visible' }
|
|
%col.ship_address{ width: "10%", 'ng-show' => 'columns.ship_address.visible' }
|
|
%col.balance{ width: "10%", 'ng-show' => 'columns.balance.visible' }
|
|
%col.actions{ width: "10%"}
|
|
%thead
|
|
%tr{ "ng-controller": "ColumnsCtrl" }
|
|
-# %th.bulk
|
|
-# %input{ :type => "checkbox", :name => 'toggle_bulk', 'ng-click' => 'toggleAllCheckboxes()', 'ng-checked' => "allBoxesChecked()" }
|
|
%th.email{ 'ng-show' => 'columns.email.visible' }
|
|
%a{ :href => '', 'ng-click' => "sorting.toggle('email')" }=t('admin.email')
|
|
%th.first_name{ 'ng-show' => 'columns.first_name.visible' }
|
|
%a{ :href => '', 'ng-click' => "sorting.toggle('first_name')" }=t('admin.first_name')
|
|
%th.last_name{ 'ng-show' => 'columns.last_name.visible' }
|
|
%a{ :href => '', 'ng-click' => "sorting.toggle('last_name')" }=t('admin.last_name')
|
|
%th.code{ 'ng-show' => 'columns.code.visible' }
|
|
%a{ :href => '', 'ng-click' => "sorting.toggle('code')" }=t('admin.customers.index.code')
|
|
%th.tags{ 'ng-show' => 'columns.tags.visible' }=t('admin.tags')
|
|
%th.bill_address{ 'ng-show' => 'columns.bill_address.visible' }=t('admin.customers.index.bill_address')
|
|
%th.ship_address{ 'ng-show' => 'columns.ship_address.visible' }=t('admin.customers.index.ship_address')
|
|
%th.balance{ 'ng-show' => 'columns.balance.visible' }=t('admin.customers.index.balance')
|
|
%tbody
|
|
%tr.customer{ 'ng-repeat' => "customer in filteredCustomers = ( customers | filter:quickSearch | orderBy: sorting.predicate:sorting.reverse ) | limitTo:customerLimit track by customer.id", 'ng-class-even' => "'even'", 'ng-class-odd' => "'odd'", :id => "c_{{customer.id}}" }
|
|
-# %td.bulk
|
|
-# %input{ :type => "checkbox", :name => 'bulk', 'ng-model' => 'customer.checked' }
|
|
%td.email{ 'ng-show' => 'columns.email.visible'}
|
|
%span{ 'ng-bind' => '::customer.email' }
|
|
%span.guest-label{ 'ng-show' => 'customer.user_id == null' }= t('.guest_label')
|
|
%td.first_name{ 'ng-show' => 'columns.first_name.visible'}
|
|
%input{ type: 'text', name: 'first_name', "obj-for-update": 'customer', "attr-for-update": 'first_name', "ng-model": 'customer.first_name' }
|
|
%td.last_name{ 'ng-show' => 'columns.last_name.visible'}
|
|
%input{ type: 'text', name: 'last_name', "obj-for-update": 'customer', "attr-for-update": 'last_name', "ng-model": 'customer.last_name' }
|
|
%td.code{ 'ng-show' => 'columns.code.visible' }
|
|
%input{ type: 'text', name: 'code', "obj-for-update": "customer", "attr-for-update": "code", "ng-model": 'customer.code', "ng-change": 'checkForDuplicateCodes()' }
|
|
%i.icon-warning-sign{ "ng-if": 'duplicate' }
|
|
= t('.duplicate_code')
|
|
%td.tags{ 'ng-show' => 'columns.tags.visible' }
|
|
.tag_watcher{ 'obj-for-update' => "customer", "attr-for-update" => "tag_list"}
|
|
%tags_with_translation{ object: 'customer', 'find-tags' => 'findTags(query)' }
|
|
%td.bill_address{ 'ng-show' => 'columns.bill_address.visible' }
|
|
%a{ id: 'bill-address-link', href: 'javascript:void(0)', "ng-bind" => "customer.bill_address ? customer.bill_address.address1 : '#{t('admin.customers.index.edit')}' | limitTo: 15", 'edit-address-dialog' => true }
|
|
%td.ship_address{ 'ng-show' => 'columns.ship_address.visible' }
|
|
%a{ id: 'ship-address-link', href: 'javascript:void(0)', "ng-bind" => "customer.ship_address ? customer.ship_address.address1 : '#{t('admin.customers.index.edit')}' | limitTo: 15", 'edit-address-dialog' => true }
|
|
%td.balance.align-center{ 'ng-show' => 'columns.balance.visible'}
|
|
%span.state.white-space-nowrap{ 'ng-class' => 'customer.balance_status', 'ng-bind' => 'displayBalanceStatus(customer)' }
|
|
%span{ 'ng-bind' => '::customer.balance' }
|
|
%td.actions
|
|
%a{ 'ng-click' => "deleteCustomer(customer)", :class => "delete-customer icon-trash no-text" }
|
|
|
|
.text-center{ "ng-show": "filteredCustomers.length > customerLimit" }
|
|
%input{ type: 'button', value: t(:show_more), "ng-click": 'customerLimit = customerLimit + 20' }
|
|
%input{ type: 'button', value: t(:show_all_with_more, num: '{{ filteredCustomers.length - customerLimit }}'), "ng-click": 'customerLimit = filteredCustomers.length' }
|