fix: 收藏列表点击再次购买被浏览器拦截弹窗的问题

src/pages/systemSetting/collection/commodity.tsx

@@ -68,6 +68,11 @@ const Commodity: React.FC = () => {
               break
           }
           el.target = '_blank';
+          el.id = detail.commodity.id
+          // 防止反复添加
+          if(!document.getElementById(detail.commodity.id)) {
+            document.body.appendChild(el);
+          }
           el.click()
         } else {
           message.destroy()
@@ -130,7 +135,7 @@ const Commodity: React.FC = () => {
           PublicApi.postSearchShopCommodityCollectDeleteCommodityCollect(param).then(res => {
             if (res.code === 1000) {
               fetchCollectCommodityList()
-              resolve()
+              resolve(true)
             } else {
               reject()
             }

src/pages/systemSetting/collection/information.tsx

-import React, { useEffect, useState } from 'react'
-import cx from 'classnames'
-import { Pagination, message, Modal } from 'antd'
-import { StarFilled, EyeOutlined, ClockCircleOutlined } from '@ant-design/icons'
-import { PublicApi } from '@/services/api'
-import { numFormat } from '@/utils/numberFomat'
-import moment from 'moment'
-import styles from './index.less'
-
-const Information: React.FC = () => {
-  const [list, setList] = useState([])
-  const [current, setCurrent] = useState<number>(1)
-  const [pageSize, setPageSize] = useState<number>(10)
-  const [totalCount, setTotalCount] = useState<number>(0)
-
-  useEffect(() => {
-    fetchCollectInformationList()
-  }, [current])
-
-  /**
-   * 获取收藏的资讯列表
-   */
-  const fetchCollectInformationList = () => {
-    let param = {
-      current,
-      pageSize
-    }
-    //@ts-ignore
-    PublicApi.getManageContentInformationCollectList(param).then(res => {
-      if (res.code === 1000) {
-        setList(res.data.data)
-        setTotalCount(res.data.totalCount)
-      }
-    })
-  }
-
-  const handleChange = (page) => {
-    setCurrent(page)
-  }
-
-  const linkToDetail = (detail) => {
-    if (detail.status === 2) {
-      let el = document.createElement('a')
-      el.href = `/infomation/detail?id=${detail.id}`;
-      el.target = '_blank';
-      el.click()
-    } else {
-      message.destroy()
-      message.info("该文章已下架")
-    }
-  }
-
-  const handleCancelCollect = (detail) => {
-    Modal.confirm({
-      centered: true,
-      className: styles.mallComfirm,
-      content: `是否要取消收藏?`,
-      onOk: () => {
-        return new Promise((resolve, reject) => {
-          let param = {
-            informationId: detail.id,
-            status: false
-          }
-          PublicApi.postManageContentInformationCollect(param).then(res => {
-            if (res.code === 1000) {
-              // fetchPurchaseList()
-              fetchCollectInformationList()
-              resolve()
-            } else {
-              reject()
-            }
-          }).catch(() => {
-            reject()
-          })
-        })
-      }
-    })
-  }
-
-  return (
-    <>
-      <div className={styles.information_list}>
-        {
-          list && list.map((item, index) => (
-            <div className={styles.information_list_item} key={`information_list_item_${index}`}>
-              <div className={cx(styles.information_list_item_item, styles.morehalf)}>
-                <div className={styles.information_header_info}>
-                  <div className={styles.information_header_info_logo}>
-                    <img src={item.imageUrl} />
-                  </div>
-                  <div className={styles.information_header_info_content}>
-                    <div className={styles.information_header_info_content_name} onClick={() => linkToDetail(item)}>
-                      <span>{item.title}</span>
-                    </div>
-                    <div className={styles.information_header_info_content_about}>
-                      <div className={styles.information_header_info_content_about_item}>
-                        <ClockCircleOutlined />
-                        <span>{moment(item.createTime).format("YYYY-MM-DD HH:mm")}</span>
-                      </div>
-                      <div className={styles.information_header_info_content_about_item}>
-                        <EyeOutlined />
-                        <span>{numFormat(item.readCount)}</span>
-                      </div>
-                    </div>
-
-                  </div>
-                </div>
-              </div>
-              <div className={cx(styles.information_list_item_item)}>
-                <span className={styles.date}>{moment(item.collectTime).format("YYYY-MM-DD HH:mm")}</span>
-              </div>
-              <div className={cx(styles.information_list_item_item)} onClick={() => handleCancelCollect(item)}>
-                <div className={cx(styles.collection_state)}>
-                  <StarFilled />
-                  <label>收藏</label>
-                </div>
-              </div>
-            </div>
-          ))
-        }
-
-      </div>
-      {
-        totalCount > 0 && (
-          <div className={styles.pagination_wrap}>
-            <Pagination showSizeChanger={false} current={current} total={totalCount} pageSize={pageSize} onChange={handleChange} />
-          </div>
-        )
-      }
-    </>
-  )
-}
-
-export default Information
+import React, { useEffect, useState } from 'react'
+import cx from 'classnames'
+import { Pagination, message, Modal } from 'antd'
+import { StarFilled, EyeOutlined, ClockCircleOutlined } from '@ant-design/icons'
+import { PublicApi } from '@/services/api'
+import { numFormat } from '@/utils/numberFomat'
+import moment from 'moment'
+import styles from './index.less'
+
+const Information: React.FC = () => {
+  const [list, setList] = useState([])
+  const [current, setCurrent] = useState<number>(1)
+  const [pageSize, setPageSize] = useState<number>(10)
+  const [totalCount, setTotalCount] = useState<number>(0)
+
+  useEffect(() => {
+    fetchCollectInformationList()
+  }, [current])
+
+  /**
+   * 获取收藏的资讯列表
+   */
+  const fetchCollectInformationList = () => {
+    const param: any = {
+      current,
+      pageSize
+    }
+
+    PublicApi.getManageContentInformationCollectList(param).then(res => {
+      if (res.code === 1000) {
+        setList(res.data.data)
+        setTotalCount(res.data.totalCount)
+      }
+    })
+  }
+
+  const handleChange = (page) => {
+    setCurrent(page)
+  }
+
+  const linkToDetail = (detail) => {
+    if (detail.status === 2) {
+      const el = document.createElement('a')
+      el.href = `/infomation/detail?id=${detail.id}`;
+      el.target = '_blank';
+      el.id = detail.id
+      if(!document.getElementById(detail.id)) {
+        document.body.appendChild(el);
+      }
+      el.click()
+    } else {
+      message.destroy()
+      message.info("该文章已下架")
+    }
+  }
+
+  const handleCancelCollect = (detail) => {
+    Modal.confirm({
+      centered: true,
+      className: styles.mallComfirm,
+      content: `是否要取消收藏?`,
+      onOk: () => {
+        return new Promise((resolve, reject) => {
+          const param = {
+            informationId: detail.id,
+            status: false
+          }
+          PublicApi.postManageContentInformationCollect(param).then(res => {
+            if (res.code === 1000) {
+              // fetchPurchaseList()
+              fetchCollectInformationList()
+              resolve(true)
+            } else {
+              reject()
+            }
+          }).catch(() => {
+            reject()
+          })
+        })
+      }
+    })
+  }
+
+  return (
+    <>
+      <div className={styles.information_list}>
+        {
+          list && list.map((item, index) => (
+            <div className={styles.information_list_item} key={`information_list_item_${index}`}>
+              <div className={cx(styles.information_list_item_item, styles.morehalf)}>
+                <div className={styles.information_header_info}>
+                  <div className={styles.information_header_info_logo}>
+                    <img src={item.imageUrl} />
+                  </div>
+                  <div className={styles.information_header_info_content}>
+                    <div className={styles.information_header_info_content_name} onClick={() => linkToDetail(item)}>
+                      <span>{item.title}</span>
+                    </div>
+                    <div className={styles.information_header_info_content_about}>
+                      <div className={styles.information_header_info_content_about_item}>
+                        <ClockCircleOutlined />
+                        <span>{moment(item.createTime).format("YYYY-MM-DD HH:mm")}</span>
+                      </div>
+                      <div className={styles.information_header_info_content_about_item}>
+                        <EyeOutlined />
+                        <span>{numFormat(item.readCount)}</span>
+                      </div>
+                    </div>
+
+                  </div>
+                </div>
+              </div>
+              <div className={cx(styles.information_list_item_item)}>
+                <span className={styles.date}>{moment(item.collectTime).format("YYYY-MM-DD HH:mm")}</span>
+              </div>
+              <div className={cx(styles.information_list_item_item)} onClick={() => handleCancelCollect(item)}>
+                <div className={cx(styles.collection_state)}>
+                  <StarFilled />
+                  <label>收藏</label>
+                </div>
+              </div>
+            </div>
+          ))
+        }
+
+      </div>
+      {
+        totalCount > 0 && (
+          <div className={styles.pagination_wrap}>
+            <Pagination showSizeChanger={false} current={current} total={totalCount} pageSize={pageSize} onChange={handleChange} />
+          </div>
+        )
+      }
+    </>
+  )
+}
+
+export default Information

src/pages/systemSetting/collection/shops.tsx

@@ -71,6 +71,10 @@ const Shops: React.FC = () => {
       const el = document.createElement('a')
       el.href = `/shop?shopId=${btoa(JSON.stringify({ shopId: detail.id, memberId: detail.memberId }))}`;
       el.target = '_blank';
+      el.id = detail.id
+      if(!document.getElementById(detail.id)) {
+        document.body.appendChild(el);
+      }
       el.click()
     } else {
       message.destroy()