Skip to content

E
ElectricitySheep
Commit 7f0f4a99 authored by zhengke's avatar zhengke
Browse files
Options

修改

parent 73e173dd
Hide whitespace changes
Inline Side-by-side
Showing with 383 additions and 19 deletions
src/components/pintuan/pintuanSet.vue
View file @ 7f0f4a99
......@@ -62,7 +62,11 @@
display: none !important;
}
.imgCube .opacity {
.block-box:hover .opacity {
display: block;
}
.pintuanSet .opacity {
position: absolute;
height: 250px;
width: 280px;
......@@ -91,6 +95,98 @@
z-index: 10;
}
.pintuanSet .content {
background: #fff;
padding: 20px 0;
box-sizing: border-box;
margin-top: 10px;
min-height: 400px;
}
.pintuanSet .app-banner-list {
display: inline-block;
padding-right: 5px;
height: 280px;
width: 250px;
margin: 0 20px;
cursor: pointer;
}
.pintuanSet .app-banner-list-item {
height: 280px;
width: 250px;
}
.pintuanSet .app-banner-add-icon {
font-size: 62px;
color: #C0C4CC;
margin-top: 90px;
margin-bottom: 20px;
}
.pintuanSet .shuff_add {
color: rgb(192, 196, 204);
font-size: 16px;
}
.pintuanSet .app-banner-list-item:hover {
border: 1px solid #409EFF;
}
.pintuanSet .app-banner-list {
display: inline-block;
padding-right: 5px;
height: 280px;
width: 250px;
margin-right: 20px;
cursor: pointer;
}
.pintuanSet .app-banner-text {
max-width: 240px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-top: 10px;
}
.pintuanSet .editImg {
display: none;
position: absolute;
bottom: 30px;
right: 80px;
padding: 0px;
}
.pintuanSet .delImg {
display: none;
position: absolute;
bottom: 30px;
right: 20px;
padding: 0px;
}
.pintuanSet .app-banner-list:hover .delImg {
display: block;
}
.pintuanSet .app-banner-list:hover .editImg {
display: block;
}
.pintuanSet .banner_btmDiv {
height: 90px;
padding: 10px;
font-size: 12px;
border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}
.pintuanSet .banner_topImg {
height: 190px;
width: 250px;
display: block;
}
</style>
<template>
<div class="pintuanSet">
......@@ -113,20 +209,20 @@
<el-form-item label="是否开启分销" size="mini">
<el-switch v-model="msg.Is_Share" active-color="#409EFF" :active-value="1" :inactive-value="0">
</el-switch>
<span class="red">注：必须在“<el-button type="text" @click="CommonJump('baseSet')">分销中心=>基础设置</el-button>
<span class="red">注：必须在“<el-button type="text" @click="openNewUrl('baseSet')">分销中心=>基础设置</el-button>
”中开启，才能使用</span>
</el-form-item>
<el-form-item label="是否开启区域允许购买" size="mini">
<el-switch v-model="msg.Is_Territorial_Limitation" active-color="#409EFF" :active-value="1"
:inactive-value="0">
</el-switch>
<span class="red">注：必须在“<el-button type="text">系统管理=>区域允许购买</el-button>”中开启，才能使用</span>
<span class="red">注：必须在“<el-button type="text" @click="openNewUrl('regionBuy')">系统管理=>区域允许购买</el-button>”中开启，才能使用</span>
</el-form-item>
<el-form-item label="支付方式" size="mini">
<el-tooltip class="item" effect="dark" content="默认支持线上支付；若三个都不勾选，则视为勾选线上支付" placement="top">
<i class="topelzk elzk el-tooltip el-icon-info"></i>
</el-tooltip>
<el-checkbox-group v-model="msg.Payment_TypeList" style="display:inline-block;margin-left:10px;">
<el-checkbox-group v-model="msg.Payment_TypeList" :min="1" style="display:inline-block;margin-left:10px;">
<el-checkbox label="online_pay">线上支付</el-checkbox>
<el-checkbox label="huodao">货到付款</el-checkbox>
<el-checkbox label="balance">余额支付</el-checkbox>
......@@ -136,7 +232,7 @@
<el-tooltip class="item" effect="dark" content="自提需要设置门店，如果您还未设置门店请保存本页后设置门店" placement="top">
<i class="topelzk elzk el-tooltip el-icon-info"></i>
</el-tooltip>
<el-checkbox-group v-model="msg.Send_TypeList" style="display:inline-block;margin-left:10px;">
<el-checkbox-group v-model="msg.Send_TypeList" :min="1" style="display:inline-block;margin-left:10px;">
<el-checkbox label="express">快递配送</el-checkbox>
<el-checkbox label="offline">到店自提</el-checkbox>
<el-checkbox label="city">同城配送</el-checkbox>
......@@ -183,6 +279,41 @@
</template>
<!-- 轮播图 -->
<template v-if="checkIndex==2">
<div class="head-title">
轮播图管理
</div>
<div class="content clearfix">
<div class="app-banner-list" style="float:left;"
@click="isShowLunbo=true,clearMsg(),ischoiceLunbo=true,isEditLunbo=false">
<div class="el-card app-banner-list-item" style="text-align:center;">
<div class="el-card__body" style="padding: 0px;">
<i class="el-icon-plus app-banner-add-icon"></i>
<div class="shuff_add">添加轮播图</div>
</div>
</div>
</div>
<div>
<div class="app-banner-list" v-for="(item,index) in msg.imgList" :key="index">
<div class="el-card app-banner-list-item">
<div style="padding:0">
<div style="position: relative;">
<img class="banner_topImg" :src="getIconLink(item.NavImg)" alt="">
<el-tooltip slot="label" class="item" effect="dark" content="修改" placement="top">
<img class="editImg" src="../../assets/img/userman/edit.png" alt="" @click="EditRole(item,index)">
</el-tooltip>
<el-tooltip slot="label" class="item" effect="dark" content="删除" placement="top">
<img class="delImg" src="../../assets/img/userman/del.png" alt="" @click="RemmoveRole(index)">
</el-tooltip>
</div>
</div>
<div class="banner_btmDiv">
<div class="app-banner-text">标题：{{item.NavName}}</div>
<div class="app-banner-text">路径：{{item.NavLink}}</div>
</div>
</div>
</div>
</div>
</div>
</template>
<!-- 拼团广告 -->
......@@ -202,10 +333,15 @@
</div>
</el-form-item>
<el-form-item label="板块设置">
<!-- <el-row style="margin-bottom:15px;" v-for="(subItem,subIndex) in addMsg.MagicDataList" :key="subIndex">
<el-col :span="4">
<template v-if="msg.MagicDataList.length==0">
<el-tag type="danger">请先选择样式</el-tag>
</template>
<template v-else>
<el-row style="margin-bottom:15px;" v-for="(subItem,subIndex) in msg.MagicDataList" :key="subIndex">
<el-col :span="2">
<el-tooltip class="item" effect="dark" :content="'建议尺寸：'+subItem.size" placement="top">
<el-button size="mini" @click="choicImg=true,commonIndex=subIndex">选择图片</el-button>
<el-button size="mini" @click="choicImg=true,commonIndex=subIndex,ischoiceLunbo=false">选择图片
</el-button>
</el-tooltip>
<div class="customize-share-title">
<div class="zk_pic_box" style="width:80px;height:80px;" flex="main:center cross:center"
......@@ -214,29 +350,82 @@
</div>
</div>
</el-col>
<el-col :span="10">
<el-col :span="12">
<div style="display:flex;" flex="box:last">
<el-input type="text" v-model="subItem.Link" :disabled="true" size="small">
</el-input>
<div>
<el-button size="mini" @click="isShowLink=true,commonIndex=subIndex">选择链接</el-button>
<el-button size="mini" @click="isShowLink=true,commonIndex=subIndex,ischoiceLunbo=false">选择链接
</el-button>
</div>
</div>
</el-col>
</el-row> -->
</el-row>
</template>
</el-form-item>
</el-form>
</template>
<el-button size="small" style="margin:30px 0 150px 0;padding:9px 25px;" type="primary" @click="saveGroupBuyConfig">保 存</el-button>
<el-button size="small" style="margin:30px 0 150px 0;padding:9px 25px;" type="primary"
@click="saveGroupBuyConfig">保 存</el-button>
</div>
<!-- 选择图片文件 -->
<el-dialog :title="commonTitle" :visible.sync="isShowLunbo" width="960px">
<el-form label-width="100px" :model="addMsg" :rules="rules" ref="addMsg">
<el-form-item label="标题" prop="NavName">
<el-input type="text" v-model="addMsg.NavName" size="small" maxlength="50"></el-input>
</el-form-item>
<el-form-item label="跳转链接">
<el-input type="text" v-model="addMsg.NavLink" size="small" :disabled="true" maxlength="200">
<el-button slot="append" @click="isShowLink=true">选择链接</el-button>
</el-input>
</el-form-item>
<el-form-item label="图片" prop="NavImg">
<el-tooltip class="item" effect="dark" content="建议尺寸:750 * 350" placement="top">
<el-button size="mini" @click="choicImg=true">选择图片</el-button>
</el-tooltip>
<div class="zk_pic_box" flex="main:center cross:center" style="width:80px;height:80px;"
:style="{backgroundImage:'url(' + getIconLink(addMsg.NavImg) + ')'}">
<i v-if="addMsg.NavImg==''" class="el-icon-picture-outline"></i>
</div>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="isShowLunbo = false" size="small">取消</el-button>
<el-button type="primary" @click="submitform('addMsg')" size="small">提交</el-button>
</span>
</el-dialog>
<!-- 选择图片文件 -->
<el-dialog title="选择文件" :visible.sync="choicImg" width="1240px">
<ChooseImg @SelectId="SelectId"></ChooseImg>
</el-dialog>
<!-- 选择链接 -->
<el-dialog title="选择链接" :visible.sync="isShowLink" width="800px">
<chooseMenu ref="chooseMenu"></chooseMenu>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="isShowLink=false">取 消</el-button>
<el-button size="small" type="danger" @click="getChoiceLink()">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import UE from '@/components/global/UE.vue'
import ChooseImg from "@/components/global/ChooseImg.vue";
import chooseMenu from "../common/chooseMenu.vue";
export default {
data() {
return {
ischoiceLunbo: false,
commonTitle: '',
commonIndex: -1,
choicImg: false,
isShowLink: false,
isShowLunbo: false,
isEditLunbo: false,
commonImgIndex: -1,
activeName: '1',
checkIndex: 1,
config: {
......@@ -257,12 +446,91 @@
RuleText: '', //活动规则
Is_Advertisement: 1, //拼团广告状态
Goods_Poster: "",
}
Style: 0, //魔方样式
MagicDataList: [],
imgList: []
},
//样式选择枚举
styleList: [{
Id: 0,
size: ['750*360'],
Style: 1,
ImgUrl: this.domainManager().ImageUrl + '/Static/cube1-1.png'
}, {
Id: 1,
size: ['300*360', '450*360'],
Style: 2,
ImgUrl: this.domainManager().ImageUrl + '/Static/cube1-2.png'
}, {
Id: 2,
size: ['300*360', '450*180', '450*180'],
Style: 3,
ImgUrl: this.domainManager().ImageUrl + '/Static/cube1-3.png'
}, {
Id: 3,
size: ['300*360', '450*180', '225*180', '225*180'],
Style: 4,
ImgUrl: this.domainManager().ImageUrl + '/Static/cube1-4.png'
}, {
Id: 4,
size: ['375*240', '375*240'],
Style: 2,
ImgUrl: this.domainManager().ImageUrl + '/Static/cube2-1.png'
}, {
Id: 5,
size: ['250*240', '250*240', '250*240'],
Style: 3,
ImgUrl: this.domainManager().ImageUrl + '/Static/cube2-2.png'
}, {
Id: 6,
size: ['188*188', '188*188', '188*188', '188*188'],
Style: 4,
ImgUrl: this.domainManager().ImageUrl + '/Static/cube2-3.png'
}, {
Id: 7,
size: ['375*186', '375*186', '375*186', '375*186'],
Style: 4,
ImgUrl: this.domainManager().ImageUrl + '/Static/cube3-1.png'
}],
defaultMsg: [{
ImgUrl: '',
Link: ''
}, {
ImgUrl: '',
Link: ''
}, {
ImgUrl: '',
Link: ''
}, {
ImgUrl: '',
Link: ''
}],
//添加轮播图obj
addMsg: {
NavName: '', //标题
NavLink: '', //跳转链接
NavImg: '' //图片链接
},
rules: {
NavName: [{
required: true,
message: "标题不能为空",
trigger: "change"
}],
NavImg: [{
required: true,
message: "图片不能为空",
trigger: "change"
}]
},
};
},
created() {},
components: {
UE
UE,
ChooseImg,
chooseMenu
},
methods: {
//切换
......@@ -270,11 +538,21 @@
this.checkIndex = tab.name;
},
//点击选择广告
getStyleType() {
getStyleType(Id, Style) {
this.isActive = Id;
this.msg.Style = Id;
this.msg.MagicDataList = [];
for (var i = 0; i < Style; i++) {
this.msg.MagicDataList.push(this.defaultMsg[i]);
}
this.msg.MagicDataList.forEach((x, index) => {
x.size = this.styleList[Id].size[index]
})
},
//保存拼团配置
saveGroupBuyConfig() {
let content = this.$refs.ue.getUEContent();
this.msg.RuleText = content;
this.apipost("/api/GroupBuy/SetGroupBuyConfig", this.msg, res => {
if (res.data.resultCode == 1) {
this.getGroupBuyConfig();
......@@ -291,13 +569,99 @@
var dataObj = res.data.data;
console.log("dataObj", dataObj);
if (dataObj) {
this.msg.GroupByConfigId=dataObj.GroupByConfigId;
this.msg.Is_Share=dataObj.Is_Share;
this.msg.Is_Territorial_Limitation=dataObj.Is_Territorial_Limitation;
this.msg.Payment_TypeList=dataObj.Payment_TypeList;
this.msg.Send_TypeList=dataObj.Send_TypeList;
this.msg.Is_Coupon=dataObj.Is_Coupon;
this.msg.SVIP_Status=dataObj.SVIP_Status;
this.msg.Is_Member_Price=dataObj.Is_Member_Price;
this.msg.Is_Integral=dataObj.Is_Integral;
this.msg.Is_Advertisement=dataObj.Is_Advertisement;
this.msg.Goods_Poster=dataObj.Goods_Poster;
if (dataObj.RuleText && dataObj.RuleText != "") {
this.msg.RuleText=dataObj.RuleText;
}
}
} else {
this.Info(res.data.message);
}
})
},
//清空消息
clearMsg() {
this.commonTitle = '添加轮播图';
this.addMsg.NavName = '';
this.addMsg.NavLink = '';
this.addMsg.NavImg = '';
},
//选择图片
SelectId(msg) {
if (this.ischoiceLunbo) {
this.addMsg.NavImg = msg.url;
} else {
if (this.commonIndex > -1) {
this.defaultMsg[this.commonIndex].ImgUrl = msg.url;
}
}
this.choicImg = false;
},
//获取选择链接
getChoiceLink() {
//调用子组件方法
var obj = this.$refs.chooseMenu.getChooseMenu();
if (this.ischoiceLunbo) {
this.addMsg.NavLink = obj.PageUrl;
} else {
if (this.commonIndex > -1) {
this.defaultMsg[this.commonIndex].Link = obj.PageUrl;
}
}
this.isShowLink = false;
},
submitform(addMsg) {
//提交创建、修改表单
this.$refs[addMsg].validate(valid => {
if (valid) {
this.addShuffImg();
} else {
return false;
}
});
},
addShuffImg() {
this.commonTitle = '添加轮播图';
var obj = JSON.parse(JSON.stringify(this.addMsg))
if (!this.isEditLunbo) {
this.msg.imgList.push(obj);
} else {
this.msg.imgList[this.commonImgIndex].NavName = obj.NavName;
this.msg.imgList[this.commonImgIndex].NavLink = obj.NavLink;
this.msg.imgList[this.commonImgIndex].NavImg = obj.NavImg;
}
this.isShowLunbo = false;
},
//修改
EditRole(item, index) {
this.commonTitle = '轮播图编辑';
this.isShowLunbo = true;
this.isEditLunbo = true;
this.commonImgIndex = index;
this.addMsg.NavName = item.NavName;
this.addMsg.NavLink = item.NavLink;
this.addMsg.NavImg = item.NavImg;
},
//删除
RemmoveRole(index) {
this.msg.imgList.splice(index, 1);
},
//新窗口打开链接
openNewUrl(path) {
let routeData = this.$router.resolve({
name: path
});
window.open(routeData.href, '_blank');
}
},
mounted() {
......
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