<template>
  <ContainerTit :is-footer="false">
    <div v-if="id === '1'" class="page-div">
      <el-form ref="form" :model="form" label-width="200px">
        <el-form-item label="用户名：">
          {{ userName }}
        </el-form-item>
        <!--      <el-form-item label="当前企业：">-->
        <!--        {{ enterprise.enterpriseName }}-->
        <!--      </el-form-item>-->
        <el-form-item label="原密码：">
          <el-input
            v-model="form.oldPassword"
            style="width: 400px"
            type="password"
            placeholder="原密码"
          ></el-input>
        </el-form-item>
        <el-form-item label="新密码：">
          <el-input
            v-model="form.newPassword"
            style="width: 400px"
            type="password"
            placeholder="新密码"
          ></el-input>
        </el-form-item>
        <el-form-item label="确认密码：">
          <el-input
            v-model="form.rePassword"
            style="width: 400px"
            type="password"
            placeholder="确认密码"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="submit">保存</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div v-if="id === '2'" class="page-div">
      <el-form ref="form" :model="form_value" label-width="200px">
        <el-form-item label="用户名：">
          {{ userName }}
        </el-form-item>
        <el-form-item label="账号：">
          <el-input
            v-model="form_value.mobile"
            style="width: 400px"
            type="text"
            placeholder="账号"
          ></el-input>
        </el-form-item>
        <el-form-item label="密码：">
          <el-input
            v-model="form_value.password"
            style="width: 400px"
            type="password"
            placeholder="密码"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="submitValue">保存</el-button>
        </el-form-item>
      </el-form>
    </div>
  </ContainerTit>
</template>

<script>
  import { mapActions, mapGetters } from "vuex";
  import { updateUserCenterData, updateUserMobile } from "@/api/user";
  import { recordRoute } from "@/config/settings";

  export default {
    name: "EditPwd",
    data() {
      return {
        form: {
          oldPassword: "",
          newPassword: "",
          rePassword: "",
        },
        form_value: {
          mobile: "",
          password: "",
        },
        enterprise: {},
        id: "",
      };
    },
    computed: {
      ...mapGetters({
        userCenterId: "MUser/userCenterId",
        systemType: "MUser/systemType",
      }),
    },
    created() {
      this.id = this.$route.params.id;
    },
    methods: {
      ...mapActions({
        closeAllRoute: "closeAllRoute",
        delAllVisitedRoutes: "tagsBar/delAllVisitedRoutes",
      }),
      async submit() {
        if (this.form.newPassword !== this.form.rePassword) {
          this.$message({
            type: "warning",
            message: "确保输入密码相同",
          });
        } else {
          const data = await updateUserCenterData(this.form);
          this.$message({
            type: "success",
            message: "修改成功，请重新登录",
          });
          sessionStorage.clear();
          this.closeAllRoute();
          await this.$router.push("/login");
        }
      },
      async submitValue() {
        if (!this.form_value.mobile.trim() || !this.form_value.password) {
          this.$message.warning("账号密码不能为空");
          return;
        }
        const { data } = updateUserMobile({
          ...this.form_value,
          userCenterId: this.userCenterId,
        });
        this.$message({
          type: "success",
          message: "修改成功，请重新登录",
        });
        sessionStorage.clear();
        this.closeAllRoute();
        await this.delAllVisitedRoutes();
        await this.$store.dispatch("user/logout");
        if (recordRoute) {
          await this.$store.dispatch("MUser/changeSystemType", 1);
          const fullPath = this.$route.fullPath;
          await this.$router.push(`/login?redirect=${fullPath}`);
        } else if (this.systemType === 3) {
          await this.$router.push("/MerchantsLogin");
        } else {
          await this.$router.push("/login");
        }
      },
    },
  };
</script>

<style scoped></style>
