fix 合并页面

9f2cc5eb · aoobao · bd9f1393 · 9f2cc5eb · 9f2cc5eb · 9f2cc5eb
Commit 9f2cc5eb authored Apr 25, 2019 by aoobao
4 changed files
--- a/public/index.html
+++ b/public/index.html
@@ -6,7 +6,7 @@
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title>amap-line-edit</title>
-    <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.13&key=c81eeaf774b25626ffb1b32e13acbd99&plugin=AMap.CustomLayer"></script>
+    <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.13&key=c81eeaf774b25626ffb1b32e13acbd99&plugin=AMap.CustomLayer,AMap.MouseTool"></script>
  </head>
  <body>
    <noscript>

--- a/src/components/DrawLine.vue
+++ b/src/components/DrawLine.vue
+<script>
+// 线段编辑
+export default {
+  render () { return null },
+  props: {
+    draw: {
+      type: Boolean,
+      default: false
+    }
+  },
+  mounted () {
+    if (this.draw) {
+      this.initDraw()
+    }
+  },
+  beforeDestroy () {
+    if (this.draw) this.destory()
+  },
+  methods: {
+    initDraw () {
+    },
+    destory () {
+    }
+  },
+  watch: {
+    draw (val, oldval) {
+      if (val != oldval) {
+        if (val) {
+          this.initDraw()
+        } else {
+          this.destory()
+        }
+      }
+    }
+  }
+}
+</script>
--- a/src/components/TransferDialog.vue
+++ b/src/components/TransferDialog.vue
 <template>
  <el-dialog title="合并线段" width="840px" :visible="visible" :center="false" :before-close="handleClose">
    <div class="context">
      <div class="select-container">
        <span class="title">待合并线段</span>
        <el-button style="margin-left:10px;" @click="addLine(item,index)" v-for="(item,index) in chooseList" :key="item.key">{{item.label}}</el-button>
      </div>
      <div class="image-container" :style="getImageStyle()">
        <!-- <img v-if="base64" :src="base64" alt=""> -->
      </div>
      <div style="clear :both;"></div>
      <span class="title">需合并线段</span>
      <div class="choose-model">
        <el-tag style="margin-left:10px;" v-for="(item,index) in data" :key="item.key" closable @close="tagClose(item,index)">{{item.label}}</el-tag>
      </div>
    </div>
    <span slot="footer" class="dialog-footer ">
      <el-button type="primary " @click="submit ">确 定</el-button>
      <el-button type="primary " @click="createImage ">生成图片</el-button>
    </span>
  </el-dialog>
 </template>
 <script>
 export default {
  props: {
    dataList: Array,
    base64: String
  },
  data () {
    return {
      visible: false,
      data: []
    }
  },
  computed: {
    chooseList () {
      let list = this.dataList.filter(t => {
        let m = this.data.find(a => a.key == t.key)
        return !m
      })
      return list
    }
  },
  methods: {
    handleClose () {
      this.visible = false
      this.$emit('close')
    },
    show () {
      this.visible = true
    },
    submit () {
      this.$emit('merge', {
        data: this.data
      })
      this.visible = false
    },
    createImage () {
      this.$emit('createImage', {
        data: this.data
      })
    },
    addLine (data) {
      this.data.push(data)
    },
    tagClose (item, index) {
      this.data.splice(index, 1)
    },
    getImageStyle () {
      return {
        backgroundImage: `url('${this.base64}')`
      }
    }
  },
  watch: {
    visible (val) {
      if (!val) {
        this.data = []
      }
    }
  }
 }
 </script>
 <style lang="scss" scoped>
 .select-container {
  width: 50%;
-  height: 200px;
+  min-height: 200px;
  background-color: aqua;
  text-align: left;
  float: left;
 }
 .image-container {
  width: 50%;
  height: 200px;
  float: left;
  //overflow: auto;
  // background-size: contain;
  background-size: 100% 100%;
  background-repeat: no-repeat;
 }
 .title {
  text-align: left;
 }
 .choose-model {
  text-align: left;
 }
 </style>
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -3,15 +3,16 @@
    <div class="map-container" @mousemove="mapMouseMove" @mouseout="mapMouseOut">
      <div class="map" ref="map"></div>
      <LineManagerView v-if="map" :map="map" :data="lineList" ref="lineManager" :status="status" :x="x" :y="y" :clearWidth="clearNumber" />
+      <DrawLine :draw="isDrawLine" @createLine="createLine" />
    </div>
    <div class="control">
      <div class="button-control">
        <label>{{statusName}}</label>
-        <el-button style="margin-left:5px;" type="primary" @click="showAdd">新增</el-button>
+        <el-button v-if="!exportVisible && !isDrawLine && statusName === '查看'"  style="margin-left:5px;" type="primary" @click="showAdd">新增</el-button>
-        <el-button style="margin-left:5px;" type="warning" @click="clearModel">{{statusName == '擦除' ? '取消擦除' : '擦除'}}</el-button>
+        <el-button v-if="!exportVisible && !isDrawLine"  style="margin-left:5px;" type="warning" @click="clearModel">{{statusName == '擦除' ? '取消擦除' : '擦除'}}</el-button>
-        <el-button style="margin-left:5px;" type="success" @click="merge">合并</el-button>
+        <el-button v-if="!exportVisible && !isDrawLine && statusName === '查看'" style="margin-left:5px;" type="success" @click="merge">合并</el-button>
-        <el-button style="margin-left:5px;" @click="exportAll">{{exportVisible ? '关闭导出' : '批量导出'}}</el-button>
+        <el-button style="margin-left:5px;" @click="exportAll">{{exportVisible ? '关闭导出' : '导出'}}</el-button>
      </div>
      <div class="line-control">
        <template v-if="statusName == '查看'">
@@ -37,6 +38,7 @@
 let __id = 0
 // import HANG_ZHOU from '../assets/HANGZHOU'
 // import SHAO_XING from '../assets/SHAOXING'
+import DrawLine from '@/components/DrawLine'
 import AddDialog from '@/components/AddDialog'
 import RemarkDialog from '@/components/RemarkDialog'
 import TransferDialog from '@/components/TransferDialog'
@@ -54,7 +56,8 @@ export default {
    LineManagerView,
    TransferDialog,
    RemarkDialog,
-    ExportDialog
+    ExportDialog,
+    DrawLine
  },
  data () {
    return {
@@ -68,7 +71,8 @@ export default {
      mergeList: [],
      remark: null,
      imgBase64: null,
-      exportVisible: false
+      exportVisible: false,
+      isDrawLine: false
    }
  },
  computed: {
@@ -117,6 +121,9 @@ export default {
  },
  methods: {
+    createLine (line) {
+      console.log(line)
+    },
    copyLine (lineObj) {
      let line = lineObj.line
      let st = LineToString(line)