yaowang
/
vordm-admin
8
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

zqq:遥感影像数据获取（响应式）

This commit is contained in:
qqGroup0 2023-03-31 11:20:55 +08:00
parent 6030b5bc53
commit 4aaa34681b
1 changed files with 122 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
src/views/dataService/remoteSensingData/index.vue
View File

@ -4,27 +4,35 @@
@tab-click="handleClick"> @tab-click="handleClick">
<el-tab-pane label="Search condition" <el-tab-pane label="Search condition"
name="first"> name="first">
<el-row>
<el-col :span="8">
<div class="rsSelect"> <div class="rsSelect">
<el-card class="box-card"> <el-card class="box-card">
<span>Select time range</span> <span>Select time range</span>
<div class="block"> <el-row class="block">
<el-col :span="5">
<span class="demonstration">Start time</span> <span class="demonstration">Start time</span>
<el-date-picker style="width: 70%;" </el-col>
<el-col :span="19">
<el-date-picker style="width: 90%;"
v-model="state.startTime" v-model="state.startTime"
type="datetime" type="datetime"
placeholder="Select start time" placeholder="Select start time"
:shortcuts="shortcuts" /> :shortcuts="shortcuts" />
</div> </el-col>
</el-row>
<div class="block"> <el-row class="block">
<el-col :span="5">
<span class="demonstration">End time</span> <span class="demonstration">End time</span>
<el-date-picker style="width: 70%;" </el-col>
<el-col :span="19">
<el-date-picker style="width: 90%;"
v-model="state.endTime" v-model="state.endTime"
type="datetime" type="datetime"
placeholder="Select end time" placeholder="Select end time"
:shortcuts="shortcuts" /> :shortcuts="shortcuts" />
</div> </el-col>
</el-row>
</el-card> </el-card>
<el-card class="box-card" <el-card class="box-card"
@ -33,30 +41,43 @@
<el-scrollbar wrap-class="list" <el-scrollbar wrap-class="list"
view-class="view-box" view-class="view-box"
:native="false"> :native="false">
<div class="coordinateContainer" <div v-for="(coordinate,i) in state.coordinateList">
v-for="(coordinate,i) in state.coordinateList"> <el-row class="coordinateContainer">
<span style="font-size:14px;float: left;width: 70%;">{{ <el-col :span="1"></el-col>
<el-col :span="19">
<span style="font-size:14px;width: 100%;">{{
'Lat:&emsp;' + parseFloat(coordinate.Lat).toFixed(4) + ',&emsp;&emsp;Lng:&emsp;' + parseFloat(coordinate.Lng).toFixed(4) 'Lat:&emsp;' + parseFloat(coordinate.Lat).toFixed(4) + ',&emsp;&emsp;Lng:&emsp;' + parseFloat(coordinate.Lng).toFixed(4)
}}</span> }}</span>
<span style="width:20%;margin-left: 80%;"> </el-col>
<el-col :span="2">
<el-button class="el-icon" <el-button class="el-icon"
@click="editCoordinate" @click="editCoordinate"
size="small"> size="small">
<ele-Edit /> <ele-Edit />
</el-button> </el-button>
</el-col>
<el-col :span="2">
<el-button class="el-icon" <el-button class="el-icon"
@click="state.coordinateList.splice(i, 1);" @click="state.coordinateList.splice(i, 1);"
size="small"> size="small">
<ele-Delete /> <ele-Delete />
</el-button> </el-button>
</span> </el-col>
</el-row>
</div> </div>
</el-scrollbar> </el-scrollbar>
<el-row>
<el-col :span="1"></el-col>
<el-col :span="7">
<el-button class="coordinateBtn" <el-button class="coordinateBtn"
@click="addCoordinate">Add coordinates</el-button> @click="addCoordinate">Add coordinates</el-button>
</el-col>
<el-col :span="7">
<el-button class="coordinateBtn" <el-button class="coordinateBtn"
@click="clearCoordinate">Clear coordinates</el-button> @click="clearCoordinate">Clear coordinates</el-button>
</el-col>
</el-row>
</el-card> </el-card>
<el-card class="box-card" <el-card class="box-card"
@ -84,14 +105,24 @@
:value="item.value" /> :value="item.value" />
</el-select> </el-select>
</el-card> </el-card>
<el-row>
<el-col :span="1"></el-col>
<el-col :span="6">
<el-button class="lowerBtn" <el-button class="lowerBtn"
@click="startCrawl">Start Crawl</el-button> @click="startCrawl">Start Crawl</el-button>
</el-col>
<el-col :span="6">
<el-button class="lowerBtn" <el-button class="lowerBtn"
@click="ClearCondition">Cancel</el-button> @click="ClearCondition">Cancel</el-button>
</el-col>
</el-row>
</div> </div>
</el-col>
<el-col :span="16">
<Map id="map"></Map> <Map id="map"></Map>
</el-col>
</el-row>
</el-tab-pane> </el-tab-pane>
@ -553,9 +584,7 @@ const ClearCondition = () => {
.container { .container {
padding: 1% 1%; padding: 1% 1%;
.rsSelect { .rsSelect {
float: left;
border: 1px solid #040728; border: 1px solid #040728;
width: 30%;
height: 52rem; height: 52rem;
span { span {
display: block; display: block;
@ -570,29 +599,27 @@ const ClearCondition = () => {
.block { .block {
margin-top: 2%; margin-top: 2%;
}
.demonstration { .demonstration {
font-size: 14px; font-size: 14px;
float: left; float: left;
height: 20px; height: 20px;
line-height: 40px; line-height: 40px;
margin: 0 3%;
width: 20%;
}
} }
.coordinateContainer { .coordinateContainer {
margin: 3%; margin: 3%;
height: 15px;
} }
.coordinateBtn { .coordinateBtn {
margin-left: 3%; width: 90%;
} }
.lowerBtn { .lowerBtn {
margin: 3% 0 3% 3%; width: 90%;
margin: 3% 0;
} }
} }
#map { #map {
width: 70%;
height: 52rem; height: 52rem;
float: left;
} }
} }
</style> </style>