智慧农业后台管理页面
tangzy
2022-05-13 425152d436e73d4ef93e2e809998b5c837f7cd96
src/views/land/land.vue
@@ -27,7 +27,7 @@
          icon="el-icon-delete"
          v-if="permission.rail_delete"
          @click="handleDelete"
          >删 除
        >删 除
        </el-button>
      </template>
      <!-- 地图插入 -->
@@ -43,10 +43,11 @@
</template>
<script>
import { getList, add, update, remove, getRailTree } from "@/api/land/land";
import {getList, add, update, remove,getDetail} from "@/api/land/land";
import getMapDataInThere from "./getMapDataInThere.vue";
import { mapGetters } from "vuex";
import {mapGetters} from "vuex";
export default {
  components: {
    getMapDataInThere
@@ -105,6 +106,7 @@
          {
            label: "地块面积",
            span: 6,
            addDisplay: false,
            disabled: true,
            gutter: 20,
            tip: '绘制轮廓后自动计算',
@@ -124,7 +126,7 @@
          //   }]
          // },
          {
            label: "单位",
            label: "面积单位",
            prop: "landUnit",
            type: "select",
            dicUrl: "/api/blade-system/dict-biz/dictionary?code=landunit",
@@ -133,7 +135,7 @@
              value: "dictKey"
            },
            dataType: "number",
            span: 5,
            span: 6,
          },
          {
            label: "路线展示",
@@ -155,14 +157,14 @@
  },
  computed: {
    ...mapGetters(["userInfo", "permission", "polygons"]),
    // permissionList() {
    //   return {
    //     addBtn: this.vaildData(this.permission.rail_add, true),
    //     viewBtn: this.vaildData(this.permission.rail_view, false),
    //     delBtn: this.vaildData(this.permission.rail_delete, false),
    //     editBtn: this.vaildData(this.permission.rail_edit, false)
    //   };
    // },
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.land_add, false),
        viewBtn: this.vaildData(this.permission.land_view, false),
        delBtn: this.vaildData(this.permission.land_delete, false),
        editBtn: this.vaildData(this.permission.land_edit, false)
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach(ele => {
@@ -174,151 +176,58 @@
  mounted() {
  },
  methods: {
    beforeOpen(done, type) {
      if (type == "edit") {
        // this.$refs.getMapData.doThat(this.polygons);
        done();
      } else if (type == "add") {
        this.$store.commit("setpolygon", []); //用vuex传最终数据
        done();
      }
    },
    setMapData(val) {
      this.LineData = val[0];
      this.PointData = val[1];
    },
    //dom获取、
    checkDom(name, fn) {
      //  声明定时器
      let that = this;
      var timer = null;
      //  检查dom是否执行完成
      function checkDom() {
        let dom = that.$refs[name];
        if (dom) {
          //  执行dom加载完成后的操作
          //  清除定时器
          if (!timer) {
            clearTimeout(timer);
          }
          if (fn) {
            //回调函数
            fn(dom);
            return;
          } else {
            return dom;
          }
        } else {
          //  自我调用
          timer = setTimeout(checkDom, 100);
        }
      }
      //  首次执行
      checkDom();
    },
    sizeChange(val) {
      this.page1.currentPage = 1;
      this.page1.pageSize = val;
      this.onLoad(this.page, this.query);
    },
    currentChange(val) {
      this.page1.currentPage = val;
      // this.getData();
      this.onLoad(this.page, this.query);
    },
    rowSave(form, done, loading) {
    rowSave(row, done, loading) {
      if (this.polygons.length == 0) {
        //没有面的数据
        this.$refs.getMapData.isCheck = true;
        loading();
        return;
      }
      let pol = this.polygons;
      // console.log(pol);
      let polLength = this.polygons.length - 1;
      let usePolygons = "";
      for (let k in pol) {
        usePolygons += pol[k].lng + "," + pol[k].lat;
        if (k != polLength) {
          usePolygons += ";";
      } 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 += ";";
          }
        }
        //设置坐标点
        row.userId = this.userInfo.user_id;
        row.landRange = usePolygons;
      }
      // console.log(form);
      let data = {
        name: form.name,
        type: form.type,
        companyId: form.companyId,
        coordinate: usePolygons
      };
      // return;
      add(data).then(res => {
        if (res.data.success) {
          this.$message({
            message: "操作成功",
            type: "success"
          });
          this.refreshChange();
          done();
        } else {
          this.$message({
            message: "操作失败",
            type: "warning"
          });
          done();
        }
      add(row).then(() => {
        this.onLoad(this.page);
        this.$message({
          type: "success",
          message: "操作成功!"
        });
        done();
      }, error => {
        loading();
        window.console.log(error);
      });
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    rowUpdate(row, index, done, loading) {
      if (this.polygons.length == 0) {
        //没有面的数据
        this.$refs.getMapData.isCheck = true;
      update(row).then(() => {
        this.onLoad(this.page);
        this.$message({
          type: "success",
          message: "操作成功!"
        });
        done();
      }, error => {
        loading();
        return;
      }
      let pol = this.polygons;
      // console.log(pol);
      let polLength = this.polygons.length - 1;
      let usePolygons = "";
      for (let k in pol) {
        usePolygons += pol[k].lng + "," + pol[k].lat;
        if (k != polLength) {
          usePolygons += ";";
        }
      }
      row.coordinate = usePolygons;
      update(row).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          done();
        },
        error => {
          window.console.log(error);
          loading();
        }
      );
        console.log(error);
      });
    },
    rowDel(row) {
      this.$confirm("确定删除当前合同信息数据?", {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          console.log(row);
          return remove(row.id);
        })
        .then(() => {
@@ -329,23 +238,18 @@
          });
        });
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
      }
      this.$confirm("确定批量将选择数据删除?", {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          return remove(this.ids).then(res => {
            this.refreshChange();
          });
          return remove(this.ids);
        })
        .then(() => {
          this.onLoad(this.page);
@@ -353,27 +257,242 @@
            type: "success",
            message: "操作成功!"
          });
          this.$refs.crudrec.toggleSelection();
        })
        .catch(res => {});
          this.$refs.crud.toggleSelection();
        });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        // getDetail(this.form.id).then(res => {
        //   this.form = res.data.data;
        // });
        getDetail(this.form.id).then((res) => {
          if (res.data.code == 200) {
            this.form = res.data.data;
            let usePolygons = this.form.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);
          }
        });
      }
      done();
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      getList(
        page.currentPage,
        page.pageSize,
        Object.assign(params, this.query)
      ).then(res => {
      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        this.selectionClear();
      });
    }
  }
  // methods: {
  //   sizeChange(val) {
  //     this.page1.currentPage = 1;
  //     this.page1.pageSize = val;
  //     this.onLoad(this.page, this.query);
  //   },
  //   currentChange(val) {
  //     this.page1.currentPage = val;
  //     // this.getData();
  //     this.onLoad(this.page, this.query);
  //   },
  //   rowSave(row, done, loading) {
  //     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 += ";";
  //         }
  //       }
  //       //设置坐标点
  //       row.userId=this.userInfo.user_id;
  //       row.landRange = usePolygons;
  //     }
  //     // return;
  //     add(row).then(res => {
  //       if (res.data.success) {
  //         this.$message({
  //           message: "操作成功",
  //           type: "success"
  //         });
  //         this.refreshChange();
  //         done();
  //       } else {
  //         this.$message({
  //           message: "操作失败",
  //           type: "warning"
  //         });
  //         done();
  //       }
  //     });
  //   },
  //   searchChange(params, done) {
  //     this.query = params;
  //     this.page.currentPage = 1;
  //     this.onLoad(this.page, params);
  //     done();
  //   },
  //   beforeOpen(done, type) {
  //     if (["edit", "view"].includes(type)) {
  //       getDetail(this.form.id).then(res => {
  //         this.form = res.data.data;
  //       });
  //     }
  //     if (type == "add") {
  //       this.$store.commit("setpolygon", []); //用vuex传最终数据
  //       done();
  //     }
  //     done();
  //   },
  //   setMapData(val) {
  //     this.LineData = val[0];
  //     this.PointData = val[1];
  //   },
  //   searchReset() {
  //     this.query = {};
  //     this.onLoad(this.page);
  //   },
  //   rowUpdate(row, index, done, loading) {
  //     if (this.polygons.length == 0) {
  //       //没有面的数据
  //       this.$refs.getMapData.isCheck = true;
  //       loading();
  //       return;
  //     }
  //     let pol = this.polygons;
  //     // console.log(pol);
  //     let polLength = this.polygons.length - 1;
  //     let usePolygons = "";
  //     for (let k in pol) {
  //       usePolygons += pol[k].lng + "," + pol[k].lat;
  //       if (k != polLength) {
  //         usePolygons += ";";
  //       }
  //     }
  //     row.coordinate = usePolygons;
  //     update(row).then(
  //       () => {
  //         this.onLoad(this.page);
  //         this.$message({
  //           type: "success",
  //           message: "操作成功!"
  //         });
  //         done();
  //       },
  //       error => {
  //         window.console.log(error);
  //         loading();
  //       }
  //     );
  //   },
  //   rowDel(row) {
  //     this.$confirm("确定删除当前合同信息数据?", {
  //       confirmButtonText: "确定",
  //       cancelButtonText: "取消",
  //       type: "warning"
  //     })
  //       .then(() => {
  //         console.log(row);
  //         return remove(row.id);
  //       })
  //       .then(() => {
  //         this.onLoad(this.page);
  //         this.$message({
  //           type: "success",
  //           message: "操作成功!"
  //         });
  //       });
  //   },
  //   selectionChange(list) {
  //     this.selectionList = list;
  //   },
  //   handleDelete() {
  //     if (this.selectionList.length === 0) {
  //       this.$message.warning("请选择至少一条数据");
  //       return;
  //     }
  //     this.$confirm("确定批量将选择数据删除?", {
  //       confirmButtonText: "确定",
  //       cancelButtonText: "取消",
  //       type: "warning"
  //     })
  //       .then(() => {
  //         return remove(this.ids).then(res => {
  //           this.refreshChange();
  //         });
  //       })
  //       .then(() => {
  //         this.onLoad(this.page);
  //         this.$message({
  //           type: "success",
  //           message: "操作成功!"
  //         });
  //         this.$refs.crudrec.toggleSelection();
  //       })
  //       .catch(res => {
  //       });
  //   },
  //   refreshChange() {
  //     this.onLoad(this.page, this.query);
  //   },
  //   onLoad(page, params = {}) {
  //     this.loading = true;
  //     getList(
  //       page.currentPage,
  //       page.pageSize,
  //       Object.assign(params, this.query)
  //     ).then(res => {
  //       const data = res.data.data;
  //       this.page.total = data.total;
  //       this.data = data.records;
  //       this.loading = false;
  //     });
  //   }
  // }
};
</script>