<route lang="json">
{ "style": { "navigationBarTitleText": "修改密码", "navigationBarBackgroundColor": "#fff" } }
</route>
<script setup lang="ts">
import { DataFormSchema } from '@/components/data-form'
import { updatePassword, UpdatePasswordData } from '@/core/libs/requests'
import DataForm from '@/components/data-form.vue'
import BottomAppBar from '@/components/bottom-app-bar.vue'
import { ComponentExposed } from 'vue-component-type-helpers'
import { useUserStore } from '@/store'
import { storeToRefs } from 'pinia'
import { requestToast } from '@designer-hub/app/src/core/utils/common'

const userStore = useUserStore()
const { userInfo } = storeToRefs(userStore)
const dataFormRef = ref<ComponentExposed<typeof DataForm>>()
const schema = ref<DataFormSchema>({
  oldPassword: {
    type: 'TextField',
    label: '旧密码',
    labelWidth: 90,
    required: true,
    props: {
      placeholder: '请输入旧密码',
    },
  },
  newPassword: {
    type: 'TextField',
    label: '新密码',
    labelWidth: 90,
    required: true,
    props: {
      placeholder: '请输入新密码',
    },
  },
  confirmPassword: {
    type: 'TextField',
    label: '再次输入',
    labelWidth: 90,
    required: true,
    props: {
      placeholder: '请再次输入新密码',
    },
  },
})
const rules = ref({
  oldPassword: [{ required: true, message: '请输入旧密码' }],
  newPassword: [{ required: true, message: '请输入新密码' }],
  confirmPassword: [{ required: true, message: '请再次输入新密码' }],
})
const formData = ref({})
const submitDisabled = computed(() => ({}))
const handleSubmit = async () => {
  // const data = await dataFormRef.value?.validate()
  if (!(await dataFormRef.value!.validate())) {
    return false
  }
  console.log(1111)
  if (!userInfo.value.userId) {
    return false
  }
  const { code } = await requestToast(
    () =>
      updatePassword({
        ...formData.value,
        appLoginType: 3,
        id: userInfo.value.userId ?? 0,
      }),
    { success: true, successTitle: '修改成功' },
  )
  if (code === 0) {
    userStore.clearUserInfo()
    uni.reLaunch({ url: '/pages/login/index' })
  }
}
</script>

<template>
  <div class="flex-grow bg-white px-2 pt-8">
    <DataForm
      ref="dataFormRef"
      :schema="schema"
      :rules="rules"
      v-model="formData"
      direction="horizontal"
    ></DataForm>
    <BottomAppBar fixed placeholder>
      <wd-button :disabled="dataFormRef?.submitDisabled" :round="false" block @click="handleSubmit">
        确认
      </wd-button>
    </BottomAppBar>
  </div>
</template>

<style scoped lang="scss"></style>
