Skip to content

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

fix: 防止出现死循环

parent 29dfb800
Hide whitespace changes
Inline Side-by-side
Showing with 213 additions and 117 deletions
package.json
View file @ a9f4e41a
{
"name": "panda-xform",
"version": "1.6.1",
"description": "1.6.1: 可编辑选择器修改",
"version": "1.6.2",
"description": "1.6.2: 防止出现死循环",
"keywords": [
"panda-xform"
],
......@@ -35,7 +35,7 @@
"fr-generator": "^2.8.4",
"http-proxy-middleware": "^1.0.6",
"moment": "^2.29.1",
"qrcode.react": "^1.0.1",
"qrcode.react": "^3.1.0",
"react": "17.0.2",
"react-file-viewer": "^1.2.1",
"react-sign2": "^0.0.3",
......@@ -126,4 +126,4 @@
"publishConfig": {
"registry": "https://g.civnet.cn:4873"
}
}
\ No newline at end of file
}
src/core/FormDesigner/config/settings.js
View file @ a9f4e41a
......@@ -1275,16 +1275,99 @@ const selectWidgets = [
},
}
},
// {
// text: '开关',
// name: '开关',
// schema: {
// title: '开关',
// name: '开关',
// type: 'Boolean',
// widget: 'Switch',
// },
// },
{
text: '开关',
name: '开关',
schema: {
title: '开关',
name: '开关',
type: 'boolean',
widget: 'SwitchSelector',
},
setting: {
groupBase: {
title: '基础信息',
type: 'object',
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,
},
presetValue: {
title: '默认值',
type: 'boolean',
widget: 'BooleanSwitch',
displayType: 'row',
labelWidth: 80,
},
// placeholder: {
// title: '提示语',
// type: 'string',
// displayType: 'row',
// labelWidth: 80,
// default: '请输入位置'
// },
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%',
},
description: {
title: '说明',
type: 'string',
displayType: 'row',
labelWidth: 55,
},
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: '关联选择',
name: '关联选择',
......@@ -1907,6 +1990,7 @@ const dateWidgets = [
name: '日期选择',
schema: {
title: '日期选择',
name: '日期选择',
type: 'string',
widget: 'DateTime',
},
......@@ -2041,6 +2125,7 @@ const dateWidgets = [
icon: <FieldTimeOutlined />,
schema: {
title: '时间选择',
name: '时间选择',
type: 'string',
widget: 'Time',
},
......@@ -2361,12 +2446,11 @@ const mapWidgets = [
default: false,
width: '25%',
},
emphasis: {
title: '强调',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '25%',
description: {
title: '说明',
type: 'string',
displayType: 'row',
labelWidth: 55,
},
groupStyle: {
title: '控件样式',
......@@ -2447,12 +2531,11 @@ const mapWidgets = [
default: false,
width: '25%',
},
emphasis: {
title: '强调',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '25%',
description: {
title: '说明',
type: 'string',
displayType: 'row',
labelWidth: 55,
},
groupStyle: {
title: '控件样式',
......@@ -2533,12 +2616,11 @@ const mapWidgets = [
default: false,
width: '25%',
},
emphasis: {
title: '强调',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '25%',
description: {
title: '说明',
type: 'string',
displayType: 'row',
labelWidth: 55,
},
groupStyle: {
title: '控件样式',
......
src/core/widgets/select/SwitchSelector/index.js 0 → 100644
View file @ a9f4e41a
import React, { useEffect } from 'react'
import { Switch } from 'antd'
const SwitchSelector = (props) => {
const { value, onChange, schema, addons } = props
const { disabled, presetValue } = schema
console.log('props', props)
useEffect(() => {
if (addons) {
addons.setValue(addons.dataPath, presetValue)
} else {
onChange(presetValue)
}
}, [presetValue])
const switchChange = (checked) => {
if (addons) {
onChange(checked)
}
}
return (
<Switch
checked={value}
disabled={disabled}
checkedChildren={'开启'}
unCheckedChildren="关闭"
onChange={switchChange}
>
</Switch>
)
}
export default SwitchSelector
\ No newline at end of file
src/core/widgets/select/index.js
View file @ a9f4e41a
......@@ -3,6 +3,7 @@ import RadioButton from './RadioButton'
import CheckBox from './CheckBox'
import CascadeSelector from './CascadeSelector'
import RelevanceSelect from './RelevanceSelect'
import SwitchSelector from './SwitchSelector'
import PersonSelector from './PersonSelector'
import AccountSelector from './AccountSelector'
import DeptSelector from './DeptSelector'
......@@ -11,6 +12,7 @@ const select = {
ComboBox,
RadioButton,
CheckBox,
SwitchSelector,
RelevanceSelect,
PersonSelector,
CascadeSelector,
......
src/core/widgets/settings/BooleanSwitch/index.js
View file @ a9f4e41a
......@@ -20,7 +20,7 @@ const BooleanSwitch = (props) => {
addons.setSchemaByPath('isMultiple', { ...schemas, isMultiple: false, hidden: false })
}
}
}, [addons, value])
}, [value])
return (
<Switch
......
src/core/widgets/settings/groupBase/NumerDefault/index.js
View file @ a9f4e41a
......@@ -8,7 +8,7 @@ const NumerDefault = (props) => {
return (
<InputNumber
value={value}
onChange={value => onChange(value)}
onChange={value => onChange(Number(value))}
/>
)
......
src/core/widgets/text/Coding/index.js
View file @ a9f4e41a
import React from 'react'
import { Input, Popover } from 'antd'
import { QrcodeOutlined } from '@ant-design/icons'
import QRcode from 'qrcode.react'
const Coding = (props) => {
const { value, onChange } = props
const content = (
<div>
{/* <QRcode value={<div style={{ color: 'red' }}>123</div>} /> */}
<QRcode src='https://www.runoob.com/w3cnote/javascript-qrcodejs-library.html' />
</div>
)
return (
<div>编码</div>
<div>
<Input
addonAfter={
<Popover content={content}>
<QrcodeOutlined />
</Popover>
}
onChange={e => onChange(e.target.value)}
/>
</div>
)
}
......
src/core/widgets/text/NumberInput/index.js
View file @ a9f4e41a
......@@ -7,8 +7,12 @@ const NumberInput = (props) => {
const { disabled, presetValue, placeholder, prefix, formatter } = schema
useEffect(() => {
onChange(presetValue)
}, [presetValue, formatter])
if (addons) {
addons.setValueByPath(addons.dataPath, Number(presetValue))
} else {
onChange(Number(presetValue))
}
}, [presetValue])
const inputChange = (value) => {
if (addons) {
......
src/main.less
View file @ a9f4e41a
@import '~antd/es/style/themes/default.less';
@disabledBgColor: rgb(248 ,250, 252);
@disabledBgColor: rgb(248, 250, 252);
@disabledColor: rgba(0, 0, 0, 0.7);
body #app {
background: transparent;
width: 100%;
......@@ -13,7 +12,6 @@ body #app {
@pandaXform-prefix-cls: ~'@{ant-prefix}-pandaXform';
.@{pandaXform-prefix-cls} {
.fr-generator-container .left-layout {
.left-item {
.anticon {
......@@ -21,101 +19,76 @@ body #app {
}
}
}
.@{ant-prefix}-tabs-content-holder {
height: 664px;
overflow: auto;
}
.fr-generator-container .right-layout {
width: 21rem;
}
.fr-container .fr-label-required {
margin: 0;
}
//表单组横线样式
} //表单组横线样式
.@{ant-prefix}-divider-horizontal {
margin: 15px 0;
}
//提示语样式
} //提示语样式
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder,
.@{ant-prefix}-select-selection-placeholder {
color: #dad9d9;
}
// 单行文本框
color: #dad9d9;
} // 单行文本框
input[disabled] {
color: @disabledColor;
cursor: default;
background: @disabledBgColor;
border: none;
}
// 多行文本框
} // 多行文本框
.@{ant-prefix}-input[disabled] {
color: @disabledColor;
box-shadow: none;
cursor: default;
background: @disabledBgColor;
border: none;
}
//数值输入框样式修改
} //数值输入框样式修改
.@{ant-prefix}-input-number-handler-wrap {
opacity: 1;
}
.@{ant-prefix}-input-number-disabled {
border: none;
}
// 时间选择器的disabled样式
} // 时间选择器的disabled样式
.@{ant-prefix}-picker-disabled {
cursor: default;
color: @disabledColor;
background-color: rgb(250,250,250);
& + span {
background-color: rgb(250, 250, 250);
&+span {
cursor: default;
}
}
// radio的disabled样式
} // radio的disabled样式
.@{ant-prefix}-radio-disabled {
cursor: default;
& + span {
&+span {
cursor: default;
color: @disabledColor;
}
.@{ant-prefix}-radio-inner {
cursor: default;
&:after {
background: rgba(0, 0, 0, 0.5);
}
}
}
//复选框disabled的样式
} //复选框disabled的样式
.@{ant-prefix}-checkbox-disabled {
& + span {
&+span {
cursor: default;
color: @disabledColor;
}
.@{ant-prefix}-checkbox-inner {
cursor: default;
&:after {
border-color: rgba(0, 0, 0, 0.5);
}
}
}
// 下拉选未选的disabled样式
} // 下拉选未选的disabled样式
.@{ant-prefix}-select-disabled.@{ant-prefix}-select:not(.@{ant-prefix}-select-customize-input) {
.@{ant-prefix}-select-selector {
color: @disabledColor;
......@@ -123,24 +96,19 @@ body #app {
border: none;
background: @disabledBgColor;
}
}
// 下拉选已选的disabled样式
} // 下拉选已选的disabled样式
.@{ant-prefix}-cascader-picker-disabled {
color: @disabledColor;
background-color: rgb(250,250,250);
background-color: rgb(250, 250, 250);
cursor: default;
border: none;
}
// 按钮的disabled样式
} // 按钮的disabled样式
.@{ant-prefix}-btn[disabled] {
text-shadow: none;
background: #ffffff;
border-color: #d9d9d9;
box-shadow: none;
cursor: default;
&:hover,
&:focus,
&:active {
......@@ -150,19 +118,15 @@ body #app {
border-color: #d9d9d9;
box-shadow: none;
}
}
// 上传组件的图片类型按钮的disabled样式
} // 上传组件的图片类型按钮的disabled样式
.@{ant-prefix}-upload-disabled {
color: @disabledColor;
cursor: default;
border: none;
.@{ant-prefix}-btn-default {
display: none;
display: none;
}
}
// 多选下的tag的disabled样式
} // 多选下的tag的disabled样式
.@{ant-prefix}-select-disabled.@{ant-prefix}-select-multiple {
.@{ant-prefix}-select-selection-item {
color: @disabledColor;
......@@ -171,15 +135,12 @@ body #app {
border: none;
}
}
.@{ant-prefix}-select-disabled.@{ant-prefix}-select:not(.@{ant-prefix}-select-customize-input) {
.@{ant-prefix}-select-selector input {
cursor: default;
}
}
// 时间选择框
.@{ant-prefix}-picker-input > input[disabled] {
} // 时间选择框
.@{ant-prefix}-picker-input>input[disabled] {
color: @disabledColor;
}
.@{ant-prefix}-picker-disabled {
......@@ -188,22 +149,18 @@ body #app {
display: none;
}
}
&-operate-group {
display: flex;
align-items: flex-end;
justify-content: flex-end;
padding: 10px 10px;
.@{pandaXform-prefix-cls}-operate-reset {
margin-right: 10px;
}
.pandaXform-text-area {
width: 100% !important;
}
}
&-group {
.@{pandaXform-prefix-cls}-title {
display: flex;
......@@ -211,56 +168,45 @@ body #app {
justify-content: center;
font-size: 16px;
}
i {
width: 3px;
height: 16px;
margin-right: 10px;
background-color: #337ab7;
}
.fr-label-object {
.fr-label-title {
padding: 10px 10px 0 0;
}
.fr-label-title::after {
content: '';
}
}
.b--black-20 {
border-color: rgba(232, 240, 237, 1);
}
}
.emphasis {
input {
font-weight: bold;
}
}
.notEditable {
input {
cursor: default;
}
}
.@{pandaXform-prefix-cls}-divider-horizontal {
margin: 10px;
&:first-child {
display: none !important;
}
}
.@{pandaXform-prefix-cls}-input[disabled] {
background-color: #ffffff60 !important;
}
/** @Tips: 在原有框架下，表单渲染后，使用的是flex自动布局，与calc来计算组件宽度，未设置固定宽度，导致页面布局错乱 */
.fr-content .fr-item-wrapper > div {
.fr-content .fr-item-wrapper>div {
width: 100%;
}
}
}
\ No newline at end of file
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