Staff Page

The Bookings Staff page has 3 dashboard plugin slots: 1 dashboard, and 2 dashboard menu.

Learn more about dashboard plugins and slots.

Page location in dashboard

Settings > Booking Settings > Staff

Slot 1: Staff banner

This dashboard plugin slot is positioned at the top of the page.

Bookings staff slot

Multiple plugins in the same slot

This plugin slot can host multiple plugins.

The plugins are displayed vertically and ordered by date created, with the most recently created plugin displayed at the top.

Slot 2: Main more actions menu

This dashboard menu plugin slot is located in the main more actions menu on the Staff page.

main menu slot

Multiple plugins in the same slot

This menu plugin slot can host multiple plugins.

The plugins are displayed vertically and ordered by date created, with the most recently created plugin displayed at the bottom.

Slot 3: Staff item more actions menu

This dashboard menu plugin slot is located in each staff member's more actions menu in the staff list.

staff menu slot

Multiple plugins in the same slot

This menu plugin slot can host multiple plugins.

The plugins are displayed vertically and ordered by date created, with the most recently created plugin displayed at the bottom.

Slots list

Slot nameSlot typeIDInterface
Staff bannerDashboard plugin slot261e84a2-31d0-4258-a035-10544d251108StaffBannerParams
Main more actions menuDashboard menu plugin slot3ad7e6d2-35ce-45c1-ab59-64c51b60a104StaffMainMoreActionsMenuParams
Staff item more actions menuDashboard menu plugin slot884a208a-7c23-4641-856a-d6561ed4c64bStaffItemMoreActionsMenuParams

Related APIs

You can implement logic in your plugin using the Wix Bookings APIs:

Did this help?

Staff Banner Params

Apps built by Wix pass parameters via dashboard slots for you to utilize in your plugin’s functionality. Learn how to interact with and retrieve parameters from the dashboard page.

Plugin Params
staffIdstring

Staff ID.

staffResourceIdstring

Staff Resource ID.

Use this in the code for the dashboard plugin.

JavaScript
import React, { type FC } from 'react';
import { WixDesignSystemProvider, Button } from '@wix/design-system';
import '@wix/design-system/styles.global.css';
import { plugins } from "@wix/bookings/dashboard";

type StaffBannerParams = plugins.Staff.StaffBannerParams;

const Plugin: FC<StaffBannerParams> = (props: StaffBannerParams) => {
  return (
    <WixDesignSystemProvider features={{ newColorsBranding: true }}>
      <Button onClick={() => 	({
    	  console.log(
	     `Staff Resource Id: ${componentParams.staffResourceId}`, 
	     `Staff Id: ${componentParams.staffId}`
    	  );
    
    	})}
      >
       Click me!
      </Button>
    </WixDesignSystemProvider>
  );
};

export default Plugin;
Did this help?

Staff Main More Actions Menu Params

Apps built by Wix pass parameters via dashboard slots for you to utilize in your plugin’s functionality. Learn how to interact with and retrieve parameters from the dashboard page.

Plugin Params
This slot does not accept any parameters.

Use this in the code for the page or modal opened by the dashboard menu plugin.

JavaScript
import React, { type FC } from 'react';
import { WixDesignSystemProvider, Button } from '@wix/design-system';
import '@wix/design-system/styles.global.css';
import { plugins } from "@wix/bookings/dashboard";

type StaffMainMoreActionsMenuParams = plugins.Staff.StaffMainMoreActionsMenuParams;

const Modal: FC<StaffMainMoreActionsMenuParams> = (props: StaffMainMoreActionsMenuParams) => {
  return (
    <WixDesignSystemProvider features={{ newColorsBranding: true }}>
      <Button onClick={() => ({})}
      >
       Click me!
      </Button>
    </WixDesignSystemProvider>
  );
};

export default Modal;
Did this help?