!761 代码生成:vue2 代码模版格式调整;代码生成:准备 CodegenEngineVue2Test 所需测试文件

Merge pull request !761 from puhui999/feature/sub-table
This commit is contained in:
芋道源码 2023-11-28 12:26:50 +00:00 committed by Gitee
commit d3a565f011
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
25 changed files with 393 additions and 589 deletions

View File

@ -89,7 +89,7 @@
</template> </template>
<script> <script>
import * as ${simpleClassName}Api from '@/api/${table.moduleName}/${table.businessName}' import * as ${simpleClassName}Api from '@/api/${table.moduleName}/${table.businessName}';
#if ($hasImageUploadColumn) #if ($hasImageUploadColumn)
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
#end #end

View File

@ -8,12 +8,12 @@
<div class="app-container"> <div class="app-container">
#if ( $subTable.subJoinMany )## 情况一一对多table + form #if ( $subTable.subJoinMany )## 情况一一对多table + form
<el-form <el-form
ref="formRef" ref="formRef"
:model="formData" :model="formData"
:rules="formRules" :rules="formRules"
v-loading="formLoading" v-loading="formLoading"
label-width="0px" label-width="0px"
:inline-message="true" :inline-message="true"
> >
<el-table :data="formData" class="-mt-10px"> <el-table :data="formData" class="-mt-10px">
<el-table-column label="序号" type="index" width="100" /> <el-table-column label="序号" type="index" width="100" />
@ -137,11 +137,11 @@
</el-row> </el-row>
#else## 情况二一对一form #else## 情况二一对一form
<el-form <el-form
ref="formRef" ref="formRef"
:model="formData" :model="formData"
:rules="formRules" :rules="formRules"
label-width="100px" label-width="100px"
v-loading="formLoading" v-loading="formLoading"
> >
#foreach($column in $subColumns) #foreach($column in $subColumns)
#if ($column.createOperation || $column.updateOperation) #if ($column.createOperation || $column.updateOperation)
@ -221,7 +221,7 @@
</template> </template>
<script> <script>
import * as ${simpleClassName}Api from '@/api/${table.moduleName}/${table.businessName}' import * as ${simpleClassName}Api from '@/api/${table.moduleName}/${table.businessName}';
#if ($hasImageUploadColumn) #if ($hasImageUploadColumn)
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
#end #end

View File

@ -61,9 +61,9 @@
</template> </template>
<script> <script>
import * as ${simpleClassName}Api from '@/api/${table.moduleName}/${table.businessName}' import * as ${simpleClassName}Api from '@/api/${table.moduleName}/${table.businessName}';
#if ($table.templateType == 11) #if ($table.templateType == 11)
import ${subSimpleClassName}Form from './${subSimpleClassName}Form.vue' import ${subSimpleClassName}Form from './${subSimpleClassName}Form.vue';
#end #end
export default { export default {
name: "${subSimpleClassName}List", name: "${subSimpleClassName}List",

View File

@ -12,10 +12,10 @@
#if ( $table.templateType == 2 && $column.id == $treeParentColumn.id ) #if ( $table.templateType == 2 && $column.id == $treeParentColumn.id )
<el-form-item label="${comment}" prop="${javaField}"> <el-form-item label="${comment}" prop="${javaField}">
<TreeSelect <TreeSelect
v-model="formData.${javaField}" v-model="formData.${javaField}"
:options="${classNameVar}Tree" :options="${classNameVar}Tree"
:normalizer="normalizer" :normalizer="normalizer"
placeholder="请选择${comment}" placeholder="请选择${comment}"
/> />
</el-form-item> </el-form-item>
#elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键,不用在表单里 #elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键,不用在表单里
@ -107,7 +107,7 @@
</template> </template>
<script> <script>
import * as ${simpleClassName}Api from '@/api/${table.moduleName}/${table.businessName}' import * as ${simpleClassName}Api from '@/api/${table.moduleName}/${table.businessName}';
#if ($hasImageUploadColumn) #if ($hasImageUploadColumn)
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
#end #end
@ -212,7 +212,7 @@
this.title = "新增${table.classComment}"; this.title = "新增${table.classComment}";
## 特殊:树表专属逻辑 ## 特殊:树表专属逻辑
#if ( $table.templateType == 2 ) #if ( $table.templateType == 2 )
this.get${simpleClassName}Tree(); await this.get${simpleClassName}Tree();
#end #end
}, },
/** 提交按钮 */ /** 提交按钮 */
@ -263,7 +263,7 @@
this.#[[$modal]]#.msgSuccess("新增成功"); this.#[[$modal]]#.msgSuccess("新增成功");
this.dialogVisible = false; this.dialogVisible = false;
this.#[[$]]#emit('success'); this.#[[$]]#emit('success');
}finally { } finally {
this.formLoading = false; this.formLoading = false;
} }
}, },

View File

@ -1,6 +1,5 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
#foreach($column in $columns) #foreach($column in $columns)
@ -68,24 +67,24 @@
## 特殊:主子表专属逻辑 ## 特殊:主子表专属逻辑
#if ( $table.templateType == 11 && $subTables && $subTables.size() > 0 ) #if ( $table.templateType == 11 && $subTables && $subTables.size() > 0 )
<el-table <el-table
v-loading="loading" v-loading="loading"
:data="list" :data="list"
:stripe="true" :stripe="true"
:highlight-current-row="true" :highlight-current-row="true"
:show-overflow-tooltip="true" :show-overflow-tooltip="true"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
> >
## 特殊:树表专属逻辑 ## 特殊:树表专属逻辑
#elseif ( $table.templateType == 2 ) #elseif ( $table.templateType == 2 )
<el-table <el-table
v-loading="loading" v-loading="loading"
:data="list" :data="list"
:stripe="true" :stripe="true"
:show-overflow-tooltip="true" :show-overflow-tooltip="true"
v-if="refreshTable" v-if="refreshTable"
row-key="id" row-key="id"
:default-expand-all="isExpandAll" :default-expand-all="isExpandAll"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}" :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
> >
#else #else
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true"> <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
@ -183,7 +182,7 @@ import Editor from '@/components/Editor';
#if ( $table.templateType != 10 ) #if ( $table.templateType != 10 )
#if ( $subTables && $subTables.size() > 0 ) #if ( $subTables && $subTables.size() > 0 )
#foreach ($subSimpleClassName in $subSimpleClassNames) #foreach ($subSimpleClassName in $subSimpleClassNames)
import ${subSimpleClassName}List from './components/${subSimpleClassName}List.vue' import ${subSimpleClassName}List from './components/${subSimpleClassName}List.vue';
#end #end
#end #end
#end #end
@ -298,7 +297,7 @@ export default {
await this.#[[$modal]]#.confirm('是否确认删除${table.classComment}编号为"' + ${primaryColumn.javaField} + '"的数据项?') await this.#[[$modal]]#.confirm('是否确认删除${table.classComment}编号为"' + ${primaryColumn.javaField} + '"的数据项?')
try { try {
await ${simpleClassName}Api.delete${simpleClassName}(${primaryColumn.javaField}); await ${simpleClassName}Api.delete${simpleClassName}(${primaryColumn.javaField});
this.getList(); await this.getList();
this.#[[$modal]]#.msgSuccess("删除成功"); this.#[[$modal]]#.msgSuccess("删除成功");
} catch {} } catch {}
}, },

