598 lines
16 KiB
Vue
598 lines
16 KiB
Vue
<template>
|
||
<view class="page_wrap fullHeight">
|
||
<view class="fixedheader">
|
||
<headers :showBack="true">
|
||
<view class="headerName">
|
||
试块列表
|
||
</view>
|
||
</headers>
|
||
</view>
|
||
|
||
<view class="smallHeight" :style="{ 'padding-top': ((statusBarHeight * 2) + 45) * 1.5 + 'rpx' }">
|
||
<view class="content">
|
||
<scroll-view class="smallHeight content_list" scroll-y>
|
||
<view style="padding-top: 36rpx;padding-bottom: 90px" v-if="listData.length>0">
|
||
<view class="list_item" v-for="(item,index) in listData" :key="index">
|
||
<view class="status">
|
||
<image v-if="item.sampleState == 2" src="../../../static/betonManage/status1.png"></image>
|
||
<image v-if="item.sampleState == 1" src="../../../static/betonManage/status2.png"></image>
|
||
<image v-if="item.sampleState == 3" src="../../../static/betonManage/status3.png"></image>
|
||
</view>
|
||
<view class="item_info">
|
||
<view style="margin-bottom: 20rpx" @click="goPage(item.id)">
|
||
<view class="flex">
|
||
<view class="left">
|
||
<view class="info_item"><text style="color: #948EAD">试块名称：</text>{{item.sampleName}}</view>
|
||
<view class="info_item"><text style="color: #948EAD">实验室：</text>{{item.laboratoryName}}</view>
|
||
<view class="info_item"><text style="color: #948EAD">入库时间：</text>{{item.putStorageTime}}</view>
|
||
<view class="info_item" v-if="item.sampleState == 3"><text style="color: #948EAD" >出库时间：</text>{{item.inspectionTime}}</view>
|
||
</view>
|
||
<view class="right">
|
||
<view class="info_item"><text style="color: #948EAD">养护周期(天)：</text>{{item.curingPeriod}}</view>
|
||
<view class="info_item"><text style="color: #948EAD">试验负责人：</text>{{item.laboratoryDirector}}</view>
|
||
<view class="info_item"><text style="color: #948EAD">入库人：</text>{{item.createUserName}}</view>
|
||
<view class="info_item" v-if="item.sampleState == 3"><text style="color: #948EAD">送检结果：</text><text :style="{color: item.qualifiedType == 2 ? '#F56C6C':''}">{{item.qualifiedType == 1 ? '正常':'异常'}}</text></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="bottom_box" v-if="item.dataType == 1">养护已到期，<text style="color: #5181F6" @click="goDetection(item.id)">点击出库送检</text></view>
|
||
<view class="bottom_box" v-if="item.sampleState == 2">送检中，<text style="color: #5181F6" @click="sendRecord(item.id)">点击上传送检报告</text></view>
|
||
<view class="bottom_box" v-if="item.sampleState == 1 && item.dataType != 1">当前已养护<text style="color: #5181F6">{{item.maintainDayNum}}天</text></view>
|
||
<view class="bottom_box" v-if="item.sampleState == 3"><text style="color: #5181F6" @click="showFile(item)">送检报告下载</text></view>
|
||
</view>
|
||
</view>
|
||
|
||
|
||
</view>
|
||
<view class="no_data" v-else>
|
||
<image src="../../../static/noData.png"></image>
|
||
<view>暂无数据</view>
|
||
</view>
|
||
</scroll-view>
|
||
<view class="addForm_btn" @click="goAdd">入库</view>
|
||
</view>
|
||
</view>
|
||
<dialogs class="formDialog" ref="dialogs">
|
||
<template v-slot:content>
|
||
<view class="dialog-title">
|
||
上传送检报告
|
||
</view>
|
||
<view class="dialog-content">
|
||
<view class="form_label">
|
||
送检报告
|
||
<view class="add_btn" @click="uploadImage">
|
||
<uni-icons2 type="plus-filled" color="#5181F6" size="18"></uni-icons2>
|
||
上传
|
||
</view>
|
||
</view>
|
||
<view class="file_list">
|
||
<view class="file_item" v-for="(item,index) in form.inspectionReport" :key="index">
|
||
<image :src="url_config+'image/'+item.url" @click="previewImage(url_config+'image/'+item.url)"></image>
|
||
<view style="display: flex;"><text class="img_name">{{item.name}}</text> <text>{{item.createTime}}</text></view>
|
||
<uni-icons2 type="trash" color="#F56C6C" @click="deleteImg(index)"></uni-icons2>
|
||
</view>
|
||
</view>
|
||
<view class="form_item">
|
||
<view class="form_label">
|
||
送检结果
|
||
</view>
|
||
<radio-group @change="radioChange">
|
||
<label class="uni-list-cell uni-list-cell-pd" style="margin-right: 20rpx">
|
||
<view>
|
||
<radio value="1" :checked="form.qualifiedType == 1" />
|
||
</view>
|
||
<view>正常</view>
|
||
</label>
|
||
<label class="uni-list-cell uni-list-cell-pd">
|
||
<view>
|
||
<radio value="2" :checked="form.qualifiedType == 2" />
|
||
</view>
|
||
<view>异常</view>
|
||
</label>
|
||
</radio-group>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="dialog-btn">
|
||
<view class="cancle-btn" @click="cancleReply">取消</view>
|
||
<view class="primary-btn" @click="submitReply">提交</view>
|
||
</view>
|
||
</template>
|
||
</dialogs>
|
||
|
||
<dialogs class="formDialog" ref="dialogs2">
|
||
<template v-slot:content>
|
||
<view class="dialog-title">
|
||
下载送检报告
|
||
</view>
|
||
<view class="dialog-content">
|
||
<view class="file_list">
|
||
<view class="file_item" v-for="(item,index) in fileList" :key="index+'_'+item.createTime">
|
||
<image :src="url_config+'image/'+item.url" @click="previewImage(url_config+'image/'+item.url)"></image>
|
||
<view style="display: flex;"><text class="img_name">{{item.name}}</text> <text>{{item.createTime}}</text></view>
|
||
<!-- <uni-icons2 type="trash" color="#F56C6C" @click="deleteImg(index)"></uni-icons2> -->
|
||
<view style="display: flex;">
|
||
<image v-if="!item.progress" style="width: 30rpx;height: 30rpx;" src="../../../static/betonManage/downLoad.png" @click="downLoad(item,index)"></image>
|
||
<!-- <text v-if="item.progress" style="color: #F56C6C;">{{item.progress}}%</text> -->
|
||
<image v-if="item.progress" style="width: 50rpx;height: 17px;" src="../../../static/betonManage/downLoad_success.png" @click="previewImage(url_config+'image/'+item.url)"></image>
|
||
<!-- <view style="text-indent: -9999px;">{{item.progress}}</view> -->
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</template>
|
||
</dialogs>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import dialogs from '../../../components/dialog/dialog.vue'
|
||
export default{
|
||
data(){
|
||
return{
|
||
statusBarHeight: 0,
|
||
form:{
|
||
inspectionReport: [],
|
||
qualifiedType: 1,
|
||
sampleState: 3
|
||
},
|
||
detailId: '',
|
||
listData: [],
|
||
fileList: []
|
||
}
|
||
},
|
||
|
||
components:{
|
||
dialogs
|
||
},
|
||
onShow(){
|
||
this.statusBarHeight = uni.getStorageSync('systemInfo').statusBarHeight;
|
||
this.loadData()
|
||
},
|
||
onLoad(options){
|
||
this.detailId = options.id
|
||
this.loadData()
|
||
},
|
||
methods:{
|
||
downLoad(item,index){
|
||
let that = this
|
||
// this.fileList.forEach((itm,idx)=>{
|
||
// if(index == idx){
|
||
// itm.progress = 100
|
||
// }
|
||
|
||
// })
|
||
// this.fileList.splice(index, 1,item)
|
||
// this.fileList = this.fileList
|
||
// // item.progress = true
|
||
// this.$forceUpdate()
|
||
// console.log(item.progress)
|
||
// url_config+'image/'+item.url
|
||
const downloadTask = uni.downloadFile({
|
||
url: this.url_config+'image/'+item.url,
|
||
success: (res) => {
|
||
if (res.statusCode === 200) {
|
||
console.log('下载成功');
|
||
// item.progress = true
|
||
uni.saveImageToPhotosAlbum({
|
||
filePath: this.url_config+'image/'+item.url,
|
||
success: function () {
|
||
// item.progress = 100
|
||
// console.log(that.fileList[index])
|
||
that.$forceUpdate()
|
||
}
|
||
});
|
||
}
|
||
}
|
||
});
|
||
|
||
downloadTask.onProgressUpdate((res) => {
|
||
console.log('下载进度' + res.progress);
|
||
// console.log('已经下载的数据长度' + res.totalBytesWritten);
|
||
// console.log('预期需要下载的数据总长度' + res.totalBytesExpectedToWrite);
|
||
// that.fileList[index].progress = res.progress
|
||
// console.log(that.fileList)
|
||
that.fileList.forEach((itm,idx)=>{
|
||
if(index == idx){
|
||
itm.progress = res.progress
|
||
}
|
||
|
||
})
|
||
that.fileList.splice(index, 1,item)
|
||
that.$forceUpdate()
|
||
// 满足测试条件，取消下载任务。
|
||
// if (res.progress > 50) {
|
||
// downloadTask.abort();
|
||
// }
|
||
});
|
||
},
|
||
showFile(val){
|
||
this.$refs.dialogs2.showFn()
|
||
this.fileList = JSON.parse(val.inspectionReport)
|
||
this.fileList.forEach(item=>{
|
||
item.progress = 0
|
||
})
|
||
},
|
||
radioChange(e){
|
||
console.log(e)
|
||
this.form.qualifiedType = Number(e.detail.value)
|
||
},
|
||
getNowTime() {
|
||
let dateTime
|
||
let yy = new Date().getFullYear()
|
||
let mm = new Date().getMonth() + 1
|
||
let dd = new Date().getDate()
|
||
let hh = new Date().getHours()
|
||
let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes()
|
||
:
|
||
new Date().getMinutes()
|
||
let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds()
|
||
:
|
||
new Date().getSeconds()
|
||
dateTime = yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf + ':' + ss
|
||
console.log(dateTime)
|
||
return dateTime
|
||
},
|
||
//上传附件
|
||
uploadImage() {
|
||
var that = this
|
||
uni.chooseImage({
|
||
// count: 5 - that.imageList.length,
|
||
success(res) {
|
||
const tempFilePaths = res.tempFilePaths;
|
||
uni.uploadFile({
|
||
url: that.url_config + 'upload/image', //仅为示例，非真实的接口地址
|
||
filePath: tempFilePaths[0],
|
||
name: 'files',
|
||
success: (uploadFileRes) => {
|
||
let data = {
|
||
name: res.tempFiles[0].name,
|
||
url: JSON.parse(uploadFileRes.data).data[0].imageUrl,
|
||
createTime: that.getNowTime()
|
||
};
|
||
that.form.inspectionReport.push(data)
|
||
console.log(that.form.inspectionReport)
|
||
// console.log(res.tempFiles[0].name)
|
||
|
||
// that.imageList.push(data)
|
||
}
|
||
});
|
||
}
|
||
})
|
||
},
|
||
//删除附件
|
||
deleteImg(val) {
|
||
let that = this;
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '确定删除该附件吗?',
|
||
success: function(res) {
|
||
if (res.confirm) {
|
||
that.form.inspectionReport.splice(val,1)
|
||
} else if (res.cancel) {
|
||
console.log('用户点击取消');
|
||
}
|
||
}
|
||
});
|
||
|
||
},
|
||
|
||
//预览图片
|
||
previewImage(url) {
|
||
uni.previewImage({
|
||
urls: [url]
|
||
})
|
||
},
|
||
goDetection(id){
|
||
let that = this
|
||
this.sendRequest({
|
||
url: 'xmgl/massReboundSampleStorageRecord/updateInspectionBatch',
|
||
data: {ids: id},
|
||
method: "POST",
|
||
success(res) {
|
||
console.log(res)
|
||
uni.showToast({
|
||
title: '送检成功！'
|
||
})
|
||
that.loadData()
|
||
}
|
||
})
|
||
},
|
||
loadData(){
|
||
let that = this
|
||
this.sendRequest({
|
||
url: 'xmgl/massReboundSampleStorageRecord/selectList',
|
||
data: {pouringId: this.detailId},
|
||
method: "POST",
|
||
success(res) {
|
||
console.log(res)
|
||
that.listData = res.result
|
||
}
|
||
})
|
||
},
|
||
goPage(id){
|
||
uni.navigateTo({
|
||
url: './testSpecimenDetail?id='+id
|
||
})
|
||
},
|
||
cancleReply(){
|
||
this.form = {
|
||
inspectionReport: [],
|
||
qualifiedType: 1,
|
||
sampleState: 3
|
||
}
|
||
this.$refs.dialogs.hideFn2()
|
||
},
|
||
submitReply(){
|
||
if(this.form.inspectionReport.length<1){
|
||
uni.showToast({
|
||
title: '请上传送检报告',
|
||
icon: 'none'
|
||
})
|
||
return false;
|
||
}
|
||
let params = this.form
|
||
params.inspectionReport = JSON.stringify(this.form.inspectionReport)
|
||
let that = this
|
||
console.log(params)
|
||
this.sendRequest({
|
||
url: 'xmgl/massReboundSampleStorageRecord/edit',
|
||
data: params,
|
||
method: "POST",
|
||
success(res) {
|
||
console.log(res)
|
||
uni.showToast({
|
||
title: '上传成功！'
|
||
})
|
||
that.cancleReply()
|
||
that.loadData()
|
||
}
|
||
})
|
||
// this.$refs.dialogs.hideFn2()
|
||
},
|
||
sendRecord(id){
|
||
this.form.id = id
|
||
this.$refs.dialogs.showFn()
|
||
},
|
||
goAdd(){
|
||
// uni.navigateTo({
|
||
// url: './addInspectionRecord'
|
||
// })
|
||
uni.navigateTo({
|
||
url: './addTestSpecimen?id=' + this.detailId
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
|
||
.fixedheader{
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
z-index: 2;
|
||
}
|
||
.smallHeight{
|
||
height: 100%;
|
||
box-sizing: border-box;
|
||
}
|
||
.content{
|
||
height: 100%;
|
||
// background: #fff;
|
||
}
|
||
.content_list{
|
||
background: #fff;
|
||
height: 100%;
|
||
.list_item{
|
||
// height: 150rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 30rpx 30rpx;
|
||
padding-bottom: 0;
|
||
padding-right: 0px;
|
||
box-sizing: border-box;
|
||
width: 90%;
|
||
margin: 0 auto;
|
||
margin-bottom: 30rpx;
|
||
border-radius: 10rpx;
|
||
box-shadow: 0px 4rpx 11px 0px rgba(212, 220, 236, 0.65);
|
||
position: relative;
|
||
.status{
|
||
position: absolute;
|
||
right: 0;
|
||
top: 10rpx;
|
||
uni-image{
|
||
width: 134rpx;
|
||
height: 108rpx;
|
||
}
|
||
}
|
||
uni-checkbox{
|
||
:deep(.uni-checkbox-input){
|
||
margin-right: 12rpx;
|
||
width: 36rpx;
|
||
height: 36rpx;
|
||
border-radius: 50%;
|
||
}
|
||
:deep(.uni-checkbox-input-checked){
|
||
background-color: rgb(0, 122, 255);
|
||
}
|
||
:deep(.uni-checkbox-input-checked:before){
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
.left{
|
||
flex: 1;
|
||
font-size: 28rpx;
|
||
margin-right: 10rpx;
|
||
}
|
||
.right{
|
||
flex: 1;
|
||
font-size: 28rpx;
|
||
}
|
||
.info_item{
|
||
margin-bottom: 4rpx;
|
||
}
|
||
|
||
.item_info{
|
||
// margin-bottom: 20rpx;
|
||
padding-top: 36rpx;
|
||
flex: 1;
|
||
}
|
||
.bottom_box{
|
||
width: 100%;
|
||
height: 76rpx;
|
||
line-height: 76rpx;
|
||
text-align: center;
|
||
font-size: 28rpx;
|
||
background-image: linear-gradient(to right, rgba(81, 129, 246,0), rgba(81, 129, 246, 0.1),rgba(81, 129, 246,0));
|
||
}
|
||
}
|
||
.flex{
|
||
display: flex;
|
||
}
|
||
}
|
||
.addForm_btn{
|
||
width: 88%;
|
||
height: 100rpx;
|
||
line-height: 100rpx;
|
||
font-size: 40rpx;
|
||
background: #4181FE;
|
||
color: #fff;
|
||
border-radius: 50rpx;
|
||
text-align: center;
|
||
position: fixed;
|
||
bottom: 40rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
}
|
||
.formDialog{
|
||
:deep(.dialogContent){
|
||
width: 90%;
|
||
top: auto;
|
||
left: 50%;
|
||
bottom: 30rpx;
|
||
transform: translate(-50%, 0);
|
||
border-radius: 30rpx;
|
||
}
|
||
.dialog-title{
|
||
padding: 0 40rpx ;
|
||
font-weight: 600;
|
||
padding-top: 40rpx;
|
||
margin-bottom: 60rpx;
|
||
font-size: 36rpx;
|
||
}
|
||
.dialog-content{
|
||
padding: 0 40rpx;
|
||
padding-bottom: 40rpx;
|
||
.form_label{
|
||
color: #2A2B5B;
|
||
font-size: 30rpx;
|
||
// margin-bottom: 16rpx;
|
||
position: relative;
|
||
.add_btn{
|
||
display: flex;
|
||
align-items: center;
|
||
position: absolute;
|
||
right: 10rpx;
|
||
top: 0;
|
||
font-size: 28rpx;
|
||
color: #5181F6;
|
||
.uni-icons{
|
||
margin-right: 10rpx;
|
||
}
|
||
}
|
||
}
|
||
.file_list{
|
||
margin-top: 24rpx;
|
||
margin-bottom: 34rpx;
|
||
.file_item{
|
||
display: flex;
|
||
font-size: 24rpx;
|
||
color: rgba(42, 46, 63, 0.8);
|
||
margin-bottom: 20rpx;
|
||
uni-text{
|
||
line-height: 44rpx;
|
||
margin-right: 20rpx;
|
||
}
|
||
uni-image{
|
||
width: 44rpx;
|
||
height: 44rpx;
|
||
margin-right: 10rpx;
|
||
}
|
||
}
|
||
}
|
||
.form_item{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
uni-radio-group{
|
||
display: flex;
|
||
.uni-list-cell{
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 28rpx;
|
||
:deep(.uni-radio-input){
|
||
height: 28rpx;
|
||
width: 28rpx;
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
.dialog-btn{
|
||
width: 100%;
|
||
height: 94rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding-bottom: 60rpx;
|
||
.cancle-btn{
|
||
height: 100rpx;
|
||
width: 236rpx;
|
||
text-align: center;
|
||
line-height: 100rpx;
|
||
background: #fff;
|
||
color: rgba(#30305F, 0.6);
|
||
border-radius: 50rpx;
|
||
border: 1rpx solid rgba(#30305F,0.3);
|
||
margin-right: 112rpx;
|
||
}
|
||
.primary-btn{
|
||
height: 100rpx;
|
||
width: 236rpx;
|
||
text-align: center;
|
||
line-height: 100rpx;
|
||
border-radius: 50rpx;
|
||
color: #fff;
|
||
background: #5181F6;
|
||
}
|
||
}
|
||
}
|
||
.img_name{
|
||
display: block;
|
||
width: 200rpx;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
.no_data{
|
||
text-align: center;
|
||
color: rgba(0,0,0,0.5);
|
||
padding-top: 100rpx;
|
||
uni-image{
|
||
width: 328rpx;
|
||
height: 260rpx;
|
||
display: block;
|
||
margin: 0 auto;
|
||
margin-bottom: 40rpx;
|
||
}
|
||
}
|
||
</style>
|