| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { withRouter } from 'react-router' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Button, Modal, notification, message } from 'antd' |
| | | import { Button, Modal, notification, message, Progress } from 'antd' |
| | | import CryptoJS from 'crypto-js' |
| | | import moment from 'moment' |
| | | |
| | | import NApi from '@/api' |
| | | import Utils from '@/utils/utils.js' |
| | | import Api from '@/api/w4k.js' |
| | | import Api from '@/api/direct.js' |
| | | import MKEmitter from '@/utils/events.js' |
| | | import MkIcon from '@/components/mk-icon' |
| | | |
| | |
| | | loading: false, |
| | | disabled: false, |
| | | loadingNumber: '', |
| | | loadingTotal: '', |
| | | hidden: false, |
| | | IpList: [], |
| | | lines: [], |
| | |
| | | } |
| | | |
| | | UNSAFE_componentWillMount () { |
| | | const { btn, selectedData } = this.props |
| | | let disabled = false |
| | | const { btn, selectedData, BData, disabled } = this.props |
| | | |
| | | if (btn.controlField && selectedData && selectedData.length > 0) { // 表格中按钮隐藏控制 |
| | | selectedData.forEach(item => { |
| | | let s = item[btn.controlField] !== undefined ? item[btn.controlField] + '' : '' |
| | | if (btn.controlVals.includes(s)) { |
| | | disabled = true |
| | | } |
| | | }) |
| | | this.setState({hidden: disabled && btn.control === 'hidden'}) |
| | | } |
| | | |
| | | if (this.props.disabled || disabled) { |
| | | if (btn.controlField) { |
| | | this.setStatus(btn, selectedData || [], BData, disabled) |
| | | } else if (disabled) { |
| | | this.setState({disabled: true}) |
| | | } |
| | | } |
| | |
| | | } |
| | | |
| | | UNSAFE_componentWillReceiveProps (nextProps) { |
| | | const { btn, selectedData } = this.props |
| | | const { btn } = this.props |
| | | |
| | | let disabled = false |
| | | if (btn.controlField && !is(fromJS(nextProps.selectedData || []), fromJS(selectedData || []))) { |
| | | if (nextProps.selectedData && nextProps.selectedData.length > 0) { // 表格中按钮隐藏控制 |
| | | nextProps.selectedData.forEach(item => { |
| | | let s = item[btn.controlField] !== undefined ? item[btn.controlField] + '' : '' |
| | | if (btn.controlVals.includes(s)) { |
| | | disabled = true |
| | | } |
| | | }) |
| | | } |
| | | this.setState({hidden: disabled && btn.control === 'hidden'}) |
| | | } |
| | | |
| | | if (nextProps.disabled || disabled) { |
| | | this.setState({disabled: true}) |
| | | if (btn.controlField) { |
| | | this.setStatus(btn, nextProps.selectedData || [], nextProps.BData, nextProps.disabled) |
| | | } else { |
| | | this.setState({disabled: false}) |
| | | this.setState({disabled: nextProps.disabled === true}) |
| | | } |
| | | } |
| | | |
| | |
| | | MKEmitter.removeListener('triggerBtnId', this.actionTrigger) |
| | | } |
| | | |
| | | setStatus = (btn, data, BData, disprop) => { |
| | | let disabled = false |
| | | let hidden = false |
| | | |
| | | if (btn.control !== 'parent') { |
| | | if (data.length > 0) { |
| | | data.forEach(item => { |
| | | let s = item[btn.controlField] !== undefined ? item[btn.controlField] + '' : '' |
| | | if (btn.controlVals.includes(s)) { |
| | | disabled = true |
| | | } |
| | | }) |
| | | } else if (btn.controlVals.includes('')) { |
| | | disabled = true |
| | | } |
| | | } else { |
| | | if (!BData || !BData.hasOwnProperty(btn.controlField)) { |
| | | hidden = true |
| | | } else { |
| | | let s = BData[btn.controlField] + '' |
| | | if (btn.controlVals.includes(s)) { |
| | | hidden = true |
| | | } |
| | | } |
| | | } |
| | | |
| | | if (disabled && btn.control === 'hidden') { |
| | | hidden = true |
| | | } |
| | | |
| | | if (disprop) { |
| | | disabled = true |
| | | } |
| | | |
| | | this.setState({hidden, disabled}) |
| | | } |
| | | |
| | | /** |
| | | * @description 触发按钮操作 |
| | | */ |
| | | actionTrigger = (triggerId, record, type) => { |
| | | const { Tab, BID, btn, selectedData, setting } = this.props |
| | | actionTrigger = (triggerId, record, type, lid) => { |
| | | const { BID, btn, selectedData, setting, LID } = this.props |
| | | const { loading, disabled } = this.state |
| | | |
| | | if (loading || disabled) return |
| | | if (triggerId && btn.uuid !== triggerId) return |
| | | |
| | | if (((Tab && Tab.supMenu) || setting.supModule) && !BID) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '需要上级主键值!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } else if (type === 'linkbtn' && !btn.$toolbtn && !is(fromJS(selectedData || []), fromJS(record))) { |
| | | return |
| | | } |
| | | if (type === 'linkbtn' && !btn.$toolbtn && LID !== lid) return |
| | | |
| | | let data = record || selectedData || [] |
| | | // let data = fromJS(mockdata.data).toJS() |
| | | |
| | | if (data.length === 0) { |
| | | |
| | | if (setting.supModule && !BID) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: setting.supModTip || '需要上级主键值!', |
| | | duration: 5 |
| | | }) |
| | | } else if (data.length === 0) { |
| | | // 需要选择行时,校验数据 |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '请选择行!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } else { |
| | | this.setState({ |
| | | loading: true, |
| | | lines: data |
| | | }) |
| | | this.getIpList() |
| | | } |
| | | |
| | | this.setState({ |
| | | loading: true, |
| | | lines: data |
| | | }) |
| | | |
| | | this.getIpList() |
| | | } |
| | | |
| | | getIpList = () => { |
| | | let _scriptSql = `select ID,data_code,data_name,Remark,face_ip,face_uname,face_pwd from bd_data where typecharone='face_device' and deleted=0` |
| | | |
| | | _scriptSql = Utils.formatOptions(_scriptSql) |
| | | |
| | | let _sParam = { |
| | | func: 'sPC_Get_SelectedList', |
| | | LText: _scriptSql, |
| | | obj_name: 'data', |
| | | arr_field: 'ID,data_code,data_name,Remark,face_ip,face_uname,face_pwd' |
| | | } |
| | | |
| | | if (window.GLOB.execType === 'x') { |
| | | _sParam.exec_type = 'x' |
| | | } |
| | | |
| | | _sParam.LText = Utils.formatOptions(_scriptSql, _sParam.exec_type) |
| | | _sParam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | _sParam.secretkey = Utils.encrypt(_sParam.LText, _sParam.timestamp) |
| | | _sParam.secretkey = Utils.encrypt(window.GLOB.execType === 'x' ? '' : _sParam.LText, _sParam.timestamp) |
| | | |
| | | NApi.getSystemCacheConfig(_sParam).then(res => { |
| | | if (res.status) { |
| | |
| | | } |
| | | |
| | | loginDevice = () => { |
| | | const { btn } = this.props |
| | | const { lines, selectIp } = this.state |
| | | |
| | | // 上报接口设置:工程模式-场景模式-开放接口设置-数据上报设置-数据上报服务器地址(开启服务器二次鉴权) |
| | | // let ip = 'http://localhost:3001' |
| | | let ip = selectIp.face_ip |
| | | |
| | | Api.login(ip, selectIp.face_uname, selectIp.face_pwd).then(result => { |
| | | Api.w4kLogin(ip, selectIp.face_uname, selectIp.face_pwd).then(result => { |
| | | if (result.errors) { |
| | | this.execPreError(result) |
| | | return |
| | |
| | | |
| | | document.cookie = 'sessionID=' + result.session_id |
| | | |
| | | Api.queryUsers(ip).then(res => { |
| | | Api.w4kQueryUsers(ip).then(res => { |
| | | if (res.errors) { |
| | | this.execPreError(res) |
| | | return |
| | |
| | | } |
| | | }) |
| | | |
| | | if (data.length > 1 && btn.progress === 'progressbar') { |
| | | this.setState({ |
| | | loadingTotal: data.length |
| | | }) |
| | | } |
| | | |
| | | this.addUser(ip, data, result.session_id) |
| | | }) |
| | | }, err => { |
| | |
| | | let data = datas.shift() |
| | | |
| | | this.setState({ |
| | | loadingNumber: datas.length || '' |
| | | loadingNumber: datas.length |
| | | }) |
| | | |
| | | let error = '' |
| | |
| | | } |
| | | |
| | | if (error) { |
| | | this.execError({ErrCode: 'E', ErrMesg: error}) |
| | | this.execError({ErrCode: 'E', message: error}) |
| | | return |
| | | } |
| | | |
| | |
| | | data.id_number = CryptoJS.enc.Base64.stringify(encrypted.ciphertext) |
| | | } |
| | | |
| | | Api.addUsers(ip, data).then(res => { |
| | | Api.w4kAddUsers(ip, data).then(res => { |
| | | if (res.errors) { |
| | | this.execPreError(res, data) |
| | | return |
| | |
| | | if (datas.length > 0) { |
| | | this.addUser(ip, datas, sessionId) |
| | | } else { |
| | | this.execSuccess({ErrCode: 'S', ErrMesg: '执行成功。'}) |
| | | this.execSuccess({ErrCode: 'S', message: '执行成功。'}) |
| | | } |
| | | }, (err) => { |
| | | this.execPreError(err, data) |
| | |
| | | * 4、模态框执行成功后是否关闭 |
| | | * 5、通知主列表刷新 |
| | | */ |
| | | execSuccess = (res) => { |
| | | execSuccess = (res = {}) => { |
| | | const { btn } = this.props |
| | | |
| | | if (res && (res.ErrCode === 'S' || !res.ErrCode)) { // 执行成功 |
| | | if (res.ErrCode === 'S' || !res.ErrCode) { // 执行成功 |
| | | notification.success({ |
| | | top: 92, |
| | | message: res.ErrMesg || '执行成功', |
| | | message: res.message || '执行成功', |
| | | duration: btn.verify && btn.verify.stime ? btn.verify.stime : 2 |
| | | }) |
| | | } else if (res && res.ErrCode === 'Y') { // 执行成功 |
| | | Modal.success({ |
| | | title: res.ErrMesg || '执行成功' |
| | | title: res.message || '执行成功' |
| | | }) |
| | | } else if (res && res.ErrCode === '-1') { // 完成后不提示 |
| | | |
| | |
| | | |
| | | this.setState({ |
| | | loading: false, |
| | | loadingNumber: '' |
| | | loadingNumber: '', |
| | | loadingTotal: '' |
| | | }) |
| | | |
| | | // if (btn.execSuccess !== 'never') { |
| | |
| | | |
| | | if (res.ErrCode === 'E') { |
| | | Modal.error({ |
| | | title: res.message || res.ErrMesg, |
| | | title: res.message || '执行失败!', |
| | | }) |
| | | } else if (res.ErrCode === 'N') { |
| | | notification.error({ |
| | | top: 92, |
| | | message: res.message || res.ErrMesg, |
| | | message: res.message || '执行失败!', |
| | | duration: btn.verify && btn.verify.ntime ? btn.verify.ntime : 10 |
| | | }) |
| | | } else if (res.ErrCode === 'F') { |
| | | notification.error({ |
| | | className: 'notification-custom-error', |
| | | top: 92, |
| | | message: res.message || res.ErrMesg, |
| | | message: res.message || '执行失败!', |
| | | duration: btn.verify && btn.verify.ftime ? btn.verify.ftime : 10 |
| | | }) |
| | | } else if (res.ErrCode === 'NM') { |
| | | message.error(res.message || res.ErrMesg) |
| | | message.error(res.message || '执行失败!') |
| | | } |
| | | |
| | | this.setState({ |
| | | loading: false, |
| | | loadingNumber: '' |
| | | loadingNumber: '', |
| | | loadingTotal: '' |
| | | }) |
| | | |
| | | // if (btn.execError !== 'never') { |
| | |
| | | } |
| | | |
| | | render() { |
| | | const { btn, show } = this.props |
| | | const { loading, disabled, hidden, loadingNumber } = this.state |
| | | const { btn } = this.props |
| | | const { loading, disabled, hidden, loadingNumber, loadingTotal } = this.state |
| | | |
| | | if (hidden) return null |
| | | |
| | | if (show === 'actionList') { |
| | | return ( |
| | | <> |
| | | <Button |
| | | icon={btn.icon} |
| | | loading={loading} |
| | | disabled={disabled} |
| | | title={disabled ? (btn.reason || '') : ''} |
| | | className={'mk-btn mk-' + btn.class} |
| | | onClick={(e) => {e.stopPropagation(); this.actionTrigger()}} |
| | | >{(loadingNumber ? `(${loadingNumber})` : '') + btn.label}</Button> |
| | | {this.getModels()} |
| | | </> |
| | | ) |
| | | } else { // icon、text、 all 卡片 |
| | | let label = '' |
| | | let icon = '' |
| | | let label = '' |
| | | |
| | | if (show === 'button') { |
| | | label = btn.label |
| | | icon = btn.icon || '' |
| | | } else if (show === 'link') { |
| | | label = <span>{btn.label}{btn.icon ? <MkIcon style={{marginLeft: '8px'}} type={btn.icon}/> : ''}</span> |
| | | icon = '' |
| | | } else if (show === 'icon') { |
| | | icon = btn.icon || '' |
| | | } else { |
| | | label = btn.label |
| | | } |
| | | |
| | | return ( |
| | | <> |
| | | <Button |
| | | type="link" |
| | | title={disabled ? (btn.reason || '') : (show === 'icon' ? btn.label : '')} |
| | | loading={loading} |
| | | disabled={disabled} |
| | | style={btn.style} |
| | | icon={icon} |
| | | onClick={(e) => {e.stopPropagation(); this.actionTrigger()}} |
| | | >{label}</Button> |
| | | {this.getModels()} |
| | | </> |
| | | ) |
| | | if (btn.show === 'link') { |
| | | label = <span>{btn.label}{btn.icon ? <MkIcon style={{marginLeft: '8px'}} type={btn.icon} /> : ''}</span> |
| | | } else if (btn.show === 'icon') { |
| | | label = !loading ? <MkIcon type={btn.icon} /> : null |
| | | } else if (btn.$toolbtn) { |
| | | label = <span>{!loading && btn.icon ? <MkIcon style={{marginRight: '8px'}} type={btn.icon} /> : ''}{loadingNumber && !loadingTotal ? `(${loadingNumber})` : ''}{btn.label}</span> |
| | | } else { |
| | | label = <span>{!loading && btn.icon ? <MkIcon style={{marginRight: '8px'}} type={btn.icon} /> : ''}{btn.label}</span> |
| | | } |
| | | |
| | | return ( |
| | | <> |
| | | <Button |
| | | type="link" |
| | | title={disabled ? (btn.reason || '') : (btn.show === 'icon' ? btn.label : '')} |
| | | loading={loading} |
| | | disabled={disabled} |
| | | style={btn.style} |
| | | className={btn.hover || ''} |
| | | onClick={(e) => {e.stopPropagation(); this.actionTrigger()}} |
| | | >{label}</Button> |
| | | {this.getModels()} |
| | | {loadingTotal ? <Progress className="mk-button-progress" percent={(loadingTotal - loadingNumber) / loadingTotal * 100} size="small" showInfo={false} /> : null} |
| | | </> |
| | | ) |
| | | } |
| | | } |
| | | |
| | | export default withRouter(FuncButton) |
| | | export default FuncButton |