This commit is contained in:
glj 2023-05-22 09:13:06 +08:00
commit b0911036df
7 changed files with 226 additions and 213 deletions

View File

@ -24,6 +24,7 @@
"leaflet-control-geocoder": "^2.4.0",
"leaflet-draw": "^1.0.4",
"leaflet-imageoverlay-rotated": "^0.2.1",
"leaflet-search": "^2.9.6",
"mitt": "^3.0.0",
"nprogress": "^0.2.0",
"pinia": "^2.0.33",

View File

@ -1,4 +1,4 @@
import request, { crawlModule, moduleName } from '/@/utils/request';
import request, { crawlModule, moduleName,twitterModule } from '/@/utils/request';
export const geoserve = (vordm_id, link, disaster_id, name) => {
return request({
@ -24,6 +24,15 @@ export const news = (disaster_id, keywords, page, isBaidu, id) => {
},
});
};
export const twitter = (disaster_id, keys,stime,etime) => {
return request({
url: '/api/' + twitterModule + 'socialmedia/twitter',
method: 'post',
data: {
disaster_id, keys,stime,etime
},
});
};
export const rs = (stime, etime, disaster_id, ranges, type = 1,id) => {
let method = 'sentinel';
if (type == 1) {
@ -50,6 +59,22 @@ export const rs = (stime, etime, disaster_id, ranges, type = 1,id) => {
data: data,
});
};
export const rs2 = (disaster_id ,arr,stime,etime) => {
let data = {
stime,
etime,
disaster_id,
arr
}
return request({
url: '/api1/' + crawlModule + '/RS',
method: 'post',
data: data,
});
};
export const submit = (row) => {
return request({
url: '/api/' + moduleName + '/ui/crawlInfo/submit',

View File

@ -49,13 +49,13 @@ onMounted(() => {
featureLayerG_area = L.layerGroup().addTo(homeMap)
featureLayerG_point = L.layerGroup().addTo(homeMap)
// 'http://t0.tianditu.com/img_c/wmts?layer=img&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk='
// const CIA_C = "http://t0.tianditu.com/cia_c/wmts?layer=cia&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk=";
// const nameLayer = L.tileLayer(CIA_C + TK_KEY, {
// maxZoom: 20,
// tileSize: 256,
// zoomOffset: 1
// }).addTo(homeMap);
'http://t0.tianditu.com/img_c/wmts?layer=img&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk='
const CIA_C = "http://t0.tianditu.com/cia_c/wmts?layer=cia&style=default&tilematrixset=c&Service=WMTS&Request=GetTile&Version=1.0.0&Format=tiles&TileMatrix={z}&TileCol={x}&TileRow={y}&tk=";
const nameLayer = L.tileLayer(CIA_C + TK_KEY, {
maxZoom: 20,
tileSize: 256,
zoomOffset: 1
}).addTo(homeMap);
// Geocoding
const geocoder = L.Control.geocoder({

View File

@ -5,6 +5,7 @@ import { Session } from '/@/utils/storage';
export const moduleName = 'biz-vordm';
export const crawlModule = 'vordm-crawl';
export const twitterModule = "vordm-twitter";
const service = axios.create({
//baseURL: import.meta.env.VITE_API_URL,
timeout: 50000,

View File

@ -43,8 +43,7 @@
</svg>
</el-icon>
<span v-if="!state.baiduOption.buttonIs" style="height: 40; line-height: 40px;">{{
state.baiduOption.runTitle }}</span>
<span v-if="!state.baiduOption.buttonIs" style="height: 40; line-height: 40px;">{{state.baiduOption.runTitle }}</span>
</el-col>
</el-row>
<el-row>
@ -73,7 +72,7 @@
</svg>
</el-icon>
<el-icon :size="40" style="cursor:pointer ;" title="Data collection in progress, please wait……"
color="#131313" v-if="state.buttonIs && state.bing.status == 1">
color="#131313" v-if="state.bingOption.buttonIs && state.bing.status == 1">
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ea893728="">
<path fill="currentColor"
d="M512 64a32 32 0 0 1 32 32v192a32 32 0 0 1-64 0V96a32 32 0 0 1 32-32zm0 640a32 32 0 0 1 32 32v192a32 32 0 1 1-64 0V736a32 32 0 0 1 32-32zm448-192a32 32 0 0 1-32 32H736a32 32 0 1 1 0-64h192a32 32 0 0 1 32 32zm-640 0a32 32 0 0 1-32 32H96a32 32 0 0 1 0-64h192a32 32 0 0 1 32 32zM195.2 195.2a32 32 0 0 1 45.248 0L376.32 331.008a32 32 0 0 1-45.248 45.248L195.2 240.448a32 32 0 0 1 0-45.248zm452.544 452.544a32 32 0 0 1 45.248 0L828.8 783.552a32 32 0 0 1-45.248 45.248L647.744 692.992a32 32 0 0 1 0-45.248zM828.8 195.264a32 32 0 0 1 0 45.184L692.992 376.32a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0zm-452.544 452.48a32 32 0 0 1 0 45.248L240.448 828.8a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0z">
@ -89,10 +88,68 @@
</svg>
</el-icon>
<span v-if="!state.bingOption.buttonIs" style="height: 40; line-height: 40px;">{{ state.bingOption.runTitle
}}</span>
<span v-if="!state.bingOption.buttonIs" style="height: 40; line-height: 40px;">{{ state.bingOption.runTitle}}</span>
</el-col>
</el-row>
<el-row>
<el-col :span="3" style="text-align:center ;">
<el-image style="height:40px ; width:100px!" src="/bing.webp"></el-image>
</el-col>
<el-col :span="6">
<el-form-item label="Confirm keywords" style="text-align:center ;">
<el-input v-model="state.twitter.keywords"></el-input>
</el-form-item>
</el-col>
<el-col :span="9">
<el-form-item label="time" style="text-align:center; margin-left: 10px;">
<el-date-picker
v-model="state.twitter.date"
type="daterange"
unlink-panels
range-separator="To"
start-placeholder="Start date"
end-placeholder="End date"
value-format="YYYY-MM-DD"
format="YYYY-MM-DD"
/>
</el-form-item>
</el-col>
<el-col :span="3" style="text-align:center ;">
<el-icon :size="40" style="cursor:pointer ;" :title="state.twitter.status == 0 ? 'Waiting in queue……' : 'start'"
:color="state.twitter.status == 0 ? '#4f4' : 'blue'"
@click="state.twitter.status == 0 ? confirmBox('twitter') : start('twitter')"
v-if="state.twitterOption.buttonIs && (state.twitter.status == 0 || !state.twitter.status)">
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ea893728="">
<path fill="currentColor"
d="m249.6 417.088 319.744 43.072 39.168 310.272L845.12 178.88 249.6 417.088zm-129.024 47.168a32 32 0 0 1-7.68-61.44l777.792-311.04a32 32 0 0 1 41.6 41.6l-310.336 775.68a32 32 0 0 1-61.44-7.808L512 516.992l-391.424-52.736z">
</path>
</svg>
</el-icon>
<el-icon :size="40" style="cursor:pointer ;" title="Data collection in progress, please wait……"
color="#131313" v-if="state.twitterOption.buttonIs && state.twitter.status == 1">
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ea893728="">
<path fill="currentColor"
d="M512 64a32 32 0 0 1 32 32v192a32 32 0 0 1-64 0V96a32 32 0 0 1 32-32zm0 640a32 32 0 0 1 32 32v192a32 32 0 1 1-64 0V736a32 32 0 0 1 32-32zm448-192a32 32 0 0 1-32 32H736a32 32 0 1 1 0-64h192a32 32 0 0 1 32 32zm-640 0a32 32 0 0 1-32 32H96a32 32 0 0 1 0-64h192a32 32 0 0 1 32 32zM195.2 195.2a32 32 0 0 1 45.248 0L376.32 331.008a32 32 0 0 1-45.248 45.248L195.2 240.448a32 32 0 0 1 0-45.248zm452.544 452.544a32 32 0 0 1 45.248 0L828.8 783.552a32 32 0 0 1-45.248 45.248L647.744 692.992a32 32 0 0 1 0-45.248zM828.8 195.264a32 32 0 0 1 0 45.184L692.992 376.32a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0zm-452.544 452.48a32 32 0 0 1 0 45.248L240.448 828.8a32 32 0 0 1-45.248-45.248l135.808-135.808a32 32 0 0 1 45.248 0z">
</path>
</svg>
</el-icon>
<el-icon :size="40" style="cursor:pointer ;" title="once more start" color="#4f4" @click="start('bing')"
v-if="state.twitter.buttonIs && state.twitter.status == 2">
<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ea893728="">
<path fill="currentColor"
d="M406.656 706.944 195.84 496.256a32 32 0 1 0-45.248 45.248l256 256 512-512a32 32 0 0 0-45.248-45.248L406.592 706.944z">
</path>
</svg>
</el-icon>
<span v-if="!state.twitterOption.buttonIs" style="height: 40; line-height: 40px;">{{ state.twitterOption.runTitle}}</span>
</el-col>
</el-row>
<template #footer>
<span class="dialog-footer">
<el-button @click="state.isShowDialog = false" size="default">close</el-button>
@ -120,6 +177,11 @@ const state = reactive({
page: 10,
disaster_id: undefined
},
twitter:{
keywords: "",
page: 10,
disaster_id: undefined
},
baiduOption: {
buttonIs: true,
runTitle: ""
@ -127,7 +189,12 @@ const state = reactive({
bingOption: {
buttonIs: true,
runTitle: ""
}
},
twitterOption: {
buttonIs: true,
runTitle: ""
},
})
const confirmBox = (text) => {
@ -157,11 +224,14 @@ const confirmBox = (text) => {
const openDialog = (row) => {
state.baidu = {};
state.bing = {};
state.twitter={};
state.data = row;
state.baidu.keywords = row.disasterKeyword;
state.baidu.disaster_id = row.disasterId
state.bing.keywords = row.disasterKeyword;
state.bing.disaster_id = row.disasterId
state.twitter.keywords = row.disasterKeyword;
state.twitter.disaster_id = row.disasterId
getDate();
state.isShowDialog = true;
}
@ -176,54 +246,79 @@ const getDate = () => {
if (element.type == 1) {
state.bing = element;
}
if(element.type == 3){
state.twitter = element
}
}
state.baidu.page = 10;
state.bing.page = 10;
state.twitter.page = 10;
})
}
const start = (text) => {
if(text == 'twitter'){
if(!state.twitter.date|| state.twitter.date.length<2){
ElMessage.error("Please select a data crawling time range!")
return
}
}
state.baiduOption.runTitle = "start(5s)";
let count = 4;
const countdown = setInterval(function () {
if (text == 'baidu') {
state.baiduOption.runTitle = "start(" + count + "s)";
} else {
} else if(text == 'bing') {
state.bingOption.runTitle = "start(" + count + "s)";
} else if(text == 'twitter'){
state.twitterOption.runTitle = "start(" + count + "s)";
}
count -= 1;
if (count < 0) {
if (text == 'baidu') {
state.baiduOption.buttonIs = true;
} else {
} else if(text == 'bing') {
state.bingOption.buttonIs = true;
} if(text == 'twitter'){
state.twitterOption.buttonIs = true;
}
clearInterval(countdown);
console.log('倒计时结束');
}
}, 1000);
let keywords = (text == 'baidu' ? state.baidu.keywords : state.bing.keywords);
let page = (text == 'baidu' ? state.baidu.page : state.bing.page);
let id = (text == 'baidu' ? state.baidu.id : state.bing.id);
let keywords = (text == 'baidu' ? state.baidu.keywords :text == 'bing' ?state.bing.keywords:state.twitter.keywords);
let page = (text == 'baidu' ? state.baidu.page : text == 'bing' ?state.bing.page:state.twitter.page);
let id = (text == 'baidu' ? state.baidu.id : text == 'bing' ?state.bing.id:state.twitter.id);
submit(
{
type: text == 'baidu' ? 2 : 1,
type: text == 'baidu' ? 2 :text == 'bing'?1:3 ,
manageId: userInfo.userInfos.id,
status: 0,
disasterId: state.data.disasterId,
keywords: keywords,
id: (id ? id : null)
id: (id ? id : null),
startDate:(text=='twitter'?state.twitter.date[0]:null),
endDate:(text=='twitter'?state.twitter.date[1]:null),
}
).then(ret => {
if (ret == 1042) {
ElMessage.error("error")
} else {
news(ret.disasterId, keywords, page, (text == "baidu"), ret.id).then(res => {
getData();
})
ElMessage.success("Data is being acquired!")
if(text =='baidu' || text == 'bing'){
news(ret.disasterId, keywords, page, (text == "baidu"), ret.id).then(res => {
ElMessage.success("Data is being acquired!")
getData();
})
}else if(text == 'twitter'){
console.log(state.twitter.date)
twitter(disasterId,keywords,state.twitter.date[0],state.twitter.date[1]).then(res=>{
ElMessage.success("Data is being acquired!")
getData();
})
}
}
})
}

View File

@ -3,8 +3,15 @@
<el-row>
<el-col :span="8">
<div class="rsSelect">
<el-card class="box-card">
<span>{{ state.data.disasterKeyword }}</span>
<p style="color: #878787; ">VoRDM ID:{{ state.data.vordmId }}</p>
<p style="color: #aa4434;">Disaster time: {{ state.data.disasterTime }}</p>
<p style="color: #878787; ">Disaster Country: {{ state.data.disasterCountry }}</p>
</el-card>
<el-card class="box-card" style="margin-top: 3%;">
<span>Select time range</span>
<el-row class="block">
<el-col :span="5">
@ -30,7 +37,7 @@
<el-card class="box-card" style="margin-top: 3%;">
<span>Select a region</span>
<el-scrollbar wrap-class="list" view-class="view-box" :native="false">
<div v-for="(coordinate, i) in state.coordinateList ">
<div v-for="(coordinate, i) in state.coordinateList ">
<el-row class="coordinateContainer">
<el-col :span="1"></el-col>
<el-col :span="19">
@ -84,15 +91,14 @@
:value="item.value" />
</el-select>
</el-card> -->
<el-row>
<el-col :span=" 1 "></el-col>
<el-col :span=" 6 ">
<el-button class="lowerBtn" @click=" startCrawl ">Start Crawl</el-button>
</el-col>
<el-col :span=" 6 ">
<el-button class="lowerBtn" @click=" ClearCondition ">Go Back</el-button>
</el-col>
</el-row>
<el-card style="margin-top:3%;">
<el-row>
<el-button class="lowerBtn" @click=" startCrawl ">Start Crawl</el-button>
</el-row>
<el-row>
<el-button class="lowerBtn" @click=" ClearCondition ">Go Back</el-button>
</el-row>
</el-card>
</div>
</el-col>
<el-col :span=" 16 ">
@ -106,10 +112,11 @@
<script setup>
import Map from "/@/components/Map.vue";
import { ref, reactive, watch, defineExpose } from 'vue';
import { rs, submit } from '/@/api/crawl/index';
import { ref, reactive, watch, defineExpose, onMounted,defineEmits } from 'vue';
import { rs, submit ,rs2 } from '/@/api/crawl/index';
import { useUserInfo } from '/@/stores/userInfo';
import { ElMessage,ElMessageBox} from "element-plus";
import { ElMessage, ElMessageBox } from "element-plus";
import { getList as BizDict } from "/@/api/system/dictbiz.js";
const userInfo = useUserInfo();
const emit = defineEmits(['response']);
const disabledDate = (time) => {
@ -128,118 +135,13 @@ const state = reactive({
{
value: 'landsat',
label: 'landsat',
// children: [{
// value: 1 - 1,
// label: 'LANDSAT_8_C1'
// },
// {
// value: 1 - 2,
// label: 'LANDSAT_ETM_C1'
// },
// {
// value: 1 - 3,
// label: 'LANDSAT_TM_C1'
// }
// ]
},
{
value: 'Sentinel',
label: 'Sentinel',
// children: [{
// value: 2 - 1,
// label: 'Sentinel - 2',
// children: [{
// value: 2 - 1 - 1,
// label: 'S2MSI2A'
// }]
// },
// {
// value: 2 - 2,
// label: 'Sentinel - 1',
// children: [{
// value: 2 - 2 - 1,
// label: 'SLC'
// }]
// }
// ]
},
// {
// value: '',
// label: '',
// children: [
// {
// value: 'GF - 1',
// label: 'GF - 1',
// },
// {
// value: 'GF - 2',
// label: 'GF - 2',
// },
// {
// value: 'GF - 3',
// label: 'GF - 3',
// },
// {
// value: 'GF - 4',
// label: 'GF - 4',
// },
// {
// value: 'GF - 6',
// label: 'GF - 6',
// },
// {
// value: 'ZY - 3',
// label: 'ZY - 3',
// },
// {
// value: 'ZY - 302',
// label: 'ZY - 302',
// },
// {
// value: 'ZY - 02C',
// label: 'ZY - 02C',
// },
// ],
// },
// {
// value: '',
// label: '',
// children: [
// {
// value: 'OVS - 2A',
// label: 'OVS - 2A',
// },
// {
// value: 'OVS - 3A',
// label: 'OVS - 3A',
// },
// {
// value: 'OVS - 1A',
// label: 'OVS - 1A',
// },
// {
// value: 'OVS - 1B',
// label: 'OVS - 1B',
// },
// {
// value: 'OHS - 2A',
// label: 'OHS - 2A',
// },
// {
// value: 'OHS - 2B',
// label: 'OHS - 2B',
// },
// {
// value: 'OHS - 2C',
// label: 'OHS - 2C',
// },
// {
// value: 'OHS - 2D',
// label: 'OHS - 2D',
// },
// ],
// }
],
dictData:[],
shortcuts: [
{
text: '1 month ago',
@ -293,6 +195,16 @@ const state = reactive({
disLon: '',
data: {}
})
//
onMounted(() => {
BizDict({ code: 'satelliteType' }).then(res => {
let data = res.map(item=>{
return {value:item.dictValue,label:item.dictValue}
})
state.sensor = data;
state.dictData = res;
})
})
const onMapClick = (e) => {
state.lat = e.latlng.lat.toFixed(3);
@ -394,72 +306,45 @@ const startCrawl = () => {
var ranges = state.coordinateList[0].Lat + ' ' + state.coordinateList[0].Lng + ',' + state.coordinateList[1].Lat + ' ' + state.coordinateList[1].Lng
var type = null
if (state.satelliteSelected[0] == 'landsat') {
type = '5'
} else if (state.satelliteSelected[0] == 'Sentinel') {
type = '6'
} else if (state.satelliteSelected[0] == '') {
type = '7'
}
var id = 2
var param = []
state.satelliteSelected.forEach(data=>{
var param = {
"stime": state.startTime,
"etime": state.endTime,
"disaster_id": state.data.disasterId,
"ranges": ranges,
"id": id
}
submit(
{
type: type,
startDate: state.startTime,
endDate: state.endTime,
manageId: userInfo.userInfos.id,
status: 0,
disasterId: state.data.disasterId,
id: (id ? id : null)
}
).then(ret => {
if (ret == 1042) {
ElMessage.error("error")
} else {
state.satelliteSelected.forEach(data => {
if (data == 'Sentinel') {
rs(state.startTime, state.endTime, state.data.disasterId, ranges, type = 1, ret.id).then(res => {
// getData();
ElMessage({
message: 'Success, Start crawling. sentinel',
type: 'success',
})
})
} else if ("landsat" == data) {
rs(state.startTime, state.endTime, state.data.disasterId, ranges, type = 2, ret.id).then(res => {
// getData();
ElMessage({
message: 'Success, Start crawling. landsat',
type: 'success',
})
})
}
// state.dictData.ma
var obj = state.dictData.find(function(item) {
return item.dictValue === data;
});
param.push( {
type: obj.dictKey,
startDate: state.startTime,
endDate: state.endTime,
manageId: userInfo.userInfos.id,
range:ranges,
status: 0,
disasterId: state.data.disasterId,
})
})
//
submit( param ).then(ret => {
let arrParams=[];
ret.forEach(res=>{
var obj1 = state.dictData.find(function(item) {
return item.dictKey == res.type;
});
arrParams.push({
type:obj1.dictValue,
range:res.range,
id:res.id
})
ElMessageBox.confirm(
'The operation has been submitted, would you like to return to the list page?',
'tips',
{
confirmButtonText: 'OK',
cancelButtonText: 'Cancel',
type: 'warning',
}
)
.then(() => {
emit('response')
})
//
rs2(state.data.disasterId,arrParams,state.startTime,state.endTime).then(res => {
// getData();
ElMessage({
message: 'Success, Start crawling. sentinel',
type: 'success',
})
.catch(() => {
})
}
})
})
}
@ -482,13 +367,12 @@ watch(
map.value.mapOperations.off("click", onMapClick)
}
},
{ immediate: true })
{ immediate: true }
)
const setData = (row) => {
state.data = row;
state.selectID = row.disasterId
console.log(row);
map.value.mapOperations.wktParseToMap(row.geometry)
console.log(row)
}
defineExpose({
setData
@ -542,13 +426,14 @@ defineExpose({
}
.lowerBtn {
width: 90%;
margin: 3% 0;
width: 100%;
text-align: center;
margin-top: 5px;
}
}
#map {
height: 52rem;
height: 58rem;
margin-left: 5px;
}
</style>

View File

@ -35,6 +35,12 @@ const viteConfig = defineConfig((mode) => {
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, ''),
},
'/api1': {
target: 'http://39.98.35.99:6300',
ws: true,
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, ''),
},
},
},
build: {