Merge branch 'master' of http://192.168.0.115:3000/shaogen1995/qingDao_goods

src/components/MyTable/index.tsx

@@ -148,7 +148,9 @@ function MyTable({
           }
 
           return tempCom
-        }
+        },
+
+        custom: (item: any) => v[2]?.(item) || isNull
       }
 
       return Reflect.get(obj, v[0])

src/pages/Isystem/I1storageSet/components/AddPositionModal/index.tsx

@@ -0,0 +1,218 @@
+import React, { useEffect, useState } from 'react'
+import { Modal, Form, Button, Select, Flex, InputNumber, message } from 'antd'
+import { I1_APIPositionSave } from '@/store/action/Isystem/I1storageSet'
+import MyPopconfirm from '@/components/MyPopconfirm'
+import { useDispatch, useSelector } from 'react-redux'
+import { RootState } from '@/store'
+
+interface AddPositionModalProps {
+  visible: boolean
+  positionOptions: any[]
+  onCancel: () => void
+  onSuccess: () => void
+}
+
+const AddPositionModal: React.FC<AddPositionModalProps> = ({
+  visible,
+  positionOptions,
+  onCancel,
+  onSuccess
+}) => {
+  const dispatch = useDispatch()
+  const [loading, setLoading] = useState(false)
+  const [form] = Form.useForm()
+  const userInfo = useSelector((state: RootState) => state.I7user.tableInfo)
+
+  const expandRange = (from: number, to: number) => {
+    const arr = []
+    for (let i = from; i <= to; i++) arr.push(i)
+    return arr
+  }
+
+  const handleOk = async () => {
+    try {
+      const values = await form.validateFields()
+
+      const layers = ['layer1', 'layer2', 'layer3', 'layer4']
+      for (const layer of layers) {
+        if (values[layer]) {
+          const [from, to] = values[layer]
+          if (from > to) {
+            message.error(
+              `${form.getFieldInstance(layer)?.props?.label || layer}的起始值不能大于结束值`
+            )
+            return
+          }
+        }
+      }
+
+      const layer1Arr = expandRange(values.layer1[0], values.layer1[1])
+      const layer2Arr = expandRange(values.layer2[0], values.layer2[1])
+      const layer3Arr =
+        values.layer3 && values.layer3[0] !== undefined && values.layer3[1] !== undefined
+          ? expandRange(values.layer3[0], values.layer3[1])
+          : [null]
+      const layer4Arr =
+        values.layer4 && values.layer4[0] !== undefined && values.layer4[1] !== undefined
+          ? expandRange(values.layer4[0], values.layer4[1])
+          : [null]
+      const matrix = []
+      for (const l1 of layer1Arr) {
+        for (const l2 of layer2Arr) {
+          for (const l3 of layer3Arr) {
+            for (const l4 of layer4Arr) {
+              matrix.push({
+                storageId: values.storageId,
+                layer1: l1,
+                layer2: l2,
+                layer3: l3,
+                layer4: l4
+              })
+            }
+          }
+        }
+      }
+      setLoading(true)
+      const res = await I1_APIPositionSave(matrix)
+      setLoading(false)
+      if (res.code === 0) {
+        onSuccess()
+        form.resetFields()
+      }
+    } catch (err) {
+      setLoading(false)
+    }
+  }
+
+  useEffect(() => {
+    if (!visible) return
+
+    form.resetFields()
+  }, [dispatch, userInfo.list.length, visible, form])
+
+  return (
+    <Modal
+      title='新增'
+      open={visible}
+      onCancel={() => {
+        form.resetFields()
+        onCancel()
+      }}
+      footer={null}
+      destroyOnClose
+    >
+      <Form form={form} labelCol={{ span: 5 }}>
+        <Form.Item
+          label='库房名称'
+          name='storageId'
+          rules={[{ required: true, message: '请选择库房' }]}
+        >
+          <Select
+            showSearch
+            filterOption={(input, option) =>
+              (option?.label ?? '').toLowerCase().includes(input.toLowerCase())
+            }
+            placeholder='请选择'
+            options={positionOptions}
+          />
+        </Form.Item>
+
+        <Form.Item label='排' required>
+          <div>
+            <Flex align='center' gap='10px'>
+              从
+              <Form.Item
+                name={['layer1', 0]}
+                noStyle
+                rules={[{ required: true, message: '请输入起始值' }]}
+              >
+                <InputNumber min={0} max={9} style={{ width: 60 }} />
+              </Form.Item>
+              到
+              <Form.Item
+                name={['layer1', 1]}
+                noStyle
+                rules={[{ required: true, message: '请输入结束值' }]}
+              >
+                <InputNumber min={0} max={9} style={{ width: 60 }} />
+              </Form.Item>
+            </Flex>
+            <span style={{ color: '#999', fontSize: 12 }}>单字母或3位内正整数</span>
+          </div>
+        </Form.Item>
+
+        <Form.Item label='列' required>
+          <div>
+            <Flex align='center' gap='10px'>
+              从
+              <Form.Item
+                name={['layer2', 0]}
+                noStyle
+                rules={[{ required: true, message: '请输入起始值' }]}
+              >
+                <InputNumber min={0} max={9} style={{ width: 60 }} />
+              </Form.Item>
+              到
+              <Form.Item
+                name={['layer2', 1]}
+                noStyle
+                rules={[{ required: true, message: '请输入结束值' }]}
+              >
+                <InputNumber min={0} max={9} style={{ width: 60 }} />
+              </Form.Item>
+            </Flex>
+            <span style={{ color: '#999', fontSize: 12 }}>单字母或3位内正整数</span>
+          </div>
+        </Form.Item>
+
+        <Form.Item label='层'>
+          <div>
+            <Flex align='center' gap='10px'>
+              从
+              <Form.Item name={['layer3', 0]} noStyle>
+                <InputNumber min={0} max={9} style={{ width: 60 }} />
+              </Form.Item>
+              到
+              <Form.Item name={['layer3', 1]} noStyle>
+                <InputNumber min={0} max={9} style={{ width: 60 }} />
+              </Form.Item>
+            </Flex>
+            <span style={{ color: '#999', fontSize: 12 }}>单字母或3位内正整数</span>
+          </div>
+        </Form.Item>
+
+        <Form.Item label='格'>
+          <div>
+            <Flex align='center' gap='10px'>
+              从
+              <Form.Item name={['layer4', 0]} noStyle>
+                <InputNumber min={0} max={9} style={{ width: 60 }} />
+              </Form.Item>
+              到
+              <Form.Item name={['layer4', 1]} noStyle>
+                <InputNumber min={0} max={9} style={{ width: 60 }} />
+              </Form.Item>
+            </Flex>
+            <span style={{ color: '#999', fontSize: 12 }}>单字母或3位内正整数</span>
+          </div>
+        </Form.Item>
+
+        <Form.Item wrapperCol={{ offset: 9, span: 16 }}>
+          <Button type='primary' loading={loading} onClick={handleOk} style={{ marginRight: 8 }}>
+            提交
+          </Button>
+
+          <MyPopconfirm
+            txtK='取消'
+            onConfirm={() => {
+              form.resetFields()
+              onCancel()
+            }}
+          />
+        </Form.Item>
+      </Form>
+    </Modal>
+  )
+}
+
+export default AddPositionModal

