移动端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 

5497 rivejä
230 KiB

  1. <template>
  2. <div class="app-container">
  3. <van-sticky>
  4. <div class="bannerBg" style="">
  5. <van-nav-bar
  6. style="background:transparent;border-bottom-width:0;"
  7. @click-left="onClickLeft"
  8. @click-right="showUploadList"
  9. >
  10. <template #left>
  11. <van-icon name="arrow-left" size=".5rem" color="#fff" />
  12. </template>
  13. <template #right>
  14. <van-icon v-if="$cookies.get('upload')!=null&&$cookies.get('upload')==1" name="photo-o" size=".5rem" color="#fff"/>
  15. </template>
  16. <template #title>
  17. <p style="color:#fff">{{item.deptName}}</p>
  18. </template>
  19. </van-nav-bar>
  20. <van-popup v-model:show="showImageList" position="bottom" style="height:40vh;padding:50px 10px 0" closeable
  21. close-icon="close">
  22. <p style="color:#000;position:absolute;top:0.426667rem;left:0.426667rem">图片上传</p>
  23. <div style="width:100%;height:calc( 40vh - 100px);overflow-y: scroll;">
  24. <van-uploader v-model="uploadImgList" :after-read="beforeReadImageList" @delete="deleteFileImageList" multiple :max-count="50" />
  25. </div>
  26. <van-row justify="space-around" style=" position:fixed;bottom:0;left:0;width:100%;height:50px;text-align: center;">
  27. <van-col span="12"><van-button type="primary" style="width:100px;" round @click="uploadImgList = [],uploadImgList1 = []">清空</van-button></van-col>
  28. <van-col span="12"><van-button type="primary" style="width:100px;" round @click="submitUploadList">上传</van-button></van-col>
  29. </van-row>
  30. </van-popup>
  31. <div style="display:flex;width:95%;margin:0 auto;justify-content:space-between;padding: 0px 0 15px">
  32. <div :class="{activeBtn : activeBtn==1,disactiveBtn :activeBtn!=1 }" @click="$router.push({path:'/homesteadSurvey/list'})">入户核查</div>
  33. <div :class="{activeBtn : activeBtn==2,disactiveBtn :activeBtn!=2 }" @click="$router.push({path:'/homesteadSurvey/list2'})">农户信息</div>
  34. <div :class="{activeBtn : activeBtn==3,disactiveBtn :activeBtn!=3 }" @click="$router.push({path:'/homesteadSurvey/list3'})">所有权人</div>
  35. <div :class="{activeBtn : activeBtn==4,disactiveBtn :activeBtn!=4 }" @click="$router.push({path:'/homesteadSurvey/list4'})">切换地图</div>
  36. </div>
  37. </div>
  38. <div style="background:#fff;padding:10px 2.5%;display: flex;justify-content: space-between;">
  39. <div style="text-align:center;background: rgba(122,201,67,0.2);width: 49%;font-size: 14px;border-radius: 8px;display: flex;align-items: center;justify-content: center;padding: 2px 0;">
  40. <img src="../../assets/images/housesteadSurvey/list01.png" alt="">
  41. <p style="margin-left: 10px;">
  42. <span style="color:#60B722;line-height:.8rem;">总户数:</span>
  43. <span style="color:#60B722;line-height:.8rem;"><span style="font-size:16px;color: #448815;">{{totalH}}</span> 户</span>
  44. </p>
  45. </div>
  46. <div style="text-align:center;background: rgba(122,201,67,0.2);width: 49%;font-size: 14px;border-radius: 8px;display: flex;align-items: center;justify-content: center;padding: 2px 0;">
  47. <img src="../../assets/images/housesteadSurvey/list02.png" alt="">
  48. <p style="margin-left: 10px;">
  49. <span style="color:#60B722;line-height:.8rem">总人数:</span>
  50. <span style="color:#60B722;line-height:.8rem"><span style="font-size:16px;color: #448815;">{{totalR}}</span> 人</span>
  51. </p>
  52. </div>
  53. </div>
  54. </van-sticky>
  55. <!--<van-pull-refresh v-model="isLoadingnh" @refresh="onRefreshnh">-->
  56. <div style="margin:30px auto 0;width: 95%;">
  57. <p class="title" style="position:relative;padding-left:10px;line-height:20px;font-size: 16px;margin-bottom: 5px;">户内成员</p>
  58. </div>
  59. <van-cell v-for="(item,index) in hncylist" :key="index" size="small" style="border-radius: 16px;box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.16); width:95%;margin:15px auto 0;">
  60. <template #title>
  61. <div style="display: flex;align-items: center;">
  62. <p style="display: flex;align-items: center;">
  63. <img src="../../assets/images/housesteadSurvey/list03.png" alt="" style="margin-right: 5px;">
  64. <span style="line-height: 1;">{{item.xm}}</span>
  65. </p>
  66. <p style="display: flex;align-items: center;color:#22B7F2;font-size:12px;margin-left: auto;margin-right: 10px;border-bottom: 1px dashed #22B7F2;" @click="showPopuphncylist(item)"><img src="../../assets/images/housesteadSurvey/list09.png" alt="" style="margin-right: 3px;">成员详情</p>
  67. <p style="display: flex;align-items: center;color:#FA5353;font-size:12px;border-bottom: 1px dashed #FA5353;" @click="deletenh(item,index)"><img src="../../assets/images/housesteadSurvey/list08.png" alt="" style="margin-right: 3px;">删除</p>
  68. </div>
  69. </template>
  70. <template #label>
  71. <p style="display: flex;align-items: center;margin-top: 10px;"><img src="../../assets/images/housesteadSurvey/list04.png" alt="" style="margin-right: 5px;">与户主关系:<span style="margin-left: auto;">{{yhzgxfy(item.yhzgx)}}</span> </p>
  72. <p style="display: flex;align-items: center;margin-top: 10px;"><img src="../../assets/images/housesteadSurvey/list04.png" alt="" style="margin-right: 5px;">证件号码:<span style="margin-left: auto;">{{item.zjhm}}</span> </p>
  73. <p style="display: flex;align-items: center;margin-top: 5px;"><img src="../../assets/images/housesteadSurvey/list05.png" alt="" style="margin-right: 5px;">农户代码:<span style="margin-left: auto;">{{item.nhdm}}</span></p>
  74. </template>
  75. </van-cell>
  76. <!-- </van-pull-refresh>-->
  77. <div style=" width:95%;margin:20px auto;display: flex;justify-content: space-between;">
  78. <div style="width:49%;text-align:center;overflow:auto;border-radius: 16px;box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.16);padding: 15px 0px;background: #ffffff;color: #22B7F2;">
  79. <p style="font-size: 16px;" @click="addPopupnhcy()">+ 添加成员信息</p>
  80. </div>
  81. </div>
  82. </div>
  83. </template>
  84. <script>
  85. import {getQueryLand,getZjdzd,delZjdzdInfo,uploadFile,submitUploadImageList} from "@/api/homesteadSurvey/zjdzd";
  86. import {addNh, delNh, exportNh, getNh, listNh, updateNh,setNhInfo} from "@/api/homesteadSurvey/nh";
  87. import {addNhhncy, delNhhncy, exportNhhncy, getNhhncy, listNhhncy, updateNhhncy} from "@/api/homesteadSurvey/nhhncy";
  88. import {listShyqr,setSyqrInfo} from "@/api/homesteadSurvey/shyqr";
  89. import {listSuyqr,updateSuyqr,addSuyqr} from "@/api/homesteadSurvey/suyqr";
  90. import {listZrz,getZrzZjdDmList,getZrz} from "@/api/homesteadSurvey/zrz";
  91. import {listFsss,getFsssZjdDmList,getFsss} from "@/api/homesteadSurvey/fsss";
  92. import {getGeoServerConfigKey} from "@/api/system/config";
  93. import { listTown, getTown } from "@/api/homesteadSurvey/town";
  94. import { listVillage} from "@/api/homesteadSurvey/village";
  95. import {deptGetId,} from "@/api/homestead/index";
  96. import $ from "jquery";
  97. import {Dialog} from "vant";
  98. import {ref} from "vue";
  99. import axios from "axios";
  100. export default {
  101. name: "hncyList2",
  102. data() {
  103. return {
  104. loading1:false,
  105. finished1:false,
  106. loading2:false,
  107. finished2:false,
  108. loading3:false,
  109. finished3:false,
  110. //全部
  111. qbNums:0,
  112. //已调查数量
  113. yhcNums:0,
  114. //未核查数量
  115. whcNums:0,
  116. // 总户数
  117. totalH:0,
  118. // 总人数
  119. totalR:0,
  120. zjdSx:true,
  121. zrzSx :true,
  122. fsssSx:true,
  123. showhncysjly:false,
  124. showhzsjly:false,
  125. showhncycybz:false,
  126. showhncyzjlx:false,
  127. showhncyyhzgx:false,
  128. showhzjzhcssfyzf:false,
  129. showhncyoccupation:false,
  130. showhncyjzqk:false,
  131. showhzoccupation:false,
  132. showhzjzqk:false,
  133. // 下拉刷新
  134. isLoadingnh:false,
  135. countnh:0,
  136. isLoadingzjd:false,
  137. countqb:1,
  138. countyhc:1,
  139. countwhc:1,
  140. // 使用权人表单弹出
  141. shownh:false,
  142. showhzht:false,
  143. showhzlx:false,
  144. showhncylist:false,
  145. showhncy:false,
  146. activeBtn:2,
  147. value:'',
  148. // 宅基地搜索框
  149. zjdvalue:"",
  150. // 使用权人搜索框
  151. nhvalue:"",
  152. active:2,
  153. // 全部列表
  154. list:[],
  155. // 已核查列表
  156. list1:[],
  157. // 未核查列表
  158. list2:[],
  159. // 户主列表
  160. nhlist:[],
  161. // 户内成员表单
  162. form5: {},
  163. // 户内成员列表
  164. hncylist:[],
  165. currentRate:20,
  166. // 使用权人
  167. nhform:[],
  168. // 户主列表
  169. hzform:{},
  170. // 权利人列表
  171. qlrform:[],
  172. // 权利人性质弹出框
  173. showsuyqxz:false,
  174. // 代理人证件类型弹出框
  175. showdlrzjlx:false,
  176. // 代表人证件类型弹出框
  177. showdbrzjlx:false,
  178. // 数据来源弹出框
  179. showsjly:false,
  180. // 证件类型字典
  181. zjlxOptions: [],
  182. // 所有权性质字典
  183. suyqxzOption: [],
  184. // 婚姻状况字典
  185. hyzkOptions:[],
  186. // 数据来源字典
  187. sjlyOptions:[],
  188. // 居住情况字典
  189. jzqkOptions:[],
  190. // 与户主关系字典
  191. yhzgxOptions:[],
  192. // 职业字典
  193. occupationOptions:[],
  194. // 集镇或城市是否有住房字典
  195. jzhcssfyzfOptions:[],
  196. // 成员备注字典
  197. cybzOptions:[],
  198. columns:[],
  199. show1:false,
  200. showhzzjlx: false,
  201. // 路由传过来的任务基本信息。
  202. item: {},
  203. //地图使用 --start
  204. openMap: false,
  205. mapTheGeomZrzId: null,
  206. mapTheGeomZjdId: null,
  207. mapTheGeomFsssId: null,
  208. drawInsert:null,
  209. mapZjdData:"",
  210. mapZrzData:"",
  211. mapFsssData:"",
  212. mapZjdDataTure:"",
  213. mapZjdTeAll:{
  214. active:"",
  215. mapZjdAData:{},
  216. mapZrzAData:{},
  217. mapFsssAData:{},
  218. },
  219. mapHaDataValue:false,
  220. mapHasDateStatus: 0, //0附属设施 1自然幢 2宅基地
  221. selectionIconShow:false,
  222. homesteadListStatus:false,
  223. //地图绘制状态
  224. draw: {
  225. drawMapPolygon: false, //绘制地图
  226. },
  227. mapTownList: null,
  228. mapVillageList: null,
  229. coordinate:"",
  230. checked:['zjdSx', 'zrzSx', 'fsssSx'],
  231. checkAllMap: false,
  232. sx:"",
  233. drawingClick:true,
  234. //搜索---start
  235. seachText: "",
  236. //搜索栏目-操作栏显隐
  237. searchBarOperVisbile: false,
  238. mapDataAll: [],
  239. showSearch:false,
  240. bottomHeight:'0px',
  241. //搜索---end
  242. //测面
  243. textMjAll:"",
  244. clickBbox:"",
  245. textMjAllNum:"",
  246. //核查
  247. zjdHcDy:"",
  248. //绘图
  249. htZjdZrzFsss:"",
  250. //筛选
  251. checkAllFlag: true,
  252. CheckedAllArr: [],//全选数组
  253. dataForm: {
  254. imageUrl: []
  255. },
  256. dataList: [["fsssSx"],["zjdSx"],["zrzSx"]], //地图使用 --end
  257. checkBoxAll:[],
  258. //地图跳转存之
  259. mapAddJump:"",
  260. mapAddJumpNum:"",
  261. nhdm:"",
  262. backTheGeom:"",
  263. //地图服务地址
  264. mapGeoServerUrl:"",
  265. backMap:"",
  266. // 任务完成标记
  267. //宅基地点击事件
  268. mapXs: false,
  269. mapClick:"",
  270. isFinished:false,
  271. //
  272. showImageList:false,
  273. uploadImgList:[],
  274. uploadImgList1:[],
  275. // 字典列表json
  276. dictTypeList:null,
  277. };
  278. },
  279. mounted(){
  280. },
  281. created(){
  282. axios.get('../static/dictyType.json').then(res => {
  283. this.dictTypeList = res.data
  284. this.zjlxOptions = this.dictTypeList.zjlx;
  285. this.suyqxzOptions = this.dictTypeList.qsxz;
  286. this.sjlyOptions = this.dictTypeList.sjly;
  287. this.hyzkOptions = this.dictTypeList.hyzk;
  288. this.occupationOptions = this.dictTypeList.occupation;
  289. this.jzqkOptions = this.dictTypeList.living_condition;
  290. this.jzhcssfyzfOptions = this.dictTypeList.jzhcssfyzf;
  291. this.cybzOptions = this.dictTypeList.member_remark;
  292. })
  293. this.item = JSON.parse(localStorage.getItem("surveyItem"));
  294. this.shyqrData = this.$route.query;
  295. this.getNh(this.shyqrData.nhdm);
  296. this.getDicts("family_status").then(response => {
  297. var arr = [];
  298. response.data.forEach(function (item) {
  299. arr.push(item)
  300. });
  301. this.yhzgxOptions = arr;
  302. });
  303. if(this.$cookies.get("search") != null && this.$cookies.get("search") !="" && this.$cookies.get("search")!=undefined){
  304. if(this.$cookies.get("search").activeBtn !=null){
  305. if(this.$cookies.get("search").activeBtn == 4){
  306. // if(location.href.indexOf("#reloaded")==-1){
  307. // location.href=location.href+"#reloaded";
  308. // location.reload();
  309. // }
  310. this.activeBtn = this.$cookies.get("search").activeBtn;
  311. this.mapAddJump = this.$cookies.get("search").backMapZjdAData.deptId;
  312. this.backTheGeom = this.$cookies.get("search").backMapZjdAData.theGeom;
  313. this.mapZjdData = this.$cookies.get("search").backMapZjdAData;
  314. this.mapZjdTeAll.mapZjdAData = this.$cookies.get("search").backMapZjdAData;
  315. this.mapClick = this.mapZjdTeAll.mapZjdAData.zjddm;
  316. this.mapXs =true;
  317. this.zjdHcDy = 1;
  318. this.mapZjdDataTure = 1;
  319. this.mapAddJumpNum =1;
  320. this.mapShow();
  321. this.getZjdList();
  322. this.getTotalHR();
  323. if(this.item.taskStatus=="FINISHED"){
  324. this.isFinished = true
  325. }else{
  326. this.isFinished = false
  327. }
  328. }
  329. }else {
  330. this.getZjdList();
  331. this.getTotalHR();
  332. if(this.item.taskStatus=="FINISHED"){
  333. this.isFinished = true
  334. }else{
  335. this.isFinished = false
  336. }
  337. }
  338. }else {
  339. this.getZjdList();
  340. this.getTotalHR();
  341. if(this.item.taskStatus=="FINISHED"){
  342. this.isFinished = true
  343. }else{
  344. this.isFinished = false
  345. }
  346. }
  347. },
  348. methods: {
  349. showUploadList(){
  350. this.showImageList = true;
  351. },
  352. submitUploadList(){
  353. submitUploadImageList(this.uploadImgList1).then(res => {
  354. let _this = this
  355. this.$toast({
  356. icon: 'success', // 找到自己需要的图标
  357. message: '上传成功',
  358. duration:"1000",
  359. onClose:function(){
  360. _this.showImageList = false
  361. }
  362. })
  363. })
  364. },
  365. // 图片上传前
  366. beforeReadImageList(file){
  367. let _this = this
  368. if(file.length!=undefined){
  369. file.map(res => {
  370. let zjddm = res.file.name
  371. //zjddm=zjddm.substring(0,zjddm.lastIndexOf("\("));
  372. // 创建Canvas对象(画布)
  373. let canvas = document.createElement('canvas')
  374. // 获取对应的CanvasRenderingContext2D对象(画笔)
  375. let context = canvas.getContext('2d')
  376. // 创建新的图片对象
  377. let img = new Image()
  378. // 指定图片的DataURL(图片的base64编码数据)
  379. img.src = res.content
  380. // 监听浏览器加载图片完成,然后进行进行绘制
  381. img.onload = () => {
  382. /*const h = img.height
  383. const w = img.width*/
  384. let ch = img.height/5
  385. let cw = img.width/5
  386. let canvas = document.createElement('canvas')
  387. let ctx = canvas.getContext('2d')
  388. canvas.height = ch
  389. canvas.width = cw
  390. ctx.clearRect(0,0,cw,ch)
  391. ctx.drawImage(img,0,0,cw,ch)
  392. let base_img = canvas.toDataURL('image/jpeg')
  393. let blobBin = atob(base_img.split(',')[1])
  394. let d = []
  395. for (let i=0;i<blobBin.length;i++){
  396. d.push(blobBin.charCodeAt(i))
  397. }
  398. let data2 = new FormData();
  399. data2.append("file", new Blob([new Uint8Array(d)],{type:'image/jpeg'}));
  400. uploadFile(data2).then(response => {
  401. let p={
  402. "zjddm":zjddm,
  403. "url":response.fileName
  404. }
  405. _this.uploadImgList1.push(p)
  406. })
  407. }
  408. })
  409. }else{
  410. let zjddm = file.file.name
  411. //zjddm=zjddm.substring(0,zjddm.lastIndexOf("\("));
  412. // 创建Canvas对象(画布)
  413. let canvas = document.createElement('canvas')
  414. // 获取对应的CanvasRenderingContext2D对象(画笔)
  415. let context = canvas.getContext('2d')
  416. // 创建新的图片对象
  417. let img = new Image()
  418. // 指定图片的DataURL(图片的base64编码数据)
  419. img.src = file.content
  420. // 监听浏览器加载图片完成,然后进行进行绘制
  421. img.onload = () => {
  422. /*const h = img.height
  423. const w = img.width*/
  424. let ch = img.height/5
  425. let cw = img.width/5
  426. let canvas = document.createElement('canvas')
  427. let ctx = canvas.getContext('2d')
  428. canvas.height = ch
  429. canvas.width = cw
  430. ctx.clearRect(0,0,cw,ch)
  431. ctx.drawImage(img,0,0,cw,ch)
  432. let base_img = canvas.toDataURL('image/jpeg')
  433. let blobBin = atob(base_img.split(',')[1])
  434. let d = []
  435. for (let i=0;i<blobBin.length;i++){
  436. d.push(blobBin.charCodeAt(i))
  437. }
  438. let data2 = new FormData();
  439. data2.append("file", new Blob([new Uint8Array(d)],{type:'image/jpeg'}));
  440. uploadFile(data2).then(response => {
  441. let p={
  442. "zjddm":zjddm,
  443. "url":response.fileName
  444. }
  445. _this.uploadImgList1.push(p)
  446. })
  447. }
  448. }
  449. },
  450. deleteFileImageList(file){
  451. let url = file.file.name
  452. this.uploadImgList1.map((res,index) => {
  453. if(res.zjddm==url){
  454. this.uploadImgList1.remove(index);
  455. }
  456. })
  457. },
  458. validatorIdcardqlr(val){
  459. if(this.qlrform.dbrzjlx=='01'){
  460. if(this.vcheckID(val)){
  461. return true
  462. }else {
  463. return false
  464. }
  465. }else{
  466. return true
  467. }
  468. },
  469. validatorIdcardnh(val){
  470. if(this.nhform.hzzjlx=='01'){
  471. if(this.vcheckID(val)){
  472. return true
  473. }else {
  474. return false
  475. }
  476. }else{
  477. return true
  478. }
  479. },
  480. validatorIdcardhncy(val){
  481. if(this.form5.zjlx=='01'){
  482. if(this.vcheckID(val)){
  483. return true
  484. }else {
  485. return false
  486. }
  487. }else{
  488. return true
  489. }
  490. },
  491. checkCode(val) {
  492. var p = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
  493. var factor = [ 7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2 ];
  494. var parity = [ 1, 0, 'X', 9, 8, 7, 6, 5, 4, 3, 2 ];
  495. var code = val.substring(17);
  496. if(p.test(val)) {
  497. var sum = 0;
  498. for(var i=0;i<17;i++) {
  499. sum += val[i]*factor[i];
  500. }
  501. if(parity[sum % 11] == code.toUpperCase()) {
  502. return true;
  503. }
  504. }
  505. return false;
  506. },
  507. checkDate (val) {
  508. var pattern = /^(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)$/;
  509. if(pattern.test(val)) {
  510. var year = val.substring(0, 4);
  511. var month = val.substring(4, 6);
  512. var date = val.substring(6, 8);
  513. var date2 = new Date(year+"-"+month+"-"+date);
  514. if(date2 && date2.getMonth() == (parseInt(month) - 1)) {
  515. return true;
  516. }
  517. }
  518. return false;
  519. },
  520. checkProv(val) {
  521. var pattern = /^[1-9][0-9]/;
  522. var provs = {11:"北京",12:"天津",13:"河北",14:"山西",15:"内蒙古",21:"辽宁",22:"吉林",23:"黑龙江 ",31:"上海",32:"江苏",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山东",41:"河南",42:"湖北 ",43:"湖南",44:"广东",45:"广西",46:"海南",50:"重庆",51:"四川",52:"贵州",53:"云南",54:"西藏 ",61:"陕西",62:"甘肃",63:"青海",64:"宁夏",65:"新疆",71:"台湾",81:"香港",82:"澳门"};
  523. if(pattern.test(val)) {
  524. if(provs[val]) {
  525. return true;
  526. }
  527. }
  528. return false;
  529. },
  530. vcheckID(val){
  531. if(this.checkCode(val)) {
  532. var date = val.substring(6,14);
  533. if(this.checkDate(date)) {
  534. if(this.checkProv(val.substring(0,2))) {
  535. return true;
  536. }
  537. }
  538. }
  539. return false;
  540. },
  541. deleteZjd(item,index){
  542. Dialog.confirm({
  543. title: '警告',
  544. message: '将删除与此宅基地关联的使用权人,自然幢,房屋,附属设施等所有信息,同时删除后无法恢复,确认删除么?',
  545. })
  546. .then(() => {
  547. // on confirm
  548. delZjdzdInfo(item).then(res => {
  549. if(res.code=="200"){
  550. if(this.active==1){
  551. this.list1.splice(index,1);
  552. }else if(this.active==2){
  553. this.list2.splice(index,1);
  554. }else{
  555. this.list.splice(index,1);
  556. }
  557. }
  558. })
  559. })
  560. .catch(() => {
  561. // on cancel
  562. });
  563. },
  564. //删除户主
  565. deletenh(item,index){
  566. Dialog.confirm({
  567. title: '警告',
  568. message: '确认删除户内成员么?',
  569. })
  570. .then(() => {
  571. // on confirm
  572. delNhhncy(item.id).then(res => {
  573. if(res.code=="200"){
  574. this.hncylist.splice(index,1);
  575. }
  576. })
  577. })
  578. .catch(() => {
  579. // on cancel
  580. });
  581. },
  582. // 设为户主
  583. setNh(item,index){
  584. Dialog.confirm({
  585. title: '警告',
  586. message: '此操作将删除原户主,并将此成员设为新户主,是否确认操作?',
  587. })
  588. .then(() => {
  589. // on confirm
  590. delNhhncy(item.id).then(res => {
  591. if(res.code=="200"){
  592. this.hncylist.splice(index,1);
  593. this.totalR--
  594. }
  595. })
  596. // 更新户主信息
  597. let pnh = {
  598. deptId : item.deptId,
  599. nhdm : item.nhdm,
  600. hzxm:item.xm,
  601. hzzjlx :item.zjlx,
  602. hzzjhm :item.zjhm
  603. }
  604. setNhInfo(pnh).then(res => {
  605. })
  606. // 更新使用权人
  607. let psyqr = {
  608. deptId : item.deptId,
  609. nhdm : item.nhdm,
  610. shyqrdbxm : item.xm,
  611. shyqrdbzjlx : item.zjlx,
  612. shyqrdbzjhm : item.zjhm,
  613. xb : item.xb
  614. }
  615. setSyqrInfo(psyqr).then(res => {
  616. })
  617. })
  618. .catch(() => {
  619. // on cancel
  620. });
  621. },
  622. //删除户内成员
  623. deletehncy(id,index){
  624. Dialog.confirm({
  625. title: '警告',
  626. message: '删除后无法恢复,确认删除此成员么?',
  627. })
  628. .then(() => {
  629. // on confirm
  630. delNhhncy(id).then(res => {
  631. if(res.code=="200"){
  632. this.hncylist.splice(index,1);
  633. this.totalR--
  634. }
  635. })
  636. })
  637. .catch(() => {
  638. // on cancel
  639. });
  640. },
  641. // 字数限制
  642. limitWords(val){
  643. if(val==null||val==""){
  644. return "无"
  645. }else{
  646. if(val.length>11){
  647. val = val.slice(0,10) +"..."
  648. }
  649. return val
  650. }
  651. },
  652. // 与户主关系翻译
  653. yhzgxfy(value){
  654. let label
  655. this.yhzgxOptions.map(res => {
  656. if(res.dictValue == value){
  657. label = res.dictLabel
  658. }
  659. })
  660. return label
  661. },
  662. onRefreshzjd(){
  663. this.isLoadingzjd = false;
  664. let _this = this
  665. if(this.active==1&&this.loading2){
  666. let params = {
  667. "deptId" : this.item.deptId,
  668. "houseDataConfirmStatus" : "CONFIRMED",
  669. "pageNum": this.countyhc+1,
  670. "pageSize":10,
  671. }
  672. listZjdzd(params).then((response) => {
  673. if(response.rows.length>0&&this.list1.length<response.total){
  674. response.rows.map(res => {
  675. this.list1.push(res)
  676. })
  677. this.countyhc++
  678. this.loading2 = false
  679. }else{
  680. this.loading2 = false
  681. this.finished2 = true
  682. }
  683. });
  684. }else if(this.active==2&&this.loading3){
  685. let params = {
  686. "deptId" : this.item.deptId,
  687. "houseDataConfirmStatus" : "UNCONFIRMED",
  688. "pageNum": this.countwhc+1,
  689. "pageSize":10,
  690. }
  691. listZjdzd(params).then((response) => {
  692. if(response.rows.length>0&&this.list2.length<response.total){
  693. response.rows.map(res => {
  694. this.list2.push(res)
  695. })
  696. this.countwhc++
  697. this.loading3 = false
  698. }else{
  699. this.finished3 = true
  700. }
  701. });
  702. }else if(this.active==0&&this.loading1){
  703. let params = {
  704. "deptId" : this.item.deptId,
  705. "pageNum": this.countqb+1,
  706. "pageSize":10,
  707. }
  708. listZjdzd(params).then((response) => {
  709. if(response.rows.length>0&&this.list.length<response.total){
  710. response.rows.map(res => {
  711. _this.list.push(res)
  712. })
  713. this.countqb++
  714. this.loading1 = false
  715. }else{
  716. this.finished1 = true
  717. }
  718. });
  719. }
  720. },
  721. getTotalHR(){
  722. let params = {
  723. "pageNum": 1,
  724. "pageSize":10,
  725. }
  726. listNh(params).then((response) => {
  727. if(response.rows.length>=0){
  728. this.totalH = response.total
  729. }
  730. listNhhncy(params).then((res) => {
  731. if(res.rows.length>=0){
  732. this.totalR = res.total + this.totalH
  733. }
  734. });
  735. });
  736. },
  737. onRefreshnh(){
  738. this.isLoadingnh = false
  739. let params = {
  740. "deptId" : this.item.deptId,
  741. "pageNum": this.countnh+1,
  742. "pageSize":10,
  743. }
  744. listNh(params).then((response) => {
  745. if(response.rows.length>0&&this.nhlist.length<response.total){
  746. response.rows.map(res => {
  747. this.nhlist.unshift(res)
  748. })
  749. this.countnh++
  750. }
  751. });
  752. },
  753. setCookies(item){
  754. //this.$cookies.set("search",JSON.stringify(item));
  755. this.$cookies.set("search","");
  756. // let _this = this
  757. // setTimeout(function(){
  758. // _this.$router.push({name:'homesteadAdd'});
  759. // },1000)
  760. this.$router.push({path:'/homesteadSurvey/add',query: {res: item}});
  761. },
  762. // 入户核查搜索框新增。
  763. onClickzjd(){
  764. this.$cookies.remove("search");
  765. this.$router.push({name:'homesteadAdd'});
  766. },
  767. // 农户信息搜索框新增。
  768. onClicknh(){
  769. this.shownh = true;
  770. let params = {
  771. "deptId" : this.item.deptId
  772. }
  773. this.qlrform={}
  774. this.nhform={
  775. "suyqrdm":null,
  776. "deptId":this.item.deptId,
  777. "hzzjlx":'01',
  778. "hzzjlxName":"身份证",
  779. "hyzk":'02',
  780. "occupation":'1',
  781. "occupationName":'务农',
  782. "jzqk":'3',
  783. "jzqkName":'常年居住',
  784. "jzhcssfyzf":'1',
  785. "jzhcssfyzfName":'无住房',
  786. "zqtczsfyzf":'Y',
  787. "sfbccm":'Y',
  788. "sfpkh":'N',
  789. "sfwbh":'N',
  790. "sjly":'07',
  791. "sjlyName":'农村集体产权制度改革',
  792. }
  793. listSuyqr(params).then((response) => {
  794. if(response.rows.length>0){
  795. this.qlrform = response.rows[0]
  796. this.nhform.suyqrdm = this.qlrform.suyqrdm
  797. this.nhform.txdz = response.rows[0].suyqrmc
  798. }
  799. });
  800. },
  801. // 返回
  802. onClickLeft(){
  803. this.$cookies.set("search","")
  804. this.$router.push({name: this.$router.back(-1)});
  805. },
  806. onConfirmhncysjly(value){
  807. this.form5.sjlyName = value.dictLabel
  808. this.form5.sjly = value.dictValue
  809. this.showhncysjly= false
  810. },
  811. onConfirmhzsjly(value){
  812. this.nhform.sjlyName = value.dictLabel
  813. this.nhform.sjly = value.dictValue
  814. this.showhzsjly= false
  815. },
  816. onConfirmhncycybz(value){
  817. this.form5.cybzName = value.dictLabel
  818. this.form5.cybz = value.dictValue
  819. this.showhncycybz= false
  820. },
  821. onConfirmhzjzhcssfyzf(value){
  822. this.nhform.jzhcssfyzfName = value.dictLabel
  823. this.nhform.jzhcssfyzf = value.dictValue
  824. this.showhzjzhcssfyzf= false
  825. },
  826. onConfirmhncyyhzgx(value){
  827. this.form5.yhzgxName = value.dictLabel
  828. this.form5.yhzgx = value.dictValue
  829. this.showhncyyhzgx = false
  830. },
  831. onConfirmhncyzjlx(value){
  832. this.form5.zjlxName = value.dictLabel
  833. this.form5.zjlx = value.dictValue
  834. this.showhncyzjlx = false
  835. },
  836. onConfirmhncyjzqk(value){
  837. this.form5.jzqkName = value.dictLabel
  838. this.form5.jzqk = value.dictValue
  839. this.showhncyjzqk = false
  840. },
  841. onConfirmhzjzqk(value){
  842. this.nhform.jzqkName = value.dictLabel
  843. this.nhform.jzqk = value.dictValue
  844. this.showhzjzqk = false
  845. },
  846. onConfirmhncyoccupation(value){
  847. this.form5.occupationName = value.dictLabel
  848. this.form5.occupation = value.dictValue
  849. this.showhncyoccupation = false
  850. },
  851. onConfirmhzoccupation(value){
  852. this.nhform.occupationName = value.dictLabel
  853. this.nhform.occupation = value.dictValue
  854. this.showhzoccupation = false
  855. },
  856. onConfirmhzzjlx(value){
  857. this.nhform.hzzjlxName = value.dictLabel
  858. this.nhform.hzzjlx = value.dictValue
  859. this.showhzzjlx = false
  860. },
  861. onConfirmdbrzjlx(value){
  862. this.qlrform.dbrzjlxName = value.dictLabel
  863. this.qlrform.dbrzjlx = value.dictValue
  864. this.showdbrzjlx = false
  865. },
  866. onConfirmsuyqxz(value){
  867. this.qlrform.suyqxzName = value.dictLabel
  868. this.qlrform.suyqxz = value.dictValue
  869. this.showsuyqxz = false
  870. },
  871. onConfirmdlrzjlx(value){
  872. this.qlrform.dlrzjlxName = value.dictLabel
  873. this.qlrform.dlrzjlx = value.dictValue
  874. this.showdlrzjlx = false
  875. },
  876. onConfirmsjly(value){
  877. this.qlrform.sjlyName = value.dictLabel
  878. this.qlrform.sjly = value.dictValue
  879. this.showsjly = false
  880. },
  881. // 户主保存
  882. onSubmitnh(){
  883. if(this.nhform.id!=null){
  884. updateNh(this.nhform).then(
  885. response => {
  886. let _this =this
  887. this.$toast({
  888. icon: 'success', // 找到自己需要的图标
  889. message: '修改成功',
  890. duration:"1000",
  891. onClose:function(){
  892. _this.getNh()
  893. let psyqr = {
  894. deptId : _this.nhform.deptId,
  895. nhdm : _this.nhform.nhdm,
  896. shyqrdbxm : _this.nhform.hzxm,
  897. shyqrdbzjlx : _this.nhform.hzzjlx,
  898. shyqrdbzjhm : _this.nhform.hzzjhm,
  899. dh : _this.nhform.phone,
  900. dz : _this.nhform.txdz
  901. }
  902. setSyqrInfo(psyqr).then(res => {
  903. _this.shownh = false
  904. })
  905. }
  906. })
  907. }
  908. );
  909. }else{
  910. this.nhform.deptId = this.item.deptId
  911. addNh(this.nhform).then(
  912. response => {
  913. this.totalR+=1
  914. this.totalH+=1
  915. let _this =this
  916. this.$toast({
  917. icon: 'success', // 找到自己需要的图标
  918. message: '保存成功',
  919. duration:"1000",
  920. onClose:function(){
  921. _this.shownh = false
  922. _this.getNh()
  923. }
  924. })
  925. }
  926. );
  927. }
  928. },
  929. // 所有权人保存
  930. onSubmitsyqr(){
  931. if(this.qlrform.id!=null){
  932. updateSuyqr(this.qlrform).then(
  933. response => {
  934. let _this =this
  935. this.$toast({
  936. icon: 'success', // 找到自己需要的图标
  937. message: '修改成功',
  938. duration:"1000"
  939. })
  940. }
  941. );
  942. }else{
  943. this.qlrform.deptId = this.item.deptId
  944. addSuyqr(this.qlrform).then(
  945. response => {
  946. let _this =this
  947. this.$toast({
  948. icon: 'success', // 找到自己需要的图标
  949. message: '保存成功',
  950. duration:"1000"
  951. })
  952. }
  953. );
  954. }
  955. },
  956. // 查询所有权人
  957. getSyqr(){
  958. //删除地图选中状态
  959. $("#deleteHistoryMap").trigger("click");
  960. let params = {
  961. "deptId" : this.item.deptId
  962. }
  963. this.qlrform ={
  964. "deptId":this.item.deptId,
  965. "suyqxz":'40',
  966. "suyqxzName":'集体土地所有权',
  967. "dbrzjlx":'01',
  968. "dbrzjlxName":'身份证',
  969. "sfclncjtjjzz":'Y',
  970. "sjly":'04',
  971. "sjlyName":"农村宅基地使用权确权登记发证"
  972. }
  973. listSuyqr(params).then((response) => {
  974. if(response.rows.length>0){
  975. this.qlrform = response.rows[0]
  976. if(this.qlrform.suyqxz==null||this.qlrform.suyqxz==""){
  977. this.qlrform.suyqxz = "40"
  978. this.qlrform.suyqxzName = "集体土地所有权"
  979. }
  980. if(this.qlrform.dbrzjlx==null||this.qlrform.dbrzjlx==""){
  981. this.qlrform.dbrzjlx = "01"
  982. this.qlrform.dbrzjlxName = "身份证"
  983. }
  984. if(this.qlrform.sfclncjtjjzz==null||this.qlrform.sfclncjtjjzz==""){
  985. this.qlrform.sfclncjtjjzz = "Y"
  986. }
  987. if(this.qlrform.sjly==null||this.qlrform.sjly==""){
  988. this.qlrform.sjly = "04"
  989. this.qlrform.sjlyName = "农村宅基地使用权确权登记发证"
  990. }
  991. this.zjlxOptions.map(res => {
  992. if(res.dictValue == this.qlrform.dbrzjlx){
  993. this.qlrform.dbrzjlxName = res.dictLabel
  994. }
  995. if(res.dictValue == this.qlrform.dlrzjlx){
  996. this.qlrform.dlrzjlxName = res.dictLabel
  997. }
  998. })
  999. this.suyqxzOptions.map(res => {
  1000. if(res.dictValue == this.qlrform.suyqxz){
  1001. this.qlrform.suyqxzName = res.dictLabel
  1002. }
  1003. })
  1004. this.sjlyOptions.map(res => {
  1005. if(res.dictValue == this.qlrform.sjly){
  1006. this.qlrform.sjlyName = res.dictLabel
  1007. }
  1008. })
  1009. }
  1010. });
  1011. this.mapZjdData = "";
  1012. this.mapZrzData = "";
  1013. this.mapFsssData = "";
  1014. //that.mapZjdTeAll.active ="1";
  1015. this.mapZjdTeAll.mapZjdAData = {};
  1016. this.mapZjdTeAll.mapZrzAData = {};
  1017. this.mapZjdTeAll.mapFsssAData = {};
  1018. this.mapZjdDataTure = "";
  1019. this.mapXs =false;
  1020. this.mapClick ="";
  1021. this.mapAddJump = "";
  1022. this.backTheGeom = "";
  1023. this.zjdHcDy = "";
  1024. this.mapZjdDataTure = "";
  1025. this.mapAddJumpNum ="";
  1026. },
  1027. // 查询农户列表
  1028. getNh(val){
  1029. //删除地图选中状态
  1030. $("#deleteHistoryMap").trigger("click");
  1031. console.info(this.item.deptId);
  1032. let params = {
  1033. dept:this.item.deptId,
  1034. nhdm : val
  1035. }
  1036. listNhhncy(params).then((response) => {
  1037. this.hncylist = response.rows
  1038. this.hncylist.map(function(item){
  1039. item.y
  1040. });
  1041. this.totalN = response.total
  1042. });
  1043. this.mapZjdData = "";
  1044. this.mapZrzData = "";
  1045. this.mapFsssData = "";
  1046. //that.mapZjdTeAll.active ="1";
  1047. this.mapZjdTeAll.mapZjdAData = {};
  1048. this.mapZjdTeAll.mapZrzAData = {};
  1049. this.mapZjdTeAll.mapFsssAData = {};
  1050. this.mapZjdDataTure = "";
  1051. this.mapXs =false;
  1052. this.mapClick ="";
  1053. this.mapAddJump = "";
  1054. this.backTheGeom = "";
  1055. this.zjdHcDy = "";
  1056. this.mapZjdDataTure = "";
  1057. this.mapAddJumpNum ="";
  1058. },
  1059. //调查
  1060. getDc(){
  1061. //删除地图选中状态
  1062. $("#deleteHistoryMap").trigger("click");
  1063. this.mapZjdData = "";
  1064. this.mapZrzData = "";
  1065. this.mapFsssData = "";
  1066. //that.mapZjdTeAll.active ="1";
  1067. this.mapZjdTeAll.mapZjdAData = {};
  1068. this.mapZjdTeAll.mapZrzAData = {};
  1069. this.mapZjdTeAll.mapFsssAData = {};
  1070. this.mapZjdDataTure = "";
  1071. this.mapXs =false;
  1072. this.mapClick ="";
  1073. this.mapAddJump = "";
  1074. this.backTheGeom = "";
  1075. this.zjdHcDy = "";
  1076. this.mapZjdDataTure = "";
  1077. this.mapAddJumpNum ="";
  1078. },
  1079. // 宅基地搜索框
  1080. onSearchzjd(){
  1081. if(this.active==1){
  1082. let params = {
  1083. "deptId" : this.item.deptId,
  1084. "houseDataConfirmStatus" : "CONFIRMED",
  1085. "syqr" : this.zjdvalue
  1086. }
  1087. listZjdzd(params).then((response) => {
  1088. if (response.code == 200) {
  1089. this.list1 = response.rows
  1090. }
  1091. });
  1092. }else if(this.active==2){
  1093. let params = {
  1094. "deptId" : this.item.deptId,
  1095. "houseDataConfirmStatus" : "UNCONFIRMED",
  1096. "syqr" : this.zjdvalue
  1097. }
  1098. listZjdzd(params).then((response) => {
  1099. if (response.code == 200) {
  1100. this.list2 = response.rows
  1101. }
  1102. });
  1103. }else{
  1104. let params = {
  1105. "deptId" : this.item.deptId,
  1106. "syqr" : this.zjdvalue
  1107. }
  1108. listZjdzd(params).then((response) => {
  1109. if (response.code == 200) {
  1110. this.list = response.rows
  1111. }
  1112. });
  1113. }
  1114. },
  1115. // 户内成员弹窗
  1116. showPopuphncy(item){
  1117. this.showhncy = true
  1118. if(item.id==null||item.id==""){
  1119. this.form5 = {
  1120. "nhdm":this.nhdm,
  1121. "deptId":this.item.deptId,
  1122. "zjlx":'01',
  1123. "zjlxName":"身份证",
  1124. "yhzgx":"14",
  1125. "yhzgxName":"妻",
  1126. "hyzk":'02',
  1127. "hklx":'1',
  1128. "occupation":'1',
  1129. "occupationName":'务农',
  1130. "jzqk":'3',
  1131. "jzqkName":'常年居住',
  1132. "sfbjtjjzzcy":'Y',
  1133. "xb":'0',
  1134. "sfbccm":'Y',
  1135. "sfpkh":'N',
  1136. "sfwbh":'N',
  1137. "sjly":'07',
  1138. "sjlyName":'农村集体产权制度改革',
  1139. "cybz":'9',
  1140. "cybzName":'其他备注'
  1141. }
  1142. }else{
  1143. let _this = this
  1144. this.form5 = item
  1145. if(this.form5.nhdm==null||this.form5.nhdm==""){
  1146. this.form5.nhdm = this.nhform.nhdm
  1147. }
  1148. if(this.form5.deptId==null||this.form5.deptId==""){
  1149. this.form5.deptId = this.nhform.deptId
  1150. }
  1151. if(this.form5.zjlx==null||this.form5.zjlx==""){
  1152. this.form5.zjlx = "01"
  1153. this.form5.zjlxName = "身份证"
  1154. }
  1155. if(this.form5.yhzgx==null||this.form5.yhzgx==""){
  1156. this.form5.yhzgx = "14"
  1157. this.form5.yhzgxName = "妻"
  1158. }
  1159. if(this.form5.hyzk==null||this.form5.hyzk==""){
  1160. this.form5.hyzk = "02"
  1161. }
  1162. if(this.form5.hklx==null||this.form5.hklx==""){
  1163. this.form5.hklx = "1"
  1164. }
  1165. if(this.form5.occupation==null||this.form5.occupation==""){
  1166. this.form5.occupation = "1"
  1167. this.form5.occupationName = "务农"
  1168. }
  1169. if(this.form5.jzqk==null||this.form5.jzqk==""){
  1170. this.form5.jzqk = "3"
  1171. this.form5.jzqkName = "常年居住"
  1172. }
  1173. if(this.form5.sfbjtjjzzcy==null||this.form5.sfbjtjjzzcy==""){
  1174. this.form5.sfbjtjjzzcy = "Y"
  1175. }
  1176. if(this.form5.xb==null||this.form5.xb==""){
  1177. this.form5.xb = "0"
  1178. }
  1179. if(this.form5.sfbccm==null||this.form5.sfbccm==""){
  1180. this.form5.sfbccm = "Y"
  1181. }
  1182. if(this.form5.sfpkh==null||this.form5.sfpkh==""){
  1183. this.form5.sfpkh = "N"
  1184. }
  1185. if(this.form5.sfwbh==null||this.form5.sfwbh==""){
  1186. this.form5.sfwbh = "N"
  1187. }
  1188. if(this.form5.sjly==null||this.form5.sjly==""){
  1189. this.form5.sjly = "07"
  1190. this.form5.sjlyName = "农村集体产权制度改革"
  1191. }
  1192. if(this.form5.cybz==null||this.form5.cybz==""){
  1193. this.form5.cybz = "9"
  1194. this.form5.cybzName = "其他备注"
  1195. }
  1196. this.jzhcssfyzfOptions.map(res => {
  1197. if(res.dictValue == item.jzhcssfyzf){
  1198. this.form5.jzhcssfyzfName = res.dictLabel
  1199. }
  1200. })
  1201. this.zjlxOptions.map(res => {
  1202. if(res.dictValue == item.zjlx){
  1203. this.form5.zjlxName = res.dictLabel
  1204. }
  1205. })
  1206. this.occupationOptions.map(res => {
  1207. if(res.dictValue == item.occupation){
  1208. this.form5.occupationName = res.dictLabel
  1209. }
  1210. })
  1211. this.jzqkOptions.map(res => {
  1212. if(res.dictValue == item.jzqk){
  1213. this.form5.jzqkName = res.dictLabel
  1214. }
  1215. })
  1216. this.yhzgxOptions.map(res => {
  1217. if(res.dictValue == item.yhzgx){
  1218. this.form5.yhzgxName = res.dictLabel
  1219. }
  1220. })
  1221. this.cybzOptions.map(res => {
  1222. if(res.dictValue == item.cybz){
  1223. this.form5.cybzName = res.dictLabel
  1224. }
  1225. })
  1226. this.sjlyOptions.map(res => {
  1227. if(res.dictValue == item.sjly){
  1228. this.form5.sjlyName = res.dictLabel
  1229. }
  1230. })
  1231. }
  1232. },
  1233. // 户内成员列表
  1234. showPopuphncylist(item){
  1235. if(item.nhdm==null||item.nhdm==""){
  1236. this.$toast({
  1237. icon: 'error', // 找到自己需要的图标
  1238. message: '请先保存户主信息',
  1239. duration:"1000"
  1240. })
  1241. }else{
  1242. this.nhdm = item.nhdm
  1243. this.showhncylist = true
  1244. let params = {
  1245. "nhdm":item.nhdm,
  1246. "deptId":this.item.deptId
  1247. }
  1248. this.$router.push({name:'hncyDetails',query:{item}});
  1249. }
  1250. },
  1251. showPopupnh(item){
  1252. this.shownh = true
  1253. this.nhform = item
  1254. this.jzhcssfyzfOptions.map(res => {
  1255. if(res.dictValue == item.jzhcssfyzf){
  1256. this.nhform.jzhcssfyzfName = res.dictLabel
  1257. }
  1258. })
  1259. this.zjlxOptions.map(res => {
  1260. if(res.dictValue == item.hzzjlx){
  1261. this.nhform.hzzjlxName = res.dictLabel
  1262. }
  1263. })
  1264. this.occupationOptions.map(res => {
  1265. if(res.dictValue == item.occupation){
  1266. this.nhform.occupationName = res.dictLabel
  1267. }
  1268. })
  1269. this.jzqkOptions.map(res => {
  1270. if(res.dictValue == item.jzqk){
  1271. this.nhform.jzqkName = res.dictLabel
  1272. }
  1273. })
  1274. this.sjlyOptions.map(res => {
  1275. if(res.dictValue == item.sjly){
  1276. this.nhform.sjlyName = res.dictLabel
  1277. }
  1278. })
  1279. },
  1280. getZjdList(){
  1281. // let params1 = {
  1282. // "deptId" : this.item.deptId,
  1283. // "houseDataConfirmStatus" : "CONFIRMED",
  1284. // "pageNum": 1,
  1285. // "pageSize":10,
  1286. // }
  1287. // listZjdzd(params1).then((response) => {
  1288. // if (response.code == 200) {
  1289. // this.yhcNums = response.total
  1290. // this.list1 = response.rows
  1291. // }
  1292. // });
  1293. // let params2 = {
  1294. // "deptId" : this.item.deptId,
  1295. // "houseDataConfirmStatus" : "UNCONFIRMED",
  1296. // "pageNum": 1,
  1297. // "pageSize":10,
  1298. // }
  1299. // listZjdzd(params2).then((response) => {
  1300. // if (response.code == 200) {
  1301. // this.whcNums = response.total
  1302. // this.list2 = response.rows
  1303. // }
  1304. // });
  1305. },
  1306. // 与户主关系翻译
  1307. yhzgxfy(value){
  1308. let label
  1309. this.yhzgxOptions.map(res => {
  1310. if(res.dictValue == value){
  1311. label = res.dictLabel
  1312. }
  1313. })
  1314. return label
  1315. },
  1316. onConfirm(){},
  1317. /*onSubmithncy(){
  1318. if (this.form5.id != null) {
  1319. if (this.form5.zjlx=='01'&&parseInt(this.form5.zjhm.substr(16, 1)) % 2 == 1) {
  1320. if(this.form5.xb!='1'){
  1321. Dialog.confirm({
  1322. title: '警告',
  1323. message: '成员性别与身份证号中性别信息不符,是否继续保存?',
  1324. })
  1325. .then(() => {
  1326. // on confirm
  1327. updateNhhncy(this.form5).then(response => {
  1328. let _this =this
  1329. this.$toast({
  1330. icon: 'success', // 找到自己需要的图标
  1331. message: '修改成功',
  1332. duration:"1000",
  1333. onClose:function(){
  1334. _this.showhncy = false
  1335. let params = {
  1336. "nhdm":_this.form5.nhdm,
  1337. deptId:_this.form5.deptId
  1338. }
  1339. listNhhncy(params).then((response) => {
  1340. _this.hncylist = response.rows
  1341. })
  1342. }
  1343. })
  1344. });
  1345. })
  1346. .catch(() => {
  1347. // on cancel
  1348. });
  1349. }else{
  1350. updateNhhncy(this.form5).then(response => {
  1351. let _this =this
  1352. this.$toast({
  1353. icon: 'success', // 找到自己需要的图标
  1354. message: '修改成功',
  1355. duration:"1000",
  1356. onClose:function(){
  1357. _this.showhncy = false
  1358. let params = {
  1359. "nhdm":_this.form5.nhdm,
  1360. deptId:_this.form5.deptId
  1361. }
  1362. listNhhncy(params).then((response) => {
  1363. _this.hncylist = response.rows
  1364. })
  1365. }
  1366. })
  1367. });
  1368. }
  1369. } else {
  1370. if(this.form5.xb=='1'){
  1371. Dialog.confirm({
  1372. title: '警告',
  1373. message: '成员性别与身份证号中性别信息不符,是否继续保存?',
  1374. })
  1375. .then(() => {
  1376. // on confirm
  1377. updateNhhncy(this.form5).then(response => {
  1378. let _this =this
  1379. this.$toast({
  1380. icon: 'success', // 找到自己需要的图标
  1381. message: '修改成功',
  1382. duration:"1000",
  1383. onClose:function(){
  1384. _this.showhncy = false
  1385. let params = {
  1386. "nhdm":_this.form5.nhdm,
  1387. deptId:_this.form5.deptId
  1388. }
  1389. listNhhncy(params).then((response) => {
  1390. _this.hncylist = response.rows
  1391. })
  1392. }
  1393. })
  1394. });
  1395. })
  1396. .catch(() => {
  1397. // on cancel
  1398. });
  1399. }else{
  1400. updateNhhncy(this.form5).then(response => {
  1401. let _this =this
  1402. this.$toast({
  1403. icon: 'success', // 找到自己需要的图标
  1404. message: '修改成功',
  1405. duration:"1000",
  1406. onClose:function(){
  1407. _this.showhncy = false
  1408. let params = {
  1409. "nhdm":_this.form5.nhdm,
  1410. deptId:_this.form5.deptId
  1411. }
  1412. listNhhncy(params).then((response) => {
  1413. _this.hncylist = response.rows
  1414. })
  1415. }
  1416. })
  1417. });
  1418. }
  1419. }
  1420. } else {
  1421. if (this.form5.zjlx=='01'&&parseInt(this.form5.zjhm.substr(16, 1)) % 2 == 1) {
  1422. if(this.form5.xb!='1'){
  1423. Dialog.confirm({
  1424. title: '警告',
  1425. message: '成员性别与身份证号中性别信息不符,是否继续保存?',
  1426. })
  1427. .then(() => {
  1428. // on confirm
  1429. addNhhncy(this.form5).then(response => {
  1430. let _this =this
  1431. this.$toast({
  1432. icon: 'success', // 找到自己需要的图标
  1433. message: '保存成功',
  1434. duration:"1000",
  1435. onClose:function(){
  1436. _this.showhncy = false
  1437. _this.totalR+=1
  1438. _this.totalH+=1
  1439. let params = {
  1440. "nhdm":_this.form5.nhdm,
  1441. deptId:_this.form5.deptId
  1442. }
  1443. listNhhncy(params).then((response) => {
  1444. _this.hncylist = response.rows
  1445. })
  1446. }
  1447. })
  1448. });
  1449. })
  1450. .catch(() => {
  1451. // on cancel
  1452. });
  1453. }else{
  1454. addNhhncy(this.form5).then(response => {
  1455. let _this =this
  1456. this.$toast({
  1457. icon: 'success', // 找到自己需要的图标
  1458. message: '保存成功',
  1459. duration:"1000",
  1460. onClose:function(){
  1461. _this.showhncy = false
  1462. _this.totalR+=1
  1463. _this.totalH+=1
  1464. let params = {
  1465. "nhdm":_this.form5.nhdm,
  1466. deptId:_this.form5.deptId
  1467. }
  1468. listNhhncy(params).then((response) => {
  1469. _this.hncylist = response.rows
  1470. })
  1471. }
  1472. })
  1473. });
  1474. }
  1475. } else {
  1476. if(this.form5.xb=='1'){
  1477. Dialog.confirm({
  1478. title: '警告',
  1479. message: '成员性别与身份证号中性别信息不符,是否继续保存?',
  1480. })
  1481. .then(() => {
  1482. // on confirm
  1483. addNhhncy(this.form5).then(response => {
  1484. let _this =this
  1485. this.$toast({
  1486. icon: 'success', // 找到自己需要的图标
  1487. message: '保存成功',
  1488. duration:"1000",
  1489. onClose:function(){
  1490. _this.showhncy = false
  1491. _this.totalR+=1
  1492. _this.totalH+=1
  1493. let params = {
  1494. "nhdm":_this.form5.nhdm,
  1495. deptId:_this.form5.deptId
  1496. }
  1497. listNhhncy(params).then((response) => {
  1498. _this.hncylist = response.rows
  1499. })
  1500. }
  1501. })
  1502. });
  1503. })
  1504. .catch(() => {
  1505. // on cancel
  1506. });
  1507. }else{
  1508. addNhhncy(this.form5).then(response => {
  1509. let _this =this
  1510. this.$toast({
  1511. icon: 'success', // 找到自己需要的图标
  1512. message: '保存成功',
  1513. duration:"1000",
  1514. onClose:function(){
  1515. _this.showhncy = false
  1516. _this.totalR+=1
  1517. _this.totalH+=1
  1518. let params = {
  1519. "nhdm":_this.form5.nhdm,
  1520. deptId:_this.form5.deptId
  1521. }
  1522. listNhhncy(params).then((response) => {
  1523. _this.hncylist = response.rows
  1524. })
  1525. }
  1526. })
  1527. });
  1528. }
  1529. }
  1530. }
  1531. },*/
  1532. onSubmithncy(){
  1533. if (this.form5.id != null) {
  1534. if (this.form5.zjlx=='01'&&parseInt(this.form5.zjhm.substr(16, 1)) % 2 == 1) {
  1535. if(this.form5.xb!='1'){
  1536. Dialog.confirm({
  1537. title: '警告',
  1538. message: '成员性别与身份证号中性别信息不符,是否继续保存?',
  1539. })
  1540. .then(() => {
  1541. // on confirm
  1542. updateNhhncy(this.form5).then(response => {
  1543. let _this =this
  1544. this.$toast({
  1545. icon: 'success', // 找到自己需要的图标
  1546. message: '修改成功',
  1547. duration:"1000",
  1548. onClose:function(){
  1549. _this.showhncy = false
  1550. let params = {
  1551. "nhdm":_this.form5.nhdm,
  1552. deptId:_this.form5.deptId
  1553. }
  1554. listNhhncy(params).then((response) => {
  1555. _this.hncylist = response.rows
  1556. })
  1557. }
  1558. })
  1559. });
  1560. })
  1561. .catch(() => {
  1562. // on cancel
  1563. });
  1564. }else{
  1565. updateNhhncy(this.form5).then(response => {
  1566. let _this =this
  1567. this.$toast({
  1568. icon: 'success', // 找到自己需要的图标
  1569. message: '修改成功',
  1570. duration:"1000",
  1571. onClose:function(){
  1572. _this.showhncy = false
  1573. let params = {
  1574. "nhdm":_this.form5.nhdm,
  1575. deptId:_this.form5.deptId
  1576. }
  1577. listNhhncy(params).then((response) => {
  1578. _this.hncylist = response.rows
  1579. })
  1580. }
  1581. })
  1582. });
  1583. }
  1584. } else if (this.form5.zjlx=='01'&&parseInt(this.form5.zjhm.substr(16, 1)) % 2 == 0){
  1585. if(this.form5.xb!='0'){
  1586. Dialog.confirm({
  1587. title: '警告',
  1588. message: '成员性别与身份证号中性别信息不符,是否继续保存?',
  1589. })
  1590. .then(() => {
  1591. // on confirm
  1592. updateNhhncy(this.form5).then(response => {
  1593. let _this =this
  1594. this.$toast({
  1595. icon: 'success', // 找到自己需要的图标
  1596. message: '修改成功',
  1597. duration:"1000",
  1598. onClose:function(){
  1599. _this.showhncy = false
  1600. let params = {
  1601. "nhdm":_this.form5.nhdm,
  1602. deptId:_this.form5.deptId
  1603. }
  1604. listNhhncy(params).then((response) => {
  1605. _this.hncylist = response.rows
  1606. })
  1607. }
  1608. })
  1609. });
  1610. })
  1611. .catch(() => {
  1612. // on cancel
  1613. });
  1614. }else{
  1615. updateNhhncy(this.form5).then(response => {
  1616. let _this =this
  1617. this.$toast({
  1618. icon: 'success', // 找到自己需要的图标
  1619. message: '修改成功',
  1620. duration:"1000",
  1621. onClose:function(){
  1622. _this.showhncy = false
  1623. let params = {
  1624. "nhdm":_this.form5.nhdm,
  1625. deptId:_this.form5.deptId
  1626. }
  1627. listNhhncy(params).then((response) => {
  1628. _this.hncylist = response.rows
  1629. })
  1630. }
  1631. })
  1632. });
  1633. }
  1634. }else{
  1635. updateNhhncy(this.form5).then(response => {
  1636. let _this =this
  1637. this.$toast({
  1638. icon: 'success', // 找到自己需要的图标
  1639. message: '修改成功',
  1640. duration:"1000",
  1641. onClose:function(){
  1642. _this.showhncy = false
  1643. let params = {
  1644. "nhdm":_this.form5.nhdm,
  1645. deptId:_this.form5.deptId
  1646. }
  1647. listNhhncy(params).then((response) => {
  1648. _this.hncylist = response.rows
  1649. })
  1650. }
  1651. })
  1652. });
  1653. }
  1654. } else {
  1655. if (this.form5.zjlx=='01'&&parseInt(this.form5.zjhm.substr(16, 1)) % 2 == 1) {
  1656. if(this.form5.xb!='1'){
  1657. Dialog.confirm({
  1658. title: '警告',
  1659. message: '成员性别与身份证号中性别信息不符,是否继续保存?',
  1660. })
  1661. .then(() => {
  1662. // on confirm
  1663. addNhhncy(this.form5).then(response => {
  1664. let _this =this
  1665. this.$toast({
  1666. icon: 'success', // 找到自己需要的图标
  1667. message: '保存成功',
  1668. duration:"1000",
  1669. onClose:function(){
  1670. _this.totalR+=1
  1671. _this.showhncy = false
  1672. let params = {
  1673. "nhdm":_this.form5.nhdm,
  1674. deptId:_this.form5.deptId
  1675. }
  1676. listNhhncy(params).then((response) => {
  1677. _this.hncylist = response.rows
  1678. })
  1679. }
  1680. })
  1681. });
  1682. })
  1683. .catch(() => {
  1684. // on cancel
  1685. });
  1686. }else{
  1687. addNhhncy(this.form5).then(response => {
  1688. let _this =this
  1689. this.$toast({
  1690. icon: 'success', // 找到自己需要的图标
  1691. message: '保存成功',
  1692. duration:"1000",
  1693. onClose:function(){
  1694. _this.totalR+=1
  1695. _this.showhncy = false
  1696. let params = {
  1697. "nhdm":_this.form5.nhdm,
  1698. deptId:_this.form5.deptId
  1699. }
  1700. listNhhncy(params).then((response) => {
  1701. _this.hncylist = response.rows
  1702. })
  1703. }
  1704. })
  1705. });
  1706. }
  1707. } else if (this.form5.zjlx=='01'&&parseInt(this.form5.zjhm.substr(16, 1)) % 2 == 0){
  1708. if(this.form5.xb!='0'){
  1709. Dialog.confirm({
  1710. title: '警告',
  1711. message: '成员性别与身份证号中性别信息不符,是否继续保存?',
  1712. })
  1713. .then(() => {
  1714. // on confirm
  1715. addNhhncy(this.form5).then(response => {
  1716. let _this =this
  1717. this.$toast({
  1718. icon: 'success', // 找到自己需要的图标
  1719. message: '保存成功',
  1720. duration:"1000",
  1721. onClose:function(){
  1722. _this.totalR+=1
  1723. _this.showhncy = false
  1724. let params = {
  1725. "nhdm":_this.form5.nhdm,
  1726. deptId:_this.form5.deptId
  1727. }
  1728. listNhhncy(params).then((response) => {
  1729. _this.hncylist = response.rows
  1730. })
  1731. }
  1732. })
  1733. });
  1734. })
  1735. .catch(() => {
  1736. // on cancel
  1737. });
  1738. }else{
  1739. addNhhncy(this.form5).then(response => {
  1740. let _this =this
  1741. this.$toast({
  1742. icon: 'success', // 找到自己需要的图标
  1743. message: '保存成功',
  1744. duration:"1000",
  1745. onClose:function(){
  1746. _this.totalR+=1
  1747. _this.showhncy = false
  1748. let params = {
  1749. "nhdm":_this.form5.nhdm,
  1750. deptId:_this.form5.deptId
  1751. }
  1752. listNhhncy(params).then((response) => {
  1753. _this.hncylist = response.rows
  1754. })
  1755. }
  1756. })
  1757. });
  1758. }
  1759. }else{
  1760. addNhhncy(this.form5).then(response => {
  1761. let _this =this
  1762. this.$toast({
  1763. icon: 'success', // 找到自己需要的图标
  1764. message: '保存成功',
  1765. duration:"1000",
  1766. onClose:function(){
  1767. _this.totalR+=1
  1768. _this.showhncy = false
  1769. let params = {
  1770. "nhdm":_this.form5.nhdm,
  1771. deptId:_this.form5.deptId
  1772. }
  1773. listNhhncy(params).then((response) => {
  1774. _this.hncylist = response.rows
  1775. })
  1776. }
  1777. })
  1778. });
  1779. }
  1780. }
  1781. },
  1782. mapShow() {
  1783. //删除地图选中状态
  1784. $("#deleteHistoryMap").trigger("click");
  1785. //通过数据直接查询方式--------加载较慢 start
  1786. //镇边界获取
  1787. // listTown().then(response => {
  1788. // if (response.code == 200) {
  1789. // this.mapTownList = response.rows;
  1790. // //村边界获取
  1791. // listVillage(this.queryParams).then(response => {
  1792. // this.mapVillageList = response.rows;
  1793. // listZjdzd().then((response) => {
  1794. // if (response.code == 200) {
  1795. // this.mapTheGeomZjdId= response.rows;
  1796. // listZrz().then((response) => {
  1797. // if (response.code == 200) {
  1798. // this.mapTheGeomZrzId = response.rows;
  1799. // listFsss().then((response) => {
  1800. // if (response.code == 200) {
  1801. // this.mapTheGeomFsssId = response.rows;
  1802. // }
  1803. // setTimeout(() => {
  1804. // this.GetMapsInit();
  1805. // }, 300);
  1806. // });
  1807. // }
  1808. // });
  1809. // }
  1810. // });
  1811. // });
  1812. // }
  1813. // });
  1814. //通过数据直接查询方式--------加载较慢 end
  1815. getGeoServerConfigKey().then(response => {
  1816. this.mapGeoServerUrl = response.msg;
  1817. setTimeout(() => {
  1818. this.GetMapsInit();
  1819. }, 300);
  1820. });
  1821. var that = this;
  1822. setTimeout(function () {
  1823. var height = $(".searchBar_wrap").outerHeight(true) - $(".searchBar_wrap .van-search").outerHeight(true)
  1824. that.bottomHeight = -height+'px'
  1825. },500)
  1826. },
  1827. //地图加载 -----start
  1828. GetMapsInit() {
  1829. //加载地图编辑
  1830. var that = this;
  1831. var map;
  1832. //点击事件添加样式
  1833. var hc_land_on;
  1834. document.getElementById("mapWrapAll").innerHTML = '';
  1835. var hc_land;
  1836. var projection = new ol.proj.Projection({
  1837. //地图投影类型
  1838. code: "EPSG:3857",
  1839. units: "degrees",
  1840. //extent:extent
  1841. });
  1842. var aerial = new ol.layer.Tile({
  1843. source: new ol.source.XYZ({
  1844. // url: "http://t0.tianditu.gov.cn/img_w/wmts?" +
  1845. // "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
  1846. // "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
  1847. url: "http://t{0-7}.tianditu.com/img_w/wmts?" +
  1848. "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
  1849. "&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
  1850. }),
  1851. isGroup: true,
  1852. name: "卫星影像图",
  1853. });
  1854. var yingxzi = new ol.layer.Tile({
  1855. source: new ol.source.XYZ({
  1856. url: "http://t{0-7}.tianditu.com/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk= ",
  1857. }),
  1858. isGroup: true,
  1859. name: "天地图文字标注--卫星影像图",
  1860. });
  1861. //加载地图
  1862. map = new ol.Map({
  1863. controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([]), //隐藏放大缩小按钮
  1864. layers: [aerial, yingxzi],
  1865. projection: projection,
  1866. target: "mapWrapAll",
  1867. view: new ol.View({
  1868. //center: ol.proj.fromLonLat([115.452752, 31.789033]),
  1869. //center: ol.proj.fromLonLat([115.452752, 31.789033]),
  1870. zoom: 10,
  1871. minZoom: 5, //地图缩小限制
  1872. maxZoom: 18.3, //地图放大限制
  1873. resolution: Math.random() * 0.00000001,
  1874. }),
  1875. interactions: ol.interaction.defaults({
  1876. pinchRotate: false // 移动端禁止地图旋转
  1877. }),
  1878. });
  1879. //使用geoserver服务查询开始 -------------------start
  1880. //镇边界查询开始 ------------------------------start
  1881. // var zhenTc= new ol.layer.Tile({
  1882. // source: new ol.source.TileWMS({
  1883. // url: that.mapGeoServerUrl+"/geoserver/zjd_dc/wms",
  1884. // params: {
  1885. // LAYERS: 'zjd_dc:t_house_survey_border_town',
  1886. // TILED: true,
  1887. // //cql_filter: cql_filter,
  1888. // SRID: 3857,
  1889. // },
  1890. // }),
  1891. // });
  1892. // map.addLayer(zhenTc);
  1893. //镇边界查询开始 ------------------------------end
  1894. //村边界查询开始 ------------------------------start
  1895. var cql_filter = "dept_id='" + that.$cookies.get("item").deptId + "'";
  1896. var cunTc = new ol.layer.Image({
  1897. source: new ol.source.ImageWMS({
  1898. url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  1899. params: {
  1900. LAYERS: 'zjd_dc:t_house_survey_border_village',
  1901. TILED: true,
  1902. cql_filter: cql_filter,
  1903. SRID: 3857,
  1904. TIMESTAMP: new Date().getTime(),
  1905. },
  1906. resolution: Math.random() * 0.00000001,
  1907. }),
  1908. });
  1909. // //定位查询位置
  1910. // let param_dw = {
  1911. // srsName: "EPSG:3857",
  1912. // service: "WFS",
  1913. // version: "1.0.0",
  1914. // request: "GetFeature",
  1915. // typename: "zjd_dc:t_house_survey_border_village",
  1916. // //featureNS: 'nsgk_hc',//命名空间 URI
  1917. // cql_filter: cql_filter,
  1918. // //featurePrefix: 'nationalwater',//工作区名称
  1919. // //featureTypes: ['nationalwater:01fir'],//查询图层,可以是同一个工作区下多个图层,逗号隔开
  1920. // outputFormat: "application/json",
  1921. // //filter: ol.format.filter.equalTo(t,e,r)//前者是属性名,后者是对应值
  1922. // };
  1923. // let url_dw = that.mapGeoServerUrl + "/geoserver/zjd_dc/wfs"; //wfsurl;
  1924. // url_dw = url_dw + "?";
  1925. // for (let key in param_dw) {
  1926. // url_dw = url_dw + key + "=" + param_dw[key] + "&";
  1927. // }
  1928. // url_dw = url_dw.substr(0, url_dw.length - 1);
  1929. // fetch(url_dw, {
  1930. // method: "POST", // *GET, POST, PUT, DELETE, etc.
  1931. // })
  1932. // .then((res) => {
  1933. // var geojsonmap = res.json();
  1934. // return geojsonmap;
  1935. // })
  1936. // .then((data) => {
  1937. // if (that.backTheGeom != "" && that.backTheGeom != undefined && that.backTheGeom.substring(0, 1) == "{") {
  1938. // //自然幢图层查询开始 ------------------start
  1939. // var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + that.mapZjdData.zjddm + "'";
  1940. // zrzTc = new ol.layer.Image({
  1941. // source: new ol.source.ImageWMS({
  1942. // url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  1943. // params: {
  1944. // LAYERS: 'zjd_dc:t_house_survey_zrz',
  1945. // TILED: true,
  1946. // cql_filter: cql_filter_map,
  1947. // SRID: 3857,
  1948. // TIMESTAMP: new Date().getTime(),
  1949. // },
  1950. // }),
  1951. // });
  1952. // map.addLayer(zrzTc);
  1953. // //自然幢图层查询开始 ------------------start
  1954. // //附属设施图层查询开始 ------------------start
  1955. // //var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
  1956. // fsssTc = new ol.layer.Image({
  1957. // source: new ol.source.ImageWMS({
  1958. // url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  1959. // params: {
  1960. // LAYERS: 'zjd_dc:t_house_survey_fsss',
  1961. // TILED: true,
  1962. // cql_filter: cql_filter_map,
  1963. // SRID: 3857,
  1964. // TIMESTAMP: new Date().getTime(),
  1965. // },
  1966. // }),
  1967. // });
  1968. // map.addLayer(fsssTc);
  1969. // //附属设施图层查询开始 ------------------end
  1970. // hc_land_on = new ol.layer.Vector({
  1971. // title: "add Layer",
  1972. // source: new ol.source.Vector({
  1973. // projection: projection,
  1974. // features: new ol.format.GeoJSON().readFeatures(that.backTheGeom),
  1975. // }),
  1976. // style: new ol.style.Style({
  1977. // stroke: new ol.style.Stroke({
  1978. // //边界样式
  1979. // color: "#CCFF66",
  1980. // width: 6,
  1981. // }),
  1982. // }),
  1983. // });
  1984. // map.addLayer(hc_land_on);
  1985. // var maxXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxX;
  1986. // var maxYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxY;
  1987. // var minXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minX;
  1988. // var minYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minY;
  1989. // //定位查询位置
  1990. // var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  1991. // that.clickBbox = center;
  1992. // console.log(that.mapZjdData);
  1993. // that.textMjAll = that.mapZjdData.zdmj;
  1994. // map.getView().animate({
  1995. // // 只设置需要的属性即可
  1996. // center: center, // 中心点
  1997. // zoom: 17.9, // 缩放级别
  1998. // rotation: undefined, // 缩放完成view视图旋转弧度
  1999. // duration: 1000, // 缩放持续时间,默认不需要设置
  2000. // resolution: Math.random() * 0.00000001,
  2001. // });
  2002. // //this.backMap =1;
  2003. // } else if (that.backTheGeom != "" && that.backTheGeom != undefined && that.backTheGeom.substring(0, 1) == "[") {
  2004. // //that.newHt ="1";
  2005. // var zbNew = JSON.stringify({
  2006. // "type": "MultiPolygon",
  2007. // "coordinates": [that.backTheGeom.replaceAll("\"", "")]
  2008. // });
  2009. // var leftJoin = zbNew.replace("\"[", "[");
  2010. // var rightJoin = leftJoin.replace("\"]", "]");
  2011. // hc_land_on = new ol.layer.Vector({
  2012. // title: "add Layer",
  2013. // source: new ol.source.Vector({
  2014. // projection: projection,
  2015. // features: new ol.format.GeoJSON().readFeatures("{\n" +
  2016. // " \"type\": \"Feature\",\n" +
  2017. // " \"geometry\":" + rightJoin + "}"),
  2018. // }),
  2019. // style: new ol.style.Style({
  2020. // fill: new ol.style.Fill({
  2021. // //矢量图层填充颜色,以及透明度
  2022. // color: "rgba(204, 255, 204,0.3)",
  2023. // }),
  2024. // stroke: new ol.style.Stroke({
  2025. // //边界样式
  2026. // color: "#CCFF66",
  2027. // width: 3,
  2028. // }),
  2029. // }),
  2030. // });
  2031. // map.addLayer(hc_land_on);
  2032. // var maxXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxX;
  2033. // var maxYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxY;
  2034. // var minXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minX;
  2035. // var minYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minY;
  2036. // //定位查询位置
  2037. // var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  2038. // that.clickBbox = center;
  2039. // that.textMjAll = that.mapZjdData.zdmj;
  2040. // map.getView().animate({
  2041. // // 只设置需要的属性即可
  2042. // center: center, // 中心点
  2043. // zoom: 16.9, // 缩放级别
  2044. // rotation: undefined, // 缩放完成view视图旋转弧度
  2045. // duration: 1000, // 缩放持续时间,默认不需要设置
  2046. // resolution: Math.random() * 0.00000001,
  2047. // });
  2048. // //this.backMap =1;
  2049. // } else {
  2050. // //通过村界大小视图显示
  2051. // // let resolution = map.getView().getResolutionForExtent(data.bbox, map.getSize());
  2052. // // resolution:resolution + Math.random() * 0.00000001,
  2053. // // map.getView().fit(data.bbox);
  2054. // // map.getView().setResolution(resolution);
  2055. // // //初始视图大小控制
  2056. // // map.getView().setZoom(16.0);
  2057. // console.log(data);
  2058. // console.log(data.features[0].geometry.coordinates[0][0][0]);
  2059. // map.getView().animate({
  2060. // // 只设置需要的属性即可
  2061. // center: data.features[0].geometry.coordinates[0][0][0], // 中心点
  2062. // zoom: 16.9, // 缩放级别
  2063. // rotation: undefined, // 缩放完成view视图旋转弧度
  2064. // duration: 1000, // 缩放持续时间,默认不需要设置
  2065. // resolution: Math.random() * 0.00000001,
  2066. // });
  2067. // }
  2068. // })
  2069. // .catch((error) => {
  2070. // console.log("【异常】", error);
  2071. // });
  2072. map.addLayer(cunTc);
  2073. //村边界查询开始 ------------------------------end
  2074. //国有数据加载-----------------------------------start
  2075. deptGetId(that.$cookies.get("item").deptId).then((res) => {
  2076. var cql_filter_guoyou = "ZLDWDM='" + res.data.orgCode + "0000000'";
  2077. var guoyouTc = new ol.layer.Image({
  2078. source: new ol.source.ImageWMS({
  2079. url: that.mapGeoServerUrl + "/geoserver/zjd_gydl/wms",
  2080. params: {
  2081. LAYERS: 'zjd_gydl:DLTB',
  2082. TILED: true,
  2083. cql_filter: cql_filter_guoyou,
  2084. SRID: 3857,
  2085. TIMESTAMP: new Date().getTime(),
  2086. },
  2087. }),
  2088. });
  2089. map.addLayer(guoyouTc);
  2090. });
  2091. //国有数据加载----------------------------------end
  2092. //宅基地图层查询开始 ------------------start
  2093. //var cql_filter_all = "dept_id='" + that.$cookies.get("item").deptId + "'";
  2094. var zjdTc = new ol.layer.Image({
  2095. source: new ol.source.ImageWMS({
  2096. url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  2097. params: {
  2098. LAYERS: 'zjd_dc:t_house_survey_zjdzd',
  2099. TILED: true,
  2100. cql_filter: cql_filter,
  2101. SRID: 3857,
  2102. TIMESTAMP: new Date().getTime(),
  2103. },
  2104. }),
  2105. });
  2106. //定位查询位置
  2107. let param_zjdzd = {
  2108. srsName: "EPSG:3857",
  2109. service: "WFS",
  2110. version: "1.0.0",
  2111. request: "GetFeature",
  2112. typename: "zjd_dc:t_house_survey_zjdzd",
  2113. //featureNS: 'nsgk_hc',//命名空间 URI
  2114. cql_filter: cql_filter,
  2115. //featurePrefix: 'nationalwater',//工作区名称
  2116. //featureTypes: ['nationalwater:01fir'],//查询图层,可以是同一个工作区下多个图层,逗号隔开
  2117. outputFormat: "application/json",
  2118. maxFeatures:1,
  2119. //filter: ol.format.filter.equalTo(t,e,r)//前者是属性名,后者是对应值
  2120. };
  2121. let url_zjdzd = that.mapGeoServerUrl + "/geoserver/zjd_dc/wfs"; //wfsurl;
  2122. url_zjdzd = url_zjdzd + "?";
  2123. for (let key in param_zjdzd) {
  2124. url_zjdzd = url_zjdzd + key + "=" + param_zjdzd[key] + "&";
  2125. }
  2126. url_zjdzd = url_zjdzd.substr(0, url_zjdzd.length - 1);
  2127. fetch(url_zjdzd, {
  2128. method: "POST", // *GET, POST, PUT, DELETE, etc.
  2129. })
  2130. .then((res) => {
  2131. var geojsonmap = res.json();
  2132. return geojsonmap;
  2133. })
  2134. .then((data) => {
  2135. if (that.backTheGeom != "" && that.backTheGeom != undefined && that.backTheGeom.substring(0, 1) == "{") {
  2136. //自然幢图层查询开始 ------------------start
  2137. var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + that.mapZjdData.zjddm + "'";
  2138. zrzTc = new ol.layer.Image({
  2139. source: new ol.source.ImageWMS({
  2140. url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  2141. params: {
  2142. LAYERS: 'zjd_dc:t_house_survey_zrz',
  2143. TILED: true,
  2144. cql_filter: cql_filter_map,
  2145. SRID: 3857,
  2146. TIMESTAMP: new Date().getTime(),
  2147. },
  2148. }),
  2149. });
  2150. map.addLayer(zrzTc);
  2151. //自然幢图层查询开始 ------------------start
  2152. //附属设施图层查询开始 ------------------start
  2153. //var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
  2154. fsssTc = new ol.layer.Image({
  2155. source: new ol.source.ImageWMS({
  2156. url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  2157. params: {
  2158. LAYERS: 'zjd_dc:t_house_survey_fsss',
  2159. TILED: true,
  2160. cql_filter: cql_filter_map,
  2161. SRID: 3857,
  2162. TIMESTAMP: new Date().getTime(),
  2163. },
  2164. }),
  2165. });
  2166. map.addLayer(fsssTc);
  2167. //附属设施图层查询开始 ------------------end
  2168. hc_land_on = new ol.layer.Vector({
  2169. title: "add Layer",
  2170. source: new ol.source.Vector({
  2171. projection: projection,
  2172. features: new ol.format.GeoJSON().readFeatures(that.backTheGeom),
  2173. }),
  2174. style: new ol.style.Style({
  2175. stroke: new ol.style.Stroke({
  2176. //边界样式
  2177. color: "#CCFF66",
  2178. width: 6,
  2179. }),
  2180. }),
  2181. });
  2182. map.addLayer(hc_land_on);
  2183. var maxXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxX;
  2184. var maxYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxY;
  2185. var minXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minX;
  2186. var minYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minY;
  2187. //定位查询位置
  2188. var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  2189. that.clickBbox = center;
  2190. console.log(that.mapZjdData);
  2191. that.textMjAll = that.mapZjdData.zdmj;
  2192. map.getView().animate({
  2193. // 只设置需要的属性即可
  2194. center: center, // 中心点
  2195. zoom: 17.9, // 缩放级别
  2196. rotation: undefined, // 缩放完成view视图旋转弧度
  2197. duration: 1000, // 缩放持续时间,默认不需要设置
  2198. resolution: Math.random() * 0.00000001,
  2199. });
  2200. //this.backMap =1;
  2201. } else if (that.backTheGeom != "" && that.backTheGeom != undefined && that.backTheGeom.substring(0, 1) == "[") {
  2202. //that.newHt ="1";
  2203. var zbNew = JSON.stringify({
  2204. "type": "MultiPolygon",
  2205. "coordinates": [that.backTheGeom.replaceAll("\"", "")]
  2206. });
  2207. var leftJoin = zbNew.replace("\"[", "[");
  2208. var rightJoin = leftJoin.replace("\"]", "]");
  2209. hc_land_on = new ol.layer.Vector({
  2210. title: "add Layer",
  2211. source: new ol.source.Vector({
  2212. projection: projection,
  2213. features: new ol.format.GeoJSON().readFeatures("{\n" +
  2214. " \"type\": \"Feature\",\n" +
  2215. " \"geometry\":" + rightJoin + "}"),
  2216. }),
  2217. style: new ol.style.Style({
  2218. fill: new ol.style.Fill({
  2219. //矢量图层填充颜色,以及透明度
  2220. color: "rgba(204, 255, 204,0.3)",
  2221. }),
  2222. stroke: new ol.style.Stroke({
  2223. //边界样式
  2224. color: "#CCFF66",
  2225. width: 3,
  2226. }),
  2227. }),
  2228. });
  2229. map.addLayer(hc_land_on);
  2230. var maxXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxX;
  2231. var maxYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxY;
  2232. var minXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minX;
  2233. var minYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minY;
  2234. //定位查询位置
  2235. var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  2236. that.clickBbox = center;
  2237. that.textMjAll = that.mapZjdData.zdmj;
  2238. map.getView().animate({
  2239. // 只设置需要的属性即可
  2240. center: center, // 中心点
  2241. zoom: 16.9, // 缩放级别
  2242. rotation: undefined, // 缩放完成view视图旋转弧度
  2243. duration: 1000, // 缩放持续时间,默认不需要设置
  2244. resolution: Math.random() * 0.00000001,
  2245. });
  2246. //this.backMap =1;
  2247. } else {
  2248. //通过村界大小视图显示
  2249. // let resolution = map.getView().getResolutionForExtent(data.bbox, map.getSize());
  2250. // resolution:resolution + Math.random() * 0.00000001,
  2251. // map.getView().fit(data.bbox);
  2252. // map.getView().setResolution(resolution);
  2253. // //初始视图大小控制
  2254. // map.getView().setZoom(16.0);
  2255. map.getView().animate({
  2256. // 只设置需要的属性即可
  2257. center: data.features[0].geometry.coordinates[0][0][0], // 中心点
  2258. zoom: 15.9, // 缩放级别
  2259. rotation: undefined, // 缩放完成view视图旋转弧度
  2260. duration: 1000, // 缩放持续时间,默认不需要设置
  2261. resolution: Math.random() * 0.00000001,
  2262. });
  2263. }
  2264. })
  2265. .catch((error) => {
  2266. console.log("【异常】", error);
  2267. });
  2268. map.addLayer(zjdTc);
  2269. //宅基地图层查询开始 ------------------start
  2270. var zrzTc;
  2271. // //自然幢图层查询开始 ------------------start
  2272. // var zrzTc = new ol.layer.Image({
  2273. // source: new ol.source.ImageWMS({
  2274. // url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  2275. // params: {
  2276. // LAYERS: 'zjd_dc:t_house_survey_zrz',
  2277. // TILED: true,
  2278. // cql_filter: cql_filter,
  2279. // SRID: 3857,
  2280. // TIMESTAMP: new Date().getTime(),
  2281. // },
  2282. // }),
  2283. // });
  2284. // map.addLayer(zrzTc);
  2285. // //自然幢图层查询开始 ------------------start
  2286. //
  2287. var fsssTc;
  2288. // //附属设施图层查询开始 ------------------start
  2289. // var fsssTc = new ol.layer.Image({
  2290. // source: new ol.source.ImageWMS({
  2291. // url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  2292. // params: {
  2293. // LAYERS: 'zjd_dc:t_house_survey_fsss',
  2294. // TILED: true,
  2295. // cql_filter: cql_filter,
  2296. // SRID: 3857,
  2297. // TIMESTAMP: new Date().getTime(),
  2298. // },
  2299. // }),
  2300. // });
  2301. // map.addLayer(fsssTc);
  2302. // //附属设施图层查询开始 ------------------start
  2303. //使用geoserver服务查询开始 -------------------end
  2304. // if(this.backMap ==1){
  2305. // var cql = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + this.mapZjdTeAll.mapZjdAData.zjddm + "'";
  2306. // var wmsSourceBack = new ol.source.ImageWMS({
  2307. // crossOrigin: 'anonymous',
  2308. // params: {
  2309. // LAYERS: 'zjd_dc:t_house_survey_all',
  2310. // 'VERSION': '1.1.0',
  2311. // 'FORMAT': "image/png",
  2312. // 'CQL_FILTER': cql
  2313. // },
  2314. // serverType: 'geoserver',
  2315. // url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  2316. // });
  2317. // zjdTc.setSource(wmsSourceBack);
  2318. // ol.view.setResolution(ol.view.getResolution() + Math.random() * 0.00000001);//随机数缩放实现刷新
  2319. // }
  2320. //数据库直接加载数据渲染方式---------------------------------------------------start
  2321. //判断当前账套是否有数据
  2322. // var mapTalkAbout = true;
  2323. // //获取镇界线----start
  2324. // if(this.mapTownList.length >0){
  2325. // for (var i = 0; this.mapTownList.length > i; i++) {
  2326. // if (this.mapTownList[i] != null && this.mapTownList[i].theGeom != null && this.mapTownList[i].theGeom != "") {
  2327. // mapTalkAbout =false;
  2328. // this.mapTownList[i].createBy = 'mapTownList';
  2329. // var theGeomLine= this.mapTownList[i].theGeom.replaceAll("MultiPolygon","LineString");
  2330. // theGeomLine = theGeomLine.replaceAll("[[[[","[[");
  2331. // theGeomLine = theGeomLine.replaceAll("]]]]","]]");
  2332. // hc_land = new ol.layer.Vector({
  2333. // title: "add Layer",
  2334. // source: new ol.source.Vector({
  2335. // projection: projection,
  2336. // features: new ol.format.GeoJSON().readFeatures("{\n" +
  2337. // " \"type\": \"Feature\",\n" +
  2338. // " \"geometry\":" + theGeomLine + ", \"properties\":" + JSON.stringify(this.mapTownList[i]) + "}"),
  2339. // }),
  2340. // style: new ol.style.Style({
  2341. // fill: new ol.style.Fill({
  2342. // //矢量图层填充颜色,以及透明度
  2343. // color: "#AE57A4",
  2344. // }),
  2345. // stroke: new ol.style.Stroke({
  2346. // //边界样式
  2347. // color: "#FF0000",
  2348. // width: 3,
  2349. // }),
  2350. // // text: new ol.style.Text({
  2351. // // text: this.mapTownList[i].xzqmc,
  2352. // // font: '30px sans-serif',
  2353. // // textAlign: "center",
  2354. // // textBaseline: "middle",
  2355. // // //font: 'verdana',
  2356. // // fill: new ol.style.Fill({
  2357. // // color: "#ff0000"
  2358. // // }),
  2359. // // // backgroundFill: new ol.style.Fill({
  2360. // // // color: "#ff0000"
  2361. // // // }),
  2362. // // font: "30px sans-serif",
  2363. // // stroke: new ol.style.Stroke({
  2364. // // color: "#ffffff"
  2365. // // // width: 3
  2366. // // }),
  2367. // // offsetX: parseInt(0, 10),
  2368. // // offsetY: parseInt(0, 10),
  2369. // // placement: "line", //point 则自动计算面的中心k点然后标注 line 则根据面要素的边进行标注
  2370. // // overflow: false //超出面的部分不显示
  2371. // //}),
  2372. // }),
  2373. // });
  2374. // map.addLayer(hc_land);
  2375. // //console.log(hc_land.values_.source.featuresRtree_.rbush_.data);
  2376. // var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX;
  2377. // var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY;
  2378. // var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX;
  2379. // var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY;
  2380. // // //定位查询位置
  2381. // var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  2382. // // console.log(center);
  2383. // map.getView().animate({
  2384. // // 只设置需要的属性即可
  2385. // center: center, // 中心点
  2386. // zoom: 9.8, // 缩放级别
  2387. // rotation: undefined, // 缩放完成view视图旋转弧度
  2388. // duration: 1000, // 缩放持续时间,默认不需要设置
  2389. // });
  2390. // }
  2391. // }
  2392. // }
  2393. // //获取镇界线----end
  2394. // //获取村界线----start
  2395. // if(this.mapVillageList.length >0){
  2396. // for (var i = 0; this.mapVillageList.length > i; i++) {
  2397. // if (this.mapVillageList[i] != null && this.mapVillageList[i].theGeom != null && this.mapVillageList[i].theGeom != "") {
  2398. // mapTalkAbout =false;
  2399. // this.mapVillageList[i].createBy = 'mapVillageList';
  2400. // var theGeomLine= this.mapVillageList[i].theGeom.replaceAll("MultiPolygon","LineString");
  2401. // theGeomLine = theGeomLine.replaceAll("[[[[","[[");
  2402. // theGeomLine = theGeomLine.replaceAll("]]]]","]]");
  2403. // hc_land = new ol.layer.Vector({
  2404. // title: "add Layer",
  2405. // source: new ol.source.Vector({
  2406. // projection: projection,
  2407. // features: new ol.format.GeoJSON().readFeatures("{\n" +
  2408. // " \"type\": \"Feature\",\n" +
  2409. // " \"geometry\":" + theGeomLine + ", \"properties\":" + JSON.stringify(this.mapVillageList[i]) + "}"),
  2410. // }),
  2411. // style: new ol.style.Style({
  2412. // fill: new ol.style.Fill({
  2413. // //矢量图层填充颜色,以及透明度
  2414. // color: "#AE57A4",
  2415. // }),
  2416. // stroke: new ol.style.Stroke({
  2417. // //边界样式
  2418. // color: "#ff00ff",
  2419. // width: 3,
  2420. // }),
  2421. // // text: new ol.style.Text({
  2422. // // text: this.mapVillageList[i].dcmj,
  2423. // // font: '30px sans-serif',
  2424. // // textAlign: "center",
  2425. // // textBaseline: "middle",
  2426. // // //font: 'verdana',
  2427. // // fill: new ol.style.Fill({
  2428. // // color: "#ff00ff"
  2429. // // }),
  2430. // // // backgroundFill: new ol.style.Fill({
  2431. // // // color: "#ff0000"
  2432. // // // }),
  2433. // // font: "30px sans-serif",
  2434. // // stroke: new ol.style.Stroke({
  2435. // // color: "#ffffff"
  2436. // // // width: 3
  2437. // // }),
  2438. // // offsetX: parseInt(0, 10),
  2439. // // offsetY: parseInt(0, 10),
  2440. // // placement: "line", //point 则自动计算面的中心k点然后标注 line 则根据面要素的边进行标注
  2441. // // overflow: false //超出面的部分不显示
  2442. // // }),
  2443. // }),
  2444. // });
  2445. // map.addLayer(hc_land);
  2446. // }
  2447. // }
  2448. // }
  2449. // // //获取村界线----end
  2450. // //宅基地定位开始 ---------start
  2451. // if(this.mapTheGeomZjdId.length >0) {
  2452. // for (var i = 0; this.mapTheGeomZjdId.length > i; i++) {
  2453. // if (this.mapTheGeomZjdId[i] !=null && this.mapTheGeomZjdId[i].theGeom != null && this.mapTheGeomZjdId[i].theGeom != "") {
  2454. // mapTalkAbout =false;
  2455. // this.mapTheGeomZjdId[i].createBy = 'mapTheGeomZjdId';
  2456. // var styleYqr = "";
  2457. // if(this.mapTheGeomZjdId[i].houseDataConfirmStatus == "CONFIRMED"){
  2458. // styleYqr = new ol.style.Style({
  2459. // fill: new ol.style.Fill({
  2460. // //矢量图层填充颜色,以及透明度
  2461. // color: "#AE57A4",
  2462. // }),
  2463. // stroke: new ol.style.Stroke({
  2464. // //边界样式
  2465. // color: "#28FF28",
  2466. // width: 3,
  2467. // }),
  2468. // });
  2469. // } else {
  2470. // styleYqr = new ol.style.Style({
  2471. // fill: new ol.style.Fill({
  2472. // //矢量图层填充颜色,以及透明度
  2473. // color: "#AE57A4",
  2474. // }),
  2475. // stroke: new ol.style.Stroke({
  2476. // //边界样式
  2477. // color: "rgba(255, 45, 45,1)",
  2478. // width: 3,
  2479. // }),
  2480. // });
  2481. // }
  2482. // hc_land = new ol.layer.Vector({
  2483. // title: "add Layer",
  2484. // source: new ol.source.Vector({
  2485. // projection: projection,
  2486. // features: new ol.format.GeoJSON().readFeatures("{\n" +
  2487. // " \"type\": \"Feature\",\n" +
  2488. // " \"geometry\":" + this.mapTheGeomZjdId[i].theGeom + ", \"properties\":" + JSON.stringify(this.mapTheGeomZjdId[i]) + "}"),
  2489. // }),
  2490. // style: styleYqr
  2491. // });
  2492. // map.addLayer(hc_land);
  2493. // // var maxXMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxX;
  2494. // // var maxYMap = hc_land.values_.source.featuresRtree_.rbush_.data.maxY;
  2495. // // var minXMap = hc_land.values_.source.featuresRtree_.rbush_.data.minX;
  2496. // // var minYMap = hc_land.values_.source.featuresRtree_.rbush_.data.minY;
  2497. // // //定位查询位置
  2498. // // var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  2499. // // map.getView().animate({
  2500. // // // 只设置需要的属性即可
  2501. // // center: center, // 中心点
  2502. // // zoom: 15.8, // 缩放级别
  2503. // // rotation: undefined, // 缩放完成view视图旋转弧度
  2504. // // duration: 1000, // 缩放持续时间,默认不需要设置
  2505. // // });
  2506. // //自然幢定位开始 ---------start
  2507. // getZrzZjdDmList(this.mapTheGeomZjdId[i].zjddm).then((response) => {
  2508. // if (response.code == 200) {
  2509. // this.mapTheGeomZrzId = response.data;
  2510. // if(this.mapTheGeomZrzId.length >0) {
  2511. // for (var i = 0; this.mapTheGeomZrzId.length > i; i++) {
  2512. // if (this.mapTheGeomZrzId[i] !=null && this.mapTheGeomZrzId[i].theGeom != null && this.mapTheGeomZrzId[i].theGeom != "") {
  2513. // this.mapTheGeomZrzId[i].createBy = 'mapTheGeomZrzId';
  2514. // var styleZrz = "";
  2515. // if(this.mapTheGeomZjdId[i].houseDataConfirmStatus == "CONFIRMED"){
  2516. // styleZrz = new ol.style.Style({
  2517. // fill: new ol.style.Fill({
  2518. // //矢量图层填充颜色,以及透明度
  2519. // color: "#FFD306",
  2520. // }),
  2521. // stroke: new ol.style.Stroke({
  2522. // //边界样式
  2523. // color: "#28FF28",
  2524. // width: 3,
  2525. // }),
  2526. // });
  2527. // } else {
  2528. // styleZrz = new ol.style.Style({
  2529. // fill: new ol.style.Fill({
  2530. // //矢量图层填充颜色,以及透明度
  2531. // color: "#FFD306",
  2532. // }),
  2533. // stroke: new ol.style.Stroke({
  2534. // //边界样式
  2535. // color: "rgba(255, 45, 45,1)",
  2536. // width: 3,
  2537. // }),
  2538. // });
  2539. // }
  2540. // hc_land = new ol.layer.Vector({
  2541. // title: "add Layer",
  2542. // source: new ol.source.Vector({
  2543. // projection: projection,
  2544. // features: new ol.format.GeoJSON().readFeatures("{\n" +
  2545. // " \"type\": \"Feature\",\n" +
  2546. // " \"geometry\":" + this.mapTheGeomZrzId[i].theGeom + ", \"properties\":" + JSON.stringify(this.mapTheGeomZrzId[i]) + "}"),
  2547. // }),
  2548. // style: styleZrz
  2549. // });
  2550. // map.addLayer(hc_land);
  2551. // }
  2552. // }
  2553. // }
  2554. // }
  2555. // });
  2556. // //自然幢定位结束 ---------end
  2557. //
  2558. // //附属设施定位开始 ---------start
  2559. // getFsssZjdDmList(this.mapTheGeomZjdId[i].zjddm).then((response) => {
  2560. // if (response.code == 200) {
  2561. // this.mapTheGeomFsssId = response.data;
  2562. // if(this.mapTheGeomFsssId.length >0) {
  2563. // for (var i = 0; this.mapTheGeomFsssId.length > i; i++) {
  2564. // if (this.mapTheGeomFsssId[i] !=null && this.mapTheGeomFsssId[i].theGeom != null && this.mapTheGeomFsssId[i].theGeom != "") {
  2565. // this.mapTheGeomFsssId[i].createBy = 'mapTheGeomFsssId';
  2566. // var styleFsss = "";
  2567. // if(this.mapTheGeomZjdId[i].houseDataConfirmStatus == "CONFIRMED"){
  2568. // styleFsss = new ol.style.Style({
  2569. // fill: new ol.style.Fill({
  2570. // //矢量图层填充颜色,以及透明度
  2571. // color: "#00FFFF",
  2572. // }),
  2573. // stroke: new ol.style.Stroke({
  2574. // //边界样式
  2575. // color: "#28FF28",
  2576. // width: 3,
  2577. // }),
  2578. // });
  2579. // } else {
  2580. // styleFsss = new ol.style.Style({
  2581. // fill: new ol.style.Fill({
  2582. // //矢量图层填充颜色,以及透明度
  2583. // color: "#00FFFF",
  2584. // }),
  2585. // stroke: new ol.style.Stroke({
  2586. // //边界样式
  2587. // color: "rgba(255, 45, 45,1)",
  2588. // width: 3,
  2589. // }),
  2590. // });
  2591. // }
  2592. // hc_land = new ol.layer.Vector({
  2593. // title: "add Layer",
  2594. // source: new ol.source.Vector({
  2595. // projection: projection,
  2596. // features: new ol.format.GeoJSON().readFeatures("{\n" +
  2597. // " \"type\": \"Feature\",\n" +
  2598. // " \"geometry\":" + this.mapTheGeomFsssId[i].theGeom + ", \"properties\":" + JSON.stringify(this.mapTheGeomFsssId[i]) + "}"),
  2599. // }),
  2600. // style: styleFsss
  2601. // });
  2602. // map.addLayer(hc_land);
  2603. // }
  2604. // }
  2605. // }
  2606. // }
  2607. // });
  2608. // //附属设施定位结束 ---------end
  2609. // }
  2610. // }
  2611. // }
  2612. // //宅基地定位结束 ---------end
  2613. //数据库直接加载数据渲染方式---------------------------------------------------end
  2614. //地图操作定义------------start
  2615. //定位定义------------start
  2616. var Zb;
  2617. var latitude;
  2618. var longitude;
  2619. var vector_drawing;
  2620. //定位定义------------end
  2621. //绘图定义---------------start
  2622. var drawing;
  2623. var draw_map;
  2624. //绘图定义---------------end
  2625. //测面绘图定义------------start
  2626. var draw_cm;
  2627. //定义矢量图层
  2628. var vector;
  2629. //创建一个帮助提示信息对象
  2630. var helpTooltip;
  2631. //创建一个测量提示信息对象
  2632. var measureTooltip;
  2633. //创建一个帮助提示框对象
  2634. var helpTooltipElement;
  2635. //测出距离
  2636. var measureTooltipElement;
  2637. //测面绘图定义-----------end
  2638. //地图操作定义------------end
  2639. //定位当前位置 ------start
  2640. $("#dwMapAll").on("click", function () {
  2641. //删除测量记录操作--------start
  2642. //将矢量图层从图中删除
  2643. //map.removeLayer(helpTooltip);
  2644. map.removeLayer(vector);
  2645. map.removeInteraction(draw_cm);
  2646. //map.removeOverlay(helpTooltipElement);
  2647. //map.removeLayer(measureTooltip);
  2648. //删除测量记录操作--------end
  2649. //删除绘制图层画图操作-------start
  2650. map.removeInteraction(draw_map);
  2651. map.removeLayer(drawing);
  2652. //删除绘制图层画图操作-------end
  2653. //开始定位当前位置
  2654. navigator.geolocation.getCurrentPosition(function(position) {
  2655. latitude = position.coords.latitude;// 获取纬度
  2656. longitude = position.coords.longitude;// 获取经度
  2657. });
  2658. if(latitude !=null && longitude !=null && latitude !="" && longitude !="" && latitude !=undefined && longitude !=undefined ){
  2659. Zb = [longitude,latitude];
  2660. }else {
  2661. Zb =[115.452752, 31.789033];
  2662. }
  2663. //获取坐标点LocationManager
  2664. // geoGps().then(response => {
  2665. //
  2666. // });
  2667. //矢量标注样式设置函数,设置image为图标ol.style.Icon
  2668. function createLabelStyle() {
  2669. return new ol.style.Style({
  2670. image: new ol.style.Icon({
  2671. //设置图标偏移
  2672. anchor: [0.5, 1],
  2673. //标注样式的起点位置
  2674. anchorOrigin: "top-right",
  2675. //X方向单位:分数
  2676. anchorXUnits: "fraction",
  2677. //Y方向单位:像素
  2678. anchorYUnits: "pixels",
  2679. //偏移起点位置的方向
  2680. offsetOrigin: "top-right",
  2681. //透明度
  2682. opacity: 0.9,
  2683. //图片路径
  2684. src: require("../../assets/images/housesteadSurvey/mark.png"),
  2685. }),
  2686. text: new ol.style.Text({
  2687. textAlign: "center", //位置
  2688. textBaseline: "middle", //基准线
  2689. font: "normal 12px 微软雅黑", //文字样式
  2690. //text: "标注点", //文本内容
  2691. fill: new ol.style.Fill({
  2692. //文本填充样式(即文字颜色)
  2693. color: "#ff0000",
  2694. }),
  2695. }),
  2696. zIndex: 9999,
  2697. });
  2698. }
  2699. var newcenterFeature = new ol.Feature({
  2700. geometry: new ol.geom.Point(ol.proj.fromLonLat(Zb)), //几何信息
  2701. name: "标注点",
  2702. });
  2703. var sourceMapLook = new ol.source.Vector({wrapX: false});
  2704. vector_drawing = new ol.layer.Vector({
  2705. source: sourceMapLook,
  2706. });
  2707. map.addLayer(vector_drawing);
  2708. newcenterFeature.setStyle(createLabelStyle()); //设置要素样式
  2709. sourceMapLook.addFeature(newcenterFeature);
  2710. map.getView().animate({
  2711. // 只设置需要的属性即可
  2712. center: ol.proj.fromLonLat(Zb), // 中心点
  2713. zoom: 17.8, // 缩放级别
  2714. rotation: undefined, // 缩放完成view视图旋转弧度
  2715. duration: 1000, // 缩放持续时间,默认不需要设置
  2716. resolution:Math.random() * 0.00000001,
  2717. });
  2718. });
  2719. //定位当前位置 ------end
  2720. //开始绘制图层- -----start
  2721. $("#htMapAll").on("click", function () {
  2722. if(that.drawingClick) {
  2723. that.drawingClick=false;
  2724. //删除之前 测距操作添加map中的绘图 --------start
  2725. //map.removeLayer(helpTooltip);
  2726. map.removeLayer(vector);
  2727. map.removeInteraction(draw_cm);
  2728. //map.removeOverlay(helpTooltipElement);
  2729. map.removeLayer(measureTooltipElement);
  2730. //删除之前 测距操作添加map中的绘图 --------end
  2731. //删除之前画图图层,重新绘制图层
  2732. map.removeInteraction(draw_map);
  2733. map.removeLayer(drawing);
  2734. //var source = new ol.source.Vector({wrapX: false});
  2735. drawing = new ol.layer.Vector({
  2736. source: new ol.source.Vector(),
  2737. });
  2738. map.addLayer(drawing);
  2739. function addInteraction() {
  2740. draw_map = new ol.interaction.Draw({
  2741. source: drawing.getSource(),
  2742. type: "Polygon",
  2743. });
  2744. draw_map.on("drawend", function (evt) {
  2745. var feature = evt.feature;
  2746. var geometry = feature.getGeometry();
  2747. that.coordinate = geometry.getCoordinates();
  2748. //_this.coordinateList = coordinate.toString();
  2749. //提示当前坐标是否绘制完成
  2750. if (that.coordinate != "" && that.coordinate != null) {
  2751. that.showhzht = true;
  2752. that.htZjdZrzFsss = JSON.stringify(that.coordinate);
  2753. console.log(that.mapZjdData);
  2754. // htMapAllFu();
  2755. } else {
  2756. $("#htMapAll").trigger("click");
  2757. }
  2758. });
  2759. map.addInteraction(draw_map);
  2760. }
  2761. function htMapAllFu() {
  2762. //that.drawMapPolygonFun();
  2763. //绘制多边形地图
  2764. that.$dialog
  2765. .confirm({
  2766. title: "提示",
  2767. message: "是否重新绘制画图",
  2768. })
  2769. .then(() => {
  2770. //$("#drawRemove").trigger("click");
  2771. map.removeInteraction(draw_map);
  2772. that.coordinate = "";
  2773. })
  2774. .catch(() => {
  2775. //删除画图点
  2776. map.removeInteraction(draw_map);
  2777. });
  2778. }
  2779. addInteraction();
  2780. } else {
  2781. that.drawingClick=true;
  2782. //删除之前 测距操作添加map中的绘图 --------start
  2783. //map.removeLayer(helpTooltip);
  2784. map.removeLayer(vector);
  2785. map.removeInteraction(draw_cm);
  2786. //map.removeOverlay(helpTooltipElement);
  2787. map.removeLayer(measureTooltipElement);
  2788. //删除之前 测距操作添加map中的绘图 --------end
  2789. //删除之前画图图层,重新绘制图层
  2790. map.removeInteraction(draw_map);
  2791. map.removeLayer(drawing);
  2792. //var source = new ol.source.Vector({wrapX: false});
  2793. }
  2794. });
  2795. //删除之前绘制图层
  2796. $("#deleteHistory").on("click", function () {
  2797. map.removeLayer(drawing);
  2798. that.showhzht = false;
  2799. });
  2800. //开始绘制图层- -----end
  2801. //切换功能删除之前选中状态
  2802. $("#deleteHistoryMap").on("click", function () {
  2803. map.removeLayer(hc_land_on);
  2804. that.mapZjdData = "";
  2805. that.mapZrzData = "";
  2806. that.mapFsssData = "";
  2807. //that.mapZjdTeAll.active ="1";
  2808. that.mapZjdTeAll.mapZjdAData = {};
  2809. that.mapZjdTeAll.mapZrzAData = {};
  2810. that.mapZjdTeAll.mapFsssAData = {};
  2811. that.mapZjdDataTure = "";
  2812. });
  2813. //清除画图鼠标点击事件
  2814. // $("#drawRemove").click(function () {
  2815. // map.removeLayer(drawing);
  2816. // });
  2817. //
  2818. //地图定义
  2819. var delete_map = ["mapZjd", "mapZrz","mapFsss"];
  2820. var hc_land_queryList =[];
  2821. var texiao_layer_zjd;
  2822. var texiao_layer_zrz;
  2823. var texiao_layer_fsss;
  2824. //按照查询条件人名 定位地图-----------------start
  2825. $("#query").on("click", function () {
  2826. //数据库查询数据------------------------------------------------------start
  2827. $("#deleteHistoryMap").trigger("click");
  2828. var val = that.seachText;
  2829. //删除之前查询图层
  2830. for(var i=0;hc_land_queryList.length>i;i++){
  2831. map.removeLayer(hc_land_queryList[i]);
  2832. }
  2833. hc_land_queryList = [];
  2834. that.mapDataAll =[];
  2835. if (val == "") {
  2836. that.$toast('请填写查询条件再查询');
  2837. } else {
  2838. var styleZjd = new ol.style.Style({
  2839. stroke: new ol.style.Stroke({
  2840. //边界样式
  2841. color: "#CCFF66",
  2842. width: 6,
  2843. }),
  2844. });
  2845. let params;
  2846. if(that.mapAddJumpNum == 1){
  2847. params = {
  2848. "deptId" : that.mapAddJump,
  2849. "syqr" : val
  2850. }
  2851. } else {
  2852. params = {
  2853. "deptId" : that.$cookies.get("item").deptId,
  2854. "syqr" : val
  2855. }
  2856. }
  2857. listZjdzd(params).then((response) => {
  2858. if(response.rows.length != 0){
  2859. that.mapDataAll = response.rows;
  2860. for(var hg=0; hg < that.mapDataAll.length; hg++){
  2861. var mapNum = that.mapDataAll[hg].houseDataConfirmStatus;
  2862. if(mapNum == "UNCONFIRMED"){
  2863. that.mapDataAll[hg].paceType = "未核查";
  2864. } else if (mapNum == "CONFIRMED"){
  2865. that.mapDataAll[hg].paceType = "已核查";
  2866. }else{
  2867. }
  2868. that.mapDataAll[hg].typeTc="宅基地";
  2869. if (that.mapDataAll[hg] !=null && that.mapDataAll[hg].theGeom != null && that.mapDataAll[hg].theGeom != "") {
  2870. that.mapDataAll[hg].createBy = 'mapTheGeomZjdId';
  2871. hc_land_queryList[hg] =new ol.layer.Vector({
  2872. title: "add Layer",
  2873. source: new ol.source.Vector({
  2874. projection: projection,
  2875. features: new ol.format.GeoJSON().readFeatures("{\n" +
  2876. " \"type\": \"Feature\",\n" +
  2877. " \"geometry\":" + that.mapDataAll[hg].theGeom + ", \"properties\":" + JSON.stringify(that.mapDataAll[hg]) + "}"),
  2878. }),
  2879. style: styleZjd
  2880. });
  2881. map.addLayer(hc_land_queryList[hg]);
  2882. var maxXMap = hc_land_queryList[hg].values_.source.featuresRtree_.rbush_.data.maxX;
  2883. var maxYMap = hc_land_queryList[hg].values_.source.featuresRtree_.rbush_.data.maxY;
  2884. var minXMap = hc_land_queryList[hg].values_.source.featuresRtree_.rbush_.data.minX;
  2885. var minYMap = hc_land_queryList[hg].values_.source.featuresRtree_.rbush_.data.minY;
  2886. //定位查询位置
  2887. var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  2888. map.getView().animate({
  2889. // 只设置需要的属性即可
  2890. center: center, // 中心点
  2891. zoom: 15.8, // 缩放级别
  2892. rotation: undefined, // 缩放完成view视图旋转弧度
  2893. duration: 1000, // 缩放持续时间,默认不需要设置
  2894. resolution:Math.random() * 0.00000001,
  2895. });
  2896. }
  2897. // listFsss(paramsZrz).then((response) => {
  2898. // that.mapDataAll.push(response.rows);
  2899. // });
  2900. }
  2901. // for(var queryFor=0; hc_land_queryList > queryFor; queryFor++ ){
  2902. // map.addLayer(hc_land_queryList[queryFor]);
  2903. // }
  2904. // var mapZrzFor = that.mapDataAll[0].length+1;
  2905. // console.log(mapZrzFor);
  2906. // for(var mapFor=0;mapZrzFor>mapFor;mapFor++){
  2907. // //查询自然幢
  2908. // let paramsZrz = {
  2909. // "deptId" : that.$cookies.get("item").deptId,
  2910. // "zjddm" : that.mapDataAll[0][mapFor].zjddm,
  2911. // "pageSize":20,
  2912. // }
  2913. // listZrz(paramsZrz).then((response) => {
  2914. // console.log(response);
  2915. // that.mapDataAll[0].
  2916. // that.mapDataAll[0].push(response.rows);
  2917. // });
  2918. // }
  2919. setTimeout(function () {
  2920. that.showSearch = true ;
  2921. $('.searchBox').css('display','block')
  2922. var height = $(".searchBar_wrap").outerHeight(true) - $(".searchBar_wrap .van-search").outerHeight(true)
  2923. document.styleSheets[0].insertRule(
  2924. "@keyframes test" +
  2925. "{" +
  2926. "0%{bottom: -" + height + "px;}" +
  2927. "100%{bottom: 0px;}" +
  2928. "}"
  2929. )
  2930. $('.searchBar_wrap').css({'animation':'test 0.5s ease-in-out 0s 1 alternate forwards','-webkit-animation':'test 0.5s ease-in-out 0s 1 alternate forwards'});
  2931. //}
  2932. },500);
  2933. } else {
  2934. that.$toast("暂无数据")
  2935. }
  2936. });
  2937. }
  2938. //数据库查询数据------------------------------------------------------end
  2939. //地图查询------------------------------------------------------------start
  2940. /**
  2941. * @api wfs服务空间查询
  2942. * @param {*} wfsurl
  2943. * @param {*} srsName
  2944. * @param {*} typeName
  2945. * @param {*} drawType
  2946. * @param {option 可选} geometryField
  2947. */
  2948. // var val = that.seachText;
  2949. // if (val == "") {
  2950. // that.$toast('请填写查询条件再查询');
  2951. // } else {
  2952. // //清除之前查询数据
  2953. // that.mapDataAll =[];
  2954. // //分类查询查询农地、农房
  2955. // var difang;
  2956. // //查询条件
  2957. // var cql_filter_cun;
  2958. // var cun = that.$cookies.get("item").deptId;
  2959. // difang = ["zjd_dc:t_house_survey_zjdzd", "zjd_dc:t_house_survey_zrz","zjd_dc:t_house_survey_fsss"];
  2960. // var tach = 0;
  2961. // var once = 0;
  2962. // for (var i = 0; i < difang.length; i++) {
  2963. // map.removeLayer(delete_map[i]);
  2964. // // 数字验证!
  2965. // var reg = /\d/;
  2966. // //验证汉子
  2967. // //var han = /^[\u4e00-\u9fa5]+$/;
  2968. // if (reg.test(val)) {
  2969. // //循环判断查询条件
  2970. // cql_filter_cun = "zjddm='" + val + "'" + "and dept_id='" + cun + "'";
  2971. // } else {
  2972. // //循环判断查询条件
  2973. // if (difang[i] == "zjd_dc:t_house_survey_zjdzd") {
  2974. // cql_filter_cun = "zjddm='" + val + "'" + "and dept_id='" + cun + "'";
  2975. // } else if(difang[i] == "zjd_dc:t_house_survey_zrz") {
  2976. // cql_filter_cun = "zjddm='" + val + "'" + "and dept_id='" + cun + "'";
  2977. // } else if(difang[i] == "zjd_dc:t_house_survey_fsss") {
  2978. // cql_filter_cun = "zjddm='" + val + "'" + "and dept_id='" + cun + "'";
  2979. // }
  2980. // }
  2981. // //for(var i=0; i< difang.length; i++){
  2982. // //cql_filter = "CM='"+cun +"'"+ "and XZQK='待流转待盘活'";
  2983. //
  2984. // //图层加载
  2985. //
  2986. // //业务图层 wms服务
  2987. // delete_map[i] = new ol.layer.Tile({
  2988. // source: new ol.source.TileWMS({
  2989. // url: that.mapGeoServerUrl+"/geoserver/zjd_dc/wms",
  2990. // params: {
  2991. // LAYERS: difang[i],
  2992. // //'LAYERS': 'new_shp:new_shp_all',
  2993. // TILED: true,
  2994. // cql_filter: cql_filter_cun,
  2995. // SRID: 3857,
  2996. // },
  2997. // }),
  2998. // });
  2999. //
  3000. // //}
  3001. // //定位查询位置
  3002. // let param_dw = {
  3003. // srsName: "EPSG:3857",
  3004. // service: "WFS",
  3005. // version: "1.0.0",
  3006. // request: "GetFeature",
  3007. // typename: difang[i],
  3008. // //featureNS: 'nsgk_hc',//命名空间 URI
  3009. // cql_filter: cql_filter_cun,
  3010. // //featurePrefix: 'nationalwater',//工作区名称
  3011. // //featureTypes: ['nationalwater:01fir'],//查询图层,可以是同一个工作区下多个图层,逗号隔开
  3012. // outputFormat: "application/json",
  3013. // //filter: ol.format.filter.equalTo(t,e,r)//前者是属性名,后者是对应值
  3014. // };
  3015. // let url_dw = that.mapGeoServerUrl+"/geoserver/zjd_dc/wfs"; //wfsurl;
  3016. // url_dw = url_dw + "?";
  3017. // for (let key in param_dw) {
  3018. // url_dw = url_dw + key + "=" + param_dw[key] + "&";
  3019. // }
  3020. // url_dw = url_dw.substr(0, url_dw.length - 1);
  3021. // fetch(url_dw, {
  3022. // method: "POST", // *GET, POST, PUT, DELETE, etc.
  3023. // })
  3024. // .then((res) => {
  3025. // var geojsonmap = res.json();
  3026. // return geojsonmap;
  3027. // })
  3028. // .then((data) => {
  3029. // tach = tach + 1;
  3030. // if (data.features != null && data.features != "") {
  3031. // for(var i=0; data.features.length >i; i++) {
  3032. // //特效动画实现 -----------------------------start
  3033. // console.log(tach,"++++++++++++++++++",once)
  3034. // var datamap = data.features[0].bbox;
  3035. // if (tach == 1 && once == 0) {
  3036. // console.log("zrz")
  3037. // texiao_layer_zjd = new ol.layer.Vector({
  3038. // source: new ol.source.Vector(),
  3039. // });
  3040. // map.addLayer(texiao_layer_zjd);
  3041. // var center = ol.extent.getCenter(datamap); //获取边界区域的中心位置
  3042. // var circle = new ol.Feature({
  3043. // geometry: new ol.geom.Point(center), //ol.proj.transform([104, 30], 'EPSG:4326', 'EPSG:3857') //投影坐标转为地理坐标
  3044. // });
  3045. //
  3046. // circle.setStyle(
  3047. // new ol.style.Style({
  3048. // image: new ol.style.Circle({
  3049. // radius: 0,
  3050. // stroke: new ol.style.Stroke({
  3051. // color: "yellow",
  3052. // size: 1,
  3053. // }),
  3054. // }),
  3055. // })
  3056. // );
  3057. // texiao_layer_zjd.getSource().addFeature(circle);
  3058. //
  3059. // // 关键的地方在此:监听postcompose事件,在里面重新设置circle的样式
  3060. // var radius = 0;
  3061. // map.on("postcompose", function () {
  3062. // // 增大半径,最大20
  3063. // radius++;
  3064. // radius = radius % 10;
  3065. // // 设置样式
  3066. // circle.setStyle(
  3067. // new ol.style.Style({
  3068. // image: new ol.style.Circle({
  3069. // radius: radius,
  3070. // stroke: new ol.style.Stroke({
  3071. // color: "yellow",
  3072. // size: 1,
  3073. // }),
  3074. // }),
  3075. // })
  3076. // );
  3077. // });
  3078. // } else if(tach == 2) {
  3079. // console.log("zrz")
  3080. // texiao_layer_zrz = new ol.layer.Vector({
  3081. // source: new ol.source.Vector(),
  3082. // });
  3083. // map.addLayer(texiao_layer_zrz);
  3084. // var center = ol.extent.getCenter(datamap); //获取边界区域的中心位置
  3085. // var circle = new ol.Feature({
  3086. // geometry: new ol.geom.Point(center), //ol.proj.transform([104, 30], 'EPSG:4326', 'EPSG:3857') //投影坐标转为地理坐标
  3087. // });
  3088. //
  3089. // circle.setStyle(
  3090. // new ol.style.Style({
  3091. // image: new ol.style.Circle({
  3092. // radius: 0,
  3093. // stroke: new ol.style.Stroke({
  3094. // color: "yellow",
  3095. // size: 1,
  3096. // }),
  3097. // }),
  3098. // })
  3099. // );
  3100. // texiao_layer_zrz.getSource().addFeature(circle);
  3101. //
  3102. // // 关键的地方在此:监听postcompose事件,在里面重新设置circle的样式
  3103. // var radius = 0;
  3104. // map.on("postcompose", function () {
  3105. // // 增大半径,最大20
  3106. // radius++;
  3107. // radius = radius % 10;
  3108. // // 设置样式
  3109. // circle.setStyle(
  3110. // new ol.style.Style({
  3111. // image: new ol.style.Circle({
  3112. // radius: radius,
  3113. // stroke: new ol.style.Stroke({
  3114. // color: "yellow",
  3115. // size: 1,
  3116. // }),
  3117. // }),
  3118. // })
  3119. // );
  3120. // });
  3121. // } else {
  3122. // console.log("fsss")
  3123. // texiao_layer_fsss = new ol.layer.Vector({
  3124. // source: new ol.source.Vector(),
  3125. // });
  3126. // map.addLayer(texiao_layer_fsss);
  3127. // var center = ol.extent.getCenter(datamap); //获取边界区域的中心位置
  3128. // var circle = new ol.Feature({
  3129. // geometry: new ol.geom.Point(center), //ol.proj.transform([104, 30], 'EPSG:4326', 'EPSG:3857') //投影坐标转为地理坐标
  3130. // });
  3131. //
  3132. // circle.setStyle(
  3133. // new ol.style.Style({
  3134. // image: new ol.style.Circle({
  3135. // radius: 0,
  3136. // stroke: new ol.style.Stroke({
  3137. // color: "yellow",
  3138. // size: 1,
  3139. // }),
  3140. // }),
  3141. // })
  3142. // );
  3143. // texiao_layer_fsss.getSource().addFeature(circle);
  3144. //
  3145. // // 关键的地方在此:监听postcompose事件,在里面重新设置circle的样式
  3146. // var radius = 0;
  3147. // map.on("postcompose", function () {
  3148. // // 增大半径,最大20
  3149. // radius++;
  3150. // radius = radius % 10;
  3151. // // 设置样式
  3152. // circle.setStyle(
  3153. // new ol.style.Style({
  3154. // image: new ol.style.Circle({
  3155. // radius: radius,
  3156. // stroke: new ol.style.Stroke({
  3157. // color: "yellow",
  3158. // size: 1,
  3159. // }),
  3160. // }),
  3161. // })
  3162. // );
  3163. // });
  3164. // }
  3165. // //特效动画实现 -----------------------------end
  3166. // that.mapDataAll.push(JSON.parse(JSON.stringify(data.features[i].properties)));
  3167. // }
  3168. // //定位实现
  3169. // let resolution = map.getView().getResolutionForExtent(data.bbox, map.getSize());
  3170. // map.getView().fit(data.bbox);
  3171. // map.getView().setResolution(resolution);
  3172. // console.log(that.mapDataAll);
  3173. // } else if (tach == 1) {
  3174. // once = once + 1;
  3175. // } else {
  3176. // if (once == 1 && tach == 3) {
  3177. // that.$toast("没有找到相关人员信息");
  3178. // //that.showSearch = false ;
  3179. // }else {
  3180. //
  3181. // }
  3182. // }
  3183. // })
  3184. // .catch((error) => {
  3185. // console.log("【异常】", error);
  3186. // });
  3187. // map.addLayer(delete_map[i]);
  3188. // }
  3189. //地图查询------------------------------------------------------------end
  3190. });
  3191. //按照查询 定位地图-----------------end
  3192. //筛选附属设施-----------------------------------start
  3193. $("#fsssSx").click(function () {
  3194. if(!that.fsssSx){
  3195. map.addLayer(fsssTc);
  3196. }else {
  3197. map.removeLayer(fsssTc);
  3198. }
  3199. });
  3200. $("#zrzSx").click(function () {
  3201. if(!that.zrzSx){
  3202. map.addLayer(zrzTc);
  3203. }else {
  3204. map.removeLayer(zrzTc);
  3205. }
  3206. });
  3207. $("#zjdSx").click(function () {
  3208. if(!that.zjdSx){
  3209. map.addLayer(zjdTc);
  3210. }else {
  3211. map.removeLayer(zjdTc);
  3212. }
  3213. });
  3214. $("#checkAll").click(function () {
  3215. if(!that.fsssSx && !that.zjdSx && !that.zrzSx){
  3216. map.addLayer(zjdTc);
  3217. map.addLayer(zrzTc);
  3218. map.addLayer(fsssTc);
  3219. }else {
  3220. map.removeLayer(zrzTc);
  3221. map.removeLayer(zjdTc);
  3222. map.removeLayer(fsssTc);
  3223. }
  3224. });
  3225. //筛选附属设施-----------------------------------end
  3226. // //获取类型开始 侧面-----------------------------------------------------------------start
  3227. //样式加载定义
  3228. var vector_drawing_delete;
  3229. $("#area").click(function () {
  3230. console.log(that.textMjAll);
  3231. console.log(that.clickBbox);
  3232. if(that.textMjAll ==null || that.textMjAll ==""){
  3233. that.textMjAll =0;
  3234. }
  3235. if((that.textMjAll != "" && that.clickBbox !="") || (that.textMjAll == 0 && that.clickBbox !="")){
  3236. map.removeLayer(vector_drawing_delete);
  3237. function createLabelStyle() {
  3238. return new ol.style.Style({
  3239. text: new ol.style.Text({
  3240. text: that.textMjAll+"㎡",
  3241. textAlign: "center", //位置
  3242. textBaseline: "middle", //基准线
  3243. font: "normal 12px 微软雅黑", //文字样式
  3244. //text: "标注点", //文本内容
  3245. fill: new ol.style.Fill({
  3246. //文本填充样式(即文字颜色)
  3247. color: "#FFFFFF",
  3248. width: 10,
  3249. }),
  3250. overflow: false //超出面的部分不显示
  3251. }),
  3252. zIndex: 9999,
  3253. });
  3254. }
  3255. var newcenterFeature = new ol.Feature({
  3256. geometry: new ol.geom.Point(that.clickBbox), //几何信息
  3257. //name: "标注点",
  3258. });
  3259. var sourceMapLook = new ol.source.Vector({wrapX: false});
  3260. vector_drawing_delete = new ol.layer.Vector({
  3261. source: sourceMapLook,
  3262. });
  3263. map.addLayer(vector_drawing_delete);
  3264. newcenterFeature.setStyle(createLabelStyle()); //设置要素样式
  3265. sourceMapLook.addFeature(newcenterFeature);
  3266. //map.addLayer(styleFsss);
  3267. } else if(that.textMjAllNum == "1"){
  3268. that.$toast("该图层面积暂无信息");
  3269. } else {
  3270. that.$toast("选择图层进行面积显示");
  3271. }
  3272. });
  3273. // $("#area").click(function () {
  3274. // console.log("进入测面")
  3275. // //删除绘制图层画图操作-------start
  3276. // map.removeInteraction(draw_map);
  3277. // map.removeLayer(drawing);
  3278. // //删除绘制图层画图操作-------end
  3279. // //开始绘制 测面--------------------------------------------------------------start
  3280. // //定义矢量数据源
  3281. // var source = new ol.source.Vector();
  3282. //
  3283. // vector = new ol.layer.Vector({
  3284. // source: source,
  3285. // style: new ol.style.Style({
  3286. // fill: new ol.style.Fill({
  3287. // color: "rgba(255,255,255,0.2)",
  3288. // }),
  3289. // stroke: new ol.style.Stroke({
  3290. // color: "#e21e0a",
  3291. // width: 2,
  3292. // }),
  3293. // //image: new ol.style.Circle({
  3294. // // radius: 7,
  3295. // // fill: new ol.style.Fill({
  3296. // // color:'#ffcc33'
  3297. // // })
  3298. // //})
  3299. // }),
  3300. // });
  3301. //
  3302. // //将矢量图层添加到地图中 线的颜色加入map中
  3303. // map.addLayer(vector);
  3304. //
  3305. // var sketch;
  3306. //
  3307. // var continuePolygonMsg = "单击以继续绘制多边形";
  3308. //
  3309. // /**
  3310. // * Message to show when the user is drawing a line.
  3311. // * @type {string}
  3312. // */
  3313. // //var continueLineMsg = '单击继续绘制直线';
  3314. //
  3315. // //鼠标移动触发的函数
  3316. // var pointerMoveHandler = function (evt) {
  3317. // //Indicates if the map is currently being dragged.
  3318. // //Only set for POINTERDRAG and POINTERMOVE events. Default is false.
  3319. // //如果是平移地图则直接结束
  3320. // if (evt.dragging) {
  3321. // return;
  3322. // }
  3323. // //帮助提示信息
  3324. // var helpMsg = "单击开始绘图";
  3325. //
  3326. // if (sketch) {
  3327. // //Get the feature's default geometry.
  3328. // //A feature may have any number of named geometries.
  3329. // //获取绘图对象的几何要素
  3330. // var geom = sketch.getGeometry();
  3331. // //如果当前绘制的几何要素是多边形,则将绘制提示信息设置为多边形绘制提示信息
  3332. // //如果当前绘制的几何要素是多线段,则将绘制提示信息设置为多线段绘制提示信息
  3333. // helpMsg = continuePolygonMsg;
  3334. // }
  3335. // //设置帮助提示要素的内标签为帮助提示信息
  3336. // helpTooltipElement.innerHTML = helpMsg;
  3337. // //设置帮助提示信息的位置
  3338. // //The coordinate in view projection corresponding to the original browser event.
  3339. // helpTooltip.setPosition(evt.coordinate);
  3340. // //移除帮助提示要素的隐藏样式
  3341. // $(helpTooltipElement).removeClass("hidden");
  3342. // };
  3343. //
  3344. // map.on("pointermove", pointerMoveHandler);
  3345. //
  3346. // map.getViewport().addEventListener("mouseout", function () {
  3347. // helpTooltipElement.classList.add("hidden");
  3348. // });
  3349. //
  3350. // //添加交互式绘图对象的函数
  3351. // function addInteraction() {
  3352. // // 获取当前选择的绘制类型
  3353. // //var type = typeSelect.value == 'length' ? 'Polygon' : 'LineString';
  3354. // //创建一个交互式绘图对象
  3355. // var type = "Polygon";
  3356. // draw_cm = new ol.interaction.Draw({
  3357. // //绘制的数据源
  3358. // source: source,
  3359. // //绘制类型
  3360. // type: type,
  3361. // //样式
  3362. // style: new ol.style.Style({
  3363. // fill: new ol.style.Fill({
  3364. // color: "rgba(255,255,255,0.2)",
  3365. // }),
  3366. // stroke: new ol.style.Stroke({
  3367. // color: "rgba(0,0,0,0.5)",
  3368. // lineDash: [10, 10],
  3369. // width: 2,
  3370. // }),
  3371. // // image: new ol.style.Circle({
  3372. // // radius: 5,
  3373. // // stroke: new ol.style.Stroke({
  3374. // // color:'rgba(0,0,0,0.7)'
  3375. // // }),
  3376. // // fill: new ol.style.Fill({
  3377. // //color: 'rgba(255,255,255,0.2)'
  3378. // // })
  3379. // //})
  3380. // }),
  3381. // });
  3382. // //将交互绘图对象添加到地图中
  3383. // map.addInteraction(draw_cm);
  3384. //
  3385. // //创建测量提示框
  3386. // createMeasureTooltip();
  3387. // //创建帮助提示框
  3388. // createHelpTooltip();
  3389. //
  3390. // //定义一个事件监听
  3391. // var listener;
  3392. // //定义一个控制鼠标点击次数的变量
  3393. // var count = 0;
  3394. // //绘制开始事件
  3395. // draw_cm.on(
  3396. // "drawstart",
  3397. // function (evt) {
  3398. // //The feature being drawn.
  3399. // sketch = evt.feature;
  3400. // //提示框的坐标
  3401. // var tooltipCoord = evt.coordinate;
  3402. // //监听几何要素的change事件
  3403. // //Increases the revision counter and dispatches a 'change' event.
  3404. //
  3405. // listener = sketch.getGeometry().on("change", function (evt) {
  3406. // //The event target.
  3407. // //获取绘制的几何对象
  3408. // var geom = evt.target;
  3409. // //定义一个输出对象,用于记录面积和长度
  3410. // var output;
  3411. // map.removeEventListener("singleclick");
  3412. // map.removeEventListener("dblclick");
  3413. // //输出多边形的面积
  3414. // output = formatArea(geom);
  3415. // //Return an interior point of the polygon.
  3416. // //获取多变形内部点的坐标
  3417. // tooltipCoord = geom.getInteriorPoint().getCoordinates();
  3418. //
  3419. // //设置测量提示框的内标签为最终输出结果
  3420. // measureTooltipElement.innerHTML = output;
  3421. // //设置测量提示信息的位置坐标
  3422. // measureTooltip.setPosition(tooltipCoord);
  3423. // });
  3424. //
  3425. // //地图单击事件
  3426. // map.on("singleclick", function (evt) {
  3427. // //设置测量提示信息的位置坐标,用来确定鼠标点击后测量提示框的位置
  3428. // measureTooltip.setPosition(evt.coordinate);
  3429. // //如果是第一次点击,则设置测量提示框的文本内容为起点
  3430. // if (count == 0) {
  3431. // measureTooltipElement.innerHTML = "起点";
  3432. // }
  3433. // //根据鼠标点击位置生成一个点
  3434. // var point = new ol.geom.Point(evt.coordinate);
  3435. // //将该点要素添加到矢量数据源中
  3436. // source.addFeature(new ol.Feature(point));
  3437. // //更改测量提示框的样式,使测量提示框可见
  3438. // measureTooltipElement.className = "tooltip tooltip-static";
  3439. // //创建测量提示框
  3440. // createMeasureTooltip();
  3441. // //点击次数增加
  3442. // count++;
  3443. // });
  3444. //
  3445. // //地图双击事件
  3446. // map.on("dblclick", function (evt) {
  3447. // //根据
  3448. // var point = new ol.geom.Point(evt.coordinate);
  3449. // source.addFeature(new ol.Feature(point));
  3450. // });
  3451. // },
  3452. // this
  3453. // );
  3454. // //绘制结束事件
  3455. // draw_cm.on(
  3456. // "drawend",
  3457. // function (evt) {
  3458. // count = 0;
  3459. // //设置测量提示框的样式
  3460. // measureTooltipElement.className = "tooltip tooltip-static";
  3461. // //Set the offset for this overlay.
  3462. // //设置偏移量
  3463. // measureTooltip.setOffset([0, -7]);
  3464. // //清空绘制要素
  3465. // sketch = null;
  3466. // //清空测量提示要素
  3467. // measureTooltipElement = null;
  3468. // //创建测量提示框
  3469. // createMeasureTooltip();
  3470. // //Removes an event listener using the key returned by on() or once().
  3471. // //移除事件监听
  3472. // ol.Observable.unByKey(listener);
  3473. // //移除地图单击事件
  3474. // map.removeEventListener("singleclick");
  3475. // },
  3476. // this
  3477. // );
  3478. // }
  3479. // /**
  3480. // * Creates a new help tooltip
  3481. // */
  3482. // function createHelpTooltip() {
  3483. // if (helpTooltipElement) {
  3484. // helpTooltipElement.parentNode.removeChild(helpTooltipElement);
  3485. // }
  3486. // helpTooltipElement = document.createElement("div");
  3487. // helpTooltipElement.className = "ol-tooltip hidden";
  3488. // helpTooltip = new ol.Overlay({
  3489. // element: helpTooltipElement,
  3490. // offset: [15, 0],
  3491. // positioning: "center-left",
  3492. // });
  3493. // map.addOverlay(helpTooltip);
  3494. // }
  3495. //
  3496. // /**
  3497. // * Creates a new measure tooltip
  3498. // */
  3499. // function createMeasureTooltip() {
  3500. // if (measureTooltipElement) {
  3501. // measureTooltipElement.parentNode.removeChild(measureTooltipElement);
  3502. // }
  3503. // measureTooltipElement = document.createElement("div");
  3504. // measureTooltipElement.className = "ol-tooltip ol-tooltip-measure";
  3505. // measureTooltip = new ol.Overlay({
  3506. // element: measureTooltipElement,
  3507. // offset: [0, -15],
  3508. // positioning: "bottom-center",
  3509. // });
  3510. // map.addOverlay(measureTooltip);
  3511. // }
  3512. //
  3513. // //格式化测量面积
  3514. // var formatArea = function (polygon) {
  3515. // //定义面积变量
  3516. // var area;
  3517. // //获取平面面积
  3518. // area = polygon.getArea();
  3519. // //定义输出变量
  3520. // var output;
  3521. // //当面积大于10000时,转换为平方千米,否则为平方米
  3522. // if (area > 10000) {
  3523. // output =
  3524. // Math.round((area / 1000000) * 100) / 100 + " " + "km<sup>2</sup>";
  3525. // } else {
  3526. // output = Math.round(area * 100) / 100 + " " + "m<sup>2</sup>";
  3527. // }
  3528. // return output;
  3529. // };
  3530. //
  3531. // addInteraction();
  3532. // });
  3533. // //侧面结束-----------------------------------------------------------------end
  3534. //全图展示-----------------start
  3535. $("#mapAllQt").click(function (){
  3536. //定位查询位置
  3537. let param_dw = {
  3538. srsName: "EPSG:3857",
  3539. service: "WFS",
  3540. version: "1.0.0",
  3541. request: "GetFeature",
  3542. typename: "zjd_dc:t_house_survey_border_village",
  3543. //featureNS: 'nsgk_hc',//命名空间 URI
  3544. cql_filter: cql_filter,
  3545. //featurePrefix: 'nationalwater',//工作区名称
  3546. //featureTypes: ['nationalwater:01fir'],//查询图层,可以是同一个工作区下多个图层,逗号隔开
  3547. outputFormat: "application/json",
  3548. //filter: ol.format.filter.equalTo(t,e,r)//前者是属性名,后者是对应值
  3549. };
  3550. let url_dw = that.mapGeoServerUrl+"/geoserver/zjd_dc/wfs"; //wfsurl;
  3551. url_dw = url_dw + "?";
  3552. for (let key in param_dw) {
  3553. url_dw = url_dw + key + "=" + param_dw[key] + "&";
  3554. }
  3555. url_dw = url_dw.substr(0, url_dw.length - 1);
  3556. fetch(url_dw, {
  3557. method: "POST", // *GET, POST, PUT, DELETE, etc.
  3558. })
  3559. .then((res) => {
  3560. var geojsonmap = res.json();
  3561. return geojsonmap;
  3562. })
  3563. .then((data) => {
  3564. let resolution = map.getView().getResolutionForExtent(data.bbox,map.getSize());
  3565. resolution:resolution + Math.random() * 0.00000001,
  3566. map.getView().fit(data.bbox);
  3567. map.getView().setResolution(resolution);
  3568. // var datamap = data.bbox;
  3569. // var center = ol.extent.getCenter(datamap);
  3570. // map.getView().animate({
  3571. // // 只设置需要的属性即可
  3572. // center: center, // 中心点
  3573. // rotation: undefined, // 缩放完成view视图旋转弧度
  3574. // });
  3575. })
  3576. .catch((error) => {
  3577. console.log("【异常】", error);
  3578. });
  3579. });
  3580. //业务图层 wfs服务 属性查询开始 ------------------start
  3581. /**
  3582. * @api wfs服务空间查询
  3583. * @param {*} wfsurl
  3584. * @param {*} srsName
  3585. * @param {*} typeName
  3586. * @param {*} drawType
  3587. * @param {option 可选} geometryField
  3588. */
  3589. //查询全部图层 -------查询叠加图层出现覆盖问题
  3590. var wmsSource = new ol.source.TileWMS({
  3591. url: that.mapGeoServerUrl+"/geoserver/zjd_dc/wms",
  3592. params: {
  3593. LAYERS: "zjd_dc:t_house_survey_all",
  3594. TILED: true,
  3595. SRID: 3857,
  3596. serverType: "geoserver",
  3597. crossOrigin: "anonymous",
  3598. },
  3599. resolution:Math.random() * 0.00000001,
  3600. });
  3601. //查询宅基地图层
  3602. var ZjdwmsSource = new ol.source.TileWMS({
  3603. url: that.mapGeoServerUrl+"/geoserver/zjd_dc/wms",
  3604. params: {
  3605. LAYERS: "zjd_dc:t_house_survey_zjdzd",
  3606. TILED: true,
  3607. SRID: 3857,
  3608. serverType: "geoserver",
  3609. crossOrigin: "anonymous",
  3610. },
  3611. resolution:Math.random() * 0.00000001,
  3612. });
  3613. //查询自然幢图层
  3614. var ZrzwmsSource = new ol.source.TileWMS({
  3615. url: that.mapGeoServerUrl+"/geoserver/zjd_dc/wms",
  3616. params: {
  3617. LAYERS: "zjd_dc:t_house_survey_zrz",
  3618. TILED: true,
  3619. SRID: 3857,
  3620. serverType: "geoserver",
  3621. crossOrigin: "anonymous",
  3622. },
  3623. resolution:Math.random() * 0.00000001,
  3624. });
  3625. //查询附属设施图层
  3626. var FssswmsSource = new ol.source.TileWMS({
  3627. url: that.mapGeoServerUrl+"/geoserver/zjd_dc/wms",
  3628. params: {
  3629. LAYERS: "zjd_dc:t_house_survey_fsss",
  3630. TILED: true,
  3631. SRID: 3857,
  3632. serverType: "geoserver",
  3633. crossOrigin: "anonymous",
  3634. },
  3635. resolution:Math.random() * 0.00000001,
  3636. });
  3637. map.on("pointermove", function (evt) {
  3638. if (evt.dragging) {
  3639. return;
  3640. }
  3641. var pixel = map.getEventPixel(evt.originalEvent);
  3642. var hit = map.forEachLayerAtPixel(pixel, function () {
  3643. return true;
  3644. });
  3645. map.getTargetElement().style.cursor = hit ? "pointer" : "";
  3646. });
  3647. //属性查询结束 ------------------end
  3648. //点击查询详细信息
  3649. map.on("singleclick", function (evt) {
  3650. console.log(evt);
  3651. let feature = map.forEachFeatureAtPixel(
  3652. evt.pixel,
  3653. (feature) => feature
  3654. );
  3655. var viewResolution = map.getView().getResolution(); ///** @type {number} */ (view.getResolution());
  3656. var zb = evt.coordinate;
  3657. var url;
  3658. var url_bbox;
  3659. that.clickBbox ="";
  3660. that.textMjAll = "";
  3661. if(that.drawingClick) {
  3662. //点击空白删除之前图层
  3663. map.removeLayer(hc_land_on);
  3664. //map.removeLayer(hc_land_query);
  3665. //for(var i=0;hc_land_query>i;i++){
  3666. //map.removeLayer(hc_land_query);
  3667. for(var i=0;hc_land_queryList.length>i;i++){
  3668. map.removeLayer(hc_land_queryList[i]);
  3669. }
  3670. //}c
  3671. if (that.fsssSx && that.zjdSx && that.zrzSx) {
  3672. url = wmsSource.getFeatureInfoUrl(
  3673. evt.coordinate,
  3674. viewResolution,
  3675. "EPSG:3857",
  3676. {INFO_FORMAT: "text/html"}
  3677. );
  3678. url_bbox = wmsSource.getFeatureInfoUrl(
  3679. evt.coordinate,
  3680. viewResolution,
  3681. "EPSG:3857",
  3682. {INFO_FORMAT: "application/json"}
  3683. );
  3684. } else {
  3685. if (that.zjdSx) {
  3686. url = ZjdwmsSource.getFeatureInfoUrl(
  3687. evt.coordinate,
  3688. viewResolution,
  3689. "EPSG:3857",
  3690. {INFO_FORMAT: "text/html"}
  3691. );
  3692. url_bbox = ZjdwmsSource.getFeatureInfoUrl(
  3693. evt.coordinate,
  3694. viewResolution,
  3695. "EPSG:3857",
  3696. {INFO_FORMAT: "application/json"}
  3697. );
  3698. } else if (that.fsssSx) {
  3699. url = FssswmsSource.getFeatureInfoUrl(
  3700. evt.coordinate,
  3701. viewResolution,
  3702. "EPSG:3857",
  3703. {INFO_FORMAT: "text/html"}
  3704. );
  3705. url_bbox = FssswmsSource.getFeatureInfoUrl(
  3706. evt.coordinate,
  3707. viewResolution,
  3708. "EPSG:3857",
  3709. {INFO_FORMAT: "application/json"}
  3710. );
  3711. } else if (that.zrzSx) {
  3712. url = ZrzwmsSource.getFeatureInfoUrl(
  3713. evt.coordinate,
  3714. viewResolution,
  3715. "EPSG:3857",
  3716. {INFO_FORMAT: "text/html"}
  3717. );
  3718. url_bbox = ZrzwmsSource.getFeatureInfoUrl(
  3719. evt.coordinate,
  3720. viewResolution,
  3721. "EPSG:3857",
  3722. {INFO_FORMAT: "application/json"}
  3723. );
  3724. } else {
  3725. url = wmsSource.getFeatureInfoUrl(
  3726. evt.coordinate,
  3727. viewResolution,
  3728. "EPSG:3857",
  3729. {INFO_FORMAT: "text/html"}
  3730. );
  3731. url_bbox = wmsSource.getFeatureInfoUrl(
  3732. evt.coordinate,
  3733. viewResolution,
  3734. "EPSG:3857",
  3735. {INFO_FORMAT: "application/json"}
  3736. );
  3737. }
  3738. }
  3739. if (url_bbox) {
  3740. fetch(url_bbox).then((res) => {
  3741. var geojsonmap = res.json();
  3742. return geojsonmap;
  3743. })
  3744. .then((data) => {
  3745. var center = ol.extent.getCenter(data.bbox); //获取边界区域的中心位置
  3746. center = [center[0], center[1] - 16];
  3747. that.clickBbox = center;
  3748. })
  3749. .catch((error) => {
  3750. that.mapZjdData = "";
  3751. that.mapZrzData = "";
  3752. that.mapFsssData = "";
  3753. //that.mapZjdTeAll.active ="1";
  3754. that.mapZjdTeAll.mapZjdAData = {};
  3755. that.mapZjdTeAll.mapZrzAData = {};
  3756. that.mapZjdTeAll.mapFsssAData = {};
  3757. that.mapZjdDataTure = "";
  3758. that.mapXs =false;
  3759. that.mapClick ="";
  3760. console.log("【异常】", error);
  3761. });
  3762. }
  3763. if (url) {
  3764. fetch(url)
  3765. .then(function (response) {
  3766. return response.text();
  3767. })
  3768. .then(function (html) {
  3769. document.getElementById("info").innerHTML = html;
  3770. if (html.indexOf("<table") != -1) {
  3771. that.mapZjdData = "";
  3772. that.mapZrzData = "";
  3773. that.mapFsssData = "";
  3774. //that.mapZjdTeAll.active ="1";
  3775. that.mapZjdTeAll.mapZjdAData = {};
  3776. that.mapZjdTeAll.mapZrzAData = {};
  3777. that.mapZjdTeAll.mapFsssAData = {};
  3778. that.mapZjdDataTure = "";
  3779. setTimeout(() => {
  3780. if ($("#info .featureInfo .featureInfo").text() == "t_house_survey_zjdzd") {
  3781. map.removeLayer(hc_land_on);
  3782. that.mapHasDateStatus = 2;
  3783. that.mapXs = true;
  3784. let obj = {};
  3785. let trs = $("#info .featureInfo").find("tr:eq(1)");
  3786. let zjdXq = trs.find("td").eq(0).text();
  3787. let zjdIdNum = zjdXq.replace("t_house_survey_zjdzd.", "");
  3788. obj.id = zjdIdNum; // 主键id
  3789. obj.deptName = trs.find("td").eq(3).text();//行政区划名称
  3790. obj.zjddm = trs.find("td").eq(6).text();//宅基地代码
  3791. obj.zdmj = trs.find("td").eq(11).text();//宗地面积
  3792. obj.active = 1;
  3793. var vector_drawing_map;
  3794. let params = {
  3795. "deptId": that.$cookies.get("item").deptId,
  3796. "zjddm": obj.zjddm,
  3797. }
  3798. that.mapClick = obj.zjddm;
  3799. //点击查看自然幢
  3800. //自然幢图层查询开始 ------------------start
  3801. var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
  3802. zrzTc = new ol.layer.Image({
  3803. source: new ol.source.ImageWMS({
  3804. url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  3805. params: {
  3806. LAYERS: 'zjd_dc:t_house_survey_zrz',
  3807. TILED: true,
  3808. cql_filter: cql_filter_map,
  3809. SRID: 3857,
  3810. TIMESTAMP: new Date().getTime(),
  3811. },
  3812. }),
  3813. });
  3814. map.addLayer(zrzTc);
  3815. //自然幢图层查询开始 ------------------start
  3816. //附属设施图层查询开始 ------------------start
  3817. //var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
  3818. fsssTc = new ol.layer.Image({
  3819. source: new ol.source.ImageWMS({
  3820. url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  3821. params: {
  3822. LAYERS: 'zjd_dc:t_house_survey_fsss',
  3823. TILED: true,
  3824. cql_filter: cql_filter_map,
  3825. SRID: 3857,
  3826. TIMESTAMP: new Date().getTime(),
  3827. },
  3828. }),
  3829. });
  3830. map.addLayer(fsssTc);
  3831. //附属设施图层查询开始 ------------------end
  3832. that.$cookies.set("search", "")
  3833. //that.$cookies.set("map", "")
  3834. console.log(document.cookie.split(';').length)
  3835. console.log(params);
  3836. listZjdzd(params).then((response) => {
  3837. if (response.rows[0].zdmj != "") {
  3838. that.textMjAll = response.rows[0].zdmj;
  3839. } else {
  3840. that.textMjAllNum = "1";
  3841. }
  3842. that.mapZjdData = response.rows[0];
  3843. that.mapZjdData.active = 1;
  3844. that.mapZjdTeAll.mapZjdAData = that.mapZjdData;
  3845. that.mapZjdDataTure = 1;
  3846. that.zjdHcDy = obj.zjddm;
  3847. var styleZjd = new ol.style.Style({
  3848. stroke: new ol.style.Stroke({
  3849. //边界样式
  3850. color: "#CCFF66",
  3851. width: 6,
  3852. }),
  3853. });
  3854. hc_land_on = new ol.layer.Vector({
  3855. title: "add Layer",
  3856. source: new ol.source.Vector({
  3857. projection: projection,
  3858. features: new ol.format.GeoJSON().readFeatures("{\n" +
  3859. " \"type\": \"Feature\",\n" +
  3860. " \"geometry\":" + that.mapZjdData.theGeom + ", \"properties\":" + JSON.stringify(that.mapZjdData) + "}"),
  3861. }),
  3862. style: styleZjd
  3863. });
  3864. map.addLayer(hc_land_on);
  3865. var maxXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxX;
  3866. var maxYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxY;
  3867. var minXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minX;
  3868. var minYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minY;
  3869. //定位查询位置
  3870. var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  3871. map.getView().animate({
  3872. // 只设置需要的属性即可
  3873. center: center, // 中心点
  3874. zoom: 17.8, // 缩放级别
  3875. rotation: undefined, // 缩放完成view视图旋转弧度
  3876. duration: 1000, // 缩放持续时间,默认不需要设置
  3877. resolution:Math.random() * 0.00000001,
  3878. });
  3879. function createLabelStyleMap() {
  3880. return new ol.style.Style({
  3881. text: new ol.style.Text({
  3882. text: that.mapZjdData.syqr,
  3883. textAlign: "center", //位置
  3884. textBaseline: "middle", //基准线
  3885. font: "normal 16px 微软雅黑", //文字样式
  3886. //text: "标注点", //文本内容
  3887. fill: new ol.style.Fill({
  3888. //文本填充样式(即文字颜色)
  3889. color: "#09DDCE",
  3890. width: 10,
  3891. }),
  3892. overflow: false //超出面的部分不显示
  3893. }),
  3894. zIndex: 9999,
  3895. });
  3896. }
  3897. var newcenterFeatureMap = new ol.Feature({
  3898. geometry: new ol.geom.Point(center), //几何信息
  3899. //name: "标注点",
  3900. });
  3901. var sourceMapLookMap = new ol.source.Vector({wrapX: false});
  3902. vector_drawing_map = new ol.layer.Vector({
  3903. source: sourceMapLookMap,
  3904. });
  3905. map.addLayer(vector_drawing_map);
  3906. newcenterFeatureMap.setStyle(createLabelStyleMap()); //设置要素样式
  3907. sourceMapLookMap.addFeature(newcenterFeatureMap);
  3908. });
  3909. //let cloneObj = JSON.parse(JSON.stringify(obj));
  3910. //that.mapZjdData = cloneObj;
  3911. } else if ($("#info .featureInfo .featureInfo").text() == "t_house_survey_zrz") {
  3912. //that.mapZjdTeAll.mapZjdAData ={};
  3913. that.mapZjdDataTure = "";
  3914. that.mapZjdTeAll.mapFsssAData = {};
  3915. map.removeLayer(hc_land_on);
  3916. let obj = {};
  3917. that.mapHasDateStatus = 1;
  3918. let trs = $("#info .featureInfo").find("tr:eq(1)");
  3919. let zrzXq = trs.find("td").eq(0).text();
  3920. let zrzIdNum = zrzXq.replace("t_house_survey_zrz.", "");
  3921. obj.id = zrzIdNum; // 主键id
  3922. obj.deptName = trs.find("td").eq(3).text();//行政区划名称
  3923. obj.zjddm = trs.find("td").eq(4).text();//宅基地代码
  3924. obj.scjzmj = trs.find("td").eq(12).text();//实测建筑面积
  3925. let params = {
  3926. "deptId": that.$cookies.get("item").deptId,
  3927. "zjddm": obj.zjddm,
  3928. }
  3929. that.$cookies.set("search", "")
  3930. //that.$cookies.set("map", "")
  3931. console.log(that.mapZjdData);
  3932. //if (that.mapZjdData !="" && that.mapZjdData !=null && that.mapZjdData !=undefined) {
  3933. console.log(that.mapClick);
  3934. console.log(obj.zjddm);
  3935. if(that.mapXs && that.mapClick == obj.zjddm){
  3936. listZjdzd(params).then((response) => {
  3937. that.mapZjdData = response.rows[0];
  3938. //that.mapZjdAData.active = 1;
  3939. that.mapZjdTeAll.mapZjdAData = that.mapZjdData;
  3940. getZrz(obj.id).then((response) => {
  3941. if (response.data.scjzmj != "") {
  3942. that.textMjAll = response.data.scjzmj;
  3943. } else {
  3944. that.textMjAllNum = "1";
  3945. }
  3946. that.mapZrzData = response.data;
  3947. that.mapZrzData.active = 3;
  3948. that.mapZjdTeAll.mapZrzAData = that.mapZrzData;
  3949. that.zjdHcDy = obj.zjddm;
  3950. var styleZjd = new ol.style.Style({
  3951. stroke: new ol.style.Stroke({
  3952. //边界样式
  3953. color: "#CCFF66",
  3954. width: 6,
  3955. }),
  3956. });
  3957. hc_land_on = new ol.layer.Vector({
  3958. title: "add Layer",
  3959. source: new ol.source.Vector({
  3960. projection: projection,
  3961. features: new ol.format.GeoJSON().readFeatures("{\n" +
  3962. " \"type\": \"Feature\",\n" +
  3963. " \"geometry\":" + that.mapZrzData.theGeom + ", \"properties\":" + JSON.stringify(that.mapZrzData) + "}"),
  3964. }),
  3965. style: styleZjd
  3966. });
  3967. map.addLayer(hc_land_on);
  3968. var maxXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxX;
  3969. var maxYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxY;
  3970. var minXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minX;
  3971. var minYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minY;
  3972. //定位查询位置
  3973. var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  3974. map.getView().animate({
  3975. // 只设置需要的属性即可
  3976. center: center, // 中心点
  3977. zoom: 17.8, // 缩放级别
  3978. rotation: undefined, // 缩放完成view视图旋转弧度
  3979. duration: 1000, // 缩放持续时间,默认不需要设置
  3980. resolution: Math.random() * 0.00000001,
  3981. });
  3982. });
  3983. });
  3984. } else {
  3985. //自然幢图层查询开始 ------------------start
  3986. var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
  3987. zrzTc = new ol.layer.Image({
  3988. source: new ol.source.ImageWMS({
  3989. url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  3990. params: {
  3991. LAYERS: 'zjd_dc:t_house_survey_zrz',
  3992. TILED: true,
  3993. cql_filter: cql_filter_map,
  3994. SRID: 3857,
  3995. TIMESTAMP: new Date().getTime(),
  3996. },
  3997. }),
  3998. });
  3999. map.addLayer(zrzTc);
  4000. //自然幢图层查询开始 ------------------start
  4001. //附属设施图层查询开始 ------------------start
  4002. //var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
  4003. fsssTc = new ol.layer.Image({
  4004. source: new ol.source.ImageWMS({
  4005. url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  4006. params: {
  4007. LAYERS: 'zjd_dc:t_house_survey_fsss',
  4008. TILED: true,
  4009. cql_filter: cql_filter_map,
  4010. SRID: 3857,
  4011. TIMESTAMP: new Date().getTime(),
  4012. },
  4013. }),
  4014. });
  4015. map.addLayer(fsssTc);
  4016. //附属设施图层查询开始 ------------------end
  4017. listZjdzd(params).then((response) => {
  4018. if (response.rows[0].zdmj != "") {
  4019. that.textMjAll = response.rows[0].zdmj;
  4020. } else {
  4021. that.textMjAllNum = "1";
  4022. }
  4023. that.mapZjdData = response.rows[0];
  4024. that.mapZjdData.active = 1;
  4025. that.mapZjdTeAll.mapZjdAData = that.mapZjdData;
  4026. that.mapZjdDataTure = 1;
  4027. that.zjdHcDy = obj.zjddm;
  4028. that.mapClick = obj.zjddm;
  4029. that.mapXs = true;
  4030. var styleZjd = new ol.style.Style({
  4031. stroke: new ol.style.Stroke({
  4032. //边界样式
  4033. color: "#CCFF66",
  4034. width: 6,
  4035. }),
  4036. });
  4037. hc_land_on = new ol.layer.Vector({
  4038. title: "add Layer",
  4039. source: new ol.source.Vector({
  4040. projection: projection,
  4041. features: new ol.format.GeoJSON().readFeatures("{\n" +
  4042. " \"type\": \"Feature\",\n" +
  4043. " \"geometry\":" + that.mapZjdData.theGeom + ", \"properties\":" + JSON.stringify(that.mapZjdData) + "}"),
  4044. }),
  4045. style: styleZjd
  4046. });
  4047. map.addLayer(hc_land_on);
  4048. var maxXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxX;
  4049. var maxYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxY;
  4050. var minXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minX;
  4051. var minYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minY;
  4052. //定位查询位置
  4053. var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  4054. map.getView().animate({
  4055. // 只设置需要的属性即可
  4056. center: center, // 中心点
  4057. zoom: 17.8, // 缩放级别
  4058. rotation: undefined, // 缩放完成view视图旋转弧度
  4059. duration: 1000, // 缩放持续时间,默认不需要设置
  4060. resolution:Math.random() * 0.00000001,
  4061. });
  4062. function createLabelStyleMap() {
  4063. return new ol.style.Style({
  4064. text: new ol.style.Text({
  4065. text: that.mapZjdData.syqr,
  4066. textAlign: "center", //位置
  4067. textBaseline: "middle", //基准线
  4068. font: "normal 16px 微软雅黑", //文字样式
  4069. //text: "标注点", //文本内容
  4070. fill: new ol.style.Fill({
  4071. //文本填充样式(即文字颜色)
  4072. color: "#09DDCE",
  4073. width: 10,
  4074. }),
  4075. overflow: false //超出面的部分不显示
  4076. }),
  4077. zIndex: 9999,
  4078. });
  4079. }
  4080. var newcenterFeatureMap = new ol.Feature({
  4081. geometry: new ol.geom.Point(center), //几何信息
  4082. //name: "标注点",
  4083. });
  4084. var sourceMapLookMap = new ol.source.Vector({wrapX: false});
  4085. vector_drawing_map = new ol.layer.Vector({
  4086. source: sourceMapLookMap,
  4087. });
  4088. map.addLayer(vector_drawing_map);
  4089. newcenterFeatureMap.setStyle(createLabelStyleMap()); //设置要素样式
  4090. sourceMapLookMap.addFeature(newcenterFeatureMap);
  4091. });
  4092. }
  4093. } else if ($("#info .featureInfo .featureInfo").text() == "t_house_survey_fsss") {
  4094. that.mapZjdTeAll.mapZrzAData = {};
  4095. that.mapZjdDataTure = "";
  4096. //that.mapZjdTeAll.mapZjdAData ={};
  4097. map.removeLayer(hc_land_on);
  4098. let obj = {};
  4099. that.mapHasDateStatus = 0;
  4100. let trs = $("#info .featureInfo").find("tr:eq(1)");
  4101. let fsssXq = trs.find("td").eq(0).text();
  4102. let fsssIdNum = fsssXq.replace("t_house_survey_fsss.", "");
  4103. obj.id = fsssIdNum; // 主键id
  4104. obj.deptName = trs.find("td").eq(4).text();//行政区划名称
  4105. obj.zjddm = trs.find("td").eq(1).text();//宅基地代码
  4106. // obj.houseDataConfirmStatus = trs.find("td").eq(6).text(); //状态
  4107. // obj.fssslx = trs.find("td").eq(7).text(); //附属设施类型
  4108. obj.jzmj = trs.find("td").eq(8).text(); //建筑面积
  4109. let params = {
  4110. "deptId": that.$cookies.get("item").deptId,
  4111. "zjddm": obj.zjddm,
  4112. "pageSize": 20,
  4113. }
  4114. that.$cookies.remove("search")
  4115. //if (that.mapZjdData !="" && that.mapZjdData !=null && that.mapZjdData !=undefined) {
  4116. if(that.mapXs && that.mapClick == obj.zjddm){
  4117. listZjdzd(params).then((response) => {
  4118. that.mapZjdData = response.rows[0];
  4119. that.mapZjdData.active = 1;
  4120. that.mapZjdTeAll.mapZjdAData = that.mapZjdData;
  4121. getFsss(obj.id).then((response) => {
  4122. if (response.data.jzmj != "") {
  4123. that.textMjAll = response.data.jzmj;
  4124. } else {
  4125. that.textMjAllNum = "1";
  4126. }
  4127. //that.mapfsssData.active = 4;
  4128. that.mapfsssData = response.data;
  4129. console.log(that.mapfsssData);
  4130. that.mapZjdTeAll.mapFsssAData = that.mapfsssData;
  4131. that.zjdHcDy = obj.zjddm;
  4132. var styleZjd = new ol.style.Style({
  4133. stroke: new ol.style.Stroke({
  4134. //边界样式
  4135. color: "#CCFF66",
  4136. width: 6,
  4137. }),
  4138. });
  4139. hc_land_on = new ol.layer.Vector({
  4140. title: "add Layer",
  4141. source: new ol.source.Vector({
  4142. projection: projection,
  4143. features: new ol.format.GeoJSON().readFeatures("{\n" +
  4144. " \"type\": \"Feature\",\n" +
  4145. " \"geometry\":" + that.mapfsssData.theGeom + ", \"properties\":" + JSON.stringify(that.mapfsssData) + "}"),
  4146. }),
  4147. style: styleZjd
  4148. });
  4149. map.addLayer(hc_land_on);
  4150. var maxXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxX;
  4151. var maxYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxY;
  4152. var minXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minX;
  4153. var minYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minY;
  4154. //定位查询位置
  4155. var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  4156. map.getView().animate({
  4157. // 只设置需要的属性即可
  4158. center: center, // 中心点
  4159. zoom: 17.8, // 缩放级别
  4160. rotation: undefined, // 缩放完成view视图旋转弧度
  4161. duration: 1000, // 缩放持续时间,默认不需要设置
  4162. resolution: Math.random() * 0.00000001,
  4163. });
  4164. });
  4165. });
  4166. } else {
  4167. //自然幢图层查询开始 ------------------start
  4168. var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
  4169. zrzTc = new ol.layer.Image({
  4170. source: new ol.source.ImageWMS({
  4171. url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  4172. params: {
  4173. LAYERS: 'zjd_dc:t_house_survey_zrz',
  4174. TILED: true,
  4175. cql_filter: cql_filter_map,
  4176. SRID: 3857,
  4177. TIMESTAMP: new Date().getTime(),
  4178. },
  4179. }),
  4180. });
  4181. map.addLayer(zrzTc);
  4182. //自然幢图层查询开始 ------------------start
  4183. //附属设施图层查询开始 ------------------start
  4184. //var cql_filter_map = "dept_id='" + that.$cookies.get("item").deptId + "'" + "and zjddm='" + obj.zjddm + "'";
  4185. fsssTc = new ol.layer.Image({
  4186. source: new ol.source.ImageWMS({
  4187. url: that.mapGeoServerUrl + "/geoserver/zjd_dc/wms",
  4188. params: {
  4189. LAYERS: 'zjd_dc:t_house_survey_fsss',
  4190. TILED: true,
  4191. cql_filter: cql_filter_map,
  4192. SRID: 3857,
  4193. TIMESTAMP: new Date().getTime(),
  4194. },
  4195. }),
  4196. });
  4197. map.addLayer(fsssTc);
  4198. //附属设施图层查询开始 ------------------end
  4199. listZjdzd(params).then((response) => {
  4200. if (response.rows[0].zdmj != "") {
  4201. that.textMjAll = response.rows[0].zdmj;
  4202. } else {
  4203. that.textMjAllNum = "1";
  4204. }
  4205. that.mapZjdData = response.rows[0];
  4206. that.mapZjdData.active = 1;
  4207. that.mapZjdTeAll.mapZjdAData = that.mapZjdData;
  4208. that.mapZjdDataTure = 1;
  4209. that.zjdHcDy = obj.zjddm;
  4210. that.mapClick = obj.zjddm;
  4211. that.mapXs = true;
  4212. var styleZjd = new ol.style.Style({
  4213. stroke: new ol.style.Stroke({
  4214. //边界样式
  4215. color: "#CCFF66",
  4216. width: 6,
  4217. }),
  4218. });
  4219. hc_land_on = new ol.layer.Vector({
  4220. title: "add Layer",
  4221. source: new ol.source.Vector({
  4222. projection: projection,
  4223. features: new ol.format.GeoJSON().readFeatures("{\n" +
  4224. " \"type\": \"Feature\",\n" +
  4225. " \"geometry\":" + that.mapZjdData.theGeom + ", \"properties\":" + JSON.stringify(that.mapZjdData) + "}"),
  4226. }),
  4227. style: styleZjd
  4228. });
  4229. map.addLayer(hc_land_on);
  4230. var maxXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxX;
  4231. var maxYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.maxY;
  4232. var minXMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minX;
  4233. var minYMap = hc_land_on.values_.source.featuresRtree_.rbush_.data.minY;
  4234. //定位查询位置
  4235. var center = ol.extent.getCenter([maxXMap, maxYMap, minXMap, minYMap]); //获取边界区域的中心位置
  4236. map.getView().animate({
  4237. // 只设置需要的属性即可
  4238. center: center, // 中心点
  4239. zoom: 17.8, // 缩放级别
  4240. rotation: undefined, // 缩放完成view视图旋转弧度
  4241. duration: 1000, // 缩放持续时间,默认不需要设置
  4242. resolution:Math.random() * 0.00000001,
  4243. });
  4244. function createLabelStyleMap() {
  4245. return new ol.style.Style({
  4246. text: new ol.style.Text({
  4247. text: that.mapZjdData.syqr,
  4248. textAlign: "center", //位置
  4249. textBaseline: "middle", //基准线
  4250. font: "normal 16px 微软雅黑", //文字样式
  4251. //text: "标注点", //文本内容
  4252. fill: new ol.style.Fill({
  4253. //文本填充样式(即文字颜色)
  4254. color: "#09DDCE",
  4255. width: 10,
  4256. }),
  4257. overflow: false //超出面的部分不显示
  4258. }),
  4259. zIndex: 9999,
  4260. });
  4261. }
  4262. var newcenterFeatureMap = new ol.Feature({
  4263. geometry: new ol.geom.Point(center), //几何信息
  4264. //name: "标注点",
  4265. });
  4266. var sourceMapLookMap = new ol.source.Vector({wrapX: false});
  4267. vector_drawing_map = new ol.layer.Vector({
  4268. source: sourceMapLookMap,
  4269. });
  4270. map.addLayer(vector_drawing_map);
  4271. newcenterFeatureMap.setStyle(createLabelStyleMap()); //设置要素样式
  4272. sourceMapLookMap.addFeature(newcenterFeatureMap);
  4273. });
  4274. }
  4275. // if(obj.jzmj != ""){
  4276. // that.textMjAll = obj.jzmj;
  4277. // } else {
  4278. // that.textMjAllNum = "1";
  4279. // }
  4280. } else {
  4281. }
  4282. }, 300);
  4283. } else {
  4284. }
  4285. });
  4286. }
  4287. }
  4288. //数据库查询详情时使用----------------------------------------start
  4289. // if(feature) {
  4290. // //document.getElementById("info").innerHTML = "";
  4291. // that.mapHaDataValue = true;
  4292. // var ifConsole = feature.values_.createBy;
  4293. // if (ifConsole =="mapTheGeomFsssId") {
  4294. // let obj = {};
  4295. // that.mapHasDateStatus = 0;
  4296. // obj.deptName = feature.values_.deptName;//行政区划名称
  4297. // obj.zjddm = feature.values_.zjddm;//宅基地代码
  4298. // obj.houseDataConfirmStatus = feature.values_.houseDataConfirmStatus; //状态
  4299. // obj.fssslx = feature.values_.fssslx; //附属设施类型
  4300. // obj.jzmj = feature.values_.jzmj; //建筑面积
  4301. // obj.qsly = feature.values_.qsly;//权属来源
  4302. // obj.fwzt = feature.values_.fwzt; //房屋状态
  4303. // obj.sfsp = feature.values_.sfsp; //是否审批
  4304. // obj.sffz = feature.values_.sffz; //是否发证
  4305. // obj.jglx = feature.values_.jglx; //结构类型
  4306. // obj.sfzzsy = feature.values_.sfzzsy; //是否正在使用
  4307. // obj.jzwqk = feature.values_.jzwqk; //建筑物情况
  4308. // obj.tdzk = feature.values_.tdzk; //审批或建设前土地状况
  4309. // obj.sfsgcf = feature.values_.sfsgcf; //是否受过处罚
  4310. // obj.sysNormalDisable = feature.values_.sysNormalDisable; //是否停用
  4311. // //附属设施类型字典项
  4312. // that.getDicts("fsss_type").then((response) => {
  4313. // var assetTypeOptions = response.data;
  4314. // if(obj.fssslx !=null && obj.fssslx !=""){
  4315. // for(var i=0;assetTypeOptions.length >i; i++){
  4316. // if(obj.fssslx == assetTypeOptions[i].dictValue) {
  4317. // obj.fssslx = assetTypeOptions[i].dictLabel;
  4318. // break;
  4319. // }
  4320. // }
  4321. // }
  4322. // });
  4323. // //权属类型字典项
  4324. // that.getDicts("acquisition_method").then((response) => {
  4325. // var assetTypeOptions = response.data;
  4326. // if(obj.qsly !=null && obj.qsly !=""){
  4327. // for(var i=0;assetTypeOptions.length >i; i++){
  4328. // if(obj.qsly == assetTypeOptions[i].dictValue) {
  4329. // obj.qsly = assetTypeOptions[i].dictLabel;
  4330. // break;
  4331. // }
  4332. // }
  4333. // }
  4334. // });
  4335. // //房屋状态字典项
  4336. // that.getDicts("fwzt").then((response) => {
  4337. // var assetTypeOptions = response.data;
  4338. // if(obj.fwzt !=null && obj.fwzt !=""){
  4339. // for(var i=0;assetTypeOptions.length >i; i++){
  4340. // if(obj.fwzt == assetTypeOptions[i].dictValue) {
  4341. // obj.fwzt = assetTypeOptions[i].dictLabel;
  4342. // break;
  4343. // }
  4344. // }
  4345. // }
  4346. // });
  4347. // //是否审批字典项
  4348. // that.getDicts("sys_yes_no").then((response) => {
  4349. // var assetTypeOptions = response.data;
  4350. // if(obj.sfsp !=null && obj.sfsp !=""){
  4351. // for(var i=0;assetTypeOptions.length >i; i++){
  4352. // if(obj.sfsp == assetTypeOptions[i].dictValue) {
  4353. // obj.sfsp = assetTypeOptions[i].dictLabel;
  4354. // break;
  4355. // }
  4356. // }
  4357. // }
  4358. // });
  4359. // //是否发证字典项
  4360. // that.getDicts("sys_yes_no").then((response) => {
  4361. // var assetTypeOptions = response.data;
  4362. // if(obj.sffz !=null && obj.sffz !=""){
  4363. // for(var i=0;assetTypeOptions.length >i; i++){
  4364. // if(obj.sffz == assetTypeOptions[i].dictValue) {
  4365. // obj.sffz = assetTypeOptions[i].dictLabel;
  4366. // break;
  4367. // }
  4368. // }
  4369. // }
  4370. // });
  4371. // //结构类型字典项
  4372. // that.getDicts("house_jglx").then((response) => {
  4373. // var assetTypeOptions = response.data;
  4374. // if(obj.jglx !=null && obj.jglx !=""){
  4375. // for(var i=0;assetTypeOptions.length >i; i++){
  4376. // if(obj.jglx == assetTypeOptions[i].dictValue) {
  4377. // obj.jglx = assetTypeOptions[i].dictLabel;
  4378. // break;
  4379. // }
  4380. // }
  4381. // }
  4382. // });
  4383. // //是否正在使用字典项
  4384. // that.getDicts("sys_yes_no").then((response) => {
  4385. // var assetTypeOptions = response.data;
  4386. // if(obj.sfzzsy !=null && obj.sfzzsy !=""){
  4387. // for(var i=0;assetTypeOptions.length >i; i++){
  4388. // if(obj.sfzzsy == assetTypeOptions[i].dictValue) {
  4389. // obj.sfzzsy = assetTypeOptions[i].dictLabel;
  4390. // break;
  4391. // }
  4392. // }
  4393. // }
  4394. // });
  4395. // //房屋状态字典项
  4396. // that.getDicts("fwzt").then((response) => {
  4397. // var assetTypeOptions = response.data;
  4398. // if(obj.fwzt !=null && obj.fwzt !=""){
  4399. // for(var i=0;assetTypeOptions.length >i; i++){
  4400. // if(obj.fwzt == assetTypeOptions[i].dictValue) {
  4401. // obj.fwzt = assetTypeOptions[i].dictLabel;
  4402. // break;
  4403. // }
  4404. // }
  4405. // }
  4406. // });
  4407. // //土地状况字典项
  4408. // that.getDicts("land_state").then((response) => {
  4409. // var assetTypeOptions = response.data;
  4410. // if(obj.tdzk !=null && obj.tdzk !=""){
  4411. // for(var i=0;assetTypeOptions.length >i; i++){
  4412. // if(obj.tdzk == assetTypeOptions[i].dictValue) {
  4413. // obj.tdzk = assetTypeOptions[i].dictLabel;
  4414. // break;
  4415. // }
  4416. // }
  4417. // }
  4418. // });
  4419. // //是否受过处罚字典项
  4420. // that.getDicts("land_state").then((response) => {
  4421. // var assetTypeOptions = response.data;
  4422. // if(obj.sfsgcf !=null && obj.sfsgcf !=""){
  4423. // for(var i=0;assetTypeOptions.length >i; i++){
  4424. // if(obj.sfsgcf == assetTypeOptions[i].dictValue) {
  4425. // obj.sfsgcf = assetTypeOptions[i].dictLabel;
  4426. // break;
  4427. // }
  4428. // }
  4429. // }
  4430. // });
  4431. // that.mapFsssData = obj;
  4432. // } else if(ifConsole =="mapTheGeomZrzId"){
  4433. // let obj = {};
  4434. // that.mapHasDateStatus = 1;
  4435. // obj.deptName = feature.values_.deptName;//部门名称
  4436. // obj.zjddm = feature.values_.zjddm;//宅基地代码
  4437. // obj.nmfwzh = feature.values_.nmfwzh;//农民房屋幢号
  4438. // obj.zrzh = feature.values_.zrzh;//自然幢号
  4439. // obj.jgrq = feature.values_.jgrq;//竣工日期
  4440. // obj.jzwgd = feature.values_.jzwgd;//建筑物高度
  4441. // obj.zzdmj = feature.values_.zzdmj;//幢占地面积
  4442. // obj.zydmj = feature.values_.zydmj;//幢用地面积
  4443. // obj.scjzmj = feature.values_.scjzmj;//实测建筑面积
  4444. // obj.zcs = feature.values_.zcs;//总层数
  4445. // obj.dscs = feature.values_.dscs;//地上层数
  4446. // obj.dxcs = feature.values_.dxcs;//地下层数
  4447. // obj.fwjg = feature.values_.fwjg;//房屋结构
  4448. // obj.sjly = feature.values_.sjly;//数据来源
  4449. // obj.status = feature.values_.status;//状态
  4450. // obj.houseDataConfirmStatus = feature.values_.houseDataConfirmStatus;//数据调查确认状态
  4451. // //字典项转化
  4452. // //房屋结构字典项
  4453. // that.getDicts("housing_structure").then((response) => {
  4454. // var assetTypeOptions = response.data;
  4455. // if(obj.fwjg !=null && obj.fwjg !=""){
  4456. // for(var i=0;assetTypeOptions.length >i; i++){
  4457. // if(obj.fwjg == assetTypeOptions[i].dictValue) {
  4458. // obj.fwjg = assetTypeOptions[i].dictLabel;
  4459. // break;
  4460. // }
  4461. // }
  4462. // }
  4463. // });
  4464. // //房屋结构字典项
  4465. // that.getDicts("sjly").then((response) => {
  4466. // var assetTypeOptions = response.data;
  4467. // if(obj.sjly !=null && obj.sjly !=""){
  4468. // for(var i=0;assetTypeOptions.length >i; i++){
  4469. // if(obj.sjly == assetTypeOptions[i].dictValue) {
  4470. // obj.sjly = assetTypeOptions[i].dictLabel;
  4471. // break;
  4472. // }
  4473. // }
  4474. // }
  4475. // });
  4476. // that.mapZrzData = obj;
  4477. // } else if(ifConsole =="mapTheGeomZjdId"){
  4478. // let obj = {};
  4479. // that.mapHasDateStatus = 2;
  4480. // obj.deptName = feature.values_.deptName;//行政区划名称
  4481. // obj.suyqrdm = feature.values_.suyqrdm;//所有权人代码
  4482. // obj.nhdm = feature.values_.nhdm;//农户代码
  4483. // obj.zjddm = feature.values_.zjddm;//宅基地代码
  4484. // obj.zdbh = feature.values_.zdbh;//宗地编号
  4485. // obj.zddm = feature.values_.zddm;//宗地代码
  4486. // obj.zl = feature.values_.zl;//坐落
  4487. // obj.zldwdm = feature.values_.zldwdm;//坐落单位代码
  4488. // obj.zdmj = feature.values_.zdmj;//宗地面积
  4489. // obj.yt = feature.values_.yt;//用途
  4490. // obj.ytmc = feature.values_.ytmc;//用途名称
  4491. // obj.dj = feature.values_.dj;//宗地编号
  4492. // obj.jg = feature.values_.jg;//价格万元
  4493. // obj.qllx = feature.values_.qllx;//权利类型
  4494. // obj.qlxz = feature.values_.qlxz;//权利性质
  4495. // obj.qlsdfs = feature.values_.qlsdfs;//权利设定方式
  4496. // obj.rjl = feature.values_.rjl;//容积率
  4497. // obj.jzmd = feature.values_.jzmd;//建筑密度
  4498. // obj.jzxg = feature.values_.jzxg;//建筑限高
  4499. // obj.zdszd = feature.values_.zdszd;//宗地四至-东
  4500. // obj.zdszn = feature.values_.zdszn;//宗地四至-南
  4501. // obj.zdszx = feature.values_.zdszx;//宗地四至-西
  4502. // obj.zdszb = feature.values_.zdszb;//宗地四至-北
  4503. // obj.zdt = feature.values_.zdt;//宗地图
  4504. // obj.tfh = feature.values_.tfh;//图幅号
  4505. // obj.djh = feature.values_.djh;//地籍号
  4506. // obj.sjly = feature.values_.sjly;//数据来源
  4507. // obj.lyzk = feature.values_.lyzk;//当前利用状况
  4508. // obj.xzkssj = feature.values_.xzkssj;//闲置开始时间
  4509. // obj.sffz = feature.values_.sffz;//是否发证
  4510. // obj.zjdzsh = feature.values_.zjdzsh;//宅基地证书号
  4511. // obj.zjdxctp = feature.values_.zjdxctp;//宅基地现场图片
  4512. // obj.zjdqdfs = feature.values_.zjdqdfs;//宅基地取得方式
  4513. // obj.bccjl = feature.values_.bccjl;//被惩处经历
  4514. // obj.bccbz = feature.values_.bccbz;//被惩处备注
  4515. // obj.yctcyx = feature.values_.yctcyx;//有偿退出意向
  4516. // obj.zjdpzmj = feature.values_.zjdpzmj;//宅基地批准面积
  4517. // obj.zjdxzyy = feature.values_.zjdxzyy;//宅基地闲置原因
  4518. // obj.lzyx = feature.values_.lzyx;//流转意向
  4519. // obj.sysNormalDisable = feature.values_.sysNormalDisable;//是否停用
  4520. // obj.active = 1;
  4521. // //字典项转化
  4522. // //是否发证字典项
  4523. // that.getDicts("sys_yes_no").then((response) => {
  4524. // var assetTypeOptions = response.data;
  4525. // if(obj.sffz !=null && obj.sffz !=""){
  4526. // for(var i=0;assetTypeOptions.length >i; i++){
  4527. // if(obj.sffz == assetTypeOptions[i].dictValue) {
  4528. // obj.sffz = assetTypeOptions[i].dictLabel;
  4529. // break;
  4530. // }
  4531. // }
  4532. // }
  4533. // });
  4534. // //利用状态字典项
  4535. // that.getDicts("zjdlyzk").then((response) => {
  4536. // var assetTypeOptions = response.data;
  4537. // if(obj.lyzk !=null && obj.lyzk !=""){
  4538. // for(var i=0;assetTypeOptions.length >i; i++){
  4539. // if(obj.lyzk == assetTypeOptions[i].dictValue) {
  4540. // obj.lyzk = assetTypeOptions[i].dictLabel;
  4541. // break;
  4542. // }
  4543. // }
  4544. // }
  4545. // });
  4546. // //流转意向字典项
  4547. // that.getDicts("is_have").then((response) => {
  4548. // var assetTypeOptions = response.data;
  4549. // if(obj.lzyx !=null && obj.lzyx !=""){
  4550. // for(var i=0;assetTypeOptions.length >i; i++){
  4551. // if(obj.lzyx == assetTypeOptions[i].dictValue) {
  4552. // obj.lzyx = assetTypeOptions[i].dictLabel;
  4553. // break;
  4554. // }
  4555. // }
  4556. // }
  4557. // });
  4558. // //有偿退出意向字典项
  4559. // that.getDicts("is_have").then((response) => {
  4560. // var assetTypeOptions = response.data;
  4561. // if(obj.yctcyx !=null && obj.yctcyx !=""){
  4562. // for(var i=0;assetTypeOptions.length >i; i++){
  4563. // if(obj.yctcyx == assetTypeOptions[i].dictValue) {
  4564. // obj.yctcyx = assetTypeOptions[i].dictLabel;
  4565. // break;
  4566. // }
  4567. // }
  4568. // }
  4569. // });
  4570. // //被惩处经历字典项
  4571. // that.getDicts("is_have").then((response) => {
  4572. // var assetTypeOptions = response.data;
  4573. // if(obj.bccjl !=null && obj.bccjl !=""){
  4574. // for(var i=0;assetTypeOptions.length >i; i++){
  4575. // if(obj.bccjl == assetTypeOptions[i].dictValue) {
  4576. // obj.bccjl = assetTypeOptions[i].dictLabel;
  4577. // break;
  4578. // }
  4579. // }
  4580. // }
  4581. // });
  4582. // //宅基地取得方式字典项
  4583. // that.getDicts("acquisition_method").then((response) => {
  4584. // var assetTypeOptions = response.data;
  4585. // if(obj.zjdqdfs !=null && obj.zjdqdfs !=""){
  4586. // for(var i=0;assetTypeOptions.length >i; i++){
  4587. // if(obj.zjdqdfs == assetTypeOptions[i].dictValue) {
  4588. // obj.zjdqdfs = assetTypeOptions[i].dictLabel;
  4589. // break;
  4590. // }
  4591. // }
  4592. // }
  4593. // });
  4594. // //权利设定方式字典项
  4595. // that.getDicts("right_setting_mode").then((response) => {
  4596. // var assetTypeOptions = response.data;
  4597. // if(obj.qlsdfs !=null && obj.qlsdfs !=""){
  4598. // for(var i=0;assetTypeOptions.length >i; i++){
  4599. // if(obj.qlsdfs == assetTypeOptions[i].dictValue) {
  4600. // obj.qlsdfs = assetTypeOptions[i].dictLabel;
  4601. // break;
  4602. // }
  4603. // }
  4604. // }
  4605. // });
  4606. // //数据来源字典项
  4607. // that.getDicts("sjly").then((response) => {
  4608. // var assetTypeOptions = response.data;
  4609. // if(obj.sjly !=null && obj.sjly !=""){
  4610. // for(var i=0;assetTypeOptions.length >i; i++){
  4611. // if(obj.sjly == assetTypeOptions[i].dictValue) {
  4612. // obj.sjly = assetTypeOptions[i].dictLabel;
  4613. // break;
  4614. // }
  4615. // }
  4616. // }
  4617. // });
  4618. // that.mapZjdData = obj;
  4619. // console.log(obj.zjddm);
  4620. // that.zjdHcDy = obj.zjddm;
  4621. // } else {
  4622. // that.mapHaDataValue = false;
  4623. // }
  4624. // }else {
  4625. // that.mapHaDataValue = false;
  4626. // }
  4627. //数据库查询详情时使用----------------------------------------end
  4628. });
  4629. //数据库循环加载时使用 --------------------加载较慢 ------start
  4630. //当前账套没有任何空间数据
  4631. // if(mapTalkAbout){
  4632. // let deptName = this.$store.state.user.loginDeptId + "";
  4633. // getQueryLand(deptName).then((response) => {
  4634. // if (response.code == 200) {
  4635. // let InsertCode = response.data;
  4636. // if (InsertCode != null) {
  4637. // var lat = InsertCode.lat;
  4638. // var lng = InsertCode.lng;
  4639. // var center;
  4640. // if(lat !=null && lng !=null && lat !="" && lng !=""){
  4641. // center = [lng,lat];
  4642. // }else {
  4643. // center =[115.452752, 31.789033];
  4644. // }
  4645. // map.getView().animate({
  4646. // // 只设置需要的属性即可
  4647. // center: ol.proj.fromLonLat(center), // 中心点
  4648. // zoom: 17.9, // 缩放级别
  4649. // rotation: undefined, // 缩放完成view视图旋转弧度
  4650. // duration: 1000, // 缩放持续时间,默认不需要设置
  4651. // });
  4652. // }
  4653. // }
  4654. // });
  4655. // }
  4656. //数据库循环加载时使用 --------------------加载较慢 ------start
  4657. },
  4658. /*右侧列表 --展开收缩*/
  4659. selectionPushMap() {
  4660. this.selectionIconShow = true;
  4661. this.homesteadListStatus = true;
  4662. $(".homesteadList_wrap").animate(
  4663. {
  4664. right: "0",
  4665. },
  4666. 300
  4667. );
  4668. },
  4669. homesteadListShrink() {
  4670. this.selectionIconShow = false;
  4671. // this.checked =["zjdSx","zrzSx","fsssSx"];
  4672. $(".homesteadList_wrap").animate(
  4673. {
  4674. right: "-300px",
  4675. },
  4676. 300
  4677. );
  4678. setTimeout(() => {
  4679. this.homesteadListStatus = false;
  4680. }, 300);
  4681. },
  4682. checkClick(res){
  4683. // 1、全选与不全选模块
  4684. $(".checkall").change(function() {
  4685. $(".item-list-checkbox .checkitem").prop("checked", $(this).prop("checked"));
  4686. if($(this).prop("checked")){
  4687. }else {
  4688. }
  4689. });
  4690. // 2、小复选框模块
  4691. $(".checkitem").change(function() {
  4692. if ($(".checkitem:checked").length === $(".checkitem").length) {
  4693. $(".checkall").prop("checked", true);
  4694. } else {
  4695. $(".checkall").prop("checked", false);
  4696. }
  4697. })
  4698. },
  4699. //绘制多边形地图
  4700. drawMapPolygonFun() {
  4701. },
  4702. guidProduct(){
  4703. return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
  4704. var r = Math.random() * 16 | 0,
  4705. v = c == 'x' ? r : (r & 0x3 | 0x8);
  4706. return v.toString(16);
  4707. });
  4708. },
  4709. //宅基地点击地图核查
  4710. zjdHc(){
  4711. if(this.zjdHcDy != "" && this.zjdHcDy != "undefined"){
  4712. if(this.mapZjdData !=undefined && this.mapZjdData !="" && this.mapZjdDataTure !=""){
  4713. this.mapZjdTeAll.active =1;
  4714. //this.$cookies.set("search",this.mapZjdTeAll);
  4715. this.$cookies.set("search","")
  4716. this.$router.push({path:'/homesteadSurvey/add',query: {res: this.mapZjdTeAll}});
  4717. //this.$router.push({path:'/homesteadSurvey/add'});
  4718. }else if(this.mapZrzData !=undefined && this.mapZrzData !=""){
  4719. if(this.mapZjdTeAll.mapZjdAData !=""){
  4720. this.mapZjdTeAll.active = 3;
  4721. //this.$cookies.set("search",this.mapZjdTeAll);
  4722. this.$cookies.set("search","")
  4723. this.$router.push({path:'/homesteadSurvey/add',query: {res: this.mapZjdTeAll}});
  4724. } else {
  4725. this.$toast("必须有宅基地数据才能进入自然幢核查");
  4726. }
  4727. }else {
  4728. if(this.mapZjdTeAll.mapZjdAData !="") {
  4729. this.mapZjdTeAll.active = 4;
  4730. //this.$cookies.set("search", this.mapZjdTeAll);
  4731. this.$cookies.set("search","")
  4732. this.$router.push({path: '/homesteadSurvey/add',query: {res: this.mapZjdTeAll}});
  4733. } else {
  4734. this.$toast("必须有宅基地数据才能进入附属设施核查");
  4735. }
  4736. }
  4737. } else {
  4738. this.$dialog.alert({
  4739. title: '宅基地核查',
  4740. message: "请从地图中选择图层并点击核查",
  4741. theme: 'round-button',
  4742. }).then(() => {
  4743. // on close
  4744. });
  4745. }
  4746. },
  4747. //增加户内成员信息
  4748. addPopupnhcy(){
  4749. this.$router.push({path:'/homesteadSurvey/hncyDetails',query: {item:{nhdm:this.shyqrData.nhdm}}});
  4750. },
  4751. //搜索详情跳转
  4752. zjdSs(item){
  4753. this.mapZjdTeAll.mapZjdAData ={};
  4754. this.mapZjdTeAll.mapZrzAData ={};
  4755. this.mapZjdTeAll.mapFsssAData ={};
  4756. //this.mapZjdTeAll.active =1;
  4757. if(item.typeTc =="宅基地"){
  4758. getZjdzd(item.id).then((response) => {
  4759. this.mapZjdData = response.data;
  4760. this.mapZjdTeAll.active = 1;
  4761. this.mapZjdTeAll.mapZjdAData = this.mapZjdData;
  4762. //this.$cookies.set("search",this.mapZjdTeAll);
  4763. this.$cookies.set("search","")
  4764. setTimeout(() => {
  4765. this.$router.push({path:'/homesteadSurvey/add',query: {res: this.mapZjdTeAll}});
  4766. }, 500);
  4767. });
  4768. }else if(item.typeTc =="自然幢"){
  4769. //let =
  4770. getZjdzd(item.id).then((response) => {
  4771. this.mapZrzData = response.data;
  4772. this.mapZjdTeAll.active = 3;
  4773. this.mapZjdTeAll.mapZrzAData = this.mapZrzData;
  4774. //this.$cookies.set("search",this.mapZjdTeAll);
  4775. this.$cookies.set("search","")
  4776. setTimeout(() => {
  4777. this.$router.push({path:'/homesteadSurvey/add',query: {res: this.mapZjdTeAll}});
  4778. }, 500);
  4779. });
  4780. }else if(item.typeTc =="附属设施"){
  4781. getFsss(item.id).then((response) => {
  4782. this.mapFsssData = response.data;
  4783. this.mapZjdTeAll.active = 4;
  4784. this.mapZjdTeAll.mapFsssAData = this.mapFsssData;
  4785. //this.$cookies.set("search",this.mapZjdTeAll);
  4786. this.$cookies.set("search","")
  4787. setTimeout(() => {
  4788. this.$router.push({path:'/homesteadSurvey/add',query: {res: this.mapZjdTeAll}});
  4789. }, 500);
  4790. });
  4791. }else{
  4792. this.$toast("无数据请检查后进入核查页面");
  4793. }
  4794. },
  4795. //地图查询
  4796. toggleSearch() {
  4797. $("#query").trigger("click");
  4798. },
  4799. //
  4800. checkAllArray(value){
  4801. if(this.checked.length<3){
  4802. this.$refs.checkboxGroup.toggleAll(true);
  4803. }else{
  4804. this.$refs.checkboxGroup.toggleAll(false);
  4805. }
  4806. },
  4807. //筛选//全选
  4808. checkAll(val) {
  4809. this.$refs.checkboxGroup.value.toggleAll(true);
  4810. return;
  4811. let checkedCount = this.CheckedAllArr.length
  4812. if (val) {
  4813. //全选
  4814. this.CheckedAllArr = this.dataList.map(item => item.id)
  4815. } else{
  4816. //取消全选
  4817. if (checkedCount === this.dataList.length) {
  4818. //如果不增加这个条件判断点击某一项时会全部取消
  4819. this.CheckedAllArr = []
  4820. }
  4821. }
  4822. },
  4823. //单选
  4824. handleChecked(value) {
  4825. // this.checkAllFlag = this.CheckedAllArr.length == this.dataList.length;
  4826. if (value.length<3){
  4827. this.checkAllFlag = false;
  4828. }else{
  4829. this.checkAllFlag = true;
  4830. }
  4831. value.indexOf('zjdSx') == -1 ? this.zjdSx = false : this.zjdSx = true;
  4832. value.indexOf('zrzSx') == -1 ? this.zrzSx = false : this.zrzSx = true;
  4833. value.indexOf('fsssSx') == -1 ? this.fsssSx = false : this.fsssSx = true;
  4834. },
  4835. closeSearchBox(){
  4836. this.showSearch = false ;
  4837. var height = $(".searchBar_wrap").outerHeight(true) - $(".searchBar_wrap .van-search").outerHeight(true)
  4838. document.styleSheets[0].insertRule(
  4839. "@keyframes test2" +
  4840. "{" +
  4841. "0%{bottom: 0px}" +
  4842. "100%{bottom: -" + height + "px;}" +
  4843. "}"
  4844. )
  4845. $('.searchBar_wrap').css({'animation':'test2 0.5s ease-in-out 0s 1 alternate forwards','-webkit-animation':'test2 0.5s ease-in-out 0s 1 alternate forwards'});
  4846. },
  4847. zjdTz(){
  4848. if(this.mapZjdData =="" && this.mapZjdDataTure =="" && this.mapZjdData !=undefined){
  4849. this.mapZjdTeAll.active =1;
  4850. this.mapZjdTeAll.mapZjdAData.deptId =JSON.parse(localStorage.getItem("surveyItem")).deptId;
  4851. this.mapZjdTeAll.mapZjdAData.theGeom =this.htZjdZrzFsss;
  4852. //this.mapZjdTeAll.mapZjdAData.deptId = this.$cookies.get("item").deptId;
  4853. //this.$cookies.set("search",this.mapZjdTeAll);
  4854. this.$cookies.set("search","")
  4855. this.$router.push({path:'/homesteadSurvey/add',query: {res: this.mapZjdTeAll}});
  4856. }else {
  4857. this.$toast("已选择宅基地,请选择自然幢或附属设施按钮");
  4858. }
  4859. },
  4860. zrzTz(){
  4861. if(this.mapZjdData !=undefined && this.mapZjdData !="" && this.mapZjdDataTure !=""){
  4862. this.mapZjdTeAll.active =3;
  4863. this.mapZjdTeAll.mapZrzAData.theGeom =this.htZjdZrzFsss;
  4864. this.mapZjdTeAll.mapZrzAData.deptId =JSON.parse(localStorage.getItem("surveyItem")).deptId;
  4865. //this.mapZjdTeAll.mapZrzAData.deptId = this.$cookies.get("item").deptId;
  4866. //this.$cookies.set("search",this.mapZjdTeAll);
  4867. this.$cookies.set("search","")
  4868. this.$router.push({path:'/homesteadSurvey/add',query: {res: this.mapZjdTeAll}});
  4869. }else {
  4870. this.$toast("请先在地图上选择宅基地后,再选择自然幢按钮");
  4871. }
  4872. },
  4873. fsssTz(){
  4874. if(this.mapZjdData !=undefined && this.mapZjdData !="" && this.mapZjdDataTure !=""){
  4875. this.mapZjdTeAll.active =4;
  4876. this.mapZjdTeAll.mapFsssAData.theGeom =this.htZjdZrzFsss;
  4877. this.mapZjdTeAll.mapFsssAData.deptId =JSON.parse(localStorage.getItem("surveyItem")).deptId;
  4878. //this.mapZjdTeAll.mapFsssAData.deptId = this.$cookies.get("item").deptId;
  4879. //this.$cookies.set("search",this.mapZjdTeAll);
  4880. this.$cookies.set("search","")
  4881. this.$router.push({path:'/homesteadSurvey/add',query: {res: this.mapZjdTeAll}});
  4882. }else {
  4883. this.$toast("请先在地图上选择宅基地后,再选择附属设施按钮");
  4884. }
  4885. },
  4886. //绘图重置清除之前图层
  4887. deleteHistory(){
  4888. $("#deleteHistory").trigger("click");
  4889. }
  4890. },
  4891. }
  4892. </script>
  4893. <style scoped lang="scss">
  4894. /deep/ .van-swipe-cell__wrapper{
  4895. margin-right:-3px;
  4896. }
  4897. .hzlxBtn{
  4898. font-size: 0.3rem;
  4899. display: inline-block;
  4900. padding: 2% 0;
  4901. border-radius: 30PX;
  4902. color: #FFF;
  4903. margin-right: 2%;
  4904. width: 30%;
  4905. &:last-child{
  4906. margin: 0;
  4907. }
  4908. }
  4909. .van-cell__title{
  4910. flex:2
  4911. }
  4912. .bannerBg{
  4913. width: 100%;
  4914. color:#fff;
  4915. /*padding:10px;*/
  4916. background: linear-gradient(134deg,#7ac943 1%, #22b7f2);
  4917. }
  4918. .van-hairline--bottom::after {
  4919. border-bottom-width: 0;
  4920. }
  4921. .activeBtn{
  4922. background:#fff;
  4923. border-radius:25PX;
  4924. color:#7AC943;
  4925. line-height:30PX;
  4926. text-align:center;
  4927. font-size:14PX;
  4928. width: 25%;
  4929. margin:0 10px;
  4930. box-shadow: 0px 5px 6px 0px rgba(0,0,0,0.16);
  4931. }
  4932. .disactiveBtn{
  4933. background:rgba(255,255,255,.4);
  4934. border-radius:25PX;
  4935. color:#fff;
  4936. line-height:30PX;
  4937. text-align:center;
  4938. font-size:14PX;
  4939. width: 25%;
  4940. margin:0 10px;
  4941. box-shadow: 0px 5px 6px 0px rgba(0,0,0,0.16);
  4942. }
  4943. /*.van-cell__label{*/
  4944. /* color: #969799;*/
  4945. /* font-size: 12px;*/
  4946. /* line-height: 20px;*/
  4947. /* margin:0*/
  4948. /*}*/
  4949. .map_area {
  4950. width: 50vw;
  4951. height: 50vh;
  4952. z-index:1;
  4953. background:#000;
  4954. position: fixed;
  4955. left: 0;
  4956. top: 0;
  4957. }
  4958. .van-field__label{
  4959. width:50%;
  4960. }
  4961. .rightZoom_wrap {
  4962. position: absolute;
  4963. right: 3%;
  4964. top: 35%;
  4965. margin-top: -200px;
  4966. background: #fff;
  4967. margin-bottom: 16px;
  4968. border-radius: 10px;
  4969. text-align: center;
  4970. padding: 15px 20px;
  4971. img{
  4972. margin: 0 auto;
  4973. }
  4974. .amplification {
  4975. line-height: 1;
  4976. font-size: 18px;
  4977. text-align: center;
  4978. margin-top: 5px;
  4979. }
  4980. }
  4981. .mapZoom_wrap {
  4982. position: absolute;
  4983. right: 3%;
  4984. top: 50%;
  4985. margin-top: -200px;
  4986. background: #fff;
  4987. margin-bottom: 16px;
  4988. border-radius: 10px;
  4989. padding: 0px 20px;
  4990. div{
  4991. padding: 15px 0;
  4992. border-bottom: 1px solid #C9C9C9;
  4993. &:last-child{
  4994. border: none;
  4995. }
  4996. p{
  4997. margin-top: 5px;
  4998. }
  4999. }
  5000. .qtMap {
  5001. font-size: 18px;
  5002. text-align: center;
  5003. line-height: 1;
  5004. }
  5005. .clMap {
  5006. font-size: 18px;
  5007. text-align: center;
  5008. line-height: 1;
  5009. }
  5010. .hcMap {
  5011. font-size: 18px;
  5012. text-align: center;
  5013. line-height: 1;
  5014. }
  5015. .htMap {
  5016. font-size: 18px;
  5017. text-align: center;
  5018. line-height: 1;
  5019. }
  5020. .dwMap {
  5021. font-size: 18px;
  5022. text-align: center;
  5023. line-height: 1;
  5024. }
  5025. }
  5026. .rightIcon_wrap {
  5027. position: absolute;
  5028. right: 16px;
  5029. bottom: 160px;
  5030. .selectionIcon_wrap {
  5031. width: 74px;
  5032. background: #fff;
  5033. border-radius: 10px;
  5034. padding: 14px 0;
  5035. .icon {
  5036. width: 38px;
  5037. height: 38px;
  5038. background: url("../../assets/images/homestead/selection_icon.png")
  5039. no-repeat;
  5040. background-size: 100% 100%;
  5041. margin: 0 auto 4px;
  5042. }
  5043. .text {
  5044. font-size: 24px;
  5045. text-align: center;
  5046. }
  5047. }
  5048. .positioning_wrap {
  5049. width: 74px;
  5050. background: #fff;
  5051. margin-bottom: 16px;
  5052. border-radius: 10px;
  5053. height: 74px;
  5054. display: flex;
  5055. justify-content: center; /* 相对父元素水平居中 */
  5056. align-items: center; /* 子元素相对父元素垂直居中*/
  5057. .icon {
  5058. width: 38px;
  5059. height: 38px;
  5060. background: url("../../assets/images/homestead/positioning_icon.png")
  5061. no-repeat;
  5062. background-size: 100% 100%;
  5063. margin: 0 auto;
  5064. }
  5065. }
  5066. }
  5067. .homesteadList_wrap {
  5068. // display: none;
  5069. display: flex;
  5070. position: absolute;
  5071. right: -200px;
  5072. top: 0px;
  5073. bottom: 0px;
  5074. width: 300px;
  5075. background: #fff;
  5076. z-index: 999;
  5077. border-top-left-radius: 15px;
  5078. border-bottom-left-radius: 15px;
  5079. flex-direction: column;
  5080. .noInfo_data {
  5081. font-size: 28px;
  5082. text-align: center;
  5083. height: 300px;
  5084. line-height: 300px;
  5085. color: #666;
  5086. }
  5087. .title_m {
  5088. color: #333;
  5089. line-height: 36px;
  5090. padding: 20px 40px 22px;
  5091. .name {
  5092. font-size: 36px;
  5093. line-height: 42px;
  5094. height: 42px;
  5095. }
  5096. .more_icon {
  5097. width: 38px;
  5098. height: 38px;
  5099. background: url("../../assets/images/homestead/selectionNext_icon.png")
  5100. no-repeat;
  5101. float: right;
  5102. margin-top: 2px;
  5103. }
  5104. }
  5105. .main_m {
  5106. overflow-y: auto;
  5107. padding: 10px 0;
  5108. // height: 300px;
  5109. flex: 1;
  5110. .flex_block {
  5111. height: 70px;
  5112. display: flex;
  5113. // justify-content: center; /* 相对父元素水平居中 */
  5114. align-items: center; /* 子元素相对父元素垂直居中 */
  5115. padding: 0 40px;
  5116. &.active {
  5117. box-shadow: 0px 0px 10px rgba(24, 45, 51, 0.5);
  5118. }
  5119. .name_text {
  5120. font-size: 28px;
  5121. flex: 0.5;
  5122. overflow: hidden; /*超出部分隐藏*/
  5123. white-space: nowrap; /*不换行*/
  5124. text-overflow: ellipsis; /*超出部分文字以...显示*/
  5125. }
  5126. .square_text {
  5127. font-size: 28px;
  5128. flex: 0.4;
  5129. }
  5130. .operation_mian {
  5131. flex: 0 0 150px;
  5132. .describe {
  5133. font-size: 20px;
  5134. padding: 6px 5px;
  5135. float: right;
  5136. color: #fff;
  5137. border-radius: 30px;
  5138. overflow: hidden;
  5139. text-overflow: ellipsis;
  5140. white-space: nowrap;
  5141. max-width: 150px;
  5142. &.yph {
  5143. background: #b026ff;
  5144. }
  5145. &.dlzdph {
  5146. background: #ff6f36;
  5147. }
  5148. &.ylz {
  5149. background: #7fff4c;
  5150. }
  5151. &.dlz {
  5152. background: rgb(255, 232, 76);
  5153. }
  5154. &.ylzdph {
  5155. background: #ff7dd0;
  5156. }
  5157. &.zy {
  5158. background: rgb(100, 30, 100);
  5159. }
  5160. &.xz {
  5161. background: rgb(60, 100, 180);
  5162. }
  5163. &.chdb {
  5164. background: #fe0303;
  5165. }
  5166. }
  5167. }
  5168. }
  5169. }
  5170. .footerBtn_wrap {
  5171. flex: 0 0 90px;
  5172. display: flex;
  5173. justify-content: center; /* 相对父元素水平居中 */
  5174. align-items: center; /* 子元素相对父元素垂直居中 */
  5175. .options {
  5176. flex: 1;
  5177. font-size: 38px;
  5178. display: flex;
  5179. justify-content: center; /* 相对父元素水平居中 */
  5180. align-items: center; /* 子元素相对父元素垂直居中 */
  5181. height: 90px;
  5182. &:first-child {
  5183. border-bottom-left-radius: 15px;
  5184. }
  5185. &.active {
  5186. background: #3cbf5b;
  5187. color: #fff;
  5188. }
  5189. }
  5190. }
  5191. }
  5192. .checkbox {
  5193. width: 200px;
  5194. margin: 30px auto;
  5195. }
  5196. .thead-checkbox {
  5197. background-color: lightgray;
  5198. }
  5199. .item-checkbox {
  5200. border: 1px solid darkgray;
  5201. }
  5202. .van-sticky{position: fixed;top: 0;right: 0; left: 0;z-index: 9999;}
  5203. .searchBar_wrap {
  5204. // display: none;
  5205. position: fixed;
  5206. left: 0;
  5207. bottom: 0;
  5208. width: 100%;
  5209. padding: 0px 16px 0px 13px;
  5210. background: #fff;
  5211. border-top-left-radius: 15px;
  5212. border-top-right-radius: 15px;
  5213. z-index: 9;
  5214. .searchBox{
  5215. height: 40vh;
  5216. overflow-y: scroll;
  5217. .van-cell{
  5218. /*&:first-child{*/
  5219. /* box-shadow: none;*/
  5220. /* margin:0;*/
  5221. /*}*/
  5222. box-shadow: 0px 0px 5px #cccccc;
  5223. border-radius: 15PX;
  5224. width: 98%;
  5225. margin: 0 auto;
  5226. margin-bottom: 0.35rem;
  5227. &:first-child{
  5228. margin-top: 5px;
  5229. }
  5230. }
  5231. .van-cell__title{
  5232. flex: 0.8;
  5233. p{
  5234. color: rgb(34, 183, 242);
  5235. .van-icon{
  5236. vertical-align: middle;
  5237. }
  5238. span{
  5239. vertical-align: middle;
  5240. &:nth-child(2){
  5241. overflow: hidden;
  5242. white-space: nowrap;
  5243. text-overflow: ellipsis;
  5244. display: inline-block;
  5245. width: 60%;
  5246. }
  5247. &:nth-child(3){
  5248. font-size: 0.25rem;
  5249. border-radius: 5PX;
  5250. padding: 5PX 15PX;
  5251. margin-left: 5%;
  5252. }
  5253. }
  5254. }
  5255. }
  5256. .van-cell__value{
  5257. flex: 0.2;
  5258. p{
  5259. font-size: 0.25rem;
  5260. display: inline-block;
  5261. border-radius: 1rem;
  5262. line-height: 1;
  5263. padding: 10%;
  5264. }
  5265. }
  5266. }
  5267. .actionBar_wrap {
  5268. display: flex;
  5269. position: absolute;
  5270. top: 0;
  5271. left: 0;
  5272. width: 100%;
  5273. height: 100%;
  5274. background: #fff;
  5275. border-top-left-radius: 15px;
  5276. border-top-right-radius: 15px;
  5277. .m_list {
  5278. flex: 1;
  5279. display: flex;
  5280. justify-content: center; /* 相对父元素水平居中 */
  5281. align-items: center; /* 子元素相对父元素垂直居中 */
  5282. .tensile,
  5283. .positioning,
  5284. .spacing,
  5285. .scale {
  5286. width: 76px;
  5287. height: 72px;
  5288. background: #ffffff;
  5289. border-radius: 8px;
  5290. box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.16);
  5291. .icon {
  5292. width: 76px;
  5293. height: 72px;
  5294. }
  5295. &.active {
  5296. background: #333;
  5297. &.tensile {
  5298. .icon {
  5299. background: url("../../assets/images/homestead/operation/tensile_active.png")
  5300. center center no-repeat;
  5301. background-size: 38px 50px;
  5302. }
  5303. }
  5304. &.positioning {
  5305. .icon {
  5306. background: url("../../assets/images/homestead/operation/positioning_active.png")
  5307. center center no-repeat;
  5308. background-size: 38px 48px;
  5309. }
  5310. }
  5311. &.spacing {
  5312. .icon {
  5313. background: url("../../assets/images/homestead/operation/spacing_active.png")
  5314. center center no-repeat;
  5315. background-size: 46px 46px;
  5316. }
  5317. }
  5318. &.scale {
  5319. .icon {
  5320. background: url("../../assets/images/homestead/operation/scale_active.png")
  5321. center center no-repeat;
  5322. background-size: 48px 48px;
  5323. }
  5324. }
  5325. }
  5326. }
  5327. .tensile {
  5328. .icon {
  5329. background: url("../../assets/images/homestead/operation/tensile.png")
  5330. center center no-repeat;
  5331. background-size: 38px 50px;
  5332. }
  5333. }
  5334. .positioning {
  5335. .icon {
  5336. background: url("../../assets/images/homestead/operation/positioning.png")
  5337. center center no-repeat;
  5338. background-size: 38px 48px;
  5339. }
  5340. }
  5341. .spacing {
  5342. .icon {
  5343. background: url("../../assets/images/homestead/operation/spacing.png")
  5344. center center no-repeat;
  5345. background-size: 46px 46px;
  5346. }
  5347. }
  5348. .scale {
  5349. .icon {
  5350. background: url("../../assets/images/homestead/operation/scale.png")
  5351. center center no-repeat;
  5352. background-size: 48px 48px;
  5353. }
  5354. }
  5355. .closes {
  5356. background: url("../../assets/images/homestead/searchBar_close.png")
  5357. no-repeat;
  5358. background-size: 100% 100%;
  5359. width: 72px;
  5360. height: 72px;
  5361. &.gray {
  5362. background: url("../../assets/images/homestead/searchBar_close_gray.png")
  5363. no-repeat;
  5364. background-size: 100% 100%;
  5365. }
  5366. }
  5367. .correct {
  5368. background: url("../../assets/images/homestead/searchBar_save.png")
  5369. no-repeat;
  5370. background-size: 100% 100%;
  5371. width: 72px;
  5372. height: 72px;
  5373. }
  5374. }
  5375. }
  5376. .searchBar_area {
  5377. flex: 1;
  5378. height: 80px;
  5379. background: #f1f1f1;
  5380. border: 1px solid #dfdfdf;
  5381. border-radius: 10px;
  5382. padding: 0 28px;
  5383. display: flex;
  5384. .bar_icon {
  5385. width: 50px;
  5386. height: 50px;
  5387. background: url("../../assets/images/homestead/searchBar_bar.png")
  5388. center center no-repeat;
  5389. background-size: 100% 100%;
  5390. margin-top: 14px;
  5391. margin-right: 15px;
  5392. }
  5393. .bar_ipt {
  5394. flex: 1;
  5395. input {
  5396. width: 100%;
  5397. height: 100%;
  5398. background: none;
  5399. border: 0 none;
  5400. font-size: 32px;
  5401. }
  5402. }
  5403. .bar_text {
  5404. flex: 0 0 80px;
  5405. font-size: 32px;
  5406. color: #333333;
  5407. font-family: PingFang SC, PingFang SC-Regular;
  5408. font-weight: 400;
  5409. display: flex;
  5410. justify-content: center; /* 相对父元素水平居中 */
  5411. align-items: center; /* 子元素相对父元素垂直居中 */
  5412. }
  5413. }
  5414. .searchBar_more {
  5415. flex: 0 0 80px;
  5416. background: url("../../assets/images/homestead/searchBar_add.png") center
  5417. center no-repeat;
  5418. background-size: 80% 80%;
  5419. margin-left: 15px;
  5420. }
  5421. }
  5422. </style>