You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
87 lines
2.7 KiB
87 lines
2.7 KiB
2 years ago
|
<template>
|
||
|
|
<div>
|
||
|
|
<q-dialog ref="dialogRef" allow-focus-outside v-bind="attrs">
|
||
|
|
<q-card
|
||
|
|
:style="{
|
||
|
|
width: attrs.maximized ? '100vw' : width,
|
||
|
|
'max-width': '100vw',
|
||
|
|
height: attrs.maximized ? '100vh' : height,
|
||
|
|
'max-height': '100vh',
|
||
|
|
}"
|
||
|
|
>
|
||
|
|
<q-card-section :style="headerStyle">
|
||
|
|
<div class="flex justify-between">
|
||
|
|
<div class="text-h6">{{ title }}</div>
|
||
|
|
<div class="flex justify-end q-gutter-md">
|
||
|
|
<q-btn v-close-popup dense flat icon="close" :title="$t('close')"> </q-btn>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</q-card-section>
|
||
|
|
<q-card-section class="q-pt-md" :style="bodyStyle">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<q-input v-model="model.rawPassword" type="password" label="原密码" outlined autocomplete="false" class="p-1" />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<q-input v-model="model.newPassword" type="password" label="新密码" outlined autocomplete="false" class="p-1" />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<q-input v-model="model.confirmNewPassword" type="password" label="确认新密码" outlined autocomplete="false" class="p-1" />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</q-card-section>
|
||
|
|
<q-card-section class="row justify-center items-start content-start q-gutter-md">
|
||
|
|
<q-btn :label="$t('confirm')" color="primary" style="width: 100px" @click="changePassword" />
|
||
|
|
<q-btn :label="$t('cancel')" style="width: 100px" @click="dialogRef.hide" />
|
||
|
|
</q-card-section>
|
||
|
|
</q-card>
|
||
|
|
</q-dialog>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script setup lang="ts">
|
||
|
|
import { useAttrs, ref, reactive, toRaw } from 'vue';
|
||
|
|
import { useI18n } from 'vue-i18n';
|
||
|
|
import { axios, Environment } from 'platform-core';
|
||
|
|
|
||
|
|
const attrs = useAttrs();
|
||
|
|
|
||
|
|
const props = defineProps({
|
||
|
|
headerStyle: { type: String, default: 'width:100%;padding: 16px 8px 4px 16px' },
|
||
|
|
bodyStyle: { type: String, default: 'padding: 0px 8px 0px 8px;height:200px' },
|
||
|
|
title: { type: String, default: '' },
|
||
|
|
width: { type: String, default: '70%' },
|
||
|
|
height: { type: String, default: '70%' },
|
||
|
|
});
|
||
|
|
|
||
|
|
const { t } = useI18n();
|
||
|
|
const dialogRef = ref();
|
||
|
|
const model = reactive({
|
||
|
|
rawPassword: '',
|
||
|
|
newPassword: '',
|
||
|
|
confirmNewPassword: '',
|
||
|
|
});
|
||
|
|
|
||
|
|
const changePassword = () => {
|
||
|
|
axios.post(Environment.apiContextPath('/api/system/user/changePassword'), toRaw(model)).then(() => {
|
||
|
|
dialogRef.value.hide();
|
||
|
|
});
|
||
|
|
};
|
||
|
|
|
||
|
|
const show = (param: object) => {
|
||
|
|
dialogRef.value.show();
|
||
|
|
};
|
||
|
|
|
||
|
|
const hide = () => {
|
||
|
|
dialogRef.value.hide();
|
||
|
|
};
|
||
|
|
|
||
|
|
defineExpose({
|
||
|
|
show,
|
||
|
|
hide,
|
||
|
|
});
|
||
|
|
</script>
|