diff --git a/screen-vue/package-lock.json b/screen-vue/package-lock.json
index fd7761e..c67d205 100644
--- a/screen-vue/package-lock.json
+++ b/screen-vue/package-lock.json
@@ -13,6 +13,7 @@
         "element-plus": "^2.13.2",
         "file-saver": "^2.0.5",
         "pinia": "^3.0.4",
+        "sql-formatter": "^15.7.2",
         "v-scale-screen": "^2.3.0",
         "vue": "^3.5.28",
         "vue-router": "^5.0.3",
@@ -58,7 +59,6 @@
       "integrity": "sha512-CGOfOJqWjg2qW/Mb6zNsDm+u5vFQ8DxXfbM09z69p5Z6+mE1ikP2jUXw+j42Pf1XTYED2Rni5f95npYeuwMDQA==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.29.0",
         "@babel/generator": "^7.29.0",
@@ -1405,7 +1405,6 @@
       "resolved": "https://registry.npmmirror.com/@types/lodash-es/-/lodash-es-4.17.12.tgz",
       "integrity": "sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@types/lodash": "*"
       }
@@ -1802,6 +1801,12 @@
         "node": ">=14"
       }
     },
+    "node_modules/argparse": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
+      "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
+      "license": "Python-2.0"
+    },
     "node_modules/ast-kit": {
       "version": "2.2.0",
       "resolved": "https://registry.npmmirror.com/ast-kit/-/ast-kit-2.2.0.tgz",
@@ -1899,7 +1904,6 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.9.0",
         "caniuse-lite": "^1.0.30001759",
@@ -2013,6 +2017,12 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/commander": {
+      "version": "2.20.3",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
+      "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
+      "license": "MIT"
+    },
     "node_modules/confbox": {
       "version": "0.2.4",
       "resolved": "https://registry.npmmirror.com/confbox/-/confbox-0.2.4.tgz",
@@ -2135,6 +2145,12 @@
         "node": ">=0.4.0"
       }
     },
+    "node_modules/discontinuous-range": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/discontinuous-range/-/discontinuous-range-1.0.0.tgz",
+      "integrity": "sha512-c68LpLbO+7kP/b1Hr1qs8/BJ09F5khZGTxqxZuhzxpmwJKOgRFHJWIb9/KmqnqHhLdO55aOxFH/EGBvUQbL/RQ==",
+      "license": "MIT"
+    },
     "node_modules/dunder-proto": {
       "version": "1.0.1",
       "resolved": "https://registry.npmmirror.com/dunder-proto/-/dunder-proto-1.0.1.tgz",
@@ -2640,15 +2656,13 @@
       "version": "4.17.23",
       "resolved": "https://registry.npmmirror.com/lodash/-/lodash-4.17.23.tgz",
       "integrity": "sha512-LgVTMpQtIopCi79SJeDiP0TfWi5CNEc/L/aRdTh3yIvmZXTnheWpKjSZhnvMl8iXbC1tFg9gdHHDMLoV7CnG+w==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/lodash-es": {
       "version": "4.17.23",
       "resolved": "https://registry.npmmirror.com/lodash-es/-/lodash-es-4.17.23.tgz",
       "integrity": "sha512-kVI48u3PZr38HdYz98UmfPnXl2DXrpdctLrFLCd3kOx1xUkOmpFPx7gCWWM5MPkL/fD8zb+Ph0QzjGFs4+hHWg==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/lodash-unified": {
       "version": "1.0.3",
@@ -2766,6 +2780,12 @@
         "pathe": "^2.0.1"
       }
     },
+    "node_modules/moo": {
+      "version": "0.5.3",
+      "resolved": "https://registry.npmjs.org/moo/-/moo-0.5.3.tgz",
+      "integrity": "sha512-m2fmM2dDm7GZQsY7KK2cme8agi+AAljILjQnof7p1ZMDe6dQ4bdnSMx0cPppudoeNv5hEFQirN6u+O4fDE0IWA==",
+      "license": "BSD-3-Clause"
+    },
     "node_modules/mrmime": {
       "version": "2.0.1",
       "resolved": "https://registry.npmmirror.com/mrmime/-/mrmime-2.0.1.tgz",
@@ -2807,6 +2827,28 @@
         "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
       }
     },
