test-version22
/
MeterSphere
mirror of https://gitee.com/fit2cloud-feizhiyun/MeterSphere.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

样式

This commit is contained in:
Captain.B 2020-05-12 10:53:51 +08:00
parent 833050a9ef
commit a89052bc6e
2 changed files with 72 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

126
frontend/src/business/components/settings/personal/PersonSetting.vue
View File

@ -22,58 +22,56 @@
</el-table-column>
<el-table-column :label="$t('commons.operating')">
<template v-slot:default="scope">
<el-tooltip class="item" effect="dark" :content="$t('member.edit_information')" placement="bottom" >
<el-button @click="edit(scope.row)" type="primary" icon="el-icon-edit" size="mini" circle/>
</el-tooltip>
<el-tooltip class="item" effect="dark" :content="$t('member.edit_password')" placement="bottom" >
<el-button @click="editPassword(scope.row)" type="primary" icon="el-icon-s-tools" size="mini" circle/>
</el-tooltip>
<ms-table-operator-button :tip="$t('member.edit_information')" icon="el-icon-edit"
type="primary" @exec="edit(scope.row)"/>
<ms-table-operator-button :tip="$t('member.edit_password')" icon="el-icon-s-tools"
type="success" @exec="editPassword(scope.row)"/>
</template>
</el-table-column>
</el-table>
</el-card>
<!--Modify personal details-->
<el-dialog :title="$t('member.modify_personal_info')" :visible.sync="updateVisible" width="30%"
:destroy-on-close="true" @close="handleClose">
<el-form :model="form" label-position="right" label-width="100px" size="small" :rules="rule"
ref="updateUserForm">
<el-form-item label="ID" prop="id">
<el-input v-model="form.id" autocomplete="off" :disabled="true"/>
</el-form-item>
<el-form-item :label="$t('commons.username')" prop="name">
<el-input v-model="form.name" autocomplete="off"/>
</el-form-item>
<el-form-item :label="$t('commons.email')" prop="email">
<el-input v-model="form.email" autocomplete="off"/>
</el-form-item>
<el-form-item :label="$t('commons.phone')" prop="phone">
<el-input v-model="form.phone" autocomplete="off"/>
</el-form-item>
</el-form>
<template v-slot:footer>
<ms-dialog-footer
@cancel="updateVisible = false"
@confirm="updateUser('updateUserForm')"/>
</template>
</el-dialog>
<!--Modify personal details-->
<el-dialog :title="$t('member.modify_personal_info')" :visible.sync="updateVisible" width="30%"
:destroy-on-close="true" @close="handleClose">
<el-form :model="form" label-position="right" label-width="100px" size="small" :rules="rule"
ref="updateUserForm">
<el-form-item label="ID" prop="id">
<el-input v-model="form.id" autocomplete="off" :disabled="true"/>
</el-form-item>
<el-form-item :label="$t('commons.username')" prop="name">
<el-input v-model="form.name" autocomplete="off"/>
</el-form-item>
<el-form-item :label="$t('commons.email')" prop="email">
<el-input v-model="form.email" autocomplete="off"/>
</el-form-item>
<el-form-item :label="$t('commons.phone')" prop="phone">
<el-input v-model="form.phone" autocomplete="off"/>
</el-form-item>
</el-form>
<template v-slot:footer>
<ms-dialog-footer
@cancel="updateVisible = false"
@confirm="updateUser('updateUserForm')"/>
</template>
</el-dialog>
<!--Change personal password-->
<el-dialog :title="$t('member.edit_password')" :visible.sync="editPasswordVisible" width="30%" left>
<el-form :model="ruleForm" :rules="rules" ref="editPasswordForm" label-width="100px" class="demo-ruleForm">
<el-form-item :label="$t('member.old_password')" prop="password">
<el-input v-model="ruleForm.password" autocomplete="off" show-password/>
</el-form-item>
<el-form-item :label="$t('member.new_password')" prop="newpassword">
<el-input v-model="ruleForm.newpassword" autocomplete="off" show-password/>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<!--Change personal password-->
<el-dialog :title="$t('member.edit_password')" :visible.sync="editPasswordVisible" width="30%" left>
<el-form :model="ruleForm" :rules="rules" ref="editPasswordForm" label-width="100px" class="demo-ruleForm">
<el-form-item :label="$t('member.old_password')" prop="password">
<el-input v-model="ruleForm.password" autocomplete="off" show-password/>
</el-form-item>
<el-form-item :label="$t('member.new_password')" prop="newpassword">
<el-input v-model="ruleForm.newpassword" autocomplete="off" show-password/>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<ms-dialog-footer
@cancel="editPasswordVisible = false"
@confirm="updatePassword('editPasswordForm')"/>
</span>
</el-dialog>
</el-dialog>
</div>
@ -83,18 +81,21 @@
import {TokenKey} from "../../../../common/js/constants";
import MsDialogFooter from "../../common/components/MsDialogFooter";
import {getCurrentUser} from "../../../../common/js/utils";
import MsTableOperatorButton from "../../common/components/MsTableOperatorButton";
export default {
name: "MsPersonSetting",
components: {MsDialogFooter, MsTableOperatorButton},
data() {
return {
result: {},
updateVisible: false,
editPasswordVisible:false,
editPasswordVisible: false,
tableData: [],
updatePath: '/user/update/current',
updatePasswordPath:'/user/update/password',
updatePasswordPath: '/user/update/password',
form: {},
ruleForm:{},
ruleForm: {},
rule: {
name: [
{required: true, message: this.$t('member.input_name'), trigger: 'blur'},
@ -124,7 +125,7 @@
}
],
},
rules:{
rules: {
/*password: [
{required: true, message: this.$t('user.input_password'), trigger: 'blur'},
{
@ -137,7 +138,7 @@
newpassword: [
{required: true, message: this.$t('user.input_password'), trigger: 'blur'},
{
required:true,
required: true,
pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[^]{8,16}$/,
message: this.$t('member.password_format_is_incorrect'),
trigger: 'blur'
@ -146,8 +147,7 @@
}
}
},
name: "MsPersonSetting",
components: {MsDialogFooter},
created() {
this.initTableData();
},
@ -159,7 +159,7 @@
this.updateVisible = true;
this.form = Object.assign({}, row);
},
editPassword(row){
editPassword(row) {
this.editPasswordVisible = true;
},
updateUser(updateUserForm) {
@ -177,19 +177,19 @@
}
})
},
updatePassword(editPasswordForm){
this.$refs[editPasswordForm].validate(valide=>{
if(valide){
this.result = this.$post(this.updatePasswordPath, this.ruleForm, response => {
this.$success(this.$t('commons.modify_success'));
this.editPasswordVisible = false;
this.initTableData();
window.location.reload();
});
}else {
return false;
}
})
updatePassword(editPasswordForm) {
this.$refs[editPasswordForm].validate(valide => {
if (valide) {
this.result = this.$post(this.updatePasswordPath, this.ruleForm, response => {
this.$success(this.$t('commons.modify_success'));
this.editPasswordVisible = false;
this.initTableData();
window.location.reload();
});
} else {
return false;
}
})
},
initTableData() {
this.result = this.$get("/user/info/" + this.currentUser().id, response => {

15
frontend/src/business/components/settings/system/User.vue
View File

@ -31,10 +31,12 @@
</el-table-column>
<el-table-column :label="$t('commons.operating')">
<template v-slot:default="scope">
<ms-table-operator @editClick="edit(scope.row)" @deleteClick="del(scope.row)"/>
<el-tooltip class="editpassword" effect="dark" :content="$t('member.edit_password')" placement="bottom" >
<el-button @click="editPassword(scope.row)" type="primary" icon="el-icon-s-tools" size="mini" circle/>
</el-tooltip>
<ms-table-operator @editClick="edit(scope.row)" @deleteClick="del(scope.row)">
<template v-slot:behind>
<ms-table-operator-button :tip="$t('member.edit_password')" icon="el-icon-s-tools"
type="success" @exec="editPassword(scope.row)"/>
</template>
</ms-table-operator>
</template>
</el-table-column>
</el-table>
@ -119,17 +121,18 @@
import MsTableHeader from "../../common/components/MsTableHeader";
import MsTableOperator from "../../common/components/MsTableOperator";
import MsDialogFooter from "../../common/components/MsDialogFooter";
import MsTableOperatorButton from "../../common/components/MsTableOperatorButton";
export default {
name: "MsUser",
components: {MsCreateBox, MsTablePagination, MsTableHeader, MsTableOperator, MsDialogFooter},
components: {MsCreateBox, MsTablePagination, MsTableHeader, MsTableOperator, MsDialogFooter, MsTableOperatorButton},
data() {
return {
queryPath: '/user/special/list',
deletePath: '/user/special/delete/',
createPath: '/user/special/add',
updatePath: '/user/special/update',
editPasswordPath:'/user/special/password',
editPasswordPath: '/user/special/password',
result: {},
createVisible: false,
updateVisible: false,