[X-Section] Add the 2D functionality of the X-Section tool to the X-Section page

[acatchpole]

Describe the task [this task is dependant on bcgov/gwells#2257, bcgov/nr-gwells#173, and bcgov/nr-gwells#211 being completed] Add the X-Section tool components to the x-section tool page. Only implement the 2D functionality. Make the components functional by adapting it to use the GWELLS API and mapbox. Adapt the components to match GWELLS design/styling.

Purpose The final step in implementing the X-Section tool from WALLY into GWELLS.

Acceptance Criteria

• [ ] A useable X-Section tool that displays a 2D result plot and a summary of searched wells.
• [ ] features that function as in WALLY and as described in the image below

Additional context

• Both WALLY and GWELLS use Vue frontends (the same version!). Much of the WALLY components and supporting code will be copy and pasteable, or require only minor adjustments to match GWELLS design/styling.
• While the tool in WALLY includes both a 2D and a 3D results view, only the 2D should be implemented here. As the 3D view is much more complicated and the 2D version is all that is needed to be able to utilize this tool, this will be our quickest path to functionality.
• The web framework for WALLY is FAST API, the save analysis most likely communicates with the DB. GWELLS is using SQL-Alchemy.

X-Section tool in WALLY

[Keegnan]

Will need to speak with SO and user to fully understand the full functionality of this feature. (refer to some of the unknown buttons mentioned in the screenshots.)

Possibly to set up a session to have a user using the tool to fully understand it's use (potential user story mapping).