<!-- 角色：增加 / 修改 -->
<template>
    <div class="vue-box submit-box--dialog" style="width: 600px;">
        <div class="c-card">
            <el-form :inline="false" label-width="7em">
                <in-input name="角色id：" type="num" v-model="state.model.id" :disabled="state.id !== 0" placeholder="非必填"></in-input>
                <in-input name="角色名称：" v-model="state.model.name"></in-input>
                <in-input name="责任描述：" v-model="state.model.info" type="textarea"></in-input>
            </el-form>
        </div>
    </div>
</template>

<script setup name="role-add">
import {onMounted, reactive} from "vue";

// 获取插值 
const prop = defineProps({
    param: {type: Object}
})

// ------------------ 数据 ------------------
const state = reactive({
    id: prop.param.id || 0,  // 获取传值id （0=添加，非0=修改）
    model: { // 数据 Model
        id: '',
        name: '',
        info: '',
        isLock: 2,
    }
})

// 组件加载时执行函数
onMounted(function (){
    // 渲染旧数据  
    if(state.id !== 0) {
        sa.ajax('/role/getById?id=' + state.id, function (res) {
            if(!res.data) {
                return sa.alert('数据不存在');
            }
            state.model = res.data;
        })
    }
})

// ------------------ 函数 ------------------

// 提交表单 
defineExpose({
    ok: function () {
        // 表单校验 
        const model = sa.copyJSON(state.model);
        model.id = model.id || 0;
        sa.checkNull(model.name, '请输入角色名字');
        sa.checkNull(model.info, '请输入责任描述');

        // 如果是增加
        if(state.id === 0) {
            sa.ajax('/role/add', model, function(res) {
                sa.alert('添加成功', function() {
                    sa.closeModel();
                    sa.currView().f5();
                });
            });
        } else {
            // 如果是修改 
            sa.ajax('/role/update', model, function(res) {
                sa.alert('修改成功', function() {
                    sa.closeModel();
                    sa.currView().f5();
                });
            });
        }
    }
});


</script>

<style scoped>

</style>
