Commit ec155464 authored by 张子雨's avatar 张子雨

feat: 企业店铺管理

parent d1c26369
......@@ -286,6 +286,18 @@ export default {
name: 'businessInfo',
component: './businessManage/info',
},
{
title: '商户管理后台-商家资料',
path: '/StoreManagement',
name: 'StoreManagement',
component: './StoreManagement',
},
// {
// title: '商户管理后台-商家资料',
// path: '/EmployeeManagement',
// name: 'EmployeeManagement',
// component: './EmployeeManagement',
// },
{
component: './404',
},
......
This diff is collapsed.
import React, { useState, useEffect, forwardRef, useRef, useImperativeHandle } from 'react';
import { Button, Modal, Select, Form, notification } from 'antd';
import styles from '../index.less';
const AddModal = props => {
const { addVisible } = props;
const [shopIds, setShopIds] = useState([]);
const handleCancel = () => {
props.onCancel(false);
};
const handleChange = value => {
setShopIds(value);
};
const onOk = () => {
if (!shopIds.length) {
notification.error({
message: '请添加微店',
});
}
};
return (
<>
<Modal title="添加企业店铺" onOk={onOk} visible={addVisible} onCancel={() => handleCancel()}>
<Form>
<Form.Item label="企业名称">
<span>企业名称</span>
</Form.Item>
<Form.Item label="添加微店" name="shopIds">
<Select
mode="multiple"
allowClear
style={{ width: '100%' }}
placeholder="请选择微店"
onChange={handleChange}
// options={options}
/>
</Form.Item>
<Form.Item label="餐饮类型">
<span>餐饮类型</span>
</Form.Item>
</Form>
</Modal>
</>
);
};
export default AddModal;
import React from 'react';
import { Image as ImageComponent, Button } from 'antd';
import { FormOutlined } from '@ant-design/icons';
export const repastTypeList = [
{
value: 1,
label: '外卖',
},
{
value: 2,
label: '自助餐',
},
{
value: 4,
label: '到店',
},
];
export const columns = props => [
{
title: '微店ID',
key: 'id',
dataIndex: 'id',
align: 'center',
},
{
title: '微店名称',
key: 'shopName',
dataIndex: 'shopName',
align: 'center',
},
{
title: '餐饮类型',
key: 'mealType',
dataIndex: 'mealType',
align: 'center',
render: (_, row) => {
const status = !row?.pickselfName;
return (
<Button type="text" disabled={status} onClick={() => props.editRepastType(row)}>
{row.mealType} <FormOutlined />
</Button>
);
},
},
{
title: '所属企业取餐点',
key: 'pickselfName',
dataIndex: 'pickselfName',
align: 'center',
},
{
title: '修改人',
key: 'updatedBy',
dataIndex: 'updatedBy',
align: 'center',
},
{
title: '修改时间',
key: 'amount',
dataIndex: 'amount',
align: 'center',
},
{
title: '操作',
dataIndex: 'option',
valueType: 'option',
align: 'center',
key: 'option',
render: (_, row) => (
<Button type="link" disabled={row?.pickselfName} onClick={() => props.delShop(row)}>
删除
</Button>
),
},
];
import React, { useState, useEffect, forwardRef, useRef, useImperativeHandle } from 'react';
import { Button, Modal, Radio, Form, Space, message, Checkbox, Col, Row } from 'antd';
import styles from '../index.less';
import { shopUpdate } from '../service.js';
const EditRepastModal = props => {
const { editVisible, repastType, id } = props;
const handleCancel = () => {
props.onCancel();
};
const handleChange = e => {
console.log(e.target.value);
};
const onOk = () => {
// if (!shopIds.length) {
// notification.error({
// message: '请添加微店',
// });
// }
};
return (
<>
<Modal title="餐饮类型" onOk={onOk} visible={editVisible} onCancel={() => handleCancel()}>
<Form layout="vertical" autoComplete="off">
<Form.Item label="取餐点下商户餐品类型">
<Radio.Group onChange={handleChange}>
<Space direction="vertical">
<Radio value={1}>外卖</Radio>
<Radio value={2}>自助餐</Radio>
</Space>
</Radio.Group>
<p className={styles.tip}>切换餐品类型后,请及时维护商品</p>
</Form.Item>
<Form.Item label="是否开启餐品类型">
<Checkbox.Group>
<Space direction="vertical">
{(repastType.length &&
repastType.map((index, value) => <Checkbox value="A">到店</Checkbox>)) ||
''}
</Space>
</Checkbox.Group>
<p className={styles.tip}>关闭【到店】餐类时,关联到店企业商品将一并删除</p>
</Form.Item>
</Form>
</Modal>
</>
);
};
export default EditRepastModal;
import React, { useState, useRef, forwardRef, useEffect } from 'react';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { Modal, Form, Select, Table, Card, Row, Col, Input, Button, message } from 'antd';
import { columns, repastTypeList } from './data';
import EditRepastModal from './editRepastModal';
import AddModal from './addModal';
import styles from './index.less';
import { setShopList, setShopDelete, mealTypeList } from './service.js';
const { confirm } = Modal;
const StoreManagement = () => {
const [page, setPage] = useState({
current: 1,
pageSize: 10,
});
const [searchForm, setSearchForm] = useState({});
const formRef = useRef(null);
const [editVisible, setEditVisible] = useState(false);
const [addVisible, setAddVisible] = useState(false);
const [repastType, setRepastType] = useState([]);
const [repastId, setRepastId] = useState(null);
const data = [
{
enterpriseId: '企业id',
id: '1',
shopId: 'shopId',
shopName: '店铺名称',
mealType: '到店',
pickselfName: '',
updatedBy: '修改人名称',
amount: '2023/03/21 14:06:11',
},
{
enterpriseId: '企业id',
id: '2',
shopId: 'shopId',
shopName: '店铺名称',
mealType: '到店',
pickselfName: '取餐点',
updatedBy: '修改人名称',
},
];
const shopList = async () => {
const res = await setShopList({ ...page, ...searchForm });
console.log(res);
};
useEffect(() => {
shopList();
}, []);
// 关闭弹框
const closeModal = value => {
if (value) {
shopList();
}
setEditVisible(false);
setAddVisible(false);
};
const setMealTypeList = async () => {
// const res = await mealTypeList({ id: repastId });
// if (res.businessCode === '0000') {
// setRepastType(res.data);
// setEditVisible(true);
// }
setEditVisible(true);
};
// 修改餐饮类型
const editRepastType = ({ id }) => {
setRepastId(id);
setMealTypeList();
};
// 删除
const editShop = async id => {
const res = await setShopDelete({ id });
if (res.businessCode === '0000') {
message.success('删除成功!');
shopList();
}
};
// 删除
const delShop = ({ shopName, id }) => {
confirm({
title: `确认删除企业商户#${shopName || ''}#?`,
content: '注:删除微店后,其商户下企业商品一并删除',
onOk() {
editShop(id);
},
onCancel() {
console.log('Cancel');
},
});
};
// 添加商户
const addShop = () => {
setAddVisible(true);
};
// 搜索
const onFinish = values => {
setSearchForm(values);
setPage({ current: 1, pageSize: 10 });
shopList();
};
// 重置
const onReset = () => {
formRef.current.resetFields();
shopList();
};
// 分页
const handleTableChange = val => {
setPage(val);
};
const res = {
editRepastType,
delShop,
};
return (
<PageHeaderWrapper>
<Card className={styles.card}>
<Form ref={formRef} onFinish={onFinish}>
<Row gutter={24}>
<Col span={8}>
<Form.Item
label="企业名称"
name="enterpriseId"
wrapperCol={{ span: 16 }}
rules={[{ required: true }]}
>
<Select
allowClear
showSearch
filterOption={(input, option) =>
(option?.label ?? '').toLowerCase().includes(input.toLowerCase())
}
options={[
{
value: 'jack',
label: 'Jack',
},
{
value: 'lucy',
label: 'Lucy',
},
{
value: 'tom',
label: 'Tom',
},
]}
/>
</Form.Item>
</Col>
<Col span={8}>
<Form.Item label="微店名称" name="shopName" wrapperCol={{ span: 16 }}>
<Input maxLength="20" allowClear />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item label="微店ID" name="shopId" wrapperCol={{ span: 16 }}>
<Input maxLength="20" allowClear />
</Form.Item>
</Col>
<Col span={8}>
<Form.Item label="餐品类型" name="mealType" wrapperCol={{ span: 16 }}>
<Select
allowClear
showSearch
filterOption={(input, option) =>
(option?.label ?? '').toLowerCase().includes(input.toLowerCase())
}
options={repastTypeList}
placeholder="全部"
/>
</Form.Item>
</Col>
<Col className={styles.btn}>
<Form.Item>
<Button type="primary" htmlType="submit">
搜索
</Button>
<Button htmlType="button" onClick={onReset} className={styles.left}>
重置
</Button>
<Button type="primary" onClick={addShop} className={styles.left}>
添加商户
</Button>
</Form.Item>
</Col>
</Row>
</Form>
</Card>
<Table
columns={columns(res)}
dataSource={data}
rowKey={r => r.appealNo}
bordered
onChange={handleTableChange}
/>
<EditRepastModal
editVisible={editVisible}
repastType={repastType}
id={repastId}
onCancel={() => closeModal()}
/>
<AddModal addVisible={addVisible} name="name" onCancel={() => closeModal()} />
</PageHeaderWrapper>
);
};
export default StoreManagement;
.tip {
padding-top: 5px;
color: #ff8c00;
font-size: 12px;
}
.card {
margin-bottom: 16px;
}
.btn {
position: absolute;
right: 0;
bottom: 0;
display: flex;
}
.left {
margin-left: 20px;
}
.editShop {
margin-bottom: 10px;
}
import request from '@/utils/request';
import config from '../../../config/env.config';
import { stringify } from 'qs';
import _ from 'lodash';
const { goodsApi } = config;
const headers = {
'Content-Type': 'application/x-www-form-urlencoded',
};
//
export const setShopList = async params => {
const data = await request.post('/v1/channels/enterprise/shop/list', {
prefix: goodsApi,
data: params,
});
return data;
};
// [企业店铺]-删除企业下面的店铺
// http://yapi.quantgroups.com/project/389/interface/api/65319
export const setShopDelete = async params => {
const data = await request.post('/v1/channels/enterprise/shop/delete', {
prefix: goodsApi,
data: params,
});
return data;
};
// [企业店铺]-查询餐品类型
// http://yapi.quantgroups.com/project/389/interface/api/65314
export const mealTypeList = async params => {
const data = await request.post('/v1/channels/enterprise/shop/mealType/list', {
prefix: goodsApi,
data: params,
});
return data;
};
// [企业店铺]-添加企业店铺
// http://yapi.quantgroups.com/project/389/interface/api/65304
export const shopAdd = async params => {
const data = await request.post('/v1/channels/enterprise/shop/add', {
prefix: goodsApi,
data: params,
});
return data;
};
// 企业店铺]-修改餐品类型
// http://yapi.quantgroups.com/project/389/interface/api/65309
export const shopUpdate = async params => {
const data = await request.post('/v1/channels/enterprise/shop/update', {
prefix: goodsApi,
data: params,
});
return data;
};
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment