update 修改代码生成模板，调整列表打开对话框和接口请求顺序

lvwshuai

2023-07-20 3480e36dcd527e8bd8bb97ac8d2e4bc3d56de4d2

 ruoyi-modules/ruoyi-generator/src/main/resources/vm/vue/index-tree.vue.vm

@@ -15,12 +15,7 @@
#end
#if($column.htmlType == "input" || $column.htmlType == "textarea")
          <el-form-item label="${comment}" prop="${column.javaField}">
            <el-input
                v-model="queryParams.${column.javaField}"
                placeholder="请输入${comment}"
                clearable
                @keyup.enter="handleQuery"
            />
            <el-input v-model="queryParams.${column.javaField}" placeholder="请输入${comment}" clearable @keyup.enter="handleQuery" />
          </el-form-item>
#elseif(($column.htmlType == "select" || $column.htmlType == "radio") && "" != $dictType)
          <el-form-item label="${comment}" prop="${column.javaField}">
@@ -51,7 +46,7 @@
#elseif($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
          <el-form-item label="${comment}" style="width: 308px">
            <el-date-picker
                v-model="daterange${AttrName}"
                v-model="dateRange${AttrName}"
                value-format="YYYY-MM-DD HH:mm:ss"
                type="daterange"
                range-separator="-"
@@ -71,26 +66,14 @@
      </div>
    </transition>


    <el-card shadow="never">
      <template #header>
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button
                type="primary"
                plain
                icon="Plus"
                @click="handleAdd()"
                v-hasPermi="['${moduleName}:${businessName}:add']
            >新增</el-button>
            <el-button type="primary" plain icon="Plus" @click="handleAdd()" v-hasPermi="['${moduleName}:${businessName}:add']">新增</el-button>
          </el-col>
          <el-col :span="1.5">
            <el-button
                type="info"
                plain
                icon="Sort"
                @click="handleToggleExpandAll"
            >展开/折叠</el-button>
            <el-button type="info" plain icon="Sort" @click="handleToggleExpandAll">展开/折叠</el-button>
          </el-col>
          <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>
@@ -162,7 +145,7 @@
      <el-form ref="${businessName}FormRef" :model="form" :rules="rules" label-width="80px">
#foreach($column in $columns)
#set($field=$column.javaField)
#if($column.insert && !$column.pk)
#if(($column.insert || $column.edit) && !$column.pk)
#set($parentheseIndex=$column.columnComment.indexOf("（"))
#if($parentheseIndex != -1)
#set($comment=$column.columnComment.substring(0, $parentheseIndex))
@@ -274,7 +257,7 @@
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="primary" @click="submitForm">确 定</el-button>
          <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </template>
@@ -285,9 +268,6 @@
<script setup name="${BusinessName}" lang="ts">
import { list${BusinessName}, get${BusinessName}, del${BusinessName}, add${BusinessName}, update${BusinessName} } from "@/api/${moduleName}/${businessName}";
import { ${BusinessName}VO, ${BusinessName}Query, ${BusinessName}Form } from '@/api/${moduleName}/${businessName}/types';
import { ComponentInternalInstance } from 'vue';
import { ElForm, ElTable } from 'element-plus';


