提示框组件封装

src/components/PromptText.vue

@@ -1,8 +1,13 @@
 <template>
     <div class="prompt-text" :class="typeClass">
         <div class="flex-text">
-            <img class="prompt-icon" :src="typeIcon" alt="">
-            <span class="prompt-desc">{{text}}</span>
+            <div class="flex">
+                <img class="prompt-icon" :src="typeIcon" alt="">
+                <span class="prompt-desc">{{text}}</span>
+            </div>
+            <div class="flex">
+                <slot name="next_desc" />
+            </div>
         </div>
         <div class="prompt-extra">
             <slot name="desc" />
@@ -60,6 +65,7 @@ export default {
   display: flex;
   align-items: center;
   align-self: stretch;
+  justify-content: space-between;
   z-index: 1;
 }
 .info{

src/views/elementGroups.vue

@@ -5,6 +5,13 @@
             <PromptText text='这是一个提示框' :type="2"/>
             <PromptText text='这是一个提示框' :type="3"/>
             <PromptText text="前期准备事项" :type="1" class="beforeNotice">
+                <template #next_desc>
+                    <p class="flex">
+                        <a href="https://e.360.cn/static/zhihui/login/?rdurl=https%3A%2F%2Fe.360.cn%2F"
+                              class="flex" target="_blank">
+                        <img src="@/assets/site/form_linkActive.svg" alt="">前往登陆</a>登录360智慧平台
+                    </p>
+                </template>
                 <template #desc>
                     <p class="mt12 flex">
                         1. <a href="https://e.360.cn/static/zhihui/login/?rdurl=https%3A%2F%2Fe.360.cn%2F"