|
|
@@ -0,0 +1,184 @@
|
|
|
+<template>
|
|
|
+ <view class="common_page" :style="{'min-height':h+'px', 'padding-top':mt+'px'}">
|
|
|
+ <cus-header :title="title" bgColor="#FFFFFF"></cus-header>
|
|
|
+ <div class="form">
|
|
|
+ <div class="title">家庭人员信息</div>
|
|
|
+ <div class="pre adfac" style="margin-top: 40rpx;">
|
|
|
+ <div class="pre-title"><span>*</span>人员类型</div>
|
|
|
+ <div class="pre-content adfac">
|
|
|
+ <div class="pre-content-box adfac" @tap="changeMember(1,'type')">
|
|
|
+ <image v-if="memberInfo.type==1" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/10/09/9efae012-a9fd-4a0d-9e14-7ec90001e712.png"></image>
|
|
|
+ <image v-else src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/10/09/5ae64305-d1e0-4ffe-8dc0-f9d3704ac370.png"></image>
|
|
|
+ <text>成人</text>
|
|
|
+ </div>
|
|
|
+ <div class="pre-content-box adfac" @tap="changeMember(2,'type')">
|
|
|
+ <image v-if="memberInfo.type==2" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/10/09/9efae012-a9fd-4a0d-9e14-7ec90001e712.png"></image>
|
|
|
+ <image v-else src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/10/09/5ae64305-d1e0-4ffe-8dc0-f9d3704ac370.png"></image>
|
|
|
+ <text>学生</text>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="pre adfac">
|
|
|
+ <div class="pre-title"><span>*</span>姓名</div>
|
|
|
+ <div class="pre-content">
|
|
|
+ <up-input v-model="memberInfo.name" border="none" style="font-size: 30rpx;color: #252525;" placeholder="请输入姓名"></up-input>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="pre adfac">
|
|
|
+ <div class="pre-title"><span>*</span>身份证</div>
|
|
|
+ <div class="pre-content">
|
|
|
+ <up-input v-model="memberInfo.idcard" border="none" style="font-size: 30rpx;color: #252525;" placeholder="请输入身份证"></up-input>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="pre adfac">
|
|
|
+ <div class="pre-title"><span style="color: #FFFFFF;">*</span>义工号</div>
|
|
|
+ <div class="pre-content">
|
|
|
+ <up-input v-model="memberInfo.workNo" border="none" style="font-size: 30rpx;color: #252525;" placeholder="请输入义工号"></up-input>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="pre adfac">
|
|
|
+ <div class="pre-title"><span>*</span>性别</div>
|
|
|
+ <div class="pre-content adfac">
|
|
|
+ <div class="pre-content-box adfac" @tap="changeMember(1,'sex')">
|
|
|
+ <image v-if="memberInfo.sex==1" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/10/09/9efae012-a9fd-4a0d-9e14-7ec90001e712.png"></image>
|
|
|
+ <image v-else src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/10/09/5ae64305-d1e0-4ffe-8dc0-f9d3704ac370.png"></image>
|
|
|
+ <text>男</text>
|
|
|
+ </div>
|
|
|
+ <div class="pre-content-box adfac" @tap="changeMember(2,'sex')">
|
|
|
+ <image v-if="memberInfo.sex==2" src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/10/09/9efae012-a9fd-4a0d-9e14-7ec90001e712.png"></image>
|
|
|
+ <image v-else src="https://transcend.ringzle.com/xiaozhi-app/profile/2025/10/09/5ae64305-d1e0-4ffe-8dc0-f9d3704ac370.png"></image>
|
|
|
+ <text>女</text>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="pre adfac" v-if="memberInfo.type==2">
|
|
|
+ <div class="pre-title"><span>*</span>就读学校</div>
|
|
|
+ <div class="pre-content">
|
|
|
+ <up-input v-model="memberInfo.school" border="none" style="font-size: 30rpx;color: #252525;" placeholder="请输入就读学校"></up-input>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="btn" @tap="handleSave">保存</div>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup name="">
|
|
|
+ import CusHeader from '@/components/CusHeader/index.vue'
|
|
|
+ import { onLoad } from '@dcloudio/uni-app';
|
|
|
+ import { ref, getCurrentInstance } from 'vue'
|
|
|
+ const { proxy } = getCurrentInstance()
|
|
|
+
|
|
|
+ const title = ref('添加家庭成员')
|
|
|
+ const memberInfo = ref({
|
|
|
+ type:1,
|
|
|
+ name:'',
|
|
|
+ idcard:'',
|
|
|
+ workNo:'',
|
|
|
+ sex:1,
|
|
|
+ school:''
|
|
|
+ })
|
|
|
+
|
|
|
+ const changeMember = (value,key) => {
|
|
|
+ memberInfo.value[key] = value;
|
|
|
+ }
|
|
|
+
|
|
|
+ const handleSave = () => {
|
|
|
+ if(!memberInfo.value.type) return proxy.$showToast('请选择人员类型')
|
|
|
+ if(!memberInfo.value.name) return proxy.$showToast('请输入姓名')
|
|
|
+ if(!proxy.$reg.idCard(memberInfo.value.idcard)) return proxy.$showToast('请输入正确的身份证号')
|
|
|
+ if(!memberInfo.value.sex) return proxy.$showToast('请选择性别')
|
|
|
+ if(!memberInfo.value.school&&memberInfo.value.type==2) return proxy.$showToast('请输入就读学校')
|
|
|
+ console.log(memberInfo.value);
|
|
|
+ }
|
|
|
+
|
|
|
+ onLoad((options)=>{
|
|
|
+ if (options.member) {
|
|
|
+ try {
|
|
|
+ const memberObject = JSON.parse(decodeURIComponent(options.member));
|
|
|
+ console.log('成功解析的 member 对象:', memberObject);
|
|
|
+ if(memberObject) title.value = '编辑家庭成员';
|
|
|
+ } catch (e) {
|
|
|
+ console.error('解析 member 参数失败:', e);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ console.warn('未在URL中找到 member 参数');
|
|
|
+ }
|
|
|
+ })
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+ .common_page{
|
|
|
+ padding-bottom: 184rpx;
|
|
|
+
|
|
|
+ .form{
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 24rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ padding: 36rpx 24rpx 0;
|
|
|
+
|
|
|
+ .title{
|
|
|
+ font-family: PingFang-SC, PingFang-SC;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 36rpx;
|
|
|
+ color: #151B29;
|
|
|
+ line-height: 48rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .pre{
|
|
|
+ padding: 25rpx 0;
|
|
|
+ box-shadow: inset 0rpx -1rpx 0rpx 0rpx #F2F2F2;
|
|
|
+ &-title{
|
|
|
+ width: 209rpx;
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #676775;
|
|
|
+ line-height: 40rpx;
|
|
|
+ label{
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #F4657A;
|
|
|
+ line-height: 42rpx;
|
|
|
+ margin-right: 4rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &-content{
|
|
|
+ width: calc(100% - 209rpx);
|
|
|
+ &-box{
|
|
|
+ width: 184rpx;
|
|
|
+ image{
|
|
|
+ width: 28rpx;
|
|
|
+ height: 28rpx;
|
|
|
+ }
|
|
|
+ text{
|
|
|
+ font-family: PingFangSC, PingFang SC;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #252525;
|
|
|
+ line-height: 42rpx;
|
|
|
+ margin-left: 16rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .btn{
|
|
|
+ width: calc(100% - 80rpx);
|
|
|
+ height: 90rpx;
|
|
|
+ background: #B7F358;
|
|
|
+ border-radius: 45rpx;
|
|
|
+ font-family: PingFang-SC, PingFang-SC;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #151B29;
|
|
|
+ line-height: 90rpx;
|
|
|
+ text-align: center;
|
|
|
+ letter-spacing: 2rpx;
|
|
|
+ position: fixed;
|
|
|
+ left: 40rpx;
|
|
|
+ bottom: 64rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
