11 Commits

Author SHA1 Message Date
peterlu14 fe7284f9e5 [update] all file reformat & lint 2022-12-07 15:27:37 +08:00
peterlu14 0ce03d2e97 [update] add dependency eslint & prittier 2022-12-07 15:27:13 +08:00
peterlu14 c9e57357f0 [update] add dependency windiCss 2022-12-07 13:58:58 +08:00
peterlu14 80d1c88c67 [update] add testing vuestic & pinia page 2022-12-07 13:23:44 +08:00
peterlu14 ee1449bd5a [update] add dependency vuestic-ui 2022-12-07 13:18:44 +08:00
peterlu14 61b1b40a2a [fix] modify files not follow eslint rules 2022-12-07 13:09:02 +08:00
peterlu14 b7f52c902c [update] add dependency Eslint & AirBnb 2022-12-07 13:05:39 +08:00
peterlu14 5e7e3caa9e [update] add dependency pinia 2022-12-07 11:30:44 +08:00
peterlu14 38d7681112 [update] add dependency @types/node & vite config add resolve 2022-12-07 11:30:12 +08:00
peterlu14 d342238cd5 [update] add dependency vue-router 2022-12-07 10:59:40 +08:00
peterlu14 09472835f6 first commit 2022-12-07 10:30:41 +08:00
286 changed files with 2519 additions and 39546 deletions
-115
View File
@@ -1,115 +0,0 @@
aliases:
- &restore_cache
name: Restore Yarn Package Cache
keys:
- yarn-packages-{{ checksum "yarn.lock" }}
- &install_dependencies
name: Install Dependencies
command: yarn install --frozen-lockfile --cache-folder ~/.cache/yarn
- &save_cache
name: Save Yarn Package Cache
key: yarn-packages-{{ checksum "yarn.lock" }}
paths:
- ~/.cache/yarn
docker: &docker
docker:
- image: cimg/node:16.16.0
defaults: &defaults
<<: *docker
parallelism: 1
working_directory: ~/repo
version: 2
jobs:
test:
<<: *defaults
steps:
- checkout
- restore_cache: *restore_cache
- run: *install_dependencies
- save_cache: *save_cache
- run: yarn test:unit
deploy-staging:
<<: *defaults
steps:
- checkout
- run:
name: Add variables
command:
echo "VUE_APP_INCLUDE_DEMOS=true" >> .env.production.local &&
echo "VUE_APP_BUILD_VERSION=true" >> .env.production.local &&
echo "VUE_APP_GTM_ENABLED=false" >> .env.production.local
- restore_cache: *restore_cache
- run: *install_dependencies
- save_cache: *save_cache
- run: yarn build:ci
- add_ssh_keys:
fingerprints:
- "f8:c0:94:79:68:a2:5e:33:9f:78:bc:ad:ed:86:c6:3c"
- run:
name: Add $SERVER_IP to known_hosts
command: ssh-keyscan -H $SERVER_IP >> ~/.ssh/known_hosts
- run:
name: Deploy to hosting
command: |
tar -czf dist.tar.gz ~/repo/dist -C ~/repo/dist .
scp ~/repo/dist.tar.gz $SERVER_USER@$SERVER_IP:~/tmp
ssh $SERVER_USER@$SERVER_IP /bin/bash << EOF
rm -rf $DEPLOY_PATH/*
tar -xzf ~/tmp/dist.tar.gz -C $DEPLOY_PATH
rm -f ~/tmp/dist.tar.gz
EOF
deploy-production:
<<: *defaults
steps:
- checkout
- run:
name: Add variables
command:
echo "VUE_APP_YANDEX_METRICS_KEY=$YANDEX_METRICS_KEY" >> .env.production.local &&
echo "VUE_APP_DRIFT_KEY=$DRIFT_KEY" >> .env.production.local &&
echo "VUE_APP_GTM_KEY=$GTM_KEY" >> .env.production.local &&
echo "VUE_APP_GTM_ENABLED=true" >> .env.production.local &&
echo "VUE_APP_ROUTER_MODE_HISTORY=$ROUTER_MODE_HISTORY" >> .env.production.local
- restore_cache: *restore_cache
- run: *install_dependencies
- save_cache: *save_cache
- run: yarn build:ci
- run:
name: Deploy to hosting
command: |
tar -czf dist.tar.gz ~/repo/dist -C ~/repo/dist .
ssh-keyscan -t rsa $SERVER_IP >> ~/.ssh/known_hosts
scp ~/repo/dist.tar.gz $SERVER_USERNAME@$SERVER_IP:~/
ssh $SERVER_USERNAME@$SERVER_IP << EOF
mkdir -p tmp
rm -rf $PRODUCTION_DEPLOY_PATH/*
tar -xzf ~/dist.tar.gz -C $PRODUCTION_DEPLOY_PATH
rm -rf ~/dist.tar.gz ~/tmp
EOF
workflows:
version: 2
build-and-deploy:
jobs:
# - test
- deploy-staging:
# requires:
# - test
context: vuestic-admin-staging
filters:
branches:
only: develop
- deploy-production:
# requires:
# - test
context: vuestic-production
filters:
branches:
only: master
-7
View File
@@ -1,7 +0,0 @@
node_modules/
dist/
.dockerignore
.gitattributes
.gitignore
Dockerfile
README.md
-9
View File
@@ -1,9 +0,0 @@
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
-7
View File
@@ -1,7 +0,0 @@
VITE_APP_GTM_KEY=
VITE_APP_INCLUDE_DEMOS=
VITE_APP_ROUTER_MODE_HISTORY=
VITE_APP_BUILD_VERSION=
+28
View File
@@ -0,0 +1,28 @@
module.exports = {
env: {
browser: true,
es2021: true,
// 新增 fix module export
node: true,
},
extends: [
'eslint:recommended',
'plugin:vue/vue3-essential',
'plugin:@typescript-eslint/recommended',
// 新增,必须放在最后面
// 'airbnb',
// 'prettier',
'plugin:prettier/recommended',
],
overrides: [],
// 新增
parser: 'vue-eslint-parser',
parserOptions: {
ecmaVersion: 'latest',
// 新增
parser: '@typescript-eslint/parser',
sourceType: 'module',
},
plugins: ['vue', '@typescript-eslint'],
rules: {},
}
-33
View File
@@ -1,33 +0,0 @@
module.exports = {
root: true,
env: {
browser: true,
es2021: true,
node: true,
'vue/setup-compiler-macros': true,
},
plugins: ['@typescript-eslint'],
parser: 'vue-eslint-parser',
parserOptions: {
parser: '@typescript-eslint/parser',
sourceType: 'module',
ecmaVersion: 2021,
},
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'plugin:vue/vue3-recommended',
'@vue/typescript/recommended',
'@vue/prettier',
],
rules: {
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'prettier/prettier': ['warn', {}, { usePrettierrc: true }],
'@typescript-eslint/no-non-null-assertion': 0,
'@typescript-eslint/no-explicit-any': 0, // allow explicit any's because of the legacy code and ts-less deps, but still prohibit IMplicit any's
'vue/multi-word-component-names': 0,
'vue/no-lone-template': 0,
},
}
-4
View File
@@ -22,7 +22,3 @@ dist-ssr
*.njsproj
*.sln
*.sw?
# Local Netlify folder
.netlify
netlify.toml
-1
View File
@@ -1 +0,0 @@
_
-4
View File
@@ -1,4 +0,0 @@
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"
npx lint-staged
-1
View File
@@ -1 +0,0 @@
16
-18
View File
@@ -1,18 +0,0 @@
# Ignore everything recursively...
*
# But not the .{ts,js,html,css,scss,vue,json,md} files
!*.ts
!*.js
!*.html
!*.css
!*.scss
!*.vue
!*.json
!*.md
# But still ignore the dist folder
dist/**
# Check subdirectories too
!*/
+7 -8
View File
@@ -1,10 +1,9 @@
{
"tabWidth": 2,
"semi": false,
"singleQuote": true,
"quoteProps": "as-needed",
"trailingComma": "all",
"bracketSpacing": true,
"printWidth": 120,
"vueIndentScriptAndStyle": true
"printWidth": 80,
"tabWidth": 2,
"useTabs": false,
"singleQuote": true,
"semi": false,
"trailingComma": "all",
"bracketSpacing": true
}
-73
View File
@@ -1,73 +0,0 @@
# Contributor Covenant Code of Conduct
## Our Pledge
In the interest of fostering an open and welcoming environment, we as
contributors and maintainers pledge to making participation in our project and
our community a harassment-free experience for everyone, regardless of age, body
size, disability, ethnicity, sex characteristics, gender identity and expression,
level of experience, education, socio-economic status, nationality, personal
appearance, race, religion, or sexual identity and orientation.
## Our Standards
Examples of behavior that contributes to creating a positive environment
include:
- Using welcoming and inclusive language
- Being respectful of differing viewpoints and experiences
- Gracefully accepting constructive criticism
- Focusing on what is best for the community
- Showing empathy towards other community members
Examples of unacceptable behavior by participants include:
- The use of sexualized language or imagery and unwelcome sexual attention or
advances
- Trolling, insulting/derogatory comments, and personal or political attacks
- Public or private harassment
- Publishing others' private information, such as a physical or electronic
address, without explicit permission
- Other conduct which could reasonably be considered inappropriate in a
professional setting
## Our Responsibilities
Project maintainers are responsible for clarifying the standards of acceptable
behavior and are expected to take appropriate and fair corrective action in
response to any instances of unacceptable behavior.
Project maintainers have the right and responsibility to remove, edit, or
reject comments, commits, code, wiki edits, issues, and other contributions
that are not aligned to this Code of Conduct, or to ban temporarily or
permanently any contributor for other behaviors that they deem inappropriate,
threatening, offensive, or harmful.
## Scope
This Code of Conduct applies both within project spaces and in public spaces
when an individual is representing the project or its community. Examples of
representing a project or community include using an official project e-mail
address, posting via an official social media account, or acting as an appointed
representative at an online or offline event. Representation of a project may be
further defined and clarified by project maintainers.
## Enforcement
Instances of abusive, harassing, or otherwise unacceptable behavior may be
reported by contacting the project team at [INSERT EMAIL ADDRESS]. All
complaints will be reviewed and investigated and will result in a response that
is deemed necessary and appropriate to the circumstances. The project team is
obligated to maintain confidentiality with regard to the reporter of an incident.
Further details of specific enforcement policies may be posted separately.
Project maintainers who do not follow or enforce the Code of Conduct in good
faith may face temporary or permanent repercussions as determined by other
members of the project's leadership.
## Attribution
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html
[homepage]: https://www.contributor-covenant.org
-13
View File
@@ -1,13 +0,0 @@
FROM node:14
WORKDIR /app
COPY . /app
EXPOSE 8080
RUN npm install http-server -g
RUN npm install --no-optional && npm run build
CMD http-server ./dist
-21
View File
@@ -1,21 +0,0 @@
MIT License
Copyright (c) 2021 Epicmax LLC
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
-146
View File
@@ -1,146 +0,0 @@
<p align="center">
<a href="./README.md"> English </a> | <a href="./README.zh-CN.md"> 简体中文 </a> | 日本語
</p>
<h1 align="center"> Vuestic Admin </h1>
<p align="center">
38+のカスタムUIコンポーネントと美しいデザインのVue.js無料管理画面テンプレート</br>
開発者 <a href="https://epicmax.co">Epicmax</a>.
デザイン <a href="#">Vasili Savitski</a>
</p>
<p align="center">
<a href="https://vuestic.epicmax.co"> デモ </a> | <a href="[THEME_URL]"> 新しい白いテーマのデモ </a> | <a href="https://github.com/epicmaxco/vuestic-admin/wiki"> 説明書 </a>
</p>
<p align="center">
<a href="https://vuestic.epicmax.co" target="_blank">
<img src="https://i.imgur.com/RMchKNW.jpg" align="center" width="888px"/>
</a>
</p>
<p align="center">
<a href="https://circleci.com/gh/epicmaxco/vuestic-admin">
<img src="https://img.shields.io/circleci/build/github/epicmaxco/vuestic-admin/master" alt="Circleci">
</a>
</p>
<h2>
<a href="[THEME_URL]" target="_blank">
新しい白いテーマのデモ
</a>
</h2>
<p align="center">
<a href="[THEME_URL]" target="_blank">
<img src="https://i.imgur.com/DnFcrjD.png" align="center" width="888px"/>
</a>
</p>
## インストール方法
まず初めに、事前に必要なソフトが全てインストールされていることを確認してください。
- [Node.js](https://nodejs.org/en/) (>=8.9)
- [npm](https://www.npmjs.com/get-npm) バージョン 3+ (あるいは[yarn](https://yarnpkg.com/lang/en/docs/install/#mac-stable)バージョン 1.16+) と[Git](https://git-scm.com/).
必要なソフトウェアがインストールされていることを確認できたら、次に示す簡単なステップに沿って Vuestic Admin をインストールして、ご使用ください。
```
# repoをクローン
$ git clone https://github.com/epicmaxco/vuestic-admin.git myproject
# appディレクトリに移動し、dependenciesをインストール
$ cd myproject
```
npm をご使用の方:
```
$ npm install
# localhost:8080(デフォルト)でホットリロードを使ってサーブ
$ npm run dev
# プロダクション用にビルド
$ npm run build
# プロダクション用にビルドして、バンドルアナライザーレポートを閲覧
$ npm run build --report
```
yarn をご使用の方:
```
$ yarn install
# localhost:8080(デフォルト)でホットリロードを使ってサーブ
$ yarn dev
# プロダクション用にビルド
$ yarn build
# プロダクション用にビルドして、バンドルアナライザーレポートを閲覧
$ yarn build --report
```
## 機能
[レスポンシブレイアウト](https://vuestic.epicmax.co/#/admin/dashboard) |
[チャート (Chart.js)](https://vuestic.epicmax.co/#/admin/statistics/charts) |
[プログレスバー](https://vuestic.epicmax.co/#/admin/statistics/progress-bars) |
[フォーム](https://vuestic.epicmax.co/#/admin/forms/form-elements) |
[セレクト](https://vuestic.epicmax.co/#/admin/forms/form-elements) |
[デートピッカー](https://vuestic.epicmax.co/#/admin/forms/form-elements) |
[チェックボックス・ラジオ](https://vuestic.epicmax.co/#/admin/forms/form-elements) |
[スタティックテーブル・データテーブル](https://vuestic.epicmax.co/#/admin/tables/data) |
[medium エディタ](https://vuestic.epicmax.co/#/admin/forms/medium-editor) |
[スムーズタイポグラフィ](https://vuestic.epicmax.co/#/admin/ui/typography) |
[ボタン](https://vuestic.epicmax.co/#/admin/ui/buttons) |
[折りたたみ](https://vuestic.epicmax.co/#/admin/ui/collapses) |
[カラーピッカー](https://vuestic.epicmax.co/#/admin/ui/color-pickers) |
[タイムライン](https://vuestic.epicmax.co/#/admin/ui/timelines) |
[トースト](https://vuestic.epicmax.co/#/admin/ui/notifications) |
[ツールチップ](https://vuestic.epicmax.co/#/admin/ui/popovers) |
[ポップオーバー](https://vuestic.epicmax.co/#/admin/ui/popovers) |
[アイコン](https://vuestic.epicmax.co/#/admin/ui/icons/) |
[スピナー](https://vuestic.epicmax.co/#/admin/ui/spinners) |
[モーダル](https://vuestic.epicmax.co/#/admin/ui/modals) |
[ファイルアップロード](https://vuestic.epicmax.co/#/admin/ui/file-upload) |
[チップ](https://vuestic.epicmax.co/#/admin/ui/chips) |
[ツリー](https://vuestic.epicmax.co/#/admin/ui/tree-view) |
[カード ](https://vuestic.epicmax.co/#/admin/ui/cards) |
[レーティング](https://vuestic.epicmax.co/#/admin/ui/rating) |
[スライダー](https://vuestic.epicmax.co/#/admin/ui/sliders) |
[チャット](https://vuestic.epicmax.co/#/admin/ui/chat) |
[マップ (MapLibre, Yandex, Leaflet, amMap)](https://vuestic.epicmax.co/#/admin/maps/maplibre-maps) |
[ログイン/登録ページテンプレート](https://vuestic.epicmax.co/#/auth/login) |
[404 ページテンプレート](https://vuestic.epicmax.co/#/admin/pages/404-pages) |
[i18n](https://vuestic.epicmax.co/#/admin/dashboard)
## ブラウザサポート
| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera |
| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
## 支援メンバー
素晴らしい PR、課題、アイデアをご提供いただきいつもありがとうございます。[参加](https://github.com/epicmaxco/vuestic-admin/blob/master/.github/CONTRIBUTING.md)いただける方を常に受け付けています!
[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/0)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/0)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/1)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/1)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/2)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/2)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/3)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/3)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/4)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/4)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/5)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/5)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/6)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/6)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/7)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/7)
## あなた方に仕事を依頼することはできますか?
はい!一声おかけください:[hello@epicmax.co](mailto:hello@epicmax.co) </br>
ぜひ一緒に仕事をしましょう!その他これまでやってきた仕事 - [epicmax.co](https://epicmax.co)
## ソーシャルネットワーク
Vuestic の最新ニュースを受け取ろう![Twitter](https://twitter.com/epicmaxco)や [Facebook](https://facebook.com/epicmaxco)でフォローしてください。
## ライセンス
[MIT](https://github.com/epicmaxco/vuestic-admin/blob/master/LICENSE) license
+9 -182
View File
@@ -1,189 +1,16 @@
<p align="center">
<a href="https://vuestic.dev" target="_blank">
<img alt="Vuestic UI Logo" width="500" src="./public/vuestic-admin-logo.png">
</a>
</p>
# Vue 3 + TypeScript + Vite
<p align="center">
Free and beautiful Vue.js admin template with 44+ custom UI components.</br>
Developed by <a href="https://epicmax.co">Epicmax</a>.
Designed by <a href="#">Vasili Savitski</a>
<br>
Based on <a href="https://github.com/epicmaxco/vuestic-ui">Vuestic UI</a> library.
</p>
This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
<p align="center">
<a href="https://vuestic.epicmax.co/admin/dashboard?theme=light"> Light theme demo </a> | <a href="https://vuestic.epicmax.co/admin/dashboard?theme=semi-dark">Semi-dark theme demo </a> | <a href="https://vuestic.epicmax.co/admin/dashboard?theme=original">Original theme demo </a> | <a href="https://vuestic.dev"> Vuestic UI documentation </a>
</p>
## Recommended IDE Setup
> Vuestic Admin is built with Vuestic UI. See our
> <a href="https://github.com/epicmaxco/vuestic-ui/issues">issues</a>,
> <a href="https://vuestic.dev/en/contribution/guide">contributing guide</a> and join discussions on our
> <a href="https://discord.gg/jTKTjj2weV">discord server</a> to help us improve Vuestic Admin & Vuestic UI experience.
- [VS Code](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar)
<p align="center">
<a href="https://vuestic.epicmax.co" target="_blank">
<img src="./public/vuestic-admin-image.jpg" align="center" width="888px"/>
</a>
</p>
## Type Support For `.vue` Imports in TS
<p align="center">
<a href="https://circleci.com/gh/epicmaxco/vuestic-admin">
<img src="https://img.shields.io/circleci/build/github/epicmaxco/vuestic-admin/master" alt="Circleci">
</a>
</p>
Since TypeScript cannot handle type information for `.vue` imports, they are shimmed to be a generic Vue component type by default. In most cases this is fine if you don't really care about component prop types outside of templates. However, if you wish to get actual prop types in `.vue` imports (for example to get props validation when using manual `h(...)` calls), you can enable Volar's Take Over mode by following these steps:
### Documentation
1. Run `Extensions: Show Built-in Extensions` from VS Code's command palette, look for `TypeScript and JavaScript Language Features`, then right click and select `Disable (Workspace)`. By default, Take Over mode will enable itself if the default TypeScript extension is disabled.
2. Reload the VS Code window by running `Developer: Reload Window` from the command palette.
Documentation, guides and tutorials are available
on <a href="https://vuestic.dev">vuestic.dev</a>
### Official Discord Server
Ask questions at the official
community [discord server](https://discord.gg/jTKTjj2weV)
### Installation
First of all, make sure you have all prerequisites installed:
- [Node.js](https://nodejs.org/en/) ( >=14.\*)
- [npm](https://www.npmjs.com/get-npm) version 3+ (
or [yarn](https://yarnpkg.com/lang/en/docs/install) version 1.16+)
and [Git](https://git-scm.com).
After checking the prerequisites, follow these simple steps to install and use
Vuestic Admin:
```
# clone the repo
$ git clone https://github.com/epicmaxco/vuestic-admin.git myproject
# go into app's directory and install dependencies:
$ cd myproject
```
Then, if you use npm:
```
$ npm install
# serve with hot reload at localhost:8080 by default.
$ npm run dev
# build for production
$ npm run build
# build for production and view the bundle analyzer report.
$ npm run build --report
```
If you use yarn:
```
$ yarn install
# serve with hot reload at localhost:8080 by default.
$ yarn dev
# build for production
$ yarn build
# build for production and view the bundle analyzer report.
$ yarn build --report
```
### Features
[Responsive layout](https://vuestic.epicmax.co/admin/dashboard) |
[charts (Chart.js)](https://vuestic.epicmax.co/admin/statistics/charts) |
[progress bars](https://vuestic.epicmax.co/admin/statistics/progress-bars) |
[forms](https://vuestic.epicmax.co/admin/forms/form-elements) |
[selects](https://vuestic.epicmax.co/admin/forms/form-elements) |
[date pickers](https://vuestic.epicmax.co/admin/forms/form-elements) |
[checkboxes and radios](https://vuestic.epicmax.co/admin/forms/form-elements)
|
[static tables and data tables](https://vuestic.epicmax.co/admin/tables/data)
|
[medium editor](https://vuestic.epicmax.co/admin/forms/medium-editor) |
[smooth typography](https://vuestic.epicmax.co/admin/ui/typography) |
[buttons](https://vuestic.epicmax.co/admin/ui/buttons) |
[collapses](https://vuestic.epicmax.co/admin/ui/collapses) |
[color pickers](https://vuestic.epicmax.co/admin/ui/color-pickers) |
[timelines](https://vuestic.epicmax.co/admin/ui/timelines) |
[toasts](https://vuestic.epicmax.co/admin/ui/notifications) |
[tooltips](https://vuestic.epicmax.co/admin/ui/popovers) |
[popovers](https://vuestic.epicmax.co/admin/ui/popovers) |
[icons](https://vuestic.epicmax.co/admin/ui/icons/) |
[spinners](https://vuestic.epicmax.co/admin/ui/spinners) |
[modals](https://vuestic.epicmax.co/admin/ui/modals) |
[file upload](https://vuestic.epicmax.co/admin/ui/file-upload) |
[chips](https://vuestic.epicmax.co/admin/ui/chips) |
[trees](https://vuestic.epicmax.co/admin/ui/tree-view) |
[cards](https://vuestic.epicmax.co/admin/ui/cards) |
[ratings](https://vuestic.epicmax.co/admin/ui/rating) |
[sliders](https://vuestic.epicmax.co/admin/ui/sliders) |
[chat](https://vuestic.epicmax.co/admin/ui/chat) |
[maps (MapLibre, Yandex, Leaflet, amMap)](https://vuestic.epicmax.co/admin/maps/maplibre-maps)
|
[login/signup pages templates](https://vuestic.epicmax.co/auth/login) |
[404 pages templates](https://vuestic.epicmax.co/admin/pages/404-pages) |
[i18n](https://vuestic.epicmax.co/admin/dashboard)
### Browser Support
We design Vuestic Admin to support the latest modern web browsers.
| <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="Edge" width="24px" height="24px" /><br>Edge | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" /><br>Firefox | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" /><br>Chrome | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" /><br>Safari | <img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" /><br>Opera |
| ------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------- |
| Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
### Contributing
Thanks for all your wonderful PRs, issues and ideas.
<a href="https://github.com/epicmaxco/vuestic-admin/graphs/contributors">
<img src="https://opencollective.com/vuestic-admin/contributors.svg?width=890&button=false" />
</a>
<br>
Youre always welcome to join: check out
our <a href="https://vuestic.dev/en/contribution/guide">
contribution guides</a>
, [open issues](https://github.com/epicmaxco/vuestic-ui/issues)
and [discord server](https://discord.gg/jTKTjj2weV)
### Partners & Sponsors ❤️
<div>
<a href="https://epicmax.co/" target="_blank" title="Epicmax - Top Vue.js Development Company"><img src="./.github/assets/epicmax.svg" loading="lazy" vspace="10" alt=""></a>
<a href="https://www.ag-grid.com/" target="_blank" title=" Data Grid: AG Grid: High-Performance React Grid, Angular Grid, JavaScript Grid"><img hspace="15" vspace="10" src="./.github/assets/aggrid.svg" loading="lazy" alt=""></a>
<a href="https://vuejobs.com/" target="_blank" title="Vue.js jobs Browse through dozens of Vue.js openings"><img src="./.github/assets/vuejobs.svg" loading="lazy" vspace="10" alt=""></a>
<a href="https://flatlogic.com/" target="_blank" title="Flatlogic - The best way to create React, Angular and Vue full-stack web applications"><img hspace="15" vspace="10" src="./.github/assets/flatlogic.svg" loading="lazy" alt=""></a>
</div>
<br >
Become a partner: [hello@epicmax.co](mailto:hello@epicmax.co)
## Can I hire you guys?
Yes! Say hi: [hello@epicmax.co](mailto:hello@epicmax.co) </br>
We will be happy to work with you! Other [work weve done](https://epicmax.co)
### Awards
<a href="https://flatlogic.com/templates/vuestic-vue-free-admin" target="_blank">
<img src="https://i.imgur.com/ZeQPZ3Q.png" align="center" width="150px"/>
</a>
<p>
By <a href="https://flatlogic.com/templates/vuestic-vue-free-admin" target="_blank">@flatlogic</a> marketplace
</p>
### Follow us
Stay up to date with the latest Vuestic news! Follow us
on [Twitter](https://twitter.com/epicmaxco)
or [Facebook](https://facebook.com/epicmaxco)
### License
[MIT](https://github.com/epicmaxco/vuestic-admin/blob/master/LICENSE) license.
You can learn more about Take Over mode [here](https://github.com/johnsoncodehk/volar/discussions/471).
-146
View File
@@ -1,146 +0,0 @@
<p align="center">
<a href="./README.md"> English </a> | 简体中文 | <a href="./README.ja-JP.md"> 日本語 </a>
</p>
<h1 align="center"> Vuestic Admin </h1>
<p align="center">
免费与美妙Vue.js管理模板包括38以上个定制用户界面组件</br>
由<a href="https://epicmax.co">Epicmax</a>开发。
由<a href="#">Vasili Savitski</a>设计
</p>
<p align="center">
<a href="https://vuestic.epicmax.co"> 演示版 </a> | <a href="[THEME_URL]"> 新白色主题演示 </a> | <a href="https://github.com/epicmaxco/vuestic-admin/wiki"> 文档 </a>
</p>
<p align="center">
<a href="https://vuestic.epicmax.co" target="_blank">
<img src="https://i.imgur.com/hVxoYQM.jpg" align="center" width="888px"/>
</a>
</p>
<p align="center">
<a href="https://circleci.com/gh/epicmaxco/vuestic-admin">
<img src="https://img.shields.io/circleci/build/github/epicmaxco/vuestic-admin/master" alt="Circleci">
</a>
</p>
<h2>
<a href="[THEME_URL]" target="_blank">
新白色主题演示
</a>
</h2>
<p align="center">
<a href="[THEME_URL]" target="_blank">
<img src="https://i.imgur.com/DnFcrjD.png" align="center" width="888px"/>
</a>
</p>
## 安装
首先确定 ni 安装所有的先决条件:
- [Node.js](https://nodejs.org/en/) (>=8.9)
- [npm](https://www.npmjs.com/get-npm) 3+版本 (或许[yarn](https://yarnpkg.com/lang/en/docs/install/#mac-stable) 1.16+版本) 和[Git](https://git-scm.com/)。
检查先决条件之后,用简单指令之下安装与应用 Vuestic 管理台:
```
#克隆存储库
$ git clone https://github.com/epicmaxco/vuestic-admin.git myproject
#进入应用目录与安装依赖
$ cd myproject
```
之后,如果您用 npm:
```
$ npm install
#默认情况下在localhost:8080用热重载
$ npm run dev
#构建生产
$ npm run build
#构建生产与查看包分析报表
$ npm run build --report
```
如果您用 yarn:
```
$ yarn install
#默认情况下在localhost:8080用热重载
$ yarn dev
#构建生产
$ yarn build
#构建生产与查看包分析报表
$ yarn build --report
```
## 功能
[响应布局](https://vuestic.epicmax.co/#/admin/dashboard) |
[图表(Charts.js)](https://vuestic.epicmax.co/#/admin/statistics/charts) |
[进度表](https://vuestic.epicmax.co/#/admin/statistics/progress-bars) |
[表格](https://vuestic.epicmax.co/#/admin/forms/form-elements) |
[选辑](https://vuestic.epicmax.co/#/admin/forms/form-elements) |
[日期选择器](https://vuestic.epicmax.co/#/admin/forms/form-elements) |
[复选框和单选框](https://vuestic.epicmax.co/#/admin/forms/form-elements) |
[静态表与数据表](https://vuestic.epicmax.co/#/admin/tables/data) |
[medium editor](https://vuestic.epicmax.co/#/admin/forms/medium-editor) |
[平滑设计字体](https://vuestic.epicmax.co/#/admin/ui/typography) |
[按钮](https://vuestic.epicmax.co/#/admin/ui/buttons) |
[塌缩](https://vuestic.epicmax.co/#/admin/ui/collapses) |
[颜色选择器](https://vuestic.epicmax.co/#/admin/ui/color-pickers) |
[时间线](https://vuestic.epicmax.co/#/admin/ui/timelines) |
[土司通知](https://vuestic.epicmax.co/#/admin/ui/notifications) |
[工具提示](https://vuestic.epicmax.co/#/admin/ui/popovers) |
[弹窗](https://vuestic.epicmax.co/#/admin/ui/popovers) |
[图标](https://vuestic.epicmax.co/#/admin/ui/icons/) |
[自旋体](https://vuestic.epicmax.co/#/admin/ui/spinners) |
[模式](https://vuestic.epicmax.co/#/admin/ui/modals) |
[文件上传](https://vuestic.epicmax.co/#/admin/ui/file-upload) |
[厚切薯条通知](https://vuestic.epicmax.co/#/admin/ui/chips) |
[](https://vuestic.epicmax.co/#/admin/ui/tree-view) |
[卡片](https://vuestic.epicmax.co/#/admin/ui/cards) |
[等级](https://vuestic.epicmax.co/#/admin/ui/rating) |
[滑动器](https://vuestic.epicmax.co/#/admin/ui/sliders) |
[聊天系统](https://vuestic.epicmax.co/#/admin/ui/chat) |
[地图(MapLibre, Yandex, Leaflet, amMap)](https://vuestic.epicmax.co/#/admin/maps/maplibre-maps) |
[登录/注册页模板](https://vuestic.epicmax.co/#/auth/login) |
[404 页模板](https://vuestic.epicmax.co/#/admin/pages/404-pages) |
[i18n](https://vuestic.epicmax.co/#/admin/dashboard)
## 支持的浏览器
| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera |
| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
## 参与贡献
多谢您的出色公关、问题与注意。随时欢迎您的[加入](https://github.com/epicmaxco/vuestic-admin/blob/master/.github/CONTRIBUTING.md)!
[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/0)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/0)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/1)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/1)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/2)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/2)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/3)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/3)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/4)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/4)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/5)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/5)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/6)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/6)[![](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/images/7)](https://sourcerer.io/fame/smartapant/epicmaxco/vuestic-admin/links/7)
## 我可以雇佣你们吗?
当然!给[hello@epicmax.co](mailto:hello@epicmax.co)发电子邮件 </br>
和您一起工作我们将很高兴!查看我们其它项目 - [epicmax.co](https://epicmax.co)
## 关注我们
敬请期待 Vuestic 最新消息!关注我们[Twitter](https://twitter.com/epicmaxco)与[Facebook](https://facebook.com/epicmaxco)
## 许可证
[MIT](https://github.com/epicmaxco/vuestic-admin/blob/master/LICENSE)许可证.
-7
View File
@@ -1,7 +0,0 @@
'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')
module.exports = merge(prodEnv, {
NODE_ENV: '"development"',
})
-39
View File
@@ -1,39 +0,0 @@
'use strict'
const path = require('path')
module.exports = {
build: {
env: require('./prod.env'),
index: path.resolve(__dirname, '../dist/index.html'),
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static',
assetsPublicPath: '/',
productionSourceMap: true,
// Gzip off by default as many popular static hosts such as
// Surge or Netlify already gzip all static assets for you.
// Before setting to `true`, make sure to:
// npm install --save-dev compression-webpack-plugin
productionGzip: false,
productionGzipExtensions: ['js', 'css'],
// Run the build command with an extra argument to
// View the bundle analyzer report after build finishes:
// `npm run build --report`
// Set to `true` or `false` to always turn it on or off
bundleAnalyzerReport: process.env.npm_config_report,
},
dev: {
env: require('./dev.env'),
port: process.env.PORT || 8080,
autoOpenBrowser: true,
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {},
// CSS Sourcemaps off by default because relative paths are "buggy"
// with this option, according to the CSS-Loader README
// (https://github.com/webpack/css-loader#sourcemaps)
// In our experience, they generally work as expected,
// just be aware of this issue when enabling this option.
cssSourceMap: false,
},
}
-4
View File
@@ -1,4 +0,0 @@
'use strict'
module.exports = {
NODE_ENV: '"production"',
}
-50
View File
@@ -1,50 +0,0 @@
# Pre-production
## SEO
We have a boierplate prepared with some analytics ingrained. This includes:
- [Yandex Metrica](https://metrica.yandex.com/about)
To get these running - just provide keys to respective apis. You're advised to copy `.env.example` with rename to `.env` then modify it.
Notice, that if you are about to use Google Maps then you also have to provide it with your personal API key. The key must be defined under the `VUE_APP_GOOGLE_MAPS_API_KEY` environment-variable (more on them below) and can be obtained [here](https://developers.google.com/maps/documentation/javascript/get-api-key).
## Deploy
We use [circleci](https://circleci.com) to deploy vuestic version you're able to see on demo.
If you want to save some time and use our config, do notice that circleci will need the following keys, that you have to set in **Build Settings -> Environment Variables**.
- `DEPLOY_PASSWORD` ssh password.
- `DEPLOY_PATH_PRODUCTION` production build will be loaded to this folder.
- `DEPLOY_PATH_STAGING` staging build will be loaded to this folder.
- `DEPLOY_URL` ssh url.
- `DEPLOY_USER` ssh password.
You can modify [config](../.circleci/config.yml) if our solution doesn't suit your needs exactly.
Couple of things to note:
- in `.env` file keys should look like this `VUE_APP_DRIFT_KEY`. Which will correspond to circleci key `DRIFT_KEY`. You essentially have two ways to pass config into build process.
- Circleci will run tests before both staging and production.
## Demos
You can enable demos in build by:
```
VUE_APP_INCLUDE_DEMOS=true
```
Demos are included in staging build by default. They're not present in production because of significant impact on bundle size.
## Build Version
You can enable build version, hash commit, and timestamp by build to the main page footer:
```
VUE_APP_BUILD_VERSION=true
```
This information are excluded by default.
+11 -7
View File
@@ -1,14 +1,18 @@
<!DOCTYPE html>
<html lang="en" class="bg-red-500">
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:400" rel="stylesheet" />
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" />
<link rel="icon" href="/favicon.ico" />
<title>Vuestic Admin</title>
<title>Vite + Vue + TS</title>
<link
href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,400;1,700&display=swap"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet"
/>
</head>
<body>
<div id="app"></div>
-4580
View File
File diff suppressed because it is too large Load Diff
+26 -59
View File
@@ -1,69 +1,36 @@
{
"name": "vuestic-admin",
"name": "vite-project",
"private": true,
"version": "3.1.0",
"version": "0.0.0",
"type": "module",
"scripts": {
"prepare": "husky install",
"dev": "vite",
"build": "npm run lint && vue-tsc --noEmit && vite build",
"build:ci": "vite build",
"prelint": "npm run format",
"lint": "eslint --fix './src/**/*.{ts,js,vue}'",
"format": "prettier --write .",
"preview": "vite preview"
},
"lint-staged": {
"./src/**/*.{ts,js,vue}": [
"npm run lint"
]
"build": "vue-tsc && vite build",
"preview": "vite preview",
"lint": "eslint . --ext .vue,.js,.ts,.jsx,.tsx --fix",
"format": "prettier --write \"./**/*.{html,vue,ts,js,json,md}\""
},
"dependencies": {
"@amcharts/amcharts5": "^5.2.19",
"@amcharts/amcharts5-geodata": "^5.0.3",
"@fortawesome/fontawesome-free": "^6.1.1",
"@gtm-support/vue-gtm": "^1.6.0",
"axios": "^0.27.2",
"chart.js": "^3.8.0",
"epic-spinners": "^2.0.0",
"flag-icons": "^6.6.4",
"ionicons": "^4.6.3",
"leaflet": "^1.8.0",
"leaflet-map": "^0.2.1",
"maplibre-gl": "^2.1.9",
"medium-editor": "^5.23.3",
"pinia": "^2.0.16",
"register-service-worker": "^1.7.1",
"sass": "^1.53.0",
"vue": "^3.2.25",
"vue-chartjs": "^4.1.1",
"vue-i18n": "^9.1.10",
"vue-router": "^4.0.14",
"vue-yandex-maps": "^0.12.3",
"vuestic-ui": "^1.5.0"
"pinia": "^2.0.27",
"vite-plugin-windicss": "^1.8.8",
"vue": "^3.2.41",
"vue-router": "^4.1.6",
"vuestic-ui": "^1.5.2",
"windicss": "^3.5.6"
},
"devDependencies": {
"@intlify/vite-plugin-vue-i18n": "^5.0.1",
"@types/leaflet": "^1.7.11",
"@types/medium-editor": "^5.0.5",
"@types/node": "^17.0.25",
"@typescript-eslint/eslint-plugin": "^5.20.0",
"@typescript-eslint/parser": "^5.20.0",
"@vitejs/plugin-vue": "^2.3.3",
"@vue/eslint-config-prettier": "^7.0.0",
"@vue/eslint-config-typescript": "^10.0.0",
"autoprefixer": "^10.4.4",
"eslint": "^8.13.0",
"eslint-plugin-prettier": "^4.0.0",
"eslint-plugin-vue": "^8.7.0",
"husky": "^8.0.1",
"lint-staged": "^13.0.1",
"postcss": "^8.4.12",
"prettier": "^2.6.2",
"typescript": "^4.5.4",
"vite": "^2.9.9",
"vite-plugin-windicss": "^1.8.8",
"vue-eslint-parser": "^8.3.0",
"vue-tsc": "^1.0.10",
"windicss": "^3.5.6"
"@types/node": "^18.11.11",
"@typescript-eslint/eslint-plugin": "^5.45.1",
"@typescript-eslint/parser": "^5.45.1",
"@vitejs/plugin-vue": "^3.2.0",
"eslint": "^8.29.0",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-vue": "^9.8.0",
"prettier": "^2.8.0",
"typescript": "*",
"vite": "^3.2.3",
"vue-tsc": "^1.0.9"
}
}
+2162
View File
File diff suppressed because it is too large Load Diff
-5
View File
@@ -1,5 +0,0 @@
module.exports = {
plugins: {
autoprefixer: {},
},
}
Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 618 B

+1
View File
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.4 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.6 KiB

+15 -14
View File
@@ -1,18 +1,19 @@
<script setup lang="ts"></script>
<template>
<router-view />
<div><router-view></router-view></div>
</template>
<style lang="scss">
@import 'scss/main.scss';
#app {
font-family: 'Source Sans Pro', Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
color: #2c3e50;
}
body {
margin: 0;
}
<style scoped>
.logo {
height: 6em;
padding: 1.5em;
will-change: filter;
}
.logo:hover {
filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.vue:hover {
filter: drop-shadow(0 0 2em #42b883aa);
}
</style>
+1
View File
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>

After

Width:  |  Height:  |  Size: 496 B

+38
View File
@@ -0,0 +1,38 @@
<script setup lang="ts">
import { ref } from 'vue'
defineProps<{ msg: string }>()
const count = ref(0)
</script>
<template>
<h1>{{ msg }}</h1>
<div class="card">
<button type="button" @click="count++">count is {{ count }}</button>
<p>
Edit
<code>components/HelloWorld.vue</code> to test HMR
</p>
</div>
<p>
Check out
<a href="https://vuejs.org/guide/quick-start.html#local" target="_blank"
>create-vue</a
>, the official Vue + Vite starter
</p>
<p>
Install
<a href="https://github.com/johnsoncodehk/volar" target="_blank">Volar</a>
in your IDE for a better DX
</p>
<p class="read-the-docs">Click on the Vite and Vue logos to learn more</p>
</template>
<style scoped>
.read-the-docs {
color: #888;
}
</style>
-53
View File
@@ -1,53 +0,0 @@
<template>
<svg class="va-icon-vuestic" :height="height" viewBox="0 0 478 57" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M18.2761 56.1386L0 13.3794H10.5519L18.8968 33.3107L27.2417 13.3794H37.7936L19.5175 56.1386H18.2761ZM62.4836 40.8281V13.3794H72.5527V39.3108C72.5527 44.8281 75.1734 46.7592 78.6907 46.7592C82.5528 46.7592 84.9666 44.8281 84.9666 39.3108V13.3794H95.1047V40.8281C95.1047 50.6213 87.7942 56.1386 78.6907 56.1386C69.2423 56.1386 62.4836 50.3454 62.4836 40.8281ZM122.415 54.7593V13.3794H149.795V22.3451H132.553V29.7935H148.485V38.6211H132.553V46.0695H150.554V54.7593H122.415ZM175.933 42.6212H185.795C185.795 45.035 187.727 46.9661 190.071 46.9661C192.623 46.9661 194.209 45.5178 194.209 43.3798C194.209 40.2763 190.14 39.3798 186.761 38.2074C179.795 35.7246 175.933 32.4831 175.933 25.3796C175.933 18.0692 182.209 12.0001 190.002 12.0001C199.175 12.0001 203.52 17.8623 204.072 25.5175H194.554C194.554 23.1727 193.106 21.2416 190.278 21.2416C188.071 21.2416 185.933 22.552 185.933 25.2417C185.933 28.3452 189.727 28.8969 193.244 29.9314C200.623 32.1383 204.072 36.2763 204.072 42.7591C204.072 50.0696 197.865 56.1386 190.071 56.1386C181.037 56.1386 175.933 50.0696 175.933 42.6212ZM236.442 54.7593V22.3451H227.2V13.3794H256.028V22.3451H246.649V54.7593H236.442ZM281.408 54.7593V13.3794H291.546V54.7593H281.408ZM317.502 34.0694C317.502 21.7244 326.812 12.0001 339.916 12.0001C347.778 12.0001 353.226 14.9657 357.64 19.5864L350.675 26.2072C347.778 23.3796 344.054 21.5865 339.916 21.5865C332.536 21.5865 327.778 27.1038 327.778 34.0694C327.778 41.035 332.536 46.5523 339.916 46.5523C344.054 46.5523 347.778 44.7592 350.675 41.9315L357.433 48.5523C353.295 52.8972 347.571 56.1386 339.916 56.1386C326.812 56.1386 317.502 46.4143 317.502 34.0694Z"
fill="url(#paint0_linear)"
/>
<path
d="M388.671 23.5893L388.364 24.844H391.71L391.403 23.5893C391.18 22.7157 390.957 21.7677 390.734 20.7454C390.511 19.7231 390.288 18.7565 390.065 17.8457H389.953C389.749 18.7751 389.535 19.751 389.312 20.7733C389.107 21.777 388.894 22.7157 388.671 23.5893ZM381.7 32.3999L387.221 14.2769H393.02L398.541 32.3999H393.466L392.574 28.5523H387.5L386.607 32.3999H381.7Z"
:fill="colorsComputed.start"
/>
<path
d="M403.987 32.3999V14.2769H409.34C410.715 14.2769 411.97 14.4441 413.104 14.7787C414.256 15.1133 415.241 15.6431 416.059 16.368C416.877 17.0929 417.509 18.0223 417.955 19.1561C418.42 20.29 418.652 21.6562 418.652 23.2548C418.652 24.8533 418.429 26.2288 417.983 27.3812C417.537 28.5337 416.905 29.4817 416.087 30.2252C415.288 30.9687 414.331 31.517 413.215 31.8702C412.119 32.2234 410.92 32.3999 409.619 32.3999H403.987ZM408.782 28.5523H409.061C409.712 28.5523 410.325 28.4779 410.901 28.3292C411.477 28.1619 411.97 27.8831 412.379 27.4928C412.806 27.1024 413.141 26.5634 413.383 25.8756C413.624 25.1879 413.745 24.3143 413.745 23.2548C413.745 22.1953 413.624 21.3309 413.383 20.6618C413.141 19.9926 412.806 19.4721 412.379 19.1004C411.97 18.7286 411.477 18.4777 410.901 18.3476C410.325 18.1989 409.712 18.1245 409.061 18.1245H408.782V28.5523Z"
:fill="colorsComputed.start"
/>
<path
d="M424.664 32.3999V14.2769H429.794L432.526 21.6934C432.694 22.1953 432.852 22.7157 433 23.2548C433.149 23.7938 433.307 24.3328 433.474 24.8719H433.586C433.753 24.3328 433.911 23.7938 434.06 23.2548C434.208 22.7157 434.366 22.1953 434.534 21.6934L437.155 14.2769H442.285V32.3999H437.935V27.0467C437.935 26.582 437.954 26.0708 437.991 25.5132C438.047 24.9555 438.103 24.3886 438.158 23.8124C438.214 23.2176 438.279 22.6414 438.354 22.0837C438.428 21.5261 438.493 21.0242 438.549 20.5781H438.437L436.932 24.9277L434.701 30.9222H432.136L429.905 24.9277L428.456 20.5781H428.344C428.4 21.0242 428.465 21.5261 428.539 22.0837C428.614 22.6414 428.679 23.2176 428.734 23.8124C428.79 24.3886 428.837 24.9555 428.874 25.5132C428.93 26.0708 428.957 26.582 428.957 27.0467V32.3999H424.664Z"
:fill="colorsComputed.start"
/>
<path d="M450.028 32.3999V14.2769H454.823V32.3999H450.028Z" :fill="colorsComputed.start" />
<path
d="M462.567 32.3999V14.2769H467.474L471.489 22.3625L473.218 26.4333H473.329C473.274 25.95 473.209 25.4202 473.134 24.844C473.06 24.2678 472.995 23.6823 472.939 23.0875C472.883 22.4741 472.828 21.87 472.772 21.2752C472.735 20.6618 472.716 20.0762 472.716 19.5186V14.2769H477.289V32.3999H472.381L468.366 24.2864L466.638 20.2435H466.526C466.638 21.2845 466.768 22.4183 466.917 23.6451C467.065 24.8719 467.14 26.0429 467.14 27.1582V32.3999H462.567Z"
:fill="colorsComputed.start"
/>
<defs>
<linearGradient id="paint0_linear" x1="0" y1="56.1386" x2="357.64" y2="56.1386" gradientUnits="userSpaceOnUse">
<stop :stop-color="colorsComputed.end" />
<stop offset="1" :stop-color="colorsComputed.start" />
</linearGradient>
</defs>
</svg>
</template>
<script setup lang="ts">
import { computed } from 'vue'
import { useColors } from 'vuestic-ui'
const { getColor, shiftHSLAColor } = useColors()
const props = withDefaults(
defineProps<{
height?: number | string
color?: string
}>(),
{
height: 16,
color: 'primary',
},
)
const colorsComputed = computed(() => {
const color = getColor(props.color, 'primary')
return { start: color, end: shiftHSLAColor(color, { l: -20 }) }
})
</script>
-40
View File
@@ -1,40 +0,0 @@
<template>
<svg class="va-icon-clean-code" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.02 50.34">
<defs />
<title>overview_icon_4</title>
<g id="Layer_2" data-name="Layer 2">
<g id="Layer_1-2" data-name="Layer 1">
<path class="cls-1" d="M38.23,16.17a10,10,0,1,0-17.67,6.42V47.5l7.33-5,8,5V22.58A10,10,0,0,0,38.23,16.17Z" />
<path
class="cls-2"
d="M28.23,0a13.15,13.15,0,0,0-9.17,22.6V50.34l8.87-6,9.46,5.92V22.6A13.15,13.15,0,0,0,28.23,0ZM34.4,44.79l-6.54-4.08-5.8,4V24.79a13.11,13.11,0,0,0,12.33,0ZM28.23,23.33A10.17,10.17,0,1,1,38.4,13.17,10.18,10.18,0,0,1,28.23,23.33Z"
/>
<path
class="cls-2"
d="M28.23,5.67a7.5,7.5,0,1,0,7.5,7.5A7.51,7.51,0,0,0,28.23,5.67Zm0,12a4.5,4.5,0,1,1,4.5-4.5A4.5,4.5,0,0,1,28.23,17.67Z"
/>
<polygon class="cls-2" points="9.51 15.11 0 24.61 9.51 34.12 11.63 32 4.24 24.61 11.63 17.23 9.51 15.11" />
<polygon
class="cls-2"
points="46.52 15.11 44.39 17.23 51.78 24.61 44.39 32 46.52 34.12 56.02 24.61 46.52 15.11"
/>
</g>
</g>
</svg>
</template>
<style lang="scss">
.va-icon-clean-code {
display: inline-block;
width: 56px;
height: 50px;
.cls-1 {
fill: #4ae387;
}
.cls-2 {
fill: #34495e;
}
}
</style>
-38
View File
@@ -1,38 +0,0 @@
<template>
<svg
class="va-icon-color"
:fill="color"
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
>
<path fill="none" d="M0 0h24v24H0V0z" />
<path
d="M12 22C6.49 22 2 17.51 2 12S6.49 2 12 2s10 4.04 10 9c0 3.31-2.69 6-6 6h-1.77c-.28 0-.5.22-.5.5 0 .12.05.23.13.33.41.47.64 1.06.64 1.67 0 1.38-1.12 2.5-2.5 2.5zm0-18c-4.41 0-8 3.59-8 8s3.59 8 8 8c.28 0 .5-.22.5-.5 0-.16-.08-.28-.14-.35-.41-.46-.63-1.05-.63-1.65 0-1.38 1.12-2.5 2.5-2.5H16c2.21 0 4-1.79 4-4 0-3.86-3.59-7-8-7z"
/>
<circle cx="6.5" cy="11.5" r="1.5" />
<circle cx="9.5" cy="7.5" r="1.5" />
<circle cx="14.5" cy="7.5" r="1.5" />
<circle cx="17.5" cy="11.5" r="1.5" />
</svg>
</template>
<script setup lang="ts">
withDefaults(
defineProps<{
color?: string
}>(),
{
color: 'inherit',
},
)
</script>
<style lang="scss">
.va-icon-color {
display: inline-block;
width: 24px;
height: 24px;
}
</style>
-33
View File
@@ -1,33 +0,0 @@
<template>
<svg
xmlns:xlink="http://www.w3.org/1999/xlink"
class="va-icon-faster"
viewBox="0 0 24 24"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
>
<!-- Generator: sketchtool 48.2 (47327) - http://www.bohemiancoding.com/sketch -->
<title>62EBC3B8-A55C-4B01-95A2-52FB8EDD4150</title>
<defs />
<g id="symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="icon-faster" fill="#34495E">
<g>
<path
id="A"
d="M17.748,19 L16.956,16.3 L12.942,16.3 L12.168,19 L8.928,19 L13.302,6.13 L16.614,6.13 L20.988,19 L17.748,19 Z M14.976,9.064 L14.94,9.064 C14.94,9.064 14.652,10.468 14.418,11.278 L13.68,13.78 L16.218,13.78 L15.498,11.278 C15.264,10.468 14.976,9.064 14.976,9.064 Z"
/>
<rect id="Rectangle-4" x="3" y="11" width="5" height="2" rx="1" />
<rect id="Rectangle-4-Copy" x="4" y="7" width="6" height="2" rx="1" />
<rect id="Rectangle-4" x="2" y="15" width="4" height="2" rx="1" />
</g>
</g>
</g>
</svg>
</template>
<style lang="scss">
.va-icon-faster {
width: 24px;
height: 24px;
}
</style>
-46
View File
@@ -1,46 +0,0 @@
<template>
<svg class="va-icon-free" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 44.99 51.04">
<defs />
<title>overview_icon_2</title>
<g id="Layer_2" data-name="Layer 2">
<g id="Layer_1-2" data-name="Layer 1">
<path
class="cls-1"
d="M1.08,28.21C1.08,13.62,8.38,6.29,19,6.29S37,13.69,37,28.21,29.66,50.54,19,50.54,1.08,42.8,1.08,28.21Zm23.56,0c0-11.3-2.58-16.9-5.62-16.9s-5.62,5.6-5.62,16.9S16,41.66,19,41.66,24.65,39.51,24.65,28.21Z"
/>
<line class="cls-2" x1="39.83" y1="47.62" x2="39.83" y2="50.96" />
<path
class="cls-3"
d="M18.73,9.64c-4.9,0-6.9,4.54-6.9,15.66,0,11.29,2.06,16.1,6.9,16.1s6.9-4.81,6.9-16.1C25.63,14.17,23.63,9.64,18.73,9.64Zm0,28.76c-1.07,0-3.9,0-3.9-13.1,0-12.66,2.64-12.66,3.9-12.66s3.9,0,3.9,12.66C22.63,38.4,19.8,38.4,18.73,38.4Z"
/>
<path
class="cls-3"
d="M42.9,43.74A3.76,3.76,0,0,1,40.17,45c-1.95,0-3.24-1.57-3.24-4.4s1.53-4.35,3.29-4.35a3.67,3.67,0,0,1,2.5,1.11l2.08-2.55A6.8,6.8,0,0,0,41.33,33V31h-3v2.12a7.09,7.09,0,0,0-1.64.63,43.71,43.71,0,0,0,.77-8.41c0-15.84-7-25.3-18.73-25.3S0,9.46,0,25.3,7.18,51,18.73,51A16.4,16.4,0,0,0,33.12,43.1,6.77,6.77,0,0,0,40,48.46a6.35,6.35,0,0,0,5-2.22ZM18.73,48C8.88,48,3,39.54,3,25.3S8.73,3,18.73,3s15.73,8.13,15.73,22.3S28.58,48,18.73,48Z"
/>
</g>
</g>
</svg>
</template>
<style lang="scss">
.va-icon-free {
display: inline-block;
width: 55px;
height: 47.8px;
.cls-1 {
fill: #4ae387;
}
.cls-2 {
fill: none;
stroke: #34495e;
stroke-miterlimit: 10;
stroke-width: 3px;
}
.cls-3 {
fill: #34495e;
}
}
</style>
-34
View File
@@ -1,34 +0,0 @@
<template>
<svg class="va-icon-fresh" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50.98 47.66">
<defs />
<title>overview_icon_5</title>
<g id="Layer_2" data-name="Layer 2">
<g id="Layer_1-2" data-name="Layer 1">
<path
class="cls-1"
d="M6,19C11,12.66,26.33,3,46.33,6c-3.67,17-8.67,26-8.67,26s-7,14-19.67-3.67C5.67,26.33,9,22.33,6,19Z"
/>
<path
class="cls-2"
d="M48.33.49l-.77,0c-11.22-1.88-30.21,1.46-39,9-3.38,2.89-5,6.11-4.69,9.59a11.06,11.06,0,0,0,4.77,8,11,11,0,0,0,6.24,1.82q.53,0,1.09,0A55.51,55.51,0,0,0,13.2,39.21C9.48,33.07,2.35,30.83,0,30.83v3c.12,0,12.18,1.95,12.5,13.54h0c0,.1,0,.19,0,.29h3a50.57,50.57,0,0,1,3.12-17.21c2.48,5.09,6.36,8,10.91,8.13,5.3.07,10.1-3.85,11.91-9.81.94-3.12,1.88-6.37,2.78-9.51C46.32,11.9,48.31,5,49.62,2.76L51,.49ZM10.28,24.61a8.06,8.06,0,0,1-3.45-5.73c-.19-2.47,1-4.85,3.65-7.08,5.9-5,17.25-8.12,27-8.7-8.35,4-15.7,12.31-20.23,22.51l-.38.1h0A8.82,8.82,0,0,1,10.28,24.61Zm31-6.18c-.9,3.13-1.82,6.37-2.76,9.47-1.4,4.62-4.95,7.69-8.86,7.69h-.13c-4-.07-7.45-3.43-9.33-9.09C25.83,14.27,35.67,4.94,45.92,3.65,44.6,7,43.06,12.39,41.33,18.42Z"
/>
</g>
</g>
</svg>
</template>
<style lang="scss">
.va-icon-fresh {
display: inline-block;
width: 51px;
height: 48px;
.cls-1 {
fill: #4ae387;
}
.cls-2 {
fill: #34495e;
}
}
</style>
-30
View File
@@ -1,30 +0,0 @@
<template>
<svg class="va-icon-menu" xmlns="http://www.w3.org/2000/svg" width="23" height="18" viewBox="0 0 24 18">
<g fill="none" fill-rule="nonzero" transform="translate(1 -3)">
<path d="M0 0h24v24H0z" />
<rect width="20" height="2" x="2" y="3" :fill="color" rx="1" />
<path :fill="color" d="M11 11h10a1 1 0 0 1 0 2H11a1 1 0 0 1 0-2zM1 11h5a1 1 0 0 1 0 2H1a1 1 0 0 1 0-2z" />
<rect width="20" height="2" x="2" y="19" :fill="color" rx="1" />
<path :stroke="color" stroke-width="2" d="M4 9l-3 3 3 3" />
</g>
</svg>
</template>
<script setup lang="ts">
withDefaults(
defineProps<{
color?: string
}>(),
{
color: 'inherit',
},
)
</script>
<style lang="scss">
.va-icon-menu {
display: inline-block;
width: 24px;
height: 24px;
}
</style>
@@ -1,32 +0,0 @@
<template>
<svg class="va-icon-menu-collapsed" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<g fill="none" fill-rule="nonzero">
<path d="M0 0h24v24H0z" />
<rect width="20" height="2" x="2" y="3" :fill="color" rx="1" />
<path
:fill="color"
d="M3 11h10a1 1 0 0 1 0 2H3a1 1 0 0 1 0-2zM20.993 11l-2.7-2.7-1.414 1.414L18.164 11H16a1 1 0 0 0 0 2h2.179l-1.3 1.3 1.414 1.414L21.007 13A1 1 0 0 0 21 11h-.007z"
/>
<rect width="20" height="2" x="2" y="19" :fill="color" rx="1" />
</g>
</svg>
</template>
<script setup lang="ts">
withDefaults(
defineProps<{
color?: string
}>(),
{
color: 'inherit',
},
)
</script>
<style lang="scss">
.va-icon-menu-collapsed {
display: inline-block;
width: 24px;
height: 24px;
}
</style>
-27
View File
@@ -1,27 +0,0 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="16" viewBox="0 0 20 16" :fill="color">
<path
fill-rule="nonzero"
d="M20 2c0-1.1-.9-2-2-2H2C.9 0 0 .9 0 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V2zm-2 0l-8 5-8-5h16zm0 12H2V4l8 5 8-5v10z"
/>
</svg>
</template>
<script setup lang="ts">
withDefaults(
defineProps<{
color?: string
}>(),
{
color: 'inherit',
},
)
</script>
<style lang="scss">
.va-icon-message {
display: inline-block;
width: 24px;
height: 24px;
}
</style>
@@ -1,27 +0,0 @@
<template>
<svg class="va-icon-notification" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<path
:fill="color"
d="M10 20c1.1 0 2-.9 2-2H8c0 1.1.9 2 2 2zm6-6V9c0-3.07-1.63-5.64-4.5-6.32V2c0-.83-.67-1.5-1.5-1.5S8.5 1.17 8.5 2v.68C5.64 3.36 4 5.92 4 9v5l-2 2v1h16v-1l-2-2zm-2 1H6V9c0-2.48 1.51-4.5 4-4.5s4 2.02 4 4.5v6zM5.58 2.08L4.15.65C1.75 2.48.17 5.3.03 8.5h2a8.445 8.445 0 0 1 3.55-6.42zM17.97 8.5h2c-.15-3.2-1.73-6.02-4.12-7.85l-1.42 1.43a8.495 8.495 0 0 1 3.54 6.42z"
/>
</svg>
</template>
<script setup lang="ts">
withDefaults(
defineProps<{
color?: string
}>(),
{
color: 'inherit',
},
)
</script>
<style lang="scss">
.va-icon-notification {
display: inline-block;
width: 24px;
height: 24px;
}
</style>
-29
View File
@@ -1,29 +0,0 @@
<template>
<svg class="va-icon-responsive" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 47.5 49">
<defs />
<title>overview_icon_3</title>
<g id="Layer_2" data-name="Layer 2">
<g id="Layer_1-2" data-name="Layer 1">
<polygon class="cls-1" points="37 26 37 7 11 7 11 18 3 18 3 46 11 46 15 46 30 46 37 46 45 46 45 26 37 26" />
<path class="cls-2" d="M40,19V0H8V11H0V49H47.5V19ZM3,46V14H8V46Zm34,0H11V3H37Zm7.5,0H40V22h4.5Z" />
<circle class="cls-2" cx="24" cy="41" r="2.67" />
</g>
</g>
</svg>
</template>
<style lang="scss">
.va-icon-responsive {
display: inline-block;
width: 47.5px;
height: 49px;
.cls-1 {
fill: #4ae387;
}
.cls-2 {
fill: #34495e;
}
}
</style>
-40
View File
@@ -1,40 +0,0 @@
<template>
<svg class="va-icon-rich" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.99 55">
<defs />
<title>overview_icon_6</title>
<g id="Layer_2" data-name="Layer 2">
<g id="Layer_1-2" data-name="Layer 1">
<rect class="cls-1" x="10.31" y="30.5" width="37.33" height="23" />
<path
class="cls-2"
d="M57,41.18l-7.85-16V24H8.81v1.11L0,41.11l2.63,1.45L8.81,31.33V55H49.15V32L54.3,42.5ZM46.15,52H11.81V27H46.15Z"
/>
<polygon class="cls-2" points="35.3 1.8 32.9 0 28.12 6.39 26.16 4.63 24.16 6.87 28.56 10.8 35.3 1.8" />
<polygon
class="cls-2"
points="22.3 12.46 19.9 10.67 15.12 17.05 13.16 15.3 11.16 17.54 15.56 21.47 22.3 12.46"
/>
<polygon
class="cls-2"
points="38.89 21.14 45.64 12.13 43.23 10.33 38.45 16.72 36.49 14.97 34.49 17.2 38.89 21.14"
/>
</g>
</g>
</svg>
</template>
<style lang="scss">
.va-icon-rich {
display: inline-block;
width: 57px;
height: 55px;
.cls-1 {
fill: #4ae387;
}
.cls-2 {
fill: #34495e;
}
}
</style>
-33
View File
@@ -1,33 +0,0 @@
<template>
<svg
xmlns:xlink="http://www.w3.org/1999/xlink"
class="va-icon-slower"
viewBox="0 0 24 24"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
>
<!-- Generator: sketchtool 48.2 (47327) - http://www.bohemiancoding.com/sketch -->
<title>67046716-A590-445C-AC65-1EEF69089C00</title>
<defs />
<g id="symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="icon-slower" fill="#34495E">
<g>
<path
id="A"
d="M16.82,18.87 L16.028,16.17 L12.014,16.17 L11.24,18.87 L8,18.87 L12.374,6 L15.686,6 L20.06,18.87 L16.82,18.87 Z M14.048,8.934 L14.012,8.934 C14.012,8.934 13.724,10.338 13.49,11.148 L12.752,13.65 L15.29,13.65 L14.57,11.148 C14.336,10.338 14.048,8.934 14.048,8.934 Z"
/>
<rect id="Rectangle-4" x="5" y="11" width="2" height="2" rx="1" />
<rect id="Rectangle-4-Copy" x="6" y="7" width="3" height="2" rx="1" />
<rect id="Rectangle-4" x="4" y="15" width="2" height="2" rx="1" />
</g>
</g>
</g>
</svg>
</template>
<style lang="scss">
.va-icon-slower {
width: 24px;
height: 24px;
}
</style>
-34
View File
@@ -1,34 +0,0 @@
<template>
<svg class="va-icon-vue" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 55.05 47.8">
<defs />
<title>overview_icon_1</title>
<g id="Layer_2" data-name="Layer 2">
<g id="Layer_1-2" data-name="Layer 1">
<polygon
class="cls-1"
points="27.75 21.19 18.48 6.18 4.78 6.18 27.75 42.92 50.89 6.18 36.13 6.18 27.75 21.19"
/>
<path
class="cls-2"
d="M33.08,0,27.44,9.76,21.84,0H0L27.43,47.8,55,0ZM27.43,15.77,34.81,3h4.6l-12,20.72L15.55,3h4.55ZM5.18,3h6.91L27.43,29.73,42.88,3h7L27.44,41.78Z"
/>
</g>
</g>
</svg>
</template>
<style lang="scss">
.va-icon-vue {
display: inline-block;
width: 55px;
height: 47.8px;
.cls-1 {
fill: #4ae387;
}
.cls-2 {
fill: #34495e;
}
}
</style>
-47
View File
@@ -1,47 +0,0 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg" class="va-icon-vuestic" width="304" height="31" viewBox="0 0 304 31">
<defs>
<linearGradient :id="'ORIGINAL'" x1="0%" y1="50%" y2="50%">
<stop offset="0%" stop-color="#4AE387" />
<stop offset="100%" stop-color="#C8EA13" />
</linearGradient>
<linearGradient :id="'CORPORATE'" x1="0%" y1="50%" y2="50%">
<stop offset="0%" stop-color="#74BBFF" />
<stop offset="100%" stop-color="#6E85E8" />
</linearGradient>
</defs>
<g fill="none" fill-rule="evenodd" transform="scale(2)">
<path
:fill="`url(#${themeGradientId})`"
fill-rule="nonzero"
d="M6.36,15.36 L-7.10542736e-15,0.48 L3.672,0.48 L6.576,7.416 L9.48,0.48 L13.152,0.48 L6.792,15.36 L6.36,15.36 Z M21.744,10.032 L21.744,0.48 L25.248,0.48 L25.248,9.504 C25.248,11.424 26.16,12.096 27.384,12.096 C28.728,12.096 29.568,11.424 29.568,9.504 L29.568,0.48 L33.096,0.48 L33.096,10.032 C33.096,13.44 30.552,15.36 27.384,15.36 C24.096,15.36 21.744,13.344 21.744,10.032 Z M42.6,14.88 L42.6,0.48 L52.128,0.48 L52.128,3.6 L46.128,3.6 L46.128,6.192 L51.672,6.192 L51.672,9.264 L46.128,9.264 L46.128,11.856 L52.392,11.856 L52.392,14.88 L42.6,14.88 Z M61.224,10.656 L64.656,10.656 C64.656,11.496 65.328,12.168 66.144,12.168 C67.032,12.168 67.584,11.664 67.584,10.92 C67.584,9.84 66.168,9.528 64.992,9.12 C62.568,8.256 61.224,7.128 61.224,4.656 C61.224,2.112 63.408,7.10542736e-15 66.12,7.10542736e-15 C69.312,7.10542736e-15 70.824,2.04 71.016,4.704 L67.704,4.704 C67.704,3.888 67.2,3.216 66.216,3.216 C65.448,3.216 64.704,3.672 64.704,4.608 C64.704,5.688 66.024,5.88 67.248,6.24 C69.816,7.008 71.016,8.448 71.016,10.704 C71.016,13.248 68.856,15.36 66.144,15.36 C63,15.36 61.224,13.248 61.224,10.656 Z M82.896,14.88 L82.896,3.6 L79.68,3.6 L79.68,0.48 L89.712,0.48 L89.712,3.6 L86.448,3.6 L86.448,14.88 L82.896,14.88 Z M98.544,14.88 L98.544,0.48 L102.072,0.48 L102.072,14.88 L98.544,14.88 Z M111.72,7.68 C111.72,3.384 114.96,7.10542736e-15 119.52,7.10542736e-15 C122.256,7.10542736e-15 124.152,1.032 125.688,2.64 L123.264,4.944 C122.256,3.96 120.96,3.336 119.52,3.336 C116.952,3.336 115.296,5.256 115.296,7.68 C115.296,10.104 116.952,12.024 119.52,12.024 C120.96,12.024 122.256,11.4 123.264,10.416 L125.616,12.72 C124.176,14.232 122.184,15.36 119.52,15.36 C114.96,15.36 111.72,11.976 111.72,7.68 Z"
/>
<path
:fill="textColor"
d="M139.712,7.88 L139.712,6.152 L138.44,6.152 C138.272,6.152 138.066,6.162 137.822,6.182 C137.578,6.202 137.36,6.224 137.168,6.248 C137.424,5.984 137.682,5.704 137.942,5.408 C138.202,5.112 138.436,4.808 138.644,4.496 C138.852,4.184 139.022,3.87 139.154,3.554 C139.286,3.238 139.352,2.928 139.352,2.624 C139.352,2.248 139.288,1.906 139.16,1.598 C139.032,1.29 138.852,1.028 138.62,0.812 C138.388,0.596 138.112,0.428 137.792,0.308 C137.472,0.188 137.12,0.128 136.736,0.128 C136.456,0.128 136.198,0.152 135.962,0.2 C135.726,0.248 135.502,0.322 135.29,0.422 C135.078,0.522 134.876,0.65 134.684,0.806 C134.492,0.962 134.296,1.144 134.096,1.352 L134.096,1.352 L135.2,2.456 C135.384,2.272 135.574,2.106 135.77,1.958 C135.966,1.81 136.192,1.736 136.448,1.736 C136.728,1.736 136.954,1.818 137.126,1.982 C137.298,2.146 137.384,2.4 137.384,2.744 C137.384,3 137.302,3.274 137.138,3.566 C136.974,3.858 136.748,4.166 136.46,4.49 C136.172,4.814 135.834,5.16 135.446,5.528 C135.058,5.896 134.64,6.288 134.192,6.704 L134.192,6.704 L134.192,7.88 L139.712,7.88 Z M142.56,8.024 C142.912,8.024 143.2,7.904 143.424,7.664 C143.648,7.424 143.76,7.128 143.76,6.776 C143.76,6.424 143.648,6.128 143.424,5.888 C143.2,5.648 142.912,5.528 142.56,5.528 C142.208,5.528 141.92,5.648 141.696,5.888 C141.472,6.128 141.36,6.424 141.36,6.776 C141.36,7.128 141.472,7.424 141.696,7.664 C141.92,7.904 142.208,8.024 142.56,8.024 Z M150.736,7.88 L150.736,6.224 L149.368,6.224 L149.368,0.272 L147.856,0.272 C147.568,0.456 147.272,0.604 146.968,0.716 C146.664,0.828 146.296,0.928 145.864,1.016 L145.864,1.016 L145.864,2.288 L147.304,2.288 L147.304,6.224 L145.672,6.224 L145.672,7.88 L150.736,7.88 Z"
/>
</g>
</svg>
</template>
<script>
export default {
name: 'VaIconVuestic',
inject: ['contextConfig'],
computed: {
themeGradientId() {
return this.contextConfig.invertedColor ? 'CORPORATE' : 'ORIGINAL'
},
textColor() {
return this.contextConfig.invertedColor ? '#6E85E8' : '#E4FF32'
},
},
}
</script>
<style lang="scss">
.va-icon-vuestic {
.st0 {
fill: #4ae387;
}
}
</style>
-279
View File
@@ -1,279 +0,0 @@
<template>
<div ref="mapRef" class="line-map" />
</template>
<script setup lang="ts">
import { ref, toRef, computed, onMounted, onBeforeUnmount, watch, shallowRef, onUpdated } from 'vue'
import * as am5 from '@amcharts/amcharts5'
import * as am5map from '@amcharts/amcharts5/map'
import am5geodata_worldLow from '@amcharts/amcharts5-geodata/worldLow'
import am5themes_Animated from '@amcharts/amcharts5/themes/Animated'
import { useColors } from 'vuestic-ui'
import {
planeSVG,
useMapData,
CityItem,
getGeoBounds,
generateLineSeriesData,
compareStrings,
} from '../../data/maps/lineMapData'
const generateLabelText = (city?: string) => (city ? `Flights from ${city}` : '')
const generateButtonText = (city: string) => `Show flights from ${city}`
const props = withDefaults(
defineProps<{
mapData: CityItem[]
homeCity: string
modelValue: string
}>(),
{
homeCity: 'New York',
modelValue: 'New York',
},
)
const emit = defineEmits<{
(e: 'update:modelValue', value: string): void
}>()
const { colors } = useColors()
const mapRef = ref()
const mapRoot = shallowRef()
const mapChart = shallowRef()
const mapPolygonSeries = shallowRef()
const mapPointSeries = shallowRef()
const mapLineSeries = shallowRef()
const mapZoomControl = shallowRef()
const mapLabelText = shallowRef()
const mapLabelSvg = shallowRef()
const mapHomeCityButton = shallowRef()
const mainCity = computed({
get() {
return props.modelValue
},
set(value) {
emit('update:modelValue', value)
},
})
const mapPointSeriesData = useMapData(toRef(props, 'mapData'))
const mapLineSeriesData = computed(() => {
const item = getItemByMainCityTitle()
return generateLineSeriesData(item)
})
const getItemByMainCityTitle = () =>
mapPointSeriesData.value.find(({ title }) => compareStrings(title, mainCity.value))
const zoomToGeoBounds = () => {
const item = getItemByMainCityTitle()
const geoBounds = getGeoBounds(item)
if (geoBounds) {
mapChart.value.zoomToGeoBounds(geoBounds)
}
}
const createMap = () => {
const root = am5.Root.new(mapRef.value)
root.setThemes([am5themes_Animated.new(root)])
const chart = root.container.children.push(
am5map.MapChart.new(root, {
minZoomLevel: 1,
maxZoomLevel: 10,
}),
)
const zoomControl = chart.set('zoomControl', am5map.ZoomControl.new(root, {}))
// polygon series
const polygonSeries = chart.series.push(
am5map.MapPolygonSeries.new(root, {
geoJSON: am5geodata_worldLow,
exclude: ['AQ'],
}),
)
polygonSeries.mapPolygons.template.setAll({
fill: am5.color(colors.secondary),
fillOpacity: 0.4,
strokeWidth: 0.5,
})
polygonSeries.events.on('datavalidated', zoomToGeoBounds)
// point series
const pointSeries = chart.series.push(
am5map.MapPointSeries.new(root, {
latitudeField: 'latitude',
longitudeField: 'longitude',
}),
)
// point series bullets
const bulletTemplate = am5.Template.new({}) as am5.Template<am5.Graphics>
bulletTemplate.events.on('click', (ev) => {
mainCity.value = (ev as any).target._dataItem.dataContext.title
})
pointSeries.bullets.push((root, series, dataItem) => {
const itemData = dataItem.dataContext as CityItem
const isMainCity = compareStrings(itemData.title, mainCity.value)
return am5.Bullet.new(root, {
sprite: am5.Graphics.new(
root,
{
svgPath: itemData.svgPath,
x: am5.percent(50),
y: am5.percent(50),
centerX: am5.percent(50),
centerY: am5.percent(50),
fill: am5.color(isMainCity ? colors.primary : itemData.color),
scale: isMainCity ? 1.5 : 1,
tooltipText: '{title}',
},
bulletTemplate,
),
})
})
// line series
const lineSeries = chart.series.push(am5map.MapLineSeries.new(root, {}))
lineSeries.mapLines.template.setAll({
stroke: am5.color(colors.primary),
strokeWidth: 2,
strokeOpacity: 0.5,
})
// set map data
pointSeries.data.setAll(mapPointSeriesData.value)
lineSeries.data.setAll(mapLineSeriesData.value as unknown[])
// label 'Flights from ...'
const labelContainer = chart.children.push(
am5.Container.new(root, {
x: 15,
y: 15,
layout: root.horizontalLayout,
}),
)
const labelSvg = labelContainer.children.push(
am5.Graphics.new(root, {
svgPath: planeSVG,
fill: am5.color(colors.info),
}),
)
const labelText = labelContainer.children.push(
am5.Label.new(root, {
text: generateLabelText(getItemByMainCityTitle()?.title),
fill: am5.color(colors.info),
fontSize: 22,
lineHeight: am5.p100,
}),
)
// button 'Show flights from homeCity'
const homeCityButton = chart.children.push(
am5.Button.new(root, {
x: 15,
y: 45,
label: am5.Label.new(root, {
text: generateButtonText(props.homeCity),
paddingTop: 0,
marginRight: 0,
paddingBottom: 0,
marginLeft: 0,
}),
visible: false,
}),
)
homeCityButton.events.on('click', () => {
mainCity.value = props.homeCity
homeCityButton.hide()
})
// assign objects to refs
mapRoot.value = root
mapChart.value = chart
mapZoomControl.value = zoomControl
mapPointSeries.value = pointSeries
mapLineSeries.value = lineSeries
mapPolygonSeries.value = polygonSeries
mapLabelSvg.value = labelSvg
mapLabelText.value = labelText
mapHomeCityButton.value = homeCityButton
}
const setPointSeriesData = () => {
mapPointSeries.value.data.setAll(mapPointSeriesData.value)
}
const setLineSeriesData = () => {
mapLineSeries.value.data.setAll(mapLineSeriesData.value ?? [])
}
const updateInteractiveElements = () => {
mapLabelText.value.set('text', generateLabelText(getItemByMainCityTitle()?.title))
mapHomeCityButton.value[compareStrings(props.homeCity, mainCity.value) ? 'hide' : 'show']?.()
}
const updateChartDataOnChangeTheme = () => {
if (mapRoot.value) {
mapPolygonSeries.value.mapPolygons.template.setAll({
fill: am5.color(colors.secondary),
})
mapLineSeries.value.mapLines.template.setAll({
stroke: am5.color(colors.primary),
})
mapLabelText.value.set('fill', am5.color(colors.info))
mapLabelSvg.value.set('fill', am5.color(colors.info))
setPointSeriesData()
}
}
const updateChartDataOnUpdateProps = () => {
if (mapRoot.value) {
setPointSeriesData()
setLineSeriesData()
updateInteractiveElements()
zoomToGeoBounds()
}
}
const disposeMap = () => {
if (mapRoot.value) {
mapRoot.value.dispose()
}
}
onMounted(createMap)
onUpdated(updateChartDataOnUpdateProps)
watch(colors, updateChartDataOnChangeTheme)
onBeforeUnmount(disposeMap)
</script>
<style lang="scss" scoped>
.line-map {
border-radius: inherit;
:deep(div),
:deep(canvas) {
border-radius: inherit;
}
}
</style>
-114
View File
@@ -1,114 +0,0 @@
<template>
<va-navbar class="app-layout-navbar">
<template #left>
<div class="left">
<va-icon-menu-collapsed
:class="{ 'x-flip': isSidebarMinimized }"
class="va-navbar__item"
:color="colors.primary"
@click="isSidebarMinimized = !isSidebarMinimized"
/>
<router-link to="/">
<vuestic-logo class="logo" />
</router-link>
</div>
</template>
<template #center>
<div class="app-navbar-center">
<span class="app-navbar-center__text mr-2">{{ t('navbar.messageUs') }}</span>
<a
class="app-navbar-center__mail mr-2"
href="mailto:hello@epicmax.co"
target="_blank"
:style="{ color: colors.primary }"
>
hello@epicmax.co
</a>
<va-button
href="https://github.com/epicmaxco/vuestic-admin"
color="#000000"
class="app-navbar-center__github-button"
icon="github"
target="_blank"
>
{{ t('navbar.repository') }}
</va-button>
</div>
</template>
<template #right>
<app-navbar-actions class="app-navbar__actions md5 lg4" :user-name="userName" />
</template>
</va-navbar>
</template>
<script setup>
import { computed } from 'vue'
import { storeToRefs } from 'pinia'
import { useGlobalStore } from '../../stores/global-store'
import { useI18n } from 'vue-i18n'
import { useColors } from 'vuestic-ui'
import VuesticLogo from '../VuesticLogo.vue'
import VaIconMenuCollapsed from '../icons/VaIconMenuCollapsed.vue'
import AppNavbarActions from './components/AppNavbarActions.vue'
const GlobalStore = useGlobalStore()
const { t } = useI18n()
const { isSidebarMinimized, userName } = storeToRefs(GlobalStore)
const { getColors } = useColors()
const colors = computed(() => getColors())
</script>
<style lang="scss" scoped>
.va-navbar {
box-shadow: var(--va-box-shadow);
z-index: 2;
@media screen and (max-width: 950px) {
.left {
width: 100%;
}
.app-navbar__actions {
width: 100%;
display: flex;
justify-content: space-between;
}
}
}
.left {
display: flex;
align-items: center;
& > * {
margin-right: 1.5rem;
}
& > *:last-child {
margin-right: 0;
}
}
.x-flip {
transform: scaleX(-100%);
}
.app-navbar-center {
display: flex;
align-items: center;
@media screen and (max-width: 1200px) {
&__github-button {
display: none;
}
}
@media screen and (max-width: 950px) {
&__text {
display: none;
}
}
}
</style>
@@ -1,97 +0,0 @@
<template>
<div class="app-navbar-actions">
<color-dropdown class="app-navbar-actions__item" />
<message-dropdown class="app-navbar-actions__item" />
<notification-dropdown class="app-navbar-actions__item" />
<!-- <settings-dropdown class="app-navbar-actions__item" /> -->
<language-dropdown class="app-navbar-actions__item" />
<profile-dropdown class="app-navbar-actions__item app-navbar-actions__item--profile">
<span>{{ userName }}</span>
</profile-dropdown>
</div>
</template>
<script setup lang="ts">
import LanguageDropdown from './dropdowns/LanguageDropdown.vue'
import ProfileDropdown from './dropdowns/ProfileDropdown.vue'
import NotificationDropdown from './dropdowns/NotificationDropdown.vue'
import MessageDropdown from './dropdowns/MessageDropdown.vue'
import ColorDropdown from './dropdowns/ColorDropdown.vue'
withDefaults(
defineProps<{
userName?: string
isTopBar?: boolean
}>(),
{
userName: '',
isTopBar: false,
},
)
defineEmits<{
(e: 'update:isTopBar', isTopBar: boolean): void
}>()
// const isTopBarProxy = computed({
// get() {
// return props.isTopBar
// },
//
// set(isTopBar: boolean) {
// emit('update:isTopBar', isTopBar)
// },
// })
</script>
<style lang="scss">
.app-navbar-actions {
display: flex;
align-items: center;
.va-dropdown__anchor {
color: var(--va-primary);
fill: var(--va-primary);
}
&__item {
padding: 0;
margin-left: 1.25rem;
margin-right: 1.25rem;
svg {
height: 24px;
}
&:last-of-type {
margin-right: 0;
}
&--profile {
display: flex;
justify-content: center;
margin: auto 0 auto 1.25rem;
}
.va-dropdown-content {
background-color: var(--va-white);
}
@media screen and (max-width: 640px) {
margin-right: 0;
&:first-of-type {
margin-left: 0;
}
&--profile {
position: absolute;
right: 0.75rem;
top: 1.25rem;
height: fit-content;
margin: auto;
}
}
}
}
</style>
@@ -1,80 +0,0 @@
<template>
<va-dropdown class="color-dropdown" :offset="[13, 0]" position="bottom">
<template #anchor>
<va-icon-color />
</template>
<va-dropdown-content class="color-dropdown__content pl-4 pr-4 pt-2 pb-2">
<va-button-toggle
v-model="currentTheme"
class="color-dropdown__toggle"
:options="themeOptions"
outline
round
grow
size="small"
/>
<table style="width: 100%">
<color-dropdown-item
v-for="colorName in colorNames"
:key="colorName"
class="color-picker-dropdown"
:color-name="colorName"
/>
</table>
</va-dropdown-content>
</va-dropdown>
</template>
<script setup lang="ts">
import VaIconColor from '../../../icons/VaIconColor.vue'
import ColorDropdownItem from './ColorDropdownItem.vue'
import { useColors } from 'vuestic-ui'
import { ref, watchEffect } from 'vue'
const { presets, applyPreset, colors } = useColors()
const currentTheme = ref('light')
watchEffect(() => {
applyPreset(currentTheme.value)
})
const themeOptions = Object.keys(presets.value).map((themeName) => ({
value: themeName,
label: themeName,
}))
const colorNames = Object.keys(colors)
</script>
<style lang="scss" scoped>
.color-dropdown {
cursor: pointer;
&__icon {
position: relative;
display: flex;
align-items: center;
}
.va-dropdown__anchor {
display: inline-block;
}
&__toggle {
width: 100%;
display: flex;
justify-content: stretch;
}
}
.button-restore {
display: flex;
margin: 0.375rem auto;
}
table {
margin: 1rem 0;
}
</style>
@@ -1,44 +0,0 @@
<template>
<tr>
<td class="color">
<va-color-indicator :color="theme[colorName]" />
</td>
<td>
{{ colorName }}
</td>
</tr>
</template>
<script setup lang="ts">
import { computed } from 'vue'
import { useColors } from 'vuestic-ui'
const { getColors } = useColors()
defineProps<{
colorName: string
}>()
const theme = computed(() => {
return getColors()
})
</script>
<style lang="scss" scoped>
.color {
width: 16px;
height: 16px;
&-bordered {
border: 1px solid var(--va-gray);
border-radius: 50%;
}
}
td {
color: var(--va-gray);
padding: 0.25rem 0.5rem;
box-sizing: border-box;
vertical-align: middle;
&:first-child {
padding-right: 0;
}
}
</style>
@@ -1,106 +0,0 @@
<template>
<va-dropdown class="language-dropdown" fixed position="bottom" :offset="[13, 0]">
<template #anchor>
<va-icon :name="getFlagIcon(locale, 'large')" />
</template>
<va-dropdown-content class="language-dropdown__content pl-4 pr-4 pt-2 pb-2">
<div
v-for="(option, id) in options"
:key="id"
class="language-dropdown__item row align--center pt-1 pb-1 mt-2 mb-2"
:class="{ active: option.code === locale }"
@click="locale = option.code"
>
<va-icon :name="getFlagIcon(option.code, 'small')" />
<span class="dropdown-item__text">
{{ t(`language.${option.name}`) }}
</span>
</div>
</va-dropdown-content>
</va-dropdown>
</template>
<script setup lang="ts">
import { useI18n } from 'vue-i18n'
const { t, locale } = useI18n()
withDefaults(
defineProps<{
options?: { code: string; name: string }[]
}>(),
{
options: () => [
{
code: 'gb',
name: 'english',
},
{
code: 'es',
name: 'spanish',
},
{
code: 'br',
name: 'brazilian_portuguese',
},
{
code: 'cn',
name: 'simplified_chinese',
},
{
code: 'ir',
name: 'persian',
},
],
},
)
function getFlagIcon(code: string, size: string) {
return `flag-icon-${code} ${size}`
}
</script>
<style lang="scss" scoped>
@import 'flag-icons/css/flag-icons.css';
.language-dropdown {
cursor: pointer;
&__content {
.fi-size-small {
min-width: 1.5rem;
min-height: 1.5rem;
margin-right: 0.5rem;
}
}
&__item {
padding-bottom: 0.625rem;
cursor: pointer;
flex-wrap: nowrap;
&:last-of-type {
padding-bottom: 0 !important;
}
&:hover {
color: var(--va-primary);
}
}
.fi::before {
content: '';
}
.fi-size-large {
display: block;
width: 32px;
height: 24px;
}
.va-dropdown__anchor {
display: inline-block;
}
}
</style>
@@ -1,157 +0,0 @@
<template>
<va-dropdown class="message-dropdown" position="bottom" :offset="[13, 0]">
<template #anchor>
<va-icon-message class="message-dropdown__icon" :class="{ 'message-dropdown__icon--unread': !allRead }" />
</template>
<va-dropdown-content class="message-dropdown__content pl-4 pr-4 pt-2 pb-2">
<div
v-for="message in messagesProxy"
:key="message.id"
class="message-dropdown__item row pt-1 pb-1 mt-2 mb-2"
:class="{ 'message-dropdown__item--unread': message.unread }"
@click="message.unread = false"
>
<img :src="message.details.avatar" class="message-dropdown__item__avatar mr-2" />
<span class="ellipsis" style="max-width: 85%">{{
t(`messages.${message.name}`, { name: message.details.name })
}}</span>
</div>
<div class="row justify--space-between mt-1">
<va-button class="md6 mr-2" size="small">{{ t('messages.all') }}</va-button>
<va-button
class="md6"
size="small"
preset="outline"
border-color="primary"
:disabled="allRead"
@click="markAllAsRead"
>{{ t('messages.mark_as_read') }}</va-button
>
</div>
</va-dropdown-content>
</va-dropdown>
</template>
<script setup lang="ts">
import { computed, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import VaIconMessage from '../../../icons/VaIconMessage.vue'
const { t } = useI18n()
interface IMessage {
name: string
details: {
name: string
avatar: string
}
unread: boolean
id: number
}
const props = withDefaults(
defineProps<{
messages?: IMessage[]
}>(),
{
messages: () => [
{
name: 'new',
details: {
name: 'Oleg M',
avatar: 'https://picsum.photos/24?image=1083',
},
unread: true,
id: 1,
},
{
name: 'new',
details: {
name: 'Andrei H',
avatar: 'https://picsum.photos/24?image=1025',
},
unread: true,
id: 2,
},
],
},
)
const messagesProxy = ref<IMessage[]>([...props.messages])
const allRead = computed(() => {
return messagesProxy.value.every((message) => !message.unread)
})
function markAllAsRead() {
messagesProxy.value = messagesProxy.value.map((message) => ({
...message,
unread: false,
}))
}
</script>
<style lang="scss" scoped>
.message-dropdown {
cursor: pointer;
.message-dropdown__icon {
position: relative;
display: flex;
align-items: center;
&--unread::before {
content: '';
position: absolute;
right: 0;
left: 0;
top: -0.5rem;
background-color: var(--va-danger);
height: 0.375rem;
width: 0.375rem;
margin: 0 auto;
border-radius: 0.187rem;
}
}
&__item {
cursor: pointer;
margin-bottom: 0.75rem;
position: relative;
flex-wrap: nowrap;
&--unread {
color: var(--va-gray);
&::after {
content: '';
position: absolute;
right: 0;
top: 0;
bottom: 0;
height: 0.375rem;
width: 0.375rem;
background-color: var(--va-danger);
margin: auto;
border-radius: 0.187rem;
}
}
&:hover {
color: var(--va-primary);
}
&__avatar {
border-radius: 50%;
min-width: 1.5rem;
height: 1.5rem;
}
}
.va-dropdown__anchor {
display: inline-block;
}
}
</style>
@@ -1,176 +0,0 @@
<template>
<va-dropdown class="notification-dropdown" position="bottom" :offset="[13, 0]">
<template #anchor>
<va-icon-notification
class="notification-dropdown__icon"
:class="{ 'notification-dropdown__icon--unread': !allRead }"
/>
</template>
<va-dropdown-content class="notification-dropdown__content pl-3 pr-3 pt-2 pb-2">
<div
v-for="notification in notificationsProxy"
:key="notification.id"
class="notification-dropdown__item row pt-1 pb-1 mt-2 mb-2"
:class="{ 'notification-dropdown__item--unread': notification.unread }"
@click="notification.unread = false"
>
<img
v-if="notification.details.avatar"
class="mr-2 notification-dropdown__item__avatar"
:src="notification.details.avatar"
/>
<span class="ellipsis" style="max-width: 85%">
<span v-if="notification.details.name" class="text--bold">{{ notification.details.name }}</span>
{{ t(`notifications.${notification.name}`, { type: notification.details.type }) }}
</span>
</div>
<div class="row justify--space-between mt-1">
<va-button class="md6 mr-2" size="small">{{ t('notifications.all') }}</va-button>
<va-button
class="md6"
size="small"
preset="outline"
border-color="primary"
:disabled="allRead"
@click="markAllAsRead"
>{{ t('notifications.mark_as_read') }}</va-button
>
</div>
</va-dropdown-content>
</va-dropdown>
</template>
<script setup lang="ts">
import { ref, computed } from 'vue'
import { useI18n } from 'vue-i18n'
import VaIconNotification from '../../../icons/VaIconNotification.vue'
const { t } = useI18n()
interface INotification {
name: string
details: {
name: string
avatar: string
type?: string
}
unread: boolean
id: number
}
const props = withDefaults(
defineProps<{
notifications?: INotification[]
}>(),
{
notifications: () => [
{
name: 'sentMessage',
details: { name: 'Vasily S', avatar: 'https://picsum.photos/123' },
unread: true,
id: 1,
},
{
name: 'uploadedZip',
details: {
name: 'Oleg M',
avatar: 'https://picsum.photos/100',
type: 'typography component',
},
unread: true,
id: 2,
},
{
name: 'startedTopic',
details: { name: 'Andrei H', avatar: 'https://picsum.photos/24' },
unread: true,
id: 3,
},
],
},
)
const notificationsProxy = ref<INotification[]>([...props.notifications])
const allRead = computed(() => {
return notificationsProxy.value.every((notification) => !notification.unread)
})
function markAllAsRead() {
notificationsProxy.value = notificationsProxy.value.map((notification) => ({
...notification,
unread: false,
}))
}
</script>
<style lang="scss" scoped>
.row {
flex-wrap: nowrap !important;
}
.md6 {
box-sizing: border-box;
}
.notification-dropdown {
cursor: pointer;
.notification-dropdown__icon {
position: relative;
display: flex;
align-items: center;
&--unread::before {
content: '';
position: absolute;
right: 0;
left: 0;
top: -0.5rem;
// background-color: $brand-danger;
height: 0.375rem;
width: 0.375rem;
margin: 0 auto;
border-radius: 0.187rem;
}
}
&__content {
max-width: 20rem;
}
&__item {
cursor: pointer;
margin-bottom: 0.75rem;
flex-wrap: nowrap;
position: relative;
&--unread {
&::after {
content: '';
position: absolute;
right: 0;
top: 0;
bottom: 0;
height: 0.375rem;
width: 0.375rem;
margin: auto;
border-radius: 0.187rem;
}
}
&:hover {
color: var(--va-primary);
}
&__avatar {
border-radius: 50%;
width: 1.5rem;
height: 1.5rem;
min-width: 1.5rem;
}
}
.va-dropdown__anchor {
display: inline-block;
}
}
</style>
@@ -1,68 +0,0 @@
<template>
<div class="profile-dropdown-wrapper">
<va-dropdown v-model="isShown" class="profile-dropdown" stick-to-edges placement="bottom" :offset="[13, 0]">
<template #anchor>
<span class="profile-dropdown__anchor">
<slot />
<va-icon class="px-2" :name="isShown ? 'angle_up' : 'angle_down'" :color="colors.primary" />
</span>
</template>
<va-dropdown-content class="profile-dropdown__content">
<va-list-item v-for="option in options" :key="option.name" class="pa-2">
<router-link :to="{ name: option.redirectTo }" class="profile-dropdown__item">
{{ t(`user.${option.name}`) }}
</router-link>
</va-list-item>
</va-dropdown-content>
</va-dropdown>
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { useColors } from 'vuestic-ui'
const { t } = useI18n()
const { colors } = useColors()
withDefaults(
defineProps<{
options?: { name: string; redirectTo: string }[]
}>(),
{
options: () => [
{
name: 'profile',
redirectTo: '',
},
{
name: 'logout',
redirectTo: 'login',
},
],
},
)
const isShown = ref(false)
</script>
<style lang="scss" scoped>
.profile-dropdown {
cursor: pointer;
&__anchor {
display: inline-block;
}
&__item {
display: block;
color: var(--va-gray);
&:hover,
&:active {
color: var(--va-primary);
}
}
}
</style>
@@ -1,83 +0,0 @@
<template>
<va-dropdown class="settings-dropdown" position="bottom" boundary-body :offset="[13, 0]">
<template #anchor>
<va-icon
name="vuestic-iconset-settings"
style="font-size: 1.4rem; display: flex"
class="settings-dropdown__icon"
/>
</template>
<va-dropdown-content class="settings-dropdown__content pl-4 pr-4 pt-2 pb-2">
<div class="settings-dropdown__content-label mt-2 mb-3" :style="{ color: colors.primary }">
{{ t('dashboard.navigationLayout') }}
</div>
<va-button-toggle
v-model="isTopBarProxy"
outline
:options="options"
class="settings-dropdown__control mb-2"
size="small"
/>
</va-dropdown-content>
</va-dropdown>
</template>
<script setup lang="ts">
import { computed, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { useColors } from 'vuestic-ui'
const { colors } = useColors()
const { t } = useI18n()
const props = defineProps<{
isTopBar: boolean
}>()
const emit = defineEmits<{
(e: 'update:isTopBar', value: boolean): void
}>()
const options = ref([
{ label: t('dashboard.sideBarButton'), value: String(false) }, // NOTE: boolean is unsupported for va-dropdown
{ label: t('dashboard.topBarButton'), value: String(true) },
])
const isTopBarProxy = computed({
get() {
return String(props.isTopBar)
},
set() {
emit('update:isTopBar', props.isTopBar)
},
})
</script>
<style lang="scss">
.settings-dropdown {
cursor: pointer;
&__icon {
position: relative;
display: flex;
align-items: center;
}
&__content {
&-label {
margin-bottom: 0.5rem;
}
}
&__control {
.va-button-group {
margin: 0;
}
}
.va-dropdown__anchor {
display: inline-block;
}
}
</style>
-231
View File
@@ -1,231 +0,0 @@
export interface INavigationRoute {
name: string
displayName: string
meta: { icon: string }
children?: INavigationRoute[]
}
export default {
root: {
name: '/',
displayName: 'navigationRoutes.home',
},
routes: [
{
name: 'dashboard',
displayName: 'menu.dashboard',
meta: {
icon: 'vuestic-iconset-dashboard',
},
},
{
name: 'statistics',
displayName: 'menu.statistics',
meta: {
icon: 'vuestic-iconset-statistics',
},
disabled: true,
children: [
{
name: 'charts',
displayName: 'menu.charts',
},
{
name: 'progress-bars',
displayName: 'menu.progressBars',
},
],
},
{
name: 'forms',
displayName: 'menu.forms',
meta: {
icon: 'vuestic-iconset-forms',
},
disabled: true,
children: [
{
name: 'form-elements',
displayName: 'menu.formElements',
},
{
name: 'medium-editor',
displayName: 'menu.mediumEditor',
},
],
},
{
name: 'tables',
displayName: 'menu.tables',
meta: {
icon: 'vuestic-iconset-tables',
},
children: [
{
name: 'markup',
displayName: 'menu.markupTables',
},
// {
// name: 'data',
// displayName: 'menu.dataTables',
// },
],
},
{
name: 'ui',
displayName: 'menu.uiElements',
meta: {
icon: 'vuestic-iconset-ui-elements',
},
disabled: true,
children: [
{
name: 'buttons',
displayName: 'menu.buttons',
},
{
name: 'cards',
displayName: 'menu.cards',
},
{
name: 'chat',
displayName: 'menu.chat',
},
{
name: 'chips',
displayName: 'menu.chips',
},
{
name: 'collapses',
displayName: 'menu.collapses',
},
{
name: 'colors',
displayName: 'menu.colors',
},
// {
// name: 'color-pickers',
// displayName: 'menu.colorPickers',
// },
{
name: 'file-upload',
displayName: 'menu.fileUpload',
},
{
name: 'grid',
displayName: 'menu.grid',
},
{
name: 'icon-sets',
displayName: 'menu.icons',
children: [
{
displayName: 'concrete',
name: 'icon-set',
},
],
},
{
name: 'lists',
displayName: 'menu.lists',
},
{
name: 'modals',
displayName: 'menu.modals',
},
{
name: 'notifications',
displayName: 'menu.notifications',
},
{
name: 'popovers',
displayName: 'menu.popovers',
},
{
name: 'rating',
displayName: 'menu.rating',
},
{
name: 'sliders',
displayName: 'menu.sliders',
},
{
name: 'spacing',
displayName: 'menu.spacing',
},
{
name: 'spinners',
displayName: 'menu.spinners',
},
{
name: 'tabs',
displayName: 'menu.tabs',
},
// {
// name: "timelines",
// displayName: "menu.timelines",
// },
{
name: 'tree-view',
displayName: 'menu.treeView',
},
{
name: 'typography',
displayName: 'menu.typography',
},
],
},
{
name: 'maps',
displayName: 'menu.maps',
meta: {
icon: 'vuestic-iconset-maps',
},
disabled: true,
children: [
{
name: 'maplibre-maps',
displayName: 'menu.maplibre-maps',
},
{
name: 'yandex-maps',
displayName: 'menu.yandex-maps',
},
{
name: 'leaflet-maps',
displayName: 'menu.leaflet-maps',
},
{
name: 'bubble-maps',
displayName: 'menu.bubble-maps',
},
{
name: 'line-maps',
displayName: 'menu.line-maps',
},
],
},
{
name: 'pages',
displayName: 'menu.pages',
meta: {
icon: 'vuestic-iconset-files',
},
disabled: true,
children: [
{
name: 'login',
displayName: 'menu.login-singup',
},
{
name: '404-pages',
displayName: 'menu.404-pages',
},
{
name: 'faq',
displayName: 'menu.faq',
},
],
},
] as INavigationRoute[],
}
-50
View File
@@ -1,50 +0,0 @@
<template>
<va-sidebar :width="width" :minimized="minimized" :minimized-width="minimizedWidth" :animated="animated">
<menu-minimized v-if="minimized" :items="items" />
<menu-accordion v-else :items="items" />
</va-sidebar>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import NavigationRoutes from './NavigationRoutes'
import MenuAccordion from './menu/MenuAccordion.vue'
import MenuMinimized from './menu/MenuMinimized.vue'
withDefaults(
defineProps<{
width?: string
color?: string
animated?: boolean
minimized?: boolean
minimizedWidth?: string
}>(),
{
width: '16rem',
color: 'secondary',
animated: true,
minimized: true,
minimizedWidth: undefined,
},
)
const items = ref(NavigationRoutes.routes)
</script>
<style lang="scss">
.va-sidebar {
&__menu {
padding: 2rem 0;
}
&-item {
&__icon {
width: 1.5rem;
height: 1.5rem;
display: flex;
justify-content: center;
align-items: center;
}
}
}
</style>
@@ -1,74 +0,0 @@
<template>
<va-accordion v-model="accordionValue" class="sidebar-accordion va-sidebar__menu__inner" multiple>
<va-collapse v-for="(route, idx) in items" :key="idx">
<template #header>
<va-sidebar-item :active="isRouteActive(route)" :to="route.children ? undefined : { name: route.name }">
<va-sidebar-item-content>
<va-icon :name="route.meta.icon" class="va-sidebar-item__icon" />
<va-sidebar-item-title>
{{ t(route.displayName) }}
</va-sidebar-item-title>
<va-icon v-if="route.children" :name="accordionValue[idx] ? 'expand_less' : 'expand_more'" />
</va-sidebar-item-content>
</va-sidebar-item>
</template>
<template v-for="(child, index) in route.children" :key="index">
<va-sidebar-item :active="isRouteActive(child)" :to="{ name: child.name }">
<va-sidebar-item-content>
<div class="va-sidebar-item__icon" />
<va-sidebar-item-title>
{{ t(child.displayName) }}
</va-sidebar-item-title>
</va-sidebar-item-content>
</va-sidebar-item>
</template>
</va-collapse>
</va-accordion>
</template>
<script setup lang="ts">
import { onMounted, ref } from 'vue'
import { INavigationRoute } from '../NavigationRoutes'
import { useRoute } from 'vue-router'
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
const props = withDefaults(
defineProps<{
items?: INavigationRoute[]
}>(),
{
items: () => [],
},
)
const accordionValue = ref<boolean[]>([])
onMounted(() => {
accordionValue.value = props.items.map((item) => isItemExpanded(item))
})
// function isGroup(item: INavigationRoute) {
// return !!item.children
// }
function isRouteActive(item: INavigationRoute) {
return item.name === useRoute().name
}
function isItemExpanded(item: INavigationRoute): boolean {
if (!item.children) {
return false
}
const isCurrentItemActive = isRouteActive(item)
const isChildActive = !!item.children.find((child) =>
child.children ? isItemExpanded(child) : isRouteActive(child),
)
return isCurrentItemActive || isChildActive
}
</script>
@@ -1,107 +0,0 @@
<template>
<va-dropdown
v-for="(route, idx) in items"
:key="idx"
v-model="dropdownsValue[idx]"
placement="right-start"
prevent-overflow
:offset="[1, 0]"
>
<template #anchor>
<va-sidebar-item :active="isItemChildsActive(route)" :to="route.children ? undefined : { name: route.name }">
<va-sidebar-item-content>
<va-icon :name="route.meta.icon" class="va-sidebar-item__icon" />
<va-icon
v-if="route.children"
class="more_icon"
:name="dropdownsValue[idx] ? 'chevron_left' : 'chevron_right'"
/>
</va-sidebar-item-content>
</va-sidebar-item>
</template>
<div class="sidebar-item__children">
<template v-for="(child, index) in route.children" :key="index">
<va-sidebar-item :active="isRouteActive(child)" :to="{ name: child.name }">
<va-sidebar-item-content>
<va-sidebar-item-title>
{{ t(child.displayName) }}
</va-sidebar-item-title>
</va-sidebar-item-content>
</va-sidebar-item>
</template>
</div>
</va-dropdown>
</template>
<script setup lang="ts">
import { INavigationRoute } from '../NavigationRoutes'
import { ref } from 'vue'
import { useRoute } from 'vue-router'
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
withDefaults(
defineProps<{
items?: INavigationRoute[]
}>(),
{
items: () => [],
},
)
const dropdownsValue = ref([])
// function isGroup(item: INavigationRoute) {
// return !!item.children
// }
function isRouteActive(item: INavigationRoute) {
return item.name === useRoute().name
}
function isItemChildsActive(item: INavigationRoute): boolean {
if (!item.children) {
return false
}
const isCurrentItemActive = isRouteActive(item)
let isChildActive = false
if (item.children) {
isChildActive = !!item.children.find((child) =>
child.children ? isItemChildsActive(child) : isRouteActive(child),
)
}
return isCurrentItemActive || isChildActive
}
</script>
<style lang="scss">
.sidebar-item {
&__children {
max-height: 60vh;
overflow-y: auto;
overflow-x: visible;
width: 16rem;
color: var(--va-gray);
background: var(--va-white, #fff);
box-shadow: var(--va-box-shadow);
}
}
.va-sidebar-item {
&-content {
position: relative;
.more_icon {
text-align: center;
position: absolute;
bottom: 0.5rem;
top: 50%;
right: 0;
transform: translateY(-50%);
}
}
}
</style>
-46
View File
@@ -1,46 +0,0 @@
<template>
<component :is="chartComponent" ref="chart" class="va-chart" :chart-options="chartOptions" :chart-data="data" />
</template>
<script setup lang="ts">
import { computed, ref } from 'vue'
import type { TChartOptions } from 'vue-chartjs/dist/types'
import { defaultConfig, chartTypesMap } from './vaChartConfigs'
import { TChartData } from '../../data/types'
const props = defineProps<{
data: TChartData
options?: TChartOptions<'line' | 'bar' | 'bubble' | 'doughnut' | 'pie'>
type: keyof typeof chartTypesMap
}>()
const chart = ref()
const chartComponent = computed(() => chartTypesMap[props.type])
const chartOptions = computed(() => ({
...defaultConfig,
...props.options,
}))
</script>
<style lang="scss">
.va-chart {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
> * {
height: 100%;
width: 100%;
}
canvas {
width: 100%;
height: auto;
min-height: 320px;
}
}
</style>
@@ -1,17 +0,0 @@
<template>
<Bar :chart-options="chartOptions" :chart-data="props.chartData" />
</template>
<script setup lang="ts">
import { Bar } from 'vue-chartjs'
import type { TChartOptions } from 'vue-chartjs/dist/types'
import { Chart as ChartJS, Title, Tooltip, Legend, BarElement, LinearScale, CategoryScale } from 'chart.js'
import { TBarChartData } from '../../../data/types'
ChartJS.register(Title, Tooltip, Legend, BarElement, LinearScale, CategoryScale)
const props = defineProps<{
chartData: TBarChartData
chartOptions?: TChartOptions<'bar'>
}>()
</script>
@@ -1,17 +0,0 @@
<template>
<Bubble :chart-options="chartOptions" :chart-data="props.chartData" />
</template>
<script setup lang="ts">
import { Bubble } from 'vue-chartjs'
import type { TChartOptions } from 'vue-chartjs/dist/types'
import { Chart as ChartJS, Title, Tooltip, Legend, PointElement, LinearScale } from 'chart.js'
import { TBubbleChartData } from '../../../data/types'
ChartJS.register(Title, Tooltip, Legend, PointElement, LinearScale)
const props = defineProps<{
chartData: TBubbleChartData
chartOptions?: TChartOptions<'bubble'>
}>()
</script>
@@ -1,17 +0,0 @@
<template>
<Doughnut :chart-options="chartOptions" :chart-data="props.chartData" />
</template>
<script setup lang="ts">
import { Doughnut } from 'vue-chartjs'
import type { TChartOptions } from 'vue-chartjs/dist/types'
import { Chart as ChartJS, Title, Tooltip, Legend, ArcElement, CategoryScale } from 'chart.js'
import { TDoughnutChartData } from '../../../data/types'
ChartJS.register(Title, Tooltip, Legend, ArcElement, CategoryScale)
const props = defineProps<{
chartData: TDoughnutChartData
chartOptions?: TChartOptions<'doughnut'>
}>()
</script>
@@ -1,26 +0,0 @@
<template>
<Bar :chart-options="{ ...chartOptions, ...horizontalBarOptions }" :chart-data="props.chartData" />
</template>
<script setup lang="ts">
import { Bar } from 'vue-chartjs'
import type { TChartOptions } from 'vue-chartjs/dist/types'
import { Chart as ChartJS, Title, Tooltip, Legend, BarElement, LinearScale, CategoryScale } from 'chart.js'
import { TBarChartData } from '../../../data/types'
ChartJS.register(Title, Tooltip, Legend, BarElement, LinearScale, CategoryScale)
const horizontalBarOptions = {
indexAxis: 'y' as 'x' | 'y',
elements: {
bar: {
borderWidth: 1,
},
},
}
const props = defineProps<{
chartData: TBarChartData
chartOptions?: TChartOptions<'bar'>
}>()
</script>
@@ -1,27 +0,0 @@
<template>
<Line :chart-options="chartOptions" :chart-data="props.chartData" />
</template>
<script setup lang="ts">
import { Line } from 'vue-chartjs'
import type { TChartOptions } from 'vue-chartjs/dist/types'
import {
Chart as ChartJS,
Title,
Tooltip,
Legend,
LineElement,
LinearScale,
PointElement,
CategoryScale,
Filler,
} from 'chart.js'
import { TLineChartData } from '../../../data/types'
ChartJS.register(Title, Tooltip, Legend, LineElement, LinearScale, PointElement, CategoryScale, Filler)
const props = defineProps<{
chartData: TLineChartData
chartOptions?: TChartOptions<'line'>
}>()
</script>
@@ -1,17 +0,0 @@
<template>
<Pie :chart-options="chartOptions" :chart-data="props.chartData" />
</template>
<script setup lang="ts">
import { Pie } from 'vue-chartjs'
import type { TChartOptions } from 'vue-chartjs/dist/types'
import { Chart as ChartJS, Title, Tooltip, Legend, ArcElement, CategoryScale } from 'chart.js'
import { TPieChartData } from '../../../data/types'
ChartJS.register(Title, Tooltip, Legend, ArcElement, CategoryScale)
const props = defineProps<{
chartData: TPieChartData
chartOptions?: TChartOptions<'pie'>
}>()
</script>
@@ -1,48 +0,0 @@
import { defineAsyncComponent } from 'vue'
export const defaultConfig = {
plugins: {
legend: {
position: 'bottom',
labels: {
font: {
color: '#34495e',
family: 'sans-serif',
size: 14,
},
usePointStyle: true,
},
},
tooltip: {
bodyFont: {
size: 14,
family: 'sans-serif',
},
boxPadding: 4,
},
},
datasets: {
line: {
fill: 'origin',
tension: 0.3,
borderColor: 'transparent',
},
bubble: {
borderColor: 'transparent',
},
bar: {
borderColor: 'transparent',
},
},
maintainAspectRatio: false,
animation: true,
}
export const chartTypesMap = {
pie: defineAsyncComponent(() => import('./chart-types/PieChart.vue')),
doughnut: defineAsyncComponent(() => import('./chart-types/DoughnutChart.vue')),
bubble: defineAsyncComponent(() => import('./chart-types/BubbleChart.vue')),
line: defineAsyncComponent(() => import('./chart-types/LineChart.vue')),
bar: defineAsyncComponent(() => import('./chart-types/BarChart.vue')),
'horizontal-bar': defineAsyncComponent(() => import('./chart-types/HorizontalBarChart.vue')),
}
@@ -1,189 +0,0 @@
<template>
<div ref="editorElement" class="va-medium-editor content">
<slot />
</div>
</template>
<script setup lang="ts">
import { ref, Ref, onMounted, onBeforeUnmount } from 'vue'
import MediumEditor from 'medium-editor'
const props = withDefaults(
defineProps<{
editorOptions?: {
buttonLabels: string
autoLink: boolean
toolbar: {
buttons: string[]
}
}
}>(),
{
editorOptions: () => ({
buttonLabels: 'fontawesome',
autoLink: true,
toolbar: {
buttons: ['bold', 'italic', 'underline', 'anchor', 'h1', 'h2', 'h3'],
},
}),
},
)
const emit = defineEmits<{
(e: 'initialized', editor: typeof MediumEditor): void
}>()
const editorElement: Ref<null | HTMLElement> = ref(null)
let editor: typeof MediumEditor | null = null
onMounted(() => {
if (!editorElement.value) {
return
}
editor = new MediumEditor(editorElement.value, props.editorOptions)
emit('initialized', editor)
})
onBeforeUnmount(() => {
if (editor) {
editor.destroy()
}
})
</script>
<style lang="scss">
@import 'medium-editor/src/sass/medium-editor';
@import 'variables';
$medium-editor-shadow: var(--va-box-shadow);
$medium-editor-background-color: var(--va-divider);
$medium-editor-text-color: var(--va-dark);
$medium-editor-active-background-color: var(--va-primary);
$medium-editor-active-text-color: var(--va-white);
.va-medium-editor {
margin-bottom: var(--va-medium-editor-margin-bottom);
min-width: var(--va-medium-editor-min-width);
max-width: var(--va-medium-editor-max-width);
&:focus {
outline: none;
}
&.content {
i {
font-style: italic;
}
}
}
// isn't a part of the .va-medium-editor, so can't be places inside it
.medium-editor-toolbar,
.medium-editor-toolbar-form,
.medium-editor-toolbar-actions,
.medium-editor-toolbar-anchor-preview {
box-shadow: $medium-editor-shadow;
background-color: $medium-editor-background-color;
border-radius: 1.5rem;
height: 44px;
line-height: 42px;
}
.medium-editor-toolbar-anchor-preview {
a {
padding: 0 2rem;
margin: 0;
line-height: 44px;
}
}
.medium-editor-toolbar {
box-shadow: $medium-editor-shadow;
.medium-editor-toolbar-actions {
overflow: hidden;
height: 44px;
}
.medium-editor-action {
margin: 0;
border: 0;
padding: 0.375rem 1rem;
height: 44px;
background-color: $medium-editor-background-color;
box-shadow: none;
border-radius: 0;
i {
color: $medium-editor-text-color;
}
&.medium-editor-button-active {
background-color: $medium-editor-active-background-color;
color: $medium-editor-active-text-color;
i {
color: $medium-editor-active-text-color;
}
}
}
& > .medium-editor-action:not(:last-child) {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-right: 0;
}
& > .medium-editor-action + .medium-editor-action {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-left: 0;
}
}
.medium-editor-toolbar-form {
color: $medium-editor-text-color;
overflow: hidden;
a {
color: $medium-editor-text-color;
transform: translateY(1px);
}
input {
margin-left: 4px !important;
transform: translateY(-2px);
border-radius: 13px;
}
.medium-editor-toolbar-close {
margin-right: 1rem;
}
}
.medium-toolbar-arrow-under::after {
border-color: $medium-editor-background-color transparent transparent transparent;
top: 100%;
}
.medium-toolbar-arrow-over::before {
border-color: transparent transparent var(--va-primary) transparent;
}
.medium-editor-toolbar-anchor-preview {
// @include va-button($btn-padding-y-nrm, $btn-padding-x-nrm, $btn-font-size-nrm, $btn-line-height-nrm, $btn-border-radius-nrm);
.medium-editor-toolbar-anchor-preview {
margin: 0;
}
}
.medium-editor-anchor-preview {
max-width: 50%;
a {
color: $medium-editor-text-color;
text-decoration: none;
}
}
</style>
@@ -1,9 +0,0 @@
:root {
--va-medium-editor-margin-bottom: 2.25rem;
--va-medium-editor-min-width: 6rem;
--va-medium-editor-max-width: 600px;
/* Toolbar */
--va-medium-editor-toolbar-max-width: 90%;
--va-medium-editor-toolbar-box-shadow: none;
}
-243
View File
@@ -1,243 +0,0 @@
export default [
'Afghanistan',
'Albania',
'Algeria',
'American Samoa',
'Andorra',
'Angola',
'Anguilla',
'Antarctica',
'Antigua and Barbuda',
'Argentina',
'Armenia',
'Aruba',
'Australia',
'Austria',
'Azerbaijan',
'Bahamas',
'Bahrain',
'Bangladesh',
'Barbados',
'Belarus',
'Belgium',
'Belize',
'Benin',
'Bermuda',
'Bhutan',
'Bolivia',
'Bosnia and Herzegowina',
'Botswana',
'Bouvet Island',
'Brazil',
'British Indian Ocean Territory',
'Brunei Darussalam',
'Bulgaria',
'Burkina Faso',
'Burundi',
'Cambodia',
'Cameroon',
'Canada',
'Cape Verde',
'Cayman Islands',
'Central African Republic',
'Chad',
'Chile',
'China',
'Christmas Island',
'Cocos (Keeling) Islands',
'Colombia',
'Comoros',
'Congo',
'Congo, the Democratic Republic of the',
'Cook Islands',
'Costa Rica',
"Cote d'Ivoire",
'Croatia (Hrvatska)',
'Cuba',
'Cyprus',
'Czech Republic',
'Denmark',
'Djibouti',
'Dominica',
'Dominican Republic',
'East Timor',
'Ecuador',
'Egypt',
'El Salvador',
'Equatorial Guinea',
'Eritrea',
'Estonia',
'Ethiopia',
'Falkland Islands (Malvinas)',
'Faroe Islands',
'Fiji',
'Finland',
'France',
'France Metropolitan',
'French Guiana',
'French Polynesia',
'French Southern Territories',
'Gabon',
'Gambia',
'Georgia',
'Germany',
'Ghana',
'Gibraltar',
'Greece',
'Greenland',
'Grenada',
'Guadeloupe',
'Guam',
'Guatemala',
'Guinea',
'Guinea-Bissau',
'Guyana',
'Haiti',
'Heard and Mc Donald Islands',
'Holy See (Vatican City State)',
'Honduras',
'Hong Kong',
'Hungary',
'Iceland',
'India',
'Indonesia',
'Iran (Islamic Republic of)',
'Iraq',
'Ireland',
'Israel',
'Italy',
'Jamaica',
'Japan',
'Jordan',
'Kazakhstan',
'Kenya',
'Kiribati',
"Korea, Democratic People's Republic of",
'Korea, Republic of',
'Kuwait',
'Kyrgyzstan',
"Lao, People's Democratic Republic",
'Latvia',
'Lebanon',
'Lesotho',
'Liberia',
'Libyan Arab Jamahiriya',
'Liechtenstein',
'Lithuania',
'Luxembourg',
'Macau',
'Macedonia, The Former Yugoslav Republic of',
'Madagascar',
'Malawi',
'Malaysia',
'Maldives',
'Mali',
'Malta',
'Marshall Islands',
'Martinique',
'Mauritania',
'Mauritius',
'Mayotte',
'Mexico',
'Micronesia, Federated States of',
'Moldova, Republic of',
'Monaco',
'Mongolia',
'Montserrat',
'Morocco',
'Mozambique',
'Myanmar',
'Namibia',
'Nauru',
'Nepal',
'Netherlands',
'Netherlands Antilles',
'New Caledonia',
'New Zealand',
'Nicaragua',
'Niger',
'Nigeria',
'Niue',
'Norfolk Island',
'Northern Mariana Islands',
'Norway',
'Oman',
'Pakistan',
'Palau',
'Panama',
'Papua New Guinea',
'Paraguay',
'Peru',
'Philippines',
'Pitcairn',
'Poland',
'Portugal',
'Puerto Rico',
'Qatar',
'Reunion',
'Romania',
'Russian Federation',
'Rwanda',
'Saint Kitts and Nevis',
'Saint Lucia',
'Saint Vincent and the Grenadines',
'Samoa',
'San Marino',
'Sao Tome and Principe',
'Saudi Arabia',
'Senegal',
'Serbia',
'Seychelles',
'Sierra Leone',
'Singapore',
'Slovakia (Slovak Republic)',
'Slovenia',
'Solomon Islands',
'Somalia',
'South Africa',
'South Georgia and the South Sandwich Islands',
'Spain',
'Sri Lanka',
'St. Helena',
'St. Pierre and Miquelon',
'Sudan',
'Suriname',
'Svalbard and Jan Mayen Islands',
'Swaziland',
'Sweden',
'Switzerland',
'Syrian Arab Republic',
'Taiwan, Province of China',
'Tajikistan',
'Tanzania, United Republic of',
'United States of America',
'Thailand',
'Togo',
'Tokelau',
'Tonga',
'Trinidad and Tobago',
'Tunisia',
'Turkey',
'Turkmenistan',
'Turks and Caicos Islands',
'Tuvalu',
'Uganda',
'Ukraine',
'United Arab Emirates',
'United Kingdom',
'United States',
'United States Minor Outlying Islands',
'Uruguay',
'Uzbekistan',
'Vanuatu',
'Venezuela',
'Vietnam',
'Virgin Islands (British)',
'Virgin Islands (U.S.)',
'Wallis and Futuna Islands',
'Western Sahara',
'Yemen',
'Yugoslavia',
'Zambia',
'Zimbabwe',
]
-30
View File
@@ -1,30 +0,0 @@
import { TBarChartData } from '../types'
export const barChartData: TBarChartData = {
labels: [
'January',
'February',
'March',
'April',
'May',
'June',
'July',
'August',
'September',
'October',
'November',
'December',
],
datasets: [
{
label: 'Last year',
backgroundColor: 'primary',
data: [50, 20, 12, 39, 10, 40, 39, 80, 40, 20, 12, 11],
},
{
label: 'Current year',
backgroundColor: 'info',
data: [50, 10, 22, 39, 15, 20, 85, 32, 60, 50, 20, 30],
},
],
}
-231
View File
@@ -1,231 +0,0 @@
import { TBubbleChartData } from '../types'
export const bubbleChartData: TBubbleChartData = {
datasets: [
{
label: 'USA',
backgroundColor: 'danger',
data: [
{
x: 23,
y: 25,
r: 15,
},
{
x: 40,
y: 10,
r: 10,
},
{
x: 30,
y: 22,
r: 30,
},
{
x: 7,
y: 43,
r: 40,
},
{
x: 23,
y: 27,
r: 12,
},
{
x: 20,
y: 15,
r: 11,
},
{
x: 7,
y: 10,
r: 35,
},
{
x: 10,
y: 20,
r: 40,
},
],
},
{
label: 'Russia',
backgroundColor: 'primary',
data: [
{
x: 0,
y: 30,
r: 15,
},
{
x: 20,
y: 20,
r: 20,
},
{
x: 15,
y: 15,
r: 50,
},
{
x: 31,
y: 46,
r: 30,
},
{
x: 20,
y: 14,
r: 25,
},
{
x: 34,
y: 17,
r: 30,
},
{
x: 44,
y: 44,
r: 10,
},
{
x: 39,
y: 25,
r: 35,
},
],
},
{
label: 'Canada',
backgroundColor: 'warning',
data: [
{
x: 10,
y: 30,
r: 45,
},
{
x: 10,
y: 50,
r: 20,
},
{
x: 5,
y: 5,
r: 30,
},
{
x: 40,
y: 30,
r: 20,
},
{
x: 33,
y: 15,
r: 18,
},
{
x: 40,
y: 20,
r: 40,
},
{
x: 33,
y: 33,
r: 40,
},
],
},
{
label: 'Belarus',
backgroundColor: 'info',
data: [
{
x: 35,
y: 30,
r: 45,
},
{
x: 25,
y: 40,
r: 35,
},
{
x: 5,
y: 5,
r: 30,
},
{
x: 5,
y: 20,
r: 40,
},
{
x: 10,
y: 40,
r: 15,
},
{
x: 3,
y: 10,
r: 10,
},
{
x: 15,
y: 40,
r: 40,
},
{
x: 7,
y: 15,
r: 10,
},
],
},
{
label: 'Ukraine',
backgroundColor: 'success',
data: [
{
x: 25,
y: 10,
r: 40,
},
{
x: 17,
y: 40,
r: 40,
},
{
x: 35,
y: 10,
r: 20,
},
{
x: 3,
y: 40,
r: 10,
},
{
x: 40,
y: 40,
r: 40,
},
{
x: 20,
y: 10,
r: 10,
},
{
x: 10,
y: 27,
r: 35,
},
{
x: 7,
y: 26,
r: 40,
},
],
},
],
}
@@ -1,35 +0,0 @@
import { computed, ref } from '@vue/reactivity'
import { watch } from 'vue'
import { useColors, useGlobalConfig } from 'vuestic-ui'
type chartColors = string | string[]
export function useChartColors(chartColors = [] as chartColors, alfa = 0.6) {
const { getGlobalConfig } = useGlobalConfig()
const { setHSLAColor, getColor } = useColors()
const generateHSLAColors = (colors: chartColors) =>
typeof colors === 'string'
? setHSLAColor(getColor(colors), { a: alfa })
: colors.map((color) => setHSLAColor(getColor(color), { a: alfa }))
const generateColors = (colors: chartColors) =>
typeof colors === 'string' ? getColor(colors) : colors.map((color) => getColor(color))
const generatedHSLAColors = ref(generateHSLAColors(chartColors))
const generatedColors = ref(generateColors(chartColors))
const theme = computed(() => getGlobalConfig().colors!)
watch(theme, () => {
generatedHSLAColors.value = generateHSLAColors(chartColors)
generatedColors.value = generateColors(chartColors)
})
return {
generateHSLAColors,
generateColors,
generatedColors,
generatedHSLAColors,
}
}
@@ -1,20 +0,0 @@
import { computed, ComputedRef } from '@vue/reactivity'
import { useChartColors } from './useChartColors'
import { TChartData } from '../../types'
export function useChartData<T extends TChartData>(data: T, alfa?: number): ComputedRef<T> {
const datasetsColors = data.datasets.map((dataset) => dataset.backgroundColor as string)
const datasetsThemesColors = datasetsColors.map(
(colors) => useChartColors(colors, alfa)[alfa ? 'generatedHSLAColors' : 'generatedColors'],
)
return computed(() => {
const datasets = data.datasets.map((dataset, idx) => ({
...dataset,
backgroundColor: datasetsThemesColors[idx].value,
}))
return { ...data, datasets } as T
})
}
-12
View File
@@ -1,12 +0,0 @@
import { TDoughnutChartData } from '../types'
export const doughnutChartData: TDoughnutChartData = {
labels: ['North America', 'South America', 'Australia'],
datasets: [
{
label: 'Population (millions)',
backgroundColor: ['danger', 'info', 'primary'],
data: [2478, 5267, 734],
},
],
}
-30
View File
@@ -1,30 +0,0 @@
import { TBarChartData } from '../types'
export const horizontalBarChartData: TBarChartData = {
labels: [
'January',
'February',
'March',
'April',
'May',
'June',
'July',
'August',
'September',
'October',
'November',
'December',
],
datasets: [
{
label: 'Vuestic Satisfaction Score',
backgroundColor: 'primary',
data: [80, 90, 50, 70, 60, 90, 50, 90, 80, 40, 72, 93],
},
{
label: 'Bulma Satisfaction Score',
backgroundColor: 'danger',
data: [20, 30, 20, 40, 50, 40, 15, 60, 30, 20, 42, 53],
},
],
}
-6
View File
@@ -1,6 +0,0 @@
export { bubbleChartData } from './bubbleChartData'
export { doughnutChartData } from './doughnutChartData'
export { barChartData } from './barChartData'
export { horizontalBarChartData } from './horizontalBarChartData'
export { lineChartData } from './lineChartData'
export { pieChartData } from './pieChartData'
-44
View File
@@ -1,44 +0,0 @@
import { TLineChartData } from '../types'
const months = [
'January',
'February',
'March',
'April',
'May',
'June',
'July',
'August',
'September',
'October',
'November',
'December',
]
const getSize = (minSize = 5) => Math.max(minSize, new Date().getMonth())
const size = getSize()
const generateValue = () => Math.floor(Math.random() * 100)
const generateArray = (length: number) => Array.from(Array(length), generateValue)
const generateYLabels = () => {
const flip = !!Math.floor(Math.random() * 2)
return flip ? ['Debit', 'Credit'] : ['Credit', 'Debit']
}
const yLabels = generateYLabels()
export const lineChartData: TLineChartData = {
labels: months.slice(0, size),
datasets: [
{
label: yLabels[0],
backgroundColor: 'primary',
data: generateArray(size),
},
{
label: yLabels[1],
backgroundColor: 'secondary',
data: generateArray(size),
},
],
}
-12
View File
@@ -1,12 +0,0 @@
import { TLineChartData } from '../types'
export const pieChartData: TLineChartData = {
labels: ['Africa', 'Asia', 'Europe'],
datasets: [
{
label: 'Population (millions)',
backgroundColor: ['primary', 'warning', 'danger'],
data: [2478, 5267, 734],
},
],
}
File diff suppressed because it is too large Load Diff
-342
View File
@@ -1,342 +0,0 @@
import { computed, ComputedRef, Ref } from '@vue/reactivity'
import { useColors } from 'vuestic-ui'
type GeoBounds = {
bottom: number
left: number
right: number
top: number
}
export type PointGeoCoord = {
latitude: number
longitude: number
}
export type DataGeometry = {
geometry: {
type: string
coordinates: [number, number][]
}
}
export type CityItem = {
id?: string
title: string
country: string
latitude: number
longitude: number
svgPath: string
color: string
flights?: PointGeoCoord[]
}
const targetSVG =
'M9,0C4.029,0,0,4.029,0,9s4.029,9,9,9s9-4.029,9-9S13.971,0,9,0z M9,15.93 c-3.83,0-6.93-3.1-6.93-6.93S5.17,2.07,9,2.07s6.93,3.1,6.93,6.93S12.83,15.93,9,15.93 M12.5,9c0,1.933-1.567,3.5-3.5,3.5S5.5,10.933,5.5,9S7.067,5.5,9,5.5 S12.5,7.067,12.5,9z'
export const planeSVG =
'M19.671,8.11l-2.777,2.777l-3.837-0.861c0.362-0.505,0.916-1.683,0.464-2.135c-0.518-0.517-1.979,0.278-2.305,0.604l-0.913,0.913L7.614,8.804l-2.021,2.021l2.232,1.061l-0.082,0.082l1.701,1.701l0.688-0.687l3.164,1.504L9.571,18.21H6.413l-1.137,1.138l3.6,0.948l1.83,1.83l0.947,3.598l1.137-1.137V21.43l3.725-3.725l1.504,3.164l-0.687,0.687l1.702,1.701l0.081-0.081l1.062,2.231l2.02-2.02l-0.604-2.689l0.912-0.912c0.326-0.326,1.121-1.789,0.604-2.306c-0.452-0.452-1.63,0.101-2.135,0.464l-0.861-3.838l2.777-2.777c0.947-0.947,3.599-4.862,2.62-5.839C24.533,4.512,20.618,7.163,19.671,8.11z'
const london = {
id: 'london',
color: 'info',
svgPath: targetSVG,
title: 'London',
country: 'United Kingdom',
latitude: 51.5002,
longitude: -0.1262,
flights: [
{
latitude: 50.4422,
longitude: 30.5367,
},
{
latitude: 46.948,
longitude: 7.4481,
},
{
latitude: 59.3328,
longitude: 18.0645,
},
{
latitude: 40.4167,
longitude: -3.7033,
},
{
latitude: 46.0514,
longitude: 14.506,
},
{
latitude: 48.2116,
longitude: 17.1547,
},
{
latitude: 44.8048,
longitude: 20.4781,
},
{
latitude: 55.7558,
longitude: 37.6176,
},
{
latitude: 38.7072,
longitude: -9.1355,
},
{
latitude: 54.6896,
longitude: 25.2799,
},
{
latitude: 64.1353,
longitude: -21.8952,
},
{
latitude: 40.43,
longitude: -74.0,
},
],
}
const vilnius = {
id: 'vilnius',
color: 'info',
svgPath: targetSVG,
title: 'Vilnius',
country: 'Lithuania',
latitude: 54.6896,
longitude: 25.2799,
flights: [
{
latitude: 50.8371,
longitude: 4.3676,
},
{
latitude: 59.9138,
longitude: 10.7387,
},
{
latitude: 40.4167,
longitude: -3.7033,
},
{
latitude: 50.0878,
longitude: 14.4205,
},
{
latitude: 48.2116,
longitude: 17.1547,
},
{
latitude: 44.8048,
longitude: 20.4781,
},
{
latitude: 55.7558,
longitude: 37.6176,
},
{
latitude: 37.9792,
longitude: 23.7166,
},
{
latitude: 51.5002,
longitude: -0.1262,
},
{
latitude: 53.3441,
longitude: -6.2675,
},
],
}
const cities: CityItem[] = [
london,
vilnius,
{
svgPath: targetSVG,
color: 'info',
title: 'Brussels',
country: 'Belgium',
latitude: 50.8371,
longitude: 4.3676,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Prague',
country: 'Czech Republic',
latitude: 50.0878,
longitude: 14.4205,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Athens',
country: 'Greece',
latitude: 37.9792,
longitude: 23.7166,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Reykjavik',
country: 'Iceland',
latitude: 64.1353,
longitude: -21.8952,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Dublin',
country: 'Ireland',
latitude: 53.3441,
longitude: -6.2675,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Oslo',
country: 'Norway',
latitude: 59.9138,
longitude: 10.7387,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Lisbon',
country: 'Portugal',
latitude: 38.7072,
longitude: -9.1355,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Moscow',
country: 'Russia',
latitude: 55.7558,
longitude: 37.6176,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Belgrade',
country: 'Serbia',
latitude: 44.8048,
longitude: 20.4781,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Bratislava',
country: 'Slovakia',
latitude: 48.2116,
longitude: 17.1547,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Ljubljana',
country: 'Slovenia',
latitude: 46.0514,
longitude: 14.506,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Madrid',
country: 'Spain',
latitude: 40.4167,
longitude: -3.7033,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Stockholm',
country: 'Sweden',
latitude: 59.3328,
longitude: 18.0645,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Bern',
country: 'Switzerland',
latitude: 46.948,
longitude: 7.4481,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Kiev',
country: 'Ukraine',
latitude: 50.4422,
longitude: 30.5367,
},
{
svgPath: targetSVG,
color: 'info',
title: 'Paris',
country: 'France',
latitude: 48.8567,
longitude: 2.351,
},
{
svgPath: targetSVG,
color: 'info',
title: 'New York',
country: 'United States of America',
latitude: 40.43,
longitude: -74,
},
]
export const lineMapData = {
cities,
mainCity: london.title,
homeCity: london.title,
}
export const useMapData = (data: Ref<CityItem[]>): ComputedRef<CityItem[]> => {
const { getColor } = useColors()
return computed(() =>
data.value.map((item) => ({
...item,
color: getColor(item.color),
})),
)
}
export const getGeoBounds = (item?: CityItem): GeoBounds | undefined => {
if (!item || !item.flights || !item.flights.length) {
return
}
const latitudes = [...item.flights.map(({ latitude }) => latitude), item.latitude]
const longitudes = [...item.flights.map(({ longitude }) => longitude), item.longitude]
return {
bottom: Math.min(...latitudes),
left: Math.min(...longitudes),
right: Math.max(...longitudes),
top: Math.max(...latitudes),
}
}
export const generateLineSeriesData = (item?: CityItem): DataGeometry[] | undefined => {
if (!item || !item.flights || !item.flights.length) {
return
}
return item.flights.map((point) => ({
geometry: {
type: 'LineString',
coordinates: [
[item.longitude, item.latitude],
[point.longitude, point.latitude],
],
},
}))
}
export const compareStrings = (first: string, second: string) => first.toLowerCase() === second.toLowerCase()
-402
View File
@@ -1,402 +0,0 @@
[
{
"id": "5d3026a3a4c8c8f35689104b",
"name": "Mcguire Prince",
"email": "mcguireprince@glasstep.com",
"country": "Swaziland",
"starred": false,
"status": "processing"
},
{
"id": "5d3026a3e1579c30d1703632",
"name": "Dean Jennings",
"email": "deanjennings@glasstep.com",
"country": "Korea (North)",
"starred": true,
"status": "rejected"
},
{
"id": "5d3026a38023a44a3b5e934d",
"name": "Cotton Weber",
"email": "cottonweber@glasstep.com",
"country": "Mozambique",
"starred": false,
"status": "rejected"
},
{
"id": "5d3026a31c6b23082419e5f4",
"name": "Osborne Foster",
"email": "osbornefoster@glasstep.com",
"country": "US Minor Outlying Islands",
"starred": true,
"status": "paid"
},
{
"id": "5d3026a3b2cca1fd45746dbf",
"name": "William Dillard",
"email": "williamdillard@glasstep.com",
"country": "Cayman Islands",
"starred": true,
"status": "processing"
},
{
"id": "5d3026a3486badb41f9f18b5",
"name": "Anna Meyers",
"email": "annameyers@glasstep.com",
"country": "Viet Nam",
"starred": false,
"status": "paid"
},
{
"id": "5d3026a3c614901a53477e5c",
"name": "Ana Barrett",
"email": "anabarrett@glasstep.com",
"country": "Rwanda",
"starred": false,
"status": "processing"
},
{
"id": "5d3026a3fcff2a76b73e6016",
"name": "Pam Ward",
"email": "pamward@glasstep.com",
"country": "Kuwait",
"starred": false,
"status": "processing"
},
{
"id": "5d3026a3b54fc3e9a2570ce8",
"name": "Hannah Holloway",
"email": "hannahholloway@glasstep.com",
"country": "Gibraltar",
"starred": false,
"status": "paid"
},
{
"id": "5d3026a3e2303324ae9d823f",
"name": "Allison Cobb",
"email": "allisoncobb@glasstep.com",
"country": "East Timor",
"starred": true,
"status": "processing"
},
{
"id": "5d3026a3f22a52e3706ed868",
"name": "Terrie Hawkins",
"email": "terriehawkins@glasstep.com",
"country": "Greenland",
"starred": false,
"status": "processing"
},
{
"id": "5d3026a32bad267623e706ec",
"name": "Peck Ryan",
"email": "peckryan@glasstep.com",
"country": "Belgium",
"starred": false,
"status": "processing"
},
{
"id": "5d3026a37a50452a85d01cbb",
"name": "Candace Powell",
"email": "candacepowell@glasstep.com",
"country": "Yugoslavia",
"starred": false,
"status": "rejected"
},
{
"id": "5d3026a3ce9f5acf20065037",
"name": "Wolfe Pitts",
"email": "wolfepitts@glasstep.com",
"country": "Bouvet Island",
"starred": true,
"status": "rejected"
},
{
"id": "5d3026a3e3a5afe09338eca5",
"name": "Marietta Robbins",
"email": "mariettarobbins@glasstep.com",
"country": "Martinique",
"starred": true,
"status": "paid"
},
{
"id": "5d3026a33fc3196e598bdc7b",
"name": "Michelle Wolfe",
"email": "michellewolfe@glasstep.com",
"country": "French Guiana",
"starred": false,
"status": "rejected"
},
{
"id": "5d3026a3364f517d8f5dbf16",
"name": "Katina Lindsay",
"email": "katinalindsay@glasstep.com",
"country": "Guyana",
"starred": true,
"status": "rejected"
},
{
"id": "5d3026a313dedc3cf25404ba",
"name": "Bridgett Lloyd",
"email": "bridgettlloyd@glasstep.com",
"country": "Niger",
"starred": false,
"status": "processing"
},
{
"id": "5d3026a3a72281322b845f6a",
"name": "Letha Hamilton",
"email": "lethahamilton@glasstep.com",
"country": "Zimbabwe",
"starred": true,
"status": "processing"
},
{
"id": "5d3026a3bd037e491b76f097",
"name": "Mcclain Doyle",
"email": "mcclaindoyle@glasstep.com",
"country": "Switzerland",
"starred": false,
"status": "rejected"
},
{
"id": "5d3026a36aa5b7fda077d6ef",
"name": "Giles Lucas",
"email": "gileslucas@glasstep.com",
"country": "Bhutan",
"starred": true,
"status": "processing"
},
{
"id": "5d3026a381c974954ce9ab94",
"name": "Figueroa Lowery",
"email": "figueroalowery@glasstep.com",
"country": "Netherlands Antilles",
"starred": false,
"status": "rejected"
},
{
"id": "5d3026a3c0af2698fcd2a750",
"name": "Valeria Justice",
"email": "valeriajustice@glasstep.com",
"country": "Moldova",
"starred": true,
"status": "processing"
},
{
"id": "5d3026a301d5e7c957e6d864",
"name": "Louise Ayala",
"email": "louiseayala@glasstep.com",
"country": "India",
"starred": true,
"status": "rejected"
},
{
"id": "5d3026a31f6f1fd6399aeee6",
"name": "Kathrine Kirby",
"email": "kathrinekirby@glasstep.com",
"country": "Cook Islands",
"starred": false,
"status": "rejected"
},
{
"id": "5d3026a3e8cb16cd2afa41dd",
"name": "Brandi Morris",
"email": "brandimorris@glasstep.com",
"country": "Honduras",
"starred": false,
"status": "rejected"
},
{
"id": "5d3026a3c52ac7ffb85c892d",
"name": "Margaret Mckenzie",
"email": "margaretmckenzie@glasstep.com",
"country": "Jordan",
"starred": false,
"status": "processing"
},
{
"id": "5d3026a3c66670f258790358",
"name": "Janie Collier",
"email": "janiecollier@glasstep.com",
"country": "Samoa",
"starred": true,
"status": "rejected"
},
{
"id": "5d3026a3108b6b1d543fb117",
"name": "Catherine Vance",
"email": "catherinevance@glasstep.com",
"country": "Sierra Leone",
"starred": false,
"status": "paid"
},
{
"id": "5d3026a325d727b6d9b85d84",
"name": "Kate Allen",
"email": "kateallen@glasstep.com",
"country": "France",
"starred": true,
"status": "processing"
},
{
"id": "5d3026a32be6debb7532cc75",
"name": "Jeanne Cross",
"email": "jeannecross@glasstep.com",
"country": "Anguilla",
"starred": true,
"status": "processing"
},
{
"id": "5d3026a3cc16b4cd36e3a7b4",
"name": "Stewart Hanson",
"email": "stewarthanson@glasstep.com",
"country": "Western Sahara",
"starred": false,
"status": "processing"
},
{
"id": "5d3026a3d3496dd200d5f6af",
"name": "Beulah Castaneda",
"email": "beulahcastaneda@glasstep.com",
"country": "Malaysia",
"starred": true,
"status": "rejected"
},
{
"id": "5d3026a3187e74fcd18a7918",
"name": "Carissa Taylor",
"email": "carissataylor@glasstep.com",
"country": "Burkina Faso",
"starred": false,
"status": "paid"
},
{
"id": "5d3026a32db20d8ce9111367",
"name": "Muriel Butler",
"email": "murielbutler@glasstep.com",
"country": "Pitcairn",
"starred": false,
"status": "processing"
},
{
"id": "5d3026a35b04715a89693024",
"name": "Janna Anthony",
"email": "jannaanthony@glasstep.com",
"country": "Nigeria",
"starred": false,
"status": "paid"
},
{
"id": "5d3026a3a40b0f908cf0b831",
"name": "Cortez Singleton",
"email": "cortezsingleton@glasstep.com",
"country": "Morocco",
"starred": true,
"status": "processing"
},
{
"id": "5d3026a30ab099fe57fe76ad",
"name": "Acevedo Blevins",
"email": "acevedoblevins@glasstep.com",
"country": "Turkmenistan",
"starred": false,
"status": "paid"
},
{
"id": "5d3026a39f9244d7f7d7fe80",
"name": "Hamilton Lewis",
"email": "hamiltonlewis@glasstep.com",
"country": "Marshall Islands",
"starred": true,
"status": "paid"
},
{
"id": "5d3026a3637724139b82f9bc",
"name": "Marylou Wright",
"email": "marylouwright@glasstep.com",
"country": "Iraq",
"starred": true,
"status": "paid"
},
{
"id": "5d3026a3e5cda49e94e1f0de",
"name": "Lenore Bullock",
"email": "lenorebullock@glasstep.com",
"country": "El Salvador",
"starred": true,
"status": "paid"
},
{
"id": "5d3026a30bcb1168afa7bb26",
"name": "Enid Stephens",
"email": "enidstephens@glasstep.com",
"country": "Greece",
"starred": false,
"status": "rejected"
},
{
"id": "5d3026a34b33074f1ee12e73",
"name": "Oneill Joyner",
"email": "oneilljoyner@glasstep.com",
"country": "Micronesia",
"starred": false,
"status": "paid"
},
{
"id": "5d3026a3f3f5a4121051c6bc",
"name": "Kristine Finley",
"email": "kristinefinley@glasstep.com",
"country": "Uganda",
"starred": false,
"status": "paid"
},
{
"id": "5d3026a341bb45b14a38d0ec",
"name": "York Carson",
"email": "yorkcarson@glasstep.com",
"country": "Cyprus",
"starred": true,
"status": "paid"
},
{
"id": "5d3026a32ed6a9a296e01c71",
"name": "Nikki Conway",
"email": "nikkiconway@glasstep.com",
"country": "Tuvalu",
"starred": true,
"status": "paid"
},
{
"id": "5d3026a32b3f710cb8b73bca",
"name": "Lindsey Burgess",
"email": "lindseyburgess@glasstep.com",
"country": "Mali",
"starred": false,
"status": "processing"
},
{
"id": "5d3026a3fbfadf6c0b971769",
"name": "Love Christian",
"email": "lovechristian@glasstep.com",
"country": "Andorra",
"starred": false,
"status": "rejected"
},
{
"id": "5d3026a35c48c5e49f1930e0",
"name": "Julia Sawyer",
"email": "juliasawyer@glasstep.com",
"country": "Hungary",
"starred": true,
"status": "processing"
},
{
"id": "5d3026a3fc275278bd752b31",
"name": "Mayer Warren",
"email": "mayerwarren@glasstep.com",
"country": "Latvia",
"starred": false,
"status": "rejected"
}
]
-13
View File
@@ -1,13 +0,0 @@
import type { TChartData as ChartData } from 'vue-chartjs/dist/types'
export type ColorThemes = {
[key: string]: string
}
export type TLineChartData = ChartData<'line'>
export type TBarChartData = ChartData<'bar'>
export type TBubbleChartData = ChartData<'bubble'>
export type TDoughnutChartData = ChartData<'doughnut'>
export type TPieChartData = ChartData<'pie'>
export type TChartData = TLineChartData | TBarChartData | TBubbleChartData | TDoughnutChartData | TPieChartData
-386
View File
@@ -1,386 +0,0 @@
[
{
"id": "5d2c865e9a0bae79a6ef7cfa",
"firstName": "Ashley",
"lastName": "Mcdaniel",
"fullName": "Ashley Mcdaniel",
"email": "ashleymcdaniel@nebulean.com",
"country": "Cayman Islands",
"starred": true,
"hasReport": false,
"status": "warning",
"checked": false,
"trend": "down",
"color": "warning",
"graph": "M 5 20 C 10 5, 15 5, 30 30 S 20 20, 70 20",
"graphColor": "#4ae387"
},
{
"id": "5d2c865ec73341e16e5f2251",
"firstName": "Sellers",
"lastName": "Todd",
"fullName": "Todd Sellers",
"email": "sellerstodd@nebulean.com",
"country": "Togo",
"starred": false,
"hasReport": false,
"status": "info",
"checked": false,
"trend": "none",
"color": "primary",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
},
{
"id": "5d2c865e38800c5ce28f2f6b",
"firstName": "Sherman",
"lastName": "Knowles",
"fullName": "Sherman Knowles",
"email": "shermanknowles@nebulean.com",
"country": "Central African Republic",
"starred": true,
"hasReport": true,
"status": "warning",
"checked": false,
"trend": "none",
"color": "warning",
"graph": "M 5 20 C 10 5, 15 5, 30 30 S 20 20, 70 20",
"graphColor": "#4ae387"
},
{
"id": "5d2c865e957cd150b82e17a6",
"firstName": "Vasquez",
"lastName": "Lawson",
"fullName": "Vasquez Lawson",
"email": "vasquezlawson@nebulean.com",
"country": "Bouvet Island",
"starred": true,
"hasReport": false,
"status": "info",
"checked": false,
"trend": "down",
"color": "warning",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
},
{
"id": "5d2c865e9194dbe2faf99227",
"firstName": "April",
"lastName": "Sykes",
"fullName": "April Sykes",
"email": "aprilsykes@nebulean.com",
"country": "Saint Vincent and The Grenadines",
"starred": false,
"hasReport": true,
"status": "warning",
"checked": false,
"trend": "down",
"color": "primary",
"graph": "M 5 20 C 10 5, 15 5, 30 30 S 20 20, 70 20",
"graphColor": "#4ae387"
},
{
"id": "5d2c865e1ed74d83f6b26934",
"firstName": "Hodges",
"lastName": "Garrison",
"fullName": "Hodges Garrison",
"email": "hodgesgarrison@nebulean.com",
"country": "Zimbabwe",
"starred": true,
"hasReport": false,
"status": "info",
"checked": false,
"trend": "none",
"color": "info",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
},
{
"id": "5d2c865e0ef31380880c3de5",
"firstName": "Therese",
"lastName": "Stokes",
"fullName": "Therese Stokes",
"email": "theresestokes@nebulean.com",
"country": "Mali",
"starred": true,
"hasReport": false,
"status": "info",
"checked": false,
"trend": "up",
"color": "warning",
"graph": "M 5 20 C 10 5, 15 5, 30 30 S 20 20, 70 20",
"graphColor": "#4ae387"
},
{
"id": "5d2c865e4b5ab4727e5c8b69",
"firstName": "Goodwin",
"lastName": "Brewer",
"fullName": "Goodwin Brewer",
"email": "goodwinbrewer@nebulean.com",
"country": "Iraq",
"starred": true,
"hasReport": true,
"status": "info",
"checked": false,
"trend": "none",
"color": "info",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
},
{
"id": "5d2c865e4c4d675787cfe1c0",
"firstName": "Gomez",
"lastName": "Wise",
"fullName": "Gomez Wise",
"email": "gomezwise@nebulean.com",
"country": "Portugal",
"starred": true,
"hasReport": true,
"status": "info",
"checked": false,
"trend": "none",
"color": "primary",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
},
{
"id": "5d2c865e1017c3229017fc68",
"firstName": "Laverne",
"lastName": "Ayers",
"fullName": "Laverne Ayers",
"email": "laverneayers@nebulean.com",
"country": "Micronesia",
"starred": false,
"hasReport": false,
"status": "warning",
"checked": false,
"trend": "down",
"color": "info",
"graph": "M 5 20 C 10 5, 15 5, 30 30 S 20 20, 70 20",
"graphColor": "#4ae387"
},
{
"id": "5d2c865ee66676fd7464f8b9",
"firstName": "Stewart",
"lastName": "Leon",
"fullName": "Stewart Leon",
"email": "stewartleon@nebulean.com",
"country": "Seychelles",
"starred": true,
"hasReport": false,
"status": "info",
"checked": false,
"trend": "up",
"color": "info",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
},
{
"id": "5d2c865e644d8acbed1e0e97",
"firstName": "Lindsey",
"lastName": "Hopkins",
"fullName": "Lindsey Hopkins",
"email": "lindseyhopkins@nebulean.com",
"country": "Costa Rica",
"starred": false,
"hasReport": true,
"status": "info",
"checked": false,
"trend": "up",
"color": "primary",
"graph": "M 5 20 C 10 5, 15 5, 30 30 S 20 20, 70 20",
"graphColor": "#4ae387"
},
{
"id": "5d2c865ef2b732c74dc3d6a2",
"firstName": "Head",
"lastName": "Lloyd",
"fullName": "Head Lloyd",
"email": "headlloyd@nebulean.com",
"country": "Turkey",
"starred": true,
"hasReport": false,
"status": "warning",
"checked": false,
"trend": "down",
"color": "info",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
},
{
"id": "5d2c865e4ee4f09e92ead2e7",
"firstName": "Fisher",
"lastName": "Bradford",
"fullName": "Fisher Bradford",
"email": "fisherbradford@nebulean.com",
"country": "Ethiopia",
"starred": true,
"hasReport": true,
"status": "info",
"checked": false,
"trend": "up",
"color": "info",
"graph": "M 5 20 C 10 5, 15 5, 30 30 S 20 20, 70 20",
"graphColor": "#4ae387"
},
{
"id": "5d2c865e88d46a9e9049a549",
"firstName": "Aurora",
"lastName": "Bird",
"fullName": "Aurora Bird",
"email": "aurorabird@nebulean.com",
"country": "Burkina Faso",
"starred": false,
"hasReport": true,
"status": "warning",
"checked": false,
"trend": "up",
"color": "info",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
},
{
"id": "5d2c865e44bf14ea96d6e752",
"firstName": "Bonita",
"lastName": "Shields",
"fullName": "Bonita Shields",
"email": "bonitashields@nebulean.com",
"country": "Cote D'Ivoire (Ivory Coast)",
"starred": true,
"hasReport": true,
"status": "warning",
"checked": false,
"trend": "down",
"color": "primary",
"graph": "M 5 20 C 10 5, 15 5, 30 30 S 20 20, 70 20",
"graphColor": "#4ae387"
},
{
"id": "5d2c865e2a8be26f6ac4369c",
"firstName": "Ethel",
"lastName": "Underwood",
"fullName": "Ethel Underwood",
"email": "ethelunderwood@nebulean.com",
"country": "Vanuatu",
"starred": false,
"hasReport": false,
"status": "warning",
"checked": false,
"trend": "down",
"color": "info",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
},
{
"id": "5d2c865e5e0aea40111c37f8",
"firstName": "Parker",
"lastName": "May",
"fullName": "Parker May",
"email": "parkermay@nebulean.com",
"country": "Pakistan",
"starred": true,
"hasReport": false,
"status": "warning",
"checked": false,
"trend": "down",
"color": "warning",
"graph": "M 5 20 C 10 5, 15 5, 30 30 S 20 20, 70 20",
"graphColor": "#4ae387"
},
{
"id": "5d2c865e7e0c05ecc2d0c186",
"firstName": "Hillary",
"lastName": "Waters",
"fullName": "Hillary Waters",
"email": "hillarywaters@nebulean.com",
"country": "Comoros",
"starred": true,
"hasReport": true,
"status": "info",
"checked": false,
"trend": "down",
"color": "primary",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
},
{
"id": "5d2c865e80a72eeda016b169",
"firstName": "Raquel",
"lastName": "Ferrell",
"fullName": "Raquel Ferrell",
"email": "raquelferrell@nebulean.com",
"country": "China",
"starred": false,
"hasReport": false,
"status": "warning",
"checked": false,
"trend": "down",
"color": "info",
"graph": "M 5 20 C 10 5, 15 5, 30 30 S 20 20, 70 20",
"graphColor": "#4ae387"
},
{
"id": "5d2c865eafacadd378add679",
"firstName": "Pickett",
"lastName": "Page",
"fullName": "Pickett Page",
"email": "pickettpage@nebulean.com",
"country": "Bermuda",
"starred": true,
"hasReport": false,
"status": "info",
"checked": false,
"trend": "up",
"color": "info",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
},
{
"id": "5d2c865e772b1a75bb0a07b5",
"firstName": "Alyson",
"lastName": "Bailey",
"fullName": "Alyson Bailey",
"email": "alysonbailey@nebulean.com",
"country": "United Arab Emirates",
"starred": false,
"hasReport": false,
"status": "warning",
"checked": false,
"trend": "up",
"color": "warning",
"graph": "M 5 20 C 10 5, 15 5, 30 30 S 20 20, 70 20",
"graphColor": "#4ae387"
},
{
"id": "5d2c865e137c19a76b56210c",
"firstName": "Farley",
"lastName": "Meyers",
"fullName": "Farley Meyers",
"email": "farleymeyers@nebulean.com",
"country": "Christmas Island",
"starred": false,
"hasReport": false,
"status": "info",
"checked": false,
"trend": "up",
"color": "warning",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
},
{
"id": "5d2c865eb0ba37a27aa9afe0",
"firstName": "Hinton",
"lastName": "Avery",
"fullName": "Hinton Avery",
"email": "hintonavery@nebulean.com",
"country": "Liechtenstein",
"starred": false,
"hasReport": true,
"status": "info",
"checked": false,
"trend": "up",
"color": "info",
"graph": "M 5 30 C 10 5, 30 10, 40 30 S 30 30, 90 40",
"graphColor": "#e34a4a"
}
]
-1
View File
@@ -1 +0,0 @@
/// <reference types="vite/client" />
-23
View File
@@ -1,23 +0,0 @@
import { createI18n } from 'vue-i18n'
const fileNameToLocaleModuleDict = import.meta.globEager('./locales/*.json')
const messages: { [P: string]: Record<string, string> } = {}
Object.entries(fileNameToLocaleModuleDict)
.map(([fileName, localeModule]) => {
const fileNameParts = fileName.split('/')
const fileNameWithoutPath = fileNameParts[fileNameParts.length - 1]
const localeName = fileNameWithoutPath.split('.json')[0]
return [localeName, localeModule.default]
})
.forEach((localeNameLocaleMessagesTuple) => {
messages[localeNameLocaleMessagesTuple[0]] = localeNameLocaleMessagesTuple[1]
})
export default createI18n({
legacy: false,
locale: 'gb',
fallbackLocale: 'gb',
messages,
})
-258
View File
@@ -1,258 +0,0 @@
{
"auth": {
"agree": "Eu aceito.",
"alreadyJoined": "Já entrou.",
"createAccount": "Criar conta",
"createNewAccount": "Criar uma nova conta",
"email": "Email",
"login": "Entrar",
"password": "Senha",
"signUp": "Cadastrar-se",
"termsOfUse": "Termos de uso.",
"welcome": "Bem vindo!"
},
"buttons": {
"advanced": "Icones, Grupos, Dropdowns",
"button": "BOTÃO",
"colors": "Cores",
"disabled": "DESABILITADO",
"dropdown": "DROPDOWN",
"hover": "HOVER",
"main": "Primeiro & Segundo Botão",
"micro": "MICRO",
"pressed": "PRESSIONADO",
"small": "PEQUENO"
},
"charts": {
"horizontalBarChart": "Barra de Gráfico Horizontal",
"verticalBarChart": "Barra de Gráfico Vertical",
"lineChart": "Gráfico de Linha",
"pieChart": "Gráfico Pizza",
"donutChart": "Gráfico Rosca",
"bubbleChart": "Gráfico Bolhas"
},
"dashboard": {
"success": "SUCESSO",
"successMessage": "Você leu com sucesso esta mensagem importante de alerta.",
"elements": "Elementos",
"teamMembers": "Membros da Equipe",
"versions": "Versões",
"table": {
"title": "Mesa impressionante",
"brief": "Breve",
"detailed": "Detalhado",
"resolve": "Resolver",
"resolved": "Resolvido"
}
},
"notificationsPage": {
"alerts": {
"title": "Alertas",
"success": "SUCESSO",
"successMessage": "Você leu com sucesso esta mensagem importante de alerta.",
"info": "INFORMAÇÃO",
"infoMessage": "Esse alerta precisa da sua atenção, mas não é super importante.",
"warning": "AVISO",
"warningMessage": "Melhor verificar a si mesmo, você não está muito bem.",
"danger": "PERÍGO",
"dangerMessage": "Mude algumas coisas e tente enviar novamente."
},
"popovers": {
"title": "Dicas de ferramentas & Pop-Ups",
"popoverTitleLabel": "Título Popover",
"popoverTextLabel": "Texto Popover",
"popoverIconLabel": "Icone Popover (fontawesome)",
"showPopover": "Mostrar Popover",
"topTooltip": "top dicas de ferramentas",
"rightTooltip": "sugestão ao lado direito",
"leftTooltip": "esquerda",
"bottomTooltip": "abaixo"
},
"toasts": {
"title": "Torradas",
"textLabel": "Texto",
"durationLabel": "Duração (milisegundos)",
"iconLabel": "Icone (fontawesome)",
"fullWidthLabel": "Largura completa",
"launchToast": "Launch toast"
}
},
"forms": {
"controls": {
"title": "Checkboxes, Radios, Switches",
"radioDisabled": "Radio Desabilitado",
"radio": "Radio",
"subscribe": "Assine a newsletter"
},
"dateTimePicker": {
"title": "Seletores de data e hora",
"basic": "Básico",
"time": "Hora",
"range": "Alcance",
"multiple": "Múltiplo",
"manualInput": "Entrada manual",
"disabled": "Desabilitado"
},
"inputs": {
"emailValidatedSuccess": "Email (validado com sucesso)",
"emailValidated": "Email (validado)",
"inputWithIcon": "Entrada com ícone",
"inputWithButton": "Entrada com botão",
"inputWithClearButton": "Entrada com Botão Claro",
"inputWithRoundButton": "Entrada com Botão Redondo",
"textInput": "Entrada de Texto",
"textInputWithDescription": "Entrada de Texto (com descrição)",
"textArea": "Área de Texto",
"title": "Entrada",
"upload": "UPLOAD"
},
"mediumEditor": {
"title": "Editor Medium"
},
"selects": {
"country": "Selecionar Região",
"countryMulti": "Selecionar Multiplas Regiões",
"multi": "Selecionar Múltiplos",
"simple": "Selecionador Simples",
"title": "Selecionadores"
}
},
"grid": {
"desktop": "Grid Área de Trabalho",
"fixed": "Grid Fixo",
"offsets": "Offsets",
"responsive": "Grid Responssivo"
},
"icons": {
"back": "Retornar aos icones",
"none": "Incones não encontrados",
"search": "Pesquisar Icone",
"title": "Icones"
},
"spinners": {
"title": "Spinners",
"poweredBy": "Distribuido por"
},
"language": {
"brazilian_portuguese": "Português",
"english": "English",
"spanish": "Spanish",
"simplified_chinese": "Chinês simplificado"
},
"menu": {
"auth": "Autorização",
"buttons": "Botões",
"charts": "Gráficos",
"colorPickers": "Colhedores de Cor",
"dashboard": "Painel principal",
"formElements": "Elementos de Formulários",
"forms": "Formulários",
"mediumEditor": "Editor Medium",
"grid": "Grid",
"icons": "Icones",
"cards": "Cards",
"spinners": "Spinners",
"login": "Login",
"maps": "Mapas",
"modals": "Modals",
"notifications": "Notificações",
"progressBars": "Barra de progresso",
"signUp": "Cadastrar-se",
"statistics": "Estatística",
"lists": "Listas",
"tables": "Tabelas",
"markupTables": "Tabelas de Marcação",
"dataTables": "Tabelas de Dados",
"typography": "Tipografia",
"uiElements": "Elementos UI",
"treeView": "Árvore de visualização",
"dateTimePickers": "Selecionar Data e Hora",
"chat": "Gráficos"
},
"messages": {
"all": "Ver todas as menssagens",
"new": "Nova menssagem de {name}"
},
"modal": {
"cancel": "CANCELAR",
"close": "FECHAR",
"confirm": "CONFIRMAR",
"large": "Grande",
"largeTitle": "Modal Grande",
"medium": "Médio",
"mediumTitle": "Modal Médio",
"small": "Pequeno",
"smallTitle": "Modal Pequeno",
"static": "Estático",
"staticMessage": "Este é um modal é estático, clicar no pano de fundo não o fechará.",
"staticTitle": "Modal Estático",
"title": "Modals"
},
"navbar": {
"messageUs": "Enviar uma pergunta ou feedback para"
},
"notifications": {
"all": "Ver todas as notificações",
"sentMessage": "{name} enviou uma menssagem",
"uploadedZip": "{name} fez uploaded de um novo arquivo Zip com {type}",
"startedTopic": "{name} iniciou um novo tópico"
},
"progressBars": {
"circle": "Círculo",
"horizontal": "Horizontal",
"state": "Doença",
"colors": "Cores"
},
"lists": {
"customers": "Clientes",
"recentMessages": "Mensagens Recentes",
"archieved": "Arquivado",
"starterKit": "Kit iniciante",
"notifications": "Notificações"
},
"tables": {
"basic": "Mesa Básica",
"stripedHoverable": "Listrado, flutuante",
"labelsActions": "Etiquetas, ações como botões",
"sortingPaginationActionsAsIcons": "Ordenação, Paginação, Ações como Ícones",
"star": "Star",
"unstar": "Unstar",
"edit": "Editar",
"delete": "Excluir",
"searchByName": "Procura por nome",
"searchTrendsBadges": "Pesquisa, Tendências, Emblemas",
"perPage": "Por página",
"report": "Relatório",
"infiniteScroll": "Rolagem infinita",
"selectable": "Selecionável",
"selected": "Selecionado",
"serverSidePagination": "Server-Side Paginação",
"emptyTable": "Mesa Vazia",
"noDataAvailable": "Nenhum dado disponível.",
"noReport": "Não há dados para exibir. O relatório estará disponível em 3 de novembro de 2018.",
"loading": "Carregando",
"headings": {
"email": "Email",
"name": "Nome",
"firstName": "Primeiro nome",
"lastName": "Último nome",
"status": "Status",
"country": "País"
}
},
"user": {
"language": "Trocar Linguagem",
"logout": "Sair",
"profile": "Meu Perfil"
},
"treeView": {
"basic": "Básico",
"icons": "Icones",
"selectable": "Selecionável",
"editable": "Editável",
"advanced": "Advançado"
},
"chat": {
"title": "Gráficos"
}
}
-323
View File
@@ -1,323 +0,0 @@
{
"auth": {
"agree": "我同意",
"createAccount": "创建账号",
"createNewAccount": "创建新账号",
"email": "电子邮箱",
"login": "登录",
"password": "密码",
"signUp": "注册",
"termsOfUse": "使用条款"
},
"buttons": {
"advanced": "图标、组、下拉菜单",
"button": "按钮",
"colors": "颜色",
"disabled": "禁用",
"dropdown": "下拉菜单",
"hover": "悬停状态",
"main": "主按钮和辅助按钮",
"micro": "微型的",
"pressed": "按下",
"small": "小的"
},
"charts": {
"horizontalBarChart": "横条图",
"verticalBarChart": "纵条图",
"lineChart": "线形图",
"pieChart": "饼图",
"donutChart": "环形图",
"bubbleChart": "气泡图"
},
"collapse": {
"accordion": "Accordion",
"buttons": "按钮"
},
"dashboard": {
"success": "成功",
"successMessage": "您已成功阅读此重要通知。",
"elements": "元素",
"teamMembers": "团队成员",
"versions": "版本"
},
"notificationsPage": {
"alerts": {
"title": "警报",
"success": "成功",
"successMessage": "您已成功阅读此重要警报消息。",
"info": "信息",
"infoMessage": "此警报需要您的注意,但这并不是特别重要。",
"warning": "警告",
"warningMessage": "最好检查一下,现在状态好像不太好。",
"danger": "危险",
"dangerMessage": "请更改一些内容并尝试再次提交。"
},
"popovers": {
"title": "工具提示和弹出框",
"popoverTitleLabel": "弹出框的标题",
"popoverTextLabel": "弹出框的内容",
"popoverIconLabel": "弹出框的图标(fontAwesome",
"showPopover": "显示弹出框",
"topTooltip": "上侧提示",
"rightTooltip": "右侧提示",
"leftTooltip": "左侧提示",
"bottomTooltip": "下侧提示"
},
"toasts": {
"title": "提示框",
"textLabel": "提示文本",
"durationLabel": "持续时间(毫秒)",
"iconLabel": "图标(fontAwesome",
"fullWidthLabel": "全宽",
"launchToast": "加载提示框"
}
},
"forms": {
"controls": {
"female": "女",
"male": "男",
"title": "复选框,单选框,开关",
"radioDisabled": "禁用的单选框",
"radio": "单选框",
"subscribe": "订阅消息",
"unselected": "未选中的复选框",
"selected": "选中的复选框",
"readonly": "只读的复选框",
"disabled": "禁用的复选框",
"error": "错误状态的复选框",
"errorMessage": "带错误信息的复选框"
},
"dateTimePicker": {
"title": "日期时间选择器",
"basic": "基本的",
"time": "时间",
"range": "范围",
"multiple": "多重的",
"manualInput": "手動輸入",
"disabled": "禁用",
"customFirstDay": "自定义起始日",
"customDateFormat": "自定义日期格式"
},
"inputs": {
"emailValidatedSuccess": "电子邮件(验证成功)",
"emailValidated": "电子邮件(验证失败)",
"inputWithIcon": "带图标的输入框",
"inputWithButton": "带按钮的输入框",
"inputWithClearButton": "带清空图标的输入框",
"inputWithRoundButton": "带圆形按钮的输入框",
"textInput": "文本输入",
"textInputWithDescription": "文本输入(带说明)",
"textArea": "多行文本框",
"title": "输入框",
"upload": "上传"
},
"mediumEditor": {
"title": "Medium 编辑器"
},
"selects": {
"country": "国家选择框",
"countryMulti": "国家多选框",
"multi": "多选框",
"simple": "单选框",
"title": "选择框"
}
},
"grid": {
"desktop": "桌面网格",
"fixed": "固定网格",
"offsets": "偏移量",
"responsive": "响应网格"
},
"icons": {
"back": "回退图标",
"none": "没找到图标",
"search": "图标搜索",
"title": "图标"
},
"spinners": {
"title": "Spinners",
"poweredBy": "技术支持"
},
"language": {
"brazilian_portuguese": "葡萄牙语",
"english": "英语",
"spanish": "西班牙语",
"simplified_chinese": "简体中文",
"persian": "波斯语"
},
"menu": {
"auth": "授权",
"buttons": "按钮",
"charts": "图表",
"colorPickers": "颜色选择器",
"collapse": "折叠器",
"timelines": "时间线",
"dashboard": "仪表板",
"formElements": "表单元素",
"forms": "表单",
"mediumEditor": "Medium Editor",
"grid": "网格",
"icons": "图标",
"cards": "卡片",
"spinners": "Spinners",
"login": "登录",
"maps": "地图",
"pages": "页面",
"modals": "模态对话框",
"notifications": "通知",
"progressBars": "进度条",
"signUp": "注册",
"statistics": "统计",
"tables": "表格",
"tags": "标签",
"typography": "段落",
"uiElements": "UI 元素",
"treeView": "树视图",
"dateTimePickers": "日期时间选择器",
"fileUpload": "文件上传",
"chat": "聊天"
},
"messages": {
"all": "查看全部消息",
"new": "来自{name}的新消息"
},
"modal": {
"cancel": "取消",
"close": "关闭",
"confirm": "确认",
"large": "大型",
"largeTitle": "大型模态对话框",
"medium": "中型",
"mediumTitle": "中型模态对话框",
"small": "小型",
"smallTitle": "小型模态对话框",
"static": "静态",
"staticMessage": "这是一个静态对话框,背景点击不会关闭它。",
"staticTitle": "静态对话框",
"title": "模态对话框"
},
"dropdown": {
"default": "默认项",
"withArrow": "带箭头",
"note": "注意",
"noteText": "如果屏幕上有足够的空间,下拉框将按指定方向打开,否则方向将自动更改"
},
"fileUpload": {
"advancedMediaGallery": "高级,媒体库",
"advancedUploadList": "高级,上传列表",
"mediaGallery": "媒体库",
"uploadList": "上传列表",
"single": "单独",
"dragNdropFiles": "拖放文件,或者",
"uploadedOn": "已上传",
"fileDeleted": "文件已成功删除",
"undo": "复原",
"preview": "预览",
"delete": "删除",
"deleteFile": "删除文件",
"uploadFile": "上传文件",
"uploadMedia": "上传媒体文件",
"addAttachment": "添加附件",
"modalTitle": "文件验证",
"modalText": "文件类型不正确!"
},
"tags": {
"default": "默认的",
"removable": "可移除",
"colored": "彩色的"
},
"navbar": {
"messageUs": "需要Web开发帮助吗?请联系我们。"
},
"notifications": {
"all": "查看所有通知",
"sentMessage": "{name} 给你发了一条消息",
"uploadedZip": "{name} 上传了一个新的Zip文件 {type}",
"startedTopic": "{name} 开始了一个新话题"
},
"timelines": {
"horizontalSimple": "水平简单",
"horizontalCards": "水平卡片",
"verticalSimple": "垂直简单",
"verticalLabel": "垂直带标签",
"verticalCentered": "垂直居中",
"firstDate": "2018年2月",
"secondDate": "2018年3月",
"thirdDate": "2018年4月",
"cardsSecondInfo": "它们存在于各种栖息地,比如草原。",
"cardsThirdInfo": "然而,各种人为因素对斑马种群产生了严重影响",
"verticalSimpleCardsFirstInfo": "独特的斑马条纹使它们成为人们最熟悉的动物之一。 它们出现在各种栖息地,如草原,热带稀树草原,林地,棘手的灌木丛中。",
"verticalSimpleCardsSecondInfo": "然而,各种人为因素对斑马种群产生了严重影响"
},
"progressBars": {
"basic": "基本的",
"basicVertical": "基本垂直",
"circle": "圆形",
"colorFulTitle": "彩色条型",
"thin": "窄型",
"thinVertical": "垂直窄型",
"thick": "宽型",
"title": "进度条"
},
"tables": {
"basic": "基本表格",
"styled": "颜色,图标,标签",
"advanced": "搜索和分页",
"headings": {
"city": "城市",
"email": "电子邮箱",
"name": "姓名",
"score": "分数"
},
"dataTable": {
"noDataAvailable": "无可用数据"
}
},
"user": {
"language": "修改语言",
"logout": "注销",
"profile": "个人信息"
},
"treeView": {
"basic": "基本型",
"icons": "图标",
"selectable": "可选择",
"editable": "可编辑",
"advanced": "高级"
},
"chat": {
"title": "聊天"
},
"cards": {
"cards": "卡片",
"fixed": "固定的",
"floating": "浮动的",
"contentText": "独特的斑马条纹使它们成为人们最熟悉的动物之一。",
"rowHeight": "行高",
"title": {
"dark": "暗色背景",
"bright": "亮色卡片",
"titleOnImageNoOverlay": "图像上的标题,但没有叠加",
"normal": "标准卡",
"overlayAndTextOnImage": "图像上有覆盖和文本的卡片",
"stripeNoImage": "无图像条纹卡"
},
"button": {
"main": "主要",
"cancel": "取消"
},
"link": {
"edit": "编辑",
"setAsDefault": "设为默认",
"delete": "删除",
"traveling": "Traveling",
"france": "法国",
"review": "评论",
"feedback": "反馈信息",
"readFull": "阅读全文",
"secondaryAction": "第二行为",
"action1": "行为 1",
"action2": "行为 2"
}
}
}
-258
View File
@@ -1,258 +0,0 @@
{
"auth": {
"agree": "Acepto",
"createAccount": "Create cuenta",
"createNewAccount": "Crear cuenta",
"email": "Email",
"login": "Iniciar sesión",
"password": "Contraseña",
"signUp": "Registrar",
"termsOfUse": "Los terminos de uso"
},
"buttons": {
"advanced": "Iconos, Grupos, Dropdowns",
"button": "BOTON",
"colors": "Colores",
"disabled": "DESHABILITADO",
"dropdown": "DESPLEGABLE",
"hover": "HOVER",
"main": "Botón Primario y Secundario",
"micro": "MICRO",
"pressed": "PRESIONADO",
"small": "PEQUEÑO"
},
"charts": {
"bubbleChart": "Bubble Chart",
"donutChart": "Donut Chart",
"horizontalBarChart": "Horizontal Bar Chart",
"lineChart": "Line Chart",
"pieChart": "Pie Chart",
"verticalBarChart": "Vertical Bar Chart"
},
"collapse": {
"accordion": "Acordeón",
"buttons": "Botones"
},
"dashboard": {
"elements": "Elementos",
"success": "ÉXITO",
"successMessage": "Ha leído correctamente este mensaje de alerta importante.",
"teamMembers": "Miembros del Equipo",
"versions": "Versiones",
"table": {
"title": "Mesa impresionante",
"brief": "Breve",
"detailed": "Detallado",
"resolve": "Resolver",
"resolved": "Resuelto"
}
},
"notificationsPage": {
"alerts": {
"title": "Alerts",
"success": "ÉXITO",
"successMessage": "Ha leído correctamente este mensaje de alerta importante.",
"info": "INFO",
"infoMessage": "Esta alerta necesita tu atención, pero no es muy importante.",
"warning": "ADVERTENCIA",
"warningMessage": "Mejor compruébalo, esto no pinta bien.",
"danger": "PELIGRO",
"dangerMessage": "Cambiar algunas cosas e enviarlo de nuevo."
},
"popovers": {
"title": "Tooltips & Popovers",
"popoverTitleLabel": "Title de Popover",
"popoverTextLabel": "Texto de Popover",
"popoverIconLabel": "Icono de Popover (fontawesome)",
"showPopover": "Mostrar Popover",
"topTooltip": "tope tooltip",
"rightTooltip": "derecha tooltip",
"leftTooltip": "izquierda",
"bottomTooltip": "fondo"
},
"Toasts": {
"title": "tostadas",
"textLabel": "Texto",
"durationLabel": "Duración (milisegundos)",
"iconLabel": "Icono (fontawesome)",
"fullWidthLabel": "Ancho total",
"launchToast": "Lanzar tostadas"
}
},
"forms": {
"controls": {
"title": "Checkboxes, Radios, Switches",
"radioDisabled": "Radio Desactivado",
"radio": "Radio",
"subscribe": "Suscribirse a la newsletter"
},
"inputs": {
"emailValidatedSuccess": "Email (validado con éxito)",
"emailValidated": "Email (validado)",
"inputWithIcon": "Input con Icono",
"inputWithButton": "Input con Boton",
"inputWithClearButton": "Input With Clear Button",
"inputWithRoundButton": "Input With Round Button",
"textInput": "Input de Texto",
"textInputWithDescription": "Input de Texto (con descripcion)",
"textArea": "Text Area",
"title": "Inputs",
"upload": "SUBIR"
},
"mediumEditor": {
"title": "Medium Editor"
},
"selects": {
"country": "País Select",
"countryMulti": "País Multi Select",
"multi": "Multi Select",
"simple": "Select Simple",
"title": "Selects"
}
},
"grid": {
"fixed": "Grid Fijo",
"desktop": "Desktop Grid",
"responsive": "Responsive Grid",
"offsets": "Offsets"
},
"icons": {
"back": "Volver a los iconos",
"none": "No se han encontrado iconos",
"search": "Búsqueda de iconos",
"title": "Iconos"
},
"language": {
"brazilian_portuguese": "Português",
"english": "English",
"spanish": "Spanish",
"simplified_chinese": "Versión abreviada"
},
"menu": {
"auth": "Autenticación",
"buttons": "Botones",
"charts": "Gráficos",
"collapse": "Colapso",
"colorPickers": "Selector de color",
"dashboard": "Dashboard",
"formElements": "Elementos de un Formulario",
"forms": "Formularios",
"mediumEditor": "Medium Editor",
"grid": "Grid",
"icons": "Iconos",
"cards": "Cards",
"login": "Iniciar sesión",
"maps": "Mapas",
"modals": "Modals",
"notifications": "Notificaciones",
"progressBars": "Barras de Progreso",
"signUp": "Registrar",
"statistics": "Estadisticas",
"lists": "Listas",
"tables": "Tablas",
"markupTables": "Tablas de Marcado",
"dataTables": "Tablas de Datos",
"typography": "Tipografía",
"uiElements": "Elementos UI",
"colors": "Colores",
"chat": "Chat"
},
"messages": {
"all": "Ver todos los mensajes",
"new": "Nuevo mensajes de {name}"
},
"modal": {
"cancel": "CANCELAR",
"close": "CERRAR",
"confirm": "CONFIRMAR",
"large": "Largo",
"largeTitle": "Modal Largo",
"medium": "Mediano",
"mediumTitle": "Modal Mediana",
"small": "Pequeño",
"static": "Estático",
"smallTitle": "Modal Pequeña",
"staticMessage": "Esto es un modal estático. No se cerrará haciendo clic en el fondo.",
"staticTitle": "Modal Estático",
"title": "Modals"
},
"fileUpload": {
"advancedMediaGallery": "Avanzado, Galería de medios",
"advancedUploadList": "Avanzado, lista de carga",
"mediaGallery": "Galería media",
"uploadList": "Lista de carga",
"single": "Soltero",
"dragNdropFiles": "Arrastrar y soltar archivos",
"uploadedOn": "Subido en",
"fileDeleted": "El archivo fue eliminado exitosamente",
"undo": "Deshacer",
"preview": "Avance",
"delete": "Borrar",
"deleteFile": "Borrar archivo",
"uploadFile": "Subir archivo",
"uploadMedia": "Cargar medios",
"addAttachment": "Añadir un adjunto",
"modalTitle": "Validación de archivo",
"modalText": "El tipo de archivo es incorrecto!"
},
"navbar": {
"messageUs": "Envíenos sus preguntas o comentarios a"
},
"notifications": {
"all": "Ver todos los notificaciones",
"sentMessage": "{name} te ha mandado un mensaje",
"uploadedZip": "{name} ha subido un archivo Zip con {type}",
"startedTopic": "{name} ha creado una tema nueva"
},
"progressBars": {
"circle": "Circulo",
"horizontal": "Horizontal",
"state": "Сondición",
"colors": "Colores"
},
"lists": {
"customers": "Clientes",
"recentMessages": "Mensajes recientes",
"archieved": "Archivado",
"starterKit": "Kit de inicio",
"notifications": "Notificaciones"
},
"tables": {
"basic": "Tabla basica",
"stripedHoverable": "Rayado, Hoverable",
"labelsActions": "Etiquetas, Acciones como Botones",
"sortingPaginationActionsAsIcons": "Clasificación, Paginación, Acciones como Iconos",
"star": "Star",
"unstar": "Unstar",
"edit": "Editar",
"delete": "Borrar",
"searchByName": "Buscar por nombre",
"searchTrendsBadges": "Búsqueda, Tendencias, Insignias",
"perPage": "Por página",
"report": "Informe",
"infiniteScroll": "Scroll infinito",
"selectable": "Seleccionable",
"selected": "Seleccionado",
"serverSidePagination": "Server-Side Paginación",
"emptyTable": "Mesa vacía",
"noDataAvailable": "Datos no disponibles.",
"noReport": "No hay datos para mostrar. El informe estará disponible el 3 de noviembre de 2018.",
"loading": "Cargando",
"headings": {
"email": "Email",
"name": "Nombre",
"firstName": "Nombre de pila",
"lastName": "Apellido",
"status": "Estado",
"country": "País"
}
},
"chat": {
"title": "Chat"
},
"user": {
"language": "Cambiar Idioma",
"profile": "Mi Perfil",
"logout": "Cerrar Sesión"
}
}
-583
View File
@@ -1,583 +0,0 @@
{
"auth": {
"agree": "I agree to",
"createAccount": "Create account",
"createNewAccount": "Create New Account",
"email": "Email",
"login": "Login",
"password": "Password",
"recover_password": "Recover password",
"sign_up": "Sign Up",
"keep_logged_in": "Keep me logged in",
"termsOfUse": "Terms of Use.",
"reset_password": "Reset password"
},
"404": {
"title": "This pages gone fishing.",
"text": "If you feel that its not right, please send us a message at ",
"back_button": "Back to dashboard"
},
"rating": {
"singleIcon": "Single Icon",
"twoIcons": "Two Icons",
"large": "Large",
"numbers": "Numbers",
"halves": "Halves",
"small": "Small"
},
"typography": {
"primary": "Primary text styles",
"secondary": "Secondary text styles"
},
"colorPickers": {
"simple": "Simple",
"slider": "Slider",
"advanced": "Advanced"
},
"buttons": {
"advanced": "Buttons With Icons",
"size": "Button Sizes",
"tags": "Button Tags",
"button": "Button",
"buttonGroups": "Button Groups",
"buttonsDropdown": "Buttons with dropdown",
"split": "Split",
"splitTo": "Split to",
"customIcon": "Custom icon",
"content": "Content",
"buttonToggles": "Button Toggles",
"pagination": "Pagination",
"a-link": "Open EpicSpinners",
"router-link": "Move to Charts",
"colors": "Button Colors",
"disabled": "Disabled",
"dropdown": "DROPDOWN",
"hover": "HOVER",
"types": "Button Types",
"pressed": "PRESSED",
"default": "Default",
"outline": "Outline",
"flat": "Flat",
"large": "Large",
"small": "Small",
"normal": "Normal",
"success": "Success",
"info": "Info",
"danger": "Danger",
"warning": "Warning",
"gray": "Gray",
"dark": "Dark"
},
"charts": {
"horizontalBarChart": "Horizontal Bar Chart",
"verticalBarChart": "Vertical Bar Chart",
"lineChart": "Line Chart",
"pieChart": "Pie Chart",
"donutChart": "Donut Chart",
"bubbleChart": "Bubble Chart"
},
"collapse": {
"basic": "Basic Collapse",
"collapseWithBackground": "Collapse with background",
"collapseWithCustomHeader": "Collapse with custom header",
"firstHeader": "Expand This Block",
"secondHeader": "Another Block",
"content": {
"title": "Great Things",
"text": "There is something about parenthood that gives us a sense of history and a deeply rooted desire to send on into the next generation the great things we have discovered about life."
}
},
"sliders": {
"slider": "Sliders",
"range": "Ranges",
"simple": "simple",
"value": "Value",
"label": "Label",
"labelPlusIcon": "label + icon",
"pins": "Pins",
"pinsAndValue": "pins & value",
"withInput": "With input",
"withIcons": "With icons"
},
"popovers": {
"popover": "Popover",
"popoverStyle": "Popover Style",
"popoverPlacement": "Popover Placement",
"minimalTooltip": "Minimal Tooltip",
"anotherOneTooltip": "Another One Tooltip"
},
"datepickers": {
"dateOfBirth": "Date of birth",
"daysOfTheWeek": "Days of the week",
"setupMeeting": "Setup meeting",
"upcomingVacation": "Upcoming vacation",
"multipleAndDisabledDates": "Multiple & disabled dates",
"inline": "Inline"
},
"dashboard": {
"versions": "Versions",
"setupRemoteConnections": "Setup Remote Connections",
"currentVisitors": "Current Visitors",
"charts": {
"trendyTrends": "Trendy Trends",
"showInMoreDetail": "Show in more detail",
"showInLessDetail": "Show in less detail",
"loadingSpeed": "Loading speed",
"topContributors": "Top contributors",
"showNextFive": "Show next five",
"commits": "Commits"
},
"info": {
"componentRichTheme": "component-rich theme",
"completedPullRequests": "completed pull requests",
"users": "users",
"points": "points",
"units": "units",
"exploreGallery": "Explore gallery",
"viewLibrary": "View Library",
"commits": "commits",
"components": "components",
"teamMembers": "team members"
},
"table": {
"title": "Awesome table",
"brief": "Brief",
"detailed": "Detailed",
"resolve": "Resolve",
"resolved": "Resolved"
},
"tabs": {
"overview": {
"title": "Overview",
"built": "Built with Vue.js framework",
"free": "Absolutely free for everyone",
"fresh": "Fresh and crisp design",
"mobile": "Responsive and optimized for mobile",
"components": "Tons of useful components",
"nojQuery": "Completely jQuery free"
},
"billingAddress": {
"title": "Billing Address",
"personalInfo": "Personal Info",
"firstName": "First name & Last Name",
"email": "Email",
"address": "Address",
"companyInfo": "Company Info",
"city": "City",
"country": "Country",
"infiniteConnections": "Infinite connections",
"addConnection": "Add Connection"
},
"bankDetails": {
"title": "Bank Details",
"detailsFields": "Details Fields",
"bankName": "Bank Name",
"accountName": "Account Name",
"sortCode": "Sort Code",
"accountNumber": "Account Number",
"notes": "Notes",
"sendDetails": "Send Details"
}
},
"navigationLayout": "navigation layout",
"topBarButton": "Top Bar",
"sideBarButton": "Side Bar"
},
"notificationsPage": {
"notifications": {
"title": "Notifications",
"gray": "Processing",
"dark": "New Label",
"success": "Paid",
"successMessage": "You successfully read this important alert message.",
"info": "Info",
"infoMessage": "This alert needs your attention, but it's not super important.",
"warning": "On Hold",
"warningMessage": "Better check yourself, you're not looking too good.",
"danger": "Danger",
"dangerMessage": "Change a few things up and try submitting again."
},
"popovers": {
"title": "Tooltips & Popovers",
"popoverTitleLabel": "Popover Title",
"popoverTextLabel": "Popover Text",
"popoverIconLabel": "Popover Icon (fontawesome)",
"showPopover": "Show Popover",
"topTooltip": "top",
"rightTooltip": "rightside",
"leftTooltip": "left",
"bottomTooltip": "below"
},
"toasts": {
"title": "Toasts",
"textLabel": "Text",
"durationLabel": "Duration (milliseconds)",
"iconLabel": "Icon (fontawesome)",
"fullWidthLabel": "Fullwidth",
"launchToast": "Launch toast"
}
},
"forms": {
"controls": {
"title": "Checkboxes, Radios, Switches, Toggles",
"radioDisabled": "Disabled Radio",
"radio": "Radio",
"subscribe": "Subscribe to newsletter",
"unselected": "Unselected checkbox",
"selected": "Selected checkbox",
"readonly": "Readonly checkbox",
"disabled": "Disabled checkbox",
"error": "Checkbox with error",
"errorMessage": "Checkbox with error messages"
},
"dateTimePicker": {
"title": "Date time pickers",
"basic": "Basic",
"time": "Time",
"range": "Range",
"manualInput": "Manual input",
"multiple": "Multiple",
"disabled": "Disabled",
"customFirstDay": "Custom first day",
"customDateFormat": "Custom date format"
},
"inputs": {
"emailValidatedSuccess": "Email (validated with success)",
"emailValidated": "Email (validated)",
"inputWithIcon": "Input With Icon",
"inputWithButton": "Input With Button",
"inputWithClearButton": "Input With Clear Button",
"inputWithRoundButton": "Input With Round Button",
"textInput": "Text Input",
"textInputWithDescription": "Text Input (with description)",
"textArea": "Text Area",
"title": "Inputs",
"upload": "UPLOAD"
},
"mediumEditor": {
"title": "Medium Editor"
},
"selects": {
"country": "Country Select",
"countryMulti": "Country Multi Select",
"multi": "Multi Select",
"simple": "Simple Select",
"searchable": "Select with search",
"searchableMulti": "Multi Select with search",
"title": "Selects"
}
},
"grid": {
"desktop": "Desktop Grid",
"fixed": "Fixed Grid",
"offsets": "Offsets",
"responsive": "Responsive Grid"
},
"icons": {
"back": "Back to all icons",
"none": "No icons found",
"search": "Icon search",
"title": "Icons"
},
"spinners": {
"title": "Spinners",
"poweredBy": "Powered by"
},
"language": {
"brazilian_portuguese": "Português",
"english": "English",
"spanish": "Spanish",
"simplified_chinese": "Simplified Chinese",
"persian": "Persian"
},
"menu": {
"auth": "Auth",
"rating": "Rating",
"buttons": "Buttons",
"charts": "Charts",
"colorPickers": "Color Pickers",
"collapses": "Collapses",
"timelines": "Timelines",
"dashboard": "Dashboard",
"formElements": "Form Elements",
"forms": "Forms",
"mediumEditor": "Medium Editor",
"grid": "Grid",
"icons": "Icons",
"cards": "Cards",
"spinners": "Spinners",
"login": "Login",
"maps": "Maps",
"pages": "Pages",
"modals": "Modals",
"notifications": "Notifications",
"progressBars": "Progress Bars",
"signUp": "Sign up",
"statistics": "Statistics",
"lists": "Lists",
"tables": "Tables",
"markupTables": "Markup Tables",
"dataTables": "Data Tables",
"chips": "Chips",
"tabs": "Tabs",
"typography": "Typography",
"uiElements": "UI Elements",
"treeView": "Tree view",
"dateTimePickers": "Date time pickers",
"fileUpload": "File Upload",
"colors": "Colors",
"spacing": "Spacing",
"sliders": "Sliders",
"popovers": "Popovers",
"chat": "Chat",
"maplibre-maps": "MapLibre Maps",
"yandex-maps": "Yandex Maps",
"leaflet-maps": "Leaflet Maps",
"bubble-maps": "Bubble Maps",
"line-maps": "Line Maps",
"login-singup": "Login/Signup",
"404-pages": "404 Pages",
"faq": "Faq"
},
"messages": {
"all": "See all messages",
"new": "New messages from {name}",
"mark_as_read": "Mark As Read"
},
"modal": {
"cancel": "Cancel",
"close": "Close",
"confirm": "Confirm",
"large": "Large",
"largeTitle": "Large Modal",
"medium": "Medium",
"mediumTitle": "Medium Modal",
"small": "Small",
"smallTitle": "Small Modal",
"static": "Static",
"staticMessage": "This is a static modal, backdrop or escape click will not close it.",
"staticTitle": "Static Modal",
"title": "Modals",
"fullscreen": "Fullscreen",
"titleOptions": "Modal Options",
"blurred": "Blurred overlay",
"withAnchorSlot": "With anchor slot",
"message": "There are three species of zebras: the plains zebra, the mountain zebra and the Grévy's zebra. The plains zebra and the mountain zebra belong to the subgenus Hippotigris, but Grévy's\n zebra is the sole species of subgenus\n Dolichohippus. The latter resembles an ass, to which it is closely\n related, while the former two are more\n horse-like. All three belong to the genus Equus, along with other living\n equids."
},
"dropdown": {
"default": "Default",
"withArrow": "With arrow",
"note": "Note",
"noteText": "Dropdown will open in the specified direction if there is enough space on the screen, otherwise the direction will automatically change",
"top": "TOP",
"right": "RIGHT",
"bottom": "BOTTOM",
"left": "LEFT"
},
"fileUpload": {
"advancedMediaGallery": "Advanced, Media Gallery",
"advancedUploadList": "Advanced, Upload List",
"mediaGallery": "Media Gallery",
"uploadList": "Upload List",
"single": "Single",
"dragNdropFiles": "Dragndrop files or",
"uploadedOn": "Uploaded on",
"fileDeleted": "File was successfully deleted",
"undo": "Undo",
"preview": "Preview",
"delete": "Delete",
"deleteFile": "Delete file",
"uploadFile": "Upload file",
"uploadMedia": "Upload media",
"addAttachment": "Add attachment",
"modalTitle": "File validation",
"modalText": "File type is incorrect!"
},
"chips": {
"chips": {
"title": "Chips",
"primary": "Primary chip",
"secondary": "Secondary chip",
"success": "Success chip",
"info": "Info chip",
"danger": "Danger chip",
"warning": "Warning chip",
"gray": "Gray chip",
"dark": "Dark chip"
},
"badges": {
"title": "Badges",
"primary": "Primary badge",
"secondary": "Secondary badge",
"success": "Success badge",
"info": "Info badge",
"danger": "Danger badge",
"warning": "Warning badge",
"gray": "Gray badge",
"dark": "Dark badge"
}
},
"navbar": {
"messageUs": "Web development inquiries:",
"repository": "GitHub Repo"
},
"notifications": {
"all": "See all notifications",
"mark_as_read": "Mark as read",
"sentMessage": "sent you a message",
"uploadedZip": "uploaded a new Zip file with {type}",
"startedTopic": "started a new topic"
},
"timelines": {
"horizontalSimple": "Horizontal Simple",
"horizontalCards": "Horizontal Cards",
"verticalSimple": "Vertical Simple",
"verticalLabel": "Vertical With Label",
"verticalCentered": "Vertical Centered",
"horizontalActionFirst": "Complete drafts",
"horizontalActionSecond": "Push site live",
"horizontalActionThird": "Start ICO",
"titleFirst": "Make design",
"titleSecond": "Develop an app",
"titleThird": "Submit an app",
"titleDateFirst": "",
"titleDateSecond": "May 22 10:00",
"titleDateThird": "July 19 17:45",
"firstDate": "February 2018",
"secondDate": "March 2018",
"thirdDate": "April 2018",
"contentFirst": "The unique stripes of zebras make them one of the animals most familiar to people. They occur in a variety of habitats, such as grasslands, savannas, woodlands, thorny scrublands.",
"contentSecond": "They occur in a variety of habitats, such as grasslands, savannas, woodlands, thorny scrublands.",
"contentThird": "However, various anthropogenic factors have had a severe impact on zebra populations"
},
"progressBars": {
"circle": "Circle",
"horizontal": "Horizontal",
"state": "State",
"colors": "Colors"
},
"lists": {
"customers": "Customers",
"recentMessages": "Recent Messages",
"archieved": "Archieved",
"starterKit": "Starter Kit",
"notifications": "Notifications",
"routerSupport": "Router Support"
},
"tables": {
"basic": "Basic Table",
"stripedHoverable": "Striped, Hoverable",
"labelsActions": "Labels, Actions as Buttons",
"sortingPaginationActionsAsIcons": "Sorting, Pagination, Actions as Icons",
"star": "Star",
"unstar": "Unstar",
"edit": "Edit",
"delete": "Delete",
"searchByName": "Search by name",
"searchTrendsBadges": "Search, Trends, Badges",
"perPage": "Per Page",
"report": "Report",
"infiniteScroll": "Infinite Scroll",
"selectable": "Selectable",
"selected": "Selected",
"serverSidePagination": "Server-Side Pagination",
"emptyTable": "Empty Table",
"noDataAvailable": "No Data Available.",
"noReport": "There is no data to display. Report will be available on November 3, 2018.",
"loading": "Loading",
"headings": {
"email": "Email",
"name": "Name",
"firstName": "First Name",
"lastName": "Last Name",
"status": "Status",
"country": "Country",
"location": "Location"
}
},
"user": {
"language": "Change Language",
"logout": "Logout",
"profile": "My Profile"
},
"treeView": {
"basic": "Basic",
"icons": "Icons",
"selectable": "Selectable",
"editable": "Editable",
"advanced": "Advanced"
},
"chat": {
"title": "Chat",
"sendButton": "Send"
},
"spacingPlayground": {
"value": "Value",
"margin": "Margin",
"padding": "Padding"
},
"spacing": {
"title": "Spacing"
},
"cards": {
"cards": "Cards",
"fixed": "Fixed",
"floating": "Floating",
"contentText": "The unique stripes of zebras make them one of the animals most familiar to people.",
"contentTextLong": "The unique stripes of zebras make them one of the animals most familiar to people. They occur in a variety of habitats, such as grasslands, savannas, woodlands, thorny scrublands, mountains, and coastal hills. Various anthropogenic factors have had a severe impact on zebra populations, in particular hunting for skins and habitat destruction. Grévy's zebra and the mountain zebra are endangered. While plains zebras are much more plentiful, one subspecies, the quagga.",
"rowHeight": "Row height",
"title": {
"default": "Default",
"withControls": "With controls",
"customHeader": "Custom header",
"withoutHeader": "Without header",
"withImage": "With Image",
"withTitleOnImage": "With title on image",
"withCustomTitleOnImage": "With custom title on image",
"withStripe": "With stripe",
"withBackground": "With background"
},
"button": {
"main": "Main",
"cancel": "Cancel",
"showMore": "Show More",
"readMore": "Show More"
},
"link": {
"edit": "Edit",
"setAsDefault": "Set as default",
"delete": "Delete",
"traveling": "Traveling",
"france": "France",
"review": "Review",
"feedback": "Leave feedback",
"readFull": "Read full article",
"secondaryAction": "Secondary action",
"action1": "Action 1",
"action2": "Action 2"
}
},
"colors": {
"themeColors": "Theme Colors",
"extraColors": "Extra Colors",
"gradients": {
"basic": {
"title": "Button Gradients"
},
"hovered": {
"title": "Hovered Button Gradients",
"text": "Lighten 15% applied to an original style (gradient or flat color) for hover state."
},
"pressed": {
"title": "Pressed Button Gradients",
"text": "Darken 15% applied to an original style (gradient or flat color) for pressed state."
}
}
},
"tabs": {
"alignment": "Tabs Alignment",
"overflow": "Tabs Overflow",
"hidden": "Tabs with Hidden slider",
"grow": "Tabs Grow"
}
}
-510
View File
@@ -1,510 +0,0 @@
{
"auth": {
"agree": "با شرایط استفاده موافقم.",
"createAccount": "ساخت حساب کاربری",
"createNewAccount": "ساخت حساب کاربری تازه",
"email": "رایانامه",
"login": "ورود",
"password": "گذرواژه",
"recover_password": "فراموشی رمز عبور",
"sign_up": "ساخت حساب کاربری",
"keep_logged_in": "مرا در این مرورگر بخاطر بسپار",
"termsOfUse": "شرایط استفاده",
"reset_password": "بازنشانی گذرواژه"
},
"404": {
"title": "این صفحه رفته گل بچینه :)",
"text": "اگر فکر میکنید چیزی درست نیست برای ما پیام بفرستید.",
"back_button": "بازگشت به پیشخوان"
},
"rating": {
"singleIcon": "آیکون تکی",
"twoIcons": "آیکون دوتایی",
"large": "بزرگ",
"numbers": "اعداد",
"halves": "نصفه",
"small": "کوچک"
},
"typography": {
"primary": "سبک های متن اصلی",
"secondary": "سبکه های متن ثانوی"
},
"colorPickers": {
"simple": "ساده",
"slider": "اسلایدر",
"advanced": "پیشرفته"
},
"buttons": {
"advanced": "دکمه ها همراه آیکون",
"size": "اندازه دکمه",
"tags": "برچسب های دکمه",
"button": "دکمه",
"buttonGroups": "گروه های دکمه",
"buttonsDropdown": "دکمه های کشویی",
"split": "تقسیم",
"splitTo": "تقسیم به",
"customIcon": "آیکون سفارشی",
"content": "محتوا",
"buttonToggles": "دکمه توگل ",
"pagination": "صفحه بندی",
"a-link": "باز کردن EpicSpinners",
"router-link": "انتقال به نمودارها",
"colors": "رنگ های دکمه",
"disabled": "غیر فعال",
"dropdown": "کشویی",
"hover": "هاور",
"types": "انواع دکمه",
"pressed": "مطبوعات",
"default": "پیش فرض",
"outline": "رئوس مطالب",
"flat": "تخت",
"large": "بزرگ",
"small": "کوچک",
"normal": "معمولی",
"success": "موفقیت",
"info": "اطلاعات",
"danger": "خطر",
"warning": "هشداری",
"gray": "خاکستری",
"dark": "تیره"
},
"charts": {
"horizontalBarChart": "نوار افقی نمودار",
"verticalBarChart": "نوار عمودی نمودار",
"lineChart": "خط نمودار",
"pieChart": "نمودار کیک سیب",
"donutChart": "نمودار دوناتی",
"bubbleChart": "نمودار حبابی"
},
"collapse": {
"basic": "کادر کشویی معمولی",
"collapseWithBackground": "کادر کشویی بهمراه پس زمینه",
"collapseWithCustomHeader": "کادر کشویی سفارشی"
},
"sliders": {
"slider": "اسلایدر ها",
"range": "محدوده ها",
"simple": "ساده",
"value": "مقدار",
"label": "برجسب",
"labelPlusIcon": "برجسب + آيکون",
"pins": "پین ها",
"pinsAndValue": "پین ها & مقدارها"
},
"popovers": {
"popover": "ابزار راهنما",
"popoverStyle": "سبکه ابزار راهنما",
"popoverPlacement": "محل قرار گیری ابزار راهنما",
"minimalTooltip": "حداقل ابزار راهنما",
"anotherOneTooltip": "یکی دیگر از ابزارهای راهنما"
},
"datepickers": {
"dateOfBirth": "تاریخ تولد",
"daysOfTheWeek": "روزهای هفته",
"setupMeeting": "تنظیم جلسه",
"upcomingVacation": "تعطیلات آينده",
"multipleAndDisabledDates": "تاریخ های چندگانه و غیر فعال",
"inline": "خطی"
},
"dashboard": {
"versions": "ورژن ها",
"setupRemoteConnections": "راه اندازی اتصالات از راه دور",
"currentVisitors": "بازکنندگان فعلی",
"charts": {
"trendyTrends": "ترند های روز",
"showInMoreDetail": "نمایش جزییات بیشتر",
"loadingSpeed": "سرعت بارگزاری",
"topContributors": "مشارکت کنندگان برتر",
"showNextFive": "نمایش پنج تای بعدی",
"commits": "کامیت ها"
},
"info": {
"componentRichTheme": "تم کامپوننت ریچ",
"completedPullRequests": "پول رکویست های کامل شده",
"users": "کاربران",
"points": "امتیاز ها",
"units": "واحد ها",
"exploreGallery": "کاوشگر گالری",
"viewLibrary": "نمایش کتابخانه ها",
"commits": "کامیت ها",
"components": "کامپوننت ها",
"teamMembers": "اعضای تیم"
},
"table": {
"title": "جدول عالی",
"brief": "مختصر",
"detailed": "تفصیلی",
"resolve": "حل",
"resolved": "حل شده"
},
"tabs": {
"overview": {
"title": "نمای کلی",
"built": "ساخته شده با فریم ورک Vue.js",
"free": "کاملا رایگان برای همه",
"fresh": "طراحی تازه و باحال",
"mobile": "واکنش گرا و بهینه سازی برای موبایل",
"components": "پر از مولفه های باحال",
"nojQuery": "جی کویری رایگان"
},
"billingAddress": {
"title": "نشانی صورتحساب",
"personalInfo": "اطلاعات شخصی",
"firstName": "نام و نام خانوادگی",
"email": "رایانما",
"address": "نشانی",
"companyInfo": "اطلاعات شرکت",
"city": "شهر",
"country": "کشور",
"infiniteConnections": "اتصالات بینهایت",
"addConnection": "افزودن اتصال"
},
"bankDetails": {
"title": "اطلاعات بانکی",
"detailsFields": "فیلد ها همراه جزییات",
"bankName": "نام بانک",
"accountName": "شماره حساب",
"sortCode": "کد مرتب سازی",
"accountNumber": "کد حساب داری",
"notes": "یادداشت ها",
"sendDetails": "فرستادن جزییات"
}
},
"navigationLayout": "لایه ناوبری",
"topBarButton": "نوار بالا",
"sideBarButton": "نوار کناری"
},
"notificationsPage": {
"notifications": {
"title": "اعلان ها",
"gray": "در حال پردازش",
"dark": "بر چسب جدید",
"success": "پرداخت شده",
"successMessage": "شما این پیام مهم را با موفقیت خوانده اید.",
"info": "اطلاعات",
"infoMessage": "این پیام به توجه شما نیاز دارید, اما خیلی حیاتی نیست.",
"warning": "در انتظار",
"warningMessage": "بهتره یه دکتر بری خیلی خوب به نظر نمی رسی :)",
"danger": "خطرناک",
"dangerMessage": "مواردی نیاز به تغییر دارد دوباره بفرستید"
},
"popovers": {
"title": "نکات و ابزارهای راهنما",
"popoverTitleLabel": "عنوان راهنما",
"popoverTextLabel": "متن راهنما",
"popoverIconLabel": "آیکون راهنما (fontawesome)",
"showPopover": "نمایش راهنما",
"topTooltip": "بالاش",
"rightTooltip": "سمت راستش",
"leftTooltip": "سمت چپش",
"bottomTooltip": "زیرش"
},
"toasts": {
"title": "ازین پیام یهویی ها :)",
"textLabel": "متن",
"durationLabel": "مدت (میلی ثانیه)",
"iconLabel": "آیکون (fontawesome)",
"fullWidthLabel": "تمام عرض",
"launchToast": "پرتاب پیام"
}
},
"forms": {
"controls": {
"title": "جعبه کادر ها, رادیو ها, سوییچ ها, تاگل ها",
"radioDisabled": "غیر فعال کردن رادیو باکس",
"radio": "رادیو باکس",
"subscribe": "عضویت در خبرنامه",
"unselected": "گزینه انتخاب نشده",
"selected": "گزینه انتخاب شده",
"readonly": "گزینه فقط خواندنی",
"disabled": "گزینه غیر فعال",
"error": "گزینه همراه خطا",
"errorMessage": "گزینه همراه پیام خطا"
},
"dateTimePicker": {
"title": "انتخاب گر تاریخ و زمان",
"basic": "اصلی",
"time": "زمان",
"range": "محدوده",
"manualInput": "ورودی دستی",
"multiple": "چندگانه",
"disabled": "غیر فعال",
"customFirstDay": "روز اول سفارشی",
"customDateFormat": "قالب تاریخ سفارشی"
},
"inputs": {
"emailValidatedSuccess": "رایانما (با موفقیت تایید شد)",
"emailValidated": "رایا نما (معتبر)",
"inputWithIcon": "ورودی با آیکون",
"inputWithButton": "ورودی همراه دکمه",
"inputWithClearButton": "ورودی همراه دکمه شفاف",
"inputWithRoundButton": "ورودی همراه با دکمه گرد",
"textInput": "ورودی متن",
"textInputWithDescription": "ورودی متن (همراه توضیحات)",
"textArea": "منطقه متن",
"title": "ورودی ها",
"upload": "بارگذاری"
},
"mediumEditor": {
"title": "ویرایشگر مدیوم"
},
"selects": {
"country": "انتخاب کشور",
"countryMulti": "انتخاب همزان چند کشور",
"multi": "انتخاب همزمان",
"simple": "انتخاب ساده",
"searchable": "انتخاب به وسیله جستجو",
"searchableMulti": "انتخاب همزمان به وسلیه جستجو ها",
"title": "انتخاب ها"
}
},
"grid": {
"desktop": "شبکه رومیزی",
"fixed": "شبکه ثابت",
"offsets": "آفست ها",
"responsive": "شبکه واکنش گرا"
},
"icons": {
"back": "بازگشت به همه آيکونها",
"none": "هیچ آيکونی یافت نشد",
"search": "جستجوی آيکون",
"title": "آيکون ها"
},
"spinners": {
"title": "اسپینر ها",
"poweredBy": "قدرت گرقته توسط"
},
"language": {
"brazilian_portuguese": "پرتقالی",
"english": "انگلیسی",
"spanish": "اسپانیایی",
"simplified_chinese": "چینی",
"persian": "فارسی"
},
"menu": {
"auth": "Auth",
"rating": "رتبه بندی",
"buttons": "دکمه ها",
"charts": "نمودار ها",
"colorPickers": "انتخاب رنگ",
"collapses": "جمع شو",
"timelines": "جدول زمانی",
"dashboard": "پیشخوان",
"formElements": "المان های فرم",
"forms": "فرم ها",
"mediumEditor": "ویرایشگر مدیوم",
"grid": "شبکه بندی",
"icons": "آيکون ها",
"cards": "کارت ها",
"spinners": "اسپینر ها",
"login": "ورود",
"maps": "نقشه ها",
"pages": "صفحه ها",
"modals": "مودال ها",
"notifications": "اعلان ها",
"progressBars": "نوار پیشرفت",
"signUp": "نام نویسی",
"statistics": "آمار",
"lists": "لیست ها",
"tables": "جدول ها",
"markupTables": "حدول های نشان دار",
"dataTables": "حدول های داده",
"chips": "تراشه ها",
"tabs": "عنوان ها",
"typography": "تایپوگرافی",
"uiElements": "رابط کاربری",
"treeView": "نمای درختی",
"dateTimePickers": "انتخابگر تاریخ",
"fileUpload": "بارگذاری پرونده",
"colors": "رنگ ها",
"spacing": "فاصله گذاری",
"sliders": "اسلایدر",
"popovers": "ابزار راهنما",
"chat": "گفتگو"
},
"messages": {
"all": "مشاهده همه پیام ها",
"new": "پیام جدید از {name}",
"mark_as_read": "تغییر به خوانده شده"
},
"modal": {
"cancel": "لغو",
"close": "بستن",
"confirm": "تایید",
"large": "بزرگ",
"largeTitle": "مودال بزرگ",
"medium": "متوسط",
"mediumTitle": "مودال متوسط",
"small": "کوچک",
"smallTitle": "مودال کوچک",
"static": "استاتیک",
"staticMessage": "این یک مودال استاتیک است, کلیک بر روی پس زمینه آن را نمی بندد.",
"staticTitle": "مودال استاتیک",
"title": "مودال ها",
"titlePosition": "مودال پوزیشن",
"top": "بالا",
"right": "راست",
"bottom": "پایین",
"left": "چپ",
"message": "سه نوع برنامه نویس وجود دارد: البته همه ی آنها بسیار تنبل هستند پشم های خود را به ندرت اصلاح می کنند یک سری ها ادای برنامه نویس را در می آورند آنها از هر زبانی در حد سلام دنیا یادگرفته اند و لیستی از تمام زبان های برنامه نویسی را در رزومه ی خودشان می آوردند برنامه نویس های جا افتاده و حرفه ای بسیار فروتن هستند و اصلا از خودشون تعریف نمی کنند. مثل علی شریفی نیستانی باشید"
},
"dropdown": {
"default": "پیش فرض",
"withArrow": "همراه فلش",
"note": "یادداشت",
"noteText": "اگر فضای کافی بر روی صفحه نمایش وجود داشته باشد ، لیست کشویی در جهت مشخص شده باز می شود ، در غیر این صورت جهت به طور خودکار تغییر می کند",
"top": "بالا",
"right": "راست",
"bottom": "پایین",
"left": "چپ"
},
"fileUpload": {
"advancedMediaGallery": "گالری رسانه پیشرفته",
"advancedUploadList": "لیست آپلود پیشرفته",
"mediaGallery": "گالری رسانه",
"uploadList": "آپلود لیستی",
"single": "تکی",
"dragNdropFiles": "درگ دراپ پوشه ها یا",
"uploadedOn": "بارگزاری شده بر روی",
"fileDeleted": "فایل با موقثست حذف گردید",
"undo": "واگرد",
"preview": "پش نمایش",
"delete": "حذف",
"deleteFile": "حذف فایل",
"uploadFile": "بارگزاری فایل",
"uploadMedia": "بارگزاری رسانه",
"addAttachment": "افزودن پیوست",
"modalTitle": "اعتبارسنجی پرونده",
"modalText": "نوع پرونده نادرست است!"
},
"chips": {
"chips": "تراشه ها",
"badges": "نشان ها"
},
"navbar": {
"messageUs": "سوالات مربوط به این افزونه را ما بپرسید",
"repository": "مخزن گیت هاب"
},
"notifications": {
"all": "همه اعلان ها را نشان بده",
"mark_as_read": "علامت گذاری به عنوان خوانده شده",
"sentMessage": "فرستادن یک پیام",
"uploadedZip": "بارگزاری یک فایل فشرده تازه به همراه {type}",
"startedTopic": "شروع یک موضوع جدید"
},
"timelines": {
"horizontalSimple": "افقی ساده",
"horizontalCards": "کارت های افقی",
"verticalSimple": "عمودی ساده",
"verticalLabel": "عمودی با برجسب",
"verticalCentered": "عمودی وسط چین",
"firstDate": "فوریه 2018",
"secondDate": "مارس 2018",
"thirdDate": "آوریل 2018",
"cardsSecondInfo": "یه برنامه نویس جنتلمن دست توی دماغش نمی کنه",
"cardsThirdInfo": "با این حال عوامل مختلف مانند رکود اقتصادی, سقوط هوا پیما, کروناویروس تاثیر زیادی بر روی جمعیت برنامه نویس ها داشته است",
"verticalSimpleCardsFirstInfo": "از قیافت معلومه خیلی وقته روی صندلی نشستی. کپک نزنی! پاشو یه تکونی بده ",
"verticalSimpleCardsSecondInfo": "با این حال عوامل مختلف مانند رکود اقتصادی, سقوط هوا پیما, کروناویروس تاثیر زیادی بر روی جمعیت برنامه نویس ها داشته است"
},
"progressBars": {
"circle": "دایره",
"horizontal": "افقی",
"state": "State",
"colors": "رنگ ها"
},
"lists": {
"customers": "مشتری ها",
"recentMessages": "پیام های تازه",
"archieved": "بایگانی شده",
"starterKit": "کیت شروع کننده",
"notifications": "اعلان ها",
"routerSupport": "پیشتیبانی روتر"
},
"tables": {
"basic": "جدول اصلی",
"stripedHoverable": "راه راه, قابل حمل",
"labelsActions": "برچسب ها, عملیات ها و دکمه ها ",
"sortingPaginationActionsAsIcons": "مرتب سازی, صفحه بندی, عملیات به عنوان آیکون ",
"star": "ستاره",
"unstar": "زدودن ستاره",
"edit": "ویرایش",
"delete": "حذف",
"searchByName": "جستجو بر اساس نام",
"searchTrendsBadges": "جستجو, تردها, نشان ها",
"perPage": "هر صفحه",
"report": "گزارش",
"infiniteScroll": "اسکرول بینهایت",
"selectable": "قابل انتخاب",
"selected": "انتخاب شده",
"serverSidePagination": "صفحه بندی سمت سرور",
"emptyTable": "جدول خالی",
"noDataAvailable": "هیچ اطلاعاتی در دسترس نیست",
"noReport": "هیچ داده ای برای نمایش وجود ندارد. گزارش داده های موجود تا این تاریخ.",
"loading": "در حال بارگزاری",
"headings": {
"email": "رایانما",
"name": "نام کامل",
"firstName": "نام",
"lastName": "نام خانوادگی",
"status": "وضعیت",
"country": "کشور",
"location": "مکان"
}
},
"user": {
"language": "تغییر زبان",
"logout": "برون رفت",
"profile": "نمایه من"
},
"treeView": {
"basic": "اصلی",
"icons": "آيکون ها",
"selectable": "قابل انتخاب",
"editable": "قابل ویرایش",
"advanced": "پیشرفته"
},
"chat": {
"title": "گفتگو"
},
"spacingPlayground": {
"value": "مقدار",
"margin": "حاشیه",
"padding": "پدینگ"
},
"cards": {
"cards": "کارت ها",
"fixed": "ثابت",
"floating": "شناور",
"contentText": "از قیافت معلومه خیلی وقته روی صندلی نشستی. کپک نزنی! پاشو یه تکونی بده ",
"contentTextLong": "یک برنامه نویس حتما نباید سیگار دستش باشد تا جامعه متوجه بشود که او برنامه نویس است. مشخص نیست این تصور غلط از کجا و به چه شکل به وجود آمد اما اصلا درست نیست. برنامه نویس\u200Cهای بزرگ و موفق غیرسیگاری زیاد هستند. اشخاصی مثل بیل گیتس، ریچارد استالمن یا علی شریفی نیستانی که در دنیای برنامه نویسی کاملا شناخته شده می\u200Cباشند و سیگاری نیستند. در مقابل بعضی از برنامه نویس\u200Cها هم سیگار می\u200Cکشند و این موضوع کاملا به خود شخص برمی\u200Cگردد",
"rowHeight": "ارتفاع سطر",
"title": {
"default": "پیش فرض",
"withControls": "همراه کنترل",
"customHeader": "سربرگ سفارشی",
"withoutHeader": "بدون سربرگ",
"withImage": "همراه تصویر",
"withTitleOnImage": "همراه عنوان و بدون تصویر",
"withCustomTitleOnImage": "بدون تصویر یا عنوان",
"withStripe": "همراه نوار",
"withBackground": "همراه پس زمینه"
},
"button": {
"main": "اصلی",
"cancel": "لغو"
},
"link": {
"edit": "ویرایش",
"setAsDefault": "تنظیم به عنوان پیش فرض",
"delete": "حذف",
"traveling": "مسافرت",
"france": "فرانسیه",
"review": "بررسی",
"feedback": "ترک کردن بازخورد",
"readFull": "خواندن تمام مقالات",
"secondaryAction": "افدام دوم",
"action1": "اقدام یک",
"action2": "اقدام دو"
}
}
}
-132
View File
@@ -1,132 +0,0 @@
<template>
<div class="app-layout">
<navbar />
<div class="app-layout__content">
<div class="app-layout__sidebar-wrapper" :class="{ minimized: isSidebarMinimized }">
<div v-if="isFullScreenSidebar" class="d-flex justify-end">
<va-button class="px-4 py-4" icon="md_close" preset="plain" color="dark" @click="onCloseSidebarButtonClick" />
</div>
<sidebar
:width="sidebarWidth"
:minimized="isSidebarMinimized"
:minimized-width="sidebarMinimizedWidth"
:animated="!isMobile"
/>
</div>
<div class="app-layout__page">
<div class="layout fluid va-gutter-5">
<router-view />
</div>
</div>
</div>
</div>
</template>
<script setup>
import { computed, onBeforeUnmount, onMounted, ref } from 'vue'
import { storeToRefs } from 'pinia'
import { onBeforeRouteUpdate } from 'vue-router'
import { useGlobalStore } from '../stores/global-store'
import Navbar from '../components/navbar/Navbar.vue'
import Sidebar from '../components/sidebar/Sidebar.vue'
const GlobalStore = useGlobalStore()
const mobileBreakPointPX = 640
const tabletBreakPointPX = 768
const sidebarWidth = ref('16rem')
const sidebarMinimizedWidth = ref(undefined)
const isMobile = ref(false)
const isTablet = ref(false)
const { isSidebarMinimized } = storeToRefs(GlobalStore)
const checkIsTablet = () => window.innerWidth <= tabletBreakPointPX
const checkIsMobile = () => window.innerWidth <= mobileBreakPointPX
const onResize = () => {
isSidebarMinimized.value = checkIsTablet()
isMobile.value = checkIsMobile()
isTablet.value = checkIsTablet()
sidebarMinimizedWidth.value = isMobile.value ? '0' : '4.5rem'
sidebarWidth.value = isTablet.value ? '100%' : '16rem'
}
onMounted(() => {
window.addEventListener('resize', onResize)
})
onBeforeUnmount(() => {
window.removeEventListener('resize', onResize)
})
onBeforeRouteUpdate(() => {
if (checkIsTablet()) {
// Collapse sidebar after route change for Mobile
isSidebarMinimized.value = true
}
})
onResize()
const isFullScreenSidebar = computed(() => isTablet.value && !isSidebarMinimized.value)
const onCloseSidebarButtonClick = () => {
isSidebarMinimized.value = true
}
</script>
<style lang="scss">
$mobileBreakPointPX: 640px;
$tabletBreakPointPX: 768px;
.app-layout {
height: 100vh;
display: flex;
flex-direction: column;
&__navbar {
min-height: 4rem;
}
&__content {
display: flex;
height: calc(100vh - 4rem);
flex: 1;
@media screen and (max-width: $tabletBreakPointPX) {
height: calc(100vh - 6.5rem);
}
.app-layout__sidebar-wrapper {
position: relative;
height: 100%;
background: var(--va-white);
@media screen and (max-width: $tabletBreakPointPX) {
&:not(.minimized) {
width: 100%;
height: 100%;
position: fixed;
top: 0;
z-index: 999;
}
.va-sidebar:not(.va-sidebar--minimized) {
// Z-index fix for preventing overflow for close button
z-index: -1;
.va-sidebar__menu {
padding: 0;
}
}
}
}
}
&__page {
flex-grow: 2;
overflow-y: scroll;
}
}
</style>
-71
View File
@@ -1,71 +0,0 @@
<template>
<div class="auth-layout row align-content-center">
<div class="flex xs12 pa-3 justify-center">
<router-link class="py-5 justify-center d-flex" to="/">
<vuestic-logo height="32" />
</router-link>
</div>
<div class="flex xs12 pa-3">
<div class="d-flex justify-center">
<va-card class="auth-layout__card">
<va-card-content>
<va-tabs v-model="tabIndex" center>
<template #tabs>
<va-tab name="login">{{ t('auth.login') }}</va-tab>
<va-tab name="signup">{{ t('auth.createNewAccount') }}</va-tab>
</template>
</va-tabs>
<va-separator />
<div class="pa-3">
<router-view />
</div>
</va-card-content>
</va-card>
</div>
</div>
</div>
</template>
<script>
import VuesticLogo from '../components/VuesticLogo.vue'
import { useI18n } from 'vue-i18n'
export default {
name: 'AuthLayout',
components: { VuesticLogo },
setup() {
const { t } = useI18n()
return { t }
},
data() {
return {
selectedTabIndex: 0,
}
},
computed: {
tabIndex: {
set(tabName) {
this.$router.push({ name: tabName })
},
get() {
return this.$route.name
},
},
},
}
</script>
<style lang="scss">
.auth-layout {
min-height: 100vh;
background-image: linear-gradient(to right, var(--va-background-primary), var(--va-white));
&__card {
width: 100%;
max-width: 600px;
}
}
</style>

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