Skip to content

basic-uniapp-v3
basic-uniapp-v3
提交 42235b33 作者: 方治民
操作

合并分支 '3.0' 到 'main' 

3.0

查看合并请求 !7
上级 cfc4ec0d cb2cf54d
正在显示 包含 202 行增加 和 23 行删除
package.json
...@@ -135,7 +135,7 @@ ...@@ -135,7 +135,7 @@
"postcss-html": "^1.5.0", "postcss-html": "^1.5.0",
"postcss-less": "^6.0.0", "postcss-less": "^6.0.0",
"prettier": "^2.8.4", "prettier": "^2.8.4",
"rimraf": "^4.3.1", "rimraf": "^4.4.0",
"sass": "^1.58.3", "sass": "^1.58.3",
"sort-package-json": "^2.4.1", "sort-package-json": "^2.4.1",
"stylelint": "^14.16.1", "stylelint": "^14.16.1",
......
pnpm-lock.yaml
...@@ -63,7 +63,7 @@ specifiers: ...@@ -63,7 +63,7 @@ specifiers:
postcss-less: ^6.0.0 postcss-less: ^6.0.0
prettier: ^2.8.4 prettier: ^2.8.4
qs: ~6.9.7 qs: ~6.9.7
rimraf: ^4.3.1 rimraf: ^4.4.0
sass: ^1.58.3 sass: ^1.58.3
sort-package-json: ^2.4.1 sort-package-json: ^2.4.1
stompjs: ^2.3.3 stompjs: ^2.3.3
...@@ -157,7 +157,7 @@ devDependencies: ...@@ -157,7 +157,7 @@ devDependencies:
postcss-html: 1.5.0 postcss-html: 1.5.0
postcss-less: 6.0.0_postcss@8.4.21 postcss-less: 6.0.0_postcss@8.4.21
prettier: 2.8.4 prettier: 2.8.4
rimraf: 4.3.1 rimraf: 4.4.0
sass: 1.58.3 sass: 1.58.3
sort-package-json: 2.4.1 sort-package-json: 2.4.1
stylelint: 14.16.1 stylelint: 14.16.1
...@@ -3741,7 +3741,7 @@ packages: ...@@ -3741,7 +3741,7 @@ packages:
postcss: ^8.1.0 postcss: ^8.1.0
dependencies: dependencies:
browserslist: 4.21.5 browserslist: 4.21.5
caniuse-lite: 1.0.30001462 caniuse-lite: 1.0.30001464
fraction.js: 4.2.0 fraction.js: 4.2.0
normalize-range: 0.1.2 normalize-range: 0.1.2
picocolors: 1.0.0 picocolors: 1.0.0
...@@ -3955,8 +3955,8 @@ packages: ...@@ -3955,8 +3955,8 @@ packages:
engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7} engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
hasBin: true hasBin: true
dependencies: dependencies:
caniuse-lite: 1.0.30001462 caniuse-lite: 1.0.30001464
electron-to-chromium: 1.4.322 electron-to-chromium: 1.4.325
node-releases: 2.0.10 node-releases: 2.0.10
update-browserslist-db: 1.0.10_browserslist@4.21.5 update-browserslist-db: 1.0.10_browserslist@4.21.5
...@@ -4035,8 +4035,8 @@ packages: ...@@ -4035,8 +4035,8 @@ packages:
engines: {node: '>=10'} engines: {node: '>=10'}
dev: true dev: true
/caniuse-lite/1.0.30001462: /caniuse-lite/1.0.30001464:
resolution: {integrity: sha512-PDd20WuOBPiasZ7KbFnmQRyuLE7cFXW2PVd7dmALzbkUXEP46upAuCDm9eY9vho8fgNMGmbAX92QBZHzcnWIqw==} resolution: {integrity: sha512-oww27MtUmusatpRpCGSOneQk2/l5czXANDSFvsc7VuOQ86s3ANhZetpwXNf1zY/zdfP63Xvjz325DAdAoES13g==}
/chalk/2.4.2: /chalk/2.4.2:
resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==} resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==}
...@@ -4248,7 +4248,7 @@ packages: ...@@ -4248,7 +4248,7 @@ packages:
resolution: {integrity: sha512-W6Af2Iw1z4CB7q4uU4hv646dW9GQuBM+YpC0UvUCWSD8w90SJjp+ujJuXaEMtAXBtSqGfMPuFOVn4/+FlaqfBA==} resolution: {integrity: sha512-W6Af2Iw1z4CB7q4uU4hv646dW9GQuBM+YpC0UvUCWSD8w90SJjp+ujJuXaEMtAXBtSqGfMPuFOVn4/+FlaqfBA==}
/concat-map/0.0.1: /concat-map/0.0.1:
resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==} resolution: {integrity: sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=}
/content-disposition/0.5.4: /content-disposition/0.5.4:
resolution: {integrity: sha512-FveZTNuGw04cxlAiWbzi6zTAL/lhehaWbTtgluJh4/E95DqMwTmha3KZN1aAWA8cFIhHzMZUvLevkw5Rqk+tSQ==} resolution: {integrity: sha512-FveZTNuGw04cxlAiWbzi6zTAL/lhehaWbTtgluJh4/E95DqMwTmha3KZN1aAWA8cFIhHzMZUvLevkw5Rqk+tSQ==}
...@@ -4437,7 +4437,7 @@ packages: ...@@ -4437,7 +4437,7 @@ packages:
resolution: {integrity: sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==} resolution: {integrity: sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==}
/cookie-signature/1.0.6: /cookie-signature/1.0.6:
resolution: {integrity: sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ==} resolution: {integrity: sha1-4wOogrNCzD7oylE6eZmXNNqzriw=}
dev: true dev: true
/cookie/0.5.0: /cookie/0.5.0:
...@@ -4858,11 +4858,11 @@ packages: ...@@ -4858,11 +4858,11 @@ packages:
dev: true dev: true
/ee-first/1.1.1: /ee-first/1.1.1:
resolution: {integrity: sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==} resolution: {integrity: sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=}
dev: true dev: true
/electron-to-chromium/1.4.322: /electron-to-chromium/1.4.325:
resolution: {integrity: sha512-KovjizNC9XB7dno/2GjxX8VS0SlfPpCjtyoKft+bCO+UfD8bFy16hY4Sh9s0h9BDxbRH2U0zX5VBjpM1LTcNlg==} resolution: {integrity: sha512-K1C03NT4I7BuzsRdCU5RWkgZxtswnKDYM6/eMhkEXqKu4e5T+ck610x3FPzu1y7HVFSiQKZqP16gnJzPpji1TQ==}
/emittery/0.8.1: /emittery/0.8.1:
resolution: {integrity: sha512-uDfvUjVrfGJJhymx/kz6prltenw1u7WrCg1oa94zYY8xxVpLLUu045LAT0dhDZdXG58/EpPL/5kA180fQ/qudg==} resolution: {integrity: sha512-uDfvUjVrfGJJhymx/kz6prltenw1u7WrCg1oa94zYY8xxVpLLUu045LAT0dhDZdXG58/EpPL/5kA180fQ/qudg==}
...@@ -7367,7 +7367,7 @@ packages: ...@@ -7367,7 +7367,7 @@ packages:
dev: true dev: true
/media-typer/0.3.0: /media-typer/0.3.0:
resolution: {integrity: sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==} resolution: {integrity: sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g=}
engines: {node: '>= 0.6'} engines: {node: '>= 0.6'}
dev: true dev: true
...@@ -7412,7 +7412,7 @@ packages: ...@@ -7412,7 +7412,7 @@ packages:
dev: true dev: true
/merge-descriptors/1.0.1: /merge-descriptors/1.0.1:
resolution: {integrity: sha512-cCi6g3/Zr1iqQi6ySbseM1Xvooa98N0w31jzUYrXPX2xqObmFGHJ0tQ5u74H3mVh7wLouTseZyYIq39g8cNp1w==} resolution: {integrity: sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E=}
dev: true dev: true
/merge-stream/2.0.0: /merge-stream/2.0.0:
...@@ -7559,7 +7559,7 @@ packages: ...@@ -7559,7 +7559,7 @@ packages:
resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==} resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==}
/mute-stream/0.0.7: /mute-stream/0.0.7:
resolution: {integrity: sha512-r65nCZhrbXXb6dXOACihYApHw2Q6pV0M3V0PSxd74N0+D8nzAdEAITq2oAjA1jVnKI+tGvEBUpqiMh0+rW6zDQ==} resolution: {integrity: sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=}
dev: true dev: true
/mute-stream/0.0.8: /mute-stream/0.0.8:
...@@ -8612,8 +8612,8 @@ packages: ...@@ -8612,8 +8612,8 @@ packages:
glob: 7.2.3 glob: 7.2.3
dev: true dev: true
/rimraf/4.3.1: /rimraf/4.4.0:
resolution: {integrity: sha512-GfHJHBzFQra23IxDzIdBqhOWfbtdgS1/dCHrDy+yvhpoJY5TdwdT28oWaHWfRpKFDLd3GZnGTx6Mlt4+anbsxQ==} resolution: {integrity: sha512-X36S+qpCUR0HjXlkDe4NAOhS//aHH0Z+h8Ckf2auGJk3PTnx5rLmrHkwNdbVQuCSUhOyFrlRvFEllZOYE+yZGQ==}
engines: {node: '>=14'} engines: {node: '>=14'}
hasBin: true hasBin: true
dependencies: dependencies:
...@@ -9715,7 +9715,7 @@ packages: ...@@ -9715,7 +9715,7 @@ packages:
resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==} resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
/utils-merge/1.0.1: /utils-merge/1.0.1:
resolution: {integrity: sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA==} resolution: {integrity: sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM=}
engines: {node: '>= 0.4.0'} engines: {node: '>= 0.4.0'}
dev: true dev: true
...@@ -9882,6 +9882,7 @@ packages: ...@@ -9882,6 +9882,7 @@ packages:
/w3c-hr-time/1.0.2: /w3c-hr-time/1.0.2:
resolution: {integrity: sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ==} resolution: {integrity: sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ==}
deprecated: Use your platform's native performance.now() and performance.timeOrigin.
dependencies: dependencies:
browser-process-hrtime: 1.0.0 browser-process-hrtime: 1.0.0
dev: true dev: true
...@@ -10124,7 +10125,7 @@ packages: ...@@ -10124,7 +10125,7 @@ packages:
dev: false dev: false
/xregexp/3.1.0: /xregexp/3.1.0:
resolution: {integrity: sha512-4Y1x6DyB8xRoxosooa6PlGWqmmSKatbzhrftZ7Purmm4B8R4qIEJG1A2hZsdz5DhmIqS0msC0I7KEq93GphEVg==} resolution: {integrity: sha1-FNhGHgvdOCJL/uUDmgiY/EL80zY=}
/xtend/4.0.2: /xtend/4.0.2:
resolution: {integrity: sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==} resolution: {integrity: sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==}
......
src/components/ThumbnailPreview/index.vue 0 → 100644
<script lang="ts" setup>
import type { PropType } from 'vue'
import { nanoid } from 'nanoid'
import { isImage, isVideo, getPoster } from './utils'
type URLs = { url: string }[]
const props = defineProps({
width: {
type: [String, Number],
default: '96',
},
height: {
type: [String, Number],
default: '96',
},
mode: {
type: String,
default: 'aspectFit',
},
assets: {
type: Array as PropType<Recordable & URLs>,
},
})
// 生成预览容器高度
const containerHeight = `${props.height}rpx`
// 分离图片和视频资源地址
const images = computed(() => props.assets.filter((item) => isImage(item.url)))
const videos = computed(() => props.assets.filter((item) => isVideo(item.url)))
// 预览图片
const preview = (index: number) => {
uni.previewImage({
urls: images.value.map((item) => item.url),
current: index,
})
}
// 初始化视频组件配置
const videoId = nanoid()
const videoContext = ref()
const playVideoSrc = ref()
// 播放视频
const play = (index: number) => {
playVideoSrc.value = videos.value[index].url
videoContext.value?.requestFullScreen()
videoContext.value?.play()
}
const videoFullScreenChange = (e: any) => {
// 非全屏状态下停止播放
if (!e.detail.fullScreen) {
videoContext.value?.stop()
}
}
onMounted(() => {
// 初始化视频组件上下文对象
videoContext.value = uni.createVideoContext(videoId)
})
</script>
<template>
<view class="preview-wrap">
<!-- 视频预览 -->
<fui-lazyload
class="preview-video"
:mode="props.mode"
v-for="(item, index) in videos"
:key="item.url"
:src="getPoster(item.url)"
:width="props.width"
:height="props.height"
:radius="10"
@tap="play(index)"
>
<view class="icon-wrap" :style="{ width: props.width, height: props.height }">
<fui-icon class="video-play-icon" name="suspend" size="40" color="#fff" />
</view>
</fui-lazyload>
<!-- 图片预览 -->
<fui-lazyload
class="preview-image"
:mode="props.mode"
v-for="(item, index) in images"
:key="item.url"
:src="getPoster(item.url)"
:width="props.width"
:height="props.height"
:radius="10"
@tap="preview(index)"
/>
<!-- 视频 -->
<video
:id="videoId"
:src="playVideoSrc"
class="video"
autoplay
controls
@fullscreenchange="videoFullScreenChange"
></video>
</view>
</template>
<style lang="less" scoped>
.preview-wrap {
display: flex;
flex-wrap: wrap;
margin: -10rpx;
.preview-image,
.preview-video {
margin: 10rpx !important;
position: relative;
:deep(.fui-lazyload__img) {
height: v-bind(containerHeight) !important;
}
.icon-wrap {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
border-radius: 10rpx;
.video-play-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
}
}
.video {
position: absolute;
top: -999999px;
}
}
</style>
src/components/ThumbnailPreview/utils.ts 0 → 100644
export type FileType = 'image' | 'video' | 'audio'
export function isImage(url: string) {
return /\.(png|jpe?g|gif|svg)(\?.*)?$/i.test(url)
}
export function isVideo(url: string) {
return /\.(mp4|m3u8)(\?.*)?$/i.test(url)
}
export function getPoster(url: string) {
if (!isVideo(url)) {
return url
}
return url + '.jpg'
}
src/components/firstui/fui-upload-video/fui-upload-video.vue
...@@ -2,8 +2,9 @@ ...@@ -2,8 +2,9 @@
<view class="fui-uploadv__wrap"> <view class="fui-uploadv__wrap">
<view class="fui-uploadv__item" :style="{width:width+'rpx',height:height+'rpx'}" v-for="(item,index) in urls" <view class="fui-uploadv__item" :style="{width:width+'rpx',height:height+'rpx'}" v-for="(item,index) in urls"
:key="index"> :key="index">
<view :style="{width:width+'rpx',height:height-(isView?0:40)+'rpx',background:'#000'}" v-if="!showVideo"></view>
<video class="fui-upload__video" :style="{width:width+'rpx',height:height-(isView?0:40)+'rpx'}" <video class="fui-upload__video" :style="{width:width+'rpx',height:height-(isView?0:40)+'rpx'}"
:src="getVideoSrc(item)"></video> :src="getVideoSrc(item)" v-if="showVideo"></video>
<view class="fui-uploadv__del-wrap" :style="{width:width+'rpx'}" v-if="!isView"> <view class="fui-uploadv__del-wrap" :style="{width:width+'rpx'}" v-if="!isView">
<view class="fui-uploadv__flex-row" @tap.stop="reUpload(index)"> <view class="fui-uploadv__flex-row" @tap.stop="reUpload(index)">
<fui-icon name="checkbox" color="#fff" :size="32" v-if="progress[index]===100"></fui-icon> <fui-icon name="checkbox" color="#fff" :size="32" v-if="progress[index]===100"></fui-icon>
...@@ -49,6 +50,11 @@ ...@@ -49,6 +50,11 @@
type: [Number, String], type: [Number, String],
default: 320 default: 320
}, },
// 防止原生组件层级问题的视频显示
hideVideo: {
type: Boolean,
default: false
},
fileList: { fileList: {
type: Array, type: Array,
default () { default () {
...@@ -146,6 +152,7 @@ ...@@ -146,6 +152,7 @@
//preupload、uploading、success、error //preupload、uploading、success、error
status: [], status: [],
progress: [], progress: [],
showVideo: true,
}; };
}, },
created() { created() {
...@@ -154,7 +161,16 @@ ...@@ -154,7 +161,16 @@
watch: { watch: {
fileList(vals) { fileList(vals) {
this.initData(vals) this.initData(vals)
} },
hideVideo(value) {
if (value) {
this.showVideo = false
} else {
setTimeout(() => {
this.showVideo = true
}, 300)
}
}
}, },
computed: { computed: {
showAdd() { showAdd() {
......
src/pages/index/index.vue
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
// #endif // #endif
// #ifndef APP-PLUS // #ifndef APP-PLUS
Message.toast(`使用 APP 运行点击有惊喜~ ╰(*°▽°*)╯`) Message.toast(`在手机上运行点击有惊喜~ ╰(*°▽°*)╯`)
// #endif // #endif
} }
......
stylelint.config.js
...@@ -69,6 +69,7 @@ module.exports = { ...@@ -69,6 +69,7 @@ module.exports = {
], ],
'selector-type-no-unknown': null, 'selector-type-no-unknown': null,
'comment-empty-line-before': null, 'comment-empty-line-before': null,
'function-no-unknown': null,
}, },
ignoreFiles: ['**/*.js', '**/*.jsx', '**/*.tsx', '**/*.ts'], ignoreFiles: ['**/*.js', '**/*.jsx', '**/*.tsx', '**/*.ts'],
overrides: [ overrides: [
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论