view-shell.tsx 1.6 KB
Newer Older
1 2 3
import { IViewProvider } from '@ibiz-template/controller';
import { ModelUtil } from '@ibiz-template/model';
import { useNamespace } from '@ibiz-template/vue-util';
4
import { computed, defineComponent, PropType, ref } from 'vue';
5 6 7 8 9 10
import '@ibiz-template/theme/style/components/view-shell/view-shell.scss';
import { IModal } from '@ibiz-template/runtime';

export const ViewShell = defineComponent({
  name: 'ViewShell',
  props: {
11
    context: { type: Object as PropType<IContext>, required: true },
12 13
    params: { type: Object as PropType<IParams> },
    modal: { type: Object as PropType<IModal> },
14
    isRouter: { type: Boolean },
15 16 17 18 19 20 21 22 23 24
    modelPath: { type: String, required: true },
  },
  setup(props) {
    const provider = ref<IViewProvider>();
    ModelUtil.getViewModel(props.modelPath, props.context).then(
      async viewModel => {
        provider.value = await ibiz.register.view.get(viewModel.source);
      },
    );
    const ns = useNamespace('view-shell');
25 26

    // 路由绘制的视图,添加一个上下文isRouter
27 28 29 30 31
    const cloneContext = computed(() => {
      const temp = props.context.clone();
      temp.isRouter = props.isRouter === true;
      return temp;
    });
32
    return { ns, provider, cloneContext };
33 34 35
  },
  render(h) {
    if (this.provider) {
36
      const opts = {
37 38 39 40 41
        attrs: {
          ...this.$props,
          ...this.$attrs,
          context: this.cloneContext,
        },
42 43 44
        on: this.$listeners,
      };
      return h('AppTransition', {}, [h(this.provider.component, opts)]);
45 46 47 48 49 50 51 52
    }
    return (
      <div class={this.ns.b()}>
        <i-spin size='large' fix></i-spin>
      </div>
    );
  },
});