禁用打开页面时弹窗

.gitignore

@@ -1,5 +1,6 @@
 # Node dependencies
 node_modules
+build
 
 # Logs
 logs

src/App.js

@@ -1,9 +1,9 @@
-import React, {Component} from "react";
+import React, { Component } from "react";
 import CodeMirror from "@uiw/react-codemirror";
 import "codemirror/addon/search/searchcursor";
 import "codemirror/keymap/sublime";
 import "antd/dist/antd.css";
-import {observer, inject} from "mobx-react";
+import { observer, inject } from "mobx-react";
 import classnames from "classnames";
 import throttle from "lodash.throttle";
 
@@ -25,13 +25,17 @@ import {
   IMAGE_HOSTING_NAMES,
   IMAGE_HOSTING_TYPE,
   MJX_DATA_FORMULA,
-  MJX_DATA_FORMULA_TYPE,
+  MJX_DATA_FORMULA_TYPE
 } from "./utils/constant";
-import {markdownParser, markdownParserWechat, updateMathjax} from "./utils/helper";
+import {
+  markdownParser,
+  markdownParserWechat,
+  updateMathjax
+} from "./utils/helper";
 import pluginCenter from "./utils/pluginCenter";
 import appContext from "./utils/appContext";
-import {uploadAdaptor} from "./utils/imageHosting";
-import bindHotkeys, {betterTab, rightClick} from "./utils/hotkey";
+import { uploadAdaptor } from "./utils/imageHosting";
+import bindHotkeys, { betterTab, rightClick } from "./utils/hotkey";
 
 @inject("content")
 @inject("navbar")
@@ -46,7 +50,7 @@ class App extends Component {
     this.scale = 1;
     this.handleUpdateMathjax = throttle(updateMathjax, 1500);
     this.state = {
-      focus: false,
+      focus: false
     };
   }
 
@@ -60,25 +64,25 @@ class App extends Component {
         tex: {
           inlineMath: [["$", "$"]],
           displayMath: [["$$", "$$"]],
-          tags: "ams",
+          tags: "ams"
         },
         svg: {
-          fontCache: "none",
+          fontCache: "none"
         },
         options: {
           renderActions: {
             addMenu: [0, "", ""],
             addContainer: [
               190,
-              (doc) => {
+              doc => {
                 for (const math of doc.math) {
                   this.addContainer(math, doc);
                 }
               },
-              this.addContainer,
-            ],
-          },
-        },
+              this.addContainer
+            ]
+          }
+        }
       };
       // eslint-disable-next-line
       require("mathjax/es5/tex-svg-full");
