修改
This commit is contained in:
@@ -48,13 +48,6 @@
|
||||
required
|
||||
:rules="[{ required: true }]"
|
||||
/>
|
||||
<!-- <van-field
|
||||
v-model="formData.clockTime"
|
||||
label="打卡时间"
|
||||
input-align="right"
|
||||
placeholder="请输入"
|
||||
readonly
|
||||
/> -->
|
||||
<van-field
|
||||
v-model="formData.remark"
|
||||
label="备注"
|
||||
@@ -75,6 +68,14 @@
|
||||
</div>
|
||||
<div class="pic">
|
||||
<Uploader
|
||||
ref="uploaderRef"
|
||||
type="text1"
|
||||
:value="text1"
|
||||
:deletable="showSubmit"
|
||||
@afterRead="afterRead"
|
||||
@delImg="delImg"
|
||||
@onUpload="onUpload" />
|
||||
<!-- <Uploader
|
||||
ref="uploaderRef"
|
||||
type="text1"
|
||||
:value="text1"
|
||||
@@ -83,7 +84,7 @@
|
||||
@afterRead="afterRead"
|
||||
@delImg="delImg"
|
||||
@onUpload="onUpload"
|
||||
/>
|
||||
/> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -102,7 +103,6 @@ import {
|
||||
getPosition,
|
||||
// chooseAlbumAndTakePhoto,
|
||||
} from '@/utils/dsbridge'
|
||||
import { format } from '@/utils/timeUtil.js'
|
||||
import { insertPositionData, getPositionData } from '@/api/api.js'
|
||||
import { downloadUrl } from '@/settings'
|
||||
export default {
|
||||
@@ -128,7 +128,6 @@ export default {
|
||||
showSubmit: false,
|
||||
taskId: '',
|
||||
customerId: '',
|
||||
animation: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
@@ -162,54 +161,62 @@ export default {
|
||||
}else{
|
||||
this.showSubmit = true
|
||||
this.getLocation()
|
||||
this.getAddress()
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取当前位置
|
||||
getLocation() {
|
||||
console.log('-------------------------getLocation');
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
this.formData.lgitude = 31.560001
|
||||
this.formData.ltitude = 118.708980
|
||||
this.formData.lgitude = 118.708980
|
||||
this.formData.ltitude = 31.560001
|
||||
this.formData.addressName = '江苏省南京市江宁区'
|
||||
}
|
||||
try {
|
||||
// this.formData.clockTime = format(new Date().getTime())
|
||||
} catch (error) {}
|
||||
const that = this
|
||||
getPosition((data) => {
|
||||
console.log('-------------------------位置信息', data, typeof(data));
|
||||
if (data) {
|
||||
console.log(data, '位置信息')
|
||||
this.formData.lgitude = data.longitude
|
||||
this.formData.ltitude = data.latitude
|
||||
console.log(data.longitude, 'lgitude位置信息')
|
||||
if(typeof(data) == 'string'){
|
||||
let dataArr = data.split(',')
|
||||
that.$set(that.formData, 'lgitude', dataArr[0].match(/\d+\.\d{2}/)[0])
|
||||
that.$set(that.formData, 'ltitude', dataArr[1].match(/\d+\.\d{2}/)[0])
|
||||
}else{
|
||||
that.$set(that.formData, 'lgitude', (data.longitude+'').match(/\d+\.\d{2}/)[0])
|
||||
that.$set(that.formData, 'ltitude', (data.latitude+'').match(/\d+\.\d{2}/)[0])
|
||||
}
|
||||
} else {
|
||||
Notify({ type: 'warning', message: '未获取到位置信息' })
|
||||
}
|
||||
})
|
||||
},
|
||||
getAddress(){
|
||||
const that = this
|
||||
getLocationMessage((data) => {
|
||||
console.log('-------------------------getLocationMessage', data);
|
||||
if (data) {
|
||||
this.formData.addressName = data
|
||||
that.$set(that.formData, 'addressName', data)
|
||||
} else {
|
||||
Notify({ type: 'warning', message: '未获取到定位信息' })
|
||||
}
|
||||
})
|
||||
this.animation = requestAnimationFrame(this.getLocation)
|
||||
},
|
||||
/**
|
||||
* 图片方法
|
||||
*/
|
||||
//浏览器 ios 会走这个方法
|
||||
afterRead(data, type) {
|
||||
this[type].push({
|
||||
fileName: data.original_name,
|
||||
fileId: data.attach_id,
|
||||
url: `${downloadUrl}${data.attach_id}`
|
||||
})
|
||||
|
||||
console.log('-------------------------afterRead', data, type);
|
||||
this[type] = [data.attach_id]
|
||||
this.formData.fileName = data.original_name
|
||||
this.formData.fileId = data.attach_id
|
||||
},
|
||||
//安卓会调用的方法
|
||||
onUpload(data, type) {
|
||||
this[type].push(data[0])
|
||||
console.log('-------------------------onUpload', data, type);
|
||||
// this[type].push(data[0])
|
||||
this[type] = [data[0].url]
|
||||
this.formData.fileName = data[0].fileName
|
||||
this.formData.fileId = data[0].fileId
|
||||
},
|
||||
@@ -270,12 +277,6 @@ export default {
|
||||
})
|
||||
},
|
||||
},
|
||||
beforeDestroy(){
|
||||
if(this.animation){
|
||||
cancelAnimationFrame(this.animation)
|
||||
this.animation = null
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
|
||||
@@ -68,7 +68,7 @@
|
||||
<van-field v-model="formData.photovoltaicPhotovoltaic" required :rules="[{ required: gfShow == 1, message: '请填写总装机容量' }]" label="光伏总装机容量(kW)" placeholder="请输入" type="number" input-align="right" v-if="gfShow == 1">
|
||||
</van-field>
|
||||
<van-cell title="是否采用再生水" is-link :value="showData.reclaimedWater1" @click="showPicker5 = !showForm" />
|
||||
<van-cell title="再生水类型" is-link :value="result222" @click="showPicker6 = !showForm" v-if="formData.reclaimedWater == 1" />
|
||||
<van-cell title="再生水类型" is-link :value="result222" @click="showPicker6 = !showForm" v-if="formData.reclaimedWater == 1" required :rules="[{ required: true}]" />
|
||||
<van-cell title="再生水类型" is-link title-style="color: #999" value="无" v-else />
|
||||
</van-cell-group>
|
||||
</div>
|
||||
@@ -1635,6 +1635,11 @@ export default {
|
||||
this.formData.reclaimedWater = val.value
|
||||
this.showData.reclaimedWater1 = val.text
|
||||
this.showPicker5 = false
|
||||
if(val.value==2){
|
||||
this.result8 = []
|
||||
this.result222 = this.formData.reclaimedWaterType= ''
|
||||
|
||||
}
|
||||
},
|
||||
// 外墙结构选择
|
||||
clickRadio4(item, index) {
|
||||
@@ -1697,7 +1702,8 @@ export default {
|
||||
this.showData.itemizedMeter1 = val.text
|
||||
this.showPicker11 = false
|
||||
if (val.value == 2) {
|
||||
this.formData.itemizedMeasurementType = ''
|
||||
this.result9 = []
|
||||
this.formData.itemizedMeasurementType = this.result777 = ''
|
||||
}
|
||||
},
|
||||
// 分项计量类型
|
||||
@@ -1717,7 +1723,8 @@ export default {
|
||||
this.showData.energyPlatform1 = val.text
|
||||
this.showPicker13 = false
|
||||
if (val.value == 2) {
|
||||
this.formData.platformFeatures = ''
|
||||
this.result3 = []
|
||||
this.formData.platformFeatures = this.result888 = ''
|
||||
}
|
||||
},
|
||||
// 平台功能选择
|
||||
@@ -1813,6 +1820,9 @@ export default {
|
||||
}else if (!this.result1) {
|
||||
this.$toast('请选择已使用清洁能源')
|
||||
return
|
||||
}else if (this.formData.reclaimedWater == 1 && !this.result222) {
|
||||
this.$toast('请选择再生水类型')
|
||||
return
|
||||
}else if (this.formData.energyType.indexOf('1') === -1) {
|
||||
this.$toast('能源类型必须有勾选电')
|
||||
return
|
||||
@@ -2078,28 +2088,28 @@ export default {
|
||||
(this.fileList = []), // 图片列表
|
||||
(this.fileIds = []) // 图片id存
|
||||
},
|
||||
// 获取当前位置
|
||||
getLocation() {
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
this.formData.buildAddr = '江苏省南京市江宁区'
|
||||
}
|
||||
getPosition( data => {
|
||||
if(data){
|
||||
console.log(data, '位置信息');
|
||||
this.formData.latitude = data.latitude
|
||||
this.formData.longitude = data.longitude
|
||||
} else {
|
||||
Notify({ type: 'warning', message: '未获取到位置信息' });
|
||||
}
|
||||
})
|
||||
getLocationMessage(data=> {
|
||||
if(data) {
|
||||
this.formData.buildAddr = data
|
||||
} else {
|
||||
Notify({ type: 'warning', message: '未获取到定位信息' });
|
||||
}
|
||||
})
|
||||
},
|
||||
// // 获取当前位置
|
||||
// getLocation() {
|
||||
// if (process.env.NODE_ENV === 'development') {
|
||||
// this.formData.buildAddr = '江苏省南京市江宁区'
|
||||
// }
|
||||
// getPosition( data => {
|
||||
// if(data){
|
||||
// console.log(data, '位置信息');
|
||||
// this.formData.latitude = data.latitude
|
||||
// this.formData.longitude = data.longitude
|
||||
// } else {
|
||||
// Notify({ type: 'warning', message: '未获取到位置信息' });
|
||||
// }
|
||||
// })
|
||||
// getLocationMessage(data=> {
|
||||
// if(data) {
|
||||
// this.formData.buildAddr = data
|
||||
// } else {
|
||||
// Notify({ type: 'warning', message: '未获取到定位信息' });
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
updateUserStatus() {
|
||||
const data = JSON.parse(sessionStorage.getItem('tidCid'))
|
||||
const params = {
|
||||
|
||||
@@ -317,6 +317,15 @@ export default {
|
||||
}
|
||||
},
|
||||
saveAllInfo() {
|
||||
let item = JSON.parse(sessionStorage.getItem('tidCid')).item
|
||||
if(!item.isPosition){
|
||||
this.$notify({
|
||||
message: '必须先在app打卡以后才能提交',
|
||||
duration: 1000,
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
}
|
||||
taskList({ consName: this.info.customerName }).then((res) => {
|
||||
this.records = res.data.list[0]
|
||||
|
||||
|
||||
@@ -7,7 +7,8 @@
|
||||
<!-- <div class="title" style="margin-top: 20px;margin-left: 5px;">通用能源系统</div> -->
|
||||
<div class="partTwo-box">
|
||||
<div class="partTwo-content">
|
||||
<div class="title">泵机系统基本信息<span style="font-size: 14px; color: #bbbbbb;"> 单台电机额定功率≥20kW</span>
|
||||
<!-- 单台电机额定功率≥20kW 电网让改大于5 -->
|
||||
<div class="title">泵机系统基本信息<span style="font-size: 14px; color: #bbbbbb;"> 单台电机额定功率≥5kW</span>
|
||||
</div>
|
||||
<van-swipe-cell :right-width="65" v-for="(item, index) in list" :key="index">
|
||||
<div class="msg-card" @click="bengjisystemaddedit(item.id)">
|
||||
|
||||
@@ -116,8 +116,8 @@ export default {
|
||||
}
|
||||
},
|
||||
handelChange () {
|
||||
if(Number(this.form.ratedPowerValue) < 20) {
|
||||
Notify({ type: "danger", message: '单台额定功率≥20 ' });
|
||||
if(Number(this.form.ratedPowerValue) < 5) {
|
||||
Notify({ type: "danger", message: '单台额定功率≥5 ' });
|
||||
this.form.ratedPowerValue = ''
|
||||
}
|
||||
},
|
||||
|
||||
@@ -440,20 +440,20 @@ export default {
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 获取当前位置
|
||||
getLocation() {
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
this.address = '江苏省南京市江宁区'
|
||||
}
|
||||
// // 获取当前位置
|
||||
// getLocation() {
|
||||
// if (process.env.NODE_ENV === 'development') {
|
||||
// this.address = '江苏省南京市江宁区'
|
||||
// }
|
||||
|
||||
getLocationMessage(data=> {
|
||||
if(data) {
|
||||
this.address = data
|
||||
} else {
|
||||
Notify({ type: 'warning', message: '未获取到定位信息' });
|
||||
}
|
||||
})
|
||||
},
|
||||
// getLocationMessage(data=> {
|
||||
// if(data) {
|
||||
// this.address = data
|
||||
// } else {
|
||||
// Notify({ type: 'warning', message: '未获取到定位信息' });
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
base64ToFile(data, fileName) {
|
||||
const dataArr = data.split(",");
|
||||
const byteString = window.atob(dataArr[1]);
|
||||
@@ -797,10 +797,6 @@ export default {
|
||||
this.$toast('请上传企业外观照片')
|
||||
return
|
||||
}
|
||||
if (!this.address&&this.$store.getters.cityIsNx) {
|
||||
this.$toast('请获取位置信息')
|
||||
return
|
||||
}
|
||||
if (this.isfaly1 == false) {
|
||||
let id = this.gzList.map(v => {
|
||||
return v.id
|
||||
|
||||
@@ -7,7 +7,8 @@
|
||||
<!-- <div class="title" style="margin-top: 20px;margin-left: 5px;">通用能源系统</div> -->
|
||||
<div class="partTwo-box">
|
||||
<div class="partTwo-content">
|
||||
<div class="title">空压机系统基本信息 <span style="font-size: 14px; color: #bbbbbb;">单机额定功率≥50kW</span></div>
|
||||
<!-- 单机额定功率≥50kW 电网让改 ≥5kW -->
|
||||
<div class="title">空压机系统基本信息 <span style="font-size: 14px; color: #bbbbbb;">单机额定功率≥5kW</span></div>
|
||||
<van-swipe-cell :right-width="65" v-for="(item, index) in list" :key="index">
|
||||
<div class="msg-card" @click="kongyajisystemaddedit(item.id)">
|
||||
<div>
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
<van-field v-model="form.systemModel" required :rules="[{ required: true },{pattern:/^.{2,20}$/, message:'2≤型号长度≤20'}]" label="空压机型号" placeholder="请输入空压机型号" maxlength="20" />
|
||||
<van-field v-model="form.motorModel" required :rules="[{ required: true },{pattern:/^.{2,20}$/, message:'2≤型号长度≤20'}]" label="电机型号" placeholder="请输入电机型号" maxlength="20" />
|
||||
<van-field v-input.numNo0 v-model="form.systemNum" type="number" required :rules="[{ required: true }]" label="台数(台)" placeholder="请输入台数" />
|
||||
<van-field v-input.floatNo0 v-model="form.ratedPowerValue" required :rules="[{ required: true }]" type="number" label="单台额定功率(kW)" placeholder="请输入" @blur="handelChange('ratedPowerValue',50,'单台额定功率')"/>
|
||||
<van-field v-input.floatNo0 v-model="form.ratedPowerValue" required :rules="[{ required: true }]" type="number" label="单台额定功率(kW)" placeholder="请输入" @blur="handelChange('ratedPowerValue',5,'单台额定功率')"/>
|
||||
<van-field v-input.float v-model="form.frequencyPerValue" required :rules="[{ required: true }]" type="number" label="变频占比(%)" placeholder="请输入" @input="handelChangeNumber('frequencyPerValue','变频占比')" />
|
||||
<van-field v-input.num v-model="form.absoleteElecNum" type="number" label="淘汰电机数量" placeholder="请输入" />
|
||||
<van-field v-input.num v-model="form.absoleteNum" type="number" label="淘汰空压机数量" placeholder="请输入" />
|
||||
|
||||
@@ -514,7 +514,7 @@ export default {
|
||||
return time
|
||||
},
|
||||
readOnly(){
|
||||
return this.yearForm.energyUnutilizedVO.notUsedResidueEnergyType!='01'
|
||||
return this.yearForm.energyUnutilizedVO&&this.yearForm.energyUnutilizedVO.notUsedResidueEnergyType!='01'
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
@@ -749,6 +749,7 @@ export default {
|
||||
if(this.notHeatDemandOtherName) {
|
||||
this.yearForm.energyUnutilizedVO.notHeatDemandOther = this.notHeatDemandOtherName
|
||||
}
|
||||
this.yearForm.energyUnutilizedVO = Object.assign( this.yearForm.energyUnutilizedVO ,this.customerInfo)
|
||||
}
|
||||
if(this.tabName == 'a'&&this.tips1){
|
||||
return
|
||||
@@ -756,7 +757,6 @@ export default {
|
||||
if(this.tabName == 'c'&&this.tips0){
|
||||
return
|
||||
}
|
||||
this.yearForm.energyUnutilizedVO = Object.assign( this.yearForm.energyUnutilizedVO ,this.customerInfo)
|
||||
let params = Object.assign(this.customerInfo, this.yearForm)
|
||||
params.taskId = this.tidCid.taskId
|
||||
if(this.$route.query.id) {
|
||||
|
||||
@@ -246,7 +246,8 @@ export default {
|
||||
refrigeTypeData: {},
|
||||
refrigeTypeDataSmall:{
|
||||
"1": ['3.80', '6.30'],
|
||||
"2": ['2.40', '3.40'],
|
||||
// "2": ['2.40', '3.40'], // 原来
|
||||
"2": ['2.00', '5.00'], //电网让改
|
||||
"3": ['3.50', '5.90'],
|
||||
"4": ['1.10', '1.40']
|
||||
},
|
||||
|
||||
@@ -1,18 +1,20 @@
|
||||
<template>
|
||||
<!-- :after-read="afterRead" -->
|
||||
<!-- :after-read="afterRead" -->
|
||||
<van-uploader
|
||||
v-model="fileList"
|
||||
multiple
|
||||
:max-count="1"
|
||||
:afterRead="afterRead"
|
||||
:before-delete="delImg"
|
||||
@click-upload="onUpload"
|
||||
>
|
||||
<div class="uploader">
|
||||
<van-icon name="plus" class="uploader-icon" />
|
||||
</div>
|
||||
</van-uploader>
|
||||
<!-- :after-read="afterRead" -->
|
||||
<!-- :after-read="afterRead" -->
|
||||
<van-uploader
|
||||
v-model="fileList"
|
||||
multiple
|
||||
:deletable="deletable"
|
||||
:max-count="1"
|
||||
:afterRead="afterRead"
|
||||
:before-delete="delImg"
|
||||
@click-upload="onUpload"
|
||||
accept="image/*"
|
||||
>
|
||||
<div class="uploader">
|
||||
<van-icon name="plus" class="uploader-icon" />
|
||||
</div>
|
||||
</van-uploader>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -20,123 +22,166 @@ import { uploadFile } from '@/api/api.js'
|
||||
import { chooseAlbumAndTakePhoto } from '@/utils/dsbridge'
|
||||
import { downloadUrl } from '@/settings'
|
||||
export default {
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
value: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
value: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
deletable: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
fileList: this.value,
|
||||
activTimer: null,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.activTimer = setTimeout(() => {
|
||||
this.fileList = this.value
|
||||
}, 200)
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearTimeout(this.activTimer)
|
||||
this.fileList = []
|
||||
},
|
||||
methods: {
|
||||
base64ToFile(data, fileName) {
|
||||
const dataArr = data.split(",");
|
||||
const byteString = window.atob(dataArr[1]);
|
||||
const options = {
|
||||
type: "image/jpeg",
|
||||
endings: "native"
|
||||
};
|
||||
const u8Arr = new Uint8Array(byteString.length);
|
||||
for (let i = 0; i < byteString.length; i++) {
|
||||
u8Arr[i] = byteString.charCodeAt(i);
|
||||
}
|
||||
let formData = new FormData();
|
||||
let fileOfBlob = new File([u8Arr], fileName + ".jpg", options);//返回文件流
|
||||
formData.append("file", fileOfBlob);
|
||||
return formData
|
||||
},
|
||||
// 上传图片调用原生的方法 获取到绝对路径调用getImageFileFromUrl
|
||||
onUpload () {
|
||||
chooseAlbumAndTakePhoto(async (data) => {
|
||||
let d = 'data:image/jpeg;base64,' + data
|
||||
this.fileIamge = d
|
||||
let params = this.base64ToFile(d,new Date().getTime().toString())
|
||||
const res = await uploadFile(params)
|
||||
if (res.code == 0) {
|
||||
this.fileList.push({
|
||||
fileName: res.data.original_name,
|
||||
fileId: res.data.attach_id,
|
||||
url:`${downloadUrl}${res.data.attach_id}`
|
||||
})
|
||||
this.$emit('onUpload', this.fileList, this.type)
|
||||
}
|
||||
})
|
||||
},
|
||||
async afterRead(file) {
|
||||
let params = new FormData()
|
||||
params.append('file', file.file)
|
||||
console.log(file.file);
|
||||
console.log(params);
|
||||
// console.log(decryptParseToJSON(a),77777777);
|
||||
const res = await uploadFile(params)
|
||||
if (res.code == 0) {
|
||||
this.$emit('afterRead', res.data, this.type)
|
||||
}
|
||||
return true
|
||||
},
|
||||
|
||||
delImg(file, detail) {
|
||||
this.fileList.splice(detail.index, 1)
|
||||
this.$emit('delImg', file, detail, this.type)
|
||||
},
|
||||
|
||||
checkImgisUpload(list){
|
||||
if(this.fileList&&list&&this.fileList.length==list.length){
|
||||
return false;
|
||||
}else{
|
||||
return true;
|
||||
}
|
||||
data() {
|
||||
return {
|
||||
fileList: this.value,
|
||||
activTimer: null,
|
||||
}
|
||||
|
||||
},
|
||||
mounted() {
|
||||
this.activTimer = setTimeout(() => {
|
||||
this.fileList = this.value
|
||||
}, 200)
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearTimeout(this.activTimer)
|
||||
this.fileList = []
|
||||
},
|
||||
methods: {
|
||||
base64ToFile(data, fileName) {
|
||||
const dataArr = data.split(',')
|
||||
const byteString = window.atob(dataArr[1])
|
||||
const options = {
|
||||
type: 'image/jpeg',
|
||||
endings: 'native',
|
||||
}
|
||||
const u8Arr = new Uint8Array(byteString.length)
|
||||
for (let i = 0; i < byteString.length; i++) {
|
||||
u8Arr[i] = byteString.charCodeAt(i)
|
||||
}
|
||||
let formData = new FormData()
|
||||
let fileOfBlob = new File([u8Arr], fileName + '.jpg', options) //返回文件流
|
||||
formData.append('file', fileOfBlob)
|
||||
return formData
|
||||
},
|
||||
// 上传图片调用原生的方法 获取到绝对路径调用getImageFileFromUrl
|
||||
onUpload() {
|
||||
console.log('--------chooseAlbumAndTakePhoto---', 'onUpload')
|
||||
chooseAlbumAndTakePhoto(async (data) => {
|
||||
console.log('--------onUpload---', data)
|
||||
let d = 'data:image/jpeg;base64,' + data
|
||||
this.fileIamge = d
|
||||
let params = this.base64ToFile(d, new Date().getTime().toString())
|
||||
console.log('--------params---', params)
|
||||
const res = await uploadFile(params)
|
||||
console.log('--------res---', res)
|
||||
if (res.code == 0) {
|
||||
this.fileList.push({
|
||||
fileName: res.data.original_name,
|
||||
fileId: res.data.attach_id,
|
||||
url: `${downloadUrl}${res.data.attach_id}`,
|
||||
})
|
||||
this.$emit('onUpload', this.fileList, this.type)
|
||||
}
|
||||
})
|
||||
},
|
||||
async afterRead(file) {
|
||||
console.log('--------afterRead---', file)
|
||||
let params = new FormData()
|
||||
params.append('file', file.file)
|
||||
console.log(file.file)
|
||||
console.log(params)
|
||||
// console.log(decryptParseToJSON(a),77777777);
|
||||
const res = await uploadFile(params)
|
||||
if (res.code == 0) {
|
||||
this.$emit('afterRead', res.data, this.type)
|
||||
}
|
||||
return true
|
||||
},
|
||||
beforeRead(file) {
|
||||
if (file.size > 30000) {
|
||||
return this.compressFiles(file)
|
||||
} else {
|
||||
return file
|
||||
}
|
||||
}, //压缩图片
|
||||
compressFiles(fileObj) {
|
||||
let type = fileObj.type
|
||||
return new Promise((resolve, reject) => {
|
||||
let reader = new FileReader()
|
||||
reader.readAsDataURL(fileObj)
|
||||
reader.onload = function (e) {
|
||||
let image = new Image() //新建一个img标签(不嵌入DOM节点,仅做canvas操作)
|
||||
image.src = e.target.result //让该标签加载base64格式的原图
|
||||
image.onload = function () {
|
||||
//图片加载完毕后再通过canvas压缩图片,否则图片还没加载完就压缩,结果图片是全黑的
|
||||
let canvas = document.createElement('canvas'), //创建一个canvas元素
|
||||
context = canvas.getContext('2d'), //context相当于画笔,里面有各种可以进行绘图的API
|
||||
imageWidth = image.width / 2, //压缩后图片的宽度,这里设置为缩小一半
|
||||
imageHeight = image.height / 2, //压缩后图片的高度,这里设置为缩小一半
|
||||
data = '' //存储压缩后的图片
|
||||
canvas.width = imageWidth //设置绘图的宽度
|
||||
canvas.height = imageHeight //设置绘图的高度
|
||||
|
||||
//使用drawImage重新设置img标签中的图片大小,实现压缩。drawImage方法的参数可以自行查阅W3C
|
||||
context.drawImage(image, 0, 0, imageWidth, imageHeight)
|
||||
//使用toDataURL将canvas上的图片转换为base64格式
|
||||
data = canvas.toDataURL(type)
|
||||
canvas.toBlob(function (blob) {
|
||||
const f = new File([blob], fileObj.name, { type })
|
||||
resolve(f)
|
||||
}, type)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
delImg(file, detail) {
|
||||
this.fileList.splice(detail.index, 1)
|
||||
this.$emit('delImg', file, detail, this.type)
|
||||
},
|
||||
|
||||
checkImgisUpload(list) {
|
||||
if (this.fileList && list && this.fileList.length == list.length) {
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang='less' scoped>
|
||||
/deep/ .van-uploader__preview-image {
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
border-radius: 10px;
|
||||
margin-left: 20px;
|
||||
margin-top: 10px;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
border-radius: 10px;
|
||||
margin-left: 20px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
/deep/ .van-uploader__preview-delete {
|
||||
margin-top: 10px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
|
||||
.uploader {
|
||||
width: 2.133333rem;
|
||||
height: 2.133333rem;
|
||||
background: #f7f7f7;
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 10px 0 10px 20px;
|
||||
.uploader-icon {
|
||||
font-size: 30px;
|
||||
color: #ababab;
|
||||
}
|
||||
width: 2.133333rem;
|
||||
height: 2.133333rem;
|
||||
background: #f7f7f7;
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 10px 0 10px 20px;
|
||||
.uploader-icon {
|
||||
font-size: 30px;
|
||||
color: #ababab;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user