src/pages/Isystem/I1storageSet/components/AddWarehouseModal/index.tsx

@@ -0,0 +1,113 @@
+import React, { useEffect, useState } from 'react'
+import { Modal, Form, Input, Button, Select } from 'antd'
+import { I1_APIwarehouseSave } from '@/store/action/Isystem/I1storageSet'
+import MyPopconfirm from '@/components/MyPopconfirm'
+import { useDispatch, useSelector } from 'react-redux'
+import { RootState } from '@/store'
+import { getUserListAPI } from '@/store/action/Isystem/I7user'
+
+interface AddWarehouseModalProps {
+  visible: boolean
+  onCancel: () => void
+  onSuccess: () => void
+  editData?: any
+}
+
+const AddWarehouseModal: React.FC<AddWarehouseModalProps> = ({
+  visible,
+  onCancel,
+  onSuccess,
+  editData
+}) => {
+  const dispatch = useDispatch()
+  const [loading, setLoading] = useState(false)
+  const [form] = Form.useForm()
+  const userInfo = useSelector((state: RootState) => state.I7user.tableInfo)
+
+  const handleOk = async () => {
+    try {
+      const values = await form.validateFields()
+      setLoading(true)
+      const payload = editData ? { ...values, id: editData.id } : values
+      const res = await I1_APIwarehouseSave(payload)
+      setLoading(false)
+      if (res.code === 0) {
+        onSuccess()
+        form.resetFields()
+      }
+    } catch (err) {
+      setLoading(false)
+    }
+  }
+
+  useEffect(() => {
+    if (!visible) return
+
+    dispatch(
+      getUserListAPI({
+        pageNum: 1,
+        pageSize: 9999
+      })
+    )
+    if (editData) {
+      form.setFieldsValue({
+        name: editData.name,
+        managerUserId: editData.managerUserId,
+        description: editData.description
+      })
+    } else {
+      form.resetFields()
+    }
+  }, [dispatch, userInfo.list.length, visible, editData, form])
+
+  return (
+    <Modal
+      title={editData ? '编辑' : '新增'}
+      open={visible}
+      onCancel={() => {
+        form.resetFields()
+        onCancel()
+      }}
+      footer={null}
+      destroyOnClose
+    >
+      <Form form={form} labelCol={{ span: 5 }}>
+        <Form.Item
+          label='库房名称'
+          name='name'
+          rules={[{ required: true, message: '请输入库房名称' }]}
+        >
+          <Input placeholder='请输入库房名称' />
+        </Form.Item>
+        <Form.Item label='库房负责人' name='managerUserId'>
+          <Select
+            placeholder='请选择用户'
+            options={userInfo.list.map((i: any) => ({ label: i.realName, value: i.id }))}
+          />
+        </Form.Item>
+        <Form.Item
+          label='库房说明'
+          name='description'
+          rules={[{ max: 500, message: '库房说明不能超过500字' }]}
+        >
+          <Input.TextArea placeholder='请输入库房说明（不超过500字）' maxLength={500} rows={4} />
+        </Form.Item>
+        <Form.Item wrapperCol={{ offset: 9, span: 16 }}>
+          <Button type='primary' loading={loading} onClick={handleOk} style={{ marginRight: 8 }}>
+            提交
+          </Button>
+
+          <MyPopconfirm
+            txtK='取消'
+            onConfirm={() => {
+              form.resetFields()
+              onCancel()
+            }}
+          />
+        </Form.Item>
+      </Form>
+    </Modal>
+  )
+}
+
+export default AddWarehouseModal

