From 8f6b3d26bde4e22773cc53386dfbae669a7472ed Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期二, 13 十月 2020 09:16:21 +0800
Subject: [PATCH] 2020-10-13
---
src/tabviews/custom/components/card/cardcellList/index.jsx | 128 ++++++++++--
src/menu/components/card/cardcellcomponent/index.jsx | 8
src/assets/img/prev.png | 0
src/assets/img/next.png | 0
src/tabviews/custom/components/card/cardItem/index.jsx | 6
src/menu/actioncomponent/actionform/index.jsx | 32 ++
src/menu/components/card/cardcellcomponent/elementform/index.jsx | 17 +
src/menu/components/card/cardcellcomponent/dragaction/card.jsx | 2
src/menu/components/card/cardcellcomponent/formconfig.jsx | 84 ++++----
src/tabviews/custom/components/card/cardcellList/index.scss | 40 ----
src/tabviews/custom/components/card/data-card/index.scss | 104 ++++++++++
src/tabviews/custom/components/card/data-card/index.jsx | 53 ++++
src/utils/utils.js | 82 ++++----
13 files changed, 382 insertions(+), 174 deletions(-)
diff --git a/src/assets/img/next.png b/src/assets/img/next.png
new file mode 100644
index 0000000..be5cb7c
--- /dev/null
+++ b/src/assets/img/next.png
Binary files differ
diff --git a/src/assets/img/prev.png b/src/assets/img/prev.png
new file mode 100644
index 0000000..bab6ae1
--- /dev/null
+++ b/src/assets/img/prev.png
Binary files differ
diff --git a/src/menu/actioncomponent/actionform/index.jsx b/src/menu/actioncomponent/actionform/index.jsx
index 45f53e9..f71386c 100644
--- a/src/menu/actioncomponent/actionform/index.jsx
+++ b/src/menu/actioncomponent/actionform/index.jsx
@@ -24,6 +24,7 @@
class MainSearch extends Component {
static propTpyes = {
dict: PropTypes.object, // 瀛楀吀椤�
+ type: PropTypes.any, // type涓�"card"鏃讹紝鍙彲閫夊崟琛屾垨涓嶉�夎
setting: PropTypes.object, // 椤甸潰璁剧疆
formlist: PropTypes.any, // 琛ㄥ崟淇℃伅
card: PropTypes.any, // 鎸夐挳淇℃伅
@@ -78,7 +79,7 @@
UNSAFE_componentWillMount () {
- const { card } = this.props
+ const { card, type } = this.props
let _menulist = this.props.formlist.filter(form => form.key === 'linkmenu')[0] || ''
let _opentype = card.OpenType // 鎵撳紑鏂瑰紡
@@ -102,7 +103,9 @@
} else if (item.key === 'icon') {
item.options = btnIcons
} else if (item.key === 'Ot') {
- if (card.pageTemplate === 'pay') { // 琛岀骇鎸夐挳銆佹敮浠樻寜閽紝鍙兘閫夊崟琛�
+ if (type === 'card') {
+ item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value))
+ } else if (card.pageTemplate === 'pay') { // 琛岀骇鎸夐挳銆佹敮浠樻寜閽紝鍙兘閫夊崟琛�
item.options = this.state.requireOptions.filter(op => ['requiredSgl'].includes(op.value))
} else if (['innerpage', 'blank', 'tab', 'popview', 'excelIn'].includes(_opentype)) {
item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value))
@@ -187,7 +190,7 @@
* 3銆佸垏鎹㈡爣绛剧被鍨嬶紝閲嶇疆鍙�夋爣绛�
*/
openTypeChange = (key, value) => {
- const { card } = this.props
+ const { card, type } = this.props
if (key === 'OpenType') {
let _options = this.getOptions(value, this.state.interType, this.state.funcType, card.pageTemplate)
@@ -202,7 +205,9 @@
if (item.key === 'intertype') {
_fieldval.intertype = this.state.interType
} else if (item.key === 'Ot') {
- if (['innerpage', 'blank', 'tab', 'popview'].includes(value)) {
+ if (type === 'card') {
+ item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value))
+ } else if (['innerpage', 'blank', 'tab', 'popview'].includes(value)) {
item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value))
_fieldval.Ot = 'requiredSgl'
} else if (value === 'excelIn') {
@@ -257,7 +262,11 @@
if (item.key === 'intertype') {
_fieldval.intertype = this.state.interType
} else if (item.key === 'Ot' && value === 'print') {
- item.options = this.state.requireOptions
+ if (type === 'card') {
+ item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value))
+ } else {
+ item.options = this.state.requireOptions
+ }
}
return item
@@ -269,7 +278,9 @@
let _fieldval = {}
this.setState({
formlist: this.state.formlist.map(item => {
- if (item.key === 'Ot' && value === 'insert') {
+ if (item.key === 'Ot' && type === 'card') {
+ item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value))
+ } else if (item.key === 'Ot' && value === 'insert') {
item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl', 'required'].includes(op.value))
} else if (item.key === 'Ot') {
item.options = this.state.requireOptions
@@ -313,6 +324,8 @@
if (value === 'pay') {
item.options = this.state.requireOptions.filter(op => ['requiredSgl'].includes(op.value))
_fieldval.Ot = 'requiredSgl'
+ } else if (type === 'card') {
+ item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value))
} else {
item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value))
}
@@ -327,6 +340,7 @@
}
onChange = (e, key) => {
+ const { type } = this.props
const { openType } = this.state
let value = e.target.value
@@ -343,7 +357,11 @@
} else if (item.key === 'sysInterface') {
item.initVal = 'false'
} else if (item.key === 'Ot') {
- item.options = this.state.requireOptions
+ if (type === 'card') {
+ item.options = this.state.requireOptions.filter(op => ['notRequired', 'requiredSgl'].includes(op.value))
+ } else {
+ item.options = this.state.requireOptions
+ }
}
return item
})
diff --git a/src/menu/components/card/cardcellcomponent/dragaction/card.jsx b/src/menu/components/card/cardcellcomponent/dragaction/card.jsx
index 3aac343..ea6fb70 100644
--- a/src/menu/components/card/cardcellcomponent/dragaction/card.jsx
+++ b/src/menu/components/card/cardcellcomponent/dragaction/card.jsx
@@ -39,7 +39,7 @@
const getContent = () => {
if (card.eleType === 'text' || card.eleType === 'number') {
- let val = `${card.prefix || ''}${card.value || ''}${card.postfix || ''}`
+ let val = `${card.prefix || ''}${card.datatype === 'static' ? (card.value || '') : (card.field || '')}${card.postfix || ''}`
return val
} else if (card.eleType === 'icon') {
return (<Icon type={card.icon}/>)
diff --git a/src/menu/components/card/cardcellcomponent/elementform/index.jsx b/src/menu/components/card/cardcellcomponent/elementform/index.jsx
index 8f9719d..2a4422b 100644
--- a/src/menu/components/card/cardcellcomponent/elementform/index.jsx
+++ b/src/menu/components/card/cardcellcomponent/elementform/index.jsx
@@ -9,11 +9,11 @@
import './index.scss'
const cardTypeOptions = {
- text: ['eleType', 'datatype', 'value', 'format', 'fontSize', 'fontWeight', 'width', 'height', 'align', 'padding', 'prefix', 'postfix'],
- number: ['eleType', 'datatype', 'value', 'format', 'fontSize', 'fontWeight', 'width', 'height', 'align', 'padding', 'prefix', 'postfix'],
+ text: ['eleType', 'datatype', 'format', 'fontSize', 'fontWeight', 'width', 'height', 'align', 'padding', 'prefix', 'postfix'],
+ number: ['eleType', 'datatype', 'format', 'fontSize', 'fontWeight', 'width', 'height', 'align', 'padding', 'prefix', 'postfix'],
picture: ['eleType', 'datatype', 'width', 'lenWidRadio', 'radius', 'padding', 'url'],
- icon: ['eleType', 'icon', 'fontSize', 'width', 'height', 'align', 'padding', 'tooltip'],
- link: ['eleType', 'datatype', 'value', 'labelfield', 'fontSize', 'width', 'height', 'align', 'padding', 'prefix'],
+ icon: ['eleType', 'icon', 'datatype', 'fontSize', 'width', 'align', 'padding'],
+ link: ['eleType', 'datatype', 'labelfield', 'fontSize', 'width', 'height', 'align', 'padding', 'prefix'],
slider: ['eleType', 'field', 'width', 'color', 'padding', 'maxValue'],
splitline: ['eleType', 'color', 'width', 'padding'],
}
@@ -36,7 +36,6 @@
UNSAFE_componentWillMount () {
const { card, config } = this.props
-
let _options = this.getOptions(card.eleType, card.datatype)
this.setState({
@@ -83,6 +82,14 @@
if (['text', 'number', 'picture', 'link'].includes(eleType)) {
if (datatype === 'dynamic') {
_options.push('field')
+ } else if (eleType !== 'picture') {
+ _options.push('value')
+ }
+ } else if (eleType === 'icon') {
+ if (datatype === 'dynamic') {
+ _options.push('field')
+ } else {
+ _options.push('tooltip')
}
}
diff --git a/src/menu/components/card/cardcellcomponent/formconfig.jsx b/src/menu/components/card/cardcellcomponent/formconfig.jsx
index 81020a7..7a33eda 100644
--- a/src/menu/components/card/cardcellcomponent/formconfig.jsx
+++ b/src/menu/components/card/cardcellcomponent/formconfig.jsx
@@ -29,10 +29,51 @@
]
},
{
+ type: 'select',
+ key: 'icon',
+ label: '鍥炬爣',
+ initVal: card.icon,
+ required: true,
+ options: [
+ { value: 'question-circle', text: 'question-circle'},
+ { value: 'alert', text: 'alert'},
+ { value: 'cloud', text: 'cloud'},
+ { value: 'eye', text: 'eye'},
+ { value: 'eye-invisible', text: 'eye-invisible'},
+ { value: 'android', text: 'android'},
+ { value: 'apple', text: 'apple'},
+ { value: 'windows', text: 'windows'},
+ { value: 'ie', text: 'ie'},
+ { value: 'chrome', text: 'chrome'},
+ { value: 'github', text: 'github'},
+ { value: 'aliwangwang', text: 'aliwangwang'},
+ { value: 'dingding', text: 'dingding'},
+ { value: 'wechat', text: 'wechat'},
+ { value: 'alipay', text: 'alipay'},
+ { value: 'weibo-square', text: 'weibo-square'},
+ { value: 'weibo-circle', text: 'weibo-circle'},
+ { value: 'taobao-circle', text: 'taobao-circle'},
+ { value: 'weibo', text: 'weibo'},
+ { value: 'twitter', text: 'twitter'},
+ { value: 'youtube', text: 'youtube'},
+ { value: 'alipay-circle', text: 'alipay-circle'},
+ { value: 'taobao', text: 'taobao'},
+ { value: 'skype', text: 'skype'},
+ { value: 'qq', text: 'qq'},
+ { value: 'gitlab', text: 'gitlab'},
+ { value: 'zhihu', text: 'zhihu'},
+ { value: 'slack', text: 'slack'},
+ { value: 'sketch', text: 'sketch'},
+ { value: 'yahoo', text: 'yahoo'},
+ { value: 'reddit', text: 'reddit'},
+ { value: 'dribbble', text: 'dribbble'},
+ ]
+ },
+ {
type: 'radio',
key: 'datatype',
label: '鏁版嵁绫诲瀷',
- initVal: card.datatype || 'dynamic',
+ initVal: card.datatype || 'static',
required: true,
options: [
{ value: 'dynamic', text: '鍔ㄦ��' },
@@ -83,47 +124,6 @@
label: '鍚庣紑',
initVal: card.postfix || '',
required: false
- },
- {
- type: 'select',
- key: 'icon',
- label: '鍥炬爣',
- initVal: card.icon,
- required: true,
- options: [
- { value: 'question-circle', text: 'question-circle'},
- { value: 'alert', text: 'alert'},
- { value: 'cloud', text: 'cloud'},
- { value: 'eye', text: 'eye'},
- { value: 'eye-invisible', text: 'eye-invisible'},
- { value: 'android', text: 'android'},
- { value: 'apple', text: 'apple'},
- { value: 'windows', text: 'windows'},
- { value: 'ie', text: 'ie'},
- { value: 'chrome', text: 'chrome'},
- { value: 'github', text: 'github'},
- { value: 'aliwangwang', text: 'aliwangwang'},
- { value: 'dingding', text: 'dingding'},
- { value: 'wechat', text: 'wechat'},
- { value: 'alipay', text: 'alipay'},
- { value: 'weibo-square', text: 'weibo-square'},
- { value: 'weibo-circle', text: 'weibo-circle'},
- { value: 'taobao-circle', text: 'taobao-circle'},
- { value: 'weibo', text: 'weibo'},
- { value: 'twitter', text: 'twitter'},
- { value: 'youtube', text: 'youtube'},
- { value: 'alipay-circle', text: 'alipay-circle'},
- { value: 'taobao', text: 'taobao'},
- { value: 'skype', text: 'skype'},
- { value: 'qq', text: 'qq'},
- { value: 'gitlab', text: 'gitlab'},
- { value: 'zhihu', text: 'zhihu'},
- { value: 'slack', text: 'slack'},
- { value: 'sketch', text: 'sketch'},
- { value: 'yahoo', text: 'yahoo'},
- { value: 'reddit', text: 'reddit'},
- { value: 'dribbble', text: 'dribbble'},
- ]
},
{
type: 'text',
diff --git a/src/menu/components/card/cardcellcomponent/index.jsx b/src/menu/components/card/cardcellcomponent/index.jsx
index 3e9eefb..e408ef6 100644
--- a/src/menu/components/card/cardcellcomponent/index.jsx
+++ b/src/menu/components/card/cardcellcomponent/index.jsx
@@ -375,7 +375,11 @@
let _elements = elements.map(cell => {
if (cell.uuid === ele.uuid) {
ele.style = cell.style || {}
- ele.btnstyle = cell.btnstyle || {}
+ if (ele.eleType === 'splitline' && cell.eleType !== 'splitline') {
+ ele.style.paddingTop = '5px'
+ ele.style.paddingBottom = '5px'
+ }
+
return ele
}
return cell
@@ -401,6 +405,7 @@
if (cell.uuid === ele.uuid) {
ele.eleType = 'button'
ele.style = cell.style || {}
+ ele.btnstyle = cell.btnstyle || {}
return ele
}
@@ -524,6 +529,7 @@
>
<ActionForm
dict={dict}
+ type="card"
card={card}
formlist={this.state.formlist}
inputSubmit={this.handleActionSubmit}
diff --git a/src/tabviews/custom/components/card/cardItem/index.jsx b/src/tabviews/custom/components/card/cardItem/index.jsx
index 25eb2cd..1d94823 100644
--- a/src/tabviews/custom/components/card/cardItem/index.jsx
+++ b/src/tabviews/custom/components/card/cardItem/index.jsx
@@ -44,12 +44,12 @@
}
render() {
- const { card } = this.props
+ const { card, data } = this.props
return (
<Col span={card.setting.width || 6}>
- <div className={'card-item'} style={card.style}>
- <CardCellComponent elements={card.elements} updateElement={this.updateCard}/>
+ <div className="card-item-box" style={card.style}>
+ <CardCellComponent data={data} elements={card.elements}/>
</div>
</Col>
)
diff --git a/src/tabviews/custom/components/card/cardcellList/index.jsx b/src/tabviews/custom/components/card/cardcellList/index.jsx
index dbab48a..5a1d9c8 100644
--- a/src/tabviews/custom/components/card/cardcellList/index.jsx
+++ b/src/tabviews/custom/components/card/cardcellList/index.jsx
@@ -1,7 +1,7 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
-import { Button, Icon } from 'antd'
+import { Button, Icon, Col, Tooltip } from 'antd'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
@@ -12,6 +12,7 @@
static propTpyes = {
cards: PropTypes.object, // 鑿滃崟閰嶇疆淇℃伅
cardCell: PropTypes.object,
+ data: PropTypes.object,
elements: PropTypes.array, // 鍏冪礌闆�
}
@@ -46,18 +47,76 @@
}
getContent = (card) => {
+ const { data } = this.props
+
if (card.eleType === 'text' || card.eleType === 'number') {
- let val = `${card.prefix || ''}${card.value || ''}${card.postfix || ''}`
- return <span key={card.uuid}>{val}</span>
- } else if (card.eleType === 'icon') {
- return (<Icon key={card.uuid} type={card.icon}/>)
- } else if (card.eleType === 'slider') {
+ let val = ''
+
+ if (card.datatype === 'static') {
+ val = card.value
+ } else if (data.hasOwnProperty(card.field)) {
+ val = data[card.field]
+ }
+
+ if (val !== '') {
+ val = `${card.prefix || ''}${val}${card.postfix || ''}`
+ }
+
return (
- <div className="ant-mk-slider" key={card.uuid}>
- <div className="ant-mk-slider-rail"></div>
- <div className="ant-mk-slider-track" style={{width: '30%', backgroundColor: card.color}}></div>
- <div className="ant-mk-slider-handle" style={{left: '30%', borderColor: card.color}}></div>
- </div>
+ <Col key={card.uuid} span={card.width}>
+ <div style={card.style}>{val}</div>
+ </Col>
+ )
+ } else if (card.eleType === 'icon') {
+ let val = ''
+
+ if (card.datatype === 'static') {
+ val = card.tooltip
+ } else if (data.hasOwnProperty(card.field)) {
+ val = data[card.field]
+ }
+
+ return (
+ <Col key={card.uuid} span={card.width}>
+ <div style={card.style}>
+ {val ? <Tooltip title={val}>
+ <Icon type={card.icon}/>
+ </Tooltip> : <Icon type={card.icon}/>}
+ </div>
+ </Col>
+ )
+ } else if (card.eleType === 'slider') {
+ let val = 0
+
+ if (data.hasOwnProperty(card.field)) {
+ val = parseFloat(data[card.field])
+ if (isNaN(val)) {
+ val = 0
+ }
+ }
+
+ val = val / card.maxValue * 100
+ val = parseInt(val * 100) / 100
+
+ let _val = val
+ if (val > 100) {
+ _val = '100%'
+ } else {
+ _val = `${val}%`
+ }
+
+ return (
+ <Col key={card.uuid} span={card.width}>
+ <div style={card.style}>
+ <div className="ant-mk-slider">
+ <div className="ant-mk-slider-rail"></div>
+ <div className="ant-mk-slider-track" style={{width: _val, backgroundColor: card.color}}></div>
+ <Tooltip title={val}>
+ <div className="ant-mk-slider-handle" style={{left: _val, borderColor: card.color}}></div>
+ </Tooltip>
+ </div>
+ </div>
+ </Col>
)
} else if (card.eleType === 'picture') {
let _imagestyle = {}
@@ -83,29 +142,50 @@
}
return (
- <div className="ant-mk-picture" key={card.uuid} style={_imagestyle}></div>
+ <Col key={card.uuid} span={card.width}>
+ <div style={card.style}>
+ <div className="ant-mk-picture" style={_imagestyle}></div>
+ </div>
+ </Col>
)
} else if (card.eleType === 'splitline') {
return (
- <div className="ant-mk-splitline" key={card.uuid} style={{backgroundColor: card.color}}></div>
+ <Col key={card.uuid} span={card.width}>
+ <div style={card.style}>
+ <div className="ant-mk-splitline" style={{backgroundColor: card.color}}></div>
+ </div>
+ </Col>
)
} else if (card.eleType === 'button') {
if (card.show === 'icon') {
- return (card.icon ? <Button key={card.uuid} className={'mk-link mk-' + card.class} style={card.btnstyle} type="link"><Icon type={card.icon}/></Button> : null)
+ return (
+ <Col key={card.uuid} span={card.width}>
+ <div style={card.style}>
+ <Button className={'mk-link mk-' + card.class} style={card.btnstyle} type="link"><Icon type={card.icon}/></Button>
+ </div>
+ </Col>
+ )
} else if (card.show === 'link') {
return (
- <Button key={card.uuid} className={'mk-link mk-' + card.class} style={card.btnstyle} type="link">{card.label}{card.icon ? <Icon type={card.icon}/> : null}</Button>
+ <Col key={card.uuid} span={card.width}>
+ <div style={card.style}>
+ <Button className={'mk-link mk-' + card.class} style={card.btnstyle} type="link">{card.label}{card.icon ? <Icon type={card.icon}/> : null}</Button>
+ </div>
+ </Col>
)
} else {
return (
- <Button
- key={card.uuid}
- className={'mk-btn mk-' + card.class}
- icon={card.icon}
- style={card.btnstyle}
- >
- {card.label}
- </Button>
+ <Col key={card.uuid} span={card.width}>
+ <div style={card.style}>
+ <Button
+ className={'mk-btn mk-' + card.class}
+ icon={card.icon}
+ style={card.btnstyle}
+ >
+ {card.label}
+ </Button>
+ </div>
+ </Col>
)
}
}
@@ -115,7 +195,7 @@
const { elements } = this.state
return (
- <div className="model-menu-card-cell-list">
+ <div className="card-cell-list">
{elements.map(item => this.getContent(item))}
</div>
)
diff --git a/src/tabviews/custom/components/card/cardcellList/index.scss b/src/tabviews/custom/components/card/cardcellList/index.scss
index 7d08668..e69de29 100644
--- a/src/tabviews/custom/components/card/cardcellList/index.scss
+++ b/src/tabviews/custom/components/card/cardcellList/index.scss
@@ -1,40 +0,0 @@
-.model-menu-card-cell-list {
- position: relative;
- .ant-form-item-label {
- .anticon-question-circle {
- color: #c49f47;
- position: absolute;
- left: 5px;
- top: 5px;
- }
- }
-
- .card-detail-row > .anticon-plus {
- color: #26C281;
- font-size: 16px;
- padding: 5px;
- cursor: pointer;
- }
-
- .card-cell {
- border-style: solid;
- border-width: 0;
- }
- .card-button-cell {
- float: left;
- button {
- background-size: cover;
- background-position: center center;
- span {
- font-style: inherit;
- text-decoration: inherit;
- }
- }
- }
- .card-cell:hover {
- box-shadow: 0px 0px 1px #d8d8d8;
- }
- .ant-slider {
- margin: 0px;
- }
-}
diff --git a/src/tabviews/custom/components/card/data-card/index.jsx b/src/tabviews/custom/components/card/data-card/index.jsx
index 8e459c4..3d1c86d 100644
--- a/src/tabviews/custom/components/card/data-card/index.jsx
+++ b/src/tabviews/custom/components/card/data-card/index.jsx
@@ -9,6 +9,8 @@
import UtilsDM from '@/utils/utils-datamanage.js'
import zhCN from '@/locales/zh-CN/main.js'
import enUS from '@/locales/en-US/main.js'
+import preImg from '@/assets/img/prev.png'
+import nextImg from '@/assets/img/next.png'
import './index.scss'
const CardItem = asyncComponent(() => import('../cardItem'))
@@ -26,9 +28,11 @@
state = {
dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, // 瀛楀吀
config: null, // 鍥捐〃閰嶇疆淇℃伅
+ pageIndex: 1,
empty: false,
loading: false, // 鏁版嵁鍔犺浇鐘舵��
- data: null // 鏁版嵁
+ data: null, // 鏁版嵁
+ total: null
}
UNSAFE_componentWillMount () {
@@ -63,7 +67,7 @@
async loadData () {
const { mainSearch, BID, menuType, dataManager } = this.props
- const { config, arr_field } = this.state
+ const { config, arr_field, pageIndex } = this.state
let searches = []
if (mainSearch && mainSearch.length > 0) { // 涓昏〃鎼滅储鏉′欢
@@ -75,12 +79,13 @@
})
let _orderBy = config.setting.order || ''
- let param = UtilsDM.getQueryDataParams(config.setting, arr_field, searches, _orderBy, 1, config.setting.pageSize, BID, menuType, dataManager)
+ let param = UtilsDM.getQueryDataParams(config.setting, arr_field, searches, _orderBy, pageIndex, config.setting.pageSize, BID, menuType, dataManager)
let result = await Api.genericInterface(param)
if (result.status) {
this.setState({
data: result.data,
+ total: result.total,
loading: false
})
} else {
@@ -95,8 +100,38 @@
}
}
+ prevPage = () => {
+ const { pageIndex } = this.state
+
+ if (pageIndex === 1) return
+
+ this.setState({
+ pageIndex: pageIndex - 1
+ }, () => {
+ this.loadData()
+ })
+ }
+ nextPage = () => {
+ const { config, pageIndex, total } = this.state
+ let _total = config.setting.pageSize * pageIndex
+
+ if (_total >= total) return
+
+ this.setState({
+ pageIndex: pageIndex + 1
+ }, () => {
+ this.loadData()
+ })
+ }
+
render() {
- const { config, empty, loading, data } = this.state
+ const { config, empty, loading, data, pageIndex, total } = this.state
+
+ let _total = config.setting.pageSize * pageIndex
+ let pageable = config.pageable && config.setting.laypage
+ if ((pageIndex === 1 && total <= _total) || !data) {
+ pageable = false
+ }
return (
<div className="custom-card-box" style={config.style}>
@@ -106,9 +141,13 @@
<Spin />
</div> : null
}
- {data && data.length > 0 ? data.map((item, index) => (
- <CardItem key={index} card={config.subcards[0]} cards={config} data={item} />
- )) : null}
+ {pageable ? <div className={'prev-page ' + (pageIndex === 1 ? 'disabled' : '')} onClick={this.prevPage}><div><div><img src={preImg} alt=""/></div></div></div> : null}
+ {data && data.length > 0 ? <div className="card-row-list">
+ {data.map((item, index) => (
+ <CardItem key={index} card={config.subcards[0]} cards={config} data={item} />
+ ))}
+ </div> : null}
+ {pageable ? <div className={'prev-page ' + (total <= _total ? 'disabled' : '')} onClick={this.nextPage}><div><div><img src={nextImg} alt=""/></div></div></div> : null}
{empty ? <Empty description={false}/> : null}
</div>
)
diff --git a/src/tabviews/custom/components/card/data-card/index.scss b/src/tabviews/custom/components/card/data-card/index.scss
index b8bd982..edace1d 100644
--- a/src/tabviews/custom/components/card/data-card/index.scss
+++ b/src/tabviews/custom/components/card/data-card/index.scss
@@ -1,9 +1,99 @@
.custom-card-box {
background: #ffffff;
min-height: 100px;
+ display: flex;
+ position: relative;
- .card-item {
+ .prev-page {
+ width: 20px;
+ div {
+ height: 100%;
+ display: table;
+ div {
+ display: table-cell;
+ vertical-align: middle;
+ }
+ }
+ img {
+ width: 15px;
+ height: 100px;
+ cursor: pointer;
+ }
+ }
+ .prev-page.disabled {
+ img {
+ cursor: not-allowed;
+ }
+ }
+ .card-row-list::after {
+ content: ' ';
+ display: block;
+ clear: both;
+ }
+ .card-row-list {
+ flex: 10;
+ }
+ .card-item-box {
border-style: solid;
+ .card-cell-list::after {
+ content: ' ';
+ display: block;
+ clear: both;
+ }
+ }
+
+ .card-cell-list {
+ position: relative;
+
+ .ant-mk-slider {
+ box-sizing: border-box;
+ margin: 0;
+ color: rgba(0, 0, 0, 0.65);
+ font-size: 14px;
+ font-variant: tabular-nums;
+ line-height: 1.5;
+ list-style: none;
+ font-feature-settings: 'tnum', "tnum";
+ position: relative;
+ height: 12px;
+ padding: 3px 0;
+ cursor: pointer;
+ touch-action: none;
+
+ .ant-mk-slider-track {
+ height: 7px;
+ position: absolute;
+ background-color: #91d5ff;
+ border-radius: 4px;
+ transition: background-color 0.3s;
+ }
+ .ant-mk-slider-rail {
+ height: 7px;
+ position: absolute;
+ width: 100%;
+ background-color: #f5f5f5;
+ border-radius: 2px;
+ transition: background-color 0.3s;
+ }
+ .ant-mk-slider-handle {
+ position: absolute;
+ width: 14px;
+ height: 14px;
+ margin-top: -4px;
+ margin-left: -7px;
+ background-color: #fff;
+ border: solid 2px #91d5ff;
+ border-radius: 50%;
+ cursor: pointer;
+ transition: border-color 0.3s, box-shadow 0.6s, transform 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.28), -webkit-box-shadow 0.6s, -webkit-transform 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.28);
+ }
+ }
+ .ant-mk-splitline {
+ height: 1px;
+ }
+ .ant-slider {
+ margin: 0px;
+ }
}
.ant-empty {
@@ -17,10 +107,10 @@
}
.loading-mask {
position: absolute;
- left: 20px;
+ left: 40px;
top: 0;
- right: 20px;
- bottom: 30px;
+ right: 40px;
+ bottom: 0px;
display: flex;
align-items: center;
justify-content: center;
@@ -36,3 +126,9 @@
}
}
}
+
+.custom-card-box::after {
+ content: ' ';
+ display: block;
+ clear: both;
+}
diff --git a/src/utils/utils.js b/src/utils/utils.js
index b7ad801..952b283 100644
--- a/src/utils/utils.js
+++ b/src/utils/utils.js
@@ -1043,53 +1043,51 @@
let _declarefields = []
// 鑾峰彇瀛楁閿�煎
- if (formdata) {
- formdata.forEach(form => {
- if (form.type === 'text') { // 鐗规畩瀛楁鏇挎崲
- form.value = form.value.replace(/^(\s*)@appkey@(\s*)$/ig, appkey)
- form.value = form.value.replace(/^(\s*)@SessionUid@(\s*)$/ig, sessionUid)
- form.value = form.value.replace(/^(\s*)@bid@(\s*)$/ig, BID)
- }
+ formdata && formdata.forEach(form => {
+ if (form.type === 'text') { // 鐗规畩瀛楁鏇挎崲
+ form.value = form.value.replace(/^(\s*)@appkey@(\s*)$/ig, appkey)
+ form.value = form.value.replace(/^(\s*)@SessionUid@(\s*)$/ig, sessionUid)
+ form.value = form.value.replace(/^(\s*)@bid@(\s*)$/ig, BID)
+ }
- _formFieldValue[form.key] = form.value
- let _key = form.key.toLowerCase()
+ _formFieldValue[form.key] = form.value
+ let _key = form.key.toLowerCase()
- if (!_initvars.includes(_key)) {
- _initvars.push(_key)
+ if (!_initvars.includes(_key)) {
+ _initvars.push(_key)
- if (form.type === 'number') {
- let val = form.value
- if (typeof(val) !== 'number') {
- val = parseFloat(val)
- if (isNaN(val)) {
- val = 0
- }
+ if (form.type === 'number') {
+ let val = form.value
+ if (typeof(val) !== 'number') {
+ val = parseFloat(val)
+ if (isNaN(val)) {
+ val = 0
}
- _initfields.push(`@${_key}=${val}`)
- } else {
- _initfields.push(`@${_key}='${form.value}'`)
}
+ _initfields.push(`@${_key}=${val}`)
+ } else {
+ _initfields.push(`@${_key}='${form.value}'`)
}
-
- if (!_vars.includes(_key)) {
- _vars.push(_key)
+ }
+
+ if (!_vars.includes(_key)) {
+ _vars.push(_key)
- if (form.fieldlen && form.fieldlen > 2048) {
- form.fieldlen = 'max'
- }
-
- let _type = `nvarchar(${form.fieldlen})`
-
- if (form.type.match(/date/ig)) {
- _type = 'datetime'
- } else if (form.type === 'number') {
- _type = `decimal(18,${form.fieldlen})`
- }
-
- _declarefields.push(`@${_key} ${_type}`)
+ if (form.fieldlen && form.fieldlen > 2048) {
+ form.fieldlen = 'max'
}
- })
- }
+
+ let _type = `nvarchar(${form.fieldlen})`
+
+ if (form.type.match(/date/ig)) {
+ _type = 'datetime'
+ } else if (form.type === 'number') {
+ _type = `decimal(18,${form.fieldlen})`
+ }
+
+ _declarefields.push(`@${_key} ${_type}`)
+ }
+ })
// 娣诲姞鏁版嵁涓瓧娈碉紝琛ㄥ崟鍊间紭鍏�(鎸夐挳涓嶉�夎鎴栧琛屾嫾鎺ユ椂璺宠繃)
if (data && btn.Ot !== 'notRequired' && btn.Ot !== 'requiredOnce') {
@@ -1269,8 +1267,12 @@
// 鍗曞彿鐢熸垚锛屼娇鐢ㄤ笂绾d锛圔ID锛夋垨鍒楄〃鏁版嵁锛屽０鏄庡彉閲忥紙妫�楠岋級
let _billcodesSql = ''
- if (verify.billcodes && verify.billcodes.length > 0) {
+ if (formdata && verify.billcodes && verify.billcodes.length > 0) {
+ let keys = formdata.map(item => item.key.toLowerCase()) // 琛ㄥ崟瀛楁
+
verify.billcodes.forEach(item => {
+ if (!keys.includes(item.field.toLowerCase())) return // 琛ㄥ崟涓笉鍚崟鍙风敓鎴愬瓧娈�
+
let _ModularDetailCode = ''
let _lpline = ''
if (item.TypeCharOne === 'Lp') {
--
Gitblit v1.8.0