+    "node_modules/nearley": {
+      "version": "2.20.1",
+      "resolved": "https://registry.npmjs.org/nearley/-/nearley-2.20.1.tgz",
+      "integrity": "sha512-+Mc8UaAebFzgV+KpI5n7DasuuQCHA89dmwm7JXw3TV43ukfNQ9DnBH3Mdb2g/I4Fdxc26pwimBWvjIw0UAILSQ==",
+      "license": "MIT",
+      "dependencies": {
+        "commander": "^2.19.0",
+        "moo": "^0.5.0",
+        "railroad-diagrams": "^1.0.0",
+        "randexp": "0.4.6"
+      },
+      "bin": {
+        "nearley-railroad": "bin/nearley-railroad.js",
+        "nearley-test": "bin/nearley-test.js",
+        "nearley-unparse": "bin/nearley-unparse.js",
+        "nearleyc": "bin/nearleyc.js"
+      },
+      "funding": {
+        "type": "individual",
+        "url": "https://nearley.js.org/#give-to-nearley"
+      }
+    },
     "node_modules/node-releases": {
       "version": "2.0.27",
       "resolved": "https://registry.npmmirror.com/node-releases/-/node-releases-2.0.27.tgz",
@@ -2997,6 +3039,25 @@
       ],
       "license": "MIT"
     },
+    "node_modules/railroad-diagrams": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/railroad-diagrams/-/railroad-diagrams-1.0.0.tgz",
+      "integrity": "sha512-cz93DjNeLY0idrCNOH6PviZGRN9GJhsdm9hpn1YCS879fj4W+x5IFJhhkRZcwVgMmFF7R82UA/7Oh+R8lLZg6A==",
+      "license": "CC0-1.0"
+    },
+    "node_modules/randexp": {
+      "version": "0.4.6",
+      "resolved": "https://registry.npmjs.org/randexp/-/randexp-0.4.6.tgz",
+      "integrity": "sha512-80WNmd9DA0tmZrw9qQa62GPPWfuXJknrmVmLcxvq4uZBdYqb1wYoKTmnlGUchvVWe0XiLupYkBoXVOxz3C8DYQ==",
+      "license": "MIT",
+      "dependencies": {
+        "discontinuous-range": "1.0.0",
+        "ret": "~0.1.10"
+      },
+      "engines": {
+        "node": ">=0.12"
+      }
+    },
     "node_modules/readdirp": {
       "version": "5.0.0",
       "resolved": "https://registry.npmmirror.com/readdirp/-/readdirp-5.0.0.tgz",
@@ -3010,6 +3071,15 @@
         "url": "https://paulmillr.com/funding/"
       }
     },
