feat: ✨ StatusTip 添加底部插槽

✅ Closes: #1070

src/locale/en-US.json

@@ -1114,6 +1114,7 @@
   "sortbutton-title": "SortButton",
   "sou-suo": "search for",
   "sou-suo-wu-jie-guo": "No results found in the search",
+  "di-bu-cha-cao": "Bottom slot",
   "sou-suo-zhan-wei-fu-ju-zuo": "Search placeholder on the left",
   "statustip-que-sheng-ti-shi": "StatusTip",
   "statustip-title": "StatusTip",
@@ -1640,4 +1641,4 @@
   "zuo-xia": "lower left",
   "zuo-you-hua-dong": "Slide left and right",
   "zuo-zhong": "Middle Left"
-}
+}

src/locale/zh-CN.json

@@ -1114,6 +1114,7 @@
   "sortbutton-title": "SortButton 排序按钮",
   "sou-suo": "搜索",
   "sou-suo-wu-jie-guo": "搜索无结果",
+  "di-bu-cha-cao": "底部插槽",
   "sou-suo-zhan-wei-fu-ju-zuo": "搜索占位符居左",
   "statustip-que-sheng-ti-shi": "StatusTip 缺省提示",
   "statustip-title": "StatusTip 缺省提示",
@@ -1640,4 +1641,4 @@
   "zuo-xia": "左下",
   "zuo-you-hua-dong": "左右滑动",
   "zuo-zhong": "左中"
-}
+}

src/subPages/statusTip/Index.vue

@@ -1,5 +1,13 @@
 <template>
   <page-wraper>
+    <demo-block :title="$t('di-bu-cha-cao')">
+      <wd-status-tip image="content" tip="当前搜索无结果">
+        <template #bottom>
+          <wd-button type="info">重新加载</wd-button>
+        </template>
+      </wd-status-tip>
+    </demo-block>
+
     <demo-block :title="$t('sou-suo-wu-jie-guo')">
       <wd-status-tip image="search" tip="当前搜索无结果" />
     </demo-block>

src/uni_modules/wot-design-uni/components/wd-status-tip/index.scss

@@ -34,4 +34,10 @@
     text-align: center;
     overflow-wrap: break-word;
   }
+  @include e(bottom) {
+    margin-top: 20px;
+    display: flex;
+    justify-content: center;
+    width: 100%;
+  }
 }

src/uni_modules/wot-design-uni/components/wd-status-tip/wd-status-tip.vue

@@ -12,6 +12,9 @@
     <slot name="image" v-if="$slots.image"></slot>
     <wd-img v-else-if="imgUrl" :mode="imageMode" :src="imgUrl" custom-class="wd-status-tip__image" :custom-style="imgStyle"></wd-img>
     <view v-if="tip" class="wd-status-tip__text">{{ tip }}</view>
+    <view v-if="$slots.bottom" class="wd-status-tip__bottom">
+      <slot name="bottom" />
+    </view>
   </view>
 </template>