部分调整

shuishen

2022-04-11 99dc0cc2172ac8bc267e85435195318e40f03595

 src/views/hd/getMapDataInThere.vue

@@ -9,15 +9,13 @@
            icon="el-icon-finished"
            @click="openDrawLineMethod"
            :disabled="fromView"
            >新增路线</el-button
          >
                    >新增路线</el-button>
          <el-button
            type="primary"
            @click="openDrawPointMethod"
            icon="el-icon-coordinate"
            :disabled="fromView"
            >新增标点</el-button
          >
                    >新增标点</el-button>
        </el-button-group>
      </div>
      <div class="controlMapWindowmain">
@@ -26,11 +24,7 @@
          :enter-active-class="animateEnter"
          :leave-active-class="animateLeave"
        >
          <div
            class="getMapData__once"
            v-for="(item, index) in ourDatas"
            :key="index"
          >
                    <div class="getMapData__once" v-for="(item, index) in ourDatas" :key="index">
            <div class="getMapData_once_label">
              <el-tag> {{ item.label }}</el-tag>
            </div>
@@ -49,9 +43,7 @@
              :enter-active-class="animateEnters"
              :leave-active-class="animateLeaves"
            >
              <div class="notPathTitile" v-show="item.notPath == 2">
                请输入名称或选择路径
              </div>
                            <div class="notPathTitile" v-show="item.notPath == 2">请输入名称或选择路径</div>
            </transition>
            <el-button
              class="getMapData_once_get"
@@ -76,8 +68,8 @@
</template>

<script>
import { mapGetters } from "vuex";
import MapInThere from "@/components/map/mainInThere.vue";
import { mapGetters } from "vuex"
import MapInThere from "@/components/map/mainInThere.vue"
export default {
  name: "getMapData",
  components: {
@@ -91,8 +83,8 @@
      handler(val) {
        // console.log("深度监听：", val);
        this.checkDom("getMapDataRefs", (dom) => {
          dom.onceOnlodad(val);
        });
                    dom.onceOnlodad(val)
                })
      },
      deep: true,
    },
