144 lines
7.5 KiB
HTML
144 lines
7.5 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Dashboard - QBO Excel Sync{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="dashboard">
|
|
<div class="page-header">
|
|
<h2>Dashboard</h2>
|
|
<p>Welcome to QBO Excel Sync. Import your Excel data to QuickBooks Online with ease.</p>
|
|
</div>
|
|
|
|
<!-- Quick Stats -->
|
|
<div class="stats-grid">
|
|
<div class="stat-card {% if is_connected %}connected{% else %}disconnected{% endif %}">
|
|
<div class="stat-icon">
|
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/>
|
|
<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/>
|
|
</svg>
|
|
</div>
|
|
<div class="stat-content">
|
|
<h3>Connection Status</h3>
|
|
<p class="stat-value">{% if is_connected %}Connected{% else %}Not Connected{% endif %}</p>
|
|
{% if is_connected and company_name %}
|
|
<p class="stat-detail">{{ company_name }}</p>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="stat-card">
|
|
<div class="stat-icon">
|
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z"/>
|
|
<polyline points="14 2 14 8 20 8"/>
|
|
<line x1="16" y1="13" x2="8" y2="13"/>
|
|
<line x1="16" y1="17" x2="8" y2="17"/>
|
|
<line x1="10" y1="9" x2="8" y2="9"/>
|
|
</svg>
|
|
</div>
|
|
<div class="stat-content">
|
|
<h3>Environment</h3>
|
|
<p class="stat-value">{{ environment|title }}</p>
|
|
<p class="stat-detail">{% if environment == 'sandbox' %}Test mode{% else %}Live data{% endif %}</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="stat-card">
|
|
<div class="stat-icon">
|
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<rect x="3" y="3" width="7" height="7"/>
|
|
<rect x="14" y="3" width="7" height="7"/>
|
|
<rect x="14" y="14" width="7" height="7"/>
|
|
<rect x="3" y="14" width="7" height="7"/>
|
|
</svg>
|
|
</div>
|
|
<div class="stat-content">
|
|
<h3>Supported Types</h3>
|
|
<p class="stat-value">6 Types</p>
|
|
<p class="stat-detail">Checks, Invoices, Bills, & more</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Quick Actions -->
|
|
<section class="section">
|
|
<h3 class="section-title">Quick Actions</h3>
|
|
<div class="action-grid">
|
|
{% if not is_connected %}
|
|
<a href="{{ url_for('connection') }}" class="action-card primary">
|
|
<div class="action-icon">
|
|
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/>
|
|
<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/>
|
|
</svg>
|
|
</div>
|
|
<div class="action-content">
|
|
<h4>Connect to QuickBooks</h4>
|
|
<p>Set up your QuickBooks Online connection to start importing data.</p>
|
|
</div>
|
|
<svg class="action-arrow" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<line x1="5" y1="12" x2="19" y2="12"/>
|
|
<polyline points="12 5 19 12 12 19"/>
|
|
</svg>
|
|
</a>
|
|
{% else %}
|
|
<a href="{{ url_for('import_page') }}" class="action-card primary">
|
|
<div class="action-icon">
|
|
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/>
|
|
<polyline points="17 8 12 3 7 8"/>
|
|
<line x1="12" y1="3" x2="12" y2="15"/>
|
|
</svg>
|
|
</div>
|
|
<div class="action-content">
|
|
<h4>Import Excel File</h4>
|
|
<p>Upload and import an Excel file to QuickBooks Online.</p>
|
|
</div>
|
|
<svg class="action-arrow" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<line x1="5" y1="12" x2="19" y2="12"/>
|
|
<polyline points="12 5 19 12 12 19"/>
|
|
</svg>
|
|
</a>
|
|
{% endif %}
|
|
|
|
<a href="{{ url_for('templates_page') }}" class="action-card">
|
|
<div class="action-icon">
|
|
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<rect x="3" y="3" width="7" height="7"/>
|
|
<rect x="14" y="3" width="7" height="7"/>
|
|
<rect x="14" y="14" width="7" height="7"/>
|
|
<rect x="3" y="14" width="7" height="7"/>
|
|
</svg>
|
|
</div>
|
|
<div class="action-content">
|
|
<h4>Manage Templates</h4>
|
|
<p>Create and edit field mapping templates for your imports.</p>
|
|
</div>
|
|
<svg class="action-arrow" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<line x1="5" y1="12" x2="19" y2="12"/>
|
|
<polyline points="12 5 19 12 12 19"/>
|
|
</svg>
|
|
</a>
|
|
|
|
<a href="{{ url_for('settings_page') }}" class="action-card">
|
|
<div class="action-icon">
|
|
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<circle cx="12" cy="12" r="3"/>
|
|
<path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"/>
|
|
</svg>
|
|
</div>
|
|
<div class="action-content">
|
|
<h4>Configure Settings</h4>
|
|
<p>Customize import behavior, date formats, and more.</p>
|
|
</div>
|
|
<svg class="action-arrow" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<line x1="5" y1="12" x2="19" y2="12"/>
|
|
<polyline points="12 5 19 12 12 19"/>
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
{% endblock %}
|