import React, {Component} from 'react'
|
// import { fromJS } from 'immutable'
|
import { Spin, notification, Button, Table } from 'antd'
|
|
import Api from '@/api'
|
// import Utils from '@/utils/utils.js'
|
import asyncComponent from '@/utils/asyncComponent'
|
import './index.scss'
|
|
const Header = asyncComponent(() => import('@/mob/header'))
|
// const MobCard = asyncComponent(() => import('@/mob/mobcard'))
|
|
class AppManage extends Component {
|
state = {
|
loading: false,
|
applist: [],
|
columns: [
|
{ title: '应用名称', dataIndex: 'remark', key: 'remark', align: 'center' },
|
{ title: '应用参数', dataIndex: 'kei_no', key: 'kei_no', align: 'center' },
|
{
|
title: 'Action',
|
key: 'action',
|
align: 'center',
|
render: (text, record) => (<Button type="link" style={{color: '#ff4d4f'}}>删除</Button>),
|
},
|
],
|
subcolumns: [
|
{
|
title: '应用类型', dataIndex: 'typename', key: 'typename', align: 'center'
|
},
|
{
|
title: '语言', dataIndex: 'lang', key: 'lang', align: 'center',
|
render: (text, record) => text === 'en-US' ? '英文' : '中文'
|
},
|
{
|
title: '登录', dataIndex: 'login_types', key: 'login_types', align: 'center',
|
render: (text, record) => text === 'false' ? '不需要' : '需要'
|
},
|
{
|
title: '权限管理', dataIndex: 'role_type', key: 'role_type', align: 'center',
|
render: (text, record) => text === 'false' ? '不需要' : '需要'
|
},
|
{
|
title: '短连接', dataIndex: 'link_type', key: 'link_type', align: 'center',
|
render: (text, record) => text === 'false' ? '不启用' : '启用'
|
},
|
{
|
title: 'Action',
|
key: 'action',
|
align: 'center',
|
render: (text, record) => (<Button type="link" style={{color: '#ff4d4f'}}>删除</Button>),
|
},
|
],
|
selectApp: null,
|
selectSubApp: null,
|
selectedRowKeys: [],
|
selectedSubRowKeys: [],
|
}
|
|
UNSAFE_componentWillMount() {
|
document.body.className = ''
|
this.getAppList()
|
}
|
|
/**
|
* @description 组件销毁，清除state更新
|
*/
|
componentWillUnmount () {
|
this.setState = () => {
|
return
|
}
|
}
|
|
getAppList = () => {
|
let param = {
|
func: 's_get_kei'
|
}
|
|
Api.getCloudConfig(param).then(result => {
|
if (result.status) {
|
this.setState({
|
loading: false,
|
applist: result.data.map(item => {
|
item.sublist = item.data_detail || []
|
item.sublist = item.sublist.map(cell => {
|
cell.ID = cell.d_id
|
return cell
|
})
|
|
return item
|
})
|
})
|
|
} else {
|
this.setState({
|
loading: false
|
})
|
notification.warning({
|
top: 92,
|
message: result.message,
|
duration: 5
|
})
|
}
|
})
|
}
|
|
jumpMenu = (card) => {
|
let _type = 'mob'
|
if (card.type === 'pc') {
|
_type = 'pc'
|
}
|
this.props.history.replace(`/mobdesign/${card.uuid}/${_type}/${card.keiNo}/${card.name}`)
|
}
|
|
/**
|
*
|
*/
|
onSelectChange = selectedRowKeys => {
|
const { applist } = this.state
|
let selectApp = applist.filter(item => item.ID === selectedRowKeys[0])[0]
|
|
this.setState({ selectedRowKeys, selectApp })
|
}
|
|
/**
|
*
|
*/
|
onSubChange = selectedSubRowKeys => {
|
|
this.setState({ selectedSubRowKeys })
|
}
|
|
/**
|
* @description 点击整行，触发切换， 判断是否可选，单选或多选，进行对应操作
|
*/
|
changeRow = (record) => {
|
this.setState({ selectedRowKeys: [record.ID], selectApp: record })
|
}
|
|
/**
|
* @description 点击整行，触发切换， 判断是否可选，单选或多选，进行对应操作
|
*/
|
changeSubRow = (record) => {
|
this.setState({ selectedSubRowKeys: [record.ID], selectSubApp: record })
|
}
|
|
render () {
|
const { loading, columns, applist, selectedRowKeys, selectedSubRowKeys, selectApp, subcolumns } = this.state
|
|
return (
|
<div className="mk-app-manage">
|
<Header view="manage" />
|
{loading ?
|
<div className="loading-mask">
|
<div className="ant-spin-blur"></div>
|
<Spin />
|
</div> : null
|
}
|
<div className="app-table">
|
<div className="app-action">
|
<Button className="mk-green">添加</Button>
|
<Button className="mk-purple">修改</Button>
|
</div>
|
<Table
|
rowKey="ID"
|
columns={columns}
|
dataSource={applist}
|
pagination={false}
|
rowSelection={{ type: 'radio', selectedRowKeys, onChange: this.onSelectChange }}
|
onRow={(record) => ({ onClick: () => {this.changeRow(record)} })}
|
/>
|
</div>
|
<div className="app-table">
|
<div className="sub-app-title"><span>子应用</span></div>
|
<div className="app-action">
|
<Button className="mk-green">添加</Button>
|
<Button className="mk-purple">修改</Button>
|
</div>
|
<Table
|
rowKey="ID"
|
columns={subcolumns}
|
dataSource={selectApp ? selectApp.sublist : []}
|
pagination={false}
|
rowSelection={{ type: 'radio', selectedSubRowKeys, onChange: this.onSubChange }}
|
onRow={(record) => ({ onClick: () => {this.changeSubRow(record)} })}
|
/>
|
</div>
|
{/* <MobCard jumpMenu={this.jumpMenu}/> */}
|
</div>
|
)
|
}
|
}
|
|
export default AppManage
|
