diff --git a/src/components/Checkbox.vue b/src/components/Checkbox.vue
new file mode 100644
index 0000000..e887ae0
--- /dev/null
+++ b/src/components/Checkbox.vue
@@ -0,0 +1,76 @@
+<!--
+ * @Date: 2022-02-26 09:26:04
+ * @LastEditors: JinxChen
+ * @LastEditTime: 2022-03-04 11:40:00
+ * @FilePath: \AntpayFrontEnd\src\components\Checkbox.vue
+ * @description: 单选框组件
+-->
+<template>
+    <div class="checkbox-container">
+        <van-checkbox v-model="checked" shape="square" @change="onCheckChange">
+            <strong >已阅读协议并确认</strong>
+        </van-checkbox>
+    </div>
+</template>
+
+<script>
+export default {
+  name:'checkbox',
+  mounted() {
+      this.getDialogData();
+  },
+  data(){
+   return {
+       checked: false,
+   }
+  },
+  methods: {
+    //   获取从dialog组件传过来的参数
+    getDialogData() {
+        this.$bus.$on('getCheckStatus', (data) => {
+            this.checked = data;
+        })
+    },
+    //   单选框值发生变化时
+    onCheckChange(value) {
+        this.checked = value;
+        this.$emit('SendCheckStatus', value);
+    },
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.checkbox-container {
+    margin: 5px 0;
+    .agreement-container {
+        .agreement-content {
+            height: 500px;
+            padding: 5px 10px;
+            border-top: 0.5px soild;
+            border-bottom: 0.5px soild;
+            text-align: left;
+            overflow: scroll;
+            h5 {
+                padding: 5px;
+            }
+            p {
+                padding: 5px;
+                font-size: 14px;
+                line-height: 20px;
+            }
+            .agreement-button {
+                padding: 10px;
+                display: flex;
+                justify-content: space-around;
+                align-items: center;
+                .van-button {
+                    height: 30px;
+                    width: 120px;
+                    border-radius: 10px;
+                }
+            }
+        }
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/utils/bus.js b/src/utils/bus.js
new file mode 100644
index 0000000..fbd053e
--- /dev/null
+++ b/src/utils/bus.js
@@ -0,0 +1,10 @@
+/*
+ * @Date: 2022-02-28 15:30:40
+ * @LastEditors: JinxChen
+ * @LastEditTime: 2022-02-28 15:30:43
+ * @FilePath: \AntpayFrontEnd\src\utils\bus.js
+ * @description:
+ */
+import Vue from 'vue';
+const bus = new Vue();
+export default  bus;
\ No newline at end of file