14 |
15 |
16 | {{ vite_assets() }}
17 |
18 | @if(config('content.google.open'))
19 |
20 |
21 |
32 | @endif
33 |
34 |
35 |
--------------------------------------------------------------------------------
/config/services.php:
--------------------------------------------------------------------------------
1 | [
18 | 'domain' => env('MAILGUN_DOMAIN'),
19 | 'secret' => env('MAILGUN_SECRET'),
20 | 'endpoint' => env('MAILGUN_ENDPOINT', 'api.mailgun.net'),
21 | ],
22 |
23 | 'postmark' => [
24 | 'token' => env('POSTMARK_TOKEN'),
25 | ],
26 |
27 | 'ses' => [
28 | 'key' => env('AWS_ACCESS_KEY_ID'),
29 | 'secret' => env('AWS_SECRET_ACCESS_KEY'),
30 | 'region' => env('AWS_DEFAULT_REGION', 'us-east-1'),
31 | ],
32 |
33 | ];
34 |
--------------------------------------------------------------------------------
/resources/js/layout/hook/ResizeHandler.js:
--------------------------------------------------------------------------------
1 | const { body } = document
2 | const WIDTH = 992
3 | import { appStore } from '@/store/app'
4 | export default function () {
5 | const useAppStore = appStore()
6 | const $_isMobile = () => {
7 | const rect = body.getBoundingClientRect()
8 | return rect.width - 1 < WIDTH
9 | }
10 | const $_resizeHandler = () => {
11 | if (!document.hidden) {
12 | const isMobile = $_isMobile()
13 | if (isMobile) {
14 | // console.log('closeSideBar')
15 | /*此处只做根据window尺寸关闭sideBar功能*/
16 |
17 | useAppStore.openSideBar(false)
18 | } else {
19 | useAppStore.openSideBar(true)
20 | }
21 | }
22 | }
23 | onBeforeMount(() => {
24 | window.addEventListener('resize', $_resizeHandler)
25 | })
26 | onMounted(() => {
27 | const isMobile = $_isMobile()
28 | if (isMobile) {
29 | useAppStore.openSideBar(false)
30 | } else {
31 | useAppStore.openSideBar(true)
32 | }
33 | })
34 | onBeforeUnmount(() => {
35 | window.removeEventListener('resize', $_resizeHandler)
36 | })
37 | }
38 |
--------------------------------------------------------------------------------
/app/Exceptions/Handler.php:
--------------------------------------------------------------------------------
1 | >
15 | */
16 | protected $dontReport = [
17 | //
18 | ];
19 |
20 | /**
21 | * A list of the inputs that are never flashed for validation exceptions.
22 | *
23 | * @var array
3 |
4 |
5 |
6 |
9 |
10 |
12 |
13 |
14 |
15 |
16 |
17 |
48 |
--------------------------------------------------------------------------------
/.env.docker:
--------------------------------------------------------------------------------
1 | APP_NAME=Laravel-Vue-Admin
2 | APP_ENV=local
3 | APP_KEY=base64:1h7nR0wpjoinY5TCaPM6OR4HOCH7ssV1FjSPiZUy7I0=
4 | APP_DEBUG=true
5 | APP_URL=http://localhost:8000
6 |
7 | LOG_CHANNEL=daily
8 | LOG_DEPRECATIONS_CHANNEL=null
9 | LOG_LEVEL=debug
10 |
11 | DB_CONNECTION=mysql
12 | DB_HOST=mysql
13 | DB_PORT=3306
14 | DB_DATABASE=laravel-vue-admin
15 | DB_USERNAME=laravel-vue-admin
16 | DB_PASSWORD=laravel-vue-admin
17 |
18 | BROADCAST_DRIVER=log
19 | CACHE_DRIVER=redis
20 | FILESYSTEM_DRIVER=local
21 | QUEUE_CONNECTION=redis
22 | SESSION_DRIVER=file
23 | SESSION_LIFETIME=120
24 |
25 | MEMCACHED_HOST=127.0.0.1
26 |
27 | REDIS_HOST=redis
28 | REDIS_PASSWORD=null
29 | REDIS_PORT=6379
30 |
31 | MAIL_MAILER=smtp
32 | MAIL_HOST=mailhog
33 | MAIL_PORT=1025
34 | MAIL_USERNAME=null
35 | MAIL_PASSWORD=null
36 | MAIL_ENCRYPTION=null
37 | MAIL_FROM_ADDRESS=null
38 | MAIL_FROM_NAME="${APP_NAME}"
39 |
40 | AWS_ACCESS_KEY_ID=
41 | AWS_SECRET_ACCESS_KEY=
42 | AWS_DEFAULT_REGION=us-east-1
43 | AWS_BUCKET=
44 | AWS_USE_PATH_STYLE_ENDPOINT=false
45 |
46 | PUSHER_APP_ID=
47 | PUSHER_APP_KEY=
48 | PUSHER_APP_SECRET=
49 | PUSHER_APP_CLUSTER=mt1
50 |
51 | MIX_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
52 | MIX_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"
53 |
54 | SANCTUM_STATEFUL_DOMAINS=http://localhost:8000
--------------------------------------------------------------------------------
/phpunit.xml:
--------------------------------------------------------------------------------
1 |
2 |
4 |
6 |
7 | {{ item.label }}
15 |
3 |
15 |
16 |
17 |
18 |
31 |
32 |
44 |
--------------------------------------------------------------------------------
/database/migrations/2014_10_12_000000_create_users_table.php:
--------------------------------------------------------------------------------
1 | bigIncrements('id');
18 | $table->string('name', 20)->unique();
19 | $table->string('nickname', 20)->default('');
20 | $table->string('avatar', 160)->default('');
21 | $table->string('email', 50)->unique();
22 | $table->tinyInteger('status')->default(1);
23 | $table->tinyInteger('sex')->default(0)->comment('0:man 1:woman');
24 | $table->timestamp('birthday')->nullable();
25 | $table->string('description')->default('');
26 | $table->string('password');
27 | $table->rememberToken();
28 | $table->timestamps();
29 | $table->softDeletes();
30 | });
31 | }
32 |
33 | /**
34 | * Reverse the migrations.
35 | *
36 | * @return void
37 | */
38 | public function down()
39 | {
40 | Schema::drop('users');
41 | }
42 | }
43 |
--------------------------------------------------------------------------------
/resources/js/layout/components/Hamburger/Hamburger.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
15 |
16 |
17 |
18 |
31 |
32 |
44 |
--------------------------------------------------------------------------------
/resources/js/router/modules/admin.js:
--------------------------------------------------------------------------------
1 | /** When your routing table is too long, you can split it into small modules**/
2 | import Layout from '@/layout/Layout.vue'
3 |
4 | const adminRoutes = {
5 | path: '/administrator',
6 | component: Layout,
7 | redirect: '/administrator/users',
8 | name: 'Administrator',
9 | alwaysShow: true,
10 | meta: {
11 | title: 'administrator',
12 | bootstrapIcon: 'person-workspace',
13 | permissions: ['view menu administrator'],
14 | },
15 | children: [
16 | /** User managements */
17 | {
18 | path: 'users/edit/:id(\\d+)',
19 | component: () => import('@/views/users/UserProfile.vue'),
20 | name: 'UserProfile',
21 | meta: { title: 'userProfile', noCache: true, permissions: ['manage user'] },
22 | hidden: true,
23 | },
24 | {
25 | path: 'users',
26 | component: () => import('@/views/users/List.vue'),
27 | name: 'UserList',
28 | meta: {title: 'users', bootstrapIcon: 'people', permissions: ['manage user']},
29 | },
30 | /** Role and permission */
31 | {
32 | path: 'roles',
33 | component: () => import('@/views/role-permission/List.vue'),
34 | name: 'RoleList',
35 | meta: {title: 'rolePermission', bootstrapIcon: 'person-lines-fill', permissions: ['manage permission']},
36 | },
37 | ],
38 | }
39 |
40 | export default adminRoutes
41 |
--------------------------------------------------------------------------------
/app/Jobs/ProcessRequestLog.php:
--------------------------------------------------------------------------------
1 | ip = $ip;
33 | $this->method = $method;
34 | $this->uri = $uri;
35 | $this->visitAt = $visitAt;
36 | }
37 |
38 | /**
39 | * Execute the job.
40 | *
41 | * @return void
42 | */
43 | public function handle()
44 | {
45 | Request::query()->create([
46 | 'ip' => DB::raw("INET6_ATON('$this->ip')"),
47 | 'method' => $this->method,
48 | 'uri' => $this->uri,
49 | 'visit_at' => $this->visitAt
50 | ]);
51 | }
52 | }
53 |
--------------------------------------------------------------------------------
/resources/js/components/ScreenFull/index.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
5 |
6 |
7 |
50 |
51 |
58 |
--------------------------------------------------------------------------------
/resources/js/utils/request.js:
--------------------------------------------------------------------------------
1 | import '@/bootstrap';
2 | import { ElMessage } from 'element-plus';
3 | import { isLogged, getToken } from '@/utils/auth';
4 |
5 | // Create axios instance
6 | const service = window.axios.create({
7 | baseURL: '/api',
8 | timeout: 10000, // Request timeout
9 | });
10 |
11 | // Request intercepter
12 | service.interceptors.request.use(
13 | config => {
14 | const token = isLogged();
15 | if (token) {
16 | config.headers['Authorization'] = 'Bearer ' + getToken(); // Set JWT token
17 | }
18 | return config;
19 | },
20 | error => {
21 | // Do something with request error
22 | console.log(error); // for debug
23 | Promise.reject(error);
24 | }
25 | );
26 |
27 | // response pre-processing
28 | service.interceptors.response.use(
29 | response => {
30 | // if (response.headers.authorization) {
31 | // setLogged(response.headers.authorization);
32 | // response.data.token = response.headers.authorization;
33 | // }
34 |
35 | return response.data;
36 | },
37 | error => {
38 | let message = error.message;
39 | if (error.response.data && error.response.data.message) {
40 | message = error.response.data.message;
41 | }
42 |
43 | ElMessage({
44 | message: message,
45 | type: 'error',
46 | duration: 5 * 1000,
47 | });
48 | return Promise.reject(error);
49 | }
50 | );
51 |
52 | export default service;
53 |
--------------------------------------------------------------------------------
/.eslintrc-auto-import.json:
--------------------------------------------------------------------------------
1 | {
2 | "globals": {
3 | "computed": true,
4 | "createApp": true,
5 | "customRef": true,
6 | "defineAsyncComponent": true,
7 | "defineComponent": true,
8 | "effectScope": true,
9 | "EffectScope": true,
10 | "getCurrentInstance": true,
11 | "getCurrentScope": true,
12 | "h": true,
13 | "inject": true,
14 | "isReadonly": true,
15 | "isRef": true,
16 | "markRaw": true,
17 | "nextTick": true,
18 | "onActivated": true,
19 | "onBeforeMount": true,
20 | "onBeforeUnmount": true,
21 | "onBeforeUpdate": true,
22 | "onDeactivated": true,
23 | "onErrorCaptured": true,
24 | "onMounted": true,
25 | "onRenderTracked": true,
26 | "onRenderTriggered": true,
27 | "onScopeDispose": true,
28 | "onServerPrefetch": true,
29 | "onUnmounted": true,
30 | "onUpdated": true,
31 | "provide": true,
32 | "reactive": true,
33 | "readonly": true,
34 | "ref": true,
35 | "resolveComponent": true,
36 | "shallowReactive": true,
37 | "shallowReadonly": true,
38 | "shallowRef": true,
39 | "toRaw": true,
40 | "toRef": true,
41 | "toRefs": true,
42 | "triggerRef": true,
43 | "unref": true,
44 | "useAttrs": true,
45 | "useCssModule": true,
46 | "useCssVars": true,
47 | "useRoute": true,
48 | "useRouter": true,
49 | "useSlots": true,
50 | "watch": true,
51 | "watchEffect": true
52 | }
53 | }
--------------------------------------------------------------------------------
/supervisor/supervisord.conf:
--------------------------------------------------------------------------------
1 | ; supervisor config file
2 |
3 | [unix_http_server]
4 | file=/var/run/supervisor.sock ; (the path to the socket file)
5 | chmod=0700 ; sockef file mode (default 0700)
6 |
7 | [supervisord]
8 | ; The important part here is the nodaemon=true, which instructs supervisor to start in the foreground instead of as a service. This lets Docker to manage its lifecycle.
9 | nodaemon=true
10 | logfile=/var/log/supervisor/supervisord.log ; (main log file;default $CWD/supervisord.log)
11 | pidfile=/var/run/supervisord.pid ; (supervisord pidfile;default supervisord.pid)
12 | childlogdir=/var/log/supervisor ; ('AUTO' child log dir, default $TEMP)
13 |
14 | ; the below section must remain in the config file for RPC
15 | ; (supervisorctl/web interface) to work, additional interfaces may be
16 | ; added by defining them in separate rpcinterface: sections
17 | [rpcinterface:supervisor]
18 | supervisor.rpcinterface_factory = supervisor.rpcinterface:make_main_rpcinterface
19 |
20 | [supervisorctl]
21 | serverurl=unix:///var/run/supervisor.sock ; use a unix:// URL for a unix socket
22 |
23 | ; The [include] section can just contain the "files" setting. This
24 | ; setting can list multiple files (separated by whitespace or
25 | ; newlines). It can also contain wildcards. The filenames are
26 | ; interpreted as relative to this file. Included files *cannot*
27 | ; include files themselves.
28 |
29 | [include]
30 | files = /etc/supervisor/conf.d/*.conf
--------------------------------------------------------------------------------
/app/Http/Controllers/Api/PermissionController.php:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
8 |
9 |
11 |
12 |
13 |
14 |
15 |
16 |
54 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "esnext",
4 | "module": "esnext",
5 | // 启用所有严格类型检查选项。
6 | //启用 --strict相当于启用 --noImplicitAny, --noImplicitThis, --alwaysStrict， --strictNullChecks和 --strictFunctionTypes和--strictPropertyInitialization。
7 | "strict": true,
8 | // 允许编译器编译JS，JSX文件
9 | "allowJs": true,
10 | // 允许在JS文件中报错，通常与allowJS一起使用
11 | "checkJs": false,
12 | // 允许使用jsx
13 | "jsx": "preserve",
14 | "declaration": true,
15 | //移除注解
16 | "removeComments": true,
17 | //不可以忽略any
18 | "noImplicitAny": true,
19 | //关闭 this 类型注解提示
20 | "noImplicitThis": true,
21 | //null/undefined不能作为其他类型的子类型：
22 | //let a: number = null; //这里会报错.
23 | "strictNullChecks": true,
24 | //生成枚举的映射代码
25 | "preserveConstEnums": true,
26 | //根目录
27 | //输出目录
28 | "outDir": "./ts-out-dir",
29 | //是否输出src2.js.map文件
30 | "sourceMap": true,
31 | //变量定义了但是未使用
32 | "noUnusedLocals": false,
33 | //是否允许把json文件当做模块进行解析
34 | "resolveJsonModule": true,
35 | //和noUnusedLocals一样，针对func
36 | "noUnusedParameters": false,
37 | // 模块解析策略，ts默认用node的解析策略，即相对的方式导入
38 | "moduleResolution": "node",
39 | //允许export=导出，由import from 导入
40 | "esModuleInterop": true,
41 | //忽略所有的声明文件（ *.d.ts）的类型检查。
42 | "skipLibCheck": true,
43 | "baseUrl": ".",
44 | "paths": {
45 | "@/*": ["resources/js/*"],
46 | },
47 | //指定默认读取的目录
48 | //"typeRoots": ["./node_modules/@types/", "./types"],
49 | "lib": ["ES2018", "DOM"]
50 | },
51 | //"files": [],
52 | //include包含文件夹会被ts进行读取
53 | "include": ["resources/js"]
54 | }
55 |
--------------------------------------------------------------------------------
/app/Http/Controllers/Api/AuthController.php:
--------------------------------------------------------------------------------
1 | validate([
27 | 'email' => 'required|email',
28 | 'password' => 'required'
29 | ]);
30 | $user = User::query()->where('email', $request->input('email'))->first();
31 | if (empty($user) || !Hash::check($request->input('password'), $user->password)) {
32 | return responseFailed('These credentials do not match our records.', Response::HTTP_UNAUTHORIZED);
33 | }
34 |
35 | $user->token = $user->createToken('laravel-vue-admin')->plainTextToken;
36 |
37 | return responseSuccess($user);
38 | }
39 |
40 | /**
41 | * @param Request $request
42 | * @return JsonResponse
43 | */
44 | public function logout(Request $request): JsonResponse
45 | {
46 | Auth::guard('web')->logout();
47 | return responseSuccess();
48 | }
49 |
50 | public function user(Request $request): UserResource
51 | {
52 | return new UserResource($request->user());
53 | }
54 | }
55 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "private": true,
3 | "scripts": {
4 | "build": "vite build",
5 | "watch": "vite build --watch",
6 | "lint": "eslint --ext .js,.vue resources/js",
7 | "prepare": "husky install"
8 | },
9 | "devDependencies": {
10 | "@babel/preset-typescript": "^7.23.2",
11 | "@element-plus/icons-vue": "^2.1.0",
12 | "@types/node": "^20.8.9",
13 | "@typescript-eslint/eslint-plugin": "^6.9.0",
14 | "@typescript-eslint/parser": "^6.9.0",
15 | "@vitejs/plugin-vue": "^4.4.0",
16 | "@vitejs/plugin-vue-jsx": "^3.0.2",
17 | "axios": "^1.6.0",
18 | "bootstrap-icons": "^1.11.1",
19 | "dayjs": "^1.11.10",
20 | "echarts": "^5.4.3",
21 | "element-plus": "^2.4.1",
22 | "eslint": "^8.52.0",
23 | "eslint-plugin-vue": "^9.18.1",
24 | "husky": "^8.0.3",
25 | "js-cookie": "^3.0.5",
26 | "normalize.css": "^8.0.1",
27 | "nprogress": "^0.2.0",
28 | "path": "^0.12.7",
29 | "path-to-regexp": "^6.2.1",
30 | "pinia": "^2.1.7",
31 | "sass": "^1.69.5",
32 | "sass-loader": "^13.3.2",
33 | "screenfull": "^6.0.2",
34 | "svg-sprite-loader": "^6.0.11",
35 | "typescript": "^5.2.2",
36 | "unplugin-auto-import": "^0.16.7",
37 | "vite": "^4.5.0",
38 | "vite-plugin-laravel": "^0.3.1",
39 | "vite-plugin-vue-setup-extend-plus": "^0.1.0",
40 | "vue": "^3.3.7",
41 | "vue-i18n": "^9.6.1",
42 | "vue-loader": "^17.0.1",
43 | "vue-router": "^4.2.5",
44 | "vuedraggable": "^2.24.3"
45 | }
46 | }
47 |
--------------------------------------------------------------------------------
/app/Providers/RouteServiceProvider.php:
--------------------------------------------------------------------------------
1 | configureRateLimiting();
30 |
31 | $this->routes(function () {
32 | Route::prefix('api')
33 | ->middleware('api')
34 | ->namespace($this->namespace)
35 | ->group(base_path('routes/api.php'));
36 |
37 | Route::middleware('web')
38 | ->namespace($this->namespace)
39 | ->group(base_path('routes/web.php'));
40 | });
41 | }
42 |
43 | /**
44 | * Configure the rate limiters for the application.
45 | *
46 | * @return void
47 | */
48 | protected function configureRateLimiting()
49 | {
50 | RateLimiter::for('api', function (Request $request) {
51 | return Limit::perMinute(60)->by(optional($request->user())->id ?: $request->ip());
52 | });
53 | }
54 | }
55 |
--------------------------------------------------------------------------------
/resources/js/utils/validate.js:
--------------------------------------------------------------------------------
1 | /* All validations should be defined here */
2 |
3 | export function isExternal(path) {
4 | return /^(https?:|mailto:|tel:)/.test(path);
5 | }
6 |
7 | /**
8 | * Validate a valid URL
9 | * @param {String} textval
10 | * @return {Boolean}
11 | */
12 | export function validURL(url) {
13 | const reg = /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/;
14 | return reg.test(url);
15 | }
16 |
17 | /**
18 | * Validate a full-lowercase string
19 | * @return {Boolean}
20 | * @param {String} str
21 | */
22 | export function validLowerCase(str) {
23 | const reg = /^[a-z]+$/;
24 | return reg.test(str);
25 | }
26 |
27 | /**
28 | * Validate a full-uppercase string
29 | * @return {Boolean}
30 | * @param {String} str
31 | */
32 | export function validUpperCase(str) {
33 | const reg = /^[A-Z]+$/;
34 | return reg.test(str);
35 | }
36 |
37 | /**
38 | * Check if a string contains only alphabet
39 | * @param {String} str
40 | * @param {Boolean}
41 | */
42 | export function validAlphabets(str) {
43 | const reg = /^[A-Za-z]+$/;
44 | return reg.test(str);
45 | }
46 |
47 | /**
48 | * Validate an email address
49 | * @param {String} email
50 | * @return {Boolean}
51 | */
52 | export function validEmail(email) {
53 | const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
54 | return re.test(email);
55 | }
56 |
--------------------------------------------------------------------------------
/resources/js/views/dashboard/Admin/components/TransactionTable.vue:
--------------------------------------------------------------------------------
1 |
2 |
4 |
6 |
7 | {{ item.label }}
15 |
3 |
4 |
12 |
13 |
14 |
20 |
21 |
43 |
44 |
81 |
--------------------------------------------------------------------------------
/.eslintrc.js:
--------------------------------------------------------------------------------
1 | // https://blog.csdn.net/Sheng_zhenzhen/article/details/108685176
2 | module.exports = {
3 | root: true,
4 | env: {
5 | browser: true,
6 | commonjs: true,
7 | es6: true,
8 | node: true
9 | },
10 |
11 | globals: {
12 | defineEmits: true,
13 | document: true,
14 | localStorage: true,
15 | GLOBAL_VAR: true,
16 | window: true,
17 | defineProps: true,
18 | defineExpose: true,
19 | $ref: true
20 | },
21 | plugins: ['@typescript-eslint', 'prettier', 'import'],
22 | extends: [
23 | 'eslint:recommended',
24 | 'plugin:@typescript-eslint/recommended',
25 | 'plugin:vue/vue3-recommended',
26 | 'prettier',
27 | './.eslintrc-auto-import.json',
28 | './tests/.eslintrc-unit-test.json'
29 | ],
30 | parserOptions: {
31 | parser: '@typescript-eslint/parser',
32 | sourceType: 'module',
33 | ecmaFeatures: {
34 | jsx: true,
35 | tsx: true
36 | }
37 | },
38 | rules: {
39 | //close lf error
40 | 'import/no-unresolved': [0],
41 | 'vue/multi-word-component-names': 'off',
42 | 'vue/no-deprecated-router-link-tag-prop': 'off',
43 | 'import/extensions': 'off',
44 | 'import/no-absolute-path': 'off',
45 | 'no-async-promise-executor': 'off',
46 | 'import/no-extraneous-dependencies': 'off',
47 | 'vue/no-multiple-template-root': 'off',
48 | 'vue/html-self-closing': 'off',
49 | 'no-console': 'off',
50 | 'no-plusplus': 'off',
51 | 'no-useless-escape': 'off',
52 | 'no-bitwise': 'off',
53 | '@typescript-eslint/no-explicit-any': ['off'],
54 | '@typescript-eslint/explicit-module-boundary-types': ['off'],
55 | '@typescript-eslint/ban-ts-comment': ['off'],
56 | 'vue/no-setup-props-destructure': ['off'],
57 | '@typescript-eslint/no-empty-function': ['off'],
58 | 'vue/script-setup-uses-vars': ['off'],
59 | //can config to 2 if need more then required
60 | '@typescript-eslint/no-unused-vars': [0],
61 | 'no-param-reassign': ['off']
62 | }
63 | }
64 |
--------------------------------------------------------------------------------
/resources/js/components/GithubCorner/index.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
23 |
24 |
25 |
26 |
55 |
--------------------------------------------------------------------------------
/resources/js/views/dashboard/GithubCorner/GithubCorner.vue:
--------------------------------------------------------------------------------
1 |
2 |
8 |
22 |
23 |
24 |
25 |
54 |
--------------------------------------------------------------------------------
/resources/js/views/users/components/UserBio.vue:
--------------------------------------------------------------------------------
1 |
2 |
7 |
11 |
4 | {{ t('user.about_me') }}
5 |
6 |
7 |
17 |
8 |
11 |
12 |
16 |
13 | B.S. in Communication Engineering from Hunan University of Technology
14 |
15 |
18 |
41 |
19 |
22 |
23 |
40 |
24 | Laravel
25 |
27 |
28 | Vue
29 |
31 |
32 | JavaScript
33 |
35 |
36 | HTML & CSS
37 |
39 |
3 |
4 |
5 | ![]()
6 |
8 |
9 | ![]()
10 |
12 |
13 |
14 |
15 |
16 |
32 |
33 |
77 |
--------------------------------------------------------------------------------
/resources/js/views/dashboard/Admin/components/TodoList/Todo.vue:
--------------------------------------------------------------------------------
1 |
2 | {{ title }}
7 |{{ title }}
11 |
4 |
5 |
6 |
7 |
8 |
17 |
3 |
19 |
20 |
21 |
43 |
44 |
77 |
--------------------------------------------------------------------------------
/resources/js/views/dashboard/Admin/components/PieChart.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
92 |
93 |
94 |
--------------------------------------------------------------------------------
/composer.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "laravel/laravel",
3 | "type": "project",
4 | "description": "The Laravel Framework.",
5 | "keywords": ["framework", "laravel"],
6 | "license": "MIT",
7 | "require": {
8 | "php": "^8.1",
9 | "doctrine/dbal": "^3.6",
10 | "guzzlehttp/guzzle": "^7.2",
11 | "laravel/framework": "^10.0",
12 | "laravel/sanctum": "^3.2",
13 | "laravel/tinker": "^2.8",
14 | "laravel/ui": "^4.2",
15 | "league/fractal": "^0.20.1",
16 | "spatie/laravel-permission": "^5.10",
17 | "tucker-eric/eloquentfilter": "^3.2"
18 | },
19 | "require-dev": {
20 | "fakerphp/faker": "^1.9.1",
21 | "laravel/pint": "^1.0",
22 | "laravel/sail": "^1.18",
23 | "mockery/mockery": "^1.4.4",
24 | "nunomaduro/collision": "^7.0",
25 | "phpunit/phpunit": "^10.0",
26 | "spatie/laravel-ignition": "^2.0"
27 | },
28 | "autoload": {
29 | "psr-4": {
30 | "App\\": "app/",
31 | "Database\\Factories\\": "database/factories/",
32 | "Database\\Seeders\\": "database/seeders/"
33 | }
34 | },
35 | "autoload-dev": {
36 | "psr-4": {
37 | "Tests\\": "tests/"
38 | },
39 | "files": [
40 | "app/helpers.php"
41 | ]
42 | },
43 | "scripts": {
44 | "post-autoload-dump": [
45 | "Illuminate\\Foundation\\ComposerScripts::postAutoloadDump",
46 | "@php artisan package:discover --ansi"
47 | ],
48 | "post-update-cmd": [
49 | "@php artisan vendor:publish --tag=laravel-assets --ansi --force"
50 | ],
51 | "post-root-package-install": [
52 | "@php -r \"file_exists('.env') || copy('.env.example', '.env');\""
53 | ],
54 | "post-create-project-cmd": [
55 | "@php artisan key:generate --ansi"
56 | ]
57 | },
58 | "extra": {
59 | "laravel": {
60 | "dont-discover": []
61 | }
62 | },
63 | "config": {
64 | "optimize-autoloader": true,
65 | "preferred-install": "dist",
66 | "sort-packages": true,
67 | "allow-plugins": {
68 | "pestphp/pest-plugin": true,
69 | "php-http/discovery": true
70 | }
71 | },
72 | "minimum-stability": "stable",
73 | "prefer-stable": true
74 | }
75 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Laravel Vue Admin
2 |
3 | [Laravel Vue Admin](https://laravel-vue-admin.eu.org) is a beautiful dashboard combination of [Laravel](https://laravel.com/), [Vue3](https://github.com/vuejs/vue) and the UI Toolkit [Element Plus](https://element-plus.org/).
4 |
5 | ## Getting started
6 |
7 | ### Installing
8 |
9 | #### Manual
10 |
11 | ```bash
12 | # Clone the project and run composer
13 | git clone https://github.com/trumanwong/laravel-vue-admin
14 | cd laravel-vue-admin
15 |
16 | # Migration and DB seeder (after changing your DB settings in .env)
17 | php artisan migrate --seed
18 |
19 | # Install dependency with NPM
20 | npm install
21 |
22 | # develop
23 | npm run watch
24 |
25 | # Build on production
26 | npm run build
27 | ```
28 |
29 | #### Docker
30 |
31 | ```sh
32 | docker-compose up -d
33 | ```
34 |
35 | Build static files within `Laravel` container with `npm`
36 |
37 | ```sh
38 | docker exec -it laravel-vue-admin npm run watch
39 | ```
40 |
41 | Open http://localhost:8000 (laravel container port declared in `docker-compose.yml`) to access Laravel Vue Admin.
42 |
43 | ## Built with
44 |
45 | * [Laravel](https://laravel.com/) - The PHP Framework For Web Artisans
46 | * [Laravel Sanctum](https://github.com/laravel/sanctum/) - Laravel Sanctum provides a featherweight authentication system for SPAs and simple APIs.
47 | * [spatie/laravel-permission](https://github.com/spatie/laravel-permission) - Associate users with permissions and roles.
48 | * [VueJS](https://vuejs.org/) - The Progressive JavaScript Framework
49 | * [Element Plus](https://element-plus.org/) -A Vue.js 3 UI library
50 | * [vue3-admin-ts](https://github.com/jzfai/vue3-admin-ts) - A minimal vue3 admin template with Element-Plus UI & axios & permission control & lint & hook
51 |
52 | ## License
53 |
54 | This project is licensed under the MIT License - see the [LICENSE.md](LICENSE) file for details.
55 |
56 | ## Acknowledgements
57 |
58 | * [Laravel](https://laravel.com/) - The PHP Framework For Web Artisans
59 | * [VueJS](https://vuejs.org/) - The Progressive JavaScript Framework
60 | * [vue3-admin-ts](https://panjiachen.github.io/vue-element-admin/#/) A minimal vue3 admin template with Element-Plus UI & axios & permission control & lint & hook
61 | * [Echarts](http://echarts.apache.org/) - A powerful, interactive charting and visualization library for browser.
62 | * [Cloudflare](https://https://www.cloudflare.com/) - A global network built for the cloud
63 |
--------------------------------------------------------------------------------
/resources/js/store/permission.js:
--------------------------------------------------------------------------------
1 | import { asyncRoutes, constantRoutes } from '../router';
2 | import {defineStore} from "pinia";
3 |
4 | /**
5 | * Check if it matches the current user right by meta.role
6 | * @param {String[]} roles
7 | * @param {String[]} permissions
8 | * @param route
9 | */
10 | function canAccess(roles, permissions, route) {
11 | if (route.meta) {
12 | let hasRole = true;
13 | let hasPermission = true;
14 | if (route.meta.roles || route.meta.permissions) {
15 | // If it has meta.roles or meta.permissions, accessible = hasRole || permission
16 | hasRole = false;
17 | hasPermission = false;
18 | if (route.meta.roles) {
19 | hasRole = roles.some(role => route.meta.roles.includes(role));
20 | }
21 |
22 | if (route.meta.permissions) {
23 | hasPermission = permissions.some(permission => route.meta.permissions.includes(permission));
24 | }
25 | }
26 |
27 | return hasRole || hasPermission;
28 | }
29 |
30 | // If no meta.roles/meta.permissions inputted - the route should be accessible
31 | return true;
32 | }
33 |
34 | /**
35 | * Find all routes of this role
36 | * @param routes asyncRoutes
37 | * @param roles
38 | */
39 | function filterAsyncRoutes(routes, roles, permissions) {
40 | const res = [];
41 |
42 | routes.forEach(route => {
43 | const tmp = { ...route };
44 | if (canAccess(roles, permissions, tmp)) {
45 | if (tmp.children) {
46 | tmp.children = filterAsyncRoutes(
47 | tmp.children,
48 | roles,
49 | permissions
50 | );
51 | }
52 | res.push(tmp);
53 | }
54 | });
55 |
56 | return res;
57 | }
58 |
59 | export const permissionStore = defineStore('permission', {
60 | state: () => {
61 | return {
62 | routes: [],
63 | addRoutes: [],
64 | }
65 | },
66 | actions: {
67 | generateRoutes(roles, permissions) {
68 | return new Promise(resolve => {
69 | let accessedRoutes;
70 | if (roles.includes('admin')) {
71 | accessedRoutes = asyncRoutes || [];
72 | } else {
73 | accessedRoutes = filterAsyncRoutes(asyncRoutes, roles, permissions);
74 | }
75 |
76 | this.$patch((state) => {
77 | state.addRoutes = accessedRoutes;
78 | state.routes = constantRoutes.concat(accessedRoutes);
79 | })
80 | resolve(accessedRoutes);
81 | });
82 | }
83 | }
84 | })
85 |
--------------------------------------------------------------------------------
/resources/js/views/dashboard/Admin/components/BarChart.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
103 |
--------------------------------------------------------------------------------
/routes/api.php:
--------------------------------------------------------------------------------
1 | group(function() {
19 | Route::post('auth/login', 'AuthController@login');
20 | Route::group(['middleware' => 'auth:sanctum'], function () {
21 | Route::post('auth/logout', 'AuthController@logout');
22 |
23 | Route::get('/user', 'AuthController@user');
24 |
25 | // Api resource routes
26 | Route::apiResource('roles', 'RoleController')->middleware('permission:' . Acl::PERMISSION_PERMISSION_MANAGE);
27 | Route::apiResource('users', 'UserController')->middleware('permission:' . Acl::PERMISSION_USER_MANAGE);
28 | Route::apiResource('permissions', 'PermissionController')->middleware('permission:' . Acl::PERMISSION_PERMISSION_MANAGE);
29 |
30 | // Custom routes
31 | Route::group(['prefix' => 'users'], function (RouteContract $api) {
32 | $api->get('{user}/permissions', 'UserController@permissions')->middleware('permission:' . Acl::PERMISSION_PERMISSION_MANAGE);
33 | $api->put('{user}/permissions', 'UserController@updatePermissions')->middleware('permission:' .Acl::PERMISSION_PERMISSION_MANAGE);
34 | $api->get('{user}/logs', 'LogController@index');
35 | });
36 |
37 | Route::get('roles/{role}/permissions', 'RoleController@permissions')->middleware('permission:' . Acl::PERMISSION_PERMISSION_MANAGE);
38 | Route::get('requests', 'RequestController@index');
39 | });
40 | });
41 |
42 | Route::get('/orders', function () {
43 | $rowsNumber = 8;
44 | $data = [];
45 | for ($rowIndex = 0; $rowIndex < $rowsNumber; $rowIndex++) {
46 | $row = [
47 | 'order_no' => 'LARAVUE' . mt_rand(1000000, 9999999),
48 | 'price' => mt_rand(10000, 999999),
49 | 'status' => randomInArray(['success', 'pending']),
50 | ];
51 |
52 | $data[] = $row;
53 | }
54 |
55 | return responseSuccess(['items' => $data]);
56 | });
--------------------------------------------------------------------------------
/resources/js/layout/components/Sidebar/SidebarItem.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
4 |
5 | Your roles:
6 | {{ item }}
7 |
8 |
14 |
10 | {{ name }}
11 | Editor's Dashboard
12 |
13 |
15 | ![]()
16 | ![]()
17 |
18 |