View File

@ -43,7 +43,7 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload'; import FileUpload from '@/components/FileUpload';
import Editor from '@/components/Editor'; import Editor from '@/components/Editor';
@ -90,19 +90,17 @@
}, },
methods: { methods: {
/** 打开弹窗 */ /** 打开弹窗 */
open(id, studentId) { async open(id, studentId) {
this.dialogVisible = true; this.dialogVisible = true;
this.reset(); this.reset();
const that = this;
this.formData.studentId = studentId; this.formData.studentId = studentId;
// 修改时,设置数据 // 修改时,设置数据
if (id) { if (id) {
this.formLoading = true; this.formLoading = true;
try { try {
StudentApi.getStudentContact(id).then(res=>{ const res = await StudentApi.getStudentContact(id);
that.formData = res.data; this.formData = res.data;
that.dialogTitle = "修改学生联系人"; this.dialogTitle = "修改学生联系人";
})
} finally { } finally {
this.formLoading = false; this.formLoading = false;
} }
@ -110,32 +108,26 @@
this.dialogTitle = "新增学生联系人"; this.dialogTitle = "新增学生联系人";
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm() { async submitForm() {
await this.$refs["formRef"].validate();
this.formLoading = true; this.formLoading = true;
try { try {
let data = this.formData; const data = this.formData;
this.$refs["formRef"].validate(valid => {
if (!valid) {
return;
}
// 修改的提交 // 修改的提交
if (data.id) { if (data.id) {
StudentApi.updateStudentContact(data).then(response => { await StudentApi.updateStudentContact(data);
this.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess("修改成功");
this.dialogVisible = false; this.dialogVisible = false;
this.$emit('success'); this.$emit('success');
});
return; return;
} }
// 添加的提交 // 添加的提交
StudentApi.createStudentContact(data).then(response => { await StudentApi.createStudentContact(data);
this.$modal.msgSuccess("新增成功"); this.$modal.msgSuccess("新增成功");
this.dialogVisible = false; this.dialogVisible = false;
this.$emit('success'); this.$emit('success');
});
});
}finally { }finally {
this.formLoading = false this.formLoading = false;
} }
}, },
/** 表单重置 */ /** 表单重置 */

View File

@ -52,8 +52,8 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
import StudentContactForm from './StudentContactForm.vue' import StudentContactForm from './StudentContactForm.vue';
export default { export default {
name: "StudentContactList", name: "StudentContactList",
components: { components: {
@ -91,14 +91,12 @@
}, },
methods: { methods: {
/** 查询列表 */ /** 查询列表 */
getList() { async getList() {
try { try {
this.loading = true; this.loading = true;
const that = this; const res = await StudentApi.getStudentContactPage(this.queryParams);
StudentApi.getStudentContactPage(this.queryParams).then(response => { this.list = res.data.list;
that.list = response.data.list; this.total = res.data.total;
that.total = response.data.total;
});
} finally { } finally {
this.loading = false; this.loading = false;
} }
@ -111,22 +109,19 @@
/** 添加/修改操作 */ /** 添加/修改操作 */
openForm(id) { openForm(id) {
if (!this.studentId) { if (!this.studentId) {
that.$modal.msgError('请选择一个学生'); this.$modal.msgError('请选择一个学生');
return; return;
} }
this.$refs["formRef"].open(id, this.studentId); this.$refs["formRef"].open(id, this.studentId);
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { async handleDelete(row) {
const that = this; const id = row.id;
await this.$modal.confirm('是否确认删除学生编号为"' + id + '"的数据项?');
try { try {
const id = row.id; await StudentApi.deleteStudentContact(id);
this.$modal.confirm('是否确认删除学生编号为"' + id + '"的数据项?').then(()=>{ await this.getList();
return StudentApi.deleteStudentContact(id); this.$modal.msgSuccess("删除成功");
}).then(() => {
that.getList();
that.$modal.msgSuccess("删除成功");
}).catch(() => {});
} catch {} } catch {}
}, },
} }

View File

@ -43,7 +43,7 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload'; import FileUpload from '@/components/FileUpload';
import Editor from '@/components/Editor'; import Editor from '@/components/Editor';
@ -89,18 +89,16 @@
}, },
methods: { methods: {
/** 打开弹窗 */ /** 打开弹窗 */
open(id) { async open(id) {
this.dialogVisible = true; this.dialogVisible = true;
this.reset(); this.reset();
const that = this;
// 修改时,设置数据 // 修改时,设置数据
if (id) { if (id) {
this.formLoading = true; this.formLoading = true;
try { try {
StudentApi.getStudent(id).then(res=>{ const res = await StudentApi.getStudent(id);
that.formData = res.data; this.formData = res.data;
that.title = "修改学生"; this.title = "修改学生";
})
} finally { } finally {
this.formLoading = false; this.formLoading = false;
} }
@ -108,41 +106,28 @@
this.title = "新增学生"; this.title = "新增学生";
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm() { async submitForm() {
this.formLoading = true; // 校验主表
await this.$refs["formRef"].validate();
this.formLoading = true;
try { try {
const that = this; const data = this.formData;
let data = this.formData; // 修改的提交
let validate = false;
// 校验主表
this.getRef("formRef").validate(valid => {
validate = valid;
});
// 所有表单校验通过后方可提交
if (!validate) {
return;
}
// 修改的提交
if (data.id) { if (data.id) {
StudentApi.updateStudent(data).then(response => { await StudentApi.updateStudent(data);
that.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess("修改成功");
that.dialogVisible = false; this.dialogVisible = false;
that.$emit('success'); this.$emit('success');
});
return; return;
} }
// 添加的提交 // 添加的提交
StudentApi.createStudent(data).then(response => { await StudentApi.createStudent(data);
that.$modal.msgSuccess("新增成功"); this.$modal.msgSuccess("新增成功");
that.dialogVisible = false; this.dialogVisible = false;
that.$emit('success'); this.$emit('success');
}); } finally {
}finally {
this.formLoading = false; this.formLoading = false;
} }
},
getRef(refName){
return this.$refs[refName];
}, },
/** 表单重置 */ /** 表单重置 */
reset() { reset() {
@ -158,7 +143,7 @@
memo: undefined, memo: undefined,
}; };
this.resetForm("formRef"); this.resetForm("formRef");
}, }
} }
}; };
</script> </script>

View File

@ -43,7 +43,7 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload'; import FileUpload from '@/components/FileUpload';
import Editor from '@/components/Editor'; import Editor from '@/components/Editor';
@ -90,19 +90,17 @@
}, },
methods: { methods: {
/** 打开弹窗 */ /** 打开弹窗 */
open(id, studentId) { async open(id, studentId) {
this.dialogVisible = true; this.dialogVisible = true;
this.reset(); this.reset();
const that = this;
this.formData.studentId = studentId; this.formData.studentId = studentId;
// 修改时,设置数据 // 修改时,设置数据
if (id) { if (id) {
this.formLoading = true; this.formLoading = true;
try { try {
StudentApi.getStudentTeacher(id).then(res=>{ const res = await StudentApi.getStudentTeacher(id);
that.formData = res.data; this.formData = res.data;
that.dialogTitle = "修改学生班主任"; this.dialogTitle = "修改学生班主任";
})
} finally { } finally {
this.formLoading = false; this.formLoading = false;
} }
@ -110,32 +108,26 @@
this.dialogTitle = "新增学生班主任"; this.dialogTitle = "新增学生班主任";
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm() { async submitForm() {
await this.$refs["formRef"].validate();
this.formLoading = true; this.formLoading = true;
try { try {
let data = this.formData; const data = this.formData;
this.$refs["formRef"].validate(valid => {
if (!valid) {
return;
}
// 修改的提交 // 修改的提交
if (data.id) { if (data.id) {
StudentApi.updateStudentTeacher(data).then(response => { await StudentApi.updateStudentTeacher(data);
this.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess("修改成功");
this.dialogVisible = false; this.dialogVisible = false;
this.$emit('success'); this.$emit('success');
});
return; return;
} }
// 添加的提交 // 添加的提交
StudentApi.createStudentTeacher(data).then(response => { await StudentApi.createStudentTeacher(data);
this.$modal.msgSuccess("新增成功"); this.$modal.msgSuccess("新增成功");
this.dialogVisible = false; this.dialogVisible = false;
this.$emit('success'); this.$emit('success');
});
});
}finally { }finally {
this.formLoading = false this.formLoading = false;
} }
}, },
/** 表单重置 */ /** 表单重置 */

View File

@ -52,8 +52,8 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
import StudentTeacherForm from './StudentTeacherForm.vue' import StudentTeacherForm from './StudentTeacherForm.vue';
export default { export default {
name: "StudentTeacherList", name: "StudentTeacherList",
components: { components: {
@ -91,14 +91,12 @@
}, },
methods: { methods: {
/** 查询列表 */ /** 查询列表 */
getList() { async getList() {
try { try {
this.loading = true; this.loading = true;
const that = this; const res = await StudentApi.getStudentTeacherPage(this.queryParams);
StudentApi.getStudentTeacherPage(this.queryParams).then(response => { this.list = res.data.list;
that.list = response.data.list; this.total = res.data.total;
that.total = response.data.total;
});
} finally { } finally {
this.loading = false; this.loading = false;
} }
@ -111,22 +109,19 @@
/** 添加/修改操作 */ /** 添加/修改操作 */
openForm(id) { openForm(id) {
if (!this.studentId) { if (!this.studentId) {
that.$modal.msgError('请选择一个学生'); this.$modal.msgError('请选择一个学生');
return; return;
} }
this.$refs["formRef"].open(id, this.studentId); this.$refs["formRef"].open(id, this.studentId);
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { async handleDelete(row) {
const that = this; const id = row.id;
await this.$modal.confirm('是否确认删除学生编号为"' + id + '"的数据项?');
try { try {
const id = row.id; await StudentApi.deleteStudentTeacher(id);
this.$modal.confirm('是否确认删除学生编号为"' + id + '"的数据项?').then(()=>{ await this.getList();
return StudentApi.deleteStudentTeacher(id); this.$modal.msgSuccess("删除成功");
}).then(() => {
that.getList();
that.$modal.msgSuccess("删除成功");
}).catch(() => {});
} catch {} } catch {}
}, },
} }

View File

@ -1,6 +1,5 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="名字" prop="name"> <el-form-item label="名字" prop="name">
@ -45,12 +44,12 @@
</el-row> </el-row>
<el-table <el-table
v-loading="loading" v-loading="loading"
:data="list" :data="list"
:stripe="true" :stripe="true"
:highlight-current-row="true" :highlight-current-row="true"
:show-overflow-tooltip="true" :show-overflow-tooltip="true"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
> >
<el-table-column label="编号" align="center" prop="id"> <el-table-column label="编号" align="center" prop="id">
<template v-slot="scope"> <template v-slot="scope">
@ -131,8 +130,8 @@
<script> <script>
import * as StudentApi from '@/api/infra/demo'; import * as StudentApi from '@/api/infra/demo';
import StudentForm from './StudentForm.vue'; import StudentForm from './StudentForm.vue';
import StudentContactList from './components/StudentContactList.vue' import StudentContactList from './components/StudentContactList.vue';
import StudentTeacherList from './components/StudentTeacherList.vue' import StudentTeacherList from './components/StudentTeacherList.vue';
export default { export default {
name: "Student", name: "Student",
components: { components: {
@ -177,13 +176,12 @@ export default {
}, },
methods: { methods: {
/** 查询列表 */ /** 查询列表 */
getList() { async getList() {
try { try {
this.loading = true; this.loading = true;
StudentApi.getStudentPage(this.queryParams).then(response => { const res = await StudentApi.getStudentPage(this.queryParams);
this.list = response.data.list; this.list = res.data.list;
this.total = response.data.total; this.total = res.data.total;
});
} finally { } finally {
this.loading = false; this.loading = false;
} }
@ -203,31 +201,25 @@ export default {
this.$refs["formRef"].open(id); this.$refs["formRef"].open(id);
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { async handleDelete(row) {
const that = this;
try {
const id = row.id; const id = row.id;
this.$modal.confirm('是否确认删除学生编号为"' + id + '"的数据项?').then(()=>{ await this.$modal.confirm('是否确认删除学生编号为"' + id + '"的数据项?')
return StudentApi.deleteStudent(id); try {
}).then(() => { await StudentApi.deleteStudent(id);
that.getList(); await this.getList();
that.$modal.msgSuccess("删除成功"); this.$modal.msgSuccess("删除成功");
}).catch(() => {});
} catch {} } catch {}
}, },
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { async handleExport() {
const that = this; await this.$modal.confirm('是否确认导出所有学生数据项?');
try { try {
this.$modal.confirm('是否确认导出所有学生数据项?').then(() => { this.exportLoading = true;
that.exportLoading = true; const res = await StudentApi.exportStudentExcel(this.queryParams);
return StudentApi.exportStudentExcel(params); this.$download.excel(res.data, '学生.xls');
}).then(response => {
that.$download.excel(response, '学生.xls');
});
} catch { } catch {
} finally { } finally {
that.exportLoading = false; this.exportLoading = false;
} }
}, },
/** 选中行操作 */ /** 选中行操作 */

View File

@ -1,12 +1,12 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form <el-form
ref="formRef" ref="formRef"
:model="formData" :model="formData"
:rules="formRules" :rules="formRules"
v-loading="formLoading" v-loading="formLoading"
label-width="0px" label-width="0px"
:inline-message="true" :inline-message="true"
> >
<el-table :data="formData" class="-mt-10px"> <el-table :data="formData" class="-mt-10px">
<el-table-column label="序号" type="index" width="100" /> <el-table-column label="序号" type="index" width="100" />
@ -86,7 +86,7 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload'; import FileUpload from '@/components/FileUpload';
import Editor from '@/components/Editor'; import Editor from '@/components/Editor';
@ -130,8 +130,9 @@
} }
try { try {
this.formLoading = true; this.formLoading = true;
// 这里还是需要获取一下 this 的不然取不到 formData
const that = this; const that = this;
StudentApi.getStudentContactListByStudentId(val).then(res=>{ StudentApi.getStudentContactListByStudentId(val).then(function (res){
that.formData = res.data; that.formData = res.data;
}) })
} finally { } finally {
@ -156,20 +157,20 @@
video: undefined, video: undefined,
memo: undefined, memo: undefined,
} }
row.studentId = this.studentId row.studentId = this.studentId;
this.formData.push(row) this.formData.push(row);
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(index) { handleDelete(index) {
this.formData.splice(index, 1) this.formData.splice(index, 1);
}, },
/** 表单校验 */ /** 表单校验 */
validate(){ validate(){
return this.$refs["formRef"].validate() return this.$refs["formRef"].validate();
}, },
/** 表单值 */ /** 表单值 */
getData(){ getData(){
return this.formData return this.formData;
} }
} }
}; };

View File

@ -40,7 +40,7 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
export default { export default {
name: "StudentContactList", name: "StudentContactList",
props:[ props:[
@ -70,13 +70,11 @@
}, },
methods: { methods: {
/** 查询列表 */ /** 查询列表 */
getList() { async getList() {
try { try {
this.loading = true; this.loading = true;
const that = this; const res = await StudentApi.getStudentContactListByStudentId(this.studentId);
StudentApi.getStudentContactListByStudentId(this.studentId).then(response=>{ this.list = res.data;
that.list = response.data;
})
} finally { } finally {
this.loading = false; this.loading = false;
} }

View File

@ -52,7 +52,7 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload'; import FileUpload from '@/components/FileUpload';
import Editor from '@/components/Editor'; import Editor from '@/components/Editor';
@ -104,18 +104,16 @@
}, },
methods: { methods: {
/** 打开弹窗 */ /** 打开弹窗 */
open(id) { async open(id) {
this.dialogVisible = true; this.dialogVisible = true;
this.reset(); this.reset();
const that = this;
// 修改时,设置数据 // 修改时,设置数据
if (id) { if (id) {
this.formLoading = true; this.formLoading = true;
try { try {
StudentApi.getStudent(id).then(res=>{ const res = await StudentApi.getStudent(id);
that.formData = res.data; this.formData = res.data;
that.title = "修改学生"; this.title = "修改学生";
})
} finally { } finally {
this.formLoading = false; this.formLoading = false;
} }
@ -123,83 +121,44 @@
this.title = "新增学生"; this.title = "新增学生";
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm() { async submitForm() {
// 校验主表
await this.$refs["formRef"].validate();
// 校验子表
try {
await this.$refs['studentContactFormRef'].validate();
} catch (e) {
this.subTabsName = 'studentContact';
return;
}
try {
await this.$refs['studentTeacherFormRef'].validate();
} catch (e) {
this.subTabsName = 'studentTeacher';
return;
}
this.formLoading = true; this.formLoading = true;
try { try {
const that = this; const data = this.formData;
let data = this.formData; // 拼接子表的数据
let validate = false; data.studentContacts = this.$refs['studentContactFormRef'].getData();
// 校验主表 data.studentTeacher = this.$refs['studentTeacherFormRef'].getData();
this.getRef("formRef").validate(valid => {
validate = valid;
});
// 校验子表
this.validateSubFrom01().then(() => {
// 全部校验通过-拼接子表的数据
// 拼接子表的数据
data.studentContacts = that.getRef('studentContactFormRef').getData();
data.studentTeacher = that.getRef('studentTeacherFormRef').getData();
}).catch((err) => {
validate = false;
that.subTabsName = err.replace("FormRef", ""); // 定位到没有校验通过的子表单
})
// 所有表单校验通过后方可提交
if (!validate) {
return;
}
// 修改的提交 // 修改的提交
if (data.id) { if (data.id) {
StudentApi.updateStudent(data).then(response => { await StudentApi.updateStudent(data);
that.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess("修改成功");
that.dialogVisible = false; this.dialogVisible = false;
that.$emit('success'); this.$emit('success');
});
return; return;
} }
// 添加的提交 // 添加的提交
StudentApi.createStudent(data).then(response => { await StudentApi.createStudent(data);
that.$modal.msgSuccess("新增成功"); this.$modal.msgSuccess("新增成功");
that.dialogVisible = false; this.dialogVisible = false;
that.$emit('success'); this.$emit('success');
}); } finally {
}finally {
this.formLoading = false; this.formLoading = false;
} }
},
getRef(refName){
return this.$refs[refName];
},
/** 校验子表单 */
validateSubFrom(item) {
return new Promise((resolve, reject) => {
this.getRef(item).validate()
.then(() => {
resolve();
})
.catch(() => {
reject(item);
})
})
},
/** 校验所有子表单 */
validateSubFrom01() {
// 需要校验的表单 ref
const validFormRefArr = [
"studentContactFormRef",
"studentTeacherFormRef",
];
const validArr = []; // 校验
for (const item of validFormRefArr) {
validArr.push(this.validateSubFrom(item));
}
return new Promise((resolve, reject) => {
// 校验所有
Promise.all(validArr).then(() => {
resolve();
}).catch((err) => {
reject(err);
})
})
}, },
/** 表单重置 */ /** 表单重置 */
reset() { reset() {
@ -215,7 +174,7 @@
memo: undefined, memo: undefined,
}; };
this.resetForm("formRef"); this.resetForm("formRef");
}, }
} }
}; };
</script> </script>

View File

@ -1,11 +1,11 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form <el-form
ref="formRef" ref="formRef"
:model="formData" :model="formData"
:rules="formRules" :rules="formRules"
label-width="100px" label-width="100px"
v-loading="formLoading" v-loading="formLoading"
> >
<el-form-item label="名字" prop="name"> <el-form-item label="名字" prop="name">
<el-input v-model="formData.name" placeholder="请输入名字" /> <el-input v-model="formData.name" placeholder="请输入名字" />
@ -42,7 +42,7 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload'; import FileUpload from '@/components/FileUpload';
import Editor from '@/components/Editor'; import Editor from '@/components/Editor';
@ -97,8 +97,9 @@
} }
try { try {
this.formLoading = true; this.formLoading = true;
// 这里还是需要获取一下 this 的不然取不到 formData
const that = this; const that = this;
StudentApi.getStudentTeacherByStudentId(val).then(res=>{ StudentApi.getStudentTeacherByStudentId(val).then(function (res){
const data = res.data; const data = res.data;
if (!data) { if (!data) {
return return
@ -115,11 +116,11 @@
methods: { methods: {
/** 表单校验 */ /** 表单校验 */
validate(){ validate(){
return this.$refs["formRef"].validate() return this.$refs["formRef"].validate();
}, },
/** 表单值 */ /** 表单值 */
getData(){ getData(){
return this.formData return this.formData;
} }
} }
}; };

View File

@ -40,7 +40,7 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
export default { export default {
name: "StudentTeacherList", name: "StudentTeacherList",
props:[ props:[
@ -70,17 +70,15 @@
}, },
methods: { methods: {
/** 查询列表 */ /** 查询列表 */
getList() { async getList() {
try { try {
this.loading = true; this.loading = true;
const that = this; const res = await StudentApi.getStudentTeacherByStudentId(this.studentId);
StudentApi.getStudentTeacherByStudentId(this.studentId).then(response=>{ const data = res.data;
const data = response.data; if (!data) {
if (!data) { return;
return }
} this.list.push(data);
that.list.push(data)
})
} finally { } finally {
this.loading = false; this.loading = false;
} }

View File

@ -1,6 +1,5 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="名字" prop="name"> <el-form-item label="名字" prop="name">
@ -128,8 +127,8 @@
<script> <script>
import * as StudentApi from '@/api/infra/demo'; import * as StudentApi from '@/api/infra/demo';
import StudentForm from './StudentForm.vue'; import StudentForm from './StudentForm.vue';
import StudentContactList from './components/StudentContactList.vue' import StudentContactList from './components/StudentContactList.vue';
import StudentTeacherList from './components/StudentTeacherList.vue' import StudentTeacherList from './components/StudentTeacherList.vue';
export default { export default {
name: "Student", name: "Student",
components: { components: {
@ -172,13 +171,12 @@ export default {
}, },
methods: { methods: {
/** 查询列表 */ /** 查询列表 */
getList() { async getList() {
try { try {
this.loading = true; this.loading = true;
StudentApi.getStudentPage(this.queryParams).then(response => { const res = await StudentApi.getStudentPage(this.queryParams);
this.list = response.data.list; this.list = res.data.list;
this.total = response.data.total; this.total = res.data.total;
});
} finally { } finally {
this.loading = false; this.loading = false;
} }
@ -198,31 +196,25 @@ export default {
this.$refs["formRef"].open(id); this.$refs["formRef"].open(id);
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { async handleDelete(row) {
const that = this;
try {
const id = row.id; const id = row.id;
this.$modal.confirm('是否确认删除学生编号为"' + id + '"的数据项?').then(()=>{ await this.$modal.confirm('是否确认删除学生编号为"' + id + '"的数据项?')
return StudentApi.deleteStudent(id); try {
}).then(() => { await StudentApi.deleteStudent(id);
that.getList(); await this.getList();
that.$modal.msgSuccess("删除成功"); this.$modal.msgSuccess("删除成功");
}).catch(() => {});
} catch {} } catch {}
}, },
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { async handleExport() {
const that = this; await this.$modal.confirm('是否确认导出所有学生数据项?');
try { try {
this.$modal.confirm('是否确认导出所有学生数据项?').then(() => { this.exportLoading = true;
that.exportLoading = true; const res = await StudentApi.exportStudentExcel(this.queryParams);
return StudentApi.exportStudentExcel(params); this.$download.excel(res.data, '学生.xls');
}).then(response => {
that.$download.excel(response, '学生.xls');
});
} catch { } catch {
} finally { } finally {
that.exportLoading = false; this.exportLoading = false;
} }
}, },
} }

View File

@ -1,12 +1,12 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form <el-form
ref="formRef" ref="formRef"
:model="formData" :model="formData"
:rules="formRules" :rules="formRules"
v-loading="formLoading" v-loading="formLoading"
label-width="0px" label-width="0px"
:inline-message="true" :inline-message="true"
> >
<el-table :data="formData" class="-mt-10px"> <el-table :data="formData" class="-mt-10px">
<el-table-column label="序号" type="index" width="100" /> <el-table-column label="序号" type="index" width="100" />
@ -86,7 +86,7 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload'; import FileUpload from '@/components/FileUpload';
import Editor from '@/components/Editor'; import Editor from '@/components/Editor';
@ -130,8 +130,9 @@
} }
try { try {
this.formLoading = true; this.formLoading = true;
// 这里还是需要获取一下 this 的不然取不到 formData
const that = this; const that = this;
StudentApi.getStudentContactListByStudentId(val).then(res=>{ StudentApi.getStudentContactListByStudentId(val).then(function (res){
that.formData = res.data; that.formData = res.data;
}) })
} finally { } finally {
@ -156,20 +157,20 @@
video: undefined, video: undefined,
memo: undefined, memo: undefined,
} }
row.studentId = this.studentId row.studentId = this.studentId;
this.formData.push(row) this.formData.push(row);
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(index) { handleDelete(index) {
this.formData.splice(index, 1) this.formData.splice(index, 1);
}, },
/** 表单校验 */ /** 表单校验 */
validate(){ validate(){
return this.$refs["formRef"].validate() return this.$refs["formRef"].validate();
}, },
/** 表单值 */ /** 表单值 */
getData(){ getData(){
return this.formData return this.formData;
} }
} }
}; };

View File

@ -52,7 +52,7 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload'; import FileUpload from '@/components/FileUpload';
import Editor from '@/components/Editor'; import Editor from '@/components/Editor';
@ -104,18 +104,16 @@
}, },
methods: { methods: {
/** 打开弹窗 */ /** 打开弹窗 */
open(id) { async open(id) {
this.dialogVisible = true; this.dialogVisible = true;
this.reset(); this.reset();
const that = this;
// 修改时,设置数据 // 修改时,设置数据
if (id) { if (id) {
this.formLoading = true; this.formLoading = true;
try { try {
StudentApi.getStudent(id).then(res=>{ const res = await StudentApi.getStudent(id);
that.formData = res.data; this.formData = res.data;
that.title = "修改学生"; this.title = "修改学生";
})
} finally { } finally {
this.formLoading = false; this.formLoading = false;
} }
@ -123,83 +121,44 @@
this.title = "新增学生"; this.title = "新增学生";
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm() { async submitForm() {
// 校验主表
await this.$refs["formRef"].validate();
// 校验子表
try {
await this.$refs['studentContactFormRef'].validate();
} catch (e) {
this.subTabsName = 'studentContact';
return;
}
try {
await this.$refs['studentTeacherFormRef'].validate();
} catch (e) {
this.subTabsName = 'studentTeacher';
return;
}
this.formLoading = true; this.formLoading = true;
try { try {
const that = this; const data = this.formData;
let data = this.formData; // 拼接子表的数据
let validate = false; data.studentContacts = this.$refs['studentContactFormRef'].getData();
// 校验主表 data.studentTeacher = this.$refs['studentTeacherFormRef'].getData();
this.getRef("formRef").validate(valid => {
validate = valid;
});
// 校验子表
this.validateSubFrom01().then(() => {
// 全部校验通过-拼接子表的数据
// 拼接子表的数据
data.studentContacts = that.getRef('studentContactFormRef').getData();
data.studentTeacher = that.getRef('studentTeacherFormRef').getData();
}).catch((err) => {
validate = false;
that.subTabsName = err.replace("FormRef", ""); // 定位到没有校验通过的子表单
})
// 所有表单校验通过后方可提交
if (!validate) {
return;
}
// 修改的提交 // 修改的提交
if (data.id) { if (data.id) {
StudentApi.updateStudent(data).then(response => { await StudentApi.updateStudent(data);
that.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess("修改成功");
that.dialogVisible = false; this.dialogVisible = false;
that.$emit('success'); this.$emit('success');
});
return; return;
} }
// 添加的提交 // 添加的提交
StudentApi.createStudent(data).then(response => { await StudentApi.createStudent(data);
that.$modal.msgSuccess("新增成功"); this.$modal.msgSuccess("新增成功");
that.dialogVisible = false; this.dialogVisible = false;
that.$emit('success'); this.$emit('success');
}); } finally {
}finally {
this.formLoading = false; this.formLoading = false;
} }
},
getRef(refName){
return this.$refs[refName];
},
/** 校验子表单 */
validateSubFrom(item) {
return new Promise((resolve, reject) => {
this.getRef(item).validate()
.then(() => {
resolve();
})
.catch(() => {
reject(item);
})
})
},
/** 校验所有子表单 */
validateSubFrom01() {
// 需要校验的表单 ref
const validFormRefArr = [
"studentContactFormRef",
"studentTeacherFormRef",
];
const validArr = []; // 校验
for (const item of validFormRefArr) {
validArr.push(this.validateSubFrom(item));
}
return new Promise((resolve, reject) => {
// 校验所有
Promise.all(validArr).then(() => {
resolve();
}).catch((err) => {
reject(err);
})
})
}, },
/** 表单重置 */ /** 表单重置 */
reset() { reset() {
@ -215,7 +174,7 @@
memo: undefined, memo: undefined,
}; };
this.resetForm("formRef"); this.resetForm("formRef");
}, }
} }
}; };
</script> </script>

View File

@ -1,11 +1,11 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form <el-form
ref="formRef" ref="formRef"
:model="formData" :model="formData"
:rules="formRules" :rules="formRules"
label-width="100px" label-width="100px"
v-loading="formLoading" v-loading="formLoading"
> >
<el-form-item label="名字" prop="name"> <el-form-item label="名字" prop="name">
<el-input v-model="formData.name" placeholder="请输入名字" /> <el-input v-model="formData.name" placeholder="请输入名字" />
@ -42,7 +42,7 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload'; import FileUpload from '@/components/FileUpload';
import Editor from '@/components/Editor'; import Editor from '@/components/Editor';
@ -97,8 +97,9 @@
} }
try { try {
this.formLoading = true; this.formLoading = true;
// 这里还是需要获取一下 this 的不然取不到 formData
const that = this; const that = this;
StudentApi.getStudentTeacherByStudentId(val).then(res=>{ StudentApi.getStudentTeacherByStudentId(val).then(function (res){
const data = res.data; const data = res.data;
if (!data) { if (!data) {
return return
@ -115,11 +116,11 @@
methods: { methods: {
/** 表单校验 */ /** 表单校验 */
validate(){ validate(){
return this.$refs["formRef"].validate() return this.$refs["formRef"].validate();
}, },
/** 表单值 */ /** 表单值 */
getData(){ getData(){
return this.formData return this.formData;
} }
} }
}; };

View File

@ -1,6 +1,5 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="名字" prop="name"> <el-form-item label="名字" prop="name">
@ -155,13 +154,12 @@ export default {
}, },
methods: { methods: {
/** 查询列表 */ /** 查询列表 */
getList() { async getList() {
try { try {
this.loading = true; this.loading = true;
StudentApi.getStudentPage(this.queryParams).then(response => { const res = await StudentApi.getStudentPage(this.queryParams);
this.list = response.data.list; this.list = res.data.list;
this.total = response.data.total; this.total = res.data.total;
});
} finally { } finally {
this.loading = false; this.loading = false;
} }
@ -181,31 +179,25 @@ export default {
this.$refs["formRef"].open(id); this.$refs["formRef"].open(id);
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { async handleDelete(row) {
const that = this;
try {
const id = row.id; const id = row.id;
this.$modal.confirm('是否确认删除学生编号为"' + id + '"的数据项?').then(()=>{ await this.$modal.confirm('是否确认删除学生编号为"' + id + '"的数据项?')
return StudentApi.deleteStudent(id); try {
}).then(() => { await StudentApi.deleteStudent(id);
that.getList(); await this.getList();
that.$modal.msgSuccess("删除成功"); this.$modal.msgSuccess("删除成功");
}).catch(() => {});
} catch {} } catch {}
}, },
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { async handleExport() {
const that = this; await this.$modal.confirm('是否确认导出所有学生数据项?');
try { try {
this.$modal.confirm('是否确认导出所有学生数据项?').then(() => { this.exportLoading = true;
that.exportLoading = true; const res = await StudentApi.exportStudentExcel(this.queryParams);
return StudentApi.exportStudentExcel(params); this.$download.excel(res.data, '学生.xls');
}).then(response => {
that.$download.excel(response, '学生.xls');
});
} catch { } catch {
} finally { } finally {
that.exportLoading = false; this.exportLoading = false;
} }
}, },
} }

View File

@ -43,7 +43,7 @@
</template> </template>
<script> <script>
import * as StudentApi from '@/api/infra/demo' import * as StudentApi from '@/api/infra/demo';
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload'; import FileUpload from '@/components/FileUpload';
import Editor from '@/components/Editor'; import Editor from '@/components/Editor';
@ -89,18 +89,16 @@
}, },
methods: { methods: {
/** 打开弹窗 */ /** 打开弹窗 */
open(id) { async open(id) {
this.dialogVisible = true; this.dialogVisible = true;
this.reset(); this.reset();
const that = this;
// 修改时,设置数据 // 修改时,设置数据
if (id) { if (id) {
this.formLoading = true; this.formLoading = true;
try { try {
StudentApi.getStudent(id).then(res=>{ const res = await StudentApi.getStudent(id);
that.formData = res.data; this.formData = res.data;
that.title = "修改学生"; this.title = "修改学生";
})
} finally { } finally {
this.formLoading = false; this.formLoading = false;
} }
@ -108,41 +106,28 @@
this.title = "新增学生"; this.title = "新增学生";
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm() { async submitForm() {
this.formLoading = true; // 校验主表
await this.$refs["formRef"].validate();
this.formLoading = true;
try { try {
const that = this; const data = this.formData;
let data = this.formData; // 修改的提交
let validate = false;
// 校验主表
this.getRef("formRef").validate(valid => {
validate = valid;
});
// 所有表单校验通过后方可提交
if (!validate) {
return;
}
// 修改的提交
if (data.id) { if (data.id) {
StudentApi.updateStudent(data).then(response => { await StudentApi.updateStudent(data);
that.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess("修改成功");
that.dialogVisible = false; this.dialogVisible = false;
that.$emit('success'); this.$emit('success');
});
return; return;
} }
// 添加的提交 // 添加的提交
StudentApi.createStudent(data).then(response => { await StudentApi.createStudent(data);
that.$modal.msgSuccess("新增成功"); this.$modal.msgSuccess("新增成功");
that.dialogVisible = false; this.dialogVisible = false;
that.$emit('success'); this.$emit('success');
}); } finally {
}finally {
this.formLoading = false; this.formLoading = false;
} }
},
getRef(refName){
return this.$refs[refName];
}, },
/** 表单重置 */ /** 表单重置 */
reset() { reset() {
@ -158,7 +143,7 @@
memo: undefined, memo: undefined,
}; };
this.resetForm("formRef"); this.resetForm("formRef");
}, }
} }
}; };
</script> </script>

View File

@ -1,6 +1,5 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="名字" prop="name"> <el-form-item label="名字" prop="name">
@ -155,13 +154,12 @@ export default {
}, },
methods: { methods: {
/** 查询列表 */ /** 查询列表 */
getList() { async getList() {
try { try {
this.loading = true; this.loading = true;
StudentApi.getStudentPage(this.queryParams).then(response => { const res = await StudentApi.getStudentPage(this.queryParams);
this.list = response.data.list; this.list = res.data.list;
this.total = response.data.total; this.total = res.data.total;
});
} finally { } finally {
this.loading = false; this.loading = false;
} }
@ -181,31 +179,25 @@ export default {
this.$refs["formRef"].open(id); this.$refs["formRef"].open(id);
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { async handleDelete(row) {
const that = this;
try {
const id = row.id; const id = row.id;
this.$modal.confirm('是否确认删除学生编号为"' + id + '"的数据项?').then(()=>{ await this.$modal.confirm('是否确认删除学生编号为"' + id + '"的数据项?')
return StudentApi.deleteStudent(id); try {
}).then(() => { await StudentApi.deleteStudent(id);
that.getList(); await this.getList();
that.$modal.msgSuccess("删除成功"); this.$modal.msgSuccess("删除成功");
}).catch(() => {});
} catch {} } catch {}
}, },
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { async handleExport() {
const that = this; await this.$modal.confirm('是否确认导出所有学生数据项?');
try { try {
this.$modal.confirm('是否确认导出所有学生数据项?').then(() => { this.exportLoading = true;
that.exportLoading = true; const res = await StudentApi.exportStudentExcel(this.queryParams);
return StudentApi.exportStudentExcel(params); this.$download.excel(res.data, '学生.xls');
}).then(response => {
that.$download.excel(response, '学生.xls');
});
} catch { } catch {
} finally { } finally {
that.exportLoading = false; this.exportLoading = false;
} }
}, },
} }

View File

@ -8,10 +8,10 @@
</el-form-item> </el-form-item>
<el-form-item label="父编号" prop="parentId"> <el-form-item label="父编号" prop="parentId">
<TreeSelect <TreeSelect
v-model="formData.parentId" v-model="formData.parentId"
:options="categoryTree" :options="categoryTree"
:normalizer="normalizer" :normalizer="normalizer"
placeholder="请选择父编号" placeholder="请选择父编号"
/> />
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -24,7 +24,7 @@
</template> </template>
<script> <script>
import * as CategoryApi from '@/api/infra/demo' import * as CategoryApi from '@/api/infra/demo';
import TreeSelect from "@riophae/vue-treeselect"; import TreeSelect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css"; import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default { export default {
@ -56,71 +56,54 @@
}, },
methods: { methods: {
/** 打开弹窗 */ /** 打开弹窗 */
open(id) { async open(id) {
this.dialogVisible = true; this.dialogVisible = true;
this.reset(); this.reset();
const that = this;
// 修改时,设置数据 // 修改时,设置数据
if (id) { if (id) {
this.formLoading = true; this.formLoading = true;
try { try {
CategoryApi.getCategory(id).then(res=>{ const res = await CategoryApi.getCategory(id);
that.formData = res.data; this.formData = res.data;
that.title = "修改分类"; this.title = "修改分类";
})
} finally { } finally {
this.formLoading = false; this.formLoading = false;
} }
} }
this.title = "新增分类"; this.title = "新增分类";
this.getCategoryTree(); await this.getCategoryTree();
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm() { async submitForm() {
this.formLoading = true; // 校验主表
await this.$refs["formRef"].validate();
this.formLoading = true;
try { try {
const that = this; const data = this.formData;
let data = this.formData; // 修改的提交
let validate = false;
// 校验主表
this.getRef("formRef").validate(valid => {
validate = valid;
});
// 所有表单校验通过后方可提交
if (!validate) {
return;
}
// 修改的提交
if (data.id) { if (data.id) {
CategoryApi.updateCategory(data).then(response => { await CategoryApi.updateCategory(data);
that.$modal.msgSuccess("修改成功"); this.$modal.msgSuccess("修改成功");
that.dialogVisible = false; this.dialogVisible = false;
that.$emit('success'); this.$emit('success');
});
return; return;
} }
// 添加的提交 // 添加的提交
CategoryApi.createCategory(data).then(response => { await CategoryApi.createCategory(data);
that.$modal.msgSuccess("新增成功"); this.$modal.msgSuccess("新增成功");
that.dialogVisible = false; this.dialogVisible = false;
that.$emit('success'); this.$emit('success');
}); } finally {
}finally {
this.formLoading = false; this.formLoading = false;
} }
},
getRef(refName){
return this.$refs[refName];
}, },
/** 获得分类树 */ /** 获得分类树 */
getCategoryTree() { async getCategoryTree() {
const that = this; this.categoryTree = [];
that.categoryTree = []; const res = await CategoryApi.getCategoryList();
CategoryApi.getCategoryList().then(res=>{ const root = { id: 0, name: '顶级分类', children: [] };
const root = { id: 0, name: '顶级分类', children: [] }; root.children = this.handleTree(res.data, 'id', 'parentId')
root.children = this.handleTree(res.data, 'id', 'parentId') this.categoryTree.push(root)
that.categoryTree.push(root)
});
}, },
/** 转换分类数据结构 */ /** 转换分类数据结构 */
normalizer(node) { normalizer(node) {
@ -141,7 +124,7 @@
parentId: undefined, parentId: undefined,
}; };
this.resetForm("formRef"); this.resetForm("formRef");
}, }
} }
}; };
</script> </script>

View File

@ -1,6 +1,5 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="名字" prop="name"> <el-form-item label="名字" prop="name">
@ -31,14 +30,14 @@
</el-row> </el-row>
<el-table <el-table
v-loading="loading" v-loading="loading"
:data="list" :data="list"
:stripe="true" :stripe="true"
:show-overflow-tooltip="true" :show-overflow-tooltip="true"
v-if="refreshTable" v-if="refreshTable"
row-key="id" row-key="id"
:default-expand-all="isExpandAll" :default-expand-all="isExpandAll"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}" :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
> >
<el-table-column label="编号" align="center" prop="id"> <el-table-column label="编号" align="center" prop="id">
<template v-slot="scope"> <template v-slot="scope">
@ -104,12 +103,11 @@ export default {
}, },
methods: { methods: {
/** 查询列表 */ /** 查询列表 */
getList() { async getList() {
try { try {
this.loading = true; this.loading = true;
CategoryApi.getCategoryList(this.queryParams).then(response => { const res = await CategoryApi.getCategoryList(this.queryParams);
this.list = this.handleTree(response.data, 'id', 'parentId'); this.list = this.handleTree(res.data, 'id', 'parentId');
})
} finally { } finally {
this.loading = false; this.loading = false;
} }
@ -129,31 +127,25 @@ export default {
this.$refs["formRef"].open(id); this.$refs["formRef"].open(id);
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { async handleDelete(row) {
const that = this;
try {
const id = row.id; const id = row.id;
this.$modal.confirm('是否确认删除分类编号为"' + id + '"的数据项?').then(()=>{ await this.$modal.confirm('是否确认删除分类编号为"' + id + '"的数据项?')
return CategoryApi.deleteCategory(id); try {
}).then(() => { await CategoryApi.deleteCategory(id);
that.getList(); await this.getList();
that.$modal.msgSuccess("删除成功"); this.$modal.msgSuccess("删除成功");
}).catch(() => {});
} catch {} } catch {}
}, },
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { async handleExport() {
const that = this; await this.$modal.confirm('是否确认导出所有分类数据项?');
try { try {
this.$modal.confirm('是否确认导出所有分类数据项?').then(() => { this.exportLoading = true;
that.exportLoading = true; const res = await CategoryApi.exportCategoryExcel(this.queryParams);
return CategoryApi.exportCategoryExcel(params); this.$download.excel(res.data, '分类.xls');
}).then(response => {
that.$download.excel(response, '分类.xls');
});
} catch { } catch {
} finally { } finally {
that.exportLoading = false; this.exportLoading = false;
} }
}, },
/** 展开/折叠操作 */ /** 展开/折叠操作 */