diff --git a/src/editor/slider/ibiz-slider/ibiz-slider.scss b/src/editor/slider/ibiz-slider/ibiz-slider.scss
index 790d93c54343ee11c781a2498d35547a75c1fb74..588036e6c6445b206ca0fd8df8602c544e65c860 100644
--- a/src/editor/slider/ibiz-slider/ibiz-slider.scss
+++ b/src/editor/slider/ibiz-slider/ibiz-slider.scss
@@ -1,13 +1,21 @@
+$editor-slider: (
+  trigger-width: rem(6px),
+  text-width: rem(38px),
+);
+
 @include b('slider') {
+  @include set-component-css-var(editor-slider, $editor-slider);
+
   display: flex;
   align-items: center;
   width: 100%;
   @include e(text) {
     .el-slider__button,
     .el-slider__button-wrapper {
-      width: 1px;
+      width: getCssVar('editor-slider', 'trigger-width');
       height: getCssVar('height-control', 'default');
       border: none;
+      opacity: 0;
     }
 
     .el-slider__bar {
@@ -18,9 +26,28 @@
       background-color: getCssVar(color, primary);
     }
     @include m(val) {
+      min-width: getCssVar('editor-slider', 'text-width');;
       margin-left: getCssVar(spacing, tight);
     }
   }
+
+  @include e('circle') {
+    @include m('text') {
+      font-size: getCssVar('font-size', 'regular');
+    }
+
+    .el-progress {
+      --el-fill-color-light: var(--ibiz-color-fill-0);
+
+      width: 100%;
+
+      .el-progress-circle {
+        svg>path:nth-child(2) {
+          stroke: getCssVar(color, primary);
+        }
+      }
+    }
+  }
 }
 
 
@@ -31,4 +58,4 @@
       padding: getCssVar(form-item, hover-edit-padding);
     }
   }
-}
\ No newline at end of file
+}
diff --git a/src/editor/slider/ibiz-slider/ibiz-slider.tsx b/src/editor/slider/ibiz-slider/ibiz-slider.tsx
index 50c6d5800c5e87fadec113f349bce04356bc49f6..7de58ace0bf3a11531f47ad77f842952976e8203 100644
--- a/src/editor/slider/ibiz-slider/ibiz-slider.tsx
+++ b/src/editor/slider/ibiz-slider/ibiz-slider.tsx
@@ -40,6 +40,10 @@ export const IBizSlider = defineComponent({
     let showText = false;
     // 格式化
     let format = '0%';
+    // 进度条类型
+    let type = 'line';
+    // 文本显示属性
+    let textField = '';
     if (editorModel.editorParams) {
       if (editorModel.editorParams.stepvalue) {
         step = toNumber(editorModel.editorParams.stepvalue);
@@ -65,6 +69,12 @@ export const IBizSlider = defineComponent({
       if (editorModel.editorParams.format) {
         format = editorModel.editorParams.format;
       }
+      if (editorModel.editorParams.type) {
+        type = editorModel.editorParams.type;
+      }
+      if (editorModel.editorParams.textfield) {
+        textField = editorModel.editorParams.textfield;
+      }
     }
 
     // 是否显示表单默认内容
@@ -79,6 +89,33 @@ export const IBizSlider = defineComponent({
       return false;
     });
 
+    // 处理线型进度条数据
+    const handleLineVal = (val: string | number) => {
+      // 如果是范围解析JSON成数组
+      // eslint-disable-next-line no-lonely-if
+      if (range) {
+        return JSON.parse(val as string);
+      }
+      return Number(val) as number;
+    };
+
+    // 处理圆形进度条数据
+    const handleCircleVal = (val: string | number) => {
+      return Number(val) * 100;
+    };
+
+    // 处理当前值
+    const handleCurVal = (val: string | number) => {
+      switch (type) {
+        case 'line':
+          return handleLineVal(val);
+        case 'circle':
+          return handleCircleVal(val);
+        default:
+          return val;
+      }
+    };
+
     // 当前值
     const currentVal = ref<number | Array<number>>();
     watch(
@@ -93,13 +130,7 @@ export const IBizSlider = defineComponent({
               currentVal.value = 0;
             }
           } else {
-            // 如果是范围解析JSON成数组
-            // eslint-disable-next-line no-lonely-if
-            if (range) {
-              currentVal.value = JSON.parse(newVal as string);
-            } else {
-              currentVal.value = Number(newVal) as number;
-            }
+            currentVal.value = handleCurVal(newVal);
           }
         }
       },
@@ -108,6 +139,10 @@ export const IBizSlider = defineComponent({
 
     // 计算文本显示值
     const textVal = computed(() => {
+      if (textField) {
+        const data = (c.parent as IParams).data || {};
+        return ibiz.util.text.format(`${data[textField]}`, format);
+      }
       const tempCurVal = Number(currentVal.value);
       const value = Number(tempCurVal / max);
       const formatValue = ibiz.util.text.format(`${value}`, format);
@@ -136,6 +171,8 @@ export const IBizSlider = defineComponent({
       step,
       max,
       min,
+      type,
+      textField,
       showStops,
       range,
       showInput,
@@ -146,16 +183,9 @@ export const IBizSlider = defineComponent({
     };
   },
   render() {
-    return (
-      <div
-        class={[
-          this.ns.b(),
-          this.readonly ? this.ns.m('readonly') : '',
-          this.showText ? this.ns.e('text') : '',
-          this.ns.is('show-default', this.showFormDefaultContent),
-        ]}
-        ref='editorRef'
-      >
+    let content;
+    if (this.type === 'line') {
+      content = [
         <el-slider
           v-model={this.currentVal}
           disabled={this.disabled || this.readonly}
@@ -167,10 +197,48 @@ export const IBizSlider = defineComponent({
           showInput={this.showInput}
           onChange={this.handleChange}
           {...this.$attrs}
-        ></el-slider>
-        {this.showText ? (
+        ></el-slider>,
+        this.showText ? (
           <span class={[this.ns.em('text', 'val')]}>{this.textVal}</span>
-        ) : null}
+        ) : null,
+      ];
+    }
+
+    if (this.type === 'circle') {
+      content = (
+        <el-progress
+          type={this.type}
+          percentage={this.currentVal}
+          {...this.$attrs}
+        >
+          {{
+            default: (item: IData) => {
+              if (!this.showText) {
+                return '';
+              }
+              let text = item.percentage;
+              if (this.textField) {
+                text = this.textVal;
+              }
+              return <span class={this.ns.em('circle', 'text')}>{text}</span>;
+            },
+          }}
+        </el-progress>
+      );
+    }
+
+    return (
+      <div
+        class={[
+          this.ns.b(),
+          this.readonly ? this.ns.m('readonly') : '',
+          this.showText ? this.ns.e('text') : '',
+          this.ns.is('show-default', this.showFormDefaultContent),
+          this.ns.e(this.type),
+        ]}
+        ref='editorRef'
+      >
+        {content}
       </div>
     );
   },