From ce0d1b5ed54ef4f08ce4d3dad60a9659e5bb57c2 Mon Sep 17 00:00:00 2001
From: tangzy <tangzy123456>
Date: Mon, 18 Jul 2022 16:24:11 +0800
Subject: [PATCH] 地块
---
src/views/land/LandDetail.vue | 466 ++++++++++++++++++++++++++-------------------
src/api/land/land.js | 98 +++++----
2 files changed, 317 insertions(+), 247 deletions(-)
diff --git a/src/api/land/land.js b/src/api/land/land.js
index ea48257..aba810d 100644
--- a/src/api/land/land.js
+++ b/src/api/land/land.js
@@ -1,69 +1,71 @@
import request from '@/router/axios';
export const getList = (current, size, params) => {
- return request({
- url: '/api/land/land/page',
- method: 'get',
- params: {
- ...params,
- current,
- size,
- }
- })
+ return request({
+ url: '/api/land/land/page',
+ method: 'get',
+ params: {
+ ...params,
+ current,
+ size,
+ }
+ })
}
export const getDetail = (id) => {
- return request({
- url: '/api/land/land/details',
- method: 'get',
- params: {
- id
- }
- })
+ return request({
+ url: '/api/land/land/details',
+ method: 'get',
+ params: {
+ id
+ }
+ })
}
export const remove = (ids) => {
- return request({
- url: '/api/land/land/remove',
- method: 'post',
- params: {
- ids,
- }
- })
+ return request({
+ url: '/api/land/land/remove',
+ method: 'post',
+ params: {
+ ids,
+ }
+ })
}
export const add = (row) => {
- return request({
- url: '/api/land/land/save',
- method: 'post',
- data: row
- })
+ return request({
+ url: '/api/land/land/save',
+ method: 'post',
+ data: row
+ })
}
-export const update = (row) => {
- return request({
- url: '/api/land/land/submit',
- method: 'post',
- data: row
- })
+export const update = (params) => {
+ return request({
+ url: '/api/land/land/updateLandAr',
+ method: 'post',
+ params: {
+ ...params,
+ }
+ })
}
export const getLandList = (userid) => {
- return request({
- url: '/api/land/land/selectLandList',
- method: 'get',
- params: {
- userid
- }
- })
+ return request({
+ url: '/api/land/land/selectLandList',
+ method: 'get',
+ params: {
+ userid
+ }
+ })
}
export const selectCount = (farmId) => {
- return request({
- url: '/api/land/land/selectCount',
- method: 'get',
- params: {
- farmId
- }
- })
+ return request({
+ url: '/api/land/land/selectCount',
+ method: 'get',
+ params: {
+ farmId
+ }
+ })
}
diff --git a/src/views/land/LandDetail.vue b/src/views/land/LandDetail.vue
index 9accb0b..3dce1b0 100644
--- a/src/views/land/LandDetail.vue
+++ b/src/views/land/LandDetail.vue
@@ -1,255 +1,323 @@
<template>
- <div class="wraaper-box farming-detail-box">
- <div class="dd">
- <div class="da">
- <div class="land-img" @click="mod()">
- <img :src="url" class="landimg" />
- </div>
- <div class="cent">
- <div class="l">{{ landName }}</div>
- <div class="ln">{{ dic }}</div>
- </div>
- <div class="dc">占地面积:{{ landArea }}{{ dica }}</div>
- <div class="dck">所属农场:{{ deptname }}</div>
-
- <div class="edit">
- <el-button @click="btnGrounpShow = !btnGrounpShow" icon="el-icon-menu"></el-button>
-
- <div v-show="btnGrounpShow" class="btn-grounp">
- <el-button>删除地块</el-button>
- </div>
- </div>
- </div>
- <div class="dv">
- <el-tabs v-model="activeName" @tab-click="handleClick">
- <!-- 种植记录 -->
- <el-tab-pane label="种养品种" name="tab1">
- <farmplant></farmplant>
- </el-tab-pane>
- <!-- 农事记录 -->
- <el-tab-pane label="农事记录" name="tab2">
- <farming></farming>
- </el-tab-pane>
- <!-- 采收记录 -->
- <el-tab-pane label="采收记录" name="tab3">
- <recovery></recovery>
- </el-tab-pane>
- </el-tabs>
- </div>
+ <div class="wraaper-box farming-detail-box">
+ <div class="dd">
+ <div class="da">
+ <div class="land-img" @click="mod(usePolygons)">
+ <img :src="url" class="landimg"/>
</div>
+ <div class="cent">
+ <div class="l">{{ landName }}</div>
+ <div class="ln">{{ dic }}</div>
+ </div>
+ <div class="dc">占地面积:{{ landArea }}{{ dica }}</div>
+ <div class="dck">所属农场:{{ deptname }}</div>
- <el-dialog
- title="地块位置"
- class="current-map-box"
- :visible.sync="gradeBoxVisible1"
- :modal="true"
- :modal-append-to-body="true"
- :append-to-body="true"
- :close-on-click-modal="false"
- :close-on-press-escape="false"
- :before-close="dialogBeforeClose"
- >
- <getMapDataInThere ref="getMapData" id="getMapData" @setMapData="setMapData"></getMapDataInThere>
- <el-button class="save" type="success">保存</el-button>
- </el-dialog>
+ <div class="edit">
+ <el-button @click="btnGrounpShow = !btnGrounpShow" icon="el-icon-menu"></el-button>
+
+ <div v-show="btnGrounpShow" class="btn-grounp" @click="DelLand(delId)">
+ <el-button>删除地块</el-button>
+ </div>
+ </div>
+ </div>
+ <div class="dv">
+ <el-tabs v-model="activeName" @tab-click="handleClick">
+ <!-- 种植记录 -->
+ <el-tab-pane label="种养品种" name="tab1">
+ <farmplant></farmplant>
+ </el-tab-pane>
+ <!-- 农事记录 -->
+ <el-tab-pane label="农事记录" name="tab2">
+ <farming></farming>
+ </el-tab-pane>
+ <!-- 采收记录 -->
+ <el-tab-pane label="采收记录" name="tab3">
+ <recovery></recovery>
+ </el-tab-pane>
+ </el-tabs>
+ </div>
</div>
+
+ <el-dialog
+ title="地块位置"
+ class="current-map-box"
+ :visible.sync="gradeBoxVisible1"
+ :modal="true"
+ :modal-append-to-body="true"
+ :append-to-body="true"
+ :close-on-click-modal="false"
+ :close-on-press-escape="false"
+ :before-close="dialogBeforeClose"
+ >
+ <getMapDataInThere ref="getMapData" id="getMapData" @setMapData="setMapData"></getMapDataInThere>
+ <el-button class="save" type="success" @click="upLand()">保存</el-button>
+ </el-dialog>
+ </div>
</template>
<script>
-import { mapGetters } from "vuex"
+import {mapGetters} from "vuex"
import farmplant from "@/views/farmplant/farmplant.vue"
import farming from "@/views/farm/farmingrecord.vue"
import recovery from "@/views/recovery/recovery.vue"
import getMapDataInThere from "./getMapDataInThere.vue"
+import {remove, update} from "@/api/land/land"
export default {
- components: {
- farmplant,
- farming,
- recovery,
- getMapDataInThere
+ components: {
+ farmplant,
+ farming,
+ recovery,
+ getMapDataInThere
+ },
+ data() {
+ return {
+ farmId: "",
+ activeName: "tab1",
+ url: "",
+ dica: "",
+ deptname: "",
+ landUnit: "",
+ delId: "",
+ landArea: "",
+ usePolygons: "",
+ dic: "",
+ formC: {},
+ gradeBoxVisible1: false,
+ option2: {
+ index: true,
+ tip: false,
+ searchMenuSpan: 6,
+ height: 583,
+ menuWidth: 300,
+ border: true,
+ align: "center",
+ selection: true,
+ column: [
+ {
+ label: "路线展示",
+ labelWidth: "0",
+ prop: "line",
+ className: "mapClass",
+ hide: true,
+ display: true,
+ span: 24,
+ formslot: true,
+ addDisplay: true
+ }
+ ],
+ },
+ btnGrounpShow: false
+ }
+ },
+ computed: {
+ ...mapGetters(["userInfo", "permission", "polygons"]),
+ },
+ created() {
+ this.url = this.$route.query.url
+ this.landName = this.$route.query.landName
+ this.dic = this.$route.query.dic
+ this.landArea = this.$route.query.landArea
+ this.dica = this.$route.query.dica
+ this.deptname = this.$route.query.deptname
+ this.delId = this.$route.query.id
+ this.landUnit = this.$route.query.landUnit
+ // this.form = res.data.data;
+ this.usePolygons = this.$route.query.landRange
+ .split("POLYGON((")[1]
+ .split("))")[0]
+ .split(",")
+ for (let k in usePolygons) {
+ usePolygons[k] = {
+ lng: +usePolygons[k].split(" ")[0],
+ lat: +usePolygons[k].split(" ")[1],
+ }
+ }
+ },
+ methods: {
+ mod(usePolygons) {
+ this.gradeBoxVisible1 = true
+ this.$refs.getMapData.draw(usePolygons)
},
- data () {
- return {
- farmId: "",
- activeName: "tab1",
- url: "",
- dica: "",
- deptname: "",
- landArea: "",
- dic: "",
- formC: {},
- gradeBoxVisible1: false,
- option2: {
- index: true,
- tip: false,
- searchMenuSpan: 6,
- height: 583,
- menuWidth: 300,
- border: true,
- align: "center",
- selection: true,
- column: [
- {
- label: "路线展示",
- labelWidth: "0",
- prop: "line",
- className: "mapClass",
- hide: true,
- display: true,
- span: 24,
- formslot: true,
- addDisplay: true
- }
- ],
- },
- btnGrounpShow: false
+ setMapData(val) {
+ this.LineData = val[0];
+ this.PointData = val[1];
+ },
+ //删除地块
+ DelLand(delId) {
+ this.$confirm("确定将选择数据删除?", {
+ confirmButtonText: "确定",
+ cancelButtonText: "取消",
+ type: "warning"
+ })
+ .then(() => {
+ return remove(delId);
+ })
+ .then(() => {
+ this.$message({
+ type: "success",
+ message: "操作成功!"
+ });
+ this.$router.push({
+ path: `/land/cs`,
+ });
+ });
+ },
+ //修改地块
+ upLand() {
+ var params = {}
+ if (this.polygons.length == 0) {
+ //没有面的数据
+ this.$refs.getMapData.isCheck = true;
+ loading();
+ } else {
+ //如果有值,空间坐标转换
+ let pol = this.polygons;
+ let polLength = this.polygons.length - 1;
+ let usePolygons = "";
+ for (let k in pol) {
+ usePolygons += pol[k].lng + "," + pol[k].lat;
+ if (k != polLength) {
+ usePolygons += ";";
+ }
}
- },
- computed: {
- ...mapGetters(["userInfo", "permission", "polygons"]),
- },
- created () {
- this.url = this.$route.query.url
- this.landName = this.$route.query.landName
- this.dic = this.$route.query.dic
- this.landArea = this.$route.query.landArea
- this.dica = this.$route.query.dica
- this.deptname = this.$route.query.deptname
- // this.form = res.data.data;
- let usePolygons = this.$route.query.landRange
- .split("POLYGON((")[1]
- .split("))")[0]
- .split(",")
- for (let k in usePolygons) {
- usePolygons[k] = {
- lng: +usePolygons[k].split(" ")[0],
- lat: +usePolygons[k].split(" ")[1],
- }
- }
- this.$refs.getMapData.draw(usePolygons)
- },
- methods: {
- mod () {
- this.formC = {}
- this.gradeBoxVisible1 = true
- },
- },
- watch: {},
+ //设置坐标点
+ params.userId = this.userInfo.user_id;
+ params.landRange = usePolygons;
+ params.id = this.delId,
+ params.landUnit = this.landUnit
+ }
+ // update(params).then(() => {
+ // that.$refs.form.resetFields();
+ // that.visible = false;
+ // this.$message({
+ // type: "success",
+ // message: "操作成功!"
+ // });
+ // done();
+ // }, error => {
+ // loading();
+ // window.console.log(error);
+ // });
+ }
+ },
+ watch: {},
}
</script>
<style scoped lang="scss">
#getMapData {
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- margin: auto;
- width: 100%;
- height: 100%;
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ margin: auto;
+ width: 100%;
+ height: 100%;
}
+
.wraaper-box {
- padding: 0 !important;
- position: absolute;
- top: 40px;
- left: 0;
- width: 100%;
- height: calc(100% - 40px);
+ padding: 0 !important;
+ position: absolute;
+ top: 40px;
+ left: 0;
+ width: 100%;
+ height: calc(100% - 40px);
}
.land-img {
- width: 200px;
- height: 200px;
- margin-top: 25px;
- margin-left: 60px;
- float: left;
+ width: 200px;
+ height: 200px;
+ margin-top: 25px;
+ margin-left: 60px;
+ float: left;
}
.cent {
- width: 250px;
- height: 40px;
- margin-top: 25px;
- margin-left: 40px;
- float: left;
- text-align: center;
- line-height: 40px;
+ width: 250px;
+ height: 40px;
+ margin-top: 25px;
+ margin-left: 40px;
+ float: left;
+ text-align: center;
+ line-height: 40px;
}
.l {
- width: 120px;
- height: 40px;
- float: left;
- text-align: center;
- line-height: 40px;
+ width: 120px;
+ height: 40px;
+ float: left;
+ text-align: center;
+ line-height: 40px;
}
.ln {
- width: 120px;
- height: 40px;
- margin-left: 2px;
- float: left;
- text-align: center;
- line-height: 40px;
- display: inline-block;
- vertical-align: 1px;
- border-radius: 3px;
+ width: 120px;
+ height: 40px;
+ margin-left: 2px;
+ float: left;
+ text-align: center;
+ line-height: 40px;
+ display: inline-block;
+ vertical-align: 1px;
+ border-radius: 3px;
}
.dc {
- width: 151px;
- margin-top: 20px;
- margin-left: 340px;
- width: 175px;
+ width: 151px;
+ margin-top: 20px;
+ margin-left: 340px;
+ width: 175px;
}
+
.dck {
- width: 151px;
- margin-left: 340px;
- width: 175px;
+ width: 151px;
+ margin-left: 340px;
+ width: 175px;
}
.landimg {
- width: 200px;
- height: 200px;
+ width: 200px;
+ height: 200px;
}
.dd {
- padding: 10px;
- wdith: 100%;
- height: 100%;
- display: flex;
- flex-direction: column;
- box-sizing: border-box;
+ padding: 10px;
+ wdith: 100%;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ box-sizing: border-box;
}
.da {
- position: relative;
- width: 100%;
- line-height: 60px;
- background: #fff;
+ position: relative;
+ width: 100%;
+ line-height: 60px;
+ background: #fff;
- .edit {
- position: absolute;
- top: 25px;
- right: 60px;
+ .edit {
+ position: absolute;
+ top: 25px;
+ right: 60px;
- .btn-grounp {
- padding: 0 10px;
- position: absolute;
- top: 40px;
- right: 60px;
- background: #fff;
- box-shadow: 0 0 10px 1px #ccc;
- }
+ .btn-grounp {
+ padding: 0 10px;
+ position: absolute;
+ top: 40px;
+ right: 60px;
+ background: #fff;
+ box-shadow: 0 0 10px 1px #ccc;
}
+ }
}
.dv {
- flex: 1;
- line-height: 60px;
- background: #fff;
- width: 100%;
- overflow: hidden;
+ flex: 1;
+ line-height: 60px;
+ background: #fff;
+ width: 100%;
+ overflow: hidden;
}
</style>
--
Gitblit v1.9.3