diff --git a/config/dev.env.js b/config/dev.env.js
index 43bb744..d1355f8 100644
--- a/config/dev.env.js
+++ b/config/dev.env.js
@@ -4,8 +4,8 @@ const prodEnv = require('./prod.env')
 //是否开发状态
 const isDev = true;
 //开发API地址
- const devAdrress='"http://weberp.xlyprint.cn/xlyReport"';
-//const devAdrress='"http://127.0.0.1:8080/xlyReport"';
+const devAdrress='"http://weberp.xlyprint.cn/xlyReport"';
+// const devAdrress='"http://127.0.0.1:8080/xlyReport"';
 //正式打包API地址
 const ipAdrress='"http://"+location.host+"/xlyReport"';
 
diff --git a/package.json b/package.json
index 7de6ca1..7f0aed5 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
   },
   "dependencies": {
     "@ckeditor/ckeditor5-build-decoupled-document": "^23.1.0",
+    "@jiaminghi/c-render": "^0.4.3",
     "@jiaminghi/data-view": "^2.10.0",
     "@smallwei/avue": "^2.8.23",
     "axios": "0.18.0",
@@ -48,6 +49,7 @@
     "vuex": "3.0.1"
   },
   "devDependencies": {
+    "@jiaminghi/charts": "^0.2.18",
     "autoprefixer": "8.5.0",
     "babel-core": "6.26.0",
     "babel-helper-vue-jsx-merge-props": "2.0.3",
diff --git a/src/views/bigscreenDesigner/designer/components/LabelTag.vue b/src/views/bigscreenDesigner/designer/components/LabelTag.vue
new file mode 100644
index 0000000..7861e67
--- /dev/null
+++ b/src/views/bigscreenDesigner/designer/components/LabelTag.vue
@@ -0,0 +1,86 @@
+<template>
+  <div class="label-tag">
+    <template v-if="mergedConfig">
+      <div class="label-item" v-for="(label, i) in mergedConfig.data" :key="label" :style="mergedConfig.labelStyle">
+        <div :style="`background-color: ${mergedConfig.colors[i % mergedConfig.colors.length]};margin-right:5px`" />{{ label }}
+      </div>
+    </template>
+  </div>
+</template>
+
+<script>
+import { deepMerge } from '@jiaminghi/charts/lib/util/index'
+
+import { deepClone } from '@jiaminghi/c-render/lib/plugin/util'
+
+export default {
+  name: 'LabelTag',
+  props: {
+    config: {
+      type: Object,
+      default: () => ([])
+    }
+  },
+  data () {
+    return {
+      defaultConfig: {
+        /**
+         * @description Label data
+         * @type {Array<String>}
+         * @default data = []
+         * @example data = ['label1', 'label2']
+         */
+        data: [],
+        /**
+         * @description Label color (Hex|Rgb|Rgba|color keywords)
+         * @type {Array<String>}
+         * @default colors = ['#00baff', '#3de7c9', '#fff', '#ffc530', '#469f4b']
+         * @example colors = ['#666', 'rgb(0, 0, 0)', 'rgba(0, 0, 0, 1)', 'red']
+         */
+        colors: ['#00baff', '#3de7c9', '#fff', '#ffc530', '#469f4b']
+      },
+
+      mergedConfig: null
+    }
+  },
+  watch: {
+    config () {
+      const { mergeConfig } = this
+
+      mergeConfig()
+    }
+  },
+  methods: {
+    mergeConfig () {
+      let { config, defaultConfig } = this
+
+      this.mergedConfig = deepMerge(deepClone(defaultConfig, true), config || {})
+    }
+  },
+  mounted () {
+    const { mergeConfig } = this
+
+    mergeConfig()
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.label-tag {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  .label-item {
+    margin: 5px;
+    font-size: 25px;
+    display: flex;
+    align-items: center;
+    div {
+      width: 12px;
+      height: 12px;
+      margin-left: 5px;
+    }
+  }
+}
+</style>
diff --git a/src/views/bigscreenDesigner/designer/tools/configure/lineCharts/widget-line-stack.js b/src/views/bigscreenDesigner/designer/tools/configure/lineCharts/widget-line-stack.js
index 295494c..6a56bf5 100644
--- a/src/views/bigscreenDesigner/designer/tools/configure/lineCharts/widget-line-stack.js
+++ b/src/views/bigscreenDesigner/designer/tools/configure/lineCharts/widget-line-stack.js
@@ -794,8 +794,8 @@ export const widgetLineStack = {
         placeholder: '',
         relactiveDom: 'dataType',
         relactiveDomValue: 'dynamicData',
-        chartType: 'widget-stackchart',
-        dictKey: 'STACK_PROPERTIES',
+        chartType: 'widget-linechart_stack',
+        dictKey: 'LINE_STACK_PROPERTIES',
         value: '',
       },
     ],
diff --git a/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-active-ring-chart.js b/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-active-ring-chart.js
index 67ba2fa..e137393 100644
--- a/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-active-ring-chart.js
+++ b/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-active-ring-chart.js
@@ -90,20 +90,127 @@ export const widgetActiveRingChart=  {
         placeholder: '',
         value: ''
       },
-      [{
-        name: '环颜色',
-        list: [
-          {
-            type: 'customColor',
-            label: '',
-            name: 'customColor',
-            required: false,
-            value: [{ color: '#0CD2E6' }, { color: '#00BFA5' }, { color: '#FFC722' }, { color: '#886EFF' }, { color: '#008DEC' }],
-          },
-        ],
-      }],
       [
         {
+          name: '标题设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '标题显示',
+              name: 'isNoTitle',
+              required: false,
+              placeholder: '',
+              value: false,
+            },
+            {
+              type: 'el-input-text',
+              label: '标题名',
+              name: 'titleText',
+              required: false,
+              placeholder: '',
+              value: '标题名',
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'textColor',
+              required: false,
+              placeholder: '',
+              value: '#FFD700'
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'textFontSize',
+              required: false,
+              placeholder: '',
+              value: 20
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'textFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'textFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体位置',
+              name: 'textAlign',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'center', name: '居中' },
+                { code: 'left', name: '左对齐' },
+                { code: 'right', name: '右对齐' },
+              ],
+              value: 'center'
+            }
+          ],
+        },
+        {
+          name: '提示语设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '提示语显示',
+              name: 'isNoTipTitle',
+              required: false,
+              placeholder: '',
+              value: false,
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'tipFontSize',
+              required: false,
+              placeholder: '',
+              value: 16
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'tipsColor',
+              required: false,
+              placeholder: '',
+              value: '#00FEFF'
+            },
+            {
+              type: 'el-select',
+              label: '字体位置',
+              name: 'tipsAlign',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'up', name: '头部' },
+                { code: 'down', name: '底部' }
+
+              ],
+              value: 'down'
+            }
+          ],
+        },
+        {
           name: '数字翻牌器样式',
           list: [
             {
@@ -137,12 +244,22 @@ export const widgetActiveRingChart=  {
               value: 'normal'
             },
           ],
+        },
+        {
+          name: '环颜色',
+          list: [
+            {
+              type: 'customColor',
+              label: '',
+              name: 'customColor',
+              required: false,
+              value: [{ color: '#0CD2E6' }, { color: '#00BFA5' }, { color: '#FFC722' }, { color: '#886EFF' }, { color: '#008DEC' }],
+            },
+          ],
         }
       ]
