<!--
|
* @Author: 小明丶
|
* @Date: 2019-08-20 18:12:00
|
* @LastEditors: 小明丶
|
* @LastEditTime: 2020-11-17 09:39:52
|
* @Description:
|
-->
|
<template>
|
<div class="account-add h-100-g">
|
<v-navbar title="新增账户" fixed>
|
<div slot="right" v-if="!isAdd" @click="update">保存</div>
|
</v-navbar>
|
|
<div class="cell-group">
|
<v-cell v-model="form.name" max='6' label="负责人姓名" placeholder="请输入姓名"></v-cell>
|
<v-cell v-model="form.mblNo" max='11' type='tel' label="负责人手机号" placeholder="请输入手机号" :readonly="!isAdd"></v-cell>
|
</div>
|
<p class="tip">*该手机号将作为登录用户名，密码将通过短信发至手机</p>
|
|
<div class="cell-group">
|
<v-cell v-model="form.email" max="50" label="联系邮箱" placeholder="请输入邮箱地址"></v-cell>
|
</div>
|
|
|
<footer class="flex-center-g footer">
|
<van-button class="btn" :color="$store.state.backColor" v-if="isAdd" @click="add">新增账户</van-button>
|
<van-button class="btn" :color="$store.state.backColor" v-else @click="freeze">{{isFreeze?'冻结':'启用'}}</van-button>
|
</footer>
|
</div>
|
</template>
|
|
<script>
|
import { mapState } from "vuex";
|
export default {
|
name: "account-add",
|
data() {
|
return {
|
form: {
|
name: "",
|
mblNo: "",
|
email: "",
|
name: "",
|
menuPower: [100001, 100006],
|
powerInfoVos: [] //权限列表
|
},
|
rule:[
|
{key:"name",message:"请输入账户名称",type:"isEmpty"},
|
{key:"name",message:"请输入正确的账户名称",rule:/^[\u4e00-\u9fa50-9a-zA-Z]{1,6}$/},
|
{key:"mblNo",message:"请输入手机号",type:"isEmpty"},
|
{key:"mblNo",message:"请输入正确的手机号",type:"isTel"},
|
{key:"email",message:"请输入联系邮箱",type:"isEmpty"},
|
{key:"email",message:"请输入正确的联系邮箱",type:"isEmail"},
|
],
|
isFreeze: false
|
};
|
},
|
computed: {
|
...mapState(["userinfo"]),
|
// 判断是新增 还是 详情
|
isAdd() {
|
return this.$route.query.isAdd == "1";
|
},
|
//权限列表
|
powerInfo() {
|
return this.form.powerInfoVos || [];
|
},
|
id() {
|
return this.$route.query.id || "";
|
}
|
},
|
created() {
|
this.form.powerInfoVos = this.userinfo.powerInfoVos;
|
if (!this.isAdd) {
|
this.init();
|
}
|
},
|
methods: {
|
//获取用户详情
|
init() {
|
this.$api.getUserDetail(this.id).then(({ body }) => {
|
let {powerInfoVos} = body;
|
if (body.supStatus && body.status) {
|
this.isFreeze = true;
|
} else {
|
this.isFreeze = false;
|
}
|
let powerInfo = this.userinfo.powerInfoVos;
|
if (powerInfoVos.length) {
|
powerInfo.forEach(item => {
|
let index = powerInfoVos.findIndex(child => {
|
return item.powerId === child.powerId;
|
});
|
});
|
}
|
|
this.form = {
|
...this.form,
|
...body
|
};
|
this.form.powerInfoVos = this.userinfo.powerInfoVos;;
|
})
|
.catch(err => {});
|
},
|
// 验证form参数
|
validatorForm(){
|
return this.$validator(this.form,this.rule).check(item=>{
|
this.$notify(item.message)
|
})
|
},
|
// 新增
|
add() {
|
if(!this.validatorForm()) return
|
this.$api.userAdd(this.form).then(res => {
|
this.$notify("添加成功");
|
setTimeout(() => this.$router.go(-1), 1000);
|
}).catch(err => {});
|
},
|
//更新
|
update() {
|
if(!this.validatorForm()) return
|
this.$api.userUpdate(this.form).then(res => {
|
this.$notify("保存成功");
|
})
|
.catch(err => {});
|
},
|
//冻结账号
|
freeze() {
|
this.$dialog.confirm({
|
message: `请问是否确认${this.isFreeze ? "冻结" : "启用"}该账户？`
|
}).then(() => {
|
this.$api.userFreezeMgr(this.id).then(() => {
|
let text = this.isFreeze ? "冻结成功" : "启用成功";
|
this.$notify(text);
|
this.isFreeze = !this.isFreeze;
|
});
|
})
|
.catch(() => {
|
// on cancel
|
});
|
}
|
}
|
};
|
</script>
|
|
<style scoped lang="less">
|
.account-add {
|
background-color: @c-bg-f5;
|
padding-top: 44px;
|
|
.tip {
|
margin: 10px 0 15px 21px;
|
font-size: @font-12;
|
color: @c-text-999;
|
}
|
}
|
|
.cell-group {
|
margin: 10px 8px 0;
|
}
|
|
.btn {
|
width: 340px;
|
height: 44px;
|
border: none;
|
font-size: @font-16;
|
border-radius: 22px;
|
background-color: @c-bg-default;
|
color: @c-text-fff;
|
}
|
|
.footer {
|
margin-top: 60px;
|
padding-bottom: 30px;
|
}
|
</style>
|
