diff --git a/report-ui/src/views/report/bigscreen/designer/tools/echartsConfigJson/widget-notification.js b/report-ui/src/views/report/bigscreen/designer/tools/echartsConfigJson/widget-notification.js
new file mode 100644
index 0000000000000000000000000000000000000000..526e0a4022a1d515efc0eeda876e66230f0de74e
--- /dev/null
+++ b/report-ui/src/views/report/bigscreen/designer/tools/echartsConfigJson/widget-notification.js
@@ -0,0 +1,138 @@
+/*
+ * @Descripttion: 通知
+ * @version: 
+ * @Author: whw
+ * @Date: 2021-11-23
+ * @LastEditors: whw
+ * @LastEditTime: 2021-11-23
+ */
+export const widgetNotification = {
+  code: 'widget-notification',
+  type: 'chart',
+  label: '通知(开发中)',
+  icon: 'iconicon_tubiao_bingtu',
+  options: {
+    // 配置
+    setup: [
+      {
+        type: 'el-input-text',
+        label: '图层名称',
+        name: 'layerName',
+        required: false,
+        placeholder: '',
+        value: '通知',
+      },
+      {
+        type: 'el-input-text',
+        label: '通知标题',
+        name: 'title',
+        required: false,
+        placeholder: '',
+        value: ''
+      },
+      {
+        type: 'el-input-number',
+        label: '停留时间',
+        name: 'duration',
+        required: false,
+        placeholder: '单位 (ms)',
+        value: 4500
+      },
+      {
+        type: 'el-input-text',
+        label: '位置',
+        name: 'position',
+        required: false,
+        placeholder: 'top-right/top-left/bottom-right/bottom-left',
+        value: 'top-right'
+      },
+    ],
+    // 数据
+    data: [
+      {
+        type: 'el-radio-group',
+        label: '数据类型',
+        name: 'dataType',
+        require: false,
+        placeholder: '',
+        selectValue: true,
+        selectOptions: [
+          {
+            code: 'staticData',
+            name: '静态数据',
+          },
+          {
+            code: 'dynamicData',
+            name: '动态数据',
+          },
+        ],
+        value: 'staticData',
+      },
+      {
+        type: 'el-input-number',
+        label: '刷新时间(毫秒)',
+        name: 'refreshTime',
+        relactiveDom: 'dataType',
+        relactiveDomValue: 'dynamicData',
+        value: 5000
+      },
+      {
+        type: 'el-button',
+        label: '静态数据',
+        name: 'staticData',
+        required: false,
+        placeholder: '',
+        relactiveDom: 'dataType',
+        relactiveDomValue: 'staticData',
+        value: []
+      },
+      {
+        type: 'dycustComponents',
+        label: '',
+        name: 'dynamicData',
+        required: false,
+        placeholder: '',
+        relactiveDom: 'dataType',
+        chartType: 'widget-scatter',
+        relactiveDomValue: 'dynamicData',
+        fieldOption: [{ name: '标题', code: 'title' }, { name: '内容', code: 'message' }, { name: '类型', code: 'type' }],
+        value: '',
+      },
+    ],
+    // 坐标
+    position: [
+      {
+        type: 'el-input-number',
+        label: '左边距',
+        name: 'left',
+        required: false,
+        placeholder: '',
+        value: 0,
+      },
+      {
+        type: 'el-input-number',
+        label: '上边距',
+        name: 'top',
+        required: false,
+        placeholder: '',
+        value: 0,
+      },
+      {
+        type: 'el-input-number',
+        label: '宽度',
+        name: 'width',
+        required: false,
+        placeholder: '该容器在1920px大屏中的宽度',
+        value: 100,
+      },
+      {
+        type: 'el-input-number',
+        label: '高度',
+        name: 'height',
+        required: false,
+        placeholder: '该容器在1080px大屏中的高度',
+        value: 100,
+      },
+    ],
+  }
+}
diff --git a/report-ui/src/views/report/bigscreen/designer/widget/widgetNotification.vue b/report-ui/src/views/report/bigscreen/designer/widget/widgetNotification.vue
new file mode 100644
index 0000000000000000000000000000000000000000..f0958493e980f03958da5737891475f698cc7b6e
--- /dev/null
+++ b/report-ui/src/views/report/bigscreen/designer/widget/widgetNotification.vue
@@ -0,0 +1,100 @@
+<template></template>
+
+<script>
+import moment from "moment";
+export default {
+  name: "widgetNotification",
+  components: {},
+  props: {
+    value: Object,
+    ispreview: Boolean,
+  },
+  data() {
+    return {
+      lastTime: null,
+      options: {},
+      // optionsStyle: {}, // 样式
+      optionsData: {}, // 数据
+      // optionsCollapse: {}, // 图标属性
+      optionsSetup: {},
+    };
+  },
+  computed: {
+  },
+  created() {
+    this.lastTime = moment().format("YYYY-MM-DD HH:mm:ss");
+    this.optionsData = this.value.data;
+    this.optionsSetup = this.value.setup;
+    this.editorOptions();
+  },
+  methods: {
+    // 创建推送
+    createNotification(opt) {
+      // TODO create Notification
+      if (this.options.message) {
+        this.$notify(opt);
+      }
+    },
+    // 修改图标options属性
+    editorOptions() {
+      this.setOptionsValue();
+      this.setOptionsData();
+    },
+    // 数值设定
+    setOptionsValue() {
+      this.options = { ...this.optionsSetup };
+    },
+    setOptionsData() {
+      console.log("setOptionsData");
+      const optionsData = this.optionsData; // 数据类型 静态 or 动态
+
+      optionsData.dataType == "staticData"
+        ? this.staticDataFn(optionsData.dynamicData, optionsData.staticData)
+        : this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
+    },
+    staticDataFn(opt, val) {
+      console.log("staticDataFn");
+      const staticData = typeof val == "string" ? JSON.parse(val) : val;
+      this.renderingFn(opt, staticData);
+    },
+    dynamicDataFn(val, refreshTime) {
+      console.log("dynamicDataFn");
+      if (!val) return;
+      if (this.ispreview) {
+        this.getEchartData(val);
+        this.flagInter = setInterval(() => {
+          this.getEchartData(val);
+        }, refreshTime);
+      } else {
+        this.getEchartData(val);
+      }
+    },
+    getEchartData(val) {
+      val.contextData.last_time = this.lastTime;
+      console.log(val.contextData.last_time, "last_time");
+      const data = this.queryEchartsData(val);
+      data.then((res) => {
+        this.renderingFn(val, res);
+      });
+    },
+    async renderingFn(dynamicOpt, data) {
+      this.lastTime = moment().format("YYYY-MM-DD HH:mm:ss");
+      console.log(data, "data");
+
+      for (let i = 0; i < data.length; i++) {
+        if (i > 10) break;
+        let opt = Object.assign(this.options, data[i]);
+        await this.createNotification(opt);
+      }
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.echarts {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+</style>