-
     ],
     // 数据
-    // 数据
     data: [
       {
         type: 'el-radio-group',
diff --git a/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-radio-piechart.js b/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-radio-piechart.js
new file mode 100644
index 0000000..1e048aa
--- /dev/null
+++ b/src/views/bigscreenDesigner/designer/tools/configure/pieCharts/widget-radio-piechart.js
@@ -0,0 +1,451 @@
+/*
+ * @Descripttion: 空心饼图
+ */
+export const widgetRadioPiechart= {
+  code: 'widget-radio-piechart',
+  type: 'pieChart',
+  tabName: '饼图',
+  label: '空心饼图(待开发)',
+  icon: 'iconicon_tubiao_bingtu',
+  options: {
+    // 配置
+    setup: [
+      {
+        type: 'el-input-text',
+        label: '图层名称',
+        name: 'layerName',
+        required: false,
+        placeholder: '',
+        value: '空心饼图',
+      },
+      {
+        type: 'vue-color',
+        label: '背景颜色',
+        name: 'background',
+        required: false,
+        placeholder: '',
+        value: ''
+      },
+      {
+        type: 'el-select',
+        label: '饼图样式',
+        name: 'piechartStyle',
+        required: false,
+        placeholder: '',
+        selectOptions: [
+          { code: 'shixin', name: '实心饼图' },
+          { code: 'kongxin', name: '空心饼图' },
+        ],
+        value: 'shixin'
+      },
+      [
+        {
+          name: '标题设置',
+          list: [
+            {
+              type: 'el-switch',
+              label: '标题显示',
+              name: 'isNoTitle',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-input-text',
+              label: '标题名',
+              name: 'titleText',
+              required: false,
+              placeholder: '',
+              value: '',
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'textColor',
+              required: false,
+              placeholder: '',
+              value: '#FFD700'
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'textFontSize',
+              required: false,
+              placeholder: '',
+              value: 20
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'textFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'textFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体位置',
+              name: 'textAlign',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'center', name: '居中' },
+                { code: 'left', name: '左对齐' },
+                { code: 'right', name: '右对齐' },
+              ],
+              value: 'center'
+            },
+            {
+              type: 'el-input-text',
+              label: '副标题名',
+              name: 'subText',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'subTextColor',
+              required: false,
+              placeholder: '',
+              value: 'rgba(30, 144, 255, 1)'
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'subTextFontSize',
+              required: false,
+              placeholder: '',
+              value: 20
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'subTextFontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+            {
+              type: 'el-select',
+              label: '字体风格',
+              name: 'subTextFontStyle',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'italic', name: 'italic斜体' },
+                { code: 'oblique', name: 'oblique斜体' },
+              ],
+              value: 'normal'
+            },
+          ],
+        },
+        {
+          name: '数值设定',
+          list: [
+            {
+              type: 'el-switch',
+              label: '显示',
+              name: 'isShow',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '标题',
+              name: 'isShowTitle',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '数值',
+              name: 'numberValue',
+              require: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-switch',
+              label: '百分比',
+              name: 'percentage',
+              require: false,
+              placeholder: '',
+              value: false,
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'fontSize',
+              required: false,
+              placeholder: '',
+              value: 12,
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'subTextColor',
+              required: false,
+              placeholder: '',
+              value: ''
+            },
+            {
+              type: 'el-select',
+              label: '字体粗细',
+              name: 'fontWeight',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'normal', name: '正常' },
+                { code: 'bold', name: '粗体' },
+                { code: 'bolder', name: '特粗体' },
+                { code: 'lighter', name: '细体' }
+              ],
+              value: 'normal'
+            },
+          ],
+        },
+        {
+          name: '提示语设置',
+          list: [
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'tipFontSize',
+              required: false,
+              placeholder: '',
+              value: 16
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'tipsColor',
+              required: false,
+              placeholder: '',
+              value: '#00FEFF'
+            },
+          ],
+        },
+        {
+          name: '图例操作',
+          list: [
+            {
+              type: 'el-switch',
+              label: '图例',
+              name: 'isShowLegend',
+              required: false,
+              placeholder: '',
+              value: true,
+            },
+            {
+              type: 'el-slider',
+              label: '图例占比',
+              name: 'piechartSize',
+              required: false,
+              placeholder: '',
+              value: 70,
+            },
+            {
+              type: 'el-slider',
+              label: '环形宽度',
+              name: 'randWidth',
+              required: false,
+              placeholder: '',
+              value: 40,
+            },
+            {
+              type: 'vue-color',
+              label: '字体颜色',
+              name: 'legendColor',
+              required: false,
+              placeholder: '',
+              value: '#fff',
+            },
+            {
+              type: 'el-input-number',
+              label: '字体字号',
+              name: 'legendFontSize',
+              required: false,
+              placeholder: '',
+              value: 16,
+            },
+            {
+              type: 'el-input-number',
+              label: '图例宽度',
+              name: 'legendWidth',
+              required: false,
+              placeholder: '',
+              value: 15,
+            },
+            {
+              type: 'el-select',
+              label: '横向位置',
+              name: 'lateralPosition',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'center', name: '居中' },
+                { code: 'left', name: '左对齐' },
+                { code: 'right', name: '右对齐' },
+              ],
+              value: 'center'
+            },
+            {
+              type: 'el-select',
+              label: '纵向位置',
+              name: 'longitudinalPosition',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'top', name: '顶部' },
+                { code: 'center', name: '居中' },
+                { code: 'bottom', name: '底部' },
+              ],
+              value: 'top'
+            },
+            {
+              type: 'el-select',
+              label: '布局前置',
+              name: 'layoutFront',
+              required: false,
+              placeholder: '',
+              selectOptions: [
+                { code: 'vertical', name: '竖排' },
+                { code: 'horizontal', name: '横排' },
+              ],
+              value: 'horizontal'
+            },
+          ],
+        },
+        {
+          name: '自定义配色',
+          list: [
+            {
+              type: 'customColor',
+              label: '',
+              name: 'customColor',
+              required: false,
+              value: [{ color: '#0CD2E6' }, { color: '#00BFA5' }, { color: '#FFC722' }, { color: '#886EFF' }, { color: '#008DEC' }],
+            },
+          ],
+        },
+      ],
+    ],
+    // 数据
+    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: 3600000
+      },
+      {
+        type: 'el-button',
+        label: '静态数据',
+        name: 'staticData',
+        required: false,
+        placeholder: '',
+        relactiveDom: 'dataType',
+        relactiveDomValue: 'staticData',
+        value: [{ "value": 1048, "name": "搜索引擎" }, { "value": 735, "name": "直接访问" }, { "value": 580, "name": "邮件营销" }, { "value": 484, "name": "联盟广告" }, { "value": 300, "name": "视频广告" }]
+      },
+      {
+        type: 'dycustComponents',
+        label: '',
+        name: 'dynamicData',
+        required: false,
+        placeholder: '',
+        relactiveDom: 'dataType',
+        chartType: 'widget-piechart',
+        relactiveDomValue: 'dynamicData',
+        dictKey: 'PIE_PROPERTIES',
+        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: 400,
+      },
+      {
+        type: 'el-input-number',
+        label: '高度',
+        name: 'height',
+        required: false,
+        placeholder: '该容器在1080px大屏中的高度',
+        value: 200,
+      },
+    ],
+  }
+}
diff --git a/src/views/bigscreenDesigner/designer/tools/configure/texts/widget-digital-flop-single.js b/src/views/bigscreenDesigner/designer/tools/configure/texts/widget-digital-flop-single.js
index 0436426..ba44b12 100644
--- a/src/views/bigscreenDesigner/designer/tools/configure/texts/widget-digital-flop-single.js
+++ b/src/views/bigscreenDesigner/designer/tools/configure/texts/widget-digital-flop-single.js
@@ -36,14 +36,6 @@ export const widgetDigitalFlopSingle=  {
         value: '',
       },
       {
-        type: 'el-input-text',
-        label: '内容模版',
-        name: 'content',
-        required: false,
-        placeholder: '',
-        value: '数字{nt}',
-      },
-      {
         type: 'el-switch',
         label: '千位符显示',
         name: 'isFormatterNum',
@@ -54,31 +46,38 @@ export const widgetDigitalFlopSingle=  {
       {
         type: 'el-input-number',
         label: '小数位数',
-        name: 'toFixed',
+        name: 'decimals',
         required: false,
         placeholder: '',
-        value: 0,
+        value: 2,
       },
       {
-        type: 'el-select',
-        label: '水平对齐方式',
-        name: 'textAlign',
+        type: 'el-input-number',
+        label: '动效帧数',
+        name: 'duration',
         required: false,
         placeholder: '',
-        selectOptions: [
-          {code: 'center', name: '居中'},
-          {code: 'left', name: '左对齐'},
-          {code: 'right', name: '右对齐'}
-        ],
-        value: 'center'
+        value: 3000,
       },
       {
-        type: 'el-input-number',
-        label: '动效帧数',
-        name: 'animationFrame',
+        type: 'el-input-text',
+        label: '文本',
+        name: 'numberText',
         required: false,
         placeholder: '',
-        value: 100,
+        value: '',
+      },
+      {
+        type: 'el-select',
+        label: '文本位置',
+        name: 'numberTextFix',
+        required: false,
+        placeholder: '',
+        selectOptions: [
+          {code: 'prefix', name: '前缀'},
+          {code: 'suffix', name: '后缀'}
+        ],
+        value: 'prefix'
       },
       [
         {
@@ -87,7 +86,7 @@ export const widgetDigitalFlopSingle=  {
             {
               type: 'vue-color',
               label: '颜色',
-              name: 'fill',
+              name: 'color',
               required: false,
               placeholder: '',
               value: '#3de7c9'
diff --git a/src/views/bigscreenDesigner/designer/tools/main.js b/src/views/bigscreenDesigner/designer/tools/main.js
index bc2ac33..121167b 100644
--- a/src/views/bigscreenDesigner/designer/tools/main.js
+++ b/src/views/bigscreenDesigner/designer/tools/main.js
@@ -17,6 +17,7 @@ import { widgetGradientBarchart } from "./configure/barCharts/widget-gradient-ba
 import { widgetLinechart } from "./configure/lineCharts/widget-linechart"
 import { widgetBarlinechart } from "./configure/barlineCharts/widget-barlinechart"
 import { widgetPiechart } from "./configure/pieCharts/widget-piechart"
+import {widgetRadioPiechart} from "./configure/pieCharts/widget-radio-piechart"
 import { widgetFunnel } from "./configure/funnelCharts/widget-funnel"
 import { widgetGauge } from "./configure/percentCharts/widget-gauge"
 import { widgetLineMap } from "./configure/mapCharts/widget-line-map"
@@ -93,5 +94,6 @@ export const widgetTool = [
   widgetBorderBoxFloat,
   widgetDigitalFlopSingle,
   widgetSvg,
-  widgetRotateRanking
+  widgetRotateRanking,
+  widgetRadioPiechart
 ]
diff --git a/src/views/bigscreenDesigner/designer/widget/line/widgetLineStackChart.vue b/src/views/bigscreenDesigner/designer/widget/line/widgetLineStackChart.vue
index ce11611..3040869 100644
--- a/src/views/bigscreenDesigner/designer/widget/line/widgetLineStackChart.vue
+++ b/src/views/bigscreenDesigner/designer/widget/line/widgetLineStackChart.vue
@@ -276,20 +276,24 @@ export default {
       const optionsSetup = this.optionsSetup;
       const dataZoom ={};
       const dataZoomList =[];
-      dataZoom.type= 'slider';
-      dataZoom.show= optionsSetup.isShowZoom;//显示滚动条
-      dataZoom.zoomLock=false;//锁定滚动条缩放，（固定滚动条长度）
-      dataZoom.left=optionsSetup.bottomLeft+'%';//离左边的百分比距离
-      dataZoom.bottom=optionsSetup.bottomZoom;//距离底部距离
-      dataZoom.start=optionsSetup.startZoom;//开始位置
-      dataZoom.end=optionsSetup.endZoom;//结束位置
-      dataZoom.showDataShadow=true; //屏蔽折线图，true为显示折线图
-      // dataZoom.barBorderRadius=optionsSetup.borderRadiusZoom;
-      dataZoom.borderColor=optionsSetup.borderColorZoom;
-      dataZoom.height=optionsSetup.heightZoom;
-      dataZoom.backgroundColor=optionsSetup.backgroundColorZoom;
-      dataZoomList.push(dataZoom);
-      this.options.dataZoom=dataZoomList;
+      if(this.isNotBlank(optionsSetup.isShowZoom) && optionsSetup.isShowZoom){
+        dataZoom.type= 'slider';
+        dataZoom.show= optionsSetup.isShowZoom;//显示滚动条
+        dataZoom.zoomLock=false;//锁定滚动条缩放，（固定滚动条长度）
+        dataZoom.left=optionsSetup.bottomLeft+'%';//离左边的百分比距离
+        dataZoom.bottom=optionsSetup.bottomZoom;//距离底部距离
+        dataZoom.start=optionsSetup.startZoom;//开始位置
+        dataZoom.end=optionsSetup.endZoom;//结束位置
+        dataZoom.showDataShadow=true; //屏蔽折线图，true为显示折线图
+        // dataZoom.barBorderRadius=optionsSetup.borderRadiusZoom;
+        dataZoom.borderColor=optionsSetup.borderColorZoom;
+        dataZoom.height=optionsSetup.heightZoom;
+        dataZoom.backgroundColor=optionsSetup.backgroundColorZoom;
+        dataZoomList.push(dataZoom);
+        this.options.dataZoom=dataZoomList;
+      }else{
+        this.options.dataZoom=null;
+      }
       this.options={...this.options};
     },
     // 图例名称设置
@@ -440,64 +444,65 @@ export default {
       });
     },
     renderingFn(optionsSetup, val) {
+      this.staticDataFn(val);
       //颜色
-      const customColor = optionsSetup.customColor;
-      const arrColor = [];
-      for (let i = 0; i < customColor.length; i++) {
-        arrColor.push(customColor[i].color);
-      }
-      // x轴
-      if (optionsSetup.verticalShow) {
-        this.options.xAxis.data = [];
-        this.options.yAxis.data = val.xAxis;
-        this.options.xAxis.type = "value";
-        this.options.yAxis.type = "category";
-      } else {
-        this.options.xAxis.data = val.xAxis;
-        this.options.yAxis.data = [];
-        this.options.xAxis.type = "category";
-        this.options.yAxis.type = "value";
-      }
-      const series = [];
-      const legendName = [];
-      for (const i in val.series) {
-        if (val.series[i].type == "line") {
-          series.push({
-            name: val.series[i].name,
-            type: "line",
-            data: val.series[i].data,
-            width: optionsSetup.lineWidth,
-            symbol: optionsSetup.symbol,
-            showSymbol: optionsSetup.markPoint,
-            symbolSize: optionsSetup.pointSize,
-            symbolColor: arrColor[i],
-            smooth: optionsSetup.smoothCurve,
-            // 线条
-            lineStyle: {
-              color: arrColor[i],
-              width: optionsSetup.lineWidth,
-            },
-            //点
-            itemStyle: {
-              color: arrColor[i],
-            },
-            areaStyle: this.getOptionArea(),
-            // 标题部分
-            label: {
-              show: optionsSetup.isShow,
-              position: "top",
-              distance: 10,
-              fontSize: optionsSetup.fontSize,
-              color: optionsSetup.subTextColor,
-              fontWeight: optionsSetup.fontWeight,
-            },
-          })
-        }
-        legendName.push(val.series[i].name);
-      }
-      this.options.series = series;
-      this.options.legend['data'] = legendName;
-      this.setOptionsLegendName(legendName);
+      // const customColor = optionsSetup.customColor;
+      // const arrColor = [];
+      // for (let i = 0; i < customColor.length; i++) {
+      //   arrColor.push(customColor[i].color);
+      // }
+      // // x轴
+      // if (optionsSetup.verticalShow) {
+      //   this.options.xAxis.data = [];
+      //   this.options.yAxis.data = val.xAxis;
+      //   this.options.xAxis.type = "value";
+      //   this.options.yAxis.type = "category";
+      // } else {
+      //   this.options.xAxis.data = val.xAxis;
+      //   this.options.yAxis.data = [];
+      //   this.options.xAxis.type = "category";
+      //   this.options.yAxis.type = "value";
+      // }
+      // const series = [];
+      // const legendName = [];
+      // for (const i in val.series) {
+      //   if (val.series[i].type == "line") {
+      //     series.push({
+      //       name: val.series[i].name,
+      //       type: "line",
+      //       data: val.series[i].data,
+      //       width: optionsSetup.lineWidth,
+      //       symbol: optionsSetup.symbol,
+      //       showSymbol: optionsSetup.markPoint,
+      //       symbolSize: optionsSetup.pointSize,
+      //       symbolColor: arrColor[i],
+      //       smooth: optionsSetup.smoothCurve,
+      //       // 线条
+      //       lineStyle: {
+      //         color: arrColor[i],
+      //         width: optionsSetup.lineWidth,
+      //       },
+      //       //点
+      //       itemStyle: {
+      //         color: arrColor[i],
+      //       },
+      //       areaStyle: this.getOptionArea(),
+      //       // 标题部分
+      //       label: {
+      //         show: optionsSetup.isShow,
+      //         position: "top",
+      //         distance: 10,
+      //         fontSize: optionsSetup.fontSize,
+      //         color: optionsSetup.subTextColor,
+      //         fontWeight: optionsSetup.fontWeight,
+      //       },
+      //     })
+      //   }
+      //   legendName.push(val.series[i].name);
+      // }
+      // this.options.series = series;
+      // this.options.legend['data'] = legendName;
+      // this.setOptionsLegendName(legendName);
     }
   }
 };
diff --git a/src/views/bigscreenDesigner/designer/widget/pie/widgetActiveRingChart.vue b/src/views/bigscreenDesigner/designer/widget/pie/widgetActiveRingChart.vue
index af946e9..c6092bc 100644
--- a/src/views/bigscreenDesigner/designer/widget/pie/widgetActiveRingChart.vue
+++ b/src/views/bigscreenDesigner/designer/widget/pie/widgetActiveRingChart.vue
@@ -2,23 +2,29 @@
 动态环图
 -->
 <template>
-<!--  <div id="widget-active-ring-chart" :style="styleObj">-->
-    <dv-active-ring-chart :config="options" :style="styleObj"/>
-<!--  </div>-->
+  <div class="bc-chart-item" :style="styleObj" v-if="isRouterAlive" >
+    <div class="bcci-header" :style="titleConfig.titleStyle" v-if="titleConfig.isNoTitle" >{{titleConfig.titleText}}</div>
+    <Label-Tag :config="labelConfig" v-if="labelConfig.isNoTipTitle && labelConfig.tipsAlign=='up'"/>
+    <dv-active-ring-chart :config="options" :style="styleRingChart"/>
+    <Label-Tag :config="labelConfig" v-if="labelConfig.isNoTipTitle && labelConfig.tipsAlign=='down'"/>
+  </div>
 </template>
 <script>
 import Vue from "vue";
+import LabelTag from '../../components/LabelTag'
 import activeRingChart from "@jiaminghi/data-view/lib/components/activeRingChart";
 Vue.use(activeRingChart)
 export default {
-  name: "WidgetActiveRingChart",
+  name: "widgetActiveRingChart",
   props: {
     value: Object,
     ispreview: Boolean,
   },
+  components: {
+    LabelTag
+  },
   data() {
     return {
-      //返回图标数据
       options: {
         radius:'75%',//环半径
         activeRadius:'85%',//环半径（动态）
@@ -27,8 +33,8 @@ export default {
         activeTimeGap:3000,//切换间隔(ms)
         color:[],//环颜色
         digitalFlopStyle: {
-            fontSize: 30,
-            fill: '#3de7c9'
+          fontSize: 30,
+          fill: '#3de7c9'
         },//数字翻牌器样式
         digitalFlopToFixed	:0,//数字翻牌器小数位数
         digitalFlopUnit	:'',//数字翻牌器单位
@@ -38,8 +44,30 @@ export default {
       optionsStyle: {}, // 样式
       optionsData: {}, // 数据
       optionsCollapse: {}, // 图标属性
-      optionsSetup: {}
-    };
+      optionsSetup: {},
+      labelConfig: {
+        data: [],
+        colors:[],
+        labelStyle:{},
+        isNoTipTitle:false,
+        tipsAlign:'down',
+      },
+      titleConfig:{
+        titleStyle:{},
+        isNoTitle:false,
+        titleText:"测试标题"
+      },
+      flagInter: null,
+      isRouterAlive:true,
+    }
+  },
+  provide(){
+    return{
+      reload:this.reload
+    }
+  },
+  beforeDestroy() {
+    clearInterval(this.flagInter);
   },
   computed: {
     styleObj() {
@@ -53,6 +81,17 @@ export default {
       };
       return style;
     },
+    styleRingChart() {
+      const style ={
+        width: this.optionsStyle.width + "px",
+        height: this.optionsStyle.height+ "px",
+        left: this.optionsStyle.left + "px",
+        top: this.optionsStyle.top-20 + "px",
+        position: "static",
+        display: 'flex'
+      };
+      return style;
+    }
   },
   watch: {
     value: {
@@ -61,6 +100,7 @@ export default {
         this.optionsData = val.data;
         this.optionsSetup = val.setup;
         this.editorOptions();
+        this.reload();
       },
       deep: true
     }
@@ -80,8 +120,44 @@ export default {
       this.setOptionsColor();
       //数字翻牌器样式
       this.setFontStyle();
+      //设置提示语
+      this.setLabelConfig();
+      //标题设置
+      this.setTitleConfig();
       //基础数据修改
       this.setOptionsConfig();
+
+    },
+    //提示语设置
+    setLabelConfig(){
+      const optionsSetup = this.optionsSetup;
+      let labelStyle = {};
+      if(optionsSetup.isNoTipTitle){
+        this.labelConfig.isNoTipTitle = optionsSetup.isNoTipTitle;
+        this.labelConfig.tipsAlign = optionsSetup.tipsAlign;
+        labelStyle.color = optionsSetup.tipsColor;
+        labelStyle['font-size'] = optionsSetup.tipFontSize+'px';
+        this.labelConfig.labelStyle = labelStyle;
+      }else{
+        this.labelConfig.isNoTipTitle = false;
+      }
+    },
+    //标题设置
+    setTitleConfig(){
+      const optionsSetup = this.optionsSetup;
+      let titleStyle = {};
+      if(optionsSetup.isNoTitle){
+        this.titleConfig.isNoTitle = optionsSetup.isNoTitle;
+        this.titleConfig.titleText = optionsSetup.titleText;
+        titleStyle.color = optionsSetup.textColor;
+        titleStyle['font-size'] = optionsSetup.textFontSize+'px';
+        titleStyle['font-style'] = optionsSetup.textFontStyle;
+        titleStyle['font-weight'] = optionsSetup.textFontWeight;
+        titleStyle['text-align'] = optionsSetup.textAlign;
+        this.titleConfig.titleStyle = titleStyle;
+      }else{
+        this.titleConfig.isNoTitle = false;
+      }
     },
     // 颜色修改
     setOptionsColor() {
@@ -93,6 +169,7 @@ export default {
         arrColor.push(customColor[i].color);
       }
       this.options.color = arrColor;
+      this.labelConfig.colors = arrColor;
     },
     //字体修改
     setFontStyle() {
@@ -116,7 +193,7 @@ export default {
       this.options.showOriginValue = optionsSetup.showOriginValue;
       //改变options
       // console.log("配置修改：",this.styleObj);
-      this.options={...this.options};
+      // this.options={...this.options};
     },
     //数据类型
     setOptionsData() {
@@ -129,6 +206,7 @@ export default {
       // console.log("设置静态数据",this.options)
       const staticData = typeof val == "string" ? JSON.parse(val) : val;
       this.options.data=staticData;
+      this.setLabelConfigData(val);
     },
     dynamicDataFn(val, refreshTime) {
       if (!val) return;
@@ -150,17 +228,62 @@ export default {
     renderingFn(val) {
       // console.log("设置静态数据",val)
       this.options.data=val;
-      this.options={...this.options};
-    }
+      this.setLabelConfigData(val);
+      this.reload();
+    },
+    setLabelConfigData(val){
+      const data = [];
+      if(this.isNotBlankArray(val)){
+        for(let i = 0;i<val.length;i++){
+          const oneVal = val[i];
+          data.push(oneVal['name']);
+        }
+        this.labelConfig.data = data;
+      }
+    },
+    // vue hack 之强制刷新组件
+    reload(){
+      this.isRouterAlive=false;
+      this.$nextTick(function(){
+        this.isRouterAlive=true;
+      })
+    },
 
   }
 };
 
 </script>
 <style scoped lang="scss">
-.echarts {
+.bottom-charts {
   width: 100%;
   height: 100%;
-  overflow: hidden;
+  position: absolute;
+
+  .bc-chart-item {
+    //width: 25%;
+    //height: 100%;
+    //padding-top: 20px;
+    //box-sizing: border-box;
+    position: absolute;
+  }
+  .ringChart{
+    width: 100%;
+    height: 95%;
+    position: absolute;
+  }
+  //.bcci-header {
+  //  height: 50px;
+  //  text-align: center;
+  //  line-height: 50px;
+  //  font-size: 20px;
+  //}
+  //
+  //.label-tag {
+  //  height: 30px;
+  //}
+  //.active-ring-info{ position: absolute;}
+  .active-ring-name {
+    font-size: 18px!important;
+  }
 }
 </style>
diff --git a/src/views/bigscreenDesigner/designer/widget/pie/widgetRadioPiechart.vue b/src/views/bigscreenDesigner/designer/widget/pie/widgetRadioPiechart.vue
new file mode 100644
index 0000000..305df3c
--- /dev/null
+++ b/src/views/bigscreenDesigner/designer/widget/pie/widgetRadioPiechart.vue
@@ -0,0 +1,266 @@
+<template>
+  <div :style="styleObj">
+    <v-chart :options="options" autoresize/>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "widgetRadioPiechart",
+  components: {},
+  props: {
+    value: Object,
+    ispreview: Boolean
+  },
+  data() {
+    return {
+      options: {
+        tooltip: {
+          trigger: 'item'
+        },
+        legend: {
+          top: '5%',
+          left: 'center'
+        },
+        series: [
+          {
+            name: 'Access From',
+            type: 'pie',
+            radius: ['40%', '70%'],
+            avoidLabelOverlap: false,
+            label: {
+              show: false,
+              position: 'center'
+            },
+            emphasis: {
+              label: {
+                show: true,
+                fontSize: 10,
+                fontWeight: 'bold'
+              },
+              scale: true,
+              scaleSize: 5
+            },
+            labelLine: {
+              show: false
+            },
+            data: [
+              { value: 1048, name: 'Search Engine' },
+              { value: 735, name: 'Direct' },
+              { value: 580, name: 'Email' },
+              { value: 484, name: 'Union Ads' },
+              { value: 300, name: 'Video Ads' }
+            ]
+          }
+        ]
+      },
+      optionsStyle: {}, // 样式
+      optionsData: {}, // 数据
+      optionsCollapse: {}, // 图标属性
+      optionsSetup: {}
+    };
+  },
+  computed: {
+    styleObj() {
+      return {
+        position: this.ispreview ? "absolute" : "static",
+        width: this.optionsStyle.width + "px",
+        height: this.optionsStyle.height + "px",
+        left: this.optionsStyle.left + "px",
+        top: this.optionsStyle.top + "px",
+        background: this.optionsSetup.background
+      };
+    }
+  },
+  watch: {
+    value: {
+      handler(val) {
+        this.optionsStyle = val.position;
+        this.optionsData = val.data;
+        this.optionsCollapse = val.collapse;
+        this.optionsSetup = val.setup;
+        this.editorOptions();
+      },
+      deep: true
+    }
+  },
+  created() {
+    this.optionsStyle = this.value.position;
+    this.optionsData = this.value.data;
+    this.optionsCollapse = this.value.collapse;
+    this.optionsSetup = this.value.setup;
+    this.editorOptions();
+  },
+  methods: {
+    // 修改图标options属性
+    editorOptions() {
+      // this.setOptionsTitle();
+      // this.setOptionsValue();
+      // this.setOptionsTooltip();
+      // this.setOptionsLegend();
+      // this.setOptionsColor();
+      // this.setOptionsData();
+      // this.setOptionsPiechartStyle();
+    },
+    // 饼图样式
+    setOptionsPiechartStyle() {
+      const piechartSize = this.optionsSetup.piechartSize;
+      const randWidth = this.optionsSetup.randWidth;
+      if (this.optionsSetup.piechartStyle == "shixin") {
+        this.options.series[0]["radius"] = piechartSize+"%";
+      } else if (this.optionsSetup.piechartStyle == "kongxin") {
+        this.options.series[0]["radius"] = [randWidth+"%", piechartSize+"%"];
+      } else {
+
+      }
+    },
+    // 标题设置
+    setOptionsTitle() {
+      const optionsSetup = this.optionsSetup;
+      const title = {};
+      title.text = optionsSetup.titleText;
+      title.show = optionsSetup.isNoTitle;
+      title.left = optionsSetup.textAlign;
+      title.textStyle = {
+        color: optionsSetup.textColor,
+        fontSize: optionsSetup.textFontSize,
+        fontWeight: optionsSetup.textFontWeight,
+        fontStyle: optionsSetup.textFontStyle,
+      };
+      title.subtext = optionsSetup.subText;
+      title.subtextStyle = {
+        color: optionsSetup.subTextColor,
+        fontWeight: optionsSetup.subTextFontWeight,
+        fontSize: optionsSetup.subTextFontSize,
+        fontStyle: optionsSetup.subTextFontStyle,
+      };
+      this.options.title = title;
+    },
+    // 数值设定
+    setOptionsValue() {
+      const optionsSetup = this.optionsSetup;
+      const series = this.options.series;
+      const numberValue = optionsSetup.numberValue ? "{c}" : "";
+      const percentage = optionsSetup.percentage ? "({d})%" : "";
+      const formatterVaue
+        = optionsSetup.isShowTitle ?`{a|{b}：${numberValue} ${percentage}}`:`${numberValue} ${percentage}`;
+      const label = {
+        show: optionsSetup.isShow,
+        formatter: formatterVaue,
+        rich: {
+          a: {
+            padding: [-30, 15, -20, 15],
+            color: optionsSetup.subTextColor,
+            fontSize: optionsSetup.fontSize,
+            fontWeight: optionsSetup.fontWeight
+          }
+        },
+        fontSize: optionsSetup.fontSize,
+
+        fontWeight: optionsSetup.optionsSetup
+      };
+      for (const key in series) {
+        if (series[key].type == "pie") {
+          series[key].label = label;
+          series[key].labelLine = {show: optionsSetup.isShow};
+        }
+      }
+    },
+    // 提示语设置 tooltip
+    setOptionsTooltip() {
+      const optionsSetup = this.optionsSetup;
+      const tooltip = {
+        trigger: "item",
+        show: true,
+        textStyle: {
+          color: optionsSetup.lineColor,
+          fontSize: optionsSetup.tipFontSize
+        }
+      };
+      this.options.tooltip = tooltip;
+    },
+    // 图例操作 legend
+    setOptionsLegend() {
+      const optionsSetup = this.optionsSetup;
+      const legend = this.options.legend;
+      legend.show = optionsSetup.isShowLegend;
+      if(optionsSetup.longitudinalPosition == "center"){
+        legend.left = optionsSetup.lateralPosition == "left" ? 0 : "auto";
+        legend.right = optionsSetup.lateralPosition == "right" ? 0 : "auto";
+        legend.top = '10%';
+        legend.marginTop = '-150px';
+      }else{
+        legend.left = optionsSetup.lateralPosition == "left" ? 0 : "auto";
+        legend.right = optionsSetup.lateralPosition == "right" ? 0 : "auto";
+        legend.top = optionsSetup.longitudinalPosition == "top" ? 0 :"auto";
+        legend.bottom =
+          optionsSetup.longitudinalPosition == "bottom" ? 0 : "auto";
+      }
+      legend.orient = optionsSetup.layoutFront;
+      legend.textStyle = {
+        color: optionsSetup.legendColor,
+        fontSize: optionsSetup.legendFontSize
+      };
+      legend.itemWidth = optionsSetup.legendWidth;
+    },
+    // 图例颜色修改
+    setOptionsColor() {
+      const optionsSetup = this.optionsSetup;
+      const customColor = optionsSetup.customColor;
+      if (!customColor) return;
+      const arrColor = [];
+      for (let i = 0; i < customColor.length; i++) {
+        arrColor.push(customColor[i].color);
+      }
+      this.options.color = arrColor;
+      this.options = Object.assign({}, this.options);
+    },
+    setOptionsData() {
+      const optionsData = this.optionsData; // 数据类型 静态 or 动态
+      optionsData.dataType == "staticData"
+        ? this.staticDataFn(optionsData.staticData)
+        : this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
+    },
+    staticDataFn(val) {
+      const staticData = typeof val == "string" ? JSON.parse(val) : val;
+      for (const key in this.options.series) {
+        if (this.options.series[key].type == "pie") {
+          this.options.series[key].data = staticData;
+        }
+      }
+    },
+    dynamicDataFn(val, refreshTime) {
+      if (!val) return;
+      if (this.ispreview) {
+        this.getEchartData(val);
+        this.flagInter = setInterval(() => {
+          this.getEchartData(val);
+        }, refreshTime);
+      } else {
+        this.getEchartData(val);
+      }
+    },
+    getEchartData(val) {
+      const data = this.queryEchartsData(val);
+      data.then(res => {
+        this.renderingFn(res);
+      });
+    },
+    renderingFn(val) {
+      for (const key in this.options.series) {
+        if (this.options.series[key].type == "pie") {
+          this.options.series[key].data = val;
+        }
+      }
+    }
+  }
+};
+</script>
+
+<style scoped lang="scss">
+.echarts {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+</style>
diff --git a/src/views/bigscreenDesigner/designer/widget/temp.vue b/src/views/bigscreenDesigner/designer/widget/temp.vue
index 88461f9..a6946c8 100644
--- a/src/views/bigscreenDesigner/designer/widget/temp.vue
+++ b/src/views/bigscreenDesigner/designer/widget/temp.vue
@@ -48,6 +48,7 @@ import widgetActiveRingChart from "./pie/widgetActiveRingChart";
 import widgetConicalColumnChart from "./funnel/widgetConicalColumnChart";
 import widgetDigitalFlopSingle from "./text/widgetDigitalFlopSingle";
 import widgetSvg from "./div/widgetSvg";
+import widgetRadioPiechart from "./pie/widgetRadioPiechart";
 
 export default {
   name: "WidgetTemp",
@@ -65,6 +66,7 @@ export default {
     widgetLinechart,
     widgetBarlinechart,
     WidgetPiechart,
+    widgetRadioPiechart,
     WidgetFunnel,
     WidgetGauge,
     WidgetPieNightingaleRoseArea,
diff --git a/src/views/bigscreenDesigner/designer/widget/text/widgetDigitalFlopSingle.vue b/src/views/bigscreenDesigner/designer/widget/text/widgetDigitalFlopSingle.vue
index 11cbf07..32cbb97 100644
--- a/src/views/bigscreenDesigner/designer/widget/text/widgetDigitalFlopSingle.vue
+++ b/src/views/bigscreenDesigner/designer/widget/text/widgetDigitalFlopSingle.vue
@@ -1,22 +1,28 @@
 <template>
   <div class="center-cmp" :style="styleObj">
     <div class="cc-details" :style="detailsClass">
-      <div class="textStyle" >设备总数</div>
+<!--      <div class="textStyle">设备总数</div>-->
       <div
         v-for="(dataValue, index) in options.data"
-        :style="cardClass()"
         :key="index"
+        :style="cardClass()"
       >
-       <dv-digital-flop :config="dataValue"></dv-digital-flop>
+          <animate-number
+                   :from="dataValue.from"
+                   :to="dataValue.to"
+                   :duration="dataValue.duration"
+                   easing="easeOutQuad"
+                   v-if="dataValue.type=='number'"
+          ></animate-number>
+         <div v-html="dataValue.value" v-if="dataValue.type=='text'"></div>
       </div>
     </div>
   </div>
 </template>
 <script>
-import Vue from "vue";
-import digitalFlop from "@jiaminghi/data-view/lib/components/digitalFlop";
-import {mapState} from "vuex";
-Vue.use(digitalFlop);
+import Vue from 'vue'
+import VueAnimateNumber from 'vue-animate-number'
+Vue.use(VueAnimateNumber)
 export default {
   name: "WidgetDigitalFlopSingle",
   props: {
diff --git a/src/views/bigscreenDesigner/designer/widget/widget.vue b/src/views/bigscreenDesigner/designer/widget/widget.vue
index c328a9f..946b50b 100644
--- a/src/views/bigscreenDesigner/designer/widget/widget.vue
+++ b/src/views/bigscreenDesigner/designer/widget/widget.vue
@@ -27,6 +27,7 @@ import widgetGradientColorBarchart from "./bar/widgetGradientColorBarchart.vue";
 import widgetLinechart from "./line/widgetLinechart.vue";
 import widgetBarlinechart from "./barline/widgetBarlinechart";
 import WidgetPiechart from "./pie/widgetPiechart.vue";
+import widgetRadioPiechart from "./pie/widgetRadioPiechart";
 import WidgetFunnel from "./funnel/widgetFunnel.vue";
 import WidgetGauge from "./percent/widgetGauge.vue";
 import WidgetPieNightingaleRoseArea from "./pie/widgetPieNightingaleRose";
@@ -105,7 +106,8 @@ export default {
     widgetBorderBoxFloat,
     widgetDigitalFlopSingle,
     widgetSvg,
-    widgetRotateRanking
+    widgetRotateRanking,
+    widgetRadioPiechart,
   },
   model: {
     prop: "value",