diff --git a/components/applyForm/index.vue b/components/applyForm/index.vue
index bc6da0f..c27e121 100644
--- a/components/applyForm/index.vue
+++ b/components/applyForm/index.vue
@@ -126,7 +126,11 @@
{{ currentCheckboxItem.name || '请选择' }}
完成
-
+
{checkboxGroupChange(e, currentCheckboxItem)}">
-
+
@@ -179,6 +183,7 @@
showCheckboxModal: false,
currentCheckboxItem: {},
currentCheckboxIndex: 0,
+ checkboxContentHeight: 400, // 多选弹窗内容区域高度,单位px
// 日期
dateShow: false,
dateParams: {
@@ -222,6 +227,7 @@
this.formData = {
token: token
}
+ this.calculateCheckboxHeight()
},
onLoad() {
@@ -327,6 +333,22 @@
this.currentCheckboxItem = item
this.currentCheckboxIndex = index
this.showCheckboxModal = true
+ this.$nextTick(() => {
+ this.calculateCheckboxHeight()
+ })
+ },
+ // 计算多选弹窗内容区域高度
+ calculateCheckboxHeight() {
+ uni.getSystemInfo({
+ success: (res) => {
+ // 屏幕高度的 60%,减去 header 的高度
+ const maxHeight = res.windowHeight * 0.6
+ // header 大约 100rpx,转换为 px
+ const headerHeight = 100 * (res.windowWidth / 750)
+ // content 高度 = 最大高度 - header - 底部 padding
+ this.checkboxContentHeight = maxHeight - headerHeight - 80
+ }
+ })
},
// 多选
checkboxGroupChange(e, item) {
@@ -850,16 +872,17 @@
}
&__content {
- max-height: 60vh;
- overflow-y: auto;
padding: 20rpx 30rpx 40rpx;
+ box-sizing: border-box;
}
&__item {
display: flex;
align-items: center;
padding: 24rpx 0;
+ padding-left: 10rpx; // 增加左侧 padding,确保 checkbox 不被遮挡
border-bottom: 1rpx solid #f5f5f5;
+ box-sizing: border-box;
&:last-child {
border-bottom: none;
@@ -868,12 +891,14 @@
&__control {
transform: scale(1.1);
+ flex-shrink: 0; // 防止 checkbox 被压缩
}
&__label {
margin-left: 20rpx;
font-size: 28rpx;
color: #333;
+ flex: 1;
}
}
diff --git a/components/difference-modal/index.vue b/components/difference-modal/index.vue
index 9647576..1928c15 100644
--- a/components/difference-modal/index.vue
+++ b/components/difference-modal/index.vue
@@ -4,7 +4,11 @@
-
+
您本次提交的信息与过往信息不同,是否更新本次信息?
- 原值:
- {{ item.oldValue }}
+ 原信息:
+ {{ item.oldValue }}
- 新值:
- {{ item.newValue }}
+ 新信息:
+ {{ item.newValue }}
-
+
@@ -61,9 +75,41 @@
default: () => []
}
},
+ data() {
+ return {
+ contentHeight: 400 // 默认高度,单位px
+ }
+ },
+ mounted() {
+ this.calculateHeight()
+ },
+ watch: {
+ show(newVal) {
+ if (newVal) {
+ this.$nextTick(() => {
+ this.calculateHeight()
+ })
+ }
+ }
+ },
methods: {
handleChoice(update) {
this.$emit('choice', update)
+ },
+ calculateHeight() {
+ // 使用系统信息计算合适的高度
+ // 弹框最大高度 80vh,减去 header 和 footer 的高度
+ uni.getSystemInfo({
+ success: (res) => {
+ // 屏幕高度的 70%(减小了 10%)
+ const maxHeight = res.windowHeight * 0.7
+ // header 大约 120rpx,footer 大约 200rpx,转换为 px
+ const headerHeight = 120 * (res.windowWidth / 750)
+ const footerHeight = 200 * (res.windowWidth / 750)
+ // content 高度 = 总高度 - header - footer - 额外减少 50px
+ this.contentHeight = maxHeight - headerHeight - footerHeight - 50
+ }
+ })
}
}
}
@@ -72,12 +118,19 @@
\ No newline at end of file
diff --git a/packages/apply/index.vue b/packages/apply/index.vue
index a86e831..c98d52f 100644
--- a/packages/apply/index.vue
+++ b/packages/apply/index.vue
@@ -239,10 +239,16 @@
return false
}
},
- // 处理用户选择(按本次信息更新/维持原信息)
+ // 处理用户选择(按本次信息更新/维持原信息/返回修改)
async handleDifferenceChoice(update) {
this.showDifferenceModal = false
+ if (update === 'cancel') {
+ // 选择"返回修改",关闭弹窗,解锁,让用户重新修改表单
+ this.isLocked = false
+ return
+ }
+
if (update) {
// 选择"按本次信息更新"
const success = await this.updateUserInfo()