Merge branch 'master' of http://git.ycjcjy.com/jgz/admin

config/defaultSettings.ts → config/defaultSettings.js

@@ -1,9 +1,5 @@
-import { Settings as LayoutSettings } from '@ant-design/pro-components';
 
-const Settings: LayoutSettings & {
-  pwa?: boolean;
-  logo?: string;
-} = {
+const Settings = {
   navTheme: 'dark',
   // 拂晓蓝
   primaryColor: '#1890ff',
@@ -12,10 +8,13 @@ const Settings: LayoutSettings & {
   fixedHeader: false,
   fixSiderbar: true,
   colorWeak: false,
-  title: '军供',
+  title: '海安军供',
   pwa: false,
   logo: '/w2/logo.png',
   iconfontUrl: '',
+  splitMenus: false,
+  headerRender: false,
+  footerRender: false,
 };
 
 export default Settings;

config/routes.js

@@ -73,8 +73,7 @@
     path: '/package/list',
     name: '套餐管理',
     icon: 'VideoCameraOutlined',
-    component: './package/list',
-
+    component: './package/index',
   },
   {
     component: './404',

package.json

@@ -45,8 +45,8 @@
   ],
   "dependencies": {
     "@ant-design/icons": "^4.7.0",
-    "@ant-design/pro-components": "1.1.1",
-    "@umijs/route-utils": "^2.0.0",
+    "@ant-design/pro-components": "^2.0.0",
+    "@umijs/route-utils": "^2.1.3",
     "antd": "^4.20.0",
     "classnames": "^2.3.0",
     "lodash": "^4.17.0",
@@ -65,7 +65,6 @@
     "@types/classnames": "^2.3.1",
     "@types/express": "^4.17.0",
     "@types/history": "^4.7.0",
-    "@types/jest": "^26.0.0",
     "@types/lodash": "^4.14.0",
     "@types/react": "^17.0.0",
     "@types/react-dom": "^17.0.0",
@@ -79,7 +78,6 @@
     "eslint": "^7.32.0",
     "gh-pages": "^3.2.0",
     "husky": "^7.0.4",
-    "jsdom-global": "^3.0.0",
     "lint-staged": "^10.0.0",
     "mockjs": "^1.1.0",
     "prettier": "^2.5.0",
@@ -90,5 +88,34 @@
   },
   "engines": {
     "node": ">=12.0.0"
+  },
+  "create-umi": {
+    "ignoreScript": [
+      "docker*",
+      "functions*",
+      "site",
+      "generateMock"
+    ],
+    "ignoreDependencies": [
+      "netlify*",
+      "serverless"
+    ],
+    "ignore": [
+      ".dockerignore",
+      ".git",
+      ".github",
+      ".gitpod.yml",
+      "CODE_OF_CONDUCT.md",
+      "Dockerfile",
+      "Dockerfile.*",
+      "lambda",
+      "LICENSE",
+      "netlify.toml",
+      "README.*.md",
+      "azure-pipelines.yml",
+      "docker",
+      "CNAME",
+      "create-umi"
+    ]
   }
 }

src/app.jsx

@@ -1,9 +1,6 @@
-import Footer from '@/components/Footer';
-import RightContent from '@/components/RightContent';
-import { currentUser as queryCurrentUser } from '@/services/api/login';
 import { requestConfig } from '@/utils/request';
-import { SettingDrawer } from '@ant-design/pro-components';
 import { history } from '@umijs/max';
+import { SettingDrawer } from '@ant-design/pro-components';
 import defaultSettings from '../config/defaultSettings';
 
 const isDev = process.env.NODE_ENV === 'development';