@@ -98,7 +102,10 @@ class App extends Component {
 
   componentWillUnmount() {
     document.removeEventListener("fullscreenchange", this.solveScreenChange);
-    document.removeEventListener("webkitfullscreenchange", this.solveScreenChange);
+    document.removeEventListener(
+      "webkitfullscreenchange",
+      this.solveScreenChange
+    );
     document.removeEventListener("mozfullscreenchange", this.solveScreenChange);
     document.removeEventListener("MSFullscreenChange", this.solveScreenChange);
   }
@@ -107,7 +114,15 @@ class App extends Component {
     if (this.props.useImageHosting === undefined) {
       return;
     }
-    const {url, name, isSmmsOpen, isQiniuyunOpen, isAliyunOpen, isGiteeOpen, isGitHubOpen} = this.props.useImageHosting;
+    const {
+      url,
+      name,
+      isSmmsOpen,
+      isQiniuyunOpen,
+      isAliyunOpen,
+      isGiteeOpen,
+      isGitHubOpen
+    } = this.props.useImageHosting;
     if (name) {
       this.props.imageHosting.setHostingUrl(url);
       this.props.imageHosting.setHostingName(name);
@@ -149,7 +164,7 @@ class App extends Component {
   };
 
   setEditorContent = () => {
-    const {defaultText} = this.props;
+    const { defaultText } = this.props;
     if (defaultText) {
       this.props.content.setContent(defaultText);
     }
@@ -160,20 +175,23 @@ class App extends Component {
   }
 
   solveScreenChange = () => {
-    const {isImmersiveEditing} = this.props.view;
+    const { isImmersiveEditing } = this.props.view;
     this.props.view.setImmersiveEditing(!isImmersiveEditing);
   };
 
-  getInstance = (instance) => {
+  getInstance = instance => {
     instance.editor.on("inputRead", function(cm, event) {
       if (event.origin === "paste") {
         var text = event.text[0]; // pasted string
         var new_text = ""; // any operations here
         cm.refresh();
-        const {length} = cm.getSelections();
+        const { length } = cm.getSelections();
         // my first idea was
         // note: for multiline strings may need more complex calculations
-        cm.replaceRange(new_text, event.from, {line: event.from.line, ch: event.from.ch + text.length});
+        cm.replaceRange(new_text, event.from, {
+          line: event.from.line,
+          ch: event.from.ch + text.length
+        });
         // first solution did'nt work (before i guess to call refresh) so i tried that way, works too
         if (length === 1) {
           cm.execCommand("undo");
@@ -189,11 +207,15 @@ class App extends Component {
 
   handleScroll = () => {
     if (this.props.navbar.isSyncScroll) {
-      const {markdownEditor} = this.props.content;
+      const { markdownEditor } = this.props.content;
       const cmData = markdownEditor.getScrollInfo();
       const editorToTop = cmData.top;
       const editorScrollHeight = cmData.height - cmData.clientHeight;
-      this.scale = (this.previewWrap.offsetHeight - this.previewContainer.offsetHeight + 55) / editorScrollHeight;
+      this.scale =
+        (this.previewWrap.offsetHeight -
+          this.previewContainer.offsetHeight +
+          55) /
+        editorScrollHeight;
       if (this.index === 1) {
         this.previewContainer.scrollTop = editorToTop * this.scale;
       } else {
@@ -203,7 +225,7 @@ class App extends Component {
     }
   };
 
-  handleChange = (editor) => {
+  handleChange = editor => {
     if (this.state.focus) {
       const content = editor.getValue();
       this.props.content.setContent(content);
@@ -211,21 +233,21 @@ class App extends Component {
     }
   };
 
-  handleFocus = (editor) => {
+  handleFocus = editor => {
     this.setState({
-      focus: true,
+      focus: true
     });
     this.props.onTextFocus && this.props.onTextFocus(editor.getValue());
   };
 
-  handleBlur = (editor) => {
+  handleBlur = editor => {
     this.setState({
-      focus: false,
+      focus: false
     });
     this.props.onTextBlur && this.props.onTextBlur(editor.getValue());
   };
 
-  getStyleInstance = (instance) => {
+  getStyleInstance = instance => {
     if (instance) {
       this.styleEditor = instance.editor;
       this.styleEditor.on("keyup", (cm, e) => {
@@ -244,7 +266,10 @@ class App extends Component {
     }
     for (let i = 0; i < e.dataTransfer.files.length; i++) {
       // console.log(e.dataTransfer.files[i]);
-      uploadAdaptor({file: e.dataTransfer.files[i], content: this.props.content});
+      uploadAdaptor({
+        file: e.dataTransfer.files[i],
+        content: this.props.content
+      });
     }
   };
 
@@ -252,21 +277,24 @@ class App extends Component {
     const cbData = e.clipboardData;
 
     const insertPasteContent = (cm, content) => {
-      const {length} = cm.getSelections();
+      const { length } = cm.getSelections();
       cm.replaceSelections(Array(length).fill(content));
       this.setState(
         {
-          focus: true,
+          focus: true
         },
         () => {
           this.handleChange(cm);
-        },
+        }
       );
     };
 
     if (e.clipboardData && e.clipboardData.files) {
       for (let i = 0; i < e.clipboardData.files.length; i++) {
-        uploadAdaptor({file: e.clipboardData.files[i], content: this.props.content});
+        uploadAdaptor({
+          file: e.clipboardData.files[i],
+          content: this.props.content
+        });
       }
     }
 
@@ -289,18 +317,29 @@ class App extends Component {
 
   addContainer(math, doc) {
     const tag = "span";
-    const spanClass = math.display ? "span-block-equation" : "span-inline-equation";
+    const spanClass = math.display
+      ? "span-block-equation"
+      : "span-inline-equation";
     const cls = math.display ? "block-equation" : "inline-equation";
     math.typesetRoot.className = cls;
     math.typesetRoot.setAttribute(MJX_DATA_FORMULA, math.math);
     math.typesetRoot.setAttribute(MJX_DATA_FORMULA_TYPE, cls);
-    math.typesetRoot = doc.adaptor.node(tag, {class: spanClass, style: "cursor:pointer"}, [math.typesetRoot]);
+    math.typesetRoot = doc.adaptor.node(
+      tag,
+      { class: spanClass, style: "cursor:pointer" },
+      [math.typesetRoot]
+    );
   }
 
   render() {
-    const {codeNum, previewType} = this.props.navbar;
-    const {isEditAreaOpen, isPreviewAreaOpen, isStyleEditorOpen, isImmersiveEditing} = this.props.view;
-    const {isSearchOpen} = this.props.dialog;
+    const { codeNum, previewType } = this.props.navbar;
+    const {
+      isEditAreaOpen,
+      isPreviewAreaOpen,
+      isStyleEditorOpen,
+      isImmersiveEditing
+    } = this.props.view;
+    const { isSearchOpen } = this.props.dialog;
 
     const parseHtml =
       codeNum === 0
@@ -310,38 +349,48 @@ class App extends Component {
     const mdEditingClass = classnames({
       "nice-md-editing": !isImmersiveEditing,
       "nice-md-editing-immersive": isImmersiveEditing,
-      "nice-md-editing-hide": !isEditAreaOpen,
+      "nice-md-editing-hide": !isEditAreaOpen
     });
 
     const styleEditingClass = classnames({
       "nice-style-editing": true,
-      "nice-style-editing-hide": isImmersiveEditing,
+      "nice-style-editing-hide": isImmersiveEditing
     });
 
     const richTextClass = classnames({
       "nice-marked-text": true,
       "nice-marked-text-pc": previewType === "pc",
-      "nice-marked-text-hide": isImmersiveEditing || !isPreviewAreaOpen,
+      "nice-marked-text-hide": isImmersiveEditing || !isPreviewAreaOpen
     });
 
     const richTextBoxClass = classnames({
       "nice-wx-box": true,
-      "nice-wx-box-pc": previewType === "pc",
+      "nice-wx-box-pc": previewType === "pc"
     });
 
     const textContainerClass = classnames({
       "nice-text-container": !isImmersiveEditing,
-      "nice-text-container-immersive": isImmersiveEditing,
+      "nice-text-container-immersive": isImmersiveEditing
     });
 
     return (
       <appContext.Consumer>
-        {({defaultTitle, onStyleChange, onStyleBlur, onStyleFocus, token}) => (
+        {({
+          defaultTitle,
+          onStyleChange,
+          onStyleBlur,
+          onStyleFocus,
+          token
+        }) => (
           <div className="nice-app">
             <Navbar title={defaultTitle} token={token} />
             <Toobar token={token} />
             <div className={textContainerClass}>
-              <div id="nice-md-editor" className={mdEditingClass} onMouseOver={(e) => this.setCurrentIndex(1, e)}>
+              <div
+                id="nice-md-editor"
+                className={mdEditingClass}
+                onMouseOver={e => this.setCurrentIndex(1, e)}
+              >
                 {isSearchOpen && <SearchBox />}
                 <CodeMirror
                   value={this.props.content.content}
@@ -354,8 +403,8 @@ class App extends Component {
                     extraKeys: {
                       ...bindHotkeys(this.props.content, this.props.dialog),
                       Tab: betterTab,
-                      RightClick: rightClick,
-                    },
+                      RightClick: rightClick
+                    }
                   }}
                   onChange={this.handleChange}
                   onScroll={this.handleScroll}
@@ -366,24 +415,28 @@ class App extends Component {
                   ref={this.getInstance}
                 />
               </div>
-              <div id="nice-rich-text" className={richTextClass} onMouseOver={(e) => this.setCurrentIndex(2, e)}>
+              <div
+                id="nice-rich-text"
+                className={richTextClass}
+                onMouseOver={e => this.setCurrentIndex(2, e)}
+              >
                 <Sidebar />
                 <div
                   id={BOX_ID}
                   className={richTextBoxClass}
                   onScroll={this.handleScroll}
-                  ref={(node) => {
+                  ref={node => {
                     this.previewContainer = node;
                   }}
                 >
                   <section
                     id={LAYOUT_ID}
-                    data-tool="markdown2wechat编辑器"
-                    data-website="https://aizhuanqian.com"
+                    data-tool="markdown2html编辑器"
+                    data-website="https://md.luckday.cn"
                     dangerouslySetInnerHTML={{
-                      __html: parseHtml,
+                      __html: parseHtml
                     }}
-                    ref={(node) => {
+                    ref={node => {
                       this.previewWrap = node;
                     }}
                   />
@@ -392,7 +445,11 @@ class App extends Component {
 
               {isStyleEditorOpen && (
                 <div id="nice-style-editor" className={styleEditingClass}>
-                  <StyleEditor onStyleChange={onStyleChange} onStyleBlur={onStyleBlur} onStyleFocus={onStyleFocus} />
+                  <StyleEditor
+                    onStyleChange={onStyleChange}
+                    onStyleBlur={onStyleBlur}
+                    onStyleFocus={onStyleFocus}
+                  />
                 </div>
               )}
 

src/component/Dialog/VersionDialog.js

@@ -1,8 +1,8 @@
-import React, {Component} from "react";
-import {observer, inject} from "mobx-react";
-import {Modal, Timeline, Button} from "antd";
+import React, { Component } from "react";
+import { observer, inject } from "mobx-react";
+import { Modal, Timeline, Button } from "antd";
 import axios from "axios";
-import {NEWEST_VERSION} from "../../utils/constant";
+import { NEWEST_VERSION } from "../../utils/constant";
 import SvgIcon from "../../icon";
 
 import "./VersionDialog.css";
@@ -17,7 +17,7 @@ class VersionDialog extends Component {
       versionNumber: 0,
       versionTimeline: [],
       recommend: null,
-      specialInfo: "",
+      specialInfo: ""
     };
   }
 
@@ -31,7 +31,8 @@ class VersionDialog extends Component {
 
   handleMore = () => {
     const w = window.open("about:blank");
-    w.location.href = "https://git.luckday.cn/Markdown2Html/master/CHANGELOG.md";
+    w.location.href =
+      "https://git.luckday.cn/Markdown2Html/master/CHANGELOG.md";
   };
 
   handleDocs = () => {
@@ -44,21 +45,26 @@ class VersionDialog extends Component {
       const data = {
         versionId: 1,
         versionNumber: "1.0.0",
-        versionTimeline: ["2023-09-20 增加网格黑主题", "2023-09-14 解决超链接文字复制到公众号颜色失效的问题", "2023-09-01 优化部分配置与信息", "2023-08-30 Fork 自 markdown2html"],
+        versionTimeline: [
+          "2023-09-20 增加网格黑主题",
+          "2023-09-14 解决超链接文字复制到公众号颜色失效的问题",
+          "2023-09-01 优化部分配置与信息",
+          "2023-08-30 Fork 自 markdown2html"
+        ],
         recommend: {
           link: "https://github.com/shenweiyan/Knowledge-Garden",
-          mainInfo: "欢迎关注我的知识花园",
+          mainInfo: "欢迎关注我的知识花园"
         },
-        specialInfo: ''
+        specialInfo: ""
         //specialInfo:
         //  '<div style="display:flex;justify-content:center;align-items:center;"><img style="width:50%;" src="http://md.aizhuanqian.online/img/wechat_qr.df324554.jpeg"/></div>',
       };
       const newestVersion = localStorage.getItem(NEWEST_VERSION);
       if (data.versionNumber !== newestVersion) {
-        this.props.dialog.setVersionOpen(true);
+        // this.props.dialog.setVersionOpen(true);
         localStorage.setItem(NEWEST_VERSION, data.versionNumber);
       }
-      this.setState({...data});
+      this.setState({ ...data });
     } catch (err) {
       console.error("读取最新版本信息错误");
     }
@@ -74,24 +80,27 @@ class VersionDialog extends Component {
         footer={[
           <Button key="submit" type="primary" onClick={this.handleOk}>
             确认
-          </Button>,
+          </Button>
         ]}
         destroyOnClose
       >
         <Timeline>
-          <Timeline.Item dot={<SvgIcon name="environment" style={style.svgIcon} />}>
-              <strong>更多版本更新与说明信息请查看
-                <a
-                  id="more-info"
-                  style={{fontWeight: "bold", borderBottom: "solid"}}
-                  alt=""
-                  href="https://github.com/shenweiyan/Markdown2Html"
-                  rel="noopener noreferrer"
-                  target="_blank"
-                >
-                  这里
-                </a>
-              </strong>
+          <Timeline.Item
+            dot={<SvgIcon name="environment" style={style.svgIcon} />}
+          >
+            <strong>
+              更多版本更新与说明信息请查看
+              <a
+                id="more-info"
+                style={{ fontWeight: "bold", borderBottom: "solid" }}
+                alt=""
+                href="https://github.com/shenweiyan/Markdown2Html"
+                rel="noopener noreferrer"
+                target="_blank"
+              >
+                这里
+              </a>
+            </strong>
           </Timeline.Item>
           {this.state.versionTimeline.map((version, index) => {
             /*if (index === 0) {
@@ -109,7 +118,7 @@ class VersionDialog extends Component {
             了解更多，请查看
             <a
               id="nice-version-dialog-doc"
-              style={{fontWeight: "bold"}}
+              style={{ fontWeight: "bold" }}
               alt=""
               href="https://github.com/shenweiyan/Markdown2Html"
               rel="noopener noreferrer"
@@ -122,7 +131,7 @@ class VersionDialog extends Component {
             <Timeline.Item dot={<SvgIcon name="more" style={style.svgIcon} />}>
               <a
                 id="nice-version-dialog-recommend"
-                style={{fontWeight: "bold", borderBottom: "double"}}
+                style={{ fontWeight: "bold", borderBottom: "double" }}
                 alt=""
                 href={this.state.recommend.link}
                 rel="noopener noreferrer"
@@ -136,7 +145,7 @@ class VersionDialog extends Component {
         {this.state.specialInfo && (
           <div
             id="nice-version-dialog-special"
-            dangerouslySetInnerHTML={{__html: this.state.specialInfo}}
+            dangerouslySetInnerHTML={{ __html: this.state.specialInfo }}
             className="specialInfo"
           />
         )}
@@ -148,8 +157,8 @@ class VersionDialog extends Component {
 const style = {
   svgIcon: {
     width: "16px",
-    height: "16px",
-  },
+    height: "16px"
+  }
 };
 
 export default VersionDialog;