Merge remote-tracking branch 'origin/visu_firecontrol_01_siping_2.5d' into visu_firecontrol_01_siping_2.5d

src/views/system/login.vue

@@ -2,18 +2,53 @@
   <div class="login" :style="{ backgroundImage: 'url(' + backgroudImg + ')' }">
 
     <!-- 二维码开始 -->
-    <el-popover placement="top-start" trigger="hover" :show="bindQRCode">
-      <img :src="QRCode" width="120px" height="120px" alt="" />
-      <el-tag slot="reference" class="el-icon-mobile-phone" style="
-			position: absolute;
-			top: 1rem;
-			right: 1rem;
-			padding: 0 1rem;
-			cursor: pointer;
-		  " effect="dark">
-        下载APP</el-tag>
+<!--    <el-popover placement="top-start" trigger="hover" :show="bindQRCode">-->
+<!--      <img :src="QRCode" width="120px" height="120px" alt="" />-->
+<!--      <el-tag slot="reference" class="el-icon-mobile-phone" style="-->
+<!--			position: absolute;-->
+<!--			top: 1rem;-->
+<!--			right: 1rem;-->
+<!--			padding: 0 1rem;-->
+<!--			cursor: pointer;-->
+<!--		  " effect="dark">-->
+<!--        下载APP</el-tag>-->
+<!--    </el-popover>-->
+    <!-- 二维码结束 -->
+    <!-- 二维码开始 -->
+    <el-popover
+      placement="top-start"
+      trigger="click"
+      :show="bindQRCode"
+      popper-class="sj-pop"
+    >
+      <div class="img-container">
+        <a class="img-list" onclick="window.open('https://pan.baidu.com/s/1MlWyhFw6pEYiaLvzsje-BA?pwd=3jps')">
+          <img src="../../assets/images/login-b-1.png" alt="" />
+          <span>视频插件</span>
+        </a>
+        <a class="img-list" onclick="window.open('https://pan.baidu.com/s/1MlWyhFw6pEYiaLvzsje-BA?pwd=3jps')">
+          <img src="../../assets/images/login-b-2.png" alt="" />
+          <span>会议插件</span>
+        </a>
+        <el-popover placement="left" trigger="hover">
+          <img :src="QRCode" width="120px" height="120px" alt="" />
+          <div class="img-list" slot="reference">
+            <img src="../../assets/images/login-b-3.png" alt="" />
+            <span>手机APP</span>
+          </div>
+        </el-popover>
+        <a class="img-list" onclick="window.open('https://pan.baidu.com/s/1MlWyhFw6pEYiaLvzsje-BA?pwd=3jps')">
+          <img src="../../assets/images/login-b-4.png" alt="" />
+          <span>使用帮助</span>
+        </a>
+      </div>
+      <el-tag slot="reference" class="el-icon-info sj-tag" effect="dark">
+        用户引导</el-tag
+      >
     </el-popover>
     <!-- 二维码结束 -->
+
+
     <StarBackground />
     <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form to-right">
       <h3 class="title">{{ systemTitle.title }}</h3>
@@ -226,7 +261,13 @@
     },
   };
 </script>
-
+<style lang="scss">
+.sj-pop {
+  background: #369cfc !important;
+  border: 1px solid #369cfc;
+  border-radius: 10px;
+}
+</style>
 <style rel="stylesheet/scss" lang="scss" scoped>
   @import "@/assets/styles/base.scss";
 
@@ -352,4 +393,44 @@
   .login-code-img {
     height: 38px;
   }
+
+
+  .img-container {
+    width: 380px;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: center;
+    .img-list {
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      padding: 15px 10px;
+      border-radius: 10px;
+      color: white;
+
+      img {
+        width: 160px;
+        height: 106px;
+        border-radius: 10px;
+        margin-bottom: 8px;
+        box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+      }
+    }
+    .img-list:hover {
+      background: #dbf1ff;
+      color: #3e69fb;
+      font-weight: bolder;
+      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    }
+  }
+  .sj-tag {
+    position: absolute;
+    top: 1rem;
+    right: 1rem;
+    padding: 0 1rem;
+    cursor: pointer;
+  }
+
 </style>