Compare commits

...

11 Commits

Author SHA1 Message Date
sean d26db06f74 all data hide
NPM Installation / build (16.x, ubuntu-latest) (push) Has been cancelled
NPM Installation / build (16.x, windows-latest) (push) Has been cancelled
NPM Installation / build (17.x, ubuntu-latest) (push) Has been cancelled
NPM Installation / build (17.x, windows-latest) (push) Has been cancelled
NPM Installation / build (18.x, ubuntu-latest) (push) Has been cancelled
NPM Installation / build (18.x, windows-latest) (push) Has been cancelled
2026-06-25 09:44:52 +07:00
sean 2f289fb09e update Ticket
NPM Installation / build (16.x, ubuntu-latest) (push) Has been cancelled
NPM Installation / build (16.x, windows-latest) (push) Has been cancelled
NPM Installation / build (17.x, ubuntu-latest) (push) Has been cancelled
NPM Installation / build (17.x, windows-latest) (push) Has been cancelled
NPM Installation / build (18.x, ubuntu-latest) (push) Has been cancelled
NPM Installation / build (18.x, windows-latest) (push) Has been cancelled
2026-06-25 09:36:23 +07:00
sean a06d0badfc UI 2026-06-24 14:52:49 +07:00
mrholek 974ba0e3c3 refactor: updade examples style 2026-04-01 17:08:15 +02:00
mrholek 8e07f38df5 release: v5.5.0 2026-04-01 10:55:19 +02:00
mrholek e016f18ce6 update list of components 2026-04-01 10:50:54 +02:00
mrholek 0808fec88b update current year 2026-04-01 10:49:34 +02:00
mrholek 7e6a087049 docs: add AI-friendly documentation and code comments
Add comprehensive documentation for AI assistants:
- .cursorrules with project context and conventions
- ARCHITECTURE.md with technical details
- DEVELOPMENT.md with practical guides
- JSDoc comments in all JavaScript modules
- Update README.md with AI-Friendly Development section

