feat: 初始化

components/Progress/Progress.vue

@@ -0,0 +1,39 @@
+<template>
+	<view v-if="Math.min(progress, 100) !== 100 || error" class="progressWrapper" :style="{ height: height, backgroundColor: backgroundColor }">
+		<view v-if="!error" class="progressBar" :style="{ width: `${Math.min(progress, 100)}%`, backgroundColor: activeColor }"></view>
+		<view v-else class="progressBar error"></view>
+	</view>
+</template>
+
+<script>
+export default {
+	name: 'Progress',
+	props: {
+		progress: {
+			type: Number,
+			required: false,
+			default: 100
+		},
+		error: { type: Boolean, required: false, default: false },
+		height: {
+			type: String,
+			required: false,
+			default: '2px'
+		},
+		activeColor: {
+			type: String,
+			required: false,
+			default: '#29BBE4'
+		},
+		backgroundColor: {
+			type: String,
+			required: false,
+			default: '#EBEBEB'
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+@import './index.scss';
+</style>

components/Progress/index.scss

@@ -0,0 +1,14 @@
+.progressWrapper {
+	width: 100%;
+	border-radius: 100px;
+	overflow: hidden;
+	.progressBar {
+		height: 100%;
+		border-radius: 100px;
+		transition: all 0.3s ease-out;
+		&.error {
+			width: 100%;
+			background-color: #ff5733;
+		}
+	}
+}