|
@@ -2,50 +2,55 @@
|
|
<view class="content">
|
|
<view class="content">
|
|
<view>
|
|
<view>
|
|
<view class="form-data">
|
|
<view class="form-data">
|
|
- <u-form :model="form" ref="uForm" :label-width="140" :error-type="['toast']">
|
|
|
|
- <u-form-item label="其他垃圾:" >
|
|
|
|
- <u-input placeholder="请输入" :maxlength="30" v-model="form.receiverName" />
|
|
|
|
- <text slot="right" style="color: #000000;">桶(约{{125}}kg)</text>
|
|
|
|
- </u-form-item>
|
|
|
|
- <u-form-item label="厨余垃圾:" >
|
|
|
|
- <u-input placeholder="请输入" :maxlength="11" type="number" v-model="form.receiverPhone" />
|
|
|
|
- <text slot="right" style="color: #000000;">桶(约{{125}}kg)</text>
|
|
|
|
- </u-form-item>
|
|
|
|
- <u-form-item label="建筑垃圾:" >
|
|
|
|
- <u-input placeholder="请输入" :maxlength="11" type="number" v-model="form.receiverPhone" />
|
|
|
|
- <text slot="right" style="color: #000000;">吨(约{{125}}kg)</text>
|
|
|
|
- </u-form-item>
|
|
|
|
- </u-form>
|
|
|
|
- </view>
|
|
|
|
- <view class="form-data remark">
|
|
|
|
- <text>信息备注</text>
|
|
|
|
- <textarea :auto-height="true" :maxlength="500" v-model="form.receiveAddress" class="receiveAddress"/>
|
|
|
|
- </view>
|
|
|
|
- <view class="form-data qyImg">
|
|
|
|
- <text>清运照片</text>
|
|
|
|
- <view class="info-main">
|
|
|
|
- <view class="photograph-con">
|
|
|
|
- <u-icon v-show="photograph" name="close-circle-fill" color="#fa3534" size="50" class="close-circle-icon" @click="cancelPhotograph"></u-icon>
|
|
|
|
- <u-icon v-show="!photograph" name="camera" color="#bfbfbf" size="60" class="photograph-icon"></u-icon>
|
|
|
|
- <!-- <u-image src="/static/camera.png"></u-image> -->
|
|
|
|
- <u-image v-show="photograph" width="100%" height="100%" :src="photograph" @click="previewPictures"></u-image>
|
|
|
|
|
|
+ <u-form :model="form" ref="uForm" :label-width="140" :error-type="['toast']">
|
|
|
|
+ <u-form-item prop="gatherNum_other" label="其他垃圾:" >
|
|
|
|
+ <u-input :disabled="isView" type="number" placeholder="请输入" v-model="form.gatherNum_other" />
|
|
|
|
+ <text slot="right" style="color: #000000;">桶(约{{form.gatherNum_other*240}}kg)</text>
|
|
|
|
+ </u-form-item>
|
|
|
|
+ <u-form-item prop="gatherNum_chuyu" label="厨余垃圾:" >
|
|
|
|
+ <u-input :disabled="isView" placeholder="请输入" type="number" v-model="form.gatherNum_chuyu" />
|
|
|
|
+ <text slot="right" style="color: #000000;">桶(约{{form.gatherNum_chuyu*240}}kg)</text>
|
|
|
|
+ </u-form-item>
|
|
|
|
+ <u-form-item prop="gatherNum_jianzhu" label="建筑垃圾:" >
|
|
|
|
+ <u-input :disabled="isView" placeholder="请输入" type="number" v-model="form.gatherNum_jianzhu" />
|
|
|
|
+ <text slot="right" style="color: #000000;">吨(约{{form.gatherNum_jianzhu*1000}}kg)</text>
|
|
|
|
+ </u-form-item>
|
|
|
|
+ </u-form>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="form-data remark">
|
|
|
|
+ <text>信息备注</text>
|
|
|
|
+ <textarea :disabled="isView" :auto-height="true" :maxlength="500" v-model="form.remark" class="receiveAddress"/>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="form-data qyImg">
|
|
|
|
+ <text>清运照片</text>
|
|
|
|
+ <view class="info-main">
|
|
|
|
+ <view v-if="photograph.length<3" class="camera-btn">
|
|
|
|
+ <view @click="goPhotograph" class="photograph-camera">
|
|
|
|
+ <u-icon name="camera" color="#bfbfbf" size="60" ></u-icon>
|
|
|
|
+ </view>
|
|
|
|
+ <view >
|
|
|
|
+ (最多3张)
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
+ <view v-show="photograph.length" v-for="(item,index) in photograph" :key="index" class="photograph-con">
|
|
|
|
+ <u-icon v-show="!isView" name="close-circle-fill" color="#fa3534" size="50" class="close-circle-icon" @click="cancelPhotograph(index)"></u-icon>
|
|
|
|
+ <u-image width="100%" height="100%" :src="item" @click="previewPictures(item)"></u-image>
|
|
|
|
+ </view>
|
|
</view>
|
|
</view>
|
|
- <u-button @click="open" class="submitBtn" type="success" shape="circle">提交</u-button>
|
|
|
|
|
|
+ </view>
|
|
|
|
+ <u-button v-if="isView" @click="isView = false" class="submitBtn" type="waring" shape="circle">修改</u-button>
|
|
|
|
+ <u-button v-else @click="submit" :loading="loading" class="submitBtn" type="success" shape="circle">提交</u-button>
|
|
<uni-popup ref="openModal" type="center">
|
|
<uni-popup ref="openModal" type="center">
|
|
- <uni-popup-dialog content="确认提交吗?" @close="close" @confirm="onOk" :title="title"></uni-popup-dialog>
|
|
|
|
|
|
+ <uni-popup-dialog content="确认提交吗?" @confirm="onOk" :title="title"></uni-popup-dialog>
|
|
</uni-popup>
|
|
</uni-popup>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
- import {
|
|
|
|
- saveAddress
|
|
|
|
- } from '@/api/receiveAddress.js'
|
|
|
|
import uniPopup from '@/components/uni-popup/uni-popup.vue'
|
|
import uniPopup from '@/components/uni-popup/uni-popup.vue'
|
|
import uniPopupDialog from '@/components/uni-popup/uni-popup-dialog.vue'
|
|
import uniPopupDialog from '@/components/uni-popup/uni-popup-dialog.vue'
|
|
|
|
+ import {gatherSave} from '@/api/index.js'
|
|
export default {
|
|
export default {
|
|
components: {
|
|
components: {
|
|
uniPopup,uniPopupDialog
|
|
uniPopup,uniPopupDialog
|
|
@@ -53,24 +58,26 @@
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
title:'',
|
|
title:'',
|
|
- show:false,
|
|
|
|
- src:"",
|
|
|
|
|
|
+ loading:false, // 提交按钮加载圈
|
|
photograph: [], // 图片路径
|
|
photograph: [], // 图片路径
|
|
form: {
|
|
form: {
|
|
- receiverName: '',
|
|
|
|
- receiverPhone: '',
|
|
|
|
- receiveAddress: '' // 详细地址
|
|
|
|
|
|
+ gatherNum_other: '', // 其它垃圾
|
|
|
|
+ gatherNum_chuyu: '', // 厨余垃圾
|
|
|
|
+ gatherNum_jianzhu: '', // 建筑垃圾
|
|
|
|
+ remark: '' // 备注
|
|
},
|
|
},
|
|
|
|
+ isView: false // 是否是查看详情
|
|
};
|
|
};
|
|
},
|
|
},
|
|
onLoad(option) {
|
|
onLoad(option) {
|
|
console.log(option,option.id,'ppppppppp')
|
|
console.log(option,option.id,'ppppppppp')
|
|
// 查看
|
|
// 查看
|
|
if(option && option.id){
|
|
if(option && option.id){
|
|
-
|
|
|
|
|
|
+ this.isView = true
|
|
}else {
|
|
}else {
|
|
console.log('--------新增')
|
|
console.log('--------新增')
|
|
this.photograph = []
|
|
this.photograph = []
|
|
|
|
+ this.$refs.uForm.resetFields()
|
|
}
|
|
}
|
|
},
|
|
},
|
|
onUnload() {
|
|
onUnload() {
|
|
@@ -84,132 +91,87 @@
|
|
sourceType: ['album','camera'], //从相册选择
|
|
sourceType: ['album','camera'], //从相册选择
|
|
success: (res) =>{
|
|
success: (res) =>{
|
|
console.log(JSON.stringify(res.tempFilePaths));
|
|
console.log(JSON.stringify(res.tempFilePaths));
|
|
- // this.photograph = JSON.stringify(res.tempFilePaths)
|
|
|
|
- uni.showLoading({
|
|
|
|
- title: '保存中,请稍后...',
|
|
|
|
- mask: true
|
|
|
|
- })
|
|
|
|
- saveImgToAliOss(res.tempFilePaths[0],function(ret){
|
|
|
|
- console.log(ret)
|
|
|
|
- _this.photograph = ret.data
|
|
|
|
- uni.hideLoading()
|
|
|
|
- })
|
|
|
|
|
|
+ this.photograph = this.photograph.concat(res.tempFilePaths)
|
|
|
|
+ console.log(this.photograph.length,'this.photograph')
|
|
}
|
|
}
|
|
});
|
|
});
|
|
- // const _this = this;
|
|
|
|
-
|
|
|
|
- // wx.chooseImage({
|
|
|
|
- // count: 3, //最多可以选择的图片张数,默认9
|
|
|
|
- // sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
|
|
|
|
- // sourceType: ['camera'], //album 从相册选图,camera 使用相机,默认二者都有
|
|
|
|
- // success: function(res) {
|
|
|
|
- // // tempFilePaths 图片的本地文件路径列表,tempFiles 图片的本地文件列表,每一项是一个 File 对象
|
|
|
|
- // console.log(JSON.stringify(res.tempFilePaths));
|
|
|
|
- // uni.showLoading({
|
|
|
|
- // title: '保存中,请稍后...',
|
|
|
|
- // mask: true
|
|
|
|
- // })
|
|
|
|
- // // saveImgToAliOss(res.tempFilePaths[0],function(ret){
|
|
|
|
- // // console.log(ret)
|
|
|
|
- // // _this.photograph = ret.data
|
|
|
|
- // // uni.hideLoading()
|
|
|
|
- // // })
|
|
|
|
- // }
|
|
|
|
- // });
|
|
|
|
},
|
|
},
|
|
- // 预览签到图
|
|
|
|
- previewPictures() {
|
|
|
|
- const photograph = [this.photograph];
|
|
|
|
|
|
+ // 预览图片
|
|
|
|
+ previewPictures(item) {
|
|
|
|
+ const photograph = [item];
|
|
uni.previewImage({
|
|
uni.previewImage({
|
|
- urls: photograph
|
|
|
|
|
|
+ urls: photograph,
|
|
});
|
|
});
|
|
},
|
|
},
|
|
- // 删除签到图
|
|
|
|
- cancelPhotograph() {
|
|
|
|
|
|
+ // 删除图片
|
|
|
|
+ cancelPhotograph(index) {
|
|
setTimeout(() => {
|
|
setTimeout(() => {
|
|
- this.photograph = '';
|
|
|
|
|
|
+ this.photograph.splice(index,1)
|
|
}, 500);
|
|
}, 500);
|
|
},
|
|
},
|
|
// 提交
|
|
// 提交
|
|
- open(){
|
|
|
|
- this.$refs.openModal.open()
|
|
|
|
- },
|
|
|
|
- // 取消
|
|
|
|
- close(){
|
|
|
|
|
|
+ submit(){
|
|
|
|
+ if(!this.form.gatherNum_other && !this.form.gatherNum_chuyu && !this.form.gatherNum_jianzhu) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: '请至少输入一项垃圾分类的数量!',
|
|
|
|
+ icon: 'none'
|
|
|
|
+ })
|
|
|
|
+ return false
|
|
|
|
+ } else {
|
|
|
|
+ this.$refs.openModal.open()
|
|
|
|
+ }
|
|
},
|
|
},
|
|
// 确认提交
|
|
// 确认提交
|
|
onOk() {
|
|
onOk() {
|
|
- this.$refs.openModal.open()
|
|
|
|
- // this.show=true
|
|
|
|
-
|
|
|
|
- // this.$refs.uForm.validate(valid => {
|
|
|
|
- // if (valid) {
|
|
|
|
- // console.log('验证通过');
|
|
|
|
- // if (this.form.receiverName ==='') {
|
|
|
|
- // uni.showToast({
|
|
|
|
- // title: '请输入姓名',
|
|
|
|
- // icon: 'none'
|
|
|
|
- // })
|
|
|
|
- // return false
|
|
|
|
- // }
|
|
|
|
- // if (this.form.receiverPhone ==='') {
|
|
|
|
- // uni.showToast({
|
|
|
|
- // title: '请输入电话',
|
|
|
|
- // icon: 'none'
|
|
|
|
- // })
|
|
|
|
- // return false
|
|
|
|
- // }
|
|
|
|
- // // 省市区
|
|
|
|
- // if(this.areaIdArr.length == 0){
|
|
|
|
- // uni.showToast({icon: 'none',title: '请选择省市区'})
|
|
|
|
- // return
|
|
|
|
- // }
|
|
|
|
- // if (this.form.receiveAddress ==='') {
|
|
|
|
- // uni.showToast({
|
|
|
|
- // title: '请输入详细地址',
|
|
|
|
- // icon: 'none'
|
|
|
|
- // })
|
|
|
|
- // return false
|
|
|
|
- // }
|
|
|
|
- // let params = {
|
|
|
|
- // receiverName: this.form.receiverName,
|
|
|
|
- // receiverPhone: this.form.receiverPhone,
|
|
|
|
- // receiveAreasName: this.areaInfo.label.replace(/\-/g,','), // 地址名称
|
|
|
|
- // receiveAreas: this.areaIdArr.join(','),
|
|
|
|
- // receiveAddress: this.form.receiveAddress // 详细地址
|
|
|
|
- // }
|
|
|
|
- // if(this.form.id) {
|
|
|
|
- // params.id = this.form.id
|
|
|
|
- // }
|
|
|
|
- // saveAddress(params).then(res=>{
|
|
|
|
- // if(res.status == 200) {
|
|
|
|
- // uni.showToast({
|
|
|
|
- // title: res.message,
|
|
|
|
- // icon: 'none'
|
|
|
|
- // })
|
|
|
|
- // setTimeout(()=>{
|
|
|
|
- // uni.navigateBack()
|
|
|
|
- // },300)
|
|
|
|
- // }
|
|
|
|
- // })
|
|
|
|
- // } else {
|
|
|
|
- // console.log('验证失败');
|
|
|
|
- // }
|
|
|
|
- // });
|
|
|
|
|
|
+ this.$refs.openModal.close()
|
|
|
|
+ let params = {
|
|
|
|
+ rubbishEntityList: [],
|
|
|
|
+ imageUrlList: this.photograph
|
|
|
|
+ }
|
|
|
|
+ if(this.form.gatherNum_other) {
|
|
|
|
+ params.rubbishEntityList.push({
|
|
|
|
+ "rubbishType":"GATHER_OTHER",
|
|
|
|
+ "rubbishWeight": this.form.gatherNum_other*240,
|
|
|
|
+ "gatherNum": this.form.gatherNum_other,
|
|
|
|
+ "unit":"BUCKET"
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ if(this.form.gatherNum_chuyu) {
|
|
|
|
+ params.rubbishEntityList.push({
|
|
|
|
+ "rubbishType":"GATHER_KITCHEN",
|
|
|
|
+ "rubbishWeight": this.form.gatherNum_chuyu*240,
|
|
|
|
+ "gatherNum": this.form.gatherNum_chuyu,
|
|
|
|
+ "unit":"BUCKET"
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ if(this.form.gatherNum_jianzhu) {
|
|
|
|
+ params.rubbishEntityList.push({
|
|
|
|
+ "rubbishType":"GATHER_BUILDING",
|
|
|
|
+ "rubbishWeight": this.form.gatherNum_jianzhu*1000,
|
|
|
|
+ "gatherNum": this.form.gatherNum_jianzhu,
|
|
|
|
+ "unit":"TON"
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ this.loading=true
|
|
|
|
+ gatherSave(params).then(res=>{
|
|
|
|
+ if(res.status == 200) {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: res.message,
|
|
|
|
+ icon: 'none'
|
|
|
|
+ })
|
|
|
|
+ setTimeout(()=>{
|
|
|
|
+ uni.navigateBack()
|
|
|
|
+ },300)
|
|
|
|
+ } else {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: res.message,
|
|
|
|
+ icon: 'none'
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ this.loading= false
|
|
|
|
+ })
|
|
},
|
|
},
|
|
- // 拍照
|
|
|
|
- takePhoto() {
|
|
|
|
- const ctx = uni.createCameraContext();
|
|
|
|
- ctx.takePhoto({
|
|
|
|
- quality: 'high',
|
|
|
|
- success: (res) => {
|
|
|
|
- this.src = res.tempImagePath
|
|
|
|
- }
|
|
|
|
- });
|
|
|
|
- },
|
|
|
|
- error(e) {
|
|
|
|
- console.log(e.detail);
|
|
|
|
- }
|
|
|
|
|
|
+
|
|
},
|
|
},
|
|
// 必须要在onReady生命周期,因为onLoad生命周期组件可能尚未创建完毕
|
|
// 必须要在onReady生命周期,因为onLoad生命周期组件可能尚未创建完毕
|
|
onReady() {
|
|
onReady() {
|
|
@@ -255,15 +217,30 @@
|
|
margin-top: 14upx;
|
|
margin-top: 14upx;
|
|
border-radius: 12upx;
|
|
border-radius: 12upx;
|
|
background-color: #fff;
|
|
background-color: #fff;
|
|
|
|
+ display: flex;
|
|
.location-icon {
|
|
.location-icon {
|
|
padding-left: 10upx;
|
|
padding-left: 10upx;
|
|
vertical-align: sub;
|
|
vertical-align: sub;
|
|
}
|
|
}
|
|
- .photograph-con {
|
|
|
|
|
|
+ .photograph-camera {
|
|
border: 2upx dashed #bfbfbf;
|
|
border: 2upx dashed #bfbfbf;
|
|
border-radius: 12upx;
|
|
border-radius: 12upx;
|
|
- width: 160upx;
|
|
|
|
- height: 160upx;
|
|
|
|
|
|
+ width: 140upx;
|
|
|
|
+ height: 140upx;
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ }
|
|
|
|
+ .camera-btn{
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-direction: column;
|
|
|
|
+ align-items: center;
|
|
|
|
+ color: #999999;
|
|
|
|
+ }
|
|
|
|
+ .photograph-con {
|
|
|
|
+ margin: 0 20upx;
|
|
|
|
+ width: 140upx;
|
|
|
|
+ height: 140upx;
|
|
text-align: center;
|
|
text-align: center;
|
|
position: relative;
|
|
position: relative;
|
|
.photograph-icon {
|
|
.photograph-icon {
|