新增:Form组件支持响应式配置,路由支持外部地址(内联)

This commit is contained in:
xiaoma
2021-08-09 16:16:16 +08:00
parent ade138997d
commit 0979b5af5d
9 changed files with 124 additions and 12 deletions

1
src/views/frame/docs.vue Normal file
View File

@@ -0,0 +1 @@
<template> 项目文档 </template>

View File

@@ -0,0 +1,72 @@
<template>
<n-spin :show="loading">
<div class="frame">
<iframe :src="frameSrc" class="frame-iframe" scrolling="no" ref="frameRef"></iframe>
</div>
</n-spin>
</template>
<script lang="ts">
import { defineComponent, ref, unref, onMounted, nextTick } from 'vue';
import { useRoute } from 'vue-router';
export default defineComponent({
name: 'IFrame',
setup() {
const currentRoute = useRoute();
const loading = ref(false);
const frameRef = ref<HTMLFrameElement | null>(null);
const frameSrc = ref<string>('');
if (unref(currentRoute.meta)?.frameSrc) {
frameSrc.value = unref(currentRoute.meta)?.frameSrc as string;
}
function hideLoading() {
loading.value = false;
}
function init() {
nextTick(() => {
const iframe = unref(frameRef);
if (!iframe) return;
const _frame = iframe as any;
if (_frame.attachEvent) {
_frame.attachEvent('onload', () => {
hideLoading();
});
} else {
iframe.onload = () => {
hideLoading();
};
}
});
}
onMounted(() => {
loading.value = true;
init();
});
return {
loading,
frameRef,
frameSrc,
};
},
});
</script>
<style lang="less" scoped>
.frame {
width: 100%;
height: 100vh;
&-iframe {
width: 100%;
height: 100%;
overflow: hidden;
border: 0;
box-sizing: border-box;
}
}
</style>

View File

@@ -285,7 +285,7 @@
});
const [register, {}] = useForm({
gridProps: { cols: '4' },
gridProps: { cols: '1 s:1 m:2 l:3 xl:4 2xl:4' },
labelWidth: 80,
schemas,
});