addRole.vue 6.17 KB
<template>
    <div>
        <el-dialog :title="$t('dialog.addRole')" :visible.sync="isShow" class="manage-dialog" :before-close="closeDialog">
            <el-form :model="addForm" status-icon :rules="rules" ref="addForm">
                <el-form-item :label="$t('table.roleName')" prop="name">
                    <el-input v-model="addForm.name"></el-input>
                    <i class="error-tip">*</i>
                </el-form-item>
                <el-form-item :label="$t('table.englishName')" prop="enName">
                    <el-input v-model="addForm.enName"></el-input>
                    <!-- <i class="error-tip">*</i> -->
                </el-form-item>
                <el-form-item :label="$t('table.state')" prop="stutas">
                    <el-select class="manage-sel" v-model="addForm.stutas" :placeholder="$t('pholder.state')" :no-data-text="$t('pholder.nodata')">
                        <el-option :label="$t('table.stateA')" :value="1"></el-option>
                        <el-option :label="$t('table.stateB')" :value="2"></el-option>
                    </el-select>
                    <!-- <i class="error-tip">*</i> -->
                </el-form-item>
                <!-- <el-form-item :label="$t('table.square')" prop="mallId">
                    <el-select class="manage-sel" v-model="addForm.mallId" filterable :placeholder="$t('pholder.select')" :no-data-text="$t('pholder.nodata')">
                        <el-option v-for="item in mallList" :key="item.id" :label="item.name" :value="item.id">
                        </el-option>
                    </el-select>
                    <i class="error-tip">*</i>
                </el-form-item> -->
                 <el-form-item :label="$t('table.describe')" prop="position">
                    <el-input v-model="addForm.position"></el-input>
                    <!-- <i class="error-tip">*</i> -->
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="closeDialog" class="dialog-btn">{{$t('dialog.cancel')}}</el-button>
                <el-button type="primary" @click="addSubmit('addForm')" class="dialog-btn dialog-confirm-btn">{{$t('dialog.confirm')}}</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
export default {
    data() {
        var checkAge = (rule, value, callback) => {
            if (!value) {
                return callback(new Error('名字不能为空'));
            }
            setTimeout(() => {
                if (!Number.isInteger(Number(value))) {
                    callback(new Error('请输入正确格式'));
                } else {
                    // if (value < 18) {
                    // callback(new Error('必须年满18岁'));
                    // } else {
                    callback();
                    // }
                }
            }, 1000);
        };
        return {
            isShow: false,
            addForm: {
                name: '',
                mallId: null,
                gender: null,
                age: null,
                position: ''
            },
            mallList: [],
            rules: {
                name: [
                    { required: true, message: '请输入姓名', trigger: 'blur' }
                ],
                // gender: [
                //     { required: true, message: '请选择性别', trigger: 'change' }
                // ],
                // age: [
                //     { validator: checkAge, trigger: 'blur' }
                // ],
                // mallId: [
                //     { required: true, message: '请选择所属广场', trigger: 'change' }
                // ]
            },
            curMallId: null,
        }
    },
    created() {
        // this.getMallList();
    },
    methods: {
        dialogInit(mall_id) {
            this.curMallId = mall_id;
            this.getMallList();
            this.isShow = true;
        },
        getMallList() {
            this.mallList = [];
            this.$api.base.mall({
                accountId: this.$cookie.get('accountId'),
                // status: 1,
                status_arr: '1,3'
                // _t: Date.parse(new Date()) / 1000
            },null,true)
            .then(res => {
                let result = res.data;
                result.data.forEach(item => {
                    if(item.id == this.curMallId) {
                        this.addForm.mallId = item.id;
                    }
                })
                if(result.data.length > 0) {
                    if(!this.curMallId) {
                        this.addForm.mallId = result.data[0].id;
                    }
                    this.mallList = result.data;
                }
            })
            .catch(err => { })
        },
        bindRole(role_unid){
            this.$api.management.bindRole(this.$cookie.get('user_unid'), {
                role_unid: role_unid
            })
			.then(res => {
				this.$message({
					showClose: true,
					message: this.$t('message.bindSuccess'),
					type: 'success'
                })
                this.$refs.addForm.resetFields();
                this.$parent.getTableData();
			})
			.catch(error => { 
                // console.log('bind role err', error)
				this.$message({
					showClose: true,
					message: this.$t('message.bindFailed'),
					type: 'error'
				})
			})
		},
        addSubmit(formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    this.$api.management.addRole({
                        name: this.addForm.name
                    })
                    	.then((res) => {
                            let result = res.data;
                            if(result){
                                this.bindRole(result.role_unid)
                            }
                    	})
                    	.catch((error) => {
                         })
                } else {
                    return false;
                }
            });
            this.isShow = false
        },
        closeDialog() {
            this.$refs.addForm.resetFields();
            this.isShow = false;
            // this.$parent.getTableData();
        }
    }
}
</script>