dongjunchuan/de
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'main' of https://github.com/dataease/dataease into main

Browse Source
This commit is contained in:
TaoJinlong 2021-03-15 17:44:32 +08:00
commit bacabf8422
17 changed files with 439 additions and 172 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
backend/src/main/java/io/dataease/controller/sys/SysDeptController.java
View File

@ -8,6 +8,7 @@ import io.dataease.controller.sys.request.DeptCreateRequest;
import io.dataease.controller.sys.request.DeptDeleteRequest;
import io.dataease.controller.sys.request.DeptStatusRequest;
import io.dataease.controller.sys.response.DeptNodeResponse;
import io.dataease.controller.sys.response.DeptTreeNode;
import io.dataease.service.sys.DeptService;
import io.swagger.annotations.Api;
import io.swagger.annotations.ApiOperation;
@ -82,4 +83,9 @@ public class SysDeptController extends ResultHolder {
deptService.updateStatus(request);
}
@PostMapping("/nodesByDeptId/{deptId}")
public List<DeptTreeNode> nodesByDeptId(@PathVariable("deptId") Long deptId){
return deptService.searchTree(deptId);
}
}

27
backend/src/main/java/io/dataease/controller/sys/response/DeptTreeNode.java Normal file
View File

@ -0,0 +1,27 @@
package io.dataease.controller.sys.response;
import com.fasterxml.jackson.annotation.JsonInclude;
import lombok.Data;
import java.io.Serializable;
import java.util.ArrayList;
import java.util.List;
@Data
@JsonInclude(JsonInclude.Include.NON_NULL)
public class DeptTreeNode implements Serializable {
private Long id;
private String label;
private Boolean hasChildren;
private List<DeptTreeNode> children;
public List<DeptTreeNode> toList(){
List<DeptTreeNode> lists = new ArrayList<>();
lists.add(this);
return lists;
}
}

3
backend/src/main/java/io/dataease/datasource/provider/DatasourceProvider.java
View File

@ -1,5 +1,6 @@
package io.dataease.datasource.provider;
import io.dataease.base.domain.DatasetTableField;
import io.dataease.base.domain.Datasource;
import io.dataease.datasource.dto.TableFiled;
import io.dataease.datasource.request.DatasourceRequest;
@ -32,6 +33,6 @@ public abstract class DatasourceProvider {
abstract public List<String[]> fetchResult(ResultSet rs) throws Exception;
abstract public List<String> fetchResultField(ResultSet rs) throws Exception;
abstract public List<TableFiled> fetchResultField(ResultSet rs) throws Exception;
}

14
backend/src/main/java/io/dataease/datasource/provider/JdbcProvider.java
View File

@ -1,6 +1,7 @@
package io.dataease.datasource.provider;
import com.google.gson.Gson;
import io.dataease.base.domain.DatasetTableField;
import io.dataease.datasource.constants.DatasourceTypes;
import io.dataease.datasource.dto.MysqlConfigrationDTO;
import io.dataease.datasource.dto.SqlServerConfigration;
@ -90,12 +91,19 @@ public class JdbcProvider extends DatasourceProvider {
}
@Override
public List<String> fetchResultField(ResultSet rs) throws Exception {
List<String> fieldList = new ArrayList<>();
public List<TableFiled> fetchResultField(ResultSet rs) throws Exception {
List<TableFiled> fieldList = new ArrayList<>();
ResultSetMetaData metaData = rs.getMetaData();
int columnCount = metaData.getColumnCount();
for (int j = 0; j < columnCount; j++) {
fieldList.add(metaData.getColumnName(j + 1));
String f = metaData.getColumnName(j + 1);
String l = StringUtils.isNotEmpty(metaData.getColumnLabel(j + 1)) ? metaData.getColumnLabel(j + 1) : f;
String t = metaData.getColumnTypeName(j + 1);
TableFiled field = new TableFiled();
field.setFieldName(l);
field.setRemarks(l);
field.setFieldType(t);
fieldList.add(field);
}
return fieldList;
}

9
backend/src/main/java/io/dataease/service/chart/ChartViewService.java
View File

@ -102,8 +102,13 @@ public class ChartViewService {
DatasourceRequest datasourceRequest = new DatasourceRequest();
datasourceRequest.setDatasource(ds);
DataTableInfoDTO dataTableInfoDTO = new Gson().fromJson(table.getInfo(), DataTableInfoDTO.class);
datasourceRequest.setTable(dataTableInfoDTO.getTable());
datasourceRequest.setQuery(getSQL(ds.getType(), dataTableInfoDTO.getTable(), xAxis, yAxis));
if (StringUtils.equalsIgnoreCase(table.getType(), "db")) {
datasourceRequest.setTable(dataTableInfoDTO.getTable());
datasourceRequest.setQuery(getSQL(ds.getType(), dataTableInfoDTO.getTable(), xAxis, yAxis));
} else if (StringUtils.equalsIgnoreCase(table.getType(), "sql")) {
datasourceRequest.setQuery(getSQL(ds.getType(), " (" + dataTableInfoDTO.getSql() + ") AS tmp ", xAxis, yAxis));
}
List<String[]> data = datasourceProvider.getData(datasourceRequest);
// todo 处理结果,目前做一个单系列图表，后期图表组件再扩展

34
backend/src/main/java/io/dataease/service/dataset/DataSetTableService.java
View File

@ -54,8 +54,8 @@ public class DataSetTableService {
DataTableInfoDTO dataTableInfoDTO = new DataTableInfoDTO();
if (StringUtils.equalsIgnoreCase("db", datasetTable.getType())) {
dataTableInfoDTO.setTable(datasetTable.getName());
datasetTable.setInfo(new Gson().toJson(dataTableInfoDTO));
}
datasetTable.setInfo(new Gson().toJson(dataTableInfoDTO));
int insert = datasetTableMapper.insert(datasetTable);
// 添加表成功后，获取当前表字段和类型，抽象到dataease数据库
if (insert == 1) {
@ -143,15 +143,22 @@ public class DataSetTableService {
DatasourceProvider datasourceProvider = ProviderFactory.getProvider(ds.getType());
DatasourceRequest datasourceRequest = new DatasourceRequest();
datasourceRequest.setDatasource(ds);
String table = new Gson().fromJson(dataSetTableRequest.getInfo(), DataTableInfoDTO.class).getTable();
DatasetTableField datasetTableField = DatasetTableField.builder().build();
datasetTableField.setTableId(dataSetTableRequest.getId());
datasetTableField.setChecked(Boolean.TRUE);
List<DatasetTableField> fields = dataSetTableFieldsService.list(datasetTableField);
String[] fieldArray = fields.stream().map(DatasetTableField::getOriginName).toArray(String[]::new);
datasourceRequest.setQuery(createQuerySQL(ds.getType(), table, fieldArray) + " LIMIT 0,10");// todo limit
DataTableInfoDTO dataTableInfoDTO = new Gson().fromJson(dataSetTableRequest.getInfo(), DataTableInfoDTO.class);
DatasetTable datasetTable = datasetTableMapper.selectByPrimaryKey(dataSetTableRequest.getId());
if (StringUtils.equalsIgnoreCase(datasetTable.getType(), "db")) {
String table = dataTableInfoDTO.getTable();
datasourceRequest.setQuery(createQuerySQL(ds.getType(), table, fieldArray) + " LIMIT 0,10");// todo limit
} else if (StringUtils.equalsIgnoreCase(datasetTable.getType(), "sql")) {
String sql = dataTableInfoDTO.getSql();
datasourceRequest.setQuery(createQuerySQL(ds.getType(), " (" + sql + ") AS tmp ", fieldArray));// todo 因为编辑可能取消某些字段展示，这里sql看看怎么处理
}
List<String[]> data = new ArrayList<>();
try {
@ -170,7 +177,6 @@ public class DataSetTableService {
}).collect(Collectors.toList());
}
Map<String, Object> map = new HashMap<>();
map.put("fields", fields);
map.put("data", jsonArray);
@ -187,14 +193,15 @@ public class DataSetTableService {
datasourceRequest.setQuery(sql);
ResultSet dataResultSet = datasourceProvider.getDataResultSet(datasourceRequest);
List<String[]> data = datasourceProvider.fetchResult(dataResultSet);
List<String> fields = datasourceProvider.fetchResultField(dataResultSet);
List<TableFiled> fields = datasourceProvider.fetchResultField(dataResultSet);
String[] fieldArray = fields.stream().map(TableFiled::getFieldName).toArray(String[]::new);
List<Map<String, Object>> jsonArray = new ArrayList<>();
if (CollectionUtils.isNotEmpty(data)) {
jsonArray = data.stream().map(ele -> {
Map<String, Object> map = new HashMap<>();
for (int i = 0; i < ele.length; i++) {
map.put(fields.get(i), ele[i]);
map.put(fieldArray[i], ele[i]);
}
return map;
}).collect(Collectors.toList());
@ -258,8 +265,19 @@ public class DataSetTableService {
Datasource ds = datasourceMapper.selectByPrimaryKey(datasetTable.getDataSourceId());
DataSetTableRequest dataSetTableRequest = new DataSetTableRequest();
BeanUtils.copyBean(dataSetTableRequest, datasetTable);
List<TableFiled> fields = getFields(dataSetTableRequest);
List<TableFiled> fields = new ArrayList<>();
long syncTime = System.currentTimeMillis();
if (StringUtils.equalsIgnoreCase(datasetTable.getType(), "db")) {
fields = getFields(dataSetTableRequest);
} else if (StringUtils.equalsIgnoreCase(datasetTable.getType(), "sql")) {
DatasourceProvider datasourceProvider = ProviderFactory.getProvider(ds.getType());
DatasourceRequest datasourceRequest = new DatasourceRequest();
datasourceRequest.setDatasource(ds);
datasourceRequest.setQuery(new Gson().fromJson(dataSetTableRequest.getInfo(), DataTableInfoDTO.class).getSql());
ResultSet dataResultSet = datasourceProvider.getDataResultSet(datasourceRequest);
fields = datasourceProvider.fetchResultField(dataResultSet);
}
if (CollectionUtils.isNotEmpty(fields)) {
for (int i = 0; i < fields.size(); i++) {
TableFiled filed = fields.get(i);

29
backend/src/main/java/io/dataease/service/sys/DeptService.java
View File

@ -8,10 +8,12 @@ import io.dataease.base.mapper.ext.query.GridExample;
import io.dataease.commons.utils.BeanUtils;
import io.dataease.commons.utils.CommonBeanFactory;
import io.dataease.controller.sys.base.BaseGridRequest;
import io.dataease.controller.sys.base.ConditionEntity;
import io.dataease.controller.sys.request.DeptCreateRequest;
import io.dataease.controller.sys.request.DeptDeleteRequest;
import io.dataease.controller.sys.request.DeptStatusRequest;
import io.dataease.controller.sys.request.SimpleTreeNode;
import io.dataease.controller.sys.response.DeptTreeNode;
import org.apache.commons.lang3.ObjectUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
@ -139,6 +141,33 @@ public class DeptService {
return sysDepts;
}
public List<DeptTreeNode> searchTree(Long deptId){
List<SysDept> roots = nodesByPid(0L);
if (deptId == DEPT_ROOT_PID) return roots.stream().map(this::format).collect(Collectors.toList());
SysDept sysDept = sysDeptMapper.selectByPrimaryKey(deptId);
if (roots.stream().anyMatch(node -> node.getDeptId() == deptId)) return roots.stream().map(this::format).collect(Collectors.toList());
SysDept current = sysDept;
DeptTreeNode currentNode = format(sysDept);
while (current.getPid() != DEPT_ROOT_PID){
SysDept parent = sysDeptMapper.selectByPrimaryKey(current.getPid()); //pid上有索引 所以效率不会太差
DeptTreeNode parentNode = format(parent);
parentNode.setChildren(currentNode.toList());
current = parent;
currentNode = parentNode;
}
DeptTreeNode targetRootNode = currentNode;
return roots.stream().map(node -> node.getDeptId() == targetRootNode.getId() ? targetRootNode : format(node)).collect(Collectors.toList());
}
private DeptTreeNode format(SysDept sysDept){
DeptTreeNode deptTreeNode = new DeptTreeNode();
deptTreeNode.setId(sysDept.getDeptId());
deptTreeNode.setLabel(sysDept.getName());
deptTreeNode.setHasChildren(sysDept.getSubCount() > 0);
return deptTreeNode;
}
private DeptService proxy(){
return CommonBeanFactory.getBean(DeptService.class);
}

9
frontend/src/api/system/dept.js
View File

@ -41,4 +41,11 @@ export function editDept(data) {
})
}
export default { addDept, delDept, editDept, getDeptTree, loadTable }
export function treeByDeptId(deptId) {
return request({
url: '/api/dept/nodesByDeptId/' + deptId,
method: 'post'
})
}
export default { addDept, delDept, editDept, getDeptTree, loadTable, treeByDeptId }

90
frontend/src/components/business/tree-table/index.vue Normal file
View File

@ -0,0 +1,90 @@
<template>
<div class="complex-table">
<div v-if="$slots.header || header" class="complex-table__header">
<slot name="header">{{ header }}</slot>
</div>
<div v-if="$slots.toolbar || searchConfig" class="complex-table__toolbar">
<slot name="toolbar">
<fu-search-bar v-bind="searchConfig" @exec="search">
<slot name="buttons" />
<fu-table-column-select :columns="columns" />
</fu-search-bar>
</slot>
</div>
<div class="complex-table__body">
<slot />
<!-- <fu-table ref="table" v-bind="$attrs" :columns="columns" :local-key="localKey" v-on="$listeners">
<slot />
</fu-table> -->
</div>
<div v-if="$slots.pagination || paginationConfig" class="complex-table__pagination">
<slot name="pagination">
<fu-table-pagination
:current-page.sync="paginationConfig.currentPage"
:page-size.sync="paginationConfig.pageSize"
v-bind="paginationConfig"
@change="search"
/>
</slot>
</div>
</div>
</template>
<script>
export default {
name: 'TreeTable',
props: {
columns: {
type: Array,
default: () => []
},
// eslint-disable-next-line vue/require-default-prop
localKey: String, // 如果需要记住选择的列，则这里添加一个唯一的Key
// eslint-disable-next-line vue/require-default-prop
header: String,
// eslint-disable-next-line vue/require-default-prop
searchConfig: Object,
// eslint-disable-next-line vue/require-default-prop
paginationConfig: Object
},
data() {
return {
condition: {}
}
},
methods: {
search(condition, e) {
if (condition) {
this.condition = condition
}
this.$emit('search', this.condition, e)
}
}
}
</script>
<style lang="scss">
@import "~@/styles/mixin.scss";
@import "~@/styles/variables.scss";
.complex-table {
.complex-table__header {
@include flex-row(flex-start, center);
height: 60px;
font-size: 20px;
}
.complex-table__toolbar {
@include flex-row(flex-end, center);
}
.complex-table__pagination {
margin-top: 20px;
@include flex-row(flex-end);
}
}
</style>

3
frontend/src/lang/zh.js
View File

@ -667,7 +667,8 @@ export default {
required: '必填',
input_content: '请输入内容',
add_sql_table: '添加SQL',
preview: '预览'
preview: '预览',
pls_input_name: '请输入名称'
},
datasource: {
create: '新建数据连接',

2
frontend/src/views/dataset/add/AddDB.vue
View File

@ -42,7 +42,7 @@
</el-form-item>
</el-form>
</el-row>
<el-row style="overflow: auto;height: 600px;">
<el-row style="overflow: auto;height: 60vh;">
<el-checkbox-group v-model="checkTableList" size="small">
<el-checkbox
v-for="t in tableData"

61
frontend/src/views/dataset/add/AddSQL.vue
View File

@ -9,7 +9,7 @@
<el-button size="mini" @click="cancel">
{{ $t('dataset.cancel') }}
</el-button>
<el-button size="mini" type="primary">
<el-button size="mini" type="primary" @click="save">
{{ $t('dataset.confirm') }}
</el-button>
</el-row>
@ -60,15 +60,15 @@
ref="plxTable"
size="mini"
style="width: 100%;"
:height="500"
:height="height"
:checkbox-config="{highlight: true}"
>
<ux-table-column
v-for="field in fields"
:key="field"
:key="field.fieldName"
min-width="200px"
:field="field"
:title="field"
:field="field.fieldName"
:title="field.remarks"
:resizable="true"
/>
</ux-grid>
@ -100,6 +100,10 @@ import 'codemirror/addon/dialog/dialog.css'
import 'codemirror/addon/search/searchcursor.js'
import 'codemirror/addon/search/search.js'
import 'codemirror/keymap/emacs.js'
// 引入代码自动提示插件
import 'codemirror/addon/hint/show-hint.css'
import 'codemirror/addon/hint/sql-hint'
import 'codemirror/addon/hint/show-hint'
export default {
name: 'AddSQL',
@ -123,13 +127,14 @@ export default {
line: true,
mode: 'text/x-sql',
theme: 'solarized',
hintOptions: {
completeSingle: true
hintOptions: { // 自定义提示选项
completeSingle: false // 当匹配只有一项的时候是否自动补全
}
},
data: [],
fields: [],
mode: '0'
mode: '0',
height: 500
}
},
computed: {
@ -139,7 +144,16 @@ export default {
},
watch: {},
mounted() {
window.onresize = () => {
return (() => {
this.height = window.innerHeight / 2
})()
}
this.height = window.innerHeight / 2
this.initDataSource()
this.$refs.myCm.codemirror.on('keypress', () => {
this.$refs.myCm.codemirror.showHint()
})
},
methods: {
initDataSource() {
@ -169,6 +183,37 @@ export default {
})
},
save() {
if (!this.dataSource || this.datasource === '') {
this.$message({
showClose: true,
message: this.$t('dataset.pls_slc_data_source'),
type: 'error'
})
return
}
if (!this.name || this.name === '') {
this.$message({
showClose: true,
message: this.$t('dataset.pls_input_name'),
type: 'error'
})
return
}
const table = {
name: this.name,
sceneId: this.param.id,
dataSourceId: this.dataSource,
type: 'sql',
mode: parseInt(this.mode),
info: '{"sql":"' + this.sql + '"}'
}
post('/dataset/table/update', table).then(response => {
this.$store.dispatch('dataset/setSceneData', new Date().getTime())
this.cancel()
})
},
cancel() {
// this.dataReset()
this.$emit('switchComponent', { name: '' })

40
frontend/src/views/dataset/common/DatasetTableData.vue
View File

@ -1,21 +1,22 @@
<template>
<el-col>
<span>{{ table.name }}</span>
<el-table
<ux-grid
ref="plxTable"
size="mini"
:data="data"
height="40vh"
border
style="width: 100%;margin-top: 6px;"
style="width: 100%;"
:height="height"
:checkbox-config="{highlight: true}"
>
<el-table-column
<ux-table-column
v-for="field in fields"
:key="field.originName"
min-width="200px"
:prop="field.originName"
:label="field.name"
:field="field.originName"
:title="field.name"
:resizable="true"
/>
</el-table>
</ux-grid>
</el-col>
</template>
@ -25,13 +26,16 @@ import { post } from '@/api/dataset/dataset'
export default {
name: 'DatasetTableData',
props: {
// eslint-disable-next-line vue/require-default-prop
table: Object
table: {
type: Object,
required: true
}
},
data() {
return {
fields: [],
data: []
data: [],
height: 500
}
},
watch: {
@ -39,10 +43,14 @@ export default {
this.initData()
}
},
created() {
this.initData()
},
mounted() {
window.onresize = () => {
return (() => {
this.height = window.innerHeight / 3
})()
}
this.height = window.innerHeight / 3
this.initData()
},
methods: {
initData() {
@ -51,6 +59,8 @@ export default {
post('/dataset/table/getPreviewData', this.table).then(response => {
this.fields = response.data.fields
this.data = response.data.data
const datas = this.data
this.$refs.plxTable.reloadData(datas)
})
}
},

26
frontend/src/views/dataset/data/TabDataPreview.vue
View File

@ -4,7 +4,7 @@
ref="plxTable"
size="mini"
style="width: 100%;"
:height="500"
:height="height"
:checkbox-config="{highlight: true}"
>
<ux-table-column
@ -23,12 +23,22 @@
export default {
name: 'TabDataPreview',
props: {
table: Object,
fields: Array,
data: Array
table: {
type: Object,
required: true
},
fields: {
type: Array,
required: true
},
data: {
type: Array,
required: true
}
},
data() {
return {
height: 500
}
},
computed: {
@ -39,9 +49,13 @@ export default {
this.$refs.plxTable.reloadData(datas)
}
},
created() {
},
mounted() {
window.onresize = () => {
return (() => {
this.height = window.innerHeight / 2
})()
}
this.height = window.innerHeight / 2
},
activated() {
},

66
frontend/src/views/system/dept/index.vue
View File

@ -1,7 +1,7 @@
<template>
<layout-content v-loading="$store.getters.loadingMap[$store.getters.currentPath]">
<complex-table
<!-- <complex-table
ref="table"
:data="tableData"
:lazy="isLazy"
@ -15,15 +15,31 @@
:default-expand-all="isTableExpand"
row-key="deptId"
@search="search"
> -->
<tree-table
:columns="columns"
:buttons="buttons"
:header="header"
:search-config="searchConfig"
@search="search"
>
<template #buttons>
<fu-table-button icon="el-icon-circle-plus-outline" :label="$t('organization.create')" @click="create" />
<fu-table-button v-permission="['dept:add']" icon="el-icon-circle-plus-outline" :label="$t('organization.create')" @click="create" />
</template>
<el-table
ref="table"
:data="tableData"
lazy
:load="loadExpandDatas"
style="width: 100%"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
row-key="deptId"
>
<!-- <el-table-column type="selection" fix /> -->
<el-table-column label="名称" prop="name" />
<el-table-column label="下属组织数" prop="subCount" />
<!-- <el-table-column label="状态" align="center" prop="enabled">
<!-- <el-table-column type="selection" fix /> -->
<el-table-column label="名称" prop="name" />
<el-table-column label="下属组织数" prop="subCount" />
<!-- <el-table-column label="状态" align="center" prop="enabled">
<template slot-scope="scope">
<el-switch
v-model="scope.row.enabled"
@ -34,14 +50,16 @@
/>
</template>
</el-table-column> -->
<el-table-column prop="createTime" label="创建日期">
<template v-slot:default="scope">
<span>{{ scope.row.createTime | timestampFormatDate }}</span>
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建日期">
<template v-slot:default="scope">
<span>{{ scope.row.createTime | timestampFormatDate }}</span>
</template>
</el-table-column>
<fu-table-operations :buttons="buttons" label="操作" fix />
</complex-table>
<fu-table-operations :buttons="buttons" label="操作" fix />
</el-table>
</tree-table>
<!-- </complex-table> -->
<!-- add organization form -->
<el-dialog
@ -106,19 +124,19 @@
<script>
import LayoutContent from '@/components/business/LayoutContent'
import ComplexTable from '@/components/business/complex-table'
import TreeTable from '@/components/business/tree-table'
import Treeselect from '@riophae/vue-treeselect'
import { formatCondition } from '@/utils/index'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { LOAD_CHILDREN_OPTIONS, LOAD_ROOT_OPTIONS } from '@riophae/vue-treeselect'
import { checkPermission } from '@/utils/permission'
import { getDeptTree, addDept, editDept, delDept, loadTable } from '@/api/system/dept'
export default {
name: 'MsOrganization',
components: {
LayoutContent,
ComplexTable,
TreeTable,
Treeselect
},
data() {
@ -155,9 +173,11 @@ export default {
columns: [],
buttons: [
{
label: this.$t('commons.edit'), icon: 'el-icon-edit', click: this.edit
label: this.$t('commons.edit'), icon: 'el-icon-edit', click: this.edit,
show: checkPermission(['dept:edit'])
}, {
label: this.$t('commons.delete'), icon: 'el-icon-delete', type: 'danger', click: this._handleDelete
label: this.$t('commons.delete'), icon: 'el-icon-delete', type: 'danger', click: this._handleDelete,
show: checkPermission(['dept:del'])
}
],
searchConfig: {
@ -168,11 +188,7 @@ export default {
]
},
paginationConfig: {
currentPage: 1,
pageSize: 10,
total: 0
},
defaultCondition: {
field: 'pid',
operator: 'eq',
@ -271,7 +287,7 @@ export default {
},
// 加载表格数据
search(condition) {
this.setTableAttr()
// this.setTableAttr()
this.tableData = []
let param = {}
if (condition && condition.quick) {
@ -293,7 +309,7 @@ export default {
if (condition && condition.quick) {
data = this.buildTree(data)
this.setTableAttr(true)
// this.setTableAttr(true)
}
this.tableData = data
this.depts = null

151
frontend/src/views/system/menu/index.vue
View File

@ -1,59 +1,46 @@
<template>
<layout-content v-loading="$store.getters.loadingMap[$store.getters.currentPath]">
<complex-table
ref="table"
:data="tableData"
lazy
:load="initTableData"
<tree-table
:columns="columns"
:buttons="buttons"
:header="header"
:search-config="searchConfig"
:pagination-config="paginationConfig"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
row-key="menuId"
@search="initTableData"
>
<template #buttons>
<fu-table-button icon="el-icon-circle-plus-outline" :label="$t('menu.create')" @click="create" />
<template v-permission="['menu:add']" #buttons>
<fu-table-button v-permission="['menu:add']" icon="el-icon-circle-plus-outline" :label="$t('menu.create')" @click="create" />
</template>
<!-- <el-table-column type="selection" fix /> -->
<el-table-column :show-overflow-tooltip="true" label="菜单标题" width="150px" prop="title" />
<el-table-column prop="icon" label="图标" align="center" width="60px">
<template slot-scope="scope">
<svg-icon :icon-class="scope.row.icon ? scope.row.icon : ''" />
</template>
</el-table-column>
<el-table
ref="table"
:data="tableData"
lazy
:load="initTableData"
style="width: 100%"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
row-key="menuId"
>
<el-table-column :show-overflow-tooltip="true" prop="permission" label="权限标识" />
<el-table-column :show-overflow-tooltip="true" prop="component" label="组件路径" />
<!-- <el-table-column prop="iframe" label="外链" width="75px">
<template slot-scope="scope">
<span v-if="scope.row.iframe">是</span>
<span v-else>否</span>
</template>
</el-table-column>
<el-table-column prop="cache" label="缓存" width="75px">
<template slot-scope="scope">
<span v-if="scope.row.cache">是</span>
<span v-else>否</span>
</template>
</el-table-column>
<el-table-column prop="hidden" label="可见" width="75px">
<template slot-scope="scope">
<span v-if="scope.row.hidden">否</span>
<span v-else>是</span>
</template>
</el-table-column> -->
<el-table-column prop="createTime" label="创建日期" width="160px">
<template v-slot:default="scope">
<span>{{ scope.row.createTime | timestampFormatDate }}</span>
</template>
</el-table-column>
<!-- <el-table-column type="selection" fix /> -->
<el-table-column :show-overflow-tooltip="true" label="菜单标题" width="150px" prop="title" />
<el-table-column prop="icon" label="图标" align="center" width="60px">
<template slot-scope="scope">
<svg-icon :icon-class="scope.row.icon ? scope.row.icon : ''" />
</template>
</el-table-column>
<fu-table-operations :buttons="buttons" label="操作" fix />
</complex-table>
<el-table-column :show-overflow-tooltip="true" prop="permission" label="权限标识" />
<el-table-column :show-overflow-tooltip="true" prop="component" label="组件路径" />
<el-table-column prop="createTime" label="创建日期" width="160px">
<template v-slot:default="scope">
<span>{{ scope.row.createTime | timestampFormatDate }}</span>
</template>
</el-table-column>
<fu-table-operations :buttons="buttons" label="操作" fix />
</el-table>
</tree-table>
<el-dialog
:close-on-click-modal="false"
@ -66,13 +53,13 @@
<el-form ref="menuForm" inline :model="form" :rules="rule" size="small" label-width="80px">
<el-form-item label="菜单类型" prop="type">
<el-radio-group v-model="form.type" size="mini" style="width: 179px">
<el-radio-group v-model="form.type" size="mini" :disabled="formType!=='add'" style="width: 179px">
<el-radio-button label="0">目录</el-radio-button>
<el-radio-button label="1">菜单</el-radio-button>
<el-radio-button label="2">按钮</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type!== '2'" label="菜单图标" prop="icon">
<el-form-item v-show="form.type!== 2" label="菜单图标" prop="icon">
<el-popover
placement="bottom-start"
width="425"
@ -86,48 +73,32 @@
</el-input>
</el-popover>
</el-form-item>
<!-- <el-form-item v-show="form.type !== '2'" label="外链菜单" prop="iframe">
<el-radio-group v-model="form.iframe" size="mini">
<el-radio-button label="true">是</el-radio-button>
<el-radio-button label="false">否</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type=== '1'" label="菜单缓存" prop="cache">
<el-radio-group v-model="form.cache" size="mini">
<el-radio-button label="true">是</el-radio-button>
<el-radio-button label="false">否</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item v-show="form.type !== '2'" label="菜单可见" prop="hidden">
<el-radio-group v-model="form.hidden" size="mini">
<el-radio-button label="false">是</el-radio-button>
<el-radio-button label="true">否</el-radio-button>
</el-radio-group>
</el-form-item> -->
<el-form-item v-if="form.type !== '2'" label="菜单标题" prop="title">
<el-form-item v-if="form.type !== 2" label="菜单标题" prop="title">
<el-input v-model="form.title" :style=" form.type === '0' ? 'width: 450px' : 'width: 179px'" placeholder="菜单标题" />
</el-form-item>
<el-form-item v-if="form.type === '2'" label="按钮名称" prop="title">
<el-form-item v-if="form.type === 2" label="按钮名称" prop="title">
<el-input v-model="form.title" placeholder="按钮名称" style="width: 179px;" />
</el-form-item>
<el-form-item v-show="form.type !== '0'" label="权限标识" prop="permission">
<el-input v-model="form.permission" :disabled="form.iframe" placeholder="权限标识" style="width: 179px;" />
<el-form-item v-show="form.type !== 0" label="权限标识" prop="permission">
<el-input v-model="form.permission" :disabled="form.iframe || formType!=='add'" placeholder="权限标识" style="width: 179px;" />
</el-form-item>
<el-form-item v-if="form.type !== '2'" label="路由地址" prop="path">
<el-input v-model="form.path" placeholder="路由地址" style="width: 179px;" />
<el-form-item v-if="form.type !== 2" label="路由地址" prop="path">
<el-input v-model="form.path" placeholder="路由地址" :disabled="formType!=='add'" style="width: 179px;" />
</el-form-item>
<el-form-item label="菜单排序" prop="menuSort">
<el-input-number v-model.number="form.menuSort" :min="0" :max="999" controls-position="right" style="width: 179px;" />
</el-form-item>
<el-form-item v-show="!form.iframe && form.type === '1'" label="组件名称" prop="componentName">
<el-input v-model="form.componentName" style="width: 179px;" placeholder="匹配组件内Name字段" />
<el-form-item v-show="!form.iframe && form.type === 1" label="组件名称" prop="componentName">
<el-input v-model="form.componentName" :disabled="formType!=='add'" style="width: 179px;" placeholder="匹配组件内Name字段" />
</el-form-item>
<el-form-item v-show="!form.iframe && form.type === '1'" label="组件路径" prop="component">
<el-input v-model="form.component" style="width: 179px;" placeholder="组件路径" />
<el-form-item v-show="!form.iframe && form.type === 1" label="组件路径" prop="component">
<el-input v-model="form.component" :disabled="formType!=='add'" style="width: 179px;" placeholder="组件路径" />
</el-form-item>
<el-form-item label="上级类目" prop="pid">
<treeselect
v-model="form.pid"
:disabled="formType!=='add'"
:options="menus"
:load-options="loadMenus"
style="width: 450px;"
@ -139,12 +110,7 @@
<el-button type="text" @click="dialogVisible = false">{{ $t('commons.cancel') }}</el-button>
<el-button type="primary" @click="createMenu('menuForm')">确认</el-button>
</div>
<!-- <template v-slot:footer>
<ms-dialog-footer
@cancel="dialogVisible = false"
@confirm="createMenu('menuForm')"
/>
</template> -->
</el-dialog>
</layout-content>
@ -152,19 +118,18 @@
<script>
import LayoutContent from '@/components/business/LayoutContent'
import ComplexTable from '@/components/business/complex-table'
import TreeTable from '@/components/business/tree-table'
// import { checkPermission } from '@/utils/permission'
import IconSelect from '@/components/IconSelect'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { LOAD_CHILDREN_OPTIONS, LOAD_ROOT_OPTIONS } from '@riophae/vue-treeselect'
import { checkPermission } from '@/utils/permission'
import { addMenu, editMenu, delMenu, getMenusTree } from '@/api/system/menu'
export default {
name: 'MsMenu',
components: {
ComplexTable,
TreeTable,
LayoutContent,
Treeselect,
IconSelect
@ -172,7 +137,7 @@ export default {
data() {
return {
menus: [],
topMunu: { id: 0, label: '顶级类目', children: null },
topMunu: { id: 0, label: '顶级目录', children: null },
formType: 'add',
dialogVisible: false,
condition: {},
@ -200,9 +165,11 @@ export default {
columns: [],
buttons: [
{
label: this.$t('commons.edit'), icon: 'el-icon-edit', click: this.edit
label: this.$t('commons.edit'), icon: 'el-icon-edit', click: this.edit,
show: checkPermission(['menu:edit'])
}, {
label: this.$t('commons.delete'), icon: 'el-icon-delete', type: 'danger', click: this._handleDelete
label: this.$t('commons.delete'), icon: 'el-icon-delete', type: 'danger', click: this._handleDelete,
show: checkPermission(['menu:del'])
}
],
searchConfig: {
@ -224,11 +191,6 @@ export default {
// multiple: false
// }
]
},
paginationConfig: {
currentPage: 1,
pageSize: 10,
total: 0
}
}
@ -374,7 +336,7 @@ export default {
this.formType === 'modify' && this.form['menuId'] && (method = editMenu)
method(this.form).then(res => {
this.$success(this.$t('commons.save_success'))
this.initTableData()
// this.initTableData()
this.oldPid && this.reloadByPid(this.oldPid)
this.reloadByPid(this.form['pid'])
this.dialogVisible = false
@ -407,7 +369,8 @@ export default {
reloadByPid(pid) {
if (pid !== 0 && this.maps.get(pid)) {
const { row, treeNode, resolve } = this.maps.get(pid)
this.$set(this.$refs.table.store.states.lazyTreeNodeMap, pid, [])
const sto = this.$refs.table['store']
this.$set(sto.states.lazyTreeNodeMap, pid, [])
this.initTableData(row, treeNode, resolve)
}
},

41
frontend/src/views/system/user/index.vue
View File

@ -11,7 +11,7 @@
@search="search"
>
<template #buttons>
<fu-table-button icon="el-icon-circle-plus-outline" :label="$t('user.create')" @click="create" />
<fu-table-button v-permission="['user:add']" icon="el-icon-circle-plus-outline" :label="$t('user.create')" @click="create" />
</template>
<el-table-column type="selection" fix />
@ -157,7 +157,7 @@ import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { userLists, addUser, editUser, delUser, editPassword, editStatus } from '@/api/system/user'
import { allRoles } from '@/api/system/role'
import { getDeptTree } from '@/api/system/dept'
import { getDeptTree, treeByDeptId } from '@/api/system/dept'
export default {
@ -168,9 +168,11 @@ export default {
columns: [],
buttons: [
{
label: this.$t('commons.edit'), icon: 'el-icon-edit', click: this.edit
label: this.$t('commons.edit'), icon: 'el-icon-edit', click: this.edit,
show: checkPermission(['user:edit'])
}, {
label: this.$t('commons.delete'), icon: 'el-icon-delete', type: 'danger', click: this.del
label: this.$t('commons.delete'), icon: 'el-icon-delete', type: 'danger', click: this.del,
show: checkPermission(['user:del'])
}, {
label: this.$t('member.edit_password'), icon: 'el-icon-s-tools', type: 'danger', click: this.editPassword,
show: checkPermission(['user:editPwd'])
@ -306,14 +308,20 @@ export default {
},
create() {
this.depts = null
this.formType = 'add'
this.form = Object.assign({}, this.defaultForm)
this.dialogVisible = true
},
edit(row) {
this.depts = null
this.formType = 'modify'
this.dialogVisible = true
this.form = Object.assign({}, row)
if (this.form.deptId === 0) {
this.form.deptId = null
}
this.initDeptTree()
},
editPassword(row) {
this.editPasswordVisible = true
@ -364,6 +372,7 @@ export default {
})
},
handleClose() {
this.depts = null
this.formType = 'add'
this.form = {}
this.editPasswordVisible = false
@ -376,12 +385,30 @@ export default {
this.$success(this.$t('commons.modify_success'))
})
},
initDeptTree() {
treeByDeptId(this.form.deptId || 0).then(res => {
const results = res.data.map(node => {
if (node.hasChildren && !node.children) {
node.children = null
}
return node
})
this.depts = results
})
},
// 获取弹窗内部门数据
loadDepts({ action, parentNode, callback }) {
if (action === LOAD_ROOT_OPTIONS) {
if (action === LOAD_ROOT_OPTIONS && !this.form.deptId) {
const _self = this
!this.depts && getDeptTree('0').then(res => {
_self.depts = res.data.map(node => _self.normalizer(node))
treeByDeptId(0).then(res => {
const results = res.data.map(node => {
if (node.hasChildren && !node.children) {
node.children = null
}
return node
})
_self.depts = results
callback()
})
}