From e18a242b903068121d8bf6fa2d93165ff112f3b2 Mon Sep 17 00:00:00 2001 From: binarygit Date: Tue, 9 Aug 2022 12:58:24 +0545 Subject: [PATCH 1/4] Render admin/enterprises//edit page using stimulus --- app/helpers/admin/enterprises_helper.rb | 29 +++++++ app/views/admin/enterprises/_form.html.haml | 84 +++++-------------- .../admin/enterprises/_ng_form.html.haml | 3 +- app/views/admin/shared/_side_menu.html.haml | 14 ++-- .../controllers/tabs_and_panels_controller.js | 40 +++++++++ .../tabs_and_panels_controller_test.js | 48 +++++++++++ spec/system/admin/enterprises_spec.rb | 6 +- 7 files changed, 149 insertions(+), 75 deletions(-) create mode 100644 app/webpacker/controllers/tabs_and_panels_controller.js create mode 100644 spec/javascripts/stimulus/tabs_and_panels_controller_test.js diff --git a/app/helpers/admin/enterprises_helper.rb b/app/helpers/admin/enterprises_helper.rb index 59945d274ca..e95f4589edc 100644 --- a/app/helpers/admin/enterprises_helper.rb +++ b/app/helpers/admin/enterprises_helper.rb @@ -13,5 +13,34 @@ def add_check_if_single(count) def select_only_item(producers) producers.size == 1 ? producers.first.id : nil end + + def enterprise_side_menu_items(enterprise) + is_shop = enterprise.sells != "none" + show_properties = !!enterprise.is_primary_producer + show_shipping_methods = can?(:manage_shipping_methods, enterprise) && is_shop + show_payment_methods = can?(:manage_payment_methods, enterprise) && is_shop + show_enterprise_fees = can?(:manage_enterprise_fees, + enterprise) && (is_shop || enterprise.is_primary_producer) + + [ + { name: 'primary_details', icon_class: "icon-home", show: true, selected: 'selected' }, + { name: 'address', icon_class: "icon-map-marker", show: true }, + { name: 'contact', icon_class: "icon-phone", show: true }, + { name: 'social', icon_class: "icon-twitter", show: true }, + { name: 'about', icon_class: "icon-pencil", show: true, form_name: "about_us" }, + { name: 'business_details', icon_class: "icon-briefcase", show: true }, + { name: 'images', icon_class: "icon-picture", show: true }, + { name: 'properties', icon_class: "icon-tags", show: show_properties }, + { name: 'shipping_methods', icon_class: "icon-truck", show: show_shipping_methods }, + { name: 'payment_methods', icon_class: "icon-money", show: show_payment_methods }, + { name: 'enterprise_fees', icon_class: "icon-tasks", show: show_enterprise_fees }, + { name: 'enterprise_permissions', icon_class: "icon-plug", show: true, + href: admin_enterprise_relationships_path }, + { name: 'inventory_settings', icon_class: "icon-list-ol", show: is_shop }, + { name: 'tag_rules', icon_class: "icon-random", show: is_shop }, + { name: 'shop_preferences', icon_class: "icon-shopping-cart", show: is_shop }, + { name: 'users', icon_class: "icon-user", show: true } + ] + end end end diff --git a/app/views/admin/enterprises/_form.html.haml b/app/views/admin/enterprises/_form.html.haml index 3fc9e9ebaac..75b9109e074 100644 --- a/app/views/admin/enterprises/_form.html.haml +++ b/app/views/admin/enterprises/_form.html.haml @@ -1,63 +1,21 @@ -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='primary_details'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/primary_details', f: f - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='users'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/users', f: f - -= f.fields_for :address do |af| - %fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='address'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/address', af: af - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='contact'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/contact', f: f - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='social'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/social', f: f - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='business_details'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/business_details', f: f - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='about'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/about_us', f: f - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='images'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/images', f: f - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='properties'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/properties', f: f - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='shipping_methods'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/shipping_methods', f: f - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='payment_methods'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/payment_methods', f: f - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='enterprise_fees'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/enterprise_fees', f: f - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='enterprise_permissions'" } } - %legend {{menu.selected.label}} - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='inventory_settings'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/inventory_settings', f: f - -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='shop_preferences'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/shop_preferences', f: f - -%fieldset.alpha.no-border-bottom{ ng: { if: "menu.selected.name=='tag_rules'" } } - %legend {{menu.selected.label}} - = render 'admin/enterprises/form/tag_rules', f: f +- enterprise_side_menu_items(@enterprise).each do |item| + - case item[:name] + - when 'primary_details' + %fieldset.alpha.no-border-bottom{ id: "#{item[:name]}_panel", data: { "tabs-and-panels-target": "panel default" }} + %legend= t("#{ item[:name] }") + = render "admin/enterprises/form/#{ item[:form_name] || item[:name] }", f: f + + - when 'address' + = f.fields_for :address do |af| + %fieldset.alpha.no-border-bottom{ id: "#{item[:name]}_panel", data: { "tabs-and-panels-target": "panel" }} + %legend= t("#{ item[:name] }") + = render 'admin/enterprises/form/address', af: af + + - when 'enterprise_permissions' + %fieldset.alpha.no-border-bottom{ id: "#{item[:name]}_panel", data: { "tabs-and-panels-target": "panel" }} + %legend= t("#{ item[:name] }") + + - else + %fieldset.alpha.no-border-bottom{ id: "#{item[:name]}_panel", data: { "tabs-and-panels-target": "panel" }} + %legend= t("#{ item[:name] }") + = render "admin/enterprises/form/#{ item[:form_name] || item[:name] }", f: f diff --git a/app/views/admin/enterprises/_ng_form.html.haml b/app/views/admin/enterprises/_ng_form.html.haml index 44511d35ec6..9dd03271ea2 100644 --- a/app/views/admin/enterprises/_ng_form.html.haml +++ b/app/views/admin/enterprises/_ng_form.html.haml @@ -10,7 +10,8 @@ %input.red{ type: "button", value: t(:update), ng: { click: "submit()", disabled: "!enterprise_form.$dirty" } } %input{ type: "button", ng: { value: "enterprise_form.$dirty ? '#{t(:cancel)}' : '#{t(:close)}'", click: "cancel('#{main_app.admin_enterprises_path}')" } } - .row + .row{ data: { + controller: "tabs-and-panels", "tabs-and-panels-class-name-value": "selected" }} .sixteen.columns.alpha .four.columns.alpha = render 'admin/shared/side_menu' diff --git a/app/views/admin/shared/_side_menu.html.haml b/app/views/admin/shared/_side_menu.html.haml index 267a3419919..9618e52c458 100644 --- a/app/views/admin/shared/_side_menu.html.haml +++ b/app/views/admin/shared/_side_menu.html.haml @@ -1,8 +1,6 @@ -.side_menu{ ng: { controller: 'sideMenuCtrl' } } - %a.menu_item{ href: "", id: "{{ item.name.toLowerCase().replace(' ', '_') }}", - ng: { repeat: '(index,item) in menu.items | filter:{visible:true}', - click: 'select(index)', - show: '!showItem || showItem(item)', - class: '{ selected: item.selected }' } } - %i{ class: "{{item.icon_class}}" } - %span {{ item.label }} +.side_menu + - enterprise_side_menu_items(@enterprise).each do |item| + - next unless item[:show] + %a.menu_item{ href: item[:href] || "##{item[:name]}_panel", id: item[:name], data: { action: "tabs-and-panels#changeActivePanel tabs-and-panels#changeActiveTab", "tabs-and-panels-target": "tab" }, class: item[:selected] } + %i{ class: item[:icon_class] } + %span= t("#{item[:name] }") diff --git a/app/webpacker/controllers/tabs_and_panels_controller.js b/app/webpacker/controllers/tabs_and_panels_controller.js new file mode 100644 index 00000000000..0a1762cedb1 --- /dev/null +++ b/app/webpacker/controllers/tabs_and_panels_controller.js @@ -0,0 +1,40 @@ +import { Controller } from "stimulus"; + +export default class extends Controller { + static targets = ["tab", "panel", "default"]; + static values = { className: String }; + + connect() { + // hide all active panel + this.panelTargets.forEach((panel) => { + panel.style.display = "none"; + }); + + // only display the default panel + this.defaultTarget.style.display = "block"; + } + + changeActivePanel(event) { + const newActivePanel = this.panelTargets.find( + (panel) => panel.id == `${event.currentTarget.id}_panel` + ); + + this.currentActivePanel.style.display = "none"; + newActivePanel.style.display = "block"; + } + + changeActiveTab(event) { + this.currentActiveTab.classList.remove(`${this.classNameValue}`); + event.currentTarget.classList.add(`${this.classNameValue}`); + } + + get currentActiveTab() { + return this.tabTargets.find((tab) => tab.classList.contains("selected")); + } + + get currentActivePanel() { + return this.panelTargets.find( + (panel) => panel.id == `${this.currentActiveTab.id}_panel` + ); + } +} diff --git a/spec/javascripts/stimulus/tabs_and_panels_controller_test.js b/spec/javascripts/stimulus/tabs_and_panels_controller_test.js new file mode 100644 index 00000000000..8fdfedd117a --- /dev/null +++ b/spec/javascripts/stimulus/tabs_and_panels_controller_test.js @@ -0,0 +1,48 @@ +/** + * @jest-environment jsdom + */ + +import { Application } from "stimulus"; +import tabs_and_panels_controller from "../../../app/webpacker/controllers/tabs_and_panels_controller"; + +describe("EnterprisePanelController", () => { + beforeAll(() => { + const application = Application.start(); + application.register("tabs-and-panels", tabs_and_panels_controller); + }); + + describe("#tabs-and-panels", () => { + beforeEach(() => { + document.body.innerHTML = ` +
+ Peek + Ka + Boo + + +
Peek me
+
Ka you
+
Boo three
+
`; + }); + + it("displays only the default panel", () => { + const peekPanel = document.getElementById("peek_panel"); + const kaPanel = document.getElementById("ka_panel"); + const booPanel = document.getElementById("boo_panel"); + + expect(peekPanel.style.display).toBe("block"); + expect(kaPanel.style.display).toBe("none"); + expect(booPanel.style.display).toBe("none"); + }); + + it("displays appropriate panel when associated tab is clicked", () => { + const kaPanel = document.getElementById("ka_panel"); + const ka = document.getElementById("ka"); + + expect(kaPanel.style.display).toBe("none"); + ka.click(); + expect(kaPanel.style.display).toBe("block"); + }); + }); +}); diff --git a/spec/system/admin/enterprises_spec.rb b/spec/system/admin/enterprises_spec.rb index 00c244e7b2f..9a892505b57 100644 --- a/spec/system/admin/enterprises_spec.rb +++ b/spec/system/admin/enterprises_spec.rb @@ -108,7 +108,7 @@ description_input = page.find("text-angular#enterprise_long_description div[id^='taTextElement']") description_input.native.send_keys('This is an interesting long description') - # Check Angularjs switching of sidebar elements + # Check StimulusJs switching of sidebar elements accept_alert do click_link "Primary Details" end @@ -485,7 +485,7 @@ end choose "enterprise_preferred_shopfront_product_sorting_method_by_category" - find("#s2id_autogen7").click + find("#s2id_enterprise_preferred_shopfront_taxon_order").click find(".select2-result-label", text: "Tricky Taxon").click click_button 'Update' expect(flash_message).to eq('Enterprise "First Distributor" has been successfully updated!') @@ -506,7 +506,7 @@ end choose "enterprise_preferred_shopfront_product_sorting_method_by_producer" - find("#s2id_autogen8").click + find("#s2id_enterprise_preferred_shopfront_producer_order").click find(".select2-result-label", text: "First Supplier").click click_button 'Update' expect(flash_message).to eq('Enterprise "First Distributor" has been successfully updated!') From 6b56a8df0a974b53ab880d505afd054d142aea4a Mon Sep 17 00:00:00 2001 From: binarygit Date: Wed, 10 Aug 2022 15:11:53 +0545 Subject: [PATCH 2/4] Display/hide side-menu items when values in primary details change --- .../admin/enterprises_controller.rb | 7 ++++- app/views/admin/enterprises/_form.html.haml | 2 +- .../form/_primary_details.html.haml | 9 +++--- app/views/admin/shared/_side_menu.html.haml | 2 +- .../controllers/primary_details_controller.js | 30 +++++++++++++++++++ 5 files changed, 42 insertions(+), 8 deletions(-) create mode 100644 app/webpacker/controllers/primary_details_controller.js diff --git a/app/controllers/admin/enterprises_controller.rb b/app/controllers/admin/enterprises_controller.rb index c68cbdac7cc..be4cf045869 100644 --- a/app/controllers/admin/enterprises_controller.rb +++ b/app/controllers/admin/enterprises_controller.rb @@ -7,6 +7,7 @@ module Admin class EnterprisesController < Admin::ResourceController include GeocodeEnterpriseAddress + include CablecarResponses # These need to run before #load_resource so that @object is initialised with sanitised values prepend_before_action :override_owner, only: :create @@ -44,7 +45,11 @@ def index def edit @object = Enterprise.where(permalink: params[:id]). includes(users: [:ship_address, :bill_address]).first - super + if params[:stimulus] + @enterprise.is_primary_producer = params[:is_primary_producer] + @enterprise.sells = params[:enterprise_sells] + render operations: cable_car.morph("#side_menu", partial("admin/shared/side_menu")) + end end def welcome diff --git a/app/views/admin/enterprises/_form.html.haml b/app/views/admin/enterprises/_form.html.haml index 75b9109e074..a3347744100 100644 --- a/app/views/admin/enterprises/_form.html.haml +++ b/app/views/admin/enterprises/_form.html.haml @@ -1,7 +1,7 @@ - enterprise_side_menu_items(@enterprise).each do |item| - case item[:name] - when 'primary_details' - %fieldset.alpha.no-border-bottom{ id: "#{item[:name]}_panel", data: { "tabs-and-panels-target": "panel default" }} + %fieldset.alpha.no-border-bottom{ id: "#{item[:name]}_panel", data: { controller: "primary-details", "primary-details-primary-producer-value": @enterprise.is_primary_producer.to_s, "primary-details-enterprise-sells-value": @enterprise.sells, "tabs-and-panels-target": "panel default" }} %legend= t("#{ item[:name] }") = render "admin/enterprises/form/#{ item[:form_name] || item[:name] }", f: f diff --git a/app/views/admin/enterprises/form/_primary_details.html.haml b/app/views/admin/enterprises/form/_primary_details.html.haml index ac7f37b5841..110cfe1215c 100644 --- a/app/views/admin/enterprises/form/_primary_details.html.haml +++ b/app/views/admin/enterprises/form/_primary_details.html.haml @@ -12,14 +12,13 @@ %a= t('admin.whats_this') .eight.columns.omega = f.collection_select :group_ids, @groups, :id, :name, {}, class: "select2 fullwidth", multiple: true, placeholder: t('.groups_placeholder') - .row .three.columns.alpha %label= t('.primary_producer') %div{'ofn-with-tip' => t('.primary_producer_tip')} %a= t('admin.whats_this') .five.columns.omega - = f.check_box :is_primary_producer, 'ng-model' => 'Enterprise.is_primary_producer' + = f.check_box :is_primary_producer, data: { action: "change->primary-details#primaryProducerChanged" } = f.label :is_primary_producer, t('.producer') - if spree_current_user.admin? .row @@ -28,13 +27,13 @@ %div{'ofn-with-tip' => t('.sells_tip')} %a= t('admin.whats_this') .two.columns - = f.radio_button :sells, "none", 'ng-model' => 'Enterprise.sells' + = f.radio_button :sells, "none", 'ng-model' => 'Enterprise.sells', data: {action: "change->primary-details#enterpriseSellsChanged"} = f.label :sells, t('.none'), value: "none" .two.columns - = f.radio_button :sells, "own", 'ng-model' => 'Enterprise.sells' + = f.radio_button :sells, "own", 'ng-model' => 'Enterprise.sells', data: {action: "change->primary-details#enterpriseSellsChanged"} = f.label :sells, t('.own'), value: "own" .four.columns.omega - = f.radio_button :sells, "any", 'ng-model' => 'Enterprise.sells' + = f.radio_button :sells, "any", 'ng-model' => 'Enterprise.sells', data: {action: "change->primary-details#enterpriseSellsChanged"} = f.label :sells, t('.any'), value: "any" .row .three.columns.alpha diff --git a/app/views/admin/shared/_side_menu.html.haml b/app/views/admin/shared/_side_menu.html.haml index 9618e52c458..73ee63ab077 100644 --- a/app/views/admin/shared/_side_menu.html.haml +++ b/app/views/admin/shared/_side_menu.html.haml @@ -1,4 +1,4 @@ -.side_menu +.side_menu#side_menu - enterprise_side_menu_items(@enterprise).each do |item| - next unless item[:show] %a.menu_item{ href: item[:href] || "##{item[:name]}_panel", id: item[:name], data: { action: "tabs-and-panels#changeActivePanel tabs-and-panels#changeActiveTab", "tabs-and-panels-target": "tab" }, class: item[:selected] } diff --git a/app/webpacker/controllers/primary_details_controller.js b/app/webpacker/controllers/primary_details_controller.js new file mode 100644 index 00000000000..d17bfc45663 --- /dev/null +++ b/app/webpacker/controllers/primary_details_controller.js @@ -0,0 +1,30 @@ +import { Controller } from "stimulus"; +import CableReady from "cable_ready"; + +export default class extends Controller { + static values = { primaryProducer: String, enterpriseSells: String }; + + primaryProducerChanged(event) { + this.primaryProducerValue = event.currentTarget.checked; + this.makeRequest(); + } + + enterpriseSellsChanged(event) { + if (event.currentTarget.checked) { + this.enterpriseSellsValue = event.currentTarget.value; + this.makeRequest(); + } + } + + makeRequest() { + fetch( + `?stimulus=true&enterprise_sells=${this.enterpriseSellsValue}&is_primary_producer=${this.primaryProducerValue}`, + { + method: "GET", + headers: { "Content-type": "application/json; charset=UTF-8" }, + } + ) + .then((data) => data.json()) + .then(CableReady.perform); + } +} From 27552c99b875baeb9e7a6b4b3a431f26017fdb40 Mon Sep 17 00:00:00 2001 From: binarygit Date: Wed, 10 Aug 2022 15:14:09 +0545 Subject: [PATCH 3/4] Render enterprise groups #edit and #new page using stimulus --- app/helpers/admin/enterprise_groups_helper.rb | 17 +++++++++++++++++ .../admin/enterprise_groups/_form.html.haml | 2 +- .../enterprise_groups/_form_about.html.haml | 4 ++-- .../enterprise_groups/_form_address.html.haml | 4 ++-- .../enterprise_groups/_form_images.html.haml | 4 ++-- .../_form_primary_details.html.haml | 4 ++-- .../enterprise_groups/_form_users.html.haml | 4 ++-- .../admin/enterprise_groups/_form_web.html.haml | 4 ++-- app/views/admin/shared/_side_menu.html.haml | 17 ++++++++++++----- 9 files changed, 42 insertions(+), 18 deletions(-) create mode 100644 app/helpers/admin/enterprise_groups_helper.rb diff --git a/app/helpers/admin/enterprise_groups_helper.rb b/app/helpers/admin/enterprise_groups_helper.rb new file mode 100644 index 00000000000..11ad3c81ac0 --- /dev/null +++ b/app/helpers/admin/enterprise_groups_helper.rb @@ -0,0 +1,17 @@ +# frozen_string_literal: true + +module Admin + module EnterpriseGroupsHelper + def enterprise_group_side_menu_items + [ + { name: 'primary_details', label: 'primary_details', icon_class: "icon-user", + selected: "selected" }, + { name: 'users', label: 'users', icon_class: "icon-user" }, + { name: 'about', label: 'about', icon_class: "icon-pencil" }, + { name: 'images', label: 'images', icon_class: "icon-picture" }, + { name: 'contact', label: 'admin_enterprise_groups_contact', icon_class: "icon-phone" }, + { name: 'web', label: 'admin_enterprise_groups_web', icon_class: "icon-globe" }, + ] + end + end +end diff --git a/app/views/admin/enterprise_groups/_form.html.haml b/app/views/admin/enterprise_groups/_form.html.haml index 4bc31bd81a7..9e95a39879a 100644 --- a/app/views/admin/enterprise_groups/_form.html.haml +++ b/app/views/admin/enterprise_groups/_form.html.haml @@ -1,7 +1,7 @@ = render 'spree/shared/error_messages', target: @enterprise = form_for [main_app, :admin, @enterprise_group] do |f| - .row{ ng: {app: 'admin.enterprise_groups', controller: 'enterpriseGroupCtrl'} } + .row{ ng: {app: 'admin.enterprise_groups', controller: 'enterpriseGroupCtrl'}, data: { controller: 'tabs-and-panels', "tabs-and-panels-class-name-value": "selected" } } .sixteen.columns.alpha .four.columns.alpha = render 'admin/shared/side_menu' diff --git a/app/views/admin/enterprise_groups/_form_about.html.haml b/app/views/admin/enterprise_groups/_form_about.html.haml index 55edc977c1b..b2a28c49b16 100644 --- a/app/views/admin/enterprise_groups/_form_about.html.haml +++ b/app/views/admin/enterprise_groups/_form_about.html.haml @@ -1,5 +1,5 @@ -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='about'" } } - %legend {{menu.selected.label}} +%fieldset.alpha.no-border-bottom#about_panel{ data: { "tabs-and-panels-target": "panel" } } + %legend= t('about') = f.field_container :long_description do %text-angular{'id' => 'enterprise_group_long_description', 'name' => 'enterprise_group[long_description]', 'class' => 'text-angular', "textangular-links-target-blank" => true, 'ta-toolbar' => "[['h1','h2','h3','h4','p'],['bold','italics','underline','clear'],['insertLink']]"} diff --git a/app/views/admin/enterprise_groups/_form_address.html.haml b/app/views/admin/enterprise_groups/_form_address.html.haml index 1e93c5f7f9d..cf1876f908c 100644 --- a/app/views/admin/enterprise_groups/_form_address.html.haml +++ b/app/views/admin/enterprise_groups/_form_address.html.haml @@ -1,6 +1,6 @@ = f.fields_for :address do |af| - %fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='contact'" } } - %legend {{menu.selected.label}} + %fieldset.alpha.no-border-bottom#contact_panel{ data: { "tabs-and-panels-target": "panel" } } + %legend= t('admin_enterprise_groups_contact') .row .alpha.three.columns = af.label :phone diff --git a/app/views/admin/enterprise_groups/_form_images.html.haml b/app/views/admin/enterprise_groups/_form_images.html.haml index a86d4abf050..b2edd68b474 100644 --- a/app/views/admin/enterprise_groups/_form_images.html.haml +++ b/app/views/admin/enterprise_groups/_form_images.html.haml @@ -1,5 +1,5 @@ -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='images'" } } - %legend {{menu.selected.label}} +%fieldset.alpha.no-border-bottom#images_panel{ data: { "tabs-and-panels-target": "panel" } } + %legend= t('images') .row .alpha.three.columns = f.label :logo, 'ofn-with-tip' => t('admin_enterprise_groups_data_powertip_logo') diff --git a/app/views/admin/enterprise_groups/_form_primary_details.html.haml b/app/views/admin/enterprise_groups/_form_primary_details.html.haml index ad40764fac8..54550393065 100644 --- a/app/views/admin/enterprise_groups/_form_primary_details.html.haml +++ b/app/views/admin/enterprise_groups/_form_primary_details.html.haml @@ -1,5 +1,5 @@ -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='primary_details'" } } - %legend {{menu.selected.label}} +%fieldset.alpha.no-border-bottom#primary_details_panel{ data: { "tabs-and-panels-target": "panel default" } } + %legend= t('primary_details') = f.field_container :name do = f.label :name %br/ diff --git a/app/views/admin/enterprise_groups/_form_users.html.haml b/app/views/admin/enterprise_groups/_form_users.html.haml index e501ce83bea..75e51e0e3c6 100644 --- a/app/views/admin/enterprise_groups/_form_users.html.haml +++ b/app/views/admin/enterprise_groups/_form_users.html.haml @@ -1,5 +1,5 @@ -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='users'" } } - %legend {{menu.selected.label}} +%fieldset.alpha.no-border-bottom#users_panel{ data: { "tabs-and-panels-target": "panel" } } + %legend= t('users') .row .three.columns.alpha =f.label :owner_id, t(:admin_enterprise_groups_owner) diff --git a/app/views/admin/enterprise_groups/_form_web.html.haml b/app/views/admin/enterprise_groups/_form_web.html.haml index ad155ac95c8..186165a060d 100644 --- a/app/views/admin/enterprise_groups/_form_web.html.haml +++ b/app/views/admin/enterprise_groups/_form_web.html.haml @@ -1,5 +1,5 @@ -%fieldset.alpha.no-border-bottom{ ng: { show: "menu.selected.name=='web'" } } - %legend {{menu.selected.label}} +%fieldset.alpha.no-border-bottom#web_panel{ data: { "tabs-and-panels-target": "panel" } } + %legend= t('admin_enterprise_groups_web') .row .alpha.three.columns = f.label :website diff --git a/app/views/admin/shared/_side_menu.html.haml b/app/views/admin/shared/_side_menu.html.haml index 73ee63ab077..3cad9f9bd91 100644 --- a/app/views/admin/shared/_side_menu.html.haml +++ b/app/views/admin/shared/_side_menu.html.haml @@ -1,6 +1,13 @@ .side_menu#side_menu - - enterprise_side_menu_items(@enterprise).each do |item| - - next unless item[:show] - %a.menu_item{ href: item[:href] || "##{item[:name]}_panel", id: item[:name], data: { action: "tabs-and-panels#changeActivePanel tabs-and-panels#changeActiveTab", "tabs-and-panels-target": "tab" }, class: item[:selected] } - %i{ class: item[:icon_class] } - %span= t("#{item[:name] }") + - if @enterprise + - enterprise_side_menu_items(@enterprise).each do |item| + - next unless item[:show] + %a.menu_item{ href: item[:href] || "##{item[:name]}_panel", id: item[:name], data: { action: "tabs-and-panels#changeActivePanel tabs-and-panels#changeActiveTab", "tabs-and-panels-target": "tab" }, class: item[:selected] } + %i{ class: item[:icon_class] } + %span= t("#{item[:name] }") + - else + - enterprise_group_side_menu_items.each do |item| + %a.menu_item{ href: "##{item[:name]}_panel", class: item[:selected], id: item[:name], data: { action: "tabs-and-panels#changeActivePanel tabs-and-panels#changeActiveTab", "tabs-and-panels-target": "tab" } } + %i{ class: item[:icon_class] } + %span= t("#{item[:label] }") + From 79ba223e123173f24900609e471d5d01a024daf7 Mon Sep 17 00:00:00 2001 From: binarygit Date: Tue, 9 Aug 2022 14:25:29 +0545 Subject: [PATCH 4/4] Delete angular code for side_menu --- .../side_menu_controller.js.coffee | 15 ------ .../side_menu_controller.js.coffee | 49 ------------------- .../side_menu_controller_spec.js.coffee | 41 ---------------- 3 files changed, 105 deletions(-) delete mode 100644 app/assets/javascripts/admin/enterprise_groups/controllers/side_menu_controller.js.coffee delete mode 100644 app/assets/javascripts/admin/enterprises/controllers/side_menu_controller.js.coffee delete mode 100644 spec/javascripts/unit/admin/enterprises/controllers/side_menu_controller_spec.js.coffee diff --git a/app/assets/javascripts/admin/enterprise_groups/controllers/side_menu_controller.js.coffee b/app/assets/javascripts/admin/enterprise_groups/controllers/side_menu_controller.js.coffee deleted file mode 100644 index 1006ac7aa46..00000000000 --- a/app/assets/javascripts/admin/enterprise_groups/controllers/side_menu_controller.js.coffee +++ /dev/null @@ -1,15 +0,0 @@ -angular.module("admin.enterprise_groups") - .controller "sideMenuCtrl", ($scope, SideMenu) -> - $scope.menu = SideMenu - $scope.select = SideMenu.select - - $scope.menu.setItems [ - { name: 'primary_details', label: t('primary_details'), icon_class: "icon-user" } - { name: 'users', label: t('users'), icon_class: "icon-user" } - { name: 'about', label: t('about'), icon_class: "icon-pencil" } - { name: 'images', label: t('images'), icon_class: "icon-picture" } - { name: 'contact', label: t('admin_enterprise_groups_contact'), icon_class: "icon-phone" } - { name: 'web', label: t('admin_enterprise_groups_web'), icon_class: "icon-globe" } - ] - - $scope.select(0) diff --git a/app/assets/javascripts/admin/enterprises/controllers/side_menu_controller.js.coffee b/app/assets/javascripts/admin/enterprises/controllers/side_menu_controller.js.coffee deleted file mode 100644 index 6c9a7b9f8c7..00000000000 --- a/app/assets/javascripts/admin/enterprises/controllers/side_menu_controller.js.coffee +++ /dev/null @@ -1,49 +0,0 @@ -angular.module("admin.enterprises") - .controller "sideMenuCtrl", ($scope, $parse, enterprise, SideMenu, enterprisePermissions) -> - $scope.Enterprise = enterprise - $scope.menu = SideMenu - $scope.select = SideMenu.select - - $scope.menu.setItems [ - { name: 'primary_details', label: t('primary_details'), icon_class: "icon-home" } - { name: 'address', label: t('address'), icon_class: "icon-map-marker" } - { name: 'contact', label: t('contact'), icon_class: "icon-phone" } - { name: 'social', label: t('social'), icon_class: "icon-twitter" } - { name: 'about', label: t('about'), icon_class: "icon-pencil" } - { name: 'business_details', label: t('business_details'), icon_class: "icon-briefcase" } - { name: 'images', label: t('images'), icon_class: "icon-picture" } - { name: 'properties', label: t('properties'), icon_class: "icon-tags", show: "showProperties()" } - { name: 'shipping_methods', label: t('shipping_methods'), icon_class: "icon-truck", show: "showShippingMethods()" } - { name: 'payment_methods', label: t('payment_methods'), icon_class: "icon-money", show: "showPaymentMethods()" } - { name: 'enterprise_fees', label: t('enterprise_fees'), icon_class: "icon-tasks", show: "showEnterpriseFees()" } - { name: 'enterprise_permissions', label: t('enterprise_permissions'), icon_class: "icon-plug" } - { name: 'inventory_settings', label: t('inventory_settings'), icon_class: "icon-list-ol", show: "enterpriseIsShop()" } - { name: 'tag_rules', label: t('tag_rules'), icon_class: "icon-random", show: "enterpriseIsShop()" } - { name: 'shop_preferences', label: t('shop_preferences'), icon_class: "icon-shopping-cart", show: "enterpriseIsShop()" } - { name: 'users', label: t('users'), icon_class: "icon-user" } - ] - - SideMenu.init() - - $scope.showItem = (item) -> - if item.show? - $parse(item.show)($scope) - else - true - - $scope.showProperties = -> - !!$scope.Enterprise.is_primary_producer - - $scope.showShippingMethods = -> - enterprisePermissions.can_manage_shipping_methods && $scope.Enterprise.sells != "none" - - $scope.showPaymentMethods = -> - enterprisePermissions.can_manage_payment_methods && $scope.Enterprise.sells != "none" - - $scope.showEnterpriseFees = -> - enterprisePermissions.can_manage_enterprise_fees && ($scope.Enterprise.sells != "none" || $scope.Enterprise.is_primary_producer) - - $scope.enterpriseIsShop = -> - $scope.Enterprise.sells != "none" - - $scope.menu.redirect_function('enterprise_permissions', '/admin/enterprise_relationships') diff --git a/spec/javascripts/unit/admin/enterprises/controllers/side_menu_controller_spec.js.coffee b/spec/javascripts/unit/admin/enterprises/controllers/side_menu_controller_spec.js.coffee deleted file mode 100644 index c168047ccfe..00000000000 --- a/spec/javascripts/unit/admin/enterprises/controllers/side_menu_controller_spec.js.coffee +++ /dev/null @@ -1,41 +0,0 @@ -describe "menuCtrl", -> - ctrl = null - scope = null - enterprise = null - SideMenu = SideMenu - - beforeEach -> - module('admin.enterprises') - enterprise = - payment_method_ids: [ 1, 3 ] - shipping_method_ids: [ 2, 4 ] - # PaymentMethods = - # paymentMethods: [ { id: 1 }, { id: 2 }, { id: 3 }, { id: 4 } ] - # ShippingMethods = - # shippingMethods: [ { id: 1 }, { id: 2 }, { id: 3 }, { id: 4 } ] - - inject ($rootScope, $controller, _SideMenu_) -> - scope = $rootScope - SideMenu = _SideMenu_ - spyOn(SideMenu, "init").and.callThrough() - spyOn(SideMenu, "select").and.callThrough() - spyOn(SideMenu, "setItems").and.callThrough() - ctrl = $controller 'sideMenuCtrl', {$scope: scope, enterprise: enterprise, SideMenu: SideMenu, enterprisePermissions: {}} - - describe "initialisation", -> - it "stores enterprise", -> - expect(scope.Enterprise).toEqual enterprise - - it "sets the item list", -> - expect(SideMenu.setItems).toHaveBeenCalled - expect(scope.menu.items).toBe SideMenu.items - - it "sets the initally selected value", -> - expect(SideMenu.init).toHaveBeenCalled() - - - describe "selecting an item", -> - it "selects an item by performing setting the selected property on the item to true", -> - scope.select 4 - expect(SideMenu.select).toHaveBeenCalledWith 4 - expect(scope.menu.items[4].selected).toBe true