integrated_traffic_uniapp/pages/application/hidden-danger-check-standard/custom/list-item-check-imgs.vue

378 lines
9.6 KiB
Vue
Raw Permalink Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view :class="isUps == true ? 'prevent' : ''">
<cu-custom bgColor="bg-gradual-blueness" :isBack="true">
<block slot="backText">返回</block>
<block slot="content">检查照片</block>
</cu-custom>
<scroll-view scroll-y="false" >
<view class="form">
<view class="cu-bar bg-white margin-top">
<view class="action">
检查照片
</view>
<view class="action">
{{imgList.length}}/4
</view>
</view>
<view class="cu-form-group">
<view class="grid col-4 grid-square flex-sub">
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" data-type="0" :data-url="imgList[index].filePath">
<image :src="imgList[index].filePath" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="DelImg" data-type="0" :data-index="index">
<text class='cuIcon-close'></text>
</view>
</view>
<view class="solids" @tap="ChooseImage(0)" v-if="imgList.length<4">
<text class='cuIcon-cameraadd'></text>
</view>
</view>
</view>
</view>
<view class="padding flex flex-direction">
<button :loading="buttonloading" class="cu-btn bg-blue margin-tb-sm lg" @click="$noMultipleClicks(goSubmit)"></button>
</view>
</scroll-view>
</view>
</template>
<script>
import {
basePath,corpinfoId,deptId,loginUser,formatDate,loginSession,baseImgPath
} from '@/common/tool.js';
import tkiTree from "@/components/select-tree/select-tree.vue"
import gcoord from '@/common/gcoord.js'
export default {
components: {
tkiTree
},
data() {
return {
isUps:false,
RECORDITEM_ID:'',
buttonloading: false,
index:'',
noClick:true,
imgList: [],
}
},
onLoad(event){
this.RECORDITEM_ID = event.RECORDITEM_ID;
this.getData();
loginSession();
},
methods: {
getData() {
var _this = this;
uni.showLoading({
title: '请稍候'
})
uni.request({
url: basePath + '/app/imgfiles/listImgs',
method: 'POST',
dataType: 'json',
header: {
'Content-type': 'application/x-www-form-urlencoded'
},
data: {
FOREIGN_KEY: _this.RECORDITEM_ID,
TYPE:14,
CORPINFO_ID:loginUser.CORPINFO_ID,
USER_ID:loginUser.USER_ID,
},
success: (res) => {
if ("success" == res.data.result) {
uni.hideLoading();
let files=res.data.imgs;
for(var i=0;i<files.length;i++){
let img={};
img.filePath=baseImgPath+files[i].FILEPATH;
img.id=files[i].IMGFILES_ID;
_this.imgList.push(img);
}
} else if ("exception" == data.result) {
uni.showToast({
title: '',
duration: 2000
});
}
}
});
},
//
ChooseImage(e) {
var _this = this;
var ss=4-this.imgList.length;
uni.chooseImage({
count: ss, //9
sizeType: ['original', 'compressed'], //
sourceType: ['camera','album'], //
success: (res) => {
if(e==0) {
for (let i = 0; i < res.tempFilePaths.length; i++) {
let img={};
img.id='';
img.filePath=res.tempFilePaths[i];
this.imgList.push(img)
}
}else {
for (let i = 0; i < res.tempFilePaths.length; i++) {
let img = {};
img.id = '';
img.filePath = res.tempFilePaths[i];
this.imgList1.push(img)
}
}
}
});
},
ViewImage(e) {
console.info(e.currentTarget.dataset.type)
if(e.currentTarget.dataset.type==0) {
let files =[];
for(var i=0;i<this.imgList.length;i++){
files.push(this.imgList[i].filePath)
}
uni.previewImage({
urls: files,
current: e.currentTarget.dataset.url
});
}else{
let files =[];
for(var i=0;i<this.imgList1.length;i++){
files.push(this.imgList1[i].filePath)
}
uni.previewImage({
urls: files,
current: e.currentTarget.dataset.url
});
}
},
DelImg(e) {
var _this = this;
let i=e.currentTarget.dataset.index
uni.showModal({
title: '',
content: '',
cancelColor:"#000000",
cancelText: '',
confirmText: '',
success: res => {
if (res.confirm) {
if(e.currentTarget.dataset.type==0) {
if(_this.imgList[i].id) {
uni.showLoading({
title: '处理中'
})
uni.request({
url: basePath+'/app/imgfiles/delete',
method: 'POST',
dataType: 'json',
header: {
'Content-type':'application/x-www-form-urlencoded'
},
data: {
IMGFILES_ID: _this.imgList[i].id,
CORPINFO_ID:loginUser.CORPINFO_ID,
USER_ID:loginUser.USER_ID,
},
success: (res) => {
uni.hideLoading();
uni.showToast({
icon: 'none',
title: '删除成功',
duration: 1500
});
_this.imgList.splice(i, 1)
},
fail: (err) => {
uni.hideLoading();
uni.showModal({
content: err.errMsg,
showCancel: false
});
}
})
}else {
this.imgList.splice(e.currentTarget.dataset.index, 1)
}
}else{
if(_this.imgList1[i].id) {
uni.showLoading({
title: '处理中'
})
uni.request({
url: basePath+'/app/imgfiles/delete',
method: 'POST',
dataType: 'json',
header: {
'Content-type':'application/x-www-form-urlencoded'
},
data: {
IMGFILES_ID: _this.imgList1[i].id,
CORPINFO_ID:loginUser.CORPINFO_ID,
USER_ID:loginUser.USER_ID,
},
success: (res) => {
uni.hideLoading();
uni.showToast({
icon: 'none',
title: '删除成功',
duration: 1500
});
_this.imgList1.splice(i, 1)
},
fail: (err) => {
uni.hideLoading();
uni.showModal({
content: err.errMsg,
showCancel: false
});
}
})
}else {
this.imgList1.splice(e.currentTarget.dataset.index, 1)
}
}
}
}
})
},
goSubmit() {
var _this = this;
this.buttonloading = true
var fileList = [];
for (var i = 0; i < _this.imgList.length; i++) {
if(!_this.imgList[i].id){
var file = {};
file.type = 14;
file.filePath = _this.imgList[i].filePath;
fileList.push(file);
}
}
if(fileList.length > 0){
var i=0;
_this.uploadImg(fileList,i);
} else {
uni.showToast({
icon: 'none',
title: '保存成功',
duration: 1000
});
this.buttonloading = false
setTimeout(function() {
var pages = getCurrentPages(); // 获取当前页面栈
var prePage = pages[pages.length - 2]; // 上一个页面
// var task = prePage.$vm.list[_this.index];
if(_this.index) {
prePage.$vm.initflag = true; // A 页面 init方法 为true
/* prePage.$vm.list[_this.index].ISNORMAL = 1;
prePage.$vm.list[_this.index].HIDDEN_ID = _this.pd.HIDDEN_ID; */
}
uni.navigateBack({});
uni.hideLoading();
}, 1000);
}
},
uploadImg(tempFilePaths,i){
var _this = this;
uni.showLoading({
title: '上传中'
})
uni.uploadFile({
url: basePath+'/app/imgfiles/add',
filePath: tempFilePaths[i].filePath,
name: 'FFILE',
formData: {
'TYPE': tempFilePaths[i].type,
'FOREIGN_KEY': _this.RECORDITEM_ID,
CORPINFO_ID: loginUser.CORPINFO_ID,
USER_ID: loginUser.USER_ID,
},
success: (res) => {
i++;
if (tempFilePaths.length > i) {
_this.uploadImg(tempFilePaths, i);
} else {
uni.showToast({
icon: 'none',
title: '保存成功',
duration: 1000
});
setTimeout(function() {
var pages = getCurrentPages(); // 获取当前页面栈
var prePage = pages[pages.length - 2]; // 上一个页面
// var task = prePage.$vm.list[_this.index];
if(_this.index) {
prePage.$vm.initflag = true; // A 页面 init方法 为true
/* prePage.$vm.list[_this.index].ISNORMAL = 1;
prePage.$vm.list[_this.index].HIDDEN_ID = _this.pd.HIDDEN_ID; */
}
uni.navigateBack({});
uni.hideLoading();
}, 1000);
}
},
fail: (err) => {
uni.hideLoading();
uni.showModal({
content: err.errMsg,
showCancel: false
});
}
})
},
}
}
</script>
<style>
.prevent {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
overflow: hidden;
}
.cu-form-title{
padding: 20upx 0;
}
.cu-form-textarea{
background-color: #ffffff;
padding: 1upx 30upx 20upx;
min-height: 100upx;
}
.cu-form-textarea textarea {
height: 4.6em;
width: 100%;
line-height: 1.2em;
flex: 1;
font-size: 28upx;
padding: 0;
}
.selected{
display: flex;
align-items: center;
height: 100upx;
}
.selected .radio{
transform:scale(0.8);
margin-right: 10upx;
}
.group{
display: flex;
align-items: center;
}
.cu-form-group .title{
font-size: 28upx;
color: #666;
}
.cu-bar .action:first-child {
font-size: 28upx;
}
</style>