Skip to content

X
xform
Commit 651b6107 authored by 田翔's avatar 田翔
Browse files
Options

增加表数据以及下拉框数据来源

parent 867b4236
Show whitespace changes
Inline Side-by-side
Showing with 213 additions and 1041 deletions
package.json
View file @ 651b6107
{ {
"name": "panda-xform", "name": "panda-xform",
"version": "1.4.7", "version": "1.4.8",
"description": "1.4.7: 增加人员选择器", "description": "1.4.8: 增加表数据以及下拉框数据来源",
"keywords": [ "keywords": [
"panda-xform" "panda-xform"
], ],
......
src/apis/process.js
View file @ 651b6107
...@@ -31,9 +31,9 @@ export function getSelectChildName(nodeName) { ...@@ -31,9 +31,9 @@ export function getSelectChildName(nodeName) {
} }
// 站点选择器查询 // 站点选择器查询
export function getStationListByUserID(id, sysType, isAll) { export function getStationListByUserID(id, isAll) {
return request({ return request({
url: `/PandaWorkFlow/WorkFlow/WorkFlow/GetStationListByUserID?userID=${id}${!NOTHING.includes(sysType) ? '&sysType=' + sysType : ''}${!NOTHING.includes(sysType) ? '&isAll=' + isAll : ''}`, url: `/PandaWorkFlow/WorkFlow/WorkFlow/GetStationListByUserID?userID=${id}${'&isAll=' + isAll}`,
method: 'get', method: 'get',
}); });
} }
......
src/core/FormDesigner/config/settings.js
View file @ 651b6107
...@@ -607,7 +607,6 @@ const selectWidgets = [ ...@@ -607,7 +607,6 @@ const selectWidgets = [
name: '下拉框', name: '下拉框',
type: 'string', type: 'string',
widget: 'ComboBox', widget: 'ComboBox',
require: true,
}, },
setting: { setting: {
groupBase: { groupBase: {
...@@ -635,7 +634,7 @@ const selectWidgets = [ ...@@ -635,7 +634,7 @@ const selectWidgets = [
placeholder: { placeholder: {
title: '提示语', title: '提示语',
type: 'string', type: 'string',
// widget: 'Placeholder', default: '点击下拉选择内容',
displayType: 'row', displayType: 'row',
labelWidth: 80, labelWidth: 80,
}, },
...@@ -656,8 +655,8 @@ const selectWidgets = [ ...@@ -656,8 +655,8 @@ const selectWidgets = [
type: 'string', type: 'string',
widget: 'select', widget: 'select',
default: '手动输入', default: '手动输入',
enum: ['手动输入', '数据字典', '表数据'], enum: ['手动输入', '数据字典', '表数据', '站点'],
enumNames: ['手动输入', '数据字典', '表数据'], enumNames: ['手动输入', '数据字典', '表数据', '站点'],
displayType: 'row', displayType: 'row',
labelWidth: 80, labelWidth: 80,
}, },
...@@ -706,47 +705,40 @@ const selectWidgets = [ ...@@ -706,47 +705,40 @@ const selectWidgets = [
labelWidth: 80, labelWidth: 80,
}, },
tableName: { tableName: {
title: '{{formData.soruceType}}', title: '表名',
name: '{{formData.soruceType}}', name: '表名',
// required: true, required: true,
hidden: '{{formData.soruceType !== "表数据"}}', hidden: '{{formData.soruceType !== "表数据"}}',
type: 'object', type: 'string',
// widget: 'TableName', // widget: 'TableName',
displayType: 'row', displayType: 'row',
labelWidth: 80, labelWidth: 80,
properties: {
label: {
title: '选项值',
type: 'string',
displayType: 'row',
labelWidth: 75,
widget: 'TableName',
// required: true,
default: '',
props: {
style: {
width: '120px',
color: 'blue'
}
}
}, },
value: { fieldName: {
title: '选项值', title: '字段名',
name: '字段名',
required: true,
hidden: '{{formData.soruceType !== "表数据"}}',
type: 'string', type: 'string',
// widget: 'TableName',
displayType: 'row', displayType: 'row',
labelWidth: 75, labelWidth: 80,
widget: 'TableName', },
// required: true, isMySite: {
default: '', title: '仅显示本人所属的站点',
name: '仅显示本人所属的站点',
required: true,
default: false,
// description: '勾选后仅显示本人所属的站点',
hidden: '{{formData.soruceType !== "站点"}}',
type: 'boolean',
widget: 'checkbox',
props: { props: {
style: { style: {
width: '120px', paddingLeft: '10px'
color: 'blue'
} }
} }
}, },
},
},
groupVerify: { groupVerify: {
title: '数据校验', title: '数据校验',
type: 'object', type: 'object',
...@@ -905,7 +897,7 @@ const selectWidgets = [ ...@@ -905,7 +897,7 @@ const selectWidgets = [
default: '', default: '',
props: { props: {
style: { style: {
width: '100px', width: '120px',
color: 'blue' color: 'blue'
} }
} }
...@@ -914,7 +906,7 @@ const selectWidgets = [ ...@@ -914,7 +906,7 @@ const selectWidgets = [
}, },
props: { props: {
// hideMove: true, // hideMove: true,
// hideCopy: true, hideCopy: true,
}, },
displayType: 'row', displayType: 'row',
labelWidth: 80, labelWidth: 80,
...@@ -1363,7 +1355,7 @@ const selectWidgets = [ ...@@ -1363,7 +1355,7 @@ const selectWidgets = [
type: 'string', type: 'string',
displayType: 'row', displayType: 'row',
labelWidth: 80, labelWidth: 80,
required: "{{formData.interactiveType === '下拉框'}}", // required: "{{formData.interactiveType === '下拉框'}}",
}, },
groupSetting: { groupSetting: {
title: '控件设置', title: '控件设置',
...@@ -1429,6 +1421,107 @@ const selectWidgets = [ ...@@ -1429,6 +1421,107 @@ const selectWidgets = [
}, },
} }
}, },
{
text: '部门选择器',
name: '部门选择器',
schema: {
title: '部门选择器',
name: '部门选择器',
type: 'string',
widget: 'DeptSelector',
},
setting: {
groupBase: {
title: '基础信息',
type: 'object',
collapsed: true,
properties: {}
},
$id: {
title: '字段名称',
type: 'string',
widget: 'FieldNames',
required: true,
displayType: 'row',
labelWidth: 80,
},
title: {
title: '标题',
required: true,
type: 'string',
widget: 'htmlInput',
displayType: 'row',
labelWidth: 80,
},
placeholder: {
title: '提示语',
type: 'string',
default: '点击选择部门',
displayType: 'row',
labelWidth: 80,
},
presetValue: {
title: '默认值',
type: 'string',
displayType: 'row',
labelWidth: 80,
},
groupSetting: {
title: '控件设置',
type: 'object',
properties: {}
},
disabled: {
title: '只读',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '25%',
},
hidden: {
title: '隐藏',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '25%',
},
emphasis: {
title: '强调',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '25%',
},
isMultiple: {
title: '多选',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '25%',
},
groupStyle: {
title: '控件样式',
type: 'object',
properties: {}
},
width: {
title: '元素宽度',
type: 'string',
widget: 'percentSlider',
},
labelWidth: {
title: '标签宽度',
description: '默认值110',
default: 110,
type: 'number',
widget: 'slider',
max: 400,
props: {
hideNumber: true,
},
},
}
},
{ {
text: '台账选择器', text: '台账选择器',
name: '台账选择器', name: '台账选择器',
...@@ -1465,7 +1558,7 @@ const selectWidgets = [ ...@@ -1465,7 +1558,7 @@ const selectWidgets = [
placeholder: { placeholder: {
title: '提示语', title: '提示语',
type: 'string', type: 'string',
// widget: 'Placeholder', default: '点击输入框弹出选择框',
displayType: 'row', displayType: 'row',
labelWidth: 80, labelWidth: 80,
}, },
......
src/core/widgets/select/AccountSelector/index.js
View file @ 651b6107
...@@ -7,9 +7,9 @@ import { isJson } from '../../../../utils' ...@@ -7,9 +7,9 @@ import { isJson } from '../../../../utils'
const AccountSelector = (props) => { const AccountSelector = (props) => {
const userID = window?.globalConfig?.userInfo?.OID const userID = window?.globalConfig?.userInfo?.OID || 1
const { value, onChange, schema, addons } = props const { value, onChange, schema, addons } = props
const { disabled, config, fieldName, accountName, fieldshine, siteJurisdiction, sql, isMultiple, presetValue } = schema const { disabled, accountName, fieldshine, siteJurisdiction, sql, isMultiple, presetValue, placeholder } = schema
const [params, setParams] = useState({ info: '', total: 0, pageIndex: 1, pageSize: 20 }) const [params, setParams] = useState({ info: '', total: 0, pageIndex: 1, pageSize: 20 })
const [loading, setLoading] = useState(false) const [loading, setLoading] = useState(false)
...@@ -152,6 +152,7 @@ const AccountSelector = (props) => { ...@@ -152,6 +152,7 @@ const AccountSelector = (props) => {
return ( return (
<div className={styles.AccountSelector}> <div className={styles.AccountSelector}>
<Input <Input
placeholder={placeholder}
value={value} value={value}
onClick={() => iconClick()} onClick={() => iconClick()}
addonAfter={!disabled ? addonAfter : null} addonAfter={!disabled ? addonAfter : null}
......
src/core/widgets/select/CheckBox/index.js
View file @ 651b6107
...@@ -4,9 +4,8 @@ import { GetSelectItemList } from '../../../../apis/process' ...@@ -4,9 +4,8 @@ import { GetSelectItemList } from '../../../../apis/process'
const CheckBox = (props) => { const CheckBox = (props) => {
const { value, onChange, schema } = props const { value, onChange, schema, addons } = props
const { presetValue, disabled, soruceType, options, dictionary } = schema const { presetValue, disabled, soruceType, options, dictionary } = schema
const [dictionaryList, setDictionaryList] = useState([]) const [dictionaryList, setDictionaryList] = useState([])
const enums = useMemo(() => { const enums = useMemo(() => {
...@@ -21,7 +20,9 @@ const CheckBox = (props) => { ...@@ -21,7 +20,9 @@ const CheckBox = (props) => {
}, [soruceType, options, dictionaryList]) }, [soruceType, options, dictionaryList])
useEffect(() => { useEffect(() => {
onChange(presetValue ? presetValue.split(',') : []) if (addons) {
addons.setValue(addons.dataPath, presetValue)
}
}, [presetValue]) }, [presetValue])
const onFocus = async () => { const onFocus = async () => {
...@@ -31,6 +32,12 @@ const CheckBox = (props) => { ...@@ -31,6 +32,12 @@ const CheckBox = (props) => {
} }
} }
const checkChange = (value) => {
if (addons) {
addons.setValue(addons.dataPath, value.join(','))
}
}
useEffect(() => { useEffect(() => {
if (soruceType === '数据字典' && dictionary) { if (soruceType === '数据字典' && dictionary) {
onFocus() onFocus()
...@@ -40,8 +47,8 @@ const CheckBox = (props) => { ...@@ -40,8 +47,8 @@ const CheckBox = (props) => {
return ( return (
<Checkbox.Group <Checkbox.Group
disabled={disabled} disabled={disabled}
onChange={value => onChange(value.join(','))} onChange={checkChange}
value={value} value={value ? value.split(',') : []}
> >
{enums.map(v => <Checkbox key={v} value={v}>{v}</Checkbox>)} {enums.map(v => <Checkbox key={v} value={v}>{v}</Checkbox>)}
</Checkbox.Group> </Checkbox.Group>
......
src/core/widgets/select/CitySelect/index.js deleted 100644 → 0
View file @ 867b4236
import React, { useEffect } from 'react';
import { Cascader } from 'antd';
import city from '../../../../constant/city';
const CitySelect = ({ value, onChange, name, schema }) => {
const { disabled, placeholder } = schema
const onCascaderChange = selectedValues => {
// const { onChange, getSelectedValues } = this.props;
const result = [];
// 递归查询城市所有数据
function findCityData(city) {
city.forEach(item => {
const { id, label, value, children } = item;
if (selectedValues.includes(value)) {
result.push({ id, label, value });
if (children && children.length) {
findCityData(children);
}
}
});
}
findCityData(city);
// 分发监听
const cityValue = result.map(item => {
return item.label;
});
onChange && onChange(cityValue.join('/'));
};
const getDefaultValue = selectedValues => {
if (!selectedValues || !selectedValues.length) {
return;
}
const result = [];
// 递归查询城市名称数据
function findLabel(children) {
children.forEach(item => {
const { label, value, children } = item;
if (selectedValues.includes(label)) {
result.push(value);
}
if (children && children.length) {
findLabel(children);
}
});
}
// 卡省份解决县或市名称一样的问题
city.forEach(item => {
const { label, value, children } = item;
if (selectedValues.includes(label)) {
result.push(value);
if (children && children.length) {
findLabel(children);
}
}
});
// 设置默认值
return result;
};
useEffect(() => {
onChange(value || schema.default || '');
}, []);
return (
<Cascader
disabled={disabled}
placeholder={placeholder}
options={city}
showSearch={true}
showArrow={!disabled}
value={getDefaultValue(value ? value.split('/') : [])}
onChange={onCascaderChange}
style={{ width: '100%' }}
/>
)
}
export default CitySelect;
src/core/widgets/select/ComboBox/index.js
View file @ 651b6107
// 选择器，值选择器
import React, { useState, useMemo } from 'react' import React, { useState, useMemo } from 'react'
import { Select } from 'antd' import { Select, message } from 'antd'
import { GetSelectItemList } from '../../../../apis/process' import { GetSelectItemList, GetFieldValueFromTable, getStationListByUserID } from '../../../../apis/process'
const { Option } = Select const { Option } = Select
const ComboBox = ({ value, onChange, schema }) => { const ComboBox = ({ value, onChange, schema }) => {
const { placeholder, disabled, soruceType, options, dictionary, presetValue, isMultiple, isEdit } = schema const userID = window?.globalConfig?.userInfo?.OID || 1
const { placeholder, disabled, soruceType, options, dictionary, tableName, fieldName, presetValue, isMultiple, isEdit, isMySite } = schema
const [dictionaryList, setDictionaryList] = useState() const [dictionaryList, setDictionaryList] = useState([])
const [tableData, setTableData] = useState([])
const [site, setSite] = useState([])
const valueShow = useMemo(() => { const valueShow = useMemo(() => {
if (isMultiple) { if (isMultiple) {
...@@ -25,10 +26,14 @@ const ComboBox = ({ value, onChange, schema }) => { ...@@ -25,10 +26,14 @@ const ComboBox = ({ value, onChange, schema }) => {
return Array.isArray(options) ? options.map(v => v.value) : [] return Array.isArray(options) ? options.map(v => v.value) : []
case '数据字典': case '数据字典':
return Array.isArray(dictionaryList) ? dictionaryList.map(v => v.nodeName) : [] return Array.isArray(dictionaryList) ? dictionaryList.map(v => v.nodeName) : []
case '表数据':
return Array.isArray(tableData) ? tableData : []
case '站点':
return Array.isArray(site) ? site : []
default: default:
return [] return []
} }
}, [soruceType, options, dictionaryList]) }, [soruceType, options, dictionaryList, tableData, site])
const handleChange = value => { const handleChange = value => {
if (isEdit) { if (isEdit) {
...@@ -43,11 +48,46 @@ const ComboBox = ({ value, onChange, schema }) => { ...@@ -43,11 +48,46 @@ const ComboBox = ({ value, onChange, schema }) => {
} }
const onFocus = async () => { const onFocus = async () => {
if (soruceType === '数据字典') {
if (!dictionary) {
return message.error('请选择数据字典！')
}
const { data } = await GetSelectItemList({ nodeName: dictionary }) const { data } = await GetSelectItemList({ nodeName: dictionary })
if (Array.isArray(data)) { if (Array.isArray(data)) {
setDictionaryList(data) setDictionaryList(data)
} }
} }
if (soruceType === '表数据') {
if (!tableName) {
return message.info('请选择表名!')
}
if (!fieldName) {
return message.info('请选择字段名!')
}
const { code, data, msg } = await GetFieldValueFromTable(tableName, fieldName)
if (code === 0) {
if (Array.isArray(data)) {
setTableData(data.filter(v => v))
} else {
setTableData([])
}
} else {
message.error(msg)
}
}
if (soruceType === '站点') {
const { code, data, msg } = await getStationListByUserID(userID, isMySite)
if (code === 0) {
if (Array.isArray(data)) {
setSite(data)
} else {
setSite([])
}
} else {
message.error(msg)
}
}
}
return ( return (
<Select <Select
......
src/core/widgets/select/MultiSelect/index.js deleted 100644 → 0
View file @ 867b4236
// 自定义复选框
import React, { useState, useEffect } from 'react';
import { Select } from 'antd';
const { Option } = Select;
const MultiSelect = ({ value, onChange, schema }) => {
const { disabled, placeholder } = schema
const children = [];
for (let i = 0; i < schema.enum.length; i++) {
children.push(<Option key={schema.enum[i]}>{schema.enum[i]}</Option>);
}
const val = value || schema.default;
useEffect(() => {
onChange(val);
}, []);
return (
<Select
disabled={disabled}
showArrow={!disabled}
mode={'multiple'}
value={value ? value.split(',') : []}
onChange={val => onChange(val.join(','))}
style={{ width: '100%' }}
placeholder={placeholder}
tokenSeparators={[',']}
>
{children}
</Select>
);
};
export default MultiSelect;
src/core/widgets/select/PersonSelect/index.js deleted 100644 → 0
View file @ 867b4236
import React from 'react'
import PullStaff from './pullStaff'
const PersonSelect = (props) => {
// console.log('schema', schema)
// const {interaction} = schema
// if (props.schema.interaction === '下拉框') {
// return (
// <PullStaff {...props} />
// )
// }
return (
<PullStaff {...props} />
)
}
export default PersonSelect
\ No newline at end of file
src/core/widgets/select/PersonSelect/multipleStaffSelect.js deleted 100644 → 0
View file @ 867b4236
/*
** 人员选择器 多选
** create by ChenLong on 2021/12/21
** 功能路径：src\core\components\staffSelect\staffSelect.js
** 菜单参数列表：*变量名*(变量说明，数据类型，是否必填，取值范围)
* ** 形态：【人员选择器】
** 现阶段仅支持机构
** 显示名称，存储id，多个id以英文逗分隔
** 配置：全部 [.n] 返回全部的机构及人员列表
机构名称 [.n] 返回设定的机构及人员列表
(机构名称,机构名称 ...) [.n] 返回设定的某几个机构人员列表
* Tip：未剔除原有逻辑，需要后续阅读代码，删除无效代码
** 更新日志：
** edit by ChenLong on 2021/12/21: *****修改内容*****
** edit by ChenLong on 2021/12/28: ***** 支持原有配置（存储人名，显示人名）*****
** edit by ChenLong on 2021/12/28: ***** 存储方式的更改会导致控件的表现异常 *****
** edit by ChenLong on 2022/06/09: ***** 存在使用Modal单独引入后，数据状态始终存在的问题（但是在台账组件中，暂时未发现异常；该问题与使用方式有关）。变更部分逻辑， *****
*/
import React, { useState, useMemo, useEffect } from 'react';
import { Modal, Spin, Input, Checkbox } from 'antd';
import { UserAddOutlined } from '@ant-design/icons';
import Empty from '@wisdom-components/empty';
import { getUserListForRole } from '../../../../apis/process';
import './staffSelect.less';
const { Search } = Input;
const MultipleStaffSelect = ({ value, onChange, schema }) => {
let val = value || schema.default
const [visible, setVisible] = useState(false);
const [defaultPerson, setDefaultPerson] = useState([]);
const [personArr, setPersonArr] = useState([]);
const [searchVal, setSearchVal] = useState('');
const [loading, setLoading] = useState(true);
// 将所选人员存储到一个对象中,key `person_${index}`;
const [allPersonList, setAllPersonList] = useState({});
// 全选
// const [indeterminate, setIndeterminate] = useState(false);
const [allState, setAllState] = useState(false);
const [checkAll, setCheckAll] = useState({});
// 配置清单
const ouConfigArray = schema.config.split('.');
const isAll = ['全部', '全部ID'].includes(ouConfigArray[0]);
const isMultiple = !isAll && ouConfigArray[0].includes(',') && ouConfigArray.includes('(') && ouConfigArray.includes(')'); // (机构名,机构名)
const storeType = useMemo(() => {
return isAll && ouConfigArray[0] === '全部ID' ? 'userID' : 'userName'
}, [isAll, ouConfigArray])
const userNames = useMemo(() => {
if (storeType === 'userName') return value
let userList = personArr.reduce((total, current) => total.concat(current.userList), [])
let array = []
userList?.forEach(v => {
if (value.includes(v.userID)) {
array.push(v.userName)
}
})
return array.join(',')
}, [personArr, value, storeType])
/**
* @Description: 通过判断storeType来决定返回的【已选择人员数组】是存储人名还是ID；
* @Params: 参数描述
* @Date: 2021/12/28
* @Author: ChenLong
* */
const returnCheckedUserIDArray = (values, data = personArr) => {
let _checkedArray = values.split(',');
let _allPersonList = {};
data.forEach((item, index) => {
let _tempArray = [];
item.userList.forEach((obj) => {
if (_checkedArray.includes(obj[storeType])) {
_tempArray.push(obj[storeType]);
}
});
_allPersonList[`person_${index}`] = _tempArray;
});
return _allPersonList;
};
const checkInitNames = (IDs) => {
return IDs.split(',');
};
const getData = () => {
setLoading(true)
let ouConfig = ouConfigArray[0]; // 机构名的配置
getUserListForRole().then(res => {
if (res.code === 0) {
const arr = [];
res.data.forEach(item => {
// 全部机构
if (isAll) {
arr.push(item);
} else if (isMultiple) {
// 多机构
let _ouConfigArray = ouConfig.replace(/\(|\)/g, '').split(',');
if (_ouConfigArray.includes(item.ouName)) arr.push(item);
} else {
// 单机构
let _ouConfigArray = ouConfig.replace(/\(|\)/g, '');
if (_ouConfigArray.includes(item.ouName)) arr.push(item);
}
});
setDefaultPerson(arr);
setPersonArr(arr);
let _allPersonList = returnCheckedUserIDArray(value, res.data);
setAllPersonList(_allPersonList);
// 初始化时，先创建checkAll对象，避免后续第一次打开人员选择器，
let _checkAll = { ...checkAll };
arr.forEach((item, index) => {
_checkAll[`person_${index}`] = false;
})
setCheckAll(_checkAll);
} else {
onChange('请求错误');
}
setLoading(false);
});
};
const setDataStatus = () => {
setCheckAll({});
setAllPersonList({});
setAllState(false);
};
const onFocus = () => {
setVisible(true)
onChange(val)
if (!personArr.length) {
getData()
}
};
const onOk = () => {
setVisible(false);
setSearchVal('');
// 合并allPersonList内的所有id为字符串
let str = Object.values(allPersonList).flat().join(',');
onChange(str);
// setDataStatus()
};
const onCancel = () => {
setVisible(false);
setSearchVal('');
// setDataStatus()
};
const onInput = e => {
onSearch(e.target.value);
};
const onSearch = e => {
const arr = [];
setSearchVal(e);
defaultPerson.map(item => {
const list = {
ouid: item.ouid,
ouName: item.ouName,
userList: [],
};
item.userList.map(user => {
if (user.userName.indexOf(e) > -1) {
list.userList.push(user);
}
});
if (list.userList.length) {
arr.push(list);
}
});
setPersonArr(arr);
};
// 全选
const all = (e) => {
let _value = e.target.checked;
setAllState(_value);
let _allPerson = { ...allPersonList };
let _checkAll = { ...checkAll };
let _personArr = [...personArr];
_personArr.forEach((item, index) => {
_checkAll[`person_${index}`] = _value;
_allPerson[`person_${index}`] = _value ? item.userList.map(obj => obj[storeType]) : []
});
setCheckAll(_checkAll);
setAllPersonList(_allPerson);
};
// 复选框的函数
const onCheckChange = (list, key) => {
let _allPersonList = { ...allPersonList };
_allPersonList[key] = list;
setAllPersonList(_allPersonList);
};
const onCheckAllChange = (e, index) => {
// 1. 设定选中状态
let _value = e.target.checked;
let _checkAll = { ...checkAll };
_checkAll[`person_${index}`] = _value;
setCheckAll(_checkAll);
if (!_value) {
let _allPersonList = { ...allPersonList };
_allPersonList[`person_${index}`] = [];
setAllPersonList(_allPersonList);
setAllState(false)
return false
}
// 2. 要把底下所有的值全部选中
let _personArr = [...personArr];
let _currentArray = _personArr[index];
let _selectedValue = _currentArray.userList.map(item => item[storeType]);
// 3. 赋值到allPersonList
let _allPersonList = { ...allPersonList };
_allPersonList[`person_${index}`] = _selectedValue;
setAllPersonList(_allPersonList);
let _isAll = true;
Object.values(_checkAll).find(item => {
if (!item) {
_isAll = false;
}
return !item
})
if (_isAll) setAllState(true)
};
const checkSingleUser = (e, index) => {
let _value = e.target.checked;
let _checkAll = { ...checkAll };
let _allPersonList = { ...allPersonList };
let _personArr = [...personArr];
if (!_value) {
_checkAll[`person_${index}`] = false;
setCheckAll(_checkAll);
setAllState(false);
} else {
let _temp = Array.from(new Set(_allPersonList[`person_${index}`].concat(e.target.value)));
if (_temp.length === _personArr[index].userList.length) {
_checkAll[`person_${index}`] = true;
}
setCheckAll(_checkAll);
let _isAll = true;
Object.values(_checkAll).find(item => {
if (!item) {
_isAll = false;
}
return !item
})
if (_isAll) setAllState(true)
}
}
let indeterminate = (Object.values(checkAll).some(v => v === false) && !Object.values(checkAll).every(v => v === false)) ||
(Object.values(allPersonList).some(v => v.length) && Object.values(allPersonList).every(v => !v.length))
return (
<div className="personselect-wrapper" style={{ width: '100%' }}>
<Input
disabled={schema.disabled}
value={userNames || null}
placeholder={schema.disabled ? null : '点击选择人员'}
addonAfter={!schema.disabled ? <UserAddOutlined style={{ color: 'rgba(0, 0, 0, 0.25)' }} onClick={onFocus} /> : ''}
style={{ width: '100%' }}
/>
<Modal
title="人员选择器"
visible={visible}
onOk={onOk}
onCancel={onCancel}
cancelText={'取消'}
okText={'确定'}
wrapClassName="personModalClass"
bodyStyle={{ height: 450, overflowY: 'auto' }}
>
<Spin spinning={loading}>
<Search
placeholder="请输入姓名"
value={searchVal}
allowClear
onSearch={onSearch}
onChange={onInput}
enterButton
/>
<Checkbox
style={{ marginTop: 18 }}
onChange={(e) => all(e)}
indeterminate={indeterminate}
checked={allState}>
全选
</Checkbox>
{personArr.length
? personArr.map((item, index) => {
return (
<form key={index} className="fieldset-class">
<fieldset className="person-select">
<legend className="personheader">
<Checkbox
style={{ marginRight: 8 }}
onChange={(e) => onCheckAllChange(e, index)}
indeterminate={Boolean(allPersonList[`person_${index}`] && allPersonList[`person_${index}`].length) && allPersonList[`person_${index}`].length !== item.userList.length}
checked={Boolean(allPersonList[`person_${index}`] && allPersonList[`person_${index}`].length)} />
{item.ouName}
</legend>
<Checkbox.Group className="person-radio" name="person"
onChange={(list) => onCheckChange(list, `person_${index}`)}
value={allPersonList[`person_${index}`]}>
{item.userList.map((child, childIndex) => {
return (
<Checkbox style={{ minWidth: 100 }}
value={child[storeType]} key={childIndex}
onChange={(e) => checkSingleUser(e, index)}>
{child.userName}
</Checkbox>
);
})}
</Checkbox.Group>
</fieldset>
</form>
);
})
:
<div className={'staffSelectEmpty'}>
<Empty />
</div>
}
</Spin>
</Modal>
</div>
);
};
export default MultipleStaffSelect;
src/core/widgets/select/PersonSelect/pullStaff.js deleted 100644 → 0
View file @ 867b4236
import React, { useEffect, useMemo, useState } from 'react'
import { Select } from 'antd'
import { getMenTreeByRole } from '../../../../apis/process'
const pullStaff = ({ value, onChange, schema }) => {
const { disabled, role, isMultiple, presetValue } = schema
const [data, setData] = useState([])
const valueShow = useMemo(() => {
if (isMultiple) {
return (value || presetValue) ? (value || presetValue).split(',') : []
} else {
return value || presetValue
}
}, [presetValue, value, isMultiple])
const handleChange = (value) => {
if (isMultiple) {
onChange(value.join(','))
} else {
onChange(value)
}
}
const onFocus = async () => {
const { code, data, msg } = await getMenTreeByRole({ userID: 1, role })
if (code === 0) {
if (data && data.childNodes) {
setData(data.childNodes)
}
} else {
onChange(`请求错误,${msg}`)
}
}
return (
<Select
style={{ minWidth: 150 }}
mode={isMultiple ? 'multiple' : ''}
disabled={disabled}
value={valueShow}
optionFilterProp="children"
placeholder={disabled ? null : '点击选择人员'}
onChange={handleChange}
onFocus={onFocus}
showSearch
showArrow={!disabled}
>
{data.map(v => <Select.Option key={v.value} value={v.value}>{v.text}</Select.Option>)}
</Select>
)
}
export default pullStaff;
src/core/widgets/select/PersonSelect/staffSelect.js deleted 100644 → 0
View file @ 867b4236
/*
** 人员选择器 单选
** create by ChenLong on 2021/12/21
** 功能路径：src\core\components\staffSelect\staffSelect.js
** 菜单参数列表：*变量名*(变量说明，数据类型，是否必填，取值范围)
** 更新日志：
** edit by ChenLong on 2021/12/21: *****修改内容*****
** 形态：【人员选择器】
** 现阶段仅支持机构
** 显示名称，存储id，多个id以英文逗分隔
**配置：全部 [.n] 返回全部的机构及人员列表
机构名称 [.n] 返回设定的机构及人员列表
(机构名称,机构名称 ...) [.n] 返回设定的某几个机构人员列表
*/
import React, { useEffect, useState } from 'react';
import { Input, Modal, Radio, Spin } from 'antd';
import { UserAddOutlined } from '@ant-design/icons';
import Empty from '@wisdom-components/empty';
import { getUserListForRole } from '../../../../apis/process';
import './staffSelect.less';
const { Search } = Input;
const StaffSelect = ({ value, onChange, name, schema }) => {
const { disabled } = schema
const [visible, setVisible] = useState(false);
const [defaultPerson, setDefaultPerson] = useState([]);
const [personArr, setPersonArr] = useState([]);
const [person, setPerson] = useState(value);
const [searchVal, setSearchVal] = useState('');
const [loading, setLoading] = useState(true);
// [全部][.n] [全部.机构名][.n]
// [全部ID][.n] [全部ID.机构名][.n]
// [机构名][.n] [(机构名,机构名,机构名)][.n]
const ouConfig = schema.config;
// [全部][,n] [全部,机构名][,n]
// [全部ID][,n] [全部ID,机构名][,n]
// [机构名][,n] [(机构名,机构名,机构名)][,n]
let ouConfigArray = schema.config.split('.');
const isAll = ['全部', '全部ID'].includes(ouConfigArray[0]);
const storeType = isAll && ouConfigArray[0] === '全部ID' ? 'storeID' : 'storeName';
const isMultiple = !isAll && ouConfigArray[0].includes(',') && ouConfigArray[0].includes('(') && ouConfigArray[0].includes(')'); // (机构名,机构名)
/**
* @Description: 根据配置来返回ID或者名字
* @Params: value当前控件传入的值；
* @Date: 2021/12/28
* @Author: ChenLong
* */
const returnUserName = (value) => {
if (isNaN(Number(value))) return value;
let _list = returnUserList(personArr);
return _list.reduce((finalStr, current) => {
return finalStr += Number(current.userID) === Number(value) ? current.userName : '';
}, '');
};
const returnUserList = (data) => {
return data.reduce((finalArray, current) => {
return finalArray.concat(current.userList);
}, []);
};
const getData = () => {
getUserListForRole().then(res => {
if (res.code === 0) {
const arr = [];
setLoading(false);
res.data.forEach(item => {
// 全部 / 非全部
if (isAll) {
arr.push(item);
} else if (isMultiple) {
// 多选
let _ouConfigArray = ouConfigArray[0].replace(/\(|\)/g, '').split(',');
if (_ouConfigArray.includes(item.ouName)) arr.push(item);
} else {
// 单选
let _ouConfigArray = ouConfigArray[0].replace(/\(|\)/g, '');
if (_ouConfigArray.includes(item.ouName)) arr.push(item);
}
});
setDefaultPerson(arr);
setPersonArr(arr);
} else {
onChange('请求错误');
}
});
};
const onFocus = () => {
setVisible(true);
};
const onOk = () => {
setVisible(false);
setSearchVal('');
onChange(person);
};
const onCancel = () => {
setVisible(false);
setSearchVal('');
getData();
};
const onInput = e => {
onSearch(e.target.value);
};
const handleChange = e => {
setPerson(e.target.value);
};
const onSearch = e => {
const arr = [];
setSearchVal(e);
defaultPerson.map(item => {
const list = {
ouid: item.ouid,
ouName: item.ouName,
userList: [],
};
item.userList.map(user => {
if (user.userName.indexOf(e) > -1) {
list.userList.push(user);
}
});
if (list.userList.length) {
arr.push(list);
}
});
setPersonArr(arr);
};
useEffect(() => {
async function _getData() {
await getData();
}
_getData().catch(err => {
console.log(err);
});
}, []);
return (
<div className="personselect-wrapper" style={{ width: '100%' }}>
<Input
disabled={disabled}
placeholder={disabled ? null : '点击选择人员'}
value={returnUserName(value) || null}
addonAfter={disabled ? null : <UserAddOutlined style={{ color: 'rgba(0, 0, 0, 0.25)' }} onClick={onFocus} />}
style={{ width: '100%' }}
/>
<Modal
title="人员选择器"
visible={visible}
onOk={onOk}
onCancel={onCancel}
cancelText={'取消'}
okText={'确定'}
wrapClassName="personModalClass"
bodyStyle={{ width: '80%', height: 450, overflowY: 'auto' }}
>
{loading && <Spin />}
<Search
placeholder="请输入姓名"
value={searchVal}
allowClear
onSearch={onSearch}
onChange={onInput}
enterButton
/>
{!personArr.length && (
<div className={'staffSelectEmpty'}>
<Empty />
</div>
)}
{personArr.length
? personArr.map((item, index) => {
return (
<form key={index} className="fieldset-class">
<fieldset className="person-select">
<legend className="personheader">{item.ouName}</legend>
<Radio.Group className="person-radio" name="person" onChange={handleChange} value={person}>
{item.userList.map((child, childIndex) => {
return (
<Radio value={storeType === 'storeID' ? child.userID : child.userName} key={childIndex}>
{child.userName}
</Radio>
);
})}
</Radio.Group>
</fieldset>
</form>
);
})
: ''}
</Modal>
</div>
);
};
export default StaffSelect;
src/core/widgets/select/PersonSelect/staffSelect.less deleted 100644 → 0
View file @ 867b4236
@import '~antd/es/style/themes/default.less';
.personModalClass {
.@{ant-prefix}-modal-body {
display: flex;
flex-direction: column;
padding: 15px 24px 5px 24px;
.person-select {
padding: 10px 0;
.personheader {
margin-left: 10px;
font-size: 13px;
}
.person-radio {
//display: flex;
//flex-wrap: wrap;
margin: 3px 0 3px 10px;
}
.@{ant-prefix}-radio-wrapper {
width: 120px;
}
.@{ant-prefix}-checkbox-wrapper + .@{ant-prefix}-checkbox-wrapper {
margin-left: 0px;
}
}
.selectvalue {
flex: none;
margin-right: 10px;
}
.staffSelectEmpty {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
}
.fieldset-class {
padding: 10px 0;
fieldset {
border: 1px solid #f6f6f6;
}
legend {
width: auto;
}
}
}
}
src/core/widgets/select/RadioButton/index.js
View file @ 651b6107
...@@ -4,23 +4,29 @@ import { GetSelectItemList } from '../../../../apis/process' ...@@ -4,23 +4,29 @@ import { GetSelectItemList } from '../../../../apis/process'
const RadioButton = (props) => { const RadioButton = (props) => {
const { value, onChange, schema } = props const { value, onChange, schema, addons } = props
const { presetValue, disabled, soruceType, options, dictionary } = schema const { presetValue, disabled, soruceType, options, dictionary } = schema
const [dictionaryList, setDictionaryList] = useState([]) const [dictionaryList, setDictionaryList] = useState([])
useEffect(() => { useEffect(() => {
onChange(presetValue) if (addons) {
addons.setValue(addons.dataPath, presetValue)
}
}, [presetValue]) }, [presetValue])
const onFocus = async () => { const onFocus = async () => {
const { data } = await GetSelectItemList({ nodeName: dictionary }) const { data } = await GetSelectItemList({ nodeName: dictionary })
if (Array.isArray(data)) { if (Array.isArray(data)) {
setDictionaryList(data) setDictionaryList(data)
} }
} }
const radioChange = (e) => {
if (addons) {
addons.setValue(addons.dataPath, e.target.value)
}
}
useEffect(() => { useEffect(() => {
if (soruceType === '数据字典' && dictionary) { if (soruceType === '数据字典' && dictionary) {
onFocus() onFocus()
...@@ -39,7 +45,7 @@ const RadioButton = (props) => { ...@@ -39,7 +45,7 @@ const RadioButton = (props) => {
}, [soruceType, options, dictionaryList]) }, [soruceType, options, dictionaryList])
return ( return (
<Radio.Group onChange={e => onChange(e.target.value)} value={value} disabled={disabled}> <Radio.Group onChange={radioChange} value={value} disabled={disabled}>
{enums.map(v => <Radio key={v} value={v}>{v}</Radio>)} {enums.map(v => <Radio key={v} value={v}>{v}</Radio>)}
</Radio.Group> </Radio.Group>
) )
......
src/core/widgets/select/SearchSelect/index.js deleted 100644 → 0
View file @ 867b4236
// 搜索选择器，配置字典
import React, { useState, useMemo } from 'react'
import { Select } from 'antd'
import { getSelectName } from '../../../../apis/process'
const { Option } = Select
const SearchSelect = ({ value, onChange, schema }) => {
const { disabled, placeholder } = schema
const [selectList, setSelectList] = useState([]);
const mode = useMemo(() => {
if (schema.config.includes('n')) {
return 'multiple'
}
return null
}, [schema])
const valueShow = useMemo(() => {
if (mode) {
return (schema.default || value) ? (schema.default || value).split(',') : []
} else {
return schema.default || value
}
}, [schema, value])
const handleChange = value => {
if (mode) {
onChange(value.join(','))
} else {
onChange(value)
}
}
const getData = () => {
const arr = schema.config.split('.')
if (!arr.length) return false
const str = arr[0];
getSelectName(str).then(res => {
if (res.code === 0) {
setSelectList(res.data)
} else {
onChange('请求错误')
}
})
}
return (
<Select
mode={mode}
disabled={disabled}
showArrow={!disabled}
optionFilterProp="children"
value={valueShow || null}
placeholder={placeholder}
onChange={handleChange}
onFocus={() => getData()}
style={{ width: '100%' }}
showSearch
>
{selectList.map(v => <Option value={v.nodeValue} key={v.nodeId}>{v.nodeValue}</Option>)}
</Select>
)
}
export default SearchSelect
src/core/widgets/select/ServiceSelect/index.js deleted 100644 → 0
View file @ 867b4236
// 业务选择器
import React, { useState, useEffect, useMemo } from 'react';
import { Select } from 'antd';
import { GetFieldValueFromTable } from '../../../../apis/process';
const { Option } = Select;
const ServiceSelect = ({ value, onChange, name, schema }) => {
const { disabled, placeholder } = schema
const [selectList, setSelectList] = useState([]);
const mode = useMemo(() => {
if (schema.config.includes('n')) {
return 'multiple'
}
return null
}, [schema])
const valueShow = useMemo(() => {
let valueShow = value || schema.default
if (valueShow.includes('请求错误')) {
return mode ? '' : []
}
if (mode) {
return Array.isArray(valueShow) ? valueShow : (valueShow ? valueShow.split(',') : [])
} else {
return valueShow
}
}, [schema, value])
const handleChange = value => {
if (mode) {
onChange(value.join(','));
} else {
onChange(value)
}
};
const getData = () => {
const arr = schema.config.split('.');
if (!arr.length) return false;
const accountName = arr[0];
const filedName = arr[1];
GetFieldValueFromTable(accountName, filedName).then(res => {
if (res.code === 0) {
setSelectList(res.data || []);
} else {
onChange(`请求错误,${res.msg}`)
}
});
};
useEffect(() => {
onChange(value || schema.default);
getData()
}, []);
return (
<Select
mode={mode}
disabled={disabled}
showSearch
showArrow={!disabled}
optionFilterProp="children"
value={valueShow || null}
onChange={handleChange}
placeholder={placeholder}>
{selectList.map((item, index) => <Option value={item} key={index}>{item}</Option>)}
</Select>
);
};
export default ServiceSelect;
src/core/widgets/select/index.js
View file @ 651b6107
...@@ -4,6 +4,7 @@ import CheckBox from './CheckBox' ...@@ -4,6 +4,7 @@ import CheckBox from './CheckBox'
import CascadeSelector from './CascadeSelector' import CascadeSelector from './CascadeSelector'
import PersonSelector from './PersonSelector' import PersonSelector from './PersonSelector'
import AccountSelector from './AccountSelector' import AccountSelector from './AccountSelector'
import DeptSelector from './DeptSelector'
const select = { const select = {
ComboBox, ComboBox,
...@@ -12,6 +13,7 @@ const select = { ...@@ -12,6 +13,7 @@ const select = {
PersonSelector, PersonSelector,
CascadeSelector, CascadeSelector,
AccountSelector, AccountSelector,
DeptSelector,
} }
export default select export default select
\ No newline at end of file
src/core/widgets/settings/groupSource/Dictionary/index.js
View file @ 651b6107
...@@ -34,9 +34,6 @@ const Dictionary = (props) => { ...@@ -34,9 +34,6 @@ const Dictionary = (props) => {
} }
const getDataSource = async () => { const getDataSource = async () => {
// let option = options.find(v => v.nodeName === value)
// console.log('option', options, option, value)
// if (!option) return
const { data } = await GetSelectItemList({ nodeName: value }) const { data } = await GetSelectItemList({ nodeName: value })
if (Array.isArray(data)) { if (Array.isArray(data)) {
setDataSource(data) setDataSource(data)
...@@ -60,7 +57,7 @@ const Dictionary = (props) => { ...@@ -60,7 +57,7 @@ const Dictionary = (props) => {
<div className='dictionary'> <div className='dictionary'>
<Select <Select
value={value} value={value}
style={{ maxWidth: '168px', width: '100%' }} style={{ maxWidth: value ? '180px' : '218px', width: '100%' }}
onChange={selectChange} onChange={selectChange}
onFocus={() => getDictionary()} onFocus={() => getDictionary()}
showSearch showSearch
......
src/core/widgets/settings/groupSource/TableName/index.js deleted 100644 → 0
View file @ 867b4236
import React from 'react'
import { Cascader } from 'antd'
const options = [
{
value: 'zhejiang',
label: 'Zhejiang',
children: [
{
value: 'hangzhou',
label: 'Hangzhou',
children: [
{
value: 'xihu',
label: 'West Lake',
code: 752100,
},
],
},
],
},
{
value: 'jiangsu',
label: 'Jiangsu',
children: [
{
value: 'nanjing',
label: 'Nanjing',
children: [
{
value: 'zhonghuamen',
label: 'Zhong Hua Men',
code: 453400,
},
],
},
],
},
];
const TableName = (props) => {
const { value, onChange } = props
const selectChange = (value) => {
onChange(value.join(','))
}
return (
<Cascader
onChange={selectChange}
style={{ width: '208px' }}
options={options}
/>
)
}
export default TableName
\ No newline at end of file
src/core/widgets/settings/groupSource/index.js
View file @ 651b6107
import Dictionary from './Dictionary' import Dictionary from './Dictionary'
import TableName from './TableName' import TableAndField from './TableAndField'
import AccountName from './AccountName' import AccountName from './AccountName'
import Fieldshine from './Fieldshine' import Fieldshine from './Fieldshine'
const groupSource = { const groupSource = {
Dictionary, Dictionary,
TableName, TableAndField,
AccountName, AccountName,
Fieldshine, Fieldshine,
} }
......
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