src/pages/Isystem/I1storageSet/index.module.scss

@@ -1,4 +1,7 @@
 .I1storageSet {
   :global {
+    .storage-tabs {
+      padding: 0 24px;
+    }
   }
 }

src/pages/Isystem/I1storageSet/index.tsx

@@ -1,9 +1,244 @@
-import React from 'react'
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import styles from './index.module.scss'
+import { Button, Tabs } from 'antd'
+import AddWarehouseModal from '@/pages/Isystem/I1storageSet/components/AddWarehouseModal'
+import TableList from '@/pages/Zother/TableList'
+import { useSelector } from 'react-redux'
+import { RootState } from '@/store'
+import {
+  I1_APIdel,
+  I1_APIgetList,
+  I1_APIwarehouseDel,
+  I1_APIwarehouseList,
+  I1_APIwarehouseSimpleList
+} from '@/store/action/Isystem/I1storageSet'
+import { baseFormData } from '@/pages/Zother/data'
+import { MessageFu } from '@/utils/message'
+import MyPopconfirm from '@/components/MyPopconfirm'
+import { storageSetTableC, warehouseSetTableC } from '@/utils/tableData'
+import AddPositionModal from './components/AddPositionModal'
+
+const I1baseFormData = baseFormData()
+const wareBaseFormData = baseFormData()
+
 function I1storageSet() {
+  const [allWarehouseList, setAllWarehouseList] = useState<any[]>([])
+  const [warehouseModalVisible, setWarehouseModalVisible] = useState(false)
+  const [warehouseEditData, setWarehouseEditData] = useState<any>(null)
+  const [positionModalVisible, setPositionModalVisible] = useState(false)
+  const [activeTab, setActiveTab] = useState('position')
+  // 从仓库拿数据
+  const tableInfo = useSelector((state: RootState) => state.I1storageSet.tableInfo)
+  const warehouseTableInfo = useSelector(
+    (state: RootState) => state.I1storageSet.warehouseTableInfo
+  )
+  const warehouseOptions = useMemo(() => {
+    return allWarehouseList.map((i: any) => ({
+      label: i.name,
+      value: i.id
+    }))
+  }, [allWarehouseList])
+
+  const tableListRef = useRef<any>(null)
+  const warehouseTableListRef = useRef<any>(null)
+
+  const getListFu = useCallback(() => {
+    tableListRef.current?.getListFu?.()
+  }, [])
+
+  const getWarehouseListFu = useCallback(() => {
+    warehouseTableListRef.current?.getListFu?.()
+  }, [])
+
+  const getAllWarehouseListFu = useCallback(async () => {
+    const res = await I1_APIwarehouseSimpleList({
+      pageNum: 1,
+      pageSize: 9999
+    })
+    setAllWarehouseList(res.data.records)
+  }, [])
+
+  useEffect(() => {
+    getAllWarehouseListFu()
+  }, [getAllWarehouseListFu])
+
+  const delFu = useCallback(
+    async (id: string) => {
+      const res = await I1_APIdel(id)
+      if (res.code === 0) {
+        MessageFu.success('删除成功')
+        getListFu()
+      }
+    },
+    [getListFu]
+  )
+
+  const delWarehouseFu = useCallback(
+    async (id: string) => {
+      const res = await I1_APIwarehouseDel(id)
+      if (res.code === 0) {
+        MessageFu.success('删除成功')
+        getWarehouseListFu()
+      }
+    },
+    [getWarehouseListFu]
+  )
+
+  const storyTableLastBtn = useMemo(() => {
+    return [
+      {
+        title: '操作',
+        render: (item: any) => (
+          <>
+            <MyPopconfirm txtK='删除' onConfirm={() => delFu(item.id)} />
+          </>
+        )
+      }
+    ]
+  }, [delFu])
+
+  const warehouseTableLastBtn = useMemo(() => {
+    return [
+      {
+        title: '操作',
+        render: (item: any) => (
+          <>
+            <Button
+              type='text'
+              size='small'
+              onClick={() => {
+                setActiveTab('position')
+                tableListRef.current?.txtChangeFu(item.id, 'storageId')
+                setTimeout(() => {
+                  tableListRef.current?.getListFu?.()
+                }, 200)
+              }}
+            >
+              查看仓格
+            </Button>
+            <Button
+              type='text'
+              size='small'
+              onClick={() => {
+                setWarehouseEditData(item)
+                setWarehouseModalVisible(true)
+              }}
+            >
+              编辑
+            </Button>
+            {item.name !== '默认库房' && (
+              <MyPopconfirm txtK='删除' onConfirm={() => delWarehouseFu(item.id)} />
+            )}
+          </>
+        )
+      }
+    ]
+  }, [delWarehouseFu])
+
   return (
     <div className={styles.I1storageSet}>
       <div className='pageTitle'>库房设置</div>
+
+      <Tabs
+        className='storage-tabs'
+        activeKey={activeTab}
+        onChange={key => setActiveTab(key)}
+        items={[
+          {
+            key: 'position',
+            label: '仓格',
+            children: (
+              <TableList
+                ref={tableListRef}
+                baseFormData={I1baseFormData}
+                getListAPI={I1_APIgetList}
+                pageKey='position'
+                tableInfo={tableInfo}
+                columnsTemp={storageSetTableC}
+                rightBtnWidth={180}
+                yHeight={539}
+                searchDom={[
+                  {
+                    type: 'select',
+                    key: 'storageId',
+                    placeholder: `库房名称`,
+                    options: warehouseOptions
+                  },
+                  {
+                    type: 'input',
+                    key: 'searchKey',
+                    placeholder: `请输入仓位编号`
+                  }
+                ]}
+                storyTableListToprr={({ clickSearch }) => (
+                  <>
+                    <Button type='primary' onClick={clickSearch}>
+                      查询
+                    </Button>
+                    <Button type='primary' onClick={() => setPositionModalVisible(true)}>
+                      新增仓格
+                    </Button>
+                  </>
+                )}
+                storyTableLastBtn={storyTableLastBtn}
+              />
+            )
+          },
+          {
+            key: 'warehouse',
+            label: '库房',
+            children: (
+              <>
+                <TableList
+                  ref={warehouseTableListRef}
+                  baseFormData={wareBaseFormData}
+                  getListAPI={I1_APIwarehouseList}
+                  pageKey='warehouse'
+                  tableInfo={warehouseTableInfo}
+                  columnsTemp={warehouseSetTableC}
+                  yHeight={539}
+                  searchDom={[]}
+                  rightBtnWidth={88}
+                  storyTableListToprr={() => (
+                    <>
+                      <Button type='primary' onClick={() => setWarehouseModalVisible(true)}>
+                        新增库房
+                      </Button>
+                    </>
+                  )}
+                  storyTableLastBtn={warehouseTableLastBtn}
+                />
+              </>
+            )
+          }
+        ]}
+      />
+
+      <AddWarehouseModal
+        visible={warehouseModalVisible}
+        editData={warehouseEditData}
+        onCancel={() => {
+          setWarehouseModalVisible(false)
+          setWarehouseEditData(null)
+        }}
+        onSuccess={() => {
+          setWarehouseModalVisible(false)
+          setWarehouseEditData(null)
+          getWarehouseListFu()
+        }}
+      />
+
+      <AddPositionModal
+        visible={positionModalVisible}
+        positionOptions={warehouseOptions}
+        onCancel={() => {
+          setPositionModalVisible(false)
+        }}
+        onSuccess={() => {
+          setPositionModalVisible(false)
+          getListFu()
+        }}
+      />
     </div>
   )
 }

