<template>
|
<div class="box">
|
<ul>
|
<li
|
style="margin-left: 20px"
|
@click="changeIquery(item)"
|
v-for="item in itemsOne"
|
>
|
<div class="divli">
|
<div :class="item.class" class="backimge5"></div>
|
</div>
|
<div class="div_li">{{ $t(item.name) }}</div>
|
</li>
|
</ul>
|
</div>
|
</template>
|
|
<script>
|
import $ from 'jquery';
|
import { removeToken, getToken } from '@/utils/auth';
|
import { comprehensive_uploadShp } from '../../api/api';
|
export default {
|
data() {
|
return {
|
itemsOne: [
|
{
|
id: '1',
|
name: 'synthesis.somequery',
|
class: 'e1',
|
},
|
{
|
id: '2',
|
name: 'synthesis.linequery',
|
class: 'e2',
|
},
|
{
|
id: '3',
|
name: 'synthesis.rectangularquery',
|
class: 'e3',
|
},
|
{
|
id: '4',
|
name: 'synthesis.gardenquery',
|
class: 'e4',
|
},
|
{
|
id: '5',
|
name: 'synthesis.polygonquery',
|
class: 'e5',
|
},
|
{
|
id: '6',
|
name: 'synthesis.attributequery',
|
class: 'e6',
|
},
|
{
|
id: '7',
|
name: 'synthesis.rangequery',
|
class: 'e7',
|
},
|
],
|
rel_name: null,
|
analyStatus: {
|
upload: false,
|
download: false,
|
},
|
};
|
},
|
created() {
|
var cover_Id = this.$store.state.syntiesis.menu;
|
var cover_perms = this.$store.state.permsEntity;
|
|
for (var i = 0; i < cover_perms.length; i++) {
|
if (cover_perms[i].pid == cover_Id) {
|
this.showViewMenu(cover_perms[i]);
|
}
|
}
|
},
|
methods: {
|
showViewMenu(res) {
|
if (res.cnName != '查询') return;
|
|
switch (res.tag) {
|
case '/upload':
|
this.analyStatus.upload = true;
|
break;
|
case '/download':
|
this.analyStatus.download = true;
|
break;
|
}
|
},
|
changeIquery(res) {
|
this.$store.state.mapMenuBoolean = false;
|
this.$store.state.mapMenuBoxFlag = null;
|
this.$store.state.mapPopBoolean = false;
|
this.$store.state.mapPopBoxFlag = null;
|
switch (res.id) {
|
case '6':
|
this.$store.state.mapMenuBoolean = true;
|
this.$store.state.mapMenuBoxFlag = '2';
|
break;
|
case '7':
|
this.$store.state.mapMenuBoolean = true;
|
this.$store.state.mapMenuBoxFlag = '1';
|
break;
|
}
|
},
|
getQueryFile() {
|
$('#getF').click();
|
},
|
async setQueryFile() {
|
var val = document.getElementById('getF').files;
|
if (!val || !val.length) return;
|
var formData = new FormData();
|
var exts = ['.shp', '.shx', '.dbf', '.prj'];
|
var count = 0;
|
for (var i = 0; i < val.length; i++) {
|
var name = val[i].name.toLocaleLowerCase();
|
var ext = name.substring(name.lastIndexOf('.'));
|
if (exts.indexOf(ext) > -1) {
|
count++;
|
formData.append(val[i].name, val[i]); // fs.files[i].name,file
|
}
|
}
|
if (count != 4) {
|
alert('ShapeFile文件选择不全!');
|
return;
|
}
|
const data = await comprehensive_uploadShp(formData);
|
|
// $.ajax(BASE_URL + '/comprehensive/uploadShp?token=' + getToken(), {
|
// type: 'post',
|
// data: formData,
|
// async: true,
|
// cache: false,
|
// processData: false,
|
// contentType: false,
|
// success: function (rs) {},
|
// error: function (e) {
|
// console.error(e);
|
// },
|
// });
|
},
|
},
|
};
|
</script>
|
|
<style>
|
.box {
|
width: 100%;
|
height: 100%;
|
position: relative;
|
}
|
.box li {
|
list-style: none;
|
float: left;
|
height: 60px;
|
text-align: center;
|
margin: 2px;
|
position: relative;
|
cursor: pointer;
|
margin-top: 5px;
|
}
|
.box ul {
|
margin: 0px;
|
}
|
.e1 {
|
background: url('../../assets/img/synthesis/椭圆 2 副本 拷贝 3.png') no-repeat
|
center;
|
}
|
.e2 {
|
background: url('../../assets/img/synthesis/椭圆 3 拷贝 9.png') no-repeat
|
center;
|
}
|
.e3 {
|
background: url('../../assets/img/synthesis/图层 36.png') no-repeat center;
|
}
|
.e4 {
|
background: url('../../assets/img/synthesis/椭圆 3 拷贝 10.png') no-repeat
|
center;
|
}
|
.e5 {
|
background: url('../../assets/img/synthesis/圆角矩形 12 拷贝 8.png') no-repeat
|
center;
|
}
|
.e6 {
|
background: url('../../assets/img/synthesis/图层 23.png') no-repeat center;
|
}
|
.e7 {
|
background: url('../../assets/img/synthesis/图层 24.png') no-repeat center;
|
}
|
|
.divli {
|
width: 100%;
|
height: 50%;
|
position: relative;
|
}
|
.backimge5 {
|
width: 30px;
|
height: 30px;
|
margin-left: 25px;
|
position: absolute;
|
background-size: 100% 100%;
|
margin: 0% 30%;
|
}
|
.backimgex {
|
width: 30px;
|
height: 30px;
|
margin-left: 25px;
|
position: absolute;
|
background-size: 100% 100%;
|
margin: 0% 30%;
|
}
|
</style>
|