From 4180ae1a509c161eaf07e7544f284e0212edda1a Mon Sep 17 00:00:00 2001 From: YFeng <tingquanren@163.com> Date: Tue, 11 May 2021 16:45:18 +0800 Subject: [PATCH] 全局公共色 --- forms/imagePicker/CImagePicker.vue | 94 ++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 81 insertions(+), 13 deletions(-) diff --git a/forms/imagePicker/CImagePicker.vue b/forms/imagePicker/CImagePicker.vue index 1ed467b..a9da799 100644 --- a/forms/imagePicker/CImagePicker.vue +++ b/forms/imagePicker/CImagePicker.vue @@ -7,10 +7,10 @@ <view class="c-image-picker"> <AtInput ref="input" - :name="itemData.name" - :title="itemData.label" - :required="itemData.required" - :error="itemData.error" + :name="itemRes.name" + :title="itemRes.label" + :required="itemRes.required" + :error="itemRes.error" /> <AtImagePicker ref="picker" @@ -39,8 +39,10 @@ </template> <script> +import Taro from '@tarojs/taro'; import { $ } from '@tarojs/extend'; import { AtInput, AtImagePicker, AtCurtain } from 'taro-ui-vue'; +import { $fetcherCommon } from '@fetchers/FCommon'; import './cImagePicker.scss'; export default { @@ -51,7 +53,8 @@ AtCurtain, }, props: { - itemData: Object, + // 表单数据资源(表单组件内部机制专用) + itemRes: Object, }, data() { return { @@ -61,12 +64,12 @@ }, computed: { files() { - const value = this.itemData.formData[this.itemData.name]; + const value = this.itemRes.formData[this.itemRes.name]; let files = []; if (Object.prototype.toString.call(value) === '[object String]') { - files = value.split(',').map((url) => ({ url })); + files = value.split(',').map(url => ({ url })); } else if (Object.prototype.toString.call(value) === '[object Array]') { - files = value.map((url) => ({ url })); + files = value.map(url => ({ url })); } files.push({ type: 'btn' }); return files; @@ -74,16 +77,14 @@ }, methods: { handleChange(files, operationType, index) { - if (operationType === 'add') { - } const value = []; - files.forEach((file) => { + files.forEach(file => { if (file.type === 'btn') { return; } value.push(file.url); }); - this.itemData.onChange(value); + this.itemRes.onChange(value); }, handleImgView(index, file) { this.curtainImg = file.url; @@ -100,9 +101,76 @@ duration: 2000, }); }, + $uploadImage(callback) { + const url = $fetcherCommon.getUploadImgURL(); + const uploadTeam = []; + const imgs = []; + this.files.forEach(file => { + if (file.type === 'btn') { + return; + } + // blob 二进制文件才上传 + if (file.url.indexOf('blob') >= 0) { + uploadTeam.push( + new Promise((resolve, reject) => { + Taro.uploadFile({ + url, + filePath: file.url, + name: 'file', + formData: {}, + success(res) { + const res2 = + typeof res.data === 'string' + ? JSON.parse(res.data) + : res.data; + if (res2.state.code === 2000) { + resolve( + $fetcherCommon.transImgPath( + 'fix', + res2.data.src + ) + ); + } else { + reject({ message: 'res2.state.msg' }); + } + }, + cancel() { + reject({ message: '上传图片已取消!' }); + }, + fail() { + reject({ message: '上传图片失败!' }); + }, + }); + }) + ); + } + // 其他类型视为 url,忽略 + else { + uploadTeam.push(Promise.resolve(file.url)); + } + }); + Promise.all(uploadTeam) + .then(res => { + this.itemRes.onChange(res); + setTimeout(() => { + callback('success'); + }, 0); + }) + .catch(err => { + callback('error', err); + }); + }, }, mounted() { - $(this.$refs.input.$el).find('.at-input__input').prepend(this.$refs.picker.$el); + if (process.env.TARO_ENV === 'h5') { + $(this.$refs.input.$el) + .find('.at-input__input') + .prepend(this.$refs.picker.$el); + } else if (process.env.TARO_ENV === 'weapp') { + $(this.$refs.input.$el) + .find('.at-input__container') + .append(this.$refs.picker.$el); + } }, }; </script> \ No newline at end of file -- Gitblit v1.9.1