@@ -8,23 +8,11 @@ | |||
</div> | |||
</Legend> | |||
<div class="mask" style="position: absolute; width: 100%; height: 100%;pointer-events: none;"></div> | |||
<!--选择地址--> | |||
<div class="select_address"> | |||
<div class="dot left"></div> | |||
<div class="dot right"></div> | |||
<el-cascader :options="addrOptions" v-model="addrText" :props="deptTreeProps" popper-class="header-cascader-drop" @change="selectAddress" ref="cascader"> | |||
<template slot-scope="{ node, data }"> | |||
<span>{{ data.label }}</span> | |||
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span> | |||
</template> | |||
</el-cascader> | |||
</div> | |||
<!--合同信息详情-弹窗--> | |||
<div v-if="showInfoDetail" class="gl_pop_cash pop_statistical_desc"> | |||
<!--资产信息详情-弹窗--> | |||
<div v-if="showPermanentDetail" class="gl_pop_cash pop_statistical_desc"> | |||
<div class="head_main"> | |||
<div class="title">{{infoDetail.name}}详情</div> | |||
<div class="close" @click="showInfoDetail = false"></div> | |||
<div class="title">{{permanentDetail.name}}详情</div> | |||
<div class="close" @click="showPermanentDetail = false"></div> | |||
<div class="xs_main"> | |||
<div class="block"> | |||
<div class="point p1"></div> | |||
@@ -36,71 +24,77 @@ | |||
</div> | |||
<div class="echarts_main"> | |||
<div> | |||
<p>合同编码</p> | |||
<p>{{infoDetail.code}}</p> | |||
<p>资产编码</p> | |||
<p>{{permanentDetail.code}}</p> | |||
</div> | |||
<div> | |||
<p>合同名称</p> | |||
<p>{{infoDetail.name}}</p> | |||
<p>资产名称</p> | |||
<p>{{permanentDetail.name}}</p> | |||
</div> | |||
<div> | |||
<p>甲方</p> | |||
<p>{{infoDetail.firstParty}}</p> | |||
<p>资产类别</p> | |||
<p>{{permanentDetail.assetType}}</p> | |||
</div> | |||
<div> | |||
<p>乙方</p> | |||
<p>{{infoDetail.secondParty}}</p> | |||
<p>经营属性</p> | |||
<p>{{permanentDetail.operationType}}</p> | |||
</div> | |||
<div> | |||
<p>签订日期</p> | |||
<p>{{infoDetail.buildingTime}}</p> | |||
<p>增加方式</p> | |||
<p>{{permanentDetail.addType}}</p> | |||
</div> | |||
<div> | |||
<p>开始日期</p> | |||
<p>{{infoDetail.startTime}}</p> | |||
<p>购建时间</p> | |||
<p>{{permanentDetail.buildTime}}</p> | |||
</div> | |||
<div> | |||
<p>结束日期</p> | |||
<p>{{infoDetail.endTime}}</p> | |||
<p>使用情况</p> | |||
<p>{{permanentDetail.useType}}</p> | |||
</div> | |||
<div> | |||
<p>承包价款(元)</p> | |||
<p>{{infoDetail.totalAmount}}</p> | |||
<p>资产状态</p> | |||
<p>{{permanentDetail.assetStatus}}</p> | |||
</div> | |||
<div> | |||
<p>折合年均(元)</p> | |||
<p>{{infoDetail.price}}</p> | |||
<p>数量/面积</p> | |||
<p>{{permanentDetail.quantity}}</p> | |||
</div> | |||
<div> | |||
<p>已结款(元)</p> | |||
<p>{{infoDetail.receivedAmount}}</p> | |||
<p>计量单位</p> | |||
<p>{{permanentDetail.unit}}</p> | |||
</div> | |||
<div> | |||
<p>合同状态</p> | |||
<p>{{infoDetail.contractionStatus}}</p> | |||
<p>原值(元)</p> | |||
<p>{{permanentDetail.originalValue}}</p> | |||
</div> | |||
<div> | |||
<p>备注</p> | |||
<p>{{infoDetail.remark}}</p> | |||
<p>折旧方式</p> | |||
<p>{{permanentDetail.depreciationType}}</p> | |||
</div> | |||
<div> | |||
<p>附件</p> | |||
<p> | |||
<block v-for="(item,index) in infoDetail.fileList"> | |||
<block v-for="(item,index) in permanentDetail.fileList"> | |||
<a :href="item.urlApi" v-if="item.type != 'image'"> | |||
<img :src="item.url" style="width: 3vw;height: 3vw;margin-right: 0.5vw;" alt=""> | |||
</a> | |||
<img v-else :src="item.url" style="width: 3vw;height: 3vw;margin-right: 0.3vw;" alt="" @click="openImage(item.url)"> | |||
<img v-else :src="item.url" style="width: 3vw;height: 3vw;margin-right: 0.3vw;" alt="" | |||
@click="openImage(item.url)"> | |||
</block> | |||
</p> | |||
</div> | |||
</div> | |||
</div> | |||
<div v-show="dialogVisible" style="width:100%;height:100vh;position:absolute;top: 0;left: 0;z-index: 999"> | |||
<div style="background: rgba(0,0,0,0.8);width: 100vw;height: 100vh;" @click="dialogVisible=false"></div> | |||
<img width="40%" :src="dialogImageUrl" style="position:absolute;left: 50%;top: 50%;height: 50%;transform: translate(-50%,-50%)" alt=""> | |||
<!--选择地址--> | |||
<div class="select_address"> | |||
<el-cascader :options="addrOptions" v-model="addrText" :props="deptTreeProps" popper-class="header-cascader-drop" | |||
@change="selectAddress" ref="cascader"> | |||
<template slot-scope="{ node, data }"> | |||
<span>{{ data.label }}</span> | |||
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span> | |||
</template> | |||
</el-cascader> | |||
</div> | |||
</div> | |||
</div> |
@@ -21,6 +21,7 @@ export default { | |||
}, | |||
data () { | |||
return { | |||
showPermanentDetail: false, | |||
LegendData: [ | |||
{ | |||
icon: require('./icon/组 4665@2x.png'), | |||
@@ -184,6 +185,8 @@ export default { | |||
status: null, | |||
translate_dict: 1, | |||
}, | |||
//固定资产详情数据 | |||
permanentDetail: [], | |||
//合同信息请求参数 | |||
contractionByPermanentQueryParams: { | |||
pageNum: 1, | |||
@@ -370,49 +373,6 @@ export default { | |||
gis.getVectorLayerByFs(features) | |||
gis.mapSetFit(features) | |||
}, | |||
openResourceDialog (data) { | |||
data.fileList = []; | |||
let parmasData = { | |||
tableId: data.id, | |||
tableName: 't_asset_resource', | |||
bizPath: 'asset', | |||
}; | |||
attachmentList(parmasData).then((res) => { | |||
if (res.code == 200) { | |||
let UattachmentList = res.rows; | |||
for (let i = 0; i < UattachmentList.length; i++) { | |||
let fileName = UattachmentList[i].fileName; | |||
let subIndex = fileName.lastIndexOf("."); | |||
let ext = fileName.substring(subIndex + 1, fileName.length); | |||
let urls = ""; | |||
let type = ""; | |||
if (ext == "xlsx" || ext == "xls") { | |||
urls = require("@/assets/images/icon_excel.jpg"); | |||
type = 'excel'; | |||
} else if (ext == "doc" || ext == "docx") { | |||
urls = require("@/assets/images/icon_word.jpg"); | |||
type = 'word'; | |||
} else if (ext == "pdf") { | |||
urls = require("@/assets/images/icon_pdf.jpg"); | |||
type = 'pdf'; | |||
} else if (ext == "zip") { | |||
urls = require("@/assets/images/icon_zip.jpg"); | |||
type = 'zip'; | |||
} else { | |||
urls = '/api' + UattachmentList[i].fileUrl; | |||
type = 'image'; | |||
} | |||
data.fileList.push({ | |||
url: urls, | |||
urlApi: '/api' + UattachmentList[i].fileUrl, | |||
type: type | |||
}) | |||
} | |||
this.showResourceDetail = true; | |||
this.resourceDetail = data; | |||
} | |||
}); | |||
}, | |||
listDialogHidden (type) { | |||
if (type == 'detail') { | |||
//合同信息详情弹窗 | |||
@@ -535,13 +495,17 @@ export default { | |||
(feature) => feature | |||
); | |||
if (feature) { | |||
var ifConsole = feature.values_.level; | |||
if (ifConsole == "permanent") { | |||
that.listDialogHidden('detail'); | |||
that.openPermanentDialog(feature.values_.detail); | |||
// 镇级:加载村级坐标点 | |||
if (feature.get('deptLevel') === '3') { | |||
gis.getMapContainer().getView().animate({ | |||
center: fromLonLat([feature.get('lng'), feature.get('lat')]), // 中心点 | |||
zoom: 12, // 缩放级别 | |||
rotation: undefined, // 缩放完成view视图旋转弧度 | |||
duration: 1000, // 缩放持续时间,默认不需要设置 | |||
}); | |||
} else { | |||
that.listDialogHidden('detail'); | |||
that.openResourceDialog(feature.values_.detail); | |||
that.openPermanentDialog(feature.values_.detail); | |||
} | |||
} | |||
}); | |||
@@ -31,6 +31,167 @@ | |||
} | |||
} | |||
.gl_pop_cash { | |||
background: rgba(10, 25, 47, 0.8); | |||
position: absolute; | |||
border: 1px solid #063a95; | |||
border-left: 0.15vw solid #357dfa; | |||
padding: 0 1vw; | |||
z-index: 11; | |||
.head_main { | |||
height: 4.62vh; | |||
padding-top: 0.55vh; | |||
display: flex; | |||
align-items: center; | |||
position: relative; | |||
justify-content: space-between; | |||
.title { | |||
color: #ffad00; | |||
font-size: 1.66vh; | |||
} | |||
.close { | |||
background: url('./close.png') no-repeat; | |||
background-size: 100% 100%; | |||
width: 1.48vh; | |||
height: 1.48vh; | |||
cursor: pointer; | |||
} | |||
.xs_main { | |||
height: 0.55vh; | |||
position: absolute; | |||
width: 100%; | |||
bottom: -0.55vh; | |||
display: flex; | |||
align-items: center; | |||
.block { | |||
width: 2.34vw; | |||
display: flex; | |||
.point { | |||
width: .55vh; | |||
height: .55vh; | |||
margin-right: 0.36vw; | |||
&.p1 { | |||
background: rgba(53, 125, 250, 1) | |||
} | |||
&.p2 { | |||
background: rgba(53, 125, 250, .7) | |||
} | |||
&.p3 { | |||
background: rgba(53, 125, 250, .4) | |||
} | |||
} | |||
} | |||
.xs_x { | |||
height: 1px; | |||
flex: 1; | |||
background: #214284; | |||
} | |||
} | |||
} | |||
.echarts_main { | |||
.headers { | |||
height: 3.33vh; | |||
font-size: 1.48vh; | |||
color: #0befca; | |||
text-align: center; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
margin-right: 0.53vw; | |||
background: rgba(11, 239, 202, .2); | |||
margin-bottom: 0.9vh | |||
} | |||
.desc_main { | |||
overflow-y: scroll; | |||
padding-right: 0.33vw; | |||
.analysisTable_list { | |||
margin: 0; | |||
padding: 0; | |||
flex: 1; | |||
display: flex; | |||
flex-direction: column; | |||
.flex_item { | |||
cursor: pointer; | |||
list-style: none; | |||
margin: 0; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
text-align: center; | |||
color: #fff; | |||
font-size: 1.29vh; | |||
position: relative; | |||
height: 3.2vh; | |||
&:nth-child(2n) { | |||
background: rgba(53, 125, 250, .1); | |||
} | |||
} | |||
} | |||
} | |||
} | |||
} | |||
.pop_statistical_desc { | |||
width: 20.2vw; | |||
margin: 0; | |||
right: 23vw; | |||
top: 35vh; | |||
padding-bottom: 1.04vw !important; | |||
.head_main { | |||
.title { | |||
color: #fff; | |||
} | |||
} | |||
.echarts_main { | |||
margin-top: 1.66vh; | |||
div { | |||
display: flex; | |||
align-items: center; | |||
&:nth-child(even) { | |||
background: rgba(32, 89, 188, 0.2); | |||
} | |||
p { | |||
&:nth-child(1) { | |||
width: 8vw; | |||
padding-left: 1vw; | |||
flex-shrink: 0; | |||
} | |||
&:nth-child(2) { | |||
color: #ffad00; | |||
} | |||
margin: 0; | |||
color: #ffffff; | |||
font-size:1.33vh; | |||
line-height: 3.92vh; | |||
} | |||
} | |||
} | |||
} | |||
.mask { | |||
z-index: 1; | |||
width: 100%; | |||
@@ -85,7 +85,7 @@ | |||
</div> | |||
<div class="mask" style="position: absolute; width: 100%; height: 100%;pointer-events: none;"></div> | |||
<!--选择地址--> | |||
<!-- <div class="select_address"> | |||
<div class="select_address"> | |||
<div class="dot left"></div> | |||
<div class="dot right"></div> | |||
<el-cascader :options="addrOptions" v-model="addrText" :props="deptTreeProps" popper-class="header-cascader-drop" @change="selectAddress" ref="cascader"> | |||
@@ -94,6 +94,6 @@ | |||
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span> | |||
</template> | |||
</el-cascader> | |||
</div> --> | |||
</div> | |||
</div> | |||
@@ -3,11 +3,12 @@ import GisUtils from '@/utils/gis.js'; | |||
import { | |||
fromLonLat | |||
} from 'ol/proj' | |||
import { getUserGeo, getUserGeoList } from "@/api/dataScreen/stockCooperative/index.js"; | |||
import { getPermanentListByDeptId, listPermanent } from "@/api/asset/permanent.js"; | |||
import { getInfo } from "@/api/login"; | |||
import { getResourceListByDeptId, listResource } from "@/api/asset/resource.js"; | |||
import Legend from '@/components/legend/index.vue'; | |||
import { attachmentList } from "@/api/common/uploadAttachment.js"; | |||
import { treeselect, getDept, listDeptExcludeChild } from "@/api/system/dept"; | |||
let gis = null; | |||
export default { | |||
components: { | |||
@@ -15,8 +16,174 @@ export default { | |||
}, | |||
data () { | |||
return { | |||
//三务公开请求参数 | |||
queryParams: { | |||
pageNum: 1, | |||
pageSize: 10, | |||
title: null, | |||
openType: '1', | |||
detailedCategoriesType: null, | |||
villageType: null, | |||
openItems: null, | |||
meetingOpenType: null, | |||
deptId: null, | |||
isWechat: null, | |||
status: null, | |||
translate_dict: 1, | |||
}, | |||
//零工公开请求参数 | |||
tempWorkerOpenQueryParams: { | |||
// 分页 | |||
pageNum: 1, | |||
pageSize: 10, | |||
// 查询排序 | |||
//orderByColumn: "id", | |||
//isAsc: "desc", | |||
bookId: null, | |||
deptId: null, | |||
deptName: null, | |||
openNy: null, | |||
openYear: null, | |||
openName: null, | |||
openFile: null, | |||
openPic: null, | |||
remark: null, | |||
translate_dict: 1, | |||
}, | |||
//重大事项公开请求参数 | |||
majorEventOpenQueryParams: { | |||
// 分页 | |||
pageNum: 1, | |||
pageSize: 10, | |||
// 查询排序 | |||
//orderByColumn: "id", | |||
//isAsc: "desc", | |||
bookId: null, | |||
deptId: null, | |||
deptName: null, | |||
openNy: null, | |||
openYear: null, | |||
openDate: null, | |||
openName: null, | |||
openFile: null, | |||
openPic: null, | |||
content: null, | |||
remark: null, | |||
translate_dict: 1, | |||
}, | |||
//补贴资金管理请求参数 | |||
subsidyFundsQueryParams: { | |||
// 分页 | |||
pageNum: 1, | |||
pageSize: 10, | |||
// 查询排序 | |||
orderByColumn: "id", | |||
isAsc: "desc", | |||
year: null, | |||
areaName: null, | |||
name: null, | |||
idCard: null, | |||
itemName: null, | |||
releaseDate: null, | |||
translate_dict: 1, | |||
}, | |||
//固定资产请求参数 | |||
permanentQueryParams: { | |||
pageNum: 1, | |||
pageSize: 10, | |||
code: null, | |||
name: null, | |||
assetType: null, | |||
operationType: null, | |||
addType: null, | |||
useType: null, | |||
assetStatus: '1', | |||
translate_dict: 1, | |||
}, | |||
//资源资产请求参数 | |||
resourceListQueryParams: { | |||
pageNum: 1, | |||
pageSize: 10, | |||
bookId: null, | |||
deptId: null, | |||
code: null, | |||
name: null, | |||
resourceType: null, | |||
/*farmingResourceType: null, | |||
buildResourceType: null, | |||
unusedResourceType: null,*/ | |||
resourceSort: null, | |||
totalArea: null, | |||
location: null, | |||
east: null, | |||
west: null, | |||
south: null, | |||
north: null, | |||
sumArea: null, | |||
groupArea: null, | |||
groupValue: null, | |||
rentArea: null, | |||
rentValue: null, | |||
rentLessee: null, | |||
rentStartTime: null, | |||
rentEndTime: null, | |||
otherArea: null, | |||
otherValue: null, | |||
farmerArea: null, | |||
circulationArea: null, | |||
circulationValue: null, | |||
investmentArea: null, | |||
investmentValue: null, | |||
investmentLessee: null, | |||
investmentStartTime: null, | |||
investmentEndTime: null, | |||
status: null, | |||
translate_dict: 1, | |||
}, | |||
//合同信息请求参数 | |||
contractionByPermanentQueryParams: { | |||
pageNum: 1, | |||
pageSize: 10, | |||
bookId: null, | |||
deptId: null, | |||
code: null, | |||
name: null, | |||
assetType: null, | |||
firstParty: null, | |||
secondParty: null, | |||
collectionPay: null, | |||
contractionSource: null, | |||
totalAmount: null, | |||
receivedAmount: null, | |||
settledAmount: null, | |||
buildingTime: null, | |||
startTime: null, | |||
endTime: null, | |||
num: null, | |||
unit: null, | |||
price: null, | |||
contractionStatus: null, | |||
translate_dict: 1, | |||
}, | |||
addrText: [100,], | |||
deptTreeProps: { | |||
checkStrictly: true, | |||
}, | |||
addrOptions: [], | |||
//资产信息详情弹窗 | |||
showResourceDetail: false, | |||
mapGeoServerUrl: "", // geoserver地址 | |||
mapBorder: "", // 地图边界 | |||
deptLayer: "", // 坐标点图层 | |||
countyBorderLayerName: "", // 区县边界图层名称 | |||
townBorderLayerName: "", // 乡镇边界图层名称 | |||
villageBorderLayerName: "", // 村边界图层名称 | |||
groupBorderLayerName: "", // 组边界图层名称 | |||
LegendData: [ | |||
{ | |||
iconStyle: { | |||
@@ -58,6 +225,7 @@ export default { | |||
created () { | |||
}, | |||
mounted () { | |||
treeselect().then((resp) => this.addrOptions = resp.data); | |||
getInfo().then(res => { | |||
this.initMap(res.user.loginDeptId); | |||
// 加载地图 | |||
@@ -65,6 +233,69 @@ export default { | |||
}, | |||
methods: { | |||
selectAddress (value) { | |||
const deptId = value[value.length - 1]; | |||
this.queryParams.deptId = deptId; | |||
this.tempWorkerOpenQueryParams.deptId = deptId; | |||
this.majorEventOpenQueryParams.deptId = deptId; | |||
this.subsidyFundsQueryParams.deptId = deptId; | |||
this.permanentQueryParams.deptId = deptId; | |||
this.resourceListQueryParams.deptId = deptId; | |||
this.contractionByPermanentQueryParams.deptId = deptId; | |||
this.infoTotal = undefined; | |||
this.resourceTotal = undefined; | |||
this.permanentTotal = undefined; | |||
this.subsidyFundsTotal = undefined; | |||
this.majorEventOpenTotal = undefined; | |||
this.tempWorkerOpenTotal = undefined; | |||
this.affairsTotal = undefined; | |||
this.affairsList = []; | |||
this.tempWorkerOpenList = []; | |||
this.majorEventOpenList = []; | |||
this.subsidyFundsList = []; | |||
this.permanentList = []; | |||
this.resourceList = []; | |||
this.infoList = []; | |||
this.getAllList(); | |||
gis.getMapContainer().removeLayer(this.villageBorder); | |||
this.villageBorder = ''; | |||
// 添加村边界 | |||
this.addVillageBorder(deptId); | |||
gis.getMapContainer().removeLayer(this.permanentLayer); | |||
this.permanentLayer = ''; | |||
// 获取资产列表 | |||
this.getPermanentList(deptId); | |||
gis.getMapContainer().removeLayer(this.resourceLayer); | |||
this.resourceLayer = ''; | |||
// 获取资源列表 | |||
this.getResourceList(deptId); | |||
let node = this.$refs["cascader"].panel.getNodeByValue(value); | |||
const dept = node.data; | |||
const deptData = { | |||
deptId: dept.id, | |||
deptName: dept.label, | |||
lat: dept.lat, | |||
lng: dept.lng, | |||
deptLevel: dept.deptLevel, | |||
orgCode: dept.orgCode | |||
}; | |||
let deptList = []; | |||
deptList.push(deptData); | |||
gis.getMapContainer().removeLayer(this.deptLayer); | |||
this.deptLayer = ''; | |||
// 添加坐标点图层 | |||
this.addDeptLayer(deptList, 'yellow.png'); | |||
gis.getMapContainer().getView().animate({ | |||
// 只设置需要的属性即可 | |||
center: fromLonLat([dept.lng, dept.lat]), // 中心点 | |||
duration: 500, // 缩放持续时间,默认不需要设置 | |||
}); | |||
}, | |||
// 添加村边界 | |||
addVillageBorder (deptIds) { | |||
gis.addImageLayer(this.mapGeoServerUrl, this.villageBorderLayerName, deptIds) | |||
}, | |||
// 加载地图 | |||
initMap (deptId) { | |||
gis = new GisUtils('map2') | |||
@@ -144,7 +375,6 @@ export default { | |||
rotation: undefined, // 缩放完成view视图旋转弧度 | |||
duration: 1000, // 缩放持续时间,默认不需要设置 | |||
}); | |||
} else { | |||
this.listDialogHidden('detail'); | |||
this.openResourceDialog(feature.values_.detail); | |||
@@ -284,6 +514,14 @@ export default { | |||
gis.getVectorLayerByFs(features) | |||
gis.mapSetFit(features) | |||
}, | |||
// 获取资产列表 | |||
getPermanentList (deptId) { | |||
getPermanentListByDeptId(deptId).then(response => { | |||
if (response.data && response.data.length > 0) { | |||
this.addPermanentLayer(response.data); | |||
} | |||
}); | |||
}, | |||
getAllList () { | |||
//三务公开 | |||
// this.getList(null); | |||