zhywpt-sp/subpackage/personal-center/setting/info_connect.vue

<template>
	<view class="content">
		<view class="text-value">
			为了帮助您更好的了解我们这主要的业务场景下，对您个人信息的收集、使用情况，我们制定了如下《个人信息收集清单》。
		</view>
		<view class="content-card">
			<view class="card">
				<view class="item-flex-bottom">
					<image :showLoading="true" :src="`${$imgUrl}user-tip.png`"
						style="width: 48rpx;height: 48rpx;">
					</image>
					<view class="card-title">
						用户登录
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						服务：
					</view>
					<view class="value">
						用户登录
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						权限：
					</view>
					<view class="value">
						微信授权
					</view>

				</view>
				<view class="item-flex">
					<view class="title">
						收集个人信息：
					</view>
					<view class="value">
						手机号、头像、用户昵称
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						证件/照片：
					</view>
					<view class="value">
						获取手机号完成用户登录
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						目的：
					</view>
					<view class="value">
						获取手机号完成用户登录
					</view>
				</view>
			</view>
			<view style="margin-top: 30rpx;" class="card">
				<view class="item-flex-bottom">
					<image :showLoading="true" :src="`${$imgUrl}touxiang.png`"
						style="width: 48rpx;height: 48rpx;">
					</image>
					<view class="card-title">
						个人信息管理头像
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						服务：
					</view>
					<view class="value">
						我的-个人信息管理-头像
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						权限：
					</view>
					<view class="value">
						手机拍照、手机相册权限
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						收集个人信息：
					</view>
					<view class="value">
						用户自有图片
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						证件/照片：
					</view>
					<view class="value">
						用户自有图片
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						目的：
					</view>
					<view class="value">
						用于查看或变更用户的头像
					</view>
				</view>
			</view>
			<view style="margin-top: 30rpx;" class="card">
				<view class="item-flex-bottom">
					<image :showLoading="true" :src="`${$imgUrl}address.png`"
						style="width: 48rpx;height: 48rpx;">
					</image>
					<view class="card-title">
						收货地址
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						服务：
					</view>
					<view class="value">
						我的-收货地址
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						权限：
					</view>
					<view class="value">
						--
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						收集个人信息：
					</view>
					<view class="value">
						收货人、联系电话、所在地区、 详细地址
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						证件/照片：
					</view>
					<view class="value">
						--
					</view>
				</view>
				<view class="item-flex">
					<view class="title">
						目的：
					</view>
					<view class="value">
						用于将商品邮寄给用户
					</view>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
</script>


<style lang="scss" scoped>
	.content {
		padding: 30rpx;
		background: #EEF7F7;

		.content-card {
			margin-top: 40rpx;
		}

		.card-title {}

		.item-flex-bottom {
			display: flex;
			align-items: center;
			padding-bottom: 10rpx;
			font-size: 30rpx;
			font-family: Noto Sans S Chinese;
			font-weight: 400;
			color: #333333;
			line-height: 58rpx;
			border-bottom: 1rpx solid #DCDCDC;
		}

		.text-value {
			font-size: 28rpx;
			font-family: Noto Sans S Chinese;
			font-weight: 400;
			color: #666666;
			line-height: 50rpx;
		}

		.card {
			padding: 25rpx;
			background: #FFFFFF;
			box-shadow: 0rpx 2rpx 6rpx 0rpx rgba(223, 223, 223, 0.8);
			border-radius: 20rpx;
		}

		.item-flex {
			display: flex;
			align-items: center;
		}

		.title {
			font-size: 26rpx;
			font-family: Noto Sans S Chinese;
			font-weight: 400;
			color: #999999;
			line-height: 58rpx;
		}

		.value {
			font-size: 26rpx;
			font-family: Noto Sans S Chinese;
			font-weight: 400;
			color: #333333;
			line-height: 58rpx;
		}
	}
</style>