papayaui 0.2.13 → 0.2.14

package/components/cascader/cascader.vue

@@ -47,7 +47,7 @@
         <view v-if="loading" :class="ns.e('loading')">
           <loadmore :status="LoadStatusEnum.LOADING" />
         </view>
-        <view v-if="!currentData.length && !loading" :class="ns.e('empty')">无数据</view>
+        <view v-if="!currentData.length && !loading" :class="ns.e('empty')">{{ emptyText }}</view>
         <SafeBottom v-if="safeAreaInsetBottom && !localState.hasConfirm" />
       </scroll-view>
       <SearchView
@@ -56,6 +56,7 @@
         :options="treeData"
         :field-names="_fieldNames"
         :search-text="searchText"
+        :empty-text="emptyText"
         :lazy-search="lazySearch"
         :is-selected="isSelected"
         :safe-area-inset-bottom="safeAreaInsetBottom && !localState.hasConfirm"

package/components/cascader/props.ts

@@ -81,6 +81,13 @@ export const cascaderProps = {
     type: String,
     default: '重置',
   },
+  /**
+   * 数据为空时的提示文案
+   */
+  emptyText: {
+    type: String,
+    default: '无数据',
+  },
   /**
    * 确定后是否重置数据
    */
@@ -130,6 +137,10 @@ export const cascaderSearchViewProps = {
     type: String,
     required: true,
   },
+  emptyText: {
+    type: String,
+    required: true,
+  },
   lazySearch: Function as PropType<
     (searchText: string) => CascaderOption[] | Promise<CascaderOption[]>
   >,

package/components/cascader/search-view.vue

@@ -10,7 +10,7 @@
     <view v-if="loading" :class="ns.e('loading')">
       <loadmore :status="LoadStatusEnum.LOADING" />
     </view>
-    <view v-if="!searchData.length && !loading" :class="ns.e('empty')">无数据</view>
+    <view v-if="!searchData.length && !loading" :class="ns.e('empty')">{{ emptyText }}</view>
     <SafeBottom v-if="safeAreaInsetBottom" />
   </scroll-view>
 </template>

package/components/picker-popup/picker-popup.vue

@@ -44,7 +44,7 @@
         <LoadMore
           v-if="!filterOptions.length || !!pagination"
           :status="loadStatus"
-          :config="{ nomore: isEmpty ? '无数据' : '没有更多了' }"
+          :config="{ nomore: isEmpty ? emptyText : '没有更多了' }"
           :full-page="isEmpty"
           :show-text="!onlyOnePage"
           @next="onScrollNext"

package/components/picker-popup/props.ts

@@ -88,6 +88,13 @@ export const pickerPopupProps = {
     type: String,
     default: '确定',
   },
+  /**
+   * 数据为空时的提示文案
+   */
+  emptyText: {
+    type: String,
+    default: '无数据',
+  },
   /**
    * 确定后是否重置数据
    */

package/components/uploader/demo.vue

@@ -27,6 +27,10 @@
     <Demo7 />
   </DocDemoBlock>
 
+  <DocDemoBlock title="其他文件类型" card>
+    <Demo8 />
+  </DocDemoBlock>
+
   <pa-safe-bottom />
 </template>
 
@@ -38,6 +42,7 @@ import Demo4 from '../../demos/uploader/demo-4.vue'
 import Demo5 from '../../demos/uploader/demo-5.vue'
 import Demo6 from '../../demos/uploader/demo-6.vue'
 import Demo7 from '../../demos/uploader/demo-7.vue'
+import Demo8 from '../../demos/uploader/demo-8.vue'
 import DocDemoBlock from '../../doc/doc-demo-block.vue'
 </script>
 

package/components/uploader/props.ts

@@ -1,10 +1,12 @@
 import type { ExtractPropTypes, PropType } from 'vue'
 import { isArray, isNumber, isObject } from '../../utils'
 
+export type FileMediaType = 'image' | 'video'
+export type FileOtherType = 'word' | 'excel' | 'ppt' | 'pdf' | 'markdown' | 'zip' | 'file'
 export type FileItem = {
   name?: string
   url: string
-  type?: 'image' | 'video'
+  type?: FileMediaType | FileOtherType
   status?: 'ready' | 'uploading' | 'success' | 'error'
   deletable?: boolean
   thumbUrl?: string

package/components/uploader/uploader.scss

@@ -24,6 +24,43 @@
       overflow: hidden;
     }
 
