diff --git a/app.platform/build.gradle b/app.platform/build.gradle
index 6305bf8a..af883441 100644
--- a/app.platform/build.gradle
+++ b/app.platform/build.gradle
@@ -15,20 +15,20 @@ dependencies {
 		project(":io.sc.platform.developer"),
 		project(":io.sc.platform.security.loginform"),
 
-//		project(":io.sc.engine.mv"),
-//		project(":io.sc.engine.mv.frontend"),
-//		project(":io.sc.engine.mv.sample"),
-//
-//		project(":io.sc.engine.rule.client"),
-//		project(":io.sc.engine.rule.client.spring"),
-//		project(":io.sc.engine.rule.core"),
-//		project(":io.sc.engine.rule.server"),
-//		project(":io.sc.engine.rule.sample"),
-//
-//		project(":erm"),
+		project(":io.sc.engine.mv"),
+		project(":io.sc.engine.mv.frontend"),
+		project(":io.sc.engine.mv.sample"),
 
-//		project(":erm"),
-//		project(":erm.frontend"),
+		project(":io.sc.engine.rule.client"),
+		project(":io.sc.engine.rule.client.spring"),
+		project(":io.sc.engine.rule.core"),
+		project(":io.sc.engine.rule.server"),
+		project(":io.sc.engine.rule.sample"),
+
+		project(":erm"),
+
+		project(":erm"),
+		project(":erm.frontend"),
 
 //		project(":io.sc.platform.scheduler.manager"),
 	)
diff --git a/erm.frontend/package.json b/erm.frontend/package.json
index fc2d3e8e..7f113a71 100644
--- a/erm.frontend/package.json
+++ b/erm.frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "erm.frontend",
-  "version": "8.1.37",
+  "version": "8.1.38",
   "description": "",
   "private": false,
   "keywords": [],
@@ -23,81 +23,81 @@
     "access": "public"
   },
   "devDependencies": {
-    "@babel/core": "7.23.7",
-    "@babel/preset-env": "7.23.7",
-    "@babel/preset-typescript": "7.23.3",
-    "@babel/plugin-transform-class-properties": "7.23.3",
-    "@babel/plugin-transform-object-rest-spread": "7.23.4",
-    "@quasar/app-webpack": "3.12.1",
-    "@quasar/cli": "2.3.0",
+    "@babel/core": "7.24.4",
+    "@babel/preset-env": "7.24.4",
+    "@babel/preset-typescript": "7.24.1",
+    "@babel/plugin-transform-class-properties": "7.24.1",
+    "@babel/plugin-transform-object-rest-spread": "7.24.1",
+    "@quasar/app-webpack": "3.12.5",
+    "@quasar/cli": "2.4.0",
     "@types/mockjs": "1.0.10",
-    "@types/node": "20.10.6",
-    "@typescript-eslint/eslint-plugin": "6.17.0",
-    "@typescript-eslint/parser": "6.17.0",
-    "@vue/compiler-sfc": "3.4.3",
+    "@types/node": "20.12.7",
+    "@typescript-eslint/eslint-plugin": "7.7.1",
+    "@typescript-eslint/parser": "7.7.1",
+    "@vue/compiler-sfc": "3.4.24",
     "@webpack-cli/serve": "2.0.5",
-    "autoprefixer": "10.4.16",
+    "autoprefixer": "10.4.19",
     "babel-loader": "9.1.3",
     "clean-webpack-plugin": "4.0.0",
-    "copy-webpack-plugin": "11.0.0",
+    "copy-webpack-plugin": "12.0.2",
     "cross-env": "7.0.3",
-    "css-loader": "6.8.1",
+    "css-loader": "7.1.1",
     "eslint": "8.56.0",
     "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-prettier": "5.1.2",
-    "eslint-plugin-vue": "9.19.2",
-    "eslint-webpack-plugin": "4.0.1",
+    "eslint-plugin-prettier": "5.1.3",
+    "eslint-plugin-vue": "9.25.0",
+    "eslint-webpack-plugin": "4.1.0",
     "html-webpack-plugin": "5.6.0",
     "json5": "2.2.3",
-    "mini-css-extract-plugin": "2.7.6",
-    "nodemon": "3.0.2",
-    "postcss": "8.4.32",
-    "postcss-import": "16.0.0",
-    "postcss-loader": "7.3.4",
-    "postcss-preset-env": "9.3.0",
-    "prettier": "3.1.1",
-    "sass": "1.69.7",
-    "sass-loader": "13.3.3",
-    "typescript": "5.3.3",
+    "mini-css-extract-plugin": "2.9.0",
+    "nodemon": "3.1.0",
+    "postcss": "8.4.38",
+    "postcss-import": "16.1.0",
+    "postcss-loader": "8.1.1",
+    "postcss-preset-env": "9.5.9",
+    "prettier": "3.2.5",
+    "sass": "1.75.0",
+    "sass-loader": "14.2.1",
+    "typescript": "5.4.5",
     "vue-loader": "17.4.2",
-    "webpack": "5.89.0",
-    "webpack-bundle-analyzer": "4.10.1",
+    "webpack": "5.91.0",
+    "webpack-bundle-analyzer": "4.10.2",
     "webpack-cli": "5.1.4",
-    "webpack-dev-server": "4.15.1",
+    "webpack-dev-server": "5.0.4",
     "webpack-merge": "5.10.0",
-    "@vue/babel-plugin-jsx": "1.1.5"
+    "@vue/babel-plugin-jsx": "1.2.2"
   },
   "dependencies": {
-    "@codemirror/autocomplete": "6.11.1",
-    "@codemirror/commands": "6.3.3",
-    "@codemirror/lang-html": "6.4.7",
+    "@codemirror/autocomplete": "6.16.0",
+    "@codemirror/commands": "6.5.0",
+    "@codemirror/lang-html": "6.4.9",
     "@codemirror/lang-java": "6.0.1",
-    "@codemirror/lang-javascript": "6.2.1",
+    "@codemirror/lang-javascript": "6.2.2",
     "@codemirror/lang-json": "6.0.1",
-    "@codemirror/lang-sql": "6.5.4",
-    "@codemirror/lang-xml": "6.0.2",
-    "@codemirror/language": "6.10.0",
-    "@codemirror/search": "6.5.5",
-    "@codemirror/state": "6.4.0",
-    "@codemirror/view": "6.23.0",
-    "@maxgraph/core": "0.9.0",
-    "@quasar/extras": "1.16.9",
-    "@vueuse/core": "10.7.1",
-    "axios": "1.6.3",
+    "@codemirror/lang-sql": "6.6.3",
+    "@codemirror/lang-xml": "6.1.0",
+    "@codemirror/language": "6.10.1",
+    "@codemirror/search": "6.5.6",
+    "@codemirror/state": "6.4.1",
+    "@codemirror/view": "6.26.3",
+    "@maxgraph/core": "0.10.0",
+    "@quasar/extras": "1.16.11",
+    "@vueuse/core": "10.9.0",
+    "axios": "1.6.8",
     "codemirror": "6.0.1",
     "dayjs": "1.11.10",
-    "echarts": "5.4.3",
+    "echarts": "5.5.0",
     "exceljs": "4.4.0",
     "file-saver": "2.0.5",
     "luckyexcel": "1.0.1",
     "mockjs": "1.1.0",
     "pinia": "2.1.7",
-    "platform-core": "8.1.182",
-    "quasar": "2.14.5",
-    "tailwindcss": "3.4.0",
-    "vue": "3.4.3",
+    "platform-core": "8.1.189",
+    "quasar": "2.15.3",
+    "tailwindcss": "3.4.3",
+    "vue": "3.4.24",
     "vue-dompurify-html": "5.0.1",
-    "vue-i18n": "9.8.0",
-    "vue-router": "4.2.5"
+    "vue-i18n": "9.13.1",
+    "vue-router": "4.3.2"
   }
 }
\ No newline at end of file
diff --git a/erm.frontend/src/views/appetite/cross-validate/CrossValidate.vue b/erm.frontend/src/views/appetite/cross-validate/CrossValidate.vue
index 1ca19efd..abc2786e 100644
--- a/erm.frontend/src/views/appetite/cross-validate/CrossValidate.vue
+++ b/erm.frontend/src/views/appetite/cross-validate/CrossValidate.vue
@@ -1,12 +1,11 @@
 <template>
-  <div>
+  <div style="height: 100%">
     <w-grid
       ref="gridRef"
       :title="$t('erm.appetite.crossValidator.grid.title')"
       :config-button="true"
       selection="multiple"
       :checkbox-selection="true"
-      :sticky-num="2"
       :data-url="Environment.apiContextPath('/api/erm/appetite/crossValidate')"
       :query-form-cols-num="4"
       :query-form-fields="[
diff --git a/erm.frontend/src/views/appetite/spread/Spread.vue b/erm.frontend/src/views/appetite/spread/Spread.vue
index be6a2799..e7328c50 100644
--- a/erm.frontend/src/views/appetite/spread/Spread.vue
+++ b/erm.frontend/src/views/appetite/spread/Spread.vue
@@ -1,12 +1,11 @@
 <template>
-  <div>
+  <div style="height: 100%">
     <w-grid
       ref="gridRef"
       :title="$t('erm.appetite.spread.grid.title')"
       :config-button="true"
       selection="multiple"
       :checkbox-selection="true"
-      :sticky-num="2"
       :data-url="Environment.apiContextPath('/api/erm/appetite/spread')"
       :query-form-cols-num="4"
       :query-form-fields="[
