移动端
Você não pode selecionar mais de 25 tópicos Os tópicos devem começar com uma letra ou um número, podem incluir traços ('-') e podem ter até 35 caracteres.

assetMapOpen.vue 40 KiB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973
  1. <template>
  2. <div class="homestead_main">
  3. <!--<div id="landMapDiv"></div>-->
  4. <div id="mapAll"></div>
  5. <div id="info" style="display: none"></div>
  6. <div class="plotPremises_right" v-if="this.mapHaDataValue">
  7. <div class="land_information_main">
  8. <div class="area_information">
  9. <div class="mian">
  10. <div class="basic_information" v-if="mapHasDateStatus == 0">
  11. <div class="basic_block">
  12. <van-row>
  13. <van-col :span="4"><span class="title">资源编码:</span></van-col>
  14. <van-col :span="8"><span class="desc">{{ mapHasData.code }}</span></van-col>
  15. <van-col :span="4"><span class="title">资源名称:</span></van-col>
  16. <van-col :span="8"><span class="desc">{{ mapHasData.name }}</span></van-col>
  17. </van-row>
  18. <van-row>
  19. <van-col :span="4"><span class="title">资源类型:</span></van-col>
  20. <van-col :span="8"><span class="desc">{{ mapHasData.resourceType }}</span></van-col>
  21. <van-col :span="4"><span class="title">坐落位置:</span></van-col>
  22. <van-col :span="8"><span class="desc">{{ mapHasData.location }}</span></van-col>
  23. </van-row>
  24. <van-row>
  25. <van-col :span="4"><span class="title">东至:</span></van-col>
  26. <van-col :span="8"><span class="desc">{{ mapHasData.east }}</span></van-col>
  27. <van-col :span="4"><span class="title">西至:</span></van-col>
  28. <van-col :span="8"><span class="desc">{{ mapHasData.west }}</span></van-col>
  29. </van-row>
  30. <van-row>
  31. <van-col :span="4"><span class="title">南至:</span></van-col>
  32. <van-col :span="8"><span class="desc">{{ mapHasData.south }}</span></van-col>
  33. <van-col :span="4"><span class="title">北至:</span></van-col>
  34. <van-col :span="8"><span class="desc">{{ mapHasData.north }}</span></van-col>
  35. </van-row>
  36. <van-row>
  37. <van-col :span="4"><span class="title">总面积:</span></van-col>
  38. <van-col :span="8"><span class="desc">{{ mapHasData.totalArea }}</span></van-col>
  39. <van-col :span="4"><span class="title">资产状态:</span></van-col>
  40. <van-col :span="8"><span class="desc">{{ mapHasData.status }}</span></van-col>
  41. </van-row>
  42. <van-row>
  43. <van-col :span="4"><span class="title">使用情况:</span></van-col>
  44. <van-col :span="8"><span class="desc">{{ mapHasData.useType }}</span></van-col>
  45. <van-col :span="4"><span class="title">备注:</span></van-col>
  46. <van-col :span="8"><span class="desc">{{ mapHasData.remark }}</span></van-col>
  47. </van-row>
  48. <van-row>
  49. <van-col :span="24"><span class="title">附件图片:</span></van-col>
  50. </van-row>
  51. <van-row>
  52. <van-col :span="24" style="height: 120px;overflow-y: auto;">
  53. <div class="fileList">
  54. <template v-for="(item,index) in mapHasData.fileList">
  55. <a :href="item.url" v-if="item.url.indexOf('xlsx') > -1 || item.url.indexOf('xls') > -1">
  56. <img src="../../assets/images/homestead/icon_excel.jpg" alt="" style="width:100px;height: 100px;">
  57. </a>
  58. <a :href="item.url" v-else-if="item.url.indexOf('docx') > -1 || item.url.indexOf('dox') > -1">
  59. <img src="../../assets/images/homestead/icon_word.jpg" alt="" style="width:100px;height: 100px;">
  60. </a>
  61. <img v-else :src="item.url" alt="" @click="openImage(item.url)" style="width:100px;height: 100px;">
  62. </template>
  63. <van-empty v-if="mapHasData.fileList.length<1" description="暂无附件"></van-empty>
  64. </div>
  65. </van-col>
  66. </van-row>
  67. <div class="gl_main">
  68. <div class="headers">
  69. <div class="flex3">合同编码</div>
  70. <div class="flex3">合同名称</div>
  71. <div class="flex3">承包款</div>
  72. <div class="flex3">状态</div>
  73. </div>
  74. <div class="desc_main">
  75. <ul class="analysisTable_list">
  76. <!--1-->
  77. <li v-for="item in contractionList" class="flex_item">
  78. <div class="flex3" @click="lookName(item.code)">{{item.code}}</div>
  79. <div class="flex3" @click="lookName(item.name)">{{item.name}}</div>
  80. <div class="flex3">{{item.totalAmount}}</div>
  81. <div class="flex3">{{selectDictLabel(contractionStatuOptions, item.contractionStatus)}}</div>
  82. </li>
  83. </ul>
  84. </div>
  85. </div>
  86. <!-- <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList"/>-->
  87. </div>
  88. </div>
  89. <div class="basic_information" v-if="mapHasDateStatus == 1">
  90. <div class="basic_block">
  91. <van-row>
  92. <van-col :span="4"><span class="title">资产编码:</span></van-col>
  93. <van-col :span="8"><span class="desc">{{ mapHasData.code }}</span></van-col>
  94. <van-col :span="4"><span class="title">资产名称:</span></van-col>
  95. <van-col :span="8"><span class="desc">{{ mapHasData.name }}</span></van-col>
  96. </van-row>
  97. <van-row>
  98. <van-col :span="4"><span class="title">资产类别:</span></van-col>
  99. <van-col :span="8"><span class="desc">{{ mapHasData.assetType }}</span></van-col>
  100. <van-col :span="4"><span class="title">经营属性:</span></van-col>
  101. <van-col :span="8"><span class="desc">{{ mapHasData.operationType }}</span></van-col>
  102. </van-row>
  103. <van-row>
  104. <van-col :span="4"><span class="title">增加方式:</span></van-col>
  105. <van-col :span="8"><span class="desc">{{ mapHasData.addType }}</span></van-col>
  106. <van-col :span="4"><span class="title">构建时间:</span></van-col>
  107. <van-col :span="8"><span class="desc">{{ mapHasData.buildTime }}</span></van-col>
  108. </van-row>
  109. <van-row>
  110. <van-col :span="4"><span class="title">坐落位置:</span></van-col>
  111. <van-col :span="8"><span class="desc">{{ mapHasData.location }}</span></van-col>
  112. <van-col :span="4"><span class="title">规格型号:</span></van-col>
  113. <van-col :span="8"><span class="desc">{{ mapHasData.specification }}</span></van-col>
  114. </van-row>
  115. <van-row>
  116. <van-col :span="4"><span class="title">供应商:</span></van-col>
  117. <van-col :span="8"><span class="desc">{{ mapHasData.supplier }}</span></van-col>
  118. <van-col :span="4"><span class="title">使用情况:</span></van-col>
  119. <van-col :span="8"><span class="desc">{{ mapHasData.useType }}</span></van-col>
  120. </van-row>
  121. <van-row>
  122. <van-col :span="4"><span class="title">数量/面积:</span></van-col>
  123. <van-col :span="8"><span class="desc">{{ mapHasData.quantity }}</span></van-col>
  124. <van-col :span="4"><span class="title">计量单位:</span></van-col>
  125. <van-col :span="8"><span class="desc">{{ mapHasData.unit }}</span></van-col>
  126. </van-row>
  127. <van-row>
  128. <van-col :span="4"><span class="title">原值:</span></van-col>
  129. <van-col :span="8"><span class="desc">{{ mapHasData.originalValue }}</span></van-col>
  130. <van-col :span="4"><span class="title">资产状态:</span></van-col>
  131. <van-col :span="8"><span class="desc">{{ mapHasData.assetStatus }}</span></van-col>
  132. </van-row>
  133. <van-row>
  134. <van-col :span="24"><span class="title">附件图片:</span></van-col>
  135. </van-row>
  136. <van-row>
  137. <van-col :span="24" style="height: 120px;overflow-y: auto;">
  138. <div class="fileList">
  139. <template v-for="(item,index) in mapHasData.fileList">
  140. <a :href="item.url" v-if="item.url.indexOf('xlsx') > -1 || item.url.indexOf('xls') > -1">
  141. <img src="../../assets/images/homestead/icon_excel.jpg" alt="" style="width:100px;height: 100px;">
  142. </a>
  143. <a :href="item.url" v-else-if="item.url.indexOf('docx') > -1 || item.url.indexOf('dox') > -1">
  144. <img src="../../assets/images/homestead/icon_word.jpg" alt="" style="width:100px;height: 100px;">
  145. </a>
  146. <img v-else :src="item.url" alt="" @click="openImage(item.url)" style="width:100px;height: 100px;">
  147. </template>
  148. <van-empty v-if="mapHasData.fileList.length<1" description="暂无附件"></van-empty>
  149. </div>
  150. </van-col>
  151. </van-row>
  152. <div class="gl_main">
  153. <div class="headers">
  154. <div class="flex3">合同编码</div>
  155. <div class="flex3">合同名称</div>
  156. <div class="flex3">承包款</div>
  157. <div class="flex3">状态</div>
  158. </div>
  159. <div class="desc_main">
  160. <ul class="analysisTable_list">
  161. <!--1-->
  162. <li v-for="item in contractionList" class="flex_item">
  163. <div class="flex3" @click="lookName(item.code)">{{item.code}}</div>
  164. <div class="flex3" @click="lookName(item.name)">{{item.name}}</div>
  165. <div class="flex3" >{{item.totalAmount}}</div>
  166. <div class="flex3">{{selectDictLabel(contractionStatuOptions, item.contractionStatus)}}</div>
  167. </li>
  168. </ul>
  169. </div>
  170. </div>
  171. </div>
  172. <!--<div class="basic_block">
  173. <span class="title">折旧科目:</span>
  174. <span class="desc">{{ mapHasData.depreciationSubject }}</span>
  175. </div>
  176. <div class="basic_block">
  177. <span class="title">折旧费用科目:</span>
  178. <span class="desc">{{ mapHasData.depreciationFeeSubject }}</span>
  179. </div>
  180. <div class="basic_block">
  181. <span class="title">资产清理科目:</span>
  182. <span class="desc">{{ mapHasData.fixedSubject }}</span>
  183. </div>
  184. <div class="basic_block">
  185. <span class="title">资产清理额:</span>
  186. <span class="desc">{{ mapHasData.fixedValue }}</span>
  187. </div>
  188. <div class="basic_block">
  189. <span class="title">购置凭证ID:</span>
  190. <span class="desc">{{ mapHasData.voucherId }}</span>
  191. </div>-->
  192. </div>
  193. </div>
  194. </div>
  195. </div>
  196. </div>
  197. <van-dialog v-model="dialogVisible">
  198. <img width="100%" :src="dialogImageUrl" alt="">
  199. </van-dialog>
  200. </div>
  201. </template>
  202. <style scoped lang="scss">
  203. .homestead_main {
  204. height: 100vh;
  205. display: flex;
  206. display: -webkit-flex;
  207. display: -ms-flexbox;
  208. display: -moz-box;
  209. flex-direction: column;
  210. position: relative;
  211. }
  212. #mapAll {
  213. height: 100vh;
  214. position: absolute;
  215. left: 0;
  216. top: 0;
  217. width: 100vw;
  218. }
  219. .fileList{
  220. img{
  221. width: 8vw;
  222. height: 8vw;
  223. margin-right: 20px;
  224. }
  225. }
  226. .flex3 {
  227. flex: 0.5;
  228. overflow: hidden; /*超出部分隐藏*/
  229. white-space: nowrap; /*不换行*/
  230. text-overflow: ellipsis; /*超出部分文字以...显示*/
  231. }
  232. .plotPremises_right {
  233. width: 98%;
  234. position: fixed;
  235. z-index: 1001;
  236. top: 50%;
  237. transform: translateY(-50%);
  238. right: 0;
  239. display: flex;
  240. // display: none;
  241. min-width: 300px;
  242. /*height: calc(100% - 104px);*/
  243. flex-direction: column;
  244. .topTrimLine {
  245. width: 100%;
  246. height: 8px;
  247. background: url("../../assets/images/homestead/header_border.png")
  248. no-repeat;
  249. background-size: 100% 100%;
  250. position: absolute;
  251. top: -4px;
  252. left: 0;
  253. }
  254. .land_information_main {
  255. flex: 1;
  256. display: flex;
  257. // align-items: center;
  258. .area_information {
  259. // margin-bottom: 3%;
  260. flex: 1.5;
  261. position: relative;
  262. display: flex;
  263. .mian {
  264. background: rgba(25, 29, 24, 0.7);
  265. /*background: rgba(255, 255, 255, 0.7);*/
  266. // background: url("../../assets/images/dataScreen/plotPremises/left_top_img.png")
  267. // no-repeat;
  268. // background-size: 100% 100%;
  269. padding: 3%;
  270. flex: 1;
  271. display: flex;
  272. flex-direction: column;
  273. .area_title {
  274. margin: 0;
  275. font-size: 22px;
  276. color: #38da94;
  277. }
  278. .basic_information {
  279. position: relative;
  280. flex: 1;
  281. display: flex;
  282. flex-direction: column;
  283. .basic_block {
  284. font-size: 15px;
  285. color: #47c68f;
  286. flex: 1;
  287. .van-row{
  288. display:flex;
  289. flex-wrap: wrap;
  290. .van-col{
  291. padding: 1% 0 1% 2%;
  292. border-top: 1px solid #fff;
  293. border-left: 1px solid #fff;
  294. &:last-child{
  295. border-right: 1px solid #fff;
  296. }
  297. }
  298. &:last-child{
  299. .van-col{
  300. &:last-child{
  301. border-bottom: 1px solid #fff;
  302. }
  303. }
  304. }
  305. }
  306. .title {
  307. color: #fff;
  308. padding-right: 8px;
  309. }
  310. }
  311. .patternmaking {
  312. position: absolute;
  313. right: 2%;
  314. bottom: 16%;
  315. .img_block {
  316. margin-top: 8px;
  317. &:first-child {
  318. margin-top: 0;
  319. }
  320. }
  321. p {
  322. margin: 0;
  323. font-size: 0;
  324. img {
  325. width: 78px;
  326. height: 60px;
  327. }
  328. }
  329. }
  330. .gl_main{
  331. margin-top: .8vh;
  332. height: 28.15vh;
  333. padding:0.92vh 0 0 0;
  334. .headers {
  335. height: 3.24vh;
  336. font-size: 1.48vh;
  337. color: #0befca;
  338. text-align: center;
  339. display: flex;
  340. justify-content: center;
  341. align-items: center;
  342. background: rgba(11,239,202,.3);
  343. padding-right: 0.53vw;
  344. margin-bottom: 1vh;
  345. .flex_left{
  346. text-align: left;
  347. padding-left: 0.83vw;
  348. }
  349. }
  350. .desc_main{
  351. height: 21.5vh;
  352. overflow-y: scroll;
  353. padding-right: 0.3vw;
  354. box-sizing:border-box;
  355. .analysisTable_list {
  356. margin: 0;
  357. padding: 0;
  358. flex: 1;
  359. display: flex;
  360. flex-direction: column;
  361. .flex_left{
  362. text-align: left;
  363. padding-left: 0.83vw;
  364. box-sizing:border-box;
  365. }
  366. .flex_item {
  367. height: 2.77vh;
  368. list-style: none;
  369. margin: 0;
  370. display: flex;
  371. justify-content: center;
  372. align-items: center;
  373. text-align: center;
  374. color: #fff;
  375. font-size: 1.29vh;
  376. position: relative;
  377. // border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  378. // &:hover {
  379. // background: rgba(8, 85, 255, 0.6);
  380. // }
  381. &:nth-child(2n){
  382. background: rgba(53, 125, 250, 0.1);
  383. }
  384. }
  385. }
  386. }
  387. }
  388. }
  389. .area_data {
  390. padding: 4% 0;
  391. display: flex;
  392. justify-content: space-between;
  393. flex-wrap: wrap;
  394. border-bottom: 1px solid #62655d;
  395. .details_block {
  396. width: 33.33%;
  397. &.line {
  398. margin-bottom: 2%;
  399. }
  400. p {
  401. margin: 0;
  402. }
  403. .m_title {
  404. color: #bbb;
  405. font-size: 12px;
  406. padding-bottom: 5px;
  407. }
  408. .m_desc {
  409. color: #fff;
  410. font-size: 14px;
  411. }
  412. }
  413. }
  414. .farmhouse_table {
  415. padding: 4% 0 2%;
  416. .header_main {
  417. display: block;
  418. overflow: hidden;
  419. .farmhouse_title {
  420. margin: 0;
  421. font-size: 14px;
  422. color: #fff;
  423. float: left;
  424. }
  425. .farmhouse_ul {
  426. font-size: 12px;
  427. margin: 0;
  428. float: right;
  429. color: #fff;
  430. padding: 0;
  431. padding-right: 5px;
  432. li {
  433. float: left;
  434. margin-left: 9px;
  435. list-style: none;
  436. cursor: pointer;
  437. padding: 0;
  438. &.active {
  439. color: #87cf9a;
  440. border-bottom: 1px solid #87cf9a;
  441. }
  442. }
  443. }
  444. }
  445. }
  446. }
  447. }
  448. }
  449. }
  450. </style>
  451. <script>
  452. import {
  453. getPermanentList,
  454. getResourceList,
  455. assetPropertyDetail,
  456. assetResourceDetail,
  457. openAttachmentList
  458. } from "@/api/sunVillage_info/fixedAssets";
  459. import {getQueryLand} from "@/api/sunVillage_info/homestead/application";
  460. export default {
  461. components: {
  462. getPermanentList,
  463. getResourceList,
  464. getQueryLand
  465. },
  466. data() {
  467. return {
  468. situationW: 70,
  469. //地图判断
  470. openMap: false,
  471. mapTheGeomId: null,
  472. mapTheGeomResourceId: null,
  473. drawInsert:null,
  474. mapHasData:{},
  475. contractionList:[],
  476. //合同状态字典
  477. contractionStatuOptions:[],
  478. mapHaDataValue:false,
  479. mapHasDateStatus: 0, //0资源资产 1固定资产
  480. dialogVisible:false,
  481. dialogImageUrl:''
  482. };
  483. },
  484. mounted() {
  485. let mapTheGeomAll =this.$cookies.get("bookId");
  486. console.info(mapTheGeomAll);
  487. getPermanentList(mapTheGeomAll).then((response) => {
  488. if (response.code == 200) {
  489. this.mapTheGeomId = response.data;
  490. }
  491. });
  492. getResourceList(mapTheGeomAll).then((response) => {
  493. if (response.code == 200) {
  494. this.mapTheGeomResourceId = response.data;
  495. setTimeout(() => {
  496. this.GetMapsInit();
  497. }, 500);
  498. }
  499. });
  500. },
  501. methods: {
  502. openImage(url){
  503. this.dialogImageUrl = url;
  504. this.dialogVisible = true;
  505. },
  506. lookName(val){
  507. this.$toast(val);
  508. },
  509. //地图加载 -----start
  510. GetMapsInit() {
  511. this.getDicts("contraction_status").then((response) => {
  512. this.contractionStatuOptions = response.data;
  513. });
  514. //加载地图编辑
  515. var that = this;
  516. var map;
  517. //矢量标注样式设置函数,设置image为图标ol.style.Icon
  518. function createLabelStyle() {
  519. return new ol.style.Style({
  520. image: new ol.style.Icon({
  521. //设置图标偏移
  522. anchor: [0.5, 1],
  523. //标注样式的起点位置
  524. anchorOrigin: "top-right",
  525. //X方向单位:分数
  526. anchorXUnits: "fraction",
  527. //Y方向单位:像素
  528. anchorYUnits: "pixels",
  529. //偏移起点位置的方向
  530. offsetOrigin: "top-right",
  531. //透明度
  532. opacity: 0.9,
  533. //图片路径
  534. src: require("../../assets/images/homestead/mark.png"),
  535. }),
  536. text: new ol.style.Text({
  537. textAlign: "center", //位置
  538. textBaseline: "middle", //基准线
  539. font: "normal 12px 微软雅黑", //文字样式
  540. //text: "标注点", //文本内容
  541. fill: new ol.style.Fill({
  542. //文本填充样式(即文字颜色)
  543. color: "#ff0000",
  544. }),
  545. }),
  546. zIndex: 9999,
  547. });
  548. }
  549. // document.getElementById("mapAll").innerHTML = '';
  550. var hc_land;
  551. var vector_drawing;
  552. var projection = new ol.proj.Projection({
  553. //地图投影类型
  554. code: "EPSG:3857",
  555. units: "degrees",
  556. //extent:extent
  557. });
  558. var aerial = new ol.layer.Tile({
  559. source: new ol.source.XYZ({
  560. url: "http://t0.tianditu.gov.cn/img_w/wmts?" +
  561. "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
  562. "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
  563. }),
  564. isGroup: true,
  565. name: "卫星影像图",
  566. });
  567. var yingxzi = new ol.layer.Tile({
  568. source: new ol.source.XYZ({
  569. url: "https://t0.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
  570. }),
  571. isGroup: true,
  572. name: "天地图文字标注--卫星影像图",
  573. });
  574. //加载地图
  575. map = new ol.Map({
  576. controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
  577. layers: [aerial, yingxzi],
  578. projection: projection,
  579. target: "mapAll",
  580. view: new ol.View({
  581. //center: ol.proj.fromLonLat([115.452752, 31.789033]),
  582. zoom: 15,
  583. minZoom: 0, //地图缩小限制
  584. maxZoom: 18.3, //地图放大限制
  585. }),
  586. });
  587. //判断当前账套是否有数据
  588. var mapTalkAbout = true;
  589. //图层查询固定资产定位开始 ---------start
  590. if(this.mapTheGeomId.length >0) {
  591. for (var i = 0; this.mapTheGeomId.length > i; i++) {
  592. if (this.mapTheGeomId[i] != null && this.mapTheGeomId[i].theGeom != null && this.mapTheGeomId[i].theGeom != "") {
  593. mapTalkAbout =false;
  594. var theGeomMap = this.mapTheGeomId[i].theGeom.replace("Point", "MultiPolygon");
  595. var pointLeft = theGeomMap.replace("[", "[[[[");
  596. var pointRight = pointLeft.replace("]", "]]]]");
  597. hc_land = new ol.layer.Vector({
  598. title: "add Layer",
  599. source: new ol.source.Vector({
  600. projection: projection,
  601. features: new ol.format.GeoJSON().readFeatures("{\n" +
  602. " \"type\": \"Feature\",\n" +
  603. " \"geometry\":" + pointRight +", \"properties\":" + JSON.stringify(this.mapTheGeomId[i]) + "}"),
  604. }),
  605. style: new ol.style.Style({
  606. fill: new ol.style.Fill({
  607. //矢量图层填充颜色,以及透明度
  608. color: "rgba(204, 255, 204,0.3)",
  609. }),
  610. stroke: new ol.style.Stroke({
  611. //边界样式
  612. color: "#47c68f",
  613. width: 3,
  614. }),
  615. }),
  616. });
  617. map.addLayer(hc_land);
  618. var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX;
  619. var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY;
  620. var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX;
  621. var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY;
  622. //定位查询位置
  623. var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  624. var newcenterFeature = new ol.Feature({
  625. geometry: new ol.geom.Point(center), //几何信息
  626. name: "标注点",
  627. properties: hc_land.values_.source.featuresRtree_.rbush_.data.children
  628. });
  629. var sourceMapLook = new ol.source.Vector({wrapX: false});
  630. vector_drawing = new ol.layer.Vector({
  631. source: sourceMapLook,
  632. });
  633. map.addLayer(vector_drawing);
  634. newcenterFeature.setStyle(createLabelStyle()); //设置要素样式
  635. sourceMapLook.addFeature(newcenterFeature);
  636. map.getView().animate({
  637. // 只设置需要的属性即可
  638. center: center, // 中心点
  639. zoom: 15.8, // 缩放级别
  640. rotation: undefined, // 缩放完成view视图旋转弧度
  641. duration: 1000, // 缩放持续时间,默认不需要设置
  642. });
  643. }
  644. }
  645. }
  646. //图层查询固定资产定位结束 ---------end
  647. //图层查询资源性资产定位开始 ---------start
  648. if(this.mapTheGeomResourceId.length >0) {
  649. for (var i = 0; this.mapTheGeomResourceId.length > i; i++) {
  650. if (this.mapTheGeomResourceId[i] !=null && this.mapTheGeomResourceId[i].theGeom != null && this.mapTheGeomResourceId[i].theGeom != "") {
  651. mapTalkAbout =false;
  652. hc_land = new ol.layer.Vector({
  653. title: "add Layer",
  654. source: new ol.source.Vector({
  655. projection: projection,
  656. features: new ol.format.GeoJSON().readFeatures("{\n" +
  657. " \"type\": \"Feature\",\n" +
  658. " \"geometry\":" + this.mapTheGeomResourceId[i].theGeom + ", \"properties\":" + JSON.stringify(this.mapTheGeomResourceId[i]) + "}"),
  659. }),
  660. style: new ol.style.Style({
  661. fill: new ol.style.Fill({
  662. //矢量图层填充颜色,以及透明度
  663. color: "rgba(204, 255, 204,0.3)",
  664. }),
  665. stroke: new ol.style.Stroke({
  666. //边界样式
  667. color: "#47c68f",
  668. width: 3,
  669. }),
  670. }),
  671. });
  672. map.addLayer(hc_land);
  673. var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX;
  674. var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY;
  675. var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX;
  676. var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY;
  677. //定位查询位置
  678. var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  679. map.getView().animate({
  680. // 只设置需要的属性即可
  681. center: center, // 中心点
  682. zoom: 15.8, // 缩放级别
  683. rotation: undefined, // 缩放完成view视图旋转弧度
  684. duration: 1000, // 缩放持续时间,默认不需要设置
  685. });
  686. }
  687. }
  688. }
  689. //图层查询资源性资产定位开始 ---------end
  690. //点击查询详细信息
  691. map.on("singleclick", function (evt) {
  692. let feature = map.forEachFeatureAtPixel(
  693. evt.pixel,
  694. (feature) => feature
  695. );
  696. if(feature) {
  697. var ifConsole = feature.values_.name;
  698. if (ifConsole !="标注点") {
  699. assetResourceDetail(feature.values_.id, {translate_dict: 1}).then((resp) => {
  700. that.contractionList = resp.data.params.contractionAssetList;
  701. that.mapHaDataValue = true;
  702. });
  703. let obj = {};
  704. that.mapHasDateStatus = 0;
  705. obj.code = feature.values_.code;//资源编码
  706. obj.name = feature.values_.name;//资源名称
  707. obj.totalArea = feature.values_.totalArea; //总面积
  708. obj.location = feature.values_.location; //坐落位置
  709. obj.east = feature.values_.east; //东至
  710. obj.west = feature.values_.west; //西至
  711. obj.south = feature.values_.south; //南至
  712. obj.north = feature.values_.north; //北至
  713. obj.sumArea = feature.values_.sumArea; //未利用地=集体经营+出租经营+其他经营
  714. obj.groupArea = feature.values_.groupArea; //面积-集体经营
  715. obj.groupValue = feature.values_.groupValue; //年收益-集体经营
  716. obj.rentArea = feature.values_.rentArea; //面积-出租经营(合同写入的)
  717. obj.rentValue = feature.values_.rentValue; //年租金-出租经营(合同写入的)
  718. obj.rentLessee = feature.values_.rentLessee; //承租人-出租经营(合同写入的)
  719. obj.rentStartTime = feature.values_.rentStartTime; //开始时间-出租经营(合同写入的)
  720. obj.rentEndTime = feature.values_.rentEndTime; //到期时间-出租经营(合同写入的)
  721. obj.otherArea = feature.values_.otherArea; //面积-其他经营
  722. obj.otherValue = feature.values_.otherValue; //年收益-其他经营
  723. obj.farmerArea = feature.values_.farmerArea; //已承包到户总面积
  724. obj.circulationArea = feature.values_.circulationArea; //面积-流转入集体统一经营
  725. obj.circulationValue = feature.values_.circulationValue; //年收益-流转入集体统一经营
  726. obj.investmentArea = feature.values_.investmentArea; //面积-对外投资
  727. obj.investmentValue = feature.values_.investmentValue; //年收益-对外投资
  728. obj.investmentLessee = feature.values_.investmentLessee; //投资对象-对外投资
  729. obj.investmentStartTime = feature.values_.investmentStartTime; //开始时间-对外投资
  730. obj.investmentEndTime = feature.values_.investmentEndTime; //到期时间-对外投资
  731. obj.resourceType = feature.values_.resourceType; //资产类型
  732. obj.status = feature.values_.status; //资产状态
  733. obj.useType = feature.values_.useType; //使用情况
  734. obj.remark = feature.values_.remark; //备注
  735. //资源资产字典项
  736. that.getDicts("resource_type").then(response => {
  737. var resourceTypeOptions = response.data;
  738. if(obj.resourceType !=null && obj.resourceType !="") {
  739. for (var i = 0; resourceTypeOptions.length > i; i++) {
  740. if (obj.resourceType == resourceTypeOptions[i].dictValue) {
  741. obj.resourceType = resourceTypeOptions[i].dictLabel;
  742. break;
  743. }
  744. }
  745. }
  746. });
  747. //使用情况字典项
  748. that.getDicts("use_type").then(response => {
  749. var useTypeOptions = response.data;
  750. if(obj.useType !=null && obj.useType !="") {
  751. for (var i = 0; useTypeOptions.length > i; i++) {
  752. if (obj.useType == useTypeOptions[i].dictValue) {
  753. obj.useType = useTypeOptions[i].dictLabel;
  754. break;
  755. }
  756. }
  757. }
  758. });
  759. //资产状态字典项
  760. that.getDicts("sys_normal_disable").then(response => {
  761. var statusOptions = response.data;
  762. if(obj.status !=null && obj.status !="") {
  763. for (var i = 0; statusOptions.length > i; i++) {
  764. if (obj.status == statusOptions[i].dictValue) {
  765. obj.status = statusOptions[i].dictLabel;
  766. break;
  767. }
  768. }
  769. }
  770. });
  771. obj.fileList = [];
  772. let parmasData = {
  773. tableId: feature.values_.id,
  774. tableName: 't_asset_resource',
  775. bizPath: 'asset',
  776. };
  777. openAttachmentList(parmasData).then((res) => {
  778. if (res.code == 200) {
  779. res.rows.map(rr=>{
  780. obj.fileList.push({
  781. url:'/api'+rr.fileUrl
  782. })
  783. })
  784. }
  785. });
  786. console.log(obj)
  787. that.mapHasData = obj;
  788. } else {
  789. let obj = {};
  790. assetPropertyDetail(feature.values_.properties[0].value.values_.id, {translate_dict: 1}).then((resp) => {
  791. that.contractionList = resp.data.params.contractionAssetList;
  792. that.mapHaDataValue = true;
  793. });
  794. that.mapHasDateStatus = 1;
  795. obj.code = feature.values_.properties[0].value.values_.code;//资源编码
  796. obj.name = feature.values_.properties[0].value.values_.name;//资源名称
  797. obj.buildTime = feature.values_.properties[0].value.values_.buildTime; //构建时间
  798. obj.location = feature.values_.properties[0].value.values_.location; //坐落位置
  799. obj.specification = feature.values_.properties[0].value.values_.specification; //规格型号
  800. obj.supplier = feature.values_.properties[0].value.values_.supplier; //供应商
  801. obj.quantity = feature.values_.properties[0].value.values_.quantity; //数量/建筑面积
  802. //obj.unit = feature.values_.properties[0].value.values_.unit; //计量单位
  803. obj.originalValue = feature.values_.properties[0].value.values_.originalValue; //原值
  804. obj.netValue = feature.values_.properties[0].value.values_.netValue; //净值(原值-累计折旧)
  805. obj.residualsRate = feature.values_.properties[0].value.values_.residualsRate; //残值率 N%
  806. obj.netSalvage = feature.values_.properties[0].value.values_.netSalvage; //净残值(原值*残值率)
  807. obj.expectedYears = feature.values_.properties[0].value.values_.expectedYears; //预计使用年数
  808. obj.perYearDepreciationValue = feature.values_.perYearDepreciationValue; //每年折旧额:(原值-净残值)/ 预计使用年数
  809. obj.depreciationYears = feature.values_.properties[0].value.values_.depreciationYears; //已折旧年数
  810. obj.depreciationValue = feature.values_.properties[0].value.values_.depreciationValue; //累计折旧(已提折旧):每年折旧额*已折旧年数
  811. obj.depreciationSubject = feature.values_.properties[0].value.values_.depreciationSubject; //折旧科目(152:累计折旧)
  812. obj.depreciationFeeSubject = feature.values_.properties[0].value.values_.depreciationFeeSubject; //折旧费用科目(541005:管理费用-折旧及修理费)
  813. obj.fixedSubject = feature.values_.properties[0].value.values_.fixedSubject; //资产清理科目(153:固定资产清理)
  814. obj.fixedValue = feature.values_.properties[0].value.values_.fixedValue; //资产清理额
  815. obj.voucherId = feature.values_.properties[0].value.values_.voucherId; //购置凭证ID
  816. obj.assetType = feature.values_.properties[0].value.values_.assetType; //资产类别
  817. obj.operationType = feature.values_.properties[0].value.values_.operationType; //经营属性
  818. obj.addType = feature.values_.properties[0].value.values_.addType; //增加方式
  819. obj.useType = feature.values_.properties[0].value.values_.useType; //使用情况
  820. obj.depreciationType = feature.values_.properties[0].value.values_.depreciationType; //折旧方式
  821. obj.assetStatus = feature.values_.properties[0].value.values_.assetStatus; //资产状态
  822. obj.unit = feature.values_.properties[0].value.values_.unit; //计量单位
  823. obj.fileList = [];
  824. let parmasData = {
  825. tableId: feature.values_.properties[0].value.values_.id,
  826. tableName: 't_asset_permanent',
  827. bizPath: 'asset',
  828. };
  829. openAttachmentList(parmasData).then((res) => {
  830. if (res.code == 200) {
  831. res.rows.map(rr=>{
  832. obj.fileList.push({
  833. url:'/api'+rr.fileUrl
  834. })
  835. })
  836. }
  837. });
  838. //固定资产字典项
  839. that.getDicts("asset_type").then((response) => {
  840. var assetTypeOptions = response.data;
  841. if(obj.assetType !=null && obj.assetType !=""){
  842. for(var i=0;assetTypeOptions.length >i; i++){
  843. if(obj.assetType == assetTypeOptions[i].dictValue) {
  844. obj.assetType = assetTypeOptions[i].dictLabel;
  845. break;
  846. }
  847. }
  848. }
  849. });
  850. that.getDicts("operation_type").then((response) => {
  851. var operationTypeOptions = response.data;
  852. if(obj.operationType !=null && obj.operationType !="") {
  853. for (var i = 0; operationTypeOptions.length > i; i++) {
  854. if (obj.operationType == operationTypeOptions[i].dictValue) {
  855. obj.operationType = operationTypeOptions[i].dictLabel;
  856. break;
  857. }
  858. }
  859. }
  860. });
  861. that.getDicts("add_type").then((response) => {
  862. var addTypeOptions = response.data;
  863. if(obj.addType !=null && obj.addType !="") {
  864. for (var i = 0; addTypeOptions.length > i; i++) {
  865. if (obj.addType == addTypeOptions[i].dictValue) {
  866. obj.addType = addTypeOptions[i].dictLabel;
  867. break;
  868. }
  869. }
  870. }
  871. });
  872. that.getDicts("use_type").then((response) => {
  873. var useTypeOptions = response.data;
  874. if(obj.useType !=null && obj.useType !="") {
  875. for (var i = 0; useTypeOptions.length > i; i++) {
  876. if (obj.useType == useTypeOptions[i].dictValue) {
  877. obj.useType = useTypeOptions[i].dictLabel;
  878. break;
  879. }
  880. }
  881. }
  882. });
  883. that.getDicts("depreciation_type").then((response) => {
  884. var depreciationTypeOptions = response.data;
  885. if(obj.depreciationType !=null && obj.depreciationType !="") {
  886. for (var i = 0; depreciationTypeOptions.length > i; i++) {
  887. if (obj.depreciationType == depreciationTypeOptions[i].dictValue) {
  888. obj.depreciationType = depreciationTypeOptions[i].dictLabel;
  889. break;
  890. }
  891. }
  892. }
  893. });
  894. that.getDicts("asset_status").then((response) => {
  895. var assetStatusOptions = response.data;
  896. if(obj.assetStatus !=null && obj.assetStatus !="") {
  897. for (var i = 0; assetStatusOptions.length > i; i++) {
  898. if (obj.assetStatus == assetStatusOptions[i].dictValue) {
  899. obj.assetStatus = assetStatusOptions[i].dictLabel;
  900. break;
  901. }
  902. }
  903. }
  904. });
  905. that.getDicts("fixed_assets_unit").then((response) => {
  906. var unitOptions = response.data;
  907. if(obj.unit !=null && obj.unit !="") {
  908. for (var i = 0; unitOptions.length > i; i++) {
  909. if (obj.unit == unitOptions[i].dictValue) {
  910. obj.unit = unitOptions[i].dictLabel;
  911. break;
  912. }
  913. }
  914. }
  915. });
  916. that.mapHasData = obj;
  917. }
  918. }else {
  919. that.mapHaDataValue = false;
  920. }
  921. });
  922. //当前账套没有任何空间数据
  923. if(mapTalkAbout){
  924. let deptName = this.$store.state.user.loginDeptId + "";
  925. getQueryLand(deptName).then((response) => {
  926. if (response.code == 200) {
  927. let InsertCode = response.data;
  928. if (InsertCode != null) {
  929. var lat = InsertCode.lat;
  930. var lng = InsertCode.lng;
  931. var center;
  932. if(lat !=null && lng !=null && lat !="" && lng !=""){
  933. center = [lng,lat];
  934. }else {
  935. center =[115.452752, 31.789033];
  936. }
  937. map.getView().animate({
  938. // 只设置需要的属性即可
  939. center: ol.proj.fromLonLat(center), // 中心点
  940. zoom: 17.9, // 缩放级别
  941. rotation: undefined, // 缩放完成view视图旋转弧度
  942. duration: 1000, // 缩放持续时间,默认不需要设置
  943. });
  944. }
  945. }
  946. });
  947. }
  948. },
  949. },
  950. };
  951. </script>