+    &-type-word,
+    &-type-excel,
+    &-type-ppt,
+    &-type-pdf,
+    &-type-markdown,
+    &-type-zip,
+    &-type-file {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      background-color: #f7f8fa;
+      font-size: _var(uploader-preview-file-size, 36px);
+      color: _var(uploader-preview-file-color, _var(color-black-3));
+      text {
+        font-size: _var(uploader-preview-file-text-size, 14px);
+      }
+    }
+    &-type-word {
+      color: #285898;
+    }
+    &-type-excel {
+      color: #15723b;
+    }
+    &-type-ppt {
+      color: #cd3f2b;
+    }
+    &-type-pdf {
+      color: #b40009;
+    }
+    &-type-markdown {
+      color: #6188bd;
+    }
+    &-type-zip {
+      color: #f2bb3c;
+    }
+
     &-delete {
       position: absolute;
       top: 0;

package/components/uploader/uploader.vue

@@ -4,14 +4,22 @@
       <slot v-if="$slots.default" />
       <template v-else>
         <view v-for="(file, index) in fileList" :key="index" :class="ns.e('preview')">
-          <view :class="ns.e('preview-image')" :style="sizeStyle">
+          <view
+            :class="[ns.e('preview-image'), ns.e(`preview-type-${file.type ?? 'image'}`)]"
+            :style="sizeStyle"
+          >
             <ImageComponent
+              v-if="!file.type || file.type === 'image' || file.type === 'video'"
               :src="file.thumbUrl ?? file.url"
               width="100%"
               height="100%"
               mode="aspectFill"
               @click="onPreview(file, index)"
             />
+            <template v-else>
+              <IconComponent :name="(file.type !== 'file' ? `file-` : '') + file.type" />
+              <text>{{ file.type }}</text>
+            </template>
           </view>
           <view
             v-if="deletable && file.deletable !== false"
@@ -42,7 +50,7 @@ import useNamespace from '../../core/useNamespace'
 import { getUnitValue } from '../../utils'
 import IconComponent from '../icon/icon.vue'
 import ImageComponent from '../image/image.vue'
-import type { FileItem } from './props'
+import type { FileItem, FileMediaType } from './props'
 import { uploaderProps, uploaderEmits } from './props'
 
 const ns = useNamespace('uploader')
@@ -129,26 +137,27 @@ const afterRead = (fileList: FileItem[]) => {
 }
 
 const onPreview = (file: FileItem, index: number) => {
-  if (!props.previewFullImage) return
-  // #ifdef MP
-  uni.previewMedia({
-    sources: props.fileList,
-    current: index,
-    fail: () => {
-      // 前面的API可能存在兼容问题，失败时使用降级方法
-      uni.previewImage({
-        urls: props.fileList.map((file) => file.url),
-        current: index,
-      })
-    },
-  })
-  // #endif
-  // #ifndef MP
-  uni.previewImage({
-    urls: props.fileList.map((file) => file.url),
-    current: index,
-  })
-  // #endif
+  if (props.previewFullImage && ['image', 'video'].includes(file.type ?? 'image')) {
+    // #ifdef MP
+    uni.previewMedia({
+      sources: props.fileList.map((file) => ({ url: file.url, type: file.type as FileMediaType })),
+      current: index,
+      fail: () => {
+        // 前面的API可能存在兼容问题，失败时使用降级方法
+        uni.previewImage({
+          urls: props.fileList.map((file) => file.url),
+          current: index,
+        })
+      },
+    })
+    // #endif
+    // #ifndef MP
+    uni.previewImage({
+      urls: props.fileList.map((file) => file.url),
+      current: index,
+    })
+    // #endif
+  }
   emit('click-preview', file, index)
 }
 

package/demos/uploader/demo-8.vue

@@ -0,0 +1,39 @@
+<template>
+  <pa-uploader v-model:file-list="fileList" />
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import type { FileItem } from '../..'
+
+const fileList = ref<FileItem[]>([
+  {
+    url: '',
+    type: 'word',
+  },
+  {
+    url: '',
+    type: 'excel',
+  },
+  {
+    url: '',
+    type: 'ppt',
+  },
+  {
+    url: '',
+    type: 'pdf',
+  },
+  {
+    url: '',
+    type: 'markdown',
+  },
+  {
+    url: '',
+    type: 'zip',
+  },
+  {
+    url: '',
+    type: 'file',
+  },
+])
+</script>

package/fonts/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "pa-icon"; /* Project id 3668565 */
-  src: url('iconfont.woff2?t=1692684761658') format('woff2'),
-       url('iconfont.woff?t=1692684761658') format('woff'),
-       url('iconfont.ttf?t=1692684761658') format('truetype');
+  src: url('iconfont.woff2?t=1715567017689') format('woff2'),
+       url('iconfont.woff?t=1715567017689') format('woff'),
+       url('iconfont.ttf?t=1715567017689') format('truetype');
 }
 
 .pa-icon {
@@ -13,6 +13,38 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.pa-icon-refresh:before {
+  content: "\e6a4";
+}
+
+.pa-icon-file-excel:before {
+  content: "\e7b8";
+}
+
+.pa-icon-file-pdf:before {
+  content: "\e7ba";
+}
+
+.pa-icon-file-markdown:before {
+  content: "\e7bb";
+}
+
+.pa-icon-file-ppt:before {
+  content: "\e7bc";
+}
+
+.pa-icon-file-word:before {
+  content: "\e7bd";
+}
+
+.pa-icon-file:before {
+  content: "\e7be";
+}
+
+.pa-icon-file-zip:before {
+  content: "\e7bf";
+}
+
 .pa-icon-order:before {
   content: "\e66d";
 }