..
This commit is contained in:
1 parent
a395c82052
commit
a98952e534
7 files changed
+461
-2
No files matched your search
@@ -139,7 +139,7 @@ onMounted(() => {
|
||||
store.step1.remark = data.remark
|
||||
store.step1.groupId = data.groupId
|
||||
store.step1.businessKey = data.businessKey
|
||||
|
||||
// store.step1.formDetail = data.formDetail
|
||||
store.setStep2(JSON.parse(data.formItems))
|
||||
step3NodeConfig = JSON.parse(data.process)
|
||||
})
|
||||
|
||||
@@ -0,0 +1,354 @@
|
||||
import type { FormRule, DragRule } from './types';
|
||||
import other, {generateUUID} from "/@/utils/other";
|
||||
|
||||
// Create a map of rule creators
|
||||
const ruleCreators: Record<string, () => DragRule> = {
|
||||
selectUser: () => ({
|
||||
menu: 'biz',
|
||||
icon: 'icon-table-form2',
|
||||
label: '人员',
|
||||
name: 'SelectUser',
|
||||
mask: true,
|
||||
rule() {
|
||||
return {
|
||||
type: 'OrgSelector',
|
||||
field: 'SelectUser' + other.getNonDuplicateID(),
|
||||
title: '人员',
|
||||
$required: true,
|
||||
props: {
|
||||
type: 'user',
|
||||
},
|
||||
};
|
||||
},
|
||||
props() {
|
||||
return [
|
||||
{
|
||||
type: 'switch',
|
||||
title: '多选',
|
||||
field: 'multiple',
|
||||
value: true,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '禁用',
|
||||
field: 'disabled',
|
||||
value: false,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '选择自己',
|
||||
field: 'selectSelf',
|
||||
value: true,
|
||||
},
|
||||
];
|
||||
},
|
||||
}),
|
||||
selectDept: () => ({
|
||||
menu: 'biz',
|
||||
icon: 'icon-group',
|
||||
label: '部门',
|
||||
name: 'selectDept',
|
||||
mask: true,
|
||||
rule() {
|
||||
return {
|
||||
type: 'OrgSelector',
|
||||
field: 'selectDept' + other.getNonDuplicateID(),
|
||||
title: '部门',
|
||||
$required: true,
|
||||
props: {
|
||||
type: 'dept',
|
||||
},
|
||||
};
|
||||
},
|
||||
props() {
|
||||
return [
|
||||
{
|
||||
type: 'switch',
|
||||
title: '多选',
|
||||
field: 'multiple',
|
||||
value: true,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '禁用',
|
||||
field: 'disabled',
|
||||
value: false,
|
||||
}
|
||||
];
|
||||
},
|
||||
}),
|
||||
uploadFile: () => ({
|
||||
menu: 'biz',
|
||||
icon: 'icon-folder',
|
||||
label: '上传',
|
||||
name: 'UploadFile'+ other.getNonDuplicateID(),
|
||||
mask: true,
|
||||
rule() {
|
||||
return {
|
||||
type: 'UploadFile',
|
||||
field: 'UploadFile',
|
||||
title: '文件上传',
|
||||
$required: true,
|
||||
props: {},
|
||||
};
|
||||
},
|
||||
props() {
|
||||
return [
|
||||
{
|
||||
type: 'input',
|
||||
title: '上传地址',
|
||||
field: 'uploadFileUrl',
|
||||
value: '/admin/sys-file/upload',
|
||||
},
|
||||
{
|
||||
type: 'number',
|
||||
title: '数量限制',
|
||||
field: 'limit',
|
||||
value: 5,
|
||||
props: {
|
||||
min: 1,
|
||||
max: 100,
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'number',
|
||||
title: '大小限制(MB)',
|
||||
field: 'fileSize',
|
||||
value: 5,
|
||||
props: {
|
||||
min: 1,
|
||||
max: 500,
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
title: '上传类型',
|
||||
field: 'type',
|
||||
value: 'default',
|
||||
options: [
|
||||
{ label: '默认', value: 'default' },
|
||||
{ label: '简单', value: 'simple' },
|
||||
],
|
||||
},
|
||||
{
|
||||
type: 'input',
|
||||
title: '上传目录',
|
||||
field: 'dir',
|
||||
value: '',
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '自动上传',
|
||||
field: 'autoUpload',
|
||||
value: true,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '显示提示',
|
||||
field: 'isShowTip',
|
||||
value: true,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '禁用',
|
||||
field: 'disabled',
|
||||
value: false,
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
title: '文件类型',
|
||||
field: 'fileType',
|
||||
value: ['png', 'jpg', 'jpeg', 'doc', 'xls', 'ppt', 'txt', 'pdf', 'docx', 'xlsx', 'pptx'],
|
||||
props: {
|
||||
multiple: true,
|
||||
},
|
||||
options: [
|
||||
{ label: 'PNG', value: 'png' },
|
||||
{ label: 'JPG', value: 'jpg' },
|
||||
{ label: 'JPEG', value: 'jpeg' },
|
||||
{ label: 'DOC', value: 'doc' },
|
||||
{ label: 'DOCX', value: 'docx' },
|
||||
{ label: 'XLS', value: 'xls' },
|
||||
{ label: 'XLSX', value: 'xlsx' },
|
||||
{ label: 'PPT', value: 'ppt' },
|
||||
{ label: 'PPTX', value: 'pptx' },
|
||||
{ label: 'PDF', value: 'pdf' },
|
||||
{ label: 'TXT', value: 'txt' },
|
||||
],
|
||||
},
|
||||
];
|
||||
},
|
||||
}),
|
||||
chinaArea: () => ({
|
||||
menu: 'biz',
|
||||
icon: 'icon-subform',
|
||||
label: '地区选择',
|
||||
name: 'ChinaArea',
|
||||
mask: true,
|
||||
rule() {
|
||||
return {
|
||||
type: 'ChinaArea',
|
||||
field: 'ChinaArea' + other.getNonDuplicateID(),
|
||||
title: '地区选择',
|
||||
$required: true,
|
||||
props: {},
|
||||
};
|
||||
},
|
||||
props() {
|
||||
return [
|
||||
{
|
||||
type: 'number',
|
||||
title: '层级',
|
||||
field: 'type',
|
||||
value: 4,
|
||||
props: {
|
||||
min: 1,
|
||||
max: 4,
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '禁用',
|
||||
field: 'disabled',
|
||||
value: false,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '子级必选',
|
||||
field: 'plus',
|
||||
value: false,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '懒加载',
|
||||
field: 'lazy',
|
||||
value: false,
|
||||
},
|
||||
];
|
||||
},
|
||||
}),
|
||||
sign: () => ({
|
||||
menu: 'biz',
|
||||
icon: 'icon-edit',
|
||||
label: '签名',
|
||||
name: 'Sign',
|
||||
mask: true,
|
||||
rule() {
|
||||
return {
|
||||
type: 'Sign',
|
||||
field: 'Sign'+ other.getNonDuplicateID(),
|
||||
title: '签名',
|
||||
$required: true,
|
||||
props: {},
|
||||
};
|
||||
},
|
||||
props() {
|
||||
return [
|
||||
{
|
||||
type: 'number',
|
||||
title: '宽度',
|
||||
field: 'width',
|
||||
value: 300,
|
||||
props: {
|
||||
min: 100,
|
||||
max: 1000,
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'number',
|
||||
title: '高度',
|
||||
field: 'height',
|
||||
value: 150,
|
||||
props: {
|
||||
min: 50,
|
||||
max: 500,
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'number',
|
||||
title: '线宽',
|
||||
field: 'lineWidth',
|
||||
value: 4,
|
||||
props: {
|
||||
min: 1,
|
||||
max: 20,
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'colorPicker',
|
||||
title: '线条颜色',
|
||||
field: 'lineColor',
|
||||
value: '#000000',
|
||||
},
|
||||
{
|
||||
type: 'colorPicker',
|
||||
title: '背景颜色',
|
||||
field: 'bgColor',
|
||||
value: '',
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '裁剪空白',
|
||||
field: 'isCrop',
|
||||
value: false,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '清除背景',
|
||||
field: 'isClearBgColor',
|
||||
value: true,
|
||||
},
|
||||
];
|
||||
},
|
||||
}),
|
||||
dictSelect: () => ({
|
||||
menu: 'biz',
|
||||
icon: 'icon-select',
|
||||
label: '字典选择',
|
||||
name: 'DictSelect' + other.getNonDuplicateID(),
|
||||
mask: true,
|
||||
rule() {
|
||||
return {
|
||||
type: 'DictSelect',
|
||||
field: 'DictSelect',
|
||||
title: '字典',
|
||||
$required: true,
|
||||
props: {},
|
||||
};
|
||||
},
|
||||
props() {
|
||||
return [
|
||||
{
|
||||
type: 'input',
|
||||
title: '字典类型',
|
||||
field: 'dictType',
|
||||
value: '',
|
||||
props: {
|
||||
placeholder: '请输入字典类型',
|
||||
},
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '多选',
|
||||
field: 'multiple',
|
||||
value: false,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '可清除',
|
||||
field: 'clearable',
|
||||
value: true,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
title: '禁用',
|
||||
field: 'disabled',
|
||||
value: false,
|
||||
},
|
||||
];
|
||||
},
|
||||
}),
|
||||
};
|
||||
|
||||
// Export all rules as an array
|
||||
export const rules: FormRule[] = Object.values(ruleCreators).map((creator) => creator());
|
||||
@@ -19,6 +19,9 @@
|
||||
<el-form-item :label="$t('flow.businessKey')" prop="businessKey">
|
||||
<el-input v-model="form.businessKey" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('flow.formDetail')" prop="formDetail">-->
|
||||
<!-- <el-input v-model="form.formDetail" :placeholder="$t('flow.formDetailTips')" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<el-form-item :label="$t('flow.remark')" prop="remark">
|
||||
<el-input v-model="form.remark" />
|
||||
</el-form-item>
|
||||
|
||||
@@ -51,6 +51,11 @@
|
||||
{{ row.businessKey }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column prop="formDetail" :label="$t('flow.formDetail')" show-overflow-tooltip>-->
|
||||
<!-- <template #default="{ row }">-->
|
||||
<!-- {{ row.formDetail }}-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column prop="createTime" :label="$t('flow.createTime')" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="rangeShow" :label="$t('flow.scopeOfUse')" show-overflow-tooltip>
|
||||
<template #default="{ row }">
|
||||
|
||||
@@ -43,6 +43,8 @@ export default {
|
||||
defaultTip: '默认',
|
||||
servicePrefix: '服务前缀',
|
||||
servicePrefixTips: '请输入服务前缀',
|
||||
businessKey:'业务key'
|
||||
businessKey:'业务key',
|
||||
formDetail:'表单详情路由',
|
||||
formDetailTips:'请输入表单详情路由,例如 /admin/system/user/detail.vue'
|
||||
},
|
||||
};
|
||||
@@ -0,0 +1,45 @@
|
||||
<template>
|
||||
<formCreate
|
||||
:rule="rule"
|
||||
:option="options"
|
||||
:modelValue="modelValue"
|
||||
@update:modelValue="emit('update:modelValue', $event)"
|
||||
:api="api"
|
||||
@update:api="emit('update:api', $event)"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { Api, Rule } from '@form-create/element-ui';
|
||||
|
||||
interface Props {
|
||||
rule: Rule;
|
||||
modelValue: any;
|
||||
api?: Api;
|
||||
submitBtn?: boolean;
|
||||
}
|
||||
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
rule: () => [],
|
||||
modelValue: () => ({}),
|
||||
api: undefined,
|
||||
submitBtn: false,
|
||||
});
|
||||
|
||||
const emit = defineEmits(['update:modelValue', 'update:api']);
|
||||
|
||||
// Default options
|
||||
const options = computed(() => ({
|
||||
submitBtn: props.submitBtn,
|
||||
}));
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
:deep(.fc-form-row) {
|
||||
margin-top: 20px !important;
|
||||
}
|
||||
|
||||
:deep(.el-col.el-col-24.fc-form-col) {
|
||||
margin-top: 10px !important;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,50 @@
|
||||
type FormItem = {
|
||||
field: string;
|
||||
props?: Record<string, any>;
|
||||
children?: FormItem[];
|
||||
hidden?: boolean;
|
||||
[key: string]: any;
|
||||
};
|
||||
|
||||
export function applyPermissionsToItem(item: FormItem, formPerms: Record<string, string>): FormItem {
|
||||
// 如果权限为空,默认设置为只读 'R'
|
||||
const permission = formPerms?.[item.field] || 'E';
|
||||
|
||||
// 检查字段权限
|
||||
if (permission === 'R') {
|
||||
return {
|
||||
...item,
|
||||
props: {
|
||||
...(item.props || {}),
|
||||
disabled: true,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
if (permission === 'H') {
|
||||
return {
|
||||
...item,
|
||||
hidden: true,
|
||||
};
|
||||
}
|
||||
|
||||
// 如果是 'E' 或其他情况,返回原始item
|
||||
return item;
|
||||
}
|
||||
|
||||
export function processFormItemsWithPerms(items: FormItem[], formPerms: Record<string, string>): FormItem[] {
|
||||
return items.map((item) => {
|
||||
// 处理当前项的权限
|
||||
const processedItem = applyPermissionsToItem(item, formPerms);
|
||||
|
||||
// 如果有子项,递归处理子项的权限
|
||||
if (Array.isArray(item.children)) {
|
||||
return {
|
||||
...processedItem,
|
||||
children: processFormItemsWithPerms(item.children, formPerms),
|
||||
};
|
||||
}
|
||||
|
||||
return processedItem;
|
||||
});
|
||||
}
|
||||
Reference in new issue
Block a user