From 20c83dab04d53d60b5fcd08aad3d5d9fbfb4fa5c Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期四, 19 十月 2023 19:46:05 +0800 Subject: [PATCH] Merge branch 'master' into positec --- src/tabviews/custom/components/table/edit-table/normalTable/index.jsx | 167 ++++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 164 insertions(+), 3 deletions(-) diff --git a/src/tabviews/custom/components/table/edit-table/normalTable/index.jsx b/src/tabviews/custom/components/table/edit-table/normalTable/index.jsx index 0f95fec..95e8350 100644 --- a/src/tabviews/custom/components/table/edit-table/normalTable/index.jsx +++ b/src/tabviews/custom/components/table/edit-table/normalTable/index.jsx @@ -1,7 +1,7 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { is, fromJS } from 'immutable' -import { Table, Typography, Modal, Input, InputNumber, Button, notification, message, Select } from 'antd' +import { Table, Typography, Modal, Input, InputNumber, Switch, Button, notification, message, Select, DatePicker } from 'antd' import { EditOutlined, QuestionCircleOutlined } from '@ant-design/icons' import moment from 'moment' import md5 from 'md5' @@ -10,13 +10,96 @@ import asyncComponent from '@/utils/asyncComponent' import Utils, { getEditTableSql, getMark } from '@/utils/utils.js' import MKEmitter from '@/utils/events.js' -import CusSwitch from './cusSwitch' import Encrypts from '@/components/encrypts' import './index.scss' const { Paragraph } = Typography const MkIcon = asyncComponent(() => import('@/components/mk-icon')) const CardCellComponent = asyncComponent(() => import('@/tabviews/custom/components/card/cardcellList')) + +class CusSwitch extends Component { + static propTpyes = { + defaultValue: PropTypes.any, + autoFocus: PropTypes.any, + config: PropTypes.object, + onChange: PropTypes.func + } + + state = { + status: false + } + + UNSAFE_componentWillMount () { + const { defaultValue, config } = this.props + + let status = false + + if (defaultValue === config.openVal) { + status = true + } + + this.setState({status}) + } + + changeStatus = (val) => { + const { config } = this.props + this.setState({ status: val }, () => { + let _val = val ? config.openVal : config.closeVal + let _text = val ? config.openText : config.closeText + this.props.onChange(_val, _text) + }) + } + + render() { + const { config, autoFocus } = this.props + const { status } = this.state + return ( + <Switch checkedChildren={config.openText} autoFocus={autoFocus} onBlur={this.props.onBlur} unCheckedChildren={config.closeText} checked={status} onChange={this.changeStatus} /> + ) + } +} + +class CusDatePicker extends Component { + static propTpyes = { + defaultValue: PropTypes.any, + config: PropTypes.object, + onChange: PropTypes.func, + blur: PropTypes.func + } + + state = { + value: null, + open: false + } + + UNSAFE_componentWillMount () { + const { value, open } = this.props + + let _value = value || null + if (_value) { + _value = moment(_value, 'YYYY-MM-DD HH:mm:ss') + } + + this.setState({value: _value, open: open === true}) + } + + onOpenChange = (open) => { + this.setState({open}) + + if (open === false) { + this.props.blur() + } + } + + render() { + const { config } = this.props + const { value, open } = this.state + + return ( + <DatePicker dropdownClassName={'mk-date-picker ' + config.precision} showTime={config.format !== 'YYYY-MM-DD'} format={config.format} open={open} defaultValue={value} onChange={this.props.onChange} onOpenChange={this.onOpenChange}/> + ) + } +} class BodyRow extends React.Component { shouldComponentUpdate (nextProps, nextState) { @@ -254,6 +337,33 @@ MKEmitter.emit('changeRecord', col.tableId, {...record, ...values}) } + onDateChange = (val) => { + const { col, record } = this.props + + let _val = val ? moment(val).format(col.format) : '' + + if (col.precision === 'hour') { + _val = _val + ':00:00' + } else if (col.precision === 'minute') { + _val = _val + ':00' + } + + this.setState({editing: false}) + + setTimeout(() => { + if (/\$next/.test(col.enter)) { + MKEmitter.emit('nextLine', col, record.$$uuid) + } else if (col.enter === '$sub') { + MKEmitter.emit('subLine', col, record) + } else if (col.enter !== '$noAct') { + let node = document.getElementById(col.enter + record.$$uuid) + node && node.click() + } + }, 50) + + MKEmitter.emit('changeRecord', col.tableId, {...record, [col.field]: _val}) + } + switchBlur = () => { setTimeout(() => { this.setState({editing: false}) @@ -325,6 +435,10 @@ if (!col.editType || col.editType === 'text') { return (<td className="editing_table_cell"> <Input className={err ? 'has-error' : ''} title={err} id={col.uuid + record.$$uuid} defaultValue={value} onChange={(e) => this.onChange(e.target.value)} onPressEnter={this.enterPress} onBlur={this.onBlur}/> + </td>) + } else if (col.editType === 'date') { + return (<td className="editing_table_cell"> + <CusDatePicker config={col} value={record[col.field] || null} open={true} onChange={this.onDateChange} blur={() => this.setState({editing: false})}/> </td>) } else if (col.editType === 'switch') { let _value = record[col.field] !== undefined ? record[col.field] : '' @@ -694,6 +808,31 @@ MKEmitter.emit('changeRecord', col.tableId, {...record, ...values}) } + onDateChange = (val) => { + const { col, record } = this.props + + let _val = val ? moment(val).format(col.format) : '' + + if (col.precision === 'hour') { + _val = _val + ':00:00' + } else if (col.precision === 'minute') { + _val = _val + ':00' + } + + setTimeout(() => { + if (/\$next/.test(col.enter)) { + MKEmitter.emit('nextLine', col, record.$$uuid) + } else if (col.enter === '$sub') { + MKEmitter.emit('subLine', col, record) + } else if (col.enter !== '$noAct') { + let node = document.getElementById(col.enter + record.$$uuid) + node && node.click() + } + }, 50) + + MKEmitter.emit('changeRecord', col.tableId, {...record, [col.field]: _val}) + } + render() { let { col, config, record, style, className, ...resProps } = this.props const { err } = this.state @@ -717,6 +856,10 @@ } else if (col.editType === 'switch') { children = ( <CusSwitch config={col} autoFocus={false} defaultValue={_value} onChange={this.onSwitchChange} onBlur={() => {}}/> + ) + } else if (col.editType === 'date') { + children = ( + <CusDatePicker config={col} value={record[col.field] || null} onChange={this.onDateChange} blur={() => {}}/> ) } else { children = (<> @@ -1042,6 +1185,16 @@ item.map.set(cell.value, cell.label) }) } + } else if (item.type === 'text' && item.editType === 'date') { + item.format = 'YYYY-MM-DD' + + if (item.precision === 'hour') { + item.format = 'YYYY-MM-DD HH' + } else if (item.precision === 'minute') { + item.format = 'YYYY-MM-DD HH:mm' + } else if (item.precision === 'second') { + item.format = 'YYYY-MM-DD HH:mm:ss' + } } } @@ -1075,7 +1228,13 @@ if (item.field === setting.primaryKey) return if (_forms[item.field]) { - forms.push({..._forms[item.field], datatype: item.datatype}) + let _item = {..._forms[item.field]} + if (_item.editType === 'date') { + _item.datatype = _item.declareType || 'datetime' + } else { + _item.datatype = item.datatype + } + forms.push(_item) } else { forms.push(item) } @@ -1665,6 +1824,8 @@ let val = item[col.field] !== undefined ? (item[col.field] + '') : '' if (col.required === 'true' && !val) { line.push(`${col.label}涓嶅彲涓虹┖`) + } else if (col.datatype === 'datetime' && !val) { + val = '1949-10-01' } item[col.field] = val } else if (col.type === 'number') { -- Gitblit v1.8.0