From 0a98c5dab4f2783ff5250cb69715340b40d801bb Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期三, 05 四月 2023 18:23:08 +0800
Subject: [PATCH] 2023-04-05
---
src/tabviews/custom/components/card/cardcellList/index.jsx | 31 ++
src/menu/components/card/double-data-card/options.jsx | 11
src/mob/colorsketch/index.jsx | 19
src/menu/components/card/doublecardcomponent/options.jsx | 11
src/tabviews/custom/components/card/double-data-card/index.scss | 19 +
src/menu/components/card/cardcellcomponent/index.jsx | 9
src/tabviews/custom/components/card/double-data-card/index.jsx | 116 ++++----
src/menu/components/card/cardcellcomponent/index.scss | 227 +++++++++++++++++
src/menu/components/card/cardcellcomponent/dragaction/index.jsx | 16
src/menu/components/card/cardcellcomponent/elementform/index.jsx | 6
src/menu/components/card/double-data-card/index.jsx | 2
src/menu/components/share/actioncomponent/dragaction/index.jsx | 12
src/menu/components/card/cardsimplecomponent/options.jsx | 11
src/menu/components/card/cardcellcomponent/formconfig.jsx | 26 +
src/tabviews/custom/components/card/cardcellList/index.scss | 224 +++++++++++++++++
src/menu/components/card/cardcomponent/options.jsx | 11
16 files changed, 663 insertions(+), 88 deletions(-)
diff --git a/src/menu/components/card/cardcellcomponent/dragaction/index.jsx b/src/menu/components/card/cardcellcomponent/dragaction/index.jsx
index fe75c47..41c2326 100644
--- a/src/menu/components/card/cardcellcomponent/dragaction/index.jsx
+++ b/src/menu/components/card/cardcellcomponent/dragaction/index.jsx
@@ -1,6 +1,7 @@
import React, { useState } from 'react'
import { useDrop } from 'react-dnd'
import { is, fromJS } from 'immutable'
+import { message } from 'antd'
import update from 'immutability-helper'
import Card from './card'
@@ -53,7 +54,6 @@
}
copycard.uuid = Utils.getuuid()
- copycard.originCard = card
try {
delete _val.$srcId
@@ -76,12 +76,18 @@
oInput.select()
document.execCommand('Copy')
document.body.removeChild(oInput)
+
+ message.success('澶嶅埗鎴愬姛銆�')
+ } else {
+ message.warning('澶嶅埗澶辫触銆�')
}
- _cards.push(copycard)
-
- handleList(_cards)
- handleMenu(copycard)
+ if (card.eleType !== 'button') {
+ _cards.push(copycard)
+
+ handleList(_cards)
+ handleMenu(copycard)
+ }
}
const changeStyle = id => {
diff --git a/src/menu/components/card/cardcellcomponent/elementform/index.jsx b/src/menu/components/card/cardcellcomponent/elementform/index.jsx
index 009826c..e21fc1f 100644
--- a/src/menu/components/card/cardcellcomponent/elementform/index.jsx
+++ b/src/menu/components/card/cardcellcomponent/elementform/index.jsx
@@ -15,8 +15,8 @@
const cardTypeOptions = {
sequence: ['eleType', 'width'],
- text: ['eleType', 'datatype', 'format', 'width', 'height', 'prefix', 'postfix', 'link', 'anchors', 'noValue', 'bgImage', 'fixStyle', 'copyable'],
- number: ['eleType', 'datatype', 'width', 'height', 'prefix', 'postfix', 'noValue', 'fixStyle'],
+ text: ['eleType', 'datatype', 'format', 'width', 'height', 'prefix', 'postfix', 'link', 'anchors', 'noValue', 'bgImage', 'fixStyle', 'copyable', 'alignItems'],
+ number: ['eleType', 'datatype', 'width', 'height', 'prefix', 'postfix', 'noValue', 'fixStyle', 'alignItems'],
picture: ['eleType', 'datatype', 'width', 'lenWidRadio', 'maxWidth', 'link', 'noValue'],
video: ['eleType', 'datatype', 'width', 'aspectRatio', 'autoPlay', 'loop', 'startTime', 'noValue', 'posterType'],
icon: ['eleType', 'datatype', 'width', 'tooltip'],
@@ -25,7 +25,7 @@
barcode: ['eleType', 'datatype', 'width', 'barHeight', 'displayValue', 'interval', 'noValue'],
qrcode: ['eleType', 'datatype', 'width', 'qrWidth', 'color', 'url', 'noValue'],
currentDate: ['eleType', 'width', 'dateFormat', 'prefix', 'postfix', 'fixStyle'],
- formula: ['eleType', 'width', 'height', 'prefix', 'postfix', 'eval', 'formula', 'noValue', 'fixStyle'],
+ formula: ['eleType', 'width', 'height', 'prefix', 'postfix', 'eval', 'formula', 'noValue', 'fixStyle', 'alignItems'],
color: ['eleType', 'datatype', 'width', 'lenWidRadio', 'noValue', 'copyable'],
}
diff --git a/src/menu/components/card/cardcellcomponent/formconfig.jsx b/src/menu/components/card/cardcellcomponent/formconfig.jsx
index 01a75b3..76739c9 100644
--- a/src/menu/components/card/cardcellcomponent/formconfig.jsx
+++ b/src/menu/components/card/cardcellcomponent/formconfig.jsx
@@ -43,6 +43,11 @@
tooltip = '鍦ㄦ墿灞曞崱鐗囦腑锛屽姩鎬佹暟鎹樉绀哄�间负鑾峰彇鍒扮殑绗竴琛屾暟鎹��'
}
+ let width = card.width || 12
+ if (/x/.test(card.width)) {
+ width = +width.replace(/x/, '.5')
+ }
+
let forms = [
{
type: 'select',
@@ -328,12 +333,12 @@
{
type: 'number',
key: 'width',
- min: 1,
+ min: 0.5,
max: 24,
- precision: 0,
+ precision: 1,
label: '鍏冪礌瀹藉害',
- initVal: card.width || 12,
- tooltip: '鏍呮牸甯冨眬锛屾瘡琛岀瓑鍒嗕负24鍒椼��',
+ initVal: width,
+ tooltip: '鏍呮牸甯冨眬锛屾瘡琛岀瓑鍒嗕负24鍒楋紝鍙缃崐鍒楀嵆.5銆�',
required: true
},
{
@@ -570,6 +575,19 @@
},
{
type: 'radio',
+ key: 'alignItems',
+ label: '鍨傜洿瀵归綈',
+ initVal: card.alignItems || '',
+ tooltip: '鍨傜洿鏂瑰悜鐨勫榻愭柟寮忋��',
+ required: false,
+ options: [
+ { value: '', text: '灞呬笂' },
+ { value: 'center', text: '灞呬腑' },
+ { value: 'end', text: '灞呬笅' }
+ ]
+ },
+ {
+ type: 'radio',
key: 'fixStyle',
label: '鍓嶅悗缂�',
initVal: card.fixStyle || '',
diff --git a/src/menu/components/card/cardcellcomponent/index.jsx b/src/menu/components/card/cardcellcomponent/index.jsx
index 9909995..7826ab9 100644
--- a/src/menu/components/card/cardcellcomponent/index.jsx
+++ b/src/menu/components/card/cardcellcomponent/index.jsx
@@ -361,6 +361,13 @@
const { elements } = this.state
this.elementFormRef.handleConfirm().then(res => {
+ if (res.width % 0.5) {
+ res.width = parseInt(res.width / 0.5) * 0.5
+ }
+ if (res.width % 1) {
+ res.width = (res.width + '').replace(/.5/, 'x')
+ }
+
let _elements = elements.map(cell => {
if (cell.uuid === res.uuid) {
res.style = cell.style || {}
@@ -744,7 +751,7 @@
const { elements, visible, actvisible, profVisible, card, record } = this.state
return (
- <div className="model-menu-card-cell-list">
+ <div className={'model-menu-card-cell-list ' + (cardCell && cardCell.setting.layout === 'flex' ? 'mk-flex' : '') }>
<DragElement
list={elements}
parent={cardCell}
diff --git a/src/menu/components/card/cardcellcomponent/index.scss b/src/menu/components/card/cardcellcomponent/index.scss
index bd6033c..c8d9688 100644
--- a/src/menu/components/card/cardcellcomponent/index.scss
+++ b/src/menu/components/card/cardcellcomponent/index.scss
@@ -43,4 +43,231 @@
.card-cell:hover, .card-button-cell:hover {
box-shadow: 0px 0px 2px #1890ff;
}
+ .card-detail-row {
+ .ant-col[class*="x"] {
+ float: left;
+ box-sizing: border-box;
+ }
+ >.ant-col-0x {
+ width: 2.08333333%;
+ }
+ >.ant-col-1x {
+ width: 6.25%;
+ }
+ >.ant-col-2x {
+ width: 10.41666667%;
+ }
+ >.ant-col-3x {
+ width: 14.58333333%;
+ }
+ >.ant-col-4x {
+ width: 18.75%;
+ }
+ >.ant-col-5x {
+ width: 22.91666667%;
+ }
+ >.ant-col-6x {
+ width: 27.08333333%;
+ }
+ >.ant-col-7x {
+ width: 31.25%;
+ }
+ >.ant-col-8x {
+ width: 35.41666667%;
+ }
+ >.ant-col-9x {
+ width: 39.58333333%;
+ }
+ >.ant-col-10x {
+ width: 43.75%;
+ }
+ >.ant-col-11x {
+ width: 47.91666667%;
+ }
+ >.ant-col-12x {
+ width: 52.08333333%;
+ }
+ >.ant-col-13x {
+ width: 56.25%;
+ }
+ >.ant-col-14x {
+ width: 60.41666667%;
+ }
+ >.ant-col-15x {
+ width: 64.58333333%;
+ }
+ >.ant-col-16x {
+ width: 68.75%;
+ }
+ >.ant-col-17x {
+ width: 72.91666667%;
+ }
+ >.ant-col-18x {
+ width: 77.08333333%;
+ }
+ >.ant-col-19x {
+ width: 81.25%;
+ }
+ >.ant-col-20x {
+ width: 85.41666667%;
+ }
+ >.ant-col-21x {
+ width: 89.58333333%;
+ }
+ >.ant-col-22x {
+ width: 93.75%;
+ }
+ >.ant-col-23x {
+ width: 97.91666667%;
+ }
+ }
+}
+.model-menu-card-cell-list.mk-flex {
+ >.card-detail-row {
+ display: flex;
+ >.ant-col-1 {
+ flex: 1;
+ }
+ >.ant-col-2 {
+ flex: 2;
+ }
+ >.ant-col-3 {
+ flex: 3;
+ }
+ >.ant-col-4 {
+ flex: 4;
+ }
+ >.ant-col-5 {
+ flex: 5;
+ }
+ >.ant-col-6 {
+ flex: 6;
+ }
+ >.ant-col-7 {
+ flex: 7;
+ }
+ >.ant-col-8 {
+ flex: 8;
+ }
+ >.ant-col-9 {
+ flex: 9;
+ }
+ >.ant-col-10 {
+ flex: 10;
+ }
+ >.ant-col-11 {
+ flex: 11;
+ }
+ >.ant-col-12 {
+ flex: 12;
+ }
+ >.ant-col-13 {
+ flex: 13;
+ }
+ >.ant-col-14 {
+ flex: 14;
+ }
+ >.ant-col-15 {
+ flex: 15;
+ }
+ >.ant-col-16 {
+ flex: 16;
+ }
+ >.ant-col-17 {
+ flex: 17;
+ }
+ >.ant-col-18 {
+ flex: 18;
+ }
+ >.ant-col-19 {
+ flex: 19;
+ }
+ >.ant-col-20 {
+ flex: 20;
+ }
+ >.ant-col-21 {
+ flex: 21;
+ }
+ >.ant-col-22 {
+ flex: 22;
+ }
+ >.ant-col-23 {
+ flex: 23;
+ }
+ >.ant-col-24 {
+ flex: 24;
+ }
+ >.ant-col-0x {
+ flex: 0.5;
+ }
+ >.ant-col-1x {
+ flex: 1.5;
+ }
+ >.ant-col-2x {
+ flex: 2.5;
+ }
+ >.ant-col-3x {
+ flex: 3.5;
+ }
+ >.ant-col-4x {
+ flex: 4.5;
+ }
+ >.ant-col-5x {
+ flex: 5.5;
+ }
+ >.ant-col-6x {
+ flex: 6.5;
+ }
+ >.ant-col-7x {
+ flex: 7.5;
+ }
+ >.ant-col-8x {
+ flex: 8.5;
+ }
+ >.ant-col-9x {
+ flex: 9.5;
+ }
+ >.ant-col-10x {
+ flex: 10.5;
+ }
+ >.ant-col-11x {
+ flex: 11.5;
+ }
+ >.ant-col-12x {
+ flex: 12.5;
+ }
+ >.ant-col-13x {
+ flex: 13.5;
+ }
+ >.ant-col-14x {
+ flex: 14.5;
+ }
+ >.ant-col-15x {
+ flex: 15.5;
+ }
+ >.ant-col-16x {
+ flex: 16.5;
+ }
+ >.ant-col-17x {
+ flex: 17.5;
+ }
+ >.ant-col-18x {
+ flex: 18.5;
+ }
+ >.ant-col-19x {
+ flex: 19.5;
+ }
+ >.ant-col-20x {
+ flex: 20.5;
+ }
+ >.ant-col-21x {
+ flex: 21.5;
+ }
+ >.ant-col-22x {
+ flex: 22.5;
+ }
+ >.ant-col-23x {
+ flex: 23.5;
+ }
+ }
}
\ No newline at end of file
diff --git a/src/menu/components/card/cardcomponent/options.jsx b/src/menu/components/card/cardcomponent/options.jsx
index 02d46f2..32a1632 100644
--- a/src/menu/components/card/cardcomponent/options.jsx
+++ b/src/menu/components/card/cardcomponent/options.jsx
@@ -214,6 +214,17 @@
},
{
type: 'radio',
+ field: 'layout',
+ label: '鍏冪礌甯冨眬',
+ initval: setting.layout || 'grid',
+ required: false,
+ options: [
+ {value: 'grid', label: '鏍呮牸甯冨眬'},
+ {value: 'flex', label: '寮规�у竷灞�'},
+ ]
+ },
+ {
+ type: 'radio',
field: 'clickType',
label: '瑙﹀彂鏂瑰紡',
initval: setting.clickType || 'normal',
diff --git a/src/menu/components/card/cardsimplecomponent/options.jsx b/src/menu/components/card/cardsimplecomponent/options.jsx
index 06b6740..f6ca23b 100644
--- a/src/menu/components/card/cardsimplecomponent/options.jsx
+++ b/src/menu/components/card/cardsimplecomponent/options.jsx
@@ -218,6 +218,17 @@
},
{
type: 'radio',
+ field: 'layout',
+ label: '鍏冪礌甯冨眬',
+ initval: setting.layout || 'grid',
+ required: false,
+ options: [
+ {value: 'grid', label: '鏍呮牸甯冨眬'},
+ {value: 'flex', label: '寮规�у竷灞�'},
+ ]
+ },
+ {
+ type: 'radio',
field: 'click',
label: '鐐瑰嚮浜嬩欢',
initval: setting.click || '',
diff --git a/src/menu/components/card/double-data-card/index.jsx b/src/menu/components/card/double-data-card/index.jsx
index 25728f6..30a4940 100644
--- a/src/menu/components/card/double-data-card/index.jsx
+++ b/src/menu/components/card/double-data-card/index.jsx
@@ -602,7 +602,7 @@
<PlusOutlined className="plus" title="娣诲姞鍗＄墖" onClick={() => this.addCard()}/>
{appType !== 'mob' ? <PlusCircleOutlined className="plus" title="娣诲姞鎼滅储" onClick={() => this.addSearch()}/> : null}
<PlusSquareOutlined className="plus" title="娣诲姞鎸夐挳" onClick={() => this.addButton()}/>
- <NormalForm title="鏁版嵁鍗¤缃�" width={800} update={this.updateWrap} getForms={this.getWrapForms}>
+ <NormalForm title="鍙岄噸鏁版嵁鍗¤缃�" width={800} update={this.updateWrap} getForms={this.getWrapForms}>
<EditOutlined style={{color: '#1890ff'}} title="缂栬緫"/>
</NormalForm>
<CopyComponent type="datacard" card={card}/>
diff --git a/src/menu/components/card/double-data-card/options.jsx b/src/menu/components/card/double-data-card/options.jsx
index 704da63..235adfa 100644
--- a/src/menu/components/card/double-data-card/options.jsx
+++ b/src/menu/components/card/double-data-card/options.jsx
@@ -199,6 +199,17 @@
required: false
},
{
+ type: 'number',
+ field: 'minWidth',
+ label: '鏈�灏忓搴�',
+ min: 0,
+ max: 5000,
+ precision: 0,
+ initval: wrap.minWidth,
+ tooltip: '璁剧疆鍗＄墖鍖哄煙鐨勬渶灏忓搴︼紝鏄剧ず鍖哄煙灏忎簬姝ゅ�煎皢鍑虹幇妯悜婊氬姩銆�',
+ required: false
+ },
+ {
type: 'radio',
field: 'permission',
label: '鏉冮檺楠岃瘉',
diff --git a/src/menu/components/card/doublecardcomponent/options.jsx b/src/menu/components/card/doublecardcomponent/options.jsx
index 38a169d..dfdd703 100644
--- a/src/menu/components/card/doublecardcomponent/options.jsx
+++ b/src/menu/components/card/doublecardcomponent/options.jsx
@@ -165,6 +165,17 @@
},
{
type: 'radio',
+ field: 'layout',
+ label: '鍏冪礌甯冨眬',
+ initval: setting.layout || 'grid',
+ required: false,
+ options: [
+ {value: 'grid', label: '鏍呮牸甯冨眬'},
+ {value: 'flex', label: '寮规�у竷灞�'},
+ ]
+ },
+ {
+ type: 'radio',
field: 'clickType',
label: '瑙﹀彂鏂瑰紡',
initval: setting.clickType || 'normal',
diff --git a/src/menu/components/share/actioncomponent/dragaction/index.jsx b/src/menu/components/share/actioncomponent/dragaction/index.jsx
index e7ed384..cab1425 100644
--- a/src/menu/components/share/actioncomponent/dragaction/index.jsx
+++ b/src/menu/components/share/actioncomponent/dragaction/index.jsx
@@ -1,6 +1,7 @@
import React, { useState } from 'react'
import { useDrop } from 'react-dnd'
import { is, fromJS } from 'immutable'
+import { message } from 'antd'
import update from 'immutability-helper'
import Utils from '@/utils/utils.js'
@@ -69,7 +70,6 @@
}
copycard.uuid = Utils.getuuid()
- copycard.originCard = card
try {
delete _val.$srcId
@@ -92,13 +92,17 @@
oInput.select()
document.execCommand('Copy')
document.body.removeChild(oInput)
+
+ message.success('澶嶅埗鎴愬姛銆�')
+ } else {
+ message.warning('澶嶅埗澶辫触銆�')
}
- const { index: overIndex } = findCard(id)
+ // const { index: overIndex } = findCard(id)
- const _cards = update(cards, { $splice: [[overIndex + 1, 0, copycard]] })
+ // const _cards = update(cards, { $splice: [[overIndex + 1, 0, copycard]] })
- handleList(_cards, copycard)
+ // handleList(_cards, copycard)
}
const [, drop] = useDrop({
diff --git a/src/mob/colorsketch/index.jsx b/src/mob/colorsketch/index.jsx
index 58c6d9b..65c7df6 100644
--- a/src/mob/colorsketch/index.jsx
+++ b/src/mob/colorsketch/index.jsx
@@ -50,10 +50,10 @@
}
normal_colors.forEach(item => {
- if (!colors.includes(item)) {
- colors.push(item)
- }
+ colors.push({color: item, title: '甯哥敤鑹诧細' + item})
})
+ } else {
+ normal_colors = []
}
if (_colors) {
@@ -64,15 +64,15 @@
}
_colors.forEach(item => {
- if (!colors.includes(item.linkurl)) {
- colors.push(item.linkurl)
- }
+ if (normal_colors.includes(item.linkurl)) return
+
+ colors.push({color: item.linkurl, title: '绯荤粺鑹诧細' + item.linkurl})
})
}
if (colors.length < 40) {
for (let i = colors.length; i < 40; i++) {
- colors.push('transparent')
+ colors.push({color: 'transparent', title: '' + i})
}
}
@@ -102,8 +102,8 @@
onVisibleChange = (status) => {
const { initVal, color } = this.state
-
- if (!status && color && color !== initVal) {
+
+ if (!status && color && color !== initVal && color !== 'rgba(0, 0, 0, 0)' && color !== 'transparent' && !/rgba\(\d+,\s*\d+,\s*\d+,\s*0\)/.test(color)) {
let normal_colors = localStorage.getItem(_href + 'normal_colors')
if (normal_colors) {
@@ -117,6 +117,7 @@
}
normal_colors.unshift(color)
+ normal_colors = Array.from(new Set(normal_colors))
if (normal_colors.length > 10) {
normal_colors.length = 10
diff --git a/src/tabviews/custom/components/card/cardcellList/index.jsx b/src/tabviews/custom/components/card/cardcellList/index.jsx
index 89cfeaa..979f07b 100644
--- a/src/tabviews/custom/components/card/cardcellList/index.jsx
+++ b/src/tabviews/custom/components/card/cardcellList/index.jsx
@@ -400,11 +400,18 @@
if (card.bgImage && data[card.bgImage]) {
_style.backgroundImage = `url('${data[card.bgImage]}')`
}
+
+ let lineStyle = {height: card.innerHeight || 'auto'}
+ if (card.alignItems) {
+ lineStyle.display = 'flex'
+ lineStyle.alignItems = card.alignItems
+ lineStyle.justifyContent = _style.textAlign || 'left'
+ }
contents.push(
<Col key={card.uuid} style={_style_} span={card.width}>
<div style={_style} onClick={(e) => {this.openNewView(e, card)}}>
- <div className={'ant-mk-text line' + (card.height || '') + className} style={{height: card.innerHeight || 'auto'}}>{val}</div>
+ <div className={'ant-mk-text line' + (card.height || '') + className} style={lineStyle}>{val}</div>
</div>
</Col>
)
@@ -470,11 +477,18 @@
}
className = mark.signType
}
+
+ let lineStyle = {height: card.innerHeight || 'auto'}
+ if (card.alignItems) {
+ lineStyle.display = 'flex'
+ lineStyle.alignItems = card.alignItems
+ lineStyle.justifyContent = _style.textAlign || 'left'
+ }
contents.push(
<Col key={card.uuid} style={_style_} span={card.width}>
<div style={_style}>
- <div className={'ant-mk-text line' + (card.height || '') + className} style={{height: card.innerHeight || 'auto'}}>{val}</div>
+ <div className={'ant-mk-text line' + (card.height || '') + className} style={lineStyle}>{val}</div>
</div>
</Col>
)
@@ -789,11 +803,18 @@
}
className = mark.signType
}
+
+ let lineStyle = {height: card.innerHeight || 'auto'}
+ if (card.alignItems) {
+ lineStyle.display = 'flex'
+ lineStyle.alignItems = card.alignItems
+ lineStyle.justifyContent = _style.textAlign || 'left'
+ }
contents.push(
<Col key={card.uuid} style={_style_} span={card.width}>
<div style={_style}>
- <div className={'ant-mk-text line' + (card.height || '') + className} style={{height: card.innerHeight || 'auto'}}>{val}</div>
+ <div className={'ant-mk-text line' + (card.height || '') + className} style={lineStyle}>{val}</div>
</div>
</Col>
)
@@ -996,8 +1017,10 @@
}
render() {
+ const { cardCell } = this.props
+
return (
- <div className="card-cell-list">
+ <div className={'card-cell-list ' + (cardCell && cardCell.setting.layout === 'flex' ? 'mk-flex' : '')}>
{this.getContent()}
</div>
)
diff --git a/src/tabviews/custom/components/card/cardcellList/index.scss b/src/tabviews/custom/components/card/cardcellList/index.scss
index 2ce260c..4fc1ddf 100644
--- a/src/tabviews/custom/components/card/cardcellList/index.scss
+++ b/src/tabviews/custom/components/card/cardcellList/index.scss
@@ -193,9 +193,233 @@
width: 26px;
height: 26px;
}
+
+ .ant-col[class*="x"] {
+ float: left;
+ box-sizing: border-box;
+ }
+ >.ant-col-0x {
+ width: 2.08333333%;
+ }
+ >.ant-col-1x {
+ width: 6.25%;
+ }
+ >.ant-col-2x {
+ width: 10.41666667%;
+ }
+ >.ant-col-3x {
+ width: 14.58333333%;
+ }
+ >.ant-col-4x {
+ width: 18.75%;
+ }
+ >.ant-col-5x {
+ width: 22.91666667%;
+ }
+ >.ant-col-6x {
+ width: 27.08333333%;
+ }
+ >.ant-col-7x {
+ width: 31.25%;
+ }
+ >.ant-col-8x {
+ width: 35.41666667%;
+ }
+ >.ant-col-9x {
+ width: 39.58333333%;
+ }
+ >.ant-col-10x {
+ width: 43.75%;
+ }
+ >.ant-col-11x {
+ width: 47.91666667%;
+ }
+ >.ant-col-12x {
+ width: 52.08333333%;
+ }
+ >.ant-col-13x {
+ width: 56.25%;
+ }
+ >.ant-col-14x {
+ width: 60.41666667%;
+ }
+ >.ant-col-15x {
+ width: 64.58333333%;
+ }
+ >.ant-col-16x {
+ width: 68.75%;
+ }
+ >.ant-col-17x {
+ width: 72.91666667%;
+ }
+ >.ant-col-18x {
+ width: 77.08333333%;
+ }
+ >.ant-col-19x {
+ width: 81.25%;
+ }
+ >.ant-col-20x {
+ width: 85.41666667%;
+ }
+ >.ant-col-21x {
+ width: 89.58333333%;
+ }
+ >.ant-col-22x {
+ width: 93.75%;
+ }
+ >.ant-col-23x {
+ width: 97.91666667%;
+ }
}
.card-cell-list::after {
content: ' ';
display: block;
clear: both;
+}
+.card-cell-list.mk-flex {
+ display: flex;
+ >.ant-col-1 {
+ flex: 1;
+ }
+ >.ant-col-2 {
+ flex: 2;
+ }
+ >.ant-col-3 {
+ flex: 3;
+ }
+ >.ant-col-4 {
+ flex: 4;
+ }
+ >.ant-col-5 {
+ flex: 5;
+ }
+ >.ant-col-6 {
+ flex: 6;
+ }
+ >.ant-col-7 {
+ flex: 7;
+ }
+ >.ant-col-8 {
+ flex: 8;
+ }
+ >.ant-col-9 {
+ flex: 9;
+ }
+ >.ant-col-10 {
+ flex: 10;
+ }
+ >.ant-col-11 {
+ flex: 11;
+ }
+ >.ant-col-12 {
+ flex: 12;
+ }
+ >.ant-col-13 {
+ flex: 13;
+ }
+ >.ant-col-14 {
+ flex: 14;
+ }
+ >.ant-col-15 {
+ flex: 15;
+ }
+ >.ant-col-16 {
+ flex: 16;
+ }
+ >.ant-col-17 {
+ flex: 17;
+ }
+ >.ant-col-18 {
+ flex: 18;
+ }
+ >.ant-col-19 {
+ flex: 19;
+ }
+ >.ant-col-20 {
+ flex: 20;
+ }
+ >.ant-col-21 {
+ flex: 21;
+ }
+ >.ant-col-22 {
+ flex: 22;
+ }
+ >.ant-col-23 {
+ flex: 23;
+ }
+ >.ant-col-24 {
+ flex: 24;
+ }
+ >.ant-col-0x {
+ flex: 0.5;
+ }
+ >.ant-col-1x {
+ flex: 1.5;
+ }
+ >.ant-col-2x {
+ flex: 2.5;
+ }
+ >.ant-col-3x {
+ flex: 3.5;
+ }
+ >.ant-col-4x {
+ flex: 4.5;
+ }
+ >.ant-col-5x {
+ flex: 5.5;
+ }
+ >.ant-col-6x {
+ flex: 6.5;
+ }
+ >.ant-col-7x {
+ flex: 7.5;
+ }
+ >.ant-col-8x {
+ flex: 8.5;
+ }
+ >.ant-col-9x {
+ flex: 9.5;
+ }
+ >.ant-col-10x {
+ flex: 10.5;
+ }
+ >.ant-col-11x {
+ flex: 11.5;
+ }
+ >.ant-col-12x {
+ flex: 12.5;
+ }
+ >.ant-col-13x {
+ flex: 13.5;
+ }
+ >.ant-col-14x {
+ flex: 14.5;
+ }
+ >.ant-col-15x {
+ flex: 15.5;
+ }
+ >.ant-col-16x {
+ flex: 16.5;
+ }
+ >.ant-col-17x {
+ flex: 17.5;
+ }
+ >.ant-col-18x {
+ flex: 18.5;
+ }
+ >.ant-col-19x {
+ flex: 19.5;
+ }
+ >.ant-col-20x {
+ flex: 20.5;
+ }
+ >.ant-col-21x {
+ flex: 21.5;
+ }
+ >.ant-col-22x {
+ flex: 22.5;
+ }
+ >.ant-col-23x {
+ flex: 23.5;
+ }
}
\ No newline at end of file
diff --git a/src/tabviews/custom/components/card/double-data-card/index.jsx b/src/tabviews/custom/components/card/double-data-card/index.jsx
index e50b913..b06a81c 100644
--- a/src/tabviews/custom/components/card/double-data-card/index.jsx
+++ b/src/tabviews/custom/components/card/double-data-card/index.jsx
@@ -917,64 +917,66 @@
selectedData={selectedData}
/> : null
}
- <div className={`data-zoom ${config.wrap.wrapClass}`}>
- <Row className={'card-row-list '}>
- {precards.map((item, index) => (
- <Col key={'pre' + index} className="extend-card" span={item.setting.width || 6}>
- <CardItem card={item} cards={config} data={extendData}>
- {item.setting.checkAll === 'show' ? <span onClick={this.checkAll} className={'circle-select' + checkAll}></span> : null}
- </CardItem>
- </Col>
- ))}
- {data && data.map((item, index) => {
- let className = 'card-item-wrap mk-card ' + mainBox
- let subClass = 'mk-unfold'
- let unfold = true
-
- if (item.$disabled) {
- className = 'mk-disabled ' + mainBox
- } else if (activeKey === index) {
- className += 'active'
- } else if (selectKeys.indexOf(index) > -1) {
- className += 'selected'
- }
-
- if (card.setting.display !== 'default') {
- if (item.children.length === 0) {
- subClass = 'mk-disabled'
- unfold = false
- } else {
- subClass = opens.indexOf(index) > -1 ? 'mk-unfold' : 'mk-collapse'
- unfold = opens.indexOf(index) > -1
- }
- }
-
- return (
- <Col key={index} span={card.setting.width}>
- <div className={className} style={wrapStyle}>
- <CardItem card={card} cards={config} data={item} onDoubleClick={() => this.onDoubleClick(index, subClass)} onClick={() => {this.changeCard(index, item, subClass)}}>
- <span className="circle-select"></span>
- {card.setting.controlIcon === 'left' ? (!unfold ? <PlusSquareOutlined className={subClass} onClick={(e) => this.changeUnfold(e, index, subClass)}/> : <MinusSquareOutlined className={subClass} onClick={(e) => this.changeUnfold(e, index, subClass)}/>) : null}
- {card.setting.controlIcon === 'right' ? <UpOutlined className={subClass} onClick={(e) => this.changeUnfold(e, index, subClass)}/> : null}
- </CardItem>
- <div className={'sub-card-wrap ' + subClass + (config.wrap.parity === 'true' ? ' mk-parity-bg' : '')}>
- {item.children.map((cell, index) => <Col key={'sub' + index} span={subcard.setting.width || 24}>
- <CardItem card={subcard} cards={subconfig} data={cell} />
- </Col>)}
- </div>
- </div>
+ <div className={config.wrap.minWidth ? 'data-zoom-box' : ''}>
+ <div className={`data-zoom ${config.wrap.wrapClass}`} style={config.wrap.minWidth ? {minWidth: config.wrap.minWidth} : null}>
+ <Row className={'card-row-list '}>
+ {precards.map((item, index) => (
+ <Col key={'pre' + index} className="extend-card" span={item.setting.width || 6}>
+ <CardItem card={item} cards={config} data={extendData}>
+ {item.setting.checkAll === 'show' ? <span onClick={this.checkAll} className={'circle-select' + checkAll}></span> : null}
+ </CardItem>
</Col>
- )
- })}
- {nextcards.map((item, index) => (
- <Col key={'next' + index} className="extend-card" span={item.setting.width || 6}>
- <CardItem card={item} cards={config} data={extendData}>
- {item.setting.checkAll === 'show' ? <span onClick={this.checkAll} className={'circle-select' + checkAll}></span> : null}
- </CardItem>
- </Col>
- ))}
- </Row>
- {precards.length === 0 && nextcards.length === 0 && (!data || data.length === 0) ? <Empty description={false}/> : null}
+ ))}
+ {data && data.map((item, index) => {
+ let className = 'card-item-wrap mk-card ' + mainBox
+ let subClass = 'mk-unfold'
+ let unfold = true
+
+ if (item.$disabled) {
+ className = 'mk-disabled ' + mainBox
+ } else if (activeKey === index) {
+ className += 'active'
+ } else if (selectKeys.indexOf(index) > -1) {
+ className += 'selected'
+ }
+
+ if (card.setting.display !== 'default') {
+ if (item.children.length === 0) {
+ subClass = 'mk-disabled'
+ unfold = false
+ } else {
+ subClass = opens.indexOf(index) > -1 ? 'mk-unfold' : 'mk-collapse'
+ unfold = opens.indexOf(index) > -1
+ }
+ }
+
+ return (
+ <Col key={index} span={card.setting.width}>
+ <div className={className} style={wrapStyle}>
+ <CardItem card={card} cards={config} data={item} onDoubleClick={() => this.onDoubleClick(index, subClass)} onClick={() => {this.changeCard(index, item, subClass)}}>
+ <span className="circle-select"></span>
+ {card.setting.controlIcon === 'left' ? (!unfold ? <PlusSquareOutlined className={subClass} onClick={(e) => this.changeUnfold(e, index, subClass)}/> : <MinusSquareOutlined className={subClass} onClick={(e) => this.changeUnfold(e, index, subClass)}/>) : null}
+ {card.setting.controlIcon === 'right' ? <UpOutlined className={subClass} onClick={(e) => this.changeUnfold(e, index, subClass)}/> : null}
+ </CardItem>
+ <div className={'sub-card-wrap ' + subClass + (config.wrap.parity === 'true' ? ' mk-parity-bg' : '')}>
+ {item.children.map((cell, index) => <Col key={'sub' + index} span={subcard.setting.width || 24}>
+ <CardItem card={subcard} cards={subconfig} data={cell} />
+ </Col>)}
+ </div>
+ </div>
+ </Col>
+ )
+ })}
+ {nextcards.map((item, index) => (
+ <Col key={'next' + index} className="extend-card" span={item.setting.width || 6}>
+ <CardItem card={item} cards={config} data={extendData}>
+ {item.setting.checkAll === 'show' ? <span onClick={this.checkAll} className={'circle-select' + checkAll}></span> : null}
+ </CardItem>
+ </Col>
+ ))}
+ </Row>
+ {precards.length === 0 && nextcards.length === 0 && (!data || data.length === 0) ? <Empty description={false}/> : null}
+ </div>
</div>
{config.wrap.pagestyle === 'page' && config.setting.laypage && data ? <Pagination size="small" total={total} showTotal={(t, range) => `${range[0]}-${range[1]} 鍏� ${total} 鏉} pageSize={pageSize} showSizeChanger={true} pageSizeOptions={this.state.pageOptions} onChange={this.changePageIndex} onShowSizeChange={this.pageSizeChange} current={pageIndex}/> : null}
{config.wrap.pagestyle === 'more' && config.setting.laypage && data && data.length > 0 ? <div className={'mk-more' + (pageSize * pageIndex >= total ? ' disabled' : '')} onClick={this.loadMore}>鏌ョ湅鏇村<DownOutlined/></div> : null}
diff --git a/src/tabviews/custom/components/card/double-data-card/index.scss b/src/tabviews/custom/components/card/double-data-card/index.scss
index d19f2f3..9ca06c2 100644
--- a/src/tabviews/custom/components/card/double-data-card/index.scss
+++ b/src/tabviews/custom/components/card/double-data-card/index.scss
@@ -297,6 +297,25 @@
}
}
}
+ .data-zoom-box {
+ width: 100%;
+ overflow-x: auto;
+ padding-bottom: 10px;
+ }
+ .data-zoom-box::-webkit-scrollbar {
+ height: 7px;
+ }
+ .data-zoom-box::-webkit-scrollbar-thumb {
+ border-radius: 5px;
+ box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.13);
+ background: rgba(0, 0, 0, 0.13);
+ }
+ .data-zoom-box::-webkit-scrollbar-track {
+ box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.05);
+ border-radius: 3px;
+ border: 1px solid rgba(0, 0, 0, 0.07);
+ background: rgba(0, 0, 0, 0);
+ }
}
.double-data-card-box::-webkit-scrollbar {
width: 7px;
--
Gitblit v1.8.0