2023-03-04 16:29:55 +08:00
|
|
|
|
<template>
|
2023-07-18 10:59:28 +08:00
|
|
|
|
<div class="app-container">
|
|
|
|
|
|
<div>上传图片</div>
|
|
|
|
|
|
<el-upload
|
|
|
|
|
|
:action="actionUrl"
|
|
|
|
|
|
:headers="headers"
|
|
|
|
|
|
list-type="picture-card"
|
|
|
|
|
|
:on-preview="handlePictureCardPreview"
|
|
|
|
|
|
:on-remove="handleRemove"
|
|
|
|
|
|
:on-success="handleSuccess"
|
|
|
|
|
|
:before-upload="beforeUpload"
|
|
|
|
|
|
:file-list="fileList"
|
|
|
|
|
|
style="margin: 10px 0"
|
|
|
|
|
|
>
|
|
|
|
|
|
<i class="el-icon-plus"></i>
|
|
|
|
|
|
</el-upload>
|
|
|
|
|
|
<el-dialog :visible.sync="dialogVisible">
|
|
|
|
|
|
<img width="100%" :src="dialogImageUrl" alt="" />
|
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
<el-form
|
|
|
|
|
|
:label-position="labelPosition"
|
|
|
|
|
|
label-width="120px"
|
|
|
|
|
|
:model="station"
|
|
|
|
|
|
:rules="rules"
|
|
|
|
|
|
ref="stationRef"
|
|
|
|
|
|
>
|
|
|
|
|
|
<el-row :gutter="24">
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item label="站点名称" prop="stationName">
|
|
|
|
|
|
<el-input v-model="station.stationName"></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="area" label="站点区域">
|
|
|
|
|
|
<!--<el-input v-model="station.areaCode"> </el-input>-->
|
|
|
|
|
|
<el-cascader
|
|
|
|
|
|
size="large"
|
|
|
|
|
|
:options="options"
|
|
|
|
|
|
v-model="areaCodeList"
|
|
|
|
|
|
@change="handleChange"
|
|
|
|
|
|
disabled
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-cascader>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="address" label="地址">
|
|
|
|
|
|
<el-input v-model="station.address" disabled></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="stationTel" label="联系电话">
|
|
|
|
|
|
<el-input v-model="station.stationTel"></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
2023-03-04 16:29:55 +08:00
|
|
|
|
|
2023-07-18 10:59:28 +08:00
|
|
|
|
<el-row :gutter="24">
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="matchCars" label="适配车辆类型">
|
|
|
|
|
|
<el-select
|
|
|
|
|
|
v-model="station.selectMatchCars"
|
|
|
|
|
|
multiple
|
|
|
|
|
|
placeholder="请选择"
|
|
|
|
|
|
>
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
v-for="item in dict.type.match_cars"
|
|
|
|
|
|
:key="item.value"
|
|
|
|
|
|
:label="item.label"
|
|
|
|
|
|
:value="item.value"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="publicFlag" label="是否对外开放">
|
|
|
|
|
|
<el-select
|
|
|
|
|
|
v-model="station.publicFlag"
|
|
|
|
|
|
placeholder="请选择"
|
|
|
|
|
|
>
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
v-for="item in publicFlagOptions"
|
|
|
|
|
|
:key="item.value"
|
|
|
|
|
|
:label="item.label"
|
|
|
|
|
|
:value="item.value"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-option>
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="openFlag" label="是否营业中">
|
|
|
|
|
|
<el-select
|
|
|
|
|
|
v-model="station.openFlag"
|
|
|
|
|
|
placeholder="请选择"
|
|
|
|
|
|
>
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
v-for="item in openFlagOptions"
|
|
|
|
|
|
:key="item.value"
|
|
|
|
|
|
:label="item.label"
|
|
|
|
|
|
:value="item.value"
|
|
|
|
|
|
>
|
|
|
|
|
|
</el-option>
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="merchantAdminName" label="管理员">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
:value="
|
|
|
|
|
|
station.merchantAdminName === null
|
|
|
|
|
|
? '无'
|
|
|
|
|
|
: station.merchantAdminName
|
|
|
|
|
|
"
|
|
|
|
|
|
></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
2023-03-04 16:29:55 +08:00
|
|
|
|
|
2023-07-18 10:59:28 +08:00
|
|
|
|
<el-row :gutter="24">
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="stationLng" label="经度">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="station.stationLng"
|
|
|
|
|
|
disabled
|
|
|
|
|
|
></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="stationLat" label="纬度">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="station.stationLat"
|
|
|
|
|
|
disabled
|
|
|
|
|
|
></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="merchantName" label="运营商">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
:value="
|
|
|
|
|
|
station.merchantName === null
|
|
|
|
|
|
? '无'
|
|
|
|
|
|
: station.merchantName
|
|
|
|
|
|
"
|
|
|
|
|
|
disabled
|
|
|
|
|
|
></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="stationType" label="站点类型">
|
|
|
|
|
|
<el-select
|
|
|
|
|
|
v-model="station.stationType"
|
|
|
|
|
|
placeholder="请选择"
|
|
|
|
|
|
>
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
v-for="item in dict.type.station_type"
|
|
|
|
|
|
:key="item.value"
|
|
|
|
|
|
:label="item.label"
|
|
|
|
|
|
:value="item.value"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
2023-03-04 16:29:55 +08:00
|
|
|
|
|
2023-07-18 10:59:28 +08:00
|
|
|
|
<el-row :gutter="24">
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="construction" label="建设场所">
|
|
|
|
|
|
<el-select
|
|
|
|
|
|
v-model="station.construction"
|
|
|
|
|
|
placeholder="请选择"
|
|
|
|
|
|
>
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
v-for="item in dict.type.construction_type"
|
|
|
|
|
|
:key="item.value"
|
|
|
|
|
|
:label="item.label"
|
|
|
|
|
|
:value="item.value"
|
|
|
|
|
|
/>
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="electricityPrice" label="充电费率">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
:value="
|
|
|
|
|
|
station.electricityPrice === null
|
|
|
|
|
|
? 0
|
|
|
|
|
|
: station.electricityPrice
|
|
|
|
|
|
"
|
|
|
|
|
|
disabled
|
|
|
|
|
|
></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="servicePrice" label="服务费率">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
:value="
|
|
|
|
|
|
station.servicePrice === null
|
|
|
|
|
|
? 0
|
|
|
|
|
|
: station.servicePrice
|
|
|
|
|
|
"
|
|
|
|
|
|
disabled
|
|
|
|
|
|
></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="businessHours" label="营业时间">
|
|
|
|
|
|
<el-input v-model="station.businessHours"></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
2023-08-09 15:16:18 +08:00
|
|
|
|
<el-col :span="6">
|
|
|
|
|
|
<el-form-item prop="parkingNumber" label="停车场库编号">
|
|
|
|
|
|
<el-input
|
|
|
|
|
|
v-model="station.parkingNumber"
|
|
|
|
|
|
required="true"
|
|
|
|
|
|
></el-input>
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
</el-col>
|
2023-07-18 10:59:28 +08:00
|
|
|
|
</el-row>
|
|
|
|
|
|
</el-form>
|
|
|
|
|
|
<el-button
|
|
|
|
|
|
type="primary"
|
|
|
|
|
|
style="margin-left: 94%"
|
|
|
|
|
|
@click="present"
|
|
|
|
|
|
v-has-permi="['pile:station:edit']"
|
|
|
|
|
|
>提交</el-button
|
|
|
|
|
|
>
|
|
|
|
|
|
</div>
|
2023-03-04 16:29:55 +08:00
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
2023-07-18 10:59:28 +08:00
|
|
|
|
import { getStationInfo, updateStation } from "@/api/pile/station.js";
|
2023-03-04 16:29:55 +08:00
|
|
|
|
import bus from "@/bus/bus";
|
2023-07-18 10:59:28 +08:00
|
|
|
|
import { regionData } from "element-china-area-data";
|
|
|
|
|
|
import { getToken } from "@/utils/auth";
|
2023-03-04 16:29:55 +08:00
|
|
|
|
|
|
|
|
|
|
export default {
|
2023-07-18 10:59:28 +08:00
|
|
|
|
dicts: ["station_type", "match_cars", "construction_type"],
|
|
|
|
|
|
data() {
|
|
|
|
|
|
return {
|
|
|
|
|
|
actionUrl: process.env.VUE_APP_BASE_API + "/common/uploadOSS",
|
|
|
|
|
|
dialogVisible: false,
|
|
|
|
|
|
headers: {
|
|
|
|
|
|
Authorization: "Bearer " + getToken(),
|
|
|
|
|
|
},
|
|
|
|
|
|
imageUrl: null,
|
|
|
|
|
|
dialogImageUrl: "",
|
|
|
|
|
|
options: regionData,
|
|
|
|
|
|
labelPosition: "right",
|
|
|
|
|
|
station: {
|
|
|
|
|
|
stationName: "",
|
|
|
|
|
|
areaCode: "",
|
|
|
|
|
|
address: "",
|
|
|
|
|
|
stationTel: "",
|
|
|
|
|
|
matchCars: "",
|
2023-08-09 09:29:55 +08:00
|
|
|
|
parkingNumber: "",
|
2023-07-18 10:59:28 +08:00
|
|
|
|
selectMatchCars: [],
|
|
|
|
|
|
publicFlag: "",
|
|
|
|
|
|
openFlag: "",
|
|
|
|
|
|
aMapFlag: "",
|
|
|
|
|
|
merchantAdminName: "",
|
|
|
|
|
|
stationLng: "",
|
|
|
|
|
|
stationLat: "",
|
|
|
|
|
|
merchantId: "",
|
|
|
|
|
|
stationStatus: "",
|
|
|
|
|
|
construction: "",
|
|
|
|
|
|
businessHours: "",
|
|
|
|
|
|
pictures: "",
|
|
|
|
|
|
deptId: "",
|
|
|
|
|
|
},
|
|
|
|
|
|
stationId: this.$route.params.id,
|
|
|
|
|
|
publicFlagOptions: [
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "1",
|
|
|
|
|
|
label: "是",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "0",
|
|
|
|
|
|
label: "否",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
openFlagOptions: [
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "1",
|
|
|
|
|
|
label: "是",
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
value: "0",
|
|
|
|
|
|
label: "否",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
rules: {
|
|
|
|
|
|
stationName: [
|
|
|
|
|
|
{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: "请输入站点名称",
|
|
|
|
|
|
trigger: "blur",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
areaCode: [
|
|
|
|
|
|
{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: "请输入站点区域",
|
|
|
|
|
|
trigger: "blur",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
address: [
|
|
|
|
|
|
{ required: true, message: "请输入地址", trigger: "blur" },
|
|
|
|
|
|
],
|
|
|
|
|
|
stationTel: [
|
|
|
|
|
|
{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: "请输入联系电话",
|
|
|
|
|
|
trigger: "blur",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
matchCars: [
|
|
|
|
|
|
{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: "请输入适配车辆类型",
|
|
|
|
|
|
trigger: "blur",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
publicFlag: [
|
|
|
|
|
|
{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: "请填写是否对外开放",
|
|
|
|
|
|
trigger: "blur",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
openFlag: [
|
|
|
|
|
|
{ required: true, message: "是否营业中", trigger: "blur" },
|
|
|
|
|
|
],
|
|
|
|
|
|
// merchantAdminName: [
|
|
|
|
|
|
// { required: true, message: "请输入管理员", trigger: "blur" },
|
|
|
|
|
|
// ],
|
|
|
|
|
|
stationLng: [
|
|
|
|
|
|
{ required: true, message: "请输入经度", trigger: "blur" },
|
|
|
|
|
|
],
|
|
|
|
|
|
stationLat: [
|
|
|
|
|
|
{ required: true, message: "请输入纬度", trigger: "blur" },
|
|
|
|
|
|
],
|
|
|
|
|
|
// merchantId: [
|
|
|
|
|
|
// { required: true, message: "请输入管理员", trigger: "blur" },
|
|
|
|
|
|
// ],
|
|
|
|
|
|
stationType: [
|
|
|
|
|
|
{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: "请输入站点类型",
|
|
|
|
|
|
trigger: "blur",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
construction: [
|
|
|
|
|
|
{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: "请输入建设场所",
|
|
|
|
|
|
trigger: "blur",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
region: [
|
|
|
|
|
|
{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: "请输入充电费率",
|
|
|
|
|
|
trigger: "blur",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
type: [
|
|
|
|
|
|
{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: "请输入服务费率",
|
|
|
|
|
|
trigger: "blur",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
businessHours: [
|
|
|
|
|
|
{
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
message: "请输入营业时间",
|
|
|
|
|
|
trigger: "blur",
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
},
|
|
|
|
|
|
fileList: [], // 用于图片回显
|
|
|
|
|
|
// dialogVisible: null,
|
|
|
|
|
|
};
|
|
|
|
|
|
},
|
|
|
|
|
|
created() {},
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
// 对图片进行上传前处理压缩
|
|
|
|
|
|
beforeUpload(file) {
|
|
|
|
|
|
return new Promise((resolve, reject) => {
|
|
|
|
|
|
const reader = new FileReader();
|
|
|
|
|
|
// 将图片绘制到一个canvas画布上,并设定压缩后的宽度和高度。
|
|
|
|
|
|
reader.onload = (e) => {
|
|
|
|
|
|
const img = new Image();
|
|
|
|
|
|
|
|
|
|
|
|
img.onload = () => {
|
|
|
|
|
|
const canvas = document.createElement("canvas");
|
|
|
|
|
|
const ctx = canvas.getContext("2d");
|
|
|
|
|
|
const maxWidth = 800; // 设置压缩后的最大宽度
|
|
|
|
|
|
const maxHeight = 600; // 设置压缩后的最大高度
|
|
|
|
|
|
let width = img.width;
|
|
|
|
|
|
let height = img.height;
|
|
|
|
|
|
|
|
|
|
|
|
if (width > height) {
|
|
|
|
|
|
if (width > maxWidth) {
|
|
|
|
|
|
height *= maxWidth / width;
|
|
|
|
|
|
width = maxWidth;
|
|
|
|
|
|
}
|
|
|
|
|
|
} else {
|
|
|
|
|
|
if (height > maxHeight) {
|
|
|
|
|
|
width *= maxHeight / height;
|
|
|
|
|
|
height = maxHeight;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
canvas.width = width;
|
|
|
|
|
|
canvas.height = height;
|
|
|
|
|
|
|
|
|
|
|
|
ctx.drawImage(img, 0, 0, width, height);
|
|
|
|
|
|
// 将canvas画布中的内容转换为Blob对象
|
|
|
|
|
|
canvas.toBlob(
|
|
|
|
|
|
(blob) => {
|
|
|
|
|
|
const compressedFile = new File(
|
|
|
|
|
|
[blob],
|
|
|
|
|
|
file.name,
|
|
|
|
|
|
{ type: blob.type }
|
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
|
|
resolve(compressedFile);
|
|
|
|
|
|
},
|
|
|
|
|
|
file.type,
|
|
|
|
|
|
0.8
|
|
|
|
|
|
); // 设置压缩质量,这里设为0.8
|
|
|
|
|
|
};
|
|
|
|
|
|
img.src = e.target.result;
|
|
|
|
|
|
};
|
|
|
|
|
|
reader.readAsDataURL(file);
|
|
|
|
|
|
});
|
2023-03-04 16:29:55 +08:00
|
|
|
|
},
|
2023-07-18 10:59:28 +08:00
|
|
|
|
handleSuccess(res, file) {
|
|
|
|
|
|
this.imageUrl = URL.createObjectURL(file.raw);
|
|
|
|
|
|
console.log("图片上传成功 url:", this.imageUrl);
|
|
|
|
|
|
console.log("图片上传成功 res:", res);
|
|
|
|
|
|
this.fileList.push({ url: res.url });
|
2023-03-04 16:29:55 +08:00
|
|
|
|
},
|
2023-07-18 10:59:28 +08:00
|
|
|
|
handleRemove(file, fileList) {
|
|
|
|
|
|
console.log("移除图片", file, fileList);
|
|
|
|
|
|
// 从pics数组中,找到图片对应的索引值
|
|
|
|
|
|
const i = this.fileList.findIndex((x) => x.uid === file.uid);
|
|
|
|
|
|
// 调用splice方法,移除图片信息
|
|
|
|
|
|
this.fileList.splice(i, 1);
|
2023-03-04 16:29:55 +08:00
|
|
|
|
},
|
2023-07-18 10:59:28 +08:00
|
|
|
|
handlePictureCardPreview(file) {
|
|
|
|
|
|
this.dialogImageUrl = file.url;
|
|
|
|
|
|
console.log(this.dialogImageUrl);
|
|
|
|
|
|
this.dialogVisible = true;
|
|
|
|
|
|
},
|
|
|
|
|
|
handleChange() {
|
|
|
|
|
|
console.log("111");
|
|
|
|
|
|
},
|
|
|
|
|
|
// 渲染表格数据
|
|
|
|
|
|
async queryStationInfo() {
|
2023-08-09 15:16:18 +08:00
|
|
|
|
this.fileList = [];
|
2023-07-18 10:59:28 +08:00
|
|
|
|
const res = await getStationInfo(this.stationId);
|
|
|
|
|
|
console.log(res);
|
|
|
|
|
|
this.station = res.data;
|
|
|
|
|
|
if (res.data.pictures != null) {
|
|
|
|
|
|
var pictures = res.data.pictures.split(",");
|
|
|
|
|
|
for (let i = 0; i < pictures.length; i++) {
|
|
|
|
|
|
this.fileList.push({ url: pictures[i] });
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
console.log("queryStationInfo表格数据", this.station);
|
|
|
|
|
|
},
|
|
|
|
|
|
// 提交按钮
|
|
|
|
|
|
present() {
|
|
|
|
|
|
// 赋值
|
|
|
|
|
|
this.station.matchCars = this.station.selectMatchCars.join(",");
|
|
|
|
|
|
this.station.pictures = this.pictureList.join(",");
|
|
|
|
|
|
// console.log("matchCars赋值后:", this.station.matchCars);
|
|
|
|
|
|
this.$refs.stationRef.validate((valid) => {
|
|
|
|
|
|
if (valid) {
|
|
|
|
|
|
this.subUpdate();
|
|
|
|
|
|
this.$message.success("提交成功");
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
// 修改充电站信息
|
|
|
|
|
|
async subUpdate() {
|
|
|
|
|
|
await updateStation(this.station);
|
2023-03-04 16:29:55 +08:00
|
|
|
|
},
|
|
|
|
|
|
},
|
2023-07-18 10:59:28 +08:00
|
|
|
|
mounted() {
|
|
|
|
|
|
// 接收map 地图传过来的搜索值
|
|
|
|
|
|
bus.$on("res", (data) => {
|
|
|
|
|
|
// console.log("data", data); // data就是它传过来的值
|
|
|
|
|
|
// console.log("原始this.station", this.station);
|
|
|
|
|
|
// 地址
|
2023-08-03 12:11:31 +08:00
|
|
|
|
// this.detailedAddress = data.address;
|
2023-07-18 10:59:28 +08:00
|
|
|
|
// console.log("详细地址", data.address);
|
|
|
|
|
|
var adcode = data.adcode;
|
|
|
|
|
|
var areaCode = [];
|
|
|
|
|
|
areaCode[0] = adcode.substr(0, 2) + "0000";
|
|
|
|
|
|
areaCode[1] = adcode.substr(0, 4) + "00";
|
|
|
|
|
|
areaCode[2] = adcode;
|
|
|
|
|
|
// console.log("拼装的areaCode", areaCode);
|
|
|
|
|
|
// 修改数据
|
|
|
|
|
|
this.station.areaCode = areaCode.join(",");
|
|
|
|
|
|
this.station.stationLng = String(data.pos[0]);
|
|
|
|
|
|
this.station.stationLat = String(data.pos[1]);
|
|
|
|
|
|
// console.log("修改后this.station", this.station);
|
2023-08-04 09:38:07 +08:00
|
|
|
|
console.log(data.address, "data.address");
|
|
|
|
|
|
this.station.address = data.address.includes("区")
|
|
|
|
|
|
? data.address.replace(/区/, " ").split(" ")[1]
|
|
|
|
|
|
: data.address;
|
2023-07-18 10:59:28 +08:00
|
|
|
|
// 优化之后
|
2023-08-03 12:11:31 +08:00
|
|
|
|
// let newAddress2 = this.detailedAddress
|
|
|
|
|
|
// .replace(/(?<=[省市区])/g, "$&,")
|
|
|
|
|
|
// .split(",");
|
|
|
|
|
|
// let end = newAddress2.pop();
|
|
|
|
|
|
// console.log("详细地址",this.station.areaCode,newAddress2);
|
|
|
|
|
|
// this.station.address = newAddress2;
|
2023-07-18 10:59:28 +08:00
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
computed: {
|
|
|
|
|
|
areaCodeList() {
|
|
|
|
|
|
return this.station.areaCode.split(",");
|
|
|
|
|
|
},
|
|
|
|
|
|
pictureList() {
|
|
|
|
|
|
var pictureList = [];
|
|
|
|
|
|
for (let i = 0; i < this.fileList.length; i++) {
|
|
|
|
|
|
pictureList.push(this.fileList[i].url);
|
|
|
|
|
|
}
|
|
|
|
|
|
return pictureList;
|
|
|
|
|
|
},
|
2023-03-04 16:29:55 +08:00
|
|
|
|
},
|
|
|
|
|
|
};
|
|
|
|
|
|
</script>
|
2023-08-09 15:16:18 +08:00
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
|
::v-deep .el-select > .el-input,
|
|
|
|
|
|
::v-deep .el-cascader .el-input {
|
|
|
|
|
|
width: 283px;
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|