|
@@ -1,9 +1,188 @@
|
|
|
-import React from 'react'
|
|
|
|
|
|
|
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
|
|
import styles from './index.module.scss'
|
|
import styles from './index.module.scss'
|
|
|
|
|
+import { A7FromDataType } from './data'
|
|
|
|
|
+import { useDispatch, useSelector } from 'react-redux'
|
|
|
|
|
+import { A7_APIdel, A7_APIgetList, A7_APIgetList2 } from '@/store/action/A7notice'
|
|
|
|
|
+import { RootState } from '@/store'
|
|
|
|
|
+import { MessageFu } from '@/utils/message'
|
|
|
|
|
+import { A7tableType } from '@/types'
|
|
|
|
|
+import { Button, Input, Select } from 'antd'
|
|
|
|
|
+import MyPopconfirm from '@/components/MyPopconfirm'
|
|
|
|
|
+import { A1EditInfoType } from '../A1manage/data'
|
|
|
|
|
+import MyTable from '@/components/MyTable'
|
|
|
|
|
+import { A7tableC } from '@/utils/tableData'
|
|
|
|
|
+import A7type from './A7type'
|
|
|
|
|
+import A7add from './A7add'
|
|
|
|
|
+
|
|
|
|
|
+const fromDataBase: A7FromDataType = {
|
|
|
|
|
+ dictId: null,
|
|
|
|
|
+ searchKey: '',
|
|
|
|
|
+ pageNum: 1,
|
|
|
|
|
+ pageSize: 10
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
function A7notice() {
|
|
function A7notice() {
|
|
|
|
|
+ const dispatch = useDispatch()
|
|
|
|
|
+
|
|
|
|
|
+ useEffect(() => {
|
|
|
|
|
+ dispatch(A7_APIgetList2())
|
|
|
|
|
+ }, [dispatch])
|
|
|
|
|
+
|
|
|
|
|
+ const [fromData, setFromData] = useState(fromDataBase)
|
|
|
|
|
+
|
|
|
|
|
+ const getListFu = useCallback(() => {
|
|
|
|
|
+ dispatch(A7_APIgetList(fromData))
|
|
|
|
|
+ }, [dispatch, fromData])
|
|
|
|
|
+
|
|
|
|
|
+ useEffect(() => {
|
|
|
|
|
+ getListFu()
|
|
|
|
|
+ }, [getListFu])
|
|
|
|
|
+
|
|
|
|
|
+ const [inputKey, setInputKey] = useState(1)
|
|
|
|
|
+
|
|
|
|
|
+ // 输入框的输入
|
|
|
|
|
+ const timeRef = useRef(-1)
|
|
|
|
|
+ const txtChangeFu = useCallback(
|
|
|
|
|
+ (e: React.ChangeEvent<HTMLInputElement>, key: 'searchKey') => {
|
|
|
|
|
+ clearTimeout(timeRef.current)
|
|
|
|
|
+ timeRef.current = window.setTimeout(() => {
|
|
|
|
|
+ setFromData({ ...fromData, [key]: e.target.value.replaceAll("'", ''), pageNum: 1 })
|
|
|
|
|
+ }, 500)
|
|
|
|
|
+ },
|
|
|
|
|
+ [fromData]
|
|
|
|
|
+ )
|
|
|
|
|
+
|
|
|
|
|
+ // 点击重置
|
|
|
|
|
+ const resetSelectFu = useCallback(() => {
|
|
|
|
|
+ setInputKey(Date.now())
|
|
|
|
|
+ setFromData({ ...fromDataBase })
|
|
|
|
|
+ }, [])
|
|
|
|
|
+
|
|
|
|
|
+ const { tableInfo, typeList } = useSelector((state: RootState) => state.A7notice)
|
|
|
|
|
+
|
|
|
|
|
+ const delTableFu = useCallback(
|
|
|
|
|
+ async (id: number) => {
|
|
|
|
|
+ const res = await A7_APIdel(id)
|
|
|
|
|
+ if (res.code === 0) {
|
|
|
|
|
+ MessageFu.success('删除成功!')
|
|
|
|
|
+ getListFu()
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ [getListFu]
|
|
|
|
|
+ )
|
|
|
|
|
+
|
|
|
|
|
+ const tableLastBtn = useMemo(() => {
|
|
|
|
|
+ return [
|
|
|
|
|
+ {
|
|
|
|
|
+ title: '操作',
|
|
|
|
|
+ render: (item: A7tableType) => (
|
|
|
|
|
+ <>
|
|
|
|
|
+ <Button
|
|
|
|
|
+ size='small'
|
|
|
|
|
+ type='text'
|
|
|
|
|
+ onClick={() => setEditInfo({ id: item.id, txt: '查看' })}
|
|
|
|
|
+ >
|
|
|
|
|
+ 查看
|
|
|
|
|
+ </Button>
|
|
|
|
|
+ <Button
|
|
|
|
|
+ size='small'
|
|
|
|
|
+ type='text'
|
|
|
|
|
+ onClick={() => setEditInfo({ id: item.id, txt: '编辑' })}
|
|
|
|
|
+ >
|
|
|
|
|
+ 编辑
|
|
|
|
|
+ </Button>
|
|
|
|
|
+ <MyPopconfirm txtK='删除' onConfirm={() => delTableFu(item.id)} />
|
|
|
|
|
+ </>
|
|
|
|
|
+ )
|
|
|
|
|
+ }
|
|
|
|
|
+ ]
|
|
|
|
|
+ }, [delTableFu])
|
|
|
|
|
+
|
|
|
|
|
+ //查看、新增、编辑
|
|
|
|
|
+ const [editInfo, setEditInfo] = useState<A1EditInfoType>({
|
|
|
|
|
+ id: 0,
|
|
|
|
|
+ txt: ''
|
|
|
|
|
+ })
|
|
|
|
|
+
|
|
|
|
|
+ // 公告类型显示隐藏
|
|
|
|
|
+ const [typeShow, setTypeShow] = useState(false)
|
|
|
|
|
+
|
|
|
return (
|
|
return (
|
|
|
<div className={styles.A7notice}>
|
|
<div className={styles.A7notice}>
|
|
|
- <h1>A7notice</h1>
|
|
|
|
|
|
|
+ <div className='pageTitle'>公告管理 {editInfo.id ? ` - ${editInfo.txt}` : ''}</div>
|
|
|
|
|
+
|
|
|
|
|
+ {/* 顶部筛选 */}
|
|
|
|
|
+ <div className='A7top'>
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <div className='A7TopRow'>
|
|
|
|
|
+ <span>搜索:</span>
|
|
|
|
|
+ <Input
|
|
|
|
|
+ key={inputKey}
|
|
|
|
|
+ maxLength={20}
|
|
|
|
|
+ style={{ width: 200 }}
|
|
|
|
|
+ placeholder='请输入公告标题'
|
|
|
|
|
+ allowClear
|
|
|
|
|
+ onChange={e => txtChangeFu(e, 'searchKey')}
|
|
|
|
|
+ />
|
|
|
|
|
+ </div>
|
|
|
|
|
+
|
|
|
|
|
+ <div className='A7TopRow'>
|
|
|
|
|
+ <span>展示分类:</span>
|
|
|
|
|
+ <Select
|
|
|
|
|
+ allowClear
|
|
|
|
|
+ placeholder='全部'
|
|
|
|
|
+ style={{ width: 200 }}
|
|
|
|
|
+ value={fromData.dictId}
|
|
|
|
|
+ fieldNames={{ label: 'name', value: 'id' }}
|
|
|
|
|
+ onChange={e => setFromData({ ...fromData, pageNum: 1, dictId: e })}
|
|
|
|
|
+ options={typeList}
|
|
|
|
|
+ />
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <Button onClick={resetSelectFu}>重置</Button> 
|
|
|
|
|
+ <Button type='primary' onClick={() => setTypeShow(true)}>
|
|
|
|
|
+ 公告类型
|
|
|
|
|
+ </Button>
|
|
|
|
|
+  
|
|
|
|
|
+ <Button type='primary' onClick={() => setEditInfo({ id: -1, txt: '新增' })}>
|
|
|
|
|
+ 新增
|
|
|
|
|
+ </Button>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+
|
|
|
|
|
+ {/* 表格主体 */}
|
|
|
|
|
+ <div className='A7tableBox'>
|
|
|
|
|
+ <MyTable
|
|
|
|
|
+ yHeight={625}
|
|
|
|
|
+ list={tableInfo.list}
|
|
|
|
|
+ columnsTemp={A7tableC}
|
|
|
|
|
+ lastBtn={tableLastBtn}
|
|
|
|
|
+ pageNum={fromData.pageNum}
|
|
|
|
|
+ pageSize={fromData.pageSize}
|
|
|
|
|
+ total={tableInfo.total}
|
|
|
|
|
+ onChange={(pageNum, pageSize) => setFromData({ ...fromData, pageNum, pageSize })}
|
|
|
|
|
+ />
|
|
|
|
|
+ </div>
|
|
|
|
|
+
|
|
|
|
|
+ {/* 公告类型 */}
|
|
|
|
|
+ {typeShow ? (
|
|
|
|
|
+ <div className='A7type'>
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <A7type closeFu={() => setTypeShow(false)} />
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ ) : null}
|
|
|
|
|
+
|
|
|
|
|
+ {/* 新增/编辑 */}
|
|
|
|
|
+ {editInfo.id ? (
|
|
|
|
|
+ <A7add
|
|
|
|
|
+ editInfo={editInfo}
|
|
|
|
|
+ closeFu={() => setEditInfo({ id: 0, txt: '新增' })}
|
|
|
|
|
+ addTableFu={resetSelectFu}
|
|
|
|
|
+ editTableFu={getListFu}
|
|
|
|
|
+ />
|
|
|
|
|
+ ) : null}
|
|
|
</div>
|
|
</div>
|
|
|
)
|
|
)
|
|
|
}
|
|
}
|