<template>
    <a-form-model layout="vertical" :model="form" :rules="rules" ref="DrawerForm">
        <a-form-model-item label="角色名称">
            <a-input v-model="form.roleName" :disabled="isView" />
        </a-form-model-item>
        <a-form-model-item label="角色编码">
            <a-input v-model="form.roleCode" :disabled="isView" />
        </a-form-model-item>
        <a-form-model-item label="角色说明" prop="remark">
            <a-input v-model="form.remark" :disabled="isView" />
        </a-form-model-item>

        <a-form-model-item label="菜单权限">
            <MenuTree v-model="checkedKeys" showMenu ref="menuTree" :disabled="isView" />
        </a-form-model-item>
    </a-form-model>
</template>

<script>
import MenuTree from '@/components/menu_tree/index.vue';
import FormMixin from '@/components/FormMixin';
import { addRoleApi, updateRoleApi } from '@/api';

export default {
    mixins: [FormMixin],
    components: { MenuTree },
    data() {
        return {
            form: {},
            rules: {},
            checkedKeys: [],
        };
    },
    computed: {},
    methods: {
        add() {
            console.log(1);
            return addRoleApi({ ...this.form, authorityList: this.$refs['menuTree'].get() });
        },
        edit() {
            console.log(1);
            return updateRoleApi({ ...this.form, authorityList: this.$refs['menuTree'].get() });
        },
    },
};
</script>
