457 lines
19 KiB
HTML
457 lines
19 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
|
<title>接单系统</title>
|
|
<link rel="stylesheet" href="css/style.css">
|
|
</head>
|
|
<body>
|
|
|
|
<!-- 登录页 -->
|
|
<div id="loginPage" class="page active">
|
|
<div class="login-box">
|
|
<h1>接单系统</h1>
|
|
<div class="form-group">
|
|
<label>用户名</label>
|
|
<input type="text" id="loginUser" placeholder="请输入用户名" autocomplete="username">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>密码</label>
|
|
<input type="password" id="loginPass" placeholder="请输入密码" autocomplete="current-password">
|
|
</div>
|
|
<button class="btn btn-primary" onclick="doLogin()">登 录</button>
|
|
<div class="login-error" id="loginError"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 首页 -->
|
|
<div id="homePage" class="page">
|
|
<div class="home-header">
|
|
<div class="month-selector" onclick="openMonthPicker()">
|
|
<span id="monthDisplay">2026年2月</span>
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M6 9l6 6 6-6"/></svg>
|
|
</div>
|
|
</div>
|
|
<div class="tab-content">
|
|
<!-- 统计 -->
|
|
<div id="statsPanel" class="tab-panel active">
|
|
<div class="pull-indicator" id="pullIndicator">
|
|
<svg class="pull-arrow" id="pullArrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 19V5M5 12l7-7 7 7"/></svg>
|
|
<span id="pullText">下拉刷新</span>
|
|
</div>
|
|
<div class="stat-grid">
|
|
<div class="stat-card clickable" onclick="showPage('orderListPage')">
|
|
<div class="label">接单数</div>
|
|
<div class="value" id="takeCount">0</div>
|
|
<div class="sub-income" id="takeIncome">0</div>
|
|
</div>
|
|
<div class="stat-card clickable" onclick="showPage('dispatchListPage')">
|
|
<div class="label">派单数</div>
|
|
<div class="value" id="dispatchCount">0</div>
|
|
<div class="sub-income" id="dispatchIncome">0</div>
|
|
</div>
|
|
<div class="stat-card clickable" onclick="showPage('redEnvelopeListPage')">
|
|
<div class="label">红包</div>
|
|
<div class="value" id="redEnvelopeCount">0</div>
|
|
<div class="sub-income" id="redEnvelopeIncome">0</div>
|
|
</div>
|
|
<div class="stat-card clickable" onclick="showPage('milkTeaListPage')">
|
|
<div class="label">奶茶</div>
|
|
<div class="value" id="milkTeaCount">0</div>
|
|
<div class="sub-income" id="milkTeaIncome">0</div>
|
|
</div>
|
|
</div>
|
|
<div class="stat-summary">
|
|
<div class="item clickable" onclick="openMonthlyDetail('income')">
|
|
<div class="label">总收入</div>
|
|
<div class="val green" id="totalIncome">0</div>
|
|
</div>
|
|
<div class="item clickable" onclick="openMonthlyDetail('expense')">
|
|
<div class="label">总支出</div>
|
|
<div class="val red" id="totalExpense">0</div>
|
|
</div>
|
|
<div class="item">
|
|
<div class="label">净收入</div>
|
|
<div class="val green" id="netIncome">0</div>
|
|
</div>
|
|
</div>
|
|
<!-- 最近7天收入柱状图 -->
|
|
<div class="weekly-chart">
|
|
<div class="weekly-chart-title">最近7天收入</div>
|
|
<div class="weekly-chart-bars" id="weeklyChartBars"></div>
|
|
</div>
|
|
<!-- 老板收入排行预览 -->
|
|
<div class="ranking-preview">
|
|
<div class="ranking-header">
|
|
<span class="ranking-title">老板贡献榜（本月）</span>
|
|
<span class="ranking-detail-btn" onclick="showPage('rankingPage')">详情 →</span>
|
|
</div>
|
|
<div id="rankingPreviewList" class="ranking-list">
|
|
<div class="ranking-empty">暂无数据</div>
|
|
</div>
|
|
</div>
|
|
<!-- 陪玩派单榜预览 -->
|
|
<div class="ranking-preview">
|
|
<div class="ranking-header">
|
|
<span class="ranking-title">陪玩派单榜（本月）</span>
|
|
<span class="ranking-detail-btn" onclick="openPartnerRankingPage()">详情 →</span>
|
|
</div>
|
|
<div id="partnerRankingPreviewList" class="ranking-list">
|
|
<div class="ranking-empty">暂无数据</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="minePanel" class="tab-panel">
|
|
<div class="profile-card">
|
|
<div class="avatar" id="avatarText" onclick="onAvatarTap()">李</div>
|
|
<div class="name" id="profileName">用户</div>
|
|
<div class="mine-stats">
|
|
<div class="mine-stat-item" onclick="openTakeRanking()">
|
|
<div class="mine-stat-value" id="totalTakeCount">0</div>
|
|
<div class="mine-stat-label">总接单数</div>
|
|
</div>
|
|
<div class="mine-stat-item" onclick="openDispatchRanking()">
|
|
<div class="mine-stat-value" id="totalDispatchCount">0</div>
|
|
<div class="mine-stat-label">总派单数</div>
|
|
</div>
|
|
<div class="mine-stat-item" onclick="openYearlyIncome()">
|
|
<div class="mine-stat-value green" id="totalNetIncome">0</div>
|
|
<div class="mine-stat-label">总净收入</div>
|
|
</div>
|
|
</div>
|
|
<button class="refresh-btn" onclick="location.reload()">刷新界面</button>
|
|
<div id="secretBtns" style="display:none">
|
|
<button class="refresh-btn" style="margin-top:12px" onclick="showExportDialog()">导出数据</button>
|
|
<button class="refresh-btn" style="margin-top:12px" onclick="triggerImport()">导入数据</button>
|
|
<input type="file" id="importFileInput" accept=".json,.csv" style="display:none" onchange="handleImportFile(event)">
|
|
</div>
|
|
<button class="logout-btn" onclick="doLogout()">退出登录</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="bottom-bar">
|
|
<div class="nav-item active" id="navStats" onclick="switchNav('stats')">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 3v18h18"/><path d="M7 16l4-8 4 4 4-6"/></svg>
|
|
<span>统计</span>
|
|
</div>
|
|
<button class="record-btn" onclick="showPage('recordPage')">+</button>
|
|
<div class="nav-item" id="navMine" onclick="switchNav('mine')">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="8" r="4"/><path d="M4 20c0-4 4-7 8-7s8 3 8 7"/></svg>
|
|
<span>我的</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 记录页 -->
|
|
<div id="recordPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage')">←</button>
|
|
<h2>记一笔</h2>
|
|
</div>
|
|
<div class="type-switch">
|
|
<button class="type-btn active" onclick="switchRecordType('income')">收入</button>
|
|
<button class="type-btn" onclick="switchRecordType('expense')">支出</button>
|
|
</div>
|
|
<div id="incomeCats" class="category-list">
|
|
<div class="category-item active" onclick="selectCategory(this, '接单')">接单</div>
|
|
<div class="category-item" onclick="selectCategory(this, '派单')">派单</div>
|
|
<div class="category-item" onclick="selectCategory(this, '红包收入')">红包</div>
|
|
<div class="category-item" onclick="selectCategory(this, '奶茶')">奶茶</div>
|
|
</div>
|
|
<div id="expenseCats" class="category-list" style="display:none;">
|
|
<div class="category-item active" onclick="selectCategory(this, '红包支出')">红包</div>
|
|
<div class="category-item" onclick="selectCategory(this, '比心')">比心</div>
|
|
<div class="category-item" onclick="selectCategory(this, '其他支出')">其他</div>
|
|
</div>
|
|
|
|
<div class="record-form" id="recordForm">
|
|
<!-- 动态表单内容 -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 排行详情页 -->
|
|
<div id="rankingPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage')">←</button>
|
|
<h2>老板贡献榜</h2>
|
|
</div>
|
|
<div class="ranking-filters">
|
|
<div class="filter-row">
|
|
<div class="form-group">
|
|
<label>开始日期</label>
|
|
<input type="date" id="rankStartDate">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>结束日期</label>
|
|
<input type="date" id="rankEndDate">
|
|
</div>
|
|
</div>
|
|
<div class="filter-row">
|
|
<div class="sort-switch">
|
|
<button class="sort-btn active" data-sort="total_income" onclick="switchSort(this)">收入总数</button>
|
|
<button class="sort-btn" data-sort="take_count" onclick="switchSort(this)">接单数</button>
|
|
<button class="sort-btn" data-sort="dispatch_count" onclick="switchSort(this)">派单数</button>
|
|
</div>
|
|
</div>
|
|
<button class="submit-btn" onclick="loadRankingDetail()">查询</button>
|
|
</div>
|
|
<div id="rankingDetailList" class="ranking-detail-list"></div>
|
|
</div>
|
|
|
|
<!-- 接单列表页 -->
|
|
<div id="orderListPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage')">←</button>
|
|
<h2 id="orderListTitle">接单列表</h2>
|
|
</div>
|
|
<div id="orderList" class="order-list"></div>
|
|
<div id="orderLoading" class="order-loading" style="display:none;">加载中...</div>
|
|
</div>
|
|
|
|
<!-- 派单列表页 -->
|
|
<div id="dispatchListPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage')">←</button>
|
|
<h2 id="dispatchListTitle">派单列表</h2>
|
|
</div>
|
|
<div id="dispatchList" class="order-list"></div>
|
|
<div id="dispatchLoading" class="order-loading" style="display:none;">加载中...</div>
|
|
</div>
|
|
|
|
<!-- 陪玩派单榜详情页 -->
|
|
<div id="partnerRankingPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage')">←</button>
|
|
<h2>陪玩派单榜</h2>
|
|
</div>
|
|
<div class="ranking-filters">
|
|
<div class="filter-row">
|
|
<div class="form-group">
|
|
<label>开始日期</label>
|
|
<input type="date" id="partnerRankStartDate">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>结束日期</label>
|
|
<input type="date" id="partnerRankEndDate">
|
|
</div>
|
|
</div>
|
|
<button class="submit-btn" onclick="loadPartnerRankingDetail()">查询</button>
|
|
</div>
|
|
<div id="partnerRankingSummary" class="stat-summary" style="margin: 12px 16px;">
|
|
<div class="item">
|
|
<div class="val" id="partnerTotalDispatchCount">0</div>
|
|
<div class="label">派单总数</div>
|
|
</div>
|
|
<div class="item">
|
|
<div class="val green" id="totalPartnerIncome">0.00</div>
|
|
<div class="label">陪玩总收入</div>
|
|
</div>
|
|
<div class="item">
|
|
<div class="val orange" id="totalRebateIncome">0.00</div>
|
|
<div class="label">返点总收入</div>
|
|
</div>
|
|
<div class="item">
|
|
<div class="val purple" id="totalMilkTeaIncome">0.00</div>
|
|
<div class="label">奶茶收入</div>
|
|
</div>
|
|
</div>
|
|
<div id="partnerRankingDetailList" class="ranking-detail-list" style="margin-top: 12px;"></div>
|
|
</div>
|
|
|
|
<!-- 总接单排行页 -->
|
|
<div id="takeRankingPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage');switchNav('mine')">←</button>
|
|
<h2>总接单数排行</h2>
|
|
</div>
|
|
<div id="takeRankingSummary" class="stat-summary"></div>
|
|
<div id="takeRankingChart" class="horizontal-chart"></div>
|
|
</div>
|
|
|
|
<!-- 总派单排行页 -->
|
|
<div id="dispatchRankingPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage');switchNav('mine')">←</button>
|
|
<h2>总派单数排行</h2>
|
|
</div>
|
|
<div id="dispatchRankingSummary" class="stat-summary"></div>
|
|
<div id="dispatchRankingChart" class="horizontal-chart"></div>
|
|
</div>
|
|
|
|
<!-- 老板交易详情页 -->
|
|
<div id="bossDetailPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="bossDetailGoBack()">←</button>
|
|
<h2 id="bossDetailTitle">交易记录</h2>
|
|
</div>
|
|
<div class="daily-summary" id="bossDetailSummary"></div>
|
|
<div id="bossDetailList" class="order-list"></div>
|
|
</div>
|
|
|
|
<!-- 陪玩交易详情页 -->
|
|
<div id="partnerDetailPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="partnerDetailGoBack()">←</button>
|
|
<h2 id="partnerDetailTitle">交易记录</h2>
|
|
</div>
|
|
<div class="daily-summary" id="partnerDetailSummary"></div>
|
|
<div id="partnerDetailList" class="order-list"></div>
|
|
</div>
|
|
|
|
<!-- 红包及其他收入列表页 -->
|
|
<div id="monthlyIncomeDetailPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage')">←</button>
|
|
<h2 id="monthlyIncomeTitle">月收入详情</h2>
|
|
</div>
|
|
<div class="daily-nav">
|
|
<button class="daily-nav-btn" onclick="switchMonthlyDetail('income', -1)">← 上一月</button>
|
|
<span class="daily-nav-date" id="monthlyIncomeNav"></span>
|
|
<button class="daily-nav-btn" onclick="switchMonthlyDetail('income', 1)">下一月 →</button>
|
|
</div>
|
|
<div class="daily-summary" id="monthlyIncomeSummary"></div>
|
|
<div id="monthlyIncomeList" class="order-list"></div>
|
|
</div>
|
|
|
|
<!-- 月支出详情页 -->
|
|
<div id="monthlyExpenseDetailPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage')">←</button>
|
|
<h2 id="monthlyExpenseTitle">月支出详情</h2>
|
|
</div>
|
|
<div class="daily-nav">
|
|
<button class="daily-nav-btn" onclick="switchMonthlyDetail('expense', -1)">← 上一月</button>
|
|
<span class="daily-nav-date" id="monthlyExpenseNav"></span>
|
|
<button class="daily-nav-btn" onclick="switchMonthlyDetail('expense', 1)">下一月 →</button>
|
|
</div>
|
|
<div class="daily-summary" id="monthlyExpenseSummary"></div>
|
|
<div id="monthlyExpenseList" class="order-list"></div>
|
|
</div>
|
|
|
|
<!-- 年度净收入页面 -->
|
|
<div id="yearlyNetIncomePage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage')">←</button>
|
|
<h2>年度净收入</h2>
|
|
</div>
|
|
<div class="daily-summary" id="yearlyNetIncomeSummary"></div>
|
|
<div id="yearlyNetIncomeList" class="order-list"></div>
|
|
</div>
|
|
|
|
<!-- 红包收入列表页 -->
|
|
<div id="redEnvelopeListPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage')">←</button>
|
|
<h2>红包收入</h2>
|
|
</div>
|
|
<div id="redEnvelopeList" class="order-list"></div>
|
|
<div id="redEnvelopeLoading" class="order-loading" style="display:none;">加载中...</div>
|
|
</div>
|
|
|
|
<!-- 奶茶收入列表页 -->
|
|
<div id="milkTeaListPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage')">←</button>
|
|
<h2>奶茶收入</h2>
|
|
</div>
|
|
<div id="milkTeaList" class="order-list"></div>
|
|
<div id="milkTeaLoading" class="order-loading" style="display:none;">加载中...</div>
|
|
</div>
|
|
|
|
<!-- 红包及其他收入列表页 -->
|
|
<div id="otherIncomeListPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage')">←</button>
|
|
<h2 id="otherIncomeListTitle">红包及其他收入</h2>
|
|
</div>
|
|
<div id="otherIncomeList" class="order-list"></div>
|
|
<div id="otherIncomeLoading" class="order-loading" style="display:none;">加载中...</div>
|
|
</div>
|
|
|
|
<!-- 日收入详情页 -->
|
|
<div id="dailyDetailPage" class="page">
|
|
<div class="page-header">
|
|
<button class="back" onclick="showPage('homePage')">←</button>
|
|
<h2 id="dailyDetailTitle">当日收入</h2>
|
|
</div>
|
|
<div class="daily-nav">
|
|
<button class="daily-nav-btn" onclick="switchDailyDate(-1)">← 前一天</button>
|
|
<span class="daily-nav-date" id="dailyNavDate"></span>
|
|
<button class="daily-nav-btn" onclick="switchDailyDate(1)">后一天 →</button>
|
|
</div>
|
|
<div class="daily-summary" id="dailySummary"></div>
|
|
<div id="dailyDetailList" class="order-list"></div>
|
|
</div>
|
|
|
|
<!-- 编辑弹窗 -->
|
|
<div class="modal-overlay" id="editModal">
|
|
<div class="modal-box">
|
|
<h3 id="editModalTitle">编辑记录</h3>
|
|
<input type="hidden" id="editId">
|
|
<input type="hidden" id="editCategory">
|
|
<div id="editFormBody"></div>
|
|
<div class="modal-actions">
|
|
<button class="btn-cancel" onclick="closeEditModal()">取消</button>
|
|
<button class="btn-delete" onclick="deleteEditRecord()">删除</button>
|
|
<button class="btn-save" onclick="saveEditRecord()">保存</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 月份选择器 -->
|
|
<div class="month-picker-overlay" id="monthPickerOverlay">
|
|
<div class="month-picker">
|
|
<div class="month-picker-header">
|
|
<button onclick="changePickerYear(-1)">←</button>
|
|
<span id="pickerYearDisplay">2026</span>
|
|
<button onclick="changePickerYear(1)">→</button>
|
|
</div>
|
|
<div class="month-picker-grid" id="pickerMonthGrid"></div>
|
|
<div class="month-picker-actions">
|
|
<button class="btn-cancel" onclick="closeMonthPicker()">取消</button>
|
|
<button class="btn-confirm" onclick="confirmMonth()">确定</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 导出格式选择弹窗 -->
|
|
<div class="modal-overlay" id="exportModal">
|
|
<div class="modal-box" style="text-align:center">
|
|
<h3>选择导出格式</h3>
|
|
<p style="color:#999;font-size:14px;margin-bottom:20px">导出所有记录数据</p>
|
|
<div style="display:flex;flex-direction:column;gap:12px">
|
|
<button class="submit-btn" onclick="doExport('json')">导出 JSON</button>
|
|
<button class="submit-btn" onclick="doExport('csv')">导出 CSV</button>
|
|
<button class="btn-cancel" style="padding:14px;border-radius:10px;font-size:15px;border:none;cursor:pointer" onclick="closeExportModal()">取消</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 导入确认弹窗 -->
|
|
<div class="modal-overlay" id="importConfirmModal">
|
|
<div class="modal-box" style="text-align:center">
|
|
<h3>确认导入</h3>
|
|
<p id="importConfirmMsg" style="color:#666;font-size:14px;margin-bottom:20px;white-space:pre-line"></p>
|
|
<div class="modal-actions">
|
|
<button class="btn-cancel" onclick="closeImportConfirm()">取消</button>
|
|
<button class="btn-save" onclick="confirmImport()">确认导入</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="toast" id="toast"></div>
|
|
|
|
<script src="js/app.js?v=20260224"></script>
|
|
<script src="js/auth.js"></script>
|
|
<script src="js/autocomplete.js"></script>
|
|
<script src="js/month-picker.js"></script>
|
|
<script src="js/stats.js?v=2026022401"></script>
|
|
<script src="js/ranking.js"></script>
|
|
<script src="js/order-list.js"></script>
|
|
<script src="js/edit-modal.js"></script>
|
|
<script src="js/record-form.js"></script>
|
|
<script src="js/import-export.js"></script>
|
|
</body>
|
|
</html>
|