diff --git a/src/hooks/useExpressionsProcessor.ts b/src/hooks/useExpressionsProcessor.ts
index 69537d65..c8d0c23e 100644
--- a/src/hooks/useExpressionsProcessor.ts
+++ b/src/hooks/useExpressionsProcessor.ts
@@ -14,23 +14,15 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import dayjs from "dayjs";
-import { RespFields, MetricQueryTypes, Calculations } from "./data";
+import { RespFields } from "./data";
 import { ExpressionResultType } from "@/views/dashboard/data";
 import { ElMessage } from "element-plus";
 import { useDashboardStore } from "@/store/modules/dashboard";
 import { useSelectorStore } from "@/store/modules/selectors";
 import { useAppStoreWithOut } from "@/store/modules/app";
-import type { Instance, Endpoint, Service } from "@/types/selector";
 import type { MetricConfigOpt } from "@/types/dashboard";
-import { MetricCatalog } from "@/views/dashboard/data";
-import { calculateExp, aggregation } from "./useMetricsProcessor";
 
-export function useExpressionsQueryProcessor(config: {
-  metrics: string[];
-  metricTypes: string[];
-  metricConfig: MetricConfigOpt[];
-}) {
+export function useExpressionsQueryProcessor(config: Indexable) {
   if (!(config.metrics && config.metrics[0])) {
     return;
   }
diff --git a/src/views/dashboard/configuration/Widget.vue b/src/views/dashboard/configuration/Widget.vue
index 812b4128..2a2ce3d8 100644
--- a/src/views/dashboard/configuration/Widget.vue
+++ b/src/views/dashboard/configuration/Widget.vue
@@ -128,6 +128,23 @@ limitations under the License. -->
 
       function applyConfig() {
         dashboardStore.setConfigPanel(false);
+        const { metricMode } = dashboardStore.selectedGrid;
+        let p = {};
+        if (metricMode === "Expression") {
+          p = {
+            metrics: [],
+            metricTypes: [],
+          };
+        } else {
+          p = {
+            expressions: [],
+            typesOfMQE: [],
+          };
+        }
+        dashboardStore.selectWidget({
+          ...dashboardStore.selectedGrid,
+          ...p,
+        });
         dashboardStore.setConfigs(dashboardStore.selectedGrid);
       }
 
diff --git a/src/views/dashboard/configuration/widget/metric/Standard.vue b/src/views/dashboard/configuration/widget/metric/Standard.vue
index 1442b4f5..26e75b99 100644
--- a/src/views/dashboard/configuration/widget/metric/Standard.vue
+++ b/src/views/dashboard/configuration/widget/metric/Standard.vue
@@ -56,7 +56,7 @@ limitations under the License. -->
         "
       />
     </div>
-    <div class="item mb-10" v-show="!isExpression">
+    <div class="item mb-10" v-show="dashboardStore.selectedGrid.metricMode !== 'Expression'">
       <span class="label">{{ t("aggregation") }}</span>
       <SelectSingle
         :value="currentMetric.calculation"
diff --git a/src/views/dashboard/controls/Widget.vue b/src/views/dashboard/controls/Widget.vue
index 52f1101e..60698d5f 100644
--- a/src/views/dashboard/controls/Widget.vue
+++ b/src/views/dashboard/controls/Widget.vue
@@ -77,6 +77,7 @@ limitations under the License. -->
   import graphs from "../graphs";
   import { useI18n } from "vue-i18n";
   import { useQueryProcessor, useSourceProcessor } from "@/hooks/useMetricsProcessor";
+  import { useExpressionsQueryProcessor, useExpressionsSourceProcessor } from "@/hooks/useExpressionsProcessor";
   import { EntityType, ListChartTypes } from "../data";
   import type { EventParams } from "@/types/dashboard";
   import getDashboard from "@/hooks/useDashboardsSession";
@@ -113,7 +114,14 @@ limitations under the License. -->
       }
 
       async function queryMetrics() {
-        const params = await useQueryProcessor({ ...props.data });
+        const isExpression = props.data.metricMode === "Expression";
+        const params = isExpression
+          ? await useExpressionsQueryProcessor({
+              metrics: props.data.expressions,
+              metricTypes: props.data.typesOfMQE,
+              metricConfig: props.data.metricConfig,
+            })
+          : await useQueryProcessor({ ...props.data });
 
         if (!params) {
           state.source = {};
@@ -130,7 +138,12 @@ limitations under the License. -->
           metricTypes: props.data.metricTypes || [],
           metricConfig: props.data.metricConfig || [],
         };
-        state.source = useSourceProcessor(json, d);
+        const e = {
+          metrics: props.data.expressions || [],
+          metricTypes: props.data.typesOfMQE || [],
+          metricConfig: props.data.metricConfig || [],
+        };
+        state.source = isExpression ? await useExpressionsSourceProcessor(json, e) : await useSourceProcessor(json, d);
       }
 
       function removeWidget() {
@@ -166,7 +179,7 @@ limitations under the License. -->
         dashboardStore.selectWidget(props.data);
       }
       watch(
-        () => [props.data.metricTypes, props.data.metrics],
+        () => [props.data.metricTypes, props.data.metrics, props.data.expressions],
         () => {
           if (!dashboardStore.selectedGrid) {
             return;