Segmentation.aspx

<%@ Page Language="VB" AutoEventWireup="true" CodeFile="Segmentation.aspx.vb" Inherits="Segmentation" %>
<!DOCTYPE html>
<html>
<head runat="server">
    <title>Customer Segmentation</title>
    <link rel="stylesheet" href="style.css" />
</head>
<body>
<form id="form1" runat="server">

<div class="segment-box">

    <h2>Customer Segmentation Analysis</h2>

    <asp:DropDownList ID="ddlSegment" runat="server" CssClass="segment-dropdown">
        <asp:ListItem Text="Select Segment" Value="" />
        <asp:ListItem Text="Premium Customers" Value="premium" />
        <asp:ListItem Text="Frequent Customers" Value="frequent" />
        <asp:ListItem Text="Bulk Buyers" Value="bulk" />
        <asp:ListItem Text="At-Risk Customers" Value="atrisk" />
        <asp:ListItem Text="Loyal Customers" Value="loyal" />
        <asp:ListItem Text="New Customers" Value="new" />
        <asp:ListItem Text="Show All Segments" Value="all" />
    </asp:DropDownList>

    <asp:Button ID="btnShow" runat="server" Text="Show Segment"
        CssClass="segment-btn" OnClick="btnShow_Click" />

    <br /><br />

    <asp:Label ID="lblMsg" runat="server" ForeColor="Red" />

    <asp:Panel ID="pnlSingleGrid" runat="server">
        <asp:GridView ID="GridView1" runat="server"
            CssClass="segment-grid" AutoGenerateColumns="True" />
    </asp:Panel>

    <asp:Panel ID="pnlAllSegments" runat="server" Visible="False" CssClass="all-segments-grid" />

</div>

</form>
</body>
</html>

Segmentation.aspx.vb

Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration

Partial Class Segmentation
    Inherits System.Web.UI.Page

    Dim connStr As String = ConfigurationManager.ConnectionStrings("PVFC").ConnectionString

    Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
        If Session("Role") Is Nothing OrElse Session("Role").ToString() <> "Employee" Then
            Response.Redirect("EmployeeLogin.aspx")
        End If
    End Sub

    Private Function GetSegmentQuery(segment As String) As String
        Select Case segment
            Case "premium"
                Return "SELECT TOP 5 C.Customer_Id, C.Customer_Name, " &
                       "SUM(OL.Ordered_Quantity * P.Standard_Price) AS TotalSpent " &
                       "FROM CUSTOMER_t C " &
                       "JOIN ORDER_t O ON C.Customer_Id = O.Customer_Id " &
                       "JOIN Order_line_t OL ON O.Order_Id = OL.Order_Id " &
                       "JOIN PRODUCT_t P ON P.Product_Id = OL.Product_Id " &
                       "GROUP BY C.Customer_Id, C.Customer_Name ORDER BY TotalSpent DESC"

            Case "frequent"
                Return "SELECT TOP 5 C.Customer_Id, C.Customer_Name, " &
                       "COUNT(O.Order_Id) AS TotalOrders " &
                       "FROM CUSTOMER_t C " &
                       "JOIN ORDER_t O ON C.Customer_Id = O.Customer_Id " &
                       "GROUP BY C.Customer_Id, C.Customer_Name " &
                       "HAVING COUNT(O.Order_Id) > 3 ORDER BY TotalOrders DESC"

            Case "bulk"
                Return "SELECT TOP 5 C.Customer_Id, C.Customer_Name, " &
                       "SUM(OL.Ordered_Quantity) AS TotalUnits " &
                       "FROM CUSTOMER_t C " &
                       "JOIN ORDER_t O ON C.Customer_Id = O.Customer_Id " &
                       "JOIN Order_line_t OL ON O.Order_Id = OL.Order_Id " &
                       "GROUP BY C.Customer_Id, C.Customer_Name " &
                       "HAVING SUM(OL.Ordered_Quantity) > 15 ORDER BY TotalUnits DESC"

            Case "atrisk"
                Return "SELECT TOP 5 C.Customer_Id, C.Customer_Name, " &
                       "MAX(O.Order_Date) AS LastOrderDate " &
                       "FROM CUSTOMER_t C " &
                       "JOIN ORDER_t O ON C.Customer_Id = O.Customer_Id " &
                       "GROUP BY C.Customer_Id, C.Customer_Name " &
                       "HAVING MAX(O.Order_Date) < DATEADD(YEAR, -1, GETDATE())"

            Case "loyal"
                Return "SELECT TOP 5 C.Customer_Id, C.Customer_Name, " &
                       "COUNT(DISTINCT O.Order_Id) AS OrderCount " &
                       "FROM CUSTOMER_t C " &
                       "JOIN ORDER_t O ON C.Customer_Id = O.Customer_Id " &
                       "GROUP BY C.Customer_Id, C.Customer_Name " &
                       "HAVING COUNT(DISTINCT O.Order_Id) >= 2 ORDER BY OrderCount DESC"

            Case "new"
                Return "SELECT TOP 5 C.Customer_Id, C.Customer_Name, " &
                       "COUNT(O.Order_Id) AS TotalOrders " &
                       "FROM CUSTOMER_t C " &
                       "JOIN ORDER_t O ON C.Customer_Id = O.Customer_Id " &
                       "GROUP BY C.Customer_Id, C.Customer_Name " &
                       "HAVING MIN(O.Order_Date) >= DATEADD(DAY, -60, GETDATE())"
        End Select
        Return ""
    End Function

    Protected Sub btnShow_Click(sender As Object, e As EventArgs) Handles btnShow.Click

        Dim selected As String = ddlSegment.SelectedValue
        lblMsg.Text = ""
        pnlAllSegments.Visible = False
        GridView1.DataSource = Nothing
        GridView1.DataBind()

        If selected = "" Then Exit Sub

        If selected = "all" Then
            pnlAllSegments.Visible = True
            pnlSingleGrid.Visible = False
            pnlAllSegments.Controls.Clear()

            Dim segments() As String = {"premium", "frequent", "bulk", "atrisk", "loyal", "new"}

            Using con As New SqlConnection(connStr)
                con.Open()
                For Each seg In segments
                    Dim query As String = GetSegmentQuery(seg)
                    If query = "" Then Continue For

                    Dim dt As New DataTable()
                    Using cmd As New SqlCommand(query, con)
                        Dim da As New SqlDataAdapter(cmd)
                        da.Fill(dt)
                    End Using

                    Dim lbl As New Label()
                    lbl.Text = seg
                    pnlAllSegments.Controls.Add(lbl)

                    Dim gv As New GridView()
                    gv.DataSource = dt
                    gv.DataBind()
                    pnlAllSegments.Controls.Add(gv)
                Next
            End Using

            Return
        End If

        Dim singleQuery As String = GetSegmentQuery(selected)
        If singleQuery = "" Then Exit Sub

        Using con As New SqlConnection(connStr)
            Using cmd As New SqlCommand(singleQuery, con)
                Dim da As New SqlDataAdapter(cmd)
                Dim dt As New DataTable()
                da.Fill(dt)

                If dt.Rows.Count = 0 Then
                    lblMsg.Text = "No customers found in this segment."
                    Return
                End If

                GridView1.DataSource = dt
                GridView1.DataBind()
            End Using
        End Using

    End Sub