@@ -111,14 +110,15 @@ const crossValidateOptionsRef = ref([]);
 
 axios.get(Environment.apiContextPath('/api/erm/appetite/crossValidate?pageable=false')).then((response) => {
   const items = response?.data?.content;
+  const crossValidateOptions = [];
   if (items) {
-    crossValidateOptionsRef.value.splice(0, crossValidateOptionsRef.value.length);
     for (const item of items) {
-      crossValidateOptionsRef.value.push({
+      crossValidateOptions.push({
         value: item.id,
         label: item.name + '(' + item.code + ')',
       });
     }
   }
+  crossValidateOptionsRef.value = crossValidateOptions;
 });
 </script>
diff --git a/erm.frontend/src/views/appetite/spread/SpreadIndustry.vue b/erm.frontend/src/views/appetite/spread/SpreadIndustry.vue
index 061bf238..cc41b39c 100644
--- a/erm.frontend/src/views/appetite/spread/SpreadIndustry.vue
+++ b/erm.frontend/src/views/appetite/spread/SpreadIndustry.vue
@@ -79,14 +79,15 @@ const industryOptionsRef = ref([]);
 let industryMap = {};
 
 await axios.get(Environment.apiContextPath('/api/standard/industry/level1')).then((response) => {
-  industryOptionsRef.value.splice(0, industryOptionsRef.value.length);
+  const industryOptions = [];
   const items = response.data;
   if (items && items.length > 0) {
     industryMap = {};
     for (const item of items) {
-      industryOptionsRef.value.push({ label: item.code + '. ' + item.name, value: item.code });
+      industryOptions.push({ label: item.code + '. ' + item.name, value: item.code });
       industryMap[item.code] = item.code + '. ' + item.name;
     }
   }
+  industryOptionsRef.value = industryOptions;
 });
 </script>
diff --git a/erm.frontend/src/views/appetite/spread/SpreadShareholder.vue b/erm.frontend/src/views/appetite/spread/SpreadShareholder.vue
index dbd62dbb..5bd53e1f 100644
--- a/erm.frontend/src/views/appetite/spread/SpreadShareholder.vue
+++ b/erm.frontend/src/views/appetite/spread/SpreadShareholder.vue
@@ -78,11 +78,12 @@ const DICTIONARY_MAP = await DictionaryTools.fetch(['INDICATOR_CATEGORY', 'INDIC
 const StakeHolderEnums = await EnumTools.fetch('erm.api.enums.StakeHolder');
 await axios.get(Environment.apiContextPath('/api/erm/kpi/indicator?pageable=false')).then((response) => {
   const items = response?.data?.content;
-  indicatorListRef.value.splice(0, indicatorListRef.value.length);
+  const indicatorList = [];
   if (items && items.length > 0) {
     for (const item of items) {
-      indicatorListRef.value.push({ value: item.id, label: item.code + ' : ' + item.name });
+      indicatorList.push({ value: item.id, label: item.code + ' : ' + item.name });
     }
   }
+  indicatorListRef.value = indicatorList;
 });
 </script>
diff --git a/erm.frontend/src/views/appetite/spread/SreadCoreIndicator.vue b/erm.frontend/src/views/appetite/spread/SreadCoreIndicator.vue
index 8af181c7..75d1b5c9 100644
--- a/erm.frontend/src/views/appetite/spread/SreadCoreIndicator.vue
+++ b/erm.frontend/src/views/appetite/spread/SreadCoreIndicator.vue
@@ -71,11 +71,12 @@ const indicatorListRef = ref([]);
 const DICTIONARY_MAP = await DictionaryTools.fetch(['INDICATOR_CATEGORY', 'INDICATOR_UNIT']);
 await axios.get(Environment.apiContextPath('/api/erm/kpi/indicator?pageable=false')).then((response) => {
   const items = response?.data?.content;
-  indicatorListRef.value.splice(0, indicatorListRef.value.length);
+  const indicatorList = [];
   if (items && items.length > 0) {
     for (const item of items) {
-      indicatorListRef.value.push({ value: item.id, label: item.code + ' : ' + item.name });
+      indicatorList.push({ value: item.id, label: item.code + ' : ' + item.name });
     }
   }
+  indicatorListRef.value = indicatorList;
 });
 </script>
diff --git a/erm.frontend/src/views/appetite/spread/SreadSupervision.vue b/erm.frontend/src/views/appetite/spread/SreadSupervision.vue
index cc6d7df3..5d1b03ab 100644
--- a/erm.frontend/src/views/appetite/spread/SreadSupervision.vue
+++ b/erm.frontend/src/views/appetite/spread/SreadSupervision.vue
@@ -78,11 +78,12 @@ const DICTIONARY_MAP = await DictionaryTools.fetch(['INDICATOR_CATEGORY', 'INDIC
 const StakeHolderEnums = await EnumTools.fetch('erm.api.enums.StakeHolder');
 await axios.get(Environment.apiContextPath('/api/erm/kpi/indicator?pageable=false')).then((response) => {
   const items = response?.data?.content;
-  indicatorListRef.value.splice(0, indicatorListRef.value.length);
+  const indicatorList = [];
   if (items && items.length > 0) {
     for (const item of items) {
-      indicatorListRef.value.push({ value: item.id, label: item.code + ' : ' + item.name });
+      indicatorList.push({ value: item.id, label: item.code + ' : ' + item.name });
     }
   }
+  indicatorListRef.value = indicatorList;
 });
 </script>
diff --git a/erm.frontend/src/views/kpi/Lib.vue b/erm.frontend/src/views/kpi/Lib.vue
index 201c19d4..1cca91ed 100644
--- a/erm.frontend/src/views/kpi/Lib.vue
+++ b/erm.frontend/src/views/kpi/Lib.vue
@@ -1,7 +1,7 @@
 <template>
-  <q-splitter :model-value="60" class="w-full h-full">
+  <q-splitter :model-value="60" class="w-full" style="height: 100%">
     <template #before>
-      <div class="pr-1">
+      <div class="pr-1" style="height: 100%">
         <w-grid
           ref="treeGridRef"
           :title="$t('erm.kpi.lib.grid.title')"
@@ -90,27 +90,19 @@
       </div>
     </template>
     <template #after>
-      <div class="pl-1">
-        <q-tabs v-model="selectedTabRef" inline-label align="left" :breakpoint="0">
-          <q-tab name="indicator" icon="bi-diagram-3" :label="$t('erm.kpi.shared.selectIndicator.tab.title')" />
-        </q-tabs>
-
-        <q-tab-panels v-model="selectedTabRef" animated swipeable keep-alive>
-          <q-tab-panel name="indicator" class="px-0">
-            <SelectIndicatorGrid
-              ref="userGridRef"
-              :fetch-data-url="Environment.apiContextPath('/api/erm/kpi/indicator/queryIndicatorsByLib')"
-              :fetch-other-data-url="Environment.apiContextPath('/api/erm/kpi/indicator/queryOtherIndicatorsByLib')"
-              foreign-key="libId"
-              :foreign-value="currentSelectedLibId"
-              @select-in="selectIn"
-              @select-out="selectOut"
-              @select-all-in="selectAllIn"
-              @select-all-out="selectAllOut"
-            >
-            </SelectIndicatorGrid>
-          </q-tab-panel>
-        </q-tab-panels>
+      <div class="pl-1" style="height: 100%">
+        <SelectIndicatorGrid
+          ref="userGridRef"
+          :fetch-data-url="Environment.apiContextPath('/api/erm/kpi/indicator/queryIndicatorsByLib')"
+          :fetch-other-data-url="Environment.apiContextPath('/api/erm/kpi/indicator/queryOtherIndicatorsByLib')"
+          foreign-key="libId"
+          :foreign-value="currentSelectedLibId"
+          @select-in="selectIn"
+          @select-out="selectOut"
+          @select-all-in="selectAllIn"
+          @select-all-out="selectAllOut"
+        >
+        </SelectIndicatorGrid>
       </div>
     </template>
   </q-splitter>
diff --git a/gradle.properties b/gradle.properties
index 40952aca..a6984c1b 100644
--- a/gradle.properties
+++ b/gradle.properties
@@ -36,9 +36,9 @@ application_version=1.0.0
 # platform
 ###########################################################
 platform_group=io.sc
-platform_version=8.1.37
+platform_version=8.1.38
 platform_plugin_version=8.1.13
-platform_core_frontend_version=8.1.182
+platform_core_frontend_version=8.1.189
 
 ###########################################################
 # dependencies version
diff --git a/io.sc.engine.mv.frontend/package.json b/io.sc.engine.mv.frontend/package.json
index 7e350264..0c42eee3 100644
--- a/io.sc.engine.mv.frontend/package.json
+++ b/io.sc.engine.mv.frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "io.sc.engine.mv.frontend",
-  "version": "8.1.37",
+  "version": "8.1.38",
   "description": "",
   "private": false,
   "keywords": [],
@@ -23,81 +23,81 @@
     "access": "public"
   },
   "devDependencies": {
-    "@babel/core": "7.23.7",
-    "@babel/preset-env": "7.23.7",
-    "@babel/preset-typescript": "7.23.3",
-    "@babel/plugin-transform-class-properties": "7.23.3",
-    "@babel/plugin-transform-object-rest-spread": "7.23.4",
-    "@quasar/app-webpack": "3.12.1",
-    "@quasar/cli": "2.3.0",
+    "@babel/core": "7.24.4",
+    "@babel/preset-env": "7.24.4",
+    "@babel/preset-typescript": "7.24.1",
+    "@babel/plugin-transform-class-properties": "7.24.1",
+    "@babel/plugin-transform-object-rest-spread": "7.24.1",
+    "@quasar/app-webpack": "3.12.5",
+    "@quasar/cli": "2.4.0",
     "@types/mockjs": "1.0.10",
-    "@types/node": "20.10.6",
-    "@typescript-eslint/eslint-plugin": "6.17.0",
-    "@typescript-eslint/parser": "6.17.0",
-    "@vue/compiler-sfc": "3.4.3",
+    "@types/node": "20.12.7",
+    "@typescript-eslint/eslint-plugin": "7.7.1",
+    "@typescript-eslint/parser": "7.7.1",
+    "@vue/compiler-sfc": "3.4.24",
     "@webpack-cli/serve": "2.0.5",
-    "autoprefixer": "10.4.16",
+    "autoprefixer": "10.4.19",
     "babel-loader": "9.1.3",
     "clean-webpack-plugin": "4.0.0",
-    "copy-webpack-plugin": "11.0.0",
+    "copy-webpack-plugin": "12.0.2",
     "cross-env": "7.0.3",
-    "css-loader": "6.8.1",
+    "css-loader": "7.1.1",
     "eslint": "8.56.0",
     "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-prettier": "5.1.2",
-    "eslint-plugin-vue": "9.19.2",
-    "eslint-webpack-plugin": "4.0.1",
+    "eslint-plugin-prettier": "5.1.3",
+    "eslint-plugin-vue": "9.25.0",
+    "eslint-webpack-plugin": "4.1.0",
     "html-webpack-plugin": "5.6.0",
     "json5": "2.2.3",
-    "mini-css-extract-plugin": "2.7.6",
-    "nodemon": "3.0.2",
-    "postcss": "8.4.32",
-    "postcss-import": "16.0.0",
-    "postcss-loader": "7.3.4",
-    "postcss-preset-env": "9.3.0",
-    "prettier": "3.1.1",
-    "sass": "1.69.7",
-    "sass-loader": "13.3.3",
-    "typescript": "5.3.3",
+    "mini-css-extract-plugin": "2.9.0",
+    "nodemon": "3.1.0",
+    "postcss": "8.4.38",
+    "postcss-import": "16.1.0",
+    "postcss-loader": "8.1.1",
+    "postcss-preset-env": "9.5.9",
+    "prettier": "3.2.5",
+    "sass": "1.75.0",
+    "sass-loader": "14.2.1",
+    "typescript": "5.4.5",
     "vue-loader": "17.4.2",
-    "webpack": "5.89.0",
-    "webpack-bundle-analyzer": "4.10.1",
+    "webpack": "5.91.0",
+    "webpack-bundle-analyzer": "4.10.2",
     "webpack-cli": "5.1.4",
-    "webpack-dev-server": "4.15.1",
+    "webpack-dev-server": "5.0.4",
     "webpack-merge": "5.10.0",
-    "@vue/babel-plugin-jsx": "1.1.5"
+    "@vue/babel-plugin-jsx": "1.2.2"
   },
   "dependencies": {
-    "@codemirror/autocomplete": "6.11.1",
-    "@codemirror/commands": "6.3.3",
-    "@codemirror/lang-html": "6.4.7",
+    "@codemirror/autocomplete": "6.16.0",
+    "@codemirror/commands": "6.5.0",
+    "@codemirror/lang-html": "6.4.9",
     "@codemirror/lang-java": "6.0.1",
-    "@codemirror/lang-javascript": "6.2.1",
+    "@codemirror/lang-javascript": "6.2.2",
     "@codemirror/lang-json": "6.0.1",
-    "@codemirror/lang-sql": "6.5.4",
-    "@codemirror/lang-xml": "6.0.2",
-    "@codemirror/language": "6.10.0",
-    "@codemirror/search": "6.5.5",
-    "@codemirror/state": "6.4.0",
-    "@codemirror/view": "6.23.0",
-    "@maxgraph/core": "0.9.0",
-    "@quasar/extras": "1.16.9",
-    "@vueuse/core": "10.7.1",
-    "axios": "1.6.3",
+    "@codemirror/lang-sql": "6.6.3",
+    "@codemirror/lang-xml": "6.1.0",
+    "@codemirror/language": "6.10.1",
+    "@codemirror/search": "6.5.6",
+    "@codemirror/state": "6.4.1",
+    "@codemirror/view": "6.26.3",
+    "@maxgraph/core": "0.10.0",
+    "@quasar/extras": "1.16.11",
+    "@vueuse/core": "10.9.0",
+    "axios": "1.6.8",
     "codemirror": "6.0.1",
     "dayjs": "1.11.10",
-    "echarts": "5.4.3",
+    "echarts": "5.5.0",
     "exceljs": "4.4.0",
     "file-saver": "2.0.5",
     "luckyexcel": "1.0.1",
     "mockjs": "1.1.0",
     "pinia": "2.1.7",
-    "platform-core": "8.1.182",
-    "quasar": "2.14.5",
-    "tailwindcss": "3.4.0",
-    "vue": "3.4.3",
+    "platform-core": "8.1.189",
+    "quasar": "2.15.3",
+    "tailwindcss": "3.4.3",
+    "vue": "3.4.24",
     "vue-dompurify-html": "5.0.1",
-    "vue-i18n": "9.8.0",
-    "vue-router": "4.2.5"
+    "vue-i18n": "9.13.1",
+    "vue-router": "4.3.2"
   }
 }
\ No newline at end of file
diff --git a/io.sc.engine.mv.frontend/src/views/result/Executor.vue b/io.sc.engine.mv.frontend/src/views/result/Executor.vue
index dca10d04..2384f818 100644
--- a/io.sc.engine.mv.frontend/src/views/result/Executor.vue
+++ b/io.sc.engine.mv.frontend/src/views/result/Executor.vue
@@ -48,16 +48,19 @@ const open = () => {
   dialogRef.value.show();
   nextTick(() => {
     axios.get(Environment.apiContextPath('/api/mv/configure/binomial/significanceLevels')).then((response) => {
-      binomialSignificanceLevelOptionsRef.value.splice(0, binomialSignificanceLevelOptionsRef.value.length);
+      const binomialSignificanceLevelOptions = [];
       for (let item of response.data) {
-        binomialSignificanceLevelOptionsRef.value.push({ label: item, value: item });
+        binomialSignificanceLevelOptions.push({ label: item, value: item });
       }
+      binomialSignificanceLevelOptionsRef.value = binomialSignificanceLevelOptions;
     });
+
     axios.get(Environment.apiContextPath('/api/mv/configure/chiSquare/significanceLevels')).then((response) => {
-      chiSquareSignificanceLevelOptionsRef.value.splice(0, chiSquareSignificanceLevelOptionsRef.value.length);
+      const chiSquareSignificanceLevelOptions = [];
       for (let item of response.data) {
-        chiSquareSignificanceLevelOptionsRef.value.push({ label: item, value: item });
+        chiSquareSignificanceLevelOptions.push({ label: item, value: item });
       }
+      chiSquareSignificanceLevelOptionsRef.value = chiSquareSignificanceLevelOptions;
     });
   });
 };
diff --git a/io.sc.engine.rule.frontend/package.json b/io.sc.engine.rule.frontend/package.json
index 3c992aff..a044d313 100644
--- a/io.sc.engine.rule.frontend/package.json
+++ b/io.sc.engine.rule.frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "io.sc.engine.rule.frontend",
-  "version": "8.1.37",
+  "version": "8.1.38",
   "description": "",
   "private": false,
   "keywords": [],
@@ -23,81 +23,81 @@
     "access": "public"
   },
   "devDependencies": {
-    "@babel/core": "7.23.7",
-    "@babel/preset-env": "7.23.7",
-    "@babel/preset-typescript": "7.23.3",
-    "@babel/plugin-transform-class-properties": "7.23.3",
-    "@babel/plugin-transform-object-rest-spread": "7.23.4",
-    "@quasar/app-webpack": "3.12.1",
-    "@quasar/cli": "2.3.0",
+    "@babel/core": "7.24.4",
+    "@babel/preset-env": "7.24.4",
+    "@babel/preset-typescript": "7.24.1",
+    "@babel/plugin-transform-class-properties": "7.24.1",
+    "@babel/plugin-transform-object-rest-spread": "7.24.1",
+    "@quasar/app-webpack": "3.12.5",
+    "@quasar/cli": "2.4.0",
     "@types/mockjs": "1.0.10",
-    "@types/node": "20.10.6",
-    "@typescript-eslint/eslint-plugin": "6.17.0",
-    "@typescript-eslint/parser": "6.17.0",
-    "@vue/compiler-sfc": "3.4.3",
+    "@types/node": "20.12.7",
+    "@typescript-eslint/eslint-plugin": "7.7.1",
+    "@typescript-eslint/parser": "7.7.1",
+    "@vue/compiler-sfc": "3.4.24",
     "@webpack-cli/serve": "2.0.5",
-    "autoprefixer": "10.4.16",
+    "autoprefixer": "10.4.19",
     "babel-loader": "9.1.3",
     "clean-webpack-plugin": "4.0.0",
-    "copy-webpack-plugin": "11.0.0",
+    "copy-webpack-plugin": "12.0.2",
     "cross-env": "7.0.3",
-    "css-loader": "6.8.1",
+    "css-loader": "7.1.1",
     "eslint": "8.56.0",
     "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-prettier": "5.1.2",
-    "eslint-plugin-vue": "9.19.2",
-    "eslint-webpack-plugin": "4.0.1",
+    "eslint-plugin-prettier": "5.1.3",
+    "eslint-plugin-vue": "9.25.0",
+    "eslint-webpack-plugin": "4.1.0",
     "html-webpack-plugin": "5.6.0",
     "json5": "2.2.3",
-    "mini-css-extract-plugin": "2.7.6",
-    "nodemon": "3.0.2",
-    "postcss": "8.4.32",
-    "postcss-import": "16.0.0",
-    "postcss-loader": "7.3.4",
-    "postcss-preset-env": "9.3.0",
-    "prettier": "3.1.1",
-    "sass": "1.69.7",
-    "sass-loader": "13.3.3",
-    "typescript": "5.3.3",
+    "mini-css-extract-plugin": "2.9.0",
+    "nodemon": "3.1.0",
+    "postcss": "8.4.38",
+    "postcss-import": "16.1.0",
+    "postcss-loader": "8.1.1",
+    "postcss-preset-env": "9.5.9",
+    "prettier": "3.2.5",
+    "sass": "1.75.0",
+    "sass-loader": "14.2.1",
+    "typescript": "5.4.5",
     "vue-loader": "17.4.2",
-    "webpack": "5.89.0",
-    "webpack-bundle-analyzer": "4.10.1",
+    "webpack": "5.91.0",
+    "webpack-bundle-analyzer": "4.10.2",
     "webpack-cli": "5.1.4",
-    "webpack-dev-server": "4.15.1",
+    "webpack-dev-server": "5.0.4",
     "webpack-merge": "5.10.0",
-    "@vue/babel-plugin-jsx": "1.1.5"
+    "@vue/babel-plugin-jsx": "1.2.2"
   },
   "dependencies": {
-    "@codemirror/autocomplete": "6.11.1",
-    "@codemirror/commands": "6.3.3",
-    "@codemirror/lang-html": "6.4.7",
+    "@codemirror/autocomplete": "6.16.0",
+    "@codemirror/commands": "6.5.0",
+    "@codemirror/lang-html": "6.4.9",
     "@codemirror/lang-java": "6.0.1",
-    "@codemirror/lang-javascript": "6.2.1",
+    "@codemirror/lang-javascript": "6.2.2",
     "@codemirror/lang-json": "6.0.1",
-    "@codemirror/lang-sql": "6.5.4",
-    "@codemirror/lang-xml": "6.0.2",
-    "@codemirror/language": "6.10.0",
-    "@codemirror/search": "6.5.5",
-    "@codemirror/state": "6.4.0",
-    "@codemirror/view": "6.23.0",
-    "@maxgraph/core": "0.9.0",
-    "@quasar/extras": "1.16.9",
-    "@vueuse/core": "10.7.1",
-    "axios": "1.6.3",
+    "@codemirror/lang-sql": "6.6.3",
+    "@codemirror/lang-xml": "6.1.0",
+    "@codemirror/language": "6.10.1",
+    "@codemirror/search": "6.5.6",
+    "@codemirror/state": "6.4.1",
+    "@codemirror/view": "6.26.3",
+    "@maxgraph/core": "0.10.0",
+    "@quasar/extras": "1.16.11",
+    "@vueuse/core": "10.9.0",
+    "axios": "1.6.8",
     "codemirror": "6.0.1",
     "dayjs": "1.11.10",
-    "echarts": "5.4.3",
+    "echarts": "5.5.0",
     "exceljs": "4.4.0",
     "file-saver": "2.0.5",
     "luckyexcel": "1.0.1",
     "mockjs": "1.1.0",
     "pinia": "2.1.7",
-    "platform-core": "8.1.182",
-    "quasar": "2.14.5",
-    "tailwindcss": "3.4.0",
-    "vue": "3.4.3",
+    "platform-core": "8.1.189",
+    "quasar": "2.15.3",
+    "tailwindcss": "3.4.3",
+    "vue": "3.4.24",
     "vue-dompurify-html": "5.0.1",
-    "vue-i18n": "9.8.0",
-    "vue-router": "4.2.5"
+    "vue-i18n": "9.13.1",
+    "vue-router": "4.3.2"
   }
 }
\ No newline at end of file
diff --git a/io.sc.engine.rule.frontend/src/views/dictionary/dictionary.vue b/io.sc.engine.rule.frontend/src/views/dictionary/dictionary.vue
index c4a8a1a7..84503435 100644
--- a/io.sc.engine.rule.frontend/src/views/dictionary/dictionary.vue
+++ b/io.sc.engine.rule.frontend/src/views/dictionary/dictionary.vue
@@ -500,11 +500,11 @@ const divStatus = reactive({
 
 const Enums = await EnumTools.fetch(['io.sc.engine.rule.core.enums.DictionaryType', 'io.sc.engine.rule.core.enums.DeployStatus']);
 let ValueTypeMap = {};
-const ValueTypeList = [];
+let ValueTypeList = [];
 const response = await axios.get(Environment.apiContextPath('/api/re/dictionary/getAllDictionaryMap'));
 if (response && response.data) {
   ValueTypeMap = {};
-  ValueTypeList.splice(0, ValueTypeList.length);
+  ValueTypeList = [];
   for (const item of response.data) {
     ValueTypeMap[item.key] = item.value;
     ValueTypeList.push({ value: item.key, label: item.value });
diff --git a/io.sc.engine.rule.frontend/src/views/lib/IndicatorGrid.vue b/io.sc.engine.rule.frontend/src/views/lib/IndicatorGrid.vue
index 5279605c..ac388f90 100644
--- a/io.sc.engine.rule.frontend/src/views/lib/IndicatorGrid.vue
+++ b/io.sc.engine.rule.frontend/src/views/lib/IndicatorGrid.vue
@@ -153,11 +153,11 @@ defineExpose({
 
 const Enums = await EnumTools.fetch(['io.sc.engine.rule.core.enums.IndicatorType', 'io.sc.engine.rule.core.enums.DeployStatus']);
 let ValueTypeMap = {};
-const ValueTypeList = [];
+let ValueTypeList = [];
 const response = await axios.get(Environment.apiContextPath('/api/re/dictionary/getAllDictionaryMap'));
 if (response && response.data) {
   ValueTypeMap = {};
-  ValueTypeList.splice(0, ValueTypeList.length);
+  ValueTypeList = [];
   for (const item of response.data) {
     ValueTypeMap[item.key] = item.value;
     ValueTypeList.push({ value: item.key, label: item.value });
diff --git a/io.sc.engine.rule.frontend/src/views/lib/TestCase.vue b/io.sc.engine.rule.frontend/src/views/lib/TestCase.vue
index 345f2c11..54de3336 100644
--- a/io.sc.engine.rule.frontend/src/views/lib/TestCase.vue
+++ b/io.sc.engine.rule.frontend/src/views/lib/TestCase.vue
@@ -127,11 +127,11 @@ const Enums = await EnumTools.fetch([
   'io.sc.engine.rule.core.enums.DeployStatus',
 ]);
 let ValueTypeMap = {};
-const ValueTypeList = [];
+let ValueTypeList = [];
 const response = await axios.get(Environment.apiContextPath('/api/re/dictionary/getAllDictionaryMap'));
 if (response && response.data) {
   ValueTypeMap = {};
-  ValueTypeList.splice(0, ValueTypeList.length);
+  ValueTypeList = [];
   for (const item of response.data) {
     ValueTypeMap[item.key] = item.value;
     ValueTypeList.push({ value: item.key, label: item.value });
diff --git a/io.sc.engine.rule.frontend/src/views/resources/designer/Testcase.vue b/io.sc.engine.rule.frontend/src/views/resources/designer/Testcase.vue
index c08b7906..f523bf26 100644
--- a/io.sc.engine.rule.frontend/src/views/resources/designer/Testcase.vue
+++ b/io.sc.engine.rule.frontend/src/views/resources/designer/Testcase.vue
@@ -134,11 +134,11 @@ const Enums = await EnumTools.fetch([
   'io.sc.engine.rule.core.enums.DeployStatus',
 ]);
 let ValueTypeMap = {};
-const ValueTypeList = [];
+let ValueTypeList = [];
 const response = await axios.get(Environment.apiContextPath('/api/re/dictionary/getAllDictionaryMap'));
 if (response && response.data) {
   ValueTypeMap = {};
-  ValueTypeList.splice(0, ValueTypeList.length);
+  ValueTypeList = [];
   for (const item of response.data) {
     ValueTypeMap[item.key] = item.value;
     ValueTypeList.push({ value: item.key, label: item.value });
diff --git a/io.sc.engine.rule.frontend/src/views/testcase/Testcase.vue b/io.sc.engine.rule.frontend/src/views/testcase/Testcase.vue
index 857b4c34..2fefa7cd 100644
--- a/io.sc.engine.rule.frontend/src/views/testcase/Testcase.vue
+++ b/io.sc.engine.rule.frontend/src/views/testcase/Testcase.vue
@@ -270,11 +270,11 @@ const Enums = await EnumTools.fetch([
   'io.sc.engine.rule.core.enums.DeployStatus',
 ]);
 let ValueTypeMap = {};
-const ValueTypeList = [];
+let ValueTypeList = [];
 const response = await axios.get(Environment.apiContextPath('/api/re/dictionary/getAllDictionaryMap'));
 if (response && response.data) {
   ValueTypeMap = {};
-  ValueTypeList.splice(0, ValueTypeList.length);
+  ValueTypeList = [];
   for (const item of response.data) {
     ValueTypeMap[item.key] = item.value;
     ValueTypeList.push({ value: item.key, label: item.value });
diff --git a/io.sc.platform.core.frontend/package copy.json b/io.sc.platform.core.frontend/package copy.json
new file mode 100644
index 00000000..0d61bb12
--- /dev/null
+++ b/io.sc.platform.core.frontend/package copy.json	
@@ -0,0 +1,102 @@
+{
+  "name": "io.sc.platform.system.frontend",
+  "version": "8.1.38",
+  "description": "",
+  "private": false,
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "scripts": {
+    "dev": "nodemon",
+    "serve": "node ./util-components-generator.cjs && cross-env NODE_ENV=development  webpack serve --config webpack.env.serve.cjs",
+    "build": "node ./util-components-generator.cjs && cross-env NODE_ENV=development  webpack       --config webpack.env.build.cjs",
+    "prod": "node ./util-components-generator.cjs && cross-env  NODE_ENV=production   webpack       --config webpack.env.prod.cjs",
+    "sync": "platform sync",
+    "clean": "rm -rf ./node_modules && rm -rf pnpm-lock.yaml"
+  },
+  "engines": {
+    "node": ">=18",
+    "pnpm": ">=7"
+  },
+  "publishConfig": {
+    "registry": "http://nexus.sc.io:8000/repository/npm-releases/",
+    "access": "public"
+  },
+  "devDependencies": {
+    "@babel/core": "7.23.7",
+    "@babel/preset-env": "7.23.7",
+    "@babel/preset-typescript": "7.23.3",
+    "@babel/plugin-transform-class-properties": "7.23.3",
+    "@babel/plugin-transform-object-rest-spread": "7.23.4",
+    "@quasar/app-webpack": "3.12.1",
+    "@quasar/cli": "2.3.0",
+    "@types/mockjs": "1.0.10",
+    "@types/node": "20.10.6",
+    "@typescript-eslint/eslint-plugin": "6.17.0",
+    "@typescript-eslint/parser": "6.17.0",
+    "@vue/compiler-sfc": "3.4.3",
+    "@webpack-cli/serve": "2.0.5",
+    "autoprefixer": "10.4.16",
+    "babel-loader": "9.1.3",
+    "clean-webpack-plugin": "4.0.0",
+    "copy-webpack-plugin": "11.0.0",
+    "cross-env": "7.0.3",
+    "css-loader": "6.8.1",
+    "eslint": "8.56.0",
+    "eslint-config-prettier": "9.1.0",
+    "eslint-plugin-prettier": "5.1.2",
+    "eslint-plugin-vue": "9.19.2",
+    "eslint-webpack-plugin": "4.0.1",
+    "html-webpack-plugin": "5.6.0",
+    "json5": "2.2.3",
+    "mini-css-extract-plugin": "2.7.6",
+    "nodemon": "3.0.2",
+    "postcss": "8.4.32",
+    "postcss-import": "16.0.0",
+    "postcss-loader": "7.3.4",
+    "postcss-preset-env": "9.3.0",
+    "prettier": "3.1.1",
+    "sass": "1.69.7",
+    "sass-loader": "13.3.3",
+    "typescript": "5.3.3",
+    "vue-loader": "17.4.2",
+    "webpack": "5.89.0",
+    "webpack-bundle-analyzer": "4.10.1",
+    "webpack-cli": "5.1.4",
+    "webpack-dev-server": "4.15.1",
+    "webpack-merge": "5.10.0",
+    "@vue/babel-plugin-jsx": "1.1.5"
+  },
+  "dependencies": {
+    "@codemirror/autocomplete": "6.11.1",
+    "@codemirror/commands": "6.3.3",
+    "@codemirror/lang-html": "6.4.7",
+    "@codemirror/lang-java": "6.0.1",
+    "@codemirror/lang-javascript": "6.2.1",
+    "@codemirror/lang-json": "6.0.1",
+    "@codemirror/lang-sql": "6.5.4",
+    "@codemirror/lang-xml": "6.0.2",
+    "@codemirror/language": "6.10.0",
+    "@codemirror/search": "6.5.5",
+    "@codemirror/state": "6.4.0",
+    "@codemirror/view": "6.23.0",
+    "@maxgraph/core": "0.9.0",
+    "@quasar/extras": "1.16.9",
+    "@vueuse/core": "10.7.1",
+    "axios": "1.6.3",
+    "codemirror": "6.0.1",
+    "dayjs": "1.11.10",
+    "echarts": "5.4.3",
+    "exceljs": "4.4.0",
+    "file-saver": "2.0.5",
+    "luckyexcel": "1.0.1",
+    "mockjs": "1.1.0",
+    "pinia": "2.1.7",
+    "quasar": "2.14.5",
+    "tailwindcss": "3.4.0",
+    "vue": "3.4.3",
+    "vue-dompurify-html": "5.0.1",
+    "vue-i18n": "9.8.0",
+    "vue-router": "4.2.5"
+  }
+}
\ No newline at end of file
diff --git a/io.sc.platform.core.frontend/package.json b/io.sc.platform.core.frontend/package.json
index 40b3ddd1..3911c481 100644
--- a/io.sc.platform.core.frontend/package.json
+++ b/io.sc.platform.core.frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "platform-core",
-  "version": "8.1.188",
+  "version": "8.1.189",
   "description": "前端核心包,用于快速构建前端的脚手架",
   "//main": "库的主文件",
   "main": "dist/platform-core.js",
@@ -52,80 +52,80 @@
     "no-git-checks": true
   },
   "devDependencies": {
-    "@babel/core": "7.23.7",
-    "@babel/preset-env": "7.23.7",
-    "@babel/preset-typescript": "7.23.3",
-    "@babel/plugin-transform-class-properties": "7.23.3",
-    "@babel/plugin-transform-object-rest-spread": "7.23.4",
-    "@quasar/app-webpack": "3.12.1",
-    "@quasar/cli": "2.3.0",
+    "@babel/core": "7.24.4",
+    "@babel/preset-env": "7.24.4",
+    "@babel/preset-typescript": "7.24.1",
+    "@babel/plugin-transform-class-properties": "7.24.1",
+    "@babel/plugin-transform-object-rest-spread": "7.24.1",
+    "@quasar/app-webpack": "3.12.5",
+    "@quasar/cli": "2.4.0",
     "@types/mockjs": "1.0.10",
-    "@types/node": "20.10.6",
-    "@typescript-eslint/eslint-plugin": "6.17.0",
-    "@typescript-eslint/parser": "6.17.0",
-    "@vue/compiler-sfc": "3.4.3",
-    "@vue/babel-plugin-jsx": "1.1.5",
+    "@types/node": "20.12.7",
+    "@typescript-eslint/eslint-plugin": "7.7.1",
+    "@typescript-eslint/parser": "7.7.1",
+    "@vue/compiler-sfc": "3.4.24",
     "@webpack-cli/serve": "2.0.5",
-    "autoprefixer": "10.4.16",
+    "autoprefixer": "10.4.19",
     "babel-loader": "9.1.3",
     "clean-webpack-plugin": "4.0.0",
-    "copy-webpack-plugin": "11.0.0",
+    "copy-webpack-plugin": "12.0.2",
     "cross-env": "7.0.3",
-    "css-loader": "6.8.1",
+    "css-loader": "7.1.1",
     "eslint": "8.56.0",
     "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-prettier": "5.1.2",
-    "eslint-plugin-vue": "9.19.2",
-    "eslint-webpack-plugin": "4.0.1",
+    "eslint-plugin-prettier": "5.1.3",
+    "eslint-plugin-vue": "9.25.0",
+    "eslint-webpack-plugin": "4.1.0",
     "html-webpack-plugin": "5.6.0",
     "json5": "2.2.3",
-    "mini-css-extract-plugin": "2.7.6",
-    "nodemon": "3.0.2",
-    "postcss": "8.4.32",
-    "postcss-import": "16.0.0",
-    "postcss-loader": "7.3.4",
-    "postcss-preset-env": "9.3.0",
-    "prettier": "3.1.1",
-    "sass": "1.69.7",
-    "sass-loader": "13.3.3",
-    "typescript": "5.3.3",
+    "mini-css-extract-plugin": "2.9.0",
+    "nodemon": "3.1.0",
+    "postcss": "8.4.38",
+    "postcss-import": "16.1.0",
+    "postcss-loader": "8.1.1",
+    "postcss-preset-env": "9.5.9",
+    "prettier": "3.2.5",
+    "sass": "1.75.0",
+    "sass-loader": "14.2.1",
+    "typescript": "5.4.5",
     "vue-loader": "17.4.2",
-    "webpack": "5.89.0",
-    "webpack-bundle-analyzer": "4.10.1",
+    "webpack": "5.91.0",
+    "webpack-bundle-analyzer": "4.10.2",
     "webpack-cli": "5.1.4",
-    "webpack-dev-server": "4.15.1",
-    "webpack-merge": "5.10.0"
+    "webpack-dev-server": "5.0.4",
+    "webpack-merge": "5.10.0",
+    "@vue/babel-plugin-jsx": "1.2.2"
   },
   "dependencies": {
-    "@codemirror/autocomplete": "6.11.1",
-    "@codemirror/commands": "6.3.3",
-    "@codemirror/lang-html": "6.4.7",
+    "@codemirror/autocomplete": "6.16.0",
+    "@codemirror/commands": "6.5.0",
+    "@codemirror/lang-html": "6.4.9",
     "@codemirror/lang-java": "6.0.1",
-    "@codemirror/lang-javascript": "6.2.1",
+    "@codemirror/lang-javascript": "6.2.2",
     "@codemirror/lang-json": "6.0.1",
-    "@codemirror/lang-sql": "6.5.4",
-    "@codemirror/lang-xml": "6.0.2",
-    "@codemirror/language": "6.10.0",
-    "@codemirror/search": "6.5.5",
-    "@codemirror/state": "6.4.0",
-    "@codemirror/view": "6.23.0",
-    "@maxgraph/core": "0.9.0",
-    "@quasar/extras": "1.16.9",
-    "@vueuse/core": "10.7.1",
-    "axios": "1.6.3",
+    "@codemirror/lang-sql": "6.6.3",
+    "@codemirror/lang-xml": "6.1.0",
+    "@codemirror/language": "6.10.1",
+    "@codemirror/search": "6.5.6",
+    "@codemirror/state": "6.4.1",
+    "@codemirror/view": "6.26.3",
+    "@maxgraph/core": "0.10.0",
+    "@quasar/extras": "1.16.11",
+    "@vueuse/core": "10.9.0",
+    "axios": "1.6.8",
     "codemirror": "6.0.1",
     "dayjs": "1.11.10",
-    "echarts": "5.4.3",
+    "echarts": "5.5.0",
     "exceljs": "4.4.0",
     "file-saver": "2.0.5",
     "luckyexcel": "1.0.1",
     "mockjs": "1.1.0",
     "pinia": "2.1.7",
-    "quasar": "2.14.5",
-    "tailwindcss": "3.4.0",
-    "vue": "3.4.3",
+    "quasar": "2.15.3",
+    "tailwindcss": "3.4.3",
+    "vue": "3.4.24",
     "vue-dompurify-html": "5.0.1",
-    "vue-i18n": "9.8.0",
-    "vue-router": "4.2.5"
+    "vue-i18n": "9.13.1",
+    "vue-router": "4.3.2"
   }
 }
diff --git a/io.sc.platform.core.frontend/src/components/index.ts b/io.sc.platform.core.frontend/src/components/index.ts
index a1d3e7cb..940d5b83 100644
--- a/io.sc.platform.core.frontend/src/components/index.ts
+++ b/io.sc.platform.core.frontend/src/components/index.ts
@@ -2,7 +2,7 @@
  * 此文件为自动生成文件,请勿修改
  */
 
-import component_testcase_formElements from '@/views/exportdata.vue';
+import component_testcase_formElements from '@/views/FormElements.vue';
 import component_testcase_likmDialog from '@/views/likm/Dialog.vue';
 import component_testcase_likmDrawer from '@/views/likm/Drawer.vue';
 import component_testcase_likmForm from '@/views/likm/Form.vue';
diff --git a/io.sc.platform.core.frontend/src/platform/components/grid/WGrid.vue b/io.sc.platform.core.frontend/src/platform/components/grid/WGrid.vue
index e594dee7..d8418416 100644
--- a/io.sc.platform.core.frontend/src/platform/components/grid/WGrid.vue
+++ b/io.sc.platform.core.frontend/src/platform/components/grid/WGrid.vue
@@ -238,7 +238,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, computed, onMounted, nextTick, toRaw, useAttrs, getCurrentInstance, provide, watchEffect, watch } from 'vue';
+import { ref, reactive, computed, onMounted, onUpdated, nextTick, toRaw, useAttrs, getCurrentInstance, provide, watchEffect, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { axios, Environment, NotifyManager, TreeBuilder, VueTools, Tools } from '@/platform';
 import { useQuasar, getCssVar, exportFile } from 'quasar';
@@ -429,10 +429,10 @@ const tableColumns = ref(props.columns);
 const tableColumnsMap = ref(arrayToMap('name', tableColumns.value));
 const columnStyle = (item: any) => {
   let style = '';
-  if (item.hasOwnProperty('style')) {
+  if (Tools.hasOwnProperty(item, 'style')) {
     style = item.style;
   }
-  if (item.hasOwnProperty('width')) {
+  if (Tools.hasOwnProperty(item, 'width')) {
     if (typeof item.width === 'number') {
       item.style = `min-width: ` + item.width + `px; width: ` + item.width + `px;max-width: ` + item.width + `px;` + style;
     } else {
@@ -440,7 +440,7 @@ const columnStyle = (item: any) => {
     }
     delete item.width;
 
-    if (item.hasOwnProperty('classes')) {
+    if (Tools.hasOwnProperty(item, 'classes')) {
       item.classes = item.classes + ' truncate';
     } else {
       item.classes = 'truncate';
@@ -1792,13 +1792,14 @@ const stickyHeaderColumn = (time = 500) => {
   }
   tableRef.value.$el.getElementsByTagName('table')[0].style.setProperty('--tableBodyPadding', bodyPadding);
   tableRef.value.$el.getElementsByTagName('table')[0].style.setProperty('--tableBodyHeight', (denseBodyComputed.value ? 24 : 48) + 'px');
-  if (denseBottomComputed.value && (!attrs.hasOwnProperty('hide-bottom') || attrs['hide-bottom'] === false)) {
+
+  if (denseBottomComputed.value && (!Tools.hasOwnProperty(attrs, 'hide-bottom') || attrs['hide-bottom'] === false)) {
     if (tableRef.value.$el.getElementsByClassName('q-table__bottom').length > 0) {
       tableRef.value.$el.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomHeight', 33 + 'px');
       tableRef.value.$el.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomButtonHeight', 24 + 'px');
     }
   } else if (
-    (!attrs.hasOwnProperty('hide-bottom') || attrs['hide-bottom'] === false) &&
+    (!Tools.hasOwnProperty(attrs, 'hide-bottom') || attrs['hide-bottom'] === false) &&
     tableRef.value.$el.getElementsByClassName('q-table__bottom').length > 0
   ) {
     tableRef.value.$el.getElementsByClassName('q-table__bottom')[0].style.setProperty('--tableBottomHeight', 50 + 'px');
@@ -2199,7 +2200,7 @@ const handlerQueryFormShowField = () => {
     const rowColsNum = queryFormRef.value.getColsNum() * (props.queryFormRowNum || 1);
     let currRowColsNum = 0;
     props.queryFormFields.forEach((item: any) => {
-      if (item.hasOwnProperty('colSpan')) {
+      if (Tools.hasOwnProperty(item, 'colSpan')) {
         currRowColsNum += item.colSpan;
       } else {
         currRowColsNum += 1;
diff --git a/io.sc.platform.core.frontend/src/platform/components/utils/componentComm.ts b/io.sc.platform.core.frontend/src/platform/components/utils/componentComm.ts
index 161ed317..27d6f280 100644
--- a/io.sc.platform.core.frontend/src/platform/components/utils/componentComm.ts
+++ b/io.sc.platform.core.frontend/src/platform/components/utils/componentComm.ts
@@ -250,10 +250,10 @@ export function extractTableProps(props: any) {
 
 function columnStyle(item: any) {
   let style = '';
-  if (item.hasOwnProperty('style')) {
+  if (Tools.hasOwnProperty(item, 'style')) {
     style = item.style;
   }
-  if (item.hasOwnProperty('width')) {
+  if (Tools.hasOwnProperty(item, 'width')) {
     if (typeof item.width === 'number') {
       item.style = `min-width: ` + item.width + `px; width: ` + item.width + `px;max-width: ` + item.width + `px;` + style;
     } else {
@@ -261,7 +261,7 @@ function columnStyle(item: any) {
     }
     delete item.width;
 
-    if (item.hasOwnProperty('classes')) {
+    if (Tools.hasOwnProperty(item, 'classes')) {
       item.classes = item.classes + ' truncate';
     } else {
       item.classes = 'truncate';
diff --git a/io.sc.platform.core.frontend/src/platform/components/workflow/WSelectAssigneeDialog.vue b/io.sc.platform.core.frontend/src/platform/components/workflow/WSelectAssigneeDialog.vue
index e9ab7c9e..1794a189 100644
--- a/io.sc.platform.core.frontend/src/platform/components/workflow/WSelectAssigneeDialog.vue
+++ b/io.sc.platform.core.frontend/src/platform/components/workflow/WSelectAssigneeDialog.vue
@@ -43,13 +43,16 @@ const selectAssigneeWrapperRef = ref();
 
 const open = (selectAssigneeWrapper) => {
   selectAssigneeWrapperRef.value = selectAssigneeWrapper;
-  assigneeOptionsRef.value.splice(0, assigneeOptionsRef.value.length);
+  //assigneeOptionsRef.value.splice(0, assigneeOptionsRef.value.length);
+  const assigneeOptions = [];
   const assignees = selectAssigneeWrapper?.assignees;
   if (assignees) {
     for (let i = 0; i < assignees.length; i++) {
-      assigneeOptionsRef.value.push({ value: assignees[i].loginName, label: assignees[i].loginName + '/' + assignees[i].userName });
+      assigneeOptions.push({ value: assignees[i].loginName, label: assignees[i].loginName + '/' + assignees[i].userName });
+      //assigneeOptionsRef.value.push({ value: assignees[i].loginName, label: assignees[i].loginName + '/' + assignees[i].userName });
     }
   }
+  assigneeOptionsRef.value = assigneeOptions;
   dialogRef.value.show();
 };
 
diff --git a/io.sc.platform.core.frontend/src/platform/components/workflow/WWorkflowAction.vue b/io.sc.platform.core.frontend/src/platform/components/workflow/WWorkflowAction.vue
index 4e690edf..3d04269a 100644
--- a/io.sc.platform.core.frontend/src/platform/components/workflow/WWorkflowAction.vue
+++ b/io.sc.platform.core.frontend/src/platform/components/workflow/WWorkflowAction.vue
@@ -103,10 +103,13 @@ const buildButtons = (gobacks) => {
   }
 
   // 更新到响应式变量中
-  actionsRef.value.splice(0, actionsRef.value.length);
+  const actions = [];
+  //actionsRef.value.splice(0, actionsRef.value.length);
   for (let i = 0; i < buttons.length; i++) {
-    actionsRef.value.push(buttons[i]);
+    //actionsRef.value.push(buttons[i]);
+    actions.push(buttons[i]);
   }
+  actionsRef.value = actions;
 };
 
 const buttonClick = (action) => {
diff --git a/io.sc.platform.core.frontend/src/platform/plugin/manager/TagViewManager.ts b/io.sc.platform.core.frontend/src/platform/plugin/manager/TagViewManager.ts
index 0767a71e..e5a8e09b 100644
--- a/io.sc.platform.core.frontend/src/platform/plugin/manager/TagViewManager.ts
+++ b/io.sc.platform.core.frontend/src/platform/plugin/manager/TagViewManager.ts
@@ -162,9 +162,11 @@ class TagViewManager {
       let index = Tools.range(payload.index || 0, 0, TagViewManager.#tagViewsAndBreadcrumbs.tagViews.length - 1);
       let routeName = '';
       if (payload.mode === 'all') {
+        //删除所有
         TagViewManager.#tagViewsAndBreadcrumbs.tagViews.splice(0, TagViewManager.#tagViewsAndBreadcrumbs.tagViews.length);
         routeName = '/';
       } else if (payload.mode === 'current') {
+        //删除当前
         TagViewManager.#tagViewsAndBreadcrumbs.tagViews.splice(index, 1);
         if (TagViewManager.#tagViewsAndBreadcrumbs.tagViews.length === 0) {
           // 如果移除后, tagView 为空
@@ -174,13 +176,16 @@ class TagViewManager {
           routeName = TagViewManager.#tagViewsAndBreadcrumbs.tagViews[index].routeName;
         }
       } else if (payload.mode === 'others') {
+        //删除其他
         routeName = TagViewManager.#tagViewsAndBreadcrumbs.tagViews[index].routeName;
         TagViewManager.#tagViewsAndBreadcrumbs.tagViews.splice(0, index);
         TagViewManager.#tagViewsAndBreadcrumbs.tagViews.splice(1);
       } else if (payload.mode === 'left') {
+        //删除左边
         routeName = TagViewManager.#tagViewsAndBreadcrumbs.tagViews[index].routeName;
         TagViewManager.#tagViewsAndBreadcrumbs.tagViews.splice(0, index);
       } else if (payload.mode === 'right') {
+        //删除右边
         routeName = TagViewManager.#tagViewsAndBreadcrumbs.tagViews[index].routeName;
         TagViewManager.#tagViewsAndBreadcrumbs.tagViews.splice(index + 1);
       } else {
diff --git a/io.sc.platform.core.frontend/src/platform/utils/Tools.ts b/io.sc.platform.core.frontend/src/platform/utils/Tools.ts
index 29040acd..13fb1f38 100644
--- a/io.sc.platform.core.frontend/src/platform/utils/Tools.ts
+++ b/io.sc.platform.core.frontend/src/platform/utils/Tools.ts
@@ -865,6 +865,16 @@ class Tools {
     }
     return result;
   }
+
+  /**
+   * 判断某个对象是否含有某个属性
+   * @param obj 对象
+   * @param propertyName 属性名
+   * @returns 某个对象是否含有某个属性
+   */
+  public static hasOwnProperty(obj: object, propertyName: string) {
+    return Object.prototype.hasOwnProperty.call(obj, propertyName);
+  }
 }
 
 export { Tools };
diff --git a/io.sc.platform.core.frontend/src/views/FormElements copy.vue b/io.sc.platform.core.frontend/src/views/FormElements copy.vue
new file mode 100644
index 00000000..119cf2d6
--- /dev/null
+++ b/io.sc.platform.core.frontend/src/views/FormElements copy.vue	
@@ -0,0 +1,157 @@
+<template>
+  <div>
+    <div class="row justify-end q-gutter-md q-py-md">
+      <q-select
+        v-model="selectedTheme"
+        :label="$t('theme')"
+        :options="themeOptions"
+        option-label="name"
+        option-value="id"
+        emit-value
+        map-options
+        dense
+        outlined
+        style="min-width: 200px"
+        @update:model-value="themeChanged"
+      >
+        <template #option="scope">
+          <q-item v-bind="scope.itemProps">
+            <q-item-section>
+              <q-item-label>{{ scope.opt.name }}</q-item-label>
+            </q-item-section>
+            <q-item-section v-if="scope.opt.active" avatar>
+              <q-icon name="bi-check" />
+            </q-item-section>
+            <q-item-section v-else avatar>
+              <w-icon-empty></w-icon-empty>
+            </q-item-section>
+          </q-item>
+        </template>
+      </q-select>
+      <q-btn :label="$t('theme.action.setDefaultTheme')" icon="bi-heart" no-caps outline dense padding="2px 10px" @click="defaultTheme" />
+      <q-btn :label="$t('add')" icon="add" no-caps outline dense padding="2px 10px" @click="prompt = true" />
+      <q-btn :label="$t('delete')" icon="delete" no-caps outline dense padding="2px 10px" @click="removeTheme" />
+      <q-btn :label="$t('save')" icon="save" no-caps outline dense padding="2px 10px" @click="saveTheme" />
+    </div>    
+  </div>
+</template>
+<script setup lang="ts">
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useQuasar } from 'quasar';
+import { Environment, axios, Tools, NotifyManager } from 'platform-core';
+import Brand from './theme/Brand.vue';
+import LoadingBar from './theme/LoadingBar.vue';
+import Topper from './theme/Topper.vue';
+import Sider from './theme/Sider.vue';
+import TagViewBar from './theme/TagViewBar.vue';
+import Main from './theme/Main.vue';
+import Footer from './theme/Footer.vue';
+import Login from './theme/Login.vue';
+import Scroller from './theme/Scroller.vue';
+import Notifier from './theme/Notifier.vue';
+import Grid from './theme/Grid.vue';
+
+const { t } = useI18n();
+const quasar = useQuasar();
+
+const selectedTab = ref('brand');
+const selectedTheme = ref('');
+const themeOptions = ref([]);
+const prompt = ref(false);
+const configureName = ref('');
+
+let configureMap = new Map<string, object>();
+
+const newTheme = () => {
+  axios.post(Environment.apiContextPath('/api/lcdp/configure'), { name: configureName.value }).then((response) => {
+    NotifyManager.info(t('success'));
+    refresh(() => {
+      selectedTheme.value = response.data.id;
+      configureName.value = '';
+    });
+  });
+};
+
+const themeChanged = (value) => {
+  const option = configureMap.get(value);
+  if (option) {
+    Tools.mergeObject(Environment.getConfigure(), option);
+  }
+};
+
+const defaultTheme = () => {
+  quasar
+    .dialog({
+      title: t('confirm'),
+      message: t('theme.action.setDefaultTheme.confirm', { themeName: configureMap.get(selectedTheme.value).name }),
+      cancel: true,
+      persistent: true,
+    })
+    .onOk(() => {
+      axios.post(Environment.apiContextPath('/api/lcdp/configure/activeConfigure/') + selectedTheme.value).then((response) => {
+        NotifyManager.info(t('success'));
+        refresh();
+      });
+    });
+};
+
+const removeTheme = () => {
+  quasar
+    .dialog({
+      title: t('confirm'),
+      message: t('theme.action.delete.confirm', { themeName: configureMap.get(selectedTheme.value).name }),
+      cancel: true,
+      persistent: true,
+    })
+    .onOk(() => {
+      axios.delete(Environment.apiContextPath('/api/lcdp/configure/') + selectedTheme.value).then((response) => {
+        NotifyManager.info(t('success'));
+        refresh();
+        selectedTheme.value = '';
+      });
+    });
+};
+
+const saveTheme = () => {
+  quasar
+    .dialog({
+      title: t('confirm'),
+      message: t('theme.action.save.confirm', { themeName: configureMap.get(selectedTheme.value).name }),
+      cancel: true,
+      persistent: true,
+    })
+    .onOk(() => {
+      const data = {};
+      Tools.mergeObject(data, configureMap.get(selectedTheme.value));
+      data.theme = Environment.getConfigure().theme;
+
+      axios.put(Environment.apiContextPath('/api/lcdp/configure/') + selectedTheme.value, data).then((response) => {
+        NotifyManager.info(t('success'));
+      });
+    });
+};
+
+const refresh = (callback?: any) => {
+  axios.get(Environment.apiContextPath('/api/lcdp/configure')).then((response) => {
+    themeOptions.value.splice(0, themeOptions.value.length);
+    const items = response.data.content;
+    if (items && items.length > 0) {
+      const options = [];
+      for (const item of items) {
+        themeOptions.value.push(item);
+        configureMap.set(item.id, item);
+        if (item.active) {
+          selectedTheme.value = item.id;
+        }
+      }
+      //themeOptions.value = options;
+      if (callback) {
+        callback();
+      }
+    }
+  });
+};
+
+refresh();
+</script>
diff --git a/io.sc.platform.core.frontend/src/views/FormElements.vue b/io.sc.platform.core.frontend/src/views/FormElements.vue
index da8dd2d0..a788af33 100644
--- a/io.sc.platform.core.frontend/src/views/FormElements.vue
+++ b/io.sc.platform.core.frontend/src/views/FormElements.vue
@@ -1,25 +1,160 @@
 <template>
-  <div class="w-full border rounded-md" style="height: 100%">
-    <ToolBar></ToolBar>
-    <q-splitter :model-value="20" unit="%" separator-style="width:2px;" style="height: calc(100% - 50px)">
-      <template #before>
-        <SideBar></SideBar>
-      </template>
-      <template #after>
-        <q-splitter :model-value="65" unit="%" separator-style="width:2px;" style="height: 100%">
-          <template #before><Editor></Editor></template>
-          <template #after><Properties></Properties></template>
-        </q-splitter>
-      </template>
-    </q-splitter>
+  <div>
+    <div class="row justify-end q-gutter-md q-py-md">
+      <q-select
+        v-model="selectedTheme"
+        :label="$t('theme')"
+        :options="themeOptions"
+        option-label="name"
+        option-value="id"
+        emit-value
+        map-options
+        dense
+        outlined
+        style="min-width: 200px"
+        @update:model-value="themeChanged"
+      >
+        <template #option="scope">
+          <q-item v-bind="scope.itemProps">
+            <q-item-section>
+              <q-item-label>{{ scope.opt.name }}</q-item-label>
+            </q-item-section>
+            <q-item-section v-if="scope.opt.active" avatar>
+              <q-icon name="bi-check" />
+            </q-item-section>
+            <q-item-section v-else avatar>
+              <w-icon-empty></w-icon-empty>
+            </q-item-section>
+          </q-item>
+        </template>
+      </q-select>
+      <q-btn :label="$t('theme.action.setDefaultTheme')" icon="bi-heart" no-caps outline dense padding="2px 10px" @click="defaultTheme" />
+      <q-btn :label="$t('add')" icon="add" no-caps outline dense padding="2px 10px" @click="prompt = true" />
+      <q-btn :label="$t('delete')" icon="delete" no-caps outline dense padding="2px 10px" @click="removeTheme" />
+      <q-btn :label="$t('save')" icon="save" no-caps outline dense padding="2px 10px" @click="saveTheme" />
+    </div>
+    <q-dialog v-model="prompt" persistent>
+      <q-card style="min-width: 350px">
+        <q-card-section class="q-pt-md">
+          <q-input v-model="configureName" :label="$t('name')" outlined dense autofocus @keyup.enter="prompt = false" />
+        </q-card-section>
+
+        <q-card-actions align="right" class="text-primary">
+          <q-btn v-close-popup flat :label="$t('cancel')" />
+          <q-btn v-close-popup flat :label="$t('confirm')" @click="newTheme" />
+        </q-card-actions>
+      </q-card>
+    </q-dialog>
   </div>
 </template>
-
 <script setup lang="ts">
-import { ref, onMounted } from 'vue';
-import { type CellStyle, Graph, InternalEvent } from '@maxgraph/core';
-import ToolBar from './ToolBar.vue';
-import SideBar from './SideBar.vue';
-import Editor from './Editor.vue';
-import Properties from './Properties.vue';
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useQuasar } from 'quasar';
+import { Environment, axios, Tools, NotifyManager } from '@/platform';
+
+const { t } = useI18n();
+const quasar = useQuasar();
+
+const selectedTab = ref('brand');
+const selectedTheme = ref('');
+const themeOptions = ref([]);
+const prompt = ref(false);
+const configureName = ref('');
+
+let configureMap = new Map<string, object>();
+
+const newTheme = () => {
+  axios.post(Environment.apiContextPath('/api/lcdp/configure'), { name: configureName.value }).then((response) => {
+    NotifyManager.info(t('success'));
+    refresh(() => {
+      selectedTheme.value = response.data.id;
+      configureName.value = '';
+    });
+  });
+};
+
+const themeChanged = (value) => {
+  const option = configureMap.get(value);
+  if (option) {
+    Tools.mergeObject(Environment.getConfigure(), option);
+  }
+};
+
+const defaultTheme = () => {
+  quasar
+    .dialog({
+      title: t('confirm'),
+      message: t('theme.action.setDefaultTheme.confirm', { themeName: configureMap.get(selectedTheme.value).name }),
+      cancel: true,
+      persistent: true,
+    })
+    .onOk(() => {
+      axios.post(Environment.apiContextPath('/api/lcdp/configure/activeConfigure/') + selectedTheme.value).then((response) => {
+        NotifyManager.info(t('success'));
+        refresh();
+      });
+    });
+};
+
+const removeTheme = () => {
+  quasar
+    .dialog({
+      title: t('confirm'),
+      message: t('theme.action.delete.confirm', { themeName: configureMap.get(selectedTheme.value).name }),
+      cancel: true,
+      persistent: true,
+    })
+    .onOk(() => {
+      axios.delete(Environment.apiContextPath('/api/lcdp/configure/') + selectedTheme.value).then((response) => {
+        NotifyManager.info(t('success'));
+        refresh();
+        selectedTheme.value = '';
+      });
+    });
+};
+
+const saveTheme = () => {
+  quasar
+    .dialog({
+      title: t('confirm'),
+      message: t('theme.action.save.confirm', { themeName: configureMap.get(selectedTheme.value).name }),
+      cancel: true,
+      persistent: true,
+    })
+    .onOk(() => {
+      const data = {};
+      Tools.mergeObject(data, configureMap.get(selectedTheme.value));
+      data.theme = Environment.getConfigure().theme;
+
+      axios.put(Environment.apiContextPath('/api/lcdp/configure/') + selectedTheme.value, data).then((response) => {
+        NotifyManager.info(t('success'));
+      });
+    });
+};
+
+const refresh = (callback?: any) => {
+  axios.get(Environment.apiContextPath('/api/lcdp/configure')).then((response) => {
+    configureMap.clear();
+    const options = [];
+    selectedTheme.value = '';
+
+    const items = response.data.content;
+    if (items && items.length > 0) {
+      for (const item of items) {
+        options.push(item);
+        configureMap.set(item.id, item);
+        if (item.active) {
+          selectedTheme.value = item.id;
+        }
+      }
+    }
+    themeOptions.value = options;
+    if (callback) {
+      callback();
+    }
+  });
+};
+
+refresh();
 </script>
diff --git a/io.sc.platform.core.frontend/template-project/package.json b/io.sc.platform.core.frontend/template-project/package.json
index d094d4d7..f2ac72bf 100644
--- a/io.sc.platform.core.frontend/template-project/package.json
+++ b/io.sc.platform.core.frontend/template-project/package.json
@@ -1,6 +1,6 @@
 {
   "name": "platform-core",
-  "version": "8.1.187",
+  "version": "8.1.189",
   "description": "前端核心包,用于快速构建前端的脚手架",
   "private": false,
   "keywords": [],
@@ -24,81 +24,81 @@
     "no-git-checks": true
   },
   "devDependencies": {
-    "@babel/core": "7.23.7",
-    "@babel/preset-env": "7.23.7",
-    "@babel/preset-typescript": "7.23.3",
-    "@babel/plugin-transform-class-properties": "7.23.3",
-    "@babel/plugin-transform-object-rest-spread": "7.23.4",
-    "@quasar/app-webpack": "3.12.1",
-    "@quasar/cli": "2.3.0",
+    "@babel/core": "7.24.4",
+    "@babel/preset-env": "7.24.4",
+    "@babel/preset-typescript": "7.24.1",
+    "@babel/plugin-transform-class-properties": "7.24.1",
+    "@babel/plugin-transform-object-rest-spread": "7.24.1",
+    "@quasar/app-webpack": "3.12.5",
+    "@quasar/cli": "2.4.0",
     "@types/mockjs": "1.0.10",
-    "@types/node": "20.10.6",
-    "@typescript-eslint/eslint-plugin": "6.17.0",
-    "@typescript-eslint/parser": "6.17.0",
-    "@vue/compiler-sfc": "3.4.3",
-    "@vue/babel-plugin-jsx": "1.1.5",
+    "@types/node": "20.12.7",
+    "@typescript-eslint/eslint-plugin": "7.7.1",
+    "@typescript-eslint/parser": "7.7.1",
+    "@vue/compiler-sfc": "3.4.24",
     "@webpack-cli/serve": "2.0.5",
-    "autoprefixer": "10.4.16",
+    "autoprefixer": "10.4.19",
     "babel-loader": "9.1.3",
     "clean-webpack-plugin": "4.0.0",
-    "copy-webpack-plugin": "11.0.0",
+    "copy-webpack-plugin": "12.0.2",
     "cross-env": "7.0.3",
-    "css-loader": "6.8.1",
+    "css-loader": "7.1.1",
     "eslint": "8.56.0",
     "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-prettier": "5.1.2",
-    "eslint-plugin-vue": "9.19.2",
-    "eslint-webpack-plugin": "4.0.1",
+    "eslint-plugin-prettier": "5.1.3",
+    "eslint-plugin-vue": "9.25.0",
+    "eslint-webpack-plugin": "4.1.0",
     "html-webpack-plugin": "5.6.0",
     "json5": "2.2.3",
-    "mini-css-extract-plugin": "2.7.6",
-    "nodemon": "3.0.2",
-    "postcss": "8.4.32",
-    "postcss-import": "16.0.0",
-    "postcss-loader": "7.3.4",
-    "postcss-preset-env": "9.3.0",
-    "prettier": "3.1.1",
-    "sass": "1.69.7",
-    "sass-loader": "13.3.3",
-    "typescript": "5.3.3",
+    "mini-css-extract-plugin": "2.9.0",
+    "nodemon": "3.1.0",
+    "postcss": "8.4.38",
+    "postcss-import": "16.1.0",
+    "postcss-loader": "8.1.1",
+    "postcss-preset-env": "9.5.9",
+    "prettier": "3.2.5",
+    "sass": "1.75.0",
+    "sass-loader": "14.2.1",
+    "typescript": "5.4.5",
     "vue-loader": "17.4.2",
-    "webpack": "5.89.0",
-    "webpack-bundle-analyzer": "4.10.1",
+    "webpack": "5.91.0",
+    "webpack-bundle-analyzer": "4.10.2",
     "webpack-cli": "5.1.4",
-    "webpack-dev-server": "4.15.1",
-    "webpack-merge": "5.10.0"
+    "webpack-dev-server": "5.0.4",
+    "webpack-merge": "5.10.0",
+    "@vue/babel-plugin-jsx": "1.2.2"
   },
   "dependencies": {
-    "@codemirror/autocomplete": "6.11.1",
-    "@codemirror/commands": "6.3.3",
-    "@codemirror/lang-html": "6.4.7",
+    "@codemirror/autocomplete": "6.16.0",
+    "@codemirror/commands": "6.5.0",
+    "@codemirror/lang-html": "6.4.9",
     "@codemirror/lang-java": "6.0.1",
-    "@codemirror/lang-javascript": "6.2.1",
+    "@codemirror/lang-javascript": "6.2.2",
     "@codemirror/lang-json": "6.0.1",
-    "@codemirror/lang-sql": "6.5.4",
-    "@codemirror/lang-xml": "6.0.2",
-    "@codemirror/language": "6.10.0",
-    "@codemirror/search": "6.5.5",
-    "@codemirror/state": "6.4.0",
-    "@codemirror/view": "6.23.0",
-    "@maxgraph/core": "0.9.0",
-    "@quasar/extras": "1.16.9",
-    "@vueuse/core": "10.7.1",
-    "axios": "1.6.3",
+    "@codemirror/lang-sql": "6.6.3",
+    "@codemirror/lang-xml": "6.1.0",
+    "@codemirror/language": "6.10.1",
+    "@codemirror/search": "6.5.6",
+    "@codemirror/state": "6.4.1",
+    "@codemirror/view": "6.26.3",
+    "@maxgraph/core": "0.10.0",
+    "@quasar/extras": "1.16.11",
+    "@vueuse/core": "10.9.0",
+    "axios": "1.6.8",
     "codemirror": "6.0.1",
     "dayjs": "1.11.10",
-    "echarts": "5.4.3",
+    "echarts": "5.5.0",
     "exceljs": "4.4.0",
     "file-saver": "2.0.5",
     "luckyexcel": "1.0.1",
     "mockjs": "1.1.0",
     "pinia": "2.1.7",
-    "platform-core": "8.1.187",
-    "quasar": "2.14.5",
-    "tailwindcss": "3.4.0",
-    "vue": "3.4.3",
+    "platform-core": "8.1.189",
+    "quasar": "2.15.3",
+    "tailwindcss": "3.4.3",
+    "vue": "3.4.24",
     "vue-dompurify-html": "5.0.1",
-    "vue-i18n": "9.8.0",
-    "vue-router": "4.2.5"
+    "vue-i18n": "9.13.1",
+    "vue-router": "4.3.2"
   }
 }
\ No newline at end of file
diff --git a/io.sc.platform.core.frontend/template-project/src/components/index.ts b/io.sc.platform.core.frontend/template-project/src/components/index.ts
index a1d3e7cb..940d5b83 100644
--- a/io.sc.platform.core.frontend/template-project/src/components/index.ts
+++ b/io.sc.platform.core.frontend/template-project/src/components/index.ts
@@ -2,7 +2,7 @@
  * 此文件为自动生成文件,请勿修改
  */
 
-import component_testcase_formElements from '@/views/exportdata.vue';
+import component_testcase_formElements from '@/views/FormElements.vue';
 import component_testcase_likmDialog from '@/views/likm/Dialog.vue';
 import component_testcase_likmDrawer from '@/views/likm/Drawer.vue';
 import component_testcase_likmForm from '@/views/likm/Form.vue';
diff --git a/io.sc.platform.core.frontend/template-project/src/routes/routes.json b/io.sc.platform.core.frontend/template-project/src/routes/routes.json
index e4ce54d2..6d5af58e 100644
--- a/io.sc.platform.core.frontend/template-project/src/routes/routes.json
+++ b/io.sc.platform.core.frontend/template-project/src/routes/routes.json
@@ -5,7 +5,7 @@
     "parent": "/",
     "priority": 0,
     "component": "component.testcase.formElements",
-    "componentPath": "@/views/exportdata.vue",
+    "componentPath": "@/views/FormElements.vue",
     "redirect": null,
     "meta": {
       "permissions": ["/testcase/formElements/**/*"]
diff --git a/io.sc.platform.core.frontend/template-project/src/views/FormElements copy.vue b/io.sc.platform.core.frontend/template-project/src/views/FormElements copy.vue
new file mode 100644
index 00000000..119cf2d6
--- /dev/null
+++ b/io.sc.platform.core.frontend/template-project/src/views/FormElements copy.vue	
@@ -0,0 +1,157 @@
+<template>
+  <div>
+    <div class="row justify-end q-gutter-md q-py-md">
+      <q-select
+        v-model="selectedTheme"
+        :label="$t('theme')"
+        :options="themeOptions"
+        option-label="name"
+        option-value="id"
+        emit-value
+        map-options
+        dense
+        outlined
+        style="min-width: 200px"
+        @update:model-value="themeChanged"
+      >
+        <template #option="scope">
+          <q-item v-bind="scope.itemProps">
+            <q-item-section>
+              <q-item-label>{{ scope.opt.name }}</q-item-label>
+            </q-item-section>
+            <q-item-section v-if="scope.opt.active" avatar>
+              <q-icon name="bi-check" />
+            </q-item-section>
+            <q-item-section v-else avatar>
+              <w-icon-empty></w-icon-empty>
+            </q-item-section>
+          </q-item>
+        </template>
+      </q-select>
+      <q-btn :label="$t('theme.action.setDefaultTheme')" icon="bi-heart" no-caps outline dense padding="2px 10px" @click="defaultTheme" />
+      <q-btn :label="$t('add')" icon="add" no-caps outline dense padding="2px 10px" @click="prompt = true" />
+      <q-btn :label="$t('delete')" icon="delete" no-caps outline dense padding="2px 10px" @click="removeTheme" />
+      <q-btn :label="$t('save')" icon="save" no-caps outline dense padding="2px 10px" @click="saveTheme" />
+    </div>    
+  </div>
+</template>
+<script setup lang="ts">
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useQuasar } from 'quasar';
+import { Environment, axios, Tools, NotifyManager } from 'platform-core';
+import Brand from './theme/Brand.vue';
+import LoadingBar from './theme/LoadingBar.vue';
+import Topper from './theme/Topper.vue';
+import Sider from './theme/Sider.vue';
+import TagViewBar from './theme/TagViewBar.vue';
+import Main from './theme/Main.vue';
+import Footer from './theme/Footer.vue';
+import Login from './theme/Login.vue';
+import Scroller from './theme/Scroller.vue';
+import Notifier from './theme/Notifier.vue';
+import Grid from './theme/Grid.vue';
+
+const { t } = useI18n();
+const quasar = useQuasar();
+
+const selectedTab = ref('brand');
+const selectedTheme = ref('');
+const themeOptions = ref([]);
+const prompt = ref(false);
+const configureName = ref('');
+
+let configureMap = new Map<string, object>();
+
+const newTheme = () => {
+  axios.post(Environment.apiContextPath('/api/lcdp/configure'), { name: configureName.value }).then((response) => {
+    NotifyManager.info(t('success'));
+    refresh(() => {
+      selectedTheme.value = response.data.id;
+      configureName.value = '';
+    });
+  });
+};
+
+const themeChanged = (value) => {
+  const option = configureMap.get(value);
+  if (option) {
+    Tools.mergeObject(Environment.getConfigure(), option);
+  }
+};
+
+const defaultTheme = () => {
+  quasar
+    .dialog({
+      title: t('confirm'),
+      message: t('theme.action.setDefaultTheme.confirm', { themeName: configureMap.get(selectedTheme.value).name }),
+      cancel: true,
+      persistent: true,
+    })
+    .onOk(() => {
+      axios.post(Environment.apiContextPath('/api/lcdp/configure/activeConfigure/') + selectedTheme.value).then((response) => {
+        NotifyManager.info(t('success'));
+        refresh();
+      });
+    });
+};
+
+const removeTheme = () => {
+  quasar
+    .dialog({
+      title: t('confirm'),
+      message: t('theme.action.delete.confirm', { themeName: configureMap.get(selectedTheme.value).name }),
+      cancel: true,
+      persistent: true,
+    })
+    .onOk(() => {
+      axios.delete(Environment.apiContextPath('/api/lcdp/configure/') + selectedTheme.value).then((response) => {
+        NotifyManager.info(t('success'));
+        refresh();
+        selectedTheme.value = '';
+      });
+    });
+};
+
+const saveTheme = () => {
+  quasar
+    .dialog({
+      title: t('confirm'),
+      message: t('theme.action.save.confirm', { themeName: configureMap.get(selectedTheme.value).name }),
+      cancel: true,
+      persistent: true,
+    })
+    .onOk(() => {
+      const data = {};
+      Tools.mergeObject(data, configureMap.get(selectedTheme.value));
+      data.theme = Environment.getConfigure().theme;
+
+      axios.put(Environment.apiContextPath('/api/lcdp/configure/') + selectedTheme.value, data).then((response) => {
+        NotifyManager.info(t('success'));
+      });
+    });
+};
+
+const refresh = (callback?: any) => {
+  axios.get(Environment.apiContextPath('/api/lcdp/configure')).then((response) => {
+    themeOptions.value.splice(0, themeOptions.value.length);
+    const items = response.data.content;
+    if (items && items.length > 0) {
+      const options = [];
+      for (const item of items) {
+        themeOptions.value.push(item);
+        configureMap.set(item.id, item);
+        if (item.active) {
+          selectedTheme.value = item.id;
+        }
+      }
+      //themeOptions.value = options;
+      if (callback) {
+        callback();
+      }
+    }
+  });
+};
+
+refresh();
+</script>
diff --git a/io.sc.platform.core.frontend/template-project/src/views/FormElements.vue b/io.sc.platform.core.frontend/template-project/src/views/FormElements.vue
index da8dd2d0..a788af33 100644
--- a/io.sc.platform.core.frontend/template-project/src/views/FormElements.vue
+++ b/io.sc.platform.core.frontend/template-project/src/views/FormElements.vue
@@ -1,25 +1,160 @@
 <template>
-  <div class="w-full border rounded-md" style="height: 100%">
-    <ToolBar></ToolBar>
-    <q-splitter :model-value="20" unit="%" separator-style="width:2px;" style="height: calc(100% - 50px)">
-      <template #before>
-        <SideBar></SideBar>
-      </template>
-      <template #after>
-        <q-splitter :model-value="65" unit="%" separator-style="width:2px;" style="height: 100%">
-          <template #before><Editor></Editor></template>
-          <template #after><Properties></Properties></template>
-        </q-splitter>
-      </template>
-    </q-splitter>
+  <div>
+    <div class="row justify-end q-gutter-md q-py-md">
+      <q-select
+        v-model="selectedTheme"
+        :label="$t('theme')"
+        :options="themeOptions"
+        option-label="name"
+        option-value="id"
+        emit-value
+        map-options
+        dense
+        outlined
+        style="min-width: 200px"
+        @update:model-value="themeChanged"
+      >
+        <template #option="scope">
+          <q-item v-bind="scope.itemProps">
+            <q-item-section>
+              <q-item-label>{{ scope.opt.name }}</q-item-label>
+            </q-item-section>
+            <q-item-section v-if="scope.opt.active" avatar>
+              <q-icon name="bi-check" />
+            </q-item-section>
+            <q-item-section v-else avatar>
+              <w-icon-empty></w-icon-empty>
+            </q-item-section>
+          </q-item>
+        </template>
+      </q-select>
+      <q-btn :label="$t('theme.action.setDefaultTheme')" icon="bi-heart" no-caps outline dense padding="2px 10px" @click="defaultTheme" />
+      <q-btn :label="$t('add')" icon="add" no-caps outline dense padding="2px 10px" @click="prompt = true" />
+      <q-btn :label="$t('delete')" icon="delete" no-caps outline dense padding="2px 10px" @click="removeTheme" />
+      <q-btn :label="$t('save')" icon="save" no-caps outline dense padding="2px 10px" @click="saveTheme" />
+    </div>
+    <q-dialog v-model="prompt" persistent>
+      <q-card style="min-width: 350px">
+        <q-card-section class="q-pt-md">
+          <q-input v-model="configureName" :label="$t('name')" outlined dense autofocus @keyup.enter="prompt = false" />
+        </q-card-section>
+
+        <q-card-actions align="right" class="text-primary">
+          <q-btn v-close-popup flat :label="$t('cancel')" />
+          <q-btn v-close-popup flat :label="$t('confirm')" @click="newTheme" />
+        </q-card-actions>
+      </q-card>
+    </q-dialog>
   </div>
 </template>
-
 <script setup lang="ts">
-import { ref, onMounted } from 'vue';
-import { type CellStyle, Graph, InternalEvent } from '@maxgraph/core';
-import ToolBar from './ToolBar.vue';
-import SideBar from './SideBar.vue';
-import Editor from './Editor.vue';
-import Properties from './Properties.vue';
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useQuasar } from 'quasar';
+import { Environment, axios, Tools, NotifyManager } from '@/platform';
+
+const { t } = useI18n();
+const quasar = useQuasar();
+
+const selectedTab = ref('brand');
+const selectedTheme = ref('');
+const themeOptions = ref([]);
+const prompt = ref(false);
+const configureName = ref('');
+
+let configureMap = new Map<string, object>();
+
+const newTheme = () => {
+  axios.post(Environment.apiContextPath('/api/lcdp/configure'), { name: configureName.value }).then((response) => {
+    NotifyManager.info(t('success'));
+    refresh(() => {
+      selectedTheme.value = response.data.id;
+      configureName.value = '';
+    });
+  });
+};
+
+const themeChanged = (value) => {
+  const option = configureMap.get(value);
+  if (option) {
+    Tools.mergeObject(Environment.getConfigure(), option);
+  }
+};
+
+const defaultTheme = () => {
+  quasar
+    .dialog({
+      title: t('confirm'),
+      message: t('theme.action.setDefaultTheme.confirm', { themeName: configureMap.get(selectedTheme.value).name }),
+      cancel: true,
+      persistent: true,
+    })
+    .onOk(() => {
+      axios.post(Environment.apiContextPath('/api/lcdp/configure/activeConfigure/') + selectedTheme.value).then((response) => {
+        NotifyManager.info(t('success'));
+        refresh();
+      });
+    });
+};
+
+const removeTheme = () => {
+  quasar
+    .dialog({
+      title: t('confirm'),
+      message: t('theme.action.delete.confirm', { themeName: configureMap.get(selectedTheme.value).name }),
+      cancel: true,
+      persistent: true,
+    })
+    .onOk(() => {
+      axios.delete(Environment.apiContextPath('/api/lcdp/configure/') + selectedTheme.value).then((response) => {
+        NotifyManager.info(t('success'));
+        refresh();
+        selectedTheme.value = '';
+      });
+    });
+};
+
+const saveTheme = () => {
+  quasar
+    .dialog({
+      title: t('confirm'),
+      message: t('theme.action.save.confirm', { themeName: configureMap.get(selectedTheme.value).name }),
+      cancel: true,
+      persistent: true,
+    })
+    .onOk(() => {
+      const data = {};
+      Tools.mergeObject(data, configureMap.get(selectedTheme.value));
+      data.theme = Environment.getConfigure().theme;
+
+      axios.put(Environment.apiContextPath('/api/lcdp/configure/') + selectedTheme.value, data).then((response) => {
+        NotifyManager.info(t('success'));
+      });
+    });
+};
+
+const refresh = (callback?: any) => {
+  axios.get(Environment.apiContextPath('/api/lcdp/configure')).then((response) => {
+    configureMap.clear();
+    const options = [];
+    selectedTheme.value = '';
+
+    const items = response.data.content;
+    if (items && items.length > 0) {
+      for (const item of items) {
+        options.push(item);
+        configureMap.set(item.id, item);
+        if (item.active) {
+          selectedTheme.value = item.id;
+        }
+      }
+    }
+    themeOptions.value = options;
+    if (callback) {
+      callback();
+    }
+  });
+};
+
+refresh();
 </script>
diff --git a/io.sc.platform.core.frontend/template-project/src/views/exportdata.vue b/io.sc.platform.core.frontend/template-project/src/views/exportdata.vue
deleted file mode 100644
index 6073fde4..00000000
--- a/io.sc.platform.core.frontend/template-project/src/views/exportdata.vue
+++ /dev/null
@@ -1,203 +0,0 @@
-<template>
-  <div>
-    <div class="row py-1 q-col-gutter-sm">
-      <div class="col-2">
-        <q-select
-          v-model="valueReactive.datasource"
-          :label="$t('developer.backend.export.liquibase.datasource')"
-          outlined
-          dense
-          emit-value
-          map-options
-          :options="datasourceOptionsRef"
-          @update:model-value="
-            (value) => {
-              datasourceChanged(value);
-            }
-          "
-        ></q-select>
-      </div>
-      <div class="col-2">
-        <q-select
-          v-model="valueReactive.schema"
-          :label="$t('developer.backend.export.liquibase.schema')"
-          outlined
-          dense
-          emit-value
-          map-options
-          :options="schemaOptionsRef"
-          @update:model-value="
-            (value) => {
-              schemaChanged(valueReactive.datasource, value);
-            }
-          "
-        ></q-select>
-      </div>
-      <div class="col-8">
-        <q-select
-          v-model="valueReactive.tables"
-          :label="$t('developer.backend.export.liquibase.tables')"
-          input-class="bg-red-200"
-          outlined
-          dense
-          emit-value
-          map-options
-          multiple
-          use-chips
-          :options="tablesOptionsRef"
-          @update:model-value="
-            (value) => {
-              if (value) {
-                if (value.length > 1) {
-                  valueReactive.sql = 'select * from ${table}';
-                } else {
-                  valueReactive.sql = 'select * from ' + value;
-                }
-              }
-            }
-          "
-        >
-          <template #append>
-            <q-btn
-              :title="$t('selectAll')"
-              icon="bi-check-square"
-              flat
-              dense
-              :disable="!(tablesOptionsRef?.length > 0)"
-              @click.stop.prevent="
-                () => {
-                  const selecteds = [];
-                  if (tablesOptionsRef) {
-                    for (const table of tablesOptionsRef) {
-                      selecteds.push(table.value);
-                    }
-                  }
-                  valueReactive.tables = selecteds;
-                }
-              "
-            />
-            <q-btn
-              :title="$t('unSelectAll')"
-              icon="bi-square"
-              flat
-              dense
-              :disable="!(tablesOptionsRef?.length > 0)"
-              @click.stop.prevent="
-                () => {
-                  valueReactive.tables = [];
-                }
-              "
-            />
-          </template>
-        </q-select>
-      </div>
-    </div>
-    <div class="row py-1 q-col-gutter-sm">
-      <div class="col-12">
-        <w-code-mirror v-model="valueReactive.sql" :label="$t('sql')" :rows="5" lang="sql"></w-code-mirror>
-      </div>
-    </div>
-
-    <div class="row justify-center q-gutter-md py-2">
-      <WProgressBtn
-        ref="progressBtnRef"
-        icon="bi-database-down"
-        :label="$t('export')"
-        data-url="/api/jdbc/data/traceExporterExecuteProgress"
-        @click="exportData"
-        @success="
-          (progressInfo) => {
-            Downloader.get(Environment.apiContextPath('/api/mvc/download?filePath=' + encodeURIComponent(progressInfo.result)));
-          }
-        "
-      ></WProgressBtn>
-    </div>
-  </div>
-</template>
-<script setup lang="ts">
-import { ref, reactive, onMounted, onUpdated } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { axios, blobAxios, Environment, DialogManager, Downloader } from '@/platform';
-import WProgressBtn from '../platform/components/progress/WProgressBtn.vue';
-
-const { t } = useI18n();
-const progressBtnRef = ref();
-const datasourceOptionsRef = ref([]);
-const schemaOptionsRef = ref([]);
-const tablesOptionsRef = ref([]);
-
-const valueReactive = reactive({
-  datasource: undefined,
-  schema: undefined,
-  tables: undefined,
-  sql: undefined,
-});
-
-const loadDatasource = () => {
-  axios.get(Environment.apiContextPath('/api/system/datasource?pageable=false&sortBy=name')).then((response) => {
-    const data = response?.data.content;
-    if (data && data.length > 0) {
-      datasourceOptionsRef.value.splice(0, datasourceOptionsRef.value.length);
-      for (let item of data) {
-        datasourceOptionsRef.value.push({ label: item.name, value: item.name });
-      }
-    }
-  });
-};
-
-const datasourceChanged = (datasource: string) => {
-  datasource = datasource || '';
-  axios.get(Environment.apiContextPath('/api/jdbc/metadata/getSchemas?datasource=' + datasource)).then((response) => {
-    const data = response?.data;
-    if (data && data.length > 0) {
-      schemaOptionsRef.value.splice(0, schemaOptionsRef.value.length);
-      tablesOptionsRef.value.splice(0, tablesOptionsRef.value.length);
-      for (let item of data) {
-        schemaOptionsRef.value.push({ label: item.name, value: item.name });
-      }
-    }
-  });
-};
-
-const schemaChanged = (datasource: string, schema: string) => {
-  datasource = datasource || '';
-  schema = schema || '';
-  axios.get(Environment.apiContextPath('/api/jdbc/metadata/getTables?datasource=' + datasource + '&schema=' + schema)).then((response) => {
-    const data = response?.data;
-    if (data && data.length > 0) {
-      tablesOptionsRef.value.splice(0, tablesOptionsRef.value.length);
-      for (let item of data) {
-        tablesOptionsRef.value.push({ label: item.name, value: item.name });
-      }
-    }
-  });
-};
-
-const exportData = (e) => {
-  DialogManager.confirm(t('developer.backend.export.liquibase.export.tip'), () => {
-    const data = valueReactive;
-    const config = {
-      datasource: data.datasource,
-      schema: data.schema,
-      tables: [],
-    };
-    const length = data.tables.length;
-    const sql = length === 1 ? data.sql : '';
-    for (let i = 0; i < length; i++) {
-      config.tables[i] = { name: data.tables[i], sql: sql ? sql : 'select * from ' + data.tables[i] };
-    }
-    axios.post(Environment.apiContextPath('/api/jdbc/data/exportData'), config).then((response) => {
-      progressBtnRef.value.start();
-    });
-  });
-};
-
-onMounted(() => {
-  loadDatasource();
-  datasourceChanged('');
-});
-
-onUpdated(() => {
-  loadDatasource();
-});
-</script>
diff --git a/io.sc.platform.developer.frontend/package.json b/io.sc.platform.developer.frontend/package.json
index 05d51272..0ce2b945 100644
--- a/io.sc.platform.developer.frontend/package.json
+++ b/io.sc.platform.developer.frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "io.sc.platform.developer.frontend",
-  "version": "8.1.37",
+  "version": "8.1.38",
   "description": "",
   "private": false,
   "keywords": [],
@@ -23,81 +23,81 @@
     "access": "public"
   },
   "devDependencies": {
-    "@babel/core": "7.23.7",
-    "@babel/preset-env": "7.23.7",
-    "@babel/preset-typescript": "7.23.3",
-    "@babel/plugin-transform-class-properties": "7.23.3",
-    "@babel/plugin-transform-object-rest-spread": "7.23.4",
-    "@quasar/app-webpack": "3.12.1",
-    "@quasar/cli": "2.3.0",
+    "@babel/core": "7.24.4",
+    "@babel/preset-env": "7.24.4",
+    "@babel/preset-typescript": "7.24.1",
+    "@babel/plugin-transform-class-properties": "7.24.1",
+    "@babel/plugin-transform-object-rest-spread": "7.24.1",
+    "@quasar/app-webpack": "3.12.5",
+    "@quasar/cli": "2.4.0",
     "@types/mockjs": "1.0.10",
-    "@types/node": "20.10.6",
-    "@typescript-eslint/eslint-plugin": "6.17.0",
-    "@typescript-eslint/parser": "6.17.0",
-    "@vue/compiler-sfc": "3.4.3",
+    "@types/node": "20.12.7",
+    "@typescript-eslint/eslint-plugin": "7.7.1",
+    "@typescript-eslint/parser": "7.7.1",
+    "@vue/compiler-sfc": "3.4.24",
     "@webpack-cli/serve": "2.0.5",
-    "autoprefixer": "10.4.16",
+    "autoprefixer": "10.4.19",
     "babel-loader": "9.1.3",
     "clean-webpack-plugin": "4.0.0",
-    "copy-webpack-plugin": "11.0.0",
+    "copy-webpack-plugin": "12.0.2",
     "cross-env": "7.0.3",
-    "css-loader": "6.8.1",
+    "css-loader": "7.1.1",
     "eslint": "8.56.0",
     "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-prettier": "5.1.2",
-    "eslint-plugin-vue": "9.19.2",
-    "eslint-webpack-plugin": "4.0.1",
+    "eslint-plugin-prettier": "5.1.3",
+    "eslint-plugin-vue": "9.25.0",
+    "eslint-webpack-plugin": "4.1.0",
     "html-webpack-plugin": "5.6.0",
     "json5": "2.2.3",
-    "mini-css-extract-plugin": "2.7.6",
-    "nodemon": "3.0.2",
-    "postcss": "8.4.32",
-    "postcss-import": "16.0.0",
-    "postcss-loader": "7.3.4",
-    "postcss-preset-env": "9.3.0",
-    "prettier": "3.1.1",
-    "sass": "1.69.7",
-    "sass-loader": "13.3.3",
-    "typescript": "5.3.3",
+    "mini-css-extract-plugin": "2.9.0",
+    "nodemon": "3.1.0",
+    "postcss": "8.4.38",
+    "postcss-import": "16.1.0",
+    "postcss-loader": "8.1.1",
+    "postcss-preset-env": "9.5.9",
+    "prettier": "3.2.5",
+    "sass": "1.75.0",
+    "sass-loader": "14.2.1",
+    "typescript": "5.4.5",
     "vue-loader": "17.4.2",
-    "webpack": "5.89.0",
-    "webpack-bundle-analyzer": "4.10.1",
+    "webpack": "5.91.0",
+    "webpack-bundle-analyzer": "4.10.2",
     "webpack-cli": "5.1.4",
-    "webpack-dev-server": "4.15.1",
+    "webpack-dev-server": "5.0.4",
     "webpack-merge": "5.10.0",
-    "@vue/babel-plugin-jsx": "1.1.5"
+    "@vue/babel-plugin-jsx": "1.2.2"
   },
   "dependencies": {
-    "@codemirror/autocomplete": "6.11.1",
-    "@codemirror/commands": "6.3.3",
-    "@codemirror/lang-html": "6.4.7",
+    "@codemirror/autocomplete": "6.16.0",
+    "@codemirror/commands": "6.5.0",
+    "@codemirror/lang-html": "6.4.9",
     "@codemirror/lang-java": "6.0.1",
-    "@codemirror/lang-javascript": "6.2.1",
+    "@codemirror/lang-javascript": "6.2.2",
     "@codemirror/lang-json": "6.0.1",
-    "@codemirror/lang-sql": "6.5.4",
-    "@codemirror/lang-xml": "6.0.2",
-    "@codemirror/language": "6.10.0",
-    "@codemirror/search": "6.5.5",
-    "@codemirror/state": "6.4.0",
-    "@codemirror/view": "6.23.0",
-    "@maxgraph/core": "0.9.0",
-    "@quasar/extras": "1.16.9",
-    "@vueuse/core": "10.7.1",
-    "axios": "1.6.3",
+    "@codemirror/lang-sql": "6.6.3",
+    "@codemirror/lang-xml": "6.1.0",
+    "@codemirror/language": "6.10.1",
+    "@codemirror/search": "6.5.6",
+    "@codemirror/state": "6.4.1",
+    "@codemirror/view": "6.26.3",
+    "@maxgraph/core": "0.10.0",
+    "@quasar/extras": "1.16.11",
+    "@vueuse/core": "10.9.0",
+    "axios": "1.6.8",
     "codemirror": "6.0.1",
     "dayjs": "1.11.10",
-    "echarts": "5.4.3",
+    "echarts": "5.5.0",
     "exceljs": "4.4.0",
     "file-saver": "2.0.5",
     "luckyexcel": "1.0.1",
     "mockjs": "1.1.0",
     "pinia": "2.1.7",
-    "platform-core": "8.1.187",
-    "quasar": "2.14.5",
-    "tailwindcss": "3.4.0",
-    "vue": "3.4.3",
+    "platform-core": "8.1.189",
+    "quasar": "2.15.3",
+    "tailwindcss": "3.4.3",
+    "vue": "3.4.24",
     "vue-dompurify-html": "5.0.1",
-    "vue-i18n": "9.8.0",
-    "vue-router": "4.2.5"
+    "vue-i18n": "9.13.1",
+    "vue-router": "4.3.2"
   }
 }
\ No newline at end of file
diff --git a/io.sc.platform.developer.frontend/src/views/backend/ExportLiquibase.vue b/io.sc.platform.developer.frontend/src/views/backend/ExportLiquibase.vue
index 5a23508a..1ce5d2fb 100644
--- a/io.sc.platform.developer.frontend/src/views/backend/ExportLiquibase.vue
+++ b/io.sc.platform.developer.frontend/src/views/backend/ExportLiquibase.vue
@@ -93,7 +93,7 @@
     </div>
     <div class="row py-1 q-col-gutter-sm">
       <div class="col-12">
-        <w-code-mirror v-model="valueReactive.sql" :label="$t('sql')" :rows="5" lang="sql"></w-code-mirror>
+        <w-code-mirror v-model="valueReactive.sql" label="SQL" :rows="5" lang="sql"></w-code-mirror>
       </div>
     </div>
 
@@ -134,12 +134,13 @@ const valueReactive = reactive({
 const loadDatasource = () => {
   axios.get(Environment.apiContextPath('/api/system/datasource?pageable=false&sortBy=name')).then((response) => {
     const data = response?.data.content;
+    const datasourceOptions = [];
     if (data && data.length > 0) {
-      datasourceOptionsRef.value.splice(0, datasourceOptionsRef.value.length);
       for (let item of data) {
-        datasourceOptionsRef.value.push({ label: item.name, value: item.name });
+        datasourceOptions.push({ label: item.name, value: item.name });
       }
     }
+    datasourceOptionsRef.value = datasourceOptions;
   });
 };
 
@@ -147,13 +148,14 @@ const datasourceChanged = (datasource: string) => {
   datasource = datasource || '';
   axios.get(Environment.apiContextPath('/api/jdbc/metadata/getSchemas?datasource=' + datasource)).then((response) => {
     const data = response?.data;
+    const schemaOptions = [];
     if (data && data.length > 0) {
-      schemaOptionsRef.value.splice(0, schemaOptionsRef.value.length);
-      tablesOptionsRef.value.splice(0, tablesOptionsRef.value.length);
       for (let item of data) {
-        schemaOptionsRef.value.push({ label: item.name, value: item.name });
+        schemaOptions.push({ label: item.name, value: item.name });
       }
     }
+    schemaOptionsRef.value = schemaOptions;
+    tablesOptionsRef.value = [];
   });
 };
 
@@ -162,12 +164,13 @@ const schemaChanged = (datasource: string, schema: string) => {
   schema = schema || '';
   axios.get(Environment.apiContextPath('/api/jdbc/metadata/getTables?datasource=' + datasource + '&schema=' + schema)).then((response) => {
     const data = response?.data;
+    const tablesOptions = [];
     if (data && data.length > 0) {
-      tablesOptionsRef.value.splice(0, tablesOptionsRef.value.length);
       for (let item of data) {
-        tablesOptionsRef.value.push({ label: item.name, value: item.name });
+        tablesOptions.push({ label: item.name, value: item.name });
       }
     }
+    tablesOptionsRef.value = tablesOptions;
   });
 };
 
@@ -191,11 +194,8 @@ const exportData = (e) => {
 };
 
 onMounted(() => {
+  console.log('onMounted');
   loadDatasource();
   datasourceChanged('');
 });
-
-onUpdated(() => {
-  loadDatasource();
-});
 </script>
diff --git a/io.sc.platform.developer.frontend/src/views/backend/ImportLiquibase.vue b/io.sc.platform.developer.frontend/src/views/backend/ImportLiquibase.vue
index 5cf1e741..c862d097 100644
--- a/io.sc.platform.developer.frontend/src/views/backend/ImportLiquibase.vue
+++ b/io.sc.platform.developer.frontend/src/views/backend/ImportLiquibase.vue
@@ -86,20 +86,17 @@ const importData = () => {
 const loadDatasource = () => {
   axios.get(Environment.apiContextPath('/api/system/datasource?pageable=false&sortBy=name')).then((response) => {
     const data = response?.data.content;
+    const datasourceOptions = [];
     if (data && data.length > 0) {
-      datasourceOptionsRef.value.splice(0, datasourceOptionsRef.value.length);
       for (let item of data) {
-        datasourceOptionsRef.value.push({ label: item.name, value: item.name });
+        datasourceOptions.push({ label: item.name, value: item.name });
       }
     }
+    datasourceOptionsRef.value = datasourceOptions;
   });
 };
 
 onMounted(() => {
   loadDatasource();
 });
-
-onUpdated(() => {
-  loadDatasource();
-});
 </script>
diff --git a/io.sc.platform.gradle/templates/pgp/app/build.gradle b/io.sc.platform.gradle/templates/pgp/app/build.gradle
index 70233485..af883441 100644
--- a/io.sc.platform.gradle/templates/pgp/app/build.gradle
+++ b/io.sc.platform.gradle/templates/pgp/app/build.gradle
@@ -27,8 +27,8 @@ dependencies {
 
 		project(":erm"),
 
-//		project(":erm"),
-//		project(":erm.frontend"),
+		project(":erm"),
+		project(":erm.frontend"),
 
 //		project(":io.sc.platform.scheduler.manager"),
 	)
diff --git a/io.sc.platform.gradle/templates/pgp/setup/gradle.properties b/io.sc.platform.gradle/templates/pgp/setup/gradle.properties
index 40952aca..d52c8272 100644
--- a/io.sc.platform.gradle/templates/pgp/setup/gradle.properties
+++ b/io.sc.platform.gradle/templates/pgp/setup/gradle.properties
@@ -36,9 +36,9 @@ application_version=1.0.0
 # platform
 ###########################################################
 platform_group=io.sc
-platform_version=8.1.37
+platform_version=8.1.38
 platform_plugin_version=8.1.13
-platform_core_frontend_version=8.1.182
+platform_core_frontend_version=8.1.188
 
 ###########################################################
 # dependencies version
diff --git a/io.sc.platform.lcdp.frontend/package copy.json b/io.sc.platform.lcdp.frontend/package copy.json
new file mode 100644
index 00000000..ae2879d0
--- /dev/null
+++ b/io.sc.platform.lcdp.frontend/package copy.json	
@@ -0,0 +1,103 @@
+{
+  "name": "io.sc.platform.lcdp.frontend",
+  "version": "8.1.38",
+  "description": "",
+  "private": false,
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "scripts": {
+    "clean": "rm -rf ./node_modules && rm -rf pnpm-lock.yaml",
+    "dev": "nodemon",
+    "serve": "node ./util-components-generator.cjs && cross-env NODE_ENV=development  webpack serve --config webpack.env.serve.cjs",
+    "build": "node ./util-components-generator.cjs && cross-env NODE_ENV=development  webpack       --config webpack.env.build.cjs",
+    "prod": "node ./util-components-generator.cjs && cross-env  NODE_ENV=production   webpack       --config webpack.env.prod.cjs",
+    "sync": "platform sync"
+  },
+  "engines": {
+    "node": ">=18",
+    "pnpm": ">=7"
+  },
+  "publishConfig": {
+    "registry": "http://nexus.sc.io:8000/repository/npm-releases/",
+    "access": "public"
+  },
+  "devDependencies": {
+    "@babel/core": "7.23.7",
+    "@babel/preset-env": "7.23.7",
+    "@babel/preset-typescript": "7.23.3",
+    "@babel/plugin-transform-class-properties": "7.23.3",
+    "@babel/plugin-transform-object-rest-spread": "7.23.4",
+    "@quasar/app-webpack": "3.12.1",
+    "@quasar/cli": "2.3.0",
+    "@types/mockjs": "1.0.10",
+    "@types/node": "20.10.6",
+    "@typescript-eslint/eslint-plugin": "6.17.0",
+    "@typescript-eslint/parser": "6.17.0",
+    "@vue/compiler-sfc": "3.4.3",
+    "@webpack-cli/serve": "2.0.5",
+    "autoprefixer": "10.4.16",
+    "babel-loader": "9.1.3",
+    "clean-webpack-plugin": "4.0.0",
+    "copy-webpack-plugin": "11.0.0",
+    "cross-env": "7.0.3",
+    "css-loader": "6.8.1",
+    "eslint": "8.56.0",
+    "eslint-config-prettier": "9.1.0",
+    "eslint-plugin-prettier": "5.1.2",
+    "eslint-plugin-vue": "9.19.2",
+    "eslint-webpack-plugin": "4.0.1",
+    "html-webpack-plugin": "5.6.0",
+    "json5": "2.2.3",
+    "mini-css-extract-plugin": "2.7.6",
+    "nodemon": "3.0.2",
+    "postcss": "8.4.32",
+    "postcss-import": "16.0.0",
+    "postcss-loader": "7.3.4",
+    "postcss-preset-env": "9.3.0",
+    "prettier": "3.1.1",
+    "sass": "1.69.7",
+    "sass-loader": "13.3.3",
+    "typescript": "5.3.3",
+    "vue-loader": "17.4.2",
+    "webpack": "5.89.0",
+    "webpack-bundle-analyzer": "4.10.1",
+    "webpack-cli": "5.1.4",
+    "webpack-dev-server": "4.15.1",
+    "webpack-merge": "5.10.0",
+    "@vue/babel-plugin-jsx": "1.1.5"
+  },
+  "dependencies": {
+    "@codemirror/autocomplete": "6.11.1",
+    "@codemirror/commands": "6.3.3",
+    "@codemirror/lang-html": "6.4.7",
+    "@codemirror/lang-java": "6.0.1",
+    "@codemirror/lang-javascript": "6.2.1",
+    "@codemirror/lang-json": "6.0.1",
+    "@codemirror/lang-sql": "6.5.4",
+    "@codemirror/lang-xml": "6.0.2",
+    "@codemirror/language": "6.10.0",
+    "@codemirror/search": "6.5.5",
+    "@codemirror/state": "6.4.0",
+    "@codemirror/view": "6.23.0",
+    "@maxgraph/core": "0.9.0",
+    "@quasar/extras": "1.16.9",
+    "@vueuse/core": "10.7.1",
+    "axios": "1.6.3",
+    "codemirror": "6.0.1",
+    "dayjs": "1.11.10",
+    "echarts": "5.4.3",
+    "exceljs": "4.4.0",
+    "file-saver": "2.0.5",
+    "luckyexcel": "1.0.1",
+    "mockjs": "1.1.0",
+    "pinia": "2.1.7",
+    "platform-core": "8.1.188",
+    "quasar": "2.14.5",
+    "tailwindcss": "3.4.0",
+    "vue": "3.4.3",
+    "vue-dompurify-html": "5.0.1",
+    "vue-i18n": "9.8.0",
+    "vue-router": "4.2.5"
+  }
+}
\ No newline at end of file
diff --git a/io.sc.platform.lcdp.frontend/package.json b/io.sc.platform.lcdp.frontend/package.json
index b4d48c57..7178bb65 100644
--- a/io.sc.platform.lcdp.frontend/package.json
+++ b/io.sc.platform.lcdp.frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "io.sc.platform.lcdp.frontend",
-  "version": "8.1.37",
+  "version": "8.1.38",
   "description": "",
   "private": false,
   "keywords": [],
@@ -23,81 +23,81 @@
     "access": "public"
   },
   "devDependencies": {
-    "@babel/core": "7.23.7",
-    "@babel/preset-env": "7.23.7",
-    "@babel/preset-typescript": "7.23.3",
-    "@babel/plugin-transform-class-properties": "7.23.3",
-    "@babel/plugin-transform-object-rest-spread": "7.23.4",
-    "@quasar/app-webpack": "3.12.1",
-    "@quasar/cli": "2.3.0",
+    "@babel/core": "7.24.4",
+    "@babel/preset-env": "7.24.4",
+    "@babel/preset-typescript": "7.24.1",
+    "@babel/plugin-transform-class-properties": "7.24.1",
+    "@babel/plugin-transform-object-rest-spread": "7.24.1",
+    "@quasar/app-webpack": "3.12.5",
+    "@quasar/cli": "2.4.0",
     "@types/mockjs": "1.0.10",
-    "@types/node": "20.10.6",
-    "@typescript-eslint/eslint-plugin": "6.17.0",
-    "@typescript-eslint/parser": "6.17.0",
-    "@vue/compiler-sfc": "3.4.3",
+    "@types/node": "20.12.7",
+    "@typescript-eslint/eslint-plugin": "7.7.1",
+    "@typescript-eslint/parser": "7.7.1",
+    "@vue/compiler-sfc": "3.4.24",
     "@webpack-cli/serve": "2.0.5",
-    "autoprefixer": "10.4.16",
+    "autoprefixer": "10.4.19",
     "babel-loader": "9.1.3",
     "clean-webpack-plugin": "4.0.0",
-    "copy-webpack-plugin": "11.0.0",
+    "copy-webpack-plugin": "12.0.2",
     "cross-env": "7.0.3",
-    "css-loader": "6.8.1",
+    "css-loader": "7.1.1",
     "eslint": "8.56.0",
     "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-prettier": "5.1.2",
-    "eslint-plugin-vue": "9.19.2",
-    "eslint-webpack-plugin": "4.0.1",
+    "eslint-plugin-prettier": "5.1.3",
+    "eslint-plugin-vue": "9.25.0",
+    "eslint-webpack-plugin": "4.1.0",
     "html-webpack-plugin": "5.6.0",
     "json5": "2.2.3",
-    "mini-css-extract-plugin": "2.7.6",
-    "nodemon": "3.0.2",
-    "postcss": "8.4.32",
-    "postcss-import": "16.0.0",
-    "postcss-loader": "7.3.4",
-    "postcss-preset-env": "9.3.0",
-    "prettier": "3.1.1",
-    "sass": "1.69.7",
-    "sass-loader": "13.3.3",
-    "typescript": "5.3.3",
+    "mini-css-extract-plugin": "2.9.0",
+    "nodemon": "3.1.0",
+    "postcss": "8.4.38",
+    "postcss-import": "16.1.0",
+    "postcss-loader": "8.1.1",
+    "postcss-preset-env": "9.5.9",
+    "prettier": "3.2.5",
+    "sass": "1.75.0",
+    "sass-loader": "14.2.1",
+    "typescript": "5.4.5",
     "vue-loader": "17.4.2",
-    "webpack": "5.89.0",
-    "webpack-bundle-analyzer": "4.10.1",
+    "webpack": "5.91.0",
+    "webpack-bundle-analyzer": "4.10.2",
     "webpack-cli": "5.1.4",
-    "webpack-dev-server": "4.15.1",
+    "webpack-dev-server": "5.0.4",
     "webpack-merge": "5.10.0",
-    "@vue/babel-plugin-jsx": "1.1.5"
+    "@vue/babel-plugin-jsx": "1.2.2"
   },
   "dependencies": {
-    "@codemirror/autocomplete": "6.11.1",
-    "@codemirror/commands": "6.3.3",
-    "@codemirror/lang-html": "6.4.7",
+    "@codemirror/autocomplete": "6.16.0",
+    "@codemirror/commands": "6.5.0",
+    "@codemirror/lang-html": "6.4.9",
     "@codemirror/lang-java": "6.0.1",
-    "@codemirror/lang-javascript": "6.2.1",
+    "@codemirror/lang-javascript": "6.2.2",
     "@codemirror/lang-json": "6.0.1",
-    "@codemirror/lang-sql": "6.5.4",
-    "@codemirror/lang-xml": "6.0.2",
-    "@codemirror/language": "6.10.0",
-    "@codemirror/search": "6.5.5",
-    "@codemirror/state": "6.4.0",
-    "@codemirror/view": "6.23.0",
-    "@maxgraph/core": "0.9.0",
-    "@quasar/extras": "1.16.9",
-    "@vueuse/core": "10.7.1",
-    "axios": "1.6.3",
+    "@codemirror/lang-sql": "6.6.3",
+    "@codemirror/lang-xml": "6.1.0",
+    "@codemirror/language": "6.10.1",
+    "@codemirror/search": "6.5.6",
+    "@codemirror/state": "6.4.1",
+    "@codemirror/view": "6.26.3",
+    "@maxgraph/core": "0.10.0",
+    "@quasar/extras": "1.16.11",
+    "@vueuse/core": "10.9.0",
+    "axios": "1.6.8",
     "codemirror": "6.0.1",
     "dayjs": "1.11.10",
-    "echarts": "5.4.3",
+    "echarts": "5.5.0",
     "exceljs": "4.4.0",
     "file-saver": "2.0.5",
     "luckyexcel": "1.0.1",
     "mockjs": "1.1.0",
     "pinia": "2.1.7",
-    "platform-core": "8.1.182",
-    "quasar": "2.14.5",
-    "tailwindcss": "3.4.0",
-    "vue": "3.4.3",
+    "platform-core": "8.1.189",
+    "quasar": "2.15.3",
+    "tailwindcss": "3.4.3",
+    "vue": "3.4.24",
     "vue-dompurify-html": "5.0.1",
-    "vue-i18n": "9.8.0",
-    "vue-router": "4.2.5"
+    "vue-i18n": "9.13.1",
+    "vue-router": "4.3.2"
   }
 }
\ No newline at end of file
diff --git a/io.sc.platform.lcdp.frontend/src/views/Theme.vue b/io.sc.platform.lcdp.frontend/src/views/Theme.vue
index a021a78d..49df31f2 100644
--- a/io.sc.platform.lcdp.frontend/src/views/Theme.vue
+++ b/io.sc.platform.lcdp.frontend/src/views/Theme.vue
@@ -28,10 +28,10 @@
           </q-item>
         </template>
       </q-select>
-      <q-btn :label="$t('theme.action.setDefaultTheme')" no-caps outline @click="defaultTheme" />
-      <q-btn :label="$t('add')" no-caps outline @click="prompt = true" />
-      <q-btn :label="$t('delete')" no-caps outline @click="removeTheme" />
-      <q-btn :label="$t('save')" no-caps outline @click="saveTheme" />
+      <q-btn :label="$t('theme.action.setDefaultTheme')" icon="bi-heart" no-caps outline dense padding="2px 10px" @click="defaultTheme" />
+      <q-btn :label="$t('add')" icon="add" no-caps outline dense padding="2px 10px" @click="prompt = true" />
+      <q-btn :label="$t('delete')" icon="delete" no-caps outline dense padding="2px 10px" @click="removeTheme" />
+      <q-btn :label="$t('save')" icon="save" no-caps outline dense padding="2px 10px" @click="saveTheme" />
     </div>
 
     <div class="w-full flex flex-row flex-nowrap items-start pl-5">
@@ -92,7 +92,7 @@
     <q-dialog v-model="prompt" persistent>
       <q-card style="min-width: 350px">
         <q-card-section class="q-pt-md">
-          <q-input v-model="configureName" :label="$t('name')" outlined autofocus @keyup.enter="prompt = false" />
+          <q-input v-model="configureName" :label="$t('name')" outlined dense autofocus @keyup.enter="prompt = false" />
         </q-card-section>
 
         <q-card-actions align="right" class="text-primary">
@@ -104,7 +104,7 @@
   </div>
 </template>
 <script setup lang="ts">
-import { ref, toRaw } from 'vue';
+import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
 import { Environment, axios, Tools, NotifyManager } from 'platform-core';
@@ -202,9 +202,12 @@ const saveTheme = () => {
 
 const refresh = (callback?: any) => {
   axios.get(Environment.apiContextPath('/api/lcdp/configure')).then((response) => {
+    configureMap.clear();
+    const options = [];
+    selectedTheme.value = '';
+
     const items = response.data.content;
     if (items && items.length > 0) {
-      const options = [];
       for (const item of items) {
         options.push(item);
         configureMap.set(item.id, item);
@@ -212,10 +215,10 @@ const refresh = (callback?: any) => {
           selectedTheme.value = item.id;
         }
       }
-      themeOptions.value = options;
-      if (callback) {
-        callback();
-      }
+    }
+    themeOptions.value = options;
+    if (callback) {
+      callback();
     }
   });
 };
diff --git a/io.sc.platform.lcdp.frontend/src/views/bpm/JumpTaskDialog.vue b/io.sc.platform.lcdp.frontend/src/views/bpm/JumpTaskDialog.vue
index 21ad8cea..485c3430 100644
--- a/io.sc.platform.lcdp.frontend/src/views/bpm/JumpTaskDialog.vue
+++ b/io.sc.platform.lcdp.frontend/src/views/bpm/JumpTaskDialog.vue
@@ -37,10 +37,11 @@
           options: activityListRef,
           'onUpdate:modelValue': (value) => {
             axios.get(Environment.apiContextPath('/api/flowable/process/query/candidate?taskId=' + taskIdRef + '&activityId=' + value)).then((response) => {
-              candidateListRef.splice(0, candidateListRef.length);
+              const candidateList = [];
               for (const item of response.data) {
-                candidateListRef.push({ label: item.userName + '(' + item.loginName + ')', value: item.loginName });
+                candidateList.push({ label: item.userName + '(' + item.loginName + ')', value: item.loginName });
               }
+              candidateListRef = candidateList;
             });
           },
         },
@@ -65,10 +66,11 @@ const open = (taskId: string) => {
   if (taskId) {
     taskIdRef.value = taskId;
     axios.get(Environment.apiContextPath('/api/flowable/process/query/activity/' + taskId)).then((response) => {
-      activityListRef.value.splice(0, activityListRef.value.length);
+      const activityList = [];
       for (const item of response.data) {
-        activityListRef.value.push({ value: item.id, label: item.name });
+        activityList.push({ value: item.id, label: item.name });
       }
+      activityListRef.value = activityList;
     });
   }
   dialogRef.value.show();
diff --git a/io.sc.platform.mvc.frontend/package.json b/io.sc.platform.mvc.frontend/package.json
index 918f0d5b..188969cf 100644
--- a/io.sc.platform.mvc.frontend/package.json
+++ b/io.sc.platform.mvc.frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "io.sc.platform.mvc.frontend",
-  "version": "8.1.37",
+  "version": "8.1.38",
   "description": "",
   "private": false,
   "keywords": [],
@@ -23,81 +23,81 @@
     "access": "public"
   },
   "devDependencies": {
-    "@babel/core": "7.23.7",
-    "@babel/preset-env": "7.23.7",
-    "@babel/preset-typescript": "7.23.3",
-    "@babel/plugin-transform-class-properties": "7.23.3",
-    "@babel/plugin-transform-object-rest-spread": "7.23.4",
-    "@quasar/app-webpack": "3.12.1",
-    "@quasar/cli": "2.3.0",
+    "@babel/core": "7.24.4",
+    "@babel/preset-env": "7.24.4",
+    "@babel/preset-typescript": "7.24.1",
+    "@babel/plugin-transform-class-properties": "7.24.1",
+    "@babel/plugin-transform-object-rest-spread": "7.24.1",
+    "@quasar/app-webpack": "3.12.5",
+    "@quasar/cli": "2.4.0",
     "@types/mockjs": "1.0.10",
-    "@types/node": "20.10.6",
-    "@typescript-eslint/eslint-plugin": "6.17.0",
-    "@typescript-eslint/parser": "6.17.0",
-    "@vue/compiler-sfc": "3.4.3",
+    "@types/node": "20.12.7",
+    "@typescript-eslint/eslint-plugin": "7.7.1",
+    "@typescript-eslint/parser": "7.7.1",
+    "@vue/compiler-sfc": "3.4.24",
     "@webpack-cli/serve": "2.0.5",
-    "autoprefixer": "10.4.16",
+    "autoprefixer": "10.4.19",
     "babel-loader": "9.1.3",
     "clean-webpack-plugin": "4.0.0",
-    "copy-webpack-plugin": "11.0.0",
+    "copy-webpack-plugin": "12.0.2",
     "cross-env": "7.0.3",
-    "css-loader": "6.8.1",
+    "css-loader": "7.1.1",
     "eslint": "8.56.0",
     "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-prettier": "5.1.2",
-    "eslint-plugin-vue": "9.19.2",
-    "eslint-webpack-plugin": "4.0.1",
+    "eslint-plugin-prettier": "5.1.3",
+    "eslint-plugin-vue": "9.25.0",
+    "eslint-webpack-plugin": "4.1.0",
     "html-webpack-plugin": "5.6.0",
     "json5": "2.2.3",
-    "mini-css-extract-plugin": "2.7.6",
-    "nodemon": "3.0.2",
-    "postcss": "8.4.32",
-    "postcss-import": "16.0.0",
-    "postcss-loader": "7.3.4",
-    "postcss-preset-env": "9.3.0",
-    "prettier": "3.1.1",
-    "sass": "1.69.7",
-    "sass-loader": "13.3.3",
-    "typescript": "5.3.3",
+    "mini-css-extract-plugin": "2.9.0",
+    "nodemon": "3.1.0",
+    "postcss": "8.4.38",
+    "postcss-import": "16.1.0",
+    "postcss-loader": "8.1.1",
+    "postcss-preset-env": "9.5.9",
+    "prettier": "3.2.5",
+    "sass": "1.75.0",
+    "sass-loader": "14.2.1",
+    "typescript": "5.4.5",
     "vue-loader": "17.4.2",
-    "webpack": "5.89.0",
-    "webpack-bundle-analyzer": "4.10.1",
+    "webpack": "5.91.0",
+    "webpack-bundle-analyzer": "4.10.2",
     "webpack-cli": "5.1.4",
-    "webpack-dev-server": "4.15.1",
+    "webpack-dev-server": "5.0.4",
     "webpack-merge": "5.10.0",
-    "@vue/babel-plugin-jsx": "1.1.5"
+    "@vue/babel-plugin-jsx": "1.2.2"
   },
   "dependencies": {
-    "@codemirror/autocomplete": "6.11.1",
-    "@codemirror/commands": "6.3.3",
-    "@codemirror/lang-html": "6.4.7",
+    "@codemirror/autocomplete": "6.16.0",
+    "@codemirror/commands": "6.5.0",
+    "@codemirror/lang-html": "6.4.9",
     "@codemirror/lang-java": "6.0.1",
-    "@codemirror/lang-javascript": "6.2.1",
+    "@codemirror/lang-javascript": "6.2.2",
     "@codemirror/lang-json": "6.0.1",
-    "@codemirror/lang-sql": "6.5.4",
-    "@codemirror/lang-xml": "6.0.2",
-    "@codemirror/language": "6.10.0",
-    "@codemirror/search": "6.5.5",
-    "@codemirror/state": "6.4.0",
-    "@codemirror/view": "6.23.0",
-    "@maxgraph/core": "0.9.0",
-    "@quasar/extras": "1.16.9",
-    "@vueuse/core": "10.7.1",
-    "axios": "1.6.3",
+    "@codemirror/lang-sql": "6.6.3",
+    "@codemirror/lang-xml": "6.1.0",
+    "@codemirror/language": "6.10.1",
+    "@codemirror/search": "6.5.6",
+    "@codemirror/state": "6.4.1",
+    "@codemirror/view": "6.26.3",
+    "@maxgraph/core": "0.10.0",
+    "@quasar/extras": "1.16.11",
+    "@vueuse/core": "10.9.0",
+    "axios": "1.6.8",
     "codemirror": "6.0.1",
     "dayjs": "1.11.10",
-    "echarts": "5.4.3",
+    "echarts": "5.5.0",
     "exceljs": "4.4.0",
     "file-saver": "2.0.5",
     "luckyexcel": "1.0.1",
     "mockjs": "1.1.0",
     "pinia": "2.1.7",
-    "platform-core": "8.1.182",
-    "quasar": "2.14.5",
-    "tailwindcss": "3.4.0",
-    "vue": "3.4.3",
+    "platform-core": "8.1.189",
+    "quasar": "2.15.3",
+    "tailwindcss": "3.4.3",
+    "vue": "3.4.24",
     "vue-dompurify-html": "5.0.1",
-    "vue-i18n": "9.8.0",
-    "vue-router": "4.2.5"
+    "vue-i18n": "9.13.1",
+    "vue-router": "4.3.2"
   }
 }
\ No newline at end of file
diff --git a/io.sc.platform.security.frontend/package.json b/io.sc.platform.security.frontend/package.json
index 97c77491..863344b3 100644
--- a/io.sc.platform.security.frontend/package.json
+++ b/io.sc.platform.security.frontend/package.json
@@ -1,6 +1,6 @@
 {
     "name": "io.sc.platform.security.frontend",
-    "version": "8.1.37",
+    "version": "8.1.38",
     "description": "",
     "private": false,
     "keywords": [
@@ -93,7 +93,7 @@
         "luckyexcel": "1.0.1",
         "mockjs": "1.1.0",
         "pinia": "2.1.7",
-        "platform-core": "8.1.182",
+        "platform-core": "8.1.189",
         "quasar": "2.14.5",
         "tailwindcss": "3.4.0",
         "vue": "3.4.3",
diff --git a/io.sc.platform.system.frontend/package.json b/io.sc.platform.system.frontend/package.json
index d5bc9280..44b74a44 100644
--- a/io.sc.platform.system.frontend/package.json
+++ b/io.sc.platform.system.frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "io.sc.platform.system.frontend",
-  "version": "8.1.37",
+  "version": "8.1.38",
   "description": "",
   "private": false,
   "keywords": [],
@@ -23,81 +23,81 @@
     "access": "public"
   },
   "devDependencies": {
-    "@babel/core": "7.23.7",
-    "@babel/preset-env": "7.23.7",
-    "@babel/preset-typescript": "7.23.3",
-    "@babel/plugin-transform-class-properties": "7.23.3",
-    "@babel/plugin-transform-object-rest-spread": "7.23.4",
-    "@quasar/app-webpack": "3.12.1",
-    "@quasar/cli": "2.3.0",
+    "@babel/core": "7.24.4",
+    "@babel/preset-env": "7.24.4",
+    "@babel/preset-typescript": "7.24.1",
+    "@babel/plugin-transform-class-properties": "7.24.1",
+    "@babel/plugin-transform-object-rest-spread": "7.24.1",
+    "@quasar/app-webpack": "3.12.5",
+    "@quasar/cli": "2.4.0",
     "@types/mockjs": "1.0.10",
-    "@types/node": "20.10.6",
-    "@typescript-eslint/eslint-plugin": "6.17.0",
-    "@typescript-eslint/parser": "6.17.0",
-    "@vue/compiler-sfc": "3.4.3",
+    "@types/node": "20.12.7",
+    "@typescript-eslint/eslint-plugin": "7.7.1",
+    "@typescript-eslint/parser": "7.7.1",
+    "@vue/compiler-sfc": "3.4.24",
     "@webpack-cli/serve": "2.0.5",
-    "autoprefixer": "10.4.16",
+    "autoprefixer": "10.4.19",
     "babel-loader": "9.1.3",
     "clean-webpack-plugin": "4.0.0",
-    "copy-webpack-plugin": "11.0.0",
+    "copy-webpack-plugin": "12.0.2",
     "cross-env": "7.0.3",
-    "css-loader": "6.8.1",
+    "css-loader": "7.1.1",
     "eslint": "8.56.0",
     "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-prettier": "5.1.2",
-    "eslint-plugin-vue": "9.19.2",
-    "eslint-webpack-plugin": "4.0.1",
+    "eslint-plugin-prettier": "5.1.3",
+    "eslint-plugin-vue": "9.25.0",
+    "eslint-webpack-plugin": "4.1.0",
     "html-webpack-plugin": "5.6.0",
     "json5": "2.2.3",
-    "mini-css-extract-plugin": "2.7.6",
-    "nodemon": "3.0.2",
-    "postcss": "8.4.32",
-    "postcss-import": "16.0.0",
-    "postcss-loader": "7.3.4",
-    "postcss-preset-env": "9.3.0",
-    "prettier": "3.1.1",
-    "sass": "1.69.7",
-    "sass-loader": "13.3.3",
-    "typescript": "5.3.3",
+    "mini-css-extract-plugin": "2.9.0",
+    "nodemon": "3.1.0",
+    "postcss": "8.4.38",
+    "postcss-import": "16.1.0",
+    "postcss-loader": "8.1.1",
+    "postcss-preset-env": "9.5.9",
+    "prettier": "3.2.5",
+    "sass": "1.75.0",
+    "sass-loader": "14.2.1",
+    "typescript": "5.4.5",
     "vue-loader": "17.4.2",
-    "webpack": "5.89.0",
-    "webpack-bundle-analyzer": "4.10.1",
+    "webpack": "5.91.0",
+    "webpack-bundle-analyzer": "4.10.2",
     "webpack-cli": "5.1.4",
-    "webpack-dev-server": "4.15.1",
+    "webpack-dev-server": "5.0.4",
     "webpack-merge": "5.10.0",
-    "@vue/babel-plugin-jsx": "1.1.5"
+    "@vue/babel-plugin-jsx": "1.2.2"
   },
   "dependencies": {
-    "@codemirror/autocomplete": "6.11.1",
-    "@codemirror/commands": "6.3.3",
-    "@codemirror/lang-html": "6.4.7",
+    "@codemirror/autocomplete": "6.16.0",
+    "@codemirror/commands": "6.5.0",
+    "@codemirror/lang-html": "6.4.9",
     "@codemirror/lang-java": "6.0.1",
-    "@codemirror/lang-javascript": "6.2.1",
+    "@codemirror/lang-javascript": "6.2.2",
     "@codemirror/lang-json": "6.0.1",
-    "@codemirror/lang-sql": "6.5.4",
-    "@codemirror/lang-xml": "6.0.2",
-    "@codemirror/language": "6.10.0",
-    "@codemirror/search": "6.5.5",
-    "@codemirror/state": "6.4.0",
-    "@codemirror/view": "6.23.0",
-    "@maxgraph/core": "0.9.0",
-    "@quasar/extras": "1.16.9",
-    "@vueuse/core": "10.7.1",
-    "axios": "1.6.3",
+    "@codemirror/lang-sql": "6.6.3",
+    "@codemirror/lang-xml": "6.1.0",
+    "@codemirror/language": "6.10.1",
+    "@codemirror/search": "6.5.6",
+    "@codemirror/state": "6.4.1",
+    "@codemirror/view": "6.26.3",
+    "@maxgraph/core": "0.10.0",
+    "@quasar/extras": "1.16.11",
+    "@vueuse/core": "10.9.0",
+    "axios": "1.6.8",
     "codemirror": "6.0.1",
     "dayjs": "1.11.10",
-    "echarts": "5.4.3",
+    "echarts": "5.5.0",
     "exceljs": "4.4.0",
     "file-saver": "2.0.5",
     "luckyexcel": "1.0.1",
     "mockjs": "1.1.0",
     "pinia": "2.1.7",
-    "platform-core": "8.1.182",
-    "quasar": "2.14.5",
-    "tailwindcss": "3.4.0",
-    "vue": "3.4.3",
+    "platform-core": "8.1.189",
+    "quasar": "2.15.3",
+    "tailwindcss": "3.4.3",
+    "vue": "3.4.24",
     "vue-dompurify-html": "5.0.1",
-    "vue-i18n": "9.8.0",
-    "vue-router": "4.2.5"
+    "vue-i18n": "9.13.1",
+    "vue-router": "4.3.2"
   }
 }
\ No newline at end of file
diff --git a/io.sc.standard.frontend/package.json b/io.sc.standard.frontend/package.json
index 69e7d045..b7748103 100644
--- a/io.sc.standard.frontend/package.json
+++ b/io.sc.standard.frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "io.sc.standard.frontend",
-  "version": "8.1.37",
+  "version": "8.1.38",
   "description": "",
   "private": false,
   "keywords": [],
@@ -23,81 +23,81 @@
     "access": "public"
   },
   "devDependencies": {
-    "@babel/core": "7.23.7",
-    "@babel/preset-env": "7.23.7",
-    "@babel/preset-typescript": "7.23.3",
-    "@babel/plugin-transform-class-properties": "7.23.3",
-    "@babel/plugin-transform-object-rest-spread": "7.23.4",
-    "@quasar/app-webpack": "3.12.1",
-    "@quasar/cli": "2.3.0",
+    "@babel/core": "7.24.4",
+    "@babel/preset-env": "7.24.4",
+    "@babel/preset-typescript": "7.24.1",
+    "@babel/plugin-transform-class-properties": "7.24.1",
+    "@babel/plugin-transform-object-rest-spread": "7.24.1",
+    "@quasar/app-webpack": "3.12.5",
+    "@quasar/cli": "2.4.0",
     "@types/mockjs": "1.0.10",
-    "@types/node": "20.10.6",
-    "@typescript-eslint/eslint-plugin": "6.17.0",
-    "@typescript-eslint/parser": "6.17.0",
-    "@vue/compiler-sfc": "3.4.3",
+    "@types/node": "20.12.7",
+    "@typescript-eslint/eslint-plugin": "7.7.1",
+    "@typescript-eslint/parser": "7.7.1",
+    "@vue/compiler-sfc": "3.4.24",
     "@webpack-cli/serve": "2.0.5",
-    "autoprefixer": "10.4.16",
+    "autoprefixer": "10.4.19",
     "babel-loader": "9.1.3",
     "clean-webpack-plugin": "4.0.0",
-    "copy-webpack-plugin": "11.0.0",
+    "copy-webpack-plugin": "12.0.2",
     "cross-env": "7.0.3",
-    "css-loader": "6.8.1",
+    "css-loader": "7.1.1",
     "eslint": "8.56.0",
     "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-prettier": "5.1.2",
-    "eslint-plugin-vue": "9.19.2",
-    "eslint-webpack-plugin": "4.0.1",
+    "eslint-plugin-prettier": "5.1.3",
+    "eslint-plugin-vue": "9.25.0",
+    "eslint-webpack-plugin": "4.1.0",
     "html-webpack-plugin": "5.6.0",
     "json5": "2.2.3",
-    "mini-css-extract-plugin": "2.7.6",
-    "nodemon": "3.0.2",
-    "postcss": "8.4.32",
-    "postcss-import": "16.0.0",
-    "postcss-loader": "7.3.4",
-    "postcss-preset-env": "9.3.0",
-    "prettier": "3.1.1",
-    "sass": "1.69.7",
-    "sass-loader": "13.3.3",
-    "typescript": "5.3.3",
+    "mini-css-extract-plugin": "2.9.0",
+    "nodemon": "3.1.0",
+    "postcss": "8.4.38",
+    "postcss-import": "16.1.0",
+    "postcss-loader": "8.1.1",
+    "postcss-preset-env": "9.5.9",
+    "prettier": "3.2.5",
+    "sass": "1.75.0",
+    "sass-loader": "14.2.1",
+    "typescript": "5.4.5",
     "vue-loader": "17.4.2",
-    "webpack": "5.89.0",
-    "webpack-bundle-analyzer": "4.10.1",
+    "webpack": "5.91.0",
+    "webpack-bundle-analyzer": "4.10.2",
     "webpack-cli": "5.1.4",
-    "webpack-dev-server": "4.15.1",
+    "webpack-dev-server": "5.0.4",
     "webpack-merge": "5.10.0",
-    "@vue/babel-plugin-jsx": "1.1.5"
+    "@vue/babel-plugin-jsx": "1.2.2"
   },
   "dependencies": {
-    "@codemirror/autocomplete": "6.11.1",
-    "@codemirror/commands": "6.3.3",
-    "@codemirror/lang-html": "6.4.7",
+    "@codemirror/autocomplete": "6.16.0",
+    "@codemirror/commands": "6.5.0",
+    "@codemirror/lang-html": "6.4.9",
     "@codemirror/lang-java": "6.0.1",
-    "@codemirror/lang-javascript": "6.2.1",
+    "@codemirror/lang-javascript": "6.2.2",
     "@codemirror/lang-json": "6.0.1",
-    "@codemirror/lang-sql": "6.5.4",
-    "@codemirror/lang-xml": "6.0.2",
-    "@codemirror/language": "6.10.0",
-    "@codemirror/search": "6.5.5",
-    "@codemirror/state": "6.4.0",
-    "@codemirror/view": "6.23.0",
-    "@maxgraph/core": "0.9.0",
-    "@quasar/extras": "1.16.9",
-    "@vueuse/core": "10.7.1",
-    "axios": "1.6.3",
+    "@codemirror/lang-sql": "6.6.3",
+    "@codemirror/lang-xml": "6.1.0",
+    "@codemirror/language": "6.10.1",
+    "@codemirror/search": "6.5.6",
+    "@codemirror/state": "6.4.1",
+    "@codemirror/view": "6.26.3",
+    "@maxgraph/core": "0.10.0",
+    "@quasar/extras": "1.16.11",
+    "@vueuse/core": "10.9.0",
+    "axios": "1.6.8",
     "codemirror": "6.0.1",
     "dayjs": "1.11.10",
-    "echarts": "5.4.3",
+    "echarts": "5.5.0",
     "exceljs": "4.4.0",
     "file-saver": "2.0.5",
     "luckyexcel": "1.0.1",
     "mockjs": "1.1.0",
     "pinia": "2.1.7",
-    "platform-core": "8.1.183",
-    "quasar": "2.14.5",
-    "tailwindcss": "3.4.0",
-    "vue": "3.4.3",
+    "platform-core": "8.1.189",
+    "quasar": "2.15.3",
+    "tailwindcss": "3.4.3",
+    "vue": "3.4.24",
     "vue-dompurify-html": "5.0.1",
-    "vue-i18n": "9.8.0",
-    "vue-router": "4.2.5"
+    "vue-i18n": "9.13.1",
+    "vue-router": "4.3.2"
   }
 }
\ No newline at end of file
diff --git a/io.sc.standard.frontend/src/views/Standard.vue b/io.sc.standard.frontend/src/views/Standard.vue
index 5d96f1d7..270b7619 100644
--- a/io.sc.standard.frontend/src/views/Standard.vue
+++ b/io.sc.standard.frontend/src/views/Standard.vue
@@ -4,22 +4,24 @@
       <template #before>
         <q-tabs v-model="selectedTabRef" vertical>
           <q-tab name="Industry" no-caps>
-            <div class="text-left" style="width: 200px">{{ $t('standard.industry.grid.title') }}</div>
+            <div class="text-left" style="width: 200px" :title="$t('standard.industry.grid.title')">{{ $t('standard.industry.grid.title') }}</div>
           </q-tab>
           <q-tab name="AdminDivision" no-caps>
-            <div class="text-left" style="width: 200px">{{ $t('standard.adminDivision.grid.title') }}</div>
+            <div class="text-left" style="width: 200px" :title="$t('standard.adminDivision.grid.title')">{{ $t('standard.adminDivision.grid.title') }}</div>
           </q-tab>
           <q-tab name="PerformanceStatus" no-caps>
-            <div class="text-left" style="width: 200px">{{ $t('standard.performanceStatus.grid.title') }}</div>
+            <div class="text-left" style="width: 200px" :title="$t('standard.performanceStatus.grid.title')">
+              {{ $t('standard.performanceStatus.grid.title') }}
+            </div>
           </q-tab>
           <q-tab name="Counterparty" no-caps>
-            <div class="text-left" style="width: 200px">{{ $t('standard.counterparty.grid.title') }}</div>
+            <div class="text-left" style="width: 200px" :title="$t('standard.counterparty.grid.title')">{{ $t('standard.counterparty.grid.title') }}</div>
           </q-tab>
           <q-tab name="Country" no-caps>
-            <div class="text-left" style="width: 200px">{{ $t('standard.country.grid.title') }}</div>
+            <div class="text-left" style="width: 200px" :title="$t('standard.country.grid.title')">{{ $t('standard.country.grid.title') }}</div>
           </q-tab>
           <q-tab name="Currency" no-caps>
-            <div class="text-left" style="width: 200px">{{ $t('standard.currency.grid.title') }}</div>
+            <div class="text-left" style="width: 200px" :title="$t('standard.currency.grid.title')">{{ $t('standard.currency.grid.title') }}</div>
           </q-tab>
         </q-tabs>
       </template>
diff --git a/io.sc.standard.frontend/src/views/standard/Country.vue b/io.sc.standard.frontend/src/views/standard/Country.vue
index fd0a5189..3a2fb9b2 100644
--- a/io.sc.standard.frontend/src/views/standard/Country.vue
+++ b/io.sc.standard.frontend/src/views/standard/Country.vue
@@ -10,21 +10,17 @@
     primary-key="code"
     :data-url="Environment.apiContextPath('/api/standard/country')"
     :pageable="false"
-    :pagination="{
-      sortBy: 'codeLatin2',
-      descending: false,
-    }"
+    :sort-by="['codeLatin3']"
     :toolbar-configure="{ noIcon: false }"
     :toolbar-actions="['query', 'refresh', 'separator', 'add', 'edit', 'remove', 'separator', 'view', 'separator', 'export']"
     :query-form-cols-num="5"
     :query-form-fields="[
       { name: 'code', label: $t('standard.country.entity.code'), type: 'text', clearable: true },
-      { name: 'codeLatin2', label: $t('standard.country.entity.codeLatin2'), type: 'text', clearable: true },
       { name: 'codeLatin3', label: $t('standard.country.entity.codeLatin3'), type: 'text', clearable: true },
       { name: 'nameChinese', label: $t('standard.country.entity.nameChinese'), type: 'text', clearable: true },
       { name: 'nameEnglish', label: $t('standard.country.entity.nameEnglish'), type: 'text', clearable: true },
     ]"
-    :columns="columnsRef"
+    :columns="columnsComputed"
     :editor="{
       dialog: {
         width: '800px',
@@ -56,7 +52,7 @@
               if (val) {
                 update(() => {
                   const input = val.toUpperCase();
-                  currencyOptionsRef.splice(0, currencyOptionsRef.length);
+                  const currencyOptions = [];
                   for (const currency of currencyList) {
                     if (
                       currency.code?.indexOf(input) > -1 ||
@@ -66,20 +62,22 @@
                     ) {
                       const item = createCurrencyOptionItem(currency);
                       if (item) {
-                        currencyOptionsRef.push(item);
+                        currencyOptions.push(item);
                       }
                     }
                   }
+                  currencyOptionsRef = currencyOptions;
                 });
               } else {
                 update(() => {
-                  currencyOptionsRef.splice(0, currencyOptionsRef.length);
+                  const currencyOptions = [];
                   for (const currency of currencyList) {
                     const item = createCurrencyOptionItem(currency);
                     if (item) {
-                      currencyOptionsRef.push(item);
+                      currencyOptions.push(item);
                     }
                   }
+                  currencyOptionsRef = currencyOptions;
                 });
               }
             },
@@ -125,7 +123,7 @@
   ></w-grid>
 </template>
 <script setup lang="ts">
-import { ref, onMounted } from 'vue';
+import { ref, onMounted, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { axios, Environment, Formater, Options, eventBus } from 'platform-core';
 
@@ -136,7 +134,7 @@ const { t } = useI18n();
 const currencyOptionsRef = ref([]);
 const columnsRef = ref([
   { width: 70, name: 'code', label: t('code') },
-  { width: 70, name: 'codeLatin3', label: t('code') + '2' },
+  { width: 70, name: 'codeLatin3', label: t('code') + '3' },
   {
     width: 150,
     name: 'nameChinese',
@@ -196,6 +194,77 @@ const columnsRef = ref([
   { width: 120, name: 'lastModifyDate', label: t('lastModifyDate'), format: Formater.dateOnly() },
 ]);
 
+const columnsComputed = computed(() => {
+  const result = [
+    { width: 70, name: 'code', label: t('code') },
+    { width: 70, name: 'codeLatin3', label: t('code') + '3' },
+    {
+      width: 150,
+      name: 'nameChinese',
+      label: t('name'),
+      format: (value, row) => {
+        if (row) {
+          return getCountryName(row);
+        }
+      },
+    },
+    {
+      name: 'currency',
+      label: t('standard.entity.currency'),
+      columns: [
+        {
+          width: 70,
+          name: 'currencyCode',
+          label: t('code'),
+          sortable: false,
+          format: (value, row) => {
+            if (row.currency) {
+              return currencyMap[row.currency]?.code;
+            }
+          },
+        },
+        {
+          width: 70,
+          name: 'currencyCodeLatin',
+          label: t('code') + '2',
+          sortable: false,
+          format: (value, row) => {
+            if (row.currency) {
+              return currencyMap[row.currency]?.codeLatin;
+            }
+          },
+        },
+        {
+          width: 150,
+          name: 'currencyname',
+          label: t('name'),
+          sortable: false,
+          format: (value, row) => {
+            if (row.currency) {
+              return getCurrencyName(currencyMap[row.currency]);
+            }
+          },
+        },
+      ],
+    },
+    {
+      name: 'language',
+      label: t('standard.entity.language'),
+      columns: [{ width: 100, name: 'languageCode3', label: t('code') }],
+    },
+
+    { width: 100, name: 'lastModifier', label: t('lastModifier') },
+    { width: 120, name: 'lastModifyDate', label: t('lastModifyDate'), format: Formater.dateOnly() },
+  ];
+
+  if (Environment.getConfigure().setting.i18n.locale === 'zh_CN') {
+    result[2].name = 'nameChinese';
+  } else {
+    result[2].name = 'nameEnglish';
+  }
+  return result;
+});
+
 eventBus.on('localeChanged', (locale) => {
   currentLocale = locale;
   if (locale === 'zh_CN') {
@@ -225,9 +294,9 @@ eventBus.on('localeChanged', (locale) => {
 
 onMounted(() => {
   axios.get(Environment.apiContextPath('/api/standard/currency?pageable=false&sortBy=code')).then((response) => {
-    currencyOptionsRef.value.splice(0, currencyOptionsRef.value.length);
     currencyMap = {};
     currencyList = [];
+    const currencyOptions = [];
     if (response?.data?.content) {
       for (const currency of response.data.content) {
         currencyMap[currency.code] = currency;
@@ -237,10 +306,11 @@ onMounted(() => {
       for (const currency of currencyList) {
         const item = createCurrencyOptionItem(currency);
         if (item) {
-          currencyOptionsRef.value.push(item);
+          currencyOptions.push(item);
         }
       }
     }
+    currencyOptionsRef.value = currencyOptions;
   });
 });