feat: 初始化

pages/components/completeInfoReminder/detailModal/index.scss

@@ -0,0 +1,41 @@
+.detailModal {
+	position: relative;
+	width: calc(100vw - 50px);
+	max-width: 363px;
+	padding: 32px 29px 42px;
+	background-color: #fff;
+	box-sizing: border-box;
+	.closeIcon {
+		position: absolute;
+		top: 18px;
+		right: 21px;
+		width: 17px;
+		height: 17px;
+	}
+	.detailContent {
+		.title {
+			color: #333333;
+			font-size: 28px;
+			font-weight: 700;
+			line-height: 41px;
+		}
+		.desc {
+			margin-top: 8px;
+			color: #999999;
+			font-size: 14px;
+			line-height: 14px;
+		}
+		.steps {
+			margin-top: 27px;
+			::v-deep .uni-steps__column-title {
+				font-weight: 500;
+				color: #333333 !important;
+			}
+		}
+		.startNow {
+			margin-top: -17px;
+			height: 40px;
+			cursor: pointer;
+		}
+	}
+}

pages/components/completeInfoReminder/detailModal/index.vue

@@ -0,0 +1,70 @@
+<template>
+	<slot :showDetailDialog="showDetailDialog"></slot>
+	<uni-popup ref="alertDialog" :isMaskClick="false">
+		<view class="detailModal">
+			<uni-icons type="closeempty" size="17" class="closeIcon" @click="closeDetailDialog"></uni-icons>
+			<view class="detailContent">
+				<view class="title">{{ $t('home.verificationSteps.title') }}</view>
+				<view class="desc">{{ $t('home.verificationSteps.desc') }}</view>
+				<view class="steps">
+					<uni-steps :options="stepList" :active="-1" active-color="#007AFF" direction="column" />
+				</view>
+				<view class="primaryButton startNow" @click="toComplete">
+					{{ $t('home.verificationSteps.startNow') }}
+				</view>
+			</view>
+		</view>
+	</uni-popup>
+</template>
+
+<script>
+export default {
+	name: 'DetailModal',
+	props: {
+		visible: {
+			type: Boolean,
+			required: true,
+			default: false
+		}
+	},
+	data() {
+		return {
+			stepList: [
+				{
+					title: this.$t('home.verificationSteps.step1.title'),
+					desc: this.$t('home.verificationSteps.step1.desc')
+				},
+				{
+					title: this.$t('home.verificationSteps.step2.title'),
+					desc: this.$t('home.verificationSteps.step2.desc')
+				},
+				{
+					title: this.$t('home.verificationSteps.step3.title'),
+					desc: this.$t('home.verificationSteps.step3.desc')
+				},
+				{
+					title: this.$t('home.verificationSteps.step4.title'),
+					desc: this.$t('home.verificationSteps.step4.desc')
+				}
+			]
+		};
+	},
+	methods: {
+		toVerifyPage() {},
+		showDetailDialog() {
+			this.$refs.alertDialog.open();
+		},
+		closeDetailDialog() {
+			this.$refs.alertDialog.close();
+		},
+		toComplete() {
+			this.closeDetailDialog()
+			uni.navigateTo({ url: '/pages/user/index' });
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+@import './index.scss';
+</style>