增加水印

src/Column/components/ColumnContent.tsx

@@ -3,7 +3,7 @@ import useRequest from '@ahooksjs/use-request/es'
 import { useHistory } from 'react-router-dom'
 import dayjs from 'dayjs'
 
-import { Modal, message } from 'antd'
+import { Modal, message, Watermark } from 'antd'
 import { StarFilled, StarOutlined, EyeOutlined } from '@ant-design/icons'
 import { ReactComponent as Close } from 'assets/close.svg'
 
@@ -203,6 +203,7 @@ const ColumnContent: React.FC<IColumnContentProps> = props => {
           <Close className="detail-close" onClick={handleOnClose} />
         </div>
       )}
+
       <div className="author-line g-flex g-flex-v-center g-flex-between g-flex-wap">
         <div className="g-flex g-flex-v-center g-flex-c1">
           <div className="artcle-tag artcle-tag-two m-r-sm m-b-xs">
@@ -231,18 +232,24 @@ const ColumnContent: React.FC<IColumnContentProps> = props => {
         <div className="columndetail-time">{dayjs(detail?.PublishTime || '').format('YYYY-MM-DD HH:mm:ss')}</div>
       </div>
       <div className="com-fz18 com-fw-bold m-b-sm">{detail.Title}</div>
-      <div
-        className={`fr-element fr-view ${
-          type === 'list' ||
-          (type === 'detail' && !login2p.jwt) ||
-          ((detail as IColumnDetail)?.IsShowWxPay && (detail as IColumnDetail)?.HasPermission !== INewPermissionType.OK)
-            ? 'note-content'
-            : 'columndetail-content'
-        } `}
-        dangerouslySetInnerHTML={{
-          __html: handleHideImg(detail.Content)
-        }}
-      />
+      <Watermark
+        content={login2p.userInfo ? login2p.userInfo?.UserName : '水印'}
+        font={{ fontSize: 22, color: 'rgba(0,0,0,.08)' }}
+      >
+        <div
+          className={`fr-element fr-view ${
+            type === 'list' ||
+            (type === 'detail' && !login2p.jwt) ||
+            ((detail as IColumnDetail)?.IsShowWxPay &&
+              (detail as IColumnDetail)?.HasPermission !== INewPermissionType.OK)
+              ? 'note-content'
+              : 'columndetail-content'
+          } `}
+          dangerouslySetInnerHTML={{
+            __html: handleHideImg(detail.Content)
+          }}
+        />
+      </Watermark>
       {(detail as IColumnDetail)?.IsShowWxPay &&
         (detail as IColumnDetail)?.HasPermission !== INewPermissionType.OK && ( // 暂时这么写
           <PayNoPermission