mirror of
https://gitee.com/orangeform/orange-admin.git
synced 2026-01-18 11:06:36 +08:00
commit：修改微服务工程目录名称
This commit is contained in:
Jerry
288
orange-demo-multi-web/src/views/generated/formClass/index.vue
Normal file
288
orange-demo-multi-web/src/views/generated/formClass/index.vue
Normal file
@@ -0,0 +1,288 @@
|
||||
<template>
|
||||
<div style="position: relative;">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="所属校区">
|
||||
<el-select class="filter-item" v-model="formClass.formFilter.schoolId" :clearable="true" filterable
|
||||
placeholder="所属校区" :loading="formClass.schoolId.impl.loading"
|
||||
@visible-change="formClass.schoolId.impl.onVisibleChange"
|
||||
@change="onSchoolIdValueChange">
|
||||
<el-option v-for="item in formClass.schoolId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="班级级别">
|
||||
<el-select class="filter-item" v-model="formClass.formFilter.classLevel" :clearable="true" filterable
|
||||
placeholder="班级级别" :loading="formClass.classLevel.impl.loading"
|
||||
@visible-change="formClass.classLevel.impl.onVisibleChange"
|
||||
@change="onClassLevelValueChange">
|
||||
<el-option v-for="item in formClass.classLevel.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="班级名称">
|
||||
<el-input class="filter-item" v-model="formClass.formFilter.className"
|
||||
:clearable="true" placeholder="班级名称" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormClass(true)">查询</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formClass:formClass:formCreateClass')"
|
||||
@click="onFormCreateClassClick()">
|
||||
新建
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formClass.Class.impl.dataList" size="mini" @sort-change="formClass.Class.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="55px" :index="formClass.Class.impl.getTableIndex" />
|
||||
<el-table-column label="班级名称" prop="className">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属校区" prop="schoolIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="班级级别" prop="classLevelDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="已完成课时" prop="finishClassHour">
|
||||
</el-table-column>
|
||||
<el-table-column label="班级创建时间" prop="createTime">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right" min-width="150px">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onFormEditClassClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formClass:formClass:formEditClass')">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button @click="onFormClassStudentClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formClass:formClass:formClassStudent')">
|
||||
学生
|
||||
</el-button>
|
||||
<el-button @click="onFormClassCourseClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formClass:formClass:formClassCourse')">
|
||||
课程
|
||||
</el-button>
|
||||
<el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formClass:formClass:delete')">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formClass.Class.impl.totalCount"
|
||||
:current-page="formClass.Class.impl.currentPage"
|
||||
:page-size="formClass.Class.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formClass.Class.impl.onCurrentPageChange"
|
||||
@size-change="formClass.Class.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { StudentClassController, DictionaryController } from '@/api';
|
||||
import formEditClass from '@/views/generated/formEditClass';
|
||||
import formCreateClass from '@/views/generated/formCreateClass';
|
||||
|
||||
export default {
|
||||
name: 'formClass',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formClass: {
|
||||
formFilter: {
|
||||
schoolId: undefined,
|
||||
classLevel: undefined,
|
||||
className: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
schoolId: undefined,
|
||||
classLevel: undefined,
|
||||
className: undefined
|
||||
},
|
||||
schoolId: {
|
||||
impl: new DropdownWidget(this.loadSchoolIdDropdownList)
|
||||
},
|
||||
classLevel: {
|
||||
impl: new DropdownWidget(this.loadClassLevelDropdownList)
|
||||
},
|
||||
Class: {
|
||||
impl: new TableWidget(this.loadClassData, this.loadClassVerify, true, 'createTime', 1)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 班级数据数据获取函数，返回Primise
|
||||
*/
|
||||
loadClassData (params) {
|
||||
if (params == null) params = {};
|
||||
params = {
|
||||
...params,
|
||||
studentClassFilter: {
|
||||
className: this.formClass.formFilterCopy.className,
|
||||
schoolId: this.formClass.formFilterCopy.schoolId,
|
||||
classLevel: this.formClass.formFilterCopy.classLevel
|
||||
}
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
StudentClassController.list(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 班级数据数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadClassVerify () {
|
||||
this.formClass.formFilterCopy.className = this.formClass.formFilter.className;
|
||||
this.formClass.formFilterCopy.schoolId = this.formClass.formFilter.schoolId;
|
||||
this.formClass.formFilterCopy.classLevel = this.formClass.formFilter.classLevel;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 所属校区下拉数据获取函数
|
||||
*/
|
||||
loadSchoolIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictSchoolInfo(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属校区选中值改变
|
||||
*/
|
||||
onSchoolIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 班级级别下拉数据获取函数
|
||||
*/
|
||||
loadClassLevelDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictClassLevel(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 班级级别选中值改变
|
||||
*/
|
||||
onClassLevelValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新班级管理
|
||||
*/
|
||||
refreshFormClass (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.formClass.Class.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formClass.Class.impl.refreshTable();
|
||||
}
|
||||
if (!this.formClass.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formClass.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 新建
|
||||
*/
|
||||
onFormCreateClassClick () {
|
||||
let params = {};
|
||||
|
||||
this.$dialog.show('新建', formCreateClass, {
|
||||
area: ['800px']
|
||||
}, params).then(res => {
|
||||
this.refreshFormClass();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 编辑
|
||||
*/
|
||||
onFormEditClassClick (row) {
|
||||
let params = {
|
||||
classId: row.classId
|
||||
};
|
||||
|
||||
this.$dialog.show('编辑', formEditClass, {
|
||||
area: ['800px']
|
||||
}, params).then(res => {
|
||||
this.formClass.Class.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 学生
|
||||
*/
|
||||
onFormClassStudentClick (row) {
|
||||
let params = {
|
||||
classId: row.classId
|
||||
};
|
||||
|
||||
params.closeVisible = 1;
|
||||
this.$router.push({name: 'formClassStudent', query: params});
|
||||
},
|
||||
/**
|
||||
* 课程
|
||||
*/
|
||||
onFormClassCourseClick (row) {
|
||||
let params = {
|
||||
classId: row.classId
|
||||
};
|
||||
|
||||
params.closeVisible = 1;
|
||||
this.$router.push({name: 'formClassCourse', query: params});
|
||||
},
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
onDeleteClick (row) {
|
||||
let params = {
|
||||
classId: row.classId
|
||||
};
|
||||
|
||||
this.$confirm('是否删除此班级？').then(res => {
|
||||
StudentClassController.delete(this, params).then(res => {
|
||||
this.$message.success('删除成功');
|
||||
this.formClass.Class.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormClass();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormClass();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,185 @@
|
||||
<template>
|
||||
<div style="position: relative;">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formClassCourse:formClassCourse:formSetClassCourse')"
|
||||
@click="onFormSetClassCourseClick()">
|
||||
设置班级课程
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formClassCourse.Course.impl.dataList" size="mini" @sort-change="formClassCourse.Course.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="55px" :index="formClassCourse.Course.impl.getTableIndex" />
|
||||
<el-table-column label="课程名称" prop="courseName">
|
||||
</el-table-column>
|
||||
<el-table-column label="课程难度" prop="difficultyDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属年级" prop="gradeIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属学科" prop="subjectIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="课时数量" prop="classHour">
|
||||
</el-table-column>
|
||||
<el-table-column label="课程图片" min-width="180px">
|
||||
<template slot-scope="scope">
|
||||
<el-image v-for="item in parseUploadData(scope.row.pictureUrl, {courseId: scope.row.courseId, fieldName: 'pictureUrl', asImage: true})"
|
||||
:preview-src-list="getPictureList(scope.row.pictureUrl, {courseId: scope.row.courseId, fieldName: 'pictureUrl', asImage: true})"
|
||||
class="table-cell-image" :key="item.url" :src="item.url" fit="fill">
|
||||
<div slot="error" class="table-cell-image">
|
||||
<i class="el-icon-picture-outline"></i>
|
||||
</div>
|
||||
</el-image>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onDeleteClassCourseClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formClassCourse:formClassCourse:deleteClassCourse')">
|
||||
移除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formClassCourse.Course.impl.totalCount"
|
||||
:current-page="formClassCourse.Course.impl.currentPage"
|
||||
:page-size="formClassCourse.Course.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formClassCourse.Course.impl.onCurrentPageChange"
|
||||
@size-change="formClassCourse.Course.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<label v-if="closeVisible == '1'" class="page-close-box">
|
||||
<el-button type="text" @click="onCancel(true)" icon="el-icon-close" />
|
||||
</label>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { StudentClassController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formClassCourse',
|
||||
props: {
|
||||
classId: {
|
||||
default: undefined
|
||||
},
|
||||
closeVisible: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin],
|
||||
data () {
|
||||
return {
|
||||
formClassCourse: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
Course: {
|
||||
impl: new TableWidget(this.loadCourseData, this.loadCourseVerify, true)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
this.removeCachePage(this.$options.name);
|
||||
this.refreshParentCachedPage = isSuccess;
|
||||
this.$router.go(-1);
|
||||
},
|
||||
/**
|
||||
* 班级课程数据获取函数，返回Primise
|
||||
*/
|
||||
loadCourseData (params) {
|
||||
if (params == null) params = {};
|
||||
params = {
|
||||
...params,
|
||||
classId: this.classId
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
StudentClassController.listClassCourse(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 班级课程数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadCourseVerify () {
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 更新班级课程
|
||||
*/
|
||||
refreshFormClassCourse (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.formClassCourse.Course.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formClassCourse.Course.impl.refreshTable();
|
||||
}
|
||||
if (!this.formClassCourse.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formClassCourse.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 设置班级课程
|
||||
*/
|
||||
onFormSetClassCourseClick () {
|
||||
let params = {
|
||||
classId: this.classId
|
||||
};
|
||||
|
||||
params.closeVisible = 1;
|
||||
this.$router.push({name: 'formSetClassCourse', query: params});
|
||||
},
|
||||
/**
|
||||
* 移除
|
||||
*/
|
||||
onDeleteClassCourseClick (row) {
|
||||
let params = {
|
||||
classId: this.classId,
|
||||
courseId: row.courseId
|
||||
};
|
||||
|
||||
this.$confirm('是否从班级中移除此课程？').then(res => {
|
||||
StudentClassController.deleteClassCourse(this, params).then(res => {
|
||||
this.$message.success('移除成功');
|
||||
this.formClassCourse.Course.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormClassCourse();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormClassCourse();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,179 @@
|
||||
<template>
|
||||
<div style="position: relative;">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formClassStudent:formClassStudent:formSetClassStudent')"
|
||||
@click="onFormSetClassStudentClick()">
|
||||
设置班级学生
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formClassStudent.Student.impl.dataList" size="mini" @sort-change="formClassStudent.Student.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="55px" :index="formClassStudent.Student.impl.getTableIndex" />
|
||||
<el-table-column label="姓名" prop="studentName">
|
||||
</el-table-column>
|
||||
<el-table-column label="手机号码" prop="loginMobile">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属校区" prop="schoolIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="年级" prop="gradeIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="经验等级" prop="experienceLevelDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="注册时间" prop="registerTime">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.registerTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onDeleteClassStudentClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formClassStudent:formClassStudent:deleteClassStudent')">
|
||||
移除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formClassStudent.Student.impl.totalCount"
|
||||
:current-page="formClassStudent.Student.impl.currentPage"
|
||||
:page-size="formClassStudent.Student.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formClassStudent.Student.impl.onCurrentPageChange"
|
||||
@size-change="formClassStudent.Student.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<label v-if="closeVisible == '1'" class="page-close-box">
|
||||
<el-button type="text" @click="onCancel(true)" icon="el-icon-close" />
|
||||
</label>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { StudentClassController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formClassStudent',
|
||||
props: {
|
||||
classId: {
|
||||
default: undefined
|
||||
},
|
||||
closeVisible: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin],
|
||||
data () {
|
||||
return {
|
||||
formClassStudent: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
Student: {
|
||||
impl: new TableWidget(this.loadStudentData, this.loadStudentVerify, true)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
this.removeCachePage(this.$options.name);
|
||||
this.refreshParentCachedPage = isSuccess;
|
||||
this.$router.go(-1);
|
||||
},
|
||||
/**
|
||||
* 班级学生数据获取函数，返回Primise
|
||||
*/
|
||||
loadStudentData (params) {
|
||||
if (params == null) params = {};
|
||||
params = {
|
||||
...params,
|
||||
classId: this.classId
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
StudentClassController.listClassStudent(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 班级学生数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadStudentVerify () {
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 更新班级学生
|
||||
*/
|
||||
refreshFormClassStudent (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.formClassStudent.Student.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formClassStudent.Student.impl.refreshTable();
|
||||
}
|
||||
if (!this.formClassStudent.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formClassStudent.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 设置班级学生
|
||||
*/
|
||||
onFormSetClassStudentClick () {
|
||||
let params = {
|
||||
classId: this.classId
|
||||
};
|
||||
|
||||
params.closeVisible = 1;
|
||||
this.$router.push({name: 'formSetClassStudent', query: params});
|
||||
},
|
||||
/**
|
||||
* 移除
|
||||
*/
|
||||
onDeleteClassStudentClick (row) {
|
||||
let params = {
|
||||
classId: this.classId,
|
||||
studentId: row.studentId
|
||||
};
|
||||
|
||||
this.$confirm('是否从班级中移除此学生？').then(res => {
|
||||
StudentClassController.deleteClassStudent(this, params).then(res => {
|
||||
this.$message.success('移除成功');
|
||||
this.formClassStudent.Student.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormClassStudent();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormClassStudent();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
306
orange-demo-multi-web/src/views/generated/formCourse/index.vue
Normal file
306
orange-demo-multi-web/src/views/generated/formCourse/index.vue
Normal file
@@ -0,0 +1,306 @@
|
||||
<template>
|
||||
<div style="position: relative;">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="所属年级">
|
||||
<el-select class="filter-item" v-model="formCourse.formFilter.gradeId" :clearable="true" filterable
|
||||
placeholder="所属年级" :loading="formCourse.gradeId.impl.loading"
|
||||
@visible-change="formCourse.gradeId.impl.onVisibleChange"
|
||||
@change="onGradeIdValueChange">
|
||||
<el-option v-for="item in formCourse.gradeId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属学科">
|
||||
<el-select class="filter-item" v-model="formCourse.formFilter.subjectId" :clearable="true" filterable
|
||||
placeholder="所属学科" :loading="formCourse.subjectId.impl.loading"
|
||||
@visible-change="formCourse.subjectId.impl.onVisibleChange"
|
||||
@change="onSubjectIdValueChange">
|
||||
<el-option v-for="item in formCourse.subjectId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="课程难度">
|
||||
<el-select class="filter-item" v-model="formCourse.formFilter.difficulty" :clearable="true" filterable
|
||||
placeholder="课程难度" :loading="formCourse.difficulty.impl.loading"
|
||||
@visible-change="formCourse.difficulty.impl.onVisibleChange"
|
||||
@change="onDifficultyValueChange">
|
||||
<el-option v-for="item in formCourse.difficulty.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="课程名称">
|
||||
<el-input class="filter-item" v-model="formCourse.formFilter.courseName"
|
||||
:clearable="true" placeholder="课程名称" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormCourse(true)">查询</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formCourse:formCourse:formCreateCourse')"
|
||||
@click="onFormCreateCourseClick()">
|
||||
新建
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formCourse.Course.impl.dataList" size="mini" @sort-change="formCourse.Course.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="55px" :index="formCourse.Course.impl.getTableIndex" />
|
||||
<el-table-column label="课程名称" prop="courseName">
|
||||
</el-table-column>
|
||||
<el-table-column label="课程难度" prop="difficultyDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属年级" prop="gradeIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属学科" prop="subjectIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="课时数量" prop="classHour">
|
||||
</el-table-column>
|
||||
<el-table-column label="课程价格" prop="price" sortable="custom">
|
||||
</el-table-column>
|
||||
<el-table-column label="课程图片" min-width="180px">
|
||||
<template slot-scope="scope">
|
||||
<el-image v-for="item in parseUploadData(scope.row.pictureUrl, {courseId: scope.row.courseId, fieldName: 'pictureUrl', asImage: true})"
|
||||
:preview-src-list="getPictureList(scope.row.pictureUrl, {courseId: scope.row.courseId, fieldName: 'pictureUrl', asImage: true})"
|
||||
class="table-cell-image" :key="item.url" :src="item.url" fit="fill">
|
||||
<div slot="error" class="table-cell-image">
|
||||
<i class="el-icon-picture-outline"></i>
|
||||
</div>
|
||||
</el-image>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" prop="createTime">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onFormEditCourseClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formCourse:formCourse:formEditCourse')">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formCourse:formCourse:delete')">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formCourse.Course.impl.totalCount"
|
||||
:current-page="formCourse.Course.impl.currentPage"
|
||||
:page-size="formCourse.Course.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formCourse.Course.impl.onCurrentPageChange"
|
||||
@size-change="formCourse.Course.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { CourseController, DictionaryController } from '@/api';
|
||||
import formCreateCourse from '@/views/generated/formCreateCourse';
|
||||
import formEditCourse from '@/views/generated/formEditCourse';
|
||||
|
||||
export default {
|
||||
name: 'formCourse',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formCourse: {
|
||||
formFilter: {
|
||||
gradeId: undefined,
|
||||
subjectId: undefined,
|
||||
difficulty: undefined,
|
||||
courseName: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
gradeId: undefined,
|
||||
subjectId: undefined,
|
||||
difficulty: undefined,
|
||||
courseName: undefined
|
||||
},
|
||||
gradeId: {
|
||||
impl: new DropdownWidget(this.loadGradeIdDropdownList)
|
||||
},
|
||||
subjectId: {
|
||||
impl: new DropdownWidget(this.loadSubjectIdDropdownList)
|
||||
},
|
||||
difficulty: {
|
||||
impl: new DropdownWidget(this.loadDifficultyDropdownList)
|
||||
},
|
||||
Course: {
|
||||
impl: new TableWidget(this.loadCourseData, this.loadCourseVerify, true, 'createTime', 1)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 课程数据数据获取函数，返回Primise
|
||||
*/
|
||||
loadCourseData (params) {
|
||||
if (params == null) params = {};
|
||||
params = {
|
||||
...params,
|
||||
courseFilter: {
|
||||
courseName: this.formCourse.formFilterCopy.courseName,
|
||||
difficulty: this.formCourse.formFilterCopy.difficulty,
|
||||
gradeId: this.formCourse.formFilterCopy.gradeId,
|
||||
subjectId: this.formCourse.formFilterCopy.subjectId
|
||||
}
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
CourseController.list(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 课程数据数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadCourseVerify () {
|
||||
this.formCourse.formFilterCopy.courseName = this.formCourse.formFilter.courseName;
|
||||
this.formCourse.formFilterCopy.difficulty = this.formCourse.formFilter.difficulty;
|
||||
this.formCourse.formFilterCopy.gradeId = this.formCourse.formFilter.gradeId;
|
||||
this.formCourse.formFilterCopy.subjectId = this.formCourse.formFilter.subjectId;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 所属年级下拉数据获取函数
|
||||
*/
|
||||
loadGradeIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictGrade(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属年级选中值改变
|
||||
*/
|
||||
onGradeIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所属学科下拉数据获取函数
|
||||
*/
|
||||
loadSubjectIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictSubject(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属学科选中值改变
|
||||
*/
|
||||
onSubjectIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 课程难度下拉数据获取函数
|
||||
*/
|
||||
loadDifficultyDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictCourseDifficult(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 课程难度选中值改变
|
||||
*/
|
||||
onDifficultyValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新课程管理
|
||||
*/
|
||||
refreshFormCourse (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.formCourse.Course.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formCourse.Course.impl.refreshTable();
|
||||
}
|
||||
if (!this.formCourse.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formCourse.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 新建
|
||||
*/
|
||||
onFormCreateCourseClick () {
|
||||
let params = {};
|
||||
|
||||
this.$dialog.show('新建', formCreateCourse, {
|
||||
area: ['800px']
|
||||
}, params).then(res => {
|
||||
this.refreshFormCourse();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 编辑
|
||||
*/
|
||||
onFormEditCourseClick (row) {
|
||||
let params = {
|
||||
courseId: row.courseId
|
||||
};
|
||||
|
||||
this.$dialog.show('编辑', formEditCourse, {
|
||||
area: ['800px']
|
||||
}, params).then(res => {
|
||||
this.formCourse.Course.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
onDeleteClick (row) {
|
||||
let params = {
|
||||
courseId: row.courseId
|
||||
};
|
||||
|
||||
this.$confirm('是否删除此课程？').then(res => {
|
||||
CourseController.delete(this, params).then(res => {
|
||||
this.$message.success('删除成功');
|
||||
this.formCourse.Course.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormCourse();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormCourse();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,312 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="统计日期">
|
||||
<date-range class="filter-item" v-model="formCourseStats.formFilter.statsDate" :clearable="true" :allowTypes="['day']" align="left"
|
||||
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
|
||||
format="yyyy-MM-dd" value-format="yyyy-MM-dd hh:mm:ss" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormCourseStats(true)">查询</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-form ref="formCourseStats" :model="formData" class="full-width-input" style="width: 100%;"
|
||||
label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col class="table-box" :span="12">
|
||||
<el-card class="base-card mb20" style="height: 350px" shadow="never" :body-style="{padding: '0px'}">
|
||||
<div slot="header" class="base-card-header">
|
||||
<span>课程统计（年级）</span>
|
||||
<div class="base-card-operation">
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-chart" style="height: calc(350px - 50px);">
|
||||
<ve-pie class="chart-border" height="100%"
|
||||
:extend="formCourseStats.courseStatsByGradeId.chartOption"
|
||||
:data="formCourseStats.courseStatsByGradeId.impl.chartData"
|
||||
:settings="formCourseStats.courseStatsByGradeId.chartSetting"
|
||||
:loading="formCourseStats.courseStatsByGradeId.impl.loading"
|
||||
:data-empty="formCourseStats.courseStatsByGradeId.impl.dataEmpty"
|
||||
:after-set-option-once="onCourseStatsByGradeIdOptionSet" />
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col class="table-box" :span="12">
|
||||
<el-card class="base-card mb20" style="height: 350px" shadow="never" :body-style="{padding: '0px'}">
|
||||
<div slot="header" class="base-card-header">
|
||||
<span>课程统计（学科）</span>
|
||||
<div class="base-card-operation">
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-chart" style="height: calc(350px - 50px);">
|
||||
<ve-pie class="chart-border" height="100%"
|
||||
:extend="formCourseStats.courseStatsBySubject.chartOption"
|
||||
:data="formCourseStats.courseStatsBySubject.impl.chartData"
|
||||
:settings="formCourseStats.courseStatsBySubject.chartSetting"
|
||||
:loading="formCourseStats.courseStatsBySubject.impl.loading"
|
||||
:data-empty="formCourseStats.courseStatsBySubject.impl.dataEmpty"
|
||||
:after-set-option-once="onCourseStatsBySubjectOptionSet" />
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col class="table-box" :span="24">
|
||||
<el-card class="base-card" style="height: 350px" shadow="never" :body-style="{padding: '0px'}">
|
||||
<div slot="header" class="base-card-header">
|
||||
<span>课程流水统计</span>
|
||||
<div class="base-card-operation">
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-chart" style="height: calc(350px - 50px);">
|
||||
<ve-histogram class="chart-border" height="100%"
|
||||
:extend="formCourseStats.CourseTransStats.chartOption"
|
||||
:data="formCourseStats.CourseTransStats.impl.chartData"
|
||||
:settings="formCourseStats.CourseTransStats.chartSetting"
|
||||
:loading="formCourseStats.CourseTransStats.impl.loading"
|
||||
:data-empty="formCourseStats.CourseTransStats.impl.dataEmpty"
|
||||
:after-set-option-once="onCourseTransStatsOptionSet"/>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { defaultLineChartOption, defaultBarChartOption, defaultPieChartOption } from '@/utils/chartOption.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { CourseTransStatsController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formCourseStats',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
CourseTransStats: {
|
||||
statsId: undefined,
|
||||
statsDate: undefined,
|
||||
subjectId: undefined,
|
||||
gradeId: undefined,
|
||||
gradeName: undefined,
|
||||
courseId: undefined,
|
||||
courseName: undefined,
|
||||
studentAttendCount: undefined,
|
||||
studentFlowerAmount: undefined,
|
||||
studentFlowerCount: undefined,
|
||||
isDatasourceInit: false
|
||||
}
|
||||
},
|
||||
formCourseStats: {
|
||||
formFilter: {
|
||||
statsDate: []
|
||||
},
|
||||
formFilterCopy: {
|
||||
statsDate: []
|
||||
},
|
||||
courseStatsByGradeId: {
|
||||
impl: new ChartWidget(this.loadCourseStatsByGradeIdData, this.loadCourseStatsByGradeIdVerify,
|
||||
['gradeIdShowName', 'studentFlowerAmount']),
|
||||
chartOption: defaultPieChartOption,
|
||||
chartSetting: {
|
||||
radius: 80,
|
||||
dimension: 'gradeIdShowName',
|
||||
metrics: 'studentFlowerAmount',
|
||||
labelMap: {
|
||||
'studentFlowerAmount': '献花数量'
|
||||
}
|
||||
}
|
||||
},
|
||||
courseStatsBySubject: {
|
||||
impl: new ChartWidget(this.loadCourseStatsBySubjectData, this.loadCourseStatsBySubjectVerify,
|
||||
['subjectIdShowName', 'studentFlowerAmount']),
|
||||
chartOption: defaultPieChartOption,
|
||||
chartSetting: {
|
||||
radius: 80,
|
||||
dimension: 'subjectIdShowName',
|
||||
metrics: 'studentFlowerAmount',
|
||||
labelMap: {
|
||||
'studentFlowerAmount': '献花数量'
|
||||
}
|
||||
}
|
||||
},
|
||||
CourseTransStats: {
|
||||
impl: new ChartWidget(this.loadCourseTransStatsData, this.loadCourseTransStatsVerify,
|
||||
['statsDateShowName', 'studentAttendCount', 'studentFlowerAmount', 'studentFlowerCount']),
|
||||
chartOption: defaultBarChartOption,
|
||||
chartSetting: {
|
||||
dimension: ['statsDateShowName'],
|
||||
metrics: ['studentAttendCount', 'studentFlowerAmount', 'studentFlowerCount'],
|
||||
labelMap: {
|
||||
'studentAttendCount': '上课次数',
|
||||
'studentFlowerAmount': '献花数量',
|
||||
'studentFlowerCount': '献花次数'
|
||||
}
|
||||
}
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 课程统计（年级）数据获取函数，返回Primise
|
||||
*/
|
||||
loadCourseStatsByGradeIdData () {
|
||||
let params = {
|
||||
groupParam: [
|
||||
{
|
||||
fieldName: 'gradeId'
|
||||
}
|
||||
],
|
||||
courseTransStatsFilter: {
|
||||
statsDateStart: Array.isArray(this.formCourseStats.formFilterCopy.statsDate) ? this.formCourseStats.formFilterCopy.statsDate[0] : undefined,
|
||||
statsDateEnd: Array.isArray(this.formCourseStats.formFilterCopy.statsDate) ? this.formCourseStats.formFilterCopy.statsDate[1] : undefined
|
||||
}
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
CourseTransStatsController.listWithGroup(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList.map((item) => {
|
||||
return {...item, gradeIdShowName: item.gradeIdDictMap.name};
|
||||
}),
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 课程统计（年级）数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadCourseStatsByGradeIdVerify () {
|
||||
this.formCourseStats.formFilterCopy.statsDate = this.formCourseStats.formFilter.statsDate;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 获取课程统计（年级）的echarts实例
|
||||
*/
|
||||
onCourseStatsByGradeIdOptionSet (echarts) {
|
||||
echarts.resize();
|
||||
this.formCourseStats.courseStatsByGradeId.impl.chartObject = echarts;
|
||||
},
|
||||
/**
|
||||
* 课程统计（学科）数据获取函数，返回Primise
|
||||
*/
|
||||
loadCourseStatsBySubjectData () {
|
||||
let params = {
|
||||
groupParam: [
|
||||
{
|
||||
fieldName: 'subjectId'
|
||||
}
|
||||
],
|
||||
courseTransStatsFilter: {
|
||||
statsDateStart: Array.isArray(this.formCourseStats.formFilterCopy.statsDate) ? this.formCourseStats.formFilterCopy.statsDate[0] : undefined,
|
||||
statsDateEnd: Array.isArray(this.formCourseStats.formFilterCopy.statsDate) ? this.formCourseStats.formFilterCopy.statsDate[1] : undefined
|
||||
}
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
CourseTransStatsController.listWithGroup(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList.map((item) => {
|
||||
return {...item, subjectIdShowName: item.subjectIdDictMap.name};
|
||||
}),
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 课程统计（学科）数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadCourseStatsBySubjectVerify () {
|
||||
this.formCourseStats.formFilterCopy.statsDate = this.formCourseStats.formFilter.statsDate;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 获取课程统计（学科）的echarts实例
|
||||
*/
|
||||
onCourseStatsBySubjectOptionSet (echarts) {
|
||||
echarts.resize();
|
||||
this.formCourseStats.courseStatsBySubject.impl.chartObject = echarts;
|
||||
},
|
||||
/**
|
||||
* 课程流水统计数据获取函数，返回Primise
|
||||
*/
|
||||
loadCourseTransStatsData () {
|
||||
let params = {
|
||||
groupParam: [
|
||||
{
|
||||
fieldName: 'statsDate'
|
||||
}
|
||||
],
|
||||
courseTransStatsFilter: {
|
||||
statsDateStart: Array.isArray(this.formCourseStats.formFilterCopy.statsDate) ? this.formCourseStats.formFilterCopy.statsDate[0] : undefined,
|
||||
statsDateEnd: Array.isArray(this.formCourseStats.formFilterCopy.statsDate) ? this.formCourseStats.formFilterCopy.statsDate[1] : undefined
|
||||
}
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
CourseTransStatsController.listWithGroup(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList.map((item) => {
|
||||
return {...item, statsDateShowName: this.formatDateByStatsType(item.statsDate, this.formCourseStats.CourseTransStats.statsType)};
|
||||
}),
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 课程流水统计数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadCourseTransStatsVerify () {
|
||||
this.formCourseStats.formFilterCopy.statsDate = this.formCourseStats.formFilter.statsDate;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 获取课程流水统计的echarts实例
|
||||
*/
|
||||
onCourseTransStatsOptionSet (echarts) {
|
||||
echarts.resize();
|
||||
this.formCourseStats.CourseTransStats.impl.chartObject = echarts;
|
||||
},
|
||||
/**
|
||||
* 更新课程统计
|
||||
*/
|
||||
refreshFormCourseStats (reloadData = false) {
|
||||
this.formCourseStats.courseStatsByGradeId.impl.refreshChart(reloadData);
|
||||
this.formCourseStats.courseStatsBySubject.impl.refreshChart(reloadData);
|
||||
this.formCourseStats.CourseTransStats.impl.refreshChart(reloadData);
|
||||
if (!this.formCourseStats.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formCourseStats.isInit = true;
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormCourseStats(true);
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormCourseStats();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,274 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form ref="formCreateClass" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
|
||||
label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="班级名称" prop="StudentClass.className">
|
||||
<el-input class="input-item" v-model="formData.StudentClass.className"
|
||||
:clearable="true" placeholder="班级名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="班级级别" prop="StudentClass.classLevel">
|
||||
<el-select class="input-item" v-model="formData.StudentClass.classLevel" :clearable="true" filterable
|
||||
placeholder="班级级别" :loading="formCreateClass.classLevel.impl.loading"
|
||||
@visible-change="formCreateClass.classLevel.impl.onVisibleChange"
|
||||
@change="onClassLevelValueChange">
|
||||
<el-option v-for="item in formCreateClass.classLevel.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属校区" prop="StudentClass.schoolId">
|
||||
<el-select class="input-item" v-model="formData.StudentClass.schoolId" :clearable="true" filterable
|
||||
placeholder="所属校区" :loading="formCreateClass.schoolId.impl.loading"
|
||||
@visible-change="formCreateClass.schoolId.impl.onVisibleChange"
|
||||
@change="onSchoolIdValueChange">
|
||||
<el-option v-for="item in formCreateClass.schoolId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="班长" prop="StudentClass.leaderId">
|
||||
<el-select class="input-item" v-model="formData.StudentClass.leaderId" :clearable="true" filterable
|
||||
placeholder="班长" :loading="formCreateClass.leaderId.impl.loading"
|
||||
@visible-change="formCreateClass.leaderId.impl.onVisibleChange"
|
||||
@change="onLeaderIdValueChange">
|
||||
<el-option v-for="item in formCreateClass.leaderId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="已完成课时" prop="StudentClass.finishClassHour">
|
||||
<el-input-number class="input-item" v-model="formData.StudentClass.finishClassHour"
|
||||
:clearable="true" controls-position="right" placeholder="已完成课时" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row class="no-scroll flex-box" type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" :plain="true"
|
||||
@click="onCancel(false)">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" :disabled="!checkPermCodeExist('formCreateClass:formCreateClass:add')"
|
||||
@click="onAddClick()">
|
||||
保存
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { StudentClassController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formCreateClass',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
StudentClass: {
|
||||
classId: undefined,
|
||||
className: undefined,
|
||||
schoolId: undefined,
|
||||
leaderId: undefined,
|
||||
finishClassHour: undefined,
|
||||
classLevel: undefined,
|
||||
createUserId: undefined,
|
||||
createTime: undefined,
|
||||
status: undefined,
|
||||
course: {
|
||||
courseId: undefined,
|
||||
courseName: undefined,
|
||||
price: undefined,
|
||||
description: undefined,
|
||||
difficulty: undefined,
|
||||
gradeId: undefined,
|
||||
subjectId: undefined,
|
||||
classHour: undefined,
|
||||
pictureUrl: undefined,
|
||||
createUserId: undefined,
|
||||
createTime: undefined,
|
||||
updateTime: undefined
|
||||
},
|
||||
student: {
|
||||
studentId: undefined,
|
||||
loginMobile: undefined,
|
||||
studentName: undefined,
|
||||
provinceId: undefined,
|
||||
cityId: undefined,
|
||||
districtId: undefined,
|
||||
gender: undefined,
|
||||
birthday: undefined,
|
||||
experienceLevel: undefined,
|
||||
totalCoin: undefined,
|
||||
leftCoin: undefined,
|
||||
gradeId: undefined,
|
||||
schoolId: undefined,
|
||||
registerTime: undefined,
|
||||
status: undefined
|
||||
},
|
||||
isDatasourceInit: false
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
'StudentClass.className': [
|
||||
{required: true, message: '请输入班级名称', trigger: 'blur'}
|
||||
],
|
||||
'StudentClass.classLevel': [
|
||||
{required: true, message: '请输入班级级别', trigger: 'blur'}
|
||||
],
|
||||
'StudentClass.schoolId': [
|
||||
{required: true, message: '请输入所属校区', trigger: 'blur'}
|
||||
],
|
||||
'StudentClass.leaderId': [
|
||||
{required: true, message: '请输入班长', trigger: 'blur'}
|
||||
],
|
||||
'StudentClass.finishClassHour': [
|
||||
{required: true, message: '请输入已完成课时', trigger: 'blur'},
|
||||
{type: 'integer', message: '已完成课时只允许输入整数', trigger: 'blur', transform: (value) => Number(value)},
|
||||
{type: 'number', min: 0, max: 9999, message: '已完成课时必须在0 - 9999之间', trigger: 'blur', transform: (value) => Number(value)}
|
||||
]
|
||||
},
|
||||
formCreateClass: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
classLevel: {
|
||||
impl: new DropdownWidget(this.loadClassLevelDropdownList)
|
||||
},
|
||||
schoolId: {
|
||||
impl: new DropdownWidget(this.loadSchoolIdDropdownList)
|
||||
},
|
||||
leaderId: {
|
||||
impl: new DropdownWidget(this.loadLeaderIdDropdownList)
|
||||
},
|
||||
menuBlock: {
|
||||
isInit: false
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 班级级别下拉数据获取函数
|
||||
*/
|
||||
loadClassLevelDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictClassLevel(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 班级级别选中值改变
|
||||
*/
|
||||
onClassLevelValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所属校区下拉数据获取函数
|
||||
*/
|
||||
loadSchoolIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictSchoolInfo(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属校区选中值改变
|
||||
*/
|
||||
onSchoolIdValueChange (value) {
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formData.StudentClass.leaderId = undefined;
|
||||
this.formCreateClass.leaderId.impl.dirty = true;
|
||||
this.onLeaderIdValueChange(this.formData.StudentClass.leaderId);
|
||||
},
|
||||
/**
|
||||
* 班长下拉数据获取函数
|
||||
*/
|
||||
loadLeaderIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
schoolId: this.formData.StudentClass.schoolId
|
||||
};
|
||||
DictionaryController.dictStudent(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 班长选中值改变
|
||||
*/
|
||||
onLeaderIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新新建班级
|
||||
*/
|
||||
refreshFormCreateClass (reloadData = false) {
|
||||
if (!this.formCreateClass.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formCreateClass.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 保存
|
||||
*/
|
||||
onAddClick () {
|
||||
this.$refs.formCreateClass.validate((valid) => {
|
||||
if (!valid) return;
|
||||
let params = {
|
||||
studentClass: {
|
||||
className: this.formData.StudentClass.className,
|
||||
schoolId: this.formData.StudentClass.schoolId,
|
||||
leaderId: this.formData.StudentClass.leaderId,
|
||||
finishClassHour: this.formData.StudentClass.finishClassHour,
|
||||
classLevel: this.formData.StudentClass.classLevel
|
||||
}
|
||||
};
|
||||
|
||||
StudentClassController.add(this, params).then(res => {
|
||||
this.$message.success('保存成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
});
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormCreateClass();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,308 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form ref="formCreateCourse" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
|
||||
label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="课程名称" prop="Course.courseName">
|
||||
<el-input class="input-item" v-model="formData.Course.courseName"
|
||||
:clearable="true" placeholder="课程名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="课程价格" prop="Course.price">
|
||||
<el-input-number class="input-item" v-model="formData.Course.price"
|
||||
:clearable="true" controls-position="right" placeholder="课程价格" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="课程难度" prop="Course.difficulty">
|
||||
<el-select class="input-item" v-model="formData.Course.difficulty" :clearable="true" filterable
|
||||
placeholder="课程难度" :loading="formCreateCourse.difficulty.impl.loading"
|
||||
@visible-change="formCreateCourse.difficulty.impl.onVisibleChange"
|
||||
@change="onDifficultyValueChange">
|
||||
<el-option v-for="item in formCreateCourse.difficulty.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属年级" prop="Course.gradeId">
|
||||
<el-select class="input-item" v-model="formData.Course.gradeId" :clearable="true" filterable
|
||||
placeholder="所属年级" :loading="formCreateCourse.gradeId.impl.loading"
|
||||
@visible-change="formCreateCourse.gradeId.impl.onVisibleChange"
|
||||
@change="onGradeIdValueChange">
|
||||
<el-option v-for="item in formCreateCourse.gradeId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属学科" prop="Course.subjectId">
|
||||
<el-select class="input-item" v-model="formData.Course.subjectId" :clearable="true" filterable
|
||||
placeholder="所属学科" :loading="formCreateCourse.subjectId.impl.loading"
|
||||
@visible-change="formCreateCourse.subjectId.impl.onVisibleChange"
|
||||
@change="onSubjectIdValueChange">
|
||||
<el-option v-for="item in formCreateCourse.subjectId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="课时数量" prop="Course.classHour">
|
||||
<el-input-number class="input-item" v-model="formData.Course.classHour"
|
||||
:clearable="true" controls-position="right" placeholder="课时数量" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="课程描述" prop="Course.description">
|
||||
<el-input class="input-item" v-model="formData.Course.description"
|
||||
:clearable="true" placeholder="课程描述" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="课程图片" prop="Course.pictureUrl">
|
||||
<el-upload class="upload-image-item upload-image-multi" name="uploadFile" :headers="getUploadHeaders"
|
||||
:action="getUploadActionUrl('/admin/CourseClass/course/upload')"
|
||||
:data="{fieldName: 'pictureUrl', asImage: true}"
|
||||
:on-success="onPictureUrlUploadSuccess"
|
||||
:on-remove="onPictureUrlRemoveFile"
|
||||
:before-upload="pictureFile"
|
||||
:on-error="onUploadError" :on-exceed="onUploadLimit"
|
||||
list-type="picture-card" :file-list="formCreateCourse.pictureUrl.impl.fileList" :limit="formCreateCourse.pictureUrl.impl.maxCount"
|
||||
:show-file-list="true">
|
||||
<i class="el-icon-plus upload-image-item"></i>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row class="no-scroll flex-box" type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" :plain="true"
|
||||
@click="onCancel(false)">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" :disabled="!checkPermCodeExist('formCreateCourse:formCreateCourse:add')"
|
||||
@click="onAddClick()">
|
||||
保存
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { CourseController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formCreateCourse',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
Course: {
|
||||
courseId: undefined,
|
||||
courseName: undefined,
|
||||
price: undefined,
|
||||
description: undefined,
|
||||
difficulty: undefined,
|
||||
gradeId: undefined,
|
||||
subjectId: undefined,
|
||||
classHour: undefined,
|
||||
pictureUrl: undefined,
|
||||
createUserId: undefined,
|
||||
createTime: undefined,
|
||||
updateTime: undefined,
|
||||
isDatasourceInit: false
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
'Course.courseName': [
|
||||
{required: true, message: '请输入课程名称', trigger: 'blur'}
|
||||
],
|
||||
'Course.price': [
|
||||
{required: true, message: '请输入课程价格', trigger: 'blur'},
|
||||
{type: 'number', message: '课程价格只允许输入数字', trigger: 'blur', transform: (value) => Number(value)},
|
||||
{type: 'number', min: 0, message: '课程价格必须大于0', trigger: 'blur', transform: (value) => Number(value)}
|
||||
],
|
||||
'Course.difficulty': [
|
||||
{required: true, message: '请输入课程难度', trigger: 'blur'}
|
||||
],
|
||||
'Course.gradeId': [
|
||||
{required: true, message: '请输入所属年级', trigger: 'blur'}
|
||||
],
|
||||
'Course.subjectId': [
|
||||
{required: true, message: '请输入所属学科', trigger: 'blur'}
|
||||
],
|
||||
'Course.classHour': [
|
||||
{required: true, message: '请输入课时数量', trigger: 'blur'},
|
||||
{type: 'integer', message: '课时数量只允许输入整数', trigger: 'blur', transform: (value) => Number(value)},
|
||||
{type: 'number', min: 1, message: '课时数量必须大于1', trigger: 'blur', transform: (value) => Number(value)}
|
||||
],
|
||||
'Course.pictureUrl': [
|
||||
{required: true, message: '请输入课程图片', trigger: 'blur'}
|
||||
]
|
||||
},
|
||||
formCreateCourse: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
difficulty: {
|
||||
impl: new DropdownWidget(this.loadDifficultyDropdownList)
|
||||
},
|
||||
gradeId: {
|
||||
impl: new DropdownWidget(this.loadGradeIdDropdownList)
|
||||
},
|
||||
subjectId: {
|
||||
impl: new DropdownWidget(this.loadSubjectIdDropdownList)
|
||||
},
|
||||
pictureUrl: {
|
||||
impl: new UploadWidget(4)
|
||||
},
|
||||
menuBlock: {
|
||||
isInit: false
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 课程难度下拉数据获取函数
|
||||
*/
|
||||
loadDifficultyDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictCourseDifficult(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 课程难度选中值改变
|
||||
*/
|
||||
onDifficultyValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所属年级下拉数据获取函数
|
||||
*/
|
||||
loadGradeIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictGrade(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属年级选中值改变
|
||||
*/
|
||||
onGradeIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所属学科下拉数据获取函数
|
||||
*/
|
||||
loadSubjectIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictSubject(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属学科选中值改变
|
||||
*/
|
||||
onSubjectIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新新建课程
|
||||
*/
|
||||
refreshFormCreateCourse (reloadData = false) {
|
||||
if (!this.formCreateCourse.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formCreateCourse.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 保存
|
||||
*/
|
||||
onAddClick () {
|
||||
this.$refs.formCreateCourse.validate((valid) => {
|
||||
if (!valid) return;
|
||||
let params = {
|
||||
course: {
|
||||
courseName: this.formData.Course.courseName,
|
||||
price: this.formData.Course.price,
|
||||
description: this.formData.Course.description,
|
||||
difficulty: this.formData.Course.difficulty,
|
||||
gradeId: this.formData.Course.gradeId,
|
||||
subjectId: this.formData.Course.subjectId,
|
||||
classHour: this.formData.Course.classHour,
|
||||
pictureUrl: this.formData.Course.pictureUrl
|
||||
}
|
||||
};
|
||||
|
||||
CourseController.add(this, params).then(res => {
|
||||
this.$message.success('保存成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
});
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
/**
|
||||
* 课程图片上传成功
|
||||
*/
|
||||
onPictureUrlUploadSuccess (response, file, fileList) {
|
||||
if (response.success) {
|
||||
file.downloadUri = response.data.downloadUri;
|
||||
file.filename = response.data.filename;
|
||||
file.url = URL.createObjectURL(file.raw);
|
||||
this.formCreateCourse.pictureUrl.impl.onFileChange(file, fileList);
|
||||
this.formData.Course.pictureUrl = this.fileListToJson(this.formCreateCourse.pictureUrl.impl.fileList);
|
||||
} else {
|
||||
this.$message.error(response.message);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 移除课程图片
|
||||
*/
|
||||
onPictureUrlRemoveFile (file, fileList) {
|
||||
this.formCreateCourse.pictureUrl.impl.onFileChange(file, fileList);
|
||||
this.formData.Course.pictureUrl = this.fileListToJson(this.formCreateCourse.pictureUrl.impl.fileList);
|
||||
},
|
||||
onUploadError (e, file, fileList) {
|
||||
this.$message.error('文件上传失败');
|
||||
},
|
||||
onUploadLimit (files, fileList) {
|
||||
this.$message.error('已经超出最大上传个数限制');
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormCreateCourse();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,195 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form ref="formCreateClass" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
|
||||
label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="学校名称" prop="SchoolInfo.schoolName">
|
||||
<el-input class="input-item" v-model="formData.SchoolInfo.schoolName"
|
||||
:clearable="true" placeholder="学校名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="所在省份" prop="SchoolInfo.provinceId">
|
||||
<el-select class="input-item" v-model="formData.SchoolInfo.provinceId" :clearable="true" filterable
|
||||
placeholder="所在省份" :loading="formCreateClass.provinceId.impl.loading"
|
||||
@visible-change="formCreateClass.provinceId.impl.onVisibleChange"
|
||||
@change="onProvinceIdValueChange">
|
||||
<el-option v-for="item in formCreateClass.provinceId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="所在城市" prop="SchoolInfo.cityId">
|
||||
<el-select class="input-item" v-model="formData.SchoolInfo.cityId" :clearable="true" filterable
|
||||
placeholder="所在城市" :loading="formCreateClass.cityId.impl.loading"
|
||||
@visible-change="formCreateClass.cityId.impl.onVisibleChange"
|
||||
@change="onCityIdValueChange">
|
||||
<el-option v-for="item in formCreateClass.cityId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row class="no-scroll flex-box" type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" :plain="true"
|
||||
@click="onCancel(false)">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" :disabled="!checkPermCodeExist('formCreateSchool:formCreateClass:add')"
|
||||
@click="onAddClick()">
|
||||
保存
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { SchoolInfoController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formCreateSchool',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
SchoolInfo: {
|
||||
schoolId: undefined,
|
||||
schoolName: undefined,
|
||||
provinceId: undefined,
|
||||
cityId: undefined,
|
||||
isDatasourceInit: false
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
'SchoolInfo.schoolName': [
|
||||
{required: true, message: '请输入学校名称', trigger: 'blur'}
|
||||
],
|
||||
'SchoolInfo.provinceId': [
|
||||
{required: true, message: '请输入所在省份', trigger: 'blur'}
|
||||
],
|
||||
'SchoolInfo.cityId': [
|
||||
{required: true, message: '请输入所在城市', trigger: 'blur'}
|
||||
]
|
||||
},
|
||||
formCreateClass: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
provinceId: {
|
||||
impl: new DropdownWidget(this.loadProvinceIdDropdownList)
|
||||
},
|
||||
cityId: {
|
||||
impl: new DropdownWidget(this.loadCityIdDropdownList)
|
||||
},
|
||||
menuBlock: {
|
||||
isInit: false
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 所在省份下拉数据获取函数
|
||||
*/
|
||||
loadProvinceIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所在省份选中值改变
|
||||
*/
|
||||
onProvinceIdValueChange (value) {
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formData.SchoolInfo.cityId = undefined;
|
||||
this.formCreateClass.cityId.impl.dirty = true;
|
||||
this.onCityIdValueChange(this.formData.SchoolInfo.cityId);
|
||||
},
|
||||
/**
|
||||
* 所在城市下拉数据获取函数
|
||||
*/
|
||||
loadCityIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
parentId: this.formData.SchoolInfo.provinceId
|
||||
};
|
||||
if (params.parentId == null || params.parentId === '') {
|
||||
resolve([]);
|
||||
return;
|
||||
}
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所在城市选中值改变
|
||||
*/
|
||||
onCityIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新新建校区
|
||||
*/
|
||||
refreshFormCreateClass (reloadData = false) {
|
||||
if (!this.formCreateClass.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formCreateClass.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 保存
|
||||
*/
|
||||
onAddClick () {
|
||||
this.$refs.formCreateClass.validate((valid) => {
|
||||
if (!valid) return;
|
||||
let params = {
|
||||
schoolInfo: {
|
||||
schoolName: this.formData.SchoolInfo.schoolName,
|
||||
provinceId: this.formData.SchoolInfo.provinceId,
|
||||
cityId: this.formData.SchoolInfo.cityId
|
||||
}
|
||||
};
|
||||
|
||||
SchoolInfoController.add(this, params).then(res => {
|
||||
this.$message.success('保存成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
});
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormCreateClass();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,429 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form ref="formCreateStudent" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
|
||||
label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="姓名" prop="Student.studentName">
|
||||
<el-input class="input-item" v-model="formData.Student.studentName"
|
||||
:clearable="true" placeholder="姓名" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="性别" prop="Student.gender">
|
||||
<el-select class="input-item" v-model="formData.Student.gender" :clearable="true" filterable
|
||||
placeholder="性别" :loading="formCreateStudent.gender.impl.loading"
|
||||
@visible-change="formCreateStudent.gender.impl.onVisibleChange"
|
||||
@change="onGenderValueChange">
|
||||
<el-option v-for="item in formCreateStudent.gender.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="出生日期" prop="Student.birthday">
|
||||
<el-date-picker class="input-item" v-model="formData.Student.birthday" :clearable="true"
|
||||
placeholder="出生日期" type="date" align="left"
|
||||
format="yyyy-MM-dd" value-format="yyyy-MM-dd hh:mm:ss" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="手机号码" prop="Student.loginMobile">
|
||||
<el-input class="input-item" v-model="formData.Student.loginMobile"
|
||||
:clearable="true" placeholder="手机号码" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所在年级" prop="Student.gradeId">
|
||||
<el-select class="input-item" v-model="formData.Student.gradeId" :clearable="true" filterable
|
||||
placeholder="所在年级" :loading="formCreateStudent.gradeId.impl.loading"
|
||||
@visible-change="formCreateStudent.gradeId.impl.onVisibleChange"
|
||||
@change="onGradeIdValueChange">
|
||||
<el-option v-for="item in formCreateStudent.gradeId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="经验等级" prop="Student.experienceLevel">
|
||||
<el-select class="input-item" v-model="formData.Student.experienceLevel" :clearable="true" filterable
|
||||
placeholder="经验等级" :loading="formCreateStudent.experienceLevel.impl.loading"
|
||||
@visible-change="formCreateStudent.experienceLevel.impl.onVisibleChange"
|
||||
@change="onExperienceLevelValueChange">
|
||||
<el-option v-for="item in formCreateStudent.experienceLevel.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所在省份" prop="Student.provinceId">
|
||||
<el-select class="input-item" v-model="formData.Student.provinceId" :clearable="true" filterable
|
||||
placeholder="所在省份" :loading="formCreateStudent.provinceId.impl.loading"
|
||||
@visible-change="formCreateStudent.provinceId.impl.onVisibleChange"
|
||||
@change="onProvinceIdValueChange">
|
||||
<el-option v-for="item in formCreateStudent.provinceId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所在城市" prop="Student.cityId">
|
||||
<el-select class="input-item" v-model="formData.Student.cityId" :clearable="true" filterable
|
||||
placeholder="所在城市" :loading="formCreateStudent.cityId.impl.loading"
|
||||
@visible-change="formCreateStudent.cityId.impl.onVisibleChange"
|
||||
@change="onCityIdValueChange">
|
||||
<el-option v-for="item in formCreateStudent.cityId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所在区县" prop="Student.districtId">
|
||||
<el-select class="input-item" v-model="formData.Student.districtId" :clearable="true" filterable
|
||||
placeholder="所在区县" :loading="formCreateStudent.districtId.impl.loading"
|
||||
@visible-change="formCreateStudent.districtId.impl.onVisibleChange"
|
||||
@change="onDistrictIdValueChange">
|
||||
<el-option v-for="item in formCreateStudent.districtId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属校区" prop="Student.schoolId">
|
||||
<el-select class="input-item" v-model="formData.Student.schoolId" :clearable="true" filterable
|
||||
placeholder="所属校区" :loading="formCreateStudent.schoolId.impl.loading"
|
||||
@visible-change="formCreateStudent.schoolId.impl.onVisibleChange"
|
||||
@change="onSchoolIdValueChange">
|
||||
<el-option v-for="item in formCreateStudent.schoolId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row class="no-scroll flex-box" type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" :plain="true"
|
||||
@click="onCancel(false)">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" :disabled="!checkPermCodeExist('formCreateStudent:formCreateStudent:update')"
|
||||
@click="onUpdateClick()">
|
||||
保存
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import rules from '@/utils/validate.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { StudentController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formCreateStudent',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
Student: {
|
||||
studentId: undefined,
|
||||
loginMobile: undefined,
|
||||
studentName: undefined,
|
||||
provinceId: undefined,
|
||||
cityId: undefined,
|
||||
districtId: undefined,
|
||||
gender: undefined,
|
||||
birthday: undefined,
|
||||
experienceLevel: undefined,
|
||||
totalCoin: 0,
|
||||
leftCoin: 0,
|
||||
gradeId: undefined,
|
||||
schoolId: undefined,
|
||||
registerTime: undefined,
|
||||
status: undefined,
|
||||
isDatasourceInit: false
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
'Student.studentName': [
|
||||
{required: true, message: '请输入姓名', trigger: 'blur'}
|
||||
],
|
||||
'Student.gender': [
|
||||
{required: true, message: '请输入性别', trigger: 'blur'}
|
||||
],
|
||||
'Student.birthday': [
|
||||
{required: true, message: '请输入出生日期', trigger: 'blur'}
|
||||
],
|
||||
'Student.loginMobile': [
|
||||
{required: true, message: '请输入手机号码', trigger: 'blur'},
|
||||
{type: 'string', pattern: rules.pattern.mobie, message: '请输入正确的手机号码', trigger: 'blur'}
|
||||
],
|
||||
'Student.gradeId': [
|
||||
{required: true, message: '请输入所在年级', trigger: 'blur'}
|
||||
],
|
||||
'Student.experienceLevel': [
|
||||
{required: true, message: '请输入经验等级', trigger: 'blur'}
|
||||
],
|
||||
'Student.provinceId': [
|
||||
{required: true, message: '请输入所在省份', trigger: 'blur'}
|
||||
],
|
||||
'Student.cityId': [
|
||||
{required: true, message: '请输入所在城市', trigger: 'blur'}
|
||||
],
|
||||
'Student.districtId': [
|
||||
{required: true, message: '请输入所在区县', trigger: 'blur'}
|
||||
],
|
||||
'Student.schoolId': [
|
||||
{required: true, message: '请输入所属校区', trigger: 'blur'}
|
||||
]
|
||||
},
|
||||
formCreateStudent: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
gender: {
|
||||
impl: new DropdownWidget(this.loadGenderDropdownList)
|
||||
},
|
||||
gradeId: {
|
||||
impl: new DropdownWidget(this.loadGradeIdDropdownList)
|
||||
},
|
||||
experienceLevel: {
|
||||
impl: new DropdownWidget(this.loadExperienceLevelDropdownList)
|
||||
},
|
||||
provinceId: {
|
||||
impl: new DropdownWidget(this.loadProvinceIdDropdownList)
|
||||
},
|
||||
cityId: {
|
||||
impl: new DropdownWidget(this.loadCityIdDropdownList)
|
||||
},
|
||||
districtId: {
|
||||
impl: new DropdownWidget(this.loadDistrictIdDropdownList)
|
||||
},
|
||||
schoolId: {
|
||||
impl: new DropdownWidget(this.loadSchoolIdDropdownList)
|
||||
},
|
||||
menuBlock: {
|
||||
isInit: false
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 性别下拉数据获取函数
|
||||
*/
|
||||
loadGenderDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictGender(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 性别选中值改变
|
||||
*/
|
||||
onGenderValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所在年级下拉数据获取函数
|
||||
*/
|
||||
loadGradeIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictGrade(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所在年级选中值改变
|
||||
*/
|
||||
onGradeIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 经验等级下拉数据获取函数
|
||||
*/
|
||||
loadExperienceLevelDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictExpLevel(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 经验等级选中值改变
|
||||
*/
|
||||
onExperienceLevelValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所在省份下拉数据获取函数
|
||||
*/
|
||||
loadProvinceIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所在省份选中值改变
|
||||
*/
|
||||
onProvinceIdValueChange (value) {
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formData.Student.cityId = undefined;
|
||||
this.formCreateStudent.cityId.impl.dirty = true;
|
||||
this.onCityIdValueChange(this.formData.Student.cityId);
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formData.Student.schoolId = undefined;
|
||||
this.formCreateStudent.schoolId.impl.dirty = true;
|
||||
this.onSchoolIdValueChange(this.formData.Student.schoolId);
|
||||
},
|
||||
/**
|
||||
* 所在城市下拉数据获取函数
|
||||
*/
|
||||
loadCityIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
parentId: this.formData.Student.provinceId
|
||||
};
|
||||
if (params.parentId == null || params.parentId === '') {
|
||||
resolve([]);
|
||||
return;
|
||||
}
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所在城市选中值改变
|
||||
*/
|
||||
onCityIdValueChange (value) {
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formData.Student.districtId = undefined;
|
||||
this.formCreateStudent.districtId.impl.dirty = true;
|
||||
this.onDistrictIdValueChange(this.formData.Student.districtId);
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formData.Student.schoolId = undefined;
|
||||
this.formCreateStudent.schoolId.impl.dirty = true;
|
||||
this.onSchoolIdValueChange(this.formData.Student.schoolId);
|
||||
},
|
||||
/**
|
||||
* 所在区县下拉数据获取函数
|
||||
*/
|
||||
loadDistrictIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
parentId: this.formData.Student.cityId
|
||||
};
|
||||
if (params.parentId == null || params.parentId === '') {
|
||||
resolve([]);
|
||||
return;
|
||||
}
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所在区县选中值改变
|
||||
*/
|
||||
onDistrictIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所属校区下拉数据获取函数
|
||||
*/
|
||||
loadSchoolIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
provinceId: this.formData.Student.provinceId,
|
||||
cityId: this.formData.Student.cityId
|
||||
};
|
||||
DictionaryController.dictSchoolInfo(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属校区选中值改变
|
||||
*/
|
||||
onSchoolIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新新建学生
|
||||
*/
|
||||
refreshFormCreateStudent (reloadData = false) {
|
||||
if (!this.formCreateStudent.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formCreateStudent.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 保存
|
||||
*/
|
||||
onUpdateClick () {
|
||||
this.$refs.formCreateStudent.validate((valid) => {
|
||||
if (!valid) return;
|
||||
let params = {
|
||||
student: {
|
||||
loginMobile: this.formData.Student.loginMobile,
|
||||
studentName: this.formData.Student.studentName,
|
||||
provinceId: this.formData.Student.provinceId,
|
||||
cityId: this.formData.Student.cityId,
|
||||
districtId: this.formData.Student.districtId,
|
||||
gender: this.formData.Student.gender,
|
||||
birthday: this.formData.Student.birthday,
|
||||
experienceLevel: this.formData.Student.experienceLevel,
|
||||
totalCoin: this.formData.Student.totalCoin,
|
||||
leftCoin: this.formData.Student.leftCoin,
|
||||
gradeId: this.formData.Student.gradeId,
|
||||
schoolId: this.formData.Student.schoolId,
|
||||
status: this.StudentStatus.NORMAL
|
||||
}
|
||||
};
|
||||
|
||||
StudentController.add(this, params).then(res => {
|
||||
this.$message.success('保存成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
});
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormCreateStudent();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,303 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form ref="formEditClass" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
|
||||
label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="班级名称" prop="StudentClass.className">
|
||||
<el-input class="input-item" v-model="formData.StudentClass.className"
|
||||
:clearable="true" placeholder="班级名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="班级级别" prop="StudentClass.classLevel">
|
||||
<el-select class="input-item" v-model="formData.StudentClass.classLevel" :clearable="true" filterable
|
||||
placeholder="班级级别" :loading="formEditClass.classLevel.impl.loading"
|
||||
@visible-change="formEditClass.classLevel.impl.onVisibleChange"
|
||||
@change="onClassLevelValueChange">
|
||||
<el-option v-for="item in formEditClass.classLevel.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属校区" prop="StudentClass.schoolId">
|
||||
<el-select class="input-item" v-model="formData.StudentClass.schoolId" :clearable="true" filterable
|
||||
placeholder="所属校区" :loading="formEditClass.schoolId.impl.loading"
|
||||
@visible-change="formEditClass.schoolId.impl.onVisibleChange"
|
||||
@change="onSchoolIdValueChange">
|
||||
<el-option v-for="item in formEditClass.schoolId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="班长" prop="StudentClass.leaderId">
|
||||
<el-select class="input-item" v-model="formData.StudentClass.leaderId" :clearable="true" filterable
|
||||
placeholder="班长" :loading="formEditClass.leaderId.impl.loading"
|
||||
@visible-change="formEditClass.leaderId.impl.onVisibleChange"
|
||||
@change="onLeaderIdValueChange">
|
||||
<el-option v-for="item in formEditClass.leaderId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="已完成课时" prop="StudentClass.finishClassHour">
|
||||
<el-input-number class="input-item" v-model="formData.StudentClass.finishClassHour"
|
||||
:clearable="true" controls-position="right" placeholder="已完成课时" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row class="no-scroll flex-box" type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" :plain="true"
|
||||
@click="onCancel(false)">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" :disabled="!checkPermCodeExist('formEditClass:formEditClass:update')"
|
||||
@click="onUpdateClick()">
|
||||
保存
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { StudentClassController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formEditClass',
|
||||
props: {
|
||||
classId: {
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
StudentClass: {
|
||||
classId: undefined,
|
||||
className: undefined,
|
||||
schoolId: undefined,
|
||||
leaderId: undefined,
|
||||
finishClassHour: undefined,
|
||||
classLevel: undefined,
|
||||
createUserId: undefined,
|
||||
createTime: undefined,
|
||||
status: undefined,
|
||||
course: {
|
||||
courseId: undefined,
|
||||
courseName: undefined,
|
||||
price: undefined,
|
||||
description: undefined,
|
||||
difficulty: undefined,
|
||||
gradeId: undefined,
|
||||
subjectId: undefined,
|
||||
classHour: undefined,
|
||||
pictureUrl: undefined,
|
||||
createUserId: undefined,
|
||||
createTime: undefined,
|
||||
updateTime: undefined
|
||||
},
|
||||
student: {
|
||||
studentId: undefined,
|
||||
loginMobile: undefined,
|
||||
studentName: undefined,
|
||||
provinceId: undefined,
|
||||
cityId: undefined,
|
||||
districtId: undefined,
|
||||
gender: undefined,
|
||||
birthday: undefined,
|
||||
experienceLevel: undefined,
|
||||
totalCoin: undefined,
|
||||
leftCoin: undefined,
|
||||
gradeId: undefined,
|
||||
schoolId: undefined,
|
||||
registerTime: undefined,
|
||||
status: undefined
|
||||
},
|
||||
isDatasourceInit: false
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
'StudentClass.className': [
|
||||
{required: true, message: '请输入班级名称', trigger: 'blur'}
|
||||
],
|
||||
'StudentClass.classLevel': [
|
||||
{required: true, message: '请输入班级级别', trigger: 'blur'}
|
||||
],
|
||||
'StudentClass.schoolId': [
|
||||
{required: true, message: '请输入所属校区', trigger: 'blur'}
|
||||
],
|
||||
'StudentClass.leaderId': [
|
||||
{required: true, message: '请输入班长', trigger: 'blur'}
|
||||
],
|
||||
'StudentClass.finishClassHour': [
|
||||
{required: true, message: '请输入已完成课时', trigger: 'blur'},
|
||||
{type: 'integer', message: '已完成课时只允许输入整数', trigger: 'blur', transform: (value) => Number(value)},
|
||||
{type: 'number', min: 0, max: 9999, message: '已完成课时必须在0 - 9999之间', trigger: 'blur', transform: (value) => Number(value)}
|
||||
]
|
||||
},
|
||||
formEditClass: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
classLevel: {
|
||||
impl: new DropdownWidget(this.loadClassLevelDropdownList)
|
||||
},
|
||||
schoolId: {
|
||||
impl: new DropdownWidget(this.loadSchoolIdDropdownList)
|
||||
},
|
||||
leaderId: {
|
||||
impl: new DropdownWidget(this.loadLeaderIdDropdownList)
|
||||
},
|
||||
menuBlock: {
|
||||
isInit: false
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 班级级别下拉数据获取函数
|
||||
*/
|
||||
loadClassLevelDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictClassLevel(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 班级级别选中值改变
|
||||
*/
|
||||
onClassLevelValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所属校区下拉数据获取函数
|
||||
*/
|
||||
loadSchoolIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictSchoolInfo(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属校区选中值改变
|
||||
*/
|
||||
onSchoolIdValueChange (value) {
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formData.StudentClass.leaderId = undefined;
|
||||
this.formEditClass.leaderId.impl.dirty = true;
|
||||
this.onLeaderIdValueChange(this.formData.StudentClass.leaderId);
|
||||
},
|
||||
/**
|
||||
* 班长下拉数据获取函数
|
||||
*/
|
||||
loadLeaderIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
schoolId: this.formData.StudentClass.schoolId
|
||||
};
|
||||
DictionaryController.dictStudent(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 班长选中值改变
|
||||
*/
|
||||
onLeaderIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新编辑班级
|
||||
*/
|
||||
refreshFormEditClass (reloadData = false) {
|
||||
this.loadStudentClassData().then(res => {
|
||||
if (!this.formEditClass.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formEditClass.isInit = true;
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 保存
|
||||
*/
|
||||
onUpdateClick () {
|
||||
this.$refs.formEditClass.validate((valid) => {
|
||||
if (!valid) return;
|
||||
let params = {
|
||||
studentClass: {
|
||||
classId: this.classId,
|
||||
className: this.formData.StudentClass.className,
|
||||
schoolId: this.formData.StudentClass.schoolId,
|
||||
leaderId: this.formData.StudentClass.leaderId,
|
||||
finishClassHour: this.formData.StudentClass.finishClassHour,
|
||||
classLevel: this.formData.StudentClass.classLevel
|
||||
}
|
||||
};
|
||||
|
||||
StudentClassController.update(this, params).then(res => {
|
||||
this.$message.success('保存成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 获取班级数据详细信息
|
||||
*/
|
||||
loadStudentClassData () {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (!this.formData.StudentClass.isDatasourceInit) {
|
||||
let params = {
|
||||
classId: this.classId
|
||||
};
|
||||
StudentClassController.view(this, params).then(res => {
|
||||
this.formData.StudentClass = {...res.data, isDatasourceInit: true};
|
||||
if (this.formData.StudentClass.classLevelDictMap) this.formEditClass.classLevel.impl.dropdownList = [this.formData.StudentClass.classLevelDictMap];
|
||||
if (this.formData.StudentClass.schoolIdDictMap) this.formEditClass.schoolId.impl.dropdownList = [this.formData.StudentClass.schoolIdDictMap];
|
||||
if (this.formData.StudentClass.leaderIdDictMap) this.formEditClass.leaderId.impl.dropdownList = [this.formData.StudentClass.leaderIdDictMap];
|
||||
resolve();
|
||||
}).catch(e => {
|
||||
reject();
|
||||
});
|
||||
} else {
|
||||
resolve();
|
||||
}
|
||||
});
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormEditClass();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,343 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form ref="formEditCourse" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
|
||||
label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="课程名称" prop="Course.courseName">
|
||||
<el-input class="input-item" v-model="formData.Course.courseName"
|
||||
:clearable="true" placeholder="课程名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="课程价格" prop="Course.price">
|
||||
<el-input-number class="input-item" v-model="formData.Course.price"
|
||||
:clearable="true" controls-position="right" placeholder="课程价格" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="课程难度" prop="Course.difficulty">
|
||||
<el-select class="input-item" v-model="formData.Course.difficulty" :clearable="true" filterable
|
||||
placeholder="课程难度" :loading="formEditCourse.difficulty.impl.loading"
|
||||
@visible-change="formEditCourse.difficulty.impl.onVisibleChange"
|
||||
@change="onDifficultyValueChange">
|
||||
<el-option v-for="item in formEditCourse.difficulty.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属年级" prop="Course.gradeId">
|
||||
<el-select class="input-item" v-model="formData.Course.gradeId" :clearable="true" filterable
|
||||
placeholder="所属年级" :loading="formEditCourse.gradeId.impl.loading"
|
||||
@visible-change="formEditCourse.gradeId.impl.onVisibleChange"
|
||||
@change="onGradeIdValueChange">
|
||||
<el-option v-for="item in formEditCourse.gradeId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属学科" prop="Course.subjectId">
|
||||
<el-select class="input-item" v-model="formData.Course.subjectId" :clearable="true" filterable
|
||||
placeholder="所属学科" :loading="formEditCourse.subjectId.impl.loading"
|
||||
@visible-change="formEditCourse.subjectId.impl.onVisibleChange"
|
||||
@change="onSubjectIdValueChange">
|
||||
<el-option v-for="item in formEditCourse.subjectId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="课时数量" prop="Course.classHour">
|
||||
<el-input-number class="input-item" v-model="formData.Course.classHour"
|
||||
:clearable="true" controls-position="right" placeholder="课时数量" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="课程描述" prop="Course.description">
|
||||
<el-input class="input-item" v-model="formData.Course.description"
|
||||
:clearable="true" placeholder="课程描述" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="课程图片" prop="Course.pictureUrl">
|
||||
<el-upload class="upload-image-item upload-image-multi" name="uploadFile" :headers="getUploadHeaders"
|
||||
:action="getUploadActionUrl('/admin/CourseClass/course/upload')"
|
||||
:data="{fieldName: 'pictureUrl', asImage: true}"
|
||||
:on-success="onPictureUrlUploadSuccess"
|
||||
:on-remove="onPictureUrlRemoveFile"
|
||||
:before-upload="pictureFile"
|
||||
:on-error="onUploadError" :on-exceed="onUploadLimit"
|
||||
list-type="picture-card" :file-list="formEditCourse.pictureUrl.impl.fileList" :limit="formEditCourse.pictureUrl.impl.maxCount"
|
||||
:show-file-list="true">
|
||||
<i class="el-icon-plus upload-image-item"></i>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row class="no-scroll flex-box" type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" :plain="true"
|
||||
@click="onCancel(false)">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" :disabled="!checkPermCodeExist('formEditCourse:formEditCourse:update')"
|
||||
@click="onUpdateClick()">
|
||||
保存
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { CourseController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formEditCourse',
|
||||
props: {
|
||||
courseId: {
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
Course: {
|
||||
courseId: undefined,
|
||||
courseName: undefined,
|
||||
price: undefined,
|
||||
description: undefined,
|
||||
difficulty: undefined,
|
||||
gradeId: undefined,
|
||||
subjectId: undefined,
|
||||
classHour: undefined,
|
||||
pictureUrl: undefined,
|
||||
createUserId: undefined,
|
||||
createTime: undefined,
|
||||
updateTime: undefined,
|
||||
isDatasourceInit: false
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
'Course.courseName': [
|
||||
{required: true, message: '请输入课程名称', trigger: 'blur'}
|
||||
],
|
||||
'Course.price': [
|
||||
{required: true, message: '请输入课程价格', trigger: 'blur'},
|
||||
{type: 'number', message: '课程价格只允许输入数字', trigger: 'blur', transform: (value) => Number(value)},
|
||||
{type: 'number', min: 0, message: '课程价格必须大于0', trigger: 'blur', transform: (value) => Number(value)}
|
||||
],
|
||||
'Course.difficulty': [
|
||||
{required: true, message: '请输入课程难度', trigger: 'blur'}
|
||||
],
|
||||
'Course.gradeId': [
|
||||
{required: true, message: '请输入所属年级', trigger: 'blur'}
|
||||
],
|
||||
'Course.subjectId': [
|
||||
{required: true, message: '请输入所属学科', trigger: 'blur'}
|
||||
],
|
||||
'Course.classHour': [
|
||||
{required: true, message: '请输入课时数量', trigger: 'blur'},
|
||||
{type: 'integer', message: '课时数量只允许输入整数', trigger: 'blur', transform: (value) => Number(value)},
|
||||
{type: 'number', min: 1, message: '课时数量必须大于1', trigger: 'blur', transform: (value) => Number(value)}
|
||||
],
|
||||
'Course.pictureUrl': [
|
||||
{required: true, message: '请输入课程图片', trigger: 'blur'}
|
||||
]
|
||||
},
|
||||
formEditCourse: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
difficulty: {
|
||||
impl: new DropdownWidget(this.loadDifficultyDropdownList)
|
||||
},
|
||||
gradeId: {
|
||||
impl: new DropdownWidget(this.loadGradeIdDropdownList)
|
||||
},
|
||||
subjectId: {
|
||||
impl: new DropdownWidget(this.loadSubjectIdDropdownList)
|
||||
},
|
||||
pictureUrl: {
|
||||
impl: new UploadWidget(4)
|
||||
},
|
||||
menuBlock: {
|
||||
isInit: false
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 课程难度下拉数据获取函数
|
||||
*/
|
||||
loadDifficultyDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictCourseDifficult(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 课程难度选中值改变
|
||||
*/
|
||||
onDifficultyValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所属年级下拉数据获取函数
|
||||
*/
|
||||
loadGradeIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictGrade(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属年级选中值改变
|
||||
*/
|
||||
onGradeIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所属学科下拉数据获取函数
|
||||
*/
|
||||
loadSubjectIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictSubject(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属学科选中值改变
|
||||
*/
|
||||
onSubjectIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新编辑课程
|
||||
*/
|
||||
refreshFormEditCourse (reloadData = false) {
|
||||
this.loadCourseData().then(res => {
|
||||
if (!this.formEditCourse.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formEditCourse.isInit = true;
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 保存
|
||||
*/
|
||||
onUpdateClick () {
|
||||
this.$refs.formEditCourse.validate((valid) => {
|
||||
if (!valid) return;
|
||||
let params = {
|
||||
course: {
|
||||
courseId: this.courseId,
|
||||
courseName: this.formData.Course.courseName,
|
||||
price: this.formData.Course.price,
|
||||
description: this.formData.Course.description,
|
||||
difficulty: this.formData.Course.difficulty,
|
||||
gradeId: this.formData.Course.gradeId,
|
||||
subjectId: this.formData.Course.subjectId,
|
||||
classHour: this.formData.Course.classHour,
|
||||
pictureUrl: this.formData.Course.pictureUrl
|
||||
}
|
||||
};
|
||||
|
||||
CourseController.update(this, params).then(res => {
|
||||
this.$message.success('保存成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 获取课程数据详细信息
|
||||
*/
|
||||
loadCourseData () {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (!this.formData.Course.isDatasourceInit) {
|
||||
let params = {
|
||||
courseId: this.courseId
|
||||
};
|
||||
CourseController.view(this, params).then(res => {
|
||||
this.formData.Course = {...res.data, isDatasourceInit: true};
|
||||
if (this.formData.Course.difficultyDictMap) this.formEditCourse.difficulty.impl.dropdownList = [this.formData.Course.difficultyDictMap];
|
||||
if (this.formData.Course.gradeIdDictMap) this.formEditCourse.gradeId.impl.dropdownList = [this.formData.Course.gradeIdDictMap];
|
||||
if (this.formData.Course.subjectIdDictMap) this.formEditCourse.subjectId.impl.dropdownList = [this.formData.Course.subjectIdDictMap];
|
||||
let pictureUrlDownloadParams = {
|
||||
courseId: this.formData.Course.courseId,
|
||||
fieldName: 'pictureUrl',
|
||||
asImage: true
|
||||
}
|
||||
this.formEditCourse.pictureUrl.impl.fileList = this.parseUploadData(this.formData.Course.pictureUrl, pictureUrlDownloadParams);
|
||||
resolve();
|
||||
}).catch(e => {
|
||||
reject();
|
||||
});
|
||||
} else {
|
||||
resolve();
|
||||
}
|
||||
});
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
/**
|
||||
* 课程图片上传成功
|
||||
*/
|
||||
onPictureUrlUploadSuccess (response, file, fileList) {
|
||||
if (response.success) {
|
||||
file.downloadUri = response.data.downloadUri;
|
||||
file.filename = response.data.filename;
|
||||
file.url = URL.createObjectURL(file.raw);
|
||||
this.formEditCourse.pictureUrl.impl.onFileChange(file, fileList);
|
||||
this.formData.Course.pictureUrl = this.fileListToJson(this.formEditCourse.pictureUrl.impl.fileList);
|
||||
} else {
|
||||
this.$message.error(response.message);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 移除课程图片
|
||||
*/
|
||||
onPictureUrlRemoveFile (file, fileList) {
|
||||
this.formEditCourse.pictureUrl.impl.onFileChange(file, fileList);
|
||||
this.formData.Course.pictureUrl = this.fileListToJson(this.formEditCourse.pictureUrl.impl.fileList);
|
||||
},
|
||||
onUploadError (e, file, fileList) {
|
||||
this.$message.error('文件上传失败');
|
||||
},
|
||||
onUploadLimit (files, fileList) {
|
||||
this.$message.error('已经超出最大上传个数限制');
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormEditCourse();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,223 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form ref="formEditSchool" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
|
||||
label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="学校名称" prop="SchoolInfo.schoolName">
|
||||
<el-input class="input-item" v-model="formData.SchoolInfo.schoolName"
|
||||
:clearable="true" placeholder="学校名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="所在省份" prop="SchoolInfo.provinceId">
|
||||
<el-select class="input-item" v-model="formData.SchoolInfo.provinceId" :clearable="true" filterable
|
||||
placeholder="所在省份" :loading="formEditSchool.provinceId.impl.loading"
|
||||
@visible-change="formEditSchool.provinceId.impl.onVisibleChange"
|
||||
@change="onProvinceIdValueChange">
|
||||
<el-option v-for="item in formEditSchool.provinceId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="所在城市" prop="SchoolInfo.cityId">
|
||||
<el-select class="input-item" v-model="formData.SchoolInfo.cityId" :clearable="true" filterable
|
||||
placeholder="所在城市" :loading="formEditSchool.cityId.impl.loading"
|
||||
@visible-change="formEditSchool.cityId.impl.onVisibleChange"
|
||||
@change="onCityIdValueChange">
|
||||
<el-option v-for="item in formEditSchool.cityId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row class="no-scroll flex-box" type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" :plain="true"
|
||||
@click="onCancel(false)">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" :disabled="!checkPermCodeExist('formEditSchool:formEditSchool:update')"
|
||||
@click="onUpdateClick()">
|
||||
保存
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { SchoolInfoController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formEditSchool',
|
||||
props: {
|
||||
schoolId: {
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
SchoolInfo: {
|
||||
schoolId: undefined,
|
||||
schoolName: undefined,
|
||||
provinceId: undefined,
|
||||
cityId: undefined,
|
||||
isDatasourceInit: false
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
'SchoolInfo.schoolName': [
|
||||
{required: true, message: '请输入学校名称', trigger: 'blur'}
|
||||
],
|
||||
'SchoolInfo.provinceId': [
|
||||
{required: true, message: '请输入所在省份', trigger: 'blur'}
|
||||
],
|
||||
'SchoolInfo.cityId': [
|
||||
{required: true, message: '请输入所在城市', trigger: 'blur'}
|
||||
]
|
||||
},
|
||||
formEditSchool: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
provinceId: {
|
||||
impl: new DropdownWidget(this.loadProvinceIdDropdownList)
|
||||
},
|
||||
cityId: {
|
||||
impl: new DropdownWidget(this.loadCityIdDropdownList)
|
||||
},
|
||||
menuBlock: {
|
||||
isInit: false
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 所在省份下拉数据获取函数
|
||||
*/
|
||||
loadProvinceIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所在省份选中值改变
|
||||
*/
|
||||
onProvinceIdValueChange (value) {
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formData.SchoolInfo.cityId = undefined;
|
||||
this.formEditSchool.cityId.impl.dirty = true;
|
||||
this.onCityIdValueChange(this.formData.SchoolInfo.cityId);
|
||||
},
|
||||
/**
|
||||
* 所在城市下拉数据获取函数
|
||||
*/
|
||||
loadCityIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
parentId: this.formData.SchoolInfo.provinceId
|
||||
};
|
||||
if (params.parentId == null || params.parentId === '') {
|
||||
resolve([]);
|
||||
return;
|
||||
}
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所在城市选中值改变
|
||||
*/
|
||||
onCityIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新编辑校区
|
||||
*/
|
||||
refreshFormEditSchool (reloadData = false) {
|
||||
this.loadSchoolInfoData().then(res => {
|
||||
if (!this.formEditSchool.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formEditSchool.isInit = true;
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 保存
|
||||
*/
|
||||
onUpdateClick () {
|
||||
this.$refs.formEditSchool.validate((valid) => {
|
||||
if (!valid) return;
|
||||
let params = {
|
||||
schoolInfo: {
|
||||
schoolId: this.schoolId,
|
||||
schoolName: this.formData.SchoolInfo.schoolName,
|
||||
provinceId: this.formData.SchoolInfo.provinceId,
|
||||
cityId: this.formData.SchoolInfo.cityId
|
||||
}
|
||||
};
|
||||
|
||||
SchoolInfoController.update(this, params).then(res => {
|
||||
this.$message.success('保存成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 获取校区数据详细信息
|
||||
*/
|
||||
loadSchoolInfoData () {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (!this.formData.SchoolInfo.isDatasourceInit) {
|
||||
let params = {
|
||||
schoolId: this.schoolId
|
||||
};
|
||||
SchoolInfoController.view(this, params).then(res => {
|
||||
this.formData.SchoolInfo = {...res.data, isDatasourceInit: true};
|
||||
if (this.formData.SchoolInfo.provinceIdDictMap) this.formEditSchool.provinceId.impl.dropdownList = [this.formData.SchoolInfo.provinceIdDictMap];
|
||||
if (this.formData.SchoolInfo.cityIdDictMap) this.formEditSchool.cityId.impl.dropdownList = [this.formData.SchoolInfo.cityIdDictMap];
|
||||
resolve();
|
||||
}).catch(e => {
|
||||
reject();
|
||||
});
|
||||
} else {
|
||||
resolve();
|
||||
}
|
||||
});
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormEditSchool();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,519 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form ref="formEditStudent" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
|
||||
label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="姓名" prop="Student.studentName">
|
||||
<el-input class="input-item" v-model="formData.Student.studentName"
|
||||
:clearable="true" placeholder="学生姓名" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="性别" prop="Student.gender">
|
||||
<el-select class="input-item" v-model="formData.Student.gender" :clearable="true" filterable
|
||||
placeholder="性别" :loading="formEditStudent.gender.impl.loading"
|
||||
@visible-change="formEditStudent.gender.impl.onVisibleChange"
|
||||
@change="onGenderValueChange">
|
||||
<el-option v-for="item in formEditStudent.gender.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="出生日期" prop="Student.birthday">
|
||||
<el-date-picker class="input-item" v-model="formData.Student.birthday" :clearable="true"
|
||||
placeholder="出生日期" type="date" align="left"
|
||||
format="yyyy-MM-dd" value-format="yyyy-MM-dd hh:mm:ss" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="手机号码" prop="Student.loginMobile">
|
||||
<el-input class="input-item" v-model="formData.Student.loginMobile"
|
||||
:clearable="true" placeholder="手机号码" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所在年级" prop="Student.gradeId">
|
||||
<el-select class="input-item" v-model="formData.Student.gradeId" :clearable="true" filterable
|
||||
placeholder="所在年级" :loading="formEditStudent.gradeId.impl.loading"
|
||||
@visible-change="formEditStudent.gradeId.impl.onVisibleChange"
|
||||
@change="onGradeIdValueChange">
|
||||
<el-option v-for="item in formEditStudent.gradeId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="经验等级" prop="Student.experienceLevel">
|
||||
<el-select class="input-item" v-model="formData.Student.experienceLevel" :clearable="true" filterable
|
||||
placeholder="经验等级" :loading="formEditStudent.experienceLevel.impl.loading"
|
||||
@visible-change="formEditStudent.experienceLevel.impl.onVisibleChange"
|
||||
@change="onExperienceLevelValueChange">
|
||||
<el-option v-for="item in formEditStudent.experienceLevel.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所在省份" prop="Student.provinceId">
|
||||
<el-select class="input-item" v-model="formData.Student.provinceId" :clearable="true" filterable
|
||||
placeholder="所在省份" :loading="formEditStudent.provinceId.impl.loading"
|
||||
@visible-change="formEditStudent.provinceId.impl.onVisibleChange"
|
||||
@change="onProvinceIdValueChange">
|
||||
<el-option v-for="item in formEditStudent.provinceId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所在城市" prop="Student.cityId">
|
||||
<el-select class="input-item" v-model="formData.Student.cityId" :clearable="true" filterable
|
||||
placeholder="所在城市" :loading="formEditStudent.cityId.impl.loading"
|
||||
@visible-change="formEditStudent.cityId.impl.onVisibleChange"
|
||||
@change="onCityIdValueChange">
|
||||
<el-option v-for="item in formEditStudent.cityId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所在区县" prop="Student.districtId">
|
||||
<el-select class="input-item" v-model="formData.Student.districtId" :clearable="true" filterable
|
||||
placeholder="所在区县" :loading="formEditStudent.districtId.impl.loading"
|
||||
@visible-change="formEditStudent.districtId.impl.onVisibleChange"
|
||||
@change="onDistrictIdValueChange">
|
||||
<el-option v-for="item in formEditStudent.districtId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属校区" prop="Student.schoolId">
|
||||
<el-select class="input-item" v-model="formData.Student.schoolId" :clearable="true" filterable
|
||||
placeholder="所属校区" :loading="formEditStudent.schoolId.impl.loading"
|
||||
@visible-change="formEditStudent.schoolId.impl.onVisibleChange"
|
||||
@change="onSchoolIdValueChange">
|
||||
<el-option v-for="item in formEditStudent.schoolId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="充值学币" prop="Student.totalCoin">
|
||||
<el-input-number class="input-item" v-model="formData.Student.totalCoin"
|
||||
:clearable="true" controls-position="right" placeholder="充值学币" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="剩余学币" prop="Student.leftCoin">
|
||||
<el-input-number class="input-item" v-model="formData.Student.leftCoin"
|
||||
:clearable="true" controls-position="right" placeholder="剩余学币" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="学生状态 " prop="Student.status">
|
||||
<el-select class="input-item" v-model="formData.Student.status" :clearable="true" filterable
|
||||
placeholder="学生状态 " :loading="formEditStudent.status.impl.loading"
|
||||
@visible-change="formEditStudent.status.impl.onVisibleChange"
|
||||
@change="onStatusValueChange">
|
||||
<el-option v-for="item in formEditStudent.status.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row class="no-scroll flex-box" type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" :plain="true"
|
||||
@click="onCancel(false)">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" :disabled="!checkPermCodeExist('formEditStudent:formEditStudent:update')"
|
||||
@click="onUpdateClick()">
|
||||
保存
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import rules from '@/utils/validate.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { StudentController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formEditStudent',
|
||||
props: {
|
||||
studentId: {
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
Student: {
|
||||
studentId: undefined,
|
||||
loginMobile: undefined,
|
||||
studentName: undefined,
|
||||
provinceId: undefined,
|
||||
cityId: undefined,
|
||||
districtId: undefined,
|
||||
gender: undefined,
|
||||
birthday: undefined,
|
||||
experienceLevel: undefined,
|
||||
totalCoin: undefined,
|
||||
leftCoin: undefined,
|
||||
gradeId: undefined,
|
||||
schoolId: undefined,
|
||||
registerTime: undefined,
|
||||
status: undefined,
|
||||
isDatasourceInit: false
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
'Student.studentName': [
|
||||
{required: true, message: '请输入姓名', trigger: 'blur'}
|
||||
],
|
||||
'Student.gender': [
|
||||
{required: true, message: '请输入性别', trigger: 'blur'}
|
||||
],
|
||||
'Student.birthday': [
|
||||
{required: true, message: '请输入出生日期', trigger: 'blur'}
|
||||
],
|
||||
'Student.loginMobile': [
|
||||
{required: true, message: '请输入手机号码', trigger: 'blur'},
|
||||
{type: 'string', pattern: rules.pattern.mobie, message: '请输入正确的手机号码', trigger: 'blur'}
|
||||
],
|
||||
'Student.gradeId': [
|
||||
{required: true, message: '请输入所在年级', trigger: 'blur'}
|
||||
],
|
||||
'Student.experienceLevel': [
|
||||
{required: true, message: '请输入经验等级', trigger: 'blur'}
|
||||
],
|
||||
'Student.provinceId': [
|
||||
{required: true, message: '请输入所在省份', trigger: 'blur'}
|
||||
],
|
||||
'Student.cityId': [
|
||||
{required: true, message: '请输入所在城市', trigger: 'blur'}
|
||||
],
|
||||
'Student.districtId': [
|
||||
{required: true, message: '请输入所在区县', trigger: 'blur'}
|
||||
],
|
||||
'Student.schoolId': [
|
||||
{required: true, message: '请输入所属校区', trigger: 'blur'}
|
||||
],
|
||||
'Student.totalCoin': [
|
||||
{required: true, message: '请输入充值学币', trigger: 'blur'},
|
||||
{type: 'integer', message: '充值学币只允许输入整数', trigger: 'blur', transform: (value) => Number(value)},
|
||||
{type: 'number', min: 0, message: '充值学币必须大于0', trigger: 'blur', transform: (value) => Number(value)}
|
||||
],
|
||||
'Student.leftCoin': [
|
||||
{required: true, message: '请输入剩余学币', trigger: 'blur'},
|
||||
{type: 'integer', message: '剩余学币只允许输入整数', trigger: 'blur', transform: (value) => Number(value)},
|
||||
{type: 'number', min: 0, message: '剩余学币必须大于0', trigger: 'blur', transform: (value) => Number(value)}
|
||||
],
|
||||
'Student.status': [
|
||||
{required: true, message: '请输入学生状态 ', trigger: 'blur'}
|
||||
]
|
||||
},
|
||||
formEditStudent: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
gender: {
|
||||
impl: new DropdownWidget(this.loadGenderDropdownList)
|
||||
},
|
||||
gradeId: {
|
||||
impl: new DropdownWidget(this.loadGradeIdDropdownList)
|
||||
},
|
||||
experienceLevel: {
|
||||
impl: new DropdownWidget(this.loadExperienceLevelDropdownList)
|
||||
},
|
||||
provinceId: {
|
||||
impl: new DropdownWidget(this.loadProvinceIdDropdownList)
|
||||
},
|
||||
cityId: {
|
||||
impl: new DropdownWidget(this.loadCityIdDropdownList)
|
||||
},
|
||||
districtId: {
|
||||
impl: new DropdownWidget(this.loadDistrictIdDropdownList)
|
||||
},
|
||||
schoolId: {
|
||||
impl: new DropdownWidget(this.loadSchoolIdDropdownList)
|
||||
},
|
||||
status: {
|
||||
impl: new DropdownWidget(this.loadStatusDropdownList)
|
||||
},
|
||||
menuBlock: {
|
||||
isInit: false
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 性别下拉数据获取函数
|
||||
*/
|
||||
loadGenderDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictGender(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 性别选中值改变
|
||||
*/
|
||||
onGenderValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所在年级下拉数据获取函数
|
||||
*/
|
||||
loadGradeIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictGrade(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所在年级选中值改变
|
||||
*/
|
||||
onGradeIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 经验等级下拉数据获取函数
|
||||
*/
|
||||
loadExperienceLevelDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictExpLevel(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 经验等级选中值改变
|
||||
*/
|
||||
onExperienceLevelValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所在省份下拉数据获取函数
|
||||
*/
|
||||
loadProvinceIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所在省份选中值改变
|
||||
*/
|
||||
onProvinceIdValueChange (value) {
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formData.Student.cityId = undefined;
|
||||
this.formEditStudent.cityId.impl.dirty = true;
|
||||
this.onCityIdValueChange(this.formData.Student.cityId);
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formData.Student.schoolId = undefined;
|
||||
this.formEditStudent.schoolId.impl.dirty = true;
|
||||
this.onSchoolIdValueChange(this.formData.Student.schoolId);
|
||||
},
|
||||
/**
|
||||
* 所在城市下拉数据获取函数
|
||||
*/
|
||||
loadCityIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
parentId: this.formData.Student.provinceId
|
||||
};
|
||||
if (params.parentId == null || params.parentId === '') {
|
||||
resolve([]);
|
||||
return;
|
||||
}
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所在城市选中值改变
|
||||
*/
|
||||
onCityIdValueChange (value) {
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formData.Student.districtId = undefined;
|
||||
this.formEditStudent.districtId.impl.dirty = true;
|
||||
this.onDistrictIdValueChange(this.formData.Student.districtId);
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formData.Student.schoolId = undefined;
|
||||
this.formEditStudent.schoolId.impl.dirty = true;
|
||||
this.onSchoolIdValueChange(this.formData.Student.schoolId);
|
||||
},
|
||||
/**
|
||||
* 所在区县下拉数据获取函数
|
||||
*/
|
||||
loadDistrictIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
parentId: this.formData.Student.cityId
|
||||
};
|
||||
if (params.parentId == null || params.parentId === '') {
|
||||
resolve([]);
|
||||
return;
|
||||
}
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所在区县选中值改变
|
||||
*/
|
||||
onDistrictIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所属校区下拉数据获取函数
|
||||
*/
|
||||
loadSchoolIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
provinceId: this.formData.Student.provinceId,
|
||||
cityId: this.formData.Student.cityId
|
||||
};
|
||||
DictionaryController.dictSchoolInfo(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属校区选中值改变
|
||||
*/
|
||||
onSchoolIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 学生状态 下拉数据获取函数
|
||||
*/
|
||||
loadStatusDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictStudentStatus(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 学生状态 选中值改变
|
||||
*/
|
||||
onStatusValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新编辑学生
|
||||
*/
|
||||
refreshFormEditStudent (reloadData = false) {
|
||||
this.loadStudentData().then(res => {
|
||||
if (!this.formEditStudent.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formEditStudent.isInit = true;
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 保存
|
||||
*/
|
||||
onUpdateClick () {
|
||||
this.$refs.formEditStudent.validate((valid) => {
|
||||
if (!valid) return;
|
||||
let params = {
|
||||
student: {
|
||||
studentId: this.studentId,
|
||||
loginMobile: this.formData.Student.loginMobile,
|
||||
studentName: this.formData.Student.studentName,
|
||||
provinceId: this.formData.Student.provinceId,
|
||||
cityId: this.formData.Student.cityId,
|
||||
districtId: this.formData.Student.districtId,
|
||||
gender: this.formData.Student.gender,
|
||||
birthday: this.formData.Student.birthday,
|
||||
experienceLevel: this.formData.Student.experienceLevel,
|
||||
totalCoin: this.formData.Student.totalCoin,
|
||||
leftCoin: this.formData.Student.leftCoin,
|
||||
gradeId: this.formData.Student.gradeId,
|
||||
schoolId: this.formData.Student.schoolId,
|
||||
status: this.formData.Student.status
|
||||
}
|
||||
};
|
||||
|
||||
StudentController.update(this, params).then(res => {
|
||||
this.$message.success('保存成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 获取学生数据详细信息
|
||||
*/
|
||||
loadStudentData () {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (!this.formData.Student.isDatasourceInit) {
|
||||
let params = {
|
||||
studentId: this.studentId
|
||||
};
|
||||
StudentController.view(this, params).then(res => {
|
||||
this.formData.Student = {...res.data, isDatasourceInit: true};
|
||||
if (this.formData.Student.genderDictMap) this.formEditStudent.gender.impl.dropdownList = [this.formData.Student.genderDictMap];
|
||||
if (this.formData.Student.gradeIdDictMap) this.formEditStudent.gradeId.impl.dropdownList = [this.formData.Student.gradeIdDictMap];
|
||||
if (this.formData.Student.experienceLevelDictMap) this.formEditStudent.experienceLevel.impl.dropdownList = [this.formData.Student.experienceLevelDictMap];
|
||||
if (this.formData.Student.provinceIdDictMap) this.formEditStudent.provinceId.impl.dropdownList = [this.formData.Student.provinceIdDictMap];
|
||||
if (this.formData.Student.cityIdDictMap) this.formEditStudent.cityId.impl.dropdownList = [this.formData.Student.cityIdDictMap];
|
||||
if (this.formData.Student.districtIdDictMap) this.formEditStudent.districtId.impl.dropdownList = [this.formData.Student.districtIdDictMap];
|
||||
if (this.formData.Student.schoolIdDictMap) this.formEditStudent.schoolId.impl.dropdownList = [this.formData.Student.schoolIdDictMap];
|
||||
if (this.formData.Student.statusDictMap) this.formEditStudent.status.impl.dropdownList = [this.formData.Student.statusDictMap];
|
||||
resolve();
|
||||
}).catch(e => {
|
||||
reject();
|
||||
});
|
||||
} else {
|
||||
resolve();
|
||||
}
|
||||
});
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormEditStudent();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
261
orange-demo-multi-web/src/views/generated/formSchool/index.vue
Normal file
261
orange-demo-multi-web/src/views/generated/formSchool/index.vue
Normal file
@@ -0,0 +1,261 @@
|
||||
<template>
|
||||
<div style="position: relative;">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="所属省份">
|
||||
<el-select class="filter-item" v-model="formSchool.formFilter.provinceId" :clearable="true" filterable
|
||||
placeholder="所属省份" :loading="formSchool.provinceId.impl.loading"
|
||||
@visible-change="formSchool.provinceId.impl.onVisibleChange"
|
||||
@change="onProvinceIdValueChange">
|
||||
<el-option v-for="item in formSchool.provinceId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属城市">
|
||||
<el-select class="filter-item" v-model="formSchool.formFilter.cityId" :clearable="true" filterable
|
||||
placeholder="所属城市" :loading="formSchool.cityId.impl.loading"
|
||||
@visible-change="formSchool.cityId.impl.onVisibleChange"
|
||||
@change="onCityIdValueChange">
|
||||
<el-option v-for="item in formSchool.cityId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="校区名称">
|
||||
<el-input class="filter-item" v-model="formSchool.formFilter.schoolName"
|
||||
:clearable="true" placeholder="校区名称" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormSchool(true)">查询</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSchool:formSchool:formCreateClass')"
|
||||
@click="onFormCreateClassClick()">
|
||||
新建
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formSchool.SchoolInfo.impl.dataList" size="mini" @sort-change="formSchool.SchoolInfo.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="55px" :index="formSchool.SchoolInfo.impl.getTableIndex" />
|
||||
<el-table-column label="学校名称" prop="schoolName">
|
||||
</el-table-column>
|
||||
<el-table-column label="所在省份" prop="provinceIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="所在城市" prop="cityIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onFormEditSchoolClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSchool:formSchool:formEditSchool')">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSchool:formSchool:delete')">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formSchool.SchoolInfo.impl.totalCount"
|
||||
:current-page="formSchool.SchoolInfo.impl.currentPage"
|
||||
:page-size="formSchool.SchoolInfo.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formSchool.SchoolInfo.impl.onCurrentPageChange"
|
||||
@size-change="formSchool.SchoolInfo.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { SchoolInfoController, DictionaryController } from '@/api';
|
||||
import formCreateSchool from '@/views/generated/formCreateSchool';
|
||||
import formEditSchool from '@/views/generated/formEditSchool';
|
||||
|
||||
export default {
|
||||
name: 'formSchool',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formSchool: {
|
||||
formFilter: {
|
||||
provinceId: undefined,
|
||||
cityId: undefined,
|
||||
schoolName: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
provinceId: undefined,
|
||||
cityId: undefined,
|
||||
schoolName: undefined
|
||||
},
|
||||
provinceId: {
|
||||
impl: new DropdownWidget(this.loadProvinceIdDropdownList)
|
||||
},
|
||||
cityId: {
|
||||
impl: new DropdownWidget(this.loadCityIdDropdownList)
|
||||
},
|
||||
SchoolInfo: {
|
||||
impl: new TableWidget(this.loadSchoolInfoData, this.loadSchoolInfoVerify, true)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 校区数据数据获取函数，返回Primise
|
||||
*/
|
||||
loadSchoolInfoData (params) {
|
||||
if (params == null) params = {};
|
||||
params = {
|
||||
...params,
|
||||
schoolInfoFilter: {
|
||||
schoolName: this.formSchool.formFilterCopy.schoolName,
|
||||
provinceId: this.formSchool.formFilterCopy.provinceId,
|
||||
cityId: this.formSchool.formFilterCopy.cityId
|
||||
}
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
SchoolInfoController.list(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 校区数据数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadSchoolInfoVerify () {
|
||||
this.formSchool.formFilterCopy.schoolName = this.formSchool.formFilter.schoolName;
|
||||
this.formSchool.formFilterCopy.provinceId = this.formSchool.formFilter.provinceId;
|
||||
this.formSchool.formFilterCopy.cityId = this.formSchool.formFilter.cityId;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 所属省份下拉数据获取函数
|
||||
*/
|
||||
loadProvinceIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属省份选中值改变
|
||||
*/
|
||||
onProvinceIdValueChange (value) {
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formSchool.formFilter.cityId = undefined;
|
||||
this.formSchool.cityId.impl.dirty = true;
|
||||
this.onCityIdValueChange(this.formSchool.formFilter.cityId);
|
||||
},
|
||||
/**
|
||||
* 所属城市下拉数据获取函数
|
||||
*/
|
||||
loadCityIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
parentId: this.formSchool.formFilter.provinceId
|
||||
};
|
||||
if (params.parentId == null || params.parentId === '') {
|
||||
resolve([]);
|
||||
return;
|
||||
}
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属城市选中值改变
|
||||
*/
|
||||
onCityIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新校区管理
|
||||
*/
|
||||
refreshFormSchool (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.formSchool.SchoolInfo.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formSchool.SchoolInfo.impl.refreshTable();
|
||||
}
|
||||
if (!this.formSchool.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formSchool.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 新建
|
||||
*/
|
||||
onFormCreateClassClick () {
|
||||
let params = {};
|
||||
|
||||
this.$dialog.show('新建', formCreateSchool, {
|
||||
area: ['600px']
|
||||
}, params).then(res => {
|
||||
this.refreshFormSchool();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 编辑
|
||||
*/
|
||||
onFormEditSchoolClick (row) {
|
||||
let params = {
|
||||
schoolId: row.schoolId
|
||||
};
|
||||
|
||||
this.$dialog.show('编辑', formEditSchool, {
|
||||
area: ['600px']
|
||||
}, params).then(res => {
|
||||
this.formSchool.SchoolInfo.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
onDeleteClick (row) {
|
||||
let params = {
|
||||
schoolId: row.schoolId
|
||||
};
|
||||
|
||||
this.$confirm('是否删除此校区？').then(res => {
|
||||
SchoolInfoController.delete(this, params).then(res => {
|
||||
this.$message.success('删除成功');
|
||||
this.formSchool.SchoolInfo.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormSchool();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormSchool();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,279 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="所属年级">
|
||||
<el-select class="filter-item" v-model="formSetClassCourse.formFilter.gradeId" :clearable="true" filterable
|
||||
placeholder="所属年级" :loading="formSetClassCourse.gradeId.impl.loading"
|
||||
@visible-change="formSetClassCourse.gradeId.impl.onVisibleChange"
|
||||
@change="onGradeIdValueChange">
|
||||
<el-option v-for="item in formSetClassCourse.gradeId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属科目">
|
||||
<el-select class="filter-item" v-model="formSetClassCourse.formFilter.subjectId" :clearable="true" filterable
|
||||
placeholder="所属科目" :loading="formSetClassCourse.subjectId.impl.loading"
|
||||
@visible-change="formSetClassCourse.subjectId.impl.onVisibleChange"
|
||||
@change="onSubjectIdValueChange">
|
||||
<el-option v-for="item in formSetClassCourse.subjectId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="课程难度">
|
||||
<el-select class="filter-item" v-model="formSetClassCourse.formFilter.difficulty" :clearable="true" filterable
|
||||
placeholder="课程难度" :loading="formSetClassCourse.difficulty.impl.loading"
|
||||
@visible-change="formSetClassCourse.difficulty.impl.onVisibleChange"
|
||||
@change="onDifficultyValueChange">
|
||||
<el-option v-for="item in formSetClassCourse.difficulty.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="课程名称">
|
||||
<el-input class="filter-item" v-model="formSetClassCourse.formFilter.courseName"
|
||||
:clearable="true" placeholder="课程名称" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormSetClassCourse(true)">查询</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="tableSelectRowList.length <= 0 || !checkPermCodeExist('formSetClassCourse:formSetClassCourse:addClassCourse')"
|
||||
@click="onAddClassCourseClick()">
|
||||
添加
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formSetClassCourse.Course.impl.dataList" size="mini" @sort-change="formSetClassCourse.Course.impl.onSortChange"
|
||||
@selection-change="onCourseSelectionChange" header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" type="index" header-align="center" align="center" width="55px" :index="formSetClassCourse.Course.impl.getTableIndex" />
|
||||
<el-table-column type="selection" header-align="center" align="center" width="55px" />
|
||||
<el-table-column label="课程名称" prop="courseName">
|
||||
</el-table-column>
|
||||
<el-table-column label="课程难度" prop="difficultyDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属年级" prop="gradeIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属学科" prop="subjectIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="课时数量" prop="classHour">
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" prop="createTime">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formSetClassCourse.Course.impl.totalCount"
|
||||
:current-page="formSetClassCourse.Course.impl.currentPage"
|
||||
:page-size="formSetClassCourse.Course.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formSetClassCourse.Course.impl.onCurrentPageChange"
|
||||
@size-change="formSetClassCourse.Course.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<label v-if="closeVisible == '1'" class="page-close-box">
|
||||
<el-button type="text" @click="onCancel(true)" icon="el-icon-close" />
|
||||
</label>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { StudentClassController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formSetClassCourse',
|
||||
props: {
|
||||
classId: {
|
||||
default: undefined
|
||||
},
|
||||
closeVisible: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin],
|
||||
data () {
|
||||
return {
|
||||
tableSelectRowList: [],
|
||||
formSetClassCourse: {
|
||||
formFilter: {
|
||||
gradeId: undefined,
|
||||
subjectId: undefined,
|
||||
difficulty: undefined,
|
||||
courseName: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
gradeId: undefined,
|
||||
subjectId: undefined,
|
||||
difficulty: undefined,
|
||||
courseName: undefined
|
||||
},
|
||||
gradeId: {
|
||||
impl: new DropdownWidget(this.loadGradeIdDropdownList)
|
||||
},
|
||||
subjectId: {
|
||||
impl: new DropdownWidget(this.loadSubjectIdDropdownList)
|
||||
},
|
||||
difficulty: {
|
||||
impl: new DropdownWidget(this.loadDifficultyDropdownList)
|
||||
},
|
||||
Course: {
|
||||
impl: new TableWidget(this.loadCourseData, this.loadCourseVerify, true)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
this.removeCachePage(this.$options.name);
|
||||
this.refreshParentCachedPage = isSuccess;
|
||||
this.$router.go(-1);
|
||||
},
|
||||
onCourseSelectionChange (values) {
|
||||
this.tableSelectRowList = values;
|
||||
},
|
||||
/**
|
||||
* 班级课程数据获取函数，返回Primise
|
||||
*/
|
||||
loadCourseData (params) {
|
||||
if (params == null) params = {};
|
||||
params = {
|
||||
...params,
|
||||
courseFilter: {
|
||||
courseName: this.formSetClassCourse.formFilterCopy.courseName,
|
||||
difficulty: this.formSetClassCourse.formFilterCopy.difficulty,
|
||||
gradeId: this.formSetClassCourse.formFilterCopy.gradeId,
|
||||
subjectId: this.formSetClassCourse.formFilterCopy.subjectId
|
||||
},
|
||||
classId: this.classId
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
StudentClassController.listNotInClassCourse(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 班级课程数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadCourseVerify () {
|
||||
this.formSetClassCourse.formFilterCopy.courseName = this.formSetClassCourse.formFilter.courseName;
|
||||
this.formSetClassCourse.formFilterCopy.difficulty = this.formSetClassCourse.formFilter.difficulty;
|
||||
this.formSetClassCourse.formFilterCopy.gradeId = this.formSetClassCourse.formFilter.gradeId;
|
||||
this.formSetClassCourse.formFilterCopy.subjectId = this.formSetClassCourse.formFilter.subjectId;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 所属年级下拉数据获取函数
|
||||
*/
|
||||
loadGradeIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictGrade(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属年级选中值改变
|
||||
*/
|
||||
onGradeIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 所属科目下拉数据获取函数
|
||||
*/
|
||||
loadSubjectIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictSubject(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属科目选中值改变
|
||||
*/
|
||||
onSubjectIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 课程难度下拉数据获取函数
|
||||
*/
|
||||
loadDifficultyDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictCourseDifficult(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 课程难度选中值改变
|
||||
*/
|
||||
onDifficultyValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新设置班级课程
|
||||
*/
|
||||
refreshFormSetClassCourse (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.formSetClassCourse.Course.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formSetClassCourse.Course.impl.refreshTable();
|
||||
}
|
||||
if (!this.formSetClassCourse.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formSetClassCourse.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 添加
|
||||
*/
|
||||
onAddClassCourseClick () {
|
||||
let params = {
|
||||
classId: this.classId,
|
||||
classCourseList: this.tableSelectRowList.map((item) => {
|
||||
return {
|
||||
courseId: item.courseId
|
||||
};
|
||||
})
|
||||
};
|
||||
|
||||
StudentClassController.addClassCourse(this, params).then(res => {
|
||||
this.$message.success('添加成功');
|
||||
this.refreshFormSetClassCourse();
|
||||
}).catch(e => {});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormSetClassCourse(true);
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormSetClassCourse();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,213 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="所属校区">
|
||||
<el-select class="filter-item" v-model="formSetClassStudent.formFilter.schoolId" :clearable="true" filterable
|
||||
placeholder="所属校区" :loading="formSetClassStudent.schoolId.impl.loading"
|
||||
@visible-change="formSetClassStudent.schoolId.impl.onVisibleChange"
|
||||
@change="onSchoolIdValueChange">
|
||||
<el-option v-for="item in formSetClassStudent.schoolId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="学生姓名">
|
||||
<el-input class="filter-item" v-model="formSetClassStudent.formFilter.searchString"
|
||||
:clearable="true" placeholder="输入学生姓名 / 手机号码模糊查询" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormSetClassStudent(true)">查询</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="tableSelectRowList.length <= 0 || !checkPermCodeExist('formSetClassStudent:formSetClassStudent:addClassStudent')"
|
||||
@click="onAddClassStudentClick()">
|
||||
添加
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formSetClassStudent.Student.impl.dataList" size="mini" @sort-change="formSetClassStudent.Student.impl.onSortChange"
|
||||
@selection-change="onStudentSelectionChange" header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" type="index" header-align="center" align="center" width="55px" :index="formSetClassStudent.Student.impl.getTableIndex" />
|
||||
<el-table-column type="selection" header-align="center" align="center" width="55px" />
|
||||
<el-table-column label="姓名" prop="studentName">
|
||||
</el-table-column>
|
||||
<el-table-column label="手机号码" prop="loginMobile">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属年级" prop="gradeIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属校区" prop="schoolIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="经验等级" prop="experienceLevelDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="注册时间" prop="registerTime">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.registerTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formSetClassStudent.Student.impl.totalCount"
|
||||
:current-page="formSetClassStudent.Student.impl.currentPage"
|
||||
:page-size="formSetClassStudent.Student.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formSetClassStudent.Student.impl.onCurrentPageChange"
|
||||
@size-change="formSetClassStudent.Student.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<label v-if="closeVisible == '1'" class="page-close-box">
|
||||
<el-button type="text" @click="onCancel(true)" icon="el-icon-close" />
|
||||
</label>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { StudentClassController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formSetClassStudent',
|
||||
props: {
|
||||
classId: {
|
||||
default: undefined
|
||||
},
|
||||
closeVisible: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin],
|
||||
data () {
|
||||
return {
|
||||
tableSelectRowList: [],
|
||||
formSetClassStudent: {
|
||||
formFilter: {
|
||||
schoolId: undefined,
|
||||
searchString: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
schoolId: undefined,
|
||||
searchString: undefined
|
||||
},
|
||||
schoolId: {
|
||||
impl: new DropdownWidget(this.loadSchoolIdDropdownList)
|
||||
},
|
||||
Student: {
|
||||
impl: new TableWidget(this.loadStudentData, this.loadStudentVerify, true)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
this.removeCachePage(this.$options.name);
|
||||
this.refreshParentCachedPage = isSuccess;
|
||||
this.$router.go(-1);
|
||||
},
|
||||
onStudentSelectionChange (values) {
|
||||
this.tableSelectRowList = values;
|
||||
},
|
||||
/**
|
||||
* 班级学生数据获取函数，返回Primise
|
||||
*/
|
||||
loadStudentData (params) {
|
||||
if (params == null) params = {};
|
||||
params = {
|
||||
...params,
|
||||
studentFilter: {
|
||||
schoolId: this.formSetClassStudent.formFilterCopy.schoolId,
|
||||
searchString: this.formSetClassStudent.formFilterCopy.searchString
|
||||
},
|
||||
classId: this.classId
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
StudentClassController.listNotInClassStudent(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 班级学生数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadStudentVerify () {
|
||||
this.formSetClassStudent.formFilterCopy.schoolId = this.formSetClassStudent.formFilter.schoolId;
|
||||
this.formSetClassStudent.formFilterCopy.searchString = this.formSetClassStudent.formFilter.searchString;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 所属校区下拉数据获取函数
|
||||
*/
|
||||
loadSchoolIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictSchoolInfo(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属校区选中值改变
|
||||
*/
|
||||
onSchoolIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新设置班级学生
|
||||
*/
|
||||
refreshFormSetClassStudent (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.formSetClassStudent.Student.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formSetClassStudent.Student.impl.refreshTable();
|
||||
}
|
||||
if (!this.formSetClassStudent.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formSetClassStudent.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 添加
|
||||
*/
|
||||
onAddClassStudentClick () {
|
||||
let params = {
|
||||
classId: this.classId,
|
||||
classStudentList: this.tableSelectRowList.map((item) => {
|
||||
return {
|
||||
studentId: item.studentId
|
||||
};
|
||||
})
|
||||
};
|
||||
|
||||
StudentClassController.addClassStudent(this, params).then(res => {
|
||||
this.$message.success('添加成功');
|
||||
this.refreshFormSetClassStudent();
|
||||
}).catch(e => {});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormSetClassStudent(true);
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormSetClassStudent();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
325
orange-demo-multi-web/src/views/generated/formStudent/index.vue
Normal file
325
orange-demo-multi-web/src/views/generated/formStudent/index.vue
Normal file
@@ -0,0 +1,325 @@
|
||||
<template>
|
||||
<div style="position: relative;">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="所属省份">
|
||||
<el-select class="filter-item" v-model="formStudent.formFilter.provinceId" :clearable="true" filterable
|
||||
placeholder="所属省份" :loading="formStudent.provinceId.impl.loading"
|
||||
@visible-change="formStudent.provinceId.impl.onVisibleChange"
|
||||
@change="onProvinceIdValueChange">
|
||||
<el-option v-for="item in formStudent.provinceId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属城市">
|
||||
<el-select class="filter-item" v-model="formStudent.formFilter.cityId" :clearable="true" filterable
|
||||
placeholder="所属城市" :loading="formStudent.cityId.impl.loading"
|
||||
@visible-change="formStudent.cityId.impl.onVisibleChange"
|
||||
@change="onCityIdValueChange">
|
||||
<el-option v-for="item in formStudent.cityId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属校区">
|
||||
<el-select class="filter-item" v-model="formStudent.formFilter.schoolId" :clearable="true" filterable
|
||||
placeholder="所属校区" :loading="formStudent.schoolId.impl.loading"
|
||||
@visible-change="formStudent.schoolId.impl.onVisibleChange"
|
||||
@change="onSchoolIdValueChange">
|
||||
<el-option v-for="item in formStudent.schoolId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="注册日期">
|
||||
<date-range class="filter-item" v-model="formStudent.formFilter.registerDate" :clearable="true" :allowTypes="['day']" align="left"
|
||||
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
|
||||
format="yyyy-MM-dd" value-format="yyyy-MM-dd hh:mm:ss" />
|
||||
</el-form-item>
|
||||
<el-form-item label="学生姓名">
|
||||
<el-input class="filter-item" v-model="formStudent.formFilter.searchString"
|
||||
:clearable="true" placeholder="输入学生姓名 / 手机号码 模糊查询" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormStudent(true)">查询</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formStudent:formStudent:formCreateStudent')"
|
||||
@click="onFormCreateStudentClick()">
|
||||
新建
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formStudent.Student.impl.dataList" size="mini" @sort-change="formStudent.Student.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="55px" :index="formStudent.Student.impl.getTableIndex" />
|
||||
<el-table-column label="姓名" prop="studentName">
|
||||
</el-table-column>
|
||||
<el-table-column label="手机号码" prop="loginMobile">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属校区" prop="schoolIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="经验等级" prop="experienceLevelDictMap.name" sortable="custom">
|
||||
</el-table-column>
|
||||
<table-progress-column label="学币状态" :min="0" max-column="totalCoin" value-column="leftCoin" />
|
||||
<el-table-column label="状态 " prop="statusDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="注册时间" prop="registerTime">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.registerTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onFormEditStudentClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formStudent:formStudent:formEditStudent')">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formStudent:formStudent:delete')">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formStudent.Student.impl.totalCount"
|
||||
:current-page="formStudent.Student.impl.currentPage"
|
||||
:page-size="formStudent.Student.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formStudent.Student.impl.onCurrentPageChange"
|
||||
@size-change="formStudent.Student.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { StudentController, DictionaryController } from '@/api';
|
||||
import formEditStudent from '@/views/generated/formEditStudent';
|
||||
import formCreateStudent from '@/views/generated/formCreateStudent';
|
||||
|
||||
export default {
|
||||
name: 'formStudent',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formStudent: {
|
||||
formFilter: {
|
||||
provinceId: undefined,
|
||||
cityId: undefined,
|
||||
schoolId: undefined,
|
||||
registerDate: [],
|
||||
searchString: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
provinceId: undefined,
|
||||
cityId: undefined,
|
||||
schoolId: undefined,
|
||||
registerDate: [],
|
||||
searchString: undefined
|
||||
},
|
||||
provinceId: {
|
||||
impl: new DropdownWidget(this.loadProvinceIdDropdownList)
|
||||
},
|
||||
cityId: {
|
||||
impl: new DropdownWidget(this.loadCityIdDropdownList)
|
||||
},
|
||||
schoolId: {
|
||||
impl: new DropdownWidget(this.loadSchoolIdDropdownList)
|
||||
},
|
||||
Student: {
|
||||
impl: new TableWidget(this.loadStudentData, this.loadStudentVerify, true, 'registerTime', 1)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 学生数据数据获取函数，返回Primise
|
||||
*/
|
||||
loadStudentData (params) {
|
||||
if (params == null) params = {};
|
||||
params = {
|
||||
...params,
|
||||
studentFilter: {
|
||||
provinceId: this.formStudent.formFilterCopy.provinceId,
|
||||
cityId: this.formStudent.formFilterCopy.cityId,
|
||||
schoolId: this.formStudent.formFilterCopy.schoolId,
|
||||
registerTimeStart: Array.isArray(this.formStudent.formFilterCopy.registerDate) ? this.formStudent.formFilterCopy.registerDate[0] : undefined,
|
||||
registerTimeEnd: Array.isArray(this.formStudent.formFilterCopy.registerDate) ? this.formStudent.formFilterCopy.registerDate[1] : undefined,
|
||||
searchString: this.formStudent.formFilterCopy.searchString
|
||||
}
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
StudentController.list(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 学生数据数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadStudentVerify () {
|
||||
this.formStudent.formFilterCopy.provinceId = this.formStudent.formFilter.provinceId;
|
||||
this.formStudent.formFilterCopy.cityId = this.formStudent.formFilter.cityId;
|
||||
this.formStudent.formFilterCopy.schoolId = this.formStudent.formFilter.schoolId;
|
||||
this.formStudent.formFilterCopy.registerDate = this.formStudent.formFilter.registerDate;
|
||||
this.formStudent.formFilterCopy.searchString = this.formStudent.formFilter.searchString;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 所属省份下拉数据获取函数
|
||||
*/
|
||||
loadProvinceIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属省份选中值改变
|
||||
*/
|
||||
onProvinceIdValueChange (value) {
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formStudent.formFilter.cityId = undefined;
|
||||
this.formStudent.cityId.impl.dirty = true;
|
||||
this.onCityIdValueChange(this.formStudent.formFilter.cityId);
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formStudent.formFilter.schoolId = undefined;
|
||||
this.formStudent.schoolId.impl.dirty = true;
|
||||
this.onSchoolIdValueChange(this.formStudent.formFilter.schoolId);
|
||||
},
|
||||
/**
|
||||
* 所属城市下拉数据获取函数
|
||||
*/
|
||||
loadCityIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
parentId: this.formStudent.formFilter.provinceId
|
||||
};
|
||||
if (params.parentId == null || params.parentId === '') {
|
||||
resolve([]);
|
||||
return;
|
||||
}
|
||||
DictionaryController.dictAreaCodeByParentId(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属城市选中值改变
|
||||
*/
|
||||
onCityIdValueChange (value) {
|
||||
// 清除被过滤组件选中值，并且将被过滤组件的状态设置为dirty
|
||||
this.formStudent.formFilter.schoolId = undefined;
|
||||
this.formStudent.schoolId.impl.dirty = true;
|
||||
this.onSchoolIdValueChange(this.formStudent.formFilter.schoolId);
|
||||
},
|
||||
/**
|
||||
* 所属校区下拉数据获取函数
|
||||
*/
|
||||
loadSchoolIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {
|
||||
provinceId: this.formStudent.formFilter.provinceId,
|
||||
cityId: this.formStudent.formFilter.cityId
|
||||
};
|
||||
DictionaryController.dictSchoolInfo(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属校区选中值改变
|
||||
*/
|
||||
onSchoolIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新学生管理
|
||||
*/
|
||||
refreshFormStudent (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.formStudent.Student.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formStudent.Student.impl.refreshTable();
|
||||
}
|
||||
if (!this.formStudent.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formStudent.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 新建
|
||||
*/
|
||||
onFormCreateStudentClick () {
|
||||
let params = {};
|
||||
|
||||
this.$dialog.show('新建', formCreateStudent, {
|
||||
area: ['800px']
|
||||
}, params).then(res => {
|
||||
this.refreshFormStudent();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 编辑
|
||||
*/
|
||||
onFormEditStudentClick (row) {
|
||||
let params = {
|
||||
studentId: row.studentId
|
||||
};
|
||||
|
||||
this.$dialog.show('编辑', formEditStudent, {
|
||||
area: ['800px']
|
||||
}, params).then(res => {
|
||||
this.formStudent.Student.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
onDeleteClick (row) {
|
||||
let params = {
|
||||
studentId: row.studentId
|
||||
};
|
||||
|
||||
this.$confirm('是否删除此学生？').then(res => {
|
||||
StudentController.delete(this, params).then(res => {
|
||||
this.$message.success('删除成功');
|
||||
this.formStudent.Student.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormStudent();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormStudent();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,238 @@
|
||||
<template>
|
||||
<div style="position: relative;">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="统计日期">
|
||||
<date-range class="filter-item" v-model="formStudentActionDetail.formFilter.statsDate" :clearable="true" :allowTypes="['day']" align="left"
|
||||
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
|
||||
format="yyyy-MM-dd" value-format="yyyy-MM-dd hh:mm:ss" />
|
||||
</el-form-item>
|
||||
<el-form-item label="所属年级">
|
||||
<el-select class="filter-item" v-model="formStudentActionDetail.formFilter.gradeId" :clearable="true" filterable
|
||||
placeholder="所属年级" :loading="formStudentActionDetail.gradeId.impl.loading"
|
||||
@visible-change="formStudentActionDetail.gradeId.impl.onVisibleChange"
|
||||
@change="onGradeIdValueChange">
|
||||
<el-option v-for="item in formStudentActionDetail.gradeId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="行为类型">
|
||||
<el-select class="filter-item" v-model="formStudentActionDetail.formFilter.actionType" :clearable="true" filterable
|
||||
placeholder="行为类型" :loading="formStudentActionDetail.actionType.impl.loading"
|
||||
@visible-change="formStudentActionDetail.actionType.impl.onVisibleChange"
|
||||
@change="onActionTypeValueChange">
|
||||
<el-option v-for="item in formStudentActionDetail.actionType.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormStudentActionDetail(true)">查询</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formStudentActionDetail.StudentActionTrans.impl.dataList" size="mini" @sort-change="formStudentActionDetail.StudentActionTrans.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="55px" :index="formStudentActionDetail.StudentActionTrans.impl.getTableIndex" />
|
||||
<el-table-column label="学生名称" prop="studentName">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属校区" prop="schoolIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属年级" prop="gradeIdDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="行为类型" prop="actionTypeDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="设备类型" prop="deviceTypeDictMap.name">
|
||||
</el-table-column>
|
||||
<el-table-column label="观看视频" prop="watchVideoSeconds">
|
||||
</el-table-column>
|
||||
<el-table-column label="购买鲜花" prop="flowerCount">
|
||||
</el-table-column>
|
||||
<el-table-column label="购买作业" prop="paperCount">
|
||||
</el-table-column>
|
||||
<el-table-column label="购买视频" prop="videoCount">
|
||||
</el-table-column>
|
||||
<el-table-column label="购买课程" prop="courseCount">
|
||||
</el-table-column>
|
||||
<el-table-column label="充值学币" prop="coinCount">
|
||||
</el-table-column>
|
||||
<el-table-column label="发生时间" prop="createTime">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formStudentActionDetail.StudentActionTrans.impl.totalCount"
|
||||
:current-page="formStudentActionDetail.StudentActionTrans.impl.currentPage"
|
||||
:page-size="formStudentActionDetail.StudentActionTrans.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formStudentActionDetail.StudentActionTrans.impl.onCurrentPageChange"
|
||||
@size-change="formStudentActionDetail.StudentActionTrans.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<label v-if="closeVisible == '1'" class="page-close-box">
|
||||
<el-button type="text" @click="onCancel(true)" icon="el-icon-close" />
|
||||
</label>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { DictionaryController, StudentActionTransController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formStudentActionDetail',
|
||||
props: {
|
||||
actionType: {
|
||||
default: undefined
|
||||
},
|
||||
createTime: {
|
||||
default: undefined
|
||||
},
|
||||
gradeId: {
|
||||
default: undefined
|
||||
},
|
||||
closeVisible: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin],
|
||||
data () {
|
||||
return {
|
||||
formStudentActionDetail: {
|
||||
formFilter: {
|
||||
statsDate: this.createTime,
|
||||
gradeId: this.parseParams(this.gradeId, 'integer'),
|
||||
actionType: this.parseParams(this.actionType, 'integer')
|
||||
},
|
||||
formFilterCopy: {
|
||||
statsDate: this.createTime,
|
||||
gradeId: this.parseParams(this.gradeId, 'integer'),
|
||||
actionType: this.parseParams(this.actionType, 'integer')
|
||||
},
|
||||
gradeId: {
|
||||
impl: new DropdownWidget(this.loadGradeIdDropdownList)
|
||||
},
|
||||
actionType: {
|
||||
impl: new DropdownWidget(this.loadActionTypeDropdownList)
|
||||
},
|
||||
StudentActionTrans: {
|
||||
impl: new TableWidget(this.loadStudentActionTransData, this.loadStudentActionTransVerify, true, 'createTime', 1)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
this.removeCachePage(this.$options.name);
|
||||
this.refreshParentCachedPage = isSuccess;
|
||||
this.$router.go(-1);
|
||||
},
|
||||
/**
|
||||
* 学生行为流水数据获取函数，返回Primise
|
||||
*/
|
||||
loadStudentActionTransData (params) {
|
||||
if (params == null) params = {};
|
||||
params = {
|
||||
...params,
|
||||
studentActionTransFilter: {
|
||||
gradeId: this.formStudentActionDetail.formFilterCopy.gradeId,
|
||||
actionType: this.formStudentActionDetail.formFilterCopy.actionType,
|
||||
createTimeStart: Array.isArray(this.formStudentActionDetail.formFilterCopy.statsDate) ? this.formStudentActionDetail.formFilterCopy.statsDate[0] : undefined,
|
||||
createTimeEnd: Array.isArray(this.formStudentActionDetail.formFilterCopy.statsDate) ? this.formStudentActionDetail.formFilterCopy.statsDate[1] : undefined
|
||||
}
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
StudentActionTransController.list(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 学生行为流水数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadStudentActionTransVerify () {
|
||||
this.formStudentActionDetail.formFilterCopy.gradeId = this.formStudentActionDetail.formFilter.gradeId;
|
||||
this.formStudentActionDetail.formFilterCopy.actionType = this.formStudentActionDetail.formFilter.actionType;
|
||||
this.formStudentActionDetail.formFilterCopy.statsDate = this.formStudentActionDetail.formFilter.statsDate;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 所属年级下拉数据获取函数
|
||||
*/
|
||||
loadGradeIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictGrade(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属年级选中值改变
|
||||
*/
|
||||
onGradeIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 行为类型下拉数据获取函数
|
||||
*/
|
||||
loadActionTypeDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictStudentActionType(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 行为类型选中值改变
|
||||
*/
|
||||
onActionTypeValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新学生行为详情
|
||||
*/
|
||||
refreshFormStudentActionDetail (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.formStudentActionDetail.StudentActionTrans.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formStudentActionDetail.StudentActionTrans.impl.refreshTable();
|
||||
}
|
||||
if (!this.formStudentActionDetail.isInit) {
|
||||
// 初始化下拉数据
|
||||
this.formStudentActionDetail.gradeId.impl.onVisibleChange(true).catch(e => {});
|
||||
this.formStudentActionDetail.actionType.impl.onVisibleChange(true).catch(e => {});
|
||||
}
|
||||
this.formStudentActionDetail.isInit = true;
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormStudentActionDetail();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormStudentActionDetail();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,313 @@
|
||||
<template>
|
||||
<div style="position: relative;">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="统计日期">
|
||||
<date-range class="filter-item" v-model="formStudentActionStats.formFilter.statsDate" :clearable="true" :allowTypes="['day']" align="left"
|
||||
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
|
||||
format="yyyy-MM-dd" value-format="yyyy-MM-dd hh:mm:ss" />
|
||||
</el-form-item>
|
||||
<el-form-item label="年级">
|
||||
<el-select class="filter-item" v-model="formStudentActionStats.formFilter.gradeId" :clearable="true" filterable
|
||||
placeholder="年级" :loading="formStudentActionStats.gradeId.impl.loading"
|
||||
@visible-change="formStudentActionStats.gradeId.impl.onVisibleChange"
|
||||
@change="onGradeIdValueChange">
|
||||
<el-option v-for="item in formStudentActionStats.gradeId.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormStudentActionStats(true)">查询</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formStudentActionStats.StudentActionStats.impl.dataList" size="mini" @sort-change="formStudentActionStats.StudentActionStats.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="55px" :index="formStudentActionStats.StudentActionStats.impl.getTableIndex" />
|
||||
<el-table-column label="统计日期">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.statsDate, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="所属年级" prop="gradeIdDictMap.name" />
|
||||
<el-table-column label="购课学币" prop="buyCourseAmount">
|
||||
<template slot-scope="scope">
|
||||
<a href="javascript:void(0);" @click="onFormBuyCourseDetailClick(scope.row)">{{scope.row.buyCourseAmount}}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="购买视频" prop="buyVideoAmount">
|
||||
<template slot-scope="scope">
|
||||
<a href="javascript:void(0);" @click="onFormBuyVideoDetailClick(scope.row)">{{scope.row.buyVideoAmount}}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="购买作业" prop="buyPaperAmount">
|
||||
<template slot-scope="scope">
|
||||
<a href="javascript:void(0);" @click="onFormBuyPaperDetailClick(scope.row)">{{scope.row.buyPaperAmount}}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="购买鲜花" prop="buyFlowerAmount">
|
||||
<template slot-scope="scope">
|
||||
<a href="javascript:void(0);" @click="onFormBuyFlowerDetailClick(scope.row)">{{scope.row.buyFlowerAmount}}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="充值学币" prop="rechargeCoinAmount">
|
||||
<template slot-scope="scope">
|
||||
<a href="javascript:void(0);" @click="onFormBuyCoinDetailClick(scope.row)">{{scope.row.rechargeCoinAmount}}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="上课次数" prop="doCourseCount">
|
||||
<template slot-scope="scope">
|
||||
<a href="javascript:void(0);" @click="onFormDoCourseDetailClick(scope.row)">{{scope.row.doCourseCount}}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="观看视频" prop="watchVideoCount">
|
||||
<template slot-scope="scope">
|
||||
<a href="javascript:void(0);" @click="onFormWatchVideoDetailClick(scope.row)">{{scope.row.watchVideoCount}}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="做题数量" prop="doExerciseCount">
|
||||
<template slot-scope="scope">
|
||||
<a href="javascript:void(0);" @click="onFormRfreshDetailClick(scope.row)">{{scope.row.doExerciseCount}}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formStudentActionStats.StudentActionStats.impl.totalCount"
|
||||
:current-page="formStudentActionStats.StudentActionStats.impl.currentPage"
|
||||
:page-size="formStudentActionStats.StudentActionStats.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formStudentActionStats.StudentActionStats.impl.onCurrentPageChange"
|
||||
@size-change="formStudentActionStats.StudentActionStats.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { StudentActionStatsController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formStudentActionStats',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formStudentActionStats: {
|
||||
formFilter: {
|
||||
statsDate: [],
|
||||
gradeId: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
statsDate: [],
|
||||
gradeId: undefined
|
||||
},
|
||||
gradeId: {
|
||||
impl: new DropdownWidget(this.loadGradeIdDropdownList)
|
||||
},
|
||||
StudentActionStats: {
|
||||
impl: new TableWidget(this.loadStudentActionStatsData, this.loadStudentActionStatsVerify, true, 'statsDate', 1)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 学生行为统计数据获取函数，返回Primise
|
||||
*/
|
||||
loadStudentActionStatsData (params) {
|
||||
if (params == null) params = {};
|
||||
params = {
|
||||
...params,
|
||||
groupParam: [
|
||||
{
|
||||
fieldName: 'statsDate'
|
||||
},
|
||||
{
|
||||
fieldName: 'gradeId'
|
||||
}
|
||||
],
|
||||
studentActionStatsFilter: {
|
||||
statsDateStart: Array.isArray(this.formStudentActionStats.formFilterCopy.statsDate) ? this.formStudentActionStats.formFilterCopy.statsDate[0] : undefined,
|
||||
statsDateEnd: Array.isArray(this.formStudentActionStats.formFilterCopy.statsDate) ? this.formStudentActionStats.formFilterCopy.statsDate[1] : undefined,
|
||||
gradeId: this.formStudentActionStats.formFilterCopy.gradeId
|
||||
}
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
StudentActionStatsController.listWithGroup(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 学生行为统计数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadStudentActionStatsVerify () {
|
||||
this.formStudentActionStats.formFilterCopy.statsDate = this.formStudentActionStats.formFilter.statsDate;
|
||||
this.formStudentActionStats.formFilterCopy.gradeId = this.formStudentActionStats.formFilter.gradeId;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 年级下拉数据获取函数
|
||||
*/
|
||||
loadGradeIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictGrade(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 年级选中值改变
|
||||
*/
|
||||
onGradeIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新学生行为统计
|
||||
*/
|
||||
refreshFormStudentActionStats (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.formStudentActionStats.StudentActionStats.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formStudentActionStats.StudentActionStats.impl.refreshTable();
|
||||
}
|
||||
if (!this.formStudentActionStats.isInit) {
|
||||
// 初始化下拉数据
|
||||
}
|
||||
this.formStudentActionStats.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 学生行为详情
|
||||
*/
|
||||
onFormBuyCourseDetailClick (row) {
|
||||
let params = {
|
||||
actionType: this.StudentActionType.BUY_COURSE,
|
||||
createTime: this.getDateRangeFilter(row.statsDate),
|
||||
gradeId: row.gradeId
|
||||
};
|
||||
|
||||
params.closeVisible = 1;
|
||||
this.$router.push({name: 'formStudentActionDetail', query: params});
|
||||
},
|
||||
/**
|
||||
* 学生行为详情
|
||||
*/
|
||||
onFormBuyVideoDetailClick (row) {
|
||||
let params = {
|
||||
actionType: this.StudentActionType.BUY_VIDEO_COURSE,
|
||||
createTime: this.getDateRangeFilter(row.statsDate),
|
||||
gradeId: row.gradeId
|
||||
};
|
||||
|
||||
params.closeVisible = 1;
|
||||
this.$router.push({name: 'formStudentActionDetail', query: params});
|
||||
},
|
||||
/**
|
||||
* 学生行为详情
|
||||
*/
|
||||
onFormBuyFlowerDetailClick (row) {
|
||||
let params = {
|
||||
actionType: this.StudentActionType.BUY_FLOWER,
|
||||
createTime: this.getDateRangeFilter(row.statsDate),
|
||||
gradeId: row.gradeId
|
||||
};
|
||||
|
||||
params.closeVisible = 1;
|
||||
this.$router.push({name: 'formStudentActionDetail', query: params});
|
||||
},
|
||||
/**
|
||||
* 学生行为详情
|
||||
*/
|
||||
onFormBuyPaperDetailClick (row) {
|
||||
let params = {
|
||||
actionType: this.StudentActionType.BUY_PAPER,
|
||||
createTime: this.getDateRangeFilter(row.statsDate),
|
||||
gradeId: row.gradeId
|
||||
};
|
||||
|
||||
params.closeVisible = 1;
|
||||
this.$router.push({name: 'formStudentActionDetail', query: params});
|
||||
},
|
||||
/**
|
||||
* 学生行为详情
|
||||
*/
|
||||
onFormBuyCoinDetailClick (row) {
|
||||
let params = {
|
||||
actionType: this.StudentActionType.RECHARGE,
|
||||
createTime: this.getDateRangeFilter(row.statsDate),
|
||||
gradeId: row.gradeId
|
||||
};
|
||||
|
||||
params.closeVisible = 1;
|
||||
this.$router.push({name: 'formStudentActionDetail', query: params});
|
||||
},
|
||||
/**
|
||||
* 学生行为详情
|
||||
*/
|
||||
onFormDoCourseDetailClick (row) {
|
||||
let params = {
|
||||
actionType: this.StudentActionType.SIGNIN_COURSE,
|
||||
createTime: this.getDateRangeFilter(row.statsDate),
|
||||
gradeId: row.gradeId
|
||||
};
|
||||
|
||||
params.closeVisible = 1;
|
||||
this.$router.push({name: 'formStudentActionDetail', query: params});
|
||||
},
|
||||
/**
|
||||
* 学生行为详情
|
||||
*/
|
||||
onFormWatchVideoDetailClick (row) {
|
||||
let params = {
|
||||
actionType: this.StudentActionType.WATCH_VIDEO,
|
||||
createTime: this.getDateRangeFilter(row.statsDate),
|
||||
gradeId: row.gradeId
|
||||
};
|
||||
|
||||
params.closeVisible = 1;
|
||||
this.$router.push({name: 'formStudentActionDetail', query: params});
|
||||
},
|
||||
/**
|
||||
* 学生行为详情
|
||||
*/
|
||||
onFormRfreshDetailClick (row) {
|
||||
let params = {
|
||||
actionType: this.StudentActionType.DO_PAPER,
|
||||
createTime: this.getDateRangeFilter(row.statsDate),
|
||||
gradeId: row.gradeId
|
||||
};
|
||||
|
||||
params.closeVisible = 1;
|
||||
this.$router.push({name: 'formStudentActionDetail', query: params});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormStudentActionStats();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.refreshFormStudentActionStats();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,53 @@
|
||||
<template>
|
||||
<el-breadcrumb class="app-breadcrumb" separator="/">
|
||||
<el-breadcrumb-item :to="{name: 'welcome'}" :replace="true">
|
||||
<i class="el-icon-s-home" style="margin-right: 5px;" />主页
|
||||
</el-breadcrumb-item>
|
||||
<el-breadcrumb-item v-for="item in menuPathList" :key="item.menuId">
|
||||
{{item.menuName}}
|
||||
</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters, mapMutations } from 'vuex';
|
||||
|
||||
export default {
|
||||
created () {
|
||||
this.getBreadcrumb();
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
menuPathList: null
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
$route (newValue) {
|
||||
if (newValue.name === 'welcome') this.setCurrentMenuId(null);
|
||||
this.getBreadcrumb();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getBreadcrumb () {
|
||||
this.menuPathList = this.getCurrentMenuPath;
|
||||
},
|
||||
...mapMutations(['setCurrentMenuId'])
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['getCurrentMenuPath'])
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
.app-breadcrumb.el-breadcrumb {
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
line-height: 60px;
|
||||
margin-left: 10px;
|
||||
.no-redirect {
|
||||
color: #97a8be;
|
||||
cursor: text;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,95 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form ref="formModifyPassword" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
|
||||
label-width="120px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="旧密码" prop="oldPassword">
|
||||
<el-input class="input-item" v-model.trim="formData.oldPassword"
|
||||
:clearable="true" placeholder="旧密码" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="新密码" prop="password">
|
||||
<el-input class="input-item" v-model.trim="formData.password"
|
||||
:clearable="true" placeholder="新密码" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="新密码确认" prop="repeatPassword">
|
||||
<el-input class="input-item" v-model.trim="formData.repeatPassword"
|
||||
:clearable="true" placeholder="新密码确认" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row class="no-scroll flex-box" type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" :plain="true"
|
||||
@click="onCancel(false)">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" @click="onSave()">
|
||||
保存
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { SystemController } from '@/api';
|
||||
import { encrypt } from '@/utils';
|
||||
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
oldPassword: undefined,
|
||||
password: undefined,
|
||||
repeatPassword: undefined
|
||||
},
|
||||
rules: {
|
||||
'oldPassword': [
|
||||
{required: true, message: '请输入旧密码', trigger: 'blur'}
|
||||
],
|
||||
'password': [
|
||||
{required: true, message: '请输入新密码', trigger: 'blur'}
|
||||
],
|
||||
'repeatPassword': [
|
||||
{required: true, message: '请输入新密码', trigger: 'blur'}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
onSave () {
|
||||
this.$refs.formModifyPassword.validate((valid) => {
|
||||
if (!valid) return;
|
||||
if (this.formData.password !== this.formData.repeatPassword) {
|
||||
this.$message.error('两次密码输入不一致，请核对！');
|
||||
return;
|
||||
}
|
||||
|
||||
let params = {
|
||||
oldPass: encrypt(this.formData.oldPassword),
|
||||
newPass: encrypt(this.formData.password)
|
||||
};
|
||||
|
||||
SystemController.changePassword(this, params).then(res => {
|
||||
this.$message.success('密码修改成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,59 @@
|
||||
<template>
|
||||
<div class="menu-wrapper">
|
||||
<el-menu-item ref="item" :index="menu.menuId + ''" :key="menu.menuId" v-if="menu.children == null || menu.children.length <= 0">
|
||||
<template slot="title">
|
||||
<i v-if="menu.icon" :class="menu.icon" style="margin-right: 5px; font-size: 18px;" :style="getIconStyle(menu.icon)"></i>
|
||||
<span slot="title" :style="getTextStyle(!menu.icon)">{{menu.menuName}}</span>
|
||||
</template>
|
||||
</el-menu-item>
|
||||
<el-submenu v-else :index="menu.menuId + ''" :key="menu.menuId">
|
||||
<template slot="title">
|
||||
<i v-if="menu.icon" :class="menu.icon" style="margin-right: 5px; font-size: 18px;" :style="getIconStyle(menu.icon)"></i>
|
||||
<span slot="title" :style="getTextStyle(!menu.icon)" v-show="!getCollapse">{{menu.menuName}}</span>
|
||||
</template>
|
||||
<template v-for="child in menu.children">
|
||||
<menu-item class="nest-menu" :menu="child" :isChild="true" :key="child.menuId" />
|
||||
</template>
|
||||
</el-submenu>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters} from 'vuex'
|
||||
export default {
|
||||
name: 'menuItem',
|
||||
props: {
|
||||
menu: {
|
||||
type: Object,
|
||||
required: true,
|
||||
default: undefined
|
||||
},
|
||||
isChild: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getIconStyle (isShow) {
|
||||
if (isShow && this.isChild) {
|
||||
return [
|
||||
{ 'margin-left': '13px' }
|
||||
]
|
||||
}
|
||||
},
|
||||
getTextStyle (isShow) {
|
||||
if (isShow && this.isChild) {
|
||||
return [
|
||||
{ 'padding-left': '13px' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
showText () {
|
||||
return !this.getCollapse;
|
||||
},
|
||||
...mapGetters(['getCollapse'])
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<div style="height: 100%; position: relative;" class="sidebar-bg">
|
||||
<div class="sidebar-title">
|
||||
<img :src="logoImage" style="margin: 20px 60px 10px 60px; width: 80px; height: 80px; border-radius: 50%;" />
|
||||
<p class="sidebar-title-text">{{getProjectName()}}</p>
|
||||
</div>
|
||||
<div style="height: 100%; padding-bottom: 160px;">
|
||||
<el-scrollbar wrap-class="scrollbar_dropdown__wrap" style="height: 100%;">
|
||||
<el-menu ref="menu" mode="vertical" :default-active="getCurrentMenuId" :unique-opened="true" @select="selectMenu"
|
||||
text-color="white" active-text-color="white" :collapse="getCollapse" >
|
||||
<template v-for="menu in getMenuList">
|
||||
<menu-item :menu="menu" :key="menu.menuId" />
|
||||
</template>
|
||||
</el-menu>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import menuItem from './menu-item.vue';
|
||||
import { mapGetters, mapMutations } from 'vuex';
|
||||
import projectConfig from '@/core/config';
|
||||
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
isCollapse: false,
|
||||
collapseLeft: '200px',
|
||||
showCollapseBtn: true,
|
||||
logoImage: require('../../../../assets/img/logo.jpg')
|
||||
}
|
||||
},
|
||||
components: {
|
||||
'menu-item': menuItem
|
||||
},
|
||||
computed: {
|
||||
getCollapseStyle () {
|
||||
return [{
|
||||
left: this.collapseLeft
|
||||
}]
|
||||
},
|
||||
...mapGetters(['getMultiTags', 'getMenuList', 'getCollapse', 'getCurrentMenuPath', 'getCurrentMenuId', 'getMultiColumn'])
|
||||
},
|
||||
methods: {
|
||||
onCollapseChange () {
|
||||
this.showCollapseBtn = false;
|
||||
setTimeout(() => {
|
||||
this.setCollapse(!this.getCollapse);
|
||||
this.collapseLeft = this.getCollapse ? '65px' : '200px';
|
||||
this.showCollapseBtn = true;
|
||||
}, 100);
|
||||
},
|
||||
getProjectName () {
|
||||
if (this.getCollapse) {
|
||||
return projectConfig.projectName.substr(0, 1);
|
||||
} else {
|
||||
return projectConfig.projectName;
|
||||
}
|
||||
},
|
||||
selectMenu (index, path) {
|
||||
if (this.getCurrentMenuId === index) return;
|
||||
// 单页面清空所有tags和cachePage
|
||||
if (!this.getMultiTags) {
|
||||
this.clearAllTags();
|
||||
}
|
||||
this.setCurrentMenuId(index);
|
||||
},
|
||||
...mapMutations(['setCollapse', 'clearAllTags', 'setCurrentMenuId'])
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,70 @@
|
||||
<template>
|
||||
<div class="tags-item">
|
||||
<div style="height: 3px;" class="top" />
|
||||
<span class="title" :style="{'padding-right': supportClose ? '5px' : '10px'}">{{title}}</span>
|
||||
<i :class="{'el-icon-close close': !enterClose, 'el-icon-error': enterClose}" v-show="supportClose"
|
||||
:style="{color: enterClose ? '#F56C6C' : '#333'}" @click.stop="onClose"
|
||||
@mouseenter="() => enterClose = true" @mouseleave="() => enterClose = false" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
title: String,
|
||||
supportClose: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
enterClose: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onClose () {
|
||||
console.log('close-tag-item');
|
||||
this.$emit('close');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '@/assets/style/element-color.scss';
|
||||
.tags-item {
|
||||
height: 40px;
|
||||
line-height: 37px;
|
||||
box-sizing: border-box;
|
||||
display: inline-block;
|
||||
border-right: 1px solid #DCDFE6;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tags-item .title {
|
||||
font-size: 13px;
|
||||
color: #666
|
||||
}
|
||||
|
||||
.close {
|
||||
height: 28px;
|
||||
line-height: 28px;
|
||||
}
|
||||
.tags-item:hover {
|
||||
color: $--color-primary;
|
||||
}
|
||||
.tags-item.active {
|
||||
color: $--color-primary;
|
||||
}
|
||||
.tags-item span {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.tags-item i {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.tags-item.active .top {
|
||||
background: $--color-primary;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,213 @@
|
||||
<template>
|
||||
<div class="tags-panel">
|
||||
<i class="el-icon-d-arrow-left arrow left" @click="beginPos > 0 && beginPos--" />
|
||||
<i class="el-icon-d-arrow-right arrow right" @click="getEndTagPos >= panelWidth && beginPos++" />
|
||||
<div class="main-panel">
|
||||
<div class="scroll-box">
|
||||
<TagItem class="item" title="主页" :class="{active: getCurrentMenuId == null}" v-show="0 >= beginPos" :supportClose="false"
|
||||
@click.native="onTagItemClick(null)" @contextmenu.prevent.native="openMenu(null, $event)" />
|
||||
<TagItem class="item" v-for="(item, index) in tagList" :key="item.menuId" :title="item.menuName"
|
||||
:class="{active: item.menuId === getCurrentMenuId}" v-show="(index + 1) >= beginPos"
|
||||
@close="onTagItemClose(item)" @click.native="onTagItemClick(item)"
|
||||
@contextmenu.prevent.native="openMenu(item, $event)" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="visible" @click.stop="onMenuMaskClick" @contextmenu="openMaskMenu"
|
||||
style="z-index: 99999; position: fixed; background: rgba(0, 0, 0, 0.01); width: 100vw; height: 100vh; top: 0px; left: 0px">
|
||||
<ul class="contextmenu" style="z-index: 99999;" :style="{left: left + 'px', top: top + 'px'}">
|
||||
<li @click="closeSelectTag">关闭</li>
|
||||
<li @click="closeOthersTags">关闭其他</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters, mapMutations } from 'vuex';
|
||||
import TagItem from './tagItem.vue';
|
||||
export default {
|
||||
props: {
|
||||
tagList: Array
|
||||
},
|
||||
components: {
|
||||
TagItem
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
panelWidth: 0,
|
||||
beginPos: 0,
|
||||
visible: false,
|
||||
top: 0,
|
||||
left: 0,
|
||||
selectedItem: undefined
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
openMenu (item, e) {
|
||||
this.visible = true;
|
||||
this.selectedItem = item;
|
||||
this.left = e.clientX;
|
||||
this.top = e.clientY;
|
||||
},
|
||||
openMaskMenu (e) {
|
||||
e.preventDefault();
|
||||
},
|
||||
onMenuMaskClick () {
|
||||
this.visible = false;
|
||||
},
|
||||
closeSelectTag () {
|
||||
if (this.selectedItem != null) this.onTagItemClose(this.selectedItem);
|
||||
this.visible = false;
|
||||
},
|
||||
closeOthersTags () {
|
||||
this.selectedItem ? this.closeOtherTags(this.selectedItem.menuId) : this.clearAllTags();
|
||||
this.visible = false;
|
||||
},
|
||||
onTagItemClose (item) {
|
||||
this.removeTag(item.menuId);
|
||||
},
|
||||
onTagItemClick (item) {
|
||||
this.setCurrentMenuId(item ? item.menuId : undefined);
|
||||
},
|
||||
setCurrentTag (id) {
|
||||
if (id == null) {
|
||||
this.beginPos = 0;
|
||||
return;
|
||||
}
|
||||
|
||||
let curPos = -1;
|
||||
for (let i = 0; i < this.tagList.length; i++) {
|
||||
if (this.tagList[i].menuId === id) {
|
||||
curPos = (i + 1);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (curPos > 0) {
|
||||
if (curPos > this.getEndPos()) {
|
||||
let timer = null;
|
||||
timer = setInterval(() => {
|
||||
let endPos = this.getEndPos();
|
||||
if (endPos >= curPos) {
|
||||
clearInterval(timer);
|
||||
} else {
|
||||
this.beginPos++;
|
||||
}
|
||||
}, 10);
|
||||
}
|
||||
|
||||
if (curPos < this.beginPos) this.beginPos = curPos;
|
||||
}
|
||||
},
|
||||
getEndPos () {
|
||||
let width = 0;
|
||||
let childList = this.$children;
|
||||
let endPos = 0;
|
||||
for (let i = this.beginPos; i < childList.length; i++) {
|
||||
width += childList[i].$el.offsetWidth;
|
||||
if (width >= this.panelWidth) break;
|
||||
endPos = i;
|
||||
}
|
||||
|
||||
return endPos;
|
||||
},
|
||||
onSizeChange () {
|
||||
this.$nextTick(() => {
|
||||
this.panelWidth = this.$el.offsetWidth - 60;
|
||||
});
|
||||
},
|
||||
...mapMutations(['removeTag', 'setCurrentMenuId', 'closeOtherTags', 'clearAllTags'])
|
||||
},
|
||||
computed: {
|
||||
getEndTagPos () {
|
||||
let width = 0;
|
||||
let childList = this.$children;
|
||||
for (let i = this.beginPos; i < childList.length; i++) {
|
||||
width += childList[i].$el.offsetWidth;
|
||||
if (width > this.panelWidth) {
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
return width;
|
||||
},
|
||||
...mapGetters(['getCurrentMenuId'])
|
||||
},
|
||||
mounted () {
|
||||
this.panelWidth = this.$el.offsetWidth - 60;
|
||||
window.addEventListener('resize', this.onSizeChange);
|
||||
// this.getLastPosition();
|
||||
},
|
||||
destroyed () {
|
||||
window.removeEventListener('resize', this.onSizeChange);
|
||||
},
|
||||
watch: {
|
||||
getCurrentMenuId: {
|
||||
handler (newValue) {
|
||||
this.setCurrentTag(newValue);
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tags-panel {
|
||||
height: 42px;
|
||||
border-top: 1px solid #DCDFE6;
|
||||
border-bottom: 1px solid #DCDFE6;
|
||||
background: white;
|
||||
}
|
||||
.main-panel {
|
||||
margin: 0px 30px;
|
||||
}
|
||||
.scroll-box {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
.arrow {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
width: 30px;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
z-index: 100;
|
||||
background: white;
|
||||
box-sizing: border-box;
|
||||
border-left: 1px solid #DCDFE6;
|
||||
border-right: 1px solid #DCDFE6;
|
||||
}
|
||||
.arrow.left {
|
||||
float: left;
|
||||
}
|
||||
.arrow.right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.contextmenu {
|
||||
margin: 0px;
|
||||
background: #FFF;
|
||||
z-index: 2;
|
||||
position: fixed;
|
||||
list-style-type: none;
|
||||
padding: 5px 0px;
|
||||
border-radius: 5px;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #333;
|
||||
box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.contextmenu li {
|
||||
margin: 0px;
|
||||
padding: 7px 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.contextmenu li:hover {
|
||||
background: #eee;
|
||||
}
|
||||
</style>
|
||||
168
orange-demo-multi-web/src/views/layout/index.vue
Normal file
168
orange-demo-multi-web/src/views/layout/index.vue
Normal file
@@ -0,0 +1,168 @@
|
||||
<template>
|
||||
<el-container :style="getMainStyle">
|
||||
<el-aside width='200px' class="sidebar">
|
||||
<side-bar style="overflow: hidden"></side-bar>
|
||||
</el-aside>
|
||||
<el-container style="background-color: rgb(235,235,235)">
|
||||
<el-header class="header">
|
||||
<breadcrumb class="breadcrumb-container" style="flex-grow: 1;" />
|
||||
<div class="menu-column" v-if="getMultiColumn">
|
||||
<el-menu mode="horizontal" :default-active="getCurrentColumnId" @select="onColumnChange">
|
||||
<el-menu-item v-for="column in getColumnList" :key="column.columnId" :index="column.columnId">{{column.columnName}}</el-menu-item>
|
||||
</el-menu>
|
||||
</div>
|
||||
<div class="header-menu">
|
||||
<el-dropdown class="user-dropdown" trigger="click" @command="handleCommand">
|
||||
<span class="el-dropdown-link">{{getUserInfo.showName}}<i class="el-icon-arrow-down el-icon--right"></i>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item class="user-dropdown-item" command="modifyPassword">修改密码</el-dropdown-item>
|
||||
<el-dropdown-item class="user-dropdown-item" command="logout">退出登录</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
<img :src="header" class="header-img" />
|
||||
</div>
|
||||
</el-header>
|
||||
<el-main :style="{'padding-bottom': '15px', 'padding-top': (getMultiTags ? '0px' : '15px')}">
|
||||
<tag-panel v-if="getMultiTags" :tagList="getTagList" style="margin-bottom: 10px;" />
|
||||
<el-scrollbar :style="getContextStyle" wrap-class="scrollbar_dropdown__wrap">
|
||||
<transition name="fade" mode="out-in">
|
||||
<keep-alive :include="getCachePages">
|
||||
<router-view style="margin: 0px 15px; background-color: white; overflow: hidden; padding: 20px;" :style="getRouterViewStyle" />
|
||||
</keep-alive>
|
||||
</transition>
|
||||
</el-scrollbar>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import SideBar from './components/sidebar/sidebar.vue';
|
||||
import { mapGetters, mapMutations } from 'vuex';
|
||||
import Breadcrumb from './components/breadcrumb';
|
||||
import TagPanel from './components/tags/tagPanel.vue';
|
||||
import formModifyPassword from './components/formModifyPassword/index.vue';
|
||||
import { SystemController } from '@/api';
|
||||
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
header: require('../../assets/img/default-header.jpg')
|
||||
};
|
||||
},
|
||||
components: {
|
||||
'side-bar': SideBar,
|
||||
'breadcrumb': Breadcrumb,
|
||||
'tag-panel': TagPanel
|
||||
},
|
||||
methods: {
|
||||
toggleSideBar () {
|
||||
this.setCollapse(!this.getCollapse);
|
||||
},
|
||||
onColumnChange (columnId) {
|
||||
this.setCurrentColumnId(columnId);
|
||||
this.clearCachePage();
|
||||
this.$router.replace({
|
||||
name: 'welcome'
|
||||
});
|
||||
},
|
||||
resetDocumentClientHeight () {
|
||||
let timerID;
|
||||
let _this = this;
|
||||
return function () {
|
||||
clearTimeout(timerID);
|
||||
timerID = setTimeout(() => {
|
||||
var h = document.documentElement['clientHeight'];
|
||||
_this.setClientHeight(h);
|
||||
}, 50);
|
||||
}
|
||||
},
|
||||
handleCommand (command) {
|
||||
if (command === 'logout') {
|
||||
this.$confirm('是否退出登录？', '', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
let options = {
|
||||
headers: {
|
||||
Authorization: window.sessionStorage.getItem('token')
|
||||
},
|
||||
showMask: false
|
||||
}
|
||||
SystemController.logout(this, {}, options).catch(e => {});
|
||||
this.clearAllTags();
|
||||
window.sessionStorage.removeItem('token');
|
||||
window.sessionStorage.removeItem('isUaaLogin');
|
||||
this.$router.replace({name: 'login'});
|
||||
}).catch(e => {});
|
||||
} else if (command === 'modifyPassword') {
|
||||
this.$dialog.show('修改密码', formModifyPassword, {
|
||||
area: ['500px']
|
||||
}, {}).catch(e => {});
|
||||
}
|
||||
},
|
||||
...mapMutations(['setClientHeight', 'setCurrentColumnId', 'clearCachePage', 'clearAllTags'])
|
||||
},
|
||||
computed: {
|
||||
getMainStyle () {
|
||||
return [
|
||||
{'height': this.getClientHeight + 'px'}
|
||||
]
|
||||
},
|
||||
getContextStyle () {
|
||||
return [
|
||||
{'height': this.getMainContextHeight + 'px'}
|
||||
]
|
||||
},
|
||||
getRouterViewStyle () {
|
||||
return [
|
||||
{'min-height': this.getMainContextHeight + 'px'}
|
||||
]
|
||||
},
|
||||
...mapGetters([
|
||||
'getMultiTags',
|
||||
'getClientHeight',
|
||||
'getUserInfo',
|
||||
'getCollapse',
|
||||
'getCachePages',
|
||||
'getTagList',
|
||||
'getMultiColumn',
|
||||
'getCurrentColumnId',
|
||||
'getColumnList',
|
||||
'getMenuItem',
|
||||
'getMainContextHeight'
|
||||
])
|
||||
},
|
||||
mounted () {
|
||||
let resetHeight = this.resetDocumentClientHeight();
|
||||
resetHeight();
|
||||
|
||||
window.onresize = () => {
|
||||
resetHeight();
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
getMenuItem: {
|
||||
handler (newValue) {
|
||||
if (newValue == null) {
|
||||
if (this.$route.name !== 'welcome') {
|
||||
this.$router.replace({
|
||||
name: 'welcome'
|
||||
});
|
||||
}
|
||||
} else {
|
||||
this.$router.replace({
|
||||
name: newValue.formRouterName
|
||||
});
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
102
orange-demo-multi-web/src/views/login/index.vue
Normal file
102
orange-demo-multi-web/src/views/login/index.vue
Normal file
@@ -0,0 +1,102 @@
|
||||
<template>
|
||||
<div class="login-form">
|
||||
<el-card class="box-card" style="width: 30vw; background-color: rgba(255, 255, 255, 0.9); border-width: 0px;" :body-style="{ padding: '40px' }">
|
||||
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()">
|
||||
<el-row>
|
||||
<h3 class="title">橙单代码生成器</h3>
|
||||
<el-col :span="24">
|
||||
<el-form-item prop="mobilePhone">
|
||||
<el-input v-model="dataForm.mobilePhone" style="width: 100%;" placeholder="帐号"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item prop="password">
|
||||
<el-input v-model="dataForm.password" style="width: 100%;" type="password" placeholder="密码" show-password></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-button class="login-btn-submit" type="primary" style="width: 100%;"
|
||||
@click="dataFormSubmit()"
|
||||
:loading="isHttpLoading">
|
||||
登录
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { SystemController } from '@/api';
|
||||
import { mapMutations } from 'vuex';
|
||||
import projectConfig from '@/core/config';
|
||||
import { encrypt } from '@/utils';
|
||||
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
dataForm: {
|
||||
mobilePhone: 'admin',
|
||||
password: '123456'
|
||||
},
|
||||
dataRule: {
|
||||
mobilePhone: [
|
||||
{ required: true, message: '帐号不能为空', trigger: 'blur' }
|
||||
],
|
||||
password: [
|
||||
{ required: true, message: '密码不能为空', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
projectName: projectConfig.projectName
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
dataFormSubmit () {
|
||||
this.$refs['dataForm'].validate(valid => {
|
||||
if (valid) {
|
||||
let params = {
|
||||
loginName: this.dataForm.mobilePhone,
|
||||
password: encrypt(this.dataForm.password)
|
||||
};
|
||||
|
||||
SystemController.login(this, params, null, {showMask: false}).then(data => {
|
||||
this.setMenuList(data.data.menuList);
|
||||
delete data.data.menuList;
|
||||
|
||||
this.setUserInfo(data.data);
|
||||
window.sessionStorage.setItem('token', data.data.tokenData);
|
||||
this.setCurrentMenuId(null);
|
||||
this.$router.replace({ name: 'main' });
|
||||
}).catch(e => {});
|
||||
}
|
||||
});
|
||||
},
|
||||
...mapMutations(['setUserInfo', 'setMenuList', 'setCurrentMenuId'])
|
||||
},
|
||||
mounted () {
|
||||
this.setMenuList([]);
|
||||
this.setUserInfo({});
|
||||
window.sessionStorage.removeItem('token');
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.login-form {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
background: url(~@/assets/img/login_bg.jpg) no-repeat 50%, #000;
|
||||
background-size: 100%;
|
||||
|
||||
.title {
|
||||
margin: 0px;
|
||||
margin-bottom: 20px;
|
||||
color: #707070;
|
||||
font-size: 24;
|
||||
text-align: center;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,128 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="字典列表">
|
||||
<el-select class="filter-item" v-model="currentDictId" placeholder="请选择字典" @change="onDictChange">
|
||||
<el-option v-for="item in dictList" :key="item.variableName" :label="item.name" :value="item.variableName"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" size="mini" :plain="true"
|
||||
:disabled="!checkPermCodeExist('formSysDict:fragmentSysDict:reloadCache') || currentDict == null"
|
||||
@click="onRefreshCacheData">
|
||||
同步缓存
|
||||
</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSysDict:fragmentSysDict:add') || currentDict == null"
|
||||
@click="onAddDictData">
|
||||
添加数据
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="getCurrentDictData" size="mini" header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="ID" prop="id" />
|
||||
<el-table-column label="字典名称" prop="name" />
|
||||
<el-table-column label="操作" width="150px">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" size="mini" :disabled="!checkPermCodeExist('formSysDict:fragmentSysDict:update')" @click="onUpdateDictDataClick(scope.row)">编辑</el-button>
|
||||
<el-button type="text" size="mini" :disabled="!checkPermCodeExist('formSysDict:fragmentSysDict:delete')" @click="onDeleteDictDataClick(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { findItemFromList } from '@/utils';
|
||||
/* eslint-disable-next-line */
|
||||
import { DictionaryController } from '@/api';
|
||||
import editDict from '@/views/upms/formEditDict';
|
||||
|
||||
export default {
|
||||
name: 'systemDictManagement',
|
||||
data () {
|
||||
return {
|
||||
dictList: [
|
||||
{
|
||||
variableName: 'grade',
|
||||
name: '年级',
|
||||
nameKey: 'gradeName',
|
||||
idKey: 'gradeId',
|
||||
deletedKey: 'gradeIds',
|
||||
listApi: DictionaryController.dictGrade,
|
||||
addApi: DictionaryController.dictAddGrade,
|
||||
deleteApi: DictionaryController.dictDeleteGrade,
|
||||
batchDeleteApi: DictionaryController.dictBatchDeleteGrade,
|
||||
updateApi: DictionaryController.dictUpdateGrade,
|
||||
reloadCachedDataApi: DictionaryController.dictReloadGradeCachedData
|
||||
}
|
||||
],
|
||||
currentDictId: undefined,
|
||||
currentDict: undefined,
|
||||
currentDictDataList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
updateDictData () {
|
||||
this.currentDictDataList = [];
|
||||
this.currentDict.listApi(this).then(res => {
|
||||
this.currentDictDataList = res.getList();
|
||||
}).catch(e => {});
|
||||
},
|
||||
onDictChange (value) {
|
||||
this.currentDict = findItemFromList(this.dictList, value, 'variableName');
|
||||
this.currentDictDataList = [];
|
||||
if (this.currentDict == null) {
|
||||
this.$message.error('没有找到相关字典');
|
||||
return;
|
||||
}
|
||||
this.updateDictData();
|
||||
},
|
||||
onRefreshCacheData () {
|
||||
this.$confirm('是否同步缓存？').then(res => {
|
||||
this.currentDict.reloadCachedDataApi(this).then(res => {
|
||||
this.$message.success('同步成功');
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
onAddDictData () {
|
||||
this.$dialog.show(`新建字典数据 - [${this.currentDict.name}]`, editDict, {
|
||||
area: '500px'
|
||||
}, {
|
||||
dictInfo: this.currentDict
|
||||
}).then(res => {
|
||||
this.updateDictData();
|
||||
}).catch(e => {});
|
||||
},
|
||||
onUpdateDictDataClick (row) {
|
||||
this.$dialog.show(`编辑字典数据 - [${this.currentDict.name}]`, editDict, {
|
||||
area: '500px'
|
||||
}, {
|
||||
dictInfo: this.currentDict,
|
||||
currentData: row
|
||||
}).then(res => {
|
||||
this.updateDictData();
|
||||
}).catch(e => {});
|
||||
},
|
||||
onDeleteDictDataClick (row) {
|
||||
this.$confirm('是否删除此字典数据？').then(res => {
|
||||
let params = {};
|
||||
params[this.currentDict.idKey] = row.id;
|
||||
return this.currentDict.deleteApi(this, params);
|
||||
}).then(res => {
|
||||
this.$message.success('删除成功');
|
||||
this.updateDictData();
|
||||
}).catch(e => {});
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getCurrentDictData () {
|
||||
return this.currentDictDataList;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
82
orange-demo-multi-web/src/views/upms/formEditDict/index.vue
Normal file
82
orange-demo-multi-web/src/views/upms/formEditDict/index.vue
Normal file
@@ -0,0 +1,82 @@
|
||||
<template>
|
||||
<el-form ref="form" :model="formData" :rules="rules" label-width="80px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-form-item label="名称" prop="name">
|
||||
<el-input v-model="formData.name" placeholder="字典名称" clearable />
|
||||
</el-form-item>
|
||||
</el-row>
|
||||
<!-- 弹窗下发按钮栏，必须设置class为dialog-btn-layer -->
|
||||
<el-row type="flex" justify="end" class="dialog-btn-layer">
|
||||
<el-button size="mini" @click="onCancel(false)" >取消</el-button>
|
||||
<el-button type="primary" size="mini" @click="onSubmit">确定</el-button>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'DictEdit',
|
||||
props: {
|
||||
dictInfo: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
currentData: {
|
||||
type: Object,
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
name: undefined,
|
||||
id: undefined
|
||||
},
|
||||
rules: {
|
||||
name: [{required: true, message: '字典数据名称不能为空', trigger: 'blur'}]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess = false) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
onSubmit () {
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
let params = {};
|
||||
params[this.dictInfo.variableName] = {};
|
||||
params[this.dictInfo.variableName][this.dictInfo.nameKey] = this.formData.name;
|
||||
|
||||
if (this.formData.id == null) {
|
||||
this.dictInfo.addApi(this, params).then(res => {
|
||||
this.$message.success('操作成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {
|
||||
|
||||
});
|
||||
} else {
|
||||
params[this.dictInfo.variableName][this.dictInfo.idKey] = this.formData.id;
|
||||
this.dictInfo.updateApi(this, params).then(res => {
|
||||
this.$message.success('操作成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
if (this.currentData != null) {
|
||||
this.formData.id = this.currentData.id;
|
||||
this.formData.name = this.currentData.name;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,108 @@
|
||||
<template>
|
||||
<el-form ref="form" :model="formData" :rules="rules" label-width="110px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20" class="full-width-input">
|
||||
<el-col :span="24" >
|
||||
<el-form-item label="菜单名称" prop="menuName">
|
||||
<el-input v-model="formData.menuName" placeholder="菜单名称" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="显示顺序" prop="showOrder">
|
||||
<el-input-number v-model="formData.showOrder" controls-position="right"
|
||||
:min="1" :max="99999" placeholder="请输入显示顺序"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 弹窗按钮 -->
|
||||
<el-row type="flex" justify="end" class="dialog-btn-layer mt20">
|
||||
<el-button size="mini" @click="onCancel(false)" >取消</el-button>
|
||||
<el-button type="primary" size="mini" @click="onSubmit">确定</el-button>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { SystemController } from '@/api';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
columnId: {
|
||||
type: String
|
||||
},
|
||||
columnName: {
|
||||
type: String
|
||||
},
|
||||
showOrder: {
|
||||
type: Number
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 是否自动用上级菜单的名称过滤权限字列表，当这个开关打开后，会使用getAutoFilterString返回的字符串当做过滤字符串
|
||||
autoFilter: false,
|
||||
permCodeNameFilter: undefined,
|
||||
allowParentList: [],
|
||||
formData: {
|
||||
menuId: this.columnId,
|
||||
parentId: undefined,
|
||||
menuName: this.columnName,
|
||||
showOrder: this.showOrder,
|
||||
menuType: this.SysMenuType.DIRECTORY,
|
||||
icon: undefined,
|
||||
formRouterName: undefined
|
||||
},
|
||||
rules: {
|
||||
menuName: [{required: true, message: '请输入栏目名称', trigger: 'blur'}],
|
||||
showOrder: [{required: true, message: '请输入栏目显示顺序', trigger: 'blur'}]
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
onSubmit () {
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
let params = {};
|
||||
params.sysMenu = {...this.formData};
|
||||
|
||||
if (this.isEdit) {
|
||||
SystemController.updateMenu(this, params).then(res => {
|
||||
resolve(res);
|
||||
this.$message.success('编辑成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
} else {
|
||||
SystemController.addMenu(this, params).then(res => {
|
||||
resolve(res);
|
||||
this.$message.success('添加成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
}
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
initData () {
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isEdit () {
|
||||
return this.formData.menuId != null;
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.initData();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
283
orange-demo-multi-web/src/views/upms/formEditSysMenu/index.vue
Normal file
283
orange-demo-multi-web/src/views/upms/formEditSysMenu/index.vue
Normal file
@@ -0,0 +1,283 @@
|
||||
<template>
|
||||
<el-form ref="form" :model="formData" :rules="rules" label-width="110px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20" class="full-width-input">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="上级菜单">
|
||||
<el-cascader :options="menuTree" v-model="parentMenuPath" :props="menuProps" placeholder="选择父菜单"
|
||||
:disabled="!canEditParent" :clearable="true" :change-on-select="true" size="mini"
|
||||
@change="onParentMenuChange" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" >
|
||||
<el-form-item label="菜单名称" prop="menuName">
|
||||
<el-input v-model="formData.menuName" placeholder="菜单名称" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="菜单类型" prop="menuType">
|
||||
<el-select v-model="formData.menuType" :disabled="isEdit" placeholder="菜单类型" @change="onMenuTypeChange">
|
||||
<el-option v-for="item in getValidMenuType" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="显示顺序" prop="showOrder">
|
||||
<el-input-number v-model="formData.showOrder" controls-position="right"
|
||||
:min="1" :max="99999" placeholder="请输入显示顺序"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="菜单路由">
|
||||
<el-input v-model="formData.formRouterName" placeholder="菜单路由" :disabled="formData.menuType !== 1" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="菜单图标" prop="icon">
|
||||
<icon-select v-model="formData.icon" :height="28" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-card shadow="never">
|
||||
<div slot="header" class="card-header">
|
||||
<span>权限字列表</span>
|
||||
<el-input size="mini" v-model="permCodeNameFilter" placeholder="输入权限字名称过滤" style="width: 250px;" clearable suffix-icon="el-icon-search" />
|
||||
</div>
|
||||
<el-scrollbar style="height: 210px;" wrap-class="scrollbar_dropdown__wrap">
|
||||
<el-tree ref="permCodeTree" v-show="formData.menuType" :check-strictly="true"
|
||||
:props="treeProps" node-key="permCodeId" :default-expanded-keys="defaultExpandedKeys"
|
||||
show-checkbox :data="getPermCodeTree" :filter-node-method="filterPermCodeNode"></el-tree>
|
||||
</el-scrollbar>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 弹窗按钮 -->
|
||||
<el-row type="flex" justify="end" class="dialog-btn-layer mt20">
|
||||
<el-button size="mini" @click="onCancel(false)" >取消</el-button>
|
||||
<el-button type="primary" size="mini" @click="onSubmit"
|
||||
:disabled="!(checkPermCodeExist('formSysMenu:fragmentSysMenu:add') || checkPermCodeExist('formSysMenu:fragmentSysMenu:update'))">
|
||||
确定
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { treeDataTranslate, findTreeNodePath, findTreeNode, findItemFromList } from '@/utils'
|
||||
import { SystemController } from '@/api'
|
||||
import IconSelect from '@/components/IconSelect/index.vue'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
menuId: {
|
||||
type: String
|
||||
},
|
||||
parentId: {
|
||||
type: String
|
||||
},
|
||||
menuList: {
|
||||
type: Array,
|
||||
default: undefined
|
||||
},
|
||||
rowData: {
|
||||
type: Object,
|
||||
default: undefined
|
||||
}
|
||||
},
|
||||
components: {
|
||||
IconSelect
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
// 是否自动用上级菜单的名称过滤权限字列表，当这个开关打开后，会使用getAutoFilterString返回的字符串当做过滤字符串
|
||||
autoFilter: false,
|
||||
permCodeNameFilter: undefined,
|
||||
allowParentList: [],
|
||||
formData: {
|
||||
menuId: undefined,
|
||||
parentId: undefined,
|
||||
menuName: undefined,
|
||||
showOrder: undefined,
|
||||
menuType: undefined,
|
||||
icon: undefined,
|
||||
formRouterName: undefined
|
||||
},
|
||||
menuProps: {
|
||||
label: 'menuName',
|
||||
value: 'menuId'
|
||||
},
|
||||
parentMenuType: undefined,
|
||||
parentMenuPath: [],
|
||||
menuTree: [],
|
||||
permCodeList: [],
|
||||
selectPermCode: undefined,
|
||||
defaultExpandedKeys: [],
|
||||
rules: {
|
||||
menuName: [{required: true, message: '请输入菜单名称', trigger: 'blur'}],
|
||||
showOrder: [{required: true, message: '请输入菜单显示顺序', trigger: 'blur'}],
|
||||
formRouterName: [{required: true, message: '请输入菜单路由名称', trigger: 'blur'}]
|
||||
},
|
||||
treeProps: {
|
||||
label: 'showName'
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
getAutoFilterString () {
|
||||
let node = findTreeNode(this.menuTree, this.parentMenuPath[this.parentMenuPath.length - 1], 'menuId');
|
||||
return node ? node.menuName : undefined;
|
||||
},
|
||||
onMenuTypeChange (value) {
|
||||
if (this.autoFilter && value === this.SysMenuType.BUTTON && (this.permCodeNameFilter == null || this.permCodeNameFilter === '')) {
|
||||
this.permCodeNameFilter = this.getAutoFilterString();
|
||||
}
|
||||
},
|
||||
filterPermCodeNode (value, data) {
|
||||
if (!value) return true;
|
||||
if (data.showName.indexOf(value) !== -1) {
|
||||
this.allowParentList.push(data.permCodeId);
|
||||
return true;
|
||||
} else {
|
||||
return this.allowParentList.indexOf(data.parentId) !== -1;
|
||||
}
|
||||
},
|
||||
onParentMenuChange (value, isInit) {
|
||||
if (!isInit) this.formData.menuType = undefined;
|
||||
this.parentMenuType = undefined;
|
||||
if (Array.isArray(value) && value.length > 0) {
|
||||
let node = findTreeNode(this.menuTree, value[value.length - 1], 'menuId');
|
||||
if (node) this.parentMenuType = node.menuType;
|
||||
}
|
||||
},
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
onSubmit () {
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
let params = {};
|
||||
params.sysMenu = {...this.formData};
|
||||
|
||||
if (this.parentMenuPath.length > 0) {
|
||||
params.sysMenu.parentId = this.parentMenuPath[this.parentMenuPath.length - 1];
|
||||
}
|
||||
|
||||
if ([this.SysMenuType.MENU, this.SysMenuType.BUTTON, this.SysMenuType.FRAGMENT].indexOf(params.sysMenu.menuType) !== -1) {
|
||||
let tempList = this.$refs.permCodeTree.getHalfCheckedKeys();
|
||||
tempList = tempList.concat(this.$refs.permCodeTree.getCheckedKeys());
|
||||
params.permCodeIdListString = tempList.join(',');
|
||||
}
|
||||
|
||||
if (this.isEdit) {
|
||||
SystemController.updateMenu(this, params).then(res => {
|
||||
resolve(res);
|
||||
this.$message.success('编辑成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
} else {
|
||||
SystemController.addMenu(this, params).then(res => {
|
||||
resolve(res);
|
||||
this.$message.success('添加成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
}
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
formatMenuTree () {
|
||||
this.menuTree = [];
|
||||
if (Array.isArray(this.menuList)) {
|
||||
this.menuTree = this.menuList.filter((item) => {
|
||||
return item.menuType !== this.SysMenuType.BUTTON && item.menuId !== this.formData.menuId;
|
||||
});
|
||||
}
|
||||
this.menuTree = treeDataTranslate(this.menuTree, 'menuId', 'parentId');
|
||||
},
|
||||
initData () {
|
||||
this.defaultExpandedKeys = [];
|
||||
this.formatMenuTree();
|
||||
this.parentMenuPath = findTreeNodePath(this.menuTree, this.formData.parentId, 'menuId');
|
||||
this.onParentMenuChange(this.parentMenuPath, true);
|
||||
this.onMenuTypeChange(this.formData.menuType);
|
||||
SystemController.getPermCodeList(this, {}).then(res => {
|
||||
this.permCodeList = res.data;
|
||||
if (Array.isArray(this.formData.permCodeIdList) && this.formData.permCodeIdList.length > 0) {
|
||||
let tempList = [];
|
||||
this.permCodeList.forEach((item) => {
|
||||
if (findItemFromList(this.formData.permCodeIdList, item.permCodeId) != null) {
|
||||
tempList.push(item.permCodeId);
|
||||
}
|
||||
});
|
||||
this.defaultExpandedKeys = tempList;
|
||||
this.$refs.permCodeTree.setCheckedKeys(tempList);
|
||||
this.$nextTick(() => {
|
||||
this.allowParentList = [];
|
||||
if (this.permCodeNameFilter != null && this.permCodeNameFilter !== '') this.$refs.permCodeTree.filter(this.permCodeNameFilter);
|
||||
});
|
||||
}
|
||||
}).catch(e => {});
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getValidMenuType () {
|
||||
let allList = this.SysMenuType.getList();
|
||||
if (this.parentMenuType == null) {
|
||||
return allList.filter((item) => {
|
||||
return [this.SysMenuType.MENU, this.SysMenuType.DIRECTORY].indexOf(item.id) !== -1;
|
||||
});
|
||||
} else {
|
||||
return allList.filter((item) => {
|
||||
switch (Number.parseInt(this.parentMenuType)) {
|
||||
case this.SysMenuType.DIRECTORY: return [this.SysMenuType.MENU, this.SysMenuType.DIRECTORY].indexOf(item.id) !== -1;
|
||||
case this.SysMenuType.MENU: return [this.SysMenuType.FRAGMENT, this.SysMenuType.BUTTON].indexOf(item.id) !== -1;
|
||||
case this.SysMenuType.FRAGMENT: return item.id === this.SysMenuType.BUTTON;
|
||||
default: return false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
isEdit () {
|
||||
return this.formData.menuId != null;
|
||||
},
|
||||
// 判断是否新建一个目录
|
||||
isNew () {
|
||||
return this.formData.parentId == null && this.formData.menuId == null;
|
||||
},
|
||||
canEditParent () {
|
||||
return this.parentId == null;
|
||||
},
|
||||
getPermCodeTree () {
|
||||
if (this.permCodeList != null) {
|
||||
return treeDataTranslate(this.permCodeList, 'permCodeId', 'parentId');
|
||||
} else {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
if (this.rowData != null) {
|
||||
this.formData = {...this.formData, ...this.rowData};
|
||||
if (Array.isArray(this.formData.sysMenuPermCodeList)) {
|
||||
this.formData.permCodeIdList = this.formData.sysMenuPermCodeList.map(item => item.permCodeId);
|
||||
}
|
||||
}
|
||||
if (this.parentId != null) this.formData.parentId = this.parentId;
|
||||
this.initData();
|
||||
},
|
||||
watch: {
|
||||
permCodeNameFilter (val) {
|
||||
this.allowParentList = [];
|
||||
this.$refs.permCodeTree.filter(val);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
169
orange-demo-multi-web/src/views/upms/formEditSysPerm/index.vue
Normal file
169
orange-demo-multi-web/src/views/upms/formEditSysPerm/index.vue
Normal file
@@ -0,0 +1,169 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form ref="formCreatePerm" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
|
||||
label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="权限名称" prop="SysPerm.permName">
|
||||
<el-input class="input-item" v-model="formData.SysPerm.permName"
|
||||
:clearable="true" placeholder="权限名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="所属模块" prop="SysPerm.moduleId">
|
||||
<el-cascader class="input-item" :options="permModuleList" v-model="formData.SysPerm.moduleId"
|
||||
placeholder="选择所属模块" :clearable="true" size="mini" :props="{value: 'moduleId', label: 'moduleName'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="关联的url" prop="SysPerm.url">
|
||||
<el-input class="input-item" v-model="formData.SysPerm.url"
|
||||
:clearable="true" placeholder="关联的url" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="显示顺序" prop="SysPerm.showOrder">
|
||||
<el-input-number class="input-item" v-model="formData.SysPerm.showOrder"
|
||||
:clearable="true" controls-position="right" placeholder="权限在当前模块下的顺序" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" :plain="true"
|
||||
@click="onCancel(false)">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" @click="onAddClick()"
|
||||
:disabled="!(checkPermCodeExist('formSysPerm:fragmentSysPerm:updatePerm') || checkPermCodeExist('formSysPerm:fragmentSysPerm:addPerm'))">
|
||||
保存
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { findTreeNodePath } from '@/utils';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { SystemController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formEditSysPerm',
|
||||
props: {
|
||||
permId: {
|
||||
default: undefined
|
||||
},
|
||||
moduleId: {
|
||||
default: undefined
|
||||
},
|
||||
rowData: {
|
||||
type: Object
|
||||
},
|
||||
currentPermGroupId: String,
|
||||
permModuleList: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachedPageChildMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
SysPerm: {
|
||||
permId: undefined,
|
||||
moduleId: this.currentPermGroupId,
|
||||
permName: undefined,
|
||||
url: undefined,
|
||||
showOrder: undefined,
|
||||
createTime: undefined,
|
||||
deletedFlag: undefined
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
'SysPerm.permName': [
|
||||
{required: true, message: '请输入权限名称', trigger: 'blur'}
|
||||
],
|
||||
'SysPerm.url': [
|
||||
{required: true, message: '请输入关联的url', trigger: 'blur'}
|
||||
],
|
||||
'SysPerm.showOrder': [
|
||||
{required: true, message: '请输入显示顺序', trigger: 'blur'}
|
||||
]
|
||||
},
|
||||
formCreatePerm: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 更新新建权限
|
||||
*/
|
||||
refreshFormCreatePerm (reloadData = false) {
|
||||
if (!this.formCreatePerm.isInit) {
|
||||
this.formData.SysPerm.moduleId = findTreeNodePath(this.permModuleList, this.formData.SysPerm.moduleId, 'moduleId');
|
||||
}
|
||||
this.formCreatePerm.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 新增
|
||||
*/
|
||||
onAddClick () {
|
||||
this.$refs.formCreatePerm.validate((valid) => {
|
||||
if (!valid) return;
|
||||
let params = {
|
||||
sysPerm: {
|
||||
permId: this.permId,
|
||||
showOrder: this.formData.SysPerm.showOrder,
|
||||
moduleId: Array.isArray(this.formData.SysPerm.moduleId) ? this.formData.SysPerm.moduleId[this.formData.SysPerm.moduleId.length - 1] : undefined,
|
||||
url: this.formData.SysPerm.url,
|
||||
permName: this.formData.SysPerm.permName
|
||||
}
|
||||
};
|
||||
|
||||
if (this.isEdit) {
|
||||
SystemController.updatePerm(this, params).then(res => {
|
||||
this.$message.success('编辑成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
} else {
|
||||
SystemController.addPerm(this, params).then(res => {
|
||||
this.$message.success('新增成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
}
|
||||
});
|
||||
},
|
||||
initFormData () {
|
||||
if (this.rowData != null) this.formData.SysPerm = {...this.formData.SysPerm, ...this.rowData};
|
||||
},
|
||||
formInit () {
|
||||
this.initFormData();
|
||||
this.refreshFormCreatePerm();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isEdit () {
|
||||
return this.permId != null;
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,221 @@
|
||||
<template>
|
||||
<el-form ref="form" :model="formData" :rules="rules" label-width="110px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20" class="full-width-input">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="所属权限字">
|
||||
<el-cascader :options="permCodeTree" v-model="parentPermCodePath" :props="permCodeProps" filterable
|
||||
:disabled="formData.permCodeId != null || formData.parenId == null" placeholder="选择父权限字" :clearable="true" :change-on-select="true" size="mini" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="权限字名称" prop="showName">
|
||||
<el-input v-model="formData.showName" placeholder="权限字名称" clearable ></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="权限字标识" prop="permCode">
|
||||
<el-input v-model="formData.permCode" placeholder="权限字标识" clearable ></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="权限字类型" prop="permCode">
|
||||
<el-select v-model="formData.permCodeType" placeholder="权限字类型" :disabled="true">
|
||||
<el-option v-for="item in SysPermCodeType.getList()" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="显示顺序" prop="showOrder">
|
||||
<el-input-number v-model="formData.showOrder" controls-position="right"
|
||||
:min="1" :max="99999" placeholder="请输入显示顺序"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-card shadow="never">
|
||||
<div slot="header" class="card-header">
|
||||
<span>权限列表</span>
|
||||
<el-input size="mini" v-model="permNameFilter" placeholder="输入权限名称过滤" style="width: 250px;" clearable suffix-icon="el-icon-search" />
|
||||
</div>
|
||||
<el-scrollbar style="height: 215px;" wrap-class="scrollbar_dropdown__wrap">
|
||||
<el-tree ref="permTree" :data="formData.permCodeType === SysPermCodeType.FORM ? [] : getPermTree" :props="treeProps" show-checkbox
|
||||
node-key="id" empty-text="暂无权限资源" :filter-node-method="filterPermNode"
|
||||
:default-expanded-keys="defaultExpandedKeys">
|
||||
<div slot-scope="{ data }" style="display: flex; justify-content: space-between; width: 100%">
|
||||
<span>{{ data.name }}</span>
|
||||
<span style="margin-right: 10px;">{{ data.url }}</span>
|
||||
</div>
|
||||
</el-tree>
|
||||
</el-scrollbar>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 弹窗按钮 -->
|
||||
<el-row type="flex" justify="end" class="dialog-btn-layer mt20">
|
||||
<el-button size="mini" @click="onCancel(false)" >取消</el-button>
|
||||
<el-button type="primary" size="mini" @click="onSubmit"
|
||||
:disabled="!(checkPermCodeExist('formSysPermCode:fragmentSysPermCode:add') || checkPermCodeExist('formSysPermCode:fragmentSysPermCode:update'))">
|
||||
确定
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { treeDataTranslate, findTreeNodePath } from '@/utils'
|
||||
import { SystemController } from '@/api'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
permCodeTree: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return [];
|
||||
}
|
||||
},
|
||||
permCodeType: {
|
||||
type: Number,
|
||||
default: undefined
|
||||
},
|
||||
rowData: {
|
||||
type: Object
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
permNameFilter: undefined,
|
||||
allowParentList: [],
|
||||
formData: {
|
||||
permCodeId: undefined,
|
||||
parentId: undefined,
|
||||
permCode: undefined,
|
||||
permCodeType: this.permCodeType || this.SysPermCodeType.FORM,
|
||||
showName: undefined,
|
||||
showOrder: undefined
|
||||
},
|
||||
parentPermCodePath: [],
|
||||
permList: [],
|
||||
defaultExpandedKeys: [],
|
||||
treeProps: {
|
||||
label: 'name',
|
||||
isLeaf: function (data, node) {
|
||||
return data.isPerm;
|
||||
}
|
||||
},
|
||||
permCodeProps: {
|
||||
label: 'showName',
|
||||
value: 'permCodeId'
|
||||
},
|
||||
rules: {
|
||||
showName: [{required: true, message: '权限字名称不能为空', trigger: 'blur'}],
|
||||
permCode: [{required: true, message: '权限字标识不能为空', trigger: 'blur'}],
|
||||
showOrder: [{required: true, message: '请输入权限字显示顺序', trigger: 'blur'}],
|
||||
permCodeType: [{required: true, message: '请选择权限字类型', trigger: 'blur'}]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
filterPermNode (value, data) {
|
||||
if (!value) return true;
|
||||
if (data.name.indexOf(value) !== -1) {
|
||||
this.allowParentList.push(data.id);
|
||||
return true;
|
||||
} else {
|
||||
return this.allowParentList.indexOf(data.parentId) !== -1;
|
||||
}
|
||||
},
|
||||
getTreeLeafKeys () {
|
||||
let selectPermNodeList = this.$refs.permTree.getCheckedNodes();
|
||||
let tempList = [];
|
||||
selectPermNodeList.forEach((item) => {
|
||||
if (item.isPerm) {
|
||||
tempList.push(item.id);
|
||||
}
|
||||
});
|
||||
|
||||
return tempList;
|
||||
},
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
onSubmit () {
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
let selectedPermList = this.getTreeLeafKeys();
|
||||
let params = {};
|
||||
params.sysPermCode = {...this.formData};
|
||||
delete params.sysPermCode.children;
|
||||
params.sysPermCode.permCodeType = (this.permCodeType == null) ? this.SysPermCodeType.FORM : this.permCodeType;
|
||||
if (this.parentPermCodePath.length > 0) {
|
||||
params.sysPermCode.parentId = this.parentPermCodePath[this.parentPermCodePath.length - 1];
|
||||
}
|
||||
params.permIdListString = selectedPermList.join(',');
|
||||
if (params.sysPermCode.permCodeId != null) {
|
||||
SystemController.updatePermCode(this, params).then(res => {
|
||||
resolve(res);
|
||||
this.$message.success('编辑成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
} else {
|
||||
SystemController.addPermCode(this, params).then(res => {
|
||||
resolve(res);
|
||||
this.$message.success('添加成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
}
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
initData () {
|
||||
SystemController.getAllPermList(this, {}).then(res => {
|
||||
res.data.forEach((item) => {
|
||||
item.id = item.id + '';
|
||||
item.parentId = item.parentId + '';
|
||||
});
|
||||
this.permList = res.data;
|
||||
this.defaultExpandedKeys = this.formData.permIdList;
|
||||
if (Array.isArray(this.formData.permIdList)) {
|
||||
this.$refs.permTree.setCheckedKeys(this.formData.permIdList, true);
|
||||
}
|
||||
}).catch(e => {});
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getPermTree () {
|
||||
return treeDataTranslate(this.permList.map((item) => {
|
||||
return {...item};
|
||||
}), 'id', 'parentId');
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
if (this.rowData != null) {
|
||||
this.formData = {...this.formData, ...this.rowData};
|
||||
if (Array.isArray(this.formData.sysPermCodePermList)) {
|
||||
this.formData.permIdList = this.formData.sysPermCodePermList.map(item => item.permId);
|
||||
}
|
||||
if (this.formData.parentId != null && this.permCodeTree != null && Array.isArray(this.permCodeTree)) {
|
||||
this.parentPermCodePath = findTreeNodePath(this.permCodeTree, this.formData.parentId, 'permCodeId');
|
||||
} else {
|
||||
this.parentPermCodePath = [];
|
||||
}
|
||||
}
|
||||
|
||||
this.initData();
|
||||
},
|
||||
watch: {
|
||||
permNameFilter (val) {
|
||||
this.allowParentList = [];
|
||||
this.$refs.permTree.filter(val);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,185 @@
|
||||
<template>
|
||||
<div class="form-single-fragment" style="position: relative;">
|
||||
<el-form ref="formCreatePermModule" :model="formData" class="full-width-input" :rules="rules" style="width: 100%;"
|
||||
label-width="120px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="模块名称" prop="SysPermModule.moduleName">
|
||||
<el-input class="input-item" v-model="formData.SysPermModule.moduleName"
|
||||
:clearable="true" placeholder="权限模块名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="模块类型">
|
||||
<el-select class="input-item" v-model="formData.SysPermModule.moduleType"
|
||||
placeholder="模块类型" :clearable="true" size="mini" :disabled="isEdit">
|
||||
<el-option v-for="item in SysPermModuleType.getList()" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="所属模块">
|
||||
<el-cascader class="input-item" :options="getPermGroupTree" v-model="formData.SysPermModule.parentId"
|
||||
placeholder="选择所属模块" :clearable="true" size="mini"
|
||||
:props="{value: 'moduleId', label: 'moduleName', checkStrictly: true}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="显示顺序" prop="SysPermModule.showOrder">
|
||||
<el-input-number class="input-item" v-model="formData.SysPermModule.showOrder"
|
||||
:clearable="true" controls-position="right" placeholder="权限模块在当前层级下的顺序" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" :plain="true" @click="onCancel(false)">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" @click="onAddClick()"
|
||||
:disabled="!(checkPermCodeExist('formSysPerm:fragmentSysPerm:addPermModule') || checkPermCodeExist('formSysPerm:fragmentSysPerm:updatePermModule'))">
|
||||
保存
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { treeDataTranslate, findTreeNodePath } from '@/utils';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { DictionaryController, SystemController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formEditSysPermModule',
|
||||
props: {
|
||||
parentId: {
|
||||
default: undefined
|
||||
},
|
||||
moduleType: {
|
||||
default: undefined
|
||||
},
|
||||
moduleId: {
|
||||
default: undefined
|
||||
},
|
||||
rowData: {
|
||||
type: Object,
|
||||
default: undefined
|
||||
},
|
||||
moduleList: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachedPageChildMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
SysPermModule: {
|
||||
moduleId: undefined,
|
||||
parentId: undefined,
|
||||
moduleName: undefined,
|
||||
moduleType: undefined,
|
||||
level: undefined,
|
||||
showOrder: undefined,
|
||||
createTime: undefined
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
'SysPermModule.moduleName': [
|
||||
{required: true, message: '请输入模块名称', trigger: 'blur'}
|
||||
],
|
||||
'SysPermModule.showOrder': [
|
||||
{required: true, message: '请输入显示顺序', trigger: 'blur'}
|
||||
]
|
||||
},
|
||||
formCreatePermModule: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 更新新建权限模块
|
||||
*/
|
||||
refreshFormCreatePermModule (reloadData = false) {
|
||||
if (!this.formCreatePermModule.isInit) {
|
||||
this.formData.SysPermModule.parentId = findTreeNodePath(this.getPermGroupTree, this.formData.SysPermModule.parentId, 'moduleId')
|
||||
}
|
||||
this.formCreatePermModule.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 新增
|
||||
*/
|
||||
onAddClick () {
|
||||
this.$refs.formCreatePermModule.validate((valid) => {
|
||||
if (!valid) return;
|
||||
let params = {
|
||||
sysPermModule: {
|
||||
moduleId: this.moduleId,
|
||||
moduleName: this.formData.SysPermModule.moduleName,
|
||||
showOrder: this.formData.SysPermModule.showOrder,
|
||||
moduleType: this.formData.SysPermModule.moduleType,
|
||||
parentId: Array.isArray(this.formData.SysPermModule.parentId) ? this.formData.SysPermModule.parentId[this.formData.SysPermModule.parentId.length - 1] : undefined
|
||||
}
|
||||
};
|
||||
|
||||
if (this.isEdit) {
|
||||
SystemController.updatePermGroup(this, params).then(res => {
|
||||
this.$message.success('编辑成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
} else {
|
||||
SystemController.addPermGroup(this, params).then(res => {
|
||||
this.$message.success('新增成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
}
|
||||
});
|
||||
},
|
||||
initFormData () {
|
||||
if (this.rowData != null) {
|
||||
this.formData.SysPermModule = {...this.formData.SysPermModule, ...this.rowData};
|
||||
}
|
||||
if (this.parentId != null) this.formData.SysPermModule.parentId = this.parentId;
|
||||
if (this.moduleType != null) this.formData.SysPermModule.moduleType = this.moduleType;
|
||||
},
|
||||
formInit () {
|
||||
this.initFormData();
|
||||
this.refreshFormCreatePermModule();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isEdit () {
|
||||
return this.moduleId != null;
|
||||
},
|
||||
getPermGroupTree () {
|
||||
let tempList = this.moduleList.map((item) => {
|
||||
if (item.moduleType === this.SysPermModuleType.GROUP) {
|
||||
return {...item, children: undefined};
|
||||
}
|
||||
}).filter((item) => {
|
||||
return item != null;
|
||||
});
|
||||
return treeDataTranslate(tempList, 'moduleId');
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
157
orange-demo-multi-web/src/views/upms/formEditSysRole/index.vue
Normal file
157
orange-demo-multi-web/src/views/upms/formEditSysRole/index.vue
Normal file
@@ -0,0 +1,157 @@
|
||||
<template>
|
||||
<el-form ref="form" :model="formData" :rules="rules" label-width="80px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="角色名称" prop="roleName">
|
||||
<el-input v-model="formData.roleName" placeholder="角色名称" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item v-if="false" label="角色类型" :required="true">
|
||||
<el-radio-group v-model="formData.adminRole">
|
||||
<el-radio :label="1">管理员</el-radio>
|
||||
<el-radio :label="0">其他</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-card shadow="never">
|
||||
<div slot="header" class="card-header">
|
||||
<span>菜单权限</span>
|
||||
<el-input size="mini" v-model="menuNameFilter" placeholder="输入菜单名称过滤" style="width: 250px;" clearable suffix-icon="el-icon-search" />
|
||||
</div>
|
||||
<el-scrollbar style="height: 230px;" wrap-class="scrollbar_dropdown__wrap">
|
||||
<el-tree ref="authTree" :data="authData" :props="treeProps" :check-strictly="false"
|
||||
show-checkbox node-key="menuId" :filter-node-method="filterMneuNode">
|
||||
</el-tree>
|
||||
</el-scrollbar>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 弹窗下发按钮栏，必须设置class为dialog-btn-layer -->
|
||||
<el-row type="flex" justify="end" class="dialog-btn-layer" style="margin-top: 20px;">
|
||||
<el-button size="mini" @click="onCancel(false)" >取消</el-button>
|
||||
<el-button type="primary" size="mini" @click="onSubmit"
|
||||
:disabled="!(checkPermCodeExist('formSysRole:fragmentSysRole:update') || checkPermCodeExist('formSysRole:fragmentSysRole:add'))">
|
||||
确定
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { treeDataTranslate, findItemFromList } from '@/utils'
|
||||
import { SystemController } from '@/api'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
rowData: {
|
||||
type: Object
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
menuNameFilter: undefined,
|
||||
formData: {
|
||||
roleId: undefined,
|
||||
roleName: undefined,
|
||||
adminRole: false,
|
||||
menuIdListString: undefined
|
||||
/*
|
||||
permsJsonData: {
|
||||
checked: [],
|
||||
halfChecked: [],
|
||||
},
|
||||
*/
|
||||
},
|
||||
rules: {
|
||||
roleName: [{required: true, message: '角色名称不能为空', trigger: 'blur'}]
|
||||
},
|
||||
treeProps: {
|
||||
label: 'menuName'
|
||||
},
|
||||
authData: [],
|
||||
allowParentList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
filterMneuNode (value, data) {
|
||||
if (!value) return true;
|
||||
if (data.menuName.indexOf(value) !== -1) {
|
||||
this.allowParentList.push(data.menuId);
|
||||
return true;
|
||||
} else {
|
||||
return this.allowParentList.indexOf(data.parentId) !== -1;
|
||||
}
|
||||
},
|
||||
onCancel (isSuccess = false) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
onSubmit () {
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
let selectMenu = [];
|
||||
selectMenu = this.$refs.authTree.getHalfCheckedKeys();
|
||||
selectMenu = selectMenu.concat(this.$refs.authTree.getCheckedKeys());
|
||||
|
||||
if (selectMenu.length <= 0) {
|
||||
this.$message.error({message: '请选择角色的菜单权限', showClose: true});
|
||||
return;
|
||||
}
|
||||
let params = {
|
||||
sysRole: {...this.formData}
|
||||
}
|
||||
params.menuIdListString = selectMenu.join(',');
|
||||
if (this.isEdit) {
|
||||
SystemController.updateRole(this, params).then(res => {
|
||||
this.$message.success('编辑成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
} else {
|
||||
SystemController.addRole(this, params).then(res => {
|
||||
this.$message.success('添加成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
loadAuthData () {
|
||||
SystemController.getMenuPermList(this, {}).then(res => {
|
||||
this.authData = treeDataTranslate(res.data, 'menuId', 'parentId');
|
||||
if (Array.isArray(this.formData.menuIdList)) {
|
||||
let tempList = [];
|
||||
this.formData.menuIdList.forEach((item) => {
|
||||
let tempMenu = findItemFromList(res.data, item, 'menuId');
|
||||
if (tempMenu != null && tempMenu.menuType === this.SysMenuType.BUTTON) {
|
||||
tempList.push(item);
|
||||
}
|
||||
});
|
||||
this.$refs.authTree.setCheckedKeys(tempList);
|
||||
}
|
||||
}).catch(e => {});
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isEdit () {
|
||||
return this.formData.roleId != null;
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
if (this.rowData) {
|
||||
this.formData = {...this.formData, ...this.rowData};
|
||||
if (Array.isArray(this.formData.sysRoleMenuList)) {
|
||||
this.formData.menuIdList = this.formData.sysRoleMenuList.map(item => item.menuId);
|
||||
}
|
||||
}
|
||||
this.loadAuthData();
|
||||
},
|
||||
watch: {
|
||||
menuNameFilter (val) {
|
||||
this.allowParentList = [];
|
||||
this.$refs.authTree.filter(val);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
167
orange-demo-multi-web/src/views/upms/formEditSysUser/index.vue
Normal file
167
orange-demo-multi-web/src/views/upms/formEditSysUser/index.vue
Normal file
@@ -0,0 +1,167 @@
|
||||
<template>
|
||||
<el-form ref="form" :model="formData" :rules="rules" label-width="110px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row :gutter="20" class="full-width-input">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="登录名称" prop="loginName">
|
||||
<el-input v-model="formData.loginName" placeholder="用户登录名称" clearable :disabled="isEdit" />
|
||||
</el-form-item>
|
||||
<el-form-item label="登录密码" v-if="!isEdit" prop="password">
|
||||
<el-input v-model="formData.password" type="password" placeholder="用户登录密码" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="再次输入密码" v-if="!isEdit" prop="passwordRepeat">
|
||||
<el-input v-model="formData.passwordRepeat" type="password" placeholder="再次输入用户密码" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="用户昵称" prop="showName">
|
||||
<el-input v-model="formData.showName" placeholder="用户昵称" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="账号类型" prop="userType">
|
||||
<el-select v-model="formData.userType">
|
||||
<el-option v-for="item in SysUserType.getList()" :key="item.id"
|
||||
:label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户状态" prop="userStatus" v-if="isEdit">
|
||||
<el-radio-group v-model="formData.userStatus">
|
||||
<el-radio v-for="item in SysUserStatus.getList()" :key="item.id" :label="item.id">
|
||||
{{item.name}}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户角色" prop="roleIdList">
|
||||
<el-select v-model="formData.roleIdList" multiple placeholder="用户角色">
|
||||
<el-option v-for="role in roleList" :key="role.roleId"
|
||||
:label="role.roleName" :value="role.roleId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 弹窗下发按钮栏，必须设置class为dialog-btn-layer -->
|
||||
<el-row type="flex" justify="end" class="dialog-btn-layer">
|
||||
<el-button size="mini" type="primary" @click="onCancel(false)" >取消</el-button>
|
||||
<el-button type="primary" size="mini" @click="onSubmit"
|
||||
:disabled="!(checkPermCodeExist('formSysUser:fragmentSysUser:update') || checkPermCodeExist('formSysUser:fragmentSysUser:add'))">
|
||||
确定
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { findTreeNodePath } from '@/utils';
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
import { SystemController } from '@/api';
|
||||
import { uploadMixin } from '@/core/mixins';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
rowData: Object
|
||||
},
|
||||
mixins: [uploadMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
userId: undefined,
|
||||
loginName: undefined,
|
||||
password: undefined,
|
||||
showName: undefined,
|
||||
userType: 2,
|
||||
userStatus: 0,
|
||||
roleIdList: []
|
||||
},
|
||||
params: {
|
||||
userId: undefined,
|
||||
loginName: undefined,
|
||||
password: undefined,
|
||||
showName: undefined,
|
||||
|
||||
userType: 2,
|
||||
userStatus: 0,
|
||||
roleIdListString: undefined
|
||||
},
|
||||
rules: {
|
||||
loginName: [{required: true, message: '用户名称不能为空', trigger: 'blur'}],
|
||||
password: [{required: true, message: '用户密码不能为空', trigger: 'blur'}],
|
||||
passwordRepeat: [{required: true, message: '重输密码不能为空', trigger: 'blur'}],
|
||||
showName: [{required: true, message: '用户昵称不能为空', trigger: 'blur'}],
|
||||
roleIdList: [{required: true, message: '用户角色不能为空', trigger: 'change'}]
|
||||
},
|
||||
showHeaderSelect: false,
|
||||
roleList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onCancel (isSuccess = false) {
|
||||
if (this.observer != null) {
|
||||
this.observer.cancel(isSuccess);
|
||||
}
|
||||
},
|
||||
onSubmit () {
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.formData.userId == null && (this.formData.password !== this.formData.passwordRepeat)) {
|
||||
this.$message.error({message: '两次密码输入不一致，请重新输入', showClose: true});
|
||||
return;
|
||||
}
|
||||
|
||||
let params = {
|
||||
sysUser: {
|
||||
userId: this.formData.userId,
|
||||
loginName: this.formData.loginName,
|
||||
password: this.formData.password,
|
||||
showName: this.formData.showName,
|
||||
userType: this.formData.userType,
|
||||
|
||||
userStatus: this.formData.userStatus
|
||||
},
|
||||
roleIdListString: Array.isArray(this.formData.roleIdList) ? this.formData.roleIdList.join(',') : undefined
|
||||
}
|
||||
|
||||
let operation = null;
|
||||
if (this.formData.userId != null) {
|
||||
operation = SystemController.updateUser(this, params);
|
||||
} else {
|
||||
operation = SystemController.addUser(this, params);
|
||||
}
|
||||
|
||||
operation.then(res => {
|
||||
this.$message.success(this.formData.userId != null ? '编辑成功' : '添加成功');
|
||||
this.onCancel(true);
|
||||
}).catch(e => {
|
||||
//
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
loadRole () {
|
||||
SystemController.getRoleList(this, {}).then(res => {
|
||||
this.roleList = res.data.dataList;
|
||||
}).catch(e => {});
|
||||
},
|
||||
loadRowData (id) {
|
||||
var params = {
|
||||
userId: id
|
||||
}
|
||||
return SystemController.getUser(this, params);
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isEdit () {
|
||||
return (this.formData.userId != null);
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
if (this.rowData != null) {
|
||||
this.formData = {...this.rowData};
|
||||
if (Array.isArray(this.formData.sysUserRoleList)) {
|
||||
this.formData.roleIdList = this.formData.sysUserRoleList.map(item => item.roleId);
|
||||
}
|
||||
}
|
||||
this.loadRole();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
150
orange-demo-multi-web/src/views/upms/formMenuPerm/index.vue
Normal file
150
orange-demo-multi-web/src/views/upms/formMenuPerm/index.vue
Normal file
@@ -0,0 +1,150 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="关联URL">
|
||||
<el-input class="filter-item" v-model="formMenuPerm.formFilter.url"
|
||||
:clearable="true" placeholder="权限字名称" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" size="mini" :plain="true" @click="refreshFormMenuPerm(true)">
|
||||
查询
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="getPermList" size="mini" height="459px"
|
||||
@sort-change="formMenuPerm.SysPerm.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="formMenuPerm.SysPerm.impl.getTableIndex" />
|
||||
<el-table-column label="权限字名称" prop="showName" width="150px">
|
||||
</el-table-column>
|
||||
<el-table-column label="权限字类型" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="mini" :type="getPermCodeType(scope.row.permCodeType)">
|
||||
{{SysPermCodeType.getValue(scope.row.permCodeType)}}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="权限字标识" prop="permCode" width="300px" />
|
||||
<el-table-column label="权限名称" prop="permName" width="150px" />
|
||||
<el-table-column label="关联URL" prop="url" min-width="300px">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { SystemController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formMenuPerm',
|
||||
props: {
|
||||
menuId: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formMenuPerm: {
|
||||
formFilter: {
|
||||
menuId: this.menuId,
|
||||
url: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
menuId: this.menuId,
|
||||
url: undefined
|
||||
},
|
||||
SysPerm: {
|
||||
impl: new TableWidget(this.loadSysPermData, this.loadSysPermVerify, false)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getPermCodeType (permCodeType) {
|
||||
switch (permCodeType) {
|
||||
case this.SysPermCodeType.FORM: return 'primary';
|
||||
case this.SysPermCodeType.FRAGMENT: return 'warning';
|
||||
case this.SysPermCodeType.OPERATION: return 'success';
|
||||
default: return 'info';
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 权限数据获取函数，返回Primise
|
||||
*/
|
||||
loadSysPermData (params) {
|
||||
params = {
|
||||
...params,
|
||||
menuId: this.formMenuPerm.formFilterCopy.menuId
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
SystemController.listMenuPerm(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 权限数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadSysPermVerify () {
|
||||
this.formMenuPerm.formFilterCopy.url = this.formMenuPerm.formFilter.url;
|
||||
this.formMenuPerm.formFilterCopy.menuId = this.formMenuPerm.formFilter.menuId;
|
||||
if (this.formMenuPerm.formFilterCopy.menuId == null || this.formMenuPerm.formFilterCopy.menuId === '') {
|
||||
this.$message.error('所属菜单不能为空！');
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 更新权限管理
|
||||
*/
|
||||
refreshFormMenuPerm (reloadData = false) {
|
||||
// 重新获取数据组件的数据
|
||||
if (reloadData) {
|
||||
this.formMenuPerm.SysPerm.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formMenuPerm.SysPerm.impl.refreshTable();
|
||||
}
|
||||
this.formMenuPerm.isInit = true;
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormMenuPerm();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.initFormData();
|
||||
this.refreshFormMenuPerm();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getPermList () {
|
||||
return this.formMenuPerm.SysPerm.impl.dataList.filter((item) => {
|
||||
return (this.formMenuPerm.formFilterCopy.url == null || this.formMenuPerm.formFilterCopy.url === '') ||
|
||||
(item.url.indexOf(this.formMenuPerm.formFilterCopy.url) !== -1);
|
||||
});
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
416
orange-demo-multi-web/src/views/upms/formPermQuery/index.vue
Normal file
416
orange-demo-multi-web/src/views/upms/formPermQuery/index.vue
Normal file
@@ -0,0 +1,416 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-tabs tab-position="left" v-model="activeFragmentId" :before-leave="onFragmentChange">
|
||||
<el-tab-pane label="角色查询" name="roleQuery" style="height: 300px;">
|
||||
<el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="权限字">
|
||||
<el-cascader class="filter-item" :options="roleQuery.SysPermCode.impl.dropdownList"
|
||||
v-model="roleQuery.SysPermCode.value" size="mini"
|
||||
:props="roleQuery.permCodeProps" placeholder="请选择权限字" clearable
|
||||
@visible-change="roleQuery.SysPermCode.impl.onVisibleChange"
|
||||
@change="onRoleQueryPermCodeChange" />
|
||||
</el-form-item>
|
||||
<el-form-item label="URL">
|
||||
<el-input class="filter-item" v-model="roleQuery.formFilter.permUrl"
|
||||
:clearable="true" placeholder="请输入URL" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshSysRoleQuery(true)">查询</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="roleQuery.SysRole.impl.dataList" size="mini" @sort-change="roleQuery.SysRole.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray" :height="getTableHeight">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="roleQuery.SysRole.impl.getTableIndex" />
|
||||
<el-table-column label="角色名称" prop="roleName">
|
||||
</el-table-column>
|
||||
<el-table-column label="创建人" prop="createUsername">
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right" width="150px">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onShowSysRoleUser(scope.row)" type="text" size="mini">
|
||||
查看角色用户
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="roleQuery.SysRole.impl.totalCount"
|
||||
:current-page="roleQuery.SysRole.impl.currentPage"
|
||||
:page-size="roleQuery.SysRole.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="roleQuery.SysRole.impl.onCurrentPageChange"
|
||||
@size-change="roleQuery.SysRole.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="用户权限字查询" name="permCodeQuery">
|
||||
<el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="用户名称">
|
||||
<el-input class="filter-item" v-model="permCodeQuery.formFilter.loginName"
|
||||
:clearable="true" placeholder="请输入用户名" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshSysPermCodeQuery(true)">查询</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="permCodeQuery.SysPermCode.impl.dataList" size="mini" @sort-change="permCodeQuery.SysPermCode.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray" :height="getTableHeight">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="permCodeQuery.SysPermCode.impl.getTableIndex" />
|
||||
<el-table-column label="权限字名称" prop="showName">
|
||||
</el-table-column>
|
||||
<el-table-column label="权限字类型" prop="permCodeType">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="mini" :type="getPermCodeType(scope.row.permCodeType)">{{SysPermCodeType.getValue(scope.row.permCodeType)}}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="显示顺序" prop="showOrder">
|
||||
</el-table-column>
|
||||
<el-table-column label="权限字标识" prop="permCode">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="permCodeQuery.SysPermCode.impl.totalCount"
|
||||
:current-page="permCodeQuery.SysPermCode.impl.currentPage"
|
||||
:page-size="permCodeQuery.SysPermCode.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="permCodeQuery.SysPermCode.impl.onCurrentPageChange"
|
||||
@size-change="permCodeQuery.SysPermCode.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="用户权限查询" name="permQuery">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="所属权限模块">
|
||||
<el-cascader class="filter-item" :options="permQuery.PermModule.impl.dropdownList" placeholder="所属权限模块"
|
||||
v-model="permQuery.PermModule.value" size="mini" clearable
|
||||
:props="{label: 'moduleName', value: 'moduleId'}"
|
||||
@visible-change="permQuery.PermModule.impl.onVisibleChange"
|
||||
@change="onPermQueryPermModuleChange" />
|
||||
</el-form-item>
|
||||
<el-form-item label="用户名称">
|
||||
<el-input class="filter-item" v-model="permQuery.formFilter.loginName"
|
||||
:clearable="true" placeholder="请输入用户名" />
|
||||
</el-form-item>
|
||||
<el-form-item label="URL">
|
||||
<el-input class="filter-item" v-model="permQuery.formFilter.url"
|
||||
:clearable="true" placeholder="请输入URL" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshSysPermQuery(true)">查询</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="permQuery.SysPerm.impl.dataList" size="mini" @sort-change="permQuery.SysPerm.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray" :height="getTableHeight">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="permQuery.SysPerm.impl.getTableIndex" />
|
||||
<el-table-column label="权限名称" prop="permName" width="150px">
|
||||
</el-table-column>
|
||||
<el-table-column label="所属权限模块" prop="moduleName" width="150px">
|
||||
</el-table-column>
|
||||
<el-table-column label="关联的url" prop="url">
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" width="200px">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="permQuery.SysPerm.impl.totalCount"
|
||||
:current-page="permQuery.SysPerm.impl.currentPage"
|
||||
:page-size="permQuery.SysPerm.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="permQuery.SysPerm.impl.onCurrentPageChange"
|
||||
@size-change="permQuery.SysPerm.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { SystemController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
name: 'formPermQuery',
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
activeFragmentId: 'roleQuery',
|
||||
roleQuery: {
|
||||
formFilter: {
|
||||
permCodeId: undefined,
|
||||
permUrl: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
permCodeId: undefined,
|
||||
permUrl: undefined
|
||||
},
|
||||
permCodeProps: {
|
||||
value: 'permCodeId',
|
||||
label: 'showName',
|
||||
checkStrictly: true
|
||||
},
|
||||
SysPermCode: {
|
||||
impl: new DropdownWidget(this.loadPermCodeDropdownList, true, 'permCodeId'),
|
||||
value: []
|
||||
},
|
||||
SysRole: {
|
||||
impl: new TableWidget(this.loadSysRoleData, this.loadSysRoleVerify, true, 'createTime', 1)
|
||||
},
|
||||
isInit: false
|
||||
},
|
||||
permCodeQuery: {
|
||||
formFilter: {
|
||||
loginName: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
loginName: undefined
|
||||
},
|
||||
SysPermCode: {
|
||||
impl: new TableWidget(this.loadSysPermCodeData, this.loadSysPermCodeVerify, false)
|
||||
},
|
||||
isInit: false
|
||||
},
|
||||
permQuery: {
|
||||
formFilter: {
|
||||
loginName: undefined,
|
||||
permModuleId: undefined,
|
||||
url: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
loginName: undefined,
|
||||
permModuleId: undefined,
|
||||
url: undefined
|
||||
},
|
||||
PermModule: {
|
||||
impl: new DropdownWidget(this.loadPermModuleIdDropdownList, true, 'moduleId', 'parentId'),
|
||||
value: []
|
||||
},
|
||||
SysPerm: {
|
||||
impl: new TableWidget(this.loadSysPermData, this.loadSysPermVerify, false)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onRoleQueryPermCodeChange (value) {
|
||||
this.roleQuery.formFilter.permCodeId = Array.isArray(value) ? value[value.length - 1] : undefined;
|
||||
},
|
||||
/**
|
||||
* 获取权限字下拉数据
|
||||
*/
|
||||
loadPermCodeDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
SystemController.getPermCodeList(this, params).then(res => {
|
||||
resolve(res.data.dataList);
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 获取角色查询数据
|
||||
*/
|
||||
loadSysRoleData (params) {
|
||||
// params.permCodeId = this.roleQuery.formFilterCopy.permCodeId;
|
||||
/*
|
||||
params.sysPermFilter = {
|
||||
url: this.roleQuery.formFilterCopy.permUrl
|
||||
}
|
||||
*/
|
||||
params.url = this.roleQuery.formFilterCopy.permUrl;
|
||||
return new Promise((resolve, reject) => {
|
||||
SystemController.queryRoleByURL(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 角色查询验证
|
||||
*/
|
||||
loadSysRoleVerify () {
|
||||
this.roleQuery.formFilterCopy.permCodeId = this.roleQuery.formFilter.permCodeId;
|
||||
this.roleQuery.formFilterCopy.permUrl = this.roleQuery.formFilter.permUrl;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 跳转到角色用户页面
|
||||
*/
|
||||
onShowSysRoleUser (row) {
|
||||
|
||||
},
|
||||
/**
|
||||
* 刷新角色查询数据
|
||||
*/
|
||||
refreshSysRoleQuery (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.roleQuery.SysRole.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.roleQuery.SysRole.impl.refreshTable();
|
||||
}
|
||||
this.roleQuery.isInit = true;
|
||||
},
|
||||
getPermCodeType (permCodeType) {
|
||||
switch (permCodeType) {
|
||||
case this.SysPermCodeType.FORM: return 'primary';
|
||||
case this.SysPermCodeType.FRAGMENT: return 'warning';
|
||||
case this.SysPermCodeType.OPERATION: return 'success';
|
||||
default: return 'info';
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 权限字数据查询
|
||||
*/
|
||||
loadSysPermCodeData (params) {
|
||||
params.sysUserFilter = {
|
||||
loginName: this.permCodeQuery.formFilterCopy.loginName
|
||||
}
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
SystemController.queryPermCode(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 权限字数据查询校验
|
||||
*/
|
||||
loadSysPermCodeVerify () {
|
||||
this.permCodeQuery.formFilterCopy.loginName = this.permCodeQuery.formFilter.loginName;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 刷新权限字查询数据
|
||||
*/
|
||||
refreshSysPermCodeQuery (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.permCodeQuery.SysPermCode.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.permCodeQuery.SysPermCode.impl.refreshTable();
|
||||
}
|
||||
this.permCodeQuery.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 所属权限模块下拉数据获取函数
|
||||
*/
|
||||
loadPermModuleIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
SystemController.getPermGroupList(this, params).then(res => {
|
||||
resolve(res.data);
|
||||
}).catch(e => {
|
||||
reject();
|
||||
});
|
||||
});
|
||||
},
|
||||
onPermQueryPermModuleChange (value) {
|
||||
this.permQuery.formFilter.permModuleId = Array.isArray(value) ? value[value.length - 1] : undefined;
|
||||
},
|
||||
/**
|
||||
* 获取权限数据
|
||||
*/
|
||||
loadSysPermData (params) {
|
||||
params = {
|
||||
...params,
|
||||
moduleId: this.permQuery.formFilterCopy.permModuleId,
|
||||
loginName: this.permQuery.formFilterCopy.loginName,
|
||||
url: this.permQuery.formFilterCopy.url
|
||||
}
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
SystemController.queryPerm(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 获取权限数据校验
|
||||
*/
|
||||
loadSysPermVerify () {
|
||||
this.permQuery.formFilterCopy.permModuleId = this.permQuery.formFilter.permModuleId;
|
||||
this.permQuery.formFilterCopy.loginName = this.permQuery.formFilter.loginName;
|
||||
this.permQuery.formFilterCopy.url = this.permQuery.formFilter.url;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 刷新权限数据
|
||||
*/
|
||||
refreshSysPermQuery (reloadData = false) {
|
||||
if (reloadData) {
|
||||
this.permQuery.SysPerm.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.permQuery.SysPerm.impl.refreshTable();
|
||||
}
|
||||
this.permQuery.isInit = true;
|
||||
},
|
||||
/**
|
||||
* Tab切换调用
|
||||
*/
|
||||
onFragmentChange (fragmentId) {
|
||||
return true;
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getTableHeight () {
|
||||
return (this.getClientHeight - 220) + 'px';
|
||||
},
|
||||
...mapGetters(['getClientHeight'])
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
216
orange-demo-multi-web/src/views/upms/formSetRoleUsers/index.vue
Normal file
216
orange-demo-multi-web/src/views/upms/formSetRoleUsers/index.vue
Normal file
@@ -0,0 +1,216 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="325">
|
||||
<el-form-item label="用户状态">
|
||||
<el-select class="filter-item" v-model="formSysUser.formFilter.sysUserStatus" :clearable="true"
|
||||
placeholder="用户状态" :loading="formSysUser.sysUserStatus.impl.loading"
|
||||
@visible-change="onSysUserStatusVisibleChange">
|
||||
<el-option v-for="item in formSysUser.sysUserStatus.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户名">
|
||||
<el-input class="filter-item" v-model="formSysUser.formFilter.sysUserLoginName"
|
||||
:clearable="true" placeholder="用户名" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormSysUser(true)">查询</el-button>
|
||||
<el-button slot="operator" size="mini" type="primary" :plain="false" @click="onSetUser"
|
||||
:disabled="selectUsers == null || selectUsers.length <= 0">授权人员</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formSysUser.SysUser.impl.dataList" size="mini" row-key="userId" ref="userTable"
|
||||
header-cell-class-name="table-header-gray" height="395px" @selection-change="onTableSelectionChange">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="formSysUser.SysUser.impl.getTableIndex" />
|
||||
<el-table-column header-align="center" align="center" type="selection" width="50px" :reserve-selection="true" />
|
||||
<el-table-column label="用户名" prop="loginName">
|
||||
</el-table-column>
|
||||
<el-table-column label="昵称" prop="showName">
|
||||
</el-table-column>
|
||||
<el-table-column label="账号类型">
|
||||
<template slot-scope="scope">
|
||||
<span>{{SysUserType.getValue(scope.row.userType)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :type="getUserStatusType(scope.row.userStatus)" size="mini">{{SysUserStatus.getValue(scope.row.userStatus)}}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formSysUser.SysUser.impl.totalCount"
|
||||
:current-page="formSysUser.SysUser.impl.currentPage"
|
||||
:page-size="formSysUser.SysUser.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formSysUser.SysUser.impl.onCurrentPageChange"
|
||||
@size-change="formSysUser.SysUser.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { SystemController, DictionaryController } from '@/api';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
roleId: {
|
||||
type: [String, Number],
|
||||
required: true
|
||||
}
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formSysUser: {
|
||||
formFilter: {
|
||||
sysUserStatus: undefined,
|
||||
sysUserLoginName: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
sysUserStatus: undefined,
|
||||
sysUserLoginName: undefined
|
||||
},
|
||||
sysUserStatus: {
|
||||
impl: new DropdownWidget(this.loadSysUserStatusDropdownList)
|
||||
},
|
||||
SysUser: {
|
||||
impl: new TableWidget(this.loadSysUserData, this.loadSysUserVerify, true, 'createTime', 1)
|
||||
},
|
||||
isInit: false
|
||||
},
|
||||
selectUsers: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 用户状态下拉数据获取函数
|
||||
*/
|
||||
loadSysUserStatusDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictSysUserStatus(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 用户状态下拉框显隐
|
||||
*/
|
||||
onSysUserStatusVisibleChange (show) {
|
||||
this.formSysUser.sysUserStatus.impl.onVisibleChange(show).catch(e => {});
|
||||
},
|
||||
getUserStatusType (status) {
|
||||
if (status === this.SysUserStatus.NORMAL) {
|
||||
return 'success';
|
||||
} else if (status === this.SysUserStatus.LOCKED) {
|
||||
return 'danger';
|
||||
} else {
|
||||
return 'info';
|
||||
}
|
||||
},
|
||||
onTableSelectionChange (values) {
|
||||
this.selectUsers = values;
|
||||
},
|
||||
onSetUser () {
|
||||
let params = {
|
||||
roleId: this.roleId,
|
||||
userIdListString: this.selectUsers.map((item) => {
|
||||
return item.userId
|
||||
}).join(',')
|
||||
}
|
||||
|
||||
SystemController.addRoleUser(this, params).then(res => {
|
||||
this.$message.success('授权成功');
|
||||
this.refreshFormSysUser(true);
|
||||
this.$refs.userTable.clearSelection();
|
||||
this.selectUsers = [];
|
||||
}).catch(e => {});
|
||||
},
|
||||
onCancel () {
|
||||
this.$router.go(-1);
|
||||
},
|
||||
loadSysUserData (params) {
|
||||
params.roleId = this.roleId;
|
||||
params.sysUserFilter = {
|
||||
loginName: this.formSysUser.formFilterCopy.sysUserLoginName,
|
||||
userStatus: this.formSysUser.formFilterCopy.sysUserStatus
|
||||
}
|
||||
this.$refs.userTable.clearSelection();
|
||||
return new Promise((resolve, reject) => {
|
||||
SystemController.listNotInUserRole(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadSysUserVerify () {
|
||||
this.formSysUser.formFilterCopy.sysUserLoginName = this.formSysUser.formFilter.sysUserLoginName;
|
||||
this.formSysUser.formFilterCopy.sysUserStatus = this.formSysUser.formFilter.sysUserStatus;
|
||||
return true;
|
||||
},
|
||||
refreshFormSysUser (reloadData = false) {
|
||||
// 重新获取数据组件的数据
|
||||
if (reloadData) {
|
||||
this.formSysUser.SysUser.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formSysUser.SysUser.impl.refreshTable();
|
||||
}
|
||||
this.formSysUser.sysUserStatus.impl.onVisibleChange(true).catch(e => {});
|
||||
this.formSysUser.isInit = true;
|
||||
},
|
||||
initData () {
|
||||
this.refreshFormSysUser();
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.initData();
|
||||
},
|
||||
computed: {
|
||||
getContextHeightStyle () {
|
||||
return [
|
||||
{'height': (this.getClientHeight - 142) + 'px'}
|
||||
]
|
||||
},
|
||||
...mapGetters(['getClientHeight'])
|
||||
},
|
||||
watch: {
|
||||
currentPage: function (value, oldValue) {
|
||||
this.loadDatasource(false).catch(e => {
|
||||
this.currentPage = oldValue;
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,305 @@
|
||||
<template>
|
||||
<div class="tab-dialog-box" style="position: relative;">
|
||||
<el-tabs v-model="activeFragment">
|
||||
<el-tab-pane label="栏目管理" name="fragmentSysColumn" style="width: 100%;">
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row type="flex" justify="end" style="margin-bottom: 18px;">
|
||||
<el-button type="primary" size="mini" :plain="true"
|
||||
@click="initFormData()">
|
||||
刷新
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" :disabled="!checkPermCodeExist('sysMenuManagement:add')"
|
||||
@click="onCreateSysColumnClick()">
|
||||
新建
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="columnList" size="mini" :height="getTabPaneHeight + 'px'"
|
||||
header-cell-class-name="table-header-gray" row-key="menuId">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="55px" />
|
||||
<el-table-column label="栏目名称" prop="columnName" />
|
||||
<el-table-column label="显示顺序" prop="showOrder" />
|
||||
<el-table-column label="操作" width="200px">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onEditSysColumnClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('sysMenuManagement:update')">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('sysMenuManagement:delete')">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="菜单管理" name="fragmentSysMenu" style="width: 100%;">
|
||||
<el-form label-width="80px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="所属栏目" style="flex-grow: 1">
|
||||
<el-select class="filter-item" v-model="currentColumnId" filterable
|
||||
placeholder="所属栏目">
|
||||
<el-option v-for="item in columnList" :key="item.columnId" :value="item.columnId" :label="item.columnName" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-row type="flex" justify="end">
|
||||
<el-button type="primary" size="mini" :plain="true"
|
||||
@click="initFormData(true)">
|
||||
刷新
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" :disabled="!checkPermCodeExist('sysMenuManagement:add')"
|
||||
@click="onCreateSysMenuClick()">
|
||||
新建
|
||||
</el-button>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="currentMenuTree" size="mini" :height="getTabPaneHeight + 'px'"
|
||||
header-cell-class-name="table-header-gray" row-key="menuId">
|
||||
<el-table-column label="菜单名称" prop="menuName" width="300px">
|
||||
</el-table-column>
|
||||
<el-table-column label="菜单图标" prop="icon" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<i :class="scope.row.icon" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="菜单顺序" prop="showOrder" width="100px">
|
||||
</el-table-column>
|
||||
<el-table-column label="菜单类型" prop="menuType" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="mini" :type="getMenuType(scope.row)">{{SysMenuType.getValue(scope.row.menuType)}}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="菜单路由" prop="formRouterName" min-width="250px">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="200px">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onEditSysMenuClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('sysMenuManagement:update')">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button @click="onAddChildSysMenuClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('sysMenuManagement:add') || scope.row.menuType === SysMenuType.BUTTON">
|
||||
添加
|
||||
</el-button>
|
||||
<el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('sysMenuManagement:delete')">
|
||||
删除
|
||||
</el-button>
|
||||
<el-button @click="onShowPermList(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('sysMenuManagement:listMenuPerm') || scope.row.menuType === SysMenuType.DIRECTORY">
|
||||
权限资源
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { treeDataTranslate } from '@/utils';
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { DictionaryController, SystemController } from '@/api';
|
||||
import formEditSysMenu from '@/views/upms/formEditSysMenu';
|
||||
import formMenuPerm from '@/views/upms/formMenuPerm';
|
||||
import formEditColumn from '@/views/upms/formEditSysMenu/editColumn.vue';
|
||||
|
||||
export default {
|
||||
name: 'sysMenuManagement',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
activeFragment: 'fragmentSysColumn',
|
||||
allMenuList: [],
|
||||
menuTree: [],
|
||||
currentColumnId: undefined,
|
||||
formSysMenu: {
|
||||
currentColumnId: {
|
||||
impl: new DropdownWidget(this.loadCurrentColumnDropdownList, false, 'columnId', 'columnName'),
|
||||
value: []
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getMenuType (row) {
|
||||
if (row.menuType === 0) {
|
||||
return 'primary'
|
||||
} else if (row.menuType === 1) {
|
||||
return 'success';
|
||||
} else if (row.menuType === 2) {
|
||||
return 'danger';
|
||||
} else if (row.menuType === 3) {
|
||||
return 'warning';
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 新建栏目
|
||||
*/
|
||||
onCreateSysColumnClick () {
|
||||
this.$dialog.show('新建', formEditColumn, {
|
||||
area: ['500px']
|
||||
}, {}).then(res => {
|
||||
this.initFormData();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 编辑栏目
|
||||
*/
|
||||
onEditSysColumnClick (row) {
|
||||
this.$dialog.show('编辑', formEditColumn, {
|
||||
area: ['500px']
|
||||
}, {
|
||||
...row
|
||||
}).then(res => {
|
||||
this.initFormData();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 新建菜单
|
||||
*/
|
||||
onCreateSysMenuClick () {
|
||||
let params = {
|
||||
parentId: this.currentColumnId,
|
||||
menuList: this.allMenuList
|
||||
};
|
||||
this.$dialog.show('新建', formEditSysMenu, {
|
||||
area: ['800px']
|
||||
}, params).then(res => {
|
||||
this.initFormData();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 编辑菜单
|
||||
*/
|
||||
onEditSysMenuClick (row) {
|
||||
SystemController.viewMenu(this, {menuId: row.menuId}).then(res => {
|
||||
let params = {
|
||||
rowData: res.data,
|
||||
menuId: row.menuId,
|
||||
menuList: this.allMenuList
|
||||
};
|
||||
|
||||
this.$dialog.show('编辑', formEditSysMenu, {
|
||||
area: ['800px']
|
||||
}, params).then(res => {
|
||||
this.formSysMenu.SysMenu.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 添加子菜单
|
||||
*/
|
||||
onAddChildSysMenuClick (row) {
|
||||
let params = {
|
||||
parentId: row.menuId,
|
||||
menuList: this.allMenuList
|
||||
};
|
||||
|
||||
this.$dialog.show('添加子菜单', formEditSysMenu, {
|
||||
area: ['800px']
|
||||
}, params).then(res => {
|
||||
this.formSysMenu.SysMenu.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
onDeleteClick (row) {
|
||||
let params = {
|
||||
menuId: row.menuId
|
||||
};
|
||||
|
||||
this.$confirm('是否删除此菜单项？').then(res => {
|
||||
SystemController.deleteMenu(this, params).then(res => {
|
||||
this.$message.success('删除成功');
|
||||
this.formSysMenu.SysMenu.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 权限资源
|
||||
*/
|
||||
onShowPermList (row) {
|
||||
let params = {
|
||||
menuId: row.menuId
|
||||
};
|
||||
|
||||
this.$dialog.show('权限资源 - ' + row.menuName, formMenuPerm, {
|
||||
area: ['1200px', '600px']
|
||||
}, params).catch(e => {
|
||||
});
|
||||
},
|
||||
onResume () {
|
||||
this.initFormData();
|
||||
},
|
||||
initFormData () {
|
||||
SystemController.getMenuPermList(this, {}).then(res => {
|
||||
this.allMenuList = res.data.map((item) => {
|
||||
return {...item};
|
||||
});
|
||||
this.menuTree = treeDataTranslate(res.data, 'menuId');
|
||||
// 获取默认的栏目
|
||||
this.currentColumnId = undefined;
|
||||
for (let i = 0; i < this.menuTree.length; i++) {
|
||||
if (this.menuTree[i].menuType === this.SysMenuType.DIRECTORY) {
|
||||
this.currentColumnId = this.menuTree[i].menuId;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}).catch(e => {});
|
||||
},
|
||||
formInit () {
|
||||
this.initFormData();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
},
|
||||
computed: {
|
||||
getTabPaneHeight () {
|
||||
return (this.getMainContextHeight - 150);
|
||||
},
|
||||
currentMenuTree () {
|
||||
if (this.currentColumnId == null || this.currentColumnId === '') return [];
|
||||
for (let i = 0; i < this.menuTree.length; i++) {
|
||||
if (this.menuTree[i].menuId === this.currentColumnId) return this.menuTree[i].children;
|
||||
}
|
||||
return [];
|
||||
},
|
||||
columnList () {
|
||||
return this.menuTree.map((item) => {
|
||||
return {
|
||||
menuId: item.menuId,
|
||||
columnId: item.menuId,
|
||||
columnName: item.menuName,
|
||||
showOrder: item.showOrder
|
||||
};
|
||||
});
|
||||
},
|
||||
...mapGetters(['getMainContextHeight'])
|
||||
}
|
||||
}
|
||||
</script>
|
||||
239
orange-demo-multi-web/src/views/upms/formSysMenu/index.vue
Normal file
239
orange-demo-multi-web/src/views/upms/formSysMenu/index.vue
Normal file
@@ -0,0 +1,239 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-button slot="operator" type="primary" size="mini" :plain="true"
|
||||
@click="refreshFormSysMenu(true)">
|
||||
刷新
|
||||
</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSysMenu:fragmentSysMenu:add')"
|
||||
@click="onCreateSysMenuClick()">
|
||||
新建
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formSysMenu.SysMenu.impl.dataList" size="mini"
|
||||
header-cell-class-name="table-header-gray" row-key="menuId">
|
||||
<el-table-column label="菜单名称" prop="menuName" width="300px">
|
||||
</el-table-column>
|
||||
<el-table-column label="菜单图标" prop="icon" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<i :class="scope.row.icon" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="菜单顺序" prop="showOrder" width="100px">
|
||||
</el-table-column>
|
||||
<el-table-column label="菜单类型" prop="menuType" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="mini" :type="getMenuType(scope.row)">{{SysMenuType.getValue(scope.row.menuType)}}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="菜单路由" prop="formRouterName" min-width="250px">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right" width="200px">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onEditSysMenuClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSysMenu:fragmentSysMenu:update')">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button @click="onAddChildSysMenuClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSysMenu:fragmentSysMenu:add') || scope.row.menuType === SysMenuType.BUTTON">
|
||||
添加
|
||||
</el-button>
|
||||
<el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSysMenu:fragmentSysMenu:delete')">
|
||||
删除
|
||||
</el-button>
|
||||
<el-button @click="onShowPermList(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSysMenu:fragmentSysMenu:listMenuPerm') || scope.row.menuType === SysMenuType.DIRECTORY">
|
||||
权限资源
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { treeDataTranslate } from '@/utils';
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { DictionaryController, SystemController } from '@/api';
|
||||
import formEditSysMenu from '@/views/upms/formEditSysMenu';
|
||||
import formMenuPerm from '@/views/upms/formMenuPerm';
|
||||
|
||||
export default {
|
||||
name: 'formSysMenu',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formSysMenu: {
|
||||
formFilter: {
|
||||
},
|
||||
formFilterCopy: {
|
||||
},
|
||||
SysMenu: {
|
||||
impl: new TableWidget(this.loadSysMenuData, this.loadSysMenuVerify, false)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getMenuType (row) {
|
||||
if (row.menuType === 0) {
|
||||
return 'primary'
|
||||
} else if (row.menuType === 1) {
|
||||
return 'success';
|
||||
} else if (row.menuType === 2) {
|
||||
return 'danger';
|
||||
} else if (row.menuType === 3) {
|
||||
return 'warning';
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 菜单数据数据获取函数，返回Primise
|
||||
*/
|
||||
loadSysMenuData (params) {
|
||||
return new Promise((resolve, reject) => {
|
||||
SystemController.getMenuPermList(this, params).then(res => {
|
||||
this.allMenuList = res.data.map((item) => {
|
||||
return {...item};
|
||||
});
|
||||
resolve({
|
||||
dataList: treeDataTranslate(res.data, 'menuId'),
|
||||
totalCount: res.data.length
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 菜单数据数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadSysMenuVerify () {
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 菜单数据当前页变化函数
|
||||
*/
|
||||
onSysMenuCurrentPageChange (newPage) {
|
||||
this.formSysMenu.SysMenu.impl.onCurrentPageChange(newPage);
|
||||
},
|
||||
/**
|
||||
* 菜单数据每页显示数量变化函数（跳转回第一页）
|
||||
*/
|
||||
onSysMenuPageSizeChange (newPage) {
|
||||
this.formSysMenu.SysMenu.impl.onPageSizeChange(newPage);
|
||||
},
|
||||
/**
|
||||
* 更新菜单管理
|
||||
*/
|
||||
refreshFormSysMenu (reloadData = false) {
|
||||
// 重新获取数据组件的数据
|
||||
if (reloadData) {
|
||||
this.formSysMenu.SysMenu.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formSysMenu.SysMenu.impl.refreshTable();
|
||||
}
|
||||
this.formSysMenu.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 新建
|
||||
*/
|
||||
onCreateSysMenuClick () {
|
||||
let params = {
|
||||
menuList: this.allMenuList
|
||||
};
|
||||
this.$dialog.show('新建', formEditSysMenu, {
|
||||
area: ['800px']
|
||||
}, params).then(res => {
|
||||
this.refreshFormSysMenu();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 编辑
|
||||
*/
|
||||
onEditSysMenuClick (row) {
|
||||
SystemController.viewMenu(this, {menuId: row.menuId}).then(res => {
|
||||
let params = {
|
||||
rowData: res.data,
|
||||
menuId: row.menuId,
|
||||
menuList: this.allMenuList
|
||||
};
|
||||
|
||||
this.$dialog.show('编辑', formEditSysMenu, {
|
||||
area: ['800px']
|
||||
}, params).then(res => {
|
||||
this.formSysMenu.SysMenu.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 添加子菜单
|
||||
*/
|
||||
onAddChildSysMenuClick (row) {
|
||||
let params = {
|
||||
parentId: row.menuId,
|
||||
menuList: this.allMenuList
|
||||
};
|
||||
|
||||
this.$dialog.show('添加子菜单', formEditSysMenu, {
|
||||
area: ['800px']
|
||||
}, params).then(res => {
|
||||
this.formSysMenu.SysMenu.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
onDeleteClick (row) {
|
||||
let params = {
|
||||
menuId: row.menuId
|
||||
};
|
||||
|
||||
this.$confirm('是否删除此菜单项？').then(res => {
|
||||
SystemController.deleteMenu(this, params).then(res => {
|
||||
this.$message.success('删除成功');
|
||||
this.formSysMenu.SysMenu.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 权限资源
|
||||
*/
|
||||
onShowPermList (row) {
|
||||
let params = {
|
||||
menuId: row.menuId
|
||||
};
|
||||
|
||||
this.$dialog.show('权限资源 - ' + row.menuName, formMenuPerm, {
|
||||
area: ['1200px', '600px']
|
||||
}, params).catch(e => {
|
||||
});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormSysMenu();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.initFormData();
|
||||
this.refreshFormSysMenu();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
398
orange-demo-multi-web/src/views/upms/formSysPerm/index.vue
Normal file
398
orange-demo-multi-web/src/views/upms/formSysPerm/index.vue
Normal file
@@ -0,0 +1,398 @@
|
||||
<template>
|
||||
<el-container>
|
||||
<el-aside width="300px">
|
||||
<el-card class="base-card" shadow="never" :body-style="{ padding: '0px' }">
|
||||
<div slot="header" class="base-card-header">
|
||||
<span>权限模块</span>
|
||||
<div class="base-card-operation">
|
||||
<el-button type="text"
|
||||
:disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:addPermModule')"
|
||||
icon="el-icon-circle-plus-outline" @click="onCreatePermModuleClick()" />
|
||||
</div>
|
||||
</div>
|
||||
<el-scrollbar :style="{height: (getClientHeight - 184) + 'px'}" class="custom-scroll">
|
||||
<el-tree ref="moduleTree" :data="getModuleTreeData" :props="{label: 'moduleName'}"
|
||||
node-key="moduleId" @node-click="onModuleNodeClick" :default-expanded-keys="formPerm.expandedModule"
|
||||
:highlight-current="true" @node-expand="onModuleNodeExpand" @node-collapse="onModuleNodeCollapse">
|
||||
<div class="module-node-item" slot-scope="{ data }">
|
||||
<div class="module-node-menu" :class="{group: data.moduleType === SysPermModuleType.GROUP}" v-if="!data.isAll">
|
||||
<el-button type="text" size="mini" @click.stop="onEditpermModuleClick(data)" icon="el-icon-edit-outline"
|
||||
:disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:updatePermModule')"></el-button>
|
||||
<el-button type="text" size="mini" v-show="data.moduleType === SysPermModuleType.GROUP"
|
||||
:disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:addPermModule')" icon="el-icon-circle-plus-outline"
|
||||
@click.stop="onAddChildPermModuleClick(data)"></el-button>
|
||||
<el-button type="text" size="mini" @click.stop="onDeleteModuleClick(data)" icon="el-icon-delete"
|
||||
:disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:deletePermModule')"></el-button>
|
||||
</div>
|
||||
<div class="module-node-text" :class="{group: data.moduleType === SysPermModuleType.GROUP}">
|
||||
<div class="text">{{ data.moduleName }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-tree>
|
||||
</el-scrollbar>
|
||||
</el-card>
|
||||
</el-aside>
|
||||
<el-main style="padding-left: 15px;">
|
||||
<el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="关联URL">
|
||||
<el-input class="filter-item" placeholder="URL模糊搜索" v-model="formPerm.formFilter.url"
|
||||
size="mini" clearable />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormPerm(true)">查询</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:addPerm')"
|
||||
@click="onCreatePermClick()">
|
||||
新建
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formPerm.SysPerm.impl.dataList" size="mini" @sort-change="formPerm.SysPerm.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray" :height="(getClientHeight - 222) + 'px'">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="formPerm.SysPerm.impl.getTableIndex" />
|
||||
<el-table-column label="权限名称" prop="permName" width="150px">
|
||||
</el-table-column>
|
||||
<el-table-column label="权限模块" prop="moduleIdDictMap.name" width="100px">
|
||||
</el-table-column>
|
||||
<el-table-column label="关联URL" prop="url" min-width="250px">
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onEditPermModuleClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:updatePerm')">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSysPerm:fragmentSysPerm:deletePerm')">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formPerm.SysPerm.impl.totalCount"
|
||||
:current-page="formPerm.SysPerm.impl.currentPage"
|
||||
:page-size="formPerm.SysPerm.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formPerm.SysPerm.impl.onCurrentPageChange"
|
||||
@size-change="formPerm.SysPerm.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { SystemController, DictionaryController } from '@/api';
|
||||
import formEditSysPerm from '../formEditSysPerm';
|
||||
import formEditSysPermModule from '../formEditSysPermModule';
|
||||
|
||||
export default {
|
||||
name: 'formSysPerm',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formPerm: {
|
||||
formFilter: {
|
||||
permModuleId: undefined,
|
||||
url: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
permModuleId: undefined,
|
||||
url: undefined
|
||||
},
|
||||
permModuleId: {
|
||||
impl: new DropdownWidget(this.loadPermModuleIdDropdownList, true, 'moduleId', 'parentId')
|
||||
},
|
||||
SysPerm: {
|
||||
impl: new TableWidget(this.loadSysPermData, this.loadSysPermVerify, true)
|
||||
},
|
||||
permModuleList: [],
|
||||
expandedModule: [],
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 权限数据获取函数，返回Primise
|
||||
*/
|
||||
loadSysPermData (params) {
|
||||
params.sysPermFilter = {
|
||||
url: this.formPerm.formFilterCopy.url === '' ? undefined : this.formPerm.formFilterCopy.url,
|
||||
moduleId: this.formPerm.formFilterCopy.permModuleId === '' ? undefined : this.formPerm.formFilterCopy.permModuleId
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
SystemController.getPermList(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 权限数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadSysPermVerify () {
|
||||
this.formPerm.formFilterCopy.url = this.formPerm.formFilter.url;
|
||||
this.formPerm.formFilterCopy.permModuleId = this.formPerm.formFilter.permModuleId;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 所属权限模块下拉数据获取函数
|
||||
*/
|
||||
loadPermModuleIdDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
SystemController.getPermGroupList(this, params).then(res => {
|
||||
this.formPerm.permModuleList = res.data;
|
||||
resolve(res.data);
|
||||
}).catch(e => {
|
||||
reject();
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 所属权限模块下拉框显隐
|
||||
*/
|
||||
onPermModuleIdVisibleChange (show) {
|
||||
this.formPerm.permModuleId.impl.onVisibleChange(show).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 所属权限模块选中值改变
|
||||
*/
|
||||
onPermModuleIdValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新权限管理
|
||||
*/
|
||||
refreshFormPerm (reloadData = false) {
|
||||
// 重新获取数据组件的数据
|
||||
if (reloadData) {
|
||||
this.formPerm.SysPerm.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formPerm.SysPerm.impl.refreshTable();
|
||||
}
|
||||
this.formPerm.permModuleId.impl.onVisibleChange(true).catch(e => {});
|
||||
this.formPerm.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 新建
|
||||
*/
|
||||
onCreatePermClick () {
|
||||
let params = {
|
||||
currentPermGroupId: this.formPerm.formFilterCopy.permModuleId,
|
||||
permModuleList: this.formPerm.permModuleId.impl.dropdownList
|
||||
};
|
||||
|
||||
this.$dialog.show('新建', formEditSysPerm, {
|
||||
area: ['600px']
|
||||
}, params).then(res => {
|
||||
this.refreshFormPerm();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 编辑
|
||||
*/
|
||||
onEditPermModuleClick (row) {
|
||||
let params = {
|
||||
moduleId: row.moduleId,
|
||||
permId: row.permId,
|
||||
rowData: row,
|
||||
permModuleList: this.formPerm.permModuleId.impl.dropdownList
|
||||
};
|
||||
|
||||
this.$dialog.show('编辑', formEditSysPerm, {
|
||||
area: ['600px']
|
||||
}, params).then(res => {
|
||||
this.formPerm.SysPerm.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
onDeleteClick (row) {
|
||||
let params = {
|
||||
permId: row.permId
|
||||
};
|
||||
|
||||
this.$confirm('是否删除此权限？').then(res => {
|
||||
SystemController.deletePerm(this, params).then(res => {
|
||||
this.$message.success('删除成功');
|
||||
this.formPerm.SysPerm.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormPerm();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.initFormData();
|
||||
this.refreshFormPerm();
|
||||
},
|
||||
onModuleNodeClick (data) {
|
||||
if (data.moduleType === this.SysPermModuleType.CONTROLLER) {
|
||||
this.formPerm.formFilter.permModuleId = data.moduleId;
|
||||
this.refreshFormPerm(true);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 新建模块
|
||||
*/
|
||||
onCreatePermModuleClick () {
|
||||
let params = {
|
||||
moduleType: this.SysPermModuleType.GROUP,
|
||||
moduleList: this.formPerm.permModuleList
|
||||
};
|
||||
|
||||
this.$dialog.show('新建模块', formEditSysPermModule, {
|
||||
area: ['600px']
|
||||
}, params).then(res => {
|
||||
this.formPerm.permModuleId.impl.reloadDropdownData().catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 编辑模块
|
||||
*/
|
||||
onEditpermModuleClick (row) {
|
||||
let params = {
|
||||
moduleId: row.moduleId,
|
||||
moduleType: row.moduleType,
|
||||
rowData: row,
|
||||
moduleList: this.formPerm.permModuleList
|
||||
};
|
||||
|
||||
this.$dialog.show('编辑模块', formEditSysPermModule, {
|
||||
area: ['600px']
|
||||
}, params).then(res => {
|
||||
this.formPerm.permModuleId.impl.reloadDropdownData().catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
onDeleteModuleClick (row) {
|
||||
let params = {
|
||||
moduleId: row.moduleId
|
||||
};
|
||||
|
||||
this.$confirm('是否删除此模块？').then(res => {
|
||||
SystemController.deletePermGroup(this, params).then(res => {
|
||||
this.$message.success('删除成功');
|
||||
this.formPerm.permModuleId.impl.reloadDropdownData(true).catch(e => {});
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
onAddChildPermModuleClick (row) {
|
||||
let params = {
|
||||
parentId: row.moduleId,
|
||||
moduleType: this.SysPermModuleType.CONTROLLER,
|
||||
moduleList: this.formPerm.permModuleList
|
||||
};
|
||||
|
||||
this.$dialog.show('添加子模块', formEditSysPermModule, {
|
||||
area: ['600px']
|
||||
}, params).then(res => {
|
||||
this.formPerm.permModuleId.impl.reloadDropdownData(true).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
onModuleNodeCollapse (data, node) {
|
||||
let pos = this.formPerm.expandedModule.indexOf(data.moduleId);
|
||||
if (pos !== -1) {
|
||||
this.formPerm.expandedModule.splice(pos, 1);
|
||||
}
|
||||
},
|
||||
onModuleNodeExpand (data, node) {
|
||||
let pos = this.formPerm.expandedModule.indexOf(data.moduleId);
|
||||
if (pos === -1) {
|
||||
this.formPerm.expandedModule.push(data.moduleId);
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getModuleTreeData () {
|
||||
let tempList = [{
|
||||
moduleId: undefined,
|
||||
moduleName: '全部',
|
||||
moduleType: this.SysPermModuleType.CONTROLLER,
|
||||
isAll: true
|
||||
}];
|
||||
return tempList.concat(this.formPerm.permModuleId.impl.dropdownList);
|
||||
},
|
||||
...mapGetters(['getClientHeight'])
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
>>> .el-tree-node__content {
|
||||
height: 35px;
|
||||
}
|
||||
|
||||
>>> .el-tree-node__content .is-leaf {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.module-node-item {
|
||||
width: 100%;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
}
|
||||
|
||||
.module-node-menu {
|
||||
float: right;
|
||||
width: 56px;
|
||||
}
|
||||
|
||||
.module-node-menu.group {
|
||||
width: 84px;
|
||||
}
|
||||
|
||||
.module-node-text {
|
||||
width: 100%;
|
||||
margin-right: 56px;
|
||||
}
|
||||
|
||||
.module-node-text.group {
|
||||
margin-right: 84px;
|
||||
}
|
||||
|
||||
.el-tree-node__content .is-leaf + .module-node-item .module-node-text {
|
||||
padding-left: 24px;
|
||||
}
|
||||
|
||||
.module-node-text .text {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
</style>
|
||||
254
orange-demo-multi-web/src/views/upms/formSysPermCode/index.vue
Normal file
254
orange-demo-multi-web/src/views/upms/formSysPermCode/index.vue
Normal file
@@ -0,0 +1,254 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form label-width="100px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="权限字名称">
|
||||
<el-input class="filter-item" v-model="formPermCode.formFilter.showName"
|
||||
:clearable="true" placeholder="权限字名称" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" size="mini" :plain="true" @click="refreshFormPermCode(true)">
|
||||
查询
|
||||
</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSysPermCode:fragmentSysPermCode:add')"
|
||||
@click="onCreatePermCodeClick()">
|
||||
新建
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="getPermCodeList" size="mini" @sort-change="formPermCode.SysPermCode.impl.onSortChange"
|
||||
row-key="permCodeId" header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="权限字名称" prop="showName" width="250px">
|
||||
</el-table-column>
|
||||
<el-table-column label="权限字类型" prop="permCodeType" width="150px">
|
||||
<template slot-scope="scope">
|
||||
<el-tag size="mini" :type="getPermCodeType(scope.row.permCodeType)">{{SysPermCodeType.getValue(scope.row.permCodeType)}}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="显示顺序" prop="showOrder" width="100px">
|
||||
</el-table-column>
|
||||
<el-table-column label="权限字标识" prop="permCode" min-width="200px">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right" width="150px">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onEditPermCodeClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSysPermCode:fragmentSysPermCode:update')">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button @click="onAddChildPermCodeClick(scope.row)" type="text" size="mini"
|
||||
:disabled="scope.row.permCodeType === 2 || !checkPermCodeExist('formSysPermCode:fragmentSysPermCode:add')">
|
||||
添加
|
||||
</el-button>
|
||||
<el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSysPermCode:fragmentSysPermCode:delete')">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { treeDataTranslate } from '@/utils';
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { SystemController, DictionaryController } from '@/api';
|
||||
import formEditSysPermCode from '@/views/upms/formEditSysPermCode';
|
||||
|
||||
export default {
|
||||
name: 'formSysPermCode',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formPermCode: {
|
||||
formFilter: {
|
||||
showName: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
showName: undefined
|
||||
},
|
||||
SysPermCode: {
|
||||
impl: new TableWidget(this.loadSysPermCodeData, this.loadSysPermCodeVerify, false, 'showOrder', 1),
|
||||
totalCount: 0,
|
||||
sortInfo: {
|
||||
orderField: 'showOrder',
|
||||
asc: 1
|
||||
}
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getPermCodeType (permCodeType) {
|
||||
switch (permCodeType) {
|
||||
case this.SysPermCodeType.FORM: return 'primary';
|
||||
case this.SysPermCodeType.FRAGMENT: return 'warning';
|
||||
case this.SysPermCodeType.OPERATION: return 'success';
|
||||
default: return 'info';
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 权限资源数据获取函数，返回Primise
|
||||
*/
|
||||
loadSysPermCodeData (params) {
|
||||
return new Promise((resolve, reject) => {
|
||||
SystemController.getPermCodeList(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: treeDataTranslate(res.data, 'permCodeId'),
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 权限资源数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadSysPermCodeVerify () {
|
||||
this.formPermCode.formFilterCopy.showName = this.formPermCode.formFilter.showName;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 权限资源当前页变化函数
|
||||
*/
|
||||
onSysPermCodeCurrentPageChange (newPage) {
|
||||
this.formPermCode.SysPermCode.impl.onCurrentPageChange(newPage);
|
||||
},
|
||||
/**
|
||||
* 权限资源每页显示数量变化函数（跳转回第一页）
|
||||
*/
|
||||
onSysPermCodePageSizeChange (newPage) {
|
||||
this.formPermCode.SysPermCode.impl.onPageSizeChange(newPage);
|
||||
},
|
||||
/**
|
||||
* 权限资源列排序变化函数
|
||||
*/
|
||||
onSysPermCodeSortChange ({ column, prop, order }) {
|
||||
this.formPermCode.SysPermCode.sortInfo.orderField = prop;
|
||||
this.formPermCode.SysPermCode.sortInfo.asc = (order === 'ascending');
|
||||
this.formPermCode.SysPermCode.impl.refreshTable();
|
||||
},
|
||||
/**
|
||||
* 更新权限资源管理
|
||||
*/
|
||||
refreshFormPermCode (reloadData = false) {
|
||||
// 重新获取数据组件的数据
|
||||
if (reloadData) {
|
||||
this.formPermCode.SysPermCode.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formPermCode.SysPermCode.impl.refreshTable();
|
||||
}
|
||||
this.formPermCode.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 添加
|
||||
*/
|
||||
onCreatePermCodeClick () {
|
||||
let params = {
|
||||
permCodeTree: this.formPermCode.SysPermCode.impl.dataList
|
||||
};
|
||||
|
||||
this.$dialog.show('添加', formEditSysPermCode, {
|
||||
area: ['800px', '583px']
|
||||
}, params).then(res => {
|
||||
this.refreshFormPermCode();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 编辑
|
||||
*/
|
||||
onEditPermCodeClick (row) {
|
||||
SystemController.viewPermCode(this, {
|
||||
permCodeId: row.permCodeId
|
||||
}).then(res => {
|
||||
let params = {
|
||||
permCodeTree: this.formPermCode.SysPermCode.impl.dataList,
|
||||
permCodeType: row.permCodeType,
|
||||
rowData: res.data
|
||||
};
|
||||
return this.$dialog.show('编辑', formEditSysPermCode, {
|
||||
area: ['800px', '583px']
|
||||
}, params).then(res => {
|
||||
this.formPermCode.SysPermCode.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).then(res => {
|
||||
this.loadPermCodeData().catch(e => {});
|
||||
}).catch(e => {
|
||||
//
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 添加权限字
|
||||
*/
|
||||
onAddChildPermCodeClick (row) {
|
||||
let params = {
|
||||
permCodeTree: this.formPermCode.SysPermCode.impl.dataList,
|
||||
permCodeType: row.permCodeType + 1,
|
||||
rowData: {
|
||||
parentId: row.permCodeId
|
||||
}
|
||||
};
|
||||
|
||||
this.$dialog.show('添加权限字', formEditSysPermCode, {
|
||||
area: ['800px', '583px']
|
||||
}, params).then(res => {
|
||||
this.formPermCode.SysPermCode.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
onDeleteClick (row) {
|
||||
let params = {
|
||||
permCodeId: row.permCodeId
|
||||
};
|
||||
|
||||
this.$confirm('是否删除此权限字？').then(res => {
|
||||
SystemController.deletePermCode(this, params).then(res => {
|
||||
this.$message.success('删除成功');
|
||||
this.formPermCode.SysPermCode.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormPermCode();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.initFormData();
|
||||
this.refreshFormPermCode();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getPermCodeList () {
|
||||
try {
|
||||
if (Array.isArray(this.formPermCode.SysPermCode.impl.dataList)) {
|
||||
let temp = this.formPermCode.SysPermCode.impl.dataList.filter((item) => {
|
||||
if (this.formPermCode.formFilterCopy.showName == null || this.formPermCode.formFilterCopy.showName === '') return true;
|
||||
return (item.showName.indexOf(this.formPermCode.formFilterCopy.showName) !== -1);
|
||||
});
|
||||
return temp;
|
||||
}
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
return [];
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
455
orange-demo-multi-web/src/views/upms/formSysRole/index.vue
Normal file
455
orange-demo-multi-web/src/views/upms/formSysRole/index.vue
Normal file
@@ -0,0 +1,455 @@
|
||||
<template>
|
||||
<div class="tab-dialog-box" style="position: relative;">
|
||||
<el-tabs v-model="activeFragmentId" :before-leave="onFragmentChange">
|
||||
<el-tab-pane label="角色管理" name="fragmentSysRole" style="width: 100%;"
|
||||
v-if="checkPermCodeExist('formSysRole:fragmentSysRole')">
|
||||
<el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="角色名称">
|
||||
<el-input class="filter-item" v-model="fragmentSysRole.formFilter.sysRoleName"
|
||||
:clearable="true" placeholder="角色名称" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFragmentSysRole(true)">查询</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSysRole:fragmentSysRole:add')"
|
||||
@click="onAddSysRoleClick()">
|
||||
新建
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="fragmentSysRole.SysRole.impl.dataList" size="mini" :height="getTableHeight + 'px'"
|
||||
@sort-change="fragmentSysRole.SysRole.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="50px"
|
||||
:index="fragmentSysRole.SysRole.impl.getTableIndex" />
|
||||
<el-table-column label="角色名称" prop="roleName">
|
||||
</el-table-column>
|
||||
<el-table-column label="创建人" prop="createUsername">
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right" width="150px">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onEditSysRoleClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSysRole:fragmentSysRole:update')">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button @click="onDeleteClick(scope.row)" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSysRole:fragmentSysRole:delete')">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="fragmentSysRole.SysRole.impl.totalCount"
|
||||
:current-page="fragmentSysRole.SysRole.impl.currentPage"
|
||||
:page-size="fragmentSysRole.SysRole.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="fragmentSysRole.SysRole.impl.onCurrentPageChange"
|
||||
@size-change="fragmentSysRole.SysRole.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="用户授权" name="fragmentSysRoleUser" style="width: 100%;"
|
||||
v-if="checkPermCodeExist('formSysRole:fragmentSysRoleUser')">
|
||||
<el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="用户角色">
|
||||
<el-select class="filter-item" v-model="fragmentSysRoleUser.formFilter.sysRoleId" clearable
|
||||
placeholder="用户角色" :loading="fragmentSysRoleUser.sysRole.impl.loading"
|
||||
@visible-change="fragmentSysRoleUser.sysRole.impl.onVisibleChange"
|
||||
@change="onRoleChange">
|
||||
<el-option v-for="item in fragmentSysRoleUser.sysRole.impl.dropdownList" :key="item.roleId" :value="item.roleId" :label="item.roleName" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户名">
|
||||
<el-input class="filter-item" v-model="fragmentSysRoleUser.formFilter.sysUserLoginName"
|
||||
:clearable="true" placeholder="输入用户名 / 昵称查询" @change="refreshFragmentSysRoleUser(true)" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFragmentSysRoleUser(true)">
|
||||
查询
|
||||
</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" @click="onAddRow()"
|
||||
:disabled="!checkPermCodeExist('formSysRole:fragmentSysRoleUser:addUserRole') ||
|
||||
fragmentSysRoleUser.formFilter.sysRoleId == null || fragmentSysRoleUser.formFilter.sysRoleId === ''">
|
||||
添加用户
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="fragmentSysRoleUser.SysUser.impl.dataList" size="mini" :height="getTableHeight + 'px'"
|
||||
@sort-change="fragmentSysRoleUser.SysUser.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="fragmentSysRoleUser.SysUser.impl.getTableIndex" />
|
||||
<el-table-column label="用户名" prop="loginName">
|
||||
</el-table-column>
|
||||
<el-table-column label="昵称" prop="showName">
|
||||
</el-table-column>
|
||||
<el-table-column label="账号类型">
|
||||
<template slot-scope="scope">
|
||||
<span>{{SysUserType.getValue(scope.row.userType)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :type="getUserStatusType(scope.row.userStatus)" size="mini">{{SysUserStatus.getValue(scope.row.userStatus)}}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right" width="80px">
|
||||
<template slot-scope="scope">
|
||||
<el-button class="btn-table-delete" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('formSysRole:fragmentSysRoleUser:deleteUserRole')"
|
||||
@click="onDeleteRow(scope.row)">移除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="fragmentSysRoleUser.SysUser.impl.totalCount"
|
||||
:current-page="fragmentSysRoleUser.SysUser.impl.currentPage"
|
||||
:page-size="fragmentSysRoleUser.SysUser.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="fragmentSysRoleUser.SysUser.impl.onCurrentPageChange"
|
||||
@size-change="fragmentSysRoleUser.SysUser.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { SystemController, DictionaryController } from '@/api';
|
||||
import formEditSysRole from '../formEditSysRole';
|
||||
import formSetRoleUsers from '@/views/upms/formSetRoleUsers';
|
||||
|
||||
export default {
|
||||
name: 'formSysRole',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
activeFragmentId: undefined,
|
||||
fragmentSysRole: {
|
||||
formFilter: {
|
||||
sysRoleName: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
sysRoleName: undefined
|
||||
},
|
||||
SysRole: {
|
||||
impl: new TableWidget(this.loadSysRoleData, this.loadSysRoleVerify, true, 'createTime', 1)
|
||||
},
|
||||
isInit: false
|
||||
},
|
||||
fragmentSysRoleUser: {
|
||||
formFilter: {
|
||||
sysRoleId: undefined,
|
||||
sysUserLoginName: undefined
|
||||
},
|
||||
sysRole: {
|
||||
impl: new DropdownWidget(this.loadSysRoleDropdownList)
|
||||
},
|
||||
SysUser: {
|
||||
impl: new TableWidget(this.loadSysUserData, this.loadSysUserVerify, true, 'createTime', 1)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 用户角色数据获取函数，返回Primise
|
||||
*/
|
||||
loadSysRoleData (params) {
|
||||
params.sysRoleFilter = {
|
||||
roleName: this.fragmentSysRole.formFilterCopy.sysRoleName
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
SystemController.getRoleList(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 用户角色数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadSysRoleVerify () {
|
||||
this.fragmentSysRole.formFilterCopy.sysRoleName = this.fragmentSysRole.formFilter.sysRoleName;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 更新角色列表
|
||||
*/
|
||||
refreshFragmentSysRole (reloadData = false) {
|
||||
// 重新获取数据组件的数据
|
||||
if (reloadData) {
|
||||
this.fragmentSysRole.SysRole.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.fragmentSysRole.SysRole.impl.refreshTable();
|
||||
}
|
||||
this.fragmentSysRole.isInit = true;
|
||||
},
|
||||
/**
|
||||
* 新建
|
||||
*/
|
||||
onAddSysRoleClick () {
|
||||
let params = {};
|
||||
|
||||
this.$dialog.show('新建', formEditSysRole, {
|
||||
area: ['800px', '500px'],
|
||||
offset: '100px'
|
||||
}, params).then(res => {
|
||||
this.refreshFragmentSysRole();
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 编辑
|
||||
*/
|
||||
onEditSysRoleClick (row) {
|
||||
this.loadRowData(row).then(rowData => {
|
||||
return this.$dialog.show('编辑角色', formEditSysRole, {
|
||||
area: ['600px', '500px']
|
||||
}, {
|
||||
rowData
|
||||
});
|
||||
}).then(res => {
|
||||
this.fragmentSysRole.SysRole.impl.refreshTable();
|
||||
}).catch((e) => {});
|
||||
},
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
onDeleteClick (row) {
|
||||
let params = {
|
||||
roleId: row.roleId
|
||||
};
|
||||
|
||||
this.$confirm('是否删除此角色？').then(res => {
|
||||
SystemController.deleteRole(this, params).then(res => {
|
||||
this.$message.success('删除成功');
|
||||
this.fragmentSysRole.SysRole.impl.refreshTable();
|
||||
}).catch(e => {});
|
||||
}).catch(e => {});
|
||||
},
|
||||
loadRowData (row) {
|
||||
return new Promise((resolve, reject) => {
|
||||
var params = {
|
||||
roleId: row.roleId
|
||||
}
|
||||
SystemController.getRole(this, params).then(res => {
|
||||
if (typeof res.data.permsJsonData === 'string') {
|
||||
res.data.permsJsonData = JSON.parse(res.data.permsJsonData);
|
||||
}
|
||||
resolve(res.data);
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
buildFragmentPermCodeMap () {
|
||||
this.permCodeList = [
|
||||
{
|
||||
key: 'fragmentSysRole',
|
||||
permCode: 'formSysRole:fragmentSysRole',
|
||||
refresh: this.refreshFragmentSysRole
|
||||
},
|
||||
{
|
||||
key: 'fragmentSysRoleUser',
|
||||
permCode: 'formSysRole:fragmentSysRoleUser',
|
||||
refresh: this.refreshFragmentSysRoleUser
|
||||
}
|
||||
];
|
||||
},
|
||||
onFragmentChange (fragmentId) {
|
||||
for (let i = 0; i < this.permCodeList.length; i++) {
|
||||
if (this.permCodeList[i].key === fragmentId) {
|
||||
this.activeFragmentId = fragmentId;
|
||||
// if (this.permCodeList[i].refresh) this.permCodeList[i].refresh();
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
},
|
||||
getActiveFragment () {
|
||||
for (let i = 0; i < this.permCodeList.length; i++) {
|
||||
if (this.permCodeList[i].key === this.activeFragmentId) {
|
||||
return this.permCodeList[i];
|
||||
}
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 根据权限获取默认显示的fragment
|
||||
*/
|
||||
getDefaultFragment () {
|
||||
for (let i = 0; i < this.permCodeList.length; i++) {
|
||||
if (this.checkPermCodeExist(this.permCodeList[i].permCode)) {
|
||||
this.activeFragmentId = this.permCodeList[i].key;
|
||||
return this.permCodeList[i];
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
},
|
||||
onRoleChange (value) {
|
||||
this.refreshFragmentSysRoleUser(true);
|
||||
},
|
||||
getUserStatusType (status) {
|
||||
if (status === this.SysUserStatus.NORMAL) {
|
||||
return 'success';
|
||||
} else if (status === this.SysUserStatus.LOCKED) {
|
||||
return 'danger';
|
||||
} else {
|
||||
return 'info';
|
||||
}
|
||||
},
|
||||
onAddRow () {
|
||||
if (this.fragmentSysRoleUser.formFilter.sysRoleId == null || this.fragmentSysRoleUser.formFilter.sysRoleId === '') {
|
||||
this.$message.error('请选择角色');
|
||||
return false;
|
||||
}
|
||||
this.$dialog.show('角色用户授权', formSetRoleUsers, {
|
||||
area: ['1100px', '600px']
|
||||
}, {
|
||||
roleId: this.fragmentSysRoleUser.formFilter.sysRoleId
|
||||
}).catch(e => {
|
||||
this.refreshFragmentSysRoleUser(true);
|
||||
});
|
||||
},
|
||||
onDeleteRow (row) {
|
||||
this.$confirm('是否移除此用户?').then(res => {
|
||||
let params = {
|
||||
roleId: this.fragmentSysRoleUser.formFilter.sysRoleId,
|
||||
userId: row.userId
|
||||
}
|
||||
return SystemController.deleteRoleUser(this, params);
|
||||
}).then(res => {
|
||||
this.$message.success('移除成功');
|
||||
this.refreshFragmentSysRoleUser(true);
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 用户管理数据获取函数，返回Primise
|
||||
*/
|
||||
loadSysUserData (params) {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (this.fragmentSysRoleUser.formFilter.sysRoleId == null || this.fragmentSysRoleUser.formFilter.sysRoleId === '') {
|
||||
this.$message.error('请选择角色');
|
||||
resolve({
|
||||
dataList: [],
|
||||
totalCount: 0
|
||||
});
|
||||
return;
|
||||
}
|
||||
params.roleId = this.fragmentSysRoleUser.formFilter.sysRoleId;
|
||||
params.sysUserFilter = {
|
||||
loginName: this.fragmentSysRoleUser.formFilter.sysUserLoginName
|
||||
}
|
||||
SystemController.listRoleUser(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 用户管理数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadSysUserVerify () {
|
||||
if (this.fragmentSysRoleUser.formFilter.sysRoleId == null || this.fragmentSysRoleUser.formFilter.sysRoleId === '') {
|
||||
this.$message.error('请选择角色');
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 角色下拉数据获取函数
|
||||
*/
|
||||
loadSysRoleDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
SystemController.getRoleList(this, params).then(res => {
|
||||
resolve(res.data.dataList);
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
onRuleChange (value) {
|
||||
this.refreshFragmentSysRoleUser(true);
|
||||
},
|
||||
/**
|
||||
* 更新用户管理
|
||||
*/
|
||||
refreshFragmentSysRoleUser (reloadData = false) {
|
||||
// 重新获取数据组件的数据
|
||||
if (reloadData) {
|
||||
this.fragmentSysRoleUser.SysUser.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.fragmentSysRoleUser.SysUser.impl.refreshTable();
|
||||
}
|
||||
this.fragmentSysRoleUser.sysRole.impl.onVisibleChange(true).catch(e => {});
|
||||
this.fragmentSysRoleUser.isInit = true;
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFragmentSysRole();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.buildFragmentPermCodeMap();
|
||||
let defaultFragment = this.getDefaultFragment();
|
||||
if (defaultFragment == null) {
|
||||
this.$message.error('您没有访问这个页面的权限，请与系统管理员联系！');
|
||||
} else {
|
||||
if (defaultFragment.refresh) defaultFragment.refresh();
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getTableHeight () {
|
||||
return (this.getMainContextHeight - 192);
|
||||
},
|
||||
...mapGetters(['getMainContextHeight'])
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
224
orange-demo-multi-web/src/views/upms/formSysRoleUser/index.vue
Normal file
224
orange-demo-multi-web/src/views/upms/formSysRoleUser/index.vue
Normal file
@@ -0,0 +1,224 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="用户角色">
|
||||
<el-select class="filter-item" v-model="formSysUser.formFilter.sysRoleId" clearable
|
||||
placeholder="用户角色" :loading="formSysUser.sysRole.impl.loading"
|
||||
@visible-change="formSysUser.sysRole.impl.onVisibleChange"
|
||||
@change="onRoleChange">
|
||||
<el-option v-for="item in formSysUser.sysRole.impl.dropdownList" :key="item.roleId" :value="item.roleId" :label="item.roleName" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户名">
|
||||
<el-input class="filter-item" v-model="formSysUser.formFilter.sysUserLoginName"
|
||||
:clearable="true" placeholder="输入用户名 / 昵称查询" @change="refreshFormSysUser(true)" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormSysUser(true)">
|
||||
查询
|
||||
</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" @click="onAddRow()"
|
||||
:disabled="!checkPermCodeExist('sysRoleUserManagement:addUserRole') || formSysUser.formFilter.sysRoleId == null || formSysUser.formFilter.sysRoleId === ''">
|
||||
添加人员
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formSysUser.SysUser.impl.dataList" size="mini" @sort-change="formSysUser.SysUser.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="formSysUser.SysUser.impl.getTableIndex" />
|
||||
<el-table-column label="用户名" prop="loginName">
|
||||
</el-table-column>
|
||||
<el-table-column label="昵称" prop="showName">
|
||||
</el-table-column>
|
||||
<el-table-column label="账号类型">
|
||||
<template slot-scope="scope">
|
||||
<span>{{SysUserType.getValue(scope.row.userType)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :type="getUserStatusType(scope.row.userStatus)" size="mini">{{SysUserStatus.getValue(scope.row.userStatus)}}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right" width="80px">
|
||||
<template slot-scope="scope">
|
||||
<el-button class="btn-table-delete" type="text" size="mini"
|
||||
:disabled="!checkPermCodeExist('sysRoleUserManagement:deleteUserRole')" @click="onDeleteRow(scope.row)">移除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formSysUser.SysUser.impl.totalCount"
|
||||
:current-page="formSysUser.SysUser.impl.currentPage"
|
||||
:page-size="formSysUser.SysUser.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formSysUser.SysUser.impl.onCurrentPageChange"
|
||||
@size-change="formSysUser.SysUser.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { SystemController, DictionaryController } from '@/api';
|
||||
import formSetRoleUsers from '@/views/upms/formSetRoleUsers';
|
||||
|
||||
export default {
|
||||
name: 'sysRoleUserManagement',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formSysUser: {
|
||||
formFilter: {
|
||||
sysRoleId: undefined,
|
||||
sysUserLoginName: undefined
|
||||
},
|
||||
sysRole: {
|
||||
impl: new DropdownWidget(this.loadSysRoleDropdownList)
|
||||
},
|
||||
SysUser: {
|
||||
impl: new TableWidget(this.loadSysUserData, this.loadSysUserVerify, true, 'createTime', 1)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onRoleChange (value) {
|
||||
this.refreshFormSysUser(true);
|
||||
},
|
||||
getUserStatusType (status) {
|
||||
if (status === this.SysUserStatus.NORMAL) {
|
||||
return 'success';
|
||||
} else if (status === this.SysUserStatus.LOCKED) {
|
||||
return 'danger';
|
||||
} else {
|
||||
return 'info';
|
||||
}
|
||||
},
|
||||
onAddRow () {
|
||||
if (this.formSysUser.formFilter.sysRoleId == null || this.formSysUser.formFilter.sysRoleId === '') {
|
||||
this.$message.error('请选择角色');
|
||||
return false;
|
||||
}
|
||||
this.$dialog.show('角色用户授权', formSetRoleUsers, {
|
||||
area: '1100px',
|
||||
offset: '50px'
|
||||
}, {
|
||||
roleId: this.formSysUser.formFilter.sysRoleId
|
||||
}).catch(e => {
|
||||
this.refreshFormSysUser(true);
|
||||
});
|
||||
},
|
||||
onDeleteRow (row) {
|
||||
this.$confirm('是否移除此用户?').then(res => {
|
||||
let params = {
|
||||
roleId: this.formSysUser.formFilter.sysRoleId,
|
||||
userId: row.userId
|
||||
}
|
||||
return SystemController.deleteRoleUser(this, params);
|
||||
}).then(res => {
|
||||
this.$message.success('移除成功');
|
||||
this.refreshFormSysUser(true);
|
||||
}).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 用户列表数据获取函数，返回Primise
|
||||
*/
|
||||
loadSysUserData (params) {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (this.formSysUser.formFilter.sysRoleId == null || this.formSysUser.formFilter.sysRoleId === '') {
|
||||
this.$message.error('请选择角色');
|
||||
resolve({
|
||||
dataList: [],
|
||||
totalCount: 0
|
||||
});
|
||||
return;
|
||||
}
|
||||
params.roleId = this.formSysUser.formFilter.sysRoleId;
|
||||
params.sysUserFilter = {
|
||||
loginName: this.formSysUser.formFilter.sysUserLoginName
|
||||
}
|
||||
SystemController.listRoleUser(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 用户列表数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadSysUserVerify () {
|
||||
if (this.formSysUser.formFilter.sysRoleId == null || this.formSysUser.formFilter.sysRoleId === '') {
|
||||
this.$message.error('请选择角色');
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 角色下拉数据获取函数
|
||||
*/
|
||||
loadSysRoleDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
SystemController.getRoleList(this, params).then(res => {
|
||||
resolve(res.data.dataList);
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
onRuleChange (value) {
|
||||
this.refreshFormSysUser(true);
|
||||
},
|
||||
/**
|
||||
* 更新用户列表
|
||||
*/
|
||||
refreshFormSysUser (reloadData = false) {
|
||||
// 重新获取数据组件的数据
|
||||
if (reloadData) {
|
||||
this.formSysUser.SysUser.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formSysUser.SysUser.impl.refreshTable();
|
||||
}
|
||||
this.formSysUser.sysRole.impl.onVisibleChange(true).catch(e => {});
|
||||
this.formSysUser.isInit = true;
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormSysUser();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.initFormData();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
253
orange-demo-multi-web/src/views/upms/formSysUser/index.vue
Normal file
253
orange-demo-multi-web/src/views/upms/formSysUser/index.vue
Normal file
@@ -0,0 +1,253 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form label-width="75px" size="mini" label-position="right" @submit.native.prevent>
|
||||
<filter-box :item-width="350">
|
||||
<el-form-item label="用户状态">
|
||||
<el-select class="filter-item" v-model="formSysUser.formFilter.sysUserStatus" :clearable="true"
|
||||
placeholder="用户状态" :loading="formSysUser.sysUserStatus.impl.loading"
|
||||
@visible-change="formSysUser.sysUserStatus.impl.onVisibleChange"
|
||||
@change="onSysUserStatusValueChange">
|
||||
<el-option v-for="item in formSysUser.sysUserStatus.impl.dropdownList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="登录名称">
|
||||
<el-input class="filter-item" v-model="formSysUser.formFilter.sysUserLoginName"
|
||||
:clearable="true" placeholder="登录名称" />
|
||||
</el-form-item>
|
||||
<el-button slot="operator" type="primary" :plain="true" size="mini" @click="refreshFormSysUser(true)">查询</el-button>
|
||||
<el-button slot="operator" type="primary" size="mini" :disabled="!checkPermCodeExist('formSysUser:fragmentSysUser:add')"
|
||||
@click="onAddRow()">
|
||||
新建
|
||||
</el-button>
|
||||
</filter-box>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-table :data="formSysUser.SysUser.impl.dataList" size="mini" @sort-change="formSysUser.SysUser.impl.onSortChange"
|
||||
header-cell-class-name="table-header-gray">
|
||||
<el-table-column label="序号" header-align="center" align="center" type="index" width="50px" :index="formSysUser.SysUser.impl.getTableIndex" />
|
||||
<el-table-column label="用户名" prop="loginName" sortable="custom">
|
||||
</el-table-column>
|
||||
<el-table-column label="昵称" prop="showName">
|
||||
</el-table-column>
|
||||
<el-table-column label="账号类型" prop="userTypeDictMap.name" />
|
||||
<el-table-column label="状态">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :type="getUserStatusType(scope.row.userStatus)" size="mini">{{SysUserStatus.getValue(scope.row.userStatus)}}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间">
|
||||
<template slot-scope="scope">
|
||||
<span>{{formatDateByStatsType(scope.row.createTime, 'day')}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" fixed="right" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-button class="btn-table-edit" type="text" size="mini" @click="onEditRow(scope.row)" :disabled="isAdmin(scope.row) || !checkPermCodeExist('formSysUser:fragmentSysUser:update')" >编辑</el-button>
|
||||
<el-button class="btn-table-delete" type="text" size="mini" @click="onDeleteRow(scope.row)" :disabled="isAdmin(scope.row) || !checkPermCodeExist('formSysUser:fragmentSysUser:delete')">删除</el-button>
|
||||
<el-button class="btn-table-delete" type="text" size="mini" :disabled="!checkPermCodeExist('formSysUser:fragmentSysUser:resetPassword')" @click="onResetPassword(scope.row)">重置密码</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-col :span="24">
|
||||
<el-row type="flex" justify="end" style="margin-top: 10px;">
|
||||
<el-pagination
|
||||
:total="formSysUser.SysUser.impl.totalCount"
|
||||
:current-page="formSysUser.SysUser.impl.currentPage"
|
||||
:page-size="formSysUser.SysUser.impl.pageSize"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
layout="total, prev, pager, next, sizes"
|
||||
@current-change="formSysUser.SysUser.impl.onCurrentPageChange"
|
||||
@size-change="formSysUser.SysUser.impl.onPageSizeChange">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/* eslint-disable-next-line */
|
||||
import { DropdownWidget, TableWidget, UploadWidget, ChartWidget } from '@/utils/widget.js';
|
||||
/* eslint-disable-next-line */
|
||||
import { uploadMixin, statsDateRangeMixin, cachePageMixin, cachedPageChildMixin } from '@/core/mixins';
|
||||
/* eslint-disable-next-line */
|
||||
import { SystemController, DictionaryController } from '@/api';
|
||||
import editUser from '@/views/upms/formEditSysUser';
|
||||
|
||||
export default {
|
||||
name: 'formSysUser',
|
||||
props: {
|
||||
},
|
||||
mixins: [uploadMixin, statsDateRangeMixin, cachePageMixin],
|
||||
data () {
|
||||
return {
|
||||
formSysUser: {
|
||||
formFilter: {
|
||||
sysUserStatus: undefined,
|
||||
sysUserLoginName: undefined
|
||||
},
|
||||
formFilterCopy: {
|
||||
sysUserStatus: undefined,
|
||||
sysUserLoginName: undefined
|
||||
},
|
||||
sysUserStatus: {
|
||||
impl: new DropdownWidget(this.loadSysUserStatusDropdownList)
|
||||
},
|
||||
SysUser: {
|
||||
impl: new TableWidget(this.loadSysUserData, this.loadSysUserVerify, true, 'createTime', 1)
|
||||
},
|
||||
isInit: false
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
isAdmin (row) {
|
||||
return (row.userType === this.SysUserType.ADMIN);
|
||||
},
|
||||
getUserStatusType (status) {
|
||||
if (status === this.SysUserStatus.NORMAL) {
|
||||
return 'success';
|
||||
} else if (status === this.SysUserStatus.LOCKED) {
|
||||
return 'danger';
|
||||
} else {
|
||||
return 'info';
|
||||
}
|
||||
},
|
||||
onAddRow () {
|
||||
this.$dialog.show('新建用户', editUser, {
|
||||
area: '600px'
|
||||
}).then((res) => {
|
||||
this.refreshFormSysUser();
|
||||
}).catch(() => {
|
||||
});
|
||||
},
|
||||
onEditRow (row) {
|
||||
this.loadRowData(row).then(rowData => {
|
||||
this.$dialog.show('编辑用户', editUser, {
|
||||
area: '600px'
|
||||
}, {
|
||||
rowData: rowData
|
||||
}).then((res) => {
|
||||
this.refreshFormSysUser();
|
||||
}).catch(e => {
|
||||
});
|
||||
}).catch(e => {
|
||||
//
|
||||
});
|
||||
},
|
||||
onDeleteRow (row) {
|
||||
let params = {
|
||||
userId: row.userId
|
||||
}
|
||||
this.$confirm('是否删除用户？').then(res => {
|
||||
return SystemController.deleteUser(this, params);
|
||||
}).then(res => {
|
||||
this.$message.success('删除成功');
|
||||
this.refreshFormSysUser(true);
|
||||
}).catch(e => {
|
||||
//
|
||||
});
|
||||
},
|
||||
onResetPassword (row) {
|
||||
this.$confirm('是否重置用户密码？').then(res => {
|
||||
return SystemController.resetUserPassword(this, {userId: row.userId});
|
||||
}).then(res => {
|
||||
this.$message.success('重置密码成功');
|
||||
}).catch(e => {
|
||||
//
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 用户管理数据获取函数，返回Primise
|
||||
*/
|
||||
loadSysUserData (params) {
|
||||
params.sysUserFilter = {
|
||||
loginName: this.formSysUser.formFilterCopy.sysUserLoginName,
|
||||
userStatus: this.formSysUser.formFilterCopy.sysUserStatus
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
SystemController.getUserList(this, params).then(res => {
|
||||
resolve({
|
||||
dataList: res.data.dataList,
|
||||
totalCount: res.data.totalCount
|
||||
});
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 用户管理数据获取检测函数，返回true正常获取数据，返回false停止获取数据
|
||||
*/
|
||||
loadSysUserVerify () {
|
||||
this.formSysUser.formFilterCopy.sysUserLoginName = this.formSysUser.formFilter.sysUserLoginName;
|
||||
this.formSysUser.formFilterCopy.sysUserStatus = this.formSysUser.formFilter.sysUserStatus;
|
||||
return true;
|
||||
},
|
||||
/**
|
||||
* 用户状态下拉数据获取函数
|
||||
*/
|
||||
loadSysUserStatusDropdownList () {
|
||||
return new Promise((resolve, reject) => {
|
||||
let params = {};
|
||||
DictionaryController.dictSysUserStatus(this, params).then(res => {
|
||||
resolve(res.getList());
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 用户状态下拉框显隐
|
||||
*/
|
||||
onSysUserStatusVisibleChange (show) {
|
||||
this.formSysUser.sysUserStatus.impl.onVisibleChange(show).catch(e => {});
|
||||
},
|
||||
/**
|
||||
* 用户状态选中值改变
|
||||
*/
|
||||
onSysUserStatusValueChange (value) {
|
||||
},
|
||||
/**
|
||||
* 更新用户管理
|
||||
*/
|
||||
refreshFormSysUser (reloadData = false) {
|
||||
// 重新获取数据组件的数据
|
||||
if (reloadData) {
|
||||
this.formSysUser.SysUser.impl.refreshTable(true, 1);
|
||||
} else {
|
||||
this.formSysUser.SysUser.impl.refreshTable();
|
||||
}
|
||||
this.formSysUser.sysUserStatus.impl.onVisibleChange(true).catch(e => {});
|
||||
this.formSysUser.isInit = true;
|
||||
},
|
||||
loadRowData (row) {
|
||||
return new Promise((resolve, reject) => {
|
||||
var params = {
|
||||
userId: row.userId
|
||||
}
|
||||
|
||||
SystemController.getUser(this, params).then(res => {
|
||||
resolve(res.data);
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
},
|
||||
onResume () {
|
||||
this.refreshFormSysUser();
|
||||
},
|
||||
initFormData () {
|
||||
},
|
||||
formInit () {
|
||||
this.initFormData();
|
||||
this.refreshFormSysUser();
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.formInit();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
156
orange-demo-multi-web/src/views/welcome/index.vue
Normal file
156
orange-demo-multi-web/src/views/welcome/index.vue
Normal file
@@ -0,0 +1,156 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="title">
|
||||
<p>浏览完每个功能过后，自然会发现些与众不同。然而这一切都是<span> 橙单 </span>生成的。</p>
|
||||
</div>
|
||||
<el-row type="flex">
|
||||
<div style="width: 100%;">
|
||||
<el-card class="box-card" shadow="never" :body-style="{padding: '0px 20px'}">
|
||||
<el-collapse v-model="currentItem">
|
||||
<el-collapse-item title="选择我们的 5 个理由" name="1">
|
||||
<ul class="item-list">
|
||||
<li>是真正的生成器，而非脚手架。</li>
|
||||
<li>技术选型、包名、作者署名都由您钦定。</li>
|
||||
<li>手把手教的操作指南和教学视频。</li>
|
||||
<li>详尽、完善、免费、护眼的开发文档。</li>
|
||||
<li>合理、超低价的商业授权。</li>
|
||||
</ul>
|
||||
</el-collapse-item>
|
||||
<el-collapse-item title="我们的技术选型" name="2">
|
||||
<ul class="item-list">
|
||||
<li>Element (Vue) / Ant Design (React) / ECharts / AntV / Axios / Webpack</li>
|
||||
<li>Spring Boot / Spring Cloud / Spring Cloud Alibaba + Mybatis + Jwt</li>
|
||||
<li>Hutool + Guava + Caffeine + Lombok + MapStruct + 通用 mapper</li>
|
||||
<li>Redis + ZooKeeper + Consul + Apollo + XXL-Job + Kafka + Seata</li>
|
||||
<li>ELK + PinPoint / SkyWalking + Grafana + Prometheus</li>
|
||||
</ul>
|
||||
</el-collapse-item>
|
||||
<el-collapse-item title="可快速上手的高质量代码" name="3">
|
||||
<ul class="item-list">
|
||||
<li>无任何二次封装，只生成您最懂的代码。</li>
|
||||
<li>遵循阿里巴巴标准的代码规范。</li>
|
||||
<li>主流技术栈恣意组合，对面试大有裨益。</li>
|
||||
<li>产品级代码强度，层次清晰、滴水不漏。</li>
|
||||
<li>15年架构师优化的每一处细节。</li>
|
||||
</ul>
|
||||
</el-collapse-item>
|
||||
<el-collapse-item title="设计理念和未来目标" name="4">
|
||||
<ul class="item-list">
|
||||
<li>前沿的单表组合式设计，使系统拆分SO EASY。</li>
|
||||
<li>先代码，后SQL的原则，让服务扩充更具弹性。</li>
|
||||
<li>全面、实用的日志跟踪和服务监控体系。</li>
|
||||
<li>未来将演化为云原生架构，支持更多开发语言。</li>
|
||||
<li>不会让数据中台成为我们的空白。</li>
|
||||
</ul>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-card>
|
||||
</div>
|
||||
<el-card class="box-card" style="min-width: 450px; margin-left: 20px;" shadow="never" :body-style="{padding: '0px 20px'}">
|
||||
<div class="item">
|
||||
<span style="width: 120px;">产品名称</span>
|
||||
<el-tag effect="dark">橙单代码生成器</el-tag>
|
||||
</div>
|
||||
<el-divider></el-divider>
|
||||
<div class="item">
|
||||
<span style="width: 120px;">网站首页</span>
|
||||
<a href="http://101.200.178.51/" target="_blank">http://101.200.178.51/</a>
|
||||
</div>
|
||||
<el-divider></el-divider>
|
||||
<div class="item">
|
||||
<span style="width: 120px;">教学视频</span>
|
||||
<a href="https://www.bilibili.com/video/BV1Wg4y1i7vP" target="_blank">https://www.bilibili.com/video/BV1Wg4y1i7vP</a>
|
||||
</div>
|
||||
<el-divider></el-divider>
|
||||
<div class="item">
|
||||
<span style="width: 120px;">操作指南</span>
|
||||
<a href="http://101.200.178.51/orange-doc/" target="_blank">http://101.200.178.51/orange-doc/</a>
|
||||
</div>
|
||||
<el-divider></el-divider>
|
||||
<div class="item">
|
||||
<span style="width: 120px;">开发文档</span>
|
||||
<a href="http://101.200.178.51/development-doc/" target="_blank">http://101.200.178.51/development-doc/</a>
|
||||
</div>
|
||||
<el-divider></el-divider>
|
||||
<div class="item">
|
||||
<span style="width: 120px;">开源代码</span>
|
||||
<a href="https://gitee.com/orangeform/orange-admin" target="_blank">https://gitee.com/orangeform/orange-admin</a>
|
||||
</div>
|
||||
<el-divider></el-divider>
|
||||
<div class="item">
|
||||
<span style="width: 120px;">联系方式</span>
|
||||
<span>
|
||||
QQ群
|
||||
<a target="_blank" style="margin-left: 5px;"
|
||||
href="//shang.qq.com/wpa/qunwpa?idkey=590857a1b4c587e2be3d66b9a7e2015109772e777c6451c897dee393489b1661">
|
||||
788581363
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<el-divider></el-divider>
|
||||
<div style="width: 100%; text-align: center; padding: 10px;">
|
||||
<img src="../../assets/img/orange-group1.png" />
|
||||
</div>
|
||||
</el-card>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
currentItem: ['1', '2', '3', '4']
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
>>> .el-collapse {
|
||||
border: none;
|
||||
}
|
||||
|
||||
>>> .el-divider--horizontal {
|
||||
margin: 0px;
|
||||
}
|
||||
>>> .el-tag {
|
||||
padding: 0px 30px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import '../../assets/style/element-color.scss';
|
||||
.title {
|
||||
border: 1px solid #EDEDED;
|
||||
border-left-width: 5px;
|
||||
border-left-color: $--color-primary;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.title p {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
font-size: 16px;
|
||||
margin: 0px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.title p span {
|
||||
font-size: 20px;
|
||||
color: $--color-primary;
|
||||
}
|
||||
|
||||
.item-list {
|
||||
margin: 0px;
|
||||
}
|
||||
.item-list li {
|
||||
margin: 10px 0px;
|
||||
}
|
||||
|
||||
.item {
|
||||
height: 48px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user