type ${BusinessName}Option = {
  ${treeCode}: number;
@@ -307,12 +287,11 @@
const buttonLoading = ref(false);
const showSearch = ref(true);
const isExpandAll = ref(true);
const refreshTable = ref(true);
const loading = ref(false);

const queryFormRef = ref(ElForm);
const ${businessName}FormRef = ref(ElForm);
const ${businessName}TableRef = ref(ElTable)
const queryFormRef = ref<ElFormInstance>();
const ${businessName}FormRef = ref<ElFormInstance>();
const ${businessName}TableRef = ref<ElTableInstance>()

const dialog = reactive<DialogOption>({
    visible: false,
@@ -322,7 +301,7 @@
#foreach ($column in $columns)
#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
const daterange${AttrName} = ref([]);
const dateRange${AttrName} = ref<[DateModelType, DateModelType]>(['', '']);
#end
#end

@@ -343,9 +322,20 @@
  queryParams: {
#foreach ($column in $columns)
#if($column.query)
    #if($column.htmlType != "datetime" || $column.queryType != "BETWEEN")
    $column.javaField: undefined#if($foreach.count != $columns.size()),#end
    #end
#end
#end
    params: {
      #foreach ($column in $columns)
      #if($column.query)
      #if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
      $column.javaField: undefined#if($foreach.count != $columns.size()),#end
      #end
      #end
      #end
    }
  },
  rules: {
#foreach ($column in $columns)
@@ -380,10 +370,7 @@
#foreach ($column in $columns)
#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
  if (null != daterange${AttrName} && '' != daterange${AttrName}) {
    queryParams.value.params["begin${AttrName}"] = daterange${AttrName}.value[0];
    queryParams.value.params["end${AttrName}"] = daterange${AttrName}.value[1];
  }
  proxy?.addDateRange(queryParams.value, dateRange${AttrName}.value, '${AttrName}');
#end
#end
  const res = await list${BusinessName}(queryParams.value);
@@ -412,7 +399,7 @@
// 表单重置
const reset = () => {
  form.value = {...initFormData}
  ${businessName}FormRef.value.resetFields();
  ${businessName}FormRef.value?.resetFields();
}

/** 搜索按钮操作 */
@@ -425,26 +412,24 @@
#foreach ($column in $columns)
#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
  daterange${AttrName}.value = [];
  dateRange${AttrName}.value = ['', ''];
#end
#end
  queryFormRef.value.resetFields();
  queryFormRef.value?.resetFields();
  handleQuery();
}

/** 新增按钮操作 */
const handleAdd = (row?: ${BusinessName}VO) => {
  reset();
  getTreeselect();
  if (row != null && row.${treeCode}) {
      form.value.${treeParentCode} = row.${treeCode};
  } else {
      form.value.${treeParentCode} = 0;
  }
  dialog.visible = true;
  dialog.title = "添加${functionName}";
  nextTick(() => {
    reset();
    getTreeselect();
    if (row != null && row.${treeCode}) {
      form.value.${treeParentCode} = row.${treeCode};
    } else {
      form.value.${treeParentCode} = 0;
    }
  });
}

/** 展开/折叠操作 */
@@ -456,37 +441,32 @@
/** 展开/折叠操作 */
const toggleExpandAll = (data: ${BusinessName}VO[], status: boolean) => {
  data.forEach((item) => {
    ${businessName}TableRef.value.toggleRowExpansion(item, status)
    ${businessName}TableRef.value?.toggleRowExpansion(item, status)
    if (item.children && item.children.length > 0) toggleExpandAll(item.children, status)
  })
}

/** 修改按钮操作 */
const handleUpdate = (row: ${BusinessName}VO) => {
  loading.value = true;
const handleUpdate = async (row: ${BusinessName}VO) => {
  reset();
  await getTreeselect();
  if (row != null) {
    form.value.${treeParentCode} = row.${treeCode};
  }
  const res = await get${BusinessName}(row.${treeCode});
  Object.assign(form.value, res.data);
#foreach ($column in $columns)
  #if($column.htmlType == "checkbox")
  form.value.$column.javaField = form.value.${column.javaField}.split(",");
  #end
#end
  dialog.visible = true;
  dialog.title = "修改${functionName}";
  nextTick(async () => {
    reset();
    await getTreeselect();
    if (row != null) {
      form.value.${treeParentCode} = row.${treeCode};
    }
    get${BusinessName}(row.${pkColumn.javaField}).then(response => {
      loading.value = false;
      form.value = response.data;
#foreach ($column in $columns)
#if($column.htmlType == "checkbox")
      form.value.$column.javaField = form.value.${column.javaField}.split(",");
#end
#end
    });
  });
}

/** 提交按钮 */
const submitForm = () => {
  ${businessName}FormRef.value.validate((valid: boolean) => {
  ${businessName}FormRef.value?.validate(async (valid: boolean) => {
    if (valid) {
      buttonLoading.value = true;
#foreach ($column in $columns)
@@ -495,9 +475,9 @@
#end
#end
      if (form.value.${pkColumn.javaField}) {
        update${BusinessName}(form.value).finally(() => buttonLoading.value = false);
        await update${BusinessName}(form.value).finally(() => buttonLoading.value = false);
      } else {
        add${BusinessName}(form.value).finally(() => buttonLoading.value = false);
        await add${BusinessName}(form.value).finally(() => buttonLoading.value = false);
      }
      proxy?.#[[$modal]]#.msgSuccess("操作成功");
      dialog.visible = false;