<template>
 <div class="position-re">
   <my-breadcrumb :breadcrumb-arr="myBread" class="my-breadcrumb"/>
   <div class="back" @click="$emit('changeOperation','',{})"><span class="fa fa-reply cur-po " >返回</span></div>
   <div class="my-detail-main">
     <div class="block">
       <div class="my-b-title">权限信息</div>
       <diy-el-form ref="formRef" :forms="rootManageDetailForm" v-model:model-form="form"/>
     </div>
   </div>

   <div class="detail-operation-btn">
     <el-button :icon="Select" @click="addRole">保存</el-button>
     <el-button :icon="Close" @click="$emit('changeOperation','')">关闭</el-button>
   </div>
 </div>
</template>

<script>
import MyBreadcrumb from "@/components/common/MyBreadcrumb.vue";
import {Close, Select} from "@element-plus/icons-vue";
import DiyElForm from "@/components/common/DiyElForm.vue";
import {ref} from "vue";
import {rootManageDetailForm} from "@/data/all-forms";
import {isValid} from "js-base64";
import {UserInfo} from "@/unit/UserInfo";
import {addRoleInfo} from "@/service/system-manage/root-manage";
import {handleMes} from "@/unit/element-ui/tip";

export default {
  name: "RootManageDetail",
  computed: {
    Close() {
      return Close
    },
    Select() {
      return Select
    }
  },
  components: {DiyElForm, MyBreadcrumb},
  setup(props,{emit}) {
    const formRef = ref(null)
    const form = ref({})
    function addRole() {
      formRef.value.refEl.validate(isValid=> {
       if (isValid){
         addRoleInfo({
           ROLE_NAME:form.value.ROLE_NAME,
           ROLE_INFO:form.value.ROLE_INFO,
           ROLE_TYPE:form.value.ROLE_TYPE,
           appkey:new UserInfo().GetUserKeyCode()
         }).then(res => {
           handleMes(res,() => {
             emit('changeOperation','',{})
           })
         })
       }
      })
    }
    const myBread = [
      {name:'权限管理'},
      {name:'权限管理新增'},
    ]
    return {
      myBread,
      form,
      rootManageDetailForm,
      addRole,
      formRef
    }
  }
}
</script>

<style scoped lang="scss">

</style>
