<script setup>
|
import { ref ,onMounted } from 'vue';
|
import { searchBreakdownApi,editExamineApi } from '../../api/index.js'
|
import { BASE_URL } from '../../config/baseUrl.js';
|
|
const baseUrl = ref(BASE_URL)
|
const breakdownList = ref([])
|
async function searchBreakdown(){
|
await searchBreakdownApi({limit:10000,page:1}).then((res) =>{
|
if(res.code == 200){
|
breakdownList.value = []
|
breakdownList.value = res.data.list
|
breakdownList.value.forEach((item) =>{
|
item.imageList = item.url.split(',')
|
})
|
console.log('000',breakdownList.value)
|
}
|
})
|
}
|
async function handleBreakdown(item){
|
uni.showModal({
|
title:'提示',
|
content:'确定已处理完成该上报问题',
|
success:async(res) =>{
|
if(res.confirm){
|
await setBreakdown(item)
|
}
|
},
|
fail:() =>{}
|
})
|
}
|
async function setBreakdown(item){
|
let postParams = JSON.parse(JSON.stringify(item))
|
postParams.isSolve = 1
|
await editExamineApi(postParams).then(async(res) =>{
|
if(res.code == 200){
|
console.log(13,postParams)
|
await searchBreakdown()
|
}
|
})
|
}
|
//图片预览
|
function clickImg(imgList,imgItem){
|
console.log(333,imgList)
|
let imgUrl = baseUrl.value + '/upload' + imgItem
|
let imgUrlList = []
|
imgList.forEach((item) =>{
|
imgUrlList.push(baseUrl.value + '/upload' + item)
|
})
|
console.log(123,imgUrlList)
|
uni.previewImage({
|
urls:imgUrlList, //需要预览的图片http链接列表
|
current: imgUrl, // 当前显示图片的http链接，默认是第一个
|
indicator:'default',
|
loop:true,
|
success: function(res) {},
|
fail: function(res) {
|
console.log('error',res)
|
},
|
complete: function(res) {},
|
})
|
}
|
onMounted(async() =>{
|
await searchBreakdown()
|
})
|
</script>
|
<template>
|
<view class="container">
|
<navbar title = '上报记录'></navbar>
|
<view class="content">
|
<view class="main">
|
<view v-for="(item,index) in breakdownList" class="item">
|
<view class="item-child">
|
<text class="text">设备编号：</text>
|
<text class="value">{{item.facilityCode}}</text>
|
</view>
|
<view class="item-child">
|
<text class="text">故障类型：</text>
|
<text class="value">{{item.typeName}}</text>
|
</view>
|
<view class="item-child">
|
<text class="text">联系方式：</text>
|
<text class="value">{{item.userPhone}}</text>
|
</view>
|
<view class="item-child">
|
<text class="text">故障描述：</text>
|
<text class="value">{{item.describe}}</text>
|
</view>
|
<view class="item-child handle-item">
|
<view>
|
<text class="text">处理状态：</text>
|
<text class="value">{{item.isSolveView}}</text>
|
</view>
|
<view v-if ="item.isSolve == 0" class="handle-btn" @click="handleBreakdown(item)">核实处理</view>
|
<view v-else class="handle-status">已处理</view>
|
</view>
|
<view class="item-child-image">
|
<view class="text">故障图片：</view>
|
<view class="imgList">
|
<view class="child-img" v-for="(itemChild,index) in item.imageList" :key="index" @click="clickImg(item.imageList,itemChild)">
|
<image class="img" :src="baseUrl + '/upload' + itemChild" mode="aspectFit"></image>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</template>
|
<style lang="scss" scoped>
|
.container{
|
width:100%;
|
box-sizing: border-box;
|
.content{
|
height:calc(100vh - 176rpx);
|
background: linear-gradient(to bottom,#8BC1FC 0%,#D2F2FE 30%,#D2F2FE 100%);
|
padding:30rpx 20rpx 100rpx;
|
box-sizing: border-box;
|
.main{
|
width:100%;
|
height:100%;
|
background: #f3fbfe;
|
padding:20rpx;
|
box-sizing: border-box;
|
overflow: scroll;
|
.item{
|
width:100%;
|
height: 550rpx;
|
box-shadow: 0 0 3rpx 1rpx #bac1c8;
|
margin-top:30rpx;
|
display: flex;
|
flex-direction: column;
|
padding:10rpx 20rpx;
|
box-sizing: border-box;
|
.item-child{
|
margin-top:6rpx;
|
.text{
|
color: #616266;
|
margin-right:10rpx;
|
}
|
.value{
|
color: #5687c7;
|
}
|
}
|
.handle-item{
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
.handle-btn{
|
width:120rpx;
|
height:60rpx;
|
background: rgba(110, 151, 245, 0.8);
|
border-radius:15rpx;
|
text-align: center;
|
line-height:60rpx;
|
color: #fff;
|
font-size:28rpx;
|
}
|
.handle-status{
|
width:120rpx;
|
height:60rpx;
|
background: rgba(110, 151, 245, 0.4);
|
border-radius:15rpx;
|
text-align: center;
|
line-height:60rpx;
|
color: #fff;
|
font-size: 30rpx;
|
}
|
}
|
.item-child-image{
|
display: flex;
|
flex-direction: column;
|
.text{
|
color: #616266;
|
}
|
.imgList{
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
margin-top:20rpx;
|
.child-img{
|
width: 180rpx;
|
height:180rpx;
|
border-radius:20rpx;
|
border:1rpx dashed #b7d4ff;
|
margin-bottom: 10rpx;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
overflow: hidden;
|
.img{
|
width: 170rpx;
|
height:170rpx;
|
}
|
}
|
}
|
// }
|
}
|
}
|
}
|
}
|
}
|
|
</style>
|
