shaogen1995 2 tahun lalu
induk
melakukan
9c93156bb2

+ 109 - 0
houtai/package-lock.json

@@ -22,6 +22,8 @@
         "echarts": "^5.4.0",
         "echarts": "^5.4.0",
         "js-base64": "^3.7.3",
         "js-base64": "^3.7.3",
         "react": "^18.2.0",
         "react": "^18.2.0",
+        "react-dnd": "^16.0.1",
+        "react-dnd-html5-backend": "^16.0.1",
         "react-dom": "^18.2.0",
         "react-dom": "^18.2.0",
         "react-lazyimg-component": "^1.0.1",
         "react-lazyimg-component": "^1.0.1",
         "react-redux": "^8.0.4",
         "react-redux": "^8.0.4",
@@ -3165,6 +3167,21 @@
         "react-dom": ">=16.9.0"
         "react-dom": ">=16.9.0"
       }
       }
     },
     },
+    "node_modules/@react-dnd/asap": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmmirror.com/@react-dnd/asap/-/asap-5.0.2.tgz",
+      "integrity": "sha512-WLyfoHvxhs0V9U+GTsGilGgf2QsPl6ZZ44fnv0/b8T3nQyvzxidxsg/ZltbWssbsRDlYW8UKSQMTGotuTotZ6A=="
+    },
+    "node_modules/@react-dnd/invariant": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmmirror.com/@react-dnd/invariant/-/invariant-4.0.2.tgz",
+      "integrity": "sha512-xKCTqAK/FFauOM9Ta2pswIyT3D8AQlfrYdOi/toTPEhqCuAs1v5tcJ3Y08Izh1cJ5Jchwy9SeAXmMg6zrKs2iw=="
+    },
+    "node_modules/@react-dnd/shallowequal": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmmirror.com/@react-dnd/shallowequal/-/shallowequal-4.0.2.tgz",
+      "integrity": "sha512-/RVXdLvJxLg4QKvMoM5WlwNR9ViO9z8B/qPcc+C0Sa/teJY7QG7kJ441DwzOjMYEY7GmU4dj5EcGHIkKZiQZCA=="
+    },
     "node_modules/@rollup/plugin-babel": {
     "node_modules/@rollup/plugin-babel": {
       "version": "5.3.1",
       "version": "5.3.1",
       "resolved": "https://registry.npmmirror.com/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
       "resolved": "https://registry.npmmirror.com/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@@ -6336,6 +6353,16 @@
       "resolved": "https://registry.npmmirror.com/dlv/-/dlv-1.1.3.tgz",
       "resolved": "https://registry.npmmirror.com/dlv/-/dlv-1.1.3.tgz",
       "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA=="
       "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA=="
     },
     },
+    "node_modules/dnd-core": {
+      "version": "16.0.1",
+      "resolved": "https://registry.npmmirror.com/dnd-core/-/dnd-core-16.0.1.tgz",
+      "integrity": "sha512-HK294sl7tbw6F6IeuK16YSBUoorvHpY8RHO+9yFfaJyCDVb6n7PRcezrOEOa2SBCqiYpemh5Jx20ZcjKdFAVng==",
+      "dependencies": {
+        "@react-dnd/asap": "^5.0.1",
+        "@react-dnd/invariant": "^4.0.1",
+        "redux": "^4.2.0"
+      }
+    },
     "node_modules/dns-equal": {
     "node_modules/dns-equal": {
       "version": "1.0.0",
       "version": "1.0.0",
       "resolved": "https://registry.npmmirror.com/dns-equal/-/dns-equal-1.0.0.tgz",
       "resolved": "https://registry.npmmirror.com/dns-equal/-/dns-equal-1.0.0.tgz",
@@ -14062,6 +14089,43 @@
         "node": ">=8"
         "node": ">=8"
       }
       }
     },
     },
