taiyi
a8e6edf296
功能需求：活动分享与嘉宾匹配系统 1. 活动分享入口 每个活动配置独立的分享链接和二维码，支持扫码或点击链接进入小程序。 2. 用户绑定流程 用户通过分享链接/二维码打开小程序，填写个人信息并绑定至对应活动。 若用户曾参与过历史活动，系统自动复用其历史信息并完成绑定，无需重复填写。 绑定成功后，在活动正式开始前，用户无法查看其他参与者的信息。 3. 信息可见性规则 活动开始前：仅允许查看自己的信息，其他用户信息不可见。 活动开始后：开放本活动内异性嘉宾资料查看与匹配，其他活动的用户信息完全隔离，不可见。 资料展示：男嘉宾、女嘉宾资料分开展示，用户仅可浏览异性嘉宾信息。 4. 嘉宾选择规则 每位用户最多可选择 3 位心仪嘉宾。 确认提交后不可再新增选择，但支持修改或撤销已选嘉宾。 管理员可设置匹配截止时间，到达截止时间后系统自动锁定，禁止任何修改。 5. 匹配判定规则 双向互选：若双方恰好互选，则判定为匹配成功，双方均可查看匹配结果。 多向匹配：用户同时与多位嘉宾匹配成功，全部同时展示。 单向选择：A选择B但B未选择A，A可在"谁选了我"页面看到B。 6. 用户页面说明 异性嘉宾列表：展示所有异性嘉宾资料，支持选择/取消选择。 我的选择：展示当前已选的3位嘉宾，支持修改/撤销（截止前）。 谁选了我：展示所有选择了自己的嘉宾（无论自己是否选择了对方）。 匹配成功：展示所有双向互选的匹配对象，支持查看对方完整资料。
114 lines
1.6 KiB
Plaintext
114 lines
1.6 KiB
Plaintext
.form-page {
|
|
padding: 24rpx;
|
|
}
|
|
|
|
.form-card {
|
|
background: #ffffff;
|
|
border-radius: 24rpx;
|
|
padding: 24rpx;
|
|
}
|
|
|
|
.avatar-section {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
padding: 16rpx 0 32rpx;
|
|
}
|
|
|
|
.avatar-image {
|
|
width: 160rpx;
|
|
height: 160rpx;
|
|
border-radius: 50%;
|
|
background: #f2f3f5;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: #999999;
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.avatar-placeholder {
|
|
border: 2rpx dashed #d9d9d9;
|
|
}
|
|
|
|
.avatar-hint {
|
|
margin-top: 16rpx;
|
|
color: #999999;
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.gallery-list {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 16rpx;
|
|
}
|
|
|
|
.gallery-image,
|
|
.gallery-upload {
|
|
width: 180rpx;
|
|
height: 180rpx;
|
|
border-radius: 20rpx;
|
|
background: #f7f8fa;
|
|
}
|
|
|
|
.gallery-upload {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: #e8593c;
|
|
border: 2rpx dashed #f0b7a9;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.form-item {
|
|
padding: 20rpx 0;
|
|
border-bottom: 1rpx solid #f0f0f0;
|
|
}
|
|
|
|
.form-item:last-child {
|
|
border-bottom: 0;
|
|
}
|
|
|
|
.label {
|
|
display: block;
|
|
margin-bottom: 12rpx;
|
|
color: #666666;
|
|
}
|
|
|
|
.input,
|
|
.picker-value,
|
|
.textarea {
|
|
width: 100%;
|
|
min-height: 80rpx;
|
|
box-sizing: border-box;
|
|
background: #f7f8fa;
|
|
border-radius: 16rpx;
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.textarea-item .textarea {
|
|
min-height: 200rpx;
|
|
}
|
|
|
|
.action-bar {
|
|
display: flex;
|
|
gap: 20rpx;
|
|
margin-top: 24rpx;
|
|
}
|
|
|
|
.action-bar button {
|
|
flex: 1;
|
|
border-radius: 999rpx;
|
|
}
|
|
|
|
.ghost-btn {
|
|
background: #ffffff;
|
|
color: #e8593c;
|
|
border: 1rpx solid #e8593c;
|
|
}
|
|
|
|
.primary-btn {
|
|
background: #e8593c;
|
|
color: #ffffff;
|
|
}
|