| | |
| | | <div class="search-box-test"> |
| | | <el-form :model="searchForm" inline> |
| | | <div class="search-first"> |
| | | <el-form-item label="行政区划:"> |
| | | <el-tree-select |
| | | <el-form-item label="行政区划:" > |
| | | <el-tree-select |
| | | :disabled="viewDetailsDisabled" |
| | | popper-class="custom-tree-select" |
| | | v-model="searchForm.areaCode" |
| | | :data="deptTreeData" |
| | |
| | | </el-form-item> |
| | | <el-form-item label="所属机巢:"> |
| | | <el-select |
| | | :disabled="viewDetailsDisabled" |
| | | :teleported="false" |
| | | v-model="searchForm.deviceSn" |
| | | placeholder="请选择" |
| | | clearable |
| | | @change="handleSearch" |
| | | > |
| | | <el-option |
| | | v-for="item in machineData" |
| | |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="任务名称:"> |
| | | <el-input v-model="searchForm.jobName" placeholder="请输入" clearable /> |
| | | <el-input :disabled="viewDetailsDisabled" v-model="searchForm.jobName" placeholder="请输入" clearable /> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-date-picker |
| | | :disabled="viewDetailsDisabled" |
| | | popper-class="custom-date-picker" |
| | | v-model="dateRange" |
| | | type="daterange" |
| | | :clearable="false" |
| | | :clearable="true" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | |
| | | </el-form-item> |
| | | <el-form-item label="文件格式:"> |
| | | <el-select |
| | | :disabled="foldersDisabled || viewDetailsDisabled" |
| | | :teleported="false" |
| | | v-model="searchForm.resultType" |
| | | placeholder="请选择" |
| | | clearable |
| | | @change="handleSearch" |
| | | > |
| | | <el-option |
| | | v-for="item in fileFormatOption" |
| | |
| | | </el-form-item> |
| | | <el-form-item label="文件类别:"> |
| | | <el-select |
| | | :disabled="disabled" |
| | | |
| | | :disabled="disabled || foldersDisabled || viewDetailsDisabled" |
| | | :teleported="false" |
| | | v-model="searchForm.photoType" |
| | | placeholder="请选择" |
| | | clearable |
| | | @clear="changePhotoType" |
| | | @change="handleSearch" |
| | | > |
| | | <el-option |
| | | v-for="item in CategoryOption" |
| | |
| | | </div> |
| | | <div class="search-first"> |
| | | <el-form-item label="文件名称:"> |
| | | <el-input v-model="searchForm.name" placeholder="请输入" clearable /> |
| | | <el-input :disabled="foldersDisabled || viewDetailsDisabled" v-model="searchForm.name" placeholder="请输入" clearable /> |
| | | </el-form-item> |
| | | <div class="search-btn"> |
| | | <el-button type="primary" icon="el-icon-search" @click="handleSearch">搜索</el-button> |
| | | <el-button icon="el-icon-refresh" @click="handleReset">清空</el-button> |
| | | <el-button type="primary" icon="el-icon-search" @click="handleSearch">搜索</el-button> |
| | | <el-button icon="el-icon-refresh" @click="handleReset">清空</el-button> |
| | | </div> |
| | | </div> |
| | | <div class="search-first"> |
| | | <div class="search-btn"> |
| | | <el-button type="primary" icon="el-icon-download" @click="allDownloadFun" |
| | | >全部下载</el-button |
| | | > |
| | | <el-button type="success" plain icon="el-icon-download" @click="downloadFun" |
| | | >下载</el-button |
| | | > |
| | | <!-- <el-button type="primary" icon="el-icon-download" @click="allDownloadFun"--> |
| | | <!-- >全部下载</el-button--> |
| | | <!-- >--> |
| | | <el-button v-if="!viewDetailsDisabled" type="primary" plain @click="handleswitchFolders" ><el-icon><FolderOpened /></el-icon></el-button> |
| | | <div class="downloadBtn" @click="htsjzx === 100 && downloadFun()"> |
| | | <el-progress v-if="htsjzx !== 100" :percentage="htsjzx" :show-text="false" striped striped-flow :duration="1" /> |
| | | <div class="downloadBtnText"> |
| | | <span v-if="htsjzx === 100">下载</span> |
| | | <template v-else> |
| | | 处理中<el-icon @click="cancelDownload"><CircleClose /></el-icon> |
| | | </template> |
| | | </div> |
| | | </div> |
| | | <el-button v-if="viewDetailsDisabled" type="primary" plain @click="handleBack" >返回</el-button> |
| | | </div> |
| | | </div> |
| | | </el-form> |
| | |
| | | import { useStore } from 'vuex'; |
| | | import { getRegionTreeAll, getDeviceRegion, deptsByAreaCode } from '@/api/job/task'; |
| | | import { watch } from 'vue'; |
| | | import { cancelDownloadApi, getDownloadStatusApi } from '@/api/dataCenter/dataCenter'; |
| | | import EventBus from '@/utils/eventBus'; |
| | | const store = useStore(); |
| | | const userAreaCode = computed(() => store.getters.userInfo.detail.areaCode); |
| | | const selectedAreaCode = computed(() => store.state.user.selectedAreaCode); |
| | | const emit = defineEmits(['search', 'downFun', 'allDownFun']); |
| | | const htsjzx = computed(() => store.state.common.downloadProgress?.htsjzx || 100) |
| | | const emit = defineEmits(['search', 'Reset','downFun', 'allDownFun','handleswitchFolders','handleBack']); |
| | | const startTime = dayjs().subtract(6, 'day').startOf('day'); |
| | | const endTime = dayjs().endOf('day'); |
| | | const timeRange = [startTime.format('YYYY-MM-DD HH:mm:ss'), endTime.format('YYYY-MM-DD HH:mm:ss')]; |
| | | const dateRange = ref(timeRange); |
| | | const timeFormat = 'YYYY-MM-DD HH:mm:ss'; |
| | | const props = defineProps(['searchjobId','switchFolders','viewDetails']) |
| | | const searchForm = reactive({ |
| | | jobName: '', //任务名称 |
| | | name: '', //文件名称 |
| | |
| | | deviceSn: '', // 所属机巢 |
| | | resultType: '', //文件格式 |
| | | photoType: '', //文件类别 |
| | | wayLineJobId:'' |
| | | }); |
| | | const disabled = ref(false); |
| | | const treeProps = { |
| | |
| | | { |
| | | value: '5', |
| | | label: '全景', |
| | | |
| | | |
| | | }, |
| | | { |
| | | value: '4', |
| | |
| | | }, |
| | | { deep: true } |
| | | ); |
| | | watch(() => props.searchjobId, (newVal) => { |
| | | searchForm.wayLineJobId = newVal; |
| | | handleSearch() |
| | | }); |
| | | const foldersDisabled = ref(false) |
| | | watch(() => props.switchFolders, (newVal) => { |
| | | if(newVal === true){ |
| | | foldersDisabled.value = true |
| | | }else{ |
| | | foldersDisabled.value = false |
| | | } |
| | | }); |
| | | const viewDetailsDisabled = ref(false) |
| | | watch(() => props.viewDetails, (newVal) => { |
| | | if(newVal === true){ |
| | | viewDetailsDisabled.value = true |
| | | }else{ |
| | | viewDetailsDisabled.value = false |
| | | } |
| | | }); |
| | | const changePhotoType =(val)=>{ |
| | | if(val === undefined){ |
| | | searchForm.photoType = '' |
| | |
| | | // 更新搜索表单中的时间 |
| | | searchForm.startTime = start.format(timeFormat); |
| | | searchForm.endTime = end.format(timeFormat); |
| | | handleSearch() |
| | | } |
| | | |
| | | }; |
| | | // 部门下得机巢 |
| | | const requestDockInfo = () => { |
| | | getRegionTreeAll({ parentCode: userAreaCode.value }).then(res => { |
| | | deptTreeData.value = res.data.data ? [res.data.data] : []; |
| | | |
| | | handleNodeClick({ id: userAreaCode.value }); |
| | | }); |
| | | }; |
| | |
| | | // 处理机巢数据 |
| | | searchForm.deviceSn = ''; |
| | | machineData.value = ''; |
| | | |
| | | const droneList = await getDeviceRegion({ areaCode: data.id }); |
| | | |
| | | machineData.value = droneList?.data?.data; |
| | | |
| | | // 默认选中值 |
| | | if (signDevice_sn.value) { |
| | | searchForm.deviceSn = signDevice_sn.value; |
| | | } |
| | | // 所属部门重新请求值 |
| | | |
| | | deptData.value = []; |
| | | getDeptsByAreaCode(); |
| | | handleSearch(); |
| | | |
| | | }; |
| | | // 所属部门信息 |
| | | const getDeptsByAreaCode = () => { |
| | |
| | | searchForm.deviceSn = ''; |
| | | searchForm.resultType = ''; |
| | | searchForm.photoType = ''; |
| | | searchForm.wayLineJobId='' |
| | | handleNodeClick({ id: userAreaCode.value }); |
| | | handleSearch(); |
| | | emit('Reset', searchForm); |
| | | }; |
| | | // 下载 |
| | | const downloadFun = () => { |
| | |
| | | const allDownloadFun = () => { |
| | | emit('allDownFun'); |
| | | }; |
| | | |
| | | function cancelDownload() { |
| | | cancelDownloadApi({ type:'htsjzx' }).then(res =>{ |
| | | ElMessage.success('取消成功') |
| | | }) |
| | | } |
| | | // 切换文件夹 |
| | | const handleswitchFolders =()=>{ |
| | | emit('handleswitchFolders'); |
| | | } |
| | | // 返回按钮 |
| | | const handleBack = ()=>{ |
| | | emit('handleBack'); |
| | | } |
| | | onMounted(() => { |
| | | requestDockInfo(); |
| | | getDownloadStatusApi({type: 'htsjzx'}).then(res =>{ |
| | | if (!['CANCELLED','COMPLETED'].includes(res.data.data?.status || 'COMPLETED')){ |
| | | EventBus.emit('useDownloadWs-messageHandler',res.data.data) |
| | | } |
| | | }) |
| | | }); |
| | | |
| | | defineExpose({ |
| | | handleReset, |
| | | }); |
| | | </script> |
| | | |
| | |
| | | justify-content: space-between; |
| | | |
| | | .search-btn { |
| | | display: flex; |
| | | align-items: center; |
| | | margin-right: 32px; |
| | | |
| | | .downloadBtn{ |
| | | margin:0 10px; |
| | | position: relative; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | height: 28px; |
| | | padding: 0 15px; |
| | | background: rgb(239.8,248.9,235.3); |
| | | border-radius: 4px 4px 4px 4px; |
| | | border: 1px solid rgb(179,224.5,156.5); |
| | | cursor: pointer; |
| | | color: #67c23a; |
| | | font-size: 14px; |
| | | |
| | | .downloadBtnText{ |
| | | display: flex; |
| | | align-items: center; |
| | | gap: 5px; |
| | | z-index: 5; |
| | | } |
| | | .el-progress{ |
| | | height: 100%; |
| | | position: absolute; |
| | | left: 0; |
| | | top: 0; |
| | | width: 100%; |
| | | |
| | | :deep(){ |
| | | .el-progress-bar__outer{ |
| | | height: 26px !important; |
| | | border-radius: 0 !important; |
| | | background: transparent !important; |
| | | |
| | | .el-progress-bar__inner{ |
| | | border-radius: 0 !important; |
| | | background-color: #e5ffd9; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | } |
| | | |
| | | } |
| | | .time-card { |
| | | text-align: center; |