移动端效果,弹窗默认统一全屏,实现更好的适配效果
parent
09a1a497b9
commit
8540e8d2ae
|
@ -65,6 +65,9 @@
|
||||||
import { useFullScreen } from './hooks/useModalFullScreen';
|
import { useFullScreen } from './hooks/useModalFullScreen';
|
||||||
import { omit } from 'lodash-es';
|
import { omit } from 'lodash-es';
|
||||||
import { useDesign } from '/@/hooks/web/useDesign';
|
import { useDesign } from '/@/hooks/web/useDesign';
|
||||||
|
import { useAppInject } from '/@/hooks/web/useAppInject';
|
||||||
|
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: 'BasicModal',
|
name: 'BasicModal',
|
||||||
components: { Modal, ModalWrapper, ModalClose, ModalFooter, ModalHeader },
|
components: { Modal, ModalWrapper, ModalClose, ModalFooter, ModalHeader },
|
||||||
|
@ -94,13 +97,21 @@
|
||||||
if (instance) {
|
if (instance) {
|
||||||
emit('register', modalMethods, instance.uid);
|
emit('register', modalMethods, instance.uid);
|
||||||
}
|
}
|
||||||
|
const { getIsMobile } = useAppInject();
|
||||||
|
|
||||||
// Custom title component: get title
|
// Custom title component: get title
|
||||||
const getMergeProps = computed((): Recordable => {
|
const getMergeProps = computed((): Recordable => {
|
||||||
return {
|
const result = {
|
||||||
...props,
|
...props,
|
||||||
...(unref(propsRef) as any),
|
...(unref(propsRef) as any),
|
||||||
};
|
};
|
||||||
|
// update-begin--author:liaozhiyang---date:20240326---for:【QQYUN-8643】弹窗移动端弹窗统一全屏
|
||||||
|
if (getIsMobile.value) {
|
||||||
|
result.canFullscreen = false;
|
||||||
|
result.defaultFullscreen = true;
|
||||||
|
}
|
||||||
|
// update-end--author:liaozhiyang---date:20240326---for:【QQYUN-8643】弹窗移动端弹窗统一全屏
|
||||||
|
return result;
|
||||||
});
|
});
|
||||||
//update-begin-author:liusq date:2023-05-25 for:【issues/4856】Modal控件设置 :title = null 无效
|
//update-begin-author:liusq date:2023-05-25 for:【issues/4856】Modal控件设置 :title = null 无效
|
||||||
//是否未设置标题
|
//是否未设置标题
|
||||||
|
@ -153,6 +164,11 @@
|
||||||
|
|
||||||
watchEffect(() => {
|
watchEffect(() => {
|
||||||
fullScreenRef.value = !!props.defaultFullscreen;
|
fullScreenRef.value = !!props.defaultFullscreen;
|
||||||
|
// update-begin--author:liaozhiyang---date:20240326---for:【QQYUN-8643】弹窗移动端弹窗统一全屏
|
||||||
|
if (getIsMobile.value) {
|
||||||
|
fullScreenRef.value = true
|
||||||
|
}
|
||||||
|
// update-end--author:liaozhiyang---date:20240326---for:【QQYUN-8643】弹窗移动端弹窗统一全屏
|
||||||
});
|
});
|
||||||
|
|
||||||
watchEffect(() => {
|
watchEffect(() => {
|
||||||
|
@ -295,4 +311,9 @@
|
||||||
.jeecg-modal-content {
|
.jeecg-modal-content {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
html[data-theme='dark'] {
|
||||||
|
.jeecg-comment-outer {
|
||||||
|
border-left: 1px solid rgba(253, 253, 253, 0.12);
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue