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