|
|
|
@ -28,7 +28,7 @@ |
|
|
|
|
|
|
|
|
|
<div class="form-elem"> |
|
|
|
|
<button |
|
|
|
|
v-on:click.prevent="showingDeleteAlert=true" |
|
|
|
|
v-on:click.prevent="showingDeleteAlert = true" |
|
|
|
|
class="delete-btn" |
|
|
|
|
> |
|
|
|
|
删除用户 |
|
|
|
@ -53,55 +53,54 @@ import BlogHeader from "@/components/BlogHeader.vue"; |
|
|
|
|
import BlogFooter from "@/components/BlogFooter.vue"; |
|
|
|
|
import authorization from "@/utils/authorization"; |
|
|
|
|
import $ from "jquery"; |
|
|
|
|
import { onMounted, ref } from "vue"; |
|
|
|
|
import { useRouter } from "vue-router"; |
|
|
|
|
const storage = localStorage; |
|
|
|
|
export default { |
|
|
|
|
name: "UserCenter", |
|
|
|
|
components: { BlogHeader, BlogFooter }, |
|
|
|
|
data: function () { |
|
|
|
|
return { |
|
|
|
|
username: "", |
|
|
|
|
password: "", |
|
|
|
|
token: "", |
|
|
|
|
showingDeleteAlert: false, |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
mounted() { |
|
|
|
|
this.username = storage.getItem("username_blog"); |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
confirmDelete() { |
|
|
|
|
const that = this; |
|
|
|
|
setup() { |
|
|
|
|
let username = ref(""); |
|
|
|
|
let password = ref(""); |
|
|
|
|
let token = ref(""); |
|
|
|
|
let showingDeleteAlert = ref(false); |
|
|
|
|
const router = useRouter(); |
|
|
|
|
const header = ref(null); // 使用ref获取dom元素 |
|
|
|
|
|
|
|
|
|
const confirmDelete = () => { |
|
|
|
|
authorization().then((response) => { |
|
|
|
|
if (response[0]) { |
|
|
|
|
// 获取令牌 |
|
|
|
|
that.token = storage.getItem("access_blog"); |
|
|
|
|
token.value = storage.getItem("access_blog"); |
|
|
|
|
$.ajax({ |
|
|
|
|
url: 'http://127.0.0.1:6789/api/user/' + that.username + '/', |
|
|
|
|
type: 'DELETE', |
|
|
|
|
url: |
|
|
|
|
"http://127.0.0.1:6789/api/user/" + |
|
|
|
|
username.value + |
|
|
|
|
"/", |
|
|
|
|
type: "DELETE", |
|
|
|
|
headers: { |
|
|
|
|
Authorization: "Bearer " + that.token |
|
|
|
|
Authorization: "Bearer " + token.value, |
|
|
|
|
}, |
|
|
|
|
success(resp) { |
|
|
|
|
console.log(resp); |
|
|
|
|
success() { |
|
|
|
|
storage.clear(); |
|
|
|
|
that.$router.push({ name: "home" }); |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
router.push({ name: "home" }); |
|
|
|
|
}, |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
changeInfo() { |
|
|
|
|
const that = this; |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
const changeInfo = () => { |
|
|
|
|
authorization().then((response) => { |
|
|
|
|
if (response[0] === false) { |
|
|
|
|
window.alert("登录已过期, 请重新登录!"); |
|
|
|
|
storage.clear(); |
|
|
|
|
that.$router.push({ name: "login" }); |
|
|
|
|
router.push({ name: "login" }); |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
// 密码不能少于6位 |
|
|
|
|
|
|
|
|
|
if (that.password.length >= 0 && that.password.length < 6) { |
|
|
|
|
if (password.value.length >= 0 && password.value.length < 6) { |
|
|
|
|
window.alert("密码太短了"); |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
@ -110,33 +109,47 @@ export default { |
|
|
|
|
const oldName = storage.getItem("username_blog"); |
|
|
|
|
// 表单数据 |
|
|
|
|
let data = {}; |
|
|
|
|
if (that.username !== "") { |
|
|
|
|
data.username = that.username; |
|
|
|
|
if (username.value !== "") { |
|
|
|
|
data.username = username.value; |
|
|
|
|
} |
|
|
|
|
data.password = that.password; |
|
|
|
|
that.token = storage.getItem("access_blog"); |
|
|
|
|
data.password = password.value; |
|
|
|
|
token.value = storage.getItem("access_blog"); |
|
|
|
|
// 修改用户名或密码 |
|
|
|
|
$.ajax({ |
|
|
|
|
url: "http://127.0.0.1:6789/api/user/" + oldName + "/", |
|
|
|
|
type: "PATCH", |
|
|
|
|
data: data, |
|
|
|
|
headers: { |
|
|
|
|
Authorization: "Bearer " + that.token, |
|
|
|
|
Authorization: "Bearer " + token.value, |
|
|
|
|
}, |
|
|
|
|
success(resp) { |
|
|
|
|
window.alert("修改成功"); |
|
|
|
|
const name = resp.username; |
|
|
|
|
storage.setItem("username_blog", name); |
|
|
|
|
// 跳转到用户界面 |
|
|
|
|
that.$router.push({ |
|
|
|
|
router.push({ |
|
|
|
|
name: "UserCenter", |
|
|
|
|
params: { username: name }, |
|
|
|
|
}); |
|
|
|
|
that.$refs.header.refresh(); |
|
|
|
|
header.value.refresh(); |
|
|
|
|
}, |
|
|
|
|
}); |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
onMounted(() => { |
|
|
|
|
username.value = storage.getItem("username_blog"); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
return { |
|
|
|
|
username, |
|
|
|
|
password, |
|
|
|
|
token, |
|
|
|
|
showingDeleteAlert, |
|
|
|
|
confirmDelete, |
|
|
|
|
changeInfo, |
|
|
|
|
header, |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
}; |
|
|
|
|
</script> |
|
|
|
|