From 7af7f8775191217d367ed9015178b95be7bc3fce Mon Sep 17 00:00:00 2001 From: mzr Date: Sat, 9 Aug 2025 13:52:28 +0800 Subject: [PATCH] =?UTF-8?q?=E6=BA=90=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../common/components/BDFormItem/index.js | 39 +++++++++ .../common/components/BDFormItem/index.less | 42 ++++++++++ .../components/SimulatedTableFolding/index.js | 26 ++++++ .../SimulatedTableFolding/index.less | 81 +++++++++++++++++++ 4 files changed, 188 insertions(+) create mode 100644 src/uapbd/common/components/BDFormItem/index.js create mode 100644 src/uapbd/common/components/BDFormItem/index.less create mode 100644 src/uapbd/common/components/SimulatedTableFolding/index.js create mode 100644 src/uapbd/common/components/SimulatedTableFolding/index.less diff --git a/src/uapbd/common/components/BDFormItem/index.js b/src/uapbd/common/components/BDFormItem/index.js new file mode 100644 index 00000000..a978ecf8 --- /dev/null +++ b/src/uapbd/common/components/BDFormItem/index.js @@ -0,0 +1,39 @@ +/*IHTivaHGTSm9T7chEWjS8QMwpg1SIEMOeDuzFmjloOo=*/ +/* + * @Descripttion: + * @version: + * @Author: Chendch + * @Date: 2022-05-13 16:06:20 + * @LastEditors: Chendch + * @LastEditTime: 2022-05-20 13:29:38 + */ +import React, {PureComponent, Fragment} from "react"; +require("./index.less"); +export default class BDFormItem extends PureComponent{ + constructor(props){ + super(props); + } + + render() { + const {options = [], lineWrap = false, className="", style = {}} = this.props; + return ( +
+ {options.map( ele => { + return ( +
+
+ {ele.isRequired === true && *} + {ele.label} +
+
+ {ele.input} +
+
+ ) + })} +
+ ) + + } +} +/*IHTivaHGTSm9T7chEWjS8QMwpg1SIEMOeDuzFmjloOo=*/ \ No newline at end of file diff --git a/src/uapbd/common/components/BDFormItem/index.less b/src/uapbd/common/components/BDFormItem/index.less new file mode 100644 index 00000000..d0d60410 --- /dev/null +++ b/src/uapbd/common/components/BDFormItem/index.less @@ -0,0 +1,42 @@ +.uapbd-form-flex-container-row-container{ + display: flex; + align-items: center; + margin-bottom: 8px; +} +.uapbd-form-flex-contain{ + align-items: center; + display: flex; + flex: 1; + margin-bottom: 6px; +} +.uapbd-form-flex-label{ + width: 140px; + max-width: 140px; + min-width: 140px; + line-height: 18px; + padding-right: 16px; + text-align: right; + box-sizing: border-box; + color: #2b3441; + position: relative; + display: inline-block; + vertical-align: middle; + overflow-wrap: break-word; + white-space: pre-wrap; +} +.uapbd-form-flex-input{ + width: calc(~"100% - 140px"); + text-align: left; + padding-right: 8px; + position: relative; + box-sizing: border-box; + color: #2b344b; + display: inline-block; + vertical-align: middle; +} +.required-style { + position: relative; + color: red; + font-weight: 700; + margin-right: 5px; +} diff --git a/src/uapbd/common/components/SimulatedTableFolding/index.js b/src/uapbd/common/components/SimulatedTableFolding/index.js new file mode 100644 index 00000000..0f9581ff --- /dev/null +++ b/src/uapbd/common/components/SimulatedTableFolding/index.js @@ -0,0 +1,26 @@ +/*IHTivaHGTSm9T7chEWjS8QMwpg1SIEMOeDuzFmjloOo=*/ +import React, { Component } from "react"; +import { base } from 'nc-lightapp-front'; +const { NCCollapse } = base; + +require("./index.less"); +export default class SimulatedTableFolding extends Component { + constructor(props) { + super(props); + } + + render() { + const { options = [], lineWrap = false, className = "", style = {}, expanded = true, headerName = '', key = '', content = ``, expandHandle, extra, fieldid=''} = this.props; + return ( +
+ + + {content} + + +
+ ) + + } +} +/*IHTivaHGTSm9T7chEWjS8QMwpg1SIEMOeDuzFmjloOo=*/ \ No newline at end of file diff --git a/src/uapbd/common/components/SimulatedTableFolding/index.less b/src/uapbd/common/components/SimulatedTableFolding/index.less new file mode 100644 index 00000000..f975199a --- /dev/null +++ b/src/uapbd/common/components/SimulatedTableFolding/index.less @@ -0,0 +1,81 @@ +.simulatfold-box { + margin: 0 8px 4px; + border: 1px solid #c6ccd7; + border-radius: 4px; + + .wui-collapse-title { + line-height: 36px; + } + + .wui-collapse-arrow.wui-collapse-icon-position-left .wui-collapse-heading { + height: 36px; + line-height: 36px; + } + + .wui-collapse-collapse { + .wui-collapse-collapse { + // padding: 8px; + } + } + + .wui-collapse .wui-collapse-body { + border-bottom: none !important; + + } + + .base-collapse-body { + padding: 0; + } + + .wui-collapse-heading { + border: none !important; + + .uf-arrow-down { + font-family: iconfont !important; + border-radius: 1px; + font-size: 12px; + height: 14px; + width: 14px; + background-color: #edf2f4; + display: inline-block; + vertical-align: middle; + color: #5e6d8c; + text-align: center; + left: 12px; + + &:before { + content: "\E6B7"; + } + } + + .collapsible-header { + display: flex; + line-height: 36px; + margin: 0 16px 0 10px; + color: #475a7a; + position: relative; + cursor: pointer; + vertical-align: middle; + border-radius: 0; + outline: none; + } + } +} + +// 暗黑模式样式适配 +.nc-lightapp-front-black { + .simulatfold-box { + border: aliceblue; + border: 1px solid #39393f; + + .uf-arrow-down { + background: #696979; + color: #C9C9C9 !important; + } + + .collapsible-header { + color: #b0b0b0 !important; + } + + } +} \ No newline at end of file