<template>
<el-dialog

  :modal="true"
  :close-on-click-modal="false"
  :close-on-press-escape="false"
  destroy-on-close
  title="新增模块信息"
  :model-value="dialogVisible"

  :before-close="handleClose"
>
  <el-tree :icon="ArrowRight" :data="dataList" ref="treeRef" show-checkbox node-key="CODE" :props="{
    label:'NAME'
  }">

  </el-tree>
<!--  <my-table-->

<!--    border-->
<!--    ref="tableRef"-->
<!--    @getCheckedTable="getCheck"-->
<!--    :has-selection="true"-->
<!--    :each-tr-height="32"-->
<!--    :is-has-order="false"-->
<!--    :headers="[{prop:'NAME',label:''}]"-->
<!--    :table-data="dataList"-->
<!--   :page-size="30"-->
<!--    row-key="CODE"-->
<!--   :tree-props="{ children: 'children',hasChildren:'hasChildren'}"-->
<!--  >-->

<!--  </my-table>-->
  <template #footer v-if="!(+store.userInfo.ptjk_role !==0 || store.isUserVisiter)">
    <el-button :icon="Select" @click="saveS">保存</el-button>
    <el-button :icon="Close" @click="handleClose">关闭</el-button>
  </template>
</el-dialog>
</template>

<script>
import {nextTick, onBeforeMount, ref, watch} from "vue";
import {getAllModuleInfoD, saveUserModuleInfo} from "@/service/system-manage/root-manage";
import {useRootStore} from "@/stores/useStore";
import {handleLeftMenu, handleLeftMenu2} from "@/data/handleLayer";
import MyTable from "@/components/common/MyTable.vue";
import {ArrowLeft, ArrowRight, Close, Select} from "@element-plus/icons-vue";
import {handleMes} from "@/unit/element-ui/tip";
import {UserInfo} from "@/unit/UserInfo";

export default {
  name: "RootManageModuleDialog",
  computed: {
    ArrowRight() {
      return ArrowRight
    },
    ArrowLeft() {
      return ArrowLeft
    },
    Close() {
      return Close
    },
    Select() {
      return Select
    }
  },
  components: {MyTable},
  props:{
    currentOpObj:{},
    dialogVisible:{

    }
  },
  setup(props,{emit}){
    const treeRef = ref(null)
    function saveS(){

      let modules  =  treeRef.value.getCheckedNodes(false,true).map(i => {
        return i.CODE+'a'+'1'
      }).join('-')
      console.log('年拿到勾选的结果',modules)
      saveUserModuleInfo({
        a_role_id:props.currentOpObj.ROLE_ID,
        a_role_uuid:props.currentOpObj.UUID,
        a_modules:modules,
        appkey:new UserInfo().GetUserKeyCode()
      }).then(res => {
        handleMes(res,() => {
          emit('changeUserModule')
        })
      })
    }
    const store = useRootStore()
    const tableRef = ref(null)
    const originTableData= ref([])
    const dataList = ref([])
    function handleClose() {
      emit('update:dialogVisible',false)
    }


    onBeforeMount(() => {
      console.log('重新感觉')
      if (props.dialogVisible){
        getAllModuleInfoD({
          "ROLE_ID": props.currentOpObj.ROLE_ID,
          "ROLE_UUID":props.currentOpObj.UUID,
          "TYPE":props.currentOpObj.ROLE_TYPE,
          "pageIndex":1,
          "pagesize":10000,
          "appkey":useRootStore().userInfo.ptjk_userkeycode
        }).then(res => {
          let data = res.msg[0].Rows
          originTableData.value = data
          handleLeftMenu2(data,data)
          dataList.value = data.filter(i => +i.HIGHER ===0)

          nextTick(() => {

            originTableData.value.filter(i => +i.STATE && !originTableData.value.find(it => +it.HIGHER  === +i.CODE)).forEach(i => {
              treeRef.value.setChecked(i.CODE,true)

            })
          })

        })
      }
    })


    return {
      handleClose,
      dataList,


      originTableData,
      tableRef,
      store,
      saveS,
      treeRef
    }
  }
}
</script>

<style scoped lang="scss">
:deep{
  .el-tree-node__content{
    margin-top: -1px ;
    height: 36px;
    box-sizing: border-box;
    border: 1px solid var(--el-border-color);
  }
}
</style>