+    "node_modules/react-dnd": {
+      "version": "16.0.1",
+      "resolved": "https://registry.npmmirror.com/react-dnd/-/react-dnd-16.0.1.tgz",
+      "integrity": "sha512-QeoM/i73HHu2XF9aKksIUuamHPDvRglEwdHL4jsp784BgUuWcg6mzfxT0QDdQz8Wj0qyRKx2eMg8iZtWvU4E2Q==",
+      "dependencies": {
+        "@react-dnd/invariant": "^4.0.1",
+        "@react-dnd/shallowequal": "^4.0.1",
+        "dnd-core": "^16.0.1",
+        "fast-deep-equal": "^3.1.3",
+        "hoist-non-react-statics": "^3.3.2"
+      },
+      "peerDependencies": {
+        "@types/hoist-non-react-statics": ">= 3.3.1",
+        "@types/node": ">= 12",
+        "@types/react": ">= 16",
+        "react": ">= 16.14"
+      },
+      "peerDependenciesMeta": {
+        "@types/hoist-non-react-statics": {
+          "optional": true
+        },
+        "@types/node": {
+          "optional": true
+        },
+        "@types/react": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/react-dnd-html5-backend": {
+      "version": "16.0.1",
+      "resolved": "https://registry.npmmirror.com/react-dnd-html5-backend/-/react-dnd-html5-backend-16.0.1.tgz",
+      "integrity": "sha512-Wu3dw5aDJmOGw8WjH1I1/yTH+vlXEL4vmjk5p+MHxP8HuHJS1lAGeIdG/hze1AvNeXWo/JgULV87LyQOr+r5jw==",
+      "dependencies": {
+        "dnd-core": "^16.0.1"
+      }
+    },
     "node_modules/react-dom": {
     "node_modules/react-dom": {
       "version": "18.2.0",
       "version": "18.2.0",
       "resolved": "https://registry.npmmirror.com/react-dom/-/react-dom-18.2.0.tgz",
       "resolved": "https://registry.npmmirror.com/react-dom/-/react-dom-18.2.0.tgz",
@@ -19148,6 +19212,21 @@
         "rc-util": "^5.27.1"
         "rc-util": "^5.27.1"
       }
       }
     },
     },
+    "@react-dnd/asap": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmmirror.com/@react-dnd/asap/-/asap-5.0.2.tgz",
+      "integrity": "sha512-WLyfoHvxhs0V9U+GTsGilGgf2QsPl6ZZ44fnv0/b8T3nQyvzxidxsg/ZltbWssbsRDlYW8UKSQMTGotuTotZ6A=="
+    },
+    "@react-dnd/invariant": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmmirror.com/@react-dnd/invariant/-/invariant-4.0.2.tgz",
+      "integrity": "sha512-xKCTqAK/FFauOM9Ta2pswIyT3D8AQlfrYdOi/toTPEhqCuAs1v5tcJ3Y08Izh1cJ5Jchwy9SeAXmMg6zrKs2iw=="
+    },
+    "@react-dnd/shallowequal": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmmirror.com/@react-dnd/shallowequal/-/shallowequal-4.0.2.tgz",
+      "integrity": "sha512-/RVXdLvJxLg4QKvMoM5WlwNR9ViO9z8B/qPcc+C0Sa/teJY7QG7kJ441DwzOjMYEY7GmU4dj5EcGHIkKZiQZCA=="
+    },
     "@rollup/plugin-babel": {
     "@rollup/plugin-babel": {
       "version": "5.3.1",
       "version": "5.3.1",
       "resolved": "https://registry.npmmirror.com/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
       "resolved": "https://registry.npmmirror.com/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@@ -21716,6 +21795,16 @@
       "resolved": "https://registry.npmmirror.com/dlv/-/dlv-1.1.3.tgz",
       "resolved": "https://registry.npmmirror.com/dlv/-/dlv-1.1.3.tgz",
       "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA=="
       "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA=="
     },
     },
