feat: 添加分组接口

src/pages/GoodsManage/SearchForm/index.jsx

@@ -148,7 +148,7 @@ class goodsManage extends Component {
         className={styles.searchForm}
       >
         <FormItem label="SKU编码" name="skuId">
-          <InputNumber placeholder="请输入SKU编码" allowClear style={selectW} />
+          <InputNumber placeholder="请输入SKU编码" style={selectW} />
         </FormItem>
         <FormItem label="商品名称" name="skuName">
           <Input placeholder="请输入商品名称" allowClear style={selectW} />

src/pages/GoodsManage/Takeaway/components/ActionBar.jsx

@@ -61,7 +61,7 @@ const ActionBar = options => {
 
   return (
     <div className={styles['action-bar-box']}>
-      <Button type="primary" icon={<PlusOutlined />}>
+      <Button type="primary" icon={<PlusOutlined />} onClick={options.newGoods}>
         该分组下新增商品
       </Button>
       <Dropdown overlay={menus} className={styles['action-bar-box--down']} placement="bottomLeft">

src/pages/GoodsManage/Takeaway/components/DragTag.jsx

 import React, { useRef, useState } from 'react';
 import { useDrag, useDrop } from 'react-dnd';
-import { Tag, Input } from 'antd';
+import { Tag, Input, Popconfirm } from 'antd';
 import { HolderOutlined, FormOutlined, CloseCircleOutlined } from '@ant-design/icons';
 import styles from '../../style.less';
 
 const ItemTypes = {
   CARD: 'card',
 };
-const DragTag = ({ text, id, index, changePosition, endChangePosition, edit }) => {
+const DragTag = ({ text, id, index, changePosition, endChangePosition, edit, del }) => {
   const [isEdit, setIsEdit] = useState(false);
   const [inputValue, setInputValue] = useState('');
   const refInput = useRef();
@@ -24,7 +24,7 @@ const DragTag = ({ text, id, index, changePosition, endChangePosition, edit }) =
   };
 
   const handleClose = () => {
-    console.log('111 :>> ', 111);
+    del(id);
   };
 
   const ref = useRef(null);
@@ -84,7 +84,9 @@ const DragTag = ({ text, id, index, changePosition, endChangePosition, edit }) =
       <span>
         <FormOutlined className={styles['groupBox-body--tag__edit']} onClick={handleEdit} />
       </span>
-      <CloseCircleOutlined className={styles['groupBox-body--tag__close']} onClick={handleClose} />
+      <Popconfirm title="确定删除该分组吗?" onConfirm={handleClose} okText="确定" cancelText="取消">
+        <CloseCircleOutlined className={styles['groupBox-body--tag__close']} />
+      </Popconfirm>
     </Tag>
   );
 

src/pages/GoodsManage/Takeaway/components/GoodsGroup.jsx

@@ -6,13 +6,7 @@ import styles from '../../style.less';
 import DragTag from './DragTag';
 import InsertTag from './InsertTag';
 import GroupInfo from './GroupInfo';
-import {
-  apiDelStorage,
-  apiSortStorage,
-  apiStorageList,
-  apiSupplierShopList,
-  apiStorageInfo,
-} from '../../service';
+import { apiDelStorage, apiSortStorage, apiStorageList, apiSupplierShopList } from '../../service';
 
 const GoodsGroup = options => {
   const [groupEdit, setGroupEdit] = useState(false);
@@ -53,10 +47,17 @@ const GoodsGroup = options => {
     }
   };
 
-  const handelEdit = async id => {
+  const handleEdit = async id => {
     setStorageId(id || 0);
     setIsModalOpen(true);
   };
+  const handleDelete = async id => {
+    await apiDelStorage({
+      shopId: options.shopId,
+      id,
+    });
+    getGroupList();
+  };
 
   // 更换位置
   const changePosition = async (dragIndex, hoverIndex) => {
@@ -134,11 +135,12 @@ const GoodsGroup = options => {
                   index={index}
                   {...item}
                   selected={selected}
-                  edit={handelEdit}
+                  edit={handleEdit}
+                  del={handleDelete}
                   key={item.id}
                 />
               ))}
-              <InsertTag handleOpen={handelEdit} />
+              <InsertTag handleOpen={handleEdit} />
             </div>
           </DndProvider>
         ) : (
@@ -155,7 +157,7 @@ const GoodsGroup = options => {
                 <span className={styles['groupBox-body--tag__text']}>{item.text}</span>
               </Tag>
             ))}
-            <InsertTag key="insert" handleOpen={setIsModalOpen} />
+            <InsertTag key="insert" handleOpen={handleEdit} />
           </div>
         )}
       </div>
