刘翔宇-旅管家 2 years ago
parent 30de835b79
commit fef6d62d4c

@ -236,6 +236,7 @@ export default {
} else {
this.id = ''
this.type = ''
this.image_id=[];
this.init();
this.$refs['dialog'].clearValidate();
delete this.form.id

@ -1,29 +1,15 @@
<template>
<div>
<xy-dialog
ref="dialog"
:is-show.sync="isShow"
type="form"
:title="type === 'add' ? '新增点位场馆' : '编辑点位场馆'"
:form="form"
:rules="rules"
@submit="submit"
>
<xy-dialog ref="dialog" :is-show.sync="isShow" type="form" :title="type === 'add' ? '新增点位场馆' : '编辑点位场馆'"
:form="form" :rules="rules" @submit="submit">
<template v-slot:name>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red; font-weight: 600; padding-right: 4px"
>*</span
>
<span style="color: red; font-weight: 600; padding-right: 4px">*</span>
名称
</div>
<div class="xy-table-item-content">
<el-input
v-model="form.name"
clearable
placeholder="请输入名称"
style="width: 300px"
></el-input>
<el-input v-model="form.name" clearable placeholder="请输入名称" style="width: 300px"></el-input>
</div>
</div>
</template>
@ -31,22 +17,12 @@
<div class="xy-table-item">
<div class="xy-table-item-label">封面图 </div>
<div class="xy-table-item-content">
<el-upload
style="width: 300px"
class="upload-demo"
:action="action"
:on-success="
<el-upload style="width: 300px" class="upload-demo" :action="action" :on-success="
(response, file, fileList) =>
successHandle(response, file, fileList, 'image_id')
"
:before-upload="uploadBefore"
:file-list="image_id"
:on-remove="
" :before-upload="uploadBefore" :file-list="image_id" :on-remove="
(file, fileList) => removeHande(file, fileList, 'image_id')
"
:limit="1"
list-type="picture-card"
>
" :limit="1" list-type="picture-card">
<i slot="default" class="el-icon-plus"></i>
<div slot="tip" class="el-upload__tip">
只能上传jpg/png文件且不超过500kb
@ -59,13 +35,8 @@
<div class="xy-table-item">
<div class="xy-table-item-label">纬度 </div>
<div class="xy-table-item-content">
<el-input-number
v-model="form.lat"
clearable
placeholder="请输入纬度"
style="width: 300px"
:controls="false"
></el-input-number>
<el-input-number v-model="form.lat" clearable placeholder="请输入纬度" style="width: 300px"
:controls="false"></el-input-number>
</div>
</div>
</template>
@ -73,13 +44,8 @@
<div class="xy-table-item">
<div class="xy-table-item-label">经度 </div>
<div class="xy-table-item-content">
<el-input-number
v-model="form.lng"
clearable
placeholder="请输入经度"
style="width: 300px"
:controls="false"
></el-input-number>
<el-input-number v-model="form.lng" clearable placeholder="请输入经度" style="width: 300px"
:controls="false"></el-input-number>
</div>
</div>
</template>
@ -87,14 +53,8 @@
<div class="xy-table-item">
<div class="xy-table-item-label">x轴位置 </div>
<div class="xy-table-item-content xy-table-item-price-per">
<el-input-number
v-model="form.x"
clearable
:precision="2"
placeholder="请输入x轴位置"
style="width: 300px"
:controls="false"
></el-input-number>
<el-input-number v-model="form.x" clearable :precision="2" placeholder="请输入x轴位置" style="width: 300px"
:controls="false"></el-input-number>
</div>
</div>
</template>
@ -102,51 +62,47 @@
<div class="xy-table-item">
<div class="xy-table-item-label">y轴位置 </div>
<div class="xy-table-item-content xy-table-item-price-per">
<el-input-number
v-model="form.y"
:precision="2"
clearable
placeholder="请输入y轴位置"
style="width: 300px"
:controls="false"
></el-input-number>
<el-input-number v-model="form.y" :precision="2" clearable placeholder="请输入y轴位置" style="width: 300px"
:controls="false"></el-input-number>
</div>
</div>
</template>
<template v-slot:video_image_id>
<div class="xy-table-item">
<div class="xy-table-item-label">视频封面图 </div>
<div class="xy-table-item-content">
<el-upload style="width: 300px" class="upload-demo" :action="action" :on-success="
(response, file, fileList) =>
successHandle(response, file, fileList, 'video_image_id')
" :before-upload="uploadBefore" :file-list="video_image_id" :on-remove="
(file, fileList) => removeHande(file, fileList, 'video_image_id')
" :limit="1" list-type="picture-card">
<i slot="default" class="el-icon-plus"></i>
<div slot="tip" class="el-upload__tip">
只能上传jpg/png文件且不超过500kb
</div>
</el-upload>
</div>
</div>
</template>
<template v-slot:video_id>
<div class="xy-table-item">
<div class="xy-table-item-label">视频 </div>
<div class="xy-table-item-content">
<el-upload
style="width: 300px"
ref="upload"
multiple
:on-success="
<el-upload style="width: 300px" ref="upload" multiple :on-success="
(response, file, fileList) =>
successHandle(response, file, fileList, 'video_id')
"
:before-upload="uploadBefore"
accept=".mp4,.avi,.wmv"
:action="action"
:file-list="video_id"
:auto-upload="false"
:on-remove="
" :before-upload="uploadBefore" accept=".mp4,.avi,.wmv" :action="action" :file-list="video_id"
:auto-upload="false" :on-remove="
(file, fileList) => removeHande(file, fileList, 'video_id')
"
>
<el-button slot="trigger" size="small" type="primary"
>选取文件</el-button
>
<el-button
style="margin-left: 10px"
size="small"
type="success"
@click="$refs['upload'].submit()"
>开始上传</el-button
>
">
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
<el-button style="margin-left: 10px" size="small" type="success"
@click="$refs['upload'].submit()">开始上传</el-button>
<div slot="tip" class="el-upload__tip">
支持文件格式.mp4 .avi .wmv
<br />单个文件不能超过20M
<br />单个文件不能超过300M
</div>
</el-upload>
</div>
@ -165,7 +121,10 @@
</template>
<script>
import { show, save } from "@/api/index";
import {
show,
save
} from "@/api/index";
import tinymce from "@/components/XyTinymce"
export default {
components: {
@ -178,6 +137,7 @@ export default {
id: "",
type: "",
image_id: [],
video_image_id:[],
action: process.env.VUE_APP_UPLOAD_API,
video_id: [],
@ -190,15 +150,14 @@ export default {
x: "",
y: "",
video_id: "",
video_image_id: "",
content: "",
},
rules: {
name: [
{
name: [{
required: true,
message: "请填写名称",
},
],
}, ],
},
};
},
@ -260,17 +219,21 @@ export default {
},
uploadBefore(file) {
console.log(file);
if (file.size / 1000 > 20 * 1024) {
if (file.size / 1000 > 300 * 1024) {
this.$message({
type: "warning",
message: "上传图片大小超过20MB",
message: "上传大小超过300MB",
});
return false;
}
},
async getDetail() {
const res = await show({ id: this.id, table_name: "map_points", with_relations: ['video','image'] });
const res = await show({
id: this.id,
table_name: "map_points",
with_relations: ['video', 'image',"videoImage"]
});
this.$integrateData(this.form, res);
this.image_id = res.image ? [{
url: res.image?.url,
@ -282,6 +245,13 @@ export default {
name: res.video?.original_name,
response: res.video
}] : []
this.video_image_id = res.video_image ? [{
url: res.video_image?.url,
name: res.video_image?.original_name,
response: res.video_image
}] : [];
},
submit() {
@ -298,14 +268,16 @@ export default {
writable: true,
});
}
this.form.image_id = this.image_id[0]?.response?.id
this.form.video_id = this.video_id[0]?.response?.id
save(Object.assign(this.form, { table_name: "map_points" })).then(
this.form.image_id = this.image_id[0]?.response?.id;
this.form.video_id = this.video_id[0]?.response?.id;
this.form.video_image_id = this.video_image_id[0]?.response?.id;
save(Object.assign(this.form, {
table_name: "map_points"
})).then(
(res) => {
this.$message({
type: "success",
message:
this.type === "add" ? "新增点位场馆" : "编辑点位场馆" + "成功",
message: this.type === "add" ? "新增点位场馆" : "编辑点位场馆" + "成功",
});
this.isShow = false;
this.$emit("refresh");
@ -324,6 +296,7 @@ export default {
this.type = "";
this.image_id = [];
this.video_id = [];
this.video_image_id = [];
this.init();
this.$refs["dialog"].clearValidate();
delete this.form.id;
@ -337,14 +310,17 @@ export default {
::v-deep .el-input__inner {
text-align: left;
}
.xy-table-item-price-per {
position: relative;
&::after {
position: absolute;
right: 10px;
top: 0;
content: "%";
}
::v-deep .el-input__clear {
position: relative;
right: 46px;

@ -22,7 +22,7 @@
@pageSizeChange="pageSizeChange"
@pageIndexChange="pageChange"
@delete="row => destroy({
table_name: 'map_point_contents',
table_name: 'map_point_images',
id: row.id,
activity_list_id: 7
}).then(_ => getList())"

Loading…
Cancel
Save