feat: 添加外卖商品

src/pages/businessGoods/components/SelectGoodsModal.jsx

 import React, { useState, useEffect } from 'react';
 import { Select, Modal, Table, Input, Button, Pagination, notification } from 'antd';
 import { SearchOutlined } from '@ant-design/icons';
-import { apiSelGoodsList, apiSelVirtualGoodsList } from '../service';
+import { apiSelGoodsList, apiSelVirtualGoodsList, apiShopListByPickSelfID } from '../service';
 import { getShopListByPickSelf } from '../service/bll';
 import { SelectGoodsColumn, productType } from '../staticData/goods';
 import style from '../style/index.less';
@@ -12,11 +12,12 @@ const SaleDateModal = props => {
   const [searchType, setSearchType] = useState('1');
   const [searchKeyword, setSearchKeyword] = useState('');
   const [goodsType, setGoodsType] = useState('1');
-  const [shopId, setShopId] = useState('');
+  const [shopId, setShopId] = useState();
   const [searchName, setSearchName] = useState('');
   const [loading, setLoading] = useState(false);
   const [page, setPage] = useState(1);
   const [pageSize, setPageSize] = useState(10);
+  const [total, setTotal] = useState(0);
   const [dataSource, setDataSource] = useState([]);
   const [shopList, setShopList] = useState(jsonToArray(productType));
   const [selectedRowKeys, setSelectedRowKeys] = useState([]);
@@ -41,7 +42,7 @@ const SaleDateModal = props => {
       data: Object.assign(
         {
           shopId,
-          productType,
+          productType: props.productType,
           enterpriseId,
         },
         searchObj,
@@ -54,7 +55,11 @@ const SaleDateModal = props => {
       api = apiSelVirtualGoodsList;
     }
     const res = await api(data);
-    setDataSource(res);
+    console.log('res :>> ', res);
+    if (res && res.data && res.data.records) {
+      setDataSource(res.data.records);
+      setTotal(res.data.total);
+    }
     setLoading(false);
   };
 
@@ -84,7 +89,11 @@ const SaleDateModal = props => {
       notification.error({ message: '请选择要添加的商品' });
       return;
     }
-    props.onSelectChange(deepClone(selectedRows));
+    const arr = deepClone(selectedRows).map(item => ({
+      ...item,
+      shopId,
+    }));
+    props.onSelectChange(arr);
     handleCancel();
   };
 
@@ -147,11 +156,21 @@ const SaleDateModal = props => {
 
   // 获取店铺列表
   const getShopList = async () => {
-    const res = await getShopListByPickSelf({
+    const res = await apiShopListByPickSelfID({
       enterpriseId: props.enterpriseId,
       pickSelfIdList: props.pickSelfIdList,
     });
-    setShopList(res);
+    if (res && res.data) {
+      console.log('getShopList res :>> ', res);
+      setShopList(
+        res.data.map(item => ({
+          label: item.name,
+          value: item.id,
+        })),
+      );
+      // searchList({});
+    }
+    // setShopList(res);
   };
 
   const rowSelection = {
@@ -168,7 +187,7 @@ const SaleDateModal = props => {
   const selectAfter = <SearchOutlined onClick={onSearch} />;
   const footers = () => [
     <div className={style.footers}>
-      <Pagination defaultCurrent={6} total={500} showQuickJumper onChange={onPageChange} />
+      <Pagination defaultCurrent={1} total={total} showQuickJumper onChange={onPageChange} />
       <div className={style['footers-btn']}>
         <div className={style['footers-desc']}>
           已选商品(<span className={style['footers-num']}>{selectedRows.length}</span>)
@@ -186,7 +205,6 @@ const SaleDateModal = props => {
   useEffect(() => {
     getShopList();
     setGoodsType(props.productType);
-    searchList({});
   }, []);
 
   return (
@@ -211,7 +229,7 @@ const SaleDateModal = props => {
         <Select
           placeholder="请选择商品类型"
           disabled
-          value={goodsType}
+          value={`${props.productType}`}
           options={jsonToArray(productType)}
           className={style['select-goods-box--select']}
         />
@@ -226,6 +244,7 @@ const SaleDateModal = props => {
         rowSelection={rowSelection}
         rowKey="skuId"
         columns={SelectGoodsColumn}
+        pagination={false}
         dataSource={dataSource}
       />
     </Modal>

src/pages/businessGoods/staticData/goods.js

@@ -257,7 +257,7 @@ export const GoodsInfoColumn = options => {
     },
     {
       title: '商品售价',
-      dataIndex: 'price',
+      dataIndex: 'salePrice',
       width: 120,
       align: 'center',
     },
@@ -269,9 +269,16 @@ export const GoodsInfoColumn = options => {
     },
     {
       title: '库存',
-      dataIndex: 'status',
+      dataIndex: 'stock',
       width: 120,
       align: 'center',
+      render(v, record) {
+        const arr = record.supplierProductItemList;
+        if (arr && arr.length) {
+          return arr[0].stock;
+        }
+        return '-';
+      },
     },
     {
       title: '可售日期',
@@ -326,8 +333,8 @@ export const GoodsInfoColumn = options => {
       width: '100px',
       align: 'center',
       fixed: 'right',
-      render: (val, r) => (
-        <Button key="del" onClick={() => onDel(r, 'del')}>
+      render: (val, r, i) => (
+        <Button key="del" onClick={() => onDel(i)}>
           删除
         </Button>
       ),
@@ -339,36 +346,43 @@ export const SelectGoodsColumn = [
   {
     title: '商品ID',
     width: 120,
+    align: 'center',
     dataIndex: 'skuId',
   },
   {
     title: '商品名称',
     dataIndex: 'skuName',
-    width: 120,
-    align: 'center',
-  },
-  {
-    title: '商品编号',
-    dataIndex: 'skuNo',
-    width: 120,
-    align: 'center',
   },
+  // {
+  //   title: '商品编号',
+  //   dataIndex: 'skuNo',
+  //   width: 120,
+  //   align: 'center',
+  // },
   {
     title: '销售价',
-    dataIndex: 'price',
+    dataIndex: 'salePrice',
     width: 120,
     align: 'center',
   },
   {
     title: '剩余库存',
-    dataIndex: 'status',
-    width: 120,
+    dataIndex: 'stock',
+    width: 100,
     align: 'center',
+    render(v, record) {
+      const arr = record.supplierProductItemList;
+      if (arr && arr.length) {
+        return arr[0].stock;
+      }
+      return '-';
+    },
   },
   {
     title: '已参与活动',
-    dataIndex: 'mealType',
+    dataIndex: 'activity',
     align: 'center',
+    width: 110,
     hideInSearch: true,
   },
 ];

src/pages/businessGoods/style/index.less

@@ -19,6 +19,7 @@
     text-align: right;
   }
   &--select {
+    width: 100%;
     min-width: 200px;
   }
   &--btns {

src/pages/businessGoods/takeawayGoods.jsx

@@ -59,7 +59,14 @@ const TakeawayGoods = () => {
     });
   };
   const onAdd = async () => {
-    const query = getToUrlQuery();
+    const params = getToUrlQuery();
+    const query = Object.assign(
+      {
+        id: enterpriseId,
+        name: enterprises[enterpriseId].text,
+      },
+      params,
+    );
     history.push({
       pathname: '/takeawayGoodsInfo',
       query,

src/pages/businessGoods/takeawayGoodsInfo.jsx

@@ -11,7 +11,7 @@ import { apiSelPickSelfList, apiPickSelfList, apiSaveGoodsList } from './service
 import style from './style/index.less';
 
 const TakeawayGoodsInfo = props => {
-  const { id } = props.location.query;
+  const { id, name } = props.location.query;
   const history = useHistory();
   const [loading, setLoading] = useState(false);
   const [visibleSaleDate, setVisibleSaleDate] = useState(false); // 可售日期弹窗
@@ -51,31 +51,31 @@ const TakeawayGoodsInfo = props => {
 
   // 删除
   const onDel = i => {
-    const arr = dataSource.splice(i, 1);
+    const arr = [...dataSource];
+    arr.splice(i, 1);
     setDataSource(arr);
   };
 
   // 根据企业ID获取取餐点
   const getPickSelf = async () => {
     const res = await apiPickSelfList();
-    setPickSelfList(
-      res.map(item => ({
-        key: item.pickSelfId,
-        label: <span>{item.pickSelfName}</span>,
-      })),
-    );
+    if (res && res.data && res.data.records) {
+      setPickSelfList(
+        res.data.records.map(item => ({
+          value: item.id,
+          label: item.pickselfName,
+        })),
+      );
+    }
   };
   // 根据企业ID获取已选取餐点
   const getSelPickSelf = async () => {
     const res = await apiSelPickSelfList({
       enterpriseId: id,
     });
-    setSelPickSelf(
-      res.map(item => ({
-        key: item.pickSelfId,
-        label: <span>{item.pickSelfName}</span>,
-      })),
-    );
+    if (res && res.data) {
+      setSelPickSelf(res.map(item => item.pickSelfId));
+    }
   };
 
   // 刷新列表数据
@@ -93,6 +93,15 @@ const TakeawayGoodsInfo = props => {
     setDataSource(arr);
   };
 
+  // 显示选择商品弹窗
+  const onShowSelect = () => {
+    if (!slePickSelf || slePickSelf.length < 1) {
+      message.error('请选择取餐点!');
+      return;
+    }
+    setVisibleSelectGoods(true);
+  };
+
   // const initData = async () => {
   //   setLoading(true);
   // };
@@ -116,7 +125,7 @@ const TakeawayGoodsInfo = props => {
             <Col span={3} className={style['info-box--label']}>
               企业名称：
             </Col>
-            <Col span={20}>企业名称111</Col>
+            <Col span={20}>{name}</Col>
           </Row>
           <Row className={style['info-box--line']}>
             <Col span={3} className={style['info-box--label']}>
@@ -129,6 +138,7 @@ const TakeawayGoodsInfo = props => {
                 options={pickSelfList}
                 className={style['info-box--select']}
                 placeholder="清选择"
+                value={slePickSelf}
                 onChange={setSelPickSelf}
                 filterOption={(input, option) =>
                   (option?.label ?? '').toLowerCase().includes(input.toLowerCase())
@@ -141,7 +151,7 @@ const TakeawayGoodsInfo = props => {
               添加商品：
             </Col>
             <Col span={20}>
-              <Button type="primary" onClick={() => setVisibleSelectGoods(true)}>
+              <Button type="primary" onClick={() => onShowSelect()}>
                 选择商品
               </Button>
             </Col>
@@ -203,6 +213,9 @@ const TakeawayGoodsInfo = props => {
         {visibleSelectGoods && (
           <SelectGoodsModal
             visible={visibleSelectGoods}
+            enterpriseId={id}
+            productType={5}
+            pickSelfIdList={slePickSelf}
             onSelectChange={setDataSource}
             handleClose={() => setVisibleSelectGoods(false)}
           />

src/utils/utils.js

@@ -188,7 +188,7 @@ export const getUrlParams = name => {
   return null;
 };
 
-// 获取地址栏所以参数
+// 获取地址栏所有参数
 export const getUrlSearchParams = () => {
   const newObj = {};
   const url = window.location.search; // 获取url中"?"符后的字符串
@@ -212,11 +212,13 @@ export const getToken = () => {
 
 // 获取跳转参数
 export const getToUrlQuery = () => {
+  const params = getUrlSearchParams();
   // 从消费地图后管过来
-  if (getUrlParams('source') === 'tob' && localStorage.get('tobToken')) {
+  if (params.source) {
     return {
-      source: 'tob',
-      token: localStorage.get('tobToken'),
+      source: params.source,
+      token: params.token,
+      isMaster: params.isMaster,
     };
   }
   return {};