add
This commit is contained in:
wangziqi
@@ -4,297 +4,514 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>管理员仪表板 - 车管家4S店车辆维保管理系统</title>
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/dashboard.css">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="dashboard-container">
|
||||
<div class="dashboard-wrapper">
|
||||
<!-- 侧边栏 -->
|
||||
<div class="sidebar">
|
||||
<nav class="sidebar">
|
||||
<div class="sidebar-header">
|
||||
<h2>车管家系统</h2>
|
||||
<p>管理员控制台</p>
|
||||
<i class="bi bi-car-front-fill fs-1 d-block mb-2"></i>
|
||||
<h5 class="mb-1">车管家系统</h5>
|
||||
<small>管理员控制台</small>
|
||||
</div>
|
||||
<div class="sidebar-menu">
|
||||
<div class="menu-item active" onclick="showSection('overview')">
|
||||
<span class="menu-icon">📊</span>
|
||||
<div class="mt-4">
|
||||
<a class="menu-item active" onclick="showSection('overview')">
|
||||
<i class="bi bi-speedometer2"></i>
|
||||
<span>系统概览</span>
|
||||
</div>
|
||||
<div class="menu-item" onclick="showSection('users')">
|
||||
<span class="menu-icon">👥</span>
|
||||
</a>
|
||||
<a class="menu-item" onclick="showSection('users')">
|
||||
<i class="bi bi-people-fill"></i>
|
||||
<span>用户管理</span>
|
||||
</div>
|
||||
<div class="menu-item" onclick="showSection('vehicles')">
|
||||
<span class="menu-icon">🚗</span>
|
||||
</a>
|
||||
<a class="menu-item" onclick="showSection('vehicles')">
|
||||
<i class="bi bi-car-front"></i>
|
||||
<span>车辆管理</span>
|
||||
</div>
|
||||
<div class="menu-item" onclick="showSection('orders')">
|
||||
<span class="menu-icon">📋</span>
|
||||
</a>
|
||||
<a class="menu-item" onclick="showSection('orders')">
|
||||
<i class="bi bi-clipboard-data"></i>
|
||||
<span>工单管理</span>
|
||||
</div>
|
||||
<div class="menu-item" onclick="showSection('parts')">
|
||||
<span class="menu-icon">🔧</span>
|
||||
</a>
|
||||
<a class="menu-item" onclick="showSection('parts')">
|
||||
<i class="bi bi-box-seam"></i>
|
||||
<span>配件管理</span>
|
||||
</div>
|
||||
<div class="menu-item" onclick="showSection('appointments')">
|
||||
<span class="menu-icon">📅</span>
|
||||
</a>
|
||||
<a class="menu-item" onclick="showSection('appointments')">
|
||||
<i class="bi bi-calendar-check"></i>
|
||||
<span>预约管理</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- 主内容区 -->
|
||||
<div class="main-content">
|
||||
<!-- 顶部导航 -->
|
||||
<div class="top-nav">
|
||||
<div class="top-nav-left">
|
||||
<h1>管理员仪表板</h1>
|
||||
<main class="main-content">
|
||||
<!-- 顶部导航栏 -->
|
||||
<div class="top-navbar">
|
||||
<div class="d-flex align-items-center">
|
||||
<h5 class="mb-0 me-3">
|
||||
<i class="bi bi-speedometer2"></i> 管理员仪表板
|
||||
</h5>
|
||||
</div>
|
||||
<div class="top-nav-right">
|
||||
<div class="user-info">
|
||||
<div class="user-avatar" id="userAvatar">A</div>
|
||||
<span class="user-name" id="userName">管理员</span>
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-outline-light dropdown-toggle" type="button" data-bs-toggle="dropdown">
|
||||
<i class="bi bi-person-circle"></i>
|
||||
<span id="userName">管理员</span>
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end">
|
||||
<li><h6 class="dropdown-header">当前角色</h6></li>
|
||||
<li><span class="dropdown-item" id="userRole"></span></li>
|
||||
<li><hr class="dropdown-divider"></li>
|
||||
<li><a class="dropdown-item" href="#" onclick="Utils.logout()">
|
||||
<i class="bi bi-box-arrow-right"></i> 退出登录
|
||||
</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<button class="btn-logout" onclick="utils.logout()">退出登录</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 系统概览 -->
|
||||
<div id="overview-section" class="section">
|
||||
<div class="stats-grid">
|
||||
<div class="stat-card">
|
||||
<div class="stat-icon blue">👥</div>
|
||||
<div class="stat-info">
|
||||
<h3 id="totalUsers">0</h3>
|
||||
<p>用户总数</p>
|
||||
<div id="overview-section" class="content-section">
|
||||
<!-- 统计卡片 -->
|
||||
<div class="row g-4 mb-4">
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card">
|
||||
<div class="stat-icon blue">
|
||||
<i class="bi bi-people-fill"></i>
|
||||
</div>
|
||||
<div class="stat-value" id="totalUsers">0</div>
|
||||
<div class="stat-label">用户总数</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-icon green">🚗</div>
|
||||
<div class="stat-info">
|
||||
<h3 id="totalVehicles">0</h3>
|
||||
<p>车辆总数</p>
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card">
|
||||
<div class="stat-icon green">
|
||||
<i class="bi bi-car-front-fill"></i>
|
||||
</div>
|
||||
<div class="stat-value" id="totalVehicles">0</div>
|
||||
<div class="stat-label">车辆总数</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-icon orange">📋</div>
|
||||
<div class="stat-info">
|
||||
<h3 id="totalOrders">0</h3>
|
||||
<p>工单总数</p>
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card">
|
||||
<div class="stat-icon orange">
|
||||
<i class="bi bi-clipboard-data-fill"></i>
|
||||
</div>
|
||||
<div class="stat-value" id="totalOrders">0</div>
|
||||
<div class="stat-label">工单总数</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-icon red">🔧</div>
|
||||
<div class="stat-info">
|
||||
<h3 id="lowStockParts">0</h3>
|
||||
<p>库存预警</p>
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card">
|
||||
<div class="stat-icon red">
|
||||
<i class="bi bi-exclamation-triangle-fill"></i>
|
||||
</div>
|
||||
<div class="stat-value" id="lowStockParts">0</div>
|
||||
<div class="stat-label">库存预警</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 最近工单 -->
|
||||
<div class="content-card">
|
||||
<div class="content-header">
|
||||
<h2>最近工单</h2>
|
||||
<div class="card-header">
|
||||
<h6 class="mb-0"><i class="bi bi-clock-history"></i> 最近工单</h6>
|
||||
</div>
|
||||
<div class="content-body">
|
||||
<table class="table" id="recentOrdersTable">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>工单编号</th>
|
||||
<th>服务类型</th>
|
||||
<th>车牌号</th>
|
||||
<th>状态</th>
|
||||
<th>创建时间</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="recentOrdersBody">
|
||||
<tr><td colspan="5" class="empty-state">加载中...</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="card-body">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-custom">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>工单编号</th>
|
||||
<th>服务类型</th>
|
||||
<th>车牌号</th>
|
||||
<th>总费用</th>
|
||||
<th>状态</th>
|
||||
<th>创建时间</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="recentOrdersTableBody">
|
||||
<tr>
|
||||
<td colspan="6" class="text-center text-muted py-4">
|
||||
<div class="spinner-border spinner-border-sm me-2"></div>
|
||||
加载中...
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 用户管理 -->
|
||||
<div id="users-section" class="section" style="display: none;">
|
||||
<div class="toolbar">
|
||||
<div class="toolbar-left">
|
||||
<button class="btn btn-primary" onclick="showAddUserModal()">添加用户</button>
|
||||
</div>
|
||||
<div class="search-box">
|
||||
<input type="text" id="searchUser" placeholder="搜索用户..." onkeyup="searchUsers()">
|
||||
<button>🔍</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="users-section" class="content-section" style="display: none;">
|
||||
<div class="content-card">
|
||||
<div class="content-body">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>用户名</th>
|
||||
<th>真实姓名</th>
|
||||
<th>手机号</th>
|
||||
<th>角色</th>
|
||||
<th>状态</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="usersTableBody">
|
||||
<tr><td colspan="7" class="empty-state">加载中...</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h6 class="mb-0"><i class="bi bi-people-fill"></i> 用户管理</h6>
|
||||
<button class="btn btn-primary btn-sm" onclick="showAddUserModal()">
|
||||
<i class="bi bi-person-plus"></i> 添加用户
|
||||
</button>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-custom">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>用户名</th>
|
||||
<th>真实姓名</th>
|
||||
<th>手机号</th>
|
||||
<th>角色</th>
|
||||
<th>状态</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="allUsersTableBody">
|
||||
<tr>
|
||||
<td colspan="7" class="text-center text-muted py-4">加载中...</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 车辆管理 -->
|
||||
<div id="vehicles-section" class="section" style="display: none;">
|
||||
<div class="toolbar">
|
||||
<div class="toolbar-left">
|
||||
<button class="btn btn-primary" onclick="showAddVehicleModal()">添加车辆</button>
|
||||
</div>
|
||||
<div class="search-box">
|
||||
<input type="text" id="searchVehicle" placeholder="搜索车辆..." onkeyup="searchVehicles()">
|
||||
<button>🔍</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="vehicles-section" class="content-section" style="display: none;">
|
||||
<div class="content-card">
|
||||
<div class="content-body">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>车牌号</th>
|
||||
<th>品牌型号</th>
|
||||
<th>颜色</th>
|
||||
<th>里程数</th>
|
||||
<th>状态</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="vehiclesTableBody">
|
||||
<tr><td colspan="6" class="empty-state">加载中...</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h6 class="mb-0"><i class="bi bi-car-front"></i> 车辆管理</h6>
|
||||
<button class="btn btn-primary btn-sm" onclick="showAddVehicleModal()">
|
||||
<i class="bi bi-plus-circle"></i> 添加车辆
|
||||
</button>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-custom">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>车牌号</th>
|
||||
<th>品牌型号</th>
|
||||
<th>颜色</th>
|
||||
<th>里程(公里)</th>
|
||||
<th>状态</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="allVehiclesTableBody">
|
||||
<tr>
|
||||
<td colspan="6" class="text-center text-muted py-4">加载中...</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 工单管理 -->
|
||||
<div id="orders-section" class="section" style="display: none;">
|
||||
<div class="toolbar">
|
||||
<div class="toolbar-left">
|
||||
<button class="btn btn-primary" onclick="showAddOrderModal()">创建工单</button>
|
||||
<select id="orderStatusFilter" onchange="filterOrders()">
|
||||
<option value="">全部状态</option>
|
||||
<option value="pending">待处理</option>
|
||||
<option value="appointed">已预约</option>
|
||||
<option value="in_progress">进行中</option>
|
||||
<option value="completed">已完成</option>
|
||||
<option value="cancelled">已取消</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="orders-section" class="content-section" style="display: none;">
|
||||
<div class="content-card">
|
||||
<div class="content-body">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>工单编号</th>
|
||||
<th>服务类型</th>
|
||||
<th>车牌号</th>
|
||||
<th>总费用</th>
|
||||
<th>状态</th>
|
||||
<th>创建时间</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="ordersTableBody">
|
||||
<tr><td colspan="7" class="empty-state">加载中...</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h6 class="mb-0"><i class="bi bi-clipboard-data"></i> 工单管理</h6>
|
||||
<div>
|
||||
<select class="form-select form-select-sm d-inline-block w-auto me-2" onchange="filterOrders(this.value)">
|
||||
<option value="">全部状态</option>
|
||||
<option value="pending">待处理</option>
|
||||
<option value="appointed">已预约</option>
|
||||
<option value="in_progress">进行中</option>
|
||||
<option value="completed">已完成</option>
|
||||
<option value="cancelled">已取消</option>
|
||||
</select>
|
||||
<button class="btn btn-primary btn-sm" onclick="showAddOrderModal()">
|
||||
<i class="bi bi-plus-circle"></i> 创建工单
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-custom">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>工单编号</th>
|
||||
<th>服务类型</th>
|
||||
<th>车牌号</th>
|
||||
<th>总费用</th>
|
||||
<th>工单状态</th>
|
||||
<th>支付状态</th>
|
||||
<th>创建时间</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="allOrdersTableBody">
|
||||
<tr>
|
||||
<td colspan="8" class="text-center text-muted py-4">加载中...</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 配件管理 -->
|
||||
<div id="parts-section" class="section" style="display: none;">
|
||||
<div class="toolbar">
|
||||
<div class="toolbar-left">
|
||||
<button class="btn btn-primary" onclick="showAddPartModal()">添加配件</button>
|
||||
<button class="btn btn-warning" onclick="showLowStockParts()">库存预警</button>
|
||||
</div>
|
||||
<div class="search-box">
|
||||
<input type="text" id="searchPart" placeholder="搜索配件..." onkeyup="searchParts()">
|
||||
<button>🔍</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="parts-section" class="content-section" style="display: none;">
|
||||
<div class="content-card">
|
||||
<div class="content-body">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>配件编号</th>
|
||||
<th>配件名称</th>
|
||||
<th>类别</th>
|
||||
<th>库存数量</th>
|
||||
<th>单价</th>
|
||||
<th>状态</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="partsTableBody">
|
||||
<tr><td colspan="7" class="empty-state">加载中...</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h6 class="mb-0"><i class="bi bi-box-seam"></i> 配件管理</h6>
|
||||
<button class="btn btn-primary btn-sm" onclick="showAddPartModal()">
|
||||
<i class="bi bi-plus-circle"></i> 添加配件
|
||||
</button>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-custom">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>配件编号</th>
|
||||
<th>配件名称</th>
|
||||
<th>类别</th>
|
||||
<th>库存数量</th>
|
||||
<th>单价</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="partsTableBody">
|
||||
<tr>
|
||||
<td colspan="6" class="text-center text-muted py-4">加载中...</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 预约管理 -->
|
||||
<div id="appointments-section" class="section" style="display: none;">
|
||||
<div class="toolbar">
|
||||
<div class="toolbar-left">
|
||||
<select id="appointmentStatusFilter" onchange="filterAppointments()">
|
||||
<option value="">全部状态</option>
|
||||
<option value="pending">待确认</option>
|
||||
<option value="confirmed">已确认</option>
|
||||
<option value="completed">已完成</option>
|
||||
<option value="cancelled">已取消</option>
|
||||
</select>
|
||||
<div id="appointments-section" class="content-section" style="display: none;">
|
||||
<div class="content-card">
|
||||
<div class="card-header">
|
||||
<h6 class="mb-0"><i class="bi bi-calendar-check"></i> 预约管理</h6>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-custom">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>预约ID</th>
|
||||
<th>服务类型</th>
|
||||
<th>车牌号</th>
|
||||
<th>预约时间</th>
|
||||
<th>联系电话</th>
|
||||
<th>状态</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="appointmentsTableBody">
|
||||
<tr>
|
||||
<td colspan="7" class="text-center text-muted py-4">加载中...</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<div class="content-card">
|
||||
<div class="content-body">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>预约ID</th>
|
||||
<th>服务类型</th>
|
||||
<th>车牌号</th>
|
||||
<th>预约时间</th>
|
||||
<th>联系电话</th>
|
||||
<th>状态</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="appointmentsTableBody">
|
||||
<tr><td colspan="7" class="empty-state">加载中...</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<!-- 用户编辑模态框 -->
|
||||
<div class="modal fade" id="userModal" tabindex="-1">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="userModalTitle">编辑用户</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form id="userForm">
|
||||
<input type="hidden" id="userId">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">用户名</label>
|
||||
<input type="text" class="form-control" id="userUsername" required>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">真实姓名</label>
|
||||
<input type="text" class="form-control" id="userRealName" required>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">手机号</label>
|
||||
<input type="tel" class="form-control" id="userPhone" required>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">邮箱</label>
|
||||
<input type="email" class="form-control" id="userEmail">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">角色</label>
|
||||
<select class="form-select" id="userRole" required>
|
||||
<option value="admin">管理员</option>
|
||||
<option value="staff">工作人员</option>
|
||||
<option value="customer">客户</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">状态</label>
|
||||
<select class="form-select" id="userStatus">
|
||||
<option value="1">启用</option>
|
||||
<option value="0">禁用</option>
|
||||
</select>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
|
||||
<button type="button" class="btn btn-primary" onclick="saveUser()">保存</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 车辆编辑模态框 -->
|
||||
<div class="modal fade" id="vehicleModal" tabindex="-1">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="vehicleModalTitle">编辑车辆</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form id="vehicleForm">
|
||||
<input type="hidden" id="vehicleId">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">车牌号</label>
|
||||
<input type="text" class="form-control" id="vehicleLicensePlate" required>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">品牌</label>
|
||||
<input type="text" class="form-control" id="vehicleBrand" required>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">型号</label>
|
||||
<input type="text" class="form-control" id="vehicleModel" required>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">颜色</label>
|
||||
<input type="text" class="form-control" id="vehicleColor">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">里程(公里)</label>
|
||||
<input type="number" step="0.01" class="form-control" id="vehicleMileage" value="0">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">状态</label>
|
||||
<select class="form-select" id="vehicleStatus">
|
||||
<option value="normal">正常</option>
|
||||
<option value="in_service">维修中</option>
|
||||
<option value="completed">已完成</option>
|
||||
</select>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
|
||||
<button type="button" class="btn btn-primary" onclick="saveVehicle()">保存</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 工单编辑模态框 -->
|
||||
<div class="modal fade" id="orderModal" tabindex="-1">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="orderModalTitle">编辑工单</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form id="orderForm">
|
||||
<input type="hidden" id="orderId">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">服务类型</label>
|
||||
<select class="form-select" id="orderServiceType" required>
|
||||
<option value="maintenance">保养维护</option>
|
||||
<option value="repair">维修服务</option>
|
||||
<option value="beauty">美容服务</option>
|
||||
<option value="insurance">保险代理</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">故障描述</label>
|
||||
<textarea class="form-control" id="orderFaultDescription" rows="2"></textarea>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">诊断结果</label>
|
||||
<textarea class="form-control" id="orderDiagnosisResult" rows="2"></textarea>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 mb-3">
|
||||
<label class="form-label">配件费用</label>
|
||||
<input type="number" step="0.01" class="form-control" id="orderPartsCost" value="0">
|
||||
</div>
|
||||
<div class="col-6 mb-3">
|
||||
<label class="form-label">工时费用</label>
|
||||
<input type="number" step="0.01" class="form-control" id="orderLaborCost" value="0">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 mb-3">
|
||||
<label class="form-label">总费用</label>
|
||||
<input type="number" step="0.01" class="form-control" id="orderTotalCost" value="0" readonly>
|
||||
</div>
|
||||
<div class="col-6 mb-3">
|
||||
<label class="form-label">状态</label>
|
||||
<select class="form-select" id="orderStatus">
|
||||
<option value="pending">待处理</option>
|
||||
<option value="appointed">已预约</option>
|
||||
<option value="in_progress">进行中</option>
|
||||
<option value="completed">已完成</option>
|
||||
<option value="cancelled">已取消</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
|
||||
<button type="button" class="btn btn-primary" onclick="saveOrder()">保存</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Toast 通知 -->
|
||||
<div class="toast-container position-fixed top-0 end-0 p-3">
|
||||
<div id="liveToast" class="toast" role="alert">
|
||||
<div class="toast-header">
|
||||
<i class="bi bi-bell me-2" id="toastIcon"></i>
|
||||
<strong class="me-auto" id="toastTitle">提示</strong>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="toast"></button>
|
||||
</div>
|
||||
<div class="toast-body" id="toastMessage"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Loading 遮罩 -->
|
||||
<div id="loadingOverlay" class="loading-overlay d-none">
|
||||
<div class="spinner-border text-primary" role="status" style="width: 3rem; height: 3rem;">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="../js/config.js"></script>
|
||||
<script src="../js/api.js"></script>
|
||||
<script src="../js/admin-dashboard.js"></script>
|
||||
<script src="../js/admin.js"></script>
|
||||
<script src="../js/app.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user