Commit 33628a00 authored by 田翔's avatar 田翔

fix: 样式组件修改

parent e1d68d4e
{ {
"name": "panda-xform", "name": "panda-xform",
"version": "2.6.8", "version": "2.7.0",
"description": "2.6.8: 修改版本号", "description": "2.7.0: 样式组件修改",
"keywords": [ "keywords": [
"panda-xform" "panda-xform"
], ],
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
"antd": "4.20.7", "antd": "4.20.7",
"antd-img-crop": "^3.14.1", "antd-img-crop": "^3.14.1",
"form-render": "1.14.7", "form-render": "1.14.7",
"fr-generator": "2.8.3", "fr-generator": "2.8.4",
"http-proxy-middleware": "^1.0.6", "http-proxy-middleware": "^1.0.6",
"moment": "^2.29.1", "moment": "^2.29.1",
"qrcode.react": "^3.1.0", "qrcode.react": "^3.1.0",
...@@ -126,4 +126,4 @@ ...@@ -126,4 +126,4 @@
"publishConfig": { "publishConfig": {
"registry": "https://g.civnet.cn:4873" "registry": "https://g.civnet.cn:4873"
} }
} }
\ No newline at end of file
...@@ -8,6 +8,7 @@ import { saveTableConfig, GetTableConfigJson } from '../../apis/process' ...@@ -8,6 +8,7 @@ import { saveTableConfig, GetTableConfigJson } from '../../apis/process'
import FormRender from '../FormRender' import FormRender from '../FormRender'
import { isObject } from '../../utils' import { isObject } from '../../utils'
import Drag from '../components/Drag' import Drag from '../components/Drag'
import styles from '../../main.less'
const FormDesigner = (props, ref) => { const FormDesigner = (props, ref) => {
...@@ -218,10 +219,10 @@ const FormDesigner = (props, ref) => { ...@@ -218,10 +219,10 @@ const FormDesigner = (props, ref) => {
} }
return ( return (
<div className={prefixCls} style={{ width: '100%', height: '100%', background: 'white' }}> <div className={styles.pandaXform} style={{ width: '100%', height: '100%', background: 'white' }}>
<div style={{ height: '100%' }}> <div style={{ height: '100%' }}>
<Generator <Generator
configProvider={{ prefixCls: prefixClsPandaXform }} // configProvider={{ prefixCls: prefixClsPandaXform }}
mapping={{ mapping={{
object: 'Header', object: 'Header',
}} }}
......
...@@ -10,6 +10,7 @@ import { ConfigProvider, Spin } from 'antd' ...@@ -10,6 +10,7 @@ import { ConfigProvider, Spin } from 'antd'
import widgets from '../widgets' import widgets from '../widgets'
import { isObject } from '../../utils' import { isObject } from '../../utils'
import { getWatch } from './watch' import { getWatch } from './watch'
import styles from '../../main.less'
const XRender = (props, ref) => { const XRender = (props, ref) => {
...@@ -102,7 +103,7 @@ const XRender = (props, ref) => { ...@@ -102,7 +103,7 @@ const XRender = (props, ref) => {
} }
return ( return (
<div className={prefixCls}> <div className={styles.pandaXform}>
<Spin spinning={loading} tip="Loading..."> <Spin spinning={loading} tip="Loading...">
<FormRender <FormRender
configProvider={{ prefixCls: pandaXform }} configProvider={{ prefixCls: pandaXform }}
......
...@@ -11,7 +11,9 @@ export const debounce = (fn) => { ...@@ -11,7 +11,9 @@ export const debounce = (fn) => {
clearTimeout(t) clearTimeout(t)
} }
t = setTimeout(function () { t = setTimeout(function () {
fn.call(context, ...args) if (typeof fn === 'function') {
fn.call(context, ...args)
}
}, 300) }, 300)
} }
} }
......
...@@ -2,8 +2,7 @@ import React, { useEffect, useContext } from 'react' ...@@ -2,8 +2,7 @@ import React, { useEffect, useContext } from 'react'
import { Input, Popover, ConfigProvider } from 'antd' import { Input, Popover, ConfigProvider } from 'antd'
import { QrcodeOutlined } from '@ant-design/icons' import { QrcodeOutlined } from '@ant-design/icons'
import QRcode from 'qrcode.react' import QRcode from 'qrcode.react'
import './index.less' import styles from './index.less'
import moment from 'moment'
function toUtf8(str) { function toUtf8(str) {
let out = '' let out = ''
...@@ -53,7 +52,7 @@ const Coding = (props) => { ...@@ -53,7 +52,7 @@ const Coding = (props) => {
) )
return ( return (
<div className={`${prefixCls}-input`} isdisabled={JSON.stringify(disabled)}> <div className={styles.coding} isdisabled={JSON.stringify(disabled)}>
<Input <Input
onChange={inputChange} onChange={inputChange}
value={value} value={value}
......
@import '~antd/es/style/themes/default.less'; @import '~antd/es/style/themes/default.less';
@pandaXform: ~'@{ant-prefix}-pandaXform'; .coding {
.@{pandaXform} { &[isdisabled='true'] {
.@{pandaXform}-input[isdisabled='true'] {
.@{ant-prefix}-input-group-addon { .@{ant-prefix}-input-group-addon {
border: 1px solid #e9e9e9; border: 1px solid #e9e9e9;
} }
......
...@@ -3,7 +3,7 @@ import { Input, message, ConfigProvider } from 'antd' ...@@ -3,7 +3,7 @@ import { Input, message, ConfigProvider } from 'antd'
import Icon, { PlusOutlined } from '@ant-design/icons' import Icon, { PlusOutlined } from '@ant-design/icons'
import * as icons from '@ant-design/icons' import * as icons from '@ant-design/icons'
import { GetFieldValueFromTable } from '../../../../apis/process' import { GetFieldValueFromTable } from '../../../../apis/process'
import './index.less' import styles from './index.less'
const iconList = Object.keys(icons).filter((item) => typeof icons[item] === 'object') const iconList = Object.keys(icons).filter((item) => typeof icons[item] === 'object')
...@@ -24,8 +24,6 @@ const debounce = (fn) => { ...@@ -24,8 +24,6 @@ const debounce = (fn) => {
const TextInput = (props) => { const TextInput = (props) => {
const userInfo = window?.globalConfig?.userInfo || { fullName: '【本人姓名】', depart: { name: '【本人部门】' } } const userInfo = window?.globalConfig?.userInfo || { fullName: '【本人姓名】', depart: { name: '【本人部门】' } }
const { getPrefixCls } = useContext(ConfigProvider.ConfigContext)
const prefixCls = getPrefixCls('pandaXform')
const { value, onChange, schema, addons } = props const { value, onChange, schema, addons } = props
const { title, disabled, placeholder, presetValue, addonBefore, addonAfter, maxLength, rules, uniqueVerify, tableName, fieldName, isStoreID } = schema const { title, disabled, placeholder, presetValue, addonBefore, addonAfter, maxLength, rules, uniqueVerify, tableName, fieldName, isStoreID } = schema
...@@ -95,7 +93,7 @@ const TextInput = (props) => { ...@@ -95,7 +93,7 @@ const TextInput = (props) => {
}, [uniqueVerify, tableName, fieldName]) }, [uniqueVerify, tableName, fieldName])
return ( return (
<div className={`${prefixCls}-input`} isdisabled={JSON.stringify(disabled)}> <div className={styles.textInput} isdisabled={JSON.stringify(disabled)}>
<Input <Input
disabled={disabled} disabled={disabled}
value={valueShow} value={valueShow}
......
@import '~antd/es/style/themes/default.less'; @import '~antd/es/style/themes/default.less';
@pandaXform: ~'@{ant-prefix}-pandaXform'; .textInput {
.@{pandaXform} { &[isdisabled='true'] {
.@{pandaXform}-input[isdisabled='true'] {
.@{ant-prefix}-input-group-addon { .@{ant-prefix}-input-group-addon {
border: 1px solid #e9e9e9; border: 1px solid #e9e9e9;
} }
......
...@@ -10,8 +10,8 @@ body #app { ...@@ -10,8 +10,8 @@ body #app {
} }
} }
@pandaXform-prefix-cls: ~'@{ant-prefix}-pandaXform'; // @pandaXform-prefix-cls: ~'@{ant-prefix}-pandaXform';
.@{pandaXform-prefix-cls} { .pandaXform {
background: white; background: white;
.fr-generator-container .left-layout { .fr-generator-container .left-layout {
.left-item { .left-item {
...@@ -165,21 +165,20 @@ body #app { ...@@ -165,21 +165,20 @@ body #app {
display: flex; display: flex;
align-items: flex-end; align-items: flex-end;
justify-content: flex-end; justify-content: flex-end;
padding: 10px 10px; padding: 10px 10px; // .@{pandaXform-prefix-cls}-operate-reset {
.@{pandaXform-prefix-cls}-operate-reset { // margin-right: 10px;
margin-right: 10px; // }
} // .pandaXform-text-area {
.pandaXform-text-area { // width: 100% !important;
width: 100% !important; // }
}
} }
&-group { &-group {
.@{pandaXform-prefix-cls}-title { // .@{pandaXform-prefix-cls}-title {
display: flex; // display: flex;
align-items: center; // align-items: center;
justify-content: center; // justify-content: center;
font-size: 16px; // font-size: 16px;
} // }
i { i {
width: 3px; width: 3px;
height: 16px; height: 16px;
...@@ -207,16 +206,15 @@ body #app { ...@@ -207,16 +206,15 @@ body #app {
input { input {
cursor: default; cursor: default;
} }
} } // .@{pandaXform-prefix-cls}-divider-horizontal {
.@{pandaXform-prefix-cls}-divider-horizontal { // margin: 10px;
margin: 10px; // &:first-child {
&:first-child { // display: none !important;
display: none !important; // }
} // }
} // .@{pandaXform-prefix-cls}-input[disabled] {
.@{pandaXform-prefix-cls}-input[disabled] { // background-color: #ffffff60 !important;
background-color: #ffffff60 !important; // }
}
/** @Tips: 在原有框架下,表单渲染后,使用的是flex自动布局,与calc来计算组件宽度,未设置固定宽度,导致页面布局错乱 */ /** @Tips: 在原有框架下,表单渲染后,使用的是flex自动布局,与calc来计算组件宽度,未设置固定宽度,导致页面布局错乱 */
.fr-content .fr-item-wrapper>div { .fr-content .fr-item-wrapper>div {
width: 100%; width: 100%;
......
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