From e8f78f9c8e3a63a0cc6814b78c9ff872d10a45a5 Mon Sep 17 00:00:00 2001
From: azhengzz <820108271@qq.com>
Date: Thu, 25 Mar 2021 11:50:10 +0800
Subject: [PATCH] =?UTF-8?q?=E5=9C=A8=E9=A1=B9=E7=9B=AE=E5=85=A8=E5=B1=80?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E4=B8=AD=E6=B7=BB=E5=8A=A0=3F=E5=B8=AE?=
 =?UTF-8?q?=E5=8A=A9=E6=8F=90=E7=A4=BA=E6=8C=89=E9=92=AE=EF=BC=8C=E5=B1=95?=
 =?UTF-8?q?=E7=A4=BA=E7=9B=B8=E5=85=B3=E4=BF=A1=E6=81=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ApiAutomationTest/app/static/css/base.css     | 26 ++++++++++++++
 ApiAutomationTest/app/static/js/base.js       | 24 ++++++++++++-
 ApiAutomationTest/app/templates/base.html     | 36 +++++++++++++++++++
 .../app/templates/scene/scene.html            |  6 ----
 4 files changed, 85 insertions(+), 7 deletions(-)

diff --git a/ApiAutomationTest/app/static/css/base.css b/ApiAutomationTest/app/static/css/base.css
index 045c3eb..797152b 100644
--- a/ApiAutomationTest/app/static/css/base.css
+++ b/ApiAutomationTest/app/static/css/base.css
@@ -38,6 +38,32 @@ body {
     background-image: url(/static/icon/bootstrap-icons/arrow-repeat-blue.svg);
 }
 
+.btn-help{
+    user-select: none;
+    cursor: pointer;
+    opacity: 1;
+    position: fixed;
+    display: flex;
+    background: white;
+    align-items: center;
+    justify-content: center;
+    bottom: 33px;
+    right: 33px;
+    width: 36px;
+    height: 36px;
+    border-radius: 100%;
+    font-size: 20px;
+    box-shadow: rgba(15, 15, 15, 0.1) 0 0 0 1px, rgba(15, 15, 15, 0.1) 0 2px 4px;
+    z-index: 101;
+    outline: none;
+}
+.btn-help:hover{
+    background-color: #ebebeb;
+}
+.btn-help:focus{
+    background-color: #cdcdcd;
+}
+
 .div-split-gutter-vertical{
     background-image: url(/static/icon/bootstrap-icons/three-dots-vertical.svg);
     background-repeat: no-repeat;
diff --git a/ApiAutomationTest/app/static/js/base.js b/ApiAutomationTest/app/static/js/base.js
index 85b2f7b..6bd9aec 100644
--- a/ApiAutomationTest/app/static/js/base.js
+++ b/ApiAutomationTest/app/static/js/base.js
@@ -57,6 +57,9 @@ $(document).ready(function () {
         });
     });
 
+    // 为帮助按钮设置弹出框
+    tippyHelpBtn();
+
 });
 
 let $btn_refresh_latest_report = $('#btn-refresh-latest-report');
