<template>
  <div class="login-warp flex-center">
    <div class="login-container w-full h-full">
      <el-row class="w-full h-full">
        <el-col :xs="0" :sm="0" :md="10" :lg="10" :xl="14" class="left-container">
          <div class="login-image"><img class="w-full h-full block" src="@/assets/login.png" alt="" /></div>
        </el-col>
        <el-col :xs="24" :sm="24" :md="14" :lg="14" :xl="10" class="right-container flex-center">
          <slot></slot>
        </el-col>
      </el-row>
    </div>
  </div>
</template>
<script setup lang="ts">
defineOptions({ name: 'LoginLayout' })
</script>
<style lang="scss" scoped>
.login-warp {
  height: 100vh;

  .login-image {
    width: 100%;
    height: 100%;
  }
}
</style>
