From 9f9d68cf40f1d7470bfb49220266b26663cbb722 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期六, 23 十一月 2019 14:55:11 +0800 Subject: [PATCH] 2019-11-23-01 --- src/index.js | 6 src/views/login/loginform.jsx | 118 +++++++++ src/components/header/index.jsx | 9 src/store/reducer.js | 11 src/store/action-type.js | 5 src/components/sidemenu/editthdmenu/index.jsx | 5 src/templates/comtableconfig/index.jsx | 232 +++++++++++------- src/templates/comtableconfig/settingform/index.jsx | 4 src/templates/comtableconfig/searchform/index.jsx | 46 ++ src/store/action.js | 12 src/views/login/index.scss | 16 + src/locales/zh-CN/comtable.js | 3 src/templates/comtableconfig/editcard/index.jsx | 53 ++-- src/locales/en-US/comtable.js | 3 src/templates/comtableconfig/dragelement/card.jsx | 24 + src/views/login/index.jsx | 138 ++--------- 16 files changed, 420 insertions(+), 265 deletions(-) diff --git a/src/components/header/index.jsx b/src/components/header/index.jsx index 069158e..40897f4 100644 --- a/src/components/header/index.jsx +++ b/src/components/header/index.jsx @@ -6,7 +6,7 @@ import {Dropdown, Menu, Icon, Modal, message, Form, notification, Switch } from 'antd' import md5 from 'md5' import asyncComponent from '@/utils/asyncComponent' -import {toggleCollapse, modifyMainMenu, resetState, resetDebug, resetEditState, resetEditLevel} from '@/store/action' +import {toggleCollapse, modifyMainMenu, resetState, resetDebug, resetEditState, resetEditLevel, logout} from '@/store/action' import Resetpwd from '@/components/resetpwd' import Api from '@/api' import zhCN from '@/locales/zh-CN/header.js' @@ -105,6 +105,8 @@ okText: this.state.dict['header.confirm'], cancelText: this.state.dict['header.cancel'], onOk() { + sessionStorage.clear() + _this.props.logout() _this.props.history.replace('/login') // return Api.logoutsystem().then(res => { // if (res.status) { @@ -286,10 +288,11 @@ return { toggleCollapse: (collapse) => dispatch(toggleCollapse(collapse)), modifyMainMenu: (selectmenu) => dispatch(modifyMainMenu(selectmenu)), + resetEditState: (state) => dispatch(resetEditState(state)), + resetEditLevel: (level) => dispatch(resetEditLevel(level)), resetState: () => dispatch(resetState()), resetDebug: () => dispatch(resetDebug()), - resetEditState: (state) => dispatch(resetEditState(state)), - resetEditLevel: (level) => dispatch(resetEditLevel(level)) + logout: () => dispatch(logout()) } } diff --git a/src/components/sidemenu/editthdmenu/index.jsx b/src/components/sidemenu/editthdmenu/index.jsx index 53ee91e..704a66c 100644 --- a/src/components/sidemenu/editthdmenu/index.jsx +++ b/src/components/sidemenu/editthdmenu/index.jsx @@ -281,6 +281,7 @@ useTemplate = (template) => { const { type, editMenu } = this.state + // 閫夋嫨妯℃澘锛氭坊鍔犺彍鍗曟椂 if (type === 'add') { this.setState({ @@ -293,13 +294,13 @@ src: '', text: '', type: template.type, - PageParam: {OpenType: "newtab", Template: template.type}, + PageParam: {OpenType: 'newtab', Template: template.type}, LongParam: '', ParentID: this.props.supMenu.MenuID } }) } else { - let _PageParam = {OpenType: editMenu.PageParam.OpenType, Template: template.type} + let _PageParam = {OpenType: editMenu.PageParam.OpenType || 'newtab', Template: template.type} this.setState({ tabview: template.type, diff --git a/src/index.js b/src/index.js index cad9ff0..ec4170e 100644 --- a/src/index.js +++ b/src/index.js @@ -6,7 +6,11 @@ import * as serviceWorker from './serviceWorker' import '@/assets/css/main.scss' import '@/assets/css/action.scss' -import '@/assets/css/minkeicon.css'; +import '@/assets/css/minkeicon.css' + +if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) { + window.location.replace(window.location.href.split('build/')[0] + 'index.html') +} const render = Component => { ReactDOM.render( diff --git a/src/locales/en-US/comtable.js b/src/locales/en-US/comtable.js index 7cf9624..3193464 100644 --- a/src/locales/en-US/comtable.js +++ b/src/locales/en-US/comtable.js @@ -45,6 +45,9 @@ 'header.form.link': '鍏宠仈鑿滃崟', 'header.form.dateday': 'Date(Day)', 'header.form.datetime': 'Date(Second)', + 'header.form.dateweek': '鏃ユ湡锛堝懆锛�', + 'header.form.datemonth': '鏃ユ湡锛堟湀锛�', + 'header.form.dateyear': '鏃ユ湡锛堝勾锛�', 'header.form.initval': 'Initial Value', 'header.form.isRequired': '琛岃缃�', 'header.form.notRequired': '涓嶉�夋嫨琛�', diff --git a/src/locales/zh-CN/comtable.js b/src/locales/zh-CN/comtable.js index 9e1ae17..0917cb1 100644 --- a/src/locales/zh-CN/comtable.js +++ b/src/locales/zh-CN/comtable.js @@ -45,6 +45,9 @@ 'header.form.link': '鍏宠仈鑿滃崟', 'header.form.dateday': '鏃ユ湡锛堝ぉ锛�', 'header.form.datetime': '鏃ユ湡锛堢锛�', + 'header.form.dateweek': '鏃ユ湡锛堝懆锛�', + 'header.form.datemonth': '鏃ユ湡锛堟湀锛�', + 'header.form.dateyear': '鏃ユ湡锛堝勾锛�', 'header.form.initval': '鍒濆鍊�', 'header.form.isRequired': '琛岃缃�', 'header.form.notRequired': '涓嶉�夋嫨琛�', diff --git a/src/store/action-type.js b/src/store/action-type.js index 78b0554..5666d95 100644 --- a/src/store/action-type.js +++ b/src/store/action-type.js @@ -23,4 +23,7 @@ export const RESET_EDITSTATE = 'RESET_EDITSTATE' // 閲嶇疆缂栬緫绾у埆 -export const RESET_EDITLEVEL = 'RESET_EDITLEVEL' \ No newline at end of file +export const RESET_EDITLEVEL = 'RESET_EDITLEVEL' + +// 閫�鍑� +export const LOGOUT = 'LOGOUT' \ No newline at end of file diff --git a/src/store/action.js b/src/store/action.js index 01456d0..0453b80 100644 --- a/src/store/action.js +++ b/src/store/action.js @@ -64,13 +64,15 @@ // 閲嶇疆缂栬緫绾у埆 export const resetEditLevel = (editLevel) => { - // if (editLevel) { - // document.getElementById('root').style.overflow = 'hidden' - // } else { - // document.getElementById('root').style.overflow = 'visible' - // } return { type: user.RESET_EDITLEVEL, editLevel } +} + +// 閫�鍑洪噸缃� +export const logout = () => { + return { + type: user.LOGOUT + } } \ No newline at end of file diff --git a/src/store/reducer.js b/src/store/reducer.js index b17a352..866d534 100644 --- a/src/store/reducer.js +++ b/src/store/reducer.js @@ -65,6 +65,17 @@ ...state, editLevel: action.editLevel } + case Type.LOGOUT: + return { + selectedMainMenu: '', + tabviews: [], + collapse: false, + isiframe: false, + debug: false, + editState: false, + editLevel: null, + refreshTab: null + } default: return state } diff --git a/src/templates/comtableconfig/dragelement/card.jsx b/src/templates/comtableconfig/dragelement/card.jsx index 5b4d873..85766a9 100644 --- a/src/templates/comtableconfig/dragelement/card.jsx +++ b/src/templates/comtableconfig/dragelement/card.jsx @@ -5,6 +5,8 @@ import ItemTypes from './itemtypes' import './index.scss' +const { MonthPicker, WeekPicker } = DatePicker + const Card = ({ id, type, card, moveCard, findCard, editCard, copyCard, hasDrop }) => { const originalIndex = findCard(id).index const [{ isDragging }, drag] = useDrag({ @@ -47,17 +49,23 @@ <label title={card.label}>{card.label}</label> </div> <div className="ant-col ant-form-item-control-wrapper"> - {card.type === 'text' && - <Input style={{marginTop: '4px'}} defaultValue={card.initval} /> + {card.type === 'text' ? + <Input style={{marginTop: '4px'}} defaultValue={card.initval} /> : null } - {(card.type === 'select' || card.type === 'link') && - <Select defaultValue={card.initval}></Select> + {(card.type === 'select' || card.type === 'link') ? + <Select defaultValue={card.initval}></Select> : null } - {card.type === 'date' && - <DatePicker defaultValue={card.initval ? moment(card.initval, 'YYYY-MM-DD') : null} /> + {card.type === 'date' ? + <DatePicker defaultValue={card.initval ? moment().subtract(card.initval, 'days') : null} /> : null } - {card.type === 'datetime' && - <DatePicker showTime defaultValue={card.initval ? moment(card.initval, 'YYYY-MM-DD HH:mm:ss') : null} /> + {card.type === 'dateweek' ? + <WeekPicker defaultValue={card.initval ? moment().subtract(card.initval * 7, 'days') : null} /> : null + } + {card.type === 'datemonth' ? + <MonthPicker defaultValue={card.initval ? moment().subtract(card.initval, 'month') : null} /> : null + } + {card.type === 'datetime' ? + <DatePicker showTime defaultValue={card.initval ? moment(card.initval, 'YYYY-MM-DD HH:mm:ss') : null} /> : null } <div className="input-mask"></div> </div> diff --git a/src/templates/comtableconfig/editcard/index.jsx b/src/templates/comtableconfig/editcard/index.jsx index c7b8b25..9223eba 100644 --- a/src/templates/comtableconfig/editcard/index.jsx +++ b/src/templates/comtableconfig/editcard/index.jsx @@ -6,8 +6,21 @@ constructor(props) { super(props) + let _type = props.card.type + if (props.type === 'columns') { + if (_type !== 'picture') { + _type = 'text' + } + } else if (props.type === 'search') { + if (_type === 'number') { + _type = 'text' + } else if (_type === 'datetime') { + _type = 'date' + } + } + this.state = { - card: props.card, + card: {...props.card, type: _type}, type: props.type } } @@ -28,34 +41,26 @@ render() { const { card, type } = this.state - let _type = card.type - if (type === 'columns') { - if (_type !== 'picture') { - _type = 'text' - } - } else if (type === 'search') { - if (_type === 'number') { - _type = 'text' - } else if (_type === 'datetime') { - _type = 'date' - } - } return ( <div className={'ant-card ant-card-bordered ' + (card.selected ? 'selected' : '')} > <div className="base" onClick={this.changeSelect}> <Icon type="check" /> - <p title={card.field}>瀛楁鍚�: <span>{card.field}</span></p> - <p title={card.label}>鎻愮ず鏂囧瓧: <span>{card.label}</span></p> + <p title={card.field}>瀛楁锛� <span>{card.field}</span></p> + <p title={card.label}>鍚嶇О锛� <span>{card.label}</span></p> </div> - {type === 'search' && <Radio.Group onChange={this.changeType} value={_type} disabled={!card.selected}> - <Radio value="text">text</Radio> - <Radio value="select">select</Radio> - <Radio value="date">date</Radio> - </Radio.Group>} - {type === 'columns' && <Radio.Group onChange={this.changeType} value={_type} disabled={!card.selected}> - <Radio value="text">text</Radio> - <Radio value="picture">picture</Radio> - </Radio.Group>} + {type === 'search' ? + <Radio.Group onChange={this.changeType} value={card.type} disabled={!card.selected}> + <Radio value="text">text</Radio> + <Radio value="select">select</Radio> + <Radio value="date">date</Radio> + </Radio.Group> : null + } + {type === 'columns' ? + <Radio.Group onChange={this.changeType} value={card.type} disabled={!card.selected}> + <Radio value="text">text</Radio> + <Radio value="picture">picture</Radio> + </Radio.Group> : null + } </div> ) } diff --git a/src/templates/comtableconfig/index.jsx b/src/templates/comtableconfig/index.jsx index 4586930..c6c3636 100644 --- a/src/templates/comtableconfig/index.jsx +++ b/src/templates/comtableconfig/index.jsx @@ -198,6 +198,7 @@ field: item.FieldName, label: item.FieldDec, type: _type, + datatype: _type, decimal: _decimal } }) @@ -273,20 +274,26 @@ initVal: card.type, required: true, options: [{ - MenuID: 'text', + value: 'text', text: this.state.dict['header.form.text'] }, { - MenuID: 'select', + value: 'select', text: this.state.dict['header.form.select'] }, { - MenuID: 'link', + value: 'link', text: this.state.dict['header.form.link'] }, { - MenuID: 'date', + value: 'date', text: this.state.dict['header.form.dateday'] }, { - MenuID: 'datetime', - text: this.state.dict['header.form.datetime'] + value: 'dateweek', + text: this.state.dict['header.form.dateweek'] + }, { + value: 'datemonth', + text: this.state.dict['header.form.datemonth'] + }, { + value: 'dateyear', + text: this.state.dict['header.form.dateyear'] }] }, { @@ -303,10 +310,10 @@ initVal: card.resourceType || '0', required: true, options: [{ - MenuID: '0', + value: '0', text: this.state.dict['header.form.custom'] }, { - MenuID: '1', + value: '1', text: this.state.dict['header.form.datasource'] }] }, @@ -316,10 +323,10 @@ label: this.state.dict['header.form.setAll'], initVal: card.setAll || 'false', options: [{ - MenuID: 'true', + value: 'true', text: this.state.dict['header.form.true'] }, { - MenuID: 'false', + value: 'false', text: this.state.dict['header.form.false'] }] }, @@ -377,10 +384,10 @@ label: this.state.dict['header.form.orderType'], initVal: card.orderType || 'asc', options: [{ - MenuID: 'asc', + value: 'asc', text: this.state.dict['header.form.asc'] }, { - MenuID: 'desc', + value: 'desc', text: this.state.dict['header.form.desc'] }] }, @@ -391,19 +398,19 @@ initVal: card.match || 'like', required: true, options: [{ - MenuID: 'like', + value: 'like', text: 'like' }, { - MenuID: 'equal', + value: 'equal', text: 'equal' }, { - MenuID: 'greater', + value: 'greater', text: '>' }, { - MenuID: 'less', + value: 'less', text: '<' }, { - MenuID: 'greaterequal', + value: 'greaterequal', text: '>=' }] }, @@ -414,10 +421,10 @@ initVal: card.display || 'dropdown', required: true, options: [{ - MenuID: 'dropdown', + value: 'dropdown', text: this.state.dict['header.form.dropdown'] }, { - MenuID: 'button', + value: 'button', text: this.state.dict['header.form.button'] }] } @@ -686,6 +693,7 @@ return item } }) + _config[res.type] = _config[res.type].filter(item => !item.origin) } this.setState({ @@ -916,6 +924,7 @@ queryField = (type) => { const {selectedTables, tableColumns, config} = this.state + // 鍒ゆ柇鏄惁宸查�夋嫨琛ㄥ悕 if (selectedTables.length === 0) { notification.warning({ top: 92, @@ -925,6 +934,7 @@ return } + // 琛ㄥ瓧娈甸泦杞负map鏁版嵁 let columns = new Map() tableColumns.forEach(table => { table.columns.forEach(column => { @@ -933,19 +943,24 @@ }) if (type === 'search') { + // 娣诲姞鎼滅储鏉′欢锛屽瓧娈甸泦涓瓨鍦ㄦ悳绱㈡潯浠跺瓧娈碉紝浣跨敤鎼滅储鏉′欢瀵硅薄鏇挎崲瀛楁闆嗭紝璁剧疆鏁版嵁绫诲瀷 config.search.forEach(item => { if (columns.has(item.field)) { - columns.set(item.field, {...item, selected: true, type: item.type}) + let _datatype = columns.get(item.field).datatype + columns.set(item.field, {...item, selected: true, datatype: _datatype}) } }) } else if (type === 'columns') { + // 娣诲姞鏄剧ず鍒楋紝瀛楁闆嗕腑瀛樺湪鏄剧ず鍒楀瓧娈碉紝浣跨敤鏄剧ず鍒楀璞℃浛鎹㈠瓧娈甸泦锛岃缃暟鎹被鍨� config.columns.forEach(item => { if (columns.has(item.field)) { - columns.set(item.field, {...item, selected: true, type: item.type}) + let _datatype = columns.get(item.field).datatype + columns.set(item.field, {...item, selected: true, datatype: _datatype}) } }) } + // 鏄剧ず瀛楁闆嗗脊绐� this.setState({ addType: type, tableVisible: true, @@ -954,6 +969,7 @@ } addFieldSubmit = () => { + // 瀛楁闆嗕负绌猴紝鍏抽棴寮圭獥 if (!this.state.fields || this.state.fields.length === 0) { this.setState({ tableVisible: false, @@ -962,34 +978,72 @@ } const {addType, config} = this.state + const textmatch = { // 閫夋嫨text鏃跺尮閰嶈鍒� + text: 'like', + number: 'like', + datetime: 'like', + date: 'like' + } + const selectmatch = { // 閫夋嫨select鏃跺尮閰嶈鍒� + text: 'equal', + number: 'equal', + datetime: 'equal', + date: 'equal' + } + const datematch = { // 閫夋嫨date鏃跺尮閰嶈鍒� + text: 'between', + number: 'between', + datetime: 'between', + date: 'between' + } + // 鑾峰彇宸查�夊瓧娈甸泦鍚� let cards = this.refs.searchcard.getSelectedCard() - let columns = new Map() + let columnsMap = new Map() cards.forEach(card => { - columns.set(card.field, card) + columnsMap.set(card.field, card) }) let items = [] if (addType === 'search') { config.search.forEach(item => { - if (columns.has(item.field)) { - let cell = columns.get(item.field) + if (columnsMap.has(item.field)) { + let cell = columnsMap.get(item.field) - if (cell.selected) { + if (cell.selected && cell.type === item.type) { // 鏁版嵁鏈慨鏀� + items.push(item) + } else if (cell.selected) { // 鏁版嵁绫诲瀷淇敼 + if (cell.type === 'text') { + item.match = textmatch[cell.datatype] + } else if (cell.type === 'select') { + item.match = selectmatch[cell.datatype] + } else if (cell.type === 'date') { + item.match = datematch[cell.datatype] + } + item.initval = '' items.push(item) } - columns.delete(item.field) + columnsMap.delete(item.field) } else if (!item.origin) { items.push(item) } }) - let _columns = [...columns.values()] + let _columns = [...columnsMap.values()] let indexes = items.map(card => {return card.id}) - let id = Math.max(...indexes, 0) + let id = Math.max(...indexes, 0) + 1 _columns.forEach(item => { if (item.selected) { + let _match = '' + if (item.type === 'text') { + _match = textmatch[item.datatype] + } else if (item.type === 'select') { + _match = selectmatch[item.datatype] + } else if (item.type === 'date') { + _match = datematch[item.datatype] + } + let newcard = { id: id, uuid: Utils.getuuid(), @@ -1006,6 +1060,7 @@ valueText: '', orderBy: '', orderType: 'asc', + match: _match, display: 'dropdown' } @@ -1015,19 +1070,19 @@ }) } else { config.columns.forEach(item => { - if (columns.has(item.field)) { - let cell = columns.get(item.field) + if (columnsMap.has(item.field)) { + let cell = columnsMap.get(item.field) if (cell.selected) { items.push(item) } - columns.delete(item.field) + columnsMap.delete(item.field) } else if (!item.origin) { items.push(item) } }) - let _columns = [...columns.values()] + let _columns = [...columnsMap.values()] let indexes = items.map(card => {return card.id}) let id = Math.max(...indexes, 0) @@ -1086,16 +1141,6 @@ } else if (/^decimal/.test(_type)) { _decimal = _type.split(',')[1] _decimal = parseInt(_decimal) - if (_decimal > 4) { - _decimal = 4 - } - _type = 'number' - } else if (/^decimal/.test(_type)) { - _decimal = _type.split(',')[1] - _decimal = parseInt(_decimal) - if (_decimal > 4) { - _decimal = 4 - } _type = 'number' } else if (/^datetime/.test(_type)) { _type = 'datetime' @@ -1109,6 +1154,7 @@ field: item.FieldName, label: item.FieldDec, type: _type, + datatype: _type, decimal: _decimal } }) @@ -1316,34 +1362,37 @@ } style={{ width: '100%' }}> <Icon type="setting" onClick={this.changeSetting} /> <div className="search-list"> - {this.state.config.search && !this.state.searchloading && - <DragElement - list={this.state.config.search} - type="search" - placeholder={this.state.dict['header.form.search.placeholder']} - handleList={this.handleList} - handleMenu={this.handleSearch} - />} + {!this.state.searchloading ? + <DragElement + list={this.state.config.search} + type="search" + placeholder={this.state.dict['header.form.search.placeholder']} + handleList={this.handleList} + handleMenu={this.handleSearch} + /> : null + } </div> <div className="action-list"> - {this.state.config.action && !this.state.actionloading && - <DragElement - list={this.state.config.action} - type="action" - placeholder={this.state.dict['header.form.action.placeholder']} - handleList={this.handleList} - handleMenu={this.handleAction} - />} + {!this.state.actionloading ? + <DragElement + list={this.state.config.action} + type="action" + placeholder={this.state.dict['header.form.action.placeholder']} + handleList={this.handleList} + handleMenu={this.handleAction} + /> : null + } </div> <div className="column-list"> - {this.state.config.columns && !this.state.columnsloading && - <DragElement - list={this.state.config.columns} - type="columns" - placeholder={this.state.dict['header.form.column.placeholder']} - handleList={this.handleList} - handleMenu={this.handleColumn} - />} + {!this.state.columnsloading ? + <DragElement + list={this.state.config.columns} + type="columns" + placeholder={this.state.dict['header.form.column.placeholder']} + handleList={this.handleList} + handleMenu={this.handleColumn} + /> : null + } </div> </Card> </div> @@ -1361,24 +1410,30 @@ ]} destroyOnClose > - {this.state.formtemp === 'search' && <SearchForm - dict={this.state.dict} - formlist={this.state.formlist} - card={this.state.card} - wrappedComponentRef={(inst) => this.formRef = inst} - />} - {this.state.formtemp === 'action' && <ActionForm - dict={this.state.dict} - card={this.state.card} - formlist={this.state.formlist} - wrappedComponentRef={(inst) => this.formRef = inst} - />} - {this.state.formtemp === 'columns' && <ColumnForm - dict={this.state.dict} - card={this.state.card} - formlist={this.state.formlist} - wrappedComponentRef={(inst) => this.formRef = inst} - />} + {this.state.formtemp === 'search' ? + <SearchForm + dict={this.state.dict} + formlist={this.state.formlist} + card={this.state.card} + wrappedComponentRef={(inst) => this.formRef = inst} + /> : null + } + {this.state.formtemp === 'action' ? + <ActionForm + dict={this.state.dict} + card={this.state.card} + formlist={this.state.formlist} + wrappedComponentRef={(inst) => this.formRef = inst} + /> : null + } + {this.state.formtemp === 'columns' ? + <ColumnForm + dict={this.state.dict} + card={this.state.card} + formlist={this.state.formlist} + wrappedComponentRef={(inst) => this.formRef = inst} + /> : null + } </Modal> {/* 鏍规嵁瀛楁鍚嶆坊鍔犳樉绀哄垪鍙婃悳绱㈡潯浠� */} <Modal @@ -1396,11 +1451,8 @@ }} destroyOnClose > - {this.state.addType === 'search' && this.state.fields.length > 0 && - <EditCard data={this.state.fields} ref="searchcard" type="search" /> - } - {this.state.addType === 'columns' && this.state.fields.length > 0 && - <EditCard data={this.state.fields} ref="searchcard" type="columns" /> + {this.state.addType && this.state.fields.length > 0 ? + <EditCard data={this.state.fields} ref="searchcard" type={this.state.addType} /> : null } {(!this.state.fields || this.state.fields.length === 0) && <Empty /> diff --git a/src/templates/comtableconfig/searchform/index.jsx b/src/templates/comtableconfig/searchform/index.jsx index 1e08bf7..d71d855 100644 --- a/src/templates/comtableconfig/searchform/index.jsx +++ b/src/templates/comtableconfig/searchform/index.jsx @@ -1,7 +1,7 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { Form, Row, Col, Input, Select, Icon, Radio, notification } from 'antd' -import moment from 'moment' +// import moment from 'moment' import EditTable from '../editable' import './index.scss' @@ -17,7 +17,13 @@ state = { openType: null, resourceType: null, - formlist: null + formlist: null, + dateoptions: { + date: [{value: '', text: '绌�'}, {value: '0', text: '褰撳ぉ'}, {value: 1, text: '鍓嶄竴澶�'}, {value: 3, text: '鍓嶄笁澶�'}, {value: 7, text: '鍓嶄竷澶�'}, {value: 30, text: '鍓�30澶�'}], + dateweek: [{value: '', text: '绌�'}, {value: '0', text: '鏈懆'}, {value: 1, text: '涓婂懆'}, {value: 3, text: '鍓嶄笁鍛�'}, {value: 7, text: '鍓嶄竷鍛�'}], + datemonth: [{value: '', text: '绌�'}, {value: '0', text: '鏈湀'}, {value: 1, text: '涓婃湀'}, {value: 3, text: '鍓嶄笁鏈�'}, {value: 7, text: '鍓嶄竷鏈�'}], + dateyear: [{value: '', text: '绌�'}, {value: '0', text: '褰撳勾'}, {value: 1, text: '鍘诲勾'}, {value: 3, text: '鍓嶅勾'}], + } } openTypeChange = (key, value) => { @@ -37,7 +43,26 @@ openType: value, formlist: this.state.formlist.map(form => { form.hidden = !_options.includes(form.key) + if (form.key === 'initval') { + if (this.state.dateoptions.hasOwnProperty(value)) { + form.options = this.state.dateoptions[value] + form.type = 'select' + } else { + form.type = 'text' + } + form.initVal = '' + form.hidden = true + } return form + }) + }, () => { + this.setState({ + formlist: this.state.formlist.map(form => { + if (form.key === 'initval') { + form.hidden = false + } + return form + }) }) }) } @@ -74,12 +99,6 @@ if (item.hidden) return if (item.type === 'text') { // 鏂囨湰鎼滅储 - let placeholder = '' - if (item.key === 'initval' && this.state.openType === 'date') { - placeholder = '渚嬶細' + moment().format('YYYY-MM-DD') - } else if (item.key === 'initval' && this.state.openType === 'datetime') { - placeholder = '渚嬶細' + moment().format('YYYY-MM-DD HH:mm:ss') - } fields.push( <Col span={12} key={index}> <Form.Item label={item.label}> @@ -91,7 +110,7 @@ message: this.props.dict['form.required.input'] + item.label + '!' } ] - })(<Input placeholder={placeholder} autoComplete="off" disabled={item.readonly} />)} + })(<Input placeholder="" autoComplete="off" disabled={item.readonly} />)} </Form.Item> </Col> ) @@ -115,7 +134,7 @@ getPopupContainer={() => document.getElementById('commontable-search-form-box')} > {item.options.map(option => - <Select.Option id={option.MenuID} title={option.text} key={option.MenuID} value={option.MenuID}> + <Select.Option id={option.value} title={option.text} key={option.value} value={option.value}> {item.key === 'icon' && <Icon type={option.text} />} {option.text} </Select.Option> )} @@ -141,7 +160,7 @@ { item.options.map(option => { return ( - <Radio key={option.MenuID} value={option.MenuID}>{option.text}</Radio> + <Radio key={option.value} value={option.value}>{option.text}</Radio> ) }) } @@ -175,6 +194,7 @@ ) } }) + return fields } @@ -241,6 +261,10 @@ openType: type, resourceType: resourceType, formlist: formlist.map(form => { + if (this.state.dateoptions.hasOwnProperty(type) && form.key === 'initval') { + form.options = this.state.dateoptions[type] + form.type = 'select' + } form.hidden = !_options.includes(form.key) return form }) diff --git a/src/templates/comtableconfig/settingform/index.jsx b/src/templates/comtableconfig/settingform/index.jsx index 80780e0..b928f98 100644 --- a/src/templates/comtableconfig/settingform/index.jsx +++ b/src/templates/comtableconfig/settingform/index.jsx @@ -12,10 +12,6 @@ card: PropTypes.object } - state = { - - } - handleConfirm = () => { // 琛ㄥ崟鎻愪氦鏃舵鏌ヨ緭鍏ュ�兼槸鍚︽纭� return new Promise((resolve, reject) => { diff --git a/src/views/login/index.jsx b/src/views/login/index.jsx index ddbdb1f..d2a148c 100644 --- a/src/views/login/index.jsx +++ b/src/views/login/index.jsx @@ -1,5 +1,5 @@ import React, {Component} from 'react' -import { Form, Icon, Input, Button, Checkbox, Dropdown, Menu, message, Modal } from 'antd' +import { message } from 'antd' import md5 from 'md5' import moment from 'moment' import Api from '@/api' @@ -7,45 +7,25 @@ import enUS from '@/locales/en-US/login.js' import options from '@/store/options.js' import Utils from '@/utils/utils.js' +import asyncComponent from '@/utils/asyncComponent' import logourl from '../../assets/img/login-logo.png' import './index.scss' -const { warning } = Modal +const LoginForm = asyncComponent(() => import('./loginform')) +const iszhCN = !localStorage.getItem('lang') || localStorage.getItem('lang') === 'zh-CN' class Login extends Component { - constructor (props) { - super(props) - - const iszhCN = !localStorage.getItem('lang') || localStorage.getItem('lang') === 'zh-CN' - - this.state = { - langs: [{ - name: '涓枃绠�浣�', - value: 'zh-CN' - }, { - name: 'English', - value: 'en-US' - }], - selectedlang: iszhCN ? - { - name: '涓枃绠�浣�', - value: 'zh-CN' - } : - { - name: 'English', - value: 'en-US' - }, - dict: iszhCN ? zhCN : enUS, - isDisabled: false, - auth: false - } + state = { + selectedlang: iszhCN ? 'zh-CN' : 'en-US', + dict: iszhCN ? zhCN : enUS, + isDisabled: false, + auth: false } changelang (item) { // 鍒囨崲璇█ this.setState({ - selectedlang: item, - dict: item.value === 'zh-CN' ? zhCN : enUS + dict: item === 'zh-CN' ? zhCN : enUS }) } @@ -55,25 +35,12 @@ return md5(md5(pwd + salt)) } - handleSubmit = e => { - // 鐧诲綍鍙傛暟妫�楠� - e.preventDefault() - if (!this.state.auth) { - warning({ - title: this.state.dict['login.auth.tip'], - okText: this.state.dict['login.auth.ok'], - cancelText: this.state.dict['login.auth.cancel'], - onOk() {}, - onCancel() {} - }) - return - } - this.props.form.validateFields((err, values) => { - if (err) return + handleSubmit = () => { + this.loginformRef.handleConfirm().then(res => { this.setState({ isDisabled: true }) - this.loginsubmit(values) + this.loginsubmit(res) }) } @@ -88,7 +55,7 @@ sessionStorage.setItem('UserID', res.UserID) sessionStorage.setItem('SessionUid', Utils.getuuid()) sessionStorage.setItem('LoginUID', res.LoginUID) - localStorage.setItem('lang', this.state.selectedlang.value) + localStorage.setItem('lang', param.lang) if (param.remember) { // 璁颁綇瀵嗙爜鏃惰处鍙峰瘑鐮佸瓨鍏ocalStorage localStorage.setItem('username', param.username) @@ -116,7 +83,7 @@ } } - UNSAFE_componentWillMount () { + componentDidMount () { let timeStamp = new Date().getTime() let str = md5('MK19' + options.AppId + timeStamp) Api.systemauth(options.AppId, timeStamp).then(res => { @@ -140,9 +107,6 @@ } }) - // console.log(options) - // localStorage.setItem('AuthCode', [md5('mksoft' + moment().format('YYYYMMDD'))]) - let authCode = localStorage.getItem('AuthCode') let _s = md5('mksoft' + moment().format('YYYYMMDD')) if (authCode && authCode.includes(_s)) { @@ -152,74 +116,22 @@ } } - componentDidMount () { - const input = document.getElementById('username') - if (input) { - input.focus() - } - } - render () { - const { getFieldDecorator } = this.props.form - const menu = ( - <Menu> - {this.state.langs.map((item, index) => { - return ( - <Menu.Item key={index} onClick={() => {this.changelang(item)}}> - <span>{item.name}</span> - </Menu.Item> - ) - })} - </Menu> - ) return ( <div className="login-container"> <div className="logo"> <img src={logourl} alt=""/> </div> <div className="login-middle"> - <Form onSubmit={this.handleSubmit} className="login-form"> - <h4>鏄庣鍟嗕笟鏅鸿兘寮�鏀惧钩鍙�</h4> - <Form.Item> - {getFieldDecorator('username', { - rules: [{ required: true, message: this.state.dict['login.username.empty'] }], - initialValue: localStorage.getItem('username') || '', - })( - <Input - prefix={<Icon type="user" style={{ color: 'rgba(0,0,0,.25)' }} />} - placeholder={this.state.dict['login.username']} - />, - )} - </Form.Item> - <Form.Item> - {getFieldDecorator('password', { - rules: [{ required: true, message: this.state.dict['login.password.empty'] }], - initialValue: localStorage.getItem('password') || '', - })( - <Input - prefix={<Icon type="lock" style={{ color: 'rgba(0,0,0,.25)' }} />} - type="password" - placeholder={this.state.dict['login.password']} - />, - )} - </Form.Item> - <Form.Item className="minline"> - {getFieldDecorator('remember', { - valuePropName: 'checked', - initialValue: true, - })(<Checkbox>{this.state.dict['login.remember']}</Checkbox>)} - <Dropdown overlay={menu} trigger={['click']} placement="bottomRight"> - <span className="ant-dropdown-link"> - {this.state.selectedlang.name} <Icon type="down" /> - </span> - </Dropdown> - </Form.Item> - <Form.Item className="btn-login"> - <Button type="primary" htmlType="submit" className="login-form-button" disabled={this.state.isDisabled} loading={this.state.isDisabled}> - {this.state.dict['login.submit']} - </Button> - </Form.Item> - </Form> + <LoginForm + dict={this.state.dict} + auth={this.state.auth} + lang={this.state.selectedlang} + isDisabled={this.state.isDisabled} + changelang={(value) => this.changelang(value)} + handleSubmit={() => this.handleSubmit()} + wrappedComponentRef={(inst) => this.loginformRef = inst} + /> </div> <div className="login-bottom"> <p> @@ -237,4 +149,4 @@ } } -export default Form.create()(Login) \ No newline at end of file +export default Login \ No newline at end of file diff --git a/src/views/login/index.scss b/src/views/login/index.scss index 0b4ce02..2ea7d07 100644 --- a/src/views/login/index.scss +++ b/src/views/login/index.scss @@ -22,7 +22,6 @@ float: right; margin-top: 5%; margin-right: 20%; - // padding: 15px; padding: 1.6vw; background: #ffffff; width: 22vw; @@ -43,12 +42,24 @@ margin-bottom: 3vh; } .minline { + display: inline-block; margin-bottom: 3vh; margin-top: -10px; } + .minline.right { + float: right; + width: 100px; + .ant-select-selection { + border: 0; + box-shadow: none; + .ant-select-selection-selected-value { + float: right; + margin-right: 10px; + } + } + } button { width: 100%; - // height: 40px; height: calc(2vw + 10px); line-height: 1; } @@ -66,7 +77,6 @@ } .ant-input { font-size: 16px; - // height: 36px; height: calc(2vw + 5px); } .ant-form label { diff --git a/src/views/login/loginform.jsx b/src/views/login/loginform.jsx new file mode 100644 index 0000000..b3398ca --- /dev/null +++ b/src/views/login/loginform.jsx @@ -0,0 +1,118 @@ +import React, {Component} from 'react' +import PropTypes from 'prop-types' +import { Form, Icon, Input, Button, Checkbox, Select, Modal } from 'antd' +import './index.scss' + +const { warning } = Modal + +class MainSearch extends Component { + static propTpyes = { + isDisabled: PropTypes.bool, + changelang: PropTypes.func, + handleSubmit: PropTypes.func, + dict: PropTypes.object, + auth: PropTypes.bool, + lang: PropTypes.string, + } + + state = {} + + handleConfirm = () => { + // 琛ㄥ崟鎻愪氦鏃舵鏌ヨ緭鍏ュ�兼槸鍚︽纭� + return new Promise((resolve, reject) => { + this.props.form.validateFieldsAndScroll((err, values) => { + if (!err) { + resolve(values) + } else { + reject(err) + } + }) + }) + } + + changelang = (item) => { + this.props.changelang(item) + } + + handleSubmit = e => { + // 鐧诲綍鍙傛暟妫�楠� + e.preventDefault() + if (!this.props.auth) { + warning({ + title: this.props.dict['login.auth.tip'], + okText: this.props.dict['login.auth.ok'], + cancelText: this.props.dict['login.auth.cancel'], + onOk() {}, + onCancel() {} + }) + return + } + this.props.handleSubmit() + } + + componentDidMount () { + const input = document.getElementById('username') + if (input) { + input.focus() + } + } + + render() { + const { getFieldDecorator } = this.props.form + + return ( + <Form onSubmit={this.handleSubmit} className="login-form" id="login-form"> + <h4>鏄庣鍟嗕笟鏅鸿兘寮�鏀惧钩鍙�</h4> + <Form.Item> + {getFieldDecorator('username', { + rules: [{ required: true, message: this.props.dict['login.username.empty'] }], + initialValue: localStorage.getItem('username') || '', + })( + <Input + prefix={<Icon type="user" style={{ color: 'rgba(0,0,0,.25)' }} />} + placeholder={this.props.dict['login.username']} + />, + )} + </Form.Item> + <Form.Item> + {getFieldDecorator('password', { + rules: [{ required: true, message: this.props.dict['login.password.empty'] }], + initialValue: localStorage.getItem('password') || '', + })( + <Input + prefix={<Icon type="lock" style={{ color: 'rgba(0,0,0,.25)' }} />} + type="password" + placeholder={this.props.dict['login.password']} + />, + )} + </Form.Item> + <Form.Item className="minline"> + {getFieldDecorator('remember', { + valuePropName: 'checked', + initialValue: true, + })(<Checkbox>{this.props.dict['login.remember']}</Checkbox>)} + </Form.Item> + <Form.Item className="minline right"> + {getFieldDecorator('lang', { + initialValue: this.props.lang, + })( + <Select + onChange={(value) => {this.changelang(value)}} + getPopupContainer={() => document.getElementById('login-form')} + > + <Select.Option value="zh-CN">涓枃绠�浣�</Select.Option> + <Select.Option value="en-US">English</Select.Option> + </Select> + )} + </Form.Item> + <Form.Item className="btn-login"> + <Button type="primary" htmlType="submit" className="login-form-button" disabled={this.props.isDisabled} loading={this.props.isDisabled}> + {this.props.dict['login.submit']} + </Button> + </Form.Item> + </Form> + ) + } +} + +export default Form.create()(MainSearch) \ No newline at end of file -- Gitblit v1.8.0