@illuminateeducation/dna-atd-frontend 1.0.1-DNAATD-2189.0 → 1.0.5

package/src/router/index.js

@@ -1,57 +0,0 @@
-import { createRouter, createWebHistory } from 'vue-router'
-
-const router = createRouter({
-  history: createWebHistory(import.meta.env.BASE_URL),
-  routes: [
-    {
-      path: '/',
-      name: 'home',
-      component: () => import('../views/HomeView.vue')
-    },
-    {
-      path: '/admin',
-      name: 'admin',
-      component: () => import('../layouts/AdminLayout.vue'),
-      redirect: '/admin/validation',
-      children: [
-        {
-          path: 'validation',
-          name: 'admin-validation',
-          component: () => import('../features/admin/validation/views/ValidationView.vue'),
-          meta: {
-            title: 'Validation Management'
-          }
-        },
-        {
-          path: 'customization',
-          name: 'admin-customization',
-          component: () => import('../features/admin/customization/views/CustomizationView.vue'),
-          meta: {
-            title: 'UI Customization'
-          }
-        }
-      ],
-      meta: {
-        requiresAuth: true
-      }
-    },
-    {
-      path: '/:pathMatch(.*)*',
-      name: 'not-found',
-      component: () => import('../views/NotFoundView.vue')
-    }
-  ]
-})
-
-// Navigation guard for authentication
-router.beforeEach((to, from, next) => {
-  if (to.meta.requiresAuth) {
-    // Add your authentication logic here
-    // For now, we'll just allow access
-    next()
-  } else {
-    next()
-  }
-})
-
-export default router

package/src/services/apiService.js

@@ -1,72 +0,0 @@
-/**
- * API Service
- * Centralized API calls using fetch
- */
-
-const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || 'http://localhost:3000/api'
-
-class ApiService {
-  constructor(baseURL = API_BASE_URL) {
-    this.baseURL = baseURL
-  }
-
-  async request(endpoint, options = {}) {
-    const url = `${this.baseURL}${endpoint}`
-    const config = {
-      headers: {
-        'Content-Type': 'application/json',
-        ...options.headers
-      },
-      ...options
-    }
-
-    try {
-      const response = await fetch(url, config)
-      
-      if (!response.ok) {
-        throw new Error(`HTTP error! status: ${response.status}`)
-      }
-      
-      return await response.json()
-    } catch (error) {
-      console.error('API request failed:', error)
-      throw error
-    }
-  }
-
-  get(endpoint, options = {}) {
-    return this.request(endpoint, { method: 'GET', ...options })
-  }
-
-  post(endpoint, data, options = {}) {
-    return this.request(endpoint, {
-      method: 'POST',
-      body: JSON.stringify(data),
-      ...options
-    })
-  }
-
-  put(endpoint, data, options = {}) {
-    return this.request(endpoint, {
-      method: 'PUT',
-      body: JSON.stringify(data),
-      ...options
-    })
-  }
-
-  patch(endpoint, data, options = {}) {
-    return this.request(endpoint, {
-      method: 'PATCH',
-      body: JSON.stringify(data),
-      ...options
-    })
-  }
-
-  delete(endpoint, options = {}) {
-    return this.request(endpoint, { method: 'DELETE', ...options })
-  }
-}
-
-export const apiService = new ApiService()
-export default apiService
-

package/src/services/integration.js

