fix(staff)

src/components/layout/layout.tsx

@@ -3,12 +3,21 @@ import "./layout.less";
 import { inject, observer } from "mobx-react";
 import { Store } from "antd/es/form/interface";
 import { useEffect, useState } from "react";
-import { Avatar, Breadcrumb, Layout, Menu, MenuProps, theme } from "antd";
+import {
+  Avatar,
+  Breadcrumb,
+  Layout,
+  Menu,
+  MenuProps,
+  theme,
+  Image,
+} from "antd";
 import { UserOutlined } from "@ant-design/icons";
 import Sider from "antd/es/layout/Sider";
 import { items } from "./layout_config";
 import { Dropdown } from "antd/lib";
 import { Outlet, useNavigate } from "react-router";
+import logo from "@/static/favicon.png";
 const LayOut = (props: Store) => {
   const { usrStore } = props;
   const [collapsed, setCollapsed] = useState(false);
@@ -45,7 +54,9 @@ const LayOut = (props: Store) => {
   return (
     <Layout>
       <Header style={headStyle}>
-        <div style={logoStyle}>logo</div>
+        <div style={logoStyle}>
+          {/* <Image src={logo} /> */}
+        </div>
         <Dropdown menu={{ items }}>
           <Avatar icon={<UserOutlined />} />
         </Dropdown>

src/components/layout/layout_config.tsx

@@ -34,6 +34,7 @@ export const items: ItemType<MenuItemType>[] = [
       { key: "/sku/cat", label: `商品分类` },
       { key: "/sku/spec", label: `商品规格` },
       { key: "/sku/brand", label: `商品品牌` },
+      { key: "/sku/tag", label: `标签管理` },
     ],
   },
   {

src/pages/sku/cat/config.tsx

@@ -0,0 +1,40 @@
+import { FormType } from "@/components/form/interface";
+import { UserDataType } from "@/model/userModel";
+import { ColumnsType } from "antd/lib/table";
+export const formConfig = [
+  {
+    type: FormType.input,
+    label: "商品分类名称",
+    name: "name",
+    value: "",
+    rules: [{ required: true, message: "商品分类名称不能为空!" }],
+  },
+  {
+    type: FormType.input,
+    label: "描述",
+    name: "remark",
+    value: "",
+  },
+  {
+    type: FormType.inputNumber,
+    label: "排序",
+    name: "sort",
+    value: "1",
+  },
+];
+
+export const columns: ColumnsType<UserDataType> = [
+  {
+    title: "商品分类名称",
+    dataIndex: "name",
+    fixed: "left",
+  },
+  {
+    title: "描述",
+    dataIndex: "remark",
+  },
+  {
+    title: "排序",
+    dataIndex: "sort",
+  },
+];

src/pages/sku/cat/index.tsx

@@ -1,9 +1,76 @@
-const Cat = () => {
+import React from "react";
+import { Button, Space, Modal, FormInstance } from "antd";
+import { Store } from "antd/lib/form/interface";
+import { inject, observer } from "mobx-react";
+import { useEffect, useState } from "react";
+import { columns, formConfig } from "./config";
+import BTable from "@/components/b_table";
+import SimpleForm from "@/components/form/simple_form";
+const SkuCat = (props: Store) => {
+  const { skuCatStore } = props;
+  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
+  const formRef = React.useRef<FormInstance>(null);
+  const [userId, setId] = useState<Number | null>(null);
+  const [record, setRecord] = useState<any>(null);
+
+  // 获取列表数据
+  useEffect(() => {
+    skuCatStore.getlist();
+  }, [skuCatStore]);
+
   return (
-    <div>
+    <div className="contentBox">
-     cat
+      <Space direction="vertical" size="middle" style={{ display: "flex" }}>
+        <Button type="default" onClick={() => setIsModalOpen(true)}>
+          添加
+        </Button>
+        <BTable
+          store={skuCatStore}
+          scroll={{ x: "max-content" }}
+          columns={columns}
+          dataSource={skuCatStore.list}
+          deleteCallback={(record) => {
+            skuCatStore.deleteItem(record);
+          }}
+          editCallback={(record) => {
+            setIsModalOpen(true);
+            formRef.current?.setFieldsValue(record);
+            setRecord(record);
+            setId(record.id);
+          }}
+        />
+
+        <Modal
+          title={!userId ? "添加" : "编辑"}
+          width={800}
+          open={isModalOpen}
+          afterClose={() => formRef.current?.resetFields()}
+          onOk={() => formRef.current?.submit()}
+          okText="确定"
+          cancelText="取消"
+          onCancel={() => {
+            setId(null);
+            setRecord(null);
+            setIsModalOpen(false);
+          }}
+        >
+          <SimpleForm
+            formName={"tag_form"}
+            formRef={formRef}
+            colProps={25}
+            onFinish={() => {
+              skuCatStore.add(formRef.current?.getFieldsValue())
+              setIsModalOpen(false);
+            }}
+            createCallback={() => {
+              formRef.current?.setFieldsValue(record);
+            }}
+            formDatas={formConfig as any}
+          ></SimpleForm>
+        </Modal>
+      </Space>
     </div>
   );
 };
 
-export default Cat;
+export default inject("skuCatStore")(observer(SkuCat));

src/pages/sku/sku/config.tsx

@@ -0,0 +1,58 @@
+import { FormType } from "@/components/form/interface";
+import { UserDataType } from "@/model/userModel";
+import { ColumnsType } from "antd/lib/table";
+export const formConfig = [
+  {
+    type: FormType.input,
+    label: "商品名称",
+    name: "tag_name",
+    value: "",
+    rules: [{ required: true, message: "标签名称不能为空!" }],
+  },
+  {
+    type: FormType.input,
+    label: "标签描述",
+    name: "tag_desc",
+    value: "",
+    rules: [{ required: true, message: "城市编码不能为空" }],
+  },
+  {
+    type: FormType.input,
+    label: "标签排序",
+    name: "tag_sort",
+    value: "1",
+    rules: [{ required: true, message: "标签排序不能为空" }],
+  },
+];
+
+export const columns: ColumnsType<UserDataType> = [
+  {
+    title: "商品名称",
+    dataIndex: "sku_name",
+    fixed: "left",
+  },
+  {
+    title: "库存",
+    dataIndex: "sku_stock",
+  },
+  {
+    title: "商品分类",
+    dataIndex: "sku_cat_identity",
+  },
+  {
+    title: "品牌",
+    dataIndex: "sku_brand_identity",
+  },
+  {
+    title: "缩略图",
+    dataIndex: "sku_thumb",
+  },
+  {
+    title: "商品介绍",
+    dataIndex: "sku_desc",
+  },
+  {
+    title: "所属城市",
+    dataIndex: "city_identity",
+  },
+];

src/pages/sku/sku/index.tsx

@@ -0,0 +1,76 @@
+import React from "react";
+import { Button, Space, Modal, FormInstance } from "antd";
+import { Store } from "antd/lib/form/interface";
+import { inject, observer } from "mobx-react";
+import { useEffect, useState } from "react";
+import { columns, formConfig } from "./config";
+import BTable from "@/components/b_table";
+import SimpleForm from "@/components/form/simple_form";
+const Sku = (props: Store) => {
+  const { skuStore } = props;
+  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
+  const formRef = React.useRef<FormInstance>(null);
+  const [userId, setId] = useState<Number | null>(null);
+  const [record, setRecord] = useState<any>(null);
+
+  // 获取列表数据
+  useEffect(() => {
+    skuStore.getlist();
+  }, [skuStore]);
+
+  return (
+    <div className="contentBox">
+      <Space direction="vertical" size="middle" style={{ display: "flex" }}>
+        <Button type="default" onClick={() => setIsModalOpen(true)}>
+          添加
+        </Button>
+        <BTable
+          store={skuStore}
+          scroll={{ x: "max-content" }}
+          columns={columns}
+          dataSource={skuStore.list}
+          deleteCallback={(record) => {
+            skuStore.deleteItem(record);
+          }}
+          editCallback={(record) => {
+            setIsModalOpen(true);
+            formRef.current?.setFieldsValue(record);
+            setRecord(record);
+            setId(record.id);
+          }}
+        />
+
+        <Modal
+          title={!userId ? "添加" : "编辑"}
+          width={800}
+          open={isModalOpen}
+          afterClose={() => formRef.current?.resetFields()}
+          onOk={() => formRef.current?.submit()}
+          okText="确定"
+          cancelText="取消"
+          onCancel={() => {
+            setId(null);
+            setRecord(null);
+            setIsModalOpen(false);
+          }}
+        >
+          <SimpleForm
+            formName={"tag_form"}
+            formRef={formRef}
+            colProps={25}
+            onFinish={() => {
+              skuStore.add(formRef.current?.getFieldsValue())
+              setIsModalOpen(false);
+            }}
+            createCallback={() => {
+              formRef.current?.setFieldsValue(record);
+            }}
+            formDatas={formConfig as any}
+          ></SimpleForm>
+        </Modal>
+      </Space>
+    </div>
+  );
+};
+
+export default inject("skuStore")(observer(Sku));

src/pages/sku/spec/config.tsx

@@ -0,0 +1,40 @@
+import { FormType } from "@/components/form/interface";
+import { UserDataType } from "@/model/userModel";
+import { ColumnsType } from "antd/lib/table";
+export const formConfig = [
+  {
+    type: FormType.input,
+    label: "规格名称",
+    name: "spec_name",
+    value: "",
+    rules: [{ required: true, message: "规格名称不能为空!" }],
+  },
+  {
+    type: FormType.input,
+    label: "规格描述",
+    name: "spec_remark",
+    value: "",
+  },
+  {
+    type: FormType.inputNumber,
+    label: "规格排序",
+    name: "spec_sort",
+    value: "1",
+  },
+];
+
+export const columns: ColumnsType<UserDataType> = [
+  {
+    title: "规格名称",
+    dataIndex: "spec_name",
+    fixed: "left",
+  },
+  {
+    title: "规格描述",
+    dataIndex: "spec_remark",
+  },
+  {
+    title: "规格排序",
+    dataIndex: "spec_sort",
+  },
+];

src/pages/sku/spec/index.tsx

@@ -1,9 +1,76 @@
-const Spec = () => {
+import React from "react";
+import { Button, Space, Modal, FormInstance } from "antd";
+import { Store } from "antd/lib/form/interface";
+import { inject, observer } from "mobx-react";
+import { useEffect, useState } from "react";
+import { columns, formConfig } from "./config";
+import BTable from "@/components/b_table";
+import SimpleForm from "@/components/form/simple_form";
+const SkuSpec = (props: Store) => {
+  const { skuSpecStore } = props;
+  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
+  const formRef = React.useRef<FormInstance>(null);
+  const [userId, setId] = useState<Number | null>(null);
+  const [record, setRecord] = useState<any>(null);
+
+  // 获取列表数据
+  useEffect(() => {
+    skuSpecStore.getlist();
+  }, [skuSpecStore]);
+
   return (
-    <div>
+    <div className="contentBox">
-     cat
+      <Space direction="vertical" size="middle" style={{ display: "flex" }}>
+        <Button type="default" onClick={() => setIsModalOpen(true)}>
+          添加
+        </Button>
+        <BTable
+          store={skuSpecStore}
+          scroll={{ x: "max-content" }}
+          columns={columns}
+          dataSource={skuSpecStore.list}
+          deleteCallback={(record) => {
+            skuSpecStore.deleteItem(record);
+          }}
+          editCallback={(record) => {
+            setIsModalOpen(true);
+            formRef.current?.setFieldsValue(record);
+            setRecord(record);
+            setId(record.id);
+          }}
+        />
+
+        <Modal
+          title={!userId ? "添加" : "编辑"}
+          width={800}
+          open={isModalOpen}
+          afterClose={() => formRef.current?.resetFields()}
+          onOk={() => formRef.current?.submit()}
+          okText="确定"
+          cancelText="取消"
+          onCancel={() => {
+            setId(null);
+            setRecord(null);
+            setIsModalOpen(false);
+          }}
+        >
+          <SimpleForm
+            formName={"tag_form"}
+            formRef={formRef}
+            colProps={25}
+            onFinish={() => {
+              skuSpecStore.add(formRef.current?.getFieldsValue())
+              setIsModalOpen(false);
+            }}
+            createCallback={() => {
+              formRef.current?.setFieldsValue(record);
+            }}
+            formDatas={formConfig as any}
+          ></SimpleForm>
+        </Modal>
+      </Space>
     </div>
   );
 };
 
-export default Spec;
+export default inject("skuSpecStore")(observer(SkuSpec));

src/pages/sku/tag/config.tsx

@@ -0,0 +1,42 @@
+import { FormType } from "@/components/form/interface";
+import { UserDataType } from "@/model/userModel";
+import { ColumnsType } from "antd/lib/table";
+export const formConfig = [
+  {
+    type: FormType.input,
+    label: "标签名称",
+    name: "tag_name",
+    value: "",
+    rules: [{ required: true, message: "标签名称不能为空!" }],
+  },
+  {
+    type: FormType.input,
+    label: "标签描述",
+    name: "tag_desc",
+    value: "",
+    rules: [{ required: true, message: "城市编码不能为空" }],
+  },
+  {
+    type: FormType.input,
+    label: "标签排序",
+    name: "tag_sort",
+    value: "1",
+    rules: [{ required: true, message: "标签排序不能为空" }],
+  },
+];
+
+export const columns: ColumnsType<UserDataType> = [
+  {
+    title: "标签名称",
+    dataIndex: "tag_name",
+    fixed: "left",
+  },
+  {
+    title: "标签描述",
+    dataIndex: "tag_desc",
+  },
+  {
+    title: "标签排序",
+    dataIndex: "tag_sort",
+  },
+];

src/pages/sku/tag/index.tsx

@@ -0,0 +1,76 @@
+import React from "react";
+import { Button, Space, Modal, FormInstance } from "antd";
+import { Store } from "antd/lib/form/interface";
+import { inject, observer } from "mobx-react";
+import { useEffect, useState } from "react";
+import { columns, formConfig } from "./config";
+import BTable from "@/components/b_table";
+import SimpleForm from "@/components/form/simple_form";
+const Tag = (props: Store) => {
+  const { tagStore } = props;
+  const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
+  const formRef = React.useRef<FormInstance>(null);
+  const [userId, setId] = useState<Number | null>(null);
+  const [record, setRecord] = useState<any>(null);
+
+  // 获取列表数据
+  useEffect(() => {
+    tagStore.getlist();
+  }, [tagStore]);
+
+  return (
+    <div className="contentBox">
+      <Space direction="vertical" size="middle" style={{ display: "flex" }}>
+        <Button type="default" onClick={() => setIsModalOpen(true)}>
+          添加
+        </Button>
+        <BTable
+          store={tagStore}
+          scroll={{ x: "max-content" }}
+          columns={columns}
+          dataSource={tagStore.list}
+          deleteCallback={(record) => {
+            tagStore.deleteItem(record);
+          }}
+          editCallback={(record) => {
+            setIsModalOpen(true);
+            formRef.current?.setFieldsValue(record);
+            setRecord(record);
+            setId(record.id);
+          }}
+        />
+
+        <Modal
+          title={!userId ? "添加" : "编辑"}
+          width={800}
+          open={isModalOpen}
+          afterClose={() => formRef.current?.resetFields()}
+          onOk={() => formRef.current?.submit()}
+          okText="确定"
+          cancelText="取消"
+          onCancel={() => {
+            setId(null);
+            setRecord(null);
+            setIsModalOpen(false);
+          }}
+        >
+          <SimpleForm
+            formName={"tag_form"}
+            formRef={formRef}
+            colProps={25}
+            onFinish={() => {
+              tagStore.add(formRef.current?.getFieldsValue())
+              setIsModalOpen(false);
+            }}
+            createCallback={() => {
+              formRef.current?.setFieldsValue(record);
+            }}
+            formDatas={formConfig as any}
+          ></SimpleForm>
+        </Modal>
+      </Space>
+    </div>
+  );
+};
+
+export default inject("tagStore")(observer(Tag));

src/router/routers/sku_router.tsx

@@ -1,4 +1,3 @@
-import Menu from "@/pages/rbac/menu";
 export const sku = [
   {
     path: "/sku",
@@ -9,7 +8,9 @@ export const sku = [
       {
         path: "/sku/list",
         index: true,
-        element: <Menu />,
+        lazy: async () => ({
+          Component: (await import("@/pages/sku/sku")).default,
+        }),
       },
       {
         path: "/sku/cat",
@@ -32,6 +33,13 @@ export const sku = [
           Component: (await import("@/pages/sku/brand")).default,
         }),
       },
+      {
+        path: "/sku/tag",
+        index: true,
+        lazy: async () => ({
+          Component: (await import("@/pages/sku/tag")).default,
+        }),
+      },
     ],
   },
 ];

src/service/config.ts

@@ -15,14 +15,14 @@ class CityConfig {
 }
 
 
-class Skuconfig {
+class SkuConfig {
     static ADD: string = "/sku";
     static EDIT: string = "/sku";
     static LIST: string = "/sku/list";
     static DELETE: string = "/sku";
 }
 
-class SkuCatconfig {
+class SkuCatConfig {
     static ADD: string = "/skuCat";
     static EDIT: string = "/skuCat";
     static LIST: string = "/skuCat/list";
@@ -36,4 +36,17 @@ class Orderconfig {
     static DELETE: string = "/order";
 }
 
-export { UserConfig, CityConfig, SkuCatconfig, Skuconfig, Orderconfig };
+class TagConfig {
+    static ADD: string = "/tag";
+    static EDIT: string = "/tag";
+    static LIST: string = "/tag/list";
+    static DELETE: string = "/tag";
+}
+
+class SpecConfig {
+    static ADD: string = "/skuSpec";
+    static EDIT: string = "/skuSpec";
+    static LIST: string = "/skuSpec/list";
+    static DELETE: string = "/skuSpec";
+}
+export { UserConfig, CityConfig, SkuCatConfig, SkuConfig, Orderconfig, TagConfig, SpecConfig };

src/store/index.ts

@@ -1,11 +1,19 @@
 import usrStore from '@/store/user'
 import cityStore from '@/store/city'
 import orderStore from './order';
+import tagStore from './tag';
+import skuStore from './sku';
+import skuCatStore from './skuCat';
+import skuSpecStore from './skuSpec';
 
 const store = {
     usrStore,
     cityStore,
-    orderStore
+    orderStore,
+    tagStore,
+    skuStore,
+    skuCatStore,
+    skuSpecStore
 };
 
 export default store;

src/store/sku.ts

@@ -0,0 +1,13 @@
+import { makeObservable } from "mobx";
+import BaseStore from "./baseStore";
+import { UserDataType } from "@/model/userModel";
+import { SkuConfig } from "@/service/config";
+
+class SkuStore extends BaseStore<UserDataType> {
+    constructor() {
+        super(SkuConfig)
+        makeObservable(this, {})
+    }
+}
+const skuStore = new SkuStore();
+export default skuStore;

src/store/skuCat.ts

@@ -0,0 +1,13 @@
+import { makeObservable } from "mobx";
+import BaseStore from "./baseStore";
+import { UserDataType } from "@/model/userModel";
+import { SkuCatConfig } from "@/service/config";
+
+class SkuCatStore extends BaseStore<UserDataType> {
+    constructor() {
+        super(SkuCatConfig)
+        makeObservable(this, {})
+    }
+}
+const skuCatStore = new SkuCatStore();
+export default skuCatStore;

src/store/skuSpec.ts

@@ -0,0 +1,13 @@
+import { makeObservable } from "mobx";
+import BaseStore from "./baseStore";
+import { UserDataType } from "@/model/userModel";
+import { SpecConfig } from "@/service/config";
+
+class SkuSpecStore extends BaseStore<UserDataType> {
+    constructor() {
+        super(SpecConfig)
+        makeObservable(this, {})
+    }
+}
+const skuSpecStore = new SkuSpecStore();
+export default skuSpecStore;

src/store/tag.ts

@@ -0,0 +1,13 @@
+import { makeObservable } from "mobx";
+import BaseStore from "./baseStore";
+import { UserDataType } from "@/model/userModel";
+import { TagConfig } from "@/service/config";
+
+class TagStore extends BaseStore<UserDataType> {
+    constructor() {
+        super(TagConfig)
+        makeObservable(this, {})
+    }
+}
+const tagStore = new TagStore();
+export default tagStore;