End Class

style.css

body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #FFF2E0;
    color: #2d2d2d;
}

header {
    background: #898AC4;
    color: white;
    padding: 15px;
    text-align: center;
}

nav ul {
    list-style-type: none;
    background-color: #A2AADB;
    padding: 0;
    margin: 0;
    overflow: hidden;
}

nav ul li {
    float: left;
}

nav ul li a {
    display: block;
    color: #FFF2E0;
    padding: 12px 18px;
    text-decoration: none;
}

nav ul li a:hover {
    background-color: #C0C9EE;
    color: #FFF2E0;
}

.container {
    padding: 25px;
    flex: 1;
}

button, .btn {
    padding: 10px 18px;
    background: #A2AADB;
    color: white;
    border: none;
    border-radius: 8px;
    cursor: pointer;
}

button:hover, .btn:hover {
    background: #898AC4;
}

footer {
    background-color: #C0C9EE;
    text-align: center;
    padding: 12px;
    width: 100%;
}

.product-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.product-card {
    background: #C0C9EE;
    padding: 15px;
    border-radius: 10px;
    width: 200px;
    text-align: center;
}

.image-box {
    width: 100%;
    height: 120px;
    background-color: #A2AADB;
    border-radius: 8px;
    margin-bottom: 10px;
}

.auth-box {
    width: 350px;
    background: white;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
    margin: auto;
    margin-top: 120px;
    text-align: center;
}

.auth-box input, .auth-box .btn {
    width: 100%;
    padding: 10px;
    margin-top: 10px;
}

.segment-box {
    background: white;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0px 0px 12px rgba(0,0,0,0.1);
    max-width: 900px;
    margin: 30px auto;
    text-align: center;
}

.segment-box h2 {
    margin-bottom: 15px;
    color: #898AC4;
}

.segment-dropdown {
    width: 100%;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #ccc;
    margin-bottom: 15px;
    background: #FFF2E0;
}

.segment-btn {
    display: block;
    margin: 10px auto;
    width: fit-content;
    padding: 10px 20px;
    background: #A2AADB;
    font-weight: bold;
    border-radius: 6px;
    border: none;
    cursor: pointer;
}

.segment-btn:hover {
    background: #898AC4;
}

.all-segments-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 20px;
    align-items: start;
}

.seg-card {
    border-radius: 10px;
    padding: 14px;
}

.segment-grid {
    width: 100%;
    font-size: 13px;
    margin-top: 10px;
}

.segment-grid table {
    width: 100%;
    border-collapse: collapse;
    background: #FFF2E0;
    border-radius: 8px;
    overflow: hidden;
}

.segment-grid th,
.segment-grid td {
    padding: 8px;
    text-align: left;
}

.segment-grid th {
    color: #000000;
    font-weight: 600;
}

.segment-grid tr:hover td {
    background: #FFF2E0;
}

.segment-no-data {
    font-size: 13px;
    color: #777;
    font-style: italic;
}

.segment-section-title {
    display: block;
    font-size: 15px;
    font-weight: 600;
    margin: 10px 0;
    color: #333;
}

.seg-premium {
    background: #fff3cd;
}

.seg-premium th {
    background: #d39e00;
}

.seg-frequent {
    background: #e7f1ff;
}

.seg-frequent th {
    background: #3b6cb7;
}

.seg-bulk {
    background: #eafaf1;
}

.seg-bulk th {
    background: #2e8b57;
}

.seg-atrisk {
    background: #fdecea;
}

.seg-atrisk th {
    background: #c0392b;
}

.seg-loyal {
    background: #f4eaff;
}

.seg-loyal th {
    background: #7d3c98;
}

.seg-new {
    background: #e8fbf8;
}

.seg-new th {
    background: #16a085;
}