Merge branch 'ts' into dev

LiuHao

2023-05-06 bf4a8543ca9f4e9ef6d13f78385f5c0f30255dc0

 src/views/tool/gen/genInfoForm.vue

@@ -1,76 +1,3 @@
<script setup lang="ts">
import { listMenu } from '@/api/system/menu';
import { ComponentInternalInstance, PropType } from 'vue';

interface MenuOptionsType {
  menuId: number;
  menuName: string;
  children: MenuOptionsType[] | undefined;
}

const subColumns = ref<any>([]);
const menuOptions = ref<Array<MenuOptionsType>>([]);
const { proxy } = getCurrentInstance() as ComponentInternalInstance;

const props = defineProps({
  info: {
    type: Object as PropType<any>,
    default: null
  },
  tables: {
    type: Array as PropType<any[]>,
    default: null
  }
});

const infoForm = computed(() => props.info);

const table = computed(() => props.tables);

// 表单校验
const rules = ref({
  tplCategory: [{ required: true, message: "请选择生成模板", trigger: "blur" }],
  packageName: [{ required: true, message: "请输入生成包路径", trigger: "blur" }],
  moduleName: [{ required: true, message: "请输入生成模块名", trigger: "blur" }],
  businessName: [{ required: true, message: "请输入生成业务名", trigger: "blur" }],
  functionName: [{ required: true, message: "请输入生成功能名", trigger: "blur" }]
});
const subSelectChange = () => {
  infoForm.value.subTableFkName = "";
}
const tplSelectChange = (value: string) => {
  if (value !== "sub") {
    infoForm.value.subTableName = "";
    infoForm.value.subTableFkName = "";
  }
}
const setSubTableColumns = (value: string) => {
  table.value.forEach(item => {
    const name = item.tableName;
    if (value === name) {
      subColumns.value = item.columns;
      return;
    }
  })
}
/** 查询菜单下拉树结构 */
const getMenuTreeselect = async () => {
  const res = await listMenu();
  const data = proxy?.handleTree<MenuOptionsType>(res.data, "menuId");
  if (data) {
    menuOptions.value = data
  }
}

watch(() => props.info.subTableName, val => {
  setSubTableColumns(val);
});

onMounted(() => {
  getMenuTreeselect();
})
</script>

<template>
  <el-form ref="genInfoForm" :model="infoForm" :rules="rules" label-width="150px">
    <el-row>
@@ -140,11 +67,17 @@
              <el-icon><question-filled /></el-icon>
            </el-tooltip>
          </template>
          <tree-select
            v-model:value="infoForm.parentMenuId"
            :options="menuOptions"
            :objMap="{ value: 'menuId', label: 'menuName', children: 'children' }"
            placeholder="请选择系统菜单"
          <el-tree-select
            v-model="infoForm.parentMenuId"
            :data="menuOptions"
            :props="{ value: 'menuId', label: 'menuName', children: 'children' }"
            value-key="menuId"
            node-key="menuId"
            placeholder="选择上级菜单"
            check-strictly
            filterable
            clearable
            highlight-current
          />
        </el-form-item>
      </el-col>
@@ -287,3 +220,78 @@
    </template>
  </el-form>
</template>

<script setup lang="ts">
import { listMenu } from '@/api/system/menu';
import { ComponentInternalInstance, PropType } from 'vue';

interface MenuOptionsType {
  menuId: number | string;
  menuName: string;
  children: MenuOptionsType[] | undefined;
}

const subColumns = ref<any>([]);
const menuOptions = ref<Array<MenuOptionsType>>([]);
const { proxy } = getCurrentInstance() as ComponentInternalInstance;

const props = defineProps({
  info: {
    type: Object as PropType<any>,
    default: null
  },
  tables: {
    type: Array as PropType<any[]>,
    default: null
  }
});

const infoForm = computed(() => props.info);

const table = computed(() => props.tables);

// 表单校验
const rules = ref({
  tplCategory: [{required: true, message: "请选择生成模板", trigger: "blur"}],
  packageName: [{required: true, message: "请输入生成包路径", trigger: "blur"}],
  moduleName: [{required: true, message: "请输入生成模块名", trigger: "blur"}],
  businessName: [{required: true, message: "请输入生成业务名", trigger: "blur"}],
  functionName: [{required: true, message: "请输入生成功能名", trigger: "blur"}]
});
const subSelectChange = () => {
  infoForm.value.subTableFkName = "";
}
const tplSelectChange = (value: string) => {
  if (value !== "sub") {
    infoForm.value.subTableName = "";
    infoForm.value.subTableFkName = "";
  }
}
const setSubTableColumns = (value: string) => {
  table.value.forEach(item => {
    const name = item.tableName;
    if (value === name) {
      subColumns.value = item.columns;
      return;
    }
  })
}

/** 查询菜单下拉树结构 */
const getMenuTreeselect = async () => {
  const res = await listMenu();
  res.data.forEach(m => m.menuId = m.menuId.toString());
  const data = proxy?.handleTree<MenuOptionsType>(res.data, "menuId");
  if (data) {
    menuOptions.value = data
  }
}

watch(() => props.info.subTableName, val => {
  setSubTableColumns(val);
});

onMounted(() => {
  getMenuTreeselect();
})
</script>