upp

houtai/src/pages/A1Hot/HotMap/index.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import styles from "./index.module.scss";
 import classNames from "classnames";
-import { getHotMapInfoAPI } from "@/store/action/A1Hot";
+import { getHotMapInfoAPI, getHotMapInfoNumAPI } from "@/store/action/A1Hot";
 import { HotMaoType } from "@/types";
 function HotMap() {
   // 城市名字id
@@ -10,8 +10,12 @@ function HotMap() {
   // 最大的数值
   const [maxNum, setMaxNum] = useState(0);
 
+  // 整个数据
   const [arr, setArr] = useState<HotMaoType[]>([]);
 
+  // 国内外访客
+  const [numNation, setNumNation] = useState([{ pcs: 0 }, { pcs: 0 }]);
+
   const getMapInfo = useCallback(async () => {
     const res = await getHotMapInfoAPI();
     setArr(res.data);
@@ -23,6 +27,10 @@ function HotMap() {
       });
 
     setMaxNum(maxNumRes);
+
+    // 获取国内国外访客数量
+    const res2 = await getHotMapInfoNumAPI();
+    setNumNation(res2.data);
   }, []);
 
   useEffect(() => {
@@ -97,8 +105,8 @@ function HotMap() {
       )}
       {/* 左下角的数据 */}
       <div className="leftNumBox">
-        <div>国内访客合计：22</div>
-        <div>国外访客合计：22</div>
+        <div>国内访客合计：{numNation[0].pcs}</div>
+        <div>国外访客合计：{numNation[1].pcs}</div>
       </div>
 
       <svg

houtai/src/pages/B2Goods/GoodsAdd/index.tsx

@@ -28,22 +28,38 @@ import {
   CloseOutlined,
   PlayCircleOutlined,
 } from "@ant-design/icons";
-import { goodsUploadAPI } from "@/store/action/B2Goods";
+import {
+  getGoodsInfoByIdAPI,
+  getGoodsSaveAPI,
+  goodsUploadAPI,
+  setGoodsImgBoderAPI,
+} from "@/store/action/B2Goods";
 import { baseURL } from "@/utils/http";
+import { FileListType, GoodsTableType } from "@/types";
+
 
 type Props = {
   id: number;
   closeMoalFu: () => void;
-  upListFu: () => void;
+  addListFu: () => void;
+  editListFu: () => void;
 };
 
 // 上传附件的进度条
 const UpAsyncLodingDom: any = document.querySelector("#UpAsyncLoding");
 const progressDom: any = document.querySelector("#progress");
 
-function GoodsAdd({ id, closeMoalFu, upListFu }: Props) {
+function GoodsAdd({ id, closeMoalFu, addListFu, editListFu }: Props) {
   const dispatch = useDispatch();
 
+  // 上传附件的信息
+  const [fileList, setFileList] = useState({
+    model: {} as FileListType,
+    img: [] as FileListType[],
+    audio: {} as FileListType,
+    video: {} as FileListType,
+  });
+
   // 表单的ref
   const FormBoxRef = useRef<any>({});
 
@@ -51,17 +67,37 @@ function GoodsAdd({ id, closeMoalFu, upListFu }: Props) {
   const [dirCode, setDirCode] = useState("");
 
   const getInfoInAPIFu = useCallback(async (id: number) => {
-    // const res = await getUserInfoByIdAPI(id);
-    // FormBoxRef.current.setFieldsValue(res.data);
-    console.log("是编辑，在这里发请求拿数据");
-    // setDirCode(data.dirCode!);
+    const res = await getGoodsInfoByIdAPI(id);
+    FormBoxRef.current.setFieldsValue(res.data.entity);
+    setCover(res.data.entity.thumb);
+
+    setTypeCheck(res.data.entity.type.split(","));
+
+    const data: FileListType[] = res.data.file;
+    const obj = {
+      model: {} as FileListType,
+      img: [] as FileListType[],
+      audio: {} as FileListType,
+      video: {} as FileListType,
+    };
+
+    data.forEach((v) => {
+      if (v.type === "img") obj.img.push(v);
+      else obj[v.type!] = v;
+    });
+    setFileList(obj);
+    setDirCode(res.data.entity.dirCode);
   }, []);
 
   useEffect(() => {
     if (id > 0) getInfoInAPIFu(id);
     else {
       setDirCode(Date.now() + "");
-      FormBoxRef.current.setFieldsValue({ topic: 3, display: 1, aaaaa: 0 });
+      FormBoxRef.current.setFieldsValue({
+        topic: "不展示",
+        display: 1,
+        isBarrage: 0,
+      });
     }
   }, [getInfoInAPIFu, id]);
 
@@ -124,41 +160,22 @@ function GoodsAdd({ id, closeMoalFu, upListFu }: Props) {
     ];
   }, []);
 
-  type FileListType = {
-    fileName?: string;
-    filePath?: string;
-    id?: number;
-    done?: boolean;
-  };
-
-  // 上传附件的信息
-  const [fileList, setFileList] = useState({
-    model: {} as FileListType,
-    img: [
-      {
-        id: 1,
-        fileName: "xxx",
-        filePath: "/wall/img/20230202_12193909316.jpg",
-      },
-      { id: 2, fileName: "xxx", filePath: "/wall/img/20230209_1519270201.gif" },
-    ] as FileListType[],
-    audio: {} as FileListType,
-    video: {} as FileListType,
-  });
-
   // 上传附件图片的有无边框的选择
   const upImgDoneFu = useCallback(
-    (val: boolean, id: number) => {
-      const newData = {
-        ...fileList,
-        img: fileList.img.map((v) => {
-          return {
-            ...v,
-            done: v.id === id ? val : v.done,
-          };
-        }),
-      };
-      setFileList(newData);
+    async (val: boolean, id: number) => {
+      const res = await setGoodsImgBoderAPI(id, val ? 1 : 0);
+      if (res.code === 0) {
+        const newData = {
+          ...fileList,
+          img: fileList.img.map((v) => {
+            return {
+              ...v,
+              isFrame: v.id === id ? val : v.isFrame,
+            };
+          }),
+        };
+        setFileList(newData);
+      }
     },
     [fileList]
   );
@@ -193,7 +210,7 @@ function GoodsAdd({ id, closeMoalFu, upListFu }: Props) {
 
   // 上传附件的处理函数
   const handeUpPhoto2 = useCallback(
-    (e: React.ChangeEvent<HTMLInputElement>) => {
+    async (e: React.ChangeEvent<HTMLInputElement>) => {
       if (e.target.files) {
         // 拿到files信息
         const filesInfo = e.target.files[0];
@@ -247,19 +264,19 @@ function GoodsAdd({ id, closeMoalFu, upListFu }: Props) {
 
         e.target.value = "";
 
-        // const res: any = await goodsUploadAPI(fd);
-        // if (res.code === 0) {
-        // MessageFu.success("上传成功!");
-        // if (fileOneType === "img")
-        //   setFileList({ ...fileList, img: [res.data, ...fileList.img] });
-        // else setFileList({ ...fileList, [fileOneType]: res.data });
+        const res: any = await goodsUploadAPI(fd);
 
-        // }
+        if (res.code === 0) {
+          MessageFu.success("上传成功!");
+          if (fileOneType === "img")
+            setFileList({ ...fileList, img: [res.data, ...fileList.img] });
+          else setFileList({ ...fileList, [fileOneType]: res.data });
+        }
         UpAsyncLodingDom.style.opacity = 0;
         progressDom.style.width = "0%";
       }
     },
-    [dirCode, fileOneType]
+    [dirCode, fileList, fileOneType]
   );
 
   // 附件图片的拖动
@@ -302,13 +319,53 @@ function GoodsAdd({ id, closeMoalFu, upListFu }: Props) {
   }, []);
 
   // 通过校验点击确定
-  const onFinish = useCallback(() => {
-    console.log("通过校验，点击确定");
-    setCoverCheck(true);
-    setTypeOk(true);
-    if (typeCheck.length === 0) return MessageFu.warning("有表单不符号规则!");
-    if (cover === "") return MessageFu.warning("有表单不符号规则!");
-  }, [cover, typeCheck.length]);
+  const onFinish = useCallback(
+    async (value: GoodsTableType) => {
+      console.log("通过校验，点击确定");
+      setCoverCheck(true);
+      setTypeOk(true);
+      if (typeCheck.length === 0 || cover === "" || fileCheckFu)
+        return MessageFu.warning("有表单不符号规则!");
+
+      const fileIds = [];
+      if (fileList.model.id) fileIds.push(fileList.model.id);
+      if (fileList.audio.id) fileIds.push(fileList.audio.id);
+      if (fileList.video.id) fileIds.push(fileList.video.id);
+      fileList.img.forEach((v) => {
+        if (v.id) fileIds.push(v.id);
+      });
+
+      const obj = {
+        ...value,
+        id: id > 0 ? id : null,
+        dirCode,
+        fileIds: fileIds.join(","),
+        thumb: cover,
+        type: typeCheck.join(","),
+      } as GoodsTableType;
+      const res = await getGoodsSaveAPI(obj);
+      if (res.code === 0) {
+        MessageFu.success(id > 0 ? "编辑成功!" : "新增成功!");
+        closeMoalFu();
+        if (id > 0) editListFu();
+        else addListFu();
+      }
+    },
+    [
+      typeCheck,
+      cover,
+      fileCheckFu,
+      fileList.model.id,
+      fileList.audio.id,
+      fileList.video.id,
+      fileList.img,
+      id,
+      dirCode,
+      closeMoalFu,
+      editListFu,
+      addListFu,
+    ]
+  );
 
   return (
     <div className={styles.GoodsAdd}>
@@ -395,9 +452,9 @@ function GoodsAdd({ id, closeMoalFu, upListFu }: Props) {
               placeholder="请选择"
               style={{ width: 400 }}
               options={[
-                { value: 1, label: "战争" },
-                { value: 2, label: "生活" },
-                { value: 3, label: "不展示" },
+                { value: "战争", label: "战争" },
+                { value: "生活", label: "生活" },
+                { value: "不展示", label: "不展示" },
               ]}
             />
           </Form.Item>
@@ -577,7 +634,7 @@ function GoodsAdd({ id, closeMoalFu, upListFu }: Props) {
                         <Switch
                           checkedChildren="有"
                           unCheckedChildren="无"
-                          checked={v.done}
+                          checked={v.isFrame}
                           onChange={(val) => upImgDoneFu(val, v.id!)}
                         />
                       </div>
@@ -611,7 +668,7 @@ function GoodsAdd({ id, closeMoalFu, upListFu }: Props) {
                       <br />
                     </>
                   ) : null}
-                  支持png、jpg、gif和jpeg的图片格式；最大支持20M；最多支持9张。
+                  支持png、jpg、gif和jpeg的图片格式；最大支持20M；最多支持30张。
                 </div>
               </div>
             </>
@@ -674,7 +731,7 @@ function GoodsAdd({ id, closeMoalFu, upListFu }: Props) {
             </div>
             {fileList.video.id ? (
               <div className="fileInfo">
-                <div className="upSuccTxt">{fileList.video.filePath}</div>
+                <div className="upSuccTxt">{fileList.video.fileName}</div>
                 <div
                   className="clearCover"
                   hidden={!fileList.video.filePath}
@@ -741,7 +798,7 @@ function GoodsAdd({ id, closeMoalFu, upListFu }: Props) {
 
           <Form.Item
             label="弹幕留言"
-            name="aaaaa"
+            name="isBarrage"
             rules={[{ required: true, message: "请选择弹幕留言!" }]}
           >
             <Select

houtai/src/pages/B2Goods/GoodsBarrage/index.tsx

@@ -2,23 +2,34 @@ import { Button, Modal, Popconfirm, Radio } from "antd";
 import React, { useCallback, useState } from "react";
 import classNames from "classnames";
 import "./index.css";
+import { goodsBarrageAllAPI } from "@/store/action/B2Goods";
+import { MessageFu } from "@/utils/message";
 
 type Props = {
   closeMoalFu: () => void;
+  editListFu: () => void;
 };
 
-function GoodsBarrage({ closeMoalFu }: Props) {
+function GoodsBarrage({ closeMoalFu, editListFu }: Props) {
   const [value, setValue] = useState(-1);
 
   const [check, setCheck] = useState(false);
 
   // 点击提交
-  const btnOk = useCallback(() => {
+  const btnOk = useCallback(async () => {
     if (value === -1) {
       setCheck(true);
       return;
     }
-  }, [value]);
+
+    const res = await goodsBarrageAllAPI(value);
+
+    if (res.code === 0) {
+      MessageFu.success("操作成功!");
+      closeMoalFu();
+      editListFu();
+    }
+  }, [closeMoalFu, editListFu, value]);
 
   return (
     <Modal
@@ -34,10 +45,15 @@ function GoodsBarrage({ closeMoalFu }: Props) {
         <div className="row">
           <Radio.Group onChange={(e) => setValue(e.target.value)} value={value}>
             <Radio value={1}>全部开启</Radio>
-            <Radio value={2}>全部关闭</Radio>
+            <Radio value={0}>全部关闭</Radio>
           </Radio.Group>
         </div>
-        <div className={classNames("rowTit", check&&value===-1 ? "rowTitAc" : "")}>
+        <div
+          className={classNames(
+            "rowTit",
+            check && value === -1 ? "rowTitAc" : ""
+          )}
+        >
           请选择全部开启或关闭!
         </div>
         <div className="button">

houtai/src/pages/B2Goods/GoogsDown/index.tsx

@@ -5,6 +5,9 @@ import { CheckOutlined } from "@ant-design/icons";
 import classNames from "classnames";
 import "./index.css";
 import { baseURL } from "@/utils/http";
+import { getDownImgAPI, getGoodsInfoByIdAPI } from "@/store/action/B2Goods";
+import { FileListType } from "@/types";
+import { MessageFu } from "@/utils/message";
 
 type Props = {
   id: number;
@@ -12,49 +15,24 @@ type Props = {
 };
 
 function GoogsDown({ id, closeMoalFu }: Props) {
-  // 模拟请求数据图片列表
-
-  const [imgList, setImgList] = useState([
-    {
-      id: 1,
-      filePath: "/goods/1675849099197/thumb/20230208_1738438282.jpg",
-      fileName: "xxx",
-      done: true,
-    },
-    {
-      id: 2,
-      filePath: "/goods/1675849099197/thumb/20230208_1738438282.jpg",
-      fileName: "xxx",
-      done: true,
-    },
-    {
-      id: 3,
-      filePath: "/goods/1675849099197/thumb/20230208_1738438282.jpg",
-      fileName: "xxx",
-      done: true,
-    },
-    {
-      id: 4,
-      filePath: "/goods/1675849099197/thumb/20230208_1738438282.jpg",
-      fileName: "xxx",
-      done: true,
-    },
-    {
-      id: 5,
-      filePath: "/goods/1675849099197/thumb/20230208_1738438282.jpg",
-      fileName: "xxx",
-      done: true,
-    },
-  ]);
-
   // 通过id发送请求拿数据
-  const getInfoByIdFu = useCallback(() => {
-    console.log("通过id发送请求", id);
-  }, [id]);
+  const getInfoFu = useCallback(async (id: number) => {
+    const res = await getGoodsInfoByIdAPI(id);
+    const dataRes: FileListType[] = res.data.file;
+    const data: FileListType[] = [];
+    dataRes.forEach((v) => {
+      if (v.type === "img") data.push({ ...v, done: true });
+    });
+    setImgList(data);
+  }, []);
 
   useEffect(() => {
-    getInfoByIdFu();
-  }, [getInfoByIdFu]);
+    getInfoFu(id);
+  }, [getInfoFu, id]);
+
+  // 模拟请求数据图片列表
+
+  const [imgList, setImgList] = useState<FileListType[]>([]);
 
   // 选中图片
   const selectImgFu = useCallback(
@@ -71,29 +49,35 @@ function GoogsDown({ id, closeMoalFu }: Props) {
   );
 
   // 分辨率
-  const [imgDpi, setImgDpi] = useState(1);
+  const [isScale, setIsScale] = useState(0);
 
   // 水印
-  const [imgWater, setImgWater] = useState(1);
+  const [isMark, setIsMark] = useState(0);
 
   // 点击下载
-  const downImgFu = useCallback(() => {
-    const imgAcList = imgList.filter((v) => v.done);
+  const downImgFu = useCallback(async () => {
+    const fileIds = imgList
+      .filter((v) => v.done)
+      .map((v) => v.id)
+      .join(",");
 
-    // 手动打开loding
-    // dispatch({ type: "login/asyncLoding", payload: true });
-
-    imgAcList.forEach((v) => {
-      const a = document.createElement("a"); // 创建一个a标签
-      a.href = baseURL + v.filePath + "?t=" + Date.now(); //a标签的src属性赋值
-      a.target = "_blank";
-      a.download = v.fileName; // a标签的download属性赋值
-      document.body.appendChild(a); // 添加a标签到body下
-      a.style.display = "none";
-      a.click(); // 触发a标签点击事件
-      document.body.removeChild(a); //  完成后删除a标签
-    });
-  }, [imgList]);
+    const res = await getDownImgAPI({ fileIds, isMark, isScale });
+    if (res.code === 0) {
+      const data: FileListType[] = res.data;
+      data.forEach((v) => {
+        const a = document.createElement("a"); // 创建一个a标签
+        a.href = baseURL + v.filePath + "?t=" + Date.now(); //a标签的src属性赋值
+        a.target = "_blank";
+        a.download = v.fileName!; // a标签的download属性赋值
+        document.body.appendChild(a); // 添加a标签到body下
+        a.style.display = "none";
+        a.click(); // 触发a标签点击事件
+        document.body.removeChild(a); //  完成后删除a标签
+      });
+      MessageFu.success('下载成功!')
+      closeMoalFu()
+    }
+  }, [closeMoalFu, imgList, isMark, isScale]);
 
   return (
     <Modal
@@ -112,7 +96,7 @@ function GoogsDown({ id, closeMoalFu }: Props) {
             <div className="imgRow" key={v.id}>
               {/* 是否选中 */}
               <div
-                onClick={() => selectImgFu(v.id)}
+                onClick={() => selectImgFu(v.id!)}
                 className={classNames(
                   "incoSelect",
                   v.done ? "incoSelectActive" : ""
@@ -122,7 +106,7 @@ function GoogsDown({ id, closeMoalFu }: Props) {
                   <CheckOutlined />
                 </div>
               </div>
-              <ImageLazy src={v.filePath} width="100%" height={130} />
+              <ImageLazy src={v.filePath!} width="100%" height={130} />
             </div>
           ))}
         </div>
@@ -131,21 +115,21 @@ function GoogsDown({ id, closeMoalFu }: Props) {
           <div>
             分辨率：
             <Radio.Group
-              onChange={(e) => setImgDpi(e.target.value)}
-              value={imgDpi}
+              onChange={(e) => setIsScale(e.target.value)}
+              value={isScale}
             >
-              <Radio value={1}>原图</Radio>
-              <Radio value={2}>压缩</Radio>
+              <Radio value={0}>原图</Radio>
+              <Radio value={1}>压缩</Radio>
             </Radio.Group>
           </div>
           <div>
             水印：
             <Radio.Group
-              onChange={(e) => setImgWater(e.target.value)}
-              value={imgWater}
+              onChange={(e) => setIsMark(e.target.value)}
+              value={isMark}
             >
-              <Radio value={1}>无</Radio>
-              <Radio value={2}>有</Radio>
+              <Radio value={0}>无</Radio>
+              <Radio value={1}>有</Radio>
             </Radio.Group>
           </div>
         </div>

houtai/src/pages/B2Goods/index.tsx

@@ -4,6 +4,7 @@ import {
   getGoodsListAPI,
   goodsDisplayAPI,
   goodsRemoveAPI,
+  goodsBarrageAPI,
 } from "@/store/action/B2Goods";
 import { MessageFu } from "@/utils/message";
 import {
@@ -30,6 +31,7 @@ import ImageLazy from "@/components/ImageLazy";
 import GoodsBarrage from "./GoodsBarrage";
 import GoodsAdd from "./GoodsAdd";
 import GoogsDown from "./GoogsDown";
+import { GoodsTableType } from "@/types";
 
 const { RangePicker } = DatePicker;
 function Goods() {
@@ -47,7 +49,7 @@ function Goods() {
 
   // 顶部筛选
   const [tableSelect, setTableSelect] = useState({
-    name: "",
+    searchKey: "",
     num: "",
     dictTexture: "",
     dictAge: "",
@@ -55,11 +57,11 @@ function Goods() {
     dictSource: "",
     startTime: "",
     endTime: "",
-    topic: -1,
+    topic: "",
     display: -1,
     pageSize: 10,
     pageNum: 1,
-    aaaaa: -1,
+    isBarrage: -1,
   });
 
   // 封装发送请求的函数
@@ -67,9 +69,8 @@ function Goods() {
   const getList = useCallback(async () => {
     const data = {
       ...tableSelect,
-      topic: tableSelect.topic === -1 ? null : tableSelect.topic,
       display: tableSelect.display === -1 ? null : tableSelect.display,
-      aaaaa: tableSelect.aaaaa === -1 ? null : tableSelect.aaaaa,
+      isBarrage: tableSelect.isBarrage === -1 ? null : tableSelect.isBarrage,
       pageNum: pageNumRef.current,
     };
     dispatch(getGoodsListAPI(data));
@@ -93,7 +94,7 @@ function Goods() {
       nameTime.current = window.setTimeout(() => {
         setTableSelect({
           ...tableSelect,
-          name: e.target.value,
+          searchKey: e.target.value,
           pageNum: 1,
         });
       }, 500);
@@ -134,7 +135,7 @@ function Goods() {
     // 把2个输入框和时间选择器清空
     setInputKey(Date.now());
     setTableSelect({
-      name: "",
+      searchKey: "",
       num: "",
       dictTexture: "",
       dictAge: "",
@@ -142,11 +143,11 @@ function Goods() {
       dictSource: "",
       startTime: "",
       endTime: "",
-      topic: -1,
+      topic: "",
       display: -1,
       pageSize: 10,
       pageNum: 1,
-      aaaaa: -1,
+      isBarrage: -1,
     });
   }, []);
 
@@ -157,9 +158,8 @@ function Goods() {
 
     const data = {
       ...tableSelect,
-      topic: tableSelect.topic === -1 ? null : tableSelect.topic,
       display: tableSelect.display === -1 ? null : tableSelect.display,
-      aaaaa: tableSelect.aaaaa === -1 ? null : tableSelect.aaaaa,
+      isBarrage: tableSelect.isBarrage === -1 ? null : tableSelect.isBarrage,
       pageNum: 1,
       pageSize: 9999,
     };
@@ -169,16 +169,18 @@ function Goods() {
     if (res.code === 0) {
       const name = dayjs(new Date()).format("YYYYMMDD");
 
-      const resData = res.data.records;
+      const resData: GoodsTableType[] = res.data.records;
 
       const option = {
         fileName: name,
         datas: [
           {
-            sheetData: resData.map((v: any, i: number) => {
+            sheetData: resData.map((v, i) => {
               return {
-                index: i + 1,
                 ...v,
+                index: i + 1,
+                display: v.display ? "展示" : "不展示",
+                isBarrage: v.isBarrage ? "开启" : "关闭",
               };
             }),
             sheetName: name,
@@ -194,7 +196,7 @@ function Goods() {
               "updateTime",
               "topic",
               "display",
-              "aaaaa",
+              "isBarrage",
             ],
             sheetHeader: [
               "序号",
@@ -243,9 +245,14 @@ function Goods() {
   );
 
   // 切换表格中的弹幕留言开启和关闭
-  const isBarrageFu = useCallback((val: boolean, id: number) => {
-    console.log("切换弹幕留言", val, id);
-  }, []);
+  const isBarrageFu = useCallback(
+    async (val: boolean, id: number) => {
+      const isDisable = val ? 1 : 0;
+      const res: any = await goodsBarrageAPI(id, isDisable);
+      if (res.code === 0) getList();
+    },
+    [getList]
+  );
 
   // 点击下载图片打开的弹窗
   const [downPage, setDownPage] = useState(0);
@@ -334,7 +341,7 @@ function Goods() {
       },
       {
         title: "万物墙主题",
-        render: (item: any) => (item.topic === 1 ? "珍品" : "精品"),
+        dataIndex: "topic",
       },
       {
         title: "展示状态",
@@ -353,7 +360,7 @@ function Goods() {
           <Switch
             checkedChildren="启用"
             unCheckedChildren="停用"
-            checked={item.aaaaa === 1}
+            checked={item.isBarrage === 1}
             onChange={(val) => isBarrageFu(val, item.id!)}
           />
         ),
@@ -496,10 +503,10 @@ function Goods() {
               setTableSelect({ ...tableSelect, topic: e, pageNum: 1 })
             }
             options={[
-              { value: -1, label: "全部" },
-              { value: 1, label: "战争" },
-              { value: 2, label: "生活" },
-              { value: 3, label: "不展示" },
+              { value: "", label: "全部" },
+              { value: "战争", label: "战争" },
+              { value: "生活", label: "生活" },
+              { value: "不展示", label: "不展示" },
             ]}
           />
         </div>
@@ -526,9 +533,9 @@ function Goods() {
           <Select
             placeholder="请选择"
             style={{ width: 100 }}
-            value={tableSelect.aaaaa}
+            value={tableSelect.isBarrage}
             onChange={(e) =>
-              setTableSelect({ ...tableSelect, aaaaa: e, pageNum: 1 })
+              setTableSelect({ ...tableSelect, isBarrage: e, pageNum: 1 })
             }
             options={[
               { value: -1, label: "全部" },
@@ -567,7 +574,12 @@ function Goods() {
       </div>
 
       {/* 弹幕设置 */}
-      {barrage ? <GoodsBarrage closeMoalFu={() => setBarrage(false)} /> : null}
+      {barrage ? (
+        <GoodsBarrage
+          closeMoalFu={() => setBarrage(false)}
+          editListFu={getList}
+        />
+      ) : null}
 
       {/* 下载图片的弹窗 */}
       {downPage ? (
@@ -579,7 +591,8 @@ function Goods() {
         <GoodsAdd
           id={addId}
           closeMoalFu={() => setAddId(0)}
-          upListFu={resetSelectFu}
+          addListFu={resetSelectFu}
+          editListFu={getList}
         />
       ) : null}
     </div>

houtai/src/pages/B3Wall/WallAdd/index.tsx

@@ -6,8 +6,13 @@ import classNames from "classnames";
 import styles from "./index.module.scss";
 
 import ImageLazy from "@/components/ImageLazy";
-import { ImgListType } from "@/types";
+import { ImgListType, WallSaveAPIType } from "@/types";
 import WallLook from "../WallLook";
+import {
+  getWallDetailAPI,
+  goodsUploadAPI,
+  setWallSave,
+} from "@/store/action/B3Wall";
 type Props = {
   id: number;
   closeMoalFu: () => void;
@@ -18,8 +23,14 @@ const UpAsyncLodingDom: any = document.querySelector("#UpAsyncLoding");
 const progressDom: any = document.querySelector("#progress");
 
 function WallAdd({ id, closeMoalFu }: Props) {
-  const getInfoFu = useCallback((id: number) => {
-    console.log("是编辑", id);
+  const getInfoFu = useCallback(async (id: number) => {
+    const res = await getWallDetailAPI(id);
+    FormBoxRef.current.setFieldsValue({ name: res.data.entity.name });
+    setImgNum(res.data.entity.type);
+
+    const imgListRes = res.data.file;
+    setImgList(imgListRes);
+    imgListRef.current = imgListRes;
   }, []);
 
   useEffect(() => {
@@ -32,22 +43,13 @@ function WallAdd({ id, closeMoalFu }: Props) {
   const myInput = useRef<HTMLInputElement>(null);
 
   // 版式的选择
-  const [imgNum, setImgNum] = useState(1);
+  const [imgNum, setImgNum] = useState<1 | 2 | 4 | 6 | 8>(1);
 
   // 上传图片的校验
   const [imgCheck, setImgCheck] = useState(false);
 
   // 上传图片的全部数据（最多8张来进行切割）
-  const imgListRef = useRef<ImgListType[]>([
-    { id: 1, fileName: "xxx", filePath: "/wall/img/20230202_12193909316.jpg" },
-    { id: 2, fileName: "xxx", filePath: "/wall/img/20230209_1519270201.gif" },
-    { id: 3, fileName: "xxx", filePath: "/wall/img/20230202_12193909316.jpg" },
-    { id: 4, fileName: "xxx", filePath: "/wall/img/20230209_1519270201.gif" },
-    { id: 5, fileName: "xxx", filePath: "/wall/img/20230202_12193909316.jpg" },
-    { id: 6, fileName: "xxx", filePath: "/wall/img/20230209_1519270201.gif" },
-    { id: 7, fileName: "xxx", filePath: "/wall/img/20230202_12193909316.jpg" },
-    { id: 8, fileName: "xxx", filePath: "/wall/img/20230209_1519270201.gif" },
-  ]);
+  const imgListRef = useRef<ImgListType[]>([]);
 
   // 在页面展示的图片
   const [imgList, setImgList] = useState<ImgListType[]>([]);
@@ -118,29 +120,47 @@ function WallAdd({ id, closeMoalFu }: Props) {
         // 创建FormData对象
         const fd = new FormData();
         // 把files添加进FormData对象（‘photo’为后端需要的字段）
-        fd.append("type", "thumb");
+        fd.append("type", "img");
         fd.append("file", filesInfo);
 
         e.target.value = "";
 
-        // const res: any = await goodsUploadAPI(fd);
-        // if (res.code === 0) {
-        //   MessageFu.success("上传成功!");
-        //   setCover(res.data.filePath);
-        // }
+        const res: any = await goodsUploadAPI(fd);
+        if (res.code === 0) {
+          MessageFu.success("上传成功!");
+          setImgList([res.data, ...imgList]);
+          imgListRef.current.unshift(res.data);
+        }
         UpAsyncLodingDom.style.opacity = 0;
         progressDom.style.width = "0%";
       }
     },
-    []
+    [imgList]
   );
 
   // 通过校验点击确定
-  const onFinish = useCallback(() => {
-    console.log("通过校验，点击确定");
-    setImgCheck(true);
-    if (imgList.length < imgNum) return;
-  }, [imgList.length, imgNum]);
+  const onFinish = useCallback(
+    async (value: { name: string }) => {
+      console.log("通过校验，点击确定");
+      setImgCheck(true);
+      if (imgList.length < imgNum) return;
+
+      const obj: WallSaveAPIType = {
+        id: id > 0 ? id : null,
+        fileIds: imgList.map((v) => v.id).join(","),
+        name: value.name,
+        type: imgNum,
+      };
+
+      const res = await setWallSave(obj);
+
+      if (res.code === 0) {
+        MessageFu.success(id > 0 ? "编辑成功!" : "新增成功!");
+        closeMoalFu();
+      }
+    },
+    [closeMoalFu, id, imgList, imgNum]
+  );
 
   // 点击预览效果
   const [lookImg, setLookImg] = useState(false);

houtai/src/pages/B3Wall/WallLook/index.css

@@ -13,6 +13,10 @@
 }
 .WallLook .main .imgListBox .imgListRow {
   width: 200px;
+  height: 200px;
+}
+.WallLook .main .imgListBox .imgListRow img {
+  object-fit: contain;
 }
 .WallLook .button {
   text-align: center;

houtai/src/pages/B3Wall/WallLook/index.less

@@ -13,6 +13,10 @@
       justify-content: center;
       .imgListRow{
         width: 200px;
+        height: 200px;
+        img{
+          object-fit: contain;
+        }
       }
     }
   }

houtai/src/pages/B3Wall/WallLook/index.tsx

@@ -1,4 +1,5 @@
 import ImageLazy from "@/components/ImageLazy";
+import { getWallDetailAPI } from "@/store/action/B3Wall";
 import { ImgListType } from "@/types";
 import { Button, Modal } from "antd";
 import React, { useCallback, useEffect, useState } from "react";
@@ -13,19 +14,23 @@ type Props = {
 function WallLook({ id, imgList, closeMoalFu }: Props) {
   const [imgShowList, setImgShowList] = useState<ImgListType[]>([]);
 
-  const getImgInfo = useCallback((id: number) => {
-    console.log("是编辑", id);
+  const getImgInfo = useCallback(async (id: number) => {
+    const res = await getWallDetailAPI(id);
+    const imgListRes = res.data.file;
+    setImgShowList(imgListRes);
   }, []);
 
   useEffect(() => {
     if (id) getImgInfo(id);
     else setImgShowList(imgList!);
+  }, [getImgInfo, id, imgList]);
 
-    // 动态修改模态框的宽度
+  // 动态修改模态框的宽度
+  useEffect(() => {
     const dom: any = document.querySelector(".WallLook .ant-modal");
-    if (dom && imgList && imgList.length > 2)
-      dom.style.width = imgList.length * 200 + "px";
-  }, [getImgInfo, id, imgList]);
+    if (dom && imgShowList && imgShowList.length > 2)
+      dom.style.width = imgShowList.length * 200 + "px";
+  }, [imgShowList]);
 
   return (
     <Modal
@@ -42,7 +47,7 @@ function WallLook({ id, imgList, closeMoalFu }: Props) {
         <div className="imgListBox">
           {imgShowList.map((v) => (
             <div className="imgListRow" key={v.id}>
-              <ImageLazy src={v.filePath!} width="100%" height="anto" />
+              <ImageLazy src={v.filePath!} width="100%" height="100%" />
             </div>
           ))}
         </div>

houtai/src/pages/B3Wall/WallTable/index.tsx

@@ -13,7 +13,7 @@ import styles from "./index.module.scss";
 import { DndProvider, useDrag, useDrop } from "react-dnd";
 import { HTML5Backend } from "react-dnd-html5-backend";
 import { MessageFu } from "@/utils/message";
-import { WallTableList } from "@/types";
+import { WallTableListType } from "@/types";
 import { useDispatch, useSelector } from "react-redux";
 import { RootState } from "@/store";
 import {
@@ -83,7 +83,7 @@ function WallTable({ tablePageIdFu }: Props) {
       },
       {
         title: "展示状态",
-        render: (item: WallTableList) => (
+        render: (item: WallTableListType) => (
           <Switch
             checkedChildren="启用"
             unCheckedChildren="停用"
@@ -94,7 +94,7 @@ function WallTable({ tablePageIdFu }: Props) {
       },
       {
         title: "操作",
-        render: (item: WallTableList) => (
+        render: (item: WallTableListType) => (
           <>
             <Button
               size="small"

houtai/src/pages/B3Wall/index.tsx

@@ -13,8 +13,9 @@ function Wall() {
   // 获取自动播放信息
   const getWallAutoApiFu = useCallback(async () => {
     const res = await getWallAutoApi();
-    setValue0(res.data.isAuto);
-    setTime0(res.data.startTime + "," + res.data.endTime);
+    const data = JSON.parse(res.data.content);
+    setValue0(data.isAuto);
+    setTime0(data.startTime + "," + data.endTime);
   }, []);
 
   useEffect(() => {
@@ -55,7 +56,8 @@ function Wall() {
       startTime: time1[0],
       isAuto: value1,
     };
-    const res: any = await editWallAutoApi(obj);
+
+    const res: any = await editWallAutoApi({ content: JSON.stringify(obj) });
     if (res.code === 0) {
       MessageFu.success("修改成功!");
       getWallAutoApiFu();

houtai/src/store/action/A1Hot.ts

@@ -52,3 +52,10 @@ export const getHotInfo6API = () => {
 export const getHotMapInfoAPI = () => {
   return http.get('cms/report/getIpHot');
 };
+
+/**
+ * 访客-国内/国外
+ */
+export const getHotMapInfoNumAPI = () => {
+  return http.get('cms/report/getIpTotalByType');
+};

houtai/src/store/action/B2Goods.ts

@@ -1,3 +1,4 @@
+import { DownImgType, GoodsTableType } from "@/types";
 import http from "@/utils/http";
 import { AppDispatch } from "..";
 /**
@@ -20,7 +21,6 @@ export const getGoodsListDeriveAPI = (data: any) => {
   return http.post("cms/goods/pageList", data);
 };
 
-
 /**
  * 内容-是否显示
  */
@@ -28,6 +28,19 @@ export const goodsDisplayAPI = (id: number, display: number) => {
   return http.get(`cms/goods/display/${id}/${display}`);
 };
 
+/**
+ * 弹幕留言单个开启或者关闭
+ */
+export const goodsBarrageAPI = (id: number, display: number) => {
+  return http.get(`cms/goods/updateBarrage/${id}/${display}`);
+};
+
+/**
+ * 弹幕批量开关
+ */
+export const goodsBarrageAllAPI = (whether: number) => {
+  return http.get(`cms/goods/batchUpdateBarrage/${whether}`);
+};
 
 /**
  * 删除藏品
@@ -47,11 +60,41 @@ export const goodsUploadAPI = (data: any) => {
   UpAsyncLodingDom.style.opacity = 1;
 
   return http.post("cms/goods/upload", data, {
-    timeout:50000,
+    timeout: 50000,
     // 显示进度条
     onUploadProgress: (e: any) => {
       const complete = (e.loaded / e.total) * 100 || 0;
       progressDom.style.width = complete + "%";
     },
   });
-};
+};
+
+/**
+ * 新增|编辑
+ */
+export const getGoodsSaveAPI = (data: GoodsTableType) => {
+  return http.post("cms/goods/save", data);
+};
+
+/**
+ * 通过id获取详情
+ */
+export const getGoodsInfoByIdAPI = (id: number) => {
+  return http.get(`cms/goods/detail/${id}`);
+};
+
+/**
+ * 更新图片边框
+ */
+export const setGoodsImgBoderAPI = (id: number, whether: number) => {
+  return http.get(`cms/goods/updateFrame/${id}/${whether}`);
+};
+
+
+
+/**
+ * 下载图片--水印和压缩选择
+ */
+export const getDownImgAPI = (data:DownImgType) => {
+  return http.post('cms/goods/download',data);
+};

houtai/src/store/action/B3Wall.ts

@@ -1,19 +1,19 @@
+import { WallSaveAPIType } from "@/types";
 import http from "@/utils/http";
-import { EditWallAutoApi } from "@/types";
 import { AppDispatch } from "..";
 
 /**
  * 获取万物墙自动播放数据
  */
 export const getWallAutoApi = () => {
-  return http.get("cms/wall/getInfo");
+  return http.get("cms/wall/getConfig");
 };
 
 /**
  * 修改万物墙自动播放数据
  */
-export const editWallAutoApi = (data: EditWallAutoApi) => {
-  return http.post("cms/wall/editInfo", data);
+export const editWallAutoApi = (data: {content:string}) => {
+  return http.post("cms/wall/setConfig", data);
 };
 
 
@@ -46,4 +46,40 @@ export const wallRemoveAPI = (id: number) => {
  */
 export const wallSortAPI = (id1: number, id2: number) => {
   return http.get(`cms/wall/sort/${id1}/${id2}`);
-};
+};
+
+/**
+ * 内容-新增|编辑
+ */
+export const setWallSave = (data:WallSaveAPIType) => {
+  return http.post('cms/wall/save',data);
+};
+
+
+// 上传附件的进度条
+const UpAsyncLodingDom: any = document.querySelector("#UpAsyncLoding");
+const progressDom: any = document.querySelector("#progress");
+
+
+/**
+ * 上传封面图和附件
+ */
+export const goodsUploadAPI = (data: any) => {
+  UpAsyncLodingDom.style.opacity = 1;
+
+  return http.post("cms/wall/upload", data, {
+    timeout: 50000,
+    // 显示进度条
+    onUploadProgress: (e: any) => {
+      const complete = (e.loaded / e.total) * 100 || 0;
+      progressDom.style.width = complete + "%";
+    },
+  });
+};
+
+/**
+ * 内容-新增|编辑
+ */
+export const getWallDetailAPI = (id:number) => {
+  return http.get(`cms/wall/detail/${id}`);
+};

houtai/src/store/reducer/B2Goods.ts

@@ -1,9 +1,10 @@
+import { GoodsTableType } from "@/types";
 
 // 初始化状态
 const initState = {
   // 列表数据
   tableInfo: {
-    list: [] as any[],
+    list: [] as GoodsTableType[],
     total: 0,
   },
 };
@@ -11,7 +12,7 @@ const initState = {
 // 定义 action 类型
 type GoodsActionType = {
   type: "goods/getList";
-  payload: { list: any[]; total: number };
+  payload: { list: GoodsTableType[]; total: number };
 };
 
 // 频道 reducer

houtai/src/store/reducer/B3Wall.ts

@@ -1,13 +1,13 @@
-import { WallTableList } from "@/types";
+import { WallTableListType } from "@/types";
 
 // 初始化状态
 const initState = {
   // 列表数据
-  list: [] as WallTableList[],
+  list: [] as WallTableListType[],
 };
 
 // 定义 action 类型
-type WallActionType = { type: "wall/getList"; payload: WallTableList[] };
+type WallActionType = { type: "wall/getList"; payload: WallTableListType[] };
 
 // 频道 reducer
 export default function wallReducer(state = initState, action: WallActionType) {

houtai/src/types/api/goods.d.ts

@@ -0,0 +1,36 @@
+export type GoodsTableType = {
+  createTime: string;
+  creatorId: number;
+  creatorName: string;
+  description: string;
+  dictAge: string;
+  dictLevel: string;
+  dictSource: string;
+  dictTexture: string;
+  dirCode: string;
+  display: number;
+  fileIds: string;
+  id: number;
+  isBarrage: number;
+  name: string;
+  num: string;
+  thumb: string;
+  topic: string;
+  type: string;
+  updateTime: string;
+};
+
+export type FileListType = {
+  fileName?: string;
+  filePath?: string;
+  id?: number;
+  isFrame?: boolean;
+  done?: boolean;
+  type?: "model" | "img" | "audio" | "video";
+};
+
+export type DownImgType = {
+  fileIds: string;
+  isMark: number;
+  isScale: number;
+};

houtai/src/types/api/hot.d.ts

@@ -22,7 +22,7 @@ export type HotInfo4Type = {
 
 type HotMaoTypeT = {
   groupKey: string;
-  parent: string;
+  parent?: string;
   pcs: number;
 };
 

houtai/src/types/api/wall.d.ts

@@ -1,10 +1,5 @@
-export type EditWallAutoApi = {
-  endTime: string;
-  isAuto: number;
-  startTime: string;
-};
 
-export type WallTableList = {
+export type WallTableListType = {
   createTime: string;
   creatorId: number;
   creatorName: string;
@@ -18,7 +13,7 @@ export type WallTableList = {
   updateTime: string;
 };
 
-export type WallUpSaveAPI ={
+export type WallUpSaveType ={
   fileName: string;
   filePath: string;
   id: number|null;
@@ -30,4 +25,11 @@ export type ImgListType = {
   fileName?: string;
   filePath?: string;
   id?: number;
-};
+};
+
+export type WallSaveAPIType ={
+  fileIds:string
+  id?:number|null
+  name:string
+  type:1|2|4|6|8
+}

houtai/src/types/index.d.ts

@@ -1,4 +1,5 @@
 export * from './api/log'
 export * from './api/login'
 export * from './api/wall'
-export * from './api/hot'
+export * from './api/hot'
+export * from './api/goods'