@@ -40,9 +37,19 @@ export async function getInitialState() {
 
 // ProLayout 支持的api https://procomponents.ant.design/components/layout
 export const layout = ({ initialState, setInitialState }) => {
-  return {
+  const cfg = {
     // rightContentRender: () => <RightContent />,
     disableContentMargin: false,
+    token: {
+      sider: {
+        colorMenuBackground: '#001529',
+        colorTextMenuTitle: '#fff',
+        colorTextMenu: 'hsla(0,0%,100%,.65);',
+        colorBgMenuItemHover: '#fff',
+        colorBgMenuItemSelected: '#1890ff',
+        colorTextMenuSelected: '#fff',
+      },
+    },
     // waterMarkProps: {
     //   content: initialState?.currentUser?.name,
     // },
@@ -64,7 +71,6 @@ export const layout = ({ initialState, setInitialState }) => {
     //     ]
     //   : [],
     menuHeaderRender: undefined,
-
     // 自定义 403 页面
     // unAccessible: <div>unAccessible</div>,
     // 增加一个 loading 的状态
@@ -73,12 +79,29 @@ export const layout = ({ initialState, setInitialState }) => {
       return (
         <>
           {children}
+          {/* {!props.location?.pathname?.includes('/login') && (
+            <SettingDrawer
+              disableUrlParams
+              enableDarkTheme
+              settings={initialState?.settings}
+              onSettingChange={(settings) => {
+                setInitialState((preInitialState) => ({
+                  ...preInitialState,
+                  settings,
+                }));
+              }}
+            />
+          )} */}
         </>
       );
     },
 
-    ...initialState?.settings,
+    settings: initialState?.settings,
   };
+
+  console.log(cfg)
+
+  return cfg;
 };
 
 export const request = requestConfig;

src/components/Footer/index.jsx

@@ -1,7 +1,7 @@
 import { DefaultFooter } from '@ant-design/pro-components';
 
 const Footer = () => {
-  const defaultMessage = '无际科技';
+  const defaultMessage = '南京云致';
 
   const currentYear = new Date().getFullYear();
 
@@ -11,26 +11,6 @@ const Footer = () => {
         background: 'none',
       }}
       copyright={`${currentYear} ${defaultMessage}`}
-      // links={[
-      //   {
-      //     key: 'Ant Design Pro',
-      //     title: 'Ant Design Pro',
-      //     href: 'https://pro.ant.design',
-      //     blankTarget: true,
-      //   },
-      //   {
-      //     key: 'github',
-      //     title: <GithubOutlined />,
-      //     href: 'https://github.com/ant-design/ant-design-pro',
-      //     blankTarget: true,
-      //   },
-      //   {
-      //     key: 'Ant Design',
-      //     title: 'Ant Design',
-      //     href: 'https://ant.design',
-      //     blankTarget: true,
-      //   },
-      // ]}
     />
   );
 };

src/pages/package/BasicForm.jsx

@@ -0,0 +1,62 @@
+import React, { useState, useEffect } from 'react';
+import { Button, Checkbox, Form, Input } from 'antd';
+import { addPackage, updataPackage } from '@/services/api/package';
+
+export default (props) => {
+  const { current, onChange } = props;
+
+  const [form] = Form.useForm();
+  const [loading, setLoading] = useState(false);
+
+  const onFinish = (values) => {
+    setLoading(true);
+
+    const data = current.id ? { ...current, ...values } : values;
+    const func = current.id ? updataPackage : addPackage;
+    
+    func(data, current.id).then(res => {
+      setLoading(false);
+      onChange(res);
+    }).catch(() => {
+      setLoading(false);
+    });
+  }
+
+  useEffect(() => {
+    form.setFieldsValue({
+      name: current.name,
+      unit: current.unit,
+    });
+  }, [form, current])
+
+  return (
+    <Form
+      form={form}
+      labelCol={{ span: 6 }}
+      wrapperCol={{ span: 16 }}
+      onFinish={onFinish}
+      autoComplete="off"
+    >
+      <Form.Item
+        label="套餐名称"
+        name="name"
+        rules={[{ required: true, message: '请输入套餐名称' }]}
+      >
+        <Input placeholder='请输入套餐名称' />
+      </Form.Item>
+
+      <Form.Item
+        label="套餐单位"
+        name="unit"
+      >
+        <Input placeholder='请输入套餐单位' />
+      </Form.Item>
+
+      <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
+        <Button type="primary" htmlType="submit" loading={loading}>
+          提交
+        </Button>
+      </Form.Item>
+    </Form>
+  )
+}

src/pages/package/DishList.jsx

@@ -0,0 +1,81 @@
+import React, { useState } from 'react';
+import { List, Popconfirm, Select } from 'antd';
+
+const { Option } = Select;
+
+const Header = props => {
+  const { onChange } = props;
+  const [data, setData] = useState([]);
+  const [value, setValue] = useState();
+
+  const handleSearch = (newValue) => {
+    if (newValue) {
+      // fetch(newValue, setData);
+    } else {
+      setData([]);
+    }
+  };
+
+  const handleChange = (newValue) => {
+    setValue(newValue);
+    if (newValue) {
+      onChange(data.filter(x => x.id === newValue)[0]);
+    }
+  };
+
+  const options = data.map(d => <Option key={d.id} value={d.id}>{d.name}</Option>);
+
+  return (
+    <Select
+      style={{ width: '100%' }}
+      showSearch
+      value={value}
+      placeholder='请选择菜肴'
+      defaultActiveFirstOption={false}
+      showArrow={false}
+      filterOption={false}
+      onSearch={handleSearch}
+      onChange={handleChange}
+      notFoundContent={null}
+    >
+      {options}
+    </Select>
+  );
+}
+
+
+export default (props) => {
+  const [list, setList] = useState([]);
+
+  const onAdd = item => {
+    const origin = list.filter(x => x.id !== item.id)[0];
+    if (!origin) {
+      setList([...list, item]);
+    }
+  }
+
+  return (
+    <List
+      header={<Header onChange={onAdd} />}
+      bordered
+      dataSource={list}
+      renderItem={item => (
+        <List.Item
+          className={classNames({ active: current.id === item.id })}
+          onClick={() => setCurrent(item)}
+          actions={[
+            <Popconfirm
+              key="delete"
+              title="确认删除套餐?"
+              onConfirm={() => onDelete(item)}
+              >
+              <a href="#">删除</a>
+            </Popconfirm>
+          ]}
+        >
+          {item.name}
+        </List.Item>
+      )}
+    />
+  );
+}

src/pages/package/List.jsx

@@ -0,0 +1,129 @@
+import React, { useState, useEffect, useRef } from 'react';
+import { Row, Col, Button, List, Popconfirm, Input } from 'antd';
+import classNames from 'classnames';
+import { getPackageList, deletePackage } from '@/services/api/package';
+
+export default (props) => {
+  const { current, setCurrent } = props;
+  const [loading, setLoading] = useState(false);
+  const [hasMore, setHasMore] = useState(true);
+  const [filter, setFilter] = useState({ pageNum: 1, pageSize: 10, total: 0 });
+  const [list, setList] = useState([]);
+  const listRef = useRef();
+  listRef.current = list;
+
+  const onLoadMore = () => {
+    setFilter({
+      ...filter,
+      pageNum: filter.pageNum + 1,
+    })
+  }
+
+  const loadMore = loading || !hasMore ? null : (
+    <div
+      style={{
+        textAlign: 'center',
+        marginTop: 12,
+        height: 32,
+        lineHeight: '32px',
+      }}
+    >
+      <Button onClick={onLoadMore}>加载更多</Button>
+    </div>
+  );
+
+  const onSearch = (val) => {
+    setFilter({
+      ...filter,
+      name: val,
+      pageNum: 1,
+    })
+  }
+
+  const onDelete = (item) => {
+    setLoading(true);
+    deletePackage(item.id).then(res => {
+      setLoading(false);
+
+      const newList = listRef.current.filter(x => x.id !== item.id);
+      setList(newList);
+      if (item.id === current.id) {
+        setCurrent(newList[0] || {});
+      }
+    }).catch(() => {
+      setLoading(false);
+    });
+  };
+
+  useEffect(() => {
+    setLoading(true);
+    getPackageList(filter).then(res => {
+      setLoading(false);
+
+      const { records = [], current, total, pages } = res
+
+      if (current === 1) {
+        setList(records)
+        setCurrent((records || [])[0] || {})
+      } else {
+        setList(listRef.current.concat(records))
+      }
+
+      setHasMore(current < pages)
+    }).catch(() => {
+      setLoading(false);
+    });
+  }, [filter]);
+
+  useEffect(() => {
+    if (!current || !current.id) return;
+
+    let found = false;
+    let newList = listRef.current.map(x => {
+      if (x.id === current.id) {
+        found = true;
+        return current;
+      }
+
+      return x;
+    })
+
+    if (!found) {
+      newList = newList.concat(current);
+    }
+
+    setList(newList);
+  }, [current])
+
+  return (
+    <List
+      bordered
+      header={
+        <Input.Group compact>
+          <Input.Search allowClear placeholder="请输入筛选名称" onSearch={onSearch} style={{ width: 'calc(100% - 60px)' }} />
+          <Button type='link' onClick={() => setCurrent({})} >新增</Button>
+        </Input.Group>
+      }
+      dataSource={list}
+      loading={loading}
+      loadMore={loadMore}
+      renderItem={item => (
+        <List.Item
+          className={classNames({ active: current.id === item.id })}
+          onClick={() => setCurrent(item)}
+          actions={[
+            <Popconfirm
+              key="delete"
+              title="确认删除套餐?"
+              onConfirm={() => onDelete(item)}
+              >
+              <a href="#">删除</a>
+            </Popconfirm>
+          ]}
+        >
+          {item.name}
+        </List.Item>
+      )}
+    />
+  )
+}

src/pages/package/index.jsx

@@ -0,0 +1,30 @@
+import React, { useState } from 'react';
+import { PageContainer } from '@ant-design/pro-components';
+import { Row, Col, Card } from 'antd';
+import List from './List';
+import BasicForm from './BasicForm';
+import DishList from './DishList';
+
+import './style.less';
+
+export default (props) => {
+  const [current, setCurrent] = useState({});
+
+  return (
+    <PageContainer>
+      <Card>
+        <Row gutter={100}>
+          <Col span={8}>
+            <List current={current} setCurrent={setCurrent}/>
+          </Col>
+          <Col span={8}>
+            <BasicForm current={current} onChange={it => setCurrent(it)} />
+            <div style={{ marginTop: '100px' }}>
+              <DishList />
+            </div>
+          </Col>
+        </Row>
+      </Card>
+    </PageContainer>
+  )
+}

src/pages/package/list/index.jsx

@@ -1,115 +0,0 @@
-import { getPackageList, addPackage, updataPackage } from '@/services/api/package';
-import { queryTable } from '@/utils/request';
-import { PageContainer, ProTable } from '@ant-design/pro-components';
-import { history } from '@umijs/max';
-import { Button, message, Popconfirm, EditForm } from 'antd';
-import { useRef, useState } from 'react';
-
-const PackageList = (props) => {
-  console.log(props, '===');
-  const [showDetail, setShowDetail] = useState(false);
-  const [activeKey, setActiveKey] = useState('');
-  const actionRef = useRef();
-
-  const updata = (row) => {
-    if (row.id) {
-      updataPackage(row.id, { state: row.state === '1' ? '2' : '1' }).then((res) => {
-        message.success('修改成功');
-        actionRef.current.reload();
-      });
-    }
-  };
-
-  const handleDelete = (id) => {
-    if (id) {
-      deleteBanner(id).then((res) => {
-        message.success('删除成功');
-        actionRef.current.reload();
-      });
-    }
-  };
-
-  const columns = [
-    {
-      title: '套餐名称',
-      dataIndex: 'name',
-    },
-
-    {
-      title: '套餐单位',
-      dataIndex: 'unit',
-    },
-    {
-      title: '包含菜肴(份)',
-      dataIndex: 'itemId.amount',
-    },
-    {
-      title: '包含食材(种)',
-      dataIndex: 'itemId.amount',
-    },
-    {
-      title: '操作',
-      valueType: 'option',
-      width: 200,
-      render: (_, record) => [
-        <Button
-          key={1}
-          style={{ padding: 0 }}
-          type="link"
-          onClick={() => {
-            updata(record);
-          }}
-        >
-          {record.state === '1' ? '下架' : '上架'}
-        </Button>,
-        <Button
-          key={2}
-          style={{ padding: 0 }}
-          type="link"
-          onClick={() => {
-            console.log(record, ']]');
-            history.push(`/rotationChart/add?id=${record.id}`);
-          }}
-        >
-          编辑
-        </Button>,
-
-        <Popconfirm
-          key={3}
-          title="您是否确认删除 ?"
-          onConfirm={() => handleDelete(record.id)}
-          okText="确定"
-          cancelText="取消"
-        >
-          {/* manualPush */}
-          <Button style={{ padding: 0 }} type="link">
-            删除
-          </Button>
-        </Popconfirm>,
-      ],
-    },
-  ];
-
-  return (
-    <PageContainer>
-      <ProTable
-        search={false}
-        actionRef={actionRef}
-        rowKey="id"
-        toolBarRender={() => [
-          <Button
-            key="2"
-            type="primary"
-            onClick={() => { setCurrent({}); setVisible(true); }}
-          >
-            新增
-          </Button>,
-        ]}
-        // request={queryTable(getDishList)}
-        columns={columns}
-      />
-    </PageContainer>
-  );
-};
-
-export default PackageList;

src/pages/package/style.less

@@ -0,0 +1,6 @@
+
+.ant-list-item {
+  &.active {
+    background-color: #e6f7ff;
+  }
+}

src/services/api/package.js

@@ -21,4 +21,11 @@ export const addPackage = (data) => request('/package', { method: 'post', data }
  * @param {*} data
  * @returns
  */
-export const updataPackage = (id, data) => request(`/package/${id}`, { method: 'put', data });
+export const updataPackage = (data, id) => request(`/package/${id}`, { method: 'put', data });
+
+/**
+ * 删除
+ *  @param {*} id
+ * @returns
+ */
+export const deletePackage = id => request(`/package/${id}`, { method: 'delete' });