Commit 398a4c6b authored by trumansdo's avatar trumansdo
Browse files

todo: 确立代码生成逻辑。

1、前端采用通用页面,通过元数据生成
2、后端使用元数据
3、前端页面采用tabs组件显示
4、引入代码高亮js,封装vue组件
parent 67bb8798
package com.ibeetl.admin.console.util;
import cn.hutool.core.annotation.AnnotationUtil;
import cn.hutool.core.collection.CollUtil;
import cn.hutool.core.map.MapBuilder;
import cn.hutool.core.map.MapUtil;
import cn.hutool.core.util.StrUtil;
import com.ibeetl.admin.core.annotation.ElColumn;
import com.ibeetl.admin.core.entity.CoreDict;
import com.ibeetl.admin.core.entity.ElCascaderData;
import java.lang.reflect.Field;
import java.util.ArrayList;
import java.util.Comparator;
import java.util.List;
import java.util.Map;
import java.util.Map.Entry;
import java.util.Optional;
import java.util.Set;
import java.util.stream.Collectors;
/**
* 视图工具类
......@@ -22,37 +17,37 @@ import java.util.Set;
* @author 一日看尽长安花
*/
public class VOUtil {
static final String JSON_PATH_KEY = "json_path";
/**
* Method resolveElColumn ... todo 预计重新定义一个类用来转换,而不是用map
*
* @param cls of type Class ,一个专门存放元数据的ElQuery类
* @param cls
* of type Class ,一个专门存放元数据的ElQuery类
* @return Map
*/
public static Map resolveElColumn(Class cls) {
public static List<Map<String, Object>> resolveElColumn(Class cls) {
MapBuilder<String, Map> mapBuilder = MapUtil.<String, Map>builder();
List<Map<String, Object>> metedataList = new ArrayList<>();
Field[] declaredFields = cls.getDeclaredFields();
for (Field field : declaredFields) {
Map<String, Object> annotationValueMap =
Map<String, Object> elcolumnValMap =
AnnotationUtil.getAnnotationValueMap(field, ElColumn.class);
if (MapUtil.isEmpty(annotationValueMap)) continue;
Set<Entry<String, Object>> entrySet = annotationValueMap.entrySet();
MapBuilder<Object, Object> camelKeyValueMap = MapUtil.builder();
for (Entry<String, Object> entry : entrySet) {
String key = entry.getKey();
Object value = entry.getValue();
camelKeyValueMap.put(StrUtil.toUnderlineCase(key), value);
if (MapUtil.isEmpty(elcolumnValMap)) {
continue;
}
Map<String, Object> camelKeyValueMap = elcolumnValMap.entrySet().stream().collect(Collectors
.toMap(k -> StrUtil.toUnderlineCase(k.getKey()), v -> v.getValue(), (o, n) -> n));
String camelKey = StrUtil.toUnderlineCase(field.getName());
Map<Object, Object> buildMap = camelKeyValueMap.build();
String jsonPath = buildMap.getOrDefault(JSON_PATH_KEY, StrUtil.EMPTY).toString();
if (StrUtil.isBlank(jsonPath)) {
jsonPath = camelKey;
}
buildMap.put(JSON_PATH_KEY, jsonPath);
mapBuilder.put(camelKey, buildMap);
camelKeyValueMap
.compute(JSON_PATH_KEY, (k, v) -> StrUtil.isEmpty(v.toString()) ? camelKey : v);
camelKeyValueMap.put("key", camelKey);
metedataList.add(camelKeyValueMap);
}
return mapBuilder.build();
return metedataList.stream()
.sorted(Comparator.comparing(v -> ((Integer) v.get("order")))).collect(
Collectors.toList());
}
}
......@@ -2,7 +2,7 @@ package com.ibeetl.admin.console.web;
import cn.hutool.core.util.StrUtil;
import com.ibeetl.admin.core.entity.CoreDict;
import com.ibeetl.admin.core.entity.ElCascaderData;
import com.ibeetl.admin.core.model.ElCascaderData;
import com.ibeetl.admin.core.service.CoreDictService;
import com.ibeetl.admin.core.web.JsonResult;
import java.util.ArrayList;
......
package com.ibeetl.admin.console.web;
import com.ibeetl.admin.core.entity.CoreOrg;
import com.ibeetl.admin.core.entity.ElCascaderData;
import com.ibeetl.admin.core.model.ElCascaderData;
import com.ibeetl.admin.console.service.CoreOrgConsoleElService;
import com.ibeetl.admin.core.service.CoreOrgService;
import com.ibeetl.admin.core.service.CorePlatformService;
......
......@@ -2,7 +2,7 @@ package com.ibeetl.admin.console.web;
import com.ibeetl.admin.console.service.CoreOrgConsoleElService;
import com.ibeetl.admin.core.entity.CoreRole;
import com.ibeetl.admin.core.entity.ElCascaderData;
import com.ibeetl.admin.core.model.ElCascaderData;
import com.ibeetl.admin.core.service.CorePlatformService;
import com.ibeetl.admin.core.service.CoreRoleService;
import com.ibeetl.admin.core.util.enums.RoleTypeEnum;
......
......@@ -16,7 +16,7 @@ import com.ibeetl.admin.core.annotation.RequestBodyPlus;
import com.ibeetl.admin.core.entity.CoreFunction;
import com.ibeetl.admin.core.entity.CoreRole;
import com.ibeetl.admin.core.entity.CoreUser;
import com.ibeetl.admin.core.entity.ElCascaderData;
import com.ibeetl.admin.core.model.ElCascaderData;
import com.ibeetl.admin.core.rbac.DataAccess;
import com.ibeetl.admin.core.rbac.DataAccessFactory;
import com.ibeetl.admin.core.service.CorePlatformService;
......
......@@ -44,21 +44,26 @@ import org.springframework.web.bind.annotation.RestController;
@RestController
public class UserConsoleElController {
@Autowired private UserConsoleService userConsoleService;
@Autowired
private UserConsoleService userConsoleService;
@Autowired private CorePlatformService platformService;
@Autowired
private CorePlatformService platformService;
@Autowired FileService fileService;
@Autowired
FileService fileService;
@Function("user.query")
@GetMapping("/metadata")
public JsonResult<Map> usersMetedata() {
public JsonResult<List<Map<String, Object>>> usersMetedata() {
return JsonResult.success(VOUtil.resolveElColumn(CoreUserElMetadata.class));
}
@Function("user.query")
@GetMapping
public JsonResult<PageQuery<CoreUser>> users(CoreUserParam coreUserParam) {
PageQuery<CoreUser> allUsers = userConsoleService.getUsersByComplexSelect(coreUserParam);
return JsonResult.success(allUsers);
}
......@@ -66,6 +71,7 @@ public class UserConsoleElController {
@Function("user.query")
@GetMapping("/{id}")
public JsonResult<CoreUser> users(@PathVariable("id") Long id) {
CoreUser coreUser = userConsoleService.queryUserById(id);
return JsonResult.success(coreUser);
}
......@@ -73,6 +79,7 @@ public class UserConsoleElController {
@Function("user.add")
@PostMapping
public JsonResult<Long> addUser(@Validated(ValidateConfig.ADD.class) @RequestBody CoreUser user) {
if (!platformService.isAllowUserName(user.getCode())) {
return JsonResult.failMessage("不允许的注册名字 " + user.getCode());
}
......@@ -83,6 +90,7 @@ public class UserConsoleElController {
@Function("user.update")
@PutMapping
public JsonResult update(@Validated(ValidateConfig.UPDATE.class) @RequestBody CoreUser user) {
boolean success = userConsoleService.updateTemplate(user);
if (success) {
this.platformService.clearFunctionCache();
......@@ -95,28 +103,31 @@ public class UserConsoleElController {
@Function("user.delete")
@DeleteMapping
public JsonResult delete(@RequestBodyPlus("ids") Long[] ids) {
userConsoleService.batchDelSysUser(Arrays.asList(ids));
return JsonResult.success();
}
/** 用户所有授权角色列表 */
/**
* 用户所有授权角色列表
*/
@GetMapping("/roles")
@Function("user.role")
@ResponseBody
public JsonResult<List<CoreUserRole>> getRoleList(UserRoleQuery roleQuery) {
List<CoreUserRole> list = userConsoleService.getUserRoles(roleQuery);
return JsonResult.success(list);
}
/**
* 用户添加授权角色页
*
* @return
*/
@PostMapping("/roles")
@Function("user.role")
@ResponseBody
public JsonResult saveUserRole(@Validated @RequestBody CoreUserRole userRole) {
Date now = new Date();
userRole.setCreateTime(now);
this.userConsoleService.saveUserRole(userRole);
......@@ -126,13 +137,12 @@ public class UserConsoleElController {
/**
* 删除用户角色授权
*
* @return
*/
@DeleteMapping("/roles")
@Function("user.role")
@ResponseBody
public JsonResult delUserRole(@RequestBodyPlus("ids") ArrayList<Long> ids) {
userConsoleService.deleteUserRoles(ids);
this.platformService.clearFunctionCache();
return JsonResult.success();
......@@ -140,14 +150,13 @@ public class UserConsoleElController {
/**
* 管理员重置用户密码
*
* @return
*/
@PostMapping("/changePassword")
@Function("user.reset")
@ResponseBody
public JsonResult changePassword(
@RequestBodyPlus("id") Long id, @RequestBodyPlus("password") String password) {
userConsoleService.resetPassword(id, password);
return JsonResult.success();
}
......@@ -155,6 +164,7 @@ public class UserConsoleElController {
@PostMapping("/excel/export")
@Function("user.export")
public JsonResult<String> export(@RequestBody CoreUserParam coreUserParam) {
String excelTemplate = "excelTemplates/admin/user/user_collection_template.xls";
List<UserExcelExportData> users = userConsoleService.queryExcel(coreUserParam);
try (InputStream is =
......@@ -173,4 +183,5 @@ public class UserConsoleElController {
throw new PlatformException(e.getMessage());
}
}
}
......@@ -2,6 +2,7 @@ package com.ibeetl.admin.console.web.mo;
import static com.ibeetl.admin.core.util.enums.ElColumnType.DATE;
import static com.ibeetl.admin.core.util.enums.ElColumnType.DICT;
import static com.ibeetl.admin.core.util.enums.ElColumnType.OTHER;
import static com.ibeetl.admin.core.util.enums.ElColumnType.STRING;
import com.ibeetl.admin.core.annotation.ElColumn;
......@@ -9,8 +10,7 @@ import java.util.Date;
import lombok.Data;
/**
* Class CoreUserElMetadata : <br>
* 描述:用户管理页面的metadata元数据
* Class CoreUserElMetadata : <br> 描述:用户管理页面的metadata元数据
*
* @author 一日看尽长安花 Created on 2019/12/29
*/
......@@ -22,16 +22,17 @@ public class CoreUserElMetadata {
type = STRING,
isShowSearchPanel = false,
isShowTablePanel = false,
isShowEditorPanel = false)
isShowEditorPanel = false,
order = 1)
protected Long id;
@ElColumn(name = "创建时间", type = DATE, isShowEditorPanel = false)
@ElColumn(name = "创建时间", type = DATE, isShowEditorPanel = false, order = 8)
protected Date createTime;
@ElColumn(name = "用户名", type = STRING, isShowSearchPanel = false)
@ElColumn(name = "用户名", type = STRING, isShowSearchPanel = false, order = 2)
private String code;
@ElColumn(name = "姓名", type = STRING)
@ElColumn(name = "姓名", type = STRING, order = 3)
private String name;
@ElColumn(
......@@ -39,15 +40,16 @@ public class CoreUserElMetadata {
type = STRING,
jsonPath = "org.name",
isShowSearchPanel = false,
isShowEditorPanel = false)
isShowEditorPanel = false, order = 4)
private Long orgId;
@ElColumn(name = "状态", type = DICT, isShowEditorPanel = false)
@ElColumn(name = "状态", type = DICT, dictType = "user_state", isShowEditorPanel = false, order = 7)
private String state;
@ElColumn(name = "职务", type = DICT, isShowEditorPanel = false)
@ElColumn(name = "职务", type = OTHER, isShowEditorPanel = false, order = 5)
private String jobType0;
@ElColumn(name = "岗位", type = DICT, isShowEditorPanel = false)
@ElColumn(name = "岗位", type = DICT, dictType = "job_type", isShowEditorPanel = false, order = 6)
private String jobType1;
}
package com.ibeetl.admin.console.web.vo;
import com.ibeetl.admin.core.entity.ElCascaderData;
import com.ibeetl.admin.core.model.ElCascaderData;
import java.util.List;
import lombok.Data;
......
......@@ -17,15 +17,11 @@ public @interface ElColumn {
/**
* 数据表格列头显示名称
*
* @return
*/
String name();
/**
* 该列的类型。查看 {@link com.ibeetl.admin.core.util.enums.ElColumnType}
*
* @return
*/
String type();
......@@ -38,36 +34,42 @@ public @interface ElColumn {
/**
* 开启element-ui 中数据表格列的手动排序
*
* @return
*/
boolean sortable() default false;
/**
* 是否在前端页面的查询条件区显示
*
* @return
*/
boolean isShowSearchPanel() default true;
/**
* 是否在前端页面的数据表格列中显示
*
* @return
*/
boolean isShowTablePanel() default true;
/**
* 是否在前端页面的编辑窗显示
*
* @return
*/
boolean isShowEditorPanel() default true;
/**
* 是否在表单中是必填。暂时没做规则的生成功能,暂定没有
*
* @return
*/
boolean required() default false;
/**
* 序号
*/
int order() default 999;
/**
* 只有在type为dict时设置有效
*/
String dictType() default StrUtil.EMPTY;
/**
* 只有在type为dict时设置有效
*/
long dictParentId() default 0;
}
package com.ibeetl.admin.core.entity;
package com.ibeetl.admin.core.model;
import java.util.List;
import lombok.Data;
......@@ -12,5 +12,9 @@ public class ElCascaderData {
private String label;
private Object value;
private List<ElCascaderData> children;
/**
* 附加数据
*/
private Object tail;
}
package com.ibeetl.admin.core.model;
import java.util.List;
import lombok.Data;
import lombok.NoArgsConstructor;
/**
* element-ui前端树形组件的数据格式类
*/
@Data
@NoArgsConstructor
public class ElTreeData {
private Object id;
private String label;
private Object value;
private List<ElTreeData> children;
}
......@@ -2,17 +2,26 @@ package com.ibeetl.admin.core.util.enums;
import com.ibeetl.admin.core.annotation.ElColumn;
/** 注解{@link ElColumn#type()} 字段的常量值 */
/**
* 注解{@link ElColumn#type()} 字段的常量值
*/
public interface ElColumnType {
/** 前端页面输入框 */
/**
* 前端页面输入框
*/
String STRING = "string";
/**
* 不出现在搜索面板中,只出现在数据表格中。
* 建议下拉选择器通过级联选择器实现
* */
* 不出现在搜索面板中,只出现在数据表格中。 建议下拉选择器通过级联选择器实现
*/
String DICT = "dict";
/** 前端页面的日期选择器 */
/**
* 前端页面的日期选择器
*/
String DATE = "date";
String OTHER = "other";
}
package com.ibeetl.admin.core.web;
import cn.hutool.core.util.StrUtil;
import com.ibeetl.admin.core.entity.CoreDict;
import com.ibeetl.admin.core.model.ElTreeData;
import com.ibeetl.admin.core.service.CoreDictService;
import java.util.ArrayList;
import java.util.List;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
@Slf4j
@RequestMapping("**/core/dicts")
@RestController
public class CoreDictElController {
@Autowired
CoreDictService coreDictService;
@GetMapping("/getDictTree")
public JsonResult<List<ElTreeData>> getDictTree(Long parentId, String type) {
if (StrUtil.isBlank(type) && parentId == null) {
return JsonResult.failMessage("parentId and type should have at least one.");
}
List<CoreDict> childDictList = coreDictService.findChildrenNodes(parentId, type);
return JsonResult.success(coreDictToElCascaderData(childDictList));
}
/**
* .将字典树转成element树组件的格式
*
* @return List<ElCascaderData>
* @author 一日看尽长安花
*/
private List<ElTreeData> coreDictToElCascaderData(List<CoreDict> coreDicts) {
List<ElTreeData> elCascaderDatas = new ArrayList<ElTreeData>(coreDicts.size());
for (CoreDict dict : coreDicts) {
ElTreeData data = new ElTreeData();
data.setId(dict.getId());
data.setLabel(dict.getName());
data.setValue(dict.getValue());
List<ElTreeData> children = coreDictToElCascaderData(dict.getChildren());
data.setChildren(children);
elCascaderDatas.add(data);
}
return elCascaderDatas.isEmpty() ? null : elCascaderDatas;
}
}
/*
* @Author: 一日看尽长安花
* @since: 2019-09-04 20:55:14
* @LastEditTime: 2020-08-02 14:16:39
* @LastEditTime: 2020-08-16 19:23:51
* @LastEditors: 一日看尽长安花
* @Description:
*/
......@@ -22,3 +22,11 @@ export function immaditeLoadDicts(params) {
params: params
});
}
export function getDictTree(params) {
return request({
url: '/core/dicts/getDictTree',
method: 'get',
params
});
}
<!--
* @Author: 一日看尽长安花
* @since: 2019-10-12 16:14:37
* @LastEditTime: 2020-03-16 16:01:20
* @LastEditTime: 2020-08-16 16:23:52
* @LastEditors: 一日看尽长安花
* @Description:
-->
......@@ -23,8 +23,8 @@
<el-table-column :key="Math.random()" type="index"></el-table-column>
<el-table-column
v-for="(val, key) in visibleMetadata"
:key="key"
v-for="(val, idx) in visibleMetadatas"
:key="idx"
:prop="val.json_path + '$' + val.type"
:label="val.name"
:sortable="val.sortable"
......@@ -80,10 +80,10 @@ export default {
components: { Pagination },
props: {
// 表格元数据
metadata: {
type: Object,
metadatas: {
type: Array,
default() {
return {};
return [];
}
},
// 表格数据
......@@ -120,16 +120,11 @@ export default {
},
computed: {
// 计算属性的 getter
visibleMetadata: function() {
// `this` 指向 vm 实例
let _metadata = {};
for (let dict in this.metadata) {
const t = this.metadata[dict];
if (t.is_show_table_panel) {
_metadata[dict] = t;
}
}
return _metadata;
visibleMetadatas: function() {
let allowTypes = ['string', 'date', 'dict'];
return this.metadatas.filter(
(v, i) => v.is_show_table_panel && allowTypes.includes(v.type)
);
}
},
updated() {
......
<!--
* @Author: 一日看尽长安花
* @since: 2019-10-12 16:14:37
* @LastEditTime: 2020-04-10 20:47:33
* @LastEditTime: 2020-08-16 21:41:57
* @LastEditors: 一日看尽长安花
* @Description:
-->
......@@ -14,43 +14,76 @@
:model="slots.filterData"
@submit.native.prevent
>
<!-- 循环元数据构建搜索面板:除了下拉框 -->
<div
v-for="(val, key) in visibleMetadata"
:key="key"
class="filter-item-container"
<el-row
v-for="(items, idx) in visibleMetadatas"
:key="idx + 'row'"
type="flex"
justify="start"
align="bottom"
>
<el-form-item>
<el-input
v-if="judgeType(val.type, 'string')"
v-model="slots.filterData[key]"
:placeholder="val.name"
:clearable="true"
style="width: 200px;"
class="filter-item"
/>
<div
v-else-if="judgeType(val.type, 'date')"
style="display: inline-block;position: relative;top: -0.3rem;"
>
<el-date-picker
v-model="slots.filterData[key + '_start']"
type="datetime"
value-format="timestamp"
:placeholder="val.name + '开始时间'"
<el-col
v-for="(item, i) in items"
:key="i + 'col'"
:span="item.type === 'date' ? 10 : 6"
>
<el-form-item>
<el-row
v-if="judgeType(item.type, 'string')"
type="flex"
justify="start"
align="bottom"
>
</el-date-picker>
<el-date-picker
v-model="slots.filterData[key + '_end']"
type="datetime"
value-format="timestamp"
:placeholder="val.name + '结束时间'"
<el-col :span="24">
<el-input
v-model="slots.filterData[item.key]"
:placeholder="item.name"
:clearable="true"
></el-input>
</el-col>
</el-row>
<el-row
v-else-if="judgeType(item.type, 'dict')"
type="flex"
justify="start"
align="bottom"
>
</el-date-picker>
</div>
</el-form-item>
</div>
<el-col :span="24">
<sp-tree-select
v-model="treeObj[item.key + 'Value']"
:data="treeObj[item.key + 'Data']"
:props="treeObj[item.key + 'Props']"
:filterable="true"
></sp-tree-select>
</el-col>
</el-row>
<el-row
v-else-if="judgeType(item.type, 'date')"
type="flex"
justify="start"
align="bottom"
>
<el-col :span="12">
<el-date-picker
v-model="slots.filterData[item.key + '_start']"
type="datetime"
value-format="timestamp"
:placeholder="item.name + '开始时间'"
>
</el-date-picker>
</el-col>
<el-col :span="12">
<el-date-picker
v-model="slots.filterData[item.key + '_end']"
type="datetime"
value-format="timestamp"
:placeholder="item.name + '结束时间'"
>
</el-date-picker>
</el-col>
</el-row>
</el-form-item>
</el-col>
</el-row>
<!-- 用于面板中的自定义表单,例如级联选择器,并通过作用域插槽的方式将数据传递给自定义表单 -->
<slot name="filter-condition" :filter-data="slots"> </slot>
<div class="sp-search-btn-container">
......@@ -85,15 +118,19 @@
</template>
<script>
import SpTreeSelect from '@/components/Wrapper/SpTreeSelect';
import { equalsIgnoreCase } from '@/utils/str-util';
import { getDictTree } from '@/api/core_dict';
export default {
name: 'SearchPane',
components: { SpTreeSelect },
props: {
metadata: {
type: Object,
metadatas: {
type: Array,
default() {
return {};
return [];
}
}
},
......@@ -102,25 +139,78 @@ export default {
size: 'mini',
slots: {
filterData: {}
},
// 树组件的options 和props挂载对象
treeObj: {
job_type1Data: [],
stateData: []
}
};
},
computed: {
// 计算属性的 getter
visibleMetadata: function() {
visibleMetadatas: function() {
// `this` 指向 vm 实例
let _metadata = {};
let allowTypes = ['string', 'date'];
for (let dict in this.metadata) {
const t = this.metadata[dict];
if (t.is_show_search_panel && allowTypes.includes(t.type)) {
_metadata[dict] = t;
let allowTypes = ['string', 'date', 'datetime', 'dict'];
let _metadataPartition = []; //二维数组,每行对应四列
let count = 0,
tempArr = [];
for (let i = 0; i < this.metadatas.length; i++) {
const v = this.metadatas[i];
if (v.is_show_search_panel && allowTypes.includes(v.type)) {
tempArr.push(v);
count++;
if (count % 4 === 0) {
_metadataPartition.push(tempArr);
tempArr = [];
}
}
}
return _metadata;
if (tempArr.length !== 0) {
_metadataPartition.push(tempArr);
tempArr = [];
}
return _metadataPartition;
}
},
watch: {
metadatas: {
handler: function(a, b) {
// 解决数据变动监控
const _that = this;
const params = [];
_that.metadatas
.filter(
(item, i) => item.is_show_search_panel && item.type === 'dict'
)
.forEach((v, i) => {
const obj = {};
obj.key = v.key;
obj.dict_type = v.dict_type;
obj.dict_parent_id = v.dict_parent_id;
params.push(obj);
});
this.recursiveHanldTree(params, this);
},
deep: true
}
},
mounted() {},
methods: {
recursiveHanldTree(paramArr, _that) {
if (paramArr.length) {
const item = paramArr.shift();
getDictTree({
type: item.dict_type,
parent_id: item.dict_parent_id
}).then(res => {
const { code, message, data } = { ...res };
_that.treeObj[item.key + 'Data'] = data;
console.log(data);
_that.recursiveHanldTree(paramArr, _that);
});
}
},
judgeType(str1, type) {
return equalsIgnoreCase(str1, type);
},
......
<!--
* @Author: 一日看尽长安花
* @since: 2019-10-12 16:14:37
* @LastEditTime: 2020-04-16 20:45:56
* @LastEditTime: 2020-08-16 16:34:38
* @LastEditors: 一日看尽长安花
* @Description:
-->
......@@ -30,14 +30,14 @@
class="sp-form"
>
<el-form-item
v-for="(val, key) in visibleMetadata"
:key="key"
v-for="(val, idx) in visibleMetadatas"
:key="idx"
:label="val.name"
:prop="key"
:prop="val.key"
>
<el-input
v-if="judgeType(val.type, 'string')"
v-model="slots.dialogData[key]"
v-model="slots.dialogData[val.key]"
:placeholder="val.name"
:clearable="true"
class="sp-form-item"
......@@ -45,7 +45,7 @@
<el-date-picker
v-else-if="judgeType(val.type, 'date')"
v-model="slots.dialogData[key]"
v-model="slots.dialogData[val.key]"
type="datetime"
value-format="timestamp"
:placeholder="val.name + '时间'"
......@@ -79,10 +79,10 @@ import { equalsIgnoreCase } from '@/utils/str-util';
export default {
name: 'EditDialog',
props: {
metadata: {
type: Object,
metadatas: {
type: Array,
default() {
return {};
return [];
}
},
dialogData: {
......@@ -119,16 +119,11 @@ export default {
},
computed: {
// 计算属性的 getter
visibleMetadata: function() {
// `this` 指向 vm 实例
let _metadata = {};
for (let dict in this.metadata) {
const t = this.metadata[dict];
if (t.is_show_editor_panel) {
_metadata[dict] = t;
}
}
return _metadata;
visibleMetadatas: function() {
let allowTypes = ['string', 'date', 'dict'];
return this.metadatas.filter(
(v, i) => v.is_show_editor_panel && allowTypes.includes(v.type)
);
}
},
watch: {
......
<!--
* @Author: 一日看尽长安花
* @since: 2019-10-12 15:43:18
* @LastEditTime: 2020-04-11 19:55:13
* @LastEditTime: 2020-08-16 16:06:37
* @LastEditors: 一日看尽长安花
* @Description: 后台管理页面的自动生成,
* 主要暴露了分页方法、数据表格搜索方法、条件查询方法、增删改方法
......@@ -11,7 +11,7 @@
<div>
<search-pane
ref="searchPaneGP"
:metadata="metadata"
:metadatas="metadatas"
@filter-search="filterSearch"
@handle-create="handleCreate"
>
......@@ -25,7 +25,7 @@
<data-table
ref="dataTableGP"
:loading="loading"
:metadata="metadata"
:metadatas="metadatas"
:tabledata="tabledata"
:search-method="searchMethod"
@update:tabledata="$emit('update:tabledata', $event)"
......@@ -35,7 +35,7 @@
></data-table>
<detail-page
ref="detailPageGP"
:metadata="metadata"
:metadatas="metadatas"
:dialog-visible.sync="dialogVisible"
:dialog-title="dialogTitle"
:operation-type="operationType"
......@@ -62,10 +62,10 @@ export default {
components: { SearchPane, DataTable, DetailPage },
props: {
// 表格元数据
metadata: {
type: Object,
metadatas: {
type: Array,
default() {
return {};
return [];
}
},
// 表格数据
......
......@@ -51,8 +51,9 @@
class="sp-select-tag"
:title="item[selfProps.label]"
@close="tabClose(item[nodeKey])"
>{{ item[selfProps.label] }}</el-tag
>
{{ item[selfProps.label] }}
</el-tag>
</template>
<template v-else>
<el-tag
......@@ -61,14 +62,16 @@
class="sp-select-tag"
:title="collapseTagsItem[selfProps.label]"
@close="tabClose(collapseTagsItem[nodeKey])"
>{{ collapseTagsItem[selfProps.label] }}</el-tag
>
{{ collapseTagsItem[selfProps.label] }}
</el-tag>
<el-tag
v-if="selecteds.length > 1"
:size="size"
class="sp-select-tag"
>+{{ selecteds.length - 1 }}</el-tag
>
+{{ selecteds.length - 1 }}
</el-tag>
</template>
</div>
<p v-show="selecteds.length == 0" class="sp-placeholder-box">
......@@ -137,7 +140,7 @@ export default {
// 宽度
width: {
type: String,
default: 'auto'
default: '100%'
},
// 触发方式 click/focus/hover/manual
trigger: {
......@@ -165,7 +168,7 @@ export default {
},
size: {
type: String,
default: 'medium'
default: 'mini'
},
//是否展开全部
defaultExpandAll: {
......@@ -214,24 +217,26 @@ export default {
};
},
sizeClass() {
/* eslint-disable */
let size_class = 'size-medium';
switch (this.size) {
case 'medium':
size_class = 'size-medium';
break;
case 'small':
size_class = 'size-small';
break;
case 'default':
size_class = 'size-default';
break;
case 'mini':
size_class = 'size-mini';
break;
default:
size_class = 'size-medium';
break;
case 'medium':
size_class = 'size-medium';
break;
case 'small':
size_class = 'size-small';
break;
case 'default':
size_class = 'size-default';
break;
case 'mini':
size_class = 'size-mini';
break;
default:
size_class = 'size-medium';
break;
}
return size_class;
},
// 开启collapseTags时首个选中值
......@@ -246,6 +251,12 @@ export default {
// 树节点搜索
filterText(val) {
this.$refs['tree-select'].filter(val);
},
data: {
handler: function(a, b) {
// 解决数据变动监控
},
deep: true
}
},
created() {
......
<!--
* @Author: 一日看尽长安花
* @since: 2020-07-12 16:32:51
* @LastEditTime: 2020-07-26 17:18:21
* @LastEditTime: 2020-08-16 12:36:24
* @LastEditors: 一日看尽长安花
* @Description:
-->
......@@ -9,30 +9,50 @@
<div class="sp-view-page">
<div class="sp-search-inline-pane">
<el-form :inline="true" :model="searchData">
<el-form-item label="字典值">
<el-input
v-model="searchData.value"
placeholder="请输入字典值"
></el-input>
</el-form-item>
<el-form-item label="字典名称">
<el-input
v-model="searchData.name"
placeholder="请输入字典名称"
></el-input>
</el-form-item>
<el-form-item label="字典类型">
<el-input
v-model="searchData.typeName"
placeholder="请输入字典类型"
></el-input>
</el-form-item>
<el-form-item label="上级字典">
<el-input
v-model.number="searchData.parent"
placeholder="请输入上级字典"
></el-input>
</el-form-item>
<el-row type="flex" justify="space-between" align="middle">
<el-col>
<el-form-item label="字典值">
<el-input v-model="searchData.value" placeholder="请输入字典值">
</el-input>
</el-form-item>
</el-col>
<el-col>
<el-form-item label="字典名称">
<el-input v-model="searchData.name" placeholder="请输入字典名称">
</el-input>
</el-form-item>
</el-col>
<el-col>
<el-form-item label="字典类型">
<el-input
v-model="searchData.typeName"
placeholder="请输入字典类型"
>
</el-input>
</el-form-item>
</el-col>
<el-col>
<el-form-item label="上级字典">
<el-input
v-model.number="searchData.parent"
placeholder="请输入上级字典"
>
</el-input>
</el-form-item>
</el-col>
</el-row>
<el-row type="flex" justify="space-between" align="middle">
<el-col>
<el-form-item label="测试下拉树">
<sp-tree-select
v-model="treeData.value"
:data="treeData.data"
:props="treeData.props"
:filterable="true"
></sp-tree-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<div class="sp-opr-btn-group">
......@@ -119,6 +139,7 @@
import FileUpload from '@/components/Upload/FileUpload';
import Pagination from '@/components/Pagination'; // secondary package based on el-pagination
import EditPopup from './edit_popup';
import SpTreeSelect from '@/components/Wrapper/SpTreeSelect';
import {
getDicts,
......@@ -131,7 +152,7 @@ import { download } from '@/api/core_file';
export default {
name: 'DictManager',
components: { Pagination, EditPopup, FileUpload },
components: { Pagination, EditPopup, FileUpload, SpTreeSelect },
props: {},
data() {
return {
......@@ -140,7 +161,15 @@ export default {
loading: true,
pageQuery: { page: 1, limit: 10, total: 0 },
editVisible: false,
rowData: {}
rowData: {},
treeData: {
data: [
{ id: 1, label: 'A', children: [{ id: 11, label: 'aa' }] },
{ id: 2, label: 'B', children: [{ id: 22, label: 'bb' }] }
],
props: {},
value: undefined
}
};
},
mounted() {
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment