From 9a7d98316ceb6a4f219076c724b7aba03aa8fbc9 Mon Sep 17 00:00:00 2001
From: Jesse-Ma <24167796@qq.com>
Date: Mon, 6 Jun 2022 10:56:12 +0800
Subject: [PATCH] tag1

---
 public/favicon.png.bak  | Bin 1125 -> 0 bytes
 public/favicon.png.bak2 | Bin 1262 -> 0 bytes
 public/index.html       |   5 +-
 src/api/note.js         |  21 ++++-
 src/libs/noteStorage.js |  13 +--
 src/libs/storage.js     |   8 ++
 src/router/index.js     |  14 ++-
 src/views/BlankNote.vue | 189 ++++++++++++++++++++++++++++++++++++++++
 src/views/EditNote.vue  | 105 ++++++++++++++++++----
 src/views/ViewNote.vue  |  85 +++++++++++++-----
 vue.config.js           |   2 +-
 11 files changed, 392 insertions(+), 50 deletions(-)
 delete mode 100644 public/favicon.png.bak
 delete mode 100644 public/favicon.png.bak2
 create mode 100644 src/views/BlankNote.vue

diff --git a/public/favicon.png.bak b/public/favicon.png.bak
deleted file mode 100644
index 8925a723e2dbc41f2e5f95cfedca39124e34fd28..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1125
zcmeAS@N?(olHy`uVBq!ia0vp^vq6}H4M>(IzU%=~jKx9jP7LeL$-D$|SkfJR9T^xl
z_H+M9WCij$3p^r=85sBufiR<}hF1dv1M@FW7srr_xVLxrW(Oxqw0%@RzGS88E&gQD
zK<!1BR&C|b?dagR<|rd8!pi<~!D>A{*MgS{x;tJxdR4Dr(V=j|aivno#wLXjb^A8G
zu4P+IpMRNgE8+H(Id?4OujhN7xc%`_?Yt>wo@YfR6(0QPcQ`93ozlT;bc9VZshMY^
zW7`b{;gk0_pRJp>DZc;sT7zHLmL0zrU6*si-f@Pj(zc!N?bm*I(kmXGSaPVY{?DuV
zXR_z-d2T=Z``Y)jQh$AmIDD~onr-2QIcIhMalX==v+?YisE0SL^>xfQ%<S~Pm+h_D
z|JM6>!~dLnvt(y?JuI#KXewi$u(GuGALkS&@!MBg1!vcNJ-GX<*4Ch$?j^F`<+=0u
z&+~pLSpHoqOTT2JuJkFPFwtnq@6%4p+zQ?G^U__}f1FLze%v@^`S$FaYE!2i?S%W>
zd>hxY{f-OmSj)AvcD+U3=D)W0bUT&`MmPME-8oZv?z1h={s`~rSQ|EH%F^%eHF{&d
z`?_n*{>VSM^M*@MFYmOMcVl<`yd!W|VRFljS4U(wzFYCP`m<`{edTQvJPz%1&q)-y
zT-$#`NkQ+o+(y@ckngrh-Hj{WR38yDSG@PVL-*OCE$;=R4_zq+YG?_5SAC?7HTCzr
z-x4bSB)GZLp65LKy5#SU-xq$zPgsBv^3FLE6wOWuphpO)!ux#A`(;a6WWL-R{Wn~|
zB<Zu|?N8IBZL)Lw^P>Je?J&K+Gbj7Jym7ks>i@zk#5VqIpL{>z=H<QH>Rv2*I{*Hr
zUjKHT^2c+&d-iz#PurU%5Y2k${M_7KSMqhguaBzxv+ethlBZLa?zTP?bn+KS{<hXm
z`LFNp73_SSzUJ-01yAF7jEl5gazc}yg!SEEI(8yfYU5P_<#NL$VXt2&RJU1q-2#%p
zumq7^kAY-I$6+AJ(e(;QN_3n8kzB8V<P7f1K(b}!a}XI__JpnHMnI5VQL`I$f{7|&
tO`;*dZ1?kg<E%$%(7c8ewMuFA3>)@$sJbW%Tm}{m44$rjF6*2UngFia{%-&P

diff --git a/public/favicon.png.bak2 b/public/favicon.png.bak2
deleted file mode 100644
index 158e15ef00539fa09dfb68b80525a0eed9bb5cdf..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1262
zcmeAS@N?(olHy`uVBq!ia0vp^vq6}H4M>(IzU%=~jKx9jP7LeL$-D$|SkfJR9T^xl
z_H+M9WCij$3p^r=85sDEfH31!Z9ZwBnr2TI$B>G+w|CBGUoMw9{;~YhvaM2E?Sn*D
z@*P`ZWxh1P^$uUMmA+irjO6yl_C|}cz%P%E9(MVlAo|td1OErJvRjTK2c7x7xSN&A
z6y9u--O`&m=kLsGDW1O~F9h7aQuq1P_v4=#RqsEU99%K!yY)hqFbyLIg?D+4yOhmN
z2uP=N@ERRqlT2#n+32V?;r`~Q^V4(R{p)zjHvh(-3&GyJygP({L@Fd{`<#t>ckpph
z%+7;>uV<ayA)NkW+U|%cb_Mr@*vleMKbMbwJ+W5o{;hX@7d-y;<SORxY_FeoSc`R=
z!LRMPFFSS~Rt-6t_ILT+ql?6I=N|p=ZOY^9pO1vQb0ePnEqJo~#-{u6n}6E>+w|`1
z=XVpO)(G65eN2t(+Me{|Nfk>O_}`jkr<I0&xNm*iXyKmAT1l(T?B;H8x!*pueBU#F
z`vUb3QBRUrPwP{?`TbSPjj#jzp35dhvwqvVRdJi?iZ|6q3vXAI>^FV;rc6D8Yh&e$
zvlC}q?796&*0a1xC~5WNjpCKr_jYeKD)N@MN?OZVF6Dbf&FJ5%lR|&xL+}0cQjDsZ
zslUp(<A#*V-V0%JTmSF>?3#FA*=&Btp?&T-b|Tkm`)@EQ==_%3$Qlsv-8PB4alxDF
zBVtB%_r7=NKKZldy<qealcM{|+d6{ZRUc{VdR4o=<hANQNp8{TU5~E)d?WAuuj+c#
zxqAiuRqZzvoO329qQ^=brNYH(+um<Dxqkl^pW|WQIrg~a`0Y_oJ=uLf^7&rxY5R+>
zKC81!UBB<wnM=O2?-*|gJF=~%B5U$ix%b<9!~LROT@0=MdpmXZzn9UczkR#)WB;C%
z_ub*^*p|v$#{EAWn7zODT#&N4PWj&+-+2~kGjnatrk&fJo~U|co7cut-KY0w`NsV?
zW>vpGW936ex4hnt++K;DTOVKjAff#IZpYd_iJke%W(!yJ$0TJhSkW7k^tn@`2S~0o
z=!;3>?l1tdxfd(|u^ShF*oyl>Y)gBf%I+C%Kz8?zr*7-6ckqf{Rlc4LOUD$47$`H)
z-jI*6IXCacNzeD&QOzNI|LC>4-*Za)?`*mA)!3}^(Tvn>UvJ!SIXGA8L{h6#`P=B$
zm64}yD{^)oR6n{Okp&BW`S0$&wb$lG`t16j7w<aTvM6oK`uRL^_HO&2zWlluE0?yh
t-RX4B*(Y-1hJa6vR4azhl+yk)=2raO<Rp0V8nBFF@O1TaS?83{1ORn(N-qEa

diff --git a/public/index.html b/public/index.html
index e485b4f..76b8126 100644
--- a/public/index.html
+++ b/public/index.html
@@ -11,7 +11,9 @@
 
         }
     </style>
-    <script src="https://www.recaptcha.net/recaptcha/api.js?render=6Le0CJwfAAAAAGk0J6aDngi7Dya-b0qyFRdIf6Wu"></script>
+    <!--
+        <script src="https://www.recaptcha.net/recaptcha/api.js?render=6Le0CJwfAAAAAGk0J6aDngi7Dya-b0qyFRdIf6Wu"></script>
+
     <script type="text/javascript">
         const CAPTCHA_CLIENT_SECRET = "6Le0CJwfAAAAAGk0J6aDngi7Dya-b0qyFRdIf6Wu";
         window.onload = () => {
@@ -32,6 +34,7 @@
             });
         };
     </script>
+        -->
 </head>
 <body style="background-color: #dddddd;">
 <noscript>
diff --git a/src/api/note.js b/src/api/note.js
index 84bcfc1..eed9b9f 100644
--- a/src/api/note.js
+++ b/src/api/note.js
@@ -4,12 +4,13 @@ import {getStoreKey} from "@/api/lock";
 import storage from "@/libs/storage";
 
 export function saveNote(noteForm) {
-
     let storeKey = getStoreKey(noteForm.key);
     let storeText = storage.local.getText(storeKey + '.text');
     let note = {
         "lock": storeText.substring(0, 1),
-        "text": storeText.substring(35)
+        "cipher": storeText.substring(2, 34),
+        "text": storeText.substring(35),
+        "key": noteForm.key
     }
 
     console.log("n"+ storeText)
@@ -23,6 +24,22 @@ export function saveNote(noteForm) {
     )
 }
 
+export function deleteNote(key) {
+    let storeKey = getStoreKey(key);
+    let storeText = storage.local.getText(storeKey + '.text');
+    let note = {
+        "cipher": storeText.substring(2, 34),
+        "key": key
+    }
+
+    return axios({
+            url: '/note/' + key +'/delete',
+            method: 'post',
+            data: note
+        }
+    )
+}
+
 // export function getSecretKey(key, password) {
 //     console.log("getSecretKey");
 //     let secretKey = '';
diff --git a/src/libs/noteStorage.js b/src/libs/noteStorage.js
index 987b6a9..a217466 100644
--- a/src/libs/noteStorage.js
+++ b/src/libs/noteStorage.js
@@ -18,11 +18,6 @@ export function setStoreText(text, secret, password) {
     let storeText = aesEncrypt(text, secretKey);
     storeText = zip(storeText);
 
-    console.log("sssssssss" + secret.cipher)
-    console.log("sssssssss" + password)
-    console.log("sssssssss" + secretKey)
-    console.log("s" + storeText)
-
     let lock = '0';
     if (password) {
         lock = '1';
@@ -32,6 +27,14 @@ export function setStoreText(text, secret, password) {
 }
 
 
+export function clearStoreText(key) {
+    if (!key) {
+        return;
+    }
+    storage.local.delete(key);
+}
+
+
 export function getEscapeText(text) {
     let textEscape = escapeHtml(text);
     textEscape = textEscape.replaceAll(" ", "&nbsp;");
diff --git a/src/libs/storage.js b/src/libs/storage.js
index dfed3df..d07544f 100644
--- a/src/libs/storage.js
+++ b/src/libs/storage.js
@@ -15,6 +15,10 @@ class Session {
         return JSON.parse(sessionStorage.getItem(key));
     }
 
+    delete(key){
+        sessionStorage.removeItem(key);
+    }
+
     setText(key, value) {
         sessionStorage.setItem(key, value);
     }
@@ -33,6 +37,10 @@ class Local {
         return JSON.parse(localStorage.getItem(key));
     }
 
+    delete(key){
+        localStorage.removeItem(key);
+    }
+
     setText(key, value) {
         localStorage.setItem(key, value);
     }
diff --git a/src/router/index.js b/src/router/index.js
index 934d309..3d74727 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -3,8 +3,9 @@ import VueRouter from 'vue-router'
 import EditNote from '@/views/EditNote.vue'
 import ViewNote from '@/views/ViewNote.vue'
 import ErrorView from '@/views/ErrorView.vue'
-import {getKeyMeta, getNoteMeta} from "@/api/note";
-import {getStoreKey} from "@/api/lock";
+import BlankNote from '@/views/BlankNote.vue'
+import { getKeyMeta, getNoteMeta } from "@/api/note";
+import { getStoreKey } from "@/api/lock";
 import storage from "@/libs/storage";
 
 Vue.use(VueRouter)
@@ -25,7 +26,7 @@ function getNoteView() {
     let key = path.substr(1, path.length - 1);
 
     let storeKey = getStoreKey(key);
-    if (keyMeta) {
+    if (keyMeta && keyMeta.cipher) {
         storage.session.setObject(storeKey + '.keyMeta', keyMeta);
         return EditNote;
     }
@@ -33,7 +34,12 @@ function getNoteView() {
     let noteMeta = null;
     noteMeta = getNoteMeta(key);
     if (!noteMeta || !noteMeta.key) {
-        return EditNote;
+        let storeText = storage.local.getText(storeKey + '.text');
+        if(storeText){
+            return EditNote;
+        }else{
+            return BlankNote;
+        }
     }
 
     storage.session.setObject(storeKey + '.noteMeta', noteMeta);
diff --git a/src/views/BlankNote.vue b/src/views/BlankNote.vue
new file mode 100644
index 0000000..efd481c
--- /dev/null
+++ b/src/views/BlankNote.vue
@@ -0,0 +1,189 @@
+<style scoped>
+.layout {
+  height: 100%;
+  background: #dddddd;
+}
+
+.header {
+  background: #dddddd;
+}
+
+.ivu-layout-header {
+  line-height: normal;
+  height: auto;
+  padding: 0px;
+}
+
+
+.content {
+  background: #dddddd;
+}
+
+.ivu-layout-content {
+  padding: 0px;
+}
+
+
+
+.layout-footer-center {
+  background: #dddddd;
+  text-align: center;
+}
+
+
+
+
+
+.ivu-card-bordered {
+  border: 0px solid #dcdee2;
+  border-color: #e8eaec;
+}
+
+
+
+.noteKey {
+  color: red;
+  font-weight: bold;
+  font-size: 18px;
+  font-family: "Bitstream Vera Sans Mono", Consolas, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei"
+}
+</style>
+
+<style>
+#noteText {
+  color: black;
+  padding: 15px;
+  vertical-align: top;
+  width: 100%;
+  height: auto;
+  background: white;
+  min-width: 200px;
+  border-radius: 0px;
+  overflow-y: auto;
+  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
+  /*min-height: 400px;*/
+  font-size: 14px;
+}
+
+
+#noteText::selection {
+  background: firebrick;
+  color: white;
+}
+
+#noteText::-moz-selection {
+  background: firebrick;
+  color: white;
+}
+
+#noteText br::selection {
+  background: firebrick;
+  color: white;
+}
+
+#noteText br::-moz-selection {
+  background: firebrick;
+  color: white;
+}
+</style>
+<template>
+  <div class="layout" onkeydown="keydown">
+    <Layout>
+      <Affix :offset-top="0">
+
+
+        <Header class="header">
+          <div>
+            <Row>
+              <Col :xs="{ span: 24, offset: 0 }" :sm="{ span: 22, offset: 1 }" :md="{ span: 20, offset: 2 }"
+                :lg="{ span: 18, offset: 3 }" :xl="{ span: 16, offset: 4 }" :xxl="{ span: 16, offset: 4 }">
+
+
+              <div style="background: white;width:100%;height:40px;">
+                <img style="height:40px;float:left;" src="favicon.png">
+
+                <div style="float:right;width:auto;">
+                  <Button-group size="large">
+                    <Button type="error" style="margin-left:0px; border-radius: 0px;font-size: 24px;"
+                      @click="createNote()" icon="md-add"></Button>
+
+                  </Button-group>
+                </div>
+
+
+
+              </div>
+
+
+
+
+              </Col>
+            </Row>
+          </div>
+        </Header>
+      </Affix>
+      <Content class="content">
+        <div style="min-height: 650px;">
+          <Row>
+            <Col :xs="{ span: 24, offset: 0 }" :sm="{ span: 22, offset: 1 }" :md="{ span: 20, offset: 2 }"
+              :lg="{ span: 18, offset: 3 }" :xl="{ span: 16, offset: 4 }" :xxl="{ span: 16, offset: 4 }">
+            <Card :padding="0">
+              <div style="border-left: 0px solid #FF3366;">
+                <div id="noteText" style="text-align: center;min-height: 650px;" class="monoFt">
+                  <h1>blank</h1>
+                </div>
+              </div>
+            </Card>
+            </Col>
+          </Row>
+        </div>
+      </Content>
+
+
+      <Footer class="layout-footer-center">2022 &copy; flagnote.com</Footer>
+
+    </Layout>
+
+
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'BlankNote',
+  components: {},
+  props: {},
+  data() {
+    return {
+      noteForm: {
+        url: '',
+        text: '',
+        escapeText: '',
+        key: '',
+        md5: '',
+        lock: '0',
+      },
+      secret: {
+        storeKey: '',
+        secretKey: '',
+        cipher: '',
+      },
+      state: {
+        lock: '0',
+        locking: '0',
+        commited: '0'
+      }
+    }
+  },
+  created() {
+    this.noteForm.key = this.$route.params.name;
+  },
+  methods: {
+    createNote() {
+      window.open("/");
+    }
+
+  }
+}
+</script>
+
diff --git a/src/views/EditNote.vue b/src/views/EditNote.vue
index 77183fd..22645fa 100644
--- a/src/views/EditNote.vue
+++ b/src/views/EditNote.vue
@@ -52,7 +52,7 @@
 <style>
 #noteText {
   color: black;
-  padding: 10px;
+  padding: 15px;
   vertical-align: top;
   width: 100%;
   height: auto;
@@ -93,18 +93,67 @@
 
 
               <div style="background: white;width:100%;height:40px;">
-                <img style="height:40px;float:left;" src="favicon.png">
+                <div style="float:left;width:auto;">
 
-                <div style="height: 40px;float: left;padding-top: 15px;padding-left: 20px;">
-                  <Icon type="md-create" style="font-size: 22px;color:red" /><a class="noteKey">{{ noteForm.key }}</a>
+                  <Button-group size="large">
+
+
+                  </Button-group>
+
+                </div>
+                <img style="height:40px;float:left;" src="favicon.png">
+                <div style="float:left;width:auto;">
+
+                  <Button-group size="large">
+
+
+
+                  </Button-group>
+
+                </div>
+
+
+
+
+
+                <div style="float:right;width:auto;">
+
+                  <Button-group size="large">
+
+                    <Button v-show="!showPassword" type="error"
+                      style="margin-right:5px; border-radius: 0px;font-size: 24px;" @click="showInput()"
+                      icon="md-unlock"></Button>
+
+                    <Input v-show="!showPassword">
+                    <Button slot="append" type="error" style="margin-right:5px; border-radius: 0px;font-size: 24px;"
+                      icon="md-checkmark-circle"></Button>
+                    </Input>
+
+
+                    <Button type="error" :loading="loading"
+                      style="margin-right:5px; border-radius: 0px;font-size: 24px;" @click="submitNote()"
+                      icon="md-cloud-upload"></Button>
+
+
+                    <Button type="error" style="margin-left:0px; border-radius: 0px;font-size: 24px;"
+                      @click="createNote()" icon="md-add"></Button>
+                    <Button type="error" style="margin-left:0px; border-radius: 0px;font-size: 24px;"
+                      @click="dropNote()" icon="md-trash"></Button>
+
+                  </Button-group>
                 </div>
 
                 <div style="float:right;width:auto;">
+
                   <Button-group size="large">
-                    <Button type="error" :loading="loading" style="margin-left:5px; border-radius: 0px;font-size: 24px;"
-                      @click="submitNote()" icon="md-cloud-upload"></Button>
-                    <Button type="error" style="margin-left:5px; border-radius: 0px;font-size: 24px;"
-                      @click="createNote()" icon="md-add"></Button>
+
+                    <!--
+
+                    <Button v-show="!show" type="error" style="margin-left:5px; border-radius: 0px;font-size: 24px;"
+                      @click="showNote()" icon="md-eye"></Button>
+                    <Button v-show="show" type="error" style="margin-left:5px; border-radius: 0px;font-size: 24px;"
+                      @click="hideNote()" icon="md-eye-off"></Button>
+                    -->
 
                   </Button-group>
                 </div>
@@ -116,7 +165,8 @@
                 <Button-group size="default">
                   <Button type="error" @click="unLockNote()" icon="md-eye"></Button>
                   <Button type="error" @click="lockNote()" icon="md-eye-off"></Button>
-                </Button-group>
+                    <Button type="error" style="margin-left:5px; border-radius: 0px;font-size: 24px;"
+                      @click="dropNote()" icon="md-trash"></Button>                </Button-group>
 
               </div>
               -->
@@ -153,7 +203,7 @@
               :lg="{ span: 18, offset: 3 }" :xl="{ span: 16, offset: 4 }" :xxl="{ span: 16, offset: 4 }">
             <Card :padding="0">
               <Form :model="noteForm" :label-width="80">
-                <div id="wrapper" style="border-left: 3px solid #FF3366;">
+                <div id="wrapper" style="border-left: 0px solid #FF3366;">
 
                   <Input element-id="noteText" type="textarea" :border="false" v-model="noteForm.text"
                     :autosize="{ minRows: 30, maxRows: 1024 }" placeholder="Enter something..." v-on:input="log"
@@ -172,7 +222,7 @@
 
       </Content>
 
-      <Footer class="layout-footer-center">2022 &copy; openif.com</Footer>
+      <Footer class="layout-footer-center">2022 &copy; flagnote.com</Footer>
     </Layout>
     <Modal v-model="modal1" title="Common Modal dialog box title" @on-ok="ok" @on-cancel="cancel">
 
@@ -204,6 +254,7 @@ export default {
   components: {},
   data() {
     return {
+      show: true,
       loading: false,
       modal1: false,
       showExt: false,
@@ -244,6 +295,7 @@ export default {
     }
 
     if (this.state.lock == "1") {
+      this.show = false;
       this.noteForm.text = "*****lock*****";
       return;
     } else {
@@ -264,6 +316,12 @@ export default {
   computed: {},
   watch: {},
   methods: {
+    showInput() {
+      this.showPassword = true;
+    },
+    hideInput() {
+      //this.showPassword = false;
+    },
     change(status) {
       this.showPassword = status;
     },
@@ -324,7 +382,7 @@ export default {
         //   //document.body.appendChild(canvas);
         // });
 
-      } else if (event.ctrlKey && event.which == 13) {
+      } else if (event.ctrlKey && (event.which == 13)) {
         this.save().then(res => {
           if (res) {
             location.reload();
@@ -352,7 +410,7 @@ export default {
         }
       });
     },
-    lockNote() {
+    hideNote() {
       if (this.state.locking == "1") {
         return;
       }
@@ -363,6 +421,8 @@ export default {
         return;
       }
 
+
+
       let password = '123456';
 
       setStoreText(this.noteForm.text, this.secret, password);
@@ -378,11 +438,13 @@ export default {
       noteText.selectionStart = 0;
       noteText.selectionEnd = 1;
 
-
+      this.show = false;
       this.state.locking = "0";
 
+
+
     },
-    unLockNote() {
+    showNote() {
       if (this.state.locking == "1") {
         return;
       }
@@ -426,7 +488,7 @@ export default {
           this.noteForm.text = plainText.substring(9);
           this.state.lock = "0";
           setStoreText(this.noteForm.text, this.secret);
-
+          this.show = true;
           this.state.locking = "0";
         } else {
           alert("password is wrong!")
@@ -438,10 +500,21 @@ export default {
         this.state.locking = "0";
       }
 
+
+
+    },
+    refresh() {
+      location.reload();
     },
     createNote() {
       window.open("/");
     },
+    dropNote() {
+      storage.local.delete(this.secret.storeKey + '.text');
+      storage.session.delete(this.secret.storeKey + '.keyMeta');
+      location.reload();
+
+    },
     bindEvent() {
       if (document.body.createTextRange) {
         Jquery(document).keydown(function (e) {
diff --git a/src/views/ViewNote.vue b/src/views/ViewNote.vue
index 13c8efa..ed2a1f2 100644
--- a/src/views/ViewNote.vue
+++ b/src/views/ViewNote.vue
@@ -52,7 +52,7 @@
 <style>
 #noteText {
   color: black;
-  padding: 10px;
+  padding: 15px;
   vertical-align: top;
   width: 100%;
   height: auto;
@@ -86,8 +86,10 @@
   color: white;
 }
 
-
-
+button span {
+  font-size: 18px;
+  margin-left: -1px !important;
+}
 </style>
 <template>
   <div class="layout" onkeydown="keydown">
@@ -98,39 +100,38 @@
         <Header class="header">
           <div>
             <Row>
-              <Col :xs="{ span: 24, offset: 0}" :sm="{ span: 22, offset: 1 }" :md="{ span: 20, offset: 2 }"
+              <Col :xs="{ span: 24, offset: 0 }" :sm="{ span: 22, offset: 1 }" :md="{ span: 20, offset: 2 }"
                 :lg="{ span: 18, offset: 3 }" :xl="{ span: 16, offset: 4 }" :xxl="{ span: 16, offset: 4 }">
 
 
               <div style="background: white;width:100%;height:40px;">
                 <img style="height:40px;float:left;" src="favicon.png">
+                <div style="float:left;width:auto;">
+
+                  <Button-group size="large">
+
+                    <Button type="error"
+                      style="margin-left:5px; border-radius: 0px;font-size: 24px; font-family: Arial, sans-serif"
+                      icon="md-cloud-done">{{ this.noteForm.ttlDesc }}</Button>
+
+                  </Button-group>
 
-                <div style="height: 40px;float: left;padding-top: 15px;padding-left: 20px;">
-                  <Icon type="md-cloud-done" style="font-size: 22px;color:red" /><a class="noteKey">{{ noteForm.key
-                  }}</a>
                 </div>
 
 
                 <div style="float:right;width:auto;">
                   <Button-group size="large">
-                    <Button type="error" style="margin-left:5px; border-radius: 0px;font-size: 24px;"
-                      @click="deleteNote()" icon="md-trash"></Button>
-                    <Button type="error" style="margin-left:5px; border-radius: 0px;font-size: 24px;"
+                    <Button type="error" style="margin-left:0px; border-radius: 0px;font-size: 24px;"
                       @click="createNote()" icon="md-add"></Button>
+                    <Button type="error" style="margin-left:0px; border-radius: 0px;font-size: 24px;"
+                      @click="dropNote()" icon="md-trash"></Button>
                   </Button-group>
                 </div>
 
 
 
-                <!--
-              <div style="float:right;width:auto;">
-                <Button-group size="default">
-                  <Button type="error" @click="unLockNote()" icon="md-eye"></Button>
-                  <Button type="error" @click="lockNote()" icon="md-eye-off"></Button>
-                </Button-group>
 
-              </div>
-              -->
+
 
 
                 <!--
@@ -160,10 +161,10 @@
       <Content class="content">
         <div style="min-height: 650px;">
           <Row>
-            <Col :xs="{ span: 24, offset: 0}" :sm="{ span: 22, offset: 1 }" :md="{ span: 20, offset: 2 }"
+            <Col :xs="{ span: 24, offset: 0 }" :sm="{ span: 22, offset: 1 }" :md="{ span: 20, offset: 2 }"
               :lg="{ span: 18, offset: 3 }" :xl="{ span: 16, offset: 4 }" :xxl="{ span: 16, offset: 4 }">
             <Card :padding="0">
-              <div style="border-left: 3px solid #FF3366;">
+              <div style="border-left: 0px solid #FF3366;">
                 <div id="noteText" style="text-align: left;min-height: 650px;" class="monoFt"
                   v-html="this.noteForm.escapeText">
                   view2
@@ -177,7 +178,7 @@
       </Content>
 
 
-
+      <Footer class="layout-footer-center">2022 &copy; flagnote.com</Footer>
 
     </Layout>
 
@@ -190,6 +191,7 @@
 import { aesDecrypt, md5, unzip } from "@/libs/secret";
 import Jquery from "jquery";
 import { getSecretKey, getStoreKey } from "@/api/lock";
+import { deleteNote } from "@/api/note";
 import storage from "@/libs/storage";
 import { getEscapeText } from "@/libs/noteStorage";
 
@@ -206,6 +208,8 @@ export default {
         key: '',
         md5: '',
         lock: '0',
+        ttl: 3600,
+        ttlDesc: '',
       },
       secret: {
         storeKey: '',
@@ -228,12 +232,42 @@ export default {
       this.state.lock = noteMeta.lock;
       this.secret.cipher = noteMeta.cipher;
       this.noteForm.md5 = noteMeta.md5;
+      this.noteForm.ttl = noteMeta.ttl;
+      this.startClock();
+
       this.loadText();
     }
 
     this.bindEvent();
   },
   methods: {
+    startClock() {
+      let that = this;
+      window.setInterval(function () {
+        let ittl = parseInt(that.noteForm.ttl / 1000);
+        let mins = parseInt(ittl / 60);
+        if (mins < 10) {
+          mins = "0" + mins;
+        }
+        if (mins < 0) {
+          mins = "00";
+        }
+        let seds = parseInt(ittl % 60);
+        if (seds < 10) {
+          seds = "0" + seds;
+        }
+        if (seds < 0) {
+          seds = "00";
+        }
+        that.noteForm.ttlDesc = mins + ":" + seds;
+        that.noteForm.ttl -= 1000;
+        if (that.noteForm.ttl <= 0) {
+          that.storage.local.delete(that.secret.storeKey + '.text');
+          that.storage.session.delete(that.secret.storeKey + '.keyMeta');
+          location.reload();
+        }
+      }, 1000)
+    },
     decryptNote() {
       // let password = "123456";
       // let secretKey = getSecretKey(this.noteForm.key, password);
@@ -243,6 +277,15 @@ export default {
     createNote() {
       window.open("/");
     },
+    dropNote() {
+      deleteNote(this.noteForm.key).then(res => {
+        if (res) {
+          storage.local.delete(this.secret.storeKey + '.text');
+          storage.session.delete(this.secret.storeKey + '.keyMeta');
+          location.reload();
+        }
+      });
+    },
     loadText() {
 
       let password;
diff --git a/vue.config.js b/vue.config.js
index 8c3be0d..1d3a887 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -4,7 +4,7 @@ module.exports = defineConfig({
     devServer: {
         proxy: {
             '/note': {
-                target: 'http://localhost:3333/',  // 后台接口域名
+                target: 'http://localhost:55555/',  // 后台接口域名
                 secure: false,  // 如果是https接口，需要配置这个参数
                 changeOrigin: true,  //是否跨域
                 pathRewrite:{