修改卡片列表样式.
This commit is contained in:
@@ -7,29 +7,26 @@ package com.orion.ops.framework.common.constant;
|
||||
* @version 1.0.0
|
||||
* @since 2023/6/23 18:49
|
||||
*/
|
||||
public class Const implements com.orion.lang.constant.Const {
|
||||
public interface Const extends com.orion.lang.constant.Const, ConstField {
|
||||
|
||||
private Const() {
|
||||
}
|
||||
Integer NOT_DELETE = 0;
|
||||
|
||||
public static final Integer NOT_DELETE = 0;
|
||||
Integer IS_DELETED = 1;
|
||||
|
||||
public static final Integer IS_DELETED = 1;
|
||||
int BEARER_PREFIX_LEN = 7;
|
||||
|
||||
public static final int BEARER_PREFIX_LEN = 7;
|
||||
int MD5_LEN = 32;
|
||||
|
||||
public static final int MD5_LEN = 32;
|
||||
String UNKNOWN = "未知";
|
||||
|
||||
public static final String UNKNOWN = "未知";
|
||||
String INTRANET_IP = "内网IP";
|
||||
|
||||
public static final String INTRANET_IP = "内网IP";
|
||||
Long ROOT_MENU_ID = 0L;
|
||||
|
||||
public static final Long ROOT_MENU_ID = 0L;
|
||||
Integer DEFAULT_SORT = 10;
|
||||
|
||||
public static final Integer DEFAULT_SORT = 10;
|
||||
Long NONE_ID = -1L;
|
||||
|
||||
public static final Long NONE_ID = -1L;
|
||||
|
||||
public static final Integer DEFAULT_VERSION = 1;
|
||||
Integer DEFAULT_VERSION = 1;
|
||||
|
||||
}
|
||||
|
||||
@@ -0,0 +1,34 @@
|
||||
package com.orion.ops.framework.common.constant;
|
||||
|
||||
/**
|
||||
* 字段常量
|
||||
*
|
||||
* @author Jiahang Li
|
||||
* @version 1.0.0
|
||||
* @since 2023/10/17 12:44
|
||||
*/
|
||||
public interface ConstField {
|
||||
|
||||
String ID = "id";
|
||||
|
||||
String KEY = "key";
|
||||
|
||||
String CODE = "code";
|
||||
|
||||
String NAME = "name";
|
||||
|
||||
String TITLE = "title";
|
||||
|
||||
String VALUE = "value";
|
||||
|
||||
String LABEL = "label";
|
||||
|
||||
String TYPE = "type";
|
||||
|
||||
String COLOR = "color";
|
||||
|
||||
String STATUS = "status";
|
||||
|
||||
String REL_ID = "relId";
|
||||
|
||||
}
|
||||
@@ -1,5 +1,7 @@
|
||||
package com.orion.ops.framework.biz.operator.log.core.constant;
|
||||
|
||||
import com.orion.ops.framework.common.constant.ConstField;
|
||||
|
||||
/**
|
||||
* 操作日志常量
|
||||
*
|
||||
@@ -7,32 +9,12 @@ package com.orion.ops.framework.biz.operator.log.core.constant;
|
||||
* @version 1.0.0
|
||||
* @since 2023/10/10 19:00
|
||||
*/
|
||||
public interface OperatorLogKeys {
|
||||
|
||||
String ID = "id";
|
||||
public interface OperatorLogKeys extends ConstField {
|
||||
|
||||
String ID_LIST = "idList";
|
||||
|
||||
String KEY = "key";
|
||||
|
||||
String CODE = "code";
|
||||
|
||||
String NAME = "name";
|
||||
|
||||
String USERNAME = "username";
|
||||
|
||||
String TITLE = "title";
|
||||
|
||||
String VALUE = "value";
|
||||
|
||||
String LABEL = "label";
|
||||
|
||||
String TYPE = "type";
|
||||
|
||||
String STATUS = "status";
|
||||
|
||||
String STATUS_NAME = "statusName";
|
||||
|
||||
String REL_ID = "relId";
|
||||
|
||||
}
|
||||
|
||||
@@ -65,16 +65,17 @@ public class CodeGenerator {
|
||||
.build(),
|
||||
Template.create("dict_key", "字典配置项", "dict")
|
||||
.cache("dict:keys", "字典配置项")
|
||||
.expire(1, TimeUnit.HOURS)
|
||||
.expire(1, TimeUnit.DAYS)
|
||||
.vue("system", "dict-key")
|
||||
.enums("value_type")
|
||||
.names("STRING", "NUMBER", "BOOLEAN", "COLOR")
|
||||
.label("字符串", "数值", "布尔值", "颜色")
|
||||
.names("STRING", "INTEGER", "DECIMAL", "BOOLEAN", "COLOR")
|
||||
.label("字符串", "整数", "小数", "布尔值", "颜色")
|
||||
.build(),
|
||||
Template.create("dict_value", "字典配置值", "dict")
|
||||
.cache("dict:value:{}", "字典配置值 ${key}")
|
||||
.expire(1, TimeUnit.HOURS)
|
||||
.expire(1, TimeUnit.DAYS)
|
||||
.vue("system", "dict-value")
|
||||
.enableRowSelection()
|
||||
.build(),
|
||||
};
|
||||
// jdbc 配置 - 使用配置文件
|
||||
|
||||
@@ -9,6 +9,7 @@ import com.orion.lang.utils.ansi.style.AnsiFont;
|
||||
import com.orion.lang.utils.ansi.style.color.AnsiForeground;
|
||||
import com.orion.lang.utils.awt.Clipboards;
|
||||
import com.orion.lang.utils.reflect.Fields;
|
||||
import com.orion.ops.framework.common.constant.Const;
|
||||
import com.orion.ops.module.infra.enums.UserStatusEnum;
|
||||
|
||||
import java.util.List;
|
||||
@@ -47,8 +48,8 @@ public class EnumGenerator {
|
||||
MultiLinkedHashMap<String, String, Object> result = MultiLinkedHashMap.create();
|
||||
for (Enum<?> e : constants) {
|
||||
String name = e.name();
|
||||
result.put(name, "value", valueFunction.apply((E) e));
|
||||
result.put(name, "label", labelFunction.apply((E) e));
|
||||
result.put(name, Const.VALUE, valueFunction.apply((E) e));
|
||||
result.put(name, Const.LABEL, labelFunction.apply((E) e));
|
||||
for (String field : fields) {
|
||||
result.put(name, field, Fields.getFieldValue(e, field));
|
||||
}
|
||||
|
||||
@@ -466,9 +466,9 @@ public class VelocityTemplateEngine extends AbstractTemplateEngine {
|
||||
enumInfo.put(name, field, value);
|
||||
}
|
||||
// 检查是否有 value
|
||||
if (!meta.getFields().contains("value")) {
|
||||
if (!meta.getFields().contains(Const.VALUE)) {
|
||||
// 没有 value 用 name
|
||||
enumInfo.put(name, "value", name);
|
||||
enumInfo.put(name, Const.VALUE, name);
|
||||
}
|
||||
}
|
||||
enumMap.put(tableField.getPropertyName(), new EnumMeta(meta.getClassName(), meta.getComment(), enumInfo));
|
||||
|
||||
@@ -3,6 +3,7 @@ package com.orion.ops.launch.generator.template;
|
||||
import com.orion.lang.utils.Enums;
|
||||
import com.orion.lang.utils.collect.Lists;
|
||||
import com.orion.lang.utils.reflect.Fields;
|
||||
import com.orion.ops.framework.common.constant.Const;
|
||||
|
||||
import java.util.List;
|
||||
import java.util.stream.Collectors;
|
||||
@@ -113,7 +114,7 @@ public class EnumsTemplate extends VueTemplate {
|
||||
* @return this
|
||||
*/
|
||||
public EnumsTemplate label(Object... labels) {
|
||||
return this.values("label", labels);
|
||||
return this.values(Const.LABEL, labels);
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -124,7 +125,7 @@ public class EnumsTemplate extends VueTemplate {
|
||||
* @return this
|
||||
*/
|
||||
public EnumsTemplate value(Object... values) {
|
||||
return this.values("value", values);
|
||||
return this.values(Const.VALUE, values);
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -134,7 +135,7 @@ public class EnumsTemplate extends VueTemplate {
|
||||
* @return this
|
||||
*/
|
||||
public EnumsTemplate color(Object... colors) {
|
||||
return this.values("color", colors);
|
||||
return this.values(Const.COLOR, colors);
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -144,7 +145,7 @@ public class EnumsTemplate extends VueTemplate {
|
||||
* @return this
|
||||
*/
|
||||
public EnumsTemplate status(Object... status) {
|
||||
return this.values("status", status);
|
||||
return this.values(Const.STATUS, status);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -2,7 +2,6 @@
|
||||
<card-list v-model:searchValue="formModel.searchValue"
|
||||
search-input-placeholder="输入xxx"
|
||||
create-card-position="head"
|
||||
:card-height="172"
|
||||
:loading="loading"
|
||||
:fieldConfig="fieldConfig"
|
||||
:list="list"
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<a-drawer :visible="visible"
|
||||
<a-drawer v-model:visible="visible"
|
||||
:title="title"
|
||||
:width="430"
|
||||
:mask-closable="false"
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<a-modal :visible="visible"
|
||||
<a-modal v-model:visible="visible"
|
||||
body-class="modal-form"
|
||||
title-align="start"
|
||||
:title="title"
|
||||
|
||||
@@ -67,7 +67,26 @@
|
||||
}
|
||||
|
||||
.card-list-item {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-radius: 4px;
|
||||
border: 1px solid var(--color-neutral-3);
|
||||
transition-property: all;
|
||||
|
||||
& > .arco-card-header {
|
||||
padding: 16px 16px 8px 16px;
|
||||
border: none;
|
||||
|
||||
.arco-card-header-title {
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
& > .arco-card-body {
|
||||
padding: 0 16px 16px 16px;
|
||||
flex-grow: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.card-list-item:hover {
|
||||
|
||||
@@ -98,7 +98,8 @@
|
||||
<a-spin class="card-list-layout-body" :loading="loading">
|
||||
<!-- 卡片列表 -->
|
||||
<a-row v-if="list.length !== 0"
|
||||
:gutter="cardLayoutGutter">
|
||||
:gutter="cardLayoutGutter"
|
||||
align="stretch">
|
||||
<!-- 添加卡片 -->
|
||||
<a-col v-permission="addPermission"
|
||||
v-if="createCardPosition === 'head'"
|
||||
@@ -118,18 +119,17 @@
|
||||
<a-dropdown trigger="contextMenu" alignPoint>
|
||||
<!-- 卡片 -->
|
||||
<a-card :class="[
|
||||
'general-card',
|
||||
'card-list-item',
|
||||
item.disabled === true ? 'card-list-item-disabled' : undefined,
|
||||
!!cardClass ? cardClass : undefined
|
||||
]"
|
||||
:style="{ height: `${cardHeight}px` }"
|
||||
:body-style="{ height: 'calc(100% - 58px)' }"
|
||||
'card-list-item',
|
||||
item.disabled === true ? 'card-list-item-disabled' : undefined,
|
||||
!!cardClass ? cardClass : undefined
|
||||
]"
|
||||
:style="{ height: cardHeight }"
|
||||
:bordered="false"
|
||||
:hoverable="true"
|
||||
:body-style="cardBodyStyle"
|
||||
@contextmenu.prevent="() => false"
|
||||
@click="emits('click',item, index)"
|
||||
@dblclick="emits('dblclick',item, index)">
|
||||
@click="emits('click', item, index)"
|
||||
@dblclick="emits('dblclick', item, index)">
|
||||
<!-- 标题 -->
|
||||
<template #title>
|
||||
<slot name="title" :record="item" :index="index" :key="item[key]" />
|
||||
@@ -188,6 +188,8 @@
|
||||
<template v-else>
|
||||
<slot name="card" :record="item" :index="index" :key="item[key]" />
|
||||
</template>
|
||||
<!-- 卡片底部 -->
|
||||
<slot name="cardFooter" :record="item" :index="index" :key="item[key]" />
|
||||
</a-card>
|
||||
<!-- 右键菜单 -->
|
||||
<template v-if="contextMenu" #content>
|
||||
@@ -206,9 +208,7 @@
|
||||
</a-row>
|
||||
<!-- 空列表 -->
|
||||
<template v-else>
|
||||
<a-card class="general-card empty-list-card"
|
||||
:style="{ height: `${cardHeight * 2 + 16}px` }"
|
||||
:body-style="{ height: '100%' }">
|
||||
<a-card class="general-card empty-list-card">
|
||||
<a-empty class="empty-list-card-body" description="暂无数据" />
|
||||
</a-card>
|
||||
</template>
|
||||
@@ -272,8 +272,12 @@
|
||||
type: Object as PropType<CardFieldConfig>,
|
||||
default: () => []
|
||||
},
|
||||
cardHeight: Number,
|
||||
cardHeight: {
|
||||
type: String,
|
||||
default: () => '100%'
|
||||
},
|
||||
cardClass: String,
|
||||
cardBodyStyle: Object,
|
||||
contextMenu: {
|
||||
type: Boolean,
|
||||
default: () => true
|
||||
@@ -297,7 +301,11 @@
|
||||
},
|
||||
createCardPosition: {
|
||||
type: String as PropType<CardPosition>,
|
||||
default: () => '暂无数据 点击此处进行创建'
|
||||
default: () => false
|
||||
},
|
||||
addPermission: {
|
||||
type: Array as PropType<String[]>,
|
||||
default: () => []
|
||||
},
|
||||
cardLayoutGutter: {
|
||||
type: [Number, Array] as PropType<Number> |
|
||||
@@ -306,10 +314,6 @@
|
||||
PropType<Array<ResponsiveValue>>,
|
||||
default: () => [16, 16]
|
||||
},
|
||||
addPermission: {
|
||||
type: Array as PropType<String[]>,
|
||||
default: () => []
|
||||
},
|
||||
cardLayoutCols: {
|
||||
type: Object as PropType<ColResponsiveValue>,
|
||||
default: () => {
|
||||
@@ -336,8 +340,8 @@
|
||||
setup(props: { cardHeight: any; createCardDescription: any; }) {
|
||||
return () => {
|
||||
return h(compile(`
|
||||
<a-card class="general-card card-list-item create-card"
|
||||
:style="{ height: '${props.cardHeight}px' }"
|
||||
<a-card class="card-list-item create-card"
|
||||
:style="{ height: '${props.cardHeight}' }"
|
||||
:body-style="{ height: '100%' }"
|
||||
:bordered="false"
|
||||
:hoverable="true">
|
||||
@@ -480,32 +484,29 @@
|
||||
.empty-list-card {
|
||||
|
||||
&-body {
|
||||
height: 100%;
|
||||
height: calc(100vh - @top-height - 140px);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.fields-container {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
|
||||
.field-label {
|
||||
color: var(--color-text-3);
|
||||
word-break: break-all;
|
||||
white-space: pre-wrap;
|
||||
padding-right: 8px;
|
||||
font-size: 14px;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.field-value {
|
||||
color: var(--color-text-1);
|
||||
color: var(--gray-8);
|
||||
word-break: break-all;
|
||||
white-space: pre-wrap;
|
||||
padding-right: 8px;
|
||||
|
||||
@@ -6,9 +6,9 @@
|
||||
</template>
|
||||
</a-button>
|
||||
</div>
|
||||
<a-drawer title="偏好设置"
|
||||
<a-drawer v-model:visible="visible"
|
||||
title="偏好设置"
|
||||
:width="300"
|
||||
:visible="visible"
|
||||
:footer="false"
|
||||
:unmount-on-close="true"
|
||||
@cancel="() => setVisible(false)">
|
||||
|
||||
@@ -1,8 +1,7 @@
|
||||
<template>
|
||||
<card-list v-model:searchValue="formModel.searchValue"
|
||||
search-input-placeholder="输入id/名称/用户名"
|
||||
search-input-placeholder="输入 id / 名称 / 用户名"
|
||||
create-card-position="head"
|
||||
:card-height="184"
|
||||
:loading="loading"
|
||||
:fieldConfig="fieldConfig"
|
||||
:list="list"
|
||||
|
||||
@@ -1,8 +1,7 @@
|
||||
<template>
|
||||
<card-list v-model:searchValue="formModel.searchValue"
|
||||
search-input-placeholder="输入id/名称"
|
||||
search-input-placeholder="输入 id / 名称"
|
||||
create-card-position="head"
|
||||
:card-height="148"
|
||||
:loading="loading"
|
||||
:fieldConfig="fieldConfig"
|
||||
:list="list"
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<a-drawer class="drawer-body-padding-0"
|
||||
:visible="visible"
|
||||
<a-drawer v-model:visible="visible"
|
||||
class="drawer-body-padding-0"
|
||||
:title="title"
|
||||
:width="470"
|
||||
:mask-closable="false"
|
||||
|
||||
@@ -1,8 +1,7 @@
|
||||
<template>
|
||||
<card-list v-model:searchValue="formModel.searchValue"
|
||||
search-input-placeholder="输入id/名称/标签/地址"
|
||||
search-input-placeholder="输入 id / 名称 / 编码 / 地址"
|
||||
create-card-position="head"
|
||||
:card-height="214"
|
||||
:loading="loading"
|
||||
:fieldConfig="fieldConfig"
|
||||
:list="list"
|
||||
@@ -32,7 +31,7 @@
|
||||
</template>
|
||||
<!-- 标签 -->
|
||||
<template #tags="{ record }">
|
||||
<a-space v-if="record.tags" wrap>
|
||||
<a-space v-if="record.tags" wrap style="margin-bottom: -8px;">
|
||||
<a-tag v-for="tag in record.tags"
|
||||
:key="tag.id"
|
||||
:color="dataColor(tag.name, tagColor)">
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<a-drawer class="drawer-body-padding-0"
|
||||
<a-drawer v-model:visible="visible"
|
||||
class="drawer-body-padding-0"
|
||||
:width="420"
|
||||
:visible="visible"
|
||||
:esc-to-close="false"
|
||||
:mask-closable="false"
|
||||
:unmount-on-close="true"
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import { CardField, CardFieldConfig } from '@/types/card';
|
||||
|
||||
const fieldConfig = {
|
||||
rowGap: '12px',
|
||||
rowGap: '10px',
|
||||
labelSpan: 8,
|
||||
minHeight: '24px',
|
||||
minHeight: '22px',
|
||||
fields: [
|
||||
{
|
||||
label: 'id',
|
||||
|
||||
Reference in New Issue
Block a user