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