GithubHelp home page GithubHelp logo

ordercloud-api / ngx-shopper Goto Github PK

View Code? Open in Web Editor NEW
9.0 9.0 22.0 7.71 MB

Open-source B2B e-commerce. Built with the OrderCloud.io API and maintained by the OrderCloud team

License: MIT License

TypeScript 81.08% JavaScript 0.67% HTML 16.39% SCSS 1.86%

ngx-shopper's People

Contributors

amrarick26 avatar bhickey77 avatar crhistianramirez avatar esitarz avatar jilse avatar labedlam avatar oliverheywood451 avatar robertsoniv avatar virgeljohnson avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

ngx-shopper's Issues

Register

As a buyer user I'd like a place to create an account if I don't already have one

Acceptance Criteria:

  • I should only be able to self-register if I am browsing in an anonymous-enabled application
  • I will be able to enter the following details
    • FirstName
    • LastName
    • Email (must be in correct format)
    • Phone
    • Password
  • I should be required to confirm my password, both password and confirm password must match and be at least 8 characters long and at least one letter and one number
  • Once submitted I will be able to login as my recently created user
  • I should be able to navigate to Forgot Password page
  • I should be able to navigate to Login page

Mini Shopping Cart

As a buyer user I would like to hover over the shoping cart icon in the header bar to see a mini shopping cart with a compact view of my line items along with prices and quantities

Acceptance Criteria:

  • I should be able to hover over mini cart to view the contents of the cart
  • I should be able to see name, price and quantity for each line item
  • I should be able to click on a line item to go to the detail page
  • I should be able to see my order Subtotal
  • I should see a message if my cart is empty
  • I should be able to click on the minicart to navigate to the cart page

Note: consider copying the Category menu from mgr.

Buyer Impersonation

As an admin user I'd like to be able to assume the identity of any buyer user

Acceptance Criteria:

  • I should see only exactly what the buyer user should see and nothing more
  • Limits such as on inventory should apply to me as they do the original user
  • I should be able to update the user's profile
  • I should be able to place an order on their behalf

Technical notes: the admin app will generate the buyer's token and route the user to the buyer app which should have a route set up accept a buyer token, set it in the cookies and continue as that user

Address Book

As a buyer user I would like a section to view and manage saved addresses that I can use during checkout

Definitions:
Personal Addresses: Addresses that I have personally created via the MeAddress endpoints

Acceptance Criteria for personal addresses

  • I should be able to view addresses
  • I should be able to search for addresses (if more than one page)
  • I should be able to create addresses
  • I should be able to edit addresses

Acceptance Criteria for buyer-level addresses

  • I should be able to view addresses if they are assigned to me
  • I should be able to search addresses if they are assigned to me (if more than one page)
  • I should not be able to edit addresses unless I have AddressAdmin role
  • I should not be able to delete addresses unless I have AddressAdmin role

Checkout - Shipping Address

As a buyer user I need a place to enter the address where my order will be shipped

Acceptance Criteria for profiled user

  • I should be able to select a saved address
  • I should be able to enter my own address

Acceptance Criteria for anonymous user

  • I should be able to set a one-time address on the order

Product Options

As a buyer user

  • When I try to add a product to the cart ( from anywhere in the app ) that has a spec with multiple values a modal pops up.
  • The modal has a dropdown for each spec and an option in the dropdown for each option.
  • If the spec has a default option, that option is selected in the dropdown to start
  • A button at the bottom of the modal called 'Add to Card' is disabled until all dropdowns have a selection.
  • When the button is clicked, the modal is dismissed.

Manage Credit Cards (Buyer)

As a buyer user I would like to have a section to view and manage credit cards that I can use during checkout

Located in: Profile > Payment Methods

Definitions:
Personal CreditCards: CreditCards that I have personally created via the MeCreditCard endpoints

Acceptance Criteria for personal creditcards

  • I should be able to view creditcards
  • I should be able to create creditcards
  • I should be able to edit creditcards

Acceptance Criteria for buyer-level creditcards

  • I should be able to view creditcards if they are assigned to me
  • I should not be able to edit creditcards unless I have CreditCardAdmin role
  • I should not be able to delete creditcards unless I have CreditCardAdmin role

Product Detail

