Commit 185c28c1 authored by 田翔's avatar 田翔

组件附件预览隐藏

parent 2a012baa
import React, {useEffect, useRef, useState} from 'react';
import React, { useEffect, useRef, useState } from 'react';
import ReactDOM from 'react-dom';
import Test from './test';
function render() {
ReactDOM.render(<Test />, document.getElementById('root'));
ReactDOM.render(<Test />, document.getElementById('app'));
}
render();
......@@ -6,7 +6,7 @@
<link rel="stylesheet" href="./index.css" />
</head>
<body>
<div id="root"></div>
<div id="app"></div>
<script src="/__build__/base.js"></script>
</body>
</html>
......@@ -28,7 +28,7 @@ app.use(['/admin', '/manager'], admin);
app.use(webpackHotMiddleware(compiler));
app.use(express.static(__dirname));
// app.use('/', createProxyMiddleware('/', { target: 'http://127.0.0.1:8880', changeOrigin: true }));
app.use('/', createProxyMiddleware('/', { target: 'http://192.168.10.167:8088', changeOrigin: true }));
app.use('/', createProxyMiddleware('/', { target: 'http://192.168.10.178:8082', changeOrigin: true }));
const port = process.env.PORT || 8888;
module.exports = app.listen(port, () => {
console.log(`Server listening on http://localhost:${port}, Ctrl+C to stop`);
......
{
"name": "panda-xform",
"version": "1.4.2",
"description": "1.4.2: 对接后端",
"version": "1.4.4",
"description": "1.4.4: 组件附件预览隐藏",
"keywords": [
"panda-xform"
],
......@@ -37,7 +37,6 @@
"moment": "^2.29.1",
"qrcode.react": "^1.0.1",
"react": "17.0.2",
"react-file-viewer": "^1.2.1",
"react-svg": "15.1.9",
"yarn": "^1.22.17"
},
......@@ -125,4 +124,4 @@
"publishConfig": {
"registry": "https://g.civnet.cn:4873"
}
}
\ No newline at end of file
}
......@@ -186,6 +186,14 @@ export function DeleteTableDataInfo(data) {
});
}
//获取数据字典
export function GetDataDictionaryList() {
return request({
url: `/PandaOMS/OMS/DataManger/GetDataDictionaryList`,
method: 'get',
})
}
//获取表
export function LoadLedgers() {
return request({
......
......@@ -113,14 +113,14 @@ const globalSettings = {
displayType: 'row',
labelWidth: 70,
},
tableAlias: {
alias: {
title: '别名',
type: 'string',
widget: 'htmlInput',
displayType: 'row',
labelWidth: 70,
},
interfaceText: {
interfaceName: {
title: '接口',
type: 'string',
widget: 'htmlInput',
......
This diff is collapsed.
......@@ -37,7 +37,7 @@ const FormDesigner = (props) => {
if (typeof data === 'string') {
setTimeout(() => {
ref && ref.current && ref.current.setValue && ref.current.setValue(JSON.parse(data))
}, 1000)
}, 0)
}
} else {
message.error('获取表单配置失败')
......@@ -67,22 +67,12 @@ const FormDesigner = (props) => {
}
]
const getId = (value) => {
// console.log('value', value)
return value
}
const onChange = (value) => {
// console.log('value', value)
}
const onSchemaChange = (value) => {
// console.log('value', value)
return value
}
const onCanvasSelect = (schema) => {
// setWidget(schema.widget)
console.log('schema', schema)
// console.log('value', value)
}
......@@ -102,7 +92,6 @@ const FormDesigner = (props) => {
ref={ref}
extraButtons={extraButtons}
onChange={onChange}
onSchemaChange={onSchemaChange}
widgets={widgets}
onCanvasSelect={onCanvasSelect}
settings={settings}
......
......@@ -4,12 +4,13 @@ import { CompassOutlined } from '@ant-design/icons'
import { AMapScene, AMapDrawTool, VectorLayer, PointLayer } from '@wisdom-map/amap'
import { ArcGISSceneMap, AutoCompleteSearch, Drawtool as drawTool, Graphic, GraphicsLayer, Point } from '@wisdom-map/arcgismap'
import { mktlng } from '@wisdom-map/basemap/es/utils/coordTransformation'
import { GlobalStore } from '../../../FormRender'
// import { GlobalStore } from '../../../FormRender'
const CoordinatePicker = ({ value, onChange, name, schema }) => {
const Coordinate = ({ value, onChange, name, schema }) => {
const { disabled, placeholder } = schema
const { extraData, setExtraData } = useContext(GlobalStore);
// const { extraData, setExtraData } = useContext(GlobalStore);
const { extraData, setExtraData } = useState(GlobalStore);
const [coordinate, setCoordinate] = useState('');
const [layersConifg, setLayersConifg] = useState(() => {
const mapConfig = window.globalConfig.mapsettings?.layers || null;
......@@ -25,45 +26,7 @@ const CoordinatePicker = ({ value, onChange, name, schema }) => {
const [view, setView] = useState(null);
const [coordGetLayers, setCoordGetLayers] = useState(null);
let _temp = [];
/* let _tempCoordinateArray = [];
let _lnglatArray = [];*/
/*
* 问题:在getAMapInfo中,react的hook函数无法生效
* */
// 这个是使用高德地图的点生成的写法
/* const
= (AMap, map) => {
if (currentPointerCoordinate && currentPointerCoordinate.length) {
var initMarker = new AMap.Marker({
content: `<div>
<p style="position: absolute;background: #ffffff;padding: 4px;top:-50px;left:20px;border-radius: 4px">经纬度坐标: [${currentPointerCoordinate[0]},${currentPointerCoordinate[1]}]</p>
<img src="https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png" alt="">
</div>`,
icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
position: currentPointerCoordinate,
anchor: 'bottom-center'
});
map.add(initMarker);
setCurrentPointer([initMarker]);
_temp.push(initMarker);
}
map.on('click', function (e) {
if (_temp.length) map.remove(_temp);
var marker = new AMap.Marker({
content: `<div>
<p style="position: absolute;background: #ffffff;padding: 4px;top:-50px;left:20px;border-radius: 4px">经纬度坐标: [${e.lnglat.getLng()},${e.lnglat.getLat()}]</p>
<img src="https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png" alt="">
</div>`,
icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
position: [e.lnglat.getLng(), e.lnglat.getLat()],
anchor: 'bottom-center'
});
setCurrentPointer([marker]);
_temp = [marker];
setCurrentPointerCoordinate([e.lnglat.getLng(), e.lnglat.getLat()]);
map.add(marker);
})
};*/
const getAMapInfo = (AMap, map) => {
let geocoder;
AMap.plugin('AMap.Geocoder', function () {
......@@ -254,6 +217,6 @@ const CoordinatePicker = ({ value, onChange, name, schema }) => {
</div>
);
};
}
export default CoordinatePicker;
export default Coordinate
......@@ -2,7 +2,7 @@ import React, { useEffect, useMemo, useState } from 'react'
import styles from './index.less'
import { Upload, Button, message, Modal } from 'antd'
import { UploadOutlined, FileOutlined, ArrowDownOutlined } from '@ant-design/icons'
import FileViewer from 'react-file-viewer'
// import FileViewer from 'react-file-viewer'
import { uploadFileUrl, downloadFileUrl, downloadFile } from '../../../../apis/process'
import { downloadFunc, filenameVerification } from '../../../../utils/utils'
......@@ -180,11 +180,12 @@ const FileUpload = (props) => {
onCancel={() => setVisible(false)}
bodyStyle={{ height: 650, overflowY: showFile.fileType.includes('xlsx') ? 'none' : "auto" }}
>
<FileViewer
{/* <FileViewer
className='fileViewer'
title='123'
fileType={showFile.fileType}
filePath={window.location.origin + showFile.filePath}
/>
/> */}
</Modal>
</div>
)
......
// 搜索选择器,配置字典
/*
** 选择器
** create by ChenLong on 2021/12/15
** 功能路径:src\core\components\selectTree\selectTree.js
** 菜单参数列表:*变量名*(变量说明,数据类型,是否必填,取值范围)
** 更新日志:
* 使用搜索选择器,重写选择器的里的逻辑,并且通过新增FormRender的watch属性,来实现关联选择器的联动
** edit by ChenLong on 2021/12/15: *****修改内容*****
*/
/**
* @Description: 1. 单选情况下,传值时字符窜;2. 多选情况下,传值时数组;
* @Date: 2021/12/15
* */
import React, { useState, useEffect } from 'react';
import { Select } from 'antd';
import { getSelectName } from '../../../../apis/process';
......@@ -57,11 +41,9 @@ const SelectTree = ({ value, onChange, schema }) => {
};
useEffect(() => {
// 初始化的时候,处理单选/多选问题
const handleInitData = Object.prototype.toString.call(val) === '[object String]' && val ? val.split(',') : val;
let _val = isMultiple ? handleInitData : val;
onChange(_val);
// getData();
}, []);
return (
......@@ -84,7 +66,8 @@ const SelectTree = ({ value, onChange, schema }) => {
);
})}
</Select>
);
};
)
}
export default SelectTree;
export default SelectTree
/*
** 选择器,多级联动;BUT: 【当前不使用、不开发此形态控件】。
** create by ChenLong on 2021/12/7
** 功能路径:src\core\components\selectTree\selectTree.js
** 菜单参数列表:*变量名*(变量说明,数据类型,是否必填,取值范围)
** 更新日志:
* 1. 业务梳理:【选择器】被匹配到时,实际是匹配了【台账字段.字典字段】这种类型的config;
* 2. 需要先取【台账字段】的值,这个值,是字典的key;再之后做相应的数据逻辑即可
* 3. 当【选择器】是多选时,选择器需要是多选,需要列出所有值
*
** edit by ChenLong on 2021/12/7: *****修改内容*****
* TIP: 当匹配到该控件时,即为联动;单独的选择器会匹配到搜索选择器
*/
// 选择器 多级联动
import React, { useState, useEffect } from 'react';
import { getSelectName, getSelectChildName } from '../../../../apis/process';
import { TreeSelect } from 'antd';
const SelectTree = ({ value, onChange, schema }) => {
const [treeData, setTreeData] = useState([]);
const val = value || schema.default;
const routeParams = schema.config;
const genTreeNode = (parentId, id, title, isLeaf) => {
return {
id,
pId: parentId,
title,
isLeaf,
};
};
const onLoadData = treeNode => {
return new Promise(resolve => {
const routeArr = routeParams.split('.');
const { id } = treeNode;
const len = treeNode.pos.split('-');
const clickIndex = len.length - 1;
const treeDataList = [];
getSelectChildName(routeArr[clickIndex]).then(res => {
if (res.code === 0) {
res.forEach(item => {
if (item.PARENTID === treeNode.nodeId)
setTreeData(treeData.concat([genTreeNode(id, item.NODEVALUE, item.NODENAME, item.ORDERID == 0)]));
});
resolve();
} else {
onChange('请求错误');
}
});
});
};
const getFirstNode = () => {
const arr = routeParams.split('.');
getSelectName(arr[0]).then(res => {
if (res.code === 0) {
const firArr = [];
res.forEach(item => {
firArr.push({
id: item.NODEVALUE,
pId: 0,
value: item.NODEVALUE,
title: item.NODENAME,
nodeId: item.NODEID,
isLeaf: item.ORDERID == 0,
});
});
setTreeData(firArr);
} else {
onChange('请求错误');
}
});
};
useEffect(() => {
onChange(val);
getFirstNode();
}, []);
return (
<TreeSelect
treeDataSimpleMode
style={{ width: '100%' }}
value={value || ''}
placeholder="点击进行选择"
onChange={val => {
onChange(val);
}}
loadData={onLoadData}
treeData={treeData}
/>
);
};
export default SelectTree;
......@@ -4,7 +4,7 @@ import { LoadUnattachedTables } from '../../../../../apis/process'
const TableNames = (props) => {
console.log('props', props)
// console.log('表名', props)
const { value, schema, onChange } = props
const [options, setOptions] = useState([])
......@@ -27,9 +27,9 @@ const TableNames = (props) => {
return (
<Select
disabled={true}
// disabled={true}
onFocus={onFocus}
// showSearch
showSearch
value={value}
onChange={onSelect}
optionFilterProp="children"
......
......@@ -84,6 +84,9 @@ const FieldNames = (props) => {
const { value, onChange, addons } = props
const [fieldName, setFieldName] = useState([])
// const { tableName } = useContext(GlobalStore)
// console.log('字段名称', props)
const change = (value) => {
onChange(value)
......@@ -93,6 +96,7 @@ const FieldNames = (props) => {
// if (!tableName) {
// return message.info('请在表单配置中选择表名!')
// }
console.log(addons.getSchemaByPath('tableName'))
const { data } = await LoadTableFields({ tableName: '事件_测试02' })
if (Array.isArray(data.root)) {
setFieldName(data.root)
......
import React from 'react'
import { InputNumber } from 'antd'
const NumerDefault = (props) => {
const { value, onChange } = props
return (
<InputNumber
value={value}
onChange={value => onChange(value)}
/>
)
}
export default NumerDefault
\ No newline at end of file
import InputDefault from './InputDefault'
import Placeholder from './Placeholder'
import FieldNames from './FieldNames'
import Placeholder from './Placeholder'
import InputDefault from './InputDefault'
import NumerDefault from './NumerDefault'
const base = {
const groupBase = {
FieldNames,
InputDefault,
Placeholder,
NumerDefault,
}
export default base
\ No newline at end of file
export default groupBase
\ No newline at end of file
import React, { useState } from 'react'
import { Input, Modal } from 'antd'
import { GetDataDictionaryList } from '../../../../../apis/process'
const Dictionary = (props) => {
const { value, shame, onChange } = props
const [visible, setVisible] = useState(false)
const onClick = () => {
setVisible(true)
getDictionary()
}
const getDictionary = async () => {
const res = await GetDataDictionaryList()
console.log('res', res)
}
return (
<div className='dictionary'>
<Input onClick={onClick} value={value} />
<Modal
onCancel={() => setVisible(false)}
onOk={() => setVisible(true)}
title='数据字典'
visible={visible}
>
</Modal>
</div>
)
}
export default Dictionary
\ No newline at end of file
import Dictionary from './Dictionary'
const groupSource = {
Dictionary,
}
export default groupSource
\ No newline at end of file
......@@ -3,21 +3,25 @@ import { Select } from 'antd'
const options = [
{
name: 'email',
label: '邮箱(email)',
value: '^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(.[a-zA-Z0-9_-]+)+$',
message: '邮箱校验未通过'
},
{
name: 'email',
label: '身份证号(identity)',
value: '(^\\d{15}$)|(^\\d{18}$)|(^\\d{17}(\\d|X|x)$)',
message: '手机号校验未通过'
},
{
name: 'mobile',
label: '手机号(mobile)',
value: '/^1(3\d|4[5-9]|5[0-35-9]|6[567]|7[0-8]|8\d|9[0-35-9])\d{8}$/',
message: '手机号校验未通过',
},
{
name: 'bankAccount',
label: '银行卡号(bankAccount)',
value: '^(\\d{16}|\\d{19})$',
message: '银行卡号校验未通过'
......@@ -35,7 +39,7 @@ const VerifyTextInput = (props) => {
const selectChange = (value) => {
if (value) {
const item = options.find(v => v.value === value)
onChange([{ pattern: value, message: item.message }])
onChange([{ name: item.name, pattern: value, message: item.message }])
} else {
onChange([])
}
......
import VerifyTextInput from './VerifyTextInput'
const groupVerify = {
VerifyTextInput,
}
export default groupVerify
\ No newline at end of file
import base from './base'
import form from './form'
import groupBase from './groupBase'
import groupSource from './groupSource'
import groupVerify from './groupVerify'
import BooleanSwitch from './BooleanSwitch'
import EnumOptions from './EnumOptions'
import InputAddon from './InputAddon'
import CascadeField from './CascadeField'
import DateSelect from './DateSelect'
import DataSource from './DataSource'
import VerifyTextInput from './VerifyTextInput'
const settings = {
...base,
...form,
...groupBase,
...groupSource,
...groupVerify,
BooleanSwitch,
EnumOptions,
InputAddon,
CascadeField,
DateSelect,
DataSource,
VerifyTextInput,
}
export default settings
\ No newline at end of file
import React, { useMemo } from 'react'
import React, { useEffect, useMemo } from 'react'
import { InputNumber } from 'antd'
import style from '../../style'
const NumberInput = ({ value, onChange, schema }) => {
const NumberInput = (props) => {
const { disabled, presetValue, placeholder } = schema
const { value, onChange, schema } = props
const { disabled, presetValue, placeholder, prefix, formatter } = schema
const valueShow = useMemo(() => {
return presetValue || value
}, [presetValue, value])
console.log('props', props)
useEffect(() => {
onChange(presetValue)
}, [presetValue, formatter])
return (
<InputNumber
defaultValue={null}
prefix={prefix}
placeholder={placeholder}
disabled={disabled}
value={valueShow}
value={value}
formatter={(value) => value && formatter ? `${value}${formatter}` : value}
parser={(value) => value && formatter && value.replace(formatter, '')}
onChange={value => onChange(value)}
style={style}
/>
......
......@@ -10,7 +10,7 @@ const TextInput = (props) => {
const userInfo = window?.globalConfig?.userInfo || { fullName: '【本人姓名】', depart: { name: '【本人部门】' } }
const { value, onChange, schema } = props
const { disabled, placeholder, presetValue, prefix, suffix, maxLength, rules } = schema
const { disabled, placeholder, presetValue, addonBefore, addonAfter, maxLength, rules } = schema
useEffect(() => {
onChange(presetValue)
......@@ -42,8 +42,8 @@ const TextInput = (props) => {
maxLength={maxLength}
placeholder={disabled ? null : placeholder}
onChange={handleChange}
addonBefore={iconList.includes(prefix) ? <Icon component={icons[prefix]} /> : prefix}
addonAfter={iconList.includes(suffix) ? <Icon component={icons[suffix]} /> : suffix}
addonBefore={iconList.includes(addonBefore) ? <Icon component={icons[addonBefore]} /> : addonBefore}
addonAfter={iconList.includes(addonAfter) ? <Icon component={icons[addonAfter]} /> : addonAfter}
/>
)
......
......@@ -9,6 +9,15 @@
height: 700px;
}
.fr-generator-container .left-layout {
.left-item {
.anticon {
margin-right: 5px;
}
}
}
.fr-generator-container .right-layout {
width: 20rem;
}
......
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