<template>
  <div v-loading="loading" style="display: flex; justify-content: center; align-items: center;">
    <el-form ref="formSmsLogin" :model="loginData" :rules="rules" label-width="130px" label-position="top" size="large">
      <div class="title" style="font-size:25px" margin-left="0px">重置密码</div>
      <el-row type="flex" justify="center" align="middle">
        <el-col :span="13">
          <el-form-item label="新密码" prop="password" align="center">
            <el-input v-model="loginData.password" placeholder="请输入新密码" />
          </el-form-item>
        </el-col>
        <el-col :span="13">
          <el-form-item label="确认新密码" prop="againPassword">
            <el-input v-model="loginData.againPassword" placeholder="请再次新密码" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div class="dialog-footer">
      <el-button type="primary" @click="submitForm">确 定</el-button>
    </div>
  </div>
</template>
<script lang="ts" setup name="bb">
  import type { RouteLocationNormalizedLoaded } from 'vue-router'
  import { useIcon } from '@/hooks/web/useIcon'
  import { setTenantId, setToken } from '@/utils/auth'
  import { usePermissionStore } from '@/store/modules/permission'
  import { getTenantIdByName, sendSmsCode, smsLogin } from '@/api/login'
  import * as UserApi from '@/api/system/user'

  const { t } = useI18n()
  const message = useMessage()
  const permissionStore = usePermissionStore()
  const formSmsLogin = ref()
  const loginLoading = ref(false)
  const iconHouse = useIcon({ icon: 'ep:house' })
  const iconCellphone = useIcon({ icon: 'ep:cellphone' })
  const iconCircleCheck = useIcon({ icon: 'ep:circle-check' })
  const route = useRoute() //路由信息
  const rules = {
    password: [required],
    againPassword: [required]
  }
  const loginData = reactive({
    password: '',
    againPassword: '',
    mailKey: '',
  })
  const loading = ref(false);
  const submitForm = async () => {
    try {
      loginData.mailKey = route.query.mailKey;
      if (loginData.password != loginData.againPassword) {
        message.error('两次输入的密码不一致，请重新输入!')
      } else {
        const data = loginData as unknown as UserApi.UserVO
        await UserApi.updatePassword(data)
        // 发送操作成功的事件
        message.success(t('common.updateSuccess'))
         router.go(-1)
      }
    } finally {
      // formLoading.value = false
    }
  }
</script>

<style lang="scss" scoped>
  :deep(.anticon) {
    &:hover {
      color: var(--el-color-primary) !important;
    }
  }

  .smsbtn {
    margin-top: 33px;
  }
</style>