+    "node_modules/ret": {
+      "version": "0.1.15",
+      "resolved": "https://registry.npmjs.org/ret/-/ret-0.1.15.tgz",
+      "integrity": "sha512-TTlYpa+OL+vMMNG24xSlQGEJ3B/RzEfUlLct7b5G/ytav+wPrplCpVMFuwzXbkecJrb6IYo1iFb0S9v37754mg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.12"
+      }
+    },
     "node_modules/rfdc": {
       "version": "1.4.1",
       "resolved": "https://registry.npmmirror.com/rfdc/-/rfdc-1.4.1.tgz",
@@ -3123,6 +3193,19 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/sql-formatter": {
+      "version": "15.7.2",
+      "resolved": "https://registry.npmjs.org/sql-formatter/-/sql-formatter-15.7.2.tgz",
+      "integrity": "sha512-b0BGoM81KFRVSpZFwPpIPU5gng4YD8DI/taLD96NXCFRf5af3FzSE4aSwjKmxcyTmf/MfPu91j75883nRrWDBw==",
+      "license": "MIT",
+      "dependencies": {
+        "argparse": "^2.0.1",
+        "nearley": "^2.20.1"
+      },
+      "bin": {
+        "sql-formatter": "bin/sql-formatter-cli.cjs"
+      }
+    },
     "node_modules/ssf": {
       "version": "0.11.2",
       "resolved": "https://registry.npmmirror.com/ssf/-/ssf-0.11.2.tgz",
@@ -3264,7 +3347,6 @@
       "integrity": "sha512-w+N7Hifpc3gRjZ63vYBXA56dvvRlNWRczTdmCBBa+CotUzAPf5b7YMdMR/8CQoeYE5LX3W4wj6RYTgonm1b9DA==",
       "dev": true,
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "esbuild": "^0.27.0",
         "fdir": "^6.5.0",
@@ -3443,7 +3525,6 @@
       "resolved": "https://registry.npmmirror.com/vue/-/vue-3.5.28.tgz",
       "integrity": "sha512-BRdrNfeoccSoIZeIhyPBfvWSLFP4q8J3u8Ju8Ug5vu3LdD+yTM13Sg4sKtljxozbnuMu1NB1X5HBHRYUzFocKg==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@vue/compiler-dom": "3.5.28",
         "@vue/compiler-sfc": "3.5.28",
diff --git a/screen-vue/package.json b/screen-vue/package.json
index dfd914e..58c845c 100644
--- a/screen-vue/package.json
+++ b/screen-vue/package.json
@@ -14,6 +14,7 @@
     "element-plus": "^2.13.2",
     "file-saver": "^2.0.5",
     "pinia": "^3.0.4",
+    "sql-formatter": "^15.7.2",
     "v-scale-screen": "^2.3.0",
     "vue": "^3.5.28",
     "vue-router": "^5.0.3",
diff --git a/screen-vue/src/views/screen/Erp/components/ChartV01.vue b/screen-vue/src/views/screen/Erp/components/ChartV01.vue
index 5a65d01..a84ae2d 100644
--- a/screen-vue/src/views/screen/Erp/components/ChartV01.vue
+++ b/screen-vue/src/views/screen/Erp/components/ChartV01.vue
@@ -199,6 +199,8 @@ onUnmounted(() => {
   display: flex;
   flex-direction: column;
   overflow: hidden;
+  background: rgba(0, 0, 0, 0.1) url("@/assets/images/desck2.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .chart-card-header {
diff --git a/screen-vue/src/views/screen/Erp/components/ChartV02.vue b/screen-vue/src/views/screen/Erp/components/ChartV02.vue
index 099df3a..b1d2848 100644
--- a/screen-vue/src/views/screen/Erp/components/ChartV02.vue
+++ b/screen-vue/src/views/screen/Erp/components/ChartV02.vue
@@ -212,6 +212,8 @@ onUnmounted(() => {
   display: flex;
   flex-direction: column;
   overflow: hidden;
+  background: rgba(0, 0, 0, 0.1) url("@/assets/images/desck2.png") no-repeat;
+  background-size: 100% 100%;
 }
 .chart-card-header {
   height: 40px;
diff --git a/screen-vue/src/views/screen/Erp/components/ChartV03.vue b/screen-vue/src/views/screen/Erp/components/ChartV03.vue
index ab77ae4..409a837 100644
--- a/screen-vue/src/views/screen/Erp/components/ChartV03.vue
+++ b/screen-vue/src/views/screen/Erp/components/ChartV03.vue
@@ -256,6 +256,8 @@ onUnmounted(() => {
   display: flex;
   flex-direction: column;
   overflow: hidden;
+  background: rgba(0, 0, 0, 0.1) url("@/assets/images/desck2.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .chart-card-header {
diff --git a/screen-vue/src/views/screen/Erp/components/ChartV04.vue b/screen-vue/src/views/screen/Erp/components/ChartV04.vue
index 1e31c84..5db85e8 100644
--- a/screen-vue/src/views/screen/Erp/components/ChartV04.vue
+++ b/screen-vue/src/views/screen/Erp/components/ChartV04.vue
@@ -162,6 +162,8 @@ onUnmounted(() => {
   display: flex;
   flex-direction: column;
   overflow: hidden;
+  background: rgba(0, 0, 0, 0.1) url("@/assets/images/desck2.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .chart-card-header {
diff --git a/screen-vue/src/views/screen/Erp/components/ChartV05.vue b/screen-vue/src/views/screen/Erp/components/ChartV05.vue
index 89151e1..16f1037 100644
--- a/screen-vue/src/views/screen/Erp/components/ChartV05.vue
+++ b/screen-vue/src/views/screen/Erp/components/ChartV05.vue
@@ -162,6 +162,8 @@ onUnmounted(() => {
   display: flex;
   flex-direction: column;
   overflow: hidden;
+  background: rgba(0, 0, 0, 0.1) url("@/assets/images/desck2.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .chart-card-header {
diff --git a/screen-vue/src/views/screen/Erp/components/ChartV06.vue b/screen-vue/src/views/screen/Erp/components/ChartV06.vue
index d37a153..4eded73 100644
--- a/screen-vue/src/views/screen/Erp/components/ChartV06.vue
+++ b/screen-vue/src/views/screen/Erp/components/ChartV06.vue
@@ -287,6 +287,8 @@ onUnmounted(() => {
   display: flex;
   flex-direction: column;
   overflow: hidden;
+  background: rgba(0, 0, 0, 0.1) url("@/assets/images/desck2.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .chart-card-header {
diff --git a/screen-vue/src/views/screen/Erp/components/ChartV07.vue b/screen-vue/src/views/screen/Erp/components/ChartV07.vue
index 9aa6892..647a44c 100644
--- a/screen-vue/src/views/screen/Erp/components/ChartV07.vue
+++ b/screen-vue/src/views/screen/Erp/components/ChartV07.vue
@@ -170,6 +170,8 @@ onUnmounted(() => {
   display: flex;
   flex-direction: column;
   overflow: hidden;
+  background: rgba(0, 0, 0, 0.1) url("@/assets/images/desck2.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .chart-card-header {
diff --git a/screen-vue/src/views/screen/Erp/components/ChartV08.vue b/screen-vue/src/views/screen/Erp/components/ChartV08.vue
index 3178c85..7cdc719 100644
--- a/screen-vue/src/views/screen/Erp/components/ChartV08.vue
+++ b/screen-vue/src/views/screen/Erp/components/ChartV08.vue
@@ -255,6 +255,8 @@ onUnmounted(() => {
   display: flex;
   flex-direction: column;
   overflow: hidden;
+  background: rgba(0, 0, 0, 0.1) url("@/assets/images/desck2.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .chart-card-header {
diff --git a/screen-vue/src/views/screen/Erp/components/ChartV09.vue b/screen-vue/src/views/screen/Erp/components/ChartV09.vue
index 14103db..81d7f6f 100644
--- a/screen-vue/src/views/screen/Erp/components/ChartV09.vue
+++ b/screen-vue/src/views/screen/Erp/components/ChartV09.vue
@@ -376,6 +376,8 @@ onUnmounted(() => {
   display: flex;
   flex-direction: column;
   overflow: hidden;
+  background: rgba(0, 0, 0, 0.1) url("@/assets/images/desck2.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .chart-card-header {
diff --git a/screen-vue/src/views/screen/Erp/index.vue b/screen-vue/src/views/screen/Erp/index.vue
index 63ce644..8dd4358 100644
--- a/screen-vue/src/views/screen/Erp/index.vue
+++ b/screen-vue/src/views/screen/Erp/index.vue
@@ -176,6 +176,7 @@ watch(
 
 .full-card {
   width: 100%;
+  
 }
 
 .erp-card:hover {