修复token失效报错，echarts重复获取dom问题

houtai/src/pages/A1Hot/index.tsx

@@ -43,6 +43,13 @@ echarts.use([
 ]);
 
 function Hot() {
+  // 5个echart的Ref
+  const echartRef1 = useRef<HTMLDivElement>(null);
+  const echartRef2 = useRef<HTMLDivElement>(null);
+  const echartRef3 = useRef<HTMLDivElement>(null);
+  const echartRef4 = useRef<HTMLDivElement>(null);
+  const echartRef7 = useRef<HTMLDivElement>(null);
+
   // 数量总计
   const [allNum1, setAllNum1] = useState(0);
   const [allNum2, setAllNum2] = useState(0);
@@ -66,9 +73,13 @@ function Hot() {
 
   // 折线图
   const echartsFu1 = useCallback(
-    (dom: string, data1: string[], data2: number[], color: string[]) => {
-      const chartDom1: any = document.querySelector(dom)!;
-      const myChart1 = echarts.init(chartDom1);
+    (
+      dom: HTMLDivElement,
+      data1: string[],
+      data2: number[],
+      color: string[]
+    ) => {
+      const myChart1 = echarts.init(dom);
       const option1 = {
         color: color,
         grid: {
@@ -119,9 +130,13 @@ function Hot() {
 
   // 饼图集合
   const echartsFu2 = useCallback(
-    (dom: any, data: { value: number; name: string }[], obj: any) => {
-      let chartDom2: any = document.querySelector(dom);
-      let myChart2 = echarts.init(chartDom2);
+    (
+      dom: HTMLDivElement,
+      data: { value: number; name: string }[],
+      obj: any
+    ) => {
+      let myChart2 = echarts.getInstanceByDom(dom);
+      if (!myChart2) myChart2 = echarts.init(dom);
       let option2 = {
         color: ["#11A480", "#00BBF6", "#F97C7C", "#93876D", "#ECDFBF"],
         tooltip: {
@@ -180,39 +195,45 @@ function Hot() {
   // 第一个饼图--浏览总数
   const echartsB1 = useCallback(async () => {
     const res3 = await getHotInfo3API(select1);
-    const data3: HotInfo3Type[] = res3.data;
-    let allNum4 = 0;
-    const data4: any = [];
-    data3.forEach((v) => {
-      data4.push({
-        icon: "circle",
-        value: v.pcs,
-        name: hotChangeObj[v.groupKey],
+    if (res3.code === 0) {
+      const data3: HotInfo3Type[] = res3.data;
+      let allNum4 = 0;
+      const data4: any = [];
+      data3.forEach((v) => {
+        data4.push({
+          icon: "circle",
+          value: v.pcs,
+          name: hotChangeObj[v.groupKey],
+        });
+        allNum4 += v.pcs;
       });
-      allNum4 += v.pcs;
-    });
-    setAllNum4(allNum4);
-
-    // 左边饼图配置文件
-    const data4Obj = {
-      legend: { left: "center", bottom: 20 },
-      series: { center: ["50%", "35%"], radius: ["50%", "70%"] },
-    };
-    echartsFu2("#echarts4", data4, data4Obj);
+      setAllNum4(allNum4);
+
+      // 左边饼图配置文件
+      const data4Obj = {
+        legend: { left: "center", bottom: 20 },
+        series: { center: ["50%", "35%"], radius: ["50%", "70%"] },
+      };
+      echartsFu2(echartRef4.current!, data4, data4Obj);
+    }
   }, [echartsFu2, select1]);
 
   // 馆藏排行
   const getlikeData1Fu = useCallback(async () => {
     const res = await getHotInfo4API(select1, select2);
-    const data: HotInfo4Type[] = res.data;
-    setLikeData(data);
+    if (res.code === 0) {
+      const data: HotInfo4Type[] = res.data;
+      setLikeData(data);
+    }
   }, [select1, select2]);
 
   // 场景排行
   const getlikeData2Fu = useCallback(async () => {
     const res = await getHotInfo5API(select1, select3);
-    const data: HotInfo4Type[] = res.data;
-    setLikeData2(data);
+    if (res.code === 0) {
+      const data: HotInfo4Type[] = res.data;
+      setLikeData2(data);
+    }
   }, [select1, select3]);
 
   // 馆藏统计---第二个饼图
@@ -226,20 +247,22 @@ function Hot() {
   const getGoodsAllFu = useCallback(async () => {
     const res = await getHotInfo6API();
     goodsAllDataRef.current = res.data;
-    // 第一次把  按 类别的数据 渲染出来
-    setAllNum5(goodsAllDataRef.current.total);
-    const data7 = goodsAllDataRef.current["texture"].map((v) => ({
-      icon: "circle",
-      value: v.pcs,
-      name: v.type,
-    }));
+    if (res.code === 0) {
+      // 第一次把  按 类别的数据 渲染出来
+      setAllNum5(goodsAllDataRef.current.total);
+      const data7 = goodsAllDataRef.current["texture"].map((v) => ({
+        icon: "circle",
+        value: v.pcs,
+        name: v.type,
+      }));
 
-    // 右边饼图配置文件
-    const data7Obj = {
-      legend: { left: "center", top: 280 },
-      series: { center: ["50%", "35%"], radius: ["40%", "60%"] },
-    };
-    echartsFu2("#echarts7", data7, data7Obj);
+      // 右边饼图配置文件
+      const data7Obj = {
+        legend: { left: "center", top: 280 },
+        series: { center: ["50%", "35%"], radius: ["40%", "60%"] },
+      };
+      echartsFu2(echartRef7.current!, data7, data7Obj);
+    }
   }, [echartsFu2]);
 
   // 关于浏览总数改变重新发请求拿数据
@@ -288,49 +311,54 @@ function Hot() {
       legend: { left: "center", top: 280 },
       series: { center: ["50%", "35%"], radius: ["40%", "60%"] },
     };
-    echartsFu2("#echarts7", data7, data7Obj);
+    echartsFu2(echartRef7.current!, data7, data7Obj);
   }, [echartsFu2, select4]);
 
   const getInfoFu = useCallback(async () => {
     // 第一个折线 echarts----------------------------
     const res1 = await getHotInfo1API();
-    const data1: HotInfo1Type[] = res1.data.reverse();
-    let allNum1 = 0;
-    const data1_1: string[] = [];
-    const data1_2: number[] = [];
-    data1.forEach((v) => {
-      data1_1.push(v.today);
-      data1_2.push(v.pcsUser);
-      allNum1 += v.pcsUser;
-    });
-    setAllNum1(allNum1);
-    echartsFu1("#echarts1", data1_1, data1_2, ["#11A480"]);
+    if (res1.code === 0) {
+      const data1: HotInfo1Type[] = res1.data.reverse();
+      let allNum1 = 0;
+      const data1_1: string[] = [];
+      const data1_2: number[] = [];
+      data1.forEach((v) => {
+        data1_1.push(v.today);
+        data1_2.push(v.pcsUser);
+        allNum1 += v.pcsUser;
+      });
+      setAllNum1(allNum1);
+      echartsFu1(echartRef1.current!, data1_1, data1_2, ["#11A480"]);
+    }
 
     // 第二、三个折线 echarts----------------------------
     const res2 = await getHotInfo2API();
-    const data2: HotInfo1Type[] = res2.data.reverse();
-    let allNum2 = 0;
-    const data2_1: string[] = [];
-    const data2_2: number[] = [];
-
-    let allNum3 = 0;
-    const data3_1: string[] = [];
-    const data3_2: number[] = [];
-
-    data2.forEach((v) => {
-      data2_1.push(v.today);
-      data2_2.push(v.pcsWall);
-      allNum2 += v.pcsWall;
-
-      data3_1.push(v.today);
-      data3_2.push(v.pcsWearable);
-      allNum3 += v.pcsWearable;
-    });
-    setAllNum2(allNum2);
-    setAllNum3(allNum3);
-
-    echartsFu1("#echarts2", data2_1, data2_2, ["#00BBF6"]);
-    echartsFu1("#echarts3", data3_1, data3_2, ["#F97C7C"]);
+
+    if (res2.code === 0) {
+      const data2: HotInfo1Type[] = res2.data.reverse();
+      let allNum2 = 0;
+      const data2_1: string[] = [];
+      const data2_2: number[] = [];
+
+      let allNum3 = 0;
+      const data3_1: string[] = [];
+      const data3_2: number[] = [];
+
+      data2.forEach((v) => {
+        data2_1.push(v.today);
+        data2_2.push(v.pcsWall);
+        allNum2 += v.pcsWall;
+
+        data3_1.push(v.today);
+        data3_2.push(v.pcsWearable);
+        allNum3 += v.pcsWearable;
+      });
+      setAllNum2(allNum2);
+      setAllNum3(allNum3);
+
+      echartsFu1(echartRef2.current!, data2_1, data2_2, ["#00BBF6"]);
+      echartsFu1(echartRef3.current!, data3_1, data3_2, ["#F97C7C"]);
+    }
   }, [echartsFu1]);
 
   useEffect(() => {
@@ -357,7 +385,7 @@ function Hot() {
                 </Tooltip>
               </div>
               {/* 第一个echarts盒子 */}
-              <div id="echarts1"></div>
+              <div id="echarts1" ref={echartRef1}></div>
               <div className="hotTime">近十四天数据</div>
             </div>
             <div className="topBoxL2">
@@ -373,7 +401,7 @@ function Hot() {
                   </Tooltip>
                 </div>
                 {/* 第二个echarts盒子 */}
-                <div id="echarts2"></div>
+                <div id="echarts2" ref={echartRef2}></div>
                 <div className="hotTime">近七天数据</div>
               </div>
               {/* 穿戴设备热度盒子 */}
@@ -388,7 +416,7 @@ function Hot() {
                   </Tooltip>
                 </div>
                 {/* 第三个echarts盒子 */}
-                <div id="echarts3"></div>
+                <div id="echarts3" ref={echartRef3}></div>
                 <div className="hotTime">近七天数据</div>
               </div>
             </div>
@@ -444,7 +472,7 @@ function Hot() {
                       <div>总数</div>
                       <p>{allNum4}</p>
                     </div>
-                    <div id="echarts4"></div>
+                    <div id="echarts4" ref={echartRef4}></div>
                   </div>
                 </div>
 
@@ -562,7 +590,7 @@ function Hot() {
               />
             </div>
             <div className="downBoxRBox">
-              <div id="echarts7"></div>
+              <div id="echarts7" ref={echartRef7}></div>
               <div className="downBoxRBoxTxt">
                 <div>总数</div>
                 <p>{allNum5}</p>

houtai/src/pages/B3Wall/index.tsx

@@ -13,9 +13,11 @@ function Wall() {
   // 获取自动播放信息
   const getWallAutoApiFu = useCallback(async () => {
     const res = await getWallAutoApi();
-    const data = JSON.parse(res.data.content);
-    setValue0(data.isAuto);
-    setTime0(data.startTime + "," + data.endTime);
+    if (res.code === 0) {
+      const data = JSON.parse(res.data.content);
+      setValue0(data.isAuto);
+      setTime0(data.startTime + "," + data.endTime);
+    }
   }, []);
 
   useEffect(() => {

houtai/src/pages/B4Barrage/index.tsx

@@ -35,8 +35,10 @@ function Barrage() {
   // 进页面获取弹幕功能设置信息
   const getBarrageSetFu = useCallback(async () => {
     const res = await barrageGetConfigAPI();
-    const dataRes = JSON.parse(res.data.content);
-    setBarrageValue(dataRes.value);
+    if (res.code === 0) {
+      const dataRes = JSON.parse(res.data.content);
+      setBarrageValue(dataRes.value);
+    }
   }, []);
 
   useEffect(() => {

houtai/src/pages/B6Smart/index.tsx

@@ -32,8 +32,10 @@ function Smart() {
   // 进页面获取配置信息
   const smartGetConfigFu = useCallback(async () => {
     const res = await smartGetConfigAPI();
-    const data = JSON.parse(res.data.content);
-    setValue(data.value);
+    if (res.code === 0) {
+      const data = JSON.parse(res.data.content);
+      setValue(data.value);
+    }
   }, []);
 
   useEffect(() => {