Skip to content

E
ElectricitySheep
Commit b2a001a1 authored by Mac's avatar Mac
Browse files
Options

1

parent aa5b1ae3
Show whitespace changes
Inline Side-by-side
Showing with 607 additions and 376 deletions
src/components/tradePavilion/addbrand.vue
View file @ b2a001a1
<template>
<div v-loading="loading" class="addbrand">
<div class="head-title">
<span @click="CommonJump('brandManagement')" class="blue point">品牌管理</span> / 编辑品牌管理
<span @click="CommonJump('brandManagement')" class="blue point"
>品牌管理</span
>
/ 编辑品牌管理
</div>
<div class="content">
<el-form :model="addMsg" :rules="rules" ref="addMsg" label-width="150px" style="width:70%">
<el-form
:model="addMsg"
:rules="rules"
ref="addMsg"
label-width="150px"
style="width: 70%"
>
<el-form-item label="品牌分类" class="is-required" prop="BrandClassId">
<el-select class="w300" v-model="addMsg.BrandClassId" size="small" placeholder="请选择">
<el-select
class="w300"
v-model="addMsg.BrandClassId"
size="small"
placeholder="请选择"
>
<el-option :key="0" label="请选择" :value="0"></el-option>
<el-option v-for="item in BrandClassList" :key="item.ID" :label="item.ClassName" :value="item.ID">
<el-option
v-for="item in BrandClassList"
:key="item.ID"
:label="item.ClassName"
:value="item.ID"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="品牌全名" prop="FullBrandName" class="is-required" size="small">
<el-input v-model="addMsg.FullBrandName" class="w600" placeholder="请输入品牌全名" maxlength="100" />
<el-form-item
label="品牌全名"
prop="FullBrandName"
class="is-required"
size="small"
>
<el-input
v-model="addMsg.FullBrandName"
class="w600"
placeholder="请输入品牌全名"
maxlength="100"
/>
</el-form-item>
<el-form-item label="品牌名" prop="BrandName" class="is-required" size="small">
<el-input v-model="addMsg.BrandName" class="w600" placeholder="请输入品牌名" maxlength="100" />
<el-form-item
label="品牌名"
prop="BrandName"
class="is-required"
size="small"
>
<el-input
v-model="addMsg.BrandName"
class="w600"
placeholder="请输入品牌名"
maxlength="100"
/>
</el-form-item>
<el-form-item label="品牌视频">
<el-input v-model="addMsg.VideoUrl" class="w600" size="small" placeholder="请输入内容">
<el-button @click="changeState1 = true" slot="append">添加视频</el-button>
<el-input
v-model="addMsg.VideoUrl"
class="w600"
size="small"
placeholder="请输入内容"
>
<el-button @click="changeState1 = true" slot="append"
>添加视频</el-button
>
</el-input>
<a v-if="addMsg.VideoUrl != ''" class="blue noline" :href="addMsg.VideoUrl" target="_blank">视频链接</a>
<a
v-if="addMsg.VideoUrl != ''"
class="blue noline"
:href="addMsg.VideoUrl"
target="_blank"
>视频链接</a
>
</el-form-item>
<el-form-item label="Logo" class="is-required" prop="Logo" size="small">
<el-button @click="openChangeDig(1)" size="small">选择文件</el-button>
<div class="app-gallery-item" style="position: relative;width: 100px;margin-top: 10px;">
<img v-if="!addMsg.Logo || addMsg.Logo==''" src="../../assets/img/default.png"
style="width:80px;height:80px" alt="">
<div
class="app-gallery-item"
style="position: relative; width: 100px; margin-top: 10px"
>
<img
v-if="!addMsg.Logo || addMsg.Logo == ''"
src="../../assets/img/default.png"
style="width: 80px; height: 80px"
alt=""
/>
<el-image
v-else
style="width: 80px;height:80px;"
style="width: 80px; height: 80px"
:src="addMsg.Logo"
:preview-src-list="logoList">
:preview-src-list="logoList"
>
</el-image>
</div>
</el-form-item>
<el-form-item label="品牌介绍图">
<el-tooltip class="item" effect="dark" content="第一张图片为封面图" placement="top"
style="position: absolute;left: -5px;top:12px">
<el-tooltip
class="item"
effect="dark"
content="第一张图片为封面图"
placement="top"
style="position: absolute; left: -5px; top: 12px"
>
<i class="el-tooltip el-icon-info"></i>
</el-tooltip>
<p style="color:#c9c9c9;margin:0 0 12px 20px;">
<p style="color: #c9c9c9; margin: 0 0 12px 20px">
第一张图片为缩略图,其它图片为轮播图,建议像素750*750,最多支持上传9张
</p>
<div class="nav_Main">
<div class="nav_IconContent">
<draggable v-model="addMsg.BannerList">
<div style="position: relative;margin-right: 20px;display:inline-block;" v-for="(item, index) in addMsg.BannerList" :key="index+'2'">
<div
style="
position: relative;
margin-right: 20px;
display: inline-block;
"
v-for="(item, index) in addMsg.BannerList"
:key="index + '2'"
>
<el-image
style="width: 100px;height:100px;"
style="width: 100px; height: 100px"
:src="item"
:preview-src-list="addMsg.BannerList">
:preview-src-list="addMsg.BannerList"
>
</el-image>
<el-button @click="ClearCarouse(index)" class="delBtn" type="danger" icon="el-icon-close" circle>
<el-button
@click="ClearCarouse(index)"
class="delBtn"
type="danger"
icon="el-icon-close"
circle
>
</el-button>
</div>
</draggable>
</div>
<div @click="openChangeDig(2)" v-if="addMsg.BannerList.length<9" class="add-image-btn 2222"
style="cursor:pointer;">
<div
@click="openChangeDig(2)"
v-if="addMsg.BannerList.length < 9"
class="add-image-btn 2222"
style="cursor: pointer"
>
+ 添加图片
</div>
</div>
</el-form-item>
<el-form-item label="店铺数量" prop="ShopNum" class="is-required" size="small">
<el-input v-model="addMsg.ShopNum" class="w600" placeholder="请输入店铺数量" type="number" maxlength="3" />
<el-form-item
label="店铺数量"
prop="ShopNum"
class="is-required"
size="small"
>
<el-input
v-model="addMsg.ShopNum"
class="w600"
placeholder="请输入店铺数量"
type="number"
maxlength="3"
/>
</el-form-item>
<el-form-item label="建筑面积" size="small">
<el-input v-model="addMsg.BuiltUpArea" placeholder="请输入建筑面积" type="number" style="width: 200px"
maxlength="7" />
<span style="margin: 0 10px;">~</span>
<el-input v-model="addMsg.EndBuiltUpArea" placeholder="请输入建筑面积" type="number" style="width: 200px"
maxlength="7" />
<el-input
v-model="addMsg.BuiltUpArea"
placeholder="请输入建筑面积"
type="number"
style="width: 200px"
maxlength="7"
/>
<span style="margin: 0 10px">~</span>
<el-input
v-model="addMsg.EndBuiltUpArea"
placeholder="请输入建筑面积"
type="number"
style="width: 200px"
maxlength="7"
/>
</el-form-item>
<el-form-item label="需求面积" size="small">
<el-input v-model="addMsg.AreaRequirement" placeholder="请输入需求面积" type="number" style="width: 200px"
maxlength="7" />
<span style="margin: 0 10px;">~</span>
<el-input v-model="addMsg.EndAreaRequirement" placeholder="请输入需求面积" type="number" style="width: 200px"
maxlength="7" />
<el-input
v-model="addMsg.AreaRequirement"
placeholder="请输入需求面积"
type="number"
style="width: 200px"
maxlength="7"
/>
<span style="margin: 0 10px">~</span>
<el-input
v-model="addMsg.EndAreaRequirement"
placeholder="请输入需求面积"
type="number"
style="width: 200px"
maxlength="7"
/>
</el-form-item>
<el-form-item label="客群定位" size="small">
<el-input v-model="addMsg.CustomerType" placeholder="请输入客群定位" class="w600" maxlength="200" />
<el-input
v-model="addMsg.CustomerType"
placeholder="请输入客群定位"
class="w600"
maxlength="200"
/>
</el-form-item>
<el-form-item label="品牌定位" size="small">
<el-input v-model="addMsg.BrandType" placeholder="请输入品牌定位" class="w600" maxlength="100" />
<el-input
v-model="addMsg.BrandType"
placeholder="请输入品牌定位"
class="w600"
maxlength="100"
/>
</el-form-item>
<el-form-item label="拓店区域" size="small">
<el-input v-model="addMsg.StoreExpansion" placeholder="请输入拓店区域" class="w600" maxlength="200" />
<el-input
v-model="addMsg.StoreExpansion"
placeholder="请输入拓店区域"
class="w600"
maxlength="200"
/>
</el-form-item>
<el-form-item label="商铺性质" size="small">
<el-select class="w300" v-model="addMsg.ProjectType" size="small" placeholder="请选择商铺性质">
<el-select
class="w300"
v-model="addMsg.ProjectType"
size="small"
placeholder="请选择商铺性质"
>
<el-option :key="0" label="请选择" :value="0"></el-option>
<el-option v-for="item in ProjectTypeList" :key="item.Id" :label="item.Name" :value="item.Id">
<el-option
v-for="item in ProjectTypeList"
:key="item.Id"
:label="item.Name"
:value="item.Id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="电量" size="small">
<el-input v-model="addMsg.DianLiang" class="w600" placeholder="请输入电量" maxlength="80" />
<!-- <el-form-item label="电量" size="small">
<el-input v-model="addMsg.ShopSize" class="w600" placeholder="请输入电量" maxlength="80" />
</el-form-item> -->
<div class="brandShuxing">
<div class="brandShuxing_item">
<el-form-item label="店铺开口尺寸" class="is-required">
<el-radio v-model="addMsg.IsShopSize" :label="1">是</el-radio>
<el-radio v-model="addMsg.IsShopSize" :label="0">否</el-radio>
</el-form-item>
<el-input
v-model="addMsg.ShopSize"
v-if="addMsg.IsShopSize == 1"
size="small"
class="w120"
placeholder="店铺开口尺寸"
maxlength="80"
/>
</div>
<div class="brandShuxing_item">
<el-form-item label="燃气" class="is-required">
<el-radio v-model="addMsg.RanQi" :label="1">是</el-radio>
<el-radio v-model="addMsg.RanQi" :label="0">否</el-radio>
</el-form-item>
<el-input
v-model="addMsg.RanQiBZ"
v-if="addMsg.RanQi == 1"
size="small"
class="w120"
placeholder="燃气备注"
maxlength="80"
/>
</div>
</div>
<div class="brandShuxing">
<div class="brandShuxing_item">
<el-form-item label="排烟量" class="is-required">
<el-radio v-model="addMsg.PaiYan" :label="1">是</el-radio>
<el-radio v-model="addMsg.PaiYan" :label="0">否</el-radio>
</el-form-item>
<el-input
v-model="addMsg.PaiYanBZ"
v-if="addMsg.PaiYan == 1"
size="small"
class="w120"
placeholder="排烟量"
maxlength="80"
/>
</div>
<div class="brandShuxing_item">
<el-form-item label="电量" class="is-required">
<el-radio v-model="addMsg.IsDianLiang" :label="1">是</el-radio>
<el-radio v-model="addMsg.IsDianLiang" :label="0">否</el-radio>
</el-form-item>
<el-input
v-model="addMsg.DianLiang"
v-if="addMsg.IsDianLiang == 1"
size="small"
class="w120"
placeholder="电量"
maxlength="80"
/>
</div>
</div>
<div class="brandShuxing">
<div class="brandShuxing_item">
<el-form-item label="上下水" class="is-required">
<el-radio v-model="addMsg.Plumbing" :label="1">是</el-radio>
<el-radio v-model="addMsg.Plumbing" :label="0">否</el-radio>
</el-form-item>
</div>
<div class="brandShuxing_item">
<el-form-item label="管径" class="is-required">
<el-radio v-model="addMsg.Caliber" :label="1">是</el-radio>
<el-radio v-model="addMsg.Caliber" :label="0">否</el-radio>
</el-form-item>
</div>
</div>
<div class="brandShuxing">
<div class="brandShuxing_item">
<el-form-item label="排污" class="is-required">
<el-radio v-model="addMsg.Sewage" :label="1">是</el-radio>
<el-radio v-model="addMsg.Sewage" :label="0">否</el-radio>
</el-form-item>
<el-form-item label="燃气" class="is-required">
<el-radio v-model="addMsg.RanQi" :label="1">是</el-radio>
<el-radio v-model="addMsg.RanQi" :label="0">否</el-radio>
</el-form-item>
</div>
<div class="brandShuxing">
<el-form-item label="排烟量" class="is-required">
<el-radio v-model="addMsg.PaiYan" :label="1">是</el-radio>
<el-radio v-model="addMsg.PaiYan" :label="0">否</el-radio>
</el-form-item>
<div class="brandShuxing_item">
<el-form-item label="空调" class="is-required">
<el-radio v-model="addMsg.KongTiao" :label="1">是</el-radio>
<el-radio v-model="addMsg.KongTiao" :label="0">否</el-radio>
</el-form-item>
</div>
</div>
<div class="brandShuxing">
<div class="brandShuxing_item">
<el-form-item label="新风" class="is-required">
<el-radio v-model="addMsg.XinFeng" :label="1">是</el-radio>
<el-radio v-model="addMsg.XinFeng" :label="0">否</el-radio>
</el-form-item>
</div>
</div>
<el-form-item label="广告" class="ue-style">
<UE style="width:700px;" :defaultMsg="Advertising" :config="config" :IsMultiple="true" ref="ue"></UE>
<UE
style="width: 700px"
:defaultMsg="Advertising"
:config="config"
:IsMultiple="true"
ref="ue"
></UE>
</el-form-item>
<el-form-item label="其他" class="ue-style">
<UE style="width:700px;" :defaultMsg="Other" :config="config" :IsMultiple="true" ref="ueother"></UE>
<UE
style="width: 700px"
:defaultMsg="Other"
:config="config"
:IsMultiple="true"
ref="ueother"
></UE>
</el-form-item>
</el-form>
</div>
<div style="margin-top:20px">
<el-button size="small" type="primary" @click="Save('addMsg')">保存</el-button>
<div style="margin-top: 20px">
<el-button size="small" type="primary" @click="Save('addMsg')"
>保存</el-button
>
</div>
<!-- 选择文件 -->
<el-dialog title="选择文件" :visible.sync="changeState" width="1240px">
......@@ -157,16 +379,16 @@
</div>
</template>
<script>
import ChooseImg from "@/components/global/ChooseImg.vue";
import UE from "@/components/global/UE.vue";
import Choosevideo from "@/components/global/Choosevideo.vue";
import draggable from "vuedraggable"
export default {
import ChooseImg from "@/components/global/ChooseImg.vue";
import UE from "@/components/global/UE.vue";
import Choosevideo from "@/components/global/Choosevideo.vue";
import draggable from "vuedraggable";
export default {
components: {
ChooseImg,
UE,
Choosevideo,
draggable
draggable,
},
data() {
return {
......@@ -176,64 +398,77 @@
BannerList: [], //品牌介绍图
VideoUrl: "", //品牌视频
FullBrandName: "", //品牌全名
BrandName: '', //品牌名
BrandName: "", //品牌名
ShopNum: "", //店铺数量
BuiltUpArea: "", //建筑面积小
EndBuiltUpArea: "", //建筑面积大
CustomerType: '', //客群定位
BrandType: '', //品牌定位
StoreExpansion: '', //扩店区域
CustomerType: "", //客群定位
BrandType: "", //品牌定位
StoreExpansion: "", //扩店区域
ProjectType: 0, //商铺性质
AreaRequirement: 0, //
EndAreaRequirement: 0, //
Advertising: '', //广告
Other: '', //其他
Advertising: "", //广告
Other: "", //其他
ShopSize: 1, //店铺开口尺寸
Plumbing: 1, //上下水
Caliber: 1, //管径
Sewage: 1, //排污
RanQi: 1, //燃气
DianLiang: '', //电量
DianLiang: "", //电量
PaiYan: 1, //排烟量
KongTiao: 1, //空调
XinFeng: 1, //新风
BrandClassId: 0, //品牌分类Id
RanQiBZ: "", //燃气备注
IsDianLiang: 1, //电量（0-否1-有）
PaiYanBZ: "", //排烟量备注
ShopSize: "", //店铺开口尺寸
IsShopSize: 1, //店铺开口尺寸（0-否1-有）
},
loadingPeople: false,
dynamicTags: [],
dynamicTags2: [],
inputVisible: false,
inputValue: '',
inputValue: "",
inputVisible2: false,
inputValue2: '',
inputValue2: "",
Advertising: "",
Other: '',
Other: "",
config: {
initialFrameWidth: null,
initialFrameHeight: 200
initialFrameHeight: 200,
},
Picindex: 0,
rules: {
FullBrandName: [{
FullBrandName: [
{
required: true,
message: '请输入品牌全名',
trigger: 'blur'
}],
BrandName: [{
message: "请输入品牌全名",
trigger: "blur",
},
],
BrandName: [
{
required: true,
message: '请输入品牌名',
trigger: 'blur'
}],
Logo: [{
message: "请输入品牌名",
trigger: "blur",
},
],
Logo: [
{
required: true,
message: '请选择Logo',
trigger: 'blur'
}],
ShopNum: [{
message: "请选择Logo",
trigger: "blur",
},
],
ShopNum: [
{
required: true,
message: '请输入店铺数量',
trigger: 'blur'
}],
message: "请输入店铺数量",
trigger: "blur",
},
],
},
loading: false,
changeState: false,
......@@ -242,7 +477,7 @@
peopleData: [],
BrandClassList: [], //品牌分类列表
ProjectTypeList: [], //商铺性质列表
logoList:[]
logoList: [],
};
},
created() {
......@@ -251,28 +486,25 @@
},
mounted() {
if (this.$route.query.ID) {
this.getData(this.$route.query.ID)
this.getData(this.$route.query.ID);
}
},
methods: {
//获取商铺性质
getProjectType() {
this.apipost(
"/api/Trade/GetProjectTypeEnumList", {},
res => {
this.apipost("/api/Trade/GetProjectTypeEnumList", {}, (res) => {
if (res.data.resultCode == 1) {
this.ProjectTypeList = res.data.data;
} else {
this.Error(res.data.message);
}
},
);
});
},
//选择图片
SelectId(msg) {
let url = this.getIconLink(msg.url)
let url = this.getIconLink(msg.url);
if (this.imgType == 1) {
this.addMsg.Logo = url
this.addMsg.Logo = url;
}
if (this.imgType == 2) {
this.addMsg.BannerList.push(url);
......@@ -292,16 +524,13 @@
this.changeState1 = false;
},
getBrandClassList() {
this.apipost(
"/api/Trade/GetBrandClassList", {},
res => {
this.apipost("/api/Trade/GetBrandClassList", {}, (res) => {
if (res.data.resultCode == 1) {
this.BrandClassList = res.data.data;
} else {
this.Error(res.data.message);
}
},
);
});
},
//保存品牌
Save(formName) {
......@@ -313,14 +542,14 @@
this.addMsg.Other = other;
this.$refs[formName].validate((valid) => {
if (valid) {
this.apipost("/api/Trade/GetSetBrand", this.addMsg, res => {
this.apipost("/api/Trade/GetSetBrand", this.addMsg, (res) => {
if (res.data.resultCode == 1) {
this.CommonJump('brandManagement');
this.CommonJump("brandManagement");
this.Success(res.data.message);
} else {
this.Error(res.data.message);
}
})
});
} else {
return false;
}
......@@ -329,9 +558,12 @@
//获取详情
getData(ID) {
this.loading = true;
this.apipost("/api/Trade/GetBrandDetails", {
ID: ID
}, res => {
this.apipost(
"/api/Trade/GetBrandDetails",
{
ID: ID,
},
(res) => {
this.loading = false;
if (res.data.resultCode == 1) {
this.addMsg = res.data.data;
......@@ -344,77 +576,72 @@
this.logoList = [];
this.logoList.push(this.addMsg.Logo);
}
})
}
);
},
},
};
};
</script>
<style>
.app-add-cat .el-checkbox-group {
.app-add-cat .el-checkbox-group {
font-size: 14px !important;
}
}
.app-add-cat .el-checkbox {
.app-add-cat .el-checkbox {
margin-right: 0;
}
}
.app-add-cat .el-dialog__body {
.app-add-cat .el-dialog__body {
padding: 10px 20px !important;
}
}
.app-add-cat .tag-box .tag-item {
.app-add-cat .tag-box .tag-item {
margin-right: 5px;
}
}
.app-add-cat .tag-box {
.app-add-cat .tag-box {
margin: 20px 0;
}
}
.app-add-cat .app-goods-cat-list .active {
background: #FAFAFA;
}
.app-add-cat .app-goods-cat-list .active {
background: #fafafa;
}
.app-add-cat .app-goods-cat-list .cat-item {
.app-add-cat .app-goods-cat-list .cat-item {
cursor: pointer;
padding: 5px 10px;
}
}
.app-add-cat .app-goods-cat-list {
border: 1px solid #E8EAEE;
.app-add-cat .app-goods-cat-list {
border: 1px solid #e8eaee;
border-radius: 5px;
margin-top: -5px;
padding: 10px 0;
overflow: scroll;
height: 400px;
}
}
.addbrand .blue {
color: #409eff;
}
.addbrand .blue {
color: #409EFF;
}
.addbrand .content {
.addbrand .content {
background: #fff;
margin-top: 10px;
padding: 20px;
box-sizing: border-box;
}
}
.addbrand .gez_list {
.addbrand .gez_list {
/*width: 650px;*/
margin-bottom: 12px;
padding: 20px;
border: 1px solid #EBEEF5;
background-color: #FFF;
border: 1px solid #ebeef5;
background-color: #fff;
color: #303133;
}
}
.addbrand .quyu {
.addbrand .quyu {
background-color: #f4f4f5;
color: #909399;
padding: 10px;
......@@ -424,59 +651,59 @@
border-radius: 4px;
white-space: nowrap;
margin: 5px;
}
}
.addbrand .el-tag+.el-tag {
.addbrand .el-tag + .el-tag {
margin-left: 10px;
}
}
.addbrand .button-new-tag {
.addbrand .button-new-tag {
margin-left: 10px;
height: 32px;
line-height: 30px;
padding-top: 0;
padding-bottom: 0;
}
}
.addbrand .input-new-tag {
.addbrand .input-new-tag {
width: 90px;
margin-left: 10px;
vertical-align: bottom;
}
}
.addbrand .ue-style .el-form-item__content {
.addbrand .ue-style .el-form-item__content {
line-height: 0;
}
}
.addbrand .app-gallery-item {
border: none
}
.addbrand .app-gallery-item {
border: none;
}
.addbrand .nav_Main {
.addbrand .nav_Main {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}
}
.addbrand .nav_IconContent {
.addbrand .nav_IconContent {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}
}
/* .addbrand .nav_IconContent div>div {
/* .addbrand .nav_IconContent div>div {
display: inline-block;
} */
.addbrand .colapp-image {
.addbrand .colapp-image {
background-size: cover;
background-position: center center;
width: 100px;
height: 100px;
border-radius: 0%;
}
}
.addbrand .add-image-btn {
.addbrand .add-image-btn {
width: 100px;
height: 100px;
line-height: 100px;
......@@ -484,23 +711,27 @@
border: 1px solid #e2e2e2;
cursor: pointer;
text-align: center;
}
}
.addbrand .delBtn {
.addbrand .delBtn {
position: absolute;
right: -8px;
top: -8px;
padding: 4px 4px !important;
}
}
.addbrand .w600 {
.addbrand .w600 {
width: 600px;
}
}
.addbrand .brandShuxing {
.addbrand .brandShuxing {
display: flex;
justify-content: space-between;
width: 700px;
}
width: 850px;
}
.addbrand .brandShuxing_item {
display: flex;
justify-content: space-between;
width: 50%;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment