From 281b5535a5151fe8f750acc6c1292ff25c1b5549 Mon Sep 17 00:00:00 2001 From: Jane Sandberg Date: Thu, 15 Feb 2024 08:54:26 -0800 Subject: [PATCH] Use lux-heading and lux-text-style components from lux (#996) * These components now have the lux- prefix * They need to be added to each instance of the vue app Co-authored-by: Christina Chortaria --- .../components/travelEstimateForm.vue | 10 ++-- app/javascript/entrypoints/application.js | 27 +++++---- app/views/absence_requests/_balances.html.erb | 20 +++---- app/views/absence_requests/_form.html.erb | 2 +- .../absence_requests/_index_detail.html.erb | 6 +- .../absence_requests/_notes_card.html.erb | 4 +- .../absence_requests/_review_detail.html.erb | 6 +- .../absence_requests/_review_form.html.erb | 2 +- .../absence_requests/_title_card.html.erb | 10 ++-- app/views/absence_requests/comment.html.erb | 2 +- app/views/absence_requests/edit.html.erb | 2 +- app/views/absence_requests/new.html.erb | 2 +- app/views/absence_requests/review.html.erb | 2 +- app/views/absence_requests/show.html.erb | 2 +- app/views/delegates/_assume_detail.html.erb | 4 +- app/views/delegates/_index_detail.html.erb | 4 +- app/views/delegates/index.html.erb | 4 +- app/views/delegates/to_assume.html.erb | 4 +- app/views/devise/sessions/new.html.erb | 2 +- app/views/pages/help.html.erb | 58 +++++++++---------- app/views/requests/_report_list.html.erb | 2 +- app/views/requests/_request_list.html.erb | 2 +- .../requests/my_approval_requests.html.erb | 2 +- app/views/requests/my_requests.html.erb | 2 +- app/views/requests/reports.html.erb | 2 +- app/views/travel_requests/_form.html.erb | 8 +-- .../travel_requests/_index_detail.html.erb | 6 +- .../travel_requests/_notes_card.html.erb | 4 +- .../travel_requests/_others_card.html.erb | 4 +- .../travel_requests/_report_detail.html.erb | 6 +- .../travel_requests/_review_detail.html.erb | 6 +- .../travel_requests/_review_form.html.erb | 12 ++-- .../_team_absent_card.html.erb | 4 +- .../travel_requests/_title_card.html.erb | 10 ++-- app/views/travel_requests/comment.html.erb | 2 +- app/views/travel_requests/edit.html.erb | 2 +- app/views/travel_requests/new.html.erb | 2 +- app/views/travel_requests/review.html.erb | 2 +- app/views/travel_requests/show.html.erb | 12 ++-- app/views/welcome/index.html.erb | 4 +- yarn.lock | 22 +++---- 41 files changed, 142 insertions(+), 147 deletions(-) diff --git a/app/javascript/components/travelEstimateForm.vue b/app/javascript/components/travelEstimateForm.vue index 8293fb98..24eb0274 100644 --- a/app/javascript/components/travelEstimateForm.vue +++ b/app/javascript/components/travelEstimateForm.vue @@ -10,7 +10,7 @@ columns="lg-1 sm-12" class="expense-delete" > - Delete + Delete - Occurrences + Occurrences - Cost per Occurrence + Cost per Occurrence - Note + Note - Total + Total diff --git a/app/javascript/entrypoints/application.js b/app/javascript/entrypoints/application.js index 53cd90c0..910b9449 100644 --- a/app/javascript/entrypoints/application.js +++ b/app/javascript/entrypoints/application.js @@ -26,22 +26,25 @@ import travelRequestButton from "../components/travelRequestButton.vue"; import travelRequestDatePickers from "../components/travelRequestDatePickers.vue"; import '../../assets/stylesheets/application.scss'; +// Create a factory function that will create vue +// apps, which we can then mount to any element with +// the class .lux +const app = createApp({}); +const createMyApp = () => createApp(app) - -// create the LUX app and mount it to wrappers with class="lux" document.addEventListener("DOMContentLoaded", () => { const elements = document.getElementsByClassName("lux"); for (let i = 0; i < elements.length; i++) { - const app = createApp({}); - app.use(lux); - app.component('event-date-modal', eventDateModal) - .component('event-title-input-wrapper', eventTitleInputWrapper) - .component('hours-calculator', hoursCalculator) - .component('travel-estimate-form', travelEstimateForm) - .component('travel-request-button', travelRequestButton) - .component('travel-request-date-pickers', travelRequestDatePickers) - console.log(app); - app.mount(elements[i]); + // Call our factory function, then add all the lux components + // and approvals components to it + createMyApp().use(lux) + .component('event-date-modal', eventDateModal) + .component('event-title-input-wrapper', eventTitleInputWrapper) + .component('hours-calculator', hoursCalculator) + .component('travel-estimate-form', travelEstimateForm) + .component('travel-request-button', travelRequestButton) + .component('travel-request-date-pickers', travelRequestDatePickers) + .mount(elements[i]); } }); diff --git a/app/views/absence_requests/_balances.html.erb b/app/views/absence_requests/_balances.html.erb index 0e10c5f5..242b0095 100644 --- a/app/views/absence_requests/_balances.html.erb +++ b/app/views/absence_requests/_balances.html.erb @@ -1,21 +1,21 @@ - <%= balance_title %> - + <%= balance_title %> + Vacation - - <%= vacation_balance.round(2) %> Hours - + + <%= vacation_balance.round(2) %> Hours + Personal - - <%= personal_balance.round(2) %> Hours - + + <%= personal_balance.round(2) %> Hours + Sick - - <%= sick_balance.round(2) %> Hours + + <%= sick_balance.round(2) %> Hours diff --git a/app/views/absence_requests/_form.html.erb b/app/views/absence_requests/_form.html.erb index fda7b3e1..e49bdfc5 100644 --- a/app/views/absence_requests/_form.html.erb +++ b/app/views/absence_requests/_form.html.erb @@ -44,7 +44,7 @@ - This request will be submitted to: <%= request_change_set.supervisor %> + This request will be submitted to: <%= request_change_set.supervisor %> Submit Request diff --git a/app/views/absence_requests/_index_detail.html.erb b/app/views/absence_requests/_index_detail.html.erb index 19dd0e7b..cd7ed7e0 100644 --- a/app/views/absence_requests/_index_detail.html.erb +++ b/app/views/absence_requests/_index_detail.html.erb @@ -7,8 +7,8 @@ ><<%= absence_request.absence_type_icon %> /> - <%= absence_request.event_title_brief %> - <%= absence_request.formatted_full_start_date %> to <%= absence_request.formatted_full_end_date %> + <%= absence_request.event_title_brief %> + <%= absence_request.formatted_full_start_date %> to <%= absence_request.formatted_full_end_date %> - <%= absence_request.latest_status_date %> + <%= absence_request.latest_status_date %> diff --git a/app/views/absence_requests/_notes_card.html.erb b/app/views/absence_requests/_notes_card.html.erb index 55f93f6d..3b2779a6 100644 --- a/app/views/absence_requests/_notes_card.html.erb +++ b/app/views/absence_requests/_notes_card.html.erb @@ -1,8 +1,8 @@ - + History - +
    <%= render partial: "shared/request_note", collection: request.notes_and_changes, as: :note %> diff --git a/app/views/absence_requests/_review_detail.html.erb b/app/views/absence_requests/_review_detail.html.erb index 1a0a1146..f84dc631 100644 --- a/app/views/absence_requests/_review_detail.html.erb +++ b/app/views/absence_requests/_review_detail.html.erb @@ -7,8 +7,8 @@ ><<%= absence_request.absence_type_icon %> /> - <%= absence_request.creator %> - <%= absence_request.event_title_brief %> - <%= absence_request.formatted_full_start_date %> to <%= absence_request.formatted_full_end_date %> + <%= absence_request.creator %> - <%= absence_request.event_title_brief %> + <%= absence_request.formatted_full_start_date %> to <%= absence_request.formatted_full_end_date %> - <%= absence_request.latest_status_date %> + <%= absence_request.latest_status_date %> diff --git a/app/views/absence_requests/_review_form.html.erb b/app/views/absence_requests/_review_form.html.erb index ba6ec1a4..1b84dce6 100644 --- a/app/views/absence_requests/_review_form.html.erb +++ b/app/views/absence_requests/_review_form.html.erb @@ -17,7 +17,7 @@ - Team members absent during this time period + Team members absent during this time period
      <%= render partial: "shared/absent_staff", collection: request_change_set.absent_staff, as: :staff %>
    diff --git a/app/views/absence_requests/_title_card.html.erb b/app/views/absence_requests/_title_card.html.erb index efd76291..5592e971 100644 --- a/app/views/absence_requests/_title_card.html.erb +++ b/app/views/absence_requests/_title_card.html.erb @@ -10,18 +10,18 @@ ]"> - + <%= request.full_name %> <%= request.event_title %> - +
    - Total Hours<%= - request.hours_requested %>Total Hours<%= + request.hours_requested %>
    diff --git a/app/views/absence_requests/comment.html.erb b/app/views/absence_requests/comment.html.erb index 2163c118..f666d56e 100644 --- a/app/views/absence_requests/comment.html.erb +++ b/app/views/absence_requests/comment.html.erb @@ -1,7 +1,7 @@ - Comment on Absence Request + Comment on Absence Request diff --git a/app/views/absence_requests/edit.html.erb b/app/views/absence_requests/edit.html.erb index 3205b5fd..dcee80ed 100644 --- a/app/views/absence_requests/edit.html.erb +++ b/app/views/absence_requests/edit.html.erb @@ -1,7 +1,7 @@ - Edit Absence Request + Edit Absence Request diff --git a/app/views/absence_requests/new.html.erb b/app/views/absence_requests/new.html.erb index 967e316d..7f3bfc08 100644 --- a/app/views/absence_requests/new.html.erb +++ b/app/views/absence_requests/new.html.erb @@ -1,7 +1,7 @@ - New Absence Request + New Absence Request diff --git a/app/views/absence_requests/review.html.erb b/app/views/absence_requests/review.html.erb index c44fcd77..fc298622 100644 --- a/app/views/absence_requests/review.html.erb +++ b/app/views/absence_requests/review.html.erb @@ -1,7 +1,7 @@ - Review Absence Request + Review Absence Request diff --git a/app/views/absence_requests/show.html.erb b/app/views/absence_requests/show.html.erb index c84158c9..c1657b35 100644 --- a/app/views/absence_requests/show.html.erb +++ b/app/views/absence_requests/show.html.erb @@ -15,7 +15,7 @@ - Team members absent during this time period + Team members absent during this time period
      <%= render partial: "shared/absent_staff", collection: @request.absent_staff, as: :staff %>
    diff --git a/app/views/delegates/_assume_detail.html.erb b/app/views/delegates/_assume_detail.html.erb index 76e497cc..b669fbfa 100644 --- a/app/views/delegates/_assume_detail.html.erb +++ b/app/views/delegates/_assume_detail.html.erb @@ -7,7 +7,7 @@ > - <%= delegator.delegator %> - <%= delegator.delegator.uid %> + <%= delegator.delegator %> + <%= delegator.delegator.uid %> diff --git a/app/views/delegates/_index_detail.html.erb b/app/views/delegates/_index_detail.html.erb index a808c1a5..a31ae06c 100644 --- a/app/views/delegates/_index_detail.html.erb +++ b/app/views/delegates/_index_detail.html.erb @@ -7,7 +7,7 @@ <% end %> - <%= delegate.delegate %> - <%= delegate.delegate.uid %> + <%= delegate.delegate %> + <%= delegate.delegate.uid %> diff --git a/app/views/delegates/index.html.erb b/app/views/delegates/index.html.erb index 411de4c0..88c63c8b 100644 --- a/app/views/delegates/index.html.erb +++ b/app/views/delegates/index.html.erb @@ -1,7 +1,7 @@ - My Delegates + My Delegates @@ -25,7 +25,7 @@ <% if @delegates.count == 0 %> - You don't have any delegates at the moment. + You don't have any delegates at the moment. <% end %> <% @delegates.each do |delegate| %> <%= render 'index_detail', delegate: delegate %> diff --git a/app/views/delegates/to_assume.html.erb b/app/views/delegates/to_assume.html.erb index 38d3ee19..37d99318 100644 --- a/app/views/delegates/to_assume.html.erb +++ b/app/views/delegates/to_assume.html.erb @@ -1,7 +1,7 @@ - Act as Delegate for... + Act as Delegate for... @@ -12,7 +12,7 @@ <% if @delegators.count == 0 %> - You don't have any people you can become at the moment. + You don't have any people you can become at the moment. <% end %> <% @delegators.each do |delegator| %> <%= render 'assume_detail', delegator: delegator %> diff --git a/app/views/devise/sessions/new.html.erb b/app/views/devise/sessions/new.html.erb index baf84351..114772a8 100644 --- a/app/views/devise/sessions/new.html.erb +++ b/app/views/devise/sessions/new.html.erb @@ -1,7 +1,7 @@ - You must login to view the requested resource. + You must login to view the requested resource. LOGIN with NetID diff --git a/app/views/pages/help.html.erb b/app/views/pages/help.html.erb index af361a25..b34116fb 100644 --- a/app/views/pages/help.html.erb +++ b/app/views/pages/help.html.erb @@ -3,7 +3,7 @@ - Helpful Guides + Helpful Guides
    • <%= link_to "Create a Travel Request", :anchor => "create-travel" %>
    • <%= link_to "Review a Travel Request", :anchor => "approve-travel" %>
    • @@ -17,20 +17,20 @@ - Overview - This Absence and Travel Request application allows Library staff to seek approval for travel and absence. The initial rollout of this system supports the travel workflow. Please review the documentation below if you need assistance. - Travel requests will need to be approved by your direct supervisor and any supervisors up to and including your department head. If you need clarification on travel policy, please read <%= link_to "the Library's official travel policy", "https://library.princeton.edu/staff/ofa/finance-and-budget/travel" %> or contact your direct supervisor. - Previous trainings are available to view via Google Drive. Watch the recorded session for requestors and approvers. + Overview + This Absence and Travel Request application allows Library staff to seek approval for travel and absence. The initial rollout of this system supports the travel workflow. Please review the documentation below if you need assistance. + Travel requests will need to be approved by your direct supervisor and any supervisors up to and including your department head. If you need clarification on travel policy, please read <%= link_to "the Library's official travel policy", "https://library.princeton.edu/staff/ofa/finance-and-budget/travel" %> or contact your direct supervisor. + Previous trainings are available to view via Google Drive. Watch the recorded session for requestors and approvers. - Create a Travel Request - To create a new travel request, log into the system via CAS using your NetID and password. + Create a Travel Request + To create a new travel request, log into the system via CAS using your NetID and password. <%= image_tag("login.png")%> - Click on the "New Travel Request" button on the top right portion of the "My Requests" page or "New Travel Request" under the Requests menu from any page. + Click on the "New Travel Request" button on the top right portion of the "My Requests" page or "New Travel Request" under the Requests menu from any page. <%= image_tag("my_requests.png")%> - Include the details of your travel in the following fields: + Include the details of your travel in the following fields: <%= image_tag("travel_info.png")%>
      • Event Name: The name of the event you are attending, e.g., American Library Association - Annual Conference (ALA).
      • @@ -41,7 +41,7 @@
      • Purpose: Specify the reason this trip is necessary for your job.
      • Notes to Approvers: Additional information that would help the approver understand the details of the trip (request for time off, desire to stay additional nights, etc.). Please contact your direct supervisor for more information on what they are expecting.
      - Include all anticipated travel expenses related to the event you would like to attend: + Include all anticipated travel expenses related to the event you would like to attend: <%= image_tag("expenses.png")%>
      • Expense Type: The category for the anticipated line item expense.
      • @@ -50,43 +50,43 @@
      • Note: Additional information that would help the approver understand the details of the line item expense.
      • Total: This amount is automatically calculated based on the numbers provided for Occurrences and Cost per Occurrences.
      - You can add additional line item expenses by clicking on the "Add Expense" button located below the last line item expense. - Once you click on "Submit Request", a notification will be sent to your supervisor to approve the request. + You can add additional line item expenses by clicking on the "Add Expense" button located below the last line item expense. + Once you click on "Submit Request", a notification will be sent to your supervisor to approve the request. <%= image_tag("requestview.png")%> - You will receive notifications when the status of your request changes. - You can modify your request until it has been reviewed + You will receive notifications when the status of your request changes. + You can modify your request until it has been reviewed
      - Review a Travel Request - When there is a request to review, you will receive a notification via email with a link to that request. - To approve a travel request pending your review, log into the system via CAS using your NetID and password. - You can also click on "Requests to Review" on the top right navigation to view all travel requests awaiting your approval. + Review a Travel Request + When there is a request to review, you will receive a notification via email with a link to that request. + To approve a travel request pending your review, log into the system via CAS using your NetID and password. + You can also click on "Requests to Review" on the top right navigation to view all travel requests awaiting your approval. <%= image_tag("review_list.png")%> - Review the details of travel request, add notes, approve the request. + Review the details of travel request, add notes, approve the request. <%= image_tag("approval.png")%> - In order to decline a travel request, you must include a reason in the note field. - At this point you may also "Request Changes" by adding notes and clicking on the "Request Changes" button. For example, anticipated expenses that will not be covered by the University should be requested to be deleted. - You will receive notifications when the status of the request changes. - The department head will have the ability to choose the travel category (business or professional development). + In order to decline a travel request, you must include a reason in the note field. + At this point you may also "Request Changes" by adding notes and clicking on the "Request Changes" button. For example, anticipated expenses that will not be covered by the University should be requested to be deleted. + You will receive notifications when the status of the request changes. + The department head will have the ability to choose the travel category (business or professional development). - Cancel a Travel Request - Only the request creator can cancel their request. To cancel your request, find your request in your "My Requests" list, view your request details and click on the "Cancel" button at the bottom of the travel request details page. + Cancel a Travel Request + Only the request creator can cancel their request. To cancel your request, find your request in your "My Requests" list, view your request details and click on the "Cancel" button at the bottom of the travel request details page. <%= image_tag("cancel_request.png")%> - Report a Problem + Report a Problem Please use the latest version of Chrome, Edge, or Firefox to use this application. Internet Explorer is not supported. - If you are looking for technical support or would like to provide feedback on this application, please contact <%= mail_to "lsupport@princeton.edu", "lsupport@princeton.edu" %>. - Note: When reporting issues, please include screenshots, if possible. + If you are looking for technical support or would like to provide feedback on this application, please contact <%= mail_to "lsupport@princeton.edu", "lsupport@princeton.edu" %>. + Note: When reporting issues, please include screenshots, if possible.
      - \ No newline at end of file + diff --git a/app/views/requests/_report_list.html.erb b/app/views/requests/_report_list.html.erb index 5c34ffb7..02ee3158 100644 --- a/app/views/requests/_report_list.html.erb +++ b/app/views/requests/_report_list.html.erb @@ -45,7 +45,7 @@ <% if @requests.count == 0 %> - No results found for your search + No results found for your search <% end %>
      <% if @requests.count == 0 %> - No results found for your search + No results found for your search <% end %> <% @requests.each do |request| %> <%= if request.request_type == 'TravelRequest' diff --git a/app/views/requests/my_approval_requests.html.erb b/app/views/requests/my_approval_requests.html.erb index ba4ce635..c270adfe 100644 --- a/app/views/requests/my_approval_requests.html.erb +++ b/app/views/requests/my_approval_requests.html.erb @@ -1,7 +1,7 @@ - Requests Awaiting My Approval + Requests Awaiting My Approval diff --git a/app/views/requests/my_requests.html.erb b/app/views/requests/my_requests.html.erb index e873c271..344fd398 100644 --- a/app/views/requests/my_requests.html.erb +++ b/app/views/requests/my_requests.html.erb @@ -1,7 +1,7 @@ - My Requests + My Requests <% if Rails.configuration.show_absence_button %> diff --git a/app/views/requests/reports.html.erb b/app/views/requests/reports.html.erb index 4a1ebbc3..8003c12a 100644 --- a/app/views/requests/reports.html.erb +++ b/app/views/requests/reports.html.erb @@ -1,7 +1,7 @@ - Reports + Reports diff --git a/app/views/travel_requests/_form.html.erb b/app/views/travel_requests/_form.html.erb index 334aaeb8..a3d63d2b 100644 --- a/app/views/travel_requests/_form.html.erb +++ b/app/views/travel_requests/_form.html.erb @@ -58,9 +58,9 @@ <% if request_change_set.existing_notes.any? %> - + Notes - +
        <%= render partial: "shared/request_note", collection: request_change_set.existing_notes, as: :note %> @@ -71,7 +71,7 @@ label="Notes to Approvers (optional)" :maxlength="9999" width="expand" type="textarea"> - Anticipated Expenses + Anticipated Expenses