Refactor views structure

src/components/Sidebar.vue

@@ -33,7 +33,7 @@ export default {
     };
   },
   mounted() {
-    let menuRoutes = {
+    this.menuRoutes = {
       'General': {
         'home': 'Home',
         'explain_crontab': 'Explain crontab',
@@ -78,8 +78,6 @@ export default {
         'sql_split_in': 'SQL split IN',
       },
     };
-
-    this.menuRoutes = menuRoutes;
   }
 }
 </script>

src/router/index.js

@@ -9,42 +9,47 @@ const router = createRouter({
 		{
 			path: '/',
 			name: 'home',
-			component: () => import('../views/HomeView.vue'),
+			component: () => import('../views/general/HomeView.vue'),
 		},
 		{
 			path: '/explain_crontab',
 			name: 'explain_crontab',
-			component: () => import('../views/ExplainCrontab.vue'),
+			component: () => import('../views/general/ExplainCrontab.vue'),
 		},
 		{
 			path: '/table_to_markdown_table',
 			name: 'table_to_markdown_table',
-			component: () => import('../views/TableToMarkdownTable.vue'),
+			component: () => import('../views/general/TableToMarkdownTable.vue'),
 		},
 		{
 			path: '/table_to_mediawiki_table',
 			name: 'table_to_mediawiki_table',
-			component: () => import('../views/TableToMediawikiTable.vue'),
+			component: () => import('../views/general/TableToMediawikiTable.vue'),
 		},
 		{
 			path: '/dummy_image',
 			name: 'dummy_image',
-			component: () => import('../views/DummyImage.vue'),
+			component: () => import('../views/general/DummyImage.vue'),
 		},
 		{
 			path: '/humans_txt',
 			name: 'humans_txt',
-			component: () => import('../views/HumansTxt.vue'),
+			component: () => import('../views/general/HumansTxt.vue'),
 		},
 		{
 			path: '/qr_code',
 			name: 'qr_code',
-			component: () => import('../views/QRCode.vue'),
+			component: () => import('../views/general/QRCode.vue'),
 		},
 		{
 			path: '/unix_timestamp',
 			name: 'unix_timestamp',
-			component: () => import('../views/UnixTimestamp.vue'),
+			component: () => import('../views/general/UnixTimestamp.vue'),
+		},
+		{
+			path: '/file_base64_encode_decode',
+			name: 'file_base64_encode_decode',
+			component: () => import('../views/general/FileBase64EncodeDecode.vue'),
 		},
 
 		/**
@@ -53,72 +58,71 @@ const router = createRouter({
 		{
 			path: '/str_length',
 			name: 'str_length',
-			component: () => import('../views/StrLength.vue'),
+			component: () => import('../views/strings/Length.vue'),
 		},
 		{
 			path: '/str_sort_lines',
 			name: 'str_sort_lines',
-			component: () => import('../views/StrSortLines.vue'),
+			component: () => import('../views/strings/SortLines.vue'),
 		},
 		{
 			path: '/str_to_lower_upper',
 			name: 'str_to_lower_upper',
-			component: () => import('../views/StrToLowerUppper.vue'),
+			component: () => import('../views/strings/ToLowerUppper.vue'),
 		},
 		{
 			path: '/str_remove_duplicate_lines',
 			name: 'str_remove_duplicate_lines',
-			component: () => import('../views/StrRemoveDuplicateLines.vue'),
+			component: () => import('../views/strings/RemoveDuplicateLines.vue'),
 		},
 		{
 			path: '/str_pad',
 			name: 'str_pad',
-			component: () => import('../views/StrPad.vue'),
-		},
-		{
-			path: '/str_to_php_array',
-			name: 'str_to_php_array',
-			component: () => import('../views/StrToPHPArray.vue'),
+			component: () => import('../views/strings/Pad.vue'),
 		},
 		{
 			path: '/str_numeronym',
 			name: 'str_numeronym',
-			component: () => import('../views/StrNumeronym.vue'),
+			component: () => import('../views/strings/Numeronym.vue'),
 		},
 		{
 			path: '/str_to_nato_alphabet',
 			name: 'str_to_nato_alphabet',
-			component: () => import('../views/StrToNATOAlphabet.vue'),
-		},
-		{
-			path: '/php_array_to_json',
-			name: 'php_array_to_json',
-			component: () => import('../views/PHPArrayToJson.vue'),
-		},
-		{
-			path: '/php_serialize',
-			name: 'php_serialize',
-			component: () => import('../views/PHPSerialize.vue'),
-		},
-		{
-			path: '/fix_ru_en_keyboard',
-			name: 'fix_ru_en_keyboard',
-			component: () => import('../views/FixRuEnKeyboard.vue'),
+			component: () => import('../views/strings/NATOAlphabet.vue'),
 		},
 		{
 			path: '/url_encode_decode',
 			name: 'url_encode_decode',
-			component: () => import('../views/UrlEncodeDecode.vue'),
+			component: () => import('../views/strings/UrlEncodeDecode.vue'),
 		},
 		{
 			path: '/url_query_viewer',
 			name: 'url_query_viewer',
-			component: () => import('../views/UrlQueryViewer.vue'),
+			component: () => import('../views/strings/UrlQueryViewer.vue'),
 		},
 		{
-			path: '/file_base64_encode_decode',
-			name: 'file_base64_encode_decode',
-			component: () => import('../views/FileBase64EncodeDecode.vue'),
+			path: '/fix_ru_en_keyboard',
+			name: 'fix_ru_en_keyboard',
+			component: () => import('../views/strings/FixRuEnKeyboard.vue'),
+		},
+
+		/**
+		 * PHP
+		 */
+		{
+			path: '/str_to_php_array',
+			name: 'str_to_php_array',
+			component: () => import('../views/php/StrToPHPArray.vue'),
+		},
+		{
+			path: '/php_array_to_json',
+			name: 'php_array_to_json',
+			component: () => import('../views/php/PHPArrayToJson.vue'),
+		},
+		{
+			path: '/php_serialize',
+			name: 'php_serialize',
+			component: () => import('../views/php/Serialize.vue'),
 		},
 
 		/**
@@ -127,12 +131,12 @@ const router = createRouter({
 		{
 			path: '/json_formatter',
 			name: 'json_formatter',
-			component: () => import('../views/JSONFormatter.vue'),
+			component: () => import('../views/json/JSONFormatter.vue'),
 		},
 		{
 			path: '/json_minifier',
 			name: 'json_minifier',
-			component: () => import('../views/JSONMinifier.vue'),
+			component: () => import('../views/json/JSONMinifier.vue'),
 		},
 
 		/**
@@ -141,12 +145,12 @@ const router = createRouter({
 		{
 			path: '/go_json_to_struct',
 			name: 'go_json_to_struct',
-			component: () => import('../views/GoJSONToStruct.vue'),
+			component: () => import('../views/go/JSONToStruct.vue'),
 		},
 		{
 			path: '/sql_tables_to_struct',
 			name: 'sql_tables_to_struct',
-			component: () => import('../views/GoSQLTablesToStruct.vue'),
+			component: () => import('../views/go/SQLTablesToStruct.vue'),
 		},
 
 		/**
@@ -155,7 +159,7 @@ const router = createRouter({
 		{
 			path: '/docker_rename_volume',
 			name: 'docker_rename_volume',
-			component: () => import('../views/DockerRenameVolume.vue'),
+			component: () => import('../views/docker/RenameVolume.vue'),
 		},
 
 		/**
@@ -164,12 +168,12 @@ const router = createRouter({
 		{
 			path: '/sql_split_in',
 			name: 'sql_split_in',
-			component: () => import('../views/SQLSplitInView.vue'),
+			component: () => import('../views/sql/SplitInView.vue'),
 		},
 		{
 			path: '/sql_formatter',
 			name: 'sql_formatter',
-			component: () => import('../views/SQLFormatter.vue'),
+			component: () => import('../views/sql/Formatter.vue'),
 		},
 	],
 })

src/views/general/QRCode.vue

@@ -93,7 +93,7 @@
 
 <script>
 import QRCode from "easyqrcodejs";
-import { unproxy } from "../utils/unproxy";
+import { unproxy } from "../../utils/unproxy";
 
 export default {
   data() {

src/views/php/PHPArrayToJson.vue

@@ -24,7 +24,7 @@
 
 <script>
 import axios from "axios";
-import { config } from "../../config";
+import { config } from "../../../config";
 import MonacoEditor from "@/components/MonacoEditor.vue";
 
 export default {

src/views/php/Serialize.vue

@@ -28,7 +28,7 @@
 
 <script>
 import axios from "axios";
-import { config } from "../../config";
+import { config } from "../../../config";
 import MonacoEditor from "@/components/MonacoEditor.vue";
 
 export default {

src/views/php/StrToPHPArray.vue

@@ -28,7 +28,7 @@
 
 <script>
 import axios from "axios";
-import { config } from "../../config";
+import { config } from "../../../config";
 import MonacoEditor from "@/components/MonacoEditor.vue";
 
 export default {

src/views/strings/NATOAlphabet.vue

@@ -17,7 +17,7 @@
 
 <script>
 import axios from "axios";
-import { config } from "../../config";
+import { config } from "../../../config";
 import MonacoEditor from "@/components/MonacoEditor.vue";
 
 export default {

src/views/strings/Numeronym.vue

@@ -17,7 +17,7 @@
 
 <script>
 import MonacoEditor from "@/components/MonacoEditor.vue";
-import { unproxy } from "../utils/unproxy";
+import { unproxy } from "../../utils/unproxy";
 
 export default {
   components: {