|
@@ -0,0 +1,197 @@
|
|
|
+import React from 'react'
|
|
|
+import { FilterTable } from 'wptpc-design'
|
|
|
+import { Link } from 'dva/router'
|
|
|
+import { thanos } from '@/conf/config'
|
|
|
+import { Divider, message, Popconfirm } from 'antd'
|
|
|
+import { delItem, unBind } from './service.js'
|
|
|
+import router from 'umi/router'
|
|
|
+
|
|
|
+const apiUrl = `${thanos}/thanos-admin/api/v1/classify/biz/binds`
|
|
|
+
|
|
|
+const parseQueryString = (url) => {
|
|
|
+ // 先将字符串通过 split 方法,以 "?" 为分割符将其分割成数组;
|
|
|
+ // 该数组有两个元素,第一个为空字符串,第二个为 url 参数字符串
|
|
|
+ const arr = url.split('?')
|
|
|
+ if (arr.length === 1) {
|
|
|
+ return null
|
|
|
+ }
|
|
|
+ // 将参数字符串以 "&" 符号为分隔符进行分割
|
|
|
+ const params = arr[1].split('&')
|
|
|
+ // 定义一个数组用于存储参数
|
|
|
+ const obj = {}
|
|
|
+ // 通过循环将参数以键值对的形式存储在变量 obj 中
|
|
|
+ for (let i = 0; i < params.length; i++) {
|
|
|
+ const arrParams = params[i].split('=')
|
|
|
+ obj[arrParams[0]] = arrParams[1]
|
|
|
+ }
|
|
|
+ return obj
|
|
|
+}
|
|
|
+
|
|
|
+class GroupList extends React.PureComponent {
|
|
|
+ state = {
|
|
|
+ showModal: false,
|
|
|
+ params: {},
|
|
|
+ bizName: ''
|
|
|
+ }
|
|
|
+
|
|
|
+ filterSetting = {
|
|
|
+ beforeSearchFunc: params => {
|
|
|
+ params.queryName = decodeURIComponent(parseQueryString(window.location.href).binds)
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ onParamsChange = (key, value) => {
|
|
|
+ const params = { ...this.state.params }
|
|
|
+ params[key] = value
|
|
|
+ this.setState({ params })
|
|
|
+ }
|
|
|
+
|
|
|
+ // filtertable的列表配置
|
|
|
+ tableSetting = {
|
|
|
+ rowKey: 'id',
|
|
|
+ // isFrontPagination: true,
|
|
|
+ pagination: {
|
|
|
+ pageSize: 10
|
|
|
+ },
|
|
|
+ columnConfig: [
|
|
|
+ // {
|
|
|
+ // title: 'ID',
|
|
|
+ // dataIndex: 'id'
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ title: '分组名称',
|
|
|
+ dataIndex: 'name'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '描述',
|
|
|
+ dataIndex: 'description'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '类型',
|
|
|
+ dataIndex: 'type',
|
|
|
+ render: (text) => {
|
|
|
+ if (text === 0) {
|
|
|
+ return '策略'
|
|
|
+ }
|
|
|
+ if (text === 1) {
|
|
|
+ return '流程'
|
|
|
+ }
|
|
|
+ if (text === 2) {
|
|
|
+ return '模型'
|
|
|
+ }
|
|
|
+ if (text === 3) {
|
|
|
+ return '调度'
|
|
|
+ }
|
|
|
+ if (text === 4) {
|
|
|
+ return '规则'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '决策是否启用',
|
|
|
+ dataIndex: 'enabled',
|
|
|
+ render: (text) => text === true ? '是' : '否'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '创建人',
|
|
|
+ dataIndex: 'createUser'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '修改人',
|
|
|
+ dataIndex: 'updateUser'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '操作',
|
|
|
+ dataIndex: 'actions',
|
|
|
+ // 所有需要弹窗操作的都可以用编辑的逻辑;所有不需要弹窗的操作,比如上架、发布等,都可以用”删除“的逻辑
|
|
|
+ render: (text, record) => (
|
|
|
+ <span>
|
|
|
+ <Link
|
|
|
+ to={{
|
|
|
+ pathname: './note/' + record.name,
|
|
|
+ state: record
|
|
|
+ }}
|
|
|
+ >记录</Link>
|
|
|
+ <Divider type="vertical"/>
|
|
|
+ <Link
|
|
|
+ to={{
|
|
|
+ pathname: './edit/' + record.name,
|
|
|
+ state: record
|
|
|
+ }}
|
|
|
+ >编辑</Link>
|
|
|
+ <Divider type="vertical"/>
|
|
|
+ <Popconfirm
|
|
|
+ title="确定删除"
|
|
|
+ onConfirm={() => this.delItem(record)}>
|
|
|
+ <a>删除</a>
|
|
|
+ </Popconfirm>
|
|
|
+ <Divider type="vertical"/>
|
|
|
+ <Popconfirm
|
|
|
+ title="确定解绑"
|
|
|
+ onConfirm={() => this.unBind(record)}>
|
|
|
+ <a>解绑</a>
|
|
|
+ </Popconfirm>
|
|
|
+ </span>)
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ getRefresh: refresh => {
|
|
|
+ this.refresh = refresh
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 点击编辑按钮时的事件处理函数
|
|
|
+ editItem (record) {
|
|
|
+ // const fields = JSON.parse(record.fieldsJson)
|
|
|
+ // console.log('=====', fields)
|
|
|
+ const { fields } = record
|
|
|
+ const fieldsJson = Object.keys(fields).map(f => ({
|
|
|
+ key: f,
|
|
|
+ desc: fields[f].desc,
|
|
|
+ column: fields[f].column
|
|
|
+ }))
|
|
|
+ console.log(fieldsJson)
|
|
|
+ this.setState({
|
|
|
+ showModal: true,
|
|
|
+ params: {
|
|
|
+ ...record,
|
|
|
+ fieldsJson
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ // 点击删除按钮时的事件处理函数
|
|
|
+ delItem = (record) => {
|
|
|
+ delItem({ id: record.id, name: record.name }).then(res => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ message.success('删除成功')
|
|
|
+ this.refresh()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ // 点击解绑按钮时的事件处理函数
|
|
|
+ unBind = (record) => {
|
|
|
+ unBind({ bizName: this.state.bizName, name: record.name }).then(res => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ message.success('解绑成功')
|
|
|
+ router.push('/fengkong/strategies/bizBind?binds=' + encodeURIComponent(res.data.bind) + '&name=' + encodeURIComponent(this.state.bizName))
|
|
|
+ this.refresh()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ render () {
|
|
|
+ const encodeName = parseQueryString(window.location.href).name
|
|
|
+ const name = decodeURIComponent(encodeName)
|
|
|
+ this.setState({ bizName: name })
|
|
|
+ return (
|
|
|
+ <div>
|
|
|
+ <p style={{ margin: '5px 10px' }}>{name}:</p>
|
|
|
+ <FilterTable filterSetting={this.filterSetting} tableSetting={this.tableSetting} apiUrl={apiUrl}
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ )
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+export default GroupList
|