<style lang="scss">
@import '@/styles/index.scss'; //导入样式

.pserssiondlg {
    width: 100%;
    margin: auto;

    &__item {
        width: 100%;
        display: flex;

        &-left {
            flex: 1;
        }

        &-right {
            flex: none;
            width: 100px;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            padding-left: 15px;
            text-align: right;
        }
    }
}
</style>

<template>
    <div class="pserssiondlg">
        <el-form :model="dialogData.editData.data" :rules="dialogData.editData.rules" ref="editDataForm" label-width="85px"
            :size="controlSize">
            <el-form-item label="权限名称" prop="name">
                <el-input v-model="dialogData.editData.data.name" auto-complete="off"></el-input>
            </el-form-item>
            <el-form-item label="权限标识" prop="flag">
                <el-input v-model="dialogData.editData.data.flag" auto-complete="off"></el-input>
            </el-form-item>
            <el-form-item label="权限描述" prop="desc">
                <el-input v-model="dialogData.editData.data.desc" auto-complete="off"></el-input>
            </el-form-item>
        </el-form>
        <div style="padding-top: 10px;text-align:right">
            <el-button type="success" @click="hSubmit">确定</el-button>
            <el-button type="warning" @click="hClose">取消</el-button>
        </div>
    </div>
</template>


<script>
import { addPermission, updatePermission, getPermissionById } from "@/api/user"

export default {
    name: 'pserssiondlg',
    props: {
        isUpdate: {
            type: Boolean,
            require: true,
            default: false
        },
        typeId: {
            type: Number,
            require: true,
            default: 1
        },
        id: {
            type: Number,
            require: true,
            default: 1
        },
        pid: {
            type: Number,
            require: true,
            default: 0
        }
    },
    data: function () {
        return {
            dialogData: {
                editData: {
                    data: {
                        pid: 0,
                        id: 0,
                        type_id: 0,
                        name: '',
                        flag: '',
                        desc: '',
                    },
                    rules: {
                        name: [
                            { required: true, message: '请输入权限名称', trigger: 'blur' },
                        ],
                        flag: [
                            { required: true, message: '请输入权限标识', trigger: 'blur' },
                        ]
                    }
                }
            },
        }
    },
    watch: {
    },
    computed: {
        controlSize() {
            return this.$store.getters.controlSize
        }
    },
    mounted() {
        this.$nextTick(function () {
            this.init()
        })
    },
    methods: {
        init() {
            if (this.isUpdate) {
                this.getPermissionById()
            }
        },
        hClose() {//关闭对话框
            this.$emit("close")
        },
        getData() {
            this.$emit("get")
        },
        hSubmit() { //对话框确定按钮响应函数
            this.$refs.editDataForm.validate((valid) => {
                if (valid) {
                    if (!this.isUpdate) {
                        this.addPermission()
                    } else {
                        this.updatePermission()
                    }
                }
            })
        },
        addPermission() {//新增
            let paramData = {}
            paramData.pid = parseInt(this.pid)
            paramData.type_id = this.typeId
            paramData.name = this.dialogData.editData.data.name
            paramData.flag = this.dialogData.editData.data.flag
            paramData.desc = this.dialogData.editData.data.desc
            addPermission(paramData).then((res) => {
                this.dialogData.editData.data.id = res.data
                this.$message.success('新增成功', '提示')
                this.getData()
            }).catch((err) => {
                this.$message({ message: err, type: 'error' })
            })
        },
        getPermissionById() {
            let paramData = {}
            paramData.id = parseInt(this.id)
            getPermissionById(paramData).then((res) => {
                this.dialogData.editData.data = res.data
            }).catch((err) => {
                this.$message({ message: err, type: 'error' })
            })
        },
        updatePermission() {//修改
            let paramData = {}
            paramData.id = parseInt(this.dialogData.editData.data.id)
            paramData.pid = parseInt(this.dialogData.editData.data.pid)
            paramData.name = this.dialogData.editData.data.name
            paramData.flag = this.dialogData.editData.data.flag
            paramData.desc = this.dialogData.editData.data.desc

            updatePermission(paramData).then(() => {
                this.$message.success('修改成功', '提示')
                this.getData()
                this.hClose()
            }).catch((err) => {
                this.$message({ message: err, type: 'error' })
            })
        }
    }
}

</script>
