巡检增加主动上报页面
This commit is contained in:
xuli
@@ -5,15 +5,15 @@
|
|||||||
<view class="picker-item" @click="takePhoto">
|
<view class="picker-item" @click="takePhoto">
|
||||||
<text>拍照</text>
|
<text>拍照</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="picker-item" @click="choosePhoto">
|
<!-- <view class="picker-item" @click="choosePhoto">
|
||||||
<text>选择照片</text>
|
<text>选择照片</text>
|
||||||
</view>
|
</view> -->
|
||||||
<view class="picker-item" @click="takeVideo">
|
<view class="picker-item" @click="takeVideo">
|
||||||
<text>拍摄视频</text>
|
<text>拍摄视频</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="picker-item" @click="chooseVideoFromAlbum">
|
<!-- <view class="picker-item" @click="chooseVideoFromAlbum">
|
||||||
<text>选择视频</text>
|
<text>选择视频</text>
|
||||||
</view>
|
</view> -->
|
||||||
<view class="picker-item" @click="closePicker">
|
<view class="picker-item" @click="closePicker">
|
||||||
<text>取消</text>
|
<text>取消</text>
|
||||||
</view>
|
</view>
|
||||||
@@ -39,17 +39,17 @@ const takePhoto = () => {
|
|||||||
captureMedia("image", "camera");
|
captureMedia("image", "camera");
|
||||||
}
|
}
|
||||||
|
|
||||||
const choosePhoto = () => {
|
// const choosePhoto = () => {
|
||||||
captureMedia("image", "album");
|
// captureMedia("image", "album");
|
||||||
}
|
// }
|
||||||
|
|
||||||
const takeVideo = () => {
|
const takeVideo = () => {
|
||||||
captureMedia("video", "camera");
|
captureMedia("video", "camera");
|
||||||
}
|
}
|
||||||
|
|
||||||
const chooseVideoFromAlbum = () => {
|
// const chooseVideoFromAlbum = () => {
|
||||||
captureMedia("video", "album");
|
// captureMedia("video", "album");
|
||||||
}
|
// }
|
||||||
|
|
||||||
const captureMedia = async (type, source) => {
|
const captureMedia = async (type, source) => {
|
||||||
showPicker.value = false;
|
showPicker.value = false;
|
||||||
|
|||||||
@@ -663,6 +663,30 @@
|
|||||||
"navigationBarTitleText": ""
|
"navigationBarTitleText": ""
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/business/polling/problemInitiativeList",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/business/polling/problemInitiative",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/business/polling/problemInitiativeDetail",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/business/polling/problemInitiativeLog",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"path": "pages/business/polling/nfcTest/index",
|
"path": "pages/business/polling/nfcTest/index",
|
||||||
"style": {
|
"style": {
|
||||||
|
|||||||
@@ -400,7 +400,7 @@ const chooseImage = (item,index) => {
|
|||||||
uni.chooseImage({
|
uni.chooseImage({
|
||||||
// count: 1, // 默认是9，这里设置为1次只选1张
|
// count: 1, // 默认是9，这里设置为1次只选1张
|
||||||
// sizeType: ['compressed'], // 可以指定是原图还是压缩图，可选 'original' 或 'compressed'
|
// sizeType: ['compressed'], // 可以指定是原图还是压缩图，可选 'original' 或 'compressed'
|
||||||
sourceType: ['album', 'camera'], // 指定来源是相册还是相机，默认二者都有
|
sourceType: ['camera'], // 指定来源是相册还是相机，默认二者都有//'album',
|
||||||
// quality:80,
|
// quality:80,
|
||||||
// width:'1920px',
|
// width:'1920px',
|
||||||
// height:'1920px',
|
// height:'1920px',
|
||||||
@@ -455,7 +455,7 @@ const chooseImage = (item,index) => {
|
|||||||
// 视频处理
|
// 视频处理
|
||||||
const chooseVideo = (item,index) => {
|
const chooseVideo = (item,index) => {
|
||||||
uni.chooseVideo({
|
uni.chooseVideo({
|
||||||
sourceType: ['album', 'camera'], // 来源：相册和相机
|
sourceType: ['camera'], // 来源：相册和相机//'album',
|
||||||
maxDuration: 60, // 最大时长（秒）
|
maxDuration: 60, // 最大时长（秒）
|
||||||
camera: 'back', // 使用后置摄像头
|
camera: 'back', // 使用后置摄像头
|
||||||
compressed: true, // 压缩视频
|
compressed: true, // 压缩视频
|
||||||
|
|||||||
584
src/pages/business/polling/problemInitiative.vue
Normal file
584
src/pages/business/polling/problemInitiative.vue
Normal file
@@ -0,0 +1,584 @@
|
|||||||
|
<template>
|
||||||
|
<view class="con-body">
|
||||||
|
<view class="con-bg">
|
||||||
|
<!-- 头部 -->
|
||||||
|
<customHeader ref="customHeaderRef" title="新增问题上报"
|
||||||
|
:leftFlag="true" :rightFlag="false"
|
||||||
|
></customHeader>
|
||||||
|
<!-- 高度来避免头部遮挡 -->
|
||||||
|
<view class="top-height"></view>
|
||||||
|
|
||||||
|
<!-- 下拉刷新 -->
|
||||||
|
<mescroll-uni ref="mescrollRef" @init="mescrollInit"
|
||||||
|
:down="downOption" @down="downCallback"
|
||||||
|
:fixed="false" class="scroll-h"
|
||||||
|
>
|
||||||
|
<view class="white-bg">
|
||||||
|
<view class="red-title">
|
||||||
|
问题名称
|
||||||
|
<view class="report-list">
|
||||||
|
<input class="r-input uni-input" v-model="optionObj.problemName" placeholder="请输入问题" placeholder-class="place-input" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="report-border"></view>
|
||||||
|
<view class="report-list">
|
||||||
|
<view class="report-pro">提交人</view>
|
||||||
|
<view class="report-right">{{optionObj.createUserName?optionObj.createUserName:realname}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="report-border"></view>
|
||||||
|
<view class="report-list" style="display:block;">
|
||||||
|
问题描述
|
||||||
|
<textarea class="r-input textarea" v-model="optionObj.problemDesc" auto-height
|
||||||
|
placeholder="请输入问题项描述" placeholder-class="place-input"
|
||||||
|
></textarea>
|
||||||
|
</view>
|
||||||
|
<view class="report-border"></view>
|
||||||
|
<view class="report-list" style="display:block;">
|
||||||
|
<view class="r-title">问题点位照片或视频 <text>*</text></view>
|
||||||
|
<view class="img-flex">
|
||||||
|
<view class="img-show" v-for="(item2,index2) in imgArr" :key="index2" @click="showMediaPreview(item2)">
|
||||||
|
<view class="img-delete" @click.stop="handleDelete(imgArr,index2)">
|
||||||
|
<uni-icons type="closeempty" size="16" color="#fff"></uni-icons>
|
||||||
|
</view>
|
||||||
|
<!-- <img :src="item2.shortUrl" /> -->
|
||||||
|
<image :src="item2.shortUrl" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view class="img-show" v-for="(item2,index2) in videoArr" :key="index2" @click="showMediaPreview(item2)">
|
||||||
|
<view class="img-delete" @click.stop="handleDelete(videoArr,index2)">
|
||||||
|
<uni-icons type="closeempty" size="16" color="#fff"></uni-icons>
|
||||||
|
</view>
|
||||||
|
<view class="img-icon">
|
||||||
|
<img :src="'static/images/polling/icon-play.png'" />
|
||||||
|
</view>
|
||||||
|
<!-- <video :src="item.url" controls></video> -->
|
||||||
|
<DomVideoPlayer :src="item2.url" objectFit="cover" />
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- loading -->
|
||||||
|
<view class="img-con" v-if="imgLoading">
|
||||||
|
<view class="upload-loading">
|
||||||
|
<uni-icons type="refreshempty" size="30" color="#C9C9C9"></uni-icons>
|
||||||
|
<view>上传中....</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-con" @click="chooseMedia" v-else>
|
||||||
|
<img :src="'static/images/polling/icon-AddPorV.png'" class="img-pic" />
|
||||||
|
</view>
|
||||||
|
<!-- #ifdef APP-PLUS -->
|
||||||
|
<!-- #endif -->
|
||||||
|
<!-- #ifndef APP-PLUS -->
|
||||||
|
<!-- <view class="img-con">
|
||||||
|
<img :src="'static/images/polling/icon-AddPorV.png'" class="img-pic" />
|
||||||
|
</view> -->
|
||||||
|
<!-- #endif -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="btn-submit">
|
||||||
|
<button type="primary" @click="handleSubmit">提交</button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</mescroll-uni>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 图片放大 -->
|
||||||
|
<mediaPreview :visible="isVisible" :url="mediaUrl" @close="handlePreviewClose"></mediaPreview>
|
||||||
|
|
||||||
|
<!-- 选择图片或者视频 -->
|
||||||
|
<chooseMediaVue ref="chooseMediaRef" @getMediaArr="getMediaArr" @closeMedia="closeMedia"></chooseMediaVue>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref,onMounted,onUnmounted,nextTick,computed,reactive, watch,getCurrentInstance } from 'vue'
|
||||||
|
import { onLoad,onShow,onHide} from '@dcloudio/uni-app';
|
||||||
|
import customHeader from '@/components/customHeader.vue';
|
||||||
|
import MescrollUni from 'mescroll-uni/mescroll-uni.vue';
|
||||||
|
import chooseMediaVue from '@/components/chooseMedia.vue'
|
||||||
|
import mediaPreview from "@/components/mediaPreview.vue"
|
||||||
|
import DomVideoPlayer from 'uniapp-video-player'
|
||||||
|
import { getUserInfo } from '@/api/auth.js'
|
||||||
|
import { problemDetail,problemAdd,problemEdit,minioUpload } from '@/api/polling.js'
|
||||||
|
import {compressImageUni,getFileType} from '@/utils/common.js'
|
||||||
|
import {showAlert,showLoading,hideLoading} from '@/utils/message.js'
|
||||||
|
import { MINIO_KEY } from '@/enums/cacheEnums';
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
|
||||||
|
let taskId = ref('');//任务id
|
||||||
|
let groupId = ref('');//组id
|
||||||
|
let problemId = ref('');//问题id
|
||||||
|
let realname = ref('');
|
||||||
|
let desc = ref('');//描述
|
||||||
|
let minioObj = {};
|
||||||
|
onLoad(async option => {
|
||||||
|
// console.log(option)
|
||||||
|
taskId.value = option.taskId;
|
||||||
|
groupId.value = option.groupId;
|
||||||
|
problemId.value = option.problemId;
|
||||||
|
|
||||||
|
minioObj = JSON.parse(uni.getStorageSync(MINIO_KEY) || "\{\}")
|
||||||
|
|
||||||
|
let userinfo = await getUserInfo({});
|
||||||
|
realname.value = userinfo.realname;
|
||||||
|
getList();
|
||||||
|
})
|
||||||
|
|
||||||
|
onShow(()=>{
|
||||||
|
imgLoading.value=false;
|
||||||
|
})
|
||||||
|
|
||||||
|
// 查询列表
|
||||||
|
let list = ref([]);
|
||||||
|
let optionObj = ref({})
|
||||||
|
|
||||||
|
// 下拉刷新
|
||||||
|
const mescrollRef = ref(null);
|
||||||
|
const mescrollInit = (mescroll) => {
|
||||||
|
mescrollRef.value = mescroll;
|
||||||
|
};
|
||||||
|
const downOption = ref({
|
||||||
|
use:false,
|
||||||
|
auto: true,
|
||||||
|
textInOffset: '下拉刷新',
|
||||||
|
textOutOffset: '释放更新',
|
||||||
|
textLoading: '刷新中...'
|
||||||
|
});
|
||||||
|
// 下拉刷新
|
||||||
|
const downCallback = async (mescroll) => {
|
||||||
|
try {
|
||||||
|
getList();
|
||||||
|
} catch (error) {
|
||||||
|
mescroll.endErr();
|
||||||
|
} finally {
|
||||||
|
mescroll.endSuccess();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取数据列表
|
||||||
|
const getList = async () => {
|
||||||
|
let param = {
|
||||||
|
taskId:problemId.value?undefined:taskId.value,
|
||||||
|
groupId:problemId.value?undefined:groupId.value,
|
||||||
|
problemId:problemId.value
|
||||||
|
}
|
||||||
|
let res = await problemDetail(param);
|
||||||
|
let data = res||{};
|
||||||
|
|
||||||
|
let pointIds = data.pointId?.split(",") || [];
|
||||||
|
data.pointList.forEach(item2=>{
|
||||||
|
item2.active=false;
|
||||||
|
for (let i = 0; i < pointIds.length; i++) {
|
||||||
|
if(item2.pointId == pointIds[i]){
|
||||||
|
item2.active=true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
// 视频回显
|
||||||
|
imgArr.value = [];
|
||||||
|
mediaArr.value=[];
|
||||||
|
videoArr.value=[];
|
||||||
|
let fileList =data.problemVedio?.split(",") || [];
|
||||||
|
fileList.forEach(item=>{
|
||||||
|
mediaArr.value.push(item)
|
||||||
|
if(getFileType(item)=='image'){
|
||||||
|
imgArr.value.push({
|
||||||
|
shortUrl:minioObj.minioThumbUrl +"/"+item,
|
||||||
|
url:minioObj.minioUrl +"/"+item,
|
||||||
|
name:item
|
||||||
|
})
|
||||||
|
}else if(getFileType(item)=='video'){
|
||||||
|
videoArr.value.push({
|
||||||
|
shortUrl:minioObj.minioThumbUrl +"/"+item,
|
||||||
|
url:minioObj.minioUrl +"/"+item,
|
||||||
|
name:item
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
optionObj.value = data;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 图片或视频
|
||||||
|
let mediaArr = ref([]);//传给后台的地址
|
||||||
|
let imgArr=ref([]);//图片 后台返回的
|
||||||
|
let videoArr = ref([]);//视频 后台返回的
|
||||||
|
let imgLoading = ref(false)
|
||||||
|
const chooseMedia = () => {
|
||||||
|
// console.log("chooseMedia=>")
|
||||||
|
proxy.$refs["chooseMediaRef"].openPicker();
|
||||||
|
imgLoading.value=true;
|
||||||
|
// uni.chooseMedia({
|
||||||
|
// count: 9,
|
||||||
|
// mediaType: ['image', 'video'], // 指定可选择图片和视频
|
||||||
|
// sourceType: ['album', 'camera'],
|
||||||
|
// maxDuration: 60, // 拍摄视频最长拍摄时间
|
||||||
|
// camera: 'back',
|
||||||
|
// success: (res) => {
|
||||||
|
// // console.log("chooseMedia=>",res)
|
||||||
|
// res.tempFiles.forEach(async file => {
|
||||||
|
// // console.log(`文件类型: ${file.fileType}, 文件路径: ${file.tempFilePath}`);
|
||||||
|
// let compressImg = file.tempFilePath;
|
||||||
|
// // 图片进行压缩
|
||||||
|
// if (file.fileType === 'image') {
|
||||||
|
// // #ifdef APP-PLUS
|
||||||
|
// // 压缩图片
|
||||||
|
// compressImg = await compressImageUni(file.tempFilePath);
|
||||||
|
// // #endif
|
||||||
|
// }
|
||||||
|
|
||||||
|
// // 执行上传
|
||||||
|
// let param = {
|
||||||
|
// filePath: compressImg,
|
||||||
|
// name: 'file',
|
||||||
|
// formData: {
|
||||||
|
// directory:'polling'
|
||||||
|
// },
|
||||||
|
// }
|
||||||
|
// imgLoading.value=true;
|
||||||
|
// minioUpload(param).then(res=>{
|
||||||
|
// let data = res.data;//console.log("上传成功后=>",res)
|
||||||
|
// mediaArr.value.push(data.fileName);
|
||||||
|
// if (file.fileType === 'image') {// 图片
|
||||||
|
// imgArr.value.push({
|
||||||
|
// shortUrl:minioObj.minioThumbUrl +"/"+data.fileName,
|
||||||
|
// url:minioObj.minioUrl +"/"+data.fileName,
|
||||||
|
// name:data.fileName
|
||||||
|
// })
|
||||||
|
// } else if (file.fileType === 'video') {// 视频
|
||||||
|
// videoArr.value.push({
|
||||||
|
// shortUrl:minioObj.minioThumbUrl +"/"+data.fileName,
|
||||||
|
// url:minioObj.minioUrl +"/"+data.fileName,
|
||||||
|
// name:data.fileName
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
// }).finally(()=>{
|
||||||
|
// imgLoading.value=false;
|
||||||
|
// })
|
||||||
|
|
||||||
|
// });
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
}
|
||||||
|
const closeMedia = ()=>{
|
||||||
|
imgLoading.value=false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 插件回调
|
||||||
|
const getMediaArr=(arr)=>{
|
||||||
|
// console.log("插件回调=>",arr)
|
||||||
|
try {
|
||||||
|
arr.forEach(data=>{
|
||||||
|
mediaArr.value.push(data.fileName);
|
||||||
|
if(data.fileType=="image"){
|
||||||
|
imgArr.value.push({
|
||||||
|
shortUrl:minioObj.minioThumbUrl +"/"+data.fileName,
|
||||||
|
url:minioObj.minioUrl +"/"+data.fileName,
|
||||||
|
name:data.fileName
|
||||||
|
})
|
||||||
|
}else if(data.fileType == "video"){
|
||||||
|
videoArr.value.push({
|
||||||
|
shortUrl:minioObj.minioThumbUrl +"/"+data.fileName,
|
||||||
|
url:minioObj.minioUrl +"/"+data.fileName,
|
||||||
|
name:data.fileName
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// console.log(imgArr.value,videoArr.value)
|
||||||
|
imgLoading.value=false;
|
||||||
|
} catch (error) {
|
||||||
|
console.error(error)
|
||||||
|
imgLoading.value=false;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// 视频或图片删除 根据数组下标删除数组里的某个图片或视频
|
||||||
|
const handleDelete=(arr,index2)=>{
|
||||||
|
let item = arr[index2];
|
||||||
|
arr.splice(index2, 1);
|
||||||
|
mediaArr.value = mediaArr.value.filter(item2=>item2!=item.name);
|
||||||
|
console.log("删除后=>",mediaArr.value)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 放大视频或图片
|
||||||
|
let isVisible= ref(false);//放大处理
|
||||||
|
let mediaUrl= ref('');//放大地址
|
||||||
|
let videoShow = ref(true);
|
||||||
|
const showMediaPreview=(item)=>{
|
||||||
|
// console.log("调用放大视频==>",item)
|
||||||
|
isVisible.value = true;
|
||||||
|
videoShow.value = false;
|
||||||
|
mediaUrl.value = item.url
|
||||||
|
}
|
||||||
|
const handlePreviewClose=()=>{
|
||||||
|
isVisible.value = false;
|
||||||
|
videoShow.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 红点点击
|
||||||
|
const handleRound=(item)=>{
|
||||||
|
item.active=!item.active
|
||||||
|
}
|
||||||
|
|
||||||
|
// 提交
|
||||||
|
const handleSubmit=()=>{
|
||||||
|
let pointIds = [];
|
||||||
|
optionObj.value.pointList.forEach(item => {
|
||||||
|
if(item.active){
|
||||||
|
pointIds.push(item.pointId)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
showLoading("加载中...")
|
||||||
|
if(problemId.value){
|
||||||
|
let param = {
|
||||||
|
problemId:problemId.value,
|
||||||
|
pointId:pointIds.join(","),
|
||||||
|
problemVedio:mediaArr.value.join(","),
|
||||||
|
problemDesc:optionObj.value.problemDesc
|
||||||
|
}
|
||||||
|
// console.log("problemEdit=>",param)
|
||||||
|
problemEdit(param).then(res=>{
|
||||||
|
// showAlert = (content, title = '提示',showCancel=false,succFun)
|
||||||
|
showAlert("修改问题上报成功！","提示",false,()=>{
|
||||||
|
uni.navigateBack()
|
||||||
|
})
|
||||||
|
}).finally(()=>{
|
||||||
|
hideLoading();
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
let param = {
|
||||||
|
taskId:taskId.value,
|
||||||
|
groupId:groupId.value,
|
||||||
|
pointId:pointIds.join(","),
|
||||||
|
problemVedio:mediaArr.value.join(","),
|
||||||
|
problemDesc:optionObj.value.problemDesc
|
||||||
|
}
|
||||||
|
// console.log("problemAdd=>",param)
|
||||||
|
problemAdd(param).then(res=>{
|
||||||
|
showAlert("新建问题上报成功！","提示",false,()=>{
|
||||||
|
problemId.value = res;
|
||||||
|
uni.navigateBack()
|
||||||
|
})
|
||||||
|
}).finally(()=>{
|
||||||
|
hideLoading();
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.scroll-h{
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
height:calc(100vh - 78px) !important;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifndef APP-PLUS */
|
||||||
|
height: calc(100vh - 58px) !important;
|
||||||
|
/* #endif */
|
||||||
|
}
|
||||||
|
:deep(.mescroll-upwarp){
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
.white-bg{
|
||||||
|
width: 680rpx;
|
||||||
|
padding: 15rpx 30rpx 40rpx 40rpx;
|
||||||
|
margin-bottom: 0;
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.white-bg .red-title{
|
||||||
|
margin-bottom:30rpx;
|
||||||
|
color:#FF2B44;
|
||||||
|
font-size:38rpx;
|
||||||
|
}
|
||||||
|
.white-bg .red-title .uni-input{
|
||||||
|
color:#333;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-border{
|
||||||
|
border-bottom:1px solid #E7E7E7;
|
||||||
|
width:710rpx;
|
||||||
|
height: 1px;
|
||||||
|
margin:30rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list{
|
||||||
|
display: flex;
|
||||||
|
font-size:28rpx;
|
||||||
|
}
|
||||||
|
.report-list .r-title{
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.report-list text{
|
||||||
|
color:#FF2B44;
|
||||||
|
font-size:28rpx;
|
||||||
|
}
|
||||||
|
.report-list .report-pro{
|
||||||
|
font-size:28rpx;
|
||||||
|
width:16%;
|
||||||
|
/* margin-right:30rpx; */
|
||||||
|
}
|
||||||
|
.report-list .report-right{
|
||||||
|
width:84%;
|
||||||
|
color:#919191;
|
||||||
|
font-size:28rpx;
|
||||||
|
}
|
||||||
|
.report-list .r-input{
|
||||||
|
border:1px solid #E7E7E7;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
width:620rpx;
|
||||||
|
padding:15rpx 25rpx;
|
||||||
|
margin:20rpx 0 0rpx;
|
||||||
|
}
|
||||||
|
.report-list .place-input{
|
||||||
|
color:#BFBFBF;
|
||||||
|
font-size:28rpx;
|
||||||
|
}
|
||||||
|
.report-list .textarea{
|
||||||
|
min-height: 120rpx;
|
||||||
|
}
|
||||||
|
.report-list .r-list{
|
||||||
|
padding: 10rpx 0;
|
||||||
|
}
|
||||||
|
.report-list .r-list:first-child{
|
||||||
|
padding-top:0;
|
||||||
|
}
|
||||||
|
.report-list .r-left{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
width:90%;
|
||||||
|
font-size:28rpx;
|
||||||
|
color:#919191;
|
||||||
|
}
|
||||||
|
.report-list .r-left view:first-child{
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
.report-list .r-left.r-red{
|
||||||
|
color: #FF2B44;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list .r-right{
|
||||||
|
display: flex;
|
||||||
|
font-size:30rpx;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.report-list .r-r-round{
|
||||||
|
width:35rpx;
|
||||||
|
height:35rpx;
|
||||||
|
border:1px solid #BDBDBD;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
.report-list .r-r-round.active{
|
||||||
|
border:1px solid #FF2B44;
|
||||||
|
background-color: #FF2B44;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.report-list .r-r-round.active::after{
|
||||||
|
content:"!";
|
||||||
|
position: absolute;
|
||||||
|
top:0;
|
||||||
|
left:0;
|
||||||
|
color:#fff;
|
||||||
|
text-align: center;
|
||||||
|
width:35rpx;
|
||||||
|
height:35rpx;
|
||||||
|
/* #ifndef APP-PLUS */
|
||||||
|
line-height: 30rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
height:33rpx;
|
||||||
|
padding-top:2rpx;
|
||||||
|
/* #endif */
|
||||||
|
}
|
||||||
|
.report-list .img-flex{
|
||||||
|
display: flex;
|
||||||
|
flex-flow:row wrap;
|
||||||
|
margin-bottom:30rpx;
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
.report-list .img-show img,
|
||||||
|
.report-list .img-show image,
|
||||||
|
.report-list .img-show video,
|
||||||
|
.report-list .img-show .player-wrapper{
|
||||||
|
width:210rpx;
|
||||||
|
height: 140rpx;
|
||||||
|
}
|
||||||
|
.report-list .img-show :deep(.uni-video-cover-play-button){
|
||||||
|
width:64rpx;
|
||||||
|
height: 64rpx;
|
||||||
|
line-height: 64rpx;
|
||||||
|
font-size:60rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list .img-con{
|
||||||
|
background-color: #EEEEEE;
|
||||||
|
width:210rpx;
|
||||||
|
height: 140rpx;
|
||||||
|
text-align: center;
|
||||||
|
color:#919191;
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
.report-list .img-con .img-pic{
|
||||||
|
width:76rpx;
|
||||||
|
height: 76rpx;
|
||||||
|
margin-top:30rpx;
|
||||||
|
}
|
||||||
|
.report-list .img-show,
|
||||||
|
.report-list .img-con{
|
||||||
|
width: calc(100% / 3 - 10px); /* 减去一些间隙以避免溢出 */
|
||||||
|
margin:20rpx 20rpx 0 0;
|
||||||
|
}
|
||||||
|
.report-list .img-show{
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.report-list .img-show .img-delete{
|
||||||
|
position: absolute;
|
||||||
|
/* #ifndef APP-PLUS */
|
||||||
|
right:4rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
right:4rpx;
|
||||||
|
/* #endif */
|
||||||
|
top:8rpx;
|
||||||
|
width:34rpx;
|
||||||
|
height:34rpx;
|
||||||
|
line-height:34rpx;
|
||||||
|
border-radius:3rpx;
|
||||||
|
background-color: rgba(0, 0, 0, 0.6);
|
||||||
|
text-align: center;
|
||||||
|
z-index:1;
|
||||||
|
}
|
||||||
|
.report-list .img-show .img-icon{
|
||||||
|
position: absolute;
|
||||||
|
top:50%;
|
||||||
|
left: 50%;
|
||||||
|
width: 64rpx;
|
||||||
|
height:64rpx;
|
||||||
|
margin-left:-32rpx;
|
||||||
|
margin-top:-32rpx;
|
||||||
|
z-index:1;
|
||||||
|
}
|
||||||
|
.report-list .img-show .img-icon img{
|
||||||
|
width: 64rpx;
|
||||||
|
height:64rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.btn-submit{
|
||||||
|
width:400rpx;
|
||||||
|
margin:90rpx auto;
|
||||||
|
}
|
||||||
|
.btn-submit uni-button[type='primary']{
|
||||||
|
background-color: #05A3F4;
|
||||||
|
border-radius: 40rpx;
|
||||||
|
line-height: 2.2;
|
||||||
|
}
|
||||||
|
.btn-submit uni-button:after{
|
||||||
|
border-color:#05A3F4;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
402
src/pages/business/polling/problemInitiativeDetail.vue
Normal file
402
src/pages/business/polling/problemInitiativeDetail.vue
Normal file
@@ -0,0 +1,402 @@
|
|||||||
|
<template>
|
||||||
|
<view class="con-body">
|
||||||
|
<view class="con-bg">
|
||||||
|
<!-- 头部 -->
|
||||||
|
<customHeader ref="customHeaderRef" title="问题上报"
|
||||||
|
:leftFlag="true" :rightFlag="true"
|
||||||
|
>
|
||||||
|
<template #right>
|
||||||
|
<view class="head-right" @click="handleQuestion" v-if="problemObj.problemStatus==1">
|
||||||
|
<view class="btn-yellow">
|
||||||
|
<uni-icons type="plus" size="20" color="#4C2D11"></uni-icons> 新增跟踪信息
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</customHeader>
|
||||||
|
<!-- 高度来避免头部遮挡 -->
|
||||||
|
<view class="top-height"></view>
|
||||||
|
|
||||||
|
<!-- 下拉刷新 -->
|
||||||
|
<mescroll-uni ref="mescrollRef" @init="mescrollInit"
|
||||||
|
:down="downOption" @down="downCallback"
|
||||||
|
:fixed="false" class="scroll-h"
|
||||||
|
>
|
||||||
|
<view class="white-bg">
|
||||||
|
<view class="red-title">问题：{{problemObj.groupName}}</view>
|
||||||
|
<view class="report-border"></view>
|
||||||
|
<view class="report-list">
|
||||||
|
<view style="width:45%;display:flex;">
|
||||||
|
<view class="report-pro report-w" style="margin-right:20rpx;">提交人</view>
|
||||||
|
<view class="report-right report-w">{{problemObj.createUserName}}</view>
|
||||||
|
</view>
|
||||||
|
<view style="width:55%;display:flex;">
|
||||||
|
<view class="report-pro report-w" style="margin-right:20rpx;">提交时间</view>
|
||||||
|
<view class="report-right report-w">{{parseTime(problemObj.createTime,'{y}-{m}-{d} {h}:{i}')}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="report-border"></view>
|
||||||
|
<view class="report-list">问题描述</view>
|
||||||
|
<view class="report-list report-gray">{{problemObj.problemDesc}}</view>
|
||||||
|
<view class="report-border"></view>
|
||||||
|
<view class="report-list">问题点位照片或视频</view>
|
||||||
|
<view class="report-list">
|
||||||
|
<view class="img-flex">
|
||||||
|
<block v-for="(item2,index2) in problemObj.listFile" :key="index2">
|
||||||
|
<view class="img-show" v-if="getFileType(item2)=='image'" @click="showMediaPreview(item2)">
|
||||||
|
<image :src="minioObj.minioThumbUrl+'/'+item2" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view class="img-show" v-else-if="getFileType(item2)=='video'" @click="showMediaPreview(item2)">
|
||||||
|
<view class="img-icon">
|
||||||
|
<img :src="'static/images/polling/icon-play.png'" />
|
||||||
|
</view>
|
||||||
|
<!-- <video :src="minioObj.minioUrl+'/'+item" controls v-show="videoShow"></video> -->
|
||||||
|
<DomVideoPlayer :src="minioObj.minioUrl+'/'+item2" objectFit="cover" v-show="videoShow" />
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 当天提的 增加按钮 修改和删除 -->
|
||||||
|
<view class="btn-con" v-if="isToday && problemObj.problemStatus==1">
|
||||||
|
<button type="primary" @click="handleUpdate" size="mini" style="margin-right:50rpx;" class="btn-primary">修改</button>
|
||||||
|
<button type="primary" @click="handleDelete" size="mini">删除</button>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 追踪列表 -->
|
||||||
|
<block v-if="problemObj.logList">
|
||||||
|
<block v-if="problemObj.logList.length>0">
|
||||||
|
<view class="bg-border"></view>
|
||||||
|
<view v-for="(item,index) in problemObj.logList" :key="index" class="log-con">
|
||||||
|
<view class="blue-title">
|
||||||
|
{{parseTime(item.createTime,'{y}-{m}-{d} {h}:{i}')}}
|
||||||
|
<text style="margin-left:20rpx;">巡检人：{{item.modifyUserName}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="report-list">检查点跟踪情况描述</view>
|
||||||
|
<view class="report-list report-gray">{{item.logDesc}}</view>
|
||||||
|
<view class="report-border"></view>
|
||||||
|
<view class="report-list">检查点位照片或视频</view>
|
||||||
|
<view class="report-list">
|
||||||
|
<view class="img-flex">
|
||||||
|
<block v-for="(item2,index2) in item.listFile" :key="index2">
|
||||||
|
<view class="img-show" v-if="getFileType(item2)=='image'" @click="showMediaPreview(item2)">
|
||||||
|
<image :src="minioObj.minioThumbUrl+'/'+item2" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view class="img-show" v-else-if="getFileType(item2)=='video'" @click="showMediaPreview(item2)">
|
||||||
|
<view class="img-icon">
|
||||||
|
<img :src="'static/images/polling/icon-play.png'" />
|
||||||
|
</view>
|
||||||
|
<!-- <video :src="minioObj.minioUrl+'/'+item" controls v-show="videoShow"></video> -->
|
||||||
|
<DomVideoPlayer :src="minioObj.minioUrl+'/'+item2" objectFit="cover" v-show="videoShow" />
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</mescroll-uni>
|
||||||
|
</view>
|
||||||
|
<!-- 图片放大 -->
|
||||||
|
<mediaPreview :visible="isVisible" :url="mediaUrl" @close="handlePreviewClose"></mediaPreview>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref,onMounted,onUnmounted,nextTick,computed,reactive } from 'vue'
|
||||||
|
import { onLoad,onShow,onHide} from '@dcloudio/uni-app';
|
||||||
|
import customHeader from '@/components/customHeader.vue';
|
||||||
|
import MescrollUni from 'mescroll-uni/mescroll-uni.vue';
|
||||||
|
import mediaPreview from "@/components/mediaPreview.vue"
|
||||||
|
import DomVideoPlayer from 'uniapp-video-player'
|
||||||
|
import { parseTime } from '@/utils/datetime.js';
|
||||||
|
import {getFileType} from '@/utils/common.js';
|
||||||
|
import { problemDetail,problemDel } from '@/api/polling.js'
|
||||||
|
import { MINIO_KEY } from '@/enums/cacheEnums';
|
||||||
|
import {showAlert,showLoading,hideLoading} from '@/utils/message.js'
|
||||||
|
|
||||||
|
let problemId=ref('');
|
||||||
|
let problemObj = ref({});
|
||||||
|
let isToday = ref(false);
|
||||||
|
let minioObj = {};
|
||||||
|
onLoad(option => {
|
||||||
|
// console.log(option)
|
||||||
|
problemId.value = option.problemId;
|
||||||
|
minioObj = JSON.parse(uni.getStorageSync(MINIO_KEY) || "\{\}")
|
||||||
|
})
|
||||||
|
|
||||||
|
onShow(()=>{
|
||||||
|
getList();
|
||||||
|
})
|
||||||
|
|
||||||
|
// 下拉刷新
|
||||||
|
const mescrollRef = ref(null);
|
||||||
|
const mescrollInit = (mescroll) => {
|
||||||
|
mescrollRef.value = mescroll;
|
||||||
|
};
|
||||||
|
const downOption = ref({
|
||||||
|
auto: false,
|
||||||
|
textInOffset: '下拉刷新',
|
||||||
|
textOutOffset: '释放更新',
|
||||||
|
textLoading: '刷新中...'
|
||||||
|
});
|
||||||
|
// 下拉刷新
|
||||||
|
const downCallback = async (mescroll) => {
|
||||||
|
try {
|
||||||
|
getList();
|
||||||
|
} catch (error) {
|
||||||
|
mescroll.endErr();
|
||||||
|
} finally {
|
||||||
|
mescroll.endSuccess();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 获取数据列表
|
||||||
|
const getList = async() => {
|
||||||
|
isToday.value = false;
|
||||||
|
let data = await problemDetail({problemId:problemId.value});
|
||||||
|
data.list = data.pointName?.split(",") || [];
|
||||||
|
data.listFile=data.problemVedio?.split(",") || [];
|
||||||
|
data.logList.forEach(item => {
|
||||||
|
item.listFile = item.logVedio?.split(",")||[]
|
||||||
|
});
|
||||||
|
// 判断是否当天创建的，显示按钮
|
||||||
|
let createTime = parseTime(data.createTime,'{y}-{m}-{d}');
|
||||||
|
let dateNow = parseTime(new Date().getTime(),'{y}-{m}-{d}');
|
||||||
|
if(createTime == dateNow){
|
||||||
|
isToday.value = true;
|
||||||
|
}
|
||||||
|
problemObj.value = data;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 放大视频或图片
|
||||||
|
let isVisible= ref(false);//放大处理
|
||||||
|
let mediaUrl= ref('');//放大地址
|
||||||
|
let videoShow = ref(true);
|
||||||
|
const showMediaPreview=(url)=>{
|
||||||
|
url = minioObj.minioUrl+'/'+url;
|
||||||
|
isVisible.value = true;
|
||||||
|
videoShow.value = false;
|
||||||
|
mediaUrl.value = url;
|
||||||
|
}
|
||||||
|
const handlePreviewClose=()=>{
|
||||||
|
isVisible.value = false;
|
||||||
|
videoShow.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 跳转问题上报页面
|
||||||
|
const handleQuestion=()=>{
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/business/polling/problemInitiativeLog?problemId='+problemId.value
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 修改
|
||||||
|
const handleUpdate=()=>{
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/business/polling/problemInitiative?problemId='+problemId.value
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除
|
||||||
|
const handleDelete=()=>{
|
||||||
|
showLoading("加载中...")
|
||||||
|
problemDel({problemId:problemId.value}).then(res=>{
|
||||||
|
// content, title = '提示',showCancel=false,succFun
|
||||||
|
showAlert("删除成功！",'提示',false,()=>{
|
||||||
|
uni.navigateBack()
|
||||||
|
})
|
||||||
|
}).finally(()=>{
|
||||||
|
hideLoading();
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.scroll-h{
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
height:calc(100vh - 78px) !important;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifndef APP-PLUS */
|
||||||
|
height: calc(100vh - 58px) !important;
|
||||||
|
/* #endif */
|
||||||
|
}
|
||||||
|
:deep(.mescroll-upwarp){
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
.head-right{}
|
||||||
|
.head-right .btn-yellow{
|
||||||
|
background-color: #FCC123;
|
||||||
|
color: #4C2D11;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
padding:10rpx 25rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.head-right .btn-yellow .img-repair{
|
||||||
|
width: 30rpx;
|
||||||
|
height: 30rpx;
|
||||||
|
}
|
||||||
|
.white-bg{
|
||||||
|
width: 680rpx;
|
||||||
|
padding: 15rpx 30rpx 50rpx 40rpx;
|
||||||
|
margin-bottom: 0;
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.white-bg .red-title{
|
||||||
|
margin-bottom:30rpx;
|
||||||
|
color:#FF2B44;
|
||||||
|
font-size:38rpx;
|
||||||
|
}
|
||||||
|
.report-border{
|
||||||
|
border-bottom:1px solid #E7E7E7;
|
||||||
|
width:710rpx;
|
||||||
|
height: 1px;
|
||||||
|
margin:30rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list{
|
||||||
|
display: flex;
|
||||||
|
font-size:28rpx;
|
||||||
|
}
|
||||||
|
.report-list.report-gray{
|
||||||
|
color:#919191;
|
||||||
|
padding:20rpx 0 0;
|
||||||
|
}
|
||||||
|
.report-list .r-title{
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.report-list text{
|
||||||
|
color:#FF2B44;
|
||||||
|
font-size:28rpx;
|
||||||
|
}
|
||||||
|
.report-list .report-pro{
|
||||||
|
font-size:28rpx;
|
||||||
|
width:16%;
|
||||||
|
/* margin-right:30rpx; */
|
||||||
|
}
|
||||||
|
.report-list .report-right{
|
||||||
|
width:84%;
|
||||||
|
color:#919191;
|
||||||
|
font-size:28rpx;
|
||||||
|
}
|
||||||
|
.report-list .report-w{
|
||||||
|
width:auto;
|
||||||
|
}
|
||||||
|
.report-list .r-list{
|
||||||
|
padding: 10rpx 0;
|
||||||
|
}
|
||||||
|
.report-list .r-list:first-child{
|
||||||
|
padding-top:0;
|
||||||
|
}
|
||||||
|
.report-list .r-left{
|
||||||
|
display: flex;
|
||||||
|
/* align-items: center; */
|
||||||
|
font-size:28rpx;
|
||||||
|
color:#919191;
|
||||||
|
}
|
||||||
|
.report-list .r-left view:first-child{
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
.report-list .r-left.r-red{
|
||||||
|
color: #FF2B44;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list .r-right{
|
||||||
|
display: flex;
|
||||||
|
font-size:30rpx;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.report-list .img-flex{
|
||||||
|
display: flex;
|
||||||
|
flex-flow:row wrap;
|
||||||
|
margin-bottom:30rpx;
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
.report-list .img-con{
|
||||||
|
background-color: #EEEEEE;
|
||||||
|
width:210rpx;
|
||||||
|
height: 140rpx;
|
||||||
|
text-align: center;
|
||||||
|
color:#919191;
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
.report-list .img-con .img-pic{
|
||||||
|
width:76rpx;
|
||||||
|
height: 76rpx;
|
||||||
|
margin-top:30rpx;
|
||||||
|
}
|
||||||
|
.report-list .img-show,
|
||||||
|
.report-list .img-con{
|
||||||
|
width: calc(100% / 3 - 10px); /* 减去一些间隙以避免溢出 */
|
||||||
|
margin:20rpx 20rpx 0 0;
|
||||||
|
}
|
||||||
|
.report-list .img-show{
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.report-list .img-show .img-icon{
|
||||||
|
position: absolute;
|
||||||
|
top:50%;
|
||||||
|
left: 50%;
|
||||||
|
width: 64rpx;
|
||||||
|
height:64rpx;
|
||||||
|
margin-left:-32rpx;
|
||||||
|
margin-top:-32rpx;
|
||||||
|
z-index:1;
|
||||||
|
}
|
||||||
|
.report-list .img-show .img-icon img{
|
||||||
|
width: 64rpx;
|
||||||
|
height:64rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list .img-show img,
|
||||||
|
.report-list .img-show video,
|
||||||
|
.report-list .img-show image,
|
||||||
|
.report-list .img-show .player-wrapper{
|
||||||
|
width:210rpx;
|
||||||
|
height: 140rpx;
|
||||||
|
}
|
||||||
|
.report-list .img-show :deep(.uni-video-cover-play-button){
|
||||||
|
width:64rpx;
|
||||||
|
height: 64rpx;
|
||||||
|
line-height: 64rpx;
|
||||||
|
font-size:60rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-con{
|
||||||
|
text-align: center;
|
||||||
|
padding-top:50rpx;
|
||||||
|
}
|
||||||
|
uni-button[type='primary']{
|
||||||
|
background-color: #05A3F4;
|
||||||
|
border-radius: 40rpx;
|
||||||
|
line-height: 2.5;
|
||||||
|
padding:0 80rpx;
|
||||||
|
}
|
||||||
|
uni-button:after{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-border{
|
||||||
|
width:750rpx;
|
||||||
|
height:20rpx;
|
||||||
|
background-color: #F5F5F5;
|
||||||
|
margin-left:-40rpx;
|
||||||
|
margin-top:40rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.log-con{
|
||||||
|
padding-top:10rpx;
|
||||||
|
}
|
||||||
|
.log-con .blue-title{
|
||||||
|
font-size:32rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
328
src/pages/business/polling/problemInitiativeList.vue
Normal file
328
src/pages/business/polling/problemInitiativeList.vue
Normal file
@@ -0,0 +1,328 @@
|
|||||||
|
<template>
|
||||||
|
<view class="con-body">
|
||||||
|
<view class="con-bg">
|
||||||
|
<!-- 头部 -->
|
||||||
|
<customHeader ref="customHeaderRef" :title="!searchShow?'巡检问题上报':'搜索'"
|
||||||
|
:leftFlag="true"
|
||||||
|
:rightFlag="true"
|
||||||
|
@back="handleBack" :searchType="searchShow?1:undefined"
|
||||||
|
>
|
||||||
|
<template #right>
|
||||||
|
<view class="head-right" @click="handleQuestion">
|
||||||
|
<view class="btn-yellow">
|
||||||
|
<uni-icons type="plus" size="20" color="#4C2D11"></uni-icons> 新建问题上报
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</customHeader>
|
||||||
|
|
||||||
|
<!-- 高度来避免头部遮挡 -->
|
||||||
|
<view class="top-height"></view>
|
||||||
|
|
||||||
|
<!-- 搜索处理 -->
|
||||||
|
<customSearch v-if="searchShow"
|
||||||
|
:searchKeywords="searchText"
|
||||||
|
:searchType="searchTypeObj"
|
||||||
|
:checkTypeObj="notictTypeCheck"
|
||||||
|
:searchTypeList="noticeTypeList"
|
||||||
|
@confirm="handleSearchConfirm"
|
||||||
|
></customSearch>
|
||||||
|
<view class="search" v-else @click="handleSearchFocus">
|
||||||
|
<view class="search-bg">
|
||||||
|
<view class="search-left">{{ notictTypeCheck.name?notictTypeCheck.name:'全部' }}</view>
|
||||||
|
<view class="search-right">
|
||||||
|
<uni-icons type="search" size="20" color="#ffffff"></uni-icons>
|
||||||
|
<input class="uni-input" v-model="searchText" placeholder="搜索" placeholder-class="search-color" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 列表 -->
|
||||||
|
<mescroll-uni v-if="!searchShow" ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback"
|
||||||
|
:up="upOption" :down="downOption" :fixed="false" class="scroll-h" :class="{'loading-scroll':cssFlag}">
|
||||||
|
<view class="white-bg" :class="{'bg-height':list.length<8}">
|
||||||
|
<block v-if="list.length>0">
|
||||||
|
<view class="report-list" v-for="(item, index) in list" :key="index" @click="handleDetail(item)">
|
||||||
|
<view class="r-list" style="padding-bottom:0">
|
||||||
|
<view class="r-name">{{ item.groupName }}</view>
|
||||||
|
<view class="r-right">
|
||||||
|
<!-- 问题状态 1=追踪、2=关闭 -->
|
||||||
|
<view v-if="item.problemStatus==1" class="btn-red">进行中</view>
|
||||||
|
<view v-if="item.problemStatus==2" class="btn-green">已解决</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="r-list">
|
||||||
|
<view class="r-left">
|
||||||
|
<view class="r-l-left" style="width:220rpx">跟踪次数<span class="r-gray">{{ item.logNum }}</span></view>
|
||||||
|
<view class="r-l-right">最近跟踪时间<span class="r-gray">{{parseTime(item.lastLogTime,'{y}-{m}-{d} {h}:{i}') }}</span></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="report-border" v-if="index<list.length-1"></view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<view v-else class="no-data">
|
||||||
|
<img :src="'static/images/polling/pic-NoResult.png'" class="no-pic" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</mescroll-uni>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, onMounted,computed } from 'vue'
|
||||||
|
import { onLoad,onHide } from '@dcloudio/uni-app';
|
||||||
|
import customHeader from '@/components/customHeader.vue'
|
||||||
|
import customSearch from '@/components/customSearch.vue'
|
||||||
|
import MescrollUni from 'mescroll-uni/mescroll-uni.vue';
|
||||||
|
import { getNavBarPaddingTop } from '@/utils/system.js'
|
||||||
|
import { parseTime } from '@/utils/datetime.js'
|
||||||
|
import { problemList } from '@/api/polling.js'
|
||||||
|
|
||||||
|
onLoad(async(opt) => {
|
||||||
|
uni.setStorageSync('page_cache',true);
|
||||||
|
})
|
||||||
|
|
||||||
|
// 获取导航栏高度用于内容区域padding
|
||||||
|
const navBarPaddingTop = ref(0);
|
||||||
|
onMounted(() => {
|
||||||
|
navBarPaddingTop.value = getNavBarPaddingTop() * 2;
|
||||||
|
})
|
||||||
|
|
||||||
|
// 搜索处理
|
||||||
|
let searchShow = ref(false);
|
||||||
|
let searchText = ref(undefined);
|
||||||
|
let searchTypeObj = ref({typeId:3,typeName:'巡检类型'});
|
||||||
|
let noticeTypeList=ref([
|
||||||
|
{id:1,name:'日常巡检'},
|
||||||
|
{id:2,name:'临时巡检'},
|
||||||
|
]);
|
||||||
|
let notictTypeCheck = ref({});//选中类型
|
||||||
|
|
||||||
|
onHide(()=>{
|
||||||
|
searchShow.value=false;
|
||||||
|
})
|
||||||
|
|
||||||
|
// 搜索返回操作
|
||||||
|
const handleBack=()=>{
|
||||||
|
searchShow.value=false;
|
||||||
|
}
|
||||||
|
// 获取input 焦点跳转
|
||||||
|
const handleSearchFocus=()=>{
|
||||||
|
searchShow.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 搜索完返回处理
|
||||||
|
const handleSearchConfirm = (param1,param2)=>{
|
||||||
|
// console.log(param1,param2)
|
||||||
|
notictTypeCheck.value=param1.value;
|
||||||
|
searchText.value=param2.value;;
|
||||||
|
searchShow.value=false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 清除未读
|
||||||
|
const handleRead = () => {
|
||||||
|
list.value.forEach(item => {
|
||||||
|
item.isRead = false;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 查询通知列表
|
||||||
|
let list = ref([]);
|
||||||
|
const mescrollRef = ref(null);
|
||||||
|
const upOption = ref({
|
||||||
|
page: { num: 0, size: 10 },
|
||||||
|
noMoreSize: 5,
|
||||||
|
empty: {
|
||||||
|
tip: '~ 空空如也 ~',
|
||||||
|
icon: "../../../static/images/mescroll-empty.png"
|
||||||
|
},
|
||||||
|
textLoading: '加载中...',
|
||||||
|
textNoMore: '已经到底了'
|
||||||
|
});
|
||||||
|
|
||||||
|
const downOption = ref({
|
||||||
|
auto: false,
|
||||||
|
textInOffset: '下拉刷新',
|
||||||
|
textOutOffset: '释放更新',
|
||||||
|
textLoading: '刷新中...'
|
||||||
|
});
|
||||||
|
|
||||||
|
let cssFlag=ref(false);//控制样式
|
||||||
|
const mescrollInit = (mescroll) => {
|
||||||
|
cssFlag.value = true;
|
||||||
|
mescrollRef.value = mescroll;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 下拉刷新
|
||||||
|
const downCallback = async (mescroll) => {
|
||||||
|
try {
|
||||||
|
console.log("下拉刷新")
|
||||||
|
const res = await getList(1, upOption.value.page.size);
|
||||||
|
cssFlag.value = false;
|
||||||
|
list.value = res.list;
|
||||||
|
// mescroll.resetUpScroll();
|
||||||
|
} catch (error) {
|
||||||
|
mescroll.endErr();
|
||||||
|
} finally {
|
||||||
|
setTimeout(async ()=>{
|
||||||
|
mescroll.endSuccess();
|
||||||
|
},500);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 上拉加载更多
|
||||||
|
const upCallback = async (mescroll) => {
|
||||||
|
try {
|
||||||
|
console.log("上拉加载更多")
|
||||||
|
let res = await getList(mescroll.num, mescroll.size);
|
||||||
|
if (mescroll.num === 1) {
|
||||||
|
list.value = res.list;
|
||||||
|
} else {
|
||||||
|
list.value.push(...res.list);
|
||||||
|
}
|
||||||
|
mescroll.endBySize(res.list.length, res.total);
|
||||||
|
} catch (error) {
|
||||||
|
mescroll.endErr();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取数据列表
|
||||||
|
const getList = (pageIndex, pageSize) => {
|
||||||
|
return new Promise(async (resolve) => {
|
||||||
|
let param = {
|
||||||
|
pageIndex,
|
||||||
|
pageSize,
|
||||||
|
key:searchText.value?searchText.value:undefined,
|
||||||
|
taskType:notictTypeCheck.value.id
|
||||||
|
}
|
||||||
|
let res = await problemList(param);
|
||||||
|
let list = res.list || [];
|
||||||
|
resolve({
|
||||||
|
list,
|
||||||
|
// total: res.recordCount || 0
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// 跳转问题上报页面
|
||||||
|
const handleQuestion=()=>{
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/business/polling/problemInitiative'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查看详情
|
||||||
|
const handleDetail = (item) =>{
|
||||||
|
let url= '/pages/business/polling/problemInitiativeDetail?problemId='+item.problemId;
|
||||||
|
uni.navigateTo({
|
||||||
|
url
|
||||||
|
});
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.all-body{
|
||||||
|
position: absolute;
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
top:150rpx;
|
||||||
|
height: calc(100vh - 75px);
|
||||||
|
/* #endif */
|
||||||
|
/* #ifndef APP-PLUS */
|
||||||
|
top:120rpx;
|
||||||
|
height: calc(100vh - 64px);
|
||||||
|
/* #endif */
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.mescroll-downwarp .downwarp-progress){
|
||||||
|
border-color:#fff !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.mescroll-downwarp .downwarp-tip){
|
||||||
|
color:#fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.head-right{}
|
||||||
|
.head-right .btn-yellow{
|
||||||
|
background-color: #FCC123;
|
||||||
|
color: #4C2D11;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
padding:10rpx 25rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.head-right .btn-yellow .img-repair{
|
||||||
|
width: 30rpx;
|
||||||
|
height: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.white-bg {
|
||||||
|
width: 670rpx;
|
||||||
|
padding: 30rpx 40rpx 40rpx;
|
||||||
|
margin-bottom: 0;
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.white-bg.bg-height{
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
height: calc(100vh - 150px);
|
||||||
|
/* #endif */
|
||||||
|
/* #ifndef APP-PLUS */
|
||||||
|
height: calc(100vh - 140px);
|
||||||
|
/* #endif */
|
||||||
|
}
|
||||||
|
.scroll-h{
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
height: calc(100vh - 130px);
|
||||||
|
/* #endif */
|
||||||
|
/* #ifndef APP-PLUS */
|
||||||
|
height: calc(100vh - 105px);
|
||||||
|
/* #endif */
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list{
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.report-border{
|
||||||
|
border-bottom:1px solid #E7E7E7;
|
||||||
|
width:710rpx;
|
||||||
|
height: 1px;
|
||||||
|
margin:20rpx 0;
|
||||||
|
}
|
||||||
|
.report-list .r-list{
|
||||||
|
padding: 5rpx 0;
|
||||||
|
}
|
||||||
|
.report-list .r-list .r-left{
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.report-list .r-list .r-gray{
|
||||||
|
margin-left:10rpx;
|
||||||
|
}
|
||||||
|
.report-list .r-list .r-blue{
|
||||||
|
margin-left:10rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.report-list .r-list .r-red{
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.report-list .r-list .r-name{
|
||||||
|
width:525rpx
|
||||||
|
}
|
||||||
|
.r-left .r-l-left{
|
||||||
|
width:280rpx;
|
||||||
|
}
|
||||||
|
.r-left .r-l-right{
|
||||||
|
|
||||||
|
}
|
||||||
|
.no-data .no-pic{
|
||||||
|
display: block;
|
||||||
|
width:440rpx;
|
||||||
|
height:210rpx;
|
||||||
|
margin:40rpx auto;
|
||||||
|
}
|
||||||
|
:deep(.mescroll-upwarp){
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
498
src/pages/business/polling/problemInitiativeLog.vue
Normal file
498
src/pages/business/polling/problemInitiativeLog.vue
Normal file
@@ -0,0 +1,498 @@
|
|||||||
|
<template>
|
||||||
|
<view class="con-body">
|
||||||
|
<view class="con-bg">
|
||||||
|
<!-- 头部 -->
|
||||||
|
<customHeader ref="customHeaderRef" title="新增跟踪信息"
|
||||||
|
:leftFlag="true" :rightFlag="false"
|
||||||
|
></customHeader>
|
||||||
|
<!-- 高度来避免头部遮挡 -->
|
||||||
|
<view class="top-height"></view>
|
||||||
|
|
||||||
|
<!-- 下拉刷新 -->
|
||||||
|
<mescroll-uni ref="mescrollRef" @init="mescrollInit"
|
||||||
|
:down="downOption" @down="downCallback"
|
||||||
|
:fixed="false" class="scroll-h"
|
||||||
|
>
|
||||||
|
<view class="white-bg">
|
||||||
|
<view class="red-title">问题：{{optionObj.groupName}}</view>
|
||||||
|
<view class="report-border"></view>
|
||||||
|
<view class="report-list">
|
||||||
|
<view class="report-pro">提交人</view>
|
||||||
|
<view class="report-right">{{optionObj.createUserName}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="report-border"></view>
|
||||||
|
<view class="report-list" style="display:block;">
|
||||||
|
检查点跟踪情况描述
|
||||||
|
<textarea class="r-input textarea" v-model="desc" auto-height
|
||||||
|
placeholder="请输入跟踪情况描述" placeholder-class="place-input"
|
||||||
|
></textarea>
|
||||||
|
</view>
|
||||||
|
<view class="report-border"></view>
|
||||||
|
<view class="report-list" style="display:block;">
|
||||||
|
<view class="r-title">问题点位照片或视频 <text>*</text></view>
|
||||||
|
<view class="img-flex">
|
||||||
|
<view class="img-show" v-for="(item2,index2) in imgArr" :key="index2" @click="showMediaPreview(item2)">
|
||||||
|
<view class="img-delete" @click.stop="handleDelete(imgArr,index2)">
|
||||||
|
<uni-icons type="closeempty" size="16" color="#fff"></uni-icons>
|
||||||
|
</view>
|
||||||
|
<image :src="item2.shortUrl" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view class="img-show" v-for="(item2,index2) in videoArr" :key="index2" @click="showMediaPreview(item2)">
|
||||||
|
<view class="img-delete" @click.stop="handleDelete(videoArr,index2)">
|
||||||
|
<uni-icons type="closeempty" size="16" color="#fff"></uni-icons>
|
||||||
|
</view>
|
||||||
|
<view class="img-icon">
|
||||||
|
<img :src="'static/images/polling/icon-play.png'" />
|
||||||
|
</view>
|
||||||
|
<!-- <video :src="item" controls></video> -->
|
||||||
|
<DomVideoPlayer :src="item2.url" objectFit="cover" />
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- loading -->
|
||||||
|
<view class="img-con" v-if="imgLoading">
|
||||||
|
<view class="upload-loading">
|
||||||
|
<uni-icons type="refreshempty" size="30" color="#C9C9C9"></uni-icons>
|
||||||
|
<view>上传中....</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-con" @click="chooseMedia" v-else>
|
||||||
|
<img :src="'static/images/polling/icon-AddPorV.png'" class="img-pic" />
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- #ifdef APP-PLUS -->
|
||||||
|
<!-- #endif -->
|
||||||
|
<!-- #ifndef APP-PLUS -->
|
||||||
|
<!-- <view class="img-con">
|
||||||
|
<img :src="'static/images/polling/icon-AddPorV.png'" class="img-pic" />
|
||||||
|
</view> -->
|
||||||
|
<!-- #endif -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="btn-submit">
|
||||||
|
<button type="primary" @click="handleSubmit">提交</button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</mescroll-uni>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 图片放大 -->
|
||||||
|
<mediaPreview :visible="isVisible" :url="mediaUrl" @close="handlePreviewClose"></mediaPreview>
|
||||||
|
|
||||||
|
<!-- 选择图片或者视频 -->
|
||||||
|
<chooseMediaVue ref="chooseMediaRef" @getMediaArr="getMediaArr" @closeMedia="closeMedia"></chooseMediaVue>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref,onMounted,onUnmounted,nextTick,computed,reactive,getCurrentInstance } from 'vue'
|
||||||
|
import { onLoad,onHide, onShow} from '@dcloudio/uni-app';
|
||||||
|
import customHeader from '@/components/customHeader.vue';
|
||||||
|
import MescrollUni from 'mescroll-uni/mescroll-uni.vue';
|
||||||
|
import mediaPreview from "@/components/mediaPreview.vue"
|
||||||
|
import chooseMediaVue from '@/components/chooseMedia.vue'
|
||||||
|
import DomVideoPlayer from 'uniapp-video-player'
|
||||||
|
import { getUserInfo } from '@/api/auth.js'
|
||||||
|
import { problemDetail,problemAddLog,minioUpload } from '@/api/polling.js'
|
||||||
|
import { MINIO_KEY } from '@/enums/cacheEnums';
|
||||||
|
import {showAlert,showLoading,hideLoading} from '@/utils/message.js'
|
||||||
|
import {compressImageUni} from '@/utils/common.js'
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
|
||||||
|
let problemId = ref('');
|
||||||
|
let realname = ref('');
|
||||||
|
let desc = ref('');//描述
|
||||||
|
let minioObj = {};
|
||||||
|
onLoad(async option => {
|
||||||
|
// console.log(option)
|
||||||
|
problemId.value = option.problemId;
|
||||||
|
|
||||||
|
minioObj = JSON.parse(uni.getStorageSync(MINIO_KEY) || "\{\}")
|
||||||
|
let userinfo = await getUserInfo({});
|
||||||
|
realname.value = userinfo.realname
|
||||||
|
|
||||||
|
getList();
|
||||||
|
})
|
||||||
|
onShow(()=>{
|
||||||
|
imgLoading.value=false;
|
||||||
|
})
|
||||||
|
|
||||||
|
// 查询列表
|
||||||
|
let list = ref([]);
|
||||||
|
let optionObj = ref({})
|
||||||
|
|
||||||
|
// 下拉刷新
|
||||||
|
const mescrollRef = ref(null);
|
||||||
|
const mescrollInit = (mescroll) => {
|
||||||
|
mescrollRef.value = mescroll;
|
||||||
|
};
|
||||||
|
const downOption = ref({
|
||||||
|
use:false,
|
||||||
|
auto: false,
|
||||||
|
textInOffset: '下拉刷新',
|
||||||
|
textOutOffset: '释放更新',
|
||||||
|
textLoading: '刷新中...'
|
||||||
|
});
|
||||||
|
// 下拉刷新
|
||||||
|
const downCallback = async (mescroll) => {
|
||||||
|
try {
|
||||||
|
getList();
|
||||||
|
} catch (error) {
|
||||||
|
mescroll.endErr();
|
||||||
|
} finally {
|
||||||
|
mescroll.endSuccess();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取数据列表
|
||||||
|
const getList = async () => {
|
||||||
|
let res = await problemDetail({problemId:problemId.value});
|
||||||
|
let data = res || {};
|
||||||
|
data.list = data.pointName.split(",") || [];
|
||||||
|
optionObj.value = data;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 图片或视频
|
||||||
|
let mediaArr = ref([]);//传给后台的地址
|
||||||
|
let imgArr=ref([]);//图片 后台返回的
|
||||||
|
let videoArr = ref([]);//视频 后台返回的
|
||||||
|
let imgLoading = ref(false)
|
||||||
|
const chooseMedia = () => {
|
||||||
|
proxy.$refs["chooseMediaRef"].openPicker();
|
||||||
|
imgLoading.value=true;
|
||||||
|
/* uni.chooseMedia({
|
||||||
|
count: 9,
|
||||||
|
mediaType: ['image', 'video'], // 指定可选择图片和视频
|
||||||
|
sourceType: ['album', 'camera'],
|
||||||
|
maxDuration: 60, // 拍摄视频最长拍摄时间
|
||||||
|
camera: 'back',
|
||||||
|
success: (res) => {
|
||||||
|
console.log("问题跟踪chooseMedia=>",res)
|
||||||
|
res.tempFiles.forEach(async file => {
|
||||||
|
console.log(`文件类型: ${file.type}, 文件路径: ${file.tempFilePath}`);
|
||||||
|
let compressImg = file.tempFilePath;
|
||||||
|
// 图片进行压缩
|
||||||
|
if (file.fileType === 'image') {
|
||||||
|
// #ifdef APP-PLUS
|
||||||
|
// 压缩图片
|
||||||
|
compressImg = await compressImageUni(file.tempFilePath);
|
||||||
|
// #endif
|
||||||
|
}
|
||||||
|
// 执行上传
|
||||||
|
let param = {
|
||||||
|
filePath: compressImg,
|
||||||
|
name: 'file',
|
||||||
|
formData: {
|
||||||
|
directory:'polling'
|
||||||
|
},
|
||||||
|
}
|
||||||
|
imgLoading.value=true;
|
||||||
|
minioUpload(param).then(res=>{
|
||||||
|
let data = res.data;
|
||||||
|
mediaArr.value.push(data.fileName);
|
||||||
|
if (file.fileType === 'image') {// 图片
|
||||||
|
imgArr.value.push({
|
||||||
|
shortUrl:minioObj.minioThumbUrl +"/"+data.fileName,
|
||||||
|
url:minioObj.minioUrl +"/"+data.fileName,
|
||||||
|
name:data.fileName
|
||||||
|
})
|
||||||
|
} else if (file.fileType === 'video') {// 视频
|
||||||
|
videoArr.value.push({
|
||||||
|
shortUrl:minioObj.minioThumbUrl +"/"+data.fileName,
|
||||||
|
url:minioObj.minioUrl +"/"+data.fileName,
|
||||||
|
name:data.fileName
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}).finally(()=>{
|
||||||
|
imgLoading.value=false;
|
||||||
|
})
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});*/
|
||||||
|
}
|
||||||
|
|
||||||
|
const closeMedia = ()=>{
|
||||||
|
imgLoading.value=false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 插件回调
|
||||||
|
const getMediaArr=(arr)=>{
|
||||||
|
// console.log("插件回调=>",arr)
|
||||||
|
try {
|
||||||
|
arr.forEach(data=>{
|
||||||
|
mediaArr.value.push(data.fileName);
|
||||||
|
if(data.fileType=="image"){
|
||||||
|
imgArr.value.push({
|
||||||
|
shortUrl:minioObj.minioThumbUrl +"/"+data.fileName,
|
||||||
|
url:minioObj.minioUrl +"/"+data.fileName,
|
||||||
|
name:data.fileName
|
||||||
|
})
|
||||||
|
}else if(data.fileType == "video"){
|
||||||
|
videoArr.value.push({
|
||||||
|
shortUrl:minioObj.minioThumbUrl +"/"+data.fileName,
|
||||||
|
url:minioObj.minioUrl +"/"+data.fileName,
|
||||||
|
name:data.fileName
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// console.log(imgArr.value,videoArr.value)
|
||||||
|
imgLoading.value=false;
|
||||||
|
} catch (error) {
|
||||||
|
console.error(error)
|
||||||
|
imgLoading.value=false;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// 视频或图片删除 根据数组下标删除数组里的某个图片或视频
|
||||||
|
const handleDelete=(arr,index2)=>{
|
||||||
|
arr.splice(index2, 1);
|
||||||
|
let item = arr[index2];
|
||||||
|
mediaArr.value = mediaArr.value.filter(item2=>item2!=item.name);
|
||||||
|
// console.log("删除后=>",mediaArr.value)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 放大视频或图片
|
||||||
|
let isVisible= ref(false);//放大处理
|
||||||
|
let mediaUrl= ref('');//放大地址
|
||||||
|
let videoShow = ref(true);
|
||||||
|
const showMediaPreview=(item)=>{
|
||||||
|
// console.log("调用放大视频==>",item)
|
||||||
|
isVisible.value = true;
|
||||||
|
videoShow.value = false;
|
||||||
|
mediaUrl.value = item.url
|
||||||
|
}
|
||||||
|
const handlePreviewClose=()=>{
|
||||||
|
isVisible.value = false;
|
||||||
|
videoShow.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 提交
|
||||||
|
const handleSubmit=()=>{
|
||||||
|
let param = {
|
||||||
|
problemId:problemId.value,
|
||||||
|
logVedio:mediaArr.value.join(","),
|
||||||
|
logDesc:desc.value
|
||||||
|
}
|
||||||
|
// console.log("problemAddLog=>",param)
|
||||||
|
problemAddLog(param).then(res=>{
|
||||||
|
showAlert("新建问题跟踪成功！");
|
||||||
|
uni.navigateBack();
|
||||||
|
}).finally(()=>{
|
||||||
|
hideLoading();
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.scroll-h{
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
height:calc(100vh - 78px) !important;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifndef APP-PLUS */
|
||||||
|
height: calc(100vh - 58px) !important;
|
||||||
|
/* #endif */
|
||||||
|
}
|
||||||
|
:deep(.mescroll-upwarp){
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
.white-bg{
|
||||||
|
width: 680rpx;
|
||||||
|
padding: 15rpx 30rpx 40rpx 40rpx;
|
||||||
|
margin-bottom: 0;
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.white-bg .red-title{
|
||||||
|
margin-bottom:30rpx;
|
||||||
|
color:#FF2B44;
|
||||||
|
font-size:38rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-border{
|
||||||
|
border-bottom:1px solid #E7E7E7;
|
||||||
|
width:710rpx;
|
||||||
|
height: 1px;
|
||||||
|
margin:20rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list{
|
||||||
|
display: flex;
|
||||||
|
font-size:28rpx;
|
||||||
|
}
|
||||||
|
.report-list .r-title{
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.report-list text{
|
||||||
|
color:#FF2B44;
|
||||||
|
font-size:28rpx;
|
||||||
|
}
|
||||||
|
.report-list .report-pro{
|
||||||
|
font-size:28rpx;
|
||||||
|
width:16%;
|
||||||
|
/* margin-right:30rpx; */
|
||||||
|
}
|
||||||
|
.report-list .report-right{
|
||||||
|
width:84%;
|
||||||
|
color:#919191;
|
||||||
|
font-size:28rpx;
|
||||||
|
}
|
||||||
|
.report-list .r-input{
|
||||||
|
border:1px solid #E7E7E7;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
width:620rpx;
|
||||||
|
padding:15rpx 25rpx;
|
||||||
|
margin:20rpx 0 30rpx;
|
||||||
|
}
|
||||||
|
.report-list .place-input{
|
||||||
|
color:#BFBFBF;
|
||||||
|
font-size:28rpx;
|
||||||
|
}
|
||||||
|
.report-list .textarea{
|
||||||
|
min-height: 120rpx;
|
||||||
|
}
|
||||||
|
.report-list .r-list{
|
||||||
|
padding: 10rpx 0;
|
||||||
|
}
|
||||||
|
.report-list .r-list:first-child{
|
||||||
|
padding-top:0;
|
||||||
|
}
|
||||||
|
.report-list .r-left{
|
||||||
|
display: flex;
|
||||||
|
font-size:28rpx;
|
||||||
|
color:#919191;
|
||||||
|
}
|
||||||
|
.report-list .r-left view:first-child{
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
.report-list .r-left.r-red{
|
||||||
|
color: #FF2B44;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list .r-right{
|
||||||
|
display: flex;
|
||||||
|
font-size:30rpx;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.report-list .r-r-round{
|
||||||
|
width:35rpx;
|
||||||
|
height:35rpx;
|
||||||
|
border:1px solid #BDBDBD;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
.report-list .r-r-round.active{
|
||||||
|
border:1px solid #FF2B44;
|
||||||
|
background-color: #FF2B44;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.report-list .r-r-round.active::after{
|
||||||
|
content:"!";
|
||||||
|
position: absolute;
|
||||||
|
top:0;
|
||||||
|
left:0;
|
||||||
|
color:#fff;
|
||||||
|
text-align: center;
|
||||||
|
width:35rpx;
|
||||||
|
height:35rpx;
|
||||||
|
/* #ifndef APP-PLUS */
|
||||||
|
line-height: 30rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
height:30rpx;
|
||||||
|
padding-top:5rpx;
|
||||||
|
/* #endif */
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list .img-flex{
|
||||||
|
display: flex;
|
||||||
|
flex-flow:row wrap;
|
||||||
|
margin-bottom:30rpx;
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
.report-list .img-show img,
|
||||||
|
.report-list .img-show image,
|
||||||
|
.report-list .img-show video,
|
||||||
|
.report-list .img-show .player-wrapper{
|
||||||
|
width:210rpx;
|
||||||
|
height: 140rpx;
|
||||||
|
}
|
||||||
|
.report-list .img-show :deep(.uni-video-cover-play-button){
|
||||||
|
width:64rpx;
|
||||||
|
height: 64rpx;
|
||||||
|
line-height: 64rpx;
|
||||||
|
font-size:60rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list .img-con{
|
||||||
|
background-color: #EEEEEE;
|
||||||
|
width:210rpx;
|
||||||
|
height: 140rpx;
|
||||||
|
text-align: center;
|
||||||
|
color:#919191;
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
.report-list .img-con .img-pic{
|
||||||
|
width:76rpx;
|
||||||
|
height: 76rpx;
|
||||||
|
margin-top:30rpx;
|
||||||
|
}
|
||||||
|
.report-list .img-show,
|
||||||
|
.report-list .img-con{
|
||||||
|
width: calc(100% / 3 - 10px); /* 减去一些间隙以避免溢出 */
|
||||||
|
margin:20rpx 10rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list .img-show:first-child,
|
||||||
|
.report-list .img-con:first-child{
|
||||||
|
margin-left:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.report-list .img-show{
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.report-list .img-show .img-delete{
|
||||||
|
position: absolute;
|
||||||
|
/* #ifndef APP-PLUS */
|
||||||
|
right:4rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
right:4rpx;
|
||||||
|
/* #endif */
|
||||||
|
top:8rpx;
|
||||||
|
width:34rpx;
|
||||||
|
height:34rpx;
|
||||||
|
line-height:34rpx;
|
||||||
|
border-radius:3rpx;
|
||||||
|
background-color: rgba(0, 0, 0, 0.6);
|
||||||
|
text-align: center;
|
||||||
|
z-index:1;
|
||||||
|
}
|
||||||
|
.report-list .img-show .img-icon{
|
||||||
|
position: absolute;
|
||||||
|
top:50%;
|
||||||
|
left: 50%;
|
||||||
|
width: 64rpx;
|
||||||
|
height:64rpx;
|
||||||
|
margin-left:-32rpx;
|
||||||
|
margin-top:-32rpx;
|
||||||
|
z-index:1;
|
||||||
|
}
|
||||||
|
.report-list .img-show .img-icon img{
|
||||||
|
width: 64rpx;
|
||||||
|
height:64rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-submit{
|
||||||
|
width:400rpx;
|
||||||
|
margin:90rpx auto;
|
||||||
|
}
|
||||||
|
.btn-submit uni-button[type='primary']{
|
||||||
|
background-color: #05A3F4;
|
||||||
|
border-radius: 40rpx;
|
||||||
|
line-height: 2.2;
|
||||||
|
}
|
||||||
|
.btn-submit uni-button:after{
|
||||||
|
border-color:#05A3F4;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
BIN
src/static/images/business/icon-xjwtsb.png
Normal file
BIN
src/static/images/business/icon-xjwtsb.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.3 KiB |
Reference in New Issue
Block a user