import { defineComponent, toRefs, reactive, onMounted, ref } from 'vue'
import player from '../images/player.png'
import classes from './videoCourseItem.module.less'
import detaile from '@/components/videoDetailItem/images/detaile.png'
import { ElDialog, ElButton, ElIcon } from 'element-plus'
import QrcodeVue from 'qrcode.vue'
import register_bg from '@/views/login/images/register_bg.png'
import RegisterSuccess from '@/views/login/components/register-success'
import { CloseBold } from '@element-plus/icons-vue'
export default defineComponent({
  name: 'downModel',
  emits: ['close'],
  props: {
    item: {
      type: Object,
      default: {}
    }
  },
  components: {
    QrcodeVue
  },
  setup(props, conent) {
    const state = reactive({
      title: props.item,
      item: props.item
    })
    const onClose = () => {
      conent.emit('close')
    }
    return () => (
      <>
        <div class={[classes.loginSection, 'relative bg-white']}>
          <div
            class={['rounded-full flex absolute top-[22px] right-[22px] z-10']}
            onClick={() => {
              onClose()
            }}
          >
            <ElIcon size={16} color="#999999">
              <CloseBold />
            </ElIcon>
          </div>
          <div
            class={[
              classes.loginTabs,
              'px-14 pt-9 pb-12 bg-white relative',
              classes.registerSuccessBg
            ]}
          >
            <RegisterSuccess type="student" onClose={onClose} />
          </div>
          {/* <i
            class={[
              classes.iconClose,
              'w-9 h-9 rounded-full flex absolute -top-1 -right-[18px]'
            ]}
            onClick={() => {
              onClose()
            }}
          ></i>
          <img src={register_bg} class={[classes.loginBg, '-mt-[10px]']} />
          <div class={'text-center pt-4 bg-white pb-4 pl-4 pr-4'}>
            <QrcodeVue
              value={state.qrCodeDownLoad}
              class="mx-auto shadow-lg w-[138px] h-[138px] align-middle"
            />

            <div class={[classes.scanTxt, 'leading-6']}>
              <p class=" text=[#1a1a1a] pt-4 pb-2">
                <span>下载酷乐秀学生端APP</span>发现更大的世界
              </p>
            </div>

            <ElButton
              type="primary"
              class="w-full mt-4"
              style={{ height: '40px' }}
              onClick={() => {
                onClose()
              }}
            >
              知道了
            </ElButton>
          </div> */}
        </div>
      </>
    )
  }
})
