fnvtk/soul-yongping
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化输入框和表单样式，确保在小程序和管理端开发中使用容器包裹输入框以避免布局问题。更新个人资料页，增加VIP用户的字段展示与编辑逻辑，确保用户体验一致性。调整相关文档以反映最新开发进展，提升功能可用性与用户体验。

Browse Source
This commit is contained in:
Alex-larget
2026-02-28 17:26:03 +08:00
parent 41e5b1258b
commit 8e2ea9b7c1
14 changed files with 195 additions and 114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
miniprogram/pages/match/match.wxml
View File

@@ -212,42 +212,48 @@
<view class="resource-form">
<view class="form-item">
<text class="form-label">我能帮到你什么 <text class="required">*</text></text>
<input class="form-input-new" placeholder="例如：私域运营、品牌策划、流量资源..." value="{{canHelp}}" bindinput="onCanHelpInput" maxlength="100"/>
<view class="form-input-wrap">
<input class="form-input-inner" type="text" placeholder="例如：私域运营、品牌策划、流量资源..." value="{{canHelp}}" bindinput="onCanHelpInput" maxlength="100"/>
</view>
</view>
<view class="form-item">
<text class="form-label">我需要什么帮助 <text class="required">*</text></text>
<input class="form-input-new" placeholder="例如：技术支持、资金、人脉..." value="{{needHelp}}" bindinput="onNeedHelpInput" maxlength="100"/>
<view class="form-input-wrap">
<input class="form-input-inner" placeholder="例如：技术支持、资金、人脉..." value="{{needHelp}}" bindinput="onNeedHelpInput" maxlength="100"/>
</view>
</view>
</view>
</block>
<!-- 联系方式输入区域 -->
<!-- 联系方式输入区域（Skill §6：view 包裹、padding 写 view、input width 100%） -->
<view class="input-area">
<view class="input-wrapper">
<text class="input-prefix">{{contactType === 'phone' ? '+86' : '@'}}</text>
<input
wx:if="{{contactType === 'phone'}}"
type="number"
class="input-field"
placeholder="请输入11位手机号"
placeholder-class="input-placeholder-new"
value="{{phoneNumber}}"
bindinput="onPhoneInput"
maxlength="11"
disabled="{{isJoining}}"
focus="{{contactType === 'phone'}}"
/>
<input
wx:else
type="text"
class="input-field"
placeholder="请输入微信号"
placeholder-class="input-placeholder-new"
value="{{wechatId}}"
bindinput="onWechatInput"
disabled="{{isJoining}}"
focus="{{contactType === 'wechat'}}"
/>
<view class="input-field-wrap">
<input
wx:if="{{contactType === 'phone'}}"
type="number"
class="input-field-inner"
placeholder="请输入11位手机号"
placeholder-class="input-placeholder-new"
value="{{phoneNumber}}"
bindinput="onPhoneInput"
maxlength="11"
disabled="{{isJoining}}"
focus="{{contactType === 'phone'}}"
/>
<input
wx:else
type="text"
class="input-field-inner"
placeholder="请输入微信号"
placeholder-class="input-placeholder-new"
value="{{wechatId}}"
bindinput="onWechatInput"
disabled="{{isJoining}}"
focus="{{contactType === 'wechat'}}"
/>
</view>
</view>
<text class="error-msg" wx:if="{{joinError}}">{{joinError}}</text>
</view>

25
miniprogram/pages/match/match.wxss
View File

@@ -798,17 +798,24 @@
}
.input-prefix {
padding: 0 24rpx;
padding: 0 28rpx;
font-size: 28rpx;
color: rgba(255, 255, 255, 0.5);
border-right: 1rpx solid rgba(255, 255, 255, 0.1);
}
.input-field {
/* Skill §6：view 包裹、padding 写 view、input width 100% */
.input-field-wrap {
flex: 1;
padding: 28rpx 24rpx;
padding: 28rpx 32rpx;
box-sizing: border-box;
}
.input-field-inner {
width: 100%;
font-size: 32rpx;
color: #ffffff;
background: transparent;
box-sizing: border-box;
}
.input-placeholder-new {
@@ -1176,12 +1183,13 @@
border: 1rpx solid rgba(255, 255, 255, 0.2);
}
/* 资源对接表单 */
/* 资源对接表单（Skill §6：view 包裹、padding 写 view、input width 100%） */
.resource-form {
display: flex;
flex-direction: column;
gap: 20rpx;
margin-bottom: 24rpx;
padding: 0 40rpx;
}
.resource-form .form-item {
display: flex;
@@ -1192,13 +1200,18 @@
font-size: 26rpx;
color: rgba(255,255,255,0.6);
}
.resource-form .form-input-new {
.resource-form .form-input-wrap {
background: #1c1c1e;
border: 2rpx solid rgba(0,206,209,0.3);
border-radius: 16rpx;
padding: 20rpx;
padding: 24rpx 32rpx;
}
.resource-form .form-input-inner {
width: 100%;
font-size: 28rpx;
color: #fff;
background: transparent;
box-sizing: border-box;
}
/* 手机/微信号弹窗 - comprehensive_profile_editor_v1_2 */