修改现货采购合同地区

src/components/mapdrag/mapdrag.vue

@@ -1,15 +1,15 @@
 <style lang='scss' scoped>
 .mapContent {
   position: relative;
-  margin-top: 64px;
+  margin-top: 80px;
 }
 #mapContainer {
-  width: 750px;
+  width: 100%;
   height: 300px;
 }
 #tip {
   position: absolute;
-  top: -60px;
+  top: -75px;
 }
 #tip .el-input {
   width: 179px;
@@ -36,6 +36,15 @@
   color: #5878e8;
   border-color: #5473e8;
 }
+.address{
+  display: flex;
+  align-items: center;
+  position:absolute;
+  top: -35px;
+  .address-input{
+    width: 400px;
+  }
+}
 </style>
 
 <template>
@@ -69,16 +78,22 @@
         >
         </el-option>
       </el-select>
-      <!-- <el-input
-        type="textarea"
+     
+      <el-button @click="positions" type="primary" v-if='!isShowaddress'>确定定位</el-button>
+      <el-button @click="anewselect" v-if='!isShowaddress'>重新选择</el-button>
+      <el-button @click="submit" v-if='isShowaddress'>确定</el-button>
+    </div>
+    <div class="address" v-if="isShowaddress">
+       <el-input
+        type="text"
         id="searchValue"
-        placeholder="地址"
+        placeholder="请输入关键字:"
         v-model="address"
         clearable
-      ></el-input> -->
-      <el-button @click="positions" type="primary">确定定位</el-button>
-      <el-button @click="anewselect">重新选择</el-button>
+        class="address-input"
+      ></el-input>
     </div>
+    
   </div>
 </template>
 
@@ -106,7 +121,7 @@ export default {
       status: true,
     }
   },
-  props: ['flagVisible', 'position','selectedOptions'],
+  props: ['flagVisible', 'position','selectedOptions','isShowaddress','type'],
   computed: {
     showFlag() {
       return this.flagVisible
@@ -349,6 +364,16 @@ export default {
         this.loadmap(val)
       }
     },
+    submit(){
+      let _data = []
+      _data.push(this.province)
+      _data.push(this.city)
+      _data.push(this.district)
+      _data.push(this.address)
+      _data.push(this.type)
+      this.$emit('addressListen',_data)
+      this.$parent.blurMap()
+    }
   },
 }
 </script>

src/views/contractManagement/purchaseContractAdd.vue

@@ -258,7 +258,7 @@
           />
         </ws-form-item>
         <ws-form-item label="货源所在地区" span="1" prop="sourceGoods">
-          <el-cascader
+          <!-- <el-cascader
             :options="options_"
             v-model="selectedOptions"
             clearable
@@ -266,7 +266,10 @@
             placeholder="请选择货源所在地区"
             style="width: 200%"
             @change="handleChange"
-          />
+          /> -->
+          <el-button @click="mapInputClick('source')" class='address-btn'>
+            {{newSelectedOptions}}
+          </el-button>
         </ws-form-item>
         <ws-form-item label="货源详细地址" span="1" prop="sourceGoods">
           <ws-input
@@ -277,7 +280,7 @@
           />
         </ws-form-item>
         <ws-form-item label="交货所在地区" span="1" prop="sourceGoods">
-          <el-cascader
+          <!-- <el-cascader
             :options="options_"
             v-model="selectedOptions1"
             clearable
@@ -285,7 +288,10 @@
             placeholder="请选择交货所在地区"
             style="width: 200%"
             @change="handleChange1"
-          />
+          /> -->
+           <el-button @click="mapInputClick('deliveryProv')" class='address-btn'>
+            {{newSelectedOptions1}}
+          </el-button>
         </ws-form-item>
         <ws-form-item label="交货详细地址" span="1" prop="placeDelivery">
           <ws-input
@@ -530,6 +536,9 @@
         accept=".jpg, .jpeg, .png, .pdf, .doc, .zip, .rar"
       />
     </ws-form>
+       <div v-if="dialogVisible" class="map">
+          <map-drag  @marker="marker" :isShowaddress='true' v-on:addressListen='getAddress' :type="type"></map-drag>
+    </div>
     <div style="text-align: right; padding: 10px" class="center">
       <el-button
         class="bg-bottom"
