From bde2916433c7830e2879e6524e32b9f6c8bd0bab Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期日, 02 一月 2022 16:31:32 +0800
Subject: [PATCH] 2022-01-02

---
 src/tabviews/custom/components/card/cardcellList/index.jsx |  579 +++++++++++++++++++++++++++++++++++----------------------
 1 files changed, 355 insertions(+), 224 deletions(-)

diff --git a/src/tabviews/custom/components/card/cardcellList/index.jsx b/src/tabviews/custom/components/card/cardcellList/index.jsx
index 05b9a24..3798bd6 100644
--- a/src/tabviews/custom/components/card/cardcellList/index.jsx
+++ b/src/tabviews/custom/components/card/cardcellList/index.jsx
@@ -1,14 +1,14 @@
 import React, {Component} from 'react'
 import PropTypes from 'prop-types'
 import { is, fromJS } from 'immutable'
-import { Icon, Col, Tooltip, notification } from 'antd'
+import { Col, Tooltip, notification } from 'antd'
 import moment from 'moment'
 
-import zhCN from '@/locales/zh-CN/model.js'
-import enUS from '@/locales/en-US/model.js'
 import asyncComponent from './asyncButtonComponent'
 import asyncElementComponent from '@/utils/asyncComponent'
-
+import { getMark } from '@/utils/utils.js'
+import MkIcon from '@/components/mk-icon'
+import MKEmitter from '@/utils/events.js'
 import LostPng from '@/assets/img/lost.png'
 import './index.scss'
 
@@ -22,19 +22,24 @@
 const PrintButton = asyncComponent(() => import('@/tabviews/zshare/actionList/printbutton'))
 const BarCode = asyncElementComponent(() => import('@/components/barcode'))
 const QrCode = asyncElementComponent(() => import('@/components/qrcode'))
+const MkProgress = asyncElementComponent(() => import('@/components/mkProgress'))
 const Video = asyncComponent(() => import('@/components/video'))
+const PicRadio = {
+  '4:3': '75%', '3:2': '66.67%', '16:9': '56.25%', '2:1': '50%', '3:1': '33.33%', '4:1': '25%',
+  '5:1': '20%', '6:1': '16.67%', '7:1': '14.29%', '8:1': '12.5%', '9:1': '11.11%',
+  '10:1': '10%', '3:4': '133.33%', '2:3': '150%', '9:16': '177.78%'
+}
 
 class CardCellComponent extends Component {
   static propTpyes = {
-    seq: PropTypes.any,              // 搴忓彿
     cards: PropTypes.object,         // 鑿滃崟閰嶇疆淇℃伅
     cardCell: PropTypes.object,
     data: PropTypes.object,
+    syncData: PropTypes.array,
     elements: PropTypes.array,       // 鍏冪礌闆�
   }
 
   state = {
-    dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
     card: null,          // 缂栬緫涓厓绱�
     elements: null,      // 鎸夐挳缁�
   }
@@ -83,6 +88,19 @@
         message: '閾炬帴鍦板潃涓嶅瓨鍦紒',
         duration: 5
       })