@@ -200,4 +203,23 @@ jQuery.wait = function (selector, func, times, interval) {
 //         }, _interval);
 //     }
 //     return this;
-// };
\ No newline at end of file
+// };
+
+// 为帮助按钮设置弹出框
+function tippyHelpBtn() {
+    let $helpBtn = $('.btn-help');
+    tippy($helpBtn[0], {
+        trigger: 'click',
+        hideOnClick: true,
+        placement: 'top',
+        allowHTML: true,
+        interactive: true,
+        content: function (){
+            return $helpBtn.next().html();
+        },
+        appendTo: () => document.body,
+        zIndex: 200,
+        theme: 'light',
+        maxWidth: 'none',
+    });
+}
\ No newline at end of file
diff --git a/ApiAutomationTest/app/templates/base.html b/ApiAutomationTest/app/templates/base.html
index 99d4da6..ea35221 100644
--- a/ApiAutomationTest/app/templates/base.html
+++ b/ApiAutomationTest/app/templates/base.html
@@ -18,6 +18,10 @@
   <link href="{{ url_for('static', filename='plugins/toastr/toastr.min.css') }}" rel="stylesheet">
   <link href="{{ url_for('static', filename='plugins/sweetalert2/sweetalert2.min.css') }}" rel="stylesheet">
 {#  <link href="{{ url_for('static', filename='plugins/sweetalert2/themes/bootstrap-4/bootstrap-4.min.css') }}" rel="stylesheet">#}
+  <link href="{{ url_for('static', filename='plugins/tippyjs/tippy.js/themes/light.css') }}" rel="stylesheet">
+  <link href="{{ url_for('static', filename='plugins/tippyjs/tippy.js/themes/light-border.css') }}" rel="stylesheet">
+  <link href="{{ url_for('static', filename='plugins/tippyjs/tippy.js/themes/material.css') }}" rel="stylesheet">
+  <link href="{{ url_for('static', filename='plugins/tippyjs/tippy.js/themes/translucent.css') }}" rel="stylesheet">
   <link href="{{ url_for('static', filename='css/base.css') }}" rel="stylesheet">
   {%- endblock styles %}
   {%- endblock head %}
@@ -45,6 +49,36 @@
   {# application content needs to be provided in the app_content block #}
   {% block app_content %}{% endblock %}
   </div>
+  <div class="btn-help" role="button" tabindex="0">?</div>
+  <div style="display: none;">
+    <div class="card" style="width: 20vw; border: none;">
+      <div class="card-body">
+        <h5 class="card-title">帮助与操作指引</h5>
+        <p class="card-text">当前项目处于频繁更新的初步阶段，请大家提出宝贵意见。</p>
+      </div>
+      <ul class="list-group list-group-flush">
+        <li class="list-group-item">
+          <a href="https://gitee.com/azhengzz/api-automation-test/blob/master/README.md" class="card-link" target="_blank"><i class="fab fa-readme"></i> 点击查看操作介绍</a>
+        </li>
+        <li class="list-group-item">
+          <a href="https://gitee.com/azhengzz/api-automation-test/issues?assignee_id=&author_id=&branch=&collaborator_ids=&issue_search=&label_ids=&label_text=&milestone_id=&program_id=&scope=&sort=&state=all" class="card-link" target="_blank"><i class="fas fa-question-circle"></i> 使用问题请提issue</a>
+        </li>
+        <li class="list-group-item">
+          <a href="https://gitee.com/azhengzz/api-automation-test" class="card-link" target="_blank">
+            <svg class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em">
+                <path d="M384 1003.2c-145.6-41.6-276.8-155.2-340.8-297.6-46.4-102.4-46.4-284.8 0-388.8 48-105.6 152-212.8 259.2-264 128-62.4 291.2-62.4 419.2 0 107.2 51.2 211.2 160 259.2 264 49.6 113.6 48 273.6-8 388.8-105.6 228.8-366.4 360-588.8 297.6z" fill="#D90013"></path>
+                <path d="M203.2 820.8c-6.4-4.8-11.2-112-11.2-236.8 0-209.6 3.2-232 36.8-281.6 64-96 116.8-112 371.2-107.2l224 4.8v128l-228.8 8c-179.2 6.4-232 12.8-243.2 32-8 12.8-16 91.2-16 172.8v147.2h158.4c166.4 0 201.6-14.4 190.4-75.2-4.8-24-24-28.8-121.6-33.6l-115.2-4.8v-126.4h387.2l-6.4 118.4c-6.4 136-35.2 192-126.4 236.8-43.2 24-96 28.8-272 28.8-120 0-222.4-4.8-227.2-11.2z" fill="#FFFEFE"></path>
+            </svg>
+            Fork/Star on Gitee
+          </a>
+        </li>
+        <li class="list-group-item">
+          <div style="color: rgba(55, 53, 47, 0.4);">ApiAutomationTest: Version 0.2.0</div>
+        </li>
+      </ul>
+    </div>
+  </div>
+
   {%- endblock content %}
 
   {% block scripts %}
@@ -54,6 +88,8 @@
   <script src="{{ url_for('static', filename='plugins/socket.io/socket.io.js') }}"></script>
   <script src="{{ url_for('static', filename='plugins/toastr/toastr.min.js') }}"></script>
   <script src="{{ url_for('static', filename='plugins/sweetalert2/sweetalert2.all.min.js') }}"></script>
+  <script src="{{ url_for('static', filename='plugins/tippyjs/@popperjs/core/dist/umd/popper.min.js') }}"></script>
+  <script src="{{ url_for('static', filename='plugins/tippyjs/tippy.js/dist/tippy-bundle.umd.min.js') }}"></script>
   <script src="{{ url_for('static', filename='js/base.js') }}"></script>
   <script type="text/javascript">
     var csrf_token="{{ csrf_token() }}";
diff --git a/ApiAutomationTest/app/templates/scene/scene.html b/ApiAutomationTest/app/templates/scene/scene.html
index aea3879..33fb28e 100644
--- a/ApiAutomationTest/app/templates/scene/scene.html
+++ b/ApiAutomationTest/app/templates/scene/scene.html
@@ -2,10 +2,6 @@
 
 {% block styles %}
   {{ super() }}
-  <link href="{{ url_for('static', filename='plugins/tippyjs/tippy.js/themes/light.css') }}" rel="stylesheet">
-  <link href="{{ url_for('static', filename='plugins/tippyjs/tippy.js/themes/light-border.css') }}" rel="stylesheet">
-  <link href="{{ url_for('static', filename='plugins/tippyjs/tippy.js/themes/material.css') }}" rel="stylesheet">
-  <link href="{{ url_for('static', filename='plugins/tippyjs/tippy.js/themes/translucent.css') }}" rel="stylesheet">
   <link href="{{ url_for('static', filename='plugins/jquery.fancytree/skin-win8/ui.fancytree.min.css') }}" rel="stylesheet">
   <link href="{{ url_for('static', filename='plugins/handsontable/handsontable.full.min.css') }}" rel="stylesheet">
   <link href="{{ url_for('static', filename='css/scene/scene.css') }}" rel="stylesheet">
@@ -121,8 +117,6 @@ class="bg-gradient-grey"
 {% block scripts %}
   {{ super() }}
   <script src="{{ url_for('static', filename='plugins/Sortable/Sortable.js') }}"></script>
-  <script src="{{ url_for('static', filename='plugins/tippyjs/@popperjs/core/dist/umd/popper.min.js') }}"></script>
-  <script src="{{ url_for('static', filename='plugins/tippyjs/tippy.js/dist/tippy-bundle.umd.min.js') }}"></script>
   <script src="{{ url_for('static', filename='plugins/split.js/split.min.js') }}"></script>
   <script src="{{ url_for('static', filename='plugins/jquery.fancytree/jquery.fancytree-all-deps.min.js') }}"></script>
   <script src="{{ url_for('static', filename='plugins/jquery.fancytree/modules/jquery.fancytree.filter.js') }}"></script>