src/pages/Zother/TableList/index.tsx

@@ -1,4 +1,12 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+  forwardRef,
+  useImperativeHandle
+} from 'react'
 import styles from './index.module.scss'
 import { useDispatch } from 'react-redux'
 import history from '@/utils/history'
@@ -26,20 +34,20 @@ type Props = {
   storyTableLastBtn?: any
 }
 
-function TableList({
-  baseFormData,
-  getListAPI,
-  pageKey,
-  tableInfo,
-  columnsTemp,
-  yHeight,
-  searchDom,
-  rightBtnWidth = 250,
-  leftRowWidth = '25%',
-  // 故事管理定制操作栏
-  storyTableLastBtn,
-  storyTableListToprr
-}: Props) {
+const TableList = forwardRef<any, Props>(function TableList(props, ref) {
+  const {
+    baseFormData,
+    getListAPI,
+    pageKey,
+    tableInfo,
+    columnsTemp,
+    yHeight,
+    searchDom,
+    rightBtnWidth = 250,
+    leftRowWidth = '25%',
+    storyTableLastBtn,
+    storyTableListToprr
+  } = props
   const dispatch = useDispatch()
 
   const [formData, setFormData] = useState({ ...baseFormData })
@@ -142,6 +150,11 @@ function TableList({
     ]
   }, [tableBtnFu])
 
+  useImperativeHandle(ref, () => ({
+    getListFu,
+    txtChangeFu
+  }))
+
   return (
     <>
       <div className={styles.TableListTop}>
@@ -219,6 +232,6 @@ function TableList({
       </div>
     </>
   )
-}
+})
 
 export default TableList

src/store/action/Isystem/I1storageSet.ts

@@ -0,0 +1,73 @@
+import { AppDispatch } from '@/store'
+import http from '@/utils/http'
+
+/**
+ * 库房设置 - 仓格分页列表
+ */
+export const I1_APIgetList = (data: any): any => {
+  return async (dispatch: AppDispatch) => {
+    const res = await http.get('cms/site/getList', {
+      params: {
+        searchKey: data.searchKey,
+        storageId: data.storageId
+      }
+    })
+    if (res.code === 0) {
+      const obj = {
+        list: res.data,
+        total: res.data.length
+      }
+
+      dispatch({ type: 'I1/getList', payload: obj })
+    }
+  }
+}
+
+/**
+ * 库房设置 - 仓格删除
+ */
+export const I1_APIdel = (id: string | string[]) => {
+  const ids = Array.isArray(id) ? id : [id]
+  return http.post('/cms/site/site/removes', ids) // 直接传数组
+}
+
+/**
+ * 库房设置 - 新增仓格
+ */
+export const I1_APIPositionSave = (data: any) => {
+  return http.post('cms/site/site/batchSave', data)
+}
+
+/**
+ * 库房设置 - 库房分页列表
+ */
+export const I1_APIwarehouseSimpleList = (data: any): any => {
+  return http.post('cms/storage/pageList', data)
+}
+export const I1_APIwarehouseList = (data: any): any => {
+  return async (dispatch: AppDispatch) => {
+    const res = await http.post('cms/storage/pageList', data)
+    if (res.code === 0) {
+      const obj = {
+        list: res.data.records,
+        total: res.data.total
+      }
+
+      dispatch({ type: 'I1/getWarehouseList', payload: obj })
+    }
+  }
+}
+
+/**
+ * 库房设置 - 库房删除
+ */
+export const I1_APIwarehouseDel = (id: string) => {
+  return http.get(`cms/storage/remove/${id}`)
+}
+
+/**
+ * 库房设置 - 新增/修改库房
+ */
+export const I1_APIwarehouseSave = (data: any) => {
+  return http.post('cms/storage/saveEntity', data) // 直接传数组
+}

src/store/reducer/Isystem/I1storageSet.ts

@@ -0,0 +1,35 @@
+import { Typetable } from '@/pages/Zother/data'
+
+// 初始化状态
+const initState = {
+  // 列表数据
+  tableInfo: {
+    list: [] as Typetable[],
+    total: 0
+  },
+  warehouseTableInfo: {
+    list: [] as Typetable[],
+    total: 0
+  }
+}
+
+// 定义 action 类型
+type Props = {
+  type: 'I1/getList' | 'I1/getWarehouseList'
+  payload: { list: Typetable[]; total: number }
+}
+
+// reducer
+export default function Reducer(state = initState, action: Props) {
+  switch (action.type) {
+    // 获取列表数据
+    case 'I1/getList':
+      return { ...state, tableInfo: action.payload }
+
+    case 'I1/getWarehouseList':
+      return { ...state, warehouseTableInfo: action.payload }
+
+    default:
+      return state
+  }
+}

src/store/reducer/index.ts

@@ -13,6 +13,7 @@ import D3writeOff from './Dmanage/D3writeOff'
 import E1tag from './Eculture/E1tag'
 import E2story from './Eculture/E2story'
 
+import I1storageSet from './Isystem/I1storageSet'
 import I2dict from './Isystem/I2dict'
 import I3numSet from './Isystem/I3numSet'
 import I4processSet from './Isystem/I4processSet'
@@ -34,6 +35,7 @@ const rootReducer = combineReducers({
   E1tag,
   E2story,
 
+  I1storageSet,
   I2dict,
   I3numSet,
   I4processSet,

src/utils/tableData.ts

@@ -126,3 +126,19 @@ export const storyAndGoodsTableC = [
   ['txt', '藏品标签', 'tagName'],
   ['txt', '藏品名称', 'name']
 ]
+
+// 库房设置
+export const storageSetTableC = [
+  ['txt', '库房名称', 'storageName'],
+  [
+    'custom',
+    '仓位编号（排-列-层-格）',
+    (item: any) =>
+      [item.layer1, item.layer2, item.layer3, item.layer4].filter(i => Boolean(i)).join('-')
+  ]
+]
+export const warehouseSetTableC = [
+  ['txt', '库房名称', 'name'],
+  ['txt', '库房负责人', 'managerUser'],
+  ['txt', '库房说明', 'description']
+]