<template>
  <!-- 修改密码 -->
  <div class="editPass">
    <div class="main">
      <van-form @submit="onSubmit" class="form">
        <van-cell-group>
          <van-field
            v-model="allData.password"
            type="password"
            name="password"
            label="旧密码"
            placeholder="旧密码"
            :rules="[{ required: true, message: '请输入' }]"
          />
          <van-field
            v-model="allData.newPassword"
            type="password"
            name="newPassword"
            label="新密码"
            placeholder="新密码"
            :rules="[{ pattern, required: true, message: '请输入至少8位大小写英文字母+数字+特殊符号' }]"
          />
          <van-field
            v-model="allData.newPassword2"
            type="password"
            name="newPassword2"
            label="确认新密码"
            placeholder="确认新密码"
            :rules="[{ pattern, required: true, message: '请输入至少8位大小写英文字母+数字+特殊符号' }]"
          />
        </van-cell-group>
        <div class="btns">
          <van-button class="btn" type="primary" block native-type="submit">确定</van-button>
        </div>
      </van-form>
    </div>
  </div>
</template>

<script setup name="editPass">
import { updateUserPwd } from '@/api/publicApi.js';
import { EncryptAES } from '@/utils/AES.js';
import { useRouter } from 'vue-router';
import { useStore } from '@/pinia/store.js';

const pinias = useStore();
const { proxy } = getCurrentInstance();
const router = useRouter();
const allData = reactive({
  password: '',
  newPassword: '',
  newPassword2: '',
  defaultUrl: '',
});

// 密码校验 至少8位大小写英文字母+数字+特殊符号
const pattern = /^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[^\w\s]).{8,20}$/;

const onSubmit = async (values) => {
  if (allData.newPassword != allData.newPassword2) {
    proxy.showFailToast('新密码和确认密码不一致');
    return;
  }
  if (allData.password == allData.newPassword || allData.password == allData.newPassword2) {
    proxy.showFailToast('新密码和旧密码不能相同');
    return;
  }
  let params = {
    oldPassword: EncryptAES(allData.password),
    newPassword: EncryptAES(allData.newPassword),
  };
  let res = await updateUserPwd(params);
  if (res && res.code == 200) {
    proxy.showSuccessToast('密码修改成功');
    localStorage.setItem('passwordNFApp', EncryptAES(allData.password));
    router.push('/login');
  }
};
onMounted(() => {});
</script>
<style lang="less">
.editPass {
  width: 100%;
  .main {
    .form {
      margin: 40px auto;
      width: 90%;
      .btns {
        margin-top: 80px;
        .btn {
          width: 100%;
          margin: 30px auto;
        }
      }
    }
  }
}
</style>