添加跳转和下载链接

src/pages/index/index.jsx

@@ -155,7 +155,8 @@ const Index = () => {
             // hasBorder={false}
             thumb={phone}
             onClick={() => {
-             window.location.href="https://mp.weixin.qq.com/mp/appmsgalbum?__biz=MzU4NTgyNDUxNw==&action=getalbum&album_id=3403853254399082501#wechat_redirect"
+              window.location.href =
+                "https://mp.weixin.qq.com/mp/appmsgalbum?__biz=MzU4NTgyNDUxNw==&action=getalbum&album_id=3403853254399082501#wechat_redirect";
             }}
           />
           <AtListItem
@@ -164,7 +165,8 @@ const Index = () => {
             // hasBorder={false}
             thumb={robot}
             onClick={() => {
-              window.location.href="https://mp.weixin.qq.com/mp/appmsgalbum?__biz=MzU4NTgyNDUxNw==&action=getalbum&album_id=3545545030499270661#wechat_redirect"
+              window.location.href =
+                "https://mp.weixin.qq.com/mp/appmsgalbum?__biz=MzU4NTgyNDUxNw==&action=getalbum&album_id=3545545030499270661#wechat_redirect";
             }}
           />
           <AtListItem
@@ -173,7 +175,8 @@ const Index = () => {
             // hasBorder={false}
             thumb={nomad}
             onClick={() => {
-              window.location.href="https://mp.weixin.qq.com/mp/appmsgalbum?__biz=MzU4NTgyNDUxNw==&action=getalbum&album_id=3545541605766168582#wechat_redirect"
+              window.location.href =
+                "https://mp.weixin.qq.com/mp/appmsgalbum?__biz=MzU4NTgyNDUxNw==&action=getalbum&album_id=3545541605766168582#wechat_redirect";
             }}
           />
         </AtList>
@@ -189,7 +192,14 @@ const Index = () => {
             <AtIcon value="file-generic" size="30" color="#F00"></AtIcon>{" "}
             markdown转emoji编辑器
           </View>
-          <AtIcon value="download-cloud" size="30" color="#F00"></AtIcon>
+          <AtIcon
+            value="download-cloud"
+            size="30"
+            color="#F00"
+            onClick={() => {
+              setisOpened(true);
+            }}
+          ></AtIcon>
         </View>
 
         {/* <View className="software-emoji">
@@ -236,6 +246,47 @@ const Index = () => {
       {/* <View className="payBtn">
         <AtButton type="primary">立即购买 -- 29.8元</AtButton>
       </View> */}
+
+      <View className="emojiModel">
+        {/* 软件下载模态窗 */}
+        <AtModal isOpened={isOpened}>
+          <AtModalHeader>emoji编辑器</AtModalHeader>
+          <AtModalContent>
+            <View className="modelText">
+              emoji编辑器是将markdown转换成标准的emoji格式
+              <br />
+              适用于各种图文场景
+              <br />
+              - 平台:小红书/微博/微信"小绿书"朋友圈
+              <br />- 评论区
+            </View>
+            {/* 软件图片展示 */}
+            <View className="model-emoji">
+              <Image
+                style="width: 100%;height: 240px;background: #fff;"
+                src={emoji}
+              />
+            </View>
+            {/* <View>
+              百度网盘链接：https://pan.baidu.com/s/1XXVnMimjUD8qVdmaVhb6rg?pwd=hqyo
+              <br />
+              提取码：hqyo
+            </View> */}
+          </AtModalContent>
+          <AtModalAction>
+            <Button
+              onClick={() => {
+                setisOpened(false);
+              }}
+            >
+              取消
+            </Button>
+            <Button onClick={() => {
+              window.location.href="https://pan.baidu.com/s/1XXVnMimjUD8qVdmaVhb6rg?pwd=hqyo"
+            }}>下载</Button>
+          </AtModalAction>
+        </AtModal>
+      </View>
     </View>
   );
 };

src/pages/index/index.scss

@@ -104,6 +104,19 @@
     }
   }
 
+  .emojiModel{
+
+    .modelText{
+      font-size: 22px;
+    }
+    .model-emoji{
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: center;
+    }
+  }
+
   .payBtn {
     position: fixed;
     bottom: 0;