@@ -163,6 +165,7 @@ const GoodsGroup = options => {
         isModalOpen={isModalOpen}
         id={storageId}
         shopId={options.shopId}
+        search={getGroupList}
         handleClose={setIsModalOpen}
       />
     </div>

src/pages/GoodsManage/Takeaway/components/GroupInfo.jsx

-import React, { useEffect } from 'react';
-import { Form, Modal, Input, Checkbox, Alert, message } from 'antd';
+import React, { useEffect, useState } from 'react';
+import { Form, Modal, Input, Switch, Alert, message } from 'antd';
 import { apiCreateStorage, apiEditStorage, apiStorageInfo } from '../../service';
 
 const GroupInfo = options => {
   const [form] = Form.useForm();
+  const [isChecked, setIsChecked] = useState(false);
 
   // 关闭分组信息弹窗
   const handleCancel = () => {
     options.handleClose(false);
   };
 
-  // 提交分组
+  // 添加/保存分组
   const handleConfirm = async () => {
-    const values = await form.validateFields();
+    const { name, necessary } = await form.validateFields();
     const api = options.id ? apiEditStorage : apiCreateStorage;
-    const res = await api({
-      ...values,
+    await api({
+      name,
+      necessary: necessary ? 1 : 0,
       shopId: options.shopId,
       id: options.id,
     });
@@ -29,8 +31,11 @@ const GroupInfo = options => {
       id,
     });
     if (res && res.data && res.data.id) {
+      const { name, necessary } = res.data;
+      setIsChecked(+necessary === 1);
       form.setFieldsValue({
-        name: res.data.name,
+        name,
+        necessary: +necessary === 1,
       });
     }
   };
@@ -52,6 +57,8 @@ const GroupInfo = options => {
     <Modal
       title="分组信息"
       visible={options.isModalOpen}
+      destroyOnClose
+      maskClosable={false}
       onOk={handleConfirm}
       onCancel={handleCancel}
     >
@@ -65,7 +72,12 @@ const GroupInfo = options => {
         </Form.Item>
 
         <Form.Item label="下单必选分组" name="necessary" extra={extra}>
-          <Checkbox />
+          <Switch
+            checkedChildren="开启"
+            checked={isChecked}
+            unCheckedChildren="关闭"
+            onChange={setIsChecked}
+          />
         </Form.Item>
       </Form>
     </Modal>

src/pages/GoodsManage/Takeaway/components/WeekTime.jsx

@@ -31,7 +31,7 @@ const WeekTime = options => {
     setType(value);
   };
 
-  const radioOptions = [{ label: '全时段', value: 1 }, { label: '自定义售卖时间', value: 2 }];
+  const radioOptions = [{ label: '全时段', value: 0 }, { label: '自定义售卖时间', value: 1 }];
 
   const handleCancel = () => {
     options.cancel(false);

src/pages/GoodsManage/Takeaway/index.jsx

@@ -4,7 +4,7 @@ import { MenuOutlined, HolderOutlined, FormOutlined, CloseCircleOutlined } from
 import { SortableContainer, SortableElement, SortableHandle } from 'react-sortable-hoc';
 import { arrayMoveImmutable } from 'array-move';
 import GoodsGroup from './components/GoodsGroup';
-import { apiTakeawayGoods, apiGoodsActionBatch } from '../service';
+import { apiTakeawayGoods, apiGoodsActionBatch, apiSortTakeawayGoods } from '../service';
 import styles from '../style.less';
 import { takeawayColumn } from '../staticdata';
 // import VirtualTable from './components/VirtualTable';
@@ -33,10 +33,37 @@ const Takeaway = options => {
     onChange: setSelectedRowKeys,
   };
 
-  const onSortEnd = ({ oldIndex, newIndex }) => {
+  const getDataList = async () => {
+    setLoading(true);
+    const params = {
+      pageNo: 1,
+      productType: 5,
+      pageSize: 100000,
+      storageRackId: groupId,
+    };
+    const res = await apiTakeawayGoods(params);
+    setLoading(false);
+    if (res && res.data) {
+      setTableData(res.data.records);
+    }
+  };
+
+  const onSortEnd = async ({ oldIndex, newIndex }) => {
     if (oldIndex !== newIndex) {
       const newData = arrayMoveImmutable(tableData.slice(), oldIndex, newIndex).filter(el => !!el);
-      setTableData(newData);
+      const skuSorts = newData.map((item, index) => ({
+        skuId: item.skuId,
+        sort: index + 1,
+      }));
+      const params = {
+        storageRackId: groupId,
+        type: 1,
+        shopId,
+        skuSorts,
+      };
+      await apiSortTakeawayGoods(params);
+      getDataList();
+      // setTableData(newData);
     }
   };
 
@@ -59,36 +86,21 @@ const Takeaway = options => {
     return <SortableItem index={index} {...restProps} />;
   };
 
-  const getDataList = async () => {
-    setLoading(true);
-    const params = {
-      pageNo: 1,
-      productType: 5,
-      pageSize: 100000,
-      storageRackId: groupId,
-    };
-    const res = await apiTakeawayGoods(params);
-    setLoading(false);
-    if (res && res.data) {
-      setTableData(res.data.records);
-    }
-  };
-
   // 批量操作 type 1-是否列出 2-修改上下架   3-改货架  4-售卖时间更新  5-调整商品起购数量 6-调整商品是否单点不送   7-修改库存
   const handleBatchAction = async params => {
     const json = {
       skuIds: selectedRowKeys,
       shopId,
     };
-    // setActionLoading(true);
-    // const params2 = {
-    //   ...json,
-    //   ...params,
-    // };
-    // console.log('params2 :>> ', params2);
-    // const res = await apiGoodsActionBatch(Object.assign({}, json, params));
-    // setActionLoading(false);
-    // getDataList();
+    setActionLoading(true);
+    const params2 = {
+      ...json,
+      ...params,
+    };
+    console.log('params2 :>> ', params2);
+    const res = await apiGoodsActionBatch(Object.assign({}, json, params));
+    setActionLoading(false);
+    getDataList();
     message.success('处理成功！');
   };
 
@@ -107,13 +119,27 @@ const Takeaway = options => {
     openModal('stock');
   };
   // 编辑
-  const onEdit = row => {};
+  const onEdit = ({ spuId }) => {
+    options.handleEdit({
+      shopId,
+      spuId,
+    });
+  };
+  // 新建商品
+  const onNew = () => {
+    options.handleEdit({
+      shopId,
+      groupId,
+    });
+  };
   // 置顶
   const toTop = row => {};
 
   useEffect(() => {
-    getDataList();
-  }, []);
+    if (groupId) {
+      getDataList();
+    }
+  }, [groupId]);
 
   const actions = {
     onShowStockModal,
@@ -129,6 +155,7 @@ const Takeaway = options => {
           selectedRowKeys={selectedRowKeys}
           handleSearch={getDataList}
           openModal={openModal}
+          newGoods={onNew}
         />
         <Table
           dataSource={tableData}

src/pages/GoodsManage/index.jsx

@@ -62,6 +62,7 @@ class goodsManage extends Component {
     isVisibleDraft: false, // 显示隐藏草稿箱
     isEditDraft: false, // 是否编辑草稿
     productType: 1, // 商品类型
+    takeAway: {}, // 弹窗外卖商品参数
   };
 
   currentLog = null;
@@ -367,6 +368,14 @@ class goodsManage extends Component {
     this.serviceVisbleChange(this.state.auditRow);
   };
 
+  // 显示外卖商品弹窗
+  handleTakeawayEdit = params => {
+    this.setState({
+      takeAway: params,
+      serviceVisble: true,
+    });
+  };
+
   render() {
     const {
       goodsManage: { tableData = {} },
@@ -421,7 +430,7 @@ class goodsManage extends Component {
             />
           </Card>
           {this.state.productType === 5 ? (
-            <Takeaway />
+            <Takeaway handleEdit={this.handleTakeawayEdit} />
           ) : (
             <>
               <Spin spinning={this.state.loading}>
@@ -509,6 +518,8 @@ class goodsManage extends Component {
             specListData={this.state.specListData}
             permissions={permissions}
             isDraft={this.state.isEditDraft}
+            productType={this.state.productType}
+            takeAway={this.state.takeAway}
           />
         )}
         {this.state.visibleAuditModal && (

src/pages/GoodsManage/service.js

@@ -307,7 +307,7 @@ export async function apiTakeawayGoods(params) {
 }
 // 外卖商品排序
 export async function apiSortTakeawayGoods(data) {
-  return request.post('/v1/channels/products/sku/batchSort', {
+  return request.post('/api/merchants/products/sku/batchSort', {
     prefix: goodsApi,
     data,
   });
@@ -334,17 +334,18 @@ export async function apiEditStorage(data) {
 }
 // 分组详情（货架—货架详情）
 export async function apiStorageInfo(params) {
-  return request.post('/api/merchants/products/storageRack/queryByShopIdAndStorageRackId', {
+  return request.post('/api/merchants/products/storageRack/QueryByShopIdAndStorageRackId', {
     prefix: goodsApi,
     data: stringify(params),
     headers,
   });
 }
 // 删除分组（货架—删除货架）
-export async function apiDelStorage(data) {
+export async function apiDelStorage(params) {
   return request.post('/api/merchants/products/storageRack/removeByShopIdAndId', {
     prefix: goodsApi,
-    data,
+    data: stringify(params),
+    headers,
   });
 }
 // 分组排序（货架—排序货架）

src/pages/GoodsManage/staticdata.js

@@ -253,8 +253,8 @@ export function takeawayColumn(actions) {
       content: `确认${+state === 6 ? '下架' : '上架'}商品？`,
       onOk: async () => {
         const res = await apiChangeStateGoods({
-          ids: skuId,
-          productState: +state === 6 ? 7 : 6, // 6：上架，7:下架
+          skuIds: skuId,
+          productStatus: +state === 6 ? 7 : 6, // 6：上架，7:下架
         });
         if (res.businessCode === '0000' && res.code === '0000') {
           this.handleSearch();