@@ -1,59 +0,0 @@
-/**
- * Integration Service
- * Handles communication between Vue app and backend
- */
-
-export class Integration {
-  constructor() {
-    this.config = this.getConfig()
-    this.user = this.getUser()
-  }
-
-  /**
-   * Get configuration from backend
-   */
-  getConfig() {
-    const appElement = document.getElementById('app')
-    const configData = appElement?.getAttribute('data-config')
-    return configData ? JSON.parse(configData) : {}
-  }
-
-  /**
-   * Get user data from backend
-   */
-  getUser() {
-    const appElement = document.getElementById('app')
-    const userData = appElement?.getAttribute('data-user')
-    return userData ? JSON.parse(userData) : {}
-  }
-
-  /**
-   * Get any custom data attribute
-   */
-  getData(attribute) {
-    const appElement = document.getElementById('app')
-    const data = appElement?.getAttribute(`data-${attribute}`)
-    return data ? JSON.parse(data) : null
-  }
-
-  /**
-   * Emit event to backend (via window for backend to listen)
-   */
-  emitToBackend(eventName, data) {
-    window.dispatchEvent(new CustomEvent(`vue:${eventName}`, { detail: data }))
-  }
-
-  /**
-   * Listen for backend events
-   */
-  listenFromBackend(eventName, callback) {
-    window.addEventListener(`backend:${eventName}`, (event) => {
-      callback(event.detail)
-    })
-  }
-}
-
-// Singleton instance
-export const integration = new Integration()
-export default integration
-

package/src/services/phpIntegration.js

@@ -1 +0,0 @@
-

package/src/stores/counter.js

@@ -1,12 +0,0 @@
-import { ref, computed } from 'vue'
-import { defineStore } from 'pinia'
-
-export const useCounterStore = defineStore('counter', () => {
-  const count = ref(0)
-  const doubleCount = computed(() => count.value * 2)
-  function increment() {
-    count.value++
-  }
-
-  return { count, doubleCount, increment }
-})

package/src/utils/helpers.js

@@ -1,119 +0,0 @@
-/**
- * Utility functions for common operations
- */
-
-/**
- * Debounce function to limit rate of function execution
- * @param {Function} func - Function to debounce
- * @param {number} wait - Delay in milliseconds
- * @returns {Function}
- */
-export function debounce(func, wait = 300) {
-  let timeout
-  return function executedFunction(...args) {
-    const later = () => {
-      clearTimeout(timeout)
-      func(...args)
-    }
-    clearTimeout(timeout)
-    timeout = setTimeout(later, wait)
-  }
-}
-
-/**
- * Throttle function to limit function execution frequency
- * @param {Function} func - Function to throttle
- * @param {number} limit - Time limit in milliseconds
- * @returns {Function}
- */
-export function throttle(func, limit = 300) {
-  let inThrottle
-  return function executedFunction(...args) {
-    if (!inThrottle) {
-      func.apply(this, args)
-      inThrottle = true
-      setTimeout(() => (inThrottle = false), limit)
-    }
-  }
-}
-
-/**
- * Deep clone an object
- * @param {*} obj - Object to clone
- * @returns {*}
- */
-export function deepClone(obj) {
-  if (obj === null || typeof obj !== 'object') return obj
-  if (obj instanceof Date) return new Date(obj.getTime())
-  if (obj instanceof Array) return obj.map(item => deepClone(item))
-  
-  const clonedObj = {}
-  for (const key in obj) {
-    if (obj.hasOwnProperty(key)) {
-      clonedObj[key] = deepClone(obj[key])
-    }
-  }
-  return clonedObj
-}
-
-/**
- * Format date to readable string
- * @param {Date|string} date - Date to format
- * @param {string} format - Format type ('short', 'long', 'time')
- * @returns {string}
- */
-export function formatDate(date, format = 'short') {
-  const d = new Date(date)
-  
-  const options = {
-    short: { year: 'numeric', month: 'short', day: 'numeric' },
-    long: { year: 'numeric', month: 'long', day: 'numeric', hour: '2-digit', minute: '2-digit' },
-    time: { hour: '2-digit', minute: '2-digit', second: '2-digit' }
-  }
-  
-  return d.toLocaleDateString('en-US', options[format] || options.short)
-}
-
-/**
- * Generate unique ID
- * @returns {string}
- */
-export function generateId() {
-  return `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`
-}
-
-/**
- * Capitalize first letter of string
- * @param {string} str - String to capitalize
- * @returns {string}
- */
-export function capitalize(str) {
-  if (!str) return ''
-  return str.charAt(0).toUpperCase() + str.slice(1).toLowerCase()
-}
-
-/**
- * Truncate string to specified length
- * @param {string} str - String to truncate
- * @param {number} length - Max length
- * @param {string} suffix - Suffix to add
- * @returns {string}
- */
-export function truncate(str, length = 50, suffix = '...') {
-  if (!str || str.length <= length) return str
-  return str.substring(0, length).trim() + suffix
-}
-
-/**
- * Check if value is empty (null, undefined, empty string, empty array, empty object)
- * @param {*} value - Value to check
- * @returns {boolean}
- */
-export function isEmpty(value) {
-  if (value === null || value === undefined) return true
-  if (typeof value === 'string' && value.trim() === '') return true
-  if (Array.isArray(value) && value.length === 0) return true
-  if (typeof value === 'object' && Object.keys(value).length === 0) return true
-  return false
-}
-

