Refactor UI + улучшение линтеров и форматирования кода

_build/build.php

@@ -419,7 +419,7 @@ private function snippets(): void
             foreach ($data['properties'] ?? [] as $k => $v) {
                 $properties[] = array_merge([
                     'name' => $k,
-                    'desc' => 'ms_prop_' . $k,
+                    'desc' => 'ms3_prop_' . $k,
                     'lexicon' => 'minishop3:properties',
                 ], $v);
             }

core/components/minishop3/controllers/category/update.class.php

@@ -90,6 +90,7 @@ public function loadCustomCssJs()
         $this->addLastJavascript($assetsUrl . 'js/mgr/category/update.js');
 
         // Vue Category Products Grid with VueTools dependency check
+        $this->addCss($assetsUrl . 'css/mgr/vue-dist/primeicons.min.css');
         $this->addCss($assetsUrl . 'css/mgr/vue-dist/category-products.min.css');
         $this->addVueModule($assetsUrl . 'js/mgr/vue-dist/category-products.min.js');
 

core/components/minishop3/controllers/mgr/customers.class.php

@@ -40,6 +40,7 @@ public function loadCustomCssJs()
         $config = $this->ms3->config;
         $this->addHtml('<script>Object.assign(ms3.config, ' . json_encode($config) . ');</script>');
 
+        $this->addCss($this->ms3->config['assetsUrl'] . 'css/mgr/vue-dist/primeicons.min.css');
         $this->addCss($this->ms3->config['assetsUrl'] . 'css/mgr/vue-dist/customers.min.css');
         // Vue module with VueTools dependency check
         $this->addVueModule($this->ms3->config['assetsUrl'] . 'js/mgr/vue-dist/customers.min.js');

core/components/minishop3/controllers/mgr/help.class.php

