Adding link and dialog for creating a new standing order

app/assets/javascripts/admin/standing_orders/directives/new_standing_order_dialog.js.coffee

@@ -0,0 +1,28 @@
+angular.module("admin.standingOrders").directive 'newStandingOrderDialog', ($compile, $window, $templateCache, DialogDefaults, shops) ->
+  restrict: 'A'
+  scope: true
+  link: (scope, element, attr) ->
+    scope.submitted = false
+    scope.shops = shops
+    scope.shop_id = null
+
+    scope.newStandingOrder = ->
+      scope.new_standing_order_form.$setPristine()
+      scope.submitted = true
+      if scope.shop_id?
+        $window.location.href = "/admin/standing_orders/new?standing_order[shop_id]=#{scope.shop_id}"
+      return
+
+    # Compile modal template
+    template = $compile($templateCache.get('admin/new_standing_order_dialog.html'))(scope)
+
+    # Set Dialog options
+    template.dialog(DialogDefaults)
+
+    # Link opening of dialog to click event on element
+    element.bind 'click', (e) ->
+      if shops.length == 1
+        scope.shop_id = shops[0].id
+        scope.newStandingOrder()
+      else
+        template.dialog('open')

app/assets/javascripts/templates/admin/new_standing_order_dialog.html.haml

@@ -0,0 +1,14 @@
+#new-standing_order-dialog
+  .text-normal.margin-bottom-30.text-center
+    = t('admin.standing_orders.index.please_select_a_shop')
+
+  %form{ name: 'new_standing_order_form', novalidate: true, ng: { submit: "newStandingOrder()" }}
+
+    .text-center.margin-bottom-30
+      %input.ofn-select2.fullwidth#new_standing_order_shop_id{ ng: { model: 'shop_id' }, required: true, name: 'shop_id', data: 'shops' }
+      %div{ ng: { show: "submitted && new_standing_order_form.$pristine" } }
+        .error{ ng: { show: "new_standing_order_form.shop_id.$error.required" } }
+          = t('admin.standing_orders.index.please_select_a_shop')
+
+    .text-center
+      %input.button.red.icon-plus{ type: 'submit', value: t('continue') }

app/views/admin/standing_orders/index.html.haml

@@ -4,6 +4,11 @@
 - content_for :app_wrapper_attrs do
   = "ng-app='admin.standingOrders'"
 
+- content_for :page_actions do
+  %li
+    %a.button.icon-plus#new-standing-order{ href: "javascript:void(0)", "new-standing-order-dialog" => true }
+      = t('admin.standing_orders.new')
+
 = admin_inject_column_preferences module: 'admin.standingOrders'
 = render 'data'
 

config/locales/en.yml

@@ -798,6 +798,8 @@ en:
       standing_orders: Standing Orders
       new: New Standing Order
       create: Create Standing Order
+      index:
+        please_select_a_shop: Please select a shop
       steps:
         details: 1. Basic Details
         address: 2. Address

spec/features/admin/standing_orders_spec.rb

@@ -76,7 +76,10 @@ feature 'Standing Orders' do
       let!(:shipping_method) { create(:shipping_method, distributors: [shop]) }
 
       it "passes the smoke test" do
-        visit new_admin_standing_order_path(standing_order: { shop_id: shop.id })
+        visit admin_standing_orders_path
+        click_link 'New Standing Order'
+        select2_select shop.name, from: 'new_standing_order_shop_id'
+        click_button 'Continue'
 
         select2_select customer.email, from: 'customer_id'
         select2_select schedule.name, from: 'schedule_id'