refactor: taro

zhengyiming

2025-02-20 703c46d17731d1b437509f326c050d1d36838f74

 apps/h5/src/components/Layout/LoadingLayout.vue

New file
@@ -0,0 +1,53 @@
<template>
  <div class="loading-layout-wrapper">
    <div class="spinner-wrapper" v-if="props.loading">
      <div class="el-loading-spinner">
        <el-icon class="is-loading">
          <Loading />
        </el-icon>
        <p class="el-loading-text">拼命加载中</p>
      </div>
    </div>
    <template v-else>
      <div v-if="props.error">出错了</div>
      <template v-else>
        <slot></slot>
      </template>
    </template>
  </div>
</template>

<script setup lang="ts">
defineOptions({
  name: 'LoadingLayout',
});

type Props = {
  loading?: boolean;
  error?: boolean;
};

const props = withDefaults(defineProps<Props>(), {
  loading: false,
  error: false,
});
</script>

<style lang="scss" scoped>
.loading-layout-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

.spinner-wrapper {
  min-height: calc(100vh - 80px);
  // position: relative;
}

.hasTagsView {
  .spinner-wrapper {
    min-height: calc(100vh - 124px);
  }
}
</style>