Skip to content

X
xform
Commit 967dd880 authored by 田翔's avatar 田翔
Browse files
Options

fix: 所有形态增加隐藏条件

parent d2bd1b78
Hide whitespace changes
Inline Side-by-side
Showing with 521 additions and 81 deletions
package.json
View file @ 967dd880
{
"name": "panda-xform",
"version": "2.5.9",
"description": "2.5.9: 细节修改",
"version": "2.6.0",
"description": "2.6.0: 所有形态增加隐藏条件",
"keywords": [
"panda-xform"
],
......@@ -126,4 +126,4 @@
"publishConfig": {
"registry": "https://g.civnet.cn:4873"
}
}
}
\ No newline at end of file
src/apis/process.js
View file @ 967dd880
......@@ -22,6 +22,15 @@ export function getSelectName(nodeName) {
});
}
//字段校验
export function getFormFieldHideDtos(data) {
return request({
url: `/PandaWorkFlow/WorkFlow/BPM/CaseManage/GetFormFieldHideDtos`,
method: 'post',
data
})
}
//关联表单显示隐藏控制规则
export function ruleValidation(ruleContent) {
return request({
......@@ -79,6 +88,15 @@ export function formAutomaticComputation(data) {
})
}
//表单字段隐藏计算
export function formFieldHideComputation(data) {
return request({
url: `/PandaWorkFlow/WorkFlow/BPM/CaseManage/FormFieldHideComputation`,
method: 'post',
data
})
}
export function getGroupAndRole() {
return request({
url: `PandaOMS/OMS/CaseManage/GetGroupAndRole`,
......
src/core/FormDesigner/config/settings.js
View file @ 967dd880
......@@ -38,11 +38,6 @@ const layoutWidgets = [
width: '100%',
},
setting: {
groupBase: {
title: '基础信息',
type: 'object',
properties: {}
},
title: {
title: '展示名称',
type: 'string',
......@@ -89,9 +84,15 @@ const textWidgets = [
type: 'string',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
presetValue: {
title: '默认值',
type: 'string',
......@@ -242,8 +243,14 @@ const textWidgets = [
widget: 'Placeholder',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
presetValue: {
title: '默认值',
......@@ -354,9 +361,15 @@ const textWidgets = [
type: 'string',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
presetValue: {
title: '默认值',
type: 'string',
......@@ -461,9 +474,15 @@ const textWidgets = [
widget: 'htmlInput',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
presetValue: {
title: '默认值',
type: 'string',
......@@ -556,9 +575,15 @@ const textWidgets = [
widget: 'htmlInput',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
required: {
title: '必填',
type: 'boolean',
......@@ -577,13 +602,6 @@ const textWidgets = [
default: true,
width: '30%',
},
hidden: {
title: '隐藏',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '30%',
},
prefixion: {
title: '前缀',
type: 'string',
......@@ -662,9 +680,15 @@ const selectWidgets = [
default: '点击下拉选择内容',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
presetValue: {
title: '默认值',
type: 'string',
......@@ -858,8 +882,14 @@ const selectWidgets = [
type: 'string',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
sourceType: {
title: '来源方式',
......@@ -987,8 +1017,14 @@ const selectWidgets = [
type: 'string',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
sourceType: {
title: '来源方式',
......@@ -1119,8 +1155,14 @@ const selectWidgets = [
widget: 'BooleanSwitch',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
disabled: {
title: '只读',
......@@ -1129,13 +1171,6 @@ const selectWidgets = [
default: false,
width: '25%',
},
hidden: {
title: '隐藏',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '25%',
},
showText: {
title: '显示文字',
type: 'string',
......@@ -1144,7 +1179,7 @@ const selectWidgets = [
description: '示例(开/关)'
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
groupStyle: {
......@@ -1212,8 +1247,14 @@ const selectWidgets = [
dependencies: ['sourceType']
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
fieldParent: {
title: '父字段名',
......@@ -1243,7 +1284,7 @@ const selectWidgets = [
width: '33%',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
...groupStyle,
......@@ -1290,8 +1331,14 @@ const selectWidgets = [
widget: 'CascadeDefault',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
sourceType: {
title: '来源方式',
......@@ -1385,9 +1432,15 @@ const businessWidgets = [
type: 'string',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
role: {
title: '机构角色',
type: 'string',
......@@ -1512,8 +1565,14 @@ const businessWidgets = [
type: 'string',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
required: {
title: '必填',
......@@ -1602,9 +1661,15 @@ const businessWidgets = [
type: 'string',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
accountName: {
title: '台账名称',
name: '台账名称',
......@@ -1669,13 +1734,6 @@ const businessWidgets = [
default: false,
width: '23%',
},
hidden: {
title: '隐藏',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '23%',
},
...groupStyle,
}
}
......@@ -1716,9 +1774,15 @@ const dateWidgets = [
type: 'string',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
required: {
title: '必填',
type: 'boolean',
......@@ -1810,6 +1874,16 @@ const dateWidgets = [
title: '提示语',
type: 'string',
},
description: {
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
presetValue: {
title: '默认值',
type: 'string',
......@@ -1817,10 +1891,6 @@ const dateWidgets = [
format: '{{formData.format}}',
description: '勾选默认当前时间此处配置无效'
},
description: {
title: '说明',
type: 'string',
},
options: {
title: '选项',
type: 'string',
......@@ -1915,8 +1985,14 @@ const fileWidgets = [
type: 'string',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
fileType: {
title: '文件类型',
......@@ -2029,8 +2105,14 @@ const mapWidgets = [
type: 'string',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
currentAddress: {
title: '自动获取',
......@@ -2109,9 +2191,15 @@ const mapWidgets = [
type: 'string',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
required: {
title: '必填',
type: 'boolean',
......@@ -2183,8 +2271,14 @@ const mapWidgets = [
type: 'string',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition'
},
required: {
title: '必填',
......@@ -2258,7 +2352,7 @@ const advancedWidgets = [
default: '关联表单',
},
description: {
title: '说明',
title: '字段说明',
type: 'string',
widget: 'htmlInput',
},
......
src/core/FormRender/index.js
View file @ 967dd880
......@@ -6,7 +6,7 @@
*/
import React, { useMemo, useContext, forwardRef, useImperativeHandle, createContext, useState } from 'react'
import FormRender, { useForm } from 'form-render'
import { ConfigProvider } from 'antd'
import { ConfigProvider, Spin } from 'antd'
import widgets from '../widgets'
import { isObject } from '../../utils'
import { getWatch } from './watch'
......@@ -28,6 +28,7 @@ const XRender = (props, ref) => {
const prefixCls = getPrefixCls('pandaXform')
const pandaXform = getPrefixCls()
const [startTime, setStartTime] = useState(new Date().getTime())
const [loading, setLoading] = useState(true)
const form = useForm()
const schemaForm = useMemo(() => {
......@@ -89,24 +90,29 @@ const XRender = (props, ref) => {
//初始化时存储外部传的额外数据
const onMount = () => {
setTimeout(() => {
setLoading(false)
}, 500)
// form.setValueByPath('extraData', extraData || { codes: { '事件编号': '12312' } })
}
return (
<div className={prefixCls}>
<FormRender
configProvider={{ prefixCls: pandaXform }}
form={form}
schema={schemaForm}
mapping={{
object: 'Header',
}}
// scrollToFirstError
// removeHiddenData={false}
widgets={widgets}
watch={watch}
onMount={onMount}
/>
<Spin spinning={loading}>
<FormRender
configProvider={{ prefixCls: pandaXform }}
form={form}
schema={schemaForm}
mapping={{
object: 'Header',
}}
// scrollToFirstError
// removeHiddenData={false}
widgets={widgets}
watch={watch}
onMount={onMount}
/>
</Spin>
</div>
)
......
src/core/FormRender/watch.js
View file @ 967dd880
import { message } from 'antd'
import { isObject } from '../../utils'
import { formAutomaticComputation, GetSelectItemList } from '../../apis/process'
import { formAutomaticComputation, GetSelectItemList, formFieldHideComputation } from '../../apis/process'
export const debounce = (fn) => {
let t = null
......@@ -57,6 +57,7 @@ const getWidgetInfo = (json, widget) => {
for (let s in child) {
if (child[s].widget === widget) {
AutoCalculate.push({
gorupName: v,
fieldName: s,
...child[s],
targetPath: `${v}.${s}`,
......@@ -69,6 +70,30 @@ const getWidgetInfo = (json, widget) => {
return AutoCalculate
}
//获取含有隐藏条件形态
const getHiddenWidget = (json) => {
let HiddenWidget = []
let parent = json?.properties
if (isObject(parent)) {
for (let v in parent) {
let child = parent[v]?.properties
if (isObject(child)) {
for (let s in child) {
if (Array.isArray(child[s].hiddenRules) && child[s].hiddenRules.length) {
HiddenWidget.push({
gorupName: v,
fieldName: s,
...child[s],
targetPath: `${v}.${s}`,
})
}
}
}
}
}
return HiddenWidget
}
const getPath = (json, filed) => {
let parent = json?.properties
if (isObject(parent)) {
......@@ -96,7 +121,7 @@ const getFieldName = (configs, tableName) => {
return path
}
const automaticComputation = async (params) => {
const formAutomatic = async (params) => {
if ((new Date().getTime() - params.startTime) < 2000) return
let param = {
tableName: params.tableName,
......@@ -119,16 +144,56 @@ const automaticComputation = async (params) => {
}
}
//自动计算监听
//如果该分组下所有字段隐藏那就影隐藏分组
const getGroupHidden = (form, schema, gorupName) => {
let gorupSchema = schema?.properties?.[gorupName]?.properties || {}
let hidden = true
for (let key in gorupSchema) {
let sunSchema = form.getSchemaByPath(`${gorupName}.${key}`)
if (!sunSchema.hidden) {
hidden = false
}
}
return hidden
}
const formFieldHide = async (params) => {
let param = {
tableName: params.tableName,
filedFormulas: params.filedFormulas,
relationForm: params.relationForm,
values: jsonToValues(params.form.getValues(), params.paths).formValue
}
const { code, data } = await formFieldHideComputation(param)
if (code === 0) {
if (Array.isArray(data)) {
data.forEach(v => {
let path = getPath(params.schema, v.fieldName)
if (path) {
params?.form?.setSchemaByPath(path, { ...params?.form?.getSchemaByPath(path), hidden: v.fieldValue })
let hidden = getGroupHidden(params?.form, params.schema, params.gorupName)
params?.form?.setSchemaByPath(params.gorupName, { ...params?.form?.getSchemaByPath(params.gorupName), hidden: hidden })
}
})
}
}
}
const Automatic = debounce(formAutomatic)
const fieldHide = debounce(formFieldHide)
//自动计算监听/隐藏条件监听
const getAutoWatch = (schema, form, startTime) => {
let watch = {}
let paths = []
let { relationForm } = form?.getValues()
const configs = relationForm?.configs || []
const AutoCalculate = getWidgetInfo(schema, 'NumberInput')
const HiddenWidget = getHiddenWidget(schema)
if (Array.isArray(AutoCalculate)) {
AutoCalculate.forEach(item => {
const { fieldName, rules, calculateRule } = item
const { gorupName, fieldName, rules, calculateRule } = item
if (Array.isArray(rules)) {
rules.forEach(s => {
if (schema.tableName === s.tableName) {
......@@ -136,24 +201,48 @@ const getAutoWatch = (schema, form, startTime) => {
s.fields.forEach(v => {
let path = getPath(schema, v)
if (path) {
paths.push({ path: path, fieldName, formula: calculateRule })
paths.push({ gorupName, type: ['AutoCalculate'], path: path, fieldName, formula: calculateRule })
}
})
}
} else {
let path = getFieldName(configs, s.tableName)
if (path) {
paths.push({ path, fieldName, formula: calculateRule })
paths.push({ gorupName, type: ['AutoCalculate'], path, fieldName, formula: calculateRule })
}
}
})
}
})
}
if (Array.isArray(HiddenWidget)) {
HiddenWidget.forEach(item => {
const { gorupName, fieldName, hiddenRules, hiddenCondition } = item
if (Array.isArray(hiddenRules)) {
hiddenRules.forEach(v => {
if (Array.isArray(v.fields)) {
v.fields.forEach(s => {
let path = getPath(schema, s)
if (path) {
paths.push({
gorupName,
type: ['HiddenWidget'],
path,
fieldName,
formula: hiddenCondition
})
}
})
}
})
}
})
}
if (Array.isArray(paths)) {
paths.forEach(v => {
watch[v.path] = () => {
let params = {
...v,
tableName: schema.tableName,
filedFormulas: paths.filter(s => s.path === v.path),
form: form,
......@@ -162,7 +251,12 @@ const getAutoWatch = (schema, form, startTime) => {
schema: schema,
startTime
}
debounce(automaticComputation)(params)
if (v.type.includes('AutoCalculate')) {
Automatic(params)
}
if (v.type.includes('HiddenWidget')) {
fieldHide(params)
}
}
})
}
......@@ -177,7 +271,6 @@ const getSelectItemList = async (params) => {
let array = data.filter(v => v.nodeName === value)
console.log(data, array)
if (Array.isArray(array) && array.length) {
form.setValueByPath(targetPath, array[0].nodeValue)
}
}
......
src/core/widgets/select/SwitchSelector/index.js
View file @ 967dd880
......@@ -9,9 +9,9 @@ const SwitchSelector = (props) => {
useEffect(() => {
if (addons) {
addons.setValue(addons.dataPath, presetValue === text[0])
addons.setValue(addons.dataPath, presetValue)
} else {
onChange(presetValue === text[0])
onChange(presetValue)
}
}, [presetValue])
......@@ -23,7 +23,7 @@ const SwitchSelector = (props) => {
return (
<Switch
checked={Boolean(Number(value === text[0]))}
checked={Boolean(value === text[0])}
disabled={disabled}
checkedChildren={text[0]}
unCheckedChildren={text[1]}
......
src/core/widgets/settings/groupBase/HiddenCondition/index.js 0 → 100644
View file @ 967dd880
import React, { useState, useRef } from 'react'
import { Modal, Input, message, Dropdown, Menu, Tree } from 'antd'
import styles from './index.less'
import { ReloadTableFields, ruleValidation, getFormFieldHideDtos } from '../../../../../apis/process'
import Drag from '../../../../components/Drag'
const { TextArea } = Input
const fnList = [
{ label: '是否为工作日', value: '$fn.isWorkDay()' },
{ label: '是否为工作时间', value: '$fn.isWorkTime()' },
]
const HiddenCondition = (props) => {
const { value, onChange, addons } = props
const { tableNameParent } = addons.formData
const [visible, setVisible] = useState(false)
const [fieldList, setFieldList] = useState([])
const [rule, setRule] = useState([])
const [currentSelectId, setCurrentSelectId] = useState('')
const ruleText = useRef()
const getFieldList = async () => {
let { code, data, msg } = await ReloadTableFields({ tableName: tableNameParent })
if (code === 0) {
setFieldList([
{
title: tableNameParent,
key: tableNameParent,
children: data.root.map(v => { return { title: v.name, key: `${tableNameParent}.${v.name}` } })
}
])
} else {
message.error(msg)
}
}
const inputClick = () => {
setVisible(true)
getFieldList()
setRule(value || '')
if (value) {
setTimeout(() => {
document
.getElementById('ruleText')
.setSelectionRange(value.length, value.length)
}, 200)
}
}
const onSelect = (prop, treeNode) => {
if (!treeNode.node.children) {
insert(`{${treeNode.node.key}}`)
}
setCurrentSelectId(prop[0]);
}
const onOk = async () => {
if (rule) {
const { code, data } = await getFormFieldHideDtos({ formula: rule })
if (data) {
addons.setValue('hiddenRules', data)
onChange(rule)
setVisible(false)
} else {
addons.setValue('hiddenRules', [])
message.error('校验不通过!')
}
}
}
const onCancel = () => {
setVisible(false)
}
const insert = text => {
let ednIndex = document.getElementById('ruleText').selectionEnd
let rangeIndex = document.getElementById('ruleText').selectionStart
setRule(`${rule.slice(0, rangeIndex)}${text}${rule.slice(rangeIndex)}`)
rangeIndex += text.toString().length
ruleText.current.focus()
}
const insertFn = value => {
insert(value)
}
const fnListRender = (
<Menu>
{fnList.map(item => (
<Menu.Item key={item.value} onClick={() => insertFn(item.value)}>
{item.label}
</Menu.Item>
))}
</Menu>
)
return (
<div>
<Input
value={value}
onClick={inputClick}
/>
<Drag
title="规则配置"
visible={visible}
onOk={onOk}
width="740px"
onCancel={onCancel}
maskClosable={false}
destroyOnClose
getContainer={false}
>
{
tableNameParent ? (
<div className={styles.configContent}>
<div className={styles.leftTree}>
<Tree
blockNode
defaultExpandedKeys={[tableNameParent]}
autoExpandParent={true}
onSelect={onSelect}
selectedKeys={[currentSelectId]}
treeData={fieldList}
/>
</div>
<div className={styles.rightContent}>
<div className={styles.textAreaBox}>
<Dropdown overlay={fnListRender} placement="bottom" arrow>
<div className={styles.insertFn}>插入函数</div>
</Dropdown>
<TextArea
id="ruleText"
autoSize={{ minRows: 19, maxRows: 19 }}
value={rule}
rows={4}
ref={ruleText}
onChange={e => setRule(e.target.value)}
/>
</div>
<ul className={styles.tipBox}>
<li>
<p>请从左侧面板选择字段或选项</p>
<p>
{'支持'} <i>英文</i> {'模式下运算符（+、-、*、/、>、<、=、!=、<=、>=）'}
</p>
</li>
<li>{`示例：{表名.是否缴费} = ‘是’ and {表名.缴费金额} > 1000`}</li>
</ul>
</div>
</div>
) : null
}
</Drag>
</div>
)
}
export default HiddenCondition
src/core/widgets/settings/groupBase/HiddenCondition/index.less 0 → 100644
View file @ 967dd880
.configContent {
height: 500px;
display: flex;
.leftTree {
width: 180px;
height: 100%;
margin-right: 10px;
overflow-y: auto;
}
.rightContent {
flex: 1;
.title {
width: 100%;
background-color: #E6F3FF;
color: #1890FF;
font-size: 14px;
padding: 5px 10px;
border: 1px solid #EEF6FE;
}
.textAreaBox {
position: relative;
.insertFn {
position: absolute;
bottom: 10px;
right: 10px;
border: 1px solid #1890FF;
padding: 2px 15px;
border-radius: 5px;
z-index: 1;
cursor: pointer;
}
textArea {
max-height: 360px !important;
min-height: 360px !important;
border: 1px solid transparent;
background-color: #F0F2F6;
}
}
.tipBox {
padding-top: 12px;
padding-left: 25px;
li {
list-style: disc;
color: #AEAEAE;
}
em {
font-style: normal;
color: #1890FF;
}
i {
font-style: normal;
color: red;
}
p {
margin-bottom: 0;
color: #AEAEAE;
}
}
}
}
\ No newline at end of file
src/core/widgets/settings/groupBase/index.js
View file @ 967dd880
......@@ -6,6 +6,7 @@ import CascadeDefault from './CascadeDefault'
import DateDefault from './DateDefault'
import TimeDefault from './TimeDefault'
import WidgetType from './WidgetType'
import HiddenCondition from './HiddenCondition'
const groupBase = {
FieldNames,
......@@ -16,6 +17,7 @@ const groupBase = {
DateDefault,
TimeDefault,
WidgetType,
HiddenCondition,
}
export default groupBase
\ No newline at end of file
src/core/widgets/settings/groupSource/ControlRules/index.js
View file @ 967dd880
......@@ -61,7 +61,6 @@ const ControlRules = (props) => {
const { code, data } = await ruleValidation(rule)
if (!data) {
return message.error('校验不通过!')
}
}
onChange(rule)
......
src/main.less
View file @ 967dd880
......@@ -27,6 +27,9 @@ body #app {
}
}
}
.@{ant-prefix}-spin-spinning {
background: rgb(255, 255, 255, 0.7);
}
.@{ant-prefix}-tabs-content-holder {
height: 664px;
overflow: auto;
......
Markdown is supported
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