<template>
  <el-form ref="genInfoForm" :model="info" :rules="rules" label-width="150px">
    <el-row>
      <el-col :span="12">
        <el-form-item prop="packageName">
          <template #label>
            生成包路径
            <el-tooltip
              content="生成在哪个java包下，例如 com.ruoyi.system"
              placement="top"
            >
              <el-icon>
                <question-filled />
              </el-icon>
            </el-tooltip>
          </template>
          <el-input v-model="info.packageName" />
        </el-form-item>
      </el-col>

      <el-col :span="12">
        <el-form-item prop="moduleName">
          <template #label>
            生成模块名
            <el-tooltip content="可理解为子系统名，例如 system" placement="top">
              <el-icon>
                <question-filled />
              </el-icon>
            </el-tooltip>
          </template>
          <el-input v-model="info.moduleName" />
        </el-form-item>
      </el-col>

      <el-col :span="12">
        <el-form-item prop="businessName">
          <template #label>
            生成业务名
            <el-tooltip content="可理解为功能英文名，例如 user" placement="top">
              <el-icon>
                <question-filled />
              </el-icon>
            </el-tooltip>
          </template>
          <el-input v-model="info.businessName" />
        </el-form-item>
      </el-col>

      <el-col :span="12">
        <el-form-item prop="functionName">
          <template #label>
            生成功能名
            <el-tooltip content="用作类描述，例如 用户" placement="top">
              <el-icon>
                <question-filled />
              </el-icon>
            </el-tooltip>
          </template>
          <el-input v-model="info.functionName" />
        </el-form-item>
      </el-col>

      <el-col :span="12">
        <el-form-item>
          <template #label>
            上级菜单
            <el-tooltip
              content="分配到指定菜单下，例如 系统管理"
              placement="top"
            >
              <el-icon>
                <question-filled />
              </el-icon>
            </el-tooltip>
          </template>
          <el-tree-select
            v-model="info.parentMenuId"
            :data="menuOptions"
            check-strictly
            :props="{
              value: 'menuId',
              label: 'menuName',
              children: 'children',
            }"
            placeholder="选择上级部门"
            value-key="menuId"
          />
        </el-form-item>
      </el-col>
    </el-row>
  </el-form>
</template>

<script setup>
import { listMenu } from "@/api/system/menu";

const menuOptions = ref([]);
const { proxy } = getCurrentInstance();

const props = defineProps({
  info: {
    type: Object,
    default: null,
  },
  tables: {
    type: Array,
    default: null,
  },
});

// 表单校验
const rules = ref({
  packageName: [
    { required: true, message: "请输入生成包路径", trigger: "blur" },
  ],
  moduleName: [
    { required: true, message: "请输入生成模块名", trigger: "blur" },
  ],
  businessName: [
    { required: true, message: "请输入生成业务名", trigger: "blur" },
  ],
  functionName: [
    { required: true, message: "请输入生成功能名", trigger: "blur" },
  ],
});

/** 查询菜单下拉树结构 */
function getMenuTreeselect() {
  listMenu().then((response) => {
    menuOptions.value = proxy.handleTree(response.data, "menuId");
  });
}

getMenuTreeselect();
</script>
