kicc-ui/src/views/system/user/account/setting/entCertification/index.vue

<template>
  <div
    ref="wrapperRef"
    class="step-form-form"
    :style="getContentStyle"
  >
    <div>
      <ASteps :current="current">
        <AStep title="填写企业信息"/>
        <AStep title="等待审核"/>
        <AStep title="认证成功"/>
      </ASteps>
    </div>
    <div class="mt-5">
      <Step1 v-show="current === 0" @next="current++"/>
      <Step2 v-show="current === 1" @previous="current--"/>
      <Step3 v-show="current === 2"/>
    </div>
  </div>
</template>
<script lang="ts" setup>
  import { ref, computed, CSSProperties, unref, onMounted } from 'vue';
  import Step1 from './Step1.vue';
  import Step2 from './Step2.vue';
  import Step3 from './Step3.vue';
  import { Steps } from 'ant-design-vue';
  import { useContentHeight } from '/@/hooks/web/useContentHeight';
  import { getPushThirdPartyByUserId } from '/@/api/platform/common/controller/pushThirdParty';
  import type { PushEnterprise } from '/@/api/platform/common/entity/pushThirdParty';
  import { useUserStore } from '/@/store/modules/user';

  const ASteps = Steps;
  const AStep = Steps.Step;
  const wrapperRef = ref(null);
  const current = ref(0);
  const pushThirdParty = ref<PushEnterprise>();
  const userStore = useUserStore();
  const userInfoStore = userStore.getUserInfo;
  const { contentHeight } = useContentHeight(
      computed(() => true),
      wrapperRef,
      [],
      [],
      null,
      ref(30));
  const getContentStyle = computed((): CSSProperties => ({ minHeight: `${unref(contentHeight)}px` }));

  onMounted(async () => {
    await refreshPushThirdParty();
  });

  async function refreshPushThirdParty() {
    const result =  await getPushThirdPartyByUserId(userInfoStore.id);
    pushThirdParty.value = result;
    switch (result?.status) {
      case '0':
        current.value = 1;
        break;
      case '1':
        current.value = 2;
        break;
      default:
        current.value = 0;
    }
  }

</script>
<style lang="less" scoped>
.step-form-form {
  background: @component-background;

  .ant-steps {
    padding: 30px 45px 30px 45px;
  }
}
</style>