Updating Transplanting Report with new BannerComponent

[FutzMonitor]

Desired Design

Currently the Transplanting Report still makes use of the ErrorBannerComponent. However, the merging of #622 means that these instances need to be removed and the page adequately updated with new data variables to handle the newer BannerComponent.

It's also necessary to consider what new constants need to be added to the BannerMessageConstants.js specifically for the Transplanting Report.

Here are the necessary changes to complete this issue:

• First and foremost: have a conversation about what new features would be appreciated. For example: success banner when a banner is successfully updated. A message banner to inform the user that an edit was canceled. A danger banner to indicate a log didn't successfully save and to try again later. These are but a few examples.
• Should the banner be closed by pressing an 'X' or should it be timeout based? Whatever is decided should be consistent in all pages,

1. Remove the ErrorBannerComponent from the page.
2. Import the BannerComponent into the page (simply add it to the Vue instance in the page).
3. Add the necessary data variables to support
4. Update pre-existing functions to make the BannerComponent visible, give the correct object, and handle visibility changes.
5. Implement any new features that arise during conversation.

[braughtg]

In addition, an appropriate spec.js file containing e2e tests for all uses of the BannerComponent in the page should be included in the PR.