@@ -28,6 +28,7 @@ public function getLanguageTopics()
     public function loadCustomCssJs()
     {
         // Vue CSS
+        $this->addCss($this->ms3->config['assetsUrl'] . 'css/mgr/vue-dist/primeicons.min.css');
         $this->addCss($this->ms3->config['assetsUrl'] . 'css/mgr/vue-dist/help.min.css');
 
         // Vue module

core/components/minishop3/controllers/mgr/notifications.class.php

@@ -38,6 +38,7 @@ public function loadCustomCssJs()
         $config = $this->ms3->config;
         $this->addHtml('<script>Object.assign(ms3.config, ' . json_encode($config) . ');</script>');
 
+        $this->addCss($this->ms3->config['assetsUrl'] . 'css/mgr/vue-dist/primeicons.min.css');
         $this->addCss($this->ms3->config['assetsUrl'] . 'css/mgr/vue-dist/notifications.min.css');
         // Vue module with VueTools dependency check
         $this->addVueModule($this->ms3->config['assetsUrl'] . 'js/mgr/vue-dist/notifications.min.js');

core/components/minishop3/controllers/mgr/order.class.php

@@ -41,6 +41,7 @@ public function loadCustomCssJs()
 
         $this->addHtml('<script>Object.assign(ms3.config, ' . json_encode($config) . ');</script>');
 
+        $this->addCss($this->ms3->config['assetsUrl'] . 'css/mgr/vue-dist/primeicons.min.css');
         $this->addCss($this->ms3->config['assetsUrl'] . 'css/mgr/vue-dist/order.min.css');
         // Vue module with VueTools dependency check
         $this->addVueModule($this->ms3->config['assetsUrl'] . 'js/mgr/vue-dist/order.min.js');

core/components/minishop3/controllers/mgr/orders.class.php

@@ -40,6 +40,7 @@ public function loadCustomCssJs()
         $config = $this->ms3->config;
         $this->addHtml('<script>Object.assign(ms3.config, ' . json_encode($config) . ');</script>');
 
+        $this->addCss($this->ms3->config['assetsUrl'] . 'css/mgr/vue-dist/primeicons.min.css');
         $this->addCss($this->ms3->config['assetsUrl'] . 'css/mgr/vue-dist/orders.min.css');
         // Vue module with VueTools dependency check
         $this->addVueModule($this->ms3->config['assetsUrl'] . 'js/mgr/vue-dist/orders.min.js');

core/components/minishop3/controllers/mgr/settings.class.php

@@ -38,6 +38,8 @@ public function loadCustomCssJs()
         $this->addJavascript($this->ms3->config['jsUrl'] . 'mgr/misc/ms3.utils.js');
         $this->addJavascript($this->ms3->config['jsUrl'] . 'mgr/misc/ms3.combo.js');
 
+        // Vue shared CSS (variables + PrimeIcons)
+        $this->addCss($this->ms3->config['assetsUrl'] . 'css/mgr/vue-dist/primeicons.min.css');
         // Vue shared components CSS
         $this->addCss($this->ms3->config['assetsUrl'] . 'css/mgr/vue-dist/FileBrowser.min.css');
 

core/components/minishop3/controllers/product/update.class.php

@@ -62,6 +62,7 @@ public function loadCustomCssJs()
         $this->addLastJavascript($assetsUrl . 'js/mgr/product/update.js');
 
         // Product Tabs Vue module (contains Properties, Gallery, Categories, Links, Options tabs)
+        $this->addCss($assetsUrl . 'css/mgr/vue-dist/primeicons.min.css');
         $this->addCss($assetsUrl . 'css/mgr/vue-dist/product-tabs.min.css');
         $this->addVueModule($assetsUrl . 'js/mgr/vue-dist/product-tabs.min.js');
 

vueManager/.prettierignore

@@ -0,0 +1,6 @@
+node_modules
+dist
+coverage
+*.min.js
+*.min.css
+package-lock.json

vueManager/.prettierrc

@@ -0,0 +1,12 @@
+{
+  "semi": false,
+  "singleQuote": true,
+  "trailingComma": "es5",
+  "printWidth": 100,
+  "tabWidth": 2,
+  "useTabs": false,
+  "endOfLine": "lf",
+  "bracketSpacing": true,
+  "arrowParens": "avoid",
+  "vueIndentScriptAndStyle": false
+}

vueManager/.stylelintrc.json

@@ -0,0 +1,10 @@
+{
+  "extends": ["stylelint-config-standard-scss"],
+  "rules": {
+    "no-empty-source": null,
+    "block-no-empty": null,
+    "scss/at-rule-no-unknown": null,
+    "scss/double-slash-comment-whitespace-inside": null,
+    "selector-class-pattern": null
+  }
+}

vueManager/eslint.config.js

@@ -1,10 +1,15 @@
 import js from '@eslint/js'
+import eslintConfigPrettier from 'eslint-config-prettier'
+import simpleImportSort from 'eslint-plugin-simple-import-sort'
 import pluginVue from 'eslint-plugin-vue'
 
 export default [
   {
     name: 'app/files-to-lint',
     files: ['**/*.{js,mjs,jsx,vue}'],
+    plugins: {
+      'simple-import-sort': simpleImportSort,
+    },
     languageOptions: {
       globals: {
         Ext: 'readonly',
@@ -15,6 +20,63 @@ export default [
     rules: {
       'quotes': ['error', 'single', { avoidEscape: true }],
       'comma-dangle': ['error', 'always-multiline'],
+      'simple-import-sort/imports': 'error',
+      'simple-import-sort/exports': 'error',
+      'no-console': ['warn', { allow: ['warn', 'error'] }],
+      'vue/multi-word-component-names': 'warn', // Warn about single-word component names
+      'vue/attributes-order': ['warn', {
+        order: [
+          'DEFINITION',
+          'LIST_RENDERING',
+          'CONDITIONALS',
+          'RENDER_MODIFIERS',
+          'GLOBAL',
+          ['UNIQUE', 'SLOT'],
+          'TWO_WAY_BINDING',
+          'OTHER_DIRECTIVES',
+          'OTHER_ATTR',
+          'EVENTS',
+          'CONTENT',
+        ],
+        alphabetical: false,
+      }],
+      'vue/order-in-components': ['warn', {
+        order: [
+          'el',
+          'name',
+          'key',
+          'parent',
+          'functional',
+          ['delimiters', 'comments'],
+          ['components', 'directives', 'filters'],
+          'extends',
+          'mixins',
+          ['provide', 'inject'],
+          'ROUTER_GUARDS',
+          'layout',
+          'middleware',
+          'validate',
+          'scrollToTop',
+          'transition',
+          'loading',
+          'inheritAttrs',
+          'model',
+          ['props', 'propsData'],
+          'emits',
+          'setup',
+          'asyncData',
+          'data',
+          'fetch',
+          'head',
+          'computed',
+          'watch',
+          'watchQuery',
+          'LIFECYCLE_HOOKS',
+          'methods',
+          ['template', 'render'],
+          'renderError',
+        ],
+      }],
     },
   },
 
@@ -24,5 +86,6 @@ export default [
   },
 
   js.configs.recommended,
-  ...pluginVue.configs['flat/essential'],
+  ...pluginVue.configs['flat/strongly-recommended'],
+  eslintConfigPrettier,
 ]