سیستم حسابداری - Vue.js + Vuetify + Symfony

این پروژه یک سیستم حسابداری کامل است که از Vue.js 3، Vuetify 3 و Symfony 7 استفاده می‌کند.

🏗️ ساختار پروژه

/var/www/v2.hesabix.ir/
├── core/                    # Symfony backend
├── frontend/               # Vue.js + Vuetify frontend
│   ├── src/
│   │   ├── components/     # کامپوننت‌های Vue
│   │   ├── views/          # صفحات اصلی
│   │   ├── router/         # Vue Router
│   │   ├── store/          # Vuex store
│   │   └── assets/         # فایل‌های استاتیک
│   ├── public/
│   ├── package.json
│   └── webpack.config.js
├── public_html/            # فایل‌های build شده
└── vendor/                 # PHP dependencies

🚀 نصب و راه‌اندازی

پیش‌نیازها

• PHP 8.2+
• Node.js 18+
• Composer
• npm

Backend (Symfony)

cd core
composer install

Frontend (Vue.js)

cd frontend
npm install

🔧 دستورات توسعه

Development

cd frontend
npm run dev          # Build development
npm run watch        # Build + watch changes

Production

cd frontend
npm run build        # Build production

📱 ویژگی‌ها

کامپوننت‌های اصلی

• Dashboard: نمایش خلاصه مالی
• Accounts: مدیریت حساب‌ها
• Transactions: مدیریت تراکنش‌ها
• Reports: گزارشات مالی
• Settings: تنظیمات سیستم

تکنولوژی‌ها

• Vue 3: Composition API
• Vuetify 3: Material Design components
• Vue Router 4: Client-side routing
• Vuex 4: State management
• Webpack Encore: Asset compilation

🌐 روتینگ

Vue Router (Frontend)

• / - Dashboard
• /accounts - مدیریت حساب‌ها
• /transactions - مدیریت تراکنش‌ها
• /reports - گزارشات
• /settings - تنظیمات

Symfony Routes (Backend)

• /api/* - API endpoints

🎨 UI/UX Features

• RTL Support: پشتیبانی کامل از راست به چپ
• Persian Font: فونت Vazirmatn
• Material Design: کامپوننت‌های زیبا
• Responsive: سازگار با همه دستگاه‌ها
• Dark/Light Theme: تم‌های مختلف

📊 کامپوننت‌های Vuetify

• Data Tables: نمایش داده‌ها
• Cards: کارت‌های اطلاعاتی
• Forms: فرم‌های ورودی
• Navigation: منوهای کاربری
• Charts: نمودارها (آینده)
• Dialogs: پنجره‌های تعاملی

🔄 Build Process

1. Development: npm run dev
2. Watch Mode: npm run watch
3. Production: npm run build

فایل‌های build شده در public_html/build/ قرار می‌گیرند.

🚀 Deployment

Development Server

cd frontend
npm run dev-server

Production Build

cd frontend
npm run build

📝 نکات مهم

• فایل‌های frontend در پوشه جداگانه قرار دارند
• Build process کاملاً مستقل است
• Symfony به عنوان API backend عمل می‌کند
• Vue Router برای client-side routing استفاده می‌شود
• فونت فارسی Vazirmatn برای RTL استفاده شده

🐛 عیب‌یابی

مشکلات رایج

1. Node modules: rm -rf node_modules && npm install
2. Build errors: بررسی webpack.config.js
3. Routing issues: بررسی .htaccess

Logs

• Symfony: core/var/log/
• Webpack: frontend/ console

📞 پشتیبانی

برای سوالات و مشکلات:

• بررسی documentation
• بررسی console errors
• بررسی network tab