添加：提货站点添加定位
This commit is contained in:
parent
4ad4f8468c
commit
4ca97d72e9
|
|
@ -3,14 +3,12 @@ ENV = 'development'
|
|||
# http://192.168.1.43:8324/admin
|
||||
# http://mer.crmeb.net/admin
|
||||
# base api
|
||||
# VUE_APP_BASE_API = 'http://192.168.31.106:8324'
|
||||
#VUE_APP_BASE_API = 'https://mer1.crmeb.net'
|
||||
VUE_APP_BASE_API = 'https://bt.test.cdlfjy.com'
|
||||
#VUE_APP_BASE_API = 'https://mp.scwmbh.cn'
|
||||
|
||||
# socket 连接地址
|
||||
#VUE_APP_WS_URL = 'ws://0.0.0.0:8324'
|
||||
#VUE_APP_WS_URL = 'ws://mer1.crmeb.net'
|
||||
VUE_APP_WS_URL = 'ws://bt.test.cdlfjy.com'
|
||||
#VUE_APP_WS_URL = 'ws://mp.scwmbh.cn'
|
||||
|
||||
# vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,
|
||||
# to control whether the babel-plugin-dynamic-import-node plugin is enabled.
|
||||
|
|
|
|||
|
|
@ -125,7 +125,14 @@
|
|||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="地址：" prop="address">
|
||||
<el-form-item label="经纬度：" prop="lat">
|
||||
<el-input :value="(editInfo.lat || '') + ',' + (editInfo.lng || '')" readonly enter-button="查找位置" style="width: 100%;" placeholder="请点击查找位置选择位置">
|
||||
<el-button slot="append" style="background: #46a6ff; color: #fff; border-radius: 0 4px 4px 0;" @click="onSearchs" >查找位置</el-button>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="详细地址：" prop="address">
|
||||
<el-input v-model="editInfo.address" placeholder="请填写取货点详细地址" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
|
@ -212,12 +219,30 @@
|
|||
<el-button @click="userSelectVisible = false">关 闭</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<!--地图定位-->
|
||||
<el-dialog
|
||||
v-if="modalMap"
|
||||
v-model="modalMap"
|
||||
:visible.sync="modalMap"
|
||||
title="选择位置"
|
||||
close-on-click-modal
|
||||
class="mapBox"
|
||||
custom-class="dialog-scustom"
|
||||
:append-to-body='true'
|
||||
width="80%"
|
||||
top="20px"
|
||||
>
|
||||
<iframe id="mapPage" width="100%" height="700px" frameborder="0" :src="keyUrl" />
|
||||
</el-dialog>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {pickupPointList, pickupPointEdit, pickupPointInfo} from '@/api/marketing'
|
||||
import {userLstApi} from "@/api/user";
|
||||
import {configApi} from "@/api/system";
|
||||
export default {
|
||||
name: "preSaleProductList",
|
||||
components: { },
|
||||
|
|
@ -236,6 +261,7 @@ export default {
|
|||
activeName: 'list',
|
||||
ruleValidate: {
|
||||
title: [{ required: true, message: '请填写取货点名称', trigger: 'blur' }],
|
||||
lat: [{ required: true, message: '请选择取货点经纬度', trigger: 'blur' }],
|
||||
address: [{ required: true, message: '请填写取货点详细地址', trigger: 'blur' }],
|
||||
},
|
||||
// 用户选择弹框
|
||||
|
|
@ -267,11 +293,32 @@ export default {
|
|||
},
|
||||
loading: false,
|
||||
cardLists: [],
|
||||
// 定位相关
|
||||
modalMap: false,
|
||||
mapKey: '',
|
||||
keyUrl: '',
|
||||
delivery_type: '',
|
||||
};
|
||||
},
|
||||
watch: {},
|
||||
mounted() {
|
||||
window.addEventListener(
|
||||
'message',
|
||||
function(event) {
|
||||
// 接收位置信息，用户选择确认位置点后选点组件会触发该事件，回传用户的位置信息
|
||||
var loc = event.data
|
||||
console.log(loc)
|
||||
if (loc && loc.module === 'locationPicker') {
|
||||
// 防止其他应用也会向该页面post信息，需判断module是否为'locationPicker'
|
||||
window.parent.selectAddress(loc)
|
||||
}
|
||||
},
|
||||
false
|
||||
)
|
||||
window.selectAddress = this.selectAddress
|
||||
|
||||
this.getList('');
|
||||
this.getMapKey();
|
||||
},
|
||||
methods: {
|
||||
// 编辑取货点 - 弹出表单
|
||||
|
|
@ -393,7 +440,34 @@ export default {
|
|||
this.tableFrom = this.$options.data().tableFrom;
|
||||
|
||||
this.getList(1);
|
||||
}
|
||||
},
|
||||
// 定位处理 - 获取地图key
|
||||
getMapKey() {
|
||||
configApi().then(res => {
|
||||
console.log(res);
|
||||
this.mapKey = res.data.tx_map_key
|
||||
const keys = res.data.tx_map_key
|
||||
this.keyUrl = `https://apis.map.qq.com/tools/locpicker?type=1&key=${keys}&referer=myapp`
|
||||
this.delivery_type = res.data.delivery_type
|
||||
})
|
||||
.catch(res => {
|
||||
this.$message.error(res.message)
|
||||
})
|
||||
},
|
||||
// 定位处理
|
||||
onSearchs() {
|
||||
if (!this.mapKey || this.mapKey == '') this.$message.error('平台未配置腾讯地图KEY')
|
||||
else this.modalMap = true
|
||||
},
|
||||
// 选择经纬度
|
||||
selectAddress(data) {
|
||||
this.editInfo.lat = data.latlng.lat
|
||||
this.editInfo.lng = data.latlng.lng
|
||||
this.editInfo.address = data.poiaddress || ''
|
||||
this.modalMap = false
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
|
||||
|
||||
},
|
||||
|
|
@ -558,4 +632,7 @@ export default {
|
|||
margin-right: 0px!important;
|
||||
}
|
||||
}
|
||||
#mapPage{
|
||||
height: calc(100vh - 100px) !important;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -103,10 +103,6 @@ export default {
|
|||
supplier_name: [{ required: true, message: '请输入供应商名称', trigger: 'blur' }],
|
||||
supplier_account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
|
||||
supplier_password: [{ required: true, message: '请输入登录密码', trigger: 'blur' }],
|
||||
|
||||
|
||||
|
||||
|
||||
},
|
||||
};
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue