编辑器-基础-封面设置窗口-上传素材按钮tooltip

src/components/tableSelect2.vue

@@ -117,7 +117,15 @@
     </div>
 
     <div class="btns">
-      <button class="ui-button">上传素材</button>
+      <button class="ui-button upload-btn">
+        <span>上传素材</span>
+        <i class="iconfont icon-material_prompt hover-tips">
+          <div>
+            <div v-if="currentMaterialType === 'image'" class="remark">请上传10MB以内、jpg/png格式的图片</div>
+            <div v-if="currentMaterialType === 'pano'" class="remark">请上传2:1、120MB以内、jpg格式的图片</div>
+          </div>
+        </i>
+      </button>
       <div>
         <button class="ui-button deepcancel" @click="$emit('cancle')">取消</button>
         <button class="ui-button submit" :class="{disable: !select.length}" @click="$emit('submit', select)">
@@ -573,6 +581,41 @@ export default {
   display: flex;
   justify-content: space-between;
   margin-top: 40px;
+  .upload-btn {
+    display: flex;
+    align-items: center;
+    > span {
+      display: inline-block;
+      margin-right: 4px;
+    }
+    i.hover-tips {
+      font-size: 12px;
+      transform: scale(0.923) translateY(1px);
+      cursor: default;
+      // tip的方框
+      > div {
+        top: -30px;
+        left: -30px;
+        transform: translateX(0);
+        background: #313131;
+        border: 1px solid rgba(151, 151, 151, 0.2);
+        > div {
+          color: #fff;
+        }
+        // tip的箭头
+        &::before {
+          position: absolute;
+          bottom: -14px;
+          transform: translateX(0);
+          left: 30px;
+          border-top: 7px solid #313131;
+        }
+        .remark {
+          line-height: 20px;
+        }
+      }
+    }
+  }
   > div {
     .deepcancel {
       margin-right: 16px;