增加数据维护模块

后台管理/src/pages/A7numData/data.ts

@@ -0,0 +1,5 @@
+export type A7ListType = {
+  id: number
+  name: string
+  pcs: number
+}

后台管理/src/pages/A7numData/index.module.scss

@@ -0,0 +1,24 @@
+.A7numData {
+  background-color: #fff;
+  border-radius: 10px;
+  padding: 24px;
+  position: relative;
+  :global {
+    .A7row {
+      display: flex;
+      align-items: center;
+      margin-bottom: 24px;
+      .A7row1 {
+        width: 100px;
+        text-align: right;
+        font-weight: 700;
+        font-size: 18px;
+      }
+    }
+    .A7btn {
+      position: absolute;
+      top: 23px;
+      left: 400px;
+    }
+  }
+}

后台管理/src/pages/A7numData/index.tsx

@@ -0,0 +1,106 @@
+import React, { useCallback, useEffect, useState } from 'react'
+import styles from './index.module.scss'
+import { useDispatch, useSelector } from 'react-redux'
+import { A7_APIgetList, A7_APIsave } from '@/store/action/A7numData'
+import { RootState } from '@/store'
+import { Button, InputNumber } from 'antd'
+import { A7ListType } from './data'
+import { MessageFu } from '@/utils/message'
+function A7numData() {
+  const dispatch = useDispatch()
+
+  useEffect(() => {
+    dispatch(A7_APIgetList())
+  }, [dispatch])
+
+  const list = useSelector((state: RootState) => state.A7numData.list)
+
+  const [listTemp, setListTemp] = useState<A7ListType[]>([])
+
+  useEffect(() => {
+    setListTemp(list)
+  }, [list])
+
+  const changeFu = useCallback(
+    (id: number, val: number) => {
+      setListTemp(
+        listTemp.map(v => ({
+          ...v,
+          pcs: v.id === id ? val : v.pcs
+        }))
+      )
+    },
+    [listTemp]
+  )
+
+  // 是否编辑
+  const [isEdit, setIsEdit] = useState(false)
+
+  // 点击提交
+  const btnOk = useCallback(async () => {
+    let flag = false
+    listTemp.forEach(v => {
+      if (!v.pcs) flag = true
+    })
+    if (flag) return MessageFu.warning('请输入>0的正整数')
+
+    const res = await A7_APIsave({
+      id: 10,
+      rtf: JSON.stringify(listTemp)
+    })
+    if (res.code === 0) {
+      MessageFu.success('编辑成功')
+      setIsEdit(false)
+      dispatch(A7_APIgetList())
+    }
+  }, [dispatch, listTemp])
+
+  return (
+    <div className={styles.A7numData}>
+      <div className='pageTitle'>数据维护</div>
+
+      {listTemp.map(item => (
+        <div className='A7row' key={item.id}>
+          <div className='A7row1'>{item.name}：</div>
+          <div className='A7row2'>
+            <InputNumber
+              style={{ width: 200 }}
+              disabled={!isEdit}
+              value={item.pcs}
+              onChange={e => changeFu(item.id, e as number)}
+              max={99999}
+              min={1}
+            />
+          </div>
+        </div>
+      ))}
+
+      <div className='A7btn' style={{ top: isEdit ? 250 : 23 }}>
+        {isEdit ? (
+          <>
+            <Button
+              onClick={() => {
+                setIsEdit(false)
+                setListTemp(list)
+              }}
+            >
+              取消
+            </Button>
+            &emsp;
+            <Button type='primary' onClick={btnOk}>
+              提交
+            </Button>
+          </>
+        ) : (
+          <Button type='primary' onClick={() => setIsEdit(true)}>
+            编辑
+          </Button>
+        )}
+      </div>
+    </div>
+  )
+}
+
+const MemoA7numData = React.memo(A7numData)
+
+export default MemoA7numData

后台管理/src/pages/Layout/data.ts

@@ -41,6 +41,12 @@ const tabLeftArr: RouterType = [
         name: '数据统计',
         path: '/statistics',
         Com: React.lazy(() => import('../A6statistics'))
+      },
+      {
+        id: 800,
+        name: '数据维护',
+        path: '/numData',
+        Com: React.lazy(() => import('../A7numData'))
       }
     ]
   },

后台管理/src/store/action/A7numData.ts

@@ -0,0 +1,54 @@
+import http from '@/utils/http'
+import { AppDispatch } from '..'
+
+const baseJson = [
+  {
+    id: 1,
+    name: '安葬烈士',
+    pcs: 1
+  },
+  {
+    id: 2,
+    name: '有名烈士',
+    pcs: 1
+  },
+  {
+    id: 3,
+    name: '无名烈士',
+    pcs: 1
+  },
+  {
+    id: 4,
+    name: '寻亲中',
+    pcs: 1
+  },
+  {
+    id: 5,
+    name: '已找到',
+    pcs: 1
+  }
+]
+
+/**
+ * 数据维护-获取列表
+ */
+export const A7_APIgetList = (id = 10): any => {
+  return async (dispatch: AppDispatch) => {
+    const res = await http.get(`cms/maintain/detail/${id}`)
+    if (res.code === 0) {
+      let arr: any = [...baseJson]
+
+      if (res.data.rtf) {
+        arr = JSON.parse(res.data.rtf)
+      }
+      dispatch({ type: 'A7/getList', payload: arr })
+    }
+  }
+}
+
+/**
+ * 数据维护-编辑
+ */
+export const A7_APIsave = (data: any) => {
+  return http.post('cms/maintain/edit', data)
+}

后台管理/src/store/reducer/A7numData.ts

@@ -0,0 +1,25 @@
+import { A7ListType } from '@/pages/A7numData/data'
+
+// 初始化状态
+const initState = {
+  // 列表数据
+  list: [] as A7ListType[]
+}
+
+// 定义 action 类型
+type Props = {
+  type: 'A7/getList'
+  payload: A7ListType[]
+}
+
+// reducer
+export default function userReducer(state = initState, action: Props) {
+  switch (action.type) {
+    // 获取列表数据
+    case 'A7/getList':
+      return { ...state, list: action.payload }
+
+    default:
+      return state
+  }
+}

后台管理/src/store/reducer/index.ts

@@ -9,6 +9,7 @@ import A3clan from './A3clan'
 import A4antique from './A4antique'
 import A5introduce from './A5introduce'
 import A6statistics from './A6statistics'
+import A7numData from './A7numData'
 
 import Z1user from './Z1user'
 import Z2log from './Z2log'
@@ -22,6 +23,7 @@ const rootReducer = combineReducers({
   A4antique,
   A5introduce,
   A6statistics,
+  A7numData,
   Z1user,
   Z2log
 })

后台管理/src/utils/http.ts

@@ -7,8 +7,8 @@ import { domShowFu } from './domShow'
 
 const envFlag = process.env.NODE_ENV === 'development'
 
-const baseUrlTemp = 'https://sit-jinanlsly.4dage.com' // 测试环境
-// const baseUrlTemp = 'http://192.168.20.61:8104' // 线下环境
+// const baseUrlTemp = 'https://sit-jinanlsly.4dage.com' // 测试环境
+const baseUrlTemp = 'http://192.168.20.61:8104' // 线下环境
 
 const baseFlag = baseUrlTemp.includes('https://')