<template>
|
<div class="dailyreport">
|
<div class="dailyBox">
|
<div class="dailyTop">
|
<el-select
|
v-model="cityChoose"
|
placeholder="请选择区域"
|
>
|
<el-option
|
v-for="item in cityOptions"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
<el-select
|
v-model="equipChoose1"
|
placeholder="请选择设备"
|
>
|
<el-option
|
v-for="item in equipOptions1"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
<el-date-picker
|
v-model="value1"
|
type="daterange"
|
align="right"
|
unlink-panels
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
:picker-options="pickerOptions1"
|
/>
|
<el-select
|
v-if="equipChoose1==='car'"
|
v-model="carInput"
|
clearable
|
placeholder="请选择走航车"
|
style="width: 180px;display: inline-block"
|
>
|
<el-option
|
v-for="(item,index) in carMac"
|
:key="index"
|
:label="item.name"
|
:value="item.mac"
|
/>
|
</el-select>
|
<el-select
|
v-else
|
v-model="planSelect"
|
clearable
|
placeholder="请选择无人机"
|
style="width: 180px;display: inline-block"
|
>
|
<el-option
|
v-for="(item,index) in carMac"
|
:key="index"
|
:label="item.name"
|
:value="item.mac"
|
/>
|
</el-select>
|
<el-button
|
type="primary"
|
style="margin-right: 10px;"
|
@click="selectExport"
|
>
|
查询
|
</el-button>
|
<el-button
|
type="primary"
|
style="margin-left: 0"
|
@click="upImgBtn"
|
>
|
上传
|
</el-button>
|
<!-- <el-button type="primary" @click="exportDom">下载demo</el-button>-->
|
</div>
|
<div
|
class="dailyDown"
|
style="overflow-y: auto"
|
>
|
<el-card class="boxCard">
|
<div style="text-align: right;">
|
<el-button
|
v-if="equipChoose1==='car'"
|
type="primary"
|
size="mini"
|
:disabled="handSelectData.length===0"
|
@click="expReport()"
|
>
|
下载
|
</el-button>
|
<el-button
|
v-else
|
type="primary"
|
size="mini"
|
@click="exUAVReport()"
|
>
|
下载
|
</el-button>
|
</div>
|
<el-table
|
:data="tableData"
|
style="width: 100%;overflow-y: auto; height: 82%;"
|
@selection-change="handleSelectionChange"
|
>
|
<el-table-column
|
type="selection"
|
align="center"
|
width="55"
|
/>
|
<el-table-column
|
prop="name"
|
align="center"
|
label="报告名称"
|
/>
|
<el-table-column
|
prop="time"
|
align="center"
|
label="提交时间"
|
/>
|
<el-table-column
|
prop="date"
|
align="center"
|
label="创建时间"
|
/>
|
<!-- <el-table-column
|
label="操作 "
|
align="center"
|
> -->
|
<!-- <template slot-scope="scope">
|
<el-button
|
v-if="equipChoose1==='car'"
|
type="text"
|
size="medium"
|
@click="expReport(scope.row)"
|
>
|
下载
|
</el-button>
|
<el-button
|
v-else
|
type="text"
|
size="medium"
|
@click="exUAVReport(scope.row)"
|
>
|
下载
|
</el-button>
|
</template> -->
|
<!-- </el-table-column> -->
|
</el-table>
|
</el-card>
|
</div>
|
</div>
|
<el-dialog
|
title="上传图片"
|
:visible.sync="openBox"
|
>
|
<div class="openTop">
|
<el-select
|
v-model="cityChoose2"
|
placeholder="请选择区域"
|
>
|
<el-option
|
v-for="item in cityOptions2"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
<el-select
|
v-model="equipChoose2"
|
placeholder="请选择设备"
|
>
|
<el-option
|
v-for="item in equipOptions2"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
<el-select
|
v-if="equipChoose2==='car'"
|
v-model="carInput2"
|
clearable
|
placeholder="请选择走航车"
|
style="width: 180px;display: inline-block"
|
>
|
<el-option
|
v-for="(item, index) in carMac"
|
:key="index"
|
:label="item.name"
|
:value="item.mac"
|
/>
|
</el-select>
|
<el-select
|
v-else
|
v-model="planSelect2"
|
clearable
|
placeholder="请选择无人机"
|
style="width: 180px;display: inline-block"
|
>
|
<el-option
|
v-for="(item, index) in planMac"
|
:key="index"
|
:label="item.name"
|
:value="item.mac"
|
/>
|
</el-select>
|
<el-input
|
v-if="equipChoose2==='car'"
|
v-model="areaInput3"
|
placeholder="请输入走航区域"
|
clearable
|
style="width: 180px;display: inline-block"
|
/>
|
<el-input
|
v-else
|
v-model="planInput2"
|
placeholder="请输入飞行区域"
|
clearable
|
style="width: 180px;display: inline-block"
|
/>
|
<el-button
|
v-if="equipChoose2!=='car'"
|
type="primary"
|
@click="innerVisible = true"
|
>
|
飞行监测
|
</el-button>
|
<div
|
v-if="equipChoose2==='car'"
|
class="dateTimeBox"
|
>
|
<div>
|
<el-date-picker
|
v-model="value2"
|
type="datetimerange"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
:picker-options="value2Pic"
|
@change="value2Change"
|
/>
|
<el-button
|
style="padding: 6px 8px;"
|
:disabled="isDidAdd"
|
@click="addDate('add')"
|
>
|
+
|
</el-button>
|
<el-button
|
style="padding: 6px 10px;"
|
:disabled="isDisMinus"
|
@click="addDate('minus')"
|
>
|
-
|
</el-button>
|
</div>
|
<div :style="{display:dateTime2}">
|
<el-date-picker
|
v-model="value3"
|
type="datetimerange"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
:picker-options="value3Pic"
|
@change="value3Change"
|
/>
|
</div>
|
<div :style="{display:dateTime3}">
|
<el-date-picker
|
v-model="value4"
|
type="datetimerange"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
:picker-options="value4Pic"
|
@change="value4Change"
|
/>
|
</div>
|
</div>
|
<div v-else>
|
<el-date-picker
|
v-model="planUpTime"
|
type="date"
|
placeholder="选择日期"
|
/>
|
</div>
|
</div>
|
<div
|
v-if="equipChoose2==='car'"
|
class="uploadDiv"
|
style="width:90%;overflow: auto;display: flex;flex-wrap: wrap;justify-content: space-between"
|
>
|
<el-upload
|
ref="upload"
|
class="upload-demo"
|
action=""
|
:on-change="handleChange1"
|
:on-remove="handleRemove1"
|
:file-list="fileList1"
|
:limit="1"
|
:on-exceed="handleExceed"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传走航监测概况图片
|
</div>
|
</el-upload>
|
<el-upload
|
ref="upload"
|
class="upload-demo"
|
action=""
|
:on-change="handleChange2"
|
:on-remove="handleRemove2"
|
:file-list="fileList2"
|
:limit="1"
|
:on-exceed="handleExceed"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传PM2.5走航监测图片
|
</div>
|
</el-upload>
|
<el-upload
|
ref="upload"
|
class="upload-demo"
|
action=""
|
:on-change="handleChange3"
|
:on-remove="handleRemove3"
|
:file-list="fileList3"
|
:limit="1"
|
:on-exceed="handleExceed"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传PM10走航监测图片
|
</div>
|
</el-upload>
|
<el-upload
|
ref="upload"
|
class="upload-demo"
|
action=""
|
:on-change="handleChange4"
|
:on-remove="handleRemove4"
|
:file-list="fileList4"
|
:limit="1"
|
:on-exceed="handleExceed"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传NO2走航监测图片
|
</div>
|
</el-upload>
|
<el-upload
|
ref="upload"
|
class="upload-demo"
|
action=""
|
:on-change="handleChange5"
|
:on-remove="handleRemove5"
|
:file-list="fileList5"
|
:limit="1"
|
:on-exceed="handleExceed"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传CO走航监测图片
|
</div>
|
</el-upload>
|
<el-upload
|
ref="upload"
|
class="upload-demo"
|
action=""
|
:on-change="handleChange6"
|
:on-remove="handleRemove6"
|
:file-list="fileList6"
|
:limit="1"
|
:on-exceed="handleExceed"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传SO2走航监测图片
|
</div>
|
</el-upload>
|
<el-upload
|
ref="upload"
|
class="upload-demo"
|
action=""
|
:on-change="handleChange7"
|
:on-remove="handleRemove7"
|
:file-list="fileList7"
|
:limit="1"
|
:on-exceed="handleExceed"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传O3走航监测图片
|
</div>
|
</el-upload>
|
<el-upload
|
ref="upload"
|
class="upload-demo"
|
action=""
|
:on-change="handleChange8"
|
:on-remove="handleRemove8"
|
:file-list="fileList8"
|
:limit="1"
|
:on-exceed="handleExceed"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传VOCs走航监测图片
|
</div>
|
</el-upload>
|
<el-upload
|
ref="upload"
|
class="upload-demo"
|
action=""
|
:on-change="handleChange9"
|
:on-remove="handleRemove9"
|
:file-list="fileList9"
|
:limit="1"
|
:on-exceed="handleExceed"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传小结图片
|
</div>
|
</el-upload>
|
</div>
|
<div
|
v-else
|
class="uploadDiv"
|
style="width:90%;overflow: auto;display: flex;flex-wrap: wrap;justify-content: space-between"
|
>
|
<el-upload
|
ref="uploadPlan1"
|
class="upload-demo"
|
action=""
|
:on-change="handleChangePlan1"
|
:on-remove="handleRemovePlan1"
|
:file-list="fileListPlan1"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传国控点位置及航拍图
|
</div>
|
</el-upload>
|
<el-upload
|
ref="uploadPlan2"
|
class="upload-demo"
|
action=""
|
:on-change="handleChangePlan2"
|
:on-remove="handleRemovePlan2"
|
:file-list="fileListPlan2"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传国控点实时数值图
|
</div>
|
</el-upload>
|
<el-upload
|
ref="uploadPlan3"
|
class="upload-demo"
|
action=""
|
:on-change="handleChangePlan3"
|
:on-remove="handleRemovePlan3"
|
:file-list="fileListPlan3"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传高值区域与国控点相对位置图
|
</div>
|
</el-upload>
|
<el-upload
|
ref="uploadPlan4"
|
class="upload-demo"
|
action=""
|
:on-change="handleChangePlan4"
|
:on-remove="handleRemovePlan4"
|
:file-list="fileListPlan4"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传O3实时监测高值区域图
|
</div>
|
</el-upload>
|
<el-upload
|
ref="uploadPlan5"
|
class="upload-demo"
|
action=""
|
:on-change="handleChangePlan5"
|
:on-remove="handleRemovePlan5"
|
:file-list="fileListPlan5"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传O3高值区现场航拍图
|
</div>
|
</el-upload>
|
<el-upload
|
ref="uploadPlan6"
|
class="upload-demo"
|
action=""
|
:on-change="handleChangePlan6"
|
:on-remove="handleRemovePlan6"
|
:file-list="fileListPlan6"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传PM10实时监测高值区域图
|
</div>
|
</el-upload>
|
<el-upload
|
ref="uploadPlan7"
|
class="upload-demo"
|
action=""
|
:on-change="handleChangePlan7"
|
:on-remove="handleRemovePlan7"
|
:file-list="fileListPlan7"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传PM10高值区现场航拍图
|
</div>
|
</el-upload>
|
<el-upload
|
ref="uploadPlan8"
|
class="upload-demo"
|
action=""
|
:on-change="handleChangePlan8"
|
:on-remove="handleRemovePlan8"
|
:file-list="fileListPlan8"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传SO2实时监测高值区域图
|
</div>
|
</el-upload>
|
<el-upload
|
ref="uploadPlan9"
|
class="upload-demo"
|
action=""
|
:on-change="handleChangePlan9"
|
:on-remove="handleRemovePlan9"
|
:file-list="fileListPlan9"
|
multiple
|
:auto-upload="false"
|
>
|
<el-button
|
slot="trigger"
|
type="primary"
|
size="small"
|
>
|
选取图片
|
</el-button>
|
<div
|
slot="tip"
|
class="el-upload__tip"
|
>
|
请上传SO2高值区现场航拍图
|
</div>
|
</el-upload>
|
</div>
|
<div
|
slot="footer"
|
class="dialog-footer"
|
>
|
<el-button @click="openBox = false">
|
取 消
|
</el-button>
|
<el-button
|
type="primary"
|
:disabled="isDisplay"
|
@click="submitImgs"
|
>
|
保 存
|
</el-button>
|
</div>
|
<el-dialog
|
class="innerDialog"
|
width="70%"
|
height="90%"
|
margin-top="7vh"
|
title="内层 Dialog"
|
:visible.sync="innerVisible"
|
append-to-body
|
>
|
<Map />
|
</el-dialog>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import { exportDocx } from '@/utils/exportImageFile'
|
import { exportUAVImage } from '@/utils/exportUAVImage'
|
import requestObj from '@/utils/request'
|
import Map from '@/components/PlanMap/Map'
|
export default {
|
components: { Map },
|
data () {
|
return {
|
handSelectData: [],
|
cityChoose: 'gx', // 默认查询高新区走行车
|
cityChoose2: 'gx', // 默认上传高新区图片
|
cityOptions: [
|
{
|
value: 'gx',
|
label: '盐城市'
|
}
|
// , {
|
// value: 'gx',
|
// label: '高新区'
|
// }, {
|
// value: 'hn',
|
// label: '浑南区'
|
// }
|
],
|
cityOptions2: [{
|
value: 'gx',
|
label: '高新区'
|
}, {
|
value: 'hn',
|
label: '浑南区'
|
}],
|
equipChoose1: 'car',
|
equipChoose2: 'car',
|
equipOptions1: [{
|
value: 'car',
|
label: '走航车'
|
}, {
|
value: 'plan',
|
label: '无人机'
|
}],
|
equipOptions2: [{
|
value: 'car',
|
label: '走航车'
|
}, {
|
value: 'plan',
|
label: '无人机'
|
}],
|
carInput2: '', // 上传时走航车唯一标识
|
carMac: [], // 走航车mac数组
|
carInput: '', // 查询时走航车唯一标识
|
areaInput3: '', // 站点名称
|
value1: [new Date(), new Date()], // 查询时时间段
|
value2: [new Date(), new Date()], // 上传时间1
|
value3: [], // 上传时间2
|
value4: [], // 上传时间3
|
planUpTime: new Date(), // 无人机上传时间
|
pickerOptions1: {
|
shortcuts: [{
|
text: '最近一周',
|
onClick (picker) {
|
const end = new Date()
|
const start = new Date()
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
|
picker.$emit('pick', [start, end])
|
}
|
}, {
|
text: '最近一个月',
|
onClick (picker) {
|
const end = new Date()
|
const start = new Date()
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
|
picker.$emit('pick', [start, end])
|
}
|
}, {
|
text: '最近三个月',
|
onClick (picker) {
|
const end = new Date()
|
const start = new Date()
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
|
picker.$emit('pick', [start, end])
|
}
|
}]
|
},
|
pickerOptions: { // 快捷键
|
disabledDate (time) {
|
return time.getTime() > Date.now()
|
},
|
shortcuts: [{
|
text: '今天',
|
onClick (picker) {
|
picker.$emit('pick', new Date())
|
}
|
}, {
|
text: '昨天',
|
onClick (picker) {
|
const date = new Date()
|
date.setTime(date.getTime() - 3600 * 1000 * 24)
|
picker.$emit('pick', date)
|
}
|
}, {
|
text: '一周前',
|
onClick (picker) {
|
const date = new Date()
|
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
|
picker.$emit('pick', date)
|
}
|
}]
|
},
|
carMacArr: [{
|
value: 'p5dnd7a0243624',
|
label: '走航车名字'
|
}, {
|
value: 'p5dnd7a0243622',
|
label: '走航车622'
|
}, {
|
value: 'p5dnd7a0243625',
|
label: '走航车625'
|
}],
|
timeOne: '',
|
timeTwo: '',
|
timeThree: '',
|
value2Pic: {
|
onPick: ({ maxDate, minDate }) => {
|
// 最大时间 最小时间
|
this.timeOne = minDate.getTime() // 当选一个日期时 就是最小日期
|
// 如何你选择了两个日期了,就把那个变量置空
|
if (maxDate) this.timeOne = ''
|
},
|
disabledDate: time => {
|
if (this.timeOne) {
|
const WEEK = 3 * 24 * 3600 * 1000 - 1 // 这里乘以3再减去1相当于 限制3天以内
|
const minTime = this.timeOne// 三天之前
|
const maxTime = this.timeOne + WEEK // 三天之后
|
return time.getTime() < minTime || time.getTime() > maxTime || time.getTime() > new Date()
|
} else {
|
return time.getTime() > new Date()
|
}
|
}
|
},
|
value3Pic: {
|
onPick: ({ maxDate, minDate }) => {
|
// 最大时间 最小时间
|
this.timeTwo = minDate.getTime() // 当选一个日期时 就是最小日期
|
// 如何你选择了两个日期了,就把那个变量置空
|
if (maxDate) this.timeTwo = ''
|
},
|
disabledDate: time => {
|
if (this.timeTwo) {
|
const WEEK = 3 * 24 * 3600 * 1000 - 1 // 这里乘以3再减去1相当于 限制3天以内
|
const minTime = this.timeTwo// 三天之前
|
const maxTime = this.timeTwo + WEEK // 三天之后
|
return time.getTime() < minTime || time.getTime() > maxTime || time.getTime() > new Date()
|
} else {
|
return time.getTime() > new Date()
|
}
|
}
|
},
|
value4Pic: {
|
onPick: ({ maxDate, minDate }) => {
|
// 最大时间 最小时间
|
this.timeThree = minDate.getTime() // 当选一个日期时 就是最小日期
|
// 如何你选择了两个日期了,就把那个变量置空
|
if (maxDate) this.timeThree = ''
|
},
|
disabledDate: time => {
|
if (this.timeThree) {
|
const WEEK = 3 * 24 * 3600 * 1000 - 1 // 这里乘以3再减去1相当于 限制3天以内
|
const minTime = this.timeThree// 三天之前
|
const maxTime = this.timeThree + WEEK // 三天之后
|
return time.getTime() < minTime || time.getTime() > maxTime || time.getTime() > new Date()
|
} else {
|
return time.getTime() > new Date()
|
}
|
}
|
},
|
selectTime: [],
|
upTime: [],
|
fileList1: [],
|
fileList2: [],
|
fileList3: [],
|
fileList4: [],
|
fileList5: [],
|
fileList6: [],
|
fileList7: [],
|
fileList8: [],
|
fileList9: [],
|
fileLists: [[], [], [], [], [], [], [], [], []],
|
sailingReport: {
|
fileLists: [
|
[], [], [], [], [], [], [], [], []
|
],
|
index: 0,
|
fileList: []
|
},
|
openBox: false, // 是否打开弹窗
|
// tableData: []
|
tableData: [],
|
urlList: [],
|
numList: [0, 0, 0, 0, 0, 0, 0, 0, 0],
|
isDisplay: false,
|
dateTime2: 'none',
|
dateTime3: 'none',
|
isDidAdd: false, // 是否禁用加
|
isDisMinus: true, // 是否禁用减
|
planSelect: '', // 无人机查询下拉框
|
planSelect2: '', // 无人机上传选择框
|
planMac: [], // 无人机数组
|
planInput: '', // 无人机飞行区域查询
|
planInput2: '', // 无人机飞行区域上传
|
innerVisible: false, // 内部地图是否打开
|
radioSeven: 'PM2.5',
|
fileListPlan1: [],
|
fileListPlan2: [],
|
fileListPlan3: [],
|
fileListPlan4: [],
|
fileListPlan5: [],
|
fileListPlan6: [],
|
fileListPlan7: [],
|
fileListPlan8: [],
|
fileListPlan9: [],
|
fileBase64Plan1: [],
|
fileBase64Plan2: [],
|
fileBase64Plan3: [],
|
fileBase64Plan4: [],
|
fileBase64Plan5: [],
|
fileBase64Plan6: [],
|
fileBase64Plan7: [],
|
fileBase64Plan8: [],
|
fileBase64Plan9: [],
|
UAVReport: {
|
fileLists: [],
|
}, // 无人机报告
|
}
|
},
|
watch: {
|
value1 (n, o) {
|
if (n === null) {
|
this.value1 = []
|
}
|
},
|
value2 (n, o) {
|
if (n === null) {
|
this.value2 = []
|
}
|
},
|
value3 (n, o) {
|
if (n === null) {
|
this.value3 = []
|
}
|
},
|
value4 (n, o) {
|
if (n === null) {
|
this.value4 = []
|
}
|
},
|
equipChoose1 (n, o) {
|
if (n !== o) {
|
this.tableData = []
|
}
|
},
|
cityChoose (n, o) {
|
if (n !== o) {
|
this.tableData = []
|
}
|
},
|
deep: true,
|
immediate: true
|
},
|
created () {
|
// 走航车数组
|
this.$request({
|
url: 'cruiser/selectCruisers',
|
method: 'get'
|
}).then(res => {
|
this.carMac = res.data
|
this.planMac = res.data // 无人机数组,暂用走航数据
|
}).catch(err => {
|
console.log(err)
|
})
|
// 无人机数组
|
// this.$request({
|
// url: 'uav/getUavDaily',
|
// method: 'get'
|
// }).then(res => {
|
// this.planMac = res.data
|
// }).catch(err => {
|
// console.log(err)
|
// })
|
},
|
methods: {
|
handleSelectionChange (e) {
|
this.handSelectData = e.map(i => i.id)
|
console.log('this.handSelectData', this.handSelectData)
|
},
|
// 模拟下载
|
exportDom () {
|
// const url1 = `http://47.99.64.149:8081//static/img/7f633687-8321-4f89-bffc-9a52f94cfb77.jpg`
|
// const url2 = `http://47.99.64.149:8081//static/img/7f633687-8321-4f89-bffc-9a52f94cfb77.jpg`
|
// const url3 = `http://47.99.64.149:8081//static/img/7f633687-8321-4f89-bffc-9a52f94cfb77.jpg`
|
// const url4 = `http://47.99.64.149:8081//static/img/7f633687-8321-4f89-bffc-9a52f94cfb77.jpg`
|
// this.UAVReport.fileLists[1] = [url1, url2]
|
// this.UAVReport.fileLists[3] = [url3, url4, url3]
|
const baseUrl = `${requestObj.baseUrl}/static/img/`
|
var images = [['7f633687-8321-4f89-bffc-9a52f94cfb77.jpg', '7f633687-8321-4f89-bffc-9a52f94cfb77.jpg'], [], [], ['7f633687-8321-4f89-bffc-9a52f94cfb77.jpg', '7f633687-8321-4f89-bffc-9a52f94cfb77.jpg', '7f633687-8321-4f89-bffc-9a52f94cfb77.jpg'], [], [], [], []]
|
var info = 0
|
var num = 0
|
for (let i = 0; i < images.length; i++) {
|
if (!this.UAVReport.fileLists[i]) this.UAVReport.fileLists[i] = []
|
if (images[i].length) {
|
num++
|
info += images[i].length
|
if (i === 0) this.UAVReport.num1 = images[i].length
|
else if (i === 1) this.UAVReport.num2 = images[i].length
|
else if (i === 2) this.UAVReport.num3 = images[i].length
|
else if (i === 3) this.UAVReport.num4 = images[i].length
|
else if (i === 4) this.UAVReport.num5 = images[i].length
|
else if (i === 5) this.UAVReport.num6 = images[i].length
|
else if (i === 6) this.UAVReport.num7 = images[i].length
|
for (let j = 0; j < images[i].length; j++) {
|
this.UAVReport.fileLists[i].push(baseUrl + images[i][j])
|
}
|
}
|
}
|
this.UAVReport.index = info
|
this.UAVReport.num = num
|
console.log(this.UAVReport, 'this.UAVReport')
|
exportUAVImage('/UAVReport.docx', this.UAVReport, `模拟无人机报告.docx`)
|
},
|
// 查询走行车报告
|
selectExport () {
|
this.selectTime = this.newTime(this.value1)
|
if (this.cityChoose && this.equipChoose1 && this.selectTime[1]) {
|
// 判断无人机or走航车
|
var mac = ''
|
if (this.equipChoose1 === 'car') {
|
mac = this.carInput
|
} else {
|
mac = this.planSelect
|
}
|
this.$request({
|
url: '/cruiser/selectDaily',
|
method: 'get',
|
params: {
|
code: this.cityChoose,
|
type: this.equipChoose1,
|
startTime: this.selectTime[0],
|
endTime: this.selectTime[1],
|
mac: mac
|
}
|
}).then(res => {
|
this.carInput2 = this.carInput
|
var info = res.data
|
if (info.length === 0) {
|
this.$message('暂无数据')
|
this.tableData = info
|
return
|
}
|
info.map(v => {
|
var time = v.time.split('-').join('')
|
v.name = `盐城市走航监测报告${time}`
|
// if (this.cityChoose === 'gx') {
|
// v.name = `高新区走航监测报告${time}`
|
// } else {
|
// v.name = `浑南区走航监测报告${time}`
|
// }
|
})
|
info.sort((a, b) => { return b.time.split('-').join('') - a.time.split('-').join('') })
|
this.tableData = info
|
}).catch(err => {
|
console.log(err)
|
})
|
} else {
|
this.$message('参数缺失!')
|
}
|
},
|
// 上传图片
|
submitImgs () {
|
if (this.equipChoose2 === 'car') { // 上传走航车图片
|
this.tableData = []
|
this.isDisplay = true
|
this.numList = [this.fileLists[0].length, this.fileLists[1].length, this.fileLists[2].length, this.fileLists[3].length, this.fileLists[4].length, this.fileLists[5].length, this.fileLists[6].length, this.fileLists[7].length, this.fileLists[8].length]
|
var num = 0
|
this.numList.map(v => {
|
if (v > 0) {
|
num++
|
}
|
})
|
if (this.cityChoose2 && this.value2.length === 2 && this.equipChoose2 && this.carInput2 && this.areaInput3 && this.isDisplay && (num === 0 || num === this.fileLists.length)) {
|
this.upTime = this.newTime(this.value2, 'submit')
|
const formData = new FormData()
|
formData.append(`code`, this.cityChoose2)
|
formData.append(`type`, this.equipChoose2)
|
formData.append(`mac`, this.carInput2)
|
formData.append(`area`, this.areaInput3)
|
formData.append(`time1`, this.upTime[0])
|
formData.append(`time2`, this.upTime[1])
|
var upTime2 = []
|
var upTime3 = []
|
if (this.dateTime2 === 'block' && this.value3.length) { // 第二个日期时间控件
|
upTime2 = this.newTime(this.value3, 'submit')
|
formData.append(`time3`, upTime2[0])
|
formData.append(`time4`, upTime2[1])
|
}
|
if (this.dateTime3 === 'block' && this.value4.length) { // 第三个日期时间控件
|
upTime3 = this.newTime(this.value4, 'submit')
|
formData.append(`time5`, upTime3[0])
|
formData.append(`time6`, upTime3[1])
|
}
|
this.fileLists.map(v => {
|
v.map(item => {
|
formData.append(`files`, item.raw)
|
})
|
})
|
// 弹框隐藏
|
this.openBox = false
|
this.MultipartFile(formData).then(res => {
|
this.isDisplay = false
|
if (res.code === 0) {
|
this.$message({
|
message: '提交成功!',
|
type: 'success'
|
})
|
var s = new Date(res.data.time) // 标准时间转中国标准时间
|
this.value1 = [s, s]
|
this.carInput = this.carInput2
|
this.equipChoose1 = this.equipChoose2
|
this.cityChoose = this.cityChoose2
|
var reportInfo = res.data
|
if (this.cityChoose2 === 'gx') {
|
reportInfo.name = '盐城市走航监测报告' + reportInfo.time.split('-').join('')
|
} else {
|
reportInfo.name = '浑南区走航监测报告' + reportInfo.time.split('-').join('')
|
}
|
this.tableData = [reportInfo]
|
} else if (res.code === -47) {
|
this.$message(res.message)
|
} else {
|
this.$message.error('提交失败!')
|
}
|
}).catch(err => {
|
console.log(err)
|
this.isDisplay = false
|
})
|
} else {
|
this.isDisplay = false
|
this.$message('缺失参数!')
|
}
|
} else { // 上传无人机图片
|
this.UAVUpImage()
|
}
|
},
|
// 上传无人机图片
|
async UAVUpImage () {
|
var upObj = {}
|
console.log('uav上传')
|
this.tableData = []
|
this.isDisplay = true
|
if (this.cityChoose2 && this.equipChoose2 && this.planSelect2 && this.planInput2 && this.isDisplay) {
|
this.upTime = this.OneDayNew(this.planUpTime)
|
// 所有图片转base64
|
await this.UAVAllImageToBase64()
|
upObj.fileList1 = this.fileBase64Plan1
|
upObj.fileList2 = this.fileBase64Plan2
|
upObj.fileList3 = this.fileBase64Plan3
|
upObj.fileList4 = this.fileBase64Plan4
|
upObj.fileList5 = this.fileBase64Plan5
|
upObj.fileList6 = this.fileBase64Plan6
|
upObj.fileList7 = this.fileBase64Plan7
|
upObj.fileList8 = this.fileBase64Plan8
|
upObj.fileList9 = this.fileBase64Plan9
|
upObj.code = this.cityChoose2
|
upObj.type = this.equipChoose2
|
upObj.mac = this.planSelect2
|
upObj.area = this.planInput2
|
upObj.time = this.upTime
|
var objJson = JSON.stringify(upObj)
|
console.log(objJson, 'objJson')
|
// const formData = new FormData()
|
// formData.append(`objJson`, objJson)
|
// 弹框隐藏
|
this.openBox = false
|
this.$request({
|
url: 'uav/getUavDaily',
|
// data: formData,
|
data: { objJson: objJson },
|
method: 'post',
|
contentType: 'application/json'
|
}).then(res => {
|
this.isDisplay = false
|
if (res.code === 0) {
|
this.$message({
|
message: '提交成功!',
|
type: 'success'
|
})
|
// console.log(res)
|
// var s = new Date(res.data.time) // 标准时间转中国标准时间
|
// this.value1 = [s, s]
|
this.planSelect = this.planSelect2
|
this.equipChoose1 = this.equipChoose2
|
this.cityChoose = this.cityChoose2
|
var reportInfo = res.data
|
reportInfo.name = '盐城市飞行监测报告' + reportInfo.time.split('-').join('')
|
// if (this.cityChoose === 'gx') {
|
// reportInfo.name = '高新区飞行监测报告' + reportInfo.time.split('-').join('')
|
// } else {
|
// reportInfo.name = '浑南区飞行监测报告' + reportInfo.time.split('-').join('')
|
// }
|
this.tableData = [reportInfo]
|
} else if (res.code === -47) {
|
this.$message(res.message)
|
} else {
|
this.$message.error('提交失败!')
|
}
|
}).catch(err => {
|
console.log(err)
|
this.isDisplay = false
|
})
|
} else {
|
this.isDisplay = false
|
this.$message('缺失参数!')
|
}
|
},
|
// 提交文件后台接口
|
MultipartFile (data) {
|
return this.$request({
|
url: '/cruiser/getDailys',
|
method: 'post',
|
headers: { 'Content-Type': 'multipart/form-data' }, // 多文件上传这一句必须加
|
data
|
})
|
},
|
// 下载走航车报告
|
expReport (obj) {
|
this.$request({
|
url: '/cruiser/loadDaily',
|
method: 'post',
|
responseType: 'blob',
|
data: {
|
ids: this.handSelectData
|
}
|
}).then(res => {
|
this.getOutExcel('盐城市走航监测报告.docx', res)
|
// const baseUrl = `${requestObj.baseUrl}/static/img/`
|
// var imagesObj = res.data.images
|
// this.sailingReport = { ...this.sailingReport, ...res.data.code }
|
// // const url1 = `http://47.99.64.149:8081//static/img/7f633687-8321-4f89-bffc-9a52f94cfb77.jpg`
|
// if (imagesObj) {
|
// for (let i = 0; i < imagesObj.length; i++) {
|
// this.sailingReport.fileLists[i] = [{ url: baseUrl + imagesObj[i] }]
|
// }
|
// }
|
// this.sailingReport.index = imagesObj.length
|
// var data2 = obj.date.split('-')
|
// this.sailingReport.date2 = data2[0] + '年' + data2[1] + '月' + data2[2] + '日'
|
// var time = []
|
// for (let i = 0; i < res.data.code.time.length; i++) {
|
// time.push(res.data.code.time[i])
|
// }
|
// this.sailingReport.time0 = time[0]
|
// if (time.length === 2) {
|
// this.sailingReport.time1 = time[1]
|
// }
|
// if (time.length === 3) {
|
// this.sailingReport.time1 = time[1]
|
// this.sailingReport.time2 = time[2]
|
// }
|
// if (this.cityChoose === 'gx') {
|
// this.sailingReport.city = '高新区'
|
// } else {
|
// this.sailingReport.city = '浑南区'
|
// }
|
// exportDocx('/sailingReport1.docx', this.sailingReport, `${obj.name}.docx`)苏州高新区
|
// 盐城
|
// exportDocx('/yanchengReport.docx', this.sailingReport, `${obj.name}.docx`)
|
}).catch(err => {
|
console.log(err)
|
})
|
},
|
getOutExcel (fileName, res) {
|
const blob = new Blob([res], { type: 'application/msword' })
|
if (window.navigator.msSaveOrOpenBlob) {
|
// 兼容 IE & EDGE
|
navigator.msSaveBlob(blob, fileName)
|
} else {
|
var link = document.createElement('a')
|
// 兼容不同浏览器的URL对象
|
const url = window.URL || window.webkitURL || window.moxURL
|
// 创建下载链接
|
link.href = url.createObjectURL(blob)
|
// 命名下载名称
|
link.download = fileName
|
// 点击触发下载
|
link.click()
|
// 下载完成进行释放
|
url.revokeObjectURL(link.href)
|
}
|
},
|
// 下载无人机报告
|
exUAVReport (obj) {
|
this.$request({
|
url: '',
|
method: 'get',
|
params: {
|
id: obj.id
|
}
|
}).then(res => {
|
const baseUrl = `${requestObj.baseUrl}/static/img/`
|
var images = [['7f633687-8321-4f89-bffc-9a52f94cfb77.jpg', '7f633687-8321-4f89-bffc-9a52f94cfb77.jpg'], [], [], ['7f633687-8321-4f89-bffc-9a52f94cfb77.jpg', '7f633687-8321-4f89-bffc-9a52f94cfb77.jpg', '7f633687-8321-4f89-bffc-9a52f94cfb77.jpg'], [], [], [], [], [], [], [], [], [], [], [], [], []]
|
var info = 0
|
var num = 0
|
for (let i = 0; i < images.length; i++) {
|
if (!this.UAVReport.fileLists[i]) this.UAVReport.fileLists[i] = []
|
if (images[i].length) {
|
num++
|
info += images[i].length
|
if (i === 0) this.UAVReport.num1 = images[i].length
|
else if (i === 1) this.UAVReport.num2 = images[i].length
|
else if (i === 2) this.UAVReport.num3 = images[i].length
|
else if (i === 3) this.UAVReport.num4 = images[i].length
|
else if (i === 4) this.UAVReport.num5 = images[i].length
|
else if (i === 5) this.UAVReport.num6 = images[i].length
|
else if (i === 6) this.UAVReport.num7 = images[i].length
|
else if (i === 7) this.UAVReport.num8 = images[i].length
|
else if (i === 8) this.UAVReport.num9 = images[i].length
|
else if (i === 9) this.UAVReport.num10 = images[i].length
|
else if (i === 10) this.UAVReport.num11 = images[i].length
|
else if (i === 11) this.UAVReport.num12 = images[i].length
|
else if (i === 12) this.UAVReport.num13 = images[i].length
|
else if (i === 13) this.UAVReport.num14 = images[i].length
|
else if (i === 14) this.UAVReport.num15 = images[i].length
|
else if (i === 15) this.UAVReport.num16 = images[i].length
|
else if (i === 16) this.UAVReport.num17 = images[i].length
|
for (let j = 0; j < images[i].length; j++) {
|
this.UAVReport.fileLists[i].push(baseUrl + images[i][j])
|
}
|
}
|
}
|
this.UAVReport.index = info
|
this.UAVReport.num = num
|
var data2 = obj.date.split('-')
|
this.UAVReport.date2 = data2[0] + '年' + data2[1] + '月' + data2[2] + '日'
|
var time = []
|
for (let i = 0; i < res.data.code.time.length; i++) {
|
time.push(res.data.code.time[i])
|
}
|
this.UAVReport.time0 = time[0]
|
if (time.length === 2) {
|
this.UAVReport.time1 = time[1]
|
}
|
if (time.length === 3) {
|
this.UAVReport.time1 = time[1]
|
this.UAVReport.time2 = time[2]
|
}
|
if (this.cityChoose === 'gx') {
|
this.UAVReport.city = '盐城市'
|
} else {
|
this.UAVReport.city = '浑南区'
|
}
|
exportUAVImage('/UAVReport.docx', this.UAVReport, `${obj.name}.docx`)
|
}).catch(err => {
|
console.log(err)
|
})
|
},
|
// 上传按钮
|
upImgBtn () {
|
this.openBox = true
|
this.isDisplay = false
|
},
|
// 添加或删除一个时间控件
|
addDate (name) {
|
if (name === 'add') { // 加
|
if (this.dateTime2 === 'none') { // 调出dateTime2
|
this.dateTime2 = 'block'
|
this.value3 = [new Date(), new Date()]
|
this.isDisMinus = false
|
} else if (this.dateTime2 === 'block' && this.dateTime3 === 'none') { // 调出dateTime3
|
this.dateTime3 = 'block'
|
this.value4 = [new Date(), new Date()]
|
this.isDidAdd = true
|
} else { // dateTime2和dateTime3都已出现
|
this.isDidAdd = true
|
}
|
} else { // 减
|
if (this.dateTime3 === 'block') {
|
this.dateTime3 = 'none'
|
this.isDidAdd = false
|
this.value4 = []
|
} else if (this.dateTime3 === 'none' && this.dateTime2 === 'block') {
|
this.value3 = []
|
this.dateTime2 = 'none'
|
this.isDisMinus = true
|
} else { // dateTime2和dateTime3都已经隐藏
|
this.isDisMinus = true
|
this.isDidAdd = false
|
}
|
}
|
},
|
// value2改变判断是否有value3和value4
|
value2Change (e) {
|
var time2 = []
|
var time3 = []
|
var time4 = []
|
if (this.value2 !== null) {
|
if (this.value3.length && this.value4.length) { // value3和value4都存在
|
for (let i = 0; i < 2; i++) {
|
time2.push(e[i].getTime())
|
time3.push(this.value3[i].getTime())
|
time4.push(this.value4[i].getTime())
|
}
|
if (!(time2[0] > time4[1] || time2[1] < time4[0]) || !(time2[0] > time3[1] || time2[1] < time3[0])) { // 不合格
|
this.value2 = []
|
this.$message('请选择没有重叠的时间段')
|
}
|
} else if (this.value3.length) { // 只有value3存在
|
for (let i = 0; i < 2; i++) {
|
time3.push(this.value3[i].getTime())
|
time2.push(e[i].getTime())
|
}
|
if (!(time2[0] > time3[1] || time2[1] < time3[0])) { // 不合格
|
this.value2 = []
|
this.$message('请选择没有重叠的时间段')
|
}
|
} else if (this.value4.length) { // 只有value3存在
|
for (let i = 0; i < 2; i++) {
|
time4.push(this.value4[i].getTime())
|
time2.push(e[i].getTime())
|
}
|
if (!(time2[0] > time4[1] || time2[1] < time4[0])) { // 不合格
|
this.value2 = []
|
this.$message('请选择没有重叠的时间段')
|
}
|
}
|
}
|
},
|
// value3改变时判断是否在value2区间内,前提:value2存在
|
value3Change (e) {
|
if (this.value3 !== null) {
|
if (this.value2.length) {
|
var time2 = []
|
var time3 = []
|
for (let i = 0; i < 2; i++) {
|
time3.push(e[i].getTime())
|
time2.push(this.value2[i].getTime())
|
}
|
if (!(time3[0] > time2[1] || time3[1] < time2[0])) { // 不合格
|
this.value3 = []
|
this.$message('请选择没有重叠的时间段')
|
}
|
} else {
|
this.value3 = []
|
this.$message('请先选择第一段时间')
|
}
|
}
|
},
|
// value4改变时判断是否在value2和value3区间内
|
value4Change (e) {
|
if (this.value4 !== null) {
|
if (this.value2.length && this.value3.length) {
|
var time2 = []
|
var time3 = []
|
var time4 = []
|
for (let i = 0; i < 2; i++) {
|
time2.push(this.value2[i].getTime())
|
time3.push(this.value3[i].getTime())
|
time4.push(this.value4[i].getTime())
|
}
|
if (!(time4[0] > time2[1] || time4[1] < time2[0]) || !(time4[0] > time3[1] || time4[1] < time3[0])) { // 不合格
|
this.value4 = []
|
this.$message('请选择没有重叠的时间段')
|
}
|
} else {
|
this.value4 = []
|
this.$message('请先选择第一、二段时间')
|
}
|
}
|
},
|
// 时间处理函数(日期带0)
|
newTime (timeArr, name) {
|
var arr = []
|
if (name === 'submit') {
|
timeArr.map(v => {
|
var date = new Date(v)
|
var y = date.getFullYear()
|
var m = date.getMonth() + 1
|
m = m < 10 ? '0' + m : m
|
var d = date.getDate()
|
d = d < 10 ? '0' + d : d
|
var h = date.getHours()
|
h = h < 10 ? '0' + h : h
|
var minute = date.getMinutes()
|
minute = minute < 10 ? '0' + minute : minute
|
var s = date.getSeconds()
|
s = s < 10 ? '0' + s : s
|
arr.push(y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + s)
|
})
|
return arr
|
} else {
|
timeArr.map(v => {
|
var date = new Date(v)
|
var y = date.getFullYear()
|
var m = date.getMonth() + 1
|
m = m < 10 ? '0' + m : m
|
var d = date.getDate()
|
d = d < 10 ? '0' + d : d
|
arr.push(y + '-' + m + '-' + d)
|
})
|
return arr
|
}
|
},
|
// 时间处理函数,日期是单个
|
OneDayNew (time) {
|
var date = new Date(time)
|
var y = date.getFullYear()
|
var m = date.getMonth() + 1
|
m = m < 10 ? '0' + m : m
|
var d = date.getDate()
|
d = d < 10 ? '0' + d : d
|
return y + '-' + m + '-' + d
|
},
|
// 无人机所有图片转base64
|
async UAVAllImageToBase64 () {
|
if (this.fileListPlan1.length > 0) {
|
for (let i = 0; i < this.fileListPlan1.length; i++) {
|
var p = this.getBase64(this.fileListPlan1[i].raw)
|
await p.then(res => {
|
this.fileBase64Plan1[i] = res
|
})
|
}
|
// this.fileListPlan1 = fileListPlan1
|
}
|
if (this.fileListPlan2.length > 0) {
|
for (let i = 0; i < this.fileListPlan2.length; i++) {
|
var p = this.getBase64(this.fileListPlan2[i].raw)
|
await p.then(res => {
|
this.fileBase64Plan2[i] = res
|
})
|
}
|
}
|
if (this.fileListPlan3.length > 0) {
|
for (let i = 0; i < this.fileListPlan3.length; i++) {
|
var p = this.getBase64(this.fileListPlan3[i].raw)
|
await p.then(res => {
|
this.fileBase64Plan3[i] = res
|
})
|
}
|
}
|
if (this.fileListPlan4.length > 0) {
|
for (let i = 0; i < this.fileListPlan4.length; i++) {
|
var p = this.getBase64(this.fileListPlan4[i].raw)
|
await p.then(res => {
|
this.fileBase64Plan4[i] = res
|
})
|
}
|
}
|
if (this.fileListPlan5.length > 0) {
|
for (let i = 0; i < this.fileListPlan5.length; i++) {
|
var p = this.getBase64(this.fileListPlan5[i].raw)
|
await p.then(res => {
|
this.fileBase64Plan5[i] = res
|
})
|
}
|
}
|
if (this.fileListPlan6.length > 0) {
|
for (let i = 0; i < this.fileListPlan6.length; i++) {
|
var p = this.getBase64(this.fileListPlan6[i].raw)
|
await p.then(res => {
|
this.fileBase64Plan6[i] = res
|
})
|
}
|
}
|
if (this.fileListPlan7.length > 0) {
|
for (let i = 0; i < this.fileListPlan7.length; i++) {
|
var p = this.getBase64(this.fileListPlan7[i].raw)
|
await p.then(res => {
|
this.fileBase64Plan7[i] = res
|
})
|
}
|
}
|
if (this.fileListPlan8.length > 0) {
|
for (let i = 0; i < this.fileListPlan8.length; i++) {
|
var p = this.getBase64(this.fileListPlan8[i].raw)
|
await p.then(res => {
|
this.fileBase64Plan8[i] = res
|
})
|
}
|
}
|
if (this.fileListPlan9.length > 0) {
|
for (let i = 0; i < this.fileListPlan9.length; i++) {
|
var p = this.getBase64(this.fileListPlan9[i].raw)
|
await p.then(res => {
|
this.fileBase64Plan9[i] = res
|
})
|
}
|
}
|
},
|
// 图片转base64函数
|
getBase64 (file) {
|
// console.log(file)
|
return new Promise(function (resolve, reject) {
|
var reader = new FileReader()
|
let imgResult = ''
|
reader.readAsDataURL(file)
|
reader.onload = function () {
|
imgResult = reader.result
|
}
|
reader.onerror = function (error) {
|
reject(error)
|
}
|
reader.onloadend = function () {
|
resolve(imgResult)
|
}
|
})
|
},
|
// 无人机图片上传
|
handleChangePlan1 (file, fileList) {
|
// console.log(file, fileList)
|
if (file.raw.type !== 'image/jpeg' && file.raw.type !== 'image/png') {
|
this.$refs.uploadPlan1.handleRemove(file)
|
this.$message.warning(`上传文件格式不符合`)
|
return
|
}
|
this.fileListPlan1 = fileList
|
},
|
handleRemovePlan1 (file, fileList) {
|
this.fileListPlan1 = fileList
|
},
|
handleChangePlan2 (file, fileList) {
|
if (file.raw.type !== 'image/jpeg' && file.raw.type !== 'image/png') {
|
this.$refs.uploadPlan1.handleRemove(file)
|
this.$message.warning(`上传文件格式不符合`)
|
return
|
}
|
this.fileListPlan2 = fileList
|
},
|
handleRemovePlan2 (file, fileList) {
|
this.fileListPlan2 = fileList
|
},
|
handleChangePlan3 (file, fileList) {
|
if (file.raw.type !== 'image/jpeg' && file.raw.type !== 'image/png') {
|
this.$refs.uploadPlan1.handleRemove(file)
|
this.$message.warning(`上传文件格式不符合`)
|
return
|
}
|
this.fileListPlan3 = fileList
|
},
|
handleRemovePlan3 (file, fileList) {
|
this.fileListPlan3 = fileList
|
},
|
handleChangePlan4 (file, fileList) {
|
if (file.raw.type !== 'image/jpeg' && file.raw.type !== 'image/png') {
|
this.$refs.uploadPlan1.handleRemove(file)
|
this.$message.warning(`上传文件格式不符合`)
|
return
|
}
|
this.fileListPlan4 = fileList
|
},
|
handleRemovePlan4 (file, fileList) {
|
this.fileListPlan4 = fileList
|
},
|
handleChangePlan5 (file, fileList) {
|
if (file.raw.type !== 'image/jpeg' && file.raw.type !== 'image/png') {
|
this.$refs.uploadPlan1.handleRemove(file)
|
this.$message.warning(`上传文件格式不符合`)
|
return
|
}
|
this.fileListPlan5 = fileList
|
},
|
handleRemovePlan5 (file, fileList) {
|
this.fileListPlan5 = fileList
|
},
|
handleChangePlan6 (file, fileList) {
|
if (file.raw.type !== 'image/jpeg' && file.raw.type !== 'image/png') {
|
this.$refs.uploadPlan1.handleRemove(file)
|
this.$message.warning(`上传文件格式不符合`)
|
return
|
}
|
this.fileListPlan6 = fileList
|
},
|
handleRemovePlan6 (file, fileList) {
|
this.fileListPlan6 = fileList
|
},
|
handleChangePlan7 (file, fileList) {
|
if (file.raw.type !== 'image/jpeg' && file.raw.type !== 'image/png') {
|
this.$refs.uploadPlan1.handleRemove(file)
|
this.$message.warning(`上传文件格式不符合`)
|
return
|
}
|
this.fileListPlan7 = fileList
|
},
|
handleRemovePlan7 (file, fileList) {
|
this.fileListPlan7 = fileList
|
},
|
handleChangePlan8 (file, fileList) {
|
if (file.raw.type !== 'image/jpeg' && file.raw.type !== 'image/png') {
|
this.$refs.uploadPlan1.handleRemove(file)
|
this.$message.warning(`上传文件格式不符合`)
|
return
|
}
|
this.fileListPlan8 = fileList
|
},
|
handleRemovePlan8 (file, fileList) {
|
this.fileListPlan8 = fileList
|
},
|
handleChangePlan9 (file, fileList) {
|
if (file.raw.type !== 'image/jpeg' && file.raw.type !== 'image/png') {
|
this.$refs.uploadPlan1.handleRemove(file)
|
this.$message.warning(`上传文件格式不符合`)
|
return
|
}
|
this.fileListPlan9 = fileList
|
},
|
handleRemovePlan9 (file, fileList) {
|
this.fileListPlan9 = fileList
|
},
|
// 限制一天
|
handleExceed (files, fileList) {
|
this.$message.warning(`当前限制选择 1 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`)
|
},
|
// 走航车上传文件到upload
|
handleChange1 (file, fileList) {
|
this.fileList1 = fileList
|
this.fileLists[0] = fileList
|
},
|
handleRemove1 (file, fileList) {
|
this.fileList1 = fileList
|
this.fileLists[0] = fileList
|
},
|
handleChange2 (file, fileList) {
|
this.fileList2 = fileList
|
this.fileLists[1] = fileList
|
},
|
handleRemove2 (file, fileList) {
|
this.fileList2 = fileList
|
this.fileLists[1] = fileList
|
},
|
handleChange3 (file, fileList) {
|
this.fileList3 = fileList
|
this.fileLists[2] = fileList
|
},
|
handleRemove3 (file, fileList) {
|
this.fileList3 = fileList
|
this.fileLists[2] = fileList
|
},
|
handleChange4 (file, fileList) {
|
this.fileList4 = fileList
|
this.fileLists[3] = fileList
|
},
|
handleRemove4 (file, fileList) {
|
this.fileList4 = fileList
|
this.fileLists[3] = fileList
|
},
|
handleChange5 (file, fileList) {
|
this.fileList5 = fileList
|
this.fileLists[4] = fileList
|
},
|
handleRemove5 (file, fileList) {
|
this.fileList5 = fileList
|
this.fileLists[4] = fileList
|
},
|
handleChange6 (file, fileList) {
|
this.fileList6 = fileList
|
this.fileLists[5] = fileList
|
},
|
handleRemove6 (file, fileList) {
|
this.fileList6 = fileList
|
this.fileLists[5] = fileList
|
},
|
handleChange7 (file, fileList) {
|
this.fileList7 = fileList
|
this.fileLists[6] = fileList
|
},
|
handleRemove7 (file, fileList) {
|
this.fileList7 = fileList
|
this.fileLists[6] = fileList
|
},
|
handleChange8 (file, fileList) {
|
this.fileList8 = fileList
|
this.fileLists[7] = fileList
|
},
|
handleRemove8 (file, fileList) {
|
this.fileList8 = fileList
|
this.fileLists[7] = fileList
|
},
|
handleChange9 (file, fileList) {
|
this.fileList9 = fileList
|
this.fileLists[8] = fileList
|
},
|
handleRemove9 (file, fileList) {
|
this.fileList9 = fileList
|
this.fileLists[8] = fileList
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
.dailyreport{
|
width: 100%;
|
height: 100%;
|
overflow: auto;
|
}
|
.dailyreport::-webkit-scrollbar{
|
width: 0;
|
}
|
.dailyTop{
|
width: 80%;
|
margin:auto;
|
padding: 1%;
|
margin-bottom: 3%;
|
}
|
.dailyDown{
|
width: 100%;
|
height: 74%;
|
overflow: auto;
|
display: flex;
|
/*background-color: salmon;*/
|
justify-content: center;
|
}
|
.boxCard{
|
width: 80%;
|
height: 96%;
|
overflow: auto;
|
}
|
.upload-demo{
|
/*width: 20rem;*/
|
/*height: 16rem;*/
|
width: 260px;
|
height: 155px;
|
/*float: left;*/
|
/*margin: 1% 2%;*/
|
/*overflow: auto;*/
|
}
|
.upload-demo p{
|
padding: 0.15rem 0;
|
margin: 0;
|
}
|
.dailyTop>div{
|
margin-right: 1%;
|
}
|
/*/deep/ .el-upload{*/
|
/* width: 100%;*/
|
/*}*/
|
/*/deep/ .el-upload-dragger{*/
|
/* width: 100%;*/
|
/* height: 140px;*/
|
/*}*/
|
/deep/ .el-upload-list{
|
height: 94px;
|
overflow: auto;
|
}
|
/deep/ .el-upload-list::-webkit-scrollbar{
|
width: 4px;
|
background-color: #FFFFFF;
|
}
|
/*定义滑块 样式*/
|
|
/deep/ .el-upload-list::-webkit-scrollbar-thumb {
|
border-radius: 3px;
|
background-color: #ccc;
|
}
|
.el-upload-dragger .el-icon-upload{
|
font-size: 50px;
|
margin: 10px 0;
|
line-height: 1;
|
}
|
.btnPosition{
|
position: absolute;
|
right: 12px;
|
bottom: 5px;
|
}
|
.btnPosition{
|
padding: 8px 16px;
|
}
|
.divPosition{
|
position: relative;
|
margin: 1%;
|
padding: 1%;
|
float: left;
|
border: 1px solid #dfdfdf;
|
}
|
.dailyBox{
|
width: 90%;
|
height: 100%;
|
margin: auto;
|
}
|
/deep/ .el-dialog{
|
width: 60%;
|
height: 80%;
|
overflow: auto;
|
}
|
.el-upload__tip{
|
color: red;
|
}
|
/deep/ .el-dialog__footer{
|
padding: 10px 40px 20px;
|
}
|
/deep/ .el-dialog__body{
|
padding-top: 0px;
|
}
|
.openTop{
|
padding-bottom: 15px;
|
}
|
.openTop>div{
|
margin-right: 15px;
|
margin-bottom: 15px;
|
}
|
.dateTimeBox>div{
|
margin-bottom: 10px;
|
}
|
.innerDialog /deep/ .el-dialog__body{
|
height: 90%;
|
}
|
</style>
|