|
|
@@ -3,56 +3,61 @@
|
|
|
v-if="visible"
|
|
|
:title="form.id?'编辑场馆':'新建场馆'"
|
|
|
:visible.sync="visible"
|
|
|
- width="900px"
|
|
|
+ width="1200px"
|
|
|
>
|
|
|
- <el-form v-loading="isLoading" :model="form" label-width="100px">
|
|
|
- <el-row>
|
|
|
+ <el-form v-loading="isLoading" :model="form" label-width="100px" label-position="top">
|
|
|
+ <el-row :gutter="24">
|
|
|
<el-col :span="12">
|
|
|
- <el-form-item label="名称">
|
|
|
- <el-input v-model="form.name" />
|
|
|
+ <el-row :gutter="24">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="名称">
|
|
|
+ <el-input v-model="form.name"/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="开放时间">
|
|
|
+ <el-input v-model="form.businessHours"/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-form-item label="图片">
|
|
|
+ <el-upload
|
|
|
+ :file-list="fileList"
|
|
|
+ action="#"
|
|
|
+ list-type="picture-card"
|
|
|
+ name="fileData"
|
|
|
+ :http-request="uploaderHandle"
|
|
|
+ :on-success="uploadSuccess"
|
|
|
+ :auto-upload="true"
|
|
|
+ >
|
|
|
+ <i slot="default" class="el-icon-plus"/>
|
|
|
+ </el-upload>
|
|
|
</el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="12">
|
|
|
- <el-form-item label="开放时间">
|
|
|
- <el-input v-model="form.businessHours" />
|
|
|
+ <el-form-item label="地址">
|
|
|
+ <el-input v-model="form.address"/>
|
|
|
</el-form-item>
|
|
|
+ <el-row :gutter="24">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="联系人">
|
|
|
+ <el-input v-model="form.contacts"/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="联系电话">
|
|
|
+ <el-input v-model="form.contactNumber"/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
</el-col>
|
|
|
- </el-row>
|
|
|
- <el-form-item label="图片">
|
|
|
- <el-upload
|
|
|
- :file-list="fileList"
|
|
|
- action="#"
|
|
|
- list-type="picture-card"
|
|
|
- name="fileData"
|
|
|
- :http-request="uploaderHandle"
|
|
|
- :on-success="uploadSuccess"
|
|
|
- :auto-upload="true"
|
|
|
- >
|
|
|
- <i slot="default" class="el-icon-plus" />
|
|
|
- </el-upload>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="地址">
|
|
|
- <el-input v-model="form.address" />
|
|
|
- </el-form-item>
|
|
|
- <el-row>
|
|
|
<el-col :span="12">
|
|
|
- <el-form-item label="联系人">
|
|
|
- <el-input v-model="form.contacts" />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="12">
|
|
|
- <el-form-item label="联系电话">
|
|
|
- <el-input v-model="form.contactNumber" />
|
|
|
+ <el-form-item label="标注位置">
|
|
|
+ <a-map-marker id="amapcontainer" :position="[lng, lat]" @click="aMapClick"/>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
-
|
|
|
<el-form-item label="简介">
|
|
|
- <el-input v-model="form.brief" type="textarea" rows="10" />
|
|
|
+ <el-input v-model="form.brief" type="textarea" rows="10"/>
|
|
|
</el-form-item>
|
|
|
-
|
|
|
- <div id="amapcontainer" style="width: 100%;height: 400px" />
|
|
|
-
|
|
|
</el-form>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
<el-button @click="visible = false">取 消</el-button>
|
|
|
@@ -64,10 +69,11 @@
|
|
|
<script>
|
|
|
|
|
|
import { uploaderHandle } from '@/api/upload'
|
|
|
-import AMapLoader from '@amap/amap-jsapi-loader'
|
|
|
+import AMapMarker from '@/components/AMapMarker'
|
|
|
import { save, updateById } from '@/api/bz/base/venue'
|
|
|
|
|
|
export default {
|
|
|
+ components: { AMapMarker },
|
|
|
data() {
|
|
|
return {
|
|
|
visible: false,
|
|
|
@@ -92,42 +98,22 @@ export default {
|
|
|
open(data) {
|
|
|
this.visible = true
|
|
|
this.isLoading = false
|
|
|
- this.form = Object.assign({}, data)
|
|
|
- this.initMap()
|
|
|
- },
|
|
|
- initMap() {
|
|
|
- const _this = this
|
|
|
- AMapLoader.load({
|
|
|
- key: '173fa0186964179b9c6f43d59f72172f',
|
|
|
- version: '2.0',
|
|
|
- plugins: ['AMap.ToolBar', 'AMap.Scale']
|
|
|
- }).then((AMap) => {
|
|
|
- this.map = new AMap.Map('amapcontainer', {
|
|
|
- zoom: 15
|
|
|
- })
|
|
|
+ this.fileList = []
|
|
|
|
|
|
- _this.map.on('click', function(e) {
|
|
|
- _this.lng = e.lnglat.lng
|
|
|
- _this.lat = e.lnglat.lat
|
|
|
- if (_this.marker) {
|
|
|
- _this.marker.setPosition([e.lnglat.lng, e.lnglat.lat])
|
|
|
- } else {
|
|
|
- _this.marker = new AMap.Marker({
|
|
|
- position: [e.lnglat.lng, e.lnglat.lat],
|
|
|
- clickable: true,
|
|
|
- map: _this.map
|
|
|
- })
|
|
|
- }
|
|
|
+ if (data.litpics) {
|
|
|
+ data.litpics.forEach(o => {
|
|
|
+ this.fileList.push({ url: o })
|
|
|
})
|
|
|
- }).catch(e => {
|
|
|
- console.log(e)
|
|
|
- })
|
|
|
+ }
|
|
|
+ this.form = Object.assign({}, data)
|
|
|
+ this.lng = data.lng
|
|
|
+ this.lat = data.lat
|
|
|
+ },
|
|
|
+ aMapClick(e) {
|
|
|
+ this.lng = e.lnglat.lng
|
|
|
+ this.lat = e.lnglat.lat
|
|
|
},
|
|
|
handleSubmit() {
|
|
|
- console.log(this.fileList)
|
|
|
- console.log(this.lng)
|
|
|
- console.log(this.lat)
|
|
|
- console.log(this.form)
|
|
|
const litpics = []
|
|
|
this.fileList.forEach(o => {
|
|
|
litpics.push(o.url)
|
|
|
@@ -135,7 +121,6 @@ export default {
|
|
|
this.isLoading = true
|
|
|
const param = { ...this.form, lng: this.lng, lat: this.lat, litpics }
|
|
|
if (this.form.id) {
|
|
|
- console.log(param)
|
|
|
updateById(this.form.id, param).then(() => {
|
|
|
this.visible = false
|
|
|
this.$emit('ok')
|