fix: 弹窗优化

This commit is contained in:
ZhuRui
2026-07-27 10:00:12 +08:00
parent e3e66ec03b
commit 7b6fd59023
7 changed files with 97 additions and 79 deletions
+8 -6
View File
@@ -227,12 +227,14 @@ export default defineComponent({
</Layout> </Layout>
{/* 修改密码弹窗 */} {/* 修改密码弹窗 */}
<ChangePasswordModal {changePwdVisible.value && (
visible={changePwdVisible.value} <ChangePasswordModal
submitting={changePwdSubmitting.value} visible={changePwdVisible.value}
onClose={() => setChangePwdVisible(false)} submitting={changePwdSubmitting.value}
onSave={handleChangePwdSave} onClose={() => setChangePwdVisible(false)}
/> onSave={handleChangePwdSave}
/>
)}
</Layout> </Layout>
); );
}, },
@@ -515,32 +515,34 @@ export default defineComponent({
</Modal> </Modal>
{/* ===== 图片裁剪弹窗 ===== */} {/* ===== 图片裁剪弹窗 ===== */}
<Modal {cropperVisible.value && (
visible={cropperVisible.value} <Modal
title="裁剪图片" visible={cropperVisible.value}
width={800} title="裁剪图片"
footer={null} width={800}
onCancel={onCropperCancel} footer={null}
centered onCancel={onCropperCancel}
destroyOnClose centered
> destroyOnClose
<div style={{ height: '500px' }}> >
<ImageCropper <div style={{ height: '500px' }}>
src={uploadImageUrl.value} <ImageCropper
aspectRatio={CROP_ASPECT_RATIO} src={uploadImageUrl.value}
autoCrop={true} aspectRatio={CROP_ASPECT_RATIO}
autoCropArea={0.8} autoCrop={true}
viewMode={1} autoCropArea={0.8}
dragMode="move" viewMode={1}
movable={true} dragMode="move"
scalable={true} movable={true}
zoomable={true} scalable={true}
cropBoxMovable={true} zoomable={true}
cropBoxResizable={true} cropBoxMovable={true}
onCrop={handleCropConfirm} cropBoxResizable={true}
/> onCrop={handleCropConfirm}
</div> />
</Modal> </div>
</Modal>
)}
</> </>
); );
}, },
+9 -7
View File
@@ -267,13 +267,15 @@ export default defineComponent({
</div> </div>
{/* ===== 新增/编辑弹窗 ===== */} {/* ===== 新增/编辑弹窗 ===== */}
<BannerFormModal {modalVisible.value && (
visible={modalVisible.value} <BannerFormModal
record={editingRecord.value} visible={modalVisible.value}
submitting={formSubmitting.value} record={editingRecord.value}
onClose={handleCloseModal} submitting={formSubmitting.value}
onSave={handleSave} onClose={handleCloseModal}
/> onSave={handleSave}
/>
)}
</div> </div>
); );
}, },
+13 -9
View File
@@ -285,15 +285,19 @@ export default defineComponent({
</div> </div>
{/* ===== 弹窗区 ===== */} {/* ===== 弹窗区 ===== */}
<EventRegulationModal {regulationModalVisible.value && (
visible={regulationModalVisible.value} <EventRegulationModal
onClose={() => setRegulationModalVisible(false)} visible={regulationModalVisible.value}
/> onClose={() => setRegulationModalVisible(false)}
<EventDetailModal />
visible={detailModalVisible.value} )}
record={currentRecord.value} {detailModalVisible.value && (
onClose={() => setDetailModalVisible(false)} <EventDetailModal
/> visible={detailModalVisible.value}
record={currentRecord.value}
onClose={() => setDetailModalVisible(false)}
/>
)}
</div> </div>
); );
}, },
+12 -10
View File
@@ -252,16 +252,18 @@ export default defineComponent({
</div> </div>
{/* ===== 详情弹窗 ===== */} {/* ===== 详情弹窗 ===== */}
<OrderDetailModal {detailVisible.value && (
visible={detailVisible.value} <OrderDetailModal
record={currentRecord.value} visible={detailVisible.value}
onClose={() => setDetailVisible(false)} record={currentRecord.value}
onReRefund={(record) => { onClose={() => setDetailVisible(false)}
// 关闭详情弹窗,再弹出二次确认 onReRefund={(record) => {
setDetailVisible(false); // 关闭详情弹窗,再弹出二次确认
promptReRefund(record); setDetailVisible(false);
}} promptReRefund(record);
/> }}
/>
)}
</div> </div>
); );
}, },
+18 -14
View File
@@ -182,22 +182,26 @@ export default defineComponent({
</div> </div>
{/* ===== 角色表单弹窗 ===== */} {/* ===== 角色表单弹窗 ===== */}
<RoleFormModal {formVisible.value && (
visible={formVisible.value} <RoleFormModal
record={editingRecord.value} visible={formVisible.value}
submitting={formSubmitting.value} record={editingRecord.value}
onClose={handleCloseForm} submitting={formSubmitting.value}
onSave={handleSave} onClose={handleCloseForm}
/> onSave={handleSave}
/>
)}
{/* ===== 角色用户列表弹窗 ===== */} {/* ===== 角色用户列表弹窗 ===== */}
<UserListModal {userListVisible.value && (
visible={userListVisible.value} <UserListModal
role={currentRole.value} visible={userListVisible.value}
users={getRoleUsers(currentRole.value?.roleId || '')} role={currentRole.value}
renderStatus={renderStatus} users={getRoleUsers(currentRole.value?.roleId || '')}
onClose={handleCloseUserList} renderStatus={renderStatus}
/> onClose={handleCloseUserList}
/>
)}
</div> </div>
); );
}, },
+9 -7
View File
@@ -197,13 +197,15 @@ export default defineComponent({
</div> </div>
{/* ===== 新增/编辑弹窗 ===== */} {/* ===== 新增/编辑弹窗 ===== */}
<UserFormModal {modalVisible.value && (
visible={modalVisible.value} <UserFormModal
record={editingRecord.value} visible={modalVisible.value}
submitting={formSubmitting.value} record={editingRecord.value}
onClose={handleCloseModal} submitting={formSubmitting.value}
onSave={handleSave} onClose={handleCloseModal}
/> onSave={handleSave}
/>
)}
</div> </div>
); );
}, },