This enables AI tools (Cursor, Claude Code, GitHub Copilot) to understand the project and generate code following CoreUI Vue patterns.
2026-04-01 10:47:02 +02:00
mrholek 970ed3a69c feat(CChip, CChipInput): add new components 2026-04-01 10:29:41 +02:00
mrholek 20c410bcac chore: update documentation banner 2026-04-01 10:29:08 +02:00
mrholek 1bb7b0d737 chore: update dependencies and devDependencies
@coreui/chartjs       ^4.1.0  →    ^4.2.0
@coreui/coreui        ^5.5.0  →    ^5.6.1
@coreui/vue           ^5.7.0  →    ^5.8.0
@vitejs/plugin-vue    ^6.0.3  →    ^6.0.5
autoprefixer        ^10.4.23  →  ^10.4.27
eslint               ^9.39.2  →   ^9.39.4
eslint-plugin-vue    ^10.6.2  →   ^10.8.0
globals              ^16.3.0  →   ^16.5.0
postcss               ^8.5.6  →    ^8.5.8
sass                 ^1.97.0  →   ^1.98.0
vite                  ^7.3.0  →    ^8.0.3
vue                  ^3.5.26  →   ^3.5.31
vue-router            ^4.6.4  →    ^5.0.4
2026-04-01 10:06:07 +02:00
20687 changed files with 1819263 additions and 81 deletions
+349
View File
@@ -0,0 +1,349 @@
# CoreUI Free Vue Admin Template - AI Assistant Rules
You are working with the CoreUI Free Vue Admin Template, a professional admin dashboard built with Vue 3, CoreUI Vue components, and modern build tools. This project uses Vite for development and building, Vue Router for navigation, Pinia for state management, and Sass for styling.
## Critical Rules
**Component Library**: ALWAYS use CoreUI Vue components from https://coreui.io/vue/docs/. NEVER use Tailwind CSS, Vuetify, Element Plus, or other component libraries. This project is built on Bootstrap 5 and CoreUI Vue components exclusively.
**Technology Stack**: This project uses:
- Vue 3.5.x with Composition API and script setup
- Single File Components (SFC) with <template>, <script>, and <style> sections
- CoreUI Vue 5.x and @coreui/coreui 5.x
- Vue Router 5.x for client-side routing
- Pinia 3.x for state management
- Vite 8.x for development server and building
- Sass/SCSS for styling with Bootstrap 5 variables
- Chart.js 4.x with @coreui/vue-chartjs for data visualization
## Code Conventions
**Vue/JavaScript Standards**:
- Use Composition API with `<script setup>` syntax
- Use ref() and reactive() for reactive state
- Follow Vue 3 Composition API patterns
- Use Prettier formatting: no semicolons, single quotes, 2-space indentation
- Enforce ESLint rules with Vue and Prettier plugins
- Prefer const and arrow functions
- Use destructuring where appropriate
**File Organization**:
- `src/` - All source code
- `components/` - Reusable UI components (AppHeader, AppSidebar, etc.)
- `views/` - Page components organized by feature (dashboard, forms, charts, etc.)
- `layouts/` - Layout wrapper components (DefaultLayout)
- `assets/` - Static assets (images, brand logos)
- `scss/` - Global styles and theme customization
- `router/` - Router configuration
- `stores/` - Pinia stores
- `_nav.js` - Navigation/sidebar menu configuration
- `App.vue` - Main application component
- `main.js` - Application entry point
**Vue/SFC Practices**:
- Use `<script setup>` for components (preferred modern syntax)
- Use `defineProps()` and `defineEmits()` for component API
- Use computed() for derived state
- Use watch() or watchEffect() for side effects
- Keep components focused and single-responsibility
- Extract reusable logic into composables (useX pattern)
- Use Suspense for async components when needed
**CSS/Sass Practices**:
- Import global styles in main.js: `import './scss/style.scss'`
- Use Bootstrap utilities first before custom CSS
- Leverage CoreUI CSS custom properties for theming
- Support dark mode through CoreUI's color mode system
- File: `src/scss/style.scss` - main stylesheet importing CoreUI and Bootstrap
- File: `src/scss/_custom.scss` - custom style overrides
- Use scoped styles in components: `<style scoped>`
- Use SCSS variables from Bootstrap and CoreUI when possible
**Routing Conventions**:
- Use createWebHashHistory for client-side routing (GitHub Pages compatible)
- Define routes in router/index.js as array of objects
- Use dynamic imports for lazy loading route components
- Use exact path matching where needed
- Public routes (login, register, 404, 500) defined separately
- Protected routes handled in DefaultLayout
**State Management**:
- Use Pinia for global state (theme, sidebar visibility)
- Create stores in stores/ directory
- Use defineStore() with setup syntax
- Access stores with const store = useStore()
- Keep component-level state in ref() or reactive() when state is local
**Naming Conventions**:
- PascalCase for component files and component names (AppHeader.vue, DefaultLayout.vue)
- camelCase for variables, functions, and composables (useState, useEffect)
- UPPER_SNAKE_CASE for constants (API_URL, MAX_ITEMS)
- kebab-case for CSS classes (following Bootstrap/CoreUI conventions)
- Descriptive names that indicate purpose (AppHeaderDropdown vs Dropdown)
## Project Structure
```
coreui-free-vue-admin-template/
├── public/ # Static assets served directly
├── src/
│ ├── assets/ # Images, logos, icons
│ │ ├── brand/ # Logo components
│ │ └── images/ # Image files
│ ├── components/ # Reusable UI components
│ │ ├── AppHeader.vue
│ │ ├── AppSidebar.vue
│ │ ├── AppFooter.vue
│ │ ├── AppContent.vue
│ │ ├── AppBreadcrumb.vue
│ │ └── AppHeaderDropdown.vue
│ ├── layouts/ # Layout components
│ │ └── DefaultLayout.vue
│ ├── views/ # Page components
│ │ ├── dashboard/ # Dashboard page
│ │ ├── base/ # Base UI components examples
│ │ ├── buttons/ # Button examples
│ │ ├── forms/ # Form examples
│ │ ├── charts/ # Chart examples
│ │ ├── icons/ # Icon examples
│ │ ├── notifications/ # Notification examples
│ │ ├── widgets/ # Widget examples
│ │ └── pages/ # Auth & error pages
│ ├── router/ # Router configuration
│ │ └── index.js # Route definitions
│ ├── stores/ # Pinia stores
│ ├── scss/ # Stylesheets
│ │ ├── style.scss # Main stylesheet
│ │ └── _custom.scss # Custom overrides
│ ├── App.vue # Main app component
│ ├── main.js # Entry point
│ └── _nav.js # Navigation config
├── index.html # HTML template
├── vite.config.mjs # Vite configuration
├── eslint.config.mjs # ESLint configuration
├── package.json # Dependencies
└── README.md # Documentation
```
## Development Workflow
**Starting Development**:
```bash
npm install # Install dependencies
npm run dev # Start dev server (http://localhost:3000)
npm run build # Build for production
npm run preview # Preview production build
npm run lint # Run ESLint
```
**Adding a New Page**:
1. Create component in `src/views/[feature]/ComponentName.vue`
2. Add route to `src/router/index.js`
3. Add navigation item to `src/_nav.js` (if needed)
4. Import and use CoreUI components from '@coreui/vue'
**Creating Components**:
```vue
<template>
<CCard>
<CCardHeader>{{ title }}</CCardHeader>
<CCardBody>
<slot />
</CCardBody>
</CCard>
</template>
<script setup>
defineProps({
title: {
type: String,
required: true,
},
})
</script>
<style scoped>
/* Component-specific styles */
</style>
```
**Using Composition API**:
```vue
<script setup>
import { ref, computed, watch, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { useStore } from '@/stores/main'
const data = ref([])
const store = useStore()
const router = useRouter()
const filteredData = computed(() => {
return data.value.filter(item => item.active)
})
watch(data, (newValue) => {
console.log('Data changed:', newValue)
})
onMounted(() => {
// Fetch data or run initialization
})
const navigate = () => {
router.push('/dashboard')
}
</script>
```
## Code Quality
**Linting**:
- ESLint configuration in `eslint.config.mjs`
- Prettier integration for code formatting
- Vue-specific rules with eslint-plugin-vue
- Run `npm run lint` before committing
**Best Practices**:
- Always define props with types and validation
- Use meaningful component and variable names
- Keep components small and focused
- Extract complex logic into composables
- Use Vue DevTools for debugging
- Test in both light and dark themes
- Ensure responsive design works on all screen sizes
**Git Commits**:
Follow conventional commit format:
- feat: New feature
- fix: Bug fix
- docs: Documentation changes
- style: Code style changes (formatting)
- refactor: Code refactoring
- test: Adding tests
- chore: Maintenance tasks
## Common Patterns
**Lazy Loading Routes**:
```javascript
const Dashboard = () => import('./views/dashboard/Dashboard.vue')
```
**Composables** (Custom hooks):
```javascript
// composables/useFetch.js
import { ref } from 'vue'
export function useFetch(url) {
const data = ref(null)
const error = ref(null)
const loading = ref(true)
fetch(url)
.then(res => res.json())
.then(json => {
data.value = json
})
.catch(err => {
error.value = err
})
.finally(() => {
loading.value = false
})
return { data, error, loading }
}
```
**Pinia Store**:
```javascript
// stores/main.js
import { defineStore } from 'pinia'
import { ref } from 'vue'
export const useStore = defineStore('main', () => {
const sidebarVisible = ref(true)
const theme = ref('light')
function toggleSidebar() {
sidebarVisible.value = !sidebarVisible.value
}
function setTheme(newTheme) {
theme.value = newTheme
}
return { sidebarVisible, theme, toggleSidebar, setTheme }
})
```
**Navigation Configuration** (`_nav.js`):
```javascript
export default [
{
component: 'CNavItem',
name: 'Dashboard',
to: '/dashboard',
icon: 'cil-speedometer',
},
]
```
## AI Assistant Guidelines
**What AI Should Do**:
- Generate code using CoreUI Vue components
- Follow existing code style and conventions
- Use Composition API with <script setup>
- Implement responsive designs
- Define props with proper validation
- Follow the project's file organization
- Use existing utility functions and helpers
- Suggest performance optimizations when appropriate
**What AI Should NOT Do**:
- Use Options API (use Composition API instead)
- Import components from libraries other than CoreUI/Vue
- Suggest Tailwind CSS or other CSS frameworks
- Ignore ESLint/Prettier rules
- Create files outside the src/ directory structure
- Modify build configuration without clear reason
- Use deprecated Vue patterns
## External Dependencies
**Core Libraries**:
- @coreui/coreui: ^5.6.1 - CoreUI CSS framework
- @coreui/vue: ^5.8.0 - CoreUI Vue components
- @coreui/icons-vue: 2.2.0 - CoreUI icons for Vue
- vue: ^3.5.31 - Vue framework
- vue-router: ^5.0.4 - Routing library
- pinia: ^3.0.4 - State management
**Additional Libraries**:
- chart.js: ^4.5.1 - Charting library
- @coreui/vue-chartjs: ^3.0.0 - CoreUI Chart.js wrapper for Vue
- simplebar-vue: ^2.4.2 - Custom scrollbars
- @coreui/utils: ^2.0.2 - Utility functions
## Browser Support
Modern browsers with ES6+ support:
- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)
## Resources
- CoreUI Vue Documentation: https://coreui.io/vue/docs/
- CoreUI Components: https://coreui.io/vue/docs/components/
- Vue 3 Documentation: https://vuejs.org/
- Vue Router: https://router.vuejs.org/
- Pinia: https://pinia.vuejs.org/
- Vite: https://vitejs.dev/
---
Remember: This is a Vue 3 application using CoreUI Vue components. Always check CoreUI Vue documentation for component APIs and usage examples. Keep the code clean, maintainable, and following Vue 3 best practices with Composition API.
+41 -41
View File
@@ -1,45 +1,45 @@
# Folders to ignore
dist/
node_modules/
tests/e2e/reports/
# # Folders to ignore
# dist/
# node_modules/
# tests/e2e/reports/
# local env files
.env.local
.env.*.local
# # local env files
# .env.local
# .env.*.local
# dependencies
/node_modules
package-lock.json
yarn.lock
# # dependencies
# /node_modules
# package-lock.json
# yarn.lock
# OS or Editor folders
._*
.cache
.DS_Store
.idea
.project
.settings
.tmproj
*.esproj
*.sublime-project
*.sublime-workspace
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
nbproject
Thumbs.db
/.vscode/
# # OS or Editor folders
# ._*
# .cache
# .DS_Store
# .idea
# .project
# .settings
# .tmproj
# *.esproj
# *.sublime-project
# *.sublime-workspace
# *.suo
# *.ntvs*
# *.njsproj
# *.sln
# *.sw?
# nbproject
# Thumbs.db
# /.vscode/
# Numerous always-ignore extensions
*.diff
*.err
*.log
*.orig
*.rej
*.swo
*.swp
*.vi
*.zip
*~
# # Numerous always-ignore extensions
# *.diff
# *.err
# *.log
# *.orig
# *.rej
# *.swo
# *.swp
# *.vi
# *.zip
# *~
+716
View File
@@ -0,0 +1,716 @@
# CoreUI Free Vue Admin Template - Architecture
This document provides a comprehensive overview of the CoreUI Free Vue Admin Template architecture, design patterns, and technical implementation details.
## Table of Contents
- [Project Overview](#project-overview)
- [Technology Stack](#technology-stack)
- [Architectural Pattern](#architectural-pattern)
- [Directory Structure](#directory-structure)
- [Core Components](#core-components)
- [Routing System](#routing-system)
- [State Management](#state-management)
- [Styling Architecture](#styling-architecture)
- [Build System](#build-system)
- [Performance Optimizations](#performance-optimizations)
- [Browser Support](#browser-support)
## Project Overview
The CoreUI Free Vue Admin Template is a professional admin dashboard built on Vue 3, CoreUI Vue components, and Bootstrap 5. It follows modern Vue patterns with Composition API, script setup syntax, and a component-based architecture.
**Key Features**:
- Single Page Application (SPA) with client-side routing
- Responsive design with Bootstrap 5 grid system
- Dark/Light theme support with automatic detection
- Lazy loading and code splitting for optimal performance
- Pinia-based state management
- Modular and extensible component architecture
## Technology Stack
### Frontend Core
| Technology | Version | Purpose |
|------------|---------|---------|
| Vue | 3.5.31 | Progressive framework for building user interfaces |
| Vue Router | 5.0.4 | Official router for Vue.js |
| Pinia | 3.0.4 | Official state management library for Vue |
### UI Framework
| Library | Version | Purpose |
|---------|---------|---------|
| @coreui/coreui | 5.6.1 | CoreUI CSS framework based on Bootstrap 5 |
| @coreui/vue | 5.8.0 | CoreUI Vue components |
| @coreui/icons | 3.0.1 | CoreUI icon set |
| @coreui/icons-vue | 2.2.0 | CoreUI icons as Vue components |
| @coreui/utils | 2.0.2 | Utility functions for CoreUI |
| simplebar-vue | 2.4.2 | Custom scrollbar component |
### Data Visualization
| Library | Version | Purpose |
|---------|---------|---------|
| Chart.js | 4.5.1 | HTML5 charting library |
| @coreui/chartjs | 4.2.0 | CoreUI Chart.js themes and defaults |
| @coreui/vue-chartjs | 3.0.0 | Vue wrapper for Chart.js with CoreUI styling |
### Build Tools & Development
| Tool | Version | Purpose |
|------|---------|---------|
| Vite | 8.0.3 | Fast build tool and dev server with HMR |
| @vitejs/plugin-vue | 6.0.5 | Vite plugin for Vue 3 |
| Sass | 1.98.0 | CSS preprocessor for styling |
| PostCSS | 8.5.8 | CSS transformation with autoprefixer |
| Autoprefixer | 10.4.27 | Automatic vendor prefixing |
| ESLint | 9.39.4 | JavaScript linting and code quality |
| eslint-plugin-vue | 10.8.0 | Vue-specific ESLint rules |
### Utilities
| Library | Version | Purpose |
|---------|---------|---------|
| @popperjs/core | 2.11.8 | Tooltip and popover positioning |
## Architectural Pattern
### Component-Based Architecture
The application follows a **Composition API architecture** with script setup syntax:
```
┌──────────────────────────────────────────┐
│ Application (App.vue) │
│ - Router View │
│ - Theme Management │
│ - Route Configuration │
└──────────────────────────────────────────┘
┌───────────────┴────────────────┐
│ │
┌───▼────┐ ┌────────▼───────┐
│ Public │ │ Protected │
│ Routes │ │ Routes │
│ │ │(DefaultLayout) │
│ Login │ └───────┬────────┘
│Register│ │
│ 404 │ ┌───────────┼────────────┐
│ 500 │ │ │ │
└────────┘ ┌────▼────┐ ┌────▼─────┐ ┌────▼─────┐
│AppHeader│ │AppSidebar│ │AppContent│
└─────────┘ └──────────┘ └────┬─────┘
┌───────▼─────────┐
│ View Components │
│ (Dashboard, │
│ Forms, etc.) │
└─────────────────┘
```
### Single Page Application (SPA) Pattern
The template uses client-side routing with createWebHashHistory:
1. **Initial Load**: HTML shell loads, Vue initializes
2. **Route Matching**: Vue Router matches URL to component
3. **Lazy Loading**: Component bundles load on-demand
4. **Rendering**: Component renders with layout wrapper
5. **Navigation**: Client-side transitions without page reload
### State Management Pattern
Pinia manages global application state:
```javascript
Store (stores/)
sidebarVisible (boolean)
sidebarUnfoldable (boolean)
theme (string: light/dark/auto)
```
Component-level state uses Vue's Composition API (ref, reactive).
## Directory Structure
```
coreui-free-vue-admin-template/
├── public/ # Static assets (served as-is)
│ ├── favicon.ico
│ └── robots.txt
├── src/ # Source code
│ │
│ ├── assets/ # Application assets
│ │ ├── brand/ # Logo components (logo.js, sygnet.js)
│ │ └── images/ # Image files (avatars, etc.)
│ │
│ ├── components/ # Reusable UI components
│ │ ├── AppBreadcrumb.vue # Breadcrumb navigation
│ │ ├── AppContent.vue # Main content area wrapper
│ │ ├── AppFooter.vue # Footer component
│ │ ├── AppHeader.vue # Header component
│ │ ├── AppHeaderDropdown.vue # User dropdown menu
│ │ ├── AppSidebar.vue # Sidebar navigation
│ │ ├── DocsComponents.vue # Documentation component showcase
│ │ └── DocsExample.vue # Code example wrapper
│ │
│ ├── layouts/ # Layout wrapper components
│ │ └── DefaultLayout.vue # Main application layout
│ │
│ ├── views/ # Page/view components
│ │ ├── dashboard/ # Dashboard page
│ │ │ ├── Dashboard.vue
│ │ │ └── MainChart.vue
│ │ ├── base/ # Base UI component examples
│ │ │ ├── Accordion.vue
│ │ │ ├── Breadcrumbs.vue
│ │ │ ├── Cards.vue
│ │ │ ├── Carousels.vue
│ │ │ ├── Chips.vue
│ │ │ ├── Collapses.vue
│ │ │ ├── ListGroups.vue
│ │ │ ├── Navs.vue
│ │ │ ├── Paginations.vue
│ │ │ ├── Placeholders.vue
│ │ │ ├── Popovers.vue
│ │ │ ├── Progress.vue
│ │ │ ├── Spinners.vue
│ │ │ ├── Tables.vue
│ │ │ ├── Tabs.vue
│ │ │ └── Tooltips.vue
│ │ ├── buttons/ # Button examples
│ │ ├── charts/ # Chart examples
│ │ ├── forms/ # Form examples
│ │ │ └── ChipInput.vue
│ │ ├── icons/ # Icon examples
│ │ ├── notifications/ # Notification examples
│ │ ├── widgets/ # Widget examples
│ │ ├── theme/ # Theme examples
│ │ └── pages/ # Special pages
│ │ ├── Login.vue # Login page
│ │ ├── Register.vue # Registration page
│ │ ├── Page404.vue # 404 error page
│ │ └── Page500.vue # 500 error page
│ │
│ ├── router/ # Router configuration
│ │ └── index.js # Route definitions
│ │
│ ├── stores/ # Pinia stores (if created)
│ │
│ ├── scss/ # Global stylesheets
│ │ ├── style.scss # Main stylesheet (imports CoreUI)
│ │ └── _custom.scss # Custom style overrides
│ │
│ ├── App.vue # Root application component
│ ├── main.js # Application entry point
│ └── _nav.js # Sidebar navigation configuration
├── node_modules/ # Dependencies
├── index.html # HTML entry point
├── vite.config.mjs # Vite build configuration
├── eslint.config.mjs # ESLint configuration
├── package.json # Project metadata and dependencies
├── .browserslistrc # Browser compatibility targets
├── .editorconfig # Editor configuration
└── README.md # Project documentation
```
## Core Components
### Application Component (App.vue)
The root component that:
- Sets up router-view for component rendering
- Manages theme initialization
- Provides the application shell
**Key Features**:
- Theme detection and persistence
- Suspense boundaries for lazy-loaded routes
- Global error handling boundaries
### Layout System
#### DefaultLayout (layouts/DefaultLayout.vue)
The main application layout wrapper that composes:
- **AppSidebar**: Collapsible navigation sidebar
- **AppHeader**: Top navigation bar with breadcrumbs and user menu
- **AppContent**: Main content area with routing
- **AppFooter**: Footer with version and links
**Responsibility**: Provides consistent layout structure for authenticated views.
#### Navigation Components
**AppSidebar** (`components/AppSidebar.vue`):
- Renders collapsible sidebar
- Uses Pinia for show/hide state
- Integrates with _nav.js for menu structure
- Includes branding section
**AppHeader** (`components/AppHeader.vue`):
- Fixed top navigation bar
- Sidebar toggle button
- Breadcrumb navigation
- User dropdown menu
- Theme switcher
### View Components
View components are page-level components that:
- Render specific application features (Dashboard, Forms, Charts)
- Use CoreUI Vue components for UI
- Connect to Pinia when needed for global state
- Implement business logic and data fetching
**Example Structure**:
```vue
<template>
<CCard>
<CCardBody>
{{ data }}
</CCardBody>
</CCard>
</template>
<script setup>
import { ref, onMounted } from 'vue'
const data = ref([])
onMounted(() => {
// Fetch dashboard data
})
</script>
```
## Routing System
### Vue Router v5
The application uses Vue Router for declarative routing:
**Configuration** (`router/index.js`):
```javascript
import { createRouter, createWebHashHistory } from 'vue-router'
const routes = [
{
path: '/',
name: 'Home',
component: DefaultLayout,
redirect: '/dashboard',
children: [
{
path: '/dashboard',
name: 'Dashboard',
component: () => import('@/views/dashboard/Dashboard.vue'),
},
],
},
{
path: '/pages',
redirect: '/pages/404',
name: 'Pages',
component: {
render() {
return h(resolveComponent('router-view'))
},
},
children: [
{
path: '404',
name: 'Page404',
component: () => import('@/views/pages/Page404'),
},
],
},
]
const router = createRouter({
history: createWebHashHistory(import.meta.env.BASE_URL),
routes,
scrollBehavior() {
return { top: 0 }
},
})
export default router
```
### Lazy Loading & Code Splitting
All routes use dynamic imports for lazy loading:
```javascript
component: () => import('./views/dashboard/Dashboard.vue')
```
**Benefits**:
- Smaller initial bundle size
- Faster first page load
- Components load only when navigated to
- Automatic code splitting by Vite
### Navigation Configuration
Navigation structure defined in `_nav.js`:
```javascript
export default [
{
component: 'CNavItem',
name: 'Dashboard',
to: '/dashboard',
icon: 'cil-speedometer',
badge: {
color: 'info',
text: 'NEW',
},
},
{
component: 'CNavGroup',
name: 'Base',
icon: 'cil-puzzle',
items: [
{
component: 'CNavItem',
name: 'Accordion',
to: '/base/accordion',
},
],
},
]
```
## State Management
### Pinia Store Architecture
Pinia uses the Composition API pattern:
**Store Example** (`stores/main.js`):
```javascript
import { defineStore } from 'pinia'
import { ref } from 'vue'
export const useStore = defineStore('main', () => {
const sidebarVisible = ref(true)
const sidebarUnfoldable = ref(false)
const theme = ref('light')
function toggleSidebar() {
sidebarVisible.value = !sidebarVisible.value
}
function setSidebarUnfoldable(value) {
sidebarUnfoldable.value = value
}
function setTheme(value) {
theme.value = value
}
return {
sidebarVisible,
sidebarUnfoldable,
theme,
toggleSidebar,
setSidebarUnfoldable,
setTheme,
}
})
```
### State Usage in Components
**Reading State**:
```vue
<script setup>
import { useStore } from '@/stores/main'
const store = useStore()
// Access: store.sidebarVisible
</script>
```
**Updating State**:
```vue
<script setup>
import { useStore } from '@/stores/main'
const store = useStore()
const toggleSidebar = () => {
store.toggleSidebar()
}
</script>
```
## Styling Architecture
### Sass/SCSS Structure
**Main Stylesheet** (`src/scss/style.scss`):
```scss
@use "@coreui/coreui/scss/coreui" as * with (
$enable-deprecation-messages: false
);
// Custom variables and overrides
@import 'custom';
```
**Custom Overrides** (`src/scss/_custom.scss`):
```scss
// Override CoreUI/Bootstrap variables
$primary: #321fdb;
$secondary: #ced2d8;
// Custom styles
.my-custom-class {
// styles
}
```
### CSS Custom Properties (CSS Variables)
CoreUI uses CSS custom properties for theming:
```css
:root {
--cui-primary: #321fdb;
--cui-secondary: #ced2d8;
--cui-body-bg: #ebedef;
--cui-body-color: #4f5d73;
}
[data-coreui-theme="dark"] {
--cui-body-bg: #2b3035;
--cui-body-color: #b4bac0;
}
```
**Usage in Components**:
```vue
<template>
<div :style="{ backgroundColor: 'var(--cui-primary)' }">Content</div>
</template>
```
### Component Styling
**Scoped Styles**:
```vue
<style scoped>
.my-component {
padding: 1rem;
background-color: var(--cui-light);
}
</style>
```
**Class Bindings**:
```vue
<template>
<button :class="['btn', { 'btn-primary': isPrimary, 'active': isActive }]">
Click
</button>
</template>
```
**Bootstrap Utilities**:
```vue
<template>
<CCard class="mb-4 shadow-sm">
<CCardBody class="p-4 d-flex justify-content-between">
</CCardBody>
</CCard>
</template>
```
## Build System
### Vite Configuration
**File**: `vite.config.mjs`
```javascript
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import autoprefixer from 'autoprefixer'
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)),
},
extensions: ['.js', '.json', '.jsx', '.mjs', '.ts', '.tsx', '.vue'],
},
server: {
port: 3000,
},
css: {
postcss: {
plugins: [autoprefixer()],
},
},
})
```
### Build Process
**Development Build**:
1. Vite starts dev server on port 3000
2. esbuild compiles Vue SFC components
3. PostCSS processes Sass/SCSS with autoprefixer
4. Hot Module Replacement (HMR) for instant updates
**Production Build**:
1. `vite build` command
2. Code minification and tree-shaking
3. Asset optimization (images, fonts)
4. CSS extraction and minification
5. Source maps generation
6. Output to `dist/` directory
**Build Output**:
```
dist/
├── assets/
│ ├── index-[hash].js # Main bundle
│ ├── [component]-[hash].js # Lazy-loaded chunks
│ └── index-[hash].css # Extracted CSS
├── index.html # HTML entry
└── favicon.ico # Static assets
```
### Code Splitting Strategy
**Automatic Splitting**:
- Each lazy-loaded route becomes a separate chunk
- Vendor libraries (Vue, CoreUI) in separate vendor chunk
- Dynamic imports create split points
**Manual Splitting** (if needed):
```javascript
const HeavyComponent = () => import(/* webpackChunkName: "heavy" */ './HeavyComponent.vue')
```
## Performance Optimizations
### Implemented Optimizations
1. **Lazy Loading**: All routes lazy-loaded with dynamic imports
2. **Code Splitting**: Separate bundles per route
3. **Tree Shaking**: Unused code eliminated by Vite
4. **Asset Optimization**: Images and fonts optimized
5. **CSS Extraction**: Separate CSS bundle for caching
6. **Hash-based Caching**: File names include content hash
### Component Optimization
**v-memo** for expensive renders:
```vue
<template>
<div v-memo="[valueA, valueB]">
<!-- Heavy rendering -->
</div>
</template>
```
**computed** for derived values:
```vue
<script setup>
import { computed } from 'vue'
const sortedData = computed(() => {
return data.value.sort((a, b) => a.value - b.value)
})
</script>
```
### Bundle Size Management
**Strategies**:
- Use named imports: `import { CButton } from '@coreui/vue'`
- Avoid importing entire libraries
- Check bundle size with `npm run build`
- Use Vite's rollup visualizer for analysis
## Browser Support
### Target Browsers
Defined in `.browserslistrc`:
```
> 0.5%
last 2 versions
Firefox ESR
not dead
not IE 11
```
### Polyfills
Modern browsers support Vue 3 natively. No additional polyfills needed for ES6+ features.
### Progressive Enhancement
- Modern features with fallbacks
- CSS Grid with flexbox fallback
- Modern color modes with theme classes
## Security Considerations
### Best Practices
1. **Content Security Policy**: Configure CSP headers
2. **XSS Prevention**: Vue escapes content by default
3. **Dependency Auditing**: Run `npm audit` regularly
4. **Environment Variables**: Use `.env` files (not committed)
5. **HTTPS**: Serve over HTTPS in production
### Vue Security
- Avoid `v-html` unless necessary and sanitize content
- Validate user input before rendering
- Use prop validation for type safety
- Keep dependencies updated
## Deployment
### Static Hosting
The application builds to static files suitable for:
- Netlify
- Vercel
- GitHub Pages
- AWS S3 + CloudFront
- Any static file server
### Build for Production
```bash
npm run build
```
Output in `dist/` directory ready for deployment.
### HashRouter for Static Hosts
Uses createWebHashHistory for GitHub Pages compatibility:
- URLs: `https://example.com/#/dashboard`
- No server-side routing configuration needed
- Works with any static host
---
This architecture provides a solid foundation for building modern, performant admin dashboards with Vue 3 and CoreUI. The modular structure allows for easy extension and customization while maintaining code quality and best practices.
+1113
View File
File diff suppressed because it is too large Load Diff
+1 -1
View File
@@ -1,6 +1,6 @@
The MIT License (MIT)
Copyright (c) 2025 creativeLabs Łukasz Holeczek.
Copyright (c) 2026 creativeLabs Łukasz Holeczek.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
+42 -2
View File
@@ -1,4 +1,4 @@
# CoreUI Free Vue Admin Template [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social&logo=twitter)](https://twitter.com/intent/tweet?text=CoreUI%20-%20Free%Vue%204%20Admin%20Template%20&url=https://coreui.io&hashtags=bootstrap,admin,template,dashboard,panel,free,angular,react,vue)
# CoreUI Free Vue Admin Template - Built for AI-Assisted Development [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social&logo=twitter)](https://twitter.com/intent/tweet?text=CoreUI%20-%20Free%Vue%204%20Admin%20Template%20&url=https://coreui.io&hashtags=bootstrap,admin,template,dashboard,panel,free,angular,react,vue)
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg?style=flat-square)](https://opensource.org/licenses/MIT)
[![@coreui coreui](https://img.shields.io/badge/@coreui%20-coreui-lightgrey.svg?style=flat-square)](https://github.com/coreui/coreui)
@@ -29,6 +29,7 @@ CoreUI is meant to be the UX game changer. Pure & transparent code is devoid of
* [Installation](#installation)
* [Basic usage](#basic-usage)
* [What's included](#whats-included)
* [AI-Friendly Development](#ai-friendly-development)
* [Documentation](#documentation)
* [Components](#components)
* [Versioning](#versioning)
@@ -135,6 +136,43 @@ coreui-free-vue-admin-template
└── vite.config.mjs
```
## AI-Friendly Development
This template is designed to work seamlessly with AI coding assistants like Cursor, GitHub Copilot, and Claude Code. We've included comprehensive documentation and configuration files to help AI understand the project structure and conventions.
### Features for AI Development
- **`.cursorrules`**: Complete AI assistant configuration with project conventions, technology stack, and coding patterns
- **`ARCHITECTURE.md`**: Detailed technical architecture documentation covering components, routing, state management, and build system
- **`DEVELOPMENT.md`**: Comprehensive development guide with setup instructions, workflows, and best practices
- **JSDoc Comments**: Main Vue components include documentation for better AI understanding
### Getting Started with AI Assistants
1. **Open the project** in your AI-powered IDE (VS Code with Cursor, GitHub Copilot, or Claude Code)
2. **Review `.cursorrules`** to understand the project conventions
3. **Ask your AI assistant** to help you build features - it will automatically follow the project patterns
4. **Use natural language** to describe components, pages, or features you want to add
### What AI Assistants Know About This Project
Your AI assistant understands:
- **Component Library**: Always use CoreUI Vue components (never Tailwind, Vuetify, or other libraries)
- **Code Style**: Vue 3 Composition API with `<script setup>` syntax, Prettier formatting, ESLint rules
- **Architecture**: Single Page Application with Vue Router, Pinia for state management, Vite for building
- **File Organization**: Where to create components, views, routes, and styles
- **Common Patterns**: Lazy loading, composables, navigation configuration, theming
### Example AI Prompts
Try asking your AI assistant:
- "Create a new products page with a table showing product name, price, and status"
- "Add a user profile form with validation"
- "Create a chart showing monthly sales data"
- "Add a new navigation item for the settings page"
For more information, see the [DEVELOPMENT.md](DEVELOPMENT.md) guide.
## Documentation
The documentation for the CoreUI Admin Template is hosted at our website [CoreUI for Vue](https://coreui.io/vue/docs/templates/installation.html)
@@ -155,6 +193,8 @@ CoreUI Vue.js Admin Templates are built on top of CoreUI and CoreUI PRO UI compo
- [Vue Card](https://coreui.io/vue/docs/components/card.html)
- [Vue Carousel](https://coreui.io/vue/docs/components/carousel.html)
- [Vue Checkbox](https://coreui.io/vue/docs/forms/checkbox.html)
- [Vue Chip](https://coreui.io/vue/docs/components/chip.html)
- [Vue Chip Input](https://coreui.io/vue/docs/forms/chip-input.html)
- [Vue Close Button](https://coreui.io/vue/docs/components/close-button.html)
- [Vue Collapse](https://coreui.io/vue/docs/components/collapse.html)
- [Vue Date Picker](https://coreui.io/vue/docs/forms/date-picker.html) **PRO**
@@ -231,6 +271,6 @@ CoreUI is an MIT-licensed open source project and is completely free to use. How
## Copyright and License
copyright 2025 creativeLabs Łukasz Holeczek.
copyright 2026 creativeLabs Łukasz Holeczek.
Code released under [the MIT license](https://github.com/coreui/coreui-free-react-admin-template/blob/main/LICENSE).
BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 7.1 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 9.7 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

+1
View File
@@ -0,0 +1 @@
var e=``+new URL(`1-Bxx5tbqp.jpg`,import.meta.url).href,t=``+new URL(`4-TDOHctEN.jpg`,import.meta.url).href;export{e as n,t};
BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
import{Bt as e,Ft as t,It as n,Jt as r,Lt as i,Pt as a,Qt as o,Rt as s,Vt as c,Xt as l,an as u,qt as d,zt as f}from"./index-qNrWYJXL.js";import{t as p}from"./ticket-BXPImeUD.js";var m={class:`table-responsive`},h={__name:`Approved`,setup(h){let g=p(),_=t(()=>g.tickets.filter(e=>e.approved_by&&e.approved_by!==`-`));return(t,p)=>{let h=l(`CCardHeader`),g=l(`CTableHeaderCell`),v=l(`CTableRow`),y=l(`CTableHead`),b=l(`CTableDataCell`),x=l(`CBadge`),S=l(`CTableBody`),C=l(`CTable`),w=l(`CCardBody`),T=l(`CCard`),E=l(`CCol`),D=l(`CRow`);return d(),i(D,null,{default:o(()=>[c(E,{xs:12},{default:o(()=>[c(T,{class:`mb-4`},{default:o(()=>[c(h,null,{default:o(()=>[...p[0]||=[n(`strong`,null,`Approved Tickets`,-1)]]),_:1}),c(w,null,{default:o(()=>[n(`div`,m,[c(C,{striped:``,hover:``,small:``},{default:o(()=>[c(y,null,{default:o(()=>[c(v,null,{default:o(()=>[c(g,{scope:`col`},{default:o(()=>[...p[1]||=[e(`No`,-1)]]),_:1}),c(g,{scope:`col`},{default:o(()=>[...p[2]||=[e(`Ticket No`,-1)]]),_:1}),c(g,{scope:`col`},{default:o(()=>[...p[3]||=[e(`Kode Tiket`,-1)]]),_:1}),c(g,{scope:`col`},{default:o(()=>[...p[4]||=[e(`Deskripsi`,-1)]]),_:1}),c(g,{scope:`col`},{default:o(()=>[...p[5]||=[e(`Approved By`,-1)]]),_:1}),c(g,{scope:`col`},{default:o(()=>[...p[6]||=[e(`Approved At`,-1)]]),_:1}),c(g,{scope:`col`},{default:o(()=>[...p[7]||=[e(`Status`,-1)]]),_:1})]),_:1})]),_:1}),c(S,null,{default:o(()=>[(d(!0),f(a,null,r(_.value,(t,n)=>(d(),i(v,{key:t.ticket_no},{default:o(()=>[c(g,{scope:`row`},{default:o(()=>[e(u(n+1),1)]),_:2},1024),c(b,null,{default:o(()=>[e(u(t.ticket_no),1)]),_:2},1024),c(b,null,{default:o(()=>[e(u(t.kode_tiket),1)]),_:2},1024),c(b,null,{default:o(()=>[e(u(t.deskripsi),1)]),_:2},1024),c(b,null,{default:o(()=>[e(u(t.approved_by),1)]),_:2},1024),c(b,null,{default:o(()=>[e(u(t.approved_at),1)]),_:2},1024),c(b,null,{default:o(()=>[c(x,{color:`success`},{default:o(()=>[...p[8]||=[e(`Approved`,-1)]]),_:1})]),_:1})]),_:2},1024))),128)),_.value.length===0?(d(),i(v,{key:0},{default:o(()=>[c(b,{colspan:`7`,class:`text-center`},{default:o(()=>[...p[9]||=[e(`Tidak ada data approved tickets`,-1)]]),_:1})]),_:1})):s(``,!0)]),_:1})]),_:1})])]),_:1})]),_:1})]),_:1})]),_:1})}}};export{h as default};
+1
View File
@@ -0,0 +1 @@
import{Bt as e,It as t,Lt as n,Mt as r,Qt as i,Vt as a,Xt as o,qt as s}from"./index-qNrWYJXL.js";var c={};function l(r,c){let l=o(`DocsComponents`),u=o(`CCol`),d=o(`CCardHeader`),f=o(`CBadge`),p=o(`DocsExample`),m=o(`CButton`),h=o(`CCardBody`),g=o(`CCard`),_=o(`CRow`);return s(),n(_,null,{default:i(()=>[a(u,{xs:12},{default:i(()=>[a(l,{href:`components/badge.html`})]),_:1}),a(u,{lg:6},{default:i(()=>[a(g,{class:`mb-4`},{default:i(()=>[a(d,null,{default:i(()=>[...c[0]||=[t(`strong`,null,`Vue Badges`,-1),e(),t(`small`,null,`Dismissing`,-1)]]),_:1}),a(h,null,{default:i(()=>[c[18]||=t(`p`,{class:`text-body-secondary small`},[e(` Bootstrap badge scale to suit the size of the parent element by using relative font sizing and `),t(`code`,null,`em`),e(` units. `)],-1),a(p,{href:`components/badge.html`},{default:i(()=>[t(`h1`,null,[c[2]||=e(`Example heading `,-1),a(f,{color:`secondary`},{default:i(()=>[...c[1]||=[e(`New`,-1)]]),_:1})]),t(`h2`,null,[c[4]||=e(`Example heading `,-1),a(f,{color:`secondary`},{default:i(()=>[...c[3]||=[e(`New`,-1)]]),_:1})]),t(`h3`,null,[c[6]||=e(`Example heading `,-1),a(f,{color:`secondary`},{default:i(()=>[...c[5]||=[e(`New`,-1)]]),_:1})]),t(`h4`,null,[c[8]||=e(`Example heading `,-1),a(f,{color:`secondary`},{default:i(()=>[...c[7]||=[e(`New`,-1)]]),_:1})]),t(`h5`,null,[c[10]||=e(`Example heading `,-1),a(f,{color:`secondary`},{default:i(()=>[...c[9]||=[e(`New`,-1)]]),_:1})]),t(`h6`,null,[c[12]||=e(`Example heading `,-1),a(f,{color:`secondary`},{default:i(()=>[...c[11]||=[e(`New`,-1)]]),_:1})])]),_:1}),c[19]||=t(`p`,{class:`text-body-secondary small`},` Badges can be used as part of links or buttons to provide a counter. `,-1),a(p,{href:`components/badge.html`},{default:i(()=>[a(m,{color:`primary`},{default:i(()=>[c[14]||=e(` Notifications `,-1),a(f,{color:`secondary`},{default:i(()=>[...c[13]||=[e(`4`,-1)]]),_:1})]),_:1})]),_:1}),c[20]||=t(`p`,{class:`text-body-secondary small`},` Remark that depending on how you use them, badges may be complicated for users of screen readers and related assistive technologies. `,-1),c[21]||=t(`p`,{class:`text-body-secondary small`},` Unless the context is clear, consider including additional context with a visually hidden piece of additional text. `,-1),a(p,{href:`components/badge.html`},{default:i(()=>[a(m,{color:`primary`},{default:i(()=>[c[16]||=e(` Profile `,-1),a(f,{color:`secondary`},{default:i(()=>[...c[15]||=[e(`9`,-1)]]),_:1}),c[17]||=t(`span`,{class:`visually-hidden`},`unread messages`,-1)]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(u,{lg:6},{default:i(()=>[a(g,{class:`mb-4`},{default:i(()=>[a(d,null,{default:i(()=>[...c[22]||=[t(`strong`,null,`Vue Badges`,-1),e(),t(`small`,null,`Contextual variations`,-1)]]),_:1}),a(h,null,{default:i(()=>[c[30]||=t(`p`,{class:`text-body-secondary small`},[e(` Add any of the below-mentioned `),t(`code`,null,`color`),e(` props to modify the presentation of a badge. `)],-1),a(p,{href:`components/badge.html#contextual-variations`},{default:i(()=>[a(f,{color:`primary-gradient`},{default:i(()=>[...c[23]||=[e(`primary`,-1)]]),_:1}),a(f,{color:`success-gradient`},{default:i(()=>[...c[24]||=[e(`success`,-1)]]),_:1}),a(f,{color:`danger-gradient`},{default:i(()=>[...c[25]||=[e(`danger`,-1)]]),_:1}),a(f,{color:`warning-gradient`},{default:i(()=>[...c[26]||=[e(`warning`,-1)]]),_:1}),a(f,{color:`info-gradient`},{default:i(()=>[...c[27]||=[e(`info`,-1)]]),_:1}),a(f,{color:`light`},{default:i(()=>[...c[28]||=[e(`light`,-1)]]),_:1}),a(f,{color:`dark`},{default:i(()=>[...c[29]||=[e(`dark`,-1)]]),_:1})]),_:1})]),_:1})]),_:1}),a(g,{class:`mb-4`},{default:i(()=>[a(d,null,{default:i(()=>[...c[31]||=[t(`strong`,null,`Vue Badges`,-1),e(),t(`small`,null,`Pill badges`,-1)]]),_:1}),a(h,null,{default:i(()=>[c[39]||=t(`p`,{class:`text-body-secondary small`},[e(` Apply the `),t(`code`,null,`shape="rounded-pill"`),e(` prop to make badges rounded. `)],-1),a(p,{href:`components/badge.html#pill-badges`},{default:i(()=>[a(f,{color:`primary-gradient`,shape:`rounded-pill`},{default:i(()=>[...c[32]||=[e(` primary `,-1)]]),_:1}),a(f,{color:`success-gradient`,shape:`rounded-pill`},{default:i(()=>[...c[33]||=[e(` success `,-1)]]),_:1}),a(f,{color:`danger-gradient`,shape:`rounded-pill`},{default:i(()=>[...c[34]||=[e(` danger `,-1)]]),_:1}),a(f,{color:`warning-gradient`,shape:`rounded-pill`},{default:i(()=>[...c[35]||=[e(` warning `,-1)]]),_:1}),a(f,{color:`info-gradient`,shape:`rounded-pill`},{default:i(()=>[...c[36]||=[e(` info `,-1)]]),_:1}),a(f,{color:`light`,shape:`rounded-pill`},{default:i(()=>[...c[37]||=[e(` light `,-1)]]),_:1}),a(f,{color:`dark`,shape:`rounded-pill`},{default:i(()=>[...c[38]||=[e(` dark `,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})}var u=r(c,[[`render`,l]]);export{u as default};
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
import{Bt as e,It as t,Lt as n,Mt as r,Qt as i,Vt as a,Xt as o,qt as s}from"./index-qNrWYJXL.js";var c={};function l(r,c){let l=o(`DocsComponents`),u=o(`CCardHeader`),d=o(`CLink`),f=o(`CBreadcrumbItem`),p=o(`CBreadcrumb`),m=o(`DocsExample`),h=o(`CCardBody`),g=o(`CCard`),_=o(`CCol`),v=o(`CRow`);return s(),n(v,null,{default:i(()=>[a(_,{xs:12},{default:i(()=>[a(l,{href:`components/breadcrumb.html`}),a(g,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[0]||=[t(`strong`,null,`Vue Breadcrumb`,-1)]]),_:1}),a(h,null,{default:i(()=>[c[10]||=t(`p`,{class:`text-body-secondary small`},[e(` The breadcrumb navigation provides links back to each previous page the user navigated through and shows the current location in a website or an application. You dont have to add separators, because they automatically added in CSS through `),t(`a`,{href:`https://developer.mozilla.org/en-US/docs/Web/CSS/::before`},[t(`code`,null,`::before`)]),e(` and `),t(`a`,{href:`https://developer.mozilla.org/en-US/docs/Web/CSS/content`},[t(`code`,null,`content`)]),e(` . `)],-1),a(m,{href:`components/breadcrumb.html`},{default:i(()=>[a(p,null,{default:i(()=>[a(f,null,{default:i(()=>[a(d,{href:`#`},{default:i(()=>[...c[1]||=[e(`Home`,-1)]]),_:1})]),_:1}),a(f,{active:``},{default:i(()=>[...c[2]||=[e(`Library`,-1)]]),_:1})]),_:1}),a(p,null,{default:i(()=>[a(f,null,{default:i(()=>[a(d,{href:`#`},{default:i(()=>[...c[3]||=[e(`Home`,-1)]]),_:1})]),_:1}),a(f,null,{default:i(()=>[a(d,{href:`#`},{default:i(()=>[...c[4]||=[e(`Library`,-1)]]),_:1})]),_:1}),a(f,{active:``},{default:i(()=>[...c[5]||=[e(`Data`,-1)]]),_:1})]),_:1}),a(p,null,{default:i(()=>[a(f,null,{default:i(()=>[a(d,{href:`#`},{default:i(()=>[...c[6]||=[e(`Home`,-1)]]),_:1})]),_:1}),a(f,null,{default:i(()=>[a(d,{href:`#`},{default:i(()=>[...c[7]||=[e(`Library`,-1)]]),_:1})]),_:1}),a(f,null,{default:i(()=>[a(d,{href:`#`},{default:i(()=>[...c[8]||=[e(`Data`,-1)]]),_:1})]),_:1}),a(f,{active:``},{default:i(()=>[...c[9]||=[e(`Bootstrap`,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})}var u=r(c,[[`render`,l]]);export{u as default};
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1
View File
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
import{Bt as e,Lt as t,Qt as n,Vt as r,Xt as i,qt as a,rn as o}from"./index-qNrWYJXL.js";import{a as s,i as c,n as l,o as u,r as d,s as f}from"./esm-D5tqpA72.js";var p={__name:`CChartLineExample`,setup(e){let n={labels:[`months`,`a`,`b`,`c`,`d`],datasets:[{label:`Data One`,backgroundColor:`rgb(228,102,81,0.9)`,data:[30,39,10,50,30,70,35]},{label:`Data Two`,backgroundColor:`rgb(0,216,255,0.9)`,data:[39,80,40,35,40,20,45]}]};return(e,r)=>(a(),t(o(c),{data:n}))}},m={__name:`CChartBarExample`,setup(e){let n={labels:[`January`,`February`,`March`,`April`,`May`,`June`,`July`,`August`,`September`,`October`,`November`,`December`],datasets:[{label:`GitHub Commits`,backgroundColor:`#f87979`,data:[40,20,12,39,10,40,39,80,40,20,12,12]}]};return(e,r)=>(a(),t(o(l),{data:n}))}},h={__name:`CChartDoughnutExample`,setup(e){let n={labels:[`VueJs`,`EmberJs`,`VueJs`,`AngularJs`],datasets:[{backgroundColor:[`#41B883`,`#E46651`,`#00D8FF`,`#DD1B16`],data:[40,20,80,10]}]};return(e,r)=>(a(),t(o(d),{data:n}))}},g={__name:`CChartRadarExample`,setup(e){let n={labels:[`Eating`,`Drinking`,`Sleeping`,`Designing`,`Coding`,`Cycling`,`Running`],datasets:[{label:`2020`,backgroundColor:`rgba(179,181,198,0.2)`,borderColor:`rgba(179,181,198,1)`,pointBackgroundColor:`rgba(179,181,198,1)`,pointBorderColor:`#fff`,pointHoverBackgroundColor:`#fff`,pointHoverBorderColor:`rgba(179,181,198,1)`,tooltipLabelColor:`rgba(179,181,198,1)`,data:[65,59,90,81,56,55,40]},{label:`2021`,backgroundColor:`rgba(255,99,132,0.2)`,borderColor:`rgba(255,99,132,1)`,pointBackgroundColor:`rgba(255,99,132,1)`,pointBorderColor:`#fff`,pointHoverBackgroundColor:`#fff`,pointHoverBorderColor:`rgba(255,99,132,1)`,tooltipLabelColor:`rgba(255,99,132,1)`,data:[28,48,40,19,96,27,100]}],options:{aspectRatio:1.5}};return(e,r)=>(a(),t(o(f),{data:n}))}},_={__name:`CChartPieExample`,setup(e){let n={labels:[`VueJs`,`EmberJs`,`VueJs`,`AngularJs`],datasets:[{backgroundColor:[`#41B883`,`#E46651`,`#00D8FF`,`#DD1B16`],data:[40,20,80,10]}]};return(e,r)=>(a(),t(o(s),{data:n}))}},v={__name:`CChartPolarAreaExample`,setup(e){let n={labels:[`Eating`,`Drinking`,`Sleeping`,`Designing`,`Coding`,`Cycling`,`Running`],datasets:[{label:`My First dataset`,backgroundColor:`rgba(179,181,198,0.5)`,pointBackgroundColor:`rgba(179,181,198,1)`,pointBorderColor:`#fff`,pointHoverBackgroundColor:`rgba(179,181,198,1)`,pointHoverBorderColor:`rgba(179,181,198,1)`,data:[65,59,90,81,56,55,40]},{label:`My Second dataset`,backgroundColor:`rgba(255,99,132,0.5)`,pointBackgroundColor:`rgba(255,99,132,1)`,pointBorderColor:`#fff`,pointHoverBackgroundColor:`rgba(255,99,132,1)`,pointHoverBorderColor:`rgba(255,99,132,1)`,data:[28,48,40,19,96,27,100]}],options:{aspectRatio:1.5}};return(e,r)=>(a(),t(o(u),{data:n}))}},y={__name:`Charts`,setup(s){return(s,c)=>{let l=i(`CCardHeader`),u=i(`CCardBody`),d=i(`CCard`),f=i(`CCol`),y=i(`CRow`);return a(),t(y,null,{default:n(()=>[r(f,{md:6,class:`mb-4`},{default:n(()=>[r(d,null,{default:n(()=>[r(l,null,{default:n(()=>[...c[0]||=[e(` Line Chart `,-1)]]),_:1}),r(u,null,{default:n(()=>[r(o(p))]),_:1})]),_:1})]),_:1}),r(f,{md:6,class:`mb-4`},{default:n(()=>[r(d,null,{default:n(()=>[r(l,null,{default:n(()=>[...c[1]||=[e(`Bar Chart`,-1)]]),_:1}),r(u,null,{default:n(()=>[r(o(m))]),_:1})]),_:1})]),_:1}),r(f,{md:6,class:`mb-4`},{default:n(()=>[r(d,null,{default:n(()=>[r(l,null,{default:n(()=>[...c[2]||=[e(`Doughnut Chart`,-1)]]),_:1}),r(u,null,{default:n(()=>[r(o(h))]),_:1})]),_:1})]),_:1}),r(f,{md:6,class:`mb-4`},{default:n(()=>[r(d,null,{default:n(()=>[r(l,null,{default:n(()=>[...c[3]||=[e(`Radar Chart`,-1)]]),_:1}),r(u,null,{default:n(()=>[r(o(g))]),_:1})]),_:1})]),_:1}),r(f,{md:6,class:`mb-4`},{default:n(()=>[r(d,null,{default:n(()=>[r(l,null,{default:n(()=>[...c[4]||=[e(`Pie Chart`,-1)]]),_:1}),r(u,null,{default:n(()=>[r(o(_))]),_:1})]),_:1})]),_:1}),r(f,{md:6,class:`mb-4`},{default:n(()=>[r(d,null,{default:n(()=>[r(l,null,{default:n(()=>[...c[5]||=[e(`Polar Area Chart`,-1)]]),_:1}),r(u,null,{default:n(()=>[r(o(v))]),_:1})]),_:1})]),_:1})]),_:1})}}};export{y as default};
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1
View File
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
import{Bt as e,It as t,Lt as n,Qt as r,Vt as i,Xt as a,qt as o,tn as s}from"./index-qNrWYJXL.js";var c={style:{"min-height":`120px`}},l={__name:`Collapses`,setup(l){let u=s(!1),d=s(!1),f=s(!1),p=s(!1);return(s,l)=>{let m=a(`DocsComponents`),h=a(`CCardHeader`),g=a(`CButton`),_=a(`CCardBody`),v=a(`CCard`),y=a(`CCollapse`),b=a(`DocsExample`),x=a(`CCol`),S=a(`CRow`);return o(),n(S,null,{default:r(()=>[i(x,{xs:12},{default:r(()=>[i(m,{href:`components/collapse.html`}),i(v,{class:`mb-4`},{default:r(()=>[i(h,null,{default:r(()=>[...l[6]||=[t(`strong`,null,`Vue Collapse`,-1)]]),_:1}),i(_,null,{default:r(()=>[l[10]||=t(`p`,{class:`text-body-secondary small`},`You can use a link or a button component.`,-1),i(b,{href:`components/collapse.html#example`},{default:r(()=>[i(g,{color:`primary`,href:`#`,onClick:l[0]||=e=>u.value=!u.value},{default:r(()=>[...l[7]||=[e(`Link`,-1)]]),_:1}),i(g,{color:`primary`,onClick:l[1]||=e=>u.value=!u.value},{default:r(()=>[...l[8]||=[e(`Button`,-1)]]),_:1}),i(y,{visible:u.value},{default:r(()=>[i(v,{class:`mt-3`},{default:r(()=>[i(_,null,{default:r(()=>[...l[9]||=[e(` Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. `,-1)]]),_:1})]),_:1})]),_:1},8,[`visible`])]),_:1})]),_:1})]),_:1}),i(v,{class:`mb-4`},{default:r(()=>[i(h,null,{default:r(()=>[...l[11]||=[t(`strong`,null,`Vue Collapse`,-1),e(),t(`small`,null,` Horizontal`,-1)]]),_:1}),i(_,null,{default:r(()=>[l[14]||=t(`p`,{class:`text-body-secondary small`},[e(` The collapse plugin also supports horizontal collapsing. Add the `),t(`code`,null,`horizontal`),e(` property to transition the `),t(`code`,null,`width`),e(` instead of `),t(`code`,null,`height`),e(` and set a `),t(`code`,null,`width`),e(` on the immediate child element. `)],-1),i(b,{href:`components/collapse.html#horizontal`},{default:r(()=>[i(g,{class:`mb-3`,color:`primary`,"aria-expanded":`{visible}`,"aria-controls":`collapseWidthExample`,onClick:l[2]||=e=>p.value=!p.value},{default:r(()=>[...l[12]||=[e(`Button`,-1)]]),_:1}),t(`div`,c,[i(y,{horizontal:``,visible:p.value},{default:r(()=>[i(v,{style:{width:`300px`}},{default:r(()=>[i(_,null,{default:r(()=>[...l[13]||=[e(` This is some placeholder content for a horizontal collapse. It's hidden by default and shown when triggered. `,-1)]]),_:1})]),_:1})]),_:1},8,[`visible`])])]),_:1})]),_:1})]),_:1}),i(v,{class:`mb-4`},{default:r(()=>[i(h,null,{default:r(()=>[...l[15]||=[t(`strong`,null,`Vue Collapse`,-1),e(),t(`small`,null,` multi target`,-1)]]),_:1}),i(_,null,{default:r(()=>[l[21]||=t(`p`,{class:`text-body-secondary small`},[e(` A `),t(`code`,null,`<CButton>`),e(` can show and hide multiple elements. `)],-1),l[22]||=t(`h4`,{class:`mt-4`},`Toggle multiple targets`,-1),i(b,{href:`components/collapse.html#multiple-targets`},{default:r(()=>[i(g,{color:`primary`,onClick:l[3]||=e=>d.value=!d.value},{default:r(()=>[...l[16]||=[e(`Toggle first element`,-1)]]),_:1}),i(g,{color:`primary`,onClick:l[4]||=e=>f.value=!f.value},{default:r(()=>[...l[17]||=[e(`Toggle second element`,-1)]]),_:1}),i(g,{color:`primary`,onClick:l[5]||=()=>{d.value=!d.value,f.value=!f.value}},{default:r(()=>[...l[18]||=[e(` Toggle both elements `,-1)]]),_:1}),i(S,null,{default:r(()=>[i(x,{xs:6},{default:r(()=>[i(y,{visible:d.value},{default:r(()=>[i(v,{class:`mt-3`},{default:r(()=>[i(_,null,{default:r(()=>[...l[19]||=[e(` Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. `,-1)]]),_:1})]),_:1})]),_:1},8,[`visible`])]),_:1}),i(x,{xs:6},{default:r(()=>[i(y,{visible:f.value},{default:r(()=>[i(v,{class:`mt-3`},{default:r(()=>[i(_,null,{default:r(()=>[...l[20]||=[e(` Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. `,-1)]]),_:1})]),_:1})]),_:1},8,[`visible`])]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})}}};export{l as default};
+1
View File
@@ -0,0 +1 @@
import{Bt as e,It as t,Lt as n,Qt as r,Vt as i,Xt as a,Yt as o,in as s,qt as c}from"./index-qNrWYJXL.js";var l={__name:`ColorTheme`,props:{color:String},setup(e){let i=e;return(e,l)=>{let u=a(`CCol`);return c(),n(u,{xl:2,md:4,sm:6,xs:12,class:`mb-4`},{default:r(()=>[t(`div`,{class:s([`theme-color w-75 rounded mb-3`,i.color]),style:{"padding-top":`75%`}},null,2),o(e.$slots,`default`)]),_:3})}}},u={__name:`Colors`,setup(o){return(o,s)=>{let u=a(`CIcon`),d=a(`CCardHeader`),f=a(`CRow`),p=a(`CCardBody`),m=a(`CCard`),h=a(`CCol`);return c(),n(f,null,{default:r(()=>[i(h,null,{default:r(()=>[i(m,null,{default:r(()=>[i(d,null,{default:r(()=>[i(u,{icon:`cil-drop`}),s[0]||=e(` Theme colors `,-1)]),_:1}),i(p,null,{default:r(()=>[i(f,null,{default:r(()=>[i(l,{color:`bg-primary`},{default:r(()=>[...s[1]||=[t(`h6`,null,`Brand Primary Color`,-1)]]),_:1}),i(l,{color:`bg-secondary`},{default:r(()=>[...s[2]||=[t(`h6`,null,`Brand Secondary Color`,-1)]]),_:1}),i(l,{color:`bg-success`},{default:r(()=>[...s[3]||=[t(`h6`,null,`Brand Success Color`,-1)]]),_:1}),i(l,{color:`bg-danger`},{default:r(()=>[...s[4]||=[t(`h6`,null,`Brand Danger Color`,-1)]]),_:1}),i(l,{color:`bg-warning`},{default:r(()=>[...s[5]||=[t(`h6`,null,`Brand Warning Color`,-1)]]),_:1}),i(l,{color:`bg-info`},{default:r(()=>[...s[6]||=[t(`h6`,null,`Brand Info Color`,-1)]]),_:1}),i(l,{color:`bg-light`},{default:r(()=>[...s[7]||=[t(`h6`,null,`Brand Light Color`,-1)]]),_:1}),i(l,{color:`bg-dark`},{default:r(()=>[...s[8]||=[t(`h6`,null,`Brand Dark Color`,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})}}};export{u as default};
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1
View File
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
import{Bt as e,It as t,Mt as n,Qt as r,Vt as i,Xt as a,qt as o,zt as s}from"./index-qNrWYJXL.js";var c={},l={class:`wrapper min-vh-100 d-flex flex-row align-items-center`};function u(n,c){let u=a(`CIcon`),d=a(`CInputGroupText`),f=a(`CFormInput`),p=a(`CInputGroup`),m=a(`CButton`),h=a(`CCol`),g=a(`CRow`),_=a(`CForm`),v=a(`CCardBody`),y=a(`CCard`),b=a(`CCardGroup`),x=a(`CContainer`);return o(),s(`div`,l,[i(x,null,{default:r(()=>[i(g,{class:`justify-content-center`},{default:r(()=>[i(h,{md:8},{default:r(()=>[i(b,null,{default:r(()=>[i(y,{class:`p-4`},{default:r(()=>[i(v,null,{default:r(()=>[i(_,null,{default:r(()=>[c[2]||=t(`h1`,null,`Login`,-1),c[3]||=t(`p`,{class:`text-body-secondary`},`Sign In to your account`,-1),i(p,{class:`mb-3`},{default:r(()=>[i(d,null,{default:r(()=>[i(u,{icon:`cil-user`})]),_:1}),i(f,{placeholder:`Username`,autocomplete:`username`})]),_:1}),i(p,{class:`mb-4`},{default:r(()=>[i(d,null,{default:r(()=>[i(u,{icon:`cil-lock-locked`})]),_:1}),i(f,{type:`password`,placeholder:`Password`,autocomplete:`current-password`})]),_:1}),i(g,null,{default:r(()=>[i(h,{xs:6},{default:r(()=>[i(m,{color:`primary`,class:`px-4`},{default:r(()=>[...c[0]||=[e(` Login `,-1)]]),_:1})]),_:1}),i(h,{xs:6,class:`text-right`},{default:r(()=>[i(m,{color:`link`,class:`px-0`},{default:r(()=>[...c[1]||=[e(` Forgot password? `,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),i(y,{class:`text-white bg-primary py-5`,style:{width:`44%`}},{default:r(()=>[i(v,{class:`text-center`},{default:r(()=>[t(`div`,null,[c[5]||=t(`h2`,null,`Sign up`,-1),c[6]||=t(`p`,null,` Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. `,-1),i(m,{color:`light`,variant:`outline`,class:`mt-3`},{default:r(()=>[...c[4]||=[e(` Register Now! `,-1)]]),_:1})])]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})])}var d=n(c,[[`render`,u]]);export{d as default};
Binary file not shown.

After

Width:  |  Height:  |  Size: 129 KiB

File diff suppressed because one or more lines are too long
+1
View File
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
import{Bt as e,It as t,Mt as n,Qt as r,Vt as i,Xt as a,qt as o,zt as s}from"./index-qNrWYJXL.js";var c={},l={class:`wrapper min-vh-100 d-flex flex-row align-items-center`};function u(n,c){let u=a(`CIcon`),d=a(`CInputGroupText`),f=a(`CFormInput`),p=a(`CButton`),m=a(`CInputGroup`),h=a(`CCol`),g=a(`CRow`),_=a(`CContainer`);return o(),s(`div`,l,[i(_,null,{default:r(()=>[i(g,{class:`justify-content-center`},{default:r(()=>[i(h,{md:6},{default:r(()=>[c[1]||=t(`div`,{class:`clearfix`},[t(`h1`,{class:`float-start display-3 me-4`},`404`),t(`h4`,{class:`pt-3`},`Oops! You're lost.`),t(`p`,{class:`text-body-secondary float-start`},` The page you are looking for was not found. `)],-1),i(m,{class:`input-prepend`},{default:r(()=>[i(d,null,{default:r(()=>[i(u,{icon:`cil-magnifying-glass`})]),_:1}),i(f,{type:`text`,placeholder:`What are you looking for?`}),i(p,{color:`info`},{default:r(()=>[...c[0]||=[e(`Search`,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})])}var d=n(c,[[`render`,u]]);export{d as default};
+1
View File
@@ -0,0 +1 @@
import{Bt as e,It as t,Mt as n,Qt as r,Vt as i,Xt as a,qt as o,zt as s}from"./index-qNrWYJXL.js";var c={},l={class:`wrapper min-vh-100 d-flex flex-row align-items-center`};function u(n,c){let u=a(`CIcon`),d=a(`CInputGroupText`),f=a(`CFormInput`),p=a(`CButton`),m=a(`CInputGroup`),h=a(`CCol`),g=a(`CRow`),_=a(`CContainer`);return o(),s(`div`,l,[i(_,null,{default:r(()=>[i(g,{class:`justify-content-center`},{default:r(()=>[i(h,{md:6},{default:r(()=>[c[1]||=t(`span`,{class:`clearfix`},[t(`h1`,{class:`float-start display-3 me-4`},`500`),t(`h4`,{class:`pt-3`},`Houston, we have a problem!`),t(`p`,{class:`text-body-secondary float-start`},` The page you are looking for is temporarily unavailable. `)],-1),i(m,{class:`input-prepend`},{default:r(()=>[i(d,null,{default:r(()=>[i(u,{icon:`cil-magnifying-glass`})]),_:1}),i(f,{type:`text`,placeholder:`What are you looking for?`}),i(p,{color:`info`},{default:r(()=>[...c[0]||=[e(`Search`,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})])}var d=n(c,[[`render`,u]]);export{d as default};
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
import{$t as e,Bt as t,It as n,Lt as r,Mt as i,Qt as a,Vt as o,Xt as s,Zt as c,qt as l}from"./index-qNrWYJXL.js";var u={};function d(i,u){let d=s(`DocsComponents`),f=s(`CCardHeader`),p=s(`CButton`),m=s(`DocsExample`),h=s(`CCardBody`),g=s(`CCard`),_=s(`CCol`),v=s(`CRow`),y=c(`c-popover`);return l(),r(v,null,{default:a(()=>[o(_,{xs:12},{default:a(()=>[o(d,{href:`components/popover.html`}),o(g,{class:`mb-4`},{default:a(()=>[o(f,null,{default:a(()=>[...u[0]||=[n(`strong`,null,`Vue Popovers`,-1),t(),n(`small`,null,`Basic example`,-1)]]),_:1}),o(h,null,{default:a(()=>[o(m,{href:`components/popover.html#example`},{default:a(()=>[e((l(),r(p,{color:`danger`,size:`lg`},{default:a(()=>[...u[1]||=[t(` Click to toggle popover `,-1)]]),_:1})),[[y,{header:`Popover title`,content:`And heres some amazing content. Its very engaging. Right?`,placement:`right`}]])]),_:1})]),_:1})]),_:1})]),_:1}),o(_,{xs:12},{default:a(()=>[o(g,{class:`mb-4`},{default:a(()=>[o(f,null,{default:a(()=>[...u[2]||=[n(`strong`,null,`Vue Popover`,-1),t(),n(`small`,null,`Four directions`,-1)]]),_:1}),o(h,null,{default:a(()=>[u[7]||=n(`p`,{class:`text-body-secondary small`},` Four options are available: top, right, bottom, and left aligned. Directions are mirrored when using CoreUI for Vue in RTL. `,-1),o(m,{href:`components/popover.html#four-directions`},{default:a(()=>[e((l(),r(p,{color:`secondary`},{default:a(()=>[...u[3]||=[t(`Popover on top`,-1)]]),_:1})),[[y,{content:`Vivamus sagittis lacus vel augue laoreet rutrum faucibus.`,placement:`top`}]]),e((l(),r(p,{color:`secondary`},{default:a(()=>[...u[4]||=[t(`Popover on right`,-1)]]),_:1})),[[y,{content:`Vivamus sagittis lacus vel augue laoreet rutrum faucibus.`,placement:`right`}]]),e((l(),r(p,{color:`secondary`},{default:a(()=>[...u[5]||=[t(`Popover on bottom`,-1)]]),_:1})),[[y,{content:`Vivamus sagittis lacus vel augue laoreet rutrum faucibus.`,placement:`bottom`}]]),e((l(),r(p,{color:`secondary`},{default:a(()=>[...u[6]||=[t(`Popover on left`,-1)]]),_:1})),[[y,{content:`Vivamus sagittis lacus vel augue laoreet rutrum faucibus.`,placement:`left`}]])]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})}var f=i(u,[[`render`,d]]);export{f as default};
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
import{Bt as e,It as t,Lt as n,Mt as r,Qt as i,Vt as a,Xt as o,qt as s}from"./index-qNrWYJXL.js";var c={};function l(r,c){let l=o(`DocsComponents`),u=o(`CCardHeader`),d=o(`CFormLabel`),f=o(`CFormRange`),p=o(`DocsExample`),m=o(`CCardBody`),h=o(`CCard`),g=o(`CCol`),_=o(`CRow`);return s(),n(_,null,{default:i(()=>[a(g,{xs:12},{default:i(()=>[a(l,{href:`forms/range.html`}),a(h,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[0]||=[t(`strong`,null,`Vue Range`,-1),e(),t(`small`,null,null,-1)]]),_:1}),a(m,null,{default:i(()=>[c[2]||=t(`p`,{class:`text-body-secondary small`},[e(` Create custom `),t(`code`,null,`<input type="range">`),e(` controls with `),t(`code`,null,`<CFormRange>`),e(`. `)],-1),a(p,{href:`forms/range.html`},{default:i(()=>[a(d,{for:`customRange1`},{default:i(()=>[...c[1]||=[e(`Example range`,-1)]]),_:1}),a(f,{id:`customRange1`})]),_:1})]),_:1})]),_:1})]),_:1}),a(g,{xs:12},{default:i(()=>[a(h,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[3]||=[t(`strong`,null,`Vue Range`,-1),e(),t(`small`,null,`Disabled`,-1)]]),_:1}),a(m,null,{default:i(()=>[c[5]||=t(`p`,{class:`text-body-secondary small`},[e(` Add the `),t(`code`,null,`disabled`),e(` boolean attribute on an input to give it a grayed out appearance and remove pointer events. `)],-1),a(p,{href:`forms/range.html#disabled`},{default:i(()=>[a(d,{for:`disabledRange`},{default:i(()=>[...c[4]||=[e(`Disabled range`,-1)]]),_:1}),a(f,{id:`disabledRange`,disabled:``})]),_:1})]),_:1})]),_:1})]),_:1}),a(g,{xs:12},{default:i(()=>[a(h,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[6]||=[t(`strong`,null,`Vue Range`,-1),e(),t(`small`,null,`Min and max`,-1)]]),_:1}),a(m,null,{default:i(()=>[c[8]||=t(`p`,{class:`text-body-secondary small`},[e(` Range inputs have implicit values for `),t(`code`,null,`min`),e(` and `),t(`code`,null,`max`),e(``),t(`code`,null,`0`),e(` and `),t(`code`,null,`100`),e(`, respectively. You may specify new values for those using the `),t(`code`,null,`min`),e(` and `),t(`code`,null,`max`),e(` attributes. `)],-1),a(p,{href:`forms/range.html#min-and-max`},{default:i(()=>[a(d,{for:`customRange2`},{default:i(()=>[...c[7]||=[e(`Example range`,-1)]]),_:1}),a(f,{id:`customRange2`,min:0,max:5,value:3})]),_:1})]),_:1})]),_:1})]),_:1}),a(g,{xs:12},{default:i(()=>[a(h,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[9]||=[t(`strong`,null,`Vue Range`,-1),e(),t(`small`,null,`Steps`,-1)]]),_:1}),a(m,null,{default:i(()=>[c[11]||=t(`p`,{class:`text-body-secondary small`},[e(` By default, range inputs "snap" to integer values. To change this, you can specify a `),t(`code`,null,`step`),e(` value. In the example below, we double the number of steps by using `),t(`code`,null,`step="0.5"`),e(`. `)],-1),a(p,{href:`forms/range.html#steps`},{default:i(()=>[a(d,{for:`customRange3`},{default:i(()=>[...c[10]||=[e(`Example range`,-1)]]),_:1}),a(f,{id:`customRange3`,min:0,max:5,step:.5,value:3})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})}var u=r(c,[[`render`,l]]);export{u as default};
+1
View File
@@ -0,0 +1 @@
import{Bt as e,It as t,Mt as n,Qt as r,Vt as i,Xt as a,qt as o,zt as s}from"./index-qNrWYJXL.js";var c={},l={class:`bwrapper min-vh-100 d-flex flex-row align-items-center`},u={class:`d-grid`};function d(n,c){let d=a(`CIcon`),f=a(`CInputGroupText`),p=a(`CFormInput`),m=a(`CInputGroup`),h=a(`CButton`),g=a(`CForm`),_=a(`CCardBody`),v=a(`CCard`),y=a(`CCol`),b=a(`CRow`),x=a(`CContainer`);return o(),s(`div`,l,[i(x,null,{default:r(()=>[i(b,{class:`justify-content-center`},{default:r(()=>[i(y,{md:9,lg:7,xl:6},{default:r(()=>[i(v,{class:`mx-4`},{default:r(()=>[i(_,{class:`p-4`},{default:r(()=>[i(g,null,{default:r(()=>[c[2]||=t(`h1`,null,`Register`,-1),c[3]||=t(`p`,{class:`text-body-secondary`},`Create your account`,-1),i(m,{class:`mb-3`},{default:r(()=>[i(f,null,{default:r(()=>[i(d,{icon:`cil-user`})]),_:1}),i(p,{placeholder:`Username`,autocomplete:`username`})]),_:1}),i(m,{class:`mb-3`},{default:r(()=>[i(f,null,{default:r(()=>[...c[0]||=[e(`@`,-1)]]),_:1}),i(p,{placeholder:`Email`,autocomplete:`email`})]),_:1}),i(m,{class:`mb-3`},{default:r(()=>[i(f,null,{default:r(()=>[i(d,{icon:`cil-lock-locked`})]),_:1}),i(p,{type:`password`,placeholder:`Password`,autocomplete:`new-password`})]),_:1}),i(m,{class:`mb-4`},{default:r(()=>[i(f,null,{default:r(()=>[i(d,{icon:`cil-lock-locked`})]),_:1}),i(p,{type:`password`,placeholder:`Repeat password`,autocomplete:`new-password`})]),_:1}),t(`div`,u,[i(h,{color:`success`},{default:r(()=>[...c[1]||=[e(`Create Account`,-1)]]),_:1})])]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})])}var f=n(c,[[`render`,d]]);export{f as default};
+1
View File
@@ -0,0 +1 @@
import{Bt as e,Ft as t,It as n,Jt as r,Lt as i,Pt as a,Qt as o,Rt as s,Vt as c,Xt as l,an as u,qt as d,zt as f}from"./index-qNrWYJXL.js";import{t as p}from"./ticket-BXPImeUD.js";var m={class:`table-responsive`},h={__name:`Rejected`,setup(h){let g=p(),_=t(()=>g.tickets.filter(e=>e.rejected_by&&e.rejected_by!==`-`));return(t,p)=>{let h=l(`CCardHeader`),g=l(`CTableHeaderCell`),v=l(`CTableRow`),y=l(`CTableHead`),b=l(`CTableDataCell`),x=l(`CTableBody`),S=l(`CTable`),C=l(`CCardBody`),w=l(`CCard`),T=l(`CCol`),E=l(`CRow`);return d(),i(E,null,{default:o(()=>[c(T,{xs:12},{default:o(()=>[c(w,{class:`mb-4`},{default:o(()=>[c(h,null,{default:o(()=>[...p[0]||=[n(`strong`,null,`Rejected Tickets`,-1)]]),_:1}),c(C,null,{default:o(()=>[n(`div`,m,[c(S,{striped:``,hover:``,small:``},{default:o(()=>[c(y,null,{default:o(()=>[c(v,null,{default:o(()=>[c(g,{scope:`col`},{default:o(()=>[...p[1]||=[e(`No`,-1)]]),_:1}),c(g,{scope:`col`},{default:o(()=>[...p[2]||=[e(`Ticket No`,-1)]]),_:1}),c(g,{scope:`col`},{default:o(()=>[...p[3]||=[e(`Kode Tiket`,-1)]]),_:1}),c(g,{scope:`col`},{default:o(()=>[...p[4]||=[e(`Deskripsi`,-1)]]),_:1}),c(g,{scope:`col`},{default:o(()=>[...p[5]||=[e(`Rejected By`,-1)]]),_:1}),c(g,{scope:`col`},{default:o(()=>[...p[6]||=[e(`Rejected At`,-1)]]),_:1}),c(g,{scope:`col`},{default:o(()=>[...p[7]||=[e(`Alasan`,-1)]]),_:1})]),_:1})]),_:1}),c(x,null,{default:o(()=>[(d(!0),f(a,null,r(_.value,(t,n)=>(d(),i(v,{key:t.ticket_no},{default:o(()=>[c(g,{scope:`row`},{default:o(()=>[e(u(n+1),1)]),_:2},1024),c(b,null,{default:o(()=>[e(u(t.ticket_no),1)]),_:2},1024),c(b,null,{default:o(()=>[e(u(t.kode_tiket),1)]),_:2},1024),c(b,null,{default:o(()=>[e(u(t.deskripsi),1)]),_:2},1024),c(b,null,{default:o(()=>[e(u(t.rejected_by),1)]),_:2},1024),c(b,null,{default:o(()=>[e(u(t.rejected_at),1)]),_:2},1024),c(b,null,{default:o(()=>[e(u(t.rejection_reason),1)]),_:2},1024)]),_:2},1024))),128)),_.value.length===0?(d(),i(v,{key:0},{default:o(()=>[c(b,{colspan:`7`,class:`text-center`},{default:o(()=>[...p[8]||=[e(`Tidak ada data rejected tickets`,-1)]]),_:1})]),_:1})):s(``,!0)]),_:1})]),_:1})])]),_:1})]),_:1})]),_:1})]),_:1})}}};export{h as default};
+1
View File
@@ -0,0 +1 @@
import{Bt as e,It as t,Lt as n,Mt as r,Qt as i,Vt as a,Xt as o,qt as s}from"./index-qNrWYJXL.js";var c={};function l(r,c){let l=o(`DocsComponents`),u=o(`CCardHeader`),d=o(`CFormSelect`),f=o(`DocsExample`),p=o(`CCardBody`),m=o(`CCard`),h=o(`CCol`),g=o(`CRow`);return s(),n(g,null,{default:i(()=>[a(h,{xs:12},{default:i(()=>[a(l,{href:`forms/select.html`}),a(m,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[0]||=[t(`strong`,null,`Vue Select`,-1),e(),t(`small`,null,`Default`,-1)]]),_:1}),a(p,null,{default:i(()=>[a(f,{href:`forms/select.html`},{default:i(()=>[a(d,{"aria-label":`Default select example`},{default:i(()=>[...c[1]||=[t(`option`,null,`Open this select menu`,-1),t(`option`,{value:`1`},`One`,-1),t(`option`,{value:`2`},`Two`,-1),t(`option`,{value:`3`},`Three`,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(h,{xs:12},{default:i(()=>[a(m,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[2]||=[t(`strong`,null,`Vue Select`,-1),e(),t(`small`,null,`Sizing`,-1)]]),_:1}),a(p,null,{default:i(()=>[c[7]||=t(`p`,{class:`text-body-secondary small`},` You may also choose from small and large custom selects to match our similarly sized text inputs. `,-1),a(f,{href:`forms/select.html#sizing`},{default:i(()=>[a(d,{size:`lg`,class:`mb-3`,"aria-label":`Large select example`},{default:i(()=>[...c[3]||=[t(`option`,null,`Open this select menu`,-1),t(`option`,{value:`1`},`One`,-1),t(`option`,{value:`2`},`Two`,-1),t(`option`,{value:`3`},`Three`,-1)]]),_:1}),a(d,{size:`sm`,class:`mb-3`,"aria-label":`Small select example`},{default:i(()=>[...c[4]||=[t(`option`,null,`Open this select menu`,-1),t(`option`,{value:`1`},`One`,-1),t(`option`,{value:`2`},`Two`,-1),t(`option`,{value:`3`},`Three`,-1)]]),_:1})]),_:1}),c[8]||=t(`p`,{class:`text-body-secondary small`},[e(` The `),t(`code`,null,`multiple`),e(` attribute is also supported: `)],-1),a(f,{href:`forms/select.html#sizing`},{default:i(()=>[a(d,{size:`lg`,multiple:``,"aria-label":`Multiple select example`},{default:i(()=>[...c[5]||=[t(`option`,null,`Open this select menu`,-1),t(`option`,{value:`1`},`One`,-1),t(`option`,{value:`2`},`Two`,-1),t(`option`,{value:`3`},`Three`,-1)]]),_:1})]),_:1}),c[9]||=t(`p`,{class:`text-body-secondary small`},[e(` As is the `),t(`code`,null,`html-size`),e(` property: `)],-1),a(f,{href:`forms/select.html#sizing`},{default:i(()=>[a(d,{size:`lg`,multiple:``,"aria-label":`Multiple select example`},{default:i(()=>[...c[6]||=[t(`option`,null,`Open this select menu`,-1),t(`option`,{value:`1`},`One`,-1),t(`option`,{value:`2`},`Two`,-1),t(`option`,{value:`3`},`Three`,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1}),a(h,{xs:12},{default:i(()=>[a(m,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[10]||=[t(`strong`,null,`Vue Select`,-1),e(),t(`small`,null,`Disabled`,-1)]]),_:1}),a(p,null,{default:i(()=>[c[12]||=t(`p`,{class:`text-body-secondary small`},[e(` Add the `),t(`code`,null,`disabled`),e(` boolean attribute on a select to give it a grayed out appearance and remove pointer events. `)],-1),a(f,{href:`forms/select.html#disabled`},{default:i(()=>[a(d,{"aria-label":`Disabled select example`,disabled:``},{default:i(()=>[...c[11]||=[t(`option`,null,`Open this select menu`,-1),t(`option`,{value:`1`},`One`,-1),t(`option`,{value:`2`},`Two`,-1),t(`option`,{value:`3`},`Three`,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})}var u=r(c,[[`render`,l]]);export{u as default};
+1
View File
@@ -0,0 +1 @@
import{Bt as e,It as t,Lt as n,Mt as r,Qt as i,Vt as a,Xt as o,qt as s}from"./index-qNrWYJXL.js";var c={};function l(r,c){let l=o(`DocsComponents`),u=o(`CCardHeader`),d=o(`CSpinner`),f=o(`DocsExample`),p=o(`CCardBody`),m=o(`CCard`),h=o(`CCol`),g=o(`CButton`),_=o(`CRow`);return s(),n(_,null,{default:i(()=>[a(h,{xs:12},{default:i(()=>[a(l,{href:`components/spinner.html`}),a(m,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[0]||=[t(`strong`,null,`Vue Spinner`,-1),e(),t(`small`,null,`Border`,-1)]]),_:1}),a(p,null,{default:i(()=>[c[1]||=t(`p`,{class:`text-body-secondary small`},` Use the border spinners for a lightweight loading indicator. `,-1),a(f,{href:`components/spinner.html`},{default:i(()=>[a(d)]),_:1}),c[2]||=t(`p`,{class:`text-body-secondary small`},[e(` The border spinner uses `),t(`code`,null,`currentColor`),e(` for its `),t(`code`,null,`border-color`),e(`. You can use any of our text color utilities on the standard spinner. `)],-1),a(f,{href:`components/spinner.html#colors`},{default:i(()=>[a(d,{color:`primary`}),a(d,{color:`secondary`}),a(d,{color:`success`}),a(d,{color:`danger`}),a(d,{color:`warning`}),a(d,{color:`info`}),a(d,{color:`light`}),a(d,{color:`dark`})]),_:1})]),_:1})]),_:1})]),_:1}),a(h,{xs:12},{default:i(()=>[a(m,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[3]||=[t(`strong`,null,`Vue Spinner`,-1),e(),t(`small`,null,`Growing`,-1)]]),_:1}),a(p,null,{default:i(()=>[c[4]||=t(`p`,{class:`text-body-secondary small`},` If you don'tfancy a border spinner, switch to the grow spinner. While it doesn't technically spin, it does repeatedly grow! `,-1),a(f,{href:`components/spinner.html#growing-spinner`},{default:i(()=>[a(d,{variant:`grow`})]),_:1}),c[5]||=t(`p`,{class:`text-body-secondary small`},[e(` Once again, this spinner is built with `),t(`code`,null,`currentColor`),e(`, so you can easily change its appearance. Here it is in blue, along with the supported variants. `)],-1),a(f,{href:`components/spinner.html#growing-spinner`},{default:i(()=>[a(d,{color:`primary`,variant:`grow`}),a(d,{color:`secondary`,variant:`grow`}),a(d,{color:`success`,variant:`grow`}),a(d,{color:`danger`,variant:`grow`}),a(d,{color:`warning`,variant:`grow`}),a(d,{color:`info`,variant:`grow`}),a(d,{color:`light`,variant:`grow`}),a(d,{color:`dark`,variant:`grow`})]),_:1})]),_:1})]),_:1})]),_:1}),a(h,{xs:12},{default:i(()=>[a(m,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[6]||=[t(`strong`,null,`Vue Spinner`,-1),e(),t(`small`,null,`Size`,-1)]]),_:1}),a(p,null,{default:i(()=>[c[7]||=t(`p`,{class:`text-body-secondary small`},[e(` Add `),t(`code`,null,`size="sm"`),e(` property to make a smaller spinner that can quickly be used within other components. `)],-1),a(f,{href:`components/spinner.html#size`},{default:i(()=>[a(d,{size:`sm`}),a(d,{size:`sm`,variant:`grow`})]),_:1})]),_:1})]),_:1})]),_:1}),a(h,{xs:12},{default:i(()=>[a(m,{class:`mb-4`},{default:i(()=>[a(u,null,{default:i(()=>[...c[8]||=[t(`strong`,null,`Vue Spinner`,-1),e(),t(`small`,null,`Buttons`,-1)]]),_:1}),a(p,null,{default:i(()=>[c[11]||=t(`p`,{class:`text-body-secondary small`},` Use spinners within buttons to indicate an action is currently processing or taking place. You may also swap the text out of the spinner element and utilize button text as needed. `,-1),a(f,{href:`components/spinner.html#buttons`},{default:i(()=>[a(g,{disabled:``},{default:i(()=>[a(d,{as:`span`,size:`sm`,"aria-hidden":`true`})]),_:1}),a(g,{disabled:``},{default:i(()=>[a(d,{as:`span`,size:`sm`,"aria-hidden":`true`}),c[9]||=e(` Loading... `,-1)]),_:1})]),_:1}),a(f,{href:`components/spinner.html#buttons`},{default:i(()=>[a(g,{disabled:``},{default:i(()=>[a(d,{as:`span`,size:`sm`,variant:`grow`,"aria-hidden":`true`})]),_:1}),a(g,{disabled:``},{default:i(()=>[a(d,{as:`span`,size:`sm`,variant:`grow`,"aria-hidden":`true`}),c[10]||=e(` Loading... `,-1)]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})}var u=r(c,[[`render`,l]]);export{u as default};
File diff suppressed because one or more lines are too long
+1
View File
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
import{Bt as e,It as t,Lt as n,Mt as r,Qt as i,Vt as a,Xt as o,qt as s}from"./index-qNrWYJXL.js";var c={};function l(r,c){let l=o(`CCardHeader`),u=o(`CTableHeaderCell`),d=o(`CTableRow`),f=o(`CTableHead`),p=o(`CTableDataCell`),m=o(`CTableBody`),h=o(`CTable`),g=o(`CCardBody`),_=o(`CCard`),v=o(`CCol`),y=o(`CRow`);return s(),n(y,null,{default:i(()=>[a(v,{xs:12},{default:i(()=>[a(_,{class:`mb-4`},{default:i(()=>[a(l,null,{default:i(()=>[...c[0]||=[t(`strong`,null,`Ticket Materials`,-1)]]),_:1}),a(g,null,{default:i(()=>[a(h,{striped:``,hover:``},{default:i(()=>[a(f,null,{default:i(()=>[a(d,null,{default:i(()=>[a(u,{scope:`col`},{default:i(()=>[...c[1]||=[e(`#`,-1)]]),_:1}),a(u,{scope:`col`},{default:i(()=>[...c[2]||=[e(`Material Name`,-1)]]),_:1}),a(u,{scope:`col`},{default:i(()=>[...c[3]||=[e(`Ticket`,-1)]]),_:1}),a(u,{scope:`col`},{default:i(()=>[...c[4]||=[e(`Quantity`,-1)]]),_:1}),a(u,{scope:`col`},{default:i(()=>[...c[5]||=[e(`Unit`,-1)]]),_:1}),a(u,{scope:`col`},{default:i(()=>[...c[6]||=[e(`Cost`,-1)]]),_:1})]),_:1})]),_:1}),a(m,null,{default:i(()=>[a(d,null,{default:i(()=>[a(u,{scope:`row`},{default:i(()=>[...c[7]||=[e(`1`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[8]||=[e(`Cable CAT6`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[9]||=[e(`Network setup`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[10]||=[e(`100`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[11]||=[e(`Meters`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[12]||=[e(`$150.00`,-1)]]),_:1})]),_:1}),a(d,null,{default:i(()=>[a(u,{scope:`row`},{default:i(()=>[...c[13]||=[e(`2`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[14]||=[e(`RJ45 Connector`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[15]||=[e(`Network setup`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[16]||=[e(`50`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[17]||=[e(`Pcs`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[18]||=[e(`$25.00`,-1)]]),_:1})]),_:1}),a(d,null,{default:i(()=>[a(u,{scope:`row`},{default:i(()=>[...c[19]||=[e(`3`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[20]||=[e(`SSD 512GB`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[21]||=[e(`Hardware upgrade`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[22]||=[e(`2`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[23]||=[e(`Pcs`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[24]||=[e(`$200.00`,-1)]]),_:1})]),_:1}),a(d,null,{default:i(()=>[a(u,{scope:`row`},{default:i(()=>[...c[25]||=[e(`4`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[26]||=[e(`RAM 16GB`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[27]||=[e(`Hardware upgrade`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[28]||=[e(`2`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[29]||=[e(`Pcs`,-1)]]),_:1}),a(p,null,{default:i(()=>[...c[30]||=[e(`$180.00`,-1)]]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})}var u=r(c,[[`render`,l]]);export{u as default};
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
import{$t as e,Bt as t,It as n,Lt as r,Mt as i,Qt as a,Vt as o,Xt as s,Zt as c,qt as l}from"./index-qNrWYJXL.js";var u={},d={class:`text-body-secondary`};function f(i,u){let f=s(`DocsComponents`),p=s(`CCardHeader`),m=s(`CLink`),h=s(`DocsExample`),g=s(`CButton`),_=s(`CCardBody`),v=s(`CCard`),y=s(`CCol`),b=s(`CRow`),x=c(`c-tooltip`);return l(),r(b,null,{default:a(()=>[o(y,{xs:12},{default:a(()=>[o(f,{href:`components/tooltip.html`}),o(v,null,{default:a(()=>[o(p,null,{default:a(()=>[...u[0]||=[n(`strong`,null,`Vue Tooltips`,-1),t(),n(`small`,null,`Basic example`,-1)]]),_:1}),o(_,null,{default:a(()=>[u[14]||=n(`p`,{class:`text-body-secondary small`},` Hover over the links below to see tooltips: `,-1),o(h,{href:`components/tooltip.html`},{default:a(()=>[n(`p`,d,[u[5]||=t(` Tight pants next level keffiyeh `,-1),e((l(),r(m,null,{default:a(()=>[...u[1]||=[t(` you probably `,-1)]]),_:1})),[[x,`Tooltip text`]]),u[6]||=t(` haven't heard of them. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney's fixie sustainable quinoa 8-bit american apparel `,-1),e((l(),r(m,null,{default:a(()=>[...u[2]||=[t(` have a `,-1)]]),_:1})),[[x,`Tooltip text`]]),u[7]||=t(` terry richardson vinyl chambray. Beard stumptown, cardigans banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, four loko mcsweeney''s cleanse vegan chambray. A really ironic artisan `,-1),e((l(),r(m,null,{default:a(()=>[...u[3]||=[t(` whatever keytar `,-1)]]),_:1})),[[x,`Tooltip text`]]),u[8]||=t(` scenester farm-to-table banksy Austin `,-1),e((l(),r(m,null,{default:a(()=>[...u[4]||=[t(` twitter handle `,-1)]]),_:1})),[[x,`Tooltip text`]]),u[9]||=t(` freegan cred raw denim single-origin coffee viral. `,-1)])]),_:1}),u[15]||=n(`p`,{class:`text-body-secondary small`},` Hover over the links below to see tooltips: `,-1),o(h,{href:`components/tooltip.html`},{default:a(()=>[e((l(),r(g,{color:`secondary`},{default:a(()=>[...u[10]||=[t(`Tooltip on top`,-1)]]),_:1})),[[x,{content:`Vivamus sagittis lacus vel augue laoreet rutrum faucibus.`,placement:`top`}]]),e((l(),r(g,{color:`secondary`},{default:a(()=>[...u[11]||=[t(`Tooltip on right`,-1)]]),_:1})),[[x,{content:`Vivamus sagittis lacus vel augue laoreet rutrum faucibus.`,placement:`right`}]]),e((l(),r(g,{color:`secondary`},{default:a(()=>[...u[12]||=[t(`Tooltip on bottom`,-1)]]),_:1})),[[x,{content:`Vivamus sagittis lacus vel augue laoreet rutrum faucibus.`,placement:`bottom`}]]),e((l(),r(g,{color:`secondary`},{default:a(()=>[...u[13]||=[t(`Tooltip on left`,-1)]]),_:1})),[[x,{content:`Vivamus sagittis lacus vel augue laoreet rutrum faucibus.`,placement:`left`}]])]),_:1})]),_:1})]),_:1})]),_:1})]),_:1})}var p=i(u,[[`render`,f]]);export{p as default};
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.

After

Width:  |  Height:  |  Size: 165 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 60 KiB

+3
View File
File diff suppressed because one or more lines are too long
BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 57 KiB

File diff suppressed because one or more lines are too long
+12
View File
File diff suppressed because one or more lines are too long
BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 195 KiB

+1
View File
@@ -0,0 +1 @@
import{Nt as e,tn as t}from"./index-qNrWYJXL.js";var n=e(`ticket`,()=>{let e=t([{ticket_no:`TKT-001`,tenant_id:`tenant-01`,customer_id:`CUST-1001`,deskripsi:`Modem Merah`,kode_tiket:`GGN`,status:`Open`,prioritas:`Low`,sla_minutes:`480`,ditugaskan_untuk:`Joko`,created_by:`admin@company.com`,approved_by:`manager@company.com`,approved_at:`2026-06-20 09:00`,rejected_by:`-`,rejected_at:`-`,rejection_reason:`-`,assigned_at:`2026-06-20 09:30`,resolved_at:`-`,closed_at:`-`,created_at:`2026-06-20 08:00`,updated_at:`2026-06-20 09:30`},{ticket_no:`TKT-002`,tenant_id:`tenant-01`,customer_id:`CUST-1002`,deskripsi:`Ganti Perangkat`,kode_tiket:`ONU`,status:`Open`,prioritas:`Medium`,sla_minutes:`240`,ditugaskan_untuk:`Bowo`,created_by:`user@company.com`,approved_by:`-`,approved_at:`-`,rejected_by:`supervisor@company.com`,rejected_at:`2026-06-22 10:00`,rejection_reason:`Duplicate request`,assigned_at:`-`,resolved_at:`-`,closed_at:`-`,created_at:`2026-06-22 09:00`,updated_at:`2026-06-22 10:00`},{ticket_no:`TKT-003`,tenant_id:`tenant-02`,customer_id:`CUST-1003`,deskripsi:`Perawatan Perangkat`,kode_tiket:`MNT`,status:`Closed`,prioritas:`High`,sla_minutes:`720`,ditugaskan_untuk:`Bahlil`,created_by:`client@domain.com`,approved_by:`manager@company.com`,approved_at:`2026-06-23 08:00`,rejected_by:`-`,rejected_at:`-`,rejection_reason:`-`,assigned_at:`2026-06-23 08:30`,resolved_at:`2026-06-24 15:00`,closed_at:`2026-06-24 16:00`,created_at:`2026-06-23 07:00`,updated_at:`2026-06-24 16:00`}]);t([]),t([]);function n(t){e.value.push({...t})}function r(t,n){e.value[t]={...n}}function i(t){e.value.splice(t,1)}function a(t,n){let r=new Date().toISOString().slice(0,16).replace(`T`,` `);e.value[t].approved_by=n,e.value[t].approved_at=r,e.value[t].status=`Approved`}function o(t,n,r){let i=new Date().toISOString().slice(0,16).replace(`T`,` `);e.value[t].rejected_by=n,e.value[t].rejected_at=i,e.value[t].rejection_reason=r,e.value[t].status=`Rejected`}return{tickets:e,addTicket:n,updateTicket:r,deleteTicket:i,approveTicket:a,rejectTicket:o}});export{n as t};
+1
View File
@@ -0,0 +1 @@
var e=``+new URL(`vue-Ces23Jk5.jpg`,import.meta.url).href;export{e as t};
BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 167 KiB

+2
View File
@@ -0,0 +1,2 @@
<?xml version="1.0" encoding="utf-8"?>
<browserconfig><msapplication><tile><square70x70logo src="/ms-icon-70x70.png"/><square150x150logo src="/ms-icon-150x150.png"/><square310x310logo src="/ms-icon-310x310.png"/><TileColor>#ffffff</TileColor></tile></msapplication></browserconfig>
BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 7.1 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

+52
View File
@@ -0,0 +1,52 @@
<!DOCTYPE html>
<!--
* CoreUI Free Vue.js Admin Template
* @version v5.5.0
* @link https://coreui.io/product/free-vue-admin-template/
* Copyright (c) 2026 creativeLabs Łukasz Holeczek
* Licensed under MIT (https://github.com/coreui/coreui-free-vue-admin-template/blob/main/LICENSE)
-->
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0,shrink-to-fit=no">
<meta name="description" content="CoreUI Vue.js Admin Template">
<meta name="author" content="creativeLabs Łukasz Holeczek">
<title>CoreUI Vue.js Admin Template</title>
<!-- favicons for all devices -->
<link rel="apple-touch-icon" sizes="57x57" href="./apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="./apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="./apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="./apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="./apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="./apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="./apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="./apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="./apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="./android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="./favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="./favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="./favicon-16x16.png">
<link rel="manifest" href="./manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="./ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<script>
const userMode = localStorage.getItem('coreui-free-vue-admin-template-theme');
const systemDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
if (userMode === 'dark' || (userMode !== 'light' && systemDarkMode)) {
document.documentElement.dataset.coreuiTheme = 'dark';
}
</script>
<script type="module" crossorigin src="./assets/index-qNrWYJXL.js"></script>
<link rel="stylesheet" crossorigin href="./assets/index-CjWzPGai.css">
</head>
<body>
<noscript>
<strong>We're sorry but this app doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
+41
View File
@@ -0,0 +1,41 @@
{
"name": "CoreUI Free Vue Admin Template",
"icons": [
{
"src": "\/android-icon-36x36.png",
"sizes": "36x36",
"type": "image\/png",
"density": "0.75"
},
{
"src": "\/android-icon-48x48.png",
"sizes": "48x48",
"type": "image\/png",
"density": "1.0"
},
{
"src": "\/android-icon-72x72.png",
"sizes": "72x72",
"type": "image\/png",
"density": "1.5"
},
{
"src": "\/android-icon-96x96.png",
"sizes": "96x96",
"type": "image\/png",
"density": "2.0"
},
{
"src": "\/android-icon-144x144.png",
"sizes": "144x144",
"type": "image\/png",
"density": "3.0"
},
{
"src": "\/android-icon-192x192.png",
"sizes": "192x192",
"type": "image\/png",
"density": "4.0"
}
]
}
BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Some files were not shown because too many files have changed in this diff Show More