As a buyer user I'd like to get more detail about a specific product before adding it to my cart

Located: Product List > Product Detail

Acceptance Criteria:

  • I should be able to add the currently viewed product to my cart(#15)
  • I should be able to see all of the images associated with this product(#45)
  • I should be able to favorite a product(#14)
  • I should only be able to order in certain quantities if RestrictedQuantity is set on the price schedule
  • I should be able to view product Description

Product - Default Price Schedule

As an admin user in manage products I should be able to create a default price for a product including the following form elements

  • Checkboxes for ApplyTax, ApplyShipping
  • Number input for MinQuantity (default of 1)
  • Number input for MaxQuantity (more than min)
  • At least one price break with quantity and price

Product List

As a buyer user I would like to see a list of products that are available for order

Acceptance Criteria:

  • I should be able to see the following information on each product:
    • ID
    • Name
    • Main image (if set on product.xp.image.URL)
  • I should be able to favorite a product
  • I should be able to add a product to my cart
  • I should be able to sort my product list by:
    • Name (Ascending)
    • Name (Descending)
    • ID (Ascending)
    • ID (Descending)

Manage View only products

As a seller user in product management I should

  • Be able to set a product as view-only or not view-only.
  • View-only products cannot be added to the cart from anywhere. This includes, product list, product details, ect.

Technical note - Right now the buyer app identifies products as view-only if there is no price schedule.

Manage Spending Accounts (Buyer)

As a buyer user I would like to have a section to view and manage spending accounts that I can use during checkout

Located: Profile > Payment Methods

Acceptance Criteria:

  • I should be able to view spending accounts if they are assigned to me
  • I should be able to see the remaining balance on a spending account

Order Detail

As a buyer user I'd like to access a detail summary of an order I've placed

Acceptance Criteria:

  • I should see a breadcrumb back to the order list page
  • I should see order number from anywhere in order detail
  • I should see date submitted from anywhere in order detail
  • I should see the following information after selecting the Details tab:
    • Shipping Address
    • Billing Address
    • Subtotal
    • Shipping (cost)
    • Tax
    • Total
    • payment - type, amount and any details about it
    • list of line items with quantity, price and unit price, should link to detail page for each product
  • I should see the following information under the Shipments tab
    • a shipment tab for each shipment
    • I should see a message if there are no shipments for an order
    • i should be able to click a tab to see the line items that shipped with that shipment and the quantity shipped
    • if a shipment has a Shipper set to UPS, USPS or FEDEX and a TrackingNumber, I should be able to click on the tracking link to easily access access tracking information about my order

View-Only products

As a buyer user I should be able to browse products that can't be ordered. A product is considered view-only if it does not have a price schedule

Acceptance Criteria:

  • I should not be able to add this product to my cart anywhere in the app: product list, product detail
  • On the product list page instead of Add To Cart I should see "View Product", which takes me to the product detail page
  • On the product detail page I should not see an add to cart button, instead I should see an info-alert stating I am not able to order this product

Promotions

As a Buyer user I should be able to apply Promotions to my order during checkout. These should have the following optional functionality based on the promotion data model.

  • start and end times outside of which promotion is not available.
  • an expression that determines eligibility (e.g. order.Subtotal > 10)
  • an expression that determines value (e.g. order.Total * .10)
  • The ability to either work with other promotions or not.
  • A redemption limit

Repeat Order

As a buyer user I should be able to reorder a past order from order history. When I select this option

  • I am navigated to the cart
  • LineItems that are no longer valid (e.g. because of low inventory) will have notes are not included.
  • Valid line items have been added to the cart.

Manager User Groups

as a seller user I should be able to:

  • create user groups with ID (optional), Name, Description (optional)
  • see a list of user groups
  • Delete user groups
  • Search for user groups buy ID, Name, Description
  • Manage users in the group (assign, remove)

Pay with SpendingAccount

As a buyer user I should be able to select a spending account during checkout to pay for my order

Acceptance Criteria:

  • I should only be able to see spending accounts assigned to me
  • I should not be able to see spending accounts with a StartDate earlier than today's date
  • I should not be able to see spending accounts with a EndDate later than today's date
  • I should be able to select any spending account that is assigned to me and falls with in the StartDate/ EndDate range
  • I should be prompted with an error if I try to proceed with a total greater than the balance and the assignment has AllowExceed set to false
  • I should not be able to proceed with SpendingAccount as a payment if AllowAsPaymentMethod is set to false

Manage Promotions

As a seller user I should be able to:

  • create promotions
  • edit promotions
  • delete promotions
  • assign promotions to user groups
  • assign promotions to buyer orgs

Order History

As a buyer user I would like a section of the app to browse orders I have placed and use a variety of filters to quickly find an order.

Acceptance Criteria:

  • filters on the order history page are cumulative meaning if another filter already exists and I add a new filter, both filters must be satisfied
  • I should be able to search for order by orderID (partial & full)
  • I should be able to clear search by removing text in search box
  • I should be able to select a From Date using a datepicker and get a list of orders that have been placed after that date
  • I should be able to clear FromDate filter by clearing text in FromDate
  • I should be able to select a To Date using a datepicker and get a list of orders that have been placed before that date
  • I should be able to clear ToDate filter by clearing text in ToDate
  • I should be able to select a status from a dropdown and filter the list of orders by that status
  • I should be able to clear status filter by selecting All from dropdown
  • I should be able to see the following details about an order:
    • ID
    • Status
    • DateSubmitted
    • Total

Intelligent QuantityInput component

As a buyer user I would like the quantity input i interact with to adapt to the product I am ordering.

Located:

  • Product List
  • Product List > Product Details
  • Cart

Acceptance Criteria:

  • I should not be able to add product to cart if:
    • Quantity selected is greater than MaxQuantity or Inventory.QuantityAvailable
    • Quantity selected is less than MinQuantity
  • If priceschedule.RestrictedQuantity is set to true I should only be able to order in quantities defined on the price breaks

Recently Added Products

As a buyer user

  • On the product list page I should see a filtering option for recently added products.
  • When I click this, only products classified as recently added are displayed.
  • This filter should layer with search so that I can search recently added products.

Technical Details - Add an xp value on products called something like "VisibleDate". It can be set in the Admin and the value default is right now. Products are only visible in the buyer app starting at midnight on the visible date. There should be a configuration setting in the app that defines how recent something should be to be "recently added" - 30 days is a good default. This filter looks at the xp field.

Manage Announcements

As a seller user

  • I should have a section where I can add edit Announcements with an open text field.
  • That text should be displayed on the buyer home screen

Pay with PurchaseOrder

As a buyer user I should be able to:

  • Select PurchaseOrder as payment
  • optionally add a PO number

Acceptance Criteria:

  • In the payment tab of the checkout process I should have an open input to enter a PO number.
  • PO number is open-text and there should be no restrictions on what i enter
  • PONumber should be saved on payment.xp.PONumber
  • adding or removing items should not clear my PONumber
  • Changing payment methods should clear my PONumber

Additional Images

As a buyer user I would like to be able to see additional product images for a single product so that I can make a better decision when purchasing an item.

Location in app: Product List > Product-Detail

Acceptance Criteria:

  • I should see an additional-images carousel below the main product image
  • selecting a smaller image should allow me to view an enlarged version of it in the main product image section
  • I should be able to use the forward and backward arrows to loop through product images
  • I should be able to click on one of the smaller images in the carousel to view

Cart Icon

As a buyer user I'd like a quick reference of how many unique products are in my cart.

Location: top right of page, visible when logged in or all time if anon user

Acceptance Criteria

  • badge count should increment when a unique product (defined by productID) is added to my cart
  • badge count should decrement when a unique product is removed from my cart
  • badge count should not increment if an existing product's quantity increases
  • badge count should not decrement if an existing product's quantity decreases to a non-zero value

User Profile Component

Acceptance Criteria:

  • as a buyer user I should be able to edit personal details about my myself:
    • FirstName
    • LastName
    • Email
    • Phone Number

Checkout - Confirm

As a buyer user I'd like one final step to make sure everything on my order looks correct before submitting my order.

Acceptance Criteria:

  • I should be able to see the following items in the confirm panel:
    • Shipping Address
    • Billing Address
    • List of line items
    • payment method, amount and relevant details
  • I should not see Subtotal, Tax, Shipping, or Total (that should already be visible in the order summary panel on the right)
  • I should be able to submit the order at the bottom of this page
  • upon successful submit i should be redirected to order-confirmation page

Forgot Password

As a buyer user I need a way of resetting my password in case I forget it

Setup: A message sender of type ForgotPassword has to be created and assigned to the buyer organization in the dashboard of the devcenter

Acceptance Criteria:

  • I should be able to enter my email so that ordercloud can send me an email with a link to reset my password
  • If my email exists in the org I should see a success toaster appear confirming an email was sent
  • If my email does not exist I should see a toaster stating a user was not found
  • The link should take me to the rest password page where i can enter my new password

Order Confirmation

As a buyer user I'd like to view my order and its details immediately after submitting the order. This gives me one last chance to make sure everything is correct.

Acceptance Criteria:
I should be able to see the following information about my order:

  • Delivery Address
  • Billling Address
  • OrderID
  • DateSubmitted
  • Subtotal
  • Tax
  • Shipping
  • Total
  • List of payments - payment type, amount and details
  • List of line items with:
    • Name
    • ID
    • Product Image
    • Quantity
    • Price
    • Line Total

Remember Me

As a buyer user I would like to opt in to a token refresh feature to avoid having to sign in to an application every time my access token expires.

Setup:

  • set a refresh token for this application (refresh token > 0)

Acceptance Criteria:

  • I should see a Remember Me checkbox on the login page
  • If i clicked the checkbox and signed in, then the next time my access token expires the application will automatically sign me in by retrieving a new access token with my refresh token

Tips for testing:

  • after logging in while having box checked you should be able to see {appname}_refresh.token in the cookies as well as {appname}_rememberMe
  • you can delete {appname}.token (access token) from cookies to simulate an expired token. Then refresh the page. If it fails you'll go to login, if it succeeds you will remain logged in without having to sign in again.

Favorite Orders <3

As a buyer user I'd like to be able to save orders that I place frequently in order to be able to quickly reorder

Acceptance Criteria:

  • I should be able to click this heart icon to mark an order as favorite
  • I should be able to filter orders in order history to view my favorite orders
  • i should be able to mark an order as favorite from the order history page
  • i should be able to mark an order as favorite from the order detail page

Featured Products

Featured products allows an admin to define a set of products to highlight on the home page

Prerequisites:
buyer.xp.FeaturedProducts should be a non-empty array of product ids

As a buyer user:

  • I should be able to see products that fall are on the array of IDs and are fall within general visibility rules for my user to see
  • I should be able to click on a feature product and be navigated to the product detail page
  • I should not see an add-to-cart button on these types of products

Order comments

As a buyer user checking out in the confirm section on an app with Anonymous Shopping Disabled

I should see a free-text box called comments.
Text entered here will be save on order.comments
This text will be displayed in the order history section.

  • Note, no order comments for anonymous apps.

Order Approvals

As a buyer user that is an approving user, I should be able to:

  • see a section in profile with orders I can approve
  • approve orders with comments
  • reject orders with comments
  • After approval or rejection, the order should leave this list and the user who submitted the order should see the status change.

As a buyer user that who's order is being reviewed, I should be able to:

  • view pending approvals (in order history)
  • resubmit an order if it was rejected

Notes for testing - We've set up a rule where orders over $1000 require approval. The approving user group has an ID of ApprovingGroupB. The only user in the group has Username of Approver with password fails345

Product Search

As a buyer user I should be able to:

  • search for and filter products by:
    • ID (partial & full)
    • Description (partial & full)
    • Name (partial & full)
  • be able to access the product search bar:
    • at all times if anonymous shopper
    • from anywhere except the login/register pages if logged in
  • If should see an appropriate message if no products are found
  • I should be able to clear my search and begin a new search
  • adding text in my search box should yield results that reflect new search term

Manage Users

As a seller user I should be able to

  • create users with ID (optional), Username, First Name, Last Name, Phone, Email, active toggle.
  • list users
  • search for users ( any of the fields above )
  • update users
  • delete users

Manage Basic Products

As a seller user I should be able to:

  • see a list of products
  • search for products by Id, Name, Description
  • create a product (Id, Name, Description, Active, Featured)
  • delete products

Category Tree Navigation

As a buyer user I should:

  • see a category tree to the left of the product list
  • a caret should appear to the left of any category that has subcategories
  • I should be able to click a right-facing caret to expand tree and drill into subcategories
  • I should be able to click on a downward facing caret to collapse sub-categories
  • I should be able to click on a category to filter the list of products by products that are in that category or in any subcategory of the selected category

Announcements

As a buyer user I'd like a space on the homepage to see any announcements the seller may have for me

Acceptance Criteria:

  1. I should be able to see a section above image carousel to view announcements.

Notes: MVP for this will be a simple static section that is editable from the admin. Down the road we can consider making this a rotating carousel of announcements for the user to scroll through.

Checkout - Billing Address

As a buyer user I need a place to enter the billing address on my order

Acceptance Criteria for profiled user

  • I should be able to select a saved address
  • I should be able to enter my own address

Acceptance Criteria for anonymous user

  • I should be able to set a one-time address on the order

Login

As a buyer user I need a place to enter my username and password to login to the application

Acceptance Criteria:

  • I should be able to enter my Username
  • I should be able to enter my Password
  • If my password is incorrect I should get an 'Incorrect Password' toaster message
  • If my username does not exist I should get an 'User not found' toaster message
  • I should be able to navigate to the Forgot Password page from here (#42)
  • I should be able to navigate to the Register page from here. (only if it is an anonymous-enabled application) (#43)
  • I should be able to check the box to enable remember me functionality (#40)

Manage Spending Accounts

As a seller user

  • I should be able to view, create, and update spending accounts
  • I should also be able to assign spending accounts to users or usergroups
  • Spending accounts require these inputs - Name (text), Balance (number), AllowAsPaymentMethod ( default true)
  • Optional inputs are start-date and end-date with date pickers.

Manage Product Variants

As a seller user I should be able to

  • Create new product variants with ID, Name, Required toggle.
  • Edit or delete product variants.
  • Create new options within a variants with ID, Value, Markup Type (None, fixed amount per unit, fixed amount per line, percent of line total), markup amount.
    -Edit or Delete options.

Shopping Cart

As a buyer user I'd like to navigate to shopping cart to get a full view of products currently queue'd to be ordered and get ready to checkout

Acceptance Criteria:

  • I should be able to click on 'Continue Shopping' which will take me to the home page
  • I should be able to cancel my order
  • I should be able to proceed to checkout
  • I should be able to see a list of line items in my cart
  • each of the line items in my cart should have:
    • image (if supplied)
    • Name
    • ID
    • Price
    • Quantity
    • Total
  • I should be able to see a quick summary of my order including:
    • Item count
    • Subtotal
    • Shipping placeholder (to be calculated during checkout)
    • Tax placeholder (to be calculated during checkout)
    • Order Total
  • I should be able to edit the quantities of each line item in my cart
  • I should be able to delete line items from my cart

Pay with CreditCard

As a buyer user I should be able to submit my order with a CreditCard payment

Acceptance Criteria:

  • I should only be able to see CreditCards assigned to me or created by me
  • The payment amount should be set to the total of the order
  • I should see a transaction on my payment simulating an authorized payment from an integration

Notes: this generic credit card component does not handle any kind of authorization or capture of funds, this must be handled by a third party integration such as stripe, authNet etc.

Validation

These are suggestions from Archway. We should also do things like check standard CC rules and CC type.

  • Card Holder# - should be number and space only (can this be limited to 20 chars?)
  • Card Holder Name - should be only alpha numeric with spaces and special characters "-“, “apostrophe”, and “.”
  • CCV should be number only (limit the characters to 4 characters – 3 for MC, Visa and Discover; 4 for Amex)

Favorite Products

As a buyer user I should

  • see a heart next to each product on the product list
  • be able to click heart to toggle it as favorite
  • click My Favorites on the left hand side of product list page to refine products and show just my favorites

Rich text Inputs

  • All the large textarea inputs should have the ability to format text. For example, marking text as bold, italics, underline, large font, exponent, ect. There's a good library for this used in Winmark I believe.
  • All the locations these fields are displayed should show the formatted text.
  • Locations include announcements, product details, order comments. Add more if you can think of more.

Manage Carousel

As a seller user I should be able to:

  • Update, create, or delete new slides for carousel on the homepage. Slides have an image, header text and body text.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.