From 607b5dc4059be1843b6c0f670b93f107fc263375 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期四, 19 三月 2020 16:08:29 +0800
Subject: [PATCH] 2020-03-19
---
src/tabviews/tabmanage/index.jsx | 509 ++++++++++++++++++++++++++++++++++++++++++++++++++++----
1 files changed, 472 insertions(+), 37 deletions(-)
diff --git a/src/tabviews/tabmanage/index.jsx b/src/tabviews/tabmanage/index.jsx
index 9bc06b9..9dd64ec 100644
--- a/src/tabviews/tabmanage/index.jsx
+++ b/src/tabviews/tabmanage/index.jsx
@@ -1,20 +1,21 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
-import { Row, Col, Input, Button, Card, notification } from 'antd'
-// import moment from 'moment'
+import { Row, Col, Input, Button, Card, notification, Modal, Empty, Spin } from 'antd'
+import moment from 'moment'
import Api from '@/api'
import zhCN from '@/locales/zh-CN/main.js'
import enUS from '@/locales/en-US/main.js'
import Utils from '@/utils/utils.js'
-// import options from '@/store/options.js'
-// import { verupMainTable } from './config.js'
+import TransferForm from '@/components/transferform'
import subtableurl from '@/assets/img/subtable.jpg'
+import MutilForm from './mutilform'
import './index.scss'
const { Search } = Input
+const { confirm } = Modal
class TabManage extends Component {
static propTpyes = {
@@ -28,18 +29,51 @@
ContainerId: Utils.getuuid(), // 鑿滃崟澶栧眰html Id
searchKey: '',
tabviews: null,
- cols: 8
+ loading: true,
+ modaltype: '',
+ editTab: null,
+ submitloading: false,
+ cols: 8,
+ thawVisible: false,
+ thawmenulist: null
+
}
+ getTabs = () => {
+ Api.getSystemConfig({func: 'sPC_Get_UserTemp', TypeCharTwo: 'tab'}).then(res => {
+ if (res.status) {
+ this.setState({
+ loading: false,
+ tabviews: res.UserTemp.map(temp => {
+ return {
+ uuid: temp.MenuID,
+ value: temp.MenuID,
+ MenuName: temp.MenuName,
+ type: temp.Template,
+ MenuNo: temp.MenuNo,
+ Remark: temp.Remark
+ }
+ })
+ })
+ } else {
+ this.setState({
+ loading: false
+ })
+ notification.warning({
+ top: 92,
+ message: res.message,
+ duration: 10
+ })
+ }
+ })
+ }
UNSAFE_componentWillMount () {
let docwidth = document.body.offsetWidth
let cols = 8
- if (docwidth > 1500) {
+ if (docwidth > 1800) {
cols = 6
- } else if (docwidth > 1900) {
- cols = 4
}
this.setState({
@@ -48,27 +82,7 @@
}
componentDidMount () {
- Api.getSystemConfig({func: 'sPC_Get_UserTemp', TypeCharTwo: 'tab'}).then(res => {
- if (res.status) {
- this.setState({
- tabviews: res.UserTemp.map(temp => {
- return {
- uuid: temp.MenuID,
- value: temp.MenuID,
- text: temp.MenuName,
- type: temp.Template,
- MenuNo: temp.MenuNo
- }
- })
- })
- } else {
- notification.warning({
- top: 92,
- message: res.message,
- duration: 10
- })
- }
- })
+ this.getTabs()
}
shouldComponentUpdate (nextProps, nextState) {
@@ -84,36 +98,457 @@
}
}
+ handleTab = (tab, type) => {
+ let _this = this
+
+ if (type === 'delete') {
+ confirm({
+ title: "纭畾鍒犻櫎璇ユ爣绛惧悧锛�",
+ onOk() {
+ return new Promise(resolve => {
+ let _param = {
+ func: 'sPC_MainMenu_Del',
+ MenuID: tab.uuid
+ }
+
+ Api.getSystemConfig(_param).then(res => {
+ if (!res.status) {
+ notification.warning({
+ top: 92,
+ message: res.message,
+ duration: 10
+ })
+ } else {
+ notification.success({
+ top: 92,
+ message: '鎵ц鎴愬姛',
+ duration: 2
+ })
+ _this.setState({
+ loading: true,
+ tabviews: null
+ }, () => {
+ _this.getTabs()
+ })
+ }
+ resolve()
+ })
+ })
+ },
+ onCancel() {}
+ })
+ } else {
+ this.setState({
+ editTab: tab,
+ modaltype: type
+ })
+ }
+ }
+
+ handleSubmit = () => {
+ const { editTab, modaltype } = this.state
+
+ this.tabFormRef.handleConfirm().then(res => {
+
+ let _tab = {...editTab, ...res}
+
+ this.setState({submitloading: true})
+
+ Api.getSystemConfig({
+ func: 'sPC_Get_LongParam',
+ MenuID: _tab.uuid
+ }).then(res => {
+
+ if (!res.status) {
+ this.setState({
+ submitloading: false
+ })
+ notification.warning({
+ top: 92,
+ message: res.message,
+ duration: 10
+ })
+ return
+ }
+
+ let param = {
+ func: 'sPC_Tab_AddUpt',
+ MenuID: _tab.uuid,
+ MenuNo: _tab.MenuNo,
+ Template: _tab.type,
+ MenuName: _tab.MenuName,
+ Remark: _tab.Remark,
+ PageParam: JSON.stringify({Template: _tab.type}),
+ Sort: 0
+ }
+
+ let _oriActions = []
+
+ let btnParam = {
+ func: 'sPC_Button_AddUpt',
+ Type: 40,
+ ParentID: _tab.uuid,
+ MenuNo: _tab.MenuNo,
+ Template: _tab.type,
+ PageParam: '',
+ LongParam: '',
+ LText: ''
+ }
+
+ if (modaltype === 'edit') {
+ param.LongParam = res.LongParam
+ } else {
+ let _LongParam = ''
+ let _menuId = Utils.getuuid()
+
+ // 瑙ｆ瀽閰嶇疆
+ if (res.LongParam) {
+ try {
+ _LongParam = JSON.parse(window.decodeURIComponent(window.atob(res.LongParam)))
+ } catch (e) {
+ console.warn('Parse Failure')
+ _LongParam = ''
+ }
+ }
+
+ if (_LongParam) {
+ try {
+ _LongParam.uuid = _menuId
+ _LongParam.tabName = _tab.MenuName
+ _LongParam.tabNo = _tab.MenuNo
+ _LongParam.Remark = _tab.Remark
+
+ let _linkchange = {}
+ btnParam.LText = []
+
+ _LongParam.action = _LongParam.action.map((item, index) => {
+ let uuid = Utils.getuuid()
+
+ if (item.OpenType === 'pop') {
+ _oriActions.push({
+ prebtn: JSON.parse(JSON.stringify(item)),
+ curuuid: uuid,
+ Template: 'Modal'
+ })
+ } else if (item.OpenType === 'popview') {
+ _linkchange[item.linkTab] = Utils.getuuid()
+
+ item.linkTab = _linkchange[item.linkTab]
+ }
+
+ item.uuid = uuid
+
+ btnParam.LText.push(`select '${item.uuid}' as menuid, '${item.label}' as menuname, '${(index + 1) * 10}' as Sort`)
+
+ return item
+ })
+
+ if (_LongParam.funcs && _LongParam.funcs.length > 0) {
+ _LongParam.funcs = _LongParam.funcs.map(item => {
+ if (item.type === 'tab') {
+ item.linkTab = _linkchange[item.linkTab]
+ item.menuNo = ''
+ item.subfuncs = []
+ }
+
+ return item
+ })
+ }
+
+ btnParam.LText = btnParam.LText.join(' union all ')
+ btnParam.LText = Utils.formatOptions(btnParam.LText)
+ btnParam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') + '.000'
+ btnParam.secretkey = Utils.encrypt(btnParam.LText, btnParam.timestamp)
+
+ _LongParam = window.btoa(window.encodeURIComponent(JSON.stringify(_LongParam)))
+ } catch {
+ console.warn('Stringify Failure')
+ _LongParam = ''
+ }
+ }
+
+ param.MenuID = _menuId
+ param.LongParam = _LongParam
+
+ btnParam.ParentID = _menuId
+ }
+
+ new Promise(resolve => {
+ Api.getSystemConfig(param).then(response => {
+ if (response.status) {
+ resolve(true)
+ } else {
+ notification.warning({
+ top: 92,
+ message: response.message,
+ duration: 10
+ })
+ resolve(false)
+ }
+ })
+ }).then(result => {
+ if (!result) return result
+ if (modaltype === 'edit') return true
+ if (!btnParam.LText) return true
+
+ return Api.getSystemConfig(btnParam)
+ }).then(result => {
+ if (!result) return result
+ if (modaltype === 'edit') return true
+ if (!btnParam.LText) return true
+
+ if (result.status) {
+ return true
+ } else {
+ notification.warning({
+ top: 92,
+ message: result.message,
+ duration: 10
+ })
+ return false
+ }
+ }).then(result => {
+ if (!result) return result
+ if (modaltype === 'edit') return true
+ if (_oriActions.length === 0) return true
+
+ let deffers = _oriActions.map(item => {
+ return new Promise(resolve => {
+ Api.getSystemConfig({
+ func: 'sPC_Get_LongParam',
+ MenuID: item.prebtn.uuid
+ }).then(response => {
+ if (!response.status) {
+ notification.warning({
+ top: 92,
+ message: response.message,
+ duration: 10
+ })
+ resolve(false)
+ } else if (response.status && response.LongParam) {
+ let _param = {
+ func: 'sPC_ButtonParam_AddUpt',
+ ParentID: _tab.uuid,
+ MenuID: item.curuuid,
+ MenuNo: _tab.MenuNo,
+ Template: item.Template,
+ MenuName: item.prebtn.label,
+ PageParam: JSON.stringify({Template: item.Template}),
+ LongParam: response.LongParam
+ }
+ Api.getSystemConfig(_param).then(resp => {
+ if (!resp.status) {
+ notification.warning({
+ top: 92,
+ message: resp.message,
+ duration: 10
+ })
+ resolve(false)
+ } else {
+ resolve(true)
+ }
+ })
+ } else {
+ resolve(true)
+ }
+ })
+ })
+ })
+
+ return Promise.all(deffers)
+ }).then(result => {
+ if (!result) {
+ this.setState({
+ submitloading: false
+ })
+ return
+ }
+
+ let isSuccess = true
+
+ if (typeof(result) === 'object') {
+ result.forEach(resul => {
+ if (!resul) {
+ isSuccess = false
+ }
+ })
+ }
+
+ if (isSuccess) {
+ notification.success({
+ top: 92,
+ message: '鎵ц鎴愬姛',
+ duration: 2
+ })
+ }
+
+ this.setState({
+ loading: true,
+ submitloading: false,
+ modaltype: '',
+ tabviews: null
+ }, () => {
+ this.getTabs()
+ })
+ })
+ })
+ })
+ }
+
+ triggerDraw = () => {
+ this.setState({
+ thawVisible: true
+ })
+
+ Api.getSystemConfig({
+ func: 'sPC_Get_FrozenMenu',
+ TYPE: 50
+ }).then(res => {
+ if (res.status) {
+ this.setState({
+ thawmenulist: res.data.map(menu => {
+ return {
+ key: menu.MenuID,
+ title: menu.MenuName
+ }
+ })
+ })
+ } else {
+ notification.warning({
+ top: 92,
+ message: res.message,
+ duration: 10
+ })
+ }
+ })
+ }
+
+ thawMenuSubmit = () => {
+ if (this.refs.trawmenu.state.targetKeys.length === 0) {
+ notification.warning({
+ top: 92,
+ message: '璇烽�夋嫨瑕佽В闄ゅ喕缁撶殑鏍囩锛�',
+ duration: 10
+ })
+ } else {
+ this.setState({
+ submitloading: true
+ })
+ let defers = this.refs.trawmenu.state.targetKeys.map(item => {
+ return new Promise((resolve) => {
+ Api.getSystemConfig({
+ func: 'sPC_MainMenu_ReDel',
+ MenuID: item
+ }).then(res => {
+ if (res.status) {
+ resolve('')
+ } else {
+ resolve(res.message)
+ }
+ })
+ })
+ })
+ Promise.all(defers).then(res => {
+ let msg = res.filter(Boolean)[0]
+ if (msg) {
+ notification.error({
+ top: 92,
+ message: msg,
+ duration: 15
+ })
+ this.setState({
+ submitloading: false
+ })
+ } else {
+ notification.success({
+ top: 92,
+ message: '鎵ц鎴愬姛',
+ duration: 2
+ })
+ this.setState({
+ submitloading: false,
+ thawVisible: false,
+ thawmenulist: null,
+ tabviews: null
+ }, () => {
+ this.getTabs()
+ })
+ }
+ })
+ }
+ }
+
render() {
- const { cols, tabviews } = this.state
+ const { cols, tabviews, modaltype, editTab, searchKey, loading } = this.state
+
+ let _tabviews = []
+ if (tabviews) {
+ _tabviews = tabviews.filter(tab => tab.MenuName.toLowerCase().indexOf(searchKey.toLowerCase()) >= 0)
+ }
return (
<div className="tab-manage" id={this.state.ContainerId}>
+ {loading && <Spin size="large" />}
<Row>
<Col className="tab-search" span={6}>
<Search placeholder="璇疯緭鍏ユ爣绛惧悕绉�" onSearch={value => {this.setState({searchKey: value})}} enterButton />
</Col>
<Col className="tab-thaw" span={6} offset={12}>
- <Button type="primary">鏍囩瑙ｅ喕</Button>
+ <Button type="primary" onClick={this.triggerDraw}>鏍囩瑙ｅ喕</Button>
</Col>
</Row>
- <Row className="tab-list">
- {tabviews && tabviews.map((tab, index) => {
+ {_tabviews.length > 0 ? <Row className="tab-list">
+ {_tabviews.map((tab, index) => {
return (
<Col span={cols} key={index}>
<Card
className="tab-card"
- title={tab.text}
+ title={tab.MenuName}
>
<img onClick={() => {this.previewPicture()}} src={subtableurl} alt=""/>
- <div className="card-operation">
- <Button type="primary">浣跨敤妯℃澘</Button>
+ <div className="tab-operation">
+ <Button type="primary" onClick={() => this.handleTab(tab, 'edit')}>缂栬緫</Button>
+ <Button className="mk-green" onClick={() => this.handleTab(tab, 'copy')}>澶嶅埗</Button>
+ <Button type="danger" onClick={() => this.handleTab(tab, 'delete')}>鍒犻櫎</Button>
</div>
</Card>
</Col>
)
})}
- </Row>
+ </Row> : null}
+ {tabviews && _tabviews.length === 0 ? <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} /> : null}
+ {/* 鏍囩淇敼鎴栧鍒� */}
+ <Modal
+ title={modaltype === 'edit' ? '鏍囩缂栬緫' : '鏍囩澶嶅埗'}
+ visible={!!modaltype}
+ width={600}
+ maskClosable={false}
+ onOk={this.handleSubmit}
+ confirmLoading={this.state.submitloading}
+ onCancel={() => {this.setState({modaltype: '', editTab: null})}}
+ destroyOnClose
+ >
+ <MutilForm
+ dict={this.state.dict}
+ tab={editTab}
+ inputSubmit={this.handleSubmit}
+ wrappedComponentRef={(inst) => this.tabFormRef = inst}
+ />
+ </Modal>
+ {/* 瑙ｅ喕鏍囩妯℃�佹 */}
+ <Modal
+ title="鏍囩瑙ｉ櫎鍐荤粨"
+ okText={this.state.dict['main.confirm']}
+ cancelText={this.state.dict['main.cancel']}
+ visible={this.state.thawVisible}
+ onOk={this.thawMenuSubmit}
+ confirmLoading={this.state.submitloading}
+ onCancel={() => {this.setState({thawVisible: false, thawmenulist: null})}}
+ destroyOnClose
+ >
+ {!this.state.thawmenulist && <Spin style={{marginLeft: 'calc(50% - 22px)', marginTop: '70px', marginBottom: '70px'}} size="large" />}
+ {this.state.thawmenulist && <TransferForm ref="trawmenu" menulist={this.state.thawmenulist}/>}
+ </Modal>
</div>
)
}
--
Gitblit v1.8.0