Loading
2-26 添加门表对话框
<template>
<el-dialog :title="title" :visible.sync="visiable" width="1000px">
<el-form :model="form" size="small" ref="form" label-width="80px">
<el-form-item label="门票名" prop="Title">
<el-input v-model="form.Title" placeholder="请输入门票标题"></el-input>
</el-form-item>
<div style="overflow:hidden">
<div style="float:left;width:50%;">
<el-form-item label="门票分类">
<el-select style="width:100%;" v-model="form.CategoryId" placeholder="请选择门票分类">
<el-option
v-for="item in categories"
:key="item.Id"
:label="item.Name"
:value="item.Id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="门票描述">
<wangEditor v-model="form.Content"></wangEditor>
</el-form-item>
</div>
<div style="float:left;width:50%;">
<el-form-item label="商户地址">
<baidumap
ref="map"
suggestId="search"
mapStyle="width:100%;height:200px;margin-top:20px"
:controllers="false"
@suggestSelect="select"
@click="clickMap"
>
<el-input type="text" id="search" v-model="form.ShopAddress" />
</baidumap>
</el-form-item>
</div>
</div>
{{form}}
</el-form>
<span slot="footer">
<el-button @click=" visiable= false">取 消</el-button>
<el-button type="primary" @click="ok">确 定</el-button>
</span>
</el-dialog>
</template>
<script>
import baidumap from "../common/baidumap";
import wangEditor from "../common/wangEditor";
import axios from "axios";
export default {
components: {
wangEditor,
baidumap
},
mounted() {
axios.get("/api/category/get").then(res => {
this.categories = res.data.rows;
});
},
data() {
return {
title: "添加",
visiable: true,
categories: [],
form: {
Id: 0,
Title: "",
Price: "",
Stock: 0,
ShopName: "",
ShopAddress: "",
ShopPhone: "",
Lat: "",
Long: "",
Content:'',
Src: "",
CategoryId: '',
Enable: 1,
SortNum: 100
}
};
},
methods: {
ok() {},
select(address) {
console.log(address);
this.$refs.map.getSuggessPoint({
address: address,
success: point => {
this.form.Long = point.lng;
this.form.Lat = point.lat;
this.form.ShopAddress = address;
this.$refs.map.clearMarker(); //清空所有标记
point.level = 15;
this.$refs.map.addMarker(point); //加标记
this.$refs.map.center(point); //居中
}
});
},
clickMap(e) {
var point = e.point;
this.$refs.map.clearMarker(); //清空所有标记
this.$refs.map.addMarker(point); //加标记
this.form.Long = point.lng;
this.form.Lat = point.lat;
},
}
};
</script>
<style>
.w-e-menu {
position: relative;
display: inline-block;
}
.w-e-toolbar {
display: block;
}
.tangram-suggestion-main{
z-index:99999;
}
</style>