uu
This commit is contained in:
parent
8b48fadb16
commit
1ed534cfa6
@ -16,7 +16,7 @@ const chooseFile = function (action = 'chooseImage', opt = {}) {
|
|||||||
...opts,
|
...opts,
|
||||||
success: function (res) {
|
success: function (res) {
|
||||||
// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
|
// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
|
||||||
var tempFilePaths = res.tempFilePaths || [res.tempFilePath]debugger
|
var tempFilePaths = res.tempFilePaths || [res.tempFilePath]
|
||||||
if (tempFilePaths.length > opts.count) {
|
if (tempFilePaths.length > opts.count) {
|
||||||
reject()
|
reject()
|
||||||
return showToast(`最多选择${opts.count}个`)
|
return showToast(`最多选择${opts.count}个`)
|
||||||
|
|||||||
@ -1,15 +1,37 @@
|
|||||||
<template>
|
<template>
|
||||||
<image :src="src" :mode="mode" :hidden="!loadFlag" @load="bindload"></image>
|
<image :src="src" :mode="mode" :hidden="!loadFlag" @load="bindload" :style="cusStyle"></image>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
|
computed: {
|
||||||
|
cusStyle() {
|
||||||
|
let s = ``
|
||||||
|
if(this.height) {
|
||||||
|
s+= `height:${this.height}rpx;`
|
||||||
|
}
|
||||||
|
if(this.width) {
|
||||||
|
s+= `width:${this.width}rpx;`
|
||||||
|
}
|
||||||
|
return s
|
||||||
|
},
|
||||||
|
},
|
||||||
props: {
|
props: {
|
||||||
src: {
|
src: {
|
||||||
default () {
|
default () {
|
||||||
return ''
|
return ''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
height: {
|
||||||
|
default () {
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
width: {
|
||||||
|
default () {
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
},
|
||||||
mode: {
|
mode: {
|
||||||
default () {
|
default () {
|
||||||
return 'aspectFit' // aspectFit | widthFix
|
return 'aspectFit' // aspectFit | widthFix
|
||||||
|
|||||||
@ -1,25 +1,31 @@
|
|||||||
<template>
|
<template>
|
||||||
<view :style="`${customstyle}`">
|
<view :style="`${customstyle};flex-direction: ${direction};`" class="up-cont">
|
||||||
<view v-if="list.length < maxLen">
|
<view v-if="list.length < maxLen">
|
||||||
<view v-if="!isSlot" @click="handleChooseFile" class="cam" style="">
|
<view v-if="!isSlot" @click="handleChooseFile" class="camer-btn" :style="`width:${width}rpx;height:${height}rpx;`">
|
||||||
<view class="">
|
<template v-if="btnText">
|
||||||
<u-icon name="camera" size="50"></u-icon>
|
<u-icon name="plus" size="40"></u-icon>
|
||||||
</view>
|
<text class="pt-10">{{btnText}}</text>
|
||||||
<view class="font-22">
|
</template>
|
||||||
<text>上传</text>
|
<template v-else>
|
||||||
<text v-if="fileType==fileTypeEnum.image">图片</text>
|
<view class="">
|
||||||
<text v-if="fileType==fileTypeEnum.video">视频</text>
|
<u-icon name="camera" size="50"></u-icon>
|
||||||
<text v-if="fileType==fileTypeEnum.all">文件</text>
|
</view>
|
||||||
</view>
|
<view class="font-22">
|
||||||
|
<text>上传</text>
|
||||||
|
<text v-if="fileType==fileTypeEnum.image">图片</text>
|
||||||
|
<text v-if="fileType==fileTypeEnum.video">视频</text>
|
||||||
|
<text v-if="fileType==fileTypeEnum.all">文件</text>
|
||||||
|
</view>
|
||||||
|
</template >
|
||||||
</view>
|
</view>
|
||||||
<view v-if="isSlot" @click="handleChooseFile">
|
<view v-if="isSlot" @click="handleChooseFile">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view v-for="(item) in list" :style="`${itemstyle}`">
|
<view v-for="(item) in list" :style="`${compItemstyle}`">
|
||||||
<view class="cdimg" @click="handleItem" data-index="{{index}}">
|
<view class="cdimg" @click="handleItem" data-index="{{index}}">
|
||||||
<tpx-image v-if="fileType==fileTypeEnum.image" :src="item" :mode="mode"></tpx-image>
|
<tpx-image v-if="fileType==fileTypeEnum.image" :src="item" :height="height" :width="width"></tpx-image>
|
||||||
<video v-if="fileType==fileTypeEnum.video" :src="item"></video>
|
<video v-if="fileType==fileTypeEnum.video" :src="item"></video>
|
||||||
<view v-if="fileType==fileTypeEnum.all">{{item}}</view>
|
<view v-if="fileType==fileTypeEnum.all">{{item}}</view>
|
||||||
</view>
|
</view>
|
||||||
@ -52,6 +58,13 @@
|
|||||||
}
|
}
|
||||||
return res
|
return res
|
||||||
},
|
},
|
||||||
|
compItemstyle(){
|
||||||
|
let style = `margin-bottom: 20rpx;`
|
||||||
|
if(this.direction == "row") {
|
||||||
|
// style += `width:${this.width}rpx;height:${this.height}rpx;`
|
||||||
|
}
|
||||||
|
return `${this.itemstyle};${style};`
|
||||||
|
}
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
customstyle: {
|
customstyle: {
|
||||||
@ -64,7 +77,22 @@
|
|||||||
return ''
|
return ''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
value: {
|
width: {
|
||||||
|
default () {
|
||||||
|
return 168
|
||||||
|
}
|
||||||
|
},
|
||||||
|
height: {
|
||||||
|
default () {
|
||||||
|
return 168
|
||||||
|
}
|
||||||
|
},
|
||||||
|
direction: {
|
||||||
|
default () {
|
||||||
|
return 'row'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
btnText: {
|
||||||
default () {
|
default () {
|
||||||
return ''
|
return ''
|
||||||
}
|
}
|
||||||
@ -195,9 +223,11 @@
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.cam {
|
.up-cont{
|
||||||
height: 168rpx;
|
display: flex;
|
||||||
width: 168rpx;
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
.camer-btn {
|
||||||
border: 2rpx solid #EFEFEF;
|
border: 2rpx solid #EFEFEF;
|
||||||
border-radius: 6rpx;
|
border-radius: 6rpx;
|
||||||
background: #F8F8F8;
|
background: #F8F8F8;
|
||||||
@ -205,5 +235,6 @@
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
@ -20,13 +20,13 @@
|
|||||||
<view class="mb-10">
|
<view class="mb-10">
|
||||||
<u-row justify="between">
|
<u-row justify="between">
|
||||||
<u-col span="5">
|
<u-col span="5">
|
||||||
<tpx-upload v-model:value="baseFormData.pic1">
|
<tpx-upload v-model:value="baseFormData.pic1" :btnText="'身份证人像面'" height="150" width="200">
|
||||||
<u-text :text="'身份证人像面'" size="28" :scale="[7, 10]"></u-text>
|
<u-text :text="'身份证人像面'" size="28"></u-text>
|
||||||
</tpx-upload>
|
</tpx-upload>
|
||||||
</u-col>
|
</u-col>
|
||||||
<u-col span="5">
|
<u-col span="5">
|
||||||
<tpx-upload v-model:value="baseFormData.pic2">
|
<tpx-upload v-model:value="baseFormData.pic2" :btnText="'身份证国徽面'" height="150" width="200">
|
||||||
<u-text :text="'身份证人像面'" size="28" :scale="[7, 10]"></u-text>
|
<u-text :text="'身份证国徽面'" size="28"></u-text>
|
||||||
</tpx-upload>
|
</tpx-upload>
|
||||||
</u-col>
|
</u-col>
|
||||||
</u-row>
|
</u-row>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user