@@ -156,27 +148,27 @@
        // },
      ],
      nowId: 0,
    };
        }
  },
  mounted() {
    // this.$emit("setMapData", [this.routers, this.potions]);
    let that = this;
        let that = this
    if (that.ourDatas.length != 0) {
      for (let k in that.ourDatas) {
        that.ourDatas[k].id = +k + 1;
                that.ourDatas[k].id = +k + 1
      }
    }
    //判断dom是否存在
    this.checkDom("getMapDataRefs", (dom) => {
      //提供数据
      dom.onceOnlodad(that.ourDatas);
    });
    this.nowId = +this.ourDatas.length + 1;
            dom.onceOnlodad(that.ourDatas)
        })
        this.nowId = +this.ourDatas.length + 1
  },
  methods: {
    openDrawLineMethod() {
      //添加线路的对象
      let id = this.nowId++;
            let id = this.nowId++
      this.ourDatas.push({
        label: "路径" + +id,
        value: "",
@@ -187,11 +179,11 @@
        //isLine来判断是否是线
        id: +id,
        //id确定不重复
      });
            })
    },
    openDrawPointMethod() {
      //添加点的对象
      let id = this.nowId++;
            let id = this.nowId++
      this.ourDatas.push({
        label: "标点" + +id,
        value: "",
@@ -199,53 +191,53 @@
        notPath: false,
        isLine: false,
        id: +id,
      });
            })
    },
    deleteRowOurs(index) {
      //删除
      this.ourDatas.splice(index, 1);
            this.ourDatas.splice(index, 1)
    },
    backMapDataOurData(val, index) {
      //在地图内useMapData方法中触发
      if (val == "line") {
        this.ourDatas[index].value = this.rotesData;
                this.ourDatas[index].value = this.rotesData
      } else if (val == "point") {
        this.ourDatas[index].value = this.pointData;
                this.ourDatas[index].value = this.pointData
      } else if (val == "notData") {
        this.ourDatas[index].value = "";
                this.ourDatas[index].value = ""
      }
      //单个验证
      this.myRules(index);
            this.myRules(index)
    },
    //以上是添加数据集方法
    //选择map数据
    openMap(val, num, value) {
      //开始对地图做操作
      this.MapDataShow = true;
      this.openTitle = val;
      this.$refs.getMapDataRefs.init(val, num, value);
            this.MapDataShow = true
            this.openTitle = val
            this.$refs.getMapDataRefs.init(val, num, value)
    },
    closeOpenedMap() {
      this.MapDataShow = false;
            this.MapDataShow = false
      // this.openTitle = "";
    },
    //下面是旧代码
    editInit(val) {
      //查看情况逆转String成为当页可使用数据,并做动作
      this.reverseMapData(val);
            this.reverseMapData(val)
    },
    viewInit(val) {
      //查看情况逆转String成为当页可使用数据,并做动作
      this.reverseMapData(val);
      this.fromView = true; //查看数据不可改
            this.reverseMapData(val)
            this.fromView = true //查看数据不可改
    },
    reverseMapData(val, label) {
      //解释数据
      let rname = val[0][0].split(";"),
        r = val[0][1].split(";"),
        pname = val[1][0].split(";"),
        p = val[1][1].split(";");
      this.ourDatas = [];
                p = val[1][1].split(";")
            this.ourDatas = []
      for (let k in r) {
        this.ourDatas.push({
          label: "路径" + (+k + 1),
@@ -254,10 +246,10 @@
          notPath: false,
          isLine: true,
          id: this.ourDatas.length,
        });
                })
      }
      for (let k in p) {
        let potion = p[k].split(",");
                let potion = p[k].split(",")
        this.ourDatas.push({
          label: "标点" + (+k + 1),
          value: [+potion[0], +potion[1]],
@@ -265,76 +257,76 @@
          notPath: false,
          isLine: false,
          id: this.ourDatas.length,
        });
                })
      }
      this.nowId = +this.ourDatas.length + 1;
            this.nowId = +this.ourDatas.length + 1
    },
    myRules(index) {
      //单个验证
      if (this.ourDatas[index].name && this.ourDatas[index].value) {
        this.ourDatas[index].notPath = false;
                this.ourDatas[index].notPath = false
      } else {
        this.ourDatas[index].notPath = 2;
                this.ourDatas[index].notPath = 2
      }
    },
    //自定义验证
    myRulesUse() {
      //把一个数组拆开两个来对应之前的数据
      let ourData = this.ourDatas;
      let lineBefor = [];
      let pointBefor = [];
            let ourData = this.ourDatas
            let lineBefor = []
            let pointBefor = []
      for (let o in ourData) {
        if (ourData[o].isLine) {
          lineBefor.push(ourData[o]);
                    lineBefor.push(ourData[o])
        } else {
          pointBefor.push(ourData[o]);
                    pointBefor.push(ourData[o])
        }
      }
      let line = this.changeMapData(lineBefor, "name");
      let point = this.changeMapData(pointBefor, "name");
            let line = this.changeMapData(lineBefor, "name")
            let point = this.changeMapData(pointBefor, "name")
      // console.log(line, point);
      if (line[0] == "namenot" || point[0] == "namenot") {
        //需要显示验证失败合集
        let errorId = [];
                let errorId = []
        if (line[0] == "namenot") {
          errorId.push(...line[1]);
                    errorId.push(...line[1])
        }
        if (point[0] == "namenot") {
          errorId.push(...point[1]);
                    errorId.push(...point[1])
        }
        // console.log(errorId, "errorId");
        for (let x in this.ourDatas) {
          // console.log(this.ourDatas[x], "x");
          let flog = true;
                    let flog = true
          for (let k in errorId) {
            if (errorId[k] == this.ourDatas[x].id) {
              flog = false;
                            flog = false
            }
          }
          if (flog) {
            this.ourDatas[x].notPath = false;
                        this.ourDatas[x].notPath = false
          } else {
            this.ourDatas[x].notPath = 2;
                        this.ourDatas[x].notPath = 2
          }
        }
        return false;
                return false
      } else {
        // console.log("通过");
        for (let i in this.ourDatas) {
          this.ourDatas[i].notPath = false;
                    this.ourDatas[i].notPath = false
        }
        return [line, point];
                return [line, point]
      }
    },
    //规则
    changeMapData(item, names) {
      let name = "",
        value = "",
        notData = [];
      let itemLength = item.length - 1;
                notData = []
            let itemLength = item.length - 1
      // console.log(item, names, 7777);
      for (let k in item) {
        let inItem = item[k];
                let inItem = item[k]
        for (let kin in inItem) {
          if (
            inItem[kin] == "" &&
@@ -343,52 +335,52 @@
            kin != "id"
          ) {
            // console.log(kin);
            notData.push(inItem.id);
            break;
                        notData.push(inItem.id)
                        break
          }
          if (kin == names) {
            name += inItem[kin];
                        name += inItem[kin]
            if (k != itemLength) {
              name += ";";
                            name += ";"
            }
          }
          if (kin == "value") {
            value += inItem[kin];
                        value += inItem[kin]
            if (k != itemLength) {
              value += ";";
                            value += ";"
            }
          }
        }
      }
      return notData.length > 0 ? [names + "not", notData] : [name, value];
            return notData.length > 0 ? [names + "not", notData] : [name, value]
    },
    checkDom(name, fn) {
      //  声明定时器
      let that = this;
      var timer = null;
            let that = this
            var timer = null
      //  检查dom是否执行完成
      function checkDom() {
        let dom = that.$refs[name];
                let dom = that.$refs[name]
        if (dom) {
          //  执行dom加载完成后的操作
          //  清除定时器
          if (!timer) {
            clearTimeout(timer);
                        clearTimeout(timer)
          }
          if (fn) {
            //回调函数
            fn(dom);
            return;
                        fn(dom)
                        return
          } else {
            return dom;
                        return dom
          }
        } else {
          //  自我调用
          timer = setTimeout(checkDom, 100);
                    timer = setTimeout(checkDom, 100)
        }
      }
      //  首次执行
      checkDom();
            checkDom()
    },
  },
};
@@ -400,10 +392,12 @@
  align-items: center;
  justify-content: center;
}

.getMapData {
  width: 100%;
  height: 100%;
  position: relative;

  .controlMapWindow {
    width: 320px;
    height: calc(100% - 20px);
@@ -416,12 +410,14 @@
    border-radius: 0 15px 15px 0;
    padding: 10px 10px;
    overflow: hidden;

    .controlMapWindowTitle {
      height: 40px;
      width: 100%;
      margin-bottom: 5px;
      @extend .flexCenter;
    }

    .controlMapWindowmain {
      width: 100%;
      height: calc(100% - 45px);
@@ -479,6 +475,7 @@
  opacity: 0;
  transform: translateY(10px);
}

.list-leave-to {
  opacity: 0;
  transform: translateY(-10px);
@@ -488,7 +485,8 @@
.list-leave {
  opacity: 1;
}
​ .list-enter-active,

// ​.list-enter-active,
.list-leave-active {
  transition: all 0.3s;
}