# Pay Slip

The **Salary Slip** shows an employee's salary details for a selected pay period. It helps the employee understand how much they earned, what was deducted, and how much was paid.

## Payslip Overview

The payslip screen displays a summary of the employee’s salary for the selected payroll period.

<div  style="display: flex; justify-content: center; gap: 60px; flex-wrap: wrap;">

  <div>
    <a href="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/aV0imockup-iphone-16-pro-max-94.png">
      <img src="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/aV0imockup-iphone-16-pro-max-94.png" width="250">
    </a>
  </div>
  <div>
    It includes:

- Pay period and payment date
- Take-home pay
- Net pay
- Deductions
- Gross pay
- Total working hours
- Hourly rate
- Payment status
- Earnings details
- Employee deductions
- Employer taxes
- Direct deposit information
- Payslip download option
  </div>
</div>

---

## Payslip Header

At the top of the screen, the **Pay Slip** title identifies the current page.

The header contains:

- **Pay period:** Shows the start date and end date for the selected salary period.
- **Paid date:** Shows the date on which the salary was paid.
- **Download button:** Allows the employee to download the payslip.

> The displayed dates and amounts depend on the selected payroll record.

---

## Download Payslip

The **Download** button is displayed beside the pay-period information.

1. Open the **Pay Slip** screen from the Employee App.
2. Select the required pay period if more than one payslip is available.
3. Review the salary summary and payment details.
4. Tap the **Download** icon.
5. Save or open the downloaded payslip from the device’s download location.

The downloaded file can be used for personal records, salary verification, or sharing with an authorized person.

<div align="center">
  <a href="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/imockup-iphone-16-pro-max-94.png">
  <img 
    src="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/imockup-iphone-16-pro-max-94.png" 
    alt="Change Employee App Password"
    width=250
  >
</a>
</div>

---


## Select Pay Period

The **Pay Period** selector allows employees to choose which payroll record they want to view.

Tap the pay-period field at the top of the **Pay Slip** screen to open the **Select Pay Period** window.

The selection window displays available payroll records. Each record shows:

- **Pay Period:** The start date and end date covered by the payroll.
- **Paid Date:** The date the employee was paid.
- **Net Pay Amount:** The take-home amount associated with that payroll period.
- **Percentage:** The net-pay percentage displayed for the selected record, when available.

<div align="center" style="display: flex; justify-content: center; gap: 60px; flex-wrap: wrap;">
  <div>
    <a href="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/cWzimockup-iphone-16-pro-max-94.png">
      <img src="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/cWzimockup-iphone-16-pro-max-94.png" width="250">
    </a>
  </div>
  <div>
    <a href="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/imockup-iphone-16-pro-max-97.png">
      <img src="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/imockup-iphone-16-pro-max-97.png" width="250">
    </a>
  </div>
</div>

1. Tap the **Pay Period** field at the top of the screen.
2. The **Select Pay Period** window opens.
3. Review the available payroll periods.
4. Tap the required pay-period record.
5. The selected period becomes active.
6. The payslip screen refreshes to show the salary details for that period.

The selected pay period is displayed in the top field after the selection window closes.

> Selecting a different pay period updates the payslip summary, including take-home pay, net pay, deductions, gross pay, hours, hourly rate, payment status, and available payroll details.

## Take Home

The **Take Home** section displays the final amount the employee receives after deductions.

The amount is shown in the center of the circular salary chart.

The chart visually compares:

- **Net Pay:** The amount received by the employee.
- **Deductions:** The amount subtracted from gross pay.

The green section represents net pay, while the red section represents deductions.

---

## Net Pay

The **Net Pay** row shows the employee’s final payable salary after deductions.

It includes:

- Net pay percentage
- Net pay amount


Net pay is the amount that the employee receives after applicable deductions have been removed.

---

## Deductions

The **Deductions** row shows the total amount deducted from the employee’s gross salary.

It includes:

- Deduction percentage
- Total deduction amount

Deductions may include employee taxes, benefits, or other payroll deductions configured by the organization.

---

## Gross Pay

The **Gross Pay** section displays the employee’s total salary before deductions.

Gross pay is the total amount earned during the selected pay period before employee deductions are applied.

### Salary Calculation

```text
Gross Pay - Deductions = Net Pay
```

---

## Hours

Shows the **total working hours** included in the salary calculation.

This value helps the employee understand how the salary was calculated based on recorded working time.

---

## Hourly Rate

Shows how much the employee earns per hour.

The hourly rate may be used to calculate gross earnings based on the employee’s recorded hours and payroll rules.

---

## Payment Status

The payment status indicates whether the payslip has been paid.

A green **Paid** status indicates that the payroll record is marked as paid.

The status may vary depending on the payroll processing stage.

---

## Earnings

**Earnings** show the money earned by the employee during the pay period. Total earnings before employee deductions.

##### **How to View Earnings**

1. Tap **Earnings**.
2. Review the listed earning components.
3. Check the amount associated with each earning type.
4. Collapse the section when finished.

<div align="center">
  <a href="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/imockup-iphone-16-pro-max-95.png">
  <img 
    src="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/imockup-iphone-16-pro-max-95.png" 
    alt="Change Employee App Password"
    width=250
  >
</a>
</div>
<br>
The exact earning items depend on the employee’s payroll configuration.

---

## Employee Deductions

**Employee Deductions** show taxes or other amounts taken from the employee's pay. These amounts are removed from gross pay before the employee receives final pay.

##### **How to View Employee Deductions**

1. Tap **Employee Deductions**.
2. Review each deduction type.
3. Check the amount deducted for each item.
4. Confirm that the total matches the deductions shown in the salary summary.

<div align="center">
  <a href="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/oFWimockup-iphone-16-pro-max-95.png">
  <img 
    src="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/oFWimockup-iphone-16-pro-max-95.png" 
    alt="Change Employee App Password"
    width=250
  >
</a>
</div>

---

## Employer Taxes

**Employer Taxes** show taxes or contributions paid by the employer. These are employer-paid costs related to the employee. They are separate from employee deductions.

##### **How to View Employer Taxes**

1. Tap **Employer Taxes**.
2. Review the employer tax items.
3. Check the amount associated with each item.
4. Collapse the section after reviewing the details.

<div align="center">
  <a href="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/imockup-iphone-16-pro-max-96.png">
  <img 
    src="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/imockup-iphone-16-pro-max-96.png" 
    alt="Change Employee App Password"
    width=250
  >
</a>
</div>
<br>

> Employer taxes are shown for payroll transparency and may be separate from employee deductions.

---

## 13. Direct Deposit

**Direct Deposit** shows where the employee's salary was deposited. This shows the bank account used to receive the salary. Only the last four digits are visible for security.


##### **How to View Direct Deposit**

1. Tap **Direct Deposit**.
2. Review the available deposit information.
3. Confirm the payment method and deposit amount.
4. Collapse the section when finished.

<div align="center">
  <a href="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/1Bbimockup-iphone-16-pro-max-96.png">
  <img 
    src="https://docs.spendwelltechsystem.com/uploads/images/gallery/2026-09/scaled-1680-/1Bbimockup-iphone-16-pro-max-96.png" 
    alt="Change Employee App Password"
    width=250
  >
</a>
</div>
<br>

> Sensitive bank information should be handled carefully and shared only with authorized users.

---

## Important Notes

- Payslip values are based on the selected payroll period.
- Earnings and deductions may vary from one pay period to another.
- Employer taxes are separate from employee deductions.
- The download option should be used to save a copy of the payslip for future reference.
- Employees should contact their manager or payroll administrator if any salary information appears incorrect.

<br>