分享中心添加一个退出按钮

src/assets/index.js

@@ -1209,14 +1209,18 @@
                     icon: d.cover ? d.cover.replace(yuQueShareVars.yuQueImgBedBaseLink, yuQueShareVars.imgBedBaseLink) : `logo/${description.program}.png`
                 }
             })
-        let choise = await quickcommand.showSelectList(docs, { optionType: 'json' })
+        let choise = await quickcommand.showSelectList(docs, { optionType: 'json', showCancelButton: true })
+        if (choise) {
             let doc = await yuQueClient(`repos/${yuQueShareVars.releaseRepo}/docs/${choise.slug}?raw=1`)
             let body = doc.data.data.body
             let stringifyQc = body.match(/```json([\s\S]*)```/)[1]
             let qc = JSON.parse(stringifyQc)
-        $('#options').show()
             qc.fromShare = true
+            $('#options').show()
             editCurrentCommand(qc)
+        } else {
+            $('#options').show()
+        }
         utools.setExpendHeight(600)
     }
 
@@ -1371,6 +1375,10 @@
             }
             putDB(code, pushData, 'customFts');
             $("#customize").animate({ top: '100%' }, () => {
+                $("#customize").empty()
+                if (extraInfo && extraInfo.fromShare) {
+                    getSharedQCFromYuQue()
+                } else {
                     // 保存后标签跳转处理
                     var redirectTag, currentTag = $('.currentTag').text()
                     if (tags.length) {
@@ -1384,10 +1392,10 @@
                     }
                     showOptions(redirectTag);
                     location.href = '#' + code
-                $("#customize").empty()
                     let checkSwitch = $(`#${code} .checked-switch`)
                     checkSwitch.click()
                     checkSwitch.is(':checked') || checkSwitch.click()
+                }
             });
         }
     }
@@ -1497,6 +1505,8 @@
         if ($("#customize").is(":parent") && $("#featureList").is(":parent")) {
             $("#customize").animate({ top: '100%' });
             $("#customize").empty()
+            var extraInfo = $('#customize').data('extraInfo')
+            if (extraInfo && extraInfo.fromShare) getSharedQCFromYuQue()
         }
     }
 

src/assets/style/options.css

@@ -845,21 +845,34 @@ li.CodeMirror-hint {
     border-radius: 6px;
 }
 
-#quicktextarea button {
+.circleButton {
     position: absolute;
+    border: 0;
+    border-radius: 50%;
+    color: white;
+    cursor: pointer;
+    outline: none;
+}
+
+#quicktextarea .circleButton{
     right: 20px;
     bottom: 20px;
     height: 40px;
     width: 40px;
-    border: 0;
-    border-radius: 50%;
     background: #2196F3;
-    color: white;
-    cursor: pointer;
 }
 
-#quicktextarea button:hover {
+#quickselect .circleButton{
-    background: #6ab4f0;
+    right: 10px;
+    bottom: 10px;
+    height: 25px;
+    width: 25px;
+    background: #db4d14;
+    z-index: 1060;
+}
+
+.circleButton:hover {
+    filter: brightness(1.2);
 }
 
 /*quicktextarea*/

src/preload.js

@@ -167,7 +167,8 @@ quickcommand = {
             typeof opt.placeholder == 'undefined' && (opt.placeholder = "搜索，支持拼音")
             typeof opt.enableSearch == 'undefined' && (opt.enableSearch = true)
             if ($('#quickselect').length) $('#quickselect').remove()
-            $("body").append(`<div id="quickselect"><select id="selectBox"></select></div>`)
+            let cancelButton = opt.showCancelButton ? '<button class="circleButton">✕</button>' : ''
+            $("body").append(`<div id="quickselect"><select id="selectBox"></select>${cancelButton}</div>`)
             let item, data = []
             selects.forEach((s, i) => {
                 item = {}
@@ -189,6 +190,7 @@ quickcommand = {
                 // data: data,
                 width: "100%",
                 dropdownParent: $("#quickselect"),
+                closeOnSelect: false,
                 // 支持无限滚动
                 ajax: {
                     transport: (params, success, failure) => {
@@ -221,15 +223,22 @@ quickcommand = {
                 $("#quickselect .select2-search__field").val(text).trigger('input')
                 modWindowHeight($('.select2-results').outerHeight())
             }, opt.placeholder)
-            $('#selectBox').on('select2:select', function (e) {
+            // 关闭列表
-                let result = $('#selectBox').data('options')[$(this).val()]
+            let closeSelect = () => {
-                delete result.selected
                 $('#selectBox').off('select2:select')
                 utools.removeSubInput()
                 $("#quickselect").remove()
+            }
+            $('#selectBox').on('select2:select', function (e) {
+                let result = $('#selectBox').data('options')[$(this).val()]
+                delete result.selected
+                closeSelect()
                 reslove(result)
             })
-
+            $('.circleButton').click(() => {
+                closeSelect()
+                reslove(false)
+            })
         });
     },
 
@@ -265,11 +274,11 @@ quickcommand = {
             var html = `
             <div id="quicktextarea">
                 <textarea placeholder="${placeholder}"></textarea>
-                <button>✔</button>
+                <button class="circleButton">✔</button>
             </div>`
             $("body").append(html)
             $("#quicktextarea").addClass("fadeInUpWindow")
-            $("#quicktextarea > button").click(function () {
+            $(".circleButton").click(function () {
                 $("#quicktextarea").addClass("fadeOutDownWindow")
                 setTimeout(() => { $("#quicktextarea").remove() }, 300);
                 reslove($("#quicktextarea > textarea").val())