From 96916ae2777d63b008435dd83d89f77e2485f51d Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期五, 24 五月 2024 23:11:35 +0800
Subject: [PATCH] 2024-05-24
---
src/menu/components/form/simple-form/index.jsx | 4
src/menu/modalconfig/formfork/index.scss | 96 ++++++++++++++++++++++++++++++-
src/menu/components/form/step-form/index.jsx | 4
src/menu/modalconfig/index.jsx | 4
src/menu/components/form/tab-form/index.jsx | 4
src/menu/modalconfig/formfork/index.jsx | 49 +++++-----------
6 files changed, 114 insertions(+), 47 deletions(-)
diff --git a/src/menu/components/form/simple-form/index.jsx b/src/menu/components/form/simple-form/index.jsx
index 245b90b..07e1e2f 100644
--- a/src/menu/components/form/simple-form/index.jsx
+++ b/src/menu/components/form/simple-form/index.jsx
@@ -19,7 +19,7 @@
const CardComponent = asyncComponent(() => import('@/templates/modalconfig/dragelement'))
const MobCardComponent = asyncComponent(() => import('@/mob/components/formdragelement'))
const FormAction = asyncComponent(() => import('../formaction'))
-// const FormFork = asyncComponent(() => import('@/menu/modalconfig/formfork'))
+const FormFork = asyncComponent(() => import('@/menu/modalconfig/formfork'))
const NormalHeader = asyncComponent(() => import('@/menu/components/share/normalheader'))
const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent'))
const PasteForms = asyncIconComponent(() => import('@/menu/components/share/pasteforms'))
@@ -562,7 +562,7 @@
} trigger="hover">
<SwapOutlined />
</Popover> : null}
- {/* <FormFork forms={card.subcards[0].fields}/> */}
+ <FormFork forms={card.subcards[0].fields}/>
{/* <CopyOutlined title="澶嶅埗" onClick={this.triggerCopy} /> */}
<Switch checkedChildren="寮�" unCheckedChildren="鍏�" defaultChecked={this.state.showField} onChange={(val) => this.setState({showField: val})} />
</div>
diff --git a/src/menu/components/form/step-form/index.jsx b/src/menu/components/form/step-form/index.jsx
index 82463e1..4395d59 100644
--- a/src/menu/components/form/step-form/index.jsx
+++ b/src/menu/components/form/step-form/index.jsx
@@ -20,7 +20,7 @@
const MobCardComponent = asyncComponent(() => import('@/mob/components/formdragelement'))
const FormTitle = asyncComponent(() => import('../dragtitle'))
const FormAction = asyncComponent(() => import('../formaction'))
-// const FormFork = asyncComponent(() => import('@/menu/modalconfig/formfork'))
+const FormFork = asyncComponent(() => import('@/menu/modalconfig/formfork'))
const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent'))
const PasteComponent = asyncIconComponent(() => import('@/menu/components/share/pastecomponent'))
const FieldsComponent = asyncComponent(() => import('@/templates/sharecomponent/fieldscomponent'))
@@ -677,7 +677,7 @@
} trigger="hover">
<SwapOutlined />
</Popover> : null}
- {/* <FormFork forms={group.fields}/> */}
+ <FormFork forms={group.fields}/>
{/* <CopyOutlined title="澶嶅埗" onClick={this.triggerCopy} /> */}
<Switch checkedChildren="寮�" unCheckedChildren="鍏�" defaultChecked={this.state.showField} onChange={(val) => this.setState({showField: val})} />
</div>
diff --git a/src/menu/components/form/tab-form/index.jsx b/src/menu/components/form/tab-form/index.jsx
index 8671d15..c895e37 100644
--- a/src/menu/components/form/tab-form/index.jsx
+++ b/src/menu/components/form/tab-form/index.jsx
@@ -20,7 +20,7 @@
const MobCardComponent = asyncComponent(() => import('@/mob/components/formdragelement'))
const FormTitle = asyncComponent(() => import('../dragtitle'))
const FormAction = asyncComponent(() => import('../formaction'))
-// const FormFork = asyncComponent(() => import('@/menu/modalconfig/formfork'))
+const FormFork = asyncComponent(() => import('@/menu/modalconfig/formfork'))
const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent'))
const PasteComponent = asyncIconComponent(() => import('@/menu/components/share/pastecomponent'))
const FieldsComponent = asyncComponent(() => import('@/templates/sharecomponent/fieldscomponent'))
@@ -680,7 +680,7 @@
} trigger="hover">
<SwapOutlined />
</Popover> : null}
- {/* <FormFork forms={group.fields}/> */}
+ <FormFork forms={group.fields}/>
{/* <CopyOutlined title="澶嶅埗" onClick={this.triggerCopy} /> */}
<Switch checkedChildren="寮�" unCheckedChildren="鍏�" defaultChecked={this.state.showField} onChange={(val) => this.setState({showField: val})} />
</div>
diff --git a/src/menu/modalconfig/formfork/index.jsx b/src/menu/modalconfig/formfork/index.jsx
index 30a865c..b7d8834 100644
--- a/src/menu/modalconfig/formfork/index.jsx
+++ b/src/menu/modalconfig/formfork/index.jsx
@@ -15,7 +15,6 @@
visible: false,
empty: false,
ctrlFields: [],
- ctrlRFields: [],
subFields: [],
subRFields: [],
linkFields: [],
@@ -169,14 +168,6 @@
delete item.tabField
}
- if (item.supField) {
- if (!fieldMap.has(item.supField)) {
- delete item.supField
- delete item.supvalue
- } else {
- item.supLabel = fieldMap.get(item.supField).label
- }
- }
if (item.linkField) {
if (!fieldMap.has(item.linkField)) {
item.linkLabel = '瀛楁闆�'
@@ -186,6 +177,7 @@
}
delete item.enter
+ delete item.supField
delete item.multiple
delete item.linkSubField
@@ -215,7 +207,6 @@
let _n = [...fieldMap.values()]
let ctrlFields = []
- let ctrlRFields = []
let subFields = []
let subRFields = []
let _linkFields = []
@@ -233,17 +224,6 @@
tail: `${m.values}`
}
})
- })
- }
- if (cell.supField) {
- ctrlRFields.push({
- field: ['hint', 'split', 'formula'].includes(cell.type) ? '' : cell.field,
- label: cell.label,
- children: [{
- field: cell.supField,
- label: cell.supLabel,
- tail: `${cell.supvalue}`
- }]
})
}
@@ -296,7 +276,6 @@
forward: 'true',
empty: type === '',
ctrlFields,
- ctrlRFields,
subFields,
subRFields,
linkFields: _linkFields,
@@ -306,7 +285,7 @@
}
getcontent = () => {
- const { ctrlFields, ctrlRFields, subFields, subRFields, linkFields, tabFields, visible, type, forward } = this.state
+ const { ctrlFields, subFields, subRFields, linkFields, tabFields, visible, type, forward } = this.state
if (!visible) return null
@@ -320,11 +299,7 @@
let items = []
if (type === 'ctrl') {
- if (forward === 'true') {
- items = ctrlFields
- } else {
- items = ctrlRFields
- }
+ items = ctrlFields
} else if (type === 'input') {
if (forward === 'true') {
items = subFields
@@ -349,7 +324,7 @@
{item.children.map((cell, n) => <div className="fork-item" key={n}>
<span>{cell.label}</span>
<span>{cell.field}</span>
- {cell.tail ? <span className="fork-tail">{cell.tail}</span> : null}
+ {cell.tail ? <span title={cell.tail} className="fork-tail">{cell.tail}</span> : null}
</div>)}
</div>
</div>
@@ -357,11 +332,17 @@
return <div>
{header}
- {type === 'ctrl' || type === 'input' ? <div className="forward-wrap"><Radio.Group value={forward} onChange={(e) => this.setState({forward: e.target.value})}>
- <Radio value="true">姝ｅ悜</Radio>
- <Radio value="false">鍙嶅悜</Radio>
- </Radio.Group></div> : null}
- <div className="fork-wrap">
+ <div className="forward-wrap">
+ {type === 'ctrl' ? <div className="legend"><span>涓昏〃鍗�</span><span>鍙楁帶琛ㄥ崟</span></div> : null}
+ {type === 'input' ? <div className="legend"><span>涓昏〃鍗�</span><span>琚～鍏ヨ〃鍗�</span></div> : null}
+ {type === 'link' ? <div className="legend"><span>涓婄骇琛ㄥ崟</span><span>涓嬬骇琛ㄥ崟</span></div> : null}
+ {type === 'switch' ? <div className="legend"><span>婧愯〃鍗�</span><span>璺宠浆琛ㄥ崟</span></div> : null}
+ {type === 'input' ? <Radio.Group value={forward} onChange={(e) => this.setState({forward: e.target.value})}>
+ <Radio value="true">姝ｅ悜</Radio>
+ <Radio value="false">鍙嶅悜</Radio>
+ </Radio.Group> : null}
+ </div>
+ <div className={'fork-wrap fork-' + forward}>
{content}
</div>
</div>
diff --git a/src/menu/modalconfig/formfork/index.scss b/src/menu/modalconfig/formfork/index.scss
index c4ba75d..8881b09 100644
--- a/src/menu/modalconfig/formfork/index.scss
+++ b/src/menu/modalconfig/formfork/index.scss
@@ -29,33 +29,114 @@
}
}
.forward-wrap {
- text-align: right;
+ position: relative;
padding: 5px;
+
+ .ant-radio-group {
+ position: absolute;
+ top: 5px;
+ right: 0px;
+ }
+
+ .legend {
+ span {
+ display: inline-block;
+ margin-right: 20px;
+ position: relative;
+ margin-left: 60px;
+ }
+ span::before {
+ content: ' ';
+ display: block;
+ position: absolute;
+ width: 50px;
+ height: 6px;
+ left: -55px;
+ top: 10px;
+ }
+ span:first-child::before {
+ background: #8E44AD;
+ }
+ span:last-child::before {
+ background: rgb(38, 194, 129);
+ }
+ }
}
.fork-wrap {
padding-top: 15px;
}
+ .fork-wrap.fork-false {
+ .fork-item-wrap {
+ .fork-left {
+ .fork-item {
+ border-color: rgb(38, 194, 129);
+ color: #26c281;
+ }
+ }
+ .fork-right {
+ .fork-item {
+ border-color: #8E44AD;
+ color: #8E44AD;
+ }
+ }
+ }
+ }
.fork-item-wrap {
display: inline-flex;
width: 50%;
- margin-bottom: 15px;
+ margin-bottom: 20px;
.fork-left {
+ position: relative;
display: flex;
width: 50%;
align-items: center;
+
+ .fork-item {
+ border-color: #8E44AD;
+ color: #8E44AD;
+ }
+ .fork-item::before {
+ content: '';
+ display: block;
+ border-top: 1px solid #bcbcbc;
+ position: absolute;
+ top: 28px;
+ width: 58px;
+ right: -58px;
+ }
}
.fork-right {
+ position: relative;
display: inline-block;
width: 50%;
+ padding-left: 30px;
+ .fork-item {
+ border-color: rgb(38, 194, 129);
+ color: #26c281;
+ }
.fork-item:not(:last-child) {
margin-bottom: 10px;
}
.fork-item::before {
content: '';
display: block;
+ border-top: 1px solid #bcbcbc;
+ position: absolute;
+ top: 28px;
+ width: 56px;
+ left: -56px;
}
+ }
+ .fork-right::before {
+ content: '';
+ display: block;
+ border-left: 1px solid #bcbcbc;
+ position: absolute;
+ top: 29px;
+ bottom: 27px;
+ left: -26px;
}
.fork-item {
@@ -64,9 +145,8 @@
width: 130px;
border: 1px solid #bcbcbc;
padding: 5px 10px;
- height: 55px;
+ height: 56px;
border-radius: 4px;
- color: rgba(0, 0, 0, 0.85);
span:not(.fork-tail) {
display: block;
white-space: nowrap;
@@ -76,8 +156,14 @@
.fork-tail {
display: inline-block;
position: absolute;
+ color: rgba(0, 0, 0, 0.85);
top: 10px;
- right: 140px;
+ right: 135px;
+ max-width: 45px;
+ display: block;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
}
}
}
diff --git a/src/menu/modalconfig/index.jsx b/src/menu/modalconfig/index.jsx
index 9124c01..6f40e02 100644
--- a/src/menu/modalconfig/index.jsx
+++ b/src/menu/modalconfig/index.jsx
@@ -21,7 +21,7 @@
const TableComponent = asyncComponent(() => import('./tablecomponent'))
const ModalForm = asyncComponent(() => import('@/templates/zshare/modalform'))
const PasteForms = asyncComponent(() => import('@/menu/components/share/pasteforms'))
-// const FormFork = asyncComponent(() => import('@/menu/modalconfig/formfork'))
+const FormFork = asyncComponent(() => import('@/menu/modalconfig/formfork'))
const DragElement = asyncComponent(() => import('@/templates/modalconfig/dragelement'))
const FieldsComponent = asyncComponent(() => import('@/templates/sharecomponent/fieldscomponent'))
@@ -413,7 +413,7 @@
} trigger="hover">
<SwapOutlined />
</Popover>
- {/* <FormFork forms={config.fields}/> */}
+ <FormFork forms={config.fields}/>
<CopyOutlined title="澶嶅埗" onClick={this.triggerCopy} />
<Switch checkedChildren="寮�" unCheckedChildren="鍏�" defaultChecked={this.state.showField} onChange={(val) => this.setState({showField: val})} />
</div>
--
Gitblit v1.8.0