diff --git a/src/ibp/utils/parser.js b/src/ibp/utils/parser.js
index fec9ab6f8..7f3aa3ee4 100644
--- a/src/ibp/utils/parser.js
+++ b/src/ibp/utils/parser.js
@@ -2,7 +2,6 @@ import * as zrUtil from 'zrender/src/core/util';
 import * as matrix from 'zrender/src/core/matrix';
 import deviceType from '../constant/deviceType';
 import deviceRender from '../constant/deviceRender';
-import store from '@/store';
 
 export function createTransform(opts) {
 	let transform = matrix.create();
@@ -77,43 +76,3 @@ export function parser(data, config) {
 
 	return ibpDevice;
 }
-
-export function updateIbpData(device, type) {
-	const ibpData = store.getters['ibp/ibp'];
-	switch (device.type) {
-	case deviceType.Background : {
-		ibpData.background = device;
-		break;
-	}
-	case deviceType.IbpText : {
-		if (ibpData.textList && ibpData.textList.length > 0) {
-			for (let i=0; i<ibpData.textList.length; i++) {
-				if (device.code === ibpData.textList[i].code) {
-					type === 'delete'? ibpData.textList.splice(i, 1) :ibpData.textList[i] = device;
-				} else {
-					ibpData.textList.push(device);
-				}
-			}
-		} else {
-			ibpData.textList = [device];
-		}
-		break;
-	}
-	case deviceType.SquareButton : {
-		if (ibpData.squareButtonList && ibpData.squareButtonList.length > 0) {
-			for (let i=0; i<ibpData.squareButtonList.length; i++) {
-				if (device.code === ibpData.squareButtonList[i].code) {
-					type === 'delete' ? ibpData.squareButtonList.splice(i, 1):ibpData.squareButtonList[i] = device;
-				} else {
-					ibpData.squareButtonList.push(device);
-				}
-			}
-		} else {
-			ibpData.squareButtonList = [device];
-		}
-		break;
-	}
-	}
-	console.log(ibpData);
-	store.dispatch('ibp/setIbpData', ibpData);
-}
diff --git a/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpAlarm.vue b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpAlarm.vue
new file mode 100644
index 000000000..7e3969fe2
--- /dev/null
+++ b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpAlarm.vue
@@ -0,0 +1,65 @@
+<template>
+    <div>
+        <el-form ref="form" :model="form" label-width="80px">
+            <el-form-item label="报警器宽度">
+                <el-input-number v-model="form.alarmWidth" controls-position="right" :min="1"></el-input-number>
+            </el-form-item>
+            <el-form-item label="报警器长度">
+                <el-input-number v-model="form.alarmHeight" controls-position="right" :min="1"></el-input-number>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" @click="onSubmit">立即创建</el-button>
+                <el-button>取消</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'ButtonDraft',
+        components: {
+        },
+        data() {
+            return {
+                form: {
+                    alarmWidth: '',
+                    alarmHeight: ''
+                },
+                rules: {
+                    alarmWidth: [
+                        { required: true, message: '请输入报警器宽度', trigger: 'blur' },
+                    ],
+                    alarmHeight: [
+                        { required: true, message: '请输入报警器高度', trigger: 'blur' },
+                    ]
+                }
+            };
+        },
+        computed: {
+
+        },
+        watch: {
+
+        },
+        mounted() {
+        },
+        methods: {
+            onSubmit() {
+                const alarmModel = {
+                    zlevel: 1,
+                    z: 1,
+                    x: 10,
+                    y: 10,
+                    _type: 'SquareButton',
+                    width: this.form .alarmWidth,
+                    height: this.form.alarmHeight
+                };
+                this.$emit('createButton', alarmModel)
+            }
+        }
+    };
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+
+</style>
diff --git a/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpAppendageBox.vue b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpAppendageBox.vue
new file mode 100644
index 000000000..5958b3a06
--- /dev/null
+++ b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpAppendageBox.vue
@@ -0,0 +1,65 @@
+<template>
+    <div>
+        <el-form ref="form" :model="form" label-width="80px">
+            <el-form-item label="扶梯框宽度">
+                <el-input-number v-model="form.appendageBoxWidth" controls-position="right" :min="1"></el-input-number>
+            </el-form-item>
+            <el-form-item label="扶梯框高度">
+                <el-input-number v-model="form.appendageBoxHeight" controls-position="right" :min="1"></el-input-number>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" @click="onSubmit">立即创建</el-button>
+                <el-button>取消</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'AppendageBoxDraft',
+        components: {
+        },
+        data() {
+            return {
+                form: {
+                    appendageBoxWidth: '',
+                    appendageBoxHeight: ''
+                },
+                rules: {
+                    appendageBoxWidth: [
+                        { required: true, message: '请输入扶梯框宽度', trigger: 'blur' },
+                    ],
+                    appendageBoxHeight: [
+                        { required: true, message: '请输入扶梯框高度', trigger: 'blur' },
+                    ]
+                }
+            };
+        },
+        computed: {
+
+        },
+        watch: {
+
+        },
+        mounted() {
+        },
+        methods: {
+            onSubmit() {
+                const appendageBoxModel = {
+                    zlevel: 1,
+                    z: 1,
+                    x: 10,
+                    y: 10,
+                    _type: 'AppendageBox',
+                    width: this.form .appendageBoxWidth,
+                    height: this.form.appendageBoxHeight
+                };
+                this.$emit('createAppendageBox', appendageBoxModel)
+            }
+        }
+    };
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+
+</style>
diff --git a/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpArrow.vue b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpArrow.vue
new file mode 100644
index 000000000..c2944394d
--- /dev/null
+++ b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpArrow.vue
@@ -0,0 +1,78 @@
+<template>
+    <div>
+        <el-form ref="form" :model="form" label-width="80px">
+            <el-form-item label="箭头方向">
+                <el-select v-model="form.arrowDirection" placeholder="请选择箭头方向">
+                    <el-option label="向上" value="redButton"></el-option>
+                    <el-option label="向下" value="yellowButton"></el-option>
+                    <el-option label="向左" value="greenButton"></el-option>
+                    <el-option label="向右" value="greenButton"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="箭头长度">
+                <el-input-number v-model="form.arrowWidth" controls-position="right" :min="1"></el-input-number>
+            </el-form-item>
+            <el-form-item label="箭头宽度">
+                <el-input-number v-model="form.arrowHeight" controls-position="right" :min="1"></el-input-number>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" @click="onSubmit">立即创建</el-button>
+                <el-button>取消</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'ButtonDraft',
+        components: {
+        },
+        data() {
+            return {
+                form: {
+                    arrowDirection: '',
+                    arrowWidth: '',
+                    arrowHeight: ''
+                },
+                rules: {
+                    arrowDirection: [
+                        { required: true, message: '请选择箭头方向', trigger: 'change'}
+                    ],
+                    arrowWidth: [
+                        { required: true, message: '请输入箭头长度', trigger: 'blur' },
+                    ],
+                    arrowHeight: [
+                        { required: true, message: '请输入箭头线宽', trigger: 'blur' },
+                    ]
+                }
+            };
+        },
+        computed: {
+
+        },
+        watch: {
+
+        },
+        mounted() {
+        },
+        methods: {
+            onSubmit() {
+                const arrowModel = {
+                    zlevel: 1,
+                    z: 1,
+                    x: 10,
+                    y: 10,
+                    _type: 'Arrow',
+                    colorType: this.form.buttonColor,
+                    width: this.form .arrowWidth,
+                    height: this.form.arrowHeight
+                };
+                this.$emit('createButton', arrowModel)
+            }
+        }
+    };
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+
+</style>
diff --git a/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpButton.vue b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpButton.vue
index 4a076a55c..c8c38b73a 100644
--- a/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpButton.vue
+++ b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpButton.vue
@@ -30,18 +30,19 @@
         data() {
             return {
                 form: {
-                    bgWidth: '',
-                    bgHeight: ''
+                    buttonColor: '',
+                    buttonWidth: '',
+                    buttonHeight: ''
                 },
                 rules: {
                     buttonColor: [
                         { required: true, message: '请选择按钮颜色', trigger: 'change'}
                     ],
                     buttonWidth: [
-                        { required: true, message: '请输入背景板宽度', trigger: 'blur' },
+                        { required: true, message: '请输入按钮宽度', trigger: 'blur' },
                     ],
                     buttonHeight: [
-                        { required: true, message: '请输入背景板高度', trigger: 'blur' },
+                        { required: true, message: '请输入按钮高度', trigger: 'blur' },
                     ]
                 }
             };
diff --git a/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpCLamp.vue b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpCLamp.vue
new file mode 100644
index 000000000..81032a2c0
--- /dev/null
+++ b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpCLamp.vue
@@ -0,0 +1,78 @@
+<template>
+    <div>
+        <el-form ref="form" :model="form" label-width="80px">
+            <el-form-item label="圆形指示灯半径">
+                <el-input-number v-model="form.r" controls-position="right" :min="1"></el-input-number>
+            </el-form-item>
+            <el-form-item label="圆形指示灯关闭颜色">
+                <el-input-number v-model="form.offColor" controls-position="right" :min="1"></el-input-number>
+            </el-form-item>
+            <el-form-item label="圆形指示灯打开颜色">
+                <el-input-number v-model="form.onColor" controls-position="right" :min="1"></el-input-number>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" @click="onSubmit">立即创建</el-button>
+                <el-button>取消</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'ButtonDraft',
+        components: {
+        },
+        data() {
+            return {
+                form: {
+                    r: '',
+                    offColor: '',
+                    onColor: ''
+                },
+                rules: {
+                    r: [
+                        { required: true, message: '请输入圆形指示灯半径', trigger: 'change'}
+                    ],
+                    offColor: [
+                        { required: true, message: '请输入圆形指示灯关闭颜色', trigger: 'blur' },
+                    ],
+                    onColor: [
+                        { required: true, message: '请输入圆形指示灯打开颜色', trigger: 'blur' },
+                    ]
+                }
+            };
+        },
+        computed: {
+
+        },
+        watch: {
+
+        },
+        mounted() {
+        },
+        methods: {
+            onSubmit() {
+                const lampModel = {
+                    zlevel: 1,
+                    z: 1,
+                    x: 10,
+                    y: 10,
+                    _type: 'CircularLamp',
+                    r: this.form.r,
+                    offColor: this.form.offColor,
+                    onColor: this.form.onColor
+                };
+                this.$emit('createLamp', lampModel)
+            }
+        }
+    };
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+    @import "src/styles/mixin.scss";
+    .button_box{
+        width: 100%;
+        background: #f0f0f0;
+        overflow: hidden;
+    }
+</style>
diff --git a/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpLamp.vue b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpLamp.vue
deleted file mode 100644
index e69de29bb..000000000
diff --git a/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpRotatingButton.vue b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpRotatingButton.vue
new file mode 100644
index 000000000..d0d5643e4
--- /dev/null
+++ b/src/views/ibp/ibpDraft/ibpEdit/ibpOperate/ibpRotatingButton.vue
@@ -0,0 +1,65 @@
+<template>
+    <div>
+        <el-form ref="form" :model="form" label-width="80px">
+            <el-form-item label="旋转按钮宽度">
+                <el-input-number v-model="form.rotatingButtonWidth" controls-position="right" :min="1"></el-input-number>
+            </el-form-item>
+            <el-form-item label="旋转按钮高度">
+                <el-input-number v-model="form.rotatingButtonHeight" controls-position="right" :min="1"></el-input-number>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" @click="onSubmit">立即创建</el-button>
+                <el-button>取消</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: 'RotatingButtonDraft',
+        components: {
+        },
+        data() {
+            return {
+                form: {
+                    rotatingButtonWidth: '',
+                    rotatingButtonHeight: ''
+                },
+                rules: {
+                    rotatingButtonWidth: [
+                        { required: true, message: '请输入旋转按钮宽度', trigger: 'blur' },
+                    ],
+                    rotatingButtonHeight: [
+                        { required: true, message: '请输入旋转按钮高度', trigger: 'blur' },
+                    ]
+                }
+            };
+        },
+        computed: {
+
+        },
+        watch: {
+
+        },
+        mounted() {
+        },
+        methods: {
+            onSubmit() {
+                const rotatingButtonModel = {
+                    zlevel: 1,
+                    z: 1,
+                    x: 10,
+                    y: 10,
+                    _type: 'RotatingButton',
+                    width: this.form .rotatingButtonWidth,
+                    height: this.form.rotatingButtonHeight
+                };
+                this.$emit('createAppendageBox', rotatingButtonModel)
+            }
+        }
+    };
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+
+</style>