[AI Generated]: feat(Comp): 新增添加用户弹窗的用户类型切换功能,支持员工模式(工号查询)与家庭用户模式(手动填写),切换时自动清空已填数据
This commit is contained in:
@@ -8,8 +8,22 @@ Component({
|
||||
data: {
|
||||
animationData: null,
|
||||
modalStatus: false,
|
||||
// 用户类型:employee=员工,family=家庭用户
|
||||
userType: 'employee',
|
||||
// 员工模式
|
||||
workNo: "",
|
||||
userInfo: null,
|
||||
// 家庭用户模式 - 手动填写
|
||||
familyInfo: {
|
||||
name: '',
|
||||
sex: 1,
|
||||
birthday: '',
|
||||
height: '',
|
||||
weight: ''
|
||||
},
|
||||
// 性别选择器选项
|
||||
genderOptions: ['男', '女'],
|
||||
genderIndex: 0,
|
||||
},
|
||||
lifetimes: {
|
||||
// 在组件实例进入页面节点树时执行
|
||||
@@ -32,7 +46,7 @@ Component({
|
||||
delay: 0
|
||||
})
|
||||
this.animation = animation;
|
||||
animation.translateY(1100).step();
|
||||
animation.translateY(1200).step();
|
||||
this.setData({
|
||||
animationData: animation.export(),
|
||||
modalStatus: true
|
||||
@@ -54,7 +68,7 @@ Component({
|
||||
delay: 0
|
||||
})
|
||||
this.animation = animation;
|
||||
animation.translateY(1100).step();
|
||||
animation.translateY(1200).step();
|
||||
this.setData({
|
||||
animationData: animation.export(),
|
||||
})
|
||||
@@ -67,16 +81,44 @@ Component({
|
||||
}, 200);
|
||||
},
|
||||
|
||||
// 关闭弹窗并重置数据
|
||||
// 关闭弹窗并重置所有数据
|
||||
closeModal() {
|
||||
this.setData({
|
||||
userType: 'employee',
|
||||
workNo: "",
|
||||
userInfo: null,
|
||||
familyInfo: {
|
||||
name: '',
|
||||
sex: 1,
|
||||
birthday: '',
|
||||
height: '',
|
||||
weight: ''
|
||||
},
|
||||
genderIndex: 0,
|
||||
});
|
||||
this.hideModal();
|
||||
},
|
||||
|
||||
// 监听工号输入
|
||||
// 切换用户类型,同时清空所有已填数据
|
||||
switchUserType(e) {
|
||||
const type = e.currentTarget.dataset.type;
|
||||
if (type === this.data.userType) return;
|
||||
this.setData({
|
||||
userType: type,
|
||||
workNo: "",
|
||||
userInfo: null,
|
||||
familyInfo: {
|
||||
name: '',
|
||||
sex: 1,
|
||||
birthday: '',
|
||||
height: '',
|
||||
weight: ''
|
||||
},
|
||||
genderIndex: 0,
|
||||
});
|
||||
},
|
||||
|
||||
// 监听工号输入(员工模式)
|
||||
onWorkNoInput(e) {
|
||||
this.setData({
|
||||
workNo: e.detail.value,
|
||||
@@ -84,17 +126,47 @@ Component({
|
||||
});
|
||||
},
|
||||
|
||||
// 监听身高输入
|
||||
// 监听身高输入(员工模式)
|
||||
onHeightInput(e) {
|
||||
this.setData({ 'userInfo.height': e.detail.value });
|
||||
},
|
||||
|
||||
// 监听体重输入
|
||||
// 监听体重输入(员工模式)
|
||||
onWeightInput(e) {
|
||||
this.setData({ 'userInfo.weight': e.detail.value });
|
||||
},
|
||||
|
||||
// 根据工号查询用户信息
|
||||
// 监听家庭用户姓名输入
|
||||
onFamilyNameInput(e) {
|
||||
this.setData({ 'familyInfo.name': e.detail.value });
|
||||
},
|
||||
|
||||
// 监听家庭用户性别选择
|
||||
onFamilyGenderChange(e) {
|
||||
const index = e.detail.value;
|
||||
// 1=男,2=女
|
||||
this.setData({
|
||||
genderIndex: index,
|
||||
'familyInfo.sex': index === '0' || index === 0 ? 1 : 2
|
||||
});
|
||||
},
|
||||
|
||||
// 监听家庭用户生日选择
|
||||
onFamilyBirthdayChange(e) {
|
||||
this.setData({ 'familyInfo.birthday': e.detail.value });
|
||||
},
|
||||
|
||||
// 监听家庭用户身高输入
|
||||
onFamilyHeightInput(e) {
|
||||
this.setData({ 'familyInfo.height': e.detail.value });
|
||||
},
|
||||
|
||||
// 监听家庭用户体重输入
|
||||
onFamilyWeightInput(e) {
|
||||
this.setData({ 'familyInfo.weight': e.detail.value });
|
||||
},
|
||||
|
||||
// 根据工号查询用户信息(员工模式)
|
||||
searchUser() {
|
||||
let workNo = this.data.workNo.trim();
|
||||
if (!workNo) {
|
||||
@@ -130,38 +202,67 @@ Component({
|
||||
|
||||
// 确定提交
|
||||
submit() {
|
||||
const sn = app.globalData.ppScale.device.mac.replace(/:/g, '');
|
||||
|
||||
if (this.data.userType === 'employee') {
|
||||
// 员工模式:必须先查询到用户信息
|
||||
if (!this.data.userInfo) {
|
||||
wx.showToast({
|
||||
title: "请先查询用户信息",
|
||||
icon: "none"
|
||||
})
|
||||
wx.showToast({ title: "请先查询用户信息", icon: "none" });
|
||||
return;
|
||||
}
|
||||
let userInfo = this.data.userInfo;
|
||||
// 校验身高
|
||||
if (!userInfo.height) {
|
||||
wx.showToast({ title: "请输入身高", icon: "none" });
|
||||
return;
|
||||
}
|
||||
// 校验体重
|
||||
if (!userInfo.weight) {
|
||||
wx.showToast({ title: "请输入体重", icon: "none" });
|
||||
return;
|
||||
}
|
||||
userInfo.sn = app.globalData.ppScale.device.mac.replace(/:/g, '')
|
||||
userInfo.sn = sn;
|
||||
$.ajax("weighingScale/v2/edit/user", userInfo, "POST", true, "正在添加...").then(res => {
|
||||
wx.showToast({
|
||||
title: "添加成功",
|
||||
icon: "success"
|
||||
})
|
||||
wx.showToast({ title: "添加成功", icon: "success" });
|
||||
this.triggerEvent('returnDate', { userInfo });
|
||||
this.closeModal();
|
||||
}).catch(() => {
|
||||
wx.showToast({
|
||||
title: "添加失败,请重试",
|
||||
icon: "none"
|
||||
})
|
||||
})
|
||||
wx.showToast({ title: "添加失败,请重试", icon: "none" });
|
||||
});
|
||||
|
||||
} else {
|
||||
// 家庭用户模式:校验手动填写的字段
|
||||
const familyInfo = this.data.familyInfo;
|
||||
if (!familyInfo.name.trim()) {
|
||||
wx.showToast({ title: "请输入姓名", icon: "none" });
|
||||
return;
|
||||
}
|
||||
if (!familyInfo.birthday) {
|
||||
wx.showToast({ title: "请选择生日", icon: "none" });
|
||||
return;
|
||||
}
|
||||
if (!familyInfo.height) {
|
||||
wx.showToast({ title: "请输入身高", icon: "none" });
|
||||
return;
|
||||
}
|
||||
if (!familyInfo.weight) {
|
||||
wx.showToast({ title: "请输入体重", icon: "none" });
|
||||
return;
|
||||
}
|
||||
const submitData = {
|
||||
realname: familyInfo.name.trim(),
|
||||
sex: familyInfo.sex,
|
||||
birthday: familyInfo.birthday,
|
||||
height: familyInfo.height,
|
||||
weight: familyInfo.weight,
|
||||
sn: sn
|
||||
};
|
||||
$.ajax("weighingScale/v2/edit/user", submitData, "POST", true, "正在添加...").then(res => {
|
||||
wx.showToast({ title: "添加成功", icon: "success" });
|
||||
this.triggerEvent('returnDate', { userInfo: submitData });
|
||||
this.closeModal();
|
||||
}).catch(() => {
|
||||
wx.showToast({ title: "添加失败,请重试", icon: "none" });
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -8,13 +8,30 @@
|
||||
<view>添加用户</view>
|
||||
</view>
|
||||
<view class="seaction">
|
||||
<!-- 用户类型切换 -->
|
||||
<view class="select">
|
||||
<view
|
||||
class="{{userType === 'employee' ? 'selectActive' : ''}}"
|
||||
bindtap="switchUserType"
|
||||
data-type="employee"
|
||||
>员工</view>
|
||||
<view
|
||||
class="{{userType === 'family' ? 'selectActive' : ''}}"
|
||||
bindtap="switchUserType"
|
||||
data-type="family"
|
||||
>家庭用户</view>
|
||||
</view>
|
||||
|
||||
<!-- 员工模式 -->
|
||||
<block wx:if="{{userType === 'employee'}}">
|
||||
<!-- 工号输入 -->
|
||||
<view class="input">
|
||||
<view>工号:</view>
|
||||
<view>
|
||||
<input type="text" maxlength="8" placeholder="输入工号自动显示员工信息" value="{{workNo}}" bindinput="onWorkNoInput" bindconfirm="searchUser" />
|
||||
</view>
|
||||
<!-- <view class="searchBtn" bind:tap="searchUser">查询</view>-->
|
||||
</view>
|
||||
<!-- 姓名(只读) -->
|
||||
<view class="only">
|
||||
<view>姓名:</view>
|
||||
<view>
|
||||
@@ -29,6 +46,7 @@
|
||||
<view></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 性别(只读) -->
|
||||
<view class="only">
|
||||
<view>性别:</view>
|
||||
<view>
|
||||
@@ -43,6 +61,7 @@
|
||||
<view></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 生日(只读) -->
|
||||
<view class="only">
|
||||
<view>生日:</view>
|
||||
<view>
|
||||
@@ -57,6 +76,7 @@
|
||||
<view></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 身高(可输入) -->
|
||||
<view class="inputUnit">
|
||||
<view>身高:</view>
|
||||
<view>
|
||||
@@ -66,6 +86,7 @@
|
||||
<view>cm</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 体重(可输入) -->
|
||||
<view class="inputUnit">
|
||||
<view>体重:</view>
|
||||
<view>
|
||||
@@ -75,6 +96,67 @@
|
||||
<view>kg</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!-- 家庭用户模式 -->
|
||||
<block wx:elif="{{userType === 'family'}}">
|
||||
<!-- 姓名(手动输入) -->
|
||||
<view class="input">
|
||||
<view>姓名:</view>
|
||||
<view>
|
||||
<input type="text" placeholder="请输入姓名" value="{{familyInfo.name}}" bindinput="onFamilyNameInput" />
|
||||
</view>
|
||||
</view>
|
||||
<!-- 性别(picker 选择) -->
|
||||
<view class="only">
|
||||
<view>性别:</view>
|
||||
<view>
|
||||
<view>
|
||||
<picker range="{{genderOptions}}" value="{{genderIndex}}" bindchange="onFamilyGenderChange">
|
||||
<view style="color: #252535; font-size: 32rpx; font-weight: 500; height: 100rpx; line-height: 100rpx;">
|
||||
{{genderOptions[genderIndex]}}
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
<view></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 生日(picker date 选择) -->
|
||||
<view class="only">
|
||||
<view>生日:</view>
|
||||
<view>
|
||||
<view>
|
||||
<picker mode="date" value="{{familyInfo.birthday}}" start="1900-01-01" bindchange="onFamilyBirthdayChange">
|
||||
<view style="color: {{familyInfo.birthday ? '#252535' : '#808080'}}; font-size: 32rpx; font-weight: 500; height: 100rpx; line-height: 100rpx;">
|
||||
{{familyInfo.birthday || '请选择生日'}}
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
<view></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 身高(手动输入) -->
|
||||
<view class="inputUnit">
|
||||
<view>身高:</view>
|
||||
<view>
|
||||
<view>
|
||||
<input type="digit" value="{{familyInfo.height}}" bindinput="onFamilyHeightInput" placeholder="请输入身高" />
|
||||
</view>
|
||||
<view>cm</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 体重(手动输入) -->
|
||||
<view class="inputUnit">
|
||||
<view>体重:</view>
|
||||
<view>
|
||||
<view>
|
||||
<input type="digit" value="{{familyInfo.weight}}" bindinput="onFamilyWeightInput" placeholder="请输入体重" />
|
||||
</view>
|
||||
<view>kg</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</view>
|
||||
<view class="footer">
|
||||
<view bind:tap="closeModal">取消</view>
|
||||
|
||||
Reference in New Issue
Block a user