|
|
@@ -1,14 +1,16 @@
|
|
|
-import {Modal, Input, Select, message, Table, Button} from 'antd';
|
|
|
-import axios from '@/utils/axios.js'
|
|
|
+import {Button, InputNumber, message, Modal, Select, Table} from 'antd';
|
|
|
import {useEffect, useState} from 'react'
|
|
|
import './modal.scss'
|
|
|
import {getChild} from '@/utils/getDict.js'
|
|
|
import {useSelector} from "react-redux";
|
|
|
-export default function ModalHooks({isModalOpen, closeModal, row,submitValue}) {
|
|
|
+import {snowflakeGenerator} from "snowflake-id-js";
|
|
|
+
|
|
|
+export default function ModalHooks({isModalOpen, closeModal, row, submitValue}) {
|
|
|
const [messageApi, contextHolder] = message.useMessage();
|
|
|
const [tableData, setTableData] = useState([])
|
|
|
let dict = useSelector((state) => state.counter.dictData);
|
|
|
- const options = getChild(dict,'flowRanking')
|
|
|
+ const options = getChild(dict, 'flowRanking')
|
|
|
+
|
|
|
// const options = []
|
|
|
/**
|
|
|
*确定时候的回调
|
|
|
@@ -16,7 +18,7 @@ export default function ModalHooks({isModalOpen, closeModal, row,submitValue}) {
|
|
|
function handleOk() {
|
|
|
// 验证表单
|
|
|
for (const item of tableData) {
|
|
|
- if(!item.name|| !item.value){
|
|
|
+ if (!item.name || !item.value) {
|
|
|
messageApi.error('未填写完整,无法提交')
|
|
|
return
|
|
|
}
|
|
|
@@ -33,12 +35,13 @@ export default function ModalHooks({isModalOpen, closeModal, row,submitValue}) {
|
|
|
* @param index 下标
|
|
|
* @param dataName 名称
|
|
|
*/
|
|
|
- function setValue(value,index,dataName){
|
|
|
+ function setValue(value, index, dataName) {
|
|
|
let newData = JSON.parse(JSON.stringify(tableData))
|
|
|
- newData[index][dataName]=value
|
|
|
+ newData[index][dataName] = value
|
|
|
setTableData(newData)
|
|
|
|
|
|
}
|
|
|
+
|
|
|
// 关闭页面
|
|
|
const handleCancel = () => {
|
|
|
closeModal(false);
|
|
|
@@ -50,26 +53,27 @@ export default function ModalHooks({isModalOpen, closeModal, row,submitValue}) {
|
|
|
render: (text, record, index) => (
|
|
|
<Select
|
|
|
value={text}
|
|
|
- onChange={(val)=>setValue(val,index,'name')}
|
|
|
+ onChange={(val) => setValue(val, index, 'name')}
|
|
|
options={options}
|
|
|
- style={{width:'120px'}}
|
|
|
+ style={{width: '120px'}}
|
|
|
fieldNames={{
|
|
|
- label:'name',
|
|
|
- value:'name'
|
|
|
+ label: 'name',
|
|
|
+ value: 'name'
|
|
|
}}
|
|
|
/>
|
|
|
)
|
|
|
}, {
|
|
|
title: '占比次数',
|
|
|
dataIndex: 'value',
|
|
|
- render: (text, record,index) => <Input value={text} onChange={(e)=>setValue(e.target.value,index,'value')}></Input>,
|
|
|
+ render: (text, record, index) => <InputNumber value={text} style={{width: '100%'}} min={0}
|
|
|
+ onChange={(e) => setValue(e, index, 'value')}></InputNumber>,
|
|
|
},
|
|
|
- {
|
|
|
- title: '操作',
|
|
|
- render: (text, record, index) => (
|
|
|
- <Button danger onClick={() => removeRowList(index)}>删除</Button>
|
|
|
- )
|
|
|
- }
|
|
|
+ {
|
|
|
+ title: '操作',
|
|
|
+ render: (text, record, index) => (
|
|
|
+ <Button danger onClick={() => removeRowList(index)}>删除</Button>
|
|
|
+ )
|
|
|
+ }
|
|
|
]
|
|
|
|
|
|
/**
|
|
|
@@ -81,17 +85,25 @@ export default function ModalHooks({isModalOpen, closeModal, row,submitValue}) {
|
|
|
newData.splice(index, 1)
|
|
|
setTableData(newData)
|
|
|
}
|
|
|
- function add(){
|
|
|
+
|
|
|
+ function add() {
|
|
|
let newData = JSON.parse(JSON.stringify(tableData))
|
|
|
+ const generator = snowflakeGenerator(512);
|
|
|
newData.push({
|
|
|
- name:null,
|
|
|
- value:''
|
|
|
+ name: null,
|
|
|
+ value: '',
|
|
|
+ id: generator.next().value
|
|
|
})
|
|
|
setTableData(newData)
|
|
|
}
|
|
|
+
|
|
|
// 表单请求
|
|
|
useEffect(() => {
|
|
|
let newData = JSON.parse(JSON.stringify(row))
|
|
|
+ const generator = snowflakeGenerator(512);
|
|
|
+ newData.forEach((item, index) => {
|
|
|
+ item.id = generator.next().value
|
|
|
+ })
|
|
|
setTableData(newData)
|
|
|
|
|
|
|
|
|
@@ -109,8 +121,9 @@ export default function ModalHooks({isModalOpen, closeModal, row,submitValue}) {
|
|
|
dataSource={tableData}
|
|
|
pagination={false}
|
|
|
bordered={true}
|
|
|
- rowKey="name"
|
|
|
+ rowKey="id"
|
|
|
columns={columns}
|
|
|
+ scroll={{y: 400}}
|
|
|
>
|
|
|
|
|
|
</Table>
|