+      return
+    }
+
+    if (card.linkType === 'tel') {
+      window.open('tel:' + url)
+      return
+    } else if (card.linkType === 'email') {
+      let _url = 'mailto:' + url
+      let fullName = sessionStorage.getItem('Full_Name') || ''
+      if (fullName) {
+        _url = _url + `?subject=鏉ヨ嚜${fullName}鐨勯偖浠禶
+      }
+      window.open(_url)
       return
     }
 
@@ -135,79 +153,6 @@
     window.open(url)
   }
 
-  getMark = (marks, style, content) => {
-    const { data } = this.props
-
-    marks.some(mark => {
-      let originVal = data[mark.field[0]] + ''
-      let contrastVal = ''
-      let result = false
-
-      if (mark.field[1] === 'static') {
-        contrastVal = mark.contrastValue + ''
-      } else {
-        contrastVal = data[mark.field[2]] + ''
-      }
-
-      if (mark.match === '=') {
-        result = originVal === contrastVal
-      } else if (mark.match === '!=') {
-        result = originVal !== contrastVal
-      } else if (mark.match === 'like') {
-        result = originVal.indexOf(contrastVal) > -1
-      } else if (mark.match === '>') {
-        try {
-          originVal = parseFloat(originVal)
-          contrastVal = parseFloat(contrastVal)
-        } catch {
-          originVal = NaN
-        }
-
-        if (!isNaN(originVal) && !isNaN(contrastVal) && originVal > contrastVal) {
-          result = true
-        }
-      } else if (mark.match === '<') {
-        try {
-          originVal = parseFloat(originVal)
-          contrastVal = parseFloat(contrastVal)
-        } catch {
-          originVal = NaN
-        }
-
-        if (!isNaN(originVal) && !isNaN(contrastVal) && originVal < contrastVal) {
-          result = true
-        }
-      }
-
-      if (result && mark.signType) {
-        if (mark.signType[0] === 'font') {
-          style.color = mark.color
-        } else if (mark.signType[0] === 'background') {
-          style.background = mark.color
-          if (mark.fontColor) {
-            style.color = mark.fontColor
-          }
-        } else if (mark.signType[0] === 'underline') {
-          style.textDecoration = 'underline'
-          style.color = mark.color
-        } else if (mark.signType[0] === 'line-through') {
-          style.textDecoration = 'line-through'
-          style.color = mark.color
-        } else if (mark.signType[0] === 'icon') {
-          let icon = (<Icon style={{color: mark.color}} type={mark.signType[3]} />)
-          if (mark.signType[1] === 'front') {
-            content = <span>{icon} {content}</span>
-          } else {
-            content = <span>{content} {icon}</span>
-          }
-        }
-      }
-      return result
-    })
-
-    return content
-  }
-
   getColor = (marks) => {
     const { data } = this.props
     let color = ''
@@ -230,27 +175,9 @@
       } else if (mark.match === 'like') {
         result = originVal.indexOf(contrastVal) > -1
       } else if (mark.match === '>') {
-        try {
-          originVal = parseFloat(originVal)
-          contrastVal = parseFloat(contrastVal)
-        } catch {
-          originVal = NaN
-        }
-
-        if (!isNaN(originVal) && !isNaN(contrastVal) && originVal > contrastVal) {
-          result = true
-        }
+        result = parseFloat(originVal) > parseFloat(contrastVal)
       } else if (mark.match === '<') {
-        try {
-          originVal = parseFloat(originVal)
-          contrastVal = parseFloat(contrastVal)
-        } catch {
-          originVal = NaN
-        }
-
-        if (!isNaN(originVal) && !isNaN(contrastVal) && originVal < contrastVal) {
-          result = true
-        }
+        result = parseFloat(originVal) < parseFloat(contrastVal)
       }
 
       if (result) {
@@ -263,13 +190,23 @@
   }
 
   getContent = (card) => {
-    const { data, cards, seq } = this.props
+    const { data, cards } = this.props
 
     if (card.eleType === 'sequence') {
+      let _style = {}
+      if (card.marks) {
+        _style.width = card.innerHeight
+        _style.height = card.innerHeight
+        _style.lineHeight = card.innerHeight + 'px'
+
+        let mark = getMark(card.marks, data, _style)
+
+        _style = mark.style
+      }
       return (
         <Col key={card.uuid} span={card.width}>
           <div style={card.style}>
-            <div className={'ant-mk-text'}>{seq}</div>
+            <div className="ant-mk-text"><span className="sequence-wrap" style={_style}>{data.$Index || ''}</span></div>
           </div>
         </Col>
       )
@@ -279,18 +216,76 @@
 
       if (card.datatype === 'static') {
         val = card.value || ''
-        if (/@username@|@fullName@/ig.test(val)) {
+        if (/@username@|@fullName@|@login_city@/ig.test(val)) {
           let userName = sessionStorage.getItem('User_Name') || ''
           let fullName = sessionStorage.getItem('Full_Name') || ''
-          val = val.replace(/@username@/ig, userName).replace(/@fullName@/ig, fullName)
+          let city = sessionStorage.getItem('city') || ''
+          val = val.replace(/@username@/ig, userName).replace(/@fullName@/ig, fullName).replace(/@login_city@/ig, city)
         }
       } else if (data.hasOwnProperty(card.field)) {
         val = data[card.field]
       }
 
+      if (val === '' && card.noValue === 'hide') { // 绌哄�奸殣钘�
+        return null
+      }
+
       if (val !== '' && card.format) {
-        if (card.format === 'YYYY-MM-DD' && /^[1-9]\d{3}(-|\/)(0[1-9]|1[0-2])(-|\/)(0[1-9]|[1-2][0-9]|3[0-1])/.test(val)) {
-          val = `${val.substr(0, 4)}-${val.substr(5, 2)}-${val.substr(8, 2)}`
+        let _val = null
+
+        if (card.format === 'calendar1') {
+          _val = moment(val).calendar(null, {
+            sameDay: '[浠婂ぉ] ahh:mm',
+            nextDay: '[鏄庡ぉ] ahh:mm',
+            nextWeek: 'MM鏈圖D鏃� ahh:mm',
+            lastDay: '[鏄ㄥぉ] ahh:mm',
+            lastWeek: 'dddd ahh:mm',
+            sameElse: 'MM鏈圖D鏃� ahh:mm'
+          })
+        } else if (card.format === 'calendar2') {
+          let time = new Date(val).getTime()
+          if (!isNaN(time)) {
+            time = parseInt(time / 60000)                                     // 鏃堕棿鍊�
+            let now = parseInt(new Date().getTime() / 60000)                  // 褰撳墠鏃堕棿鍊�
+            let start = new Date(new Date().toDateString()).getTime() / 60000 // 浠婂ぉ闆剁偣鏃堕棿鍊�
+            let split = now - time
+
+            if (split < 0) { // 鏃堕棿鍊煎湪褰撳墠鏃堕棿涔嬪悗
+              _val = moment(val).format('MM鏈圖D鏃� HH:mm')
+            } else if (split < 3) {
+              _val = '鍒氬垰'
+            } else if (split < 5) {
+              _val = '3鍒嗛挓鍓�'
+            } else if (split < 10) {
+              _val = '5鍒嗛挓鍓�'
+            } else if (split < 20) {
+              _val = '10鍒嗛挓鍓�'
+            } else if (split < 30) {
+              _val = '20鍒嗛挓鍓�'
+            } else if (split < 60) {
+              _val = '30鍒嗛挓鍓�'
+            } else if (split < 420 || time > start) { // 7灏忔椂鍐呮垨鏃堕棿鍊煎湪浠婂ぉ闆剁偣鍚�
+              _val = parseInt(split / 60) + '灏忔椂鍓�'
+            } else {                                  // 鏃堕棿鍊煎湪浠婂ぉ闆剁偣涔嬪墠
+              let _day = parseInt((start - time) / (24 * 60)) + 1
+              if (_day === 1) {
+                _val = '鏄ㄥぉ'
+              } else if (_day <= 30) {
+                _val = _day + '澶╁墠'
+              } else {
+                _val = moment(val).format('MM鏈圖D鏃� HH:mm')
+              }
+            }
+          }
+        } else {
+          _val = moment(val).format(card.format)
+        }
+        
+        // if (card.format === 'YYYY-MM-DD' && /^[1-9]\d{3}(-|\/)(0[1-9]|1[0-2])(-|\/)(0[1-9]|[1-2][0-9]|3[0-1])/.test(val)) {
+        //   val = `${val.substr(0, 4)}-${val.substr(5, 2)}-${val.substr(8, 2)}`
+        // }
+        if (_val && _val !== 'Invalid date') {
+          val = _val
         }
       }
 
@@ -299,7 +294,17 @@
       }
 
       if (card.marks) {
-        val = this.getMark(card.marks, _style, val)
+        let mark = getMark(card.marks, data, _style)
+
+        _style = mark.style
+
+        if (mark.icon) {
+          if (mark.position === 'front') {
+            val = <span><MkIcon style={{color: mark.color}} type={mark.icon} /> {val}</span>
+          } else {
+            val = <span>{val} <MkIcon style={{color: mark.color}} type={mark.icon} /></span>
+          }
+        }
       }
 
       if (card.link) {
@@ -309,7 +314,7 @@
       return (
         <Col key={card.uuid} span={card.width}>
           <div style={_style} onClick={(e) => {this.openNewView(e, card)}}>
-            <div className={'ant-mk-text line' + card.height} style={{height: card.innerHeight || 'auto'}}>{val}</div>
+            <div className={'ant-mk-text line' + (card.height || '')} style={{height: card.innerHeight || 'auto'}}>{val}</div>
           </div>
         </Col>
       )
@@ -355,13 +360,23 @@
       }
       
       if (card.marks) {
-        val = this.getMark(card.marks, _style, val)
+        let mark = getMark(card.marks, data, _style)
+
+        _style = mark.style
+
+        if (mark.icon) {
+          if (mark.position === 'front') {
+            val = <span><MkIcon style={{color: mark.color}} type={mark.icon} /> {val}</span>
+          } else {
+            val = <span>{val} <MkIcon style={{color: mark.color}} type={mark.icon} /></span>
+          }
+        }
       }
 
       return (
         <Col key={card.uuid} span={card.width}>
           <div style={_style}>
-            <div className={'ant-mk-text line' + card.height} style={{height: card.innerHeight || 'auto'}}>{val}</div>
+            <div className={'ant-mk-text line' + (card.height || '')} style={{height: card.innerHeight || 'auto'}}>{val}</div>
           </div>
         </Col>
       )
@@ -378,8 +393,8 @@
         <Col key={card.uuid} span={card.width}>
           <div style={card.style}>
             {val ? <Tooltip title={val}>
-              <Icon type={card.icon}/>
-            </Tooltip> : <Icon type={card.icon}/>}
+              <MkIcon type={card.icon}/>
+            </Tooltip> : <MkIcon type={card.icon}/>}
           </div>
         </Col>
       )
@@ -399,13 +414,6 @@
       val = val / card.maxValue * 100
       val = parseInt(val * 100) / 100
 
-      let _val = val
-      if (val > 100) {
-        _val = '100%'
-      } else {
-        _val = `${val}%`
-      }
-
       if (card.marks) {
         let _color = this.getColor(card.marks)
         color = _color ? _color : color
@@ -414,25 +422,32 @@
       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: color}}></div>
-              <Tooltip title={`${val}%`}>
-                <div className="ant-mk-slider-handle" style={{left: _val, borderColor: color}}></div>
-              </Tooltip>
-            </div>
+            <MkProgress value={val} config={card} color={color}/>
           </div>
         </Col>
       )
     } else if (card.eleType === 'picture') {
       let _imagestyle = {}
-      let _style = card.style ? {...card.style} : {}
+      let _style = card.style ? {margin: '0 auto', ...card.style} : {}
       let url = ''
+      if (card.maxWidth) {
+        _style.maxWidth = card.maxWidth
+        if (_style.marginLeft === '0px') {
+          delete _style.marginLeft
+        }
+        if (_style.marginRight === '0px') {
+          delete _style.marginRight
+        }
+      }
 
       if (card.datatype === 'static') {
-        url = card.url
+        url = card.url || ''
       } else {
-        url = data[card.field]
+        url = data[card.field] || ''
+      }
+
+      if (url === '' && card.noValue === 'hide') { // 绌哄�奸殣钘�
+        return null
       }
       
       if (url) {
@@ -445,12 +460,8 @@
         _imagestyle.borderRadius = _style.borderRadius
       }
 
-      if (card.lenWidRadio === '16:9') {
-        _imagestyle.paddingTop = '56.25%'
-      } else if (card.lenWidRadio === '3:2') {
-        _imagestyle.paddingTop = '66.67%'
-      } else if (card.lenWidRadio === '4:3') {
-        _imagestyle.paddingTop = '75%'
+      if (PicRadio[card.lenWidRadio]) {
+        _imagestyle.paddingTop = PicRadio[card.lenWidRadio]
       } else {
         _imagestyle.paddingTop = '100%'
       }
@@ -459,10 +470,24 @@
         _style.cursor = 'pointer'
       }
 
+      let scale = url && card.scale === 'true'
+      
       return (
         <Col key={card.uuid} span={card.width}>
           <div style={_style} onClick={(e) => {this.openNewView(e, card)}}>
-            <div className="ant-mk-picture" style={_imagestyle}></div>
+            <div
+              className={'ant-mk-picture' + (scale ? ' scale' : '')}
+              onClick={(e) => {
+                if (scale) {
+                  e.stopPropagation()
+                } else {
+                  return
+                }
+
+                MKEmitter.emit('mkImageScale', url)
+              }}
+              style={_imagestyle}
+            ></div>
           </div>
         </Col>
       )
@@ -481,7 +506,11 @@
       if (card.datatype === 'static') {
         val = card.value
       } else if (data.hasOwnProperty(card.field)) {
-        val = data[card.field]
+        val = data[card.field] || ''
+      }
+
+      if (val === '' && card.noValue === 'hide') { // 绌哄�奸殣钘�
+        return null
       }
 
       return (
@@ -502,6 +531,10 @@
         url = data[card.field] || ''
       }
 
+      if (url === '' && card.noValue === 'hide') { // 绌哄�奸殣钘�
+        return null
+      }
+
       return (
         <Col key={card.uuid} span={card.width}>
           <div style={card.style}>
@@ -515,7 +548,11 @@
       if (card.datatype === 'static') {
         val = card.value
       } else if (data.hasOwnProperty(card.field)) {
-        val = data[card.field]
+        val = data[card.field] || ''
+      }
+
+      if (val === '' && card.noValue === 'hide') { // 绌哄�奸殣钘�
+        return null
       }
 
       return (
@@ -535,129 +572,223 @@
           </div>
         </Col>
       )
+    } else if (card.eleType === 'formula') {
+      let val = 0
+      let _style = card.style ? {...card.style} : {}
+
+      if (card.$sync) {
+        if (card.eval === 'false') {
+          val = ''
+        }
+        this.props.syncData.forEach(item => {
+          let _val = card.formula
+          Object.keys(item).forEach(key => {
+            let reg = new RegExp('@' + key + '@', 'ig')
+            _val = _val.replace(reg, item[key])
+          })
+          if (card.eval !== 'false') {
+            try {
+              // eslint-disable-next-line
+              _val = eval(_val)
+            } catch (e) {
+              _val = 0
+            }
+          }
+
+          if (!val) return
+
+          val += _val
+        })
+      } else if (data) {
+        let _val = card.formula
+        Object.keys(data).forEach(key => {
+          let reg = new RegExp('@' + key + '@', 'ig')
+          _val = _val.replace(reg, data[key])
+        })
+
+        if (card.eval !== 'false') {
+          try {
+            // eslint-disable-next-line
+            _val = eval(_val)
+          } catch (e) {
+            _val = ''
+          }
+        }
+
+        val = _val === undefined ? '' : _val
+      }
+
+      if (val !== '') {
+        val = `${card.prefix || ''}${val}${card.postfix || ''}`
+        if (card.eval === 'false' && /\s/ig.test(val)) {
+          val = val.replace(/\s/ig, '&nbsp;')
+          val = <span dangerouslySetInnerHTML={{__html: val}}></span>
+        }
+      }
+
+      if (card.marks) {
+        let mark = getMark(card.marks, data, _style)
+
+        _style = mark.style
+
+        if (mark.icon) {
+          if (mark.position === 'front') {
+            val = <span><MkIcon style={{color: mark.color}} type={mark.icon} /> {val}</span>
+          } else {
+            val = <span>{val} <MkIcon style={{color: mark.color}} type={mark.icon} /></span>
+          }
+        }
+      }
+
+      return (
+        <Col key={card.uuid} span={card.width}>
+          <div style={_style}>
+            <div className={'ant-mk-text line' + (card.height || '')} style={{height: card.innerHeight || 'auto'}}>{val}</div>
+          </div>
+        </Col>
+      )
     } else if (card.eleType === 'button') {
+      if (card.control === 'hidden') {
+        let s = data[card.controlField]
+        if (s === card.controlVal || (card.controlVal && card.controlVal.split(',').includes(s))) {
+          return null
+        }
+      }
+      
+      let _data = [data]
+
+      if (data.$$type === 'extendCard') {
+        _data = data.$$selectedData || []
+      } else if (data.$$empty) {
+        _data = []
+      } else if (card.$sync) {
+        _data = this.props.syncData
+      }
+
       if (['exec', 'prompt', 'pop'].includes(card.OpenType)) {
         return (
-          <Col key={card.uuid} span={card.width}>
-            <div style={card.style}>
-              <NormalButton
-                BID={data.$$BID}
-                btn={card}
-                show={card.show}
-                style={card.btnstyle}
-                setting={cards.setting}
-                columns={cards.columns}
-                selectedData={[data]}
-              />
-            </div>
+          <Col key={card.uuid} className="mk-cell-btn" span={card.width}>
+            <NormalButton
+              BID={data.$$BID}
+              BData={data.$$BData || ''}
+              disabled={data.$disabled}
+              btn={card}
+              show={card.show}
+              style={card.style}
+              setting={cards.setting}
+              columns={cards.columns}
+              selectedData={_data}
+            />
           </Col>
         )
       } else if (card.OpenType === 'excelIn') {
         return (
-          <Col key={card.uuid} span={card.width}>
-            <div style={card.style}>
-              <ExcelInButton
-                BID={data.$$BID}
-                btn={card}
-                show={card.show}
-                style={card.btnstyle}
-                setting={cards.setting}
-                selectedData={[data]}
-              />
-            </div>
+          <Col key={card.uuid} className="mk-cell-btn" span={card.width}>
+            <ExcelInButton
+              BID={data.$$BID}
+              BData={data.$$BData || ''}
+              disabled={data.$disabled}
+              btn={card}
+              show={card.show}
+              style={card.style}
+              setting={cards.setting}
+              selectedData={_data}
+            />
           </Col>
         )
       } else if (card.OpenType === 'excelOut') {
         return (
-          <Col key={card.uuid} span={card.width}>
-            <div style={card.style}>
-              <ExcelOutButton
-                BID={data.$$BID}
-                btn={card}
-                show={card.show}
-                style={card.btnstyle}
-                setting={cards.setting}
-              />
-            </div>
+          <Col key={card.uuid} className="mk-cell-btn" span={card.width}>
+            <ExcelOutButton
+              BID={data.$$BID}
+              BData={data.$$BData || ''}
+              disabled={data.$disabled}
+              btn={card}
+              show={card.show}
+              style={card.style}
+              setting={cards.setting}
+            />
           </Col>
         )
       } else if (card.OpenType === 'popview') {
         return (
-          <Col key={card.uuid} span={card.width}>
-            <div style={card.style}>
-              <PopupButton
-                BID={data.$$BID}
-                btn={card}
-                show={card.show}
-                style={card.btnstyle}
-                setting={cards.setting}
-                selectedData={[data]}
-              />
-            </div>
+          <Col key={card.uuid} className="mk-cell-btn" span={card.width}>
+            <PopupButton
+              BID={data.$$BID}
+              BData={data.$$BData || ''}
+              disabled={data.$disabled}
+              btn={card}
+              show={card.show}
+              style={card.style}
+              setting={cards.setting}
+              selectedData={_data}
+            />
           </Col>
         )
       } else if (card.OpenType === 'tab') {
         return (
-          <Col key={card.uuid} span={card.width}>
-            <div style={card.style}>
-              <TabButton
-                btn={card}
-                show={card.show}
-                style={card.btnstyle}
-                setting={cards.setting}
-                selectedData={[data]}
-              />
-            </div>
+          <Col key={card.uuid} className="mk-cell-btn" span={card.width}>
+            <TabButton
+              BData={data.$$BData || ''}
+              disabled={data.$disabled}
+              btn={card}
+              show={card.show}
+              style={card.style}
+              setting={cards.setting}
+              selectedData={_data}
+            />
           </Col>
         )
       } else if (card.OpenType === 'innerpage') {
         return (
-          <Col key={card.uuid} span={card.width}>
-            <div style={card.style}>
-              <NewPageButton
-                btn={card}
-                show={card.show}
-                style={card.btnstyle}
-                setting={cards.setting}
-                selectedData={[data]}
-              />
-            </div>
+          <Col key={card.uuid} className="mk-cell-btn" span={card.width}>
+            <NewPageButton
+              BData={data.$$BData || ''}
+              disabled={data.$disabled}
+              btn={card}
+              show={card.show}
+              style={card.style}
+              setting={cards.setting}
+              selectedData={_data}
+            />
           </Col>
         )
       } else if (card.OpenType === 'funcbutton') {
-        if (card.funcType === 'changeuser') {
+        if (card.funcType === 'changeuser' || card.funcType === 'closetab') {
           return (
-            <Col key={card.uuid} span={card.width}>
-              <div style={card.style}>
-                <ChangeUserButton
-                  BID={data.$$BID}
-                  btn={card}
-                  show={card.show}
-                  style={card.btnstyle}
-                  setting={cards.setting}
-                  selectedData={[data]}
-                />
-              </div>
+            <Col key={card.uuid} className="mk-cell-btn" span={card.width}>
+              <ChangeUserButton
+                BID={data.$$BID}
+                BData={data.$$BData || ''}
+                disabled={data.$disabled}
+                btn={card}
+                show={card.show}
+                style={card.style}
+                setting={cards.setting}
+                selectedData={_data}
+              />
             </Col>
           )
         } else if (card.funcType === 'print') {
           return (
-            <Col key={card.uuid} span={card.width}>
-              <div style={card.style}>
-                <PrintButton
-                  BID={data.$$BID}
-                  btn={card}
-                  show={card.show}
-                  style={card.btnstyle}
-                  setting={cards.setting}
-                  selectedData={[data]}
-                />
-              </div>
+            <Col key={card.uuid} className="mk-cell-btn" span={card.width}>
+              <PrintButton
+                BID={data.$$BID}
+                BData={data.$$BData || ''}
+                disabled={data.$disabled}
+                btn={card}
+                show={card.show}
+                style={card.style}
+                setting={cards.setting}
+                selectedData={_data}
+              />
             </Col>
           )
         }
       }
     }
+
+    return null
   }
 
   render() {

--
Gitblit v1.8.0