@@ -554,11 +563,13 @@ import {
 import { regionData, CodeToText, TextToCode } from 'element-china-area-data'
 import { dayjs, fmoney, EventBus } from 'base-core-lib'
 import WsUpload from '@/components/WsUpload'
+import mapDrag from '@/components/mapdrag/mapdrag'
 
 export default {
   name: 'viewSpareMoney',
   components: {
     WsUpload,
+     mapDrag,
   },
   watch: {
     vesselId(val) {
@@ -570,6 +581,8 @@ export default {
   },
   data() {
     return {
+      type:"",
+      dialogVisible:false,
       //弹出框
       dialogViewSpareMoney: false,
       dialogApproveFormVisible: false,
@@ -583,7 +596,9 @@ export default {
       year: '',
       options_: regionData,
       selectedOptions: [],
+      newSelectedOptions:'请选择货源所在地',
       selectedOptions1: [],
+      newSelectedOptions1:'请选择交货所在地区',
       // 提交类型
       submitType: true,
       tableData: [{ date: 1111, name: 'qqqq', address: 'errrtt' }],
@@ -659,6 +674,43 @@ export default {
     this.showType = this.isShow
   },
   methods: {
+    getAddress(data){
+      console.log("getAddress",data)
+      if(data[4]=='source'){
+        this.newSelectedOptions = data[0]+'/'+data[1]+'/'+data[2]
+        this.deptBudgetList.sourceProvince = data[0]
+        this.deptBudgetList.sourceCity = data[1]
+        this.deptBudgetList.sourceArea = data[2]
+        this.deptBudgetList.sourceGoods = data[3]
+      }else{
+        this.newSelectedOptions1 = data[0]+'/'+data[1]+'/'+data[2]
+        this.deptBudgetList.deliveryProvince =data[0]
+        this.deptBudgetList.deliveryCity =data[1]
+        this.deptBudgetList.deliveryArea =data[2]
+        this.deptBudgetList.placeDelivery =data[3]
+      }
+    },
+    mapInputClick(type){
+       this.dialogVisible = true
+       this.type=type
+    },
+        marker: function (item) {
+      this.deptBudgetList.warehousePositioning =
+        item.lnglat.lat + ',' + item.lnglat.lng
+    },
+        selectedAddress(e) {
+      this.deptBudgetList.warehousePositioning =
+        e.center.lat + ',' + e.center.lng
+    },
+       provinceChange(e){
+      console.log(CodeToText[e])
+    },
+    blurMap(){
+        this.dialogVisible = false
+    },
+    focusMap(){
+      this.dialogVisible = true
+    },
     dataFilter(val) {
       this.deptBudgetList.personCharge = val
       if (val) {
@@ -1012,7 +1064,7 @@ export default {
         })
         return
       }
-      if (this.selectedOptions.length == 0) {
+      if (!this.newSelectedOptions) {
         this.$message({
           message: '请选择货源所在地区！',
           type: 'warning',
@@ -1026,7 +1078,7 @@ export default {
         })
         return
       }
-      if (this.selectedOptions1.length == 0) {
+      if (this.selectedOptions1) {
         this.$message({
           message: '请选择交货所在地区！',
           type: 'warning',
@@ -1307,34 +1359,10 @@ export default {
         return
       }
       this.$refs.deptBudgetList.validate((valid) => {
-        if (valid) {
-          this.deptBudgetList.sourceProvince =
-            CodeToText[this.selectedOptions[0]]
-          this.deptBudgetList.sourceCity = CodeToText[this.selectedOptions[1]]
-          this.deptBudgetList.deliveryProvince =
-            CodeToText[this.selectedOptions1[0]]
-          this.deptBudgetList.deliveryCity =
-            CodeToText[this.selectedOptions1[1]]
+        if (!valid) {
           this.deptBudgetList.compId = this.compId
           this.deptBudgetList.contractType = 2
           this.deptBudgetList.goodsType = 1
-          if (
-            this.deptBudgetList.deliveryProvince == '澳门特别行政区' ||
-            this.deptBudgetList.deliveryProvince == '澳门特别行政区'
-          ) {
-            this.deptBudgetList.deliveryArea = '特别行政区'
-          } else {
-            this.deptBudgetList.deliveryArea =
-              CodeToText[this.selectedOptions1[2]]
-          }
-          if (
-            this.deptBudgetList.sourceProvince == '澳门特别行政区' ||
-            this.deptBudgetList.sourceProvince == '澳门特别行政区'
-          ) {
-            this.deptBudgetList.sourceArea = '特别行政区'
-          } else {
-            this.deptBudgetList.sourceArea = CodeToText[this.selectedOptions[2]]
-          }
           addList(this.deptBudgetList)
             .toPromise()
             .then((response) => {
@@ -1713,4 +1741,26 @@ export default {
     line-height: inherit;
     display: none;
 }
+.map{
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  margin: auto;
+  width: 800px;
+  height: 400px;
+  background: gainsboro;
+  border-radius: 20px;
+  padding: 10px;
+  box-sizing: border-box;
+  z-index: 99;
+}
+.amap-container{
+  width: 100%!important;
+}
+.address-btn{
+  width:100%;
+  text-align:left;
+}
 </style>