+    "dnd-core": {
+      "version": "16.0.1",
+      "resolved": "https://registry.npmmirror.com/dnd-core/-/dnd-core-16.0.1.tgz",
+      "integrity": "sha512-HK294sl7tbw6F6IeuK16YSBUoorvHpY8RHO+9yFfaJyCDVb6n7PRcezrOEOa2SBCqiYpemh5Jx20ZcjKdFAVng==",
+      "requires": {
+        "@react-dnd/asap": "^5.0.1",
+        "@react-dnd/invariant": "^4.0.1",
+        "redux": "^4.2.0"
+      }
+    },
     "dns-equal": {
     "dns-equal": {
       "version": "1.0.0",
       "version": "1.0.0",
       "resolved": "https://registry.npmmirror.com/dns-equal/-/dns-equal-1.0.0.tgz",
       "resolved": "https://registry.npmmirror.com/dns-equal/-/dns-equal-1.0.0.tgz",
@@ -27530,6 +27619,26 @@
         }
         }
       }
       }
     },
     },
+    "react-dnd": {
+      "version": "16.0.1",
+      "resolved": "https://registry.npmmirror.com/react-dnd/-/react-dnd-16.0.1.tgz",
+      "integrity": "sha512-QeoM/i73HHu2XF9aKksIUuamHPDvRglEwdHL4jsp784BgUuWcg6mzfxT0QDdQz8Wj0qyRKx2eMg8iZtWvU4E2Q==",
+      "requires": {
+        "@react-dnd/invariant": "^4.0.1",
+        "@react-dnd/shallowequal": "^4.0.1",
+        "dnd-core": "^16.0.1",
+        "fast-deep-equal": "^3.1.3",
+        "hoist-non-react-statics": "^3.3.2"
+      }
+    },
+    "react-dnd-html5-backend": {
+      "version": "16.0.1",
+      "resolved": "https://registry.npmmirror.com/react-dnd-html5-backend/-/react-dnd-html5-backend-16.0.1.tgz",
+      "integrity": "sha512-Wu3dw5aDJmOGw8WjH1I1/yTH+vlXEL4vmjk5p+MHxP8HuHJS1lAGeIdG/hze1AvNeXWo/JgULV87LyQOr+r5jw==",
+      "requires": {
+        "dnd-core": "^16.0.1"
+      }
+    },
     "react-dom": {
     "react-dom": {
       "version": "18.2.0",
       "version": "18.2.0",
       "resolved": "https://registry.npmmirror.com/react-dom/-/react-dom-18.2.0.tgz",
       "resolved": "https://registry.npmmirror.com/react-dom/-/react-dom-18.2.0.tgz",

+ 2 - 0
houtai/package.json

@@ -17,6 +17,8 @@
     "echarts": "^5.4.0",
     "echarts": "^5.4.0",
     "js-base64": "^3.7.3",
     "js-base64": "^3.7.3",
     "react": "^18.2.0",
     "react": "^18.2.0",
+    "react-dnd": "^16.0.1",
+    "react-dnd-html5-backend": "^16.0.1",
     "react-dom": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-lazyimg-component": "^1.0.1",
     "react-lazyimg-component": "^1.0.1",
     "react-redux": "^8.0.4",
     "react-redux": "^8.0.4",

+ 49 - 0
houtai/src/pages/A2News/NewsTable/index.module.scss

@@ -0,0 +1,49 @@
+.NewsTable {
+  border-radius: 10px;
+  overflow: hidden;
+  margin-top: 20px;
+  height: calc(100% - 130px);
+  background-color: #fff;
+
+  :global {
+    .ant-table-body {
+      height: 650px;
+      overflow-y: auto !important;
+      overflow-y: overlay !important;
+
+      .ant-table-row {
+        .ant-table-cell {
+          padding: 8px;
+        }
+      }
+    }
+
+    .incoTitle {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      .hotTitleInco1 {
+        cursor: pointer;
+        width: 16px;
+        height: 16px;
+        border-radius: 50%;
+        background-color: #696969;
+        margin-left: 8px;
+        text-align: center;
+        line-height: 16px;
+        color: #fff;
+        font-size: 12px;
+      }
+    }
+
+    // 表头拖拽样式
+    .drop-over-downward td {
+      border-bottom: 2px dashed var(--themeColor) !important;
+    }
+
+    .drop-over-upward td {
+      border-top: 2px dashed var(--themeColor) !important;
+    }
+  }
+}

+ 207 - 0
houtai/src/pages/A2News/NewsTable/index.tsx

@@ -0,0 +1,207 @@
+import ImageLazy from "@/components/ImageLazy";
+import VideoLook from "@/components/VideoLook";
+import { RootState } from "@/store";
+import { NewsTableType } from "@/types";
+import { Button, Table, Tooltip } from "antd";
+import React, { useCallback, useMemo, useRef } from "react";
+import { useSelector } from "react-redux";
+import { ExclamationOutlined } from "@ant-design/icons";
+import styles from "./index.module.scss";
+
+// 表格拖动排序-----------------
+import { DndProvider, useDrag, useDrop } from "react-dnd";
+import { HTML5Backend } from "react-dnd-html5-backend";
+
+type Porps = {
+  tableType: string;
+};
+
+function NewsTable({ tableType }: Porps) {
+  // 有关表格数据
+  const results = useSelector(
+    (state: RootState) => state.newsReducer.tableInfo
+  );
+
+  const columns = useMemo(() => {
+    return [
+      {
+        title: () => (
+          <div className="incoTitle">
+            序号
+            {results.length >= 2 ? (
+              <Tooltip title="按住鼠标可拖动表格调整顺序">
+                <div className="hotTitleInco1">
+                  <ExclamationOutlined />
+                </div>
+              </Tooltip>
+            ) : null}
+          </div>
+        ),
+        width: 100,
+        render: (text: any, item: any, index: number) => index + 1,
+      },
+      {
+        title: "标题",
+        dataIndex: "title",
+      },
+      {
+        title:
+          tableType === "news"
+            ? "正文"
+            : tableType === "video"
+            ? "视频封面"
+            : "图片",
+        render: (item: NewsTableType) => {
+          if (tableType === "news") {
+            return item.txt.length > 20 ? (
+              <span style={{ cursor: "pointer" }} title={item.txt}>
+                {item.txt.substring(0, 20) + "..."}
+              </span>
+            ) : (
+              item.txt
+            );
+          } else if (tableType === "video") {
+            return (
+              <div className="tableImgAuto">
+                <VideoLook src={item.video} width={60} height={60} />
+              </div>
+            );
+          } else {
+            return (
+              <div className="tableImgAuto">
+                <ImageLazy width={60} height={60} src={item.img} />
+              </div>
+            );
+          }
+        },
+      },
+      {
+        title: "编辑时间",
+        dataIndex: "time1",
+      },
+      {
+        title: "展示状态",
+        render: (item: NewsTableType) => item.state,
+      },
+      {
+        title: "操作",
+        render: (item: NewsTableType) => (
+          <>
+            <Button size="small" type="text">
+              编辑
+            </Button>
+            <Button size="small" type="text" danger>
+              删除
+            </Button>
+          </>
+        ),
+      },
+    ];
+  }, [results.length, tableType]);
+
+  // 表格拖动排序-----------------
+  interface DraggableBodyRowProps
+    extends React.HTMLAttributes<HTMLTableRowElement> {
+    index: number;
+    moveRow: (dragIndex: number, hoverIndex: number) => void;
+  }
+
+  const type = "DraggableBodyRow";
+
+  const DraggableBodyRow = useCallback(
+    ({
+      index,
+      moveRow,
+      className,
+      style,
+      ...restProps
+    }: DraggableBodyRowProps) => {
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      const ref = useRef<HTMLTableRowElement>(null);
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      const [{ isOver, dropClassName }, drop] = useDrop({
+        accept: type,
+        collect: (monitor) => {
+          const { index: dragIndex } = monitor.getItem() || {};
+          if (dragIndex === index) {
+            return {};
+          }
+          return {
+            isOver: monitor.isOver(),
+            dropClassName:
+              dragIndex < index ? " drop-over-downward" : " drop-over-upward",
+          };
+        },
+        drop: (item: { index: number }) => {
+          moveRow(item.index, index);
+        },
+      });
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      const [, drag] = useDrag({
+        type,
+        item: { index },
+        collect: (monitor) => ({
+          isDragging: monitor.isDragging(),
+        }),
+      });
+      drop(drag(ref));
+
+      return (
+        <tr
+          ref={ref}
+          className={`${className}${isOver ? dropClassName : ""}`}
+          style={{ cursor: "move", ...style }}
+          {...restProps}
+        />
+      );
+    },
+    []
+  );
+
+  const components = {
+    body: {
+      row: DraggableBodyRow,
+    },
+  };
+
+  const moveRow = useCallback(
+    async (dragIndex: number, hoverIndex: number) => {
+      if (dragIndex === hoverIndex) return;
+      // 交互位置-之前的id
+      const beforeId = results[dragIndex].id;
+      const afterId = results[hoverIndex].id;
+      console.log("发送请求", beforeId, afterId);
+
+      // const res = await wallSortAPI(beforeId, afterId);
+
+      // if (res.code === 0) dispatch(getWallTableListAPI());
+    },
+    [results]
+  );
+
+  return (
+    <div className={styles.NewsTable}>
+      <DndProvider backend={HTML5Backend}>
+        <Table
+          scroll={{ y: 650 }}
+          dataSource={results}
+          columns={columns}
+          rowKey="id"
+          pagination={false}
+          components={components}
+          onRow={(_, index) => {
+            const attr = {
+              index,
+              moveRow,
+            };
+            return attr as React.HTMLAttributes<any>;
+          }}
+        />
+      </DndProvider>
+    </div>
+  );
+}
+
+const MemoNewsTable = React.memo(NewsTable);
+
+export default MemoNewsTable;

+ 17 - 3
houtai/src/pages/A2News/index.module.scss

@@ -1,5 +1,19 @@
-.News{
-  :global{
-    
+.News {
+  :global {
+    .newTop {
+      background-color: #fff;
+      border-radius: 10px;
+
+      .searchBox {
+        position: relative;
+        padding: 10px 20px 20px;
+        display: flex;
+        align-items: center;
+
+        .row {
+          margin-right: 50px;
+        }
+      }
+    }
   }
   }
 }
 }

+ 120 - 5
houtai/src/pages/A2News/index.tsx

@@ -1,12 +1,127 @@
-import React from "react";
+import { Button, Input, Select } from "antd";
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
 import styles from "./index.module.scss";
 import styles from "./index.module.scss";
- function News() {
-  
+import NewsTable from "./NewsTable";
+function News() {
+  // 顶部筛选的数据
+  const [tableSelect, setTableSelect] = useState({
+    type: "news",
+    name: "",
+    display: -1,
+    pageSize: 50,
+    pageNum: 1,
+  });
+
+  const buttonData = useMemo(() => {
+    return [
+      { id: 1, name: "新闻", type: "news" },
+      { id: 2, name: "视频", type: "video" },
+      { id: 3, name: "图片", type: "img" },
+    ];
+  }, []);
+
+  useEffect(() => {
+    const obj = {
+      ...tableSelect,
+      display: tableSelect.display === -1 ? null : tableSelect.display,
+    };
+    console.log("发送请求", obj);
+  }, [tableSelect]);
+
+  // 名称的输入
+  const nameTime = useRef(-1);
+  const nameChange = useCallback(
+    (e: React.ChangeEvent<HTMLInputElement>) => {
+      clearTimeout(nameTime.current);
+      nameTime.current = window.setTimeout(() => {
+        setTableSelect({
+          ...tableSelect,
+          name: e.target.value,
+          pageNum: 1,
+        });
+      }, 500);
+    },
+    [tableSelect]
+  );
+
+  // 点击重置
+  const [inputKey, setInputKey] = useState(1);
+  const resetSelectFu = useCallback(() => {
+    // 把2个输入框和时间选择器清空
+    setInputKey(Date.now());
+    setTableSelect({
+      type: tableSelect.type,
+      name: "",
+      display: -1,
+      pageSize: 50,
+      pageNum: 1,
+    });
+  }, [tableSelect.type]);
+
+  // 新增或者编辑的id
+  const [editId, setEditId] = useState(0);
+
   return (
   return (
     <div className={styles.News}>
     <div className={styles.News}>
-      <h1>News</h1>
+      <div className="newTop">
+        <div className="pageTitle">资讯管理</div>
+        <div className="searchBox">
+          <div className="row">
+            {buttonData.map((v) => (
+              <Button
+                key={v.id}
+                onClick={() => setTableSelect({ ...tableSelect, type: v.type })}
+                type={tableSelect.type === v.type ? "primary" : "default"}
+              >
+                {v.name}
+              </Button>
+            ))}
+          </div>
+          <div className="row">
+            <span>标题或正文:</span>
+            <Input
+              key={inputKey}
+              maxLength={20}
+              style={{ width: 200 }}
+              placeholder="请输入关键字"
+              allowClear
+              onChange={(e) => nameChange(e)}
+            />
+          </div>
+          <div className="row">
+            <span>展示状态:</span>
+            <Select
+              placeholder="请选择"
+              style={{ width: 100 }}
+              value={tableSelect.display}
+              onChange={(e) =>
+                setTableSelect({ ...tableSelect, display: e, pageNum: 1 })
+              }
+              options={[
+                { value: -1, label: "全部" },
+                { value: 1, label: "开启" },
+                { value: 0, label: "关闭" },
+              ]}
+            />
+          </div>
+          <div className="row">
+            <Button onClick={resetSelectFu}>重置</Button>
+            &emsp;&emsp;&emsp;&emsp;
+            <Button type="primary">新增</Button>
+          </div>
+        </div>
+      </div>
+
+      {/* 表格主体 */}
+      <NewsTable tableType={tableSelect.type} />
     </div>
     </div>
-  )
+  );
 }
 }
 
 
 const MemoNews = React.memo(News);
 const MemoNews = React.memo(News);

+ 5 - 0
houtai/src/pages/初始化组件/index.module.scss

@@ -0,0 +1,5 @@
+.AAAAA{
+  :global{
+    
+  }
+}

+ 14 - 0
houtai/src/pages/初始化组件/index.tsx

@@ -0,0 +1,14 @@
+import React from "react";
+import styles from "./index.module.scss";
+ function AAAAA() {
+  
+  return (
+    <div className={styles.AAAAA}>
+      <h1>AAAAA</h1>
+    </div>
+  )
+}
+
+const MemoAAAAA = React.memo(AAAAA);
+
+export default MemoAAAAA;

+ 15 - 0
houtai/src/store/action/A2News.ts

@@ -0,0 +1,15 @@
+import http from "@/utils/http";
+import { AppDispatch } from "..";
+
+/**
+ * 获取列表数据
+ */
+export const getGoodsListAPI = (data: any) => {
+  return async (dispatch: AppDispatch) => {
+    // const res = await http.post("cms/goods/pageList", data);
+    // dispatch({
+    //   type: "goods/getList",
+    //   payload: { list: res.data.records, total: res.data.total },
+    // });
+  };
+};

+ 44 - 0
houtai/src/store/reducer/A2News.ts

@@ -0,0 +1,44 @@
+import { NewsTableType } from "@/types";
+
+// 初始化状态
+const initState = {
+  tableInfo: [
+    {
+      id: 1,
+      title: "标题1",
+      txt: "正文666666",
+      time1: "2020-02-02 12:12",
+      state: "展示",
+      img:'/wall/img/20230209_1519270201.gif',
+      video:'/wall/video/4.mp4'
+    },
+    {
+      id: 2,
+      title: "标题2",
+      txt: "正文666666正文666666正文666666正文666666正文666666正文666666正文666666正文666666正文666666正文666666正文666666正文666666正文666666正文666666正文666666正文666666正文666666正文666666",
+      time1: "2020-02-02 12:12",
+      state: "不展示",
+    },
+    {
+      id: 3,
+      title: "标题3",
+      txt: "正文666666",
+      time1: "2020-02-02 12:12",
+      state: "展示",
+    },
+  ] as NewsTableType[],
+};
+
+// 定义 action 类型
+type NewsActionType = { type: "news/getList"; payload: NewsTableType[] };
+
+// 频道 reducer
+export default function newsReducer(state = initState, action: NewsActionType) {
+  switch (action.type) {
+    // 所有图片点击预览查看大图
+    case "news/getList":
+      return { ...state, tableInfo: action.payload };
+    default:
+      return state;
+  }
+}

+ 2 - 0
houtai/src/store/reducer/index.ts

@@ -1,5 +1,6 @@
 // 导入合并reducer的依赖
 // 导入合并reducer的依赖
 import { combineReducers } from 'redux'
 import { combineReducers } from 'redux'
+import newsReducer from './A2News'
 
 
 // 导入 登录 模块的 reducer
 // 导入 登录 模块的 reducer
 import layoutReducer from './layout'
 import layoutReducer from './layout'
@@ -7,6 +8,7 @@ import layoutReducer from './layout'
 // 合并 reducer
 // 合并 reducer
 const rootReducer = combineReducers({
 const rootReducer = combineReducers({
   layoutStore: layoutReducer,
   layoutStore: layoutReducer,
+  newsReducer:newsReducer
 })
 })
 
 
 // 默认导出
 // 默认导出

+ 1 - 1
houtai/src/store/reducer/layout.ts

@@ -1,7 +1,7 @@
 import { MessageType } from "@/utils/message";
 import { MessageType } from "@/utils/message";
 
 
 // 初始化状态
 // 初始化状态
-const initState: any = {
+const initState = {
   // 所有图片点击预览查看大图
   // 所有图片点击预览查看大图
   lookBigImg: {
   lookBigImg: {
     url: "",
     url: "",

+ 9 - 0
houtai/src/types/api/A2News.d.ts

@@ -0,0 +1,9 @@
+export type NewsTableType = {
+  id: number;
+  title: string;
+  txt: string;
+  time1: string;
+  state: string;
+  img:string
+  video:string
+};

+ 1 - 1
houtai/src/types/index.d.ts

@@ -1,2 +1,2 @@
 export * from './api/layot'
 export * from './api/layot'
-
+export * from './api/A2News'

+ 6 - 6
houtai/src/utils/http.ts

@@ -7,10 +7,10 @@ import { domShowFu, progressDomFu } from "./domShow";
 // 请求基地址
 // 请求基地址
 export const baseURL =
 export const baseURL =
   // 线下的图片地址需要加上/api/
   // 线下的图片地址需要加上/api/
-  process.env.NODE_ENV === "development"
-    ? "http://192.168.20.55:8041/api/"
-    : "";
-// process.env.NODE_ENV === "development" ? "https://xuzhouwall.4dage.com" : "";
+  // process.env.NODE_ENV === "development"
+  //   ? "http://192.168.20.55:8041/api/"
+  //   : "";
+process.env.NODE_ENV === "development" ? "https://xuzhouwall.4dage.com" : "";
 
 
 // 处理  类型“AxiosResponse<any, any>”上不存在属性“code”
 // 处理  类型“AxiosResponse<any, any>”上不存在属性“code”
 declare module "axios" {
 declare module "axios" {
@@ -23,10 +23,10 @@ declare module "axios" {
 // 创建 axios 实例
 // 创建 axios 实例
 const http = axios.create({
 const http = axios.create({
   // --------线下的地址不用加/api/
   // --------线下的地址不用加/api/
-  baseURL: baseURL,
+  // baseURL: baseURL,
 
 
   // --------打包或线上环境接口需要加上api/
   // --------打包或线上环境接口需要加上api/
-  // baseURL: baseURL + "/api/",
+  baseURL: baseURL + "/api/",
   timeout: 5000,
   timeout: 5000,
 });
 });