From f59a500d24291d7f54b71dcca939a2a23dedca7c Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期四, 18 六月 2020 17:52:03 +0800
Subject: [PATCH] 2020-06-18
---
src/mob/mobcard/index.jsx | 178 ++++++++++++++++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 163 insertions(+), 15 deletions(-)
diff --git a/src/mob/mobcard/index.jsx b/src/mob/mobcard/index.jsx
index 3cbb63d..2186629 100644
--- a/src/mob/mobcard/index.jsx
+++ b/src/mob/mobcard/index.jsx
@@ -1,15 +1,30 @@
import React, {Component} from 'react'
import { is, fromJS } from 'immutable'
-import { Button, Card, Spin, Icon, Row, Col } from 'antd'
+import PropTypes from 'prop-types'
+import { Card, Spin, Icon, Row, Col, Modal, notification } from 'antd'
import Api from '@/api'
-// import Utils from '@/utils/utils.js'
+import Utils from '@/utils/utils.js'
+import zhCN from '@/locales/zh-CN/mob.js'
+import enUS from '@/locales/en-US/mob.js'
+import asyncComponent from '@/utils/asyncSpinComponent'
import './index.scss'
+const { confirm } = Modal
+const MutilForm = asyncComponent(() => import('./mutilform'))
+
class CardChart extends Component {
+ static propTpyes = {
+ jumpMenu: PropTypes.func // 椤甸潰璺宠浆
+ }
+
state = {
- loading: false,
- data: []
+ dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
+ loading: true,
+ visible: false,
+ confirmloading: false,
+ data: [],
+ card: null
}
shouldComponentUpdate (nextProps, nextState) {
@@ -24,18 +39,131 @@
let param = {
func: 's_get_kei'
}
+
+ Api.getCloudConfig(param).then(result => {
+ if (result.status) {
+ this.setState({
+ loading: false,
+ data: result.data.map(item => {
+ return {
+ uuid: item.ID,
+ keiNo: item.kei_no,
+ name: item.remark,
+ type: item.typename
+ }
+ })
+ })
+
+ } else {
+ this.setState({
+ loading: false
+ })
+ notification.warning({
+ top: 92,
+ message: result.message,
+ duration: 5
+ })
+ }
+ })
+ }
+
+ editCard = (card) => {
+ this.setState({
+ card: card || null,
+ visible: true
+ })
+ }
+
+ deleteCard = (card) => {
+ let _this = this
+
+ confirm({
+ title: '纭畾鍒犻櫎銆�' + card.name + '銆嬪悧锛�',
+ content: '',
+ okText: this.state.dict['mob.confirm'],
+ cancelText: this.state.dict['mob.cancel'],
+ onOk() {
+ return new Promise(resolve => {
+ let param = {
+ func: 's_kei_del',
+ ID: card.uuid,
+ kei_no: card.keiNo
+ }
- // _param.LText = Utils.formatOptions(_param.LText) // 鍏抽敭瀛楃鏇挎崲锛宐ase64鍔犲瘑
- // _param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') + '.000' // 鏃堕棿鎴�
- // _param.secretkey = Utils.encrypt(_param.LText, _param.timestamp) // md5瀵嗛挜
+ Api.getCloudConfig(param).then(result => {
+ if (result.status) {
+ notification.success({
+ top: 92,
+ message: '鍒犻櫎鎴愬姛锛�',
+ duration: 5
+ })
- Api.getCloudConfig(param).then(res => {
+ _this.getMobCards()
+ } else {
+ notification.warning({
+ top: 92,
+ message: result.message,
+ duration: 5
+ })
+ }
+ resolve()
+ })
+ })
+ },
+ onCancel() {}
+ })
+ }
+ submitCard = () => {
+ const { card } = this.state
+
+ this.mobcardRef.handleConfirm().then(res => {
+ this.setState({
+ confirmloading: true
+ })
+
+ let param = {
+ func: 's_kei_addupt',
+ ID: card ? card.uuid : Utils.getuuid(),
+ TypeName: res.type,
+ remark: res.name,
+ kei_no: res.type
+ }
+
+ Api.getCloudConfig(param).then(result => {
+ if (result.status) {
+ notification.success({
+ top: 92,
+ message: card ? '淇敼鎴愬姛锛�' : '娣诲姞鎴愬姛锛�',
+ duration: 5
+ })
+
+ this.setState({
+ confirmloading: false,
+ visible: false,
+ loading: true
+ })
+ this.getMobCards()
+ } else {
+ this.setState({
+ confirmloading: false
+ })
+ notification.warning({
+ top: 92,
+ message: result.message,
+ duration: 5
+ })
+ }
+ }, () => {
+ this.setState({
+ confirmloading: false
+ })
+ })
})
}
render() {
- const { data, loading } = this.state
+ const { data, loading, card, dict } = this.state
return (
<div className="mob-card-row-box">
@@ -47,17 +175,22 @@
}
<Row gutter={24}>
{data && data.length > 0 &&
- data.map((item, i) => (
- <Col key={i} span={6}>
+ data.map(item => (
+ <Col key={item.uuid} span={6}>
<Card
size="small"
className="chart-card"
actions={[
- <Button />,
+ <Icon title="edit" onClick={() => this.editCard(item)} type="edit" />,
+ <Icon title="delete" onClick={() => this.deleteCard(item)} type="close" />,
+ <Icon title="detail" onClick={() => this.props.jumpMenu(item)} type="arrow-right" />
]}
>
- <div className="ant-card-meta-detail">
-
+ <div className="mk-mob-card-title">
+ {item.name}
+ </div>
+ <div className="mk-mob-card-type">
+ {item.type === 'mob' ? '绉诲姩绔�' : 'PC绔�'}
</div>
</Card>
</Col>
@@ -65,11 +198,26 @@
}
<Col span={6} key="insert">
- <div className="chart-card insert" onClick={() => {}}>
+ <div className="chart-card insert" onClick={() => this.editCard()}>
<Icon type="plus" />
</div>
</Col>
</Row>
+ <Modal
+ className="mob-card-modal"
+ title={card ? '缂栬緫搴旂敤' : '鏂板缓搴旂敤'}
+ width={'600px'}
+ maskClosable={false}
+ visible={this.state.visible}
+ okText={this.state.dict['mob.confirm']}
+ cancelText={this.state.dict['mob.cancel']}
+ onCancel={() => this.setState({visible: false})}
+ confirmLoading={this.state.confirmloading}
+ onOk={this.submitCard}
+ destroyOnClose
+ >
+ <MutilForm card={card} dict={dict} wrappedComponentRef={(inst) => this.mobcardRef = inst} inputSubmit={this.submitCard} />
+ </Modal>
</div>
)
}
--
Gitblit v1.8.0