package/src/utils/validators.js

@@ -1,131 +0,0 @@
-/**
- * Validation utility functions
- */
-
-/**
- * Validate email format
- * @param {string} email - Email to validate
- * @returns {boolean}
- */
-export function isValidEmail(email) {
-  const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/
-  return emailRegex.test(email)
-}
-
-/**
- * Validate phone number
- * @param {string} phone - Phone number to validate
- * @returns {boolean}
- */
-export function isValidPhone(phone) {
-  const phoneRegex = /^\d{10}$/
-  return phoneRegex.test(phone.replace(/[\s-()]/g, ''))
-}
-
-/**
- * Validate URL format
- * @param {string} url - URL to validate
- * @returns {boolean}
- */
-export function isValidUrl(url) {
-  try {
-    new URL(url)
-    return true
-  } catch {
-    return false
-  }
-}
-
-/**
- * Validate password strength
- * @param {string} password - Password to validate
- * @returns {Object} - { isValid: boolean, strength: string, message: string }
- */
-export function validatePassword(password) {
-  const minLength = 8
-  const hasUpperCase = /[A-Z]/.test(password)
-  const hasLowerCase = /[a-z]/.test(password)
-  const hasNumbers = /\d/.test(password)
-  const hasSpecialChar = /[!@#$%^&*(),.?":{}|<>]/.test(password)
-
-  if (password.length < minLength) {
-    return { isValid: false, strength: 'weak', message: `Password must be at least ${minLength} characters` }
-  }
-
-  let strength = 'weak'
-  let strengthScore = 0
-
-  if (hasUpperCase) strengthScore++
-  if (hasLowerCase) strengthScore++
-  if (hasNumbers) strengthScore++
-  if (hasSpecialChar) strengthScore++
-
-  if (strengthScore === 4) {
-    strength = 'strong'
-  } else if (strengthScore >= 2) {
-    strength = 'medium'
-  }
-
-  return {
-    isValid: true,
-    strength,
-    message: `Password strength: ${strength}`,
-    hasUpperCase,
-    hasLowerCase,
-    hasNumbers,
-    hasSpecialChar
-  }
-}
-
-/**
- * Validate required field
- * @param {*} value - Value to validate
- * @returns {boolean}
- */
-export function isRequired(value) {
-  if (value === null || value === undefined) return false
-  if (typeof value === 'string' && value.trim() === '') return false
-  if (Array.isArray(value) && value.length === 0) return false
-  return true
-}
-
-/**
- * Validate min length
- * @param {string} value - Value to validate
- * @param {number} min - Minimum length
- * @returns {boolean}
- */
-export function minLength(value, min) {
-  return value && value.length >= min
-}
-
-/**
- * Validate max length
- * @param {string} value - Value to validate
- * @param {number} max - Maximum length
- * @returns {boolean}
- */
-export function maxLength(value, max) {
-  return value && value.length <= max
-}
-
-/**
- * Validate numeric value
- * @param {*} value - Value to validate
- * @returns {boolean}
- */
-export function isNumeric(value) {
-  return !isNaN(parseFloat(value)) && isFinite(value)
-}
-
-/**
- * Validate value is within range
- * @param {number} value - Value to validate
- * @param {number} min - Minimum value
- * @param {number} max - Maximum value
- * @returns {boolean}
- */
-export function inRange(value, min, max) {
-  return value >= min && value <= max
-}
-

package/src/views/HomeView.vue

@@ -1,121 +0,0 @@
-<template>
-  <div class="home-view">
-    <div class="hero">
-      <h1>Welcome to DNA ATD Frontend</h1>
-      <p>A modern Vue 3 application with feature-based architecture</p>
-      <div class="cta-buttons">
-        <router-link to="/admin" class="btn btn-primary">
-          Go to Admin Panel
-        </router-link>
-      </div>
-    </div>
-
-    <div class="features">
-      <div class="feature-card">
-        <div class="feature-icon">✓</div>
-        <h3>Validation Management</h3>
-        <p>Manage and configure validation rules for your application</p>
-      </div>
-      <div class="feature-card">
-        <div class="feature-icon">🎨</div>
-        <h3>UI Customization</h3>
-        <p>Customize themes, colors, and layout settings</p>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-// Home view component
-</script>
-
-<style scoped>
-.home-view {
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-  color: white;
-  padding: 2rem;
-}
-
-.hero {
-  text-align: center;
-  margin-bottom: 4rem;
-}
-
-.hero h1 {
-  font-size: 3rem;
-  margin-bottom: 1rem;
-}
-
-.hero p {
-  font-size: 1.5rem;
-  margin-bottom: 2rem;
-  opacity: 0.9;
-}
-
-.cta-buttons {
-  display: flex;
-  gap: 1rem;
-  justify-content: center;
-}
-
-.btn {
-  padding: 1rem 2rem;
-  border-radius: 8px;
-  text-decoration: none;
-  font-weight: 600;
-  transition: all 0.3s;
-  display: inline-block;
-}
-
-.btn-primary {
-  background-color: white;
-  color: #667eea;
-}
-
-.btn-primary:hover {
-  transform: translateY(-2px);
-  box-shadow: 0 8px 16px rgba(0,0,0,0.2);
-}
-
-.features {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
-  gap: 2rem;
-  max-width: 1200px;
-  width: 100%;
-}
-
-.feature-card {
-  background: rgba(255,255,255,0.1);
-  backdrop-filter: blur(10px);
-  padding: 2rem;
-  border-radius: 12px;
-  text-align: center;
-  transition: all 0.3s;
-}
-
-.feature-card:hover {
-  transform: translateY(-5px);
-  background: rgba(255,255,255,0.15);
-}
-
-.feature-icon {
-  font-size: 3rem;
-  margin-bottom: 1rem;
-}
-
-.feature-card h3 {
-  font-size: 1.5rem;
-  margin-bottom: 1rem;
-}
-
-.feature-card p {
-  opacity: 0.9;
-}
-</style>
-

package/src/views/NotFoundView.vue

@@ -1,56 +0,0 @@
-<template>
-  <div class="not-found">
-    <h1>404</h1>
-    <h2>Page Not Found</h2>
-    <p>The page you're looking for doesn't exist.</p>
-    <router-link to="/" class="btn">Go Home</router-link>
-  </div>
-</template>
-
-<script setup>
-// 404 Not Found view
-</script>
-
-<style scoped>
-.not-found {
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  text-align: center;
-  padding: 2rem;
-}
-
-.not-found h1 {
-  font-size: 6rem;
-  margin: 0;
-  color: #3498db;
-}
-
-.not-found h2 {
-  font-size: 2rem;
-  margin: 1rem 0;
-  color: #2c3e50;
-}
-
-.not-found p {
-  font-size: 1.2rem;
-  color: #7f8c8d;
-  margin-bottom: 2rem;
-}
-
-.btn {
-  background-color: #3498db;
-  color: white;
-  padding: 1rem 2rem;
-  border-radius: 4px;
-  text-decoration: none;
-  transition: all 0.3s;
-}
-
-.btn:hover {
-  background-color: #2980b9;
-}
-</style>
-